@charset "utf-8";
/* 鯖江精機リクルート 新TOP — 読み込み直後の導入（RC-INTRO・2026-10-20・PC・SP 共通）
   本人「recruit.sunbelx.com の FV を真似して。大きくなるのはロゴの方で」＋デザイナーの絵コンテ（アセット31→21→11）:
   黒地に金のロゴと社名がぼかしから出る → 社名が消えてロゴが拡大し、帯の金が画面を覆う → 全面の金 → 金がほどけていつものヒーロー。
   要素は recruit-top.php の .rc-intro（画面全体に固定）。時間の流れとロゴの拡大（SVG の viewBox を毎コマ計算＝拡大してもぼけない）は js/rc-top-intro.js。
   終わったら JS が html に .veil-off を付ける（.veil-quick＝導入の間にスクロールされた・.veil-skip＝読み込み時にもう下にいた／演出なし）。
   recruit.js（PC）・recruit-sp.js（SP）は .veil-off を待ってから「静かに、燃えろ。」の入場を始める。
   演出なし（no-motion・動きを減らす設定・JS なし）では出さない。JS が途中で止まっても 8 秒で必ず消える（rc-intro-gone） */
.rc-intro{display:none}
html.js:not(.no-motion) .rc-intro{display:block;position:fixed;inset:0;z-index:300;overflow:hidden;background:#000;pointer-events:none;transition:opacity 1.5s ease,visibility 0s linear 1.5s}
html.js:not(.no-motion):not(.veil-off) .rc-intro{animation:rc-intro-gone .01s linear 8s forwards}
html.veil-off .rc-intro{opacity:0;visibility:hidden}
html.js:not(.no-motion).veil-quick .rc-intro{transition:opacity .5s ease,visibility 0s linear .5s}   /* 上の html.js:not(.no-motion) .rc-intro より強く（同じ強さだと 1.5s のまま） */
html.js:not(.no-motion).veil-skip .rc-intro{transition:none}
/* ロゴと社名: ぼかしから出る（参考サイトの「驚」とロゴの出方） */
.rc-intro-logo{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;filter:blur(12px);transition:opacity 1.2s ease-out,filter 1.2s ease-out}
.rc-intro-name{position:absolute;left:0;right:0;top:var(--rc-name-top,64%);margin:0;text-align:center;opacity:0;filter:blur(8px);transition:opacity 1.2s ease-out .15s,filter 1.2s ease-out .15s}
.rc-intro.is-in :is(.rc-intro-logo,.rc-intro-name){opacity:1;filter:none}
.rc-intro.is-zoom .rc-intro-name{opacity:0;filter:blur(6px);transition:opacity .45s ease,filter .45s ease}
.rc-intro-co{display:block;font:600 clamp(15px,1.25vw,26px)/1.5 'Noto Serif JP',serif;letter-spacing:.24em;padding-left:.24em;color:#f5f3ef}   /* padding-left＝字間ぶん（中央揃えで最後の字の字間が右に残る分） */
.rc-intro-sub{display:block;margin-top:.6em;font:700 clamp(10px,.68vw,14px)/1 'Noto Sans JP',sans-serif;letter-spacing:.32em;padding-left:.32em;color:#c8a96e}   /* ヘッダーの RECRUIT SITE と同じ書体 */
/* 全面の金（アセット11）: 拡大の終わりに重ねて画面を必ず埋める。色は絵コンテの実測（中心 #f3e58e・端 #e7ce74） */
.rc-intro-gold{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 50% 50%,#f3e58e 0%,#eed985 40%,#e5ca70 100%);transition:opacity .25s linear}   /* ZOOM-FAST: .35→.25s（拡大を 1 秒にした分） */
.rc-intro.is-gold .rc-intro-gold{opacity:1}
/* ヘッダー（PC の浮いた帯・SP の上の帯と下の固定バー）は導入の間は隠し、題字が入ってくるころ（.veil-off＋2s）に出す。出し方は animation（rc-header.css の transition は触らない） */
html.js:not(.no-motion):not(.veil-off) .site-header{opacity:0;visibility:hidden;animation:rc-intro-hd .01s linear 8s forwards}
html.js.veil-off:not(.veil-quick):not(.veil-skip) .site-header{animation:rc-intro-in 1s ease 2s backwards}
html.js.veil-quick .site-header{animation:rc-intro-in .6s ease backwards}
@keyframes rc-intro-gone{to{opacity:0;visibility:hidden}}
@keyframes rc-intro-hd{to{opacity:1;visibility:visible}}
@keyframes rc-intro-in{from{opacity:0}}