@charset "utf-8";


/* mobile gnb ani */
@-webkit-keyframes fade {
  0% { opacity: 0;}
  100% { opacity: 1;}
}
@keyframes fade {
  0% { opacity: 0;}
  100% { opacity: 1;}
}


/* layout */
html.no-scroll {position:fixed; left:0; top:0;}
.inner {	width:1400px;	position:relative;	margin-left:auto;	margin-right:auto;}
.s-inner {	width:1400px;	position:relative;	margin-left:auto;	margin-right:auto;}


/* Ÿ���� ���� */
@media all and (max-width:1399px) {
.inner {width:100%;}
.s-inner {width:96%;}
}

@media all and (max-width:976px) {
	#wrap { font-size: 15px; }
}

/* Ÿ���� ���� �̸� ~ ����� */
@media all and (max-width:767px) {
	#wrap { font-size: 14px; }
}

@media screen and (max-width:480px) {
	#wrap { font-size: 13px; }
}


/* header */
#header {position:absolute; left:0; top:0; width:100%; height:90px; box-sizing:border-box; border-bottom:1px solid rgba(255,255,255,0.2); z-index:300;}

#logo {position:absolute; left:40px; top:25px; width:192px; height:38px; background:url(/images/common/logo_w.png) no-repeat center center; background-size:cover; font-size:0; text-indent:-9999px;}
#logo a {display:block; width:100%; height:100%;}

#pcGnb {width:100%; text-align:center;}
#pcGnb > ul > li {display:inline-block; vertical-align:top; text-align:center; position:relative;}
#pcGnb > ul > li > a {display:block; font-size:1.15em; color:#fff; line-height:90px; letter-spacing:-0.08em; position:relative; padding:0 35px;}
#pcGnb > ul > li > ul {display:none; width:100%; background:#af833e; overflow:hidden;}
#pcGnb > ul > li > ul > li > a {display:block; width:100%; font-size:0.95em; color:rgba(255,255,255,0.9); padding:12px 0; border-bottom:1px solid rgba(255,255,255,0.3)}
#pcGnb > ul > li > ul > li:last-child > a {border-bottom:0;}

#pcGnb > ul > li:hover {background:#caa56b;}

.menuToggle {display:none; float:right; width:26px; height:19px; position:relative; margin:21px 2% 0 0; cursor:pointer;}
.menuToggle span {display:block; width:100%; height:2px; background:#fff; position:absolute; left:0; transition:all 0.5s}
.menuToggle span.t {top:0;}
.menuToggle span.m {top:50%; margin-top:-1px;}
.menuToggle span.b {bottom:0;}

#moGnb {display:none; position:fixed; top:60px; left:0; width:100%; height:100%; background:rgba(175,131,62,0.9); overflow-y:scroll; padding-bottom:100px; -ms-overflow-style:none;}
#moGnb > ul > li > a {display:block; width:100%; font-size:1.05em; color:#fff; line-height:48px; border-bottom:1px solid rgba(255,255,255,0.3); box-sizing:border-box; padding:0 2%; position:relative;}
#moGnb > ul > li > a:after {content:''; display:block; width:11px; height:1px; background:#fff; position:absolute; right:10px; top:50%; margin-top:-1px;}
#moGnb > ul > li > a:before {content:''; display:block; width:1px; height:11px; background:#fff; position:absolute; right:15px; top:50%; margin-top:-6px; transition:all 0.5s;}
#moGnb > ul > li > ul {display:none;}
#moGnb > ul > li > ul > li > a {display:block; width:100%; font-size:1em; color:#fff; line-height:45px; border-bottom:1px solid rgba(255,255,255,0.2); background:#caa56b; box-sizing:border-box; padding:0 2%;}

#moGnb > ul > li > a.active:before {transform:rotate(90deg)}


#header.mo_on {background:#fff; border-bottom:1px solid rgba(0,0,0,0.1)}
#header.mo_on #logo {background-image:url(/images/common/logo.png)}

#header.mo_on .menuToggle span {background:#222;}
#header.mo_on .menuToggle span.t {transform:translateY(8.5px) rotate(45deg)}
#header.mo_on .menuToggle span.m {width:0;}
#header.mo_on .menuToggle span.b {transform:translateY(-8.5px) rotate(-45deg)}

#header.mo_on #moGnb {display:block;}

@media screen and (max-width:1199px){
	#logo {left:2%;}

	#pcGnb {text-align:right;}
}

@media screen and (max-width:1024px){
	#header {height:60px; }

	#logo {top:16px; width:150px; height:30px;}

	#pcGnb {display:none;}

	.menuToggle {display:block;}
}


/* quick */
#Quick {position:fixed; top:220px; right:20px; width:90px; border-radius:45px; background:#1e1c1a; text-align:center; z-index:30; padding:25px 0 15px;}
#Quick li:after {content:''; display:block; width:90%; height:1px; margin:15px auto; background:rgba(255,255,255,0.1)}
#Quick li p {font-size:0.85em; color:rgba(255,255,255,0.6); font-weight:bold;}
#Quick .go_top {display:inline-block; width:50px; line-height:50px; border-radius:50%; background:#caa56b; text-align:center; font-size:0.9em; color:#fff; font-weight:bold; cursor:pointer;}

@media screen and (max-width:1599px){
	#Quick {display:none;}
}


/* footer */
#footer {background:#252525; text-align:center; padding:65px 2%; box-sizing:border-box;}
.footerTop {margin:20px 0;}
.footerTop li {display:inline-block;}
.footerTop li:before {content:''; display:inline-block; width:1px; height:14px; background:rgba(255,255,255,0.1); vertical-align:middle; margin:0 15px;}
.footerTop li:first-child:before {display:none;}
.footerTop li a {font-size:0.95em; color:rgba(255,255,255,0.3);}
.footerInfo li {display:inline-block; margin:0 5px; font-size:0.95em; color:rgba(255,255,255,0.2)}
.footerInfo li.copy {font-size:0.9em; font-weight:500; font-family:'Roboto';}

@media screen and (max-width:767px){
	#footer {padding:6% 2%}
	#f_logo {height:28px;}
	#f_logo img {height:100%}
	.footerTop {margin:3% 0}
}