@charset "utf-8";

/* layout */

/* header */
#headerWrap { position:relative; width:100%; /* padding-bottom:60px; */ background:#fff; z-index:900}
.header { width:100%; /* padding-right:200px;*/ border-bottom:1px solid #6e7176}
.header .headerTop { position:relative; max-width:1200px; height:80px; margin:0 auto; padding:30px 10px 0;}
.header .headerTop h1 { text-align:center; line-height: 80px; margin: 0; padding: 0; }
.mbIconNav { display: none}
.mbIconSearch { display: none}
.fix-layout		{ max-width: 1100px; padding: 0; margin: 0 auto; } 
.lang-box		{ }

/* Default Layout */
.gnbWrap { position:absolute; top: 110px; width:100%; z-index:999;}
#navWrap { position:relative; height: 45px; background: #4666a6 !important; overflow: hidden; }
#gnb_site_menu { position: relative; max-width: 1200px; margin: 0 auto; padding:0; z-index: 11; background: #4666a6; }
#gnb_site_menu:after { content: ""; display: block; position: relative; clear: both; }
#gnb_site_menu ul,
#gnb_site_menu li	{ display: block; margin: 0; padding: 0; list-style: none; }
#gnb_site_menu .menu-clear { display: block; border: none; clear: both; padding: 0; margin: 0; height: 0; }
.mobileTop { display:none}

/*
#gnb_site_menu a[href*="http"]:after, 
#gnb_site_menu a[target="_blank"]:after,
#gnb_site_menu a[title*="�� â"]:after, 
#gnb_site_menu a[title*="�˾�"]:after { content: ""; display: inline-block; width: 25px; height: 20px; background:url(/resource/img/ui/icon_button_b.png) no-repeat right -434px; vertical-align: middle; margin-left: 10px; }
#gnb_site_menu .ico-menu a:after	{ display: none; }
*/
/* 1 Depth */
#gnb_site_menu > ul { position: relative; padding: 0;  max-width:1200px; margin:0 auto; }
#gnb_site_menu > ul > li { float: left; height: 45px; overflow: hidden; }
#gnb_site_menu > ul > li > a { display: block; position: relative; height: 45px; font-size: 17px; font-weight: bold; color: #000; line-height: 45px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/** 1 Depth Color Set */
#gnb_site_menu > ul > li								{ width: 25%; } /* �⺻ ���� */
#gnb_site_menu > ul > li > a							{ background: #4666a6; color: #fff; }


/* 2 Depth */
#gnb_site_menu > ul > li > ul { display: none; position: absolute; top: 45px; left: 0; right: 0; padding: 0; overflow: hidden; }
#gnb_site_menu > ul > li.on > ul { display: block; padding: 0; }
#gnb_site_menu > ul > li > ul > li	{ width: 25%; float: left; padding: 20px 0; }
#gnb_site_menu > ul > li > ul > li:before	{ content: ""; position: absolute; top: 30px; bottom: 20px; width: 1px; background: #dedede; }
#gnb_site_menu > ul > li > ul > li:first-child:before	{ left: -5px; }
#gnb_site_menu > ul > li > ul > li > a { display: block; position: relative; margin: 0;  text-align: left; padding: 0 20px; height: 40px; line-height: 40px; font-size: 18px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#gnb_site_menu > ul > li > ul > li.gnb-clear	{ width: 100%; float: none; clear: both; margin: 0; padding: 0; height: 0px; }

/* 3 Depth */
#gnb_site_menu > ul > li > ul > li > ul { display: block; position: relative; padding: 0 20px; }
#gnb_site_menu > ul > li > ul > li > ul > li { position: relative; }
#gnb_site_menu > ul > li > ul > li > ul > li:hover > a, #gnb_site_menu > ul > li > ul > li > ul > li.on > a { }
#gnb_site_menu > ul > li > ul > li > ul > li:hover > a:first-child,
#gnb_site_menu > ul > li > ul > li > ul > li:focus > a:first-child,
#gnb_site_menu > ul > li > ul > li > ul > li.on > a:first-child { /*background:url(/resource/images/cmm/bl_01.gif) no-repeat 0 17px #eee*/ }
#gnb_site_menu > ul > li > ul > li > ul > li > a	 { display: block; position: relative; height: 25px; line-height: 25px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #222222; font-size: 14px; }
#gnb_site_menu > ul > li > ul > li > ul > li > a.btn-sub-menu { display: none; }
#gnb_site_menu > ul > li > ul > li > ul > li  a:hover, 
#gnb_site_menu > ul > li > ul > li > ul > li  a:focus { color:#000;}

#gnb_site_menu > ul > li > ul > li > ul li.has-sub-menu > a	{ margin-right: 29px; }
#gnb_site_menu > ul > li > ul > li > ul li.has-sub-menu > a.btn-sub-menu { display: block; position: absolute; width: 29px; height: 29px; top: 0; right: 0; margin: 0; text-indent: -999px; overflow: hidden; }
a.btn-sub-menu:before { content: ""; display: block; position: relative; width: 100%; height: 100%; text-indent: 0; line-height: 29px; text-align: center; font-size: 16px; color: #5d5d5d; background:url(/resource/images/cmm/accd_plus.gif) no-repeat center; }
#gnb_site_menu > ul > li > ul > li > ul li.on > a.btn-sub-menu:before { background:url(/resource/images/cmm/accd_minus.gif) no-repeat center;}


/* 4 Depth after */
#gnb_site_menu > ul > li > ul > li > ul > li ul { display: none; position: relative; }
#gnb_site_menu > ul > li > ul > li > ul li.on > ul	{ display: block; padding:5px 0; margin:5px 0; border-bottom: 1px solid #dadada; _border:1px solid red}
#gnb_site_menu > ul > li > ul > li > ul > li ul li { position: relative; background:url(/resource/images/cmm/bl_02.gif) no-repeat 8px 10px; }
#gnb_site_menu > ul > li > ul > li > ul > li ul li a	{ display: block; position: relative; line-height: 25px; text-indent: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #6f726e; _border-bottom: 1px solid #dadada; }

#gnb_site_menu > ul > li > ul > li > ul li.on > ul ul { margin-left:10px; border-top: 1px solid #dadada; border-bottom: 1px solid #dadada}

#gnb_site_menu .btn-menu-close		{ display: block; position: absolute; bottom: 0; right: 0; width: 10px; height: 10px; overflow: hidden; text-indent: -999px; }

/* Background */
#mnb_background_area { position: absolute; top: 0px; left: 0; right: 0; bottom: 0; z-index: 10; }
#mnb_background_area:before	{ content: ""; display: block; position: absolute; top: 45px; height: 0px; left: 0; right: 0; background: #fff; }
#mnb_background_area:after	{ content: ""; display: block; position: absolute; top: 45px; bottom: 0px; left: 0px; right: 0px; background: #fff; border-bottom: 4px solid #083388; z-index: 0; }
#mnb_background_area span { display: block; position: relative; margin-top: 45px; height: 1px; background: #dedede; z-index: 1;  }
#mnb_background_area span:before	{ content: ""; display: block; position: absolute; top: 0; left: 50%; right: 0; margin-left: -32px; width: 65px; height: 1px; background: #083388; }
#mnb_background_area.on span {  }


#headerWrap:before		{ content: ""; display: block; position: absolute; height: 29px; border-bottom: 1px solid #e3e3e3; top: 0; left: 0; right: 0; }
.lang-box				{ position: absolute; top: 0; left: 0; right: 0; height: 29px; }
.lang-box > .navi		{ float: right; line-height: 30px;}
.lang-box > .navi li	{ float: left; margin-left: 10px; }
.lang-box > .navi li a	{ font-size: 12px; color: #898989; }

.lang-box #tnb			{ position: absolute; right: 0; top: 30px; height: 80px; text-align: center; }
.lang-box #tnb ul		{ float: right; }
.lang-box #tnb li		{ float: left; padding: 0 20px; line-height: 80px; }
.lang-box #tnb li a		{ color: #777777; font-weight: 300; }


/** ��� �Ѹ� ��� */
#top_banner	{ position: absolute; top: 30px; left: 0; width: 260px; height: 80px; overflow: hidden; }

.tb-control-paging					{ display: none; }
.tb-direction-nav					{ position: absolute; width: 58px; height: 20px; right: 10px; bottom: 10px; }
.tb-direction-nav li				{ float: left; }
.tb-direction-nav li.tb-nav-next	{ float: right; }
.tb-direction-nav a					{ display: block; position: relative; width: 20px; height: 20px; overflow: hidden; text-indent: -999px; background: url('/resources/images/home/cmm/btn_split_topbanner.png') no-repeat 0 0; }
.tb-direction-nav a.tb-next			{ background-position: 100% 0; }
.tb-pauseplay						{ position: absolute; bottom: 10px; right: 30px; }
.tb-pauseplay a						{ display: block; position: relative; width: 20px; height: 20px; overflow: hidden; text-indent: -999px; background: url('/resources/images/home/cmm/btn_split_topbanner.png') no-repeat -18px 0; }


#footerWrap		{ position: relative; clear: both; border-top:1px solid #dbdbdb;}

.foot-nav		{ position: relative; background: #dbdbdb; height: 34px; border-bottom: 1px solid #cfcfcf; }
.foot-nav a		{ font-weight: 600; line-height: 34px; }
.foot-nav ul	{ display: block; max-width:1100px; margin: 0 auto; padding: 0 10px; }
.foot-nav li	{ position: relative; padding: 0 15px; float: left; }
.foot-nav li:before	{ content: ""; display: block; position: absolute; left: 0; top: 50%; margin-top: -5px; height: 10px; width: 1px; background: #fafafa; }
.foot-nav li:first-child	{ padding-left: 0; }
.foot-nav li:first-child:before	{ display: none; }


.footer	{ display: block; max-width:1100px; margin: 0 auto; padding: 20px 10px; }

#footer_logo,
.type-address,
.rel-site		{ float: left; }

#footer_logo	{ margin-right: 45px; }

.type-address .item		{ float: left; position: relative; padding-left: 45px; color: #747474; }
.type-address .item i	{ display: block; position: absolute; top: 0; left: 0; width: 40px; height: 40px; line-height: 40px; background: #3d3d3d; border-radius: 9.0em; overflow: hidden; text-align: center; color: #fff; font-size: 12px; }
.type-address .col-1		{ float: left; }
.type-address .item p		{ padding-left: 16px; margin-right: 25px; }
.type-address .item p.ico-marker	{ background: url('/resources/images/home/cmm/ico-map.png') no-repeat 0 50%; }
.type-address .item p.ico-tel		{ background: url('/resources/images/home/cmm/ico-tel.png') no-repeat 0 50%; }
.type-address .item p.ico-fax		{ background: url('/resources/images/home/cmm/ico-fax.png') no-repeat 0 50%; }

.rel-site		{ float: right; }
.rel-site fieldset	{ margin-bottom: 5px; }
.rel-site select	{ width: 110px; border: 1px solid #a7a6a2; height: 25px; }
.rel-site button	{ color: #3c4652; font-size: 12px; line-height: 25px; text-align: center; border: 1px solid #a7a6a2; height: 25px; padding: 0 6px;  }

#copyright	{ clear: both; color: #999999; }

#container	{ /*padding-top: 44px*/}

/* desktop */
@media all and (max-width:1280px) {
	.header .headerTop { position:relative; max-width:1024px;}
	#gnb_site_menu	 { position: relative; max-width:1280px; margin:0 auto; padding:0; z-index: 11; /* border-top: 1px solid #686b70; border-bottom: 1px solid #f2f2f2;*/ }
	.searchWrap .btnSearch { left:0; }
	.natinalFlag { position:absolute; top:15px; left:22%; width:8%; }
	#userLink .userList {_max-width:1020px; }
	#userLink .userList li { float:left; width:45%; padding:0.3em 0 0 5px; margin-right:2%; background:url(/resource/images/cmm/bl_02.gif) no-repeat 0 12px;}
}

/* tablet */
@media all and (max-width:1000px) {

	/* header */
	.header .headerTop { height:89px; }
	.header .headerTop h1 { line-height: 89px; }
	.header .headerTop h1 img { max-height: 80%; }

	#headerWrap:after	{ content: ""; display: block; position: absolute; left: 0; right: 0; bottom: 0; height: 9px; background: #4666a6; }

	
	/* Default Layout */
	#gnb_site_menu { display: block; background: transparent; }
	.on #gnb_site_menu { display: block; }
	.mbIconNav { display: block; position:absolute; top:50px; left:10px}
	.mbIconNav a { display:block; width:40px; height:40px;}
	.mbIconNav a img { width:40px; height:40px;}
	.mbIconSearch { display: block; position:absolute; top:50px; right:10px}
	.mbIconSearch a { display:block; width:40px; height:40px; }
	.mbIconSearch a img { width:40px; height:40px;}

	#navWrap	{ display: none; overflow: visible; background: transparent !important;  height: auto; }
	#navWrap #mnb_background_area		{ display: none !important; }
	#gnb_site_menu > ul > li.on > ul	{ height: auto; margin: 0; }
	#gnb_site_menu { width: 100%; min-width: 320px; }
	#gnb_site_menu li	{ width: 100% !important; float: inherit !important ; box-sizing: border-box; }

	/* 1 Depth */
	#gnb_site_menu > ul { position: relative; max-width: 768px; margin: 0 auto;  padding:0; background:#fff; }
	#gnb_site_menu > ul > li { float: left; height: auto; min-height: 50px; position: relative; }
	#gnb_site_menu > ul > li > a { display: block; position: relative; height: 50px; font-size: 14px; font-weight: 500; color: #555; border-right:none; line-height: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: #fff; text-align: left; padding: 0 10px; }
	#gnb_site_menu > ul > li:first-child > a { border-left: none; }
	#gnb_site_menu > ul > li.on > a	{ background: #4666a6; color: #fff; }
	#gnb_site_menu > ul > li.has-sub-menu > a.btn-sub-menu { display: block; position: absolute; width: 50px; height: 50px; top: 0; right: 0; margin: 0; text-indent: -999px; overflow: hidden; }
	#gnb_site_menu > ul > li.on > a.btn-sub-menu:before { background:url(/resource/images/cmm/accd_minus.gif) no-repeat center;}

	/** 1 Depth Color Set */
	#gnb_site_menu > ul > li > a { border-bottom: 1px solid #cccccc }

	/* 2 Depth */
	#gnb_site_menu > ul > li > ul { display: none; position: relative; top: 0; padding:0 0 10px; overflow: hidden; z-index:2; }
	#gnb_site_menu > ul > li.on > ul { display: block; background:#efefef; }
	#gnb_site_menu > ul > li > ul > li		{ padding: 0; }
	#gnb_site_menu > ul > li > ul > li:before	{ display: none; }
	#gnb_site_menu > ul > li > ul > li > a	{ font-size: 12px; font-weight: 400; color: #333333; line-height: 30px; height: 30px; }
	#gnb_site_menu > ul > li > ul > li > a:hover,
	#gnb_site_menu > ul > li > ul > li.on > a		{ coloR: #083388; }

	/* 3 Depth */
	#gnb_site_menu > ul > li > ul > li > ul { display: none; position: relative; margin-top: 0px; padding: 0 10px; border-right:1px solid #dadada }
	#gnb_site_menu > ul > li > ul > li.on > ul { display: block; }
	#gnb_site_menu > ul > li > ul > li > ul > li { position: relative; background:url(/resource/images/cmm/bl_01.gif) no-repeat 0 17px; }
	#gnb_site_menu > ul > li > ul > li > ul > li:hover > a, #gnb_site_menu > ul > li > ul > li > ul > li.on > a { background:#eee;}
	#gnb_site_menu > ul > li > ul > li > ul > li:hover > a:first-child,
	#gnb_site_menu > ul > li > ul > li > ul > li:focus > a:first-child,
	#gnb_site_menu > ul > li > ul > li > ul > li.on > a:first-child { background:url(/resource/images/cmm/bl_01.gif) no-repeat 0 17px #eee}
	#gnb_site_menu > ul > li > ul > li > ul > li > a	 { display: block; position: relative; height: 35px; line-height: 35px; text-indent: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-bottom: 1px solid #dadada; color: #565457; }
	#gnb_site_menu > ul > li > ul > li > ul > li > a.btn-sub-menu { display: none; }
	#gnb_site_menu > ul > li > ul > li > ul > li  a:hover, 
	#gnb_site_menu > ul > li > ul > li > ul > li  a:focus { color:#000;}

	/* 4 Depth after */
	#gnb_site_menu > ul > li > ul > li > ul > li ul { display: none; position: relative; }
	#gnb_site_menu > ul > li > ul > li > ul li.on > ul	{ display: block; padding:5px 0; margin:5px 0; border-bottom: 1px solid #dadada; _border:1px solid red}
	#gnb_site_menu > ul > li > ul > li > ul > li ul li { background:url(/resource/images/cmm/bl_02.gif) no-repeat 8px 10px; }
	#gnb_site_menu > ul > li > ul > li > ul > li ul li a	{ display: block; position: relative; line-height: 25px; text-indent: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #6f726e; _border-bottom: 1px solid #dadada; }

	#gnb_site_menu > ul > li > ul > li > ul li.on > ul ul { margin-left:10px; border-top: 1px solid #dadada; border-bottom: 1px solid #dadada}

	#gnb_site_menu > ul > li.has-sub-menu > a		{ position: relative; padding-right: 70px; }
	#gnb_site_menu > ul > li.has-sub-menu > a:after	{ content: ""; display: block; position: absolute; width: 70px; height: 100%; top: 0; right: 0;  background: url('/resources/images/home/cmm/ico_gnb_submenu_off.png') no-repeat 50% 50%; }
	#gnb_site_menu > ul > li.has-sub-menu.on > a:after	{ background-image: url('/resources/images/home/cmm/ico_gnb_submenu_on.png'); }

	/* Background */
	#mnb_background_area { position: absolute; top: 0; left: 0; right: 0;  z-index: 10; box-shadow:0 1px 6px rgba(0, 0, 0, 0.2); }
	#mnb_background_area span { display: block; position: relative; margin-top: 60px; background: #fff; height: 0px; /*border-top: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2;*/ box-shadow: 0px 0px 3px #e2e2e2; }
	#mnb_background_area.ico span { border-bottom-color: #db6f6f; background: #db6f6f; }
	#mnb_background_area.on span { border-top: 1px solid #e2e2e2; }

	.serviceSearch .keyword { margin-bottom:10px;}
	.serviceSearch #depart { clear:both;}
	/*.serviceResult li { width:33.3% }*/

	#footer { max-width:768px}
	#footer .copyright { padding:0 28% 40px 160px }

	/* header */
	.header .headerTop { height:90px; }
	.header .headerTop h1 { line-height: 90px; }
	.header .headerTop h1 img { max-height: 80%; max-width: 50%; }
	.gnbWrap	{ top: 120px; }

	#tnb a		{ display: block; position: absolute; padding: 0; width: 55px; height: 35px; top: 50%; right: 10px; margin-top: -17px; border: 1px solid #e7e7e7; border-radius: 5px; line-height: 37px; font-size: 10px; }

	/* footer */
	.foot-nav li { padding: 0 8px; letter-spacing: -1px; }

	#copyright	{ float: left; clear: none; }
	
	#container	{ padding-top: 0px }
}

/* Mobile */
@media all and (max-width:640px) {	
	#scrollup { display:none}


	/* header */
	.utilWrap .utilMenu li { display:none;}
	.utilWrap .utilMenu li:first-child { display:block}
	.utilWrap .utilMenu li.guide { display:block}
	.utilWrap .goMenu .sijung { display:none;}
	.natinalFlag {display:none}
	#search .smart .smartSearch .searchBox {padding:0 40px 0 90px; }
	.login_mobile { display:block !important; }



	.h_bn{position:absolute; top:0; left:0; width:100%; height:auto; padding:0 0 40px 0; background:#ffe40a; z-index:999;}
	.h_bn span{font-size:15px; color:#36372c; padding:10px 0 0 0; display:block; text-align:center; line-height:20px; font-weight:500;}

	.h_bn02{position:absolute; top:0; left:0; width:100%; height:auto; padding:0 0 40px 0; background:#f86a0b; z-index:999;}
	.h_bn02 span{font-size:15px; color:white; padding:10px 0 0 0; display:block; text-align:center; line-height:20px; font-weight:500;}

	.h_bn03{position:absolute; top:0; left:0; width:100%; height:auto; padding:0 0 40px 0; background:#F71919; z-index:999;}
	.h_bn03 span{font-size:15px; color:white; padding:10px 0 0 0; display:block; text-align:center; line-height:20px; font-weight:500;}

}
