@charset "utf-8";

/* font */
.myeongjo{font-family: 'Nanum Myeongjo', serif;}
.roboto{font-family: 'Roboto', sans-serif;}
@font-face {
    font-family: 'KOTRA_BOLD-Bold';
    src: url('//cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10-21@1.1/KOTRA_BOLD-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
.kotra{font-family: 'KOTRA_BOLD-Bold';}

/* basic */
.inner{width:100%; max-width:1200px; margin:0 auto; position:relative;}

@media all and (max-width:1200px){
	.inner{width:93.75%}
}


/* header */
#header{position:fixed; text-align:right; left:0; top:0; border-bottom:1px solid rgba(255,255,255,0.2); width:100%; height:108px; z-index:1000; box-sizing:border-box; transition:0.2s ease-in}
#header a.logo{position:absolute; left:120px; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#header a.logo img.off{display:block}
#header a.logo img.on{display:none;}
#header .gnb{margin-right:120px; display:inline-block}
#header .gnb ul{font-size:0; letter-spacing:-4px;}
#header .gnb ul li{display:inline-block; vertical-align:top; margin:0 25px;}
#header .gnb ul li a{display:block; padding:39px 8px 40px; text-align:center; position:relative; font-size:20px; color:#fff; letter-spacing:-0.05em; font-weight:500; transition:0.2s;}
#header .gnb ul li a:before{content:""; width:0; height:4px; background:#40b1cb; position:absolute; left:50%; bottom:0; transition:0.2s; transform:translateX(-50%); -ms-transform:translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); -moz-transform:translateX(-50%);}
#header .gnb ul li.on a:before{width:100%;}
#header .gnb ul li:hover a:before{width:100%;}
#header.scroll{background:#fff;}
#header.scroll a.logo img.off{display:none}
#header.scroll a.logo img.on{display:block;}
#header.scroll .gnb ul li a{color:#666666;}
#header.scroll .gnb ul li:hover a{color:#1e3470}
#header.scroll .gnb ul li.on a{color:#1e3470}

@media all and (max-width:1400px){
	#header a.logo{left:20px}
	#header .gnb{margin-right:20px;}
}
@media all and (max-width:1100px){
	#header .gnb ul li{margin:0 10px}
}
@media all and (max-width:1000px){
	#header .gnb ul li{display:none}
	#header .gnb ul li.m{display:inline-block;}
}


/* footer */
#footer{background:#3b3d42; }
#footer .inner{font-size:0; letter-spacing:-4px;padding:80px 0 85px;}
#footer a.footer_logo{display:inline-block; vertical-align:top; max-width:200px;}
#footer .text{width:calc(100% - 200px); padding-left:60px; box-sizing:border-box; display:inline-block; vertical-align:top;}
#footer .text ul li{font-size:16px; color:#cacaca; letter-spacing:-0.05em; font-weight:300; display:inline-block; vertical-align:middle; margin:0 10px; line-height:24px;}
#footer .text ul li a{color:#38c3e3; font-size:20px; font-weight:500; display:inline-block; margin:-4px 0 0 5px;}
#footer .text p{font-size:16px; color:#7d7d7d; letter-spacing:-0.05em; font-weight:200;margin:10px 10px 0;}
#footer a.top_btn{text-align:center; display:block; width:100px; height:100px; background:#41acc5; border-radius:50%; border:10px solid #fff; box-sizing:border-box; line-height:80px; font-size:16px; color:#fff; letter-spacing:-0.05em; font-weight:bold; position:absolute; right:0; top:-50px}

@media all and (max-width:1000px){
	#footer{text-align:center;}
	#footer .inner{padding:40px 0 45px}
	#footer a.footer_logo img{max-width:140px}
	#footer .text{display:block; margin:20px 0; width:100%; padding:0;}
	#footer .text ul li{margin:0 10px;}
}