:root {
  --teal-dark: #004e5d;
  --teal: #007485;
  --teal-blue: #72c5e2;
  --yellow: #ffdf00;
  --cream: #fffbd5;
  --text: #071315;
  --muted: #5c6b70;
  --line: #dce8eb;
  --white: #fff;
  --shadow: 0 18px 48px rgba(0, 74, 88, .14);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 700;
  line-height: 1.7;
  background: #fff;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
.container { width: min(1040px, calc(100% - 32px)); margin: 0 auto; }
.narrow { width: min(780px, calc(100% - 32px)); }
.visually-hidden, .skip-link:not(:focus) {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link:focus { position: fixed; left: 16px; top: 16px; z-index: 999; background: #fff; color: var(--teal-dark); padding: 10px 14px; border-radius: 8px; }

/* 共通：ブロック外側に白い余白を作らない。各ブロックの余白は背景色内で吸収する */
.block { margin-bottom: 0; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #004f5d;
  box-shadow: 0 3px 10px rgba(0,0,0,.22);
}
.header-inner {
  height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(18px, 3.4vw, 36px);
}
.brand { display: inline-flex; align-items: center; gap: clamp(15px, 2.5vw, 28px); min-width: 0; }
.brand-main { color: #fff; font-size: clamp(28px, 4vw, 46px); font-weight: 1000; letter-spacing: .02em; line-height: 1; white-space: nowrap; }
.brand-sub { color: #66c6d5; font-size: clamp(16px, 2.2vw, 24px); font-weight: 900; letter-spacing: .34em; line-height: 1; white-space: nowrap; }
.global-nav { display: none; gap: 24px; color: #fff; font-size: 15px; font-weight: 900; }
.menu-button { width: 64px; height: 54px; border: 0; background: transparent; padding: 7px 0; cursor: pointer; display: grid; align-content: space-between; }
.menu-button span { display: block; height: 4px; width: 64px; background: #fff; transition: transform .2s ease, opacity .2s ease; }
.menu-button.is-open span:nth-child(1) { transform: translateY(18px) rotate(45deg); }
.menu-button.is-open span:nth-child(2) { opacity: 0; }
.menu-button.is-open span:nth-child(3) { transform: translateY(-18px) rotate(-45deg); }
.menu-panel { display: none; padding: 22px 18px 28px; background: #003f4a; border-top: 1px solid rgba(255,255,255,.16); }
.menu-open .menu-panel { display: block; }
.menu-panel-nav { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; width: min(720px, 100%); margin: 0 auto; }
.menu-panel-nav a { display: grid; place-items: center; min-height: 50px; border: 1px solid rgba(255,255,255,.26); border-radius: 999px; color: #fff; font-weight: 900; }
.menu-panel-nav a:hover, .menu-panel-nav a:focus-visible { background: var(--yellow); color: var(--teal-dark); outline: none; }

.hero { background: var(--teal); overflow: hidden; margin: 0; padding: 0; line-height: 0; }
.hero-frame { width: min(1041px, 100%); margin: 0 auto; background: transparent; line-height: 0; font-size: 0; }
.hero-frame img { display: block; width: 100%; height: auto; margin: 0; padding: 0; vertical-align: bottom; }

/* 背景色を維持した15pxスペーサー */
.hero { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.message { border-bottom: 15px solid #fff; }
.policy { border-bottom: 15px solid #fff; }
.profile { border-bottom: 15px solid var(--cream); }
.sns { border-bottom: 15px solid var(--cream); }
.faq { border-bottom: 15px solid var(--cream); }
.support { border-bottom: 15px solid #fff; }
.office { border-bottom: 15px solid #fff; }


.message {
  position: relative;
  background: #fff;
  padding: 0 0 clamp(54px, 7vw, 84px);
  overflow: visible;
}
.message::before {
  content: "";
  display: block;
  width: 100%;
  height: clamp(56px, 7.2vw, 76px);
  background: #006b78;
}
.message-title-wrap {
  position: relative;
  z-index: 2;
  width: min(760px, calc(100% - 48px));
  margin: 0 auto;
  transform: translateY(-50%);
  background: var(--yellow);
}
.message-title-wrap h2 { margin: 0; padding: clamp(17px, 2.1vw, 24px) clamp(18px, 3.4vw, 42px); color: #005a6b; font-size: clamp(30px, 4vw, 45px); line-height: 1.14; font-weight: 1000; letter-spacing: .035em; text-align: center; }
.message-body { width: min(760px, calc(100% - 48px)); margin: clamp(-22px, -2vw, -12px) auto 0; }
.message-row { display: grid; grid-template-columns: clamp(40px, 5vw, 50px) 1fr; gap: 12px; align-items: start; }
.message-row + .message-row { margin-top: clamp(22px, 3.2vw, 35px); }
.message-initial { display: inline-flex; align-items: center; justify-content: center; width: clamp(36px, 4.3vw, 45px); height: clamp(36px, 4.3vw, 45px); background: #0793a3; color: #fff; font-size: clamp(27px, 3.4vw, 37px); font-weight: 1000; line-height: 1; }
.message-row p { margin: -4px 0 0; font-size: clamp(15px, 1.45vw, 18px); line-height: 1.95; font-weight: 850; letter-spacing: .01em; }

.policy { background: #fff; padding-bottom: clamp(58px, 7vw, 88px); }
.policy-heading { background: var(--yellow); text-align: center; color: #005a6b; padding: clamp(8px, 1.1vw, 13px) 16px clamp(8px, 1.2vw, 14px); }
.policy-heading p { margin: 0; display: flex; align-items: flex-end; justify-content: center; gap: 10px; color: #050505; font-size: clamp(18px, 2.1vw, 30px); font-weight: 1000; line-height: 1; }
.policy-heading p span { color: #00879b; font-size: clamp(48px, 7.2vw, 82px); font-style: italic; line-height: .78; letter-spacing: -.08em; }
.policy-heading h2 { margin: -2px 0 0; color: #005a6b; font-size: clamp(30px, 4.2vw, 52px); line-height: 1.05; font-weight: 1000; letter-spacing: .04em; }
.policy-list { width: min(760px, calc(100% - 44px)); margin: clamp(34px, 4.7vw, 52px) auto 0; }
.policy-item { display: grid; grid-template-columns: clamp(56px, 7vw, 82px) 1fr; gap: clamp(8px, 1.3vw, 16px); align-items: start; }
.policy-item + .policy-item { margin-top: clamp(42px, 6.2vw, 70px); }
.policy-num { color: #08a6ba; font-family: Georgia, "Times New Roman", serif; font-style: italic; font-size: clamp(58px, 8vw, 92px); line-height: .9; font-weight: 900; text-shadow: 2px 3px 0 rgba(0,87,102,.23); transform: rotate(-12deg); position: relative; }
.policy-num::after { content: ""; position: absolute; left: 14%; top: 48%; width: 48px; height: 26px; background: var(--yellow); clip-path: polygon(0 0, 100% 55%, 0 100%); z-index: -1; }
.policy-title { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 5px 12px; }
.policy-title strong { color: #b11422; font-size: clamp(28px, 4.2vw, 44px); line-height: .95; font-weight: 1000; white-space: nowrap; }
.policy-title span { flex-basis: 100%; margin-left: clamp(130px, 17vw, 176px); color: #050505; font-size: clamp(10px, 1.2vw, 13px); line-height: 1; font-weight: 900; letter-spacing: .08em; }
.policy-title em { color: #16b7c4; font-size: clamp(24px, 3.8vw, 40px); line-height: .95; font-family: "Trebuchet MS", system-ui, sans-serif; font-style: italic; font-weight: 1000; }
.policy-title b { color: #0093a8; font-size: clamp(24px, 3.8vw, 40px); line-height: .95; font-weight: 1000; }
.policy-content ul { list-style: none; padding: 0; margin: clamp(8px, 1vw, 12px) 0 0; }
.policy-content li { position: relative; margin: 0; padding-left: 1em; font-size: clamp(14px, 1.35vw, 17px); line-height: 1.72; font-weight: 900; }
.policy-content li::before { content: ""; position: absolute; left: 0; top: .55em; width: .72em; height: .72em; background: #008fa0; }

.profile { background: #fff; overflow: hidden; }
.profile-head { width: 100%; background: var(--teal-blue); min-height: clamp(82px, 10.8vw, 114px); display: flex; align-items: center; justify-content: center; padding: 20px 18px; }
.profile-head h2 { margin: 0; color: #00526a; font-size: clamp(31px, 4vw, 46px); line-height: 1.1; font-weight: 1000; letter-spacing: .035em; text-align: center; }
.profile-bg { width: 100%; background: var(--cream); }
.profile-inner { position: relative; display: grid; grid-template-columns: minmax(250px, 34%) 1fr; width: min(1040px, 100%); min-height: clamp(505px, 52vw, 705px); margin: 0 auto; background: var(--cream); }
.profile-photo { display: flex; align-items: flex-end; justify-content: center; padding-left: clamp(10px, 4vw, 54px); margin-top: clamp(-98px, -9vw, -34px); z-index: 2; }
.profile-photo img { width: min(280px, 82%); max-height: 720px; object-fit: contain; object-position: bottom center; filter: drop-shadow(0 12px 12px rgba(0,0,0,.08)); }
.profile-text { position: relative; padding: clamp(26px, 3vw, 34px) clamp(28px, 7vw, 88px) clamp(42px, 6vw, 68px) clamp(22px, 4vw, 58px); }
.profile-name { margin: 0 0 10px; color: #003b48; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.35; font-weight: 1000; }
.profile-facts { list-style: none; padding: 0; margin: 0; font-size: clamp(17px, 1.85vw, 22px); font-weight: 900; line-height: 1.75; }
.profile-facts li { position: relative; padding-left: 18px; margin: 0; }
.profile-facts li::before { content: ""; position: absolute; left: 0; top: .58em; width: 10px; height: 10px; background: #0096a8; }
.profile-facts span { display: inline-block; min-width: 4.5em; margin-right: .5em; }
.profile-history { margin: clamp(32px, 4.8vw, 52px) 0 0; font-size: clamp(17px, 1.85vw, 22px); font-weight: 900; line-height: 1.68; }
.profile-history div { display: grid; grid-template-columns: minmax(96px, 9.5em) 1fr; gap: clamp(10px, 1.8vw, 26px); }
.profile-history dt { color: #00718b; font-weight: 500; white-space: nowrap; }
.profile-history dd { margin: 0; }
.cats { position: absolute; right: clamp(42px, 9vw, 118px); top: clamp(72px, 10vw, 120px); width: clamp(120px, 18vw, 190px); height: clamp(100px, 15vw, 156px); }
.cat-ground { position: absolute; right: 0; bottom: 0; width: 76%; height: 46%; border-radius: 50%; background: #ead950; transform: rotate(-6deg); }
.cat-stand, .cat-sleep { position: absolute; z-index: 2; display: block; background: #030303; }
.cat-stand::before, .cat-stand::after, .cat-sleep::before, .cat-sleep::after { content: ""; position: absolute; background: #030303; }
.cat-stand { right: 20%; top: 4%; width: 44px; height: 66px; border-radius: 42% 42% 34% 34%; }
.cat-stand::before { left: 6px; top: -13px; width: 32px; height: 25px; clip-path: polygon(0 100%,18% 0,42% 44%,70% 0,100% 100%); }
.cat-stand::after { right: -22px; top: 0; width: 42px; height: 54px; border: 8px solid #030303; border-left: 0; border-bottom: 0; border-radius: 0 100% 0 0; background: transparent; }
.cat-sleep { left: 14%; bottom: 18%; width: 70px; height: 32px; border-radius: 50% 48% 44% 48%; transform: rotate(-6deg); }
.cat-sleep::before { left: -14px; top: -10px; width: 32px; height: 29px; clip-path: polygon(0 100%,18% 0,43% 48%,74% 0,100% 100%); }
.cat-sleep::after { left: -25px; top: 14px; width: 36px; height: 9px; border-top: 4px solid #030303; border-radius: 50%; background: transparent; transform: rotate(-18deg); }

.sns { background: var(--cream); overflow: hidden; }
.sns-head { width: 100%; background: var(--teal-blue); min-height: clamp(92px, 10.7vw, 148px); display: flex; align-items: center; justify-content: center; padding: 22px 18px; }
.sns-head h2 { margin: 0; color: #00526a; font-size: clamp(30px, 4.4vw, 56px); line-height: 1.1; font-weight: 1000; letter-spacing: .035em; text-align: center; }
.sns-bg { width: 100%; background: var(--cream); }
.sns-inner { display: grid; grid-template-columns: minmax(230px, 34%) minmax(300px, 40%); justify-content: center; align-items: end; gap: clamp(42px, 8vw, 110px); width: min(1040px, 100%); min-height: clamp(470px, 37vw, 520px); margin: 0 auto; padding: clamp(34px, 5vw, 52px) clamp(18px, 3vw, 34px) 0; }
.sns-phone { display: block; width: min(255px, 100%); justify-self: end; line-height: 0; transition: transform .2s ease, filter .2s ease; }
.sns-phone:hover, .sns-phone:focus-visible { transform: translateY(-3px); filter: drop-shadow(0 10px 14px rgba(0,74,88,.18)); outline: none; }
.sns-phone img { width: 100%; height: auto; border-radius: 28px; }
.sns-person { align-self: end; justify-self: start; width: min(365px, 100%); line-height: 0; }
.sns-person img { width: 100%; height: auto; }

.section { padding: 72px 0; }
.section-kicker { color: #007080; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; margin: 0 0 8px; }
.section h2 { margin: 0 0 24px; font-size: clamp(30px, 5vw, 52px); line-height: 1.25; }
.faq { background: var(--cream); }
details { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 18px 22px; box-shadow: 0 8px 22px rgba(0,74,88,.07); }
details + details { margin-top: 14px; }
summary { cursor: pointer; font-weight: 900; color: var(--teal-dark); }

/* ========================================
   Support Block
======================================== */
.support {
  background: #fff;
  color: var(--teal-dark);
  overflow: hidden;
}

.support-head {
  background: var(--teal-blue);
  text-align: center;
  padding: clamp(58px, 7vw, 92px) 20px clamp(78px, 8.5vw, 112px);
}

.support-label {
  margin: 0 0 18px;
  color: var(--teal-dark);
  font-size: clamp(13px, 1.25vw, 17px);
  line-height: 1;
  font-weight: 1000;
  letter-spacing: .38em;
}

.support-head h2 {
  margin: 0 0 clamp(22px, 2.2vw, 30px);
  color: var(--teal-dark);
  font-size: clamp(42px, 5.6vw, 78px);
  line-height: 1.12;
  font-weight: 1000;
  letter-spacing: .035em;
}

.support-lead {
  max-width: 770px;
  margin: 0 auto;
  color: var(--teal-dark);
  font-size: clamp(17px, 1.8vw, 24px);
  line-height: 1.85;
  font-weight: 900;
}

.support-body {
  background: #fff;
  padding: clamp(54px, 6vw, 86px) 20px clamp(64px, 7vw, 92px);
}

.support-card-grid {
  width: min(1040px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 48px);
}

.support-card {
  min-height: 310px;
  border: 4px solid #c8232c;
  border-radius: 30px;
  padding: clamp(34px, 4vw, 50px) clamp(30px, 4vw, 42px);
  background: #fff;
  color: var(--teal-dark);
  box-shadow: none;
}

.support-card-donation {
  background: #fff3f4;
}

.support-card h3 {
  margin: 0 0 clamp(20px, 2.3vw, 28px);
  color: #c8232c;
  font-size: clamp(30px, 3.3vw, 42px);
  line-height: 1.18;
  font-weight: 1000;
  letter-spacing: .02em;
}

.support-card p {
  margin: 0 0 clamp(28px, 3vw, 36px);
  color: #003f50;
  font-size: clamp(16px, 1.7vw, 20px);
  line-height: 1.9;
  font-weight: 900;
}

.support-card-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 14px 28px;
  border-radius: 999px;
  font-size: clamp(15px, 1.35vw, 17px);
  line-height: 1;
  font-weight: 1000;
  text-decoration: none;
  transition: transform .18s ease, filter .18s ease;
}

.support-card-button:hover,
.support-card-button:focus-visible {
  transform: translateY(-2px);
  filter: brightness(.98);
  outline: none;
}

.support-card-button-primary {
  background: var(--yellow);
  color: var(--teal-dark);
  border: 3px solid var(--yellow);
}

.support-card-button-outline {
  background: #fff;
  color: #c8232c;
  border: 3px solid #c8232c;
}

@media (max-width: 760px) {
  .support-head {
    padding: 42px 18px 58px;
  }

  .support-head h2 {
    font-size: clamp(34px, 10vw, 48px);
  }

  .support-lead {
    font-size: 16px;
    line-height: 1.8;
  }

  .support-body {
    padding: 42px 16px 58px;
  }

  .support-card-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .support-card {
    min-height: auto;
    border-radius: 24px;
    padding: 30px 24px;
  }

  .support-card h3 {
    font-size: clamp(26px, 8vw, 34px);
  }

  .support-card p {
    font-size: 15.5px;
  }

  .support-card-button {
    width: 100%;
  }
}

.office { background: #fff; overflow: hidden; }
.office-head { width: 100%; background: var(--teal-blue); min-height: clamp(88px, 9.8vw, 134px); display: flex; align-items: center; justify-content: center; padding: 20px 18px; }
.office-head h2 { margin: 0; color: #00526a; font-size: clamp(28px, 3.7vw, 48px); line-height: 1.15; font-weight: 1000; letter-spacing: .035em; text-align: center; }
.office-bg { background: #fff; width: 100%; }
.office-inner { width: min(1060px, 100%); margin: 0 auto; padding: clamp(26px, 3.2vw, 36px) 18px clamp(36px, 4.5vw, 60px); }
.office-address { margin: 0 0 clamp(22px, 2.7vw, 32px); display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; gap: clamp(16px, 2.3vw, 28px); color: #003f50; font-size: clamp(18px, 2.2vw, 29px); line-height: 1.35; font-weight: 900; }
.office-tel { color: #a91d22; text-decoration: none; font-size: clamp(30px, 4.4vw, 50px); font-weight: 1000; line-height: .95; letter-spacing: .02em; }
.office-map-link { display: block; width: min(690px, 100%); margin: 0 auto; line-height: 0; }
.office-map { display: block; width: 100%; height: auto; border-radius: 9px; box-shadow: none; border: 0; }
.office-map-link:hover .office-map, .office-map-link:focus-visible .office-map { filter: brightness(.98); }
.office-map-link:focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }
.site-footer { background: #00404c; color: #fff; padding: 42px 0 24px; }
.footer-grid { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; }
.footer-brand { margin: 0; font-size: 28px; font-weight: 1000; }
.site-footer nav { display: flex; gap: 16px; flex-wrap: wrap; }
.copyright { text-align: center; margin: 24px 0 0; color: rgba(255,255,255,.72); }

@media (min-width: 1080px) {
  .global-nav { display: flex; }
}
@media (max-width: 860px) {
  .menu-panel-nav { grid-template-columns: 1fr 1fr; }
  .support-box { grid-template-columns: 1fr; }
  .profile-inner { grid-template-columns: minmax(160px, 32%) 1fr; min-height: 560px; }
  .profile-photo { padding-left: 8px; margin-top: -58px; }
  .profile-photo img { width: min(220px, 95%); }
  .profile-text { padding-right: 28px; padding-left: 10px; }
  .cats { opacity: .9; right: 18px; top: 92px; transform: scale(.82); transform-origin: top right; }
  .sns-inner { grid-template-columns: minmax(155px, 42%) minmax(170px, 48%); gap: 18px; min-height: 0; padding-top: 34px; }
  .sns-phone { width: min(220px, 100%); }
  .sns-person { width: min(285px, 100%); }
}
@media (max-width: 640px) {
  .header-inner { height: 66px; }
  .brand-sub { display: none; }
  .brand-main { font-size: 31px; }
  .menu-button { width: 48px; height: 42px; }
  .menu-button span { width: 48px; height: 3px; }
  .menu-button.is-open span:nth-child(1) { transform: translateY(14px) rotate(45deg); }
  .menu-button.is-open span:nth-child(3) { transform: translateY(-14px) rotate(-45deg); }
  .menu-panel-nav { grid-template-columns: 1fr; }
  .message-title-wrap, .message-body { width: min(100% - 28px, 760px); }
  .message-title-wrap h2 { font-size: clamp(24px, 7vw, 34px); padding-inline: 16px; }
  .message-row { grid-template-columns: 38px 1fr; gap: 9px; }
  .message-row p { font-size: 14.5px; line-height: 1.85; font-weight: 800; }
  .message-initial { width: 34px; height: 34px; font-size: 26px; }
  .policy-list { width: min(100% - 30px, 760px); }
  .policy-item { grid-template-columns: 50px 1fr; gap: 8px; }
  .policy-title { align-items: flex-start; }
  .policy-title span { flex-basis: auto; margin-left: 0; width: 100%; }
  .policy-title em, .policy-title b { line-height: 1.1; }
  .policy-content li { font-size: 14px; line-height: 1.68; }
  .profile-head { min-height: 72px; }
  .profile-inner { display: block; min-height: 0; padding-bottom: 36px; }
  .profile-photo { float: left; width: 35%; min-width: 118px; margin: -36px 10px 6px 0; padding: 0 0 0 10px; align-items: flex-start; }
  .profile-photo img { width: 100%; max-height: none; }
  .profile-text { padding: 22px 16px 0; }
  .profile-name { font-size: 21px; }
  .profile-facts, .profile-history { font-size: 15.5px; line-height: 1.65; }
  .profile-facts span { min-width: 4.3em; }
  .profile-history { clear: both; padding-top: 18px; margin-top: 22px; }
  .profile-history div { grid-template-columns: 7.2em 1fr; gap: 8px; }
  .cats { position: relative; right: auto; top: auto; margin: 14px 4px 0 auto; width: 132px; height: 105px; transform: scale(.72); transform-origin: center; }
  .sns-head { min-height: 76px; }
  .sns-head h2 { font-size: clamp(24px, 7.5vw, 34px); }
  .sns-inner { grid-template-columns: 1fr; justify-items: center; gap: 20px; padding: 28px 16px 0; }
  .sns-phone { justify-self: center; width: min(250px, 72vw); }
  .sns-person { justify-self: center; width: min(310px, 86vw); }
  .office-head { min-height: 76px; }
  .office-address { display: block; text-align: center; font-size: 17px; }
  .office-address span, .office-address a { display: block; margin: 0 0 8px; }
  .office-tel { font-size: 32px; }
  .office-inner { padding: 24px 14px 38px; }
  .section { padding: 58px 0; }
  .footer-grid { display: block; }
}
@media (max-width: 430px) {
  .policy-item { grid-template-columns: 1fr; }
  .policy-num { font-size: 58px; }
  .policy-title strong { font-size: 31px; }
  .policy-title em, .policy-title b { font-size: 23px; }
}

/* ========================================
   Support Page
======================================== */
.support-page {
  background: #fff;
}
.support-hero {
  background: var(--teal-blue);
  color: var(--teal-dark);
  padding: clamp(70px, 9vw, 112px) 0 clamp(58px, 7vw, 88px);
  text-align: center;
}
.support-hero h1 {
  margin: 0 0 18px;
  font-size: clamp(38px, 6vw, 72px);
  line-height: 1.16;
  font-weight: 1000;
  letter-spacing: .04em;
}
.support-lead {
  margin: 0 auto;
  max-width: 760px;
  font-size: clamp(17px, 2vw, 22px);
  line-height: 1.9;
  font-weight: 800;
}
.support-methods {
  background: #fff;
  padding: clamp(56px, 7vw, 86px) 0;
}
.support-method-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(22px, 4vw, 48px);
}
.support-method-card {
  border: 4px solid #c8232c;
  border-radius: 28px;
  padding: clamp(28px, 4vw, 42px);
  background: #fff;
  box-shadow: 0 12px 24px rgba(0, 74, 88, .08);
}
.support-method-card.accent {
  background: #fff4f4;
}
.support-method-card h2 {
  margin: 0 0 16px;
  color: #c8232c;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.25;
  font-weight: 1000;
}
.support-method-card p {
  margin: 0 0 24px;
  color: #003f50;
  font-size: clamp(16px, 1.8vw, 20px);
  line-height: 1.85;
  font-weight: 800;
}
.button.secondary-outline {
  background: #fff4f4;
  border-color: #c8232c;
  color: #c8232c;
}
.support-sns-link {
  background: var(--cream);
  padding: clamp(54px, 7vw, 82px) 0;
}
.support-sns-box {
  display: grid;
  grid-template-columns: 1.2fr auto;
  align-items: center;
  gap: 28px;
}
.support-sns-box h2 {
  margin: 0 0 12px;
  color: var(--teal-dark);
  font-size: clamp(30px, 4vw, 52px);
  line-height: 1.2;
  font-weight: 1000;
}
.support-sns-box p {
  margin: 0;
  color: #003f50;
  font-size: clamp(16px, 1.8vw, 20px);
  line-height: 1.85;
  font-weight: 800;
}
.support-office {
  background: #fff;
}

@media (max-width: 760px) {
  .support-method-grid,
  .support-sns-box {
    grid-template-columns: 1fr;
  }
  .support-method-card {
    border-radius: 22px;
  }
  .support-sns-box .button {
    justify-self: start;
  }
}



/* ========================================
   Support Page
======================================== */

.support-main {
  background: #fff;
}

.support-page-hero {
  background: var(--teal-blue);
  text-align: center;
  padding: clamp(70px, 8vw, 110px) 20px;
}

.support-page-hero h1 {
  margin: 0 0 40px;
  color: var(--teal-dark);
  font-size: clamp(46px, 7vw, 92px);
  line-height: 1.1;
  font-weight: 1000;
}

.support-page-buttons {
  display: flex;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
}

.support-anchor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 58px;
  padding: 16px 30px;
  border-radius: 999px;
  font-size: 17px;
  font-weight: 1000;
  text-decoration: none;
}

.support-anchor-button-yellow {
  background: var(--yellow);
  color: var(--teal-dark);
}

.support-anchor-button-outline {
  background: #fff;
  color: #c8232c;
  border: 3px solid #c8232c;
}

.support-content-section {
  padding: clamp(60px, 7vw, 100px) 20px;
  background: #fff;
}

.support-content-section-cream {
  background: var(--cream);
}

.support-section-title {
  margin: 0 0 30px;
  color: var(--teal-dark);
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1.2;
  font-weight: 1000;
}

.support-text {
  margin: 0 0 40px;
  color: var(--teal-dark);
  font-size: clamp(16px, 1.8vw, 22px);
  line-height: 2;
  font-weight: 900;
}

.google-form-wrap {
  width: 100%;
  overflow: hidden;
  border-radius: 18px;
}

.google-form-wrap iframe {
  width: 100%;
  background: #fff;
}

.google-form-wrap-large iframe {
  min-height: 5000px;
}

.support-credit-box {
  margin: 50px 0;
}

.support-credit-box p {
  margin: 0 0 30px;
  color: var(--teal-dark);
  font-size: clamp(16px, 1.8vw, 20px);
  line-height: 2;
  font-weight: 900;
}

.support-senkyo-link img {
  width: min(260px, 100%);
  height: auto;
}

@media (max-width: 640px) {
  .support-page-buttons {
    flex-direction: column;
  }

  .support-anchor-button {
    width: 100%;
  }

  .support-content-section {
    padding: 50px 16px;
  }

  .support-text {
    font-size: 15px;
    line-height: 1.9;
  }
}


/* ========================================
   Support Block Final
======================================== */

.support-head{
  background: var(--teal-blue);
  text-align:center;
  padding:70px 20px;
}

.support-head h2{
  margin:0;
  color:var(--teal-dark);
  font-size:clamp(42px,5vw,76px);
  line-height:1.15;
  font-weight:1000;
}

.support-body{
  background:#fff;
  padding:60px 20px 90px;
}

.support-description{
  width:min(900px,100%);
  margin:0 auto 50px;
  text-align:center;
  color:var(--teal-dark);
  font-size:clamp(17px,1.7vw,24px);
  line-height:1.9;
  font-weight:900;
}


/* ========================================
   Header Menu Fix
======================================== */

.menu-panel {
  display: none;
  padding: 22px 18px 28px;
  background: #003f4a;
  border-top: 1px solid rgba(255,255,255,.16);
}

.menu-open .menu-panel {
  display: block;
}

.menu-panel-nav {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  width: min(720px, 100%);
  margin: 0 auto;
}

.menu-panel-nav a {
  display: grid;
  place-items: center;
  min-height: 50px;
  border: 1px solid rgba(255,255,255,.26);
  border-radius: 999px;
  color: #fff;
  font-weight: 900;
}

.menu-panel-nav a:hover,
.menu-panel-nav a:focus-visible {
  background: var(--yellow);
  color: var(--teal-dark);
  outline: none;
}

@media (max-width: 860px) {
  .menu-panel-nav {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .menu-panel-nav {
    grid-template-columns: 1fr;
  }
}



/* ========================================
   Profile Responsive Fix
   Low resolution smartphone / tablet
======================================== */

.profile {
  overflow: hidden;
}

.profile-bg {
  overflow: hidden;
}

.profile-inner {
  overflow: visible;
}

/* Tablet: prevent person image and text from colliding */
@media (max-width: 980px) {
  .profile-inner {
    grid-template-columns: minmax(190px, 30%) 1fr;
    min-height: auto;
    align-items: stretch;
  }

  .profile-photo {
    margin-top: -42px;
    padding-left: 12px;
    align-items: flex-start;
  }

  .profile-photo img {
    width: min(210px, 88%);
    max-height: 560px;
  }

  .profile-text {
    padding: 28px 24px 42px 18px;
  }

  .profile-name {
    font-size: clamp(20px, 3.2vw, 28px);
  }

  .profile-facts,
  .profile-history {
    font-size: clamp(15px, 2.2vw, 19px);
  }

  .cats {
    right: 18px;
    top: 110px;
    transform: scale(.72);
    transform-origin: top right;
    opacity: .9;
  }
}

/* Smartphone: switch to stacked layout.
   Do not float profile photo; floating caused text/history collapse. */
@media (max-width: 720px) {
  .profile-head {
    min-height: 72px;
    padding: 18px 14px;
  }

  .profile-head h2 {
    font-size: clamp(26px, 7vw, 38px);
  }

  .profile-inner {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    min-height: 0;
    padding: 0;
  }

  .profile-photo {
    float: none;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 18px 0 0;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    order: 1;
  }

  .profile-photo img {
    width: min(230px, 54vw);
    max-height: none;
  }

  .profile-text {
    order: 2;
    padding: 20px 18px 42px;
    width: 100%;
  }

  .profile-name {
    margin-bottom: 14px;
    text-align: center;
    font-size: clamp(21px, 6vw, 28px);
  }

  .profile-facts {
    width: min(460px, 100%);
    margin: 0 auto;
    font-size: clamp(15px, 4.1vw, 17px);
    line-height: 1.85;
  }

  .profile-facts li {
    padding-left: 16px;
  }

  .profile-facts span {
    min-width: 4.7em;
  }

  .cats {
    position: relative;
    right: auto;
    top: auto;
    width: 124px;
    height: 92px;
    margin: 12px auto 10px;
    transform: scale(.72);
    transform-origin: center;
  }

  .profile-history {
    clear: none;
    width: min(460px, 100%);
    margin: 22px auto 0;
    padding-top: 0;
    font-size: clamp(14px, 3.9vw, 16px);
    line-height: 1.75;
  }

  .profile-history div {
    display: grid;
    grid-template-columns: 6.2em 1fr;
    gap: 8px;
    align-items: start;
  }

  .profile-history dt {
    white-space: nowrap;
  }
}

/* Small smartphone: make text readable and keep full body image inside viewport */
@media (max-width: 480px) {
  .profile-photo img {
    width: min(210px, 58vw);
  }

  .profile-text {
    padding: 18px 14px 38px;
  }

  .profile-facts,
  .profile-history {
    width: 100%;
  }

  .profile-facts li {
    padding-left: 14px;
  }

  .profile-facts span {
    display: inline-block;
    min-width: 4.4em;
    margin-right: .25em;
  }

  .profile-history div {
    grid-template-columns: 5.9em 1fr;
    gap: 6px;
  }
}

/* Very narrow phones */
@media (max-width: 360px) {
  .profile-head h2 {
    font-size: 24px;
  }

  .profile-photo img {
    width: 190px;
  }

  .profile-name {
    font-size: 19px;
  }

  .profile-facts,
  .profile-history {
    font-size: 13.5px;
  }

  .profile-history div {
    grid-template-columns: 5.5em 1fr;
  }
}



/* ========================================
   Anchor Position Fix
   Sticky header offset for menu links
======================================== */

#message,
#profile,
#sns,
#support,
#office,
#faq,
#policy {
  scroll-margin-top: 96px;
}

/* Each block title should remain visible after anchor jump */
.message,
.profile,
.sns,
.support,
.office,
.faq,
.policy {
  scroll-margin-top: 96px;
}

/* In-page anchor targets on FAQ page */
.faq-category {
  scroll-margin-top: 128px;
}

@media (max-width: 640px) {
  #message,
  #profile,
  #sns,
  #support,
  #office,
  #faq,
  #policy,
  .message,
  .profile,
  .sns,
  .support,
  .office,
  .faq,
  .policy {
    scroll-margin-top: 82px;
  }

  .faq-category {
    scroll-margin-top: 118px;
  }
}



/* Active menu indicator */
.global-nav a.is-current,
.menu-panel-nav a.is-current {
  background: var(--yellow);
  color: var(--teal-dark);
}



/* ========================================
   Profile Desktop Image Fix
   Prevent head from being clipped on large screens
======================================== */

@media (min-width: 981px) {
  .profile-inner {
    min-height: 760px;
    align-items: stretch;
  }

  .profile-photo {
    margin-top: -40px;
    padding-top: 0;
    align-items: flex-start;
  }

  .profile-photo img {
    width: min(300px, 86%);
    max-height: none;
    object-fit: contain;
    object-position: top center;
  }

  .profile-text {
    padding-top: 58px;
  }
}



/* ========================================
   FINAL PROFILE FIX
======================================== */

/* remove yellow active state */
.global-nav a.is-current,
.menu-panel-nav a.is-current {
  background: transparent !important;
  color: inherit !important;
}

/* desktop/tablet profile image clipping fix */
.profile {
  overflow: visible !important;
}

.profile-bg {
  overflow: visible !important;
}

.profile-inner {
  overflow: visible !important;
}

.profile-photo {
  overflow: visible !important;
}

.profile-photo img {
  display: block;
  object-fit: contain !important;
  object-position: top center !important;
}

/* large desktop */
@media (min-width: 981px) {
  .profile-inner {
    min-height: 860px !important;
    align-items: flex-start !important;
    padding-top: 0 !important;
  }

  .profile-photo {
    margin-top: 0 !important;
    padding-top: 34px !important;
    align-self: flex-start !important;
  }

  .profile-photo img {
    width: min(340px, 92%) !important;
    max-width: 340px !important;
    height: auto !important;
    max-height: none !important;
  }

  .profile-text {
    padding-top: 70px !important;
  }
}

/* tablet */
@media (min-width: 721px) and (max-width: 980px) {
  .profile-inner {
    min-height: 720px !important;
  }

  .profile-photo {
    margin-top: 0 !important;
    padding-top: 24px !important;
  }

  .profile-photo img {
    width: min(280px, 90%) !important;
    max-height: none !important;
  }
}



/* ========================================
   FINAL PROFILE CAT POSITION FIX
======================================== */

/* PC: keep cat illustration away from profile text */
@media (min-width: 981px) {
  .cats {
    top: 205px !important;
    right: 76px !important;
    transform: scale(.88) !important;
    transform-origin: top right !important;
    z-index: 1 !important;
    pointer-events: none !important;
  }

  .profile-text {
    z-index: 2 !important;
  }

  .profile-history {
    position: relative !important;
    z-index: 3 !important;
  }
}

/* tablet: move cats lower and smaller */
@media (min-width: 721px) and (max-width: 980px) {
  .cats {
    top: 190px !important;
    right: 24px !important;
    transform: scale(.62) !important;
    transform-origin: top right !important;
    z-index: 1 !important;
    pointer-events: none !important;
  }

  .profile-text {
    z-index: 2 !important;
  }
}

/* mobile: cats stay in normal flow, not absolute overlap */
@media (max-width: 720px) {
  .cats {
    position: relative !important;
    right: auto !important;
    top: auto !important;
    margin: 18px auto 12px !important;
    z-index: 1 !important;
  }
}



/* ========================================
   Hamburger Menu Text Color Fix
======================================== */

.menu-panel-nav a,
.menu-panel-nav a:visited,
.menu-panel-nav a:hover,
.menu-panel-nav a:active,
.menu-panel-nav a.is-current {
  color: #ffffff !important;
  background: transparent !important;
}

.global-nav a,
.global-nav a:visited,
.global-nav a:hover,
.global-nav a:active,
.global-nav a.is-current {
  color: #ffffff !important;
  background: transparent !important;
}



/* ========================================
   Hero Main Visual Size Fix
======================================== */

/* メインビジュアルは横幅いっぱいに近い見え方を優先 */
.hero {
  width: 100% !important;
  background: var(--teal) !important;
  overflow: hidden !important;
  line-height: 0 !important;
}

.hero-frame {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  line-height: 0 !important;
  font-size: 0 !important;
  background: var(--teal) !important;
}

.hero-frame img {
  display: block !important;
  width: 100% !important;
  max-width: 1041px !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center top !important;
}

/* 大画面では元デザイン相当の最大幅を維持 */
@media (min-width: 1041px) {
  .hero-frame img {
    width: 1041px !important;
  }
}

/* スマホでは画面幅に合わせて縮小 */
@media (max-width: 1040px) {
  .hero-frame img {
    width: 100% !important;
    max-width: 100% !important;
  }
}


/* ========================================
   Policy Responsive Fix
   Prevent text overlap on smartphone/tablet
======================================== */

.policy {
  overflow: hidden !important;
}

.policy-list {
  max-width: 820px !important;
}

.policy-item {
  align-items: start !important;
}

.policy-content,
.policy-title {
  min-width: 0 !important;
}

.policy-title strong,
.policy-title em,
.policy-title b {
  white-space: normal !important;
}

.policy-title span {
  flex-basis: 100% !important;
  margin-left: 0 !important;
  width: 100% !important;
  order: 1 !important;
}

.policy-title strong { order: 2 !important; }
.policy-title em { order: 3 !important; }
.policy-title b { order: 4 !important; }

.policy-content li {
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

@media (max-width: 900px) {
  .policy-list {
    width: min(100% - 36px, 760px) !important;
  }

  .policy-item {
    grid-template-columns: clamp(50px, 8vw, 70px) minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  .policy-title {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    column-gap: 10px !important;
    row-gap: 4px !important;
    align-items: end !important;
  }

  .policy-title span {
    grid-column: 1 / -1 !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
  }

  .policy-title strong {
    grid-column: 1 !important;
    font-size: clamp(28px, 6vw, 40px) !important;
    line-height: 1.08 !important;
  }

  .policy-title em,
  .policy-title b {
    grid-column: 2 !important;
    font-size: clamp(24px, 5vw, 36px) !important;
    line-height: 1.08 !important;
  }

  .policy-content li {
    font-size: clamp(14px, 2.2vw, 17px) !important;
    line-height: 1.8 !important;
  }
}

@media (max-width: 640px) {
  .policy {
    padding-bottom: 46px !important;
  }

  .policy-heading {
    padding: 18px 14px 20px !important;
  }

  .policy-heading p {
    align-items: center !important;
    font-size: clamp(17px, 5vw, 22px) !important;
    line-height: 1.25 !important;
  }

  .policy-heading p span {
    font-size: clamp(48px, 16vw, 64px) !important;
    line-height: .8 !important;
  }

  .policy-heading h2 {
    font-size: clamp(28px, 8vw, 40px) !important;
    line-height: 1.15 !important;
  }

  .policy-list {
    width: min(100% - 28px, 640px) !important;
    margin-top: 34px !important;
  }

  .policy-item {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .policy-item + .policy-item {
    margin-top: 56px !important;
  }

  .policy-num {
    font-size: 64px !important;
    line-height: .85 !important;
    transform: rotate(-10deg) !important;
    margin-left: 4px !important;
    width: max-content !important;
  }

  .policy-num::after {
    width: 42px !important;
    height: 22px !important;
  }

  .policy-title {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 4px !important;
    align-items: start !important;
  }

  .policy-title span,
  .policy-title strong,
  .policy-title em,
  .policy-title b {
    grid-column: 1 !important;
    margin: 0 !important;
    width: 100% !important;
  }

  .policy-title span {
    order: 1 !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    letter-spacing: .08em !important;
  }

  .policy-title strong {
    order: 2 !important;
    font-size: clamp(30px, 9vw, 38px) !important;
    line-height: 1.05 !important;
  }

  .policy-title em {
    order: 3 !important;
    font-size: clamp(28px, 8.2vw, 36px) !important;
    line-height: 1.12 !important;
  }

  .policy-title b {
    order: 4 !important;
    font-size: clamp(24px, 7vw, 32px) !important;
    line-height: 1.2 !important;
  }

  .policy-content ul {
    margin-top: 14px !important;
  }

  .policy-content li {
    font-size: clamp(15px, 4.2vw, 17px) !important;
    line-height: 1.85 !important;
    padding-left: 1.05em !important;
    letter-spacing: 0 !important;
  }

  .policy-content li::before {
    top: .6em !important;
    width: .65em !important;
    height: .65em !important;
  }
}

@media (max-width: 390px) {
  .policy-list {
    width: min(100% - 24px, 640px) !important;
  }

  .policy-title strong { font-size: 29px !important; }
  .policy-title em { font-size: 27px !important; }
  .policy-title b { font-size: 23px !important; }

  .policy-content li {
    font-size: 14.5px !important;
    line-height: 1.82 !important;
  }
}


/* ========================================
   Profile Responsive Final Fix
   Prevent overlap on mobile/tablet/desktop
======================================== */

.profile,
.profile-bg,
.profile-inner,
.profile-text,
.profile-history {
  overflow: visible !important;
}

.profile-inner,
.profile-text {
  min-width: 0 !important;
}

/* PC / large tablet */
@media (min-width: 981px) {
  .profile-inner {
    display: grid !important;
    grid-template-columns: minmax(260px, 34%) minmax(0, 1fr) !important;
    align-items: start !important;
    min-height: 760px !important;
  }

  .profile-photo {
    margin: 0 !important;
    padding: 34px 0 0 24px !important;
    align-self: start !important;
  }

  .profile-photo img {
    width: min(320px, 90%) !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: top center !important;
  }

  .profile-text {
    padding: 58px 48px 56px 24px !important;
  }

  .profile-history {
    display: grid !important;
    gap: 8px !important;
    margin-top: 58px !important;
  }

  .profile-history div {
    display: grid !important;
    grid-template-columns: 9.5em minmax(0, 1fr) !important;
    column-gap: 22px !important;
    align-items: start !important;
  }

  .profile-history dt,
  .profile-history dd {
    min-width: 0 !important;
    line-height: 1.65 !important;
  }

  .profile-history dd {
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }
}

/* Tablet */
@media (min-width: 721px) and (max-width: 980px) {
  .profile-inner {
    display: grid !important;
    grid-template-columns: minmax(190px, 32%) minmax(0, 1fr) !important;
    align-items: start !important;
    min-height: auto !important;
  }

  .profile-photo {
    margin: 0 !important;
    padding: 24px 0 0 14px !important;
  }

  .profile-photo img {
    width: min(250px, 90%) !important;
    height: auto !important;
    max-height: none !important;
  }

  .profile-text {
    padding: 34px 28px 44px 18px !important;
  }

  .profile-history {
    display: grid !important;
    gap: 7px !important;
    margin-top: 36px !important;
  }

  .profile-history div {
    display: grid !important;
    grid-template-columns: 8.5em minmax(0, 1fr) !important;
    column-gap: 16px !important;
    align-items: start !important;
  }

  .profile-history dt,
  .profile-history dd {
    min-width: 0 !important;
    line-height: 1.65 !important;
    font-size: clamp(14px, 2vw, 17px) !important;
  }

  .profile-history dd {
    overflow-wrap: anywhere !important;
  }
}

/* Smartphone: full stacked layout, no overlapping dl */
@media (max-width: 720px) {
  .profile-head {
    padding: 20px 14px !important;
  }

  .profile-head h2 {
    font-size: clamp(26px, 7.4vw, 38px) !important;
    line-height: 1.2 !important;
  }

  .profile-inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
  }

  .profile-photo {
    order: 1 !important;
    margin: 0 !important;
    padding: 18px 0 0 !important;
    justify-content: center !important;
    align-items: end !important;
  }

  .profile-photo img {
    width: min(210px, 52vw) !important;
    height: auto !important;
    max-height: none !important;
  }

  .profile-text {
    order: 2 !important;
    width: 100% !important;
    padding: 22px 20px 44px !important;
  }

  .profile-name {
    margin: 0 0 18px !important;
    text-align: center !important;
    font-size: clamp(21px, 5.8vw, 29px) !important;
    line-height: 1.35 !important;
  }

  .profile-facts {
    width: min(520px, 100%) !important;
    margin: 0 auto !important;
    display: grid !important;
    gap: 8px !important;
    font-size: clamp(15px, 4vw, 17px) !important;
    line-height: 1.75 !important;
  }

  .profile-facts li {
    display: grid !important;
    grid-template-columns: 5.4em minmax(0, 1fr) !important;
    gap: 8px !important;
    padding-left: 14px !important;
  }

  .profile-facts span {
    min-width: 0 !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  .cats {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    width: 130px !important;
    height: 94px !important;
    margin: 18px auto 16px !important;
    transform: scale(.72) !important;
    transform-origin: center !important;
  }

  .profile-history {
    clear: both !important;
    width: min(540px, 100%) !important;
    margin: 22px auto 0 !important;
    display: grid !important;
    gap: 12px !important;
    font-size: clamp(15px, 4.05vw, 17px) !important;
    line-height: 1.7 !important;
  }

  .profile-history div {
    display: grid !important;
    grid-template-columns: 6.3em minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: start !important;
  }

  .profile-history dt {
    white-space: nowrap !important;
    min-width: 0 !important;
    line-height: 1.65 !important;
  }

  .profile-history dd {
    min-width: 0 !important;
    line-height: 1.65 !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }
}

/* Small phones */
@media (max-width: 430px) {
  .profile-text {
    padding: 20px 16px 40px !important;
  }

  .profile-photo img {
    width: min(195px, 54vw) !important;
  }

  .profile-history {
    font-size: 14.5px !important;
    gap: 11px !important;
  }

  .profile-history div {
    grid-template-columns: 5.7em minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  .profile-facts {
    font-size: 14.5px !important;
  }

  .profile-facts li {
    grid-template-columns: 5.1em minmax(0, 1fr) !important;
    gap: 7px !important;
  }
}

/* Very narrow phones */
@media (max-width: 360px) {
  .profile-head h2 {
    font-size: 24px !important;
  }

  .profile-photo img {
    width: 178px !important;
  }

  .profile-name {
    font-size: 19px !important;
  }

  .profile-facts,
  .profile-history {
    font-size: 13.5px !important;
  }

  .profile-history div {
    grid-template-columns: 5.35em minmax(0, 1fr) !important;
  }
}


/* ========================================
   FINAL Profile History Overlap Fix
   年号と本文の重なりを完全回避
======================================== */

/* 980px以下は2カラムをやめ、年号と本文を縦積みにする */
@media (max-width: 980px) {
  .profile-history {
    width: min(560px, 100%) !important;
    margin: 26px auto 0 !important;
    padding: 0 !important;
    display: block !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
  }

  .profile-history div {
    display: block !important;
    margin: 0 0 18px !important;
    padding: 0 0 16px !important;
    border-bottom: 1px solid rgba(0, 121, 140, .18) !important;
  }

  .profile-history div:last-child {
    border-bottom: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .profile-history dt,
  .profile-history dd {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    clear: both !important;
    white-space: normal !important;
    overflow: visible !important;
    text-indent: 0 !important;
    transform: none !important;
  }

  .profile-history dt {
    color: var(--teal) !important;
    font-weight: 1000 !important;
    line-height: 1.35 !important;
    margin-bottom: 4px !important;
  }

  .profile-history dd {
    color: #000 !important;
    font-weight: 900 !important;
    line-height: 1.7 !important;
    word-break: keep-all !important;
    overflow-wrap: anywhere !important;
  }
}

/* スマホはさらに余白と文字サイズを最適化 */
@media (max-width: 640px) {
  .profile-history {
    font-size: 15px !important;
    line-height: 1.7 !important;
  }

  .profile-history div {
    margin-bottom: 16px !important;
    padding-bottom: 14px !important;
  }

  .profile-history dt {
    font-size: 15px !important;
  }

  .profile-history dd {
    font-size: 15px !important;
  }
}

@media (max-width: 390px) {
  .profile-history {
    font-size: 14px !important;
  }

  .profile-history dt,
  .profile-history dd {
    font-size: 14px !important;
  }
}


/* ========================================
   HARD FIX: profile history overlap
======================================== */

@media (max-width: 980px) {

  .profile-history * {
    float: none !important;
  }

  .profile-history dl,
  .profile-history div {
    display: block !important;
    width: 100% !important;
  }

  .profile-history dt {
    display: block !important;
    width: 100% !important;
    margin: 0 0 2px 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
    clear: both !important;
  }

  .profile-history dd {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.7 !important;
    clear: both !important;
  }

  /* 以前のgrid/table指定を完全無効化 */
  .profile-history div,
  .profile-history dl,
  .profile-history-row {
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
    table-layout: auto !important;
  }
}


/* ========================================
   Policy More Link
======================================== */

.policy-more{
  width:min(760px, calc(100% - 44px));
  margin:34px auto 0;
  text-align:right;
}

.policy-more a{
  color:#c8232c;
  font-size:16px;
  font-weight:1000;
  text-decoration:underline;
}

.policy-more a:hover,
.policy-more a:focus-visible{
  opacity:.72;
  outline:none;
}

@media (max-width:640px){
  .policy-more{
    width:min(100% - 28px, 640px);
    margin-top:28px;
    text-align:center;
  }

  .policy-more a{
    font-size:15px;
  }
}


/* ========================================
   Support Hero Compact
======================================== */

.support-hero{padding:92px 20px 74px!important;min-height:auto!important}

.support-hero h1{font-size:clamp(42px,5vw,72px)!important;line-height:1.1}

.support-hero p{width:min(980px,100%);margin:22px auto 0;font-size:clamp(16px,1.5vw,20px);line-height:1.9}

@media (max-width:640px){

  .support-hero{padding:92px 20px 74px!important;min-height:auto!important}

  .support-hero h1{font-size:clamp(42px,5vw,72px)!important;line-height:1.1}

  .support-hero p{width:min(980px,100%);margin:22px auto 0;font-size:clamp(16px,1.5vw,20px);line-height:1.9}

}

/* ========================================
   Policy More Link Size Fix
======================================== */

.policy-more{
  margin-top:52px !important;
}

.policy-more a{
  color:#c8232c;
  font-size:22px !important;
  font-weight:1000;
  line-height:1.6;
  text-decoration:underline;
  text-underline-offset:4px;
}

@media (max-width:640px){
  .policy-more{
    margin-top:34px !important;
  }

  .policy-more a{
    font-size:18px !important;
    line-height:1.6;
  }
}
