/* フィールドワーク開催レポート(写真は1枚ならそのまま、複数なら横スライダー) 板羽 2026-10-09 */
.rp { color: #1a2332; letter-spacing: .04em; padding: 0 0 96px; }
.rp-hero { width: min(1120px, calc(100% - 48px)); margin: 28px auto 0 !important; border-radius: 12px; overflow: hidden; background: #eef1f4; }
.rp-hero img { display: block; width: 100%; height: clamp(240px, 46vw, 560px); object-fit: cover; object-position: center 62%; }
.rp-head, .rp-sec > p, .rp-sec > h2 { width: min(760px, calc(100% - 48px)); margin-left: auto !important; margin-right: auto !important; }
.rp-head { padding: 48px 0 0; }
.rp-head__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0 0 20px !important; font-size: 12px !important; color: #8a93a2; letter-spacing: .08em; }
.rp-head__meta a, .rp-head__meta a:link, .rp-head__meta a:visited { padding: 4px 12px; border: 1px solid #cfd8d2; border-radius: 999px; color: #2f6a45; font-weight: 700; text-decoration: none; }
.rp-head__title { margin: 0 0 14px !important; font-size: clamp(27px, calc(18px + 2.2vw), 40px) !important; font-weight: 700 !important; line-height: 1.55; letter-spacing: .06em; }
.rp-head__sub { margin: 0 !important; font-size: 15px !important; color: #5a6472; letter-spacing: .08em; }
.rp-br { display: none; }
.rp-sec { margin: 0; }
.rp-sec--lead { margin-top: 40px; }
.rp-sec > p { margin-top: 0 !important; margin-bottom: 1.5em !important; font-size: 15.5px !important; line-height: 2.15; color: #2f3a45; }
.rp-sec > h2 { margin-top: 76px !important; margin-bottom: 26px !important; padding: 30px 0 0; border-top: 1px solid #e5e8ec; font-size: clamp(20px, calc(16px + 1vw), 25px) !important; font-weight: 700 !important; line-height: 1.7; letter-spacing: .06em; }

/* 1枚の写真 */
.rp-fig { width: min(880px, calc(100% - 48px)); margin: 36px auto 40px !important; }
.rp-fig--wide { width: min(1120px, calc(100% - 48px)); margin-top: 48px !important; }
.rp-fig img { display: block; width: 100%; height: auto; border-radius: 6px; background: #eef1f4; }
.rp-fig figcaption { margin: 10px 0 0; font-size: 12px; line-height: 1.8; color: #8a93a2; }

/* 複数の写真: 横スライダー(JSが無くても横スクロールで全部見られる) */
.rp-gal { width: min(1040px, calc(100% - 48px)); margin: 36px auto 40px; }
.rp-gal__track { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; overscroll-behavior-x: contain; border-radius: 6px; }
.rp-gal__track::-webkit-scrollbar { display: none; }
.rp-gal__item { flex: 0 0 68%; margin: 0 !important; scroll-snap-align: start; }
.rp-gal__item img { display: block; width: 100%; aspect-ratio: 3 / 2; height: auto; object-fit: cover; border-radius: 6px; background: #eef1f4; }
.rp-gal__ctrl { display: flex; align-items: center; justify-content: space-between; margin: 14px 0 0; }
.rp-gal__ctrl[hidden] { display: none; }
.rp-gal__count { font-size: 12px; color: #8a93a2; letter-spacing: .12em; font-variant-numeric: tabular-nums; }
.rp-gal__count b { font-weight: 700; color: #1a2332; }
.rp-gal__btns { display: flex; gap: 8px; }
.rp-gal__btn { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 1px solid #d5dbe2; border-radius: 50%; background: #fff; color: #1a2332; cursor: pointer; transition: background-color .2s ease, border-color .2s ease, opacity .2s ease !important; }
.rp-gal__btn svg { width: 18px; height: 18px; }
.rp-gal__btn:hover { background: #1a2332; border-color: #1a2332; color: #fff; }
.rp-gal__btn:disabled { opacity: .3; cursor: default; background: #fff; border-color: #d5dbe2; color: #1a2332; }

.rp-foot { display: flex; flex-direction: column; align-items: center; gap: 18px; margin: 72px auto 0; width: min(760px, calc(100% - 48px)); padding: 44px 0 0; border-top: 1px solid #e5e8ec; }
a.rp-foot__btn, a.rp-foot__btn:link, a.rp-foot__btn:visited { display: inline-block; min-width: 300px; padding: 17px 36px; border-radius: 999px; background: #1a2332; color: #fff !important; font-size: 15px; font-weight: 700; letter-spacing: .08em; text-align: center; text-decoration: none; }
a.rp-foot__btn:hover { background: #2a6bd2; }
a.rp-foot__link { font-size: 13px; color: #5a6472; text-decoration: underline; }

@media (max-width: 767px) {
    .rp { padding-bottom: 72px; }
    .rp-hero { width: calc(100% - 32px); margin-top: 16px !important; border-radius: 10px; }
    .rp-head, .rp-sec > p, .rp-sec > h2, .rp-foot { width: calc(100% - 40px); }
    .rp-head { padding-top: 32px; }
    .rp-br { display: inline; }
    .rp-sec > p { font-size: 15px !important; line-height: 2.05; }
    .rp-sec > h2 { margin-top: 56px !important; padding-top: 26px; }
    .rp-fig, .rp-fig--wide { width: calc(100% - 40px); margin: 28px auto 32px !important; }
    /* スマホは右端まで写真を流し、次の1枚を少し見せる */
    .rp-gal { width: 100%; margin: 28px 0 32px; }
    .rp-gal__track { gap: 10px; padding: 0 20px; scroll-padding-left: 20px; border-radius: 0; }
    .rp-gal__item { flex-basis: 84%; }
    .rp-gal__ctrl { padding: 0 20px; }
    a.rp-foot__btn, a.rp-foot__btn:link, a.rp-foot__btn:visited { min-width: 0; width: 100%; }
}

/* タイトルをメイン画像の上に置き、メイン画像は縦に大きく見せる 板羽 2026-10-09 */
.rp-head { width: min(1120px, calc(100% - 48px)); padding: 64px 0 40px; }
.rp-head__meta { margin: 0 0 26px !important; }
.rp-head__title { margin: 0 0 22px !important; font-size: clamp(30px, calc(14px + 3.3vw), 54px) !important; line-height: 1.42; letter-spacing: .05em; }
.rp-head__sub { display: flex; align-items: center; gap: 16px; font-size: 15px !important; font-weight: 500; color: #3f4a58; letter-spacing: .12em; }
.rp-head__sub::before { content: ""; flex: 0 0 40px; height: 1px; background: #1a2332; }
.rp-hero { margin: 0 auto !important; }
.rp-hero img { height: auto; aspect-ratio: 3 / 2; max-height: 760px; object-position: center 55%; }
.rp-sec--lead { margin-top: 64px; }
@media (max-width: 767px) {
    .rp-head { width: calc(100% - 40px); padding: 36px 0 26px; }
    .rp-head__meta { margin: 0 0 18px !important; }
    .rp-head__title { margin: 0 0 16px !important; font-size: clamp(26px, 7.4vw, 32px) !important; line-height: 1.5; }
    .rp-head__sub { gap: 12px; font-size: 13px !important; letter-spacing: .08em; }
    .rp-head__sub::before { flex-basis: 24px; }
    .rp-hero { width: calc(100% - 32px); margin: 0 auto !important; }
    .rp-hero img { aspect-ratio: 4 / 5; object-position: center 50%; }
    .rp-sec--lead { margin-top: 40px; }
}

/* 写真スライダーは1枚の写真と同じ横幅に揃える 板羽 2026-10-09 */
.rp-gal { width: min(880px, calc(100% - 48px)); }
.rp-gal__item { flex-basis: 72%; }

/* 写真の拡大表示(ライトボックス)。写真にマウスを載せると拡大の合図が出て、押すと大きく開く */
.rp-gal__item img, .rp-fig img { cursor: zoom-in; transition: filter .25s ease !important; }
.rp-gal__item img:hover, .rp-fig img:hover { filter: brightness(1.06); }
.rp-lb { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; background: rgba(12, 14, 18, .94); opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease !important; }
.rp-lb.is-open { opacity: 1; visibility: visible; }
.rp-lb__img { display: block; max-width: min(1400px, calc(100vw - 160px)); max-height: calc(100vh - 120px); width: auto; height: auto; border-radius: 4px; box-shadow: 0 20px 60px rgba(0, 0, 0, .5); }
.rp-lb__btn { position: absolute; display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 1px solid rgba(255, 255, 255, .35); border-radius: 50%; background: rgba(255, 255, 255, .06); color: #fff; cursor: pointer; transition: background-color .2s ease !important; }
.rp-lb__btn:hover { background: rgba(255, 255, 255, .22); }
.rp-lb__btn svg { width: 20px; height: 20px; }
.rp-lb__btn[hidden] { display: none; }
.rp-lb__close { top: 20px; right: 20px; }
.rp-lb__prev { left: 20px; top: 50%; transform: translateY(-50%); }
.rp-lb__next { right: 20px; top: 50%; transform: translateY(-50%); }
.rp-lb__count { position: absolute; left: 0; right: 0; bottom: 22px; text-align: center; font-size: 12px; color: rgba(255, 255, 255, .75); letter-spacing: .14em; font-variant-numeric: tabular-nums; }
.rp-lb__count[hidden] { display: none; }
body.rp-lb-open { overflow: hidden; }

/* 募集中のフィールドワーク(ページ下部) */
.rp-fw { width: min(1120px, calc(100% - 48px)); margin: 88px auto 0; padding: 44px 0 0; border-top: 1px solid #e5e8ec; }
.rp-fw__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 0 0 26px; }
.rp-fw__title { margin: 0 !important; font-size: clamp(20px, calc(16px + 1vw), 25px) !important; font-weight: 700 !important; letter-spacing: .06em; line-height: 1.6; }
a.rp-fw__all, a.rp-fw__all:link, a.rp-fw__all:visited { font-size: 13.5px; font-weight: 700; color: #2a6bd2; text-decoration: none; }
a.rp-fw__all:hover { text-decoration: underline; }
.rp-fwm { margin: 0 !important; padding: 0 !important; overflow: visible; }
.rp-foot { margin-top: 56px; padding-top: 0; border-top: 0; }
@media (max-width: 767px) {
    .rp-gal { width: 100%; }
    .rp-gal__item { flex-basis: 84%; }
    .rp-lb__img { max-width: 100vw; max-height: calc(100vh - 150px); border-radius: 0; }
    .rp-lb__btn { width: 42px; height: 42px; }
    .rp-lb__close { top: 12px; right: 12px; }
    .rp-lb__prev { left: 12px; top: auto; bottom: 14px; transform: none; }
    .rp-lb__next { right: 12px; top: auto; bottom: 14px; transform: none; }
    .rp-fw { width: calc(100% - 40px); margin-top: 64px; padding-top: 36px; }
    .rp-foot { margin-top: 44px; }
}

/* メイン画像を一番上、その下にタイトル・日付(吉田さん指定 2026-10-09) */
.rp-hero { margin: 28px auto 0 !important; }
.rp-head { padding: 52px 0 0; }
.rp-sec--lead { margin-top: 44px; }
@media (max-width: 767px) {
    .rp-hero { margin: 16px auto 0 !important; }
    .rp-head { padding: 30px 0 0; }
    .rp-sec--lead { margin-top: 30px; }
}

/* メイン画像の高さを少し抑え、タイトルは中央寄せで文字を小さく(吉田さん指定 2026-10-09) */
.rp-hero img { aspect-ratio: 16 / 9; max-height: 620px; object-position: center 58%; }
.rp-head { width: min(880px, calc(100% - 48px)); padding: 48px 0 0; text-align: center; }
.rp-head__meta { justify-content: center; margin: 0 0 20px !important; }
.rp-head__title { margin: 0 0 18px !important; font-size: clamp(25px, calc(15px + 1.8vw), 38px) !important; line-height: 1.55; letter-spacing: .06em; }
.rp-head__sub { justify-content: center; font-size: 14px !important; }
.rp-head__sub::before, .rp-head__sub::after { content: ""; flex: 0 0 32px; height: 1px; background: #1a2332; }
@media (max-width: 767px) {
    .rp-hero img { aspect-ratio: 4 / 3; object-position: center 55%; }
    .rp-head { width: calc(100% - 40px); padding: 28px 0 0; }
    .rp-head__title { font-size: clamp(22px, 6.2vw, 27px) !important; }
    .rp-head__sub { font-size: 12.5px !important; }
    .rp-head__sub::before, .rp-head__sub::after { flex-basis: 20px; }
}

/* スマホ幅の見出しの行間(吉田さん指定 2026-10-09)。このCSSは開催レポートのページだけで読み込む */
@media screen and (max-width: 480px) {
    h2 {
        line-height: 1.6 !important;
    }
}