@charset "UTF-8";

/* =====================================================
   Foundation: CSS変数
   ===================================================== */
:root {
  /* color */
  --rc-bg: #e3f5e7;          /* 全体背景 */
  --rc-white: #ffffff;
  --rc-text: #1a1a1a;
  --rc-text-sub: #555555;
  --rc-primary: #2eb84c;     /* メイングリーン */
  --rc-primary-dark: #17a13a;
  --rc-green-light: #4cc85f;
  --rc-lime: #a8d84f;
  --rc-yellow: #fdf000;      /* ハイライト黄 */
  --rc-teal: #5ec9c0;        /* ENTRYボタン */
  /* benefit カテゴリ */
  --rc-health-bg: #e8f6ec;
  --rc-health-ac: #57b368;
  --rc-fair-bg: #e9f2fb;
  --rc-fair-ac: #4a90d9;
  --rc-work-bg: #fdeede;
  --rc-work-ac: #e8934a;
  /* parts */
  --rc-card: #f2f2f2;
  --rc-card-line: #e0e0e0;
  --rc-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.08);
  /* font */
  --rc-font-base: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', sans-serif;
  --rc-font-en: 'Arial', 'Helvetica Neue', sans-serif;
  /* z-index */
  --rc-z-fv-text: 2;
  --rc-z-overlay: 1;
}

/* =====================================================
   Foundation: リセット・ベース
   ===================================================== */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

ul {
  list-style: none;
}

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
}

/* =====================================================
   Foundation: 全体スケール制御
   ===================================================== */
html {
  font-size: 100%;
}

@media (max-width: 1400px) {
  html { font-size: 1.1428vw; }
}

@media (max-width: 768px) {
  html { font-size: clamp(10px, 4.2666vw, 16px); }
}

.recruit {
  font-family: var(--rc-font-base);
  font-size: 1rem;
  line-height: 1.8;
  color: var(--rc-text);
  background: var(--rc-bg);
  background: url("../images/main_bg.jpg") center top / cover no-repeat;
}

/* =====================================================
   Component: 見出し(recruit-heading)
   ===================================================== */
.recruit-heading {
  margin-bottom: 6rem;
}

.recruit-heading__en {
  font-family: 'Roboto', var(--rc-font-en);
  font-size: 5.5rem; /* 90pt ≒ 120px */
  font-weight: 500;
  line-height: 1;
  color: var(--rc-text);
}

.recruit-heading__ja {
  margin-top: 1rem;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--rc-primary);
}

.recruit-heading--white .recruit-heading__en,
.recruit-heading--white .recruit-heading__ja {
  color: var(--rc-white);
}

@media (max-width: 768px) {

  .recruit-heading {
    margin-bottom: 1.5rem;
  }

}

/* =====================================================
   Layout: セクション共通の内側幅
   ===================================================== */
.recruit-about__inner,
.recruit-personality__inner,
.recruit-history__inner,
.recruit-benefit__inner,
.recruit-message__inner,
.recruit-people__inner,
.recruit-faq__inner,
.recruit-jobs__inner,
.recruit-strength__inner,
.recruit-strength__head-inner {
  width: 90%;
  max-width: 90rem; /* 1440px */
  margin-inline: auto;
}

/* コンテンツ枠を白背景+paddingで判別しやすく(余白多め) */
.recruit-about__inner,
.recruit-personality__inner,
.recruit-history__inner,
.recruit-benefit__inner,
.recruit-message__inner,
.recruit-people__inner,
.recruit-faq__inner,
.recruit-jobs__inner {
  background:
    radial-gradient(circle 28rem at top right, rgba(0, 255, 55, 0.14) 0%, transparent 100%),
    var(--rc-white);
  padding: 8rem 3rem;
  border-radius: 1.5rem;
  box-shadow:
    0 0.25rem 1rem rgba(28, 90, 45, 0.05),
    0 1.5rem 3rem rgba(28, 90, 45, 0.08);
}

/* =====================================================
   Project: recruit-fv(ファーストビュー)
   ===================================================== */
.recruit-fv {
  position: relative;
  width: 100%;
  height: 100svh;
  overflow: hidden;
}

.recruit-fv__bg {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

.recruit-fv__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.recruit-fv__overlay {
  position: absolute;
  inset: 0;
  z-index: var(--rc-z-fv-text);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--rc-white);
  background: rgba(0, 0, 0, 0.15);
  text-shadow: 0 0.125rem 0.75rem rgba(0, 0, 0, 0.4);
}

.recruit-fv__logo {
  position: absolute;
  top: 6%;
  width: 11rem;
}

.recruit-fv__lead-en {
  font-family: 'Roboto Condensed', var(--rc-font-en);
  font-size: 3rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1;
}

.recruit-fv__title {
  margin: 0.75rem 0 1.25rem;
  font-size: 8rem;
  font-weight: 700;
  line-height: 1.25;
  font-feature-settings: "palt";
  letter-spacing: 0.5rem;
}

.recruit-fv__sub-en {
  font-family: 'Roboto Condensed', var(--rc-font-en);
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.6;
}

/* FV: ページ表示時に順番にフェードイン */
@keyframes rcFvFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.recruit-fv__logo,
.recruit-fv__lead-en,
.recruit-fv__title,
.recruit-fv__sub-en {
  opacity: 0;
  animation: rcFvFadeIn 1.1s ease forwards;
}

.recruit-fv__logo    { animation-delay: 0.2s; }
.recruit-fv__lead-en { animation-delay: 0.55s; }
.recruit-fv__title   { animation-delay: 0.9s; }
.recruit-fv__sub-en  { animation-delay: 1.25s; }

/* =====================================================
   Project: recruit-lead(FV下リード)
   ===================================================== */
.recruit-lead {
  position: relative;
  padding: 10rem 0 10rem;
  margin-bottom: 6rem;
  background: linear-gradient(160deg, #0f7a2a 0%, #3bb54a 55%, #a8d84f 100%);
  color: var(--rc-white);
  overflow: hidden;
}

/* 背景画像(スクロールでフェードイン) */
.recruit-lead::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("../images/p_recruit_about_lead_bg.png") center / 90rem auto no-repeat;
  opacity: 0;
  transition: opacity 1.2s ease;
}

.recruit-lead.is-visible::before {
  opacity: 1;
}

.recruit-lead__inner {
  position: relative;
  z-index: 1;
  width: 90%;
  max-width: 90rem; /* 1440px */
  margin-inline: auto;
}

.recruit-lead__title {
  font-size: 5.5rem;
  font-weight: 800;
  line-height: 1.4;
  margin-bottom: 2.5rem;
}

.recruit-lead__text {
  font-size: 3.5rem;
  font-weight: 800;
  line-height: 2;
  margin-bottom: 2.5rem;
}

.recruit-lead__mark {
  padding: 0.1em 0.25em;
  color: #0f7a2a;
  background-image: linear-gradient(var(--rc-yellow), var(--rc-yellow));
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 0% 100%;
  transition: background-size 0.6s ease;
}

/* スクロールで黄色背景が左から伸びる(各マーカーが見えた時) */
.recruit-lead__mark.is-shown {
  background-size: 100% 100%;
}

/* =====================================================
   Project: recruit-about
   ===================================================== */
.recruit-about {
  padding: 0 0 5rem;
}

.recruit-about__intro {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 3rem;
  align-items: start;
  margin-bottom: 6rem;
}

.recruit-about__visual {
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: var(--rc-primary);
  display: flex;
  align-items: center;
  justify-content: center;
}

.recruit-about__truck {
  width: 110%;
}

.recruit-about__catch {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 1.75rem;
}

.recruit-about__text {
  font-size: 1.125rem;
  line-height: 2.1;
  margin-bottom: 1.5rem;
}

.recruit-about__points-title {
  text-align: center;
  font-size: 5rem;
  font-weight: 700;
  color: var(--rc-primary);
  margin-bottom: 2.5rem;
}

.recruit-about__points {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  align-items: start;
}

.recruit-about__point--02 { margin-top: 3rem; }
.recruit-about__point--03 { margin-top: 6rem; }

.recruit-about__point-fig {
  position: relative;
  aspect-ratio: 3 / 4;
  overflow: hidden;
}

.recruit-about__point-fig img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.recruit-about__point-num {
  line-height: 1.3;
  position: absolute;
  left: 1.25rem;
  bottom: 1rem;
  font-family: var(--rc-font-en);
  font-size: 3rem;
  font-weight: 700;
  color: var(--rc-white);
  text-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.5);
}

.recruit-about__point-num span {
  font-size: 4rem;
}

.recruit-about__point-title {
  font-size: 2rem;
  font-weight: 700;
  margin: 1.5rem 0 1rem;
  line-height: 1.4;
}

.recruit-about__point-text {
  font-size: 1.125rem;
}

@media (max-width: 768px) {

  .recruit-about__point-title {
    font-size: 1.5rem;
  }
  .recruit-about__point-title br {
    display: none;
  }
  .recruit-about__catch {
    font-size: 2rem;
  }

}

/* =====================================================
   Project: recruit-strength
   ===================================================== */
.recruit-strength {
  margin-bottom: 6rem;
  background-color: var(--rc-primary);
  padding-bottom: 6rem;
  background: url(../images/p_recruit_strength_bg.png) top center / contain no-repeat #2eb84c;
}

.recruit-strength__head {
  position: relative;
  padding: 10rem 0 0;
}

.recruit-strength__inner {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding-top: 3rem;
}

.recruit-strength__card {
  background: var(--rc-white);
  border-radius: 1rem;
  padding: 3rem;
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: 2rem;
  align-items: center;
}

.recruit-strength__num {
  display: inline-block;
  font-family: var(--rc-font-en);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--rc-primary);
  padding-left: 3rem;
  position: relative;
  margin-bottom: 0.5rem;
}

.recruit-strength__num::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 2.25rem;
  height: 0.125rem;
  background: var(--rc-primary);
}

.recruit-strength__title {
  font-size: 2.125rem;
  font-weight: 700;
  line-height: 1.5;
}

.recruit-strength__text {
  font-size: 1.125rem;
}

.recruit-strength__list {
  margin-top: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.recruit-strength__item {
  position: relative;
  padding-left: 1.5rem;
  font-size: 1.125rem;
  font-weight: 700;
}

.recruit-strength__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 50%;
  background: var(--rc-primary);
}

@media (max-width: 768px) {

  .recruit-strength__title {
    font-size: 1.8rem;
  }
  .recruit-strength__title br {
    display: none;
  }

}

/* =====================================================
   Project: recruit-personality
   ===================================================== */
.recruit-personality {
  padding: 0 0 5rem;
}

.recruit-personality__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.recruit-personality__card {
  text-align: center;
}

.recruit-personality__icon {
  background: var(--rc-health-bg);
  border-radius: 1rem;
  aspect-ratio: 4 / 3;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
}

.recruit-personality__icon img {
  width: 60%;
}

.recruit-personality__title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--rc-primary);
  margin-bottom: 1rem;
}

.recruit-personality__text {
  font-size: 1.125rem;
  text-align: left;
}

/* =====================================================
   Project: recruit-history
   ===================================================== */
.recruit-history {
  padding: 0 0 5rem;
}

.recruit-history__stage {
  position: relative;
}

/* 固定される背景(紙芝居のステージ) */
.recruit-history__bg {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100dvh;
  border-radius: 1rem;
  overflow: hidden;
  z-index: 0;
}

.recruit-history__bg-img {
  position: absolute;
  inset: 0;
  opacity: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: opacity 0.8s ease;
}

.recruit-history__bg-img.is-active {
  opacity: 1;
}

/* 3セクションごとの背景画像(上にグリーンオーバーレイ) */
.recruit-history__bg-img--01 {
  background-image:
  linear-gradient(180deg, rgb(0 186 94 / 55%), rgb(0 79 34 / 75%)), 
    url("../images/p_recruit_history_1.png");
}
.recruit-history__bg-img--02 {
  background-image:
  linear-gradient(180deg, rgb(0 186 94 / 55%), rgb(0 79 34 / 75%)), 
    url("../images/p_recruit_history_2.png");
}
.recruit-history__bg-img--03 {
  background-image:
  linear-gradient(180deg, rgb(0 186 94 / 55%), rgb(0 79 34 / 75%)), 
    url("../images/p_recruit_history_3.png");
}

/* スクロールするテキストブロック */
.recruit-history__block {
  position: relative;
  z-index: 1;
  min-height: 90vh;
  min-height: 90dvh;
  display: flex;
  align-items: center;
  color: var(--rc-white);
}

/* 最初のブロックを背景ステージに重ねる */
.recruit-history__block--01 {
  margin-top: -90vh;
  margin-top: -90dvh;
}

.recruit-history__content {
  width: 100%;
  padding: 5rem;
}

.recruit-history__label {
  font-size: 2.5rem;
  font-weight: 700;
  padding-left: 0.75rem;
  border-left: 0.25rem solid var(--rc-white);
  margin-bottom: 1.5rem;
}

.recruit-history__title {
  font-size: 3.5rem;
  font-weight: 700;
  margin-bottom: 1.75rem;
}

.recruit-history__text {
  font-size: 1.215rem;
  margin-bottom: 2rem;
  max-width: 50rem;
  line-height: 2;
}

@media (max-width: 768px) {

  .recruit-history__label {
    font-size: 1.5rem;
  }
  .recruit-history__block {
    min-height: 80dvh;
  }

}

/* =====================================================
   Project: recruit-benefit
   ===================================================== */
.recruit-benefit {
  padding: 0 0 5rem;
}

.recruit-benefit__group {
  position: relative;
  font-size: 1.5rem;
  font-weight: 700;
  padding-left: 1rem;
  margin: 3.5rem 0 2rem;
}

.recruit-benefit__group::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.15em;
  width: 0.375rem;
  height: 1.4em;
  border-radius: 0.1rem;
}

.recruit-benefit__group--health::before { background: var(--rc-health-ac); }
.recruit-benefit__group--fair::before   { background: var(--rc-fair-ac); }
.recruit-benefit__group--work::before   { background: var(--rc-work-ac); }

.recruit-benefit__grid {
  display: grid;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
}

.recruit-benefit__grid--photo { grid-template-columns: repeat(3, 1fr); }
.recruit-benefit__grid--icon  { grid-template-columns: repeat(4, 1fr); }
.recruit-benefit__grid--three { grid-template-columns: repeat(3, 1fr); }
.recruit-benefit__grid--four  { grid-template-columns: repeat(4, 1fr); }

.recruit-benefit__card {
  border-radius: 0.75rem;
  padding: 1.5rem;
  overflow: hidden;
}

.recruit-benefit__card--health { background: var(--rc-health-bg); }
.recruit-benefit__card--fair   { background: var(--rc-fair-bg); }
.recruit-benefit__card--work   { background: var(--rc-work-bg); }

.recruit-benefit__thumb {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 0.5rem;
  margin-bottom: 1rem;
}

.recruit-benefit__icon {
  height: 5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0.5rem 0 1rem;
}

.recruit-benefit__icon img {
  height: 100%;
}

.recruit-benefit__title {
  text-align: center;
  font-size: 1.125rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.recruit-benefit__grid--photo .recruit-benefit__title {

}

.recruit-benefit__text {
  font-size: 1rem;
}

.recruit-benefit__grid--icon .recruit-benefit__text {
  text-align: center;
}

/* 下部2カラム */
.recruit-benefit__bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  margin-top: 3.5rem;
}

.recruit-benefit__compliance {
  background: linear-gradient(135deg, var(--rc-primary), var(--rc-primary-dark));
  color: var(--rc-white);
  border-radius: 0.75rem;
  padding: 2.5rem;
}

.recruit-benefit__compliance-title {
  position: relative;
  font-size: 1.5rem;
  font-weight: 700;
  padding-left: 0.9rem;
  margin-bottom: 1.5rem;
}

.recruit-benefit__compliance-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.15em;
  width: 0.3rem;
  height: 1.3em;
  background: var(--rc-white);
}

.recruit-benefit__compliance-text {
  font-size: 1.125rem;
}

.recruit-benefit__award {
  background: var(--rc-primary);
  color: var(--rc-white);
  border-radius: 0.75rem;
  padding: 2.5rem;
}

.recruit-benefit__award-title {
  position: relative;
  font-size: 1.5rem;
  font-weight: 700;
  padding-left: 0.9rem;
  margin-bottom: 1.5rem;
}

.recruit-benefit__award-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.15em;
  width: 0.3rem;
  height: 1.3em;
  background: var(--rc-white);
}

.recruit-benefit__award-logos {
  background: var(--rc-white);
  border-radius: 0.5rem;
  padding: 1.5rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}

/* 各認定(ロゴ+テキスト)を3等分 */
.recruit-benefit__award-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.75rem;
}

.recruit-benefit__award-item img {
  height: 6.5rem;
  width: auto;
}

.recruit-benefit__award-item p {
  font-size: 0.75rem;
    color: #000;
}

@media (max-width: 768px) {

  .recruit-benefit__award-logos {
    grid-template-columns:1fr;
  }
  .recruit-benefit__award-item {
    flex-direction: unset;
  }
  .recruit-benefit__award {
    padding: 2rem;
  }

}


/* =====================================================
   Project: recruit-message
   ===================================================== */
.recruit-message {
  padding: 0 0 5rem;
}

.recruit-message__body {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 4rem;
  align-items: center;
}

.recruit-message__photo {
  aspect-ratio: 1 / 1;
}

.recruit-message__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.recruit-message__text {
  font-size: 1.125rem;
  margin-bottom: 1.5rem;
}

.recruit-message__sign {
  text-align: right;
  font-size: 1.125rem;
  font-weight: 700;
  margin-top: 2.5rem;
  line-height: 2;
}


/* =====================================================
   Project: recruit-people
   ===================================================== */
.recruit-people {
  padding: 0 0;
  margin-bottom: 5rem;
}

.recruit-people__member {
  display: grid;
  grid-template-columns: 28rem 1fr;
  gap: 7rem;
  margin-bottom: 12rem;
  align-items: start;
}

/* 左プロフィールを固定し、右の詳細をスクロールさせる */
.recruit-people__profile {
  position: sticky;
  top: 2rem;
  align-self: start;
}

/* 役職とキャリアを横並び */
.recruit-people__meta {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  margin-bottom: 2rem;
  margin-top: 4rem;
}

.recruit-people__role {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--rc-primary);
}

.recruit-people__career {
  font-size: 1.215rem;
  font-weight: 700;
  color: var(--rc-primary);
}

.recruit-people__photo {
  position: relative;
  aspect-ratio: 3.5 / 4;
}

/* 写真の後ろに敷く緑の装飾(左上寄せ・枠内に収める) */
.recruit-people__photo::after {
  content: "";
  position: absolute;
  inset: 0 1rem 1rem 0;
  background: var(--rc-primary);
  border-radius: 0.5rem;
  z-index: 0;
}

/* 写真は右下へ内寄せ */
.recruit-people__photo img {
  position: absolute;
  inset: 1rem 0 0 1rem;
  z-index: 1;
  border-radius: 0.5rem;
  object-fit: cover;
}

.recruit-people__catch {
  font-size: 2.25rem;
  font-weight: 700;
  color: var(--rc-primary);
  margin-bottom: 2rem;
  line-height: 1.5;
}

.recruit-people__qa {
  margin-bottom: 3rem;
}

.recruit-people__q {
  font-size: 1.215rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.recruit-people__a {
  font-size: 1rem;
  line-height: 2;
}

.recruit-people__voice {
  background: var(--rc-health-bg);
  border-radius: 0.75rem;
  padding: 2rem;
  margin-top: 2rem;
}

.recruit-people__voice-title {
  font-size: 1.215rem;
  font-weight: 700;
  color: var(--rc-primary-dark);
  margin-bottom: 1rem;
}

.recruit-people__voice-text {
  font-size: 1rem;
}

@media (max-width: 768px) {

  .recruit-people__role {
    font-size: 2.2rem;
  }
  

}



/* =====================================================
   Project: recruit-faq(アコーディオン)
   ===================================================== */
.recruit-faq {
  padding: 0 0 5rem;
}

.recruit-faq__list {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.recruit-faq__item {
  background: var(--rc-card);
  border-radius: 0.5rem;
  overflow: hidden;
}

.recruit-faq__q {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.75rem 2rem;
  text-align: left;
}

.recruit-faq__mark {
  font-family: var(--rc-font-en);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--rc-primary);
  line-height: 1;
}

.recruit-faq__mark--a {
  color: var(--rc-work-ac);
}

.recruit-faq__q-text {
  flex: 1;
  font-size: 1.0625rem;
  font-weight: 700;
}

.recruit-faq__toggle {
  position: relative;
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
}

.recruit-faq__toggle::before,
.recruit-faq__toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--rc-primary);
}

.recruit-faq__toggle::before {
  width: 1.25rem;
  height: 0.1875rem;
}

.recruit-faq__toggle::after {
  width: 0.1875rem;
  height: 1.25rem;
  transition: transform 0.3s ease;
}

/* 開いているとき縦棒を消して「−」にする */
.recruit-faq__q[aria-expanded="true"] .recruit-faq__toggle::after {
  transform: translate(-50%, -50%) scaleY(0);
}

.recruit-faq__a {
  display: flex;
  gap: 1rem;
  padding: 0 2rem;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.35s ease;
}

.recruit-faq__a.is-open {
  padding: 0 2rem 1.75rem;
  max-height: 40rem;
}

.recruit-faq__a-text {
  font-size: 1rem;
  padding-top: 0.25rem;
}

/* --- FAQ一時無効化(全開・クリック不可・±アイコン非表示) --- */
/* 開閉を復活させる時は、この囲み内をまるごと削除するだけ */
.recruit-faq__q {
  pointer-events: none;
}

.recruit-faq__toggle {
  display: none;
}

.recruit-faq__a {
  max-height: none;
  padding: 0 2rem 1.75rem;
}
/* --- FAQ一時無効化ここまで --- */

/* =====================================================
   Project: recruit-jobs(募集職種一覧)
   ===================================================== */
.recruit-jobs {
  padding: 0 0 5rem;
}

.recruit-jobs__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.recruit-jobs__card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--rc-white);
  border-radius: 0.5rem;
  overflow: hidden;
  box-shadow:
    0 0.25rem 1rem rgba(28, 90, 45, 0.05),
    0 1rem 2rem rgba(28, 90, 45, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* ホバーでカードをふわっと浮かせる */
.recruit-jobs__card.is-inview:hover {
  transform: translateY(-0.5rem);
  box-shadow: 0 1rem 2.5rem rgba(28, 90, 45, 0.15);
}

/* フェードアップとホバーを両立(rc-fadeのtransitionを上書き) */
.recruit-jobs__card.rc-fade {
  transition: opacity 0.7s ease, transform 0.3s ease, box-shadow 0.3s ease;
}

/* カード全体をクリックできるように(遷移はJSで処理) */
.recruit-jobs__card {
  cursor: pointer;
}

.recruit-jobs__card-title {
  background: var(--rc-primary);
  color: var(--rc-white);
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  padding: 1.5rem 1.25rem;
}

.recruit-jobs__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
  padding: 2.5rem 1.5rem;
}

/* カード上部のサムネイル */
.recruit-jobs__thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 0.25rem;
}

.recruit-jobs__item {
  width: 100%;
  display: flex;
  align-items: baseline;
  gap: 1rem;
  text-align: left;
}

.recruit-jobs__label {
  flex: 0 0 6rem;
  font-size: 1rem;
  font-weight: 700;
  color: var(--rc-primary);
}

.recruit-jobs__value {
  flex: 1;
  font-size: 1rem;
  text-align: left;
}

.recruit-jobs__btn {
  margin-top: 1rem;
  display: inline-block;
  background: var(--rc-primary);
  color: var(--rc-white);
  font-weight: 700;
  border-radius: 2rem;
  padding: 0.85rem 2.5rem;
  transition: opacity 0.3s ease;
}

.recruit-jobs__btn:hover {
  opacity: 0.85;
}

/* =====================================================
   Component: 記事内用 応募リンクボタン(子ページ本文で使用)
   使い方: <a class="p_recruitment_link" href="#">応募する</a>
   ===================================================== */
.p_recruitment_link {
  display: block;
  width: fit-content;
  margin: 0 auto;
  background: var(--rc-primary);
  color: var(--rc-white);
  font-weight: 700;
  text-align: center;
  border-radius: 4rem;
  padding: 1.5rem 5rem;
  font-size: 1.215rem;
  transition: opacity 0.3s ease;
}

.p_recruitment_link:hover {
  filter: brightness(0.93);
  box-shadow: 0 0.5rem 1.25rem rgba(0, 0, 0, 0.18);
  text-decoration: none;
}

/* 記事内 見出し(子ページ本文で使用) */
.p_recruitment_ttl { /* h2: ページ/記事タイトル */
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 2.5rem;
}

.p_recruitment h3 { /* p_recruitment内のh3すべて */
  font-size: 1.5rem;
  font-weight: 700;
}

/* =====================================================
   Project: recruit-entry
   ===================================================== */
.recruit-entry {
  padding: 0 0 5rem;
}

.recruit-entry__inner {
  width: 96%;
  max-width: 90rem; /* 1400px */
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  background: var(--rc-primary);
  border-radius: 20px 20px;
  overflow: hidden;
}

.recruit-entry__body {
  color: var(--rc-white);
  padding: 5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  
}

.recruit-entry__title {
  font-family: var(--rc-font-en);
  font-size: 5rem;
  font-weight: 800;
  line-height: 1;
}

.recruit-entry__sub {
  font-size: 1.375rem;
  font-weight: 700;
  margin: 1rem 0 2.5rem;
}

.recruit-entry__lead {
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.8;
  margin-bottom: 3rem;
}

.recruit-entry__btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  background: var(--rc-teal);
  color: var(--rc-white);
  border-radius: 0.75rem;
  padding: 1.75rem 2.5rem;
  font-size: 1.375rem;
  font-weight: 700;
  transition: opacity 0.3s ease;
}

.recruit-entry__btn:hover {
  color: var(--rc-white);
  filter: brightness(0.93);
  box-shadow: 0 0.5rem 1.25rem rgba(0, 0, 0, 0.18);
  text-decoration: none;
}

/* ボタン共通: 押した時の縮小アニメーション */
.recruit-entry__btn,
.recruit-jobs__btn,
.p_recruitment_link {
  transition: transform 0.15s ease, filter 0.25s ease, box-shadow 0.25s ease;
}

.recruit-entry__btn:active,
.recruit-jobs__btn:active,
.p_recruitment_link:active {
  transform: scale(0.96);
}

/* ホバー時も文字色を白で固定(テーマのa:hover対策) */
.recruit-jobs__btn:hover,
.p_recruitment_link:hover {
  color: var(--rc-white);
}

.recruit-entry__btn-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: var(--rc-white);
  color: var(--rc-primary);
  font-size: 1.25rem;
}

.recruit-entry__gallery {
  position: relative;
  overflow: hidden;
  min-height: 34rem;
  margin-left: 0.75rem;
}

/* 縦長画像の無限スクロール領域 */
.recruit-entry__marquee {
  position: absolute;
  inset: 0;
  display: flex;
  gap: 1rem;
}

.recruit-entry__col {
  flex: 1;
  display: flex;
  flex-direction: column;
  animation: recruit-entry-scroll 25s linear infinite;
}

.recruit-entry__col--reverse {
  animation-direction: reverse;
}

.recruit-entry__col img {
  width: 100%;
  aspect-ratio: 9 / 16;
  object-fit: cover;
  border-radius: 0.5rem;
  margin-bottom: 1rem;
}

/* 2セット複製を半分ずらして無限ループ */
@keyframes recruit-entry-scroll {
  from { transform: translateY(0); }
  to   { transform: translateY(-50%); }
}

/* FV(SP)自動フェードスライド(縮小しながら切替) */
@keyframes recruitFvSlide {
  0%   { opacity: 0; transform: scale(1.15); }
  4%   { opacity: 1; }
  30%  { opacity: 1; }
  34%  { opacity: 0; }
  100% { opacity: 0; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .recruit-entry__col { animation: none; }
  .recruit-history__bg-img { transition: none; }
  .recruit-lead::before { transition: none; opacity: 1; }
  .recruit-lead__mark { transition: none; background-size: 100% 100%; }
  .recruit-fv__img { animation: none; opacity: 1; }
  .recruit-fv__logo,
  .recruit-fv__lead-en,
  .recruit-fv__title,
  .recruit-fv__sub-en { animation: none; opacity: 1; }
  .rc-fadein { opacity: 1; transition: none; }
  .rc-fade,
  .rc-reveal .recruit-heading__en,
  .rc-reveal .recruit-heading__ja {
    opacity: 1;
    transform: none;
    clip-path: none;
    transition: none;
  }
}

/* =====================================================
   Utility: 画像プレースホルダー(枠を出したいimgに .recruit-ph を付与)
   ===================================================== */
.recruit-ph {
  min-height: 20rem;
  word-break: break-all;
}

/* =====================================================
   Utility: スクロール演出(フェードアップ・英字見出しマスク)
   ※クラスはJS(main.js)で付与。JS無効時は通常表示。
   ===================================================== */
/* フェードアップ */
.rc-fade {
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

/* 移動なしフェードイン(リード内テキスト用) */
.rc-fadein {
  opacity: 0;
  transition: opacity 1s ease;
}

.rc-fadein.is-inview {
  opacity: 1;
}

.rc-fade.is-inview {
  opacity: 1;
  transform: none;
}

/* 英字見出し: 下からマスクをめくるように表示 */
.rc-reveal .recruit-heading__en {
  clip-path: inset(105% 0 0 0);
  transition: clip-path 0.9s cubic-bezier(0.7, 0, 0.3, 1);
}

.rc-reveal.is-inview .recruit-heading__en {
  clip-path: inset(0 0 0 0);
}

/* 日本語サブ: 少し遅れてフェードアップ */
.rc-reveal .recruit-heading__ja {
  opacity: 0;
  transform: translateY(1rem);
  transition: opacity 0.7s ease 0.25s, transform 0.7s ease 0.25s;
}

.rc-reveal.is-inview .recruit-heading__ja {
  opacity: 1;
  transform: none;
}

/* =====================================================
   Foundation: レスポンシブ(SP)
   ===================================================== */
@media (max-width: 768px) {
  .recruit-heading__en { font-size: 3rem; }

  .recruit-fv__title { font-size: 3.25rem; }
  .recruit-fv__lead-en { font-size: 1.375rem; }
  .recruit-fv__sub-en { font-size: 0.9375rem; }
  .recruit-fv__logo { width: 8rem; }

  /* FV: SPは3枚を1枚ずつ自動フェードスライド */
  .recruit-fv__img {
    position: absolute;
    inset: 0;
    opacity: 0;
    animation: recruitFvSlide 12s infinite;
  }
  .recruit-fv__img:nth-child(2) { animation-delay: 4s; }
  .recruit-fv__img:nth-child(3) { animation-delay: 8s; }

  .recruit-lead { padding: 4rem 0; }
  .recruit-lead__title { font-size: 3rem; }
  .recruit-lead__text { font-size: 1.75rem; }
  .recruit-lead::before { background-size: 150% auto; }

  /* コンテンツ枠の余白をSPで縮小 */
  .recruit-about__inner,
  .recruit-personality__inner,
  .recruit-history__inner,
  .recruit-benefit__inner,
  .recruit-message__inner,
  .recruit-people__inner,
  .recruit-faq__inner,
  .recruit-jobs__inner {
    padding: 4rem 1.25rem;
    border-radius: 1rem;
    width: auto;
    margin-inline: 1.5rem;
  }

  .recruit-about__intro { grid-template-columns: 1fr; gap: 2rem; }
  .recruit-about__points { grid-template-columns: 1fr; }
  .recruit-about__point--02,
  .recruit-about__point--03 { margin-top: 0; }
  .recruit-about__points-title { font-size: 2rem; }

  .recruit-strength__card { grid-template-columns: 1fr; gap: 1rem; padding: 2rem; }
  .recruit-strength__list { grid-column: auto; margin-top: 0; }

  .recruit-personality__list { grid-template-columns: 1fr; }

  .recruit-history__content { padding: 2.5rem 1.5rem; }
  .recruit-history__title { font-size: 1.625rem; }

  .recruit-benefit__grid--photo,
  .recruit-benefit__grid--icon,
  .recruit-benefit__grid--three,
  .recruit-benefit__grid--four { grid-template-columns: 1fr; }
  .recruit-benefit__bottom { grid-template-columns: 1fr; }

  .recruit-message__body { grid-template-columns: 1fr; gap: 2rem; }
  .recruit-message__photo { width: 60%; margin-inline: auto; }

  .recruit-people__member { grid-template-columns: 1fr; gap: 1.5rem; margin-bottom: 5rem;}
  .recruit-people__profile { position: static; }
  .recruit-people__photo { width: 60%; margin: 0 auto 3rem; }
  .recruit-people__catch { font-size: 1.375rem; }
  .recruit-people__catch br {display: none;}

  .recruit-faq__q { padding: 1.25rem; }
  .recruit-faq__q-text { font-size: 0.9375rem; }
  .recruit-faq__a.is-open { padding: 0 1.25rem 1.25rem; }

  /* 本文をSPで1remに統一 */
  .recruit-about__text,
  .recruit-about__point-text,
  .recruit-strength__text,
  .recruit-strength__item,
  .recruit-personality__text,
  .recruit-history__text,
  .recruit-benefit__text,
  .recruit-benefit__compliance-text,
  .recruit-message__text,
  .recruit-people__a,
  .recruit-people__voice-text,
  .recruit-faq__a-text,
  .recruit-jobs__value {
    font-size: 1rem;
  }

  .recruit-jobs__list { grid-template-columns: 1fr; }

  .p_recruitment_link { padding: 1.25rem 3rem; font-size: 1rem; }

  .recruit-entry__inner { grid-template-columns: 1fr; }
  .recruit-entry__body { padding: 3rem 1.5rem; align-items: center; text-align: center; }
  .recruit-entry__title { font-size: 2.75rem; }
  .recruit-entry__sub { font-size: 1.125rem; }
  .recruit-entry__lead { font-size: 1.125rem; }
  .recruit-entry__btn { width: 100%; padding: 1.25rem 1.5rem; font-size: 1.125rem; }
  .recruit-entry__gallery { padding-left: 0; margin-top: 0.75rem; }
}

/* =====================================================
   Foundation: レスポンシブ(SP)640
   ===================================================== */

   @media (max-width: 640px) {
    .recruit-lead__title {
        font-size: 2rem;
    }
    .recruit-lead__text {
      font-size: 1.5rem;
    }
    .recruit-heading__ja {
      font-size: 1.5rem;
    }
    .recruit-about__catch {
      font-size: 1.7rem;
  }
  .recruit-about__points-title {
    font-size: 1.7rem;
  }
  .recruit-strength__title {
    font-size: 1.5rem;
  }
  .recruit-heading__en {
    font-size: 2.5rem;
  }
  .recruit-people__meta {
    display: block;
  }


}


/* =====================================================
   Project: 求人票テーブル（p-jobspec）
   テーマCSSと干渉しないよう変数もブロック内にスコープ
   ===================================================== */
   .p-jobspec {
    /* --- カラー --- */
    --jobspec-bd:      #e2e6ec;   /* 罫線 */
    --jobspec-th-bg:   #f4f7fa;   /* 見出しセル背景 */
    --jobspec-th-tx:   #1f2a37;   /* 見出しセル文字 */
    --jobspec-td-tx:   #3b4553;   /* 内容セル文字 */
    --jobspec-td-bg:   #ffffff;   /* 内容セル背景 */
    --jobspec-accent:  #0a5fa8;   /* アクセント（見出し左のライン） */
  
    /* --- スペーシング --- */
    --jobspec-py:      14px;      /* セル上下padding */
    --jobspec-px:      16px;      /* セル左右padding */
  
    /* --- タイポグラフィ --- */
    --jobspec-fz:      15px;      /* 内容の文字サイズ */
    --jobspec-fz-th:   14px;      /* 見出しの文字サイズ */
    --jobspec-lh:      1.9;       /* 行間（改行が多いので広め） */
  
    /* --- 形状 --- */
    --jobspec-radius:  8px;       /* 外周の角丸 */
  
    /* 角丸を罫線に効かせるため、はみ出しを隠す */
    overflow: hidden;
    border: 1px solid var(--jobspec-bd);
    border-radius: var(--jobspec-radius);
    margin: 3rem 0;
  }
  .p_recruitment .wp-block-heading {
    margin-bottom: 2rem;
  }
  .p_recruitment p {
    margin: 1.5rem 0;
  }
  /* テーブル本体：罫線を1本に統合して二重線を防ぐ */
  .p-jobspec__table {
    width: 100%;
    border-collapse: collapse;   /* セル間の隙間をなくす */
    border-spacing: 0;
    table-layout: auto;          /* 内容に応じて幅を自動調整 */
    margin: 0;                   /* テーマの余白をリセット */
    font-size: var(--jobspec-fz);
    line-height: var(--jobspec-lh);
  }
  
  .p-jobspec__body {
    /* tbodyへのテーマスタイル上書き対策 */
    background: transparent;
  }
  
  /* --- SP（〜767px）：th と td を縦積みにする --- */
  .p-jobspec__row {
    display: block;                                  /* 行をブロック化して縦積み */
    border-bottom: 1px solid var(--jobspec-bd);
  }
  
  /* 最終行の下線は外枠と重なるため消す */
  .p-jobspec__row:last-child {
    border-bottom: none;
  }
  
  /* 見出しセル */
  .p-jobspec__head {
    display: block;
    width: 100%;
    padding: 10px var(--jobspec-px);
    background: var(--jobspec-th-bg);
    color: var(--jobspec-th-tx);
    font-size: var(--jobspec-fz-th);
    font-weight: 700;
    text-align: left;                                 /* thのcenter既定をリセット */
    letter-spacing: 0.04em;
    border: none;
    border-left: 3px solid var(--jobspec-accent);     /* 見出しの識別ライン */
    vertical-align: top;
  }
  
  /* 内容セル */
  .p-jobspec__data {
    display: block;
    width: 100%;
    padding: var(--jobspec-py) var(--jobspec-px);
    background: var(--jobspec-td-bg);
    color: var(--jobspec-td-tx);
    text-align: left;
    border: none;
    vertical-align: top;
    word-break: break-word;                           /* 長い住所などの折り返し */
  }
  
  /* =====================================================
     PC（768px以上）：2カラムのテーブル表示に戻す
     ===================================================== */
  @media screen and (min-width: 768px) {
  
    .p-jobspec__row {
      display: table-row;                             /* 通常のテーブル行に戻す */
      border-bottom: none;
    }
  
    /* ゼブラ：偶数行の内容セルに薄い背景 */
    .p-jobspec__row:nth-child(even) .p-jobspec__data {
      background: #fafbfc;
    }
  
    .p-jobspec__head {
      display: table-cell;
      width: 220px;                                   /* 見出し列の固定幅 */
      padding: var(--jobspec-py) var(--jobspec-px);
      border-left: none;                              /* SP用ラインを解除 */
      border-bottom: 1px solid var(--jobspec-bd);
      border-right: 1px solid var(--jobspec-bd);
      white-space: nowrap;                            /* 見出しの折り返しを防ぐ */
    }
  
    .p-jobspec__data {
      display: table-cell;
      width: auto;
      border-bottom: 1px solid var(--jobspec-bd);
    }
  
    /* 最終行の下線は外枠と重なるため消す */
    .p-jobspec__row:last-child .p-jobspec__head,
    .p-jobspec__row:last-child .p-jobspec__data {
      border-bottom: none;
    }
  }