:root { --bg:#09090a; --ink:#f4f1eb; --dim:rgba(244,241,235,.57); --line:rgba(244,241,235,.19); --accent:#d6ff5f; --serif:Georgia,"Times New Roman",serif; --sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--bg); font-family:var(--sans); font-weight:350; letter-spacing:.012em; } #relation-field { position:fixed; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; opacity:.34; pointer-events:none; background:#000; }
/* 本文が沈む暗幕。背景が生成映像になったぶん、読み面を確保する。 */
body::after { content:''; position:fixed; inset:0; z-index:0; pointer-events:none; background:linear-gradient(to bottom, rgba(9,9,10,.62) 0%, rgba(9,9,10,.72) 45%, rgba(9,9,10,.62) 100%); } .masthead, main, footer { position:relative; z-index:1; } .masthead { height:82px; padding:22px 3vw; display:flex; justify-content:space-between; align-items:flex-start; font-size:10px; letter-spacing:.13em; } a { color:inherit; text-decoration:none; } .wordmark { font-weight:600; } .header-right { display:flex; gap:28px; align-items:center; color:var(--dim); } .language-switch { display:flex; gap:7px; align-items:center; } .language-switch button { border:0; padding:0; background:none; color:var(--dim); font:inherit; cursor:pointer; } .language-switch button[aria-pressed="true"] { color:var(--ink); }
.hero { min-height:calc(100svh - 82px); padding:8vh 7vw 7vh; display:flex; flex-direction:column; justify-content:space-between; } .eyebrow,.section-label,.room-head>p { margin:0; color:var(--accent); font-size:10px; letter-spacing:.16em; } h1,h2,p { margin-top:0; } h1 { margin:8vh 0; max-width:1100px; font-family:var(--serif); font-weight:400; font-size:clamp(5rem,13.5vw,13.5rem); letter-spacing:-.075em; line-height:.77; } h1 em,h2 em { font-weight:400; } .hero-footer { display:flex; align-items:end; justify-content:space-between; gap:40px; border-top:1px solid var(--line); padding-top:15px; } .subtitle { margin:0; font-size:clamp(1.25rem,2.2vw,2rem); } .hero-footer p:last-child { max-width:32rem; margin:0; color:var(--dim); font-size:14px; line-height:1.7; }
.event-layout { max-width:1100px; display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,310px); gap:6vw; align-items:start; } .event-date { margin-bottom:2.5rem; color:var(--accent); font-size:clamp(1.1rem,2.1vw,1.8rem); letter-spacing:.04em; } .event-info h2 { font-size:clamp(2.45rem,5.1vw,5.2rem); } .event-facts { margin:3.2rem 0 0; border-top:1px solid var(--line); } .event-facts div { display:grid; grid-template-columns:8.5rem minmax(0,1fr); gap:16px; padding:13px 0; border-bottom:1px solid var(--line); } .event-facts dt { color:var(--dim); font-size:11px; letter-spacing:.12em; } .event-facts dd { margin:0; font-size:14px; line-height:1.6; } .event-facts dd a { color:var(--accent); } .event-facts dd span { color:var(--dim); padding:0 .25em; } .key-visual { margin:0; } .key-visual img { display:block; width:100%; height:auto; border:1px solid var(--line); } .key-visual figcaption,.venue-gallery figcaption,.room-visual figcaption { margin-top:8px; color:var(--dim); font-size:10px; letter-spacing:.1em; }
.section-grid { display:grid; grid-template-columns:18% minmax(0,1fr); gap:30px; margin:0 7vw; padding:10rem 0; border-top:1px solid var(--line); } .section-label { display:flex; gap:15px; } .section-content { max-width:900px; } .byline { color:var(--dim); font:italic 14px var(--serif); } h2 { margin-bottom:2.5rem; max-width:1000px; font-family:var(--serif); font-weight:400; font-size:clamp(2.7rem,6vw,6.1rem); letter-spacing:-.055em; line-height:.91; } .prose { max-width:670px; color:var(--dim); font-size:15px; line-height:1.9; } .prose p { margin-bottom:1.3em; } .prose.large { max-width:810px; color:var(--ink); font-size:clamp(1.07rem,1.6vw,1.37rem); line-height:1.8; } .intro { max-width:670px; color:var(--dim); font-size:clamp(1rem,1.5vw,1.27rem); line-height:1.75; }
.room-index { margin:4rem 0 0; padding:0; list-style:none; border-top:1px solid var(--line); } .room-index a { min-height:86px; display:grid; grid-template-columns:55px 1fr 1.3fr; gap:15px; align-items:center; border-bottom:1px solid var(--line); transition:padding .2s, color .2s; } .room-index a:hover { padding-left:14px; color:var(--accent); } .room-index span { color:var(--dim); font-size:11px; } .room-index strong { font-size:18px; font-weight:450; } .room-index em { color:var(--dim); font:italic 18px var(--serif); }
.venue .intro { margin-bottom:1.1rem; } .venue-note { margin-bottom:3.2rem; } .venue-gallery { display:grid; grid-template-columns:1fr 1fr; gap:14px; } .venue-gallery figure,.room-visual { margin:0; } .venue-gallery img,.room-visual img { display:block; width:100%; height:auto; border:1px solid var(--line); }
.rooms { margin:0 3vw; border-top:1px solid var(--line); } .room { min-height:83vh; padding:10rem 4vw 9rem; display:grid; grid-template-columns:1fr 1fr; gap:8vw; border-bottom:1px solid var(--line); } .room:nth-child(2) { background:rgba(214,255,95,.045); } .room-head h2 { margin:18px 0 16px; font-size:clamp(3.2rem,6.7vw,7rem); } .jp-title { color:var(--dim); font-size:13px; } .room-copy { align-self:end; } .room-lead { margin-bottom:2.2rem; font-size:clamp(1.35rem,2.4vw,2.25rem); line-height:1.32; } .room-note { margin:3rem 0 0; padding:1.2rem 0 0; border-top:1px solid var(--line); color:var(--accent); font-size:15px; line-height:1.7; }
.room-visual { margin-top:3.2rem; max-width:590px; }
.system-viewer-content { max-width:none; }
.system-proxy-note { max-width:760px; margin:1.5rem 0 0; padding-left:1rem; border-left:1px solid var(--accent); color:var(--dim); font-size:13px; line-height:1.8; }
.system-viewer-frame { position:relative; width:100%; min-height:560px; margin-top:3rem; overflow:hidden; border:1px solid var(--line); background:#080b0e; box-shadow:0 24px 80px rgba(0,0,0,.38); }
.system-viewer-frame iframe { display:block; width:100%; height:min(78svh,820px); min-height:560px; border:0; background:#080b0e; }
.system-viewer-actions { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:15px 0; border-bottom:1px solid var(--line); }
.system-viewer-open { color:var(--accent); font-size:13px; letter-spacing:.04em; }
.system-viewer-open:hover { text-decoration:underline; }
.system-viewer-actions span { color:var(--dim); font-size:9px; letter-spacing:.11em; text-align:right; }
.closing { padding-bottom:14rem; } footer { margin:0 3vw; padding:21px 4vw; display:flex; justify-content:space-between; gap:25px; border-top:1px solid var(--line); color:var(--dim); font-size:10px; letter-spacing:.13em; } footer a { color:var(--ink); }
.study-media { margin:3.2rem 0 2.6rem; }
.study-media img { width:100%; max-width:1000px; display:block; background:#000; border:1px solid var(--line); }
.study-media .bgnote { display:block; margin-top:.5em; color:var(--accent); }
.study-media figcaption { max-width:670px; margin-top:1rem; color:var(--dim); font-size:13px; line-height:1.75; }
.study .intro { margin-bottom:0; }
.study p[data-i18n="studyBody2"] { max-width:670px; margin:0 0 2.4rem; color:var(--dim); font-size:15px; line-height:1.9; }
.downloads-inline { margin:2.6rem 0 0; padding:0; list-style:none; border-top:1px solid var(--line); }
.downloads-inline li { display:grid; grid-template-columns:minmax(0,15rem) 5.5rem minmax(0,1fr); gap:18px; align-items:baseline; padding:15px 0; border-bottom:1px solid var(--line); }
.downloads-inline a { color:var(--accent); font-size:14px; word-break:break-all; }
.downloads-inline a:hover { text-decoration:underline; }
.downloads-inline span { color:var(--dim); font-size:11px; letter-spacing:.06em; }
.downloads-inline em { color:var(--dim); font:italic 13px/1.7 var(--serif); }
.downloads-inline em .save { margin-left:.6em; color:var(--accent); font:400 11px var(--sans); letter-spacing:.08em; white-space:nowrap; }
.downloads-inline em .save:hover { text-decoration:underline; }
.concept-list { margin:3.4rem 0 0; padding:0; border-top:1px solid var(--line); }
.concept-list > div { display:grid; grid-template-columns:minmax(0,17rem) minmax(0,1fr); gap:28px; padding:22px 0; border-bottom:1px solid var(--line); }
.concept-list dt { font-size:17px; font-weight:450; line-height:1.5; }
.concept-list dd { margin:0; max-width:640px; color:var(--dim); font-size:14px; line-height:1.85; }
.concept-workspace-content { max-width:980px; padding:4rem; border:1px solid rgba(214,255,95,.35); background:rgba(214,255,95,.035); }
.workspace-status { margin:0 0 2.5rem; color:var(--accent); font-size:10px; letter-spacing:.14em; }
.concept-workspace-content h2 { max-width:860px; }
.concept-workspace-actions { display:flex; flex-wrap:wrap; gap:10px; }
.concept-workspace-open { display:inline-flex; margin-top:2.2rem; padding:15px 18px; border:1px solid var(--accent); color:#09090a; background:var(--accent); font-size:12px; letter-spacing:.06em; }
.concept-workspace-open:hover { color:var(--accent); background:transparent; }
.concept-workspace-open.secondary { color:var(--accent); background:transparent; }
.concept-workspace-open.secondary:hover { color:#09090a; background:var(--accent); }
.concept-workspace-meta { margin:1rem 0 0; color:var(--dim); font-size:9px; letter-spacing:.1em; }
.room-concept-link { display:inline-flex; margin-top:2rem; padding-bottom:5px; border-bottom:1px solid var(--accent); color:var(--accent); font-size:11px; letter-spacing:.06em; }
.room-concept-link:hover { color:var(--ink); border-color:var(--ink); }
@media (max-width:720px) {
  .event-layout { grid-template-columns:1fr; gap:3rem; } .key-visual { max-width:310px; } .venue-gallery { grid-template-columns:1fr; }
  .downloads-inline li { grid-template-columns:1fr; gap:6px; }
  .concept-list > div { grid-template-columns:1fr; gap:10px; }
  .system-viewer-frame { min-height:610px; }
  .system-viewer-frame iframe { height:72svh; min-height:610px; }
  .system-viewer-actions { align-items:flex-start; flex-direction:column; }
  .system-viewer-actions span { text-align:left; }
  .concept-workspace-content { padding:2rem 1.4rem; }
}
@media (max-width:720px) { .masthead { height:68px; padding:19px 6vw; } .status { display:none; } .header-right { gap:0; } .hero { min-height:calc(100svh - 68px); padding:7vh 7vw 5vh; } h1 { font-size:clamp(4.5rem,19vw,8rem); } .hero-footer { display:block; } .hero-footer p:last-child { margin-top:18px; } .section-grid { grid-template-columns:1fr; gap:30px; margin:0 7vw; padding:6rem 0; } .section-label { position:static; } .room { min-height:auto; grid-template-columns:1fr; gap:4rem; padding:7rem 4vw; } .room-index a { grid-template-columns:35px 1fr; padding:16px 0; } .room-index em { grid-column:2; font-size:15px; } .room-copy { align-self:auto; } footer { padding:19px 4vw; } footer span:nth-child(2) { display:none; } }