@charset "UTF-8";

/* =====================================================
   Komaten Theme - Base Style
   白ベース / 黒 セカンダリー / #589bb5 アクセント
   ===================================================== */

/* ---------- Custom Properties ---------- */
:root {
  --c-bk: #111;
  --c-white: #fff;
  --c-text: #3d3d3d;
  --c-text-muted: #6b6b6b;
  --c-line: #dcdcdc;
  --c-line-strong: #1a1a1a;
  --c-accent: #000000;
  --c-accent-dark: #676767;
  --c-accent-light: #eaf3f7;
  --c-bg-alt: #eeefed;

  --ff-base: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", system-ui, sans-serif;
  --ff-head: "Montserrat", "Noto Sans JP", sans-serif;

  --shadow-card: 0 2px 12px rgba(0, 0, 0, 0.06);
  --radius: 4px;
  --radius-img: 10px;

  --container: 1600px;
  --container-narrow: 880px;
  --gap: 24px;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--ff-base);
  font-size: 16px;
  line-height: 1.75;
  color: var(--c-text);
  background: var(--c-bg-alt);
  -webkit-font-smoothing: antialiased;
  word-break: break-word;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
button { font-family: inherit; cursor: pointer; }
a { color: inherit; text-decoration: none; transition: opacity .2s, color .2s; }
a:hover { opacity: .7; }
/* タップハイライト（青いハイライト）を全要素で無効化 */
html { -webkit-tap-highlight-color: transparent; }
* { -webkit-tap-highlight-color: transparent; }
/* 画像を含むリンクのフォーカス枠を無効化 */
a:has(> img):focus,
a:has(> img):focus-visible,
a:has(> img):active { outline: none; }
a > img { outline: none; }
ul, ol { list-style: none; padding: 0; margin: 0; }
h1, h2, h3, h4, h5, h6, p, figure { margin: 0; }
input, textarea, select, button { font-family: inherit; font-size: inherit; color: inherit; }
table { border-collapse: collapse; }

/* ============================================================
   ローディングオーバーレイ
   - 黒背景に白いSVGストロークを描画
   - 描画完了後、中心から円形ワイプ（mask radial-gradient）で消える
   ============================================================ */
@property --loader-reveal {
  syntax: '<percentage>';
  inherits: false;
  initial-value: 0%;
}

#js-loader.loader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  --loader-reveal: 0%;
  /* 同じ位置に2ストップを置き、円の境界をシャープに。初期(0%)で透明領域0 */
  -webkit-mask-image: radial-gradient(circle at 50% 50%, transparent var(--loader-reveal), #000 var(--loader-reveal));
          mask-image: radial-gradient(circle at 50% 50%, transparent var(--loader-reveal), #000 var(--loader-reveal));
  transition: --loader-reveal 1.2s cubic-bezier(.65, 0, .35, 1),
              opacity .25s linear 1.2s,
              visibility .25s linear 1.2s;
}
#js-loader.loader.is-done {
  --loader-reveal: 150%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* 下層ページ用: SVGは非表示、ワイプも短時間で */
#js-loader.loader.loader--quick .loader__logo { display: none; }
#js-loader.loader.loader--quick {
  transition: --loader-reveal .6s cubic-bezier(.65, 0, .35, 1),
              opacity .2s linear .6s,
              visibility .2s linear .6s;
}

/* 遷移時のクローズ演出: opacity/visibility 即時で見せ、wipe を逆方向(150% → 0%)に */
#js-loader.loader.is-closing {
  --loader-reveal: 0%;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: --loader-reveal .6s cubic-bezier(.65, 0, .35, 1),
              opacity 0s,
              visibility 0s;
}
/* クローズ時はストロークSVGも非表示（黒一面で覆う） */
#js-loader.loader.is-closing .loader__logo { display: none; }

/* ローダー内SVG（ロゴ） */
.loader__logo {
  width: clamp(180px, 32vw, 320px);
  height: auto;
  overflow: visible;
}
/* 元SVGの .st0 を描画アニメ
   描画前(offset=1)は stroke を背景色(#000)にしてキャップを背景に溶かし、
   描画開始と同時に白へ変化させる事でドットの先見えを解消する。 */
.loader__logo .st0,
.loader__logo path,
.loader__logo line {
  stroke: #000;
  fill: none;
  stroke-width: 2.8px;
  stroke-linecap: round;
  stroke-linejoin: round;
  /* pathLength="1" 前提でダッシュ正規化 */
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: loader-draw .25s ease-out forwards;
  animation-play-state: paused; /* JSが delay 設定後に再生開始 */
}
@keyframes loader-draw {
  0%   { stroke: #000; stroke-dashoffset: 1; }
  20%  { stroke: #fff; }
  100% { stroke: #fff; stroke-dashoffset: 0; }
}

/* ローダー表示中はbodyスクロール禁止 */
body.is-loading { overflow: hidden; }

/* OS設定で動きを抑えたいユーザー向けにはローダー自体スキップ */
@media (prefers-reduced-motion: reduce) {
  #js-loader.loader { display: none; }
}

/* ============================================================
   スクロールアニメーション（IntersectionObserverで .is-visible 付与）
   ============================================================ */
.js-anim {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .9s cubic-bezier(.22, .61, .36, 1),
              transform .9s cubic-bezier(.22, .61, .36, 1);
  will-change: opacity, transform;
}
.js-anim.is-visible {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .js-anim,
  .js-anim.is-visible {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* ---------- Typography ---------- */
.heading-section {
  font-family: var(--ff-head);
  font-weight: 700;
  letter-spacing: .04em;
}
.heading-en {
  display: block;
  font-family: var(--ff-head);
  font-weight: 700;
  font-size: clamp(40px, 5vw, 64px);
  color: var(--c-accent);
  text-transform: uppercase;
  margin-bottom: 8px;
}

/* ---------- Layout ---------- */
.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 min(8vw, 50px);
}
.container--narrow {
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 24px;
}

main {
  display: block;
}

.section,
.article,
.page-common {
  padding: 88px 150px 88px 0;
}
.section--white { background: var(--c-white); }

/* ---------- Utility ---------- */
.bg-green { background: var(--c-accent-dark); }

/* スマホ専用の改行（PC/タブレットでは無効） */
.br-sp,.br-min-pc { display: none; }
@media (max-width: 1600px) {
  .br-min-pc { display: inline; }
}
@media (max-width: 768px) {
  .br-sp { display: inline; }
}

/* PC・タブレット用の改行（スマホでは無効） */
.br-pc { display: inline; }
@media (max-width: 768px) {
  .br-pc { display: none; }
}

/* ---------- CTA Common（ダークグリーン背景セクション） ---------- */
.cta-common {
  color: var(--c-white);
  position: relative;
  overflow: hidden;
  padding-top: min(5vw, 50px) !important;
  padding-bottom: min(18vw, 88px) !important;
}
.cta-common__body { text-align: center; }
.cta-common__title {
  display: inline-block;
  font-size: 32px;
  font-weight: 700;
  color: var(--c-white);
  letter-spacing: .04em;
  margin-bottom: 24px;
  padding-bottom: 16px;
  position: relative;
}
.cta-common__text {
  line-height: 2;
  margin-bottom: min(6vw, 40px);
  font-size: min(3.5vw, 16px);
}
.cta-common__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
}
.cta-common__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  padding: 14px 28px;
  font-family: var(--ff-head);
  font-weight: 600;
  font-size: min(3.5vw, 18px);
  letter-spacing: .08em;
  border: 1px solid;
  border-radius: var(--radius);
  transition: background .2s, color .2s, border-color .2s, opacity .2s;
}
.cta-common__btn:hover { opacity: 1; }
.cta-common__btn--primary {
  background: var(--c-bk);
  border-color: var(--c-bk);
  color: var(--c-white);
}
.cta-common__btn--primary:hover {
  background: var(--c-white);
  border-color: var(--c-white);
  color: var(--c-accent-dark);
}
.cta-common__btn--ghost {
  background: transparent;
  border-color: rgba(255, 255, 255, .7);
  color: var(--c-white);
}
.cta-common__btn--ghost:hover {
  background: var(--c-white);
  border-color: var(--c-white);
  color: var(--c-accent-dark);
}

/* CONTACT 横無限スクロール装飾 */
.cta-common__marquee {
  overflow: hidden;
  width: 100%;
  margin-bottom: 48px;
  user-select: none;
  pointer-events: none;
}
.cta-common__marquee-track {
  display: flex;
  gap: 64px;
  width: max-content;
  animation: cta-marquee 28s linear infinite;
}
.cta-common__marquee-text {
  font-family: var(--ff-head);
  font-weight: 800;
  font-size: clamp(64px, 12vw, 160px);
  line-height: 1;
  letter-spacing: .04em;
  color: rgba(255, 255, 255, .14);
  white-space: nowrap;
}
@keyframes cta-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
/* OS設定で動きを抑えたいユーザー向け */
@media (prefers-reduced-motion: reduce) {
  .cta-common__marquee-track { animation: none; }
}
@media (max-width: 768px) {
  .cta-common__title { font-size: 26px; }
  .cta-common__marquee { margin-bottom: 32px; }
}
@media (max-width: 768px) {
  .section,
  .article {
    padding: 56px 0;
  }
}

/* ---------- Front Page: RECRUIT セクション（左テキスト + 右スライダー） ---------- */
.front-recruit {
  background: var(--c-bg-alt);
}
.front-recruit__inner {
  display: grid;
  grid-template-columns: 0.5fr 1fr;
  gap: 56px;
  align-items: center;
  max-width: 1000px;
  margin: 0 auto;
}
.front-recruit__left {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.front-recruit__left .heading-en { margin-bottom: 0; }
.front-recruit__text {
  font-size: 15px;
  line-height: 2.2;
  color: var(--c-text);
  margin: 0;
}
.front-recruit__btn { align-self: flex-start; }

/* スライダー（カードスタック型） */
.front-recruit__slider {
  position: relative;
  padding-right: 80px;
  user-select: none;
  -webkit-user-select: none;
  touch-action: pan-y;
}
.front-recruit__slider img { -webkit-user-drag: none; }
.front-recruit__slides {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
}
.front-recruit__slide {
  position: absolute;
  inset: 0;
  border-radius: 6px;
  overflow: hidden;
  background: var(--c-white);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .14);
  transform-origin: center bottom;
  transition: transform .6s cubic-bezier(.22, .61, .36, 1),
              opacity .5s ease,
              z-index 0s linear .3s;
  opacity: 1;
}
.front-recruit__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* 重なり位置（JSが data-pos を付与） */
.front-recruit__slide[data-pos="0"] {
  transform: translate(0, 0) rotate(0);
  z-index: 5;
  transition-delay: 0s;
  cursor: pointer;
}
.front-recruit__slide[data-pos="0"] img { pointer-events: auto; }
.front-recruit__slide[data-pos="1"] {
  transform: translate(0, 14px) rotate(3deg);
  z-index: 4;
}
.front-recruit__slide[data-pos="2"] {
  transform: translate(0, 28px) rotate(6deg);
  z-index: 3;
}
.front-recruit__slide[data-pos="hidden"] {
  transform: translate(0, 28px) rotate(6deg);
  opacity: 0;
  z-index: 1;
  pointer-events: none;
}
/* 後ろへ繰る瞬間用（控えめに下げてフェードアウト） */
.front-recruit__slide[data-pos="back"] {
  transform: translate(0, 25%) rotate(-2deg);
  opacity: 0;
  z-index: 0;
  pointer-events: none;
  transition: transform .6s cubic-bezier(.22, .61, .36, 1),
              opacity .5s ease;
}

/* スライド内ボタン（採用名） */
.front-recruit__slide-btn {
  position: absolute;
  right: 16px;
  bottom: 16px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px 10px 18px;
  background: var(--c-accent);
  color: var(--c-white);
  font-family: var(--ff-head);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .04em;
  border-radius: 4px;
  transition: background .2s, color .2s, opacity .2s;
}
.front-recruit__slide-btn:hover {
  background: var(--c-accent-dark);
  opacity: 1;
}
.front-recruit__slide-arrow {
  font-size: 18px;
  line-height: 1;
}
/* 表示中のスライド以外のボタンはクリック不可（重ね順の下にあるカードに反応しないように） */
.front-recruit__slide:not([data-pos="0"]) .front-recruit__slide-btn {
  pointer-events: none;
}

/* 右側の縦ドット */
.front-recruit__dots {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 6; /* スライドより前面に */
}
.front-recruit__dot {
  width: min(1.5vw, 8px);
  height: min(1.5vw, 8px);
  padding: 0;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, .25);
  cursor: pointer;
  transition: background .25s, transform .25s;
}
.front-recruit__dot:hover {
  background: rgba(0, 0, 0, .45);
  opacity: 1;
}
.front-recruit__dot.is-active {
  background: var(--c-accent);
  transform: scale(1.4);
  box-shadow: 0 0 0 3px rgba(164, 164, 164, 0.25); /* ハロー（より目立たせる） */
}

@media (max-width: 900px) {
  .front-recruit__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  /* SP: 右ドット → 下ドットに切り替え、画像と被らないよう下に余白を確保 */
  .front-recruit__slider {
    padding-right: 0;
    padding: 0 5vw 15vw 2vw;
  }
  .front-recruit__slide[data-pos="1"] { transform: translate(0, 10px) rotate(2deg); }
  .front-recruit__slide[data-pos="2"] { transform: translate(0, 20px) rotate(4deg); }
  .front-recruit__dots {
    flex-direction: row;
    top: auto;
    right: auto;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    gap: 12px;
  }
}
@media (max-width: 560px) {
  .front-recruit__slide-btn {
    right: 12px;
    bottom: 12px;
    padding: 8px 12px;
    font-size: 10px;
  }
}

/* ---------- 採用情報一覧（page-recruit.php） ---------- */
/* 採用情報グループ（雇用区分別） */
.recruit-group { margin-bottom: 64px; }
.recruit-group:last-child { margin-bottom: 0; }
.recruit-group__title {
  font-size: clamp(20px, 2.4vw, 28px);
  font-weight: 700;
  margin: 0 0 24px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--c-accent);
  letter-spacing: .04em;
}
/* ページ内アンカー(#slug)ジャンプ時に固定UIに被らないよう上余白を確保 */
.recruit-group[id] { scroll-margin-top: 40px; }
.recruit-subgroup[id] { scroll-margin-top: 40px; }

/* 採用情報：職種カード（雇用区分内に並ぶ） */
.recruit-job-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  padding-top: min(15vw, 80px);
}
.recruit-job-card {
  background: var(--c-white, #fff);
  border-radius: var(--radius-img, 8px);
  box-shadow: var(--shadow-card, 0 2px 12px rgba(0,0,0,.06));
  overflow: hidden;
  transition: transform .2s, box-shadow .2s;
}
.recruit-job-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0,0,0,.1);
}
.recruit-job-card__link {
  display: block;
  color: inherit;
  text-decoration: none;
}
.recruit-job-card__thumb {
  aspect-ratio: 4 / 3;
  background: var(--c-bg-alt, #f7f8f9);
  overflow: hidden;
}
.recruit-job-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.recruit-job-card__body {
  padding: 20px 22px 24px;
}
.recruit-job-card__name {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 8px;
  line-height: 1.5;
}
.recruit-job-card__count {
  font-family: var(--ff-head);
  font-size: 12px;
  letter-spacing: .12em;
  color: var(--c-accent);
  margin: 0 0 16px;
}
.recruit-job-card__more { margin-top: 4px; }
@media (max-width: 900px) {
  .recruit-job-list { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 560px) {
  .recruit-job-list { grid-template-columns: 1fr; }
}


.recruit-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}
.recruit-card {
  background: var(--c-white);
  border-radius: var(--radius-img);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  transition: box-shadow .25s, transform .25s;
}
.recruit-card:hover {
  transform: translateY(-2px);
}
.recruit-card__link {
  display: flex;
  height: 100%;
}
.recruit-card__thumb {
  flex: 0 0 38%;
  background: var(--c-bg-alt);
  overflow: hidden;
}
.recruit-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.recruit-card__body {
  flex: 1;
  padding: min(5vw, 25px) min(5vw, 25px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: min(2vw, 10px) 0;
}
.recruit-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}
.recruit-card__cat {
  display: inline-block;
  padding: 2px 10px;
  font-family: var(--ff-head);
  font-size: 11px;
  letter-spacing: .08em;
  border: 1px solid var(--c-accent);
  color: var(--c-accent);
  border-radius: 999px;
}
.recruit-card__body .business-front__btn {
  gap: 8px;
}
.recruit-card__body .business-front__btn-circle {
  width: 30px;
  height: 30px;
}
/* 都道府県・雇用形態バッジ（職種アーカイブ） */
.recruit-card__pref {
  display: inline-block;
  padding: 3px 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  background: var(--c-accent);
  color: #fff;
  border-radius: 999px;
  line-height: 1.5;
}
.recruit-card__employment {
  display: inline-block;
  padding: 3px 12px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  background: #fff2ed;
  color: var(--c-text);
  border: 1px solid #ffb78c;
  border-radius: 999px;
  line-height: 1.5;
}
.recruit-card__title {
  font-size: min(5vw, 20px);
  font-weight: 700;
  line-height: 1.55;
}
.recruit-card__excerpt {
  font-size: 13px;
  line-height: 1.9;
  color: var(--c-text-muted);
  margin-bottom: 16px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* business-front__btn と統一。.recruit-card__link(親 a) ホバーで連動 */
.recruit-card__more { margin-top: auto; }
.recruit-card__link:hover .business-front__btn-circle {
  background: var(--c-line-strong);
  color: var(--c-white);
  transform: translateX(4px);
}
.recruit-empty {
  text-align: center;
  padding: 60px 0;
  color: var(--c-text-muted);
}

/* 職種アーカイブの絞り込みフィルタ */
.recruit-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  align-items: flex-end;
  max-width: 750px;
  margin: 0 auto 24px;
  padding: 18px 22px;
  background: var(--c-bg-alt, #f7f8f9);
  border-bottom: 1px solid var(--c-accent);
}
.recruit-filter__title {
  flex: 0 0 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--c-accent);
}
.recruit-filter__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--c-accent);
  line-height: 0;
}
.recruit-filter__group {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 180px;
}
.recruit-filter__label {
  font-size: 12px;
  font-weight: 600;
  color: var(--c-text-muted);
  letter-spacing: .04em;
}
.recruit-filter__select {
  padding: 9px 32px 9px 12px;
  font-size: 14px;
  border: 1px solid var(--c-line);
  border-radius: 4px;
  background: #fff;
  color: var(--c-text);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23333' stroke-width='1.6' stroke-linecap='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
}
.recruit-filter__select:focus {
  outline: 2px solid var(--c-accent);
  outline-offset: 1px;
}
.recruit-filter__submit {
  padding: 8px 20px;
  font-size: 14px;
  background: var(--c-accent);
  color: #fff;
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}
.recruit-filter__clear {
  margin-left: auto;
  font-size: 13px;
  color: var(--c-accent);
  text-decoration: underline;
  align-self: center;
}
.recruit-filter__count {
  margin: 0 0 16px;
  font-size: 13px;
  color: var(--c-text-muted);
}
/* JSフィルタで非表示になるカードのフェード */
.recruit-card[hidden] { display: none; }
.recruit-list .recruit-card { animation: recruit-card-fade .2s ease; }
@keyframes recruit-card-fade {
  from { opacity: .35; }
  to   { opacity: 1; }
}

/* フィルタ実行中のローディング表示 */
.recruit-list {
  position: relative;
  transition: opacity .25s ease;
}
.recruit-list.is-loading {
  opacity: .35;
  pointer-events: none;
}
.recruit-list.is-loading::after {
  content: "";
  position: absolute;
  top: 80px;
  left: 50%;
  width: 44px;
  height: 44px;
  margin-left: -22px;
  border: 3px solid rgba(0, 0, 0, .1);
  border-top-color: var(--c-accent);
  border-radius: 50%;
  animation: recruit-spin .8s linear infinite;
  z-index: 5;
}
@keyframes recruit-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 560px) {
  .recruit-filter { padding: 14px 16px; gap: 10px 12px; }
  .recruit-filter__group { min-width: 0; flex: 1 1 calc(50% - 6px); }
  .recruit-filter__clear { width: 100%; margin-left: 0; text-align: center; }
}

@media (min-width: 1501px) {
  .recruit-list { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
  .recruit-list { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .recruit-card__link { flex-direction: column; }
  .recruit-card__thumb { flex: 0 0 auto; aspect-ratio: 16/9; }
}

/* スポーツ教室講師：事務局アコーディオン */
.recruit-office-groups {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.recruit-office-group {
  border: 1px solid var(--c-line);
  border-radius: 8px;
  background: #fff;
  overflow: clip;
  transition: box-shadow .2s;
}
.recruit-office-group[hidden] { display: none; }
.recruit-office-group__summary {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 24px;
  cursor: pointer;
  list-style: none;
  font-weight: 700;
  font-size: clamp(15px, 2vw, 18px);
  letter-spacing: .04em;
  transition: background .2s;
}
.recruit-office-group__summary::-webkit-details-marker { display: none; }
.recruit-office-group__name { flex: 1 1 auto; }
.recruit-office-group__count {
  flex: 0 0 auto;
  font-family: var(--ff-head);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--c-accent);
}
.recruit-office-group__icon {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--c-accent);
  color: #fff;
  transition: transform .25s ease;
}
.recruit-office-group[open] .recruit-office-group__icon { transform: rotate(180deg); }
.recruit-office-group__summary:hover .recruit-office-group__icon { background: var(--c-accent-dark, #437f96); }

.recruit-list--in-accordion {
  padding: 24px 20px;
  border-top: 1px solid var(--c-line);
  margin-top: 0;
  background-color: #e2e2e2;
}
.recruit-list--in-accordion .recruit-card {
  border: 1px solid var(--c-line);
}
@media (max-width: 768px) {
  .recruit-office-group__summary { padding: 16px 18px; }
}

/* ---------- 採用情報 詳細（single-recruit.php） ---------- */
.recruit-single {
  max-width: var(--container-narrow);
  margin: 0 auto;
}
.recruit-single__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
}
.recruit-single__title {
  text-align: right;
  font-size: clamp(12px, 4vw, 25px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--c-accent);
  margin-bottom: min(10vw, 80px);
}
.recruit-single__title-job {
  display: block;
  font-size: clamp(14px, 7vw, 32px);
  text-align: left;
  margin-bottom: 0.5em;
  padding-bottom: 0.5em;
  border-bottom: solid 2px var(--c-accent);
}
.recruit-single__body {
  font-size: 15px;
  line-height: 2;
  margin-bottom: 48px;
}
.recruit-single__body h2 {
  font-size: 22px;
  margin: 2em 0 1em;
  padding-left: 16px;
  border-left: 4px solid var(--c-accent);
}
.recruit-single__body h3 {
  font-size: 18px;
  margin: 1.6em 0 .8em;
  font-weight: 700;
}
.recruit-single__body p { margin-bottom: 1em; }
.recruit-single__body ul,
.recruit-single__body ol { margin: 0 0 1em 1.5em; }
.recruit-single__body ul { list-style: disc; }
.recruit-single__body ol { list-style: decimal; }
.recruit-single__body table {
  width: 100%;
  margin-bottom: 1.5em;
  border-collapse: collapse;
}
.recruit-single__body th,
.recruit-single__body td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--c-line);
  text-align: left;
}
.recruit-single__body th {
  width: 28%;
  background: var(--c-bg-alt);
  font-weight: 600;
}
/* 募集要項・待遇のホワイトフレーム（カード） */
.recruit-single__section {
  background: var(--c-white);
  border-radius: var(--radius-img);
  padding: 32px 36px;
  margin-bottom: 32px;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .06);
}
.recruit-single__section-title {
  font-size: min(4vw,22px);
  font-weight: 700;
  margin: 0 0 20px;
  padding-left: 16px;
  border-left: 4px solid var(--c-accent);
  line-height: 1.4;
}
.recruit-single__section-title + .recruit-single__details {
  margin-top: 0;
}
.recruit-single__section .recruit-single__details {
  margin-bottom: 0; /* セクション側で余白を取るためテーブル下マージン解除 */
  border-top: none; /* カード内では不要 */
}
@media (max-width: 640px) {
  .recruit-single__section {
    padding: 24px 1em;
  }
}
.recruit-single__details {
  width: 100%;
  margin: 0 0 48px;
  border-collapse: collapse;
  border-top: 1px solid var(--c-line);
}
.recruit-single__details th,
.recruit-single__details td {
  padding: 18px 20px;
  border-bottom: 1px solid var(--c-white);
  vertical-align: top;
  text-align: left;
  font-size: min(3.5vw, 15px);
  line-height: 1.9;
}
.recruit-single__details tr:last-child th,
.recruit-single__details tr:last-child td {
  border-bottom: none;
}
.recruit-single__details th {
  width: 30%;
  background: var(--c-bg-alt);
  font-weight: 700;
  color: var(--c-text);
  white-space: nowrap;
}
@media (max-width: 640px) {
  .recruit-single__details th,
  .recruit-single__details td {
    display: block;
    width: 100%;
    border-bottom: none;
    padding: 12px 16px;
  }
  .recruit-single__details th {
    border-top: 1px solid var(--c-line);
    background: var(--c-bg-alt);
    white-space: normal;
  }
  .recruit-single__details td {
    border-bottom: 1px solid var(--c-line);
  }
}

.recruit-single__entry {
  text-align: center;
  padding: 32px 0;
  border-bottom: 1px solid var(--c-line);
  margin-bottom: 32px;
}
.recruit-single__foot {
  text-align: center;
  margin-top: 32px;
}

/* 画面下部に追従させる固定エントリーCTA（JSで生成） */
.recruit-fixed-cta {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 25;
  display: flex;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
  pointer-events: none;
}
.recruit-fixed-cta.is-visible {
  opacity: 1;
  visibility: visible;
  padding-right: 150px;
  transform: translateY(0);
  transition: opacity .25s ease, transform .25s ease;
  pointer-events: auto;
}
.recruit-fixed-cta > a {
  box-shadow: 0 8px 22px rgba(0, 0, 0, .22);
  max-width: 480px;
  width: 100%;
}
@media (max-width: 900px) {
  .recruit-fixed-cta.is-visible {
    padding-right: 0;
  }
}
@media (max-width: 560px) {
  .recruit-fixed-cta { left: 12px; right: 12px; bottom: 12px; }
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 220px;
  padding: 14px 28px;
  font-family: var(--ff-head);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .08em;
  border: 1px solid var(--c-line-strong);
  background: var(--c-line-strong);
  color: var(--c-white);
  border-radius: var(--radius);
  transition: background .2s, color .2s, border-color .2s, opacity .2s;
  text-align: center;
}
.btn:hover { background: var(--c-accent); opacity: 1; }

.btn--outline {
  background: transparent;
  color: var(--c-line-strong);
}
.btn--outline:hover { background: var(--c-line-strong); color: var(--c-white); }

.btn--accent {
  background: var(--c-accent);
  border-color: var(--c-accent);
}
.btn--accent:hover { background: var(--c-accent-dark); }

.btn--large { padding: 18px 36px; font-size: 15px; min-width: 280px; }

/* 外部リンクボタンの斜め矢印アイコン（SVGを currentColor で着色） */
.btn-external::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-left: 6px;
  vertical-align: -2px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 17 17 7M10 7h7v7' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 17 17 7M10 7h7v7' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / contain no-repeat;
}

.btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 32px;
  justify-content: center;
}

/* ---------- Header ---------- */
/* ハッシュ付きURL（例: /recruit/#xxx）でジャンプした際、追従ヘッダーが対象要素を覆わないように
   ブラウザのアンカースクロール位置をヘッダー高さ分オフセットする */
html { scroll-padding-top: 76px; }
@media (max-width: 900px) {
  html { scroll-padding-top: 72px; } /* SP: ヘッダー高さ 60px + ゆとり */
}

#site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--c-bk);
  backdrop-filter: blur(8px);
  border-radius: 0 0 20px 20px
}
.site-header__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 24px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.site-header__logo a {
  display: block;
  align-items: center;
  font-family: var(--ff-head);
  font-weight: 700;
  font-size: 20px;
  letter-spacing: .12em;
  color: var(--c-line-strong);
}
.site-header__logo img { max-height: 40px; width: auto; }

/* PC用ナビ */
.gnav-pc { display: flex; align-items: center; gap: 4px; }
.gnav-pc ul { display: flex; align-items: center; gap: 4px; }
.gnav-pc a {
  display: inline-block;
  padding: 8px 16px;
  font-family: var(--ff-head);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .06em;
  color: var(--c-text);
  position: relative;
}
/* ホバー時とカレントメニューはアクセントカラーで色変更（疑似要素は使わない） */
.gnav-pc a { transition: color .2s, background .2s, opacity .2s; }
.gnav-pc a:hover,
.gnav-pc .current-menu-item > a,
.gnav-pc .current-menu-parent > a,
.gnav-pc .current-menu-ancestor > a {
  color: #a5a5a5;
  opacity: 1;
}

.gnav-pc .gnav__cta a {
  background: var(--c-accent);
  color: var(--c-white);
  border-radius: var(--radius);
  margin-left: 8px;
}
.gnav-pc .gnav__cta a::after { display: none; }
.gnav-pc .gnav__cta a:hover { background: var(--c-accent-dark); }
.gnav-pc li:last-child a {
  background: var(--c-accent);
  color: var(--c-white);
}
.gnav-pc li:last-child a:hover {
  background: #333;
}

/* モバイル用ドロワー（PCでは非表示） */
.gnav-mobile { display: none; }

.menu-btn {
  display: none;
  background: none;
  border: none;
  padding: 8px;
  margin-right: -8px;
}
.menu-btn span {
  display: block;
  width: 26px;
  height: 2px;
  background: var(--c-white);
  margin: 6px 0;
  transition: transform .25s, opacity .25s;
}
body.is-menu-open .menu-btn span { opacity: 0; }

.menu-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .35);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s;
  z-index: 60;
}
body.is-menu-open .menu-overlay { opacity: 1; visibility: visible; }

/* ---------- PC: ロゴ左上固定 / 右サイド縦ナビ ---------- */
@media (min-width: 901px) {
  /* ヘッダーバーを廃止し、透明な固定レイヤーにする */
  #site-header {
    position: fixed;
    inset: 0 0 auto 0;
    height: auto;
    background: none;
    border-bottom: none;
    backdrop-filter: none;
    pointer-events: none; /* バー自体はクリックを透過させる */
    z-index: 60;
  }
  .site-header__inner {
    display: block;
    max-width: none;
    margin: 0;
    padding: 0;
    height: auto;
  }

  /* 元のヘッダー左上ロゴはPCでは非表示（ロゴは右サイドナビ内に表示） */
  .site-header__logo { display: none; }

  /* グローバルナビを右サイドに縦並びで固定（ロゴ + ナビ項目を縦に積む） */
  .gnav-pc {
    position: fixed;
    gap: 0;
    top: 20px;
    bottom: 20px;
    right: 0;
    transform: none;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    pointer-events: auto;
    z-index: 61;
  }
  /* ナビ内ロゴ（ダーク背景上に配置） */
  .gnav-pc__logo {
    width: 140px;
    margin: 0;
    padding: 18px 12px;
    background: var(--c-bk);
    border-radius: 80px 0 0 0;
    text-align: center;
  }
  .gnav-pc__logo a {
    display: inline-block;
    padding: 0;
    color: var(--c-white);
    font-family: var(--ff-head);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .12em;
    transition: transform .25s;
  }
  /* 下線（共通の ::after）を無効化 */
  .gnav-pc__logo a::after { display: none; }
  /* ホバーで少し拡大 */
  .gnav-pc__logo a:hover {
    opacity: 1;
    transform: scale(1.08);
  }
  .gnav-pc__logo img {
    max-height: 80px;
    width: auto;
    margin: 0 auto;
  }
  .gnav-pc ul {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 140px;
    flex: 1; /* 残りの高さを使う */
    padding: 12px 0;
    background: var(--c-bk);
    backdrop-filter: blur(8px);
    border-radius: 0 0 0 12px;
    color: white;
    align-items: center;
  }
  .gnav-pc li { width: 100%; }
  .gnav-pc a {
    display: block;
    padding: 14px 18px;
    text-align: center;
    font-size: 13px;
    letter-spacing: .06em;
    white-space: nowrap;
    color: white;
  }
  /* CTA はナビ最下部でアクセントブロックに */
  .gnav-pc .gnav__cta a {
    margin: 8px 10px 2px;
    padding: 12px 14px;
    border-radius: var(--radius);
    background: var(--c-accent);
    color: var(--c-white);
  }
  .gnav-pc .gnav__cta a:hover { background: var(--c-accent-dark); opacity: 1; }

  /* ページヘッダーは固定ロゴ分の余白を上に追加 */
  .page-header { padding-top: 104px; }
}

@media (max-width: 900px) {
  .menu-btn { display: block; }
  .gnav-pc { display: none; }

  /* 斜めのまま下からスッとスライドインする紙の演出 */
  .gnav-mobile {
    display: block;
    position: fixed;
    left: 50%;
    bottom: 0;
    width: 100%;
    max-width: none;
    height: 100dvh;
    background: var(--c-white);
    padding: 104px 23vw 64px 10vw;
    border-radius: 20px;
    box-shadow: 0 -14px 44px rgba(0, 0, 0, .20);
    transform: translate(100vw, -50vw) rotate(0deg);
    transform-origin: center bottom;
    visibility: hidden;
    transition: transform .55s cubic-bezier(.22, .61, .36, 1),
                visibility .55s;
    z-index: 70;
    overflow-y: auto;
  }
  /* 斜め（-5deg）を保ったまま、下から上へスライドイン */
  .gnav-mobile.is-open {
    transform: translate(-25vw, 15vw) rotate(-5deg);
    visibility: visible;
  }
  .gnav-mobile ul {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
  }
  .gnav-mobile li { border-bottom: 1px solid var(--c-line); }
  .gnav-mobile a {
    display: block;
    padding: 16px 4px;
    font-family: var(--ff-head);
    font-weight: 600;
    font-size: 15px;
    letter-spacing: .06em;
    color: var(--c-text);
  }
  .gnav-mobile .gnav__cta {
    margin-top: 24px;
    padding: 0;
    border-bottom: none;
  }
  .gnav-mobile .gnav__cta a {
    display: block;
    text-align: center;
    background: var(--c-accent);
    color: var(--c-white);
    border-radius: var(--radius);
    padding: 14px;
  }
  /* パネルを左右拡張(116%)・回転(-5deg)したため可視範囲内に配置 */
  .menu-close {
    display: block;
    position: absolute;
    top: 52px;
    right: 13%;
    background: none;
    border: none;
    width: 44px;
    height: 44px;
    font-size: 28px;
    line-height: 1;
    color: var(--c-text);
    cursor: pointer;
  }
  body.is-menu-open { overflow: hidden; }
}

/* ---------- Page header (under site header) ---------- */
.page-header {
  padding: 0 0 56px;
  background: var(--c-white);
}
.page-header__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 50px 150px 50px min(10vw, 150px);
}
@media (max-width: 900px) {
  .page-header {
    margin-top: -30px;
  }
  .page-header__inner {
    padding: 70px min(8vw, 50px) 0 min(8vw, 50px) 0;
  }
}
.page-header__sub {
  display: block;
  font-family: var(--ff-head);
  font-weight: 800;
  font-size: min(11vw, 100px);
  color: var(--c-accent);
  text-transform: uppercase;
  line-height: 1;
  padding: 0.5em 0 0.25em;
}
.page-header__title {
  font-size: min(4.25vw, 30px);
  font-weight: 700;
  letter-spacing: .04em;
}
@media (max-width: 768px) {
  .page-header {
    padding: 0 0 min(10vw, 50px);
  }
  .page-header__inner {
      padding: 50px min(8vw, 50px) 0;
  }
}

/* ---------- Breadcrumb ---------- */
.breadcrumb { padding: 16px 0 0; font-size: 12px; color: var(--c-text-muted); }
.breadcrumb ol { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.breadcrumb li:not(:last-child)::after { content: "›"; margin: 0 4px; color: var(--c-text-muted); }
.breadcrumb a { color: var(--c-text-muted); }
.breadcrumb a:hover { color: var(--c-accent); }

/* 先頭「ホーム」: 家アイコン + アクセントカラー */
.breadcrumb ol > li:first-child > a,
.breadcrumb ol > li:first-child > span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--c-accent);
}
.breadcrumb ol > li:first-child > a::before,
.breadcrumb ol > li:first-child > span::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3 2 12h3v8h5v-6h4v6h5v-8h3z'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3 2 12h3v8h5v-6h4v6h5v-8h3z'/></svg>") center / contain no-repeat;
}

/* ---------- Footer ---------- */
#site-footer {
  background: #494949;
  color: var(--c-white);
  padding: 64px 150px 32px 10px;
}
@media (max-width: 900px) {
  #site-footer {
    padding: min(10vw, 88px) 0;
  }
}
.site-footer__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 56px;
}
.site-footer__brand p {
  font-size: 13px;
  line-height: 1.9;
  color: #bbb;
}
.site-footer__logo {
  font-family: var(--ff-head);
  font-weight: 700;
  font-size: 22px;
  letter-spacing: .12em;
  margin-bottom: 16px;
}
.site-footer__logo img {
  max-height: min(30vw, 150px);
  width: auto;
  display: block;
}
.site-footer__nav {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px 32px;
  align-content: start;
}
.site-footer__nav a {
  display: inline-block;
  padding: 6px 0;
  font-size: 13px;
  color: #ddd;
}
.site-footer__nav a:hover { color: var(--c-accent); opacity: 1; }
.site-footer__sns { display: flex; gap: 12px; margin-top: 20px; }
.site-footer__sns a {
  width: 36px; height: 36px;
  border: 1px solid #444;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: var(--c-white);
}
.site-footer__sns a:hover { background: var(--c-accent); border-color: var(--c-accent); opacity: 1; }
.site-footer__bottom {
  max-width: var(--container);
  margin: 48px auto 0;
  padding: 24px 24px 0;
  border-top: 1px solid #888;
  font-size: 11px;
  letter-spacing: .12em;
  color: #888;
  text-align: center;
}
.site-footer__sub ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 24px;
  margin-bottom: 16px;
}
.site-footer__sub a {
  font-size: 12px;
  letter-spacing: .08em;
  color: #aaa;
}
.site-footer__sub a:hover { color: var(--c-white); opacity: 1; }
@media (max-width: 768px) {
  .site-footer__inner { grid-template-columns: 1fr; gap: 32px; }
  .site-footer__nav { grid-template-columns: 1fr 1fr; }
}

/* ---------- Pagetop ---------- */
#js-pagetop {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: var(--c-accent);
  color: var(--c-white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s, background .2s;
  z-index: 30;
}
#js-pagetop:hover { background: var(--c-accent-dark); opacity: 1; }
#js-pagetop svg { width: 18px; height: 18px; display: block; }
#js-pagetop.is-visible { opacity: 1; pointer-events: auto; }
/* 採用詳細ページではページトップボタンは常時非表示（エントリーCTAと重なるため） */
body.single-recruit #js-pagetop { display: none; }

/* =====================================================
   Pages
   ===================================================== */

/* ---------- Front Page ---------- */
/* ヒーロー＋事業紹介をまとめて囲うラッパー（blob の漏れをこの範囲でクリップ） */
/* overflow: clip を使用：overflow: hidden だと内部の position: sticky を阻害するため。
   clip はスクロールコンテナを作らないので、子孫の sticky がそのまま機能する。 */
.hero-business-wrap {
  position: relative;
  overflow: clip;
}

.hero {
  position: relative;
  padding: 30px 150px 0 0;
  z-index: 1;
  text-align: center;
}
.hero__inner {
  display: flex;
  max-width: var(--container);
  height: 45vw;
  margin: min(5vw, 50px) auto min(5vw, 40px);
  padding: 0 min(8vw, 50px) 280px;
  position: relative;
  z-index: 4;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}
.hero__sub {
  position: absolute;
  font-family: var(--ff-head);
  font-size: min(6vw, 61px);
  letter-spacing: .2em;
  color: #c3c3c3;
  margin-bottom: -1em;
  z-index: 0;
  top: -1em;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  text-align: center;
  text-align: center;
}
.hero__title {
  color: var(--c-accent);
  font-size: min(4vw, 67px);
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: .04em;
  margin-bottom: 24px;
}
.hero__text {
  font-size: clamp(12px,3.5vw,16px);
  font-weight: 700;
  line-height: 2;
  max-width: min(35%, 640px);
}
.hero__actions {
  margin-top: 40px;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

/* FV画像 */
.hero__visual {
  position: absolute;
  left: 58%;
  top: 0;
  transform: translate(-50%, 80px);
  width: 74%;
  max-width: 1400px;
  z-index: 3;
  pointer-events: none;
}
.hero__visual-size-fix {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  aspect-ratio: 1 / 0.6;
}

/* ─────────────────────────────────────────
   FVレイヤー
   - 各画像は .hero__visual を基準に絶対配置
   - left / bottom / width は親要素幅・高さに対する % 指定
   - 元画像（2700×1642）からの目視推定値のため、必要に応じて微調整してください
   ───────────────────────────────────────── */
.fv-layer {
  position: absolute;
  height: auto;
  pointer-events: none;
  user-select: none;
}

/* 背景：緑の楕円＋道路 */
.fv-layer--bg            { left:  0%;   bottom:  0%;  width: 100%; z-index: 2; }

/* 後景：植物・地面 */
.fv-layer--plants-back { left: 12.5%; bottom: 13%; width: 69%; z-index: 3; }
.fv-layer--ground-soccer { left: 23%; bottom: 46.5%; width: 34.5%; z-index: 3; }
.fv-layer--ground-race { left: 56.2%; bottom: 20.8%; width: 38.2%; z-index: 2; }

/* 中景：ゴール・ライブステージ */
.fv-layer--soccer-goal { left: 22.1%;   bottom: 58.5%;  width: 14%;  z-index: 4; }
.fv-layer--live-stage { left: 60%;   bottom: 37%;  width: 37.5%;  z-index: 4; }

/* 人物（サッカー） */
.fv-layer--soccer-boy-left { left: 28.5%; bottom: 52%; width: 10.5%;  z-index: 6; }
.fv-layer--soccer-boy-right { left: 43.6%; bottom: 50.8%; width: 10.5%;  z-index: 6; }
.fv-layer--soccer-ball { left: 38.5%; bottom: 54.5%; width: 4.2%;  z-index: 7; }

/* 人物（アイドル＋観客） */
.fv-layer--idol { left: 71%; bottom: 53%; width: 13%;  z-index: 5; }
.fv-layer--fun-left { left: 54%; bottom: 46%; width: 5%;  z-index: 6; }
.fv-layer--fun-right { left: 59%; bottom: 37%; width: 5%;  z-index: 6; }

/* トレーナー（コーチ） */
.fv-layer--trainer { left: 36%; bottom: 63%; width: 10%; z-index: 5; }

/* 人物（ランナー） */
.fv-layer--runner-boy { left: 65.5%; bottom: 33%; width: 11.6%; z-index: 6; }
.fv-layer--runner-girl { left: 76.5%; bottom: 27%; width: 12%; z-index: 6; }

/* 鳥・太陽（空） */
.fv-layer--sun { left: 82.2%; bottom: 88.5%; width: 7%; z-index: 5; }
.fv-layer--bird-blue { left: -10%; bottom: 14%; width: 6.5%; z-index: 5; }
.fv-layer--bird-pink { left: 18%; bottom: 82%; width: 6.8%; z-index: 5; }

/* 前景：Lime バイク */
.fv-layer--lime-man { left: 19%; bottom: 26.7%; width: 16%; z-index: 8; }
.fv-layer--lime-woman { left: 42.5%; bottom: 13.5%; width: 16%; z-index: 8; }

/* 最前景：手前の植物 */
.fv-layer--plants-front { left: 6.8%; bottom: 6.5%; width: 36.2%; z-index: 9; }

/* ─────────────────────────────────────────
   キャラクターアニメーション
   ① 跳ねる（hop）: lime-man/woman → idol → fun-right → fun-left → soccer-ball
   ② 揺れる（sway）: soccer-boy-left/right、runner-boy/girl は左右に揺れる
   ───────────────────────────────────────── */

/* ── ① 跳ねる（hop） ── */
@keyframes fv-hop {
  0%,
  12%,
  100% { transform: translateY(0); }
  3%   { transform: translateY(-14%); }
  6%   { transform: translateY(0); }
  9%   { transform: translateY(-8%); }
}

.fv-layer--lime-man,
.fv-layer--lime-woman,
.fv-layer--idol,
.fv-layer--fun-right,
.fv-layer--fun-left,
.fv-layer--soccer-ball {
  animation: fv-hop 8s ease-in-out infinite;
  will-change: transform;
}
/* lime-man → lime-woman の順で先頭に跳ねる */
.fv-layer--lime-man    { animation-delay: 0s;   }
.fv-layer--lime-woman  { animation-delay: 0.4s; }
.fv-layer--idol        { animation-delay: 1.2s; }
.fv-layer--fun-right   { animation-delay: 2.0s; }
.fv-layer--fun-left    { animation-delay: 2.8s; }
.fv-layer--soccer-ball { animation-delay: 3.6s; }

/* ── ② 揺れる（sway） ── */
@keyframes fv-sway {
  0%, 100% { transform: rotate(0deg); }
  25%      { transform: rotate(-4deg); }
  75%      { transform: rotate(4deg); }
}
.fv-layer--soccer-boy-left,
.fv-layer--soccer-boy-right,
.fv-layer--runner-boy,
.fv-layer--runner-girl {
  transform-origin: 50% 100%; /* 足元を支点にした振り子 */
  animation: fv-sway 2.6s ease-in-out infinite;
  will-change: transform;
}
/* 微妙にズラして同期しすぎないようにする */
.fv-layer--soccer-boy-left  { animation-delay: 0s;    }
.fv-layer--soccer-boy-right { animation-delay: -0.6s; }
.fv-layer--runner-boy       { animation-delay: -1.2s; }
.fv-layer--runner-girl      { animation-delay: -1.8s; }

/* ローディング表示中はアニメーションを一時停止し、終了直後から動き出すようにする */
body.is-loading .fv-layer--lime-man,
body.is-loading .fv-layer--lime-woman,
body.is-loading .fv-layer--idol,
body.is-loading .fv-layer--fun-right,
body.is-loading .fv-layer--fun-left,
body.is-loading .fv-layer--soccer-ball,
body.is-loading .fv-layer--soccer-boy-left,
body.is-loading .fv-layer--soccer-boy-right,
body.is-loading .fv-layer--runner-boy,
body.is-loading .fv-layer--runner-girl {
  animation-play-state: paused;
}

/* OS設定で動きを抑えたいユーザー向け */
@media (prefers-reduced-motion: reduce) {
  .fv-layer--lime-man,
  .fv-layer--lime-woman,
  .fv-layer--idol,
  .fv-layer--fun-right,
  .fv-layer--fun-left,
  .fv-layer--soccer-ball,
  .fv-layer--soccer-boy-left,
  .fv-layer--soccer-boy-right,
  .fv-layer--runner-boy,
  .fv-layer--runner-girl { animation: none; }
}

/* FV画像の背面で、ゆっくり波打ちながら回転するグリーンの有機的な円形 */
.hero__blob {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 95%;
  aspect-ratio: 1 / 1; /* 親が長方形でも常に正方形→正円ベースに */
  transform: translate(-50%, -50%);
  z-index: 0;
  background: #d7dee5;
  opacity: 0.38;
  /* 50%付近の微小な揺らぎで「正円に近い手描き感」を表現 */
  border-radius: 52% 48% 50% 50% / 50% 50% 48% 52%;
  pointer-events: none;
  animation:
    hero-blob-spin 32s linear infinite,
    hero-blob-morph 14s ease-in-out infinite;
  will-change: transform, border-radius;
}
@keyframes hero-blob-spin {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to   { transform: translate(-50%, -50%) rotate(360deg); }
}
@keyframes hero-blob-morph {
  0%, 100% { border-radius: 52% 48% 50% 50% / 50% 50% 48% 52%; }
  20%      { border-radius: 38% 62% 60% 40% / 65% 38% 55% 45%; }
  40%      { border-radius: 60% 40% 38% 62% / 42% 60% 38% 58%; }
  60%      { border-radius: 35% 65% 55% 45% / 55% 42% 65% 38%; }
  80%      { border-radius: 65% 35% 42% 58% / 38% 60% 45% 55%; }
}
/* OS設定で動きを抑えたいユーザー向け */
@media (prefers-reduced-motion: reduce) {
  .hero__blob { animation: none; }
}

@media (max-width: 1470px) {
  .hero__visual {
    left: 60%;
  }
  .hero__inner {
    padding: 0 min(8vw, 50px) 100px;
  }
  .hero__text {
    font-size: 13px;
    max-width: min(31%, 640px);
  }
  .fv-layer--bird-blue { bottom: 0; }
}
@media (max-width: 900px) {
  /* PC用ナビが非表示になるタイミングで右余白を解除 */
  .hero {
    padding: 30px 0 0 0;
  }
  .hero__visual {
    position: relative;
    bottom: auto;
    left: 49%;
    width: 114%;
    max-width: 1500px;
    height: auto;
    transform: translate(-54%, 0);
  }
  .hero__visual-size-fix {
    height: auto;
    object-fit: initial;
  }
  .hero__inner {
    height: auto;
    padding: 0 min(8vw, 50px) 0;
  }
  .hero__title {
    font-size: 10vw;
  }
  .hero__text {
    font-size: clamp(12px, 3.5vw, 16px);
    max-width: 100%;
  }
  .fv-layer--sun { bottom: 95.5%; }
  .fv-layer--bird-blue { left: 80%; bottom: 150%; }
  .fv-layer--bird-pink { left: 19%; }
  .fv-layer--plants-front { left: 14.8%; bottom: 2.5%; }
}
@media (max-width: 768px) {
  .hero {
    padding: 10vw 0 0;
    text-align: left;
  }
  .hero__inner {
    align-items: flex-start;
  }
}

.front-section {padding: 88px 150px 88px 0;}
/* ヒーロー直下の事業紹介セクションは上余白を詰める（PCのみ） */
@media (min-width: 901px) {
  .hero + .front-section { padding-top: 0; }
}
.front-section__head { margin-bottom: 56px; }
/* 見出し左 / ボタン右の横並びレイアウト */
.front-section__head--row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0 24px;
  align-items: center;
}
.front-section__head--row .heading-en { margin-bottom: 0; }
.front-section__head .heading-ja { display: inline-block; padding-bottom: 16px; }
.front-section__head .heading-ja::after { left: 50%; transform: translateX(-50%); }

.heading-page-sub {
  background-color: var(--c-accent);
  border-radius: 0 50vw 50vw 0;
  width: min(80%, 550px);
  padding: 0.2em 0;
  position: absolute;
  font-size: min(4vw, 22px);
  color: var(--c-white);
  left: 0;
}
.heading-page-sub span {
  padding-left: 10%;
}

/* PC用ナビが非表示になる幅（900px）以下で左右パディングを解除 */
@media (max-width: 900px) {
  .section,
  .article,
  .front-section,
  .page-common {
    padding: min(10vw, 88px) 0;
  }
}

.business-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.business-card {
  background: var(--c-white);
  border: 1px solid var(--c-line);
  border-radius: var(--radius-img);
  overflow: hidden;
  transition: box-shadow .2s, transform .2s;
}
.business-card:hover { box-shadow: var(--shadow-card); transform: translateY(-2px); }
.business-card__thumb {
  aspect-ratio: 13/10;
  background: var(--c-bg-alt);
  overflow: hidden;
}
.business-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.business-card__body { padding: 28px 24px; }
.business-card__cat {
  font-family: var(--ff-head);
  font-size: 11px;
  letter-spacing: .18em;
  color: var(--c-accent);
  margin-bottom: 8px;
}
.business-card__title { font-size: 18px; font-weight: 700; margin-bottom: 12px; color: var(--c-bk); }
.business-card__text { font-size: 14px; line-height: 1.9; color: var(--c-text-muted); margin-bottom: 16px; }
/* business-front__btn と統一。カード(親 a)のホバーで丸ボタンを反転＋矢印スライド */
/* 詳しく見るボタンは下＋右寄せ（事業カード・採用カード共通） */
.business-card__link,
.recruit-card__more {
  margin-top: auto;
  align-self: flex-end;
}
/* カード全体のフェード（a:hover の opacity:.7）を無効化、丸ボタンだけ反応 */
.business-card a:hover,
.recruit-card__link:hover { opacity: 1; }
.business-card a:hover .business-front__btn-circle {
  background: var(--c-line-strong);
  color: var(--c-white);
  transform: translateX(4px);
}
@media (max-width: 900px) {
  .business-grid { grid-template-columns: 1fr; }
}

/* ---------- Front Page: Business レイアウト（左スティッキー見出し + 右リスト） ---------- */
.business-front {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 80px;
  align-items: start;
  position: relative;
  z-index: 3;
}

/* 左カラム: 事業リスト（縦積み・各項目は画像 + テキストの2カラム） */
.business-front__list {
  display: flex;
  flex-direction: column;
  gap: 72px;
}
.business-front-item a {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.business-front-item a:hover { opacity: 1; }
.business-front-item__thumb {
  aspect-ratio: 4/3;
  overflow: hidden;
  border-radius: var(--radius-img);
  background: var(--c-bg-alt);
}
.business-front-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s;
}
.business-front-item a:hover .business-front-item__thumb img { transform: scale(1.05); }
.business-front-item__body { padding: 4px 0; }
.business-front-item__title {
  font-size: 22px;
  font-weight: 700;
  color: var(--c-bk);
  line-height: 1.55;
  margin-top: 10px;
  margin-bottom: 25px;
}
.business-front-item__catch {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: .04em;
  color: var(--c-accent);
  margin: -8px 0 16px;
  border-left: solid 1px var(--c-bk);
  padding-left: min(5vw, 20px);
}
.business-front-item__text {
  font-size: 14px;
  line-height: 1.9;
  color: var(--c-text-muted);
  display: -webkit-box;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 右カラム: スティッキーで追従する見出しエリア */
.business-front__intro {
  position: sticky;
  top: 40px;
  align-self: start;
}
.business-front__en {
  display: block;
  font-family: var(--ff-head);
  font-weight: 800;
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1;
  letter-spacing: .04em;
  color: var(--c-accent);
  margin-bottom: 28px;
}
.business-front__catch {
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: .04em;
  margin-bottom: 32px;
}
.business-front__desc {
  font-size: 14px;
  line-height: 2;
  margin-bottom: 48px;
}
.business-front__btn {
  display: flex;
  align-items: center;
  gap: 20px;
  font-family: var(--ff-head);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .12em;
  color: var(--c-line-strong);
  justify-content: flex-end;
  align-self: stretch;
}
.business-front__btn:hover { opacity: 1; }
.business-front__btn-circle {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--c-line-strong);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  line-height: 1;
  color: var(--c-line-strong);
  transition: background .25s, color .25s, transform .25s;
}
.business-front__btn:hover .business-front__btn-circle {
  background: var(--c-line-strong);
  color: var(--c-white);
  transform: translateX(4px);
}
/* SVG矢印アイコンのサイズ調整 */
.business-front__btn-circle .i-arrow {
  width: 18px;
  height: 18px;
  display: block;
}
@media (max-width: 900px) {
  #news .business-front__btn {
    width: 100%;
  }
}
/* 外部リンク用斜め矢印（footer/会社概要/採用詳細で使用） */
.i-arrow-external {
  width: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: -2px;
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .business-front {
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .business-front__intro {
    position: static;
  }
  .business-front__list { gap: 48px; }
  .business-front__desc { margin-bottom: 32px; }
}
@media (max-width: 560px) {
  .business-front-item a {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .business-front-item__title { font-size: 5.2vw; }
}

/* ---------- News list ---------- */
.news-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.news-card {
  background: var(--c-white);
  border: 1px solid var(--c-line);
  border-radius: var(--radius-img);
  overflow: hidden;
  transition: box-shadow .2s, transform .2s;
}
.news-card:hover { box-shadow: var(--shadow-card); transform: translateY(-2px); }
.news-card a { display: block; height: 100%; }
.news-card__thumb {
  aspect-ratio: 12/10;
  background: var(--c-bg-alt);
  overflow: hidden;
}
.news-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.news-card__body { padding: 20px 22px 24px; }
.news-card__meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  font-family: var(--ff-head);
  font-size: 12px;
  color: var(--c-text-muted);
}
.news-card__date { letter-spacing: .04em; }
.news-card__cat {
  display: inline-block;
  padding: 2px 10px;
  font-size: 11px;
  letter-spacing: .08em;
  border: 1px solid var(--c-accent);
  color: var(--c-accent);
  border-radius: 999px;
}
.news-card__title {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-empty { text-align: center; padding: 40px 0; color: var(--c-text-muted); }
.news-more-wrap { text-align: center; margin-top: 48px; }
#js-news-more {
  padding: 14px 36px;
  font-family: var(--ff-head);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .12em;
  background: var(--c-white);
  border: 1px solid var(--c-line-strong);
  color: var(--c-line-strong);
  border-radius: var(--radius);
  transition: background .2s, color .2s;
}
#js-news-more:hover { background: var(--c-line-strong); color: var(--c-white); }
#js-news-more[disabled] { opacity: .5; cursor: wait; }
@media (max-width: 1100px) { .news-list { grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 900px) { .news-list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .news-list { grid-template-columns: 1fr; } }

/* ---------- Front Page: News レイアウト（左フィーチャー + 右コンパクト2件） ---------- */
.news-front {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: stretch;
}
.news-front a:hover { opacity: 1; }

/* 左カラム: フィーチャー記事 */
.news-front-featured a {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  height: 100%;
}
.news-front-featured__body {
  display: flex;
  flex-direction: column;
  padding: 8px 0;
}
.news-front-featured__title {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.55;
  margin: 10px 0 16px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-front-featured__excerpt {
  font-size: 14px;
  line-height: 1.9;
  color: var(--c-text-muted);
  display: -webkit-box;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-front-featured__thumb {
  aspect-ratio: 4/5;
  overflow: hidden;
  border-radius: var(--radius-img);
  background: var(--c-bg-alt);
}
.news-front-featured__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s;
}
.news-front-featured a:hover .news-front-featured__thumb img { transform: scale(1.03); }

/* 右カラム: コンパクトリスト */
.news-front-compact-list {
  display: flex;
  flex-direction: column;
}
.news-front-compact a {
  display: grid;
  grid-template-columns: 1fr 120px;
  gap: 24px;
  align-items: center;
  padding: 18px 0;
  border-bottom: 1px solid var(--c-line);
}
.news-front-compact:first-child a { padding-top: 8px; }
.news-front-compact:last-child a { border-bottom: none; padding-bottom: 8px; }
.news-front-compact__title {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-front-compact__thumb {
  aspect-ratio: 1/1;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--c-bg-alt);
}
.news-front-compact__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 900px) {
  .news-front { grid-template-columns: 1fr; gap: 32px; }
  .news-front-featured__thumb { aspect-ratio: 8/9; order: -1; }
}
@media (max-width: 560px) {
  .news-front-featured__title { font-size: 18px; }
  .news-front-featured a { grid-template-columns: 1fr; gap: 20px; }
  .news-front-compact a { grid-template-columns: 1fr 88px; gap: 14px; }
}

/* ---------- News single ---------- */
.news-single { max-width: var(--container-narrow); margin: 0 auto; padding: 64px 24px; }
.news-single__head { margin-bottom: 32px; padding-bottom: 24px; border-bottom: 1px solid var(--c-line); }
.news-single__meta { display: flex; gap: 12px; align-items: center; font-family: var(--ff-head); font-size: 12px; color: var(--c-text-muted); margin-bottom: 16px; }
.news-single__title { font-size: 28px; line-height: 1.5; font-weight: 700; }
.news-single__thumb { margin: 0 0 40px; }
.news-single__thumb img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: var(--radius); }
.news-single__body { font-size: 15px; line-height: 2; }
.news-single__body p { margin-bottom: 1.5em; }
.news-single__body h2 { font-size: 22px; margin: 2em 0 1em; padding-left: 16px; border-left: 4px solid var(--c-accent); }
.news-single__body h3 { font-size: 18px; margin: 2em 0 1em; }
.news-single__body img { margin: 1.5em 0; border-radius: var(--radius); }
.news-single__body a { color: var(--c-accent); text-decoration: underline; }
.news-single__foot { margin-top: 56px; text-align: center; }

/* ---------- Company ---------- */
.company-table { width: 100%; margin-top: 16px; border-top: 1px solid var(--c-line); }
.company-table th,
.company-table td {
  padding: 20px 8px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--c-line);
  font-size: 15px;
  line-height: 1.9;
}
.company-table th {
  width: 28%;
  font-weight: 600;
  color: var(--c-text);
  white-space: nowrap;
}
.company-table td { color: var(--c-text-muted); }

/* リッチテキストで入力された内容（ol/ul/p/strong等）のスタイル */
.company-table td p { margin: 0 0 .6em; }
.company-table td p:last-child { margin-bottom: 0; }
.company-table td ol,
.company-table td ul {
  margin: 0 0 .6em;
  padding-left: 1.4em;
}
.company-table td ol { list-style: decimal; }
.company-table td ul { list-style: disc; }
.company-table td li {
  margin: 0 0 .25em;
  line-height: 1.8;
}
.company-table td a {
  color: var(--c-accent);
  text-decoration: underline;
}
.company-table td strong,
.company-table td b { font-weight: 700; color: var(--c-text); }

/* 住所行の「Google マップで開く」ボタン（会社概要ページ・フッター共通）
   display: flex + width: fit-content で必ず改行＋中身幅 */
.company-map-btn,
.site-footer__map a {
  display: flex;
  width: fit-content;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding: 8px 16px;
  background: var(--c-accent);
  color: var(--c-white);
  font-family: var(--ff-head);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .04em;
  border-radius: 999px;
  transition: background .2s, color .2s, opacity .2s;
}
.company-map-btn:hover,
.site-footer__map a:hover {
  background: var(--c-accent-dark);
  color: var(--c-white);
  opacity: 1;
}
.company-table td a.company-map-btn {
  color: var(--c-white);
  text-decoration: none;
}
.site-footer__map { margin-top: 8px; }

@media (max-width: 600px) {
  .company-table th, .company-table td { display: block; width: 100%; padding: 12px 0; border-bottom: none; }
  .company-table th { padding-bottom: 0; color: var(--c-accent); font-size: 13px; }
  .company-table tr { border-bottom: 1px solid var(--c-line); padding-bottom: 12px; display: block; }
}

/* ---------- Business pages ---------- */
.biz-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
  margin-bottom: 72px;
}
.biz-hero__image img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: var(--radius-img);
}
.biz-hero__body .heading-en {
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1;
  padding-bottom: .25em;
}
.biz-hero__body .heading-ja,
.sports-layout__main .heading-ja {
  font-size: min(5.5vw,28px);
  margin-bottom: 24px;
}
.biz-hero__text { font-size: 15px; line-height: 2; }
.biz-hero__text p { margin-bottom: 1em; }

/* ─── エンタメ事業：事業内容セクション ─── */
.ent-info-section {
  padding-bottom: 0;
}

.ent-services-section { padding-top: 0; padding-bottom: 80px; }
.ent-services-section .heading-en { display: block; margin-bottom: 8px; font-size: min(9vw, 50px); text-align: center; }
.ent-services-section .heading-ja { margin-bottom: min(10vw, 50px); font-size: min(4vw, 20px); text-align: center; }
.ent-services-section .heading-ja::after { left: 50%; transform: translateX(-50%); }

/* 1600px以上：biz-hero__body 内に移動された時の調整（JSで付与） */
.ent-services-section--inline {
  padding: 48px 0 0;
  background: transparent;
  margin-top: 24px;
}
.ent-services-section--inline .container--narrow {
  padding-left: 0;
  padding-right: 0;
  max-width: none;
}
.ent-services-section--inline .heading-en { text-align: left; }
.ent-services-section--inline .heading-ja { margin-bottom: min(10vw, 50px); text-align: left; }

.ent-services {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.ent-service {
  background: #fff;
  border-radius: 8px;
  padding: 48px 48px 40px;
  position: relative;
}
.ent-service__num {
  display: inline-block;
  margin-right: 1.25em;
  font-family: var(--ff-head);
  font-size: min(2.5vw, 14px);
  font-weight: 700;
  letter-spacing: .16em;
  color: var(--c-accent-dark);
  vertical-align: baseline;
  vertical-align: 0.25em;
}
.ent-service__title {
  color: var(--c-accent);
  font-size: min(4.2vw,22px);
  font-weight: 700;
  letter-spacing: .04em;
  padding-bottom: 16px;
  margin-bottom: 24px;
  border-bottom: 2px solid var(--c-accent);
}
.ent-service__subtitle {
  font-size: min(3.5vw, 18px);
  font-weight: 700;
  margin-bottom: 20px;
  color: var(--c-text);
}

/* 中見出しが無い場合は余白とタイトル下線を省略 */
.ent-service:not(:has(.ent-service__subtitle)) {
  padding: 15px 20px 15px;
}
.ent-service:not(:has(.ent-service__subtitle)) .ent-service__title {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: none;
}
.ent-service__desc,
.ent-service__detail,
.ent-service__footer {
  font-size: min(3.2vw, 16px);
  line-height: 2;
  color: var(--c-text);
}
.ent-service__desc { margin-bottom: 24px; }
.ent-service__heading {
  display: inline-block;
  padding: 0.25em 1em;
  margin: 1em 0 1.5em;
  font-size: min(3.5vw, 16px);
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--c-accent);
  border-left: solid 3px var(--c-accent);
}
.ent-service__detail { margin-bottom: 24px; }
.ent-service__detail p { margin: 0 0 1em; }
.ent-service__detail p:last-child { margin-bottom: 0; }
.ent-service__detail ol,
.ent-service__detail ul {
  margin: 0 0 1em;
  padding-left: 1.6em;
}
.ent-service__detail ol { list-style: decimal; }
.ent-service__detail ul { list-style: disc; }
.ent-service__detail li {
  margin: 0 0 .4em;
  line-height: 1.9;
}
.ent-service__detail ol li::marker {
  font-weight: 700;
}
.ent-service__detail a {
  color: var(--c-accent);
  text-decoration: underline;
}
.ent-service__detail strong {
  display: block;
  color: var(--c-accent);
}
.ent-service__detail strong,
.ent-service__detail b { font-weight: 700; }
.ent-service__footer {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--c-line);
}

@media (max-width: 768px) {
  .ent-service { padding: 32px 24px 28px; }
  .ent-services { gap: 10px; }
  .ent-services-section { padding-bottom: 56px; }
}

/* ─── アコーディオン版 ent-service（中見出しが入っている場合） ─── */
.ent-service--accordion {padding: 0; box-shadow: var(--shadow-card);}
.ent-service__details {
  display: block;
}
.ent-service__summary {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 28px 32px;
  cursor: pointer;
  list-style: none;
  position: relative;
}
.ent-service__summary::-webkit-details-marker { display: none; }
.ent-service__summary .ent-service__title {
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
  border: none;
  font-size: 22px;
  line-height: 1.5;
}
.ent-service__toggle {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--c-accent);
  color: var(--c-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .2s, color .2s;
}
.ent-service__icon {
  width: 18px;
  height: 18px;
  display: block;
}
.ent-service__icon line {
  transition: transform .25s ease, opacity .2s;
  transform-origin: center;
}
/* 開いた時：縦線を縮めて「－」に */
.ent-service__details[open] .ent-service__icon-v {
  transform: scaleY(0);
}
.ent-service__details[open] .ent-service__toggle {
  background: var(--c-accent);
  color: #fff;
}
.ent-service__summary:hover .ent-service__toggle {
  background: var(--c-accent);
  color: #fff;
}
.ent-service__body {
  padding: 0 32px 32px;
  border-top: 1px solid var(--c-line);
  padding-top: 28px;
}

@media (max-width: 768px) {
  .ent-service__summary { padding: 20px 18px; gap: 12px; }
  .ent-service__summary .ent-service__title { font-size: 17px; padding-right: 0; }
  .ent-service__toggle { width: 32px; height: 32px; }
  .ent-service__icon { width: 16px; height: 16px; }
  .ent-service__body { padding: 24px 18px; }
}

@media (max-width: 900px) {
  .biz-hero { grid-template-columns: 1fr; gap: 32px; }
}


/* スポーツ教室カード */
/* ---------- スポーツ教室ページ 2カラムレイアウト ---------- */
.sports-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 56px;
  /* align-items は default の stretch のまま → aside が main と同じ高さに伸び
     その内側の position: sticky がスクロール時に正しく追従する */
}
.sports-layout--no-aside { grid-template-columns: 1fr; }
.sports-layout__main { min-width: 0; }
.sports-layout__aside {
  /* main と同じ高さに伸ばすことで sticky の動作領域を確保 */
  align-self: stretch;
}
.sports-aside-sticky {
  position: sticky;
  top: 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
@media (max-width: 1100px) {
  .sports-layout {
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .sports-aside-sticky {
    position: static; /* スマホ・タブレットでは追従解除 */
  }
}

.sports-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 右カラム分の幅を確保するため2列に */
  gap: 28px 32px;
  margin-top: min(15vw, 80px);
}
.sports-card {
  /* overflow: hidden をやめてロゴがはみ出せるようにする */
  display: flex;
  flex-direction: column;
}
/* 写真 + ロゴをラップ（位置基準。overflow visible でロゴはみ出し許可） */
.sports-card__media {
  position: relative;
}
.sports-card__thumb {
  aspect-ratio: 16/10;
  background: var(--c-bg-alt);
  border-radius: var(--radius-img);
  overflow: hidden; /* 写真はこの内側で角丸切り抜き */
}
.sports-card__thumb > img { width: 100%; height: 100%; object-fit: cover; }
.sports-card__logo {
  position: absolute;
  right: 15px;
  bottom: -30px;
  width: 28%;
  max-width: 110px;
  aspect-ratio: 1 / 1;
  background: var(--c-white);
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .2);
  padding: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .2s, box-shadow .2s;
}
/* リンク化された場合のホバー演出 */
a.sports-card__logo:hover {
  opacity: 1;
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .26);
}
.sports-card__logo img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}
.sports-card__body { padding: 48px 5px 24px; display: flex; flex-direction: column; }
.sports-card__title { font-size: min(5vw, 20px); font-weight: 700; margin-bottom: 12px; }
.sports-card__text { font-size: 14px; line-height: 1.9; color: var(--c-text-muted); margin-bottom: 20px; }
.sports-card .btn { min-width: 0; width: 100%; padding: 12px 16px; font-size: 13px; }
@media (max-width: 560px) { .sports-grid { grid-template-columns: 1fr; } }

/* FC加盟募集バナー / 講師採用情報バナー
   バナー画像をクリックでリンク先へ。見出しは画像下に補足テキスト */
.fc-banner {
  display: block;
  max-width: 400px;
  text-decoration: none;
  color: inherit;
  transition: transform .25s, opacity .25s;
}
.fc-banner:hover {
  opacity: 1;
  transform: translateY(-3px);
}
.fc-banner__media {
  display: block;
  aspect-ratio: 750 / 320;
  overflow: hidden;
  background: var(--c-bg-alt);
  border: solid 1px white;
  box-shadow: 5px 10px 10px 0 rgba(0,0,0,0.25);
  transition: box-shadow .25s;
}
.fc-banner:hover .fc-banner__media {
  box-shadow: 0 12px 28px rgba(0, 0, 0, .18);
}
.fc-banner__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* 補足テキスト（画像下） */
.fc-banner__title {
  display: block;
  margin-top: 10px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--c-text);
  text-align: center;
  letter-spacing: .02em;
}

/* ---------- Staff list / detail ---------- */
.staff-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 40px 24px;
}
.staff-card a { display: block; }
/* カードクリックでモーダルを開くボタン */
.staff-card__trigger {
  display: block;
  width: 100%;
  padding: 0;
  background: none;
  border: 0;
  text-align: center;
  font: inherit;
  color: inherit;
  cursor: pointer;
}
.staff-card__trigger:hover { opacity: 1; }
.staff-card__photo {
  aspect-ratio: 1/1;
  background: var(--c-bg-alt);
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto;
  max-width: 220px;
  transition: transform .25s;
}
.staff-card:hover .staff-card__photo { transform: translateY(-4px); }
.staff-card__photo img,
.staff-card__photo video { width: 100%; height: 100%; object-fit: cover; display: block; }
/* 動画のネイティブUI（再生・フルスクリーン等）を完全に隠す */
.staff-card__photo video,
.staff-modal__media video {
  pointer-events: none; /* ホバー・タップでコントロール表示しない */
}
.staff-card__photo video::-webkit-media-controls,
.staff-card__photo video::-webkit-media-controls-panel,
.staff-card__photo video::-webkit-media-controls-play-button,
.staff-card__photo video::-webkit-media-controls-start-playback-button,
.staff-card__photo video::-webkit-media-controls-fullscreen-button,
.staff-card__photo video::-webkit-media-controls-overlay-play-button,
.staff-modal__media video::-webkit-media-controls,
.staff-modal__media video::-webkit-media-controls-panel,
.staff-modal__media video::-webkit-media-controls-play-button,
.staff-modal__media video::-webkit-media-controls-start-playback-button,
.staff-modal__media video::-webkit-media-controls-fullscreen-button,
.staff-modal__media video::-webkit-media-controls-overlay-play-button {
  display: none !important;
  -webkit-appearance: none;
  appearance: none;
}
.staff-card__name {
  font-size: min(3.2vw, 16px);
  font-weight: 700;
  line-height: 1.2;
}
.staff-card__pos {
  display: inline-block;
  margin: 0;
  padding: 15px 0 8px;
  font-size: 11px;
  line-height: 1.2;
  letter-spacing: .08em;
  color: #888;
}
@media (max-width: 1100px) { .staff-grid { grid-template-columns: repeat(4, 1fr); gap: 32px 20px; } }
@media (max-width: 768px)  { .staff-grid { grid-template-columns: repeat(3, 1fr); gap: 24px 14px; } }

/* スタッフ詳細 */
.staff-detail {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 56px;
  align-items: start;
}
.staff-detail__photo {
  aspect-ratio: 1/1;
  background: var(--c-bg-alt);
  border-radius: 50%;
  overflow: hidden;
}
.staff-detail__photo img,
.staff-detail__photo video { width: 100%; height: 100%; object-fit: cover; display: block; }
.staff-detail__name { font-size: 30px; font-weight: 700; margin-bottom: 12px; }
.staff-detail__pos {
  display: inline-block;
  margin-bottom: 24px;
  padding: 6px 14px;
  font-size: 12px;
  letter-spacing: .1em;
  background: var(--c-accent);
  color: var(--c-white);
  border-radius: var(--radius);
}
.staff-detail__bio { font-size: 15px; line-height: 2; color: var(--c-text); margin-bottom: 32px; }
.staff-block { margin-top: 28px; padding-left: 20px; }
.staff-block__label {
  font-family: var(--ff-head);
  font-size: 13px;
  text-align: left;
  letter-spacing: .18em;
  color: var(--c-bk);
  font-weight: 700;
  margin-bottom: 8px;
}
.staff-block__body {
  padding: 1em .65em 1em 1.8em;
  font-size: 14px;
  line-height: 1.9;
  text-align: left;
  border-left: solid 1px var(--c-accent);
}

/* SNSリスト（アイコンのみの円形ボタン） */
.staff-sns {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}
.staff-sns a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: var(--c-accent);
  border-radius: 50%;
  color: var(--c-white);
  transition: border-color .2s, background .2s, color .2s;
}
.staff-sns a:hover {
  background: var(--c-bk);
  opacity: 1;
}
.staff-sns__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
.staff-sns__icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

@media (max-width: 768px) {
  .staff-block { padding-left: 0; }
  .staff-detail { grid-template-columns: 1fr; gap: 32px; text-align: center; }
  .staff-detail__photo { max-width: 240px; margin: 0 auto; }
  .staff-sns { justify-content: center; }
}

/* ---------- スタッフモーダル ---------- */
body.is-staff-modal-open { overflow: hidden; }
.staff-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.staff-modal[hidden] { display: none; }
.staff-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .55);
  cursor: pointer;
  animation: staffModalFade .2s ease;
}
.staff-modal__panel {
  position: relative;
  background: var(--c-white);
  border-radius: var(--radius-img);
  max-width: 880px;
  width: 100%;
  max-height: 84vh;
  overflow-y: auto;
  padding: 40px 40px 48px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .35);
  animation: staffModalPop .25s cubic-bezier(.22, .61, .36, 1);
  /* Firefox 用 細身スクロールバー */
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, .18) transparent;
  scrollbar-gutter: stable;
}
/* WebKit 用 細身スクロールバー */
.staff-modal__panel::-webkit-scrollbar {
  width: 6px;
}
.staff-modal__panel::-webkit-scrollbar-track {
  background: transparent;
  margin: 12px 0;
}
.staff-modal__panel::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, .18);
  border-radius: 999px;
  transition: background .2s;
}
.staff-modal__panel::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, .35);
}
.staff-modal__close {
  position: sticky;
  top: 0;
  margin-left: auto;
  margin-bottom: -28px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--c-bk);
  color: var(--c-white);
  border: none;
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  z-index: 2;
  transition: background .2s, transform .2s;
}
.staff-modal__close:hover { background: var(--c-accent-dark); transform: scale(1.06); }
.staff-modal__body {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 50px;
  align-items: start;
}
.staff-modal__media {
  background: var(--c-bg-alt);
  border-radius: 50%;
  overflow: hidden;
  aspect-ratio: 1 / 1;
}
.staff-modal__media img,
.staff-modal__media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.staff-modal__name {
  font-size: 26px;
  font-weight: 700;
  margin: 0 0 8px;
}
.staff-modal__pos {
  display: inline-block;
  margin-bottom: 20px;
  padding: 4px 14px;
  font-family: var(--ff-head);
  font-size: 11px;
  letter-spacing: .08em;
  border: 1px solid var(--c-accent);
  color: var(--c-accent);
  border-radius: 999px;
}
.staff-modal__bio {
  font-size: 14px;
  line-height: 1.9;
  margin-bottom: 24px;
  color: var(--c-text);
}

@keyframes staffModalFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes staffModalPop {
  from { opacity: 0; transform: translateY(12px) scale(.98); }
  to   { opacity: 1; transform: translateY(0)    scale(1); }
}

@media (max-width: 768px) {
  .staff-modal { padding: 12px; }
  .staff-modal__panel { padding: 28px 20px 36px; }
  .staff-modal__body {
    grid-template-columns: 1fr;
    gap: 24px;
    text-align: center;
  }
  .staff-modal__media { max-width: 200px; margin: 0 auto; }
  .staff-modal__bio { text-align: left; }
  .staff-modal__name { font-size: 22px; }
}

/* ---------- Contact form ---------- */
.contact-form { max-width: 720px; margin: 0 auto; }
.form-row { display: grid; grid-template-columns: 200px 1fr; gap: 16px 24px; padding: 24px 0; border-bottom: 1px solid var(--c-line); align-items: start; }
.form-row:first-child { border-top: 1px solid var(--c-line); }
/* hidden 属性で非表示にできるよう、display: grid を上書き */
.form-row[hidden] { display: none; }
.form-label {
  font-size: 14px;
  font-weight: 600;
  padding-top: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.form-required {
  display: inline-block;
  padding: 2px 8px;
  font-size: 10px;
  letter-spacing: .04em;
  background: var(--c-accent);
  color: var(--c-white);
  border-radius: 2px;
}
.form-control input[type="text"],
.form-control input[type="email"],
.form-control input[type="tel"],
.form-control select,
.form-control textarea {
  width: 100%;
  padding: 12px 14px;
  font-size: 16px; /* iOSのズーム抑制（16px未満だとフォーカス時にズームする） */
  line-height: 1.6;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  background: var(--c-white);
  color: var(--c-text);
  font-family: inherit;
  /* iOS Safari の独自スタイル（インセット影・グラデ・系統色）を無効化 */
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -webkit-text-fill-color: var(--c-text); /* iOS で薄く描画される文字色を強制 */
  opacity: 1; /* iOS の disabled/placeholder 系の薄まり対策 */
  box-shadow: none;
  transition: border-color .2s, box-shadow .2s;
}
.form-control input:focus,
.form-control select:focus,
.form-control textarea:focus {
  border-color: var(--c-accent);
  outline: none;
  box-shadow: 0 0 0 3px rgba(151, 217, 46, .25);
}
.form-control textarea { min-height: 160px; resize: vertical; }
.form-control input::placeholder,
.form-control textarea::placeholder {
  color: var(--c-text-muted);
  opacity: 1;
}

/* select の独自矢印（背景にインラインSVGをdataURIで配置） */
.form-control select {
  padding-right: 44px; /* 矢印分の余白 */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px 16px;
}
/* iOS Safari 用：select の中央寄せ・テキスト切れ防止 */
.form-control select::-ms-expand { display: none; }
.form-control .error-text { color: #c33; font-size: 13px; margin-top: 6px; }

/* ラジオボタンのグループ（雇用形態など） */
.form-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  padding-top: 6px;
}
.form-radio {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-size: 15px;
  line-height: 1.6;
  user-select: none;
}
/* hidden 属性が display:inline-flex に上書きされるのを防ぐ */
.form-radio[hidden] { display: none; }
.form-radio input[type="radio"] {
  margin: 0;
  width: 18px;
  height: 18px;
  accent-color: var(--c-accent);
  cursor: pointer;
}

.form-honeypot { position: absolute; left: -9999px; height: 0; overflow: hidden; }
.form-actions { text-align: center; margin-top: 40px; }
.form-actions .btn { min-width: 320px; }
.form-turnstile { margin: 32px 0 0; display: flex; justify-content: center; }
.contact-notice {
  margin-bottom: 40px;
  padding: 16px 20px;
  background: var(--c-bg-alt);
  border-left: 3px solid var(--c-accent);
  font-size: 14px;
  line-height: 1.9;
}
.contact-error {
  margin-bottom: 32px;
  padding: 16px 20px;
  background: #fdecec;
  border-left: 3px solid #c33;
  color: #a02525;
  font-size: 14px;
}
@media (max-width: 768px) {
  .form-row { grid-template-columns: 1fr; padding: 16px 0; }
  .form-label { padding-top: 0; }
  .form-actions .btn { min-width: 0; width: 100%; }
}

/* サンクスページ */
.thanks-block { text-align: center; padding: 80px 24px; }
.thanks-block h1 { font-size: 32px; margin-bottom: 24px; }
.thanks-block p { color: var(--c-text-muted); line-height: 2; margin-bottom: 16px; }

/* ---------- 404 ---------- */
.error-block { text-align: center; padding: 120px 24px; }
.error-block__code { font-family: var(--ff-head); font-size: 96px; font-weight: 700; color: var(--c-accent); letter-spacing: .08em; line-height: 1; }
.error-block__text { font-size: 18px; margin: 16px 0 32px; }

/* ---------- Generic page (page.php) ---------- */
/* 固定ページの抜粋を見出し風に表示（page-business 等で使用） */
.page-lead {
  font-size: clamp(20px, 2.6vw, 32px);
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: .04em;
  margin: 0 0 24px;
}
.page-content {
  max-width: 100%;
  margin: 0;
  padding-bottom: min(3vw, 24px);
  font-size: min(3.5vw, 16px);
  line-height: 2;
}
.page-content h2 { font-size: 24px; margin: 2em 0 1em; padding-left: 16px; border-left: 4px solid var(--c-accent); }
.page-content h3 { font-size: 18px; margin: 2em 0 1em; }
.page-content a { color: var(--c-accent); text-decoration: underline; }
.page-content p { margin-bottom: 1.5em; }
.page-content img { margin: 1.5em 0; border-radius: var(--radius); }
.wp-block-button a {
  text-decoration: none;
  color: var(--c-white);
}
.page-common { padding-bottom: 88px; }
.wide-900 { max-width: 900px; margin: 0 auto; }

/* ---------- Utilities ---------- */
.text-center { text-align: center; }
.mt-24 { margin-top: 24px; }
.mt-48 { margin-top: 48px; }
.mb-24 { margin-bottom: 24px; }
.mb-48 { margin-bottom: 48px; }

/* スクリーンリーダー用 */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}