@charset "UTF-8";

@import url("http://fonts.googleapis.com/earlyaccess/notosanskr.css");

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,button,img,em,
menu, nav, output, ruby, section, summary,input,
time, mark, audio, video {margin:0; padding:0; border:0; font-style:normal;outline:0; color:#333; font-family:'Noto Sans KR', '돋움', AppleGothic, Dotum, sans-serif; font-size:16px;line-height:24px;vertical-align:top;background:none; list-style:none; text-decoration:none;}




.header{ position: fixed;left:0;top:0;width:100%;z-index: 5;padding:25px 0; background:rgba(0,0,0,0.5);
  -moz-transition: all .3s ease-in-out;
  -webkit-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out; }
.fp-viewing-0-0 .header{ background:none }
.header .inner{ width:1200px;margin:0 auto; }
.header .inner:after{ content:"";display: block;clear:both; }
.header .inner h1{ float:left; }
.header .inner h1 a{ display: block; }
.header .inner h1 a img{}

.header .inner > ul{ float:right; }
.header .inner > ul li{ float:left; }
.header .inner > ul li a{ display: block; font-family:'NexaL' ,'Noto Sans KR', '돋움', Dotum, sans-serif;font-size: 16px;line-height:22px; text-transform: uppercase; color: #fff;padding:10px 0px;margin:0 15px;font-weight:100;letter-spacing:2px;position: relative;}

.header .inner > ul li a:after{ content:"";display: block;background:url(../img/common/navi_bar.jpg) 0 0 no-repeat; background-size:100% 100%;height:3px;width:0;position: absolute;left:0;bottom:0;
-moz-transition: all .3s ease-in-out;
-webkit-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}



.fp-viewing-page2 .header .inner > ul li:nth-child(1) a:after,
.fp-viewing-page3 .header .inner > ul li:nth-child(2) a:after,
.fp-viewing-page4 .header .inner > ul li:nth-child(3) a:after,
.fp-viewing-page5 .header .inner > ul li:nth-child(4) a:after,
.fp-viewing-page6 .header .inner > ul li:nth-child(5) a:after,
.fp-viewing-page7 .header .inner > ul li:nth-child(6) a:after,
.fp-viewing-page8 .header .inner > ul li:nth-child(7) a:after,

.header .inner > ul li.on a:after,
.header .inner > ul li a:hover:after{ width:100%; }

.m_menu{ display: none; }







@media ( max-width:1216px ) {
	.header .inner,
	.inner_info{ width:100%; }
}


@media ( max-width:656px ) {
	.header{ padding:10px 5px; box-sizing:border-box;}
	.header .inner h1 a img{ width:120px; }

	.header .inner > ul{ display: none; }


	.m_menu{ display:block;overflow: hidden;position: fixed; right:0%;top:0;bottom:0;width:100%;}
	.m_menu.on{ z-index:3; }
	.m_menu ul{
		position: absolute;right:-70%;width:70%;top:0;bottom:0;z-index: 3; background:#000; padding:75px 15px;
		-moz-transition: all .3s ease-in-out;
		-webkit-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;box-sizing:border-box;
	}
	.m_menu.on ul{ right:0; }
	.m_menu ul li{  }
	.m_menu ul li a{ padding:5px 0; display: block; color: #fff;font-family:'NexaL' ,'Noto Sans KR', '돋움', Dotum, sans-serif;font-weight:300; border-bottom:1px solid #fff;text-transform: uppercase;}

	.open_close{ background:none;border:0;cursor:pointer; position: absolute;right:5px;top:10px; }
	.open_close span {display:block;
	width: 30px;
	height: 3px;
	margin: 4px 0;
	background-color: #c9c9ca;
	transition: .6s;
	-webkit-transition: .6s;
	}
	.open_close span.line1 {
	animation: aniLine1dft .6s forwards;
	}
	.open_close span.line2 {
	width: 30px;
	transform-origin: 0 50%;
	transition: .6s .6s;
	}
	.open_close span.line3 {
	animation: aniLine3dft .6s forwards;
	}

	@keyframes aniLine1dft {
	  0% {
		transform: translate3d(0,7px,0) rotateZ(45deg);
	  }
	  50% {
		transform: translate3d(0,7px,0) rotateZ(0deg);
	  }
	  100% {
		transform: translate3d(0,0,0) rotateZ(0deg);
	  }
	}
	@keyframes aniLine3dft {
	  0% {
		transform: translate3d(0,-7px,0) rotateZ(-45deg);
	  }
	  50% {
		transform: translate3d(0,-7px,0) rotateZ(0deg);
	  }
	  100% {
		transform: translate3d(0,0,0) rotateZ(0deg);
	  }
	}

	.open_close.on{ z-index: 5; }
	.open_close.on span.line1 {
		/* transform: translate(0.8px,-2.7px) rotate(45deg) scale(1.3, 1);
		-webkit-transform: translate(0.8px,-2.7px) rotate(45deg) scale(1.3, 1); */
		animation: aniLine1 .6s .6s forwards;
	}
	.open_close.on span.line2 {
		transform: scale3d(0, 1, 1);
		transition: .6s;
	}
	.open_close.on span.line3 {
		/* transform: translate(-1.7px,-22.3px) rotate(-45deg) scale(1.3, 1) ;
		-webkit-transform: translate(-1.7px,-22.3px) rotate(-45deg) scale(1.3, 1); */
		animation: aniLine3 .6s .6s forwards;
	}

	@keyframes aniLine1 {
		50% {
			transform: translate3d(0,7px,0) rotateZ(0deg);
		}
		100% {
			transform: translate3d(0,7px,0) rotateZ(45deg);
		}
	}

	@keyframes aniLine3 {
		50% {
			transform: translate3d(0,-7px,0) rotateZ(0deg);
		}
		100% {
			transform: translate3d(0,-7px,0) rotateZ(-45deg);
		}
	}