@charset "utf-8";

/************************  reset ************************/ 
body {font:1em "NanumSquareNeo",Verdana,Dotum,AppleGothic,sans-serif; outline:0; color:#222; overflow-x:hidden; font-weight:400;}
h1, h2, h3, h4, h5, h6 {font:1em "NanumSquareNeo",Verdana,Dotum,AppleGothic,sans-serif;}
a {color:inherit;}
input:focus, select:focus, option:focus, textarea:focus, button:focus{
	outline: none;
}

select {appearance:none; -webkit-appearance:none; background:url('../img/common/selectArrow.png') calc(100% - 10px) center #fff no-repeat !important;}
select::-ms-expand { display:none;}

.container {position:relative; width:1540px; margin:0 auto;}
#hd {min-width:auto;}
#sub .container {width:1440px;}

	@media screen and (max-width:1599px){
		#sub .container {width:100%; padding:0 50px;}
		.container {width:100%; padding:0 50px;}
	}

	@media screen and (max-width:999px){
		#sub .container {width:100%; padding:0 3%;}
		.container {width:100%; padding:0 3%;}
	}



/************************ header ************************/ 
.sec-header {position:absolute;top:0;left:0;width:100%;height: 170px;z-index: 9999;transition:all ease .5s;background:#fff;}
.sec-header .container {position:relative;width:100%;padding: 0 90px;top:0;}

.sec-header .pc_hd {}
.sec-header .m_hd {display:none;}

.sec-header .hd_top {display:flex; min-height:100px; justify-content:space-between;}

/* sns */
.sec-header .sns {display:flex; justify-content:flex-start; gap:20px; margin-top:70px;}
.sec-header .sns li a {display:block; width:25px; height:25px; background-size:contain; background-position:center; background-repeat:no-repeat; font-size:0;}
.sec-header .sns li:nth-child(1) a {background-image:url('../img/common/icon_youtube.png');} 
.sec-header .sns li:nth-child(2) a {background-image:url('../img/common/icon_instagram.png');} 
.sec-header .sns li:nth-child(3) a {background-image:url('../img/common/icon_facebook.png');} 

/* logo */
.logo{display:block; margin-top:45px; background: url('../img/common/logo.png') center no-repeat;font-size:0;width:217px;height:50px;background-size:contain;}

/* language */
.lang_box {position:relative;display:flex;justify-content:center;align-items:center;margin-top:70px;width:80px;min-height: 30px;font-weight: 500;font-size:18px;text-transform:uppercase;border:1px solid #696969;border-radius:30px;font-family: 'Montserrat', sans-serif;}
.lang_box .btnLang{position:relative;display:block;border:0;color: #000;cursor:pointer; text-align:center; padding-right:20px;}
.lang_box .btnLang:before{position:absolute;content:'';width: 0px;height: 0px;border-right: 5px solid transparent;border-top: 5px solid #000;border-left: 5px solid transparent; right:0; top:calc(50% - 3px);}
.lang_box .btnLang.on:before {transform:rotate(180deg);}
.lang_box .lang{position:absolute;opacity:0;top:15px;padding:10px 0;width: 80px;border-radius: 10px;text-align:center;display:block;background:#0a0e13;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;pointer-events:none;z-index:20;left: 0;}
.lang_box .lang.on{opacity:1;top: 32px;pointer-events:auto;}
.lang_box .lang span {text-transform:uppercase;}
.lang_box .lang span a{display:block;padding:4px 0;font-size:16px;color:#fff; font-weight:400;}
.lang_box .lang span a:hover{color:#E9B358;font-weight:500}

/* gnb-pc */
#gnb {position:relative; width:100%; background:transparent;}
#gnb > ul {display:flex; justify-content:center; width:100%;} 
#gnb > ul > li {position:relative;padding:0 35px; height:70px; display:flex; align-items:center;} 
#gnb > ul > li > a{display:block;position:relative;font-size:20px;color: #000;font-weight: 600;text-align:center;}
#gnb > ul > li a span {position:relative; display:inline-block;}
#gnb > ul > li > ul{position: fixed;justify-content:center;align-items:center;top:170px;left:0;width:100%;height:70px;background:#f9f9f9;border-top:1px solid #ddd;border-bottom:1px solid #ddd;transition:all ease .3s;z-index: 9999;opacity:0;display:none;}
#gnb > ul > li > ul > li {position:relative;padding:0 16px;height: 100%;}
#gnb > ul > li > ul > li:not(:first-child):before {position:absolute; display:block; content:'·'; top:50%; left:-1px; transform:translateY(-50%)}
#gnb > ul > li > ul > li > a{position:relative;display:block;font-size:14px;text-align:center;height: 100%;}
#gnb > ul > li > ul > li > a span {position:relative;height: 100%;display: flex;align-items: center;}
#gnb > ul > li > ul > li > a span:after {transform:scaleX(0);position: absolute;bottom: -1px;display:block;width:100%;height:3px;background:#E9B45B;transition: 0.2s all ease-out;content:'';}
#gnb > ul > li > ul > li > a:hover{font-weight:600;}
#gnb > ul > li > ul > li > a:hover span:after {transform:scaleX(1);}
#gnb > ul > li:hover > ul { opacity:1; display:flex;}

.sec-header.fixed {position:fixed; height: 80px;}
.sec-header.fixed .hd_top {position:absolute; width: calc(100% - 180px); align-items: center;min-height: 80px;}
.sec-header.fixed .sns {margin:0; z-index:9;}
.sec-header.fixed .logo {display:none;}
.sec-header.fixed .lang_box {margin:0; z-index:9;}
.sec-header.fixed #gnb > ul > li {height: 80px;}
.sec-header.fixed #gnb > ul > li:hover > ul {top:80px;}

	
	@media screen and (max-width:1599px){		
		.sec-header .container {padding:0 50px;}
		.sec-header.fixed .hd_top {width: calc(100% - 100px);}
	}
	
	@media screen and (max-width:1419px){
		.sec-header {height:155px;}
		.sec-header .container {}
		
		.sec-header .hd_top {min-height: 80px;}
		
		.logo{width: 190px;margin-top: 35px;}
		.sec-header .sns, .lang_box {margin-top: 55px;}
		
		#gnb {}
		#gnb > ul > li > a {font-size:17px;}
		#gnb > ul > li a span:after {bottom:-40px;}
		#gnb > ul > li > ul {top:155px;}
		#gnb > ul > li > ul > li > a {font-size:16px;}
	}
	
	@media screen and (max-width: 999px){
		.sec-header {padding:0;height: 80px;}
		.sec-header .container {width:100%; padding: 0 3%;}
		
		.sec-header .pc_hd {display:none;}
		.sec-header .m_hd {display: flex;align-items: center;height: 100%;justify-content: space-between;}

		.sec-header .sns {position: absolute;margin: 0;justify-content: center;left: 50%;bottom: 50px;gap:30px;transform: translateX(-50%);}
		
		.logo {background:url('../img/common/logo.png') center no-repeat;background-size:contain;margin-top: 0;width: 150px;}
		.sec-header.fixed .logo {display: block;}
	
		.hd-lang{display:block; position:absolute; top:43px; right:200px; display:flex; flex-direction:row; justify-content:space-between;}
		.hd-lang:before{content:''; width:14px; height:14px; background:url('../img/common/lang_icon.png') no-repeat 0 0; display:inline-block; margin:0 10px; vertical-align:middle; margin-bottom:2px;}
		.hd-lang span,
		.hd-lang a{font-size:14px; display:block; margin-left:20px; line-height:1; position:relative; text-transform:uppercase;}
		.hd-lang span.on,
		.hd-lang a.on {color:#E9B358;}
		.hd-lang span.on:after,
		.hd-lang a.on:after {position:relative; display:block; width:100%; height:1px; background:#E9B358; left:0; margin-top:4px;}
		.hd-lang span:first-child,
		.hd-lang a:first-child {margin-left:0;}
		.hd-lang span:before,
		.hd-lang a:before{content:''; width:1px; height:12px; background:#aaa; position:absolute; left:-10px; top:1px; }
		.hd-lang span:first-child:before,
		.hd-lang a:first-child:before {display:none;}


		/* gnb-m */
		.gnb-btn{display:block;z-index: 100;overflow: hidden;}
		.gnb-btn button{width: 35px;height: 35px;border:0;background:inherit;}  
		.gnb-btn:hover #nav-icon.open span:nth-child(6){width:50%;}
		
		#nav-icon {width:24px; height:24px; position:relative; margin:0 auto; -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg); -o-transform:rotate(0deg); transform:rotate(0deg); /* -webkit-transition:.5s ease-in-out; -moz-transition:.5s ease-in-out; -o-transition:.5s ease-in-out; transition:.5s ease-in-out; */ cursor:pointer;}
		#nav-icon span {display:block;position:absolute;height:2px;width:50%;background: #000;opacity:1;webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out;}
		#nav-icon span:nth-child(even) {left:50%;}
		#nav-icon span:nth-child(odd) {left:0px;}
		#nav-icon span:nth-child(1){width:0; right:50%; left:auto;}
		#nav-icon span:nth-child(1), #nav-icon span:nth-child(2) {top:4px;}
		#nav-icon span:nth-child(3), #nav-icon span:nth-child(4) {top:12px;}
		#nav-icon span:nth-child(5), #nav-icon span:nth-child(6) {top:20px;}
		
		#nav-icon.open{width:35px; height:35px;}
		#nav-icon.open span:nth-child(1),#nav-icon.open span:nth-child(6) {-webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg);}
		#nav-icon.open span:nth-child(2),#nav-icon.open span:nth-child(5) {-webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg);}
		#nav-icon.open span:nth-child(1) {left:3px; top:11px; width:50%; right:auto;}
		#nav-icon.open span:nth-child(2) {left:calc(50% - 3px); top:11px; left:15px;}
		#nav-icon.open span:nth-child(3) {left:-50%;opacity:0;}
		#nav-icon.open span:nth-child(4) {left:100%; opacity:0;}
		#nav-icon.open span:nth-child(5) {left:3px; top:23px;}
		#nav-icon.open span:nth-child(6) {left:15px; top:23px;} 
		#nav-icon.open span{background:#000;}

		.scr-none{overflow-y:hidden;}
		.gnb-all{position:fixed;top:0;right:-100%;width:100%;height:100%;background:#fff;max-width:400px;overflow-y: auto;padding: 40px 20px 105px;transition:all ease .6s;display:block;z-index:99;}
		.gnb-all.open{right:0;box-shadow: 0 0 60px 0 rgba(0,0,0,0.2);} 
		.gnb-all > ul.allMenu {padding:0;background:none;box-shadow:none;width: 100%;margin: 0 auto;}
		.gnb-all > ul.allMenu > li{padding:0;min-height:inherit;width: 100%;border-bottom: 1px solid #e8e8e8;}
		.gnb-all > ul.allMenu > li:last-child{border-bottom:1px solid #e8e8e8;}
		.gnb-all > ul.allMenu > li > h3{position:relative;padding:17px 10px;color:#333;font-size:16px;margin:0;cursor:pointer;font-weight:500;}
		.gnb-all > ul.allMenu > li:hover > h3 {color:#E9B358;}
		.gnb-all > ul.allMenu > li > h3 > span.bul {display:block;position:absolute;top:15px;right:20px;background:#888;transition:all .5s;width:2px;height:20px;margin:0;}
		.gnb-all > ul.allMenu > li:hover > h3 > span.bul {background:#E9B358; transition:all .5s;width:2px;}
		.gnb-all > ul.allMenu > li > h3 > span.bul:after {content:"";display:block;position:absolute;top:0;width:20px;height:2px;margin:9px 0 0 -9px;background:#888;}
		.gnb-all > ul.allMenu > li:hover > h3 > span.bul:after  {background:#E9B358;}
		.gnb-all > ul.allMenu > li > h3.on {color:#E9B358;}
		.gnb-all > ul.allMenu > li > h3.on > span.bul {background:#E9B358; transform: translateY(0) rotate(-450deg);}
		.gnb-all > ul.allMenu > li > h3.on > span.bul:after {opacity:0;}
		.gnb-all > ul.allMenu > li > ul{display:none;padding: 10px 10px 15px;background: #fffaf2;}
		.gnb-all > ul.allMenu > li > ul > li > a{display: block;position: relative;font-size:15px;padding:8px 0;color: #444;}
		.gnb-all > ul.allMenu > li > ul > li > a:before {position:relative; display:inline-block; margin-right:10px; content:'-';}
		.gnb-all > ul.allMenu > li > ul > li > a:after {display:none;}
		.gnb-all .hd-lang{display:flex; justify-content: flex-start; position:relative; top:auto; right:auto; left:0; margin:20px 0 10px;}
		
	}
	
	@media screen and (max-width:799px){
		.sec-header{height:70px;}
		.sec-header.fixed {height:70px;}
	
		.logo {width:120px;}
		.logo img {height:39px;}
	
		#nav-icon.open{width:35px; height:35px;}
		#nav-icon.open span:nth-child(1) {top:10px;}
		#nav-icon.open span:nth-child(2) {top:10px;}
		#nav-icon.open span:nth-child(3), #nav-icon.open span:nth-child(4) {top:16px;}
		#nav-icon.open span:nth-child(5) {top:22px;}
		#nav-icon.open span:nth-child(6) {top:22px;}
	}
	
	@media screen and (max-width:599px){
	}
	
	@media screen and (max-width:499px){
	}





 
/************************ media size setting end ************************/



/************************ footer ************************/

.sec-footer {background:#3A3A3C; font-size:16px; color:#fff; padding:75px;}
.sec-footer * {word-break:keep-all;}
.footerTop .container {width: 100%;max-width: 1440px;border-bottom:1px solid rgba(255,255,255,.25);display:flex;padding-bottom: 20px !important;margin-bottom:30px;}
.footerTop .tit {font-size:20px; font-weight:600;}
.footerTop p {font-size:18px; margin:20px 0 15px;}
.footerTop .flogo {font-size:20px; margin-right:70px;}
.footerTop .flogo .copyLogo {display:block;overflow:hidden;width:130px;height:30px;background:url('../img/common/copyLogo.png') center no-repeat;background-size: contain;}
.footerTop .cs {min-height:150px;border-left:1px solid rgba(255,255,255,.25);border-right:1px solid rgba(255,255,255,.25);padding: 0 50px;min-width: 350px;}
.footerTop .cs .info {}
.footerTop .cs .info li {font-size:14px; padding-bottom:5px;}
.footerTop .inquiry {padding-left: 50px;}
.footerTop .inquiry p {font-size:14px;}
.footerTop .inquiry .btn {display:flex;padding: 0;height: auto;line-height: inherit; gap:10px;}
.footerTop .inquiry .btn li a {font-size:12px;display: block;line-height: 40px;width:180px;height: 40px;border:1px solid #666;font-weight:400;transition-duration:.3s;}
.footerTop .inquiry .btn li:hover a {background:rgba(255,255,255,0.05);}

.footerInfo {}
.footerInfo .container {position:relative; width:100%; max-width:1440px;}
.footerInfo .copyInfo {}
.footerInfo .copyInfo .tit {font-size:20px; font-weight:600; margin-bottom:20px; display:block;}
.footerInfo .copyInfo .text{font-weight:400;position:relative;line-height: 1.5;}
.footerInfo .copyInfo .tel,
.footerInfo .copyInfo .fax {display:inline-block;}
.footerInfo .copyInfo .tel {position:relative;padding-right: 30px;margin-right:25px;}
.footerInfo .copyInfo .tel:before {position:absolute; display:block; content:'|'; right:0;}
.footerInfo .copyInfo .notice {margin: 25px 0;}
.footerInfo .copyInfo .copy{}
.footerInfo .copyInfo .copy .txt .adm {position:relative; top:2px; color:inherit;}


	@media screen and (max-width:1419px) {
		.footerTop .flogo {margin-right:3%;}
		.footerTop .cs {padding:0 3%;}
		.footerTop .inquiry {padding: 0 3%;}
		.footerTop .inquiry p br {display:none;}
	}

	@media screen and (max-width:1119px) {
		.sec-footer {text-align:center;font-size:14px;padding: 60px 50px;}
		.footerTop .container {flex-wrap:wrap;justify-content:center;}
		.footerTop .flogo {margin:0 0 40px; width:100%;}
		.footerTop .flogo .copyLogo {width: 150px;height: 35px;margin: 0 auto;}
		.footerTop .flogo .tit {display:none;}
		.footerTop .tit {font-size:16px;}
		.footerTop p {font-size:14px;}
		.footerTop .cs {position:relative;}
		.footerTop .cs:before {position:absolute; display:block; content:''; width:1px; height:70%; right:0; background:#666; top:15%;}
		.footerTop .cs p {font-size:24px; font-weight:600; opacity:1;}
		.footerTop .inquiry .btn {justify-content:center;}
		.footerTop .inquiry .btn li a {width:140px;}
		.footerTop .cs, .footerTop .inquiry {border:0;background:rgba(255,255,255,0.05);width: 50%;padding: 30px 20px;min-width: inherit;}
		.footerInfo .copyInfo .tit {font-size:16px;}
		.footerTop p, .footerTop .cs .info, .footerInfo .copyInfo .text, .footerInfo .copyInfo .notice, .footerInfo .copyInfo .copy {opacity:0.8; font-weight:300;}
	}

	@media screen and (max-width:799px) {
		.sec-footer {padding: 60px 3%;}
	}

	@media screen and (max-width:699px) {
		.footerTop .flogo {margin-bottom:20px;}
		.footerTop .flogo .copyLogo {width:130px;}
		.footerTop p {margin:15px 0 10px;}
		.footerTop .cs:before {display:none;}
		.footerTop .inquiry .btn {flex-wrap: wrap;}
		.footerTop .cs, .footerTop .inquiry {width:100%;padding:20px;min-height: auto;margin-bottom:10px;}
		.footerInfo .copyInfo .tit {margin-bottom:15px;}
		.footerInfo .copyInfo .tel {padding-right: 0;margin-right: 0; width:100%;}
		.footerInfo .copyInfo .tel:before {display: none;}
		.footerInfo .copyInfo .notice {margin: 10px 0;}
	}


#top_button {position:fixed;bottom:20px;right:20px;width:50px;height:50px;line-height:50px;text-align:center;font-size:15px;z-index:8000;background-color:#000;background-image:url('../img/common/top.png');background-repeat:no-repeat;background-position:50% 50%;color:#000;display:none;border-radius:50%;opacity:0.5; cursor:pointer; border:0;}
#top_button:hover{color:#fff;opacity:1;background-color:#E9B358;}
#top_button span{font-size:0;}

	@media screen and (max-width:799px) {
		#top_button {bottom:10px; right:10px; width:45px;height:45px;}
	}


/* keyframes */
@keyframes btnBounce {	0% {transform:translateX(0);} 50% {transform:translateX(8px);} 100% {transform:translateX(0);} }
@keyframes rotateR { 0% {transform:rotate(0deg);} 100% {transform:rotate(360deg);} }
@keyframes rotateL { 0% {transform:rotate(0deg);} 100% {transform:rotate(-360deg);} }
@keyframes fadeIn{ 0% {opacity:0;} 100% {opacity:1;} }
@keyframes fadeInUp{ 0% {transform:translateY(100%);} 100% {transform:translateY(0); opacity:1;} }
@keyframes fadeInDown{ 0% {transform:translateY(-100%);} 100% {transform:translateY(0); opacity:1;} }
@keyframes fadeInLeft{ 0% {transform:translateX(-100%);} 100% {transform:translateX(0); opacity:1;} }
@keyframes fadeInRight{ 0% {transform:translateX(100%);} 100% {transform:translateX(0); opacity:1;} }
@keyframes fadeInLeft50{ 0% {transform:translateX(-50px);} 100% {transform:translateX(0); opacity:1;} }
@keyframes shakeProd { 0% {transform:rotate(0deg);} 50% {transform:rotate(8deg);} 100% {transform:rotate(0deg);} }
@keyframes width200 { 0% {width:0;} 100% {width:200px; margin-right:20px;} }
@keyframes width150 { 0% {width:0;} 100% {width:150px; margin-right:20px;} }
@keyframes width100 { 0% {width:0;} 100% {width:100px; margin-right:20px;} }