:root{
  --sky:#3ba9dc; --sky-d:#1678ad; --sky-l:#8fd0ee; --navy:#17415c;
  --ice:#f0f9fd; --ice2:#dff1fa; --mint:#6fd3c4; --coral:#f2724f; --coral-d:#d85a39;
  --text:#27424f; --muted:#5f7a88; --line:#d3e8f2; --white:#fff;
  --r:18px; --shadow:0 10px 30px rgba(23,65,92,.08);
  --fh:'Zen Maru Gothic','Noto Sans JP',sans-serif;
  --fb:'Noto Sans JP',-apple-system,'Hiragino Kaku Gothic ProN',Meiryo,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--fb);color:var(--text);background:#fff;line-height:1.85;font-size:16px;-webkit-text-size-adjust:100%}
img,svg{max-width:100%;display:block}
a{color:var(--sky-d);text-decoration:none}
a:hover{opacity:.85}
ul{list-style:none}
.wrap{width:min(1120px,100% - 40px);margin-inline:auto}
.sec{padding:84px 0}
.sec.ice{background:var(--ice)}
.eyebrow{font-family:var(--fh);font-weight:700;letter-spacing:.18em;font-size:13px;color:var(--sky);text-transform:uppercase}
.h2{font-family:var(--fh);font-size:clamp(24px,3.4vw,34px);color:var(--navy);line-height:1.4;margin:6px 0 14px;font-weight:700}
.lead{color:var(--muted);max-width:720px}
.center{text-align:center}.center .lead{margin-inline:auto}

/* header */
.hd{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.hd .in{display:flex;align-items:center;justify-content:space-between;height:74px;gap:16px}
.logo{display:flex;align-items:center;gap:10px;color:var(--navy)}
.logo svg{width:38px;height:38px;flex:none}
.logo b{display:block;white-space:nowrap;font-family:var(--fh);font-size:19px;line-height:1.2}
.hd .btn{white-space:nowrap}
@media(max-width:1260px){.hd-cta .btn-tel{display:none}}
.logo small{display:block;font-size:11px;color:var(--muted);letter-spacing:.08em}
.gnav{display:flex;gap:4px;align-items:center}
.gnav>li{position:relative}
.gnav>li>a{display:block;white-space:nowrap;padding:8px 10px;color:var(--navy);font-size:14px;font-weight:500;border-radius:999px}
.gnav>li>a:hover,.gnav>li>a.cur{background:var(--ice2);opacity:1}
.sub{position:absolute;left:0;top:100%;min-width:210px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:8px;display:none}
.gnav>li:hover .sub{display:block}
.sub a{display:block;padding:8px 12px;color:var(--text);font-size:14px;border-radius:8px}
.sub a:hover{background:var(--ice)}
.hd-cta{display:flex;gap:8px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border-radius:999px;font-weight:700;font-family:var(--fh);font-size:15px;border:2px solid transparent;cursor:pointer;transition:.2s;line-height:1.3}
.btn-web{background:var(--coral);color:#fff;box-shadow:0 8px 18px rgba(242,114,79,.28)}
.btn-web:hover{background:var(--coral-d);opacity:1;transform:translateY(-1px)}
.btn-tel{background:#fff;color:var(--sky-d);border-color:var(--sky)}
.btn-tel:hover{background:var(--ice);opacity:1}
.btn-ghost{background:var(--ice2);color:var(--navy)}
.btn svg{width:18px;height:18px}
.hd .btn{padding:9px 18px;font-size:14px}
.burger{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:#fff;cursor:pointer;position:relative}
.burger i{position:absolute;left:12px;right:12px;height:2px;background:var(--navy);border-radius:2px;transition:.25s}
.burger i:nth-child(1){top:15px}.burger i:nth-child(2){top:21px}.burger i:nth-child(3){top:27px}
.burger.on i:nth-child(1){top:21px;transform:rotate(45deg)}
.burger.on i:nth-child(2){opacity:0}
.burger.on i:nth-child(3){top:21px;transform:rotate(-45deg)}

/* hero */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#e6f5fc 0%,#f6fcff 70%,#fff 100%);padding:56px 0 70px}
.hero .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center}
.hero .tag{display:inline-flex;gap:8px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 16px;font-size:13px;color:var(--sky-d);font-weight:700}
.hero h1{font-family:var(--fh);font-size:clamp(30px,5vw,52px);line-height:1.35;color:var(--navy);margin:16px 0 14px;font-weight:700}
.hero h1 em{font-style:normal;color:var(--sky);background:linear-gradient(transparent 68%,rgba(111,211,196,.45) 68%)}
.hero p{color:var(--muted);max-width:520px}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.hero .cta .btn{padding:15px 28px;font-size:16px}
.vis{position:relative;aspect-ratio:1/1;max-width:470px;margin-inline:auto;width:100%}
.vis svg{width:100%;height:100%}
.today{background:#fff;border-radius:var(--r);box-shadow:var(--shadow);border:1px solid var(--line);padding:16px 18px;display:flex;gap:14px;align-items:center;margin-top:24px;max-width:520px}
.today .dot{width:14px;height:14px;border-radius:50%;background:#aaa;flex:none;box-shadow:0 0 0 6px rgba(0,0,0,.05)}
.today.open .dot{background:#2fc58a;box-shadow:0 0 0 6px rgba(47,197,138,.18)}
.today.break .dot{background:#f0b429;box-shadow:0 0 0 6px rgba(240,180,41,.2)}
.today.closed .dot{background:#e5646a;box-shadow:0 0 0 6px rgba(229,100,106,.16)}
.today b{font-family:var(--fh);color:var(--navy);display:block;line-height:1.4}
.today small{color:var(--muted);font-size:13px;display:block;line-height:1.6}

/* info */
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--shadow)}
.card h3{font-family:var(--fh);color:var(--navy);font-size:19px;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.card h3 svg{width:22px;height:22px;color:var(--sky)}
table.hours{width:100%;border-collapse:collapse;text-align:center;font-size:14px}
table.hours th,table.hours td{padding:10px 4px;border-bottom:1px solid var(--line)}
table.hours thead th{background:var(--ice2);color:var(--navy);font-weight:700}
table.hours thead th:first-child{border-radius:10px 0 0 10px}
table.hours thead th:last-child{border-radius:0 10px 10px 0}
table.hours td:first-child{text-align:left;font-weight:700;color:var(--navy);white-space:nowrap;padding-left:10px}
.ok{color:var(--sky);font-weight:700}.ng{color:#b8c8d2}
.note{font-size:13px;color:var(--muted);margin-top:10px}
.cal-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-family:var(--fh);font-weight:700;color:var(--navy)}
.cal-h button{border:1px solid var(--line);background:#fff;border-radius:50%;width:34px;height:34px;cursor:pointer;color:var(--sky-d);font-size:16px}
table.cal{width:100%;border-collapse:separate;border-spacing:3px;text-align:center;font-size:14px}
table.cal th{font-weight:500;color:var(--muted);padding:4px 0;font-size:12px}
table.cal td{height:42px;border-radius:10px;background:var(--ice);position:relative;vertical-align:middle}
table.cal td.e{background:transparent}
table.cal td.sun,table.cal td.hol{color:#d9575d}
table.cal td.sat{color:var(--sky-d)}
table.cal td.off{background:#fde8e9;color:#c0444b;font-weight:700}
table.cal td.pm{background:#fff2d9;color:#a8710b;font-weight:700}
table.cal td.chg{background:#e0f0ff;color:#1a62b4;font-weight:700}
table.cal td.today-c{outline:2px solid var(--sky)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:10px}
.legend i{display:inline-block;width:12px;height:12px;border-radius:4px;vertical-align:-1px;margin-right:4px}

/* symptoms */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.chip{display:inline-flex;gap:8px;align-items:center;padding:12px 20px;border-radius:999px;background:#fff;border:1.5px solid var(--line);color:var(--navy);font-weight:500;font-size:15px;transition:.2s}
.chip:hover{border-color:var(--sky);background:var(--ice);opacity:1;transform:translateY(-2px)}
.chip svg{width:20px;height:20px;color:var(--sky)}

/* service */
.svc{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:34px}
.svc .card{padding:0;overflow:hidden}
.svc .top{padding:28px 28px 20px;color:#fff}
.svc .top.a{background:linear-gradient(135deg,#3ba9dc,#1f86bd)}
.svc .top.b{background:linear-gradient(135deg,#6fd3c4,#35a99f)}
.svc .top h3{color:#fff;font-size:24px;margin:0 0 8px}
.svc .top p{font-size:14px;opacity:.95}
.svc ul.lk{padding:14px 28px 24px}
.svc ul.lk li a{display:flex;justify-content:space-between;padding:12px 2px;border-bottom:1px dashed var(--line);color:var(--navy);font-weight:500}
.svc ul.lk li a:after{content:"›";color:var(--sky);font-size:20px;line-height:1}

/* reasons */
.rs{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.rs .card{text-align:left;position:relative;padding-top:34px}
.rs .no{position:absolute;top:-18px;left:22px;font-family:var(--fh);font-weight:700;font-size:15px;color:#fff;background:var(--sky);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;box-shadow:0 6px 14px rgba(59,169,220,.35)}
.rs h3{font-family:var(--fh);color:var(--navy);font-size:19px;margin-bottom:8px}
.rs p{font-size:14.5px;color:var(--muted)}

/* flow */
.flow{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px;counter-reset:f}
.flow li{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px;position:relative}
.flow li:before{counter-increment:f;content:"STEP " counter(f);font-family:var(--fh);font-weight:700;font-size:12px;letter-spacing:.14em;color:var(--sky)}
.flow li b{display:block;font-family:var(--fh);color:var(--navy);font-size:18px;margin:4px 0 6px}
.flow li p{font-size:14px;color:var(--muted)}
.flow li:not(:last-child):after{content:"";position:absolute;right:-14px;top:50%;width:10px;height:10px;border-top:3px solid var(--sky-l);border-right:3px solid var(--sky-l);transform:translateY(-50%) rotate(45deg)}

/* news */
.nb{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.nl li a{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);color:var(--text);align-items:baseline}
.nl time{font-family:var(--fh);color:var(--sky-d);font-weight:700;font-size:14px;white-space:nowrap}
.nl .lab{font-size:11px;background:var(--ice2);color:var(--navy);padding:1px 10px;border-radius:999px;white-space:nowrap}
.more{display:inline-block;margin-top:14px;font-weight:700;font-family:var(--fh)}
.more:after{content:" →"}

/* access */
.acc{display:grid;grid-template-columns:1fr 1.2fr;gap:28px;align-items:stretch}
.acc iframe{width:100%;height:100%;min-height:320px;border:0;border-radius:var(--r);background:var(--ice2)}
.dl dt{font-weight:700;color:var(--navy);font-family:var(--fh);margin-top:12px}
.dl dd{color:var(--text)}

/* page head */
.ph{background:linear-gradient(180deg,#e6f5fc,#f6fcff);padding:46px 0 38px;border-bottom:1px solid var(--line)}
.ph h1{font-family:var(--fh);font-size:clamp(26px,4vw,38px);color:var(--navy);margin-top:4px}
.crumb{font-size:13px;color:var(--muted)}
.crumb a{color:var(--muted)}
.crumb span{margin:0 6px}
.prose h2{font-family:var(--fh);color:var(--navy);font-size:24px;margin:46px 0 14px;padding-left:16px;border-left:6px solid var(--sky)}
.prose h3{font-family:var(--fh);color:var(--sky-d);font-size:18px;margin:26px 0 8px}
.prose p{margin-bottom:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start}
.ticks li{position:relative;padding:8px 8px 8px 34px;border-bottom:1px dashed var(--line)}
.ticks li:before{content:"";position:absolute;left:6px;top:15px;width:14px;height:8px;border-left:3px solid var(--sky);border-bottom:3px solid var(--sky);transform:rotate(-45deg)}
.dr{display:grid;grid-template-columns:240px 1fr;gap:34px;align-items:start}
.dr .ph-box{aspect-ratio:4/5;border-radius:var(--r);background:linear-gradient(160deg,var(--ice2),#fff);border:1px solid var(--line);display:grid;place-items:center;color:var(--sky);font-size:13px;text-align:center;padding:12px}
table.hist{width:100%;border-collapse:collapse;font-size:14.5px}
table.hist th{width:110px;text-align:left;color:var(--sky-d);padding:8px 0;vertical-align:top}
table.hist td{padding:8px 0;border-bottom:1px solid var(--line)}
.tx{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px}
.tx .card{padding:22px}
.tx h3{font-size:17px;margin-bottom:6px}
.tx p{font-size:14px;color:var(--muted)}
.tag-s{display:inline-block;font-size:11px;background:var(--ice2);color:var(--navy);padding:1px 10px;border-radius:999px;margin-bottom:8px}
.callout{background:var(--ice);border:1px solid var(--line);border-radius:var(--r);padding:22px 26px;margin:22px 0}
.cta-band{background:linear-gradient(135deg,#3ba9dc,#1f86bd);color:#fff;padding:54px 0;text-align:center}
.cta-band h2{font-family:var(--fh);font-size:clamp(22px,3vw,30px);margin-bottom:8px}
.cta-band p{opacity:.92;margin-bottom:22px}
.cta-band .btn-tel{border-color:#fff;background:transparent;color:#fff}
.cta-band .btn-tel:hover{background:rgba(255,255,255,.12)}

/* footer */
.ft{background:var(--navy);color:#cfe3ee;padding:56px 0 28px;font-size:14px}
.ft a{color:#cfe3ee}
.ft .g{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:34px}
.ft h4{font-family:var(--fh);color:#fff;margin-bottom:10px}
.ft li{padding:3px 0}
.ft .cp{margin-top:34px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);font-size:12px;opacity:.8;text-align:center}
.demo-note{background:#fff8e1;color:#7a5a00;text-align:center;font-size:12.5px;padding:6px 12px;border-bottom:1px solid #f0e2b0}

/* sp bar */
.spbar{display:none}

/* admin */
.adm{display:grid;grid-template-columns:220px 1fr;min-height:640px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#f1f1f1;box-shadow:var(--shadow)}
.adm aside{background:#23282d;color:#c3c4c7;padding:14px 0}
.adm aside b{display:block;padding:10px 18px;color:#fff;font-size:14px}
.adm aside a{display:block;padding:9px 18px;color:#c3c4c7;font-size:14px}
.adm aside a.on{background:#2271b1;color:#fff}
.adm main{padding:24px;background:#f6f7f7}
.adm h2{font-size:22px;font-weight:500;color:#1d2327;margin-bottom:10px;font-family:var(--fb)}
.adm .box{background:#fff;border:1px solid #dcdcde;padding:18px;margin-bottom:18px}
.adm label{display:block;font-size:13px;font-weight:600;margin:10px 0 4px;color:#1d2327}
.adm input[type=text],.adm textarea,.adm select{width:100%;padding:8px 10px;border:1px solid #8c8f94;border-radius:4px;font:inherit;font-size:14px}
.adm .pub{background:#2271b1;color:#fff;border:0;padding:8px 18px;border-radius:3px;cursor:pointer;font-size:14px;margin-top:12px}
.adm .modes{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 12px}
.adm .modes button{border:1px solid #2271b1;background:#fff;color:#2271b1;border-radius:3px;padding:6px 12px;cursor:pointer;font-size:13px}
.adm .modes button.on{background:#2271b1;color:#fff}
.adm table.cal td{cursor:pointer;background:#f6f7f7}
.toast{position:fixed;right:18px;bottom:90px;background:#1d2327;color:#fff;padding:10px 16px;border-radius:6px;font-size:14px;opacity:0;transform:translateY(8px);transition:.25s;pointer-events:none;z-index:99}
.toast.on{opacity:1;transform:none}

@media(max-width:960px){
  .gnav,.hd-cta .btn-tel{display:none}
  .burger{display:block}
  .logo,.hd-cta{position:relative;z-index:2}
  .gnav.on{display:flex;position:fixed;inset:0;z-index:1;background:#fff;flex-direction:column;align-items:stretch;padding:104px 20px 120px;overflow:auto;gap:0}
  .gnav.on>li>a{padding:14px 8px;border-bottom:1px solid var(--line);border-radius:0;font-size:16px}
  .gnav.on .sub{display:block;position:static;border:0;box-shadow:none;padding:0 0 6px 12px;background:transparent}
  .hero .grid,.info-grid,.svc,.nb,.acc,.two,.dr{grid-template-columns:1fr}
  .rs,.flow,.tx{grid-template-columns:1fr}
  .flow li:not(:last-child):after{display:none}
  .ft .g{grid-template-columns:1fr}
  .vis{max-width:340px}
  .adm{grid-template-columns:1fr}
  .adm aside{display:none}
  .dr .ph-box{max-width:220px}
}
@media(max-width:640px){
  body{padding-bottom:68px;font-size:15px}
  .sec{padding:58px 0}
  .hd .in{height:64px}
  .hd-cta .btn-web{display:none}
  .logo b{font-size:17px}
  .hero{padding:34px 0 46px}
  .hero .cta .btn{width:100%}
  .today{margin-top:20px}
  .spbar{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(255,255,255,.97);border-top:1px solid var(--line);padding:8px 10px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(23,65,92,.08)}
  .spbar .btn{padding:11px 6px;font-size:14px;border-radius:12px}
  .nl li a{flex-wrap:wrap;gap:4px 12px}
  .card{padding:20px}
  table.hours{font-size:12.5px}
  table.hours td:first-child{font-size:12px}
  .toast{bottom:84px}
}
