/* リクルーティング：求人票 → アプリ、動画求人の投稿 → 動画フィード。
   表示はすべて recruit_demo.js の render(time) が再生位置から決める。 */
.recruit-feature-demo{--rd-red:#EA333D;--rd-gold:#FFC400;--rd-gold-soft:#FFF4CC;--rd-ink:#16171A;--rd-muted:#82868E;--rd-line:#ECEDEF;--rd-bs:#0d6efd;--rd-app-blue:#1877F2;--rd-app-ink:#1A1C1C;--rd-app-sub:#5F5E5E;--rd-app-div:#EFEFEF;
  position:relative;width:100%;height:100%;overflow:hidden;isolation:isolate;
  background:radial-gradient(circle at 18% 14%,rgba(37,115,255,.08),transparent 36%),radial-gradient(circle at 84% 86%,rgba(234,51,61,.07),transparent 38%),#f7f8fa;
  color:var(--rd-ink);font-family:"Noto Sans JP","Noto Sans Myanmar",system-ui,sans-serif}
.recruit-feature-demo *{box-sizing:border-box}
.rd-canvas{position:absolute;left:0;top:0;width:1000px;height:620px;transform-origin:0 0;pointer-events:none}
.rd-scene{position:absolute;inset:0;will-change:opacity,transform}
.rd-ms,.rd-msr{font-style:normal;font-weight:normal;line-height:1;display:inline-block;-webkit-font-smoothing:antialiased;font-feature-settings:"liga";letter-spacing:0;text-transform:none;white-space:nowrap}
.rd-ms{font-family:"Material Symbols Outlined"}
.rd-msr{font-family:"Material Symbols Rounded"}

/* ---------- 紙の求人票 ---------- */
.rd-paper{position:absolute;left:50%;top:50%;width:330px;padding:16px 16px 14px;background:#fffefb;border-radius:2px;box-shadow:0 1px 0 rgba(0,0,0,.04),0 30px 60px -25px rgba(0,0,0,.45);overflow:hidden;color:#222;font-size:7.2px;line-height:1.45;z-index:3;will-change:transform,opacity}
.rd-paper::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.012) 0 1px,transparent 1px 3px);pointer-events:none}
.rd-p-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px}
.rd-p-top h6{margin:2px 0 0 18px;font-size:13px;font-weight:900;letter-spacing:6px;color:#222}
.rd-p-top h6 small{font-size:6px;letter-spacing:0;font-weight:500;margin-left:2px}
.rd-p-page{font-size:5.6px;border:.6px solid #333;padding:1px 4px}
.rd-p-meta{font-size:5.6px;color:#444;line-height:1.55}
.rd-p-meta b{font-weight:700;color:#222}
.rd-paper table{width:100%;border-collapse:collapse;margin:0 0 6px;table-layout:fixed}
.rd-paper th,.rd-paper td{border:.6px solid #555;padding:3px 4px;vertical-align:top;text-align:left;font-weight:400;font-size:inherit;line-height:inherit;color:#222;background:none}
.rd-paper th.rd-p-sec{width:12px;background:#ececec;writing-mode:vertical-rl;text-align:center;font-weight:700;letter-spacing:2px;font-size:6px;vertical-align:middle;padding:2px 1px}
.rd-paper th.rd-p-k{width:56px;background:#f5f5f3;font-size:6.4px;color:#333;font-weight:500}
.rd-p-ruby{display:block;font-size:5.2px;color:#666}
.rd-paper td.rd-p-big{font-size:8.6px;font-weight:700}
.rd-p-note{display:block;font-size:5.8px;color:#555}
.rd-p-mini{display:flex;justify-content:space-between;gap:4px}
.rd-p-blk{border-radius:2px;font-weight:700}
.rd-p-blk.is-hl{background:var(--rd-gold-soft);box-shadow:0 0 0 1.2px var(--rd-gold)}
.rd-p-chk{display:inline-block;width:5px;height:5px;border:.6px solid #333;margin:0 1px 0 4px;vertical-align:-1px;position:relative}
.rd-p-chk::after{content:"";position:absolute;left:1px;top:-1px;width:2px;height:3.5px;border:solid #222;border-width:0 .8px .8px 0;transform:rotate(45deg)}
.rd-p-stamp{position:absolute;right:22px;top:58px;width:34px;height:34px;border:1.6px solid rgba(214,40,40,.8);border-radius:50%;color:rgba(214,40,40,.85);font:900 6.5px/1.15 "Noto Serif JP",serif;display:grid;place-items:center;text-align:center;transform:rotate(-12deg)}
.rd-p-foot{font-size:5px;color:#777;display:flex;justify-content:space-between;margin-top:2px}
.rd-p-scan{position:absolute;left:0;right:0;top:0;height:40px;background:linear-gradient(180deg,transparent,rgba(234,51,61,.22),transparent);border-bottom:2px solid var(--rd-red);opacity:0}
.rd-bblk{position:absolute;left:0;top:0;z-index:8;background:#fff;border:1.5px solid var(--rd-gold);border-radius:8px;padding:6px 10px;font-size:11px;line-height:1.4;display:flex;justify-content:space-between;gap:14px;white-space:nowrap;box-shadow:0 10px 24px -12px rgba(0,0,0,.35);opacity:0;transform-origin:left center;will-change:transform,opacity}
.rd-bblk span:first-child{color:var(--rd-muted)}
.rd-bblk span:last-child{font-weight:700}

/* ---------- 共通：スマホ ---------- */
.rd-phone{position:absolute;left:50%;top:50%;width:258px;height:540px;margin:-270px 0 0 -129px;padding:9px;background:#111;border-radius:42px;box-shadow:0 40px 70px -30px rgba(0,0,0,.5);z-index:7;opacity:0;will-change:transform,opacity}
.rd-phone-scr{position:relative;width:100%;height:100%;border-radius:34px;overflow:hidden;background:#fff}
.rd-app{position:absolute;left:0;top:0;width:375px;height:812px;transform:scale(.64);transform-origin:0 0;background:#fff;display:flex;flex-direction:column;overflow:hidden;color:var(--rd-app-ink)}
.rd-dark{background:#000}
.rd-island{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:120px;height:34px;background:#000;border-radius:20px;z-index:20}
.rd-status{height:54px;flex:none;display:flex;align-items:flex-end;justify-content:space-between;padding:0 30px 8px 44px;font:700 16px/1 -apple-system,system-ui,sans-serif;z-index:19}
.rd-status>span:last-child{display:flex;gap:6px}
.rd-status i{font-size:20px}
.rd-status.rd-light{position:absolute;top:0;left:0;right:0;color:#fff}

/* 求人詳細（flutter: lib/job/job_detail.dart） */
.rd-appbar{height:56px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 16px;position:relative}
.rd-appbar i{font-size:24px}
.rd-appbar .rd-bm{font-size:30px;color:#9e9e9e}
.rd-appbar b{position:absolute;left:0;right:0;text-align:center;font-size:15px;font-weight:700}
.rd-tabs{display:flex;height:46px;flex:none}
.rd-tabs span{flex:1;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#9e9e9e;position:relative;white-space:nowrap;overflow:hidden}
.rd-tabs span.is-on{color:var(--rd-app-blue)}
.rd-tabs span.is-on::after{content:"";position:absolute;bottom:0;left:20%;right:20%;height:2px;background:var(--rd-app-blue)}
.rd-body{flex:1;background:#F2F2F7;padding:16px 16px 0;overflow:hidden}
.rd-sec{background:#fff;border:1px solid #E9E9E9;border-radius:16px;box-shadow:0 8px 24px rgba(0,0,0,.04);padding:20px 20px 16px;margin-bottom:16px}
.rd-sec-h{display:flex;align-items:center;gap:8px;margin-bottom:18px;font-size:13px;font-weight:800}
.rd-sec-h i{font-size:17px}
.rd-glabel{margin-bottom:8px;font-size:11px;font-weight:800;color:var(--rd-app-sub);letter-spacing:1.1px;line-height:1.25}
.rd-hero{padding-bottom:22px;border-bottom:.8px solid var(--rd-app-div)}
.rd-v{font-size:15px;font-weight:800;line-height:1.3;font-variant-numeric:tabular-nums;white-space:nowrap}
.rd-v.rd-big{font-size:24px;line-height:1.15}
.rd-chip{display:inline-flex;flex-wrap:wrap;gap:4px 8px;align-items:center;margin-top:12px;padding:6px 10px;border-radius:8px;background:#F5F5F5}
.rd-chip span:first-child{font-size:10px;font-weight:700;color:var(--rd-app-sub);letter-spacing:.5px}
.rd-chip span:last-child{font-size:11px;font-weight:800;font-variant-numeric:tabular-nums}
.rd-stk{padding:14px 0}
.rd-stk.rd-first{padding-top:0}
.rd-bottom{flex:none;padding:16px;background:#fff}
.rd-talk{height:48px;border-radius:25px;background:var(--rd-app-blue);color:#fff;font-size:16px;font-weight:700;display:grid;place-items:center;white-space:nowrap;overflow:hidden}
.rd-home{position:absolute;bottom:8px;left:50%;width:134px;height:5px;margin-left:-67px;border-radius:3px;background:#111}

/* ---------- 企業：動画投稿（video_auto.php） ---------- */
.rd-pcwrap{position:absolute;left:20%;top:50%;width:60%;z-index:2}
.rd-pc{position:relative;width:760px;height:600px;transform-origin:0 0;background:#fff;border-radius:14px;box-shadow:0 30px 60px -30px rgba(0,0,0,.35);overflow:hidden;display:flex;flex-direction:column}
.rd-pcbar{height:34px;flex:none;display:flex;align-items:center;gap:7px;padding:0 14px;background:#F1F2F4}
.rd-pcbar i{width:11px;height:11px;border-radius:50%;background:#ff6058}
.rd-pcbar i:nth-child(2){background:#ffbd2e}.rd-pcbar i:nth-child(3){background:#28c940}
.rd-pcmain{flex:1;min-height:0;display:grid;grid-template-columns:1fr 250px;gap:16px;padding:18px;background:#F4F6F9}
.rd-ucard{display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid #E3E6EB;border-radius:14px}
.rd-ucard-h{display:flex;align-items:baseline;gap:10px;padding:12px 18px;border-bottom:1px solid #EEF0F3}
.rd-ucard-h b{font-size:16px;font-weight:800}
.rd-ucard-h span{font-size:11px;color:var(--rd-muted);letter-spacing:.06em}
.rd-ucard-b{flex:1;display:flex;flex-direction:column;gap:12px;padding:16px 18px}
.rd-fl label{display:block;margin-bottom:5px;font-size:12.5px;font-weight:600;color:#212529}
.rd-inp{position:relative;min-height:36px;padding:8px 11px;border:1px solid #dee2e6;border-radius:7px;font-size:13px;line-height:1.5;color:#212529;background:#fff}
.rd-inp.is-focus{border-color:#86b7fe;box-shadow:0 0 0 3px rgba(13,110,253,.18)}
.rd-inp.rd-ta{min-height:66px}
.rd-caret{display:none;width:1.5px;height:14px;margin-left:1px;vertical-align:-2px;background:#212529}
.rd-inp.is-focus .rd-caret{display:inline-block}
.rd-file{display:flex;align-items:center;padding:0;overflow:hidden}
.rd-file.is-drag{border-color:var(--rd-bs);border-style:dashed;background:#F1F6FF}
.rd-file-btn{padding:8px 12px;border-right:1px solid #dee2e6;background:#E9ECEF;font-size:12.5px;white-space:nowrap}
.rd-file-nm{display:flex;align-items:center;gap:6px;padding:0 11px;font-size:12.5px;color:var(--rd-muted);white-space:nowrap}
.rd-file-nm.is-set{color:#212529;font-weight:600}
.rd-file-nm i{font-size:17px;color:#7B4DFF}
.rd-adj{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border:1px solid #E9ECF1;border-radius:10px;background:#F8F9FB}
.rd-adj-t{display:flex;justify-content:space-between;font-size:12px;font-weight:700}
.rd-adj-t span:last-child{color:var(--rd-muted);font-weight:500}
.rd-adj-r{display:flex;justify-content:space-between;margin-bottom:3px;font-size:11.5px}
.rd-sel{padding:5px 9px;border:1px solid #dee2e6;border-radius:6px;background:#fff;font-size:11.5px}
.rd-range{position:relative;height:5px;border-radius:3px;background:#dee2e6}
.rd-range i{position:absolute;top:50%;left:0;width:14px;height:14px;border-radius:50%;background:var(--rd-bs);transform:translate(-50%,-50%)}
.rd-post{margin-top:auto;min-height:40px;display:flex;align-items:center;justify-content:center;gap:7px;border-radius:8px;background:var(--rd-bs);color:#fff;font-size:14px;font-weight:600}
.rd-post i{font-size:19px}
.rd-post.is-done{background:#16A36A}
.rd-rpane{display:grid;place-items:center;padding:12px;background:#fff;border:1px solid #E3E6EB;border-radius:14px}
.rd-pframe{position:relative;height:100%;max-height:520px;aspect-ratio:31/66;display:grid;place-items:center;overflow:hidden;border:6px solid #111;border-radius:30px;background:#000;color:#777;font-size:12px}
.rd-pframe.is-ghost{border-style:dashed;border-color:#D5D8DD;background:transparent;color:#B7BAC0}
.rd-pv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.rd-overlay{position:absolute;inset:34px 0 0;z-index:5;display:grid;place-items:center;background:rgba(255,255,255,.82);opacity:0}
.rd-ov-card{min-width:280px;padding:22px 30px;border-radius:16px;background:#fff;box-shadow:0 20px 40px -20px rgba(0,0,0,.3);text-align:center}
.rd-ov-card b{display:block;margin-bottom:10px;font-size:14px}
.rd-ov-card small{display:block;margin-top:8px;font-size:11px;color:var(--rd-muted)}
.rd-ring{width:46px;height:46px;margin:0 auto 12px;border-radius:50%;border:4px solid #E6EEFF;border-top-color:var(--rd-bs)}
.rd-bar{height:6px;overflow:hidden;border-radius:3px;background:#EEF0F3}
.rd-bar i{display:block;width:100%;height:100%;background:var(--rd-bs);transform:scaleX(0);transform-origin:left}
.rd-cursor{position:absolute;left:0;top:0;z-index:30;width:20px;height:20px;opacity:0}
.rd-cursor svg{display:block;filter:drop-shadow(0 2px 3px rgba(0,0,0,.3))}
.rd-vfile{position:absolute;left:0;top:0;z-index:29;display:flex;align-items:center;gap:8px;padding:8px 12px 8px 8px;border-radius:10px;background:#fff;box-shadow:0 14px 30px -12px rgba(0,0,0,.4);font-size:12px;font-weight:700;white-space:nowrap;opacity:0}
.rd-vfile-th{width:30px;height:42px;overflow:hidden;border-radius:5px;background:#000}
.rd-vfile-th video{width:100%;height:100%;object-fit:cover}
.rd-vfile small{display:block;font-size:10px;color:var(--rd-muted);font-weight:500}
.rd-fly{position:absolute;left:0;top:0;z-index:40;overflow:hidden;border:6px solid #111;background:#000;opacity:0}
.rd-fly video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rd-fly-isl{position:absolute;top:3%;left:50%;width:32%;height:4.2%;border-radius:20px;background:#000;z-index:2}

/* ---------- 求職者：動画フィード（flutter: lib/job/job_video.dart） ---------- */
.rd-feed-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.rd-feed-ui{position:absolute;inset:0;opacity:0;color:#fff}
.rd-feed-grad{position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.54) 72%,rgba(0,0,0,.87) 100%)}
.rd-acts{position:absolute;right:12px;bottom:120px;display:flex;flex-direction:column;align-items:center;font-size:12px;font-weight:700;text-align:center}
.rd-ic{position:relative;width:44px;height:44px;display:grid;place-items:center}
.rd-ic .rd-msr{font-size:32px}
.rd-like.is-on .rd-msr{color:#FF5252}
.rd-lb{margin-top:4px;max-width:64px;line-height:1.2}
.rd-inq-n{margin-top:6px}
.rd-gap{height:14px}
.rd-tap{position:absolute;inset:-6px;border-radius:50%;background:rgba(255,255,255,.35);opacity:0}
.rd-burst{position:absolute;left:50%;top:45%;z-index:15;font-size:110px;color:#FF5252;opacity:0}
.rd-cap{position:absolute;left:14px;right:78px;bottom:28px}
.rd-co{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700}
.rd-new{padding:2px 7px;border-radius:5px;background:var(--rd-red);font-size:10px;font-weight:800;letter-spacing:.04em}
.rd-ti{margin-top:6px;font-size:14px;font-weight:600}
.rd-de{margin-top:6px;font-size:13px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rd-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.rd-tags span{padding:4px 8px;border-radius:12px;background:rgba(255,255,255,.24);font-size:11px;font-weight:600}

.rd-phone-feed{left:auto;right:6%;margin-left:0}

/* 幅が狭いとき：投稿画面を上、スマホを下に */
.recruit-feature-demo.is-compact .rd-pcwrap{width:92%}
.recruit-feature-demo.is-compact .rd-phone-feed{left:50%;right:auto;top:auto;bottom:2%;margin:0 0 0 -129px;transform-origin:50% 100%}