/* common.css */
@charset "UTF-8";
::selection {background:#f2f2f2} 
.hidden_wrap a,.hidden_wrap button{display: block; width: 100%; height: 100%;}

.hidden, 
.hidden_wrap a>span,
.hidden_wrap button>span{display: block; width: 0; height: 0; overflow: hidden;position:relative; z-index: -100;}

.clearfix:after,
.clearfix::after{content:" "; display: block;width:0; height:0; clear: both;}

.img100 {display: block; width: 100%;}
       
#wrap{margin:0 auto;}

.mbt10{margin-bottom:10px;}
.mbt20{margin-bottom:20px;}
.mbt30{margin-bottom:30px;}
.mbt40{margin-bottom:40px;}
.mbt50{margin-bottom:50px;}
.mbt60{margin-bottom:60px;}

.mt10{margin-top:10px;}
.mt20{margin-top:20px;}
.mt30{margin-top:30px;}
.mt40{margin-top:40px;}
.mt50{margin-top:50px;}
.mt60{margin-top:60px;}

.section {overflow: hidden;}
/* 바로가기버튼 */
.header_icon {
	margin-right: 10px;
	transform: translate(5vw, -10px);
}
@media(max-width:1600px){
	.header_icon {
		transform: translateX(0);
	}
}
.go_group {
	position: fixed;
    right: 10px;
    bottom: 135px;
    z-index: 100;
    text-align: center;
}
.go_img {
	display: inline-block;

}
.reser_icon a::before{
	content:'예약';
	display: block;
	width: 100%;
	height: 100%;
	color: #fff;
	line-height: 45px;
	padding: 0 4.5px;
	border-radius: 50%;
	text-align: center;
	background-color: #309df0;
}

.mreser{
	width: 45px;
	height: 43px;
	display: inline-block;
}
.mreser a::before{
	content:'예약';
	display: block;
	font-size: 12px;
	width: 100%;
	height: 100%;
	padding: 0 5px;
	color: #fff;
	line-height: 30px;
	border-radius: 50%;
	text-align: center;
	background-color: #309df0;
}
.mreser a{
	display: inline-block;
    width: 22px;
    height: 30px;
	color: #fff;
}

.header_icon_m {
	position: fixed;
	top: 0;
	right: 38px;
	height: 55px;
	padding-top: 10px;
	display: flex;
	gap: 3%;
}
.header_icon_m .go_img img {
	width: 30px;
}
.header_icon_m .go_img.caravan img {
	width: auto;
	height: 30px;
}
.insta_m{
	/* position: fixed;
	right: 22%;
	top: 6px;
	z-index: 99;
	width: 33px !important; */
}
.naver_m{
	/* position: fixed;
	right: 33%;
	top: 6px;
	z-index: 99;
	width: 50px !important; */
}
.naver{
	/* position: absolute;
	right: 9%;
	top: 21px; */
}
.insta{
	/* margin-left: 20px;
	position: absolute;
	right: 5%; */
}
.go_img.caravan {
	/* position: absolute;
	top: 21px;
	right: 14%; */
}


.go_pension {
    width: 90px !important;
}
.go_img a img {
	/* width: 100%; */
}
.B_btn {
	z-index: 99;
	cursor: pointer;
	position: fixed;
	bottom: 70px;
	right: 26px;
}
.learn-more {
	width: 50px;
	height:  50px;
	background: url('/images/common/off_btn.png')no-repeat center center;
}
.learn-more.active {
	background: url('/images/common/on_btn.png')no-repeat center center;
}
@media (max-width:560px) {
	.go_group {
        left: 10px;
        bottom: 58px;
        right: unset;
	}
	/* .go_img{
		width: 30px;
        margin: 2px auto !important;
	} */
    .go_pension{
		width: 60px !important;
	}
	.B_btn {
        bottom: 15px;
        right: unset;
        left: 9px;
        right: unset;
	}
	.learn-more {
		width: 40px;
		height: 40px;
		background-size: cover !important;
	}
}


.slick-arrow {
    position: absolute;
    cursor: pointer;
    border-width: 0px;
    top: 50%;
    margin-top: -25px;
    width: 50px;
    height: 50px;
    z-index: 20;
}
.slick-prev {
    background: url('/images/common/arrow_left.png');
    background-size: cover;
    left: 20px;
}
.slick-next {
    right: 40px;
    background: url('/images/common/arrow_right.png');
    background-size: cover;
}


/* roomList css */
.roomWrapper {
	position: relative;
}
.roomWrapper:after{content:'';display:table;clear:both;}
.roomlist_content{float:left;width:58%}
.room01_01 {
	position: relative;
    width: 100%;
}
.room01_01 p {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	width: 100%;
	font-size: 52px;
    text-align: center;
}
.roomlist_title {
	position: relative;
    float: right;
    width: 42%;
    /* padding-top: 24%; */
    filter: alpha(opacity=0;);
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.roomlist_title:after {
	display: block; clear: both; content: "";
} 
.roomlist_title.active{
	opacity:1;
	filter:alpha(opacity=100;)
}
.roomlist_title_inner{
	width: 100%;
	color: #6d7a70;
}
.room01_02 {
	float: right;
	width: 25%;
}
.txtRoom {display: none;}
.rt_inner .tag_inner{
	display: block;
	background: #868078;
	color:#fff;
	border-radius: 25px;
	font-size:14px;
	font-weight: 500;
	padding: 7px 15px;
}

.tag{position:relative;display:inline-block}
.tag.right{padding-right:58px}
.time_tag.right::before{top:47%;right:-48px;width:80px;height:1px}
.tag.left::before{top:50%;left:0;width:80px;height:1px}
.tag.top .tag_inner{display:inline-block;width:180px;padding:18px 0 12px;text-align:center}
.tag.top::before{left:50%;bottom:80%;width:1px;height:44px}
.time_tag::before{content:'';position:absolute;display:inline-block;background:#fff}

.rt_outer{
	display:table;
	width:590px;
	height:100%;
	float: left;
}

.rt_inner{
	display:table-cell;
	vertical-align:middle;
	position: relative;
    padding: 70px 0 70px 80px;
}
.rt_head{
	font-weight: 500;
	font-size:30px;
	-webkit-transform:none;
	-ms-transform:none;
	transform:none;
	opacity:1;
	filter:alpha(opacity=100;);
	-webkit-transition:all .3s ease-in-out;
	-moz-transition:all .3s ease-in-out;
	-ms-transition:all .3s ease-in-out;
	-o-transition:all .3s ease-in-out;
	transition:all .3s ease-in-out;
}
.rt_head.move{
	-webkit-transform:translateY(-0%);
	-ms-transform:translateY(-0%);
	transform:translateY(-0%);
	opacity:0;
	filter:alpha(opacity=0;);
}
.rt_body{
	font-size: 20px;
    line-height: 1.5em;
    margin: 6% 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    opacity: 1;
    filter: alpha(opacity=100;);
    -webkit-transition: all .3s .15s ease-in-out;
    -moz-transition: all .3s .15s ease-in-out;
    -ms-transition: all .3s .15s ease-in-out;
    -o-transition: all .3s .15s ease-in-out;
    transition: all .3s .15s ease-in-out;
}

.rt_body.move{
	font-size: 20px;
    line-height: 1.5em;
    margin: 6% 0;
	-webkit-transform:translateY(0%);
	-ms-transform:translateY(-0%);
	transform:translateY(0%);
	opacity:0;
	filter:alpha(opacity=0;);
}
.rt_desc{
	font-size:1.07em;
	line-height:1.8;
	-webkit-transform:none;
	-ms-transform:none;
	transform:none;
	opacity:1;
	filter:alpha(opacity=100;);
	-webkit-transition:all .3s .15s ease-in-out;
	-moz-transition:all .3s .15s ease-in-out;
	-ms-transition:all .3s .15s ease-in-out;
	-o-transition:all .3s .15s ease-in-out;
	transition:all .3s .15s ease-in-out;
}
.rt_desc.move{
	font-size:1.07em;
	line-height:1.8;
	-webkit-transform:translateY(0%);
	-ms-transform:translateY(0%);
	transform:translateY(0%);
	opacity:0;
	filter:alpha(opacity=0;);
}
.rt_inner .tag {
	margin-bottom: 10%;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	opacity: 1;
	filter: alpha(opacity=100;);
	-webkit-transition: all .3s .15s ease-in-out;
	-moz-transition: all .3s .15s ease-in-out;
	-ms-transition: all .3s .15s ease-in-out;
	-o-transition: all .3s .15s ease-in-out;
	transition: all .3s .15s ease-in-out;
}
.rt_inner .tag.move{
	-webkit-transform:translateY(0%);
	-ms-transform:translateY(0%);
	transform:translateY(0%);
	opacity:0;filter:alpha(opacity=0;);
}

.lightslider li a img {
    border-radius: 0 0 10% 0;
    display: block;
    width: 100%;
}

.rt_foot{font-size:12px;color:#d1d1d1;line-height:1.4;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1;filter:alpha(opacity=100;);-webkit-transition:all .3s .15s ease-in-out;-moz-transition:all .3s .15s ease-in-out;-ms-transition:all .3s .15s ease-in-out;-o-transition:all .3s .15s ease-in-out;transition:all .3s .15s ease-in-out}
.rt_foot.move{-webkit-transform:translateY(0%);-ms-transform:translateY(0%);transform:translateY(0%);opacity:0;filter:alpha(opacity=0;)}

@media (max-width:1024px) {
	.dummyheight {height: 55px;}
}

@media (max-width:560px) {
	.roomlist_title_inner {
		position: relative;
	}
	.roomlist_content {
		float: unset;
		width: 100%;
	}
	.roomlist_title {
		float: unset;
		width: 100%;
	}
	.room01_01 img {height: 170px;}
	.room01_01 p {
		top: 67%;
		font-size: 28px;
	}
	.lightslider li a img {
		border-radius: unset;
		height: 280px;
	}
	.rt_inner {
		padding: 15px 0 0 30px;
	}
	.rt_outer {
		width: 100%;
		float: unset;
	}
	.rt_head {font-size: 19px;}
	.rt_body {
		font-size: 14px;
		margin: 3% 0;
	}
	.rt_body.move{
		font-size: 14px;
		margin: 3% 0;
	}
	.rt_inner .tag_inner {
		font-size: 12px;
		padding: 5px 11px;
	}
	.room01_02 {
		float: unset;
		position: absolute;
		top: 0;
		right: 0;
	}
	.lSAction > a {
		top: 88% !important;
	}
}
/* roomlist css end */




/* SPlist css */
.SPbox {
	position: relative;
	background: url('/images/special/bg01.jpg')repeat top -11px center;
	background-size: cover;
	height: 90vh;
}
.SPbox .img100 {
	max-height: 540px;
}
.SPtitle {
	text-align: center;
	color: #948f89;
	padding-top: 88px;
}
.SPtitle p {
	font-size: 16px;
}
.SPtitle h3 {
	margin: 19px 0 40px;
	font-weight: 500;
	font-size: 45px;
}
.swiper {
	overflow: unset !important;
}
.SP_swiper {
	width: 1010px;
	margin: 0 auto;
} 
.SPitem {
	position: relative;
}
.SPitem a {
	transition: 0.4s all;
}
.SPitem a:hover .SPbg {
	opacity: 0;
}
.SPhover {
	transition: 0.4s all;
	z-index: 9;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(45deg);
	background: rgba(255,255,255,0.9);
	width: 150px;
	height: 150px;
}
.SPtxt {
    color: #948f89;
    text-align: center;
    position: relative;
    transform: translate(-50%, -50%) rotate(-45deg);
    top: 50%;
    left: 50%;
}
.SPtxt h2 {
    text-transform: uppercase;
    font-weight: 300;
    font-size: 20px;
    margin: 39px 0 10px;
    display: inline-block;
}
.SPtxt p {
	font-size: 14px;
}
.SPbg {
	transition: 0.4s all;
	z-index: 9;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	background: rgba(134,128,120,0.6);
}
.SPbg02 {
	z-index: 9;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(45deg);
	width: 150px;
	height: 150px;
	background: rgba(255,255,255,0.9);
}
.SP_swiper > .swiper-button-next, .swiper-button-prev {
	top: unset !important;
	width: 50px !important;
	height: 50px !important;
    bottom: -4%;
	background-size: cover !important;
}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after,
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
	content: "" !important;
}
.SP_swiper > .swiper-button-prev {
	background: url('/images/common/prev_btn.png')no-repeat top center;
}
.SP_swiper > .swiper-button-next {
	background: url('/images/common/next_btn.png')no-repeat top center;
}
.SP_swiper > .swiper-pagination {
	position: unset !important;
    width: 300px !important;
    margin: 50px auto 0;
}  
.SP_swiper > .swiper-pagination-progressbar {
	background: #868078 !important;
}
.SP_swiper > .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
	background: #6d7a70 !important;
	height: 7px !important;
	top: -1.5px !important;
}
@media (max-width:560px){
	.SPbox {
		background: url('/images/main/m/bg02.jpg')no-repeat top center;
		height: 100vh;
	}
	.SPtitle {
		padding-top: 60px;
	}
	.SPtitle h3 {
		margin: 9px 0;
		font-weight: 500;
		font-size: 22px;
	}
	.SPhover {
		opacity: 1;
		width: 100px;
		height: 100px;
	}
	.SPtxt h2 {
		font-size: 14px;
		margin: 25px 0 2px;
	}
	.SPtxt p {font-size: 12px;}
	.swiper {overflow: hidden !important;}
	.SP_swiper {
		width: 95%;
		height: 60vh !important;
	}
	.SPitem {height: 50vh !important;}
	.SPitem a img {
		height: 100%;
	}
	.SP_swiper > .swiper-button-next, .swiper-button-prev {
		bottom: 0;
	}
	.SP_swiper > .swiper-pagination {
		width: 50% !important;
		margin: -26px auto 0;
	}


} 

@media (max-width: 320px){
	.head_logo{
		width: 125px;
		height: 45px;
		left: 5px !important;
	}
	.naver_m{
		right: 38%;
	}
	.insta_m{
		right: 26%;
	}
	.mreser{
		right: 45px;
	}
}

@media (max-width: 300px){
	.insta_m{
		right: 28%;
		width: 30px !important;
	}
    .naver_m{
        right: 41%;
        top: 8px;
		width: 40px !important;
    } 
	.head_logo{
		width: 105px;
		height: 37px;
		left: 5px !important;
	}
	.head_logo img{
		width: 100%;
		height: 100%;
	}
}