:root{
  --blue:#2e6bb5;
  --blue-deep:#1f4c82;
  --sky:#eff8fc;
  --teal:#14b4da;
  --orange:#ef8a4c;
  --ink:#1d3a5f;
  --muted:#5f748b;
  --line:#dce8f0;
  --white:#fff;
  --rakuten:#bf0000;
  --choice:#f56a00;
  --alert:#e0421f;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;font-family:"Noto Sans JP",sans-serif;color:var(--ink);background:#fff;line-height:1.8;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1120px,calc(100% - 40px));margin:auto}
.narrow{max-width:920px}
.section{padding:88px 0}

.site-header{position:fixed;top:0;left:0;right:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid rgba(31,76,130,.08)}
.header-inner{height:74px;width:min(1180px,calc(100% - 40px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;flex-direction:column;line-height:1.25;color:var(--blue-deep)}
.brand span{font-size:10px;letter-spacing:.14em}.brand strong{font-size:17px}
.header-link{padding:11px 19px;border-radius:999px;background:var(--blue);color:#fff;font-size:13px;font-weight:700}

/* 300px main visual, v2 tone */
.hero{position:relative;height:300px;min-height:300px;margin-top:74px;overflow:hidden;background:#dfeef5;display:flex;align-items:center;justify-content:center}
.hero-image{position:absolute;inset:0;background:url("assets/bg-mv_pc.png") center 58%/cover no-repeat}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 72%,rgba(14,52,89,.08) 100%);pointer-events:none}
.hero-logo{position:relative;z-index:2;width:min(64vw,620px);max-height:205px;object-fit:contain;filter:drop-shadow(0 3px 14px rgba(255,255,255,.5))}

.eyebrow{margin:0 0 8px;font-family:Oswald,sans-serif;font-size:13px;font-weight:700;letter-spacing:.18em;color:var(--teal)}
h2{margin:0 0 22px;color:var(--blue-deep);font-size:clamp(29px,4.2vw,44px);line-height:1.45}
.lead{margin:0;color:var(--muted);font-size:16px}

.festival-intro.section{padding:64px 0 72px;background:#fff}
.festival-intro .center{text-align:center}
.festival-intro h1{margin:0 0 20px;font-size:clamp(32px,5vw,54px);line-height:1.25;color:var(--blue-deep)}
.intro-copy{margin:0 0 42px;font-weight:600;color:var(--ink)}
.event-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.event-grid>div{padding:24px 18px;text-align:left}
.event-grid>div+div{border-left:1px solid var(--line)}
.event-grid span{display:block;margin-bottom:7px;color:var(--blue);font-size:13px;font-weight:800}
.event-grid strong{font-size:15px;line-height:1.65;color:var(--blue-deep)}

.donate{background:#f7fbfd;text-align:center}

.urgent-notice{padding:40px 0 0;background:#fff;text-align:center}
.urgent-notice__title{margin:0;font-size:clamp(19px,2.8vw,26px);font-weight:900;color:var(--blue-deep);line-height:1.5}
.urgent-notice__sub{margin:8px 0 0;font-size:14px;font-weight:800;color:var(--alert)}

.ticket-type-heading{margin:44px 0 0;font-size:17px;font-weight:900;color:var(--blue-deep);letter-spacing:.02em}
.ticket-type-heading--electronic{margin-top:52px}
.ticket-type-heading + .portal-buttons{margin-top:18px}

.portal-btn.tropica-ticket{background:linear-gradient(120deg,var(--blue) 0%,var(--teal) 130%)}

.portal-buttons{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px}
.portal-buttons--single{grid-template-columns:1fr;max-width:451px;margin-left:auto;margin-right:auto}
.portal-btn{position:relative;display:flex;min-height:150px;flex-direction:column;justify-content:center;align-items:flex-start;padding:28px 32px;border-radius:18px;color:#fff;text-align:left;box-shadow:0 16px 34px rgba(28,70,110,.10);transition:transform .2s ease,box-shadow .2s ease}
.portal-btn:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(28,70,110,.16)}
.portal-btn.rakuten{background:var(--rakuten)}
.portal-btn.choice{background:var(--choice)}
.portal-name{font-size:14px;opacity:.92}.portal-btn strong{margin-top:4px;font-size:20px;line-height:1.5;padding-right:26px}
.portal-btn .arrow{position:absolute;right:28px;bottom:25px;font-size:24px}
.center-note{text-align:center}

.tropica{background:linear-gradient(180deg,#effafc,#fff)}
.tropica-box{padding:48px;border-radius:28px;background:#fff;border:1px solid #d7edf3;box-shadow:0 18px 45px rgba(20,86,120,.08)}
.tropica-box p:not(.eyebrow):not(.small-note){margin:0;color:var(--muted)}
.tropica-btn{display:inline-flex;margin-top:26px;padding:14px 24px;border-radius:999px;background:var(--blue);color:#fff;font-weight:700}
.small-note{margin:16px 0 0;font-size:12px;color:#71869b}

.notice{padding-top:70px;padding-bottom:70px}.notice h2{font-size:28px}
.notice ul{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.notice li{position:relative;padding:16px 6px 16px 26px;border-bottom:1px solid var(--line);font-size:14px;color:#536b82}
.notice li::before{content:"・";position:absolute;left:4px;color:var(--blue);font-weight:900}

.bottom-cta{padding:72px 0;background:var(--blue-deep);color:#fff;text-align:center}
.bottom-cta p{margin:0 0 8px;font-family:Oswald,sans-serif;letter-spacing:.13em;font-size:13px;opacity:.8}
.bottom-cta h2{margin-bottom:26px;color:#fff}
.bottom-buttons{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.small-btn{min-width:250px;padding:14px 24px;border-radius:999px;color:#fff;font-weight:700}
.small-btn.rakuten{background:var(--rakuten)}.small-btn.choice{background:var(--choice)}

.site-footer{padding:30px 0;background:#173a62;color:#fff}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:13px}
.footer-inner strong{display:block;margin-bottom:3px}.footer-inner p{margin:0;opacity:.6}
.footer-link{font-weight:700;border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:2px}

@media(max-width:760px){
  .section{padding:64px 0}
  .header-inner{height:68px}.brand span{font-size:9px}.brand strong{font-size:15px}
  .header-link{padding:9px 14px;font-size:11px}
  .hero{height:300px;min-height:300px;margin-top:68px}.hero-image{background-position:center center}.hero-logo{width:86vw;max-height:185px}
  .festival-intro.section{padding:44px 0 52px}
  .festival-intro h1{font-size:32px}
  .intro-copy{font-size:14px;margin-bottom:30px}
  .event-grid{grid-template-columns:1fr 1fr}
  .event-grid>div{padding:18px 12px}
  .event-grid>div:nth-child(3){border-left:0;border-top:1px solid var(--line)}
  .event-grid>div:nth-child(4){border-top:1px solid var(--line)}
  .event-grid strong{font-size:13px}
  .portal-buttons{grid-template-columns:1fr}.tropica-box{padding:34px 24px}
  .portal-buttons--single{max-width:none}
  .urgent-notice{padding:28px 0 0}
  .urgent-notice__title{font-size:19px}
  .ticket-type-heading{margin-top:34px;font-size:16px}
  .ticket-type-heading--electronic{margin-top:40px}
  .bottom-buttons{flex-direction:column;align-items:stretch}.small-btn{width:100%}
  .footer-inner{flex-direction:column;align-items:flex-start}.footer-link{margin-top:4px}
}
@media(max-width:480px){
  .container{width:calc(100% - 28px)}.header-inner{width:calc(100% - 28px)}
  .portal-btn{padding:24px;min-height:135px}.portal-btn strong{font-size:18px}
}

/* 紙チケット受付終了 */
.portal-btn.ticket-soldout { background: #aaa !important; background-image: none !important; color: #fff !important; border-color: #aaa !important; opacity: .65; cursor: default; pointer-events: none; filter: grayscale(1); box-shadow: none !important; }
.portal-btn.ticket-soldout:hover { transform: none !important; }
.ticket-soldout-message { text-align: center; font-weight: 700; color: #666; margin: 8px 0 16px; }
