@charset "utf-8";
/* 기본설정 */
/* @import "default.css"; */
.roompre_slide{
    width: 100%;
    height: 75%;
    background: url('/html/images/roompre/01_01.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    /* margin-bottom: 7%; */
}
.slide-caption { 
  position: absolute;
  bottom: 50%;
  left: 50%;
  z-index: 5;
  transform: translate(-50%, -50%);
}
.slide-caption h2 {
  font-size: 39px;
  letter-spacing: 0.2em;
  line-height: 1.2;
  color: #fff ;
}
@media (max-width:768px) {
    .roompre_slide{
        width: 100%;
        height: 83.25vw;
        background: url('/html/images/roompre/m/01_01.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        position: relative;
    }
    .slide-caption h2 {
        display: none;
    }
}



section.room-preview {
    margin: 0 auto;
    padding: 100px 10.41vw 150px;
}

.room-preview .title {
    text-align: center;
    font-size: 80px;
    letter-spacing: 0.03em;
    margin: 0 auto 100px;
}

.room-preview .room-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 70px;
    row-gap: 150px;
}

.room-preview .room-item {
    text-align: center;
}

@media (min-width:1025px){
    .room-preview .room-item:nth-of-type(3n+2) {
        transition-delay: 0.3s !important;
    }
    .room-preview .room-item:nth-of-type(3n) {
        transition-delay: 0.6s !important;
    }
}




.room-preview .room-image {
    width: 100%;
    object-fit: cover;
    margin-bottom: 15px;
}

.room-preview .room-name {
    font-size: 32px;
    margin-bottom: 15px;
}

.room-preview .room-size {
    font-size: 15px;
}




@media (max-width:1024px) {
    .room-preview .title {
        font-size: 55px;
    }
    .room-preview .room-grid {
        grid-template-columns: repeat(1, 1fr);
        column-gap: 30px;
        row-gap: 50px;
    }
}

@media (max-width: 768px) {
    section.room-preview {
        padding: 70px 10vw;
    }

    .room-preview .title {
        font-size: 40px;
        margin-bottom: 70px;
    }

    .room-preview .room-name {
        font-size: 18px;
        margin-bottom: 8px;
    }

    .room-preview .room-size {
        font-size: 11px;
    }
}

@media (max-width:365px) {
    .room-preview .room-grid {
        column-gap: 20px;
    }
    .room-preview .title {
        font-size: 36px;
    }
    .room-preview .room-name {
        font-size: 16px;
    }
}





/* 배치도 영역 */

section.roompre-map {
    padding: 130px 10.41vw;
    background: url(/html/images/roompre/bg01.jpg) no-repeat center / cover;
    background-size: 100% auto;
}
.mapbox{
    width: 80%;
    margin: 0 auto;
    max-width: 1216px;
}

.mapbox h2 {
    font-size: 80px;
    letter-spacing: 0.03em;
    color: #fff;
    text-align: center;
    margin: 0 auto 90px;
}
.mapbox img{
    max-height: 500px;
}


@media(max-width:1024px) {
    .mapbox h2 {
        font-size: 55px;
        margin-bottom: 55px;
    }
}

@media(max-width:768px){
    


    section.roompre-map {
        padding: 40px 5vw;
        background: url(/html/images/roompre/m/bg01.jpg) no-repeat center / cover;
        background-size: 100% auto;
    }
    
    .mapbox {
        width: 100%;
    }
    .mapbox img {
        object-fit: cover;
    }
     .mapbox h2 {
        font-size: 40px;
        margin-bottom: 30px;
    }
    


}
@media(max-width:500px){
    
    
}