@charset "utf-8";
/* Block */
.block:not(:last-child){margin:0 0 80px;}
@media screen and (max-width: 768px){
    .block:not(:last-child){margin: 0 0 40px;}
}

/* Price */
.price{display: flex; flex-wrap: wrap; padding-bottom: 10px;}
.price .item{width: 31.67%; margin-right: 2.45%;}
.price .item:last-of-type{margin-right: 0;}
.price .note{color: #E57139; font-size: 2rem; line-height: 1.6; text-align: center; font-weight: bold; margin-bottom: 12px;}
.price .note span{font-size: 1.4em; line-height: 1;}
.price .inner{padding: 0 30px 40px; background: #fff; border-radius: 10px; font-size: 1.6rem; line-height: 1.4;border: 2px solid #F1EFEE;}
.price .head{text-align: center; padding: 23px 0; font-weight: bold;}
.price .tit{font-size: 5rem; color: #4B4594; font-weight: bold; line-height: 1; font-family: "Afacad", sans-serif; margin-bottom: 2px;}
.price .tit-jp{font-weight: bold;color: #222;margin: 0 0 1rem;}
.price .tit-jp span{transition: background .5s;background-image: linear-gradient(to right, #ffe0d1 0, #ffe0d1 100%);background-position: 0 1.37em;background-size: 100% 100%;background-repeat: no-repeat;display: inline;background-position: 0 1em;}
.price .head p.desc{font-weight: 400;text-align: left;margin: 1rem 0 0;}
.price .info{margin-bottom: 10px;}
.price .info li{border-top: 1px solid #D9D9D9; padding: 19px 0; display: flex; justify-content: space-between; align-items: flex-start;}
.price .info li:nth-of-type(1){align-items: flex-end;}
.price .info p:nth-of-type(1){position: relative; padding-left: 34px;}
.price .info p:nth-of-type(1):before{content: ""; position: absolute; top: 3px; left: 0;}
.price .info p:nth-of-type(2){font-size: 1.8rem; line-height: 1.5; font-weight: bold; text-align: right; min-width: 3em;}
.price .info p.info-price1{font-weight: 500; background: #EEEEF0; width: 70px; padding: 5px 0; text-align: center; margin-top: 8px;}
.price .info p.info-price1:before{display: none;}
.price .info p.info-price2{font-size: 1.6rem; line-height: 1;}
.price .info p.info-price2 span{font-size: 5.2rem; color: #4B4594; font-family: "Afacad", sans-serif; display: inline-block; position: relative; top: 2px;} 
.price .info p.info-article1:before{width: 26px; height: 21px; background: #222; mask: url("../img/common/ic-news.svg") no-repeat top left/100% auto; -webkit-mask: url("../img/common/ic-news.svg") no-repeat top left/100% auto;}
.price .info p.info-coupon1{min-width: 105px;}
.price .info p.info-coupon1:before{width: 28px; height: 18px; background: url("../img/common/ic-coupon.svg") no-repeat top left/100% auto;}
.price .info p.info-coupon2.txtS{font-size: 1.5rem;}
.price .info p.info-coupon2{min-height: 45px;}
.price .info p.info-function1:before{width: 17px; height: 22px; left: 5px; background: url("../img/common/ic-male.svg") no-repeat top center/100% auto; overflow: hidden;}
.price .info p.info-framework1:before{width: 22px; height: 20px; left: 3px; background: url("../img/common/ic-paper-pen.svg") no-repeat top center/100% auto;}
.price .info p.info-line1:before{width: 26px; height: 20px; left: 0; background: url("../img/common/ic-line.svg") no-repeat top center/100% auto;}
.price .clr-txt{color: #4B4594;}
.block01 .btn-link{text-align: center;color: #4B4594;margin: 60px 0 0;position: relative;}
.block01 .btn-link a{font-size: 2.6rem; line-height: 1.5; font-weight: bold; color: #4B4594;}
.block01 .btn-link a:hover{text-decoration: underline; text-underline-offset: 0.25em;}
.block01 .btn-link::after{content: '';position: absolute; background: url("../img/common/ic-arrow-down.svg") no-repeat top center/100% auto;bottom: -2.5em;left: 50%;width: 1.5555em;height: 1.833em;transform: translateX(-50%);}

.price .comming{position: relative;overflow: hidden;}
.price .comming::after{content: 'Coming soon';position: absolute;top: 0;left: 0;bottom: 0;right: 0;background: rgba(0, 0, 0, 0.6);color: #ffffff;display: flex;justify-content: center;align-items: center;font-size: 2.8rem;font-weight: bold;}
.price .standard{border-color: #4B4594;position: relative;overflow: hidden;}
.price .standard::before{content: 'おすすめ！';position: absolute;top: 0;right: 0;background: #4B4594;color: #fff;font-size: 1.4rem;font-weight: bold;padding: 5px 10px;text-align: center;}

@media screen and (max-width: 1250px) and (min-width: 1001px){
    .price .inner{padding: 0 2vw 40px;}
	.price .info p.info-price2{font-size: 1.2vw;}
    .price .info p.info-price2 span{font-size: 4.5vw;}
}

@media screen and (max-width: 1000px){
	.price .item{width: 48%; margin: 0 4% 4% 0;}
    .price .item:nth-of-type(2n){margin-right: 0;}
    .price .item:last-of-type{margin: 0;}
    .price .info p.info-price2{font-size: 1.7vw;}
    .price .note.empty{display: none;}
}

@media screen and (max-width: 768px){
    .price{padding-bottom: 0;}
    .price .item{width: 100%; margin: 0 0 30px 0;}
    .price .note{font-size: 1.6rem;}
    .price .inner{padding: 0 20px 20px; font-size: 1.4rem;}
    .price .tit{font-size: 3.5rem;}
    .price .info li{padding: 15px 0;}
    .price .info p:nth-of-type(2){font-size: 1.6rem;}
    .price .info p.info-price1{margin-top: 11px; padding: 3px 0;}
    .price .info p.info-price2{font-size: 1.4rem;}
    .price .info p.info-price2 span{font-size: min(14vw,5rem); top: 1px;}
    .price .info p.info-coupon1{min-width: 95px;}
    .price .info p.info-coupon2{min-height: 1px;}
    .price .info p.info-coupon2.txtS{font-size: 1.4rem;}
    .price .standard::before{font-size: 1.2rem;}
    
    .block01 .btn-link{margin: 40px 0 60px;}
}

/* block02 */
.block02{background: #EBE9E6;padding: 60px 0 80px;}
.block02 .m-tit2[class*="icon"] span{background: #EBE9E6;}
.block02 .m-tit2[class*="icon"]::before{background: #EBE9E6;}
.block02 .list-box {display: flex;justify-content: space-between;flex-wrap: wrap;row-gap: 2.3vw;}
.block02 .list-box .box{background: #ffffff;border-radius: 10px;box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.2);width: 48.41666666666%;padding: 30px min(4vw,50px) 60px;}
.block02 .list-box .box:not(.box01) .m-tit3 {text-align: center;}
.block02 .list-box .box figure{text-align: center;margin: 0 auto 20px; width: 80%;}
.block02 .list-box .box .m-tit4{color: #4B4594;margin: 0;}
.block02 .list-box .box .inner-txt:not(:last-child){margin: 0 0 20px;}
.block02 .list-box .box .m-tit3 span{font-size: 2rem;display: block;padding: 5px 0 0;}
.block02 .list-box .box.premium{border: 2px solid #E57139;position: relative;overflow: hidden;}
.block02 .list-box .box.premium::after{content: 'PREMIUM限定';font-size: 1.4rem;color: #ffffff;background: #E57139;font-weight: bold;position: absolute;top: 0;right: 0;padding: 5px 16px;z-index: 1;}
.block02 .comming{position: relative;overflow: hidden;}
.block02 .comming::before{content: 'Coming soon';position: absolute;top: 0;left: 0;bottom: 0;right: 0;background: rgba(0, 0, 0, 0.6);color: #ffffff;display: flex;justify-content: center;align-items: center;font-size: 2.8rem;font-weight: bold;z-index: 2;}

.block02 .cate01 {background: #2AA4E6;}
.block02 .cate02 {background: #E57139;}
.block02 .cate{padding: 4px;text-align: center;width: 75px;color: #fff;font-size: 1.4rem;line-height: 1.2;font-weight: bold;}
.block02 .cap{font-size: 1.2rem;margin: 10px 0 0;}
.block02 .list-box .box01{width: 100%;display: flex;justify-content: space-between;flex-wrap: wrap;}
.block02 .list-box .box01 .txt{width: 45%;}
.block02 .list-box .box01 .txt .m-tit5{margin: 0 0 30px;}
.block02 .list-box .box01 .txt .cate{margin: 0 0 5px;}
.block02 .list-box .box01 .txt .cate02{margin: 30px 0 5px;}
.block02 .list-box .box01 .img{width: 51.5%;display: flex;justify-content: space-between;margin: 20px 0 0;}
.block02 .list-box .box01 .img figure{position: relative;}
.block02 .list-box .box01 .img figure .cate{min-width: 5.5em;position: absolute;top: 12px;right: 12px;border: 1px solid #fff;width: auto;font-size: 1rem;}
.block02 .list-box .box01 .m-tit3{margin: 0 0 10px;}
.block02 .list-box .box01 .m-tit5{color: #4B4594;}
.block02 .box-try{border-radius: 10px;border: 10px solid #CFCBFF;background: #ffffff;margin: 60px 0 20px;padding: 20px min(4vw,40px) min(4vw,60px);}
.block02 .box-try .inner{display: flex;justify-content: space-between;flex-wrap: wrap;align-items: center;}
.block02 .box-try .inner .txt{width: 69%;text-align: center;}
.block02 .box-try .inner .img{width: 29%; text-align: center;}
.block02 .box-try .inner .txt h3{font-size: min(3.4vw,3.6rem);line-height: 1.58;margin: 0 0 10px;}
.block02 .box-try .inner .txt h3 span{color: #4B4594;}
.block02 .box-try .inner .txt h3 .num{font-size: min(5vw,5rem);line-height: 1.58;}
.block02 .box-try .inner .txt p{font-size: 2rem;font-weight: bold;}
.block02 .box-try .inner .txt .list-btn{display: flex;justify-content: center;}
.block02 .box-try .inner .txt .list-btn .m-btn{max-width: 280px;margin: 20px 0 0;}
.block02 .box-try .inner .txt .list-btn .m-btn:not(:last-child){margin-right: 20px;}

.m-btn a[data-color="gray"]{background: #898989; border: 2px solid #898989;}
.m-btn a[data-color="gray"]:hover{background: #fff; color: #898989;}
.m-btn a[data-color="gray"]:hover:after{background: #898989;}

@media screen and (max-width: 768px){
    .block02{padding: 40px 0;}
    .block02 .list-box{row-gap: 30px;}
    .block02 .list-box .box.premium::after{font-size: 1.2rem;padding: 2px 10px 5px;}
    .block02 .list-box .box{padding: 20px;}
    .block02 .list-box .box{width: 100%;}
    .block02 .list-box .box01 .txt{width: 100%;}
    .block02 .list-box .box01 .img{width: 100%;margin: 20px auto 0;max-width: 560px;}
    .block02 .list-box .box01 .img figure{width: 48%;margin-bottom: 0;}
    .block02 .list-box .box01 .txt .cate02{margin: 20px 0 5px;}
    .block02 .list-box .box01 .txt .m-tit5{margin: 0 0 20px;}
    .block02 .list-box .box .m-tit3 span{font-size: 1.6rem;}
    .block02 .cap{margin: 10px 0 0;}
    .block02 .box-try{padding: 0 20px 20px;margin-top: 40px;}
    .block02 .box-try .inner .txt{width: 100%;}
    .block02 .box-try .inner .img{width: 80%;margin: 0 auto 10px;}
    .block02 .box-try .inner .txt h3{font-size: 2.6rem;margin: 0 0 15px;line-height: 1.3;}
    .block02 .box-try .inner .txt h3 .num{font-size: 4rem;}
    .block02 .box-try .inner .txt p{font-size: 1.6rem;margin: 0 0 20px;}
    .block02 .box-try .inner .txt .list-btn{flex-direction: column;}
    .block02 .box-try .inner .txt .list-btn .m-btn{margin: 10px auto 0;max-width: 240px;}
    .block02 .box-try .inner .txt .list-btn .m-btn:not(:last-child){margin-right: unset;margin: 10px auto 0;}
}

/* block03 */
.block03 .list-btn{display: flex;justify-content: space-between;border-radius: 10px;box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.2);padding: 26px 60px;}
.block03 .qa-list .infor-item{box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.2);padding: 3rem;border-radius: 10px;}
.block03 .qa-list .infor-item:not(:last-child){margin: 0 0 30px;}
.block03 .qa-list .infor-item .q-cont .m-tit4{margin: 0;}
.block03 .qa-list .infor-item .q-cont{cursor: pointer;}
.block03 .qa-list .infor-item .a-cont{display: none;margin-top: 20px;}
.block03 .qa-list .infor-item .pre-txt{position: relative;padding-left: 5rem;}
.block03 .qa-list .infor-item .pre-txt::after{font-family: "Afacad", sans-serif;font-size: 3.4rem;font-weight: bold;position: absolute;top: 50%;left: 0;transform: translateY(-50%);}
.block03 .qa-list .infor-item .q-cont::after{content: 'Q.';color: #4B4594;}
.block03 .qa-list .infor-item .a-cont::after{content: 'A.';color: #E57139;}
.block03 .qa-list i {display: block;position: absolute;top: 50%;transform: translateY(-50%);right: 0;width: 40px;height: 40px;border-radius: 100%;background: #4B4594;}
.block03 .qa-list i::before, .block03 .qa-list i::after {content: "";display: block;background: #fff;position: absolute;}
.block03 .qa-list i::before {width: 20px;height: 2px;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.block03 .qa-list i::after {width: 2px;height: 20px;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.block03 .qa-list .q-cont.is-open i::after {display: none;}
@media screen and (max-width: 1168px) and (min-width: 769px){
    .block03 .qa-list .infor-item .pre-txt{padding-right: 5rem;}
}
@media screen and (max-width: 768px){
    .block03 .qa-list .infor-item .pre-txt{padding:0 3rem 0 4rem;}
    .block03 .qa-list .infor-item .pre-txt::after {font-size: 3rem;}
    .block03 .qa-list .infor-item{padding: 2rem;}
    .block03 .qa-list .infor-item:not(:last-child){margin: 0 0 20px;}
    .block03 .qa-list i{top: 3px;transform: unset;}
    .block03 .qa-list .infor-item .pre-txt::after{top: -12px;transform: unset;}
    .block03 .qa-list i {width: 24px;height: 24px;}
    .block03 .qa-list i::before {width: 12px;}
    .block03 .qa-list i::after {height: 12px;}
}
