@charset "utf-8";

/* 전체 레이아웃 */
#wrap {}
#header {position:absolute; top:0; left:0; width:100%; height:auto; background:#f9f9f9; box-shadow:0 1px 2px 0 rgba(0,0,0,0.08); z-index:100}
#footer {clear:both; padding:50px 0; background:#434343}
/* 상단 영역 */
/*#header.scroll {position:fixed; left:0; width:100%; background:rgba(255,255,255,.8)}*/
#header .inner {position:relative; max-width:1400px; height:80px; margin:0 auto; padding:0 50px}
#header .inner:after {clear:both; display:block; content:''}
#header h1 {float:left; /*width:85px;*/ padding-top:25px}
#header h1 img {display:block; width:100%}
#gnb_wrap {height:100%}
#gnb_wrap:after {clear:both; display:block; content:''}
#gnb_wrap a.gnb_top {display:none}
#gnb_wrap button {display:none}
#gnb {margin-right:150px;float:right; height:100%}
#gnb > li {position:relative; float:left; height:100%}
#gnb > li > a > span {position:relative; padding-bottom:10px}
#gnb > li > a > span:before {position:absolute; bottom:0; left:0; width:0; height:2px; content:''; background:#000; transition:all .4s ease}
#gnb > li:hover > a > span:before {width:100%}
#gnb > li > a {display:block; position:relative; padding:25px 25px 0 25px; height:100%; font-family:'Montserrat'; color:#444; transition:all .4s ease; z-index:50; font-size:18px; line-height:2.3}
#gnb > li > ul.submnu {display:none; position:absolute; top:80px; left:0; min-width:160px; padding:20px 15px 30px 15px; background:#fff; box-shadow:0 2px 3px 0 rgba(0,0,0,.12); opacity:0; filter:alpha(opacity='0'); z-index:110}
#gnb > li.on > ul.submnu {display:block}
#gnb > li > ul.submnu li {position:relative; padding:5px 0; border-bottom:1px solid #eee}
#gnb > li > ul.submnu li:before {position:absolute; bottom:0; left:0; width:0; height:1px; content:''; background:#aaa; transition:all .3s ease}
#gnb > li > ul.submnu li:hover:before {width:100%}
#gnb > li > ul.submnu li:hover a{color:#333}
#gnb > li > ul.submnu li a {display:block; width:100%; height:100%; color:#888}
#btnNav {display:none; position:absolute; top:20px; right:50px; width:40px; height:40px; border:none; border-radius:2px; background:#333; cursor:pointer; z-index:1000}
#btnNav span {position:absolute; display:block; left:10px; width:20px; height:2px; background:#fff; transition:all .4s ease}
#btnNav span.bar1 {top:12px}
#btnNav span.bar2 {top:18px}
#btnNav span.bar3 {top:24px}
#btnNav.active span.bar1 {top:18px; transform:rotate(45deg)}
#btnNav.active span.bar2 {display:none}
#btnNav.active span.bar3 {top:18px; transform:rotate(-45deg)}
/* 상단 스크롤 버튼 */
#scrollTop {display:none; position:fixed; bottom:30px; left:0; width:100%; height:50px; z-index:100}
#scrollTop .inner {max-width:1400px; margin:0 auto; padding:0 50px; text-align:right}
#scrollTop .inner a {position:relative; display:inline-block; width:45px; height:45px; text-align:center; color:#fff; line-height:45px; border-radius:50%; background:#555}
#scrollTop .inner a img {position:absolute; top:35%; left:35%; transition:all .4s ease}
#scrollTop .inner a span {position:absolute; width:100%; top:0; left:50%; font-size:13px; font-weight:600; margin-left:-22px; line-height:45px; opacity:0; filter:alpha(opacity='0'); transform:rotate(-360deg); transition:all .4s ease}
#scrollTop .inner a.on img {opacity:0; transform:rotate(360deg)}
#scrollTop .inner a.on span {display:block; opacity:1; filter:alpha(opacity='100'); transform:rotate(0deg)}
/* 하단 영역 */
#footer .inner {max-width:1400px; margin:0 auto; padding:0 50px}
#footer .inner:after {clear:both; display:block; content:''}
#footer .logo {float:left; padding-top:0px; /*width:85px*/}
#footer .logo img {display:block; width:100%}
#footer .info {float:left; margin-left:50px; color:#aaa}
#footer .info address {color:#aaa; word-break: keep-all}
#footer .info ul li {display:inline-block; margin-right:10px; color:#aaa}
#footer .info ul li span {color:#ddd}
#footer .info p.copyright {color:#aaa}
#footer a {color:#aaa !important}

/* 미디어 쿼리 */
@media screen and (min-width:1280px) {
 /*#gnb {margin-right:-25px}*/
}
@media screen and (max-width:1024px) {
 #header h1 {}
 #gnb {margin-right:0;}
 #gnb_wrap {position:fixed; top:0; right:-270px; width:250px; height:100%; background:#fff; box-shadow:-2px 0 6px 0 rgba(0,0,0,.3); z-index:990}
 #gnb_wrap a.gnb_top {position:relative; display:block !important; padding:0 0 0 25px; height:80px; font-size:16px; color:#fff; line-height:80px; background:#555}
 #gnb_wrap a.gnb_top > span.nav-home {display:inline-block; width:17px; height:16px; margin-right:10px; background:url(../img/nav_home.png) 0 0 no-repeat; vertical-align:-2px}
 #gnb_wrap button {display:block; position:absolute; top:20px; right:50px; width:40px; height:40px; border:none; border-radius:2px; background:#333; cursor:pointer}
 #gnb_wrap button span {position:absolute; display:block; left:10px; width:20px; height:2px; background:#fff; transition:all .4s ease}
 #gnb_wrap button span.bar1 {top:12px}
 #gnb_wrap button span.bar2 {top:18px}
 #gnb_wrap button span.bar3 {top:24px}
 #gnb_wrap button.active span.bar1 {top:18px; transform:rotate(45deg)}
 #gnb_wrap button.active span.bar2 {display:none}
 #gnb_wrap button.active span.bar3 {top:18px; transform:rotate(-45deg)}
 #gnb {float:none}
 #gnb > li {float:none; height:auto}
 #gnb > li > a {height:auto; padding:15px 25px; font-size:16px; border-bottom:1px solid #dedede}
 #gnb > li > a > span {padding:0}
 #gnb > li > a > span:before {display:none}
 #gnb > li > ul.submnu li:before {display:none}
 #gnb > li.dropdown > a:before {position:absolute; display:block; width:2px; height:14px; right:31px; top:50%; margin-top:-7px; content:''; background:#aaa; transition:all .3s ease}
 #gnb > li.dropdown > a:after {position:absolute; display:block; width:14px; height:2px; right:25px; top:50%; margin-top:-1px; content:''; background:#aaa}
 #gnb > li.open > a:before {transform:rotate(90deg)}
 #gnb > li > ul.submnu {display:none; position:static; width:100%; padding:0; background:#f6f6f6; opacity:1 !important; filter:alpha(opacity='100') !important; box-shadow:none}
 #gnb > li > ul.submnu li {padding:0; border-color:#dedede}
 #gnb > li > ul.submnu li a {font-size:15px; padding:10px 25px}
 #gnb_mask {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.6; filter:alpha(opacity='60'); z-index:200}
 #btnNav {display:block}
 #footer .logo {float:none; margin:0 auto 30px auto; padding:0; text-align:center}
 #footer .logo img {margin:0 auto;width:30%}
 #footer .info {float:none; margin:0; text-align:center}
}
@media screen and (max-width:640px) {
 #header .inner {padding:0 30px}
 #header h1 {/*width:60px;*/ padding-top:25px}
 #btnNav {right:30px}
 #gnb_wrap button {right:30px}
 #footer {padding:30px 0}
 #footer .inner {padding:0 30px}
 #footer .logo {width:300px}
  #footer .logo img {margin:0 auto;width:80%}
 #footer .info address, #footer .info p {font-size:12px}
}
@media screen and (max-width:375px){
#header h1 img {width:80%}

	}