

#dot_wrap {
	position: fixed;
	top: 35%;
	left: 40px;
	z-index: 200;
	text-align: right;
}
#dot_wrap .dot li {
	margin-bottom: 18px;
	text-align: center;
	cursor: pointer;
	opacity: 0.7;
}
#dot_wrap .dot li.active {
	opacity: 1;
}
#dot_wrap .dot li img {
	width: 60%;
	transition: all 0.2s;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
}

#dot_wrap .dot li.active img {
	width: 100%;
}
#dot_wrap .dot li:after {
	content: '';
	display: block;
	width: 1px;
	height: 0px;
	margin: 0 auto;
	background-color: #fff;
	transition: all 0.4s;
	-webkit-transition: all 0.4s;
	-moz-transition: all 0.4s;
	margin-top: 3px;
}
#dot_wrap .dot li.active:after {
	height: 40px;
}
#dot_wrap .dot li.active2:after {
	background-color: #010101;
}
#dot_wrap .dot li:last-child:after {
	display: none;
}










#video {
	position: relative;
	overflow: hidden;
}
#video #vimeo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 1940px;
	height: 1091px;
}
#video .player-ctrl{
	position: absolute;
	z-index: 200;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	cursor: pointer;
	text-align: center;	
}
#video .play_btn {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	background-color: rgba(0,0,0,0);
	border: none;
	outline: none;
	cursor: pointer;
}
#video .align-center{
	position: absolute;
	left: 50% !important;
	top: 50% !important;
	transform: translateX(-50%) translateY(-50%) !important;
	z-index: 30;
}








#about {
	background: url(/img/about_bg.jpg) 0 0 no-repeat;
	background-size: cover;
	background-position: center;
	text-align: center;
	display: table;
	background-attachment: fixed;
}
#about .container {
	display: table-cell;
	vertical-align: middle;
}
#about .content {
	width: 55%;
	float: right;
}
#about .s_tit {
	color: #fff;
	font-size: 22px;
	letter-spacing: 20px;
}
#about h2 {
	margin: 2.5% 0 4.5% 0;
}
#about h2 img {
	width: 74.7%;
}
#about .text {
	color: #fff;
	font-size: 18px;
	line-height: 34px;
	margin-bottom: 6%;
}
#about .more {
	border: 1px solid #fff;
	padding: 1.5% 3% 1%;
	display: inline-block;
}
#about .more:hover {
	background-color: #0071e4;
	border: 1px solid #0071e4;
}
#about .ani {
	transform: translate(0,20px);
	-webkit-transform: translate(0,20px);
	transition: transform 1s, opacity 1s;
	-webkit-transition: transform 1s, opacity 1s;
	opacity: 0;
}
#about .title {
	transition-delay: 0.2s;
}
#about .text {
	transition-delay: 0.4s;
}
#about .more {
	transition-delay: 0.6s;
}
#about .ani.active {
	transform: translate(0,0);
	-webkit-transform: translate(0,0);
	opacity: 1;
}




#room {
	background: url(/img/room_bg.jpg) 0 0 no-repeat;
	position: relative;
	text-align: center;
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}
#room .floater {
    float: left;
    height: 50%;
    margin-bottom: -320px;
}
#room .container {
	clear: both;
	height: 640px;
	position: relative;
	padding: 0;
}
#room .p_room .title {
	opacity: 0;
	transition: all 1s;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	transform: translate(0,20px);
	-webkit-transform: translate(0,20px);
	-ms-transform: translate(0,20px);
}
#room .p_room .title.active {
	opacity: 1;
	transform: translate(0,0);
	-webkit-transform: translate(0,0);
	-ms-transform: translate(0,0);
}
#room .p_room .title1 {
	margin-top: 4%;
}
#room .p_room .title1 img {
	width: 30.1%;
}
#room .p_room .title2 {
	font-size: 20px;
	color: #fff;
	transition-delay: 0.2s;
}
#room .p_room .title.active {
	opacity: 1;
	transform: translate(0,0);
	-webkit-transform: translate(0,0);
	-ms-transform: translate(0,0);
}
#room .room_list li {
	position: relative;
}
#room .room_list li .content {
	position: absolute;
	bottom: 6%;
	left: 50%;
	transform: translate(-50%,0);
	text-align: center;
	width: 100%;
	z-index: 10;
}
#room .room_list li .name {
	font-size: 30px;
	color: #fff;
}
#room .room_list li .text {
	font-size: 16px;
	color: #fff;
	line-height: 28px;
}
#room .owl-item .img {
	transform: scale(0.9);
	transition: all 0.7s;
	-webkit-transition: all 0.7s;
}
#room .owl-item.center .img {
	transform: scale(1);
}
#room .owl-carousel .owl-nav button.owl-prev,
#room .owl-carousel .owl-nav button.owl-next {
	width: 60px;
	height: 60px;
	bottom: 60%;
}
#room .owl-carousel .owl-nav button.owl-prev:hover,
#room .owl-carousel .owl-nav button.owl-next:hover {
	background-color: #07182f;
}
#room .owl-carousel .owl-nav button.owl-prev {
	background: #174178 url(/img/prev.png) 8px 16px no-repeat;
	left: 25%;
}
#room .owl-carousel .owl-nav button.owl-next {
	background: #174178 url(/img/next.png) 35px 16px no-repeat;
	right: 25%;
}
#room .paging2 span {
	position: absolute;
	top: 34%;
	color: #fff;
	font-size: 15px;
	z-index: 10;
}
#room .paging2 .page1 {
	left: 26.7%;
}
#room .paging2 .page2 {
	left: 72.5%;
}

/* ¸ð¹ÙÀÏ °´½Ç */
#room .m_room {
	display: none;
	margin: 6% 0;
}
#room .m_room .title img {
	width: 250px;
}
#room .m_room .list {
	overflow: hidden;
}
#room .m_room li {
	float: left;
	width: 49%;
	margin: 0 2% 2% 0;
}
#room .m_room li:nth-child(even) {
	margin-right: 0;
}
#room .m_room li img {
	width: 100%;
}
#room .m_room li .text {
	font-size: 14px;
}








#cafe {
	background: url(/img/cafe_bg.jpg) 0 0 no-repeat;
	background-position: center bottom;
	position: relative;
	background-size: contain;
}
#cafe .owl-carousel li {
	width: 100%;
	height: 100%;
}
#cafe .owl-carousel li div {
	width: 100%;
	height: 100%;
	background-position: center center;
	background-size: cover;
}
#cafe .content {
	position: absolute;
	top: 62%;
	left: 50%;
	transform: translate(-50.2%,0);
	-webkit-transform: translate(-50.2%,0);
	z-index: 10;
	background-color: #126dc9;
	text-align: center;
	padding: 0.5% 1.5% 1.5%;
	width: 18.15%;
}
#cafe .content img {
	margin: -32px 0 10px 0;
	width: 100%;
}
#cafe .content .text {
	color: #fff;
	font-size: 20px;
}







#facilities {
	font-size: 0;
	position: relative;
}
#facilities .m_title {
	display: none;
}
#facilities .m_title img {
	width: 250px;
}
#facilities .title_wrap {
	text-align: center;
	background: url(/img/fac_bg.jpg) 0 0 no-repeat;
	background-size: cover;
	background-position: center bottom;
	padding-top: 10%;
}
#facilities .title_wrap .title {
	transform: translate(0,20px);
	-webkit-transform: translate(0,20px);
	opacity: 0;
	transition: all 1s;
	-webkit-transition: all 1s;
}
#facilities .title_wrap .title.active {
	transform: translate(0,0);
	-webkit-transform: translate(0,0);
	opacity: 1;
}
#facilities .title_wrap .title1 {
	margin-bottom: 1%;
	font-size: 20px;
	color: #fff;
}
#facilities .title_wrap .title2 {
	transition-delay: 0.2s;
}
#facilities .title_wrap .title2 img {
	width: 30.3%;
}
#facilities .container3 {
	margin-top: 6%;
	position: relative;
}
#facilities .list li {
	position: relative;
	text-align: center;
}
#facilities .list li a {
	outline: none;
}
#facilities .list li .over {
	position: absolute;
	display: inline-block;
	color: #fff;
	font-size: 26px;
	top: 0;
	left: 3.5%;
	width: 93.2%;
	height: 47%;
	background-color: rgba(0,0,0,0.4);
	padding-top: 53%;
	opacity: 0;
	transition: all 0.4s;
	-webkit-transition: all 0.4s;
}
#facilities .list li .over:hover {
	opacity: 1;
	padding-top: 50%;
	height: 50%;
}
#facilities .list li .img {
	width: 93%;
}
#facilities .list li .text {
	font-size: 16px;
	color: #333333;
	font-weight: bold;
	margin-top: 3%;
}
#facilities .slick-next, 
#facilities .slick-prev {
	width: 131px;
	height: 25px;
	top: 70%;
	transition: all 0.4s;
	-webkit-transition: all 0.4s;
}
#facilities .slick-next {
	background: url(/img/fac_next.png) 0 0 no-repeat;
	right: 4%;
}
#facilities .slick-prev {
	background: url(/img/fac_prev.png) 0 0 no-repeat;
	left: 4%;
}
#facilities .slick-next:hover {
	transform: translate(12px,0);
	-webkit-transform: translate(12px,0);
}
#facilities .slick-prev:hover {
	transform: translate(-12px,0);
	-webkit-transform: translate(-12px,0);
}












#service {
	background: url(/img/service_bg.jpg) 0 0 no-repeat;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	display: table;
}
#service .container {
	padding: 0 11.5%;
	display: table-cell;
	vertical-align: middle;
}
#service .item {
	position: relative;
	text-align: center;
}
#service .item:hover .img {
	transform: scale(1.1);
}
#service .item .img_wrap {
	overflow: hidden;
} 
#service .item .img {
	transition: all 0.6s;
	-webkit-transition: all 0.6s;
	-moz-transition: all 0.6s;
	width: 100%;
} 
#service .item .content {
	position: absolute;
	top: 41%;
	left: 0;
	width: 100%;
}
#service .item .text {
	font-size: 20px;
	color: #fff;
	margin-top: 10px;
}
#service .service {
	float: left;
	padding-top: 4.2%;
	width: 61.4%;
	padding-bottom: 22px;
	font-size: 0;
}
#service .service .visual_title {
	display: inline-block;
	vertical-align: top;	
	width: 59.3%;
}
#service .service .visual_title .title1 img {
	width: 72.5%;
}
#service .service .visual_title .title,
#service .service .visual_title .text {
	opacity: 0;
	transition: all 1s;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	transform: translate(0,20px);
	-webkit-transform: translate(0,20px);
	-ms-transform: translate(0,20px);
}
#service .service .visual_title .title.active,
#service .service .visual_title .text.active {
	transform: translate(0,0);
	-webkit-transform: translate(0,0);
	-ms-transform: translate(0,0);
	opacity: 1;
}
#service .service .visual_title .title2 {
	margin: 2% 0 10% 0;
	transition-delay: 0.2s;
}
#service .service .visual_title .title2 img {
	width: 54.5%;
}
#service .service .visual_title .text {
	font-size: 20px;
	color: #fff;
	line-height: 32px;
	transition-delay: 0.4s;
	margin-top: 2%;
}
#service .service .item1 {
	display: inline-block;
	width: 40.5%;
}
#service .item1 .content img {
	width: 46.2%;
}
#service .item2 .content img {
	width: 45.3%;
}
#service .item3 .content img {
	width: 27.7%;
}
#service .item2 {
	float: right;
	width: 36.5%;
}
#service .item3 {
	float: right;
	padding-right: 1.7%;	
	width: 59%;
}








@media (max-width: 1600px) {
	#about .text,
	#room .title2, #cafe .content .text,
	#facilities .title_wrap .title1,
	#service .service .visual_title .text,
	#service .item .text {
		font-size: 16px;
	}
	#about .text {
		line-height: 26px;
	}
	#about .s_tit {
		font-size: 18px;
		letter-spacing: 15px;
	}
	#room .floater {
		margin-bottom: -275px;
	}
	#room .container {
		height: 550px;
	}
}
@media (max-width: 1280px) {
	#about .content {
		width: 100%;
	}
	#video .video_wrap #player {
		width: 1700px;
		height: 1100px;
	}
	#room .floater {
		margin-bottom: -217.5px;
	}
	#room .container {
		height: 435px;
	}
}
@media (max-width: 768px) {
	#top_visual .visual_title .title,
	#about .ani,
	#service .service .visual_title .title {
		opacity: 1;
		transform: translate(0,0);
		-webkit-transform: translate(0,0);
	}
	#dot_wrap {
		display: none;
	}
	#about .text, #room .title2, 
	#cafe .content .text, 
	#facilities .title_wrap .title1 {
		font-size: 14px;
	}
	#video .video_wrap #player {
		width: 1100px;
		height: 1100px;
	}
	#about {
		padding: 8% 0;
		background-attachment: scroll;
	}
	#about h2 img {
		width: 370px;
	}
	#about .text {
		line-height: 21px;
	}
	#about .s_tit {
		font-size: 14px;
		letter-spacing: 5px;
	}
	#room {
		background: none;
	}
	#room .m_room {
		display: block;
	} 
	#room .m_sub_room {
		margin-top: 17%;	
	} 
	#room .p_room,
	#cafe .content .text,
	#facilities .title_wrap .title1,
	#service .service .visual_title .text, 
	#service .item .text {
		display: none;
	}
	#cafe .content {
		width: 30%;
		padding: 1.5%;
		top: 39%;
	}
	#cafe .content img {
		margin: 0;
	}
	.sub_fac {
		margin-top: 7%;
	}
	#facilities {
		margin-bottom: 11%;
	}
	#facilities .container3 {
		margin-top: 4%;
		padding: 0 5%;
	}
	#facilities .title_wrap {
		background: none;
	}
	#facilities .m_title {
		display: block;
	}
	#facilities .title2 {
		display: none;	
	}
	#facilities .slick-prev,
	#facilities .slick-next {
		background-size: 90px;
		width: 90px;
		top: 104%;
	}
	#facilities .slick-next {
		right: 22%;
	}
	#facilities .slick-prev {
		left: 22%;
	}
	#facilities .list li .text {
		font-size: 14px;
	}
	#facilities .list li .over {
		display: none;
	}
	#service {
		padding: 5% 0;
		background-attachment: scroll;
	}
	#service .service {
		width: 45.4%;
	}
	#service .service .visual_title {
		margin-bottom: 5%;
	}
	#service .service .visual_title, 
	#service .item3 {
		width: 100%;
	}
	#service .service .item1 {
		width: 100%;
	}
	#service .item2 {
		width: 49%;
	}

}
@media (max-width: 479px) {
	#video {
		margin: 5px 0;
	}
	#room .title2, 
	#cafe .content .text, 
	#facilities .title_wrap .title1,
	#facilities .list li .text {
		font-size: 12px;
	}
	#video .video_wrap #player {
		width: 600px;
		height: 676px;
	}
	#about h2 img {
		width: 270px;
	}
	#about .text {
		font-size: 10px;
		line-height: 17px;
	}
	#about .s_tit {
		font-size: 12px;
	}
	#about .more img {
		width: 150px;
	}
	#service .service .visual_title .title1 img {
		width: 130px;
	}
	#service .item2 .content img {
		width: 110px;
	}
	#service .item3 .content img {
		width: 100px;
	}
}