@charset "UTF-8";

/* =========================================
   Facility page (Node ID: pty0k) specific styles
   - 共通(ヘッダー / フッター / サブページタイトル等) は common.css
   ========================================= */


/* =========================================
   Facility section wrapper
   - 内側コンテンツ幅は .l-inner-sub (common.css) を使用
   ========================================= */
.facility {
  background: #FFFFFF;
}


/* =========================================
   Room card (Room_Reception / WaitingRoom / ExamRoom / TreatmentRoom)
   ========================================= */
.room {
  padding: 80px 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.room + .room {
  border-top: 1px solid #E0E0E0;
}

/* ---------- Info (title + description) ---------- */
.room__info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.room__title {
  margin: 0;
  font-family: var(--font-jp-sans);
  font-size: 24px;
  font-weight: 500;
  color: var(--color-heading);
  line-height: 1.4;
}
.room__desc {
  margin: 0;
  font-family: var(--font-jp-sans);
  font-size: 15px;
  font-weight: 400;
  color: #666666;
  line-height: 1.8;
}

/* ---------- Slides (2 image placeholders) ---------- */
.room__slides {
  display: flex;
  gap: 16px;
}
.room__image {
  flex: 1;
  min-width: 0;
  aspect-ratio: 16 / 9; /* 1440時に 462×260 が基準。任意の幅でも比率維持 */
  background: #DDDDDD;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.room__image-icon {
  width: 32px;
  height: 32px;
  color: #BBBBBB;
}


/* =========================================
   Responsive
   ========================================= */

/* Tab (820 - 1080) */
@media (max-width: 1080px) {
  .room {
    padding: 60px 0;
  }
}

/* narrow Tab (768 - 819) */
@media (max-width: 819px) {
  .room {
    padding: 50px 0;
  }
}

/* SP (〜 767) */
@media (max-width: 767px) {
  .room {
    padding: 40px 0;
    gap: 16px;
  }
  .room__title {
    font-size: 20px;
  }
  .room__desc {
    font-size: 14px;
    line-height: 1.7;
  }
  /* 画像2枚を縦積み */
  .room__slides {
    flex-direction: column;
    gap: 12px;
  }
}
