@charset "utf-8";
/* page-company.css — 会社概要(company.html)専用。site.css の後に読む */

/* 生産ラインの数: ライン名(明朝)と、右に「1 ライン」 */
.counts{list-style:none;border-top:1px solid var(--rule)}
.counts li{display:flex;align-items:baseline;justify-content:space-between;gap:8px 24px;padding:16px 0;border-bottom:1px solid var(--rule)}
.counts__name{font-family:var(--mincho);font-weight:700;font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.5;letter-spacing:.04em;font-feature-settings:"palt"}
.counts__name small{display:block;margin-top:2px;font-family:var(--sans);font-size:14px;font-weight:500;color:var(--ink-2);letter-spacing:.06em}
.counts__n{flex:none;font-size:14px;color:var(--ink-2);white-space:nowrap}
.counts__n b{font-family:var(--mincho);font-weight:600;font-size:26px;color:var(--navy);margin-right:.2em}

/* 主な生産工程(7 工程)。番号札はトップの工程図と同じ形。4 列×2 段(スマホは 2 列)で、左から右へ読む */
.flow-title{margin-top:44px;font-size:clamp(1.2rem,1.5vw,1.38rem);line-height:1.55}
.flow{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 24px;margin-top:14px;border-top:1px solid var(--rule)}
.flow li{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--rule);font-family:var(--mincho);font-weight:700;font-size:16.5px;letter-spacing:.04em;white-space:nowrap}
.flow__no{flex:none;display:inline-grid;place-items:center;width:25px;height:25px;border:1px solid var(--navy);background:var(--sheet);font-size:14.5px;line-height:1}

@media (max-width:599.98px){
  .flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
}