

/* HEADER */
.header {position:fixed; width:100%; height:70px; top:0; right:0; left:0; background:#fff; margin:0 auto; z-index:9999; transition:all 0.3s ease; }
.header:after {position:absolute; display:block; width:100%; height:0px; top:70px; left:0; background:#eee; z-index:10; opacity:1; content:'';}
.header.active {height:350px; overflow:hidden;}
.header.header-up {top:-78px;}
.header .inner {max-width: 100%;}
.header .logo {position:relative;float:left;z-index:100;padding-left: 17px;padding-top: 5px;}
.header .logo a {display:inline-block; padding:10px 0;}
.header .gnb {position:absolute; width:100%; top:0; left:0; bottom:0; right:0; text-align:center; z-index:10;}
.header .gnb-ul {display:inline-block;max-width: 1000px;width:100%;/* margin:0 0 0 18vw; */margin: 0 auto;}
.header .gnb-li {display:inline-block;width: 16%;vertical-align:top;/* background: #ddd; *//* margin: 0; *//* padding: 0; */padding-right: -1px;margin-right: -3px;}
.header .gnb-link {position:relative;display:inline-block;width:100%;font-size:17.5px;color:#111;font-weight:500;vertical-align:middle;padding:22px 0;margin-right: 0;padding-top: 24px;padding-bottom: 25px;}
.header .gnb-link.active {color:#ed3e24}
.header .gnb-link.active:after {position:absolute; bottom:0; left:0; right:0; width:100%; height:3px; background:#ed3e24; content:'';}
.header .sub_gnb {display:none;width:100%;height: 350px;margin:0 auto;padding:25px 0;overflow:hidden;box-sizing: border-box;padding-top: -3px;}
.header .sub_gnb.active {display:block;}
.header .sub_gnb-ul {display:inline-block; text-align:center; vertical-align:top;}
.header .sub_gnb-li {padding:8px 0;}
.header .sub_gnb-link {font-size: 14px;color:#131313;font-weight:400;}
.header .sub_gnb-link:hover {color:#ed3e24; text-decoration:underline;}
.header .etc_btn {position:relative;float:right;z-index:100;margin-right: 10px;}
.header .etc_btn a {display:inline-block; padding:13px 0;}
.header .gnb-bg {position:absolute; visibility:hidden; top:70px; right:0; left:0; z-index:-10; width:100%; height:0; background:#f9f9f9; background-size:20.4vw; border-bottom:3px solid #ed3e24; margin:0 auto; transition:all 0.3s ease;}
.header .gnb-bg.active {visibility:visible; height:280px;}


.logo_red{
	width:100px;
}

/* TOGGLE STYLE */
#toggle_gnb { display:block; position:fixed; right:-100%; top:0; height:100%; width:100%; background:#fff; z-index:-99999; transition:all 0.3s ease; -webkit-transition:all 0.3s ease; }
#toggle_gnb .img {background:#f7f7f7; padding:20px; text-align:center;}
#toggle_gnb .img img {width: 10%;}
#toggle_gnb .gnb {max-width:1000px; width:100%; font-size:0; margin:0 auto;}
#toggle_gnb .gnb > div {display:inline-block;width: 50%;vertical-align:top;margin:1vw 0;padding:0 1vw;}
#toggle_gnb .gnb h2 { line-height:1em; }
#toggle_gnb .gnb h2 a {display:block;font-size: 18px;color:#333;font-weight:600;padding:20px 30px;border-bottom:1px solid #f0f0f0;background:url('../images/ico-m_nav-plus.png') no-repeat 95% 50%;}
#toggle_gnb .gnb ul { display:block;}
#toggle_gnb .gnb ul li a {display:block;font-size: 14px;color:#333;margin:12px 0;padding:0 30px;}
#toggle_gnb .gnb > div.active h2 a { background-image:url('../images/ico-m_nav-minus.png'); color:#ed3e24; }
#toggle_gnb .btn-close {position:absolute;right: 10px;top:5px;background:url('../images/btn-m_close.png') no-repeat 50% 50%;width:40px;height:40px;text-indent:-9999px;}
.bg-toggle_gnb { display:none; position:fixed; left:0; right:-100%; top:0; bottom:0; background:rgba(0,0,0,0.7); z-index:-9999;}

/* TOGGLE Active */
body.fixed  {overflow:hidden!important;}
body.fixed #toggle_gnb {right:0; z-index:99999}
body.fixed .bg-toggle_gnb {display:block; right:0;}


@media all and (max-width:1200px){
    .header .inner .gnb {display:none;}
}

@media all and (max-width:768px){
    #toggle_gnb {right:-300px; width:300px; }
    #toggle_gnb .img {padding:30px;}
    #toggle_gnb .img img {width: 48%;}
    #toggle_gnb .gnb {max-width:100%; }
    #toggle_gnb .gnb > div {display:block; width:100%; vertical-align:inherit; margin:0; padding:0;}
    #toggle_gnb .gnb h2 a {padding: 20px 0 20px 30px;}
    #toggle_gnb .gnb ul { display:none; border-bottom:1px solid #f0f0f0; }
    #toggle_gnb .gnb ul li a {margin: 16px 0;padding:0 0 0 30px;}
    body.fixed .bg-toggle_gnb  {z-index:9999}
}

@media only screen and (max-height: 750px){
    #toggle_gnb .gnb {width:100%;height: 100%;overflow-y:scroll;}
}


