:root {
  color-scheme: light;
  --ink: #20302b;
  --text: #405048;
  --muted: #59665e;
  --accent: #2e6050;
  --line: #ccd4cc;
  --wash: #f0f3ee;
  --paper: #fcfcf9;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  color: var(--ink);
  background: var(--paper);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body, h1, h2, h3, p, figure, dl, dd { margin: 0; }
a { color: inherit; text-underline-offset: .24em; }
a:focus-visible, summary:focus-visible { outline: 3px solid #216e51; outline-offset: 4px; }
[id] { scroll-margin-top: 24px; }
.wrap { width: min(1160px, calc(100% - clamp(40px, 10vw, 160px))); margin-inline: auto; }
.skip { position: absolute; left: 12px; top: -100px; padding: 12px; background: white; z-index: 10; }
.skip:focus { top: 5px; }
.preview { background: #293931; color: #e6eee6; font-size: 12px; letter-spacing: .04em; }
.preview > div { display: flex; align-items: center; min-height: 34px; gap: 13px; }
.preview b { border-right: 1px solid #829286; padding-right: 13px; font-weight: 600; }
.mast { border-bottom: 1px solid var(--line); }
.mast-inner, .brand, .mast nav, .foot { display: flex; align-items: center; }
.mast-inner { min-height: 86px; justify-content: space-between; gap: 22px; }
.brand, .mast a, .foot a, .text-link, .button, .back { text-decoration: none; }
.brand { gap: 11px; font-family: "Inter", Arial, sans-serif; font-size: clamp(18px, 2.1vw, 26px); font-weight: 650; letter-spacing: -.052em; line-height: 1.2; }
.brand small { display: block; margin-top: 4px; font-size: 10px; font-weight: 600; letter-spacing: .13em; }
.symbol { position: relative; display: inline-block; width: 31px; height: 33px; flex: none; color: var(--accent); }
.symbol::before, .symbol::after { content: ""; position: absolute; border: 2px solid currentColor; width: 16px; height: 21px; transform: skewY(-15deg); }
.symbol::before { left: 0; top: 3px; }
.symbol::after { right: 0; bottom: 2px; background: var(--paper); }
.mast nav { gap: clamp(14px, 2.7vw, 38px); font-size: 14px; font-weight: 600; }
.mast nav a:hover, .foot a:hover, .back:hover, .contents a:hover { text-decoration: underline; }
.contact-nav { border: 1px solid #bdc9bf; padding: 9px 16px; border-radius: 3px; }
.hero { display: grid; grid-template-columns: 1fr .94fr; align-items: center; gap: clamp(24px, 5vw, 68px); padding-block: clamp(48px, 6vw, 82px); }
h1 { font-size: clamp(44px, 5.6vw, 78px); font-weight: 650; line-height: 1.18; letter-spacing: -.065em; }
.hero-copy p, .policy-hero p { max-width: 34em; color: var(--text); font-size: clamp(15px, 1.3vw, 18px); line-height: 1.9; margin-top: 24px; }
.keep { white-space: nowrap; }
.text-link { color: var(--accent); display: inline-flex; gap: 12px; align-items: center; padding: 3px 0; border-bottom: 1px solid #90a699; font-size: 14px; font-weight: 650; }
.text-link:hover { border-bottom-color: var(--accent); }
.hero-copy .text-link { margin-top: 24px; }
.diagram { position: relative; display: flex; align-items: center; justify-content: center; min-height: clamp(236px, 22vw, 312px); padding: 50px 22px 34px; border: 1px solid #c7d2c9; border-radius: 3px; background-color: #edf1e9; background-image: radial-gradient(#c5d1c3 .75px, transparent .85px); background-size: 12px 12px; }
.diagram figcaption { position: absolute; top: 15px; left: 18px; font-size: 12px; font-weight: 600; letter-spacing: .05em; color: var(--muted); }
.map { width: 100%; max-width: 415px; display: grid; grid-template-columns: minmax(0,1fr) minmax(65px,.62fr) minmax(0,1fr); align-items: center; }
.entity { aspect-ratio: 1; width: 100%; max-width: 152px; border-radius: 50%; border: 1px solid #809889; background: var(--paper); display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; gap: 7px; }
.entity .symbol { transform: scale(.66); height: 22px; }
.entity .symbol::before, .entity .symbol::after { height: 20px; }
.entity strong { font-family: "Inter", Arial, sans-serif; font-size: clamp(15px,1.7vw,24px); line-height: 1.04; font-weight: 600; letter-spacing: -.04em; }
.entity small, .connection small { font-size: 10px; font-weight: 600; letter-spacing: .02em; }
.clinic-entity { background: #dce7db; }
.medical-cross { width: 18px; height: 18px; margin-block: 2px; background: var(--accent); clip-path: polygon(32% 0,68% 0,68% 32%,100% 32%,100% 68%,68% 68%,68% 100%,32% 100%,32% 68%,0 68%,0 32%,32% 32%); }
.connection { width: 100%; position: relative; text-align: center; border-top: 1px solid #526c5e; color: var(--text); }
.connection small { position: absolute; white-space: nowrap; bottom: 8px; left: 50%; transform: translateX(-50%); }
.connection i { position: absolute; width: 7px; height: 7px; border-top: 1px solid; border-right: 1px solid; right: 2px; top: -4px; transform: rotate(45deg); }
.section { display: grid; grid-template-columns: minmax(0,.68fr) minmax(0,1.32fr); column-gap: 38px; padding-block: clamp(38px,5vw,72px); border-top: 1px solid var(--line); }
h2 { font-size: clamp(23px,2.6vw,34px); line-height: 1.45; letter-spacing: -.042em; font-weight: 650; }
.section-head p { margin-top: 10px; font-size: 14px; color: var(--muted); }
.service-list > div { padding-block: 18px; display: grid; grid-template-columns: minmax(110px,.65fr) minmax(0,1.35fr); column-gap: 18px; border-bottom: 1px solid var(--line); }
.service-list > div:first-child { padding-top: 4px; }
.service-list h3 { font-size: 17px; font-weight: 650; }
.service-list p, .clinic-card p, .contact-body p, .articles p { color: var(--text); font-size: 15px; line-height: 1.95; }
.clinic-card { padding: clamp(22px,3vw,38px); border-left: 3px solid #95ac97; background: var(--wash); }
.clinic-card h3 { font: 500 clamp(31px,3.5vw,47px)/1.15 "Inter", Arial, sans-serif; letter-spacing: -.055em; }
.clinic-card > div p { font-size: 13px; }
.clinic-card > p { margin-block: 17px; }
.button { display: inline-flex; justify-content: space-between; align-items: center; gap: 22px; padding: 12px 18px; background: #314b3e; color: #fff; font-size: 14px; font-weight: 600; border-radius: 3px; }
.button:hover { background: #20382b; }
.facts > div { display: grid; grid-template-columns: minmax(90px,.55fr) minmax(0,1.45fr); border-bottom: 1px solid var(--line); gap: 18px; padding: 15px 0; font-size: 15px; line-height: 1.65; }
.facts > div:first-child { padding-top: 4px; }
.facts dt { font-weight: 600; }
.muted, .policy-end { color: var(--muted); }
.contact { background: var(--wash); border-block: 1px solid var(--line); }
.contact .section { border: 0; }
.contact-body > .text-link { margin-top: 14px; }
.demo-contact { margin-top: 21px; }
.demo-contact summary { cursor: pointer; padding: 13px 18px; border: 1px solid #9cafa0; border-radius: 3px; font-size: 14px; width: fit-content; }
.demo-contact summary:hover { background: #e0e9df; }
.demo-contact p { padding-block: 12px; }
.foot { min-height: 86px; flex-wrap: wrap; gap: 12px 25px; font-size: 12px; color: var(--text); }
.foot-name { margin-right: auto; font-size: 14px; font-weight: 650; }
.back { color: var(--accent); font-size: 13px; }
.policy-hero { padding-block: 35px 40px; border-bottom: 1px solid var(--line); }
.policy-hero h1 { font-size: clamp(32px,5.2vw,66px); margin-block: 26px 18px; }
.policy-hero p { margin: 0; max-width: 52em; }
.policy-layout { display: grid; grid-template-columns: minmax(180px,.63fr) minmax(0,1.37fr); align-items: start; gap: clamp(26px,5vw,72px); padding-block: 42px 72px; }
.contents { position: sticky; top: 22px; padding: 21px; background: var(--wash); border: 1px solid var(--line); }
.contents h2 { font-size: 16px; }
.contents ol { margin: 14px 0 0; padding-left: 1.45em; font-size: 13px; }
.contents li { margin-top: 10px; }
.contents a { color: var(--text); text-decoration: none; line-height: 1.6; }
.articles section { padding-block: 24px; border-bottom: 1px solid var(--line); }
.articles section:first-child { padding-top: 0; }
.articles h2 { font-size: clamp(21px,2vw,27px); margin-bottom: 12px; }
.articles p + p, .articles .text-link, .policy-facts { margin-top: 12px; }
.policy-end { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; padding-top: 18px; font-size: 12px; }
body:has(.policy-layout) footer { border-top: 1px solid var(--line); }
@media (max-width: 760px) {
  .mast-inner { min-height: 72px; }
  .hero { grid-template-columns: 1fr; }
  .diagram { min-height: 230px; }
  .map { max-width: 340px; }
  .section, .policy-layout { grid-template-columns: 1fr; row-gap: 23px; }
  .contents { position: static; }
  .foot { padding-block: 22px; }
  .foot-name { width: 100%; }
}
@media (max-width: 600px) {
  .mast-inner { flex-wrap: wrap; gap: 12px; padding-block: 14px 9px; }
  .brand { font-size: 19px; gap: 8px; }
  .brand small { font-size: 9px; }
  .mast nav { width: 100%; gap: 20px; font-size: 12px; }
  .mast nav a { padding-block: 7px; }
  .contact-nav { border: 0; padding-inline: 0; }
  .hero { padding-block: 37px; gap: 25px; }
  .hero-copy p { margin-top: 16px; }
  .hero-copy .text-link { margin-top: 12px; }
  .diagram { min-height: 202px; padding-inline: 15px; }
  .map { max-width: 315px; }
  .entity strong { font-size: 16px; }
  .entity { gap: 5px; }
  .preview { font-size: 10px; }
  .service-list > div { grid-template-columns: 1fr; row-gap: 5px; }
  .facts > div { grid-template-columns: 80px 1fr; gap: 12px; font-size: 14px; }
  .policy-layout { padding-block: 25px 42px; }
  .policy-hero { padding-block: 23px 30px; }
  .policy-hero h1 { margin-block: 18px 12px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
