@charset "utf-8";
/* 전체 레이아웃 */
#wrap {}
/* 헤더 */
#header {position:fixed; top:0; left:0; width:200px; height:100%; min-height:768px; background:#343434; z-index:9999}
#header h1 img {display:block}
#header h1 .logo_m {display:none}
#header ul.topLink {overflow:hidden}
#header ul.topLink li {float:left; width:50%; border-left:1px solid #272727}
#header ul.topLink li a {display:block; width:100%; padding:8px 0; font-size:12px; text-align:center; color:#a7a7a7; border-bottom:1px solid #272727}
#gnbWrap a.gnb_top {display:none}
#gnbClose {display:none}
#gnb {margin-top:30px}
#gnb > li {position:relative}
#gnb > li > a {display:block; font-size:17px; color:#dcdcdc; padding:9px 20px}
#gnb > li.on > a, #gnb > li.current > a {color:#fff; background:#010d19}
#gnb > li > ul.submnu {position:absolute; display:none; top:0; left:200px; width:180px; border-top:1px solid rgba(0,0,0,.1); z-index:9999}
#gnb > li > ul.submnu li > a {display:block; font-size:15px; color:#7a7a7a; padding:8px 15px; border-bottom:1px solid rgba(0,0,0,.1)}
#gnb > li > ul.submnu li.on > a, #gnb > li > ul.submnu li.current > a {color:#333; background:#fff}
#gnb > li > ul.submnu > li .snb {display:none; background:#222}
#gnb > li > ul.submnu > li .snb > li {padding:0 20px; border-top:1px solid #fff}
#gnb > li > ul.submnu > li .snb > li:first-child {border-top:0}
#gnb > li > ul.submnu > li .snb > li > a {color:#fff}
#navbg {position:fixed; display:none; top:0; left:200px; width:180px; height:100%; background:#fff; opacity:1; filter:alpha(opacity='100'); box-shadow:2px 0 2px 0 rgba(0,0,0,.1)}
body.main #navbg {opacity:.9; filter:alpha(opacity='90')}
#mNav {display:none}
#header .contact {position:absolute; bottom:220px; left:0; width:100%}
#header .contact ul {text-align:center}
#header .contact ul li {display:inline-block; width:100%; margin-bottom:10px}
#header .binfo {position:absolute; bottom:0; left:0; font-size:11px; color:#787878; line-height:1.3; padding:30px 20px; background:#010d19}
#header .binfo p.copyright {font-size:11px; color:#eee; line-height:1.3}
#header .binfo address {margin:10px 0}
#header .binfo ul li {line-height:1.6}
/* 상단 스크롤 버튼 */
#scrollTop {display:none; position:fixed; bottom:30px; right:30px; height:50px; z-index:1000}
#scrollTop a {position:relative; display:inline-block; width:45px; height:45px; text-align:center; color:#fff; line-height:45px; border-radius:50%; background:#000}
#scrollTop a img {position:absolute; top:35%; left:35%; transition:all .4s ease}
#scrollTop 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 a.on img {opacity:0; transform:rotate(360deg)}
#scrollTop a.on span {display:block; opacity:1; filter:alpha(opacity='100'); transform:rotate(0deg)}
/* 푸터 */
#footer {display:none}
/* 미디어쿼리 */
@media screen and (max-width:1024px) {
	/* main rolling */
#tabletRoll{width:100%; overflow:hidden;}
#tabletRoll .swiper-slide{width:100%; overflow:hidden;}
#tabletRoll .swiper-slide .m {width:100%;}
 /* 헤더 */
 #header {position:relative; width:100%; height:80px; min-height:inherit; background:#fff}
 #header h1 {position:absolute; top:20px; left:50%; width:130px; margin-left:-65px}
 #header h1 .logo_pc {display:none}
 #header h1 .logo_m {display:block; width:100%}
 #header ul.topLink {display:none}
 #header .contact {display:none}
 #header .binfo {display:none}
 #gnb {margin:0}
 #gnb > li > a {font-size:18px; color:#444; padding:15px 30px; border-bottom:1px solid #dedede}
 #gnb > li.current > a {color:#444 !important; background:transparent !important}
 #gnb > li > ul.submnu {position:static; width:100%; border-top:none; background:#ebebeb}
 #gnb > li > ul.submnu li > a {font-size:15px; padding-left:30px}
 #gnb > li > ul.submnu li.current > a {color:#7a7a7a !important; background:transparent !important}
 #gnbMask {display:none}
 #gnbWrap {position:fixed; top:0; left:-290px; width:280px; height:100%; background:#f8f8f8; box-shadow:2px 0 3px 0 rgba(0,0,0,.3); z-index:9999}
 #gnbWrap a.gnb_top {position:relative; display:block !important; padding:0 0 0 30px; height:80px; font-size:18px; color:#fff; line-height:80px; background:#333}
 #gnbWrap 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}
 #gnbClose {display:block !important; position:absolute; top:0; right:0; width:80px; height:80px; border:none; background:transparent; cursor:pointer; z-index:100}
 #gnbClose img {vertical-align:middle}
 #gnbMask {position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.8; filter:alpha(opacity='80'); z-index:9990}
 #mNav {display:block; position:absolute; top:80px; left:0; width:100%; height:62px; background:#474747}
 #gnbOpen {position:relative; width:80px; height:100%; border:none; background:#222; cursor:pointer}
 #gnbOpen span {position:absolute; display:block; left:50%; width:30px; height:3px; margin-left:-15px; background:#fff}
 #gnbOpen span.bar1 {top:20px}
 #gnbOpen span.bar2 {top:30px}
 #gnbOpen span.bar3 {top:40px}
 /* 푸터 */
 #footer {clear:both; display:block; padding:50px 0; background:#242424}
 #footer .inner {padding:0 50px; font-size:12px; color:#7a7a7a; text-align:center; line-height:1.5}
 #footer .inner p.copyright {font-size:12px; color:#7a7a7a; line-height:1.5}
}
@media screen and (max-width:768px) {
 /* 헤더 */
 #header {height:60px}
 #header h1 {top:16px; width:90px; margin-left:-45px}
 #gnb > li > a {font-size:15px; padding:10px 25px}
 #gnb > li > ul.submnu li > a {padding-left:25px; font-size:13px}
 #gnbWrap a.gnb_top {padding:0 0 0 25px; height:60px; font-size:15px; line-height:60px}
 #mNav {top:60px; height:47px}
 #gnbOpen {width:47px}
 #gnbOpen span {width:20px; height:2px; margin-left:-10px}
 #gnbOpen span.bar1 {top:16px}
 #gnbOpen span.bar2 {top:22px}
 #gnbOpen span.bar3 {top:28px}
 #gnbClose {width:60px; height:60px}
 /* 푸터 */
 #footer {padding:30px 0}
 #footer .inner {padding:0 30px}
}
@media screen and (max-height:768px) {
 #header .contact {display:none}
}