@charset "UTF-8";
/* ==========================================================================
   GLOBAL ALS — 下層ページ用コンポーネント（apple.css の後に読み込む）
   ========================================================================== */

/* ── ページヘッダー ─────────────────────────────────────── */
.pagehead{
  position:relative; overflow:hidden;
  padding:calc(var(--nav-h) + clamp(76px,11vw,140px)) 0 clamp(52px,7vw,92px);
  background:
    radial-gradient(120% 100% at 12% 0%,rgba(47,154,87,.26) 0%,transparent 58%),
    radial-gradient(90% 80% at 92% 12%,rgba(110,231,155,.12) 0%,transparent 60%),
    #000;
}
.pagehead--media{ background:#000; }
.pagehead__media{ position:absolute; inset:0; z-index:0; }
/* 被写体の顔の位置は素材ごとに違うため、各ページで --ph-focus を指定して合わせる */
.pagehead__media video,
.pagehead__media img{ width:100%; height:100%; object-fit:cover;
  object-position:var(--ph-focus, 62% 22%); }
.pagehead__scrim{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(to top,rgba(0,0,0,.94) 0%,rgba(0,0,0,.72) 34%,rgba(0,0,0,.42) 72%,rgba(0,0,0,.62) 100%),
    linear-gradient(to right,rgba(0,0,0,.72) 0%,rgba(0,0,0,.24) 52%,transparent 78%);
}
.pagehead .wrap{ position:relative; z-index:2; }

.crumb{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  font-size:12px; color:#8e8e93; margin-bottom:22px;
}
.crumb a{ color:#a1a1a6; transition:color .2s var(--ease); }
.crumb a:hover{ color:var(--g-bright); }
.crumb span[aria-hidden]{ opacity:.5; }
.crumb em{ font-style:normal; color:#f5f5f7; }

.pagehead__title{
  font-size:clamp(32px,5.6vw,64px); line-height:1.14; font-weight:700;
  letter-spacing:-.026em; margin:0;
}
.pagehead__sub{
  margin:22px 0 0; max-width:44em;
  font-size:clamp(15px,1.5vw,17px); line-height:1.95; color:#a1a1a6;
}

/* ページヘッダー直後は、間延びしないよう上余白を詰める */
.pagehead + .sec{ padding-top:clamp(46px,6vw,84px); }

/* ── 本文（ステートメント／記事） ───────────────────────── */
.prose{ font-size:16.5px; line-height:2.05; color:#a1a1a6; }
.prose p{ margin:0 0 26px; }
.prose p:last-child{ margin-bottom:0; }
.prose__catch{
  font-size:clamp(24px,3.4vw,38px); line-height:1.5; font-weight:700;
  letter-spacing:-.02em; color:#f5f5f7; margin:0 0 34px !important;
}
.prose__pledge{
  font-size:clamp(17px,2vw,21px); font-weight:600; line-height:1.8;
  color:var(--g-bright); margin-top:34px !important;
}

/* ── 3カラムカード（MISSION / VISION / VALUE 等） ────────── */
.tri{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.tri__card{
  position:relative; overflow:hidden;
  padding:34px 30px 36px; border-radius:24px;
  background:linear-gradient(158deg,#12291d 0%,#0a1610 100%);
  border:1px solid rgba(110,231,155,.16);
}
.tri__key{
  font-size:11.5px; font-weight:600; letter-spacing:.2em; color:var(--g-bright);
}
.tri__t{ margin:16px 0 0; font-size:21px; line-height:1.5; font-weight:700; letter-spacing:-.012em; }
.tri__d{ margin:14px 0 0; font-size:14.5px; line-height:1.95; color:#a9b3ac; }

/* ── 事実リスト（定義リスト） ───────────────────────────── */
.facts{ margin:0; border-top:1px solid rgba(255,255,255,.12); }
.facts__row{
  display:grid; grid-template-columns:200px 1fr; gap:20px;
  padding:22px 2px; border-bottom:1px solid rgba(255,255,255,.12);
}
.facts dt{ font-size:13.5px; font-weight:600; color:var(--g-bright); letter-spacing:.02em; }
.facts dd{ margin:0; font-size:15px; line-height:1.9; color:#d2d2d7; }

/* ── 仕様テーブル（会社概要） ───────────────────────────── */
.spec{ width:100%; border-collapse:collapse; border-top:1px solid rgba(255,255,255,.12); }
.spec th,.spec td{
  padding:20px 4px; text-align:left; vertical-align:top;
  border-bottom:1px solid rgba(255,255,255,.12); line-height:1.85;
}
.spec th{ width:190px; font-size:13.5px; font-weight:600; color:var(--g-bright); letter-spacing:.02em; }
.spec td{ font-size:15px; color:#d2d2d7; }
.spec a{ color:var(--g-bright); text-decoration:underline; text-underline-offset:3px; }

.company-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,56px); align-items:start; }
.map{ position:relative; border-radius:24px; overflow:hidden; border:1px solid rgba(255,255,255,.12); }
.map iframe{ display:block; width:100%; height:min(74vw,420px); border:0; filter:grayscale(.35) contrast(1.05); }
.map__lbl{
  display:flex; align-items:center; gap:6px;
  padding:15px 20px; font-size:13.5px; font-weight:500;
  background:rgba(10,14,11,.9); color:#f5f5f7;
  border-top:1px solid rgba(255,255,255,.1);
}
.map__lbl:hover{ color:var(--g-bright); }

/* ── チップ（対応分野） ─────────────────────────────────── */
.chips{ display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:12px; }
.chip{
  display:flex; align-items:center; gap:13px;
  padding:18px 20px; border-radius:16px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.1);
  font-size:14.5px; font-weight:500; line-height:1.55;
  transition:background .25s var(--ease), border-color .25s var(--ease);
}
.chip:hover{ background:rgba(110,231,155,.08); border-color:rgba(110,231,155,.3); }
.chip__i{
  flex:0 0 auto; width:20px; height:20px; color:var(--g-bright);
}
.chip__note{ display:block; margin-top:4px; font-size:11.5px; color:#8e8e93; font-weight:400; }

/* ── 職種リスト ─────────────────────────────────────────── */
.jobs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:14px; }
.job{
  padding:22px 24px; border-radius:18px;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.1);
}
.job__t{ font-size:16px; font-weight:700; letter-spacing:-.01em; }
.job__d{ margin:8px 0 0; font-size:13.5px; line-height:1.8; color:#a1a1a6; }

/* ── 大タイル（在留資格2種） ────────────────────────────── */
.duo{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.duo__card{
  position:relative; overflow:hidden;
  padding:38px 34px 40px; border-radius:26px;
  background:linear-gradient(158deg,#12291d 0%,#0a1610 100%);
  border:1px solid rgba(110,231,155,.16);
}
.duo__num{
  position:absolute; right:-6px; bottom:-38px;
  font-size:170px; font-weight:700; line-height:1; letter-spacing:-.05em;
  color:rgba(110,231,155,.07); pointer-events:none;
}
.duo__eye{ font-size:11px; font-weight:600; letter-spacing:.18em; color:var(--g-bright); }
.duo__t{ margin:16px 0 0; font-size:clamp(23px,2.6vw,30px); font-weight:700; letter-spacing:-.02em; }
.duo__d{ position:relative; margin:18px 0 0; font-size:15px; line-height:1.95; color:#a9b3ac; }

/* ── ステップ（ご利用の流れ） ───────────────────────────── */
.steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; counter-reset:step; }
.step{
  position:relative; padding:28px 24px 30px; border-radius:20px;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.1);
}
.step__no{
  font-size:11px; font-weight:600; letter-spacing:.16em; color:var(--g-bright);
}
.step__t{ margin:14px 0 0; font-size:17px; font-weight:700; letter-spacing:-.01em; line-height:1.5; }
.step__d{ margin:10px 0 0; font-size:13.5px; line-height:1.85; color:#a1a1a6; }

/* ── 番号付きリスト（資料の内容） ───────────────────────── */
.numlist{ display:grid; gap:14px; }
.numitem{ display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:start;
  padding:22px 4px; border-bottom:1px solid rgba(255,255,255,.12); }
.numitem__n{ font-size:13px; font-weight:700; color:var(--g-bright); letter-spacing:.08em; padding-top:3px; }
.numitem h3{ margin:0; font-size:16.5px; font-weight:700; letter-spacing:-.01em; }
.numitem p{ margin:8px 0 0; font-size:14px; line-height:1.85; color:#a1a1a6; }

/* ── フォーム（forms.js のクラス名は変更しないこと） ─────── */
.formcard{
  padding:clamp(28px,4vw,44px); border-radius:26px;
  background:linear-gradient(158deg,rgba(18,41,29,.9),rgba(10,22,16,.9));
  border:1px solid rgba(110,231,155,.16);
}
.formcard__t{ margin:0; font-size:20px; font-weight:700; letter-spacing:-.015em; }
.formcard__note{ margin:10px 0 26px; font-size:13.5px; color:#a1a1a6; }

.contact-form{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.field{ display:flex; flex-direction:column; gap:9px; }
.field--full{ grid-column:1 / -1; }
.field label{ font-size:13.5px; font-weight:600; color:#f5f5f7; display:flex; align-items:center; gap:9px; }
.req{
  font-size:10.5px; font-weight:700; letter-spacing:.06em;
  padding:3px 8px; border-radius:999px;
  background:rgba(110,231,155,.16); color:var(--g-bright);
}
.field input[type="text"],
.field input[type="email"],
.field input[type="tel"],
.field select,
.field textarea{
  width:100%; padding:14px 16px;
  font:inherit; font-size:15px; color:#f5f5f7;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  transition:border-color .2s var(--ease), background .2s var(--ease);
  -webkit-appearance:none; appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236ee79b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 16px center; padding-right:40px;
}
.field textarea{ min-height:168px; resize:vertical; line-height:1.8; }
.field input::placeholder,.field textarea::placeholder{ color:#6e6e73; }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--g); background:rgba(255,255,255,.09);
}
.field input[type="checkbox"]{ accent-color:var(--g); flex:0 0 auto; }
.field__err{ font-size:12.5px; color:#ff6b6b; min-height:1em; }
.field.error input,.field.error textarea,.field.error select{ border-color:#ff6b6b; }
.inline-link{ color:var(--g-bright); text-decoration:underline; text-underline-offset:3px; }
.form-submit{ grid-column:1 / -1; margin-top:6px; }
.form-submit .btn{ width:100%; }
.form-success{
  grid-column:1 / -1; text-align:center; padding:34px 20px;
}
.form-success h3{ margin:0 0 14px; font-size:22px; font-weight:700; letter-spacing:-.015em; color:var(--g-bright); }
.form-success p{ margin:0; font-size:15px; line-height:1.95; color:#a1a1a6; }

.dl-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,4.5vw,64px); align-items:start; }

/* ── 記事（お知らせ詳細） ───────────────────────────────── */
.article__meta{ display:flex; align-items:center; gap:14px; margin-bottom:26px; }
.article__date{ font-size:13px; color:#8e8e93; letter-spacing:.04em; font-variant-numeric:tabular-nums; }
.article__tag{
  font-size:11.5px; font-weight:600; padding:5px 12px; border-radius:999px;
  background:rgba(110,231,155,.14); color:var(--g-bright);
}
.article p{ margin:0 0 26px; font-size:16px; line-height:2.05; color:#a1a1a6; }

/* お知らせ一覧（暗い背景版） */
.news-list--dark{ border-top:1px solid rgba(255,255,255,.12); }
.news-list--dark .news-item{ border-bottom-color:rgba(255,255,255,.12); }
.news-list--dark .news-item:hover{ background:rgba(255,255,255,.035); }
.news-list--dark .news-item time{ color:#8e8e93; }
.news-list--dark .news-item .tag{ background:rgba(110,231,155,.14); color:var(--g-bright); }
.news-list--dark .news-item .go{ color:var(--g-bright); }

/* ── 準備中（採用情報） ─────────────────────────────────── */
.soon{
  text-align:center; padding:clamp(46px,7vw,74px) clamp(24px,4vw,54px);
  border-radius:28px;
  background:linear-gradient(158deg,#12291d 0%,#0a1610 100%);
  border:1px solid rgba(110,231,155,.16);
}
.soon__badge{
  display:inline-block; font-size:11px; font-weight:600; letter-spacing:.2em;
  padding:7px 16px; border-radius:999px;
  background:rgba(110,231,155,.14); color:var(--g-bright);
}
.soon__mark{ margin:28px auto 0; color:var(--g-bright); opacity:.85; width:40px; }
.soon__t{ margin:22px 0 0; font-size:clamp(23px,3vw,32px); font-weight:700; letter-spacing:-.02em; }
.soon__d{ margin:18px 0 0; font-size:15.5px; line-height:2; color:#a1a1a6; }
.soon__note{ margin:26px 0 0; font-size:14px; color:#8e8e93; }
.soon__cta{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin-top:32px; }

/* ── 規約・プライバシーポリシー ─────────────────────────── */
.legal{ display:grid; grid-template-columns:250px 1fr; gap:clamp(30px,5vw,70px); align-items:start; }
.legal__aside{ position:sticky; top:calc(var(--nav-h) + 26px); }
.legal__meta{ display:flex; flex-direction:column; gap:5px; padding-bottom:20px; margin-bottom:20px;
  border-bottom:1px solid rgba(255,255,255,.12); }
.legal__meta-lbl{ font-size:11px; letter-spacing:.16em; color:var(--g-bright); font-weight:600; }
.legal__meta-val{ font-size:14px; color:#d2d2d7; }
.legal__toc-title{ margin:0 0 14px; font-size:11px; letter-spacing:.18em; color:var(--g-bright); font-weight:600; }
.legal__toc ol{ margin:0; padding:0; list-style:none; display:grid; gap:3px; }
.legal__toc a{
  display:flex; gap:10px; padding:7px 6px; border-radius:9px;
  font-size:13px; line-height:1.5; color:#a1a1a6;
  transition:background .2s var(--ease), color .2s var(--ease);
}
.legal__toc a:hover{ background:rgba(255,255,255,.06); color:#f5f5f7; }
.legal__toc a span{ color:var(--g-bright); font-weight:600; font-variant-numeric:tabular-nums; }

.legal__intro{ font-size:15.5px; line-height:2.05; color:#a1a1a6; margin:0 0 44px; }
.legal__art{ scroll-margin-top:calc(var(--nav-h) + 26px); margin-bottom:44px; }
.legal__art-no{
  display:block; font-size:11px; font-weight:600; letter-spacing:.18em; color:var(--g-bright);
  margin-bottom:10px;
}
.legal__art-title{ margin:0 0 16px; font-size:19px; font-weight:700; letter-spacing:-.012em; line-height:1.5; }
.legal__art p{ margin:0 0 16px; font-size:15px; line-height:2; color:#a1a1a6; }
.legal__art p:last-child{ margin-bottom:0; }
.legal__sub{ margin:24px 0 12px; font-size:14.5px; font-weight:700; color:#f5f5f7; }
.legal__list{ margin:0 0 16px; padding-left:1.25em; }
.legal__list li{ margin-bottom:9px; font-size:15px; line-height:1.95; color:#a1a1a6; }
.legal__list li::marker{ color:var(--g); }
.legal__table{ width:100%; border-collapse:collapse; margin:6px 0 18px;
  border-top:1px solid rgba(255,255,255,.12); }
.legal__table th,.legal__table td{
  padding:14px 4px; text-align:left; vertical-align:top; font-size:14.5px; line-height:1.85;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.legal__table th{ width:190px; font-weight:600; color:var(--g-bright); font-size:13px; }
.legal__table td{ color:#a1a1a6; }

/* ── 比較表（1号 vs 2号 など） ──────────────────────────── */
.vs-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.vs{ width:100%; min-width:620px; border-collapse:collapse; }
.vs th,.vs td{
  padding:20px 18px; text-align:left; vertical-align:top;
  border-bottom:1px solid rgba(255,255,255,.12);
  font-size:14.5px; line-height:1.85;
}
.vs thead th{
  font-size:15px; font-weight:700; letter-spacing:-.01em; color:#f5f5f7;
  border-bottom:1px solid rgba(110,231,155,.4);
  padding-bottom:14px;
}
.vs thead th:first-child{ color:#8e8e93; font-size:11.5px; letter-spacing:.16em; font-weight:600; }
.vs thead th span{ display:block; margin-top:4px; font-size:11px; letter-spacing:.12em; color:var(--g-bright); font-weight:600; }
.vs tbody th{
  width:180px; font-size:13.5px; font-weight:600; color:var(--g-bright);
  letter-spacing:.02em; background:rgba(110,231,155,.04);
}
.vs td{ color:#d2d2d7; }
.vs td strong{ color:#f5f5f7; font-weight:600; }
.vs__hint{ display:block; margin-top:6px; font-size:12.5px; color:#8e8e93; line-height:1.7; }

/* ── 出典・注記 ─────────────────────────────────────────── */
.note{
  padding:22px 24px; border-radius:16px;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.1);
  font-size:13px; line-height:1.9; color:#8e8e93;
}
.note strong{ display:block; margin-bottom:8px; color:#d2d2d7; font-size:13.5px; font-weight:600; }
.note a{ color:var(--g-bright); text-decoration:underline; text-underline-offset:3px; word-break:break-all; }
.note ul{ margin:8px 0 0; padding-left:1.2em; }
.note li{ margin-bottom:5px; }

/* ── 制度ページへの導線カード ───────────────────────────── */
.guide-links{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.guide-link{
  display:flex; flex-direction:column; gap:10px;
  padding:28px 30px 30px; border-radius:22px;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.1);
  transition:background .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.guide-link:hover{ background:rgba(110,231,155,.07); border-color:rgba(110,231,155,.32); transform:translateY(-3px); }
.guide-link__eye{ font-size:11px; font-weight:600; letter-spacing:.18em; color:var(--g-bright); }
.guide-link__t{ margin:0; font-size:20px; font-weight:700; letter-spacing:-.015em; }
.guide-link__d{ margin:0; font-size:13.5px; line-height:1.85; color:#a1a1a6; }
.guide-link__go{ margin-top:6px; display:inline-flex; align-items:center; gap:6px; font-size:14.5px; font-weight:500; color:var(--g-bright); }

@media (max-width:820px){
  .guide-links{ grid-template-columns:1fr; }
  .vs tbody th{ width:132px; }
  .vs th,.vs td{ padding:16px 12px; font-size:13.5px; }
}

/* ── 戻るリンク ─────────────────────────────────────────── */
.link-back{
  display:inline-flex; align-items:center; gap:8px;
  font-size:15px; font-weight:500; color:var(--g-bright);
  transition:opacity .2s var(--ease);
}
.link-back:hover{ opacity:.72; }

/* ── レスポンシブ ───────────────────────────────────────── */
@media (max-width:900px){
  .tri{ grid-template-columns:1fr; }
  .duo{ grid-template-columns:1fr; }
  .company-grid{ grid-template-columns:1fr; }
  .dl-grid{ grid-template-columns:1fr; }
  .legal{ grid-template-columns:1fr; }
  .legal__aside{ position:static; }
}
@media (max-width:820px){
  .contact-form{ grid-template-columns:1fr; }
  .facts__row{ grid-template-columns:1fr; gap:6px; }
  .spec th,.spec td{ display:block; width:auto; }
  .spec th{ padding-bottom:4px; border-bottom:0; }
  .legal__table th,.legal__table td{ display:block; width:auto; }
  .legal__table th{ padding-bottom:2px; border-bottom:0; }
}