@charset "utf-8";

.story-con-img{ margin-top: 80px; position: relative; width: 1200px; height: 675px; background-color: #ccc; float: right; z-index: 1;}
.story-con-img .con-img-swip{ width: 100%; height: 100%;}

.story-con .more-btn a{ display: inline-block; writing-mode: vertical-lr; text-align: center; padding-bottom: 0;}
.story-con .more-btn a::before{ content: ''; writing-mode: vertical; position: absolute; right: -10px; top:0px; width: 1px; height: 0%;  opacity: 1; background-color: #9ba4aa; animation: scroll-d 2s infinite; }
.story-con .more-btn a:hover::after{ content:''; display: none; }

@keyframes scroll-d{
    0%{ height:0%; }
    100%{ height: 100%;}
}

.con-img-swip .s1{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image1.jpg) no-repeat center/cover; }
.con-img-swip .s2{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image2.jpg) no-repeat center/cover; }
.con-img-swip .s3{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image3.jpg) no-repeat center/cover; }
.con-img-swip .s4{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image4.jpg) no-repeat center/cover; }
.con-img-swip .s5{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image5.jpg) no-repeat center/cover; }
.con-img-swip .s6{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image6.jpg) no-repeat center/cover; }
.con-img-swip .s7{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image7.jpg) no-repeat center/cover; }
.con-img-swip .s8{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image8.jpg) no-repeat center/cover; }
.con-img-swip .s9{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image9.jpg) no-repeat center/cover; }
.con-img-swip .s10{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image10.jpg) no-repeat center/cover; }
.con-img-swip .s11{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image11.jpg) no-repeat center/cover; }
.con-img-swip .s12{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image12.jpg) no-repeat center/cover; }
.con-img-swip .s13{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image13.jpg) no-repeat center/cover; }
.con-img-swip .s14{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image14.jpg) no-repeat center/cover; }
.con-img-swip .s15{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image15.jpg) no-repeat center/cover; }
.con-img-swip .s16{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image16.jpg) no-repeat center/cover; }
.con-img-swip .s17{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image17.jpg) no-repeat center/cover; }
.con-img-swip .s18{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image18.jpg) no-repeat center/cover; }
.con-img-swip .s19{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image19.jpg) no-repeat center/cover; }
.con-img-swip .s20{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image20.jpg) no-repeat center/cover; }
.con-img-swip .s21{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image21.jpg) no-repeat center/cover; }
.con-img-swip .s22{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image22.jpg) no-repeat center/cover; }
.con-img-swip .s23{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image23.jpg) no-repeat center/cover; }
.con-img-swip .s24{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image24.jpg) no-repeat center/cover; }
.con-img-swip .s25{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image25.jpg) no-repeat center/cover; }
.con-img-swip .s26{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image26.jpg) no-repeat center/cover; }
.con-img-page{ position: absolute; z-index: 1; text-align: center; color: #fff !important;}
.con-img-prev{ position: absolute; top: 50%; left: 30px; transform: translateY(-50%); z-index: 1;}
.con-img-prev i{display: block; color: #fff; font-size: 30px; pointer-events: auto; cursor: pointer; }
.con-img-next{ position: absolute; top: 50%; right: 30px; transform: translateY(-50%); z-index: 1;}
.con-img-next i{display: block; color: #fff; font-size: 30px; pointer-events: auto; cursor: pointer;}

/* room-info */
.room-info{ width: 100%; margin-bottom: 150px;}
.room-info .info-in{ width: 1600px; margin: 0 auto; position: relative;}

.info-in .more-btn{ width:116px; margin: 60px auto;}
.info-in .more-btn a{ display: block; padding-bottom: 10px; color: #9ba4aa; text-align: center; width: auto;}
.info-in .more-btn{position: relative;}
.info-in .more-btn a:hover{ color: #000; }
.info-in .more-btn a::after{ content: ''; position: absolute; left: 0; bottom:0px; width: 0; height: 1.5px; margin: 5px 0 0; transition: all 0.3s ease-in-out; opacity: 0; background-color: #9ba4aa;}
.info-in .more-btn a:hover::after{ content:''; width:100%; opacity: 1; }

/* 떠나요 연동 css 변경 */
#room_des{ margin-bottom: 100px;}
.room_tit{ display: none;}
.room_data li .data p{ display: inline-block; text-align: center;}
.room_data li .data p::after{ content: '\00a0/\00a0';}
.room_data li .data p:last-child::after{content: ''; display: none;}
.room_data li .tit{ text-align: center; font-size: 15px !important; padding-top: 0 !important; margin-top: 20px;}
.room_data li .data{ display: block; width: auto; padding-left: 0 !important; padding-top: 0 !important; text-align: center; margin-top: 10px; font-size: 14px !important;}
.room_data li .person_limit table{ display: none};

/* detail2 */
.detail2{ width: 100%;}
.detail2 .detail2-in{ width: 1600px; margin: 0 auto 150px;}

.detail2-line{ display: flex; justify-content: space-between;}
.detail2-line .detail2-img{width: 50%;  aspect-ratio:1; object-fit: cover; background-color: yellow; overflow: hidden;}
.detail2-line .detail2-txt{ width: 50%; padding-left: 80px; padding-top: 66px;}
.detail2-line .detail2-txt .con-tit{position: relative;}
.detail2-line .detail2-txt .con-tit h2{font-size: 24px; font-weight: 400; color: #191919; text-align: left; line-height: 1.5em; margin-bottom: 66px; position: relative;}
.detail2-line .detail2-txt .con-tit h2::before{content: ''; display: inline-block; width: 80px; height: 2px; background-color: #ebeef0;position: absolute; top:11px; left:-80px;}
.detail2-line .detail2-txt p{ line-height: 1.5em;}

.detail2-line:nth-child(even){ flex-direction: row-reverse; align-items: flex-end;}
.detail2-line:nth-child(even) .detail2-img{ margin-top: -200px;}
.detail2-line:nth-child(even) .detail2-txt{ margin-bottom: 66px; margin-right: 80px;}
.detail2-line:nth-child(even) .detail2-txt .con-tit h2{ text-align: right;}
.detail2-line:nth-child(even) .detail2-txt .con-tit h2::before{ display: none;}
.detail2-line:nth-child(even) .detail2-txt .con-tit h2::after{content: ''; display: inline-block; width: 80px; height: 2px; background-color: #ebeef0;position: absolute; top:10px; right:-80px;}
.detail2-line:nth-child(even) .detail2-txt p{ text-align: right; font-size: 14px; line-height: 1.5em;}
.detail2-line:nth-child(odd){ margin-top: 50px;}

.detail2-line .detail2-img.s1{background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image2.jpg) no-repeat center/cover;}
/* .detail2-line .detail2-img.s2{background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image9.jpg) no-repeat center/cover;} */
.detail2-line .detail2-img.s3{background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image19.jpg) no-repeat center/cover;}
.detail2-line .detail2-img.s4{background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image24.jpg) no-repeat center/cover;}
/* .detail2-line .detail2-img.s5{background: url(http://yeongokrest.cdn1.cafe24.com/sub2/2/image1.jpg) no-repeat center/cover;} */


.img-swip .s1{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image10.jpg) no-repeat center/cover;}
.img-swip .s2{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image15.jpg) no-repeat center/cover;}

.img-swip{ width: 100%; height: 100%; position: relative;}
.detail-img-page{ position: absolute; z-index: 1; text-align: center; color: #fff !important;}
.detail-img-prev{ position: absolute; top: 50%; left: 30px; transform: translateY(-50%); z-index: 1;}
.detail-img-prev i{display: block; color: #fff; font-size: 30px; pointer-events: auto; cursor: pointer; }
.detail-img-next{ position: absolute; top: 50%; right: 30px; transform: translateY(-50%); z-index: 1;}
.detail-img-next i{display: block; color: #fff; font-size: 30px; pointer-events: auto; cursor: pointer;}



/* banner */
.banner{ background: url(http://yeongokrest.cdn1.cafe24.com/sub2/1/image14.jpg)no-repeat center/cover; margin-bottom: 0;}

/* --------------------------------------------------- 반응형웹 ------------------------------------------------------------ */
@media all and (max-width: 1600px){
    .room-info .info-in, .detail .detail-in, .detail2 .detail2-in{ width: 95%;}
    .detail2 .detail2-in{overflow-x: hidden;}
}
@media all and (max-width: 1024px){
    .story{ margin: 120px auto 80px;}

    .story-con-img{ float: none; width: 100%;}

    .detail2-line .detail2-txt{ padding-top: 33px;}
    .detail2-line .detail2-txt .con-tit h2{font-size: 20px; margin-bottom: 30px;}
    .detail2-line:nth-child(even) .detail2-img{ margin-top: -100px;}
    .detail2-line:nth-child(even) .detail2-txt{ margin-bottom: 33px;}

    .info-in .more-btn a{ color: #000; }
    .info-in .more-btn a::after{ content: ''; position: absolute; left: 0; bottom:0px; width: 100%; height: 1px; margin: 5px 0 0; transition: all 0.3s ease-in-out; opacity: 1; background-color: #9ba4aa;}

    /* .detail-col.con2 .detail-img{ margin-top: 100px;}
    .detail-col .detail-img{ margin-bottom: 100px;}
    .detail-col .con-txt h2{ font-size: 20px; margin-bottom: 30px;} */


}

@media all and (max-width: 768px){
    .story-con-img{ aspect-ratio:1; margin-top: 30px; height: auto;}
    .story-con .story-txt{ margin-top: 30px;}
    .story-con .more-btn{ display: none;}

    .room_rprice table tr :nth-child(6), .room_rprice table tr :nth-child(7){ display: none;}

    .detail2-line{ flex-direction: column; width: 100%;}
    .detail2-line .detail2-img{ width: 100%;aspect-ratio:4/3; }
    .detail2-line .detail2-txt{ padding-top: 50px;}
    .detail2-line:nth-child(even){flex-direction: column; align-items: flex-start;}
    .detail2-line:nth-child(even) .detail2-img{ margin-top: 80px;}
    .detail2-line:nth-child(even) .detail2-txt{ margin-top: 50px; width: 100%;}
    .detail2-line:nth-child(even) .detail2-txt p{ text-align: left;}
    .detail2-line:nth-child(even) .detail2-txt .con-tit h2{text-align: left;}
    .detail2-line:nth-child(even) .detail2-txt .con-tit h2::before{ display: block;}
    .detail2-line:nth-child(even) .detail2-txt .con-tit h2::after{display: none;}
    .detail2-line:nth-child(even) .detail2-txt{ margin-bottom: 0; margin-right: 0;}
    
}

@media all and (max-width: 500px){
    .story-tit h2{ font-size: 17px;}

    .detail2-line .detail2-txt{ padding-left: 30px;}
    .detail2-line .detail2-txt .con-tit h2::before{ width:30px; left: -30px;}
    .detail2-line .detail2-txt{ width: 92.5%;}
    .detail2-line .detail2-txt p{  line-height: 1.5em;}
    .detail2-line:nth-child(even) .detail2-txt{ margin-top:0; width: 92.5%;}
    .detail2-line .detail2-txt .con-tit h2{ font-size: 16px;}

    .banner{height: 450px;}

    .week_date p{ font-size: 14px !important; padding: 0 5px !important;}
    
}