@charset "utf-8";

html, body {min-width:360px;}
/************ header ************/
.skipnav {position: fixed;width: 100%;background: #000;color: #fff;text-align: center;z-index: 3}
.skipnav a {display: block;color: #fff;font-weight: bold;width: 0;height: 0;line-height: 0;font-size: 0}
.skipnav a:focus, .skip a:active {display: block;padding: 5px 0;width: auto;height: auto;line-height: 1.5;font-size: 14px}

.header {position:relative;z-index:2;}
.m_menu {display:none;}
.header_wrap {display: flex;justify-content: space-between;align-items: center;height:92px;padding:0 30px;position: relative;}
:lang(en).logo a {background:url('/usr/images/logo_en.svg') no-repeat center / 100%;width: 255px;height: 40px}
.logo a {display:block;width:202px;height:51px;background:url('/usr/images/logo.svg') no-repeat 0 0 / 100%;text-indent:-9999px;}
.gnb_wrap {height: 92px;display: flex;align-items: center;}
.gnb_wrap > ul {display: flex;align-items: center;justify-content: center;height: 100%;}
.gnb_wrap > ul > li {position:relative;height: 100%;}
.gnb_wrap > ul > li > a {padding:0 35px;font-size:21px;font-weight: 600;height: 100%;display: flex;align-items: center;}
.gnb_wrap > ul > li:hover > a, .gnb_wrap > ul > li.on > a, .gnb_wrap > ul > li:focus-within > a {color:#3182b8}
.gnb_wrap .depth_2 {display:none;position:absolute;top: 92px;left:0;right:0;}
.gnb_wrap .depth_2 > ul {padding:20px 0;}
.gnb_wrap .depth_2 > ul > li {text-align:center;}
.gnb_wrap .depth_2 > ul > li > a {font-size: 16px;text-align: center;color: #1b1b1b;display: block;padding: 10px 11px;}
.gnb_wrap .depth_2 > ul > li > a:hover, .gnb_wrap .depth_2 > ul > li > a:focus {color:#3182b8;background: #e6f5fd;}
.gnb_wrap .depth_2 > ul > li > ul  {padding-top:10px;}
.gnb_wrap .depth_2 > ul > li > ul > li > a {display:block;padding:3px 22px;text-align: center;}
.gnb_wrap .depth_2 > ul > li > ul > li > a:hover, .gnb_wrap .depth_2 > ul > li > ul > li > a:focus {color:#0072b6;text-decoration:underline}
.gnb_wrap > ul > li:hover .depth_2, .gnb_wrap > ul > li:focus-within .depth_2 {background:#f4fbff}
.gnb_wrap > ul > li:hover .depth_2:after, .gnb_wrap > ul > li:focus-within .depth_2:after {content: '';position: absolute;width: 100%;height: 3px;background-color: #3182b8;top: -3px;left: 0;transform-origin: center;transition: transform 0.3s ease;}
.gnb_wrap .depth_2 > ul > li > a.open_window {background:#fff url('/usr/images/menu_window02_off.png') no-repeat right center;}
.gnb_wrap .depth_2 > ul > li > a.open_window:hover, .gnb_wrap .depth_2 > ul > li > a.open_window:focus {background:#0072b6 url('/usr/images/menu_window02_on.png') no-repeat right center;color:#fff;}
.nav_bg {display:none;background:#fff;border-top: 1px solid #f1f1f1;position:absolute;top:92px;left:0;right:0;box-shadow: 0px 12px 19px 0px rgba(0, 0, 0, .02);}


.util_wrap {display:flex;align-items: center;gap: 5px;}
.util_wrap .language {background:#212121;color:#fff;border-radius: 50px;padding: 15px 30px;}
.util_wrap .search > a {display:block;width: 52px;height: 52px;background: #212121 url('/usr/images/ico_search.svg') no-repeat center / 100%;text-indent:-9999px;background-size: 22px;border-radius: 100%;}
.search_layer_wrap {display:none;background:#0a4d8d;padding:50px 0;position:absolute;top:92px;left:0;right:0;}
.search_layer_wrap .search_input {max-width:700px;margin:0 auto;border:2px solid #bbd1da;border-radius:50px;padding: 10px 20px;display: flex;align-items: center;gap: 10px;}
.search_layer_wrap .search_input input[type="text"] {border:0;background:none;font-size:17px;color:#fff;flex-grow: 1;}
.search_layer_wrap .search_input input[type="text"]::placeholder {color:#bbd1da;}
.search_layer_wrap .search_input button {width:22px;height:22px;background:url('/usr/images/ico_search.svg') no-repeat 0 0 / 100%;text-indent:-9999px;}
.search_layer_wrap .close_search {display:block;width:40px;height:40px;background: #000000 url(/usr/images/ico_close.png) no-repeat center;text-indent:-9999px;position:absolute;bottom: -45px;left: 50%;margin-left: -20px;border-radius: 100%;}
.all_menu {}
.all_menu > a {display:flex;width: 52px;height: 52px;background: #0080fb url('/usr/images/ico_sitemap.png') no-repeat center;text-indent:-9999px;border-radius: 100%;}
.all_menu_layer {display:none;height:100vh;padding: 30px;background: #1e1e1e;position:absolute;top:0;left:0;right:0;justify-content: center;align-items: flex-start;overflow-x: hidden;overflow-y: auto;z-index:2}
.all_menu_wrap {width:100%;}
.all_menu_wrap .sm_tit {font-size:35px;color: #fff;text-align: center;margin-bottom:30px;}
.all_menu_wrap > ul {display:flex;}
.all_menu_wrap > ul > li {width:16.6666%;}
.all_menu_wrap ul li a {color:#fff;}
.all_menu_wrap > ul > li > a {display: block;font-size: 20px;border-bottom: 1px solid rgba(255, 255, 255, 0.22);padding: 20px;color: #08e6ff;font-weight: 800;text-align: center;}
.all_menu_wrap > ul > li > ul {margin-top:20px;}
.all_menu_wrap > ul > li > ul > li {padding:5px 10px;}
.all_menu_wrap > ul > li > ul > li > a {position: relative;display: block;padding-left: 17px;}
.all_menu_wrap > ul > li > ul > li > a:before {content:'';width:7px;height:2px;background:#fff;position:absolute;top:10px;left:0;}
.all_menu_wrap > ul > li > ul > li > ul {background: #272727;padding:10px 17px;margin-top:10px;}
.all_menu_wrap > ul > li > ul > li > ul > li > a {display:block;padding:3px 0;color:#9c9a99;}
.all_menu_layer .close_sitemap {display:block;width:40px;height:40px;border:1px solid #909090;border-radius:100%;background: url(/usr/images/ico_close.png) no-repeat center;position:absolute;top:20px;right:20px;text-indent:-9999px;}
.all_menu_wrap ul li a.open_window span {position:relative;}
.all_menu_wrap ul li a.open_window span:after {content:'';width:12px;height:12px;background: url(/usr/images/menu_window02_on.png) no-repeat 0 0;position:absolute;top:50%;right:-22px;margin-top:-6px;}

:lang(en) .all_menu_wrap > ul > li {width:25%}
:lang(en) .all_menu_wrap > ul > li > a {text-align:left}

/* sub_navi */
.sub_nav {background:#008cd6;position: relative;z-index: 1;}
.sub_nav_wrap {max-width:1240px;margin:0 auto;display:flex;}
.sub_nav_wrap a {display:block;color:#fff;padding: 16px 35px 16px 20px;border-right:1px solid #2ca3e1;background:url('/usr/images/sub_up_down.png') no-repeat right 19px;}
.sub_nav_wrap a.home {display:flex;text-indent:-9999px;padding: 16px 20px;border-left:1px solid #2ca3e1;align-items: center;background:none;}
.sub_nav_wrap a.home:before {content:'';width: 18px;height: 18px;background: url(/usr/images/ico_home.svg) no-repeat center / 100%;}
.sub_nav_wrap .sub_depth1, .sub_nav_wrap .sub_depth2, .sub_nav_wrap .sub_depth3 {max-width: 262px;width:100%;position:relative;}
.sub_nav_wrap .sub_depth1 ul, .sub_nav_wrap .sub_depth2 ul, .sub_nav_wrap .sub_depth3 ul {width:100%;background:#008cd6;position:absolute;top:54px;left:0}
.sub_nav_wrap .sub_depth1 ul li a, 
.sub_nav_wrap .sub_depth2 ul li a,
.sub_nav_wrap .sub_depth3 ul li a {background:none;border-top:1px solid #2ca3e1;padding: 10px 20px;}
.sub_nav_wrap .sub_depth1 ul li a:hover, 
.sub_nav_wrap .sub_depth2 ul li a:hover,
.sub_nav_wrap .sub_depth3 ul li a:hover {background:#007dbf}
.sub_nav_wrap .sub_depth1 ul,
.sub_nav_wrap .sub_depth2 ul,
.sub_nav_wrap .sub_depth3 ul,
.sub_nav_wrap .sub_depth2 div,
.sub_nav_wrap .sub_depth3 div {display:none;}
.sub_nav_wrap a.open_window {background: url(/usr/images/menu_window02_on.png) no-repeat right center !important;}
.sub_nav_wrap .sub_depth1 ul li a.open_window:hover, 
.sub_nav_wrap .sub_depth2 ul li a.open_window:hover,
.sub_nav_wrap .sub_depth3 ul li a.open_window:hover {background:#256793 url(/usr/images/menu_window02_on.png) no-repeat right center !important;}


.footer_wrap {padding:50px 15px;background:#1b1b1b;position:relative}
.footer_inner {max-width:1410px;margin:0 auto;}
.footer_top {display: flex;justify-content: space-between;align-items: center;}
.footer_top .footer_menu {display:flex;}
.footer_top .footer_menu a {font-size:16px;position:relative;color: #fff;}
.footer_top .footer_menu a+a {padding-left:15px;margin-left:15px;}
.footer_top .footer_menu a+a:before {content:'';width:1px;height:15px;background: #353535;position:absolute;top:50%;left:0;margin-top:-7px}
.footer_wrap .related_link {max-width:277px;width:100%;position:relative;}
.footer_wrap .related_link > a {display:block;max-width:277px;width:100%;padding:15px 30px;background:#0a0a0a;border-radius:50px;position:relative;color: #fff;}
.footer_wrap .related_link > a:after {content:'';width:11px;height:6px;background:url(/usr/images/ico_family_site.png) no-repeat center;position:absolute;top:50%;right:30px;margin-top:-3px;}
.footer_wrap .related_link span {display:none;position:absolute;bottom: 59px;left:0;width: 100%;border: 2px solid #0a0a0a;border-radius: 15px;background: #fff;box-shadow: 1px 1px 10px 2px rgba(0, 0, 0, .3);}
.footer_wrap .related_link span a {display:block;padding: 10px 15px;}
.footer_wrap .related_link span a+a {border-top: 1px solid #dcdcdc;}
.footer_wrap .related_link span a:hover {color:#3182b8}
.footer_wrap .footer_cont {display:flex;gap:40px;margin-top:30px;}
:lang(en).footer_wrap .footer_cont {align-items: center;margin-top: 0}
:lang(en).footer_wrap .footer_cont strong {width:243px;height:42px;background: url(/usr/images/logo_en_.svg) no-repeat center / 100%}
.footer_wrap .footer_cont strong {width:146px;height:42px;background: url(/usr/images/f_logo.svg) no-repeat 0 0 / 100%;text-indent:-9999px;flex-shrink:0}
.footer_wrap .footer_cont .address_wrap {flex-grow:1;color:#fff}
.footer_wrap .footer_cont .address_wrap p {margin-top:10px;font-size:14px;font-weight:100;color: #ababab;}
.footer_wrap .footer_cont .mark_wrap {flex-shrink:0}
:lang(en) .footer_top {justify-content: flex-end;min-width: 297px;}
:lang(en).footer_wrap .footer_cont .wac_logo {width: 90px}

@media screen and (max-width: 1540px) {
	:lang(en).logo a {width: 212px;height: 34px}
	.logo a {width: 135px;height: 34px;}
	.gnb_wrap > ul > li > a {font-size: 18px;padding: 0 25px;}
	.gnb_wrap .depth_2 > ul > li > a {font-size:15px;}
	.util_wrap .language {padding: 7px 20px;}
	.util_wrap .search > a {width: 36px;height: 36px;background-size: 18px;}
	.all_menu > a {width: 36px;height: 36px;background-size: 18px;}
}
@media screen and (max-width: 1200px) {
	/*GNB*/
	.header_wrap {height: 75px;padding:0 15px}
	.gnb_wrap {top: 75px;}
	.gnb_wrap > ul > li > a {padding: 0 15px;}
	.gnb_wrap > ul > li > a:after {bottom: -24px;}
	.gnb_wrap .depth_2 {top: 52px;}
	.nav_bg {top: 75px;}
	.util_wrap .language {font-size:14px;padding:7px 15px;}
	:lang(en).footer_wrap .footer_cont {flex-direction: column;gap: 20px;}
	:lang(en).footer_wrap .footer_cont .address_wrap {text-align: center}

	/* 사이트맵 */
	.all_menu_wrap > ul > li {width:33.3333%;}
}
@media screen and (max-width: 1048px) {
	/* GNB */
	.header_wrap {height:50px;padding:0 10px}
	.m_menu {display:block;width: 36px;height: 36px;position:absolute;top: 50%;right: 10px;background: #0080fb url('/usr/images/ico_sitemap.png') no-repeat center;text-indent:-9999px;background-size: 18px;border-radius: 100%;margin-top: -18px;}
	.m_menu.off {background:#0080fb url('/usr/images/ico_close02.png') no-repeat center;}
	.gnb_wrap {display:none;position: absolute;top: 50px;left: 0;right: 0;height: calc(100vh - 50px);background: #333333;align-items: flex-start;overflow-x:hidden;overflow-y:auto;padding-bottom: 120px;}
	.gnb_wrap > ul {flex-direction: column;width: 100%;height: auto;align-items: normal}
	.gnb_wrap > ul > li > a {color: #fff;display: block;font-size: 17px;border-bottom: 1px solid #434343;padding: 10px 20px;background: url('/usr/images/up_down.png') no-repeat right 17px;}
	.gnb_wrap > ul > li.on > a {color:#fff;background: #232323 url('/usr/images/up_down.png') no-repeat right -21px}
	.gnb_wrap > ul > li > a:after {content:none}
	.gnb_wrap > ul > li > a:hover, .gnb_wrap > ul > li.on > a, .gnb_wrap > ul > li > a:focus {color:#fff}
	.gnb_wrap .depth_2, .gnb_wrap > ul > li:hover .depth_2, .gnb_wrap > ul > li:focus-within .depth_2 {position: relative;top: auto;background: #3f3f3f;}
	.gnb_wrap > ul > li:hover .depth_2:after, .gnb_wrap > ul > li:focus-within .depth_2:after {content:none}
	.gnb_wrap > ul > li.on .depth_2 {border-bottom: 1px solid #535353;padding: 0 20px 0;}
	.gnb_wrap .depth_2 > ul > li {text-align:left}
	.gnb_wrap .depth_2 > ul > li > a {color:#fff;text-align: left;}
	.gnb_wrap .depth_2 > ul > li > a:hover, .gnb_wrap .depth_2 > ul > li > a:focus {color: #04e6ff;background:none}
	.util_wrap {padding-right: 40px;}
	.search_layer_wrap {top:50px;padding: 25px;}
	.search_layer_wrap .search_input {padding: 0 15px;}
	.search_layer_wrap .search_input input[type="text"] {font-size:15px;height:36px;}
	.search_layer_wrap .search_input button {width: 18px;height: 17px;}
	.all_menu {display:none;}
	.util_wrap {gap:4px;}
}
@media screen and (max-width: 980px) {
	
	/* 서브메뉴 */
/*	.sub_nav_wrap a {padding: 12px 30px 12px 10px;background-position: right 15px;}*/
	.sub_nav_wrap .sub_depth1 ul, .sub_nav_wrap .sub_depth2 ul, .sub_nav_wrap .sub_depth3 ul {top:46px;}
}
@media screen and (max-width: 780px) {
	/* 서브메뉴 */
	.sub_nav_wrap {justify-content: space-between;}
	.sub_nav_wrap a.home {display:none;}
	.sub_nav_wrap > div {flex:1 1 auto;}
	.sub_nav_wrap .sub_depth1, .sub_nav_wrap .sub_depth2, .sub_nav_wrap .sub_depth3 {max-width:none;width:auto;}
}
@media screen and (max-width: 640px) {
	/* 서브메뉴 */
	.sub_nav_wrap a span {position:relative;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;display: block;max-width: 150px;}
	.footer_wrap {padding:30px 15px;}
	.footer_top {flex-direction: column;gap: 15px;}
	.footer_top .footer_menu a {font-size:15px;}
	.footer_top .footer_menu a+a:before {height: 12px;margin-top: -6px;}
	.footer_wrap .related_link > a {padding: 10px 20px;}
	.footer_wrap .related_link span {bottom: 49px;}
	.footer_wrap .footer_cont {flex-direction: column;align-items: center;gap: 20px;}
	.footer_wrap .footer_cont strong {width: 115px;height: 31px;}
	.footer_wrap .footer_cont .address_wrap {text-align:center;}
}
@media screen and (max-width: 540px) {
}
@media screen and (max-width: 480px) {
	/* 서브메뉴 */
	.sub_nav_wrap a span {max-width: 86px;}
}
@media screen and (max-width: 360px) {

}

