@charset "UTF-8";
/* ===================================================================
CSS information

 file name  : rooms.css
 author     : Ability Consultant
 style info : 客室ページ専用スタイル
              ascend準拠：room-card / room-amenities
=================================================================== */
/* ===================================================================
SCSS information

 file name  : _settings.scss
 author     : Ability Consultant
 style info : 楽天「HOTEL GEOMETIQ Osaka Umeda」共通変数・mixin
=================================================================== */
/* -----------------------------------------------------------
	レイアウト
----------------------------------------------------------- */
/* -----------------------------------------------------------
	カラー（ascendから踏襲）
----------------------------------------------------------- */
/* -----------------------------------------------------------
	フォント
----------------------------------------------------------- */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  src: url("https://www.choice-hotels.jp/raku/hotelgeometiqosakaumeda/css/Montserrat-VariableFont_wght.ttf") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: 'Lulo Clean';
  src: url("https://www.choice-hotels.jp/raku/hotelgeometiqosakaumeda/css/FontsFree-Net-Lulo-Clean-W01-One-Bold.ttf") format("truetype");
  font-display: swap;
}
/* -----------------------------------------------------------
	mixin
----------------------------------------------------------- */
/* -----------------------------------------------------------
	客室カード一覧
----------------------------------------------------------- */
.rooms-list {
  max-width: 870px;
  margin: 0 auto;
}

.room-card {
  padding: 56px 0;
}
.room-card:first-child {
  padding-top: 16px;
}
.room-card:last-child {
  border-bottom: 0;
}
.room-card .header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 28px;
}
.room-card .title {
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #000000;
  flex-shrink: 0;
}
.room-card .title-en {
  display: block;
  font-family: "Lulo Clean", "Playfair Display", "Times New Roman", serif;
  font-size: 14px;
  color: #a6a6a6;
  letter-spacing: -0.02em;
  margin-top: 4px;
  font-weight: normal;
}
.room-card .line {
  flex: 1;
  height: 1px;
  background-color: #c8c8c8;
}
.room-card .content {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 0;
  margin: 0;
}
.room-card .gallery {
  display: table-cell;
  width: 60%;
  vertical-align: top;
}
.room-card .specs {
  display: table-cell;
  width: 40%;
  vertical-align: top;
}
.room-card .spec-list {
  width: 90%;
  margin-left: auto;
  border-top: 1px solid #e6e6e6;
}
.room-card .spec-list .item {
  display: table;
  width: 100%;
  border-bottom: 1px solid #e6e6e6;
}
.room-card .spec-list .label,
.room-card .spec-list .value {
  display: table-cell;
  padding: 14px 4px;
  font-size: 13px;
  letter-spacing: 0.08em;
  vertical-align: middle;
}
.room-card .spec-list .label {
  width: 40%;
  color: #808080;
  font-weight: 400;
}
.room-card .spec-list .value {
  color: #000000;
  font-weight: 500;
}
.room-card .button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 90%;
  margin-top: 22px;
  margin-left: auto;
  padding: 14px 16px;
  background-color: #000000;
  border-radius: 99px;
  color: #ffffff;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  font-size: 13px;
  letter-spacing: 0.08em;
}
.room-card .button-arrow {
  display: inline-block;
  font-size: 12px;
  line-height: 1;
}

.room-gallery__main img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: 2px;
}

/* -----------------------------------------------------------
	客室設備・アメニティ
----------------------------------------------------------- */
.room-amenities {
  background-color: #f5f5f5;
  padding: 56px 40px;
}
.room-amenities__content {
  max-width: 870px;
  margin: 0 auto;
}
.room-amenities__title {
  display: block;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  font-size: 24px;
  color: #262626;
  letter-spacing: -0.04em;
  text-align: center;
  margin-bottom: 2rem !important;
}
.room-amenities__row {
  display: table;
  width: 100%;
  border-top: 1px solid #d8d8d8;
}
.room-amenities__row:last-child {
  border-bottom: 1px solid #d8d8d8;
}
.room-amenities__label {
  display: table-cell;
  width: 28%;
  padding: 18px 16px;
  vertical-align: top;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.08em;
  color: #262626;
  background-color: #ffffff;
}
.room-amenities__detail {
  display: table-cell;
  width: 72%;
  margin-top: 2rem;
  padding: 18px 16px;
  vertical-align: top;
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: 0.04em;
  color: #404040;
}
