﻿@charset "utf-8";
/* ==================================================
	header 전체틀
================================================== */
#header{
	width:100%;
	position:fixed;
	z-index:90;
	top:0;
	min-width:320px;
	margin:0;
	padding:0;
	height:70px;
	}
#header .header_con{
	position:relative;
	width:100%;
	max-width:1200px;
	margin:0 auto;
	}

/* ==================================================
	로고위치
================================================== */
#header h1{
	float: left;
	margin-top:13px;
	width: 250px;
	height:44px;
	background-image: url('../images/gnb/logo.png');
	background-repeat: no-repeat;
	text-indent: -9999px;
	}
#header h1 a {
	display: block;
	height: 100%;
	}
/* 모바일CSS */
@media screen and (max-width:1440px){
	#header  .header_con{
		position:relative;
		width:100%;
		max-width:100%;
		}
	#header h1{
		left: 2.5%;
		}
}
@media screen and (max-width:1024px){
	#header{
		height:60px;
		background:#fff;
		border-bottom: 1px solid #eaeaea;
		box-shadow: 0 0 14px rgba(0,0,0,.4);
		}
	#header h1{
		position:relative;
		text-align:center;
		left:0; top:11px;
		margin-top:0;
		margin:0 auto;
		width:94%; height: 40px;
		background-image: url('../images/gnb/logo_c.png');
		background-position: center;
		background-size: 180px 40px;
		}
	#header  .header_con{position:relative; width:95%; margin:0 2.5%;}
	#header h1 img{height:35px;}

	}

/* ==================================================
	언어 및 퀵메뉴
================================================== */
.sitelink{
	position:absolute;
	right:0;
	top:23px;
	}
.sitelink > ul > li{
	float:left;
	padding-left:20px;
	line-height:18px;
	}
/*.sitelink > ul > li:first-child{
	padding-left:0;
	padding-right:20px;
	border-right:solid 1px #e3e5e6;
	}*/
.sitelink > ul > li a {
	position: relative;
	display:block;
	}
.sitelink ul li a{
	color:#fff;
	}
.sitelink ul li.tsitemap a {
	display:block;
	background:url('../images/gnb/sitemap.png');
	width:35px;
	height:25px;
	}
.foreign {
	position:relative;
	}
.foreign .local{
	display:block;
	width:70px;
	height:32px;
	box-sizing:border-box;
	line-height:18px;
	font-weight:bold;
	/*font-size:12px;*/
	background:url('../images/gnb/foreign_off.png') no-repeat 85% 8px;
	color:#fff;
	font-family:Verdana;
	}
.foreign .local.on{
	background:url('../images/gnb/foreign_on.png') no-repeat 85% 8px;
	}
.foreign .local img {
	padding-top:10px;
	padding-right:5px;
	padding-left:10px;
	}
.foreign ul{
	overflow:hidden;
	position:absolute;
	left:0;
	height:0;
	overflow:hidden;
	}
.foreign ul li{
	width:90px;
	border-radius:30px;
	border:1px solid #d4d4d4;
	box-sizing:border-box;
	background:#fff;
	font-family:Verdana;
	}
.foreign ul li a{display:block; height:32px; line-height:30px; text-align:center; font-size:13px; color:#444;}
.foreign ul li a:hover{
	border-radius:30px;
	color:#ed1c24;
	}

/*  모바일 및 탭 */
@media all and (max-width:1023px) {
	.sitelink {
		top:20px;
		right: 75px;
		}
}
@media all and (max-width:800px) {
	.sitelink > ul > li:nth-child(1), .sitelink > ul > li:nth-child(2) {
		display:none;
		}
}

/* ==================================================
	gnb
================================================== */
.gnb_area {
	float:left;
	width:70%;
	/*max-width:750px;*/
	margin: 0 auto;
	z-index: 80;
	}
.gnb {
	position:relative;
	}
.gnb > li {
	float:left;
	position:relative;
	padding:0 0  0 10%;
	}
.gnb > li:first-child {
	padding:0 0  0 13%;
	}
.gnb > li > a {
	display:block; 
	font-size: 14pt;
	font-family:'Rnoto';
	color:#000;
	}
.gnb > li:hover > a, .gnb > li:active > a, .gnb > li.active > a, .gnb > li:focus > a {
	color:#15a9d9;
	text-decoration:none;
	}
.gnb > li > a span {
	position:relative;
	display:block;
	line-height:70px;
	}
.gnb > li > a span:after {
	position:absolute;
	display:block;
	content:'';
	width:100%;
	height:2px;
	left:0;
	bottom:13px;
	background:#15a9d9;
	transition:all .2s;
	transform:scaleX(0);
	}
.gnb > li.active > a span:after {
	transform:scaleX(1);
	}
.gnb_sub {
	display:none;
	position:absolute;
	left:50px;
	box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
	}
.gnb_sub1 {
	left:74px;
	}
.gnb_sub4 {
	left:65px;
	}
.gnb > li:last-child > .gnb_sub {
	right:0;
	}
.gnb_sub > li > a {
	display:block;
	width:150px;
	padding:6px 10px 7px 15px;
	font-size:11pt;
	color:#666;
	border-top:1px solid #d7d7d7;
	border-left:1px solid #d7d7d7;
	border-right:1px solid #d7d7d7;
	background-color:#fff;
	}
.gnb_sub > li > a.on {
	background: url('../images/gnb/icon_navi.png') #2f586e;
	background-repeat:no-repeat;
	background-position:140px -18px;
	color: #fff;
	}
.gnb_sub > li:last-child > a {
	border-bottom:1px solid #d7d7d7;
	}
.gnb_sub > li > a:hover, .gnb_sub > li > a:active, .gnb_sub > li > a:focus {
	color:#15a9d9;
	background-color:#d7d7d7;
	text-decoration:none; 
	}

.gnb_sub3 > li > a {
	/*width:250px;*/
	}

/* 모바일CSS */
@media all and (max-width:1200px) {
	.gnb > li > a {
		font-size: 12pt;
		}
	.gnb_area {
		/*max-width: 650px;*/
		}
}

@media all and (max-width:1023px) {
	.gnb_area{
		height: 66px;
		padding:0 20px;
		}
	.tlink_mnone {
		display:none;
		}
}
/* 서브메뉴 가로위치
ul.gnb li ul.gnb_sub1 {
	left:10px;
	}
ul.gnb li ul.gnb_sub2 {
	
	}
ul.gnb li ul.gnb_sub5 {
	left:-10px;
	} */

/* ==================================================
	스크롤 내렸을때 변화
================================================== */
#header.active {
	background-color: #fff;
	border-bottom: 1px solid #eaeaea;
	box-shadow: 0 0 14px rgba(0,0,0,.4);
	}
/*#header.active  .gnb > li:hover > a, #header.active .gnb > li:active > a, #header.active .gnb > li.active > a, #header.active .gnb > li:focus > a {
	color:#005BA5;
	}
.active .sitelink ul li a {
    color:#333;
	}
#header.active .foreign .local{
	background:url('../images/gnb/foreignc_off.png') no-repeat 85% 10px;
	color:#333;
	}
#header.active .foreign .local.on{
	background:url('../images/gnb/foreignc_on.png') no-repeat 85% 10px;
	}
#header.active .sitelink ul li.tsitemap a {
	background:url('../images/gnb/sitemap_active.png');
	}*/
/* ==================================================
	서브화면 - 서브메뉴
================================================== */
#sub_gnb_box{
	width:100%;
	height:44px;
	margin: 50px 0;
	}
#sub_gnb{
	width:100%;
	margin:0 auto;
	max-width:1200px;
	background:#e5dfd5;	
	line-height:44px;
	font-size:13pt;
	text-align:center;
	font-weight:bold;
	}
#sub_gnb li{
	float:left;
	text-align:center;
	border-top: solid 1px #dddddd;
	border-left: solid 1px #dddddd;
	border-right: solid 1px #dddddd;
	border-bottom: solid 1px #909090;
	margin: 0 -1px 0 0;
	font-family:'r_titillium';
	}
#sub_gnb li a{
	display:block;
	}
#sub_gnb li.on{
	background-color: #00359a;
	border-color:  #00359a;
	}
#sub_gnb li.on a{
	color: #fff;
	}
#sub_gnb .second, #sub_gnb .fourth, #sub_gnb .sixth{
	width:100%;	
	}
#sub_gnb .second li{
	width:49.5%;
	}
#sub_gnb .third li{
	width:33.2%;
	}
#sub_gnb .fourth li{
	width:24.9%;
	}
#sub_gnb .fifth li{
	width:19.9%;
	}
#sub_gnb .sixth li{
	width:16.5%;
	}
#sub_gnb .eighth li{
	width:12.4%;
	}
#sub_gnb .ninth li{
	width:11%;
	}


 #m_top_area{display:none;}


/* ==================================================
	서브메뉴 
================================================== */
.ssub_menu {
	position:absolute;
	left:140px;
	top:auto;
	width:128px;
	border-bottom:1px solid #ccc;
	}
.ssub_menu ul {
	height:100%;
	margin-top:-37px;
	/*background-color:#e5f1f7;*/
	border-top:1px solid #dadada;
	}
.ssub_menu a {
	display:block;
	color:#555;
	font-size:11pt;
	padding:6px 3px 7px 15px;
	border-left:1px solid #dadada;
	border-right:1px solid #dadada;
	border-bottom:1px solid #dadada;
	background: #fff;
	}
.gnb_sub3 > li:first-child > .ssub_menu {
	width:210px;
	left:160px;
	}
.gnb_sub3 > li:last-child > .ssub_menu {
	width:190px;
	left:160px;
	}
.ssub_menu a:hover, .ssub_menu a:active, .ssub_menu a:focus {
	color:#2475d0;
	text-decoration:underline;
	}

/* ==================================================
	gnb 메뉴
================================================== */
.menu_wrap {width:100%; height:100%; position:fixed; top:0; left:0; z-index:910; display:none;}
.menu_wrap > div {height:100%; min-width:320px; width:100%; position:relative; margin:0 auto; overflow-x:hidden;}
.gnb_bg {position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.7; z-index:901; display:none;}
.menu_wrap .menu_area {width:80%; position:absolute; top:0; right:-80%; z-index:510;}
.menu_wrap .menu_area > .height_finder {width:100%; height:0px;}
.menu_area .top_area {width:100%; height:60px; position:relative; overflow:hidden; background:#36383b;}
.menu_area .top_area .gnb_tit {
	float:left;
	padding-top:20px;
	margin-left:20px;
	color:#fff;
	font-size:20px;
	font-weight:bold;
	}
.menu_area .top_area .close_bn {float:right; padding:15px;}
.menu_area .top_area .close_bn img{width:30px;}
.menu_area .top_area .gnb_tit img{width:24px;}
.menu_wrap .menu_area .row_01 {width:100%;}
.menu_wrap .menu_area .row_01 > li {
	width:100%;
	overflow:hidden;
	height:50px;
	background:#ffffff url('../images/gnb/gnb_arrow.png') no-repeat 95% 20px;
	background-size:20px;
	border-bottom:1px solid #171b28;
	}
.menu_wrap .menu_area .row_01 > li.selected {
	background:#204495 url('../images/gnb/gnb_arrow_on.png') no-repeat 95% 20px;
	color:#fff;
	background-size:20px;
	border-bottom:#171b28 1px solid;
	}
.menu_wrap .menu_area .row_01 > li.selected > a{color:#fff;}
.menu_wrap .menu_area .row_01 > li > a {display:block; width:100%; height:50px; line-height:50px; color:#333; text-indent:20px; font-weight:600; font-size:17px;}
.menu_wrap .menu_area .row_01 > li > ul {width:100%; height:0; background:#171b28;}
.menu_wrap .menu_area .row_01 > li > ul > li {
	width:100%;
	border-bottom:1px solid #1d3557;
	background:#171b28 url('../images/gnb/gnb_2depth.png') no-repeat 30px center;
	padding-left:10px;
	background-size:4px;
	}
.menu_wrap .menu_area .row_01 > li > ul > li > a {display:block; width:100%; height:40px; line-height:40px; color:#fff; text-indent:30px; font-size:15px; }
.menu_area .bottom_area{clear:both; width:100%; padding:20px 0; position:relative; overflow:hidden; background:#2b2f3e;}
.menu_area .bottom_area > ul {text-align:center; margin:0 5%;}
.menu_area .bottom_area li{display:inline-block; width:28%; margin:0 1%;}
.menu_area .bottom_area li a{display:block; border:1px solid #fff; color:#fff; font-size:16px; font-weight:500; height:30px; border-radius:15px;}


/* ==================================================
	lnb 메뉴
================================================== */
.sub_lnb_wrap {width:100%; height:50px; position:fixed; top:60px; left:0; z-index:200;}
.sub_lnb {/*max-width:640px;*/ min-width:320px; width:100%; height:50px; margin:0 auto; z-index:100; position:relative; }
.sub_lnb > div {width:50%; height:100%; float:left; position:relative; }
.sub_lnb > div.depths_01 {
	background:#ededed;
	border-right:1px solid #bcbcbc;
	color:#fff;
	border-bottom:1px solid #bcbcbc;
	}
.sub_lnb > div.depths_02 {
	background:#ededed;
	border-bottom:1px solid #bcbcbc;
	}
.sub_lnb > div.selected {
	background:#d4d4d4;
	}
.sub_lnb > div p.title {width:100%; height:100%;}
.sub_lnb > div p.title:after{content:'';display:block;clear:both;height:0;visibility:hidden;}
.sub_lnb > div p.title > .txt {display:block; line-height:50px; font-size:16px; letter-spacing:-1px; font-weight:800; color:#171b28; text-indent:20px; float:left;}
.sub_lnb > div p.title > .arrow {display:block; float:right; margin-right:20px; margin-left:30px;}
.sub_lnb > div p.title > .arrow img {width:15px; padding-top:20px;}

.sub_lnb > ul {width:50%; height:0; position:absolute; top:50px; overflow-y:auto; overflow-x:hidden;}
.sub_lnb > ul.lnb_ul li {width:100%; background:#171b28; border-bottom:1px solid #2f323e;}
.sub_lnb > ul.lnb_ul li > a {width:100%; height:45px; line-height:45px; font-size:15px; letter-spacing:-1px; display:block; text-indent:20px; color:#fff;}
.sub_lnb > ul.lnb_ul li.on {background:#204495; color:#fff;}
.sub_lnb > ul.lnb_ul li.on > a {}
.sub_lnb > ul.lnb_ul li > a:active {color:#fff; background:#204495;}

.sub_lnb > ul.ul_01 {left:0;}
.sub_lnb > ul.ul_02 {right:0;}
.sub_lnb > ul.ul_02 > li {width:100%; position:absolute; top:0; left:100%;}
.sub_lnb > ul.ul_02 > li.li_01 {left:0;}


/* 모바일CSS */
@media screen and (max-width:1024px){
	.moMenu{position:absolute; left:0; top:10px;}
	.moMenu img {width:40px;}
}

@media screen and (max-width:480px){
	.sub_lnb > div p.title > .txt {display:block; line-height:50px; font-size:14px; letter-spacing:-1px; font-weight:800; color:#171b28; text-indent:10px; float:left;}
	.sub_lnb > div p.title > .arrow {display:block; float:right; margin-right:10px;}
}

/* ==================================================
	내려오는 위치 메뉴
================================================== */
#subTopBar{
	width: 100%;
	height:62px;
	line-height:62px;
	border-bottom:1px solid #dcdcdc;
	}
#subNav {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	}
#subNav:after{display:block;content:'';clear:both;}
#subNav > li{
	display:block;
	float:left;
	position:relative;
	min-width:200px;
	}
#subNav > li:first-child::before{
	display:block;
	content:'';
	position:absolute;
	left:0;
	top:0;
	height:62px;
	border-right:1px solid #dcdcdc;
	}
#subNav > li:after{
	display:block;
	content:'';
	position:absolute;
	right:0;
	top:0;
	height:62px;
	border-right:1px solid #dcdcdc;
	}
#subNav > li.home{
	min-width:auto;
	width:56px;
	background:url('../images/gnb/home.gif') no-repeat center;
	text-indent:-9999em;
	}
#subNav > li.home a{background:none;}
#subNav > li > a{
	display:block;
	padding:0 40px 0 20px;
	background:url('../images/gnb/sub_arrow.png') no-repeat 90% center;
	font-size:12pt;
	color:#4d4d4d;
	}
#subNav > li:first-child > a {
	padding:0;
	}
#subNav > li > a:hover{color:#15a9d9;}
#subNav ul{
	display:none;
	position:absolute;
	top:0;
	left:-1px;
	right:0;
	padding:10px 0;
	background:#fff;
	border:1px solid #e5e5e5;
	z-index:9;
	box-shadow:2px 3px 5px 0px rgba(0,0,0,0.1);
	}
#subNav ul li a:hover{
	background:#f6f6f6;
	color:#15a9d9;
	}
#subNav ul li a{
	display:block;
	padding:10px 10px 10px 20px;
	font-size:12pt;
	line-height:120%;
	}
#subNav ul li:first-child a{
	padding-right:40px;
	background:url('../images/gnb/sub_arrow.png') no-repeat 90% center;
	}
#subNav ul li:first-child a:hover{
	background:#f6f6f6 url('../images/gnb/sub_arrow.png') no-repeat 90% center;
	}
#subTopBar > a{
	display:block;
	position:absolute;
	top:20px;
	width:32px;
	height:32px;
	text-indent:-9999em;
	}

a.act_on{color:#15a9d9;} /* 메뉴활성화시 색깔 */
li.l_menu1_blank , li.l_menu2_blank , li.l_menu3_blank{height:20px;} /* 중간사이 여백 */

.depth03 {
	min-width:280px !important;
	}

/* 모바일CSS */
@media all and (max-width:1023px){
	#subTopBar{
		margin-top:60px;
		height:40px;
		line-height:40px;
		background:#15a9d9;
		}
	#subNav > li{display:none;}
	#subNav > li > a{
		font-size:11pt;
		color:#fff;
		background:url('../images/gnb/sub_arrow_white.png') no-repeat 95% center;
		}
	#subNav > li > a:hover {
		color:#fff;
		}
	#subNav > li:nth-child(3){display:block;width:100%;}
	#subNav > li:after{display:none;}
	#subNav ul li a{padding:10px 5%; font-size:11pt;}
	#subNav > li > a{padding:0 5%;}
	#subNav ul{
		left:0;
		padding:0;
		border-top:1px solid  #e5e5e5;
		}
	#subNav ul li:first-child a{
		background:url('../images/gnb/sub_arrow.png') no-repeat 95% center;
		}
	#subNav ul li:first-child a:hover{
		background:#f6f6f6 url('../images/gnb/sub_arrow.png') no-repeat 95% center;
		}
}