/* ──────────────────────────────────────────
   2. カバーセクション
──────────────────────────────────────────*/
.cover-section {
  position: relative;
  width: 100%;
  overflow: hidden;       /* はみ出し部分を隠す */
}

/* IMG をカバー表示 */
.cover-section .cover-image {
  width: 100%;
  height: 100%;
  object-fit: cover;      /* 背景と同じ「cover」動作 */
  object-position: center;
  display: block;         /* inline-block の余白を消す */
}

/* ──────────────────────────────────────────
   製品情報
──────────────────────────────────────────*/
/* Section subtitle */
.information-list .section-title {
  font-size: 1.25rem;
  margin-bottom: 1rem;
  font-weight: bold;
}

/* Responsive table wrapper */
.table-responsive {
  overflow-x: auto;
  /* モバイルでスムーススクロール */
  -webkit-overflow-scrolling: touch;
}

/* Table */
.product-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 600px; /* モバイルでもスクロール領域を確保 */
}

/* Header row */
.product-table thead th {
  background-color: var(--color-primary);
  border: 1px solid #ddd;
  color: #fff;
  font-weight: bold;
  padding: 0.75rem;
  text-align: center;
}
/* Body cells */
.product-table tbody td {
  padding: 0.75rem;
  border: 1px solid #ddd;
  vertical-align: middle;
}
/* First column body bg */
.product-table tbody tr td:first-child {
  background-color: #e0f2dc;
  width: 25%;
}
/* Middle column width */
.product-table tbody tr td:nth-child(2) {
  width: 50%;
}
/* Last column width */
.product-table tbody tr td:last-child {
  width: 25%;
}

/* 表面 */
.product-table.surface thead th {
  background-color: #31baa0;
}
.product-table.surface tbody tr td:first-child {
  background-color: #c3ebe3;
}

/* 土壌処理 */
.product-table.soil thead th {
  background-color: #e6b483;
}
.product-table.soil tbody tr td:first-child {
  background-color: #f6e1ce;
}

/* その他薬剤 */
.product-table.other thead th {
  background-color: var(--color-tertiary);
}
.product-table.other tbody tr td:first-child {
  background-color: #ffbebf;
}

/* その他薬剤 */
.product-table.machine thead th {
  background-color: #019eeb;
}
.product-table.machine tbody tr td:first-child {
  background-color: #a3dcf7;
}

/* ──────────────────────────────────────────
   製品情報(油性)
──────────────────────────────────────────*/
.oilpaint-section {
  background-color: var(--color-background-gray);
}

.oilpaint-section img {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .oilpaint-section .container {
    padding-bottom: 10px;
  }
  .product-detail li > div {
    margin-bottom: 10px;
  }
}
