@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;700&display=swap');
@import url('font/font.css');
@import url('common.css');
@import url('animation.css');


/* popup.211010 */
.conPopup {width:100%;max-width:1920px;margin:0 auto;position:absolute;top:40px;left:0;right:0;z-index:98;}
.popup_wrap {position:absolute;top:200px;background:#000;display:inline-block;}
.popup_wrap > img {border-top:1px solid #eee;border-left:1px solid #eee;border-right:1px solid #eee;}
.popup_btn {padding:10px 0; background:#373737;}
.popup_btn .check_box {margin:0 10px !important;}
.popup_btn span.text {color:#fff !important;}
.popup_btn > a {color:#fff;margin:0 10px;float:right; font-size:14px; padding:4px;}
#area {position: relative; /* absolute는 부모가 relative일 때 부모를 따라간다. */  width: 100%;  padding-bottom: 56.25%; /* 16:9 비율 */}
#video {position: absolute;  width: 100%; /* 부모에 맞게 꽉 채운다. */  height: 100%;}

/* popup 우선순위 : 왼쪽부터 노출 우선순위 내림차순, 우선순위 최대값 15, 최대 등록 3개 */
.popup_wrap.popup00 {right:10px;z-index:19; }
.popup_wrap.popup01 {left:10px;z-index:17; top:50px;}
.popup_wrap.popup02 {left:466px;z-index:16; top:50px;}
.popup_wrap.popup03 {left:921px; z-index:15; top:50px; }
.popup_wrap.popup04 {left:1377px; z-index:14; top:50px;}
.popup_wrap.popup05 {right:10px; z-index:13;}

.conPopup .popup_wrap .closeLayer_pop {
    position: absolute;
    right: 14px;
    top: 14px;
    width: 30px;
    height: 30px;
    text-indent: -9999px;
    background: transparent;
    border: 0;
    transform: rotate(45deg);
    cursor: pointer;
    z-index: 3;
}


@media screen and (max-width: 1100px) {
	.conPopup {width:100%;}
	.popup_wrap {top:15vh;max-width:448px;}
	.popup_wrap > img {width:100%;}	
	.popup_wrap > a img {width:100%;}
	.popup_wrap.popup00, .popup_wrap.popup01, .popup_wrap.popup02, .popup_wrap.popup03, .popup_wrap.popup04, .popup_wrap.popup05 {left:50%;transform:translateX(-50%); width:90%;top:50px; }
    
}



@media screen and (max-width: 768px) {
	
}




/*** [Pc] --/start/-- ***/

#conPC {opacity:1;visibility:visible;position:relative;top:0;left:0;width:100%;transition:all .6s cubic-bezier(0.785, 0.135, 0.15, 0.86);-webkit-transition:all .6s cubic-bezier(0.785, 0.135, 0.15, 0.86);}
#conPC .pc_fixedbar {position:fixed;z-index:100;width:100%;height:auto;transition:all 1s;-webkit-transition:all 1s;}
#conPC .pc_fixedbar.top {top:0;}
#conPC .pc_fixedbar.bottom {bottom:0;}
#conPC .pc_fixedbar.left {left:0;}
#conPC .pc_fixedbar.right {right:0;}
#conPC .pc_fixedbar.top.hidden {top:-300px;}
#conPC .pc_fixedbar.bottom.hidden {bottom:-300px;}


#conPC .pc_fixedbar > div .formlist {font-size:0;}
#conPC .pc_fixedbar > div .formlist > li {display:inline-block;vertical-align:top;font-size:12px;}
#conPC .pc_fixedbar > div .formlist > li:nth-child(1) {width:calc(100% - 200px);padding-right:10px;}
#conPC .pc_fixedbar > div .formlist > li:nth-child(1) > ul {display:block;width:auto;}
#conPC .pc_fixedbar > div .formlist > li:nth-child(1) > ul > li {margin-bottom:5px;}
#conPC .pc_fixedbar > div .formlist > li:nth-child(1) > ul > li:last-child {margin-bottom:0;}
#conPC .pc_fixedbar > div .formlist > li:nth-child(2) {width:200px;}
#conPC .pc_fixedbar > div .input {font-size:0;}
#conPC .pc_fixedbar > div .input > span {font-size:12px;display:inline-block;vertical-align:middle;color:#000;}
#conPC .pc_fixedbar > div .input > span:nth-child(1) {width:60px;font-size:16px;font-weight: 500;}
#conPC .pc_fixedbar > div .input > span:nth-child(2) {width:calc(100% - 60px);}


/* 상단 고정 바 */
#conPC .pc_fixedtop {position:fixed;bottom:0;left:0;z-index:100;width:100%;height:161px;background:url('../images/pc/header.gif') center top no-repeat;}
#conPC .pc_fixedtop .content {max-width:1200px;width:100%;position:absolute;top:65%;left:48.5%;transform:translate(-50%, -50%);}
/*#conPC .pc_fixedtop_height {height:150px;}*/
#conPC .pc_fixedtop .fix_btn {width:50%;float:left; margin-top:2%; margin-left:41.5%;}
#conPC .pc_fixedtop .fix_btn li:first-child {float:left; width:18.3%; cursor: pointer; }
#conPC .pc_fixedtop .fix_btn li:last-child {float:left;margin-left:2%; width:26.2%; cursor: pointer;}



#conPC .pc_fixedtop .dbform_fix {width:70%;margin-left:30%;}
#conPC .pc_fixedtop .dbform_fix .db_list {width:75%;float:left;}
#conPC .pc_fixedtop .dbform_fix .db_list li {width:15%;float:left;margin-left:2%;}
#conPC .pc_fixedtop .dbform_fix .db_list li .input-control {padding:13px 15px;color: #9f9f9f; -webkit-border-radius: 0; border-radius: 8px;}
#conPC .pc_fixedtop .dbform_fix .db_list li .conPCTop {width: 50%; float: left;}
#conPC .pc_fixedtop label {cursor:pointer;}
#conPC .pc_fixedtop .agreebox {position:absolute;top:-40px;right:30px}
#conPC .pc_fixedtop .agreebox .text {color:#595959;}
#conPC .pc_fixedtop .agreebox .show-policy {color:#fff;font-weight:bold;margin-left:3px;font-size:14px;vertical-align:middle}
#conPC .pc_fixedtop .submitbox {float:left;}
#conPC .pc_fixedtop .submitbox button {cursor:pointer;}
#conPC .pc_fixedtop input[type="checkbox"] {display:none;}
#conPC .pc_fixedtop .agreebox .icon {background:#fff; border-radius:5px;}
/*#conPC .pc_fixedtop .agreebox [class*="customcheck"]:checked ~ .icon::after {border-left:2px solid #008d91;border-bottom:2px solid #008d91;}*/
#conPC .privacy_con_box_fix {position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:999;display:none;}
#conPC .privacy_con_box_fix .inner {position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;background:#fff;padding:40px;}
#conPC .privacy_con_box_fix .inner h3 {font-weight:bold;padding-bottom:20px}
#conPC .privacy_con_box_fix .inner p {width:558px;height:200px;overflow-y:scroll;border:1px solid #eee;padding:20px;line-height:1.5em; font-size:14px;}
#conPC .privacy_con_box_fix .inner a {position:absolute;top:0;right:10px;font-size:35px;display:inline-block;}
#conPC .privacy_con_box_fix .inner a:before {content:' \00D7';color:#000;}

/* 사이드 고정 메뉴 */
#conPC .fixed_top {position:fixed;bottom:110px;right:5%;z-index:9999;}
#conPC .fixed_kakao {position:fixed;bottom:140px;right:6%;z-index:9999;}
#conPC .fixed_blog {position:fixed;bottom:40px;right:6%;z-index:9999;}


#conPC .footer .content{max-width: 1920px;background-color:#141414;text-align:center;padding:60px 0;margin:0 auto;}
#conPC .footer .content p{line-height: 1.5; color:#a3a3a3;font-size:1.1rem;}
#conPC .footer .content p a{color:#5893ff;}
#conPC .footer .content p:last-child{padding-top: 20px;}



/* PC - 폼 영역 */
.Real #conPC .db_list {}
#conPC .dbform {width:878px;position:absolute;top:65%;left:50%;transform:translate(-50%, -50%);}
#conPC .dbform form > ul > li {padding:5px 0;}
#conPC .dbform form > ul > li div > span {display:inline-block;vertical-align:middle;font-size:25px;padding:5px;font-weight:bold;color:#000;}
#conPC .dbform form > ul > li div > span em {font-weight:normal;font-size:18px;}
#conPC .dbform form > ul > li div > span:first-child {width:120px;margin-left:60px;text-indent:-9999px;}
#conPC .dbform form > ul > li div > span:last-child {width:calc(100% - 300px);text-align:left;overflow:hidden;margin-left:30px;}
#conPC .dbform form > ul > li div > span.vat {vertical-align:top;margin-top:10px;}
#conPC .dbform form > ul > li div textarea[type=text] {height:150px;}
#conPC .dbform .db_list > li .checkitem {font-size:0;}
#conPC .dbform .db_list > li .checkitem > label {display:inline-block;vertical-align:middle;font-size:12px;margin-right:15px;}
#conPC .dbform .db_list > li .checkitem > label {display:inline-block;vertical-align:middle;font-size:12px;margin-right:15px;}
#conPC .dbform label {cursor:pointer;}
#conPC .dbform .agreebox {margin-left:225px;}
#conPC .dbform .agreebox [class*="customcheck"] ~ .text {font-size:18px;color:#fff;}
#conPC .dbform .agreebox .show-policy {color:#fff;font-weight:bold;margin-left:3px;font-size:18px;vertical-align:middle}
#conPC .dbform .submitbox {width:100%;height:77px;text-align:center; overflow:hidden;}
#conPC .dbform .submitbox button {width:523px;height:77px;background:transparent;cursor:pointer;}
#conPC .dbform input[type="checkbox"] {display:none;}
#conPC .dbform div label {cursor:pointer;}
#conPC .privacy_con_box {position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:999;display:none;}
#conPC .privacy_con_box .inner {position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;background:#fff;padding:40px;}
#conPC .privacy_con_box .inner h3 {font-weight:bold;padding-bottom:20px}
#conPC .privacy_con_box .inner p {width:558px;height:200px;overflow-y:scroll;border:1px solid #eee;padding:20px;line-height:1.5em; font-size:14px;}
#conPC .privacy_con_box .inner a {position:absolute;top:0;right:10px;font-size:35px;display:inline-block;}
#conPC .privacy_con_box .inner a:before {content:' \00D7';color:#000;}



        .conPopup .popup_wrap .closeLayer_pop {position: absolute; right: 14px; top: 14px; width: 30px; height: 30px; text-indent: -9999px; background: transparent; border: 0; transform: rotate(45deg); cursor: pointer; z-index: 3;}
        .conPopup .popup_wrap .closeLayer_pop:after {position: absolute; left: 50%; top: 50%; width: 100%; height: 2px; background: #fff; transform: translate(-50%, -50%); content: ""; }
        .conPopup .popup_wrap .closeLayer_pop:before {position: absolute; left: 50%; top: 50%; width: 2px; height: 100%; background: #fff; transform: translate(-50%, -50%); content: "";}

         #conPC img {width:100%; image-rendering: -webkit-optimize-contrast;}
         #conPC .pc_fixedtop {position:fixed; top:auto; bottom: 0; left: 0; z-index: 100; width: 100%; height:95px; background:none;}
        #conPC .pc_fixedtop .content {top:0; left:50%; width:100vw; max-width: 1920px; height:95px; margin: 0 auto; background: url(/contents/img/pc/footer_bg.gif) 0 0 no-repeat; background-size:100% auto; transform:translate(-50%, 0); background-color:#000;}
        #conPC .pc_fixedtop .dbform_fix {position:absolute; top:1.2vw; left:20%; width:100%; max-width:1200px; margin-left:0;}
        #conPC .pc_fixedtop .dbform_fix .db_list {width:78%; margin-left:26%}
        #conPC .pc_fixedtop .dbform_fix .db_list li:first-child {margin-left:0%; }
        #conPC .pc_fixedtop .dbform_fix .db_list li:nth-child(2) {margin-left:1%;}
        #conPC .pc_fixedtop .dbform_fix .db_list li:last-child {margin-left:1%; }
        #conPC .pc_fixedtop .dbform_fix .db_list li .input-control { border-color:#959595;}
        #conPC .pc_fixedtop .dbform_fix .db_list li input {/*font-size:1.12vw;*/ color:#9f9f9f;}
        #conPC .pc_fixedtop .landing_form:after {content:''; display:block; clear:both;}
        #conPC .pc_fixedtop .landing_form .submitbox {position:absolute; left:62%; top:-9%; }
        #conPC .pc_fixedtop .landing_form .submitbox button {vertical-align:top; background:transparent;}
        #conPC .pc_fixedtop .agreebox {top:0.5vw; left:80.5%; right:auto; white-space:nowrap;}
        #conPC .pc_fixedtop .agreebox .text {margin-left:4px; font-size:0.8vw; color:#fff; line-height:1;}
        #conPC .pc_fixedtop .dbform_fix .db_list select {background: url(/contents/img/pc/arow.png) no-repeat 95% 50%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color:#fff;}



        
        #conPC .visual .content {width: 100%; max-width: 1920px; }
        #conPC .visual .content .mainBanner .btn_next {position:absolute;top:50%;right:8%;cursor:pointer;transform:translateY(-50%);z-index:5}
        #conPC .visual .content .mainBanner .btn_prev {position:absolute;top:50%;left:8%;cursor:pointer;transform:translateY(-50%);z-index:5}
        
        #conPC .success_story {position:relative;}
        #conPC .success_story .layericon01 {position:absolute; width:37.35%; top:33%; left:31%;}
        #conPC .success_story .layericon02 {position:absolute; width:37.35%; top:70%; left:31%;}
      /*#conPC .storeBanner {width:66%; left:17.5%;}
        #conPC .storeBanner img {width:100%; image-rendering: -webkit-optimize-contrast;}*/

        #conPC .success_story .btn {position:absolute; top: 53%; left:50%; z-index:20; width:100%;}
        #conPC .success_story .swiper-button-next {left:31%;  width:84px; height:84px; background:url(/contents/images/pc/btn_main_next.png) center no-repeat;}
        #conPC .success_story .swiper-button-prev {left:-36%;  width:84px; height:84px; background:url(/contents/images/pc/btn_main_prev.png) center no-repeat;}
        #conPC .success_thumb .swiper-wrapper{justify-content: center; padding:2%; width:96%;}
        #conPC .success_thumb2 .swiper-wrapper{justify-content: center; padding:2%; width:96%;}
        #conPC .success_thumb .swiper-slide.swiper-slide-visible.swiper-slide-thumb-active {color: #ffffff; background-image: linear-gradient(to right, #00b079, #028db9);}
        #conPC .success_thumb2 .swiper-slide.swiper-slide-visible.swiper-slide-thumb-active {color: #ffffff; background-image: linear-gradient(to right, #00b079, #028db9);}
        #conPC .success_thumb_btn {cursor: pointer; width: 92px; text-align:center; padding: 5px 15px 5px 15px; font-size: 14px; border: 1px solid #00CC66; border-radius:27px; font-family: "NotoSansKR", "sans-serif"; font-weight: 400;}


        #conPC .pc_fixedtop_height_img {position:relative;}
        #conPC .pc_fixedtop_height_img .layericon01 {position:absolute; top:0; left:0; width:100%;}

/* 공용 모션 클래스 초기 상태 */
.gs_up { opacity: 0; visibility: hidden; }

/* 영상이 들어가는 섹션 */
        #conPC .sec_video_img .layericon-video {position: absolute; top: 0%;  width: 100%; left: 0%; }
        #conPC .sec_video_img .layericon-video .video_bg {overflow: hidden;  position: relative;  width: 100%;  padding-bottom: 56.25%; /* filter: brightness(40%); */}
       #conPC .sec_video_img .layericon-video .video_bg iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

    

/* 섹션 01 기본 구조 */
#conPC .sec01_img {
  position: relative;
  overflow: hidden;
  background-color: #000; /* 영상 대신 이미지를 쓸 때 배경색 안정화 */
}

#conPC .sec01_img > img {
  display: block;
  width: 100%;
}

/* 성능 최적화: 가속이 필요한 레이어들 */
#conPC .sec01_img > img,
#conPC .sec01_img > div {
  will-change: transform, opacity, filter, clip-path;
}

/* 각 레이어 위치 (실장님 원본값 유지) */
#conPC .sec01_img .layericon01 {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  z-index: 3;
}

#conPC .sec01_img .layericon02 {
  position: absolute;
  top: 12%;
  left: 20%;
  width: 10.63%;
  z-index: 3;
  overflow: hidden;
}

#conPC .sec01_img .layericon03 {
  position: absolute;
  top: 74%;
  left: 29%;
  width: 24.6%;
  z-index: 3;
  overflow: hidden;
}

#conPC .sec01_img .layericon04 {
  position: absolute;
  top: 0%;
  left: 72%;
  width: 6.76%;
  z-index: 3;
}

#conPC .sec01_img .layericon05 {
  position: absolute;
  top: 23%;
  left: 0%;
  width: 27.35%;
  z-index: 5;
}

/* [수정] 연기 레이어 공통 설정 (SVG 필터 적용) */
#conPC .sec01_img .layericon06,
#conPC .sec01_img .layericon07,
#conPC .sec01_img .layericon08 {
  position: absolute;
  z-index: 3;
  pointer-events: none;
  mix-blend-mode: screen;
  transform-origin: 50% 100%;
  
  /* [핵심] HTML에 넣은 SVG 필터 id(#steam-distortion)를 호출합니다 */
  filter: url(#steam-distortion) blur(3px); 
  opacity: 0; /* JS 애니메이션 시작 전에는 숨김 */
}

/* 개별 연기 위치 (실장님 원본값 유지) */
#conPC .sec01_img .layericon06 {
  top: -9%;
  left: 38%;
  width: 61%;
}

#conPC .sec01_img .layericon07 {
  top: -17%;
  left: 36%;
  width: 37.55%;
}

#conPC .sec01_img .layericon08 {
  top: -13%;
  left: 43%;
  width: 28%;
}

/* 이미지 태그 공통 (레이어 내부 이미지) */
#conPC .sec01_img div img {
  width: 100%;
  display: block;
}

/* [SECTION 01] 초기 노출 방지 - CSS에 추가 */
#conPC .sec01_img .layericon01, 
#conPC .sec01_img .layericon03, 
#conPC .sec01_img .layericon04, 
#conPC .sec01_img .layericon05, 
#conPC .sec01_img .layericon06, 
#conPC .sec01_img .layericon07, 
#conPC .sec01_img .layericon08 {
    opacity: 0;
    visibility: hidden; /* JS가 실행되기 전까지 공간만 차지하고 숨김 */
}

/* layericon02는 기존처럼 clip-path로 관리 */
#conPC .sec01_img .layericon02 {
    clip-path: inset(100% 0% 0% 0%);
    visibility: hidden;
}
        
        #conPC .sec01_img .layericon09 {position:absolute; top:80%; left:24%;width:47.05%;}
        #conPC .sec01_img .layericon10 {position:absolute; top:5%; left:16.5%;width:65.7%;}
        #conPC .sec01_img .layericon-video {position: absolute; top: 0%;  width: 100%; left: 0%; }
        #conPC .sec01_img .layericon-video .video_bg {overflow: hidden;  position: relative;  width: 100%;  padding-bottom: 56.25%; /* filter: brightness(40%); */}
        #conPC .sec01_img .layericon-video .video_bg iframe { position: absolute; top: -60px; bottom: -60px; left: 0; width: 100%; height: calc(100% + 120px); border: none;}

        /*
        #conPC .sec01_img .layericon00 {position:absolute; top:4.5%; left:21.5%; transform: translate(-50%, -50%); width:56.3%}
        #conPC .sec01_img .layericon01 {position:absolute; top:20%; left:14%; /*transform: translate(-50%, -50%);/ width:72.9%}
        #conPC .sec01_img .video_box1 {position:absolute; top:5%; left:1%; transform: translate(-50%, -50%); width:63.9% ; padding-bottom:56.25%; padding-top:30px; margin-top:5%; overflow: hidden;margin: 0px auto; z-index:15;}
        #conPC .video_box1 iframe,
        #conPC .video_box1 object,
        #conPC .video_box1 embed {position:absolute; top:29%; left:24.5%; width:52.5%; height:32.5%;}
        #conPC .sec01_img .layericon02 {position:absolute; top:46%; left:14%; /*transform: translate(-50%, -50%);/ width:72.9%}
        #conPC .sec01_img .video_box2 {position:absolute; top:31%; left:34.5%; transform: translate(-50%, -50%); width:63.9% ; padding-bottom:56.25%; padding-top:30px; margin-top:5%; overflow: hidden;margin: 0px auto; z-index:11;}
        #conPC .video_box2 iframe,
        #conPC .video_box2 object,
        #conPC .video_box2 embed {position:absolute; top:29%; left:24.5%; width:52.5%; height:32.5%;}
        #conPC .sec01_img .layericon03 {position:absolute; top:72%; left:14%; /*transform: translate(-50%, -50%);/ width:72.9%}
        #conPC .sec01_img .video_box3 {position:absolute; top:57%; left:1%; transform: translate(-50%, -50%); width:63.9% ; padding-bottom:56.25%; padding-top:30px; margin-top:5%; overflow: hidden;margin: 0px auto; z-index:10;}
        #conPC .video_box3 iframe,
        #conPC .video_box3 object,
        #conPC .video_box3 embed {position:absolute; top:29%; left:24.5%; width:52.5%; height:32.5%;}
        */
     
        
        #conPC .sec02_img {position:relative; overflow: hidden;}

        #conPC .sec02_img .layericon01 {position:absolute; top:20%; left:50%; width:29.25%; transform: translate(-50%);}          
        #conPC .sec02_img .layericon02 {position:absolute; top:42%; left:50%; width:36.35%; transform: translate(-50%); }                      
        #conPC .sec02_img .layericon03 {position:absolute; top:60%; left:50%; width:19.6%; transform: translate(-50%);}
        #conPC .sec02_img .layericon01, #conPC .sec02_img .layericon02, #conPC .sec02_img .layericon03 { opacity: 0; visibility: hidden; }


        #conPC .sec02-1_img .layericon01 {position:absolute; top:70%; left:50%; transform: translate(-50%, -50%); width:100.3%;} 

        #conPC .sec02-1_img .video_box1 {position:absolute; top:79%; left:49.3%; transform: translate(-50%, -50%); width:94% ; padding-bottom:82.25%; padding-top:30px; margin-top:5%; overflow: hidden;margin: 0px auto; z-index:15;}
        #conPC .video_box1 iframe,
        #conPC .video_box1 object,
        #conPC .video_box1 embed {position:absolute; top:29%; left:24.5%; width:52.5%; height:32.5%;}




#conPC .sec03_img {  position: relative;   overflow: hidden;   background-color: #000; /* 영상 대신 이미지를 쓸 때 배경색 안정화 */ }
#conPC .sec03_img > img {  display: block;   width: 100%; }  /* 성능 최적화: 가속이 필요한 레이어들 */ 
#conPC .sec03_img > img, #conPC .sec01_img > div {   will-change: transform, opacity, filter, clip-path; }

/* 각 레이어 위치 (실장님 원본값 유지) */
#conPC .sec03_img .layericon01 {   position: absolute;   top: 0%;   left: 0%;   width: 100%;   z-index: 3; } 
#conPC .sec03_img .layericon02 {   position: absolute;   top: 12%;   left: 65%;   width: 10.63%;   z-index: 3;  overflow: hidden; }
#conPC .sec03_img .layericon03 {   position: absolute;   top: 72%;   left: 56%;    width: 24.6%;   z-index: 3;  overflow: hidden;}
#conPC .sec03_img .layericon04 {  position: absolute;   top: 0%;   left: 72%;   width: 6.76%;   z-index: 3; }
#conPC .sec03_img .layericon05 {   position: absolute;   top: 32%;   right: 0%;   width: 33.8%;  z-index: 5; }

/* [수정] 연기 레이어 공통 설정 (SVG 필터 적용) */
#conPC .sec03_img .layericon06, #conPC .sec03_img .layericon07, #conPC .sec03_img .layericon08 {   position: absolute;   z-index: 3;   pointer-events: none;   mix-blend-mode: screen;   transform-origin: 50% 100%;   filter: url(#steam-distortion) blur(3px);    opacity: 0; }

/* 개별 연기 위치 (실장님 원본값 유지) */
#conPC .sec03_img .layericon06 {  top: -9%;   left: 10%;   width: 61%; } 
#conPC .sec03_img .layericon07 {   top: -16%;   left: 3%;   width: 37.55%; }
#conPC .sec03_img .layericon08 {   top: 49%; left: 27%;  width: 25%;}

/* 이미지 태그 공통 (레이어 내부 이미지) */
#conPC .sec03_img div img {   width: 100%;   display: block;}
#conPC .sec03_img .layericon01, #conPC .sec03_img .layericon03, #conPC .sec03_img .layericon04, #conPC .sec03_img .layericon05, #conPC .sec03_img .layericon06, #conPC .sec03_img .layericon07, #conPC .sec03_img .layericon08 {   opacity: 0;    visibility: hidden; }
#conPC .sec03_img .layericon02 {    clip-path: inset(100% 0% 0% 0%);    visibility: hidden;}

#conPC .sec04_img {   position: relative;   overflow: hidden;   background-color: #000; }
#conPC .sec04_img > img {   display: block;  width: 100%;}
#conPC .sec04_img > img, #conPC .sec01_img > div {  will-change: transform, opacity, filter, clip-path;}
#conPC .sec04_img .layericon01 {  position: absolute;  top: 0%;  left: 0%;  width: 100%;  z-index: 3;}
#conPC .sec04_img .layericon02 {  position: absolute;  top: 12%;  left: 20%;  width: 10.63%;  z-index: 3;  overflow: hidden;}
#conPC .sec04_img .layericon03 {  position: absolute;  top: 74%;  left: 29%;  width: 24.6%;  z-index: 3;  overflow: hidden;}
#conPC .sec04_img .layericon04 {  position: absolute;  top: 0%;  left: 72%;  width: 6.76%;  z-index: 3;}
#conPC .sec04_img .layericon05 {  position: absolute;  top: 12%;  left: 0%;  width: 35.9%;  z-index: 5;}
#conPC .sec04_img .layericon06, #conPC .sec04_img .layericon07, #conPC .sec04_img .layericon08 { position: absolute;  z-index: 3;  pointer-events: none;  mix-blend-mode: screen;  transform-origin: 50% 100%;   filter: url(#steam-distortion) blur(3px);  }


/* 개별 연기 위치 (실장님 원본값 유지) */
#conPC .sec04_img .layericon06 {  top: -9%;  left: 38%;  width: 61%;}
#conPC .sec04_img .layericon07 {  top: -17%;  left: 36%;  width: 37.55%;}
#conPC .sec04_img .layericon08 {  top: 33%;  left: 42%;  width: 42%;}
#conPC .sec04_img div img {  width: 100%;  display: block;}
#conPC .sec04_img .layericon01, #conPC .sec04_img .layericon03, #conPC .sec04_img .layericon04, #conPC .sec04_img .layericon05, #conPC .sec04_img .layericon06, #conPC .sec04_img .layericon07, #conPC .sec04_img .layericon08 {  opacity: 0;    visibility: hidden; }
#conPC .sec04_img .layericon02 {    clip-path: inset(100% 0% 0% 0%);    visibility: hidden;}

#conPC .sec05_img {  position: relative;   overflow: hidden;   background-color: #000; /* 영상 대신 이미지를 쓸 때 배경색 안정화 */ }
#conPC .sec05_img > img {  display: block;   width: 100%; }  /* 성능 최적화: 가속이 필요한 레이어들 */ 
#conPC .sec05_img > img, #conPC .sec01_img > div {   will-change: transform, opacity, filter, clip-path; }

/* 각 레이어 위치 (실장님 원본값 유지) */
#conPC .sec05_img .layericon01 {   position: absolute;   top: 0%;   left: 0%;   width: 100%;   z-index: 3; } 
#conPC .sec05_img .layericon02 {   position: absolute;   top: 12%;   left: 65%;   width: 10.63%;   z-index: 3;  overflow: hidden; }
#conPC .sec05_img .layericon03 {   position: absolute;   top: 72%;   left: 56%;    width: 24.6%;   z-index: 3;  overflow: hidden;}
#conPC .sec05_img .layericon04 {  position: absolute;   top: 0%;   left: 72%;   width: 6.76%;   z-index: 3; }
#conPC .sec05_img .layericon05 {   position: absolute;   top: 21%;   right: 0%;   width: 30.74%;  z-index: 5; }

/* [수정] 연기 레이어 공통 설정 (SVG 필터 적용) */
#conPC .sec05_img .layericon06, #conPC .sec05_img .layericon07, #conPC .sec05_img .layericon08 {   position: absolute;   z-index: 3;   pointer-events: none;   mix-blend-mode: screen;   transform-origin: 50% 100%;   filter: url(#steam-distortion) blur(3px);    opacity: 0; }

/* 개별 연기 위치 (실장님 원본값 유지) */
#conPC .sec05_img .layericon06 {  top: 12%;   left: 7%;   width: 61%; } 
#conPC .sec05_img .layericon07 {   top: -2%;   left: 3%;   width: 37.55%; }
#conPC .sec05_img .layericon08 {   top: 13%; left: 39%;  width: 37%;}

/* 이미지 태그 공통 (레이어 내부 이미지) */
#conPC .sec05_img div img {   width: 100%;   display: block;}
#conPC .sec05_img .layericon01, #conPC .sec05_img .layericon03, #conPC .sec05_img .layericon04, #conPC .sec05_img .layericon05, #conPC .sec05_img .layericon06, #conPC .sec05_img .layericon07, #conPC .sec05_img .layericon08 {   opacity: 0;    visibility: hidden; }
#conPC .sec05_img .layericon02 {    clip-path: inset(100% 0% 0% 0%);    visibility: hidden;}
   


        
        #conPC .sec06_img {position:relative;}
        #conPC .sec06_img .layerlogo {position:absolute; top:5%; left:71%; width:5.3%;}
        #conPC .sec06_img .layerlogo img {animation: rotate_image 12s linear infinite;transform-origin: 50% 50%;}
        #conPC .sec06_img .layericon01 {position:absolute; top:13%; left:50%; width:41.8%; transform: translate(-50%);}
        #conPC .sec06_img .layericon02 {position:absolute; top:21%; left:50%; width:52.73%; transform: translate(-50%);}
        #conPC .sec06_img .layericon03 {position:absolute; top:28%; left:50%; width:32.3%; transform: translate(-50%);}
        #conPC .sec06_img .layericon04 {position:absolute; top:70%; left:50%; width:52.6%; transform: translate(-50%);}
        #conPC .sec06_img .layericon05 {position:absolute; top:80%; left:50%; width:29.25%; transform: translate(-50%);}
        #conPC .sec06_img .layericon06 {position:absolute; top:88%; left:50%; width:36.4%; transform: translate(-50%);}

        #conPC .sec07_img {position:relative;}
        #conPC .sec07_img .layericon01 {position:absolute; top:13%; left:24%; width:34.65%;}
        #conPC .sec07_img .layericon02 {position:absolute; top:61%; left:24%; width:20%;}
        #conPC .sec07_img .layericon03 {position:absolute; top:3%; left:45%; width:40.9%;}
        #conPC .sec07_img .layericon04 {position:absolute; top:12%; left:62%; width:13.7%;}
        /*#conPC .sec07_img .layericon01 img {animation: heartbeat 1.5s ease-in-out infinite both;animation: heartbeat 1.5s ease-in-out infinite both;}*/



        #conPC .sec08_img {position:relative;}
        #conPC .sec08_img .layericon01 {position:absolute; top:11%; left:50%; width:23.35%; transform: translate(-50%);}        
        #conPC .sec08_img .layericon02 {position:absolute; top:17%;  left:28%; width:46.7%; }
        #conPC .sec08_img .layericon03 {position:absolute; top:32%; ; left:50%; width:28.55%; transform: translate(-50%);}
        #conPC .sec08_img .layericon04 {position:absolute; bottom:0; ; left:14%; width:72.35%;}
        #conPC .sec08_img .layericon05 {position:absolute; bottom:10%; ; left:21.5%; width:17.75%;}

        #conPC .sec09_img {position:relative;}
        #conPC .sec09_img .layericon01 {position:absolute; top:46%; left:0%; width:100%;}
        #conPC .sec09_img .layericon02 {position:absolute; top:36%; left:38%; width:22.75%;}

        #conPC .sec10_img {position:relative;}        
        #conPC .sec10_img .layericon01 {position:absolute; top:34%; left:0%; width:100%;}
        #conPC .sec10_img .layericon02 {position:absolute; top:26%; left:29%; width:41.65%;}        
      

        #conPC .sec11_img {position:relative;}
        #conPC .sec11_img .layericon01 {position:absolute; top:22%; left:50%; width:38.4%; transform: translate(-50%); }
        #conPC .sec11_img .layericon01 img {animation: rotate_image 16s linear infinite; transform-origin: 50% 50%;}        
        #conPC .sec11_img .layericon02 {position:absolute; top:28.6%; left:50%; width:34.65%; transform: translate(-50%);}
        #conPC .sec11_img .layericon02 img {animation: rotate_image 20s linear infinite;transform-origin: 50% 50%;}        
        #conPC .sec11_img .layericon03 {position:absolute; top:25%; left:24%; width:11.45%;}
        #conPC .sec11_img .layericon04 {position:absolute; top:25%; left:62.5%; width:11.5%;}
        #conPC .sec11_img .layericon05 {position:absolute; top:72%; left:25%; width:13.85%;}
        #conPC .sec11_img .layericon06 {position:absolute; top:72%; left:62.5%; width:12.6%;}

        #conPC .sec12_img {position:relative;}
        #conPC .sec12_img .layericon01 {position:absolute; top:57%; left:23%; width:8.75%;}
        #conPC .sec12_img .layericon02 {position:absolute; top:40.5%; left:32%; width:8.75%;}
        #conPC .sec12_img .layericon03 {position:absolute; top:33%; left:45%; width:8.75%;}
        #conPC .sec12_img .layericon04 {position:absolute; top:38.5%; left:58%; width:8.75%;}
        #conPC .sec12_img .layericon05 {position:absolute; top:57%; left:68.5%; width:8.75%;}

        #conPC .sec12_img .dish01 {position:absolute; top:70%; left:-3%; width:14.85%;}
        #conPC .sec12_img .dish02 {position:absolute; top:70%; left:13%; width:12.5%;}
        #conPC .sec12_img .dish03 {position:absolute; top:70%; left:74%; width:14.55%;}
        #conPC .sec12_img .dish04 {position:absolute; top:70%; left:89%; width:16.15%;}

#conPC .sec_12 .sec12_img { 
    position: relative; 
    width: 100%; 
    opacity: 1 !important; 
    visibility: visible !important; 
    transform: none !important; 
}
#conPC .sec_12 .sec12_img img { 
    display: block; 
    width: 100%; 
    transform: none !important; /* 배경 움직임 강제 방지 */
}

/* 아이콘과 음식 위치는 기존 CSS 그대로 유지하시되, z-index만 확보하세요 */
#conPC .sec_12 [class*="_sec12"] { z-index: 10; position: absolute; }


        #conPC .sec13_img {position:relative;}
/*      #conPC .sec13_img img.opac {-webkit-transform: scale(1);  	transform: scale(1); 	-webkit-transition: .5s ease-in-out; 	transition: .5s ease-in-out;} 
        #conPC .sec13_img img.opac:hover {-webkit-transform: scale(1.1); 	transform: scale(1.1);}*/

        #conPC .sec13_img .layericon01 {position:absolute; top:35%; left:18%; width:20.35%; }
        #conPC .sec13_img .layericon02 {position:absolute; top:35%; left:40%; width:20.35%;}
        #conPC .sec13_img .layericon03 {position:absolute; top:35%; left:62%; width:20.35%; }

      
        #conPC .sec14_img {position:relative;}
        #conPC .sec14_img img.opac {opacity:1;}
        #conPC .sec14_img img.opac:hover {transition: 1s ease-out; filter: brightness(1.3);-webkit-transform: scale(1.1); 	transform: scale(1.1);}
        #conPC .sec14_img img.opac:not(:hover) {transition: 1s ease-out; }
        #conPC .sec14_img .layericon01 {position:absolute; top:0%; left:0%; width:25%;}
        #conPC .sec14_img .layericon02 {position:absolute; top:0%; left:25%; width:25%;}
        #conPC .sec14_img .layericon03 {position:absolute; top:0%; left:50%; width:25%;}
        #conPC .sec14_img .layericon04 {position:absolute; top:0%; left:75%; width:25%;}
        #conPC .sec14_img .layericon05 {position:absolute; top:10%; left:35%; width:30.3%;}
        #conPC .sec14_img .layericon06 {position:absolute; top:77%; left:33%; width:34%;}

        #conPC .sec15_img {position:relative;}
        #conPC .sec15_img .layericon01  {position:absolute; top:0%; left:0%; width:100%;}
        #conPC .sec15_img .layericon01 .btn_next {position: absolute; top: 50%; right: 15%; cursor: pointer;  transform: translateY(-50%);    z-index: 99999;}
        #conPC .sec15_img .layericon01 .btn_prev {position: absolute; top: 50%; left: 15%; cursor: pointer;  transform: translateY(-50%);    z-index: 99999;}
        #conPC .sec15_img .layericon02  {position:absolute; top:10%; left:50%; width:35%; transform: translate(-50%);}


        #conPC .sec16_img {position:relative;}
        #conPC .sec16_img .layericon01  {position:absolute; top:26%; left:63%; width:18.28%;}
        #conPC .sec16_img .layericon02  {position:absolute; top:26%; left:19%; width:18.28%;}
        #conPC .sec16_img .layericon03  {position:absolute; top:26%; left:49%; width:17.3%;}
        #conPC .sec16_img .layericon04  {position:absolute; top:23%; left:33%; width:20.95%;}

        #conPC .sec17_img {position:relative;}
        #conPC .sec17_img .layericon01  {position:absolute; top:7%; left:17%; width:69.28%;}
        #conPC .sec17_img .layericon02  {position:absolute; top:73%; left:19%; width:18.35%;}
        #conPC .sec17_img .layericon03  {position:absolute; top:73%; left:41%; width:18.35%;}
        #conPC .sec17_img .layericon04  {position:absolute; top:73%; left:63%; width:18.35%;}

        #conPC .sec18_img {position:relative;}
        #conPC .sec18_img .layericon01  {position:absolute; top:33%; left:19%; width:32.25%;}
        #conPC .sec18_img .layericon02  {position:absolute; top:46%; left:20%; width:31.25%;}
        #conPC .sec18_img .layericon03  {position:absolute; top:64%; left:20%; width:31.25%;}
        #conPC .sec18_img .layericon04  {position:absolute; top:73%; left:67%; width:12.95%;}

        #conPC .sec19_img {position:relative;}
        #conPC .sec19_img .layericon01  {position:absolute; top:3%; left:20%; width:26.7%;}
        #conPC .sec19_img .layericon01  img {  filter: brightness(60%);  animation: flicker 0.5s linear alternate infinite; } 
        #conPC .sec19_img .layericon02  {position:absolute; top:1%; left:49%; width:31.85%;}
        #conPC .sec19_img .layericon03  {position:absolute; top:27%; left:18%; width:36.95%;}
        #conPC .sec19_img .layericon04  {position:absolute; top:37%; left:18%; width:36.95%;}
        #conPC .sec19_img .layericon05  {position:absolute; top:48%; left:18%; width:36.95%;}

        #conPC .sec20_img {position:relative;}
        #conPC .sec20_img .layericon01 {position:absolute; top:6%; left:67.5%; width:2.85%;cursor:pointer;}
        #conPC .sec20_img .layericon02 {position:absolute; top:6%; left:71%; width:2.85%;cursor:pointer;}
        #conPC .sec20_img .layericon03 {position:absolute; top:6%; left:74.5%; width:2.85%;cursor:pointer;}
        #conPC .sec20_img .layericon04 {position:absolute; top:6%; left:78%; width:2.85%;cursor:pointer;}

        #conPC .sec20_img .layericon01 .benefit .swiper-pagination { margin-bottom:2%;}
        #conPC .sec20_img .layericon01 .benefit .swiper-pagination-bullet {background-color: #f7b500; opacity: 1; width: 12px; height: 12px;}
        #conPC .sec20_img .layericon01 .benefit .swiper-pagination-bullet-active {background-color:#fff; opacity:1;}

        #conPC .seccomplete_img {position:relative;}
        #conPC .seccomplete_img .layericon01 {position:absolute; top:75%; left:37%; width:25.55%;}


        #conPC .swiper-button-prev:after, #conPC .swiper-button-next:after {display:none;}
        
        #conPC .sec_enquire .dbform {position:absolute; top:26.5%; left:43%; transform:none; width:46%;}       
        #conPC .sec_enquire .dbform form > ul > li div {font-size:0;}
        #conPC .sec_enquire .dbform form > ul > li div > span {font-size:1.72vw;}
        #conPC .sec_enquire .dbform form > ul > li div > span:first-child {width:22%; margin-left:0; text-indent: -9999px; }
        #conPC .sec_enquire .dbform form > ul > li div > span:last-child {overflow:hidden; width:61%; margin-left:0;}
        #conPC .sec_enquire .dbform form > ul > li div > .ghpeople_inner {}
        #conPC .sec_enquire .dbform form > ul > li div > .ghpeople_inner span.ghpeople {}
        #conPC .sec_enquire [class*="customcheck"] ~ .icon {border:1px solid #063c42; background-color:#e7ebe4; border-radius:4px;}
        #conPC .sec_enquire .input-control {padding:3.5%; border:1px solid #063c42; background-color:#f3f3f3; font-size:1.1vw; font-weight:400; color:#6f6f6f; border-radius:10px;}
        #conPC .sec_enquire .input-control:checked {padding-right: 10px;}
        #conPC .sec_enquire .dbform .agreebox {margin:0; padding-left:22%; }
        #conPC .sec_enquire .dbform .agreebox [class*="customcheck"] ~ .text {margin-left:1%; font-size:1.1vw;}
        #conPC .sec_enquire .dbform .agreebox .btn2 {font-size: 15px;  background-color: rgb(0,0,0,0.3);   color: #fff;   line-height:36px;    padding:0 30px;   border-radius: 4px;   cursor:pointer; margin-left:2%; vertical-align:middle;}
        #conPC .sec_enquire .dbform form > ul > li {margin-bottom:6.1%; padding:0;}

        #conPC .sec_enquire .dbform form > ul > li div > span {padding:0;}
        #conPC .sec_enquire .dbform .agreebox .show-policy {font-size:1.1vw;}
        #conPC .sec_enquire .dbform .submitbox {overflow:hidden; width:100%; height:auto; float:left;text-align:left; padding-left:22%; }
        #conPC .sec_enquire .dbform .submitbox button {width:61%; height:auto; vertical-align:bottom;}
        #conPC .sec_enquire .dbform .submitbox a img {width:58%; height:auto;}
        #conPC .sec_enquire .dbform select {background: url(/contents/img/pc/arow.png) no-repeat 95% 50%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color:#fff;}

        #conPC .privacy_con_box .inner {border-radius:10px;}
        #conPC .privacy_con_box .inner p {width:auto;}

        #conPC .qna {position:absolute; top:73%; left:50%; transform:translate(-50%, -50%);}
        #conPC .qna ul{width:1000px; list-style:none; border-top:1px solid #dbc4a8;}
        #conPC .qna ul li{border-top:1px solid #dbc4a8 ;margin-bottom:10px;}
        #conPC .qna ul li:first-child{border:0 none;}
        #conPC .qna ul li a{height:60px; line-height:60px; display:block; text-decoration:none; color:#000;}
        #conPC .qna ul li p{color:#f00;}

       
        @media only screen and (min-width : 1920px) {

           #conPC .pc_fixedtop {height:95px;}
            #conPC .pc_fixedtop .agreebox {top:10px; position:absolute; left:80.5%;}
            #conPC .pc_fixedtop .dbform_fix {top:26px;}
            #conPC .pc_fixedtop .agreebox .text {font-size:14px;}
            #conPC .pc_fixedtop .dbform_fix .db_list li input {font-size:16px;}
            #conPC .pc_fixedtop .dbform_fix .db_list li .input-control {padding:6px; height:48px;}
            #conPC .pc_fixedtop .dbform_fix .db_list select {background: url(/contents/img/pc/arow.png) no-repeat 95% 50%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color:#fff;}



            #conPC .zoomSlide .swiper-button-next {width:87px; height:87px;}
            #conPC .zoomSlide .swiper-button-prev {width:87px; height:87px;}

            #conPC .video {left:228px;}

            #conPC .review_img .layericon01 {top:0px; left:0; width:100%;}
            #conPC .review_img .layericon02 {top:0px; right:0; width:100%;}
            
            #conPC .sec_enquire .dbform form > ul > li {margin-bottom:6%;}
            #conPC .sec_enquire .dbform form > ul > li div > span {font-size:20px;}
            #conPC .sec_enquire .dbform .agreebox .show-policy {font-size:18px;}
            #conPC .sec_enquire .dbform .agreebox [class*="customcheck"] ~ .text {font-size:18px;}
            #conPC .sec_enquire .input-control {font-size:20px;}
        } 
       
        @media screen and (max-width: 1700px) {
        	 #conPC .pc_fixedtop .dbform_fix .db_list {width:78%; margin-left:23%;}
             #conPC .pc_fixedtop .landing_form .submitbox {position:absolute; width:23%; left:60.5%; }
             #conPC .pc_fixedtop .agreebox {top:0.5vw; left:78.5%; right:auto; white-space:nowrap;}
        }
        @media screen and (max-width: 1400px) {
        	 #conPC .pc_fixedtop .dbform_fix .db_list {width:78%; margin-left:20%; margin-top:-0.5%;}
             #conPC .pc_fixedtop .landing_form .submitbox {position:absolute; width:23%; left:56%; top:-12%;}
             #conPC .pc_fixedtop .agreebox {top:0.5vw; left:74%; right:auto; white-space:nowrap;}
        }
        @media screen and (min-width: 2000px) {
             #conPC .sec05_img .layericon01-1 {top:36.7%;}
             #conPC .sec05_img .layericon01-1 p {font-size:2.3vw; font-weight:bold; color:#ff4d1d;}
             #conPC .sec05_img .layericon02-1 {top:36.7%;}
             #conPC .sec05_img .layericon02-1 p {font-size:2.3vw; font-weight:bold; color:#ff4d1d;}
             #conPC .sec05_img .layericon04-1 p {font-size:2.3vw; font-weight:bold; color:#ff4d1d;}
        
        }

  

       @keyframes rotate_image{
    100% {
        transform: rotate(360deg);
    }
}
/*** [Pc] --/end/-- ***/





/*** [Mobile] --/start/-- ***/

#conMobile {opacity:0;visibility:hidden;position:fixed;top:0;left:100%;width:100%;transition:all .6s cubic-bezier(0.785, 0.135, 0.15, 0.86);-webkit-transition:all .6s cubic-bezier(0.785, 0.135, 0.15, 0.86);}
#conMobile img {width:100%;}
#conMobile .mo_lodingwrap {position:absolute;top:0;left:0;width:100%;height:100%;z-index:1000;background:rgba(0,0,0,.5);}

#conMobile .mo_fixedbar {position:fixed;left:0;z-index:10;width:100%;transition:all .6s cubic-bezier(0.785, 0.135, 0.15, 0.86);-webkit-transition:all .6s cubic-bezier(0.785, 0.135, 0.15, 0.86);overflow:hidden;background:url('../images/') center bottom / cover no-repeat;}
#conMobile .mo_fixedbar.top {top:0;}
#conMobile .mo_fixedbar.bottom {bottom:0;}
#conMobile .mo_fixedbar.hidden {}
#conMobile .mo_fixedbar .layerlink01 {display:block;width:0;height:100%;top:0;left:0%;}
#conMobile .mo_fixedbar .layerlink02 {display:block;width:0;height:100%;top:0;right:0%;}
#conMobile .fixed_sns {position:fixed;bottom:14vw;right:5%;z-index:9999; width:13%;}
#conMobile .fixed_sm {position:fixed;bottom:20%;right:3%;z-index:9999; width:16%;}
#conMobile .fixed_kakao {position:fixed;bottom:126px;right:4%;z-index:9999; width:70px;}
#conMobile .fixed_blog {position:fixed;bottom:56px;right:4%;z-index:9999; width:70px;}

#conMobile .success_story {position:relative;}
#conMobile .success_story .layericon01 {position:absolute; width:84%; top:35%; left:7.5%;}
#conMobile .success_story .layericon02 {position:absolute; width:84%; top:71.5%; left:7.5%;}
#conMobile .success_story .btn {position:absolute; top: 53%; left:50%; z-index:20; width:100%;}
#conMobile .success_story .swiper-button-next {left:31%;  width:84px; height:84px; background:url(/contents/images/pc/btn_main_next.png) center no-repeat;}
#conMobile .success_story .swiper-button-prev {left:-36%;  width:84px; height:84px; background:url(/contents/images/pc/btn_main_prev.png) center no-repeat;}
#conMobile .msuccess_thumb .swiper-wrapper{justify-content: center; padding:4% 2% 0; width:100%;}
#conMobile .msuccess_thumb2 .swiper-wrapper{justify-content: center; padding:4% 2% 0; width:100%;}
#conMobile .msuccess_thumb .swiper-slide.swiper-slide-visible.swiper-slide-thumb-active {color: #ffffff; background-image: linear-gradient(to right, #00b079, #028db9);}
#conMobile .msuccess_thumb2 .swiper-slide.swiper-slide-visible.swiper-slide-thumb-active {color: #ffffff; background-image: linear-gradient(to right, #00b079, #028db9);}
#conMobile .msuccess_thumb_btn {cursor: pointer; width: 77px; text-align:center; padding: 5px 4px 4px 4px; font-size: 12px; border: 1px solid #00CC66; border-radius:27px; font-family: "NotoSansKR", "sans-serif"; font-weight: 400;}

#conMobile .section_video .layericon-video {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
}

#conMobile .section_video .layericon-video .video_bg {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  overflow: visible;
  background: #000;
}

#conMobile .section_video .layericon-video .video_bg iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* Mobile섹션 */
#conMobile .section01 {}
#conMobile .section01 .layericon01 {position:absolute; top:0; left:0%;  width:100%;}
#conMobile .section01 .layericon02 {width:22.25%;top:12%; left:10%;}
#conMobile .section01 .layericon03 {width:55.5%; top:73%; left:13%;}
#conMobile .section01 .layericon04 {width:16.9%;top:0%; left:77%;}
#conMobile .section01 .layericon05 {width:44.35%;top:46%;left:6%;}


/* Mobile 연기 레이어 위치 및 효과 */
#conMobile .section01 [class^="layericon"] { position: absolute; } /* 모든 레이어 절대좌표 고정 */

#conMobile .section01 .layericon06 { width:65%; top:20%; left:35%; z-index: 3; opacity: 0; } /* 초기엔 숨김 */
#conMobile .section01 .layericon07 { width:57%; top:3%; left:10%; z-index: 3; opacity: 0; }
#conMobile .section01 .layericon08 { width:60%; top:30%; left:20%; z-index: 3; opacity: 0; }

#conMobile .section01 .steam {
    filter: url(#mo-steam-01) !important; /* 위 HTML에서 바꾼 ID와 일치 */
    mix-blend-mode: screen;
    pointer-events: none;
    display: block !important;
}

#conMobile .section02 {}
#conMobile .section02 {position:relative;}
#conMobile .section02 .layericon01 {position:absolute; top:25%; left:0%; width:100%;}        
#conMobile .section02 .layericon02 {position:absolute; top:45%; left:0%; width:100%;}        
#conMobile .section02 .layericon03 {position:absolute; top:62%; left:0%; width:100%;}        

#conMobile .section02-1 {}
#conMobile .section02-1 {position:relative;}
#conMobile .section02-1 .layericon01 {position:absolute; top:37%; left:0%; width:100%;}        


#conMobile .video1 {position:absolute; top:66%; left:4%; width:92%; max-width:1024px; background-color:#000; z-index:10;}
#conMobile .video1 .video-container {position:relative; padding-bottom:46.25%; padding-top:30px; height:0; overflow:hidden;}
#conMobile .video1 iframe {position:absolute; top:0; left:0; width:100%; height:100%;}
#conMobile .video_wrap {position:absolute; top:23%; left:5%; width:90%; border:0;}
#conMobile .video_wrap li {position:relative; float:left; width:49%; margin:0 0.5% 9.7%;}
#conMobile .video_wrap:after {content:''; display:block; clear:both;}
#conMobile .video_wrap .video.size_2 {position:relative; top:0; bottom:auto; left:0; width:100%; max-width:438px;}
#conMobile .video_wrap .video.size_2 .video-container {padding-top:0;}


#conMobile .section03 { position: relative; width: 100%; overflow: hidden; }
#conMobile .section03 .layericon01 { position:absolute; top:0; left:0%; width:100%; }
#conMobile .section03 .layericon02 { width:22.25%; top:11%; left:69%; z-index: 2; }
#conMobile .section03 .layericon03 { width:55.5%; top:73%; left:28%; z-index: 2; }
#conMobile .section03 .layericon05 { width:55.4%; top:51%; left:43%; z-index: 1; }

/* 연기 위치 최신화 반영 */
#conMobile .section03 .layericon06 { width:65%; top:0%; left:26%; z-index: 3; opacity: 1; }
#conMobile .section03 .layericon07 { width:57%; top:12%; left:0%; z-index: 3; opacity: 1; }
#conMobile .section03 .layericon08 { width:60%; top:30%; left:20%; z-index: 3; opacity:1; }

/* 3섹션 전용 필터 연결 */
#conMobile .section03 .steam {
    filter: url(#mo-steam-03) !important;
    mix-blend-mode: screen;
    pointer-events: none;
    display: block !important;
}

#conMobile .section04 {}
#conMobile .section04 .layericon01 {position:absolute; top:0; left:0%;  width:100%;}
#conMobile .section04 .layericon02 {width:22.25%;top:12%; left:10%;}
#conMobile .section04 .layericon03 {width:55.5%; top:73%; left:13%;}
#conMobile .section04 .layericon04 {width:16.9%;top:0%; left:77%;}
#conMobile .section04 .layericon05 {width:58.7%;top:50%;left:0%;}

/* 연기 위치 최신화 반영 */
#conMobile .section04 .layericon06 { width:65%; top:35%; left:35%; z-index: 3; opacity: 0; } /* 초기엔 숨김 */
#conMobile .section04 .layericon07 { width:57%; top:0%; left:10%; z-index: 3; opacity: 0; }
#conMobile .section04 .layericon08 { width:60%; top:39%; left:20%; z-index: 3; opacity: 0; }

/* 4섹션 전용 필터 연결 */
#conMobile .section04 .steam {
    filter: url(#mo-steam-04) !important;
    mix-blend-mode: screen;
    pointer-events: none;
    display: block !important;
}

#conMobile .section05 {}
#conMobile .section05 .layericon01 { position:absolute; top:0; left:0%; width:100%; }
#conMobile .section05 .layericon02 { width:22.25%; top:11%; left:69%; z-index: 2; }
#conMobile .section05 .layericon03 { width:55.5%; top:73%; left:28%; z-index: 2; }
#conMobile .section05 .layericon05 { width:49.65%; top:55%; right:0%; z-index: 1; }

/* 연기 위치 최신화 반영 */
#conMobile .section05 .layericon06 { width:65%; top:0%; left:26%; z-index: 3; opacity: 1; }
#conMobile .section05 .layericon07 { width:64%; top:17%; left:-10%; z-index: 3; opacity: 1; }
#conMobile .section05 .layericon08 { width:60%; top:30%; left:20%; z-index: 3; opacity:1; }

/* 5섹션 전용 필터 연결 */
#conMobile .section05 .steam {
    filter: url(#mo-steam-05) !important;
    mix-blend-mode: screen;
    pointer-events: none;
    display: block !important;
}

#conMobile .section06 {}
#conMobile .section06 .layerlogo {width:13%;top:4%; right:10%;}
#conMobile .section06 .layerlogo img {animation: rotate_image 12s linear infinite;transform-origin: 50% 50%;}
#conMobile .section06 .layericon01 {width:100%;top:11%;}
#conMobile .section06 .layericon02 {width:100%;top:22%;}
#conMobile .section06 .layericon03 {width:100%;top:36%;}
#conMobile .section06 .layericon04 {width:100%;top:68.5%;}
#conMobile .section06 .layericon05 {width:100%;top:83%;}
#conMobile .section06 .layericon06 {width:100%;top:90%;}



#conMobile .section07 {}
#conMobile .section07 .layericon01 {width:100%;top:9%;}
#conMobile .section07 .layericon02 {width:100%;top:35%;}
#conMobile .section07 .layericon03 {width:100%;top:34%;}
#conMobile .section07 .layericon04 {width:100%;top:53%;}

#conMobile .section08 {}
#conMobile .section08 .layericon01 {width:100%;top:10%;}
#conMobile .section08 .layericon02 {width:100%;top:17%;}
#conMobile .section08 .layericon03 {width:100%;top:40%;}
#conMobile .section08 .layericon04 {width:100%;bottom:0%;}
#conMobile .section08 .layericon05 {width:100%;top:48%;}

#conMobile .section09 {}
#conMobile .section09 .layericon01 {width:100%;top:33%;}

#conMobile .section10 {}
#conMobile .section10 .layericon01 {width:100%;top:28%;}

#conMobile .section11 {}
#conMobile .section11 .layericon01 {position:absolute; top:30%; left:50%; width:88%; transform: translate(-50%); }
#conMobile .section11 .layericon01 img {animation: rotate_image 16s linear infinite; transform-origin: 50% 50%;}        
#conMobile .section11 .layericon02 {position:absolute; top:36%; left:50%; width:80%; transform: translate(-50%);}
#conMobile .section11 .layericon02 img {animation: rotate_image 20s linear infinite;transform-origin: 50% 50%;}        
#conMobile .section11 .layericon03 {position:absolute; top:28%; left:5%; width:26%;}
#conMobile .section11 .layericon04 {position:absolute; top:28%; left:69%; width:26%;}
#conMobile .section11 .layericon05 {position:absolute; top:79%; left:5%; width:31.5%;}
#conMobile .section11 .layericon06 {position:absolute; top:79%; left:66%; width:28.6%;}

#conMobile .section12{}
#conMobile .section12 .layericon01 {width:100%;top:32%; }
#conMobile .section12 .layericon02 {width:100%;bottom:0%; }
#conMobile .section12 .layericon03 {width:100%;bottom:3%; }

#conMobile .section13 {}
#conMobile .section13 .layericon01 {width:100%;top:21%;}
#conMobile .section13 .layericon02 {width:100%;top:44.5%;}
#conMobile .section13 .layericon03 {width:100%;top:68%;}

#conMobile .section14 {}
#conMobile .section14 .layericon01 {width:100%; top:20%;}
#conMobile .section14 .layericon02 {width:100%; top:36.6%;}
#conMobile .section14 .layericon03 {width:100%; top:53.2%;}
#conMobile .section14 .layericon04 {width:100%; top:69.8%;}

#conMobile .section15 {}
#conMobile .section15 .layericon01 {width:100%; top:0%;}
#conMobile .section15 .layericon01 .btn_next {position: absolute; top: 70%; right: 15%; cursor: pointer;  transform: translateY(-50%);    z-index: 99999;}
#conMobile .section15 .layericon01 .btn_prev {position: absolute; top: 70%; left: 15%; cursor: pointer;  transform: translateY(-50%);    z-index: 99999;}
#conMobile .section15 .layericon02 {width:100%; top:5%;}


#conMobile .section16 {}
#conMobile .section16 .layericon01 {width:100%; top:22%;}
#conMobile .section16 .layericon02 {width:100%; top:22%;}
#conMobile .section16 .layericon03 {width:100%; top:37%;}
#conMobile .section16 .layericon04 {width:100%; top:37%;}


#conMobile .section17 {}
#conMobile .section17 .layericon01 {width:100%; top:8%;}
#conMobile .section17 .layericon02 {width:28.7%; top:78%; left:5%;}
#conMobile .section17 .layericon03 {width:28.7%; top:78%; left:35.5%;}
#conMobile .section17 .layericon04 {width:28.7%; top:78%; right:5%;}

#conMobile .section18 {}
#conMobile .section18 .layericon01 {width:100%; top:25%;}
#conMobile .section18 .layericon02 {width:100%; top:33%; }
#conMobile .section18 .layericon03 {width:100%; top:46%; }
#conMobile .section18 .layericon04 {width:24.6%; top:85%; left:70%;}

#conMobile .section19 {}
#conMobile .section19 .layericon01 {width:100%; top:2%;}
#conMobile .section19 .layericon01  img {  filter: brightness(60%);  animation: flicker 0.5s linear alternate infinite; } 
#conMobile .section19 .layericon02 {width:100%; top:23%;}
#conMobile .section19 .layericon03 {width:100%; top:45%;}
#conMobile .section19 .layericon04 {width:100%; top:53%;}
#conMobile .section19 .layericon05 {width:100%; top:61%;}

#conMobile .section20 
#conMobile .section20 .layericon01 {width:10%; top:2%; left:15%;}
#conMobile .section20 .layericon02 {width:9%; top:10%; left:28%;}
#conMobile .section20 .layericon03 {width:9%; top:10%; left:40%;}
#conMobile .section20 .layericon04 {width:9%; top:10%; left:51%;}
#conMobile .section20 .layericon05 {width:9%; top:10%; left:63%;}

#conMobile .section21 {position:fixed;bottom:0; z-index:99;width:100%;height:auto;}
#conMobile .section21 > a {width:60%;height:100%;display:inline-block;text-indent:-9999px;overflow:hidden;position:absolute;top:0;}
#conMobile .section21 > a.layericon01 {left:0;}
#conMobile .section21 > a.layericon02 {left:60%;}




#conMobile .section_complete {}
#conMobile .section_complete .layericon01 {width:100%;top:78%;left:0%;}


#conMobile .footer .content{max-width: 1200px;background-color:#141414;text-align:center;padding:40px 20px;margin:0 auto;}
#conMobile .footer .content p{line-height: 1.5; color: #a3a3a3;font-size:0.8rem;}
#conMobile .footer .content p a{color:#5893ff;}
#conMobile .footer .content p:last-child{padding-top: 20px;}



/* mobile 폼 영역 */
#conMobile .mo_dbform {position:absolute;top:38%;left:50%;transform:translateX(-50%);width:90%;}
#conMobile .mo_dbform .db_list {}
#conMobile .mo_dbform .db_list li {width:100%;_margin-bottom:5px;padding:2.3% 0;}
#conMobile .mo_dbform .db_list li:last-child {background:none;padding:2% 0;border:0;}
#conMobile .mo_dbform .db_list li div > span {display:inline-block;vertical-align:middle;_font-size:1.4em;color:#000;}
#conMobile .mo_dbform .db_list li div > span em {_color:#e41b23;}
#conMobile .mo_dbform .db_list li div > span:first-child {width:1%;text-indent:-9999px;}
#conMobile .mo_dbform .db_list li div > span:last-child {width:95%;text-align:left;}
#conMobile .mo_dbform .db_list li div > span:last-child > span:last-child {width: 100%;margin-top: 6px;display: inline-block;border-radius: 0; -webkit-border-radius:0;} 
#conMobile .mo_dbform .db_list li .input-control {width:95%;background:#fff;padding:15px 10px;font-size:1em;border-radius:0; -webkit-border-radius:0;}
#conMobile .mo_dbform .db_list li div select.input-control {
        background-image: url("/contents/img/pc/arow.png") !important;
        background-repeat: no-repeat !important;
        background-position: calc(100% - 15px) 50% !important; /* 오른쪽에서 15px 띄움 */
        background-size: 14px auto !important;
        /* 모바일 기본 화살표 제거 강제화 */
        -webkit-appearance: none !important;
        -moz-appearance: none !important;
        appearance: none !important;
        /* 배경색이 이미지를 덮지 않도록 투명 처리 혹은 유지 */
        background-color: #fff !important;
        /* 화살표랑 글자 겹침 방지 */
        padding-right: 35px !important;
    }

#conMobile .mo_dbform .db_list li div textarea {height:100px;}
#conMobile .mo_dbform label {cursor:pointer;}
#conMobile .mo_dbform .agreebox {text-align:center; margin-top:0%; }
#conMobile .mo_dbform .agreebox .text {font-size:13px;}
#conMobile .mo_dbform .agreebox .show-policy {color:#000;font-weight:bold;margin-left:3px;font-size:13px;vertical-align:middle}
#conMobile .mo_dbform .submitbox {width:84.6875%;height:0;padding-bottom:14%;text-align:center;margin:0% auto 0;}
#conMobile .mo_dbform .submitbox .mo_dbform_btn {width:100%;background:transparent;display:block;}
#conMobile .mo_dbform input[type="checkbox"] {display:none;}
#conMobile .mo_dbform div label {cursor:pointer;}

#conMobile .privacy_con_box_m {position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:999;display:none;}
#conMobile .privacy_con_box_m .inner {position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:70%;background:#fff;padding:40px;}
#conMobile .privacy_con_box_m .inner h3 {font-weight:bold;padding-bottom:20px}
#conMobile .privacy_con_box_m .inner p {width:90%;height:200px;overflow-y:scroll;border:1px solid #eee;padding:20px 5%;line-height:1.5em;}
#conMobile .privacy_con_box_m .inner a {position:absolute;top:2%;right:2%;font-size:35px;display:inline-block;}
#conMobile .privacy_con_box_m .inner a:before {content:' \00D7';color:#000;}
#conMobile .mo_dbform input, #conMobile .mo_dbform textarea {
	-webkit-appearance: none;
	-webkit-border-radius: 0;
}



@media screen and (max-width: 768px) {
	#conMobile .mo_dbform .db_list li .input-control {padding:5px 10px;}
}

@media screen and (max-width: 414px) {
	#conMobile .mo_dbform .db_list li {padding:1.3% 0;}
	#conMobile .mo_dbform .db_list li .input-control {padding:3px 10px;font-size:15px;}	

	#conMobile .section01 .mobileBanner .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets {bottom:20px;}
	#conMobile .section01 .mobileBanner .swiper-pagination-bullet {width:10px;height:10px;margin:0 5px;}
	#conMobile .mo_fixedtop_height {height:8vh;}
}


@media screen and (max-width: 320px) {
	
	#conMobile .mo_dbform .db_list li {padding:0.9% 0;}
	#conMobile .mo_dbform .db_list li .input-control {font-size:12px;}
	

}

/*** [Mobile] --/end/-- ***/


@media screen and (max-width: 1100px) {
	#conPC {opacity:0;visibility:hidden;position:fixed;top:0;left:-100%;width:100%;}
	#conMobile {opacity:1;visibility:visible;position:relative;top:0;left:0;width:100%;}
}

		/* s: mobile */
        #conMobile img {width:100%; image-rendering: -webkit-optimize-contrast;}
        #conMobile .mo_fixedtop {position:fixed; top:auto; bottom:0; overflow:visible; width: 100%; z-index: 100;}
        #conMobile .mo_fixedtop .layerlink01 {position:absolute; top:15%; left:3%; width:10%; height:60%;}
        #conMobile .mo_fixedtop .layerlink01 a {width:100%; height:100%; display:block;}
        #conMobile .mo_fixedtop .layerlink02 {position:absolute; top:15%; right:3%; width:23%; height:60%;}
        #conMobile .mo_fixedtop .layerlink02 a {width:100%; height:100%; display:block;}
        #conMobile .mo_fixedtop .btn_home_mo {position:absolute; top:-18vw; right:4.84vw; width:13.87vw; height:13.87vw;}
        
        #conMobile .visual .layericon01 {width:100%; top:50%; left:50%; transform:translate(-50%, -50%);}
        #conMobile .visual .mobileBanner .swiper-pagination-fraction, 
        
        

        #conMobile .mo_dbform {top:55vw;}
        #conMobile .mo_dbform .submitbox {width:80vw; }
        #conMobile .mo_dbform .db_list li {padding:2vw 0; padding-left:3%;margin-bottom:4%;}
        #conMobile .mo_dbform .db_list li .input-control {padding:2.7vw;  background-color:#fff; font-size: 4vw;  color:#000; border-radius:8px;}
        #conMobile .mo_dbform .db_list li:last-child {padding:3% 0 0;}
        #conMobile .mo_dbform [class*="customcheck"] ~ .icon {width:4.3vw; height:4.3vw; max-width:29px; max-height:29px; border:1px solid #063c42; background-color:#e7ebe4; border-radius:4px;}
        #conMobile .mo_dbform .agreebox .text {font-size:3.5vw; color:#f1f1f1;}
        #conMobile .mo_dbform .agreebox .show-policy {font-size:3.5vw; color:#f1f1f1;}


        @media screen and (max-width: 1300px) {
            #conPC .store2.store2_reposition {
                top: 25vw;
            }
        }

        @media screen and (max-width: 1100px) {
            #conMobile .zoomSlideM .zoom_btn {bottom:10vw;}
        }

        @media screen and (max-width: 700px) {
            #conMobile .zoomSlideM .zoom_btn {bottom:7vw;}
        }

        @media screen and (max-width: 420px) {
            #conMobile .store2M {
                top: 49%;
            }
        }

        @media screen and (max-width: 414px) {
            #conMobile .mo_fixedtop_height {height:auto;}
            #conMobile .visual .mobileBanner .swiper-pagination-fraction, #conMobile .swiper-pagination-custom, #conMobile .swiper-container-horizontal > .swiper-pagination-bullets {bottom: 50px;}
        }





@keyframes flicker { 
  0% { filter: brightness(50%); }
  100% { filter: brightness(100%); }
}
