@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Cormorant+Garamond:300,300i,400,400i,500,500i,600,600i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans:400,400i');
@import url('https://fonts.googleapis.com/css?family=Noto+Serif:400,400i');
@import url('https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400i,700');
@import url('https://fonts.googleapis.com/css?family=PT+Serif');
@import url('https://fonts.googleapis.com/css?family=Crimson+Text');
@import url('https://fonts.googleapis.com/css?family=Lora:400,700');
@import url('https://fonts.googleapis.com/css?family=Questrial');
@import url('https://fonts.googleapis.com/css?family=Michroma');
@import url('https://fonts.googleapis.com/css?family=Arimo');
@import url('http://fonts.googleapis.com/earlyaccess/notosanskr.css');
/*@import url('//fonts.googleapis.com/earlyaccess/jejumyeongjo.css');*/

@font-face {
    font-family: "NanumBarunGothic";
    font-style: normal;
    font-weight: normal;
    src: url("./fonts/NanumBarunGothic.eot?#iefix") format("embedded-opentype"), url("./fonts/NanumBarunGothic.woff") format("woff"), url("./fonts/NanumBarunGothic.ttf") format("truetype");
}

/*@font-face {
    font-family: "NanumSquare";
    font-style: normal;
    font-weight: normal;
    src: url("./fonts/NanumSquareR.eot?#iefix") format("embedded-opentype"), url("./fonts/NanumSquareR.woff") format("woff"), url("./fonts/NanumSquareR.ttf") format("truetype");
}*/

@font-face {
  font-family: 'Social-Shapes';
    src:  url('./fonts/Social-Shapes.ttf.woff') format('woff'),
    url('./fonts/Social-Shapes.ttf.svg#Social-Shapes') format('svg'),
    url('./fonts/Social-Shapes.ttf.eot'),
    url('./fonts/Social-Shapes.eot?#iefix') format('embedded-opentype'); 
    font-weight: normal;
    font-style: normal;
}

html{width:100%;height:100%;overflow-y:auto;-webkit-text-size-adjust:none;}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,input,select,textarea,form,fieldset,legend,body{margin:0;padding:0; font-family:"Open Sans",'Noto Sans KR', "NanumBarunGothic","Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial; }
*+html body body, *+html body div, *+html body li, *+html body dt, *+html body dd, *+html body p, *+html body tr, *+html body td, *+html body h2 {font-family: "Open Sans",'Noto Sans KR', "NanumBarunGothic", "Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial;}
body{visibility:visible; width:100%; font-size:13px;color:#666; background:#c5c6c9; line-height:1.5em; }
img,fieldset{border:none;}
em,address{font-style:normal;}
a{text-decoration:none;color:#333;}
li{list-style:none;}
select,textarea{border-radius:0;}
.clear {}
.clear:after {content:"";display:block;clear:both;}
.blind{visibility:hidden;width:0;height:0;font-size:0;line-height:0;overflow:hidden;}
.img_100 {width:100%; height:auto !important; vertical-align:top;}
select{min-width:50px;height:26px;margin:0;padding:0;font-size:12px;line-height:26px;font-family:Dotum,sans-serif;}
.underline {text-decoration:underline; }
.tl { text-align:left;}
.tc { text-align:center;}
.tr { text-align:right;}
.vt {vertical-align:top;}
.mb0 { margin-bottom:0 !important;}
.mb3 { margin-bottom:3px !important;}
.mb20 { margin-bottom:20px !important;}
* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.boxShadow {-webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow:    2px 2px 3px rgba(0, 0, 0, 0.1); box-shadow:2px 2px 3px rgba(0, 0, 0, 0.1);}


.transAll015 {-webkit-transition: all 0.15s ease-in-out; -moz-transition: all 0.15s ease-in-out; -ms-transition: all 0.15s ease-in-out; -o-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; }
.transAll03 {-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.transAll03_ease {-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.transAll02_ease {-webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease;}
.scale01 {-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.scale01:hover, .scale01:focus {-ms-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1);}


.strongColor01 { color:#021e2f;}

.block1280, .block1024, .block768, .block560, .block480, .block380 {display:none !important;}
.in-block1280, .in-block1024, .in-block768, .in-block560, .in-block480, .in-block380 {display:none !important;}


#skip{position:fixed;top:-9999px;left:0;z-index:1000;width:240px;height:30px;background:#676462;}
#skip a{display:block;height:30px;padding:0 0 0 20px;line-height:30px;font-size:12px;color:#333;}
#skip.on{top:0;}
.sticky-wrapper { position:absolute; width:100%; z-index:30; }
#header { position: fixed; width:auto !important; height:84px; left:66px; top:54px; border:1px solid #fff;-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; z-index:30;}
.fp-viewing-main2 #header, .fp-viewing-roomPre #header, .fp-viewing-mainCopy #header  { background:url(../images/bg/black_10.png); left:20px; top:20px;  }
.is-sticky #header { position:absolute; left:20px; margin-top:20px; background:url(../images/bg/black_10.png);}
#header:after {content:"";display:block; clear:both;}
#header h1 { position:relative; float:left;  z-index:21;}
#header h1 a { display:block; width:88px; height:84px; padding:20px 10px 20px 20px; border-right:1px solid #fff;}
#header h1 img { width:56px; vertical-align:top;}
.btn_nav { position:absolute; display:none; width:50px; height:50px; border:1px solid #fff; margin:1px; left:58px; top:9px;-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; z-index:21;}
.btn_nav .line {position: absolute; display: block; width:24px; height:20px; left:12px; top:9px; }
.btn_nav .line span {position: absolute; display: block; width:24px; height:2px; left:50%;  background: #fff; transform: translate(-50%, 0px);-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.btn_nav .text { position:absolute; width:100%; left:0; bottom:2px; font-size:9px; color:#fff; text-align:center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;  }

.btn_nav .line01 { top: 2px;}
.btn_nav .line02 {top: calc(50% - 1px); }
.btn_nav .line03 {bottom: 2px; }

.btn_nav.open_nav { background:url(../images/bg/black_50.png);}
.btn_nav.open_nav .line01 {transform: translate(-50%, 7px) rotate(45deg); -ms-transform: translate(-50%, 7px) rotate(45deg); -webkit-transform: translate(-50%, 7px) rotate(45deg);}
.btn_nav.open_nav .line02 {opacity:0; filter: alpha(opacity=0;); }
/*.btn_nav.open_nav .text {opacity:0.5; filter: alpha(opacity=50;); }*/
.btn_nav.open_nav .line03 {transform: translate(-50%, -7px) rotate(-45deg); -ms-transform: translate(-50%, -7px) rotate(-45deg); -webkit-transform: translate(-50%, -7px) rotate(-45deg); }

.gnbArea { position:relative; float:left; padding:30px 30px 0; z-index:10; }
.gnb { margin:0 auto;}
.gnb > li { float:left; margin:0 15px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.gnb > li a.depth1 { position:relative; display:inline-block; font-family: 'Playfair Display', serif; font-size:1.06em; line-height:1.8em; color:#fff; padding-bottom:5px;}
.gnb > li .depth1_mobile { display:none;}
.gnb > li a.depth1 span, .gnb > li .depth1_mobile span {font-family: 'Michroma', sans-serif; font-size:0.5em; opacity:0; filter: alpha(opacity=0;);-webkit-transition: all 0.3s ease-in-out; 
-moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.gnb > li .depth1_mobile span { line-height:1.5em; vertical-align:middle; margin-bottom:8px;}
.gnb > li.this a.depth1 span, .gnb > li a.depth1:hover span, .gnb > li a.depth1:focus span, .gnb > li:hover a.depth1 span, 
.gnb > li.this .depth1_mobile span, .gnb > li:hover .depth1_mobile span{opacity:1; filter: alpha(opacity=100;);}

.gnb_sub { position:absolute; background:#fff; margin-left:-20px; padding:0 20px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; overflow:hidden; opacity:0; filter: alpha(opacity=0;); visibility:hidden; }
.gnb_sub:after { content:"";display:block;clear:both;}
.gnb li:hover .gnb_sub, .gnb li:focus .gnb_sub { opacity:1; filter: alpha(opacity=100;); visibility: visible; padding:12px 20px; border-radius:0 4px 0 4px; }
.gnb_sub li { }
.gnb_sub li a { font-size:13px; line-height:1.8em; color:#111;}
.gnb_sub li.this a { font-weight:700; }
.gnb_sub li a:hover, .gnb_sub li a:focus { text-decoration:underline;}

.header_right { display:flex; position:fixed; right:60px; top:60px;-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; z-index:30;}
.btn_reser {font-family: 'Libre Baskerville', serif; font-size:1.1em; color:#fff; line-height:26px;-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.btn_reser:hover, .btn_reser:focus { color:#000; }
.btn_reser > span { position:relative; display:inline-block; width:26px; height:26px; border:1px solid #fff; border-radius:50%; margin-right:10px; vertical-align:middle; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.btn_reser span span { position:absolute; width:7px; height:1px; background:#fff; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.btn_reser .line01 { left:50%; top:50%;}
.btn_reser .line02 { left:50%; top:50%; margin-top:-7px; width:1px; height:7px;}
.btn_reser span img { vertical-align:top;}
.btn_reser:hover > span, .btn_reser:focus > span { margin-right:15px; background:#fff; }
.btn_reser:hover span span, .btn_reser:focus span span { background:#000;}
.btn_reser:hover .line01, .btn_reser:focus .line01 { margin-left:-1px; margin-top:1px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);}

.fp-viewing-main2 .header_right, .fp-viewing-roomPre .header_right, .fp-viewing-mainCopy .header_right, .is-sticky .header_right  { right:20px; top:20px;}


@media  (max-width: 1024px){

#header {height:auto; border:0; left:0; top:0;}
#header h1 { left:10px; top:10px;}
#header h1 a { width:50px; height:50px; padding:10px 12px; border:1px solid #fff;}
#header h1 img { width:30px;}
.btn_nav { display:block;}
.gnbArea { position:fixed; width:100%; height:100%; padding:20px 0 0; background:url(../images/bg/black_80.png); opacity:0; filter: alpha(opacity=0;); visibility:hidden;}
.open_nav .gnbArea {opacity:1; filter: alpha(opacity=100;); visibility:visible;}
.gnb { position:absolute; width:calc(100% - 20px); left:10px; top:-100%; text-align:center; border-top:1px solid rgba(255, 255, 255, 0.1); padding-top:10px; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;}
.open_nav .gnb {top:80px;}
.gnb > li { float:none; margin:0;}
.gnb > li > a.depth1 { display:none; }
.gnb > li .depth1_mobile { display:block;font-family: 'Playfair Display', serif;  font-size:1.8em; line-height:1.8em; color:#fff; padding-bottom:5px }
.gnb_sub { position:relative; background:#fff; min-height:0; height:0; margin-left:0; padding:0 10px; }
.gnb > li:hover .gnb_sub, .gnb > li.this .gnb_sub { height:auto; opacity:1; filter: alpha(opacity=100;); visibility: visible; padding:12px 20px; border-radius:0 4px 0 4px;}
.gnb_sub li { float:none; display:inline-block; margin:0 5px;}
.header_right { right:10px; top:20px;}
.fp-viewing-main2 #header, .fp-viewing-roomPre #header, .fp-viewing-mainCopy #header, .is-sticky #header {  background:none; left:0; top:0; margin-top:0; }
.fp-viewing-main2 #header h1 a, .fp-viewing-roomPre #header h1 a, .fp-viewing-mainCopy #header h1 a, .is-sticky #header h1 a,
.fp-viewing-main2 .btn_nav, .fp-viewing-roomPre .btn_nav, .fp-viewing-mainCopy .btn_nav, .is-sticky .btn_nav
{background:url(../images/bg/black_10.png);}
.fp-viewing-main2 .header_right, .fp-viewing-roomPre .header_right, .fp-viewing-mainCopy .header_right, .is-sticky .header_right   {right:10px; top:20px; }

}

/* 실시간 예약 */
.realtime_section{
	display: flex;
	flex-direction: column;
}
.realtime_reser{
    display: flex;
	text-align: center;
	margin: 25px 0;
	font-family: 'Cormorant Garamond', serif;
}

.reser-btn{
display:block;
	width: 35px;
	height: 35px
}
.reser-btn img{
	width: 100%;
	height: 100%;
}

/* 네이버 예약버튼 */
.naver-reser{
	display:block;
	width: 35px;
	height: 35px;
	margin-right: 10px;
}

.naver-reser img{
	width: 100%;
}

/* 비놀리안 버튼 */
.other_reser{
	display: block;
	width: 35px;
	height: 35px;
	z-index: 9999;
	margin-left: 10px;
}

.other_reser img{
	width: 100%;
	height: 100%
}

.lightslider li { background-position:center bottom !important; background-size:cover !important; }
.lightslider li img { width:100%; vertical-align:top;}
.lSAction { position:absolute; width:184px; height:84px; z-index:10; }
.lSAction a { float:left; display:block; width:82px; height:84px; cursor:pointer; opacity:0.5; filter: alpha(opacity=50;);
-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.lSAction a:hover, .lSAction a:focus {opacity:0.8; filter: alpha(opacity=80;);}
.lSAction a.lSNext { background-position:-82px 0;}

/* footer */
.sub #footer { position:relative; padding:10% 0 2%; background:#c5c6c9; z-index:20;}
.room00 #footer {background:#c5c6c9;}
.footerText { padding-top:10%; text-align:center;}
.sub .footerText { padding-top:1%;}
.footerText dt {font-family: 'Cormorant Garamond', serif; font-size:8.6em; line-height:1.5em; color:#000; margin-bottom:0.5em;}
.sub .footerText dt {visibility:hidden;width:0;height:0;font-size:0;line-height:0;overflow:hidden; margin-bottom:0; }
.footerText dd { max-width:1280px; width:96%; display:inline-block; margin:0 auto;}
.footerText_nav { text-align:center;}
.footerText_nav:after {content:"";display:block;clear:both;}
.footerText_nav li { float:left; width:32.7%; margin:0 0.3%;}
.footerText_nav li a { display:block; padding:0.7em 0; text-align:center; border:1px solid #000; font-family: 'Lora', serif; font-size:1.5em; font-weight:700; color:#000; line-height:1.7em; letter-spacing:0.1em; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.footerText_nav li a i { display:inline-block; font-size:1.3em; line-height:1.2em; }
.footerText_nav li a:hover, .footerText_nav li a:focus { background:#000; color:#fff;}
.copyArea { position:relative; max-width:1280px; width:96%; margin:5% auto 2%; padding-bottom:1%; border-bottom:1px solid #000;}
.sub .copyArea { margin:2% auto; }
.copyArea:after {content:"";display:block;clear:both;}
.copyArea h2 { position:absolute; width:220px; left:50%; top:0; margin-left:-110px; text-align:center;}
.copyArea h2 .img { width:104px; vertical-align:top;}
.copyArea h2 span {display:block; font-family: 'Cormorant Garamond', serif; font-size:2em; line-height:1.1em; color:#000;}
.copyArea dl { padding-top:4%;}
.copyArea dl dt {font-family: 'Questrial', sans-serif; font-size:1.2em; line-height:1.8em; color:#000; margin-bottom:0.5em;}
.copyArea dl dd { font-size:13px; line-height:1.8em; color:#656565;}
.copyArea .copy01 {float:left; text-align:left;}
.copyArea .copy02 {float:right; text-align:right;}
.copyLink { position:relative; max-width:1280px; width:96%; margin:0 auto; text-align:center; color:#000;}
.copyLink a { color:#000;}
.copyLink a:hover, .copyLink a:focus { text-decoration:underline;}

@media  (max-width: 1480px){
.sub #footer {padding:2% 0 2%;}
}

@media  (max-width: 1280px){
.footerText { padding-top:0;}
.footerText dt {font-size:7.6vw; line-height:1.5em; margin-bottom:0.5em;}
.footerText_nav li a { padding:0.7em 0; font-size:0.8em; line-height:2em; letter-spacing:0; font-weight:400; }
.footerText_nav li a i { display:inline-block; font-size:1.3em; line-height:1.2em; }
.copyArea h2 .img { width:42px; }
.copyArea h2 span { font-size:1em; margin-top:0.1em;}
.copyArea dl { padding-top:0;}


}

@media  (max-width: 640px){
.copyArea h2 { position:relative; margin:0 auto; left:0;}
.copyArea .copy01, .copyArea .copy02 {float:none; text-align:center;}
.copyArea dl { padding-top:2%;}
.copyArea dl dt {visibility:hidden;width:0;height:0;font-size:0;line-height:0;overflow:hidden; }
.copyArea dl dd { font-size:11px; line-height:1.6em;}
.copyLink { font-size:0.8em;}
} 

@media \0screen { /* IE8 웹폰트 설정*/
}


@media  (max-width: 1680px){
}

@media  (max-width: 1420px){
}

@media  (max-width: 1280px){

.none1280 {display:none;} 
.block1280 {display:block;}
.in-block1280 {display:inline-block;}

}

@media  (max-width: 1024px){

.none1024 {display:none !important;} 
.block1024 {display:block !important;}
.in-block1024 {display:inline-block !important;}


} 

@media  (max-width: 768px){

.none768 {display:none !important;;} 
.block768 {display:block !important;;}
.in-block768 {display:inline-block !important;;}

}

@media  (max-width: 560px){

.none560 {display:none !important;;} 
.block560 {display:block !important;;}
.in-block560 {display:inline-block !important;;}

}

@media  (max-width: 480px){

.none480 {display:none !important;;} 
.block480 {display:block !important;;}
.in-block480 {display:inline-block !important;;}

}


@media  (max-width: 380px){

.none380 {display:none;} 
.block380 {display:block;}
.in-block380 {display:inline-block;}	
.other_reser{
	display: block;
	margin-left: 6px;
	height: 30px;
}
.naver-reser{
	margin-right: 2px;
}

}

.hd_pops{
	position: fixed !important;
}


#hd_pop {
	width: auto !important;
}

/* 팝업 */
@media (max-width:768px) {
	#hd_pop {
		/* width: 100% !important; */
	}

	#hd_pop p {
		margin: 0;
	}

	.hd_pops {
		/* width: 90% !important; */
		left: 10px !important;
		top: 70px !important;
		max-width: calc(100% - 20px);
	}

	.hd_pops_con {
		width: auto !important;
		height: auto !important;
	}

	.hd_pops_con img {
		max-width: 100%;
	}
}