/* CSS Document */
/* 基本のレスポンシブテキスト */
.responsive-text {
  font-size: clamp(1rem, 2vw, 1.25rem);
  line-height: 1.6;
}
/* 大見出しに使える */
.responsive-heading {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: bold;
  line-height: 1.3;
}
/* 小さめの注釈などに使える */
.responsive-small {
  font-size: clamp(0.8rem, 1.5vw, 1rem);
  line-height: 1.4;
}
html, body {
  height: 100%;
  margin: 0;
}
.page-wrapper {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main {
  flex: 1;
}
table {
  width: 100%;
  word-break: break-word; /* 長い日本語も折り返す */
}
table thead th {
  position: sticky;
  top: 0;
  background-color: white;
  z-index: 2;
}
.table-responsive table td,
.table-responsive table th{
  white-space:nowrap !important; /* 折り返し禁止 */
}
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; /* iOSで慣性スクロール */
}
/*スマホ対策*/
/* ▼ サムネイル横スクロールをスマホ向けに調整 */
.gallery-thumb {
  width: 80px; /* 70px → 80pxにしてタップしやすく */
  cursor: pointer;
  flex: 0 0 auto;
}
/* サムネイル横スクロールのスクロールバー非表示（モバイルで快適） */
.d-flex.overflow-auto::-webkit-scrollbar {
  display: none;
}
.d-flex.overflow-auto {
  -ms-overflow-style: none; /* IE/Edge用 */
  scrollbar-width: none; /* Firefox用 */
}
/* ▼ カルーセル内画像の高さをスマホ画面に収める */
#carouselGallery .carousel-item img {
  object-fit: contain; /* 画像を切らずに収める */
  max-height: 80vh; /* 画面の8割くらいの高さまで */
}
/* ▼ モーダルをスマホで閉じやすくする（オプション） */
.modal .btn-close {
  padding: 1rem; /* タップ領域を広めに */
  transform: scale(1.2); /* 少し大きく見せる */
}