@charset "utf-8";

/* mainBn */
#mainBn{ height: calc(100vh - 100px); display: flex; border-bottom: 1px solid #6a2f2b;}
#mainBn .subMainBnSwip{ width: 100%; height: 100%; display: flex;}
.subMainBnSwip .swiper-slide{ background: #6a2f2b; width: 50%;}
.swiper-button-next:after, .swiper-button-prev:after{ font-size: 36px !important;}
.mainBnNext.swiper-button-next{ margin-right: 0;}
/* .subMainBnSwip .swiper-slide:nth-child(3n){ background: #6a2f2b; width: 70%;} */
.subMainBnSwip .swiper-slide.mb1{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image1.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb2{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image2.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb3{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image3.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb4{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image4.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb5{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image5.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb6{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image6.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb7{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image7.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb8{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image8.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb9{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image9.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb10{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image10.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb11{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image11.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb12{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image12.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb13{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image13.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb14{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image14.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb15{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image15.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb16{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image16.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb17{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image17.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb18{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image18.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb19{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image19.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb20{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image20.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb21{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image21.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb22{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image22.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb23{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image23.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb24{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image24.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb25{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image25.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb26{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image26.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb27{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image27.jpg) no-repeat center/cover;}
.subMainBnSwip .swiper-slide.mb28{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image28.jpg) no-repeat center/cover;}
.subMainBnSwip .mainBnPage{ color: #fff;;}
.swiper-pagination-current, .swiper-pagination-total{color: #fff;}
.swiper-button-prev:after, .swiper-button-next:after{ color: #fff;}

#roomInfoWrap{ padding: 80px 60px; position: relative; display: flex; justify-content: space-between; align-items: center;}
#roomInfoWrap .roomDesignTxt{ writing-mode: vertical-lr; position: relative; padding: 20px 0; }
#roomInfoWrap .roomDesignTxt::after{ content:''; display: block; width: 1px; height: 100%; background-color: #6a2f2b; position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
#roomInfoWrap .roomDesignTxt p{ font-family: "Bodoni Moda", serif; font-size: 18px; color: #212529;}
#roomInfoWrap .roomInfoCon{ width: 100%; display: flex; justify-content: space-between; }
.roomInfoCon .infoCon:first-child{ width: 50%; padding: 0 30px;}
.roomInfoCon .infoCon:last-child{ width: 50%; padding: 0 0px 0 30px;}
.infoCon .roomImgR{ width: 100%; aspect-ratio: 1; background: url(http://emfd.cdn3.cafe24.com/sub2/1/image5.jpg) no-repeat center/cover; }
.infoCon h2{ font-family: "Bodoni Moda", serif; font-size: 36px; color: #6a2f2b; margin-bottom: 80px; }

.roomResBtn{ position: relative; left: 50%; transform: translateX(-50%); margin: 50px 0 0;  padding: 0 10px; display: inline-block; }
.roomResBtn::before{ content:''; display: block; width: 0%; height: 1px; background-color: #6a2f2b; position: absolute; top: 50%; left: 0; transition: all 0.3s ease-in-out;}
.roomResBtn:hover::before{ content:''; display: block; width: 100%; height: 1px; background-color: #6a2f2b; position: absolute; top: 50%; left: 0; }
.roomResBtn a{ display: block; font-size: 16px;  color: #6a2f2b;}

/* ROOM INFO */
.roomInfo{ margin-bottom: 50px; }
.roomInfo p{ font-size: 13px; margin-bottom: 10px;}
.roomInfo p span{ font-family: 'Paperlogy5'; font-size: 14px; color: #000; margin-right: 10px;}


/* 떠나요 연동 */
#room_des{ margin-bottom: 50px;}
.room_tit{ display: none;}
.room_data{ padding: 0;}
.room_data li{ display: flex; justify-content: flex-start; align-items: center; margin-bottom: 15px;}
.room_data li:nth-child(3){flex-direction: column; align-items: flex-start;}
.room_data li:nth-child(3) .data{ padding-left: 0; padding-top: 5px;}
.room_data li .tit{ display: inline-block; padding: 0; font-size: 15px;}
.room_data li .data{ display: inline-block; padding-left: 10px; font-size: 13px; padding-top: 0;}
.room_data li .data p{ display: inline-block; font-size: 13px;} 
.room_data li .data p::after{ content:'\00a0/\00a0';}
.room_data li .data p:last-child::after{ content:'\00a0';}
.room_data li .person_limit table{ display: none;}
.room_data li:last-child{ display: none;}

.room_rprice table .head{ background-color: #6a2f2b;}
.room_rprice table td{ border-bottom: 1px solid #6a2f2b; color: #fff;}
.room_rprice table .ss td{ color: #5e5e5e;}
.room_rprice table .state td{ background-color: #F5E0CB;}
.week_date{ margin-bottom: 10px;}
.room_rprice{ padding:  0;}


/* roomDetail */
#detailWrap{ padding: 80px 0px 0; border-top: 1px solid #6a2f2b; border-bottom: 1px solid #6a2f2b;}
#detailWrap .detailTit{ padding:  0 60px 40px; border-bottom: 1px solid #6a2f2b;}
.detailTit h2{ font-size: 48px; font-weight: 600; color: #6a2f2b;}
#detailWrap .dtConWrap{ padding: 0 60px; display: flex; justify-content: center; align-items: center;}
.dtConWrap .dtCon{ width: 25%; aspect-ratio: 9/16; border-left: 1px solid #6a2f2b; padding: 30px 20px; display: flex; justify-content: space-between; flex-direction: column;} 
.dtConWrap .dtCon:last-child{ border-left: 1px solid #6a2f2b; border-right: 1px solid #6a2f2b;} 
.dtCon h3{ font-size: 24px; font-weight: 600; color: #212529; }
.dtCon .dtConImg { width: 100%; aspect-ratio: 3/4; background: #6a2f2b;}
.dtCon:nth-child(even) .dtConImg{ aspect-ratio: 1;}
.dtCon .dtConImg.dt1{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image3.jpg) no-repeat center/cover;}
.dtCon .dtConImg.dt2{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image10.jpg) no-repeat center/cover;}
.dtCon .dtConImg.dt3{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image12.jpg) no-repeat center/cover;}
.dtCon .dtConImg.dt4{ background: url(http://emfd.cdn3.cafe24.com/sub2/1/image27.jpg) no-repeat center/cover;}


.roomsSwip .swiper-slide {
    border-left: 1px solid #F5E0CB;
    padding: 50px 50px 50px 50px;
    margin: 0;
}

/* 반응형 */
@media all and ( max-width: 1024px){
    #roomInfoWrap{ padding: 80px 30px;}
    #roomInfoWrap .roomInfoCon{ flex-direction: column-reverse;}
    .roomInfoCon .infoCon:first-child{ width: 100%; margin-top: 50px;}
    .roomInfoCon .infoCon:last-child{ width:  100%;}
    .infoCon .roomImgR{ aspect-ratio: 16/9;}

    #detailWrap{ padding: 50px 0 0;}
    #detailWrap .detailTit{ padding: 0 30px 20px;}
    #detailWrap .dtConWrap{ padding: 0 0px}
    
}

@media all and (max-width: 768px) {
    #mainBn{ height: 50vh;}
    #roomInfoWrap .roomDesignTxt{ display: none;}
    .roomInfoCon .infoCon:last-child{ padding: 0;}
    .roomInfoCon .infoCon:first-child{ padding: 0;}
    .infoCon h2{ margin-bottom: 30px;}

    .detailTit h2{ font-size: 36px;}
    .dtCon h3{ font-size: 18px;}
    .roomsSwip .swiper-slide{padding: 50px; border: none;}
    .mainBnNext.swiper-button-next:after{ font-size: 24px !important;}

    .roomInfo p:last-child span{ display: block;}
}

@media all and (max-width: 520px){
    .room_data li{ flex-direction: column; align-items: flex-start;}
    .room_data li .data{ padding-left: 0;}
    #roomInfoWrap{ padding: 40px 20px 80px;}
    .week_date p{ font-size: 12px; padding:  0 5px;}

    .roomResBtn{ margin: 30px 0 0;}
    .roomsSwip .swiper-slide{ padding: 50px 40px;}

    #detailWrap .dtConWrap{ flex-direction: column;}
    #detailWrap .detailTit{ padding: 0 20px 20px;}
    .dtConWrap .dtCon{ width:  100%; aspect-ratio: 4/3; border-left: 0; border-bottom: 1px solid #6a2f2b;}
    
    .dtCon .dtConImg{ aspect-ratio: 16/9;}
    .dtCon:nth-child(even) .dtConImg{ aspect-ratio: 16/9;}
    #detailWrap{ padding: 30px 0 0;}

    .room_data li .data p{ margin-top: 5px;}

    .dtCon h3{ font-size: 18px; margin-bottom: 20px;}

    .roomInfo p span{ display: block;}
}

@media all and (max-width: 320px){
    .week_date p{ font-size: 11px; padding:  0 2px;}
}