@charset "utf-8";
/* ============ TOPページ固有（本番デザイン準拠・1600/390設計） ============ */

/* HERO（PC） */
.hero{ position:relative; }
.hero__media{ position:relative; width:calc(100% - 9.3rem); margin-left:9.3rem; }
.hero__media > img, .hero__media > picture > img{
  width:100%; height:77.1rem; object-fit:cover; object-position:center 20%;
  border-radius:0 0 .6rem .6rem;
}
/* ヒーロー見出し・サブコピー（2026-09-07 タイトルのフォント変更指示）
   画像に焼き込まれた文字の上に HTML の見出しを重ねる。焼き込み無しのバナーが来たら画像だけ差し替える。
   .hero 直下に1つだけ置き、PC/SP で位置を出し分ける（PCは .hero__media の margin-left 9.3rem を足した値）。
   指定フォント＝VDL V7丸ゴシック（Adobe Fonts: vdl-v7marugothic）。kit 未読込の間は M PLUS Rounded 1c */
.hero{ --hero-font:"vdl-v7marugothic", "M PLUS Rounded 1c", "Noto Sans JP", sans-serif; }
.hero__ttl{
  position:absolute; left:16.9rem; top:21.5rem; z-index:2; margin:0;
  font-family:var(--hero-font); font-weight:700; font-size:7.6rem; line-height:1.3; letter-spacing:-.03em;
  color:var(--mg); white-space:nowrap;
  /* PCの焼き込みには白い縁取り（実測 約4px）。stroke は線の中心が輪郭なので見える幅はその半分 */
  paint-order:stroke fill; -webkit-text-stroke:.8rem #fff; stroke-linejoin:round;
}
.hero__ttl span{ display:block; }
/* サブコピー。1枚目（hero.jpg）の時だけ表示（JSが .hero に is-slide1 を付ける）。指定フォントは見出しのみなので標準ゴシック */
.hero__lead{
  display:none; position:absolute; left:16.9rem; top:53.3rem; z-index:2; margin:0;
  font-size:2.2rem; font-weight:700; line-height:1.5; letter-spacing:.01em; color:var(--mg); white-space:nowrap;
}
.hero .hero__lead{ display:block; }   /* 2026-09-12 先方指示: 2枚目・3枚目にもリード文を表示 */
/* 白い背景は行（span）ごとに付け、行の間に少し隙間を空ける。帯の幅は長い方の行に揃える（倉持さん指示 2026-09-08） */
.hero__lead{ width:max-content; }
.hero__lead span{ display:block; background:#fff; padding:0 .9rem; }
.hero__lead span + span{ margin-top:.4rem; }
@media (max-width:767px){
  /* SP（hero_sp_top.jpg の焼き込み実測・390px設計）: サブコピーが上、見出しが下。見出しは細い白縁、サブコピーは行ごとに白帯 */
  .hero__ttl{
    left:2.8rem; top:37.7rem; font-size:4rem; line-height:1.28; letter-spacing:.01em;
    -webkit-text-stroke:.35rem #fff;   /* SPの焼き込みは細い白縁（見える幅 約1.5〜2px） */
  }
  .hero__lead{
    display:block; left:2.4rem; top:31.8rem; width:auto; max-width:calc(100% - 4.8rem);
    font-size:1.8rem; line-height:1.45; letter-spacing:-.02em;   /* 2rem だと1行目が画面幅を超えて横スクロールが出ていた（Figma 9/15 #26/#27） */
  }
  .hero__lead span{ padding:0 .7rem; }
}
/* FV見切れ対策（先方 9/18: 23型16:9モニターでヒーロー下部が初期表示に入らない）:
   PCはヒーローの高さを「画面の高さ−ヘッダー」に収まるよう縮め、見出し・リード文の位置と大きさも同じ比率（--hk、JSが算出）で縮める */
@media (min-width:768px){
  .hero{ --hk:1; }
  .hero__media > img, .hero__media > picture > img{ height:calc(77.1rem * var(--hk)); }
  .hero__ttl{ font-size:calc(7.6rem * var(--hk)); }
  .hero__lead{ font-size:calc(2.2rem * var(--hk)); }   /* top は下の vtabs 用ブロック（18.5rem / 50.3rem）側で --hk を掛ける */
}
/* スライドイン切替（先方指示 2026-09-14）: 次の画像を右から重ねて入れる。はみ出しは .hero__media で隠す */
.hero__media{ overflow:hidden; border-radius:0 0 .6rem .6rem; }
.hero__media > img.hero__slide-in{
  position:absolute; left:0; top:0; z-index:1;
  transform:translateX(100%); transition:transform .8s cubic-bezier(.22,.61,.36,1);
}
.hero__media > img.hero__slide-in.is-in{ transform:translateX(0); }
@media (prefers-reduced-motion:reduce){ .hero__media > img.hero__slide-in{ transition:none; transform:none; } }
.hero__dots{ position:absolute; left:2.2rem; top:46%; z-index:2; display:flex; flex-direction:column; gap:1.2rem; }
.hero__dots span{ width:1rem; height:1rem; border-radius:50%; border:.15rem solid var(--mg); background:#fff; }
.hero__dots span.is-on{ background:var(--mg); }
.hero__news{
  position:absolute; left:3.2rem; bottom:2.3rem; z-index:2;
  width:min(92%,80.5rem); min-height:6.5rem;
  background:#fff; border-radius:1.5rem; box-shadow:0 .4rem 1.8rem rgba(0,0,0,.12);
  display:flex; align-items:center; gap:2.4rem; padding:1rem 1rem 1rem 2.1rem;
}
.hero__news-label{ font-size:.96rem; font-weight:600; line-height:1.25; color:#000; }
.hero__news-label b{ font-size:1.4rem; color:var(--ink); font-weight:500; }
.hero__news time{ font-size:1.4rem; font-weight:500; color:#000; white-space:nowrap; }
.hero__news-tag{ background:var(--yl); border-radius:.2rem; font-size:1.4rem; font-weight:500; color:#000; padding:.35rem 1.3rem; white-space:nowrap; }
.hero__news-txt{ font-size:1.4rem; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hero__news-btn{ padding:1rem 3.4rem; font-size:1.4rem; white-space:nowrap; margin-left:auto; }

/* SP HERO（デザイン焼き付き画像） */
/* SPヒーローの自動切替（先方 2026-10-01「携帯でTOP画像が固定のみで変化しない」）。
   2・3枚目は SP用の縦長画像 img/hero2_sp.jpg / img/hero3_sp.jpg（1枚目と同じ 1560×2296）が置かれたときだけ有効になる（common.js）。
   PC用の横長写真を縦枠に収めると見出しが人物の顔に重なるため、SP用の構図の画像が必要。画像が無い間は1枚目の固定表示。 */
.hero--sp{ position:relative; overflow:hidden; }
.hero--sp img{ width:100%; display:block; }
.hero--sp.is-multi{ aspect-ratio:1560/2296; }
.hero--sp.is-multi img{ height:100%; object-fit:cover; }
.hero--sp > img.hero__slide-in{ position:absolute; left:0; top:0; transform:translateX(100%); transition:transform .9s cubic-bezier(.22,.61,.36,1); }
.hero--sp > img.hero__slide-in.is-in{ transform:translateX(0); }
@media (prefers-reduced-motion:reduce){ .hero--sp > img.hero__slide-in{ transition:none; transform:none; } }
.hero--sp .hero__pause.hero__pause--sp{ display:none; left:auto; right:1.2rem; top:1.2rem; bottom:auto; z-index:3; }
.hero--sp.is-multi .hero__pause.hero__pause--sp{ display:flex; }
/* SP 2枚目（hero2_sp.jpg）: デザイナーのカンプ（Figma 2026-10-02・500px幅の枠に 340px幅の文字ブロック）に合わせ、
   見出しとリード文を写真上部の余白へ。カンプと同じ比率（枠幅の68%）に収まるよう文字も同率で縮める。1・3枚目は従来の位置 */
@media (max-width:767px){
  .hero__ttl, .hero__lead{ transition:opacity .25s; }
  .hero.is-txt-out .hero__ttl, .hero.is-txt-out .hero__lead{ opacity:0; }
  .hero[data-sp-slide="1"] .hero__lead{ left:2.5rem; top:5.4rem; font-size:1.4rem; }
  .hero[data-sp-slide="1"] .hero__lead span{ padding:0 .55rem; }
  .hero[data-sp-slide="1"] .hero__lead span + span{ margin-top:.3rem; }
  .hero[data-sp-slide="1"] .hero__ttl{ left:3rem; top:10.4rem; font-size:3.1rem; -webkit-text-stroke:.28rem #fff; }
}
/* .spquick の見た目は common.css へ移動（下層ページにも出すため 2026-09-16） */
.spquick__ttl{ font-size:1.4rem; font-weight:700; color:var(--mg); }
.spquick__btns{ display:flex; gap:1.2rem; margin-top:0.4rem; padding-bottom:0.2rem; }
/* .spquick__btns .qsbtn{ flex:1; } → common.css へ移動（下層ページでもボタンを均等幅に。2026-09-16） */
.spcollage{ padding:3.4rem 0 0; }
.spcollage img{ width:100%; }

/* AIM */
.aim{ padding:15.8rem 0 16.1rem; }
.aim__inner{ position:static; }
.aim{ position:relative; }
.aim__body{ text-align:center; width:64.7rem; max-width:100%; margin-inline:auto; position:relative; z-index:2; }
.aim__body .script{ font-size:4rem; position:relative; left:.5rem; }
.aim__body .sec-ttl{ position:relative; top:-1.5rem; left:8rem; }
.aim__txt{ margin-top:4.1rem; position:relative; top:-1.5rem; }
.aim__txt p{ margin-bottom:2.5rem; font-size:1.6rem; line-height:1.5625; font-weight:500; }
.aim__btns{ display:flex; gap:1.2rem; margin-top:1.9rem; flex-wrap:wrap; position:relative; top:-.5rem; left:4rem; }
/* 文言に合わせて1行に収まる幅にする（.btn-yl の既定17remを上書き） */
.aim__btn{ width:auto; white-space:nowrap; padding-inline:2.4rem; }
.aim__btn--message{ min-width:26rem; }
.aim__btn--about{ min-width:17rem; }
.aim__collage{ position:absolute; right:0; top:0; width:100%; height:100%; pointer-events:none; }
.aim__collage-img{ position:absolute; right:5.5rem; top:18.1rem; width:33.3rem; height:58.1rem; }
.aim__collage-left{ position:absolute; left:6.9rem; top:15.9rem; width:32.2rem; height:54.7rem; }
.aim__spcollage2{ margin-top:3rem; width:100%; }
@media (max-width:767px){
  .aim{ padding:4.6rem 0 5rem; }
  .aim__body .script{ font-size:3.4rem; }
  .sec-ttl{ font-size:2.2rem; }
  .aim__txt{ text-align:left; }
  .aim__txt p{ font-size:1.35rem; line-height:1.95; }
  .aim__btns{ flex-direction:column; align-items:center; gap:1.4rem; }
  .aim__btns .btn-yl{ width:min(100%,28rem); }
  .aim__btn{ width:min(100%,28rem); min-width:0; }
  .aim__collage{ display:none; }
}

/* JOBS（黄色帯） */
.jobs{ background:var(--yl); padding:14.5rem 0 14.7rem; }
.jobs__inner{ display:grid; grid-template-columns:33rem 1fr; gap:6.7rem; align-items:start; width:min(100% - 4.8rem,145rem); margin-inline:auto; }
.jobs__head{ margin-top:10.7rem; }
.jobs__lead{ font-size:1.6rem; font-weight:500; line-height:1.56; margin-top:3.6rem; width:30rem; position:relative; left:1rem; top:.1rem; }
.jobs__cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.7rem; position:relative; left:1rem; top:-.2rem; }
.jobcard{ background:#fff; display:block; transition:.25s; position:relative; padding-bottom:16.9rem; }
@media (hover:hover){ .jobcard:hover{ transform:translateY(-.4rem); box-shadow:0 1rem 2.6rem rgba(0,0,0,.14); } }
.jobcard img{ width:100%; height:46.1rem; margin-bottom:-9.8rem; object-fit:cover; display:block; }
.jobcard__body{ position:absolute; left:0; right:0; bottom:0; height:16.9rem; background:#fff; padding:2.6rem 1.8rem .6rem; text-align:center; }
.jobcard__body h3{ font-size:2.5rem; font-weight:400; line-height:1.2; text-align:left; }
.jobcard__body p{ font-size:1.4rem; font-weight:500; color:#666; margin-top:.9rem; line-height:1.43; text-align:left; }
@media (max-width:767px){
  .jobs{ padding:5rem 0 5.4rem; }
  .jobs__inner{ grid-template-columns:1fr; gap:2.4rem; }
  .jobs__head{ text-align:center; }
  .jobs__lead{ text-align:left; font-size:1.3rem; }
  .jobs__cards{ grid-template-columns:1fr; gap:2.4rem; }
  .jobcard img{ aspect-ratio:350/300; }
  .jobcard__body h3{ font-size:1.9rem; }
  .jobcard__body p{ font-size:1.3rem; }
}

/* SEACH JOBS（SPのみ） */
.sj{ padding:4.6rem 0 5rem; }
.sj__inner{ width:min(100% - 3.2rem,36rem); margin-inline:auto; }
.sj .script{ font-size:3.4rem; }
.sj__ttl{ font-size:2.2rem; font-weight:700; color:var(--mg); line-height:1.6; }
.sj__lead{ font-size:1.3rem; line-height:1.9; margin-top:1.2rem; }
.sj__ph{ margin-top:1.8rem; }
.sj .btn-mgfill{ display:block; width:min(100%,28rem); margin:-2.4rem auto 0; position:relative; z-index:2; }

/* WORK */
.work{ padding:9.1rem 0 24.8rem; position:relative; }
.work__ph{ position:absolute; left:98rem; top:2.6rem; width:40.2rem; z-index:1; }
.work .script{ font-size:5.4rem; position:relative; top:0; left:-10rem; }
.work .sec-ttl{ position:relative; top:-2rem; left:-6.6rem; }
.work__lead{ font-size:1.6rem; line-height:1.5625; margin-top:1.4rem; position:relative; left:-6.6rem; }
.stats{ display:flex; gap:3.3rem; margin:7.5rem 0 6.1rem; flex-wrap:wrap; position:relative; left:-10rem; }
.stat{
  width:22.5rem; height:22.5rem; border-radius:50%;
  background:#fff; box-shadow:0 .4rem 2rem rgba(0,0,0,.10);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:10.3rem 1.4rem 1.4rem; justify-content:flex-start; position:relative;
}
.stat__ic{ height:10.1rem; width:auto; margin-bottom:.6rem; position:absolute; left:6.6rem; top:1.1rem; }
.work .stats .stat:nth-of-type(2) img.stat__ic{ height:6.8rem; top:3rem; left:7.8rem; }
.work .stats .stat:nth-of-type(3) img.stat__ic{ height:6.3rem; top:2.3rem; left:8.1rem; }
li.stat:nth-of-type(3){ padding-top:9.5rem; }
.work .btn-yl{ height:5.8rem; width:27rem; position:relative; left:-7rem; }
.stat__cap{ font-size:1.2rem; font-weight:600; line-height:1.17; }
.stat__num{ font-size:4.5rem; font-weight:600; letter-spacing:0; line-height:1.21; white-space:nowrap; }
.stat__num small{ font-size:2.6rem; font-weight:600; }
.stat__note{ font-size:1.2rem; font-weight:600; color:#000; line-height:1.17; margin-top:0; }
.work__divider{
  display:flex; align-items:center; gap:2.4rem; margin:10.7rem 0 7.7rem;
  color:var(--mg); font-size:3.1rem; font-weight:500; line-height:1.29; letter-spacing:.04em;
}
.work__divider::before,.work__divider::after{ content:""; flex:1; height:.1rem; background:var(--mg); }
.wcards{ display:grid; grid-template-columns:repeat(3,41.6rem); gap:2.4rem 2.1rem; justify-content:center; }
.wcard{
  position:relative; background:#fff; border:.1rem solid #eee; box-shadow:0 .3rem 1.4rem rgba(0,0,0,.07);
  padding:3.4rem 3rem 3rem; display:block; transition:.25s; min-height:24.2rem;
}
@media (hover:hover){ .wcard:hover{ transform:translateY(-.4rem); box-shadow:0 1.2rem 2.8rem rgba(0,0,0,.12); } }
.wcard__more{
  display:flex; align-items:center; justify-content:center;
  width:22.3rem; height:4.6rem; background:var(--yl); border-radius:99rem;
  font-size:1.6rem; font-weight:500; color:#000;
  position:absolute; left:50%; bottom:2.6rem; transform:translateX(-50%);
  transition:.2s;
}
@media (hover:hover){ .wcard__more:hover{ transform:translateX(-50%) translateY(-.2rem); box-shadow:0 .4rem 1.2rem rgba(0,0,0,.15); } }
.wcard__no{
  display:inline-flex; align-items:center; justify-content:center;
  width:4.1rem; height:4.1rem; background:var(--mg); color:#fff;
  font-size:2.5rem; font-weight:400; line-height:1.2; margin-bottom:1rem;
  position:relative; top:-1.3rem; left:-.5rem;
}
.wcard h3{ font-size:3.1rem; font-weight:500; line-height:1.29; position:relative; top:-1.5rem; left:-.6rem; }
.wcard p{ font-size:1.2rem; font-weight:600; color:#000; margin-top:1.2rem; line-height:1.17; position:relative; top:-1.9rem; left:-.5rem; }
.wcard__ic{ position:absolute; right:2rem; top:2.5rem; width:11rem; height:auto; }
img.wcard__ic.wcard__ic--2{ left:30.3rem; right:auto; top:3.2rem; width:10.2rem; }
img.wcard__ic.wcard__ic--3{ left:28.7rem; right:auto; top:3.5rem; width:11rem; }
img.wcard__ic.wcard__ic--4{ left:29.1rem; right:auto; top:3.1rem; width:11rem; }
img.wcard__ic.wcard__ic--5{ left:29rem; right:auto; top:4rem; }
@media (max-width:767px){
  .work{ padding:4.6rem 0 5rem; }
  .work__head{ text-align:center; }
  .work__lead{ text-align:left; font-size:1.3rem; }
  .stats{ flex-direction:column; align-items:center; gap:2.4rem; margin:3rem 0 2.6rem; }
  .stat{ width:22rem; height:22rem; }
  .work .btn-yl{ display:block; width:min(100%,28rem); margin-inline:auto; }
  .work__divider{ font-size:1.6rem; margin:4.6rem 0 2.4rem; }
  .wcards{ grid-template-columns:1fr; gap:1.8rem; }
  .wcard{ text-align:center; padding:2.4rem 2rem 2.6rem; }
  .wcard__ic{ position:static; display:block; margin:1.4rem auto 0; }
  .jobcard img{ object-position:center top; }
}

/* INTERVIEW */
/* PCカンプにも職種バッジあり（2026-09-08 照合）→ PC/SP とも表示 */
.interview{ background:var(--bg-gray); padding:8.4rem 0 18.2rem; overflow:hidden; }
.iv__head{ text-align:center; }
.iv__lead{ font-size:1.6rem; margin-top:2rem; }
.iv__carousel{ position:relative; margin-top:5.6rem; }
/* 2026-09-15 倉持さん指示: 右矢印・4枚目が固定の「募集要項かんたん検索」（x1437〜）に掛からないよう、
   カードを 28.9→27rem・間隔 2.4→2rem にして4枚ぶん（114rem）を wrap 左端から並べる（カンプと同じ左端200px）。右矢印は右端 1430px（4枚目との間 3.3rem）、左矢印はカード左端との間 4.3rem（カンプと同じ） */
.iv__cards{ display:flex; gap:2rem; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
.iv__cards::-webkit-scrollbar{ display:none; }
.iv__cards > li{ flex:0 0 27rem; scroll-snap-align:start; }   /* PC幅は上の media で 22.7rem */
@media (min-width:768px){ .iv__cards{ width:120rem; gap:1.5rem; } .iv__cards > li{ flex:0 0 22rem; } .interview .iv__carousel:not(.has-overflow) .iv__arrow{ display:none; } }   /* 修正内容_260916「全員表示されない」: 5枚が収まる幅に。はみ出さない時は矢印を隠す */   /* 幅固定はPCだけ。SPにも効いていて横スクロールが途中で止まっていた（Figma 9/15 #34・2026-09-16 修正） */
.ivcard{ background:#fff; display:block; transition:.25s; }
@media (hover:hover){ .ivcard:hover{ transform:translateY(-.4rem); box-shadow:0 1rem 2.6rem rgba(0,0,0,.13); } }
.ivcard__thumb{ position:relative; }
.ivcard__thumb img{ width:100%; height:44.1rem; object-fit:cover; display:block; margin-bottom:-9.7rem; }
.ivcard__tag{
  position:absolute; left:1rem; top:1rem; background:var(--yl); color:var(--ink);
  font-size:1.15rem; font-weight:700; padding:.3rem 1.4rem;
}
.ivcard__body{ position:relative; background:#fff; margin:0 0 0 0; padding:1.6rem 1.6rem 1.8rem; min-height:16rem; }
.ivcard__year{ font-size:1.4rem; font-weight:500; color:#000; }
.ivcard__name{ font-size:2.5rem; font-weight:400; line-height:1.2; margin-top:.2rem; }
.ivcard__txt{ font-size:1.4rem; font-weight:500; color:#666; margin-top:.8rem; line-height:1.43; }
.iv__arrow{
  position:absolute; top:34%; width:5.7rem; height:5.7rem; border-radius:50%;
  background:var(--mg); color:#fff; border:none; font-size:1.7rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center; z-index:5; transition:.2s;
}
@media (hover:hover){ .iv__arrow:hover{ transform:scale(1.1); } }
.iv__arrow--l{ left:-10rem; }    /* カンプ実測: 矢印右端→カード左端 43px（矢印幅5.7rem＋4.3rem） */
.iv__arrow--r{ right:-3rem; }   /* 矢印右端＝wrap右端+3rem＝1430px（固定ボタン 1437px の手前） */
@media (max-width:767px){
  .interview{ padding:4.6rem 0 5.4rem; }
  .iv__cards{
    display:flex; overflow-x:auto; gap:1.6rem; scroll-snap-type:x mandatory;
    padding-bottom:.6rem; padding-left:0;
  }
  .iv__cards > li{ flex:0 0 78%; scroll-snap-align:start; }
  .iv__arrow--l{ left:.2rem; }
  .iv__arrow--r{ right:.2rem; }
}

/* COLUMN（黄色帯） */
.column{ background:var(--yl); padding:7rem 0 15.1rem; }
.col__head{ display:flex; align-items:flex-end; justify-content:space-between; }
.col__cards{ display:grid; grid-template-columns:repeat(3,44.2rem); gap:3rem; justify-content:center; margin-top:4.2rem; }
.column .colcard{ background:#fff; display:block; transition:.25s; min-height:51.9rem; padding-top:.1rem; }
@media (hover:hover){ .colcard:hover{ transform:translateY(-.4rem); box-shadow:0 1rem 2.6rem rgba(0,0,0,.14); } }
.colcard__thumb{ display:block; width:calc(100% - 3.4rem); margin:1.8rem auto 0; height:25.7rem; background:#CCCCCC; }
.column .colcard__thumb{ background-position:center top !important; }   /* 人物写真の頭が切れるため上端基準（先方 2026-10-01: 横塚さんの顔上部が切れている）。テーマ側はインラインで center/cover を出しているので !important */
@media (max-width:767px){
  .colcard__thumb{ width:calc(100% - 1.7rem); margin:1.7rem 0 0 auto; }
}
.colcard__body{ padding:1.6rem 2.8rem 2.4rem; }
.colcard__meta{ display:flex; align-items:center; gap:1.2rem; }
.colcard__tag{ background:var(--yl); border-radius:99rem; font-size:1.6rem; font-weight:500; color:#000; padding:.1rem 1.6rem; }
.colcard__meta time{ font-size:1.6rem; font-weight:500; color:#000; }
.colcard__body h3{ font-size:1.9rem; font-weight:500; line-height:1.2; margin-top:1rem; }
.colcard__body p{ font-size:1.4rem; font-weight:500; color:#666; margin-top:.9rem; line-height:1.8; }
@media (max-width:767px){
  .column{ padding:4.6rem 0 5.4rem; }
  .col__head{ flex-direction:column; align-items:center; gap:1.4rem; }
  .col__cards{ grid-template-columns:1fr; gap:2rem; }
  .column .col__head .btn-wh{ order:2; }
  .col__more-sp{ display:block; width:min(100%,26rem); margin:2.6rem auto 0; }
}

@media (max-width:767px){
}

@media (max-width:767px){
  .wcard{ min-height:0; }
  .jobcard{ padding-bottom:0; }
  .jobcard img{ height:auto; margin-bottom:0; aspect-ratio:350/300; }
  .jobcard__body{ position:static; height:auto; text-align:center; }
  .jobs__head{ margin-top:0; }
  .jobs__cards{ margin-top:0; }
  .stats .stat__num{ font-size:3.4rem; }
  .ivcard__thumb img{ height:auto; margin-bottom:0; aspect-ratio:290/343; }
  .ivcard__body{ min-height:0; }
  .colcard{ min-height:0; }
  .colcard__thumb{ height:auto; aspect-ratio:16/9.4; }
  .aim__collage{ display:none; }
}

/* SEACH JOBS（PC・設計: 1602x509 帯 / jobsとworkの間、上下マージン各9rem） */
.sjpc{
  position:relative; overflow:hidden; height:50.9rem; background:#ECF0F3;
  margin:0 0 0;
}
.sjpc__ph{
  position:absolute; left:-6.8rem; top:-6.1rem; width:94.4rem; max-width:none; height:63rem;
  object-fit:cover;
}
.sjpc__body{ position:absolute; left:83.9rem; top:3.6rem; width:64rem; }
.sjpc__body .script{ display:block; font-size:4.6rem; margin-bottom:1rem; margin-top:3rem; }
.sjpc__ttl{ font-size:4.5rem; font-weight:600; color:var(--mg); line-height:1.21; }
.sjpc__lead{ font-size:1.6rem; font-weight:500; line-height:1.5625; margin-top:2.9rem; }
.sjpc__btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:27.1rem; height:5.6rem; margin-top:3.4rem; padding:0 3rem;
  background:var(--yl); border-radius:99rem; font-size:1.6rem; font-weight:500; color:var(--ink);
  transition:.2s;
}
@media (hover:hover){ .sjpc__btn:hover{ transform:translateY(-.2rem); } }
.jobs .script img{ position:relative; top:-.3rem; left:.5rem; }
.jobs .sec-ttl{ position:relative; top:-1.8rem; left:1rem; }
.interview .script{ position:relative; left:1rem; }
.interview .sec-ttl{ position:relative; top:-1.5rem; left:-1rem; }
.interview .iv__lead{ position:relative; top:-1rem; }
.column .script{ position:relative; top:2.1rem; left:-6rem; }
.column .sec-ttl{ position:relative; top:.4rem; left:-7.3rem; }
.column .btn-wh{ position:relative; top:1.5rem; left:2.7rem; width:22.7rem; height:5.5rem; }   /* 2026-09-15: 右端 1427px（カンプ 1431・固定ボタン 1437 の手前）。以前の 10.7rem は固定ボタンに重なっていた */

/* ============================================================
   SP完全版オーバーライド（TOPスマホカンプ 1260:22399 準拠・390設計）
   ※PC調整の position offset をSPで全リセットした上でカンプ値を適用
   ============================================================ */
@media (max-width:767px){
  .sec-ttl{ font-size:2.4rem; line-height:1.21; }

  /* --- AIM --- */
  .aim{ padding:7.4rem 0 0; }
  .aim__body .script{ left:0; }
  .aim__body .script img{ --sw-sp:14rem; position:relative; top:1.1rem; }
  .aim__body .sec-ttl{ position:relative; top:-.1rem; left:0; font-size:2.4rem; width:17rem; max-width:19.2rem; margin-inline:auto; }
  .aim .wrap{ width:min(100% - 3.2rem,35.8rem); }
  .aim__txt{ margin-top:2.9rem; top:0; }
  .aim__txt p{ font-size:1.3rem; line-height:2rem; margin-bottom:2rem; }
  .aim__btns{ position:relative; top:0; left:0; margin-top:4rem; gap:1.4rem; }   /* SPカンプ: 本文→ボタン 約40px（top:-5remで本文に食い込んでいた。2026-09-08） */
  .aim__btns .btn-yl{ width:22.3rem; padding:1.3rem 0; font-size:1.3rem; line-height:1.54; }
  .aim__spcollage2{ display:block; width:100%; margin:4.1rem auto 0; max-width:100%; position:relative; top:0; }   /* SPカンプ: ボタン→写真 41px（ボタンに重なっていた。2026-09-08） */

  /* --- JOBS --- */
  .jobs{ margin-top:5.5rem; padding:5.6rem 0 10.6rem; }
  .jobs__inner{ gap:2rem; }
  .jobs .script img{ top:.2rem; left:-.1rem; --sw-sp:12.4rem; }
  .jobs .sec-ttl{ top:-1.1rem; left:0; }
  .jobs__lead{ left:0; top:0; width:auto; font-size:1.3rem; line-height:1.54; margin-top:1.7rem; }
  .jobs__cards{ left:0; top:2.2rem; gap:2.6rem; margin-inline:-.3rem; }
  .jobcard img{ aspect-ratio:348/168; object-fit:cover; object-position:center top; }
  .jobcard__body{ padding:1.6rem 3rem 2rem 3.1rem; text-align:left; }
  .jobcard__body h3{ font-size:2.5rem; text-align:left; }
  .jobcard__body p{ font-size:1.4rem; line-height:1.43; margin-top:1rem; text-align:left; }

  /* --- SEACH JOBS（SP） --- */
  .sj{ padding:4rem 0 0; position:relative; }
  .sj__inner{ width:min(100% - 4rem,35rem); }
  .sj .script img{ --sw-sp:14.6rem; position:relative; top:.1em; }
  .sj__ttl{ font-size:2.4rem; font-weight:600; line-height:1.21; margin-top:0; position:relative; top:-.7rem; }
  .sj__lead{ font-size:1.3rem; line-height:1.54; margin-top:.4rem; position:relative; left:.3rem; }
  .sj__ph{ margin:0 0 0; position:relative; left:50%; top:-2.5rem; transform:translateX(-50%); width:100vw; height:36.4rem; overflow:hidden; z-index:-1; }
  .sj__ph img{ width:140%; max-width:none; margin-left:-27.4%; }
  .sj .btn-mgfill{
    position:absolute; left:50%; transform:translateX(-50%); bottom:5.9rem; margin:0; z-index:2;
    background:var(--yl); color:#000; width:22.3rem; height:4.6rem; padding:1.3rem 0;
    font-size:1.3rem; font-weight:500;
  }

  /* --- WORK --- */
  .work{ padding:1.2rem 0 4rem; }
  .work .script{ left:.4rem; top:-1.7rem; width:22.4rem; }
  .work .script img{ --sw-sp:31rem; }
  .work .sec-ttl{ left:.4rem; top:-1.9rem; margin-top:.6rem; text-align:left; }
  .work__lead{ left:.4rem; top:0; margin-top:.2rem; font-size:1.3rem; line-height:1.54; }
  .stats{ left:0; gap:3rem; margin:2.4rem 0 0; }
  .stat{ width:22rem; height:22rem; padding:9.1rem 1.4rem 1.4rem; }
  .stat__ic{ left:50%; transform:translateX(-50%); height:7.5rem; top:1.5rem; }
  .work .stats .stat:nth-of-type(2) img.stat__ic{ height:6.5rem; top:2rem; left:50%; }
  .work .stats .stat:nth-of-type(3) img.stat__ic{ height:5.8rem; top:1.5rem; left:50%; }
  li.stat:nth-of-type(3){ padding-top:7.4rem; }
  .stats .stat__num{ font-size:4.5rem; }
  .stat__num small{ font-size:2.6rem; }
  .stat__note{ font-size:1.2rem; line-height:1.21; }
  .work .btn-yl{ left:.1rem; width:22.3rem; height:4.6rem; padding:1.3rem 0; font-size:1.3rem; margin:4.6rem auto 0; display:block; }
  .work__divider{ font-size:1.9rem; margin:8rem -2.4rem 5.9rem; gap:1.8rem; justify-content:center; }
  .work__divider span{ white-space:nowrap; }
  .work__divider::before,.work__divider::after{ flex:1; }

  /* --- WCARDS --- */
  .wcards{ gap:1.2rem; margin-inline:-1rem; position:relative; top:-2rem; }
  .wcard{ min-height:27rem; padding:2.6rem 2rem 7rem 1.9rem; text-align:left; }
  .wcard__no{ position:static; width:3.4rem; height:3.4rem; font-size:2.1rem; margin:0; vertical-align:middle; }
  .wcard h3{ position:static; display:inline-block; font-size:2.6rem; font-weight:600; line-height:1.21; margin-left:1.9rem; vertical-align:middle; }
  .wcard p{ position:static; font-size:1.4rem; font-weight:600; line-height:1.57; margin:.8rem 0 0 .2rem; text-align:left; }
  .wcard .wcard__ic,
  .wcard img.wcard__ic.wcard__ic--2, .wcard img.wcard__ic.wcard__ic--3,
  .wcard img.wcard__ic.wcard__ic--4, .wcard img.wcard__ic.wcard__ic--5{
    position:static; display:block; margin:1.2rem auto 0; height:9.5rem; width:auto;
  }
  .wcard__more{ width:18.9rem; height:4.2rem; font-size:1.35rem; bottom:1.8rem; }

  /* --- INTERVIEW --- */
  .interview{ padding:5.2rem 0 7.6rem; }
  .interview .script{ left:0; }
  .interview .script img{ --sw-sp:15.3rem; }
  .interview .sec-ttl{ left:0; top:0; }
  .interview .iv__lead{ top:0; font-size:1.3rem; margin-top:1.6rem; }
  .iv__carousel{ margin-top:4.1rem; }
  .iv__cards{ gap:1rem; padding-left:2.3rem; margin-right:-2.4rem; }
  .iv__cards > li{ flex:0 0 29.3rem; }
  .ivcard__thumb img{ aspect-ratio:293/380; object-fit:cover; }
  .ivcard__tag{ left:2.2rem; top:1.4rem; font-size:1.9rem; font-weight:500; padding:.3rem 1.6rem; }
  .ivcard__body{ padding:.8rem 2.2rem 2.2rem; }
  .ivcard__year{ font-size:1.4rem; }
  .ivcard__name{ font-size:2.5rem; }
  .ivcard__txt{ font-size:1.4rem; line-height:1.43; margin-top:1.1rem; }
  .iv__arrow{ width:4.8rem; height:4.8rem; top:22rem; font-size:1.6rem; }
  .iv__arrow--l{ left:-.5rem; }
  .iv__arrow--r{ right:-.4rem; }

  /* --- COLUMN --- */
  .column{ padding:4.4rem 0 4.6rem; }
  .column .script{ top:0; left:0; }
  .column .script img{ --sw-sp:9.5rem; }
  .column .sec-ttl{ top:0; left:0; }
  .column .col__head .btn-wh{ display:none; }
  .col__cards{ margin-top:4rem; gap:1.5rem; margin-inline:-.7rem; }
  .column .colcard{ min-height:0; padding-top:.1rem; padding-bottom:2rem; }
  .colcard__thumb{ width:calc(100% - 3.2rem); position:relative; left:-1.6rem; margin-top:1.6rem; aspect-ratio:324/150; }
  .colcard__body{ padding:1.5rem 2rem 2.4rem 3.2rem; }
  .colcard__tag{ font-size:1.6rem; padding:.05rem 1.4rem; }
  .colcard__meta time{ font-size:1.3rem; }
  .colcard__body h3{ font-size:1.9rem; margin-top:1.1rem; }
  .colcard__body p{ font-size:1.4rem; line-height:1.43; margin-top:.8rem; }
  .column .col__more-sp{ position:static; left:0; top:0; display:block; width:22rem; height:4.4rem; padding:1.2rem 0; font-size:1.3rem; margin:1.2rem auto 0; }
}

/* 倉持さん指示 2026-09-05: トップページのみ・PCのみ（.page-top スコープ） */
@media (min-width:768px){
  .page-top .aim__btn--about{ min-width:26rem; }
  .page-top .aim__body .sec-ttl{ position:relative; top:-1.5rem; left:1rem; }
}

/* 倉持さん指示 2026-09-06: Search jobs は支給バナー（セクション全面の絵柄）に差し替え。
   右側の余白は見出し・本文が入る設計なのでトリミングせず、そのまま全面に敷く。 */
@media (min-width:768px){
  .page-top .sjpc__ph{ left:0; top:0; width:100%; height:100%; object-fit:cover; }
}

/* 倉持さん指示 2026-09-06: 「働く環境をくわしく見る」の文字を上下中央に（PCのみ。
   SPは display:block + margin:auto で中央寄せしているので触らない） */
@media (min-width:768px){
  .page-top .work .btn-yl{
    display:inline-flex; align-items:center; justify-content:center;
    padding-top:0; padding-bottom:0;
  }
}

/* 右端の固定タブ（新卒／中途）に隠れないよう、画面端まで伸びるブロックを内側へ寄せる。
   タブはSPでは非表示なのでPCのときだけ。幅は common.css の --vtabs-safe で一括管理。 */
@media (min-width:768px){
  /* .interview は横スクロールするカルーセルなので対象外（右端で切れた5枚目の上にタブが乗るのはカンプどおり）。
     padding を付けるとカルーセルの開始位置がカンプ（x199）より57px左にずれる。 */
  .jobs{ padding-right:var(--vtabs-safe); }
  /* 右側のコラージュ写真も少しタブに掛かるので内側へ */
  .aim__collage-img{ right:calc(5.5rem + var(--vtabs-safe)); }
}

/* PC: 右の写真コラージュを固定タブ分だけ左に寄せた結果、本文と重なっていたため、本文ブロックと左コラージュも左へ（2026-09-08 倉持さん指摘） */
@media (min-width:768px){
  .aim__body{ left:-5rem; }
  .aim__collage-left{ left:3rem; }
}

/* 2026-09-12 先方指示（修正内容.pdf p1）: キャッチと新着情報バーを少し上へ（PCのみ） */
@media (min-width:768px){
  .hero__ttl{ top:calc(18.5rem * var(--hk, 1)); }
  .hero__lead{ top:calc(50.3rem * var(--hk, 1)); }   /* FV見切れ対策の縮小比率 --hk を掛ける（2026-09-18） */
  .hero__news{ bottom:4.8rem; }
}

/* TOP「人を知る」カード: 顔写真は横長(900×729)で表示窓は縦長(220×441)のため中央切り出しだと人物が外れる人がいる → 人物位置に合わせて切り出し位置を個別指定（2026-09-21 高畑さんが写真左端で切れていた指摘） */
.ivcard__thumb img[src*="sejutsu-05_face"]{ object-position:12% 50%; }   /* 高畑: 写真左端に立っている（右はロゴ） */
.ivcard__thumb img[src*="sejutsu-07_face"]{ object-position:60% 50%; }   /* 小石川: 人物は写真の右寄り（Figma 9/24「顔が見切れている」→28%は逆だった） */
.ivcard__thumb img[src*="jimu-02_face"]{ object-position:32% 50%; }      /* 南舘: 左寄り（右はPC） */
.ivcard__thumb img[src*="sodan-05_face"]{ object-position:50% 25%; }     /* 横塚: 縦長写真・顔は上部 */
.ivcard__thumb img[src*="sejutsu-06_face"]{ object-position:50% 30%; }   /* 鵜飼: 縦長写真・全身 */
.ivcard__thumb img[src*="driver-01_face"]{ object-position:50% 35%; }    /* 窪井: 頭頂が切れる */
