@charset "utf-8";

body {width:100%;min-width:360px;background:#fafafa;}
#wrap {position:relative;}
.inner {position:relative;width:1200px;margin:0 auto;}
a {-webkit-transition:all .2s;transition:all .2s;}
button:focus-visible,
a:focus-visible,
select:focus-visible,
input:focus-visible{position:relative;outline:1px solid #000;box-shadow:0 0 4px 2px rgb(0 0 0 / 50%);z-index:1;}

/* header */
#main_header {position:fixed;top:0;width:100%;min-height:92px;padding-bottom:8px;background:#fff url(../../../../img/top_line.png) bottom no-repeat;background-size:auto 8px;z-index:26;}
#main_header::before,
#main_header::after {content:'';position:absolute;bottom:0;width:40%;height:8px;z-index:-1;}
#main_header::before{left:0;background-color:#00489d;}
#main_header::after {right:0;background-color:#5fac04;}
#main_header h1 {position:absolute;left:0;top:17px;width:268px;height:42px;background:url(../../../../img/logo.png) left top no-repeat;background-size:auto 100%;z-index:2;}
#main_header h1 a {display:block;width:100%;height:100%;text-indent:-9999px;overflow:hidden;}
#main_header .util {position:absolute;right:3px;top:24px;}
#main_header .util li {float:left;width:44px;height:44px;background-position:center center;background-repeat:no-repeat;}
#main_header .util li + li {margin-left:6px;}
#main_header .util li button {display:block;width:100%;height:100%;text-indent:-9999px;}
#main_header .util .btn_login {background-image:url(../../../../img/privacy.png);}
#main_header .util .btn_sitemap {margin-left:10px;background-image:url(../../../../img/ico_menu_on.png);}

/* gnb */
.gnb_wrap {position:relative;float:right;margin-right:175px;z-index:1;}
#gnb {position:relative;width:100%;z-index:1;}
#gnb li {font-weight:500;color:#323232;}
#gnb > li {position:relative;float:left;font-size:23px;font-weight:700;margin-top:11px;}
#gnb > li > a {position:relative;display:block;padding:22px 43px 21px;z-index:5;text-align:left;}
#gnb > li:last-child > a {padding-right:0;}
#gnb > li.on > a,
#gnb > li > a:hover,
#gnb > li > a:focus {color:#00489d;}
#gnb > li > a:before {content:'';position:absolute;left:0;bottom:0;width:100%;height:100%;}
#gnb .sub_gnb {display:none;position:relative;width:100%;padding-left:43px;height:140px;background-color:#fff;z-index:2;}
#gnb .sub_gnb li {position:relative;font-size:16px;line-height:30px;}
#gnb .sub_gnb li a {z-index:1200;}
#gnb .sub_gnb li a:hover,
#gnb .sub_gnb li a:focus {color:#00489d;}

/* 상단검색 */
#main_header .total_search {position:absolute;right:111px;top:24px;z-index:2;}
#main_header .total_search::before {content:'';position:fixed;left:0;top:92px;visibility:hidden;width:100%;height:calc(100% - 92px);background:rgba(0,0,0,.5);z-index:-1;opacity:0;-webkit-transition:all 0.2s;transition:all 0.2s;}
#main_header .total_search.close::before {opacity:1;visibility:visible;}
#main_header .total_search a {display:block;padding:22px;font-size:0;text-indent:-9999px;background:url(../../../../img/search.png) center no-repeat;}
#main_header .total_search .search {display:none;position:fixed;top:92px;right:0;width:100%;height:120px;background-color:#fff;z-index:99;}
#main_header .total_search .search_cont {position:relative;width:50%;margin:40px auto 0;}
#main_header .total_search .search input {width:100%;height:40px;border-radius:30px;border:1px solid #555;padding:0 40px 0 15px;background:#fff;}
#main_header .total_search .search input:focus {outline:0 none;border:1px solid #555;border-radius:30px;}
#main_header .total_search .search .search_btn {position:absolute;top:0;right:3px;width:40px;height:40px;border-radius:30px;background:url(../../../../img/search.png) center no-repeat;text-indent:-9999px;-webkit-transition:all 0.2s;transition:all 0.2s;z-index:2;}
#main_header .total_search .search .search_close_btn {position:absolute;width:40px;height:40px;top:15px;right:20px;border:1px solid #ccc;text-indent:-9999px;}
#main_header .total_search .search .search_close_btn::before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;font-family:"xeicon";font-size:22px;line-height:38px;color:#333;text-indent:0;-webkit-transform:rotate(0);transform:rotate(0);-webkit-transition: all 0.2s;transition: all 0.2s;}
#main_header .total_search .search .search_close_btn:hover::before, 
#main_header .total_search .search .search_close_btn:focus::before {-webkit-transform: rotate(180deg);transform:rotate(180deg);}

/* 전체메뉴 */
.allMenu,
#allMenu {display:none;}

/* container */
#container {position:relative;z-index:1;}

/* footer */
footer {position:relative;padding-bottom:24px;/*z-index:4;*/}
.foot_util {padding:17px 0 10px;overflow:hidden;width:100%;background-color:#f6f6f6;}
.foot_util::after {content:'';clear:both;display:block;}
.foot_util ul {display:inline-block;}
.foot_util ul li {padding-right:28px;float:left;margin-right:14px;color:#787878;}
.foot_util ul li.bo{font-weight:500;color:#383838;}
.foot_info { max-width: 1200px; margin: 0 auto; letter-spacing: -1px; }
.foot_info .box {padding-top: 33px;color: #797979; white-space: pre-line; }
.foot_info .box + .box {padding-top:8px;}
.foot_info .box strong {font-weight:500;margin-right:10px;}
.foot_info .box span + span:before {content:'|';margin:0 9px;}
.foot_info .tail {margin-top:20px;}
.foot_info .tail p {font-size:14px;color:#aeaeae;font-weight:500;letter-spacing:-0.2px;}
.foot_info .wa {position:absolute;right:0;bottom:2px;}
.foot_info .wa a {display:block;width:100px;}

@media (hover: hover) {
  a:hover {color:#00489d;}
}


/* 반응형 - media qurey 시작 */
/* 타블렛 넓이가 1223px 이하일 때*/
@media all and (max-width:1223px){	

	/* inner */
	.inner {width:100%;padding:0 30px;}
	
	/* header */
	#main_header {padding-bottom:6px;background-size:auto 6px;}
	#main_header::before,
	#main_header::after {height:6px;}
	#main_header h1 {left:30px;}
	#main_header .util {right:22px;}
	#main_header .util .btn_sitemap {margin-left:0;}
	#main_header .total_search {right:110px;}

	/* gnb */	
	.gnb_wrap {margin-right:155px;}
	#gnb > li {font-size:18px;margin-top:15px;}
	#gnb > li > a {padding-left:30px;padding-right:30px;}
	#gnb .sub_gnb {padding-left:30px;}

	/* footer */	
	.foot_util ul li {font-size:14px;}
	.foot_info {max-width:none;}
	.foot_info .box {font-size:13px;padding-top:25px;}
	.foot_info .box strong {display:none;}
	.foot_info .box span + span:before {margin:0 6px;}
	.foot_info .tail {margin-top:12px;}
	.foot_info .tail p {font-size:12px;font-weight:400;letter-spacing:0;}
	.foot_info .wa {right:30px;}

}

/* 넓이가 1024px 이하일 때*/
@media all and (max-width:1024px){	

	/* header */
	#main_header {min-height:62px;padding-bottom:3px;background-size:auto 3px;}
	#main_header::before,
	#main_header::after {height:3px;}
	#main_header h1 {top:15px;width:191px;height:30px;}
	.gnb_wrap,
	#main_header .util {display:none;}
	#main_header .total_search {right:62px;top:10px;}
	#main_header .total_search a {padding:20px;}
	#main_header .total_search .search {top:62px;}
	
	/* allMenu */
	.allMenu {display:block;position:absolute;right:22px;top:10px;width:40px;height:40px;background:url(../../../../img/ico_menu_on.png) center no-repeat;background-size:auto 20px;}
	.allMenu a {display:block;width:100%;height:100%;text-indent:-9999px;}
	.allMenuOpen {overflow:hidden;}
	.allMenuOpen .allMenuMask {display:none;}
	#allMenu {position:fixed;top:0px;right:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:100;}
	#allMenu .allMenu_wrap {position:relative;float:right;width:80%;padding:62px 0 0;margin:0;height:100%;overflow-x:hidden;background:#fff;}
	#allMenu h2 {position:fixed;right:0;top:0;display:block;width:80%;line-height:62px;padding-left:20px;font-size:18px;color:#fff;background:#294199;z-index:2;}
	#allMenu .allMenu_util {position:fixed;right:0;top:0;display:block;width:80%;line-height:62px;padding-left:20px;font-size:13px;color:#fff;background:#00489d;z-index:2;}
	#allMenu .allMenu_util li {float:left;}
	#allMenu .allMenu_util li + li {margin-left:20px;}
	#allMenu .close {position:fixed;background:none;right:15px;top:13px;width:36px;height:32px;z-index:3;}
	#allMenu .close button {position:relative;display:block;width:100%;height:100%;padding-top:32px;overflow:hidden;}
	#allMenu .close > button::before,
	#allMenu .close > button::after {content:'';position:absolute;left:0;width:26px;height:2px;background-color:#fff;}
	#allMenu .close > button::before {left:3px;top:7px;width:30px;margin-left:0;transform: translateY(9px) rotate(45deg);}
	#allMenu .close > button::after {left:3px;bottom:0;width:30px;margin-left:0;transform:translateX(0px)translateY(-14px) rotate(-45deg);}
	#allMenu .close > button i {display:none;}
	#allMenu .allMenu_body {position:relative;z-index:1;}
	#allMenu .allMenu_list > li {position:static;display:block;border-bottom:1px solid #e8e8e8;}
	#allMenu .allMenu_list > li.gnb_1depth1 {width:auto;}
	#allMenu .allMenu_list > li::after,
	#allMenu .allMenu_list > li > a::before {display:none;}
	#allMenu .allMenu_list > li > a {font-size:16px;display:block;position:relative;width:100%;height:auto;padding:15px 20px 12px;background:none;color:#323232;text-align:left;-webkit-transition:all 0.2s;transition:all 0.2s;}
	#allMenu .allMenu_list > li > a::after {content:'';position:absolute;top:auto;left:auto;right:auto;font-family:"xeicon";right:20px;color:#323232;-webkit-transition:all 0.2s;transition:all 0.2s;}
	#allMenu .allMenu_list > li.active > a {color:#05982b;background:#fff;font-weight:700;}
	#allMenu .allMenu_list > li.active > a::after {content:'';}
	#allMenu .allMenu_list .gnb_2depth {height:auto;padding:12px 0;background:#f7f7f7;border-top:1px solid #cecece;}
	#allMenu .allMenu_list .gnb_2depth::before {display:none;}
	#allMenu .allMenu_list > li.active .gnb_2depth {visibility:visible;overflow:visible;width:auto;height:auto;}
	#allMenu .allMenu_list .gnb_2depth > li {float:none;margin:0;width:100%;text-align:left;padding:6px 14px 6px 20px;}
	#allMenu .allMenu_list .gnb_2depth > li > a {position:relative;display:block;font-size:15px;padding:0 10px;color:#7d7d7d;text-align:left;}
	#allMenu .allMenu_list .gnb_2depth > li > a::before {content:'';position:absolute;left:0;top:8px;width:3px;height:3px;background-color:#7d7d7d;}
	#allMenu .allMenu_list .gnb_2depth > li.dep > a:after {content:'';position:absolute;top:auto;left:auto;right:auto;font-family:"xeicon";right:0;color:#4f525f;-webkit-transition:all 0.2s;transition:all 0.2s;}
	#allMenu .allMenu_list .gnb_2depth > li.active > a:after {webkit-transform:rotate(180deg);transform:rotate(180deg);}
	#allMenu .allMenu_list .gnb_2depth > li > a:focus,
	#allMenu .allMenu_list .gnb_2depth > li > a:hover,
	#allMenu .allMenu_list .gnb_2depth > li.active > a {color:#333;}
	#allMenu .allMenu_list .gnb_3depth {display:none;padding:6px 0 0 10px;}
	#allMenu .allMenu_list .gnb_3depth > li > a {display:block;padding:2px 0;color:#838383;font-size:14px;}
	#allMenu .allMenu_list .gnb_2depth,
	#allMenu .allMenu_list .gnb_3depth {display:none;}
	#allMenu .allMenu_list .gnb_2depth.active,
	#allMenu .allMenu_list .gnb_3depth.active {display:block;}

	/* footer */
	footer {text-align:center;}
	.foot_info {text-align:left;}
	.foot_info .inner {padding-right:130px;}

}

/* 넓이가 767px 이하일 때*/
@media all and (max-width:767px){	

	/* header */
	#main_header h1 {left:20px;}
	#main_header .total_search {right:52px;}
	#main_header .total_search .search {height:100px;}
	#main_header .total_search .search .search_close_btn {top:-51px;right:52px;background:#fff;border:0 none;}
	#main_header .total_search .search .search_close_btn::before {font-size:26px;line-height:40px;-webkit-transition:inherit;transition:inherit;}
	#main_header .total_search .search_cont {width:calc(100% - 40px);margin:30px 20px;}
	#main_header .total_search .search input {font-size:14px;}

	/* inner */
	.inner {padding:0 20px;}

	/* allMenu */
	.allMenu {right:12px;}
	#allMenu .allMenu_util li + li {margin-left:14px;}
	#allMenu .close {right:13px;width:30px;height:30px;}
	#allMenu .close > button::before {width:26px;}
	#allMenu .close > button::after {width:26px;}

	/* footer */
	.foot_util {padding:10px 0 11px;}
	.foot_util ul li {display:inline-block;float:none !important;padding-left:0;padding-right:0;margin:2px 12px;}
	.foot_info .box {padding-top:20px;}
	.foot_info .box span {display:block;line-height:1.4;}
	.foot_info .box span + span:before {display:none;}
	.foot_info .inner {padding-right:20px;}
	.foot_info .box + .box {padding-right:80px;}
	.foot_info .box + .box span:first-child {white-space:nowrap;}
	.foot_info .wa {right:20px;bottom:15px;}
	.foot_info .wa a {width:80px;}

}