.lower-mv--wrapper {
  aspect-ratio: 1920/1050;
}
@media screen and (max-width: 767px) {
  .lower-mv--wrapper {
    aspect-ratio: 39/40;
  }
}

.lower-width {
  position: relative;
  z-index: 2;
}

.intro-sec {
  background-color: #000;
  position: relative;
  overflow: hidden;
  margin-top: -1px;
}
.intro-sec::before {
  position: absolute;
  content: "";
  background: url("../img/room/floor-bg.svg") no-repeat;
  background-size: contain;
  width: 100%;
  aspect-ratio: 1920/1004;
  z-index: 0;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 767px) {
  .intro-sec::before {
    aspect-ratio: 330/532;
    -o-object-fit: cover;
       object-fit: cover;
    top: 50%;
    transform: translate(-50%, -50%) scale(150%);
  }
}

.intro-en {
  max-width: 150px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .intro-en {
    max-width: 100px;
  }
}

.intro-ttl {
  margin-top: 24px;
}
@media screen and (max-width: 767px) {
  .intro-ttl {
    margin-top: 16px;
  }
}

@media screen and (max-width: 767px) {
  .intro-inner {
    padding-bottom: 112px;
  }
}

.intro-cont {
  display: flex;
  max-width: 1088px;
  margin: 80px auto 0;
  gap: 5%;
}
@media screen and (max-width: 767px) {
  .intro-cont {
    flex-direction: column;
    gap: 40px;
    margin-top: 48px;
  }
}

.intro-list {
  display: flex;
  flex-direction: column;
  gap: 36px;
}
@media screen and (max-width: 767px) {
  .intro-list {
    margin-left: auto;
    margin-right: auto;
    width: 90%;
  }
}
.intro-list li {
  margin-right: 1.5em;
}
@media screen and (min-width: 1024px) {
  .intro-list li {
    margin-right: 2em;
  }
}
.intro-list li.wide {
  margin-right: 0;
}
.intro-list a {
  transition: 0.5s;
  display: flex;
}
@media screen and (min-width: 1024px) {
  .intro-list a:hover {
    opacity: 0.7;
  }
}

.room-banner {
  margin: 0 auto 40px;
  max-width: 500px;
}

@media screen and (max-width: 767px) {
  .title-en img {
    max-height: 11px;
  }
}