@charset "utf-8";
* {scroll-behavior: smooth !important;}
#skip{position:absolute;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;}

/* .header { position:fixed; width:100%; height:66px; background:rgba(255, 255, 255, 0.8); left:0; top:0; opacity:0; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);  z-index:30;} */
.header {position: fixed; display: flex; justify-content: center; align-items: center; gap: 40px; width:100%; height:66px; background:rgba(255, 255, 255, 0.8); left:0; top:0; opacity:0; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);  z-index:30;}
@media (min-width: 1024px) {
	.header:hover {
		background: rgba(255,255,255,0.7);
		/*padding-bottom: 270px;*/
		position: fixed;
		z-index: 99999;
		transition: all 0.4s;
	}
}
iframe{
	width: 1100px;
	height: 700px;
}
@media (max-width: 1200px){
	iframe{
		width: 800px;
		height: 500px;
		margin-left: 10%;
	}
}
.menu_kor {
	display: none;
	transition: all 0.3s;
}
/*.header:hover .menu_eng {
	display: none;
	transition: all 0.3s;
}
.header:hover .menu_kor {
	display: block !important;
	transition: all 0.3s;
}*/
.btn_nav .line {position: absolute; display: block; width:26px; height:22px; right:4px; top:0; }
.btn_nav .line span {position: absolute; display: block; width:30px; height:2px; left:50%;  background: #000; 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; left:0; top:0;font-family: 'Sacramento', cursive; font-size:2em; line-height:0.8em; font-style:italic; 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; -webkit-text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); -moz-text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); text-shadow:1px 1px 2px rgba(0, 0, 0, 0.2);  }

.btn_nav .line01 { top:0; }
.btn_nav .line02 { top:calc(50% - 1px); }
.btn_nav .line03 { bottom:0; }

.btn_nav.open_nav .line01 {transform: translate(-50%, 10.5px) rotate(45deg); -ms-transform: translate(-50%, 10.5px) rotate(45deg); -webkit-transform: translate(-50%, 10.5px) rotate(45deg);}
.btn_nav.open_nav .line02 {opacity:0; filter: alpha(opacity=0;); }
.btn_nav.open_nav .line03 {transform: translate(-50%, -9.5px) rotate(-45deg); -ms-transform: translate(-50%, -9.5px) rotate(-45deg); -webkit-transform: translate(-50%, -9.5px) rotate(-45deg); }

/* .logo { position:absolute; width:150px; left:50px; top:30px;  transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%);-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; z-index:10; } */
.logo {width: 150px;}
.logo a { position:relative; display:block;-moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.logo a img { width:100%; vertical-align:top; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
.logo .logo_black { position:relative; z-index:1; }
.logo .logo_white { position:absolute; left:0; top:0; opacity:0; z-index:2; }

.icon_btns {
}
.icon_btns li {
	width: 30px;
    height: 30px;
    float: left;
    margin: 0 10px;
}
.icon_btns li img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* .naverpay_Btn {
	position: absolute;
    right: 140px;
    top: 12px;
    font-size: 16px;
	z-index: 100;
	width: 40px;
}
.insta_Btn {
	position: absolute;
    right: 91px;
    top: 12px;
    font-size: 16px;
	z-index: 100;
	width: 40px;
}
.naverpay_Btn img, .insta_Btn img{
    width: 100%;
}
.reser_Btn {
    position: absolute;
    right: 43px;
    top: 10px;
    font-size: 33px;
    z-index: 100;
    transition: 0.3s all;
}
.reser_Btn i {
	top: 1px;
} */

.reser_Btn:hover, .reser_Btn:hover i {
	color: #126692;
}
.gnb_img {
	width: 100%;
    height: 242px;
    margin-top: 14px;
    background-repeat: no-repeat;
    background-position: 0;
    background-size: cover;
    transition: background-image 0.3s;
}
.n_nav {    display: block;
    width: 185px;}
.n_nav img {
	width: 100%;
	display: block;
}
.sc0030 {color: #ff6666 !important;}
.sc0010 {color: #5eb917 !important;}
.sc0100 {color: #676767 !important;}

@media (max-width: 1024px) {
	.week_date p, .rsv_cal_t p {
		font-size: 14px !important;
	}
	.boxShadow {box-shadow: none;}
	.n_nav {
		margin: 0 auto;
	}
	/* .insta_Btn {
		right: 101px;
		width: 30px;
		top: 15px;
	}
	.naverpay_Btn {
		right: 140px;
		width: 30px;
		top: 15px;
	}
	.reser_Btn {
		right: 67px;
		font-size: 25px;
		top: 17.5px;
	} */

	.icon_btns {
		position: absolute;
		right: 3%;
		top: 14px;
	}
	
	.icon_btns li {
		width: 30px;
		height: auto;
		float: left;
		margin: 0 5px;
	}
	.gnb_img {
		display: none;
	}
}

.room_txt p {
	position: relative;
	padding-top:  65px;
	font-size: 13px;
	line-height: 1.4em;
	letter-spacing: 2px;
}
.room_txt p::Before {
	display: block;
	content:""; 
	position:  absolute;
	width: 80%;
	height: 1px;
	background: #000;
	top:30px;
	left: 50%;
	transform: translate(-50%, -50%);
}
.room_more {
	background: url('/html/images/room/more_B.png')no-repeat center center;
	width: 86px;
	height: 54px;
	margin: 30px auto;
	transition: 0.4s all;
}
.roomList01:hover {
	width: 50%;
}
.roomList01 a:hover .R_bg {
	background: rgba(0, 0, 0, 0.3);
}
.roomList01 a:hover .room_txt {
	width: 70%;
	background: rgba(255,255,255,0.5);
}
.btn_nav { position:absolute; display:none; width:40px; right:15px; top:50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); text-align:center; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);  z-index:10; }
.main .btn_nav { display:block;}
.btn_nav .box { position:relative; display:block; width:40px; height:40px; border:2px solid #fff;}
.btn_nav .box .triangle { position:absolute; left:0; top:-1px; width:0;height:0; border-right: 18px solid transparent; border-left: 18px solid transparent; border-top: 36px solid #fff;}
.btn_nav .text { display:block; font-size:11px; line-height:15px; color:#fff; letter-spacing:0.1em; margin-top:3px;}
.gnb:after {display: block; content: ""; clear: both;}
.gnb {
	text-align: center;
}
.gnb > li { 
	display: inline-block;
	vertical-align: top;
	margin:0 3em; 
}
.gnb > li .depth1_mobile { display:none;}
.gnb > li .depth1, .gnb > li .depth1_mobile { font-family: 'Cafe24SsurroundAir'; font-size:1.2em; line-height:1.5em; font-weight:600; text-transform:uppercase;}
.gnb_sub { display:none; padding-top: 15px; text-align: center; }
.gnb_sub:after {display: block; content: ""; clear: both;}
.gnb_sub li { margin: 5px 0;}

.gnb_sub li a { position:relative; display:inline-block; font-size:1.1em; line-height:0.9em; color:#000;}
.gnb_sub li a::after {content:"";position:absolute; width:0; height:1px; background:#000; left:0; bottom:-5px; -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -ms-transition: all 0.15s ease; -o-transition: all 0.15s ease; transition: all 0.15s ease;}
.gnb_sub li.this a::after { width:100%; }
.header.sticky {background:rgba(255, 255, 255, 0.8); -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.15); -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.15); box-shadow:1px 1px 5px rgba(0, 0, 0, 0.15);}

@media (min-width: 1025px) {
	.gnb > li {
		position: relative;
		display: inline-block;
		vertical-align: top;
		margin: 0 !important;
		width: max-content;
		padding: 20px 20px;
	}

	.gnb_sub { display:none; /*padding-top: 15px;*/ text-align: center;
		width: max-content;
		max-width: 500px;
		position: absolute;
		padding: 5px 10px;
		top: 63px;
		/* margin-left: 20px; */
		background: rgba(255,255,255,1);
	}
	.gnb_sub:after {display: block; content: ""; clear: both;}
	
	.gnb_sub li {
		float: left;
		margin: 3px 8px;
		font-size: 0.8em;
	}
	
	.gnb_sub li a:hover::after { width:100%; } 
	.gnb_sub > li:last-child { margin-right:0;}


	.header.sticky { height:64px;}
	.sticky .logo { width:230px;}
	.sticky .gnbArea { top:45%;}
	/*.gnb6 .gnb_sub { right:0}*/
	.gnbArea {
		width: max-content;
		align-self: flex-end;
	}
	.main .btn_nav { visibility: hidden; opacity:0; filter: alpha(opacity=0;);}
}

/*@media  (max-width: 1500px) {
	.logo {left: 180px;}
}*/

@media  (max-width: 1480px) {
	.btn_nav { width:32px; top: 20px;}
	.btn_nav .box { width:32px; height:32px; border:2px solid #fff;}
	.btn_nav .box .triangle { border-right:14px solid transparent; border-left: 14px solid transparent; border-top: 28px solid #fff;}
	.btn_nav .text { font-size:9px; line-height:9px; letter-spacing:0.05em; margin-top:2px;}
	.gnb > li { margin:0 1.5em;}
	.gnb > li .depth1 { font-size:1.1em;}
}

@media  (max-width: 1024px) {
	.header {height:60px;}
	.logo {position: absolute; width:140px; left: -15px;}
	.logo.open_nav .logo_black {opacity:0; }
	.logo.open_nav .logo_white {opacity:1;} 

	.reser_Btn {right: 70px; }
	.btn_nav .box { width:32px; height:32px; border:2px solid #000;}
	.btn_nav .box .triangle { top:-0.2px; border-right:14px solid transparent; border-left: 14px solid transparent; border-top: 28px solid #000;}
	.btn_nav .text { color:#000;}
	.btn_nav.open_nav .box { border:2px solid #fff;}
	.btn_nav.open_nav .box .triangle { border-top: 28px solid #fff;}
	.btn_nav.open_nav .text { color:#fff;}

	.gnbArea { position:fixed; width:100%; height:100%; left:0; top:0; background:rgba(0, 0, 0, 0.8);  z-index:5; visibility: hidden; opacity:0; filter: alpha(opacity=0;);}
	.gnbArea.open_nav {visibility: visible; opacity:1; filter: alpha(opacity=100;); }
	.gnb { padding-top:40%; text-align:center;}
	.gnb > li { float:none; margin:0 0 1px; display: block;}
	.gnb > li .depth1 {display:none}
	.gnb > li .depth1_mobile { display:block;}
	.gnb > li .depth1, .gnb > li .depth1_mobile {font-size:1.8em; line-height:1.8em; padding-top:0.3em; color:#fff;}
	.gnb > li.this .depth1_mobile, .gnb > li.on .depth1_mobile { background:#fff; color:#000;}
	.gnb_sub { position:relative; text-align:center; display:none;  }
	.gnb > li.on .gnb_sub, .gnb > li.this .gnb_sub { margin:10px 0 !important; -webkit-transition: all 0.2s swing; -moz-transition: all 0.1s swing; -ms-transition: all 0.12 swing; -o-transition: all 0.2s swing; transition: all 0.2s swing;}
	.gnb_sub li { float:none; display:inline-block; margin:0 7px;}
	.gnb_sub li.subBlock { display:block; margin:0;}
	.gnb_sub li a { display:inline-block; font-size:1.2em; line-height:1.8em; color:#fff;}
	.gnb_sub li.this a { border-bottom:1px solid #fff;}
}



/* footer */
.epil02_04 { position:relative; /*z-index:3;*/ width: 100%; text-align: center; margin: 2% 0;}
.epil02_04 a > .img07 { position: relative; display: block; max-width: 100%; margin: 0 auto; opacity: 0.3; cursor: pointer;}
.epil02_04 .reserveTitle { position: absolute; top: 31%; left: 50%; transform: translate(-50%, -50%); font-family: 'GyeonggiTitleM'; text-align: center; }
.epil02_04 .reserveTitle > h2 { color: #797878; font-size: 2.1em; letter-spacing: 5px;}
.epil02_04 .reserveTitle > h1 { color: #424242; font-size: 2.5em; letter-spacing: 5px; margin-top: 10%;}
.epil02_04 a > .btn { position: absolute; display: block; z-index: 5; top: 55%; left: 50%; transform: translate(-50%,-50%); cursor: pointer;}

@media  (max-width: 1024px){
	.epil02_01 { /*width:90%; margin-left:10%;*/}
	.epil02_02 { position:relative; width:100%; height:50vw; padding:5% 0; z-index:6;}
	.epil02_02_text { position:relative;}
	.epil02_04 .reserveTitle {
		width: 100%;
	}
	.epil02_04 .reserveTitle > h2 {
		font-size: 1em;
		letter-spacing: 2px;
	}
	.epil02_04 .reserveTitle > h1 {
		font-size: 1.6em;
		letter-spacing: 4px;
		margin-top: 2%;
	}
	.epil02_04 a > .btn {
		position: absolute;
		display: block;
		z-index: 5;
		top: 35%;
		left: 0 !important;
		right: 0 !important;
		margin: 0 auto;
		cursor: pointer;
		transform: scale(0.6) !important;
	}
}
@media  (max-width: 768px){
	.epil02_03 { position:relative; }
	.epil02_0301 { display:block; /*width:90%;*/ width: 100%;}
	.epil02_0302 { display:block; width:100%; /* padding:5% 5% 10%; text-align:left;*/ padding: 5%; text-align: center;}
	.epil02_bg { height:80%;top:10%;}
	iframe{
		width: 600px;
		margin: 0;
		
	}
	
}

.reserWrap { position:relative; overflow:hidden; z-index:5;}
.reserWrap > a { display:block; -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;}
.reserWrap .reser_btn { position:absolute; left:50%; top:50%; text-align:center; transform: translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); z-index:2;}
.reserWrap .reser_btn p {font-family: 'Playfair Display', serif; font-size:1.5em; font-style:italic; color:#fff; letter-spacing:0.05em; line-height:1.5em;}
.reserWrap .reser_btn .btn_arrow { vertical-align:top; }
.reserWrap > a:hover {-ms-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out;}
.reserWrap_img { position:relative; padding-bottom:20%; background:url(../images/common/reser_bg.jpg);}


#footer { position:relative; padding:1% 0 3% 0; width: 88%; margin: 0 auto; text-align: right; background:#fff; z-index:10; }
#footer.section { height:auto !important; text-align: center;}
#footer .btn_top { display:inline-block; }
.footerWrap {/*position: relative;*/ text-align: center;}
.foot_logo {
	margin: 0 auto;
	width: 180px;
}
.foot_logo a img {
	display: block;
	width: 100%;
	margin: 0 auto;
}
.footerWrap dl dt { font-family: 'Montserrat', sans-serif; font-size:1.25em; line-height:1.2em; font-weight:500; color:#000; opacity:0.6;}
.footerWrap dl dd { font-size:1.1em; margin:0.7em 0;}
.footerWrap dl dd:last-child { font-size:0.85em;}
.footer01 {}
.footer02 {}
.footer01 p {font-family: 'Montserrat', sans-serif; font-size:1.2em; line-height:1.8em; font-weight:700; letter-spacing:0.1em; color:#000; }
.footer02 p { font-size:1em; line-height:1.5em;}
.footer03 { margin-bottom:2em; font-size: 0.9em;}
.footer03, .footer03 a { color:#555;}
.footer03 .line { display:inline-block; margin:0 0.5em;}

@media  (max-width: 1024px){
	#footer {width: 100%; text-align: center;}
	.foot_logo {
		position: unset;
		width: 100px;
		margin: 0 auto 30px;
	}
	.footerWrap dl dt { font-size:1.1em;}
	.footerWrap dl dd {  margin:0.1em 0 1em;}
	.footer01 p { font-size:1.3em; line-height:1.6em;}
	.footer02 p { font-size:1em; line-height:1.6em; letter-spacing:-0.05em;}
	.reserWrap .reser_btn p { font-size:1em;}
	.reserWrap_img { padding-bottom:24%;}

}

@media  (max-width: 768px) {
	#footer { padding: 5% 0 65% 0;}
	#footer .btn_top img { }
	.footerWrap dl dt { font-size:1em;}

	.footer_info p { display:block;}
	.footer02 p { letter-spacing:-0.02em;}
	.footer_info p span {width:0.5em;}
}

@media  (max-width: 420px) {
	#footer .btn_top { margin-bottom:20px;}
}

.topArea { position:relative; width:100%; left:0; top:0; padding-top:0; background:#fff; overflow:hidden; z-index:10;}
.topArea:after {content:"";display:block;clear:both;}

.topArea .lightslider { display:block; width:100%; height:100%; opacity: 0; background: #fafafa; -webkit-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); -webkit-transition: opacity 1.5s cubic-bezier(0.694, 0, 0.335, 1), background 2.5s ease-out, -webkit-transform 2.5s ease-out; transition: opacity 1.5s cubic-bezier(0.694, 0, 0.335, 1), background 2.5s ease-out, -webkit-transform 2.5s ease-out; -o-transition: opacity 1.5s cubic-bezier(0.694, 0, 0.335, 1), transform 2.5s ease-out, background 2.5s ease-out; transition: opacity 1.5s cubic-bezier(0.694, 0, 0.335, 1), transform 2.5s ease-out, background 2.5s ease-out; transition: opacity 1.5s cubic-bezier(0.694, 0, 0.335, 1), transform 2.5s ease-out, background 2.5s ease-out, -webkit-transform 2.5s ease-out; }

.active.topArea .lightslider { opacity: 1; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); }


.listImg li, .listImg02 li { overflow: hidden; opacity:0; filter: alpha(opacity=0;);}
.listImg li img, .listImg02 li img { width:100%; vertical-align:top; }
.listImg li img {-webkit-transition: all 0.2s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.listImg li:hover img { -ms-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05); -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;}


.topArea_img .lSPager { display:none;}
.topArea_shade { position:absolute; width:73%; max-width:1407px; right:0; top:0; z-index:2;}

.lSSlideOuter { position:relative; z-index:1;}
.lightslider { z-index:1;}
.lightslider li { background-position:center center !important; background-repeat:no-repeat !important; background-size:cover !important; }
.lightslider li > img { width:100%; vertical-align:top;}

.topArea .count { position:absolute; width:60px; left:50%; bottom:10px; margin-left:-30px; font-family: 'Playfair Display', serif; font-size:1.35em; line-height:30px; color:#fff; text-align:center; z-index:4; }
.topArea .btn_reser { position:absolute; display:inline-block; right:50px; bottom:20px; font-family: 'Playfair Display', serif; font-size:1.35em; line-height:1.3em; letter-spacing:0.05em; color:#fff; border-bottom:1px solid rgba(255, 255, 255, 0.6); -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:6;}
.topArea .btn_reser:hover { margin-right:-10px;}

/* .topArea .lSAction { position:absolute; width:32px; height:80px; right:12px; top:50%;  transform: translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); opacity:0; filter: alpha(opacity=0;); z-index:5;} */
.topArea .lSAction {
    position: absolute;
    width: 100%;
    top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform:translate(-50%, -50%); 
	-webkit-transform:translate(-50%, -50%); 
    opacity: 0;
    filter: alpha(opacity=0;);
    z-index: 5;
}
.active.topArea .lSAction { opacity:1; filter: alpha(opacity=100;); transition: all 0.7s ease-in-out 1.0s;}
/*.topArea .lSAction:after { content:""; position:absolute; width:110%; height:1px; left:50%; top:50%; background:#fff; transform: translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); }*/
.topArea .lSAction > a { position:absolute; width:32px; height:12px; margin:0; text-align:center; color:#fff; opacity:0.8; filter: alpha(opacity=80;);-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;}
.topArea .lSAction > a img { width:100%; vertical-align:top;}
.topArea .lSAction > a:hover, .topArea .lSAction > a:focus {opacity:1; filter: alpha(opacity=100;);}
.topArea .lSAction > .lSPrev { left:20px; top:0;}
.topArea .lSAction > .lSNext { right:20px; bottom:0; top: 0;}
.topArea .lSAction > a i {display:block; width:34px; height:34px;}
/*.fas.fa-up {  background:url(../images/common/arrow_up.svg);}
.fas.fa-down {background:url(../images/common/arrow_down.svg);}*/
.topArea .lSAction > .lSPrev:hover, .topArea .lSAction > .lSPrev:focus { left:15px !important;}
.topArea .lSAction > .lSNext:hover, .topArea .lSAction > .lSNext:focus { right:15px !important;}

.topArea .btn_scroll { z-index: 999; position:absolute; display:inline-block; left:50%; bottom:-50px; opacity:0; filter: alpha(opacity=0;); animation: btn_scroll 1.5s infinite both;  transform: translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%);}
@keyframes btn_scroll {
	0% {
		transform: translate(-50%, -50%);
		opacity: 1;
	}
	100% {
		transform: translate(-50%, -30%);
		opacity: 0;
	}
}
.btn_dir { display:block; text-align:center;}
.btn_dir .text {display:block; font-family: 'Roboto', sans-serif; font-size:1em; line-height:1.5em; letter-spacing:0.3em; padding-left:0.3em; font-weight:500;}
@keyframes dir-arrow-up {
	0%{opacity:1; top:-3px;}
	100%{opacity:0; top:0;}
	}
@keyframes dir-arrow-down {
	0%{opacity:1; top:0;}
	100%{opacity:0; top:-3px;}
	}
.btn_dir .arrow { position:relative; opacity:0; display:inline-block; width:16px; height:16px; transform:rotate(45deg);-webkit-transform:rotate(45deg); /*animation-delay: .15s;*/ }
.btn_dir .arrow_up {border-left:2px solid #000; border-top:2px solid #000; margin-top:12px; animation: dir-arrow-down 1s infinite;}
.btn_dir .arrow_down { border-right:2px solid #fff; border-bottom:2px solid #fff; animation: dir-arrow-up 1s infinite;}
.topArea .btn_scroll.btn_dir .text { color:#fff;}
.topArea .btn_scroll img {}

.section_fadeIn { opacity:0; }
.active.section_fadeIn { opacity:1; -webkit-transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1);}

.delay {}
.active.delay.section_fadeIn { -webkit-transition: all 1.1s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.1s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 1.1s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.1s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.1s cubic-bezier(0.645, 0.045, 0.355, 1), transform 1.1s cubic-bezier(0.645, 0.045, 0.355, 1); transition-delay:0.5s; -ms-transition-delay : 0.5s; -moz-transition-delay : 0.5s; -o-transition-delay : 0.5s; -webkit-transition-delay : 0.5s;}
.delay02 {}
.active.delay02.section_fadeIn {-webkit-transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1);transition-delay:1s; -ms-transition-delay : 1s; -moz-transition-delay : 1s; -o-transition-delay : 1s; -webkit-transition-delay : 1s;}
.delay03 {}
.active.delay03.section_fadeIn {-webkit-transition: all 2s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 2s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 2s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 2s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 2s cubic-bezier(0.645, 0.045, 0.355, 1); transition-delay:1s; -ms-transition-delay : 1s; -moz-transition-delay : 1s; -o-transition-delay : 1s; -webkit-transition-delay : 1s;}


.mainbar {width: 100%; background: url('/html/images/main/main_bar.jpg') repeat center left; background-size: cover; text-align: center;}
.mainbar h1 { color: #fff; font-size: 22px; line-height: 68px; letter-spacing: 3px;}

.bx-wrapper { position:relative; z-index:1;}

.main01_00 {}
.mainbox { width: 100%; height: 100%; padding: 30px; background: #d6967b;}
.typoWrap {position:relative; overflow:hidden; width: 100%; margin: 0 auto; z-index: 3;}
.typoCon { position:absolute; z-index: 2; left: 2%; bottom: 2%; font-size: 50px; line-height: 60px; color: #fff; font-weight: bold; opacity: 0.8; letter-spacing: 10px;}

.obj { position: absolute; }
.main01_01 {
	position: relative;
	width: 100%;
	text-align: center;
}
.main01_01 .obj01 {
	top: 0;
	left: 0;
}
.main01_01 .obj02 {
	top: 0;
	right: -70px;
}
.main01_01 .obj03 {
	top: 13.5%;
	left: 8px;
}
.main01_01 .obj04 {
	top: 10.1%;
	right: 0;
}
.main01_01 .content01 {
	width: 100%;
	background: url('/html/images/main/bg01.jpg');
}
.main01_01 .content01 .img {
	width: 80%;
	margin: 0 auto;
}
.main01_01 .txt {
	padding: 80px 0;
	width: 100%;
}
.main01_01 .txt span {
	display: block;
	font-size: 16px;
	color: #cd8161;
	letter-spacing: 5px;
}
.main01_01 .txt h1 {
	line-height: 80px;
	font-size: 60px;
	color: #cd8161;
	letter-spacing: 3px;
	padding: 15px 0 30px;
}
.main01_01 .txt p {
	line-height: 25px;
	font-size: 16px;
	color: #636363;
}
.main01_01 .content02 {
	width: 100%;
	background: url('/html/images/main/bg02.jpg');
	padding-bottom: 5%;
}
.main01_01 .content02 .special {
	width: 100%;
}
.main01_01 .content02 .special:after {
	display: block;
	content: '';
	clear: both;
}
.main01_01 .content02 .special .img_00 {
}
.main01_01 .content02 .special > .left {
	float: left;
	width: 35%;
	text-align: right;
}
.main01_01 .content02 .special > .middle {
	float: left;
	width: 30%;
	text-align: center;
}
.main01_01 .content02 .special > .right {
	float: left;
	width: 35%;
	text-align: left;
}
.m_special .swiper-wrapper .swiper-slide img {
	width: 60%;
	margin: 0 auto;
}
.main01_02 {
	width: 100%;
}

.main01_03 {
	display: table;
	width: 100%;
	position: relative;
}
.main01_03:after {
	display: block;
	content: '';
	clear: both;
}
.main01_03 .left{
	width: 50%;
	display: table-cell;
}
.main01_03 .right{
	position: relative;
	display: table-cell;
	width: 50%;
}
.main01_03 .right > .logo_image img{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}
.main01_04 {
	background: url('/html/images/main/img05.jpg') no-repeat center center;
	background-size: cover;
	text-align: center;
	padding: 12.5% 0
}
.main01_04 p {
	color: #424242;
	font-size: 20px;
	font-weight: bold;
	line-height: 30px;
}
.main01_05 {
	position: relative;
	width: 100%;
	text-align: center;
}
.main01_05 .txt {
	padding: 80px 0;
	width: 100%;
}
.main01_05 .txt span {
	display: block;
	font-size: 16px;
	color: #cd8161;
	letter-spacing: 5px;
}
.main01_05 .txt h1 {
	line-height: 80px;
	font-size: 60px;
	color: #cd8161;
	letter-spacing: 3px;
	padding: 15px;
}
.main01_05 .txt p {
	line-height: 23px;
	font-size: 16px;
	color: #636363;
}
.main01_05 .obj05 {
	top: 150px;
	left: -50px;
}
.main01_05 .obj06 {
	top: 0;
	right: 0;
}
@media (max-width: 1024px) {
	.obj {
		display: none;
	}
}
@media (max-width: 800px) {
	.block800 { display: block !important;}
	.mainLogo {
		width: 50% !important
	}
	.topArea .lSAction > a {
		display: none;
	}
	.mainbar h1 {
		color: #fff;
		font-size: 15px;
		line-height: 50px;
		letter-spacing: 3px;
	}
	.mainbox {
		padding: 10px;
		display: none;
	}
	.typoCon {
		font-size: 18px;
		font-weight: bold;
		line-height: 23px;
		letter-spacing: 3px;
	}
	.main01_01 .content01 .img {
		width: 90%;
	}
	.main01_01 .txt {
		padding: 25px 0;
		width: 80%;
		margin: 0 auto;
	}
	.main01_01 .txt span {
		display: block;
		font-size: 12px;
		color: #cd8161;
		letter-spacing: 5px;
	}
	.main01_01 .txt h1 {
		line-height: 33px;
		font-size: 30px;
		color: #cd8161;
		letter-spacing: 0px;
		padding: 10px 0 15px;
	}
	.main01_01 .txt p {
		line-height: 20px;
		font-size: 12px;
		color: #636363;
	}
	.main01_01 .content02 {
		padding-bottom: 8%;
	}
	.main01_01 .content02 .special > .left {
		float: left;
		width: 50%;
		text-align: right;
		padding: 0 5px 0 10px;
		box-sizing: border-box;
	}
	.main01_01 .content02 .special > .middle {
		float: left;
		width: 50%;
		text-align: center;
		padding: 0 10px 0 5px;
		box-sizing: border-box;
	}
	.main01_01 .content02 .special > .right {
		float: left;
		display: none;
		width: 35%;
		text-align: left;
	}
	.main01_03 .right > .logo_image img {
		width: 80%;
	}
	.main01_04 p {
		color: #424242;
		font-size: 10px;
		font-weight: bold;
		line-height: 18px;
	}
	.main01_05 .txt {
		padding: 25px 0;
		width: 80%;
		margin: 0 auto;
	}
	.main01_05 .txt span {
		display: block;
		font-size: 12px;
		color: #cd8161;
		letter-spacing: 5px;
	}
	.main01_05 .txt h1 {
		line-height: 30px;
		font-size: 25px;
		color: #cd8161;
		letter-spacing: 0px;
		padding: 10px;
	}
	.main01_05 .txt p {
		line-height: 20px;
		font-size: 12px;
		color: #636363;
	}


}
.typoCon01 dd p {   font-family: 'paybooc-Medium'; font-size:1.2em; line-height:1.8em; letter-spacing:-0.03em; font-weight: 500;}
.typoCon02 { width:100%; color:#fff; z-index:5;}
.typoCon02_01 {   font-family: 'paybooc-Medium'; font-size:1.2em; line-height:1.8em; letter-spacing:-0.03em; margin-bottom:2.5%; }
.typoCon02_02 {font-family: 'Lora', serif; font-size:3em; line-height:1.2em;}
.typoCon03 {   font-family: 'paybooc-Medium'; font-size:1.2em; color:#fff; line-height:1.8em; letter-spacing:0.03em; -webkit-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6); -moz-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6); text-shadow:2px 2px 3px rgba(0, 0, 0, 0.6);  }
@media  (max-width: 1820px){
		.typoCon02_02 {font-size:2.6vw;} 
}
@media  (max-width: 1420px){ 
	.typoCon01 dd p, .typoCon02_01 {font-size:1.1em; line-height:1.6em;}
}

@media  (max-width: 1280px){ 
	.typoCon01 dd p, .typoCon02_01 {font-size:1em; }
}


@media  (max-width: 1024px){
.typoCon01 dt img {
	width: 100%;
	display: block;
}
.typoCon01 dt {
	width: 80%;
	margin: 20px auto;
}
.main01_01 .typo02_01 {
	width: 80%;
    margin: 0 auto;
}
.main01_01 {
	width: 100%;
}
.main01_01 img {
	display: block;
	width: 100%;
}
.topArea { position:relative; top:0;}
/*.mainLogo, */.topArea .btn_reser, .topArea .btn_scroll { display:none;}
.topArea .lSAction {top: 90%;}
.topArea .lSAction::before {
	height: 30px;
	margin-top: -9%;
}
.typoCon02 { top:45%;}
.typoCon03 { font-size:0.95em;}

.btn_arrow { width:110px;}

.active.section_fadeIn { opacity:1; -webkit-transition: all 1.0s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.0s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 1.0s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.0s cubic-bezier(0.645, 0.045, 0.355, 1);}

.active.delay.section_fadeIn { -webkit-transition: all 0.8s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.8s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.8s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.8s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.8s cubic-bezier(0.645, 0.045, 0.355, 1), transform 0.8s cubic-bezier(0.645, 0.045, 0.355, 1); transition-delay:0.5s; -ms-transition-delay : 0.5s; -moz-transition-delay : 0.5s; -o-transition-delay : 0.5s; -webkit-transition-delay : 0.5s;}
.active.delay02.section_fadeIn {-webkit-transition: all 1.0s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.0s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 1.0s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.0s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.0s cubic-bezier(0.645, 0.045, 0.355, 1);transition-delay:0.5s; -ms-transition-delay : 0.5s; -moz-transition-delay : 0.5s; -o-transition-delay : 0.5s; -webkit-transition-delay : 0.5s;}
.active.delay03.section_fadeIn {-webkit-transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1); transition-delay:0.5s; -ms-transition-delay : 0.5s; -moz-transition-delay : 0.5s; -o-transition-delay : 0.5s; -webkit-transition-delay : 0.5s;}

}

@media  (max-width: 768px){
.topArea { top:0;}

.typoCon01 { top:42%;}
.typoCon01 dd p {font-size:0.85em; }
.typoCon02_01 {font-size:0.8em; margin-bottom:2%;}
.typoCon02_02 {font-size:3vw;}

.typoCon { top:55%;}
.active.typoCon { top:45%;}

.active.section_fadeIn { transition: all 0.6s ease-in-out 0.4s;}

}

@media  (max-width: 420px){
.typoCon01 dd p, .typoCon02_01 {font-size:0.75em; letter-spacing:-0.05em;}
}

@media \0screen { /* IE8 웹폰트 설정*/
}


.listImg li, .listImg02 li { overflow: hidden; opacity:0; filter: alpha(opacity=0;);}
.listImg li img, .listImg02 li img { width:100%; vertical-align:top; }
.listImg li img {-webkit-transition: all 0.2s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.listImg li:hover img { -ms-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05); -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;}
.img_bg { width:100%; height:0; background-size:cover !important; background-position:center center !important; background-repeat:no-repeat !important;}


@media  (max-width: 1024px){
.btn_reser02 { font-size:1em; padding:0.6em 3em 0.5em;}

}

#popup_reser { display:none; position:fixed !important; background:#fff; width:calc(100vw * 0.9) !important;  height:calc(100vw * 0.45) !important; left:5%; top:5% !important; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); box-shadow:0 0 20px rgba(0, 0, 0, 0.5);  z-index:60;}
#popup_reser .reser_content { position:relative; width:100%; height:calc(100vw * 0.45); left:0; top:0; padding:3%; overflow-y:auto; z-index:1;}
#popup_reser .b-iframe {position:relative; display:block; width:94%; height:7000px; margin:0 auto;  }
.b-close { position:absolute; right:10px; top:10px; display:inline-block; color:#fff; font-family: 'Raleway', sans-serif; font-size:1.5em; line-height:1em; letter-spacing:0.1em; padding:10px 15px; text-shadow:2px 2px 2px rgba(0, 0, 0, 0.3); transition: all 0.2s ease-in-out; z-index:1000; /*border-bottom:1px solid  rgba(255, 255, 255, 0.2);  border-left:1px solid rgba(255, 255, 255, 0.2);*/  background:rgba(0,0,0,0.1); }
.b-close:hover, .b-close:focus {  background:rgba(0,0,0,0.2);}
.b-close i { display:inline-block; font-size:24px; transition: all 0.2s ease-in-out;}
.b-close:hover i, .b-close:focus i {transform:rotate(180deg);-webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -o-transform:rotate(180deg);}

::-webkit-scrollbar { width:5px; height:3px;}
::-webkit-scrollbar-thumb {background: #a9a9a9;}
::-webkit-scrollbar-track-piece { background:#f1f1f1;}


.active .mainLogo {
    transform: translate(-50%,-50%) scale(1);
    -ms-transform: translate(-50%,-50%) scale(1);
    -webkit-transform: translate(-50%,-50%) scale(1);
    -webkit-transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 2s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), transform 2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), transform 2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), transform 2s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 2s cubic-bezier(0.645, 0.045, 0.355, 1);
    opacity: 1;
}
.mainLogo {
    position: absolute;
    width: 479px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) scale(0.85);
    -ms-transform: translate(-50%,-50%) scale(0.85);
    -webkit-transform: translate(-50%,-50%) scale(0.85);
    opacity: 0;
    z-index: 5;
}
.mainLogo img {
    width: 100%;
    vertical-align: top;
}




/* header btn */
.sub_btn {
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 100;
}
.sub_btn ul {}
.sub_btn ul li.reser {
	background-color: #333;
}
.sub_btn ul li.phone {
	background-color: #ff3737;
}
.sub_btn ul li.phone_mo {
	display: none;
	background-color: #ff3737;

}
.sub_btn ul li a {
	display: flex;
    justify-content: center;
    align-items: center;
	height: 58px;
    color: #fff;
    border: 1px solid #fff;
    box-sizing: border-box;
}
.sub_btn ul li a i {
	display: block;
	height: 100%;
    padding: 5px;
    box-sizing: border-box;
    border-right: 1px solid #fff;
}
.sub_btn ul li a i img {
	width: 45px;
}
.sub_btn ul li a > span {
	display: block;
	flex: 1;
    padding: 0 40px;
}
.sub_btn ul li a > span > span {
	display: block;
}
.sub_btn ul li a > span > span.txt01 {
	font-size: 1em;
}
.sub_btn ul li a > span > span.txt02 {
	margin: 3px 0 1px 0;
	font-size: 1.5em;
	font-weight: 700;
	color: #f6ff00;
}
.sub_btn ul li a > span > span.txt03 {
	font-size: 0.9em;
}



@media (max-width: 768px) {
	.sub_btn {
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		z-index: 100;
	}
	.sub_btn ul {
		display: flex;
		width: 100%;
	}
	.sub_btn ul li {
		width: 100%;
	}
	.sub_btn ul li.reser {
		display: none;
	}
	.sub_btn ul li.phone {
		display: none;
	}
	.sub_btn ul li.phone_mo {
		display: block;
	}
	.sub_btn ul li a {
		height: 90px;
	}
	.sub_btn ul li a i {
		height: 35px;
		padding: 0;
		border-right: none;
	}
	.sub_btn ul li a i img {
		width: 35px;
	}
	.sub_btn ul li a {
		gap: 20px;
	}
	.sub_btn ul li a > span {
		flex: none;
		padding: 0;
	}
}

