/* -------------------------------------------------- */
/* 汎用 */
/* -------------------------------------------------- */

/* ページタイトル */
.page-title.raicho::before { aspect-ratio:252/225; background-image:url('../img/page/raicho/title-raicho.png'); height:42px; width:52px; }
.page-title.photo-gallery::before { aspect-ratio:107/75; background-image:url('../photo-gallery/img/title-icon.png'); height:auto; width:53px; }

/* 見出し */
.sub-title { align-items:center; color:var(--gr-2); font-size:18px; font-weight:800; justify-content:center; gap:10px; text-align:center; margin-bottom:40px; }
.sub-title img.left-img { height:auto; max-width:60px; }
.sub-title img.right-img { height:auto; max-width:75px; }
.year { color:var(--gr-2); font-size:24px; font-weight:700; margin-bottom:24px; }

/* ライチョウ情報 */
.raicho-box { margin-bottom:120px; }
.raicho-box.last-box { margin-bottom:0; }
.raicho-info { margin-bottom:16px; }
.raicho-info, .raicho-info .raicho-item { gap:8px; }
.raicho-info .raicho-item { justify-content:flex-start; }
.raicho-info .raicho-item dt { background-color:var(--gr-3); color:var(--wh); flex-shrink:0; text-align:center; width:75px; }
.raicho-info .raicho-item dd { flex:1; min-width:0; word-break:break-word; }
.raicho-text { margin-bottom:24px; }
.raicho-ph { flex-wrap:wrap; gap:32px; }
.raicho-ph li { aspect-ratio:3/2; height:auto; width:100%; }
.raicho-ph li img { border:2px solid transparent; box-sizing:border-box; cursor:pointer; object-fit:cover; object-position:center; opacity:1; transition:.3s; height:100%; width:100%; }
.raicho-ph li img:hover { border:2px solid var(--gr-3); opacity:0.7; transition:.3s; }
/* ライチョウ情報 */
.raicho-ph li.large { aspect-ratio:auto; }
.raicho-ph li.large img { height:auto; }

/* モーダル用ライトボックス */
.modal { align-items:center; background-color:rgba(0,0,0,0.75); display:none; justify-content:center; inset:0; position:fixed; z-index:9999; padding:16px; }
.modal-bg { inset:0; position:absolute; }
.modal-body { display:flex; flex-direction:column; gap:8px; position:relative; max-height:90%; max-width:90%; }
.modal-img { background-color:var(--wh); box-shadow:1px 1px 2px var(--bk); object-fit:contain; padding:8px; min-height:0; max-height:100%; max-width:100%; }
.modal-caption { background-color:rgba(0,0,0,0.6); box-sizing:border-box; color:var(--wh); font-size:14px; line-height:1.6; overflow-y:auto; padding:8px 12px; text-align:justify; white-space:pre-line; flex-shrink:0; max-height:30%; }
.modal-caption:empty { display:none; }

/* モーダル内メディア */
.modal-img, .modal-video { background-color:var(--wh); box-shadow:1px 1px 2px var(--bk); object-fit:contain; padding:8px; min-height:0; max-height:100%; max-width:100%; }
.modal-video { aspect-ratio:16/9; background-color:#000; height:auto; width:90cqw; }

/* 動画サムネイル */
.raicho-ph li { position:relative; }
.raicho-ph li:has(img[data-video])::after { align-items:center; border:2px solid var(--wh); border-radius:50%; box-sizing:border-box; color:var(--wh); content:'▶'; display:flex; font-size:18px; justify-content:center; padding-left:4px; pointer-events:none; position:absolute; transform:translate(-50%,-50%); top:50%; left:50%; height:48px; width:48px; }

/* 過去のらいちょう情報 */
.archive.sp-only { margin-bottom:40px; }
.archive.pc-only { display:none; }

@container( min-width:1000px ) {

/* ページタイトル */
.page-title.raicho { justify-content:flex-start; }
.page-title.raicho::before { height:112px; width:126px; }
.page-title.photo-gallery::before { width:107px; }

/* 見出し */
.sub-title { font-size:30px; justify-content:center; gap:45px; }
.sub-title br { display:none; }
.sub-title img.left-img { max-width:100px; }
.sub-title img.right-img { max-width:135px; }

/* ライチョウ情報 */
.raicho-ph { display:grid; grid-template-columns:repeat(3, 1fr); gap:46px;  }
.raicho-ph.gallery { display:block; width:100%; }
.raicho-ph li.large { grid-column:1 / -1; }

/* モーダル用ライトボックス */
.modal-caption { font-size:16px; padding:12px 16px; }

/* モーダル内メディア */
.modal-video { width:min(80cqw, 960px); }

/* 過去のらいちょう情報 */
.archive.sp-only { display:none; }
.archive.pc-only { display:block; }

/* アーカイブのあるタイトル */
.title-archive .archive.pc-only { display:flex; flex:0 0 auto; gap:20px; }

}