@charset "UTF-8";

#head {
  background: #4c5868;
}
.head-box {
  width: 1600px;
  margin: 0 auto;
  padding: 20px 10px;
}
.scroll-detail {
  position: relative;
  width: 1600px;
  margin: 0 auto 100px auto;
  padding: 0 2%;
}
.back-room {
  background-image: url(../images/room/back-room.png);
  background-size: 100% auto;
  background-position: top;
  background-repeat: no-repeat;
}
.main-concept {
  margin-bottom: 40px;
  padding-top: 100px;
}
.wave {
  margin-bottom: 40px;
}
.concept-text {
  margin-bottom: 200px;
  line-height: 3em;
}
.room-content {
  width: 22%;
  margin: 0 3% 80px 0;
}
.image {
  width: 100%;
  margin-bottom: 20px;
}
.image img {
  width: 100%;
}
.setsubi-box {
  padding: 80px 0;
  background: url(../images/room/wave-pattern.png) right top no-repeat;
}
h4::before {
  content: '';
  width: 2px;
  height: 16px;
  display: inline-block;
  margin-right: 10px;
  background-color: #fff;
}
h4 { color: #fff; }
table { margin-bottom: 0; }
table th, table td { padding: 2em; border: solid 1px #fff; }
table td p { margin-bottom: 2em; }

@media screen and (max-width:1600px) {
  .head-box {
    width: 100%;
  }
  .scroll-detail {
    width: 100%;
  }
}


@media screen and (max-width:1200px) {
}


@media screen and (max-width:1023px) { /* Tablet */
  .back-room {
    background-size: auto auto;
  }
}


@media screen and (max-width:959px) { /* SP */
  .bx-controls { display: none; }
  .room-content {
    width: 100%;
    margin: 0 0 80px 0;
  }
  .setsubi-box table th,
  .setsubi-box table td {
    display: block;
    width: 100%;
  }
}