@charset "UTF-8";



.inBlock *[class*="inBlock"],
.inBlock_XL *[class*="inBlock"],
.inBlock_L *[class*="inBlock"],
.inBlock_M *[class*="inBlock"],
.inBlock_S *[class*="inBlock"],
.inBlock_XS *[class*="inBlock"] {
    padding-right: 0;
    padding-left: 0;
    max-width: 20.75em;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 501px) {

    .inBlock,
    .inBlock_XL,
    .inBlock_L,
    .inBlock_M,
    .inBlock_S,
    .inBlock_XS {
        padding-right: 28px;
        padding-left: 28px;
    }
}


#main {
    color: #2D2D2D;
    position: relative;
}

#bg-wrap {
    width: 0;
    height: 0;
    top: 0;
    position: fixed;
}

#bg-wrap.over {
    position: absolute;
    left: 0;
    bottom: 0;
    top: auto;
}

#bg-wrap .bg-inner {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

#bg-wrap.over .bg-inner {
    transform: translateY(-100%);
}

#bg-wrap .bg-inner .bg {
    width: 100vw;
    height: 100%;
}

#bg-wrap .bg-inner .bg img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (min-width: 769px) {
    #bg-wrap .bg-inner {
        width: calc(100vw - 185px - 83px);
    }

    #bg-wrap .bg-inner .bg {
        margin-left: -185px;
        margin-right: -83px;
    }
}

#magazine {
    background: #FFF;
    color: #2D2D2D;
    position: relative;
}

@media (min-width: 769px) {
    #magazine {
        max-width: 750px;
        width: 100%;
        margin-left: auto;
        margin-right: auto;

        font-size: 20px !important;
    }

    .btnBox .cartBtn {
        width: 100%;
        max-width: 606px;
    }
}

@media (min-width: 829px) {
    #magazine {
        font-size: 22px !important;
    }
}


iframe {
    vertical-align: bottom;
}

/* --------------------
   .ttl
-------------------- */
.section_ttl {
    text-align: center;
}

/* --------------------
   .toc
-------------------- */
.toc {
    text-align: center;
}

.toc ul li {
    padding-bottom: 1.5em;
}

.toc ul li.toc_cont1 {
    background: #B3D5EF;
}

.toc ul li.toc_cont2 {
    background: #F0CB9D;
}

.toc ul li.toc_cont3 {
    background: #C6C4DC;
}

.toc ul li .btnBox {
    margin-top: .5em;
    margin-bottom: .5em;
}

.toc ul li a {
    display: inline-block;
    line-height: 1.25;
    border-bottom: 1px solid currentColor;
}

/* --------------------
   margin
-------------------- */
.articleHeader {
    margin-bottom: 0;
}

/* --------------------
   bg color
-------------------- */
#cont1 {
    background: #B3D5EF;
}

#cont1 .other {
    background: #C6C4DC;
    overflow: hidden;
}

#cont2 {
    background: #F0CB9D;
}

#cont3 {
    background: #C6C4DC;
}

/* --------------------
   #cont4
-------------------- */
#cont4 .card {
    margin-top: 1rem
}

#cont4 .point {
    background: #FFF27E;
    padding-top: 1.5em;
}

#cont4 .point h4 {
    color: #595757;
}

#cont4 .box {
    background: #FFF;
    padding: 1.5em;
}

#cont4 .box p {
    color: #595757;
    margin: 1.5em 0 0;
}


/* --------------------
   .card
-------------------- */
/* .card {
   background: transparent;
}
.card .txtBox {
   margin: 0 1.25rem;
}
.card .btnBox + .txtBox {
   margin-top: 3rem;
}
.card .card_header .ttl.color1 {
   color: #5694CF;
}
.card .card_header .ttl.color2 {
   color: #E65B21;
}
.card .card_header .ttl.color3 {
   color: #7E43A0;
}
.card .card-limit {
   margin: .75rem 1.25rem 1.5rem;
   font-size: .938em;
   font-weight: 700;
   color: #c82d2d;
} */

/* --------------------
    .card
-------------------- */
.card {
    background: transparent;
}

.card .txtBox {
    margin: 0 1.25rem;
}

.card .btnBox+.txtBox {
    margin-top: 3rem;
}

.card .card_header .ttl.color1 {
    color: #5694CF;
}

.card .card_header .ttl.color2 {
    color: #E65B21;
}

.card .card_header .ttl.color3 {
    color: #7E43A0;
}

.card .card-limit {
    margin: .75rem 1.25rem 1.5rem;
    font-size: .938em;
    font-weight: 700;
    color: #c82d2d;
}

@media (min-width: 769px) {
    .card {
        max-width: unset;
    }

    .card .txtBox,
    .card .priceBox {
        margin-right: calc(88*1em / 22);
        margin-left: calc(88*1em / 22);
    }

    .card .card_header {
        padding-right: calc(88*1em / 22);
        padding-left: calc(88*1em / 22);
    }

    .card .card_header .ttl {
        font-size: calc(47*1em / 22);
    }

    .card .card_body--small {
        margin-top: calc(60*1em / 22);
    }

    .card .txtBox.txtBox--txt {
        margin-right: calc(72*1em / 22);
        margin-left: calc(72*1em / 22);
    }

    .card .card_header .imgBox {
        height: calc(315*1em / 22);
    }

    .txt {
        font-size: calc(32*1em / 22);
        line-height: calc(55 / 32);
    }

    .txt sub {
        font-size: calc(16*1em / 32);
    }

    .card .card_body>.btnBox {
        max-width: 606px;
        margin-top: calc(36*1em / 32);
        margin-right: auto;
        margin-left: auto;
    }

    .card .txtBox .ttl:not(.ttl--small) {
        font-size: calc(50*1em / 22);
    }

    .card .txtBox .ttl.ttl--small {
        font-size: calc(32*1em / 22);
    }

    .card .txtBox .sub_ttl,
    .card .priceBox .tax {
        font-size: calc(24*1em / 22);
        margin-top: 0;
    }

    .card .priceBox .discount .num,
    .card .priceBox .off {
        font-size: calc(42*1em / 22);
    }

    .card .priceBox .discount + .price .num,
    .card .priceBox .price .num {
        font-size: calc(60*1em / 22);
    }

    .btnBox .cartBtn {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
    }

    .inBlock-btn {
        max-width: 27.5454545455em;
        padding: 0;
    }

    .toc ul li a {
        font-size: 1.54545454545em;
    }
}

@media (max-width: 768px) {
    .inBlock, .inBlock_XL, .inBlock_L, .inBlock_M, .inBlock_S, .inBlock_XS {
        padding-right: calc(36*1em / 16);
        padding-left: calc(36*1em / 16);
    }

    .card .card_header {
        padding-right: calc(10*1em / 16);
        padding-left: calc(10*1em / 16);
    }

    .card .priceBox,
    .card .txtBox {
        margin-right: calc(10*1em / 16);
        margin-left: calc(10*1em / 16);
    }

    .card .card_header .ttl {
        font-size: calc(23.5*1em / 16);
    }

    .card .card_body--small {
        margin-top: calc(30*1em / 16);
    }

    .card .txtBox.txtBox--txt {
        margin-right: calc(5*1em / 16);
        margin-left: calc(5*1em / 16);
    }

    .card .card_header .imgBox {
        height: calc(157.5*1em / 16);
    }

    .txt {
        font-size: calc(16*1em / 16);
        line-height: calc(27.5 / 16);
    }

    .card .card_body>.btnBox {
        max-width: 606px;
        margin-top: calc(18*1em / 16);
        margin-right: auto;
        margin-left: auto;
    }

    .card .txtBox .ttl:not(.ttl--small) {
        font-size: calc(25*1em / 16);
    }

    .card .txtBox .ttl.ttl--small {
        font-size: calc(16*1em / 16);
    }

    .card .txtBox .sub_ttl,
    .card .priceBox .tax {
        font-size: calc(12*1em / 16);
        margin-top: 0;
    }

    .card .priceBox .discount .num,
    .card .priceBox .off {
        font-size: calc(21*1em / 16);
    }

    .card .priceBox .discount + .price .num,
    .card .priceBox .price .num {
        font-size: calc(30*1em / 16);
    }
}

.letter-n-121 {
    letter-spacing: -.121em;
}

.mb-0 {
    margin-bottom: 0 !important;
}