.header_wrap{background:#000; padding:52px 0; position:absolute; top:0; left:0; right:0; z-index:3;}
.header_wrap > .inner{position:relative;}
.header_menu > a{color:#fff; font-size:20px; line-height:1; letter-spacing:-0.05em; font-weight:400;}
.lang_wrap{position:absolute; left:calc(100% + 40px); top:50%; transform:translateY(-50%);}
.lang_btn{position:relative; color:#000; font-size:18px; font-weight:400; height:32px; width:130px; box-sizing:border-box; border:1px solid #e0e0e0; border-radius:4px; background:#fff; cursor:pointer; padding-left:38px; line-height:32px; white-space:nowrap;}
.lang_btn:before{content:''; display:block; width:12px; height:12px; background:url('/images/lang_arrow.png') center center no-repeat; background-size:100%; position:absolute; left:12px; top:50%; transform:translateY(-50%);}
.lang_wrap ul{position:absolute; top:calc(100%); left:0; right:0; background:#fff; border-radius:0 0 4px 4px; border:1px solid #e0e0e0; border-top:0; opacity:0; visibility:hidden; transform:translateY(-10px); transition:all 0.3s ease; z-index:10;}
.lang_wrap.active ul{opacity:1; visibility:visible; transform:translateY(0);}
.lang_wrap ul a{display:block; line-height:38px; font-size:18px; color:#777; padding-left:38px; box-sizing:border-box; transition:all 0.2s ease;}
.lang_wrap ul a:hover{background:#f8f8f8; color:#333;}
.lang_wrap.active .lang_btn{border-radius:4px 4px 0 0;}
.lang_btn.active:before{transform:translateY(-50%) rotate(180deg);}

.main_container{background:url('/images/main/visual_img.png') center bottom no-repeat; position:relative; z-index:2;}
.camera_title div{color:#000; line-height:1;}
.camera_title div:nth-child(1){font-size:70px;}
.camera_title div:nth-child(2){font-size:143px;}
.camera_title div:nth-child(3){font-size:103px;}

.camera_text{color:var(--black-color); line-height:1.3; letter-spacing:-0.05em;}
.camera_btn span{color:#fff; font-size:34px; padding:0 80px; text-align:center; height:60px; line-height:60px; background:#000; border-radius:50px; display:block; font-weight:600; transition: all 0.3s ease; font-weight:700;}
.camera_btn span strong{color:#fffd57; font-weight:600;}
/* Swiper Navigation Styles */
.main_short_wrap {position: relative; padding:0 95px;}
.short_sns_icon img{display:block; position:absolute; z-index:2;}
.short_sns_icon img.sns01{left:32px; top:40px;}
.short_sns_icon img.sns02{bottom:-21px; left:calc(50% + 82px);}
.short_sns_icon img.sns03{right:38px; bottom:136px;}

.main_content{background: #9CF346; background: linear-gradient(135deg,rgba(156, 243, 70, 1) 0%, rgba(130, 220, 40, 1) 100%); margin-top:-130px; position:relative; z-index:1;}
.main_content_wrap{background:#fff; padding:60px 0 100px; position:relative;}
.main_content_wrap h2{color:#000; line-height:1.2; letter-spacing:-0.03em; word-break:keep-all;}
.main_content_wrap h2 strong{font-weight:700;}
.main_content_wrap h2 strong:nth-child(1){color:var(--main-color);}
.main_content_wrap h2 + p{line-height:1.4; word-break:keep-all;}

.product_list{flex-wrap:wrap;}
.product_list > div{border:1px solid #d9d9d9; text-align:center; border-radius:10px; overflow:hidden; padding-bottom:74px; box-sizing:border-box;}
.product_list div img{display:block; margin-bottom:10px; max-width:100%; margin:0 auto;}
.product_list_text{font-weight:200; font-size:25px; color:#202020;}
.product_list_text strong{display:block; font-weight:700; }
.product_list_wrap li + li{margin-top:12px;}


.main_title_style{padding-left:18px; font-size:27px; font-weight:600; line-height:1; color:var(--black-color); position:relative;}
.main_title_style::before{content:''; display:block; width:8px; height:8px; background:#88c946; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.main_title_p{color:#202020; font-weight:300; font-size:20px; line-height:1; letter-spacing:-0.05em;}

.main_content_text ul li{padding-left:14px; position:relative;}
.main_content_text ul li::before{content:''; display:block; width:4px; height:4px; border-radius:50%; background:#000; position:absolute; left:0; top:12px;}
.main_content_text ul li + li{margin-top:16px;}
.main_content_text ul li strong{font-weight:600;}

.main_btn_wrap a{color:#fff; font-size:30px; width:50%; max-width:475px; text-align:center; height:56px; line-height:56px; border-radius:56px; font-weight:600; letter-spacing:-0.03em;}
.lang-ja .main_btn_wrap a, .lang-en .main_btn_wrap a, .lang-zh .main_btn_wrap a{font-size:24px;}
.main_content_wrap .main_btn_wrap a:after{content:''; display:inline-block; width:24px; height:24px; background:url('/images/main/main_btn_arrow.png') center center no-repeat; background-size:100%; }

.main_btn_wrap a.main_btn{background: #FF8787; background: linear-gradient(90deg, rgba(255, 135, 135, 1) 0%, rgba(255, 86, 86, 1) 100%); text-shadow:0 0 2px rgba(183, 50, 50, 0.5);}
.main_btn_wrap a.sub_btn{background:#7BD521;}

.content_caution li + li{margin-top:8px;}
.content_caution li div{display:inline-block; position:relative; padding-left:10px;}
.content_caution li div::before{content:'*'; display:block;  position:absolute; left:0; top:0;}

.main_content_title{position:relative;}
.main_content_title img{position:absolute; top:50%; right:0; transform:translateY(-50%);}

.completed_content{padding-top:64px; padding-bottom:80px; background:#fff; position:relative;}
.completed_sns_img{position:absolute; top:0; right:0; z-index:2; right:-30px; top:36px;}
.completed_content p{text-align:center; font-size:28px; letter-spacing:-0.05em; line-height:1.4; color:#000; font-weight:500; word-break:keep-all;}

.completed_sns_list {padding:0 35px; flex-wrap: wrap; gap: 8px; margin-bottom: 20px;}
.completed_sns_list li {width: calc(20% - 7px); /* 5개씩 한 줄, gap 보정 */
    aspect-ratio: 1/1; background: #f5f5f5; border-radius: 8px; overflow: hidden; display: flex; align-items: center; justify-content: center;}
.completed_sns_list li a {background:#c0c0c0; border:1px solid #a3f94e; border-radius:6px; display: block; width: 100%; height: 100%; text-align: center; line-height: 1.2; color: #333; text-decoration: none; font-size:0;}
.completed_sns_list .image-box {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.completed_sns_list .image-box img {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    object-fit: cover;
    /* 아래 두 줄은 JS에서 클래스로 제어 */
}
.completed_sns_list .image-box img.fit-width {
    width: 100%;
    height: auto;
    max-width: none;
    max-height: none;
}
.completed_sns_list .image-box img.fit-height {
    height: 100%;
    width: auto;
    max-width: none;
    max-height: none;
}

.completed_bottom_txt{margin:70px auto 0;}
.completed_bottom_txt p{font-size:28px; color:#000; line-height:1.4; letter-spacing:-0.05em;}
.completed_bottom_txt ul{font-size:32px; color:var(--main-color); line-height:1.4; letter-spacing:-0.05em; font-weight:600; text-align:center;}
.completed_bottom_txt ul li + li{margin-top:10px;}

.camera_slide_wrap {position: relative; padding: 0 60px; overflow: hidden;}
.camera-button-prev, .camera-button-next{position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 82px; background:url('/images/main/short_arrow.png') center center no-repeat; background-size:100%; border-radius: 50%; cursor: pointer; z-index: 10; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease;}
.camera-button-prev {left:20px;}
.camera-button-next {right:20px; background:url('/images/main/short_arrow2.png') center center no-repeat; background-size:100%;}
.camera_slide_wrap video{width:100%; border-radius:10px; display:block;}


/* Swiper Slide Styles */
.swiper-slide iframe {width: 100%; height: 566px; border: none; border-radius: 10px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); display:block; border:0 !important; margin-bottom:0 !important;}

.main_inquiry_wrap h3{font-weight:600; font-size:24px; color:#000; line-height:1; letter-spacing:-0.03em;}
.main_inquiry_wrap > div + div{margin-top:100px;}
.inquiry_form label{color:#000; font-size:20px; font-weight:300; line-height:1;}
.inquiry_form input[type="text"]{border:1px solid #95ec3d; border-radius:10px; height:40px; margin-top:8px; padding:0 18px; font-size:16px; box-sizing:border-box; letter-spacing:-0.05em; color:#000;}
.inquiry_form input[type="text"]::placeholder{color:#bcbcbc; letter-spacing:-0.05em;}

/* Image Upload Styles */
.image_upload_wrap {position: relative;}

.image_preview_container {flex-wrap: wrap; max-width: 100%;}

.image_preview_item {width: 96px; height: 96px; border: 1px solid #95ec3d; border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; overflow: hidden; transition: all 0.3s ease;}
.image_preview_item.empty {background-color: #c0c0c0; border-style: solid;}
.add_image_btn {cursor: pointer; border-color: #88c946; transition: all 0.3s ease;}
.add_image_btn:hover {border-color: #65ae1c; background-color: #f0fae8;}
.add_icon {font-size: 40px; color: #88c946; font-weight: 300; line-height: 1; margin-bottom: 8px;}
.add_text {font-size: 14px; color: #88c946; font-weight: 500;}

.image_preview_item img {width: 100%; height: 100%; object-fit: cover; border-radius: 8px;}
.image_preview_item.filled {border: 2px solid #88c946; border-style: solid; background-color: transparent;}
.image_preview_item .remove_btn {position: absolute; top: 8px; right: 8px; width: 24px; height: 24px; background: rgba(255, 87, 87, 0.9); border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; color: white; font-size: 16px; font-weight: bold; opacity: 0; transition: opacity 0.3s ease;}
.image_preview_item.filled:hover .remove_btn {opacity: 1;}

.image_count_info {margin-top: 10px; font-size: 14px; color: #666; text-align: center;}

/* 셀렉트박스 스타일 */
.selectbox_wrap {position: relative; display: inline-block;}

.selectbox_active {width: 120px; height: 40px; line-height: 40px; padding: 0 16px; border: 1px solid #95ec3d; border-radius: 10px; background: #fff; cursor: pointer; font-size: 16px; color: #333; position: relative; transition: border-color 0.3s ease; box-sizing: border-box; user-select: none;}
.selectbox_active:after {content: ''; position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #666; transition: transform 0.3s ease;}
.selectbox_wrap.active .selectbox_active {border-color: #88c946; border-radius:10px 10px 0 0;}
.selectbox_wrap.active .selectbox_active:after {transform: translateY(-50%) rotate(180deg);}
.selectbox_list {position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid #95ec3d; border-top: none; border-radius: 0 0 10px 10px; max-height: 200px; overflow-y: auto; z-index: 9999; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.3s ease; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); list-style: none; padding: 0; margin: 0;}
.selectbox_wrap.active .selectbox_list { opacity: 1; visibility: visible; transform: translateY(0);}
.selectbox_list li {padding: 12px 16px; font-size: 16px; color: #333; cursor: pointer; transition: background-color 0.2s ease; border-bottom: 1px solid #f0f0f0; user-select: none;}
.selectbox_list li:last-child {border-bottom: none;}
.selectbox_list li:hover {background-color: #f8fdf5; color: #88c946;}
.selectbox_list li.selected {background-color: #88c946; color: #fff;}

.product_list_img_ex img{display:block; margin:0 auto;}
.product_list_text_ex{font-size:12px; color:#202020; letter-spacing:-0.03em; text-align:center; margin-top:10px;}
.product_list_text_ex strong{display:block; font-weight:700;}
.main_agree_wrap li + li{margin-top:12px;}
.main_agree_wrap input[type="button"]{border:0; background:transparent; font-size:17px; letter-spacing:-0.05em; display:none;}
.main_agree_wrap input[type="button"]:hover{color:#88c946;}

.sns_link_btn{padding-left:195px; margin-top:16px;}
.sns_link_btn_add{position:relative; padding-left:22px; border:0; background:transparent; font-size:16px; color:#646464; font-weight:300; line-height:1; letter-spacing:-0.05em;}
.sns_link_btn_add:before{content:'+'; font-weight:700; font-size:14px; color:#fff; width:17px; height:17px; line-height:17px; position:absolute; background:#88c946; top:50%; left:0; transform:translateY(-50%); border-radius:4px;}
.sns_link_btn_add:hover{color:#88c946;}
.remove_sns_link{font-size:0; width:20px; height:40px; position:relative; border:0; background:transparent; cursor:pointer;}
.remove_sns_link:before{content:'×'; display:block; color:#88c946; font-size:22px; font-weight:700; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}

.sns_link_wrap > div + div{margin-top:8px;}
.sns_link_wrap input[type="text"]{border:1px solid #95ec3d; padding:0 18px; height:40px; border-radius:10px; box-sizing:border-box; color:#bcbcbc; font-size:17px; width:387px; letter-spainc:-0.05em;  color:#000;}
.sns_link_wrap input[type="text"]::placeholder{color:#bcbcbc; letter-spacing:-0.05em;}
.footer{background:#71c121; padding:70px 0 150px;}
.foorter_privacy li{color:#fff; font-size:18px; line-height:1.4; letter-spacing:-0.05em; font-weight:200; position:relative; padding-left:10px; word-break:keep-all;}
.foorter_privacy li:before{content:''; display:block; width:2px; height:2px; background:#fff; border-radius:50%; position:absolute; left:0; top:12px;}
.foorter_privacy li + li{margin-top:12px;}
.foorter_privacy li a{color:#fff; font-weight:600;}
.footer_logo{margin-top:50px;}
.footer_logo img{display:block;}


.header_menu_wrap {
    position: relative;
}
.hamburger {
    display: none;
    width: 32px; height: 32px; min-width: 32px; min-height: 32px;
    background: none; border: none; cursor: pointer;
    flex-direction: column; justify-content: center; align-items: center;
    gap: 6px;
    z-index: 1001;
}
.hamburger span {display: block; width: 24px; height: 3px; min-width: 24px; min-height: 2px; background: #fff; border-radius: 2vw; transition: all 0.3s;
}
.mobile_menu {display: none;position: fixed; top: 0; right: 0; bottom:0; width: 60vw; background: #fff; box-shadow: 0 2vw 4vw rgba(0,0,0,0.08); flex-direction: column; z-index: 1000; z-index: 1000;
}
.mobile_menu a {
    display: block;
    padding: 12px 16px;
    font-size: 16px;
    color: #222;
    text-align: left;
    border-bottom: 1px solid #eee;
}
.mobile_menu a:last-child { border-bottom: none; }
.mobile_menu.hide { display: none !important; }

@media screen and (max-width: 1920px) {
    .main_container{background-size:cover;}
}

@media screen and (max-width: 1560px) {
    .header_menu{gap:42px; margin-right:42px;}
    .lang_wrap{position:static; transform: translateY(0);}
}

@media screen and (max-width: 1240px) {
    .completed_sns_img{right: 2vw;top: 4vw; width: 13vw;}
}

@media screen and (max-width: 1200px) {
    .main_container{background-position: center bottom 8vw; background-size:140vw; padding-top: 24vw; padding-bottom: 30vw;}
    .camera_title img{width:56vw;}
    .camera_btn span{font-size:2.4vw; padding:0 4.2vw; height:5.6vw; line-height:5.6vw;}

    .main_short_wrap{padding-left:4.8vw; padding-right:4.8vw;}
    .short_sns_icon img{width:8vw;}
    .camera-button-prev{left:0;}
    .camera-button-next{right:0;}
    
    .completed_sns_list{padding:0 20px;}

    .main_content_wrap{padding-left:20px; padding-right:20px;}
    .product_list > div{width:calc(25% - 11px);}
}

@media screen and (max-width: 1024px) {
.product_list > div{width:calc(33.3333% - 10px);}


}

@media screen and (max-width: 980px) {
    .header_logo img{width:35vw;}
    .header_menu{gap:4vw; margin-right:4vw;}
    .header_menu > a{font-size:2vw;}

}

@media screen and (max-width: 860px) {
    .header_wrap{padding:24px 0;}
    .header_menu { display: none !important; }
    .hamburger { display: flex !important; }
    .mobile_menu { display: flex; }
    .lang_wrap{margin-left:16px;}
    .main_container{padding-top: 43vw; padding-bottom: 50vw; background-size:170vw; background-position: right -42vw bottom 10vw;}
    .camera_title img{width:70vw;}
    .camera_btn span{font-size:3.4vw; padding:0 4.2vw; height:6.4vw; line-height:6.4vw;}

    .main_container{padding-top:20vw; padding-bottom:40vw;}
    .camera-button-prev, .camera-button-next{width:24px; height:40px;}
    .short_sns_icon img.sns03{right:0; bottom:66px;}
    .short_sns_icon img.sns01{left:0;}
    .completed_content p{font-size:3.2vw;}
    .completed_bottom_txt{margin-top:6vw;}
    .completed_bottom_txt ul{font-size:3.6vw; margin-top:4.2vw;}
    .completed_bottom_txt ul li + li{margin-top:0;}
    .main_content_wrap{margin-top:12vw;}
    .main_content_wrap {margin-top: 12vw; padding-top: 8vw; padding-bottom: 12vw;}
    .main_content_wrap h2{font-size: 5.4vw;}
    .main_content_wrap h2 + p{margin-top:2.2vw; font-size:2.6vw;}
    .product_list_text{font-size:2vw;}
    .product_list{margin-top:6vw;}

    .main_title_style{font-size:3.2vw;}
    .main_content_text ul li{padding-left:1.4vw;}
    .main_content_text ul li + li{margin-top:2vw;}
    .main_content_text ul li::before{top:1vw;}
    .main_btn_wrap a{font-size:3vw;}

    .foorter_privacy li{font-size:2.4vw;}
    .foorter_privacy li + li{margin-top:1.4vw;}

}

@media screen and (max-width: 768px) {
    .camera_slide_wrap {
        padding: 0 50px;
    }
    
    .camera-button-prev,
    .camera-button-next {
        width: 40px;
        height: 40px;
    }
    
    .camera-button-prev::after {
        border-width: 8px 12px 8px 0;
        margin-left: -2px;
    }
    
    .camera-button-next::after {
        border-width: 8px 0 8px 12px;
        margin-right: -2px;
    }
    
    .swiper-slide iframe {
        height: 300px;
    }
    
    /* 모바일 이미지 업로드 */
    .image_preview_item {
        width: 150px;
        height: 150px;
    }
    
    .image_preview_container {
        justify-content: center;
        gap: 10px;
    }
    
    .add_icon {
        font-size: 30px;
    }
    
    .add_text {
        font-size: 12px;
    }
}

@media screen and (max-width: 680px) {
    .main_content{padding-top:12vw; margin-top:-16vw;}
}

@media screen and (max-width: 640px) {
.lang_btn{font-size:3vw; height:6vw; line-height:6vw; width:16.5vw; padding-left:6vw;}
.lang_wrap ul a{height:5vw; line-height:5vw; font-size:3vw; padding-left:3vw;}
.lang_wrap{margin-left:2.4vw;}
.header_wrap{padding:5vw 0;}
.header_logo img{width:48vw;}

.camera-button-prev, .camera-button-next{width:24px; height:40px;}
.camera-button-prev{left:-10px;}
.camera-button-next{right:-10px;}

.main_container{padding-top:28vw; padding-bottom:60vw;}
.camera_btn span{font-size:4.6vw; height:8.6vw; line-height:8.6vw;}

.completed_content{padding-top: 12vw; margin-top: 12vw; padding-bottom:16vw;}
.completed_content p{font-size:4.4vw; padding-left:2vw; padding-right:2vw;}
.completed_sns_img{top:33vw; width:14vw;}
.completed_sns_list{margin-top:8vw;}

.main_content_wrap h2{font-size:7.4vw;}
.main_content_wrap h2 + p{font-size:4vw;}
.main_content_wrap h2 + p br{display:none;}

.product_list > div{width:calc(50% - 7px);}
.product_list_text{font-size: 3.2vw;}
.main_title_style{font-size:5.2vw;}
.fs22{font-size:3.6vw; line-height:1.6;}
.main_content_text ul li{padding-left:2.4vw;}
.main_content_text ul li::before{top:2vw;}
.fs46{font-size:6vw;}
.main_btn_wrap{flex-wrap:wrap;}
.main_btn_wrap a{width:100%; font-size:4.6vw; height:12vw; line-height:12vw;}
.foorter_privacy li{font-size:3.6vw;}
.foorter_privacy li:before{top:1.8vw;}
.footer{padding-top:12vw; padding-bottom:16vw;}
.footer_logo{margin-top:6vw;}
.footer_logo img{width:60vw;}

.main_content_wrap .main_btn_wrap a:after{width:18px; height:18px;}


}


@media screen and (max-width: 480px) {
    .camera_slide_wrap {
        padding: 0 40px;
    }
    
    .swiper-slide iframe {
        height: 200px;
    }
    
    /* 모바일 이미지 업로드 - 더 작은 화면 */
    .image_preview_item {
        width: 120px;
        height: 120px;
    }
    
    .image_preview_container {
        gap: 8px;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    
    .add_icon {
        font-size: 24px;
    }
    
    .add_text {
        font-size: 10px;
    }
}