@charset "utf-8";

@import url('lib/animated.css');
@import url('lib/jquery-ui-1.10.4.custom.min.css');
@import url('lib/swiper.css');
@import url('lib/daterangepicker.css');
@import url('lib/jquery.mCustomScrollbar.css');


/* ==============================
 * header
 * ============================== */
 /*
#headerWrap { position:relative; width:100%; min-width:1200px; height:120px; margin:0 auto;}
*/
#headerWrap { position:fixed; top:0; left:0; z-index:4; width:100%; min-width:1200px; height:120px; margin:0 auto; background:#fff;}
#headerWrap.border { border-bottom:1px solid #e5e5e5;}
#headerWrap + #container { margin-top:120px;}
/*
#headerWrap h1 { position:absolute; top:15px; left:50%; z-index:1; width:140px; height:91px; margin-left:-49px; font-size:0; background:url('../images/common/logo.jpg') no-repeat;}
#headerWrap h1 a { display:block; height:100%;}
#headerWrap .gnb { overflow:hidden; position:relative; width:1200px; margin:0 auto;}
#headerWrap .gnb ul { padding:0 32px;}
#headerWrap .gnb li { float:left; padding:30px 0; margin-right:10px;}
#headerWrap .gnb li.right { margin-left:380px;}
#headerWrap .gnb a { display:block; padding:20px; font-size:16px; color:#323232;}
#headerWrap .gnb li.on a { font-weight:bold;}
*/

#headerWrap h1 { position:absolute; top:15px; left:50%; z-index:1; width:140px; height:91px; margin-left:-70px; font-size:0; background:url('../images/common/logo.jpg') no-repeat;}
#headerWrap h1 a { display:block; height:100%;}
#headerWrap .gnb { overflow:hidden; position:relative; width:1200px; margin:0 auto;}
#headerWrap .gnb ul { padding:0 32px;}
#headerWrap .gnb li { float:left; padding:30px 0; margin-right:10px;}
#headerWrap .gnb li:nth-child(1) { margin-right:40px;}
#headerWrap .gnb li:nth-child(2) { margin-right:40px;}
#headerWrap .gnb li:nth-child(3) { margin-right:0px;}
#headerWrap .gnb li.right { margin-left:310px; margin-right:40px;}
#headerWrap .gnb a { display:block; padding:20px; font-size:16px; color:#323232;}
#headerWrap .gnb li.on a { font-weight:bold;}

#headerWrap .languageWrap {position:absolute; top:47px; left:50%; z-index:3; margin-left:427px;} 
#headerWrap .languageWrap a { display:block; position:relative; padding-left:15px; width:70px; height:28px; border:1px solid #e1e1e1; color:#222; line-height:26px; text-transform:uppercase;}
#headerWrap .languageWrap > a:after { content:''; position:absolute; top:50%; right:10px; width:5px; height:3px; margin-top:-1.5px; background:url('../images/common/icon_language_arrow.png') no-repeat;}
#headerWrap .languageWrap > a.on:after { transform:rotate(180deg);}
#headerWrap .languageWrap ul { display:none;} 
#headerWrap .languageWrap ul li { margin-top:-1px; background:#fff;}
#headerWrap .languageWrap ul li a:after { content:''; position:absolute; top:50%; right:10px; width:3px; height:5px; margin-top:-2.5px; background:url('../images/common/icon_language_arrow2.png') no-repeat;}
#headerWrap .languageWrap ul li a:hover { background:#ebebeb;}

#headerWrap .btnAllMenu { position:absolute; top:50px; left:50%; width:22px; height:21px; margin-left:525px; font-size:0; background:url('../images/common/btn_all.png') no-repeat;}
#headerWrap .btnAllClose { display:none; position:absolute; top:50px; left:50%; width:22px; height:21px; margin-left:549px; font-size:0; background:url('../images/common/btn_close.png') no-repeat;}

.gnbAllWrap { display:none; position:absolute; top:120px; left:0; right:0; z-index:100; width:100%; background:url('../images/common/bg_gnb_all.jpg') center center; background-size:cover;}
.gnbAllWrap .bg { position:absolute; top:0; right:0; left:0; background:rgba(0,0,0,0.6)}
.gnbAllWrap .innerBox { overflow:hidden; position:relative; padding-bottom:50px;}
.gnbAllWrap .section { float:left; width:20%; margin-top:100px;}
.gnbAllWrap .section h2 { padding-bottom:55px; border-bottom:1px solid #e5dade; font-size:24px; color:#686868;}
.gnbAllWrap .section ul { margin-top:30px;}
.gnbAllWrap .section li {}
.gnbAllWrap .section li a { display:block; position:relative; padding:15px 0 15px 20px; font-size:16px;}
.gnbAllWrap .section li a:hover { color:#131312;}
.gnbAllWrap .section li a:hover:after { content:''; display:block; position:absolute; top:50%; left:0; width:5px; height:2px; margin-top:-1px; background:#ff0b75;}
.gnbAllWrap .section.active h2 {color:#10100f; font-weight:450;}

/* ==============================
 * footer
 * ============================== */
#footerWrap { min-width:1200px; background:#1e191d;}
.footer { position:relative; width:1200px; margin:0px auto; padding:80px 50px;}
.footer .contactUs { float:left; width:343px;}
.footer .contactUs h1 { margin-bottom:20px; font-size:16px; color:#fff; text-transform:uppercase; font-weight:450;}
.footer .contactUs .tel { margin-bottom:3px; font-family:'Gmarket Sans'; font-size:40px; color:#fff;}
.footer .contactUs .tel span { color:#6c6c6c;}
.footer .contactUs .email a { color:#aaa8ab; font-size:16px;}
.footer .contactUs .btnGroup { margin-top:45px; font-size:0;}
.footer .contactUs .btnGroup a { display:inline-block; width:120px; height:44px; border:1px solid #4c494c; font-size:14px; color:#6e6e6c; line-height:44px; text-align:center;}
.footer .contactUs .btnGroup a + a { margin-left:-1px;}
.footer .contactUs .btnGroup a.on,
.footer .contactUs .btnGroup a:hover { position:relative; border-color:#acacac; color:#fff;}
.footer .addressInfo { float:left; width:557px;}
.footer .addressInfo h1 { margin-bottom:28px; font-size:16px; color:#fff; text-transform:uppercase; font-weight:450;}
.footer .addressInfo .text { color:#aaa8ab; line-height:24px;}
.footer .addressInfo .text span { color:#fff;}
.footer .addressInfo .text span + span {}
.footer .addressInfo .copy { margin-top:50px; color:#aaa8ab; font-size:12px; opacity:0.5}
.footer .siteLink { float:left; width:200px;}
.footer .siteLink .familySite { position:relative;}
.footer .siteLink .familySite button { position:relative; width:200px; height:50px; padding-left:20px; border:1px solid #5b585b; font-size:14px; color:#ffffff; text-align:left; font-weight:300;}
.footer .siteLink .familySite button:after { content:''; display:block; position:absolute; top:22px; right:22px; width:10px; height:6px; background:url('../images/common/icon_footer_arrow.png') no-repeat;}
.footer .siteLink .familySite ul { display:none; position:absolute; bottom:100%; left:0; width:100%; background:#fff;}
.footer .siteLink .familySite li { border:1px solid #e5e5e5; border-width:1px 1px 0 1px;}
.footer .siteLink .familySite li a { display:block; height:50px; padding:0 20px; line-height:50px; }
.footer .siteLink .familySite li a:hover { background:#e5e5e5;}
.footer .siteLink .sns { float:right; margin-top:110px;}
.footer .siteLink .sns a { display:inline-block; width:40px; height:40px; margin-left:11px; vertical-align:middle; font-size:0; background:url('../images/common/icon_sns.png') no-repeat;}
.footer .siteLink .sns .type1 {}
.footer .siteLink .sns .type2 { background-position:-51px 0;}
.footer .siteLink .sns .type3 { background-position:-100px 0;}


@media screen and (max-width: 1550px) {
}

@media screen and (max-width:800px) {
	
}

@media screen and (max-width:640px) {
	#headerWrap { position:fixed; z-index:100; min-width:100%; height:50px; background:#fff;}
	#headerWrap h1 { left:20px; top:12.5px; width:170px; height:25px; margin-left:0; background:url('../images/common/logo_m.png') no-repeat; background-size:100%;}
	#headerWrap .gnb { display:none;}
	#headerWrap .btnAllMenu,
	#headerWrap .btnAllClose { left:inherit; top:50%; right:10px; width:15px; height:15px; margin:-7.5px 0 0; background-size:100%;}
	.gnbAllWrap { overflow-y:auto; display:block !important; top:50px; margin-left:100%; background:#f9f9f9;}
	.gnbAllWrap .innerBox { width:auto; margin-top:20px;}
	.gnbAllWrap .bg { display:none;}
	.gnbAllWrap .section { float:none; width:auto; margin:0; box-sizing:border-box;}
	.gnbAllWrap .section h2 { padding-bottom:0; padding:0 20px; border-bottom:0; font-size:20px;}
	.gnbAllWrap .section h2 a { display:block; position:relative; height:50px; line-height:50px;}
	.gnbAllWrap .section h2 a:after { content:''; display:block; position:absolute; top:50%; right:0px; width:10px; height:5px; margin-top:-2.5px; background:url('../images/common/icon_arrow_m.png') no-repeat 0 -6px; background-size:100%;}
	.gnbAllWrap .section ul { display:none; margin-top:0;}
	.gnbAllWrap .section li {}
	.gnbAllWrap .section li a { display:block; height:40px; padding:0 20px 0 40px; line-height:40px; font-size:15px; color:#878787;}
	.gnbAllWrap .section li a:after,
	.gnbAllWrap .section li a:hover:after { content:''; display:block; position:absolute; top:50%; left:30px; width:3px; height:2px; margin-top:-1px; background:#e1e1e1;}
	.gnbAllWrap .section li a:hover,
	.gnbAllWrap .section li a.on { color:#ff0b75; background:#ffffff;}
	.gnbAllWrap .section li a.on:after,
	.gnbAllWrap .section li a:hover:after { background:#ff0b75}
	.gnbAllWrap .section.click h2 a { color:#121212;}
	.gnbAllWrap .section.click h2 a:after { background-position:0 0;}
	
	#container { padding-top:50px;}
}