@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */

#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skipToContent a:focus, 
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px}

/* header */
#header {position:fixed;left:0;top:0;right:0;z-index:90;transition:.3s;}
#header:after{content:'';width:100%;height:1px;background-color: #eee;position: absolute;left:0;top:100px;transition:.3s;opacity:0;z-index:-1;}
#header .contain{max-width:1880px;height:100px;}
#header .sitelogo {position:absolute; top:38px; left:30px; z-index:2}
#header .sitelogo a {display:block;}
#header .sitelogo a img.on{display:none;}

#gnb{padding-left:260px;}
#gnb>ul {display:flex; margin:0 -30px;} 
#gnb>ul>li {padding:0 30px;}
#gnb>ul>li>a {position:relative;display:inline-block;line-height:100px;position:relative;color:#fff; font-size:19px;font-weight:600;transition:.3s;}
#gnb>ul>li>a:after{content:'';width:0;height:2px;background-color:var(--pri);position: absolute;left:50%;bottom:35px;opacity:0;transition:.3s;}
#gnb>ul>li:hover>a{color:var(--pri) !important;}
#gnb>ul>li:hover>a:after{width:100%;left:0;opacity:1;}
#gnb .submenu {display:none; position:absolute; left:0;max-width:1880px;width:100%;padding:0 30px;z-index:1;}
#gnb .submenu .inner{display:flex;}
#gnb .submenu .tit-wrap{width:260px;padding:35px 20px 75px 0;}
#gnb .submenu .tit-wrap .tit{margin-bottom:15px;font-size:var(--fz40);font-weight:700;color:var(--dark);line-height:1.2em;}
#gnb .submenu .tit-wrap .eng{font-size:var(--fz32);color: #eee;font-family:var(--outfit);line-height:1.2em;font-weight:700;}
#gnb .submenu .list{display:flex;min-width:0;width:1%;flex:1 1 auto;border-left:1px solid #eee;max-width:275px;}
#gnb .submenu .list .col{padding:35px 50px 75px;min-width:275px;border-right:1px solid #eee;}
#gnb .submenu .list .col>ul>li{margin-bottom:18px;line-height:1.33em;}
#gnb .submenu .list .col>ul>li:last-child{margin-bottom:0;}
#gnb .submenu .list .col>ul>li>a{display:inline-block;font-size:17px;font-weight:500;transition:.3s;}
#gnb .submenu .list .col>ul>li>a:hover{color:var(--pri);}
.submenu-bg {display:none; position:absolute; width:100%; left:0; background:#fff;z-index:-1;}

#gnb .submenu.st2 .list{position:relative;border-left:0;}
#gnb .submenu.st2 .list .depth{min-width:340px;padding:35px 50px 180px;border-right:1px solid #eee;}
#gnb .submenu.st2 .list .depth .depth-tit{display:block;padding-bottom:15px;margin-bottom:25px;border-bottom:1px solid var(--dark);transition:.3s;color:var(--dark);font-weight:600;line-height:1.33em;text-align:left;}
#gnb .submenu.st2 .list .depth:hover>.depth-tit{color:var(--pri);border-color:var(--pri);}
#gnb .submenu.st2 .list .depth .pr-menu>li{padding-bottom:20px;line-height:1.33em;}
#gnb .submenu.st2 .list .depth .pr-menu>li:last-child{padding-bottom:0;}
#gnb .submenu.st2 .list .depth .pr-menu>li>a{display:block;position:relative;font-size:17px;font-weight:500;transition:.3s;}
#gnb .submenu.st2 .list .depth .pr-menu>li>a:after{content:'';position: absolute;right:0;top:.2em;width:10px;height:10px;border-radius:100%;background-color:var(--pri);opacity:0;}
#gnb .submenu.st2 .list .depth .depth2>.pr-menu>li>a:after,
#gnb .submenu.st2 .list .depth .depth3>.pr-menu>li>a:after{content:'→';font-size:19px;top:.05em;font-weight:700;color: var(--pri);width:auto;height:auto;background-color:transparent;}
#gnb .submenu.st2 .list .depth .pr-menu>li:hover>a{color:var(--pri);}
#gnb .submenu.st2 .list .depth .pr-menu>li:hover>a:after{opacity:1;}

#gnb .submenu.st2 .list .depth .pr-menu>li.brand{margin-top:10px;}
#gnb .submenu.st2 .list .depth .pr-menu>li.brand .br-tit{margin-bottom:15px;font-size:15px;font-weight:700;line-height:1.3em;color: #a8a8a8;}
#gnb .submenu.st2 .list .depth .pr-menu>li.brand>ul{display:flex;flex-wrap:wrap;gap:6px;}
#gnb .submenu.st2 .list .depth .pr-menu>li.brand>ul>li>a{display:flex;justify-content:center;align-items:center;width:76px;height:34px;background-color: #f4f4f4;border-radius:var(--bd8);text-align:center;font-size:13px;font-weight:500;line-height:1.2em;transition:.3s;}
#gnb .submenu.st2 .list .depth .pr-menu>li.brand>ul>li>a:hover{background-color:var(--pri);color: #fff;}

#gnb .submenu.st2 .list .depth1{position:relative;}
#gnb .submenu.st2 .list .depth2.active,
#gnb .submenu.st2 .list .depth3.active,
#gnb .submenu.st2 .list .depth4.active{display:block;}
#gnb .submenu.st2 .list .depth2,
#gnb .submenu.st2 .list .depth3,
#gnb .submenu.st2 .list .depth4{position: absolute;left:340px;top:0;height:100%;display:none;}
/* #gnb .submenu.st2 .list .depth2{background-color: #fafafa;}
#gnb .submenu.st2 .list .depth3{background-color: #f2f2f2;} */

#gnb .submenu.st2 .list .pr-img{position: absolute;right:0;top:40px;border-radius:var(--bd16);overflow:hidden;}

#header.header-up{transform:translateY(-100%);}

#header .right{display:flex;align-items:center;position: absolute;right:30px;top:50%;transform:translateY(-50%);}
#header .right .mem-menu{margin-right:34px;}
#header .right .mem-menu ul{display:flex;align-items:center;}
#header .right .mem-menu ul li{margin-right:24px;}
#header .right .mem-menu ul li:last-child{margin-right:0;}
#header .right .mem-menu ul li .btn{display:inline-flex;justify-content:center;align-items:center;position:relative;color: #fff;font-weight:500;line-height:1.2em;transition:.3s;}
#header .right .mem-menu ul li .btn.st2{padding:0 20px;height:40px;background-color:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.24);border-radius:20px;}

.lang {position:relative;}
.lang .tit {display:flex;align-items:center;width:24px;height:24px;position:relative;}
.lang .tit img.on{display:none;}
.lang .lang-open {display:none; position:absolute; top:35px;left:50%;transform:translateX(-50%);width:46px;padding:15px 0;border-radius:23px;background-color: #fff;box-shadow:4px 4px 12px rgba(0,0,0,.1);}
.lang .lang-open ul li{margin-bottom:5px;line-height:1.3em;text-align:center;}
.lang .lang-open ul li:last-child{margin-bottom:0;}
.lang .lang-open ul li a{display:inline-block;font-size:13px;font-weight:500;color: #ccc;transition:.3s;}
.lang .lang-open ul li.active a{color:var(--dark);}

#header:hover{background-color: #fff;}
#header:hover:after{opacity:1;}
#header:hover .sitelogo a img.off{display:none;}
#header:hover .sitelogo a img.on{display:block;}
#header:hover #gnb>ul>li>a{color:#2c2c2c;}
#header:hover .right .mem-menu ul li .btn{color:var(--dark);}
#header:hover .right .mem-menu ul li .btn.st2{background-color:var(--pri);border-color:var(--pri);color: #fff;}
#header:hover .lang .tit img.off{display:none;}
#header:hover .lang .tit img.on{display:block;}

.header-fixed #header{background-color: #fff;}
/* .header-fixed #header:after{opacity:1;} */
.header-fixed #header .sitelogo a img.off{display:none;}
.header-fixed #header .sitelogo a img.on{display:block;}
.header-fixed #header #gnb>ul>li>a{color:#2c2c2c;}
.header-fixed #header .right .mem-menu ul li .btn{color:var(--dark);}
.header-fixed #header .right .mem-menu ul li .btn.st2{background-color:var(--pri);border-color:var(--pri);color: #fff;}
.header-fixed #header .lang .tit img.off{display:none;}
.header-fixed #header .lang .tit img.on{display:block;}

.header-fixed #header .btn-m-menu span,
.header-fixed #header .btn-m-menu span:before,
.header-fixed #header .btn-m-menu span:after{background-color:var(--dark);}

#header:hover .btn-m-menu span,
#header:hover .btn-m-menu span:before,
#header:hover .btn-m-menu span:after{background-color:var(--dark);}

.contain {position:relative; max-width:1460px; padding-left:30px; padding-right:30px; margin:0 auto;}
#contArea {max-width:1460px; padding-left:30px; padding-right:30px; margin:0 auto;}
#contArea.wide {max-width:100%; padding-left:0; padding-right:0;}

/* main */ 
.main-visual {position:relative; overflow:hidden;}
.main-visual .item {position:relative; height:100vh;}
.main-visual .bg {position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; -ms-transform:scale(1.1); -webkit-transform:scale(1.1); transform:scale(1.1); -webkit-transition:all 0.9s; -ms-transition:all 0.9s; transition:all 0.9s; -webkit-transition-timing-function:ease; transition-timing-function:ease;}
.main-visual .active .bg{-ms-transform:scale(1); -webkit-transform:scale(1); transform:scale(1); -webkit-transition:all 10s; -ms-transition:all 10s; transition:all 10s; -webkit-transition-timing-function:ease; transition-timing-function:ease;}

.main-visual .con{position: absolute;left:0;right:0;bottom:8%;pointer-events:none;}
.main-visual .con .contain{max-width:1880px;width:100%;}
.main-visual .con .tt-wrap{display:flex;align-items:flex-end;justify-content:space-between;position:relative;padding-bottom:40px;margin-bottom:40px;}
.main-visual .con .tt-wrap .txt{min-width:0;width:1%;flex:1 1 auto;margin-right:40px;color: #fff;letter-spacing:-.02em;}
.main-visual .con .tt-wrap .txt .top-tt{margin-bottom:20px;font-size:var(--fz20);font-weight:600;line-height:1.7em;}
.main-visual .con .tt-wrap .txt .tit{font-size:var(--fz100);font-weight:500;line-height:1.2em;}
.main-visual .con .tt-wrap:after{content:'';width:200vw;height:1px;background-color:#fff;opacity:.24;position: absolute;left:50%;bottom:0;transform:translateX(-50%);}
.main-visual .con .controls{display:flex;}
.main-visual .con .controls .box{display:inline-flex;justify-content:center;align-items:center;border:1px solid rgba(255,255,255,.24);background-color:rgba(0,0,0,.2);border-radius:var(--bd8);margin-right:5px;height:42px;padding:0 20px;}
.main-visual .con .controls .box .paging li {font-size:14px; font-weight:500; color:#fff; line-height:1.2em;display:none;}
.main-visual .con .controls .box .paging li.slick-active {display:block;}
.main-visual .con .controls .box .paging li button{background-color:transparent;border:none;color: #fff;}
.main-visual .con .controls .box.slide-btn {width:54px;background-position:50% 50%;background-size:7px;background-repeat:no-repeat;border:0; overflow:hidden;font-size:0;margin-right:0;pointer-events:auto;}
.main-visual .con .controls .box.slide-stop {background-image:url("/images/main/vis-pause.png");}
.main-visual .con .controls .box.slide-play {display:none; background-image:url("/images/main/vis-play.png");}
.main-visual .con .controls .box.slide-prev {background-image:url("/images/main/vis-prev.png");margin-right:5px;}
.main-visual .con .controls .box.slide-next {background-image:url("/images/main/vis-next.png");margin-right:5px;}
.main-visual .scroll {animation:move_up_down 2s linear infinite;} 
@keyframes move_up_down { 
  0%,100%{ 
    transform:translateY(0); 
  } 
  50% { 
    transform:translateY(10px); 
  } 
}

.move-up{opacity: 0;transform: translateY(100px);}
.move-down{opacity: 0;transform: translateY(-100px);}
.move-left{opacity: 0;transform: translateX(100px);}
.move-right{opacity: 0;transform: translateX(-100px);}

.ani{clip-path: inset(50%);opacity:0;}
.in-view {
	animation-name: imgMotion;
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-timing-function: ease-in-out;
	animation-delay: 0.3s;
	opacity: 0;
}
@keyframes imgMotion{
	0% { clip-path: inset(50%);opacity:0; }
	100% {clip-path: inset(0);opacity:1;}
}

.main-ad{position: absolute;left:0;bottom:30%;right:0;z-index:1;pointer-events:none;}
.main-ad .contain{display:flex;justify-content:flex-end;max-width:1880px;width:100%;}
.main-ad .box{display:flex;align-items:center;padding:30px 40px;pointer-events:auto;background-color: #fff;border-radius:var(--bd16);animation:move_up_down 2s linear infinite;}
.main-ad .box .tt-wrap{min-width:0;width:1%;flex:1 1 auto;margin-right:20px;}
.main-ad .box .tt-wrap .tt{margin-bottom:10px;line-height:1.4em;font-weight:600;color:var(--pri);}
.main-ad .box .tt-wrap .tit{font-size:var(--fz28);color:var(--dark);line-height:1.4em;font-weight:600;}
.main-ad .box .img{width:134px;}
.main-ad .box .img .pic{position:relative; padding-bottom:71.65%; overflow:hidden;}
.main-ad .box .img .pic img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}

.section-wrap{position:relative;/* background:url('/images/main/main-bg.jpg')no-repeat 50% 50%/cover; */overflow:hidden;z-index:1;}
.section-deco{position: fixed; top: 0;left: 50%;margin-left:-572px;z-index:-1;pointer-events: none;will-change: transform;}
.section-deco img{width:100%;}
.section{margin-bottom:var(--size200);overflow:hidden;}
.section:last-child{margin-bottom:0;}
.section .contain{max-width:1660px;}
.section.sec1{padding-top:var(--size160);}
.sec1 .top-wrap{display:flex;justify-content:space-between;padding-bottom:40px;margin-bottom:var(--size100);border-bottom:1px solid var(--dark);}
.sec1 .top-wrap .tt{font-size:var(--fz24);font-weight:600;color:var(--dark);line-height:1.42em;}
.doc-more{display:inline-flex;align-items:center;padding:0 30px;height:58px;border-radius:29px;border:1px solid #dfdfdf;background-color: #fff;}
.doc-more span{position:relative;padding-right:30px;font-size:var(--fz18);font-weight:500;color:var(--dark);line-height:1.2em;transition:.3s;}
.doc-more span:after{content:'';position: absolute;right:0;top:.3em;width:10px;height:10px;background-color:var(--pri);border-radius:100%;}
.sec-tit{margin-bottom:var(--size80);}
.sec-tit .tit{font-size:var(--fz56);color:var(--dark);line-height:1.29em;font-weight:600;}
.sec1 .con{display:flex;}
.sec1 .con .left{display:flex;flex-direction:column;justify-content:space-between;padding-right:40px;width:560px;}
.sec1 .con .right{min-width:0;width:1%;flex:1 1 auto;}
.sec1 .con .right .flex{display:flex;margin:0 -40px;}
.sec1 .con .right .flex .col{width:50%;padding:0 40px;}
.sec1 .con .right .flex .col.st2{display:flex;flex-direction:column;justify-content:space-between;}
.sec1 .con .right .flex .col.st2 .tt{font-size:var(--fz28);color:var(--dark);font-weight:500;line-height:1.57em;}

.main-product{display:flex;align-items:center;}
.main-product .pr-cate-sld{width:260px;margin-right:90px;}
.main-product .pr-cate-sld .arr{display:block;width:20px;height:12px;margin:0 auto;margin-left:55px;background-color:transparent;background-repeat:no-repeat;background-size:contain;background-position:50% 50%;font-size:0;border:0;transition:.3s;}
.main-product .pr-cate-sld .arr.prev{margin-bottom:30px;background-image: url('/images/main/sec2-prev.png');}
.main-product .pr-cate-sld .arr.next{margin-top:30px;background-image: url('/images/main/sec2-next.png');}
.main-product .pr-cate-sld .arr.prev:hover{background-image: url('/images/main/sec2-prev-on.png');}
.main-product .pr-cate-sld .arr.next:hover{background-image: url('/images/main/sec2-next-on.png');}
.main-product .pr-cate-sld .slick-list{margin:-6px 0;}
.main-product .pr-cate-sld .item{padding:6px 0;}
.main-product .pr-cate-sld .item .btn{display:flex;align-items:center;height:54px;padding:0 20px;line-height:1.2em;transition:.3s;border-radius:4px;}
.main-product .pr-cate-sld .item .btn span{display: inline-block;position:relative;padding-left:35px;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;width:100%;font-size:var(--fz18);line-height:1.2em;font-weight:600;color: #999;transition:.3s;}
.main-product .pr-cate-sld .item .btn span:before{content:'';width:10px;height:10px;position: absolute;left:0;top:.2em;background-color:var(--pri);border-radius:100%;transition:.3s;opacity:0;}
.main-product .pr-cate-sld .item.slick-current .btn{background-color: #f4f4f4;}
.main-product .pr-cate-sld .item.slick-current .btn span{color:var(--dark);}
.main-product .pr-cate-sld .item.slick-current .btn span:before{opacity:1;}
.main-product .pr-item-sld{position:relative;min-width:0;width:1%;flex:1 1 auto;margin-right:-10.5%}
.main-product .pr-item-sld .slick-list{margin:0 -10px;}
.main-product .pr-item-sld .item{padding:0 10px;}
.main-product .pr-item-sld .item .box{display:block;position:relative;padding:35px 30px;background-color:#f8f8f8;border-radius:var(--bd24);line-height:1.3em;text-align:center;}
.main-product .pr-item-sld .item .box .tit{/* margin-bottom:30px; */display: inline-block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;width:100%;font-size:var(--fz32);line-height:1.3em;font-weight:600;color:var(--dark);}
.main-product .pr-item-sld .item .box .img{position:relative;padding:10px;}
.main-product .pr-item-sld .item .box .img:after{content:'';position: absolute;left:0;top:0;width:100%;height:100%;border:50px solid #f8f8f8;border-radius:100%;transition:.3s;}
.main-product .pr-item-sld .item .box .img .pic {position:relative; padding-bottom:100%;  overflow:hidden;border-radius:100%;}
.main-product .pr-item-sld .item .box .img .pic  img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}
.main-product .pr-item-sld .item .box .tt{/* margin-top:30px; */display: inline-block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;width:100%;line-height:1.3em;transition:.3s;}
.main-product .pr-item-sld .item .box .arr{display:flex;justify-content:center;align-items:center;width:60px;height:60px;background-color: #121212;border-radius:100%;position: absolute;right:10px;bottom:10px;opacity:0;transition:.3s;z-index:1;}

.pr-item-sld .slick-track {
  margin-left: 0 !important;   /* 왼쪽 여백 제거 */
  transform: none !important;  /* 중앙 정렬 끄기 */
}

.main-product .pr-item-sld .item .box:hover .img:after{border-width:0;}
.main-product .pr-item-sld .item .box:hover .tt{opacity:0;}
.main-product .pr-item-sld .item .box:hover .arr{opacity:1;}
.main-product .progress {margin-top:var(--size40);display: block;height:6px;overflow: hidden;background-color:#f4f4f4;background-image: linear-gradient(to right, var(--pri), var(--pri));background-repeat: no-repeat;background-size: 0 100%;transition: background-size .4s ease-in-out;z-index:1;position: relative;border-radius:6px;overflow:hidden;width:100%;}
.main-product .progress .sr-only {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: #f4f4f4;border: 0;border-radius:6px;}

.main-product #loadProduct{position:relative;min-width:0;width:1%;flex:1 1 auto;margin-right:-10.5%}
.main-product #loadProduct .pr-item-sld{position:relative;width:100%;margin-right:0%}

.main-product .controls{display:flex;align-items:center;gap:20px;margin-top:var(--size40);}
.main-product .controls .progress{min-width:0;width:1%;flex:1 1 auto;margin:0;}
.main-product .controls .arrs{display:flex;gap:10px;}
.main-product .controls .arrs .slick-arrow{width:50px;height:50px;display: block;border-radius:50%;background-color:transparent;background-repeat:no-repeat;background-size:10px;background-position:50% 50%;border:1px solid #ddd;font-size:0;transition:.3s;}
.main-product .controls .arrs .slick-prev{background-image: url('/images/main/sec2-prev2.png');}
.main-product .controls .arrs .slick-next{background-image: url('/images/main/sec2-next2.png');}
.main-product .controls .arrs .slick-arrow:hover{background-color: var(--pri);border-color:var(--pri);}
.main-product .controls .arrs .slick-prev:hover{background-image: url('/images/main/sec2-prev2-on.png');}
.main-product .controls .arrs .slick-next:hover{background-image: url('/images/main/sec2-next2-on.png');}

.acc-con ul{display:flex;gap:15px;}
.acc-con ul li{min-width:0;width:1%;flex:1 1 auto;transition:.5s;}
.acc-con ul li.active{width:32.8125%;}
.acc-con ul li .box{display:block;position:relative;background:url('/images/main/sec3-bg1.jpg')no-repeat 50% 50%/cover;min-height:548px;height:100%;transition:.3s;overflow:hidden;}
.acc-con ul li .box .off-txt{position: absolute;left:50%;top:50%;display:flex;align-items:center;justify-content:space-between;width:548px;padding:0 50px;transform:translate(-50%,-50%) rotate(90deg);transition:0;}
.acc-con ul li .box .off-txt .tit{font-size:var(--fz28);font-weight:600;line-height:1.2em;color:var(--dark);}
.acc-con ul li .box .off-txt .eng{font-size:var(--fz20);color:rgba(255,255,255,.7);font-weight:700;line-height:1.3em;}
.acc-con ul li .box .on-txt{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;width:100%;height:100%;padding:45px 50px 60px;opacity:0;transition:.3s;}
.acc-con ul li .box .on-txt .eng{margin-bottom:30px;color:var(--pri);font-weight:700;line-height:1.4em;}
.acc-con ul li .box .on-txt .tit{margin-bottom:25px;font-size:var(--fz36);font-weight:700;line-height:1.2em;color:var(--dark);}
.acc-con ul li .box .on-txt .tt{font-size:var(--fz18);font-weight:500;line-height:1.67em;}
.acc-con ul li .box .on-txt .doc-more{background-color:rgba(255,255,255,.6);border-color:rgba(255,255,255,.4);}

.acc-con ul li.active .off-txt{opacity:0;}
.acc-con ul li.active .on-txt{opacity:1;}
.acc-con ul li.st2 .box{background-image: url('/images/main/sec3-bg2.jpg');}
.acc-con ul li.st3 .box{background-image: url('/images/main/sec3-bg3.jpg');}
.acc-con ul li.st4 .box{background-image: url('/images/main/sec3-bg4.jpg');}
.acc-con ul li.st5 .box{background-image: url('/images/main/sec3-bg5.jpg');}
.acc-con ul li.st6 .box{background-image: url('/images/main/sec3-bg6.jpg');}
.acc-con ul li.st7 .box{background-image: url('/images/main/sec3-bg7.jpg');}
.acc-con ul li.st8 .box{background-image: url('/images/main/sec3-bg8.jpg');}
.acc-con ul li.st1.active .box{background-image: url('/images/main/sec3-bg1-on.jpg');}
.acc-con ul li.st2.active .box{background-image: url('/images/main/sec3-bg2-on.jpg');}
.acc-con ul li.st3.active .box{background-image: url('/images/main/sec3-bg3-on.jpg');}
.acc-con ul li.st4.active .box{background-image: url('/images/main/sec3-bg4-on.jpg');}
.acc-con ul li.st5.active .box{background-image: url('/images/main/sec3-bg5-on.jpg');}
.acc-con ul li.st6.active .box{background-image: url('/images/main/sec3-bg6-on.jpg');}
.acc-con ul li.st7.active .box{background-image: url('/images/main/sec3-bg7-on.jpg');}
.acc-con ul li.st8.active .box{background-image: url('/images/main/sec3-bg8-on.jpg');}

.sec4 .contain{display:flex;}
.sec4 .sec-tit{/* margin-right:245px; */width:715px;padding-right:40px;}
.sec4 .sec-tit .tt{margin:70px 0 100px;font-size:var(--fz18);line-height:1.67em;}
.sec4 .img{min-width:0;width:1%;flex:1 1 auto;border-radius:var(--bd24) 0 0 var(--bd24);overflow:hidden;margin-right:-9.5%;}
.sec4 .img img{width:100%;}

.sec-tit.flex{display:flex;align-items:flex-end;justify-content:space-between;}
.sec-tit .eng{margin-bottom:10px;font-size:var(--fz20);font-weight:600;color:var(--pri);line-height:1.2em;}
.main-list-sld{position:relative;margin-right:-14%;}
.main-list-sld .slick-list{margin:0 -20px;}
.main-list-sld .item{padding:0 20px;line-height:1.3em;}
.main-list-sld .item .pic {margin-bottom:25px;position:relative; height:0; padding-bottom:89.205%; overflow:hidden;border-radius:var(--bd24);}
.main-list-sld .item .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.sm-info .cate{margin-bottom:10px;line-height:1.4em;font-weight:600;color:var(--pri);}
.sm-info .tit{font-size:var(--fz22);font-weight:600;color:var(--dark);line-height:1.4em;display: inline-block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;width:100%;}
.sm-info .info{margin-top:20px;}
.sm-info .info dl{display:flex;line-height:1.6em;margin-bottom:5px;}
.sm-info .info dl:last-child{margin-bottom:0;}
.sm-info .info dl dt{width:54px;font-weight:600;color: #a8a8a8;}
.sm-info .info dl dd{min-width:0;width:1%;flex:1 1 auto;}
.sm-info .more{margin-top:25px;display:inline-block;font-size:var(--fz14);font-weight:500;line-height:1.2em;transition:.3s;text-decoration:underline;text-underline-offset:3px;}
.main-list-sld .item a:hover .more{color:var(--pri);}
.gal-list ul li a:hover .more{color:var(--pri);}

[lang=en] .sm-info .info dl dt{width:72px;}

.sec7{padding:var(--size180) 0;background:url('/images/main/sec7-bg.jpg')no-repeat 50% 50%/cover;}
.sec7 .sec-tit{text-align:center;}
.down-btns{display:flex;justify-content:center;margin:0 -10px;}
.down-btns li{max-width:300px;width:100%;padding:0 10px;}
.down-btns li .btn{display:flex;align-items:center;position:relative;height:68px;padding:0 30px;border-radius:35px;border:1px solid #dfdfdf;background-color: #fff;transition:.3s;font-size:var(--fz18);font-weight:500;color:var(--dark);line-height:1.2em;}
.down-btns li .btn:after{content:'';position: absolute;right:18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:100%;background:var(--pri) url('/images/main/ic-down.png')no-repeat 50% 50%/16px;transition:.3s;}
.down-btns li .btn:hover{background-color:var(--pri);color: #fff;}
.down-btns li .btn:hover:after{background-color: #fff;background-image: url('/images/main/ic-down-on.png');}

[lang=en] .down-btns li{max-width:340px;}

/* sub page */
.sub-visual {position:relative; z-index:10;}
.sub-visual:after{content:'';position: absolute;left:0;bottom:0;width:100%;height:var(--size180);border-radius:120px 120px 0 0;background-color: #fff;}
.sub-visual .bg-wrap{position:relative;overflow:hidden; height:940px;}
.sub-visual .contain{width:100%;position: absolute;left:50%;top:50%;transform:translate(-50%, -50%);z-index:1;padding-bottom:80px;}
.sub-visual .map{display:flex;align-items:center;justify-content:center;margin:0 -20px 30px;}
.sub-visual .map p{display:flex;justify-content:center;align-items:center;position:relative;padding:0 21px;line-height:1.2em;font-weight:500;color: #fff;opacity:.5;}
.sub-visual .map p.home{padding-bottom:2px;}
.sub-visual .map p:after{content:'';width:3px;height:3px;background-color: #fff;border-radius:100%;position: absolute;right:-1.5px;top:50%;transform:translateY(-50%);}
.sub-visual .map p:last-child{opacity:1;}
.sub-visual .map p:last-child:after{display:none;}
.sub-visual .vis-tit{font-size:var(--fz56);line-height:1.2em;font-weight:600;color: #fff;text-align:center;}
.sub-visual .background {
	position:absolute; 
	top:0; 
	left:0;
	width:100%; height:100%;	
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:cover;
	transform:scale(1.09);
    -ms-transform:scale(1.09); /* IE 9 */
    -moz-transform:scale(1.09); /* Firefox */
    -webkit-transform:scale(1.09); /* Safari and Chrome */
    -o-transform:scale(1.09); /* Opera */
	transition: all 2s ease-out 0s;
	transition-delay: 0.1s;
	z-index:0;
}
.sub-visual.load .background {
	transform:scale(1);
    -ms-transform:scale(1); /* IE 9 */
    -moz-transform:scale(1); /* Firefox */
    -webkit-transform:scale(1); /* Safari and Chrome */
    -o-transform:scale(1); /* Opera */
}

/* path 메뉴 */
.lnb-wrap{margin-top:80px;}
.path-wrap {position:relative; z-index:2;max-width:640px;margin:0 auto;padding:10px;border:1px solid rgba(255,255,255,.24);background-color:rgba(255,255,255,.1);border-radius:50px}
.path-wrap .inner{display:flex;margin:0 -5px;}
.path-wrap .inner .col{width:50%;padding:0 5px;}
.path-wrap .part {position:relative; z-index:1;}
.path-wrap .part > a {display:flex; align-items:center; position:relative; height:52px;border-radius:26px;color:#fff; font-size:var(--fz18); font-weight:600; line-height:1.2em; padding:0 23px;background-color:rgba(255,255,255,.2);backdrop-filter: blur(10px);}
.path-wrap .part > a:after {content:""; position:absolute; top:50%; right:23px; margin-top:-3px; width:12px; height:6px; background:url("/images/common/lnb-arr.png")no-repeat 50% 50%/contain;opacity:.5;transition:.3s;}
.path-wrap .part.active > a:after{transform:rotate(180deg);}
.path-wrap .part ul {display:none; position:absolute; left:0;width:100%;top:80px;padding:20px 25px;z-index:50;background-color: #fff;border:1px solid #eee;box-shadow:5px 5px 28px rgba(0,0,0,.06);border-radius:var(--bd16);}
.path-wrap .part ul li {margin-bottom:15px;}
.path-wrap .part ul li:last-child{margin-bottom:0;}
.path-wrap .part ul li a {position:relative;display:block;color:var(--dark);font-weight:600;line-height:1.4em;transition:.3s;}
.path-wrap .part ul li a:hover{color:var(--pri);}
.path-wrap .part ul li.active a{color: #a8a8a8 !important;}
.path-wrap .part ul li.active a:after{content:'';position: absolute;right:0;top:50%;margin-top:-4px;width:10px;height:8px;background:url('/images/common/lnb-chk.png')no-repeat 100% 50%/contain;}

.sub-title{margin-bottom:var(--size130);}
.sub-title h1{font-size:var(--fz56);font-weight:600;color:var(--dark);line-height:1.2em;}
.sub-title .tt{margin-top:var(--size30);font-size:var(--fz20);font-weight:600;line-height:1.6em;color: #878787;}

.real-cont {padding:0 0 var(--size180);}

/* footer */
#footer {background-color:#fff;font-size:var(--fz18);line-height:1.4em;}
#footer .contain{max-width:1880px;}
#footer .foot-logo{padding:70px 0;}
#footer .foot-info{display:flex;padding-bottom:50px;}
#footer .foot-info address {font-style:normal;min-width:0;width:1%;flex:1 1 auto;margin-right:40px;}
#footer .foot-info address .flex{display:flex;}
#footer .foot-info address .flex .col{margin-right:95px;}
#footer .foot-info address .flex .col:last-child{margin-right:0;}
#footer .foot-info address .flex .col .tit{margin-bottom:10px;font-size:var(--fz30);font-weight:700;line-height:1.3em;color:var(--dark);}
#footer .foot-info address .flex .col .adr{margin-bottom:25px;font-size:var(--fz18);font-weight:500;color:var(--dark);line-height:1.4em;}
#footer .foot-info address .flex .col dl{display:flex;margin-bottom:10px;line-height:1.4em;font-weight:500;}
#footer .foot-info address .flex .col dl:last-child{margin-bottom:0;}
#footer .foot-info address .flex .col dl dt{width:70px;color: #a8a8a8;}
#footer .right{display:flex;align-items:flex-end;}
.scroll-top{position: fixed;right:30px;bottom:30px;font-size:28px;line-height:1em;font-weight:500;color:var(--dark);z-index:100;width:60px;height:60px;display:flex;justify-content:center;align-items:center;background-color: #fff;border-radius:100%;border:1px solid #eee;box-shadow:6px 6px 28px rgba(0,0,0,.06);}
.family {width:195px;margin-top:100px;position:relative;}
.family .tit {width:100%;display:flex;align-items:center;height:48px;padding:0 20px;position:relative;font-size:var(--fz16);color: var(--dark);font-weight:600;line-height:1.2em;background-color: #f4f4f4;border-radius:var(--bd10);}
.family .tit:after {content:''; width:10px;	height:6px; top:50%; right:20px; margin-top:-3px; position:absolute;background:url('/images/common/family-arr.png')no-repeat 100% 50%/contain;transition:.3s;}
.family .tit.active:after {transform:rotate(0deg);}
.family .family-open {display:none; position:absolute; bottom:55px;width:100%; left:0;border-radius:var(--bd10);background-color: #f4f4f4;padding:20px;}
.family .family-open ul li{margin-bottom:10px;}
.family .family-open ul li:last-child{margin-bottom:0;}
.family .family-open ul li a{color: #a8a8a8;transition:.3s;font-size:var(--fz15);font-weight:500;line-height:1.3em;}
.family .family-open ul li a:hover{color:var(--dark);}
.family.active .family-open {display:block;}
.family.active .tit:after{transform:rotate(180deg);} 
#footer .foot-btm{display:flex;align-items:center;justify-content:space-between;padding:50px 0 95px;border-top:1px solid #dfdfdf;font-size:14px;line-height:1.4em;font-weight:500;}
#footer .foot-btm .copy a{display:inline-block;color: #f1f1f1;margin-left:10px;}
#footer .foot-btm .foot-menu ul{display:flex;margin:0 -20px;}
#footer .foot-btm .foot-menu ul li{padding:0 20px;}


.quick{position: fixed;right:0;top:40%;transform:translateY(-50%);z-index:89;}
.quick .btn-tab{padding:30px 10px;width:100px;background-color: #fff;border:1px solid #eee;border-right:none;box-shadow:6px 6px 28px rgba(0,0,0,.06);border-radius:var(--bd16) 0 0 var(--bd16);position:relative;z-index:1;}
.quick .btn-tab ul li{margin-bottom:25px;text-align:center;}
.quick .btn-tab ul li:last-child{margin-bottom:0;}
.quick .btn-tab ul li .ic{display:flex;justify-content:center;align-items:center;}
.quick .btn-tab ul li .ic img.on{display:none;}
.quick .btn-tab ul li p{margin-top:7px;font-size:12px;font-weight:600;line-height:1.4em;transition:.3s;}

.quick .btn-tab ul li a:hover img.off{display:none;}
.quick .btn-tab ul li a:hover img.on{display:block;}
.quick .btn-tab ul li a:hover p{color:var(--pri);}

.quick .btn-tab ul li.active a img.off{display:none;}
.quick .btn-tab ul li.active a img.on{display:block;}
.quick .btn-tab ul li.active a p{color:var(--pri);}

.recent-tab{position: absolute;right:100px;top:0;padding-right:10px;transition:.3s;transform:translateX(330px);}
.recent-tab.active{transform:translateX(0);}
.recent-tab .box{width:220px;padding:30px;background-color: #fff;border:1px solid #eee;box-shadow:6px 6px 28px rgba(0,0,0,.06);border-radius:var(--bd16);}
.recent-tab .tit{padding-bottom:15px;margin-bottom:25px;border-bottom:1px solid #eee;line-height:1.2em;font-weight:600;color:var(--dark);}
.recent-sld .slick-list{margin:0 -10px;}
.recent-sld .item{padding:0 10px;}
.recent-sld .item .row{margin-bottom:20px;}
.recent-sld .item .row:last-child{margin-bottom:0;}
.recent-sld .item a{display:block;position:relative;padding:15px;border:1px solid #dfdfdf;}
.recent-sld .item .pic {position:relative; padding-bottom:85.72%; overflow:hidden;}
.recent-sld .item .pic  img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}
.recent-tab .arrs{display:flex;justify-content:center;margin-top:25px;}
.recent-tab .arrs .slick-arrow{width:9px;height:16px;background-color:transparent;background-repeat:no-repeat;background-size:contain;border:none;font-size:0;transition:.3s;}
.recent-tab .arrs .slick-prev{margin-right:24px;background-image: url('/images/common/recent-prev.png');background-position:0 50%;}
.recent-tab .arrs .slick-next{background-image: url('/images/common/recent-next.png');background-position:100% 50%;}
.recent-tab .arrs .slick-arrow.disabled{pointer-events: none;opacity: 0.5;}


/* for mobile */
.only-mobile {display:none;}
.btn-m-menu {display:none; position:absolute; top:50%; margin-top:-11px; right:30px; width:30px; height:22px;  text-align:center; text-indent:-9999em; z-index:99; transition:all 0.5s ease-in-out;}
.btn-m-menu span {position:absolute; right:0; top:50%; margin-top:-1px; height:2px; width:23px;background:#fff;}
.btn-m-menu span:before,
.btn-m-menu span:after {content:" "; position:absolute; right:0; width:30px; height:2px; background:#fff; transition-duration:0.3s, 0.3s; transition-delay:0.3s, 0s;}
.btn-m-menu span:before {top:-10px; transition-property:top, transform;}
.btn-m-menu span:after {bottom:-10px; transition-property:bottom, transform;}
.mobile-navigation {position:fixed; top:0; right:0; padding:20px 0; width:400px; height:100%; overflow:auto; transition:.3s ease-in-out; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:202;}
.mobile-navigation .home {margin-bottom:20px; padding-left:15px;}
.mobile-navigation .home img {height:23px;}
.mobile-navigation .nav-menu>ul{margin-top:30px;}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #dfdfdf;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:12px 15px; display:block; color:#505050; font-size:18px; font-weight:500; line-height:1.3em;}
.mobile-navigation .nav-menu>ul>li>a:after{content:""; position:absolute; top:50%; right:15px; transform:translateY(-75%) rotate(45deg); width:10px; height:10px; border-right:2px solid #2c2c2c; border-bottom:2px solid #2c2c2c;}
.mobile-navigation .nav-menu>ul>li.active>a {color:var(--pri);}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:var(--pri);}
.mobile-navigation .nav-menu .submenu {display:none; margin:-1px 0 0 0; padding:0 15px 15px;}
.mobile-navigation .nav-menu .submenu .tit-wrap{display:none;}
.mobile-navigation .nav-menu .submenu .pr-img{display:none;}
.mobile-navigation .nav-menu .submenu .list ul:after {content:"";display:block;clear:both;}
.mobile-navigation .nav-menu .submenu .list ul>li>a {display:block; position:relative; padding:5px 15px; color:#505050; font-size:16px; font-weight:400; line-height:1.3em;}
.mobile-navigation .nav-menu .submenu .list ul>li>a:after {display:block; content:"";position:absolute; top:12px; left:5px; width:4px; height:4px; background:#dfdfdf; border-radius:50%; transition:.3s ease-in-out;}
/* .mobile-navigation .nav-menu .submenu .list ul>li>a:hover{color:var(--pri);}
.mobile-navigation .nav-menu .submenu .list ul>li>a:hover:after {background:var(--pri);} */
.mobile-navigation .nav-menu .submenu.st2 .depth-tit{display:none;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li>a{display:block;padding:5px 15px;font-size:16px;font-weight:400;line-height:1.3em;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li.active>a{color:var(--pri);}

.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth2{display:none;padding:0 20px 10px;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth2>ul>li>a{display:block;font-size:15px;font-weight:400;line-height:1.3em;margin-bottom:0;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth2>ul>li:last-child{margin-bottom:0;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth2>ul>li.active>a{color:var(--pri);}

.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth3{display:none;padding:0 20px 10px;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth3>ul>li>a{display:block;font-size:15px;font-weight:400;line-height:1.3em;margin-bottom:0;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth3>ul>li:last-child{margin-bottom:0;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth3>ul>li.active>a{color:var(--pri);}

.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth4{display:none;padding:0 20px 10px;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth4>ul>li>a{display:block;font-size:15px;font-weight:400;line-height:1.3em;margin-bottom:0;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth4>ul>li:last-child{margin-bottom:0;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li .depth4>ul>li.active>a{color:var(--pri);}

.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li.brand{margin-top:20px;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li.brand>ul{display:flex;gap:6px;margin-top:5px;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li.brand>ul>li>a{display:inline-flex;justify-content:center;align-items:center;border-radius:4px;font-size:12px;height:28px;background-color: #f8f8f8;padding:0 15px;}
.mobile-navigation .nav-menu .submenu.st2 .depth1>ul>li.brand>ul>li>a:after{display:none;}

.mobile-navigation .close {position:absolute; top:20px; right:15px; width:24px; height:24px; text-indent:-9999em; overflow:hidden;}
.mobile-navigation .close:before,
.mobile-navigation .close:after {content:" "; position:absolute; top:12px; left:0; width:100%; height:2px; background:#2c2c2c;}
.mobile-navigation .close:before {transform:rotate(45deg);}
.mobile-navigation .close:after {transform:rotate(-45deg);}

.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:201;}

html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0); }
html.menu-opened .mobile-overlay {display:block;}

.m-util{display:none;padding:0 15px;/* position: absolute;left:15px;top:20px; */}
.m-util ul{display:flex;align-items:center;}
.m-util ul li{margin-right:20px;}
.m-util ul li:last-child{margin-right:0;}
.m-util ul li .btn{display:inline-flex;justify-content:center;align-items:center;position:relative;color:var(--dark);font-weight:500;line-height:1.2em;transition:.3s;}
.m-util ul li .btn.st2{padding:0 15px;height:28px;background-color:var(--pri);border:1px solid var(--pri);border-radius:20px;color: #fff;}