* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  color: var(--color-text);
  background: var(--color-bg);
  line-height: 1.8;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

.wrap { max-width: var(--max-width); margin: 0 auto; padding: 0 24px; }

.page { display: none; }
.page.active { display: block; }

/* TOP local surface-boundary correction: the Trusted By .wrap is the bordered card itself. */
#page-home.home-space-v1 .home-trusted .wrap { padding: 0; }

/* ============================================================
   Supporting Pages / DS v0.6 + Surface Grammar 1
   Education = Program Narrative
   Related   = Resource Directory
   Q&A       = FAQ + Interaction
   Strictly page-scoped: never reaches shared Header / Footer.
   ============================================================ */
:is(#page-education.edu-v2,#page-related.rel-v2,#page-qa.qa-v2) {
  --sp-ink:#0D1926;
  --sp-navy:#1A314B;
  --sp-teal:#1F6C6D;
  --sp-coral:#FD604A;
  --sp-lilac:#E8BFE6;
  --sp-body:#494A4A;
  --sp-muted:#626263;
  --sp-cool:#ECF0F4;
  --sp-line:#DDE5EC;
  --sp-lit:linear-gradient(212.5deg in srgb,#101E2F 43.91%,#354E6A 97.43%);
  --sp-warm:linear-gradient(161.15deg in srgb,#FF9974 8.73%,#FF5212 88.52%);
  color:var(--sp-body);
  overflow-x:clip;
}
:is(#page-education.edu-v2,#page-related.rel-v2,#page-qa.qa-v2) > section .wrap {
  width:min(calc(100% - 48px),1240px);
  max-width:1240px;
  padding-inline:0;
}
:is(#page-education.edu-v2,#page-related.rel-v2,#page-qa.qa-v2) .jp-heading {
  color:inherit;
  font-weight:500;
  letter-spacing:-.02em;
}
:is(#page-education.edu-v2,#page-related.rel-v2,#page-qa.qa-v2) .jp-copy {
  color:inherit;
}

/* ---------- Education / Program Narrative ---------- */
#page-education.edu-v2 .edu-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(76px,8vw,108px) 0 clamp(70px,7vw,96px);
  color:#fff;
  background-color:#101E2F;
  background-image:var(--sp-lit);
  text-align:left;
}
#page-education.edu-v2 .edu-hero::before {
  content:"";
  position:absolute;
  z-index:-1;
  right:-88px;
  top:-112px;
  width:440px;
  height:440px;
  pointer-events:none;
  background:radial-gradient(circle,rgba(232,191,230,.22) 1px,transparent 1.5px) 0 0/16px 16px;
  -webkit-mask-image:radial-gradient(circle,#000 10%,transparent 72%);
  mask-image:radial-gradient(circle,#000 10%,transparent 72%);
}
#page-education.edu-v2 .edu-hero__grid {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-items:start;
}
#page-education.edu-v2 .edu-hero .tag {
  display:flex;
  align-items:center;
  gap:11px;
  margin:0 0 18px;
  color:rgba(255,255,255,.72);
  font-family:var(--ob-font-latin);
  font-size:12px;
  font-weight:500;
  letter-spacing:.14em;
}
#page-education.edu-v2 .edu-hero .tag::before {
  content:"";
  width:30px;
  height:3px;
  border-radius:2px;
  background:var(--sp-coral);
}
#page-education.edu-v2 .edu-hero h1 {
  margin:0;
  color:#fff;
  font-size:clamp(40px,4.8vw,64px);
  font-weight:500;
  line-height:1.2;
  letter-spacing:-.03em;
}
#page-education.edu-v2 .edu-hero__lead {
  max-width:840px;
  margin:24px 0 0;
  padding:0;
  border:0;
  color:rgba(255,255,255,.86);
  font-size:17px;
  line-height:1.9;
}
#page-education.edu-v2 section.block,
#page-education.edu-v2 .program-detail {
  padding:clamp(74px,8vw,108px) 0;
}
#page-education.edu-v2 section.edu-flagship {
  background:#fff;
  color:var(--sp-body);
}
#page-education.edu-v2 .edu-flagship__grid {
  grid-template-columns:minmax(0,1.22fr) minmax(300px,.78fr);
  gap:clamp(48px,6vw,92px);
  align-items:center;
}
#page-education.edu-v2 .edu-flagship .eyebrow,
#page-education.edu-v2 .edu-section-head .eyebrow {
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 15px;
  color:var(--sp-navy);
  font-family:var(--ob-font-latin);
  font-size:12px;
  font-weight:500;
  letter-spacing:.14em;
}
#page-education.edu-v2 .edu-flagship .eyebrow::before,
#page-education.edu-v2 .edu-section-head .eyebrow::before {
  content:"";
  width:28px;
  height:3px;
  margin:0;
  border-radius:2px;
  background:var(--sp-coral);
}
#page-education.edu-v2 .edu-flagship__title {
  margin:0 0 clamp(26px,3vw,36px);
  padding:0 0 clamp(22px,2.4vw,30px);
  border-bottom:1px solid var(--sp-line);
  color:var(--sp-navy);
  font-size:clamp(30px,3.3vw,44px);
  font-weight:500;
  line-height:1.42;
}
#page-education.edu-v2 .edu-flagship__prose p {
  max-width:720px;
  color:var(--sp-body);
  font-size:16px;
  line-height:1.95;
}
#page-education.edu-v2 .edu-flagship__figure {
  margin:0;
  padding:clamp(22px,2.5vw,34px);
  border:2px solid rgba(232,191,230,.68);
  border-radius:18px;
  background:#fff;
  box-shadow:0 18px 44px rgba(13,25,38,.10);
}
#page-education.edu-v2 section.edu-community {
  background:var(--sp-cool);
}
#page-education.edu-v2 .edu-section-head {
  max-width:880px;
  margin:0 0 clamp(34px,4vw,52px);
}
#page-education.edu-v2 .edu-section-head h2 {
  color:var(--sp-navy);
  font-size:clamp(28px,3.2vw,42px);
  font-weight:500;
  line-height:1.48;
}
#page-education.edu-v2 .edu-community__grid {
  grid-template-columns:minmax(0,1fr) minmax(210px,.32fr);
  gap:clamp(42px,6vw,84px);
}
#page-education.edu-v2 .edu-quote {
  margin:0 0 clamp(30px,3vw,42px);
  padding:3px 0 3px clamp(20px,2vw,28px);
  border-left:3px solid var(--sp-coral);
  color:var(--sp-navy);
  font-size:clamp(18px,1.7vw,22px);
  line-height:1.78;
}
#page-education.edu-v2 .edu-community__prose p {
  color:var(--sp-body);
  font-size:16px;
  line-height:1.95;
}
#page-education.edu-v2 .edu-community__figure {
  padding:22px;
  border:1px solid rgba(26,49,75,.13);
  border-radius:14px;
  background:#fff;
  box-shadow:0 14px 32px rgba(13,25,38,.07);
}
#page-education.edu-v2 .edu-events .news-item {
  padding:20px 0;
  border:0;
  border-top:1px solid rgba(26,49,75,.24);
  border-bottom:1px solid rgba(26,49,75,.24);
  border-radius:0;
  background:transparent;
}
#page-education.edu-v2 .edu-events .title {
  color:var(--sp-teal);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:4px;
}
#page-education.edu-v2 section.edu-index {
  background:#fff;
}
#page-education.edu-v2 .edu-index__list {
  max-width:980px;
  border-top:1px solid var(--sp-line);
}
#page-education.edu-v2 .edu-index__list li {
  padding-top:22px;
  padding-bottom:22px;
  border-bottom:1px solid var(--sp-line);
}
#page-education.edu-v2 .edu-index__note {
  color:var(--sp-muted);
}
#page-education.edu-v2 section.edu-cta {
  padding:0 0 clamp(76px,8vw,108px);
  background:#fff;
}
#page-education.edu-v2 .cta-band {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px clamp(28px,4vw,54px);
  align-items:center;
  padding:clamp(30px,4vw,44px) clamp(28px,4.5vw,56px);
  border:0;
  border-radius:0;
  background-color:#101E2F;
  background-image:var(--sp-lit);
  color:#fff;
  box-shadow:none;
  text-align:left;
}
#page-education.edu-v2 .cta-band h2 {
  grid-column:1;
  margin:0;
  color:#fff;
  font-size:clamp(26px,2.8vw,38px);
}
#page-education.edu-v2 .cta-band p {
  grid-column:1;
  margin:0;
  color:rgba(255,255,255,.8);
}
#page-education.edu-v2 .cta-band .btn {
  grid-column:2;
  grid-row:1/3;
  min-height:48px;
  padding:13px 24px;
  border:1px solid #cf633c;
  border-radius:8px;
  background-color:#FF9974;
  background-image:var(--sp-warm);
  color:var(--sp-ink);
  box-shadow:0 3px 8px rgba(26,49,75,.14);
}

/* ---------- Related / Resource Directory ---------- */
#page-related.rel-v2 .rel-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(66px,7vw,94px) 0 clamp(56px,5vw,76px);
  color:#fff;
  background-color:#101E2F;
  background-image:var(--sp-lit);
  text-align:left;
}
#page-related.rel-v2 .rel-hero::after {
  content:"";
  position:absolute;
  z-index:-1;
  right:-120px;
  bottom:-180px;
  width:520px;
  height:360px;
  background:radial-gradient(ellipse,rgba(253,96,74,.18),transparent 68%);
  pointer-events:none;
}
#page-related.rel-v2 .rel-hero .tag {
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 16px;
  color:rgba(255,255,255,.72);
  font-family:var(--ob-font-latin);
  font-size:12px;
  font-weight:500;
  letter-spacing:.14em;
}
#page-related.rel-v2 .rel-hero .tag::before {
  content:"";
  width:28px;
  height:3px;
  margin:0;
  background:var(--sp-coral);
}
#page-related.rel-v2 .rel-hero h1 {
  max-width:820px;
  margin:0;
  color:#fff;
  font-size:clamp(40px,4.7vw,62px);
  font-weight:500;
  line-height:1.22;
}
#page-related.rel-v2 .rel-hero__lead {
  max-width:700px;
  margin:20px 0 0;
  color:rgba(255,255,255,.84);
  font-size:17px;
  line-height:1.9;
}
#page-related.rel-v2 .rel-entry__link {
  color:var(--sp-teal);
}
#page-related.rel-v2 .rel-entry__link {
  border-bottom:1px solid currentColor;
  font-size:clamp(17px,1.5vw,19px);
  font-weight:500;
}

/* ---------- Q&A / FAQ + Interaction ---------- */
#page-qa.qa-v2 .qa-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(70px,7vw,98px) 0 clamp(64px,6vw,88px);
  background-color:#101E2F;
  background-image:var(--sp-lit);
  color:#fff;
  text-align:left;
}
#page-qa.qa-v2 .qa-hero::after {
  content:"";
  position:absolute;
  z-index:-1;
  right:-60px;
  top:-90px;
  width:380px;
  height:380px;
  pointer-events:none;
  background:radial-gradient(circle,rgba(255,255,255,.18) 1px,transparent 1.5px) 0 0/16px 16px;
  -webkit-mask-image:radial-gradient(circle,#000 8%,transparent 72%);
  mask-image:radial-gradient(circle,#000 8%,transparent 72%);
}
#page-qa.qa-v2 .qa-hero .tag {
  display:flex;
  align-items:center;
  gap:10px;
  color:rgba(255,255,255,.78);
}
#page-qa.qa-v2 .qa-hero .tag::before {
  width:28px;
  height:3px;
  margin:0;
  background:var(--sp-coral);
}
#page-qa.qa-v2 .qa-hero h1 {
  color:#fff;
  font-size:clamp(42px,5vw,66px);
  font-weight:500;
}
#page-qa.qa-v2 .qa-hero__lead {
  max-width:660px;
  color:rgba(255,255,255,.9);
}
#page-qa.qa-v2 section.qa-faq {
  padding:clamp(76px,8vw,108px) 0;
  background:#fff;
}
#page-qa.qa-v2 .qa-section-head {
  max-width:840px;
  margin:0 0 clamp(34px,4vw,50px);
}
#page-qa.qa-v2 .qa-section-head .eyebrow {
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--sp-navy);
}
#page-qa.qa-v2 .qa-section-head .eyebrow::before {
  width:28px;
  height:3px;
  margin:0;
  background:var(--sp-coral);
}
#page-qa.qa-v2 .qa-section-head h2 {
  color:var(--sp-navy);
  font-size:clamp(28px,3.1vw,40px);
  font-weight:500;
}
#page-qa.qa-v2 .qa-list {
  max-width:1080px;
  border-top:1px solid rgba(26,49,75,.28);
}
#page-qa.qa-v2 .qa-item {
  border-bottom:1px solid rgba(26,49,75,.18);
}
#page-qa.qa-v2 .qa-q {
  padding-top:clamp(22px,2.3vw,28px);
  padding-bottom:clamp(22px,2.3vw,28px);
}
#page-qa.qa-v2 .qa-q__text {
  color:var(--sp-navy);
  font-size:clamp(17px,1.55vw,19px);
  line-height:1.72;
}
#page-qa.qa-v2 .qa-tag {
  border-color:rgba(31,108,109,.45);
  color:var(--sp-teal);
}
#page-qa.qa-v2 .qa-q::after {
  border-color:var(--sp-teal);
}
#page-qa.qa-v2 .qa-q::before {
  background:var(--sp-coral);
}
#page-qa.qa-v2 .qa-item.open .qa-q__text {
  color:var(--sp-teal);
}
#page-qa.qa-v2 .qa-a p {
  max-width:800px;
  color:var(--sp-body);
  line-height:1.95;
}
#page-qa.qa-v2 section.qa-contact {
  padding:clamp(72px,8vw,104px) 0;
  background-color:#FF725B;
  background-image:var(--sp-warm);
  color:var(--sp-ink);
}
#page-qa.qa-v2 .qa-contact .qa-section-head .eyebrow,
#page-qa.qa-v2 .qa-contact .qa-section-head h2,
#page-qa.qa-v2 .qa-contact .qa-section-head p {
  color:var(--sp-ink);
}
#page-qa.qa-v2 .qa-contact .qa-section-head .eyebrow::before {
  background:var(--sp-ink);
}
#page-qa.qa-v2 .qa-routes {
  max-width:1080px;
  border-top:1px solid rgba(13,25,38,.36);
}
#page-qa.qa-v2 .qa-route {
  padding-top:clamp(30px,3vw,40px);
  padding-bottom:clamp(30px,3vw,40px);
}
#page-qa.qa-v2 .qa-route h3,
#page-qa.qa-v2 .qa-route p,
#page-qa.qa-v2 .qa-mail,
#page-qa.qa-v2 .qa-mail__link {
  color:var(--sp-ink);
}
#page-qa.qa-v2 .qa-btn {
  min-height:48px;
  padding:13px 24px;
  border-radius:8px;
  font-weight:500;
}
#page-qa.qa-v2 .qa-btn--solid {
  border-color:var(--sp-navy);
  background:var(--sp-navy);
  color:#fff;
}
#page-qa.qa-v2 .qa-btn--outline {
  border-color:var(--sp-ink);
  color:var(--sp-ink);
}

@media (max-width:900px) {
  #page-education.edu-v2 .edu-flagship__grid,
  #page-education.edu-v2 .edu-community__grid {
    grid-template-columns:1fr;
    gap:34px;
    align-items:start;
  }
      #page-qa.qa-v2 .qa-routes { grid-template-columns:1fr; }
  #page-qa.qa-v2 .qa-route + .qa-route {
    padding-left:0;
    border-left:0;
    border-top:1px solid rgba(13,25,38,.34);
  }
}

@media (max-width:760px) {
  :is(#page-education.edu-v2,#page-related.rel-v2,#page-qa.qa-v2) > section .wrap {
    width:min(calc(100% - 40px),1240px);
  }
  #page-education.edu-v2 .edu-hero,
  #page-related.rel-v2 .rel-hero,
  #page-qa.qa-v2 .qa-hero {
    padding:54px 0 50px;
  }
  #page-education.edu-v2 .edu-hero h1,
  #page-related.rel-v2 .rel-hero h1 {
    font-size:clamp(34px,9vw,42px);
  }
  #page-education.edu-v2 .edu-hero__lead,
  #page-related.rel-v2 .rel-hero__lead,
  #page-qa.qa-v2 .qa-hero__lead {
    font-size:15.5px;
    line-height:1.85;
  }
  #page-education.edu-v2 section.block,
  #page-education.edu-v2 .program-detail,
  #page-qa.qa-v2 section.qa-faq,
  #page-qa.qa-v2 section.qa-contact {
    padding:68px 0;
  }
  #page-education.edu-v2 .edu-flagship__title { font-size:28px; }
  #page-education.edu-v2 .edu-section-head h2,
  #page-qa.qa-v2 .qa-section-head h2 { font-size:25px; }
  #page-education.edu-v2 .edu-flagship__figure,
  #page-education.edu-v2 .edu-community__figure { padding:18px; }
  #page-education.edu-v2 .cta-band {
    grid-template-columns:1fr;
    gap:0;
    padding:30px 24px;
  }
  #page-education.edu-v2 .cta-band .btn {
    grid-column:1;
    grid-row:auto;
    justify-self:start;
    margin-top:22px;
  }
        #page-qa.qa-v2 .qa-q { padding:19px 0 19px 14px; }
  #page-qa.qa-v2 .qa-q__text { font-size:16px; }
  #page-qa.qa-v2 .qa-a p { font-size:15px; }
}

@media (max-width:360px) {
  :is(#page-education.edu-v2,#page-related.rel-v2,#page-qa.qa-v2) > section .wrap {
    width:min(calc(100% - 32px),1240px);
  }
  #page-education.edu-v2 .edu-hero h1,
  #page-related.rel-v2 .rel-hero h1 { font-size:34px; }
  #page-qa.qa-v2 .qa-hero h1 { font-size:40px; }
}

/* Supporting Pages / DS v0.6 + Surface Grammar 1 — Q&A contact surface refinement */
#page-qa.qa-v2 section.block.qa-contact {
  background-color:var(--ob-color-surface-neutral);
  background-image:linear-gradient(var(--ob-color-surface-neutral),var(--ob-color-surface-neutral));
}

/* ============================================================
   Typography consistency contract
   Same role, same scale within the Supporting Page family.
   Editorial article, Home, Reasons, Product and Case templates keep
   their template-specific scales as required by DESIGN_SYSTEM.md.
   ============================================================ */
:is(
  #page-education.edu-v2 .edu-hero h1,
  #page-related.rel-v2 .rel-hero h1,
  #page-qa.qa-v2 .qa-hero h1
) {
  font-size:var(--ob-type-support-page-title);
}

:is(
  #page-education.edu-v2 .edu-section-head h2,
  #page-related.rel-v2 .rel-library__head h2,
  #page-qa.qa-v2 .qa-section-head h2
) {
  font-size:var(--ob-type-support-section-title);
}

#page-education.edu-v2 .cta-band h2 {
  font-size:var(--ob-type-cta-title);
}
#page-education.edu-v2 .cta-band p {
  font-size:var(--ob-type-cta-body);
}
#page-education.edu-v2 .cta-band .btn {
  font-size:var(--ob-type-cta-label);
}

/* ============================================================
   Brand cohesion / Block-page shell contract — 2026-09-20
   Same shell role = same geometry. Content templates retain their
   own editorial hierarchy and evidence salience.
   ============================================================ */
:is(
  #page-education.edu-v2 .edu-hero,
  #page-related.rel-v2 .rel-hero,
  #page-qa.qa-v2 .qa-hero
) {
  padding:var(--ob-shell-hero-pad-top) 0 var(--ob-shell-hero-pad-bottom);
  background-color:#101E2F;
  background-image:var(--ob-gradient-navy);
}

:is(
  #page-education.edu-v2 .edu-hero,
  #page-related.rel-v2 .rel-hero,
  #page-qa.qa-v2 .qa-hero
)::before {
  content:"";
  position:absolute;
  z-index:-1;
  right:-80px;
  top:-110px;
  width:430px;
  height:430px;
  pointer-events:none;
  background:radial-gradient(circle,rgba(232,191,230,.20) 1px,transparent 1.5px) 0 0/16px 16px;
  -webkit-mask-image:radial-gradient(circle,#000 12%,transparent 72%);
  mask-image:radial-gradient(circle,#000 12%,transparent 72%);
}

:is(
  #page-education.edu-v2 .edu-hero,
  #page-related.rel-v2 .rel-hero,
  #page-qa.qa-v2 .qa-hero
)::after {
  content:"";
  position:absolute;
  z-index:-1;
  left:-160px;
  bottom:-210px;
  width:560px;
  height:400px;
  pointer-events:none;
  background:radial-gradient(ellipse,rgba(253,96,74,.17),transparent 68%);
}

:is(
  #page-education.edu-v2 .edu-hero .tag,
  #page-related.rel-v2 .rel-hero .tag,
  #page-qa.qa-v2 .qa-hero .tag
) {
  gap:11px;
  margin-bottom:20px;
  font-size:var(--ob-shell-label);
}

:is(
  #page-education.edu-v2 .edu-hero .tag::before,
  #page-related.rel-v2 .rel-hero .tag::before,
  #page-qa.qa-v2 .qa-hero .tag::before
) {
  width:var(--ob-shell-hero-marker-width);
  height:var(--ob-shell-marker-height);
  border-radius:2px;
  background:var(--ob-color-accent);
}

:is(
  #page-education.edu-v2 .edu-hero__lead,
  #page-related.rel-v2 .rel-hero__lead,
  #page-qa.qa-v2 .qa-hero__lead
) {
  font-size:var(--ob-shell-hero-lead);
}

:is(
  #page-education.edu-v2 .edu-section-head .eyebrow::before,
  #page-related.rel-v2 .rel-library__head .eyebrow::before,
  #page-qa.qa-v2 .qa-section-head .eyebrow::before
) {
  width:var(--ob-shell-section-marker-width);
  height:var(--ob-shell-marker-height);
  border-radius:2px;
}

#page-education.edu-v2 .cta-band {
  border-radius:var(--ob-shell-panel-radius);
}
