@charset "utf-8";

.magazine {
    font-family: Yu Gothic Medium,游ゴシック Medium,YuGothic,游ゴシック体,ヒラギノ角ゴ Pro W3,メイリオ,sans-serif;
    font-size: 22px;
    font-size: 2.2rem;
    color: #346580
}

.magazine ::selection {
    color: #fff;
    background: #346580
}

.magazine ::-moz-selection {
    color: #fff;
    background: #346580
}

.magazine a {
    color: #000;
    text-decoration: none
}

.lp {
    background-image: url(/cms/magazine/t2403/01/img/250401/bg_006.jpg);
    background-size: cover;
    background-attachment: fixed
}

.magazine .wrapper {
    max-width: 750px;
    margin: auto
}

.magazine .wrapper img {
    max-width: 100%;
    height: auto
}

.sec_01_01 {
    background-image: url(/cms/magazine/t2403/01/img/250401/bg_001.png)
}

.sec_01_03 {
    background-color: #a5c2c8;
    padding-bottom: 5pc
}

#foot_banner {
    width: 100%;
    display: none;
    position: fixed;
    z-index: 1;
    left: 50%;
    bottom: 0;
    transform: translate(-50%,0)
}

#foot_banner,.offer_float {
    max-width: 750px
}

.offer_float .close_btn {
    position: absolute;
    top: 6px;
    right: 8%;
    width: 30px;
    height: 30px
}

.offer_float .close_btn:after,.offer_float .close_btn:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2px;
    height: 30px;
    background: #346580
}

.offer_float .close_btn:before {
    transform: translate(-50%,-50%) rotate(45deg)
}

.offer_float .close_btn:after {
    transform: translate(-50%,-50%) rotate(-45deg)
}

.offer_float .close_btn:hover {
    cursor: pointer
}

.sec_02_all {
    background-image: url(/cms/magazine/t2403/01/img/250401/bg_002.jpg);
    background-size: 750px;
    padding-bottom: 5pc
}

.sec_02_01 {
    max-width: 650px;
    width: 86%;
    background: hsla(0,0%,100%,.7);
    border-radius: 140px 0 140px;
    margin: auto
}

.sec_02_01 .acd_01 {
    max-width: 550px;
    width: 86%;
    background-color: #fff;
    margin: auto;
    padding: 20px
}

.sec_02_01 .acd_01 h3 {
    font-size: 25px;
    /* font-size: 2.5rem; */
}

.sec_02_01 .acd_01 ul {
    line-height: 1.8em;
    margin-top: 1.4em;
    padding-left: 1em;
    font-size: 22px;
}

.sec_02_01 .acd_01 ul li {
    text-indent: -1em
}

.acd_basic h3 {
    position: relative
}

.acd_basic h3:before {
    transform: translateY(-50%);
    transition: opacity .3s
}

.acd_basic h3:after,.acd_basic h3:before {
    content: '';
    display: inline-block;
    width: 26px;
    height: 2px;
    background-color: #346580;
    position: absolute;
    right: 0;
    top: 50%
}

.acd_basic h3:after {
    transform: translateY(-50%) rotate(90deg);
    transition: transform .3s
}

.acd_basic h3.show:before {
    opacity: 0
}

.acd_basic h3.show:after {
    transform: translateY(-50%) rotate(180deg)
}

.acd_basic ul {
    display: none
}

.sec_02_02 .mov_area {
    position: relative;
    max-width: 580px;
    width: 80%;
    margin: auto
}

.sec_02_02 .mov_area .youtube {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9
}

.sec_02_02 .mov_area span {
    width: 4%;
    position: absolute;
    right: -5%;
    bottom: 4px
}

.sec_02_02 .mov_area span img {
    width: 100%;
    height: auto
}

.caution {
    font-size: 25px;
    /* font-size: 2.5rem; */
    background-color: #fff;
    margin: 40px auto 90pt;
    padding: 20px
}

.caution,.offer {
    max-width: 650px;
    width: 86%
}

.offer {
    position: relative;
    background-color: #e8bbb1;
    margin: auto;
    padding: 5pc 30px 60px
}

.offer span {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%)
}

.offer span img {
    width: 100%;
    height: auto
}

.offer .price_25p,.offer .price_4400p,.offer .price_7150p {
    width: 86%;
    margin: auto
}

.offer .price_7150p {
    margin-top: 55px
}

.offer .price_4400p-2,.offer .price_7150p-2 {
    width: 100%;
    margin: auto
}

.offer .price_7150p-2 {
    margin-top: 25px
}

.offer .offer_btn {
    margin-top: 20px
}

.offer .offer_btn img {
    box-shadow: 5px 5px 5px rgba(0,0,0,.2);
    border-radius: 5pc
}

.offer .offer_btn a {
    transition: .3s
}

.offer .offer_btn a:hover {
    opacity: .8
}

.sec_03_all {
    background-image: url(/cms/magazine/t2403/01/img/250401/bg_003.jpg)
}

.sec_03_all,.sec_04_all {
    background-size: 750px;
    padding-bottom: 5pc
}

.sec_04_all {
    background-image: url(/cms/magazine/t2403/01/img/250401/bg_005.png);
    background-repeat: no-repeat;
    background-color: #feeede;
}

.sec_04_02 {
    background-image: url(/cms/magazine/t2403/01/img/250401/bg_004.png)
}

.sec_04_02,.sec_04_03 {
    background-size: 750px;
    background-repeat: no-repeat;
    background-position: bottom
}

.sec_04_03 {
    background-image: url(/cms/magazine/t2403/01/img/250401/bg_004-2.png);
    padding-bottom: 50px
}

.sec_04_03 .acd_02 {
    max-width: 550px;
    width: 76%;
    background-color: #edf6f4;
    margin: auto
}

.sec_04_03 .acd_02 h3 {
    font-size: 25px;
    /* font-size: 2.5rem; */
    padding: 20px;
    margin-bottom: 0;
}

.sec_04_03 .acd_02 h3:after,.sec_04_03 .acd_02 h3:before {
    right: 20px
}

.sec_04_03 .acd_02 .cont {
    display: none;
    margin: 0;
}

.sec_04_02 .btn_03 {
    width: 78%;
    margin: auto
}

.btn_03 a {
    transition: .3s
}

.btn_03 a:hover {
    opacity: .8
}

.sec_05_all {
    background-color: #82c2ce;
    padding-bottom: 75pt
}

.btm {
    padding-bottom: 90pt
}

.sec_01_03 .offer,.sec_05_all .offer {
    max-width: 660px;
    width: 86.9%;
    border-right: 2px solid #fff;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff
}

.pTop {
    position: fixed;
    right: 50px;
    bottom: 50px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    z-index: 2;
    cursor: pointer;
    border: 1px solid #346580
}

.pTop:hover {
    opacity: .6
}

.pTop_icon {
    position: relative;
    display: block;
    width: 100%;
    height: 100%
}

.pTop_icon:after,.pTop_icon:before {
    content: "";
    position: absolute;
    top: 23px;
    width: 9pt;
    height: 2px;
    background-color: #346580
}

.pTop_icon:before {
    left: 14px;
    transform: rotate(-45deg)
}

.pTop_icon:after {
    right: 14px;
    transform: rotate(45deg)
}

@media screen and (max-width: 980px) {
    .pTop {
        display:none
    }
}

@media screen and (max-width: 768px) {
    .caution,body {
        font-size:3vw
    }

    h3 {
        font-size: 3.3vw!important
    }

    .offer_float .close_btn {
        width: 15px;
        height: 15px
    }

    .offer_float .close_btn:after,.offer_float .close_btn:before {
        width: 1px;
        height: 15px
    }

    .btm,.sec_01_03,.sec_02_all,.sec_03_all,.sec_04_all {
        padding-bottom: 50px
    }

    .sec_04_02 {
        padding-bottom: 0
    }

    .sec_04_03 {
        padding-bottom: 25px
    }

    .sec_02_all,.sec_03_all,.sec_04_02,.sec_04_03,.sec_04_all {
        background-size: 100%;
    }

    .sec_05_all {
        padding-bottom: 90pt
    }

    .offer {
        width: 86%;
        padding: 45px 15px 30px
    }

    .sec_01_03 .offer,.sec_05_all .offer {
        border-right: 1px solid #fff;
        border-left: 1px solid #fff;
        border-bottom: 1px solid #fff
    }

    .offer .offer_btn {
        margin-top: 15px
    }

    .sec_02_01 {
        border-radius: 5pc 0
    }

    .sec_02_01 .acd_01 {
        padding: 10px
    }

    .acd_basic h3:after,.acd_basic h3:before {
        width: 13px;
        height: 1px
    }

    .caution {
        font-size: 3.6vw!important;
        margin: 20px auto 60px;
        padding: 14px
    }

    .sec_04_03 .acd_02 h3 {
        padding: 10px;
        margin-bottom: 0;
    }

    .sec_04_03 .acd_02 h3:after,.sec_04_03 .acd_02 h3:before {
        right: 10px
    }

.sec_02_01 .acd_01 ul {
    font-size: 3vw;
    /* margin-top: 1em; */
}



    
}
