@charset "utf-8";

/* header */
.header_wrap,
.header_wrap:before,
.header_wrap:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.header_wrap { font-family: "NanumSquare", "맑은 고딕", "Malgun Gothic", "dotum", sans-serif; font-size: 13px; font-weight: 400; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #565656; letter-spacing: -0.5px; }
.header_wrap { width: 100%; min-width: 1160px; height: 107px; margin-bottom: 20px; border-bottom: 1px solid #7783a1; /*box-shadow: 0px 1px 5px #bbb;*/ }
.header_wrap:before { content: ''; display: block; width: 100%; min-width: 1160px; height: 55px; position: absolute; top: 0; left: 0; /* background-color: #353e55; */ box-sizing: border-box; }
.header_wrap .top_area { position: relative; height: 22px; margin: 0 auto; }

.header_wrap .logo { position: absolute; overflow: hidden; clip: rect(0,0,0,0); border: 0; width: 1px; height: 1px; padding: 0; margin: -1px; text-indent: -10000px; }
.header_wrap .inner { position: relative; width: 1160px; margin: 0 auto; }

.header_wrap h1, .header_wrap ul, .header_wrap li {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    vertical-align: baseline;
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
}
.header_wrap ul, .header_wrap li { list-style: none; }

.header_wrap div, .header_wrap span, .header_wrap a, .header_wrap ul, .header_wrap li {
    font-family: "NanumSquare", "맑은 고딕", "Malgun Gothic", "dotum", sans-serif;
}

/* gnb */
.gnb_wrap { position: relative; }
.gnb { width: 1160px; height: 85px; margin: 0 auto; }
.gnb h1 { position: absolute; top: 14px; width: 155px; height: 55px; background: url("/images/logo.gif") no-repeat; }
.gnb h1 > a { display: block; width: 155px; height: 55px; }
.gnb > ul { display: table; float: left; width: 700px; margin-left: 240px; }
.gnb > ul > li { display: table-cell; }
.gnb > ul > li > a { position: relative; display: block; padding: 0 16px; line-height: 85px; color: #000; font-size: 18px; font-weight: 600; }
.gnb > ul > li > a span { position: relative; display: block; overflow: hidden; }
.gnb > ul > li > a span:after { content: ''; display: block; position: absolute; bottom: -15px; left: 50%; margin-left: -21px; width: 25px; height: 15px; background: url("./img/gnb_hover.png") no-repeat; transition: all 0.4s ease; -webkit-transition: all 0.4s ease; }
.gnb > ul > li > a.ok span:after,
.gnb > ul > li > a.okon span:after,
.gnb > ul > li > a:hover span:after,
.gnb > ul > li > a:focus span:after { bottom: 0; }
.gnb > ul > li > a.ok span,
.gnb > ul > li > a.okon span
.gnb > ul > li > a:hover span,
.gnb > ul > li > a:focus span { color: #4e7fce; }
.gnb > ul > li > a.ok span:after { background: url("./img/gnb_on.png") no-repeat; }
.gnb > ul > li > a.okon span:after { background: url("./img/gnb_hover.png") no-repeat; }

.nav_link { position: relative; }
.nav_link .sub { position: absolute; top: 33px; right: 0; height: 30px; }
.nav_link .sub > a { display: inline-block; color: #888; font-size: 15px; white-space: nowrap; }

/* gnb_box */
.gnb_box { position: absolute; top: 107px; left: 0; right: 0; background: #f8fcff; box-shadow: 0px 6px 6px #9398a5; z-index: 10; }
.gnb_box .depth2 > ul { display: table; width: 700px; min-height: 100px; padding: 10px 0; margin-left: 256px; }
.gnb_box .depth2 > ul > li { display: table-cell; position: relative; padding: 0; }
.gnb_box .depth2 > ul > li.s_1 { width: 112px; }
.gnb_box .depth2 > ul > li.s_2 { width: 114px; }
.gnb_box .depth2 > ul > li.s_3 { width: 114px; }
.gnb_box .depth2 > ul > li.s_4 { width: 132px; }
.gnb_box .depth2 > ul > li.s_5 { width: 114px; }
.gnb_box .depth2 > ul > li.s_6 { width: 114px; }
.gnb_box .depth2 .dp2 a:hover,
.gnb_box .depth2 .dp2 a:focus { border-bottom: 1px solid #4081EC; color: #4081EC; }
.gnb_box .depth2 .dp2 > li { margin-top: 7px; }
.gnb_box .depth2 .dp2 a { color: #666; font-size: 15px; }
.gnb_box .depth2 .dp2 a.selected { font-weight: bold; color: #0000FF; }

/* breadcrumb */
.breadcrumb { text-align: left; margin: 10px 0 10px 256px; }
.breadcrumb .now { font-weight: bold; }
/* .breadcrumb .d1 {} */
.breadcrumb .d2 { color: #0000FF; }
