/* 宮城の限定正社員求人 2 ページ（job-miyagi.html／job-miyagi-startup.html）専用。
   色・線・角は site.css／v9.css の変数（--c-*）にそろえる。表は v9.css の .v9-table（スマホでは項目ごとに縦積み）を使う。
   他のページには読み込まない。 */

/* ---------- 冒頭の数字の帯 ---------- */
.gs-keys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 28px;padding:0}
.gs-key{background:#fff;border:1px solid var(--c-line);border-top:4px solid var(--c-main);border-radius:12px;padding:14px 16px;min-width:0}
.gs-key dt{font-size:12px;font-weight:700;color:var(--c-deeper);line-height:1.6}
.gs-key dd{margin:4px 0 0;font-size:14px;line-height:1.7;color:var(--c-ink)}
.gs-key dd b{display:block;font-family:var(--f-num);font-size:clamp(24px,3.2vw,32px);font-weight:700;line-height:1.2;color:var(--c-deep);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.gs-key dd b small{font-family:var(--f-jp);font-size:.5em;margin-left:2px;font-weight:700}
.gs-key dd span{display:block;font-size:12px;color:var(--c-ink2)}
.gs-key--hot{border-top-color:var(--c-orange)}
.gs-key--hot dd b{color:var(--c-orange-d)}
.gs-key--wide dd b{font-size:clamp(20px,2.4vw,26px)}

/* ---------- 見出し直下のキャッチと注記 ---------- */
.gs-catch{margin:14px 0 0;font-size:clamp(17px,2.2vw,22px);font-weight:800;line-height:1.7;color:var(--c-deeper)}
.gs-note{margin:8px 0 0;font-size:13px;line-height:1.8;color:var(--c-ink2)}
.gs-sub{margin:26px 0 10px;font-size:clamp(17px,1.9vw,20px);line-height:1.6;color:var(--c-deeper)}
.gs-lead{font-weight:700;color:#1d3c40}

/* ---------- 研修から成長までの順序（4 段） ---------- */
.gs-path{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0 8px;padding:0;list-style:none;counter-reset:gsp}
.gs-path li{position:relative;background:#fff;border:1px solid var(--c-line);border-radius:14px;padding:16px 16px 14px;counter-increment:gsp;min-width:0}
.gs-path li::before{content:counter(gsp);display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#fff;border:3px solid var(--c-main);color:var(--c-deeper);font-family:var(--f-num);font-weight:700;margin-bottom:8px}
.gs-path b{display:block;font-size:15px;line-height:1.6;color:#1d3c40}
.gs-path span{display:block;margin-top:4px;font-size:13px;line-height:1.75;color:var(--c-ink2)}
.gs-path li.is-goal{background:var(--c-tint);border-color:var(--c-main)}

/* ---------- 一覧（箇条書き）---------- */
.gs-list{margin:8px 0 0;padding-left:1.3em}
.gs-list li{margin:4px 0;line-height:1.8}

/* ---------- 年収モデルの表（数字を右寄せにそろえる）---------- */
.gs-num{font-family:var(--f-num);font-variant-numeric:tabular-nums;white-space:nowrap}
.gs-total{font-weight:800;color:var(--c-deep)}
.v9-table--model td.gs-num,.v9-table--model td.gs-total{text-align:right}
.v9-table--model thead th:nth-child(n+2){text-align:right}
.gs-cond{margin:12px 0 0;padding:14px 18px;background:var(--c-tint);border-radius:12px;font-size:13px;line-height:1.9;color:var(--c-ink)}
.gs-cond b{color:var(--c-deeper)}

@media (max-width:900px){
  .gs-path{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .gs-keys{grid-template-columns:1fr}
  .gs-path{grid-template-columns:1fr}
  .v9-table--model td.gs-num,.v9-table--model td.gs-total{text-align:left}
  .gs-num{white-space:normal}
}

/* ---------- 長いブロックを必ず表示する（2026-10-15 スマホ実機の不具合修正）----------
   site.js の出現判定は「ブロックの18%が画面に入ったら表示」。スマホでは給与・年収モデルの
   ブロックが画面の何倍も長く、18%に届かないため透明のまま残った。この2ページの本文ブロックは
   出現アニメなしで常に表示する（共通CSSは変えない）。 */
.js .gd-block[data-reveal]{opacity:1;transform:none;transition:none}