@charset "UTF-8"; 
*{image-rendering: -moz-crisp-edges; image-rendering:-o-crisp-edges;       image-rendering: -webkit-optimize-contrast;image-rendering: crisp-edges;}
/* header */
#header{ height: 160px; position: relative;} 
#gnb{  height: 120px} 
#gnb > .inner{ display: flex; align-items: center; height: 75px; justify-content: space-between} 
#gnb > .inner:after{ content: ""; display: block; width: 100vw; height: 1px; background:#e1e1e1; position: absolute; left: 50%; top: 75px; transform: translateX(-50%); z-index: -1} 
#gnb_layout{overflow: inherit; height: 120px !important } 
#gnb_layout .logo{ display: inline-flex; align-items: center; padding: 0} 
#gnb_layout .logo a + a{ background: none; margin-left: 10px; font-weight: 700; font-size: 1.2857rem; color: #606060; line-height: 34px; width: auto } 
#gnb .navi_util > ul > li{ height: auto}
#gnb .navi_util{ float: none; margin: 0; display: block} 
#gnb .navi_util ul, #gnb .navi_util ul li{ display: flex; align-items: center} 
#gnb_layout .navi_pc > li{ border-left: 1px solid #e1e1e1;  width: 100%; position: relative;}
#gnb .navi_util > ul > li::before{ display: none} 
#gnb_layout .navi_pc > li > a{ height: 44px; line-height: 44px; width: 100%; text-align: center; z-index: 201; background: #fff; border-bottom: 1px solid #e1e1e1; font-size: 1.142rem; font-weight: 500  } 
#gnb_layout .navi_pc{ position: absolute; left: 50%; top:75px; transform: translate(-50%,0); width: 100%; display: flex; margin: 0; justify-content: space-between; overflow: inherit; border-top: 1px solid #e1e1e1;} 
#gnb_layout .depth_02{ top:45px} 
#total_search{  top: 58px; width: 260px; height: auto;background: none; border: none; left: calc(50% + 320px)}
#total_search .search .bt-search{ right: 0; background-size: 26px} 
#total_search .search .search_nm{clip: rect(1px, 1px, 1px, 1px); position: absolute; margin: -1px; height: 1px; width: 1px; border: 0; padding: 0; overflow: hidden; word-wrap: normal;} 
#total_search .search{ width: auto; padding: 0} 
#total_search .search .search_input{ width: 260px; height: 40px; border-radius: 20px; background: #f0f0f0; border: none; padding: 0 55px 0 20px ;border:1px solid #f0f0f0; margin-left: 0; top: 0} 
#total_search .search .search_input:focus{ outline: none} 
#total_search .search .search_result{ right: 0; top:46px; border-radius: 20px;border:1px solid #00a6e7; width: 260px} 
#total_search .search .search_result.active{ display: block; z-index: 3; } 
#total_search .search .search_top .search_input:focus, #total_search .search:hover .search_top .search_input{ background: #fff; border:1px solid #00a6e7} 
#total_search .search .search_result ul{ display: block} 
#total_search .search .bt-close{ display: none} 
#gnb_layout li .depth_02{ padding: 0} 
#gnb_layout .depth_02 .gnb_list{ border: none; float: none; display: block} 
#gnb_layout .depth_02 .gnb_list > ul{ flex-direction: column; overflow: hidden} 
#gnb_layout .depth_02 .gnb_list > ul > li,#gnb_layout .depth_02 .gnb_list > ul > li > a{ width: 100%; margin: 0; float: none; height: auto !important; display: block; border: none; background: none; padding: 0} 

#gnb_layout .depth_02 .gnb_list > ul > li > a{ display: flex; align-items: center; color: #606060; font-size: 1.0714rem; font-weight: 400; line-height: 1.73 } 
#gnb_layout .depth_02 .gnb_list > ul > li > a:before{ content: ""; width: 3px; height: 3px; background: #606060; display: block;  margin-right: 10px; flex-shrink: 0 } 
#gnb_layout .depth_02 .gnb_list > ul > li > a > span{ padding-left: 0; } 
#gnb_layout .depth_02 .gnb_list{ padding: 30px 20px 40px 30px} 
#gnb_layout .menu04 .depth_02 .gnb_list > ul > li:nth-child(6) ,
#gnb_layout .menu04 .depth_02 .gnb_list > ul > li:last-child {margin-top:0px;}
#gnb_layout li .depth_02{ border: 1px solid #e1e1e1; width: calc(100% + 2px); transform: translate(-1px,-1px);border-top: none}
#gnb_layout.open li .depth_02, #gnb_layout .navi_pc:hover li .depth_02{ opacity: 1 !important; display: block !important; height:250px !important } 
/* 수출기업 예외처리 */
.ECS #gnb_layout.open li .depth_02, .ECS #gnb_layout .navi_pc:hover li .depth_02{ height:350px !important } 
/* 가스안전교육원 예외처리 */
.GSE #gnb_layout.open li .depth_02, .GSE #gnb_layout .navi_pc:hover li .depth_02{ height:350px !important } 
#gnb_layout.open{} 
#gnb_layout.open:before,#gnb_layout.open:after,#gnb_layout .depth_02 .gnb_list > ul > li > a:after, #gnb_layout .navi_pc>li.current>a:after,#gnb_layout .navi_pc>li.active>a:after{ display: none } 
#gnb .navi_util ul > li > .btn_search{ display: none} 
#gnb_layout .navi_pc > li:hover > a{ background: #0253a5; color: #fff !important; border-bottom: 1px solid #0253a5 !important}
#gnb_layout li:hover .depth_02{ } 
#gnb_layout li:hover .depth_02 .gnb_list{ background:#007bcb }
#gnb_layout li:hover .depth_02 .gnb_list > ul > li > a{ color: #fff} 
#gnb_layout li:hover .depth_02 .gnb_list > ul > li > a:before{ background: #fff} 
#gnb_layout li .depth_02 .gnb_list > ul > li:hover > a, #gnb_layout li .depth_02 .gnb_list > ul > li.active > a{ font-weight: 600; text-decoration: underline} 
#gnb_layout .navi_pc > li.active{ border: 1px solid #00a6e7; transform: translateY(-1px); border-bottom: 0} 
#gnb_layout .navi_pc > li.active > a{ border-bottom-color: #00a6e7; color: #0253a5; font-weight:600} 
#gnb_layout .navi_pc > li:last-of-type{  border-right: 1px solid #e1e1e1} 
@media screen and (min-width: 1300px){
	#total_search{ display: block !important; z-index: 98 }
	#gnb_layout.fix + #total_search { position:fixed; top:17px;}
	#gnb_layout .navi_pc > li > a:hover:after, #gnb_layout .navi_pc>li.current>a:after{ display: none} 
	#gnb_layout.open .gnb .navi_pc{ border-right-color: #999; border-top-color: #999} 
	#gnb_layout.open .gnb .navi_pc > li:first-of-type{ border-left-color: #999} 
	#gnb_layout.open .gnb .navi_pc > li:last-of-type{ border-right-color: #999} 
	#gnb_layout.open li .depth_02{ border-bottom: 1px solid #999} 
	#gnb_layout.open li:first-of-type .depth_02{border-left-color: #999} 
	#gnb_layout.open li:last-of-type .depth_02{border-right-color: #999} 
	
}
@media screen and (max-width: 1299px){
	nav,#gnb,#gnb > .inner, #gnb_layout{ height: 90px !important} 
	#header{ height: 90px} 
	#gnb_layout .logo{ margin: 0 0 0 0px} 
	#gnb_layout .navi_pc {display: none;}
	#gnb .navi_util ul > li > .btn_search{ display:block} 	
	#gnb .navi_util > ul > li.box_mo{ left: auto; right: 0} 
	#gnb .navi_util > ul > li{ position: relative; right: auto !important} 
	#gnb .navi_util{ position: relative; top: auto; left: auto; width: auto} 		
	#gnb > .inner:after{ display: none} 
	#total_search{ padding: 40px 0; border-bottom: 1px solid #e1e1e1} 	
	#total_search{ width: 100%; top:90px; left: 0; background: #f7f7f7  } 
	#total_search .search .search_input{width: 400px; height: 50px; border: 2px solid #e1e1e1; border-radius: 30px; background: #fff; border-width: 2px !important; line-height: 46px}
	#total_search .search .search_top{ position: inherit; justify-content: center} 
	#total_search .search .bt-search{ position: relative; right: auto; margin:0; height: 50px; display: block; line-height: 50px; vertical-align: top;transform: translateX(-53px);} 
	#total_search .search .search_nm{ clip: auto; position: relative; margin: 0 20px 0 0; height: auto; width:82px} 
	#total_search .search .search_result{ right: 0; left: 50%; top: 96px; border-width: 2px; width: 400px; transform: translate(-50%,0); margin-left:27px} 
	#total_search .search .bt-close{ display: block; right: 20px; top: 0; background-color: #fff; transform: translateY(-70px); background-position:right 5px top 50%; width:150px; left: auto } 
	.gnb_m_wrap{ padding-top: 0} 
	.gnb_mobile .navi_m_logo{ display: flex; align-items: center; padding: 0 0 0 20px; height: 51px} 
	.gnb_mobile .navi_m_logo a{ background: url("../img/comm/logo.svg") no-repeat 0 50%; background-size: 130px; width: 130px; height: 20px} 	
	.gnb_mobile .navi_m_logo a + a{ background: none; font-weight: 700; padding-left: 5px; font-size: 12px} 
	.gnb_mobile .navi_etc{ padding: 20px 30px} 
	.gnb_mobile .navi_etc p{ font-size:1.166rem; font-weight: 500; line-height: 1.98 } 
	.gnb_m_wrap .depth1_ul > li > a > span{ font-weight: 600; font-size: 1.166rem} 
	.gnb_m_wrap .depth2_ul li.no_depth a::after{ content: ""} 
	.gnb_m_wrap .depth2_ul > li > a{ font-size: 1.0833rem; font-weight: 500} 
}
@media screen and (max-width: 1023px){
	.quick .consult{ display: none!important;} 
}
@media screen and (max-width: 767px){
	.gnb_mobile{  min-width: 360px; max-width: 400px} 
	.gnb_mobile .navi_m_logo a{ width: 120px; background-size: 120px}
	.gnb_mobile .navi_m_logo a + a{ width: auto} 
	.gnb_m_wrap .depth1_ul > li > a{ padding: 13px 20px 13px 30px} 
	nav,#gnb,#gnb > .inner, #gnb_layout{ height: 50px !important} 
	#gnb_layout .logo a{ background-size: auto 21px; background-position: 0 50%; width: 125px} 
	#gnb_layout .logo a + a{ line-height: 21px; margin-left:0px; font-size: 1.12rem} 
	#gnb .navi_util ul > li{width: 30px; height: 40px} 
	#gnb .navi_util ul > li > a, #gnb .navi_util > ul > li.box_mo .btn_allmenu{ display: block; width: 100%; height: 100%} 
	#gnb .navi_util ul > li > .btn_search, #gnb .navi_util > ul > li.box_mo .btn_allmenu{ background-size: 18px} 
	#gnb .navi_util ul{ justify-content: flex-end; margin-right: -5px} 
	#total_search{ top:50px; padding: 30px 0 } 
	#total_search *{ box-sizing: border-box} 
	#total_search .search .search_top{ width: auto} 
	#total_search .search .search_input{ width: 215px; flex-shrink: 0; height: 40px; line-height: 36px} 
	#total_search .search .search_nm{ width: 50px; flex-shrink: 0; margin-left:30px; margin-right: 10px} 
	#total_search .search .bt-search{transform: translateX(-30px); width: 30px; flex-shrink: 0; background-size: 17px; background-position: 0 50%} 
	#total_search .search .search_result{ top:80px; width: 215px; margin-left: 30px; } 
	#header {height: 50px;}
}
@media screen and (max-width: 359px){
	.gnb_mobile{  min-width: 330px; max-width: 350px}  
}

/* 플로팅 */
.quick .consult {background: url(../img/comm/icon-counseling_01.png) no-repeat center center;}

/* go to top */
@media screen and (max-width: 1299px){
	.quick .move-top{ width: 55px; height: 55px} 
}
/* lnb */
#lnb{ width: 250px} 
#lnb .lnb-tit{ width: 100%} 
#lnb .lnb_01 > li.no_depth > a::after{ display: none} 
#lnb .lnb_01 > li.no_depth.active > a::after, #lnb .lnb_01 > li.active > a::after{display: inline-block; color: #fff !important} 
#lnb .lnb_01 > li > a{ min-height: 51px; border-width: 1px 0; font-size: 1.1428rem; font-weight: 400 !important} 
#lnb .lnb-tit:before{ display: none} 
#lnb .lnb-tit{ height: 90px; background:#0253a5 } 
#lnb .lnb_01 > li.active > a{ border-color: #007bcb; background:#007bcb;  color: #fff; font-weight: 600 !important} 
#lnb .lnb_01 > li:last-of-type a{ border-bottom-color: #0253a5}

/* 컨텐츠 */
main{ position: relative; z-index: 1} 
.content-top, .location-list .subdepth ul{ background: #f7f7f7} 

@media screen and (min-width: 1300px){
	.content-top > .inner{ position: relative} 
	.util-list{ position: absolute; right: 0; top:110px; border: 1px solid #e1e1e1; border-width: 1px 0px; background: #fff; z-index: 3;} 	
	.content > h3, .content .content_header > h3{ min-height: 90px; justify-content: center; padding: 0} 
	.contentWrap{ margin: 40px auto 0 } 
	#lnb + #content{ margin-left: 45px} 
	
}
@media screen and (max-width: 1299px){
	.util-list{ background: #fff} 	
	.icon_box a:last-of-type{ border-right: 0} 
}