@charset "utf-8";
/* ストーリーページ専用（2026-08-30 html/story.html の <head> インラインから外部化） */
#arasuji-header {font-weight:800;font-size:200%; color:red; letter-spacing:-1px;}
#arasuji-header span{white-space: nowrap}
.storySec-01 b{font-weight:800; color:#A02;}
.storySec-01 p.catch {display:inline-block;font-weight:800; font-size:200%; border-bottom:6px double #333; margin-bottom:20px;}
.storySec-01 #cast p {line-height:1.8; margin:0;}
#cast {margin-top:3em;}
.staff {margin-top:25px;}
.staff h3 { font-size:100%; background:#f5f5f5; color:#111; padding:.25rem .75rem; display:inline-block;width:15.3%; text-align:center; font-weight:normal;}
.staff dl {display:flex; flex-wrap:wrap; align-content:center; font-size:85%; margin-top:5px; font-weight:normal;}
.staff dt {flex-basis:16%; width:16%; margin:0; background:#f5f5f5; padding:.5rem 1%; margin-bottom:3px; margin-right:3px; display: grid;place-content: center;}
.staff dd {flex-basis:calc(80% - 3px); width:calc(80% - 3px); margin:0; background:#f5f5f5; padding:.5rem 1%; margin-bottom:3px;}
.flex {display:flex; justify-content:space-between;}
.flex img {width:calc(100% / 3 - 8px);}
@media screen and (max-width: 490px) {
#arasuji-header {font-size:140%; letter-spacing:0;}
.flex {display:block;}
.flex img {width:100%;}
}

/* 見出し画像の下余白（2026-08-30 ユーザー指定）。SP は汎用 #mainLeft h2 で既に .5em のため PC が揃う */
h2.catch { margin-bottom: .5em; }
