@charset "UTF-8";
/* ==========================================================
   株式会社タカネ電業 — 下層 41 頁（第2版の頁）を第3版の雑誌の組みに（2026-11-07 カヲル）
   なおさん（11/07）「ページのデザイン詰めて、全部完璧にパララックスなめらか、レイアウトスイス最高って感じの雑誌風レイアウトで」。
   読む順：assets/v3/d.css（トップと同じ字・色・格子・上の帯・メニュー・足元・動き。v3/wire/d.css の写し）→ この inner.css。
   ── 決まり（v3/揃えの決まり_2026-11-06.md を下層へ）──────────────────
   格子：12 列・列の間 --u（30px）。字の左は L1（1 列目）と L7（7 列目）の 2 本だけ。携帯は L1 の 1 本。
   縦：--u の倍数。段の上下 5u（携帯 3u）・頭の英字 → 現在地の行 2u・行 → 中身 1u・塊と塊 2u。
   字：12 / 16 / 20 / 48 / 80 の 5 段（携帯 12 / 16 / 18 / 30 / 40）。題と段の見出しは端末のゴシックの細字（300）、英字と数は Neue Haas。
   頁の扉：大きな英字の一語（210px・灰）→ 現在地の行（右の端に柱 TAKANE ELECTRIC）→ 題（L1）とリード（L7）→ 同じ章の頁の行 → 写真の窓。
   段の頭：墨 1px の線 → 番号と飾りの英字の行（12px）→ 1u → 見出し 48/60。左右 2 段は見出しが L1、中身が L7（字の上をそろえる）。
   一覧：項目名（12・灰）＋中身（16・墨）の 2 段まで。線は灰 1px、段の頭だけ墨。
   地：白（読み物の頁と同じ）。互い違いの段は --bg（#F1F4F7）。黄は使わない（札はトップと同じ墨）。
   下の土台（「第2版の部品」）は takane.css から下層で使う部品の行だけを写した物。値の変数は第3版に読み替えてある。
   ========================================================== */
:root{
  --navy:#151D27; --ink-2:#4A5562; --mute:#737D88; --line-d:rgba(21,29,39,.28);
  --blue:#0C74B4; --blue-d:#095C8F; --sky:#39B8F0; --sky-50:#F1F4F7; --sky-100:#E3E8ED; --paper:#F1F4F7; --white:#fff;
  --yellow:#39B8F0; --yellow-d:#0C74B4; --field:#8A949E; --error:#B3261E;
  --jp-h:var(--ja); --jp:var(--ja);
  --wrap:1600px; --col-gap:var(--u); --sec:calc(var(--u) * 5); --head-gap:calc(var(--u) * 2); --sh-fs:var(--f4); --lf:var(--f3);
  --ease:cubic-bezier(.22,.61,.36,1); --e-rise:cubic-bezier(.2,.6,.35,1);
  --op0:.18;--mv-txt:36px;--mv-pic:52px;--t-in:.85s;--pic-op:1.1s;--pic-mv:1.6s;--pic-rs:2.2s;
  --hz-t:1.6s;--hz-e:cubic-bezier(.33,0,.15,1);--hz-s:1.018;--hv-t:.5s;
  --hd2:72px;
}
@media (max-width:767px){:root{--sec:calc(var(--u) * 3);--head-gap:var(--u);--hd2:60px}}

/* ===== 第2版の部品（takane.css から写した土台。下の「第3版の組み」で上書きする） ===== */
/* 改行：文節の切れ目に <wbr> を入れてあり、ここの keep-all で語の途中では折り返さない */
p,li,dd,dt,h1,h2,h3,h4,figcaption,label{word-break:keep-all;overflow-wrap:break-word;line-break:strict}
p,li,dd{text-wrap:pretty}
h1,h2,h3,h4,.pgh__lead,.sh__lead,.lead2,.alead{text-wrap:balance}
.nb{display:inline-block}
.nw{white-space:nowrap}
.pc{display:inline}.sp{display:none}
@media (max-width:767px){.pc{display:none}.sp{display:inline}}
.em{color:var(--blue)}   /* 見出し・リードの中の要の語（1 文に 1 語まで） */
.num,.date,.tel,.en{font-family:var(--en);font-variant-numeric:lining-nums tabular-nums}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.wrap{width:100%;max-width:calc(var(--wrap) + var(--gut) * 2);margin:0 auto;padding:0 var(--gut)}

.arw{position:relative;display:inline-block;flex:none;width:18px;height:1px;background:currentColor;transition:width var(--hv-t) var(--out)}
.arw::after{content:"";position:absolute;right:0;top:0;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg);transform-origin:100% 0}
.ext{margin-left:.35em;font-size:12px}
.sh__row .tlink{flex:none}
/* 本文の中のリンク：青＋下線 */
.prose a:not(.tlink):not(.btn),.spec dd a:not(.tel),.access a:not(.tlink),.ul-p a{color:var(--blue);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .4s var(--ease),text-decoration-thickness .4s var(--ease)}
.spec dd a.tel{color:inherit;text-decoration:none}

/* ---------- 頭の次の欄：ひとこと＋数字 ---------- */
.sec{padding:var(--sec) 0}
.sec--paper{background:var(--paper)}
.sec:not(.sec--paper)+.sec:not(.sec--paper):not(.on-dark){padding-top:0}
.figs{grid-column:8/13;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--navy);align-self:start}
.fig{padding:26px 0 28px;border-bottom:1px solid var(--line)}
.fig:nth-child(odd){padding-right:24px}
.fig:nth-child(even){padding-left:24px;border-left:1px solid var(--line)}
.fig dt{font:500 14.5px/1.6 var(--jp-h);letter-spacing:.08em;color:var(--ink-2)}
.fig dd{margin:14px 0 0;color:var(--navy)}
.fig__v{display:flex;align-items:baseline;gap:6px}
.fig__n{font:300 clamp(40px,3.4vw,52px)/1 var(--en);font-stretch:125%;letter-spacing:-.01em;font-variant-numeric:lining-nums tabular-nums;color:var(--navy)}
.fig__u{font:500 16px/1 var(--jp-h);color:var(--navy)}
.figs__note{grid-column:1/-1;margin-top:14px}
.figs__note dd{margin:0;font-size:12.5px;line-height:1.8;color:var(--mute)}
/* 数字でみるタカネ電業（3 列。区切りは縦横の 1px、上に紺 1px。英字・棒・円の図はなし） */
.figs--3{grid-column:auto;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:0}
.figs--3 .fig{padding:32px 28px 36px;border-left:1px solid var(--line)}
.figs--3 .fig:nth-child(3n+1){padding-left:0;border-left:0}
.figs--3 .fig:nth-child(odd),.figs--3 .fig:nth-child(even){padding-right:28px}
.figs--3 .fig:nth-child(3n){padding-right:0}
.figs--3 .fig__n{font-size:clamp(48px,5vw,72px)}
.figs--3 .fig__u{font-size:16px}
.figs--3 .fig dd{margin-top:18px}
.fig__d{margin-top:14px;font-size:14.5px;line-height:1.8;color:var(--ink-2)}
.fig__l{margin-top:14px;font-size:14.5px;line-height:1.8;color:var(--ink-2)}
.fig__l li{display:block}
.fig__d .u{display:inline-block;max-width:100%;overflow-wrap:anywhere}
.fig dt .u{display:inline-block;max-width:100%}
@media (max-width:767px){.fig__d--stack .u{display:block}.fig__d--stack .dot{display:none}}
.fig__l--en{font-family:var(--en);font-stretch:112%;font-size:13.5px;letter-spacing:.06em}
.fig--wide{grid-column:span 2}
.fig__q .fig__d{min-width:0;overflow-wrap:anywhere}
.fig__three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;align-items:start}
.fig__q{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px}
.fig__q .fig__d{flex-basis:100%}
.figs--3 .figs__note{margin-top:20px}
@media (max-width:1023px){
  .figs--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .figs--3 .fig:nth-child(3n+1){padding-left:28px;border-left:1px solid var(--line)}
  .figs--3 .fig:nth-child(odd){padding-left:0;border-left:0}
  .figs--3 .fig:nth-child(3n){padding-right:28px}
  .figs--3 .fig:nth-child(even){padding-right:0}
  .figs--3 .fig--wide{grid-column:1/-1;padding-left:0;border-left:0;padding-right:0}
}
@media (max-width:767px){
  .figs--3 .fig{padding:24px 0 28px 16px}.figs--3 .fig:nth-child(odd){padding-left:0;padding-right:12px}.figs--3 .fig:nth-child(even){padding-left:16px}
  .figs--3 .fig__n{font-size:48px}.fig__three{column-gap:10px}.fig__three .fig__d{font-size:12.5px;line-height:1.6}
}

/* ---------- 欄の頭・左右 2 段・本文の組み ---------- */
.sh{display:block}
.sh__row{display:flex;justify-content:space-between;align-items:baseline;gap:24px}
.sh__h{font-size:var(--sh-fs);line-height:1.5;letter-spacing:.04em}
.wrap>.sh{border-top:1px solid var(--navy);padding-top:clamp(28px,2.5vw,36px)}
.sh__lead{margin-top:20px;max-width:34em;font:500 clamp(17px,1.4vw,20px)/2 var(--jp-h);letter-spacing:.06em;color:var(--ink-2)}
.sh__sub{margin-top:20px;max-width:30em;font-size:clamp(18px,1.6vw,22px);line-height:1.75;letter-spacing:.05em}
.sh__small{display:block;margin-top:.45em;font-size:max(.52em,12.5px);font-weight:500;line-height:1.7;letter-spacing:.06em;color:var(--ink-2)}
.sh__lead .em,.sh__sub .em{color:var(--blue)}
.body{margin-top:var(--head-gap)}
/* 左に見出し、右に中身（PC）。線は本文の幅いっぱいに 1 本。右の最初の行の字の頭を、左の見出しの字の頭にそろえる */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--col-gap);align-items:start}
.split::before{content:"";grid-column:1/-1;height:1px;background:var(--navy);margin-bottom:clamp(28px,2.5vw,36px)}
.split>.sh{position:sticky;top:120px;border-top:0;padding-top:0}
.split>.sh+*{margin-top:calc(var(--sh-fs) * .35)}
.split>.sh+*{margin-top:round(nearest,calc(var(--sh-fs) * .35),1px)}
.split>.sh+:is(.prose,.sh__lead,.stack){margin-top:calc(var(--sh-fs) * .35 - 7.3px)}
.split>.sh+:is(.prose,.sh__lead,.stack){margin-top:round(nearest,calc(var(--sh-fs) * .35 - 7.3px),1px)}
.split>.sh+.stack--pic{margin-top:calc(var(--sh-fs) * .35)}
.split>.sh+.stack--pic{margin-top:round(nearest,calc(var(--sh-fs) * .35),1px)}
.split>.sh+.stack--l{margin-top:calc(var(--sh-fs) * .35 - var(--lf) * .57)}
.split>.sh+.stack--l{margin-top:round(nearest,calc(var(--sh-fs) * .35 - var(--lf) * .57),1px)}
.split>.sh+.stack--h{margin-top:calc(var(--sh-fs) * .35 - 9.4px)}
.split>.sh+.stack--h{margin-top:round(nearest,calc(var(--sh-fs) * .35 - 9.4px),1px)}
.split>.sh+.quote{margin-top:calc(var(--sh-fs) * .35 - var(--qf) * .297)}
.split>.sh+.quote{margin-top:round(nearest,calc(var(--sh-fs) * .35 - var(--qf) * .297),1px)}
@media (max-width:1023px){.split{grid-template-columns:minmax(0,1fr)}.split>.sh{position:static;margin-bottom:var(--head-gap)}.split>.sh+*,.split>.sh+:is(.prose,.sh__lead,.stack,.stack--pic,.stack--h,.stack--l,.quote){margin-top:0}}
.prose{max-width:38em}
.prose p+p{margin-top:1.4em}
.prose .sign{margin-top:2em;font-family:var(--jp-h);font-weight:700;color:var(--navy);letter-spacing:.08em}
.prose__h{font-size:clamp(20px,1.8vw,26px);line-height:1.6;margin-bottom:1em;font-weight:700}
.prose__h2{font-size:clamp(17px,1.5vw,20px);line-height:1.6;margin:2.4em 0 .7em;padding-bottom:.6em;border-bottom:1px solid var(--line);font-weight:700}
.prose--doc{max-width:42em}
.prose--doc p{margin-top:0}
.ul-p{margin:.8em 0 0;list-style:disc;padding-left:1.4em}
.ul-p li{padding:2px 0}
.lead2{font:500 var(--lf)/2 var(--jp-h);letter-spacing:.06em;color:var(--ink)}
.stack{display:grid;grid-template-columns:minmax(0,1fr);row-gap:clamp(28px,3vw,44px);min-width:0}
.stack .pic{aspect-ratio:3/2}
.on-dark{background:var(--navy);color:#DCE6F0}

/* ---------- 写真・イラスト ---------- */
.pic{position:relative;overflow:hidden;background:var(--sky-100);margin:0;--rs:1.14}
.pic>picture,.pic>.pic__in{display:block;width:100%;height:100%;transition:scale var(--hz-t) var(--hz-e)}
.pic img{width:100%;height:100%;max-width:none;object-fit:cover;transform:translate3d(0,var(--py,0px),0) scale(var(--rs));will-change:transform}
.pic--still img{transform:none}
.stack .pic--orig{aspect-ratio:510/475;max-width:510px}
.pic--band{aspect-ratio:21/9}
.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--col-gap)}
.pair .pic{aspect-ratio:3/2}
.sec>.wrap>.pair{margin-top:var(--head-gap)}
@media (max-width:767px){.pic--band{aspect-ratio:4/3;margin-left:calc(var(--gut) * -1);margin-right:calc(var(--gut) * -1)}.pair{grid-template-columns:minmax(0,1fr)}}
/* 人のイラスト（社員さんの顔の写真の代わり。地は真っ白＝置く欄の地。枠・影・角丸なし。中で寄せない・視差なし） */
.il{margin:0;width:100%;aspect-ratio:var(--ar,4/5);background:var(--white)}
.il picture{display:block;width:100%;height:100%;transition:scale var(--hz-t) var(--hz-e)}
.il img{width:100%;height:100%;max-width:none;object-fit:cover}
.il--p{max-width:400px}
.il--sq{width:160px;max-width:100%}
.il--scene{max-width:560px}
.sec--paper .il,.sec--paper .il img{background:var(--paper)}
@media (max-width:767px){.il--sq{width:120px}}

/* ---------- お知らせ ---------- */
.news{border-top:1px solid var(--line)}
.news a{display:grid;grid-template-columns:120px 120px minmax(0,1fr) 28px;align-items:center;column-gap:24px;padding:22px 0;border-bottom:1px solid var(--line)}
.news .date{font-size:14px;font-weight:400;font-stretch:112%;letter-spacing:.04em;color:var(--blue);white-space:nowrap}
.news .cat{font:500 13px/1.4 var(--jp-h);letter-spacing:.06em;color:var(--mute)}
.news .ttl{font:500 16px/1.8 var(--jp-h);letter-spacing:.05em;color:var(--navy);transition:color var(--hv-t) var(--ease)}
.news .arw{justify-self:end;color:var(--navy)}
.news--top a{grid-template-columns:172px 112px minmax(0,1fr) 28px}
@media (max-width:1199px){
  .news a,.news--top a{grid-template-columns:auto minmax(0,1fr) 28px;grid-template-areas:"d c r" "t t r";row-gap:6px;column-gap:16px;padding:20px 0}
  .news .date{grid-area:d}.news .cat{grid-area:c}.news .ttl{grid-area:t}.news .arw{grid-area:r}
}
@media (max-width:767px){.news a,.news--top a{grid-template-columns:auto minmax(0,1fr)}.news .arw{display:none}.news .ttl{font-size:15.5px}}

/* ---------- 表・文字の一覧・実績 ---------- */
.spec{margin:0;border-top:1px solid var(--navy)}
.spec>div{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:var(--col-gap);padding:22px 0;border-bottom:1px solid var(--line)}
.spec dt{font:700 14.5px/1.9 var(--jp-h);letter-spacing:.08em;color:var(--navy);position:relative;top:var(--dy,0px)}
.spec dd{margin:0;font-size:16px;line-height:1.85}
.spec dd .sub{display:block;margin-top:2px;font-size:13px;color:var(--mute)}
.spec .tel{font-stretch:112%;letter-spacing:.04em}
@media (max-width:767px){.spec>div{grid-template-columns:minmax(0,1fr);padding:18px 0}.spec dt{font-size:13.5px;line-height:1.6;top:0}.spec dd{margin-top:6px}}
.tl{column-width:10em;column-gap:var(--col-gap);margin:0}
.tl li{break-inside:avoid;padding:10px 0;border-bottom:1px solid var(--line);font-size:15.5px;line-height:1.7}
.achv li{padding:10px 0;border-bottom:1px solid var(--line);font-size:15.5px;line-height:1.8}
.achv li:last-child{border-bottom:0}
.achv__c{font-family:var(--jp-h);font-weight:700;color:var(--navy)}
.achv__s{color:var(--line-d);margin:0 .15em}
.spec--biz dd{font-size:15.5px}
.spec--biz .tl li:last-child{border-bottom:0}
.map2 img{width:auto;max-width:100%;height:auto;border:1px solid var(--line)}
.area__h{font-size:15px;letter-spacing:.08em;margin-bottom:14px}
.area__g+.area__g{margin-top:22px}
.area__k{margin-bottom:6px;font:700 13.5px/1.7 var(--jp-h);color:var(--ink-2);letter-spacing:.08em}
.biz{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--col-gap);align-items:start}
@media (max-width:1023px){.biz{grid-template-columns:minmax(0,1fr);row-gap:var(--head-gap)}}
.biz__lead{font-size:clamp(20px,1.9vw,26px);line-height:1.65;letter-spacing:.05em;font-weight:500}
.biz__t p{margin-top:18px;font-size:16px;line-height:1.9;max-width:34em}
.sq4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--col-gap)}
.sq4 .pic{aspect-ratio:1/1}
@media (max-width:767px){.sq4{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}}

/* ---------- 沿革（年と細線だけ） ---------- */
.hist{margin:0;border-top:1px solid var(--navy)}
.hist>li{display:grid;grid-template-columns:160px minmax(0,1fr);column-gap:var(--col-gap);padding:24px 0;border-bottom:1px solid var(--line)}
.hist__y{line-height:1}
.hist__y .num{display:block;font:300 28px/1 var(--en);font-stretch:125%;letter-spacing:0;color:var(--navy)}
.hist__y small{display:block;margin-top:10px;font-size:12.5px;line-height:1.4;color:var(--mute);letter-spacing:.04em}
.hist__t{margin-top:-6px;font-size:16px;line-height:1.9}
.hist--3>li{grid-template-columns:160px minmax(0,6fr) minmax(0,5fr)}
.hist__tag{display:block;margin-top:8px;font:700 13px/1.5 var(--jp-h);letter-spacing:.06em;color:var(--ink-2)}
.hist__e{font:700 16px/1.9 var(--jp-h);color:var(--navy);letter-spacing:.04em}
.hist__e+.hist__e{margin-top:12px}
.hist__s{margin-top:10px;font-size:14px;color:var(--ink-2)}
.hist__s b{margin:0 2px 0 8px;font:300 22px/1 var(--en);font-stretch:125%;color:var(--navy)}
.hist__m{display:flex;align-items:center;gap:14px;margin-top:12px;font:400 13px/1.5 var(--en);font-stretch:112%;letter-spacing:.06em;color:var(--ink-2)}
.hist__m img{width:auto;height:auto;max-width:102px}
.hist__ph{width:min(100%,220px);aspect-ratio:3/2;margin-top:16px}
.hist__w{font-size:14.5px;line-height:1.85;color:var(--ink-2)}
.hist__wk{margin:0;font:700 12.5px/1.8 var(--jp-h);letter-spacing:.1em;color:var(--mute)}
.hist__wt{margin:2px 0 14px}
.hist--3 .hist__t{margin-top:-6px}
.sec--hist{content-visibility:auto;contain-intrinsic-size:auto 6000px}
@media (max-width:1023px){.hist>li,.hist--3>li{grid-template-columns:130px minmax(0,1fr)}.hist--3 .hist__w{grid-column:2;margin-top:16px}}
@media (max-width:767px){.hist>li,.hist--3>li{grid-template-columns:minmax(0,1fr);row-gap:10px;padding:20px 0}.hist__t,.hist--3 .hist__t{margin-top:0}.hist--3 .hist__w{grid-column:auto;margin-top:6px}.hist__y .num{font-size:24px}}

/* ---------- 企業理念・あいさつ・スタッフ ---------- */
.quote{--qf:clamp(30px,3.6vw,52px)}
.quote__big{font:500 var(--qf)/1.4 var(--jp-h);letter-spacing:.1em;color:var(--navy)}
.quote__t{margin-top:22px;max-width:30em;font-size:16px;line-height:1.9}
/* あいさつ：左に見出し・その下にイラスト（4:5）、右に文（署名は右寄せ）。1023px 以下は見出し → イラスト → 文 */
.split--msg{grid-template-rows:auto auto 1fr}
.split--msg>.sh{grid-column:1;grid-row:2}
.split--msg>.msg__t{grid-column:2;grid-row:2 / span 2}
.split--msg>.msg__pic{grid-column:1;grid-row:3;width:min(360px,100%);margin-top:var(--head-gap)}
.msg__t .sign{text-align:right}
@media (max-width:1023px){
  .split--msg{grid-template-rows:none}
  .split--msg>.sh,.split--msg>.msg__t,.split--msg>.msg__pic{grid-column:auto;grid-row:auto}
  .split--msg>.msg__pic{order:2;width:min(300px,80%);margin-top:0;margin-bottom:var(--head-gap)}
  .split--msg>.msg__t{order:3}
}
.staffs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(36px,4vw,56px) var(--col-gap)}
@media (max-width:1023px){.staffs{grid-template-columns:minmax(0,1fr)}}
.staff{display:grid;grid-template-columns:160px minmax(0,1fr);column-gap:24px;align-items:start;padding-top:26px;border-top:1px solid var(--line)}
.staff__r{font:700 12.5px/1.7 var(--jp-h);letter-spacing:.06em;color:var(--blue)}
.staff__n{margin-top:2px;font:500 17px/1.5 var(--en);font-stretch:125%;letter-spacing:.06em;color:var(--navy)}
.staff__t p:last-child{margin-top:10px;font-size:15px;line-height:1.9;color:var(--ink)}
@media (max-width:767px){.staff{grid-template-columns:120px minmax(0,1fr);column-gap:16px}.staff__n{font-size:15px}}
@media (max-width:359px){.staff{grid-template-columns:minmax(0,1fr);row-gap:14px}}
.grp{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--col-gap);align-items:center}
@media (max-width:767px){.grp{grid-template-columns:minmax(0,1fr);row-gap:28px}}

/* ---------- 弊社の 5 つの強み・先輩社員の声 ---------- */
.strs{border-top:1px solid var(--navy)}
.str{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--col-gap);align-items:center;padding:clamp(40px,4.5vw,64px) 0;border-bottom:1px solid var(--line)}
.str__n{font:300 clamp(44px,4.6vw,64px)/1 var(--en);font-stretch:125%;letter-spacing:-.01em;color:var(--navy)}
.str__h{margin-top:20px;font-size:clamp(20px,1.9vw,27px);line-height:1.65;letter-spacing:.05em;font-weight:500}
.str__t p:not(.str__n){margin-top:18px;font-size:16px;line-height:1.9;max-width:32em}
.str .pic{aspect-ratio:3/2}
@media (max-width:1023px){.str{grid-template-columns:minmax(0,1fr);row-gap:28px}.str .pic{margin:0 calc(var(--gut) * -1)}}
.sec--tight{padding-top:var(--head-gap);padding-bottom:0}
.sec.sec--figs{padding-top:var(--head-gap);padding-bottom:calc(var(--sec) * .6)}
.vintro{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--col-gap);align-items:end}
@media (max-width:1023px){.vintro{grid-template-columns:minmax(0,1fr);row-gap:28px}}
.vintro__n{margin-top:20px;font-size:clamp(28px,3vw,42px);line-height:1.4;letter-spacing:.06em}
.vintro__s{margin-top:8px;font:500 15px/1.8 var(--jp-h);color:var(--ink-2);letter-spacing:.08em}
.voice__tag{display:inline-block;font:700 13px/1.5 var(--jp-h);letter-spacing:.06em;color:var(--blue)}
.pswitch{display:flex;flex-wrap:wrap;gap:0 28px;margin-top:28px;padding-top:6px;border-top:1px solid var(--line)}
.pswitch a{position:relative;display:inline-flex;align-items:center;min-height:44px;font:700 14px/1.4 var(--jp-h);letter-spacing:.06em;color:var(--ink-2);transition:color var(--hv-t) var(--ease)}
.pswitch a[aria-current]{color:var(--navy);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px;pointer-events:none}
.qas{padding:clamp(64px,7vw,104px) 0 var(--sec)}
.qa+.qa{margin-top:clamp(64px,7vw,104px)}
@media (min-width:1024px){.split.split--sub>.sh+.stack{margin-top:round(nearest,calc(var(--sh-fs) * .35 - 8.3px),1px)}}   /* 募集要項のインターンシップ制度・トライアル雇用：左の見出し（行の頭に漢字がある）と右の本文の字の頭を、行の高さでそろえる（−1px） */
.split--q{--sh-fs:clamp(18px,1.4vw,20px)}
.sh--q .sh__h{font-size:var(--sh-fs);font-weight:700;line-height:1.7}
.sh__q{margin-bottom:6px;font:400 15px/1.4 var(--en);font-stretch:125%;letter-spacing:.1em;color:var(--blue)}
@media (min-width:1024px){.split--q>.sh--q+.stack{margin-top:calc(35.2px - .7vw);margin-top:round(nearest,calc(35.2px - .7vw),1px)}}   /* 左の「Q.01」の行の分。右の答えの一言の字の頭を、左の問いの字の頭に */
.alead{font:700 clamp(18px,1.6vw,22px)/1.75 var(--jp-h);letter-spacing:.04em;color:var(--navy)}
.prose .alead+p{margin-top:1.3em}
.voices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--col-gap)}
.voices--2{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,4vw,56px)}
@media (max-width:767px){.voices,.voices--2{grid-template-columns:minmax(0,1fr);gap:48px}}
.voice{display:block}
.voice__q{margin-top:12px;font-size:clamp(19px,1.6vw,22px);line-height:1.6;transition:color var(--hv-t) var(--ease)}
.voice__who{margin-top:10px;font-size:13.5px;color:var(--mute);letter-spacing:.06em}
.voice__b{padding-top:20px}
.entry{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px}
.entry__k{font:700 14.5px/1.6 var(--jp-h);letter-spacing:.08em;color:var(--navy);flex-basis:100%}
.entry__b{display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px}
@media (max-width:767px){.entry__b{flex-direction:column;align-items:stretch;width:100%;gap:8px}}

/* ---------- 電話の欄・フォーム ---------- */
.telbox{padding:0 0 clamp(36px,4vw,56px)}
.telbox__k{font:700 14.5px/1.6 var(--jp-h);letter-spacing:.08em;color:var(--navy)}
.telbox__n{display:inline-block;margin-top:6px;padding:2px 0;font:300 clamp(34px,4vw,40px)/1.2 var(--en);font-stretch:112%;letter-spacing:.03em;color:var(--navy);transition:color var(--hv-t) var(--ease)}
.telbox__h{margin-top:4px;font-size:13px;color:var(--mute)}
.wrap--form::before{content:"";display:block;height:1px;background:var(--navy);margin-bottom:clamp(28px,2.5vw,36px)}
.form{display:grid;row-gap:28px;max-width:760px}
.form__body{display:grid;row-gap:28px}
.form__body[hidden],.confirm[hidden],.form__errs[hidden]{display:none}
.f{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:var(--col-gap);align-items:start}
.f__l{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;padding-top:16px;font:700 14.5px/1.6 var(--jp-h);letter-spacing:.08em;color:var(--navy)}
.req{padding:2px 6px;background:var(--navy);color:var(--white);font:700 12px/1.5 var(--jp-h);letter-spacing:.06em}
.opt{font:500 12px/1.5 var(--jp-h);color:var(--mute)}
.f__c{min-width:0}
.f input[type=text],.f input[type=email],.f input[type=tel],.f textarea{display:block;width:100%;height:56px;padding:0 16px;border:1px solid var(--field);border-radius:0;background:var(--white);font:400 16px/1.5 var(--jp);letter-spacing:.03em;color:var(--ink);-webkit-appearance:none;appearance:none;transition:border-color var(--hv-t) var(--ease),background-color var(--hv-t) var(--ease)}
.f textarea{height:auto;min-height:168px;padding:14px 16px;resize:vertical}
.f input:focus,.f textarea:focus{background:var(--sky-50)}
.f input::placeholder,.f textarea::placeholder{color:#8392A3}
.f input[aria-invalid="true"],.f textarea[aria-invalid="true"]{border:2px solid var(--error);padding-left:15px}
.f__err{margin-top:8px;font:500 13.5px/1.7 var(--jp-h);letter-spacing:.04em;color:var(--error)}
.form__errs{padding:18px 20px;border:2px solid var(--error);background:var(--white);font-size:15px;line-height:1.8}
.form__errs:focus{outline-offset:4px}
.form__errs p{font:700 15px/1.7 var(--jp-h);color:var(--error)}
.form__errs ul{margin-top:6px;list-style:disc;padding-left:1.4em}
.form__errs a{color:var(--error);text-decoration:underline;text-underline-offset:3px}
.choice{display:flex;flex-wrap:wrap;gap:0 28px;padding-top:4px}
.choice label{display:flex;align-items:center;gap:10px;min-height:44px;font-size:16px;cursor:pointer}
.choice input{-webkit-appearance:none;appearance:none;flex:none;margin:0;width:22px;height:22px;border:1px solid var(--field);border-radius:50%;background:var(--white);transition:border-color var(--hv-t) var(--ease),background-color var(--hv-t) var(--ease),box-shadow var(--hv-t) var(--ease)}
.choice input:checked{border-color:var(--navy);background:var(--navy);box-shadow:inset 0 0 0 5px var(--white),inset 0 0 0 12px var(--navy)}
.form__send{display:flex;justify-content:flex-start;padding-left:calc(200px + var(--col-gap))}
.form__send--2{gap:16px;flex-wrap:wrap;padding-left:0}
.form__msg{margin:0;padding:14px 18px;border:1px solid var(--blue);background:var(--sky-50);font-size:15px;line-height:1.85}
.form__msg[hidden]{display:none}
.form__msg.is-ng{border:2px solid var(--error);background:var(--white);font-weight:500}
.form__ns{margin-top:20px;font-size:14px}
.confirm .spec{margin-bottom:28px}
.confirm .spec dd{white-space:pre-wrap;word-break:break-all}
@media (max-width:767px){.f{grid-template-columns:minmax(0,1fr)}.f__l{padding-top:0;margin-bottom:8px}.form__send{padding-left:0}.form__send .btn{width:100%}.form__send--2{flex-direction:column}}

/* ---------- 新着情報の記事 ---------- */
.post__meta{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 20px}
.post__meta .date{font:400 14px/1 var(--en);font-stretch:112%;letter-spacing:.04em;color:var(--blue)}
.cat{font:500 13px/1.4 var(--jp-h);letter-spacing:.06em;color:var(--mute);transition:color var(--hv-t) var(--ease)}
.post__h{margin-top:20px;max-width:30em;font-size:clamp(26px,2.6vw,38px);line-height:1.5;letter-spacing:.04em}
.post .prose:empty{display:none}
.gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--col-gap);margin-top:clamp(32px,4vw,56px)}
.gal__i{display:block;cursor:zoom-in}
.gal .pic{aspect-ratio:3/2}
.gal--4{grid-template-columns:repeat(3,minmax(0,1fr));max-width:880px}
.gal--4 .gal__i:first-child{grid-column:1/-1}
@media (max-width:767px){.gal{grid-template-columns:minmax(0,1fr)}.gal--4{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}}
.gal__i .pic>img,.vid .pic>img{transition:scale var(--hz-t) var(--hz-e)}
.vid{display:block;max-width:640px;margin-top:clamp(28px,3vw,40px)}
.vid .pic{aspect-ratio:16/9}
.vid .pic img{transform:none}
.pn{display:flex;justify-content:space-between;gap:24px;margin-top:clamp(48px,5vw,72px);padding-top:16px;border-top:1px solid var(--line)}
.pn a{display:inline-flex;align-items:center;min-height:44px;max-width:46%;font:500 14.5px/1.8 var(--jp-h);letter-spacing:.05em;transition:color var(--hv-t) var(--ease)}
.pn__n{text-align:right;margin-left:auto}
.post__back{margin-top:24px}
@media (max-width:767px){.pn{flex-direction:column;gap:0}.pn a{max-width:none}.pn__n{text-align:left;margin-left:0}}
.lbx{position:fixed;inset:0;z-index:150;display:grid;place-items:center;padding:24px;background:rgba(7,26,51,.92);opacity:0;transition:opacity .4s var(--ease);cursor:zoom-out}
.lbx.is-on{opacity:1}
.lbx img{max-width:min(94vw,1200px);max-height:88vh;width:auto;height:auto;box-shadow:0 8px 40px rgba(0,0,0,.35)}
.lbx__x{position:absolute;right:16px;top:16px;width:48px;height:48px;color:var(--white);font-size:28px;line-height:1;cursor:pointer}

/* ---------- サイトマップ ---------- */
.smap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:48px var(--col-gap)}
@media (max-width:1023px){.smap{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.smap{grid-template-columns:minmax(0,1fr);gap:36px}}
.smap__h{padding-bottom:12px;border-bottom:1px solid var(--navy);font-size:19px;letter-spacing:.06em;font-weight:700}
.smap__g li a{display:flex;align-items:center;min-height:44px;border-bottom:1px solid var(--line);font-size:15.5px;transition:color var(--hv-t) var(--ease)}

/* ---------- 地図・アクセス（Google マップは押してから読み込む） ---------- */
.access{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--col-gap);align-items:start}
/* 地図：OpenStreetMap から作った自前の地図（assets/map/ の map.css・map.js。~/Desktop/dekidesign-map の light の型） */
.map.ddmap{margin:0;--ddmap-ink:var(--ink-2);--ddmap-mute:var(--mute);--ddmap-line:var(--line-d)}
.map .ddmap__frame{border:1px solid var(--line)}
.access__c .spec dt{top:0}
.access__l{margin-top:12px}
.pair+.access{margin-top:var(--col-gap)}
@media (max-width:1023px){.access{grid-template-columns:minmax(0,1fr)}}
@media (max-width:767px){.map{min-height:300px}.map__ph .btn{width:auto;height:auto;min-height:56px;padding:12px 20px;gap:12px;line-height:1.5;text-align:left}}

/* ==========================================================
   動き（出現・視差・奥行き・横並びのずらし。値は共通の決まり）
   ========================================================== */
.rv{opacity:var(--op0);transform:translate3d(0,var(--mv-txt),0);transition:opacity var(--t-in) var(--out),transform var(--t-in) var(--out),color var(--hv-t) var(--ease),background-color var(--hv-t) var(--ease),border-color var(--hv-t) var(--ease)}
.rv.is-in{opacity:1;transform:none}
/* 写真・イラスト：ほぼ透明（0.04）から、立ち上がりの速い曲線で。写真は中で 1.17 → 1.14 倍へ落ち着く */
.pic.rv,.il.rv{opacity:.04;transform:translate3d(0,var(--mv-pic),0);--rs:1.17;transition:opacity var(--pic-op) var(--e-rise),transform var(--pic-mv) var(--ease)}
.pic.rv img{transition:--rs var(--pic-rs) var(--ease)}
.pic.rv.is-in,.il.rv.is-in{opacity:1;transform:none;--rs:1.14}
/* トップの手元の正方形：写真と同じ出方（ほぼ透明から、52px 上がる） */
@property --rs{syntax:"<number>";inherits:true;initial-value:1.14}
.rv.has-ln{opacity:1;transform:none;transition:none}   /* 入れ物は動かさない。出るのは中の行（.ln-u）だけ。transition:none は、has-ln が付いた瞬間に入れ物が 0.18→1・36px→0 と動くのを防ぐ */
/* 仕込みの間だけ（main.js が has-ln・rv・ln-u を付ける数ミリ秒）：付けた瞬間の 1→0.18 などの動きを起こさない */
html.rv-setup .rv,html.rv-setup .rv *{transition:none !important}
.rv.has-ln .ln-u{opacity:var(--op0);transform:translate3d(0,var(--mv-txt),0);
  transition:opacity var(--t-in) var(--out) calc(var(--sd,0s) + var(--li,0) * .07s),transform var(--t-in) var(--out) calc(var(--sd,0s) + var(--li,0) * .07s),color var(--hv-t) var(--ease),background-color var(--hv-t) var(--ease),border-color var(--hv-t) var(--ease)}
.rv.has-ln.is-in .ln-u{opacity:1;transform:none}
/* ---------- 触れたとき（指で触る端末では出さない。押せる所だけ） ---------- */
@media (hover:hover){
  .btn--entry:hover{background:var(--yellow-d)}
  .btn:not(.btn--entry):not(.btn--line):not(.btn--w):hover{background:var(--blue)}
  .btn--line:hover{background:var(--sky-50);border-color:var(--blue);color:var(--blue)}
  .btn--w:hover{border-color:var(--white)}
  .btn:hover .arw,.tlink:hover .arw,a:hover>.arw{width:28px}
  .tlink:hover,.voice:hover .voice__q,.news a:hover .ttl,.pn a:hover,.crumb a:hover,.cat:hover,.smap__g li a:hover,.tabs a:not([aria-current]):hover,.pswitch a:not([aria-current]):hover{color:var(--blue)}
  .on-dark .tlink:hover{color:var(--white)}
  .tabs a:hover::after{transform:scaleX(1)}
  .tabs a:not([aria-current]):hover::after{background:var(--blue)}
  .prose a:not(.tlink):not(.btn):hover,.spec dd a:not(.tel):hover,.access a:not(.tlink):hover,.ul-p a:hover{color:var(--blue-d);text-decoration-thickness:2px}
.voice:hover .il picture,.gal__i:hover .pic>picture,.gal__i:hover .pic>img,.vid:hover .pic>img{scale:var(--hz-s)}
  .f input:not(:focus):not([aria-invalid]):hover,.f textarea:not(:focus):not([aria-invalid]):hover{border-color:var(--blue)}
  .choice label:hover input:not(:checked){border-color:var(--blue)}
  .telbox__n:hover{color:var(--blue)}
}
.hist__ph img{transform:none}

/* 動きを減らす設定：出現・視差・奥行き・寄り・ループ・ページの移りをすべて止め、最初から出す */
@media (prefers-reduced-motion:reduce){
  .rv,.pic.rv,.il.rv,.rv.has-ln .ln-u{opacity:1 !important;transform:none !important;transition:none !important}
  .pic img{transform:none !important;transition:none !important}
  .pgh__pic img{opacity:1;scale:1;translate:none;transition:none}
  .pic>picture,.pic>.pic__in,.il picture,.gal__i .pic>img,.vid .pic>img{transition:none}
  .hd{transition:none}
}

/* Windows のハイコントラスト：ボタンの枠・フォーカスが見える */
@media (forced-colors:active){
  .btn,.btn--entry{border:1px solid ButtonText}
  :focus-visible{outline:3px solid Highlight;box-shadow:none}
  .arw,.arw::after{background:ButtonText;border-color:ButtonText}
}

/* 印刷（会社概要・ヒストリー・募集要項・数字でみるを A4 で綴じても読める） */
@media print{
  .hd,.skip,.map__ph{display:none !important}
  body{font-size:10.5pt;line-height:1.7;color:#000;background:#fff}
  main a[href^="http"]::after{content:"（" attr(href) "）";font-size:8.5pt;color:#333;word-break:break-all}
  .spec>div,.hist>li,.fig{break-inside:avoid}
  .rv,.pic,.pic img,.il,.rv.has-ln .ln-u{opacity:1 !important;transform:none !important;translate:none !important}
  .sec{padding:18pt 0}.sec--paper{background:#fff}
  @page{size:A4;margin:16mm 14mm}
}

/* ---- 元の画素が足りない写真（2026-10-29 ミサト）：引き伸ばさない。お知らせの小さい写真は正方形を横に並べる ---- */
.gal--sq{grid-template-columns:repeat(var(--n,4),minmax(0,1fr));max-width:calc(var(--n,4) * 300px)}
.gal--sq .pic{aspect-ratio:1/1}
.gal--sq .pic>img{width:100%;height:100%;object-fit:cover}
@media (max-width:767px){.gal--sq{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}

/* ==========================================================
   会社概要（2026-10-29 カヲル）
   なおさん「こういうの、動きまで含めて話にならない。10点ぐらい」（左に見出しだけ・右に細い線の表が延々と続き、左が空いた組み）を受けて作り直し。
   ・縦の線は L0（本文の左端）と L1（5:7 の右の列の頭）の 2 本。数字の帯だけ、左右の列をそれぞれ半分に割る。
   ・項目は「小さな札（上）＋値（下）」。上の細い線は、出るときに左から引かれる（電気が通るように）。
   ・字の大きさは 13／16／26（社名・電話・許可番号）／48（数字）／112（企業理念と沿革の年＝見せ場）の 5 段＋リード 20。
   ・地は白で通す（白と水色の互い違いをやめる）。明暗の変化は企業理念の全幅の写真が受け持つ。
   ・会社沿革は、PC で左に止まる窓（年の数字・目盛り・「そのころ、日本では。」の絵と説明）、右に年の並び（company.js）。
   ========================================================== */
.co-sec .wrap>.sh{padding-top:clamp(28px,2.5vw,36px)}
.co-2,.co-acc,.co-grp,.co-ph{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--col-gap);align-items:start;margin-top:var(--head-gap)}

/* 項目：札（上）と値（下）。上に細い線 1 本（--line）。出るときに左から引かれる */
.co-dl{margin:0;min-width:0}
.co-i{position:relative;padding:18px 0 26px;min-width:0}
.co-i::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line);transform-origin:0 50%}
.co-i.rv::before{transition:transform 1.2s var(--out) var(--sd,0s)}
.js .co-i.rv:not(.is-in)::before{transform:scaleX(0)}
.co-i dt{font:500 13px/1.6 var(--jp-h);letter-spacing:.1em;color:var(--mute)}
.co-i dd{margin:8px 0 0;font-size:16px;line-height:1.85;color:var(--ink)}
.co-i dd .tel{font-stretch:112%;letter-spacing:.04em}
.co-sep{color:var(--line-d);margin:0 .15em}
.co-sub{display:block;margin-top:10px;font-size:13px;line-height:1.6;letter-spacing:.04em;color:var(--mute)}
.co-n{font:300 26px/1 var(--en);font-stretch:112%;letter-spacing:.01em;color:var(--navy);font-variant-numeric:lining-nums tabular-nums}
.co-i--name dd,.co-name{font:500 clamp(20px,1.8vw,26px)/1.5 var(--jp-h);letter-spacing:.04em;color:var(--navy)}
.co-dl dd a:not(.co-go):not(.tel){color:var(--blue);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .4s var(--ease),text-decoration-thickness .4s var(--ease)}
.co-dl a.tel{transition:color var(--hv-t) var(--ease)}
.co-go{display:inline-flex;align-items:center;gap:16px;min-height:44px;font:500 16px/1.6 var(--jp-h);letter-spacing:.04em;color:var(--navy);transition:color var(--hv-t) var(--ease)}

/* 企業理念：大きな一文（見せ場。本文の 7 倍）＋右の列の頭に添えの一文 → 全幅の写真 */
.co-sec--ph{padding-bottom:0}
.co-sec--ph+.co-sec{padding-top:var(--sec)}
.co-ph{row-gap:0}
.co-ph__big{grid-column:1/-1;font:400 clamp(52px,7.8vw,112px)/1.2 var(--jp-h);letter-spacing:.06em;color:var(--navy);font-feature-settings:"palt" 1}
.co-ph__big .em{color:inherit}
.co-ph__t{grid-column:2;margin-top:clamp(28px,3vw,44px);max-width:25em;font:500 var(--lf)/2 var(--jp-h);letter-spacing:.06em;color:var(--ink-2)}
.co-ph__pic.pic{margin-top:clamp(64px,7vw,104px);width:100%;aspect-ratio:21/9}

/* 会社概要：数字の帯（4 つ）＋左右 2 列 */
.co-fig{display:grid;grid-template-columns:repeat(2,calc(((100% - var(--col-gap)) * 5 / 12 - var(--col-gap)) / 2)) repeat(2,minmax(0,1fr));column-gap:var(--col-gap);margin:var(--head-gap) 0 0}
.co-f dd{margin-top:16px}
.co-f__v{display:block;font:500 16px/1 var(--jp-h);letter-spacing:.04em;color:var(--navy);white-space:nowrap}
.co-f .co-n{font-size:clamp(30px,3.3vw,48px);margin:0 .08em;letter-spacing:0}
.co-f .co-n:first-child{margin-left:0}
.co-d{display:inline-block}
.js .co-f.rv .co-d{opacity:.18;translate:0 .28em;transition:opacity .85s var(--out) calc(var(--sd,0s) + .18s + var(--i,0) * .06s),translate .85s var(--out) calc(var(--sd,0s) + .18s + var(--i,0) * .06s)}
.js .co-f.rv.is-in .co-d{opacity:1;translate:none}
.co-2{margin-top:clamp(20px,2vw,28px)}
.co-lic{display:inline-flex;align-items:baseline;gap:.35em;margin:0 .3em}
.co-lic .co-n{margin:0 .05em}
.co-lic__k{white-space:nowrap}
.co-q{max-width:25em}
.co-q li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:3px 0}
.co-q__v{flex:none;color:var(--navy);font-family:var(--jp-h);font-weight:500}
.co-q__v .co-n{margin-right:.12em}

/* アクセス：左に住所・電話、右に地図（枠の線なし） */
.co-acc .map{grid-column:2;grid-row:1}
.co-acc__t{grid-column:1;grid-row:1}
.co-tel{font:300 clamp(20px,1.8vw,26px)/1.3 var(--en);font-stretch:112%;letter-spacing:.03em;color:var(--navy)}
.co-acc__l{margin-top:8px}
.co-acc .map .ddmap__frame{border:0}

/* グループ会社：左に社名と一文、右に 2×2 */
.co-name{margin:0}
.co-grp__t{padding-top:18px}
.co-grp__p{margin-top:16px;max-width:24em}
.co-dl--2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--col-gap)}

/* 会社沿革：年の並び（携帯・JS なしはこの形のまま、絵と説明も並びの中に） */
.co-his{margin-top:var(--head-gap)}
.co-his__pn{display:none}
.co-his__list{margin:0}
.co-yr{position:relative;display:grid;grid-template-columns:150px minmax(0,1fr);column-gap:var(--col-gap);padding:28px 0 34px}
.co-yr::before,.co-yr::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line)}
.co-yr::after{background:var(--navy);transform:scaleX(0);transform-origin:0 50%;transition:transform 1s var(--out)}
.co-yr__y{margin:0;line-height:1}
.co-yr__y .num{display:block;font:300 26px/1 var(--en);font-stretch:112%;letter-spacing:.01em;color:var(--navy)}
.co-yr__y small{display:block;margin-top:10px;font:400 13px/1.4 var(--jp);letter-spacing:.04em;color:var(--mute)}
.co-yr__e{margin-top:-4px;font:500 16px/1.8 var(--jp-h);letter-spacing:.04em;color:var(--navy)}
.co-era{margin-top:22px}
.co-era__k{font:500 13px/1.6 var(--jp-h);letter-spacing:.1em;color:var(--mute)}
.co-era__i{display:flow-root;margin-top:16px}
.co-era__pic.pic{float:left;width:min(40%,240px);aspect-ratio:var(--ar,4/3);margin:4px 18px 8px 0;background:var(--white)}
.co-era__pic img{object-fit:cover}
.co-era__h{margin:0;font:500 16px/1.7 var(--jp-h);letter-spacing:.04em;color:var(--ink)}
.co-era__d{margin-top:6px;font-size:14.5px;line-height:1.85;color:var(--ink-2)}
@media (max-width:767px){
  .co-yr{grid-template-columns:minmax(0,1fr);row-gap:12px;padding:24px 0 30px}
  .co-yr__y{display:flex;align-items:baseline;gap:14px}
  .co-yr__y small{margin-top:0}
  .co-yr__e{margin-top:0}
  .co-era__pic.pic{width:42%;margin-right:14px}
  .co-era__h{font-size:15px}
}

/* 会社沿革（PC・幅 1024 以上、JS あり）：左に止まる窓、右に年の並び。並びの説明と絵は窓に出す（読み上げには並びの中の文が残る） */
.co-his--live{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--col-gap);align-items:start}
.co-his--live .co-his__pn{display:block;grid-column:1;grid-row:1;position:sticky;top:calc(var(--hd) + 24px)}
.co-his--live .co-his__list{grid-column:2;grid-row:1}
.co-his--live .co-yr{min-height:clamp(170px,22vh,230px)}
.co-his--live .co-yr.is-on::after{transform:scaleX(1)}
.co-his--live .co-era{margin-top:14px}
.co-his--live .co-era__k,.co-his--live .co-era__pic{display:none}
.co-his--live .co-era__i{margin-top:6px}
/* 11/07 マヤ：flex だと、折り返し止めの箱（「い・」の）が一つずつ並びの項目になり、Safari・Chrome とも「「い　ざなぎ景気　」の　始まり」と 12px ずつ空いた。
   ふつうの行にして、線は字の前の inline-block（2 行目は字の頭にそろえる） */
.co-his--live .co-era__h{display:block;padding-left:26px;text-indent:-26px;font-weight:400;color:var(--ink-2)}
.co-his--live .co-era__h::before{content:"";display:inline-block;vertical-align:baseline;margin-right:12px;text-indent:0;width:14px;height:1px;background:var(--line-d);translate:0 -.32em;transition:width .7s var(--out),background-color .7s var(--ease)}
.co-his--live .co-yr.is-on .co-era__h::before{width:26px;background:var(--navy)}
.co-his--live .co-era__d{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* 窓：年の数字（入れ替わる字は、わずかに上へ抜けて次が下から来る。切り抜きはしない） */
.co-pn__y{display:flex;margin:-.06em 0 0;font:300 clamp(64px,min(7.8vw,12.5vh),112px)/1 var(--en);font-stretch:112%;letter-spacing:-.01em;color:var(--navy);font-variant-numeric:lining-nums tabular-nums}
.co-pn__dg,.co-pn__wa{display:inline-grid}
.co-pn__dg>span,.co-pn__wa>span{grid-area:1/1;transition:opacity .6s var(--ease) var(--dl,0s),translate .9s var(--out) var(--dl,0s)}
.co-pn__dg>.is-pre,.co-pn__wa>.is-pre{opacity:0;translate:0 .22em;transition:none}
.co-pn__dg>.is-pre.is-up,.co-pn__wa>.is-pre.is-up{translate:0 -.22em}
.co-pn__dg>.is-out,.co-pn__wa>.is-out{opacity:0;translate:0 -.22em}
.co-pn__dg>.is-out.is-up,.co-pn__wa>.is-out.is-up{translate:0 .22em}
.co-pn__wa{display:grid;margin-top:14px;font:400 13px/1.4 var(--jp);letter-spacing:.06em;color:var(--mute)}
/* 目盛り：1955〜2026。会社の出来事の年に小さな刻み、針は今読んでいる年。針までの線は紺（通電したように） */
.co-sc{position:relative;height:40px;margin-top:22px}
.co-sc__line,.co-sc__fill{position:absolute;left:0;top:9px;height:1px;background:var(--line)}
.co-sc__line{right:0}
.co-sc__fill{width:0;background:var(--navy);transition:width .9s var(--out)}
.co-sc__t{position:absolute;top:5px;width:1px;height:9px;margin-left:-.5px;background:var(--line-d)}
.co-sc__nd{position:absolute;top:0;left:0;width:2px;height:19px;margin-left:-1px;background:var(--navy);transition:left .9s var(--out)}
.co-sc__a,.co-sc__b{position:absolute;top:26px;font:400 13px/1 var(--en);font-stretch:112%;letter-spacing:.04em;color:var(--mute)}
.co-sc__a{left:0}
.co-sc__b{right:0}
/* 窓：その年の「そのころ、日本では。」。絵はほぼ透明から立ち上がり、中で 1.06 → 等倍に落ち着く（写真の出方と同じ値） */
.co-pn__v{display:grid;margin-top:clamp(20px,3vh,36px)}
.co-v{grid-area:1/1;opacity:0;transition:opacity .5s var(--ease);pointer-events:none}
.co-v.is-on{opacity:1;transition:opacity 1.1s var(--e-rise)}
.co-v__k{display:flex;justify-content:space-between;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--line);font:500 13px/1.6 var(--jp-h);letter-spacing:.1em;color:var(--mute)}
.co-v__k .num{font-family:var(--en);font-stretch:112%;letter-spacing:.04em}
.co-v__g{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:18px}
.co-v--2 .co-v__g{grid-template-columns:repeat(2,minmax(0,1fr))}
.co-v__i{min-width:0;translate:0 24px;transition:translate 1.4s var(--ease) calc(var(--k,0) * .16s)}
.co-v.is-on .co-v__i{translate:none}
.co-v__pic{aspect-ratio:4/3;width:min(100%,calc(32vh * 4 / 3));overflow:hidden;background:var(--white)}   /* 綾波の絵は 4:3・白い地にぼかした縁。切らずに、高さを画面の 32% までに */
.co-v__pic picture{display:block;width:100%;height:100%}
.co-v__pic img{width:100%;height:100%;max-width:none;object-fit:contain;scale:1.06;transition:scale 2.2s var(--ease) calc(var(--k,0) * .16s)}
.co-v.is-on .co-v__pic img{scale:1}
.co-v__h{margin-top:14px;font:700 16px/1.6 var(--jp-h);letter-spacing:.04em;color:var(--navy)}
.co-v__d{margin-top:6px;font-size:14.5px;line-height:1.85;color:var(--ink-2)}
.co-his:not(.co-his--era) .co-pn__y{font-size:clamp(80px,min(10vw,16vh),160px)}

/* 出典（閉じた引き出し。右の列の頭にそろえる） */
.co-src{margin-top:var(--head-gap);border-top:1px solid var(--line)}
.co-src summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;cursor:pointer;list-style:none;font:500 14.5px/1.6 var(--jp-h);letter-spacing:.06em;color:var(--navy);transition:color var(--hv-t) var(--ease)}
.co-src summary::-webkit-details-marker{display:none}
.co-src summary::after{content:"";flex:none;width:12px;height:12px;background:linear-gradient(currentColor,currentColor) 50% 50%/12px 1px no-repeat,linear-gradient(currentColor,currentColor) 50% 50%/1px 12px no-repeat;transition:transform .5s var(--out)}
.co-src[open] summary::after{transform:rotate(45deg)}
.co-src ol{columns:2 22em;column-gap:var(--col-gap);padding:8px 0 16px;font-size:13px;line-height:1.75;color:var(--ink-2)}
.co-src li{break-inside:avoid;padding:8px 0}
.co-src__y{margin-right:.8em;font-stretch:112%;color:var(--navy)}
.co-src__h{font-family:var(--jp-h);font-weight:500;color:var(--ink)}
.co-src__s{display:block}
.co-src a{color:var(--blue);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;word-break:break-all;transition:color .4s var(--ease),text-decoration-thickness .4s var(--ease)}
@media (min-width:1024px){.co-src{margin-left:calc((100% - var(--col-gap)) * 5 / 12 + var(--col-gap))}}

/* 1023px 以下：1 列（数字の帯は 2×2） */
@media (max-width:1023px){
  .co-2,.co-acc,.co-grp,.co-ph{grid-template-columns:minmax(0,1fr)}
  .co-ph__t{grid-column:1}
  .co-fig{grid-template-columns:repeat(2,minmax(0,1fr))}
  .co-2 .co-dl+.co-dl{margin-top:0}
  .co-acc .map,.co-acc__t{grid-column:1;grid-row:auto}
  .co-acc .map{margin-top:28px}
  .co-grp .co-dl--2{margin-top:28px}
}
@media (max-width:767px){
  .co-ph__big{font-size:52px;letter-spacing:.04em}
  .co-ph__pic.pic{aspect-ratio:3/2}
  .co-f .co-n{font-size:34px}
  .co-acc .ddmap{margin-left:calc(var(--gut) * -1);margin-right:calc(var(--gut) * -1)}   /* 携帯の地図は端から端まで（社名の字が切れない） */
  .co-dl--2{grid-template-columns:minmax(0,1fr)}
  .co-src ol{columns:1}
}
@media (hover:hover){
  .co-go:hover,.co-dl a.tel:hover,.co-src summary:hover{color:var(--blue)}
  .co-dl dd a:not(.co-go):not(.tel):hover,.co-src a:hover{color:var(--blue-d);text-decoration-thickness:2px}
}
@media (prefers-reduced-motion:reduce){
  .co-i.rv::before,.co-yr::after,.co-sc__fill,.co-sc__nd,.co-v,.co-v__i,.co-v__pic img,.co-pn__dg>span,.co-pn__wa>span{transition:none !important}
  .js .co-f.rv .co-d{opacity:1;translate:none;transition:none}
  .js .co-i.rv:not(.is-in)::before{transform:none}
  .co-v__i,.co-v__pic img{translate:none;scale:1}
}
@media print{
  .co-2,.co-acc,.co-grp,.co-ph,.co-fig,.co-his--live{display:block}
  .co-his__pn,.co-ph__pic,.co-era__pic,.co-acc .map{display:none !important}
  .co-his--live .co-era__k{display:block}
  .co-his--live .co-era__d{position:static;width:auto;height:auto;margin:4pt 0 0;clip:auto;white-space:normal}
  .co-i,.co-yr{break-inside:avoid}
  .co-ph__big{font-size:28pt}
  .co-src{margin-left:0}
}

/* 欧文組版（2026-11-05 なおさん「欧文組版の書籍…今制作中の全サイトに及ぼせ」。キット layout.css の最後の 3 行の写し。lang="en" の所だけに効く。小文字の字間は触らない） */
:where(p,li,dd,figcaption):lang(en){font-variant-numeric:oldstyle-nums proportional-nums;hyphens:auto;text-wrap:pretty}
:where(table,.l-num,[data-num]){font-variant-numeric:lining-nums tabular-nums}
:where(h1,h2,h3,h4,h5,h6):lang(en){hyphens:manual}

/* 動きを減らす設定（WCAG 2.3.3 を会社標準に。2026.11.05 なおさん「標準にする」）：端末の設定に加えて <html data-motion="reduce"> でも、上の「動きを減らす」の止め方を全部効かせる。
   どちらでも、マウスオーバーの寄り・なめらかな送りを止め、色の変化だけ 150ms 残す（main.js・company.js も同じ条件で止める） */
@media (prefers-reduced-motion:reduce){
.voice:hover .il picture,.gal__i:hover .pic>picture,.gal__i:hover .pic>img,.vid:hover .pic>img{scale:1!important}
html{scroll-behavior:auto!important}
*,*::before,*::after{transition-duration:.15s!important;transition-property:color,background-color,border-color,opacity!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

html[data-motion=reduce] .rv,html[data-motion=reduce] .pic.rv,html[data-motion=reduce] .il.rv,html[data-motion=reduce] .rv.has-ln .ln-u{opacity:1 !important;transform:none !important;transition:none !important}
html[data-motion=reduce] .pic img{transform:none !important;transition:none !important}
html[data-motion=reduce] .pgh__pic img{opacity:1;scale:1;translate:none;transition:none}
html[data-motion=reduce] .pic>picture,html[data-motion=reduce] .pic>.pic__in,html[data-motion=reduce] .il picture,html[data-motion=reduce] .gal__i .pic>img,html[data-motion=reduce] .vid .pic>img{transition:none}
html[data-motion=reduce] .hd{transition:none}
html[data-motion=reduce] .co-i.rv::before,html[data-motion=reduce] .co-yr::after,html[data-motion=reduce] .co-sc__fill,html[data-motion=reduce] .co-sc__nd,html[data-motion=reduce] .co-v,html[data-motion=reduce] .co-v__i,html[data-motion=reduce] .co-v__pic img,html[data-motion=reduce] .co-pn__dg>span,html[data-motion=reduce] .co-pn__wa>span{transition:none !important}
html[data-motion=reduce].js .co-f.rv .co-d{opacity:1;translate:none;transition:none}
html[data-motion=reduce].js .co-i.rv:not(.is-in)::before{transform:none}
html[data-motion=reduce] .co-v__i,html[data-motion=reduce] .co-v__pic img{translate:none;scale:1}
html[data-motion=reduce] .voice:hover .il picture,html[data-motion=reduce] .gal__i:hover .pic>picture,html[data-motion=reduce] .gal__i:hover .pic>img,html[data-motion=reduce] .vid:hover .pic>img{scale:1!important}
html[data-motion=reduce]{scroll-behavior:auto!important}
html[data-motion=reduce] *,html[data-motion=reduce] *::before,html[data-motion=reduce] *::after{transition-duration:.15s!important;transition-property:color,background-color,border-color,opacity!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}

/* ==========================================================
   第3版の組み（ここから下が下層の見た目の本体）
   ========================================================== */
body.is-in2{background:#fff;color:var(--ink)}
.is-in2 main{counter-reset:sec}
/* 上の帯：読み物の頁と同じ（72px・すりガラスの淡い地。送っても高さは変わらない） */
.is-in2 .hd{height:var(--hd2);color:var(--ink);background:rgba(241,244,247,.82);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.is-in2 .hd .pill--fill{background:var(--ink);color:#fff;border-color:var(--ink)}
.is-in2 .hd .pill[aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}
.mn__l a[aria-current] b{color:var(--acc)}
.skip{position:absolute;left:var(--gut);top:-80px;z-index:200;padding:12px 18px;border-radius:99px;background:var(--ink);color:#fff;font:500 var(--f1)/1 var(--ja);letter-spacing:.08em;transition:top .3s var(--soft)}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;box-shadow:none;border-radius:2px}

/* 字の基本：見出しは端末のゴシック。大きい物ほど細く（300）、小さい見出しは 500 */
.is-in2 h1,.is-in2 h2,.is-in2 h3,.is-in2 h4{font-family:var(--ja);color:var(--ink);letter-spacing:.04em}
.is-in2 h3,.is-in2 h4{font-weight:500}
.em{color:inherit}                                  /* 要の語の青はやめる（第3版は字の色を墨・灰の 2 つに。差し色は水色一つ） */
.num,.date,.tel,.en{font-family:var(--en);font-stretch:normal;font-variant-numeric:lining-nums tabular-nums}
.wrap{max-width:var(--max);padding-inline:var(--gut)}

/* ---------- 頁の扉 ---------- */
.pgh{position:relative;padding-top:calc(var(--hd2) + var(--u) * 2);overflow-x:clip}
.pgh__in{align-items:end}
.pgh__en{grid-column:1/-1;position:relative;z-index:-1;height:calc(var(--u) * 5);margin:0 0 calc(var(--u) * 2) calc(var(--lsb, .062em) * -1);
  font:300 calc(var(--u) * 7)/calc(var(--u) * 5) var(--en);letter-spacing:-.01em;white-space:nowrap;color:var(--w1);pointer-events:none;user-select:none}
.pgh__en::before{content:attr(data-en);content:attr(data-en) / ""}
.pgh__en[data-en^="C"]{--lsb:.034em}.pgh__en[data-en^="S"]{--lsb:.023em}
.pgh .crumb{grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline;gap:var(--u);font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.pgh .crumb ol{display:flex;flex-wrap:wrap;gap:0 .9em}
.pgh .crumb li+li::before{content:"／";margin-right:.9em;color:var(--line-d);content:"／" / ""}
.pgh .crumb li:last-child span{color:var(--ink)}
.pgh .crumb::after{content:"TAKANE ELECTRIC";content:"TAKANE ELECTRIC" / "";flex:none;font:400 var(--f1)/var(--l2) var(--en);letter-spacing:.14em;color:var(--tx2)}
.pgh__g{grid-column:1/-1;display:grid;grid-template-columns:subgrid;align-items:end;margin-top:var(--u)}
.pgh__h{grid-column:1/7;margin:0;font:300 var(--f5)/var(--l5) var(--ja-l);letter-spacing:.02em;font-feature-settings:"palt";color:var(--ink)}
.pgh__lead{grid-column:7/13;max-width:none;margin:0;padding-bottom:calc(var(--it-h1) - var(--it-20));font:400 var(--f3)/var(--l3) var(--ja);letter-spacing:.04em;color:var(--tx)}
.pgh__lead br{display:none}
/* 11/07 なおさん「右がずれてる」：リードの字の右の端を、柱 TAKANE ELECTRIC・写真の窓の右の線にそろえる。
   1280 以上＝箱を右へ寄せて中は左寄せ（1 行の頁は右の線ちょうど）。768〜1279＝6 列で 2 行に割れるので、行の長さをならして右の線で終える（列を広げると題とぶつかる頁があった） */
@media (min-width:768px){.pgh__lead{justify-self:end;width:fit-content;max-width:100%;text-wrap:wrap}}
@media (min-width:768px) and (max-width:1279px){.pgh__lead{text-wrap:balance;text-align:end}}
.post__meta+.pgh__h{margin-top:var(--u)}
/* 11/07 夜 揃えの見直し（なおさん「崩れてる」）：題の 80px は L1〜L7（6 列）に、1024 で 5.8 字・768 で 4.3 字しか入らず、
   「先／輩社員の声」「個／人情報保護」「新卒／者フォーム」と頭の 1 字だけが落ちていた。768〜1023 は 52/60、1024〜1279 は 64/72 に（題の字の頭・最後の行の線の式 --it-h1 も同じ値で）。
   句の切れ目（<wbr>）を持つ題は、その切れ目でだけ折る */
@media (min-width:768px) and (max-width:1023px){.pgh{--f5:52px;--l5:60px;--it-h1:calc(var(--l5) / 2 - var(--f5) * .462)}}
@media (min-width:1024px) and (max-width:1279px){.pgh{--f5:64px;--l5:72px;--it-h1:calc(var(--l5) / 2 - var(--f5) * .462)}}
.pgh:not(.pgh--post) .pgh__h:has(wbr){word-break:keep-all;overflow-wrap:anywhere}
/* 同じ章の頁の行（線の上に番号と名前。いまの頁は墨の字と線） */
.pgh .tabs{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:0 calc(var(--u) * 1.5);margin:calc(var(--u) * 2) 0 0;padding:0;border-top:1px solid var(--line);border-bottom:0;overflow:visible}
.pgh .tabs a{position:relative;display:inline-flex;align-items:baseline;gap:12px;min-height:0;padding:12px 0 0;font:400 var(--f2)/var(--l2) var(--ja);letter-spacing:.04em;color:var(--tx);white-space:nowrap;transition:color .45s var(--soft)}
.pgh .tabs a::after{content:"";position:absolute;left:0;right:0;top:-1px;bottom:auto;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--out)}
.pgh .tabs a[aria-current="page"]{color:var(--ink)}
.pgh .tabs a[aria-current="page"]::after{transform:scaleX(1)}
.tabs__n{font:400 var(--f1)/1 var(--en);letter-spacing:.06em;color:var(--tx2)}
@media (hover:hover){.pgh .tabs a:not([aria-current]):hover{color:var(--acc)}.pgh .tabs a:not([aria-current]):hover::after{transform:scaleX(1);background:var(--acc)}}
/* 写真の窓：12 列いっぱい・角の丸い窓（トップの窓と同じ角 28px）。中の写真は送った量の 24% 遅れて沈み、7 秒で 1.06 → 等倍 */
.pgh__f{margin-top:calc(var(--u) * 2)}
.pgh__pic{position:relative;overflow:hidden;margin:0;aspect-ratio:12/5;border-radius:var(--r);background:var(--w0)}
.pgh__pic img{position:absolute;left:0;top:-24%;width:100%;height:124%;max-width:none;object-fit:cover;scale:1.06;translate:0 var(--hy,0px);transition:scale 7s cubic-bezier(.25,.1,.25,1),opacity 1.6s cubic-bezier(.25,.1,.25,1)}
.pgh__pic picture{display:block}
/* 11/07 なおさん「顔がでてくるのがおそい」：頭が写真の上の方にある頭の写真は、上に隠す量を 24%→6% に（開いた時から顔が見える）。沈みの速さは同じ・止まる所が早い */
.pgh__pic--face img{top:-6%;height:106%}
.pgh__pic.is-in img{scale:1}
.pgh__pic.rv{transform:none;opacity:1}
.pgh__pic.rv img{opacity:0}
.pgh__pic.rv.is-in img{opacity:1}
/* 11/07 頭・途中の枠のループ（会社概要の頭と企業理念の帯。写真の上にかぶせ、再生が始まったらふわっと出す。動きを減らす設定では JS が読まない＝写真のまま） */
.pgh__v{position:absolute;left:0;top:-24%;width:100%;height:124%;max-width:none;object-fit:cover;opacity:0;scale:1.06;translate:0 var(--hy,0px);pointer-events:none;transition:scale 7s cubic-bezier(.25,.1,.25,1),opacity 1.2s cubic-bezier(.25,.1,.25,1)}
.pgh__pic.is-in .pgh__v{scale:1}
.lpv{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;opacity:0;pointer-events:none;transform:translate3d(0,var(--py,0px),0) scale(var(--rs,1));transition:opacity 1.2s cubic-bezier(.25,.1,.25,1)}
.pgh__v.is-on,.lpv.is-on{opacity:1}
.pgh--post .pgh__h{grid-column:1/10;font-size:var(--f4);line-height:var(--l4)}
.pgh--post .pgh__g,.pgh--plain .pgh__g{align-items:start}
.pgh--post .post__meta{grid-column:1/-1;display:flex;gap:var(--u);align-items:baseline}
.pgh--post .post__meta .date{font:400 var(--f1)/var(--l2) var(--en);letter-spacing:.06em;color:var(--ink)}
.pgh--post .post__meta .cat{font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.pgh+.sec{padding-top:calc(var(--u) * 4)}
.pgh:has(.pgh__f)+.sec{padding-top:calc(var(--u) * 5)}
@media (max-width:767px){
  .pgh{padding-top:calc(var(--hd2) + var(--u))}
  .pgh__en{height:calc(var(--u) * 3);margin-bottom:var(--u);font-size:calc(var(--u) * 4.2);line-height:calc(var(--u) * 3)}
  .pgh .crumb::after{display:none}
  .pgh__h{grid-column:1/-1;font-size:var(--f5);line-height:var(--l5)}
  .pgh__lead{grid-column:1/-1;margin-top:var(--u);padding:0;font-size:var(--f3);line-height:var(--l3)}
  .pgh--post .pgh__h{grid-column:1/-1;font-size:var(--f4);line-height:var(--l4)}
  .pgh .tabs{gap:0 var(--u);margin-left:calc(var(--gut) * -1);margin-right:calc(var(--gut) * -1);padding:0 var(--gut);flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;border-top:0;box-shadow:inset 0 1px 0 var(--line)}
  .pgh .tabs::-webkit-scrollbar{display:none}
  .pgh .tabs a::after{top:0}
  /* 11/07 夜 揃えの見直し：横に送る列は、今の頁を真ん中に送った時に左の項目が画面の端で切れ（「業務内容」が左端に貼りつく）、
     「03 数字でみる／タカネ電業」は 2 行に割れていた。携帯も折り返しの列にして、左端は本文と同じ線（--gut）、名前は 1 行 */
  .pgh .tabs{flex-wrap:wrap;overflow:visible;margin-inline:0;padding:0;gap:0 var(--u);box-shadow:none;border-top:1px solid var(--line)}
  .pgh .tabs a br{display:none}
  .pgh .tabs a{padding-bottom:4px}
  .pgh .tabs a::after{top:auto;bottom:0}   /* 折り返すと、上の線の印が上の行の項目の下線に見えた → 今の頁の印は字の下に */
  .pgh__pic{aspect-ratio:4/3;border-radius:var(--r-s)}
  .pgh+.sec,.pgh:has(.pgh__f)+.sec{padding-top:calc(var(--u) * 3)}
}

/* ---------- 段・段の頭・左右 2 段 ---------- */
.sec{padding:var(--sec) 0}
.sec--paper{background:var(--bg)}
.sec--paper .il img{mix-blend-mode:multiply}           /* 似顔絵の白い地を段の地の色に溶かす */
.sec--paper .il,.sec--paper .il img{background:transparent}
.sh{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:1.5em;align-items:baseline;counter-increment:sec}
.sh::before{content:counter(sec,decimal-leading-zero);content:counter(sec,decimal-leading-zero) / "";grid-column:1;grid-row:1;font:400 var(--f1)/var(--l2) var(--en);letter-spacing:.06em;color:var(--ink);font-variant-numeric:lining-nums tabular-nums}
.sh[data-en]::after{content:attr(data-en);content:attr(data-en) / "";grid-column:2;grid-row:1;font:400 var(--f1)/var(--l2) var(--en);letter-spacing:0;word-spacing:.15em;color:var(--ink)}
.sh__row{grid-column:1/-1;grid-row:2;display:flex;justify-content:space-between;align-items:baseline;gap:var(--u);margin-top:var(--u)}
.sh>.sh__lead,.sh>.sh__sub{grid-column:1/-1}
.sh__h{margin:0;font:300 var(--f4)/var(--l4) var(--ja-l);letter-spacing:.02em;font-feature-settings:"palt";color:var(--ink)}
.sh__lead{margin-top:var(--u);max-width:34em;font:400 var(--f3)/var(--l3) var(--ja);letter-spacing:.04em;color:var(--tx)}
.sh__sub{margin-top:var(--u);font:400 var(--f3)/var(--l3) var(--ja);letter-spacing:.04em;color:var(--tx)}
.sh__small{display:block;margin-top:0;font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.wrap>.sh{border-top:1px solid var(--ink);padding-top:var(--u)}
.body{margin-top:calc(var(--u) * 2)}
.sh__row .tlink{flex:none}
/* 左右 2 段：見出し L1（6 列）・中身 L7（6 列）。線は頁の幅いっぱいに 1 本。右の最初の字の上を、左の見出しの字の上に */
.split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u);align-items:start}
.split::before{content:"";grid-column:1/-1;height:1px;margin-bottom:var(--u);background:var(--ink)}
.split>.sh{grid-column:1/7;position:static;border-top:0;padding-top:0}
.split>.sh~*{grid-column:7/13}
.split>.sh+*{margin-top:calc(var(--l2) + var(--u) + var(--it-h2) - var(--it-tx))}
.split>.sh+:is(.stack--pic,.stack--h){margin-top:calc(var(--l2) + var(--u) + var(--it-h2))}
.split>.sh+.stack--l{margin-top:calc(var(--l2) + var(--u) + var(--it-h2) - var(--it-20))}
@media (max-width:1023px){
  .split>.sh,.split>.sh~*{grid-column:1/-1}
  .split>.sh{margin-bottom:calc(var(--u) * 2)}
  .split>.sh+*,.split>.sh+:is(.prose,.sh__lead,.stack,.stack--pic,.stack--h,.stack--l,.quote){margin-top:0}
}
@media (max-width:767px){.sh::after{display:none}.sh{column-gap:0}}
/* 本文 */
.prose{max-width:40em}
.prose p{font:400 var(--f2)/var(--l2) var(--ja);letter-spacing:.04em;color:var(--tx)}
.prose p+p{margin-top:1em}
.prose .sign{margin-top:var(--u);font:500 var(--f2)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--ink)}
.prose__h{margin:0 0 var(--u);font:300 var(--f4)/var(--l4) var(--ja-l);letter-spacing:.02em;font-feature-settings:"palt"}
.prose__h2{margin:calc(var(--u) * 2) 0 calc(var(--u) / 2);padding:var(--u) 0 0;border-top:1px solid var(--line);border-bottom:0;font:500 var(--f3)/var(--l3) var(--ja);letter-spacing:.04em}
.prose--doc{max-width:44em}
.prose a:not(.tlink):not(.btn),.spec dd a:not(.tel),.access a:not(.tlink),.ul-p a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-d);text-underline-offset:4px}
@media (hover:hover){.prose a:not(.tlink):not(.btn):hover,.spec dd a:not(.tel):hover,.ul-p a:hover{color:var(--acc);text-decoration-color:currentColor;text-decoration-thickness:1px}}
.lead2{font:400 var(--f3)/var(--l3) var(--ja);letter-spacing:.04em;color:var(--ink)}
.stack{row-gap:calc(var(--u) * 2)}
.stack .pic{aspect-ratio:3/2}

/* ---------- 押せる物：第3版の札と文字のリンク ---------- */
.btn{height:calc(var(--u) * 2);padding-inline:var(--u);gap:var(--u);border:1px solid var(--ink);border-radius:99px;background:var(--ink);color:#fff;font:500 var(--f2)/1 var(--ja);letter-spacing:.12em}
.btn [lang="en"]{font-family:var(--en);letter-spacing:.02em}
.btn--line{background:transparent;color:var(--ink)}
@media (hover:hover){.btn:hover,.btn--line:hover{background:var(--acc);border-color:var(--acc);color:#fff}}
.btn .ext,.tl .ext{margin-left:-.6em}
.tl.tlink{min-height:44px;padding:0;gap:calc(var(--u) / 2);color:var(--ink)}
.tl.tlink b{font-weight:500}
.arw{display:inline-block;flex:none;width:32px;height:9px;background:none;position:relative;transition:transform .5s var(--soft)}
.arw::before{content:"";position:absolute;left:0;right:1px;top:4px;height:1px;background:currentColor}
.arw::after{content:"";position:absolute;right:1px;top:1px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg);transform-origin:50% 50%}
@media (hover:hover){a:hover>.arw,a:hover .arw{transform:translateX(6px);width:32px}}
@media (max-width:767px){.btn{width:auto}.form__send .btn{width:100%;justify-content:space-between}}

/* ---------- 写真・絵 ---------- */
.pic{border-radius:var(--r-s);background:var(--w0)}
.pic--band{border-radius:var(--r)}
.il{background:#fff}
@media (max-width:767px){.pic--band{border-radius:var(--r-s);margin-inline:0}}

/* ---------- 一覧：項目名（12・灰）＋中身（16・墨）。線は灰、頭だけ墨 ---------- */
.spec{border-top:1px solid var(--ink)}
.spec>div{grid-template-columns:calc((100% - var(--u) * 5) / 6 * 2 + var(--u)) minmax(0,1fr);column-gap:var(--u);padding:calc(var(--u) / 2) 0;border-bottom:1px solid var(--line)}
.spec dt{top:0;padding-top:calc(var(--it-tx) - var(--l2) / 2 + var(--f1) * .9);font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.spec dt{padding-top:0;line-height:var(--l2)}
.spec dd{font:400 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
.spec dd .sub{margin-top:0;font:400 var(--f2)/var(--l2) var(--ja);color:var(--tx)}
.wrap>.spec>div,.wrap>.body>.spec>div{grid-template-columns:calc((100% - var(--u) * 11) / 12 * 3 + var(--u) * 2) minmax(0,1fr)}
@media (max-width:767px){.spec>div,.wrap>.spec>div,.wrap>.body>.spec>div{grid-template-columns:minmax(0,1fr);padding:calc(var(--u) / 2) 0}.spec dd{margin-top:0}}
.tlst{column-width:10em;column-gap:var(--u);margin:0}
.tlst li{break-inside:avoid;padding:calc(var(--u) / 4) 0;border-bottom:1px solid var(--line);font:400 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
.spec--biz .tlst li:last-child{border-bottom:0}
.achv li{padding:calc(var(--u) / 4) 0;font:400 var(--f2)/var(--l2) var(--ja)}
.achv__c{font-weight:500;color:var(--ink)}
.achv__s{color:var(--line-d)}
.spec--biz dd{font-size:var(--f2)}
.map2 img{border:0;border-radius:var(--r-s)}
.area__h{margin-bottom:calc(var(--u) / 2);font:500 var(--f2)/var(--l2) var(--ja);letter-spacing:.06em}
.area__k{margin-bottom:0;font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.area__g+.area__g{margin-top:var(--u)}

/* ---------- 業務案内（事業部）：正方形 4 枚は 4 つ割りの線に。下に左右 2 段 ---------- */
.sq4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--u)}
.sq4 .pic{aspect-ratio:1/1}
.biz{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u);align-items:start}
.biz>.biz__t{grid-column:1/7}
.biz>.spec{grid-column:7/13}
.biz__lead{margin:0;font:300 var(--f4)/var(--l4) var(--ja-l);letter-spacing:.02em;font-feature-settings:"palt";color:var(--ink)}
.biz__t p{margin-top:var(--u);max-width:none;font:400 var(--f2)/var(--l2) var(--ja);color:var(--tx)}
.biz>.spec{margin-top:calc(var(--it-h2) - var(--it-tx))}
.stack--pic .biz__t .biz__lead{font-size:var(--f3);line-height:var(--l3);font-weight:500;font-family:var(--ja)}
@media (max-width:1023px){.biz>.biz__t,.biz>.spec{grid-column:1/-1}.biz>.spec{margin-top:calc(var(--u) * 2)}}
@media (max-width:767px){.sq4{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.biz__lead{font-size:var(--f4);line-height:var(--l4)}}

/* ---------- 人：あいさつ・スタッフ ---------- */
.split--msg>.msg__pic{width:calc((100% * 6 - var(--u) * 5) / 6 * 1);min-width:220px;max-width:340px;margin-top:calc(var(--u) * 2)}
.split--msg>.msg__pic{grid-column:1/7}
.split--msg>.msg__t{grid-column:7/13}
.msg__t .prose__h{font-size:var(--f4);line-height:var(--l4)}
/* 11/07 なおさん「下が揃ってない」：挨拶の左の見出し（取締役挨拶）と右の題（2 行）の下端が 9px ずれていた。右の塊の上の 9px を 0 に */
.msg__t .sign{text-align:left}
.il--p{max-width:none}
/* スタッフ紹介（11/07 なおさん「ここはPROFILEのやつ使って　イラスト。さいずも縦長になるでしょ？　あと文字数揃えて」）：
   社員の頁（people.html）と同じ縦長 3:4 の似顔絵を、4 つ割りの線に。段の見出しは格子の最初の 2 枠（L1〜L6）、人は L7 から */
.staffg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(var(--u) * 2) var(--u);align-items:start}
.staffg>.sh{grid-column:span var(--hs,2);align-self:start}
.staffg>.sh .sh__lead{max-width:none}
/* 左（見出し）が短く右（人）が長いので、リードを人の紹介文の最後の行の下にそろえ、見出しとの間を「間」として見せる（揃えの決まり 3） */
.staffg>.sh{align-self:stretch;grid-template-rows:auto auto 1fr}
.staffg>.sh>.sh__lead{grid-row:3;align-self:end;margin-top:var(--u)}
/* 見出しの枠はどの事業部も 2 列（工営本部は 2 人で 1 行、工営地域部は 13 人で 4・4・4・3）。同じ型を頁どうしでそろえる */
.staffg>.sh{grid-column:span 2}
.wrap>.staffg{border-top:1px solid var(--ink);padding-top:var(--u)}
.staffg>.sh{border-top:0;padding-top:0}
.staff{display:block;padding:0;border:0}
.staff .il{width:100%;aspect-ratio:3/4}
.staff__t{margin-top:calc(var(--u) * .6)}
.staff__r{font:400 var(--f1)/var(--l1) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.staff__n{margin:2px 0 0;font:400 var(--f2)/var(--l2) var(--en);letter-spacing:.04em;font-stretch:normal;color:var(--ink)}
.staff__t p:last-child{margin-top:calc(var(--u) / 2);font:400 var(--f2)/var(--l2) var(--ja);color:var(--tx)}
@media (max-width:1023px){.staffg{grid-template-columns:repeat(3,minmax(0,1fr))}.staffg>.sh{grid-column:span 1}}
@media (max-width:767px){
  .staffg{grid-template-columns:minmax(0,1fr);row-gap:calc(var(--u) * 2)}
  .staffg>.sh,.staffg>.sh:is(*){grid-column:1/-1!important;grid-template-rows:none}
  .staffg>.sh>.sh__lead{grid-row:auto}
  .staff{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--u);align-items:end}
  .staff__t{margin-top:0}
  .staff__t p:last-child{grid-column:1/-1}
}
.grp{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u)}
.grp__pic{grid-column:1/7}.grp>.prose{grid-column:7/13}
@media (max-width:767px){.grp>*{grid-column:1/-1!important}}

/* ---------- 採用：強み・声・数字・募集要項 ---------- */
.strs{border-top:1px solid var(--ink)}
.str{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u);align-items:start;padding:calc(var(--u) * 2) 0;border-bottom:1px solid var(--line)}
.str>.str__t{grid-column:1/7}.str>.pic,.str>figure{grid-column:7/13}
.str__n{font:400 var(--f1)/var(--l2) var(--en);letter-spacing:.06em;color:var(--ink);font-stretch:normal}
.str__h{margin-top:var(--u);font:300 var(--f4)/var(--l4) var(--ja-l);letter-spacing:.02em;font-feature-settings:"palt"}
.str__t p:not(.str__n){margin-top:var(--u);max-width:none;font:400 var(--f2)/var(--l2) var(--ja);color:var(--tx)}
.str .pic{aspect-ratio:3/2;border-radius:var(--r-s)}
@media (max-width:1023px){.str>*{grid-column:1/-1!important}.str .pic{margin:var(--u) 0 0}}
.vintro{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u);align-items:end}
.vintro>*:first-child{grid-column:1/7}.vintro>*:last-child{grid-column:7/13}
.vintro__n{margin-top:var(--u);font:300 var(--f4)/var(--l4) var(--ja-l);letter-spacing:.02em}
.vintro__s{margin-top:calc(var(--u) / 2);font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.voice__tag{font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
@media (max-width:1023px){.vintro>*{grid-column:1/-1!important}}
.pswitch{gap:0 calc(var(--u) * 1.5);margin-top:var(--u);padding-top:0;border-top:1px solid var(--line)}
.pswitch a{min-height:0;padding-top:12px;font:400 var(--f2)/var(--l2) var(--ja);color:var(--tx)}
.pswitch a[aria-current]{color:var(--ink);text-decoration:none;box-shadow:inset 0 1px 0 var(--ink)}
.qas{padding:calc(var(--u) * 3) 0 var(--sec)}
.qa+.qa{margin-top:calc(var(--u) * 3)}
.split--q{--sh-fs:var(--f3)}
.sh--q .sh__h{font:500 var(--f3)/var(--l3) var(--ja);letter-spacing:.04em}
.sh--q::before,.sh--q::after{display:none}
.sh__q{margin-bottom:0;font:400 var(--f1)/var(--l2) var(--en);letter-spacing:.06em;color:var(--ink);font-stretch:normal}
.split--q>.sh--q+*{margin-top:calc(var(--l2) + var(--it-20) - var(--it-tx))}
.sh--q:has(>.sh__q){grid-template-columns:26px minmax(0,1fr)}   /* 11/07 夜：「Q.01」と「Q.02」で番号の幅が違い（この書体は等幅の数字を持たない）、横の問いの見出しの頭が 2.4px ずれていた。番号の列を 26px に決める */
.alead{font:500 var(--f3)/var(--l3) var(--ja);letter-spacing:.04em;color:var(--ink)}
.prose .alead+p{margin-top:var(--u)}
.voices{grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--u) * 2) var(--u)}
.voices--2{grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--u) * 2) var(--u)}
.voice__q{margin-top:calc(var(--u) / 2);font:300 var(--f4)/var(--l4) var(--ja-l);letter-spacing:.02em;color:var(--ink)}
.voice__who{margin-top:calc(var(--u) / 2);font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.voice__b{padding-top:calc(var(--u) / 2)}
@media (max-width:767px){.voices,.voices--2{grid-template-columns:minmax(0,1fr)}.voice__q{font-size:var(--f4);line-height:var(--l4)}}
.entry__k{font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.entry{gap:var(--u)}
.entry__b{gap:var(--u)}
/* 数字でみる：3 列。数は Neue Haas の細字 80（トップの 70 年の数と同じ系）、単位は 16 */
.figs{border-top:1px solid var(--ink)}
.fig{padding:var(--u) 0 calc(var(--u) * 1.5);border-bottom:1px solid var(--line)}
.fig dt{font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.fig dd{margin-top:var(--u);color:var(--ink)}
.fig__n{font:300 var(--f5)/1 var(--en);letter-spacing:-.01em;font-stretch:normal;color:var(--ink)}
.figs--3 .fig__n{font-size:var(--f5)}
.fig__u{font:400 var(--f2)/1 var(--ja);color:var(--ink)}
.fig__d,.fig__l{margin-top:var(--u);font:400 var(--f2)/var(--l2) var(--ja);color:var(--tx)}
.fig__l--en{font-family:var(--en);font-stretch:normal;font-size:var(--f1);letter-spacing:.06em}
.figs__note dd{font:400 var(--f1)/var(--l1) var(--ja);color:var(--tx2)}
.figs--3 .fig{padding:var(--u) var(--u) calc(var(--u) * 1.5);border-left:1px solid var(--line)}
.figs--3 .fig:nth-child(3n+1){padding-left:0;border-left:0}
@media (max-width:767px){.fig__n,.figs--3 .fig__n{font-size:var(--f5)}}

/* ---------- 電話の欄・フォーム ---------- */
.telbox{padding:0 0 calc(var(--u) * 2)}
.telbox__k{font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.telbox__n{margin-top:0;font:300 var(--f4)/var(--l4) var(--en);letter-spacing:.02em;font-stretch:normal;color:var(--ink)}
.telbox__h{margin-top:0;font:400 var(--f1)/var(--l2) var(--ja);color:var(--tx2)}
@media (hover:hover){.telbox__n:hover{color:var(--acc)}}
.wrap--form::before{background:var(--ink);margin-bottom:var(--u)}
.form{max-width:none;row-gap:var(--u)}
.form__body{row-gap:var(--u)}
.f{grid-template-columns:calc((100% - var(--u) * 11) / 12 * 3 + var(--u) * 2) minmax(0,1fr);column-gap:var(--u)}
.wrap--form .form{display:grid;grid-template-columns:minmax(0,1fr)}
.wrap--form .f__c{max-width:calc((100% - var(--u) * 8) / 9 * 6 + var(--u) * 5)}
.f__l{padding-top:15px;font:500 var(--f2)/var(--l2) var(--ja);letter-spacing:.04em;color:var(--ink)}
.req{padding:0 8px;border-radius:99px;background:var(--ink);color:#fff;font:400 var(--f1)/20px var(--ja);letter-spacing:.06em}
.opt{font:400 var(--f1)/20px var(--ja);color:var(--tx2)}
.f input[type=text],.f input[type=email],.f input[type=tel],.f textarea{height:calc(var(--u) * 2);padding:0 16px;border:1px solid var(--field);border-radius:var(--r-s);background:#fff;font:400 var(--f2)/1.5 var(--ja)}
.f textarea{height:auto;min-height:calc(var(--u) * 6);padding:14px 16px}
.f input:focus,.f textarea:focus{background:var(--bg);border-color:var(--ink)}
.choice input{border-color:var(--field)}
.choice input:checked{border-color:var(--ink);background:var(--ink);box-shadow:inset 0 0 0 5px #fff,inset 0 0 0 12px var(--ink)}
.form__send{padding-left:calc((100% - var(--u) * 11) / 12 * 3 + var(--u) * 3)}
.form__send--2{padding-left:0}
.form__msg{border:1px solid var(--ink);border-radius:var(--r-s);background:var(--bg)}
.form__errs{border-radius:var(--r-s)}
@media (hover:hover){.f input:not(:focus):not([aria-invalid]):hover,.f textarea:not(:focus):not([aria-invalid]):hover{border-color:var(--ink)}.choice label:hover input:not(:checked){border-color:var(--ink)}}
@media (max-width:767px){.f{grid-template-columns:minmax(0,1fr)}.wrap--form .f__c{max-width:none}.form__send{padding-left:0}}

/* ---------- 新着情報・記事 ---------- */
.news{border-top:1px solid var(--ink)}
.news a{grid-template-columns:calc((100% - var(--u) * 11) / 12 * 2 + var(--u)) calc((100% - var(--u) * 11) / 12 * 2 + var(--u)) minmax(0,1fr) 32px;column-gap:var(--u);align-items:baseline;padding:calc(var(--u) / 2) 0;border-bottom:1px solid var(--line)}
.news .date{font:400 var(--f1)/var(--l2) var(--en);letter-spacing:.06em;font-stretch:normal;color:var(--ink)}
.news .cat{font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.news .ttl{font:400 var(--f2)/var(--l2) var(--ja);letter-spacing:.04em;color:var(--ink)}
.news a>i{align-self:center;color:var(--ink);justify-self:end;position:relative;display:block;width:32px;height:9px;transition:transform .5s var(--soft)}
.news a>i::before{content:"";position:absolute;left:0;right:1px;top:4px;height:1px;background:currentColor}
.news a>i::after{content:"";position:absolute;right:1px;top:1px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
@media (hover:hover){.news a:hover .ttl{color:var(--acc)}.news a:hover>i{transform:translateX(6px);color:var(--acc)}}
@media (max-width:1199px){.news a{grid-template-columns:auto minmax(0,1fr) 32px}}
@media (max-width:767px){.news a{grid-template-columns:auto minmax(0,1fr)}.news a>i{display:none}}
.post .prose{max-width:none;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u)}
.post .prose>*{grid-column:1/8}
@media (max-width:1023px){.post .prose>*{grid-column:1/-1}}
.gal{gap:var(--u);margin-top:calc(var(--u) * 2)}
.gal .pic{border-radius:var(--r-s)}
.pn{margin-top:calc(var(--u) * 3);padding-top:0;border-top:1px solid var(--ink)}
.pn a{padding-top:12px;font:400 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
@media (hover:hover){.pn a:hover{color:var(--acc)}}
.post__back{margin-top:var(--u)}

/* ---------- サイトマップ・地図・個人情報 ---------- */
.smap{grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(var(--u) * 2) var(--u)}
.smap__h{padding:0 0 calc(var(--u) / 2);border-bottom:1px solid var(--ink);font:500 var(--f2)/var(--l2) var(--ja);letter-spacing:.06em}
.smap__g li a{min-height:0;padding:calc(var(--u) / 4) 0;font:400 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
@media (hover:hover){.smap__g li a:hover{color:var(--acc)}}
@media (max-width:1023px){.smap{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.smap{grid-template-columns:minmax(0,1fr)}}
.map .ddmap__frame{border:0;border-radius:var(--r-s);overflow:hidden}
.ul-p li{font:400 var(--f2)/var(--l2) var(--ja);color:var(--tx)}
.addr{font:400 var(--f2)/var(--l2) var(--ja)}

/* ---------- 会社概要の頁（co-*）：第3版の値に ---------- */
.co-sec .wrap>.sh{padding-top:var(--u)}
.co-2,.co-acc,.co-grp,.co-ph{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u);margin-top:calc(var(--u) * 2)}
.co-2>.co-dl:first-child,.co-acc__t,.co-grp__t{grid-column:1/7}
.co-2>.co-dl+.co-dl,.co-acc .map,.co-grp .co-dl--2{grid-column:7/13}
.co-i{padding:calc(var(--u) / 2) 0 calc(var(--u) / 2)}
.co-i dt{font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.co-i dd{margin-top:0;font:400 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
.co-n{font:300 var(--f3)/1 var(--en);letter-spacing:0;font-stretch:normal;color:var(--ink)}
.co-i--name dd,.co-name{font:300 var(--f4)/var(--l4) var(--ja-l);letter-spacing:.02em;font-feature-settings:"palt"}
.co-sub{margin-top:0;font:400 var(--f1)/var(--l2) var(--ja);color:var(--tx2)}
.co-sep{color:var(--line-d)}
.co-go{font:500 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
/* 企業理念：大きな一文は明朝（読ませる声。トップの灯る文・締めの一文と同じ）、添えの一文は L7 */
.co-ph{row-gap:0}
.co-ph__big{grid-column:1/-1;font:400 calc(var(--u) * 4)/calc(var(--u) * 5) var(--min);letter-spacing:.04em;color:var(--ink);font-feature-settings:"palt"}
.co-ph__t{grid-column:7/13;margin-top:calc(var(--u) * 2);max-width:none;font:400 var(--f3)/var(--l3) var(--ja);letter-spacing:.04em;color:var(--tx)}
.co-ph__pic.pic{margin-top:calc(var(--u) * 4);aspect-ratio:12/5;border-radius:var(--r)}
/* 数字の帯：4 つ割りの線（L1・L4・L7・L10） */
.co-fig{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--u);margin-top:calc(var(--u) * 2);border-top:1px solid var(--ink)}
.co-f{padding-top:var(--u)}
.co-f::before{display:none}
.co-f dd{margin-top:var(--u)}
.co-f__v{font:400 var(--f2)/1 var(--ja);color:var(--ink)}
.co-f .co-n{font-size:var(--f5);font-weight:300;letter-spacing:-.01em}
.co-tel{font:300 var(--f4)/var(--l4) var(--en);letter-spacing:.02em;font-stretch:normal;color:var(--ink)}
.co-acc .map{grid-column:7/13}
/* 沿革：年は Neue Haas の細字。左の窓（PC）は 6 列、年の並びは L7 から */
.co-his--live{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u)}
.co-his--live .co-his__pn{grid-column:1/6;top:calc(var(--hd2) + var(--u))}
.co-his--live .co-his__list{grid-column:7/13}
.co-yr{grid-template-columns:calc((100% - var(--u) * 5) / 6 * 1) minmax(0,1fr);column-gap:var(--u);padding:var(--u) 0}
.co-yr__y .num{font:300 var(--f3)/1 var(--en);letter-spacing:.02em;font-stretch:normal;color:var(--ink)}
.co-yr__y small{margin-top:8px;font:400 var(--f1)/var(--l1) var(--ja);color:var(--tx2)}
.co-yr__e{margin-top:-5px;font:500 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
.co-yr::after{background:var(--ink)}
.co-pn__y{font:300 calc(var(--u) * 4)/1 var(--en);letter-spacing:-.01em;font-stretch:normal;color:var(--ink)}
.co-his:not(.co-his--era) .co-pn__y{font-size:calc(var(--u) * 5)}
.co-sc__a,.co-sc__b{font:400 var(--f1)/1 var(--en);font-stretch:normal;letter-spacing:.06em;color:var(--tx2)}
.co-sc__fill,.co-sc__nd{background:var(--ink)}
.co-v__k{font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.co-v__k .num{font-stretch:normal;letter-spacing:.06em}
.co-v__pic{border-radius:var(--r-s)}
.co-v__h{font:500 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
.co-v__d,.co-era__d{font:400 var(--f2)/var(--l2) var(--ja);color:var(--tx)}
.co-era__k{font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.co-era__h{font:500 var(--f2)/var(--l2) var(--ja)}
.co-src summary{font:500 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
.co-src ol{font:400 var(--f1)/var(--l1) var(--ja);color:var(--tx)}
.co-src__y{font-stretch:normal;color:var(--ink)}
.co-src a{color:var(--ink);text-decoration-color:var(--line-d)}
@media (min-width:1024px){.co-src{margin-left:calc((100% - var(--u) * 11) / 12 * 6 + var(--u) * 6)}}
@media (hover:hover){.co-go:hover,.co-dl a.tel:hover,.co-src summary:hover,.co-src a:hover{color:var(--acc)}}
@media (max-width:1023px){
  .co-2>*,.co-acc>*,.co-grp>*,.co-ph>*{grid-column:1/-1!important}
  .co-fig{grid-template-columns:repeat(2,minmax(0,1fr))}
  .co-his--live{display:block}
}
@media (max-width:767px){
  .co-ph__big{font-size:var(--f4);line-height:var(--l4)}
  .co-f .co-n{font-size:var(--f4)}
  .co-yr{grid-template-columns:minmax(0,1fr)}
}

/* ---------- 年表（タカネ電業ヒストリー） ---------- */
.hist{border-top:1px solid var(--ink)}
.hist>li{grid-template-columns:calc((100% - var(--u) * 11) / 12 * 2 + var(--u)) minmax(0,1fr);column-gap:var(--u);padding:var(--u) 0;border-bottom:1px solid var(--line)}
.hist--3>li{grid-template-columns:calc((100% - var(--u) * 11) / 12 * 2 + var(--u)) calc((100% - var(--u) * 11) / 12 * 5 + var(--u) * 4) minmax(0,1fr)}
.hist__y .num{font:300 var(--f4)/1 var(--en);letter-spacing:-.01em;font-stretch:normal;color:var(--ink)}
.hist__y small{margin-top:12px;font:400 var(--f1)/var(--l1) var(--ja);color:var(--tx2)}
.hist__t{margin-top:0;font:400 var(--f2)/var(--l2) var(--ja);color:var(--tx)}
.hist__tag{margin-top:0;font:400 var(--f1)/var(--l2) var(--ja);letter-spacing:.08em;color:var(--tx2)}
.hist__e{font:500 var(--f2)/var(--l2) var(--ja);color:var(--ink)}
@media (max-width:767px){.hist>li,.hist--3>li{grid-template-columns:minmax(0,1fr);row-gap:calc(var(--u) / 2)}.hist__y .num{font-size:var(--f4)}}

/* ---------- 採用の帯（全頁・足元の上）：灰の大きな英字 → 欄名の行 → 見出し 48（L1）と絵（L7） ---------- */
.rband{padding:calc(var(--u) * 5) 0;background:var(--bg);overflow-x:clip}
.rband__in{align-items:end;row-gap:0}
.rband__k{grid-column:1/-1;height:calc(var(--u) * 5);margin:0 0 calc(var(--u) * 2) calc(var(--lsb, .062em) * -1);font:300 calc(var(--u) * 7)/calc(var(--u) * 5) var(--en);letter-spacing:-.01em;white-space:nowrap;color:var(--w1);pointer-events:none}
.rband__k::before{content:attr(data-en);content:attr(data-en) / ""}
.rband__t{grid-column:1/7;align-self:end}
.rband__h{margin:0;font:300 var(--f4)/var(--l4) var(--ja-l);letter-spacing:.02em;font-feature-settings:"palt";color:var(--ink)}
.rband__act{display:flex;flex-wrap:wrap;align-items:center;gap:var(--u) calc(var(--u) * 1.5);margin-top:calc(var(--u) * 2)}
/* 11/07 夜 揃えの見直し（なおさん「崩れてる」）：1440 でボタンと 1 つ目の文字のリンクが 1 行目、2 つ目だけが 2 行目に落ちていた（2＋1）。
   どの幅でも、ボタンは 1 行目に一つ、文字のリンクは 2 行目の L1 と L4 に（列の間も 12 列の格子に乗せる） */
@media (min-width:768px){
  .rband__act{display:grid;grid-template-columns:calc((min(100vw, var(--max)) - var(--gut) * 2 - var(--u) * 11) / 12 * 3 + var(--u) * 2) max-content;column-gap:var(--u);row-gap:var(--u);justify-content:start;align-items:center}
  .rband__act>.btn{grid-column:1/-1;justify-self:start}
  .rband__act>:not(.btn){justify-self:start;white-space:nowrap}
}
.rband__pic{grid-column:7/13;justify-self:end;width:100%;max-width:none;background:transparent}
.rband__pic img{mix-blend-mode:multiply}
/* 11/07 なおさん「出始めに白い板がくっついてる」：出る動き（.rv の opacity・transform）の間は figure で重なりが閉じ、img の multiply が地に届かず白い四角が出た。multiply を動く figure 自身に掛ける（d.css の .vg と同じ決まり） */
.rband__pic.il,.sec--paper .il{mix-blend-mode:multiply}
.rband .il,.rband .il img{background:transparent}
@media (max-width:767px){
  .rband{padding:calc(var(--u) * 3) 0}
  .rband__k{height:calc(var(--u) * 3);margin-bottom:var(--u);font-size:calc(var(--u) * 4.2);line-height:calc(var(--u) * 3)}
  .rband__t,.rband__pic{grid-column:1/-1}
  .rband__pic{margin-top:calc(var(--u) * 2)}
  .rband__act{flex-direction:column;align-items:flex-start;gap:var(--u)}
}
/* 足元の外部への案内（会社紹介動画・パンフレット）：ことわりの段の左に */
.ft__x{display:flex;flex-wrap:wrap;gap:0 var(--u)}
.ft__x a{color:var(--ftx,#C8D0D8)}

/* ---------- 指の端末の写真の視差（台本ではなく送りの時間軸で。古い端末では止まる） ---------- */
@supports (animation-timeline: view()){
  @media (hover:none) and (prefers-reduced-motion:no-preference){
    html:not([data-motion=reduce]) .is-in2 .pic:not(.pic--still) img{animation:inPx linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
  }
}
@keyframes inPx{from{translate:0 -4.6%}to{translate:0 4.6%}}

/* ---------- 動きを減らす設定（WCAG 2.3.3） ---------- */
@media (prefers-reduced-motion:reduce){
  .pgh__pic img{opacity:1!important;scale:1!important;translate:none!important;transition:none!important}
  .pgh .tabs a::after,.arw,.news a>i{transition:none!important}
  a:hover>.arw,a:hover .arw,.news a:hover>i{transform:none!important}
  .is-in2 .pic img{animation:none!important}
}
/* 先輩社員の声の問いと答え：左（L1〜5 列）に問いと写真、右（L7）に答え。答えの一言（20/30）の字の上を、問い（20/30）の字の上に */
.split--q>.qa__l{grid-column:1/6}
.split--q>.qa__l~*{grid-column:7/13;margin-top:0}
.qa__l .pic,.qa__l figure{margin-top:var(--u);width:100%;max-width:none;aspect-ratio:3/2}
.qa__l .pic--orig img{width:100%;height:100%;object-fit:cover}
@media (max-width:1023px){.split--q>.qa__l,.split--q>.qa__l~*{grid-column:1/-1}.split--q>.qa__l~*{margin-top:calc(var(--u) * 2)}}
/* 左右 2 段の見出しは、右の長い表・本文を読む間、上の帯の下に止まる（左の列が空いたままにならない。PC だけ） */
@media (min-width:1024px){.split>.sh{position:sticky;top:calc(var(--hd2) + var(--u))}}
.sh__lead .em,.sh__sub .em,.pgh__lead .em{color:inherit}
/* あいさつ（代表・取締役）：PC は左に見出しと似顔絵、右（L7）に文。1023px 以下は 1 列（見出し → 似顔絵 → 文） */
.split--msg>.sh{grid-row:2}
.split--msg>.msg__t{grid-row:2/span 2}
.split--msg>.msg__pic{grid-row:3;align-self:start}
@media (max-width:1023px){
  .split--msg>.sh,.split--msg>.msg__t,.split--msg>.msg__pic{grid-column:1/-1;grid-row:auto}
  .split--msg>.msg__pic{width:min(300px,70%);margin:0 0 calc(var(--u) * 2)}
}
/* 業務内容：左（L1・6 列）に見出しと写真、右（L7）に文と表。右の最初の字の上を、見出しの字の上に */
.split>.split__l{grid-column:1/7}
.split>.split__l~*{grid-column:7/13;margin-top:calc(var(--l2) + var(--u) + var(--it-h2) - var(--it-20))}
.split__l>.sh{border-top:0;padding-top:0}
.split__l .pic{margin-top:calc(var(--u) * 2);aspect-ratio:3/2}
@media (min-width:1024px){.split>.split__l,.split--q>.qa__l{position:sticky;top:calc(var(--hd2) + var(--u))}}
@media (max-width:1023px){.split>.split__l,.split>.split__l~*{grid-column:1/-1}.split>.split__l~*{margin-top:calc(var(--u) * 2)}}
/* 11/07 夜 揃えの見直し：右の塊の頭が 48/60 のリード（業務内容の「関東圏内の官公庁発注の…」）の時は、左の見出し（48/60）と字の大きさが同じなので、
   20 の字のための寄せ（--it-h2 − --it-20＝2.25px）を引かない。前は右の見出しだけ 2.2px 下がっていた */
@media (min-width:1024px){.split>.split__l~.stack:not(.stack--pic):has(>.biz__t:first-child>.biz__lead:first-child){margin-top:calc(var(--l2) + var(--u))}}
/* お問い合わせ・応募のフォーム：左（L1・止まる）に電話の欄、右（L7）にフォーム（項目名は欄の上） */
.wrap--form{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u);align-items:start}
.wrap--form::before{grid-column:1/-1;margin-bottom:var(--u)}
.wrap--form>.telbox{grid-column:1/6;padding:0}
.wrap--form>.form{grid-column:7/13}
.wrap--form .f{grid-template-columns:minmax(0,1fr);row-gap:8px}
.wrap--form .f__l{padding-top:0}
.wrap--form .f__c{max-width:none}
.wrap--form .form__send{padding-left:0}
@media (min-width:1024px){.wrap--form>.telbox{position:sticky;top:calc(var(--hd2) + var(--u))}}
@media (max-width:1023px){.wrap--form>.telbox,.wrap--form>.form{grid-column:1/-1}.wrap--form>.telbox{margin-bottom:calc(var(--u) * 2)}}
/* 新着情報の記事：左（L1・止まる）に前後の記事と一覧への戻り、右（L7）に本文と写真 */
.post__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u);align-items:start;border-top:1px solid var(--ink);padding-top:var(--u)}
.post__m{grid-column:1/6}
.post__g>.post{grid-column:7/13}
.post .prose{display:block;max-width:none}
.post__m .pn{display:flex;flex-direction:column;gap:0;margin-top:0;padding-top:0;border-top:0}
.post__m .pn a{max-width:none;padding:calc(var(--u) / 4) 0;border-bottom:1px solid var(--line);text-align:left;margin-left:0}
.post__m .pn>span:empty{display:none}
.post__m .post__back{margin-top:var(--u)}
.post .gal{grid-template-columns:repeat(2,minmax(0,1fr))}
.post .gal--4{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}
@media (min-width:1024px){.post__m{position:sticky;top:calc(var(--hd2) + var(--u))}}
@media (max-width:1023px){.post__m,.post__g>.post{grid-column:1/-1}.post__g>.post{order:-1}.post__m{margin-top:calc(var(--u) * 2)}}
/* 個人情報保護：左（L1・止まる）に目次、右（L7）に本文 */
.doc{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--u);align-items:start;border-top:1px solid var(--ink);padding-top:var(--u)}
.doc__toc{grid-column:1/6}
.doc>.prose{grid-column:7/13;max-width:none}
.doc__toc a{display:flex;gap:calc(var(--u) / 2);align-items:baseline;padding:calc(var(--u) / 4) 0;border-bottom:1px solid var(--line);font:400 var(--f2)/var(--l2) var(--ja);letter-spacing:.04em;color:var(--ink);transition:color .45s var(--soft)}
.doc__n{flex:none;font:400 var(--f1)/1 var(--en);letter-spacing:.06em;color:var(--tx2);font-variant-numeric:lining-nums tabular-nums}
@media (hover:hover){.doc__toc a:hover{color:var(--acc)}}
.doc>.prose>p:first-child{margin-top:0}
.doc .prose__h2:first-of-type{margin-top:calc(var(--u) * 2)}
.doc .prose__h2{scroll-margin-top:calc(var(--hd2) + var(--u))}
@media (min-width:1024px){.doc__toc{position:sticky;top:calc(var(--hd2) + var(--u))}}
@media (max-width:1023px){.doc__toc,.doc>.prose{grid-column:1/-1}.doc__toc{margin-bottom:calc(var(--u) * 2)}}
/* 携帯のスタッフ紹介：似顔絵（5）の右下に部署と名前（7）、紹介文は全幅（細い列に詰めない） */
@media (max-width:767px){
  .staff{grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:1fr auto;row-gap:0;align-items:end}
  .staff .il{grid-column:1;grid-row:1/3}
  .staff__t{display:contents}
  .staff__r{grid-column:2;grid-row:1;align-self:end}
  .staff__n{grid-column:2;grid-row:2}
  .staff__t p:last-child{grid-column:1/-1;grid-row:3;margin-top:calc(var(--u) / 2)}
}
.split__l .pic{width:100%;max-width:none}
/* 企業理念の帯の写真：頁の扉の窓と同じ、格子の端（L1〜L13）にそろえた角の丸い窓 */
.co-sec--ph>.co-ph__pic.pic{width:auto;max-width:calc(var(--max) - var(--gut) * 2);margin:calc(var(--u) * 4) var(--gut) 0;border-radius:var(--r)}
@media (min-width:1600px){.co-sec--ph>.co-ph__pic.pic{margin-inline:auto}}
@media (max-width:767px){.co-sec--ph>.co-ph__pic.pic{border-radius:var(--r-s)}}
.is-in2 .msg__t .prose__h{font-weight:300;font-family:var(--ja-l)}
.doc .ul-p{padding-left:0;margin-left:0;list-style:disc outside}   /* 箇条の印は列の間へ出し、字の頭を L7 に（ぶら下げ） */

/* ===== 動きを減らす設定の写し（kit tools/reduce_copy.py が作る。ここは直さない） ===== */
html[data-motion=reduce] .rv,html[data-motion=reduce] .pic.rv,html[data-motion=reduce] .il.rv,html[data-motion=reduce] .rv.has-ln .ln-u{opacity:1 !important;transform:none !important;transition:none !important}
html[data-motion=reduce] .pic img{transform:none !important;transition:none !important}
html[data-motion=reduce] .pgh__pic img{opacity:1;scale:1;translate:none;transition:none}
html[data-motion=reduce] .pic>picture,html[data-motion=reduce] .pic>.pic__in,html[data-motion=reduce] .il picture,html[data-motion=reduce] .gal__i .pic>img,html[data-motion=reduce] .vid .pic>img{transition:none}
html[data-motion=reduce] .hd{transition:none}
html[data-motion=reduce] .co-i.rv::before,html[data-motion=reduce] .co-yr::after,html[data-motion=reduce] .co-sc__fill,html[data-motion=reduce] .co-sc__nd,html[data-motion=reduce] .co-v,html[data-motion=reduce] .co-v__i,html[data-motion=reduce] .co-v__pic img,html[data-motion=reduce] .co-pn__dg>span,html[data-motion=reduce] .co-pn__wa>span{transition:none !important}
html[data-motion=reduce] .js .co-f.rv .co-d{opacity:1;translate:none;transition:none}
html[data-motion=reduce] .js .co-i.rv:not(.is-in)::before{transform:none}
html[data-motion=reduce] .co-v__i,html[data-motion=reduce] .co-v__pic img{translate:none;scale:1}
html[data-motion=reduce] .voice:hover .il picture,html[data-motion=reduce] .gal__i:hover .pic>picture,html[data-motion=reduce] .gal__i:hover .pic>img,html[data-motion=reduce] .vid:hover .pic>img{scale:1!important}
html[data-motion=reduce]{scroll-behavior:auto!important}
html[data-motion=reduce] *,html[data-motion=reduce] *::before,html[data-motion=reduce] *::after{transition-duration:.15s!important;transition-property:color,background-color,border-color,opacity!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
html[data-motion=reduce] .pgh__pic img{opacity:1!important;scale:1!important;translate:none!important;transition:none!important}
html[data-motion=reduce] .pgh .tabs a::after,html[data-motion=reduce] .arw,html[data-motion=reduce] .news a>i{transition:none!important}
html[data-motion=reduce] a:hover>.arw,html[data-motion=reduce] a:hover .arw,html[data-motion=reduce] .news a:hover>i{transform:none!important}
html[data-motion=reduce] .is-in2 .pic img{animation:none!important}
/* ===== 写しここまで ===== */

/* 11/07 なおさん「下が揃ってない」：挨拶の左の見出しと右の題（2 行）の下端が 9px ずれていた（.split>.sh+* の上余白が右の塊に掛かっていた） */
.split.split--msg>.sh+.msg__t{margin-top:0}

/* 11/07 マヤ（Safari で測った）：前後の記事の行き先が「…行いま／した」「…行いました／→」と 1〜2 字だけ次の行に落ちた。行の長さをそろえて折る */
.pn a{text-wrap-style:balance}
/* 11/07 マヤ（Safari・Chrome とも）：社員の名前（T. MURAKAMI ほか）が .is-in2 h3 の和文の書体に負けてヒラギノで組まれていた。欧文の書体に戻し、大文字だけの語なので字間を少し開ける */
.is-in2 .staff__n{font-family:var(--en);letter-spacing:.08em}
/* 11/07 カヲル：総務部のスタッフ紹介。右の文の下に、朝の事務所の模型のループ（総務と現場の社員が集まる）。左の集合の絵は 2 行にまたがり、
   文は絵の上の端から、ループはその下に（文の内容「現場と部署をつなぎ、ひとつにまとめる」の絵）。説明は枠のすぐ下。携帯は文 → ループの順 */
.grp--mv{grid-template-rows:auto 1fr;row-gap:calc(var(--u) * 2);align-items:start}
.grp--mv>.grp__pic{grid-row:1/3;align-self:end}
.grp--mv>.prose{grid-row:1}
.grp__mv{grid-column:7/13;grid-row:2;margin:0;align-self:end}
.grp__mvf{position:relative;aspect-ratio:3/2;overflow:hidden;border-radius:var(--r-s,12px)}
.grp__mvf>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.grp__cap{margin-top:calc(var(--u) / 2)}
@media (max-width:767px){.grp--mv>.grp__pic,.grp--mv>.prose,.grp__mv{grid-row:auto}}