/* =========================================
   キャリア採用 一覧ページ専用 CSS（.subpage スコープ）
   既存の色・フォント・装飾は変更しない。レイアウトと余白のみ調整。
   ========================================= */

/* 見出しの上下余白（色・フォントは既存に任せる） */
.headline-block.green,
.headline-block.green-gp {
  margin: 2rem 0 1rem;
}


/* 案内文：「現在募集中の会社のみ表示しています。」 */
.wantedTxt {
  display: block;
  text-align: center;
  line-height: 1.4;
  color: #003b80;
  font-size: 21px;
  font-weight: 500;
  margin: 0 0 1rem;
}

/* =========================================
   一覧の整列（このページだけ適用）
   ========================================= */
.subpage .recruitlist ul {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.2rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* カードの基本レイアウト（縦積みでボタンを下へ） */
.subpage .recruitlist ul > li {
  border-radius: 8px;         /* 角丸は既存デザインに合わせて */
  padding: 1rem;              /* 左余白はPCの本体会社のみ後で詰める */
  display: flex;
  flex-direction: column;
}



/* ===== テキスト領域（左寄せ＆余白最適化） ===== */
.subpage .recruitlist ul li .txtarea {
  padding-right: 10px;                /* 既存の 30px から縮小 */
  margin-bottom: 8px;
  flex: 1 1 auto;                     /* 本文が伸縮し、ボタンが下に寄る */
}

/* 段落の余白は控えめに */
.subpage .recruitlist .dept   { margin: 0 0 .4rem; }
.subpage .recruitlist .caption{ margin: 0; line-height: 1.6; }

/* ボタン領域（装飾は既存に任せる） */
.subpage .recruitlist .btnarea { margin-top: 1rem; }
.blockBtn-green {
  width: 100%;

/* ボタンの幅だけ100%（既存装飾は維持） */
.blockBtn-green {
  /* display: inline-block; ←既存が block なら不要 */
  width: 100%;
  text-align: center;
}




/* =========================================
   グループ会社セクションだけ適用（本体 .green には影響させない）
   ========================================= */

/* リスト：1社でも中央寄せ・横伸び防止（既存のdisplay指定に勝つため最小限の !important） */
.subpage .headline-block.green-gp ~ .recruitlist ul {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.2rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* カード幅を固定（横いっぱいに伸びない） */
.subpage .headline-block.green-gp ~ .recruitlist ul > li {
  flex: 0 0 320px !important;     /* ← 300〜340pxで調整可能 */
  max-width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  padding: 1rem;
}

/* テキスト領域の適正化 */
.subpage .headline-block.green-gp ~ .recruitlist ul li .txtarea {
  padding-right: 10px;
  margin-bottom: 8px;
  flex: 1 1 auto;
}

/* 段落の余白控えめ */
.subpage .headline-block.green-gp ~ .recruitlist .dept   { margin: 0 0 .4rem; }
.subpage .headline-block.green-gp ~ .recruitlist .caption{ margin: 0; line-height: 1.6; }

/* カード内の緑ボタンは幅100%（青い「グループ会社一覧」には影響しない） */
.subpage .headline-block.green-gp ~ .recruitlist ul > li .blockBtn-green {
  width: 100%;
  text-align: center;
}

/* テーブルが幅を押し広げないように（念のため） */
.subpage .headline-block.green-gp ~ .recruitlist .txtarea table { width: auto; border-collapse: collapse; }
.subpage .headline-block.green-gp ~ .recruitlist .txtarea td    { border: none; padding: 0; }

/* スマホは1列全幅 */
@media (max-width: 480px) {
  .subpage .headline-block.green-gp ~ .recruitlist ul > li { flex: 1 1 100%; }
}