/* ================= SUBPAGE COMMON (hero) ================= */
.about-page .script{font-size:calc(58*var(--u))}
.brush{display:block}
/* hero */
.ab-hero{position:relative;height:calc(650*var(--u));overflow:hidden}
.ab-mv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.ab-hero-text{position:absolute;left:calc(108*var(--u));top:calc(92*var(--u));z-index:2}
.ab-h1{font-weight:900;color:var(--ink);font-size:calc(64*var(--u));line-height:1.22;letter-spacing:.02em;transform:rotate(-6deg);transform-origin:left bottom;margin:calc(-14*var(--u)) 0 0 calc(34*var(--u));text-shadow:0 0 calc(18*var(--u)) rgba(255,255,255,.65)}
.ab-h1-brush{width:calc(560*var(--u));height:calc(22*var(--u));margin:calc(-6*var(--u)) 0 0 calc(90*var(--u));transform:rotate(-7deg)}
.ab-lead{margin:calc(40*var(--u)) 0 0 calc(34*var(--u));font-size:calc(19*var(--u));font-weight:500;line-height:1.95;color:#1f2a36;letter-spacing:.04em;text-shadow:0 0 calc(10*var(--u)) rgba(255,255,255,.9),0 0 calc(3*var(--u)) #fff}
.ab-lde{position:absolute;right:calc(60*var(--u));top:calc(82*var(--u));z-index:2;font-family:var(--script);color:var(--pink);font-size:calc(44*var(--u));line-height:1;text-align:center;transform:rotate(-16deg);text-shadow:0 0 calc(10*var(--u)) rgba(255,255,255,.8)}
.ab-lde span{display:block}.ab-lde .x{font-family:var(--en);font-size:calc(24*var(--u));margin:calc(2*var(--u)) 0}
@media (max-width: 820px){
  .about-page .script{font-size:38px}
  .ab-hero{height:auto;padding:56px 0 0}
  .ab-mv{position:relative;inset:auto;height:auto;aspect-ratio:1024/445}
  .ab-hero-text{position:relative;left:auto;top:auto;padding:24px 22px 8px}
  .ab-h1{font-size:30px;margin:-6px 0 0 14px}
  .ab-h1-brush{width:240px;height:12px;margin:-2px 0 0 60px}
  .ab-lead{font-size:14.5px;margin:22px 0 0 0;text-shadow:none}
  .ab-lde{top:70px;right:12px;font-size:22px}.ab-lde .x{font-size:13px}
}
.lv-hero .ab-h1{font-size:calc(76*var(--u));transform:rotate(-5deg)}
.lv-hero .ab-h1-brush{width:calc(600*var(--u));margin-left:calc(40*var(--u))}
.lv-hero .ab-lead{margin-top:calc(46*var(--u))}
@media (max-width: 820px){
  .lv-hero .ab-h1{font-size:36px}
  .lv-hero .ab-h1-brush{width:230px}
  .lv-hero .ab-lead{margin-top:22px}
}