@charset "utf-8";

#wrap {overflow:hidden; position:relative; width:100%; min-width:1200px; }
#skip-nav {position:fixed; left:0; top:-40px; width:100%; text-align:center; line-height:40px; background:rgba(0, 0, 0, 0.5); color:#ffffff; font-size:16px; z-index:10000; transition:top 0.3s;}
#skip-nav:focus {top:0;}

#top-banner {overflow:hidden; position:relative; height:150px; border-bottom:1px solid #e5e5e5;}
#top-banner .btn-close {position:absolute; top:16px; right:50%; z-index:5; margin-right:-588px;}
#top-banner .slider-wrap {position:absolute; top:0; left:50%; width:2000px;  height:150px; margin-left:-1000px;}
#top-banner .bx-wrapper .bx-pager {bottom:10px;}
#top-banner .bx-wrapper .bx-pager.bx-default-pager a {background:#ddd;}
#top-banner .bx-wrapper .bx-pager.bx-default-pager a.active {background: #fff;}


#header {height:180px; background:#fff;}
#header #header-top {position:relative; width:1200px; height:120px; margin:0 auto; padding:29px; text-align:center;}
#header-top .top-util {overflow:hidden; position:absolute; top:55px; right:0;}
#header #header-top .top-util li {float:left;}
#header #header-top .top-util * {vertical-align:middle;}
#header #header-top .top-util li.login a {background-image:url('/images/common/util_img01.jpg');}
#header #header-top .top-util li.join a {background-image:url('/images/common/util_img02.jpg');}
#header #header-top .top-util li.favorite a {background-image:url('/images/common/util_img03.jpg');}
#header #header-top .top-util li a {display:block; height:16px; padding:0 12px 0 20px; font-size:13px; color:#4c4c4c; line-height:18px; background:url() no-repeat left center;}

#header-bottom {overflow:hidden; position:relative; z-index:5; height:62px; background:#f9f8f2; transition:all 0.4s ease; -webkit-transition:all 0.4s ease;}
#header-bottom:before {position:absolute; top:0; left:0; width:100%; height:60px; border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; background:#fff; content:'';}
#header-bottom.on {height:122px;}
nav {width:1200px; position:relative; margin:0 auto; text-align:center; border-top:1px solid #e6e6e6;}
nav .btn-home {position:absolute; top:0px; left:-60px;}
nav .btn-menu {position:absolute; top:0px; right:-60px;}
#gnb {position:relative; z-index:100; display:inline-block; width:1200px; height:62px;}
#gnb > ul {display:inline-block; width:100%;}
#gnb > ul > li {float:left; border-right:1px solid #e6e6e6; }
#gnb > ul > li.s01 {width:190px;}
#gnb > ul > li.s02 {width:115px;}
#gnb > ul > li.s03 {width:115px;}
#gnb > ul > li.s04 {width:145px;}
#gnb > ul > li.s05 {width:130px;}
#gnb > ul > li.s06 {width:180px;}
#gnb > ul > li.s07 {width:180px;}
#gnb > ul > li.s08 {width:145px;}
#gnb > ul > li.a-left {position:relative;}
#gnb > ul > li.a-left .sub {left:0; width:1000px;}
#gnb > ul > li.a-right .sub {right:0; width:auto;}
#gnb > ul > li:first-child {border-left:1px solid #e6e6e6;}
#gnb > ul > li > a {position:relative; display:block; line-height:62px; font-size:17px; color:#212121;}
#gnb > ul > li > a:after {position:absolute; bottom:0; left:50%; right:0; width:0; height:2px; background:#d1860d; content:''; transition:all 0.4s ease; -webkit-transition:all 0.4s ease;}
#gnb > ul > li.on > a:after {left:0; width:100%;}
#gnb .sub {display:none; overflow:hidden; position:absolute; top:62px;}
#gnb .sub li {float:left; margin-right:40px; }
#gnb .sub li a {position:relative; display:block; padding-left:7px; line-height:60px;}
#gnb .sub li a:before {position:absolute; top:50%; left:0; width:2px; height:2px; margin-top:-1px; font-size:15px; color:#333333; background:#66676b; content:'';}
#gnb li.on .sub {display:block; }
#gnb li .sub li a:hover {color:#d1860d;}


#q-menu {position:absolute; top:182px; right:0; z-index:999999;}
#q-menu.fixed-top {position:fixed; top:0; right:0; }
#q-menu h2 {border:1px solid #b2a2a3; border-bottom:0;}
#q-menu ul {width:100px; background:#f4f0ee; border:1px solid #b2a2a3; border-top:0;}
#q-menu ul li {}
#q-menu ul li a {overflow:hidden; display:block; height:95px; text-indent:-999px; background-image:url('/images/common/q_menu.png');}
#q-menu ul li a:hover {background-image:url('/images/common/q_menu_on.png');}
#q-menu ul li.s01 a {background-position: 0 0;}
#q-menu ul li.s02 a {background-position: 0 -95px;}
#q-menu ul li.s03 a {background-position: 0 -185px;}
#q-menu ul li.s04 a {background-position: 0 -280px;}
#q-menu ul li.s05 a {background-position: 0 -375px;}
#q-menu ul li.s06 {height:95px;}
#q-menu ul li.s06 a {text-indent:0;}
#q-menu ul li.s07 {height:126px;}
#q-menu ul li.s08 a {height:40px; background-image:url('/images/common/q_menu_top.jpg');}



#bottom {background:#352c27; text-align:center;}
.bottom-cont {display:inline-block; overflow:hidden; width:1200px; height:190px; text-align:left;}
.bottom-cont h2 {float:left; width:330px;}
#q-counsel {overflow:hidden; float:right; width:870px; padding:29px 0;}
#q-counsel .table {display:table; float:left; width:530px; padding:6px 50px; border-left:1px solid #5d5652; border-right:1px solid #5d5652;}
#q-counsel .f-row {overflow:hidden; font-size:16px; color:#ffffff; }
#q-counsel .f-row label {float:left; width:85px; line-height:34px;}
#q-counsel .f-row input {float:left; width:330px; height:35px; padding:7px; margin-bottom:6px; font-size:14px; }
#q-counsel .f-row select {float:left; width:330px; height:35px; padding:7px; margin-bottom:6px; font-size:14px;}
#q-counsel .agree-box {float:right; width:340px; padding-left:58px;}
#q-counsel .agree-box p {padding-top:17px;}
#q-counsel .agree-box input[type="image"] {margin-top:13px; background:#020202; font-size:22px; color:#fff;}
#q-counsel .agree-box label {color:#fff;}


footer {padding-bottom:50px; text-align:center; background:#1f1f1f;}
#sns-link {padding:40px 0; border-bottom:1px solid #383838; text-align:center;}
#sns-link li {display:inline-block;} 
#sns-link li+li {margin-left:13px;}
#sns-link li img {position:relative; top:0; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
#sns-link li a {display:block; position:relative;}
#sns-link li a:hover img {top:-10px;}
#bottom-menu {padding:30px 0;}
#bottom-menu li {position:relative; display:inline-block; padding:0 10px;}
#bottom-menu li+li:before {position:absolute; top:50%; left:0; width:1px; height:13px; margin-top:-6px; background:#707070; content:'';}
#bottom-menu li a {display:block; font-size:16px; color:#fff;}
address {font-size:16px; color:#9c9c9c; }
address p {line-height:28px;}
address em {color:#fff;}
address .copyright {padding-top:10px;}