@charset "utf-8";

/* fonts */
.roboto{font-family: 'Roboto';}

/* basic */
html.overflow, body.overflow{overflow:hidden; }
#wrap{overflow:hidden}
.inner{width:100%; max-width:1200px; margin:0 auto; position:relative;}
.w1700{width:100%; max-width:1700px; margin:0 auto; position:relative;}
.w1400{width:100%; max-width:1400px; margin:0 auto; position:relative;}

@media all and (max-width:1700px){
	.w1700{width:93.75%;}
}
@media all and (max-width:1400px){
	.w1400{width:93.75%;}
}
@media all and (max-width:1200px){
	.inner{width:93.75%;}
}



/* header */
#wrap.main #header{}
#header{position:absolute; left:0; top:0; width:100%; z-index:101; height:120px; transition:0.2s;}
#header.on{background:transparent;}
/*#header.on a.logo{opacity:0;}*/
#header .w1700{height:100%;}
#header a.logo{position:absolute; transition:0.2s; left:0; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#header .gnb{position:absolute; right:0; top:0;}
#header .gnb > ul{font-size:0; letter-spacing:-4px; text-align:center;}
#header .gnb > ul > li{display:inline-block; vertical-align:top;}
#header .gnb > ul > li > a{display:block; font-size:18px; color:#fff; letter-spacing:-0.045em; font-weight:300; padding:47px 50px 46px; box-sizing:border-box; transition:0.2s;}
#header .gnb > ul > li:hover > a{color:#ffc064}
#header .gnb > ul > li:hover ul.depth02{display:block !important;}
#header .gnb > ul > li.depth_room ul.depth02{display:none; position:absolute; right:0; top:120px; font-size:0; letter-spacing:-4px; white-space:nowrap;}
#header .gnb > ul > li.depth_room ul.depth02 li{width:200px; height:200px; display:inline-block; vertical-align:top; margin:0 3px; position:relative;}
#header .gnb > ul > li.depth_room ul.depth02 li:before{content:""; opacity:0; transition:0.2s ease-in-out; width:11px; height:11px; background:#c19f6d; z-index:2; position:absolute; left:50%; top:-5px; transform:translateX(-50%) rotate(45deg); -ms-transform:translateX(-50%) rotate(45deg); -webkit-transform:translateX(-50%) rotate(45deg); -o-transform:translateX(-50%) rotate(45deg); -moz-transform:translateX(-50%) rotate(45deg);}
#header .gnb > ul > li.depth_room ul.depth02 li a{display:block; height:100%; position:relative;}
#header .gnb > ul > li.depth_room ul.depth02 li a .img{width:100%; height:100%; background-size:cover; background-position:center; background-repeat:no-repeat;}
#header .gnb > ul > li.depth_room ul.depth02 li a .img:after{content:""; width:100%; height:100%; position:absolute; left:0; top:0; border:3px solid #c19f6d; box-sizing:border-box; opacity:0; transition:0.2s ease-in-out; z-index:2;}
#header .gnb > ul > li.depth_room ul.depth02 li a .img:before{content:""; width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; left:0; top:0; transition:0.2s ease-in-out}
#header .gnb > ul > li.depth_room ul.depth02 li p{background:rgba(0,0,0,0.5); position:absolute; left:0; top:0; width:100%; padding:12px 10px; text-align:center; box-sizing:border-box; font-size:18px; color:#ffffff; letter-spacing:-0.045em; font-weight:200;}
#header .gnb > ul > li.depth_room ul.depth02 li:hover:before{opacity:1;}
#header .gnb > ul > li.depth_room ul.depth02 li:hover a .img:before{opacity:0;}
#header .gnb > ul > li.depth_room ul.depth02 li:hover a .img:after{opacity:1;}
#header .gnb > ul > li.depth_text{position:relative;}
#header .gnb > ul > li.depth_text > a{position:relative;}
#header .gnb > ul > li.depth_text > a:before{content:""; opacity:0; transition:0.2s ease-in-out; width:11px; height:11px; background:#c19f6d; z-index:2; position:absolute; left:50%; bottom:-5px; transform:translateX(-50%) rotate(45deg); -ms-transform:translateX(-50%) rotate(45deg); -webkit-transform:translateX(-50%) rotate(45deg); -o-transform:translateX(-50%) rotate(45deg); -moz-transform:translateX(-50%) rotate(45deg);}
#header .gnb > ul > li.depth_text ul.depth02{display:none; position:absolute; width:100%; top:100%; padding:15px 0;}
#header .gnb > ul > li.depth_text ul.depth02 li a{padding:10px 0; display:block; font-size:18px; color:#a3a3a3; letter-spacing:-0.045em; font-weight:300; text-align:center; transition:0.2s;}
#header .gnb > ul > li.depth_text ul.depth02 li:hover a{color:#fff; font-weight:500;}
#header .gnb > ul > li.depth_text:hover > a:before{opacity:1;}


#header .all_menu_btn{width:38px; height:38px; display:none; cursor:pointer; position:fixed; right:3.125%; top:30px; transition:0.2s ease-in; transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg); -moz-transform:rotate(-45deg);}
#header .all_menu_btn i{width:17px; height:17px; border:1px solid #fff; box-sizing:border-box; display:block; position:absolute; transition:0.2s;}
#header .all_menu_btn i:nth-of-type(1){left:0; top:0;}
#header .all_menu_btn i:nth-of-type(2){right:0; top:0;}
#header .all_menu_btn i:nth-of-type(3){left:0; bottom:0;}
#header .all_menu_btn i:nth-of-type(4){right:0; bottom:0; background:#fff}
#header .all_menu_btn.on{transform:rotate(0deg); -ms-transform:rotate(0deg); -webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -moz-transform:rotate(0deg);}
#header .all_menu_btn.on i{width:1px; height:24px; background:#fff}
#header .all_menu_btn.on i:nth-of-type(1){left:2px; top:3px; transform-origin:left top; transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg); -moz-transform:rotate(-45deg);}
#header .all_menu_btn.on i:nth-of-type(2){right:2px; top:3px; transform-origin:right top; transform:rotate(45deg); -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); -moz-transform:rotate(45deg);}
#header .all_menu_btn.on i:nth-of-type(3){left:2px; bottom:4px; transform-origin:left bottom; transform:rotate(45deg); -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); -moz-transform:rotate(45deg);}
#header .all_menu_btn.on i:nth-of-type(4){right:2px; bottom:4px; transform-origin:right bottom; transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg); -moz-transform:rotate(-45deg);}

@media all and (max-width:1400px){
	#header .gnb > ul > li.depth_room ul.depth02 li{width:150px; height:150px;}
	#header .gnb > ul > li.depth_room ul.depth02 li p{padding:5px 10px; font-size:16px;}
	#header .gnb > ul > li > a{padding:47px 30px 46px}
}
@media all and (max-width:1200px){
	#header .gnb > ul > li > a{padding:47px 20px 46px}
}
@media all and (max-width:1000px){
	#header{height:100px;}
	#header a.logo img{max-width:80%}
	#header .gnb{display:none}
	#header .all_menu_btn{display:block;}
}



/* all_menu */
#all_menu{display:none; position:fixed; left:0; top:0; width:100%; height:100%; z-index:100; overflow:hidden; text-align:center; background:#3d3b38; font-size:0; letter-spacing:-4px;}
#all_menu .logo {position:absolute; left:20px; top:20px; width:100%; text-align:left; }
#all_menu .logo img {max-width:70%; }
#all_menu:before{content:""; display:inline-block; vertical-align:middle; width:0; height:100%;}
#all_menu .gnb{display:inline-block; vertical-align:middle; width:100%; max-height:calc(100% - 100px); margin:100px 0; box-sizing:border-box; overflow-y:auto;}
#all_menu .gnb > ul > li > a{display:block; font-size:26px; color:#fff; letter-spacing:-0.045em; font-weight:300; padding:40px 0; position:relative;}
#all_menu .gnb > ul > li:hover > a{background:#c19f6d; color:#fff;}
#all_menu .gnb > ul > li > a:before{content:""; opacity:0; transition:0.2s ease-in-out; width:20px; height:20px; background:#c19f6d; z-index:2; position:absolute; left:50%; bottom:-10px; transform:translateX(-50%) rotate(45deg); -ms-transform:translateX(-50%) rotate(45deg); -webkit-transform:translateX(-50%) rotate(45deg); -o-transform:translateX(-50%) rotate(45deg); -moz-transform:translateX(-50%) rotate(45deg);}
#all_menu .gnb > ul > li.on > a{background:#c19f6d; color:#fff;}
#all_menu .gnb > ul > li.on > a:before{opacity:1;}
#all_menu .gnb > ul > li.depth_room ul.depth02{display:none; background:#292725; padding:40px 15px; box-sizing:border-box;}
#all_menu .gnb > ul > li.depth_room ul.depth02 li{width:calc(33.333333% - 10px); height:200px; margin:5px; display:inline-block; vertical-align:top;}
#all_menu .gnb > ul > li.depth_room ul.depth02 li a{display:block; height:100%; position:relative; padding-top:34px; box-sizing:border-box; }
#all_menu .gnb > ul > li.depth_room ul.depth02 li a .img{position:relative; width:100%; height:100%; background-size:cover; background-position:center; background-repeat:no-repeat;}
#all_menu .gnb > ul > li.depth_room ul.depth02 li a .img:after{content:""; width:100%; height:100%; position:absolute; left:0; top:0; border:3px solid #c19f6d; box-sizing:border-box; opacity:0; transition:0.2s ease-in-out; z-index:2;}
#all_menu .gnb > ul > li.depth_room ul.depth02 li a .img:before{content:""; width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; left:0; top:0; transition:0.2s ease-in-out}
#all_menu .gnb > ul > li.depth_room ul.depth02 li p{background:rgba(0,0,0,0.7); z-index:10; position:absolute; left:0; top:0; width:100%; padding:5px 10px; text-align:center; box-sizing:border-box; font-size:16px; color:#ffffff; letter-spacing:-0.045em; font-weight:400; }
#all_menu .gnb > ul > li.depth_room ul.depth02 li:hover a .img:before{opacity:0;}
#all_menu .gnb > ul > li.depth_room ul.depth02 li:hover a .img:after{opacity:1;}
#all_menu .gnb > ul > li.depth_text ul.depth02{display:none; padding:15px 0; background:#292725;}
#all_menu .gnb > ul > li.depth_text ul.depth02 li a{padding:30px 0; display:block; font-size:22px; color:#fff; letter-spacing:-0.045em; font-weight:300; text-align:center; transition:0.2s;}
#all_menu .gnb > ul > li.depth_text ul.depth02 li:hover a{color:#fff; font-weight:500;}
#all_menu .gnb > ul > li.depth_text:hover > a:before{opacity:1;}

@media all and (min-width:1000px){
	#all_menu{display:none !Important}
}
@media all and (max-width:640px){
	#all_menu .gnb > ul > li > a{font-size:22px; padding:20px 0;}
	#all_menu .gnb > ul > li.depth_room ul.depth02{padding:20px 15px;}
	#all_menu .gnb > ul > li.depth_room ul.depth02 li{height:140px;}
	#all_menu .gnb > ul > li.depth_text ul.depth02 li a{font-size:20px; padding:15px 0;}
}


/* footer */
#footer .top{background:#262421}
#footer .top:after{clear:both; content:""; display:block; height:0; visibility:hidden}
#footer .top .tit{width:250px; height:80px; float:left; text-align:center; font-size:0; padding:0 30px; box-sizing:border-box; background:#5f5649}
#footer .top .tit:before{content:""; width:0; height:100%; display:inline-block; vertical-align:middle;}
#footer .top .tit p{display:inline-block; vertical-align:middle; font-size:24px; color:#fff; letter-spacing:-0.045em; font-weight:300;}
#footer .top .desc{width:calc(100% - 330px); float:left; padding:0 0 0 50px; box-sizing:border-box;}
#footer .top .desc ul li a{display:block; font-size:20px; color:#94908b; letter-spacing:-0.045em; font-weight:300; padding:24px 0 24px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#footer .top a.top_btn{position:absolute; right:0; top:0; width:80px; height:80px; border-left:1px solid #3d3b38; border-right:1px solid #3d3b38; box-sizing:border-box; padding:28px 0 0; font-size:18px; color:#94908b; letter-spacing:-0.045em; font-weight:300; text-align:center;}
#footer .top a.top_btn i{display:block;border:1px solid #94908b; border-left:0; border-bottom:0; width:11px; height:11px; box-sizing:border-box; margin:0 auto; transform:rotate(-45deg); -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg); -moz-transform:rotate(-45deg);}

#footer .bot{padding:40px 0; background:#3d3b38}
#footer .bot a.ft_logo{position:absolute; right:0; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#footer .bot .btns01{font-size:0; letter-spacing:-4px;}
#footer .bot .btns01 a{text-align:center; display:inline-block; vertical-align:top; width:180px; height:50px; line-height:50px; background:#65625d; font-size:20px; color:#bdbdbd; letter-spacing:-0.045em; font-weight:300;}
#footer .bot .btns01 a + a{margin-left:10px;}
#footer .bot .btns01 a:hover{color:#fff; background:#a4885f;}
#footer .bot .btns02{margin:25px 0; font-size:0; letter-spacing:-4px;}
#footer .bot .btns02 a{display:inline-block; vertical-align:top; padding:0 10px; font-size:20px; color:#cacaca; letter-spacing:-0.045em; font-weight:300; box-sizing:border-box; position:relative;}
#footer .bot .btns02 a:first-child{padding-left:0;}
#footer .bot .btns02 a:before{content:"·"; position:absolute; right:-4px; top:0;}
#footer .bot .btns02 a:last-child:before{display:none}
#footer .bot .btns02 a:hover{color:#a4885f}
#footer .bot ul li{margin:3px 0;}
#footer .bot ul li{display:inline-block; vertical-align:top; padding:0 10px; font-size:18px; color:#bdbdbd; letter-spacing:-0.045em; font-weight:300; position:relative;}
#footer .bot ul li a{font-size:inherit; color:inherit}
#footer .bot ul li:before{content:""; width:1px; height:12px; background:#696969; position:absolute; right:0; top:7px;}
#footer .bot ul li:first-child{padding-left:0;}
#footer .bot ul li:last-child:before{display:none}
#footer .bot p{font-size:15px; color:#908b82; letter-spacing:-0.045em; font-weight:300; margin:20px 0 0;}

@media all and (max-width:1000px){
	#footer .top .tit{float:none; width:100%; width:200px; height:50px;}
	#footer .top .desc ul li a{padding:15px 0;}
	#footer .top .desc{float:none; width:calc(100% - 80px); padding:0;}
	#footer .top a.top_btn{height:109px; padding:44px 0 0;}
	#footer .bot a.ft_logo{position:static; right:auto; top:auto; transform:none !Important; margin:0 0 30px; display:block;}
	#footer .bot .btns01 a{width:140px;}
}

