/* =========================
  Layout requirements
========================= */
:root{
  --site-w: 1440px;
  --content-w: 1100px;

  --ff-en: "Playfair Display", serif;
  --ff-jp: "Noto Serif JP", serif;
  --ff-body: "Noto Sans JP", sans-serif;

  --fs-en: 100px;
  --fs-jp: 40px;
  --fs-body: 16px;
  --fs-xs: 12px;
  --fs-sm: 16px;
  --fs-md: 20px;
  --fs-lg: 24px;
  --fs-xl: 28px;
  --fs-2xl: 32px;
  --fs-3xl: 40px;

  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-10: 40px;
  --space-11: 44px;
  --space-12: 48px;
  --space-14: 56px;
  --space-15: 60px;
  --space-16: 64px;

  --ink:#1b1b1b;
  --muted:rgba(27,27,27,.70);
  --line:#182832;

  --r-lg:22px;
  --r-md:16px;
}

/* =========================
  Base
========================= */
*{box-sizing:border-box}

html,body{height:100%}
body{
  margin:0;
  font-family:var(--ff-body);
  font-size:var(--fs-body);
  line-height:1.9;
  letter-spacing:.02em;
  color:var(--ink);

  background-image: url("./img/bg_line.webp"), url("./img/bg.webp");
  background-repeat: no-repeat, no-repeat;
  background-position: center center, center center;
  background-size: cover, cover;
  background-attachment: fixed, fixed;
}
html{
  scroll-behavior: smooth;
}
:target{
  scroll-margin-top: 120px;
}
img{
  -webkit-user-drag: none;
  user-select: none;
}

/* keyboard users: keep focus visible across links/buttons/fields */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible{
  outline: 2px solid #6b8091;
  outline-offset: 2px;
}

/* Scroll reveal */
.reveal-section{
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 1s ease, transform 1s ease;
  will-change: opacity, transform;
}

.reveal-section.is-visible{
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce){
  html{
    scroll-behavior: auto;
  }
  .reveal-section{
    opacity: 1;
    transform: none;
    transition: none;
  }
}



/* paper noise */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.12;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");
  background-size:240px 240px;
}

a{color:inherit;text-decoration:none}

.activities{
  width:100%;
  margin:0;
  background-image: url("./img/bg_g.webp");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
}
.about{
  background-image: url("./img/bg_g.webp");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
}

/* =========================
  Header
========================= */
.header{
  position:relative;
  z-index:50;
}

/* Floating header + sticky */
.header--floating{
  position: fixed;
  top: 18px;
  left: 0;
  width: 100%;
  z-index: 200;
}

.header__bar{
  height: 80px;
  display: grid;
  grid-template-columns: 220px 1fr auto;
  align-items: center;
  gap: 32px;

  background: rgba(255,255,255,0.86);
  backdrop-filter: blur(10px);

  border: 1px solid rgba(27,27,27,0.10);
  border-radius: 2px;
  box-shadow: 0 2px 4px rgb(101 101 101 / 12%);

  padding: 0 20px;
  margin: 0 20px;
}

.brand--floating{ display:flex; align-items:center; }

.gnav--floating{
  display:flex;
  align-items:center;
  justify-content:end;
  gap: 28px;
}

.gnav__link--floating{
  font-family: var(--ff-jp);
  font-size: 14px;
  letter-spacing: 0.04em;
  white-space: nowrap;
  color: #182832;
  padding: var(--space-2) 0;
  border-bottom: 1px solid transparent;
  font-weight: 600;
  transition: 0.5s;
}
.gnav__link--floating:hover{ opacity: 0.5; }

.header__cta--floating{
  display:flex;
  align-items:center;
  gap: var(--space-4);
}

/* CTA共通 */
.cta{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap: 4px;
  height: 56px;
  padding: 0 var(--space-4) 0 var(--space-5);
  border-radius: 0;
  font-weight: 600;
  letter-spacing: 0.06em;
  white-space: nowrap;
  font-family: var(--ff-jp);
  font-size: 14px;
  transition: 0.5s;
}

.cta__label{
  font-family: var(--ff-jp);
  font-size: 14px;
}

/* アイコンは縮ませない（青/緑とも安定） */
.cta__icon{
  flex: 0 0 38px;      /* 固定 */
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.cta__icon img{
  width: 32px;
  height: 32px;
  object-fit: contain;
  flex-shrink: 0;      /* ✅ これが重要 */
  display: block;
}


/* =========================
  Header layout fix (desktop)
========================= */

/* ✅ 1200px以上でもはみ出さないように：列を柔軟に */
.header__bar{
  grid-template-columns: 220px minmax(0, 1fr) auto; /* 中央を縮められる */
}

/* ✅ ナビ側が詰まるとき折返しさせず、必要なら隠れる/縮む方向へ */
.gnav--desktop{
  min-width: 0;
}

/* ✅ CTAは“固定200”をやめて伸縮できるように */
.header__cta--desktop{
  min-width: 0;
  display:flex;
  gap: 8px;
  flex-wrap: nowrap;              /* まずは横並び維持 */
}

/* CTA共通：縮められるように */
.cta{
  min-width: 0;
}


/* ラベルが折れて高さが伸びないように */
.cta__label{ white-space: nowrap; }

/* =========================
  Hamburger
========================= */
.hamburger{
  display:none; /* 1200px未満で表示 */
  width: 44px;
  height: 44px;
  padding: 0;
  cursor: pointer;
}

.hamburger__lines{
  display:block;
  width: 22px;
  height: 1px;
  background: #182832;
  margin: 0 auto;
  position: relative;
}
.hamburger__lines::before,
.hamburger__lines::after{
  content:"";
  position:absolute;
  left:0;
  width: 22px;
  height: 1px;
  background:#182832;
}
.hamburger__lines::before{ top:-7px; }
.hamburger__lines::after{ top:7px; }

/* =========================
  Drawer (mobile menu)
========================= */
.drawer{
  position: fixed;
  inset: 0;
  z-index: 300;
  display: none;                  /* 開いた時だけ表示 */
}
.drawer.is-open{ display:block; }

.drawer__backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,0.35);
}

.drawer__panel{
  position:absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(420px, calc(100% - 36px));
  max-width: 100%;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(27,27,27,0.10);
  box-shadow: 0 24px 60px rgba(0,0,0,0.18);
  padding: var(--space-5);
          width: 100% !important;
        max-width: 100% !important;
}

.drawer__top{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(24,40,50,0.18);
  margin-bottom: 12px;
}

.drawer__close{
  width: 40px;
  height: 40px;
  border: 0;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
}

/* Drawer内のナビ/CTA */
.gnav--drawer{
  display:flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding: var(--space-2) 0 var(--space-4);
}

.gnav--drawer .gnav__link--floating{
  padding: var(--space-3) var(--space-2);

}

.header__cta--drawer{
  display:flex;
  flex-direction: column;
  gap: var(--space-2);
  padding-top: var(--space-2);
  border-top: 1px solid rgba(24,40,50,0.18);
}

/* DrawerではCTAを100%幅に */
.header__cta--drawer .cta{
  width: 100%;
  max-width: none;
  flex: 0 0 auto;
}

/* =========================
  <=1280px: switch to hamburger
========================= */
@media (max-width: 1280px){
  /* barは ロゴ + ハンバーガー の2列 */
  .header__bar{
    grid-template-columns: 1fr auto;
    height: 80px;
    gap: 12px; 
  }

  /* desktop nav/cta は非表示 */
  .gnav--desktop,
  .header__cta--desktop{
    display:none;
  }

  /* hamburger 表示 */
  .hamburger{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }


}

.brand__logo {
  width: 180px;
  height: 54px;
  object-fit: contain;
  display: block;
  transition: 0.5s;
}
.brand__logo:hover{ opacity: 0.5; }

.content {
  width: min(var(--content-w), 100%);
  margin: 0 auto;
}

/* Blue/Green buttons */
.cta--blue {
  background-image: url(./img/bg_btn_blue.webp);
  background-position: center;
  color:#fff;
  transition: 0.5s;
  background-size: cover;
}
.cta--blue:hover{ background-position: left; }

.cta--green {
  background-image: url(./img/bg_btn_green.webp);
  background-position: center;
  color:#fff;
  transition: 0.5s;
  background-size: cover;
}
.cta--green:hover{ background-position: left; }

/* Outline contact */
.cta--outline {
  position: relative;
  border: 1px solid #182832;
  padding: 0 var(--space-5) 0 var(--space-6);
  width: 160px;
  transition: 0.5s;
}
.cta--outline:hover{
  background: #978eb8;
  color: #fff;
  border: 1px solid #fff;
}
.cta--outline:hover .btn__arrow{ right: 8px; }

/* =========================
  Buttons
========================= */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: var(--space-2);
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
  padding: var(--space-2) var(--space-4);
  border:1px solid var(--line);
  font-size: var(--fs-sm);
  font-weight:600;
  letter-spacing:.04em;
  line-height:1.6;
  text-align:center;
  overflow-wrap:anywhere;
  background:rgba(255,255,255,.55);
  font-family: var(--ff-jp);
}

/* ✅ B対応：btn--outline を1回に統一（幅等は btn--wide に分離） */
.btn--outline{
  position: relative;
  background:transparent;
  border:1px solid var(--line);
  width: min(400px, 100%);
  padding: var(--space-4) var(--space-6);
  transition: 0.5s;
  padding-right: 48px; /* 矢印用 */
}
.btn--outline:hover{
  background: #978eb8;
  color:#fff;
  border:1px solid #fff;
}
.btn--outline:hover .btn__arrow{ right: 10px; }

/* ✅ 幅/余白の“仕様”はユーティリティに */
.btn--wide{
  width: min(400px, 100%);
  margin-top: var(--space-15);
}

/* arrow */
.btn__arrow{
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  line-height: 1;
  transition: 0.5s;
}

/* =========================
  Section titles
========================= */
.section-title{
  margin:0 0 88px;
  position: relative;
  padding-bottom: 18px;
}
.section-title::before,
.section-title::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  background:#1b41586e;
}
.section-title::before{ height:1px; bottom:5px; }
.section-title::after{ height:2px; bottom:0; }

.section-title.center{ text-align:center }

.title-jp{
  font-family:var(--ff-jp);
  font-size:var(--fs-jp);
  letter-spacing:.06em;
  color: #182832;
  transform: translateY(-40px);
}

.title-en{
  font-family:var(--ff-en);
  font-size:120px;
  line-height:.9;
  margin: 0;
  color:transparent;
  -webkit-text-stroke:1px rgba(132,137,150,.45);
}

.p_serif{
  font-family: var(--ff-jp);
  font-size: var(--fs-md);
  line-height: 2;
  color: #182832;
}

.p_sans{
  font-size: 16px;
  line-height: 2;
  color: #182832;
}

.center{text-align:center}

/* =========================
  Page Transition
========================= */
.page-transition-overlay{
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: #fff;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-100%);
  will-change: transform, opacity;
}
.page-transition-overlay::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -64px;
  height: 64px;
  background: linear-gradient(to bottom, rgba(255,255,255,.85), rgba(255,255,255,0));
}

.page-transition-overlay.is-leaving{
  pointer-events: auto;
  animation: page-transition-leave .32s ease forwards;
}

.page-transition-overlay.is-entering{
  animation: page-transition-enter .38s ease forwards;
}

@keyframes page-transition-leave{
  0%{
    opacity: 0;
    transform: translateY(-100%);
  }
  100%{
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes page-transition-enter{
  0%{
    opacity: 1;
    transform: translateY(0);
  }
  100%{
    opacity: 0;
    transform: translateY(-100%);
  }
}

@media (prefers-reduced-motion: reduce){
  .page-transition-overlay{
    animation: none !important;
    transition: none !important;
  }
}

/* =========================
  Home Opening
========================= */
body.home-top #site-header,
body.home-top main{
  transition: opacity .9s ease .05s;
}

body.home-top.is-opening #site-header,
body.home-top.is-opening main{
  opacity: 0;
  pointer-events: none;
}

.home-opening{
  position: fixed;
  inset: 0;
  z-index: 450;
  display: grid;
  place-items: center;
  background: #fff;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity .8s ease, visibility 0s linear .8s;
}

body.home-top.is-opening .home-opening{
  opacity: 1;
  visibility: visible;
  transition: opacity .75s cubic-bezier(.2,.75,.25,1);
}

.home-opening img{
  width: min(360px, 72vw);
  height: auto;
  opacity: 0;
  transform: translateY(8px) scale(.97);
}

body.home-top.is-opening .home-opening img{
  animation: home-logo-intro 2.7s cubic-bezier(.19,.82,.28,1) .16s forwards;
}

@keyframes home-logo-intro{
  0%{
    opacity: 0;
    transform: translateY(16px) scale(.95);
  }
  28%{
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  72%{
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  100%{
    opacity: 0;
    transform: translateY(-8px) scale(1.03);
  }
}

@media (prefers-reduced-motion: reduce){
  body.home-top #site-header,
  body.home-top main,
  .home-opening{
    transition: none;
  }
  .home-opening img{
    animation: none;
    opacity: 1;
    transform: none;
  }
  body.home-top .hero__headline-line{
    opacity: 1;
    transform: none;
    animation: none;
  }
  body.home-top .hero__orbs{
    opacity: 1;
    transform: none;
    animation: none;
  }
  body.home-top .hero__copy .p_sans{
    opacity: 1;
    transform: none;
    animation: none;
  }
  body.home-top .home-h2-lines .home-h2-line{
    opacity: 1;
    transform: none;
    animation: none;
  }
}

/* =========================
  HERO
========================= */
.hero {
  padding-top: 140px; /* fixed header分の重なり回避 */
}
.hero__content{padding-top:18px;padding-bottom:56px}
.hero__grid{
  display:grid;
  grid-template-columns: 1fr 510px;
  gap:32px;
  align-items:start;
  min-height:340px;
}
.hero__headline{
  margin:100px 0 var(--space-4);
  font-family:var(--ff-jp);
  font-size:44px;
  letter-spacing:.08em;
  line-height:1.6;
  font-weight: 600;
}
.hero__headline-line{
  display: block;
}
.hero__copy{
  min-width: 0;
  max-width: 100%;
}
.hero__copy .p_sans{
  width: 100%;
  max-width: 460px;
}
body.home-top .hero__headline-line{
  opacity: 0;
  transform: translateY(10px);
}
body.home-top.hero-lines-start .hero__headline-line{
  animation: hero-line-in .45s ease forwards;
}
body.home-top.hero-lines-start .hero__headline-line:nth-child(2){
  animation-delay: .5s;
}
body.home-top.hero-lines-start .hero__headline-line:nth-child(3){
  animation-delay: 1s;
}
@keyframes hero-line-in{
  to{
    opacity: 1;
    transform: translateY(0);
  }
}

body.home-top .home-h2-lines .home-h2-line{
  display: block;
  opacity: 0;
  transform: translateY(10px);
}
body.home-top .home-h2-lines.is-lines-visible .home-h2-line{
  animation: hero-line-in .45s ease forwards;
  animation-delay: calc(var(--line-index, 0) * .18s);
}

body.home-top .hero__orbs{
  opacity: 0;
  transform: translateY(12px);
}
body.home-top.hero-lines-start .hero__orbs{
  animation: hero-orbs-in .5s ease forwards;
  animation-delay: 2.05s;
}
@keyframes hero-orbs-in{
  to{
    opacity: 1;
    transform: translateY(0);
  }
}

body.home-top .hero__copy .p_sans{
  opacity: 0;
  transform: translateY(10px);
}
body.home-top.hero-lines-start .hero__copy .p_sans{
  animation: hero-copy-in .45s ease forwards;
  animation-delay: 1.5s;
}
@keyframes hero-copy-in{
  to{
    opacity: 1;
    transform: translateY(0);
  }
}


.hero__orbs img{
  width: 510px;
  max-width: 100%;
  height: auto;
  display: block;
}

.hero__below{
  margin-top:240px;
  display:flex;
  align-items:start;
  justify-content: space-between;
  margin-bottom:120px;
}
.hero__below-left{
  position: relative;
  display: grid;
  place-items: start;
  width: max-content;
  text-align: left;
}

.hero__below-left .en{
  grid-area: 1 / 1;
  line-height: 1;
}

.hero__below-left .section_title{
  grid-area: 1 / 1;
  z-index: 1;
  transform: translateY(90px);
}

.mini-title{
  margin: 0 0 32px;
  font-family: var(--ff-jp);
  font-size: 36px;
  letter-spacing: .06em;
  line-height: 1.7;
  font-weight: 600;
  color: #182832;
}

.issues__head .mini-title{
  text-align: center;
}

.en{
  display: inline-block;
  font-family: "Playfair Display", serif;
  font-size: 120px;
  line-height: 0.7;
  margin: 0;
  color: transparent;
  -webkit-text-stroke: 1px #fff;
  letter-spacing: 4px;
}

.section_title{
  display: inline-block;
  font-family: var(--ff-jp);
  font-size: 40px;
  background: #fff;
  padding: var(--space-2) var(--space-5);
  line-height: 1;
  font-weight: 600;
  color: #182832;
}

.hero__below-right{ margin-top: 200px; }

/* CTA内矢印（見た目調整） */
.cta .btn__arrow{
  right: 12px;
  font-weight: 400;
}

/* =========================
  Sections
========================= */
/* ✅ .section の二重定義を解消（これ1本に統一） */
.section{ padding:88px 0 }

.section-about{
  padding-bottom:0;
}

/* =========================
  Issues card
========================= */
.issues{padding-top:38px}
.issues__card{
  background-image:
    url("./img/issues_bg.webp"),
    linear-gradient(180deg, #9BB4CB 0%, #65879D 100%);
  background-repeat: no-repeat, no-repeat;
  background-position: center center, center center;
  background-size: cover, cover;
  padding:52px 56px;
  box-shadow:0 24px 60px rgba(0,0,0,.10);
  position:relative;
  overflow:hidden;
}
.issues__card::before{
  content:"";
  position:absolute;inset:-20%;
  background:
    radial-gradient(900px 500px at 35% 40%, rgba(255,255,255,.12), transparent 60%),
    radial-gradient(900px 500px at 70% 70%, rgba(0,0,0,.08), transparent 60%);
  pointer-events:none;
}
.issues__card > *{position:relative}

.issues__title-stack{
  position: relative;
  display: grid;
  place-items: center;
  width: max-content;
  margin: 0 auto;
}
.issues__title-stack .en{
  grid-area: 1 / 1;
  text-align: center;
  line-height: 1;
}
.issues__title-stack .section_title{
  grid-area: 1 / 1;
  z-index: 1;
  display: block;
  text-align: center;
  font-size: 24px;
  transform: translateY(50px);
}

.issues__head .issues__intro{
  width: 550px;
  max-width: 100%;
  margin: 48px auto 40px;
}

.issues__metrics{
  margin-top: var(--space-6);
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
  background:rgba(255,255,255,.7);

}
.issues__source{
  margin-top: 10px;
  text-align: right;
  font-size: 12px;
  color: rgba(24,40,50,.85);
}
.issues__source a{
  color: #2f6fb3;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
.issues__source a:hover{
  color: #1f5892;
}

.metric{
  position: relative;
  padding:32px 32px 20px;
  text-align: center;
}
.metric:nth-child(even)::before{
  content:"";
  position:absolute;
  left:-7px;
  top:16px;
  bottom:16px;
  border-left:1px dashed rgba(27,65,88,.45);
}
.metric:nth-child(n + 3)::after{
  content:"";
  position:absolute;
  left:16px;
  right:16px;
  top:-7px;
  border-top:1px dashed rgba(27,65,88,.45);
}

.metric_title{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.metric_title p{
  margin: 0;
  font-size: var(--fs-md);
  font-weight: 500;
  line-height: 1.3;
  color: #607889;
}
.metric__sub{
  margin: 0;
  font-size: var(--fs-sm);
  line-height: 1.3;
  color: #888;
}
.metric__value{
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 12px;
  font-family:var(--ff-jp);
  color:#182832;
  font-size:68px;
  line-height:0.85;
  letter-spacing: -0.01em;
      margin-bottom: 12px;
}
.metric__value span{
  margin-top:20px;
  font-size: var(--fs-md);
  line-height: 1.3;
  text-align: left;
  white-space: pre-line;
}
.metric__value__span{
  font-size: 40px !important;
}

.issues__cta{text-align:center}

.issues__cta .btn.btn--outline.btn--wide{
  border-color:#fff;
  color:#fff;
}

.issues__cta .btn.btn--outline.btn--wide .btn__arrow{
  color:#fff;
}

.home .issues__source{
  color:#cad7e0;
}

.home .issues__source a{
  color:inherit;
}

/* =========================
  Activities
========================= */
.activities__list{
  margin-top:36px;
  display:grid;
  gap:120px;
}

/* ✅ C対応：flex設計に統一（grid関連は削除） */
.act{
  display:flex;
  gap:56px;
  align-items:flex-start;
  min-width: 0;
  max-width: 100%;
}

/* ✅ 2番目だけ左右反転 */
.activities__list .act:nth-child(2){
  flex-direction: row-reverse;
}

.act__content{
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding-bottom: 60px;
  border-bottom: 1px solid rgba(27,27,27,.16);
}
.act__content .p_sans{
  width: 100%;
  max-width: 500px;
}

.act__tagline{
  display:flex;
  align-items:center;
  gap: var(--space-2);
  font-family:var(--ff-jp);
  font-size: var(--fs-sm);
  color:#182832;
}

.act__dot__purple,.act__dot__green,.act__dot__blue{
  width:10px;height:10px;border-radius:50%;
  flex:0 0 10px;
}
.act__dot__purple{background:#7C779C;}
.act__dot__green{background:#297571;}
.act__dot__blue{background:#2C678D;}

.act__tag__purple{ color:#7C779C; }
.act__tag__green{ color:#297571; }
.act__tag__blue{ color:#2C678D; }
.act__tag__purple,.act__tag__green,.act__tag__blue{
  font-family:var(--ff-en);
  font-size:16px;
}

.act__no{
  font-family: var(--ff-en);
  font-size:28px;
  line-height:1;
  letter-spacing:.04em;
  color:#182832;
  flex:0 0 auto;
}
.act__title{
  margin:32px 0 28px;
  display:flex;
  align-items:baseline;
  gap:24px;
  font-family:"Noto Serif JP", serif;
  font-size:48px;
  letter-spacing:.06em;
  line-height:1.2;
  color:#182832;
}
.act__heading{
  font-size:32px;
  font-weight: 600;
}

.act__orb{
  width:100%;
  max-width:500px;
  aspect-ratio: 1 / 1;
  position:relative;
  display:block;
  overflow: visible;
}

.act__orb-clip{
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: 50%;
  z-index: 1;
}
.activities .act__orb--purple,
.activities .act__orb--blue{
  opacity: 0;
  transform: translateX(44px);
}
.activities .act__orb--green{
  opacity: 0;
  transform: translateX(-44px);
}
.activities .act__orb--purple.is-visible,
.activities .act__orb--blue.is-visible,
.activities .act__orb--green.is-visible{
  animation: act-orb-fade-in .7s ease forwards;
}
@keyframes act-orb-fade-in{
  to{
    opacity: 1;
    transform: translateX(0);
  }
}

.act__orb-media{
  position:absolute;
  inset:0;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  z-index:1;
}

.act__orb--purple .act__orb-media{
  background-image: url("./img/act_circle_purple.webp");
  transition: background-image 0.5s, transform 0.5s ease;
}
.act__orb--purple:hover .act__orb-media{
  background-image: url("./img/act_circle_purple_hover.webp");
  transform: scale(1.04);
}

.act__orb--green .act__orb-media{
  background-image: url("./img/act_circle_green.webp");
  transition: background-image 0.5s, transform 0.5s ease;
}
.act__orb--green:hover .act__orb-media{
  background-image: url("./img/act_circle_green_hover.webp");
  transform: scale(1.04);
}

.act__orb--blue .act__orb-media{
  background-image: url("./img/act_circle_blue.webp");
  transition: background-image 0.5s, transform 0.5s ease;
}
.act__orb--blue:hover .act__orb-media{
  background-image: url("./img/act_circle_blue_hover.webp");
  transform: scale(1.04);
}

@media (prefers-reduced-motion: reduce){
  .activities .act__orb--purple,
  .activities .act__orb--green,
  .activities .act__orb--blue{
    opacity: 1;
    transform: none;
    animation: none;
  }
}

.act__btn{
  position:absolute;
  right:0px;
  bottom:60px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  border:1px solid #182832;
  padding:12px 32px;
  font-family:var(--ff-jp);
  font-size:20px;
  font-weight:500;
  border-radius:0;
  color:#182832;
}

.act__btn::after{
  content:"→";
  position:absolute;
  right:20px;
  top:100%;
  margin-top:4px;
  transform:translateY(-4px);
  opacity:0;
  font-size:28px;
  line-height:1;
  color:#182832;
  transition:opacity 0.3s ease, transform 0.3s ease;
  pointer-events:none;
}

.act__orb:hover .act__btn::after,
.act__orb:focus-visible .act__btn::after{
  opacity:1;
  transform:translateY(0);
}

/* =========================
  About Us
========================= */
.about .content{ position: relative; }

.about__layout{
  width: 100%;
  max-width: 100%;
  display:grid;
  grid-template-columns: minmax(520px, 1fr) 380px;
  gap:24px;
  align-items:start;
}

.about__left{ min-width: 0; padding-top:0; position:relative; }
.about__left .title-en{ white-space: nowrap; }

.about__title-jp{
  margin:-24px 0 0;
  font-family:var(--ff-jp);
  font-size:40px;
  line-height:1.2;
  color:#182832;
}

.about__center{
  position:absolute;
  left:50%;
  bottom:0;
  transform:translateX(-50%);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  width:min(390px, 100%);
  z-index:0;
}

.about__visual{
  width:320px;
  height:580px;
  max-width:100%;
  overflow:hidden;
  background:rgba(255,255,255,.15);
}
.about__visual-media{
  width:100%;
  height:100%;
  background-image: url("./img/about__visual.webp");
  background-position:top center;
  background-repeat:no-repeat;
  background-size:cover;
}

.about__right{
  width:380px;
  max-width:380px;
  padding-top:0;
  position:relative;
  z-index:1;
  display: grid;
  gap:40px;
}
.about__right > *{ width:100%; }
.about__right .p_serif{
  width: 100%;
  max-width: 380px;
}

.about__menu{
  border:1px solid rgba(27,27,27,.55);
  background:rgba(255,255,255,.18);
  margin-bottom: 86px;
  max-width: 100%;
  box-sizing: border-box;
}
.about__menu-item{
  display:grid;
  grid-template-columns: 14px 1fr auto;
  align-items:center;
  gap:16px;
  padding:20px 20px;
  border-top:1px solid rgba(27,27,27,.55);
  font-family:var(--ff-jp);
  font-size:16px;
  color:#182832;
  transition: 0.5s;
}
.about__menu-item:first-child{ border-top:0; }

.about__menu-item:hover{
  background-color: #978eb8;
  color:#fff;
}

.about__menu-dot{
  width:12px;height:12px;border-radius:50%;
  background:#978eb8;
  transition: 0.5s;
}
.about__menu-item:hover .about__menu-dot{ background:#fff; }

.about__menu-arrow{
  line-height:1;
}

/* =========================
  News
========================= */
.news__grid{
  display:grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap:48px;
  align-items:start;
}
.news__left{
  background:#ffffff80;
  padding: var(--space-8) var(--space-10);
}
.news__list{ display:grid; gap:0; }
.news__item{
  display:block;
  padding: var(--space-4) 0 var(--space-5);
  border-bottom:1px solid rgba(27,27,27,.30);
  transition: 0.5s;
}
.news__item[hidden]{
  display:none !important;
}
.news__item:hover{
  opacity: 0.5;
  padding-left: 4px;
}
.news__meta{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom: var(--space-4);
}
.news__date{
  font-family:var(--ff-jp);
  font-size: var(--fs-sm);
  color:#182832;
}
.news__tag{
  border:1px solid #6b8fa8;
  color:#6b8fa8;
  border-radius:999px;
  padding: var(--space-1) var(--space-3);
  font-size:12px;
  line-height:1.4;
}
.news__txt{
  margin:0;
  font-family: var(--ff-jp);
  color:#182832;
  font-size:16px;
  line-height:1.8;
  font-weight:500;
}
.news__right{
  min-height:100%;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.news__title-wrap{
  position: relative;
  display: grid;
  place-items: start;
  width: max-content;
  min-height: 210px;
  text-align: left;
}

.news__title-wrap .en{
  grid-area: 1 / 1;
  line-height: 1;
}

.news__title-wrap .section_title{
  grid-area: 1 / 1;
  z-index: 1;
  transform: translateY(90px);
}

.news-detail{
  padding-top: 28px;
}

.news-detail__article{
  width: min(1100px, 100%);
      margin-top: 100px;
}

.news-detail__head{
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(24, 40, 50, 0.18);
  margin-bottom: 26px;
}

.news-detail__title{
  margin: 0;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-lg), 2.4vw, var(--fs-2xl));
  line-height: 1.6;
  color: #182832;
  font-weight: 600;
}

.news-detail__hero{
  width: 100%;
  height: clamp(220px, 30vw, 340px);
  background: #d9d9d9;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  margin-bottom: 26px;
}

.news-detail__toc{
  width: min(250px, 100%);
  background: rgba(255, 255, 255, 0.55);
  padding: var(--space-5) var(--space-4);
  margin-bottom: var(--space-7);
}

.news-detail__toc-title{
  margin: 0 0 8px;
  font-family: var(--ff-jp);
  font-size: var(--fs-sm);
  color: #3f5568;
  font-weight: 600;
}

.news-detail__toc-list{
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-2);
}

.news-detail__toc-list li{
  position: relative;
  padding-left: 1em;
}

.news-detail__toc-list li::before{
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
}

.news-detail__toc-list a{
  font-family: var(--ff-body);
  font-size: var(--fs-xs);
  color: #5a7ea2;
  text-decoration: underline;
}


.news-detail__lead{
  margin: 0 0 var(--space-6);
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 2;
}

.news-detail__section{
  margin-bottom: 32px;
}

.news-detail__content{
  color: #1f2f3d;
}

.news-detail__content > *:first-child{
  margin-top: 0;
}

.news-detail__content p{
  margin: 0 0 32px;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 2;
  color: #1f2f3d;
}

.news-detail__h3{
 margin: 0 0 var(--space-2);
  padding-left: var(--space-3);
  border-left: 3px solid #665E9C;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-md), 2vw, var(--fs-lg));
  line-height: 1.6;
  letter-spacing: 0.03em;
  font-weight: 600;
}

.news-detail__content h2,
.news-detail__content h3{
  margin: 0 0 var(--space-2);
  padding-left: var(--space-3);
  border-left: 3px solid #665E9C;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-md), 2vw, var(--fs-lg));
  line-height: 1.6;
  letter-spacing: 0.03em;
  font-weight: 600;
}

.news-detail__h4{
  margin: 0 0 var(--space-2);
  padding-left: var(--space-6);
  position: relative;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-sm), 1.7vw, var(--fs-md));
  line-height: 1.6;
  letter-spacing: 0.03em;
  font-weight: 600;
}

.news-detail__content h4{
  margin: 0 0 var(--space-2);
  padding-left: var(--space-6);
  position: relative;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-sm), 1.7vw, var(--fs-md));
  line-height: 1.6;
  letter-spacing: 0.03em;
  font-weight: 600;
}

.news-detail__h4::before{
  content: "";
  position: absolute;
  left: 2px;
  top: .45em;
  width: 10px;
  height: 14px;
  border-right: 2px solid #665E9C;
  border-bottom: 2px solid #665E9C;
  transform: rotate(45deg);
}

.news-detail__content h4::before{
  content: "";
  position: absolute;
  left: 2px;
  top: .45em;
  width: 10px;
  height: 14px;
  border-right: 2px solid #665E9C;
  border-bottom: 2px solid #665E9C;
  transform: rotate(45deg);
}

.news-detail__h5{
  margin: 0 0 var(--space-2);
  padding-bottom: var(--space-2);
  position: relative;
  border-bottom: 1px dashed #665E9C;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-sm), 1.5vw, var(--fs-md));
  line-height: 1.6;
  letter-spacing: 0.03em;
  font-weight: 500;
}

.news-detail__content h5{
  margin: 0 0 var(--space-2);
  padding-bottom: var(--space-2);
  position: relative;
  border-bottom: 1px dashed #665E9C;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-sm), 1.5vw, var(--fs-md));
  line-height: 1.6;
  letter-spacing: 0.03em;
  font-weight: 500;
}

.news-detail__h6{
  margin: 0 0 8px;
  padding-left: var(--space-4);
  position: relative;
  font-family: var(--ff-jp);
  font-size: var(--fs-sm);
  line-height: 1.6;
  letter-spacing: 0.02em;
  font-weight: 500;
}

.news-detail__content h6{
  margin: 0 0 8px;
  padding-left: var(--space-4);
  position: relative;
  font-family: var(--ff-jp);
  font-size: var(--fs-sm);
  line-height: 1.6;
  letter-spacing: 0.02em;
  font-weight: 500;
}

.news-detail__h6::before{
  content: "";
  position: absolute;
  left: 0;
  top: .8em;
  width: 10px;
  border-top: 2px solid #665E9C;
}

.news-detail__content h6::before{
  content: "";
  position: absolute;
  left: 0;
  top: .8em;
  width: 10px;
  border-top: 2px solid #665E9C;
}

.news-detail .p_sans{
  margin: 0;
  font-size: var(--fs-sm);
  line-height: 2;
  color: #1f2f3d;
  margin: 0 0 32px;
}

.news-detail__content ul,
.news-detail__content ol{
  margin: 8px 0 32px;
  padding-left: var(--space-5);
  display: grid;
  gap: 4px;
}

.news-detail__content ul li{
  list-style: disc;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.9;
  color: #1f2f3d;
}

.news-detail__content ol li{
  list-style: decimal;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.9;
  color: #1f2f3d;
}

.news-detail__content img{
  display: block;
  max-width: 100%;
  height: auto;
  margin: var(--space-5) 0 var(--space-8);
}

.news-detail__list{
  margin: 8px 0 0;
  padding-left: var(--space-5);
  display: grid;
  gap: 4px;
}

.news-detail__list li{
  list-style: disc;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.9;
  color: #1f2f3d;
}

.news-detail__image{
  margin: var(--space-5) 0;
  width: 100%;
  height: clamp(160px, 22vw, 180px);
  background: #d9d9d9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ff-body);
  font-size: var(--fs-xs);
  color: #4a4a4a;
}

.news-detail__share{
  margin-top: 30px;
  text-align: center;
}

.news-detail__share-title{
  margin: 0 0 var(--space-2);
  font-family: var(--ff-body);
  font-size: 12px;
  color: rgba(24, 40, 50, .7);
}

.news-detail__share-links{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.news-detail__share-links a{
  width: clamp(78px, 22vw, 100px);
  height: clamp(30px, 3.4vw, 32px);
  border: 1px solid transparent;
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ff-body);
  font-size: var(--fs-xs);
  font-weight: 600;
  line-height: 1;
  color: #fff;
  transition: opacity .25s ease;
}

.news-detail__share-links a img{
  width: 16px;
  height: 16px;
  display: block;
}

.news-detail__share-links a:hover{
  opacity: .82;
}

.news-detail__share-links a:nth-child(1){
  background: #1877f2;
  border-color: #1877f2;
}

.news-detail__share-links a:nth-child(2){
  background: #111;
  border-color: #111;
}

.news-detail__share-links a:nth-child(3){
  background: #06c755;
  border-color: #06c755;
}

.news-detail__share-links a:nth-child(4){
  background: #fff;
  border-color: #cfd6de;
  color: #4a5f72;
}

.news-detail__pager{
  margin-top: var(--space-5);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
}

.news-detail__pager-btn{
  width: clamp(36px, 4vw, 40px);
  height: clamp(36px, 4vw, 40px);
  border: 1px solid #c9d0d8;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-xs);
  color: #5f7283;
}

.news-detail__pager-btn .btn__arrow{
  position: static;
  transform: none;
  line-height: 1;
}

.news-detail__pager-btn--prev .btn__arrow{
  transform: rotate(180deg);
}

@media (max-width: 768px){
  .news-detail{
    padding-top: 12px;
  }

  .news-detail__hero{
    margin-bottom: var(--space-5);
  }

  .news-detail__toc{
    width: 100%;
    margin-bottom: 20px;
  }

  .news-detail__h3{
    margin-bottom: 8px;
    padding-left: 10px;
    border-left-width: 2px;
  }

  .news-detail__h4{
    margin-bottom: 8px;
    padding-left: var(--space-5);
  }

  .news-detail__h4::before{
    left: 1px;
    top: .42em;
    width: 8px;
    height: 12px;
    border-right-width: 1.5px;
    border-bottom-width: 1.5px;
  }

  .news-detail__h5{
    margin-bottom: 8px;
    padding-bottom: 5px;
  }

  .news-detail__h6{
    margin-bottom: 8px;
    padding-left: var(--space-4);
  }

  .news-detail__h6::before{
    top: .78em;
    width: 8px;
    border-top-width: 1.5px;
  }

  .news-detail__share{
    margin-top: 24px;
  }

  .news-detail__share-title{
    font-size: var(--fs-xs);
    margin-bottom: 8px;
  }

  .news-detail__share-links{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-2);
  }

  .news-detail__pager{
    margin-top: 16px;
    gap: var(--space-2);
  }

  .news-detail__pager-btn .btn__arrow{
    font-size: var(--fs-xs);
  }

  .news-detail__back{
    font-size: var(--fs-xs);
    padding-left: var(--space-5);
    padding-right: 42px;
  }

}

/* =========================
  Contact
========================= */
.contact{
  padding-top: 54px;
  padding-bottom: 34px;
  background:#fff;
}

.contact.reveal-section,
.contact.reveal-section.is-visible{
  opacity: 1;
  transform: none;
  transition: none;
  will-change: auto;
}

.contact .content{
  width:min(1340px, 100%);
  max-width:1340px;
  padding-left:0;
  padding-right:0;
}
.contact__panel{
  position: relative;
  width:min(1340px, 100%);
  margin:0 auto;
  padding: 88px var(--space-6) 80px;
  background-image:url("./img/bg_contact.webp");
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  text-align: center;
  overflow: hidden;
}
.contact__panel::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:420px;
  height:220px;
  transform:translateX(-50%);
  background: radial-gradient(circle at 50% 90%, rgba(142,120,184,.22), rgba(255,255,255,0) 72%);
  pointer-events:none;
}

/* =========================
  Footer
========================= */
.footer .site{ 
  margin:0 auto; 
  background:#fff;
padding: 0 20px;
}

.footer__inner{
  display:grid;
  grid-template-columns: 340px 1fr;
  align-items:center;
  gap:24px;
  padding:20px 0 120px;
  border-top:1px solid rgba(24,40,50,.25);
  max-width: 1340px;
  margin: 0 auto;
}

.footer__brand{display:inline-flex;align-items:center}
.footer__logo{
  width:200px;
  height:auto;
  display:block;
  transition: 0.5s;
}
.footer__logo:hover{ opacity: 0.5; }

.footer__nav{
  display:flex;
  justify-content:flex-end;
  gap:28px;
  flex-wrap:wrap;
}
.footer__nav a{
  font-family:var(--ff-jp);
  font-size:14px;
  color:#182832;
  transition: 0.5s;
}
.footer__nav a:hover{ opacity: 0.5; }

.footer__meta{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  padding:0 0 40px;
  max-width: 1340px;
  margin: 0 auto;
}
.footer__partner{ width:360px; display:block; }
.footer__partner-img{
  width:270px;
  height:auto;
  display:block;
  transition: 0.5s;
}
.footer__partner-img:hover{ opacity: 0.5; }

.footer__legal{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap: var(--space-4);
  color:#182832;
}
.footer__legal a,.footer__legal span{
  font-size:12px;
  transition: 0.5s;
  text-align: right;
}

.footer__legal span{
  color:#888;
}

.footer__legal a:hover{ opacity: 0.5; }

.footer__bottom{
  position:relative;
  padding:44px 0 52px;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}
.footer__headline{
  text-align:center;
  font-family:var(--ff-jp);
  font-size:44px;
  letter-spacing:.08em;
  color:#182832;
}
.footer__pagetop{
  position:absolute;
  right:4%;
  top:50%;
  transform:translateY(-50%);
  width:116px;
  height:116px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.footer__pagetop img{
  width:100%;
  height:100%;
  display:block;
  transition: 0.5s;
}
.footer__pagetop img:hover{
  opacity: 0.5;
  width: 95%;
  height: 95%;
}
/* =========================
  Issue page (main only)
========================= */
.subpage-page{
  background-image:url("./img/bg_noise.webp");
 background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

/* 見出し：32px / 下余白32px */
.subpage-h2{
  font-family: var(--ff-serif, "Noto Serif JP", serif);
  font-size: clamp(var(--fs-lg), 2.4vw, var(--fs-2xl));
  line-height: 1.65;
  letter-spacing: .06em;
  margin: 0 0 32px;
  color: #182832;
  font-weight: 600;
}
.subpage-h2--center{ text-align: center; }

.subpage-section--metrics .subpage-h2--center::after,
.subpage-section--gap .subpage-h2--center::after{
  content: "";
  display: block;
  width: 1px;
  height: 100px;
  margin: 16px auto 0;
  background: #182832;
}

.subpage-h3{
  font-family: var(--ff-serif, "Noto Serif JP", serif);
  font-size: 20px;
  line-height: 1.6;
  letter-spacing: .06em;
  margin: 0 0 var(--space-2);
  color: #182832;
  font-weight: 600;
  text-align: center;
}

.subpage-card--purple .subpage-h3::after{
  content: "";
  display: block;
  width: 90px;
  height: 4px;
  margin: 8px auto 0;
  background: #7C779C;
}
.subpage-card--blue .subpage-h3::after{
  content: "";
  display: block;
  width: 90px;
  height: 4px;
  margin: 8px auto 0;
  background: #2C678D;
}
.subpage-card--green .subpage-h3::after{
  content: "";
  display: block;
  width: 90px;
  height: 4px;
  margin: 8px auto 0;
  background: #297571;
}

/* ゴシック：16px */
.subpage-text,
.subpage-note,
.subpage-card__head-title{
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 2.0;
  letter-spacing: .03em;
  color: #182832;
}

.subpage-note{
  margin-top: var(--space-4);
  opacity: .85;
}
.subpage-note--center{ text-align:center; }

/* Hero */
.subpage-hero{
  padding: 180px 0 48px;
}
.subpage-hero__inner{
  position: relative;
  text-align: center;
}
.subpage-hero__title{
  font-family: var(--ff-serif, "Noto Serif JP", serif);
  font-size: clamp(var(--fs-2xl), 3vw, var(--fs-3xl));
  letter-spacing: .10em;
  margin: -28px 0 0;
  color:#182832;
  font-weight: 600;
  line-height: 1.25;
}

/* News list page */
.news-list{
  max-width: 1100px;
}

.news-list__filters{
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 28px;
  justify-content: center;
}

.news-list__filter{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: clamp(64px, 8vw, 72px);
  height: clamp(34px, 3.4vw, 38px);
  padding: 0 24px 0 20px;
  border: 1px solid #1f2f3d;
  border-radius: 999px;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  color: #1f2f3d;
  background: transparent;
  position: relative;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}

.news-list__filter::after{
  content: "";
  display: inline-block;
  margin-left: 8px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  transform: translateX(0);
  transition: transform .3s ease;
}

.news-list__filter:hover::after,
.news-list__filter:focus-visible::after{
  transform: translateX(4px);
}

.news-list__filter.is-active{
  background: #13293c;
  color: #fff;
}

.news-list__pager{
  margin-top: var(--space-12);
  display: flex;
  justify-content: center;
  gap: var(--space-5);
}

.news-list__page{
  width: clamp(32px, 3.3vw, 40px);
  height: clamp(32px, 3.3vw, 40px);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ff-en);
  font-size: clamp(var(--fs-sm), 1.35vw, var(--fs-md));
  line-height: 1;
  color: #fff;
  background: #aaaaaa;
}

.news-list__page.is-current{
  background: #13293c;
}

/* Section spacing */
.subpage-section{
  padding: 70px 0;
}
.subpage-section--metrics{
  padding-top: 70px;
}

.not-found-message .content{
  text-align: center;
}

.not-found-message .btn{
  margin: var(--space-6) auto 0;
}

/* 変化する社会…：左画像最大620px */
.subpage-pos{
  display: grid;
  grid-template-columns: minmax(0, 500px) minmax(0, 550px);
  gap: clamp(var(--space-6), 4vw, var(--space-12));
  align-items: start;
}
.subpage-pos__body{
  width: 100%;
  max-width: 550px;
}
.subpage-pos__media{
  max-width: 500px;
}
.subpage-pos__media img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0; /* PDF寄せ：角は基本なし */
}
.subpage-pos__media--business{
  max-width: 500px;
}
.subpage-pos__media--business img{
  width: 100%;
  margin: 0 auto;
}

.sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Contact page: form section */

.contact-form{
  width: min(1020px, 100%);
}

.contact-form__entry-guide{
  margin: 0 auto var(--space-6);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
  width: min(100%, 760px);
  min-width: 0;
  text-align: center;
}

.contact-form__entry-guide-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-2);
  min-width: 0;
}

.contact-form__entry-guide-link{
  margin: 0;
  text-decoration: none;
}

.contact-form__entry-guide-status{
  margin: 0;
  font-family: var(--ff-body);
  font-size: 12px;
  line-height: 1.7;
  color: #c64545;
  font-weight: 500;
}

.contact-form__entry-guide-link.is-disabled{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background: #d8d8d8;
  border-color: #d8d8d8;
  color: #8b8b8b;
  cursor: not-allowed;
  pointer-events: none;
}

.contact-form__entry-guide-link.is-disabled .btn__arrow{
  color: inherit;
}

.contact-form__entry-divider{
  display: none;
}

.contact-form__body{
  margin: 0;
}

.contact-form .wpcf7{
  width: 100%;
}

.contact-form .wpcf7 form{
  margin: 0;
}

.contact-form .wpcf7 form > p{
  margin: 0;
}


.contact-form__body br{
  display: none;
}

.contact-form .wpcf7-form-control-wrap{
  display: block;
  width: 100%;
}

.contact-form__row{
  display: grid;
  grid-template-columns: clamp(140px, 18vw, 180px) minmax(0, 1fr);
  gap: var(--space-6);
  align-items: center;
  margin-bottom: var(--space-6);
}

.contact-form__row > p{
  margin: 0;
  min-width: 0;
  display: contents;
}

.contact-form__row--textarea{
  display: grid;
  grid-template-columns: clamp(140px, 18vw, 180px) minmax(0, 1fr);
  gap: var(--space-6);
  margin-top: var(--space-8);
  align-items: start;
}

.contact-form__row--textarea > p{
  margin: 0;
  min-width: 0;
  display: contents;
}

.contact-form__row--textarea > p:last-child,
.contact-form__row--textarea .wpcf7-form-control-wrap{
  width: 100%;
  min-width: 0;
}

.contact-form__row--textarea .contact-form__textarea{
  display: block;
  width: 100% !important;
  max-width: 100%;
  box-sizing: border-box;
}

.contact-form__label{
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-2);
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  color: #182832;
  font-weight: 500;
  white-space: nowrap;
}

.contact-form__label--multiline{
  white-space: normal;
  line-height: 1.6;
}

.contact-form__label p{
  margin: 0;
}

.contact-form__req{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 34px;
  height: 24px;
  padding: 0 var(--space-2);
  border: 1px solid #d9534f;
  border-radius: 999px;
  color: #d9534f;
  font-size: var(--fs-xs);
  line-height: 1;
  font-weight: 700;
  white-space: nowrap;
}

.contact-form__req--optional,
.contact-form__req.is-optional{
  border-color: #888;
  color: #888;
}

.contact-form__input,
.contact-form__textarea{
  width: 100%;
  border: 1px solid #EAEAEA;
  background: #fff;
  color: #1f2f3d;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  padding: var(--space-2);
}

.contact-form__input:focus-visible,
.contact-form__textarea:focus-visible,
.entry-form__select:focus-visible{
  border-color: #6b8091;
}

.contact-form__input{
  height: clamp(44px, 4vw, 48px);
}

.contact-form__textarea{
  min-height: clamp(200px, 24vw, 280px);
  resize: vertical;
}

.contact-form__policy{
  margin: var(--space-12) 0 var(--space-5);
  text-align: center;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  color: #1f2f3d;
  line-height: 1.9;
}

.contact-form__policy a{
  color: #0000ee;
  text-decoration: underline;
}

.contact-form__body > .contact-form__policy{
  display: block;
  width: 100%;
}

.thanks-message .btn.btn--outline.btn--wide{
  display: flex;
  justify-content: center;
  margin: var(--space-6) auto 0;
}

.contact-form__agree{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  color: #1f2f3d;
  cursor: pointer;
  margin: 0;
  width: 100%;
  text-align: center;
}

.contact-form__body .btn.btn--outline.btn--wide{
  display: flex;
  justify-content: center;
  margin: var(--space-6) auto 0;
}

.contact-form .wpcf7-submit{
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(400px, 100%);
  min-height: 56px;
  margin: 0 auto;
  padding: var(--space-2) var(--space-12) var(--space-2) var(--space-6);
  border: 1px solid var(--line);
  background: transparent;
  color: #1f2f3d;
  font-family: var(--ff-jp);
  font-size: var(--fs-sm);
  font-weight: 600;
  letter-spacing: .04em;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  transition: .5s;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
  box-shadow: none;
}

.contact-form .wpcf7-submit:hover{
  background: #978eb8;
  color: #fff;
  border: 1px solid #fff;
}

.contact-form .wpcf7-spinner{
  position: absolute;
  top: 50%;
  left: auto;
  right: 12px;
  margin: 0;
  transform: translateY(-50%);
}

.contact-form .wpcf7-not-valid-tip{
  margin-top: var(--space-2);
  font-family: var(--ff-body);
  font-size: var(--fs-xs);
  line-height: 1.6;
}

.contact-form .wpcf7-response-output{
  margin: var(--space-6) auto 0 !important;
  padding: var(--space-3) var(--space-4) !important;
  max-width: 640px;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.7;
}

.contact-form .wpcf7-acceptance .wpcf7-list-item{
  margin: 0;
}

.contact-form .wpcf7-acceptance{
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
}

.contact-form__body > p.contact-form__agree{
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.contact-form__body > p:has(> .wpcf7-submit),
.contact-form__body > p:last-child{
  margin: var(--space-6) auto 0;
  display: block;
  width: min(400px, 100%);
  text-align: center;
  position: relative;
  line-height: 0;
}

.contact-form__body > p:last-child::after{
  content: "→";
  position: absolute;
  top: 50%;
  right: 18px;
  transform: translateY(-50%);
  font-size: 16px;
  line-height: 1;
  transition: .5s;
  pointer-events: none;
  color: #1f2f3d;
}

.contact-form__body > p:last-child:hover::after{
  color: #fff;
  transform: translateY(-50%) translateX(8px);
}

.contact-form .wpcf7-acceptance input{
  position: static;
  width: 18px;
  height: 18px;
  margin: 0 var(--space-2) 0 0;
  accent-color: #1f2f3d;
  pointer-events: auto;
  vertical-align: middle;
  transform: translateY(5px);
}

.contact-form .wpcf7-acceptance .wpcf7-list-item-label{
  padding-left: 0;
  display: inline-flex;
  align-items: center;
  line-height: 1.4;
}

.confirm-form__lead{
  margin: 0 0 var(--space-6);
  text-align: center;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.9;
  color: #1f2f3d;
}

.contact-form__row--confirm{
  display: grid;
  grid-template-columns: clamp(140px, 18vw, 180px) minmax(0, 1fr);
  gap: var(--space-6);
  align-items: start;
  margin-bottom: var(--space-6);
}

.entry-confirm__label-wrap{
  display: block;
  white-space: normal;
  line-height: 1.6;
  text-align: right;
}

.contact-form__row--confirm .contact-form__label{
  min-width: 0;
  white-space: normal;
  line-height: 1.6;
  text-align: right;
  color: #888;
}

.contact-form__row--confirm .contact-form__label.contact-form__label--multiline,
.contact-form__row--confirm .entry-confirm__label-wrap{
  white-space: normal;
  word-break: break-word;
}

.contact-form__row--confirm .contact-form__label p,
.contact-form__row--confirm .entry-confirm__label-wrap p{
  margin: 0;
  white-space: normal;
  word-break: break-word;
}

.confirm-form__value{
  margin: 0;
  min-height: 48px;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.8;
  color: #1f2f3d;
}

.confirm-form__value p{
  margin: 0;
}

.contact-form__row__body{
  background: #ffffff6e;
  padding: var(--space-7);
  width: 100%;
}

.contact-form__row--confirm .contact-form__row__body{
  display: block;
  background: rgba(255, 255, 255, 0.68);
  padding: var(--space-7);
  width: 100%;
  min-height: 48px;
  box-sizing: border-box;
}


.contact-form__row--textarea .contact-form__row__body{
  align-items: flex-start;
}

.confirm-form__actions{
  margin-top: var(--space-6);
  display: flex;
  justify-content: center;
  gap: var(--space-5);
  flex-wrap: wrap;
}

.confirm-form__actions > p{
  margin: 0;
  display: flex;
  justify-content: center;
  gap: var(--space-5);
  flex-wrap: wrap;
  width: 100%;
  position: relative;
}

.confirm-form__actions br{
  display: none;
}

.confirm-form__actions .btn.btn--outline.btn--wide{
  margin: 0;
}

.confirm-form__actions .wpcf7-form-control{
  margin: 0;
}

.confirm-form__actions .wpcf7-spinner{
  left: auto;
  right: 0;
  transform: translateY(-50%);
}

.confirm-form__actions .wpcf7-previous,
.confirm-form__actions .wpcf7-submit{
  background-repeat: no-repeat;
  background-size: 12px auto;
  text-align: center;
}

.confirm-form__actions .wpcf7-previous{
  padding-left: 48px;
  padding-right: 48px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M11 5H1M5 9L1 5l4-4' fill='none' stroke='%231f2f3d' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: left 18px center;
}

.confirm-form__actions .wpcf7-submit{
  padding-left: 22px;
  padding-right: 48px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M1 5h10M7 1l4 4-4 4' fill='none' stroke='%231f2f3d' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: right 18px center;
}

.confirm-form__actions .wpcf7-previous:hover,
.confirm-form__actions .wpcf7-submit:hover{
  background-color: #978eb8;
  background-repeat: no-repeat;
  background-size: 12px auto;
  color: #fff;
  border-color: #fff;
}

.confirm-form__actions .wpcf7-previous:hover{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M11 5H1M5 9L1 5l4-4' fill='none' stroke='%23ffffff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: left 18px center;
}

.confirm-form__actions .wpcf7-submit:hover{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M1 5h10M7 1l4 4-4 4' fill='none' stroke='%23ffffff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: right 18px center;
}

.confirm-form__back.btn--outline{
  padding-left: 48px;
  padding-right: 48px;
}

.confirm-form__back .btn__arrow{
  left: 18px;
  right: auto;
}

.confirm-form__back.btn--outline:hover{
  background: #999;
  color: #fff;
  border-color: #999;
}

.confirm-form__actions .wpcf7-previous.confirm-form__back.btn--outline:hover{
  background: #888;
  color: #fff;
  border-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M11 5H1M5 9L1 5l4-4' fill='none' stroke='%23ffffff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 12px auto;
  background-position: left 18px center;
}

.confirm-form__back.btn--outline:hover .btn__arrow{
  left: 10px;
  right: auto;
}

/* Entry form extensions */
.entry-form{
  width: min(1060px, 100%);
}

.entry-form .contact-form__row,
.entry-form .contact-form__row--textarea,
.entry-form .entry-form__row--checks{
  grid-template-columns: clamp(180px, 24vw, 260px) minmax(0, 1fr);
}

.entry-form .contact-form__label--multiline{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  justify-content: stretch;
  gap: 8px;
  text-align: right;
}

.entry-form__select{
  width: clamp(100px, 11vw, 140px);
  height: clamp(44px, 4vw, 46px);
  border: 1px solid #EAEAEA;
  background: #fff;
  color: #1f2f3d;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  display: inline-block;
  padding: 0 var(--space-8) 0 var(--space-2);
  line-height: 44px;
  text-align: center;
  text-align-last: center;
  vertical-align: middle;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, #1f2f3d 50%), linear-gradient(135deg, #1f2f3d 50%, transparent 50%);
  background-position: calc(100% - 16px) 50%, calc(100% - 10px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  box-sizing: border-box;
}

.entry-form__row--checks{
  display: grid;
  grid-template-columns: clamp(140px, 18vw, 180px) minmax(0, 1fr);
  gap: var(--space-6);
  align-items: start;
}

.entry-form__checks{
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-6);
  padding-top: 4px;
}

.entry-form__checks label{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  color: #1f2f3d;
  position: relative;
  cursor: pointer;
}

.entry-form__checks input{
  position: static;
  opacity: 1;
  width: 18px;
  height: 18px;
  margin: 0;
  pointer-events: auto;
  accent-color: #1f2f3d;
  flex: 0 0 18px;
}

.entry-form__checks span{
  position: static;
  padding-left: 0;
}

.entry-form__checks span::after{
  content: none;
}

.entry-form textarea::placeholder{
  color: #9aa0a6;
}

@media (max-width: 768px){
  .contact-form{
    width: 100%;
  }

  .contact-form__body{
    width: 100%;
  }

  .news-list__filters{
    margin-bottom: 18px;
  }
  .news-list__filter{
    min-width: 64px;
    height: 34px;
  }
  .news-list__pager{
    margin-top: 32px;
    gap: 12px;
  }
  .news-list__page{
    width: 40px;
    height: 40px;
    font-size: var(--fs-md);
  }
  .contact-form__row{
    grid-template-columns: 1fr;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
  }

  .contact-form__entry-guide{
    margin: 0 auto var(--space-2);
    grid-template-columns: 1fr;
    gap: var(--space-3);
    padding: 0 0 var(--space-4);
    text-align: center;
  }

  .contact-form__entry-divider{
    display: none;
  }

  .contact-form__row > p{
    display: contents;
  }

  .contact-form__label{
    justify-content: flex-start;
    font-size: var(--fs-sm);
  }

  .contact-form__row--textarea{
    grid-template-columns: 1fr;
    gap: var(--space-2);
    margin-top: var(--space-3);
  }

  .entry-form .contact-form__row,
  .entry-form .contact-form__row--textarea,
  .entry-form .entry-form__row--checks{
    grid-template-columns: 1fr;
  }

  .entry-form .contact-form__label--multiline{
    display: inline-flex;
    grid-template-columns: none;
    align-items: center;
    justify-content: flex-start;
    gap: var(--space-2);
  }

  .entry-form__row--checks{
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }

  .entry-form__checks{
    padding-top: 0;
  }

  .contact-form__input{
    height: 48px;
  }

  .contact-form__textarea{
    min-height: 200px;
  }

  .contact-form__policy{
    margin: var(--space-7) 0 var(--space-3);
    font-size: var(--fs-sm);
    line-height: 1.8;
  }

  .contact-form__agree{
    justify-content: flex-start;
    font-size: var(--fs-sm);
  }

  .confirm-form__lead{
    margin-bottom: var(--space-4);
    font-size: var(--fs-sm);
    line-height: 1.8;
  }

  .contact-form__row--confirm{
    grid-template-columns: 1fr;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
  }

  .confirm-form__value{
    min-height: 44px;
    padding: 0;
    font-size: var(--fs-sm);
    line-height: 1.7;
  }



  .confirm-form__actions{
    margin-top: var(--space-5);
    gap: var(--space-3);
  }

  .entry-confirm__label-wrap{
    text-align: left;
  }

  .entry-form__select{
    width: 140px;
    height: 44px;
    font-size: var(--fs-sm);
  }
  .entry-form__checks{
    gap: var(--space-2) var(--space-4);
  }
  .entry-form__checks label{
    font-size: var(--fs-sm);
  }
  .entry-form__checks input{
    width: 18px;
    height: 18px;
  }
}

/* About: mission section */


.about-mission{
  border-top: 1px solid rgba(24,40,50,0.9);
  padding: 0;
}

.about-mission__head{
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: clamp(var(--space-4), 2.4vw, var(--space-7));
  align-items: center;
  padding: clamp(var(--space-5), 2.4vw, var(--space-8)) clamp(var(--space-4), 2.2vw, var(--space-7)) clamp(var(--space-6), 2.8vw, var(--space-10));
  border-bottom: 1px solid rgba(24,40,50,0.9);
}

.about-mission__en{
  margin: 0;
  font-family: var(--ff-en);
  font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-2xl));
  line-height: 1.1;
  color: transparent;
  -webkit-text-stroke: 1px #bcb8c7;
  text-align: center;
}

.about-mission__title{
  margin: 0;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-2xl));
  line-height: 1.9;
  letter-spacing: .04em;
  color: #1e3346;
  font-weight: 600;
}

.about-mission__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
  padding-top: var(--space-5);
}

.about-mission__card{
  background: #ffffffb3;
  padding: clamp(var(--space-5), 2.5vw, var(--space-5)) clamp(var(--space-5), 2.2vw, var(--space-5)) clamp(var(--space-5), 2.2vw, var(--space-5));
}

.about-mission__no{
  margin: 0;
  text-align: center;
  font-family: var(--ff-en);
  font-size: clamp(var(--fs-lg), 1.9vw, var(--fs-xl));
  line-height: 1;
  color: #9f96be;
  font-weight: 600;
}

.about-mission__card-title{
  margin: var(--space-3) 0 0;
  text-align: center;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-md), 1.8vw, var(--fs-lg));
  line-height: 1.75;
  color: #1f2f3d;
  font-weight: 600;
}

.about-mission__card-title::after{
content: "";
    display: block;
    width: 90px;
    height: 4px;
    margin: var(--space-5) auto var(--space-7);
  background: #7f74ad;
}

.about-mission__card-text{
  margin: 0;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.95;
  color: #1f2f3d;
}

/* About: role section */


.about-role.subpage-section--metrics{
  padding-top: 64px;
}

.about-role .subpage-h2--center::after{
  display: none;
}

.about-role .subpage-h2{
  margin-bottom: var(--space-6);
  font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-2xl));
  line-height: 1.7;
}

.about-role__lead{
  margin: 0 auto var(--space-8);
  text-align: center;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 2;
  color: #243747;
}

.about-role__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
}

.about-role__card{
  background: #ffffffb3;
  padding: clamp(var(--space-5), 1.9vw, var(--space-5)) var(--space-4) clamp(var(--space-5), 1.6vw, var(--space-5));
}

.about-role__card--wide{
  grid-column: 1 / 2;
}

.about-role__card-title{
  margin: 0;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-md), 1.7vw, var(--fs-lg));
  line-height: 1.6;
  color: #1f2f3d;
  font-weight: 600;
  padding-bottom: var(--space-4);
  border-bottom: 1px solid rgba(24,40,50,0.22);
  margin-bottom: var(--space-4);
}

.about-role__card-title::before{
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #7d9bb2;
  flex: 0 0 10px;
}

.about-role__card-text{
  margin: 0;
  max-width: 505px;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.95;
  color: #243747;
}

/* About: executives section */
.about-executives__grid{
  display: grid;
  gap: var(--space-4);
}

#executives .subpage-h2--center::after{
  display: none;
}

#executives .subpage-h2{

  margin-bottom: var(--space-6);
}

#executives .content + .content{
  margin-top: 56px;
}

.about-executives__grid--officers{
  grid-template-columns: 1fr;
  margin-bottom: var(--space-10);
}

.about-executives__grid--advisors{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.about-executives__card{
  background: #ffffffb3;
  padding: clamp(var(--space-5), 1.9vw, var(--space-5)) clamp(var(--space-5), 1.7vw, var(--space-5)) clamp(var(--space-5), 1.6vw, var(--space-5));
}

.about-executives__card-head{
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding-bottom: var(--space-4);
  margin-bottom: var(--space-4);
  border-bottom: 1px solid rgba(24, 40, 50, 0.22);
}

.executives__tag{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-1) var(--space-2);
  border: 1px solid #65879D;
  color: #65879D;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.2;
}

.about-executives__card-title{
  margin: 0;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-md), 1.8vw, var(--fs-lg));
  line-height: 1.35;
  color: #1f2f3d;
  font-weight: 600;
}

.about-executives__card-text{
  margin: 0;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.95;
  color: #243747;
}

/* About: outline section */
.about-outline{
  background: #fff;
}

.about-outline .subpage-h2--center::after{
  display: none;
}

.about-outline__layout{
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: clamp(var(--space-5), 3vw, var(--space-10));
  align-items: start;
}

.about-outline__title{
  margin: 0;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-2xl));
  line-height: 1.35;
  color: #1d303f;
  font-weight: 600;
  padding-top: 8px;
}

.about-outline__table{
  margin: 0;
}

.about-outline__row{
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: clamp(var(--space-4), 2vw, var(--space-7));
  padding: clamp(var(--space-4), 1.8vw, var(--space-5)) 0;
  border-top: 1px solid rgba(24,40,50,0.16);
}

.about-outline__row:first-child{
  padding-top: 0;
  border-top: 0;
}

.about-outline__row dt,
.about-outline__row dd{
  margin: 0;
  color: #243747;
  font-family: var(--ff-body);
}

.about-outline__row dt{
  font-size: var(--fs-sm);
  line-height: 2;
  font-weight: 500;
}

.about-outline__row dd{
  font-size: var(--fs-sm);
  line-height: 2;
}

@media (max-width: 1024px){
  .about-mission__head{
    grid-template-columns: 220px 1fr;
    padding: var(--space-5) var(--space-4) var(--space-7);
  }
  .about-mission__en{
    font-size: var(--fs-xl);
  }
  .about-mission__title{
    font-size: var(--fs-lg);
    line-height: 1.8;
  }
  .about-mission__card{
    padding: var(--space-6) var(--space-5);
  }
  .about-mission__card-title{
    font-size: var(--fs-md);
  }
  .about-role__card-title{
    font-size: var(--fs-md);
  }
  .about-executives__card-title{
    font-size: var(--fs-lg);
  }
  .about-outline__layout{
    grid-template-columns: 280px 1fr;
    gap: var(--space-7);
  }
  .about-outline__title{
    font-size: var(--fs-2xl);
  }
  .about-outline__row{
    grid-template-columns: 130px 1fr;
    gap: var(--space-6);
    padding: var(--space-6) 0;
  }
  .about-outline__row dt{
    font-size: var(--fs-sm);
  }
}

@media (max-width: 768px){
  .about-mission__head{
    grid-template-columns: 1fr;
    gap: var(--space-2);
    padding: var(--space-5) 0;
  }
  .about-mission__en{
    text-align: left;
    font-size: var(--fs-lg);
  }
  .about-mission__title{
    font-size: var(--fs-md);
    line-height: 1.75;
  }
  .about-mission__grid{
    grid-template-columns: 1fr;
    gap: var(--space-2);
    padding-top: var(--space-3);
  }
  .about-mission__no{
    font-size: var(--fs-2xl);
  }
  
  .about-mission__card-title::after{
    width: 74px;
    height: 4px;
    margin: var(--space-2) auto var(--space-4);
  }
  .about-role{
    padding-top: 56px;
  }
  .about-role__lead{
    margin-bottom: var(--space-6);
    text-align: left;
    font-size: var(--fs-sm);
    line-height: 1.9;
  }
  .about-role__grid{
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }
  .about-role__card--wide{
    grid-column: auto;
  }
  .about-role__card{
    padding: var(--space-5) var(--space-4) var(--space-4);
  }
  .about-role__card-title{
    font-size: var(--fs-md);
    padding-bottom: var(--space-2);
  }
  .about-role__card-text{
    font-size: var(--fs-sm);
    line-height: 1.85;
  }
  .about-executives__grid--advisors{
    grid-template-columns: 1fr;
  }
  #executives .content + .content{
    margin-top: var(--space-10);
  }
  .about-executives__card{
    padding: var(--space-5) var(--space-4) var(--space-4);
  }
  .about-executives__card-head{
    gap: var(--space-2);
    padding-bottom: var(--space-2);
    margin-bottom: var(--space-2);
  }
  .about-executives__card-title{
    font-size: var(--fs-md);
    line-height: 1.4;
  }
  .about-executives__card-text{
    font-size: var(--fs-sm);
    line-height: 1.85;
  }
  .about-outline{
    padding-top: 56px;
  }
  .about-outline__layout{
    grid-template-columns: 1fr;
    gap: var(--space-3);
  }
  .about-outline__title{
    font-size: var(--fs-xl);
    padding-top: 0;
    margin-bottom: var(--space-6);
    text-align: center;
  }
  .about-outline__row{
    grid-template-columns: 1fr;
    gap: var(--space-2);
    padding: var(--space-5) 0;
  }
  .about-outline__row dt{
    font-size: var(--fs-sm);
    line-height: 1.6;
  }
  .about-outline__row dd{
    font-size: var(--fs-sm);
    line-height: 1.85;
  }
}

/* “支援の空白” cards */
.subpage-gap{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(var(--space-4), 2vw, var(--space-6));
  margin-top: var(--space-6);
}

/* Card base */
.subpage-card{
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(24,40,50,0.18);
}
.subpage-card__head{
  padding: var(--space-5);
  text-align: center;
  position: relative;
}
.subpage-card__body{
  padding: clamp(var(--space-5), 2.3vw, var(--space-7)) var(--space-5) clamp(var(--space-4), 1.8vw, var(--space-5));
  background:#fff;
  border-top: 1px solid rgba(24,40,50,0.12);
}

/* Head colors */
.subpage-card--purple .subpage-card__head{ background: #7C779C; color:#fff; }
.subpage-card--blue   .subpage-card__head{ background: #2C678D; color:#fff; }
.subpage-card--green  .subpage-card__head{ background: #297571; color:#fff; }

.subpage-card__head-title{
  color:#fff;
  margin: var(--space-2) 0 var(--space-4);
  line-height: 1.6;
}

/* icon image slot */
.subpage-card__icon{
  margin: 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
}
.subpage-card__icon img{
  width: clamp(110px, 10vw, 140px);   /* 画像差し替え前提 */
  height: clamp(110px, 10vw, 140px);
  object-fit: contain;
  display:block;
}

.subpage-card__tri{
  position: absolute;
  left: 50%;
  bottom: 16px;
  transform: translate(-50%, 50%);
  line-height: 0;
  z-index: 1;
}

.subpage-card__tri img{
  display: block;
}

/* Certification: role section */
.cert-role .subpage-h2{
  margin-bottom: var(--space-5);
}

.cert-role .subpage-h2--center::after{
  display: none;
}

.cert-role .subpage-gap{
  gap: 0;
  margin-top: var(--space-8);
}

.cert-role .subpage-card{
  border: 0;
  background: transparent;
  padding: 0 clamp(var(--space-4), 2.4vw, var(--space-8));
}

.cert-role .subpage-card + .subpage-card{
  border-left: 0;
}

.cert-role .subpage-card__head{
  background: transparent;
  padding: 0;
}

.cert-role .subpage-card__body{
  border-top: 0;
  background: transparent;
  padding: 0;
}
.cert-role .subpage-card + .subpage-card {
    border-left: 1px solid rgba(24, 40, 50, 0.28);
}

.cert-role__no{
  margin: 0;
  text-align: center;
  color: #182832;
  font-family: var(--ff-en);
  font-size: var(--fs-xl);
  line-height: 1;
}

.cert-role__icon{
  width: clamp(120px, 12vw, 160px);
  height: clamp(130px, 14vw, 180px);
  margin: var(--space-6) auto var(--space-7);
  border: 0;
  border-radius: 0;
}

.cert-role__icon img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.cert-role .subpage-h3{
  font-size: clamp(var(--fs-md), 1.9vw, var(--fs-lg));
  line-height: 1.35;
  color: #182832;
  margin: 0;
}

.cert-role .subpage-h3::after{
  content: "";
  display: block;
  width: 90px;
  height: 4px;
  margin: var(--space-5) auto var(--space-7);
  background: #297571;
}

.page-business-support .cert-role .subpage-h3::after{
  background: #2C678D;
}


.cert-role .subpage-text{
  margin: 0;
  font-size: clamp(var(--fs-sm), 1.3vw, var(--fs-md));
  line-height: 1.95;
  text-align: left;
}

.cert-workstyle .subpage-h2{
  margin-bottom: 18px;
}

.cert-workstyle .subpage-h2--center::after{
  display: none;
}

.cert-workstyle__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-8);
  align-items: stretch;
}

.cert-workstyle__card{
  display: flex;
  background: transparent;
  border: 0;
}

.cert-workstyle__body{
  display: flex;
  flex-direction: column;
  width: 100%;
  background: #ffffffb3;
  padding: clamp(var(--space-4), 1.9vw, var(--space-6)) clamp(var(--space-4), 1.7vw, var(--space-6)) clamp(var(--space-4), 1.6vw, var(--space-5));
}

.cert-workstyle__title{
  margin: 0 0 var(--space-4);
  display: flex;
  align-items: baseline;
  gap: var(--space-3);
  font-family: var(--ff-serif, "Noto Serif JP", serif);
  font-size: clamp(var(--fs-md), 1.8vw, var(--fs-lg));
  line-height: 1.5;
  letter-spacing: .04em;
  color: #182832;
  font-weight: 600;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(24,40,50,0.22);
}

.cert-workstyle__no{
  flex: 0 0 auto;
  font-family: var(--ff-en);
  font-size: 28px;
  line-height: 1;
  letter-spacing: 0.04em;
  color: #297571;
}

.cert-workstyle__text{
  margin: 0;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.9;
  color: #243747;
  flex: 1 1 auto;
}

.business-flow .subpage-h2{
  margin-bottom: var(--space-12);
}

.business-flow .subpage-h2--center::after{
  display: none;
}

.business-flow .content{
  max-width: var(--content-w);
}

.business-flow__list{
  display: grid;
  gap: var(--space-7);
}

.business-flow__item{
  position: relative;
  border: 1px solid #888;
  padding: clamp(var(--space-6), 4vw, var(--space-7)) clamp(var(--space-5), 4.5vw, var(--space-6));
  text-align: center;
  color: #182832;
}

.business-flow__item:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -18px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #1B1B1B;
}

.business-flow__heading{
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: clamp(var(--space-3), 1.6vw, var(--space-6));
  margin: 0;
  color: #182832;
  padding-bottom: var(--space-2);
}

.business-flow__step{
  font-family: var(--ff-en);
  font-size: var(--fs-xl);
  line-height: 1;
  letter-spacing: 0.04em;
      color: #2C678D;
}

.business-flow__title{
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-md), 1.9vw, var(--fs-lg));
  line-height: 1.3;
  letter-spacing: 0.04em;
  font-weight: 600;
}

/* Certification: flow section */
.cert-flow{
  background: #fff;
}

.cert-flow .content{
  max-width: 980px;
}

.cert-flow .subpage-h2{
  margin-bottom: 34px;
  font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-2xl));
}

.cert-flow .subpage-h2--center::after{
  display: none;
}

.cert-flow__list{
  list-style: none;
  margin: 0;
  padding: 0 0 0 112px;
  position: relative;
}

.cert-flow__list::before{
  content: "";
  position: absolute;
  left: 56px;
  top: 47px;
  bottom: 90px;
  border-left: 1px dashed rgba(24,40,50,0.28);
}

.cert-flow__item{
  position: relative;
  padding: 0 0 52px;
}

.cert-flow__item:last-child{
  padding-bottom: 0;
}

.cert-flow__marker{
  position: absolute;
     left: -63px;
    top: 42px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #8cc0b8 0%, #2f8c81 75%);
}

.cert-flow__content{
  border-top: 1px solid rgba(24,40,50,0.12);
  padding-top: 28px;
}

.cert-flow__step{
  margin: 0 0 16px;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-md), 1.9vw, var(--fs-lg));
  line-height: 1.35;
  letter-spacing: .03em;
  color: #182832;
  font-weight: 600;
}

.cert-flow__step span{
  color: #5a998f;
  margin-right: 4px;
  font-family: var(--ff-en);
  font-weight: 500;
}

.cert-flow .subpage-text{
  margin: 0 0 var(--space-4);
  line-height: 1.9;
}

.cert-flow__table{
  border: 1px solid rgba(24,40,50,0.26);
  margin-top: 16px;
}

.cert-flow__row{
  display: grid;
  grid-template-columns: 160px 1fr;
}

.cert-flow__row + .cert-flow__row{
  border-top: 1px solid rgba(24,40,50,0.26);
}

.cert-flow__th,
.cert-flow__td{
  padding: 12px 16px;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.7;
  color: #182832;
}

.cert-flow__th{
  background: #d6e3e1;
  border-right: 1px solid rgba(24,40,50,0.26);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}

.cert-flow__td{
  background: #fff;
}

.cert-flow__cta{
  margin-top: 24px;
  text-align: center;
}

.cert-flow__cta-status{
  margin: 0 0 var(--space-2);
  font-family: var(--ff-body);
  font-size: 12px;
  line-height: 1.7;
  color: #c64545;
  font-weight: 500;
}

.cert-flow__cta .btn{
  min-width: 320px;
}

.cert-flow__note{
  margin: 8px 0 0;
  font-size: 12px;
  line-height: 1.6;
  color: #182832;
}

/* Certification: fee section */
.cert-fee{
  padding: 0;
}

.cert-fee__main{
  background: transparent;
  padding: var(--space-15) 0 var(--space-8);
}

.cert-fee .content{
  max-width: 1100px;
}

.cert-fee .subpage-h2{
    font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-2xl));
    line-height: 1.65;
    letter-spacing: .06em;
    margin: 0 0 32px;
    color: #182832;
    font-weight: 600;
}

.cert-fee .subpage-h2--center::after{
  display: none;
}

.cert-fee__table{
  border: 1px solid #a9b1b8;
}

.cert-fee__tr{
  display: grid;
  grid-template-columns: 230px 1fr;
}

.cert-fee__tr + .cert-fee__tr{
  border-top: 1px solid #a9b1b8;
}

.cert-fee__th,
.cert-fee__td{
  min-height: 60px;
  display: flex;
  align-items: center;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.6;
  color: #263747;
  font-weight: 500;
}

.cert-fee__th{
  justify-content: center;
  border-right: 1px solid #a9b1b8;
      
}

.cert-fee__td{
  padding: 12px 20px;
  background: rgba(255, 255, 255, 0.2);
}

.cert-fee__notebox{
  margin-top: var(--space-8);
  border: 1px solid #a9b1b8;
  padding: var(--space-11) var(--space-10) var(--space-10);
  background: rgba(255, 255, 255, 0.2);
}

.cert-fee__note-title{
  margin: 0 0 var(--space-6);
  text-align: center;
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-2xl));
  line-height: 1.3;
  color: #132d42;
  font-weight: 600;
}

.cert-fee__notes{
  margin: 0;
  padding-left: 28px;
}

.cert-fee__notes li{
  position: relative;
  padding-left: 1em;
  margin: 0 0 4px;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  line-height: 1.95;
}

.cert-fee__notes li::before{
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
}

.cert-fee__notes li:last-child{
  margin-bottom: 0;
}

.cert-fee__apply{
  background: rgba(255,255,255,0);
  padding: var(--space-6) 0 var(--space-15);
}

.cert-fee__apply-inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
  background: rgba(255,255,255,0.55);
  padding: var(--space-8) var(--space-11);
}

.cert-fee__apply-title{
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  font-family: var(--ff-jp);
  font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-2xl));
  line-height: 1.3;
  color: #13293c;
  font-weight: 600;
}

.cert-fee__apply-icon{
  width: 30px;
  height: 30px;
  background: url("./img/title_icon.webp") center / contain no-repeat;
  flex: 0 0 30px;
}

.cert-fee__apply .btn{
margin-top:0;
}

.cert-fee__apply-actions{
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--space-3);
}

.cert-fee__apply-status{
  margin: 0;
  font-family: var(--ff-body);
  font-size: 12px;
  line-height: 1.7;
  color: #c64545;
  font-weight: 500;
}

.cert-fee__apply-btn.is-disabled{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background: #d8d8d8;
  border-color: #d8d8d8;
  color: #8b8b8b;
  cursor: not-allowed;
  pointer-events: none;
}

.cert-fee__apply-btn.is-disabled .btn__arrow{
  color: inherit;
}

/* About block: 左文 + 右メニュー */
.subpage-about{
  display:grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
  gap: clamp(var(--space-5), 2.6vw, var(--space-10));
  align-items: start;
      background-color: #fff;
    padding: clamp(var(--space-6), 3.5vw, var(--space-12));
}

#subpage-about-title{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  line-height: 1.4;
}

#subpage-about-title::before{
  content: "";
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  margin-top: 0.18em;
  background: url("./img/title_icon.webp") center / contain no-repeat;
}

.subpage-about .about__menu{
  margin-bottom: 0;
}

.subpage-about__left{
  width: 560px;
  max-width: 100%;
}

.subpage-about__left .p_sans{
  width: 100%;
  max-width: 560px;
}

#subpage-about-title{
  max-width: 560px;
}

.subpage-about__menu{
  justify-self: end; /* 右寄せ */
}

/* ===== Responsive ===== */
@media (max-width: 1024px){
  .subpage-pos{ gap: 32px; }
  .subpage-about{ grid-template-columns: 1fr; }
  .subpage-about__menu{ justify-self: start; }
  .cert-role .subpage-card{
    padding: 0 var(--space-5);
  }
 
  .cert-flow__list{
    padding-left: 88px;
  }
  .cert-flow__list::before{
    left: 44px;
  }
  .cert-flow__marker{
    left: -50px;
  }
  .cert-flow__step{
    font-size: var(--fs-lg);
  }
  .cert-fee__tr{
    grid-template-columns: 180px 1fr;
  }
  .cert-fee__th,
  .cert-fee__td{
    min-height: 62px;
    font-size: 16px;
  }
  .cert-fee__note-title{
    font-size: var(--fs-2xl);
  }
  .cert-fee__notes li{
    font-size: var(--fs-sm);
  }
  .cert-fee__apply-title{
    font-size: var(--fs-2xl);
  }
 
}
@media (max-width: 768px){
  .subpage-hero{ padding: 140px 0 20px; }
  .subpage-hero__title{
    font-size: var(--fs-2xl);
    margin-top: calc(var(--space-5) * -1);
  }
  .subpage-section{
    padding: 48px 0;
  }
  .subpage-section--metrics{
    padding-top: 48px;
  }
  .subpage-h2{
    font-size: 24px;
    line-height: 1.55;
    margin-bottom: 20px;
  }
  .subpage-text,
  .subpage-note,
  .subpage-card__head-title{
    font-size: var(--fs-sm);
    line-height: 1.85;
  }
  .subpage-pos{ grid-template-columns: 1fr; }
  .subpage-pos__body{
    max-width: 100%;
  }
  .subpage-pos__media{
    max-width: 100%;
  }
  .subpage-pos__media--business img{
    width: 100%;
  }
  .subpage-gap{ grid-template-columns: 1fr; }
  .subpage-card__head{
    padding: 16px;
  }
  .subpage-card__body{
    padding: var(--space-6) var(--space-5) var(--space-5);
  }
  .subpage-card__icon img{
    width: 110px;
    height: 110px;
  }
  .subpage-card__tri{
    bottom: 12px;
  }
  .subpage-about{
    padding: var(--space-7) var(--space-5);
  }
  .subpage-about__left{
    width: 100%;
  }
  .cert-role .subpage-gap{
    gap: var(--space-7);
  }
  .cert-role .subpage-card{
    padding: 0;
  }
  .cert-role .subpage-card + .subpage-card{
    border-left: 0;
    border-top: 1px solid rgba(24, 40, 50, 0.28);
    padding-top: var(--space-7);
  }
  .cert-role__icon{
    width: 120px;
    height: 100px;
    margin: var(--space-5) auto var(--space-6);
  }
  .subpage-section--metrics .subpage-h2--center::after, .subpage-section--gap .subpage-h2--center::after{
        height: 60px;
    margin: 8px auto 0;
  }

  .cert-role .subpage-text{
    font-size: var(--fs-sm);
    line-height: 1.85;
  }
  .cert-workstyle__grid{
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 28px;
  }
  .cert-workstyle__body{
    padding: var(--space-5) var(--space-4) var(--space-4);
  }
  .cert-workstyle__title{
    gap: var(--space-2);
    font-size: var(--fs-md);
    margin-bottom: var(--space-2);
  }
  .cert-workstyle__no{
    font-size: 24px;
  }
  .cert-workstyle__text{
    font-size: var(--fs-sm);
    line-height: 1.85;
  }
  .business-flow .subpage-h2{
    margin-bottom: var(--space-7);
  }
  .business-flow__list{
    gap: var(--space-5);
  }
  .business-flow__item{
    padding: var(--space-6) var(--space-5);
  }
  .business-flow__item:not(:last-child)::after{
    bottom: -16px;
    border-left-width: 7px;
    border-right-width: 7px;
    border-top-width: 8px;
  }
  .business-flow__heading{
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
  }
  .business-flow__step{
    font-size: var(--fs-xl);
  }
  .business-flow__title{
    font-size: var(--fs-md);
  }
  .cert-flow{
    padding: 56px 0;
  }
  .cert-flow .subpage-h2{
    margin-bottom: 24px;
  }
  .cert-flow__list{
    padding-left: 32px;
  }
  .cert-flow__list::before{
    left: 14px;
    top: 35px;
    bottom: 70px;
  }
  .cert-flow__marker{
    left: -22px;
    top: 32px;
    width: 10px;
    height: 10px;
  }
  .cert-flow__item{
    padding-bottom: 36px;
  }
  .cert-flow__content{
    padding-top: 18px;
  }
  .cert-flow__step{
    font-size: 20px;
    margin-bottom: 12px;
  }
  .cert-flow__row{
    grid-template-columns: 1fr;
  }
  .cert-flow__th{
    justify-content: flex-start;
    border-right: 0;
    border-bottom: 1px solid rgba(24,40,50,0.26);
  }
  .cert-flow__cta .btn{
    width: 100%;
    min-width: 0;
  }
  .cert-fee__main{
    padding: 44px 0 24px;
  }
  .cert-fee .subpage-h2{
    margin-bottom: 18px;
    font-size: 24px;
  }
  .cert-fee__tr{
    grid-template-columns: 1fr;
  }
  .cert-fee__th{
    border-right: 0;
    border-bottom: 1px solid #a9b1b8;
    justify-content: flex-start;
    padding: var(--space-2) var(--space-4);
  }
  .cert-fee__td{
    padding: var(--space-2) var(--space-4) var(--space-4);
  }
  .cert-fee__th,
  .cert-fee__td{
    min-height: 0;
    font-size: var(--fs-sm);
    line-height: 1.7;
  }
  .cert-fee__table .cert-fee__th,
  .cert-fee__table .cert-fee__td{
    justify-content: center;
    text-align: center;
  }
  .cert-role .subpage-h3{
    font-size: 20px;
  }
  .cert-fee__notebox{
    margin-top: 20px;
    padding: 20px 16px;
  }
  .cert-fee__note-title{
    font-size: 24px;
    margin-bottom: var(--space-4);
  }
  .cert-fee__notes{
    padding-left: 0;
  }
  .cert-fee__notes li{
    font-size: var(--fs-sm);
    line-height: 1.8;
    margin-bottom: 8px;
  }
  .cert-fee__apply{
    padding: var(--space-4) 0 var(--space-8);
  }
  .cert-fee__apply-inner{
    flex-direction: column;
    align-items: flex-start;
    padding: var(--space-5) var(--space-4);
  }
  .cert-fee__apply-title{
    font-size: var(--fs-xl);
    gap: var(--space-2);
  }
  .cert-fee__apply-icon{
    width: 24px;
    height: 24px;
    flex-basis: 24px;
  }

}
/* =========================
  breadcrumb
========================= */

.breadcrumb{
  padding:8px 0;
  font-family: var(--ff-jp,"Noto Sans JP",sans-serif);
}

/* 幅1100px */
.breadcrumb__inner{
  max-width:1100px;
  margin:0 auto;
  padding:0;
  box-sizing:border-box;
}

.breadcrumb__list{
  display:flex;
  align-items:center;
  font-size:12px;
  color:#182832;
}

.breadcrumb__item{
  display:flex;
  align-items:center;
}

.breadcrumb__item a{
  color:#182832;
  text-decoration:none;
  opacity:.8;
}

.breadcrumb__item a:hover{
  text-decoration:underline;
}

.breadcrumb__item + .breadcrumb__item::before{
  content:"›";
  margin:0 8px;
  opacity:.4;
}
/* =========================
  Subpage base (shared with /issue)
========================= */


/* =========================
  Compare (Difference)
========================= */
.compare{
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px minmax(0, 1fr);
  gap: 0;
  border-bottom: 1px solid #d7d7d7;
  border-radius: 4px;
  overflow: hidden;
}

.compare-wrap{
  width: 100%;
}

.compare-scroll-note{
  display: none;
  margin: 0 0 8px;
  font-family: var(--ff-body);
  font-size: 12px;
  line-height: 1.6;
  letter-spacing: .02em;
  color: #999999;
  text-align: center;
}

.compare__cell{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-5) var(--space-5);
  font-family: var(--ff-body);
  font-size: 16px;
  line-height: 1.85;
  text-align: left;
  border-right: 1px solid #ececec;
  border-bottom: 1px solid #ececec;
}

.compare__cell:nth-child(3n){
  border-right: 0;
}

.compare__cell:nth-last-child(-n+3){
  border-bottom: 0;
}

.compare__cell--head-left,
.compare__cell--head-right{
  min-height: 160px;
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
}

.compare__cell--head-left{
  background: #045954;
}

.compare__cell--head-mid{
  min-height: 160px;
  background: #fff;
}

.compare__cell--head-right{
  background: #707070;
  flex-direction: column;
  gap: 8px;
}

.compare__cell--head-right span{
  display: block;
  margin-top: 0;
  font-size: var(--fs-sm);
  line-height: 1.35;
  font-weight: 500;
}

.compare__cell--left{
  background: #337f7b;
  color: #fff;
}

.compare__cell--right{
  background: #c6c6c6;
  color: #384049;
}

.compare__cell--mid{
  background: #fff;
  color: #1f2a35;
  font-weight: 500;
  font-size: 16px;
}

#compare.whats-compare{
  background: #FFF;
}

.whats-compare .p_sans{
  text-align: left!important;
}

.compare__cell--accent{
  color: #F9F047;
  font-weight: 500;
  font-size: 20px;
}

.compare__cell--accent,
.compare__cell--accent + .compare__cell,
.compare__cell--accent + .compare__cell + .compare__cell{
  padding-top: var(--space-4);
  padding-bottom: var(--space-4);
}

/* =========================
  Privacy Policy section
========================= */
.privacy-policy-section{
  padding-top: 80px;
}

.privacy-policy{
  width: 100%;
  max-width: none;
  margin: 0 auto;
  color: #1f2e39;
}

.privacy-policy__lead{
  margin: 0 0 var(--space-12);
  font-family: var(--ff-jp);
  font-size: var(--fs-sm);
  line-height: 2;
  letter-spacing: 0.02em;
}

.privacy-policy__articles{
  display: grid;
  gap: var(--space-10);
}

.privacy-policy__article{
  margin: 0;
}


.privacy-policy__title{
  margin: 0 0 var(--space-5);
  padding-left: 12px;
  border-left: 3px solid #665E9C;
  font-family: var(--ff-jp);
  font-size: 20px;
  line-height: 1.6;
  letter-spacing: 0.03em;
  font-weight: 700;
}

.privacy-policy__text{
  margin: 0;
  font-family: var(--ff-jp);
  font-size: var(--fs-sm);
  line-height: 2;
  letter-spacing: 0.02em;
}

.privacy-policy__list{
  margin: 0;
  padding-left: 1.4em;
  list-style: disc outside;
  font-family: var(--ff-jp);
  font-size: var(--fs-sm);
  line-height: 2;
  letter-spacing: 0.02em;
}

.privacy-policy__list li{
  margin: 0;
}

/* =========================
  Business care manager section
========================= */


.subpage-page .whats-bcm__grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr) 400px;
  gap: var(--space-10);
  background: #fff;
  padding: var(--space-12);
}

.subpage-page .whats-bcm__image{
  margin: 0;
  width: 100%;
  max-width: 420px;
}

.subpage-page .whats-bcm__right{
  width: 100%;
  max-width: 420px;
  justify-self: end;
}

.subpage-page .whats-bcm__image img{
  width: 100%;
  height: 520px;
  object-fit: cover;
  display: block;
}

/* =========================
  Responsive
========================= */
@media (max-width: 980px){
  .subpage-page .whats-bcm__grid{
    grid-template-columns: 1fr;
    gap: var(--space-7);
  }

  .subpage-page .whats-bcm__image{
    max-width: 100%;
  }

  .subpage-page .whats-bcm__image img{
    height: auto;
    aspect-ratio: 540 / 620;
  }

  .compare-scroll-note{
    display: block;
  }

  .compare-wrap{
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .compare{
    min-width: 980px;
    border-radius: 4px;
  }

  .compare__cell{
    min-height: auto;
    padding: var(--space-4) var(--space-5);
    font-size: 16px;
  }

  .compare__cell--head-left,
  .compare__cell--head-mid,
  .compare__cell--head-right{
    min-height: auto;
    font-size: var(--fs-lg);
    line-height: 1.35;
  }
  .subpage-page .whats-bcm__grid{
    padding: var(--space-7) var(--space-5);
  }

  .compare__cell--head-right span{
    font-size: var(--fs-sm);
  }

  .compare__cell--mid{
    font-size: 16px;
  }

  .compare__cell--desc{
    font-size: var(--fs-sm);
    line-height: 1.8;
    text-align: left;
    padding: var(--space-4) var(--space-5);
  }

  .compare__cell--accent{
    font-size: var(--fs-lg);
  }

  .compare__cell--accent,
  .compare__cell--accent + .compare__cell,
  .compare__cell--accent + .compare__cell + .compare__cell{
    padding-top: var(--space-5);
    padding-bottom: var(--space-5);
  }

  .privacy-policy-section{
    padding-top: 48px;
  }

  .privacy-policy__lead,
  .privacy-policy__text,
  .privacy-policy__list{
    font-size: var(--fs-sm);
    line-height: 1.9;
  }

  .privacy-policy__title{
    font-size: var(--fs-md);
    margin-bottom: var(--space-3);
  }

  .privacy-policy__articles{
    gap: var(--space-7);
  }
}

@media (max-width: 520px){
  .compare__cell{
    font-size: var(--fs-sm);
  }

  .compare__cell--head-left,
  .compare__cell--head-mid,
  .compare__cell--head-right{
    font-size: 20px;
  }

  .compare__cell--head-right span{
    font-size: var(--fs-xs);
  }


  .compare__cell--accent{
    font-size: 20px;
  }

  .compare__cell--accent,
  .compare__cell--accent + .compare__cell,
  .compare__cell--accent + .compare__cell + .compare__cell{
    padding-top: var(--space-5);
    padding-bottom: var(--space-5);
  }

      .cert-flow__list::before {
        bottom: 97px;
    }
}

/* =========================
  Responsive
========================= */
@media (max-width: 1200px){
  .gnav{display:none}
  .gnav--drawer{display:flex}
    .about__right{
    width: 100% !important;
    max-width: 100% !important;
  }
  .about__menu{
    margin-bottom: 0;
  }
  .about__visual{
    height: 320px;
  }

  .header__bar{
        margin: 0;  
  }
  
  .hero__orbs{
  height:240px;
  margin: 0 auto;
  }

  .hero__below{
display: block;
  }

  .hero__below-left{
    width: 100%;
    max-width: 100%;
    justify-items: start;
    padding-bottom: 62px;
    margin-bottom: 20px;
  }

  .hero__below-left .en{
    font-size: clamp(72px, 14vw, 112px);
    line-height: .8;
  }

  .hero__below-left .section_title{
    transform: translateY(62px);
    font-size: clamp(var(--fs-lg), 4vw, 36px);
    white-space: nowrap;
    overflow-wrap: normal;
  }

  .hero__below-right{
    margin-top: 0;
  }

  .site{
  margin: 0 auto;      /* これを維持 */
  padding: 0 20px;     /* 余白はpaddingで作る */
}
  .issues__metrics{grid-template-columns:1fr}
  .metric:nth-child(even)::before{
    content: none;
  }
  .metric:nth-child(n + 3)::after{
    content: none;
  }
  .metric + .metric::before{
    content:"";
    position:absolute;
    left: 16px;
    right: 16px;
    top: -7px;
    bottom: auto;
    border-left: 0;
    border-top: 1px dashed rgba(27,65,88,.45);
  }

  .act{ flex-direction: column; 
  padding-bottom: 60px;
  border-bottom: 1px solid rgba(27, 27, 27, .16);
  }
  .activities__list .act:nth-child(2){ flex-direction: column; }

  .act__title{
    font-size: 36px;
    gap: var(--space-4);
  }
  
  .act__heading{font-size:36px}
  .act__no{font-size:32px}
  .act__orb{
    margin: 0 auto;
    width:min(560px, 80%);
    height:auto;
  }
  .act__btn{
    right: 16px;
    bottom: 40px;
    padding: 12px 28px;
    font-size: var(--fs-md);
  }
  .act__content{
    border-bottom: 0;
    padding-bottom: 0;
  }

  .about__layout{
    grid-template-columns:1fr;
    gap: var(--space-6);
    min-height:auto;
  }
  .about .content{ 
    position: static; 

  }
  .about__center{
    position: static;
    transform: none;
    width: 100%;
    margin-top: 12px;
  }

  .about__menu-item{
    padding: var(--space-4) var(--space-5);
    font-size: var(--fs-md);
  }


  .news__grid{
    grid-template-columns:1fr;
    display:flex;
    flex-direction:column;
    gap:0;
  }
  .news__right{ display:contents; }
  .news__title-wrap{
    order:1;
    width: 100%;
    max-width: 100%;
    justify-items: start;
    min-height: auto;
    margin-top:0;
    padding-bottom: 62px;
    margin-bottom: 16px;
  }

  .news__title-wrap .en{
    font-size: clamp(72px, 14vw, 112px);
    line-height: .8;
  }

  .news__title-wrap .section_title{
    transform: translateY(62px);
    font-size: clamp(var(--fs-lg), 4vw, 36px);
    white-space: nowrap;
    overflow-wrap: normal;
  }
  .news__left{
    order:2;
    padding: var(--space-5);
        width: 100% !important;
    max-width: 100% !important;
  }
  .news__right .btn--wide{ order:3; }
  .news__txt{ font-size: var(--fs-sm); }

  .btn--wide{
    width: 100%;
    margin-top: var(--space-6);
  }

  .contact__panel{ padding:56px 16px 44px; }

  .footer__inner{
    grid-template-columns:1fr;
    gap:16px;
  }
  .footer__nav{
display: contents;
  }
  .footer__brand{
    margin-bottom: 20px;
  }
  .footer__nav a{font-size:14px}
 
  .footer__partner{
    width:100%;
    max-width:360px;
  }

  .footer__headline{
    font-size:36px;
    padding-right:130px;
  }
  .footer__pagetop{
    width:88px;
    height:88px;
    font-size:14px;
  }


}

@media (max-width: 1200px){
  .confirm-form__actions .wpcf7-previous,
  .confirm-form__actions .wpcf7-submit{
    width: min(400px, 100%);
  }
}

@media (max-width:1100px){
  .breadcrumb__inner{
    padding:0 16px;
  }
}
@media (max-width: 980px){
  .hero__headline{
    margin-top: 0;
  }
.hero__grid{grid-template-columns:1fr}

}

/* ✅ SPでfixed背景を解除（重さ/崩れ対策） */
@media (max-width: 768px){
  body{ background-image: none;}
  body::after{
    content:"";
    position: fixed;
    inset: 0;
    z-index: -2;              /* 背景最背面 */

    background-image: 
      url("./img/bg_line.webp"),
      url("./img/bg.webp");

    background-repeat: no-repeat, no-repeat;
    background-position: center center, center center;
    background-size: cover, cover;

    pointer-events: none;     /* クリック邪魔しない */
  }
  .hero__headline{
  font-size: 36px;
  }
  .p_sans{
font-size: var(--fs-sm);
line-height: 1.8;
  }
.hero__orbs img{
  max-width: 75%;
      margin: 0 auto;
}
.hero__grid{
    gap: 0;
}
.hero__below{
      margin-top: 100px;
}
.section_title{
  font-size: 32px;
}
.hero__below-left .en{
  font-size: clamp(var(--space-15), 18vw, 92px);
}
.hero__below-left .section_title{
  transform: translateY(46px);
  font-size: clamp(var(--fs-lg), 7vw, var(--fs-2xl));
}
.hero__below-left{
  padding-bottom: 46px;
  margin: 0 auto 24px;
  justify-items: center;
  text-align: center;
}
.news__title-wrap{
  justify-items: center;
  text-align: center;
  margin: 0 auto 16px;
}
.mini-title{
   font-size: 28px; 
   margin: 0 0 16px;
}
.p_serif{
  font-size: 16px;
  line-height: 1.8;
}
.issues__card{
      padding: 40px 20px;
}
.metric{
      padding: 20px 0px;
}
.section{
  padding: 60px 0;
}
.hero__content{
      padding-bottom: 0;
}
.mini-title br{
display: none;
}
.issues__head .issues__intro{
      margin: 48px auto 20px;
}
.title-jp{
  font-size:28px;
    transform: translateY(-20px);
}
.act__heading{
          font-size: 24px;
}
.act__no{
          font-size: 24px;
}
.act__title{
          gap: 8px;
          margin: 16px 0 12px;
}
.section-title{
      margin: 0;
}
.act__tag__purple, .act__tag__green, .act__tag__blue{
  font-size: var(--fs-xs);
}
.act__tagline{
  gap:8px;
}
.act{
  gap: 24px;
          padding-bottom: 40px;
}
.activities__list{
      gap: 40px;
}
.about__title-jp{
  font-size: 28px;
      transform: translateY(10px);
}

.about__right{
  gap:8px;
}
  .about__left{
      text-align: center;
}
.about__menu-item{
  padding: 16px 16px;
        font-size: 16px;
}
.about__visual {
    height: 320px;
}
.section-about{
          padding-bottom:0;
}
.footer__headline{
text-align: left;
margin-left: 20px;
}
.footer__bottom {
    padding: 32px 0 32px;
    
}
.footer__inner{
padding: var(--space-5) 0 var(--space-12);
}
 .footer__meta{
    flex-direction:column;
    align-items:flex-start;
  }
    .footer__legal{ align-items:flex-start; }
    .footer__legal a,.footer__legal span{
  text-align: left;

}
.hero__below-left{
  margin: 0 0 16px;
  text-align: left;
}
.news__txt{
  font-size: var(--fs-sm);
}
.news__date{
 font-size: 12px; 
}

}
@media (max-width: 520px){
  .title-en{font-size:64px}
  .title-jp{font-size:28px;}
  .news__date{font-size:var(--fs-xs)}
  .news__tag{font-size:var(--fs-xs)}
  .footer__logo{width:220px}
  .footer__headline{
    font-size:28px;
    padding-right:98px;
  }
  .footer__pagetop{
    width:74px;
    height:74px;
    font-size:12px;
  }
}
/* =========================================
   横はみ出し根治（500px付近）
========================================= */

/* グリッド/フレックス内の“はみ出し”基本対策 */
.section, .content, .site,
.news__grid, .about__layout, .issues__metrics,
.hero__below, .hero__grid {
  min-width: 0;
}

.news__left, .news__right, .about__right, .metric {
  min-width: 0;
}

/* でかい英字アウトライン見出し：画面幅で縮む */
.en,
.title-en{
  font-size: clamp(var(--space-12), 14vw, 120px); /* ✅ 120固定をやめる */
  max-width: 100%;
}

/* section_title：狭い幅では折り返せるように */
.section_title{
  max-width: 100%;
  box-sizing: border-box;
  white-space: normal;          /* ✅ 折り返し許可 */
  overflow-wrap: anywhere;      /* ✅ 長い場合も逃がす */
}

/* metric：巨大数字が溢れないように */
.metric__value{
  font-size: clamp(var(--space-10), 10vw, 68px); /* ✅ 68固定をやめる */
  flex-wrap: nowrap;
  align-items: center;
  gap: clamp(var(--space-2), 2vw, var(--space-3));
  max-width: 100%;
}
.metric__value span{
  max-width: 100%;
  align-self: center;
}

@media (max-width: 500px){
  .metric__value span{
    margin-top: 0;
  }

  .metric_title{
    margin-bottom: 8px;
  }
  .metric_title p{
        font-size: var(--fs-sm);
  }
}

/* News：500px付近で2カラム固定が残ってても強制1カラム化 */
@media (max-width: 600px){
  .news__grid{
    grid-template-columns: 1fr !important;
  }
  .news__left{
    padding: var(--space-5) var(--space-4); /* 任意：詰める */
  }
}

/* =========================================
   Responsive line breaks
========================================= */
br.br-pc{
  display: inline;
}
br.br-sp{
  display: none;
}
.text-nowrap{
  white-space: nowrap;
}

@media (max-width: 768px){
  br.br-pc{
    display: none;
  }
  br.br-sp{
    display: inline;
  }
}