@charset "utf-8";

body {
    font-family: "NanumGothic", sans-serif;
}

.wrap_body {width:100%;}
.context_width1200 {width:100%; }

/* 공통 - 헤더영역 */
header h1 {padding:15px 0; text-align:center;}
header h1 img {vertical-align:middle; width:130px; max-height:100%;}


#GNB_pc {display:none;}

#wrapMENU { background:rgba(0,0,0,0.6);position:fixed;top:0;right:0;z-index:99999;height:100%;overflow-y:auto;width:100%; display: none;}
.wrap_gnb {padding-top:64px; position:absolute; right:0; width:240px; height:100%; background:#000;}
.gnb_bg {width:100%; height:100%; position:absolute; top:0; right:0;}

#gnb_1dul {text-align:left; background:#000; color:#fff; border-top:1px solid #7e7e7e;}
#gnb_1dul a {display:block; padding:10px; color:#fefefe; border-bottom:1px solid #7e7e7e;}
#gnb_1dul .active {background:#282828;}
#gnb_1dul .active a {color:#fefefe; border-bottom:1px dashed #626262;}
#gnb_1dul .gnb_1dli .gnb_2dul a {color:#fff;}

#gnb_1dul .gnb06 {background:#6e563b;}
#gnb_1dul .gnb06 a {color:#f0ff03;}

.gnb_2dul {display:none; color:#fff; background:#282828;}
.gnb_2dul a {border-bottom:1px dashed #626262 !important;}
.gnb_2dul li:last-child a {border-bottom:1px solid #626262 !important;}

#gnb_open {position:absolute; top:20px; right:20px; background:none; border:none; padding:0; z-index: 9999;}
#gnb_close {z-index:500; position:absolute; top:16px; right:0; background:none;}

#gnb_1dul ._diu_btn {background:none;}
.gnb_1dli {position:relative; width:100%;}
.gnb_1dli ._diu_btn {position:absolute; top:6px; right:0;}



/* 하단영역 */
footer {clear:both; overflow:hidden; position:relative; padding:15px; background:#c9c9c9; font-size:12px; color:#959595;}
footer img {vertical-align:middle;}
footer ul {overflow:hidden; margin-top:5px;}
footer ul li {float:left; margin-right:10px;}
footer ul li:last-child {font-size:10px;}

footer ul li a:link {color:#959595;}
footer ul li a:hover {color:#959595; font-weight:normal;}


@media (min-width: 768px) {
    .wrap_body {min-width:768px;}
    .context_width1200 {max-width:768px; }

    /* 공통 - 헤더영역 */
    header {padding:20px 75px;}
    header h1 {padding:20px 0; text-align:left;}
    header h1 img {vertical-align:middle; width:auto;}
    .wrap_header {position:relative;}
    .wrap_header nav {position: absolute; top:0; right: -20px; font-size:16px;}
    .wrap_header nav > ul > li {float:left; font-weight:bold;}

    .gnb_pc_1dul:after {content: " "; display: block; clear: both; }

    .gnb_pc_1dul > li {position: relative; margin-left: 4px;}

    .gnb_pc_1dul > li > a {display: block; padding: 20px;}

    .gnb_pc_2dul {display: none; position: absolute; width: 100%; padding: 5px; border: 1px solid #ee3124; box-sizing: border-box; background-color: #fff; font-size: 12px; font-weight: normal; z-index: 9999;}

    .gnb_pc_2dul > li > a {display: block; padding: 6px; letter-spacing: -2px;}

    #GNB_pc {display:block;}
    #gnb_open {display:none;}
    #wrapMENU {display:none;}


    /* 하단영역 */
    footer {padding:15px 75px; margin-top:30px; font-size:12px; background:#ebebeb; font-size:10px;}
    footer ul {position:absolute; top:0; left:110px; margin-top:0;}
    footer ul li {float:left; margin-left:0;}
    footer ul li:last-child {font-size:10px;}

    footer ul li a:link {color:#959595;}
    footer ul li a:hover {color:#959595; font-weight:normal;}
}

@media (min-width: 1200px) {
    /* 1200px이상 데스크탑 */

    .context_width1200 {max-width:1200px;}

    /* 공통 - 헤더영역 */
    .wrap_header nav {font-size:19px; right: -40px;}

    .gnb_pc_1dul > li > a {padding: 20px 40px;}
    .gnb_pc_2dul > li > a {padding: 8px; font-size: 14px; letter-spacing: 0;}
    /* 하단영역 */
    footer {padding:15px 75px; font-size:12px;}
    footer ul li {margin-left:20px;}
    footer ul li:last-child {font-size:12px;}

    /* 공통 - 헤더영역 */
    header {padding:20px 0px;}

    /* 하단영역 */
    footer {padding:15px 0; font-size:12px;}
}