@charset "utf-8";
/* ============================================================
   転職ボイス 記事（ニュース・特集・先回り）とカテゴリ一覧の見た目
   tenshoku-voice/assets/article.css   2026-09-14（⑨記事の自動配信）
   ------------------------------------------------------------
   ⑪a（2026-09-15）＝白ベース＋4色（style.css の :root の変数を使う）
   ・黒 #111（見出し・表の見出し行・押せるもの）／リンクは青 #0057B7／面 #F5F5F5・#F7F7F7／白い箱は影 0 0 0 1px #E6E6E6／見出しの黄色のマーカーは style.css
   ・本文16px・行間1.7・大きい数字24px（スマホ20px）・細い線0（面と影で区切る）・角丸8px・ダークモード無し
   ・スマホで横スクロールしない（表は折り返す）・1カラムで縦積みしない（PC は行の中を横に・スマホも2列）
   ・style.css（②）の .tv-content の上に足すだけ。器の db.css は読まない
   ============================================================ */

/* ── 記事の頭 ── */
.tv-art__eye{margin:0 0 18px;border-radius:8px;overflow:hidden;background:var(--tv-soft)}
.tv-art__eye img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.tv-art__note{font-size:13px;color:var(--tv-sub);background:var(--tv-soft);border-radius:8px;padding:10px 14px;margin:0 0 18px}
.tv-content{line-height:1.7}
.tv-content p{margin:0 0 1.1em}
.tv-content a{color:var(--tv-link);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.tv-content h2{margin:2.2em 0 .8em;font-size:21px}
.tv-content h2:first-of-type{margin-top:.6em}
.tv-content strong{font-weight:800}

/* 目次（最初の h2 の前。3本以上のとき） */
.tv-toc{background:var(--tv-surface);border-radius:8px;padding:16px 20px 14px;margin:0 0 26px}
.tv-toc__t{font-size:14px;font-weight:800;color:var(--tv-ink);margin:0 0 6px}
.tv-toc__l{margin:0;padding:0 0 0 1.4em;display:grid;grid-template-columns:1fr 1fr;gap:4px 18px;font-size:14.5px;line-height:1.5}
.tv-toc__l li{margin:0;padding:2px 0}
.tv-toc__l a{color:var(--tv-ink);text-decoration:none}
.tv-toc__l a:hover{color:var(--tv-link);text-decoration:underline}

/* 表（画像にしない・線なし・1行おきの塗り分け。スマホでは折り返して横スクロールしない） */
.tv-tbl{margin:0 0 1.3em}
.tv-content .tv-tbl table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0 4px;font-size:15px;line-height:1.55;margin:0}
.tv-content .tv-tbl th,.tv-content .tv-tbl td{overflow-wrap:anywhere;word-break:break-word}
.tv-content .tv-tbl thead th{background:var(--tv-main);color:#fff;font-weight:800;padding:9px 10px;text-align:left}
.tv-content .tv-tbl thead th:first-child{border-radius:8px 0 0 8px}
.tv-content .tv-tbl thead th:last-child{border-radius:0 8px 8px 0}
.tv-content .tv-tbl tbody th{background:var(--tv-chip);color:var(--tv-ink);font-weight:800;padding:9px 10px;text-align:left}
.tv-content .tv-tbl td{background:var(--tv-soft);padding:9px 10px;vertical-align:top}
.tv-content .tv-tbl tbody tr:nth-child(even) td{background:var(--tv-surface)}
.tv-content .tv-tbl tbody tr:nth-child(even) th{background:#E0E0E0}
.tv-content .tv-tbl caption{caption-side:bottom;text-align:left;font-size:13px;color:var(--tv-sub);padding:6px 2px 0}

/* 図説（記事の本文に入れる画像）と実物の写真 */
.tv-content figure{margin:0 0 1.4em}
.tv-content figure img{display:block;width:100%;height:auto;border-radius:8px}
.tv-content figcaption{font-size:13px;color:var(--tv-sub);margin-top:6px;line-height:1.5}

/* FAQ の箱（Q は面・A は白） */
.tv-qa{background:var(--tv-surface);border-radius:8px;padding:6px 6px 6px;margin:0 0 12px}
.tv-qa__q{margin:0;padding:10px 14px 8px;font-size:16px;line-height:1.55}
.tv-qa__q strong{color:var(--tv-ink)}
.tv-qa__a{margin:0;background:#fff;border-radius:8px;padding:12px 14px;font-size:15.5px;line-height:1.7}

/* 出典の箱（この記事が見た一次情報） */
.tv-src{background:var(--tv-soft);border-radius:8px;padding:18px 20px 12px;margin:2em 0 0}
.tv-content .tv-src__h{font-size:16px;margin:0 0 8px}
.tv-content .tv-src__h::after{height:.4em}
.tv-src__l{margin:0;padding:0 0 0 1.3em;font-size:14px;line-height:1.6}
.tv-src__l li{margin:0 0 6px;overflow-wrap:anywhere}
.tv-src__d{display:inline-block;margin-left:8px;font-size:12px;color:var(--tv-sub);background:#fff;border-radius:999px;padding:1px 9px}

/* ── 記事の末尾：DB への導線 ── */
.tv-dbbox{background:var(--tv-surface);border-radius:8px;padding:22px 22px 14px;margin:34px 0 0}
.tv-dbbox__h{font-size:19px;font-weight:900;color:var(--tv-ink);margin:0 0 6px;display:table;position:relative;isolation:isolate}
.tv-dbbox__h::after{content:"";display:block;position:absolute;left:-.1em;right:-.1em;bottom:.06em;height:.42em;background:var(--tv-yellow);z-index:-1}
.tv-dbbox__lead{font-size:14px;color:var(--tv-sub);margin:0 0 14px;line-height:1.7}
.tv-dbbox__l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tv-dbbox__a{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;row-gap:2px;align-items:center;background:#fff;border-radius:8px;padding:12px 14px;color:var(--tv-ink);text-decoration:none;transition:transform .15s,background .15s;min-height:74px}
.tv-dbbox__a:hover{text-decoration:none;background:#FFF3B8;transform:translateY(-2px)}
.tv-dbbox__big{grid-row:1/3;font-size:26px;font-weight:700;font-family:var(--tv-num);color:var(--tv-link);line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.tv-dbbox__big i{font-style:normal;font-size:12px;color:var(--tv-sub);margin-left:2px;font-weight:700}
.tv-dbbox__arrow{font-size:22px}
.tv-dbbox__name{font-size:15px;font-weight:800;line-height:1.4}
.tv-dbbox__sub{font-size:12px;color:var(--tv-sub);line-height:1.4}

/* 同じカテゴリの新しい記事（3本・PC は横に3つ） */
.tv-rel{margin:26px 0 0}
.tv-rel__h{font-size:17px;font-weight:900;margin:0 0 10px}
.tv-rel__l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.tv-rel__a{display:grid;gap:8px;background:var(--tv-soft);border-radius:8px;padding:10px 10px 12px;color:var(--tv-ink);text-decoration:none;transition:transform .15s}
.tv-rel__a:hover{text-decoration:none;transform:translateY(-2px);background:#FFF3B8}
.tv-rel__img,.tv-rel__noimg{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px;background:var(--tv-chip)}
.tv-rel__t{font-size:14.5px;font-weight:800;line-height:1.5;color:var(--tv-ink)}
.tv-rel__d{font-size:12px;color:var(--tv-sub)}

/* ── カテゴリ一覧（category.php）＝1行1枚・行の中は 画像｜見出しと要約｜日付 の3列 ── */
.tv-cat__head{padding:14px 0 16px;margin:0 0 14px}
.tv-cat__title{font-size:30px;font-weight:900;margin:0;line-height:1.4;letter-spacing:.01em}
.tv-cat__lead{font-size:14px;color:var(--tv-sub);margin:6px 0 0;line-height:1.7}
.tv-cat__nav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.tv-cat__nav a{display:inline-block;font-size:14px;font-weight:800;background:var(--tv-soft);border-radius:999px;padding:8px 14px;color:var(--tv-ink);text-decoration:none}
.tv-cat__nav a.is-cur{background:var(--tv-main);color:#fff}
.tv-cat__nav a:hover{background:#FFF3B8;text-decoration:none}
.tv-cat__nav a.is-cur:hover{background:var(--tv-main)}
.tv-cards{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.tv-card{display:grid;grid-template-columns:220px 1fr auto;gap:0 18px;align-items:start;background:#fff;box-shadow:var(--tv-shadow);border-radius:8px;padding:12px 16px 12px 12px;color:var(--tv-ink);text-decoration:none;transition:transform .18s,box-shadow .18s}
.tv-card:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 0 0 1px var(--tv-line),0 10px 24px rgba(0,0,0,.08)}
.tv-card__img,.tv-card__noimg{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px;background:var(--tv-chip)}
.tv-card__body{min-width:0}
.tv-card__t{display:block;font-size:18px;font-weight:800;line-height:1.5;color:var(--tv-ink)}
.tv-card:hover .tv-card__t{color:var(--tv-link)}
.tv-card__x{display:block;font-size:14px;line-height:1.7;margin-top:6px;color:var(--tv-ink)}
.tv-card__meta{display:grid;gap:6px;justify-items:end;text-align:right;font-size:12.5px;color:var(--tv-sub);white-space:nowrap}
.tv-card__cat{display:inline-block;background:var(--tv-surface);border-radius:999px;padding:3px 10px;font-weight:800;color:var(--tv-ink)}
.tv-card__d{font-variant-numeric:tabular-nums}

/* ── スマホ ── */
@media (max-width:680px){
  .tv-art__eye{border-radius:8px;margin-bottom:14px}
  .tv-content h2{font-size:19px}
  .tv-toc__l{grid-template-columns:1fr;font-size:14px}
  .tv-content .tv-tbl table{font-size:13.5px}
  .tv-content .tv-tbl thead th,.tv-content .tv-tbl tbody th,.tv-content .tv-tbl td{padding:7px 6px}
  .tv-dbbox{padding:16px 14px 10px;border-radius:8px}
  .tv-dbbox__l{grid-template-columns:1fr 1fr;gap:8px}
  .tv-dbbox__a{padding:10px 10px;min-height:66px;column-gap:8px}
  .tv-dbbox__big{font-size:20px}
  .tv-dbbox__name{font-size:13.5px}
  .tv-dbbox__sub{font-size:11px}
  .tv-rel__l{grid-template-columns:1fr 1fr}
  .tv-rel__i:nth-child(3){display:none}
  .tv-card{grid-template-columns:118px 1fr;gap:6px 10px;padding:10px}
  .tv-card__t{font-size:15px}
  .tv-card__x{display:none}
  .tv-card__meta{grid-column:1/3;grid-auto-flow:column;justify-content:start;justify-items:start;text-align:left;gap:10px}
  .tv-cat__head{padding:8px 0 12px}
  .tv-cat__title{font-size:22px}
}