/**************************************************
採用ページ（/recruit/）＆ 採用エントリーモーダル 専用CSS
- モーダルはヘッダーナビの「採用エントリー」からサイト全体で開けるため、
  このCSSファイルは常時読み込み（functions.php で enqueue）。
- ブレークポイントは既存サイトに合わせて 429px（.pc/.sp の切り替えと同じ基準）。
- フォント・アクセントカラーはFigmaデザイン「採用ページ」に準拠。
 **************************************************/

:root {
  --recruit-text: #2F3A2F;
  --recruit-bg-light: #EEF4EF;
  --recruit-bg-lighter: #F9FCF9;
  --recruit-gold: #E8B32D;
  --recruit-required: #E7382E;
  --recruit-gradient-start: #A4CC3F;
  --recruit-gradient-end: #4EAB3C;
  --recruit-dark-green: #004831;
  --recruit-yugothic: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  --recruit-pt-sans: "PT Sans Narrow", sans-serif;
}

.recruit {
  color: var(--recruit-text);
  font-family: var(--recruit-yugothic);
  overflow-x: hidden;
}

.recruit a {
  color: inherit;
}

.recruit .pc-only {
  display: none;
}

.recruit .sp-only {
  display: inline;
}

.recruit__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
  position: relative;
}

.recruit__gradient-text {
  background: linear-gradient(90deg, var(--recruit-gradient-start) 5.8%, var(--recruit-gradient-end) 95.3%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* 見出し共通（英字ウォーターマーク＋小見出し＋日本語見出し） */
.recruit__heading {
  position: relative;
  text-align: center;
  margin: 0;
}

.recruit__heading-watermark {
  font-family: var(--recruit-pt-sans);
  font-weight: 400;
  font-size: 110px; /* Figma実測（SP） */
  line-height: 1.2;
  color: var(--recruit-bg-light);
  margin: 0;
  white-space: nowrap;
}
/* work / message セクションは背景の白がより濃い（recruit-bg-lighter）ため個別に上書き */
.recruit-work .recruit__heading-watermark,
.recruit-message .recruit__heading-watermark { color: var(--recruit-bg-lighter); }

.recruit__heading-label {
  font-family: var(--recruit-pt-sans);
  font-size: 16px; /* Figma実測（SP） */
  line-height: 1.2;
  display: block;
}

.recruit__heading-title {
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 24px; /* Figma実測（SP） */
  color: var(--recruit-text);
  margin: 4px 0 0;
}

.recruit__heading-inner {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}

/* ===================== スクロール連動アニメーション（Figmaコメント指示） =====================
   仕様：下から上へ移動しながら透明度0→100%／画面内に入ったタイミングで開始／
   スッと動き始め最後にゆっくり減速／開始まで0.3秒遅延／PC・SP共通。
   .is-visible の付与は recruit-animation.js（IntersectionObserver）が担当。 */
.recruit-anim-fade {
  opacity: 0;
  transform: translateY(40px);
  transition:
    opacity .9s cubic-bezier(.16, 1, .3, 1) .3s,
    transform .9s cubic-bezier(.16, 1, .3, 1) .3s;
  will-change: opacity, transform;
}
.recruit-anim-fade.is-visible {
  opacity: 1;
  transform: none;
}

/* 視差効果を減らす設定の利用者にはアニメーションを出さない */
@media (prefers-reduced-motion: reduce) {
  .recruit-anim-fade {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .recruit-hero__track {
    animation: none;
  }
}

/* CTAボタン（金色ピル） */
/* `.recruit a { color: inherit }` に負けないよう、リンク側の指定として書く。
   これがないとCTAセクション（文字色が白）のボタンだけ白文字になってしまう。 */
.recruit a.recruit__btn,
.recruit__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--recruit-gold);
  color: var(--recruit-text); /* FVのボタンと同じ文字色に統一 */
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  border-radius: 90px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: opacity .2s ease;
}
.recruit__btn:hover {
  opacity: .85;
}

/* ===================== FV（ヒーロー） ===================== */
/* 全体を1画面に収める：ギャラリーとキャッチコピーを重ねて配置（Figma実測どおり、テキストは写真の裾と重なってよい） */
.recruit-hero {
  position: relative;
  background: var(--recruit-bg-light);
  overflow: hidden;
  height: 752px; /* SP：Figma実測（FV背景の下端） */
}

.recruit-hero__deco {
  position: absolute;
  top: 39px;
  left: 0;
  width: 375px;
  height: 706px;
  pointer-events: none;
  z-index: 0;
}
.recruit-hero__deco img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.recruit-hero__deco .pc { display: none; }
.recruit-hero__deco .sp { display: block; }

/* ギャラリー：左右に余白を作らず端から端まで表示し、CSSアニメーションだけで一定速度の無限マーキーにする。
   トラックを同じ4枚のセット×2並べてtranslateX(-50%)を繰り返すことで、
   写真の幅がバラバラでも速度が常に一定になり、継ぎ目なくループする。

   幅は 100vw ではなくFV（親）の幅いっぱいにする。
   このテーマはタブレット幅でもページ全体を1280px幅で描画するため、
   100vw基準で中央寄せすると親とサイズがずれて左右に余白が出てしまう。 */
.recruit-hero__gallery {
  position: absolute;
  top: 108px; /* SP：Figma実測。ヘッダーが上に重なる作りなので、画像の上にしっかり余白を取る */
  left: 0;
  width: 100%;
  overflow: hidden;
  z-index: 1;
}
.recruit-hero__track {
  display: flex;
  width: max-content;
  /* 一定速度・途切れずループ（Figmaコメント指示）。
     1周の秒数はFigma指示の10秒だと速すぎたため、塚原さんのご指示で45秒に調整。 */
  animation: recruit-hero-marquee 45s linear infinite;
}
@keyframes recruit-hero-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.recruit-hero__slide {
  box-sizing: border-box;
  flex: 0 0 auto;
  margin-right: 24px;
}
.recruit-hero__slide img {
  width: 100%;
  height: 250px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}
.recruit-hero__slide--1,
.recruit-hero__slide--3 { margin-top: 0; }
.recruit-hero__slide--2,
.recruit-hero__slide--4 { margin-top: 60px; }
.recruit-hero__slide--1 { width: 374px; }
.recruit-hero__slide--2 { width: 195.2px; }
.recruit-hero__slide--2 img,
.recruit-hero__slide--4 img { height: 248px; }
.recruit-hero__slide--3 { width: 306px; }
.recruit-hero__slide--4 { width: 373.7px; }

/* キャッチコピー：ギャラリーの上に重ねて配置（Figma実測どおり） */
.recruit-hero__stage {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  pointer-events: none;
}
.recruit-hero__catch {
  position: absolute;
  top: 472px; /* SP：Figma実測。画像との間隔56pxを保つため、ギャラリーと同じだけ下げる */
  left: 20px;
  right: 20px;
  pointer-events: auto;
}
.recruit-hero__catch-title {
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  color: var(--recruit-dark-green);
  font-size: 24px;
  line-height: 1.4;
  margin: 0 0 12px; /* Figma実測（SP）。PCは16px */
}
.recruit-hero__catch-text {
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  color: var(--recruit-dark-green);
  font-size: 16px;
  line-height: 1.5;
  margin: 0 0 24px;
}
.recruit-hero__catch .recruit__btn {
  width: 280px;
  max-width: 100%;
  height: 50px;
  font-size: 16px;
}

/* ===================== 私たちの使命 ===================== */
.recruit-mission {
  padding: 64px 0;
}
/* SP: 写真→タイトル→本文の順（Figma準拠）。PCではCSSのorderで並びを変える（下記PCブレークポイント参照） */
.recruit-mission__body {
  display: flex;
  flex-direction: column;
}
.recruit-mission__photo {
  order: 1;
  width: 100%;
  height: 224px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  margin: 0;
}
.recruit-mission__title {
  order: 2;
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 24px;
  line-height: 1.5;
  margin: 24px 0 0;
}
.recruit-mission__text-wrap {
  order: 3;
  margin: 16px 0 0;
}
.recruit-mission__text {
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.6; /* Figma実測（SP）。PCは1.8 */
  margin: 0;
  white-space: pre-line;
}
/* Figmaでは段落間に空白行（空のp）が入っている。段落の頭に余白を付けて再現 */
.recruit-mission__text + .recruit-mission__text {
  margin-top: 28px;
}

/* ===================== 数字で見るグローバー ===================== */
.recruit-data {
  padding: 40px 0 64px;
}
.recruit-data__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px 12px;
  max-width: 480px;
  margin: 0 auto;
}
.recruit-data__card {
  position: relative;
  text-align: center;
  width: 150px;
  height: 150px;
  margin: 0 auto;
}
.recruit-data__card-deco {
  position: absolute;
  inset: 0;
  /* imgは inset:0 だけでは元画像のサイズのまま表示されてしまうため、
     カードいっぱいに収まるよう幅・高さを明示する */
  width: 100%;
  height: 100%;
  opacity: .2;
  object-fit: contain;
  z-index: 0;
}
.recruit-data__card-body {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.recruit-data__num-row {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 4px;
}
.recruit-data__num {
  font-family: var(--recruit-pt-sans);
  font-weight: 700;
  font-size: 44px; /* Figma実測（SP） */
  line-height: 1;
}
.recruit-data__unit {
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 14px;
  background: var(--recruit-gradient-end);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.recruit-data__label {
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  font-size: 14px;
  margin: 0;
}

/* ===================== 仕事内容 ===================== */
.recruit-work {
  background: var(--recruit-bg-light);
  padding: 64px 0 40px; /* Figma実測（SP）：背景の色境界から算出 */
}
.recruit-work__list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.recruit-work__card {
  background: #fff;
  border-radius: 16px;
  padding: 24px;
}
.recruit-work__card-image {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 8px;
  display: block;
  margin-bottom: 16px;
}
.recruit-work__card-eyebrow {
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  font-size: 16px;
  display: block;
  margin-bottom: 8px;
}
.recruit-work__card-title {
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 20px;
  line-height: 1.4;
  margin: 0 0 12px;
}
.recruit-work__card-desc {
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.6;
  margin: 0;
}
.recruit-work__tags {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 20px; /* Figma実測（SP）。PCは40px */
}
.recruit-work__tag-item p {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 1.6;
}
.recruit-work__tag {
  display: inline-block;
  background: linear-gradient(90deg, var(--recruit-gradient-start), var(--recruit-gradient-end));
  color: #fff;
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  font-size: 16px;
  border-radius: 2px;
  padding: 2px 8px;
}

/* ===================== 仕事の進め方・働く環境 ===================== */
.recruit-workstyle {
  padding: 64px 0;
}
/* WorkStyleだけ英字が2語（WORK STYLE）のため、SPではFigmaどおり2行に折り返す（brはPCで非表示にする） */
.recruit-workstyle .recruit__heading-watermark { line-height: 0.9; }
.recruit-workstyle__lead {
  font-family: var(--recruit-yugothic);
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
  margin: 0 0 32px;
}
.recruit-workstyle__pair {
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin-bottom: 24px;
}
.recruit-workstyle__item-photo {
  width: 100%;
  height: 206px;
  object-fit: cover;
  border-radius: 8px;
  display: block;
  margin-bottom: 12px;
}
.recruit-workstyle__item-title {
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 20px;
  text-align: center;
  margin: 0 0 8px;
}
.recruit-workstyle__item-text {
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  margin: 0;
}
.recruit-workstyle__note {
  background: var(--recruit-bg-light);
  border-radius: 8px;
  padding: 20px;
}
.recruit-workstyle__note p {
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 18px; /* Figma実測（SP）。PCは20px */
  line-height: 1.6;
  color: var(--recruit-dark-green);
  margin: 0;
  text-align: center;
}

/* ===================== 代表メッセージ ===================== */
.recruit-message {
  background: var(--recruit-bg-light);
  padding: 64px 0 40px; /* Figma実測（SP）：背景の色境界から算出 */
}
/* Figma実測（SP）：写真295px／カード335px。写真を一回り細くして中央に置き、
   カードが左右に少しはみ出す重なりにする（同じ幅だと重なった部分がただのグレーの帯に見えるため） */
.recruit-message__photo-wrap {
  width: 295px;
  max-width: 100%;
  height: 358px;
  margin: 0 auto;
  border-radius: 8px;
  overflow: hidden;
}
.recruit-message__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  /* 元画像の下端は濃い色の机で、半透明カードが重なるとグレーの帯に見えてしまう。
     Figmaと同じく下端を切り落とすため、上端を基準に少し拡大して枠からはみ出させる。 */
  transform: scale(1.14);
  transform-origin: top center;
}
.recruit-message__card {
  background: rgba(255,255,255,.8);
  border-radius: 8px;
  padding: 24px;
  margin-top: -58px; /* Figma実測（SP）：写真下端から58px重ねる */
  position: relative;
  z-index: 1;
}
.recruit-message__quote {
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 18px;
  line-height: 1.5;
  background: linear-gradient(90deg, var(--recruit-gradient-start), var(--recruit-gradient-end));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  margin: 0 0 16px; /* Figma実測（SP）。PCは24px */
}
.recruit-message__text {
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.6;
  margin: 0 0 12px; /* Figma実測（SP）。PCは24px */
}
.recruit-message__name {
  font-family: var(--recruit-yugothic);
  text-align: right;
  font-size: 16px;
}
.recruit-message__name strong {
  font-size: 20px;
  font-weight: 500;
  margin-left: 12px;
}

/* ===================== 募集要項 ===================== */
.recruit-info {
  padding: 64px 0;
}
.recruit-info__table {
  border: 1px solid #d9d9d9;
  border-top: none;
}
.recruit-info__row {
  display: flex;
  border-top: 1px solid #d9d9d9;
}
.recruit-info__label {
  flex: 0 0 112px;
  background: var(--recruit-bg-light);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 11px 8px;
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 16px; /* Figma実測（SP） */
  border-right: 1px solid #d9d9d9;
}
.recruit-info__value {
  flex: 1;
  background: #fff;
  display: flex;
  align-items: center;
  padding: 11px 12px;
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  font-size: 16px; /* Figma実測（SP） */
  line-height: 1.6;
}
.recruit-info__value p { margin: 0; }

/* ===================== CTA（下部） ===================== */
.recruit-cta {
  position: relative;
  padding: 60px 20px;
  text-align: center;
  color: #fff;
  overflow: hidden;
}
.recruit-cta__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.recruit-cta__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.recruit-cta__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,45,31,.8);
}
.recruit-cta__inner {
  position: relative;
  z-index: 1;
}
.recruit-cta__text {
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 20px;
  line-height: 1.5;
  margin: 0 0 20px;
}
.recruit-cta .recruit__btn {
  width: 280px;
  max-width: 100%;
  height: 50px;
  font-size: 16px;
}

/* ===================== 採用エントリーモーダル（サイト全体で共有） ===================== */
.recruit-entry-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  background: rgba(31,77,58,.7);
  overflow-y: auto;
  padding: 24px 0;
}
.recruit-entry-modal.is-open {
  display: block;
}
.recruit-entry-modal__panel {
  position: relative;
  background: #fff;
  max-width: 900px;
  /* 画面が狭いときも左右に必ず20pxの余白を残す（中央寄せは維持） */
  width: calc(100% - 40px);
  margin: 0 auto;
  padding: 40px 24px 48px;
}
/* 閉じるボタン。
   SPはパネルが画面幅いっぱいで外側に余白がないため、パネル内の右上に濃い色で置く。
   PCはFigmaどおりパネルの外・画面右上に白で置く（PCブレークポイント側で上書き）。 */
.recruit-entry-modal__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 10px;
  z-index: 1;
}
.recruit-entry-modal__close img {
  width: 24px;
  height: 24px;
  /* アイコンのSVGは元が白。SPは白いパネルの上に置くため、濃い色に反転させる */
  filter: brightness(0) saturate(100%) invert(19%) sepia(6%) saturate(1000%) hue-rotate(65deg) brightness(95%) contrast(88%);
}
.recruit-entry-modal .recruit__heading { margin-bottom: 0; }

/* CF7フォーム（採用エントリー） */
.recruit-entry__field {
  margin-bottom: 24px; /* Figma実測：項目間24px */
}
.recruit-entry__label-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  font-size: 16px;
  color: #000;
}
.recruit-entry__required {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--recruit-required);
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  border-radius: 2px;
  padding: 2px 5px;
  margin-left: 8px; /* 項目名との間隔 */
}
.recruit-entry__field input[type="text"],
.recruit-entry__field input[type="tel"],
.recruit-entry__field input[type="email"],
.recruit-entry__field select,
.recruit-entry__field textarea {
  width: 100%;
  border: 1px solid rgba(47,58,47,.4);
  border-radius: 4px;
  padding: 18px 24px;
  font-size: 16px;
  font-family: var(--recruit-yugothic);
  color: var(--recruit-text);
  box-sizing: border-box;
  background: #fff;
  height: 60px; /* Figma実測 */
}
.recruit-entry__field textarea {
  height: 200px; /* Figma実測 */
  resize: vertical;
}
.recruit-entry__field select {
  appearance: none;
  -webkit-appearance: none;
  /* オーソドックスな山型（シェブロン）アイコン */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%232F3A2F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 24px center;
  background-size: 14px 9px;
  cursor: pointer;
}
.recruit-entry__consent {
  text-align: center;
  max-width: 368px; /* Figma実測 */
  margin: 40px auto; /* Figma実測：フォーム→同意→ボタンの間隔は40px */
}
/* 既存テーマの明朝体・緑文字を引き継いでしまうため、Figmaどおりの書体・色を明示する */
.recruit-entry__privacy-text,
.recruit-entry__privacy-link,
.recruit-entry__checkbox {
  font-family: var(--recruit-yugothic);
  font-weight: 500;
  color: var(--recruit-text);
}
.recruit-entry__privacy-text {
  font-size: 16px;
  margin: 0 0 8px;
}
.recruit-entry__privacy-link {
  text-decoration: underline;
}
.recruit-entry__checkbox {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  cursor: pointer;
}
/* Figma実測：16px角・白背景・本文色の枠線 */
.recruit-entry__checkbox input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
  background: #fff;
  border: 1px solid var(--recruit-text);
  border-radius: 0;
  cursor: pointer;
  position: relative;
}
.recruit-entry__checkbox input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 0;
  width: 5px;
  height: 10px;
  border: solid var(--recruit-text);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.recruit-entry__submit {
  text-align: center;
  position: relative;
}
.recruit-entry__submit p {
  margin: 0;
}
/* Contact Form 7が自動で入れる送信中アイコン。
   そのままだと横幅を取ってボタンが中央からずれるため、レイアウトから外して右側に置く */
.recruit-entry__submit .wpcf7-spinner {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
}
.recruit-entry__submit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 280px;
  max-width: 100%;
  height: 50px;
  background: var(--recruit-gold);
  color: var(--recruit-text); /* FVの採用エントリーボタンと同じ文字色に統一 */
  border: none;
  border-radius: 90px;
  font-family: var(--recruit-yugothic);
  font-weight: 700;
  font-size: 16px;
  cursor: pointer;
}
.recruit-entry__submit-btn:hover {
  opacity: .85;
}
.recruit-entry-modal .wpcf7-not-valid-tip {
  color: var(--recruit-required);
  font-size: 13px;
  margin-top: 4px;
}
.recruit-entry-modal .wpcf7-response-output {
  border-radius: 8px;
  font-size: 14px;
  margin-top: 16px;
}

/* ヘッダーナビの「採用エントリー」ボタン（SP：ハンバーガーメニュー内） */
.entry-button {
  background: var(--recruit-gold);
}
.entry-button > a {
  color: var(--recruit-text); /* FVの採用エントリーボタンと同じ文字色に統一（白文字は金背景で視認性が低いため） */
}

/* ===================== PC（429px以上） ===================== */
@media (min-width: 429px) {
  .recruit .pc-only {
    display: inline;
  }

  .recruit .sp-only {
    display: none;
  }

  .recruit__inner {
    max-width: 1160px;
    padding: 0 50px;
  }

  .recruit__heading-watermark { font-size: 230px; } /* Figma実測（PC）：全セクション共通 */
  .recruit-workstyle .recruit__heading-watermark { line-height: 1.2; } /* PCは1行表示のためSPの詰め行間を解除 */
  .recruit-workstyle__watermark-br { display: none; } /* PCは「WORK STYLE」を1行で表示 */

  .recruit__heading-label { font-size: 36px; }
  .recruit__heading-title { font-size: 40px; }

  /* FV */
  .recruit-hero { height: 849px; } /* Figma FVフレーム実測高さ */
  .recruit-hero__deco {
    top: 45px;
    left: 50px;
    width: 1059px;
    height: 787px;
  }
  .recruit-hero__deco .pc { display: block; }
  .recruit-hero__deco .sp { display: none; }
  .recruit-hero__gallery {
    top: 117px; /* Figma実測（FV内 約13.8%の位置） */
  }
  /* Figmaコメント指示：PC・SPとも10秒で1周（PC個別指定は解除） */
  .recruit-hero__slide { margin-right: 40px; }
  .recruit-hero__slide--1,
  .recruit-hero__slide--3 { margin-top: 0; }
  .recruit-hero__slide--2 { margin-top: 120px; }
  .recruit-hero__slide--4 { margin-top: 156px; } /* Figma実測：slide--2とは別の値 */
  .recruit-hero__slide--1 { width: 494px; }
  .recruit-hero__slide--1 img { height: 330px; }
  .recruit-hero__slide--2 { width: 264px; }
  .recruit-hero__slide--2 img { height: 336px; }
  .recruit-hero__slide--3 { width: 398px; }
  .recruit-hero__slide--3 img { height: 325px; }
  .recruit-hero__slide--4 { width: 452px; }
  .recruit-hero__slide--4 img { height: 300px; }
  .recruit-hero__catch {
    top: 467px; /* Figma実測（FV内 約55%の位置） */
    left: 50px;
    right: auto;
    max-width: 620px;
  }
  .recruit-hero__catch-title { font-size: 48px; margin-bottom: 16px; }
  .recruit-hero__catch-text { font-size: 20px; margin-bottom: 32px; }

  /* Mission：PCはタイトルが上部フル幅、その下に写真+本文が横並び（Figma準拠） */
  .recruit-mission__body {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 31px;
  }
  .recruit-mission__title {
    order: 1;
    flex: 0 0 100%;
    font-size: 32px;
    margin: 0 0 24px;
  }
  .recruit-mission__text-wrap {
    order: 2;
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
  }
  .recruit-mission__photo {
    order: 3;
    width: 540px;
    height: 360px;
    flex-shrink: 0;
  }
  .recruit-mission__text { line-height: 1.8; }

  /* Data */
  .recruit-data { padding-bottom: 140px; }
  .recruit-data__list {
    grid-template-columns: repeat(4, 1fr);
    max-width: 1100px;
    gap: 0 28px;
  }
  /* 装飾と中身はカードにぴったり重なる指定なので、カードのサイズだけ変えればよい */
  .recruit-data__card { width: 240px; height: 240px; }
  .recruit-data__num { font-size: 72px; }
  .recruit-data__unit { font-size: 16px; }
  .recruit-data__label { font-size: 16px; }

  /* Work */
  .recruit-work { padding: 80px 0; } /* Figma実測（PC）：背景の色境界から算出 */
  .recruit-work__card { padding: 48px; }
  .recruit-work__card--photo-left { display: flex; gap: 54px; align-items: center; }
  .recruit-work__card--photo-left .recruit-work__card-image { width: 400px; height: 530px; flex-shrink: 0; margin-bottom: 0; aspect-ratio: auto; }
  .recruit-work__card--photo-left .recruit-work__card-body { flex: 1; }
  .recruit-work__card--photo-right { display: flex; flex-direction: row-reverse; gap: 54px; align-items: center; } /* Figma実測：両カードとも上下中央揃え */
  .recruit-work__card--photo-right .recruit-work__card-image { width: 400px; height: 530px; flex-shrink: 0; margin-bottom: 0; aspect-ratio: auto; }
  .recruit-work__card--photo-right .recruit-work__card-body { flex: 1; }
  .recruit-work__card-title { font-size: 32px; }
  .recruit-work__tags { margin-top: 40px; }

  /* Work style */
  .recruit-workstyle__lead { font-size: 20px; }
  .recruit-workstyle__pair { flex-direction: row; gap: 60px; }
  .recruit-workstyle__pair > div { flex: 1; }
  .recruit-workstyle__item-photo { height: 320px; }
  .recruit-workstyle__note { padding: 32px 52px; }
  .recruit-workstyle__note p { font-size: 20px; }

  /* Message：写真を基準に、カードを絶対配置でオフセット（Figma: 写真上端から140px下、左端から320pxの位置） */
  .recruit-message { padding: 80px 0 140px; } /* Figma実測（PC）：背景の色境界から算出 */
  .recruit-message__inner { position: relative; max-width: 1100px; margin: 0 auto; min-height: 580px; } /* カードが絶対配置で写真の下にはみ出す分（Figma実測：写真下端からさらに93px）を確保 */
  .recruit-message__photo-wrap { width: 380px; height: 461px; max-width: none; margin: 0; }
  .recruit-message__card {
    position: absolute;
    left: 320px;
    top: 140px;
    width: 580px;
    max-width: none;
    margin: 0;
    padding: 80px;
  }
  .recruit-message__quote { font-size: 24px; margin-bottom: 24px; }
  .recruit-message__text { margin-bottom: 24px; }

  /* Info table */
  .recruit-info__table { max-width: 900px; margin: 0 auto; }
  .recruit-info__label { flex: 0 0 200px; font-size: 16px; }
  .recruit-info__value { font-size: 16px; padding: 11px 24px; }

  /* CTA */
  .recruit-cta { padding: 100px 20px; }
  .recruit-cta__text { font-size: 40px; }

  /* モーダル */
  .recruit-entry-modal__panel { padding: 60px 125px 80px; } /* Figma実測：本文幅650px＝900-125×2 */
  /* PCはパネルの外側に余白があるので、Figmaどおり画面右上に白いアイコンで置く */
  .recruit-entry-modal__close {
    position: fixed;
    top: 24px;
    right: 24px;
  }
  .recruit-entry-modal__close img {
    filter: none; /* PCは濃い背景の上なので、元の白いアイコンのまま */
  }

  /* ヘッダーナビ：既存の「お問い合わせ」ピルと高さ・padding・書体サイズを揃える */
  .entry-button {
    border-radius: 90px;
    margin-left: 25px;
    width: auto;
    white-space: nowrap;
  }
  .entry-button > a {
    font-size: 14px;
    font-family: var(--recruit-yugothic);
    font-weight: 600;
    padding: 0 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    white-space: nowrap;
  }
  .entry-button:hover {
    width: auto;
  }
}