/* ==============================================================
    [recruit-career]
   ============================================================== */

 .page-recruit-career__heading{
    text-align: center;
    font-size: var(--font-size-h2);
    font-weight: var(--font-weight-bold);
    color: var(--text-color);
    padding-top: 24px;
    margin-bottom: 40px;
 }
.page-recruit-career__section-title{
    text-align: center;
    font-size: var(--font-size-h2);
    font-weight: var(--font-weight-bold);
    color: var(--text-color);
    margin-bottom: 40px;
}

/* ==============================================================
メッセージ
============================================================== */
.p-page-recruit-career__message.page_bg-left {
  padding-top: 40px;
  padding-bottom: 80px;
}
.p-page-recruit-career__message.page_bg-left::before {
  height: calc(100% - 114px);
  top: 114px;
}

.p-page-recruit-career__message-list {
  margin-top: 24px;
 
}


.p-page-recruit-career__message-item.p-point {
  width: 100%;
  max-width: 1040px;
  margin-right: auto;     
}
.p-page-recruit-career__message-item + .p-page-recruit-career__message-item {
  margin-top: 40px;
}

.p-page-recruit-career__message-item:nth-child(even) {
  margin-left: auto;
  margin-right: 0;
}


.p-page-recruit-career__message-item .p-point__content{
  display: flex;
  align-items: center;
  position: relative;  
}

.p-page-recruit-career__message-item .c-tag--rb{
  position: absolute;
  z-index: 2;             /* 画像やテキストより前面に */
  white-space: nowrap;    /* 文字の折返し防止（縦向きでも効く） */
  padding: 8px 16px;
}

.p-page-recruit-career__message-item .p-point__image{
  flex: 0 0 420px;
  max-width: 420px;
  overflow: hidden;
  position: relative;
}
.p-page-recruit-career__message-item .p-point__image img{
  width: 100%;
  height: auto;
  aspect-ratio: 420 / 324;
  object-fit: cover;
  display: block;
}

/* テキスト側 */
.p-page-recruit-career__message-item .p-point__text{
  width: 100%;
}
.p-page-recruit-career__message-item .p-point__text .p-point__title {
  margin-bottom: 40px;
}


/* ==============================================================
インタビュー
============================================================== */
.page-recruit-career__interview-flexbox {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 40px;
}

.page-recruit-career__section--interview{
  margin-top: 80px;
  margin-bottom: 40px;
}


.page-recruit-career__link {
  text-align: center;
}
/* ==============================================================
    サポート
============================================================== */
/* セクション全体 */
.page-recruit-career__section--support {
  padding: 40px 0 0 0;
}

.page-recruit-career__section--support.page_bg-right::before {
  height: 74%;
  top: 80px;
}

.page-recruit-career__section--support.page_bg-name::after {
  top: auto;
  bottom: 24px;
  left: 24px;
  
}


/* コンテナ */
.page-recruit-career__section--support .container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 24px;
}

/* 見出し */
.page-recruit-career__section--support .p-heading {
  margin-bottom: 48px;
  text-align: center;
}

/* グリッド */
.page-recruit-career__support-grid {
  display: flex;
  justify-content: center;
  gap: 16px;                               /* ← 上段と同じ間隔 */
  align-items: start;
  margin-bottom: 48px;
  width: 100%;
}

/* カード本体 */
.p-card__support {
  width: 340px; /* 上段と統一 */
  background-color: #fff;
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  overflow: hidden;
  display: block;
  height: auto;
}

/* 内部構成 */
.p-card__support .p-card__box {
  display: block;
  height: 100%;
}

/* 画像 */
.p-card__support .p-card__image {
  width: 100%;
  height: auto;
  overflow: hidden;
}

.p-card__support .p-card__image img {
  width: 100%;
  height: auto;
  display: block;
}

/* コンテンツ */
.p-card__support .p-card__content {
  padding: 24px;
  display: block;
}

/* タイトル */
.p-card__support-title {
  font-size: var(--font-size-h2, 32px);
  font-weight: var(--font-weight-bold, 700);
  color: var(--orange-primary, #DE765B);
  text-align: center;
  margin-bottom: 12px;
}

/* テキスト */
.p-card__support-text {
  font-size: var(--font-size-body, 16px);
  color: var(--text-color, #5D5759);
  line-height: var(--line-height-relaxed, 1.8);
  margin-bottom: 16px;
  text-align: left;
}

/* リスト */
.p-card__support-list {
  margin: 0;
  padding-left: 20px;
  color: var(--text-color, #5D5759);
  font-size: var(--font-size-body, 16px);
  line-height: var(--line-height-relaxed, 1.8);
  text-align: left;
}

.p-card__support-list li {
  list-style-type: disc;
}

/* 下部リンク */
.page-recruit-career__link {
  text-align: center;
}

.page-recruit-career__link .c-more {
  margin-top: 24px;
}


/* ==============================================================
よくある質問
============================================================== */
/* セクション余白 */
.page-recruit-career__section--faq {
  margin: 80px 0;
  padding-top: 80px;
  padding-bottom: 80px;
  background-color: var(--orange-base-transparent);
}

/* コンテンツ縦積み＋間隔 */
.page-recruit-career__section--faq .container {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* 白カード */
.page-recruit-career__faq-box {
  background: #fff;
  padding: 80px;
  border-radius: 40px;
  color: var(--text-color);
  box-shadow: 0 0 15px #edebe899;
}

/* 見出し */
.page-recruit-career__faq-title {
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  color:#EEA837;
  text-align: center;
  margin-bottom: 40px;
}

/* リスト本体 */
.page-recruit-career__faq-list {
  margin: 0;
  padding: 0;
}

/* 質問ボタン */
.page-recruit-career__question .faq-toggle {
  width: 100%;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal);
  cursor: pointer;
  display: flex;
  align-items: center;
  position: relative;
  background: transparent;
  border: 0;
  padding: 0;
  padding-right: 24px;
  text-align: left;
}

/* 質問アイコン（Q） */
.page-recruit-career__question .faq-toggle::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  margin-right: 8px;
  background: url("../img/icon_question.svg") no-repeat 0 50%;
  flex-shrink: 0;
}

/* 右端の▶ アイコン */
.page-recruit-career__question .faq-toggle::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 9px;
  height: 14px;
  transform: translateY(-50%) rotate(90deg); /* 閉じているとき */
  transition: transform .2s ease;
  background: url("../img/icon_arrow.svg") no-repeat 50% 50%;
}

/* 開いているときに回転 */
.page-recruit-career__question.is-open .faq-toggle::after {
  transform: translateY(-50%) rotate(-90deg);
}

/* 質問間の余白（答えの直後に次の質問が来るパターン） */
.page-recruit-career__answer + .page-recruit-career__question {
  margin-top: 56px;
}

/* 答え */
.page-recruit-career__answer {
  display: none;
  height: 0;
  margin-top: 24px;
  padding: 24px;
  box-sizing: border-box;
  line-height: var(--line-height-relaxed);
  background: var(--orange-base-transparent);
  border-radius: 16px;
  transition: .3s;
}

/* 開いた状態 */
.page-recruit-career__question.is-open + .page-recruit-career__answer {
  display: block;
  height: auto;
}


/* ==============================================================
転職ステップ
============================================================== */
/* セクション余白 */
.page-recruit-career__section--flow {
  padding: 0 0 80px 0;

}

/* 内枠（1120px / 角40 / 内側 40 64） */
.page-recruit-career__flow-box {
  max-width: 1120px;
  margin: 0 auto;
  background: #FFF9F0;
  border-radius: 40px;
  padding: 40px 64px;
  --arrow-w: 24px;   /* 矢印アイコンの一辺(px) */
  --arrow-gap: 24px; /* カード間中央に来るような右オフセット(px) */
}

/* 見出し */
.page-recruit-career__flow-title {
  color: #EEA837;
  font-weight: 700;
  font-size: var(--font-size-h2);
  line-height: 1.5;
  margin-bottom: 16px;
  text-align: left;
  text-align: center;
}

/* リード文 */
.page-recruit-career__flow-lead {
  color: var(--ri-text);
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 40px;
}

/* ステップ一覧 */
.page-recruit-career__flow-box ol {
  display: flex;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 24px;
}

/* 各ステップカード */
.page-recruit-career__flow-box li {
  width: 230px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #EEA837;
  border-radius: 10px;
  position: relative;
  z-index: 1;
}

.page-recruit-career__flow-contents {
  padding: 24px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;  
}

/* 矢印 */
.page-recruit-career__flow-box li {
  position: relative;
  z-index: 1;                      /* 後続カードより下地を1段上げる */
}

.page-recruit-career__flow-box li:not(:last-child)::after{
   content: "";
  position: absolute;
  right: calc(var(--arrow-gap) * -1);     /* gapと連動して中央へ */
  top: 50%;
  transform: translateY(-50%);            /* 縦中央合わせ */
  width: var(--arrow-w);
  height: var(--arrow-w);
  background: url("../img/entry_flow.svg") no-repeat 50% 50%/contain;
  pointer-events: none;
  z-index: 2;
}

/* ステップ番号（バッジ） */
.page-recruit-career__flow-box ol {
  counter-reset: step;
}
.page-recruit-career__flow-contents::before {
  counter-increment: step;
  content: counter(step, decimal-leading-zero);
  width: 56px;
  height: 56px;
  border-radius: 40px;
  background: color-mix(in srgb, #EEA837 10%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  color:#EEA837;
  font-weight: 900;
  font-size: var(--font-size-sm);
  line-height: 1;
}

/* サブタイトル（例：まずは説明会へ〜） */
.page-recruit-career__flow-subtitle {
  color: #EEA837;
  font-weight: 900;
  font-size: var(--font-size-sm);
  line-height: 32px;
  min-height: calc(2em * var(--line-height-normal));
  text-align: center;
  padding: 0 16px;
}

/* 詳細文（例：オンラインまたは〜） */
.page-recruit-career__flow-detail {
  color: var(--ri-text);
  font-weight: var(--font-weight-bold);
  font-size:var(--font-size-xs);
  line-height: var(--line-height-normal);
  text-align: center;
  padding: 0 16px;
}


/* ==============================================================
    p-page-recruit-career__career
============================================================== */
.p-page-recruit-career__career {
  padding-block: 80px;
  background-color: var(--background-color);
}

/* コンテナ幅調整 */
.p-page-recruit-career__career-inner.container {
  max-width: 1248px;
}

.p-page-recruit-career__career-heading-text {
  margin-top: 24px;
  font-size: var(--font-size-body);
}

.p-page-recruit-career__career-list {
  margin-top: 48px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* 各カード */
.p-page-recruit-career__career-item {
  border-radius: 10px;
  overflow: hidden;
}

/* カード画像 */
.p-page-recruit-career__career-item-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  aspect-ratio: 384 / 238;
}

/* 本文ブロック */
.p-page-recruit-career__career-item-body {
  padding: 48px 48px 40px;
  height: 100%;
  background-color: #fff;
}

/* ヘッダー：タイトル、アイコン、数字 */
.p-page-recruit-career__career-item-header {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* タイトルバッジ */
.p-page-recruit-career__career-item-title {
  padding-block: 4px;
  width: 100%;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: #fff;
  text-align: center;
  border-radius: 100px;
}

/* タイトル色バリエーション */
.p-page-recruit-career__career-item-title.-green {
  max-width: 160px;
  background-color: var(--green-base);
}

.p-page-recruit-career__career-item-title.-orange {
  max-width: 220px;
  background-color: var(--orange-base);
}

.p-page-recruit-career__career-item-title.-gray {
  max-width: 160px;
  background-color: var(--genki-logo);
}

/* タイトル下アイコン */
.p-page-recruit-career__career-item-img {
  margin-top: 24px;
  width: 64px;
}

.p-page-recruit-career__career-item-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  aspect-ratio: 64 / 64;
}

/* 施設数 */
.p-page-recruit-career__career-item-facility {
  margin-top: 8px;
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  color: var(--text-color);
}

/* 施設数内の数字部分 */
.p-page-recruit-career__career-item-number {
  padding-right: 4px;
  font-family: "Poppins", sans-serif;
  font-size: var(--font-size-lg);
  line-height: 1.015625;
  color: var(--text-color);
}

/* エリアタグ群 */
.p-page-recruit-career__career-item-area {
  margin-top: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

/* 園リスト（背景付き枠） */
.p-page-recruit-career__career-item-list {
  margin-top: 24px;
  padding: 8px;
  background-color: var(--background-color);
  border-radius: 10px;
}

/* リスト項目 */
.p-page-recruit-career__career-item-list li {
  font-size: var(--font-size-xs);
  line-height: var(--line-height-relaxed);
  display: flex;
  align-items: center;
  gap: 8px;
}

/* リスト項目前の丸アイコン */
.p-page-recruit-career__career-item-list li::before {
  content: "";
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background-color: var(--green-base);
}

.p-page-recruit-career__career-item-list.-orange li::before { background-color: var(--orange-base); }
.p-page-recruit-career__career-item-list.-gray li::before { background-color: var(--genki-logo); }

/* 下部ボタン */
.p-page-recruit-career__career-button {
  margin-top: 48px;
  text-align: center;
}

/* ==============================================================
    バナー
============================================================== */
.p-page-recruit-career__welfare {
  padding-block: 80px;
}

.p-page-recruit-career__welfare.page_bg-name::after {
  top: auto;
  bottom: 0;
  left: -80px;
}

.p-page-recruit-career__welfare .p-banner-recruit-intro__box {
  background-color: var(--background-color);
}

.p-page-recruit-career__welfare .p-banner-recruit-intro__text > div {
  margin-top: 32px;
}

.p-banner-recruit-intro__title:before {
  background-image: url("../img/banner-recruit-intro_recruit-career.jpg");
}


/* ---------------------------------
   レスポンシブ対応
---------------------------------- */
@media(max-width: 767px) {

  .page-recruit-career__heading,
  .page-recruit-career__section-title {
    font-size: var(--font-size-md);
  }
  .page-recruit-career__heading {
    padding-top: 0;
  }
  .p-heading__box-title{
    text-align: center;
  }
  .p-page-recruit-career__message { margin-top: 40px; } 

  .p-page-recruit-career__message-inner.container { max-width: 500px; }


  .p-page-recruit-career__message-item .p-point__content { 
    flex-direction: column; gap: 0;
   }
  .p-page-recruit-career__message-item .p-point__image { 
    width: 100%; flex-basis: auto; max-width: 100%;
   }
  .p-page-recruit-career__message-item .p-point__text {
     padding: 20px;
     }
  .p-page-recruit-career__message-item .p-point__text .p-point__title {
    font-size: var(--font-size-h3);
    margin-bottom: 16px;
  }
  .p-page-recruit-career__message-item.p-point .c-tag--rb {
     padding: 8px 16px;
     }
  .page-recruit-career__interview-flexbox {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 24px;
  }

  .page-recruit-career__interview-flexbox .p-card__staff {
    width: 70%;
  }


  /* ===== サポート（1列 / 幅100%） ===== */
  .page-recruit-career__support-grid {
    flex-direction: column;
    gap: 24px;
  }
  .p-card__support {
    width: 100%;
  }

  /* ===== よくある質問 ===== */
  .page-recruit-career__faq-box {
    padding: 32px 24px;
    border-radius: 24px;
  }
  .page-recruit-career__faq-title {
    font-size: var(--font-size-md);
    margin-bottom: 24px;
  }
  .page-recruit-career__question .faq-toggle {
    align-items: flex-start;
  }
  .page-recruit-career__question .faq-toggle::before {
    background-size: cover;
    width: 32px;
    height: 32px;
    transform: translateY(-2px);
  }
  .page-recruit-career__question .faq-toggle {
    font-size: var(--font-size-body);
  }
  .page-recruit-career__answer {
    font-size: var(--font-size-body);
  }

  .page-recruit-career__flow-box {
    padding: 40px 24px;
  }
  /* ===== 転職ステップ（1列＋下向き矢印） ===== */
   .page-recruit-career__flow-box ol{
   
    flex-direction: column;
    row-gap: 56px;             
    align-items: center;    
  }

  .page-recruit-career__flow-box li{
    width: min(100%, 230px);              
    position: relative;         
    margin: 0;                 
  }

  .page-recruit-career__flow-box li:not(:last-child)::after{
  
    right: auto;
    top: auto;
    left: 50%;
    bottom: -40px;              
    transform: translateX(-50%) rotate(90deg);
    width: var(--arrow-w, 22px);
    height: var(--arrow-w, 22px);
    background: url("../img/entry_flow.svg") no-repeat 50% 50%/contain;
    pointer-events: none;
  }

  .p-page-recruit-career__career-inner.container {
    max-width: 500px;
  }

  .p-page-recruit-career__career-list {
    grid-template-columns: repeat(1, 1fr);
  }

   .p-page-recruit-career__welfare__inner.content {
    margin-inline: auto;
    max-width: 550px;
  }
   .p-page-recruit-career__welfare .p-banner-recruit-intro__title {
    height: 180px;
  }
  .p-page-recruit-career__welfare .p-banner-recruit-intro__text {
    font-size: var(--font-size-body);
    padding: 20px 24px;
  }

  .p-card__support-title {
    font-size: var(--font-size-h3);
  }

  .page-recruit-career__section--faq {
    padding-block: 40px;
  }

  .page-recruit-career__answer + .page-recruit-career__question {
    margin-top: 24px;
  }


  .page-recruit-career__flow-title {
    font-size: var(--font-size-md);
  }
  .page-recruit-career__section--faq {
    margin-bottom: 40px;
  }
  .page-recruit-career__flow-lead {
    font-size: var(--font-size-body);
  }

}
