@charset "utf-8";

/* common */
::selection{background:rgba(117,61,23,.35); color:#fff;}
body{font-size:16px; word-break:keep-all; overflow:inherit; position:relative;}
body.active{overflow:hidden; position:fixed; width:100%;}
p, li, a{line-height:1.4em; font-weight:300; font-size:16px; color:#666;}

#wrap{opacity:0; transition:all 0.5s ease 0.2s;}
#wrap.active{opacity:1;}

/* header */
#header{position:fixed;z-index:99;}
#header h1 img{display:block; height:19px;}
#header h1{position:absolute;top: 53px;left: 135px;z-index:999;margin-top:-15px;}
#header .btn_menu{position:absolute;top:50%;left:50%;z-index:91; width:24px; height:24px; margin-top:-12px; margin-left:-12px; font-size:0px;transition:all 0.3s ease 0s;}
#header .btn_menu > span{display:block;position:absolute;left:0px;width:100%;height:1px; background:#222;}
#header .btn_menu > span:nth-of-type(1){top:5px;}
#header .btn_menu > span:nth-of-type(2){top:50%; width:19px; transition:background 0.3s ease 0s;}
#header .btn_menu > span:nth-of-type(3){top:19px;}
#header .btn_menu > span:nth-of-type(1),
#header .btn_menu > span:nth-of-type(3){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}
#header .btn_menu.active{transform:rotate(180deg);}
#header .btn_menu.active > span:nth-of-type(1){top:10px; transform:rotate(-45deg);}
#header .btn_menu.active > span:nth-of-type(2){background:transparent;}
#header .btn_menu.active > span:nth-of-type(3){top:10px; transform:rotate(45deg);}
#header .btn_menu.active > span:nth-of-type(1),
#header .btn_menu.active > span:nth-of-type(3){transition-delay:0s, 0.3s;}
#header .menu_fix em{display:block; position:absolute; left:50%; top:53%; width:50px; margin-left:-25px; color:#222; font-size:11px; text-align:center;}
#header .btn_close{position:absolute; top:0px; left:0px; width:30%; height:100%; font-size:0;}
#header nav{display:inline-block; z-index:-90;}
#header nav .gnb{text-align:center;}
#header nav .gnb > li{position:relative; padding:0 40px;}
#header nav .gnb > li:first-child{padding-top:60px;}
#header nav .gnb > li:last-child:after{background:none;}
#header nav .gnb > li > a{display:inline-block; padding-bottom:30px; font-size:17px; color:#fff;}
#header nav .gnb > li.reserve > a{padding-left:28px !important; color:#23282b !important; background:url(../images/common/ico_reserve.png) no-repeat 0 50%; box-sizing:border-box;}
#header.mob nav{opacity:0; position:fixed; top:0px; right:0; z-index:90; visibility:hidden; width:100%; height:100%; transition:all 0.5s ease-out 0s;}
#header.mob nav.active{opacity:1; visibility:visible;}
#header.mob nav:after{content:''; display:block; position:absolute; right:-10%; width:100%; height:100%; background:url(../images/common/bg_menu.jpg) no-repeat 100% 50%; background-size:cover; z-index:-80; transition:all 0.5s ease-out 0.5s;}
#header.mob nav.active:after{right:0px; transition-duration:3s; transition-delay:0s;}
#header.mob nav .gnb{position:absolute; top:0px; padding-left:100px; z-index:91; width:630px; height:100%; background:#fff; overflow-y:auto; box-sizing:border-box;}
#header.mob nav .gnb:before{content:''; display:block; position:absolute; top:0; left:100px; width:1px; height:100%; background:rgba(0, 0, 0, 0.12); }
#header.mob nav .gnb > li > a{display:block; padding:17px 0; font-size:17px; color:#888; transition:all 0.3s ease 0s; text-align:left;}
#header.mob nav .gnb > li > a:hover,
#header nav .gnb > li.reserve > a:hover{color:#cab271 !important;}
#header nav .gnb > li.reserve > a:hover{background:url(../images/common/ico_reserve_hover.png) no-repeat 0 50%;}
#header.mob nav .gnb > li > a.active{background:#eeaf5e; color:#fff; border-color:#eeaf5e;}
#header.mob nav .gnb > li ul{display:none; padding:20px; border-bottom:1px solid #ececec;}
#header.mob nav .gnb > li ul > li > a{display:block; padding:10px 0px;}
#header .area_util{float:right;position: fixed;right: 0;}
#header .area_util ul li{float:left; text-align:center;}
#header .area_util ul li img{display:block; height:21px; margin:0 auto;}
#header .area_util ul li i{display:block; margin-top:12px; font-size:13px; color:#fff;}
#header .area_util ul li a{display:block; width:100px; padding:23px 0; background:#23282b;}
#header .area_util ul li:last-child a{background:#cab271;}
#header .menu_fix{position:fixed; top:0; left:0; z-index:999; width:100px; height:100%; background:#fff; transition:left 2s ease-in-out 0s, background 0.5s ease 0s;}
#header .menu_fix.hideMenu{left:-100%;}
#header *[data-layout-menu="white"]{background:#fff;}
#header *[data-layout-menu="black"]{background:rgba(0,0,0,0.16);}
#header *[data-layout-menu="black"] > .btn_menu > span{background:rgba(255, 255, 255, 0.43);}
#header *[data-layout-menu="black"] em{color:#fff;}
#header nav .menu_info{position:absolute; left:0; bottom:50px; width:33%; padding-left:140px; box-sizing:border-box; z-index:91;}
#header nav .menu_info li{float:left; width:50%; margin-bottom:25px;}
#header nav .menu_info em{display:block; color:#cab271; font-size:14px; font-weight:300;}
#header nav .menu_info span{display:block; margin-top:5px; color:#444; font-size:14px; font-weight:500; text-align:left;}
#header nav .menu_info ul:after{content:''; display:block; clear:both;}
#header nav em.logo{display:none; position:absolute; bottom:75px; left:680px; z-index:91;}
#header nav em.logo img{display:block; height:19px;}
#header nav .menu_txt{display:none; position:absolute; right:40px; bottom:75px; z-index:1;}
#header nav .menu_txt p{color:#fff; font-size:40px; font-weight:100; letter-spacing:-0.5px; line-height:1.3em; text-align:right;}
#header nav .menu_txt span{display:block; margin-top:30px; color:#fff; font-size:15px; font-weight:300; text-align:right;}
#header.mob nav.active em.logo,
#header.mob nav.active .menu_txt{display:block;}

.lnb{position:absolute; top:0; right:0; z-index:9; width:-webkit-calc(100% - 720px); width:calc(100% - 720px); height:101px; box-sizing:border-box; border-bottom:1px solid #ededed; background: #fff;}
.lnb ul{display:table; height:100%;}
.lnb ul:after{content:''; display:block; clear:both;}
.lnb ul li{display:table-cell; height:100%; vertical-align:middle;}
.lnb ul{overflow:hidden; margin:0 210px 0 50px;}
.lnb ul li a{display:block; padding-right:50px; font-size:15px; color:#999;}
.lnb ul li a.on{color:#cab271; font-weight:600;}
.lnb ul li:last-child{margin-right:0;}
.lnb ul li.active a{font-weight:600; color:#cab271;}
.lnb .noneTable{display:block; box-sizing:border-box; padding-top:12px;}
.lnb .noneTable li{float:left; height:auto; padding:7px 0px;}
.lnb .noneTable li a{padding-right:30px;}
.btn_m_lnb{display:none; position:relative; padding:12px 35px 12px 15px; border:1px solid #dbdbdb; font-size:16px; transition:all 0.3s ease 0s;}
.btn_m_lnb:after{content:''; display:block; position:absolute; right:20px; top:50%; width:13px; height:7px; margin-top:-3.5px; background:url(../images/common/img_arrow_gray.png) no-repeat 0 0; background-size:100%; transition:all 0.3s ease 0s;}
.btn_m_lnb.active{background-color:#cab271; border:1px solid #ccb473; color:#fff;}
.btn_m_lnb.active:after{background-image:url(../images/common/img_arrow_white.png); transform:rotate(-360deg);}

/* tab */
.area_tab{position:relative; top:102px; left:720px; width:calc(100% - 720px); background:#f7f7f7; z-index:8;}
.area_tab ul{margin-left:50px;}
.area_tab li{float:left; margin-right:35px;}
.area_tab li a{display:block; position:relative; padding:20px 0; color:#888; font-size:15px; font-weight:300; box-sizing:border-box;}
.area_tab li a.on{color:#cab271; font-weight:500;}
.area_tab li a.on:before{content:''; display:block; position:absolute; top:-1px; left:0; width:47px; height:1px; background:#cab271; z-index:8;}
.area_tab ul:after{content:''; display:block; clear:both;}


/* footer */
#footer{position:relative; background:#181c1e; z-index:100;}
#footer .quick{margin:0 auto; text-align:center; border-bottom:1px solid rgba(255, 255, 255, 0.08);}
#footer .quick li{display:inline-block; margin:0 40px; text-align:center;}
#footer .quick li a{display:block; position:relative; padding:25px 10px; box-sizing:border-box; color:rgba(255, 255, 255, 0.4); font-size:14px; font-weight:300;}
#footer .quick li a:hover{color:#cab271;}
#footer .quick li a:hover:before{content:''; display:block; position:absolute; left:0; bottom:-1px; width:100%; height:2px; background:#cab271;}
#footer h1{padding-top:150px;}
#footer h1 img{display:block; height:25px; margin:0 auto;}
#footer ul{text-align:center;}
#footer .tel{margin-top:45px;}
#footer .tel li,
#footer .add li{display:inline-block; position:relative; margin:5px 15px;}
#footer .tel li:before,
#footer .add li:before{content:''; display:block; position:absolute; left:-16px; top:50%; width:2px; height:2px; margin-top:-1px; background:rgba(255, 255, 255, 0.6);}
#footer .tel li:first-child:before,
#footer .add li:first-child:before{display:none;}
#footer li em{display:inline-block; color:#fff; font-size:14px; font-weight:300;}
#footer .tel li em{color:#cab271; font-size:15px;}
#footer .tel li a{display:inline-block; margin-left:8px; color:rgba(255, 255, 255, 0.6); font-size:16px; font-weight:300;}
#footer .add li span{display:inline-block; margin-left:8px; color:rgba(255, 255, 255, 0.3); font-size:14px; font-weight:300;}
#footer .copy{margin-top:95px; border-top:1px solid rgba(255, 255, 255, 0.08);}
#footer .copy p{padding:20px 10px; color:rgba(255, 255, 255, 0.3); font-size:14px; font-weight:300; text-align:center; box-sizing:border-box; word-break:break-word;}
#footer a[class^="btn_top"]{position:absolute; right:0; top:0; width:90px; height:100%; background:#cab271;}
#footer a[class^="btn_top"] span{display:block; position:absolute; top:40%; left:0; width:100%; color:#fff; font-size:12px; transform:rotate(90deg); letter-spacing:3px;}
#footer a[class^="btn_top"] span:before{content:''; display:block; position:absolute; top:50%; left:-125px; width:94px; height:1px; background:rgba(255, 255, 255, 0.3);}

#container:after{content:''; display:block; clear:both;}

@media all and (max-width:1755px){
	#header nav .menu_info{width:50%;}
	#header nav .menu_info li{float:none; width:100%;}
	.lnb{width:calc(100% - 580px);}
	.area_tab{left:580px; width:calc(100% - 580px);}
}

@media all and (max-width:1655px){
	.lnb ul{margin:0 200px 0 50px;}
}

@media all and (max-width:1600px){
	.area_tab li{margin-right:25px;}
}

@media all and (max-width:1550px){
	.lnb{width:calc(100% - 500px);}
	.area_tab{left:500px; width:calc(100% - 500px);}
}

@media all and (max-width:1460px){
	.lnb{position:relative; z-index:3; width:100%;}
	.lnb ul{margin:0 0 0 150px;}
	.area_tab{left:0; top:0; width:100%;}
	.area_tab ul{margin-left:100px;}
	.area_tab li{width:12.5%; margin-right:0; text-align:center;}
	.area_tab li a.on:before{left:50%; width:80px; margin-left:-40px;}
}

@media all and (max-width:1280px){
	p,
	li,
	a{font-size:15px;}
	#header nav em.logo img{display:none;}
	#header nav .menu_txt p{font-size:30px;}
}

@media all and (min-width:1024px){
	#header nav .gnb > li ul{display:none; position:absolute; opacity:0; visibility:hidden; top:46px; right:-60px; width:100%; padding:9px 12px; background:#fff; box-shadow:15px 20px 29px 0px rgba(0, 0, 0, 0.23); transition:all 0.4s ease-out; transition-property:opacity, right, visibility; transition-delay:0s, 0s, 0s;}
	#header nav .gnb > li ul.active{display:block; transition-delay:0.1s;}
	#header nav .gnb > li.active ul{opacity:1;visibility:visible;right: -15px;z-index:10;transition-delay:0s, 0s, 0s;}
	#header nav .gnb > li ul > li > a{display:block;position:relative;padding: 11px 11px;background:#fff;border-top:1px solid #e1e1e1;text-align:left;color:#404040;font-size: 15px;transition:background 0.3s ease 0s;}
	#header nav .gnb > li ul > li > a:hover{color: #b8255b;}
	#header nav .gnb > li ul > li:first-child > a{border-top-width:0px;}
}

@media all and (max-width:1023px){
	#header .btn_menu,
	#header .btn_close{display:block;}
	#header nav{margin:0;}
	#header nav .gnb > li{display:block;}
	#header{position:absolute; width:100%;}
	#header .area_util{position:absolute; top:0;}
	#header h1{left:35px;}
	#header .menu_fix{position:absolute; top:0; left:auto; right:200px; width:100px; height:100px; background:#fff;}
	#header .btn_menu{top:20%; margin-top:0;}
	#header .btn_menu:after{content:''; display:block; position:absolute; left:-38px; top:-20px; width:100px; height:101px; z-index:-1;}
	#header .btn_menu.active:after{transform:rotate(0deg) !important;}
	#header .menu_fix em{top:57%; font-weight:500; z-index:1;}
	#footer h1{padding-top:100px;}
	#footer .quick li{float:left; width:20%; margin:0;}
	#footer .quick li a{padding:15px 10px;}
	#footer .quick ul:after{content:''; display:block; clear:both;}
	#footer .copy{margin-top:40px;}
	#footer a[class^="btn_top"]{top:53px; width:100%; height:50px;}
	#footer a[class^="btn_top"] span{top:0; width:100%; text-align:center; transform:rotate(0); padding-top:15px;}
	#header.mob nav .gnb{width:470px; padding-left:0;}
	#header.mob nav .gnb:before{display:none;}
	#header nav .menu_info{padding-left:40px;}
	.btn_m_lnb{display:block; font-size:15px;}
	.lnb{width:100%; height:auto; padding:20px 20px 0; border-bottom:0; box-sizing:border-box;}
	.lnb ul{display:none; position:relative; margin-left:0; padding:0; text-align:left; border:1px solid #ccc; background:#fff; z-index:100; box-shadow:0px 5px 10px 0px rgba(0, 0, 0, 0.2);}
	.lnb ul li{float:none; display:block; width:100%; height:auto; margin-right:0; padding:0;}
	.lnb li a{display:block; color:#111; padding:12px 15px; border-top:1px solid #eee; box-sizing:border-box; transition:all 0.1s ease 0s;}
	.lnb ul li:first-child a{border-top:1px solid transparent;}
	.lnb > a.on{background:transparent;}
	.lnb .noneTable{display:none; padding-top:0px;}
	.lnb .noneTable li{float:none; height:auto; padding:0px;}
	.area_tab{margin-top:20px;}
	.area_tab ul{margin-left:0;}
	.area_tab li a{font-size:14px;}
}

@media all and (max-width:900px){
	#header.mob nav .gnb > li > a{font-size:16px;}
	#header nav .menu_txt p{font-size:25px;}
	.area_tab li{width:25%;}
}

@media all and (max-width:800px){
	#header nav .menu_txt{display:none !important;}
	#header.mob nav .gnb{width:60%;}
	#header nav .menu_info{display:none;}
}

@media all and (max-width:768px){
	#header .area_util ul li a{width:85px; padding:16px 0;}
	#header .area_util ul li i{margin-top:5px;}
	#header .menu_fix{right:170px; width:85px; height:79px;}
	#header .menu_fix em{top:56%;}
}

@media all and (max-width:480px){
	#header h1{left:20px;}
	#header .area_util ul li a{width:65px; padding:12px 0;}
	#header .area_util ul li i{font-size:11px;}
	#header .menu_fix{right:130px; width:65px; height:68px;}
	#header .menu_fix em{top:59%; font-size:10px;}
	#header.mob nav .gnb{width:90%;}
	.area_tab li a{font-size:13px;}
}

@media all and (max-width:400px){
	body,
	p,
	li,
	a{font-size:13px;}
	#header .area_util ul li{float:none;}
	#header .area_util ul li a{width:62px; padding:10px 0;}
	#header .menu_fix{right:62px; width:62px; height:64px;}
	#footer .quick li{width:33.33333333333333%;}
	#footer a[class^="btn_top"]{top:107px;}
	#footer .tel{margin-top:25px;}
	.area_tab li{width:33.33333333333333%;}
}