/* topstage */
.topstage{position:relative;}
/* z-index:-2 で紙テクスチャ(body::before, z:-1)の奥に入る。topstage は z-index:auto なのでコンテキストを作らず抜ける */
.topstage__spotlight{position:absolute;inset:0 0 -100px 0;z-index:-2;pointer-events:none;opacity:1;overflow:hidden;
  display:flex;justify-content:center;align-items:flex-start;}
.topstage__spotlight img{width:100%;height:auto;max-width:none;flex:none;display:block;transform:translateY(-10%);}
@media (max-width:1279px){
  .topstage__spotlight{top:0;bottom:auto;height:100vh;height:100dvh;align-items:flex-start;}
  .topstage__spotlight img{width:300vw;transform:translateY(-10%);}
}

/* header */
.header{position:relative;}
.header::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:100vw;height:5px;background:var(--c-sky-band);z-index:2;pointer-events:none;}
.header__hero{position:relative;z-index:1;}
.header__bar{position:absolute;top:0;left:0;z-index:1;padding:50px var(--edge) var(--s-3);}
.header__bar-inner{display:flex;align-items:center;}
.header__logo img{width:min(320px,62vw);height:auto;}
.header__hero{display:flex;justify-content:center;padding:20px var(--gutter) 0;}
.header__emblem{width:272px;height:auto;}

/* button pill */
.btn-pill{
  display:inline-flex;align-items:center;gap:.5em;
  background:var(--c-sky);color:#fff;text-decoration:none;
  font-family:var(--f-jp);font-size:var(--fs-sm);font-weight:500;
  padding:.7em 1.4em;border-radius:var(--r-pill);border:none;cursor:pointer;
  transition:background .2s ease;
}
.btn-pill:hover{background:var(--c-sky-deep);}
.btn-pill__arrow{font-size:.7em;}

/* KV */
.kv,.marquee{width:100vw;margin-inline:calc(50% - 50vw);}
.kv{overflow:hidden;}
.kv__inner{position:relative;padding-block:0;}
.kv__sky{display:none;}
.kv__cloud{position:absolute;background:#fff;border-radius:50%;opacity:.85;}
.kv__cloud--1{width:150px;height:50px;top:12%;left:5%;box-shadow:58px 10px 0 -6px #fff,116px -2px 0 -12px #fff;}
.kv__cloud--2{width:110px;height:40px;top:6%;right:14%;box-shadow:44px 8px 0 -6px #fff;}
.kv__cloud--3{width:190px;height:58px;bottom:14%;right:5%;opacity:.55;box-shadow:66px 12px 0 -8px #fff;}
.kv__deco{position:absolute;pointer-events:none;}
.kv__deco--fly{width:clamp(72px,9vw,128px);top:6%;left:3%;z-index:2;transform:scaleX(-1);}
.kv__track{position:relative;z-index:1;display:flex;gap:6px;list-style:none;margin:0;padding:var(--s-4);width:max-content;}
.kv__poster img{width:clamp(260px,18.75vw,360px);height:auto;background:#fff;}

/* marquee */
/* overflow:clip-margin は横にも溢れるので使わない */
.marquee{overflow:hidden;padding-block:var(--s-4);color:#DBD6BC;
  font-family:var(--f-en);font-size:clamp(36px,3.125vw,60px);font-weight:500;letter-spacing:0;line-height:1.25;}
.marquee__track{display:flex;align-items:center;width:max-content;will-change:transform;}
.marquee__track--2{margin-top:6px;opacity:.9;}
.marquee__unit{padding-inline:var(--s-4);white-space:nowrap;}
/* margin-blockでアイコンのレイアウト上の高さをテキスト1行に抑え、行間を膨らませない */
.marquee__icon{--dora-h:76px;height:var(--dora-h);width:auto;flex:0 0 auto;margin-block:calc((1.25em - var(--dora-h)) / 2);}
.marquee--mid{margin-block:var(--s-7);}
@media (max-width:1279px){
  .marquee{font-size:37px;}
  .marquee__icon{--dora-h:57px;}
  .kv__track{gap:4px;}
}

/* card */
.card{background:none;}
.card__media{position:relative;}
.card__media img{width:100%;aspect-ratio:566/344;object-fit:cover;}
.card__badge{position:absolute;bottom:0;left:0;right:0;
  background:rgba(100,195,235,.85);color:#fff;font-size:clamp(16px,1.04vw,20px);font-weight:700;
  text-align:center;padding:.5em 1em;letter-spacing:.1em;}
.card__text{padding:20px 0 0;}
.card__date{color:var(--c-title);font-size:var(--fs-sm);font-weight:700;margin:0 0 var(--s-2);}
.card__title{font-size:clamp(20px,1.25vw,24px);font-weight:700;line-height:1.5;margin:0 0 12px;color:var(--c-title);}
.card__body{color:var(--c-muted);font-size:var(--fs-body2);line-height:2;margin:0;}
.card__info{color:var(--c-muted);font-size:var(--fs-body2);font-weight:700;line-height:2;margin:0;}
.card__more{text-align:right;margin-top:12px;}
.card--banner .card__media img{aspect-ratio:21/9;}
.card--topics{background:#E8E6D7;border-radius:16px;display:flex;align-items:flex-start;gap:20px;padding:36px;}
.card--topics .card__media{flex:0 0 clamp(220px,18.02vw,346px);}
.card--topics .card__media img{aspect-ratio:auto;}
.card--topics .card__text{padding:0;flex:1;min-width:0;}
.card--topics .card__title{font-size:var(--fs-title);margin:0 0 16px;}
@supports (text-box-edge:cap){
  .card--topics .card__title{text-box-trim:trim-start;text-box-edge:cap alphabetic;}
}
@supports not (text-box-edge:cap){
  .card--topics .card__title{margin-top:calc((1 - 1.5) / 2 * 1em);}
}
.card__title-br{display:inline;}
@media (max-width:1279px){
  .card__title-br{display:inline;}
}

/* modal */
.modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;}
.modal__backdrop{position:absolute;inset:0;background:rgba(12,69,98,.7);}
.modal__dialog{position:relative;width:min(90vw,960px);background:#000;border-radius:var(--s-2);}
.modal__video{aspect-ratio:16/9;}
.modal__video iframe{width:100%;height:100%;border:0;}
.modal__close{position:absolute;top:-2.5rem;right:0;background:none;border:0;color:#fff;font-size:2rem;cursor:pointer;}
.pv-button{position:absolute;right:var(--s-5);bottom:var(--s-5);}