/* ==================================================
00｜目次・編集ガイド（納品担当者向け）

【読み込み】vendor.css → site.css（このファイル）
vendor.css：既存CMS/フォーム/Swiper由来の互換スタイル。原則編集しない。
site.css：サイト独自指定。元の適用順を保ち、すべて有効なまま統合。

【よくある編集】
01｜デザイン設定 → :root の --c-main（緑）、--c-night（紺）、
    --c-light（黄）、--c-text（本文）、--c-cream（明るい背景）。
    --round-font は日本語、Fredoka は英字。--vw は480px幅で上限となる単位。
02｜基本レイアウト → body の max-width:480px、.swipe-section。
03｜ヘッダー → .p-recruit_header、.header-actions。
04｜動画 → .p-recruit_video（比率・object-fit）。
05｜あつまれ 作業ゲーマー → #concept
06｜毎日新しいステージじゃなくていい → #empathy
07｜夜の間に、線路を整える → #mission
08｜覚える。慣れる。上手くなる。 → #growth
09｜手厚い、チュートリアルあります。 → #beginner
10｜あなたの経験、初期ステータス高めです。 → #experience
11｜「慎重すぎる」は、この仕事では強さです。 → #personality
12｜オフ時間まで、ちゃんと充実。 → #holidays
13｜毎晩の「作業」が、明日の当たり前をつくる。 → #value
14｜次にログインする場所、変えてみない？ → #invitation
15｜会社概要 → #company
16｜募集要項・休日休暇・福利厚生 → #requirements
17｜エントリー → #entry
18｜フッター → .p-footer（住所・著作権の文字色）。
19｜PC専用UI → .p-side-left、.p-side-right（ボタン配色）。
20｜アニメーション → @keyframes、.is-in、.js-rise、.ch、.animations-off。
21｜操作・アクセシビリティ → .bounded-sections、prefers-reduced-motion。

【注意】
・目次はHTMLの表示順。本文のルール順はカスケード維持のため従来順。
・各ブロックの日本語名とセレクタで検索する。後方の同名指定も確認する。
・元の上書き関係を安全に維持するため、複合メディアクエリは移動しない。
・!important、互換指定、JSが付けるクラス、CSS変数は削除していない。
・同じセレクタでもレスポンシブ/状態差分がある。変更は該当箇所を編集し、
  ファイル末尾へ再追加しない。
・swipe.js が .is-in/.ch/--i とフォーム表示を操作。
・polish.js が .animations-off、section-scroll.js が .bounded-sections を操作。
・画像URLはこのファイルと同階層の images/。フォントはHTMLでGoogle Fontsを読込。
================================================== */

/* ===== 適用順を維持した編集ブロック：旧 既存共通・基本指定 ===== */

/* デザイン設定・CSS変数 */
/* --- fixed 480px mobile layout --- */
:root{
--vw:min(1vw,4.8px)}

/* 共通レイアウト・コンポーネント */
html{
background:#e9e9e9}

/* 共通レイアウト・コンポーネント */
body{
width:100%;
max-width:480px;
margin:0 auto!important;
position:relative;
overflow-x:hidden;
background:#fff;
box-shadow:0 0 24px rgba(0,0,0,.12)}

/* ヘッダー・共通操作 */
.c-header,[class*="fixed"]{
max-width:480px}

/* ヘッダー・共通操作 */
.c-overlay,.c-drawer,.l-header,.p-index_loading,.p-index_fixed-kv{
left:50%!important;
right:auto!important;
width:100%!important;
max-width:480px!important;
margin-left:0!important;
translate:-50% 0}

/* ヘッダー・共通操作 */
.c-drawer,.l-header{
transform:none}

/* ===== Again recruit LP : palette tokens (hearing sheet) ===== */
:root{
--c-main:#2D6B5A;
--c-night:#1E355C;
--c-light:#F6C453;
--c-text:#2F2A2A;
--c-cream:#fff7eb;
--header-height:68px}

/* 共通レイアウト・コンポーネント */
html{
background:#e9e9e9;
scroll-snap-type:y mandatory;
overscroll-behavior-y:none}

/* 共通レイアウト・コンポーネント */
body{
color:var(--c-text)}

/* ===== swipe: 1 section = 1 screen ===== */
.swipe-section{
box-sizing:border-box;
position:relative;
width:100%;
height:100dvh;
min-height:100dvh;
max-height:100dvh;
padding:var(--header-height) 0 30px;
display:flex;
flex-direction:column;
justify-content:center;
overflow:hidden;
scroll-snap-align:start;
scroll-snap-stop:always}

/* 共通レイアウト・コンポーネント */
.swipe-section.is-long-section{
height:auto;
max-height:none;
overflow:visible;
justify-content:flex-start;
scroll-snap-stop:normal}

/* ヘッダー・共通操作 */
.swipe-section.p-recruit_fv{
padding-top:calc(var(--header-height) + 8px)}

/* 共通レイアウト・コンポーネント */
.is-night{
background:var(--c-night);
color:#fff;
--rail:#dfe6f1}

/* 共通レイアウト・コンポーネント */
.is-green{
background:var(--c-main);
color:#fff;
--rail:#dfe6f1}

/* 共通レイアウト・コンポーネント */
.is-cream{
background:var(--c-cream);
--rail:var(--c-night)}

/* 共通レイアウト・コンポーネント */
.is-white{
background:#fff;
--rail:var(--c-night)}

/* 線路（セクション境界。元サイトのギザギザ境界の置き換え） */
.swipe-section::after{
content:"";
position:absolute;
left:0;
right:0;
bottom:0;
height:22px;
pointer-events:none;
z-index:3;

  background:linear-gradient(var(--rail),var(--rail)) 0 4px/100% 3px no-repeat,linear-gradient(var(--rail),var(--rail)) 0 15px/100% 3px no-repeat,repeating-linear-gradient(90deg,var(--c-light) 0 7px,transparent 7px 19px)}

/* 共通レイアウト・コンポーネント */
.swipe-section.is-long-section::after{
display:none}

/* 共通レイアウト・コンポーネント */
.swipe-section>.c-container{
position:relative;
z-index:2}

/* ぷかぷか浮く装飾 */
@keyframes puka{
0%,100%{
transform:translateY(0) rotate(-1.5deg)}
50%{
transform:translateY(-9px) rotate(1.5deg)}
}

/* 共通レイアウト・コンポーネント */
.u-float{
animation:puka 4.2s ease-in-out infinite}

/* 共通レイアウト・コンポーネント */
.u-float.-d1{
animation-delay:-1.4s}

/* 共通レイアウト・コンポーネント */
.u-float.-d2{
animation-delay:-2.8s;
animation-duration:5.2s}

/* 共通レイアウト・コンポーネント */
.obj-dot{
position:absolute;
border-radius:50%;
background:var(--c-light);
z-index:1;
pointer-events:none}

/* 共通レスポンシブ・アクセシビリティ（適用順維持） */
@media (prefers-reduced-motion:reduce){
.u-float{
animation:none}
}

/* 下から現れる */
.js-rise{
opacity:0;
transform:translateY(20px);
transition:opacity .5s ease-out,transform .6s cubic-bezier(.215,.61,.355,1)}

/* 共通レイアウト・コンポーネント */
.is-in .js-rise,.js-rise.is-in{
opacity:1;
transform:none}

/* 共通レイアウト・コンポーネント */
.is-in .js-rise:nth-child(2){
transition-delay:.08s}

/* 共通レイアウト・コンポーネント */
.is-in .js-rise:nth-child(3){
transition-delay:.16s}

/* 共通レイアウト・コンポーネント */
.is-in .js-rise:nth-child(4){
transition-delay:.24s}

/* 共通レイアウト・コンポーネント */
.is-in .js-rise:nth-child(5){
transition-delay:.32s}

/* ===== type ===== */
.p-recruit h2.main,.p-recruit .c-section-title-primary .main{
font-size:max(13px,calc(5.6*var(--vw)));
line-height:1.5;
letter-spacing:.04em;
font-weight:700;
font-family:"M PLUS Rounded 1c",sans-serif;
color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.is-night .c-section-title-primary .main,.is-green .c-section-title-primary .main{
color:#fff}

/* 共通レイアウト・コンポーネント */
.p-recruit .c-section-title-primary .sub{
font-family:Fredoka,sans-serif;
font-weight:600;
letter-spacing:.12em;
font-size:13px;
color:var(--c-light);
margin-bottom:6px}

/* 共通レイアウト・コンポーネント */
.is-cream .c-section-title-primary .sub,.is-white .c-section-title-primary .sub{
color:var(--c-night)}

/* 共通レイアウト・コンポーネント */
.p-recruit .c-section-title-primary{
margin-bottom:12px!important}

/* 共通レイアウト・コンポーネント */
.p-recruit p{
font-size:max(13px,calc(3.1*var(--vw)));
line-height:1.75;
letter-spacing:.04em}

/* 共通レイアウト・コンポーネント */
.p-recruit .lead{
font-family:"M PLUS Rounded 1c",sans-serif;
font-weight:700;
font-size:max(13px,calc(3.9*var(--vw)));
line-height:1.6;
color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.is-night .lead,.is-green .lead{
color:var(--c-light)}

/* 共通レイアウト・コンポーネント */
.p-recruit .u-hl{
font-family:"M PLUS Rounded 1c",sans-serif;
font-weight:700;
color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.is-night .u-hl,.is-green .u-hl{
color:var(--c-light)}

/* 共通レイアウト・コンポーネント */
.p-recruit p+p{
margin-top:.7em}

/* ===== 共通部品（元サイトの語彙の再利用） ===== */
.c-button-primary.-light{
--button-color:var(--c-night);
--button-hover-color:#fff;
--button-bg-color:var(--c-light);
--button-bg-hover-color:var(--c-night)}

/* 共通レイアウト・コンポーネント */
.c-button-primary.-night{
--button-bg-color:var(--c-night);
--button-bg-hover-color:#fff;
--button-hover-color:var(--c-night)}

/* 共通レイアウト・コンポーネント */
.p-recruit .label{
display:inline-block;
background:var(--c-main);
color:#fff;
border-radius:100vmax;
padding:.45em 1em;
font-size:13px;
font-weight:700;
line-height:1.5;
letter-spacing:.04em}

/* 共通レイアウト・コンポーネント */
.is-night .label,.is-green .label{
background:var(--c-light);
color:var(--c-night)}

/* 共通レイアウト・コンポーネント */
.p-recruit .labels{
display:flex;
flex-wrap:wrap;
gap:8px}

/* 情報行（c-news-link の骨格＝ #ebebeb 罫線で区切る行リスト） */
.p-recruit .rows{
list-style:none;
margin:0;
padding:0;
border-top:1px solid #ebebeb}

/* 共通レイアウト・コンポーネント */
.is-night .rows,.is-green .rows{
border-color:rgba(255,255,255,.25)}

/* 共通レイアウト・コンポーネント */
.p-recruit .row{
display:grid;
grid-template-columns:auto 1fr;
gap:4px 14px;
align-items:center;
padding:calc(2.6*var(--vw)) 0;
border-bottom:1px solid #ebebeb}

/* 共通レイアウト・コンポーネント */
.is-night .row,.is-green .row{
border-color:rgba(255,255,255,.25)}

/* 共通レイアウト・コンポーネント */
.p-recruit .row__num{
font-family:Fredoka,sans-serif;
font-weight:600;
font-size:max(13px,calc(3.3*var(--vw)));
color:#848484;
letter-spacing:.06em;
white-space:nowrap}

/* 共通レイアウト・コンポーネント */
.is-night .row__num,.is-green .row__num{
color:var(--c-light)}

/* 共通レイアウト・コンポーネント */
.p-recruit .row__title{
font-family:"M PLUS Rounded 1c",sans-serif;
font-weight:500;
font-size:max(13px,calc(3.6*var(--vw)));
line-height:1.5;
letter-spacing:.04em}

/* 共通レイアウト・コンポーネント */
.p-recruit .row__sub{
grid-column:2;
font-size:max(13px,calc(3.1*var(--vw)));
line-height:1.6;
opacity:.9}

/* 共通レイアウト・コンポーネント */
.p-recruit .row.-step{
grid-template-columns:auto auto 1fr}

/* 共通レイアウト・コンポーネント */
.p-recruit .row.-step .row__sub{
grid-column:1/-1}

/* 大型ビジュアルカード（c-products-cat-char-link-card：写真＋英字大見出し） */
.p-recruit .vcard{
position:relative;
border-radius:calc(4.8*var(--vw));
overflow:hidden;
box-shadow:2px 2px 18px #ebd3c0;
aspect-ratio:384/200;
background:#ddd}

/* 共通レイアウト・コンポーネント */
.p-recruit .vcard img{
width:100%;
height:100%;
object-fit:cover;
display:block}

/* 共通レイアウト・コンポーネント */
.p-recruit .vcard__en{
position:absolute;
left:calc(3.6*var(--vw));
bottom:calc(2.4*var(--vw));
font-family:Fredoka,sans-serif;
font-weight:600;
font-size:max(13px,calc(9*var(--vw)));
letter-spacing:.06em;
color:#fff;
text-shadow:0 1px 8px rgba(0,0,0,.35);
line-height:1}/* 共通レイアウト・コンポーネント */
.p-recruit .chara{
display:block;
height:auto;
pointer-events:none}

/* 共通レイアウト・コンポーネント */
.p-recruit .split{
display:grid;
grid-template-columns:1fr auto;
gap:8px;
align-items:end}

/* dl（会社概要・募集要項） */
.p-recruit dl.spec{
margin:0;
border-top:1px solid #ebebeb}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec>div{
display:grid;
grid-template-columns:5.6em 1fr;
gap:12px;
padding:calc(2.5*var(--vw)) 0;
border-bottom:1px solid #ebebeb}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec dt{
font-family:"M PLUS Rounded 1c",sans-serif;
font-weight:700;
color:var(--c-main);
font-size:max(13px,calc(3.3*var(--vw)));
line-height:1.6}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec dd{
margin:0;
font-size:max(13px,calc(3.3*var(--vw)));
line-height:1.7}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec .note{
display:block;
font-size:max(13px,calc(2.8*var(--vw)));
color:#848484}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec .price{
font-family:Fredoka,sans-serif;
font-weight:700;
font-size:max(13px,calc(6*var(--vw)));
color:var(--c-main)}

/* form */
.p-recruit .f-item{
margin-bottom:14px}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item label{
display:flex;
gap:8px;
align-items:center;
font-family:"M PLUS Rounded 1c",sans-serif;
font-weight:700;
font-size:13px;
margin-bottom:6px}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item .req{
font-size:13px;
background:var(--c-main);
color:#fff;
border-radius:100vmax;
padding:.15em .8em}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item .opt{
font-size:13px;
background:#eee;
color:#666;
border-radius:100vmax;
padding:.15em .8em}

/* 共通レイアウト・コンポーネント */
.p-recruit input:focus,.p-recruit textarea:focus,.p-recruit select:focus{
outline:2px solid var(--c-light);
border-color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-done{
display:none;
text-align:center;
font-family:"M PLUS Rounded 1c",sans-serif;
font-weight:700;
color:var(--c-main);
padding:1em 0}

/* フッター */
.p-footer{
background:var(--c-night);
color:#fff;
text-align:center;
padding:28px 17px 36px;
font-size:13px;
line-height:1.8}

/* フッター */
.p-footer img{
height:34px;
width:auto;
background:#fff;
border-radius:100vmax;
padding:6px 16px;
margin-bottom:12px}

/* 共通レイアウト・コンポーネント */
.p-recruit h2.main,.p-recruit h1.main{
text-wrap:balance;
word-break:auto-phrase}

/* ===== PC専用：中央480pxの左右余白に固定UI（スマホ表示では出さない） ===== */
.p-side{
display:none}

/* PC専用UI */
@media (min-width:769px){

  /* 余白幅 = (画面幅 - 480px) / 2。各パネルは余白そのものを覆い、中身を中央寄せ */
  .p-side{
--gutter:calc((100vw - 480px)/2);
display:flex;
position:fixed;
top:0;
bottom:0;
width:var(--gutter);
align-items:center;
justify-content:center;
z-index:4000;
pointer-events:none;
box-sizing:border-box;
padding:0 16px}

  .p-side-left{
left:0}

  .p-side-right{
right:0}

  .p-side a{
pointer-events:auto}

  /* ロゴ：基準100px × 1.3 = 130px（余白が狭いときは余白-32pxまで縮む。縦横比は維持） */
  .p-side-left img{
display:block;
width:min(130px,calc(var(--gutter) - 32px));
height:auto}

  /* CTA：既存 c-button-primary をそのまま使用。gap 14px、高さは基準3em→3.45em(約+15%)、幅は既定のまま */
  .p-side__cta{
display:flex;
flex-direction:column;
align-items:stretch;
gap:14px;
width:min(185px,calc(var(--gutter) - 32px))}

  .p-side__cta .c-button-primary{
--button-min-width:0;
--button-min-height:3.45em;
display:block;
width:100%}

  .p-side__cta .c-button-primary a{
width:100%;
box-sizing:border-box}

  .p-side__cta .c-button-primary.-white a{
border-color:var(--c-main)}

}

/* ===== header：左ロゴ／右2ボタン。左右余白は本文(.c-container)と同じ値 ===== */
:root{
--gutter-x:min(calc(.8163265306*var(--vw)) + 16.9387755102px,30px)}

/* ヘッダー・共通操作 */
.p-recruit_header{
position:fixed;
top:0;
left:50%;
translate:-50% 0;
width:100%;
max-width:480px;
z-index:5000;
padding:12px 8px 0;
box-sizing:border-box}

/* ヘッダー・共通操作 */
.p-recruit_header__in{
display:flex;
align-items:center;
justify-content:space-between;
gap:8px;
background:#fff;
border-radius:100vmax;
box-shadow:2px 2px 6px #ebd3c0;

  padding:8px calc(var(--gutter-x) - 8px) 8px calc(var(--gutter-x) - 8px)}

/* ヘッダー・共通操作 */
.p-recruit_header__logo{
display:block;
flex:0 1 auto;
min-width:0;
margin-left:0}

/* ヘッダー・共通操作 */
.p-recruit_header__logo img{
display:block;
height:30px;
width:auto;
max-width:100%}

/* 既存CTA(c-button-primary)と同じトークン：ピル形・メインカラー塗り・M PLUS Rounded 500・.3s hover */
.header-actions{
display:flex;
align-items:center;
flex-wrap:nowrap;
gap:8px;
flex-shrink:0}

/* ヘッダー・共通操作 */
.header-actions>.header-cta{
display:inline-flex;
align-items:center;
justify-content:center;
flex:0 0 auto;
box-sizing:border-box;
width:auto;
height:auto;
min-width:0;
min-height:0;
margin:0;

  font-size:13px;
line-height:1.5;
padding:3px 8px;
white-space:nowrap;
text-decoration:none;

  font-family:"M PLUS Rounded 1c",sans-serif;
font-weight:500;
letter-spacing:.04em;

  background-color:var(--c-main);
border:1px solid var(--c-main);
border-radius:100vmax;
color:#fff;
transition-duration:.3s;
transition-property:background-color,color}

/* ヘッダー・共通操作 */
.header-actions>.header-cta:hover{
background-color:#fff;
color:var(--c-main)}

/* ヘッダー・共通操作 */
.header-actions>.header-cta.-white{
background-color:#fff;
color:var(--c-main)}

/* ヘッダー・共通操作 */
.header-actions>.header-cta.-white:hover{
background-color:var(--c-main);
color:#fff}

/* ===== contact form：入力欄を統一 ===== */
.p-recruit .f-item input[type=text],.p-recruit .f-item input[type=email],.p-recruit .f-item input[type=tel],.p-recruit .f-item input[type=datetime-local],.p-recruit .f-item select,.p-recruit .f-item textarea{

  display:block;
width:100%;
box-sizing:border-box;
margin:0;
min-height:3em;
padding:.75em 1em;

  font-family:"Noto Sans JP","Hiragino Sans",sans-serif;
font-size:16px;
line-height:1.5;
color:var(--c-text);

  background-color:#fff;
border:1px solid #ccc;
border-radius:8px;
box-shadow:none}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item ::placeholder{
color:#999;
opacity:1}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item input:focus,.p-recruit .f-item select:focus,.p-recruit .f-item textarea:focus{
outline:2px solid var(--c-light);
outline-offset:0;
border-color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item select{
-webkit-appearance:none;
appearance:none;
padding-right:48px;
cursor:pointer;

  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%232D6B5A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  background-repeat:no-repeat;
background-position:right 18px center;
background-size:12px 8px}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item textarea{
min-height:160px;
resize:vertical}

/* ===== 縦型動画セクション（FVの前） ===== */
.p-recruit_video{
padding:0;
background:#000;
display:block}

/* 共通レイアウト・コンポーネント */
.p-recruit_video::after{
display:none}

/* 共通レイアウト・コンポーネント */
.p-recruit_video__media{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
display:block}

/* 共通レイアウト・コンポーネント */
.p-recruit_video__cue{
position:absolute;
left:0;
right:0;
bottom:calc(22px + env(safe-area-inset-bottom));
z-index:2;
display:flex;
flex-direction:column;
align-items:center;
gap:6px;
color:#fff;
pointer-events:none;
text-shadow:0 1px 6px rgba(0,0,0,.45)}

/* 共通レイアウト・コンポーネント */
.p-recruit_video__cue span{
font-family:Fredoka,sans-serif;
font-weight:500;
font-size:13px;
letter-spacing:.24em;
padding-left:.24em}

/* 共通レイアウト・コンポーネント */
.p-recruit_video__cue i{
display:block;
width:10px;
height:10px;
border-right:2px solid #fff;
border-bottom:2px solid #fff;
transform:rotate(45deg);
animation:cue 1.8s ease-in-out infinite;
filter:drop-shadow(0 1px 3px rgba(0,0,0,.45))}

/* アニメーション・状態制御 */
@keyframes cue{
0%,100%{
transform:translateY(-3px) rotate(45deg);
opacity:.5}
50%{
transform:translateY(5px) rotate(45deg);
opacity:1}
}

/* 共通レスポンシブ・アクセシビリティ（適用順維持） */
@media (prefers-reduced-motion:reduce){
.p-recruit_video__cue i{
animation:none}
}

/* ヘッダー：動画セクション表示中のみ隠す（デザインは変更しない） */
.p-recruit_header{
transition:opacity .3s ease-out,transform .3s ease-out}

/* ヘッダー・共通操作 */
.p-recruit_header.is-hidden{
opacity:0;
transform:translateY(-100%);
pointer-events:none}

/* 共通レスポンシブ・アクセシビリティ（適用順維持） */
/* ===== PC背景（生成画像）。中央480pxの左右に見える ===== */
@media (min-width:769px){

  html{
background:#1E355C url("images/bg-pc.jpg") center bottom/cover no-repeat fixed}

  body{
box-shadow:0 0 48px rgba(8,16,34,.55)}

}

/* ===== 演出（元サイトの「下から現れる」「弾むイージング」「ぷかぷか」を拡張） ===== */
:root{
--bounce:cubic-bezier(.175,.885,.32,1.275);
--out:cubic-bezier(.215,.61,.355,1)}

/* 見出し：1文字ずつ弾んで現れる */
.ch{
display:inline-block;
opacity:0;
transform:translateY(.7em) rotate(8deg) scale(.6)}

/* 共通レイアウト・コンポーネント */
.is-in .ch{
animation:chIn .7s var(--bounce) both;
animation-delay:calc(var(--i)*.04s + .12s)}

/* アニメーション・状態制御 */
@keyframes chIn{
to{
opacity:1;
transform:none}
}

/* サブラベル：字間が詰まりながらフェードイン */
.p-recruit .c-section-title-primary .sub{
opacity:0;
letter-spacing:.6em}

/* 共通レイアウト・コンポーネント */
.is-in .c-section-title-primary .sub{
opacity:1;
letter-spacing:.12em;
transition:opacity .8s var(--out),letter-spacing 1s var(--out)}

/* 段落・行：下から順に */
.is-in .js-rise:nth-child(2){
transition-delay:.18s}

/* 共通レイアウト・コンポーネント */
.is-in .js-rise:nth-child(3){
transition-delay:.3s}

/* 共通レイアウト・コンポーネント */
.is-in .js-rise:nth-child(4){
transition-delay:.42s}

/* 共通レイアウト・コンポーネント */
.is-in .js-rise:nth-child(5){
transition-delay:.54s}

/* 共通レイアウト・コンポーネント */
.is-in .js-rise:nth-child(6){
transition-delay:.66s}

/* ピル形タグ：ぽんっと弾む */
.p-recruit .label{
transform:scale(.4);
opacity:0}

/* 共通レイアウト・コンポーネント */
.is-in .label{
animation:pop .6s var(--bounce) both;
animation-delay:calc(.45s + var(--k,0)*.09s)}

/* 共通レイアウト・コンポーネント */
.labels .label:nth-child(1){
--k:0}

/* 共通レイアウト・コンポーネント */
.labels .label:nth-child(2){
--k:1}

/* 共通レイアウト・コンポーネント */
.labels .label:nth-child(3){
--k:2}

/* 共通レイアウト・コンポーネント */
.labels .label:nth-child(4){
--k:3}

/* 共通レイアウト・コンポーネント */
.labels .label:nth-child(5){
--k:4}

/* 共通レイアウト・コンポーネント */
.labels .label:nth-child(6){
--k:5}

/* 共通レイアウト・コンポーネント */
.labels .label:nth-child(7){
--k:6}

/* 共通レイアウト・コンポーネント */
.labels .label:nth-child(8){
--k:7}

/* 共通レイアウト・コンポーネント */
.labels .label:nth-child(9){
--k:8}

/* 共通レイアウト・コンポーネント */
.rows .row:nth-child(1) .label{
--k:0}

/* 共通レイアウト・コンポーネント */
.rows .row:nth-child(2) .label{
--k:2}

/* 共通レイアウト・コンポーネント */
.rows .row:nth-child(3) .label{
--k:4}

/* 共通レイアウト・コンポーネント */
.rows .row:nth-child(4) .label{
--k:6}

/* アニメーション・状態制御 */
@keyframes pop{
0%{
transform:scale(.4);
opacity:0}
100%{
transform:scale(1);
opacity:1}
}

/* 行リスト：左から滑り込む */
.is-in .row{
animation:rowIn .7s var(--out) both;
animation-delay:calc(.3s + var(--r,0)*.12s)}

/* 共通レイアウト・コンポーネント */
.rows .row:nth-child(1){
--r:0}

/* 共通レイアウト・コンポーネント */
.rows .row:nth-child(2){
--r:1}

/* 共通レイアウト・コンポーネント */
.rows .row:nth-child(3){
--r:2}

/* 共通レイアウト・コンポーネント */
.rows .row:nth-child(4){
--r:3}

/* 共通レイアウト・コンポーネント */
.rows .row:nth-child(5){
--r:4}

/* 共通レイアウト・コンポーネント */
.p-recruit .row{
opacity:0}

/* アニメーション・状態制御 */
@keyframes rowIn{
from{
opacity:0;
transform:translateX(-28px)}
to{
opacity:1;
transform:none}
}

/* キャラクター：弾んで登場してから、ぷかぷか */
.p-recruit .chara{
opacity:0}

/* 共通レイアウト・コンポーネント */
.is-in img.chara{
opacity:1;
animation:charaPop .95s var(--bounce) both}

/* 共通レイアウト・コンポーネント */
.is-in img.chara.u-float{
animation:charaPop .95s var(--bounce) both,puka 4.2s ease-in-out .95s infinite}

/* 共通レイアウト・コンポーネント */
.is-in img.chara.u-float.-d1{
animation:charaPop .95s var(--bounce) .15s both,puka 4.2s ease-in-out 1.1s infinite}

/* 共通レイアウト・コンポーネント */
.is-in img.chara.u-float.-d2{
animation:charaPop .95s var(--bounce) .3s both,puka 5.2s ease-in-out 1.25s infinite}

/* アニメーション・状態制御 */
@keyframes charaPop{
0%{
opacity:0;
scale:.3;
rotate:-14deg;
translate:0 40px}
60%{
opacity:1}
100%{
opacity:1;
scale:1;
rotate:0deg;
translate:0 0}
}

/* 重機：線路を走って入ってくる */
.is-in img.chara[src*="machines"]{
animation:drive 1.3s var(--out) both}

/* アニメーション・状態制御 */
@keyframes drive{
0%{
opacity:0;
translate:-90px 0}
35%{
opacity:1}
100%{
opacity:1;
translate:0 0}
}

/* 写真カード：ズームアウトしながら開く */
.p-recruit .vcard{
clip-path:inset(0 0 100% 0 round 24px);
transition:clip-path 1s var(--out)}

/* 共通レイアウト・コンポーネント */
.is-in .vcard{
clip-path:inset(0 0 0 0 round 24px)}

/* 共通レイアウト・コンポーネント */
.p-recruit .vcard img{
transform:scale(1.3);
transition:transform 1.6s var(--out)}

/* 共通レイアウト・コンポーネント */
.is-in .vcard img{
transform:scale(1)}

/* 共通レイアウト・コンポーネント */
.p-recruit .vcard__en{
opacity:0;
letter-spacing:.5em;
transition:opacity .8s .5s var(--out),letter-spacing 1s .5s var(--out)}

/* 共通レイアウト・コンポーネント */
.is-in .vcard__en{
opacity:1;
letter-spacing:.06em}

/* 強調語：蛍光ペンが引かれる（明るい背景のみ） */
.is-cream .u-hl,.is-white .u-hl{
background-image:linear-gradient(transparent 62%,rgba(246,196,83,.6) 62%);
background-repeat:no-repeat;
background-size:0 100%;
transition:background-size .9s .7s var(--out)}

/* 共通レイアウト・コンポーネント */
.is-in.is-cream .u-hl,.is-in.is-white .u-hl{
background-size:100% 100%}/* アニメーション・状態制御 */
@keyframes numBump{
0%{
transform:scale(.5) rotate(-6deg);
opacity:0}
100%{
transform:none;
opacity:1}
}

/* ボタン：きらっと光が走る */
.swipe-section .c-button-primary a{
position:relative;
overflow:hidden}

/* 共通レイアウト・コンポーネント */
.swipe-section .c-button-primary a::after{
content:"";
position:absolute;
top:0;
bottom:0;
left:-60%;
width:40%;
background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
transform:skewX(-20deg);
animation:shine 3.6s ease-in-out 1.4s infinite;
pointer-events:none}

/* アニメーション・状態制御 */
@keyframes shine{
0%,60%{
left:-60%}
100%{
left:130%}
}

/* 黄色い円：瞬く */
.obj-dot{
animation:puka 4.2s ease-in-out infinite,twinkle 2.6s ease-in-out infinite;
box-shadow:0 0 12px 2px rgba(246,196,83,.55)}

/* アニメーション・状態制御 */
@keyframes twinkle{
0%,100%{
opacity:.35}
50%{
opacity:1}
}

/* 線路：枕木がゆっくり流れる */
.swipe-section::after{
animation:railMove 2.4s linear infinite}

/* アニメーション・状態制御 */
@keyframes railMove{
from{
background-position:0 4px,0 15px,0 0}
to{
background-position:0 4px,0 15px,19px 0}
}

/* FV：ロゴ見出しに光の揺れ */
.p-recruit_fv h1.main{
text-shadow:0 0 24px rgba(246,196,83,.35)}

/* 共通レスポンシブ・アクセシビリティ（適用順維持） */
@media (prefers-reduced-motion:reduce){

  .ch,.p-recruit .label,.p-recruit .row,.p-recruit .chara,.p-recruit .vcard,.p-recruit .vcard img,.p-recruit .vcard__en,.p-recruit .c-section-title-primary .sub{
opacity:1!important;
transform:none!important;
clip-path:none!important;
animation:none!important;
letter-spacing:inherit}

  .swipe-section::after,.obj-dot,.swipe-section .c-button-primary a::after{
animation:none!important}

}

/* ===== 適用順を維持した編集ブロック：旧 concept.css ===== */

/* あつまれ 作業ゲーマー（#concept） */
/* Scoped styling for the introduction only. */
.p-recruit .concept-intro{
background:#fff;
color:#383a38;
--rail:#b7c8c0;
min-height:max(100dvh,660px);
justify-content:center;
padding:100px 0 72px;
overflow:hidden;
isolation:isolate}

/* あつまれ 作業ゲーマー（#concept） */
.concept-scenery{
position:absolute;
inset:0;
pointer-events:none;
z-index:0;
overflow:hidden}

/* あつまれ 作業ゲーマー（#concept） */
.concept-landscape{
display:block;
width:100%;
height:100%}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro>.c-container{
width:100%;
padding-inline:24px;
text-align:center;
z-index:2}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .c-section-title-primary{
margin-bottom:26px!important}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .c-section-title-primary .sub{
color:#648272;
font-size:13px;
letter-spacing:.2em;
margin-bottom:20px}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro h1.main{
font-size:max(13px,clamp(28px,7.5vw,36px));
line-height:1.75;
letter-spacing:.08em;
color:#343a36;
text-shadow:none;
font-weight:700;
word-break:normal}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .lead{
color:#3d4a41;
font-size:max(13px,clamp(12px,3.3vw,15px));
line-height:1.9;
letter-spacing:.015em;
margin:0 0 30px}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-copy p{
font-size:max(13px,clamp(10.5px,2.85vw,13px));
line-height:2.5;
letter-spacing:0;
color:#545953}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-copy p+p{
margin-top:22px}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .u-hl{
color:#2d6b5a;
background:none;
font-weight:700}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-entry{
display:block;
margin:48px auto 0;
width:88%;
--button-bg-color:#fff;
--button-color:#2d6b5a;
--button-border-color:#e3e7e2;
--button-bg-hover-color:#2d6b5a;
--button-hover-color:#fff;
--button-border-hover-color:#2d6b5a;
--button-min-width:0;
--button-min-height:3.7em}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-entry a{
width:100%;
border:1px solid #dfe5df;
border-radius:17px;
box-shadow:0 3px 10px #52694908;
font-size:13px;
justify-content:center;
gap:15px}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-entry a:after{
display:none}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-entry .icon{
width:19px;
height:19px}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro::after{
display:block;
opacity:.65;
animation:none}

/* あつまれ 作業ゲーマー（#concept） */
.concept-orb{
position:absolute;
display:block;
box-shadow:8px 12px 12px #d7b96a30;
animation:concept-drift 5.5s ease-in-out infinite}

/* あつまれ 作業ゲーマー（#concept） */
.concept-orb--gold{
width:38px;
height:43px;
right:19px;
top:25%;
border-radius:49% 57% 50% 43%;
background:radial-gradient(circle at 29% 24%,#fff2b6,#f8d575 48%,#edbb54);
rotate:26deg}

/* あつまれ 作業ゲーマー（#concept） */
.concept-orb--blue{
width:43px;
height:43px;
right:7px;
top:45%;
border-radius:50%;
background:radial-gradient(circle at 29% 20%,#effaff,#c9e5f6 55%,#a7cfe8);
animation-delay:-2s}

/* あつまれ 作業ゲーマー（#concept） */
.concept-orb--blue:after{
content:'';
position:absolute;
inset:7px -1px 13px;
border-bottom:2px solid #ffffff90;
border-radius:50%;
rotate:35deg}

/* あつまれ 作業ゲーマー（#concept） */
.concept-orb--mint{
width:26px;
height:27px;
left:15px;
top:32%;
border-radius:8px 10px 7px 11px;
background:radial-gradient(circle at 28% 20%,#eef9c7,#cee899 60%,#b4d67d);
rotate:-25deg;
animation-delay:-1s}

/* あつまれ 作業ゲーマー（#concept） */
.concept-orb--pink{
width:36px;
height:36px;
left:24px;
top:65%;
border-radius:12px;
background:radial-gradient(circle at 30% 24%,#ffe4e3,#f3b6ba 57%,#e8a2aa);
rotate:25deg;
animation-delay:-3.5s}

/* アニメーション・状態制御 */
@keyframes concept-drift{
0%,100%{
transform:translateY(0) rotate(-4deg)}
50%{
transform:translateY(-9px) rotate(4deg)}
}

/* あつまれ 作業ゲーマー（#concept） */
@media(max-width:360px){
.p-recruit .concept-intro>.c-container{
padding-inline:17px}
.concept-orb--gold{
right:8px;
width:29px;
height:33px}
.concept-orb--blue{
right:-11px}
.concept-orb--mint{
left:3px;
width:20px;
height:21px}
.concept-orb--pink{
left:10px;
width:27px;
height:27px}
.p-recruit .concept-intro h1.main{
font-size:28px}
.p-recruit .concept-intro .concept-entry{
margin-top:36px}
}

/* あつまれ 作業ゲーマー（#concept） */
@media(prefers-reduced-motion:reduce){
.concept-orb{
animation:none}
.p-recruit .concept-intro .js-rise{
opacity:1;
transform:none;
transition:none}
}

/* Brand palette: navy backdrop, green scenery, yellow light, charcoal type. */
.p-recruit .concept-intro{
background:#1E355C;
color:#2F2A2A;
--rail:#2D6B5A}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro>.c-container{
width:calc(100% - 38px);
margin-inline:auto;
padding:36px 8px 32px;
background:color-mix(in srgb,#F6C453 12%,white);
border-radius:47% 43% 24px 24px / 70px 80px 24px 24px}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro h1.main,.p-recruit .concept-intro .lead,.p-recruit .concept-intro .concept-copy p{
color:#2F2A2A}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .c-section-title-primary .sub,.p-recruit .concept-intro .u-hl{
color:#2D6B5A}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-entry{
--button-bg-color:#F6C453;
--button-color:#2F2A2A;
--button-border-color:#F6C453;
--button-bg-hover-color:#2D6B5A;
--button-hover-color:#fff}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-entry a{
border-color:#F6C453;
background:#F6C453;
color:#2F2A2A}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-entry a:hover{
background:#2D6B5A;
border-color:#2D6B5A;
color:#fff}

/* あつまれ 作業ゲーマー（#concept） */
.concept-orb--gold,.concept-orb--pink{
background:radial-gradient(circle at 29% 24%,#fff1ce,#F6C453 58%,#b88f3d)}

/* あつまれ 作業ゲーマー（#concept） */
.concept-orb--blue,.concept-orb--mint{
background:radial-gradient(circle at 29% 24%,#93b4a9,#2D6B5A 60%,#1E355C)}

/* あつまれ 作業ゲーマー（#concept） */
.concept-orb{
z-index:3}

/* あつまれ 作業ゲーマー（#concept） */
@media(max-width:360px){
.p-recruit .concept-intro>.c-container{
width:calc(100% - 24px);
padding-inline:6px}
.p-recruit .concept-intro .concept-copy p{
font-size:13px}
}

/* ===== 適用順を維持した編集ブロック：旧 polish.css ===== */

/* デザイン設定・CSS変数 */
/* Again visual system. Brand colors remain the single source of truth. */
:root{
--c-main:#2D6B5A;
--c-night:#1E355C;
--c-light:#F6C453;
--c-text:#2F2A2A;
--c-cream:#fff9ee;
--round-font:'M PLUS Rounded 1c','Hiragino Maru Gothic ProN',sans-serif;
--soft-shadow:0 8px 24px #1e355c0d}

/* 共通レイアウト・コンポーネント */
body.p-recruit{
font-family:var(--round-font);
font-weight:500;
color:var(--c-text);
-webkit-font-smoothing:antialiased}

/* 共通レイアウト・コンポーネント */
.p-recruit p{
font-family:var(--round-font);
font-size:max(13px,clamp(12px,3.15vw,15px));
line-height:1.95;
letter-spacing:.025em}

/* 共通レイアウト・コンポーネント */
.p-recruit .swipe-section:not(.p-recruit_video){
height:auto;
max-height:none;
min-height:100dvh;
overflow:hidden;
justify-content:center;
padding-top:92px;
padding-bottom:62px;
isolation:isolate}

/* 共通レイアウト・コンポーネント */
.p-recruit .swipe-section:not(.p-recruit_video)>.c-container{
padding-inline:clamp(22px,6vw,30px);
position:relative;
z-index:2}

/* 共通レイアウト・コンポーネント */
.p-recruit .c-section-title-primary{
margin-bottom:22px!important}

/* 共通レイアウト・コンポーネント */
.p-recruit h2.main,.p-recruit .c-section-title-primary .main{
font-family:var(--round-font);
font-size:max(13px,clamp(24px,6.3vw,30px));
font-weight:800;
line-height:1.6;
letter-spacing:.025em;
color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.p-recruit .is-night h2.main,.p-recruit .is-green h2.main{
color:#fff}

/* 共通レイアウト・コンポーネント */
.p-recruit .c-section-title-primary .sub{
font-family:Fredoka,sans-serif;
font-size:13px;
font-weight:500;
display:inline-flex;
align-items:center;
gap:8px;
line-height:1.5;
padding:5px 12px;
background:#2d6b5a0b;
border:1px solid #2d6b5a25;
border-radius:100px;
color:var(--c-main);
margin-bottom:13px;
letter-spacing:.13em}

/* 共通レイアウト・コンポーネント */
.p-recruit .c-section-title-primary .sub:before{
content:'';
width:6px;
height:6px;
border-radius:50%;
background:var(--c-light);
box-shadow:0 0 0 3px #f6c45320}

/* 共通レイアウト・コンポーネント */
.p-recruit .is-night .sub,.p-recruit .is-green .sub{
color:var(--c-light);
border-color:#f6c45335;
background:#f6c4530b}

/* 共通レイアウト・コンポーネント */
.p-recruit .lead{
font-size:max(13px,clamp(14px,3.6vw,17px));
line-height:1.85;
font-weight:700}

/* 共通レイアウト・コンポーネント */
.p-recruit .u-hl{
font-weight:700}

/* 共通レイアウト・コンポーネント */
.p-recruit .is-white,.p-recruit .is-cream{
color:var(--c-text)}

/* Chunkier rails replace a scalloped section edge. */
.p-recruit .swipe-section:not(.p-recruit_video)::after{
display:block;
content:'';
position:absolute;
left:0;
right:0;
bottom:0;
height:31px;
z-index:4;
pointer-events:none;
background:linear-gradient(var(--c-main),var(--c-main)) 0 6px/100% 4px no-repeat,linear-gradient(var(--c-main),var(--c-main)) 0 21px/100% 4px no-repeat,repeating-linear-gradient(90deg,transparent 0 7px,var(--c-light) 7px 15px,transparent 15px 28px);
opacity:.9;
animation:none}

/* 共通レイアウト・コンポーネント */
.p-recruit .is-night::after,.p-recruit .is-green::after{
filter:drop-shadow(0 1px 0 #ffffff80)}

/* 共通レイアウト・コンポーネント */
.p-recruit .swipe-section:last-child::after{
display:none}

/* 共通レイアウト・コンポーネント */
.chapter-index{
position:absolute;
bottom:47px;
right:25px;
font:500 13px Fredoka,sans-serif;
color:var(--c-main);
opacity:.5;
letter-spacing:.1em}

/* 共通レイアウト・コンポーネント */
.is-night .chapter-index,.is-green .chapter-index{
color:var(--c-light)}

/* Decorative layers stay out of the text flow. */
.chapter-decor{
position:absolute;
inset:0;
pointer-events:none;
overflow:hidden;
z-index:0}

/* 共通レイアウト・コンポーネント */
.chapter-decor:before{
content:'';
position:absolute;
right:-100px;
top:-70px;
width:280px;
height:280px;
border-radius:43% 57% 66% 34%;
background:#2d6b5a06;
rotate:-20deg}

/* 共通レイアウト・コンポーネント */
.chapter-decor:after{
content:'';
position:absolute;
bottom:30px;
left:-105px;
width:240px;
height:205px;
border-radius:55% 45% 40% 60%;
background:#f6c4530d;
rotate:25deg}

/* 共通レイアウト・コンポーネント */
.is-night .chapter-decor:before,.is-green .chapter-decor:before{
background:#ffffff05}

/* 共通レイアウト・コンポーネント */
.float-piece{
position:absolute;
display:block;
animation:softFloat 6s ease-in-out infinite;
filter:drop-shadow(6px 10px 7px #1e355c1c)}

/* 共通レイアウト・コンポーネント */
.float-piece--ball{
width:32px;
height:32px;
right:-9px;
top:35%;
border-radius:50%;
background:radial-gradient(circle at 30% 25%,#fff3ce,var(--c-light) 58%,#c69e46)}

/* 共通レイアウト・コンポーネント */
.float-piece--ball:after{
content:'';
position:absolute;
inset:5px 0 12px;
border-bottom:1px solid #fff9;
border-radius:50%;
rotate:35deg}

/* 共通レイアウト・コンポーネント */
.float-piece--pebble{
width:23px;
height:25px;
bottom:16%;
left:-8px;
border-radius:8px 10px 8px 11px;
background:radial-gradient(circle at 30% 25%,#a7c4ba,var(--c-main) 67%);
rotate:-25deg;
animation-delay:-3s}

/* 共通レイアウト・コンポーネント */
.is-green .float-piece--pebble{
background:radial-gradient(circle at 30% 25%,#fff3ce,var(--c-light) 67%)}

/* 共通レイアウト・コンポーネント */
.p-recruit .chara{
filter:drop-shadow(0 9px 7px #1e355c18)}

/* 共通レイアウト・コンポーネント */
.p-recruit .u-float{
animation:softFloat 5.5s ease-in-out infinite}

/* 共通レイアウト・コンポーネント */
.p-recruit .u-float.-d1{
animation-delay:-1.8s}

/* 共通レイアウト・コンポーネント */
.p-recruit .u-float.-d2{
animation-delay:-3.4s}

/* 共通レイアウト・コンポーネント */
.p-recruit .is-in img.chara.u-float{
animation:softFloat 5.5s ease-in-out infinite}

/* アニメーション・状態制御 */
@keyframes softFloat{
0%,100%{
transform:translateY(0) rotate(-2deg)}
50%{
transform:translateY(-8px) rotate(2deg)}
}

/* Rounded, lightweight surfaces; yellow is reserved for emphasis. */
.p-recruit .rows{
border:0;
display:grid;
gap:9px;
margin:18px 0}

/* 共通レイアウト・コンポーネント */
.p-recruit .row{
border:1px solid #2d6b5a14;
border-radius:17px;
padding:13px 16px;
background:#fff;
box-shadow:0 3px 0 #2d6b5a05;
color:var(--c-text)}

/* 共通レイアウト・コンポーネント */
.p-recruit .row__title{
font-family:var(--round-font);
font-size:max(13px,clamp(12px,3.5vw,16px));
font-weight:700;
line-height:1.65}

/* 共通レイアウト・コンポーネント */
.p-recruit .label{
font-family:var(--round-font);
font-weight:700;
font-size:13px;
padding:6px 13px;
letter-spacing:.025em;
box-shadow:none}

/* 共通レイアウト・コンポーネント */
.p-recruit .labels{
gap:8px}

/* 共通レイアウト・コンポーネント */
.p-recruit .is-night .row__num{
color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.p-recruit .row__sub{
font-size:13px;
line-height:1.7}

/* 共通レイアウト・コンポーネント */
.p-recruit .row__num{
font-size:13px;
color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.p-recruit .is-night .row .label{
background:var(--c-main);
color:#fff}

/* 共通レイアウト・コンポーネント */
.p-recruit .vcard{
border:6px solid #fff;
border-radius:27px;
box-shadow:0 5px 0 #2d6b5a0d,0 12px 22px #1e355c12;
aspect-ratio:1.75;
overflow:hidden}

/* 共通レイアウト・コンポーネント */
.p-recruit .vcard__en{
font-family:Fredoka,sans-serif;
font-weight:600;
font-size:37px;
letter-spacing:.035em;
bottom:14px;
left:16px}

/* 共通レイアウト・コンポーネント */
.p-recruit .c-button-primary{
--button-min-height:3.6em;
--button-bg-color:var(--c-main);
--button-bg-hover-color:#fff;
--button-color:#fff;
--button-hover-color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.p-recruit .c-button-primary.-light{
--button-bg-color:var(--c-light);
--button-color:var(--c-text);
--button-bg-hover-color:#fff;
--button-hover-color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.p-recruit .c-button-primary a,.p-recruit .c-button-primary button{
font-family:var(--round-font);
font-weight:700;
border-radius:100px;
box-shadow:0 4px 0 #1e355c14;
transition:transform .25s,box-shadow .25s,background-color .25s,color .25s}

/* 共通レイアウト・コンポーネント */
.p-recruit .c-button-primary a:hover,.p-recruit .c-button-primary button:hover{
transform:translateY(-2px);
box-shadow:0 6px 0 #1e355c14}

/* 共通レイアウト・コンポーネント */
.p-recruit .swipe-section .c-button-primary a:after{
animation:none;
display:none}

/* ヘッダー・共通操作 */
.p-recruit_header__in{
background:#fff;
backdrop-filter:none;
box-shadow:0 5px 20px #1e355c13;
border:1px solid #2d6b5a0d;
padding-block:10px}

/* ヘッダー・共通操作 */
.header-actions>.header-cta{
font-weight:700;
font-size:13px;
padding:6px 10px}

/* PC専用UI */
.p-side-left img{
background:#fff;
border-radius:100px;
padding:10px 15px;
box-shadow:0 5px 20px #1e355c12}

/* Chapter-specific compositions borrowed from the reference's visual rhythm. */
#empathy .talk-bubble{
border:1px solid #2d6b5a14;
border-radius:23px;
background:#fff;
padding:17px;
font-size:13px;
box-shadow:var(--soft-shadow)}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .split{
margin-top:22px!important;
gap:13px;
align-items:center}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .split .chara{
width:92px!important}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth{
background-image:linear-gradient(#ffffff04 1px,transparent 1px),linear-gradient(90deg,#ffffff04 1px,transparent 1px);
background-size:32px 32px}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .rows{
gap:11px;
margin-top:20px}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .row.-step{
position:relative;
grid-template-columns:60px auto 1fr;
column-gap:12px;
min-height:92px;
padding:12px 15px;
border-radius:22px}

/* 共通レイアウト・コンポーネント */
.growth-character{
grid-row:1/3;
width:60px;
height:60px;
background:#f6c45318;
border-radius:50%;
display:grid;
place-items:center}

/* 共通レイアウト・コンポーネント */
.growth-character img{
width:46px;
height:57px;
object-fit:contain;
filter:drop-shadow(0 3px 2px #1e355c15)}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .row__num{
font-size:13px}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .row .label{
font-size:13px;
padding:3px 9px;
justify-self:start}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .row__sub{
grid-column:2/-1;
font-size:13px}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .row>span:empty{
display:none}

/* 共通レイアウト・コンポーネント */
.p-recruit .number-island{
width:100%;
min-height:150px;
border-radius:50%;
background:#f6c45316;
justify-content:center;
align-items:baseline;
padding:22px 12px 15px;
margin:25px auto!important;
gap:7px;
position:relative}

/* 共通レイアウト・コンポーネント */
.p-recruit .number-island b{
font-size:max(13px,clamp(80px,24vw,115px));
font-weight:600;
letter-spacing:-.045em}

/* 共通レイアウト・コンポーネント */
.p-recruit .number-island span{
font-size:16px}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .number-island{
background:#f6c45315;
min-height:180px;
border:1px solid #f6c45320}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .number-island b{
font-size:max(13px,clamp(94px,28vw,133px))}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .split{
align-items:center}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .split .chara{
width:110px!important}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .main{
font-size:max(13px,clamp(22px,5.7vw,27px))}

/* 共通レイアウト・コンポーネント */
.safety-check{
display:grid;
place-items:center;
width:25px;
height:25px;
background:var(--c-main);
color:#fff;
border-radius:50%;
font-size:14px;
font-weight:700}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .row{
grid-template-columns:25px 1fr!important;
gap:12px}

/* 毎晩の「作業」が、明日の当たり前をつくる。（#value） */
#value .rows{
background:#fff;
border:1px solid #2d6b5a15;
border-radius:25px;
padding:8px 18px}

/* 毎晩の「作業」が、明日の当たり前をつくる。（#value） */
#value .row{
box-shadow:none;
border:0;
border-bottom:1px dashed #2d6b5a25;
border-radius:0;
padding-inline:0}

/* 毎晩の「作業」が、明日の当たり前をつくる。（#value） */
#value .row:last-child{
border:0}

/* 毎晩の「作業」が、明日の当たり前をつくる。（#value） */
#value .row__num{
width:33px;
height:33px;
border-radius:50%;
background:#f6c45330;
display:grid;
place-items:center}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec{
border:1px solid #2d6b5a16;
border-radius:25px;
background:#fff;
padding:7px 19px;
box-shadow:var(--soft-shadow);
color:var(--c-text)}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec>div{
padding:17px 0;
border-color:#2d6b5a15;
gap:13px;
grid-template-columns:5.4em 1fr}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec>div:last-child{
border:0}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec dt,.p-recruit dl.spec dd{
font-size:13px;
line-height:1.85}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec .note{
font-size:13px;
color:var(--c-text);
opacity:.75}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec .price{
font-size:25px}

/* 共通レイアウト・コンポーネント */
.p-recruit dl.spec .label{
font-size:13px;
padding:5px 9px}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item input[type=text],.p-recruit .f-item input[type=email],.p-recruit .f-item input[type=tel],.p-recruit .f-item input[type=datetime-local],.p-recruit .f-item select,.p-recruit .f-item textarea{
border-radius:15px;
border-color:#2d6b5a25;
min-height:52px;
font-family:var(--round-font);
color:var(--c-text)}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item{
margin-bottom:21px}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item label{
font-family:var(--round-font);
font-size:13px;
margin-bottom:9px}

/* 共通レイアウト・コンポーネント */
.p-recruit .f-item .opt{
background:#2d6b5a0d;
color:var(--c-text)}

/* フッター */
.p-footer{
position:relative;
overflow:hidden;
margin-top:40px;
padding-top:0;
padding-bottom:42px;
font-family:var(--round-font)}

/* 共通レイアウト・コンポーネント */
.brand-loop{
overflow:hidden;
margin:0 -17px 30px;
background:#fff;
padding:17px 0;
color:var(--c-main)}

/* 共通レイアウト・コンポーネント */
.brand-loop>div{
display:flex;
width:max-content;
align-items:center;
gap:22px;
animation:brandRoll 20s linear infinite}

/* 共通レイアウト・コンポーネント */
.brand-loop span{
font:600 83px/1 Fredoka,sans-serif;
letter-spacing:.01em}

/* フッター */
.p-footer .brand-loop img{
width:65px;
height:85px;
object-fit:contain;
background:none;
padding:0;
margin:0;
border-radius:0}

/* アニメーション・状態制御 */
@keyframes brandRoll{
to{
transform:translateX(-50%)}
}/* 共通レイアウト・コンポーネント */
html.animations-off *,html.animations-off *:before,html.animations-off *:after{
animation-play-state:paused!important;
transition:none!important}

/* 共通レイアウト・コンポーネント */
html.animations-off .ch,html.animations-off .js-rise,html.animations-off .row,html.animations-off .label,html.animations-off .chara,html.animations-off .sub{
opacity:1!important;
transform:none!important;
translate:none!important;
scale:1!important;
rotate:0deg!important}

/* 共通レイアウト・コンポーネント */
html.animations-off .vcard{
clip-path:none!important}

/* 共通レイアウト・コンポーネント */
html.animations-off .vcard img{
transform:none!important}

/* Preserve the concept's centered composition and brand palette. */
.p-recruit .concept-intro{
min-height:max(100dvh,700px)}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro>.c-container{
padding:34px 12px 30px}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro h1.main{
color:#fff;
font-size:max(13px,clamp(31px,7.5vw,48px));
line-height:1.2}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .lead{
color:#F6C453;
font-size:max(13px,clamp(12px,3.3vw,15px))}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-copy p{
color:var(--c-text);
font-size:max(13px,clamp(10px,2.8vw,13px));
line-height:2.5}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-entry{
margin-top:33px;
width:94%;
--button-bg-color:var(--c-light);
--button-color:var(--c-text)}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-entry a{
border-radius:18px;
font-size:13px}

/* あつまれ 作業ゲーマー（#concept） ／ 毎日新しいステージじゃなくていい（#empathy） ／ 覚える。慣れる。上手くなる。（#growth） */
@media(max-width:360px){
.p-recruit .swipe-section:not(.p-recruit_video)>.c-container{
padding-inline:20px}
.p-recruit .concept-intro>.c-container{
padding-inline:7px}
.p-recruit .concept-intro .concept-copy p{
font-size:13px}
.p-recruit h2.main{
font-size:23px}
.p-recruit dl.spec{
padding-inline:13px}
.p-recruit dl.spec>div{
grid-template-columns:4.4em 1fr;
gap:10px}
#growth .row.-step{
grid-template-columns:48px auto 1fr;
padding:10px;
gap:5px 9px}
.growth-character{
width:48px;
height:53px}
.growth-character img{
width:41px;
height:50px}
#growth .row .label{
font-size:13px}
.header-actions>.header-cta{
padding:5px 7px;
font-size:13px}
#empathy .split .chara{
width:73px!important}
.p-recruit .number-island span{
font-size:13px}
}

/* The introduction sits directly on the original night background. */
.p-recruit .concept-intro>.c-container{
background:transparent;
border-radius:0;
box-shadow:none}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .concept-copy p{
color:#fff}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .c-section-title-primary .sub,.p-recruit .concept-intro .u-hl{
color:var(--c-light)}

/* あつまれ 作業ゲーマー（#concept） */
.p-recruit .concept-intro .c-section-title-primary .sub{
background:#f6c4530b;
border-color:#f6c45335}

/* あつまれ 作業ゲーマー（#concept） */
.concept-intro .concept-scenery,.chapter-decor{
bottom:42px}

/* 共通レイアウト・コンポーネント */
.p-recruit .swipe-section:not(.p-recruit_video)::after{
background-color:inherit}/* ヘッダー・共通操作 */
@media(max-width:380px){
.header-actions{
gap:5px}
.p-recruit_header__logo img{
max-width:86px;
height:auto}
.header-actions>.header-cta{
padding-inline:6px}
}

/* 共通レスポンシブ・アクセシビリティ（適用順維持） */
@media(prefers-reduced-motion:reduce){
.p-recruit .u-float,.p-recruit .is-in img.chara.u-float,.float-piece,.brand-loop>div{
animation:none!important}
.p-recruit .js-rise{
opacity:1;
transform:none;
transition:none}
}/* All floating decorations move vertically, without sway or rotation. */
@keyframes softFloat{
0%,100%{
transform:translateY(0)}
50%{
transform:translateY(-8px)}
}

/* アニメーション・状態制御 */
@keyframes puka{
0%,100%{
transform:translateY(0)}
50%{
transform:translateY(-9px)}
}

/* アニメーション・状態制御 */
@keyframes concept-drift{
0%,100%{
transform:translateY(0)}
50%{
transform:translateY(-9px)}
}

/* Oversized type and workers form a seamless chapter-ending ribbon. */
#mission .mission-marquee{
width:100%;
overflow:hidden;
flex:none;
margin:26px 0 10px;
padding:9px 0;
background:#fff;
position:relative;
z-index:2;
pointer-events:none}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee__track{
display:flex;
width:max-content;
animation:missionMarquee 24s linear infinite}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee__group{
display:flex;
align-items:center;
gap:24px;
padding-right:24px;
flex-shrink:0}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee span{
font:600 clamp(72px,20vw,96px)/1 Fredoka,sans-serif;
letter-spacing:.02em;
color:#2D6B5A;
white-space:nowrap}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee img{
width:67px;
height:100px;
object-fit:contain;
flex:none}

/* アニメーション・状態制御 */
@keyframes missionMarquee{
to{
transform:translateX(-50%)}
}

/* 夜の間に、線路を整える（#mission） */
@media(prefers-reduced-motion:reduce){
#mission .mission-marquee__track{
animation:none}
}

/* A concise mission chapter sized to the available viewport. */
.p-recruit #mission{
height:100svh;
min-height:100svh;
padding:78px 0 43px;
display:flex;
flex-direction:column;
justify-content:center;
gap:12px}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission>.c-container{
width:100%;
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
flex:0 1 auto;
min-height:0}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .vcard{
width:100%;
height:clamp(100px,22svh,180px);
flex-shrink:1;
min-height:70px;
aspect-ratio:auto;
clip-path:none;
border-radius:24px;
margin:0}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .vcard img{
height:100%;
width:100%;
object-fit:cover;
transform:none}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .vcard__en{
font-size:25px;
bottom:12px;
left:17px}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .c-section-title-primary{
margin:0!important;
text-align:center;
flex:none}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission h2.main{
font-size:max(13px,clamp(25px,6.8vw,32px));
line-height:1.4;
letter-spacing:.02em}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-title-line{
display:block;
white-space:nowrap}

/* 夜の間に、線路を整える（#mission） */
#mission h2.main .ch{
opacity:1;
transform:none;
animation:none}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission p{
margin:0;
text-align:center;
font-size:max(13px,clamp(11px,3vw,14px));
line-height:1.7;
flex:none}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .labels{
margin:0;
justify-content:center;
gap:8px;
flex:none}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .label{
padding:4px 12px;
font-size:13px}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .mission-message{
font-weight:800;
color:#2D6B5A;
background:linear-gradient(transparent 62%,#F6C45380 62%);
font-size:max(13px,clamp(11px,2.9vw,14px))}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee{
margin:0;
padding:3px 0;
flex:none}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee span{
font-size:max(13px,clamp(56px,16vw,76px))}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee img{
width:52px;
height:76px}

/* 夜の間に、線路を整える（#mission） */
#mission .chapter-index{
bottom:34px}

/* 夜の間に、線路を整える（#mission） */
@media(max-height:650px){
.p-recruit #mission{
padding-top:68px;
gap:7px}
.p-recruit #mission>.c-container{
gap:7px}
.p-recruit #mission .vcard{
height:16svh}
.p-recruit #mission h2.main{
font-size:25px}
.p-recruit #mission p{
font-size:13px}
#mission .mission-marquee span{
font-size:54px}
#mission .mission-marquee img{
height:59px;
width:42px}
}

/* Photo mosaic inspired by the reference's archival collage. */
.p-recruit #mission .mission-collage{
background:#fff9ee;
position:relative;
border-radius:22px;
overflow:hidden}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-collage__grid{
display:grid;
width:100%;
height:100%;
grid-template-columns:1.3fr .8fr 1fr;
grid-template-rows:1fr 1fr;
gap:4px;
background:#fff9ee}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .mission-collage__grid img{
display:block;
width:100%;
height:100%;
min-height:0;
min-width:0;
object-fit:cover;
filter:sepia(.42) saturate(.65);
position:static;
border-radius:0}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-collage__grid img:nth-child(1){
grid-row:1/3}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-collage__grid img:nth-child(2){
grid-column:2;
grid-row:1/3}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-collage__grid img:nth-child(3){
grid-column:3;
grid-row:1}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-collage__grid img:nth-child(4){
grid-column:3;
grid-row:2}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .mission-collage .vcard__en{
position:absolute;
inset:auto auto 10px 12px;
background:#2D6B5A;
color:#fff;
border-radius:50px;
padding:5px 13px;
font-size:20px;
line-height:1.1;
z-index:2}

/* Quiet brand-colored scenery behind the mission content. */
#mission .mission-scenery{
position:absolute;
inset:0 0 42px;
overflow:hidden;
pointer-events:none;
z-index:0;
background:radial-gradient(ellipse at 100% 10%,#f6c45310,transparent 46%),radial-gradient(ellipse at 0 75%,#2d6b5a09,transparent 50%)}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-scenery:before{
content:'';
position:absolute;
width:170px;
height:290px;
left:-136px;
top:30%;
border:22px solid #2d6b5a15;
border-radius:46% 54% 35% 65%;
transform:rotate(28deg)}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-scenery:after{
content:'';
position:absolute;
width:180px;
height:230px;
right:-145px;
bottom:18%;
border:24px solid #f6c45328;
border-radius:65% 35% 60% 40%;
transform:rotate(24deg)}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-light{
position:absolute;
width:52px;
height:62px;
border-radius:0;
background:url('images/tool-pickaxe.png') center/contain no-repeat;
filter:drop-shadow(0 4px 4px #0003);
animation:missionLight 6s ease-in-out infinite}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-light--one{
right:5px;
top:38%}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-light--two{
left:5px;
bottom:24%;
animation-delay:-3s;
background-image:url('images/tool-spanner.png')}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-spark{
position:absolute;
right:21px;
bottom:30%;
color:#F6C453;
font-size:20px;
font-style:normal;
opacity:.65}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee{
background:transparent}

/* アニメーション・状態制御 */
@keyframes missionLight{
0%,100%{
transform:translateY(0)}
50%{
transform:translateY(-7px)}
}

/* 夜の間に、線路を整える（#mission） */
@media(prefers-reduced-motion:reduce){
#mission .mission-light{
animation:none}
}

/* Edge-to-edge photo header, flush with the chapter's top edge. */
.p-recruit #mission{
padding-top:0;
justify-content:flex-start;
gap:10px}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission>.c-container{
padding-inline:0;
flex:none;
gap:12px}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .mission-collage{
height:clamp(180px,34svh,270px);
min-height:0;
flex:none;
border-radius:0;
box-shadow:none;
width:100%;
margin:0 0 6px}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .mission-collage .vcard__en{
left:22px;
bottom:14px}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission>.c-container>p,.p-recruit #mission>.c-container>.c-section-title-primary{
max-width:calc(100% - 44px)}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee{
margin-top:auto;
margin-bottom:7px}

/* 夜の間に、線路を整える（#mission） */
@media(max-height:650px){
.p-recruit #mission{
padding-top:0;
gap:7px}
.p-recruit #mission>.c-container{
gap:8px}
.p-recruit #mission .mission-collage{
height:30svh;
margin-bottom:2px}
}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .mission-collage{
border:0;
padding:0}

/* Seamless photo collage with a restrained editorial chapter label. */
#mission .mission-collage__grid{
gap:0;
background:none}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .mission-collage{
margin:0}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .mission-collage:after{
content:'';
position:absolute;
inset:55% 0 0;
background:linear-gradient(transparent,#142b245c);
pointer-events:none;
z-index:1}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission .mission-collage .vcard__en{
background:none;
border:0;
border-radius:0;
padding:0;
left:24px;
bottom:18px;
font-family:Fredoka,sans-serif;
font-size:30px;
font-weight:500;
letter-spacing:.09em;
line-height:1;
color:#fff;
text-shadow:0 1px 6px #0002}

/* Center the copy in the space between photography and the moving ribbon. */
.p-recruit #mission{
gap:0}

/* 夜の間に、線路を整える（#mission） */
.p-recruit #mission>.c-container{
flex:1;
min-height:0;
gap:0}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-copy{
display:flex;
flex:1;
min-height:0;
width:100%;
flex-direction:column;
align-items:center;
justify-content:center;
gap:12px;
padding:12px 22px;
box-sizing:border-box}

/* 夜の間に、線路を整える（#mission） */
#mission .mission-marquee{
margin-top:0}

/* 夜の間に、線路を整える（#mission） */
@media(max-height:650px){
#mission .mission-copy{
gap:8px;
padding-block:8px}
}

/* Keep the collage full bleed, with white gutters between photographs. */
#mission .mission-collage__grid{
gap:4px;
background:#fff}

/* Four milestones on a single-screen illustrated timeline. */
.p-recruit #growth{
background:#fffdf8;
color:#2F2A2A;
height:100svh;
min-height:100svh;
padding:76px 0 43px;
justify-content:center}

/* 覚える。慣れる。上手くなる。（#growth） */
.p-recruit #growth>.c-container{
height:100%;
display:flex;
flex-direction:column;
justify-content:center;
gap:10px;
width:100%}

/* 覚える。慣れる。上手くなる。（#growth） */
.p-recruit #growth .c-section-title-primary{
margin:0!important;
text-align:center;
flex:none}

/* 覚える。慣れる。上手くなる。（#growth） */
.p-recruit #growth .sub{
padding:0;
margin:0 0 5px;
border:0;
background:none;
font-size:13px;
letter-spacing:.16em}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .sub:before{
display:none}

/* 覚える。慣れる。上手くなる。（#growth） */
.p-recruit #growth h2.main{
color:#2D6B5A;
font-size:max(13px,clamp(25px,6.8vw,32px));
line-height:1.45;
letter-spacing:0}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth h2.main .ch{
opacity:1;
transform:none;
animation:none}

/* 覚える。慣れる。上手くなる。（#growth） */
.p-recruit #growth .growth-intro,.p-recruit #growth .growth-outro{
margin:0;
text-align:center;
font-size:max(13px,clamp(11px,2.9vw,13px));
line-height:1.8;
flex:none}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-outro strong{
color:#2D6B5A;
font-weight:800}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-timeline{
list-style:none;
padding:0 0 0 25px;
margin:4px 0;
position:relative;
display:flex;
flex-direction:column;
flex:1;
min-height:0;
max-height:420px}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-timeline:before{
content:'';
position:absolute;
left:5px;
top:8%;
bottom:10%;
width:5px;
border-radius:5px;
background:#2d6b5a19}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-stop{
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
flex:1;
min-height:0;
padding:4px 6px 4px 26px;
border-bottom:1px solid #2d6b5a13;
isolation:isolate}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-stop:last-child{
border-bottom:0}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-stop:before{
content:'';
position:absolute;
left:12px;
top:5%;
height:90%;
width:110px;
border-radius:50%;
background:#f6c45313;
z-index:-1}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-stop:after{
content:'';
position:absolute;
left:-18px;
top:50%;
width:34px;
height:2px;
background:#2D6B5A;
z-index:-1}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-dot{
position:absolute;
left:-25px;
top:calc(50% - 7px);
width:15px;
height:15px;
border-radius:50%;
background:radial-gradient(circle at 30% 25%,#fff7d4,#F6C453 75%);
box-shadow:1px 2px 4px #f6c45328}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-step{
color:#2D6B5A;
font:500 13px/1 Fredoka,sans-serif;
letter-spacing:.06em;
display:inline-flex;
gap:5px;
align-items:baseline}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-step b{
font-size:25px;
font-weight:600}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-stop h3{
font-size:18px;
line-height:1.4;
color:#2D6B5A;
margin:2px 0;
font-weight:800}

/* 覚える。慣れる。上手くなる。（#growth） */
.p-recruit #growth .growth-stop p{
font-size:max(13px,clamp(10px,2.6vw,12px));
line-height:1.6;
margin:0;
letter-spacing:0}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-stop img{
height:76px;
max-height:100%;
width:65px;
object-fit:contain;
flex:none;
margin-left:5px;
animation:growthBob 6s ease-in-out infinite}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-stop:nth-child(even) img{
animation-delay:-3s}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .chapter-index{
bottom:34px;
color:#2D6B5A}

/* アニメーション・状態制御 */
@keyframes growthBob{
0%,100%{
transform:translateY(0)}
50%{
transform:translateY(-4px)}
}

/* 覚える。慣れる。上手くなる。（#growth） */
@media(max-height:650px){
.p-recruit #growth{
padding-top:68px}
.p-recruit #growth>.c-container{
gap:6px}
.p-recruit #growth h2.main{
font-size:25px}
#growth .growth-stop h3{
font-size:16px}
#growth .growth-step b{
font-size:20px}
#growth .growth-stop img{
height:58px;
width:49px}
.p-recruit #growth .growth-stop p{
font-size:13px}
#growth .growth-stop{
padding-block:0}
}

/* 覚える。慣れる。上手くなる。（#growth） */
@media(prefers-reduced-motion:reduce){
#growth .growth-stop img{
animation:none}
}

/* Subtle scenery around the growth timeline, outside its reading area. */
#growth .growth-scenery{
position:absolute;
inset:0 0 42px;
overflow:hidden;
pointer-events:none;
z-index:0;
background:radial-gradient(ellipse at 95% 15%,#f6c45315,transparent 45%),radial-gradient(ellipse at 0 80%,#2d6b5a09,transparent 50%)}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-scenery:before{
content:'';
position:absolute;
right:-155px;
top:12%;
width:195px;
height:290px;
border:22px solid #2d6b5a0c;
border-radius:55% 45% 65% 35%;
transform:rotate(30deg)}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-scenery:after{
content:'';
position:absolute;
left:-180px;
bottom:4%;
width:200px;
height:260px;
border:25px solid #f6c45320;
border-radius:40% 60% 45% 55%;
transform:rotate(-25deg)}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-glow{
position:absolute;
width:19px;
height:19px;
border-radius:50%;
background:radial-gradient(circle at 30% 25%,#fff8dc,#F6C453);
box-shadow:3px 5px 9px #f6c45320;
animation:growthBob 6s ease-in-out infinite}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-glow--one{
right:14px;
top:30%}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-glow--two{
left:10px;
top:16%;
width:12px;
height:12px;
background:radial-gradient(circle at 30% 25%,#e3eee9,#80aa99);
animation-delay:-3s}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-spark{
position:absolute;
right:13px;
bottom:11%;
font-style:normal;
font-size:18px;
color:#F6C453;
opacity:.6}

/* 覚える。慣れる。上手くなる。（#growth） */
@media(prefers-reduced-motion:reduce){
#growth .growth-glow{
animation:none}
}

/* Keep each step number and its title on one line. */
#growth .growth-stop__copy{
display:grid;
grid-template-columns:max-content 1fr;
align-items:baseline;
column-gap:10px;
min-width:0}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-stop__copy h3{
white-space:nowrap;
margin:0}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-stop__copy p{
grid-column:1/-1;
margin-top:5px}

/* 覚える。慣れる。上手くなる。（#growth） */
#growth .growth-step{
white-space:nowrap}

/* 覚える。慣れる。上手くなる。（#growth） */
@media(max-width:360px){
#growth .growth-stop__copy{
column-gap:7px}
#growth .growth-stop h3{
font-size:15px}
#growth .growth-step b{
font-size:21px}
#growth .growth-stop img{
width:42px}
}

/* ===== 適用順を維持した編集ブロック：旧 empathy.css ===== */

/* 毎日新しいステージじゃなくていい（#empathy） */
/* A playful chapter opening: brand-green graph paper and white title tiles. */
.p-recruit #empathy{
background-color:#2D6B5A;
background-image:linear-gradient(#ffffff10 1px,transparent 1px),linear-gradient(90deg,#ffffff10 1px,transparent 1px);
background-size:28px 28px;
color:#fff;
padding-top:94px}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .chapter-decor:before{
background:#ffffff04}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .chapter-decor:after{
background:#f6c45309}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero{
position:relative;
min-height:290px;
display:flex;
align-items:center;
justify-content:center;
margin:0 -8px 24px;
padding:36px 0 55px;
isolation:isolate}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-hero:before{
content:'';
position:absolute;
z-index:-1;
width:270px;
height:270px;
max-width:90%;
border-radius:50%;
background:#ffffff0d;
border:1px solid #ffffff24;
box-shadow:inset 0 0 40px #ffffff05;
top:4px;
left:50%;
transform:translateX(-50%)}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero .c-section-title-primary{
text-align:center;
margin:0!important;
position:relative;
z-index:2}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .sub{
background:transparent;
border:0;
color:#F6C453;
font-size:13px;
letter-spacing:.15em;
margin-bottom:18px}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy h2.main{
font-size:max(13px,clamp(23px,6.2vw,29px));
line-height:1.6;
color:#2D6B5A;
font-weight:800;
letter-spacing:.035em;
text-wrap:initial;
word-break:normal}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .title-tile{
display:table;
margin:0 auto 8px;
padding:2px 10px 5px;
background:#fff;
box-shadow:0 4px 0 #1e355c25;
border-radius:3px;
border:1px dashed #2d6b5a55}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-mascot{
position:absolute;
z-index:3;
bottom:0;
width:87px;
height:auto;
filter:drop-shadow(0 9px 7px #1e355c30);
animation:softFloat 5.5s ease-in-out infinite;
pointer-events:none}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-mascot--left{
left:-10px}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-mascot--right{
right:-8px;
width:80px;
bottom:12px;
animation-delay:-2.5s}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .rows{
display:flex;
gap:9px;
margin:22px 0 24px}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .row{
flex:1;
display:flex;
flex-direction:column;
gap:10px;
align-items:center;
padding:16px 5px;
border-radius:19px;
border:1px solid #fff9;
box-shadow:0 5px 0 #1e355c18}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .row .label{
background:#F6C453;
color:#2F2A2A;
font-size:13px;
padding:4px 12px}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .row__title{
font-size:13px;
line-height:1.7;
letter-spacing:0;
text-align:center}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-question{
text-align:center;
font-size:13px;
line-height:2}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-question .u-hl{
color:#F6C453;
background:none}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .split{
display:block;
margin-top:24px!important}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .talk-bubble{
position:relative;
color:#2F2A2A;
padding:23px 22px;
border-radius:24px;
font-size:13px;
line-height:1.95;
border:0;
background:#fff;
box-shadow:0 5px 0 #1e355c18}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .talk-bubble:before{
content:'';
position:absolute;
top:-9px;
left:40px;
width:20px;
height:20px;
background:#fff;
transform:rotate(45deg)}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .talk-bubble .u-hl{
color:#2D6B5A;
background:linear-gradient(transparent 65%,#F6C45366 65%);
background-size:100% 100%;
font-weight:800}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .chapter-index{
color:#F6C453}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(max-width:360px){
.p-recruit #empathy .empathy-hero{
margin-inline:0;
min-height:278px}
.p-recruit #empathy h2.main{
font-size:23px}
#empathy .empathy-mascot--left{
width:68px;
left:-10px}
#empathy .empathy-mascot--right{
width:64px;
right:-8px}
.p-recruit #empathy .row__title{
font-size:13px}
.p-recruit #empathy .rows{
gap:6px}
.p-recruit #empathy .talk-bubble{
font-size:13px;
padding:21px 18px}
}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(prefers-reduced-motion:reduce){
#empathy .empathy-mascot{
animation:none}
}

/* Restore the earlier cream base while retaining the playful composition. */
.p-recruit #empathy{
background-color:var(--c-cream);
color:#2F2A2A;
background-image:linear-gradient(#2d6b5a08 1px,transparent 1px),linear-gradient(90deg,#2d6b5a08 1px,transparent 1px)}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-hero:before{
background:#f6c45312;
border-color:#2d6b5a12}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .sub{
color:#2D6B5A}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-question .u-hl{
color:#2D6B5A}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .chapter-index{
color:#2D6B5A}

/* Organic title panel with intentional phrase-level line breaks. */
.p-recruit #empathy .empathy-hero{
min-height:320px;
margin:0 -16px 24px;
padding:75px 12px 90px}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-hero:before{
inset:0;
width:100%;
height:100%;
max-width:none;
transform:none;
border:0;
border-radius:0;
box-shadow:none;
background:url("images/empathy-title-blob.svg") center/100% 100% no-repeat}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero h2.main{
color:#fff;
font-size:max(13px,clamp(20px,5.7vw,27px));
line-height:1.65;
letter-spacing:0;
font-weight:800}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-title-line{
display:block;
white-space:nowrap}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero .sub{
display:block;
color:#F6C453;
font-size:13px;
letter-spacing:.12em;
margin:17px 0 0;
padding:0;
background:none;
border:0}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-hero .sub:before{
display:none}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-mascot--left{
width:76px;
left:0;
bottom:1px}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-mascot--right{
width:88px;
right:-2px;
bottom:4px}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(max-width:360px){
.p-recruit #empathy .empathy-hero{
min-height:292px;
margin-inline:-12px;
padding-inline:7px}
.p-recruit #empathy .empathy-hero h2.main{
font-size:20px}
#empathy .empathy-mascot--left{
width:64px}
#empathy .empathy-mascot--right{
width:74px}
}

/* One-screen chapter: title, team artwork, and a concise message. */
.p-recruit #empathy{
height:100svh;
min-height:100svh;
max-height:none;
padding:76px 0 43px;
display:flex;
justify-content:center}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy>.c-container{
height:100%;
width:100%;
display:flex;
flex-direction:column;
justify-content:center;
gap:clamp(8px,1.8svh,16px)}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero{
flex:none;
min-height:0;
height:clamp(130px,23svh,185px);
margin:0 -12px;
padding:24px 8px;
display:flex;
align-items:center}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero h2.main{
font-size:max(13px,clamp(20px,5.5vw,26px));
line-height:1.5}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero .sub{
font-size:13px;
margin-top:10px}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-team{
display:block;
flex:0 1 auto;
min-height:0;
height:clamp(120px,25svh,210px);
width:100%;
object-fit:contain;
animation:softFloat 5.5s ease-in-out infinite}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-question{
flex:none;
margin:0;
font-size:max(13px,clamp(11px,2.9vw,13px));
line-height:1.8}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .talk-bubble{
flex:none;
text-align:center;
margin:0;
padding:12px 10px;
font-size:max(13px,clamp(12px,3vw,14px));
line-height:1.85;
border-radius:22px}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .chapter-index{
bottom:35px}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(max-height:650px){
.p-recruit #empathy{
padding-top:68px;
padding-bottom:40px}
.p-recruit #empathy>.c-container{
gap:7px}
.p-recruit #empathy .empathy-hero{
height:126px}
.p-recruit #empathy .empathy-hero h2.main{
font-size:21px}
#empathy .empathy-team{
height:19svh}
.p-recruit #empathy .talk-bubble{
padding:9px;
font-size:13px}
}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(prefers-reduced-motion:reduce){
#empathy .empathy-team{
animation:none}
}

/* Three compact illustrated panels, with clear text-safe centers. */
#empathy .empathy-points{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:9px;
margin:9px 0 0;
padding:0;
list-style:none;
flex:none}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-points li{
position:relative;
isolation:isolate;
background:#fff;
border-radius:17px;
padding:19px 3px 13px;
text-align:center;
box-shadow:0 3px 0 #2d6b5a0b}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-points li:before,#empathy .empathy-points li:after{
content:'';
position:absolute;
z-index:-1;
pointer-events:none;
width:16px;
height:100%;
top:0}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-points li:before{
left:0;
background:#2D6B5A;
border-radius:17px 0 0 17px;
clip-path:polygon(0 0,90% 0,60% 20%,35% 40%,48% 65%,100% 100%,0 100%)}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-points li:after{
right:0;
background:#F6C453;
border-radius:0 17px 17px 0;
clip-path:polygon(100% 0,100% 100%,0 100%,45% 75%,62% 50%,35% 25%)}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .point-number{
position:absolute;
left:50%;
top:-10px;
transform:translateX(-50%);
display:grid;
place-items:center;
width:22px;
height:22px;
border-radius:50%;
background:#2D6B5A;
color:#fff;
font:500 13px Fredoka,sans-serif;
border:2px solid var(--c-cream)}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .point-label{
font-size:13px;
font-weight:800;
color:#2D6B5A}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-points p{
font-size:max(13px,clamp(9px,2.5vw,11px));
letter-spacing:0;
line-height:1.6;
margin:4px 0 0;
white-space:nowrap}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero h2.main .ch{
opacity:1;
transform:none;
animation:none}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-team{
height:clamp(100px,22svh,180px)}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(max-height:650px){
#empathy .empathy-team{
height:17svh}
#empathy .empathy-points li{
padding-top:14px;
padding-bottom:8px}
.p-recruit #empathy .empathy-hero{
height:118px}
}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-points li:before{
clip-path:none;
background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 100' preserveAspectRatio='none'%3E%3Cpath fill='%232D6B5A' d='M0 0H20C18 19 2 28 5 46S19 77 20 100H0Z'/%3E%3C/svg%3E") center/100% 100%;
overflow:hidden}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-points li:after{
clip-path:none;
background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 100' preserveAspectRatio='none'%3E%3Cpath fill='%23F6C453' d='M20 0V100H0C2 82 17 74 14 54S1 21 20 0Z'/%3E%3C/svg%3E") center/100% 100%;
overflow:hidden}

/* Restore the fuller organic heading silhouette. */
.p-recruit #empathy .empathy-hero{
height:clamp(165px,27svh,215px);
padding:28px 8px;
margin-inline:-16px}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero h2.main{
font-size:max(13px,clamp(20px,5.7vw,27px));
line-height:1.65}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero .sub{
margin-top:17px;
font-size:13px}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-team{
height:clamp(95px,19svh,160px)}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(max-height:650px){
.p-recruit #empathy .empathy-hero{
height:150px}
.p-recruit #empathy .empathy-hero h2.main{
font-size:21px}
.p-recruit #empathy .empathy-hero .sub{
margin-top:10px;
font-size:13px}
#empathy .empathy-team{
height:14svh}
}

/* Rebalance the chapter after removing the team illustration. */
.p-recruit #empathy>.c-container{
gap:clamp(20px,4svh,34px)}

/* 毎日新しいステージじゃなくていい（#empathy） */
.p-recruit #empathy .empathy-hero{
height:clamp(200px,34svh,280px)}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(max-height:650px){
.p-recruit #empathy>.c-container{
gap:18px}
.p-recruit #empathy .empathy-hero{
height:180px}
}

/* Existing workers frame the title, staying below the lettering. */
#empathy .empathy-mascot--left{
width:72px;
left:0;
bottom:-8px}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-mascot--right{
width:78px;
right:0;
bottom:-7px}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-mascot{
animation:empathyBob 5.5s ease-in-out infinite}

/* 毎日新しいステージじゃなくていい（#empathy） */
#empathy .empathy-mascot--right{
animation-delay:-2.5s}

/* アニメーション・状態制御 */
@keyframes empathyBob{
0%,100%{
transform:translateY(0)}
50%{
transform:translateY(-7px)}
}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(max-height:650px){
#empathy .empathy-mascot--left{
width:57px}
#empathy .empathy-mascot--right{
width:62px}
}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(prefers-reduced-motion:reduce){
#empathy .empathy-mascot{
animation:none}
}

/* Enlarge the two intentional title lines without introducing extra wraps. */
.p-recruit #empathy .empathy-hero h2.main{
font-size:max(13px,clamp(23px,6.65vw,32px));
line-height:1.25;
letter-spacing:0}

/* 毎日新しいステージじゃなくていい（#empathy） */
@media(max-width:360px){
.p-recruit #empathy .empathy-hero h2.main{
font-size:max(13px,clamp(22px,6.65vw,24px))}
}

/* 毎日新しいステージじゃなくていい：原稿補足後の文章量に合わせた余白 */
.p-recruit #empathy>.c-container{gap:18px}
#empathy .empathy-points p{white-space:normal;overflow-wrap:anywhere}
/* 見出し・英字を上下のくびれの内側に収める高さ。 */
.p-recruit #empathy .empathy-hero{height:clamp(230px,32svh,270px)}
.p-recruit #empathy .talk-bubble{font-size:13px;line-height:1.8;padding:16px 20px;text-align:left}
.p-recruit #empathy .talk-bubble .u-hl{display:table;margin:8px auto 0}

/* ===== 適用順を維持した編集ブロック：旧 remaining.css ===== */

/* エントリー（#entry） */
/* Later chapters: one visual idea per screen, with shared brand typography. */
.p-recruit .refined:not(#entry){
height:100svh;
min-height:100svh;
padding:78px 0 45px;
justify-content:center}

/* 共通レイアウト・コンポーネント */
.p-recruit .refined>.c-container{
position:relative;
z-index:2;
width:100%;
display:flex;
flex-direction:column;
align-items:stretch;
justify-content:center;
gap:clamp(12px,2.2svh,20px);
text-align:center}

/* 共通レイアウト・コンポーネント */
.p-recruit .chapter-heading{
margin:0 0 10px}

/* 共通レイアウト・コンポーネント */
.p-recruit .chapter-heading .eyebrow{
font:500 13px/1.5 Fredoka,sans-serif;
letter-spacing:.16em;
color:#2D6B5A;
margin:0 0 12px;
background:none;
border:0;
padding:0}

/* 共通レイアウト・コンポーネント */
.p-recruit .chapter-heading h2{
font-family:var(--round-font);
font-size:max(13px,clamp(24px,6.1vw,29px));
font-weight:800;
line-height:1.5;
letter-spacing:0;
color:#2D6B5A;
margin:0}

/* 共通レイアウト・コンポーネント */
.p-recruit .refined p{
margin:0;
font-size:max(13px,clamp(11px,2.9vw,13px));
line-height:1.9;
letter-spacing:0}

/* 共通レイアウト・コンポーネント */
.p-recruit .refined .chapter-emphasis{
color:#2D6B5A;
font-weight:800;
font-size:max(13px,clamp(12px,3vw,14px))}

/* 共通レイアウト・コンポーネント */
.p-recruit .refined.is-green h2,.p-recruit .refined.is-night h2{
color:white}

/* 共通レイアウト・コンポーネント */
.p-recruit .refined.is-green .eyebrow,.p-recruit .refined.is-night .eyebrow,.p-recruit .refined.is-green .chapter-emphasis,.p-recruit .refined.is-night .chapter-emphasis{
color:#F6C453}

/* 共通レイアウト・コンポーネント */
.refined .chapter-index{
bottom:34px}

/* 共通レイアウト・コンポーネント */
.section-art{
position:absolute;
inset:0 0 42px;
overflow:hidden;
pointer-events:none;
z-index:0}

/* 共通レイアウト・コンポーネント */
.section-art:before,.section-art:after{
content:'';
position:absolute;
border-radius:45% 55% 65% 35%;
width:260px;
height:290px;
border:26px solid #2d6b5a09;
left:-220px;
top:12%;
transform:rotate(28deg)}

/* 共通レイアウト・コンポーネント */
.section-art:after{
left:auto;
right:-210px;
top:auto;
bottom:5%;
border-color:#f6c45320;
transform:rotate(-20deg)}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner{
background:#fff9ee;
background-image:radial-gradient(#2d6b5a12 1px,transparent 1px);
background-size:20px 20px}

/* 共通レイアウト・コンポーネント */
.mentor-scene{
position:relative;
height:clamp(150px,29svh,240px);
display:flex;
justify-content:center;
align-items:center}

/* 共通レイアウト・コンポーネント */
.mentor-scene:before{
content:'';
position:absolute;
width:240px;
height:90%;
border-radius:50%;
background:#f6c45324}

/* 共通レイアウト・コンポーネント */
.mentor-scene>img{
position:relative;
height:100%;
width:auto;
max-width:80%;
object-fit:contain;
animation:gentleBob 6s ease-in-out infinite}

/* 共通レイアウト・コンポーネント */
.team-stamp{
position:absolute;
right:0;
bottom:8px;
background:#2D6B5A;
color:#fff;
border-radius:50%;
width:96px;
height:96px;
display:flex;
flex-direction:column;
justify-content:center;
font-size:13px;
line-height:1.2;
box-shadow:0 0 0 5px #fff9ee}

/* 共通レイアウト・コンポーネント */
.team-stamp strong{
font:600 42px/1 Fredoka,sans-serif;
color:#F6C453}

/* 共通レイアウト・コンポーネント */
.message-panel{
font-size:13px;
line-height:1.9;
padding:17px 12px;
background:#fff;
border-radius:22px;
border-bottom:3px solid #2d6b5a12}

/* 共通レイアウト・コンポーネント */
.message-panel strong{
color:#2D6B5A}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience{
background:#2D6B5A;
background-image:linear-gradient(35deg,transparent 65%,#ffffff06 65%),radial-gradient(#ffffff18 1px,transparent 1px);
background-size:auto,26px 26px}/* 共通レイアウト・コンポーネント */
.pass-caption{
font-size:13px;
color:#2D6B5A;
font-weight:700}/* フッター */
.pass-footer{
font:500 13px Fredoka,sans-serif;
letter-spacing:.15em;
color:#2D6B5A}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality{
background:#fff9ee;
background-image:linear-gradient(#2d6b5a06 1px,transparent 1px),linear-gradient(90deg,#2d6b5a06 1px,transparent 1px);
background-size:28px 28px}

/* 共通レイアウト・コンポーネント */
.check-sheet{
position:relative;
text-align:left;
background:#fff;
padding:22px 22px 16px;
border-radius:4px 25px 25px 25px;
box-shadow:5px 6px 0 #2d6b5a0c}

/* 共通レイアウト・コンポーネント */
.check-sheet:before{
content:'';
position:absolute;
top:-7px;
left:37%;
width:80px;
height:17px;
background:#F6C453b0;
transform:rotate(-4deg)}

/* 共通レイアウト・コンポーネント */
.sheet-caption{
display:block;
font-size:13px;
color:#2D6B5A;
margin-bottom:9px}

/* 共通レイアウト・コンポーネント */
.check-item{
display:flex;
gap:12px;
align-items:center;
font-size:13px;
font-weight:700;
padding:11px 0;
border-bottom:1px dashed #2d6b5a24}

/* 共通レイアウト・コンポーネント */
.check-item:last-child{
border:0}

/* 共通レイアウト・コンポーネント */
.check-item>span{
color:#2D6B5A;
font-size:18px}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays{
background:#1E355C;
background-image:radial-gradient(circle at 12% 24%,#f6c45390 1px,transparent 2px),radial-gradient(circle at 82% 63%,#fff8 1px,transparent 2px);
background-size:83px 103px,133px 127px}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .section-art:before{
border-color:#fff1}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .section-art:after{
border-color:#f6c45312}

/* 共通レイアウト・コンポーネント */
.holiday-orbit{
height:clamp(145px,27svh,210px);
width:clamp(145px,27svh,210px);
margin:0 auto;
border-radius:50%;
display:flex;
flex-direction:column;
justify-content:center;
background:#F6C453;
color:#1E355C;
box-shadow:0 0 0 12px #f6c45313,0 0 0 28px #f6c45307}

/* 共通レイアウト・コンポーネント */
.holiday-orbit>span{
font-size:13px;
font-weight:700}

/* 共通レイアウト・コンポーネント */
.holiday-orbit>strong{
font:600 clamp(60px,12vw,78px)/1.05 Fredoka,sans-serif;
letter-spacing:-.04em}

/* 共通レイアウト・コンポーネント */
.holiday-orbit strong span{
font:700 17px var(--round-font);
margin-left:3px}

/* 共通レイアウト・コンポーネント */
.off-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:10px}

/* 共通レイアウト・コンポーネント */
.off-grid>div{
border:1px solid #ffffff30;
border-radius:18px;
padding:14px 5px;
background:#ffffff07}

/* 共通レイアウト・コンポーネント */
.off-grid span{
display:block;
font:500 13px Fredoka,sans-serif;
color:#F6C453;
margin-bottom:7px}

/* 共通レイアウト・コンポーネント */
.off-grid b{
font-size:13px}

/* 毎晩の「作業」が、明日の当たり前をつくる。（#value） */
#value{
background:#fffdf6;
background-image:radial-gradient(ellipse at 80% 75%,#f6c4531a,transparent 60%)}

/* 共通レイアウト・コンポーネント */
.dawn-scene{
height:clamp(90px,18svh,140px);
position:relative;
overflow:hidden;
border-radius:80px 80px 24px 24px;
background:linear-gradient(#1E355C,#426b78 60%,#f6c45380);
isolation:isolate}

/* 共通レイアウト・コンポーネント */
.dawn-sun{
position:absolute;
width:65px;
height:65px;
background:#F6C453;
border-radius:50%;
left:calc(50% - 32px);
top:30%;
box-shadow:0 0 0 12px #f6c45316}

/* 共通レイアウト・コンポーネント */
.dawn-track{
position:absolute;
width:105px;
height:120px;
bottom:-72px;
left:calc(50% - 52px);
background:repeating-linear-gradient(0deg,#1E355C 0 5px,transparent 5px 15px);
border-left:6px solid #1E355C;
border-right:6px solid #1E355C;
transform:perspective(90px) rotateX(43deg)}

/* 共通レイアウト・コンポーネント */
.dawn-scene>span{
position:absolute;
left:16px;
top:13px;
color:white;
font:500 13px Fredoka,sans-serif;
letter-spacing:.12em}

/* 共通レイアウト・コンポーネント */
.value-steps{
margin:0;
padding:0;
list-style:none;
text-align:left}

/* 共通レイアウト・コンポーネント */
.value-steps li{
display:flex;
align-items:center;
gap:16px;
border-bottom:1px solid #2d6b5a18;
padding:9px 8px;
font-size:14px;
font-weight:700}

/* 共通レイアウト・コンポーネント */
.value-steps b{
font:500 25px Fredoka,sans-serif;
color:#2D6B5A}

/* 次にログインする場所、変えてみない？（#invitation） */
#invitation{
background:#2D6B5A;
background-image:repeating-linear-gradient(-35deg,transparent 0 48px,#ffffff04 48px 50px)}/* 共通レイアウト・コンポーネント */
.refined .c-button-primary{
margin:0;
width:100%}

/* 共通レイアウト・コンポーネント */
.refined .c-button-primary a{
min-height:54px}

/* Detail pages retain all supplied conditions. */
.p-recruit .detail-section:not(#entry){
height:auto;
min-height:100svh;
background-image:radial-gradient(#2d6b5a0e 1px,transparent 1px);
background-size:22px 22px}

/* 共通レイアウト・コンポーネント */
.detail-section .chapter-decor:before{
border:24px solid #2d6b5a09;
background:none}

/* 共通レイアウト・コンポーネント */
.detail-section .chapter-decor:after{
background:#f6c45315}

/* 共通レイアウト・コンポーネント */
.p-recruit .detail-section .spec{
text-align:left;
margin:0;
padding:14px 20px;
border:1px solid #2d6b5a12;
border-radius:24px;
background:#fff;
box-shadow:0 6px 0 #2d6b5a06}

/* 共通レイアウト・コンポーネント */
.p-recruit .detail-section .spec>div{
padding:12px 0;
grid-template-columns:5em 1fr;
gap:12px;
border-bottom:1px solid #2d6b5a12}

/* 共通レイアウト・コンポーネント */
.p-recruit .detail-section .spec>div:last-child{
border:0}

/* 共通レイアウト・コンポーネント */
.p-recruit .detail-section dt{
font-size:13px;
color:#2D6B5A;
font-weight:800}

/* 共通レイアウト・コンポーネント */
.p-recruit .detail-section dd{
font-size:13px;
line-height:1.8}

/* 共通レイアウト・コンポーネント */
.p-recruit .detail-section .note{
font-size:13px;
line-height:1.7}

/* 共通レイアウト・コンポーネント */
.p-recruit .detail-section .price{
font-size:19px;
color:#2D6B5A}

/* 共通レイアウト・コンポーネント */
.company-photo{
height:150px;
border-radius:24px;
overflow:hidden;
position:relative}

/* 共通レイアウト・コンポーネント */
.company-photo img{
width:100%;
height:100%;
object-fit:cover}

/* 共通レイアウト・コンポーネント */
.company-photo span{
position:absolute;
bottom:0;
left:0;
right:0;
background:linear-gradient(transparent,#1e355ccc);
color:white;
padding:30px 10px 12px;
font-size:13px}

/* 共通レイアウト・コンポーネント */
.p-recruit #benefits .spec>div{
display:block}

/* 共通レイアウト・コンポーネント */
.p-recruit #benefits dt{
margin-bottom:10px}

/* 共通レイアウト・コンポーネント */
.p-recruit #benefits .labels{
display:flex;
flex-wrap:wrap;
gap:8px}

/* 共通レイアウト・コンポーネント */
.p-recruit #benefits .label{
background:#2d6b5a09;
color:#2D6B5A;
font-size:13px;
padding:7px 11px;
white-space:normal;
text-align:left}

/* エントリー（#entry） */
.p-recruit #entry{
background:#fff9ee;
background-image:linear-gradient(#2d6b5a05 1px,transparent 1px),linear-gradient(90deg,#2d6b5a05 1px,transparent 1px);
background-size:28px 28px}

/* エントリー（#entry） */
.p-recruit #entry>.c-container{
padding-top:0!important}

/* エントリー（#entry） */
.p-recruit #entry form{
background:#fff;
border-radius:25px;
padding:22px;
text-align:left;
box-shadow:0 5px 0 #2d6b5a0d}

/* エントリー（#entry） */
.p-recruit #entry .f-item{
margin:0 0 15px}

/* エントリー（#entry） */
.p-recruit #entry label{
font-size:13px;
font-weight:700}

/* エントリー（#entry） */
.p-recruit #entry input,.p-recruit #entry select,.p-recruit #entry textarea{
background:#fafbf9;
border:1px solid #2d6b5a2b;
border-radius:10px;
min-height:44px;
font-family:inherit}

/* エントリー（#entry） */
.p-recruit #entry input:focus,.p-recruit #entry textarea:focus,.p-recruit #entry select:focus{
outline:2px solid #2D6B5A;
outline-offset:2px}

/* エントリー（#entry） */
.p-recruit #entry textarea{
min-height:90px}

/* エントリー（#entry） */
.p-recruit #entry .p-footer{
margin-top:26px}

/* エントリー（#entry） */
.p-recruit #entry .brand-loop img{
display:none}

/* アニメーション・状態制御 */
@keyframes gentleBob{
0%,100%{
transform:translateY(0)}
50%{
transform:translateY(-6px)}
}

/* エントリー（#entry） */
@media(max-height:680px){
.p-recruit .refined:not(#entry){
padding-top:69px}
.p-recruit .refined>.c-container{
gap:10px}
.p-recruit .chapter-heading h2{
font-size:24px}
.p-recruit .chapter-heading .eyebrow{
margin-bottom:7px}
.mentor-scene{
height:145px}
.team-stamp{
width:78px;
height:78px;
font-size:13px}
.team-stamp strong{
font-size:32px}


.check-sheet{
padding:18px 18px 10px}
.check-item{
padding:8px 0;
font-size:13px}
.holiday-orbit{
height:145px;
width:145px}
.holiday-orbit>strong{
font-size:60px}


.company-photo{
height:110px}
.p-recruit .detail-section .spec>div{
padding:8px 0}
}

/* エントリー（#entry） */
@media(max-width:360px){
.p-recruit .chapter-heading h2{
font-size:22px}
.p-recruit .refined p{
font-size:13px}
.p-recruit .detail-section .spec{
padding:12px}
.p-recruit .detail-section .spec>div{
gap:8px}
.p-recruit .detail-section dd{
font-size:13px}
.p-recruit #entry form{
padding:16px}
.off-grid b{
font-size:13px}
}

/* 共通レスポンシブ・アクセシビリティ（適用順維持） */
@media(prefers-reduced-motion:reduce){
.mentor-scene>img{
animation:none}
}

/* 共通レイアウト・コンポーネント */
.dawn-scene>span{
left:0;
right:0;
top:14px;
text-align:center}

/* エントリー（#entry） */
@media(max-height:600px){
.p-recruit .refined:not(#entry){
padding-top:68px;
padding-bottom:40px}
.p-recruit .refined>.c-container{
gap:7px}
.p-recruit .chapter-heading h2{
font-size:21px}
.p-recruit .chapter-heading .eyebrow{
font-size:13px;
margin-bottom:5px}
.check-sheet{
padding:14px 16px 8px}
.check-item{
padding:5px 0;
font-size:13px}
.sheet-caption{
margin-bottom:4px}




.p-recruit .detail-section .spec>div{
padding:5px 0}
.p-recruit .detail-section .spec{
padding:10px 12px}
.p-recruit #benefits .labels{
gap:5px}
.p-recruit #benefits .label{
font-size:13px;
padding:5px 8px}
.p-recruit .detail-section .note{
font-size:13px}
.p-recruit .detail-section dd{
font-size:13px}
.company-photo{
height:95px}
}

/* Philosophy-inspired welcome: brand field, central cast and white promise cards. */
.p-recruit #beginner{
background:#2D6B5A;
background-image:radial-gradient(circle at 8% 22%,#f6c45322 0 6px,transparent 7px),radial-gradient(circle at 93% 61%,#ffffff19 0 10px,transparent 11px);
color:#fff}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .section-art:before{
border-color:#ffffff09}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .section-art:after{
border-color:#f6c45324}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .mentor-scene:before{
width:85%;
height:90%;
background:#1E355C55;
border-radius:38% 62% 35% 65%;
transform:rotate(-10deg)}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .team-stamp{
background:#F6C453;
color:#1E355C;
box-shadow:0 0 0 5px #2D6B5A}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .team-stamp strong{
color:#1E355C}

/* 共通レイアウト・コンポーネント */
.beginner-promises{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px}

/* 共通レイアウト・コンポーネント */
.beginner-promises>div{
background:#fffdf6;
color:#2F2A2A;
padding:17px 7px;
border-radius:20px}

/* 共通レイアウト・コンポーネント */
.beginner-promises span{
display:block;
font:500 13px Fredoka,sans-serif;
color:#2D6B5A;
margin-bottom:6px}

/* 共通レイアウト・コンポーネント */
.beginner-promises strong{
font-size:14px;
color:#2D6B5A}

/* 手厚い、チュートリアルあります。（#beginner） */
.p-recruit #beginner .beginner-promises p{
font-size:13px;
margin-top:6px}

/* 共通レスポンシブ・アクセシビリティ（適用順維持） */
@media(max-height:650px){
.beginner-promises>div{
padding:11px 5px}
.beginner-promises strong{
font-size:13px}
}

/* Navy welcome chapter, organic portrait backdrop, and wave-edged promise cards. */
.p-recruit #beginner{
background-color:#1E355C;
background-image:radial-gradient(circle at 8% 22%,#f6c45322 0 6px,transparent 7px),radial-gradient(circle at 93% 61%,#ffffff19 0 10px,transparent 11px)}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .mentor-scene:before{
width:100%;
height:100%;
border-radius:0;
transform:none;
background:url("images/empathy-title-blob.svg") center/100% 100% no-repeat}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .team-stamp{
box-shadow:0 0 0 5px #1E355C}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises{
gap:12px;
margin-top:10px}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises>div{
position:relative;
isolation:isolate;
background:#fff;
border-radius:20px;
padding:25px 12px 17px;
box-shadow:0 4px 0 #ffffff09}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises>div:before,#beginner .beginner-promises>div:after{
content:'';
position:absolute;
z-index:-1;
top:0;
bottom:0;
width:17px;
pointer-events:none}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises>div:before{
left:0;
border-radius:20px 0 0 20px;
background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 100' preserveAspectRatio='none'%3E%3Cpath fill='%232D6B5A' d='M0 0H20C18 19 2 28 5 46S19 77 20 100H0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises>div:after{
right:0;
border-radius:0 20px 20px 0;
background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 100' preserveAspectRatio='none'%3E%3Cpath fill='%23F6C453' d='M20 0V100H0C2 82 17 74 14 54S1 21 20 0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises>div>span{
position:absolute;
top:-12px;
left:50%;
transform:translateX(-50%);
display:grid;
place-items:center;
width:27px;
height:27px;
background:#2D6B5A;
color:#fff;
border:3px solid #1E355C;
border-radius:50%;
margin:0;
font-size:13px}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises strong{
white-space:nowrap}

/* 手厚い、チュートリアルあります。（#beginner） */
@media(max-height:650px){
#beginner .beginner-promises>div{
padding:20px 10px 12px}
}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .team-count{
display:flex;
align-items:baseline;
justify-content:center;
gap:2px;
white-space:nowrap;
font-size:13px;
line-height:1.2}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .team-count strong{
font-size:38px}

/* 手厚い、チュートリアルあります。（#beginner） */
@media(max-height:680px){
#beginner .team-count{
font-size:13px}
#beginner .team-count strong{
font-size:30px}
}

/* Contrast refinement on the retained navy background. */
.p-recruit #beginner{
background-color:#1E355C;
background-image:none;
color:#fff}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .mentor-scene:before{
background-image:url("images/beginner-blob-light.svg")}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .section-art:before{
border-color:#ffffff05}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .section-art:after{
border-color:#ffffff06}

/* 手厚い、チュートリアルあります。（#beginner） */
.p-recruit #beginner .chapter-heading .eyebrow{
color:#fff;
opacity:.75}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises>div{
background:#fff9ee;
box-shadow:none}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises strong{
color:#1E355C;
font-weight:800}

/* 手厚い、チュートリアルあります。（#beginner） */
.p-recruit #beginner .beginner-promises p{
color:#2F2A2A}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises>div:after{
opacity:.45}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises>div:before{
opacity:.8}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .beginner-promises>div>span{
background:#fff9ee;
color:#2D6B5A;
font-weight:600}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .team-stamp{
background:#F6C453;
color:#1E355C}

/* 手厚い、チュートリアルあります。（#beginner） */
#beginner .chapter-index{
color:#fff;
opacity:.55}

/* Experience: dotted flow, speech panels, and a tall documentary photograph. */
.p-recruit #experience{
background:#edf4ef;
color:#2F2A2A;
background-image:radial-gradient(ellipse at 100% 100%,#f6c45316,transparent 55%)}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .chapter-heading{
text-align:left}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-layout{
display:grid;
grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
gap:15px;
align-items:stretch;
height:clamp(230px,43svh,325px)}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-flow{
list-style:none;
margin:0;
padding:0;
position:relative;
display:flex;
flex-direction:column;
justify-content:space-between}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-flow:before{
content:'';
position:absolute;
left:25px;
top:12%;
bottom:12%;
border-left:3px dotted #2d6b5a40}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-flow li{
position:relative;
display:grid;
grid-template-columns:35px 1fr;
align-items:center;
gap:7px;
min-height:20%}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-number{
font:500 13px Fredoka,sans-serif;
color:#2D6B5A;
background:#edf4ef;
position:relative;
padding:7px 0}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-number:after{
content:'';
position:absolute;
right:4px;
top:calc(50% - 4px);
width:8px;
height:8px;
background:#2D6B5A;
border-radius:50%}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-bubble{
position:relative;
border-radius:16px;
background:#fff;
padding:17px 10px;
color:#2D6B5A;
font-size:13px;
line-height:1.6;
font-weight:800}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-bubble:before{
content:'';
position:absolute;
left:-6px;
top:calc(50% - 6px);
width:12px;
height:12px;
background:#fff;
transform:rotate(45deg);
border-radius:2px}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-photo{
position:relative;
border-radius:22px;
margin:0;
overflow:hidden;
background:#2D6B5A}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-photo img{
width:100%;
height:100%;
object-fit:cover;
object-position:58% center}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-photo figcaption{
position:absolute;
bottom:0;
left:0;
right:0;
padding:35px 8px 15px;
background:linear-gradient(transparent,#1e355ccc);
color:#fff;
font-size:13px;
font-weight:700}

/* あなたの経験、初期ステータス高めです。（#experience） */
@media(max-width:360px){
#experience .experience-layout{
gap:10px;
grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
#experience .experience-bubble{
font-size:13px;
padding:11px 8px}
}

/* あなたの経験、初期ステータス高めです。（#experience） */
@media(max-height:650px){
#experience .experience-layout{
height:230px}
#experience .experience-bubble{
padding-block:11px}
}

/* Character profile treatment for the safety-minded applicant. */
.p-recruit #personality{
background:#2D6B5A;
color:#fff}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .section-art:before{
width:220px;
height:220px;
left:-160px;
top:17%;
border:6px dotted #ffffff40;
border-radius:50%}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .section-art:after{
width:220px;
height:250px;
right:-130px;
bottom:4%;
border:0;
background:radial-gradient(#fff6 1px,transparent 1.6px);
background-size:9px 9px;
border-radius:50%;
transform:rotate(-20deg)}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .personality-profile{
position:relative;
display:grid;
grid-template-columns:80px minmax(0,1fr);
align-items:center;
gap:15px;
background:#fff;
border-radius:25px;
padding:22px 17px;
box-shadow:0 6px 0 #1e355c20;
color:#2F2A2A}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .personality-worker{
width:100%;
height:160px;
object-fit:contain;
animation:gentleBob 6s ease-in-out infinite}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .check-sheet{
background:none;
border-radius:0;
box-shadow:none;
padding:0;
min-width:0}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .check-sheet:before{
display:none}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .sheet-caption{
color:#2D6B5A;
font-size:13px;
line-height:1.6;
font-weight:800;
margin-bottom:8px}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .check-item{
font-size:13px;
font-weight:500;
line-height:1.7;
gap:7px;
border-bottom:2px dotted #2d6b5a25;
padding:11px 0}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .check-item:last-child{
border-bottom:2px dotted #2d6b5a25}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .check-item>span{
font-size:13px}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .chapter-index{
color:#fff}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
@media(max-width:360px){
#personality .personality-profile{
grid-template-columns:58px minmax(0,1fr);
gap:10px;
padding:18px 12px}
#personality .check-item{
font-size:13px}
#personality .sheet-caption{
font-size:13px}
}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
@media(max-height:650px){
#personality .check-item{
padding:8px 0}
#personality .personality-profile{
padding-block:17px}
}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
@media(prefers-reduced-motion:reduce){
#personality .personality-worker{
animation:none}
}

/* Match the warm cream, green and yellow palette of the empathy chapter. */
.p-recruit #experience{
background-color:#fff9ee;
background-image:linear-gradient(#2d6b5a08 1px,transparent 1px),linear-gradient(90deg,#2d6b5a08 1px,transparent 1px);
background-size:28px 28px;
color:#2F2A2A}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-number{
background:#fff9ee;
color:#2D6B5A}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-flow:before{
border-color:#2d6b5a35}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-bubble{
background:#fff;
color:#2D6B5A;
box-shadow:0 4px 0 #2d6b5a08}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .chapter-emphasis{
display:table;
align-self:center;
background:linear-gradient(transparent 68%,#f6c45355 68%)}

/* Separate milestone labels from their dots and add quiet edge scenery. */
#experience .experience-flow li{
grid-template-columns:45px minmax(0,1fr);
gap:8px}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-number{
text-align:left;
padding-right:17px}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-number:after{
right:0}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-flow:before{
left:40px}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .section-art:before{
width:230px;
height:320px;
left:-190px;
top:17%;
border:24px solid #2d6b5a10;
border-radius:40% 60% 65% 35%;
transform:rotate(24deg)}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .section-art:after{
width:230px;
height:270px;
right:-185px;
bottom:5%;
border:25px solid #f6c45326;
border-radius:60% 40% 35% 65%;
transform:rotate(-24deg)}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-layout:before{
content:'';
position:absolute;
right:-15px;
top:22%;
width:17px;
height:17px;
border-radius:50%;
background:radial-gradient(circle at 30% 25%,#fff7dc,#F6C453);
box-shadow:3px 5px 8px #f6c45320;
animation:gentleBob 6s ease-in-out infinite;
pointer-events:none}

/* あなたの経験、初期ステータス高めです。（#experience） */
@media(max-width:360px){
#experience .experience-flow li{
grid-template-columns:40px minmax(0,1fr);
gap:7px}
#experience .experience-flow:before{
left:35px}
}

/* あなたの経験、初期ステータス高めです。（#experience） */
@media(prefers-reduced-motion:reduce){
#experience .experience-layout:before{
animation:none}
}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-layout{
position:relative}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-character{
position:absolute;
right:-5px;
bottom:3px;
width:64px;
height:88px;
object-fit:contain;
filter:drop-shadow(0 4px 4px #1e355c25);
animation:gentleBob 6s ease-in-out infinite;
pointer-events:none}

/* あなたの経験、初期ステータス高めです。（#experience） */
#experience .experience-photo figcaption{
bottom:86px;
padding:24px 5px 8px}

/* あなたの経験、初期ステータス高めです。（#experience） */
@media(max-width:360px){
#experience .experience-character{
width:51px;
height:73px}
#experience .experience-photo figcaption{
bottom:74px;
font-size:13px}
}

/* あなたの経験、初期ステータス高めです。（#experience） */
@media(prefers-reduced-motion:reduce){
#experience .experience-character{
animation:none}
}

/* ===== 適用順を維持した編集ブロック：旧 editorial.css ===== */

/* 「慎重すぎる」は、この仕事では強さです。（#personality） ／ オフ時間まで、ちゃんと充実。（#holidays） ／ 毎晩の「作業」が、明日の当たり前をつくる。（#value） ／ 次にログインする場所、変えてみない？（#invitation） */
/* Photography-led closing chapters. */
#personality .section-art,#holidays .section-art,#value .section-art,#invitation .section-art{
opacity:.4}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
.p-recruit #personality{
background:#fff9ee;
color:#2F2A2A;
background-image:linear-gradient(90deg,#2d6b5a05 1px,transparent 1px);
background-size:36px 36px}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
.p-recruit #personality h2,.p-recruit #personality .eyebrow,.p-recruit #personality .chapter-emphasis{
color:#2D6B5A}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .personality-profile{
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
gap:18px;
padding:0;
background:none;
box-shadow:none;
border-radius:0}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .personality-worker{
align-self:stretch;
height:100%;
min-height:250px;
width:100%;
object-fit:cover;
object-position:30% center;
border-radius:22px;
animation:none}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .check-item{
padding:9px 0;
font-size:13px}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .chapter-index{
color:#2D6B5A}

/* オフ時間まで、ちゃんと充実。（#holidays） */
.p-recruit #holidays{
background:#1E355C}/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .holiday-orbit{
background:none;
box-shadow:none;
border-radius:0;
width:auto;
height:auto;
flex-direction:row;
align-items:baseline;
gap:10px;
color:#fff;
flex-wrap:wrap}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .holiday-orbit>strong{
font-size:66px;
color:#F6C453}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .holiday-orbit>span{
font-size:13px}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid{
display:block;
text-align:left;
border-top:1px solid #ffffff30}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid>div{
border:0;
border-bottom:1px solid #ffffff30;
border-radius:0;
background:none;
padding:10px 0;
display:flex;
align-items:center;
justify-content:space-between}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid span{
margin:0}

/* 共通レイアウト・コンポーネント */
.value-photo{
margin:0;
position:relative;
height:clamp(100px,22svh,175px);
overflow:hidden;
border-radius:4px 35px 4px 4px}

/* 共通レイアウト・コンポーネント */
.value-photo img{
width:100%;
height:100%;
object-fit:cover;
object-position:center 60%}

/* 共通レイアウト・コンポーネント */
.value-photo figcaption{
position:absolute;
bottom:0;
left:0;
right:0;
color:white;
background:linear-gradient(transparent,#1e355ccc);
padding:25px 10px 10px;
font-size:13px}

/* 次にログインする場所、変えてみない？（#invitation） */
.p-recruit #invitation{
background:#2D6B5A;
background-image:linear-gradient(135deg,transparent 60%,#ffffff04 60%)}/* 次にログインする場所、変えてみない？（#invitation） */
.p-recruit #invitation .invitation-message{
font-size:18px;
line-height:1.8;
font-weight:700}

/* 会社概要（#company） ／ 募集要項・休日休暇・福利厚生（#requirements） ／ エントリー（#entry） */
.p-recruit #company,.p-recruit #requirements,.p-recruit #entry{
background-color:#fff9ee;
background-image:linear-gradient(90deg,#2d6b5a04 1px,transparent 1px);
background-size:38px 38px}

/* 会社概要（#company） ／ 募集要項・休日休暇・福利厚生（#requirements） ／ エントリー（#entry） */
#company .chapter-decor,#requirements .chapter-decor,#entry .chapter-decor{
opacity:.35}

/* 会社概要（#company） ／ 募集要項・休日休暇・福利厚生（#requirements） */
.p-recruit #company .spec,.p-recruit #requirements .spec{
background:none;
border:0;
border-radius:0;
box-shadow:none;
padding:0}

/* 会社概要（#company） ／ 募集要項・休日休暇・福利厚生（#requirements） */
.p-recruit #company .chapter-heading,.p-recruit #requirements .chapter-heading{
text-align:left}

/* 募集要項・休日休暇・福利厚生（#requirements） */
.p-recruit #requirements{
height:auto;
min-height:100svh;
padding-top:92px;
padding-bottom:65px}

/* 募集要項・休日休暇・福利厚生（#requirements） */
.p-recruit #requirements>.c-container{
gap:26px}

/* 募集要項・休日休暇・福利厚生（#requirements） */
.p-recruit #requirements .spec>div{
padding:17px 0;
border-bottom:1px solid #2d6b5a22}

/* 募集要項・休日休暇・福利厚生（#requirements） */
#requirements .benefits-block{
padding-top:15px;
scroll-margin-top:90px;
text-align:left}

/* 募集要項・休日休暇・福利厚生（#requirements） */
#requirements .benefits-block h3{
font-size:22px;
color:#2D6B5A;
margin:0 0 16px;
font-weight:800}

/* 募集要項・休日休暇・福利厚生（#requirements） */
#requirements .benefits-block .spec>div{
display:block}

/* 募集要項・休日休暇・福利厚生（#requirements） */
#requirements .benefits-block dt{
margin-bottom:10px}

/* 募集要項・休日休暇・福利厚生（#requirements） */
#requirements .benefits-block .labels{
display:block}

/* 募集要項・休日休暇・福利厚生（#requirements） */
#requirements .benefits-block .label{
display:block;
background:none;
color:#2F2A2A;
border-radius:0;
font-size:13px;
padding:5px 0;
font-weight:500;
line-height:1.6}

/* 募集要項・休日休暇・福利厚生（#requirements） */
#requirements .benefits-block .label:before{
content:'・';
color:#2D6B5A}

/* エントリー（#entry） */
.p-recruit #entry form{
box-shadow:none;
border-radius:12px;
border-top:3px solid #2D6B5A}

/* エントリー（#entry） */
.p-recruit #entry .p-footer{
background:#fff9ee}

/* エントリー（#entry） */
.p-recruit #entry .brand-loop{
display:none}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） ／ オフ時間まで、ちゃんと充実。（#holidays） ／ 次にログインする場所、変えてみない？（#invitation） */
@media(max-height:650px){
#personality .personality-worker{
min-height:210px}
#personality .check-item{
padding:7px 0}

#holidays .holiday-orbit>strong{
font-size:52px}
#holidays .off-grid>div{
padding:7px 0}

.p-recruit #invitation .invitation-message{
font-size:16px}
}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
@media(max-width:360px){
#personality .personality-profile{
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
gap:12px}
#personality .check-item{
font-size:13px}
}

/* Retain the playful motion vocabulary in the margins. */
#personality .section-art,#holidays .section-art,#value .section-art,#invitation .section-art{
opacity:1}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） ／ オフ時間まで、ちゃんと充実。（#holidays） ／ 毎晩の「作業」が、明日の当たり前をつくる。（#value） ／ 次にログインする場所、変えてみない？（#invitation） */
#personality .section-art:before,#holidays .section-art:before,#value .section-art:before,#invitation .section-art:before{
opacity:.45}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） ／ オフ時間まで、ちゃんと充実。（#holidays） ／ 毎晩の「作業」が、明日の当たり前をつくる。（#value） ／ 次にログインする場所、変えてみない？（#invitation） */
#personality .section-art:after,#holidays .section-art:after,#value .section-art:after,#invitation .section-art:after{
opacity:.5}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .section-art:before{
border-color:#2d6b5a28}

/* 「慎重すぎる」は、この仕事では強さです。（#personality） */
#personality .section-art:after{
background:radial-gradient(#2d6b5a28 1px,transparent 1.6px);
background-size:9px 9px}

/* 共通レイアウト・コンポーネント */
.editorial-float{
position:absolute;
display:block;
pointer-events:none;
animation:editorialBob 6s ease-in-out infinite;
box-shadow:3px 6px 10px #1e355c0c}

/* 共通レイアウト・コンポーネント */
.editorial-float--gold{
width:19px;
height:19px;
border-radius:50%;
right:8px;
top:27%;
background:radial-gradient(circle at 30% 25%,#fff6cf,#F6C453 75%)}

/* 共通レイアウト・コンポーネント */
.editorial-float--green{
width:13px;
height:17px;
border-radius:6px 8px 5px 7px;
left:7px;
bottom:16%;
background:radial-gradient(circle at 30% 25%,#e4eee7,#78a18f 75%);
animation-delay:-3s}

/* 会社概要（#company） ／ 募集要項・休日休暇・福利厚生（#requirements） ／ エントリー（#entry） */
#company .chapter-decor,#requirements .chapter-decor,#entry .chapter-decor{
opacity:1}

/* 会社概要（#company） ／ 募集要項・休日休暇・福利厚生（#requirements） ／ エントリー（#entry） */
#company .chapter-decor:before,#requirements .chapter-decor:before,#entry .chapter-decor:before,#company .chapter-decor:after,#requirements .chapter-decor:after,#entry .chapter-decor:after{
opacity:.5}

/* アニメーション・状態制御 */
@keyframes editorialBob{
0%,100%{
transform:translateY(0)}
50%{
transform:translateY(-8px)}
}

/* 共通レスポンシブ・アクセシビリティ（適用順維持） */
@media(prefers-reduced-motion:reduce){
.editorial-float{
animation:none}
}

/* Restore the original night-sky holiday composition. */
.p-recruit #holidays{
background:#1E355C;
background-image:radial-gradient(circle at 12% 24%,#f6c45390 1px,transparent 2px),radial-gradient(circle at 82% 63%,#fff8 1px,transparent 2px);
background-size:83px 103px,133px 127px}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .holiday-orbit{
height:clamp(145px,27svh,210px);
width:clamp(145px,27svh,210px);
margin:0 auto;
border-radius:50%;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
flex-wrap:nowrap;
gap:0;
background:#F6C453;
color:#1E355C;
box-shadow:0 0 0 12px #f6c45313,0 0 0 28px #f6c45307}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .holiday-orbit>span{
font-size:13px;
font-weight:700}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .holiday-orbit>strong{
font:600 clamp(60px,12vw,78px)/1.05 Fredoka,sans-serif;
letter-spacing:-.04em;
color:#1E355C}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:10px;
text-align:center;
border:0}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid>div{
display:block;
border:1px solid #ffffff30;
border-radius:18px;
padding:14px 5px;
background:#ffffff07}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid span{
margin-bottom:7px}

/* オフ時間まで、ちゃんと充実。（#holidays） */
@media(max-height:680px){
#holidays .holiday-orbit{
height:145px;
width:145px}
#holidays .holiday-orbit>strong{
font-size:60px}
}

/* Bold brand invitation, floating glossy orbs and a white rolling signature. */
.p-recruit #invitation{
background:#2D6B5A;
padding:80px 0 42px;
display:flex;
flex-direction:column;
justify-content:space-between;
gap:0}

/* 次にログインする場所、変えてみない？（#invitation） */
.p-recruit #invitation>.c-container{
flex:1;
gap:20px;
justify-content:center;
padding-bottom:22px}

/* 次にログインする場所、変えてみない？（#invitation） */
.p-recruit #invitation .invite-kicker{
font:500 13px Fredoka,sans-serif;
letter-spacing:.18em;
color:#fff;
opacity:.85}

/* 次にログインする場所、変えてみない？（#invitation） */
#invitation .invite-wordmark{
font:600 clamp(70px,20vw,96px)/1 Fredoka,sans-serif;
letter-spacing:.02em;
color:#fff}

/* 次にログインする場所、変えてみない？（#invitation） */
.p-recruit #invitation .invite-title{
color:#F6C453;
font-size:max(13px,clamp(23px,6vw,29px));
font-weight:800;
line-height:1.55;
margin:0;
letter-spacing:0}

/* 次にログインする場所、変えてみない？（#invitation） */
#invitation .c-button-primary{
max-width:340px;
align-self:center;
margin-top:6px}

/* 共通レイアウト・コンポーネント */
.invitation-orbs{
position:absolute;
inset:0 0 150px;
pointer-events:none;
overflow:hidden;
z-index:0}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i{
position:absolute;
width:44px;
height:44px;
border-radius:50%;
background:radial-gradient(ellipse at 30% 22%,#fff9 0,transparent 23%),radial-gradient(circle at 42% 35%,#ffe59a,#F6C453 65%,#ad8730);
box-shadow:5px 9px 12px #142f292b,inset -3px -3px 6px #ffffff25;
animation:inviteFloat 6s ease-in-out infinite}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(1){
left:4%;
top:19%;
width:34px;
height:34px}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(2){
right:8%;
top:22%;
width:48px;
height:48px;
animation-delay:-2s}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(3){
left:-12px;
top:47%;
width:40px;
height:40px;
animation-delay:-4s}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(4){
right:-19px;
top:52%;
width:45px;
height:45px;
animation-delay:-1s}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(5){
left:9%;
bottom:6%;
width:28px;
height:28px;
animation-delay:-3s}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(6){
right:7%;
bottom:9%;
width:32px;
height:32px;
animation-delay:-5s}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(7){
left:38%;
top:-13px;
width:44px;
height:44px}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(8){
right:25%;
bottom:-17px;
width:38px;
height:38px;
animation-delay:-2s}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(3n){
background:radial-gradient(ellipse at 30% 22%,#fff9,transparent 24%),radial-gradient(circle at 42% 35%,#7e96b5,#1E355C 80%)}

/* 共通レイアウト・コンポーネント */
.invitation-orbs i:nth-child(3n + 2){
background:radial-gradient(ellipse at 30% 22%,#fff,transparent 28%),radial-gradient(circle at 42% 35%,#fff9ee,#b9cfc3 80%)}

/* 次にログインする場所、変えてみない？（#invitation） */
#invitation .invite-marquee{
background:#fff;
width:100%;
padding:13px 0;
overflow:hidden;
position:relative;
z-index:2;
flex:none}

/* 共通レイアウト・コンポーネント */
.invite-marquee-track{
display:flex;
width:max-content;
animation:missionMarquee 24s linear infinite}

/* 共通レイアウト・コンポーネント */
.invite-marquee-track>div{
display:flex;
align-items:center;
gap:20px;
padding-right:20px;
flex:none}

/* 共通レイアウト・コンポーネント */
.invite-marquee span{
font:600 68px/1 Fredoka,sans-serif;
color:#2D6B5A}

/* 共通レイアウト・コンポーネント */
.invite-marquee img{
height:79px;
width:53px;
object-fit:contain}

/* 次にログインする場所、変えてみない？（#invitation） */
#invitation .chapter-index{
display:none}

/* アニメーション・状態制御 */
@keyframes inviteFloat{
0%,100%{
transform:translateY(0)}
50%{
transform:translateY(-10px)}
}

/* 次にログインする場所、変えてみない？（#invitation） */
@media(max-height:650px){
.p-recruit #invitation{
padding-top:70px}
.p-recruit #invitation>.c-container{
gap:12px;
padding-bottom:13px}
#invitation .invite-wordmark{
font-size:74px}
.p-recruit #invitation .invite-title{
font-size:23px}
.invite-marquee span{
font-size:54px}
.invite-marquee img{
height:62px;
width:43px}
}

/* 共通レスポンシブ・アクセシビリティ（適用順維持） */
@media(prefers-reduced-motion:reduce){
.invitation-orbs i,.invite-marquee-track{
animation:none}
}

/* Holiday cards share the wave edges and numbered medallions. */
#holidays .off-grid{
margin-top:12px;
gap:12px;
counter-reset:holiday}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid>div{
position:relative;
isolation:isolate;
counter-increment:holiday;
background:#fff;
color:#2F2A2A;
border:0;
border-radius:19px;
padding:25px 13px 17px}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid>div:before{
content:'';
position:absolute;
inset:0;
z-index:-1;
pointer-events:none;
border-radius:19px;
background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 100' preserveAspectRatio='none'%3E%3Cpath fill='%232D6B5A' d='M0 0H20C18 19 2 28 5 46S19 77 20 100H0Z'/%3E%3C/svg%3E") left/16px 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 100' preserveAspectRatio='none'%3E%3Cpath fill='%23F6C453' d='M20 0V100H0C2 82 17 74 14 54S1 21 20 0Z'/%3E%3C/svg%3E") right/16px 100% no-repeat}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid>div:after{
content:counter(holiday,decimal-leading-zero);
position:absolute;
top:-12px;
left:50%;
transform:translateX(-50%);
width:27px;
height:27px;
border:3px solid #1E355C;
border-radius:50%;
display:grid;
place-items:center;
background:#2D6B5A;
color:#fff;
font:500 13px Fredoka,sans-serif}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid span{
color:#2D6B5A;
font-weight:600;
margin-bottom:9px;
font-size:13px}

/* オフ時間まで、ちゃんと充実。（#holidays） */
#holidays .off-grid b{
color:#2F2A2A;
font-size:13px;
line-height:1.4;
letter-spacing:0}

/* オフ時間まで、ちゃんと充実。（#holidays） */
@media(max-width:360px){
#holidays .off-grid>div{
padding-inline:12px}
#holidays .off-grid b{
font-size:13px}
}

/* Continuous navy invitation, including the scrolling signature. */
.p-recruit #invitation{
background:#1E355C}

/* 次にログインする場所、変えてみない？（#invitation） */
#invitation .invite-marquee{
background:transparent}

/* 次にログインする場所、変えてみない？（#invitation） */
#invitation .invite-marquee span{
color:#fff}

/* フッター：アイボリー地の住所・連絡先・著作権を読める濃色にする。 */
.p-recruit #entry .p-footer{
color:#2F2A2A}

/* エントリー（#entry） */
.p-recruit #entry .p-footer a{
color:#2D6B5A}

/* 募集要項以降：JSが位置を管理中はCSS snapとの二重制御を避ける。 */
/* ページ位置はsection-scroll.jsで制御。ネイティブsnapとsmoothを二重適用しない。 */
html.bounded-sections{
scroll-snap-type:none;
scroll-behavior:auto}

/* PC右側CTA：募集要項は白、エントリーは黄色。 */
.p-side-right .c-button-primary:first-child a{
background:#fff;
color:#2D6B5A}

/* PC専用UI */
.p-side-right .c-button-primary:last-child a{
background:#F6C453;
color:#2F2A2A}

/* PC専用UI */
.p-side-right .c-button-primary a:hover{
background:#e8f0eb;
color:#2D6B5A}

/* 共通レイアウト・コンポーネント */
.arrow-up-right{
display:block;
flex:none}

/* ==================================================
   原稿補足：指定セクションの本文・画像バランス
   対象：#beginner / #experience / #holidays / #invitation
   本文は13pxを下回らず、装飾と段落間隔で画面内を調整。
   ================================================== */
.p-recruit #beginner>.c-container,
.p-recruit #experience>.c-container,
.p-recruit #holidays>.c-container{gap:14px}
.p-recruit #beginner>.c-container>p,
.p-recruit #experience>.c-container>p,
.p-recruit #holidays>.c-container>p{font-size:13px;line-height:1.85;text-align:left}
/* 応募へのメッセージは見出し・本文・CTAとも中央揃え。 */
.p-recruit #invitation>.c-container>p:not(.invite-kicker){font-size:13px;line-height:1.85;text-align:center}
.p-recruit #beginner .mentor-scene{height:clamp(140px,23svh,190px)}
.p-recruit #experience .experience-layout{height:auto;min-height:260px;flex:none}
.p-recruit #invitation>.c-container{gap:14px}
.p-recruit #invitation .invite-wordmark{font-size:clamp(60px,17vw,82px)}
#personality .personality-profile{align-items:stretch}
#personality .check-item{align-items:flex-start;text-align:left}
#personality .check-item>span{flex:none}
@media(max-height:680px){
.p-recruit #empathy>.c-container{gap:12px}
.p-recruit #empathy .empathy-hero{height:210px}
.p-recruit #empathy .talk-bubble{padding:12px 16px;line-height:1.7}
.p-recruit #beginner>.c-container,
.p-recruit #experience>.c-container,
.p-recruit #holidays>.c-container,
.p-recruit #invitation>.c-container{gap:10px}
.p-recruit #beginner .mentor-scene{height:125px}
.p-recruit #experience .experience-layout{height:auto;min-height:260px}
.p-recruit #invitation .invite-wordmark{font-size:54px}
}

/* 小型・横向き画面：原稿を切らず、13pxを保ったまま縦に読める高さにする。
   is-long-section は既存swipe.jsの長文スクロール判定用。 */
@media(max-height:650px){
.p-recruit #empathy,
.p-recruit .refined#beginner,
.p-recruit .refined#experience,
.p-recruit .refined#personality,
.p-recruit .refined#holidays,
.p-recruit .refined#invitation{height:auto;min-height:100svh;padding-top:78px;padding-bottom:45px}
.p-recruit #empathy>.c-container{height:auto;min-height:0}
.p-recruit #invitation>.c-container{flex:none}
}

/* 休日：追加原稿を含め1画面に収める。休日カードに幅を配分し、本文は13pxを維持。 */
.p-recruit .refined#holidays{
 height:100svh;min-height:100svh;max-height:100svh;
 justify-content:flex-start;padding:50px 0 30px;
}
.p-recruit #holidays>.c-container{
 height:100%;min-height:0;flex:1;gap:10px;justify-content:center;
 padding-inline:18px;
}
.p-recruit #holidays .chapter-heading .eyebrow{margin-bottom:4px}
.p-recruit #holidays .chapter-heading h2{font-size:28px;line-height:1.25;text-wrap:balance}
.p-recruit #holidays .holiday-orbit{
 width:132px;height:132px;flex-shrink:0;
 box-shadow:0 0 0 7px #f6c45313,0 0 0 15px #f6c45307;
}
.p-recruit #holidays .holiday-orbit>strong{font-size:46px}
.p-recruit #holidays .off-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1.25fr);gap:8px;margin-top:8px;margin-bottom:6px}
.p-recruit #holidays .off-grid>div{padding:18px 5px 10px;border-radius:16px}
.p-recruit #holidays .off-grid>div:before{background-size:7px 100%,7px 100%;border-radius:16px}
.p-recruit #holidays .off-grid span{font-size:13px;letter-spacing:0;margin-bottom:5px}
.p-recruit #holidays .off-grid b{display:block;font-size:13px;letter-spacing:0;line-height:1.35}
.p-recruit #holidays>.c-container>p{font-size:13px;line-height:1.5;letter-spacing:0;margin:0}
@media(max-height:700px){
 .p-recruit #holidays>.c-container{gap:10px;justify-content:center}
 .p-recruit #holidays .holiday-orbit{width:124px;height:124px}
 .p-recruit #holidays .holiday-orbit>strong{font-size:38px}
 .p-recruit #holidays .chapter-heading h2{font-size:26px;line-height:1.2}
 .p-recruit #holidays>.c-container>p{line-height:1.35}
}

/* フォーム内のスクロールをページへ連鎖させない（寸法・外観は変更しない）。 */
#entry textarea{overscroll-behavior-y:contain}

/* ==================================================
   夜間工事の共通配色・指定素材（2026年10月）
   全画面の地色 → --night-base。白は情報カードとフォームの面に限定。
   浮遊工具 → tool-*.png。位置・上下アニメーションは各章の既存指定を使用。
   人物は背景込みの支給画像をそのまま表示する。
   ================================================== */
:root{--night-base:#1E355C}
body.p-recruit,.p-recruit .swipe-section:is(#video,#concept,#empathy,#mission,#growth,#beginner,#experience,#personality,#holidays,#value,#invitation,#company,#requirements,#entry),.p-recruit #entry .p-footer{
 background-color:var(--night-base);color:#fff;
}
.p-recruit .swipe-section:is(#video,#concept,#empathy,#mission,#growth,#beginner,#experience,#personality,#holidays,#value,#invitation,#company,#requirements,#entry){background-image:none}
.p-recruit .swipe-section .chapter-heading h2,
.p-recruit .swipe-section .c-section-title-primary .main,
.p-recruit #growth .growth-stop h3{color:#fff}
.p-recruit .swipe-section .eyebrow,
.p-recruit .swipe-section .chapter-emphasis,
.p-recruit #growth .sub,.p-recruit #growth .growth-step,
.p-recruit #growth .growth-outro strong,
.p-recruit #benefits>h3{color:#F6C453}
.p-recruit .swipe-section>.c-container>p,
.p-recruit #growth .growth-stop p,.p-recruit #entry .entry-intro,
.p-recruit #entry .p-footer,.p-recruit #entry .p-footer a{color:#fff}
.p-recruit .detail-section .spec,.p-recruit #entry form,
.p-recruit #empathy .talk-bubble,.p-recruit .check-sheet{color:#2F2A2A}
.p-recruit #growth .growth-stop{border-bottom-color:#ffffff25}
.p-recruit #growth .growth-timeline:before{background:#ffffff40}
.p-recruit #growth .growth-stop:after{background:#F6C453}
.p-recruit .chapter-index,.p-recruit .experience-number{color:#F6C453}
.p-recruit #experience .experience-flow li:before{background:#F6C453}
.p-recruit #value .value-steps{color:#fff}
.p-recruit #value .value-steps b{color:#F6C453}
/* 支給素材には夜の背景が含まれるため、角丸の一枚絵として見せる。 */
.p-recruit img[src*="night-char"],.p-recruit img[src*="night-mentor"]{
 border-radius:16px;object-fit:cover;object-position:center;
}
.p-recruit .mentor-scene img{width:auto;max-width:70%;height:100%;aspect-ratio:1}
.p-recruit .empathy-mascot{object-fit:contain;filter:none}
.p-recruit .experience-character{object-fit:contain;filter:none}
/* 球体のグラデーション・影を工具素材に置き換える。 */
.p-recruit .concept-orb,.p-recruit .invitation-orbs i,
.p-recruit .editorial-float,.p-recruit .float-piece,.p-recruit .growth-glow{
 background:transparent url('images/tool-pickaxe.png') center/contain no-repeat!important;
 border:0;border-radius:0;box-shadow:none;filter:drop-shadow(0 5px 5px #0003);
 min-width:42px;min-height:48px;
}
.p-recruit .concept-orb--gold,.p-recruit .invitation-orbs i:nth-child(3n+2),
.p-recruit .editorial-float--gold,.p-recruit .float-piece--pebble{
 background-image:url('images/tool-measure.png')!important;
}
.p-recruit .concept-orb--blue,.p-recruit .invitation-orbs i:nth-child(3n),
.p-recruit .editorial-float--green{
 background-image:url('images/tool-spanner.png')!important;
}
.p-recruit .concept-orb--pink,.p-recruit .invitation-orbs i:nth-child(4){
 background-image:url('images/tool-signal.png')!important;
}
.p-recruit .invitation-orbs i:nth-child(7){background-image:url('images/tool-wrench.png')!important}
.p-recruit .concept-orb:before,.p-recruit .concept-orb:after,
.p-recruit .float-piece:before,.p-recruit .float-piece:after{display:none}

/* 経験セクション：4項目の実寸で高さを確保し、本文へのはみ出しを防ぐ。 */
.p-recruit #experience .experience-flow{gap:10px}
.p-recruit #experience .experience-flow li{min-height:0}
.p-recruit #experience .experience-photo{min-height:0}
.p-recruit #experience .experience-photo>img{position:absolute;inset:0}
.p-recruit #experience .experience-number{background:#ffffff00;color:#F6C453}
.p-recruit #experience .experience-number:after{background:#F6C453}
.p-recruit #experience .experience-flow:before{border-color:#ffffff55}
.p-recruit #experience .experience-layout:before{width:32px;height:40px;border-radius:0;box-shadow:none;background:url('images/tool-wrench.png') center/contain no-repeat}
.p-recruit #experience{height:auto;min-height:100svh;max-height:none}
/* 白いカード内は本文色を維持（紺色セクションの白文字を継承させない）。 */
.p-recruit #empathy li>p,.p-recruit .beginner-promises>div,
.p-recruit .beginner-promises>div p{color:#2F2A2A}

/* 人物素材：背景透過・丸型・波型の使い分け */
.p-recruit img[src*="cutout-"]{object-fit:contain;border-radius:0;background:none}
.p-recruit #growth .growth-stop img{
 display:block;width:64px;height:64px;max-height:none;flex:0 0 64px;
 border-radius:50%;object-fit:cover;aspect-ratio:1;overflow:hidden;
}
.p-recruit #beginner .mentor-scene:before{display:none}
.p-recruit #beginner .mentor-scene>img{
 width:100%;max-width:100%;height:100%;aspect-ratio:auto;object-fit:cover;
 border-radius:0;animation:none;
 -webkit-mask:url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201000%20450%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M6%20225C-10%20135%2090%2074%20200%2091C285%20103%20292%2015%20414%205C550-6%20650%206%20707%2041C773%2082%20818%2025%20901%2052C1001%2085%201021%20203%20964%20274C917%20330%20956%20394%20857%20420C776%20440%20740%20393%20674%20423C619%20448%20449%20450%20379%20442C300%20435%20287%20386%20211%20404C96%20440%205%20371%206%20225Z%22%2F%3E%3C%2Fsvg%3E') center/100% 100% no-repeat;
 mask:url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201000%20450%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M6%20225C-10%20135%2090%2074%20200%2091C285%20103%20292%2015%20414%205C550-6%20650%206%20707%2041C773%2082%20818%2025%20901%2052C1001%2085%201021%20203%20964%20274C917%20330%20956%20394%20857%20420C776%20440%20740%20393%20674%20423C619%20448%20449%20450%20379%20442C300%20435%20287%20386%20211%20404C96%20440%205%20371%206%20225Z%22%2F%3E%3C%2Fsvg%3E') center/100% 100% no-repeat;
}
/* 紺地上の本文は白、補助見出し・要点は黄色。白い情報カード内は対象外。 */
.p-recruit .swipe-section .chapter-heading .eyebrow,
.p-recruit #invitation .invite-kicker,
.p-recruit #growth .sub,
.p-recruit .swipe-section .chapter-index,
.p-recruit #mission .mission-copy strong,
.p-recruit .swipe-section>.c-container>p.chapter-emphasis,
.p-recruit #growth .growth-outro strong{color:#F6C453;opacity:1}
.p-recruit #experience .chapter-emphasis{background:none}
.p-recruit #mission .mission-marquee span{color:#fff}
@media(max-width:360px){
 .p-recruit #growth .growth-stop img{width:46px;height:46px;flex-basis:46px}
 .p-recruit #growth .growth-stop{padding-right:0;padding-left:18px}
}
/* 既存の章別指定より優先し、紺色の面に残る緑・灰色を解消。 */
.p-recruit #growth h2.main,.p-recruit #growth h2.main .ch,
.p-recruit #personality .chapter-heading h2,
.p-recruit #personality .check-item,
.p-recruit #company .spec dd,.p-recruit #company .spec dd a,
.p-recruit #requirements .spec dd,.p-recruit #requirements .spec .note,
.p-recruit #requirements .spec .label{color:#fff}
.p-recruit #empathy .chapter-index,.p-recruit #growth .chapter-index,
.p-recruit #personality .chapter-index,
.p-recruit #personality .chapter-heading .eyebrow,
.p-recruit #beginner .chapter-heading .eyebrow,
.p-recruit #personality .sheet-caption,.p-recruit #personality .check-item>span,
.p-recruit #personality>.c-container>.chapter-emphasis,
.p-recruit #mission .mission-message,
.p-recruit #company .spec dt,.p-recruit #requirements .spec dt,
.p-recruit #requirements .spec .price{color:#F6C453;opacity:1}

/* ==================================================
   紺色背景のあしらい：余白に曲線・ドット・レールの流れを配置
   対象：共感／未経験／経験／適性／休日／仕事の意義／会社／募集／エントリー
   本文幅・高さに影響しない独立した装飾レイヤー。
   ================================================== */
.p-recruit .night-scenery{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.night-scenery i{position:absolute;display:block;pointer-events:none}
.night-scenery__curve{
 width:250px;height:340px;left:-200px;top:13%;
 background:#2D6B5A;border-radius:42% 58% 64% 36% / 57% 37% 63% 43%;
 opacity:.5;transform:rotate(24deg);
}
.night-scenery__dots{
 width:120px;height:210px;right:-63px;top:48%;border-radius:50%;
 background:radial-gradient(circle,#F6C453 1.2px,transparent 1.7px) 0 0/12px 12px;
 opacity:.26;transform:rotate(-18deg);
}
.night-scenery__line{
 width:230px;height:340px;right:-180px;bottom:5%;
 border:14px solid #F6C453;border-radius:50% 40% 60% 35%;opacity:.16;
 transform:rotate(32deg);
}
/* 奇数・偶数で曲線の向きとドットの位置を交互に変える。 */
:is(#empathy,#personality,#value,#requirements) .night-scenery__curve{
 left:auto;right:-195px;top:8%;transform:rotate(-32deg);background:#2D6B5A;
}
:is(#empathy,#personality,#value,#requirements) .night-scenery__dots{right:auto;left:-76px;top:58%}
:is(#empathy,#personality,#value,#requirements) .night-scenery__line{right:auto;left:-185px;bottom:4%;transform:rotate(-28deg)}
/* 長い情報ページでも上部だけに偏らず、余白に模様を繰り返す。 */
:is(#company,#requirements,#entry) .night-scenery{
 background:radial-gradient(circle,#ffffff25 1px,transparent 1.5px) right 5px top 150px/15px 180px repeat-y;
}
#entry .night-scenery__dots{top:70%}
#experience .night-scenery__dots{top:8%;right:-60px}
#empathy .night-scenery__curve{top:42%}
/* 既存の極薄リングと重ねすぎないよう、この章の旧リングだけを整理。工具は維持。 */
:is(#beginner,#experience,#personality,#holidays,#value)>.section-art:before,
:is(#beginner,#experience,#personality,#holidays,#value)>.section-art:after,
:is(#company,#requirements,#entry)>.chapter-decor:before,
:is(#company,#requirements,#entry)>.chapter-decor:after{display:none}
/* 未経験・共感にも支給工具を上下にゆっくり浮遊させる。 */
:is(#empathy,#beginner) .night-scenery:after{
 content:'';position:absolute;right:12px;top:12%;width:33px;height:42px;
 background:url('images/tool-wrench.png') center/contain no-repeat;
 animation:gentleBob 7s ease-in-out infinite;
}
#beginner .night-scenery:after{left:7px;right:auto;top:25%;background-image:url('images/tool-measure.png')}
@media(prefers-reduced-motion:reduce){.night-scenery:after{animation:none!important}}

/* 3D工具は本文幅の外側へ。上下の浮遊だけを維持して文字への横移動を防ぐ。 */
.p-recruit .concept-orb,.p-recruit .editorial-float,
.p-recruit .float-piece,.p-recruit .growth-glow,
.p-recruit .invitation-orbs i{
 width:52px;height:62px;min-width:0;min-height:0;
 left:5px;right:auto;
}
.p-recruit .concept-orb--gold,.p-recruit .concept-orb--pink,
.p-recruit .editorial-float--green,.p-recruit .float-piece--pebble,
.p-recruit .growth-glow--two,.p-recruit .invitation-orbs i:nth-child(even){
 left:auto;right:5px;
}
.p-recruit :is(#empathy,#beginner) .night-scenery:after{
 width:52px;height:62px;left:5px;right:auto;
}
.p-recruit #experience .experience-layout:before{
 width:40px;height:48px;right:0;top:-52px;
}
@media(max-width:360px){
 .p-recruit .concept-orb,.p-recruit .editorial-float,
 .p-recruit .float-piece,.p-recruit .growth-glow,.p-recruit .invitation-orbs i,
 .p-recruit :is(#empathy,#beginner) .night-scenery:after{width:46px;height:56px}
}
/* 応募へのメッセージ：中央は空け、左上と右下に大きな流れをつくる。 */
#invitation .night-scenery__curve{top:8%;left:-210px;width:280px;height:390px;opacity:.5}
#invitation .night-scenery__dots{top:65%;left:-76px;right:auto;opacity:.3}
#invitation .night-scenery__line{bottom:12%;right:-210px;width:280px;height:370px;border-width:18px;opacity:.22}

/* 応募章は見出し上・本文とCTAの間・署名手前の余白に工具を置く。 */
.p-recruit #invitation .invitation-orbs i:nth-child(1){top:10%;bottom:auto}
.p-recruit #invitation .invitation-orbs i:nth-child(2){top:12%;bottom:auto}
.p-recruit #invitation .invitation-orbs i:nth-child(3){top:39%;bottom:auto}
.p-recruit #invitation .invitation-orbs i:nth-child(4){top:41%;bottom:auto}
.p-recruit #invitation .invitation-orbs i:nth-child(5){top:76%;bottom:auto}
.p-recruit #invitation .invitation-orbs i:nth-child(6){top:78%;bottom:auto}
.p-recruit #invitation .invitation-orbs i:nth-child(7){display:none}
.p-recruit #invitation .invitation-orbs i:nth-child(8){display:none}

/* 工具を画面内に収める。応募章は本文横ではなく上下の空きに配置。 */
.p-recruit #invitation .invitation-orbs i:nth-child(1){top:max(110px,12%)}
.p-recruit #invitation .invitation-orbs i:nth-child(2){top:max(110px,12%)}
.p-recruit #invitation .invitation-orbs i:nth-child(3){top:auto;bottom:18%}
.p-recruit #invitation .invitation-orbs i:nth-child(4){top:auto;bottom:18%}
.p-recruit #invitation .invitation-orbs i:nth-child(5),
.p-recruit #invitation .invitation-orbs i:nth-child(6){display:none}

/* 会社概要：項目名と重ならない右側へ工具を配置。 */
.p-recruit #company .float-piece--ball{left:auto;right:5px}
/* 高さの低いスマホは見出しと休日数を横並びにして、原稿を削らず高さを確保。 */
@media(max-height:620px){
 .p-recruit #holidays>.c-container{display:grid;grid-template-columns:minmax(0,1fr) 124px;align-content:center;gap:7px 8px}
 .p-recruit #holidays .chapter-heading{grid-column:1;text-align:left;align-self:center}
 .p-recruit #holidays .chapter-heading .eyebrow{font-size:13px;letter-spacing:0;line-height:1.1}
 .p-recruit #holidays .chapter-heading h2{font-size:24px}
 .p-recruit #holidays .holiday-orbit{grid-column:2;grid-row:1}
 .p-recruit #holidays .off-grid,.p-recruit #holidays>.c-container>p{grid-column:1/-1}
}

/* 休日：PCだけ見出しを他章と同じ29pxへ。円も拡大しスマホ指定は維持。 */
@media(min-width:769px){
 .p-recruit #holidays .chapter-heading h2{font-size:29px}
 .p-recruit #holidays .holiday-orbit{width:160px;height:160px}
 .p-recruit #holidays .holiday-orbit>strong{font-size:56px}
}
@media(min-width:769px) and (max-height:700px){
 .p-recruit #holidays .holiday-orbit{width:144px;height:144px}
 .p-recruit #holidays .holiday-orbit>strong{font-size:50px}
}
@media(min-width:769px) and (max-height:620px){
 .p-recruit #holidays>.c-container{grid-template-columns:minmax(0,1fr) 144px}
}

/* 休日：スパナを円に追従させ、本文の上に重ならない位置へ。 */
.p-recruit #holidays .holiday-orbit{position:relative}
.p-recruit #holidays .holiday-orbit .holiday-tool{
 position:absolute;left:calc(100% + 84px);right:auto;top:calc(50% - 31px);bottom:auto;
}
@media(max-height:620px){
 .p-recruit #holidays .holiday-orbit .holiday-tool{
  left:auto;right:0;top:calc(100% - 28px);width:34px;height:40px;
 }
}


/* PCではスマホ専用の改行を非表示 */
.sp-only {
  display: none;
}

/* スマホでは改行を表示 */
@media screen and (max-width: 767px) {
  br.sp-only {
    display: inline;
  }
}

/* 10P：PCではスマホ専用の改行を非表示 */
#invitation .invitation-sp-br {
  display: none;
}

/* 10P：スマホのみ改行を表示 */
@media screen and (max-width: 767px) {
  #invitation .invitation-sp-br {
    display: inline;
  }
}

/* 会社概要：項目名（代表取締役）を折り返さない */
.p-recruit #company .spec>div{grid-template-columns:6em 1fr}
.p-recruit #company .spec dt{white-space:nowrap}

/* 募集要項：1画面に固定し、項目部分だけ枠内で縦スクロール */
.p-recruit #requirements{height:100svh;min-height:0;max-height:100svh;overflow:hidden}
.p-recruit #requirements>.c-container{height:100%;min-height:0;display:flex;flex-direction:column}
.p-recruit #requirements .chapter-heading{flex:none}
.p-recruit #requirements .req-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:32px;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 48px),transparent)}
.p-recruit #requirements .req-scroll::-webkit-scrollbar{display:none}
/* 福利厚生：ポップアニメーションを無効化 */
#requirements .benefits-block .label{opacity:1;transform:none;animation:none!important}

/* エントリー：1画面に固定し、セクション内をスクロール */
.p-recruit #entry{height:100svh;min-height:0;max-height:100svh;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;justify-content:flex-start}
.p-recruit #entry::-webkit-scrollbar{display:none}
.p-recruit #entry>.c-container,.p-recruit #entry>.p-footer{flex-shrink:0}

/* 次のステージ（#invitation）：背の低い画面でヘッダーと重ならないよう詰める */
@media (max-height:740px){
.p-recruit #invitation{padding-top:84px;padding-bottom:26px}
.p-recruit #invitation>.c-container{gap:10px;padding-bottom:8px}
.p-recruit #invitation .invite-wordmark{font-size:44px;line-height:1}
.p-recruit #invitation .invite-title{line-height:1.4}
.p-recruit #invitation>.c-container>p.invitation-message{line-height:1.7}
.p-recruit #invitation .invite-marquee{padding:9px 0}
}