﻿/* layout */
html, body {height:100%; }
body {font-family:'NanumBarunGothic';font-size:14px; font-weight:400; color:#464646; line-height:20px; -webkit-text-size-adjust:none; -webkit-font-smoothing:antialiased;}
#wrap {position:relative; min-width:320px; height:100%;}
.header_in,
.gnb_w > ul > li,
.footer_bot .inner {-webkit-transition:all .3s cubic-bezier(.25, .46, .45, 1); -moz-transition:all .3s cubic-bezier(.25, .46, .45, 1); -o-transition:all .3s cubic-bezier(.25, .46, .45, 1); transition:all .3s cubic-bezier(.25, .46, .45, 1);}

#container {width:100%; }
#container:after {content:''; display:block; clear:both;}
.inner {position:relative; max-width:1280px; margin:0 auto; }
#container a {-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}

/* header */
#header {position:absolute; top:0; left:0; width:100%; height:140px; background:url('/images/common/header_bg.png') no-repeat 0 0; z-index:50; background-size:100% 400px; }
#header .inner {position:relative; box-sizing: border-box; }
#header .header_mid {position:relative; height:89px; background-color:#fff;}
#header h1 a {display:block; position:relative; top:17px; width:285px; height:50px; z-index:2; background-image:url('/images/common/logo.png'); background-repeat:no-repeat; background-position:0 0;text-indent:-9999px;}
.search_wrap {position:absolute; right:470px; top:25px; }
.headSearch {width:350px; padding:0 40px 0 85px; margin:0; border:2px solid #c5c5c5; box-sizing:border-box; border-radius:25px; }
.headSearch label {position:absolute; top:2px; left:0; display:inline-block; width:80px; height:40px; line-height:40px; text-align:center; color:#262626; font-size:14px;}
.headSearch label:after {content:''; display:block; width:1px; height:20px; background-color:#c3c3c3; position:absolute; top:10px; right:0; }
.headSearch input[type="text"] {width:100%; height:38px; padding:0 8px; border:none; }
.headSearch input[type="text"]:focus {outline:none; }
.headSearch a {display:inline-block; width:38px; height:40px; background:url('/images/common/btn_search.png') no-repeat left 11px center; position:absolute; top:0; right:0; text-indent:-9999px;}
#header ul.global {position:absolute; top:35px; right:0; overflow:hidden; display:inline-block; margin:0; padding:0; }
#header ul.global li {display:inline-block; float:left; }
#header ul.global li a {display:block; padding:0 18px; text-decoration:none; }
#header ul.global li:before {content:""; display:block; position:relative; float:left; top:3px; left:0; width:1px; height:13px; background-color:#c5bcb2;}
#header ul.global li:first-child:before {display:none;}
#header.on {height:395px;}
.header_in {position:relative; max-width:1280px; margin:0 auto;}

/* gnb */
.gnb_w > ul {overflow:hidden; border-right:1px solid rgba(0,0,0,0.2); }
.gnb_w > ul, .gnb_w > ul * {box-sizing:border-box;}
.gnb_w > ul > li {float:left; width:20%; text-align:center; border-left:1px solid rgba(0,0,0,0.2); box-sizing:border-box;}
.gnb_w > ul > li > a {display:table; position:relative; width:100%; height:50px; line-height:50px; color:#fff; font-size:16px; font-weight:500; -webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-ms-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out}
.gnb_w > ul > li > a:hover,
.gnb_w > ul > li > a:focus,
.gnb_w > ul > li.on > a,
.gnb_w > ul > li.active > a,
#header.on .gnb_w > ul > li.active.on > a {color:#ffd300; }
.gnb_w > ul > li > a:after {display:block; content:''; position:absolute; bottom:0; left:50%; width:0; height:4px; background-color:#ff9c00; -webkit-transition:all .4s cubic-bezier(.25, .46, .45, 1); -moz-transition:all .4s cubic-bezier(.25, .46, .45, 1); -o-transition:all .4s cubic-bezier(.25, .46, .45, 1); transition:all .4s cubic-bezier(.25, .46, .45, 1);}
.gnb_w > ul > li.active > a:after,
.gnb_w > ul > li.on > a:after,
#header.on .gnb_w > ul > li.active.on > a:after {left:0; width:100%;}
#header.on .gnb_w > ul > li.active > a {color:#1a85d0;}
#header.on .gnb_w > ul > li.active > a:after {left:50%; width:0;}
.gnb_w > ul > li > a > span {display:table-cell; vertical-align:middle;}
.gnb_w > ul > li:hover > ul {background-color:#fafafa;}
.gnb_w ul li > a img {position:relative; margin-left:3px; top:-1px;}
.gnb_w .depth2 {display:none; opacity:0; filter:alpha(opacity=0); height:248px; padding:8px 0 0 ; text-align:left;  box-sizing:border-box;  }
.gnb_w .depth2 > li > a {display:inline-block; padding:5px 0  5px 20px; font-size:14px; line-height:18px; color:#555;}
.gnb_w .depth3 {padding-left:1px;}
.gnb_w .depth3 > li {padding-top:2px;}
.gnb_w .depth3 > li > a {position:relative; padding-left:8px; color:#c5bcb2;}
.gnb_w .depth3 > li > a:before {content:""; display:block; position:absolute; top:10px; left:0; width:4px; height:1px; background-color:#c5bcb2;}
.gnb_w .depth3 > li > a:hover:before {background-color:#dec39a;}

/* navMobile */
.navM_open {display:none;}
.navMobile {display:none; position:fixed; width:270px; height:100%; top:0; z-index:60; background:#fff; overflow:auto; visibility:hidden; -webkit-overflow-scrolling:touch; /* enables momentum scrolling in iOS overflow elements */}
.navMobile .nav_top {height:40px; padding:16px 15px 0 0; background-color:#1a85d0; text-align:right;}
.navMobile .nav_top > a {margin-left:5px; color:#fff; font-size:13px; padding-left:10px; background:url('/images/common/bgline_lang.png') no-repeat 0 3px; background-size:1px 10px;}
.navMobile .nav_top > a:first-child {background:none;}
.gnb_m > li > a {display:block; position:relative; padding:12px 30px 13px 20px; border-bottom:1px solid #ccc; color:#000; font-size:16px; white-space:nowrap;}
.gnb_m > li > a:after {display:inline-block; position:absolute; top:13px; right:15px; font-family:'Linearicons-Free'; font-size:16px; color:#787878; -webkit-transition:all .2s ease-in-out; -moz-transition:all .2s ease-in-out; transition:all .2s ease-in-out;}
.gnb_m > li.hasSub > a:after {content:"\e874";}
.gnb_m > li.on.hasSub > a:after {content:"\e873";}
.gnb_m > li > ul,
.gnb_m > li > ul > li > ul,
.gnb_m > li > ul > li > ul > li > ul {display:none;}

.gnb_m > li > ul > li {position:relative; border-bottom:1px solid #494963; letter-spacing:-0.5px;}
.gnb_m > li > ul > li > a {display:block; padding:15px 20px; font-size:15px; color:#fff; line-height:18px; background-color: #323245; }
.gnb_m > li > ul > li.hasSub > a {color:#fff; background:#323245 url('/images/common/lnb_ic_open3.png') no-repeat 92% center; }
.gnb_m > li > ul > li.on> a { color:#fff;}
.gnb_m > li > ul > li.on.hasSub > a { color:#fff; background: #323245 url('/images/common/lnb_ic_close1.png') no-repeat 92% center; }
.gnb_m > li > ul > li > a:hover,
.gnb_m > li > ul > li > a:active {color:#fff; text-decoration:none; background-color:#323245;}
.gnb_m > li > ul > li > ul {padding:10px 20px 10px 20px; background: #f2f3f7;}
.gnb_m > li > ul > li > ul > li {padding:6px 0;}
.gnb_m > li > ul > li > ul > li > a {position:relative; display:block; padding-left:8px; color:#545454; font-size:14px; line-height:18px;}
.gnb_m > li > ul > li > ul > li.hasSub > a {background: url('/images/common/lnb_ic_open2.png') no-repeat 95% center; }
.gnb_m > li > ul > li > ul > li.on.hasSub > a {color:#006fce; font-weight:500; background:url('/images/common/lnb_ic_close2.png') no-repeat 95% center;}
.gnb_m > li > ul > li > ul > li.on > a {color:#de4747; font-weight:500; background-image:none; }
.gnb_m > li > ul > li > ul > li > a:hover,
.gnb_m > li > ul > li > ul > li > a:active {color:#0087d1;}
.gnb_m > li > ul > li > ul > li > a:before { content:''; display:block; width:2px; height:2px; background-color:#555; position:absolute; top:8px; left:0; }

.gnb_m > li > ul > li > ul > li > ul {margin:0px 0 0; padding:5px 0;  border-bottom :1px dashed #dadada;  }
.gnb_m > li > ul > li > ul > li > ul > li > a {display:block; padding-left:10px; margin-bottom:3px; color:#545454; font-size:13px;}
.gnb_m > li > ul > li > ul > li > ul > li > a:hover,
.gnb_m > li > ul > li > ul > li > ul > li > a:active {color:#0087d1;}
.gnb_m > li > ul > li > ul > li > ul > li.on > a {color:#0087d1; font-weight:500;}

.navM_close {display:block; position:absolute; top:0; left:0; width:55px; height:55px; border:0; border-right:1px solid #3c9bde; background:none;}
.navM_close:before {content:"\e870"; display:inline-block; position:absolute; top:16px; left:16px; font-family:'Linearicons-Free'; font-size:22px; line-height:22px; color:#fff;}
.pushy.pushy-left {left:0;}
.pushy-left {-webkit-transform:translate3d(-270px, 0, 0); -ms-transform:translate3d(-270px, 0, 0); transform:translate3d(-270px, 0, 0);}
.pushy-open-left .pushy {-webkit-transform:translate3d(0, 0, 0); -ms-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0);}
.pushy-open-left #wrap, .pushy, .push {transition:transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99);}
.site-overlay {display:none;}

/* footer */
.layer_popup * {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.layer_popup > div {border:2px solid #777; background-color:#fff; }
.layer_popup img {width:auto !important; height:auto !important}

/* footer */
#footer {position:relative; }
#footer * {box-sizing:border-box; }
.foot_top {background-color:#f2f2f0;}
.foot_top .inner:after {content:''; display:block; clear:both; }
.foot_top .policy {float: left; width: 50%; }
.foot_top .policy:after {content:''; display:block; clear:both; }
.foot_top .policy ul li {float:left; padding:0 20px; height:50px;  }
.foot_top .policy ul li:first-child {padding-left:0;}
.foot_top .policy ul li a {display:block;  height:55px; line-height:55px; color:#555; }
.foot_top .siteLink {float:right; padding: 10px 0 10px 10px; width:20%; box-sizing:border-box; }
.foot_top .siteLink p {position:relative; display:inline-block; float:left; width:100%;  margin:0; }
.foot_top .siteLink p a { position:absolute; top:0; right:0; color:#fff; background-color:#a1a1a1; height:35px; padding:0 10px; line-height:35px; font-size:0.813em;}
.foot_top .siteLink select { width:100%; border:1px solid #c6c6c6; padding:0 5px; height:35px; font-size:.0.813em; }
.foot_bot {padding:25px 0 30px; background-color:#4c4c4c;}
.foot_bot .go_top {position:absolute; z-index:10; top:-20px; right:0; width:40px; height:40px; padding-top:4px; background-color:#b42c33; text-align:center;}
.foot_bot .go_top:before {content:"\f106"; display:inline-block; font-family:'FontAwesome'; font-size:20px; color:#eac2c4;}
.foot_bot .address {color:#e4e4e4; font-size:12px;}
.foot_bot .address span {margin-right:11px;}
.foot_bot .copyright {margin-top:2px; color:#888; font-size:12px;}
#go_top {display:none; position:fixed; z-index:13; bottom:55px; right:10px; width:40px; height:40px; line-height: 37px; background-color:#1a85d0; text-align:center; box-sizing:border-box; }
#go_top:before {content:"\f106"; display:inline-block; font-family:'FontAwesome'; font-size:20px; color:#fff;}
#go_top:hover { background:#006ab4; }

@media screen and (min-width:961px) and (max-width:1280px) {

	.header_in {padding-left:2%; padding-right:2%;}
	.search_wrap {right:50%; margin-right:-200px;}

	.gnb_w .depth2 {padding-left:10px;}
	.gnb_w .depth2 > li > a > span {display:block;}
	.gnb_w .depth2 > li > a {padding: 4px 0 4px 5px;}

	.foot_bot {padding:20px 0 16px;}
	.foot_top .siteLink {width:25%;}
	.foot_bot .address {margin-top:8px;}

}

@media screen and (max-width:960px){
	.pcShow,
	.gnb_w,
	.global {display:none!important;}
	.mobileShow {display:block!important;}
	.form_span2 {margin-left:0;}

	#header {height:auto; background:none;}
	#header .header_mid {border-bottom:1px solid #ccc; height:55px;}
	#header h1 a {margin:0 auto; width:220px; height:49px; top:6px; background-image:url('/images/common/logo.png'); background-size:220px;}
	.search_wrap {right:0; top:0; }
	.search_wrap .headSearchM a {display:block; position:absolute; top:0; right:0; width:54px; height:54px;border:0; background:#fff;}
	.search_wrap .headSearchM a:before {content:"\e86f"; display:inline-block; position:absolute; top:18px; left:18px; font-family:'Linearicons-Free'; color:#797a7c; font-size:20px; line-height:20px; font-weight:bold;}
	.navMobile {display:block;}
	.navM_open {display:block; position:absolute; top:0; left:0; border:0; background:#fff;}
	.navM_open:before {content:"\e871"; display:inline-block; position:absolute; top:18px; left:18px; font-family:'Linearicons-Free'; color:#797a7c; font-size:20px; line-height:20px; font-weight:bold;  }
	.pushy-open-left .site-overlay {display:block; position:fixed; top:0; right:0; bottom:0; left:0; z-index:50; background-color:rgba(0, 0, 0, 0.65); -webkit-animation:fade 500ms; animation:fade 500ms;}

	.foot_top .inner {padding-left:2%; padding-right:2%;}
	.foot_top .siteLink {width:30%;}
	.foot_bot {padding:18px 5px 20px; text-align:center;}
	.foot_bot {padding:20px 22px 26px;}
	.foot_bot .go_top {top:0; right:22px;}
	.foot_bot .address {margin-top:8px;}
	.foot_bot .address span {margin-right:6px;}
	#go_top {left:auto; right:22px; margin-left:0;}

}

@media screen and (max-width:767px){
	.foot_top .inner > div {width:100%; }
	.foot_top .inner .siteLink {padding: 0 0 10px 0;}
	.foot_bot .go_top {right:4%; width:34px; height:34px; padding-top:1px;}
	.foot_bot .address {margin-top:0; color:#cdcdcd; font-size:11px; line-height:1.55;}
	.foot_bot .address>span {display:inline-block;}
	.foot_bot .address span {margin-right:9px;}
	.foot_bot .copyright {margin-top:2px; font-size:11px;}
	#go_top {bottom:55px; right:2%; width:34px; height:34px; line-height:30px;}

}

@media screen and (max-width:560px){
	.foot_top .siteLink p  {width: 100%; margin-right: 0; margin-bottom: 5px;}

}

@media screen and (max-width:480px){
	.foot_top .policy ul li {padding:0 7px; font-size:13px; letter-spacing:-1px; }

}

@media screen and (max-width:374px){
	#go_top {bottom:30px;}

}




