@charset "utf-8";

/* ===============================================================
 * Company : (주)범일정보 http://bumil.co.kr/
 * File Name		 : layout.css
 * Description  :  All page Layout CSS.
 * Created	 : 2017.09.08 / Bumil / Design / JangJiHyun
=============================================================== */



#skipnav {display:none;}

body {min-width:1200px;}

/* 스킵 네비게이션 : 본문바로가기 */
#mainShortCut, #shortCut {overflow: hidden; position: relative; width: 100%; z-index:1000;}
#mainShortCut a , #shortCut a {display:block; font-size:0; width: 1px; height:1px; line-height: 0;margin: 0 -1px -1px 0;overflow: hidden;text-align: center;}

#mainShortCut a:focus,
#mainShortCut a:hover,
#mainShortCut a:active 
{width: auto; height: 20px; line-height: 1; margin: 0; padding: 8px 0 0 15px; background: #474747; color: #fff; font-size: 12px; font-weight: bold;}

#shortCut a:focus,
#shortCut a:hover,
#shortCut a:active 
{width: auto; height: 20px; line-height: 1; margin: 0; padding: 8px 0 0 15px; background: #474747; color: #fff; font-size: 12px; font-weight: bold;}





/* #head 상단메뉴 */
#head {
	position: relative;
	width: 100%;
	height: 65px;
	border-bottom: 1px solid #e5e5e5;
}
#head .logo {float: left;margin: 7px 0 0 0;}
#head .logo img {height: 46px;}




/* #head 네비 */
#head .naviWrap {
	width: 1200px; 
	height:64px; 
	margin: 0 auto;
} /*  background:url('../img/common/menu_bar.gif') left 64px repeat-x; */
#head .naviWrap.menu_active {
	padding:0 0 190px 0;
}
#head #navi {width: 900px;height:64px;margin:0 auto;box-sizing: border-box;float: right;}
#head #navi > ul > li {float:left; width:20%; text-align:center;  position:relative;}
#head #navi > ul > li > a {line-height:65px; font-size:23px; display:block; font-weight:600;}
#head #navi > ul > li > a .dot{display:inline-block; width:4px; height:4px; background:url("../../img/common/dot.png") left top no-repeat; margin: 0 6px 5px 6px;}
#head #navi > ul > li > a span { font-size:17px; font-weight: 600;}
#navi > ul > li:first-child > .depth02 {border-left:1px dashed #e3e3e3;}
#navi > ul > li > .depth02 {
	position: absolute;
	left: 0;
	z-index: 90;
	display: none;
	width: 100%;
	/* height: 210px; */
	height: 230px;
	border-right:1px dashed #e3e3e3;
	border-bottom:1px solid #e3e3e3; 
	background: #fff;
	text-align: left; 
	padding:19px 10px;
}
#navi > ul > li > .depth02 > li {margin:0 0 5px 0;  line-height: 20px; margin: 0 0 8px 0; background: url(../../img/common/li03bg.gif) no-repeat 0 .333em; padding: 0 0 0 13px; letter-spacing: -0.05em; }
#navi > ul > li > .depth02 > li:hover {font-weight:400;}
#navi > ul > li > .depth02 > li > a {font-size:15px;}
#navi > ul > li > .depth02 > li > a:hover {
	font-weight:500;
}
#navi > ul > li > a.active {color: #005aab; font-weight:800;} 
#head .naviWrap.menu_active .depth02 {
	display: block;
}
#navi > ul > li > a.active + .depth02 {
	background-color:#f8f8f8;
}
#navi > ul > li > a::after {
	z-index:999; 
	display:block; 
	visibility:hidden; 
	position:absolute; 
	top:59px; 
	left:0; 
	width:100%; 
	height:5px; 
	background-color:#1579ce; 
	content:''; 
	transform:scale(0); 
	transition:visibility 0.5s cubic-bezier(1, 0, 0, 1), transform 0.5s cubic-bezier(1, 0, 0, 1);
}
#navi > ul > li > a.active::after {
	visibility:visible;
	transform:scale(1);
}



/* sub layout */
#subContainer {width:100%; overflow: hidden;}
#subContainer #container {width:1200px; margin:55px auto 0; overflow: hidden;}

/* 서브 상단 공통  */
.sub_common{
	height: 180px; 
	background: #f3f5fa url("../images/sub/top_img01.gif") no-repeat 60% top;
	border-bottom: 1px solid #ebebeb; 
}
.cnt_wrap{width:1100px; height:100%;margin:0px auto;position:relative;}
.cnt_wrap:after{display:block;content:"";clear:both;}
.cnt_wrap a {
	height: 52px;
	padding-top: 20px;
	margin-top: 70px;
	font-size: 19px;
	font-weight: 600;
	overflow: hidden;
	opacity: 0.7;
}
.cnt_wrap a:first-child {
	float: left;
	background: url("../images/sub/top_prev.png") no-repeat center left; 
	padding: 14px 0 0 50px;
}
.cnt_wrap a:nth-child(2) {
	float: right;
	background: url("../images/sub/top_next.png") no-repeat center right; 
	padding: 14px 50px 0 0;
}
.cnt_wrap a:hover {opacity:1}
.cnt_wrap h3 {
	position: absolute;
	left: 300px;
	display: inline-block;
	vertical-align: middle;
	width: 500px; 
	padding-top: 65px;
	font-weight: 600;
	font-size: 36px;
	text-align: center;
}


/* 서브 메뉴 */
.sub_nav, .sub_nav ul, .sub_nav ul li{height:50px}
.sub_nav{background:#fafafa;border-bottom:1px solid #ebebeb; }
.sub_nav ul{width:1100px;margin:0px auto;}
.sub_nav ul li{float:left;border-right:1px solid #ebebeb;width:20%; box-sizing:border-box;}
.sub_nav ul li:first-child{border-left:1px solid #ebebeb}
.sub_nav ul li a{display:block; width:100%;height:100%; text-align:center;line-height:50px; font-size:17px;font-weight:400}
.sub_nav ul li:hover a{background:#fff; border-right:1px solid #f0f3f6; color:#144fa0}
.sub_nav ul li.on a{background:#235aa6; color:#fff; font-weight:600;}

.content {width:1100px; margin:55px auto; min-height:300px; box-sizing:border-box; padding:0 25px;}




/* footer */
#foot {
	width: 100%; 
	border-top: 1px solid #e7e7e7; 
	margin: 0 0 0 0;
	clear: both; 
}
#foot .footMenu {width:1200px;height: 50px; box-sizing: border-box; margin:0 auto; height:50px; line-height:50px;}
#foot .footMenu > .footList  {float:left;  }
#foot .footMenu > .footList * > span > a {font-weight:600; color:#004f90;}
#foot .footMenu > .footList  > li {float:left; font-size:15px; }
#foot .footMenu > .footList  * > a {border-right:1px dashed #d0d0d0; padding:0 15px;   }
#foot .footMenu > .footList  * > a:hover {font-weight:600;}
#foot .footMenu > .footList  > li:last-child > a{border:none;}
#foot .footMenu > div {float:right;}
#foot .footMenu > div > a {float:left; margin:11px 10px 0 0;}
#foot .footMenu > div > div {float:left; margin:0 0 0 15px;}
#foot .footMenu * > .face {display:block; width:25px; height:25px; background:url('../../img/common/icon_sns.gif') left top no-repeat; text-indent: -9999999px; }
#foot .footMenu * > .kakao {display:block; width:25px; height:25px; background:url('../../img/common/icon_sns.gif') right top no-repeat; text-indent: -9999999px; }

#foot .footMenu * > .site_go {position:relative; width:150px; margin:9px 0 0 0;}
#foot .footMenu * > .site_go > a {display:block; text-align:center; height:30px; line-height:30px;border: 1px solid #e7e7e7 }
#foot .footMenu * > .site_go > a:after {margin:0 0 2px 17px; width:10px; height:5px; content:''; display:inline-block; background:url('../../img/common/icon_go.png') right top no-repeat;  }
#foot .footMenu * > .site_go > a.site_open:after {background:url('../../img/common/icon_go.png') right bottom no-repeat;}
#foot .footMenu * > .site_go_list {display:none; width:100%; position:absolute; bottom:31px; border:1px solid #e7e7e7; box-sizing:border-box; background:#fff;}
#foot .footMenu * > .site_go_list > li {border-bottom:1px solid #e7e7e7; line-height:1.3em; box-sizing:border-box; padding:7px 10px; }
#foot .footMenu * > .site_go_list > li > a {font-size:13px; display:block;}
#foot .footMenu * > .site_go_list > li:hover {background:#fcfcfc;}
#foot .footMenu * > .site_go_list > li:last-child {border:none;}

/*
#foot > footer {
	position: relative;
	width: 100%; 
	padding: 25px 0;
	font-size: 14px;
	text-align: center;
	border-top: 1px solid #e7e7e7;
}
*/

#foot > footer {
	position: relative;
	width: 100%; 
	padding: 25px 0;
	font-size: 14px;
	text-align: center;
}

#foot > footer > address > b {
	padding: 0 0 0 15px;
	font-weight: 500;
}
/*20230607 씨유소프트 ldh 웹접근성으로 인해 색상 변경*/
#foot > footer > p {font-size:12px; /*color:#999;*/color: #8d8989; margin:10px 0 20px 0;}
#foot > footer > .mark_wa {position: absolute;left: 50%;top: 13px;width: 115px;margin-left: 320px;}
#foot > footer > .mark_kasfo {position: absolute;right: 50%;top: 13px;width: 150px;margin-right: 320px;}
#foot img {
	max-width: 100%;
	height: auto;
}

/* 레이아웃팝업 */
#layoutPopUp {	z-index:9999;background-color:#FFFFFF;padding: 10px;display:none;overflow: auto;}
#mask {	position:absolute;z-index:9000;background-color:#4A4848;display:none;left:0;top:0;}