:root { --blue:#003b9b; --line:#a9c7f3; --pale:#eef7ff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--blue); font-family:"Noto Serif JP", "Yu Mincho", serif; background:#fff; overflow-x:hidden; }
.site-header { height:108px; max-width:1180px; margin:auto; padding:10px 42px; display:flex; align-items:center; gap:28px; background:#fff; }
.site-title { margin:0; color:var(--blue); font-size:25px; font-weight:700; letter-spacing:.08em; }
.brand { display:flex; align-items:center; }
.yunosato-brand img { display:block; width:225px; height:auto; }
.collab { color:#111; font:42px/1 Arial,sans-serif; font-weight:200; }
.aqua-brand { width:92px; flex:0 0 auto; }
.aqua-brand img { display:block; width:92px; height:92px; object-fit:contain; filter:saturate(.9) contrast(.96); }

.hero { height:43.3046875vw; position:relative; overflow:hidden; background-color:#fff; background-image:url('reference-final.webp'); background-repeat:no-repeat; background-size:92vw auto; background-position:center -9.61328125vw; }
.hero:after { display:none; }
.hero-photo { position:absolute; top:0; right:0; bottom:0; width:512px; background-image:url('reference.png'); background-repeat:no-repeat; background-size:1024px 1536px; background-position:right -107px; -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.78) 9%,#000 19%); mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.78) 9%,#000 19%); }
.hero-copy { display:block; position:absolute; z-index:2; inset:0 auto 0 4vw; width:51vw; margin:0; padding:1.8vw 3.8vw; background:linear-gradient(90deg,#f4faff 0%,#f4faff 78%,rgba(244,250,255,.93) 88%,transparent 100%); }
.hero-photo { display:none; }
.edition { font-size:24px; margin:0 0 8px; font-weight:700; }
h1 { font-size:clamp(32px,3.45vw,52px); line-height:1.24; letter-spacing:.04em; margin:0; font-weight:700; text-shadow:0 1px #fff; }
h1 span { display:block; white-space:nowrap; }
.hero-subtitle { width:clamp(310px,42vw,600px); margin:9px 0 8px; color:#244c87; font-size:clamp(14px,1.45vw,19px); line-height:1.65; font-weight:700; letter-spacing:.035em; text-wrap:balance; overflow-wrap:break-word; word-break:normal; line-break:strict; }
.hero-collab { display:flex; align-items:center; gap:16px; margin:.45vw 0 .35vw; }
.organizer { min-height:58px; display:flex; align-items:flex-start; gap:12px; margin:.45vw 0 .35vw; }
.organizer>span:first-child { color:#244c87; font-size:13px; font-weight:700; line-height:24px; white-space:nowrap; }
.organizer-brand { display:flex; flex-direction:column; align-items:flex-start; gap:7px; }
.organizer-brand img { width:auto; height:24px; display:block; }
.organizer-brand small { color:#244c87; font-size:13px; line-height:1.2; font-weight:600; letter-spacing:0; white-space:nowrap; }
.compact.yunosato-brand img { width:165px; }
.compact.aqua-brand { width:59px; }
.compact.aqua-brand img { width:59px; height:59px; }
.hero-collab .collab { font-size:32px; }
.hero-facts { width:clamp(310px,31vw,420px); display:grid; gap:6px; }
.fact { min-height:clamp(48px,4.45vw,61px); display:flex; align-items:center; gap:14px; border:1px solid #77a7ef; border-radius:5px; padding:4px 14px; background:rgba(255,255,255,.94); }
.fact small,.overview-card small { display:block; font-size:14px; font-weight:600; }
.fact b { display:block; font-size:20px; margin-top:2px; white-space:nowrap; }
.datetime-fact { min-height:68px; }
.datetime-fact b { font-size:16px; line-height:1.35; }
.date-icon,.entry-icon { width:34px; height:34px; flex:0 0 auto; overflow:visible; fill:none; stroke:var(--blue); stroke-width:3.5; stroke-linecap:round; stroke-linejoin:round; }
.date-icon .icon-fill { fill:var(--blue); stroke:none; }
.entry-icon { width:35px; height:35px; }
.fee-icon { width:34px; height:34px; flex:0 0 auto; display:grid; place-items:center; border-radius:50%; background:var(--blue); color:#fff; font:700 21px Georgia,serif; }
.combined-fact { padding-right:10px; }
.combined-fact>span:nth-child(2) { min-width:0; }
.combined-fact b { font-size:clamp(15px,1.35vw,19px); }
.fee-label { margin-left:auto; padding-left:12px; border-left:1px solid #b6ccef; white-space:nowrap; }
.fee-label b { font-size:clamp(17px,1.55vw,22px); }

.content { max-width:900px; margin:auto; padding:30px 36px 18px; }
h2 { display:flex; align-items:center; justify-content:center; gap:18px; margin:0 0 16px; font-size:24px; letter-spacing:.07em; }
h2:before,h2:after { content:""; width:40px; border-top:1px solid #a6c2eb; }
.intro { text-align:center; }
.intro p { font-size:15px; line-height:2; font-weight:600; margin:0; }
.seminar-summary { display:grid; gap:16px; padding:0; border:0; background:none; text-align:left; }
.summary-panel { padding:22px 30px 24px; border:1px solid var(--line); border-radius:6px; background:linear-gradient(180deg,#edf6ff,#f6faff); }
.seminar-summary h2 { margin-bottom:14px; }
.summary-heading { margin:0 0 10px; color:var(--blue); font-size:18px; line-height:1.5; letter-spacing:.05em; }
.summary-heading span { margin-left:5px; font-size:.78em; font-weight:600; letter-spacing:.03em; }
.seminar-summary p+.summary-heading { margin-top:24px; }
.seminar-summary p { margin:0; font-size:14px; line-height:2; font-weight:500; text-align:left; text-wrap:pretty; overflow-wrap:break-word; word-break:normal; line-break:strict; }
.seminar-summary p+p { margin-top:13px; }
.summary-apply { margin-top:16px; text-align:center; }
.intro-skeleton { max-width:720px; margin:0 auto; padding:17px 24px 19px; border:1px dashed #b6ccef; border-radius:6px; background:#f7faff; text-align:left; }
.intro-skeleton strong { display:block; margin-bottom:10px; color:#8fa8ca; font:600 17px Arial,sans-serif; letter-spacing:.15em; }
.intro-skeleton i { display:block; height:9px; margin-top:8px; border-radius:5px; background:linear-gradient(90deg,#dce8f7,#edf4fc,#dce8f7); }
.intro-skeleton i.medium { width:72%; }
.block { margin-top:24px; }
.overview-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.overview-card,.program-card { min-height:96px; border:1px solid var(--line); border-radius:5px; display:flex; align-items:center; gap:25px; padding:20px 38px; background:#fff; }
.venue-card { position:relative; color:var(--blue); text-decoration:none; transition:background .2s,border-color .2s; }
.venue-card:hover { background:#f3f8ff; border-color:#6e9fe9; }
.map-link-text { display:block; width:max-content; margin-top:5px; color:#1766c2; font-family:"Noto Serif JP","Yu Mincho",serif; font-size:12px; font-weight:600; border-bottom:1px solid #1766c2; padding-bottom:1px; }
.overview-card strong { display:block; font-size:23px; margin-top:3px; }
.overview-card .venue-name { font-size:17px; line-height:1.45; }
.venue-name span { display:block; white-space:nowrap; }
.access-note { display:block; margin-top:6px; color:#173f7f; font-size:11px; line-height:1.6; font-weight:700; }
.large-icon { width:42px; height:42px; }
.location-icon { width:44px; height:54px; flex:0 0 auto; overflow:visible; }
.location-icon path { fill:var(--blue); }
.location-icon circle { fill:#fff; }
.note { font-size:12px; margin:8px 4px; }
.overview-secondary { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px; }
.capacity-card { min-height:82px; margin-top:10px; border:1px solid var(--line); border-radius:5px; display:flex; align-items:center; justify-content:center; gap:22px; padding:14px 20px; background:#fff; }
.capacity-card svg { width:55px; height:43px; fill:var(--blue); }
.capacity-card small { display:block; font-size:14px; font-weight:600; }
.capacity-card strong { display:block; font-size:23px; margin-top:2px; }
.overview-card .event-datetime { font-size:17px; line-height:1.55; white-space:nowrap; }
.schedule-card { justify-content:flex-start; }
.schedule-card strong { font-size:16px; line-height:1.55; white-space:nowrap; }
.clock-icon { width:44px; height:44px; flex:0 0 auto; border:4px solid var(--blue); border-radius:50%; position:relative; }
.clock-icon:before,.clock-icon:after { content:""; position:absolute; left:50%; top:50%; width:3px; border-radius:2px; background:var(--blue); transform-origin:50% 0; }
.clock-icon:before { height:12px; transform:translate(-50%,-1px) rotate(180deg); }
.clock-icon:after { height:10px; transform:translate(-50%,-1px) rotate(125deg); }
.program-card { padding:17px 30px; }
.program-card p { line-height:1.65; margin:0; font-size:15px; }
.clipboard { width:63px; height:63px; border-radius:50%; background:#dcecff; display:grid; place-items:center; flex:0 0 auto; }
.clipboard svg { width:35px; height:39px; fill:none; stroke:var(--blue); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.event-timeline { width:280px; margin:0 auto 16px; padding:16px 24px; border:1px solid var(--line); border-radius:6px; background:#f7faff; }
.event-timeline>div { display:grid; grid-template-columns:74px 1fr; align-items:baseline; gap:16px; white-space:nowrap; }
.event-timeline time { color:var(--blue); font-size:22px; font-weight:700; letter-spacing:.04em; }
.event-timeline span { font-size:14px; font-weight:700; }
.event-timeline>i { display:block; height:24px; margin:3px 0 3px 36px; border-left:1px solid #9ab9e8; position:relative; }
.event-timeline>i:after { content:""; position:absolute; left:-4px; bottom:-1px; width:7px; height:7px; border-right:1px solid #9ab9e8; border-bottom:1px solid #9ab9e8; transform:rotate(45deg); }
.speaker-grid { display:grid; grid-template-columns:1fr; gap:12px; }
.speaker-card { border:1px solid var(--line); border-radius:6px; padding:17px; background:#fff; }
.speaker-profile { min-height:118px; display:flex; align-items:center; gap:12px; }
.speaker-icon { width:58px; height:58px; flex:0 0 auto; border-radius:50%; background:#dcecff; position:relative; }
.speaker-icon:before { content:""; position:absolute; width:17px; height:17px; border-radius:50%; background:var(--blue); left:21px; top:11px; }
.speaker-icon:after { content:""; position:absolute; width:34px; height:18px; border-radius:20px 20px 8px 8px; background:var(--blue); left:12px; top:31px; }
.speaker-profile small { font-size:12px; font-weight:600; }
.speaker-profile h3 { margin:2px 0 5px; color:var(--blue); font-size:15px; line-height:1.4; }
.speaker-profile p { margin:0; color:#325b9b; font-size:12px; line-height:1.55; font-weight:600; }
.program-placeholder { margin-top:14px; padding:15px 16px; border:1px dashed #b6ccef; border-radius:5px; background:#f7faff; }
.program-placeholder span { display:block; color:#6d88b2; font-size:11px; font-weight:600; }
.program-placeholder strong { display:block; margin:4px 0 10px; color:#8fa8ca; font:600 17px Arial,sans-serif; letter-spacing:.15em; }
.program-placeholder i { display:block; height:8px; margin-top:7px; border-radius:5px; background:linear-gradient(90deg,#dce8f7,#edf4fc,#dce8f7); background-size:200% 100%; }
.program-placeholder i.short { width:68%; }
.program-schedule { margin:0; padding:0; border:1px solid var(--line); border-radius:7px; overflow:hidden; background:#fff; list-style:none; }
.program-schedule li { display:grid; grid-template-columns:125px 1fr; gap:22px; align-items:start; padding:14px 22px; border-bottom:1px solid #d7e5f7; }
.program-schedule li:last-child { border-bottom:0; }
.program-schedule li:nth-child(even) { background:#f8fbff; }
.program-schedule li.lecture { padding-top:18px; padding-bottom:18px; background:#f1f7ff; }
.program-schedule li.break { background:#f7f7f7; }
.program-schedule time { color:#07479e; font-family:Arial,sans-serif; font-size:15px; line-height:1.55; font-weight:700; white-space:nowrap; }
.program-schedule strong { display:block; color:var(--blue); font-size:15px; line-height:1.7; }
.program-schedule p { margin:3px 0 0; color:var(--blue); font-size:16px; line-height:1.75; font-weight:500; }
.program-schedule small { display:block; margin-top:4px; color:#5c74a0; font-size:11px; line-height:1.6; }
.program-schedule b { font-size:inherit; font-weight:inherit; }
.program-label { display:inline-block; margin:0 0 5px; padding:2px 9px; border-radius:12px; background:var(--blue); color:#fff; font-size:11px; font-weight:700; }
.program-number { display:inline-block; width:max-content; padding:3px 12px; border-radius:14px; background:var(--blue); color:#fff; font-size:12px; line-height:1.5; font-weight:700; }
.program-schedule .program-title { margin-top:9px; font-size:18px; line-height:1.7; font-weight:900; letter-spacing:.01em; }
.apply { text-align:center; }
.apply>p { margin:-7px 0 8px; font-size:13px; }
.apply-button { width:335px; max-width:100%; display:inline-block; padding:9px 24px 11px; border-radius:30px; background:linear-gradient(#0785dc,#0038ae); color:#fff; text-decoration:none; font-size:24px; letter-spacing:.07em; box-shadow:inset 0 1px rgba(255,255,255,.35); }
.external-icon { position:relative; display:inline-block; width:15px; height:15px; margin-left:5px; border:2px solid rgba(255,255,255,.92); border-radius:1px; vertical-align:-1px; }
.external-icon:before { content:""; position:absolute; width:8px; height:8px; right:-4px; top:-4px; background:linear-gradient(135deg,#0878d5 0 37%,#fff 38% 55%,transparent 56%); }
.external-icon:after { content:""; position:absolute; width:7px; height:7px; right:-3px; top:-3px; border-top:2px solid #fff; border-right:2px solid #fff; }
.apply-notes { width:335px; max-width:100%; margin:6px auto 0; text-align:left; font-size:11px; line-height:1.55; }
.apply-notes p { margin:0; font-size:11px; line-height:1.55; font-weight:400; }
.precautions { border:1px solid var(--line); border-radius:5px; padding:0 20px 13px; margin-top:39px; }
.precautions h2 { width:max-content; padding:0 14px; margin:-17px auto 5px; background:#fff; }
.precaution-list { display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.precaution-list ul { margin:0; padding-left:19px; font-size:11px; line-height:2.4; font-weight:600; }
footer { min-height:72px; padding:20px max(5vw,40px); background:linear-gradient(90deg,#003783,#0053ba); color:#fff; display:flex; align-items:center; justify-content:space-between; font:12px Arial,"Noto Serif JP",sans-serif; }
footer a { color:#fff; text-decoration:none; }
.footer-links { display:flex; align-items:flex-start; gap:25px; }
.contact-link-group { display:flex; flex-direction:column; gap:5px; }
.contact-link-group small { max-width:310px; font-size:10px; line-height:1.45; }
.footer-contact-button { padding:0; border:0; background:none; color:#fff; font:inherit; text-align:left; cursor:pointer; }
.footer-contact-button:hover { text-decoration:underline; }
.modal-open { overflow:hidden; }
.contact-modal[hidden] { display:none; }
.contact-modal { position:fixed; z-index:1000; inset:0; display:grid; place-items:center; padding:20px; }
.contact-modal-backdrop { position:absolute; inset:0; background:rgba(0,28,78,.58); backdrop-filter:blur(3px); }
.contact-modal-dialog { position:relative; width:min(460px,100%); padding:34px 34px 28px; border:1px solid #9bbded; border-radius:12px; background:#fff; box-shadow:0 20px 60px rgba(0,33,91,.28); text-align:center; }
.contact-modal-dialog h2 { margin:0 0 18px; font-size:23px; }
.contact-modal-dialog p { margin:0 0 22px; color:#244c87; font-size:15px; line-height:1.9; font-weight:600; }
.contact-modal-close { position:absolute; top:10px; right:13px; width:34px; height:34px; padding:0; border:0; background:none; color:#315d9c; font:30px/1 Arial,sans-serif; cursor:pointer; }
.contact-modal-link { display:block; width:300px; max-width:100%; margin:0 auto; padding:11px 18px; border-radius:24px; background:linear-gradient(#0785dc,#0038ae); color:#fff; text-decoration:none; font-size:17px; font-weight:700; }
.contact-modal-cancel { margin-top:15px; padding:5px 15px; border:0; background:none; color:#526f9c; font:13px "Noto Serif JP",serif; text-decoration:underline; cursor:pointer; }

@media (max-width:700px) {
  .site-header { height:79px; padding:8px 17px; gap:12px; justify-content:center; }
  .site-title { font-size:18px; text-align:center; }
  .site-header .yunosato-brand img { width:174px; }
  .site-header .collab { font-size:28px; }
  .site-header .aqua-brand { width:62px; }
  .site-header .aqua-brand img { width:62px; height:62px; }
  .hero { height:auto; padding-top:0; background:#edf7fe; }
  .hero-photo { display:block; inset:0; width:100%; height:100%; background-color:#edf7fe; background-image:url('hero-textless.webp'); background-repeat:no-repeat; background-size:100% auto; background-position:center top; -webkit-mask-image:none; mask-image:none; }
  .hero-copy { display:block; }
  .hero:after { display:block; background:linear-gradient(180deg,rgba(232,246,255,.08),rgba(238,248,255,.5) 60%,#eef8ff 100%); }
  .hero-copy { position:relative; inset:auto; width:auto; min-height:440px; margin:0; padding:22px 20px 26px; background:linear-gradient(90deg,rgba(241,249,255,.98) 0%,rgba(241,249,255,.94) 47%,rgba(241,249,255,.55) 70%,rgba(241,249,255,.08) 100%); }
  .edition { font-size:17px; }
  h1 { max-width:none; font-size:28px; letter-spacing:.02em; }
  .hero-subtitle { width:100%; margin:8px 0 9px; font-size:13.5px; line-height:1.7; letter-spacing:.01em; text-wrap:pretty; }
  .hero-collab { margin:15px 0; transform:scale(.82); transform-origin:left; }
  .organizer { margin:10px 0; gap:12px; }
  .organizer-brand img { width:auto; height:24px; }
  .hero-facts { width:100%; margin-top:16px; }
  .fact { min-width:0; padding-right:10px; }
  .fact>span:last-child { min-width:0; }
  .fact b { font-size:17px; white-space:normal; line-height:1.35; }
  .datetime-fact b { font-size:14px; }
  .content { padding:27px 18px 20px; }
  h2 { font-size:19px; gap:10px; } h2:before,h2:after { width:22px; }
  .intro p { font-size:13px; line-height:1.9; } .intro br { display:none; }
  .seminar-summary { gap:13px; padding:0; }
  .summary-panel { padding:19px 17px 21px; }
  .seminar-summary p { font-size:13px; line-height:1.9; text-align:justify; text-justify:inter-character; text-wrap:wrap; }
  .summary-heading { margin-bottom:8px; font-size:16px; }
  .seminar-summary p+.summary-heading { margin-top:20px; }
  .apply-notes p { font-size:11px; line-height:1.55; font-weight:400; }
  .overview-grid,.overview-secondary,.precaution-list { grid-template-columns:1fr; }
  .capacity-card { justify-content:flex-start; padding:15px 25px; }
  .overview-card { min-height:82px; padding:15px 25px; }
  .overview-card strong { font-size:19px; }
  .overview-card .venue-name { font-size:15px; }
  .access-note { max-width:none; font-size:10.5px; line-height:1.55; white-space:nowrap; }
  .overview-card .event-datetime { font-size:15px; white-space:normal; }
  .program-card { padding:15px; gap:15px; }
  .program-card p { font-size:13px; }
  .speaker-grid { grid-template-columns:1fr; }
  .speaker-card { padding:16px; }
  .program-schedule li { grid-template-columns:1fr; gap:4px; padding:13px 15px; }
  .program-schedule li > div { min-width:0; }
  .program-schedule li.lecture { padding-top:15px; padding-bottom:15px; }
  .program-schedule time { font-size:13px; }
  .program-schedule strong { font-size:14px; line-height:1.6; }
  .program-schedule p { max-width:100%; font-size:clamp(11px,2.95vw,12px); line-height:1.65; font-weight:400; letter-spacing:-.065em; white-space:nowrap; }
  .program-schedule .speaker-line { display:inline; max-width:none; font-size:inherit; line-height:inherit; font-weight:inherit; letter-spacing:inherit; white-space:inherit; }
  .program-schedule .program-title { max-width:100%; margin-top:8px; font-size:clamp(12px,3.15vw,13px); line-height:1.65; font-weight:900; letter-spacing:-.09em; white-space:nowrap; }
  .event-timeline { width:250px; padding:13px 20px; }
  .event-timeline time { font-size:17px; }
  .event-timeline span { font-size:12px; }
  .event-timeline>i { height:20px; margin:3px 0 3px 31px; }
  .precaution-list { gap:0; }
  footer { flex-direction:column; padding:20px 12px; text-align:center; gap:12px; font-size:10px; }
  .footer-links { width:100%; justify-content:center; gap:8px; align-items:flex-start; }
  .footer-links>a:first-child { font-size:9px; white-space:nowrap; }
  .contact-link-group small { max-width:175px; }
  .contact-modal-dialog { padding:32px 20px 25px; }
  .contact-modal-dialog h2 { font-size:20px; }
  .contact-modal-dialog p { font-size:13px; }
}

@media (max-width:420px) {
  .site-title { max-width:100%; font-size:16px; line-height:1.45; letter-spacing:.04em; }
  h1 { max-width:none; font-size:25px; line-height:1.35; letter-spacing:0; }
  .hero-subtitle { font-size:13px; }
  .fact b { font-size:15px; }
  .hero-copy { padding-left:18px; padding-right:18px; }
}