/* 三日「十の景色」の作り方をリメイクに持ち込む共通デザイン（2026-09-24 OWNER基準：mikkaweb.com/works/ten-scenes/）
   明朝の大見出し／英字の小さな章番号「01 / …」／全面の高画質写真／横スワイプ／少ない言葉／細い線
   色は各サイトで --bg --fg --ac --sub --line を決める */
:root{--serif:'Noto Serif JP','Yu Mincho',serif;--latin:'Cormorant Garamond',Georgia,serif;--sans:Manrope,'Hiragino Kaku Gothic ProN','Zen Kaku Gothic New',sans-serif}
body{background:var(--bg)!important;color:var(--fg)!important;font-family:var(--sans)!important;letter-spacing:.04em;line-height:2}
a{color:inherit}
.mihon{background:#000!important}
/* ヘッダー：透明→スクロールで帯に */
.hd{background:transparent!important;border:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;position:fixed!important;left:0;right:0;top:auto}
.hd.sc{background:color-mix(in srgb,var(--bg) 88%,transparent)!important;backdrop-filter:blur(12px)!important;box-shadow:none!important;border-bottom:1px solid var(--line)!important}
.menu-btn{background:transparent!important;border:1px solid currentColor!important;color:var(--fg)}
.menu-btn i{background:currentColor!important}
.drawer{background:var(--bg)!important;color:var(--fg)!important}.drawer a{color:var(--fg)!important;font-family:var(--serif);font-weight:500;border-color:var(--line)!important}
/* 全面の見出し写真 */
.sc-hero{position:relative;height:100svh;min-height:620px;overflow:hidden;color:#fff;background:#111}
.sc-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.08);animation:scZoom 14s ease-out forwards}
@keyframes scZoom{to{transform:scale(1)}}
.sc-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.38) 0%,rgba(0,0,0,.05) 35%,rgba(0,0,0,.55) 100%)}
.sc-hero-in{position:absolute;z-index:2;left:24px;right:24px;bottom:96px}
.sc-kicker{font-family:var(--sans);font-size:11px;letter-spacing:.24em;text-transform:uppercase;opacity:.85;margin:0 0 18px}
.sc-title{font-family:var(--serif);font-weight:500;font-size:clamp(34px,10.4vw,112px);line-height:1.35;letter-spacing:.05em;margin:0;word-break:keep-all}
.sc-title span{display:block;overflow:hidden}.sc-title i{display:block;font-style:normal;transform:translateY(105%);animation:scRise 1.4s cubic-bezier(.2,.7,.1,1) forwards}
.sc-title span:nth-child(2) i{animation-delay:.2s}
@keyframes scRise{to{transform:none}}
.sc-desc{margin:22px 0 0;font-size:14px;line-height:2.1;letter-spacing:.1em;opacity:0;animation:scFade 1.2s .9s forwards;white-space:pre-line}
@keyframes scFade{to{opacity:.92}}
.sc-side{position:absolute;z-index:2;right:18px;top:120px;writing-mode:vertical-rl;font-size:11px;letter-spacing:.3em;opacity:.8}
.sc-bottom{position:absolute;z-index:2;left:24px;right:24px;bottom:28px;display:flex;justify-content:space-between;font-size:11px;letter-spacing:.2em;opacity:.85}
/* 章 */
.sc-ch{padding:110px 24px 0;max-width:1080px;margin:0 auto}
.sc-no{font-family:var(--sans);font-size:14px;letter-spacing:.22em;color:var(--ac);margin:0 0 22px;text-transform:uppercase}
.sc-h{font-family:var(--serif);font-weight:500;font-size:clamp(26px,7.4vw,52px);line-height:1.6;letter-spacing:.1em;margin:0 0 30px;white-space:pre-line}
.sc-p{font-size:15px;line-height:2.2;color:var(--sub);margin:0 0 18px;max-width:40em}
/* 全面の写真・額の写真 */
.sc-full{margin:110px 0 0;height:78svh;min-height:420px;position:relative;overflow:hidden}
.sc-full img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);transition:transform 1.6s cubic-bezier(.2,.7,.1,1)}
.sc-full.on img{transform:scale(1)}
.sc-cap{font-size:11px;letter-spacing:.18em;color:var(--sub);margin:12px 24px 0;text-transform:uppercase}
.sc-frame{margin:0;position:relative}
.sc-frame img{display:block;width:100%;height:auto}
/* 横スワイプ */
.sc-swipe{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 24px 18px;margin:40px -24px 0;scrollbar-width:none}
.sc-swipe::-webkit-scrollbar{display:none}
.sc-swipe figure{flex:0 0 78%;scroll-snap-align:center;margin:0}
.sc-swipe img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.sc-swipe figcaption{font-size:12px;letter-spacing:.14em;color:var(--sub);margin-top:10px}
.sc-hint{text-align:right;font-size:11px;letter-spacing:.2em;color:var(--sub)}
/* 一覧（線で区切る） */
.sc-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.sc-list li{display:grid;grid-template-columns:44px 1fr;gap:6px 14px;padding:22px 0;border-bottom:1px solid var(--line);align-items:baseline}
.sc-list b{font-family:var(--latin);font-weight:500;font-size:22px;color:var(--ac)}
.sc-list .t{font-family:var(--serif);font-size:18px;letter-spacing:.08em;line-height:1.7}
.sc-list .d{grid-column:2;font-size:13px;color:var(--sub);line-height:1.9}
/* ボタン */
.sc-btn{display:inline-flex;align-items:center;gap:14px;border:1px solid currentColor;padding:16px 26px;font-size:14px;letter-spacing:.14em;text-decoration:none;transition:background .3s,color .3s}
.sc-btn::after{content:"";width:22px;height:1px;background:currentColor;transition:width .3s}
.sc-btn:hover::after{width:34px}
.sc-btn.fill{background:var(--ac);border-color:var(--ac);color:#fff}
.sc-tel{font-family:var(--latin);font-size:clamp(40px,11vw,72px);font-weight:500;letter-spacing:.04em;text-decoration:none;display:block;line-height:1.1;margin:10px 0}
/* 下層ページ・本文 */
.wrap{padding-top:120px!important}
.prose{font-size:15px;line-height:2.1}
.prose h1,.prose h2,.prose h3,.prose h4{font-family:var(--serif)!important;font-weight:500!important;letter-spacing:.08em;border-color:var(--line)!important;color:var(--fg)!important}
.prose h1::after,.prose h2::after,.prose h3::after,.prose h4::after{background:var(--ac)!important}
.prose img{box-shadow:none!important;border-radius:0!important}
.prose table{background:transparent!important;box-shadow:none!important;border-top:1px solid var(--line)}
.prose th{background:transparent!important;color:var(--ac)!important;font-weight:500}
.prose td,.prose th{border-color:var(--line)!important}
.go a{background:transparent!important;border:1px solid currentColor;border-radius:0!important;color:var(--fg)!important;letter-spacing:.12em}
.go a:hover{background:var(--ac)!important;border-color:var(--ac);color:#fff!important}
.ft{background:var(--bg)!important;color:var(--sub)!important;border-top:1px solid var(--line)}
.ft a{color:var(--fg)!important}
.fix a{border-radius:999px!important}
.fix .t{background:var(--ac)!important}.fix .m{background:var(--fg)!important;color:var(--bg)!important}
.rv{transform:translateY(40px)!important;transition:opacity 1.2s cubic-bezier(.2,.7,.1,1),transform 1.2s cubic-bezier(.2,.7,.1,1)!important}.rv.on{transform:none!important}
@media(min-width:900px){.sc-hero-in{left:8vw;bottom:14vh}.sc-ch{padding-top:160px}.sc-swipe figure{flex-basis:32%}.sc-swipe{margin:40px 0 0;padding:0 0 18px}}
@media (prefers-reduced-motion:reduce){.sc-hero img,.sc-title i,.sc-desc{animation:none!important;transform:none!important;opacity:1!important}.sc-full img{transform:none!important}}
a[href="/en/"],a[href="/zh/"],a[href="/th/"]{display:inline-block;min-width:44px;min-height:44px;line-height:44px;text-align:center}