:root{--blue:#54c1f1;--ink:#371a11;--pale:#f3fbfe}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:'Noto Sans JP',sans-serif;line-height:1.8}a{color:inherit;text-decoration:none}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.wrap{width:min(1060px,calc(100% - 40px));margin:auto}.header{height:95px;display:flex;align-items:center;padding-left:36px;position:relative;z-index:10;background:#fff}.header>a:first-child img{width:220px;display:block}.header nav{margin:auto;display:flex;gap:30px;font-size:14px;font-weight:500}.header nav a:hover{color:var(--blue)}.phone{height:95px;width:218px;background:var(--blue);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.35}.phone b{font-size:22px}.phone span{font-size:12px;text-align:center}.menu{display:none}.hero{width:100%;position:relative;aspect-ratio:1440/594;min-height:420px;overflow:hidden;background:#f8fbfc}.hero-slides,.hero-slide{position:absolute;inset:0;width:100%;height:100%}.hero-slide{object-fit:cover;opacity:0;transform:scale(1.025);animation:hero-crossfade 24s ease-in-out infinite;will-change:opacity,transform}.hero-slide-1{animation-delay:0s}.hero-slide-2{animation-delay:6s}.hero-slide-3{animation-delay:12s}.hero-slide-4{animation-delay:18s}@keyframes hero-crossfade{0%{opacity:0;transform:scale(1.025)}4%{opacity:1}21%{opacity:1}25%{opacity:0;transform:scale(1)}100%{opacity:0;transform:scale(1)}}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:75px 0 120px}.eyebrow{font-size:14px;font-weight:700;letter-spacing:.08em;color:var(--blue)}.news{list-style:none;padding:15px 0;margin:0}.news li{display:flex;gap:20px;border-bottom:1px solid #ddd;padding:15px 0;font-size:14px}.news time{font-family:'Noto Serif JP'}.schedule-wrap{width:100%;overflow-x:auto;margin:25px 0 12px}.schedule{width:100%;min-width:460px;border-collapse:collapse;text-align:center;font-size:13px;color:var(--ink)}.schedule th,.schedule td{height:52px;padding:7px 6px;border-bottom:1px solid #d7d7d7;font-weight:400;white-space:nowrap}.schedule th:first-child{width:100px;border-right:1px solid #d7d7d7}.schedule thead th{font-weight:700}.schedule td{color:var(--blue);font-size:17px}.schedule .saturday{color:var(--ink);font-size:15px}.schedule-notes{display:flex;gap:26px;align-items:center;font-size:13px}.schedule-notes strong{font-weight:500}.services{padding-bottom:130px;text-align:center}.services h2,.features h2,.access h2{font:500 24px 'Noto Serif JP';margin-bottom:55px}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.service-grid article{border:1px solid #dcecf2;border-radius:8px;padding:14px 8px 20px;position:relative}.service-grid article:before{content:'お口のお悩みに合わせた診療';position:absolute;background:var(--blue);color:#fff;border-radius:20px;font-size:9px;padding:3px 10px;top:-14px;left:50%;transform:translateX(-50%);white-space:nowrap}.service-grid span{display:block;color:var(--blue);font-size:46px;line-height:1.4}.service-grid h3{font-size:13px;color:var(--blue);margin:0}.features{background:linear-gradient(#fff,#f7fcfe,#fff);padding:30px 0 140px;text-align:center}.features em{color:var(--blue);font-style:normal}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;text-align:left}.cards article{background:#fff;padding:14px;box-shadow:0 6px 25px #bde9f322}.cards b{display:block;color:var(--blue);font:500 27px 'Noto Serif JP'}.cards img{width:100%;height:175px;object-fit:cover}.cards h3{text-align:center;color:var(--blue);font-size:15px}.cards p{font-size:12px}.concept{min-height:610px;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at 10% 60%,#dff6e5,transparent 25%),radial-gradient(circle at 90% 50%,#eaf8e7,transparent 24%)}.concept h2{font:500 27px/1.7 'Noto Serif JP'}.concept>div>p:last-child{font:500 13px/2.3 'Noto Serif JP'}.access{padding:110px 0 90px;text-align:center}.access-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px;text-align:left}.access-grid>img{width:100%;height:270px;object-fit:cover}.contact>a{display:inline-block;color:var(--blue);font-size:24px;font-weight:700;border-top:2px solid var(--blue);padding-top:14px}.mini-schedule{background:var(--pale);padding:16px;font-size:13px}.access-grid h3{font-size:15px;color:var(--blue);margin-bottom:0}.access-grid p{font-size:14px}footer{background:var(--blue);color:#fff;padding:48px 0 20px}.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.footer-grid img{width:220px;filter:brightness(0) invert(1)}.footer-grid a{display:block;margin:8px 0}footer>small{display:block;text-align:center;margin-top:35px}@media(prefers-reduced-motion:reduce){.hero-slide{animation:none;transform:none}.hero-slide-1{opacity:1}}@media(max-width:900px){.header{height:74px;padding:0 18px;justify-content:space-between}.header>a:first-child img{width:175px}.phone{height:74px;width:auto;padding:0 16px}.phone span{display:none}.phone b{font-size:15px}.menu{display:block;border:0;background:#fff;font-size:26px}.header nav{display:none;position:absolute;top:74px;left:0;right:0;background:white;padding:22px;flex-direction:column;gap:15px;box-shadow:0 10px 20px #0002}.header nav.open{display:flex}.hero{height:auto;min-height:360px;aspect-ratio:1440/594}.hero-slide{object-position:center}.split{grid-template-columns:1fr;padding:60px 0 90px}.service-grid{grid-template-columns:repeat(2,1fr)}.cards{grid-template-columns:1fr}.cards img{height:230px}.access-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr;gap:25px}}@media(max-width:520px){.phone{position:fixed;bottom:0;right:0;left:0;top:auto;width:100%;height:58px;z-index:20}.hero{min-height:330px}.hero-slide{object-position:center}.schedule{min-width:430px;font-size:11px}.schedule th,.schedule td{height:46px;padding:5px 4px}.schedule-notes{align-items:flex-start;flex-direction:column;gap:2px}.news li{display:block}.service-grid{gap:14px}.concept{padding:60px 20px}.concept>div>p:last-child br{display:none}.access-grid>img{height:220px}body{padding-bottom:58px}}
.hero-slides { overflow:hidden; }
.hero-exterior-slide > img { display:block; width:100%; height:100%; object-fit:cover; }
.hero-exterior-text { position:absolute; top:20.5%; left:7.4%; color:#371a11; font-family:"Noto Serif JP","Hiragino Mincho Pro",serif; }
.hero-exterior-text h2 { margin:0; font-size:4vw; font-weight:700; line-height:1.32; letter-spacing:.02em; }
.hero-exterior-text h2 span { color:#54c1f1; }
.hero-exterior-text p { margin:2.7vw 0 0; font-size:1.2vw; font-weight:500; line-height:1.9; }

/* 診療時間表：支給画像に合わせたブラウンの文字・記号 */
.schedule,
.schedule th,
.schedule td,
.schedule .saturday,
.schedule-notes {
  color: #371a11;
  align-items: flex-start;
}


.schedule td {
  font-weight: 400;
}

/* INFORMATION / SCHEDULE 共通の罫線色 */
.news li,
.schedule th,
.schedule td,
.schedule th:first-child {
  border-color: #e2e3e5;
}

/* SCHEDULEの文字ウェイトをすべてRegularに統一 */
.schedule,
.schedule th,
.schedule td,
.schedule thead th,
.schedule-notes,
.schedule-notes strong {
  font-weight: 400;
}

/* 診療案内：テキストとイラストを分離 */
.service-cards {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 54px 20px;
  padding-top: 22px;
}

.service-cards article {
  grid-column: span 2;
  position: relative;
  min-width: 0;
  overflow: visible;
  border: 1px solid #d8d8d8;
  border-radius: 10px;
  background: #fff;
  padding: 40px 16px 22px;
  box-shadow: 0 2px 4px rgb(55 26 17 / 10%);
}

.service-cards article:nth-child(5) { grid-column: 2 / span 2; }

.service-cards article > p {
  position: absolute;
  top: -22px;
  left: 50%;
  width: calc(100% - 8px);
  transform: translateX(-50%);
  min-height: 38px;
  margin: 0;
  padding: 7px 5px;
  border-radius: 22px;
  background: #54c1f1;
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  white-space: nowrap;
}

.service-cards article > p::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -9px;
  transform: translateX(-50%);
  border: 10px solid transparent;
  border-top-color: #54c1f1;
  border-bottom: 0;
}

.service-icon {
  width: 180px;
  height: 135px;
  max-width: 100%;
  margin: 18px auto 2px;
  background-image: url("assets/services-guide.png");
  background-repeat: no-repeat;
  background-size: 1051px 548px;
}

.icon-general { background-position: -34px -62px; }
.icon-perio { background-position: -300px -62px; }
.icon-child { background-position: -575px -62px; }
.icon-preventive { background-position: -830px -62px; }
.icon-total { background-position: -175px -348px; }
.icon-prosthetic { background-position: -430px -356px; }
.icon-cosmetic { background-position: -720px -348px; }

.service-cards h3 {
  margin: 0;
  color: #54c1f1;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
}

@media (max-width: 900px) {
  .service-cards { grid-template-columns: repeat(2, 1fr); }
  .service-cards article,
  .service-cards article:nth-child(5) { grid-column: auto; }
}

@media (max-width: 560px) {
  .service-cards { grid-template-columns: 1fr; gap: 24px; }
  .service-cards article { width: min(280px, 100%); margin: 0 auto; }
}

/* 多治米歯科の3つの特徴 */
.features-en {
  margin: 0 0 10px;
  color: #54c1f1;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .05em;
}

.features h2 {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 6px;
  margin-bottom: 64px;
  color: #371a11;
  font-size: 25px;
  font-weight: 700;
}

.features h2 em {
  font-family: "Noto Serif JP", serif;
  font-size: 56px;
  font-weight: 700;
  line-height: .8;
}

.features .cards {
  gap: 24px;
  align-items: stretch;
}

.features .cards article {
  position: relative;
  min-height: 455px;
  overflow: hidden;
  border: 1px solid #54c1f1;
  border-radius: 10px;
  padding: 30px 28px 34px;
  box-shadow: none;
}

.features .cards article > b {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 64px;
  height: 52px;
  padding-top: 0;
  border-radius: 0 0 14px 0;
  background: #fff;
  color: #54c1f1;
  font-family: "Noto Serif JP", serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1;
}

.features .cards img {
  display: block;
  width: 100%;
  height: 218px;
  border-radius: 9px;
  object-fit: cover;
}

.features .cards h3 {
  margin: 40px 0 18px;
  color: #5484df;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.55;
  word-break: auto-phrase;
  text-wrap: pretty;
}

.features .cards p {
  margin: 0;
  color: #371a11;
  font-size: 13px;
  line-height: 2;
  text-align: center;
  word-break: auto-phrase;
}

.features .cards p .text-phrase {
  display: inline-block;
}

@media (max-width: 900px) {
  .features .cards article { min-height: 0; }
}

@media (max-width: 560px) {
  .features h2 { margin-bottom: 45px; font-size: 20px; }
  .features h2 em { font-size: 48px; }
  .features .cards article { padding: 24px 22px 30px; }
  .features .cards img { height: 200px; }
}

/* 診療案内セクション見出し */
.services-kicker {
  margin: 0 0 5px;
  color: #54c1f1;
  font-family: "Hiragino Maru Gothic Pro", "ヒラギノ丸ゴ Pro", "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
}

.services h2 {
  margin: 0 0 82px;
  color: #371a11;
  font-family: "Hiragino Mincho Pro", "ヒラギノ明朝 Pro", "Yu Mincho", serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
}

/* Figma書き出しの高解像度・個別診療アイコン */
.service-icon {
  height: 135px;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.icon-general { background-image: url("assets/icon-general.png"); }
.icon-perio { background-image: url("assets/icon-perio.png"); }
.icon-child { background-image: url("assets/icon-child.png"); }
.icon-preventive { background-image: url("assets/icon-preventive.png"); }
.icon-total { background-image: url("assets/icon-total.png"); }
.icon-prosthetic { background-image: url("assets/icon-prosthetic.png"); }
.icon-cosmetic { background-image: url("assets/icon-cosmetic.png"); }

/* 参考画像に合わせたアイコンごとの見た目上の大きさ */
.icon-general { background-size: 140px auto; }
.icon-perio { background-size: 140px auto; }
.icon-child { background-size: 126px auto; }
.icon-preventive { background-size: 180px auto; }
.icon-total { background-size: auto 195px; }
.icon-prosthetic { background-size: 150px auto; }
.icon-cosmetic { background-size: auto 120px; }

.service-cards h3 {
  color: #54c1f1;
}

/* 3つの特徴：支給画像に合わせた最終レイアウト */
.features .wrap {
  width: min(1256px, calc(100% - 80px));
}

.features .cards {
  gap: 30px;
}

.features .cards article {
  min-height: 532px;
  overflow: hidden;
  border: 0;
  border-radius: 10px;
  padding: 28px 26px 34px;
  box-shadow: 0 0 4px rgb(84 193 241 / 25%);
}

.features .cards img {
  width: 100%;
  height: auto;
  aspect-ratio: 1.62 / 1;
  border-radius: 9px;
  object-fit: cover;
}

.features .cards article:first-child img {
  object-fit: contain;
}

.features .cards article > b {
  top: 28px;
  left: 26px;
  display: grid;
  width: 64px;
  height: 52px;
  padding: 0;
  place-items: center;
  border-radius: 0 0 11px 0;
  font-size: 32px;
}

.features .cards h3 {
  margin: 39px 0 18px;
  font-size: 19px;
}

@media (max-width: 900px) {
  .features .wrap { width: min(680px, calc(100% - 40px)); }
  .features .cards article { min-height: 0; }
}

@media (max-width: 560px) {
  .features .cards article { padding: 22px 20px 30px; }
  .features .cards article > b { top: 22px; left: 20px; width: 60px !important; height: 52px !important; font-size: 28px !important; }
  .features .cards img { height: auto; }
}

/* 支給された完成カード画像 */
.feature-card-images {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
  align-items: start;
}

.feature-card-images img {
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 900px) {
  .feature-card-images { grid-template-columns: 1fr; gap: 24px; }
  .feature-card-images img { width: min(408px, 100%); margin: 0 auto; }
}

/* 特徴カード内の文字はHTMLテキストとして表示 */
.features .cards article > b,
.features .cards h3,
.features .cards p {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* 説明文の下60pxでカードを終える */
.features .cards {
  align-items: stretch;
}

.features .cards article {
  min-height: 0;
  height: 100%;
  padding-bottom: 60px;
}

/* 3つの特徴からコンセプトへ連続する背景 */
.story-background {
  background-image:
    linear-gradient(to bottom, #fff 0%, #fff 25%, rgb(255 255 255 / 78%) 36%, rgb(255 255 255 / 28%) 46%, transparent 55%),
    url("assets/concept-bg.png");
  background-position: center, center bottom;
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% auto;
}

.story-background .features,
.story-background .concept {
  background: transparent;
}

@media (max-width: 700px) {
  .story-background {
    background-position: center, 34% bottom;
    background-size: 100% 100%, auto 78%;
  }
}

/* コンセプト本文 */
.concept {
  min-height: 760px;
  padding: 90px 20px;
}

.concept h2 {
  margin: 0;
  line-height: 1.5;
}

.concept .eyebrow {
  margin: 0 0 5px;
}

/* 3つの特徴とコンセプトの間隔を150pxに固定 */
.story-background .features {
  padding-bottom: 0;
}

.story-background .concept {
  place-items: start center;
  padding: 150px 20px 90px;
}

/* 医院のご案内 */
.access > .eyebrow {
  margin: 0 0 5px;
}

.access > h2 {
  margin: 0 0 55px;
}

.access-summary {
  display: grid;
  grid-template-columns: .96fr 1.04fr;
  gap: 56px;
  align-items: start;
  margin-bottom: 48px;
}

.access-call {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 150px;
  border-top: 2px solid #54c1f1;
  border-bottom: 2px solid #54c1f1;
  text-align: left;
}

.reservation {
  display: grid;
  flex: 0 0 100px;
  width: 100px;
  height: 100px;
  align-content: center;
  place-items: center;
  border-radius: 50%;
  background: #54c1f1;
  color: #fff;
  font-family: "Hiragino Mincho Pro", "ヒラギノ明朝 Pro", serif;
  font-size: 17px;
  line-height: 1.25;
}

.access-call .reservation small {
  font-size: 11px;
  line-height: 1.2;
}

.access-call-info {
  text-align: center;
}

.access-call a {
  color: #54c1f1;
  font-size: clamp(22px, 2.45vw, 34px);
  font-weight: 700;
  letter-spacing: .03em;
  line-height: 1.2;
  white-space: nowrap;
}

.access-call p {
  margin: 10px 0 0;
  color: #54c1f1;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
}

.access-schedule-wrap {
  color: #371a11;
  text-align: left;
}

.access-schedule {
  width: 100%;
  border: 1px solid #371a11;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  font-size: 13px;
  text-align: center;
}

.access-schedule th,
.access-schedule td {
  height: 54px;
  padding: 7px 9px;
  border-bottom: 1px solid #e2e3e5;
  font-weight: 400;
  white-space: nowrap;
}

.access-schedule th:first-child {
  border-right: 1px solid #e2e3e5;
}

.access-schedule tbody tr:last-child th,
.access-schedule tbody tr:last-child td {
  border-bottom: 0;
}

.access-schedule-wrap > p {
  display: flex;
  gap: 28px;
  margin: 7px 4px 0;
  font-size: 13px;
}

.access-schedule-wrap > p strong,
.access-schedule-wrap > p span {
  font-weight: 500;
}

.access-grid {
  align-items: start;
}

.access-grid > img,
.access-photo-info > img {
  display: block;
  width: 100%;
  height: 270px;
  object-fit: cover;
}

.access-photo-info > img {
  object-fit: contain;
}

.access-photo-info > div {
  padding-top: 14px;
}

@media (max-width: 900px) {
  .access-summary { grid-template-columns: 1fr; gap: 28px; }
  .access-call { justify-content: center; }
  .access-schedule-wrap { overflow-x: auto; }
  .access-schedule { min-width: 510px; }
}

@media (max-width: 560px) {
  .access-call { gap: 8px; min-height: 126px; }
  .reservation { flex-basis: 82px; width: 82px; height: 82px; font-size: 15px; }
  .access-call .reservation small { font-size: 9px; }
  .access-call a { font-size: 20px; }
  .access-call p { font-size: 10px; white-space: normal; }
}

/* 医院案内：指定寸法・書体・シャドウ */
@media (min-width: 901px) {
  .reservation {
    flex-basis: 100px;
    width: 100px;
    height: 100px;
  }
}

.reservation {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
}

.access-call a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 30px;
}

.phone-receiver {
  display: inline-block;
  font-family: "Apple Symbols", "Noto Sans Symbols 2", sans-serif;
  font-size: 30px;
  font-style: normal;
  line-height: 1;
}

.access-call p {
  font-size: 14px;
  font-weight: 400;
}

.access-schedule {
  border: 0;
  box-shadow: 0 0 4px rgb(0 0 0 / 25%);
}

.access-schedule-wrap > p strong,
.access-schedule-wrap > p span {
  font-weight: 400;
}

.map-embed {
  display: block;
  width: 100%;
  height: 340px;
  border: 0;
  border-radius: 8px;
}

.map-panel {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.google-map-button {
  display: flex;
  width: 100%;
  height: 66px;
  align-items: center;
  justify-content: center;
  gap: 20px;
  border: 1px solid #54c1f1;
  border-radius: 9px;
  background: #fff;
  color: #54c1f1;
  font-size: 20px;
  font-weight: 700;
  transition: background-color .2s ease, color .2s ease;
}

.google-map-button:hover {
  background: #54c1f1;
  color: #fff;
}

.map-pin {
  position: relative;
  width: 16px;
  height: 16px;
  transform: rotate(-45deg);
  border: 2px solid currentColor;
  border-radius: 50% 50% 50% 0;
}

.map-pin::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4px;
  height: 4px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: currentColor;
}

.access-photo-info > img {
  height: auto;
  aspect-ratio: 540 / 332;
  border-radius: 9px;
  object-position: left center;
}

.access-photo-info > div.transport-list {
  display: flex;
  flex-direction: column;
  gap: 13px;
  padding-top: 16px;
}

.transport-row {
  display: grid;
  grid-template-columns: 145px 12px 1fr;
  gap: 8px;
  align-items: start;
  color: #371a11;
  font-size: 13px;
  line-height: 1.55;
  text-align: left;
}

.transport-label {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}

.transport-icon {
  display: block;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  object-fit: contain;
}

/* フッター */
.site-footer {
  min-height: 330px;
  padding: 43px 0 18px;
  background: #54c1f1;
  color: #fff;
}

.footer-inner {
  display: grid;
  grid-template-columns: 340px 235px 1fr;
  gap: 80px;
  width: min(1062px, calc(100% - 40px));
  margin: 0 auto;
  text-align: left;
}

.footer-logo {
  display: block;
  width: 216px;
}

.footer-logo img {
  display: block;
  width: 100%;
  height: auto;
  filter: brightness(0) invert(1);
}

.footer-address {
  margin: 24px 0 7px;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.85;
}

.footer-phone {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  font-size: 25px;
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.25;
  white-space: nowrap;
}

.footer-phone span {
  font-family: "Apple Symbols", "Noto Sans Symbols 2", sans-serif;
  font-size: 22px;
}

.phone-handset {
  display: inline-block;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  background: currentColor;
  -webkit-mask: url("assets/icon-phone-handset.svg") center / contain no-repeat;
  mask: url("assets/icon-phone-handset.svg") center / contain no-repeat;
}

.footer-closed {
  margin: 0;
  font-size: 14px;
  font-weight: 400;
}

.footer-treatments,
.footer-main-nav {
  padding-top: 13px;
}

.site-footer nav a {
  color: #fff;
}

.footer-link {
  position: relative;
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: .04em;
}

.footer-link::before {
  content: "";
  display: block;
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #fff;
}

.footer-link::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 5px;
  width: 4px;
  height: 4px;
  transform: translateY(-50%) rotate(45deg);
  border-top: 1.5px solid #54c1f1;
  border-right: 1.5px solid #54c1f1;
}

.footer-treatment-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 22px;
  margin: 11px 0 0 24px;
}

.footer-treatment-grid a {
  position: relative;
  padding-left: 11px;
  font-size: 13px;
  white-space: nowrap;
}

.footer-treatment-grid a::before {
  content: "›";
  position: absolute;
  left: 0;
}

.footer-main-nav {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.footer-copyright {
  display: block;
  margin-top: 49px;
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: .14em;
  text-align: center;
}

@media (max-width: 1000px) {
  .footer-inner { grid-template-columns: minmax(218px,1fr) minmax(211px,1fr); gap: 35px 31px; }
  .footer-main-nav { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
  .site-footer { padding: 42px 0 24px; }
  .footer-inner { grid-template-columns: 1fr; gap: 34px; }
  .footer-main-nav { grid-column: auto; grid-template-columns: 1fr; }
  .footer-treatment-grid { margin-left: 22px; }
  .footer-copyright { margin-top: 38px; padding: 0 20px; font-size: 13px; }
}

/* 追従ヘッダー */
.header {
  position: sticky;
  top: 0;
  z-index: 100;
  transition: height .3s ease, box-shadow .3s ease;
}

.header .phone,
.header .phone b,
.header .phone span {
  transition: background-color .3s ease, color .3s ease;
}

.header.is-scrolled {
  box-shadow: 0 4px 18px rgb(55 26 17 / 10%);
}

.header.is-scrolled .phone {
  background: transparent;
  color: #54c1f1;
}

/* スクロール時のフェードアップ */
.scroll-reveal {
  opacity: 0;
  transform: translate3d(0, 42px, 0);
  transition:
    opacity .8s cubic-bezier(.22, 1, .36, 1) var(--reveal-delay, 0ms),
    transform .8s cubic-bezier(.22, 1, .36, 1) var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}

.scroll-reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@media (max-width: 520px) {
  .header.is-scrolled .phone {
    background: transparent;
    color: #54c1f1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .header,
  .header .phone,
  .scroll-reveal {
    transition: none;
  }

  .scroll-reveal {
    opacity: 1;
    transform: none;
  }
}

.transport-dots {
  line-height: 1;
}

.transport-row p {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
}

@media (max-width: 560px) {
  .transport-row {
    grid-template-columns: 145px 10px 1fr;
    gap: 5px;
    font-size: 13px;
  }
  .transport-dots { padding-top: 4px; }
  .transport-row p {
    padding-top: 2px;
    font-size: 13px;
  }
}

@media (max-width: 560px) {
  .access-call a,
  .phone-receiver { font-size: 20px; }
  .access-call p { font-size: 10px; }
}

.concept-copy {
  margin-top: 34px;
  font-family: "Noto Serif JP", serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 2.15;
}

.concept-copy p {
  margin: 0 0 18px;
}

.concept-copy p:last-child {
  margin-bottom: 0;
}

@media (max-width: 560px) {
  .concept { min-height: 0; padding: 75px 20px; }
  .concept-copy { font-size: 12px; line-height: 2; }
  .concept-copy br { display: none; }
}

/* SP：参考サイトの情報優先順に合わせた1カラム構成 */
.hero-mobile-slides,
.hero-sp-text,
.sp-bottom-nav {
  display: none;
}

@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  body { padding-bottom: 62px; }
  .wrap { width: min(100% - 30px, 560px); }

  .header {
    height: 60px;
    padding: 0 14px;
    border-bottom: 1px solid #edf2f4;
  }
  .header > a:first-child img { width: 170px; }
  .header > .phone {
    position: static;
    width: 54px;
    height: 60px;
    margin-left: auto;
    padding: 0;
    background: #fff;
    color: #54c1f1;
  }
  .header > .phone b {
    width: 34px;
    overflow: hidden;
    color: transparent;
    font-size: 0;
  }
  .header > .phone b::before {
    content: "";
    display: block;
    width: 27px;
    height: 27px;
    margin: 0 auto;
    background: currentColor;
    -webkit-mask: url("assets/icon-phone-handset.svg") center / contain no-repeat;
    mask: url("assets/icon-phone-handset.svg") center / contain no-repeat;
  }
  .header > .phone b::after {
    content: none;
  }
  .header .menu {
    width: 46px;
    padding: 0;
    color: #54c1f1;
    font-size: 27px;
  }
  .header nav {
    top: 60px;
    z-index: 110;
    max-height: calc(100vh - 122px);
    overflow-y: auto;
    padding: 18px 24px 26px;
    gap: 0;
    border-top: 1px solid #e2e3e5;
  }
  .header nav a { padding: 13px 4px; border-bottom: 1px solid #e2e3e5; }

  .hero {
    width: 100%;
    min-height: 0;
    margin: 0 auto;
    aspect-ratio: 375 / 500;
    border-radius: 0;
    background: #fff;
  }
  .hero-slides { display: none; }
  .hero-mobile-slides {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
  }
  .hero-mobile-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity: 0;
    transform: none;
    animation: hero-mobile-crossfade 24s ease-in-out infinite;
    will-change: opacity;
  }
  img.hero-mobile-slide { object-fit: cover; }
  .hero-mobile-slide-1 { animation-delay: 0s; }
  .hero-mobile-slide-2 { animation-delay: 6s; }
  .hero-mobile-slide-3 { animation-delay: 12s; }
  .hero-mobile-slide-4 { animation-delay: 18s; }
  @keyframes hero-mobile-crossfade {
    0% { opacity: 0; }
    4% { opacity: 1; }
    21% { opacity: 1; }
    25% { opacity: 0; }
    100% { opacity: 0; }
  }
  img.hero-mobile-slide {
    object-fit: cover;
    object-position: center;
  }
  img.hero-mobile-exterior { object-position: center; }
  .hero-sp-text {
    position: absolute;
    z-index: 3;
    top: 70px;
    right: 0;
    left: 0;
    display: block;
    color: #371a11;
    text-align: center;
    text-shadow: 0 0 1px rgb(255 255 255 / 35%);
  }
  .hero-sp-text h2 {
    margin: 0;
    font-family: "Noto Serif JP", "Hiragino Mincho Pro", serif;
    font-size: clamp(27px, 7.5vw, 31px);
    font-weight: 700;
    line-height: 1.48;
    letter-spacing: .02em;
  }
  .hero-sp-text h2 span { color: #54c1f1; }
  .hero-sp-text p {
    margin: 18px 0 0;
    font-family: "Noto Serif JP", "Hiragino Mincho Pro", serif;
    font-size: clamp(11px, 3vw, 13px);
    font-weight: 500;
    line-height: 1.85;
  }

  @media (max-width: 767px) {
    .hero-sp-text {
      right: clamp(18px, 5vw, 22px);
      left: clamp(26px, 7vw, 30px);
      text-align: left;
    }
  }

  .split {
    display: flex;
    flex-direction: column;
    gap: 45px;
    padding: 45px 0 76px;
  }
  .split > div:nth-child(2) { order: -1; }
  .split .eyebrow { margin: 0 0 10px; text-align: center; }
  .schedule-wrap {
    margin: 0 0 10px;
    overflow-x: auto;
    border-radius: 8px;
    box-shadow: 0 0 4px rgb(0 0 0 / 18%);
  }
  .schedule { min-width: 0; table-layout: fixed; font-size: 13px; }
  .schedule th:first-child { width: 82px; }
  .schedule th,.schedule td { height: 44px; padding: 4px 2px; }
  .schedule td { font-size: 14px; }
  .schedule-notes { flex-direction: row; flex-wrap: wrap; gap: 3px 15px; font-size: 13px; }
  .news { padding: 0; }
  .news li { padding: 13px 0; font-size: 13px; }
  .news time { display: block; margin-bottom: 3px; color: var(--ink); }

  .services { padding-bottom: 92px; }
  .services h2 { margin-bottom: 58px; font-size: 26px; }
  .service-cards { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 42px 14px; }
  .service-cards article { width: 100%; padding: 27px 8px 15px; }
  .service-cards article > p { top: -17px; min-height: 34px; padding: 5px 3px; font-size: 10px; line-height: 24px; }
  .service-icon { height: 92px; margin-top: 10px; }
  .icon-general,.icon-perio { background-size: 98px auto; }
  .icon-child { background-size: 88px auto; }
  .icon-preventive { background-size: 120px auto; }
  .icon-total { background-size: auto 126px; }
  .icon-prosthetic { background-size: 105px auto; }
  .icon-cosmetic { background-size: auto 82px; }
  .service-cards h3 { font-size: 14px; }

  .features { padding-top: 48px; }
  .features .wrap { width: min(100% - 30px, 560px); }
  .features h2 { margin-bottom: 44px; }
  .features .cards { gap: 22px; }
  .features .cards article { padding: 18px 18px 34px; }
  .features .cards article > b { top: 18px; left: 18px; }
  .features .cards h3 { margin: 28px 0 13px; font-size: 17px; }
  .features .cards p { font-size: 12px; line-height: 1.9; }

  .story-background { background-position: center, 25% bottom; background-size: 100% 100%, auto 63%; }
  .story-background .concept { padding: 105px 20px 80px; }
  .concept h2 { font-size: 23px; }
  .concept-copy { margin-top: 28px; }

  .access { padding: 78px 0 72px; }
  .access > h2 { margin-bottom: 38px; font-size: 25px; }
  .access-summary { grid-template-columns: 1fr; gap: 28px; margin-bottom: 34px; }
  .access-call { min-height: 108px; justify-content: center; }
  .reservation { flex-basis: 74px; width: 74px; height: 74px; font-size: 14px; }
  .access-call a { display: flex; align-items: center; gap: 5px; font-size: 23px; }
  .access-call a .phone-handset {
    flex-basis: 24px;
    width: 24px;
    height: 24px;
  }
  .access-call p { margin-top: 5px; font-size: 13px; }
  .access-schedule-wrap { overflow: visible; padding: 0; }
  .access-schedule {
    min-width: 0;
    table-layout: fixed;
    border: 0;
    border-collapse: collapse;
    border-radius: 8px;
    font-size: 13px;
    box-shadow: 0 0 4px rgb(0 0 0 / 18%);
  }
  .access-schedule th:first-child { width: 82px; }
  .access-schedule th,
  .access-schedule td { height: 44px; padding: 4px 2px; }
  .access-schedule td { font-size: 14px; }
  .access-schedule-wrap > p { min-width: 0; flex-wrap: wrap; font-size: 13px; }
  .access-grid { gap: 28px; }
  .map-embed,.access-photo-info > img { height: 230px; border-radius: 8px; }
  .google-map-button { height: 54px; font-size: 17px; }

  .site-footer { padding: 46px 0 28px; }
  .footer-inner { width: min(100% - 40px, 500px); }
  .footer-logo { width: 205px; }

  .sp-bottom-nav {
    position: fixed;
    z-index: 150;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    height: 62px;
    padding-bottom: env(safe-area-inset-bottom);
    background: #54c1f1;
    box-shadow: 0 -2px 10px rgb(0 0 0 / 12%);
    color: #fff;
  }
  .sp-bottom-nav a,.sp-bottom-nav button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    border: 0;
    border-right: 1px solid rgb(255 255 255 / 35%);
    background: transparent;
    color: #fff;
    font: 500 10px "Noto Sans JP",sans-serif;
  }
  .sp-bottom-nav span { font-size: 21px; line-height: 1; }
  .sp-bottom-nav .sp-bottom-label {
    font-size:10px;
    line-height:1.2;
  }
  .sp-bottom-nav .phone-handset { margin-bottom:8px; }
  .sp-bottom-nav .map-pin { margin-bottom:12px; }
  .sp-bottom-nav .sp-bottom-menu-icon { margin-bottom:8px; }
  .sp-bottom-nav > a:nth-child(2) .sp-bottom-icon,
  .sp-bottom-nav > a:nth-child(2) .sp-bottom-label {
    position:relative;
    top:8px;
  }
  .sp-bottom-nav .sp-menu-trigger .sp-bottom-icon,
  .sp-bottom-nav .sp-menu-trigger .sp-bottom-label {
    position:relative;
    top:7px;
  }
  .sp-bottom-nav .sp-bottom-priority {
    margin-bottom:1px;
    padding:1px 7px;
    border:1px solid #54c1f1;
    border-radius:999px;
    background:#fff;
    color:#54c1f1;
    font-size:8px;
    font-weight:500;
    line-height:1.1;
    white-space:nowrap;
  }
}

/* 診療案内：新しい並び・背景・下層ページリンク */
.services {
  padding-top: 86px;
  padding-bottom: 132px;
  background: #f7f8fd;
}

.service-cards article {
  min-height: 270px;
  transition:
    transform .3s ease,
    box-shadow .3s ease,
    border-color .3s ease,
    background-color .3s ease;
}

.service-card-link {
  display: block;
  height: 100%;
  outline: none;
}

.service-card-link > p {
  position: absolute;
  top: -22px;
  left: 50%;
  width: calc(100% - 8px);
  min-height: 38px;
  margin: 0;
  padding: 7px 5px;
  transform: translateX(-50%);
  border-radius: 22px;
  background: #54c1f1;
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  white-space: nowrap;
  transition: background-color .3s ease;
}

.service-card-link > p::after {
  content: "";
  position: absolute;
  bottom: -9px;
  left: 50%;
  transform: translateX(-50%);
  border: 10px solid transparent;
  border-top-color: #54c1f1;
  border-bottom: 0;
  transition: border-top-color .3s ease;
}

.service-card-link .service-icon {
  transition: transform .3s cubic-bezier(.22,1,.36,1);
}

.service-card-link h3 {
  margin: 0;
  color: #54c1f1;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  transition: color .3s ease, transform .3s ease;
}

@media (hover: hover) and (pointer: fine) {
  .service-cards article:hover {
    transform: translateY(-8px);
    border-color: rgb(84 193 241 / 55%);
    background: #fff;
    box-shadow: 0 12px 26px rgb(84 193 241 / 20%);
  }

  .service-cards article:hover .service-icon {
    transform: translateY(-5px) scale(1.06);
  }

  .service-cards article:hover h3 {
    transform: translateY(-2px);
    color: #36afe4;
  }
}

.service-cards article:focus-within {
  border-color: #54c1f1;
  box-shadow: 0 0 0 3px rgb(84 193 241 / 25%);
}

@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .services { padding-top: 76px; padding-bottom: 92px; }
  .service-cards article {
    min-height: 195px;
    padding-top: 34px;
    padding-bottom: 20px;
  }
  .service-card-link > p {
    top: -17px;
    min-height: 34px;
    padding: 5px 3px;
    font-size: 10px;
    line-height: 24px;
  }
  .service-card-link h3 { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .service-cards article,
  .service-card-link .service-icon,
  .service-card-link h3 { transition: none; }
  .hero-mobile-slide { animation: none; transform: none; }
  .hero-mobile-slide-1 { opacity: 1; }
  .hero-sp-text { opacity: 1; }
}

/* 診療案内のリンク先（下層ページ） */
.treatment-page { color:#371a11; }
.treatment-page .header nav .is-current { color: #37afe5; }
.treatment-hero { position:relative; display:grid; min-height:349px; margin:0 30px; overflow:hidden; place-items:center; background:url("assets/treatment-title-no-text.png") center / cover no-repeat; color:#fff; text-align:center; }
.treatment-hero .wrap { position:relative; z-index:1; }
.treatment-hero p,.section-en,.treatment-detail-heading > p { margin:0 0 6px; color:#54c1f1; font-size:12px; font-weight:700; letter-spacing:.18em; }
.treatment-hero p { color:#fff; font-size:16px; font-weight:400; letter-spacing:0; }
.treatment-hero h1 { margin:7px 0 0; color:#fff; font:600 34px "Noto Serif JP",serif; letter-spacing:.08em; }
.breadcrumb { display:flex; align-items:center; gap:12px; padding-top:17px; color:#85888c; font-size:11px; font-weight:400; }
.breadcrumb a,.breadcrumb [aria-current="page"] { font-size:11px; font-weight:400; }
.breadcrumb a { color:#54c1f1; }
.treatment-intro { padding:0 20px 85px; text-align:center; }
.treatment-intro h2,.treatment-flow h2 { margin:0 0 28px; font:600 29px/1.55 "Noto Serif JP",serif; letter-spacing:.06em; }
.treatment-intro .lead { margin:0; font-size:14px; line-height:2.25; }
.sp-only { display:none; }
.treatment-index { display:grid; grid-template-columns:repeat(12,1fr); gap:14px 12px; margin-top:110px; margin-bottom:0; }
.treatment-index a { position:relative; display:flex; grid-column:span 3; min-height:62px; padding:8px 18px; align-items:center; justify-content:center; gap:13px; border:2px solid #54c1f1; border-radius:10px; background:#fff; color:#43baf0; transition:color .3s ease,background-color .3s ease,transform .3s ease; }
.treatment-index a:nth-child(1) { grid-column:3 / span 3; }
.treatment-index a:hover,.treatment-index a:focus-visible { background:#54c1f1; color:#fff; transform:translateY(-4px); }
.treatment-index-icon,.treatment-icon { display:block; background-position:center !important; background-repeat:no-repeat; background-size:contain; }
.treatment-index-icon { position:relative; z-index:1; width:40px; height:40px; margin:0; transition:filter .3s ease; }
.treatment-index .icon-preventive { background-size:54px auto; }
.treatment-index .icon-total {
  width:32px;
  height:42px;
  background-image:url("assets/icon-total-button.png");
  background-position:center !important;
  background-size:auto 42px;
}
.treatment-index strong { position:relative; z-index:1; font-size:17px; font-weight:500; white-space:nowrap; }
.treatment-index a:hover .treatment-index-icon,.treatment-index a:focus-visible .treatment-index-icon { filter:brightness(0) invert(1); }
.treatment-details { background:#fff; }
.treatment-anchor { scroll-margin-top:107px; }
@media (min-width:768px) and (max-width:900px) and (orientation:landscape) {
  .treatment-anchor { scroll-margin-top:86px; }
}
@media (max-width:767px), (min-width:768px) and (max-width:1024px) and (orientation:portrait) {
  .treatment-anchor { scroll-margin-top:72px; }
}
.general-treatment { padding:200px 20px 0; background:#fff; }
.general-heading { margin-bottom:75px; text-align:center; }
.general-heading p { margin:0 0 7px; color:#54c1f1; font-size:13px; letter-spacing:.02em; }
.general-heading h2 { margin:0; color:#371a11; font:500 30px "Noto Sans JP",sans-serif; letter-spacing:.06em; }
.general-overview { display:grid; grid-template-columns:1fr 1.12fr; gap:65px; align-items:center; }
.general-overview > img { display:block; width:100%; border-radius:10px; }
.general-overview > div { padding:8px 0 8px 0; }
.general-overview h3,.painless-care h3 { margin:0 0 14px; color:#5685df; font-size:23px; font-weight:500; letter-spacing:.03em; }
.general-overview p,.painless-care p { margin:0; color:#371a11; font-size:14px; font-weight:400; line-height:2.05; }
.caries-progress { margin-top:112px; }
.caries-progress > h3 { display:flex; align-items:center; gap:35px; margin:0 65px 28px; padding:0; background:none; color:#5685df; font:500 24px "Noto Serif JP",serif; letter-spacing:.12em; text-align:center; }
.caries-progress > h3::before,.caries-progress > h3::after { content:""; height:1px; flex:1; background:#5685df; }
.caries-stages { display:grid; grid-template-columns:repeat(5,1fr); gap:22px; }
.caries-stages article { position:relative; min-width:0; min-height:475px; padding:10px 12px 20px; border:1px solid #d9eafa; border-radius:10px; background:#fff; }
.caries-stages article:not(:last-child)::after { content:"›"; position:absolute; z-index:2; top:112px; right:-21px; color:#5685df; font-size:42px; font-weight:700; line-height:1; }
.caries-stages b { position:relative; z-index:2; display:grid; width:40px; height:40px; margin:0 0 7px; flex:0 0 40px; place-items:center; overflow:visible; border-radius:50%; background:#5685df; color:#fff; font-size:17px; font-weight:500; line-height:1; }
.caries-stages img { display:block; width:100%; height:145px; object-fit:contain; }
.caries-stages h4 { margin:4px 0 17px; color:#5685df; font-size:16px; font-weight:500; text-align:center; }
.caries-stages p { margin:0; color:#371a11; font-size:12px; line-height:1.7; }
.cadcam-treatment { margin-top:85px; padding:48px 42px 44px; border-radius:12px; background:#f4fbfe; }
.cadcam-intro { max-width:760px; margin:0 auto 34px; text-align:center; }
.cadcam-intro h3 { margin:0 0 12px; color:#5685df; font-size:23px; font-weight:500; letter-spacing:.03em; }
.cadcam-intro p { margin:0; color:#371a11; font-size:14px; line-height:2.05; }
.cadcam-intro .cadcam-lead { margin-bottom:8px; color:#5685df; font-size:16px; font-weight:500; }
.cadcam-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.cadcam-card { display:flex; min-width:0; overflow:hidden; flex-direction:column; border:1px solid #deedf5; border-radius:10px; background:#fff; box-shadow:0 2px 10px rgba(89,128,210,.1); }
.cadcam-image { position:relative; height:190px; background:#fff; }
.cadcam-image img { position:absolute; inset:10px; display:block; width:calc(100% - 20px); height:calc(100% - 20px); object-fit:contain; }
.cadcam-card-body { display:flex; padding:22px 20px 24px; flex:1; flex-direction:column; align-items:center; text-align:center; }
.cadcam-card h4 { margin:0 0 14px; color:#5685df; font-size:18px; font-weight:500; }
.cadcam-card p { margin:0; color:#371a11; font-size:13px; line-height:1.8; }
.painless-care { display:block; min-height:0; margin-top:85px; background:#fff; }
.painless-care > header { max-width:640px; margin:0 auto 45px; }
.painless-care > header h3 { text-align:center; }
.painless-care > header p { font-size:13px; }
.anesthesia-cards { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.anesthesia-cards article { display:grid; height:350px; grid-template-columns:1fr 1fr; overflow:hidden; border:0; border-radius:12px; box-shadow:0 0 5px rgba(89,128,210,.5); }
.anesthesia-cards img { display:block; width:100%; height:100%; object-fit:cover; }
.anesthesia-cards img.infiltration-anesthesia-image { object-fit:contain; }
.anesthesia-cards article > div { display:flex; padding:28px 20px; flex-direction:column; justify-content:center; }
.anesthesia-cards h4 { margin:0 0 25px; color:#5685df; font-size:17px; font-weight:500; }
.anesthesia-cards p { margin:0; color:#371a11; font-size:12px; line-height:1.8; }
.periodontal-treatment { padding:110px 20px 0; background:#fff; }
.periodontal-treatment .general-heading { margin-bottom:100px; }
.perio-overview { display:grid; grid-template-columns:1fr 1.08fr; gap:45px; align-items:center; }
.perio-visual { min-height:0; }
.perio-visual > img { display:block; width:100%; height:auto; }
.perio-stat { position:absolute; top:25px; left:0; z-index:1; display:flex; width:210px; height:210px; flex-direction:column; align-items:center; justify-content:center; border:16px solid #ff8e9c; border-right-color:#ffd1d6; border-radius:50%; background:#fff; text-align:center; transform:rotate(-8deg); }
.perio-stat > * { transform:rotate(8deg); }
.perio-stat span { font-size:13px; font-weight:600; line-height:1.35; }
.perio-stat strong { font-size:15px; font-weight:500; line-height:1.1; }
.perio-stat em { color:#ff8e9c; font-size:53px; font-style:normal; font-weight:500; }
.perio-visual > p { position:absolute; bottom:0; left:0; z-index:2; margin:0; padding:13px 20px; border:2px solid #63c8f3; border-radius:9px; background:#fff; font-size:13px; font-weight:600; line-height:1.45; }
.perio-visual > p strong { color:#5685df; font-size:20px; }
.perio-visual > p small { display:block; color:#8b8b8b; font-size:9px; font-weight:400; }
.perio-copy h3,.laser-treatment h3 { margin:0 0 14px; color:#5685df; font-size:23px; font-weight:500; }
.perio-copy > p { margin:0; font-size:13px; line-height:1.9; }
.laser-treatment > div > p { margin:0; font-size:16px; font-weight:400; line-height:1.45; }
.perio-copy h4 { display:inline-block; margin:24px 0 5px 4px; padding:2px 11px; border-radius:18px; background:#f0f5ff; color:#5685df; font-size:16px; font-weight:500; line-height:1.45; }
.perio-symptoms { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.perio-symptoms > div { display:flex; height:170px; overflow:hidden; padding:7px 8px 14px; flex-direction:column; align-items:center; justify-content:space-between; border:0; border-radius:9px; background:#fff; text-align:center; box-shadow:0 0 4px rgba(89,128,210,.5); }
.perio-symptoms img { display:block; width:100%; height:110px; object-fit:contain; }
.perio-symptoms strong { color:#5685df; font-size:14px; font-weight:500; line-height:1.3; }
.perio-flow { margin-top:125px; }
.perio-flow > h3 { display:flex; align-items:center; gap:35px; margin:0 75px 28px; color:#5685df; font:500 24px "Noto Serif JP",serif; letter-spacing:.14em; }
.perio-flow > h3::before,.perio-flow > h3::after { content:""; height:1px; flex:1; background:#5685df; }
.perio-flow > div { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.perio-flow article { position:relative; min-height:390px; padding:17px 20px 22px; border:1px solid #d6e3f8; border-radius:9px; box-shadow:0 2px 6px rgb(89 128 210 / 10%); }
.perio-flow article:not(:last-child)::after { content:"›"; position:absolute; top:43%; right:-25px; z-index:2; color:#5685df; font-size:38px; font-weight:700; }
.perio-flow header { display:flex; align-items:center; gap:15px; }
.perio-flow header b { display:grid; width:38px; height:38px; place-items:center; border-radius:50%; background:#5685df; color:#fff; font-size:18px; }
.perio-flow h4 { margin:0; color:#5685df; font-size:19px; font-weight:500; }
.perio-flow img { display:block; width:100%; height:150px; object-fit:contain; }
.perio-flow article:first-child img { object-position:center top; }
.perio-flow article:nth-child(3) img { width:85%; margin-right:auto; margin-left:auto; object-position:center; transform:translateX(-9%); }
.perio-flow p { margin:8px 0 0; font-size:16px; line-height:1.7; }
.infection-note { position:relative; display:grid; min-height:190px; grid-template-columns:72px minmax(0,1fr) minmax(240px,310px); align-items:center; gap:20px; margin-top:22px; padding:14px 20px; overflow:hidden; border:1px solid #ff8d8d; border-radius:9px; background:#fdf7f7; }
.infection-note::after { content:none; }
.infection-icon { display:block; align-self:start; width:72px; height:72px; margin-top:8px; overflow:hidden; background:url("assets/treatment-perio/infection-icon.png") center / contain no-repeat; color:transparent; font-size:0; }
.infection-note h3 { margin:0 0 8px; font-size:21px; font-weight:500; letter-spacing:.08em; }
.infection-note h3 span { color:#ff6666; }
.infection-note p { margin:0; font-size:16px; line-height:1.7; }
.infection-note img { align-self:center; justify-self:start; width:100%; max-width:275px; height:auto; margin-left:-8px; object-fit:contain; }
.infection-copy { min-width:0; }
.infection-family-pc { display:block; grid-column:3; mix-blend-mode:multiply; }
.infection-family-sp { display:none; }
.laser-treatment { position:relative; min-height:390px; margin-top:95px; overflow:hidden; border-radius:9px; background:#f4f7fd; }
.laser-treatment > div { width:55%; padding:28px 30px 20px; }
.laser-treatment > img { position:absolute; top:17px; right:15px; width:45%; height:356px; border-radius:14px; object-fit:cover; }
.laser-benefits { position:absolute; z-index:2; left:32px; bottom:25px; display:grid; width:72%; grid-template-columns:repeat(3,1fr); gap:14px; }
.laser-benefits > div { display:flex; min-height:142px; gap:12px; padding:16px 14px; align-items:center; border-radius:9px; background:#fff; }
.laser-benefits b { display:block; width:58px; height:58px; flex:0 0 58px; border:0; background-position:center; background-repeat:no-repeat; background-size:contain; color:transparent; font-size:0; }
.laser-benefits > div:nth-child(1) b { background-image:url("assets/treatment-perio/laser-icons/frame-238.png"); }
.laser-benefits > div:nth-child(2) b { background-image:url("assets/treatment-perio/laser-icons/frame-239.png"); }
.laser-benefits > div:nth-child(3) b { background-image:url("assets/treatment-perio/laser-icons/frame-240.png"); }
.laser-benefits p { margin:0; font-size:11px; line-height:1.5; }
.laser-benefits strong { color:#5685df; font-size:14px; font-weight:500; }
.child-treatment { padding:110px 20px 0; background:#fff; }
.child-treatment .general-heading { margin-bottom:95px; }
.child-overview { display:grid; grid-template-columns:1fr 1.05fr; gap:60px; align-items:center; }
.child-overview > img { display:block; width:100%; }
.child-overview h3 { margin:0 0 20px; color:#5685df; font-size:23px; font-weight:500; }
.child-overview p { margin:0; font-size:16px; line-height:1.85; }
.child-features { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:30px; }
.child-features > div { display:flex; min-height:130px; padding:13px 8px; flex-direction:column; align-items:center; justify-content:center; border-radius:10px; background:#fff; box-shadow:0 0 5px rgba(89,128,210,.32); }
.child-features img { display:block; width:56px; height:56px; max-width:56px; max-height:56px; object-fit:contain; }
.child-features strong { color:#5685df; font-size:14px; font-weight:500; }
.child-care { margin-top:85px; }
.child-care > h3 { display:flex; align-items:center; gap:35px; margin:0 65px 28px; color:#5685df; font:500 24px "Noto Serif JP",serif; letter-spacing:.13em; }
.child-care > h3::before,.child-care > h3::after { content:""; height:1px; flex:1; background:#5685df; }
.child-care > div { display:grid; grid-template-columns:repeat(3,1fr); gap:42px; }
.child-care article { min-height:470px; overflow:hidden; border-radius:10px; background:#fff; box-shadow:0 1px 5px rgb(55 26 17 / 18%); }
.child-care article > img { display:block; width:100%; height:210px; object-fit:cover; }
.child-care h4 { position:relative; margin:18px 28px 22px; padding-bottom:13px; color:#5685df; font-size:18px; font-weight:500; text-align:center; }
.child-care h4::after { content:""; position:absolute; right:0; bottom:0; left:0; height:3px; background:radial-gradient(circle,#54c1f1 1.5px,transparent 1.8px) 0 0 / 11px 3px repeat-x; }
.child-care p { margin:0; padding:0 26px 26px; font-size:16px; line-height:1.7; }
.child-promise { display:grid; min-height:220px; grid-template-columns:220px 1fr 430px; align-items:center; gap:25px; margin-top:40px; padding:0 22px; border-radius:9px; background:#fffdf7; }
.child-promise > img { align-self:end; width:100%; }
.child-promise h3 { margin:0 0 28px; padding-bottom:11px; border-bottom:3px dotted #5685df; color:#5685df; font:500 20px "Noto Serif JP",serif; }
.child-promise p { margin:0; font-size:16px; line-height:1.7; }
.child-promise ul { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:0; padding:0; list-style:none; }
.child-promise li { display:grid; aspect-ratio:1; place-items:center; border-radius:50%; font-size:12px; line-height:1.7; text-align:center; }
.child-promise li:nth-child(1) { background:radial-gradient(circle at 40% 35%,#fff,#f9dfe8); }
.child-promise li:nth-child(2) { background:radial-gradient(circle at 40% 35%,#fff,#ffedc6); }
.child-promise li:nth-child(3) { background:radial-gradient(circle at 40% 35%,#fff,#edf4d9); }
@media (min-width: 1025px) {
  .child-promise h3 { white-space:nowrap; }
}
.preventive-treatment { padding:110px 20px 0; background:#fff; }
.preventive-treatment .general-heading { margin-bottom:95px; }
.preventive-overview { display:grid; grid-template-columns:1fr 1.05fr; gap:65px; align-items:center; }
.preventive-overview > img { display:block; width:100%; }
.preventive-overview h3 { margin:0 0 20px; color:#5685df; font-size:23px; font-weight:500; }
.preventive-overview p { margin:0; font-size:16px; line-height:1.85; }
.preventive-care { margin-top:85px; }
.preventive-care > h3 { display:flex; align-items:center; gap:35px; margin:0 65px 55px; color:#5685df; font:500 24px "Noto Serif JP",serif; letter-spacing:.13em; }
.preventive-care > h3::before,.preventive-care > h3::after { content:""; height:1px; flex:1; background:#5685df; }
.preventive-care > div { display:grid; grid-template-columns:1fr 1fr; gap:28px 20px; }
.preventive-care article { display:grid; min-height:300px; grid-template-columns:1fr 1fr; overflow:hidden; border-radius:11px; background:#fff; box-shadow:0 0 5px rgba(89,128,210,.34); }
.preventive-care article > img { display:block; width:100%; height:100%; object-fit:cover; }
.preventive-care article > div { display:flex; padding:25px 20px; flex-direction:column; justify-content:center; }
.preventive-care h4 { margin:0 0 25px; color:#5685df; font-size:18px; font-weight:500; }
.preventive-care p { margin:0; font-size:16px; line-height:1.7; }
.prosthetic-treatment { padding:110px 20px 0; background:#fff; }
.prosthetic-treatment .general-heading { margin-bottom:95px; }
.prosthetic-overview { display:grid; grid-template-columns:1fr 1.05fr; gap:65px; align-items:center; }
.prosthetic-overview > img { display:block; width:100%; }
.prosthetic-overview h3 { margin:0 0 20px; color:#5685df; font-size:23px; font-weight:500; }
.prosthetic-overview p { margin:0; font-size:16px; line-height:1.85; }
.prosthetic-types { margin-top:70px; }
.prosthetic-types > h3 { display:flex; align-items:center; gap:35px; margin:0 0 38px; color:#5685df; font:500 24px "Noto Serif JP",serif; letter-spacing:.1em; }
.prosthetic-types > h3::before,.prosthetic-types > h3::after { content:""; height:1px; flex:1; background:#5685df; }
.prosthetic-types > div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.prosthetic-types article { display:flex; min-height:455px; overflow:hidden; padding-bottom:25px; flex-direction:column; align-self:stretch; border:0; border-radius:10px; background:#fff; box-shadow:0 0 5px rgba(89,128,210,.5); }
.prosthetic-types article > img { display:block; width:100%; height:225px; flex:0 0 225px; object-fit:contain; object-position:center; }
.prosthetic-types h4 { position:relative; margin:8px 30px 20px; padding-bottom:12px; color:#5685df; font-size:18px; font-weight:500; text-align:center; }
.prosthetic-types h4::after { content:""; position:absolute; right:0; bottom:0; left:0; height:3px; background:radial-gradient(circle,#54c1f1 1.5px,transparent 1.8px) 0 0 / 11px 3px repeat-x; }
.prosthetic-types p { margin:0; padding:0 25px; font-size:16px; line-height:1.7; }
.prosthetic-comparison { margin-top:90px; padding:55px 40px; border-radius:12px; background:#f4faff; }
.prosthetic-comparison-intro { margin-bottom:38px; text-align:center; }
.prosthetic-comparison-intro h3 { margin:0 0 22px; color:#5685df; font:500 24px "Noto Serif JP",serif; letter-spacing:.08em; }
.prosthetic-comparison-intro p { margin:0; font-size:16px; line-height:1.85; }
.prosthetic-comparison-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.prosthetic-comparison-card { display:flex; min-width:0; padding:28px 22px 26px; flex-direction:column; border:1px solid rgba(86,133,223,.22); border-radius:10px; background:#fff; box-shadow:0 2px 8px rgba(89,128,210,.1); }
.prosthetic-comparison-card > h4 { margin:0 0 24px; padding-bottom:13px; border-bottom:2px dotted #54c1f1; color:#5685df; font-size:20px; font-weight:500; text-align:center; }
.prosthetic-comparison-card section { margin-top:18px; }
.prosthetic-comparison-card section:first-of-type { margin-top:0; }
.prosthetic-comparison-card h5 { display:inline-block; margin:0 0 9px; padding:4px 13px; border-radius:999px; background:#e8f6fc; color:#397eb8; font-size:14px; font-weight:500; }
.prosthetic-comparison-card .is-caution h5 { background:#f5eee8; color:#765143; }
.prosthetic-comparison-card p,.prosthetic-comparison-card ul { margin:0; color:#371a11; font-size:14px; line-height:1.75; }
.prosthetic-comparison-card ul { padding:0; list-style:none; }
.prosthetic-comparison-card li { position:relative; padding-left:1.15em; }
.prosthetic-comparison-card li::before { content:"・"; position:absolute; left:0; }
.prosthetic-comparison-note { margin:38px auto 0; max-width:850px; font-size:16px; line-height:1.85; text-align:center; }
.cosmetic-treatment { padding:110px 20px 140px; background:#fff; }
.cosmetic-treatment .general-heading { margin-bottom:70px; }
.cosmetic-overview,.ceramic-overview { display:grid; grid-template-columns:1fr 1.08fr; gap:65px; align-items:center; }
.cosmetic-overview > img,.ceramic-overview > img { display:block; width:100%; height:380px; object-fit:contain; }
.cosmetic-overview h3,.ceramic-overview h3,.veneer h3 { margin:0 0 20px; color:#5685df; font-size:23px; font-weight:500; }
.cosmetic-overview p,.ceramic-overview p,.veneer p { margin:0; font-size:16px; line-height:1.8; }
.whitening-types,.ceramic-types { margin-top:65px; }
.whitening-types > h3,.ceramic-types > h3 { display:flex; align-items:center; gap:35px; margin:0 0 38px; color:#5685df; font:500 24px "Noto Serif JP",serif; letter-spacing:.12em; }
.ceramic-heading-text > span { white-space:nowrap; }
.whitening-types > h3::before,.whitening-types > h3::after,.ceramic-types > h3::before,.ceramic-types > h3::after { content:""; height:1px; flex:1; background:#5685df; }
.whitening-types > div { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.whitening-types article { min-height:322px; padding:14px; border:0; border-radius:10px; background:#f5f8fc; box-shadow:0 0 5px rgba(89,128,210,.5); }
.whitening-card-head { display:grid; grid-template-columns:221px 1fr; gap:28px; }
.whitening-card-head > img { width:100%; height:193px; border-radius:6px; object-fit:cover; }
.whitening-types h4 { margin:6px 0 2px; color:#5685df; font-size:20px; font-weight:500; line-height:1.35; }
.whitening-types small { color:#5685df; font-size:14px; }
.whitening-types ul,.ceramic-types ul,.veneer ul { margin:15px 0 0; padding:0; list-style:none; }
.whitening-types li,.ceramic-types li,.veneer li { position:relative; margin:5px 0; padding-left:20px; font-size:13px; }
.whitening-types li { font-size:13px; line-height:1.45; white-space:nowrap; }
.whitening-types li::before,.ceramic-types li::before,.veneer li::before { content:"✓"; position:absolute; left:0; display:grid; width:15px; height:15px; place-items:center; border:1px solid #5685df; border-radius:50%; color:#5685df; font-size:9px; line-height:1; }
.whitening-types article > p { margin:14px 10px 0; font-size:16px; line-height:1.45; }
.ceramic-overview { margin-top:90px; }
.ceramic-types > div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.ceramic-types article { display:flex; min-height:460px; padding:14px 18px 24px; flex-direction:column; border:0; border-radius:9px; background:#fff; box-shadow:0 0 5px rgba(89,128,210,.5); }
.ceramic-types article > img { display:block; width:100%; height:143px; object-fit:contain; object-position:center top; }
.ceramic-types h4 { position:relative; margin:12px 0 0; padding-bottom:13px; color:#5685df; font-size:18px; font-weight:500; line-height:1.35; text-align:center; }
.ceramic-types h4::after { content:""; position:absolute; right:18px; bottom:0; left:18px; height:3px; background:radial-gradient(circle,#54c1f1 1.5px,transparent 1.8px) 0 0 / 11px 3px repeat-x; }
.ceramic-types h4 small { display:block; margin-top:1px; color:#371a11; font-size:12px; font-weight:400; }
.ceramic-types ul { margin:18px 0 0; }
.ceramic-types li { margin:7px 0; font-size:14px; line-height:1.5; }
.ceramic-types p { margin:18px 0 0; font-size:16px; line-height:1.55; }
.veneer { display:grid; min-height:225px; grid-template-columns:260px 1fr 1fr; align-items:center; gap:28px; margin-top:50px; padding:18px 20px; border-radius:9px; background:#fff; box-shadow:0 0 5px rgba(89,128,210,.5); }
.veneer > img { width:100%; height:187px; border-radius:5px; object-fit:cover; }
.veneer ul { margin:0; }
.veneer li { margin:15px 0; font-size:14px; }
.veneer-points { align-self:stretch; display:flex; min-width:0; flex-direction:column; justify-content:center; }
.veneer-recommendation { margin:2px 0 0 !important; padding:5px 14px; border-radius:999px; background:rgba(89,128,210,.12); color:#5685df; font-size:14px !important; font-weight:500; line-height:1.45 !important; text-align:center; white-space:nowrap; }
.total-care-treatment { padding:110px 20px 140px; background:#fff; }
.total-care-treatment .general-heading { margin-bottom:105px; }
.total-care-overview { display:grid; grid-template-columns:1fr 1.08fr; gap:65px; align-items:center; }
.total-care-overview > img { display:block; width:100%; height:auto; object-fit:contain; }
.total-care-overview h3 { margin:0 0 18px; color:#5685df; font-size:23px; font-weight:500; }
.total-care-overview p { margin:0; font-size:16px; line-height:1.85; }
.total-care-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; margin-top:100px; }
.total-care-cards article { display:flex; min-height:455px; padding:16px 20px 25px; flex-direction:column; align-items:center; border:0; border-radius:10px; background:#fff; box-shadow:0 0 5px rgba(89,128,210,.5); }
.total-care-cards img { display:block; width:112px; height:112px; object-fit:contain; }
.total-care-cards h3 { display:flex; min-height:64px; margin:5px 0 0; align-items:center; justify-content:center; color:#5685df; font-size:18px; font-weight:500; line-height:1.45; text-align:center; }
.total-care-cards article:nth-child(2) h3 { color:#4b9146; }
.total-care-cards article:nth-child(3) h3 { color:#8b6590; }
.total-care-cards span { width:60px; height:1px; margin:4px 0 28px; background:#5685df; }
.total-care-cards article:nth-child(2) span { background:#4b9146; }
.total-care-cards article:nth-child(3) span { background:#8b6590; }
.total-care-cards p { width:100%; margin:0; font-size:16px; line-height:1.7; }
.treatment-detail { scroll-margin-top:92px; padding:92px 20px; }
.treatment-detail:nth-child(odd) { background:#f7fafc; }
.treatment-detail-grid { display:grid; grid-template-columns:340px minmax(0,1fr); gap:95px; }
.treatment-detail-heading { position:relative; text-align:center; }
.treatment-number { position:absolute; top:-35px; left:10px; color:rgb(84 193 241 / 14%); font:700 76px/1 "Noto Serif JP",serif; }
.treatment-icon { position:relative; width:110px; height:110px; margin:0 auto 15px; }
.treatment-detail-heading h2 { margin:0 0 13px; font:600 28px "Noto Serif JP",serif; letter-spacing:.05em; }
.treatment-detail-heading em { display:inline-block; padding:7px 17px; border-radius:20px; background:#54c1f1; color:#fff; font-size:12px; font-style:normal; }
.icon-general { background-image:url("assets/icon-general.png"); }
.icon-perio { background-image:url("assets/icon-perio.png"); }
.icon-child { background-image:url("assets/icon-child.png"); }
.icon-preventive { background-image:url("assets/icon-preventive.png"); }
.icon-prosthetic { background-image:url("assets/icon-prosthetic.png"); }
.icon-cosmetic { background-image:url("assets/icon-cosmetic.png"); }
.icon-total { background-image:url("assets/icon-total.png"); }
.treatment-detail-copy h3 { margin:0 0 24px; font:600 24px/1.7 "Noto Serif JP",serif; letter-spacing:.05em; }
.treatment-detail-copy > p { margin:0 0 15px; font-size:14px; line-height:2.05; }
.symptom-box { margin-top:28px; padding:24px 30px 21px; border-radius:5px; background:#fff; box-shadow:0 5px 24px rgb(44 90 110 / 7%); }
.treatment-detail:nth-child(even) .symptom-box { background:#f7fafc; box-shadow:none; }
.symptom-box strong { display:block; margin-bottom:13px; color:#37afe5; font:600 15px "Noto Serif JP",serif; }
.symptom-box ul { display:grid; grid-template-columns:1fr 1fr; gap:8px 25px; margin:0; padding:0; list-style:none; }
.symptom-box li { position:relative; padding-left:19px; font-size:13px; }
.symptom-box li::before { content:"✓"; position:absolute; left:0; color:#54c1f1; font-weight:700; }
.treatment-flow { padding:102px 20px 110px; background:#eff9fd; text-align:center; }
.flow-list { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:48px; text-align:left; }
.flow-list div { position:relative; min-height:205px; padding:27px 24px; border-radius:7px; background:#fff; }
.flow-list div:not(:last-child)::after { content:"›"; position:absolute; z-index:2; top:50%; right:-17px; width:32px; height:32px; border-radius:50%; background:#54c1f1; color:#fff; font-size:24px; line-height:29px; text-align:center; transform:translateY(-50%); }
.flow-list b { color:#54c1f1; font:700 13px "Noto Serif JP",serif; letter-spacing:.1em; }
.flow-list h3 { margin:14px 0 12px; font:600 19px "Noto Serif JP",serif; }
.flow-list p { margin:0; font-size:12px; line-height:1.9; }
.treatment-cta { padding:77px 20px; background:#fff; text-align:center; }
.treatment-cta > div { max-width:790px; margin:auto; padding:42px 20px 38px; border:1px solid #bde8f9; background:linear-gradient(135deg,#f8fdff,#eefaff); }
.treatment-cta p { margin:0 0 5px; color:#54c1f1; font-size:13px; }
.treatment-cta h2 { margin:0 0 17px; font:600 24px "Noto Serif JP",serif; }
.treatment-cta a { display:flex; justify-content:center; align-items:center; gap:10px; color:#37afe5; font-size:31px; font-weight:700; letter-spacing:.05em; }
.treatment-cta small { display:block; margin-top:8px; font-size:11px; }
@media (max-width: 900px) {
  .treatment-index { grid-template-columns:repeat(2,1fr); }
  .treatment-index a,.treatment-index a:nth-child(1) { grid-column:auto; }
  .treatment-detail-grid { grid-template-columns:280px minmax(0,1fr); gap:55px; }
  .caries-stages { gap:12px; }
  .caries-stages article:not(:last-child)::after { right:-13px; }
}
@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .sp-only { display:block; }
  .treatment-hero { min-height:220px; margin-right:30px; margin-left:30px; background-position:center; }
  .treatment-hero h1 { font-size:27px; }
  .breadcrumb { padding-right:20px; padding-left:20px; }
  .treatment-intro { padding:0 24px 60px; }
  .treatment-intro h2,.treatment-flow h2 { font-size:23px; }
  .treatment-intro .lead { font-size:13px; line-height:2; }
  .treatment-intro .lead br:not(.sp-only) { display:none; }
  .treatment-index { width:calc(100% - 40px); margin-top:110px; margin-bottom:0; gap:10px; }
  .treatment-index a { min-height:58px; padding:7px 9px; gap:7px; border-width:2px; border-radius:8px; }
  .treatment-index-icon { width:33px; height:33px; }
  .treatment-index strong { font-size:13px; }
  .general-treatment { padding:200px 20px 0; }
  .general-heading { margin-bottom:50px; }
  .general-heading h2 { font-size:28px; }
  .general-overview { grid-template-columns:1fr; gap:30px; }
  .general-overview h3,.painless-care h3 { font-size:20px; }
  .general-overview p,.painless-care p { font-size:13px; line-height:2; }
  .caries-progress { margin-top:70px; }
  .caries-progress > h3 { gap:15px; margin-right:0; margin-left:0; font-size:18px; }
  .caries-stages { grid-template-columns:1fr; gap:36px; }
  .caries-stages article { display:grid; min-height:0; grid-template-columns:46px 105px 1fr; gap:8px 10px; align-items:center; padding:12px 14px; }
  .caries-stages article:not(:last-child)::after { content:"↓"; top:auto; right:50%; bottom:-32px; font-size:25px; transform:translateX(50%); }
  .caries-stages b { width:46px; height:46px; margin:0; font-size:18px; }
  .caries-stages img { width:105px; height:100px; grid-row:1 / span 2; grid-column:2; }
  .caries-stages h4 { margin:0; text-align:left; }
  .caries-stages p { grid-column:3; margin:0; font-size:11px; }
  .cadcam-treatment { margin-top:70px; padding:34px 16px; }
  .cadcam-intro { margin-bottom:28px; }
  .cadcam-intro h3 { font-size:20px; }
  .cadcam-intro p { font-size:13px; line-height:2; }
  .cadcam-intro .cadcam-lead { font-size:15px; }
  .cadcam-cards { grid-template-columns:1fr; gap:20px; }
  .cadcam-card-body { padding:20px 18px 22px; }
  .painless-care { margin-top:70px; }
  .painless-care > header { margin-bottom:30px; }
  .anesthesia-cards { grid-template-columns:1fr; }
  .anesthesia-cards article { min-height:235px; }
  .anesthesia-cards article > div { padding:22px 16px; }
  .anesthesia-cards h4 { margin-bottom:15px; }
  .periodontal-treatment { padding:110px 20px 80px; }
  .periodontal-treatment .general-heading { margin-bottom:55px; }
  .perio-overview { grid-template-columns:1fr; gap:45px; }
  .perio-visual { min-height:0; }
  .perio-stat { width:160px; height:160px; border-width:12px; }
  .perio-stat em { font-size:41px; }
  .perio-visual > img { width:100%; }
  .perio-copy h3,.laser-treatment h3 { font-size:20px; }
  .perio-symptoms { gap:7px; }
  .perio-symptoms > div { height:140px; padding:6px 4px 10px; border-width:1px; }
  .perio-symptoms img { height:90px; }
  .perio-symptoms strong { font-size:10px; }
  .perio-flow { margin-top:80px; }
  .perio-flow > h3 { gap:15px; margin-right:0; margin-left:0; font-size:18px; }
  .perio-flow > div { grid-template-columns:1fr; gap:34px; }
  .perio-flow article { min-height:0; }
  .perio-flow article:not(:last-child)::after { content:"↓"; top:auto; right:50%; bottom:-29px; font-size:25px; transform:translateX(50%); }
  .infection-note { grid-template-columns:55px 1fr; padding:18px 55px 18px 18px; }
  .infection-icon { width:50px; height:50px; }
  .infection-note img { display:none; }
  .infection-note h3 { font-size:18px; }
  .laser-treatment { min-height:0; margin-top:70px; padding-bottom:0; }
  .laser-treatment > div { width:100%; padding:25px 20px; }
  .laser-treatment > div > p { font-size:13px; line-height:1.8; }
  .laser-benefits { position:static; width:100%; grid-template-columns:1fr; margin-top:24px; }
  .laser-treatment > img { position:static; width:100%; height:auto; max-height:280px; border-radius:0 0 9px 9px; }
  .child-treatment { padding:110px 20px 0; }
  .child-treatment .general-heading { margin-bottom:55px; }
  .child-overview { grid-template-columns:1fr; gap:35px; }
  .child-overview h3 { font-size:20px; }
  .child-features { gap:8px; }
  .child-features > div { min-height:110px; }
  .child-features img { width:55px; height:52px; }
  .child-features strong { font-size:11px; }
  .child-care { margin-top:70px; }
  .child-care > h3 { gap:14px; margin-right:0; margin-left:0; font-size:18px; }
  .child-care > div { grid-template-columns:1fr; gap:25px; }
  .child-care article { min-height:0; }
  .child-promise { grid-template-columns:1fr; gap:20px; padding:20px; text-align:center; }
  .child-promise > img { width:210px; margin:auto; }
  .child-promise h3 { font-size:18px; }
  .child-promise ul { width:min(360px,100%); margin:auto; }
  .child-promise li { font-size:10px; }
  .preventive-treatment { padding:110px 20px 0; }
  .preventive-treatment .general-heading { margin-bottom:55px; }
  .preventive-overview { grid-template-columns:1fr; gap:35px; }
  .preventive-overview h3 { font-size:20px; }
  .preventive-care { margin-top:70px; }
  .preventive-care > h3 { gap:14px; margin-right:0; margin-bottom:35px; margin-left:0; font-size:18px; }
  .preventive-care > div { grid-template-columns:1fr; gap:20px; }
  .preventive-care article { min-height:280px; }
  .preventive-care article > div { padding:22px 16px; }
  .preventive-care h4 { margin-bottom:15px; }
  .prosthetic-treatment { padding:110px 20px 0; }
  .prosthetic-treatment .general-heading { margin-bottom:55px; }
  .prosthetic-overview { grid-template-columns:1fr; gap:35px; }
  .prosthetic-overview h3 { font-size:20px; }
  .prosthetic-types { margin-top:70px; }
  .prosthetic-types > h3 { gap:14px; font-size:18px; text-align:center; }
  .prosthetic-types > div { grid-template-columns:1fr; gap:25px; }
  .prosthetic-types article { min-height:0; }
  .prosthetic-comparison { margin-top:65px; padding:42px 22px; }
  .prosthetic-comparison-intro h3 { font-size:20px; }
  .prosthetic-heading-text > span,.ceramic-heading-text > span { display:block; white-space:nowrap; }
  .prosthetic-comparison-intro p br,.prosthetic-comparison-note br { display:none; }
  .prosthetic-comparison-grid { grid-template-columns:1fr; gap:20px; }
  .prosthetic-comparison-note { margin-top:30px; text-align:left; }
  .cosmetic-treatment { padding:110px 20px 80px; }
  .cosmetic-treatment .general-heading { margin-bottom:55px; }
  .cosmetic-overview,.ceramic-overview { grid-template-columns:1fr; gap:30px; }
  .cosmetic-overview h3,.ceramic-overview h3,.veneer h3 { font-size:20px; }
  .whitening-types > h3,.ceramic-types > h3 { gap:13px; font-size:18px; text-align:center; }
  .whitening-types > div,.ceramic-types > div { grid-template-columns:1fr; gap:20px; }
  .whitening-card-head { grid-template-columns:140px 1fr; gap:12px; }
  .whitening-card-head > img { height:150px; }
  .whitening-types h4 { font-size:15px; }
  .whitening-types li,.ceramic-types li,.veneer li { font-size:12px; }
  .whitening-types li { white-space:normal; }
  .ceramic-overview { margin-top:70px; }
  .ceramic-types article { min-height:0; }
  .veneer { grid-template-columns:1fr; text-align:left; }
  .veneer > img { height:auto; }
  .veneer-recommendation { white-space:normal; }
  .total-care-treatment { padding:110px 20px 80px; }
  .total-care-treatment .general-heading { margin-bottom:55px; }
  .total-care-overview { grid-template-columns:1fr; gap:30px; }
  .total-care-overview h3 { font-size:20px; }
  .total-care-cards { grid-template-columns:1fr; gap:22px; margin-top:70px; }
  .total-care-cards article { min-height:0; }
  .treatment-detail { scroll-margin-top:70px; padding:65px 24px; }
  .treatment-detail-grid { grid-template-columns:1fr; gap:36px; }
  .treatment-number { top:-23px; left:3px; font-size:61px; }
  .treatment-icon { width:91px; height:91px; }
  .treatment-detail-heading h2 { font-size:24px; }
  .treatment-detail-copy h3 { font-size:21px; line-height:1.65; }
  .treatment-detail-copy > p { font-size:13px; line-height:2; }
  .symptom-box { padding:22px 20px; }
  .symptom-box ul { grid-template-columns:1fr; }
  .treatment-flow { padding:70px 20px 75px; }
  .flow-list { grid-template-columns:1fr; gap:15px; margin-top:36px; }
  .flow-list div { min-height:0; padding:23px 24px; }
  .flow-list div:not(:last-child)::after { content:"↓"; top:auto; right:calc(50% - 14px); bottom:-20px; width:28px; height:28px; font-size:14px; line-height:27px; transform:none; }
  .flow-list h3 { margin:8px 0; font-size:18px; }
  .treatment-cta { padding:55px 20px; }
  .treatment-cta > div { padding:34px 13px 30px; }
  .treatment-cta h2 { font-size:21px; }
  .treatment-cta a { font-size:25px; }
}

/* SP版：支給された3つの特徴カードに合わせた縦長レイアウト */
@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .features .cards {
    width: min(330px, 100%);
    margin: 0 auto;
    gap: 24px;
  }

  .features .cards article {
    width: 100%;
    min-height: 434px;
    padding: 25px 24px 30px;
    border: 1px solid rgb(84 193 241 / 20%);
    border-radius: 9px;
    box-shadow: 0 0 4px rgb(84 193 241 / 20%);
  }

  .features .cards article > b {
    top: 0;
    left: 0;
    width: 64px;
    height: 56px;
    border-radius: 8px 0 12px 0;
    font-size: 30px;
  }

  .features .cards img {
    width: 100%;
    height: auto;
    aspect-ratio: 284 / 176;
    border-radius: 7px;
    object-fit: cover;
  }

  .features .cards h3 {
    margin: 31px 0 18px;
    font-size: 18px;
    line-height: 1.55;
  }

  .features .cards p {
    margin: 0;
    font-size: 13px;
    line-height: 2.05;
  }

  .features .cards p br { display: none; }

  .concept > div {
    width: min(330px, 100%);
    margin: 0 auto;
  }

  .concept-copy { font-size: 13px; }
}

/* 診療案内：患者さま向けの説明文は16pxに統一 */
.treatment-page .general-overview p,
.treatment-page .painless-care p,
.treatment-page .caries-stages p,
.treatment-page .anesthesia-cards p,
.treatment-page .perio-copy > p,
.treatment-page .perio-flow p,
.treatment-page .infection-note p,
.treatment-page .laser-treatment > div > p,
.treatment-page .laser-benefits p,
.treatment-page .treatment-detail-copy > p,
.treatment-page .symptom-box li,
.treatment-page .flow-list p {
  font-size:16px;
}

/* 診療案内：説明文のウェイトをレギュラーに統一 */
.treatment-page main p { font-weight:400; }

/* 診療案内 SP版：375〜390pxを基準にした全体レイアウト */
@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .treatment-page { overflow-x:hidden; }
  .treatment-page .wrap { width:100%; }

  .treatment-hero {
    min-height:190px;
    margin-right:30px;
    margin-left:30px;
    background-position:center;
  }
  .treatment-hero p { font-size:12px; }
  .treatment-hero h1 { font-size:26px; }
  .breadcrumb { width:100%; padding:13px 20px 0; font-size:11px; }

  .treatment-index {
    width:calc(100% - 40px);
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:80px;
  }
  .treatment-index a,
  .treatment-index a:nth-child(1) {
    min-width:0;
    min-height:58px;
    grid-column:auto;
    padding:7px 6px;
    gap:6px;
  }
  .treatment-index a:last-child {
    width:calc(50% - 5px);
    grid-column:1 / -1;
    justify-self:center;
  }
  .treatment-index-icon { width:34px; height:34px; flex:0 0 34px; }
  .treatment-index .icon-preventive { background-size:44px auto; }
  .treatment-index strong { min-width:0; font-size:13px; }

  .general-treatment,
  .periodontal-treatment,
  .child-treatment,
  .preventive-treatment,
  .prosthetic-treatment,
  .cosmetic-treatment,
  .total-care-treatment {
    padding-right:20px;
    padding-left:20px;
  }
  .general-treatment { padding-top:110px; }
  .general-heading { margin-bottom:48px !important; }
  .general-heading p { font-size:12px; }
  .general-heading h2 { font-size:27px; }

  .general-overview,
  .perio-overview,
  .child-overview,
  .preventive-overview,
  .prosthetic-overview,
  .cosmetic-overview,
  .ceramic-overview,
  .total-care-overview {
    grid-template-columns:minmax(0,1fr);
    gap:28px;
  }
  .general-overview > img,
  .perio-visual > img,
  .child-overview > img,
  .preventive-overview > img,
  .prosthetic-overview > img,
  .cosmetic-overview > img,
  .ceramic-overview > img,
  .total-care-overview > img {
    width:100%;
    height:auto;
    max-height:none;
    object-fit:contain;
  }
  .general-overview h3,
  .perio-copy h3,
  .child-overview h3,
  .preventive-overview h3,
  .prosthetic-overview h3,
  .cosmetic-overview h3,
  .ceramic-overview h3,
  .total-care-overview h3,
  .painless-care h3,
  .laser-treatment h3 {
    font-size:20px;
    line-height:1.55;
  }
  .treatment-page .general-overview p,
  .treatment-page .painless-care p,
  .treatment-page .perio-copy > p,
  .treatment-page .infection-note p,
  .treatment-page .laser-treatment > div > p,
  .treatment-page .child-overview p,
  .treatment-page .preventive-overview p,
  .treatment-page .prosthetic-overview p,
  .treatment-page .cosmetic-overview p,
  .treatment-page .ceramic-overview p,
  .treatment-page .total-care-overview p,
  .treatment-page .total-care-cards p {
    font-size:16px;
    line-height:1.85;
  }

  .caries-stages article {
    grid-template-columns:42px 92px minmax(0,1fr);
    padding:12px 10px;
  }
  .caries-stages b { width:42px; height:42px; font-size:16px; }
  .caries-stages img { width:92px; height:92px; }
  .caries-stages h4 { font-size:15px; }
  .treatment-page .caries-stages p { font-size:13px; line-height:1.65; }

  .anesthesia-cards article,
  .preventive-care article {
    grid-template-columns:1fr;
  }
  .anesthesia-cards article > img,
  .preventive-care article > img {
    width:100%;
    height:210px;
    min-height:0;
    object-fit:cover;
  }
  .anesthesia-cards article > div,
  .preventive-care article > div { padding:22px 18px 25px; }

  .perio-symptoms { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .perio-symptoms > div { min-width:0; }
  .perio-symptoms strong { font-size:11px; line-height:1.35; }
  .perio-flow article img { width:100%; height:auto; max-height:220px; object-fit:contain; }
  .infection-note { grid-template-columns:50px minmax(0,1fr); padding:18px; }
  .infection-note h3 { font-size:17px; }

  .laser-treatment > div { padding:24px 18px; }
  .laser-benefits article { min-width:0; padding:14px; }
  .laser-benefits p { font-size:14px !important; }

  .child-features { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .child-features > div { min-width:0; padding:10px 4px; }
  .child-care article > img { height:auto; aspect-ratio:16/10; object-fit:cover; }
  .child-care article p { font-size:16px; line-height:1.75; }

  .preventive-care article { min-height:0; }
  .preventive-care p,
  .prosthetic-types p { font-size:16px; line-height:1.75; }
  .prosthetic-types article > img { height:auto; max-height:230px; }

  .whitening-card-head { display:block; }
  .whitening-card-head > img { height:auto; aspect-ratio:16/10; margin-bottom:16px; }
  .whitening-types article { min-height:0; padding:14px 14px 20px; }
  .whitening-types h4 { font-size:19px; }
  .whitening-types small { font-size:13px; }
  .whitening-types li,
  .ceramic-types li,
  .veneer li { font-size:15px; line-height:1.6; }
  .whitening-types article > p,
  .ceramic-types p,
  .veneer p { font-size:16px; line-height:1.75; }
  .ceramic-types article { padding:14px 16px 24px; }
  .ceramic-types article > img { height:auto; aspect-ratio:335/143; }
  .veneer { gap:20px; padding:16px; }
  .veneer-points { width:100%; }
  .veneer-recommendation { font-size:14px !important; }

  .total-care-cards article { padding:18px 18px 26px; }
  .total-care-cards h3 { min-height:0; margin-top:8px; font-size:18px; }
  .total-care-cards span { margin-bottom:22px; }

  .site-footer { margin-top:0; }
  .footer-inner { padding-right:20px; padding-left:20px; }
}

@media (max-width: 390px) {
  .treatment-index { width:calc(100% - 40px); }
  .treatment-index strong { font-size:12px; }
  .caries-stages article { grid-template-columns:38px 82px minmax(0,1fr); gap:7px; }
  .caries-stages b { width:38px; height:38px; font-size:15px; }
  .caries-stages img { width:82px; height:86px; }
}

/* 診療案内 SP版：本文14px／行間1.9、タイトル画像とボタン余白 */
@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .treatment-page { font-size:14px; line-height:1.9; }

  .treatment-hero {
    width:100%;
    min-height:0;
    aspect-ratio:375 / 156;
    margin-right:0;
    margin-left:0;
    background-image:url("assets/treatment-title-no-text.png");
    background-position:center center;
    background-size:cover;
  }
  .treatment-hero p { margin-bottom:3px; font-size:10px; line-height:1.4; }
  .treatment-hero h1 { margin-top:4px; font-size:21px; line-height:1.45; }

  .treatment-index,
  .treatment-index.wrap {
    width:calc(100% - 40px);
    margin-right:20px;
    margin-left:20px;
  }
  .treatment-index strong { font-size:14px; line-height:1.4; }

  .treatment-page main p,
  .treatment-page main li,
  .treatment-page main small,
  .treatment-page main .symptom-box li,
  .treatment-page main .caries-stages p,
  .treatment-page main .laser-benefits p,
  .treatment-page main .child-promise li,
  .treatment-page main .whitening-types li,
  .treatment-page main .ceramic-types li,
  .treatment-page main .veneer li,
  .treatment-page main .total-care-cards p {
    font-size:14px;
    line-height:1.9;
  }
  .treatment-page main h2,
  .treatment-page main h3,
  .treatment-page main h4 { line-height:1.55; }

  .anesthesia-cards article {
    display:block;
    min-height:0;
    height:auto;
    border-radius:10px;
    background:#fff;
    box-shadow:0 1px 5px rgb(55 26 17 / 18%);
  }
  .anesthesia-cards img {
    width:min(260px,100%);
    height:auto;
    aspect-ratio:auto;
    margin:0 auto;
    object-fit:contain;
  }
  .anesthesia-cards article > div { padding:0; }
  .anesthesia-cards h4 {
    position:relative;
    margin:18px 24px 20px;
    padding-bottom:13px;
    font-size:18px;
    text-align:center;
  }
  .anesthesia-cards h4::after {
    content:"";
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    height:3px;
    background:radial-gradient(circle,#54c1f1 1.5px,transparent 1.8px) 0 0 / 11px 3px repeat-x;
  }
  .anesthesia-cards p { padding:0 22px 24px; }

  .caries-stages article {
    grid-template-columns:36px 108px minmax(0,1fr);
    gap:6px 8px;
    align-items:start;
    padding:12px 10px 14px;
    overflow:visible;
  }
  .caries-stages b {
    width:36px;
    height:36px;
    font-size:14px;
  }
  .caries-stages img {
    width:108px;
    height:112px;
    align-self:center;
    object-fit:contain;
    overflow:visible;
  }
  .caries-stages h4 {
    margin:2px 0 5px;
    font-size:14px;
    line-height:1.45 !important;
  }
  .treatment-page main .caries-stages p {
    font-size:12px;
    line-height:1.55;
  }
}

/* 診療案内 タブレット版：iPad縦・横の中間幅を安定させる */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .treatment-page { overflow-x:hidden; }
  .treatment-page .wrap { width:calc(100% - 48px); }
  .treatment-hero { min-height:280px; }
  .treatment-index { width:calc(100% - 48px); gap:12px; }

  .general-treatment,
  .periodontal-treatment,
  .child-treatment,
  .preventive-treatment,
  .prosthetic-treatment,
  .cosmetic-treatment,
  .total-care-treatment { padding-right:24px; padding-left:24px; }

  .general-overview,
  .perio-overview,
  .child-overview,
  .preventive-overview,
  .prosthetic-overview,
  .cosmetic-overview,
  .ceramic-overview,
  .total-care-overview { gap:34px; }

  .caries-stages { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
  .caries-stages article { min-height:430px; }
  .caries-stages article:not(:last-child)::after { display:none; }
  .anesthesia-cards article { height:330px; }
  .anesthesia-cards article > div { padding:22px 16px; }

  .perio-flow > div { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .perio-flow article:not(:last-child)::after { display:none; }
  .infection-note { grid-template-columns:70px minmax(0,1fr) 230px; padding:20px; }
  .laser-treatment { min-height:500px; }
  .laser-treatment > div { width:52%; padding:30px 24px; }
  .laser-treatment > img { width:44%; }
  .laser-benefits { width:92%; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .laser-benefits article { min-width:0; padding:12px; }

  .child-care > div { grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
  .child-promise { grid-template-columns:210px minmax(0,1fr); }
  .child-promise ul { grid-column:1 / -1; grid-template-columns:repeat(3,1fr); }
  .preventive-care article { min-height:340px; }
  .preventive-care article > div { padding:20px 16px; }

  .prosthetic-types > div,
  .ceramic-types > div,
  .total-care-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .total-care-cards article:last-child {
    width:calc(50% - 11px);
    grid-column:1 / -1;
    justify-self:center;
  }

  .whitening-types > div { grid-template-columns:1fr; gap:22px; }
  .whitening-card-head { grid-template-columns:240px minmax(0,1fr); }
  .veneer { grid-template-columns:220px minmax(0,1fr); }
  .veneer-points { grid-column:1 / -1; }
}

@media (min-width: 901px) and (max-width: 1100px) {
  .header { padding-left:20px; }
  .header > a:first-child img { width:190px; }
  .header nav { gap:14px; font-size:13px; }
  .header .phone { width:190px; }
  .header .phone b { font-size:18px; }
}

/* 全デバイス：行末に1文字だけ残りにくい日本語組版 */
.treatment-page main p,
.treatment-page main li { line-break:strict; text-wrap:pretty; }
.treatment-page main h1,
.treatment-page main h2,
.treatment-page main h3,
.treatment-page main h4 { text-wrap:balance; }

/* SP版：麻酔カードを予防歯科カードと同じ構成にする */
@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .perio-copy > h3 { text-align:center; }

  .anesthesia-cards { gap:20px; }
  .anesthesia-cards article {
    display:grid;
    height:auto;
    min-height:0;
    grid-template-columns:1fr;
    overflow:hidden;
    border-radius:11px;
    background:#fff;
    box-shadow:0 0 5px rgba(89,128,210,.34);
  }
  .anesthesia-cards img {
    display:block;
    width:100%;
    height:210px;
    margin:0;
    object-fit:cover;
  }
  .anesthesia-cards article:first-child img { object-position:center bottom; }
  .anesthesia-cards article:last-child img { object-position:right center; }
  .anesthesia-cards article > div {
    display:flex;
    padding:22px 18px 25px;
    flex-direction:column;
    justify-content:center;
  }
  .anesthesia-cards h4 {
    position:static;
    margin:0 0 15px;
    padding:0;
    color:#5685df;
    font-size:18px;
    font-weight:500;
    text-align:left;
  }
  .anesthesia-cards h4::after { content:none; }
  .anesthesia-cards p {
    margin:0;
    padding:0;
    font-size:14px;
    font-weight:400;
    line-height:1.9;
  }
}

/* 歯周病の感染症カード：SP参考デザイン */
@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .infection-note {
    display:grid;
    min-height:0;
    grid-template-columns:40px minmax(0,1fr);
    align-content:start;
    align-items:center;
    gap:14px 9px;
    margin-top:22px;
    padding:26px 43px 30px;
    overflow:hidden;
    border:1px solid #ff8d8d;
    border-radius:9px;
    background:#fdf7f7;
  }
  .infection-note::after {
    content:none;
    top:auto;
    right:9px;
    bottom:68px;
    color:#ff8f8f;
    font-size:50px;
    font-weight:500;
    line-height:1;
    transform:none;
    z-index:3;
  }
  .infection-note > div:nth-child(2) { display:contents; }
  .infection-icon {
    width:40px;
    height:40px;
    align-self:start;
    font-size:20px;
  }
  .infection-note h3 {
    grid-column:2;
    align-self:center;
    margin:0;
    font-size:18px;
    line-height:1.45;
    letter-spacing:.04em;
    white-space:nowrap;
  }
  .infection-note p {
    grid-column:1 / -1;
    margin:0;
    font-size:14px;
    line-height:1.9;
  }
  .infection-note .infection-family-pc { display:none; }
  .infection-note .infection-family-sp {
    position:static;
    z-index:auto;
    display:block;
    width:283px;
    max-width:100%;
    height:auto;
    grid-column:1 / -1;
    justify-self:center;
    margin:12px auto 0;
    object-fit:contain;
  }
}

/* 小児歯科：お子さまのペース SP参考デザイン */
@media (max-width: 767px), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .child-promise {
    display:grid;
    min-height:385px;
    grid-template-columns:100px minmax(0,1fr);
    align-items:start;
    gap:10px 12px;
    margin-top:40px;
    padding:22px 16px 28px;
    border-radius:9px;
    background:#fffdf7;
    text-align:left;
  }
  .child-promise > div { display:contents; }
  .child-promise > img {
    width:100px;
    height:105px;
    align-self:start;
    justify-self:center;
    margin:0;
    object-fit:contain;
  }
  .child-promise h3 {
    align-self:center;
    margin:0;
    padding:0 0 10px;
    border-bottom:3px dotted #5685df;
    color:#5685df;
    font-size:18px;
    font-weight:500;
    line-height:1.5;
    text-align:left;
  }
  .child-promise p {
    grid-column:1 / -1;
    margin:0;
    font-size:14px;
    line-height:1.55;
    text-align:left;
  }
  .child-promise ul {
    display:grid;
    width:100%;
    grid-column:1 / -1;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin:8px 0 0;
    padding:0;
  }
  .treatment-page main .child-promise li {
    width:100%;
    aspect-ratio:1;
    padding:6px;
    font-size:11px;
    line-height:1.45;
  }
}

/* 全ページ共通 SPフルスクリーンメニュー */
.sp-drawer { display:none; }

@media (max-width: 900px), (min-width: 901px) and (max-width: 1024px) and (orientation: portrait) {
  body.menu-open { overflow:hidden; }
  .sp-drawer {
    position:fixed;
    z-index:200;
    inset:0;
    display:none;
    overflow-y:auto;
    padding:62px 13px 32px;
    background:#56bae6;
    color:#fff;
  }
  .sp-drawer.open { display:block; }
  .sp-menu-close {
    position:fixed;
    top:12px;
    right:17px;
    width:38px;
    height:38px;
    padding:0;
    border:0;
    background:transparent;
    color:#fff;
    font:300 39px/1 sans-serif;
    cursor:pointer;
  }
  .sp-drawer-call {
    display:grid;
    min-height:94px;
    grid-template-columns:58px 184px;
    grid-template-rows:auto auto;
    gap:0;
    align-items:center;
    align-content:center;
    justify-content:center;
    padding:5px 14px 4px 18px;
    border-radius:10px;
    background:#fff;
    color:#371a11;
  }
  .sp-drawer-call > .sp-drawer-priority {
    display:flex;
    width:58px;
    height:58px;
    grid-row:1 / 3;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#56bae6;
    color:#fff;
    font-size:13px;
    font-weight:500;
    line-height:1.25;
    white-space:nowrap;
  }
  .sp-drawer-priority > span:last-child { font-size:9px; }
  .sp-drawer-call strong {
    display:flex;
    align-self:end;
    align-items:center;
    justify-content:center;
    gap:7px;
    color:#54b9e7;
    font-size:21px;
    font-weight:500;
    line-height:1.25;
    white-space:nowrap;
  }
  .sp-drawer-call small > span { display:block; }
  .sp-drawer-call small > span:last-child {
    font-size:9px;
    line-height:1.25;
  }
  .sp-drawer-call strong::before {
    content:"";
    display:block;
    width:23px;
    height:23px;
    flex:0 0 23px;
    background:currentColor;
    -webkit-mask:url("assets/icon-phone-handset.svg") center / contain no-repeat;
    mask:url("assets/icon-phone-handset.svg") center / contain no-repeat;
  }
  .sp-drawer-call small {
    align-self:start;
    color:#54b9e7;
    font-size:11px;
    line-height:1.4;
    text-align:center;
    white-space:normal;
  }
  .sp-drawer-nav { margin-top:28px; }
  .sp-drawer-nav > a,
  .sp-drawer-treatment {
    display:block;
    border-bottom:1px solid rgba(255,255,255,.75);
  }
  .sp-drawer-nav > a,
  .sp-drawer-treatment > a {
    display:flex;
    min-height:45px;
    align-items:center;
    gap:7px;
    color:#fff;
    font-size:16px;
    font-weight:400;
    line-height:1.5;
  }
  .sp-drawer-nav b {
    position:relative;
    display:block;
    width:15px;
    height:15px;
    flex:0 0 15px;
    border-radius:50%;
    background:#fff;
    color:transparent;
    font-size:0;
  }
  .sp-drawer-nav b::before { content:none; }
  .sp-drawer-nav b::after {
    content:"";
    position:absolute;
    top:50%;
    left:5px;
    width:4px;
    height:4px;
    border-top:1.5px solid #56bae6;
    border-right:1.5px solid #56bae6;
    transform:translateY(-50%) rotate(45deg);
  }
  .sp-drawer-treatment > div {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 12px;
    padding:0 28px 10px;
  }
  .sp-drawer-treatment > div a {
    min-height:30px;
    color:#fff;
    font-size:13px;
    line-height:1.5;
    white-space:nowrap;
  }
  .sp-drawer-nav > a:last-child {
    min-height:51px;
    font-size:14px;
  }
  .menu-open .sp-bottom-nav { display:none; }
}

/* WordPress版：中間幅のヘッダー配置を画面の向きに依存させない */
.header > .phone { flex-shrink: 0; }
.header > .phone > span { line-height:1.25; }
.access-call p > span { display:block; }
.header > .phone {
  position:relative;
}
.header > .phone b {
  display:flex;
  align-items:center;
  gap:6px;
}
.header > .phone b::before {
  content:"";
  display:block;
  width:22px;
  height:22px;
  flex:0 0 22px;
  background:currentColor;
  -webkit-mask:url("assets/icon-phone-handset.svg") center / contain no-repeat;
  mask:url("assets/icon-phone-handset.svg") center / contain no-repeat;
}
.header > .phone .header-reservation-priority {
  position:static;
  transform:none;
  display:inline-flex;
  margin-bottom:1px;
  padding:1px 8px;
  border:1px solid currentColor;
  border-radius:999px;
  background:#fff;
  color:#54c1f1;
  font-size:10px;
  font-weight:500;
  line-height:1.25;
  white-space:nowrap;
}
@media (max-width:767px), (min-width:768px) and (max-width:1024px) and (orientation:portrait) {
  .header > .phone {
    display:none;
  }
  .header .menu {
    margin-left:auto;
  }
  .header > .phone .header-reservation-priority {
    display:none;
  }
  .header > .phone b::before {
    background:#54c1f1;
  }
}
.access-schedule-wrap > p span { min-width:0; }
.tel-disabled { cursor:default; }
.footer-closed span { font-size:12px; }

@media (max-width:767px), (min-width:768px) and (max-width:1024px) and (orientation:portrait) {
  .footer-closed-note > span { display:block; }
  .footer-closed-note > span:last-child { white-space:nowrap; }
}

@media (min-width: 768px) and (max-width: 900px) {
  .header > .phone { display: none; }
  .header .menu {
    flex-shrink: 0;
    margin-left: auto;
    width: 46px;
    padding: 0;
    color: #54c1f1;
    font-size: 27px;
  }
}