@charset "utf-8";
*{word-break: keep-all;}

/* ----- common ----- */
#contents { overflow: hidden;}
.hidden { overflow: hidden !important; height:100vh !important; height: calc(var(--vh, 1vh) * 100) !important;; position: fixed !important;}
.maxinner { margin:0 auto; max-width:1460px; width:90%;}
.img-none { display:flex; justify-content:center; align-items:center; position:absolute; left:0; top:0; width:100%; height:100%; background:#f2f2f2;}
.img-none img { position: static !important; max-width:80% !important; width:auto !important; height:auto !important;}

.water-epc .maxinner {text-align: center;} 




/* ----- scroll down ----- */
.scroll-down { position: absolute; bottom:40px; right:4%; width:45px; height:150px; z-index: 999;}
.scroll-down i { position:absolute;  left:50%; bottom:0; width:40px; height:40px; border-radius:50%; border:1px solid #ddd;
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	transform:translateX(-50%);
}
.scroll-down p { position:absolute; left:50%; top:0; margin-left:-7.5px; margin-top:80px; width:100px; font-size:14px; color:#fff; letter-spacing:1px; font-weight:300; 
	-webkit-transform:rotate(-90deg); 
	-moz-transform:rotate(-90deg); 
	-ms-transform:rotate(-90deg); 
	-o-transform:rotate(-90deg); 
	transform:rotate(-90deg); 
	-webkit-transform-origin:0% 0%;
	-moz-transform-origin:0% 0%;
	-ms-transform-origin:0% 0%;
	-o-transform-origin:0% 0%;
	transform-origin:0% 0%;
	-webkit-transition:margin 0.3s;
	-moz-transition:margin 0.3s;
	-ms-transition:margin 0.3s;
	-o-transition:margin 0.3s;
	transition:margin 0.3s;	
}
.scroll-down i:before { content:""; position: absolute; top: 50%; left: 50%;  width:4px; height:4px; background:#fff; border-radius:50%;
    -webkit-animation:scrollZoomIn 2s infinite;
    -moz-animation:scrollZoomIn 2s infinite;
    -ms-animation:scrollZoomIn 2s infinite;
    -o-animation:scrollZoomIn 2s infinite;
    animation:scrollZoomIn 2s infinite;
	-webkit-transform:translate(-50%,-50%); 
	-moz-transform:translate(-50%,-50%); 
	-ms-transform:translate(-50%,-50%); 
	-o-transform:translate(-50%,-50%); 
	transform:translate(-50%,-50%); 
}
.scroll-down i:after{ display: none; content: ""; position: absolute; top: 50%; left: 50%;  width:4px; height:4px; background:#fff; border-radius:50%;
	-webkit-transform:translate(-50%,-50%); 
	-moz-transform:translate(-50%,-50%); 
	-ms-transform:translate(-50%,-50%); 
	-o-transform:translate(-50%,-50%); 
	transform:translate(-50%,-50%); 	
}
.scroll-down:hover { height:130px;}
.scroll-down:hover p { margin-top:0;}
.scroll-down:hover i { overflow:hidden; width:2px; height:100px; border-radius:0; border:none; background-color: rgba(255,255,255,0.3);
	-webkit-transition:height 0.1s;
	-moz-transition:height 0.1s;
	-ms-transition:height 0.1s;
	-o-transition:height 0.1s;
	transition:height 0.1s;
}
.scroll-down:hover i:before { display:none;}
.scroll-down:hover i:after { display: block; content: ""; width: 100%; height: 10px; border-radius:0; background: #fff; 
	-webkit-animation: scrollDown 2s infinite;
	-moz-animation: scrollDown 2s infinite;
	-ms-animation: scrollDown 2s infinite;
	-o-animation: scrollDown 2s infinite;
	animation: scrollDown 2s infinite;
}
.scroll-down2 { position:absolute; left:50%; bottom:5%; z-index:10; width:40px; height: 40px; border-bottom: 3px solid #fff; border-right: 3px solid #fff;
	-webkit-transform: translateX(-50%), rotate(45deg);
	-moz-transform: translateX(-50%), rotate(45deg);
	-ms-transform: translateX(-50%), rotate(45deg);
	-o-transform: translateX(-50%), rotate(45deg);
	transform: translateX(-50%), rotate(45deg);
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	transform-origin: 0 0;	
	-webkit-animation: scrollDown2 2s infinite;
	-moz-animation: scrollDown2 2s infinite;
	-ms-animation: scrollDown2 2s infinite;
	-o-animation: scrollDown2 2s infinite;
	animation: scrollDown2 2s infinite;
}



.scroll-btn {  position: fixed;right: 0;bottom: 0; z-index:10; display:none;} 
.scroll-btn a {display:block; width:6em; height:6em; background:#333;}
.scroll-btn a:hover{background:#262626;}
.scroll-btn a:after { content:"\e905"; position:absolute; left:50%; top:50%; font-size:2.5rem; color:#fff; font-family:'xeicon',sans-serif; margin-top:-0.5em; margin-left:-0.5em}
 


/* ----- sub scroll down ----- */
.sub .scroll-down { opacity: 0; right:auto; left:50%; bottom:8%; margin-left:-22.5px; width:45px; height:75px; }
.sub .scroll-down i { border-color:rgba(255,255,255,0.3); }
.sub .scroll-down p { left:50%; margin-top:0; margin-left:0; text-align:center;
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	transform:translateX(-50%);
}
.sub .scroll-down:hover { height:100px;}
.sub .scroll-down:hover i { height:60px;}
.sub.open .scroll-down { opacity:1; bottom:5%;
    -webkit-transition:opacity, bottom 0.7s;
    -moz-transition:opacity, bottom 0.7s;
    -ms-transition:opacity, bottom 0.7s;
    -o-transition:opacity, bottom 0.7s;
    transition:opacity, bottom 0.7s;
}





/* ----- button ----- */
.btn-viewmore { position:relative; font-size:15px; color:#333; font-weight:600; line-height:1; position:relative;}
.btn-viewmore strong { padding-right:85px; margin-right:6px; font-size:20px; font-weight:600}
.btn-viewmore:hover .arrow:after,
.btn-viewmore:hover .arrow:before {opacity:1;} 
.btn-viewmore:after { content:""; position:absolute; right:40px; top:50%; z-index:10; margin-top:1px; width:37px; height:2px; background:#333; margin-right:-8px;
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
	transform:translateY(-50%);
	transition:all ease .3s;
}
 
/* ----- button add km  ----- */
.btn-viewmore .arrow { display: block; position: absolute; width: 70px; height: 70px; right:0; top:-24px; z-index:-1;}
.btn-viewmore .arrow.left {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
}
.btn-viewmore .arrow em { display: block; position: absolute; margin: -10px 0 0 -10px; width: 20px; height: 20px; left: 50%; top: 50%; z-index:10;}
.btn-viewmore .arrow em:before, 
.btn-viewmore .arrow em:after { content: ""; width: 10px; height: 2px; border-radius: 1px; position: absolute; left: 50%; top: 50%; background: #333; margin: -1px 0 0 -5px; display: block;
  -webkit-transform-origin: 9px 50%;
  -moz-transform-origin: 9px 50%;
  -ms-transform-origin: 9px 50%;
  -o-transform-origin: 9px 50%;
  transform-origin: 9px 50%;
  z-index:10;
}
.btn-viewmore .arrow em:before {
    -webkit-transform: rotate(-40deg);
    -moz-transform: rotate(-40deg);
    -ms-transform: rotate(-40deg);
    -o-transform: rotate(-40deg);
    transform: rotate(-40deg);
}
.btn-viewmore .arrow em:after {
    -webkit-transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    -o-transform: rotate(40deg);
    transform: rotate(40deg);
}
.btn-viewmore .arrow:before, 
.btn-viewmore .arrow:after { content: ""; display: block; position: absolute; left: 1px; right: 1px; top: 1px; bottom: 1px; border-radius: 50%;
  -webkit-transition:all ease .3s; 
  -moz-transition:all ease .3s; 
  -ms-transition:all ease .3s; 
  -o-transition:all ease .3s; 
  transition:all ease .3s; 
}
.btn-viewmore .arrow div { display: block; width: 70px; height: 70px; position: relative; z-index: 1; border:2px solid rgba(153,153,153,0.8); border-radius:50%;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg); 
}
.btn-viewmore .arrow div:after {
	content:"";
	position:absolute;
	left:-5%;
	top:-5%;
	width:110%;
	height:110%;
	background:#fff;	
}
.btn-viewmore .arrow div:before {
	content:"";
	position:absolute;
	right:-5%;
	top:-5%;
	width:0;
	height:110%;
	background:#fff; 
}
.btn-viewmore .arrow.animate div:after {
	width:0;
  -webkit-transition:all ease .5s; 
  -moz-transition:all ease .5s; 
  -ms-transition:all ease .5s; 
  -o-transition:all ease .5s; 
  transition:all ease .5s; 	
  -webkit-transition-delay:0.3s;
  -moz-transition-delay:0.3s;
  -ms-transition-delay:0.3s;
  -o-transition-delay:0.3s;
  transition-delay:0.3s;   
}
.btn-viewmore .arrow.animate div:before {
	width:110%;
  -webkit-transition:all ease .5s;  
  -moz-transition:all ease .5s;  
  -ms-transition:all ease .5s;  
  -o-transition:all ease .5s;  
  transition:all ease .5s;  	
  -webkit-transition-delay:0.6s;
  -moz-transition-delay:0.6s;
  -ms-transition-delay:0.6s;
  -o-transition-delay:0.6s;
  transition-delay:0.6s; 	
}
.btn-viewmore .arrow.animate em {
    -webkit-animation: arrow 1.6s ease forwards;
    -moz-animation: arrow 1.6s ease forwards;
    -ms-animation: arrow 1.6s ease forwards;
    -o-animation: arrow 1.6s ease forwards;
    animation: arrow 1.6s ease forwards;
}
.btn-viewmore .arrow.animate em:before {
    -webkit-animation: arrowUp 1.6s ease forwards;
    -moz-animation: arrowUp 1.6s ease forwards;
    -ms-animation: arrowUp 1.6s ease forwards;
    -o-animation: arrowUp 1.6s ease forwards;
    animation: arrowUp 1.6s ease forwards;
}
.btn-viewmore .arrow.animate em:after {
    -webkit-animation: arrowDown 1.6s ease forwards;
    -moz-animation: arrowDown 1.6s ease forwards;
    -ms-animation: arrowDown 1.6s ease forwards;
    -o-animation: arrowDown 1.6s ease forwards;
    animation: arrowDown 1.6s ease forwards;
}
 
.btn-menu, 
.btn-menu:before, 
.btn-menu:after { position: absolute; top: 0; right: 0; z-index: 1; width: 25px; height: 2px; background: #fff; cursor: pointer;
    -webkit-transition: 0.2s ease;
    -moz-transition: 0.2s ease;
    -ms-transition: 0.2s ease;
    -o-transition: 0.2s ease;
    transition: 0.2s ease;
}
.btn-menu:before { content: ""; top: 9px; right: 0;}
.btn-menu:after { content: ""; top: 18px; right: 0;}





/* ----- header ----- */
#header { position:fixed; left:0; top:0; z-index:5000; width:100%; height:100px;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -ms-transition:all 0.3s;
    -o-transition:all 0.3s;
    transition:all 0.3s;
}
#header:after { content:""; opacity:0; visibility:hidden; position:absolute; left:50%; top:100px; z-index:1; width:100%; height:1px; background:#ececec;
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	transform:translateX(-50%);
    -webkit-transition:opacity 0.3s;
    -moz-transition:opacity 0.3s;
    -ms-transition:opacity 0.3s;
    -o-transition:opacity 0.3s;
    transition:opacity 0.3s;	
}
#header .hd-logo { position:absolute; left:36px; top:42px; z-index:6000;}
#header .hd-logo a { display:block; width:121px;  height:17px; background:url(/images/common/logo.png) no-repeat center; background-size:100%;	} 
#header .hd-logo .hide {width:85px; background-repeat:no-repeat; background-size:100%; margin-top:2.5px; background-image:url('/images/common/logo-kr-w.png'); display:inline-block; position:static; left:auto; margin-left:6px; font-size:1.7rem; color:#fff; font-weight:700; text-indent:-9999px; line-height:16.5px; vertical-align:middle; display:none;}
#header .hd-logo .hide span{display:none;}
  



#header .hd-menu .gnb-wrap { height:100%;}
#header .hd-menu .gnb-wrap .gnb { display:flex; justify-content:center; align-items:center;height:100%; text-align:center;}
#header .hd-menu .gnb-wrap .gnb > li { display:flex; justify-content:center; align-items:center; position:relative; padding:42px 0; height:100%; width:160px;
    -webkit-transition:all ease .3s;
    -moz-transition:all ease .3s;
    -ms-transition:all ease .3s;
    -o-transition:all ease .3s;
    transition:all ease .3s;
}
#header .hd-menu .gnb-wrap .gnb > li:after { content:""; position:absolute; left:50%; bottom:0; width:0; height:3px; background:#38b800;
	-webkit-transform:translate(-50%);
	-moz-transform:translate(-50%);
	-ms-transform:translate(-50%);
	-o-transform:translate(-50%);
	transform:translate(-50%);
}
#header .hd-menu .gnb-wrap .gnb > li > a { display:flex; justify-content:center; align-items:center; font-size:1.8rem; color:#fff; line-height:1;}
#header.on .hd-menu .gnb-wrap .gnb > li { width:215px;}
#header.on .hd-menu .gnb-wrap .gnb > li.on > a{ color:#38b800 ;} 
#header .hd-menu .gnb-wrap .gnb > li .depth { opacity:0; visibility:hidden; position:absolute; left:0; top:100%; padding-top:2em; min-width:215px; width:100%; }
#header .hd-menu .gnb-wrap .gnb > li .depth:before { content:""; position:absolute; left:0; top:30px; width:1px; height:300px; background:#ececec;}
#header .hd-menu .gnb-wrap .gnb > li:first-child .depth:before {display:none;}
#header .hd-menu .gnb-wrap .gnb > li .depth > ul > li > a { display:block; padding:0.52em 1em; font-size:1.6rem; color:#666; letter-spacing:-0.04em; line-height: 1.4;} 
#header .hd-menu .gnb-wrap .gnb > li:nth-child(1) .depth > ul > li { position:relative;}  
#header .hd-menu .gnb-wrap .gnb > li:nth-child(1) .depth > ul > li > i { position:absolute; right:0; top:10px; font-size:2rem; color:#666; cursor:pointer;}
#header .hd-menu .gnb-wrap .gnb > li:nth-child(1) .depth > ul > li > i:hover { color:#38b800;}
#header .hd-menu .gnb-wrap .gnb > li:nth-child(1) .depth > ul > li:not(.noafter) > a:after { content:"\e942"; line-height:1; /*position:absolute; right:.5em; top:8px;*/ margin-top:2px;  margin-left:6px; font-size:1.6rem; color:#ccc; font-family:'xeicon',sans-serif;
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
	-ms-transition:all 0.3s;
	-o-transition:all 0.3s;
	transition:all 0.3s;
} 
 
#header .hd-menu .gnb-wrap .gnb > li .depth > ul > li > a > span {position:relative;} 
#header .hd-menu .gnb-wrap .gnb > li.open .depth { display:block;} 
#header .hd-menu .gnb-wrap .gnb > li.open > a:after { top:28px; border-left:2px solid #999; border-top:2px solid #999;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);	
} 
#header .hd-menu .gnb-wrap .gnb > li .depth > ul > li:hover > a{color:#666}
#header .hd-menu .gnb-wrap .gnb > li .depth > ul > li.active > a,
#header .hd-menu .gnb-wrap .gnb > li .depth2 > li.on > a,
#header .hd-menu .gnb-wrap .gnb > li.open .depth > ul > li.on > a{color:#38b800;} 
#header .hd-menu .gnb-wrap .gnb > li .depth > ul > li.on > a{color:#38b800;} 
#header .hd-menu .gnb-wrap .gnb > li .depth2 > li.on > a:hover{color:#38b800; text-decoration:none;}


#header .hd-menu .gnb-wrap .gnb > li:nth-child(1) .depth > ul > li.active > a{color:#38b800}
#header .hd-menu .gnb-wrap .gnb > li:nth-child(1) .depth > ul > li.active .depth2{display:block;}
#header .hd-menu .gnb-wrap .gnb > li:not(:first-child) .depth > ul > li:hover > a{text-decoration: underline; text-underline-position: under;}

#header .hd-menu .gnb-wrap .gnb > li .depth2 > li > a:hover{text-decoration: underline; text-underline-position: under; color:#666;} 



#header .hd-menu .gnb-wrap .gnb > li .depth > ul > li.open > a:after { 
	-webkit-transform:rotate(-180deg);
	-moz-transform:rotate(-180deg);
	-ms-transform:rotate(-180deg);
	-o-transform:rotate(-180deg);
	transform:rotate(-180deg);
}
#header .hd-menu .gnb-wrap .gnb > li .depth2 { display:none; padding:0.5em 0; /*background:#f1f1f1;*/}
#header .hd-menu .gnb-wrap .gnb > li .depth2 > li > a { display:block; padding:0.333em 2.333em; font-size:1.5rem; color:#666; font-weight:300;} 



#header .hd-info { display:flex; align-items:center; position:absolute; right:36px; top:35px; z-index:6000;}
#header .hd-info .hd-search > div { position:relative;}
#header .hd-info .hd-search .btn-search-open { display:block; width:20px; height:20px; border:none; background:url(/images/ico/ico-search.png) no-repeat center; font-size:0; line-height:0; text-indent:-9999px;}
#header .hd-info .hd-search .search-wrap { display:none; position:fixed; left:0; top:0; z-index:9999; width:100%; height:100%; background:rgba(0,0,0,0.8);}
#header .hd-info .hd-search .search-wrap.on { display:block;}
#header .hd-info .hd-search .search-wrap form { display:flex; justify-content:center; align-items:center; position:relative; width:100%; height:250px; background:#fff;}
#header .hd-info .hd-search .search-wrap .btn-search-close { position:absolute; right:0; margin-right:5%; top:250px; z-index:10; margin-top:-40px; width:80px; height:80px; background:#38b800; font-size:0; line-height:0; text-indent:-9999px;}
#header .hd-info .hd-search .search-wrap .btn-search-close:after { content:"\e921"; display:flex; justify-content:center; align-items:center; position:absolute; left:0; top:0; width:100%; height:100%; font-size:4rem; color:#fff; line-height:1; text-indent:0; font-family:'xeicon',sans-serif;}
#header .hd-info .hd-search .search-wrap .search-form { position:relative; padding-right:6em; width:60em; border-bottom:2px solid #333;	}
#header .hd-info .hd-search .search-wrap .search-form .search-input { display:block; padding:0.5em; width:100%; height:60px; border:none; background:transparent; font-size:2rem; color:#333;}
#header .hd-info .hd-search .search-wrap .search-form .search-input:placeholder {color: #f1f1f1;}
#header .hd-info .hd-search .search-wrap .search-form .btn-search { position:absolute; right:0; top:0; width:60px; height:60px; background:none; font-size:0; text-indent:-9999px;}
#header .hd-info .hd-search .search-wrap .search-form .btn-search:after { content:"\e97a"; display:flex; justify-content:center; align-items:center; position:absolute; left:0; top:0; z-index:1; width:100%; height:100%; font-size:3rem; color:#333; text-indent:0; font-family:'xeicon',sans-serif;}
#header .hd-info .hd-search .search-wrap form {
    -webkit-animation: slideUp 0.2s linear forwards;
    -moz-animation: slideUp 0.2s linear forwards;
    -ms-animation: slideUp 0.2s linear forwards;
    -o-animation: slideUp 0.2s linear forwards;
    animation: slideUp 0.2s linear forwards;
}
#header .hd-info .hd-search .search-wrap .btn-search-close {
    -webkit-animation: slideLeft 0.2s linear forwards;
    -moz-animation: slideLeft 0.2s linear forwards;
    -ms-animation: slideLeft 0.2s linear forwards;
    -o-animation: slideLeft 0.2s linear forwards;
    animation: slideLeft 0.2s linear forwards;
}
#header .hd-info .hd-search .search-wrap.active form {
    -webkit-animation: slideDown 0.2s linear forwards;
    -moz-animation: slideDown 0.2s linear forwards;
    -ms-animation: slideDown 0.2s linear forwards;
    -o-animation: slideDown 0.2s linear forwards;
    animation: slideDown 0.2s linear forwards;
}
#header .hd-info .hd-search .search-wrap.active .btn-search-close {
    -webkit-animation: slideRight 0.2s linear forwards;
    -moz-animation: slideRight 0.2s linear forwards;
    -ms-animation: slideRight 0.2s linear forwards;
    -o-animation: slideRight 0.2s linear forwards;
    animation: slideRight 0.2s linear forwards;
}
#header .hd-info .hd-search .search-wrap .keyword{padding:10px 0;} 

#header .hd-info .hd-lang { position:relative;cursor: pointer;}
#header .hd-info .hd-lang .btn-lang { position:relative; padding-right:38px; margin-left:40px;border:none;width:30px; height:30px; background:url(/images/ico/ico-lang.png) no-repeat left center;}
#header .hd-info .hd-lang .btn-lang:after { content:""; position:absolute; right:0; top:50%; margin-top:-1px; border:4px solid transparent; border-top:4px solid #fff;}
#header .hd-info .hd-lang ul { opacity:0; visibility:hidden; position:absolute; left:50%; top:100%; z-index:1000; margin-top:10px; margin-left:20px; padding:0.7em 0; background:#fff; border-radius:3px;
	-webkit-box-shadow:1px 1px 10px rgba(0,0,0,0.2);
	box-shadow:1px 1px 10px rgba(0,0,0,0.2);
	-webkit-transform:translateX(-50%);
	-moz-transform:translateX(-50%);
	-ms-transform:translateX(-50%);
	-o-transform:translateX(-50%);
	transform:translateX(-50%);
}
#header .hd-info .hd-lang ul:after { content:""; position:absolute; left:50%; top:-10px; margin-left:-5px; border:5px solid transparent; border-bottom:5px solid #fff;}
#header .hd-info .hd-lang ul li a { display:block; padding:0.3em 1em; font-size:13px; color:#666; text-align:center; font-family:'Noto Sans KR',sans-serif; font-weight:500;}
#header .hd-info .hd-lang ul li a:hover {color:#38b800;}
#header .hd-info .hd-text {width:115px; background-image:url('/images/common/logo-kr-w.png'); background-repeat:no-repeat; background-position:left top; background-size:100%; margin-left:30px;font-size:1.8rem;color:#fff;font-weight:700; text-indent:-9999px;}
#header .hd-info .hd-lang.on .btn-lang:after { border-bottom:4px solid #fff; border-top:none;}
#header .hd-info .hd-lang.on ul { opacity:1; visibility:visible;}
#header .hd-info .hd-allmenu-open {display:none;}
   

#header .left-link{position:absolute; left:36px; top:calc(100px + 2em); opacity: 0;  visibility: hidden; max-width:12%;}
#header .left-link a { display:block;  font-size:1.6rem;  letter-spacing:-0.04em; line-height: 1.4;  color: #666;     padding: 1.2rem 2rem;    border: 1px solid #ddd;    border-radius: 4px;    margin-bottom: 8px; gap:20px;  display: flex;    justify-content: space-between;  } 
#header .left-link a i {display:inline-block;   vertical-align:top;     width: 14px;}
#header.on .left-link{opacity:1; visibility:visible;-webkit-transition-delay: 0.1s;-moz-transition-delay: 0.1s;-ms-transition-delay: 0.1s;-o-transition-delay: 0.1s;transition-delay: 0.1s;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;    }
#header .left-link a:hover{color: #333; border-color:#333;} 






/* ----- header (ONLY 1240) ----- */
@media all and (min-width:1240px){
	#header.on { overflow:hidden; height:465px; background:#fff; -webkit-box-shadow:1px 1px 25px rgb(67 67 67 / 10%); box-shadow:1px 1px 25px rgb(67 67 67 / 10%);}
	#header.on:after { opacity:1; visibility:visible;}
	#header.on .hd-logo a { background-image:url(/images/common/logo-on.png);}
	#header.on .hd-menu .gnb-wrap .gnb > li > a { color:#666666;}
	#header.on .hd-info .hd-search .btn-search-open { background-image:url(/images/ico/ico-search-on.png);}
	#header.on .hd-info .hd-search .btn-search-open:before { background-color:#666;}
	#header.on .hd-info .hd-text  {background-image:url('/images/common/logo-kr.png'); }
	#header.on .hd-info .hd-lang .btn-lang { background-image:url(/images/ico/ico-lang-on.png);}
	#header.on .hd-info .hd-lang .btn-lang:after { border-top:5px solid #333;}
	#header.on .hd-menu .gnb > li .depth { opacity:1; visibility:visible;
		-webkit-transition-delay: 0.1s;
		-moz-transition-delay: 0.1s;
		-ms-transition-delay: 0.1s;
		-o-transition-delay: 0.1s;
		transition-delay: 0.1s;
		-webkit-transition:all 0.3s;
		-moz-transition:all 0.3s;
		-ms-transition:all 0.3s;
		-o-transition:all 0.3s;
		transition:all 0.3s;     
	}
	#header.on .hd-logo .hide { color:#666;}		
}
/* ----- header (ONLY 1280) ----- */





/* ----- header - reverse ----- */
#header.reverse { background:#fff;}
#header.reverse .hd-logo a { background-image:url(/images/common/logo-on.png);}
#header.reverse .hd-menu .gnb > li > a {  color:#666666;}
#header.reverse .hd-info .hd-search .btn-search-open { background-image:url(/images/ico/ico-search-on.png);}
#header.reverse .hd-info .hd-search .btn-search-open:before {  background-color:#666;}
#header.reverse .hd-info .hd-text {background-image:url('/images/common/logo-kr.png') ; }
#header.reverse .hd-info .hd-lang .btn-lang { background-image:url(/images/ico/ico-lang-on.png);}
#header.reverse .hd-info .hd-lang .btn-lang:after { border-top:5px solid #333;}
#header.reverse .btn-menu, 
#header.reverse .btn-menu:before, 
#header.reverse .btn-menu:after { background:#666;}

  







/* ----- footer ----- */
#footer .ft-top { overflow:hidden; position:relative; padding:5em 0; border-top:1px solid #ececec;background:#fff;}
#footer .ft-top .maxinner { display:flex; justify-content:space-between; margin:0 auto;}
#footer .ft-top .maxinner > div{width:16.666%; border-right:1px solid #ececec; padding:0 2rem;}
#footer .ft-top .maxinner > div:last-child{border-right:0;}
#footer .ft-top h3 { margin-bottom:.5em; font-size:1.8rem; color:#333; font-weight:600;}
#footer .ft-top ul > li > a { display:block; font-size:1.5rem; color:#000; padding:.5em 0;font-weight:400; opacity:0.6;}
#footer .ft-top ul > li > a:hover{opacity:1; }
#footer .ft-top ul > li > a i {display:inline-block; margin-left:5px; margin-top:-1px;vertical-align:top;}

#footer .ft-btm { position:relative; background:#333;}
#footer .ft-btm .topbtn { opacity: 0; visibility: hidden; position:absolute; right:0; top:0; z-index:1000; height:6em;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -ms-transition:all 0.3s;
    -o-transition:all 0.3s;
    transition:all 0.3s;
}
#footer .ft-btm .topbtn.on { opacity: 1; visibility: visible; top:-6em;}
#footer .ft-btm .topbtn button { width:6em; height:6em; background:#333;}
#footer .ft-btm .topbtn button:hover{background:#262626;}
#footer .ft-btm .topbtn button:after { content:"\e915"; position:absolute; left:50%; top:50%; font-size:2.5rem; color:#fff; font-family:'xeicon',sans-serif; margin-top:-0.5em; margin-left:-0.5em}

.sub #footer .ft-btm .topbtn { position: fixed; top:auto; bottom:0;}
.sub #footer .ft-btm .topbtn.fixed { opacity: 1; visibility: visible;}
.sub #footer .ft-btm .topbtn.on { position: absolute; top:-6em; bottom:auto;}

#footer .ft-btm .ft-country {   height:0; overflow:hidden;  visibility: hidden; position:absolute; left:0; bottom:100%; z-index:3000; width:100%;  background:#333; border-bottom:1px solid #434343;
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
	-ms-transition:all 0.3s;
	-o-transition:all 0.3s;
	transition:all 0.3s;
}
#footer.open .ft-btm .ft-country { opacity: 1; visibility: visible;  padding: 5em 0; height:215px;}
#footer .ft-btm .ft-country .maxinner > div { display:flex; padding-top:1.5em;}
#footer .ft-btm .ft-country .maxinner > div:first-child { padding-top:0;}
#footer .ft-btm .ft-country h2 { width:8.750em; font-size:1.6rem; color:#fff; line-height:1.750em;}
#footer .ft-btm .ft-country ul { width:calc(100% - 14em);}
#footer .ft-btm .ft-country ul li { display:inline-block; margin:0.5em 0; margin-left:3.5em; vertical-align:middle;}
#footer .ft-btm .ft-country ul li a { position:relative; font-size:1.5rem; color:#fff; opacity:.6; font-weight:300; letter-spacing:-0.25px;}
#footer .ft-btm .ft-country ul li a:after { content:""; position:absolute; left:0; bottom:-2px; width:0; height:1px; background:#fff;} 
#footer .ft-btm .ft-country ul li a:hover {opacity:1;}
#footer .ft-btm .ft-country ul li a:hover:after { width:100%;
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
	-ms-transition:all 0.3s;
	-o-transition:all 0.3s;
	transition:all 0.3s;
}
#footer .ft-btm .ft-country ul li a i { display: inline-block; margin-left: 10px; margin-top: -1px; vertical-align: top;}

#footer .ft-btm .ft-info { padding:1.5em 0; border-bottom:1px solid #434343;}
#footer .ft-btm .ft-info .maxinner { display:flex; justify-content:space-between; align-items:center;}
#footer .ft-btm .ft-info .left ul { display:flex; align-items:center;}
#footer .ft-btm .ft-info .left ul > li { position:relative; padding-right:3.5em;}
#footer .ft-btm .ft-info .left ul > li:after { content:"/"; position:absolute; right:12.5px; top:50%; font-size:0.5rem; font-weight:700; color:#666;
	-webkit-transform: scale(0.8) rotate(10deg) translate(-50%,-50%); 
	-moz-transform: scale(0.8) rotate(10deg) translate(-50%,-50%); 
	-ms-transform: scale(0.8) rotate(10deg) translate(-50%,-50%); 
	-o-transform: scale(0.8) rotate(10deg) translate(-50%,-50%); 
	transform: scale(0.8) rotate(10deg) translate(-50%,-50%); 
}
#footer .ft-btm .ft-info .left ul > li:last-child { padding-right:0;}
#footer .ft-btm .ft-info .left ul > li:last-child:after { display:none;}
#footer .ft-btm .ft-info .left ul > li > a {  position:relative; font-size:1.5rem; color:#999999; font-weight:300;}
#footer .ft-btm .ft-info .left ul > li > a:hover { color:#fff; font-weight:300;}
#footer .ft-btm .ft-info .left ul > li > a.btn-company { padding-right:23px;}
#footer .ft-btm .ft-info .left ul > li > a.btn-company:after { content:""; position:absolute; left:0; bottom:-5px; width:0; height:1px; background:#fff;} 
#footer .ft-btm .ft-info .left ul > li > a.btn-company:before { content:"\e917"; position:absolute; right:0; top:-0.5px; font-size:1.8rem; font-family:'xeicon',sans-serif;}
#footer.open .ft-btm .ft-info .left ul > li > a.btn-company { color:#fff;}
#footer.open .ft-btm .ft-info .left ul > li > a.btn-company:after { width:100%;
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
	-ms-transition:all 0.3s;
	-o-transition:all 0.3s;
	transition:all 0.3s;
}
#footer.open .ft-btm .ft-info .left ul > li > a.btn-company:before { content:"\e91e";}
/*
#footer .ft-btm .ft-info .left ul > li > a:after { content:""; position:absolute; left:0; bottom:-2px; width:0; height:1px; background:#fff;} 
#footer .ft-btm .ft-info .left ul > li > a:hover:after { width:100%;
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
	-ms-transition:all 0.3s;
	-o-transition:all 0.3s;
	transition:all 0.3s;
}
*/
#footer .ft-btm .ft-info .left ul > li > a > strong { color:#fff; font-weight:300;}
#footer .ft-btm .ft-info .left ul > li > a > strong i { display:inline-block; margin-left:10px; margin-top:-1px;  vertical-align:top;}

#footer .ft-btm .ft-info .right { display:flex; align-items:center;}
#footer .ft-btm .ft-info .right .sns-list { display:flex; gap:5px; margin-right:2em;}
#footer .ft-btm .ft-info .right .sns-list .ico-youtube {display:block; width:100%; height:100%; background-image: url(/images/ico/ico-youtube.png); background-repeat: no-repeat; background-position: center;}
#footer .ft-btm .ft-info .right .sns-list li:first-child a:hover > i {background-image: url(/images/ico/ico-youtube-on.png);}
#footer .ft-btm .ft-info .right .sns-list li a { display:flex; justify-content:center; align-items:center; width:2.188em; height:2.188em; border-radius:50%; background:#434343; font-size:1.6rem; color:#999; transition:all ease .3s; }
#footer .ft-btm .ft-info .right .sns-list li a:hover { color:#fff;}

#footer .ft-btm .ft-info .right .site-wrap { position:relative;}
#footer .ft-btm .ft-info .right .site-wrap .btn-site { position:relative; padding:1.286em 1.429em; width:240px; background:#262626; font-size:1.4rem; color:#999; font-weight:400; text-align:left !important;}
#footer .ft-btm .ft-info .right .site-wrap .btn-site:after { content:""; position:absolute; right:20px; top:50%; width:8px; height:8px; border-left:2px solid #999; border-top:2px solid #999; 
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	-webkit-transform:rotate(225deg) ;
	-moz-transform:rotate(225deg) ;
	-ms-transform:rotate(225deg);
	-o-transform:rotate(225deg);
	transform:rotate(225deg);
	-webkit-transform-origin:center 0;
	-moz-transform-origin:center 0;
	-ms-transform-origin:center 0;
	-o-transform-origin:center 0;
	transform-origin:center 0;
}
#footer .ft-btm .ft-info .right .site-wrap ul { opacity:0; visibility:hidden; position:absolute; left:0; bottom:100%; z-index:3000; width:100%; background:#fff; border:1px solid #262626;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;	
	padding:1em 0;
}
#footer .ft-btm .ft-info .right .site-wrap ul li a { display:block; padding:.5em 1.429em; font-size:1.4rem;  color:#999;}
#footer .ft-btm .ft-info .right .site-wrap ul li a:hover { color:#000;}
#footer .ft-btm .ft-info .right .site-wrap.on ul { opacity:1; visibility:visible;}
#footer .ft-btm .ft-info .right .site-wrap.on .btn-site:after{ margin-top:2px;
	-webkit-transform:rotate(45deg) translateY(-50%);
	-moz-transform:rotate(45deg) translateY(-50%);
	-ms-transform:rotate(45deg) translateY(-50%);
	-o-transform:rotate(45deg) translateY(-50%);
	transform:rotate(45deg) translateY(-50%);
}

#footer .ft-btm .ft-copy .maxinner { position:relative; padding:4em 0;}
#footer .ft-btm .ft-copy h2 { display:inline-block; vertical-align:middle}
#footer .ft-btm .ft-copy h2 a { display:block; width: 132px; height: 20px; background: url(/images/common/logo.png) no-repeat center; background-size: 100%;}
#footer .ft-btm .ft-copy p { display:inline-block; margin-left:3.929em; font-size:1.4rem; color:#666666; vertical-align:middle;}

#footer .ft-btm .ft-info .right .sns-list .ico-youtube {background-size: 60%;}



/* ---------------------- */
/* ----- RESPONSIVE ----- */
/* ---------------------- */





@media all and (max-width:1600px){ 
	#header .hd-info .hd-lang .btn-lang { margin-left:25px;} 
	#header .hd-menu .gnb-wrap .gnb { margin-left:-3em;}
	#header .hd-menu .gnb-wrap .gnb > li .depth > ul > li > a { padding:0.5em 1em; font-size:1.5rem;} 
	#header .hd-menu .gnb-wrap .gnb > li { width:140px;}
	#header.on .hd-menu .gnb-wrap .gnb > li { width:170px;}
	#header.on .hd-menu .gnb-wrap .gnb > li:first-child { width:210px;}
	#header.reverse .hd-logo .hide { background-image:url('/images/common/logo-kr.png');} 
	#header .hd-menu .gnb-wrap .gnb > li .depth{min-width:auto;}
}


@media all and (max-width: 1440px){ 
    html { font-size:58%;}

    #header .hd-info .hd-lang .btn-lang { margin-left:20px;}
    #header .hd-info .hd-text { margin-left:15px;}
	#header .hd-menu .gnb-wrap .gnb { margin-left:-4.5em;} 
	#header .hd-menu .gnb-wrap .gnb > li .depth > ul > li > a { padding:0.5em; font-size:1.6rem;} 
	#header.on .hd-menu .gnb-wrap .gnb > li { width:140px;}
	#header.on .hd-menu .gnb-wrap .gnb > li:first-child { width:190px;}  
} 

@media all and (max-width: 1240px){
    html { font-size:55%;}

    #header { height:70px;  }
	#header:after {display:none !important;}
	#header .hd-logo {position:relative; display:flex; align-items:center; top:auto; left:auto; height:70px; padding-left:16px;}
	#header .hd-logo a { padding-left:90px; width:auto; background-size:90px; background-position:left top 2.5px; height:auto;}
	#header .hd-logo .hide { display:inline-block;   }
	#header .hd-logo .hide span{display:none;}

	#header .hd-info { right:16px; top:20px }
    #header .hd-info .hd-text { display:none;}
    #header .hd-info .hd-lang .btn-lang { margin-left:20px; margin-right:20px;}
    #header .hd-info .hd-lang ul { margin-left:0;}
	#header .hd-info .hd-allmenu-open { display:block; position:relative; z-index:6000; width:25px; height:20px; cursor: pointer;}	
    #header .hd-info .hd-search .search-wrap .btn-search-close { top:310px;}

    #header .hd-menu { opacity:0; visibility:hidden; position:fixed; left:0; top:0; padding-left:0; max-width:none; width:100%; height:100%;  
		-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		-ms-transition: all 0.2s;
		-o-transition: all 0.2s;
		transition: all 0.2s;    
    }
	#header .hd-menu .hd-mak{position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5);}
	#header .hd-menu .gnb-wrap { position: fixed; right:-100%;  top:0; margin: 0; padding: 0; padding-top:70px; z-index:5000; max-width:none; min-width:300px; width: 50%; height: 100%; background-color: #fff;
		-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		-ms-transition: all 0.2s;
		-o-transition: all 0.2s;
		transition: all 0.2s;
	}	
    #header .hd-menu .gnb-wrap .gnb { display:block; overflow-y:scroll; padding:0 0 80px; margin-left:0; width:100%; height:100%; -ms-overflow-style: none; scrollbar-width: none; scroll-behavior: smooth;}
    #header .hd-menu .gnb-wrap .gnb::-webkit-scrollbar { display: none;}
    #header .hd-menu .gnb-wrap .gnb > li { display:block; padding:0 !important; width:100%; height:auto;  }
	#header .hd-menu .gnb-wrap .gnb > li.open > a{color: #38b800;}
	#header .hd-menu .gnb-wrap .gnb > li.open > a:after{border-color:#38b800}
	#header .hd-menu .gnb-wrap .gnb > li:not(:first-child) .depth > ul > li:hover > a,
	#header .hd-menu .gnb-wrap .gnb > li .depth2 > li > a:hover{text-decoration:none;} 
    #header .hd-menu .gnb-wrap .gnb > li > a { display:block; position:relative; padding:22px; color:#666 ;   font-size:18px; text-align:left;}
	#header .hd-menu .gnb-wrap .gnb > li > a:after { content:""; position:absolute; right:20px; top:35px; width:8px; height:8px; border-left:2px solid #999; border-top:2px solid #999;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		-ms-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		-webkit-transform:rotate(225deg);
		-moz-transform:rotate(225deg);
		-ms-transform:rotate(225deg);
		-o-transform:rotate(225deg);
		transform:rotate(225deg);
		-webkit-transform-origin:0 0;
		-moz-transform-origin:0 0;
		-ms-transform-origin:0 0;
		-o-transform-origin:0 0;
		transform-origin:0 0;
	}  
	#header .hd-menu .gnb-wrap .gnb > li .depth:before,
	#header .hd-menu .gnb-wrap .gnb > li .depth:after { display:none !important;}
    #header .hd-menu .gnb-wrap .gnb > li .depth { opacity:1; visibility:visible; display:none; position:static; padding:10px 20px; background:#fafafa; margin-bottom:10px;} 
    #header .hd-menu .gnb-wrap .gnb > li .depth li a { padding:7px 10px; text-align:left !important;}
    #header .hd-menu .gnb-wrap .gnb > li .depth > ul > li > a { padding:7px 10px; font-size:15px; justify-content:start}
	#header .hd-menu .gnb-wrap .gnb > li .depth > ul > li.on > a  {  color: #38b800;}
    #header .hd-menu .gnb-wrap .gnb > li:nth-child(1) .depth > ul > li > a:after { position:absolute; right:3px; top:7px; margin:0;} 
    #header .hd-menu .gnb-wrap .gnb > li .depth2 { padding: 0.5em 0 2em; }
    #header .hd-menu .gnb-wrap .gnb > li .depth2 > li > a { font-size:15px;}
	#header .hd-menu .gnb-wrap .gnb > li .depth2 > li.on > a{color: #38b800;}
    #header .hd-menu .gnb-wrap .gnb > li .depth > ul > li > a > span:before { display:none !important;}

    #header.menu-open .hd-menu { opacity:1; visibility:visible;}
	#header.menu-open .hd-menu .gnb-wrap { right:0;}
	#header.menu-open .btn-menu { top:8px;
		-webkit-transform: rotate(180deg);
		-moz-transform: rotate(180deg);
		-ms-transform: rotate(180deg);
		-o-transform: rotate(180deg);
		transform: rotate(180deg);
		-webkit-transition: transform 0.2s ease;
		-moz-transition: transform 0.2s ease;
		-ms-transition: transform 0.2s ease;
		-o-transition: transform 0.2s ease;
		transition: transform 0.2s ease;
	}
	#header.menu-open .btn-menu:before { width: 8px; top:0; right: 20px;
		-webkit-transform: rotate(-45deg) translateX(5px);
		-moz-transform: rotate(-45deg) translateX(5px);
		-ms-transform: rotate(-45deg) translateX(5px);
		-o-transform: rotate(-45deg) translateX(5px);
		transform: rotate(-45deg) translateX(5px);
		-webkit-transition: transform 0.2s ease;
		-moz-transition: transform 0.2s ease;
		-ms-transition: transform 0.2s ease;
		-o-transition: transform 0.2s ease;
		transition: transform 0.2s ease;
	}
	#header.menu-open .btn-menu:after { width: 8px; top:0; right: 20px;
		-webkit-transform: rotate(45deg) translateX(5px);
		-moz-transform: rotate(45deg) translateX(5px);
		-ms-transform: rotate(45deg) translateX(5px);
		-o-transform: rotate(45deg) translateX(5px);
		transform: rotate(45deg) translateX(5px);
		-webkit-transition: transform 0.2s ease;
		-moz-transition: transform 0.2s ease;
		-ms-transition: transform 0.2s ease;
		-o-transition: transform 0.2s ease;
		transition: transform 0.2s ease;
	}
	#header.menu-open .btn-menu, 
	#header.menu-open .btn-menu:before, 
	#header.menu-open .btn-menu:after { background-color:#666 !important; }
	#header.menu-open .hd-info .hd-search .btn-search-open { background-image:url(/images/ico/ico-search-on.png) !important;}
	#header.menu-open .hd-info .hd-lang .btn-lang { background-image:url(/images/ico/ico-lang-on.png) !important;}
    #header.menu-open .hd-info .hd-lang .btn-lang:after { border-top:5px solid #666 !important;}
    #header.menu-open .hd-logo a{ background-image:url(/images/common/logo.png) !important;}
    #header.menu-open .hd-logo .hide {background-image:url('/images/common/logo-ko-cpn-m.png');}	
	 
	#header .hd-menu .gnb-wrap .gnb{height:calc(100% - 140px);         padding: 0;}
	#header .left-link{position:relative; bottom:0; left:0; top:auto; max-width:100%; opacity:1; visibility:visible; border-top: 1px solid #e8e8e8;  padding : 22px;  }
	#header .left-link a {  font-size: 14px; width: auto;gap:5px;}
	#header .left-link a i{width:12px;   }


    #header.on .hd-menu .gnb-wrap .gnb > li { width:auto !important;}

    #footer .ft-btm .ft-info { padding:0;}
    #footer .ft-btm .ft-info .maxinner { flex-wrap:wrap; padding:2em 0;}
    #footer .ft-btm .ft-info .maxinner .left { width:100%;}
    #footer .ft-btm .ft-info .maxinner .right { margin-top:1em; max-width:240px; width:100%;}
    #footer .ft-btm .ft-info .left ul { flex-wrap:wrap;}
    #footer .ft-btm .ft-info .left ul > li { padding:0 20px 0 0 !important; margin:10px; text-align:center;}
    #footer .ft-btm .ft-info .left ul > li:after { right:-5px;}
    #footer .ft-btm .ft-copy h2 a { width:90px; background-size:90px;}
    #footer .ft-btm .ft-copy p { margin-left:2.5em;}

    #footer .ft-top { display:none;}
    #footer.open .ft-btm .ft-country { height:182px;}
}


@media all and (max-width:767px){
    html { font-size:53%;}
 
	#header .hd-menu .gnb-wrap .gnb > li > a { padding:15px 22px;}
	#header .hd-menu .gnb-wrap .gnb > li > a:after { top:26px; right:22px;}
	#header .hd-menu .gnb-wrap .gnb > li.open > a:after { top:18px;}
	
	#header .hd-info .hd-lang .btn-lang { margin-left:20px; margin-right:15px;}
	#header .hd-info .hd-search .search-wrap form { height:150px;} 
	#header .hd-info .hd-search .search-wrap .btn-search-close { top:150px; margin-top:-30px; width:60px; height:60px;}
	#header .hd-info .hd-search .search-wrap .search-form { padding-right:60px; min-width:auto; margin:0 5%; width:90%; font-size:1.8rem;}

    #header .hd-menu .gnb-wrap .gnb > li:nth-child(1) .depth > ul > li > i { top:10px;}
    #header .hd-menu .gnb-wrap .gnb > li:nth-child(1) .depth > ul > li > a:after { top:7px;}
    
	#footer .ft-top { display:none;}
	#footer .ft-btm .ft-info .left ul > li { padding-right:12px !important; margin:10px 3px; }
	#footer .ft-btm .ft-info .left ul > li > a.btn-company { padding-right:20px;}
	#footer .ft-btm .ft-info .left ul > li:after { right:0;}
    #footer .ft-btm .ft-copy .maxinner { padding:2.5em 0;}
    #footer .ft-btm .ft-info .right .site-wrap ul li a { font-size:1.5rem;}

    #footer .ft-btm .ft-country .maxinner > div { flex-wrap:wrap;}
    #footer .ft-btm .ft-country h2 { margin:5px 0 7px; width:100%; line-height:1.438em;}
    #footer .ft-btm .ft-country ul { margin-left:-20px; width:100%;}
    #footer .ft-btm .ft-country ul li { margin-left:20px;}
    #footer.open .ft-btm .ft-country { padding:3em 0;height:auto ;}

}


@media all and (max-width:480px){
    #header .hd-info .hd-search .search-wrap .search-form { min-width:auto;} 
    .btn-viewmore:hover .arrow:after, 
    .btn-viewmore:hover .arrow:before,
    .btn-viewmore .arrow svg { display:none;}
}

@media all and (max-width:370px){ 
    #header .hd-info .hd-lang .btn-lang { padding-right:33px; margin-left:15px; margin-right:12px;} 
}

 



/* ------------------------------- */

/* ----- RESPONSIVE(+ADD EN) ----- */


.en #header .hd-info .hd-lang .btn-lang {margin-left:20px;}
.en #header .hd-info .hd-text  {width:150px; height:20px; background-image:url('/images/common/logo-en-w.png'); background-repeat:no-repeat; background-position:left top; background-size:contain; margin-left:20px; margin-top:2px}
.en #header .hd-menu .gnb-wrap .gnb > li .depth:before{height:360px;}
.en #header.on{height:520px;}  
.en #header.on .hd-info .hd-text  { background-image:url('/images/common/logo-en.png');background-repeat:no-repeat; background-position:left top; background-size:contain; }
.en #header.reverse .hd-info .hd-text{ background-image:url('/images/common/logo-en.png') ;background-repeat:no-repeat; background-position:left top; background-size:contain; }
.en #header .hd-logo .hide{width:150px; height:20px; background-image:url('/images/common/logo-en-w.png'); background-position-x:-42px;}
.en #header.reverse .hd-logo .hide{ background-image:url('/images/common/logo-en.png');}
.en #header.menu-open .hd-logo .hide{background-image:url('/images/common/logo-en-w.png');}
.en #header.on .hd-logo .hide { background-image:url('/images/common/logo-en.png');}


@media all and (max-width:1850px){
	/*
	.en #header .hd-info .hd-text {display: none;} 
	.en #header .hd-logo .hide { display: inline-block;}
    .en #header .hd-logo a {
        padding-left: 121px;
        background-size: 121px;
    }
    */
}
@media all and (max-width:1600px){
	/*
	.en #header .hd-logo{top:32px}
	.en #header .hd-logo a {
		padding-left: 90px;
		width: auto;
		background-size: 90px;
		background-position: left top 2.5px;
		height: auto;
	}
	*/
} 
@media all and (max-width:1240px){   
	
	.en #header .hd-logo {top:auto} 
    .en #header .hd-logo .hide {width:100px; margin-top:3px;}
    .en #header.on .hd-logo .hide { background-image:url('/images/common/logo-en-w.png');}
    
} 
@media all and (max-width:360px){
	

}

/* ------------------------------- */