@charset "utf-8";

:root{
    --point-color:#B97F5F;
}

*{box-sizing:border-box;}
.img_box img{width:100%;}
.p_color{color:var(--point-color) !important;}
.hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.sub_visual{position:relative;width:100%;aspect-ratio: 1920/721;overflow:hidden;background-image:url(../images/img_visual_pc.jpg);background-repeat: no-repeat;background-position: center;background-size: cover;}
.sub_visual .hero-video{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;}
.sub_visual .hero-video.mobile{display:none;}
.sub_visual .hero-video iframe{position:absolute;top:50%;left:50%;width:100vw;height:56.25vw;transform:translate(-50%,-50%) scale(1.01);border:0;}
.container section .inner{padding:80px 12.6%;}
.container .title_box{text-align:center;}
.container .title_box h4{font-size:40px;line-height:1.3;font-weight:700;color:var(--gray-color-1000);}
.container .title_box .sub_text{font-size:26px;line-height:1.5;font-weight:400;color:var(--gray-color-1000);letter-spacing:-1px;}
.container .content_box{margin-top:60px;}

.marking__label{position:relative;z-index:1;width:max-content;margin:0 auto 40px;font-size:clamp(14px,2.7vw,26px);font-weight:600;color:var(--gray-color-1000);}
.marking__label::after{content:'';display:block;position:absolute;bottom:0;z-index:-1;width:100%;height:.5em;background:#EAE2DC;}

.intro{background:linear-gradient(180deg,#FFF 68.9%,#F8F8F8 100%);}
.intro .content_box{width:calc(884/1420 * 100%);margin:38px auto 0;}
.intro .img_box{width:100%;aspect-ratio:884/336;margin-bottom:38px;background:url(../images/img_intro_01.png) no-repeat center / cover;animation:bgChange 1s steps(1) infinite;}
.intro__cards{display:grid;grid-template-columns:repeat(3,1fr);gap:37px;}
.intro__card{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.6em;width:100%;padding:1.6em 0;border:1px solid #C6CAD3;border-radius:1.1em;background:#FFF;font-size:clamp(16px,2vw,18px);}
.intro__card-title{padding-bottom:.6em;margin-bottom:.4em;border-bottom:1px solid var(--point-color);font-size:1.2em;font-weight:600;color:var(--point-color);}
.intro__card-text{text-align:center;line-height:1.4;}
@keyframes bgChange{50%{background-image:url(../images/img_intro_02.png);}}

.cause{background: #FAFAFA;}
.cause .bottom_text{ font-size: clamp(16px, 2vw, 18px);width: calc(780/1440 * 100%); padding-block: .5em;margin: 0 auto;line-height: 1.5;letter-spacing: -0.04em;border-radius: 10px;border: 1px solid #EAE2DC;background: #FFF; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; }
.cause .bottom_text .bottom_text-title{font-weight: 600; color: var(--point-color);}
.cause .bottom_text .bottom-text-desc{font-size: .9em;}
.cause .cause_boxes{font-size: clamp(12px, 2vw, 16px);width:calc(628/1440 * 100%);margin:0 auto 2.4em; display: grid; grid-template-columns: repeat(2, 1fr); gap:2.2em; }
.cause .cause_boxes .cause_card{border-radius: 1em; overflow: hidden;position: relative;}
.cause .cause_boxes .card_text{text-align: center; position: absolute; bottom:0; background: rgba(223,209,202, .77); padding-block: .5em; width: 100%;}

.comparison .comparison_boxes{display:flex;gap:42px;width:calc(1110/1440 * 100%);margin:0 auto;}
.comparison .comparison_card{display:flex;flex-direction:column;overflow:hidden;border-radius:1em;font-size:clamp(18px,2vw,20px);}
.comparison .comparison_card:first-of-type{width: calc(363/1110 * 100%);}
.comparison .video_card{position:relative;aspect-ratio: 705/424;width: calc(705/1110 * 100%);background-image:url(../images/img_comparison_02.png); background-repeat: no-repeat;background-position: center;background-size: cover;}
.comparison .comparison-video{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;}
.comparison .comparison-video.mobile{display:none;}
.comparison .comparison-video iframe{position:absolute;top:50%;left: 50%;width:100%;min-width:177.78%;min-height:100%;transform: translate(-50%,-50%) scale(1.01);border:0;}
.comparison .card_text{display:flex;justify-content:center;align-items:center;padding-block:.6em;text-align:center;backdrop-filter:blur(7.650000095367432px);}
.comparison .comparison_card:first-of-type .card_text{background:#DFE0E2;color:var(--gray-color-1000);}
.comparison .comparison_card:nth-of-type(2) .card_text{background:var(--point-color);color:#fff;}
.comparison .info_boxes{display:flex;width:calc(881/1440 * 100%);margin:38px auto 0;}
.comparison .info_boxes .info_card:not(:nth-of-type(2)){display:flex;flex:1;flex-direction:column;justify-content:center;align-items:center;gap:.6em;padding:.8em 0;border:1px solid #C6CAD3;border-radius:1.1em;background:#FFF;text-align:center;font-size:clamp(16px,2vw,18px);}
.comparison .info_boxes .info_card:not(:nth-of-type(2)) .info__card-title{padding-bottom:.6em;margin-bottom:.4em;border-bottom:1px solid var(--point-color);font-size:1.2em;font-weight:600;}
.comparison .info_boxes .info_card:not(:nth-of-type(2)) .info__card-text{text-align:center;line-height:1.4;}
.comparison .info_boxes .info_card:nth-of-type(2){display:flex;flex:1;justify-content:center;align-items:center;position:relative;z-index:1;transform:scale(1.05);border-radius:.8em;background:linear-gradient(180deg,#FBD1B3 0%,#B97E5F 100%);font-size: clamp(20px,3vw,28px);}
.comparison .info_boxes .info_card:nth-of-type(2) .info__card-title{text-align:center;color:#fff;line-height:1.3;font-weight:600;}
.comparison .info_boxes .info_card:nth-of-type(1){margin-right:-3%;}
.comparison .info_boxes .info_card:nth-of-type(3){margin-left:-3%;}

.solution{background:#FAFAFA;}

.solution .step_boxes{display:grid;grid-template-columns:repeat(3,1fr);gap:42px;width:calc(1092/1440 * 100%);margin:0 auto;}
.solution .step_card{display:flex;flex-direction:column;overflow:hidden;width:100%;border-radius:.82em;font-size:clamp(18px,2vw,20px);}
.solution .card_text{padding-block:.6em;background:#DFE0E2;text-align:center;font-weight:600;}
.solution .text_box{margin-top:1.5em;text-align:center;font-size:clamp(18px,3vw,26px);line-height:1.4;font-weight:500;}

.checklist{color:#3a3a3a;}
.checklist .inner{padding:100px 0 150px;}
.checklist .tit-group{position:relative;width:100%;margin:0 auto;text-align:center;}
.checklist .tit-group::after{content:'';display:block;position:absolute;top:0;right:50%;transform:translate(190%,-30%);width:100%;max-width:200px;aspect-ratio:170/75;background:url(../images/checklist_text.png) center / contain no-repeat;}
.checklist .tit-group__sub{font-size:clamp(18px,3vw,26px);font-weight:500;line-height:1.5;}
.checklist .tit-group__main{font-size:clamp(24px,5vw,40px);font-weight:500;line-height:1.5;}
.checklist .checklist__container{position:relative;z-index:0;width:90%;max-width:739px;margin:38px auto 0;text-align:center;border-radius:23px;}
.checklist .checklist__container .checklist__list{display:grid;gap:40px;}
.checklist .checklist__container .checklist__list .checklist__item{display:flex;position:relative;justify-content:center;align-items:center;gap:.5em;font-size:clamp(14px,2.7vw,26px);}
.checklist .checklist__container .checklist__list .checklist__item .checklist__checkbox{display:block;position:relative;width:1em;height:1em;border:2px solid rgba(0,0,0,.18);}
.checklist__container .action-item .checklist__checkbox::before{content:'';display:none;position:absolute;top:50%;left:50%;transform:translate(-34%,-71%);width:1em;aspect-ratio:23/21;background:url(../images/checklist_check.png) center / contain no-repeat;}
.checklist__container .action-item.is-active .checklist__checkbox::before{display:block;}

.exclusive{aspect-ratio:1920/858;background:url(../images/img_exclusive_bg.png) no-repeat center bottom / cover;}
.container .exclusive .inner{display:flex;flex-direction:column;justify-content:space-between;align-items:center;height:100%;padding:80px 12.6% 60px;}
.exclusive .title_box{display:flex;flex-direction:column;align-items:center;gap:20px;letter-spacing:-1%;}
.exclusive .label{width:max-content;margin:0 auto;padding:.6em 1.1em;border-radius:999px;background-color:var(--point-color);font-size:clamp(12px,2vw,22px);font-weight:600;color:#fff;}
.exclusive h5{font-size:clamp(34px,4vw,40px);}
.exclusive .text_box p{font-size:clamp(18px,2vw,28px);font-weight:500;}
.exclusive .card{padding:.9em 2.6em;border:1px solid #D4D8E0;border-radius:.4em;background:rgba(255,255,255,.48);backdrop-filter:blur(14.25px);text-align:center;font-size:clamp(14px,2vw,26px);line-height:1.5;}

.banner{background:url(../images/img_banner_bg.png) no-repeat center center;}
.container .banner .inner{display:flex;justify-content:flex-start;align-items:center;position:relative;padding:0;}
.container .banner .inner .text_box{padding-left:10.5%;}
.banner h4{font-size:clamp(34px,5vw,80px);line-height:1.4;}
.banner .main_text{margin-bottom:.6em;font-size:clamp(18px,2.5vw,30px);line-height:1.4;}
.banner .img_box{width:calc(1101/1920 * 100%);margin-left:auto;}

@media screen and (max-width:1440px){
    .intro .content_box{width:100%;}
    .intro .img_box{overflow:hidden;border-radius:20px;}

    .comparison .info_boxes{width: 100%;}
    .solution .step_boxes{width: 100%;}

    .container .banner .inner .text_box{padding-left: 5%;}
}
@media screen and (max-width:1280px){
    .container section .inner{padding-inline:5%;}
}
@media screen and (max-width:1024px){
    .container section .inner{padding:60px 5%;}
    .intro__cards{grid-template-columns:1fr;gap:18px;}
    .cause .cause_boxes{gap:1em;}
    .cause .bottom_text{padding-inline: 1em;}
    .cause .cause_boxes,.cause .bottom_text{width: 100%;}
    .comparison .comparison_boxes{width:100%;flex-direction:column;gap:20px;}
    .comparison .comparison_card:first-of-type{width: 100%;}
    .comparison .video_card{aspect-ratio:315/208;width: 100%;}
    .comparison .comparison-video.pc{display:none;}
    .comparison .comparison-video.mobile{display:block;aspect-ratio: 315/208;}
    .comparison .video_card{aspect-ratio: 315/208;background-image:url(../images/img_comparison_02_mo.png);}
    .comparison .comparison-video iframe{width:100%;height:177.78vw;min-width:100%;min-height:177.78%;}
    .comparison .info_boxes{width:100%;}
    .solution .step_boxes{grid-template-columns:1fr;width:100%;gap:20px;}
    .checklist .inner{padding:40px 0 80px;}
    .checklist .checklist__container{margin-bottom:50px;}
    .exclusive{aspect-ratio:1024/980;background-image:url(../images/img_exclusive_bg_mo.png);}
    .container .exclusive .inner{padding:60px 24px;}
    .exclusive h5{order:3;}
  
}
@media screen and (max-width:769px){
    #wrap{min-width:375px;}
    .sub_visual{height:auto;aspect-ratio:375/587;background-image:url(../images/img_visual_mo.jpg) ;}
    .sub_visual .hero-video.pc{display:none;}
    .sub_visual .hero-video.mobile{display:block;}
    .sub_visual .hero-video iframe{width:100vw;height:177.78vw;min-width:100%;min-height:100%;}
    .container section .inner{padding:60px 24px;}
    .container .content_box{margin-top:30px;}
    .hide-mo{display:none;}
    .container .title_box h4{font-size:34px;}
    .container .title_box .sub_text{font-size:18px;text-wrap:balance;word-break:keep-all;}
    .intro .content_box{width:100%;margin-top:30px;}
    .intro .img_box{aspect-ratio:375/221;border-radius:10px;}
    .comparison .info_boxes{flex-direction: column;gap: 20px;margin-top: 30px;}
    .comparison .info_boxes .info_card:nth-of-type(1){margin-right:0;}
    .comparison .info_boxes .info_card:nth-of-type(2){padding-block: 2em;transform: scale(1);}
    .comparison .info_boxes .info_card:nth-of-type(3){margin-left:0;}
    
    .checklist .checklist__container .checklist__list{gap:18px;}
    .checklist .tit-group::after{max-width:75px;aspect-ratio:75/33;}
    .exclusive{aspect-ratio:357/456;}
    .container .banner{aspect-ratio:375/447;background-image:url(../images/img_banner_bg_mo.png);background-size:cover;}
    .container .banner .inner{justify-content:center;height:100%;padding:0 5% 15%;}.banner .text_box{margin-top:auto;}
    .banner .img_box{width:90%;margin-left:auto;}
}