@charset "utf-8";
.clubLeadArea{
    text-align: center;
    background: url(/system/files/club/202006/img/img-sprites.png) 0 0 repeat;
    padding: 41px 0 38px;
}
.clubSectionArea{
    margin: 61px 0 60px;
    padding-bottom: 76px;
    border-bottom: 1px solid #dbdbdb;
}
.clubSectionArea > ul > li{
    width: 533px;
    margin-right: 38px;
    margin-bottom: 45px;
    float: left;
}
.clubSectionArea dt{
    border-bottom: 0;
}
.clubSectionArea dt img{
    display: inline-block;
    width: 73px;

} 
.right-up-btn { 
	opacity: 1; 
	z-index: 100;
}
.right-up-btn.show_time {
	opacity: 1;  
} 
.clubSectionArea dt p{
    display: inline-block;
    width: 455px;
    vertical-align: middle;
    font-size: 2.2rem;
    font-weight: bold;
    padding-left: 13px; 
}
.clubSectionArea dt::before {
    position: absolute;
    bottom: -1px;
    left: 0;
    border-bottom: 3px solid #000;
    content: '';
    width: 100%;
    z-index: 100;
}
.clubSectionArea dd{
    padding: 30px 20px 0 23px;
}
.clubSectionArea dd img{
    max-width: 159px;
    float: left;
}
.clubSectionArea dd div{
    width: 302px;
    float: right;
    margin-top: 8px;
}
.clubSectionArea > ul > li:nth-child(2n){
    margin-right: 0;
}
.clubSectionArea02 dt{
    margin-bottom: 10px;
    font-size: 2.4rem;
    font-weight: bold;
}
.clubSectionArea02 .clubTxt{
    margin-bottom: 2px;
}
.clubSectionArea02 .clubTxt span{
    color: #e80000;
    text-decoration: underline;
}
#contents01{
    text-align: center;
    margin-bottom: 50px;
}

#contents01 .c-linkArrow-l{
    text-align: right;
    margin: 10px 0 20px;
}
#contents01 .c-linkArrow-l a {
    position: relative; 
}
#contents01 .c-linkArrow-l a:before{
    left: 0;
}
.c-voiceTxt01 {
    padding: 0px 30px;
    font-size: 2rem;
    letter-spacing: 1.6px;
}
.contexts01_txt,
.contexts02_txt {
    text-align: center;
}
.contexts01_txt {
    padding-top: 35px;
    font-size: 3rem;
    font-weight: bold;
    width: 72%;
    margin-left:20%;
}
.contexts02_txt {
    padding-top: 20px;
    width: 90%;
    margin-left: 5%;
    font-weight: normal;
    font-size: 1.7rem;
}
.accounts_window1,
.accounts_window2 {
    display:inline-block;
    vertical-align: top;
}
.accounts_window1 > div,
.accounts_window2 > div {
    margin-top: 30px;
    position: relative;
    height: 380px;
    border: 3px solid #000000; 
    border-radius: 10px;
    overflow: hidden;
}
.accounts_window1_title,
.accounts_window2_title {
    font-weight: bold;
    position: relative;
    vertical-align: top;
    height: 80px;
    top: 0px;
    background: #159E19;
    font-size: 2rem;
}

.accounts_window1_under,
.accounts_window2_under {
    font-weight: bold;
    position: relative;
    vertical-align: top;
    height: 300px;
    top: 0px;
    background: white;
    font-size: 1.5rem;
    box-sizing: border-box;
}

.accounts_window1 {
    margin-left: 2%;
    margin-right: 2%;
    width: 63%;
}
.accounts_window2 {
    margin-left: 1%;
    margin-right: 2%;
    width: 18.5%;
}

.accounts_window_txt {
    position: absolute;
    top: 52%;
    width: 90%;
    margin-left: 5%;
    transform: translate(0, -50%);
    color: white;
}

.accounts_cards {
    margin-top: 30px;
    width: 80%;
    max-width: 593px;
}

.accounts_cards_txt {
    margin-top: 24px;
    width: 86%;
    margin-left: 8%;
    font-weight: normal;
    font-size: 1.7rem;
}

.accounts_cards_txt a{
    text-decoration:none;
}

.account_rakutenbank {
    margin-top: 80px;
    width: 80%;
    max-width: 93px;
}

.account_rakutenbank_link {
    position: absolute;
    width: 80%;
    margin-left: 10%;
    bottom: 40px;
}

.account_rakutenbank_link a {
    text-decoration:none;
    font-size: 1.6rem;
    font-weight: normal;
}
/*------------------
リンクホバー動作
------------------*/
.auto_underbar:link {
    text-decoration:none;
    color: black;
}
.auto_underbar:visited {
    text-decoration:none;
    color: black;
}
.auto_underbar:active {
    text-decoration:none;
    color: black;
}
.auto_underbar:hover {
    text-decoration:underline;
}
.set_underbar:link {
    text-decoration:underline;
    color: black;
}
.set_underbar:visited {
    text-decoration:underline;
    color: black;
}
.set_underbar:active {
    text-decoration:underline;
    color: black;
}
.auto_underbar:hover {
    text-decoration:underline;
}

.clear:before,.clear:after {content: " "; display: table;}
.clear:after {clear: both;}
.clear {*zoom: 1;}

/*------------------
追従入会ボタン
------------------*/
.right-up-btn {
    position: fixed;
    width: 140px;
    right: 5%;
    top: 65px;
    margin: 0;
    margin-left: 370px;
    z-index: 100;
}
.right-up-btn a:after {
    width: 100%;
    height: 100%;
    content: '';
    position: absolute;
    left: 8px;
    top: 8px;
    z-index: -1;
    border-radius: 10px;
    background: url(/system/files/club/202006/img/bg01.png);
}
.right-up-btn a {
    display: block;
    max-width: 140px;
    line-height: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
    -webkit-animation: popAnimations_01 3s ease-in-out 0s infinite;
    animation: popAnimations_01 3s ease-in-out 0s infinite;
}
.right-up-btn a:hover img,.right-up-btn a:hover svg{-webkit-transform:translate(8px,8px);transform:translate(8px,8px)}
@-webkit-keyframes popAnimations_01{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}80%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}85%{-webkit-transform:scale3d(.8,.8,.8);transform:scale3d(.8,.8,.8)}90%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}93%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}96%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes popAnimations_01{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}80%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}85%{-webkit-transform:scale3d(.8,.8,.8);transform:scale3d(.8,.8,.8)}90%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}93%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}96%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}

.member_oklist_card a:hover {
	display:block;
}
/*------------------
ライトボックス
------------------*/
#LightBoxEnable {
     display: none; position: fixed; top: 0; left: 0; width: 100%; max-width: 100%!important; height: 100%; background: rgba(0,0,0,0.45); z-index: 1000; }

#LightBoxEnable img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width:auto; height:auto; max-width:80%; max-height:100%; z-index: 1000; }
#LightBoxEnable p { position: absolute;/*絶対配置*/ color: white;/*文字は白に*/ z-index: 1001; }

.LightBox__close{ position:absolute; display:inline-block; top:-40px; left:-40px; width:80px; height:80px; border:0; background-color:black; border-radius:40px; margin:0; padding:0; transform:scale(0.5); cursor:pointer; }

.LightBox__close:before{ content:""; position:absolute; display:inline-block; top:20px; left:36px; width:9px; height:40px; border:0; border-radius:5px; margin:0; padding:0; background-color:white; -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); transform:rotate(45deg); }

.LightBox__close:after{ content:""; position:absolute; display:inline-block; top:20px; left:36px; width:9px; height:40px; border:0; border-radius:5px; margin:0; padding:0; background-color:white; -moz-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); }

.LightBox__close:hover{ background-color:red; }

/*------------------
SP処理
------------------*/
@media screen and (max-width: 767px) {/* 767px以下のスタイル */
    .mainInner {
        padding: 0 20px 0;
    }
    .clubLeadArea {
        padding: 21px 26px 24px;
    }
    .clubSectionArea {
        margin-top: 25px;
        margin-bottom: 0;
        padding-bottom: 40px;
        border: none;
    }
    .clubSectionArea > ul > li {
        width: 100%;
        margin-right: 0;
        float: none;
        margin-bottom: 24px;
        padding-bottom: 25px;
        border-bottom: 1px solid #e6e6e6;
    }
    .clubSectionArea > ul > li:last-child {
        border: none;
        margin: 0;
        padding: 0;
    }
    .clubSectionArea dt p{
        width: calc(100% - 78px);
    }
    .clubSectionArea dd {
        padding: 30px 0 0 0;
    }
    .clubSectionArea dd img {
        display: block;
        margin: 0 auto;
        float: none;
        max-width: 200px;
    }
    .clubSectionArea dd div {
        width: auto;
        float: none;
        margin-top: 17px;
        font-size: 1.7rem;
    }
    .clubSectionArea dd .c-attention01 {
        margin-bottom: 0;
    }
    .clubSectionArea02 {
        width: calc(100% + 40px);
        margin: 0 -20px;
        padding: 20px 20px 63px;
        background: #f0f0f0;
    }
    .clubSectionArea02 > dl {
        background: #fff;
        padding: 36px 30px 53px;
    }
    .clubSectionArea02 dt {
        margin-bottom: 22px;
        font-size: 1.9rem;
        border-bottom: 2px solid #000;
        padding-bottom: 9px;
    }
    .clubSectionArea02 .clubTxt {
        font-size: 1.6rem;
    }
    .accounts_window1,
    .accounts_window2 {
        margin-left: 0;
        margin-right: 0;
    }
    .accounts_window1 > div,
    .accounts_window2 > div {
        height: auto;
    }
    .accounts_window1 {
        margin-top: 30px;
    }
    .accounts_window2 {
        margin-top: 20px;
    }
    .accounts_window1, .accounts_window2 {
        height: auto;
        width: 100%;
    }
    .accounts_window1_under,
    .accounts_window2_under {
        height: auto;
    }
    .accounts_window1_under {
        padding: 0 0 35px;
    }
    .accounts_window2_under {
        padding: 0 15px 25px;
    }
    #contents01 {
        width: calc(100% + 30px);
        margin: 0 -15px;
    }
    .accounts_cards {
        margin-top: 40px;
        width: 89%;
        max-width: 235px;
    }
    .accounts_cards_txt {
        font-size: 1.7rem;
        margin: 30px auto 0;
    }
    .account_rakutenbank {
        margin-top: 4px;
        max-width: 110px;
        width: 82%;
    }
    .account_rakutenbank_link {
        position: static;
        width: 80%;
        font-size: 2rem;
        line-height: 1.3;
    }
    #contents01 .c-linkArrow-l {
        font-size: 1.6rem;
        margin: 10px 0 0 0;
    }
    #contents01 .c-linkArrow-l a {
        position: relative;
    }
    #contents01 .c-linkArrow-l a:before {
        left: 0;
    }
    .c-voiceTxt01 {
        font-size: 1.6rem;
    }
    .clubSectionArea02 .c-loginBtn-column1 {
        margin-top: 40px;
    }
    /*------------------
    追従入会ボタン
    ------------------*/
    .right-up-btn {
        right: 20px;
        top: 12.5vw;
        width: 243.5px;
        opacity: 1;
        pointer-events: none;
        -webkit-transition: .3s ease-in-out all;
        transition: .3s ease-in-out all;
    }
    .right-up-btn a {
        display: block;
        margin: 0 auto;
        margin-right: 0;
        width: 40.8vw;
        max-width: 243.5px;
    }
    .right-up-btn a:after {
        left: 5px;
        top: 5px;
        border-radius: 5px;
        background-size: 3px;
    }
    .right-up-btn.show_time {
        opacity: 1;
        top: 12vw;
        pointer-events: auto;
    }
}

@media screen and (min-width: 768px) {/* 768px以上のスタイル */
    .memberlink a:hover img,
    .contexts02_approved_left a:hover img,
    .member_oklist_card a:hover {
        transform:translate(8px,8px);
    }
    .memberlink a:after,
    .contexts02_approved_left a:after,
    .member_oklist_card a:after{
        width: 100%;
        height: 100%;
        left: 8px;
        top: 8px;
        content:'';
        position:absolute;
        z-index:-1;
        border-radius:10px;
        background:url("../img/img_bg01.png")
    }

    .contexts02_approved_left a:after,
    .member_oklist_card a:after{
        height: 95%;
    }
    .member_oklist_card a:hover:after {
        left: 0px;
        top: 0px;
    }
    .memberlink a:hover img,
    .contexts02_approved_left a:hover img,
    .member_oklist_card a:hover {
        transform:translate(8px,8px);
    }
}
@media screen and (min-width: 768px) {/* 768px以上のスタイル */
	.pc { display: block; }
	.sp { display: none !important; }
	img.pc,br.pc { display: inline; }
	img.sp,br.sp { display: none !important; }
}
@media screen and (max-width: 767px) {/* 767px以下のスタイル */
	.pc { display: none !important; }
    .sp { display: block; }
    img.pc,br.pc { display: none !important; }
	img.sp,br.sp { display: inline; }

}

@media print,
screen and (min-width: 768px) {

}


/* custome */
.clubSectionArea dt img{
    display: inline-block;
    width: 60px; 
}
.clubSectionArea dt{
    position: relative; 
}
 
.clubSectionArea dt p{
    position: relative;
    display: inline-block;
    width: 455px;
    vertical-align: middle;
    font-size: 1.8rem;
    font-weight: bold;
    padding-left: 5px; 
}
.clubSectionArea dt p span{
    font-size: 1.2rem;
    position: relative;
    top: -5px;
    right: -8px;
    font-weight: normal;
} 
.letscp{
    letter-spacing: -1.4px !important;
}
.letscp-2{
    letter-spacing: -2px !important;
}
.clubSectionArea dd div{
    width: 304px;
    float: right;
    margin-top: 8px;
}
.clubSectionArea02 .link-arrow{
    text-align: right;
    margin-top: 8px;
    border: 0;
}
#contents01 .accounts_window1 .c-linkArrow-l{
    margin-top: 0;
}
.clubSectionArea02 .c-linkArrow-l{
    display: inline-block; 
    position: relative;
    left: -30px;
}
.clubSectionArea dd div p{
    word-break: normal;
    font-size: 1.4rem;
}
.clubSectionArea dd div p.c-attention01{ 
    font-size: 1.2rem;
    margin-top: 7px;
}
.accounts_window1_title,
.accounts_window2_title {
    font-weight: bold;
    position: relative;
    vertical-align: top;
    height: 80px;
    top: 0px;
    background: #159E19;
    font-size: 1.8rem;
}
.accounts_cards_txt {
    margin-top: 24px;
    width: 73%;
    margin-left: 8%;
    font-weight: normal;
    font-size: 1.7rem;
}
.account_rakutenbank_link a,main p a, .set_underbar {
    color: #212121 !important; 
}
.accounts_window1_under .set_underbar:hover{
    opacity: 0.8;
}
.accounts_window1_under .set_underbar {
    color: #1449c2 !important;
}
.clubSectionArea02 dt {
    border-bottom:0
}
.headerTop{
    border-bottom: 1px solid #d9d9d9;
   }
   
@media screen and (max-width: 767px) {
   
    .auto_underbar:link{
        font-size: 1.4rem;
    }
    .clubSectionArea dd div p{
        margin-bottom: 5px;
    }
    .mainInner {
        padding: 0 10px 0;
    }
    .clubSectionArea dd div{
        width: 100%;
    }
    .clubSectionArea dd {
        padding: 22px 0 0 0;
    }
    .clubSectionArea dd img {
        display: block;
        margin: 0 auto;
        float: none;
        max-width: 220px;
    }
    .clubSectionArea02 {
        width: calc(100% + 20px);
        margin: 0 -10px;
        padding: 10px 10px 63px;
        background: #f0f0f0;
    }
    
    .clubSectionArea02 > dl {
        background: #fff;
        padding: 15px 10px 0;
    }
    .clubSectionArea02 dt {
        margin-bottom: 0;
        font-size: 1.9rem; 
        padding-bottom: 9px;
    }
    .clubSectionArea02 .clubTxt {
        font-size: 1.4rem;
    }
    .accounts_window1 {
        margin-top: 5px;
    }
    .accounts_window2 {
        margin-top: 0;
        margin-bottom: 34px;
    }
    .accounts_window1, .accounts_window2 {
        height: auto;
        width: 100%;
        padding: 0 15px;
    }
    .accounts_cards {
        margin-top: 40px;
        width: 89%;
        max-width: 263px;
    }
    .accounts_cards_txt {
        font-size: 1.4rem;
        margin: 30px auto 0;
    }
    #contents01 .c-linkArrow-l a {
        position: relative;
        font-size: 1.4rem;
    }
}
.clubSectionArea dt p{
    width: calc(100% - 78px);
}
@media screen and (min-width: 768px) { 
    .clubSectionArea02 .c-linkArrow-l02{
        left: 0;
    }
    .clubSectionArea02 .link-arrow{
        text-align: left;
    }
    .t-right{
        text-align: right !important;
    }
    .letscp{
        letter-spacing: 0 !important;
    }
    .letscp-1{
        letter-spacing: -1px !important;
    }
    .clubSectionArea dt::before{
        position: absolute;
        bottom: -1px;
        left: 0;
        border-bottom: 3px solid #000;
        content:'';
        width: 100%;
        z-index: 100;
    }
    .letscp-2{
        letter-spacing: 0 !important;
    }
    .accounts_cards_txt{
        width: 85%;
    }
    .clubSectionArea dt img{
        width: 73px;
    }
    .clubSectionArea dt p{
        font-size: 2rem;
        padding-left: 13px; 
    }
    .clubSectionArea dt p span{
        font-size: 1.4rem;
        position: relative;
        top: -5px;
        font-weight: normal;
    } 
    .clubSectionArea { 
        padding-bottom: 0px;
        border-bottom: 3px solid #dbdbdb;
    }
    .clubSectionArea > ul > li{
        margin-bottom: 75px;
    }
    #contents01{
        margin-bottom: 10px;
    }
    .accounts_window1 .link-arrow{
        height: auto;
    } 
    .clubSectionArea dd div p{
        font-size: 1.6rem;
    }
    .clubSectionArea dd div p.c-attention01{
        font-size: 1.4rem;
        margin-bottom: 0;
        margin-top: 0;
    }
    .clubSectionArea dd div p{
        margin-bottom: 7px;
    }
}
.headerNav,.stickyNavWrap{
    display: none;
}
ul.c-attention01 li{
    margin-top: 0;
}
.ico_altWin05{
    position: relative;
    display: inline-block;
    
}
.ico_altWin05::after{
    position: absolute;
    top: 50%;
    right: -25px;
    content: '';
    background: url(/system/files/club/common/img/ico_altWin05.png) no-repeat;
    background-size: contain;
    width: 18px;
    height: 17px;
    transform: translate(0, -80%);
}

@media screen and (max-width: 390px) { 
    .clubSectionArea02 .c-linkArrow-l.custome-arrow-window{
        left: 0;
    }
    .custome-arrow-window a.spOnly{
        text-align: left;
        max-width: 99%;
    }
}