@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Noto+Serif+JP:wght@500;600;700&display=swap');
:root{font-family:'Noto Sans JP',sans-serif;color:#272723;background:#f4f0e7}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:300px}a{color:inherit}a:focus-visible{outline:3px solid #af5a36;outline-offset:4px}.skip{position:absolute;top:-100px;left:12px;padding:12px;background:#fff;z-index:10}.skip:focus{top:10px}.fiction{margin:0;padding:8px clamp(16px,3vw,56px);background:#2b2a25;color:#f8f3e8;font-size:10px;line-height:1.65}header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px clamp(20px,4vw,68px);background:#f4f0e7}.mark{display:flex;align-items:baseline;gap:7px;text-decoration:none;white-space:nowrap}.mark strong{font:700 27px 'Noto Serif JP',serif;letter-spacing:.06em}.mark span{font:600 16px 'Noto Serif JP',serif}.mark:before{content:'';display:inline-block;width:8px;height:31px;background:#a65034;margin-right:7px;transform:translateY(4px)}nav{display:flex;gap:clamp(15px,3vw,38px);flex-wrap:wrap}nav a{text-decoration:none;border-bottom:1px solid #726b5e;padding-bottom:4px;font-size:12px;font-weight:700}
.hero{position:relative;min-height:690px;background:#d1b997}.hero-image{height:690px;position:relative}.hero-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 45%}.image-label{position:absolute;top:24px;right:clamp(20px,4vw,68px);color:#fff;background:#26251fc7;padding:9px 12px;font-size:10px;letter-spacing:.17em;font-weight:700}.hero-card{position:absolute;bottom:-40px;left:clamp(20px,4vw,68px);width:min(560px,44vw);background:#f4f0e7;padding:32px clamp(25px,3vw,48px) 30px;box-shadow:12px 12px 0 #a65034}.hero-card>p{display:inline-block;margin:0 0 16px;border-bottom:2px solid #a65034;padding-bottom:7px;font-size:13px;font-weight:700}.hero h1,.detail h2,.note h2{font-family:'Noto Serif JP',serif;font-size:clamp(44px,4.4vw,70px);line-height:1.28;letter-spacing:-.05em;margin:0;font-weight:700}.hero-card>span{display:block;font-size:14px;line-height:1.9;margin:22px 0}.hero-card>a,.detail-copy>a,.note a{display:inline-flex;gap:30px;align-items:center;text-decoration:none;border-bottom:1px solid #3d3932;padding:10px 0;font-size:13px;font-weight:700}.hero-card>a b{font-size:20px;font-weight:400}
.detail{display:grid;grid-template-columns:minmax(260px,.75fr) minmax(0,1.25fr);gap:clamp(30px,5vw,85px);align-items:center;padding:150px clamp(20px,4vw,68px) 130px;background:#e4dbcd}.detail-copy>span,.note>span{font-size:11px;font-weight:700;letter-spacing:.16em;color:#91543d}.detail h2{margin-top:18px}.detail-copy p,.note p{font-size:15px;line-height:2.1;max-width:450px;margin:26px 0 18px}.detail figure{margin:0;min-width:0}.detail img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}.detail figcaption{text-align:right;font-size:10px;letter-spacing:.15em;margin-top:12px}.note{display:grid;grid-template-columns:1fr 2fr;gap:30px;padding:90px clamp(20px,4vw,68px);background:#f4f0e7}.note h2{margin:0}.note p{max-width:600px}footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;background:#292823;color:#f4f0e7;padding:28px clamp(20px,4vw,68px);font-size:11px}footer a{text-decoration:none}
@media(max-width:900px){.hero,.hero-image{min-height:0;height:570px}.hero-card{width:min(490px,55vw)}.detail{grid-template-columns:1fr;gap:35px}.detail figure{max-width:800px}.note{grid-template-columns:1fr}}
@media(max-width:650px){header{align-items:flex-start;flex-direction:column;padding:15px 20px}nav{gap:16px}.hero{min-height:0;background:#f4f0e7}.hero-image{height:auto}.hero-image img{height:auto;aspect-ratio:3/2;object-fit:cover}.image-label{top:12px;right:14px;font-size:9px}.hero-card{position:relative;bottom:auto;left:auto;width:auto;margin:-18px 16px 0;padding:25px 22px 26px;box-shadow:6px 6px 0 #a65034}.hero h1{font-size:clamp(39px,10vw,58px)}.hero-card>span{margin:16px 0}.detail{padding:80px 20px 75px}.detail h2,.note h2{font-size:clamp(38px,9vw,58px)}.detail-copy p,.note p{font-size:14px}.note{padding:70px 20px}footer{padding:24px 20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
