/* ==========================================================================
   KHS FOODS 会社サイト 共通CSS（build2：ブラッシュアップ版）
   配色：紙 / 生成り / 朝の空 / 港の紺 / 海 / 薄鼠
   書体：Zen Kaku Gothic New（見出し 900・本文 400・リード 500）＋ Jost（欧文・数字）
   構造は余白と面の切り替えで伝える。罫線は会社概要の表と料金の枠だけ。
   ========================================================================== */

:root{
  --paper:#FBFBF8;
  --linen:#EFE9DE;
  --sky:#D9E8F0;
  --ink:#16263D;
  --sea:#2F6F8F;
  --slate:#4B586A;
  --rule:#CFD6DD;
  --jp:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",sans-serif;
  --geo:"Jost","Futura","Century Gothic",sans-serif;
  --wrap:1120px;
  --gutter:20px;
  --band:clamp(72px,9vw,112px);
}
@media (min-width:900px){:root{--gutter:56px}}

html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--jp);font-size:16px;font-weight:400;line-height:1.9;
  letter-spacing:.01em;-webkit-font-smoothing:antialiased;
}
img,video{max-width:100%}
picture{display:block;width:100%;height:100%}
a{color:var(--sea);text-decoration:underline;text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--sea);outline-offset:3px}
strong{font-weight:700;color:var(--ink)}
.nb{display:inline-block}

.pad{padding-inline:var(--gutter)}
.wrap{max-width:var(--wrap);margin-inline:auto}

/* ---- 文字の階層 ---- */
h1{font-weight:900;font-size:clamp(38px,6.5vw,72px);line-height:1.25;letter-spacing:-.02em;margin:0 0 26px;text-wrap:balance}
h2{font-weight:900;font-size:clamp(30px,4.6vw,48px);line-height:1.3;letter-spacing:-.015em;margin:0 0 28px;text-wrap:balance}
h3{font-weight:700;font-size:22px;line-height:1.45;margin:0 0 10px}
p{margin:0 0 14px}
.lead{font-size:clamp(17px,1.6vw,19px);font-weight:500;line-height:1.8;color:var(--ink);max-width:36em;margin:0 0 18px}
.sub{font-size:16px;color:var(--slate);max-width:40em}
.fine{font-size:13px;color:var(--slate);line-height:1.8;max-width:56em;margin:18px 0 0}
.label{font-size:14px;color:var(--slate);margin:0 0 6px}

/* ---- ヘッダー ---- */
.hd{background:var(--paper)}
.hd .row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;padding-block:18px}
.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none}
.brand:hover{text-decoration:none}
.brand .logo{width:28px;height:28px;object-fit:contain}
.brand .n{font-family:var(--geo);font-weight:500;font-size:14px;letter-spacing:.1em;line-height:1.2}
.brand .n small{display:block;font-family:var(--jp);font-weight:400;font-size:11.5px;letter-spacing:.02em;color:var(--slate);margin-top:3px}
.brand .mark{height:22px;width:auto}
nav{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:14px;flex-basis:100%}
nav a{color:var(--ink);text-decoration:none}
nav a:hover{text-decoration:underline}
@media (min-width:900px){nav{flex-basis:auto}}
.crumb{font-size:13px;color:var(--slate);white-space:nowrap}
.crumb a{color:var(--slate)}
@media (max-width:899px){.crumb{flex-basis:100%}}

/* ---- 帯（面の切り替え）---- */
.band{padding-block:var(--band)}
.band.linen{background:var(--linen)}
.band.sky{background:var(--sky)}
.band.tight{padding-block:clamp(48px,6vw,72px)}

/* ---- NOZOKU ワードマーク ---- */
.mark{display:inline-block;height:1em;width:auto;vertical-align:middle}
.with-mark{display:flex;align-items:center;gap:10px;margin:0 0 8px}
.with-mark .mark{height:18px}
.with-mark span{font-size:14px;color:var(--slate)}
.mark-lg{display:block;height:clamp(40px,6vw,64px);width:auto;margin:0 0 10px}

/* ---- 玄関：ヒーロー（横浜の映像を先頭に全幅。下端を紙の色にフェードさせ、見出しを重ねる。本人の希望）---- */
.hero{padding:0 0 clamp(40px,6vw,64px)}
.hero-media{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;background:var(--sky)}
@media (min-width:700px){.hero-media{aspect-ratio:16/8}}
@media (min-width:1100px){.hero-media{aspect-ratio:16/7}}
.hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(251,251,248,.96) 0%,rgba(251,251,248,.72) 22%,rgba(251,251,248,0) 52%)}
.hero-media .hero-logo{position:absolute;left:50%;top:44%;width:clamp(96px,12vw,150px);height:auto;transform:translate(-50%,-50%);pointer-events:none;z-index:1}
.hero-copy{position:relative;margin-top:-96px}
@media (min-width:700px){.hero-copy{margin-top:-140px}}
.hero h1{max-width:16em;margin-bottom:22px}
.hero .lead{margin-bottom:0}

/* ---- 玄関：3つの仕事 ---- */
.three{display:grid;grid-template-columns:1fr;gap:40px}
@media (min-width:820px){.three{grid-template-columns:repeat(3,1fr);gap:48px}}
.biz p{font-size:15px;color:var(--slate);line-height:1.85}
.biz a{font-size:15px}

/* ---- 玄関：考え方 ---- */
.principles{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:820px){.principles{grid-template-columns:repeat(3,1fr);gap:48px}}
.principles b{display:block;font-weight:700;font-size:20px;line-height:1.5;margin-bottom:8px}
.principles span{font-size:15px;color:var(--slate);line-height:1.85}

/* ---- 玄関：横浜から（映像を右端まで）---- */
.place{display:grid;grid-template-columns:1fr;gap:32px;align-items:center}
.place .txt{padding-inline:var(--gutter)}
.place .txt .lead{margin-bottom:0}
.place .win{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--sky)}
.place .win video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
@media (min-width:900px){
  .place{grid-template-columns:minmax(var(--gutter),1fr) minmax(0,520px) minmax(0,600px) minmax(0,1fr);gap:0 56px}
  .place .txt{grid-column:2;padding-inline:0}
  .place .win{grid-column:3/5}
}

/* ---- 玄関：つくる人 ---- */
.person{display:grid;grid-template-columns:1fr;gap:24px;align-items:start}
@media (min-width:760px){.person{grid-template-columns:220px 1fr;gap:48px}}
.face{aspect-ratio:4/5;background:var(--sky);overflow:hidden}
.face img{display:block;width:100%;height:100%;object-fit:cover}
.face img.is-missing{display:none}
.person .nm{font-weight:700;font-size:22px;margin:0 0 2px}
.person .rl{font-family:var(--geo);font-weight:500;font-size:13px;letter-spacing:.04em;color:var(--sea);margin:0 0 14px}
.person p{font-size:15.5px;color:var(--slate);max-width:36em}
.team-wrap{margin-top:clamp(44px,5vw,64px)}
.team{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:600px){.team{grid-template-columns:repeat(2,1fr);gap:24px 40px}}
@media (min-width:900px){.team{grid-template-columns:repeat(4,1fr);gap:40px}}
.team b{display:block;font-weight:700;font-size:17px;margin-bottom:4px}
.team span{font-size:14.5px;color:var(--slate);line-height:1.85}

/* ---- 会社概要の表（ここだけ罫線）---- */
.facts{margin:0;border-top:1px solid var(--rule)}
.facts>div{display:grid;grid-template-columns:1fr;gap:2px;padding-block:14px;border-bottom:1px solid var(--rule)}
@media (min-width:640px){.facts>div{grid-template-columns:150px 1fr;gap:24px;align-items:baseline}}
.facts dt{font-size:14px;color:var(--slate)}
.facts dd{margin:0;font-size:16px}
.facts dd .sub-link{display:inline-block;margin-left:14px;font-size:14px}

/* ---- 連絡先（朝の空の帯）---- */
.mail{font-family:var(--geo);font-weight:500;font-size:clamp(22px,3.4vw,34px);letter-spacing:.01em;color:var(--sea);display:inline-block;word-break:break-all;text-decoration-thickness:2px;text-underline-offset:.18em}

/* ---- フッター ---- */
footer{padding-block:32px 40px;font-size:13px;color:var(--slate)}
footer .links{display:flex;flex-wrap:wrap;gap:8px 22px;margin-bottom:14px;font-size:14px}
footer .links a{color:var(--ink);text-decoration:none}
footer .links a:hover{text-decoration:underline}
footer .row{display:flex;flex-wrap:wrap;gap:6px 28px;font-family:var(--geo);font-weight:400;font-size:13px;letter-spacing:.02em}

/* ---- のぞく採用：ヒーロー（朝の空）---- */
.hero-nz{padding-block:clamp(48px,6vw,88px)}
.hero-grid{display:grid;grid-template-columns:1fr;gap:40px;align-items:center}
@media (min-width:980px){.hero-grid{grid-template-columns:1fr .8fr;gap:64px}}
.hero-nz .svc-jp{font-weight:700;font-size:15px;letter-spacing:.06em;margin:0 0 20px}
.hero-nz h1{margin-bottom:22px}
.hero-nz h1 em{font-style:normal}
.hero-nz p.sub{margin:0}
.reels{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.reels figure{margin:0;position:relative;background:var(--paper);overflow:hidden}
.reels video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;background:var(--paper)}
.reels .cap{position:absolute;left:8px;bottom:8px;font-size:11px;letter-spacing:.02em;color:#fff;background:rgba(22,38,61,.6);padding:3px 7px}
@media (min-width:980px){.reels{gap:12px}.reels .r2{transform:translateY(22px)}}

/* ---- のぞく採用：型 ---- */
.kata{display:grid;grid-template-columns:1fr;gap:32px}
@media (min-width:820px){.kata{grid-template-columns:repeat(2,1fr);gap:40px 64px}}
.kata .nm{font-weight:700;font-size:24px;letter-spacing:.02em;margin:0 0 6px}
.kata .nm span{font-family:var(--geo);font-weight:500;font-size:14px;letter-spacing:.02em;color:var(--sea);margin-left:12px}
.kata p{margin:0 0 6px;font-size:15px;color:var(--slate);line-height:1.85}
.kata .ind{font-size:14px;color:var(--sea)}

/* ---- のぞく採用：成果 ---- */
.metrics{display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:720px){.metrics{grid-template-columns:repeat(3,1fr);gap:40px}}
.metric .tag{font-size:14px;font-weight:500;color:var(--slate);margin:0 0 8px}
.metric .big{font-family:var(--geo);font-weight:500;font-size:clamp(34px,4vw,48px);line-height:1.1;color:var(--sea);font-variant-numeric:tabular-nums;margin:0}
.metric .big small{font-size:.48em;font-weight:400;margin-left:2px}
.metric .note{font-size:14px;line-height:1.8;color:var(--slate);margin:10px 0 0;max-width:30em}

/* ---- のぞく採用：なぜ私たちか ---- */
.pillars{display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:840px){.pillars{grid-template-columns:repeat(3,1fr);gap:48px}}
.pillar p{font-size:15px;line-height:1.85;color:var(--slate);margin:0}

/* ---- のぞく採用：課題 ---- */
.compare{display:grid;grid-template-columns:1fr;gap:32px}
@media (min-width:800px){.compare{grid-template-columns:1fr 1fr;gap:64px}}
.col-h{font-size:15px;font-weight:700;margin:0 0 12px}
.col-a .col-h{color:var(--slate)}
.col-b .col-h{color:var(--sea)}
.compare ul{list-style:none;margin:0;padding:0}
.compare li{padding-block:8px;font-size:16px}
.col-a li{color:var(--slate)}
.col-b li{font-weight:700;font-size:18px}

/* ---- のぞく採用：対応範囲（工程は本当の順序なので番号を残す）---- */
.steps{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 32px}
.step{border:1px solid var(--rule);padding:8px 14px;font-size:14px;font-weight:500;display:flex;align-items:baseline;gap:8px;background:var(--paper)}
.step .n{font-family:var(--geo);font-weight:400;font-size:12px;color:var(--slate)}
.step.hot{border-color:var(--sea);color:var(--sea)}
.step.hot .n{color:var(--sea)}
.facts3{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:820px){.facts3{grid-template-columns:repeat(3,1fr);gap:48px}}
.facts3 .k{font-size:14px;color:var(--slate);margin:0 0 4px}
.facts3 .v{font-weight:700;font-size:18px;line-height:1.6;margin:0 0 6px}
.facts3 p{font-size:14.5px;line-height:1.85;color:var(--slate);margin:0}

/* ---- のぞく採用：料金（枠は残す。角なし・影なし）---- */
.plans{display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:820px){.plans{grid-template-columns:repeat(3,1fr)}}
.plan{border:1px solid var(--rule);padding:26px 24px;background:var(--paper)}
.plan.rec{border:2px solid var(--sea);padding:25px 23px}
.plan .badge{display:block;font-size:13px;font-weight:700;color:var(--sea);margin:0 0 6px}
.plan .nm{font-weight:700;font-size:18px;margin:0 0 2px}
.plan .qty{font-size:14px;color:var(--slate);margin:0 0 14px}
.plan .price{font-family:var(--geo);font-weight:500;font-size:clamp(26px,3.2vw,32px);font-variant-numeric:tabular-nums;margin:0 0 12px}
.plan .price small{font-size:.5em;font-weight:400;margin-left:2px}
.plan .inc{font-size:13.5px;line-height:1.8;color:var(--slate);margin:0}

/* ---- のぞく採用：自社での運用 ---- */
.own{display:grid;grid-template-columns:1fr;gap:28px;align-items:start}
@media (min-width:900px){.own{grid-template-columns:1fr 1fr;gap:64px}}
.own-nums{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 20px;margin-top:8px}
.own-nums .v{font-family:var(--geo);font-weight:500;font-size:clamp(22px,2.8vw,28px);line-height:1.1;color:var(--sea);margin:0;font-variant-numeric:tabular-nums}
.own-nums .v small{font-size:.55em;font-weight:400;margin-left:2px}
.own-nums .l{font-size:13.5px;line-height:1.7;color:var(--slate);margin:6px 0 0}
.grid4{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.grid4 figure{margin:0;aspect-ratio:1/1;overflow:hidden;background:var(--sky)}
.grid4 img{display:block;width:100%;height:100%;object-fit:cover}

/* ---- 制作実績 ---- */
.ph{padding-block:clamp(56px,8vw,104px) clamp(48px,6vw,72px)}
.ph .lead{margin-bottom:0}
.wk-tag{font-size:15px;color:var(--sea);margin:0 0 28px}
.wk-feature{display:grid;grid-template-columns:1fr;gap:28px;align-items:start}
@media (min-width:900px){.wk-feature{grid-template-columns:1fr .8fr;gap:56px;align-items:center}}
.wk-grid{display:grid;grid-template-columns:1fr;gap:44px 28px}
@media (min-width:640px){.wk-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:980px){.wk-grid{grid-template-columns:repeat(4,1fr)}}
@media (min-width:640px){.wk-item.span2{grid-column:span 2}}
.wk-item h2{font-size:22px;font-weight:700;letter-spacing:0;line-height:1.5;margin:0 0 4px}
.wk-item .wk-tag{margin:0}
.wk-frames{display:grid;grid-template-columns:1fr;gap:10px;margin:0 0 16px}
.wk-item.span2 .wk-frames{grid-template-columns:repeat(2,1fr)}
.wk-frames figure{margin:0;background:#fff;padding:12px;box-sizing:border-box}
.wk-frames img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain}
.wk-note{font-size:13px;color:var(--slate);line-height:1.8;margin:6px 0 0}

/* ---- 404 ---- */
.nf{min-height:48vh}

/* ---- ご相談（/soudan/）とお電話 ---- */
.sd-hero{padding-block:clamp(40px,6vw,80px)}
.sd-hero h1{font-size:clamp(36px,7vw,64px);margin:0 0 16px}
.flyer-thanks{font-weight:700;font-size:15px;color:var(--sea);margin:0 0 14px}
.tel{display:inline-flex;flex-direction:column;gap:2px;background:var(--ink);color:#fff;text-decoration:none;padding:16px 28px 18px;margin:6px 0 14px}
.tel:hover{text-decoration:none;background:#223a5c}
.tel .k{font-size:14px;font-weight:700;letter-spacing:.06em}
.tel .num{font-family:var(--geo);font-weight:600;font-size:clamp(32px,7vw,42px);line-height:1.1;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.tel-note{font-size:15px;line-height:1.8;color:var(--slate);max-width:32em;margin:0}
.sd-form{padding-block:clamp(48px,7vw,88px)}
.sd-form h2{font-size:clamp(28px,4.4vw,44px)}
form.sd{display:grid;gap:22px;max-width:560px;margin-top:8px}
.f{margin:0;padding:0;border:0;min-width:0}
.f label,.f .lab{display:block;font-weight:700;font-size:17px;line-height:1.5;margin:0 0 8px;padding:0}
.f .opt{font-weight:400;font-size:14px;color:var(--slate);margin-left:10px}
.f input[type=text],.f input[type=tel],.f textarea{box-sizing:border-box;width:100%;font:inherit;font-size:18px;line-height:1.5;color:var(--ink);background:#fff;border:1.5px solid var(--rule);border-radius:0;padding:14px 16px;-webkit-appearance:none;appearance:none}
.f textarea{resize:vertical}
.f input:focus,.f textarea:focus{border-color:var(--sea);outline:2px solid var(--sea);outline-offset:0}
.f ::placeholder{color:#8A96A5}
.times{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.times label{display:flex;align-items:center;gap:10px;font-weight:500;font-size:17px;margin:0;padding:12px 14px;background:#fff;border:1.5px solid var(--rule);cursor:pointer}
.times input{width:20px;height:20px;margin:0;accent-color:var(--sea)}
.times label:has(input:checked){border-color:var(--sea);background:var(--sky)}
.send{font:inherit;font-weight:700;font-size:19px;color:#fff;background:var(--sea);border:0;border-radius:0;padding:18px 20px;width:100%;cursor:pointer}
.send:hover{background:#285f7b}
.send:disabled{opacity:.6;cursor:default}
form.sd .fine{margin:0}
.msg{color:#A3342B;font-weight:700;font-size:16px;margin:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.done{max-width:560px;background:var(--sky);padding:26px 26px 16px}
.done:focus{outline:none}
.sd-more{margin:22px 0 0;font-size:16px}
.sd-call{margin:0 0 10px;font-size:17px;font-weight:700}

/* ---- のぞく採用ページ（2026-09-30 チラシ裏にそろえた手直し）---- */
/* 読む人は中高年の経営者が中心。本文を一回り大きく */
.p-nozoku,.p-soudan{font-size:17px}
.p-nozoku .fine,.p-soudan .fine{font-size:14px}
.p-nozoku .kata p,.p-nozoku .pillar p{font-size:16px}
.p-nozoku .metric .note,.p-nozoku .facts3 p{font-size:15.5px}
.p-nozoku .own-nums .l{font-size:14.5px}
.hero-call{margin-top:28px}
.hero-call .tel{margin:0 0 10px}
.hero-call .tel .num{font-size:clamp(28px,5vw,36px)}
/* 求人広告との比較 */
.vs{width:100%;max-width:880px;border-collapse:collapse;margin:8px 0 0;table-layout:fixed}
.vs th,.vs td{text-align:left;vertical-align:top;padding:14px 18px;font-size:17px;line-height:1.7}
.vs thead th{font-size:16px;font-weight:700;color:var(--slate);padding-block:16px;border-bottom:2px solid var(--ink)}
.vs thead th.us{font-size:18px;font-weight:900;color:var(--ink)}
.vs .us{background:var(--sky);color:var(--ink);font-weight:700}
.vs td{color:var(--slate);border-bottom:1px solid var(--rule)}
.vs .row-h th{font-size:14px;font-weight:700;color:var(--slate);padding:18px 18px 0;border:0;background:linear-gradient(90deg,transparent 50%,var(--sky) 50%)}
.vs .per{display:block;font-size:14px;font-weight:500}
.vs .yen{display:block;font-family:var(--jp);font-weight:900;font-size:clamp(24px,3.6vw,34px);line-height:1.3;letter-spacing:-.01em}
.vs td:not(.us) .yen{color:var(--slate)}
@media (max-width:560px){.vs th,.vs td{padding:12px 12px;font-size:16px}.vs .row-h th{padding:16px 12px 0}}
/* 最初の2か月 */
.flow{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:26px}
@media (min-width:820px){.flow{grid-template-columns:repeat(3,1fr);gap:10px}}
.flow .bar{display:block;font-weight:700;font-size:16px;color:#fff;background:var(--ink);padding:10px 16px}
.flow .ph2 .bar{background:var(--sea)}
.flow .ph3 .bar{background:#A9C1CE;color:var(--ink)}
.flow h3{font-size:21px;font-weight:900;margin:16px 0 6px}
.flow p{font-size:16px;line-height:1.85;color:var(--slate);margin:0;max-width:22em}
.flow-note{font-weight:700;font-size:17px;line-height:1.8;margin:30px 0 0;max-width:40em}
/* 実績（4件） */
@media (min-width:720px){.metrics.four{grid-template-columns:repeat(2,1fr);gap:36px 56px}}
@media (min-width:1100px){.metrics.four{grid-template-columns:repeat(4,1fr);gap:40px}}
.also{font-weight:700;font-size:17px;margin:34px 0 0}
/* 自社店舗の写真（縦 4:5） */
.grid4.tall figure{aspect-ratio:4/5}
.reels-note{font-size:13px;line-height:1.7;color:var(--slate);margin:14px 0 0}
@media (min-width:980px){.reels-note{margin-top:38px}}
/* 「私たちも、現場を持っています」と自社店舗をひとつの段落に */
.own-mt{margin-top:clamp(48px,6vw,72px)}
.own h3{font-size:clamp(22px,2.6vw,28px);font-weight:900;line-height:1.4;margin:0 0 14px}

/* ---- ノゾメ（2026-10-01：チラシと同じく、サイトにも登場。動きを減らす設定では止まる）---- */
.vs-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 20px;max-width:880px}
.vs-head{align-items:center}
.vs-head .lead{margin:0}
.nozome-side{display:block;flex:0 0 auto;width:clamp(96px,15vw,176px);height:auto;margin:0 0 4px}
.sd-head{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;max-width:640px}
.sd-head .lead{margin:0}
.contact-grid{display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:900px){.contact-grid{grid-template-columns:1fr 240px;align-items:end;gap:48px}}
.nozome-fig{margin:0;text-align:center;max-width:240px}
.nozome-fig img{display:block;width:clamp(140px,40vw,220px);height:auto;margin:0 auto 6px}
.nozome-fig figcaption .k{display:block;font-size:13px;color:var(--slate)}
.nozome-fig figcaption .n{display:block;font-size:16px;font-weight:700;color:var(--ink)}
@media (max-width:899px){.nozome-fig{margin:0 auto}}