@charset 'utf-8';
@import url('font.css');

/* 초기화 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline-color: #f00;
}
header, footer, nav, section, article, aside {
    display: block;
}
body {
    background-color: #fff;
    font-family:  'Roboto', 'IBM Plex Sans KR', 'Noto Sans KR', sans-serif;
    font-size: 16px;
    color: #222;
    line-height: 1.6;
    overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Russo One', 'IBM Plex Sans KR', 'Noto Sans KR', sans-serif;
}
h2 {
    margin-bottom: 0.25em;
    font-size: 2.4em;
    text-align: center;
}
h3 {
    text-align: center;
    font-weight: 400;
}
ol, ul {
    list-style-type: none;
}
p {
    margin-top: 1em !important;
    margin-bottom: 1em !important;
}
img {
    border: 0;
    vertical-align: top;
}
a {
    text-decoration: none;
    color: #222;
}
a:hover {
    color: #141227;
}
input, select, textarea {
    font-family: 'NanumBarunGothic', sans-serif;
    font-size: 16px;
    color: #000;
}
table {
    width: 100%;
    border-collapse: collapse;
}
th, td {
    /* border: 1px solid #ddd; */
}

/* 공용클래스 */
.wrap {
    width: 1560px;
    margin: auto;
}
.wrap2 {
    width: 1100px;
    margin: auto;
}
.clearfix:after {
    content: '';
    display: block;
    clear: both;
} 
.sound_only {
    position: absolute;
    left: -9999em;
    top: -9999em;
}
.parent {
    position: relative;
}
.table {
    display: table;
}
.table_cell {
    display: table-cell;
    vertical-align: middle;
}

.bdl0 {
    border-left-width: 0;
}
.bdr0 {
    border-right-width: 0;
}
.center {
    text-align: center;
}
.left {
    text-align: left;
}
.right {
    text-align: right;
}

/* 글자 관련 속성 */
.wh, .wh:hover, .wh a {
    color: #fff !important;
}
.bk, .bk:hover, .bk a {
    color: #000 !important;
}
.grey, .grey:hover, .grey a {
    color: #ccc !important;
}
.gr, .gr:hover, .gr a {
    color: #6eba8c !important;
}
.nv, .nv:hover, .nv a {
    color: #262261 !important;
}
.bl, .bl:hover, .bl a {
    color: #1a00fc !important;
}

.cfa {
    font-family: 'Cafe24SsurroundAir', sans-serif !important;
}
.cf {
    font-family: 'Cafe24Ssurround', sans-serif !important;
}
.nnbg {
    font-family: 'NanumBarunGothic', sans-serif !important;
}
.gm_b {
    font-family: 'GmarketSansBold', sans-serif !important;
}
.gm {
    font-family: 'GmarketSansMedium', sans-serif !important;
}
/* skip 메뉴 */
#skip {
    position: relative;
    z-index: 100;
}
#skip a {
    position: absolute;
    left: 0;
    top: -50px;
    display: block;
    width: 100%;
    line-height: 36px;
    background-color: #000;
    color: #fff;
    text-align: center;
}
#skip a:focus {
    top: 0;
}

/* hdm_hd */
#hdm_hd {position: fixed; left: 0; top: 0; width: 100%; z-index: 100; /* background-color: #6eba8c; */}
.hdm_wrap {position: relative;}
.hdm_logo { position: absolute; left: 6%; top: 40px; margin: 0;}
.hdm_logo a { display: block; width: 200px; height: 30px; background: url('../images/hdm_logo.png') no-repeat; background-size: contain;}
#hdm_hd { width: 100%; min-width: 1260px; transition: background-color 0.5s;}

#hdm_hd:hover, #hdm_hd:focus-within { background: rgba(0,0,0,0.8);}
.hdm_wrap { position: relative; width: 100%;}
.search  { position: absolute; right: 10%; top: 40px;}

.chk { position: absolute; right: 8%; top: 40px;}



/* gnb 영역 */
#hdm_gnb {width: 815px; height: 100px; margin: auto; /* overflow: hidden; */text-align: center; transition: height 0.5s 0.3s; font-size: 1.2em;}
#hdm_gnb a { display: block;  color: #fff;}
#hdm_gnb a:hover { display: block;  color: #fff0e0;}
#hdm_gnb:after { display: none; position: absolute; left:0; top: 100px; content: ''; width: 100%; height: 1px; background-color: rgba(255,255,255,0.2);}
#hdm_gnb:hover:after, #hdm_gnb:focus-within:after {display: block; transition: 0.5s;}
.depth1 { float: left;}
.depth1 > a { padding: 0 25px; line-height: 100px;}
.depth1 > a:hover, .depth1:hover > a, .depth1:focus-within > a {transition: 0.5s;}
.depth1:hover .depth2, .depth1:focus-within .depth2 { display: block;}


.depth2 {display: none; width: 100%; height: 400px; position: absolute; top: 100px; left: 50%; transform: translateX(-50%); padding: 20px 0; background-color: rgba(0,0,0,0.9);}
.depth2 > li {display: inline-block; vertical-align: top;}
/* .depth1 .depth2_1 { padding-left: 450px;}
.depth1 .depth2_2,
.depth1 .depth2_3{ padding-left: 600px;}
.depth1 .depth2_4,
.depth1 .depth2_5{ padding-left: 700px;}
.depth1 .depth2_6{ padding-left: 800px;}
.depth1 .depth2_7{ padding-left: 620px;} */
.depth2 li a { padding: 0 20px; font-size: 0.9em; text-align: center;}
#hdm_gnb .depth2 > li > a  {color: #fff0e0;}
.depth3 {padding-top: 10px; font-size: 0.9em;}


/* 푸터영역 */
.main_footer_wrap { width: 100%; padding-bottom: 150px; background-color: #0d0c12; text-align: center; z-index: 10;}
.ft_menu_wrap { /* width: 70%; */ padding: 20px 0;}
.ft_menu_wrap a:after { content: '|'; display: inline-block; padding: 0 15px; opacity: 0.3;}
.ft_menu_wrap a:last-child:after { display: none;}
.ft_mark_wrap { padding-bottom: 20px;}
.ft_sns_wrap { padding: 20px 0;}
.ft_info_wrap {font-size: 0.85em;}



@media screen and (max-width:1439px) {
    .hdm_logo {left: 2%;}
    .search  {right: 5%;}
    .chk {right: 2%;}
    .wrap {width: 1280px;}
}