@charset "utf-8";
/*{word-break: keep-all;}*/
*{word-break: auto-phrase !important;}

/* /////////////////// 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;}
.spaces{padding:1em 0;}
.water-epc .maxinner {text-align: center;} 

/* /////////////////// right  ///////////////////  */

.right_fixed {
    position: fixed;
    top: 40%;
    right: 1%;
    z-index: 99;
    /*box-shadow: 2px 2px 30px rgba(0,0,0,0.1);*/
    border-radius: 40px;
}
.right_fixed .sns-list { }
.right_fixed .sns-list li {margin-top:8px; padding-left: 6px;}
.right_fixed .sns-list li a { display:flex; justify-content:center; border: 1px solid #d9d9d9; align-items:center; width:2.188em; height:2.188em; border-radius:50%; background:#fff; font-size:1.6rem; color:#000; transition:all ease .3s; }
.right_fixed .sns-list li:nth-child{5}{background:#f8b500 !important;}
.right_fixed .sns-list li a:hover { color:#585858;}
.right_fixed .rma a{display:flex; justify-content:center; margin-top:10px;  align-items:center; width:5.5em; height:5.5em; border-radius:50%; background:#f8b500; font-size:1.2em; font-weight:600; font-w color:#000; transition:all ease .3s;}

@media (max-width: 767px){

	.pc-br { display:none;}
.right_fixed{display:none;}
}





.height_1{height:0.8em;}

/* ----- 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:1.2em; font-weight:600; line-height: 180%;}

 
.btn.btn-go-arrow {
    clear: both;
    background-color: transparent;
    display: inline-block;
    border: none;
    position: relative;
    color: #000;
    height: auto;
    padding: .7em 2em .7em 1em;
    margin-top: 20px;
    transition: all .3s;
    outline: none;
}

.btn.btn-go-arrow:hover,
.btn.btn-go-arrow:focus {
    padding-right: 3.8em;
    box-shadow: none;
}

.btn.btn-go-arrow::before,
.btn.btn-go-arrow::after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #000;
    position: absolute;
    bottom: 8px;
    left: 0;
}



.btn.btn-go-arrow::after {
    left: auto;
    right: -5px;
    bottom: 5px;
    transform: translate(0, -50%) rotate(45deg);
    width: 50px;
	
}

 
.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;}


@media all and (max-width: 767px){
.btn.btn-go-arrow {
    clear: both;
    background-color: transparent;
    display: inline-block;
    border: none;
    position: relative;
    color: #000;
    height: auto;
    padding: .7em 2em .7em 1em;
    margin-top: 20px;
    transition: all .3s;
    outline: none;
}

.btn.btn-go-arrow:hover,
.btn.btn-go-arrow:focus {
    padding-right: 3.8em;
    box-shadow: none;
}

.btn.btn-go-arrow::before,
.btn.btn-go-arrow::after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #000;
    position: absolute;
    bottom: 13px;
    left: 0;
}



.btn.btn-go-arrow::after {
    left: auto;
    right: -3px;
    bottom: 6px;
    transform: translate(0, -50%) rotate(45deg);
    width: 30px;
	
}

   
    .btn-viewmore strong { padding-right:0; font-size:15px;}
    .btn-viewmore .arrow { display:none;}
	
}


/*///////////2023.11 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; top:20px; z-index:6000; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#header .hd-logo a { display:block; width:120px;  height:49px; background:url(../img/logo_w.png) no-repeat center; background-size:100%; } 
#header .hd-logo .hide { 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 .gnb{vertical-align:middle;text-align:center;}
#header .gnb>ul{}
#header .gnb>ul>li{position:relative;display:inline-block;vertical-align:top; }
#header .gnb>ul>li>a{display:inline-block;vertical-align:top;font-size:1.8rem; line-height:6;letter-spacing:-0.03em;color:#fff;padding:0 10px;box-sizing:border-box; transition:0.4s;}
#header.hs .gnb>ul>li>a{color:#666;}
#header .gnb>ul>li>ul{display:none;position:absolute;top:110px;left:0;text-align:center;background:#fff;width:100%;padding:20px 0;border-radius: 10px; box-shadow:2px 2px 20px rgba(0,0,0,0.1);}
#header .gnb>ul>li>ul>li{}
#header .gnb>ul>li>{}
#header .gnb>ul>li:nth-child(1){min-width:180px;}
#header .gnb>ul>li:nth-child(2){min-width:180px;}
#header .gnb>ul>li:nth-child(3){min-width:180px; margin-right:210px;}
#header .gnb>ul>li:nth-child(4){min-width:180px; margin-left:100px;}
#header .gnb>ul>li:nth-child(5){min-width:180px;}
#header .gnb>ul>li:nth-child(6){min-width:180px;}
#header .gnb>ul>li>ul>li>a{display:inline-block;vertical-align:top;width:100%; font-size:1.5rem; color:#666; letter-spacing:-0.04em; line-height: 1.4; padding:6px 0;}
#header .gnb>ul>li>ul>li:hover>a{color:#1c588a;}
.header.hs .gnb>ul>li>a, .header.on .gnb>ul>li>a {color: #222;}
@media all and (max-width: 1600px){
#header .gnb>ul>li:nth-child(1){min-width:130px;}
#header .gnb>ul>li:nth-child(2){min-width:130px;}
#header .gnb>ul>li:nth-child(3){min-width:130px; margin-right:210px;}
#header .gnb>ul>li:nth-child(4){min-width:130px; margin-left:100px;}
#header .gnb>ul>li:nth-child(5){min-width:130px;}
#header .gnb>ul>li:nth-child(6){min-width:130px;}
}

/*///////////2023.11////////////*/
@media all and (max-width: 1279px){
	#header .gnb>ul>li{width:100%;}
#header .gnb>ul>li>a{display:inline-block;vertical-align:top;font-size:2.2rem; line-height:3;letter-spacing:-0.03em;color:#000;/*padding:0 50px;*/box-sizing:border-box; transition:0.4s;}	
#header .gnb>ul>li:nth-child(3){margin-right:0 !important;}
#header .gnb>ul>li:nth-child(4){margin-left:0 !important;}	
#header .gnb .depth {
    opacity: 1;
    visibility: visible;
    display: none;
    position: static;
    padding: 10px 20px;
    background: #fafafa;
    margin-bottom: 10px;
	border-top:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
}
#header .gnb>ul>li>ul>li>a {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    font-size: 2rem;
    color: #666;
    letter-spacing: -0.04em;
    line-height: 1.4;
    padding: 6px 0;
}
#header .gnb>ul>li>ul {
    display: none;
    position: absolute;
    top: 110px;
    left: 0;
    text-align: center;
    background: #fff;
    width: 100%;
    padding: 20px 0;
    border-radius: 0px;
    box-shadow: 0px 0px 0px rgba(0,0,0,0.1);
}
}

@media all and (max-width: 767px){
#header .gnb>ul>li{width:100%;}
#header .gnb>ul>li>a{display:inline-block;vertical-align:top;font-size:2.2rem; line-height:3;letter-spacing:-0.03em;color:#000;/*padding:0 50px;*/box-sizing:border-box; transition:0.4s;}	
#header .gnb>ul>li:nth-child(3){margin-right:0 !important;}
#header .gnb>ul>li:nth-child(4){margin-left:0 !important;}	
#header .gnb .depth {
    opacity: 1;
    visibility: visible;
    display: none;
    position: static;
    padding: 10px 20px;
    background: #fafafa;
    margin-bottom: 10px;
	border-top:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
}
#header .gnb>ul>li>ul>li>a {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    font-size: 2rem;
    color: #666;
    letter-spacing: -0.04em;
    line-height: 1.4;
    padding: 6px 0;
}
#header .gnb>ul>li>ul {
    display: none;
    position: absolute;
    top: 110px;
    left: 0;
    text-align: center;
    background: #fff;
    width: 100%;
    padding: 20px 0;
    border-radius: 0px;
    box-shadow: 0px 0px 0px rgba(0,0,0,0.1);
}
}

/*///////////검색////////////*/


#header .hd-info { display:flex; align-items:center; position:absolute; right:60px; 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(../img/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:125px; z-index:10; margin-top:-40px; width:70px; height:70px; background:#262626; 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:3rem; 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;  margin-left:40px;border:none;width:30px; height:30px; background:url(../img/ico-lang.png) no-repeat left center;}
#header .hd-info .hd-lang ul { opacity:0; visibility:hidden; position:absolute; left:50%; top:100%; z-index:1000; margin-top:10px; margin-left:15px; 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-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 - reverse ----- */
#header.reverse { background:#fff; border-bottom:1px solid #dddddd;}
#header.reverse .hd-logo a { background-image:url(../img/logo_c.png);}
#header.reverse .hd-menu .gnb > li > a {  color:#666666;}
#header.reverse .gnb>ul>li>a{color:#666666;}
#header.reverse .hd-info .hd-search .btn-search-open { background-image:url(../img/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(../img/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 > 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:12px; 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:3em 0 6em 0;}
#footer .ft-btm .ft-copy h2 { display:inline-block; vertical-align:middle; margin-bottom:2.5em;}
#footer .ft-btm .ft-copy h2 a { display:block; width: 115px;  height: 38px; background: url(../img/footer_logo.png) no-repeat center; background-size: 100%;}

#footer .ft-btm .ft-copy p { display:block;  margin-top:0.5em; font-size:1.4rem; color:#939393; vertical-align:middle;}
#footer .ft-btm .ft-copy p br{display:none;}

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









@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; transform: translate(0, 0);} 
	#header .hd-logo a { padding-left:90px; width:auto; background-size:90px; background-position:left top 12px; }
	#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.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-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:90px; margin-top:-30px; width:40px; height:40px;}
	#header .hd-info .hd-search .search-wrap .search-form { padding-right:60px; min-width:auto; margin:0 5%; width:70%; 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:2em 0; text-align:center;}
	#footer .ft-btm .ft-copy .maxinner h2{ text-align:center;}
    #footer .ft-btm .ft-info .right .site-wrap ul li a { font-size:1.5rem;}
	#footer .ft-btm .ft-copy p br{display:block;}
	#footer .ft-btm .ft-copy p {line-height:180%; }
    #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;} 
}

 





.scroll-down2{position: absolute;
    left:50%; 
	bottom:-10%; 
	z-index:10;
    width: 1px;
    height: 150px;
    background: rgba(255,255,255,0.3);

	-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: scrollDown3 2s infinite;
	-moz-animation: scrollDown3 2s infinite;
	-ms-animation: scrollDown3 2s infinite;
	-o-animation: scrollDown3 2s infinite;
	animation: scrollDown3 2s infinite;
}

.scroll-down2:before {
    content: "";
    position: absolute;
    bottom: 100%;
    width: 1px;
    height: 40px;
    background: #fff;

}

 /* ----- scroll down ----- */
.scroll-down { position: absolute; bottom:40px; left:50%; 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:90px; width:100px; font-size:12px; color:#fff; letter-spacing:1px; font-weight:200; 
	-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: "\e943"; position: absolute; top: 50%; left: 50%; width:14px; height:14px;  font-size: 2em; color:#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: "\e905"; position: absolute; top: 50%; left: 50%;  width:14px; height:14px;   font-size: 1.5em; color:#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;
}