/* company-info-mod-05.css — ベースライン(自動読込・module-base.css前提)。編集せず上書きで調整。 */
@charset "UTF-8";

.mod_05_section .mod_05_title {
  color: var(--color-heading-ink);
}
/* 2026-08-28: オーナー指摘(tableがcolからはみ出ている)。
   table-layout:auto(既定)だと、7つの曜日列(各1文字)の最小幅ぶんに全体が引っ張られ、
   1列目(見出し/時間帯セル。「9:30～13:00」等の長い文字列)がわずか102px程度しか
   確保されず、表全体の幅(実測580px)がcol幅(490px@1280 / 366px@768)を超えてはみ出していた。
   骨格確定型のためDOM構造(table自体の位置・col内包)は変更せず、table-layout:fixed +
   列幅の明示配分でcol幅(100%)に収める。1列目は長い時間帯文字列のぶん広めに確保する。 */
.mod_05_section .table-schedule {
  table-layout: fixed;
  width: 100%;
}
.mod_05_section .table-schedule th:first-child,
.mod_05_section .table-schedule td:first-child {
  width: 25%; /* 2026-08-28(2): オーナー指摘(幅を縮めるとth側がtd側より大きくなりすぎる)。
    35%だとth:tdが約3.8倍差になり幅が狭いほど目立っていた。25%(td比 約2.3倍)に緩め、
    その代わり広い画面での「時間帯を1行に」は諦める(768px以下は元々2行だったため一貫性は保てる)。 */
}
.mod_05_section .table-schedule th:not(:first-child),
.mod_05_section .table-schedule td:not(:first-child) {
  width: calc(75% / 7); /* 残り75%を7列で均等に */
}
.mod_05_section .table-schedule th,
.mod_05_section .table-schedule td {
  padding: 0.6em 0.3em; /* 土台の1em(横)は8列には過大なため縮小 */
  word-break: break-word;
}
/* 2026-08-25: 土台 .lgx{font-family:Arial,…}(0,1,0) が common.css の body{font-family:var(--font-body)}
   (0,0,1) に詳細度で勝ち、フォントプリセットを振っても文字が1文字も変わらない罠がある
   (anti-patterns.md「土台の.lgx{font-family:Arial…}が…」/ company-info-comp-info 等で既出)。
   3スキン(typeA/B/C)共通のセレクタで明示して勝たせる。 */
.mod_05_section dl dt,
.mod_05_section dl dd,
.mod_05_section .table-schedule th,
.mod_05_section .table-schedule td {
  font-family: var(--font-body);
}
@media (min-width: 768px) {
  .mod_05_section dl {
    overflow-y: visible;
    max-height: none;
  }
  .mod_05_section dl dt {
    width: 100px;
    clear: left;
    float: left;
    margin: 0;
    padding: 0.5em 0;
  }
  .mod_05_section dl dd {
    margin: 0;
    padding: 0.5em 0 0.5em 0;
  }
  .mod_05_section dl dt + dd {
    padding-left: 120px;
  }
}
.mod_05_section.typeA .table-schedule tbody th {
  background: var(--color-primary);
  color: var(--color-on-primary);
}
.mod_05_section.typeB table tbody th {
  background: transparent;
  color: var(--color-text);
}
.mod_05_section.typeB table tr:not(:last-child) th, .mod_05_section.typeB table tr:not(:last-child) td {
  border: 0;
  border-bottom: 1px dotted var(--color-text-muted);
}
.mod_05_section.typeB table tr:last-child th, .mod_05_section.typeB table tr:last-child td {
  border: 0;
}
.mod_05_section.typeB table tr th, .mod_05_section.typeB table tr td {
  background: transparent;
}
.mod_05_section.typeB table tr th:not(:last-child), .mod_05_section.typeB table tr td:not(:last-child) {
  border-right: 1px dotted var(--color-text-muted);
}
.mod_05_section.typeC table th, .mod_05_section.typeC table td {
  background: var(--color-primary);
  color: var(--color-on-primary);
  border-color: #FFF;
}
/* ── 正規化追記(2026-07-19 ユーザー指摘: カラム名と内容の位置ずれ) ──
   float+clearのdt/ddはddが複数行になると行がずれる。gridで1行=dt+ddに確定。 */
@media (min-width: 768px) {
  /* 2026-08-28: オーナー指摘(dtが大きい)。9em(実測201.6px)は最長ラベル「サービス内容」
     (実測134.4px)に対して余裕がありすぎた。7em(156.8px)に縮め、dd側の表示幅を広げる。 */
  .mod_05_section dl { display: grid; grid-template-columns: 7em 1fr; column-gap: 1.5em; align-items: start; }
  .mod_05_section dl dt { float: none; clear: none; width: auto; }
  .mod_05_section dl dt + dd { padding-left: 0; }
  .mod_05_section dl dd { margin: 0; }
}