/* Local orthodonics LP additions; original public TOP styles remain intact. */
[hidden]{display:none!important}
body{min-width:0}
button{font:inherit;color:inherit;border:0;border-radius:0;margin:0;padding:0;background:transparent;cursor:pointer}
button:focus-visible,a:focus-visible{outline:3px solid #861b20;outline-offset:5px}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link{position:fixed;left:12px;top:-100px;z-index:2000;padding:12px 18px;background:#fff;color:#861b20}
.skip-link:focus{top:12px}
.new-hero .hero-desktop{position:relative}
.new-hero .hero-photo{display:block;width:100%;height:auto}
.new-hero .hero-copy{position:absolute;left:8.2%;top:26.8%;width:41.9%;height:auto}
.new-hero .hero-mobile{display:block;width:100%;height:auto}
section[id],h2[id],h3[id],h4[id]{scroll-margin-top:14rem}
#gHeader .logo a.clinic-brand{display:flex;align-items:center;gap:1.1rem;width:26rem;line-height:1.4;color:#861b20;white-space:nowrap}
.brand-emblem{display:block;flex:none;width:4.7rem;height:5.6rem;background:url(../img/common/logo.png) left center / auto 100% no-repeat}
.brand-name{font-size:1.75rem;font-weight:700;letter-spacing:.07em}
#gHeader .hBox .hBtnBox .hBtnList{gap:1.8rem;margin-right:2.8rem}
#gHeader .hBox .hBtnBox .hBtnList li{width:24rem}
#gHeader .hBox .hBtnBox .hBtnList .txt{white-space:nowrap;letter-spacing:.04em}
#gHeader .hBox .hBtnBox .tel{margin-right:2.8rem}
#gHeader .hBox .hBtnBox .tel a{font-size:2.8rem}
#gHeader .hBox .hBtnBox .tel .txt{white-space:nowrap}
#gHeader .hBox .hBtnBox .ins{margin-right:3rem}
.menuBox.is-open{display:block}
body.menu-open{overflow:hidden}
.menuBox .station-card{margin:0;padding:2.5rem 1.5rem}
.station-card{width:100%;min-width:0;min-height:16rem;padding:2rem;color:#861b20;border:1px solid #f0d2d8;border-radius:1.5rem;text-align:center;background:#fff7f8;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.8rem}
.station-label{font-size:2.6rem;font-weight:700}
.station-route{font-size:1.7rem;color:#f06385}
.station-place{font-size:1.3rem;line-height:1.6;overflow-wrap:anywhere}
.menuBox .menuInfo .imgBox{display:block}
.menuBox .menuInfo .imgBox .left{width:100%}
.menuBox .menuInfo .imgBox .left .pho{max-width:100%}
.menuBox .location-placeholder{min-height:18rem;aspect-ratio:auto}
.location-placeholder{min-height:25rem;aspect-ratio:1.85;gap:1.8rem}
.reason .location-placeholder{min-height:36.3rem;border-radius:3rem 0 0 3rem;background:linear-gradient(130deg,#fce7ed,#fff8f9)}
.reason .location-placeholder .station-label{font-size:5rem}
.reason .location-placeholder .station-route{font-size:2.8rem}
.reason .location-placeholder .station-place{font-size:1.7rem}
#main .faq dt{padding:0;display:block}
#main .faq dt button{display:block;width:100%;padding:2.2rem 8rem 2rem 2rem;text-align:left;line-height:inherit;letter-spacing:inherit}
#main .faq dd.is-open{display:block}
.preview-badge{position:fixed;right:1rem;bottom:1rem;z-index:700;padding:.4rem 1rem;border:1px solid #d8ccd0;border-radius:2rem;background:#fffdfc;color:#66565d;font:12px/1.5 sans-serif;box-shadow:0 1px 8px #0001}
#preview-link{position:fixed;inset:0;margin:auto;max-width:min(520px,calc(100vw - 40px));width:520px;border:1px solid #eed6dc;border-radius:18px;padding:28px;background:white;color:#3f3f3f;z-index:3000;box-shadow:0 20px 80px #0003}
#preview-link::backdrop{background:#34232a80}
#preview-link h2{font-size:20px;font-weight:700;margin-bottom:16px}
#preview-link p{font-size:14px;line-height:1.8;letter-spacing:normal;text-align:left;overflow-wrap:anywhere}
#preview-destination{margin-top:12px;color:#765462}
#preview-link button{margin-top:24px;background:#861b20;color:white;padding:10px 28px;border-radius:30px}
@media (min-width:897px) and (max-width:1439px){
  html{font-size:min(10px,calc(100vw / 128))}
  body{min-width:0}
  #gHeader .hBox .hBtnBox .hBtnList li{width:22rem}
  #gHeader .hBox .hBtnBox .hBtnList li a{padding:1rem 2.5rem 1rem 1.5rem;font-size:1.4rem}
  #gHeader .hBox .hBtnBox .hBtnList li a .icon{width:2.2rem;margin-right:.7rem}
  #gHeader .hBox .hBtnBox .tel a{font-size:2.5rem}
  #gHeader .hBox .hBtnBox .hBtnList{gap:1rem;margin-right:1.5rem}
  #gHeader .hBox .hBtnBox .ins{margin-right:2rem}
}
@media (max-width:896px){
  section[id],h2[id],h3[id],h4[id]{scroll-margin-top:8rem}
  #gHeader .hBox{height:16vw;min-height:52px;padding:2.4vw 4vw;background:#ffffffed}
  #gHeader .logo a.clinic-brand{width:auto;gap:1rem}
  #gHeader .hBox .brand-emblem{width:9.0667vw;height:10.6667vw}
  #gHeader .hBox .brand-name{font-size:3.6vw;line-height:1.5;letter-spacing:.05em}
  .menu{margin-bottom:0;width:11.7333vw;height:5.3333vw}
  .menu span{height:.8vw}
  .menu span:nth-child(2){top:2.6667vw}
  .new-hero{padding:0}
  #main .faq dt button{padding:1.4rem 4.5rem 1.4rem 1rem;min-height:7rem}
  .menuBox .station-card{margin:0 0 1.5rem}
  .reason .location-placeholder{min-height:24rem;border-radius:2rem;aspect-ratio:1.6}
  .reason .location-placeholder .station-label{font-size:3rem}
  .reason .location-placeholder .station-route{font-size:2rem}
  .reason .location-placeholder .station-place{font-size:1.3rem}
  .preview-badge{bottom:7.5rem}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
