﻿@charset "utf-8";
/* ==================================================
	header
================================================== */
#header{
	width:100%;
	position:fixed;
	z-index:90;
	top:0;
	min-width:320px;
	margin:0;
	padding:0;
	height:80px;
	background:#fff;
	box-shadow: 0 4px 4px 0 rgba(0,0,0,0.15);
	border-bottom:1px solid #d9d9d9 !important;
	}
.header_con{
	position:relative;
	width:100%;
	max-width:1200px;
	margin:0 auto;
	}


/* 로고위치 */
#header h1{
	float:left;
	margin-top:20px;
	width:25%;
	}

#header .nav{
	position:relative;
	width:100%;
	max-width:720px;
	margin:0 auto;
	z-index:80;
	padding-left:1%;
	}
#header .nav > ul > li {
	float:left;
	width:20%;
	height:63px;
	}
#header .nav > ul > li a:hover{color:#204495}
#header .nav > ul > li a{color:#171b28; display:block; font-size:14pt; line-height:63px; text-align:center;  font-weight:600;}
#header .nav > ul > li.on a{ color:#204495;}
#header .nav > ul > li.es{}
#header .nav > ul > li.es > a{background:rgb(204,0,0); color:#fff;}
#header .nav > ul > li.es > a:hover{background:inherit; color:#204495}
#header .nav > ul > li.over > a{}
#header .nav > ul > li.over > a { background:inherit; color:#204495;  }
#header .nav > ul > li > .sm{
	padding:20px 0;
	border-left:1px solid #dedede;
	height:195px;/* 선높이 */
	display:none;
	}
#header .nav > ul > li:last-child > .sm{ border-right:1px solid #dedede;}
#header .nav > ul > li > .sm > ul > li a{
	color:#7f8085;
	font-size:12pt;
	font-weight:400;
	line-height:30px;
	}
#header .nav > ul > li.es > .sm > ul > li a{color:#d22425;}
#header .nav > ul > li > .sm > ul > li a:hover{background:#204495; color:#fff;}
#header .smBg{
	position:absolute;
	left:0;
	top:92px;
	background:#fff;
	width:100%;
	height:195px;/* 내려오는 슬라이더 높이 */
	z-index:70;
	display:none;
	border-bottom:1px solid #ededed;
	}

@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:1250px){
	#header .nav {
		max-width: 600px;
		}
	#header .nav > ul > li a {
		font-size: 12pt;
		}
}
@media screen and (max-width:1100px){
	#header .nav {
		max-width: 530px;
		padding-left:3%;
		}
}
@media screen and (max-width:1024px){
	#header{
		height:60px;
		}
	#header h1{
		position:relative;
		text-align:center;
		width:100%;
		top:12px;
		left:0;
		margin-top:0;
		}
	#header .header_con{position:relative; width:95%; margin:0 2.5%;}
	h1 img{height:35px;}
	/* 메뉴 TOP */
	#header_top {
		display:none;
		}
}

/*** 언어선택 ***/
.lang {
	position:absolute;
	right:0;
	}
.lang li {
	float:left;
	line-height:80px;
	color:#999999;
	}
.lang li:first-child {
	color:#204291;
	}
.lang li:after{content:'';display:block;clear:both;height:0;visibility:hidden;}
.lang li a {
	padding:1px 10px;
	font-family:'Bnoto';
	font-size:11pt;
	}
.lang li:last-child {
	max-width:80px;
	margin-left:10px;
	background:#204291;
	}
.lang li:last-child a {
	padding:0;
	}

/* 모바일 및 탭 */
@media all and (max-width:1023px) {
	.lang {
		position:absolute;
		right:75px;
		top:32px;
		}
}
@media all and (max-width:400px) {
	.lang {
		right:55px;
		}
}

/*** 탑사이트맵 ***/
.t_sitemap {
	/*position:absolute;
	right:0;
	top:25px;*/
	}
.t_sitemap i {
	font-size:40px;
	color:#ffffff;
	background:#204291:
	}
/* 모바일 및 탭 */
@media all and (max-width:1023px) {
	.t_sitemap {
		display:none;
		}
}

/*** gnb ***/
.gnb_area {
	float:left;
	width:50%;
	/*max-width:750px;*/
	margin: 0 auto;
	z-index: 80;
	}
.logo {
	float:left;
	margin-top: 0;
	margin-bottom:0;
	width:29%;
	padding: 30px 0 0;
	}
.logo img{
	width:100%; 
	max-width: 348px;
	}
.gnb {
	position:relative;
	}
.gnb > li {
	float:left;
	position:relative;
	padding:0 0  0 16%;
	}
.gnb > li:first-child {
	padding-left:0;
	}
.gnb > li > a {
	display:block; 
	font-size: 15pt;
	font-family:'Rnoto';
	color: #333;
	}
.gnb > li:hover > a, .gnb > li:active > a, .gnb > li.active > a, .gnb > li:focus > a {
	color:#005AAB;
	text-decoration:none;
	}
.gnb > li > a span {
	position:relative;
	display:block;
	line-height:80px;
	}
.gnb > li > a span:after {
	position:absolute;
	display:block;
	content:'';
	width:100%;
	height:2px;
	left:0;
	bottom:13px;
	background:#005AAB;
	transition:all .2s;
	transform:scaleX(0);
	}
.gnb > li.active > a span:after {
	transform:scaleX(1);
	}
.gnb_sub {
	display:none;
	position:absolute;
	left:70px;
	}
.gnb_sub1 {
	left:-38px;
	}
.gnb_sub2 {
	left:60px;
	}
.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:#fff;
	border-top:1px solid #00407a;
	border-left:1px solid #00407a;
	border-right:1px solid #00407a;
	background-color:#005AAB;
	}
.gnb_sub > li > a.on {
	background: url('../images/gnb/icon_navi.png') #2f586e;
	background-repeat:no-repeat;
	background-position:140px -18px;
	color: #fff;
	}
.gnb_sub3 > li > a, .gnb_sub4 > li > a {
	width:130px;
	}
.gnb_sub > li:last-child > a {
	border-bottom:1px solid #0b216d;
	}
.gnb_sub > li > a:hover, .gnb_sub > li > a:active, .gnb_sub > li > a:focus {
	background-color:#00407a;
	color:#fff;
	text-decoration:none; 
	}

/* 모바일 및 탭 */
@media all and (max-width:1200px) {
	.gnb > li > a {
		font-size: 12pt;
		}
	.logo img {
		max-width: 350px;
		}
	.gnb_area {
		max-width: 650px;
		}
}

@media all and (max-width:1023px) {
	.gnb_area{
		height: 80px;
		padding:0 20px;
		}
	.logo {
		width:100%;
		margin-top:30px;
		padding:0;
		max-width: 300px;
		}
	.tlink_mnone {
		display:none;
		}
}

@media all and (max-width:640px) {
	.logo {
		width:80%;
		max-width: 260px;
		}
	}
/* 서브메뉴 가로위치
ul.gnb li ul.gnb_sub1 {
	left:10px;
	}
ul.gnb li ul.gnb_sub2 {
	
	}
ul.gnb li ul.gnb_sub5 {
	left:-10px;
	} */

/* 서브화면 - 서브메뉴 */
#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_sub2 > li:first-child > .ssub_menu {
	width:210px;
	left:160px;
	}
.gnb_sub2 > 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:#fff;
	}
.sub_lnb > div p.title {width:100%; height:100%;}
.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;}


/* 모바일 및 탭 */
@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;}
}

/* ==================================================
	lnb
================================================== */
.li2 li{width:50%;}
.li3 li{width:33.333%;}
.li4 li{width:25%;}
.li5 li{width:20%;}
.li6 li{width:16.666%;}
.li7 li{width:14.285%;}
.li8 li{width:12.5%;}
.li9 li{width:11.111%;}
.li10 li{width:10%;}

.lnb{
	position:absolute;
	bottom:32px;
	width:100%;
	height:55px;
	line-height:55px;
	}
.lnb > ul {
	width:100%;
	max-width:1200px;
	margin:0 auto;
	}
.lnb > ul > li{
	float:left;
	position:relative;
	padding-left:1%;
	}
.lnb > ul > li:first-child{
	padding-left:0;
	}
.lnb > ul > li a{
	display:block;
	text-align:center;
	font-size:18px;
	font-family:'Rnoto';
	border:1px solid rgba(255,255,255,0.7);
	color:#fff;
	}
.lnb > ul > li a:hover{
	background:rgba(0,119,205,0.6);
	border:1px solid rgba(255,255,255,0.7);
	}
.lnb > ul > li.on a{
	background:rgba(0,119,205,0.6);
	border:1px solid rgba(255,255,255,0.7);
	}

@media screen and (max-width:1440px){
	.lnb > ul > li a{font-size:16px;}
}
