.sub_container{background:url('/images/sub/sub_bg.jpg') center top no-repeat; padding-top:130px;}
.sub_title{padding-top:130px;}
.sub_title img{display:block; margin:0 auto;}
.sub_title p{color:#000; font-size:46px; line-heigh:1; font-weight:500; text-align:center; margin-top:18px;}
.sub_main_img{display:block; position:relative; z-index:2;}

.how_to_use_list > div + div .how_to_use_img{position:relative;}
.how_to_use_list > div + div .how_to_use_img::before{content:''; display:block; width:30px; height:30px; background:#65ae1c url('/images/main/how_arrow.svg') center center no-repeat; background-size:100%;; position:absolute; left:-26px; top:50%; transform:translateY(-50%); z-index:2; border-radius:50%;}

.how_to_use_img{position:relative;}
.how_to_use_img > div{display:block;border-radius:10px; box-shadow:0 0 13px rgba(101, 174, 28, 0.23); border:1px solid #cffd9f; overflow:hidden;}
.how_to_use_img img{display:block;}
.how_to_use_img .secound_img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2;}
.how_to_use_text{height:140px; border:1px solid #a3f94e; border-radius:10px; box-shadow:0 0 13px rgba(101, 174, 28, 0.23); margin-top:7px; padding-left:20px; padding-right:20px;}
.how_to_use_text div{font-size:19px; line-height:1.3; font-weight:600; color:#202020; text-align:center; letter-spacing:-0.03em; word-break:keep-all;}
.how_to_use_text span{font-size:13px; font-weight:300; line-height:1.2; display:block; margin-top:4px;}
.lang-ja .how_to_use_text div{font-size:17px;}

/* Swiper Navigation Styles */

.capture_wrap{margin-top:30px;}

.form_wrap{background:#8fe837; padding-top:260px; margin-top:-210px;}
.form_wrap > .inner{max-width:1360px; margin:0 auto; background:#fff;}
.lang-ja .more_btn, .lang-en .more_btn, .lang-zh .more_btn{display:none;}


.layer_pop{position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999; background:rgba(0, 0, 0, 0.3); display:none;}
.layer_pop_content{max-width:800px; width:100%; background:#fff; padding:40px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border:1px solid #cfcfcf; box-sizing:border-box;}
.layer_pop_content h2 img{display:block; margin:0 auto;}
.layer_pop_content h2 + p{font-size:30px; line-height:1.5; text-align:center; margin-top:8px; letter-spacing:-0.03em; color:#000;}
.layer_pop_content a{display:block; height:30px; line-height:30px;background:#000; color:#fff; font-size:18px; text-align:center; margin-top:20px; padding:0 40px;}
.layer_pop_content a:hover{background:var(--main-color);}
.layer_pop.active{display:block;}
.completed_p{font-weight:300; font-size:20px; line-height:1.4; text-align:center; margin-top:30px; padding-top:156px; background:url('/images/sub/completed_img.png') center top no-repeat; }

@media (max-width: 1400px) {
    .form_wrap{padding-left:20px; padding-right:20px;}
}
@media (max-width: 1300px) {
.how_to_use_text div{font-size:1.4vw;}
.how_to_use_text{padding-left:1vw; padding-right:1vw; height:10vw;}
}

@media (max-width: 1280px) {
.how_to_use_img img{width:100%;}
.how_to_use_wrap > .inner{padding-left:20px; padding-right:20px;}
.capture_wrap{flex-wrap:wrap; gap:30px;}
}

@media (max-width: 1200px) {
    .sub_container{padding-top:12vw; background-size:140vw;}
    .sub_title{padding-top:12vw;}
    .sub_title img{width:60vw;}
    .sub_title p{font-size:4vw;}
    .sub_main_img{width:70vw;}
    .inquiry_form > .dp_flex{flex-wrap:wrap;}

    .product_select_list_wrap{ align-items:flex-start;}
    .product_list_img_ex{flex-wrap:wrap; width:680px;}
    .product_list_img_ex > div{width:calc(33.3333% - 15px);}

    .form_wrap{margin-top:-18vw; padding-top:23vw;}
}

@media (max-width: 1024px) {
.cap_wrap{flex-wrap:wrap; gap:3vw;}
.product_select_list_wrap{display:block;}
.product_list_img_ex{margin-top:3vw; width:auto; gap:10px}
.product_list_img_ex > div{width:calc(16.6666% - 12px);}
.product_list_img_ex img{max-width:100%;}
}

@media (max-width: 960px) {
    .inquiry_form > .dp_flex{display:block;}
    .inquiry_form > .dp_flex > div{margin-top:3vw;}
    .inquiry_form input[type="text"]{width:100%;}

    .cap_wrap{display:block;}
    .cap_wrap > div + div{margin-top:3vw;}
    .image_preview_item{width:calc(20% - 7px);}

    .how_to_use_wrap > .inner{padding-left:0; padding-right:0;}
    .image_preview_container{gap:1vw;}
    .image_preview_item {
        aspect-ratio: 1 / 1;
        width: calc(20% - 1vw);
        max-width: 100%;
        min-width: 0;
        height: auto;
      }
    .image_preview_item {
        aspect-ratio: 1 / 1;
        height: auto;
    }
    .selectbox_wrap + div{width:calc(100% - 120px)}
    .sns_link_wrap input[type="text"]{width:100%;}
}

@media (max-width: 900px) {
    .completed_sns_list li { width: calc(33.333% - 6px); }
    .product_list_img_ex{flex-wrap:wrap; width:100%;}
    .product_list_img_ex > div{width:calc(33.3333% - 10px);}
}

@media (max-width: 860px) {
.main_content_title img{displaY:none;}
.how_to_use_list{flex-wrap:wrap;}
.how_to_use_list > div{width:calc(50% - 11px);}
.how_to_use_list > div + div{}
.how_to_use_text {height:16vw;}
.how_to_use_text div{font-size:2.4vw;}
.how_to_use_list > div:nth-child(3) .how_to_use_img:before{display:none;}
.main_inquiry_wrap > div + div{margin-top:12vw;}

.layer_pop_content{left:20px; right:20px; transform:translate(0%,-50%); width:auto; padding-left:20px; padding-right:20px;}

}

@media (max-width: 640px) {
    .completed_sns_list li { width: calc(50% - 4px); }
    .how_to_use_text div{font-size:3vw;}
    .how_to_use_list > div {
        width: calc(50% - 1vw);
    }
    .main_inquiry_wrap h3{font-size:5.2vw;}
    .inquiry_form label{font-size:4vw;}
    .inquiry_form input[type="text"]{font-size:4vw;}
    .selectbox_active{width:90px; font-size:3vw; padding:0 2vw;}
    .selectbox_list li{font-size:3vw; padding:1.4vw 2vw;}
    .sns_link_btn{padding-left:110px;}
    .inquiry_form input[type="text"], .sns_link_wrap input[type="text"]{font-size: 3vw;}
    .main_title_p{font-size:3.2vw;}
    .checkbox_style01 input[type="checkbox"] + label{font-size:3.2vw;}
    .product_list_img_ex > div{width:calc(50% - 5px);}
    .product_list_img_ex img{max-width:90%;}

    .layer_pop_content h2 img{width:70vw;}
    .layer_pop_content h2 + p{font-size:6vw;}
    .completed_p{font-size:4vw;}
    .layer_pop_content a{font-size:4vw;}
}