@font-face{font-family:Avenir;src:url("assets/fonts/avenir-roman.otf") format("opentype");font-weight:400;font-display:swap}
:root{--paper:#f7f1e8;--ink:#333;--muted:#666;--content:327px}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--paper);scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:"fot-tsukuardgothic-std","Hiragino Maru Gothic ProN","Yu Gothic",sans-serif;font-weight:700;font-feature-settings:"palt" 1;font-kerning:normal;background:var(--paper)}
button{font:inherit;color:inherit}
.latin{font-family:Avenir,sans-serif;font-weight:400}
.museum{width:100%;min-height:100svh;margin-inline:auto;background:var(--paper)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.ornament{display:flex;align-items:center;width:var(--content);max-width:100%;margin-inline:auto;height:28px;background:url("assets/images/ornament-20260919.png") center/100% 28px no-repeat}
.ornament i,.ornament span{opacity:0}

.intro{--intro-viewport:100svh;--intro-gap:clamp(12px,calc((var(--intro-viewport) - 580px)*.12),32px);--intro-avatar-height:clamp(130px,calc(var(--intro-viewport)*.24),206px);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:var(--intro-viewport);padding:max(12px,env(safe-area-inset-top)) 24px max(20px,env(safe-area-inset-bottom));cursor:pointer;opacity:1;transition:opacity .65s ease}
.intro.is-leaving{opacity:0;pointer-events:none}
.intro__inner{display:flex;flex-direction:column;align-items:center;width:100%;max-width:327px}
.intro h1{margin:var(--intro-gap) 0;text-align:center;font-size:clamp(28px,4.1svh,33px);line-height:clamp(34px,5.5svh,45px);letter-spacing:.1em;font-weight:700}
.intro h1 span{display:block}
.intro p{margin:0;text-align:center;font-size:clamp(18px,2.5svh,20px);line-height:clamp(26px,4.5svh,36px);letter-spacing:.05em}
.intro__line{display:block;opacity:0;transform:translateY(5px);transition:opacity .4s ease,transform .4s ease}
.intro__line.is-visible{opacity:1;transform:none}
.intro__avatar{position:relative;display:flex;justify-content:center;width:100%;height:var(--intro-avatar-height);margin-top:var(--intro-gap)}
.intro__bust{display:block;width:auto;max-width:100%;height:100%;aspect-ratio:720/648;object-fit:contain;object-position:center bottom}
.ornament--bottom{position:absolute;bottom:-15px;left:50%;transform:translateX(-50%);z-index:1}
/* 中央は罫線だけを残し、画像の紙色で石膏像の下部を覆わない。 */
.ornament--bottom,.guide__ornament{clip-path:polygon(0 0,14% 0,14% 43%,86% 43%,86% 0,100% 0,100% 100%,86% 100%,86% 50%,14% 50%,14% 100%,0 100%)}
.intro__enter{border:0;background:none;width:100%;max-width:327px;padding:0;margin-top:clamp(20px,var(--intro-gap),40px);color:var(--muted);font-size:16px;line-height:24px;letter-spacing:0;font-weight:700;flex-shrink:0}
.intro__enter.is-ready{animation:blink 2.8s ease-in-out 1}
@keyframes blink{0%,100%{opacity:1}45%{opacity:0}70%{opacity:1}}
.gallery{animation:reveal .85s ease both}
@keyframes reveal{from{opacity:0}to{opacity:1}}
.artwork__view{display:flex;flex-direction:column;align-items:center;min-height:100svh;padding:14px 24px 32px}
.artwork__view>.ornament{margin-bottom:0;flex-shrink:0;background-image:url("assets/images/ornament-20260919.png")}
.artwork__number{margin:clamp(16px,3svh,24px) 0;text-align:center;font-size:15px;line-height:20px;font-weight:700;flex-shrink:0}
.artwork__visual{width:calc(100% + 48px);max-width:none;flex-shrink:0}
.art-image{--ratio:1400/937;--crop:1;display:block;position:relative;aspect-ratio:var(--ratio);overflow:hidden}
.art-image img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(var(--crop))}
.art-image--cezanne{--ratio:327/259;--crop:1.027}
.art-image--gauguin{--ratio:1101/1400;--crop:1.025}
.guide{height:300px;width:100%;flex-shrink:0;position:relative;display:flex;justify-content:center;align-items:flex-end;margin-top:10px}
.guide__bubble{position:absolute;top:21px;left:50%;display:flex;flex-direction:column;align-items:center;transform:translateX(-50%);width:234px;height:144px;padding:11px 0 0;background:transparent url("assets/images/bubble-q1.png") center/100% 100% no-repeat;text-align:center;font-size:15px;line-height:22px;letter-spacing:.025em;transition:opacity .9s ease,transform .9s ease}
.guide__bubble--q2{top:40px;width:193px;height:115px;padding-top:13px;background-image:url("assets/images/bubble-q2.png")}
.guide__bubble--q3{top:41px;width:175px;height:111px;padding-top:12px;background-image:url("assets/images/bubble-q3.png")}
.guide__bubble.is-changing{opacity:0;transform:translateX(-50%) translateY(5px)}
.guide__bubble b{display:block;font-family:Avenir,sans-serif;font-weight:400;font-size:12px;line-height:16px;letter-spacing:.08em}
.guide__bust{width:156px;height:auto;aspect-ratio:700/619;object-fit:contain;object-position:center bottom;display:block;flex-shrink:0}
.guide__ornament{position:absolute;left:50%;bottom:-15px;transform:translateX(-50%);z-index:1}
.artwork__lead{text-align:center;margin:0;padding-top:48px;margin-top:auto;font-size:18px;line-height:24px;color:#4d4d4d}
.artwork__meta,.section{width:var(--content);max-width:calc(100% - 48px);margin-inline:auto}
.artwork__meta{font-size:13px;margin-bottom:40px}
.meta__artist{font-size:12px;line-height:26px;margin-bottom:2px}
.meta__artist strong{font-size:16px;font-weight:700}
.meta__title{margin:0 0 16px;font-size:18px;line-height:30px}
.meta__details{font-size:13px;line-height:20px}
.ornament--section{background-image:url("assets/images/divider-center-20260919.png")}
.artwork>.ornament{margin-block:40px}
.section h3{text-align:left;margin:0 0 24px;font-size:18px;line-height:36px;font-weight:700}
.section__image{width:100%;margin-left:0;height:auto;display:block;margin-bottom:24px}
img.section__image{object-fit:cover}
.artwork[data-id="cezanne"] .section__image--context{height:210px}
.section__image--context{margin-bottom:16px}
.section__context-caption{margin:0 0 32px;font-size:13px;line-height:18px}
.section__image--artwork{margin-bottom:16px}
.section__caption{margin:0 0 32px;font-size:12px;line-height:18px}
.section__caption em{display:block;margin-left:0;font-style:normal;font-size:13px}
.section__copy{margin:0;font-size:15px;line-height:28px;letter-spacing:.025em;font-feature-settings:"palt" 0,"pkna" 0;font-kerning:normal}
.section__copy .jp-tight{font-feature-settings:"palt" 1;letter-spacing:0}
.section__copy p{margin:0 0 1.85em}
.section__copy p:last-child{margin-bottom:0}
.artwork+.artwork{margin-top:104px}
@media(min-width:768px){.artwork__visual{width:375px}}
@media(min-width:768px) and (hover:hover){html,body{background:#ddd6cc}.museum{width:375px;box-shadow:0 0 30px #8e867b55}}
@media(max-width:374px){.intro h1{font-size:min(28px,8.5vw)}.intro p{font-size:17px}.section__copy{font-size:clamp(12px,4vw,15px)}}
@media(max-height:560px){.intro{--intro-gap:8px;--intro-avatar-height:100px;padding-block:8px 12px}.intro h1{font-size:26px;line-height:32px}.intro p{font-size:17px;line-height:24px}.intro__enter{margin-top:18px}}
@media(max-height:430px){.intro{--intro-gap:6px;--intro-avatar-height:75px;padding-block:max(6px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-bottom))}.intro h1{font-size:22px;line-height:26px}.intro p{font-size:15px;line-height:21px}.intro__enter{margin-top:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.intro,.guide__bubble,.intro__line{transition:none}.intro__line{opacity:1;transform:none}.intro__enter.is-ready,.gallery{animation:none}}
