/* 触って分かる仕掛け（2026-10-10）。fun.js とセット。色・形は今のサイトのまま（紺・生成り・細い線・角丸小さめ） */
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ---------- ① 仕切りで比べる ---------- */
.ba.is-cmp{display:block !important;}
.ba.is-cmp>figure,.ba.is-cmp>.arw{display:none !important;}
.cmp{margin:0;}
.cmp__hint{display:flex;align-items:center;gap:8px;margin:0 0 10px !important;font-size:14.5px !important;font-weight:500;color:var(--navy,#1f3550);letter-spacing:.04em;line-height:1.6;}
.cmp__hint svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.cmp__stage{--x:calc(100% * var(--v));position:relative;width:100%;max-width:460px;overflow:hidden;border-radius:8px;background:#eceae6;cursor:ew-resize;touch-action:pan-y;user-select:none;-webkit-user-select:none;box-shadow:0 0 0 1px var(--line,#e3ddd3);}
.cmp__stage img,#case .case-head .ba.is-cmp .cmp__stage img{position:absolute;inset:0;width:100% !important;height:100% !important;max-width:none !important;object-fit:cover;object-position:var(--pos,center);margin:0 !important;border-radius:0 !important;pointer-events:none;-webkit-user-drag:none;}
.cmp__b{clip-path:inset(0 0 0 var(--x));}
.cmp__bar{position:absolute;top:0;bottom:0;left:var(--x);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px rgba(31,53,80,.18);pointer-events:none;}
.cmp__knob{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:#fff;color:var(--navy,#1f3550);box-shadow:0 0 0 2px var(--navy,#1f3550),0 8px 18px -8px rgba(15,30,50,.55);}
.cmp__knob svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.cmp__lab{position:absolute;top:10px;padding:1px 10px;border-radius:3px;background:rgba(255,255,255,.94);font-size:14.5px;font-weight:700;letter-spacing:.06em;line-height:1.7;color:var(--navy,#1f3550);pointer-events:none;}
.cmp__lab--l{left:10px;}
.cmp__lab--r{right:10px;}
.cmp__range{position:absolute;left:0;bottom:0;width:100%;height:1px;margin:0;opacity:0;pointer-events:none;}
.cmp__stage:has(.cmp__range:focus-visible){outline:3px solid var(--navy,#1f3550);outline-offset:3px;}
/* 動かせることを1回だけ見せる（0.9秒） */
@property --v{syntax:'<number>';inherits:true;initial-value:.5;}
.cmp__stage.is-hint{animation:cmpV .9s ease-in-out 1;}
@keyframes cmpV{0%{--v:.5}35%{--v:.42}70%{--v:.58}100%{--v:.5}}
@media(max-width:760px){
  .cmp__knob{width:42px;height:42px;margin:-21px 0 0 -21px;}
}
/* 症例ページ・症例集：写真2枚の欄に置く */
.case-imgs.is-cmp{display:block !important;}
.case-imgs.is-cmp>figure{display:none !important;}
.casebox .ba.is-cmp .cmp,.case .case-imgs.is-cmp .cmp{max-width:520px;margin:0 auto;}
.casebox .ba.is-cmp .cmp__stage,.case .case-imgs.is-cmp .cmp__stage{max-width:none;}

/* ---------- ② 今日の診療 ---------- */
.n-today{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;margin:16px 0 0;font-size:15px;line-height:1.7;color:var(--navy,#1f3550);}
.n-today[hidden]{display:none;}
.n-today__dot{width:9px;height:9px;border-radius:50%;background:#9aa3ad;flex:none;}
.n-today.is-open .n-today__dot{background:#0b7f73;box-shadow:0 0 0 4px rgba(15,157,143,.16);}
.n-today__date{font-weight:700;letter-spacing:.04em;}
.n-today__msg{font-weight:500;}
.n-today.is-open .n-today__msg{font-weight:700;}
.n-today__next{flex-basis:100%;padding-left:19px;font-size:14.5px;color:var(--muted,#5d6874);}
.n-today--panel{margin:0;padding:14px 36px 0;}
@media(max-width:760px){.n-today--panel{padding:12px 18px 0;}}
/* 表：今日の列 */
#access table.hours thead th.is-today{position:relative;color:var(--navy,#1f3550);font-weight:700;}
.today-lbl{display:block;font-size:12.5px;font-weight:700;letter-spacing:.08em;line-height:1.4;color:#fff;background:var(--navy,#1f3550);border-radius:3px;margin:0 auto 4px;width:max-content;padding:0 7px;}
#access table.hours th.is-today,#access table.hours td.is-today{background:rgba(31,53,80,.055);box-shadow:inset 1px 0 0 rgba(31,53,80,.22),inset -1px 0 0 rgba(31,53,80,.22);}
#access table.hours td.is-now .h-on{box-shadow:0 0 0 4px rgba(15,157,143,.22);}
#access table.hours.is-lit th.is-today,#access table.hours.is-lit td.is-today{animation:todayIn .8s ease-out 1;}
@keyframes todayIn{from{background:rgba(31,53,80,0);}to{background:rgba(31,53,80,.055);}}
@media(max-width:760px){
  .n-today{font-size:15px;}
  .today-lbl{font-size:14.5px;padding:0 4px;letter-spacing:0;line-height:1.5;}
}

/* ---------- ③ お悩みから選ぶ ---------- */
.n-pick{margin:34px 0 0;padding:26px 0 0;border-top:1px solid var(--line,#e3ddd3);}
.n-pick__lbl{margin:0 0 14px !important;font-family:"Noto Serif JP",serif;font-size:18px !important;font-weight:500;letter-spacing:.08em;color:var(--navy,#1f3550);}
.n-pick__chips{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;}
.n-pick__chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid rgba(31,53,80,.35);border-radius:4px;background:#fff;color:var(--navy,#1f3550);font:inherit;font-size:15.5px;font-weight:500;letter-spacing:.04em;line-height:1.4;cursor:pointer;text-align:left;transition:background .2s,color .2s,border-color .2s;}
.n-pick__chip::after{content:"";width:7px;height:7px;flex:none;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .25s;}
.n-pick__chip:hover{border-color:var(--navy,#1f3550);}
.n-pick__chip[aria-expanded="true"]{background:var(--navy,#1f3550);border-color:var(--navy,#1f3550);color:#fff;}
.n-pick__chip[aria-expanded="true"]::after{transform:translateY(2px) rotate(-135deg);}
.n-pick__chip:focus-visible{outline:3px solid var(--navy,#1f3550);outline-offset:2px;}
.n-pick__panel{margin:16px 0 0;padding:20px 24px;background:#fff;border-left:3px solid var(--navy,#1f3550);border-radius:0 6px 6px 0;max-width:820px;}
.n-pick__panel[hidden]{display:none;}
.n-pick:not(.is-ready) .n-pick__chips{display:none;}
.n-pick__panel:not([hidden]){animation:pickIn .6s ease-out 1;}
@keyframes pickIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.n-pick__ttl{margin:0 0 6px !important;font-family:"Noto Serif JP",serif;font-size:18px !important;font-weight:500;color:var(--navy,#1f3550);letter-spacing:.06em;}
.n-pick__panel p{margin:0 0 6px;font-size:16px;line-height:1.95;color:var(--ink,#28333f);}
.n-pick__go{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:10px;}
.n-pick__go a{display:inline-flex;align-items:center;min-height:44px;color:var(--navy,#1f3550);font-weight:500;font-size:15px;text-decoration:none;border-bottom:1px solid rgba(31,53,80,.3);}
.n-pick__go a:hover{border-bottom-color:var(--navy,#1f3550);}
@media(max-width:760px){
  .n-pick{margin-top:24px;padding-top:22px;}
  .n-pick__chips{gap:8px;}
  .n-pick__chip{font-size:15.5px;padding:0 11px;gap:6px;}
  .n-pick__panel{padding:16px 16px 14px;}
}

@media(prefers-reduced-motion:reduce){
  .n-pick__panel:not([hidden]),.cmp__stage.is-hint,#access table.hours.is-lit th.is-today,#access table.hours.is-lit td.is-today{animation:none !important;}
}
