@charset "utf-8";

/*main start*/

#main { position: relative; overflow: hidden; width:100%; height:100vh; }

#main > .txt { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 101; width: 100%; color: #FFF; text-align: center;  transition: .4s; }
#main > .txt > .txt-in { position: relative; display: inline-block; margin: 0px auto; }
#main > .txt > .txt-in > h1 { display: inline-block; position: relative; font-family: 'Cormorant'; font-size: 72px; font-weight: 400; line-height: 1.25em; letter-spacing: 2.5px; }
#main > .txt > .txt-in > p { margin-top: 40px; font-family: 'Pretendard-Regular'; font-size: 16px; letter-spacing: 2px; }
#main > .txt > .txt-in > p > br { display: none; }

#main > .reser { position: absolute; right: 100px; bottom: 100px; z-index: 101; }
#main > .reser > div { position: relative; background: #fff; width: 140px; height: 140px; border-radius: 50%; font-family: 'Karla'; font-size: 16px; line-height: 140px; color: #605856; text-align: center; transition: .4s; }
#main > .reser > div:hover { opacity: .7; }
#main > .reser > div > a { position: absolute; z-index: 2; display: block; width: 140px; height: 140px; }
#main > .reser > div > img { position: absolute; left: -35px; top: -30px; animation: rotate_image 25s linear infinite; }


@keyframes rotate_image {

	100% {
    	transform: rotate(360deg);
    }
}


#main .sec1_slider { position: relative; height: 100%; }

#main .sec1_slider .swiper-slide.img1{background: url(../img/main/image1.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img2{background: url(../img/main/image2.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img3{background: url(../img/main/image3.jpg)no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img4{background: url(../img/main/image4.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img5{background: url(../img/main/image5.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img6{background: url(../img/main/image6.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img7{background: url(../img/main/image7.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img8{background: url(../img/main/image8.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img9{background: url(../img/main/image9.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img10{background: url(../img/main/image10.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img11{background: url(../img/main/image11.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img12{background: url(../img/main/image12.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img13{background: url(../img/main/image13.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img14{background: url(../img/main/image14.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img15{background: url(../img/main/image15.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img17{background: url(../img/main/image17.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img18{background: url(../img/main/image18.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img19{background: url(../img/main/image19.jpg) no-repeat; background-size: cover; background-position: center;}


.sec1-navi-wrapper { position: relative; width: 100%; height: 100%; top: 0px; }

#main .txt .nav { position: absolute; width: 100%; height: 19px; right: 0px; top: 50%; }
#main .txt .nav .nav-in { position: relative; width: 100%; height: 19px; right: 0px;  }

.sec1-next:after, .sec1-prev:after { content: "";  }
.sec1-next { right: 100px; top: auto; bottom: -2.5px; width: 17px; height: 32px; background-size: cover; z-index: 999; transition: .4s; z-index: 102; background: url(../img/arrow2.png) no-repeat; background-size: cover; background-position: center; }
.sec1-prev { left: auto; top: auto; bottom: -2.5px; left: 100px; width: 17px; height: 32px; background-size: cover; z-index: 999; transition: .4s; z-index: 102; background: url(../img/arrow.png) no-repeat; background-size: cover; background-position: center; }
.sec1-next:hover, .sec1-prev:hover { opacity: .7; }

#main .swiper-pagination { width: auto; }
#main .swiper-pagination-fraction, #main .swiper-pagination-custom, #main .swiper-container-horizontal > .swiper-pagination-bullets { top: auto; bottom: 100px; left: 100px; font-family: 'Karla'; font-size: 16px; font-weight: 400; color: #fff; letter-spacing: 2; }
/*main end*/  

.title h1 { display: inline-block; position: relative; font-family: 'Cormorant'; font-weight: 400;  letter-spacing: 2.5px; }
.title h2 { font-family: 'Cormorant'; font-size: 24px; font-weight: 600; }
.title p { font-size: 16px; line-height: 30px; color: #8a7f7c; }
.title .link { position: relative; margin-top: 50px; transition: .4s; }
.title .link:hover { opacity: .7; }
.title .link a { font-family: 'Cormorant'; font-size: 20px; font-weight: 600; }
.title .link a img { margin-left: 20px; margin-bottom: 2px; transition: .5s; }
.title .link a:hover img{margin-left:34px;}
section .defalt-w { padding: 0px 100px; }


/*intro start*/

#intro .intro-in { padding: 100px; }
#intro .intro-in .intro-wrap { padding: 100px 0px 100px 0px; display: flex; justify-content: space-between; border-top: 1px solid #605856; border-bottom: 1px solid #605856; }
#intro .intro-in .intro-wrap > div:nth-of-type(1) { padding-top: 160px; width: 30%; }
#intro .intro-in .intro-wrap > div:nth-of-type(1) h1 { font-size: 88px; line-height: 108px; }
#intro .intro-in .intro-wrap > div:nth-of-type(2) { width: 30%; height: 658px; background: url(../img/main/image5.jpg) no-repeat; background-size: cover; background-position: 30% 50%; border-radius: 250px 250px 0% 0%; }
#intro .intro-in .intro-wrap > div:nth-of-type(3) { width: 30%; padding-top: 160px; }


/*intro end*/
/*special start*/

#special .special-in .title { text-align: center; }
#special .special-in .special-wrap { margin-top: 60px; display: flex; flex-wrap: wrap; justify-content: space-between; }
#special .special-in .special-wrap > .box { background: #fff; padding: 45px 60px; }
#special .special-in .special-wrap > .box:nth-of-type(1) { width: 32%; }
#special .special-in .special-wrap > .box:nth-of-type(2) { width: 66%; }
#special .special-in .special-wrap > .box:nth-of-type(3) { margin-top: 30px; width: 66%; }
#special .special-in .special-wrap > .box:nth-of-type(4) { margin-top: 30px;  width: 32%; }
#special .special-in .special-wrap > .box:nth-of-type(5) { margin-top: 30px; width: 32%; }
#special .special-in .special-wrap > .box:nth-of-type(6) { margin-top: 30px;  width: 66%; }

#special .special-in .special-wrap > .box > .txt { display: flex; justify-content: space-between }
#special .special-in .special-wrap > .box > .txt > p { font-weight: 600; }

#special .special-in .special-wrap > .box > .con { display: block; margin-top: 15px; border-left: 1px solid #605856; border-right: 1px solid #605856; border-top: 1px solid #cbc9c8; border-bottom: 1px solid #cbc9c8; padding: 50px; text-align: center; } 
#special .special-in .special-wrap > .box > .con:hover .pic { filter: brightness(1.1); transform: scale(1.01);}
#special .special-in .special-wrap > .box > .con > .pic { width: 100%; height: 358px; transition: .4s; }
#special .special-in .special-wrap > .box:nth-of-type(1) > .con > .pic { background: url(../img/sub3/2/image1.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }
#special .special-in .special-wrap > .box:nth-of-type(2) > .con > .pic { background: url(../img/sub3/1/image1.jpg) no-repeat; background-size: cover; background-position: 50% 30%; }
#special .special-in .special-wrap > .box:nth-of-type(3) > .con > .pic { background: url(../img/sub3/4/image3.jpg) no-repeat; background-size: cover; background-position: 50% 00%; }
#special .special-in .special-wrap > .box:nth-of-type(4) > .con > .pic { background: url(../img/sub3/3/image1.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }
#special .special-in .special-wrap > .box:nth-of-type(5) > .con > .pic { background: url(../img/sub3/5/image1.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }
#special .special-in .special-wrap > .box:nth-of-type(6) > .con > .pic { background: url(../img/sub3/6/image1.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }

#special .special-in .special-wrap > .box > .con > h3 { margin-top: 30px; font-family: 'Cormorant'; font-size: 36px; font-weight: 500; }
#special .special-in .special-wrap > .box > .con p { color: #8a7f7c; }
#special .special-in .special-wrap > .box > .con > p { margin-top: 20px; line-height:1.5em; }

/*special end*/
/*rooms start*/

#rooms { margin-top: 190px; }
#rooms .rooms-in .title { position: relative; text-align: center; }
#rooms .rooms-in .title h1 { font-size: 48px; }

#rooms .rooms-in .rooms_wrap { margin-top: 50px; padding-bottom: 100px; border-bottom: 1px solid #605856; }

#rooms .rooms-in .rooms_wrap > div > div { height: auto; }
#rooms .rooms-in .rooms_wrap > div > div > div { height: auto; }
#rooms .rooms-in .rooms_wrap > div > div > div > .num { text-align: center; border-bottom: 1px solid #c6c1bf; }
#rooms .rooms-in .rooms_wrap > div > div > div > .num > h2 { font-family: 'Cormorant'; font-size: 32px;  color: #c6c1bf; font-weight: 500; line-height: 80px; border-bottom: 1px solid #c6c1bf; transition: .4s; }
#rooms .rooms-in .rooms_wrap > div > div > div:hover > .num > h2 { color: #605856; border-bottom: 1px solid #605856; }
#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap  { padding: 50px 35px 30px 35px; }
#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic { position: relative; display: block; height: 574px; transition: .8s; }
#rooms .rooms-in .rooms_wrap > div > div > .room1 > .pic-wrap > .pic { background: url(http://serendipityp.cdn1.cafe24.com/sub2/image16.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }
#rooms .rooms-in .rooms_wrap > div > div > .room2 > .pic-wrap > .pic { background: url(http://serendipityp.cdn1.cafe24.com/sub2/image20.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }
#rooms .rooms-in .rooms_wrap > div > div > .room3 > .pic-wrap > .pic { background: url(http://serendipityp.cdn1.cafe24.com/sub2/image11.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }
#rooms .rooms-in .rooms_wrap > div > div > .room4 > .pic-wrap > .pic { background: url(http://serendipityp.cdn1.cafe24.com/sub2/image21.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }
#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic:hover { background-position: 100% 50%; }
#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic > div { position: absolute; z-index: 1; height: 140px; width: 140px; border-radius: 50%; right: 25px; bottom: 25px; background: #fff; text-align: center; transition: .4s; }
#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic:hover > div { opacity: .7; }
#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic > div > h3 { font-family: 'Kalra'; font-size: 16px; font-weight: 500; line-height: 140px; }

#rooms .rooms-in .rooms_wrap > div > div > div > .txt { padding: 0px 35px; }
#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(1) { display: flex; justify-content: space-between; }
#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(1) > h3 { font-family: 'Kalra'; font-size: 24px; font-weight: 500; }
#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(1) > a { font-family: 'Cormorant'; font-size: 14px; font-weight: 700; line-height: 24px; }
#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(2) { margin-top: 10px; font-size: 13px; color: #8a7f7c; }

#rooms .nav { position: absolute; width: 100%; height: 19px; right: 0px; top: 50%; }
#rooms .nav .nav-in { position: relative; width: 100%; height: 19px; right: 0px;  }

.rooms-next:after, .rooms-prev:after { content: "";  }
.rooms-next { right: 0px; top: auto; bottom: -2.5px; width: 17px; height: 32px; background-size: cover; z-index: 999; transition: .4s; z-index: 102; background: url(../img/arrow4.png) no-repeat; background-size: cover; background-position: center; }
.rooms-prev { left: auto; top: auto; bottom: -2.5px; left: 0px; width: 17px; height: 32px; background-size: cover; z-index: 999; transition: .4s; z-index: 102; background: url(../img/arrow3.png) no-repeat; background-size: cover; background-position: center; }
.rooms-next:hover, .rooms-prev:hover { opacity: .7; }

/*rooms end*/
/*banner start*/

#banner { margin-top: 100px; }
#banner .banner-in .title .link::after { content: ""; position: absolute; width: 384px; height: 1px; background: #605856; left: 0px; bottom: -40px; }
#banner .banner-in .banner-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; }
#banner .banner-in .banner-wrap .box:nth-of-type(1) { width: 33%; padding-left: 100px; position: relative; }
#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(1) { width: 325px; height: 418px; background: url(../img/sub1/image13.jpg) no-repeat; background-size: cover; background-position: 50% 50%; border-radius: 250px 250px 0% 0%; }
#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(2) { position: absolute; right: -306px; width: 446px; height: 480px; background: url(../img/sub1/image15.jpg) no-repeat; background-size: cover; background-position: 50% 50%; float: right; }
#banner .banner-in .banner-wrap .box:nth-of-type(1) > img { position: absolute; left: 0px; bottom: -80px; animation: rotate_image 25s linear infinite; }
#banner .banner-in .banner-wrap .box:nth-of-type(2) { width: 34%; padding-left: 30px; padding-top: 50px; }
#banner .banner-in .banner-wrap .box:nth-of-type(2) > h1 { font-size: 120px; line-height: 128px; text-align: left; }
#banner .banner-in .banner-wrap .box:nth-of-type(3) { width: 33%; }
#banner .banner-in .banner-wrap .box:nth-of-type(3) > div { width: 502px; height: 325px; margin: 0px auto; background: url(../img/main/image7.jpg) no-repeat; background-size: cover; background-position: 50% 50%; }
#banner .banner-in .banner-wrap .box:nth-of-type(4) { width: 50%; }
#banner .banner-in .banner-wrap .box:nth-of-type(5) { width: 50%; padding-top: 125px; padding-left: 160px; padding-bottom: 120px; }
#banner .banner-in .banner-wrap .box:nth-of-type(5) > h2 { font-size: 34px; font-weight: 500; }
#banner .banner-in .banner-wrap .box:nth-of-type(5) > p { margin-top: 30px; font-family: 'Pretendard-Regular'; font-size: 16px; font-weight: 500; line-height: 1.5em; }

/*banner end*/
/*map start*/

#map { margin-top: 100px; }
#map .map-in .map-wrap { width: 1392px; margin: 0px auto; }


/*video*/
#vid_banner{margin-bottom: 140px;}
#vid_banner .vid{position: relative; overflow: hidden; width: 100%; height: 100%; }
#vid_banner .vid:after{position: absolute; width: 100%; height: 100%; content: ""; display: block; background:rgba(130,122,120,.05);}

#vid_banner #vid_box{ position:absolute; left:50%; top:40%; transform: translate3d(-50%, -50%, 0); object-fit: cover; min-width: 100%; min-height: 100%; display: block; overflow: hidden; }
#vid_banner #vid_box iframe{ width: 100%; height: 100%; display: block; background:#000; background-repeat:no-repeat; background-position: 50% 50%; background-size: cover;}

/**********************************************반응형********************************************************/

@media all and (max-width: 3840px){
    #vid_banner #vid_box{width: 3840px; height:2160px;}
    #vid_banner .vid_banner_in{height: 1000px;}
}

@media all and (max-width: 1920px){
    #vid_banner #vid_box{width: 1920px; height:1080px;}
    #vid_banner .vid_banner_in{height: 740px;}
}





/* 반응형 시작 */

@media (max-width: 1720px) {

	
	#main > .reser { right: 60px; bottom: 60px; }
	.sec1-prev { left: 30px; }
	.sec1-next { right: 30px; }
	#main .swiper-pagination-fraction, #main .swiper-pagination-custom, #main .swiper-container-horizontal > .swiper-pagination-bullets { left: 30px; bottom: 30px; }
	
	section .defalt-w { padding: 0px 30px; }
	.title p br { display: none; }
	.title p br.onblock { display: block; }
	
	#intro .intro-in { padding: 100px 30px }
	
	#special .special-in .special-wrap > .box:nth-of-type(1) { width: 49%; }
	#special .special-in .special-wrap > .box:nth-of-type(2) { width: 49%; }
	#special .special-in .special-wrap > .box:nth-of-type(3) { width: 49%; }
	#special .special-in .special-wrap > .box:nth-of-type(4) { width: 49%; }
	
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap { padding: 50px 15px 35px 15px }
	
	#banner .banner-in .banner-wrap .box:nth-of-type(1) { padding-left: 0px; width: 30%; }
	#banner .banner-in .banner-wrap .box:nth-of-type(2) { padding-left: 0px; width: 37%; }
	
	#map .map-in .map-wrap { width: 80%; margin: 0px auto; }
    
}
@media (max-width: 1660px) {
    #vid_banner #vid_box{width: 1660px; height:934px;}
    #vid_banner .vid_banner_in{height: 640px;}
}

@media (max-width: 1240px) {
    #vid_banner #vid_box{width: 1240px; height:698px;}
    #vid_banner .vid_banner_in{height: 560px;}
}

@media (max-width: 1024px) {

	.title h2 { font-size: 22px; }
	.title p { font-size: 14px; line-height: 28px;}
	.title .link { margin-top: 40px; }
	
	#main > .reser > div { width: 120px; height: 120px; line-height: 120px; }
	#main > .reser > div > img { left: -30px; top: -30px; width: 180px; }
	#main > .reser > div > a { width: 120px; height: 120px; font-size: 14px; }
	#main > .txt > .txt-in > h1 { font-size: 58px; line-height: 78px; }
	#main > .txt > .txt-in > p { margin-top: 25px; font-size: 12px; }
	#main .swiper-pagination-fraction, #main .swiper-pagination-custom, #main .swiper-container-horizontal > .swiper-pagination-bullets { font-size: 14px; }
	
	#intro .intro-in .intro-wrap { flex-wrap: wrap; }
	#intro .intro-in .intro-wrap > div:nth-of-type(1) { width: 50%; padding-top: 130px; }
	#intro .intro-in .intro-wrap > div:nth-of-type(1) h1 { font-size: 58px; line-height: 78px; }
	#intro .intro-in .intro-wrap > div:nth-of-type(2) { width: 50%; height: 480px; }
	#intro .intro-in .intro-wrap > div:nth-of-type(3) { width: 100%; padding-top: 80px; }
	
	#special .special-in .special-wrap > .box { padding: 22.5px 30px; }
	#special .special-in .special-wrap > .box > .txt > p { font-size: 14px; }
	#special .special-in .special-wrap > .box > .con { padding: 25px; }
	#special .special-in .special-wrap > .box > .con > h3 { margin-top: 20px; font-size: 28px; }
	#special .special-in .special-wrap > .box > .con > p { margin-top: 10px; font-size: 14px; }
	#special .special-in .special-wrap > .box > .con > .pic { height: 308px; }
	
	#rooms .rooms-in .title h1 { font-size: 32px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .num > h2 { font-size: 24px; line-height: 70px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap { padding: 30px 15px 20px 15px }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic { height: 448px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic > div { width: 120px; height: 120px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic > div > h3 { width: 120px; height: 120px; font-size: 18px; line-height: 120px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .txt { padding: 0px 15px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(1) > h3 { font-size: 20px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(1) > a { line-height: 20px; }
	
	#banner .banner-in .banner-wrap .box:nth-of-type(1) { width: 50%; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(1) { width: 100%; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(2) { right: -100%; width: 100%; height: 400px;}
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > img { left: auto; right: -85px; width: 180px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(2) { padding-left: 40px; width: 50%; }
	#banner .banner-in .banner-wrap .box:nth-of-type(2) > h1 { padding-top: 80px; font-size: 84px; line-height: 92px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(2) > h1 br { display: none; }
	#banner .banner-in .banner-wrap .box:nth-of-type(3) { width: 50%; }
	#banner .banner-in .banner-wrap .box:nth-of-type(3) > div { width: 100%; height: 400px }
	#banner .banner-in .banner-wrap .box:nth-of-type(5) { width: 100%; padding-top:100px; padding-left: 0px; padding-bottom: 100px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(5) > h2 { font-size: 30px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(5) > p { margin-top: 10px; font-size: 14px; line-height: 28px; }
	#banner .banner-in .title .link::after { width: 100%; bottom: -100px; }
	
	#map .map-in .map-wrap { width: 100%; }
	.map-wrap { height: 450px !important; }
	.root_daum_roughmap .wrap_map { height: 450px !important; }
    #vid_banner{margin-bottom: 100px;}
	#vid_banner #vid_box{width: 1024px; height:576px;}
    #vid_banner .vid_banner_in{height: 500px;}
}


@media (max-width: 768px) {
    
	section .defalt-w { padding: 0px 20px; }
	.title p { font-size: 13px; line-height: 26px; }
	.title h2 { font-size: 18px; }
	.title .link a { font-size: 16px; }
	.title .link a img { width: 50px; }
	
	#main { margin-top: 78px; position: relative; overflow: hidden; width:100%; height:80vh; }
	#main > .txt > .txt-in > h1 { font-size: 38px; line-height: 46px; }
	#main > .txt > .txt-in > p { margin-top: 10px; font-size: 11px; letter-spacing: 0.2px; }
	#main > .reser > div { display: none; }
	.sec1-prev { left: 20px; width: 10px; height: 19px; }
	.sec1-next { right: 20px; width: 10px; height: 19px; }
	#main .swiper-pagination-fraction, #main .swiper-pagination-custom, #main .swiper-container-horizontal > .swiper-pagination-bullets { font-size: 12px; left: 20px; bottom: 20px; }
    
	#intro .intro-in { padding: 50px 20px; }
	#intro .intro-in .intro-wrap { padding: 50px 0px 50px 0px; }
	#intro .intro-in .intro-wrap > div:nth-of-type(1) { padding-top: 100px; }
	#intro .intro-in .intro-wrap > div:nth-of-type(1) h1 { font-size: 30px; line-height: 46px; }
	#intro .intro-in .intro-wrap > div:nth-of-type(2) { height: 350px; }
	#intro .intro-in .intro-wrap > div:nth-of-type(3) { padding-top: 50px; }
	
	#special .special-in .special-wrap { flex-flow: column; margin-top: 20px; }
	#special .special-in .special-wrap > .box { padding: 15px 20px 20px; }
	#special .special-in .special-wrap > .box:nth-of-type(1) { margin-top: 20px; width: 100%; } 
	#special .special-in .special-wrap > .box:nth-of-type(2) { margin-top: 20px; width: 100%; } 
	#special .special-in .special-wrap > .box:nth-of-type(3) { margin-top: 20px; width: 100%; } 
	#special .special-in .special-wrap > .box:nth-of-type(4) { margin-top: 20px; width: 100%; }
	#special .special-in .special-wrap > .box > .txt > p { font-size: 13px; font-weight: 500; }
	#special .special-in .special-wrap > .box > .con { margin-top: 7.5px; padding: 20px; }
	#special .special-in .special-wrap > .box > .con > .pic { height: 240px; }
	#special .special-in .special-wrap > .box > .con > h3 { font-size: 20px; }
	#special .special-in .special-wrap > .box > .con > p { font-size: 12px; }
	
	#rooms { margin-top: 80px; }
	#rooms .rooms-in .title h1 { font-size: 24px; }
	#rooms .rooms-in .rooms_wrap { margin-top: 20px; padding-bottom: 50px;  }
	#rooms .rooms-in .rooms_wrap > div > div > div > .num > h2 { font-size: 20px; line-height: 50px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap { padding: 20px 0px 20px 0px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic { height: 380px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic > div { width: 100px; height: 100px; right: 15px; bottom: 15px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic > div > h3 { width: 100px; height: 100px; font-size: 14px; line-height: 100px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .txt { padding: 0px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(1) > h3 { font-size: 18px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(1) > a  {font-size: 12px; line-height: 18px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(2) { font-size: 12px; }
	.rooms-prev { left: 0px; bottom: 10px; width: 10px; height: 19px; }
	.rooms-next { right: 0px; bottom: 10px; width: 10px; height: 19px; }

	#banner { margin-top: 50px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > img { right: -77.5px; width: 160px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(1) { height: 350px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(2) > h1 { font-size: 38px; line-height: 42px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(3) > div { height: 350px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(2) { height: 350px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(5) { padding-top: 50px;  padding-bottom: 50px;}
	#banner .banner-in .title .link::after { bottom: -50px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(5) > h2 { font-size: 24px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(5) > p { font-size: 13px; line-height: 26px; }
	
	#map { margin-top: 50px; }
	.map-wrap { height: 380px !important; }
	.root_daum_roughmap .wrap_map { height: 380px !important; }
	
    #vid_banner{margin-bottom: 80px;}
	#vid_banner #vid_box{width: 768px; height:432px;}
    #vid_banner .vid_banner_in{height: 400px;}
}

@media (max-width: 620px) {
	
	section .defalt-w { padding: 0px 16px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(1) { height: 300px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(3) > div { height: 300px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(2) { height: 300px; }
	
}

@media (max-width: 500px) { 
  
	.title p { font-size: 12px; line-height: 24px; }
	
	#main { height:70vh; }
	#main > .txt > .txt-in > h1 { font-size: 24px; line-height: 32px; }
	#main > .txt > .txt-in > p { font-size: 10px; line-height: 14px; }
	#main > .txt > .txt-in > p > br { display: block; }
	
	#intro .intro-in .intro-wrap { flex-flow: column; }
	#intro .intro-in .intro-wrap > div:nth-of-type(1) { width: 100%; padding-top: 0px; text-align: center; }
	#intro .intro-in .intro-wrap > div:nth-of-type(1) h1 { font-size: 26px; line-height: 32px; }
	#intro .intro-in .intro-wrap > div:nth-of-type(1) h1 br { display: none; }
	#intro .intro-in .intro-wrap > div:nth-of-type(2) { width: 65%; height: 300px; margin: 40px auto 0px; }
	
	#special .special-in .special-wrap > .box > .txt > p { font-size: 12px; }
	#special .special-in .special-wrap > .box > .con > .pic { height: 200px; } 
	#special .special-in .special-wrap > .box > .con > p { font-size: 11px; }
	
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic { height: 320px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic > div { width: 80px; height: 80px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic > div > h3 { width: 80px; height: 80px; font-size: 13px; line-height: 80px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .txt > div:nth-of-type(2) { margin-top: 5px; }
	
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(1) { height: 220px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(2) { padding-left: 20px; padding-top: 60px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(2) > h1 { padding-top: 0px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(3) > div { height: 220px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(2) { height: 220px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(2) > h1 { font-size: 30px; line-height: 38px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(5) > p { font-size: 12px; line-height: 24px; }
	
	.map-wrap { height: 320px !important; }
	.root_daum_roughmap .wrap_map { height: 320px !important; }
	
    #vid_banner{margin-bottom: 60px;}
	#vid_banner #vid_box{width: 640px; height:360px;}
    #vid_banner .vid_banner_in{height: 350px;}
}

@media (max-width: 420px) {
	
	section .defalt-w { padding: 0px 12px; }
	#rooms .rooms-in .rooms_wrap > div > div > div > .pic-wrap > .pic { height: 280px;}
	
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > img { right: -60px; bottom: -60px; width: 120px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(1) { height: 180px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(2) { padding-top: 50px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(3) > div { height: 180px; }
	#banner .banner-in .banner-wrap .box:nth-of-type(1) > div:nth-of-type(2) { height: 180px; }
	
	.map-wrap { height: 280px !important; }
	.root_daum_roughmap .wrap_map { height: 280px !important; }
	
}