/* ============================================================
   ANZAS v2 — page-camp.css(/option/camp/ 短期集中キャンプ)
   出典: 下層カンプ「Camp」
   main.css / pages.css の共通部品を前提に、このページだけの装飾を足す。
   BP: 900 / 560(共通シャーシに合わせる)
   ============================================================ */

/* ---------- 01 特色 ─ 導入写真と概要 ---------- */

/* 現行サイトで h2「キャンプの特色」の直下に置かれている1枚。素材は 3:2(1000x667)。
   ボランティアページのヒーロー(21:9)より縦を残す ─ 人物が上下に広く写っているため。 */
.av2-camp-hero { margin: 40px 0 0; border-radius: 20px; overflow: hidden; aspect-ratio: 16 / 9; }
.av2-camp-hero img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; display: block; }

/* 概要の段落 ─ 本文幅(1060px)いっぱいだと1行が長すぎるため読み幅で止める。 */
.av2-camp-about { max-width: 760px; }

/* ---------- 01 特色 ─ カード列ではなく罫線区切りの一覧(カンプ準拠) ---------- */

.av2-camp-features .av2-steps { gap: 0; margin-top: 40px; }
.av2-camp-features .av2-step {
  border: 0;
  border-bottom: 1px solid var(--av2-line);
  border-radius: 0;
  grid-template-columns: 48px 1fr;
  gap: 24px;
  align-items: baseline;
  padding: 22px 4px;
}
.av2-camp-features .av2-step:last-child { border-bottom: 0; }
.av2-camp-features .av2-step__no { font-size: 32px; color: var(--av2-tint-border); }
.av2-camp-features .av2-step__title { font-size: 16px; }
.av2-camp-features .av2-step__text { font-size: 13.5px; line-height: 1.9; color: var(--av2-cap); margin-top: 4px; max-width: 760px; }
.av2-camp-features .av2-step__text b { color: var(--av2-ink); }

/* ---------- 01 特色 ─ 活動の記録(現行サイト本文末尾の4枚) ---------- */

.av2-camp-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 40px; }
.av2-camp-gallery__item { margin: 0; border-radius: 16px; overflow: hidden; aspect-ratio: 3 / 2; }
.av2-camp-gallery__item img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- 02 まなびシート ─ 左テキスト / 右写真 ---------- */

.av2-camp-manabi { gap: 56px; align-items: center; margin-top: 40px; }
.av2-camp-manabi b { color: var(--av2-ink); }
.av2-camp-manabi__img { aspect-ratio: 4 / 3; width: 100%; min-width: 0; }
.av2-camp-manabi__img img { width: 100%; height: 100%; object-fit: cover; border-radius: 16px; display: block; }

/* ---------- 団体ブロック ---------- */

.av2-camp-group { margin-top: 112px; border-width: 1.5px; padding: 32px 32px 28px; }
.av2-camp-group__row { display: flex; align-items: flex-start; gap: 32px; flex-wrap: wrap; margin-top: 14px; }
.av2-camp-group__body { flex: 1; min-width: 280px; }
.av2-camp-group .av2-pill { flex-shrink: 0; }

/* ---------- 相互リンク帯(実践プログラム3枚) ---------- */

.av2-camp-band { margin-top: 96px; border-width: 1.5px; padding: 26px 30px; }
.av2-camp-band__row { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 12px; }
.av2-camp-band__text { flex: 1; min-width: 260px; font-size: 13.5px; line-height: 1.9; }
.av2-camp-band__text b { color: var(--av2-ink); }
.av2-camp-band__links { display: flex; gap: 10px; flex-wrap: wrap; }

/* ---------- レスポンシブ ---------- */

@media (max-width: 900px) {
  .av2-camp-manabi { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 560px) {
  .av2-camp-hero { aspect-ratio: 16 / 10; margin-top: 32px; }
  .av2-camp-gallery { grid-template-columns: 1fr; gap: 14px; margin-top: 32px; }
  .av2-camp-features .av2-step { grid-template-columns: 40px 1fr; gap: 14px; padding: 18px 0; }
  .av2-camp-features .av2-step__no { font-size: 26px; }
  .av2-camp-group { margin-top: 80px; padding: 24px 20px; }
  .av2-camp-group .av2-pill { width: 100%; justify-content: space-between; box-sizing: border-box; }
  .av2-camp-band { margin-top: 72px; padding: 22px 18px; }
  .av2-camp-band__links { width: 100%; }
  .av2-camp-band__links .av2-pill { width: 100%; justify-content: space-between; box-sizing: border-box; }
}