/* ===== PC ===== */
.roomlist-wrap.section {
  display: flex;
  align-items: stretch;
  padding-right: 0;
  background: url(/images/roomlist/bg01.jpg) no-repeat center center / cover;
}

.roomlist-left {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 80px 12.5vw 80px 40px;
  box-sizing: border-box;
}

.roomlist-arch {
  width: 100%;
  max-width: 290px;
  overflow: hidden;
  border-radius: 200px 200px 0 0;
  margin-bottom: 40px;
  transform: scale(1.3);
  opacity: 0.5;
  filter: blur(3px);
  box-shadow: 3px 3px 3px #333;
  transition: all 1.5s ease;
}

.roomlist-arch.active {
  transform: scale(1);
  opacity: 1;
  filter: blur(0);
  box-shadow: 3px 3px 3px #d5d5d5;
}
.roomlist-arch img {
  display: block;
  width: 100%;
}

.roomlist-title {
  font-size: 51px;
  margin: 0 0 20px;
}

.roomlist-desc {
  font-size: 17px;
  margin: 0 0 40px;
}



.roomlist-right {
  width: 47.39vw;
  max-width: 810px;
  height: 36.25vw;
  padding-top: 5vw;
  overflow: hidden;
}
.roomlist-right img, .roomlist-right video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* ===== Mobile (~768px 이하) ===== */
@media (max-width: 768px) {
  .roomlist-wrap {
    flex-direction: column;
  }
  .roomlist-wrap.section {
    background: url(/images/roomlist/m/bg01.jpg) 0% 0%;
    padding: 55px 0 110px;
  }

  .roomlist-left {
    width: 100%;
    padding: 0px 30px 60px 30px;
  }
  .roomlist-arch {
    margin-bottom: 30px;
    transform: scale(1.15);
  }

  .roomlist-right {
    width: 100%;
    height: 60vw;
    padding-top: 0;
  }

  .roomlist-right img, .roomlist-right video {
    max-width: 100%;
  }
  .roomlist-title {
    font-size: 35px;
    margin: 0 0 20px;
  }

  .roomlist-desc {
    font-size: 13px;
    margin: 0 0 20px;
  }
}