@charset "utf-8";

/*main banner* -----*/
.main-bn{position:relative;width:100%;height:580px;background-image:url(../img/main/image5.jpg);background-repeat:no-repeat;background-size:cover;background-position:center center;}
.main-bn-tit{position:absolute;top:auto;bottom:100px;left:50%;transform:translateX(-50%);text-align:center;}
.main-bn-tit>p{font-size:15px;font-weight:400;color:#fff;margin-bottom:10px;}
.main-bn-tit>h2{margin-bottom:0;font-family: 'Cormorant Garamond';font-size:65px;font-weight:500;color:#fff;text-shadow: 0px 0px 4px rgba(0,0,0,.3);}


.l-info { text-align: center; padding: 100px 0; }
.l-info .con-tit{margin-bottom:80px;text-align:center;}
.l-info .imgbox { width: 60%; aspect-ratio: 4/3; background: url('../img/layout.jpg') no-repeat center/cover; margin-bottom: 40px; margin: 0 auto; margin-bottom: 40px; }






#banner1 .banner1-in { height: 400px; background: url(../img/main/image12.jpg); background-size: cover; background-position: center; background-attachment: fixed; }

#room { padding-top: 160px; }
#room .room-in .room-wrap { display: flex; justify-content: space-between; }
#room .room-in .room-wrap .left { width: 45%; padding: 60px 0px 40px; }
#room .room-in .room-wrap .left h1 { font-family: 'Old Standard TT'; font-size: 47px; font-weight: 400; letter-spacing: 1; }
#room .room-in .room-wrap .left p { margin-top: 60px; font-size: 12px; line-height: 25px; }
#room .room-in .room-wrap .left h2 { margin-top: 70px; font-family: 'Old Standard TT'; font-size: 28px; font-weight: 400; letter-spacing: 1; }
#room .room-in .room-wrap .left p:nth-of-type(2) { margin-top: 20px; }
#room .room-in .room-wrap .right { width: 40%; background: url(http://atlpen2.cdn3.cafe24.com/sub2/1/image3.jpg); background-size: cover; background-position: center; }
 
#room .room-in .room-caleander .link { margin: 80px auto 0px; width: 162px; height: 55px; background: #44604b; text-align: center; border: 1px solid #44604b; transition: .3s; }
#room .room-in .room-caleander .link a { display: block; width: 100%; height: 100%; font-family: 'Mulish'; font-size: 11px; font-weight: 600; line-height: 55px; letter-spacing: 4; color: #fff; transition: .3s }
#room .room-in .room-caleander .link:hover { background: #fff; }
#room .room-in .room-caleander .link:hover a { color: #000; }

#detail { margin-top: 160px; }
#detail .detail-in { display: flex; flex-wrap: wrap; justify-content: space-between; }
#detail .detail-in div { width: 29%; }
#detail .detail-in div:nth-of-type(1) { height: 482px; background: url(http://atlpen2.cdn3.cafe24.com/sub2/1/image2.jpg); background-size: cover; background-position: center; }
#detail .detail-in div:nth-of-type(2) { height: 592px; background: url(http://atlpen2.cdn3.cafe24.com/sub2/1/image4.jpg); background-size: cover; background-position: center; }
#detail .detail-in div:nth-of-type(3) { height: 455px; background: url(http://atlpen2.cdn3.cafe24.com/sub2/1/image5.jpg); background-size: cover; background-position: center; }
#detail .detail-in div:nth-of-type(4) { margin-top: -30px; height: 482px; background: url(http://atlpen2.cdn3.cafe24.com/sub2/1/image6.jpg); background-size: cover; background-position: center; }
#detail .detail-in div:nth-of-type(5) { margin-top: 80px; height: 348px; background: url(http://atlpen2.cdn3.cafe24.com/sub2/1/image8.jpg); background-size: cover; background-position: center; }
#detail .detail-in div:nth-of-type(6) { margin-top: -57px; height: 494px; background: url(http://atlpen2.cdn3.cafe24.com/sub2/1/image10.jpg); background-size: cover; background-position: center; }

.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: 190px; }
.room_tit { display: none; }
.room_data { margin-top: 60px; }
.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: 12px; line-height: 24px; font-weight: 600; }
.room_data li .data { width: 85%; font-size: 12px; line-height: 24px; }
.room_data li:nth-child(3) .data { float: none; }

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

.week_date .prv {
    position: relative;
    display: inline-block;
    margin-left: 30px;
    width: 30px;
    height: 30px;
    border: 1px solid #b8b8b8;
    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 #b8b8b8;
    transform: rotate(-225deg) translate(-50%,-50%);
}


.week_date .next {
    position: relative;
    display: inline-block;
    margin-left: 30px;
    width: 30px;
    height: 30px;
    border: 1px solid #b8b8b8;
    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 #b8b8b8;
    transform: rotate(-45deg) translate(-50%,-50%);
}

#rooms { padding-bottom: 80px; border-bottom: 1px solid #ece8e5; }


@media (max-width: 1305px) {
    
    #room_daily_price2 { width: 100%; }
    #room .room-in .room-wrap .left { width: 45%; padding: 40px 0px 20px; }
    #room .room-in .room-wrap .right { width: 50%; }
    
    #detail .detail-in div { width: 31%; }
    #detail .detail-in div:nth-of-type(4) { margin-top: -75px; height: 482px; }
    #detail .detail-in div:nth-of-type(5) { margin-top: 35px; height: 348px; }
    #detail .detail-in div:nth-of-type(6) { margin-top: -102px; height: 494px; }
    
}

@media screen and (min-width:1px) and (max-width:1302px){
    /*banner*/
    .main-bn-txt h2{font-size:80px;line-height:90px;}
}


@media screen and (min-width:1px) and (max-width:1024px){

    /*banner*/
    .main-bn{height:40vh;}
    .main-bn-tit{bottom:50px;}
    .main-bn-tit>p{font-size:14px;}
    .main-bn-tit>h2{font-size:45px;line-height:45px;}


    .l-info .imgbox { width: calc(100% - 40px); margin: 0 20px 40px; }
    .l-info div p { padding: 0 20px; }

}

@media (max-width: 780px) { 

    /*banner*/
    .main-bn{ margin-top: 78px; height:30vh;}
    .main-bn-tit>h2{font-size:32px;line-height:32px;}
    .main-bn-tit>p{font-size:12px;}

    .l-info .con-tit{margin-bottom:50px;}

	
    #room { padding-top: 70px; }
    #room .room-in .room-wrap .left h1 { font-size: 32px; }
    #room .room-in .room-wrap .left p { margin-top: 20px; }
    #room .room-in .room-wrap .left p:nth-of-type(2) { margin-top: 10px; }
    #room .room-in .room-wrap .left h2 { margin-top: 40px; font-size: 24px; }
    #room .room-in .room-caleander .link { margin: 60px auto 0px; }
    #detail { margin-top: 100px; }
    #detail .detail-in div { width: 47%; }
    #detail .detail-in div:nth-of-type(1) { height: 322px; }
    #detail .detail-in div:nth-of-type(2) { height: 295px; }
    #detail .detail-in div:nth-of-type(3) { margin-top: 40px; height: 432px; }
    #detail .detail-in div:nth-of-type(4) { margin-top: 12px; height: 322px; }
    #detail .detail-in div:nth-of-type(5) { margin-top: 40px; height: 188px; }
    #detail .detail-in div:nth-of-type(6) { margin-top: -100px; height: 334px; }
    
    .room_data { margin-top: 40px; }
    .room_data li .tit { width: 20%; }
    .room_data li .data { display: block; width: 80%; }
    .week_date { margin-top: 60px;}
    .room_rprice table .rprice .sale { font-size: 13px; }

}


@media (max-width: 680px) {
    
    #room .room-in .room-wrap { flex-flow: column; }
    #room .room-in .room-wrap .left { width: 100%; padding: 0px; }
    #room .room-in .room-wrap .right { margin-top: 50px; width: 100%; height: 340px; }
    
    .room_data li .tit { width: 15%; }
    .room_data li .data { width: 85%; }
    
}

@media (max-width: 540px) { 

    .week_date .prv { margin-left: 0px; margin-right: 8px; }
    .week_date .next { margin-left: 8px; }

}


@media (max-width: 480px) {

    #room { padding-top: 50px; }
    #room .room-in .room-wrap .left h1 { font-size: 24px; }
    #room .room-in .room-wrap .left p { font-size: 11px; line-height: 22px; }
    #room .room-in .room-wrap .left h2 { font-size: 20px; }
    #room .room-in .room-wrap .right { margin-top: 40px; height: 240px; }
    #room .room-in .room-caleander .link { margin: 40px auto 0px; }
    #detail { margin-top: 40px; }
    #detail .detail-in div { margin-top: 10px !important; width: 100%; height: 240px !important; }
    
    .room_data li .tit  { font-size: 12px; }   
    .room_data li .data { font-size: 12px; }
    .room_data { margin-top: 20px; }
    .week_date { margin-top: 40px; }
    .week_date p { font-size: 12px; }
    .room_rprice { margin-top: 0px; }
    
}



@media (max-width: 420px) {
    
    .room_data li .tit { width: 25%; }
    .room_data li .data p { font-size: 11px;  }
    
}

