@charset "UTF-8";
@media screen and (min-width: 768px),print {
#cost {
    max-width: 1830px;
    width: 100%;
    margin-inline: auto;
    position: relative;
}
#cost::before {
    position: absolute;
    content: "";
    background: #F2F0EB;
    width: 100%;
    height: 8.8%;
    bottom: 0;
    left: 0;
}
/* mv
-------------------------------------*/
.mv {
    background: url(../images/cost/mv-bg.png)no-repeat center bottom / contain;
    padding-bottom: 205px;
    margin-bottom: -88px;
}
.mv .icon {
    text-align: center;
    margin-bottom: 15px;
}
.mv .main-ttl {
    text-align: center;
    margin-bottom: 12px;
}
.mv .txt {
    font-weight: bold;
    font-size: 22px;
    letter-spacing: 0.05em;
    line-height: 1.909090;
    text-align: center;
}
.mv .txt span {
    font-weight: 900;
    font-size: 26px;
    line-height: 1.6153846;
}

/* point
-------------------------------------*/
.point .inner  {
    width: min(95%, 1100px);
    margin-inline: auto;
    padding-bottom: 44px;
}
.point .ttl  {
    font-weight: 900;
    font-size: 36px;
    letter-spacing: 0.05em;
    line-height: 1.44444;
    text-align: center;
    margin-bottom: 43px;
    position: relative;
}
.point .ttl::after {
    position: absolute;
    content: "";
    background: #252525;
    width: 40px;
    height: 1px;
    bottom: -16px;
    left: 50%;
    transform: translateX(-50%);
}
.point .ttl span  {
    color: #FE7500;
}
.point .list {
    background: #EAE3D3;
    padding: 50px;
    display: grid;
    gap: 30px;
    position: relative;
}
.point .list::after {
    position: absolute;
    content: "";
    background: url(../images/cost/point-arrow.svg)no-repeat;
    background-size: contain;
    bottom: -57px;
    left: 50%;
    transform: translateX(-50%);
    width: 172px;
    height: 57px;
}
.point .list li{
    border-radius: 6px;
    background: #fff;
    border: 1px solid #162f67;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.16);
    display: grid;
    grid-template-columns: 1fr 58.978%;
    gap: 40px;
    padding: 20px 40px 28px 0;
}
.point .list li .img {padding: 6px 0 0 26px;}
.point .list li:nth-child(2) .img {padding: 22px 0 6px 88px;}
.point .list li:nth-child(3) .img {padding: 38px 0 23px 29px;}
.point .list li:nth-child(4) .img {padding: 48px 0 34px 39px;}
.point .list li .num {
    font-family: "Outfit", sans-serif;
    font-weight: bold;
    font-size: 16px;
    letter-spacing: 0.05em;
    display: flex;
    gap: 6px;
    align-items: baseline;
    margin-bottom: -4px;
    padding: 0 0 0 13px;
}
.point .list li .num span {
    font-weight: bold;
    font-size: 30px;
    letter-spacing: 0;
}
.point .list li h3 {
    font-weight: bold;
    font-size: 26px;
    line-height: 1.692307;
    letter-spacing: 0;
    margin-bottom: 19px;
    padding: 0 0 0 12px;
}
.point .list li h3 span {
    font-size: 36px;
    background: linear-gradient(transparent 80%, #FFDE1E 20%);
}
.point .list li .txt {
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 0.05em;
    line-height: 2;
}
.point .txt02 {
    font-weight: 900;
    font-size: 46px;
    letter-spacing: 0.05em;
    text-align: center;
    position: relative;
    padding: 90px 159px 0 0;
}
.point .txt02 span {
    font-size: 70px;
    background: linear-gradient(transparent 80%, #FFDE1E 20%);
}
.point .txt02::after {
    position: absolute;
    content: "";
    background: url(../images/cost/point-human.png)no-repeat;
    background-size: contain;
    width: 172px;
    height: 318px;
    top: 27px;
    right: 57px;
}


/* secret
-------------------------------------*/
.secret {
    background: url(../images/cost/secret-bg.jpg)no-repeat center top / contain,
    #F7F6F3; 
}
.secret .inner {
    width: min(95%, 1100px);
    margin-inline: auto;
    position: relative;
    top: -6px;
}
.secret .ttl-box {
    background: #fff;
    border: 1.2px solid #252525;
    filter: drop-shadow(12px 12px 13px rgba(0, 0, 0, 0.1));
    width: min(95%, 989px);
    padding: 30px 0 37px;
    border-radius: 80px;
    margin-inline: auto;
    position: relative;
    z-index: 2;
}
.secret .ttl {
    font-weight: 900;
    font-size: 46px;
    line-height: 1.4348;
    letter-spacing: 0.02em;
    text-align: center;
}
.secret .ttl span {
    color: #FE7500;
}
.secret .inBox {
    background: #fff;
    border: 20px solid #eae3d3;
    position: relative;
    padding: 122px 40px 44px;
    display: grid;
    grid-template-columns: 37.75% 1fr;
    gap: 30px;
    margin-top: -94px;
}
.secret .inBox::after  {
    position: absolute;
    content: "";
    background: url(../images/cost/point-arrow.svg)no-repeat;
    background-size: contain;
    bottom: -75px;
    left: 50%;
    transform: translateX(-50%);
    width: 172px;
    height: 57px;
    z-index: 3;
}
.secret .inBox .list {
    display: grid;
    gap: 13px;
    padding: 3px 0 0;
}
.secret .inBox .list li{
    font-weight: bold;
    font-size: 18px;
    letter-spacing: 0;
    position: relative;
    padding: 0 0 0 47px;
}
.secret .inBox .list li::before {
    position: absolute;
    content: "";
    background: url(../images/cost/check-icon.svg)no-repeat;
    background-size: contain;
    width: 29px;
    height: 29px;
    top: 30%;
    left: 8px;
    transform: translateY(-50%);
}
.secret .inBox .list li::after {
    position: absolute;
    content: "";
    background: #252525;
    width: 100%;
    height: 1px;
    bottom: 8px;
    left: 0;
}
.secret .inBox .list li span{
    font-size: 28px;
    line-height: 1.14285714;
}

/* payment
-------------------------------------*/
.payment {
    position: relative;
    top: -1px;
}
.payment::before  {
    position: absolute;
    content: "";
    background: #F7F6F3;
    width: 100%;
    height: 61%;
    top: 0;
    left: 0;
    pointer-events: none;
}
.payment .inner {
    width: min(95%, 1100px);
    margin-inline: auto;
    text-align: center;
    padding: 114px 0 0;
    position: relative;
    z-index: 2;
}
.payment .ttl {
    font-weight: 900;
    font-size: 46px;
    letter-spacing: 0.05em;
    text-align: center;
    position: relative;
    margin-bottom: 30px;
    display: inline-block;
    line-height: 1;
}
.payment .ttl::before {
    position: absolute;
    content: "";
    background: url(../images/cost/payment-human.png)no-repeat;
    background-size: contain;
    width: 153px;
    height: 285px;
    top: 8px;
    left: -188px;
}
.payment .ttl span {
    font-size: 70px;
    background: linear-gradient(transparent 85%, #FFDE1E 15%);
    display: block;
    padding: 17px 0 12px;
    margin-bottom: 17px;
    letter-spacing: 0.05em;
}
.payment .content {
    border: 1px solid #252525;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.16);
    background: #FFFFFF;
}
.payment .content h3 {
    font-weight: 900;
    font-size: 36px;
    letter-spacing: 0.02em;
    line-height: 1.44444;
    text-align: center;
    color: #fff;
    background: #0249ad;
    padding: 26px 0 28px;
    position: relative;
    z-index: 2;
}
.payment .content .inBox {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 50px;
    padding: 43px 45px 48px;
}
.payment .content .inBox .list {
    display: grid;
    gap: 45px;
}
.payment .content .inBox li {
    text-align: left;
}
.payment .content .inBox li h4 {
    font-weight: bold;
    font-size: 22px;
    letter-spacing: 0.05em;
    text-align: center;
    border-radius: 31px;
    background: #f2f0eb;
    padding: 10px 0;
    margin-bottom: 22px;
}
.payment .content .inBox li .txt {
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 0.05em;
    line-height: 1.75;
    padding: 0 0 0 21px;
}
.payment .content .inBox li .txt span{
    font-weight: bold;
    font-size: 18px;
    letter-spacing: 0.05em;
    line-height: 1.7777;
    display: block;
}
.payment .content .inBox li table {
    margin-top: -10px;
}
.payment .content .inBox li tr:not(:last-child) {
    border-bottom: 1px solid #C6C6C6;
}
.payment .content .inBox li th,
.payment .content .inBox li td {
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 0.05em;
    line-height: 1.75;
    font-weight: 500;
    padding: 8px 0 7px;
}
.payment .content .inBox li th {
    font-weight: 700;
    width: 24.4%;
    vertical-align: middle;
}
.payment .content .inBox li td span {
    font-size: 14px;
}

/* bottom-sec
-------------------------------------*/
.bottom-sec {
    width: min(95%, 1160px);
    margin-inline: auto;
    margin-bottom: -185px;
}
.bottom-sec .inner {
    display: inline-grid;
    grid-template-columns: 47.244% 57.213%;
    padding: 116px 0 263px;
    align-items: center;
}
.bottom-sec .txt-box {
    border-radius: 50px;
    background: #fff;
    border: 1.2px solid #252525;
    box-shadow: 17px 17px 23px rgba(0, 0, 0, 0.1);
    padding: 60px 0 55px 38px;
    position: relative;
    left: 0;
    z-index: 2;
    top: -10px;
}
.bottom-sec .txt-box .ttl {
    font-weight: 900;
    font-size: 46px;
    line-height: 1.4347826;
    letter-spacing: 0;
    margin-bottom: 17px;
    position: relative;
}
.bottom-sec .txt-box .ttl::before {
    position: absolute;
    content: "";
    background: url(../images/common/bottom-sec-deco.png)no-repeat;
    background-size: contain;
    width: 56px;
    height: 65px;
    top: -78px;
    left: 20px;
}
.bottom-sec .txt-box .txt {
    font-weight: bold;
    font-size: 18px;
    letter-spacing: 0.05em;
    line-height: 1.777777;
}
.bottom-sec .photo {
    position: relative;
    left: -45px;
}
.bottom-sec .photo img {
    width: 100%;
    height: auto;
}

}
@media screen and (max-width: 767px) {
/* mv
-------------------------------------*/
.mv {
    background: url(../images/cost/mv-bg_sp.png)no-repeat center bottom / contain;
    padding: 7.2vw 0 16.5vw;
    position: relative;
}
.mv::before {
    position: absolute;
    content: "";
    background: #F7F6F3;
    width: 100%;
    height: 75.2vw;
    top: 30vw;
    left: 0;
    pointer-events: none;
}
.mv .icon {
    text-align: center;
    margin-bottom: 0.5vw;
    position: relative;
    z-index: 2;
}
.mv .icon img {
    width: 14.254vw;
}
.mv .main-ttl {
    text-align: center;
    margin-bottom: 3.5vw;
    position: relative;
    z-index: 2;
}
.mv .txt {
    font-weight: bold;
    font-size:4.348vw;
    letter-spacing: 0.05em;
    line-height: 1.888888;
    text-align: center;
    position: relative;
    z-index: 2;
}
.mv .txt span {
    font-weight: 900;
    font-size:4.831vw;
    display: block;
    margin: -0.9vw 0 0;
}

/* point
-------------------------------------*/
.point .inner  {
    padding: 7.8vw 0 14vw;
    position: relative;
}
.point .ttl  {
    font-weight: 900;
    font-size:5.797vw;
    letter-spacing: 0.05em;
    line-height: 1.33333;
    text-align: center;
    margin-bottom: 9vw;
    position: relative;
}
.point .ttl::after {
    position: absolute;
    content: "";
    background: #252525;
    width: 9.7vw;
    height: 0.2vw;
    bottom: -4vw;
    left: 50%;
    transform: translateX(-50%);
}
.point .ttl span  {
    color: #FE7500;
}
.point .list {
    background: #EAE3D3;
    display: grid;
    gap: 6vw;
    position: relative;
    padding: 6vw 0 7vw;
    margin-bottom: 16vw;
}
.point .list::after {
    position: absolute;
    content: "";
    background: url(../images/cost/point-arrow.svg)no-repeat;
    background-size: contain;
    bottom: -8.3vw;
    left: 50%;
    transform: translateX(-50%);
    width: 24.88vw;
    height: 8.3vw;
}
.point .list li{
    border-radius: 6px;
    background: #fff;
    border: 0.2vw solid #162f67;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.16);
    display: grid;
    width: 94.205vw;
    margin-inline: auto;
    padding: 4.8vw 5.8vw 6vw;
}
.point .list li .img {order: 3;text-align: center;padding: 0 0 4vw;}
.point .list li .img img {width: 63.3vw;}
.point .list li:nth-child(2) .img img {width: 41.86vw;}
.point .list li:nth-child(3) .img img{width: 65.40vw;}
.point .list li:nth-child(4) .img img {width: 63.89vw;}
.point .list li .txt-box {
    display: contents;
}
.point .list li .num {
    font-family: "Outfit", sans-serif;
    font-weight: bold;
    font-size:4.106vw;
    letter-spacing: 0.05em;
    display: flex;
    gap: 1vw;
    align-items: baseline;
    margin-bottom: 0.4vw;
    order: 1;
    justify-content: center;
}
.point .list li .num span {
    font-weight: bold;
    font-size:6.522vw;
    letter-spacing: 0;
}
.point .list li h3 {
    font-weight: bold;
    font-size:5.797vw;
    line-height: 1.5;
    letter-spacing: 0;
    margin-bottom: 4.8vw;
    order: 2;
    text-align: center;
}
.point .list li h3 span {
    font-size:6.763vw;
    background: linear-gradient(transparent 80%, #FFDE1E 20%);
}
.point .list li .txt {
    font-weight: 500;
    font-size:3.865vw;
    letter-spacing: 0.05em;
    line-height: 2;
    order: 4;
}
.point .txt02 {
    font-weight: 900;
    font-size:7.246vw;
    letter-spacing: 0.05em;
    text-align: center;
    position: relative;
    line-height: 1.25;
    z-index: 3;
}
.point .txt02 span {
    font-size:8.937vw;
    background: linear-gradient(transparent 80%, #FFDE1E 20%);
}
.point .human {
    position: absolute;
    bottom: -3vw;
    right: 1.2vw;
    width: 25.365vw;
    height: 46.9vw;
}


/* secret
-------------------------------------*/
.secret {
    background: url(../images/cost/secret-bg_sp.jpg)no-repeat center top / contain,
    #F7F6F3; 
}
.secret .inner {
    width: 94.20vw;
    margin-inline: auto;
    position: relative;
    padding: 5.5vw 0 61.59vw;
}
.secret .ttl-box {
    background: #fff;
    border: 0.29vw solid #252525;
    filter: drop-shadow(3px 3px 10px rgba(0, 0, 0, 0.1));
    width: 91.79vw;
    padding: 4.5vw 0;
    border-radius: 8.94vw;
    margin-inline: auto;
    position: relative;
    z-index: 2;
    top: -14vw;
}
.secret .ttl {
    font-weight: 900;
    font-size:6.522vw;
    line-height: 1.44444;
    letter-spacing: 0;
    text-align: center;
}
.secret .ttl span {
    color: #FE7500;
    display: block;
    letter-spacing: 0.02em;
}
.secret .inBox {
    background: #fff;
    border: 1.45vw solid #eae3d3;
    position: relative;
    padding: 22.5vw 4.58vw 10vw;
    display: grid;
    margin-top: -33vw;
    gap: 3.5vw;
}
.secret .inBox::after  {
    position: absolute;
    content: "";
    background: url(../images/cost/point-arrow.svg)no-repeat;
    background-size: contain;
    bottom: -9vw;
    left: 50%;
    transform: translateX(-50%);
    width: 24.88vw;
    height: 8.21vw;
    z-index: 3;
}
.secret .inBox .list {
    display: grid;
    gap: 4.9vw;
}
.secret .inBox .list li{
    font-weight: bold;
    font-size:3.865vw;
    letter-spacing: 0;
    position: relative;
    padding: 0 0 0 10.5vw;
    line-height: 1.875;
}
.secret .inBox .list li::before {
    position: absolute;
    content: "";
    background: url(../images/cost/check-icon.svg)no-repeat;
    background-size: contain;
    width: 7.00vw;
    height: 7.00vw;
    top: 00;
    left: 2vw;
}
.secret .inBox .list li::after {
    position: absolute;
    content: "";
    background: #252525;
    width: 100%;
    height: 0.2vw;
    bottom: -1.8vw;
    left: 0;
}
.secret .inBox .list li span{
    font-size:5.556vw;
    line-height: 1.2;
}

/* payment
-------------------------------------*/
.payment {
    margin-top: -52vw;
}
.payment .inner {
    width: 94.20vw;
    margin-inline: auto;
    text-align: center;
    padding: 10vw 0 12vw;
    position: relative;
    z-index: 2;
}
.payment .ttl {
    font-weight: 900;
    font-size:7.246vw;
    letter-spacing: 0.05em;
    text-align: center;
    position: relative;
    margin-bottom: 5.5vw;
    display: inline-block;
    line-height: 1;
    z-index: 2;
}
.payment .ttl span {
    font-size:8.937vw;
    background: linear-gradient(transparent 85%, #FFDE1E 15%);
    display: block;
    letter-spacing: 0.05em;
    padding: 1.5vw 0;
    margin-bottom: 1vw;
}
.payment .content {
    border: 0.2vw solid #252525;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.16);
    background: #FFFFFF;
    position: relative;
}
.payment .content::before {
    position: absolute;
    content: "";
    background: url(../images/cost/payment-human_sp.png)no-repeat;
    background-size: contain;
    width: 30.92vw;
    height: 40.82vw;
    top: -41vw;
    right: -3.5vw;
}
.payment .content h3 {
    font-weight: 900;
    font-size:5.314vw;
    letter-spacing: 0.02em;
    line-height: 1.5454545;
    text-align: center;
    color: #fff;
    background: #0249ad;
    padding: 4.2vw 0 6vw;
    position: relative;
    z-index: 2;
}
.payment .content .inBox {
    display: grid;
    gap: 8vw;
    padding: 6vw 5.79vw 4.5vw;
}
.payment .content .inBox .list {
    display: grid;
    gap: 8vw;
}
.payment .content .inBox li {
    text-align: left;
}
.payment .content .inBox li h4 {
    font-weight: bold;
    font-size:4.348vw;
    letter-spacing: 0.05em;
    text-align: center;
    border-radius: 24.15vw;
    background: #f2f0eb;
    padding: 2.2vw 0;
    margin-bottom: 3vw;
}
.payment .content .inBox li .txt {
    font-weight: 500;
    font-size:3.865vw;
    letter-spacing: 0.05em;
    line-height: 1.75;
    padding: 0 0 0 2.5vw;
}
.payment .content .inBox li .txt span{
    font-weight: bold;
    font-size:4.348vw;
    letter-spacing: 0.05em;
    line-height: 1.7777;
    display: block;
}
.payment .content .inBox li table {
    width: 77.3vw;
    margin-inline: auto;
    margin-top: -2vw;
}
.payment .content .inBox li tr:not(:last-child) {
    border-bottom: 0.2vw solid #C6C6C6;
}
.payment .content .inBox li th,
.payment .content .inBox li td {
    font-weight: 500;
    font-size:3.865vw;
    letter-spacing: 0.05em;
    line-height: 1.75;
    padding: 2.42vw 0 1.4vw;
}
.payment .content .inBox li th {
    font-weight: 700;
    width: 36.4%;
    vertical-align: top;
}
.payment .content .inBox li tr:nth-of-type(2) th {
    padding: 5.5vw 0 13vw;
}
.payment .content .inBox li tr:nth-of-type(3) th {
    padding: 3.5vw 0 0;
}
.payment .content .inBox li td span {
    font-size:3.382vw;
}

/* bottom-sec
-------------------------------------*/
.bottom-sec {
    background: #F2F0EB;
}
.bottom-sec .inner {
    display: grid;
    padding: 0 0 9vw;
}   
.bottom-sec .txt-box {
    order: 2;
    border-radius: 7.3vw;
    background: #fff;
    border: 0.2vw solid #252525;
    box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.1);
    padding: 12vw 7vw 8.5vw;
    position: relative;
    z-index: 2;
    top: -10vw;
    width: 87vw;
    left: 49%;
    transform: translateX(-50%);
}
.bottom-sec .txt-box .ttl {
    font-weight: 900;
    font-size:6.763vw;
    line-height: 1.53571428;
    letter-spacing: 0;
    margin-bottom: 4vw;
    position: relative;
    text-align: center;
}
.bottom-sec .txt-box .ttl::before {
    position: absolute;
    content: "";
    background: url(../images/common/bottom-sec-deco.png)no-repeat;
    background-size: contain;
    width: 11.114vw;
    height: 12.08vw;
    top: -15vw;
    left: 48%;
    transform: translateX(-50%);
}
.bottom-sec .txt-box .txt {
    font-weight: bold;
    font-size:3.865vw;
    letter-spacing: 0.05em;
    line-height: 2;
}
.bottom-sec .photo {
    order: 1;
}


}