@charset "utf-8";
@viewport { width: device-width; }
header{display: block;   position: fixed;width: 100%; z-index: 9999999;}

#nav{width: 100%; position: relative; height: 40px; background: #ececec; color: #FFF;}
#nav li{width: 116px; display: inline-block; }
#nav li a{display: block; text-align: center; line-height: 40px; letter-spacing: -.05em; font-size: 13px; color: #FFF; font-weight: 700; }
#navLeft{float: left;}
#navLeft li{background: #1B57B1; float: left;}
#navLeft li:first-child{border-left: 1px solid #e2e2e2;}
#navLeft li:nth-child(2){background-color: #005A7C;}
#navLeft li:nth-child(3){background-color: #A82744;}
#navRight{float: right;}
#navRight ul li{float: left;}
#header{height: 70px; display: block; position: relative; background: #FFF; border-bottom: 1px solid #cccccc;}
#headerCont{height: 70px; display: block; position: relative;}
#logo{display: inline-block; position: relative; width: 320px;}
#topMenu{float: right; position: absolute; top: 0; right: 0; width: calc(100% - 340px);}
#mobile_menu{display: none; height: 32px; background: url(../images/common/menu.png); background-repeat: no-repeat; background-position: right; position: absolute; right: 15px; width: 32px; top: 20px; cursor: pointer;}
#mobile_menu_wrap{ position: fixed; width: 300px; height: 99999px; right: 0; top: 0; background: rgba(0,0,0,0.7); z-index: 10; display: none;}
#mobile_menu_close{height: 32px; background: url(../images/common/close.png); background-repeat: no-repeat; background-position: center; background-size: 20px 20px; position: absolute; right: 15px; width: 32px; top: 20px; background-origin: padding-box; border: 2px solid #999; cursor: pointer;}
#mobile_menu_wrap > ul{display: block !important; margin-top: 60px; }
#mobile_menu_wrap > ul > li{padding-top: 10px; padding-bottom: 10px; border-top: 1px solid #999;     border-collapse: collapse;}
#mobile_menu_wrap > ul > li:last-child{border-bottom: 1px solid #999;}
#mobile_menu_wrap ul li a{color:#FFF; font-size: 20px; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; cursor:pointer;}

#mobile_menu_list > li > ul{display: none;}
.mobile_menu_sub{display: none; margin-top: 15px; background: rgba(100,100,100,0.7);}
.mobile_menu_sub li{padding: 10px; }
/* computer */
@media only screen 
and (min-width : 1025px) {
	

	/* 	#pcMenu > ul{display: block; position: relative; line-height: 70px;}
	#pcMenu > li{width: 180px; display: inline-block; text-align: center; float: left; line-height: 70px; }
	#pcMenu > li > a{display: block; font-size: 16px; text-align: center; font-weight: 600; white-space: nowrap; color: #333;}
	#pcMenu li ul:hover{display: block;} 
	#pcMenu li a:hover + ul{display: block;} 
	#pcMenu > li > a:hover{color: #034ea2;}  */
	/* 	#topMenuSub{background: #FFFFFF; height: 267px; width: 100%; top: 69px; position: absolute; display: block; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; z-index: 9999;}
	#topMenuSubCont{width: 100%; height:100%; margin: 0 auto; background: #f8f8f8;}
	.subMenuHeader{display: block; height: 265px; width: 360px; float: left; background: #f8f8f8;}
	.subMenuHeader .stitle:after{content: ""; display: block; width: 80px; height: 3px; background: #034ea2; margin: 20px auto;}
	.subMenuHeader .stitle{color: #034ea2; font-size: 28px; text-align: center; display: block; padding-top: 75px; font-weight:700; }
	.subMenuHeader .stxt{font-size: 23px; letter-spacing: -0.01px; display: block; text-align: center; font-weight: 300;} */
	/* 	#pcMenu{float:left;}전체 메뉴를 float 시킴
	#pcMenu > li{float:left;}   1단 메뉴를 일렬로 늘어놓기
	#pcMenu ul{display:none;}  2단, 3단 메뉴를 숨기기
	#pcMenu li:hover > ul {display:block;}  주 메뉴에 마우스 오버했을 때 부 메뉴 드러내가
	.subMenu{position:absolute;left:840px; top: 70px; }  
	.subMenu2{position:absolute;left:840px; top: 70px; }  
	.subMenu3{position:absolute;left:840px; top: 70px; }  
	ul li a{text-decoration:none; display:block; line-height: 70px;text-align:center;} 
	#pcMenu  li {width:180px;}  
	#pcMenu li:hover{background-color:#EAEAEA;}  */
	ul, li {
		margin: 0;
		padding: 0;
	}

	#pcMenu {
		width: 900px;
		margin: 0 auto;
		position: relative;
		line-height: 1;
		text-align: left;
	}
	#pcMenu li {
		width: 20%;
    	text-align: center;
		list-style: none;
		float: left;
		position: relative;
		line-height: 70px;
	}
	.subMenu li{
		width: 100% !important;
	}
	#pcMenu ul {
		display: none;
		position: absolute;
		top: 70px;
		left: 0;
	}
	* html #pcMenu ul {
		line-height: 0;
	}
	#pcMenu ul li {
		float: none;
	}
	#pcMenu ul {
		width: 180px;
	}
	#pcMenu ul ul {
		top: 0;
		left: -180px;
	}
	#pcMenu ul a {
		display: block;
		background: #FFF;
		padding: 6px;
		border-bottom: 1px solid #FFF;
/* 		opacity: 0.7; */
		/* filter: alpha(opacity = 90); */
		zoom: 1;
		padding: 0 10px;
		line-height: 35px;
		text-align: left;
		font-size: 13px;
	}
	#pcMenu ul a.hover {
		background: #054d74;
		color: #FFF;
	} /* 추가 */
	#pcMenu a {
		padding: 5px 10px;
	}

	/* .subMenu{display: none; height: 100%; width: 150px; margin: 0 20px; float: left; }
	.subMenu > li{line-height: 35px; text-align: left; text-indent: 15px; border-right: 1px solid #cccccc; background: #FFF;}
	.subMenu > li > a {font-size: 14px; display: block;}
	.subMenu > li > a:hover {font-size: 14px; background: #054d74; color: #FFFFFF;}
	
	.subMenu2{display: none; height: 100%; width: 150px; margin: 0 20px; float: left; position: relative; left: -170px; top: -35px;}
	.subMenu2 > li{line-height: 35px; text-align: left; text-indent: 15px; border-right: 1px solid #cccccc; background: #FFF;}
	.subMenu2 > li > a {font-size: 14px; display: block;}
	.subMenu2 > li > a:hover {background: #054d74; color: #FFFFFF;}
	
	.subMenu3{display: none; height: 100%; width: 150px; margin: 0 20px; float: left;  position: relative; left: -170px; top: -35px;}
	.subMenu3 > li{line-height: 35px; text-align: left; text-indent: 15px; border-right: 1px solid #cccccc; background: #FFF;}
	.subMenu3 > li > a {font-size: 14px; display: block;}
	.subMenu3 > li > a:hover {background: #054d74; color: #FFFFFF;} */
	#mobile_menu{display: none !important;}
}

/* tablet */
@media only screen
and (min-width : 768px)  
and (max-width : 1024px){  
	#pcMenu{display: none !important;}
	#topMenuSub{display: none !important;}
	.subMenu{display: none !important;}
	#slider{width: 100%;}
	#mobile_menu{ display: block;}
	#mobile_menu_wrap{display: none;}
	#footer{padding-left: 5%;}
}

/* mobile */
@media only screen
and (max-width: 768px) {
	#pcMenu{display: none !important;}
	#topMenuSub{display: none !important;}
	.subMenu{display: none !important;}
	#slider{width: 100%;}
	#mobile_menu{ display: block;}
	#mobile_menu_wrap{display: none;}
	footer{padding-left: 5%;}
	footer #fnb li a{line-height: 30px !important;}
	#content h3{font-size: 22px;}
	#content h4{font-size: 20px;}
	#subTitle{background-attachment: inherit;}
	#subTitle2{background-attachment: inherit;}
	#subTitle3{background-attachment: inherit;}
	#subTitle4{background-attachment: inherit;}
	.column1 li{font-size: 11px;}
	
}


/* footer */
footer{clear:both;position:relative;width:100%;padding-bottom:30px;background-color:#e1e2e4;z-index:2; border-top: 1px solid #d0d1d3;  height: 150px; padding-left: 15px;}
footer #fnb li{display:inline-block}
footer #fnb li span{color:#837873;}
footer #fnb li a{display:block;font-size:14px;line-height:40px;text-decoration:none}
footer #fnb li a:hover{text-decoration:underline}
footer #fnb li a strong{color:#2379e9;}
footer .copyright{font-size:14px;color:#837873;line-height:150%}
footer .copyright br{display:none}
footer .copyright2{padding-top:5px}
footer .copyright3{padding-top:10px}
footer .pull-right{padding-top:3%}
footer #footerSns{display:inline-block;padding-right:10px;vertical-align:middle}
footer #footerSns a{display:inline-block;width:35px;height:35px;border-radius:100%;text-align:center}
footer #footerSns a:hover{background-color:#000}
footer #footerSns a img{margin-top:7px}
footer #footerLink{display:inline-block;position:relative;width:145px;border:1px solid #999;vertical-align:middle}
footer #footerLink h2{font-size:14px;padding-left:10px;color:#999;line-height:30px}
footer #footerLinkLst{overflow:auto;display:none;position:absolute;bottom:30px;z-index:9;width:145px;height:300px;border:1px solid #999;background-color:#fff}
footer #footerLinkLst a{display:block;font-size:13px;color:#888;text-decoration:none}
footer #footerLinkLst a:hover{color:#000;text-decoration:underline}
footer #footerLinkLst h3{padding:10px;border:1px solid #ddd;border-width:1px 0;background-color:#0a7dca;font-size:15px;font-weight:700;color:#fff}
footer #footerLinkLst>ul>li>a{padding:15px 10px;font-weight:700;color:#111}
footer #footerLinkLst>ul>li>ul{}
footer #footerLinkLst>ul>li>ul>li{}
footer #footerLinkLst>ul>li>ul>li>a{padding:10px;background-color:#aaa;font-weight:700;color:#fff}
footer #footerLinkLst>ul>li>ul>li>ul{padding:10px;background-color:#f7f7f7}
footer #footerLinkLst>ul>li>ul>li>ul>li>a{padding:2px 0}
footer #footerLinkLst .footerLinkLst2{padding:10px 0}
footer #footerLinkLst .footerLinkLst2>li>a{padding:3px 10px;font-size:13px;font-weight:400;color:#888}
footer #footerLinkLst .footerLinkLst2>li>a:hover{color:#000;text-decoration:underline}

#popupWrap{position:relative;z-index:998;width:100%;max-width:1400px;margin:0 auto}