﻿@charset "utf-8";

/*font style*/
/* Noto Sans KR / Nanum Square / Nanum Gothic */
@import url("./NotoSans.css");
@import url(https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css);
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800&subset=korean');

/* 추가 css */
@import url("./layout.css");

/* 초기화 */
html {overflow-y:scroll}
body {margin:0;padding:0;font-size: 15px;font-family: 'Noto Sans KR', sans-serif !important;; letter-spacing: -0.04em; font-weight: 300; word-spacing: -1px; background:#fff}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family: 'Noto Sans KR', sans-serif; letter-spacing: -0.06em;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ol, ul, dl, dt, dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;font-size:1em}
input, button {margin:0;padding:0;font-family: 'Noto Sans KR', sans-serif;font-size:1em}
input[type="submit"]{cursor:pointer}
button {cursor:pointer}

textarea, select {font-family: 'Noto Sans KR', sans-serif;font-size:1em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {color:#222;text-decoration:none}

*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

::-webkit-input-placeholder {/* WebKit browsers */ color: #a9a9a9;}
:-moz-placeholder {/* Mozilla Firefox 4 to 18 */ color: #a9a9a9;}
::-moz-placeholder {/* Mozilla Firefox 19+ */ color: #a9a9a9;}
:-ms-input-placeholder {/* Internet Explorer 10+ */ color: #a9a9a9;}

.hidden {position: absolute; left: -9999px;}

.notoSans {font-family: 'Noto Sans KR', sans-serif; font-weight: 400;}
.nanumSq {font-family: 나눔스퀘어, NanumSquare, sans-serif; font-weight: 400;}
.nanumGt {font-family: '나눔고딕', 'Nanum Gothic', sans-serif; font-weight: 400;}

.light {font-weight: 300;}
.regular {font-weight: 400;}
.medium {font-weight: 500;}
.bold {font-weight: 700;}
.etbold {font-weight: 900;}

.yellow, a.yellow {color: #ffbe00;}


/* 레이아웃 크기 지정 */
#header_wrap,
.gnb_bg,
#container_wrap,
.roll_lt .bx-wrapper,
#footer_wrap {min-width:1200px}

.inner,
#header,
.visual_text,
#container,
#footer {width:1200px}

/* 상단 레이아웃 */
#header_wrap {position: absolute; width: 100%; border-bottom: 1px solid rgba(255,255,255,0.3); z-index: 999; }

/* 상단메뉴 */
#tnb {height: 45px; background: #222; border-bottom: 1px solid rgba(255,255,255,0.3);}
#tnb .inner {overflow: hidden; margin: 0 auto;}
#tnb ul {}
#tnb ul:after {display:block;visibility:hidden;clear:both;content:""}
#tnb li {float: left; font-size: 13px; padding: 16px 0; line-height: 12px; font-weight: 300; text-align: center;}
#tnb li a {display: block; height: 100%; color: #fff; opacity: 0.5;}
#tnb li a:hover {opacity: 1; transition: all .3s; }
#tnb ul.util { float: left; }
#tnb .util li {width: 112px; border-right: 1px solid rgba(255,255,255,0.3);}
#tnb .util li:first-child { border-left: 1px solid rgba(255,255,255,0.3);}
#tnb ul.member { float: right; }
#tnb .member li {position: relative; margin-left: 75px;}
#tnb .member li:before {content:""; height: 12px; border-left: 1px solid rgba(255,255,255,0.3); position: absolute; top: 16px; left: -38px;}
#tnb .member li:first-child:before {display: none;}

/* 헤더 */
#header {height: 103px; margin: 0 auto; zoom: 1;}
#header:after {display:block;visibility:hidden;clear:both;content:""}
#header .logo {float: left; padding-top: 25px; }

/* 메인메뉴 */
#gnb {float: right; height: 103px; font-size: 17px; font-family: 나눔스퀘어, NanumSquare, sans-serif; font-weight: 400;}
#gnb ul:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_1dul {margin: 0 -48px 0 0; padding: 0; zoom:1; text-transform: uppercase;}
.gnb_1dli {float: left; text-align: center;}
.gnb_1da {position: relative; display:block; margin: 0 48px; padding: 33px 0 25px; line-height: 45px; font-size:1.176em; text-decoration:none; color:#fff;}
.gnb_2dul {display: none; position: relative; height: 277px; padding:  16px 0; z-index: 999;}
.gnb_2dli {}
.gnb_2da {line-height: 2.117em; color: #fff;}
.gnb_bg {
    display: none; position: absolute; z-index: 99; top: 149px; left: 0; width: 100%; height: 277px;
    border-bottom: 1px solid rgba(255,255,255,0.3); background: transparent; background-color: rgba(34, 34, 34, 0.75);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3222222,endColorstr=#b3222222);
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3222222,endColorstr=#b3222222)";
}
.gnb_1dli.on .gnb_1da:after {display: block; content: ''; position: absolute; bottom: 25px; width: 100%; height: 4px; background: #ffc001;}
.gnb_2dli:hover > a {color: #ffc001;}


/* 중간 레이아웃 */
#container_wrap{height:100%;zoom:1;color: #222;}


/* 하단 레이아웃 */
#footer_wrap {clear: both;  background: #222; color: #a9a9a9;}
#footer {position: relative; padding: 40px 0; margin: 0 auto; padding-left: 457px; background: url("../img/logo_gray.png") no-repeat left 40px;}
.ft_btn {margin-bottom: 16px;}
.ft_btn ul {overflow: hidden;}
.ft_btn li {float: left; margin-right: 4px; border: 1px solid #656565; background: transparent;}
.ft_btn li a {display: block; padding: 0 20px; line-height: 35px; color: #a9a9a9;}
.ft_txt {font-size: 16px;}
.ft_txt address {font-style: normal; line-height: 1.437em;}
.ft_txt span {display: inline-block; padding-right: 22px;}
.ft_txt small {display: block; margin-top: 10px; font-size: inherit; text-transform: uppercase;}

#top_btn {position:absolute;top:0;right:0;width:60px;height:60px;line-height:1em;border:1px solid #ffc000;color:#222;text-align:center;font-size:19px;z-index:90;background:#ffc000;}
#top_btn span {display: block; font-size: 0.88em;}


/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}


/* 본문 바로가기 */
#skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}


/* 기본테이블 */
.tbl_wrap table {width:100%;border-collapse:collapse;border-spacing: 0 5px;border:1px solid #e8e8e8;} 
.tbl_wrap caption {padding:10px 0;font-weight:bold;text-align:left}
.tbl_head01 {margin:0 0 20px}
.tbl_head01 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head01 thead th {padding:10px 0;font-weight:normal;text-align:center;border-top: 2px solid #ffc000;border-bottom:1px solid #e8e8e8;background:#fbfbfb;height: 49px}
.tbl_head01 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head01 tfoot th, .tbl_head01 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.tbl_head01 tbody th {padding:8px 0;border-bottom:1px solid #e8e8e8}
.tbl_head01 td {position:relative;color:#222;background:#fff;padding: 12px 5px;border-top:1px solid #e8e8e8;line-height:1.4em;height: 49px;word-break:break-all;}
.tbl_head01 td:before {content:""; height: 24px; border-left: 1px solid #ededed; position: absolute; top: 50%; left: 0; margin-top: -12px;}
.tbl_head01 td:first-child:before {display: none;}
.tbl_head01 tbody tr:hover td{ }
.tbl_head01 a:hover {text-decoration:underline}

.tbl_head02 {margin:0 0 20px}
.tbl_head02 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head02 thead th {padding:5px 0;border-top:1px solid #d1dee2;border-bottom:1px solid #d1dee2;background:#e5ecef;color:#383838;font-size:0.95em;text-align:center;letter-spacing:-0.1em}
.tbl_head02 thead a {color:#383838}
.tbl_head02 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head02 tfoot th, .tbl_head02 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.tbl_head02 tbody th {padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:#fff}
.tbl_head02 td {padding:5px 3px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:#fff;line-height:1.4em;word-break:break-all}
.tbl_head02 a {}