/* 採用：仕事を知る — B3（HOW WE WORK・SABAESEIKI の帯・FIELDS）2026-10-07
   正: design/指示書_セクション.md W・M・S・SP 表／指示書_v1.md §6 E-5・E-6／裁定 M2・M7。値は rem（PC は rem＝幅/192・Figma px ÷ 10）。位置は特記なければセクション上端からの rem・x はページ左端から。
   CSS は全部 .rc-page-work の下に閉じる。共通の marquee（rc-common.css 212〜219・356〜359 行）は読むだけ＝このファイルの `.rc-page-work .wk-marquee …`（詳細度 0,3,0）で上書きする（!important なし）。
   文字の下限は rc-work-base.css の --wk-t-*（1920 では今と同じ大きさ。max の px は 1920 の大きさ以下）。 */

/* ------------------------------------------------------------------
   黒い炎の縁（HOW WE WORK・FIELDS の上端）。Figma Mask group −99,上端 2118×574（黒は 33rem から）。
   上 33rem は透明＝前（.wk-body）のクリームが透ける。縁の下は section の黒（--wk-edge-cv から）。縁は section の上端から。
   ------------------------------------------------------------------ */
.rc-page-work .wk-edge{position:absolute;left:0;top:0;width:100%;height:57.4rem;pointer-events:none;
  background:url(../../images/recruit/rc-work-edge-black.webp) -9.9rem 0/211.8rem 57.4rem no-repeat}   /* 箱は section の幅いっぱい（はみ出す絵は背景＝scrollWidth を増やさない）。絵は left −9.9rem・211.8×57.4rem */

/* ==================================================================
   W. HOW WE WORK（#flow・8049〜9867・高さ 181.8rem）
   ================================================================== */
.rc-page-work .wk-flow{position:relative;height:181.8rem;overflow-x:clip;background:linear-gradient(to bottom,transparent var(--wk-edge-cv),var(--wk-black) var(--wk-edge-cv))}
.rc-page-work .wk-flow__in{position:relative;height:100%}   /* 縁（absolute）より前に描く */
/* FB-05（2026-10-09・実装FBシート No.5）HOW WE WORK は 4 課の詳細の下。黒い炎の縁を前の職種（詳細の最後の 1 つ）の地に重ねる＝縁の透けた所に職種の地（金の網点）が見える。
   重ねる量＝縁の黒が始まる所（--wk-edge-cv。PC 33rem・SP は幅の 17.1875%＝.wk-flow 自身の値）。前の職種は同じ量だけ下の余白を足し、地の画像を下端にそろえる（画像の上は無地＝継ぎ目なし）。全体の高さは変わらない */
.rc-page-work .wk-detail + .wk-flow{margin-top:calc(var(--wk-edge-cv) * -1)}
@media (min-width:1024px) and (orientation:landscape), (min-width:1367px){
  .rc-page-work .wk-detail:has(+ .wk-flow) > .wk-field:last-child{padding-bottom:calc(19.85rem + var(--wk-edge-cv));background-position:0 100%}
}

/* W-2 頭（左 29.4rem）: eyebrow top 48.6rem → h2 top 56.1rem（eyebrow は rc-work-base.css の .wk-eyebrow／--dark） */
.rc-page-work .wk-flow__head{position:absolute;left:29.4rem;top:48.6rem;width:110rem}
.rc-page-work .wk-flow__title{margin:2.5rem 0 0;font:700 9.6rem/13.18rem var(--serif);letter-spacing:.132rem;color:var(--wk-paper);white-space:nowrap}

/* W-3 工程 5 つ。ol は section の 94.0rem から（.wk-flow__in の padding-top）。li の原点＝Figma の形のノードの左（x）・ol の上端（y）。
   説明（desc）は文の流れの中に置き（li の padding-top＝説明の top）、li は min-height:30rem＝縮小幅で文字が下限（11px）で大きくなっても li が伸びて形（SVG・箱いっぱい）もいっしょに伸びる。1920 は Figma と同じ 30rem。 */
.rc-page-work .wk-flow__in{padding-top:94rem}
.rc-page-work .wk-flow__steps{position:relative;display:flex;align-items:stretch;width:192rem;margin:0;padding:0 0 0 24.631rem;list-style:none}   /* FLOW-GAP（2026-11-02・先方FB「ここの間隔を等間隔にしたい」）: 01 と 02 の形だけ 3rem 重なり、02〜05 は 2rem 空いていた → 01 だけ 5.02rem 左へ（29.651→24.631rem）、01 の margin-right −2.995→2.025rem で 02 以降の位置はそのまま。形の間は 4 か所とも 2rem */
.rc-page-work .wk-flow__step{position:relative;flex:none;width:30.002rem;min-height:30rem;margin:0;padding:17.873rem 0 2.6rem 7.878rem}   /* FLOW-PAD（2026-11-02・先方FB⑩で 01 の文が長くなり、1280 で最後の行が矢印の下の線まで 8px）: 下の余白 1→2.6rem（5 つとも同じ高さで伸びる） */
.rc-page-work .wk-flow__step--1{width:24.7rem;margin-right:2.025rem;padding-left:4.274rem}   /* 形（24.7rem）が li からはみ出さない。次の li の x（51.356rem）は変えない（FLOW-GAP: 左端 24.631＋24.7＋2.025） */
.rc-page-work .wk-flow__step--5{width:28rem}
/* 形（A2 の書き出し寸法で置く＝geometry.json flow_shapes.placements。SVG は preserveAspectRatio="none"・線は non-scaling-stroke。高さは li に合わせて伸びる） */
.rc-page-work .wk-flow__shape{position:absolute;left:-.068rem;top:4.232rem;display:block;width:28rem;height:calc(100% - 3.2rem);max-width:none}
.rc-page-work .wk-flow__step--1 .wk-flow__shape{left:-.042rem;top:3.31rem;width:24.7rem;height:calc(100% - 3.1rem)}
/* 番号・名前（絶対配置）・説明（流れの中） */
.rc-page-work .wk-flow__no{position:absolute;left:7.878rem;top:-.65rem;margin:0;font:700 10.943rem/10.943rem var(--serif);color:#fff;white-space:nowrap}
.rc-page-work .wk-flow__name{position:absolute;left:7.878rem;top:11.649rem;margin:0;font:700 3.352rem/4.8rem var(--serif);color:var(--wk-gold);white-space:nowrap}
.rc-page-work .wk-flow__desc{position:relative;width:17.347rem;margin:0;font:600 var(--wk-t-flow)/max(2.26rem,1.65em) var(--serif);color:#fff}
.rc-page-work .wk-flow__step--1 :is(.wk-flow__no,.wk-flow__name){left:4.274rem}
.rc-page-work .wk-flow__step--1 .wk-flow__desc{width:16.006rem}
.rc-page-work .wk-flow__step--3 .wk-flow__desc{width:15.084rem}
/* 縦の英字（飾り・不透明度 .2・上から下へ読む）。位置は Figma のインクで合わせる（箱は回転前の値）。ORDER は上揃え・DESIGN は中央・MACHINING／ASSEMBLY／DELIVERY は右揃え＝下に寄る。
   MACHINING は Figma どおり 2 列（MACHIN／ING）に折る＝箱の長さ（19rem）を MACHIN（182px）以上・MACHINI（199px）未満にして word-break:break-all（1 列の行送りは字の高さ 1.448 倍）。 */
.rc-page-work .wk-flow__en{position:absolute;margin:0;writing-mode:vertical-rl;white-space:normal;word-break:break-all;font:700 4.724rem/1.448 var(--serif);color:var(--wk-gold);opacity:.2;pointer-events:none}
.rc-page-work .wk-flow__step--1 .wk-flow__en{left:11.9rem;top:12.6rem;height:19rem;text-align:start}
.rc-page-work .wk-flow__step--2 .wk-flow__en{left:15.7rem;top:9.2rem;height:24.6rem;text-align:center}
.rc-page-work .wk-flow__step--3 .wk-flow__en{left:13.3rem;top:11.9rem;height:19rem;text-align:end;font-size:4.023rem}
.rc-page-work .wk-flow__step--4 .wk-flow__en{left:16.1rem;top:8.7rem;height:23rem;text-align:end;font-size:4.023rem}
.rc-page-work .wk-flow__step--5 .wk-flow__en{left:16.2rem;top:8.9rem;height:22rem;text-align:end;font-size:4.023rem}

/* 矢印の出方（2026-10-15・本人「01 から 02 が飛び出してきて、02 から 03 …が飛び出すようなアニメーション」）
   PC＝01 が先に出て、その後ろから 02 が右へ飛び出し、次は 02 の後ろから 03…と 05 まで連鎖する（前の矢印の位置から自分の位置まで滑り出る）。SP＝同じ連鎖を下向き（01 の後ろから 02 が下へ出る…）。形は下の SP 節。
   作りは rc-work-fields.css の F-10（カードを下からビュン）と同じ: rc-work.js が .wk-flow__steps に .is-armed（隠す合図）、矢印 li の上端が画面の上から 85% を越えたら li に .is-up（1 回だけ）。
   JS が li ごとに、①前の li の位置までの距離 --wk-fx／--wk-fy（出発点）②同じタイミングで出る中での順番ぶんの遅れ（transition-delay）を入れる。
   後ろから出る見せ方＝前の矢印を手前（z-index 降順）にし、PC は形の黒い面（::before）で後ろの矢印の線・文字を隠す（SP は形の黒い面が元からある）。出る前の矢印は透明で、動き出す瞬間に見える。
   共通の .reveal は 6 秒の保険で画面外でも先に出てしまうので使わない＝ol の .reveal は止めて（下の S 節 FIELDS の地図と同じ）、動かすのは li だけ。JS が動かない・no-motion・reduced では最初から全部出ている */
html.motion .rc-site .wk-flow__steps.reveal{opacity:1;transform:none}
html.motion .rc-page-work .wk-flow__steps.is-armed{--wk-pop:cubic-bezier(.16,1,.3,1)}   /* 初速が速く、先でぴたっと止まる＝飛び出す */
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step{transition:transform .9s var(--wk-pop),opacity .01s linear}   /* 透明→不透明は動き出す瞬間に一度で（前の矢印の後ろに隠れた位置から） */
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step:not(.is-up){opacity:0;transform:translateX(var(--wk-fx,-30rem))}
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step.is-up{opacity:1;transform:none}
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step:first-child{transition:transform .8s var(--wk-pop),opacity .6s var(--ease)}   /* 最初の 1 つ（01）だけは後ろに隠れる相手がいない＝左から静かに出る */
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step:first-child:not(.is-up){transform:translateX(-6rem)}
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step--1{z-index:5}
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step--2{z-index:4}
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step--3{z-index:3}
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step--4{z-index:2}
html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step--5{z-index:1}
/* PC: 形の黒い面（img.wk-flow__shape と同じ位置・同じ形。SVG の座標を % にした。01＝五角形・02〜05＝矢羽根）。SP は SP 節の ::before／::after が形そのもの */
@media (min-width:1024px) and (orientation:landscape), (min-width:1367px){
  html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step::before{content:"";position:absolute;z-index:-1;left:-.068rem;top:4.232rem;width:28rem;height:calc(100% - 3.2rem);background:var(--wk-black);pointer-events:none;
    clip-path:polygon(26.28% 53.78%,2.34% 99.59%,73.57% 99.59%,99.61% 53.78%,73.57% .16%,.24% .16%)}
  html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step--1::before{left:-.042rem;top:3.31rem;width:24.7rem;height:calc(100% - 3.1rem);clip-path:polygon(69.38% .16%,.17% .16%,.17% 99.53%,69.38% 99.53%,99.58% 53.63%)}
}
@media (prefers-reduced-motion:reduce){
  html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step{opacity:1!important;transform:none!important;transition:none!important}
}
@media print{
  html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step{opacity:1!important;transform:none!important}
}

/* W-5 CONTROL の行（線 top 131.571rem・left 29.4rem・幅 139.263rem）。工程の下端（124rem）から 7.571rem。工程が伸びたらいっしょに下がる */
.rc-page-work .wk-flow__ctl{position:relative;width:139.263rem;height:14rem;margin:7.571rem 0 0 29.4rem}
.rc-page-work .wk-flow__ctl::before{content:"";position:absolute;left:0;top:0;width:100%;height:max(.093rem,1px);background:#fff}
.rc-page-work .wk-flow__ctl-en{position:absolute;left:0;top:1.95rem;margin:0;font:900 3.307rem/10.33rem var(--serif);letter-spacing:.103rem;color:#fff;white-space:nowrap}
.rc-page-work .wk-flow__ctl-t{position:absolute;left:22.701rem;top:3.938rem;width:105.906rem;margin:0;font:900 var(--wk-t-ctl)/max(3.24rem,1.7em) var(--serif);letter-spacing:.046rem;color:#fff}
/* 2026-10-30 先方FB（WORK FLOW）:
   WK-FLOW-NAME「調達・加工・測定」: 工程の名前（nowrap）が 6 字を超えると矢印の幅（約 21.6rem）からはみ出して隣の矢印にかかる＝字数（--wk-nl・flow.php）で割った大きさまでだけ小さく。6 字以下は前と同じ 3.352rem
   WK-FLOW-CTL「AFTER SUPPORT」: 下の行の英字が長いと右の文（left 22.701rem 固定）に重なる＝PC は横並びの flex にして、文は英字の右（英字が短いときは前と同じ 22.701rem から） */
@media (min-width:1024px) and (orientation:landscape), (min-width:1367px){
  .rc-page-work .wk-flow__name{font-size:min(3.352rem,calc(21.6rem / var(--wk-nl,1)))}
  .rc-page-work .wk-flow__ctl{display:flex;align-items:flex-start}
  .rc-page-work .wk-flow__ctl-en{position:relative;left:auto;flex:none;min-width:19.701rem;margin-right:3rem}
  .rc-page-work .wk-flow__ctl-t{position:relative;left:auto;flex:1 1 auto;width:auto;max-width:105.906rem}
}
/* FB-04（2026-10-09・実装FBシート No.4「1024〜1280 で文字に下限」）HOW WE WORK の説明は 14px 以上（--wk-t-flow は rc-work-base.css）。大きくなって「す。」だけの行ができないよう文節で折る（1024〜1280 だけ） */
@media (min-width:1024px) and (max-width:1280px) and (orientation:landscape){
  .rc-page-work .wk-flow__desc{word-break:auto-phrase;text-wrap:balance}   /* balance＝行の長さをそろえる（pretty だけでは「人を」だけの行が残った）。CONTROL の文も 1024 で「ます。」だけの行ができるので pretty */
  .rc-page-work .wk-flow__ctl-t{word-break:auto-phrase;text-wrap:pretty}
}

/* ==================================================================
   M. SABAESEIKI の帯（.wk-marquee・14645〜14917・高さ 27.2rem）。共通 marquee を見た目だけ上書き（流れ・複製・静止は共通の rc-common.js・rc-common.css のまま）
   ================================================================== */
.rc-page-work .wk-marquee{position:relative;height:27.2rem;background:var(--wk-paper);overflow:hidden}
.rc-page-work .wk-marquee .rc-marquee{height:27.2rem}
.rc-page-work .wk-marquee .rc-marquee__s{display:none}   /* Figma に炎の S は無い */
.rc-page-work .wk-marquee .rc-marquee__track{left:0}
.rc-page-work .wk-marquee .rc-marquee__set{align-self:flex-start;font:600 23.368rem/27.2rem var(--cormorant);letter-spacing:1.402rem;margin-top:-1.8rem;
  -webkit-text-stroke:max(.312rem,2px) var(--wk-gold);paint-order:stroke fill}   /* 中は共通の --mq-fill（#f0ede6）。外側だけ金の線＝Figma 外側 1.56px */

/* ==================================================================
   S. FIELDS（#industries・14917〜17070・高さ 215.3rem）
   ================================================================== */
.rc-page-work .wk-ind{position:relative;height:215.3rem;overflow-x:clip;background:linear-gradient(to bottom,transparent var(--wk-edge-cv),var(--wk-black) var(--wk-edge-cv))}
/* S-2 周りの写真 6 枚。包みの不透明度 .5 は 1 つの重ね合わせ（重なった 3 と 5 が二重に透けない）。写真ごとの不透明度は 2 .64・3 .59・6 .42 */
.rc-page-work .wk-ind__photos{position:absolute;left:0;top:0;width:100%;height:100%;overflow:clip;opacity:.5;pointer-events:none}   /* 左右にはみ出す写真（1・3・5）はここで切る（Figma の frame と同じ） */
.rc-page-work .wk-ind__ph{position:absolute;display:block;overflow:hidden}
.rc-page-work .wk-ind__img{display:block;width:100%;height:100%;object-fit:cover;max-width:none}
.rc-page-work .wk-ind__ph--1{left:-2.6rem;top:54.398rem;width:50.04rem;height:31.261rem}
.rc-page-work .wk-ind__ph--2{left:16.3rem;top:131.4rem;width:37.068rem;height:37.782rem;opacity:.64}
.rc-page-work .wk-ind__ph--3{left:158.527rem;top:55.998rem;width:44.073rem;height:43.65rem;opacity:.59}
.rc-page-work .wk-ind__ph--4{left:7.276rem;top:90.457rem;width:30.259rem;height:35.984rem}
.rc-page-work .wk-ind__ph--5{left:146.848rem;top:89.898rem;width:53.618rem;height:44.464rem}
.rc-page-work .wk-ind__ph--6{left:136.2rem;top:140.2rem;width:50.921rem;height:32.902rem;opacity:.42}
/* S-3 頭（見出しは行頭の NBSP 2 つで Figma の光学的な中央に合う＝消さない） */
.rc-page-work .wk-ind__head{position:absolute;left:0;top:0;width:100%;height:90rem;pointer-events:none}
.rc-page-work .wk-ind__title{position:absolute;left:33.3rem;top:43.07rem;width:125.4rem;margin:0;padding-left:.132rem;font:700 7.7rem/12.18rem var(--serif);letter-spacing:.132rem;color:var(--wk-paper);text-align:center;white-space:nowrap}
.rc-page-work .wk-ind__lead{position:absolute;left:29.4rem;top:72.5rem;width:133.2rem;margin:0;padding-left:.132rem;font:500 2.5rem/6.18rem var(--serif);letter-spacing:.132rem;color:#fff;text-align:center;white-space:nowrap}
/* SEL-B01（2026-10-14・文字をなぞって選べるように）原因: 上の .wk-ind__head が pointer-events:none（飾りの写真や箱にかぶらないため）で、中の見出し .wk-ind__title・リード .wk-ind__lead も none を受け継いでいた＝マウスが下の section に抜けて選べなかった。この 2 つだけ auto に戻す（箱は押せる物・hover の物と重ならない＝conflict_b.js で確認）。見た目・位置は変えない */
.rc-page-work .wk-ind__title,.rc-page-work .wk-ind__lead,.rc-page-work .wk-ind__note{pointer-events:auto}
/* FB1015-06（2026-10-15）: リードの下のお客様の文言。リードと同じ系統（明朝・白・中央）で一回り小さく。PC は top 84.4rem（リード 2 行の下〜箱の上 93.84rem の間） */
.rc-page-work .wk-ind__note{position:absolute;left:29.4rem;top:85.8rem;width:133.2rem;margin:0;padding:0 14rem;box-sizing:border-box;font:500 1.9rem/3.1rem var(--serif);letter-spacing:.08rem;color:rgba(255,255,255,.92);text-align:center;text-wrap:balance}
/* WK-IND-LEAD（2026-10-30・先方FB「ここの2行の行間つめてほしい」）: リード 2 行の行送り 6.18rem → 4.2rem。2 行目の位置（下の文との間）はそのままにして、1 行目を下げる（top 72.5 → 74.48rem）。SP は前から 1.9 のまま
   WK-IND-NOTE（同「改行位置」）: 下の文は文節の切れ目（industries.php の <wbr>）だけで折る＝「そうい／う」のように言葉の途中で切れない。1 つの文節が行より長いときだけ途中で折る（anywhere） */
.rc-page-work .wk-ind__lead{top:74.48rem;line-height:4.2rem}
.rc-page-work .wk-ind__note{word-break:keep-all;overflow-wrap:anywhere}
@media (min-width:1024px) and (max-width:1280px) and (orientation:landscape){
  /* 1024〜1280 は下の文が 3 行になり、上の箱（01）に 7px かかっていた（前から）。行間を詰めて空いた分（1.98rem）、リードと下の文をそろって上へ＝リードの 1 行目は前の位置 */
  .rc-page-work .wk-ind__lead{top:72.5rem}
  .rc-page-work .wk-ind__note{top:83.82rem}
}
/* S-4 6 つの産業の箱（25.263×24.052rem）。map の原点＝箱 1 と 2 の左上の外接（左 56.438rem・上 93.84rem） */
.rc-page-work .wk-ind__map{position:absolute;left:56.438rem;top:93.84rem;width:79.123rem;height:75.719rem}
.rc-page-work .wk-ind__logo{position:absolute;left:30.772rem;top:32.544rem;display:block;width:18.79rem;height:10.299rem;max-width:none}
.rc-page-work .wk-ind__list{margin:0;padding:0;list-style:none}
.rc-page-work .wk-ind__item{--wk-ci:.777rem;--wk-cw:1.016rem;--wk-ch:1.137rem;--wk-cs:max(.175rem,1px);--wk-cc:#fff;position:absolute;width:25.263rem;min-height:24.052rem;height:auto;margin:0;padding:12.7rem 0 3.15rem}   /* 名前・説明は文の流れ（padding-top＝名前の top 12.7rem）。1920 は高さ 24.052rem のまま・縮小幅で文字が下限で大きくなったら箱が伸びる（面は箱に付いて伸びる） */ /* 本人 2026-10-08「ホバーしてないのに浮いてる」→ ホバー前は面の角に沿わせる（カードの箱 rc-work-fields.css 50 行の −.1rem と同じ考え方） */
.rc-page-work .wk-ind__item--at-ul{left:0;bottom:41.79rem}   /* 上段の左上・右上は下端（33.929rem）で止める＝縮小幅で箱が伸びたら上へ伸び、下段の左下・右下に近づかない（1920 は top 9.877rem と同じ） */
.rc-page-work .wk-ind__item--at-t{left:26.93rem;top:0}
.rc-page-work .wk-ind__item--at-ur{left:53.86rem;bottom:41.79rem}
.rc-page-work .wk-ind__item--at-lr{left:53.86rem;top:40.351rem}
.rc-page-work .wk-ind__item--at-b{left:26.93rem;top:51.667rem}
.rc-page-work .wk-ind__item--at-ll{left:0;top:40.351rem}
/* WK-IND-ORDER（2026-10-30・先方FB「01 を一番上からスタートで」）: 置き場所は並びの位置の class（--at-: 上 t → 右上 ur → 右下 lr → 下 b → 左下 ll → 左上 ul＝時計回り。industries.php）。
   前は欄の番号 --1〜6（左上から時計回り）で置いていた。--1〜6 は名前の字間・説明の幅（下の S-5）に使う＝その産業の字についていく */
/* S-5 箱の中。面は #655537（不透明）＋白の内側の線。番号の MULTIPLY は不透明な面の上で効く（.reveal の箱の中でも相手が変わらない） */
.rc-page-work .wk-ind__item::before{content:"";position:absolute;left:.877rem;top:.878rem;right:.877rem;bottom:.878rem;background:var(--wk-ind-box);box-shadow:inset 0 0 0 max(.094rem,1px) #fff}
.rc-page-work .wk-ind__no{position:absolute;left:1.053rem;top:0;margin:0;font:900 8.557rem/8.86rem var(--serif);color:var(--wk-num);mix-blend-mode:multiply;white-space:nowrap}
.rc-page-work .wk-ind__icon{position:absolute;left:9.079rem;top:4.403rem;display:block;width:7.105rem;height:7.105rem;max-width:none}
.rc-page-work .wk-ind__name{position:relative;display:block;width:16.667rem;margin:0 auto;font:900 2.67rem/max(3.36rem,1.25em) var(--serif);color:#fff;text-align:center;white-space:nowrap}
.rc-page-work .wk-ind__item--2 .wk-ind__name,.rc-page-work .wk-ind__item--5 .wk-ind__name{letter-spacing:.267rem;padding-left:.267rem}
.rc-page-work .wk-ind__item--4 .wk-ind__name{letter-spacing:.641rem;padding-left:.641rem}
.rc-page-work .wk-ind__item--6 .wk-ind__name{letter-spacing:.721rem;padding-left:.721rem}
/* 説明: 幅は Figma の文字の箱（14.649rem＝13.16px の 11.13 字分）。縮小幅で文字が 12px の下限で大きくなっても 1 行の字数が変わらないよう em の幅も取る（箱の中に収まる範囲で）。行送りも字の大きさに合わせて下限 */
.rc-page-work .wk-ind__desc{position:relative;display:block;width:min(max(14.649rem,11.13em),calc(100% - 3rem));margin:.54rem auto 0;font:600 max(1.316rem,12px)/max(2.15rem,1.55em) var(--serif);color:var(--wk-light);text-align:center}
.rc-page-work .wk-ind__item--2 .wk-ind__desc{width:min(max(11.579rem,8.8em),calc(100% - 3rem))}
.rc-page-work .wk-ind__item--5 .wk-ind__desc{width:min(max(12.807rem,9.73em),calc(100% - 3rem))}
.rc-page-work .wk-ind__item--6 .wk-ind__desc{width:min(max(16.667rem,12.67em),calc(100% - 3rem))}
/* FB-04（2026-10-09・実装FBシート No.4「1024〜1280 で文字に下限」）FIELDS のリードと説明を 14px 以上に（1024〜1280 だけ）。説明が 14px になると行数が箱ごとに変わるので、6 つの箱の高さを「説明の最大行数 N」でそろえる
   （19.75rem＝上の余白 12.7＋名前の行 3.36＋.54＋下 3.15、21.7px＝14px×1.55 の行送り）。範囲は 8px 刻みで測って決めた（README の表）。前の 1024〜1241px の「3 行ぶん」の規則（12px 下限用）はこの塊に置き換えた */
@media (min-width:1024px) and (max-width:1280px) and (orientation:landscape){
  .rc-page-work .wk-ind__lead{font-size:max(2.5rem,14px)}
  .rc-page-work .wk-ind__note{font-size:max(1.9rem,14px)}
  .rc-page-work .wk-ind__desc{font-size:max(1.316rem,14px);line-height:max(2.15rem,1.55em);word-break:auto-phrase;text-wrap:balance}
}
@media (min-width:1024px) and (max-width:1086px) and (orientation:landscape){
  .rc-page-work .wk-ind__item{min-height:calc(19.75rem + 4 * 21.7px)}   /* 説明の最大行数 N=4（06 が 4 行）。1024〜1086px を 1px 刻みで測った */
  .rc-page-work .wk-ind__logo{top:calc(32.544rem + 24px)}   /* 箱が 1 行ぶん（21.7px）高くなるので、真ん中の列の 02 の下端がロゴに 18px かかる＝ロゴを 24px 下げる（05 の上端とは 23px 空く） */
}
@media (min-width:1087px) and (max-width:1280px) and (orientation:landscape){
  .rc-page-work .wk-ind__item{min-height:calc(19.75rem + 3 * 21.7px)}   /* N=3（1087〜1280px。1208px 以上は 6 つのうち 2 つだけ 3 行） */
}
/* FIELDS の出方: 真ん中のロゴ → 01〜06 を時計回りに順番（本人 2026-10-08・値は共通 reveal（rc-common.css 235 行）と同じ＝opacity 0→1＋translateY(2rem)→0・.8s var(--ease)。ずらすのは delay だけ）。
   引き金は地図 .wk-ind__map.reveal の .is-in のまま（JS 不変）。地図そのものは動かさず、子（ロゴ・箱）を順に出す。delay は .is-in 側の transition にだけ書く＝ホバー（四つ角は子の i.wk-corner）には効かない */
html.motion .rc-site .wk-ind__map.reveal{opacity:1;transform:none}
html.motion .rc-page-work .wk-ind__map:not(.is-in) :is(.wk-ind__logo,.wk-ind__item){opacity:0;transform:translateY(2rem)}
html.motion .rc-page-work .wk-ind__map.is-in :is(.wk-ind__logo,.wk-ind__item){opacity:1;transform:none;transition:opacity .8s var(--ease),transform .8s var(--ease)}
html.motion .rc-page-work .wk-ind__map.is-in .wk-ind__item--at-t{transition-delay:.45s}   /* WK-IND-ORDER: 01（上）から時計回りの順に */
html.motion .rc-page-work .wk-ind__map.is-in .wk-ind__item--at-ur{transition-delay:.6s}
html.motion .rc-page-work .wk-ind__map.is-in .wk-ind__item--at-lr{transition-delay:.75s}
html.motion .rc-page-work .wk-ind__map.is-in .wk-ind__item--at-b{transition-delay:.9s}
html.motion .rc-page-work .wk-ind__map.is-in .wk-ind__item--at-ll{transition-delay:1.05s}
html.motion .rc-page-work .wk-ind__map.is-in .wk-ind__item--at-ul{transition-delay:1.2s}
@media (prefers-reduced-motion:reduce){
  html.motion .rc-page-work .wk-ind__map :is(.wk-ind__logo,.wk-ind__item){opacity:1;transform:none}
}
@media print{
  html.motion .rc-page-work .wk-ind__map :is(.wk-ind__logo,.wk-ind__item){opacity:1!important;transform:none!important}
}
/* S-6 BEYOND THE MACHINE（静止・左右は .rc-main の overflow-x:clip で切れる）。インク y 176.9〜192.7rem */
.rc-page-work .wk-ind__word{position:absolute;left:0;top:173.1rem;width:100%;margin:0;overflow-x:clip;text-indent:-9.9rem;font:600 23.724rem/1 var(--cormorant);letter-spacing:-2.335rem;color:var(--wk-gold);opacity:.2;white-space:nowrap;pointer-events:none}
/* WK-WORD-SLIDE（2026-10-30・先方FB「ここスライダーで動かしてほしい」）: 同じ語 4 つの列（industries.php）を右→左に流す。半分（2 つ分）動かして最初に戻す＝継ぎ目なし。
   語と語の間は .5em。速さは共通のマーキー（SABAESEIKI の帯）と同じく一定の速さで 60s。動きを減らす設定・no-motion（html.motion なし）は止まったまま＝前と同じ 1 つ目の位置 */
.rc-page-work .wk-ind__word-track{display:inline-flex;vertical-align:top}
.rc-page-work .wk-ind__word-t{flex:none;padding-right:.5em;text-indent:0}   /* 字下げ（−9.9rem）は列の頭に 1 回だけ（語の箱が受け継ぐと 2 回ぶん左へずれる） */
html.motion .rc-page-work .wk-ind__word-track{animation:wk-word-slide 60s linear infinite;will-change:transform}
@keyframes wk-word-slide{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  html.motion .rc-page-work .wk-ind__word-track{animation:none}
}

/* ==================================================================
   SP（≤1023。指示書_セクション SP 表。rem は SP の rem＝min(幅/39,13px)）
   黒い縁は幅に比例（絵の位置 −5.156%・幅 110.3125%・縦横比 2118/574。箱は幅いっぱいで絵は背景）・地の切り替えは幅の 17.1875%（33/192）。工程は 1 列。FIELDS は 見出し → 写真の帯（3 列×2 段）→ ロゴ → 箱 2 列×3 段 → 大きな英字。
   ================================================================== */
@media (max-width:1023px), (max-width:1366px) and (orientation:portrait){
  .rc-page-work .wk-flow,.rc-page-work .wk-ind{--wk-edge-cv:calc(var(--vw,100vw) * .171875)}
  .rc-page-work .wk-edge{height:calc(var(--vw,100vw) * .29895);background-position:calc(var(--vw,100vw) * -.05156) 0;background-size:calc(var(--vw,100vw) * 1.103125) 100%}   /* 幅に比例（left −5.156%・幅 110.3125%・2118/574 と同じ） */

  /* --- HOW WE WORK --- */
  .rc-page-work .wk-flow{height:auto;padding:calc(var(--wk-edge-cv) + 4rem) var(--gut) 8rem}
  .rc-page-work .wk-detail:has(+ .wk-flow) > .wk-field:last-child{padding-bottom:calc(6rem + var(--vw,100vw) * .171875)}   /* FB-05: SP の重ね分（.wk-field では --wk-edge-cv が PC の 33rem のままなので幅から直接）。地は SP では元から下端そろえ */
  .rc-page-work .wk-flow__in{height:auto;padding-top:0}
  .rc-page-work .wk-flow__head{position:relative;left:auto;top:auto;width:auto}
  .rc-page-work .wk-flow__title{margin-top:1.6rem;font-size:3.2rem;line-height:1.45;letter-spacing:.04em;white-space:normal}
  .rc-page-work .wk-flow__steps{--wk-fd:3.2rem;position:relative;display:grid;gap:1.2rem;width:auto;max-width:44rem;height:auto;margin:3.2rem 0 0;padding:0}   /* --wk-fd＝矢印の先（下）と切れ込み（上）の深さ */
  /* 2026-10-15（本人「SP は下向きにして」）: 工程は縦に並ぶので矢印も下向き（01 は上が平らな五角形・02〜05 は上に切れ込みのある矢羽根）。形は CSS（線 1px の金）で描く＝箱の高さが変わっても先の深さは同じ。
     外側の金の面（::before）の上に、1px 内側の黒い面（::after）を重ねて線にする。次の矢印は --wk-fd だけ上へ重ね、前の先が次の切れ込みに入る（線と線の間は gap の 1.2rem のまま）。PC の SVG（img.wk-flow__shape）は SP では出さない */
  .rc-page-work .wk-flow__step,.rc-page-work .wk-flow__step--1,.rc-page-work .wk-flow__step--5{position:relative;isolation:isolate;display:flex;flex-wrap:wrap;align-items:baseline;align-content:flex-start;column-gap:1.2rem;width:auto;height:auto;min-height:15rem;padding:calc(var(--wk-fd) + 1.4rem) 18% calc(var(--wk-fd) + .6rem) 8%}
  .rc-page-work .wk-flow__step--1{margin-right:0;padding-top:2.4rem;padding-left:8%;padding-right:18%}   /* PC の margin-right −2.995rem（次の li に重ねる分）は SP では要らない。残すと 01 だけ 3rem 広く、先が次の切れ込みとずれる */
  .rc-page-work .wk-flow__step:not(:has(.wk-flow__en)){padding-right:8%}   /* FLOW-NO-EN（2026-11-03・本人「1から5の後ろの英語を取ろう」）: 右の 18% は縦の英字の場所。英字の無い工程は左と同じ 8% */
  .rc-page-work .wk-flow__step + .wk-flow__step{margin-top:calc(var(--wk-fd) * -1)}
  .rc-page-work .wk-flow__shape,.rc-page-work .wk-flow__step--1 .wk-flow__shape{display:none}
  .rc-page-work .wk-flow__step::before,.rc-page-work .wk-flow__step::after{content:"";position:absolute;inset:0;pointer-events:none}
  .rc-page-work .wk-flow__step::before{z-index:-2;background:var(--wk-gold);clip-path:polygon(0 0,50% var(--wk-fd),100% 0,100% calc(100% - var(--wk-fd)),50% 100%,0 calc(100% - var(--wk-fd)))}
  .rc-page-work .wk-flow__step::after{z-index:-1;background:var(--wk-black);clip-path:polygon(1px 1px,50% calc(var(--wk-fd) + 1px),calc(100% - 1px) 1px,calc(100% - 1px) calc(100% - var(--wk-fd) - 1px),50% calc(100% - 1px),1px calc(100% - var(--wk-fd) - 1px))}
  .rc-page-work .wk-flow__step--1::before{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--wk-fd)),50% 100%,0 calc(100% - var(--wk-fd)))}
  .rc-page-work .wk-flow__step--1::after{clip-path:polygon(1px 1px,calc(100% - 1px) 1px,calc(100% - 1px) calc(100% - var(--wk-fd) - 1px),50% calc(100% - 1px),1px calc(100% - var(--wk-fd) - 1px))}
  /* 出方（SP）: 前の矢印の後ろから下へ飛び出す（PC の横を縦に替えただけ。出発点 --wk-fy は JS が入れる。01 だけは上から静かに）。順番の遅れも JS */
  html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step:not(.is-up){transform:translateY(var(--wk-fy,-12rem))}
  html.motion .rc-page-work .wk-flow__steps.is-armed .wk-flow__step:first-child:not(.is-up){transform:translateY(-4rem)}
  .rc-page-work .wk-flow__no,.rc-page-work .wk-flow__step--1 .wk-flow__no{position:relative;left:auto;top:auto;font-size:4.8rem;line-height:1.1}
  .rc-page-work .wk-flow__name,.rc-page-work .wk-flow__step--1 .wk-flow__name{position:relative;left:auto;top:auto;font-size:2rem;line-height:1.4}
  .rc-page-work .wk-flow__desc,.rc-page-work .wk-flow__step--1 .wk-flow__desc,.rc-page-work .wk-flow__step--3 .wk-flow__desc{position:relative;left:auto;top:auto;flex:1 0 100%;width:auto;margin-top:.6rem;font-size:max(1.3rem,12px);line-height:1.7;word-break:auto-phrase;text-wrap:pretty}   /* 文節で折り返す（Chrome。ほかは普通の折り返し）＝TOP の SP と同じ作法 */
  .rc-page-work .wk-flow__en,.rc-page-work .wk-flow__step .wk-flow__en{left:auto;top:50%;right:1.2rem;height:auto;transform:translateY(-50%);font-size:2rem;line-height:1.448;white-space:nowrap;text-align:center}
  .rc-page-work .wk-flow__ctl{position:relative;width:auto;height:auto;margin:4rem 0 0;padding-top:2.4rem}
  .rc-page-work .wk-flow__ctl-en{position:relative;left:auto;top:auto;font-size:2.4rem;line-height:1.4}
  .rc-page-work .wk-flow__ctl-t{position:relative;left:auto;top:auto;width:auto;margin-top:1rem;line-height:1.8;word-break:auto-phrase;text-wrap:pretty}

  /* --- SABAESEIKI（共通の SP 値 rc-common.css 356〜359 行を同じ詳細度で上書き） --- */
  .rc-page-work .wk-marquee{height:14rem}
  .rc-page-work .wk-marquee .rc-marquee{height:14rem}
  .rc-page-work .wk-marquee .rc-marquee__track{left:0}
  .rc-page-work .wk-marquee .rc-marquee__set{font-size:12rem;line-height:14rem;letter-spacing:.72rem;margin-top:-.9rem;-webkit-text-stroke-width:max(.2rem,2px)}

  /* --- FIELDS --- */
  .rc-page-work .wk-ind{display:flex;flex-direction:column;height:auto;padding:calc(var(--wk-edge-cv) + 4rem) var(--gut) 8rem}
  .rc-page-work .wk-ind__head{order:1;position:relative;left:auto;top:auto;width:auto;height:auto}
  .rc-page-work .wk-ind__title{position:relative;left:auto;top:auto;width:auto;font-size:2.8rem;line-height:1.5;letter-spacing:.04em;padding-left:0}
  .rc-page-work .wk-ind__lead{position:relative;left:auto;top:auto;width:auto;margin-top:1.6rem;padding-left:0;font-size:max(1.4rem,13px);line-height:1.9;letter-spacing:.04em;white-space:normal}
  .rc-page-work .wk-ind__note{position:relative;left:auto;top:auto;width:auto;margin-top:1.2rem;padding:0;font-size:max(1.3rem,12px);line-height:1.9;letter-spacing:.04em;text-align:center}   /* FB1015-06 SP */
  .rc-page-work .wk-ind__photos{order:2;position:relative;left:auto;top:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;width:auto;height:auto;margin-top:3.2rem}   /* 包みの不透明度 .5 と各写真の不透明度はそのまま */
  .rc-page-work .wk-ind__photos .wk-ind__ph{position:relative;left:auto;top:auto;width:auto;height:auto;aspect-ratio:3/2}
  .rc-page-work .wk-ind__map{order:3;position:relative;left:auto;top:auto;width:auto;height:auto;margin-top:3.2rem}
  .rc-page-work .wk-ind__logo{position:relative;left:auto;top:auto;width:12rem;height:auto;margin:0 auto 2.4rem}
  .rc-page-work .wk-ind__list{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}
  /* 箱は幅に比例（container query 単位 cqw＝箱の幅の 1%。PC の 25.263rem 幅を 100cqw として写す）。名前・説明は文の流れ（li の padding-top＝名前の top）。li 自身の % は親（grid の領域＝箱と同じ幅）の幅の % */
  .rc-page-work .wk-ind__item{container-type:inline-size;position:relative;left:auto;top:auto;bottom:auto;width:auto;min-height:0;height:auto;aspect-ratio:252.63/240.52;padding:50.3% 0 0;--wk-ci:3.07cqw;--wk-cw:4.02cqw;--wk-ch:4.5cqw;--wk-cs:max(.69cqw,1px)}
  .rc-page-work .wk-ind__item::before{left:3.47cqw;top:3.65cqw;right:3.47cqw;bottom:3.65cqw}
  .rc-page-work .wk-ind__no{left:4.17cqw;top:0;font-size:33.9cqw;line-height:35cqw}
  .rc-page-work .wk-ind__icon{left:35.94cqw;top:17.43cqw;width:28.12cqw;height:28.12cqw}
  .rc-page-work .wk-ind__name{width:auto;margin:0;font-size:max(10.6cqw,1.6rem);line-height:13.3cqw}
  .rc-page-work .wk-ind__desc,.rc-page-work .wk-ind__item--2 .wk-ind__desc,.rc-page-work .wk-ind__item--5 .wk-ind__desc,.rc-page-work .wk-ind__item--6 .wk-ind__desc{width:88cqw;margin:1.4cqw auto 0;font-size:max(5.2cqw,1.2rem,11px);line-height:1.55;word-break:auto-phrase;text-wrap:balance}
  .rc-page-work .wk-ind__word{order:4;position:relative;left:auto;top:auto;width:auto;overflow-x:visible;text-indent:0;align-self:center;margin-top:4rem;font-size:9rem;letter-spacing:-.9rem}
  .rc-page-work .wk-ind__word{align-self:stretch;margin-inline:calc(var(--gut) * -1);overflow-x:clip}   /* WK-WORD-SLIDE: 流す列は画面の幅いっぱいで切る（前は語 1 つを真ん中に） */
}

/* LK16-025・WK-IND-CENTER（2026-10-16・Lark／本人「文章なくなった分下の余白があいてるように感じるので、文字が中心にくるように」）: 説明（rc_wk_ind_N_desc）が空の箱（--nodesc・industries.php が付ける）は、
   アイコン＋名前のまとまりを面の上下の真ん中に（前は名前が上から 12.7rem の流れ＝下に説明が続く前提で、説明が空だと下が空いた）。アイコンも流れに入れて縦の flex で真ん中寄せ。
   アイコン→名前の間は前と同じ（PC 1.192rem＝12.7−4.403−7.105・SP 4.72cqw）。説明がある箱は前のまま */
.rc-page-work .wk-ind__item.wk-ind__item--nodesc{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0}
.rc-page-work .wk-ind__item--nodesc .wk-ind__icon{position:relative;left:auto;top:auto;flex:none;margin:0 0 1.192rem}
/* 1024〜1280: 6 つとも説明が空（地図に --nodesc）なら、FB-04 の「説明の最大行数 N」ぶん箱を伸ばさない（N＝0）・1024〜1086 のロゴの 24px 下げも戻す */
@media (min-width:1024px) and (max-width:1280px) and (orientation:landscape){
  .rc-page-work .wk-ind__map--nodesc .wk-ind__item{min-height:24.052rem}
  .rc-page-work .wk-ind__map--nodesc .wk-ind__logo{top:32.544rem}
}
@media (max-width:1023px), (max-width:1366px) and (orientation:portrait){
  .rc-page-work .wk-ind__item--nodesc .wk-ind__icon{margin-bottom:4.72cqw}
}
