@charset "utf-8";

/* **************************************** *
 * 공통클래스_Layout
 * **************************************** */
/* skip Navigation */
#skipNavi dl {position:absolute;}
#skipNavi dt {position:absolute; top:-10000px;}
#skipNavi dd a {position:absolute; display:block; width:200px; left:50%; text-align:center; top:-10000px; z-index:999; font-size:16px;}
#skipNavi dd a:hover,
#skipNavi dd a:focus,
#skipNavi dd a:active {position:absolute; top:5px; padding:15px 0; margin-left:-500px; font-weight:bold; color:#fff; text-decoration:underline; background:#336ea2;}





/* **************************************** *
 * HEADER
 * **************************************** */
#header_wrap {position:fixed; top:0; left:0; z-index:101; width: 100%; background-color:#fff;}
#header_wrap .header {position: relative; margin: 0 auto;}
/*#header_wrap h1 {position: absolute; left:50%; top:27px; margin-left:-105px; width:211px; height:38px; background: url('../img/common/logo.png') 0 0 no-repeat; background-size:100%; z-index:102;}*/
#header_wrap h1 {position: absolute; left:50%; top:17px; margin-left:-203px; width:407px; height:48px; background: url('../img/common/logo2.jpg') 0 0 no-repeat; background-size:100%; z-index:102;}
#header_wrap h1 a {display: block;height: 100%; text-indent: -10000px;}

/* util */
.util_wrap {position: relative; max-width:1200px; margin: 0 auto;}
.util_wrap:after{clear:both; display:block; content:"";}
.util_wrap ul {position: absolute; right:0px; top:40px; z-index:102;}
.util_wrap ul li {position: relative; display: inline-block; padding:0 20px;}
.util_wrap ul li a {color:#666; font-size:14px;}
.util_wrap ul li:before {content: ''; position:absolute; display:block; width:14px; height:14px; top:0px; right:0px; background: url("../img/common/util_icon.png") no-repeat center }

/* GNB */
p.view_gnb,
p.btn_close {display: none;}

.gnb_wrap {background:url('../img/common/headerLine.png') repeat-x left 0px; text-align: center; margin-top:0;}
.gnb_wrap {border-bottom: 1px solid #eee;}
.gnb_inner {position: relative; max-width:1200px; margin:0 auto;}

ul#gnb {display: inline-block; padding-top: 89px; }
ul#gnb a {display: block; color:#666; font-size:18px; text-decoration: none; text-align:center;}
ul#gnb > li {display: inline-block; width:200px; vertical-align:top;}
ul#gnb > li:first-child {margin-left: 0;}
ul#gnb > li > a {height:60px; font-size:18px; line-height:60px; font-weight:400; color:#000; text-decoration:none;}
ul#gnb > li > a span {display: inline-block;}
ul#gnb > li > a:hover,
ul#gnb > li.on > a {height:60px; padding-bottom:0;}
ul#gnb > li > a:hover span,
ul#gnb > li.on > a span {padding-bottom:0px; border-bottom:2px solid #1c86c6;}

ul#gnb ul.sub_gnb {display: none; padding:20px 0 40px;}
ul#gnb ul.sub_gnb > li > a {padding:3px 0; font-size:16px; line-height:1.8; font-weight:400;}
ul#gnb ul.sub_gnb > li > a:hover {color:#1c86c6}
ul#gnb ul.sub_gnb > li > a.link_m {display: none;}
ul#gnb ul.sub_gnb > li > a.link_m + a {display: block;}

ul#gnb ul.sub_gnb > li:first-child a {margin-top:0;}
ul#gnb ul a {display:block;}
ul#gnb li.view.viewOn > a {background-position:right -18px; color: #3fbe93;}
.gini_home{display: none !important;}

/* 언어 선택 */
.lang_area {position: absolute; top:90px; right:0; width:100px; background-color:#fff; border-left: 1px solid #eee; border-right: 1px solid #eee;}
.lang_area a {display: block; font-size:16px; color:#666; }
.lang_area > p {}
.lang_area > p.on {border-bottom:2px solid #1c86c6;}
.lang_area > p a {background:#FFF url('../img/common/lang_bl_toggle.png') no-repeat 70px 25px; font-size:16px; line-height:59px;}
.lang_area ul {padding:10px; border-bottom: 1px solid #eee; display:none}
.lang_area ul li {padding:5px 0;}


	@media screen and (max-width:1200px){
		.util_wrap ul {position: absolute; right:20px; top:40px;}
	}

	@media screen and (max-width:1024px) and (min-width:768px){
		ul#gnb > li > a:hover span,
		ul#gnb > li.on > a span {padding-bottom:0; border-bottom:0 none;}
	}

	@media screen and (max-width:900px){
		/*#header_wrap h1 {width:120px; height:22px; left:50%; top:20px; margin-left:-60px;}*/
		#header_wrap h1 {width:200px; height:24px; left:50%; top:17px; margin-left:-100px;}
		#header_wrap > div {height:60px;}

		/* util */
		.util_wrap ul {position: absolute; right:10px; top:20px;}
		.util_wrap ul li a {color:#666; font-size:13px;}
		.util_wrap ul li:before {content: ''; position:absolute; display:block; width:14px; height:14px; top:2px; right:0px; background: url("../img/common/util_icon.png") no-repeat center }
		.util_wrap ul li{display: none;}

		/* gnb */
		p.view_gnb,
		.gnb_wrap p.btn_close {display:block;}

		p.view_gnb {position: absolute; left:15px; top:20px;}
		p.view_gnb a {display: block; width:25px; height:20px; background:url('../img/common/gnbMenu_m.png') no-repeat 0 0; background-size:100%; font-size: 0; line-height: 0;}

		.gnb_wrap {display: none; position: fixed; top:0; left: 0; z-index:500; width:100%; height: 100%; background-color:inherit; overflow-x:hidden; overflow-y:auto; background:none}
		.gnb_wrap:before {content:''; display: block; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5);}

		.gnb_inner {position:absolute; left:0; top:0; width:100%; height: 100%; background-color:#FFF; box-sizing:border-box; overflow-y:auto;}
		.gnb_inner > p:first-child {display: block; padding:17px; background-color:#78c9b6; font-size:18px; line-height: 18px; color: #FFF;}

		ul#gnb {box-sizing:border-box; width:100%; /*height:100%;*/ padding:15px 20px; margin-left:0; }
		ul#gnb > li {display: block; width:100%; border-bottom: 1px solid #dcdcdc;}
		ul#gnb > li > a {height:auto; margin-right:0; padding:0 10px; background:url('../img/common/gnb_bl_toggle.png') no-repeat right 24px; background-size:22px auto; font-size:18px; line-height:60px;}
		ul#gnb > li.gini_home > a{background-image: none;background: #d9d9d9;}


		ul#gnb ul.sub_gnb {display: none; padding-top:20px; background-color:#f6f6f6;}
		ul#gnb ul.sub_gnb > li > a {margin-top:0; padding-left:10px; font-size:15px; font-weight: 400; line-height:40px; color: #555;}
		ul#gnb ul.sub_gnb > li > a.link_m + a {display: none;}
		ul#gnb ul.sub_gnb > li > a.link_m {display:block;}

		ul#gnb > li.view > a {background-position:right -38px;}
		ul#gnb > li > a:hover,
		ul#gnb > li.on > a {height:auto; padding-bottom:0; border:0 none;}

		ul#gnb > li > a:hover span,
		ul#gnb > li.on > a span {padding-bottom:0; border-bottom:0 none;}

		.gnb_inner p.btn_close {position: absolute; top:20px; right:25px; z-index: 200;}
		.gnb_inner p.btn_close a {display: block; width:20px; height: 20px; background: url('../img/common/headerIcon_btnClose_m.png') no-repeat 0 0; font-size: 0; line-height: 0;}

		/* _언어 선택 */
		.lang_area {position: relative; right:0; left:0; top:0; width:100%; height:60px; background-color:#1c86c6;}
		.lang_area > p:first-child {display: none;}
		.lang_area > ul {display: block; padding:13px 15px 12px 30px; border-bottom: none;}
		.lang_area > ul li {float: left; padding-left:20px;}
		.lang_area > ul li:first-child {padding-left:0;}
		.lang_area > ul li a {font-size:14px; line-height:20px; color: #fff;}
		.lang_area > ul li.active a {font-weight: bold; color: #000;}
	}

	@media screen and (max-width:1024px) and (min-width:768px){
		ul#gnb > li > a:hover span,
		ul#gnb > li.on > a span {padding-bottom:0; border-bottom:0 none;}
	}





/* **************************************** *
 * FOOTER
 * **************************************** */
#footer {position:relative; width:100%; height:auto; background:#232323; z-index:10; box-sizing:border-box; margin:100px auto 0;}
#footer .footer_wrap {position:relative; max-width:1200px; margin:0 auto; padding:60px 0 40px;}

#footer .top {position:relative; padding-bottom:25px; border-bottom:rgba(62, 62, 62, 1) solid 1px;}
#footer .top .tel {position:relative; font-family: 'Montserrat', sans-serif; color:#fff; font-size:22px; font-weight:700; padding:20px 0 5px;}
#footer .top .time {position:relative; color:#fff; font-size:14px; font-weight:300;}

#footer .bot {position:relative; padding-top:20px; color:#fff;}
#footer .bot p {display:block;line-height:2;}
#footer .bot span {position:relative; padding-right:30px; color:#fff; font-size:14px; font-weight:300;}
#footer .bot span:before{content:""; display:block; width:1px; height:12px; position:absolute; top:7px; left:-12px; background:#ddd;}
#footer .bot span:nth-child(1):before {display:none}
#footer .bot span:last-child:after{display:none;}

#footer .sns_btn {position:absolute; top:80px; right:0px;}
#footer .sns_btn ul li {display:inline-block; padding-left:10px;}



	@media all and (max-width:1200px) {
		#footer .footer_wrap {padding:80px 20px;}
		#footer .sns_btn {position:absolute; top:80px; right:20px;}
	}

	@media all and (max-width:768px) {
		#footer {margin:50px auto 0;}
		#footer .footer_wrap {padding:120px 20px 30px 20px;}
		#footer .top {text-align:center;}
		#footer .top .tel {font-size:18px; padding:20px 0 5px;}
		#footer .top .time {font-size:13px;}

		#footer .bot {padding:20px 0 0px 0; text-align:center;}
		#footer .bot span {padding-right:20px; font-size:13px;}
		#footer .bot span:before {top:5px; left:-9px;}

		#footer .sns_btn {position:absolute; top:40px; left:50%; margin-left:-79px;}

	 }

	@media all and (max-width:610px) {
		#footer .bot .fmSel {top:140px;width:100%; height:35px}
		#div_topshortcut {bottom:280px;}
	}

	@media all and (max-width:460px) {
		#footer .top a {font-size:14px;}
		#footer .bot .fmSel {top:180px;width:100%; height:35px}
		#div_topshortcut {bottom:330px;}
	}

	@media all and (max-width:340px) {
		#footer .bot .fmSel {top:200px;width:100%; height:35px}
		#div_topshortcut {bottom:350px;}
	}