@charset "utf-8";

/*main start*/

#main .sec1_slider .swiper-slide.img1{background: url(http://skylakep.cdn1.cafe24.com/sub2/image1.jpg) no-repeat; background-size: cover; background-position: center; }
#main .sec1_slider .swiper-slide.img2{background: url(http://skylakep.cdn1.cafe24.com/sub2/image2.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img3{background: url(http://skylakep.cdn1.cafe24.com/sub2/image3.jpg)no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img4{background: url(http://skylakep.cdn1.cafe24.com/sub2/image4.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img5{background: url(http://skylakep.cdn1.cafe24.com/sub2/image5.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img6{background: url(http://skylakep.cdn1.cafe24.com/sub2/image6.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img7{background: url(http://skylakep.cdn1.cafe24.com/sub2/image7.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img8{background: url(http://skylakep.cdn1.cafe24.com/sub2/image8.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img9{background: url(http://skylakep.cdn1.cafe24.com/sub2/image9.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img10{background: url(http://skylakep.cdn1.cafe24.com/sub2/image10.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img11{background: url(http://skylakep.cdn1.cafe24.com/sub2/image11.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img12{background: url(http://skylakep.cdn1.cafe24.com/sub2/image12.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img13{background: url(http://skylakep.cdn1.cafe24.com/sub2/image13.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img14{background: url(http://skylakep.cdn1.cafe24.com/sub2/image14.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img15{background: url(http://skylakep.cdn1.cafe24.com/sub2/image15.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img16{background: url(http://skylakep.cdn1.cafe24.com/sub2/image16.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img17{background: url(http://skylakep.cdn1.cafe24.com/sub2/image17.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img18{background: url(http://skylakep.cdn1.cafe24.com/sub2/image18.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img19{background: url(http://skylakep.cdn1.cafe24.com/sub2/image19.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img20{background: url(http://skylakep.cdn1.cafe24.com/sub2/image20.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img21{background: url(http://skylakep.cdn1.cafe24.com/sub2/image21.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img22{background: url(http://skylakep.cdn1.cafe24.com/sub2/image22.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img23{background: url(http://skylakep.cdn1.cafe24.com/sub2/image23.jpg) no-repeat; background-size: cover; background-position: center;}

#room { padding-top: 100px; }
#room .room-in { padding: 0px 2.36%; }
#room .room-in .room-wrap .room-flex { display: flex; justify-content: space-between; }
#room .room-in .room-wrap .room-flex > .left { width: 50%; }
#room .room-in .room-wrap .room-flex > .right { width: 45%; }
#room .room-in .room-wrap .room-flex .right .right-in { display: flex; justify-content: space-between; }
#room .room-in .room-wrap .room-flex .right .right-in .hours { width: 40%; padding-left:40px;}
#room .room-in .room-wrap .room-flex .right .right-in .preca { width: 60%; }
#room .room-in .room-wrap .room-flex .right .right-in div h3 { margin-top: 90px; font-family: 'EB Garamond'; font-weight: 400; letter-spacing: 1; }
#room .room-in .room-wrap .room-flex .right .right-in div h3 img { margin-right: 10px; }
#room .room-in .room-wrap .room-flex .right .right-in div p { margin-top: 10px; font-size: 13px; letter-spacing: 1; line-height: 26px; }


#room .room-in .room-detail > div { margin-top: 70px; position: relative; width: 100%; height: 636px; }
#room .room-in .room-detail > div > div { position: absolute; }
#room .room-in .room-detail > div > div:nth-of-type(1) { left: 0px; top: 0px; height: 100%; width: 48%; background: url(http://skylakep.cdn1.cafe24.com/sub2/detail1.jpg); background-size: cover; background-position: center; }
#room .room-in .room-detail > div > div:nth-of-type(2) { left: 50%; top: 0px; height: 48%; width: 24%; background: url(http://skylakep.cdn1.cafe24.com/sub2/detail2.jpg); background-size: cover; background-position: center; }
#room .room-in .room-detail > div > div:nth-of-type(3) { left: 50%; bottom: 0px; height: 48%; width: 24%; background: url(http://skylakep.cdn1.cafe24.com/sub2/detail3.jpg); background-size: cover; background-position: center; }
#room .room-in .room-detail > div > div:nth-of-type(4) { right: 0px; height: 100%; width: 24%; background: url(http://skylakep.cdn1.cafe24.com/sub2/detail4.jpg); background-size: cover; background-position: center; }

#room .room-in .room-caleander a { display: block; position: relative; width: 163px; height: 50px; margin: 65px auto 0px; text-align: center; }
#room .room-in .room-caleander a svg { position: absolute; top: 0; left: 0; }
#room .room-in .room-caleander a svg rect {fill: transparent; stroke: #c9ab81; transition: 2s; stroke-width: 2px; stroke-dashoffset: 240%; stroke-dasharray: 330% 25; }
#room .room-in .room-caleander a:hover svg rect { stroke-dashoffset: -113% !important; }
#room .room-in .room-caleander a span { position: absolute; display: block; height: 50px; width: 163px; font-family: 'Open Sans'; font-size: 13px; line-height: 50px; font-weight: 600; }

#pictrue { padding-top: 100px; }
#pictrue .picture-in img { width: 100%; }

.room_rprice table .head { background: #fafafa; }
.week_date .next { position: relative; z-index: 10; }
.week_date .prv { position: relative; z-index: 10; }
.week_date {  height: 60px; margin-top: 90px; }
.room_tit { display: none; }
.room_data { margin-top: 90px; }
.room_data li .data p { display: inline; }
.room_data li { display: flex; margin: 5px auto 0px; width: 100%; text-align: left; }
.room_data li .tit { width: 15%; font-family: 'Noto Sans KR'; font-size: 13px; line-height: 24px; font-weight: 600; }
.room_data li .data { width: 95%; font-size: 13px; line-height: 24px; }
.room_data li:nth-child(3) .data { float: none; }

#room_daily_price2 { width: 1200px; margin: 80px auto 0; }

.week_date .prv {
    position: relative;
    display: inline-block;
    margin-left: 30px;
    width: 30px;
    height: 30px;
    border: 1px solid #8c857a;
    cursor: pointer;
    *zoom: 1;
    background: none;

}

.week_date .prv::after {
    content: "";
    position: absolute;
    top: 10px;
    right: 14px;
    border-top: 10px solid transparent;
    border-right: 10px solid #8c857a;
    transform: rotate(-225deg) translate(-50%,-50%);
}


.week_date .next {
    position: relative;
    display: inline-block;
    margin-left: 30px;
    width: 30px;
    height: 30px;
    border: 1px solid #8c857a;
    cursor: pointer;
    *zoom: 1;
    background: none;

}

.week_date .next::after {
    content: "";
    position: absolute;
    top: 10px;
    right: 5px;
    border-top: 10px solid transparent;
    border-right: 10px solid #8c857a;
    transform: rotate(-45deg) translate(-50%,-50%);
}

.m_banner{display: none; width: 100%; height: 100%;transform:translateZ(2px);}
.m_img_array{display:none; width: calc(100% - 20px); height: auto; margin: 0 auto; margin-bottom: 40px; }
.m_img_array .m_img{height:auto; padding-bottom: 62.5%; background-size: cover; margin-bottom: 30px; transform: translateZ(2px); box-shadow: 0 1px 3px rgba(0,0,0,.15);backface-visibility: hidden;}
.m_img_array .m_img:last-child{margin-bottom: 0;}
.m_banner{ background: url(http://skylakep.cdn1.cafe24.com/sub2/image6.jpg) 50% no-repeat; background-size: cover; backface-visibility: hidden;}
.m_img_array .m_img1{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image2.jpg); }
.m_img_array .m_img2{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image3.jpg);}
.m_img_array .m_img3{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image4.jpg);}
.m_img_array .m_img4{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image5.jpg);}
.m_img_array .m_img5{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image6.jpg);}
.m_img_array .m_img6{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image7.jpg);}
.m_img_array .m_img7{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image8.jpg);}
.m_img_array .m_img8{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image9.jpg);}
.m_img_array .m_img9{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image10.jpg);}
.m_img_array .m_img10{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image11.jpg);}
.m_img_array .m_img11{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image12.jpg);}
.m_img_array .m_img12{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image13.jpg);}
.m_img_array .m_img13{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image14.jpg);}
.m_img_array .m_img14{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image15.jpg);}
.m_img_array .m_img15{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image16.jpg);}
.m_img_array .m_img16{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image17.jpg);}
.m_img_array .m_img17{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image18.jpg);}
.m_img_array .m_img18{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image19.jpg);}
.m_img_array .m_img19{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image20.jpg);}
.m_img_array .m_img20{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image21.jpg);}
.m_img_array .m_img21{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image22.jpg);}
.m_img_array .m_img22{background-image: url(http://skylakep.cdn1.cafe24.com/sub2/image23.jpg);}

#banner2{ padding:90px 0; }
#footer{ padding: 0px 2.36% 2.36%; }

@media screen and (min-width:1px) and (max-width:780px){
    #main{height: 60vh;}
    #main .sec1_slider{display: none;}
    .m_banner{display: block;}
    .main-bn-page{display: none;}
    .m_img_array{display:block; }
}


@media (max-width: 1300px) {
    
    #room_daily_price2 { width: 100%; padding: 0px 0px; }
    #room .room-in .room-wrap .room-flex .right .right-in .hours { padding-left:20px;}    
}

@media (max-width: 780px) { 
    #main > .txt{top: 65%;}
    #room { padding-top: 60px; }
    #room .room-in .room-wrap .room-flex { display: block; }

    #room .room-in .room-detail { display:none; }

    #room .room-in .room-caleander{ margin-top:80px; }
    
    #room .room-in .room-wrap .room-flex > .left { width: 100%; }
    #room .room-in .room-wrap .room-flex > .right { width: 100%; }
    #room .room-in .room-wrap .room-flex .right .right-in div h3 { margin-top: 40px; }
    #room .room-in .room-detail > div { margin-top: 60px; height: 420px; }
    #room .room-in .room-wrap .room-flex .right .right-in div p { margin-top: 5px; line-height: 22px; }
    
    #room .room-in .room-wrap .room-flex .right .right-in .hours { padding-left:0px;} 
    #pictrue { padding-bottom: 20px; }
    #pictrue .picture-in{display: none;}
    .room_data { margin-top: 40px; }
    .room_data li .data { display: block; }
    .week_date { margin-top: 60px;}
    .room_rprice table .rprice .sale { font-size: 13px; }

    #banner2{padding: 0px 0px 100px;}
}


@media (max-width: 500px) { 
    #main > .txt > .txt-in > h1{margin-left: 0;}
    #room .room-in .room-wrap .room-flex .right .right-in .hours { padding-left:14px;}
    .week_date .prv { margin-left: 0px; margin-right: 8px; }
    .week_date .next { margin-left: 8px; }
    #room { padding-top: 40px; }
    #room .room-in .room-wrap .room-flex .right .right-in div h3 {  font-size: 16px; }
    #room .room-in .room-wrap .room-flex .right .right-in div p { font-size: 12px; }
    #room .room-in .room-detail > div { margin-top: 50px; height: 500px; }
    #room .room-in .room-detail > div > div:nth-of-type(1) { height: 60%; }
    #room .room-in .room-detail > div > div:nth-of-type(2) { width: 49%; height: 29%; }
    #room .room-in .room-detail > div > div:nth-of-type(3) { width: 49%; height: 29%; top: 31%; }
    #room .room-in .room-detail > div > div:nth-of-type(4) { width: 100%; height: 38%; bottom: 0px; }
    #pictrue { padding-bottom: 0px; }
    .room_data li .tit  { font-size: 12px; }   
    .room_data li .data { font-size: 12px; }
    .room_data { margin-top: 30px; }
    .week_date p { font-size: 12px; }
}


@media (max-width: 480px) {
    #room .room-in .room-wrap .room-flex .right .right-in .hours { padding-left:10px; width: 38%;}
    #room .room-in .room-wrap .room-flex .right .right-in .preca { width: 62%; }
}



@media (max-width: 420px) {
    #room .room-in .room-wrap .room-flex .right .right-in .hours { padding-left:4px; width: 36%;}
    #room .room-in .room-wrap .room-flex .right .right-in .preca { width: 64%; }
    
    .room_data li .tit { width: 25%; }
    .room_data li .data p { font-size: 11px;  }
    
}