@charset "UTF-8";
/* ----------------------------------------
規約同意画面
---------------------------------------- */
.lower_ttl{
    position: relative;
    width: 100%;
    background: url(../img/lower_ttl_bg.jpg) center center no-repeat;
    background-size: cover;
    padding-top: 17.857142857142858%;
}
.lower_ttl h2{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    font-size: 3rem;
    font-weight: bold;
    text-align: center;
}
.agreement_Wrap .lead_txt{
    margin: 40px auto;
}
.agreement_Wrap .cta_Box{
    width: 100%;
    max-width: 500px;
    margin: 0 auto 30px;
}
.agreement_Box{
    width: 100%;
    margin: 30px auto;
    text-align: center;
}
.agreement_Box input[type=checkbox]{
    width: 20px;
    height: 20px;
    vertical-align: sub;
    margin-right: 5px;
    cursor: pointer;
}
.agreement_Box label{
    font-size: 1.6rem;
    color: #333;
}
.agreement_Box .cta_Box02{
    margin: 30px auto;
}
.agreement_Box .cta_Box02 .cta_Btn{
    padding: 15px 20px;
}
.agreement_Box .cta_Box02 .cta_Btn.return_Btn{
    width: 40%;
    color: #555;
    border: #555 2px solid;
}
.cta_Btn.return_Btn:hover {
    transform: translateX(-5px);
}
.agreement_Box .cta_Box02 .cta_Btn.join_Btn{
    width: 58%;
    opacity: 0.3;
    pointer-events: none;
    transition: 0.3s;
}
.agreement_Box .cta_Box02 .cta_Btn.return_Btn .arrow-ic{
    color: #555;
    right: unset;
    left: 15px;
}
input[type=checkbox]:checked ~ .cta_Box02 .join_Btn {
    opacity: 1;
    pointer-events: unset;
}

/* ----------------------------------------
利用規約
---------------------------------------- */
.terms_Wrap .Box{
    margin-bottom: 40px;
}
.terms_Wrap .Box h3{
    text-align: left;
    margin-bottom: 25px;
}
.terms_Wrap .Box h3[id]{
    margin-top: -70px;
    padding-top: 70px;
}
.terms_Wrap .Box h3::after{
    width: 100%;
    height: 2px;
    left: 0;
    transform: none;
}
.terms_Wrap .Box h3 span.oswald{
    font-size: 110%;
    font-weight: 600;
    padding-right: 5px;
    vertical-align: text-bottom;
    color: var(--blue);
}
.terms_Wrap .Box .txt {
    margin-bottom: 15px;
    /* padding: 0 5px; */
    letter-spacing: 0.05em;
}
.terms_Wrap .txt.right{
    text-align: right;
}
.terms_Wrap .Box a{
    text-decoration: underline;
    word-wrap:break-word;
}
.terms_Wrap .Box a:hover{
    text-decoration: none;
}
.terms_Wrap .Box ol li,
.terms_Wrap .Box ul li{
    position: relative;
    font-size: 1.6rem;
    line-height: 1.5;
    margin-bottom: 15px;
    padding-left: 1.5em;
}
.terms_Wrap .Box ol.main_List li::before{
    position: absolute;
    font-size: 1.6rem;
    font-weight: 600;
    /* font-family: "Oswald", sans-serif; */
    top: 0;
    left: 0;
}
.terms_Wrap .Box ol.main_List li:nth-child(1)::before{ content: "1.";}
.terms_Wrap .Box ol.main_List li:nth-child(2)::before{ content: "2.";}
.terms_Wrap .Box ol.main_List li:nth-child(3)::before{ content: "3.";}
.terms_Wrap .Box ol.main_List li:nth-child(4)::before{ content: "4.";}
.terms_Wrap .Box ol.main_List li:nth-child(5)::before{ content: "5.";}
.terms_Wrap .Box ol.main_List li:nth-child(6)::before{ content: "6.";}
.terms_Wrap .Box ol.main_List li:nth-child(7)::before{ content: "7.";}
.terms_Wrap .Box ol.main_List li:nth-child(8)::before{ content: "8.";}
.terms_Wrap .Box ol.main_List li:nth-child(9)::before{ content: "9.";}
.terms_Wrap .Box ol.main_List li:nth-child(10)::before{ content: "10.";}
.terms_Wrap .Box ol.main_List li:nth-child(11)::before{ content: "11.";}
.terms_Wrap .Box ol.main_List li:nth-child(12)::before{ content: "12.";}
.terms_Wrap .Box ol.main_List li:nth-child(13)::before{ content: "13.";}
.terms_Wrap .Box ol.main_List li:nth-child(14)::before{ content: "14.";}
.terms_Wrap .Box ol.main_List li:nth-child(15)::before{ content: "15.";}
.terms_Wrap .Box ol.main_List li:nth-child(16)::before{ content: "16.";}
.terms_Wrap .Box ol.main_List li:nth-child(17)::before{ content: "17.";}
.terms_Wrap .Box ol.main_List li:nth-child(18)::before{ content: "18.";}
.terms_Wrap .Box ol.main_List li:nth-child(19)::before{ content: "19.";}
.terms_Wrap .Box ol.main_List li:nth-child(20)::before{ content: "20.";}

.terms_Wrap .Box ol.sub_List li{
    padding-left: 2.5em;
}
.terms_Wrap .Box ol.sub_List li::before{
    position: absolute;
    font-size: 1.6rem;
    top: 0;
    left: 0;
}
.terms_Wrap .Box ol.sub_List li:nth-child(1)::before{ content: "（1）";}
.terms_Wrap .Box ol.sub_List li:nth-child(2)::before{ content: "（2）";}
.terms_Wrap .Box ol.sub_List li:nth-child(3)::before{ content: "（3）";}
.terms_Wrap .Box ol.sub_List li:nth-child(4)::before{ content: "（4）";}
.terms_Wrap .Box ol.sub_List li:nth-child(5)::before{ content: "（5）";}
.terms_Wrap .Box ol.sub_List li:nth-child(6)::before{ content: "（6）";}
.terms_Wrap .Box ol.sub_List li:nth-child(7)::before{ content: "（7）";}
.terms_Wrap .Box ol.sub_List li:nth-child(8)::before{ content: "（8）";}
.terms_Wrap .Box ol.sub_List li:nth-child(9)::before{ content: "（9）";}
.terms_Wrap .Box ol.sub_List li:nth-child(10)::before{ content: "（10）";}
.terms_Wrap .Box ol.sub_List li:nth-child(11)::before{ content: "（11）";}
.terms_Wrap .Box ol.sub_List li:nth-child(12)::before{ content: "（12）";}
.terms_Wrap .Box ol.sub_List li:nth-child(13)::before{ content: "（13）";}
.terms_Wrap .Box ol.sub_List li:nth-child(14)::before{ content: "（14）";}
.terms_Wrap .Box ol.sub_List li:nth-child(15)::before{ content: "（15）";}
.terms_Wrap .Box ol.sub_List li:nth-child(16)::before{ content: "（16）";}
.terms_Wrap .Box ol.sub_List li:nth-child(17)::before{ content: "（17）";}
.terms_Wrap .Box ol.sub_List li:nth-child(18)::before{ content: "（18）";}
.terms_Wrap .Box ol.sub_List li:nth-child(19)::before{ content: "（19）";}
.terms_Wrap .Box ol.sub_List li:nth-child(20)::before{ content: "（20）";}

.terms_Wrap .Box ol.main_List ol.sub_List{
    margin-top: 10px;
}
.terms_Wrap .Box ol.main_List ol.sub_List li::before{
    font-weight: 400;
}

.terms_Wrap .Box ol.main_List ul.subsub_List{
    margin-top: 10px;
}
.terms_Wrap .Box ul.subsub_List li{
    padding-left: 3em;
}
.terms_Wrap .Box ul.subsub_List li::before{
    position: absolute;
    font-size: 1.6rem;
    top: 0;
    left: 0;
}
.terms_Wrap .Box ul.subsub_List li:nth-child(1)::before{ content: "（ア）";}
.terms_Wrap .Box ul.subsub_List li:nth-child(2)::before{ content: "（イ）";}
.terms_Wrap .Box ul.subsub_List li:nth-child(3)::before{ content: "（ウ）";}
.terms_Wrap .Box ul.subsub_List li:nth-child(4)::before{ content: "（エ）";}
.terms_Wrap .Box ul.subsub_List li:nth-child(5)::before{ content: "（オ）";}

.terms_Wrap h4{
    position: relative;
    padding-left: 1.2em;
    font-size: 2rem;
    font-weight: 600;
    line-height: 1.4;
    margin: 30px 0 10px;
}
.terms_Wrap h4::before{
    position: absolute;
    content: "■";
    color: var(--blue);
    font-size: inherit;
    top: 0;
    left: 0;
}
.terms_Wrap .Box ul.txt_List{
    padding-left: 1em;
}
.terms_Wrap .Box ul.txt_List li{
    margin-bottom: 10px;
    padding-left: 1em;
}
.terms_Wrap .Box ul.txt_List li::before{
    position: absolute;
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--blue);
    top: 0.5em;
    left: 0;
}
.terms_Wrap .Box .note{
    font-size: 1.2rem;
    line-height: 1.3;
}
.terms_Wrap .Box .note.mt10{
    display: block;
    margin-top: 10px;
}

/* ============================================================
PC（1600px~）
============================================================ */
@media screen and (min-width:1600px) {
}

/* ============================================================
PC(~1200px)
============================================================ */
@media screen and (max-width:1200px) {

}

/* ============================================================
TAB（768~1100px）
============================================================ */
@media screen and (max-width:1000px) {
}

/* ============================================================
SP（~768px）
============================================================ */
@media screen and (max-width:768px) {

    /* ----------------------------------------
    規約同意画面
    ---------------------------------------- */
    #agreement header{
        padding: 4px 0 4px 8px;
    }
    #agreement header .inner .right_Box .point_Box{
        margin-right: 8px;
    }
    .lower_ttl{
        padding-top: 40%;
    }
    .lower_ttl h2 {
        width: 100%;
        top: 62%;
        font-size: 2rem;
    }
    .agreement_Wrap .lead_txt {
        margin: 20px auto;
    }
    .agreement_Box {
        margin: 30px auto 0;
    }
    .agreement_Box input[type=checkbox] {
        width: 16px;
        height: 16px;
        margin-right: 3px;
    }
    .agreement_Box label {
        font-size: 1.4rem;
        line-height: 1.5;
    }
    .agreement_Box .cta_Box02 {
        margin: 0 auto;
    }
    .agreement_Box .cta_Box02 .cta_Btn.return_Btn,
    .agreement_Box .cta_Box02 .cta_Btn.join_Btn{
        width: 100%;
    }

    /* ----------------------------------------
    利用規約
    ---------------------------------------- */
    .terms_Wrap .Box ol li,
    .terms_Wrap .Box ul li{
        font-size: 1.4rem;
    }
    .terms_Wrap .Box ol.main_List li::before,
    .terms_Wrap .Box ol.sub_List li::before,
    .terms_Wrap .Box ul.subsub_List li::before{
        font-size: 1.4rem;
    }
    .terms_Wrap h4{
        font-size: 1.8rem;
    }
}