/* 採用：環境を知る — 土台（2026-10-07 A1）。正: design/指示書_セクション.md §0（そのまま）。
   ページ変数・下半分で共用する小部品。B1〜B3 はこれを使う（足りない物は A1 への依頼）。
   寸法の記法: rem＝Figma px ÷ 10（PC は rem＝幅/192）。 */
.rc-page-environment{
  --env-gold:#caaa6e;--env-gold-2:#bfa05a;--env-gold-3:#d4b96a;--env-brown:#624f2d;--env-ink:#2a2825;--env-ink-2:#0c111f;--env-gray:#5b5b5b;
  --env-paper:#f0ede6;--env-paper-2:#eae6dc;--env-intro:#eed29f;--env-hero-base:#a2895a;--env-bar:#141414;--env-arrow:#796d55;
  --env-line:rgba(42,40,37,.18);--env-line-gold:rgba(191,160,90,.5);
  --env-t10:max(1rem,9px);--env-t11:max(1.1rem,10px);--env-t12:max(1.2rem,11px);--env-t13:max(1.3rem,12px);--env-t14:max(1.4rem,13px);--env-t16:max(1.6rem,13px);
  --env-pow1:cubic-bezier(.25,.46,.45,.94);--env-wipe:1.5s cubic-bezier(.51,.32,0,.96);--env-io:cubic-bezier(.42,0,.58,1);
  --env-st:max(125rem,100vh);--env-cv:33rem;
  /* v2（指示書 §5.1） */
  --env-gold-4:#947842;--env-ink-3:#494949;--env-ink-4:#382f2c;--env-cow:#e6cd8e;--env-black:#222;--env-brush:linear-gradient(90deg,#c8b89f,#c88e32)
}

/* 下半分の 1200 幅 */
.rc-page-environment .env-wrap{width:min(120rem,100% - var(--gut)*2);margin-inline:auto}

/* 読み上げだけ */
.rc-page-environment .env-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 小さな英字（PICK UP・BENEFITS DIRECTORY・04 / …・RECOGNITION など）。和文は Noto Sans の 700 に落ちる＝Figma の見た目 */
.rc-page-environment .env-eyebrow{font:600 max(1.3rem,11px)/2.21rem var(--cormorant),var(--sans);letter-spacing:.195rem;color:var(--env-ink);margin:0}
.rc-page-environment .env-eyebrow--dark{color:var(--env-gold-3)}

/* ※の注記 */
.rc-page-environment .env-note{font:400 var(--env-t11)/2.2rem var(--sans);margin:0}

/* リンク（住まい・転居について ↓／コーポレートサイトへ ↗／受賞のお知らせ ↗）。ホバーの色変えは B（E-7） */
.rc-page-environment .env-link{display:inline-flex;align-items:center;gap:4.5rem;padding:1.2rem 0;border-bottom:max(.1rem,1px) solid var(--env-gold-2);font:400 var(--env-t12)/2.28rem var(--sans);color:var(--env-ink);text-decoration:none}
.rc-page-environment .env-link--s{font-size:var(--env-t11)}
.rc-page-environment .env-link__i{display:inline-block}

/* 開閉（BENEFITS DIRECTORY・住まい）。行が空のものは div.env-acc--static（＋印なし・カーソル通常） */
.rc-page-environment .env-acc{border-bottom:max(.1rem,1px) solid var(--env-line)}
.rc-page-environment .env-acc__sum{display:flex;justify-content:space-between;align-items:center;padding:2.5rem 0;list-style:none;cursor:pointer}
.rc-page-environment .env-acc__sum::-webkit-details-marker{display:none}
.rc-page-environment .env-acc--static>.env-acc__sum{cursor:auto}
.rc-page-environment .env-acc__head{display:flex;flex-direction:column;gap:.789rem}
.rc-page-environment .env-acc__en{font:600 max(1.1rem,10px)/1.98rem var(--cormorant),var(--sans);letter-spacing:.143rem}
.rc-page-environment .env-acc__title{font:400 2.1rem/3.36rem var(--serif)}
.rc-page-environment .env-acc__icon{position:relative;flex:none;width:3rem;height:3rem;border:max(.1rem,1px) solid var(--env-gold-2);border-radius:0}   /* v2: ＋/－ の印は丸ではなく四角（メモ 528:700・554:221542） */
.rc-page-environment .env-acc__icon::before,.rc-page-environment .env-acc__icon::after{content:"";position:absolute;left:50%;top:50%;background:var(--env-ink);translate:-50% -50%}
.rc-page-environment .env-acc__icon::before{width:1.2rem;height:max(.1rem,1px)}
.rc-page-environment .env-acc__icon::after{width:max(.1rem,1px);height:1.2rem}
.rc-page-environment details[open]>.env-acc__sum .env-acc__icon::after{transform:scaleY(0)}
html.motion .rc-page-environment .env-acc__icon::after{transition:transform .2s ease}
.rc-page-environment .env-acc__dl{margin:0;padding-bottom:1.5rem}
.rc-page-environment .env-acc__row{display:grid;grid-template-columns:26.719rem 1fr;column-gap:2.2rem;padding:1.7rem 0;border-top:max(.1rem,1px) solid var(--env-line)}
.rc-page-environment .env-acc__row dt,.rc-page-environment .env-acc__row dd{margin:0;font:400 var(--env-t12)/2.4rem var(--sans)}
/* 住まいの簡易版 */
.rc-page-environment .env-acc--simple>.env-acc__sum{padding:0 0 2.2rem;font:400 var(--env-t14)/2.52rem var(--sans)}

/* 背景の大きな英字（FOR YOUR LIFE・GOOD COMPANY）。左右ははみ出すので .rc-main{overflow-x:clip} で切れる */
.rc-page-environment .env-word{position:absolute;white-space:nowrap;font:600 25.6rem/48.64rem var(--cormorant);letter-spacing:1.536rem;color:var(--env-ink);opacity:.04;pointer-events:none;user-select:none}

/* 仮置きの絵の枠（v2 指示書 §5.0・裁定 V5）。Figma の灰色 #d9d9d9 の箱をそのまま・文字なし。位置と大きさは呼び出し側の class（sbs_rc_env_slot の $class）。
   ACF の画像が入ると同じ class の img に替わる（env-slot-img。object-fit:cover）。v1 の「写真準備中」入りの枠は .env-ph__t を持つ旧部品だけ */
.rc-page-environment .env-ph{display:block;background:#d9d9d9}
.rc-page-environment img.env-slot-img{display:block;object-fit:cover;max-width:none}
.rc-page-environment .env-ph__t{font:400 var(--env-t12)/1 var(--sans);letter-spacing:.1em;color:rgba(42,40,37,.45)}

/* 目次バーの sticky の親（overflow を付けない）。03 の左上の角の外がこの地になる */
.rc-page-environment .env-body{position:relative;background:var(--env-paper)}

/* ============================================================ 見出し .env-head（01〜04 共通・v2 で growth.css から移した。指示書 §5.0）
   使い方: <header class="env-head [env-head--light]"> p.env-head__en（中に span.env-head__no「01.」＋英字）・p.env-head__label・i.env-head__rule・h2.env-head__catch（・p.env-head__lead）。
   位置は各セクションが変数で渡す: --env-head-label-x（題と線の x）・--h-h（高さ）・--h-en-top・--h-en-lh・--h-label-top・--h-rule-top・--h-catch-top・--h-lead-top（・--h-lead-w）。 */
.rc-page-environment .env-head{position:relative;height:var(--h-h,44rem);margin:0}
.rc-page-environment .env-head__en,
.rc-page-environment .env-head__label,
.rc-page-environment .env-head__catch,
.rc-page-environment .env-head__lead{position:absolute;margin:0;white-space:nowrap}
.rc-page-environment .env-head__en{left:36rem;top:var(--h-en-top);width:78.2rem;font:600 12rem/var(--h-en-lh) var(--cormorant);letter-spacing:.39rem;color:var(--env-gold)}
.rc-page-environment .env-head__no{font-family:var(--serif);font-weight:600;font-size:6rem;line-height:inherit;letter-spacing:.39rem}   /* Figma は Hiragino Mincho W6 60px → Noto Serif JP 600（裁定 V10・指示書 §6） */
.rc-page-environment .env-head__label{left:var(--env-head-label-x);top:var(--h-label-top);width:31rem;font:600 3.815rem/1.41rem var(--serif);letter-spacing:.124rem;color:var(--env-gray)}
.rc-page-environment .env-head__rule{position:absolute;left:var(--env-head-label-x);top:var(--h-rule-top);width:28.25rem;height:.2rem;background:var(--env-gold)}
.rc-page-environment .env-head__catch{left:36rem;top:var(--h-catch-top);width:120rem;font:700 4rem/8.25rem var(--serif);letter-spacing:.2rem;color:var(--env-gold)}
.rc-page-environment .env-head__lead{left:36rem;top:var(--h-lead-top);width:var(--h-lead-w,120rem);font:600 2.5rem/4.5rem var(--serif);letter-spacing:.15rem;color:var(--env-ink)}
/* 03 だけ白（英字・題・キャッチ・線）。リードは茶 */
.rc-page-environment .env-head--light .env-head__en,
.rc-page-environment .env-head--light .env-head__label,
.rc-page-environment .env-head--light .env-head__catch{color:#fff}
.rc-page-environment .env-head--light .env-head__rule{background:#fff}
.rc-page-environment .env-head--light .env-head__lead{color:var(--env-brown)}

/* ============================================================ 四つ角カード .env-cc（6 つの制度・04 のカード 2。指示書 §7 #2）
   形: rc-common.css の .rc-corner（--cx --cy --cw --cc --cl --ct --cr --cb）・DOM は i.rc-corner.rc-corner--tl|tr|br|bl を 4 つ（inc/recruit/parts.php 84〜85 行と同じ）。
   ホバーで ±7px・.3s ease-out（.rc-corner の transition）。浮かせない。マウス環境＋演出ありのときだけ */
.rc-page-environment .env-cc{position:relative;--cx:1.937rem;--cy:1.628rem;--cw:.327rem;--cc:#caaa6e;--cl:0rem;--ct:0rem;--cr:0rem;--cb:0rem}   /* --cl〜--cb は単位つき（calc(var(--cl) * -1) が長さになるため。0 だけだと left が無効になり 4 つの角が 1 点に重なる） */
@media (hover:hover){
  html.motion .rc-page-environment .env-cc:hover .rc-corner--tl{transform:translate(-7px,-7px)}
  html.motion .rc-page-environment .env-cc:hover .rc-corner--tr{transform:translate(7px,-7px)}
  html.motion .rc-page-environment .env-cc:hover .rc-corner--br{transform:translate(7px,7px)}
  html.motion .rc-page-environment .env-cc:hover .rc-corner--bl{transform:translate(-7px,7px)}
}

/* ============================================================ SP（≤1023）の見出し（v2 で growth.css から移した） */
@media (max-width:1023px), (max-width:1366px) and (orientation:portrait){
  .rc-page-environment .env-head{height:auto;padding:8rem var(--gut) 0}
  .rc-page-environment .env-head__en,.rc-page-environment .env-head__label,.rc-page-environment .env-head__catch,.rc-page-environment .env-head__lead{position:static;width:auto;white-space:normal}
  .rc-page-environment .env-head__en{display:block;font:600 6.4rem/1.1 var(--cormorant);letter-spacing:.2rem}
  .rc-page-environment .env-head__no{font-size:3.2rem;letter-spacing:.2rem}
  .rc-page-environment .env-head__label{display:block;margin-top:.8rem;font:600 1.8rem/1.5 var(--serif);letter-spacing:.1rem}
  .rc-page-environment .env-head__rule{position:static;display:block;width:60%;height:.2rem;margin-top:.6rem}
  .rc-page-environment .env-head__catch{display:block;margin-top:1.6rem;font:700 2.2rem/1.6 var(--serif);letter-spacing:.1rem}
  .rc-page-environment .env-head__lead{display:block;margin-top:1.6rem;font:600 max(1.4rem,13px)/1.9 var(--serif);letter-spacing:.05em;word-break:auto-phrase;text-wrap:pretty}
}
/* FB-04（2026-10-09・実装FBシート No.4「1024〜1280px で文字に下限」）: 文字だけに下限。1281px 以上と SP（≤1023）は今のまま */
@media (min-width:1024px) and (max-width:1280px) and (orientation:landscape){
  .rc-page-environment .env-head__lead{font-size:max(2.5rem,14px)}
}
