@charset "UTF-8";
@import url("font.css");
 :root {
  --txt-main: #0F6EB1;
  --bg-main: #0F6EB1;
  --bg-wall-blue: #EFF5F9;
}
/* base */
/*===============================================================*/
body {
  font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Arial, Osaka, Sans-Serif;
  font-size: 16px;
  font-weight: 400;
  background: #fff;
  max-width: 750px;
  margin: 0 auto;
  color: #333;
}
img { max-width: 100%; }
.mt5 {margin-top: 5px;}
.mb5 {margin-bottom: 5px;}
.pt5 {padding-top: 5px;}
.pb5 {padding-bottom: 5px;}
.mt10 {margin-top: 10px;}
.mb10 {margin-bottom: 10px;}
.pt10 {padding-top: 10px;}
.pb10 {padding-bottom: 10px;}
.mt15 {margin-top: 15px;}
.mb15 {margin-bottom: 15px;}
.pt15 {padding-top: 15px;}
.pb15 {padding-bottom: 15px;}

.fs-80 { font-size: 80%; }
.fs-85 { font-size: 85%; }
.fs-90 { font-size: 90%; }
.fs-110 { font-size: 110%; }

/* 文字装飾 */
.txt-l {text-align: left;}
.txt-b {font-weight: 600;}
.yl { color: #ffe234; }
.red { color: #e00; }
.y_marker {
  background: linear-gradient(transparent 50%, #fff115 50%);
  padding: 0 2px;
}
/* 数字フォント */
.num-font-400 {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 400;
}
.num-font-600 {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 600;
}
.num-font-700 {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 700;
}
.num-font-800 {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 800;
}
/* 明朝体 */
.min-font {
  font-family:"Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}

/* header */
/*===============================================================*/
header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: .5em 0 .5em 1em;
  border-bottom: 1px solid #e8f4f8;
  background: #fff;
}
header img {
  width: min(35px, 6vw);
  height: min(35px, 6vw);
}
header .site-name {
  font-size: clamp(0.813rem, 0.54rem + 1.36vw, 1.563rem);
  font-weight: 700;
  color: #28B7D7;
  letter-spacing: 1.2px;
}

/* Container */
/*===============================================================*/
#container {
  max-width: 750px;
  margin: 0 auto;
  background: #EFF5F9;
}

.anchor-target {
  scroll-margin-top: 16px;
}

/* hero */
/*===============================================================*/
.hero-wrap {
  position: relative;
}
.hero-img {
  display: block;
  width: 100%;
  height: auto;
}
.hero-latest {
  position: absolute;
  z-index: 2;
  top: 7.2%;
  left: 1.1%;
  width: 13.5%;
  color: #fff;
  font-size: clamp(14px, 3.2vw, 24px);
  font-weight: 400;
  line-height: 1.35;
  text-align: center;
  white-space: nowrap;
  pointer-events: none;
}
.carousel-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  padding: 14px 0;
}
.carousel-track {
  display: flex;
  align-items: center;
  gap: 8px;
  width: max-content;
  animation: scroll-left 18s linear infinite;
}
.carousel-track:hover {
  animation-play-state: paused;
}
.carousel-track .logo-item {
  flex-shrink: 0;
  height: clamp(3.125rem, 2.443rem + 3.41vw, 5rem);
  display: flex;
  align-items: center;
  background: #fff;
  padding: .5em;
  box-shadow: 2px 4px 8px 0px rgba(0, 0, 0, 0.15);
}
.carousel-track .logo-item img {
  height: auto;
  width: clamp(4.375rem, 3.239rem + 5.68vw, 7.5rem);
  max-width: 200px;
  object-fit: contain;
}
@keyframes scroll-left {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); } /* 2セット分の半分 */
}

/* subheader ========== */
.subheader  {
  margin: 0 auto;
  padding-top: 1em;
  text-align: center;
}
.subheader img {
  width: 90%;
  margin: 0 auto;
}

/* 吹き出し型見出し ========== */
.fukidashi-head {
  line-height: 1.4;
  background: #0F6EB1;
  color: #fff;
  text-align: center;
  padding: 1em;
  position: relative;
  margin-bottom: 15px;
  border-radius: 10px 10px 0 0;
}
.fukidashi-head::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid var(--bg-main);
  z-index: 2;
}
.fukidashi-head p.sub {
  font-size: clamp(1.125rem, 0.898rem + 1.14vw, 1.75rem);
}
.fukidashi-head p.main {
  font-size: clamp(2.5rem, 2.159rem + 1.7vw, 3.438rem);
  font-weight: 600;
}
.fukidashi-head p.main span.str {
  color: #FFEC7D;
}
.fukidashi-head p.main span.sml {
  font-size: 90%;
}

/* 比較表(タブ) ========== */
.sec-hikaku-tab {
  margin: 0 auto;
  padding: 0 min(20px, 3vw);
  max-width: 700px;
}
/* tab */
.tab-content { display: none; }
.tab-content.active { display: table-row-group; }

.tab-list {
  display: flex;
  gap: 2px;
  justify-content: flex-end;
  margin-bottom: 0;
  margin-left: 10%;
}
.tab-btn {
  flex: 1;
  width: 30%;
  position: relative;
  background: #fff;
  color: var(--txt-main);
  font-size: clamp(0.938rem, 0.869rem + 0.34vw, 1.125rem);
  font-weight: 600;
  border: 1px solid var(--bg-wall-blue);
  padding: 8px;
  cursor: pointer;
  transition: background 0.2s;
  text-align: center;
}
.tab-btn.active {
  background: var(--bg-main);
  z-index: 3;
  color: #fff;
  box-shadow: 00px 4px 4px 0px rgba(0, 0, 0, 0.25);
  border:none;
}
.tab-btn.active::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid var(--bg-main);
  z-index: 2;
}

/* table */
.hikaku-table-wrap {
  background: #fff;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
  margin-top: 10px;
  margin-bottom: 5px;
}
table.hikaku {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--bg-wall-blue);
}
.sec-hikaku5 table.hikaku { /* 5社 */
  min-width: 700px;
}
/* 行ラベル列（左） */
table.hikaku td.row-label {
  width: 10%;
  background: #50A5E0;
  color: #fff;
  font-size: clamp(0.875rem, 0.83rem + 0.23vw, 1rem);
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
  padding: 5px 0;
  line-height: 1.2;
/*  writing-mode: vertical-rl;*/
  border: 1px solid var(--bg-wall-blue);
}
table.hikaku td.row-label div {
  writing-mode: vertical-rl;
  white-space: pre;
  text-align: center;
  margin: 0 auto;
}
table.hikaku td.row-label.fee {
  line-height: 1.1;
}
table.hikaku td.row-label.patient-total {
  line-height: 1.1;
}
table.hikaku td.row-label.patient-total-top {
  font-size: clamp(0.8125rem, 0.767rem + 0.23vw, 0.9375rem);
}
/* ブランド */
table.hikaku td.brand-cell {
  text-align: center;
  vertical-align: middle;
  padding: 10px 6px;
  line-height: 1em;
}
.sec-hikaku5 table.hikaku td.brand-cell { /* 5社 */
  padding: 3px 6px 6px;
}
table.hikaku td.brand-cell.rank1 {
  background: #fffde8;
}
.brand-img-wrap {
  position: relative;
  display: inline-block;
  width: 100%;
}
.brand-img-wrap img.brand-img {
  width: auto;
/*  height: 100%;*/
  object-fit: cover;
  display: block;
}
.brand-img-wrap .crown {
  position: absolute;
  top: -6px;
  left: -6px;
  width: 32px;
  height: auto;
  z-index: 2;
}
.sec-hikaku5 .brand-img-wrap .ico-crown { /* 5社 */
  width: 28px;
  height: auto;
}
.brand-name {
  display: inline-block;
  font-size: clamp(0.688rem, 0.642rem + 0.23vw, 0.813rem);
  font-weight: 700;
  color: #2e7fc0;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
/* cell */
table.hikaku td.data-cell {
  width: 30%;
  text-align: center;
  vertical-align: middle;
  padding: 10px 6px;
  font-size: clamp(0.813rem, 0.767rem + 0.23vw, 0.938rem);
  font-weight: 600;
  color: #0F6EB1;
  line-height: 1.2;
  border: 1px solid var(--bg-wall-blue);
}
.sec-hikaku5 table.hikaku td.row-label { /* 5社 */
  width: 7%;
}
.sec-hikaku5 table.hikaku td.data-cell { /* 5社 */
  width: 18.6%;
}
table.hikaku td.data-cell.rank1 {
  background: #fffde8;
  color: #FC3169;
  font-weight: 800;
}
table.hikaku .mark-img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  display: block;
  margin: 0 auto 4px;
}
table.hikaku .stars img {
  width: min(70%, 17vw);
}
table.hikaku .score {
  font-size: clamp(1.875rem, 1.534rem + 1.7vw, 2.813rem);
  font-weight: 800;
}
table.hikaku .score-unit {
  font-size: clamp(1.563rem, 1.449rem + 0.57vw, 1.875rem);
}
table.hikaku td.cost {
  font-size: clamp(0.563rem, 0.403rem + 0.8vw, 1rem);
}
.small-note {
  font-size: 80%;
}
/* hikaku-cta */
table.hikaku .cta-note {
  font-size: min(80%, 1.8vw);
  color: #FC3169;
  margin-bottom: 4px;
}
table.hikaku .cta-btn {
  display: block;
  background: #FC8822;
  color: #fff;
  font-size: clamp(0.625rem, 0.352rem + 1.36vw, 1.375rem);
  font-weight: 600;
  text-align: center;
  border-radius: 3px;
  padding: .8em 1em .8em 0;
  text-decoration: none;
  position: relative;
  box-shadow: 1px 1px 0.3px 0px rgba(252, 136, 34, 0.3);
  animation: dokidoki 1s ease-in-out infinite;
}
.sec-hikaku5 table.hikaku .cta-note { /* 5社 */
  font-size: min(55%, 1.8vw);
}
.sec-hikaku5 table.hikaku .cta-btn { /* 5社 */
  font-size: clamp(0.625rem, 0.489rem + 0.68vw, 1rem);
}
table.hikaku .cta-btn::after {
  content: "";
  width: 1em;
  aspect-ratio: 1;
  background: url(../images/icon-cta-arrow.webp) no-repeat center / contain;
  position: absolute;
  right: 0;
  top: 50%;
  translate: -.4em -50%;
}
/* att */
table.hikaku .att {
  vertical-align: baseline;
  position: absolute;
  font-size: 0.6em;
  color: #888;
  padding-left: 2px;
}
.att-text {
  font-size: 55%;
  color: #888;
  padding-bottom: 2em;
}

/* 矯正チェック ========== */
.sec-article {
  background: #fff;
}

/* リスク ========== */
.risk-section {
  margin: 0 auto;
}
.risk-section-image {
  display: block;
  width: 100%;
  height: auto;
}
.risk-top {
  background-image: linear-gradient(0deg, rgba(61, 149, 211, 1), rgba(15, 110, 177, 1));
  padding: 28px 16px 0;
  position: relative;
}
.risk-heading {
  text-align: center;
  margin-bottom: 18px;
  font-family:"Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}
.risk-heading .small-line {
  font-size: clamp(1.25rem, 1.114rem + 0.68vw, 1.625rem);
  color: #fff;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-bottom: 6px;
}
.risk-heading .small-line img {
  width: 35px;
  height: auto;
}
.risk-heading .main-line {
  font-size: clamp(1.375rem, 1.08rem + 1.48vw, 2.188rem);
  font-weight: 600;
  color: #fff;
  line-height: 1.3;
}
/* 2×2グリッド */
.risk-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 0;
}
.risk-card {
  background-image: linear-gradient(0deg, rgba(239, 244, 248, 1), rgba(255, 255, 255, 1));
  border-radius: 3px;
  padding: 14px 12px 14px;
  position: relative;
  overflow: hidden;
  min-height: 160px;
  box-shadow: 2px 4px 8px 0px rgba(0, 0, 0, 0.25);
}
.risk-card-title {
  font-size: clamp(1.313rem, 1.131rem + 0.91vw, 1.813rem);
  font-weight: 600;
  color: #111;
  line-height: 1.3;
  margin-bottom: 8px;
  position: relative;
  z-index: 2;
  -webkit-text-stroke: 0.7px currentColor;
}
.risk-card-desc {
  font-size: clamp(0.575rem, 0.443rem + 0.66vw, 0.938rem);
  font-weight: 600;
  line-height: 1.6;
  position: relative;
  z-index: 2;
}
.risk-card-desc span.str {
  color: #0F6EB1;
}
.risk-card-img {
  position: absolute;
  right: -10px;
  bottom: -6px;
  width: auto;
  height: 100%;
  opacity: 1;
  z-index: 1;
}
@media (max-width: 767px) {
  .risk-card {
    background-image: linear-gradient(0deg, rgba(245, 248, 250, 1), rgba(255, 255, 255, 1));
  }
  .risk-card-img {
    width: auto;
    height: 80%;
  }
}
.wave-divider {
  width: 100%;
  overflow: hidden;
  line-height: 0;
  margin-top: 0;
}
.wave-divider svg {
  display: block;
  width: 100%;
}
.risk-mid-text {
  background-image: linear-gradient(0deg, rgba(80, 165, 224, 1), rgba(61, 149, 211, 1));
  text-align: center;
  color: #fff;
  font-size: clamp(1rem, 0.795rem + 1.02vw, 1.563rem);
  font-weight: normal;
  line-height: 1.3;
  padding: 1em 0 0px;
  margin-top: -1px;
}
.healthy-box {
  margin: -24px 0px 1em;
  padding: 24px 0px 1em;
  text-align: center;
  position: relative;
  z-index: 2;
}
.healthy-box img {
  width: 70%;
  max-width: 170px;
  height: auto;
  margin-bottom: 0;
}
.healthy-box .healthy-text {
  font-size: clamp(1rem, 0.795rem + 1.02vw, 1.563rem);
  font-weight: 800;
  color: #0F6EB1;
  line-height: 1.5;
}
.healthy-box .healthy-text span {
  border-bottom: dotted 2px #50A5E0;
}
/* マウスピース矯正orワイヤー矯正 ========== */
.select-section {
  position: relative;
  background: #EFF5F9;
  background-image: url(../images/bk-img-select.webp);
  background-repeat:  no-repeat;
  background-position: right top;
  background-size: cover;
}
.figma-section-image {
  display: block;
  width: 100%;
  height: auto;
}

/* Before After ========== */
.ba-section {
  margin: 0 auto;
  padding: 28px 16px 0;
}
.ba-heading {
  text-align: center;
  margin-bottom: 1em;
  line-height: 1.2
}
.ba-heading .en {
  font-size: clamp(1.125rem, 0.898rem + 1.14vw, 1.75rem);
  font-weight: 600;
  color: #50A5E0;
  letter-spacing: 0.04em;
  display: block;
}
.ba-heading .ja {
  font-size: clamp(1.625rem, 1.193rem + 2.16vw, 2.813rem);
  font-weight: 600;
  color: #0F6EB1;
}
/* タブ */
.ba-tabs {
  display: flex;
  overflow: hidden;
  margin-bottom: 0;
}
.ba-tab-btn {
  flex: 1;
  padding: .3em;
  font-size: clamp(1rem, 0.955rem + 0.23vw, 1.125rem);
  background: #fff;
  border-left: solid 1px #0F6EB1;
  border-right: solid 1px #0F6EB1;
  border-top: solid 1px #0F6EB1;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  text-align: center;
  margin-left: 5px;
  margin-right: 5px;
}
.ba-tab-btn.active {
  background-image: linear-gradient(90deg, rgba(15, 110, 177, 1), rgba(80, 165, 224, 1));
  color: #fff;
  border: solid 1px #fff;
  box-shadow: 0px 0px 0px 2px #0F6EB1;
  margin-top: 2px;
  margin-bottom: 2px;
}
/* コンテンツエリア */
.ba-content-wrap {
  background: #EFF5F9;
  padding: 1em;
  
}
.ba-content {
  display: none;
}
.ba-content.active {
  display: block;
}
/* Before/After 画像 */
.ba-photos {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
}
.ba-photo-wrap {
  flex: 1;
}
.ba-label-before {
  font-size: 20px;
  font-weight: 600;
  color: #0F6EB1;
  margin-bottom: 6px;
  text-align: center;
}
.ba-label-after {
  font-size: 20px;
  font-weight: 600;
  color: #FC3169;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 4px;
  justify-content: center;
}
.ba-label-after .sparkle {
  max-width: 1em;
}
.ba-photo-wrap img.photo {
  width: 100%;
  height: auto;
  border-radius: 3px;
  display: block;
  box-shadow: 2px 4px 8px 0px rgba(0, 0, 0, 0.25);
}
.ba-arrow {
  flex-shrink: 0;
  font-size: 22px;
  color: #fff;
  padding-top: 1.3em;
}
.ba-stats {
  background-image: url('../images/bk-hougan.webp');
  background-size: cover;
  background-position: center;
  padding: .8em;
  display: flex;
  gap: 10px;
  justify-content: center;
  align-items: center;
  margin-bottom: 1em;
}
.ba-stat {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ba-stat-label {
  background: #0F6EB1;
  color: #fff;
  font-size: clamp(0.688rem, 0.574rem + 0.57vw, 1rem);
  padding: .5em;
  white-space: nowrap;
}
.ba-stat-value {
  font-size: clamp(1.125rem, 1.08rem + 0.23vw, 1.25rem);
}
.ba-stat-value small {
  font-size: 12px;
  font-weight: 400;
}
.ba-att {
  font-size: 55%;
  line-height: 1.3;
}
/* コンテンツ下 */
.ba-text-box {
  margin: 1em 0 0;
  text-align: center;
}
.ba-text-box img {
  max-width: 80%;
  margin: 0 auto;
}
.ba-text-box .frame-14-image {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
}
.ba-text-box p.sub {
  font-size: clamp(1rem, 0.841rem + 0.8vw, 1.438rem);
}
.ba-text-box p.main span.str {
  font-size: clamp(1.75rem, 1.341rem + 2.05vw, 2.875rem);
  font-weight: 800;
  color: #FC3169;
}
.ba-text-box p.main {
  font-size: clamp(1.5rem, 1.227rem + 1.36vw, 2.25rem);
  font-weight: 600;
}
/* 効果に満足 ========== */
.manzoku-section {
  margin: 0 auto;
  padding: 0;
  background: #EFF5F9;
}
.manzoku-composite-image {
  display: block;
  width: 100%;
  height: auto;
}
.manzoku-visual {
  width: 100%;
}
.manzoku-summary {
  width: 100%;
  aspect-ratio: 1152 / 1230;
  overflow: hidden;
}
.manzoku-summary img {
  display: block;
  width: 100%;
  height: auto;
}
.manzoku-frame92 {
  display: block;
  width: 100%;
  height: auto;
}
.manzoku-att {
  font-size: 55%;
  line-height: 1.3;
  padding: 0 1em 1em;
}
.manzoku-text-box {
  margin: 1em 0 0;
  text-align: center;
}
.doctor-callout-image {
  display: block;
  width: min(90%, 640px);
  height: auto;
  margin: 0 auto;
}
.manzoku-text-box p.sub {
  font-size: clamp(1rem, 0.841rem + 0.8vw, 1.438rem);
  margin-bottom: 1em;
}
.manzoku-text-box p.main span.str {
  font-size: clamp(1.5rem, 1.273rem + 1.14vw, 2.125rem);
  font-weight: 600;
  color: #FC3169;
}
.manzoku-text-box p.main {
  font-size: clamp(1.375rem, 1.148rem + 1.14vw, 2rem);
  font-weight: 600;
  color: #0F6EB1;
}
/* 3つのポイント */
.point-card {
  width: min(90%, 640px);
  margin: 1em auto;
}
.point-card-image {
  display: block;
  width: 100%;
  height: auto;
}
.point-head {
  background: #0F6EB1;
  padding: 16px 20px;
  text-align: center;
}
.point-head h2 {
  font-size: clamp(1.25rem, 0.977rem + 1.36vw, 2rem);
  font-weight: 600;
  color: #fff;
  letter-spacing: 0.04em;
}
.point-body {
  background-image: url('../images/bk-hougan.webp');
  background-size: cover;
  background-position: center;
  padding: 1.5em;
  width: 100%;
}
.point-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: min(90%, 400px);
  margin: 0 auto;
  transform: translateX(-20px);
}
.point-item {
  display: flex;
  align-items: center;
  gap: 16px;
}
.point-icon {
  flex-shrink: 0;
  width: 3.15em;
  height: auto;
}
.point-text {
  font-size: clamp(1.25rem, 0.977rem + 1.36vw, 2rem);
  font-weight: 600;
  color: #0F6EB1;
}
/* 失敗しない選び方 ========== */
.choose-section {
  margin: 0 auto;
  padding: .5em;
  background: #50A5E0;
  text-align: center;
}
.choose-head img {
  margin: 0 auto;
  padding: 0;
  width: min(600px, 80%);
}
/* スライド */
.slider-wrap{
  max-width: 700px;
  margin:0 auto;
  position:relative;
}
.slider-outer{
  padding:10px 0;
  position:relative;
  overflow:hidden;
}
.viewport{
  overflow:hidden;
  position:relative;
  padding:0 8px;
}
.track{
  display:flex;
  align-items:stretch;
  will-change:transform;
  transition:transform .45s cubic-bezier(.65,0,.35,1);
}
.slide{
  flex:0 0 auto;
  width:88%;
  /* margin:0 2%; */
  background:#fff;
  padding:.75em 1em;
  display:flex;
  flex-direction:column;
  opacity:.4;
  transform:scale(.94);
  transition:opacity .45s ease, transform .45s ease;
  box-shadow: 2px 4px 8px rgba(0,0,0,0.25);
  border-radius: 3px;
}
.slide.is-active{
  opacity:1;
  transform:scale(1);
}
.point-badge{
  display:flex;
  align-items:center;
  gap:8px;
  justify-content:flex-start;
}
.tooth-icon{
  width:42px;
  height:auto;
  flex:0 0 auto;
  display:block;
}
.point-title{
  font-size: clamp(1.5rem, 1.273rem + 1.14vw, 2.125rem);
  font-weight:600;
  color: #0F6EB1;
  line-height:1.3;
  white-space:nowrap;
}
@media (max-width: 600px) {
  .point-title {
    font-size: 17px;
    letter-spacing: 0;
  }
}
.illust{
  margin: .55em;
  display:flex;
  align-items:center;
  justify-content:center;
}
.illust img{
  width:min(64%, 360px);
  height:auto;
  object-fit:contain;
}
.checks{
  margin-bottom:8px;
}
.check-item{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-weight:600;
  font-size: clamp(1rem, 0.909rem + 0.45vw, 1.25rem);
  margin-bottom:6px;
  line-height:1.4;
  text-align: left;
}
.check-item .mark{
  flex:0 0 auto;
  width:22px;
  height:22px;
  margin-top:2px;
  display:block;
}
.desc{
  font-size:15px;
  line-height:1.5;
  text-align: left;
}
.desc .str{
  color: #0F6EB1;
  font-weight:800;
}
.nav-btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:44px;
  height:44px;
  padding:0;
  border:none;
  background:transparent;
  cursor:pointer;
  z-index:5;
  transition:transform .2s;
}
.nav-btn:hover{transform:translateY(-50%) scale(1.08);}
.nav-btn.prev{left:4%;}
.nav-btn.next{right:2%;}
@media (max-width:600px){
  .nav-btn.prev{left:3%;}
  .nav-btn.next{right:0;}
}
.nav-btn img{width:100%;height:100%;display:block;}
/* dot
.dots{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:18px;
}
.dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#c8dcea;
  cursor:pointer;
  transition:background .2s, transform .2s;
}
.dot.is-active{
  background:#4fa3d9;
  transform:scale(1.2);
}
*/

/* 15社散布図 ========== */
.sanpu-section {
  margin: 0 auto;
  background: #EFF5F9;
  padding-bottom: 10px;
}
.sanpu-img {
  padding: 0 min(20px, 3vw);
}

/* 比較表(5社) ========== */
.sec-hikaku5 {
  margin: 0 auto;
  background: #EFF5F9;
  padding: 0 min(20px, 3vw);
}
.figma-hikaku5-heading {
  display: block;
  width: 100%;
  height: auto;
  margin-top: 15px;
  margin-bottom: 15px;
}
/* サイト詳細 ===== */
.sec-site {
  background: #EFF5F9;
  padding: 0 min(20px, 3vw);
}
.site-card {
  background: #fff;
  overflow: hidden;
  margin-bottom: 20px;
  border-radius: 5px;
}
.site-card.rank1 {
  box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.25);
}
.site-card-header {
  display: flex;
  align-items: center;
  padding: 10px;
  gap: 10px;
  background: linear-gradient(90deg, #0F6EB1, #50A5E0);
}
.site-card-header .crown {
  width: clamp(2.75rem, 2.614rem + 0.68vw, 3.125rem);
  height: auto;
  flex-shrink: 0;
  padding-bottom: 5px;
}
.site-card-header .site-name {
  min-width: 0;
  font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  font-size: clamp(1rem, 5vw, 2.313rem);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  white-space: nowrap;
  color: #fff;
  flex: 1;
}
.site-card-header .site-name_s {
  font-size: clamp(0.875rem, 0.768rem + 1.81vw, 2.125rem);
  color: #222;
  flex: 1;
}
.site-card-header .score {
  font-size: 13px;
  color: #fff;
  line-height: 1.2;
  width: 25%;
}
.site-card-header .score img {
  width: 100%;
}
.site-card-body {
  padding: 14px 16px;
  background: #F5FBFF;
  border: 2px solid #50A5E0;
  border-top: none;
}
.site-card.rank1 .site-card-body {
  background: #CAE7FF;
}
.site-card-desc {
  font-size: clamp(0.938rem, 0.884rem + 0.9vw, 1.563rem);
  font-weight: 600;
  line-height: 1.5;
  color: #222;
  margin-bottom: 14px;
}
.site-card-img {
  width: 100%;
  overflow: hidden;
  line-height: 0;
}
.site-card-img img {
  width: 100%;
  height: auto;
  display: block;
}
/* アイコン付きタイトル */
.box-title {
  color: #0F6EB1;
  font-size: clamp(1.25rem, 1.218rem + 0.54vw, 1.625rem);
  font-weight: 600;
  text-align: center;
  padding: 1.2vw 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.box-title img {
  width: clamp(1.875rem, 1.42rem + 2.27vw, 3.125rem);
  height: auto;
}
/* おすすめポイント */
.recommend-box {
  margin: 14px 0;
  overflow: hidden;
}
.recommend-list {
  padding: 10px 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.recommend-item {
  display: flex;
  align-items: center;
  gap: .3em;
  font-size: clamp(1rem, 0.979rem + 0.36vw, 1.25rem);
  line-height: .8;
  color: #222;
  background-image: url('../images/bk-hougan.webp');
  background-size: cover;
  background-repeat: repeat;
  position: relative;
  padding: .8em .5em;
  width: 100%;
}
.recommend-item img {
  width: 44px;
  height: auto;
  flex-shrink: 0;
  margin-top: min(5px, 1.4vw);
  mix-blend-mode: multiply;
}
.recommend-item span.main {
  display:block;
  font-size: 18px;
  color: #0F6EB1;
  font-weight: 600;
  padding-bottom: 3px;
  line-height: 1.3;
}
.recommend-item span.main .str {
  color: #FC3169;
  font-weight: 600;
}
.recommend-item span.sub {
  font-size: 10px;
  color: #A3A3A3;
}

/* クリニック詳細テーブル */
.site-detail-wrap{
  margin: 0 auto;
}
.ip-tabs{
  display:flex;
  gap: 14px;
}
.ip-tab{
  flex:1;
  border:none;
  cursor:pointer;
  font-size: clamp(15px, 2vw, 18px);
  font-family:inherit;
  height: 2.6em;
  display:flex;
  align-items:center;
  justify-content:center;
  background: #7CBBE8;
  color: #fff;
  border-radius: 5px 5px 0 0;
  font-weight: 400;
}
.ip-tab.is-active{
  background: #fff;
  color: #0F6EB1;
  border-top: 5px solid #7CBBE8;
}
.ip-tab:focus-visible{
  outline: 2px solid #2F6B9C;
  outline-offset: -3px;
}
.ip-panel{
  background-color:#fff;
  background-image: url('../images/bk-hougan.webp');
  background-size: cover;
  background-repeat: repeat;
  border-radius: 0 0 3px 3px;
  overflow:hidden;
  box-shadow: 0 6px 18px rgba(47,107,156,0.12);
}
.ip-content{ padding: 6px 0 10px; }
.ip-content[hidden]{ display:none; }
.ip-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
}
.ip-cell{
  padding: .5em;
  text-align:center;
}
.ip-label{
  display:inline-block;
  margin: 0 0 .5em;
  padding-bottom: 2px;
  font-size: clamp(13px, 1.8vw, 15px);
  font-weight: 400;
  color: #0F6EB1;
  border-bottom: 1px solid #0F6EB1;
  width: 100%;
}
.ip-note-top{
  margin: 0 0 2px;
  font-size: clamp(11px, 1.5vw, 13px);
  white-space: nowrap;
}
.ip-value{
  margin: 0;
  line-height:1;
  white-space: nowrap;
}
.ip-value-prefix,
.ip-value-label-inline{
  font-size: clamp(10px, 1.6vw, 14px);
  margin-right: 2px;
}
.ip-value-big{
  font-size: clamp(18px, 6vw, 29px);
  font-weight:400;
  letter-spacing: -0.05em;
}
.ip-value-unit{
  font-size: clamp(14px, 2vw, 18px);
  margin-left: 2px;
  font-weight:400;
}
.ip-value-unit-marked{
  position: relative;
}
.ip-marker{
  position: absolute;
  left: 0.5em;
  top: -0.95em;
  transform: translateX(-50%);
  color: #a3a3a3;
  font-size: clamp(6px, 1vw, 9px);
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
}
.ip-marker-over-wave{
  right: 0;
  left: auto;
  transform: translateX(30%);
}
.ip-value.full .ip-value-prefix,
.ip-value-label-inline {
  font-size: clamp(8px, 1.4vw, 12px);
}
.ip-value.full .ip-value-big{
  font-size: clamp(12px, 3.5vw, 18px);
}
.ip-value.full.plan-value-large .ip-value-big{
  font-size: clamp(18px, 5vw, 26px);
  letter-spacing: -0.06em;
}
.ip-value.full .ip-value-unit{
  font-size: clamp(10px, 1.7vw, 16px);
}
.ip-note{
  margin: 6px 0 0;
  font-size: clamp(10px, 1.4vw, 12px);
  color: #999999;
  line-height:1.5;
}
.ip-att {
  padding: .5em 1em;
  font-size: 50%;
  line-height: 1.3;
  color: #999;
}

.ip-label-long {
  white-space: nowrap;
}

@media (max-width: 520px){
  .ip-value {
    white-space: nowrap;
  }
  .ip-note-top {
    font-size: clamp(8px, 2.4vw, 11px);
    letter-spacing: -0.04em;
  }
  .ip-label-long {
    font-size: clamp(8px, 2.3vw, 12px);
    letter-spacing: -0.06em;
  }
}

/* 症例 */
.case-box {
  margin: 14px 0;
}
.case-wrap {
  margin: 0 auto;
}
.case-tabs {
  display: flex;
  gap: 4px;
}
.case-tab {
  position:relative;
  flex:1;
  height: 2.5em;
  border: none;
  cursor: pointer;
  font-size: clamp(13px, 3.6vw, 16px);
  font-weight:400;
  font-family:inherit;
  color:#fff;
  background-image: linear-gradient(90deg, rgba(15, 110, 177, 1), rgba(80, 165, 224, 1));
  text-align: center;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
}
.case-tab.is-active{
  background: #fff;
  color: #333;
  z-index: 2;
}
.case-tab.is-active::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: -8px;
  transform: translateX(-50%);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 9px solid #fff;
}
.case-tab:focus-visible{
  outline: 2px solid #336DAD;
  outline-offset: -3px;
}
.case-panel{
  padding: 22px 16px 20px;
  border-radius: 0 0 5px 5px;
  position: relative;
  background-image: url('../images/bk-hougan.webp');
  background-size: cover;
  background-repeat: repeat;
  margin-top: 12px;
}
.case-info{
  display:flex;
  border: 1px solid #0F6EB1;
  overflow: hidden;
  margin-bottom: 1em;
}
.case-info-item {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 6px;
  font-size: clamp(13px, 3.6vw, 15px);
  font-weight: 400;
}
.case-info-item + .case-info-item {
  border-left: 1.5px solid #7C99B8;
}
.case-info-label {
  background: #0F6EB1;
  color:#fff;
  font-size: clamp(11px, 3vw, 13px);
  font-weight:400;
  padding: 2px 4px;
  white-space:nowrap;
}
.case-info-value{ white-space:nowrap; }
.case-info-value small{
  font-size: 0.6em;
  font-weight:400;
  margin-left: 2px;
}
.case-heading {
  text-align:center;
  font-size: clamp(1.375rem, 0.898rem + 2.39vw, 2.688rem);
  font-weight:600;
  margin: 0 0 5px;
  letter-spacing: 0.02em;
}
.case-heading-before{ color: #0F6EB1; }
.case-heading-after{ color: #FC3169; margin-top:4px; }
.case-photo{
  display:block;
  width: 100%;
  max-width: 500px;
  height:auto;
  border-radius: 3px;
  border: 1px solid #E3E3E3;
  opacity: 1;
  transition: opacity .25s ease;
  margin: 0 auto;
}
.case-photo.is-fading{ opacity: 0; }
.case-arrow{
  display: block;
  width: 30%;
  max-width: 140px;
  height: auto;
  margin: 10px auto 0;
}
.case-disclaimer{
  margin-top: 1em;
  font-size: clamp(9px, 2.6vw, 11px);
  line-height: 1.3;
  color: #999;
}

/* 対応している歯並び */
.issue-box{
  margin: 14px 0;
}
.issue-section{
  padding: 32px 16px 40px;
}
.issue-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px 15px;
  margin: 1em auto 0;
}
.issue-item{
  text-align:center;
}
.issue-circle{
  width: 100%;
  max-width: 180px;
  aspect-ratio: 1 / 1;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.issue-circle img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* 口コミ */
.review-box {
  padding: 14px 0 16px;
}
.review-accordion {
  overflow: hidden;
  margin-top: 1em;
  margin-bottom: 8px;
  border-radius: 5px;
}
.review-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  cursor: pointer;
  background: #fff;
  user-select: none;
}
.review-trigger .rev-icon {
  width: clamp(44px, 10vw, 60px);
  height: clamp(44px, 10vw, 60px);
  border-radius: 50%;
  flex-shrink: 0;
  overflow: hidden;
  background: #e8eef8;
}
.review-trigger .rev-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.review-trigger .rev-title {
  flex: 1;
  font-size: clamp(0.75rem, 0.707rem + 0.72vw, 1.25rem);
  font-weight: 400;
  color: #0F6EB1;
}
.review-trigger .rev-chevron {
  color: #0F6EB1;
  font-size: clamp(16px, 3.5vw, 20px);
  flex-shrink: 0;
  transition: transform 0.3s;
}
.review-accordion.open .rev-chevron {
  transform: rotate(180deg);
}
.review-body {
  display: none;
  background: #fff;
  padding: 12px 14px;
}
.review-accordion.open .review-body {
  display: block;
}
.review-body p {
  font-size: clamp(0.813rem, 0.791rem + 0.36vw, 1.063rem);
  line-height: 1.7;
  color: #5D5D5D;
}
.arrow_box {
	position: relative;
	background: #f5f5f5;
	border: none;
  border-radius: 10px;
  padding: 1em;
}
.arrow_box:after, .arrow_box:before {
	bottom: 100%;
	left: 5%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
@media screen and (max-width: 480px) {
  .arrow_box:after, .arrow_box:before {
    left: 10%;
  }
}
.arrow_box:after {
	border-color: rgba(245, 245, 245, 0);
	border-bottom-color: #f5f5f5;
	border-width: 8px;
	margin-left: -8px;
}
.arrow_box:before {
	border-color: rgba(245, 245, 245, 0);
	border-bottom-color: #f5f5f5;
	border-width: 14px;
	margin-left: -14px;
}
.review-text {
  text-align: right;
  width: 100%;
  margin-right:1em;
  font-size: clamp(0.625rem, 0.58rem + 0.23vw, 0.75rem);
  line-height: 1.3;
  color: #888;
}

/* エリア */
.area-box {
  padding: 14px 0 16px;
}
#accordion-root { margin-top: 10px; }
.region-wrap{  margin-bottom: 6px; }
.region-btn{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: clamp(0.438rem, 0.324rem + 0.57vw, 0.75rem) 10px;
  border: none;
  cursor: pointer;
  text-align: left;
  border-bottom: 1px solid #A3A3A3;
}
.region-btn span{
  font-size: clamp(0.938rem, 0.869rem + 0.34vw, 1.125rem);
  font-weight: 600;
  color: #0073a3;
}
.region-btn .count{
  font-weight: 400;
  font-size: 14px;
  margin-left: 4px;
}
.icon-circle{
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #1a5f8a;
  font-size: 18px;
  line-height: 1;
}
.region-body{
  border-top: none;
  padding: 10px 10px;
}
.pref-wrap{
  margin-bottom: 8px;
  background: #fff;
  overflow: hidden;
  border-radius: 5px;
}
.pref-btn{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: clamp(0.438rem, 0.324rem + 0.57vw, 0.75rem) 10px;
  background: #fff;
  border: none;
  cursor: pointer;
  text-align: left;
}
.pref-btn span{
  font-size: clamp(0.938rem, 0.869rem + 0.34vw, 1.125rem);
  font-weight: 600;
  color: #1a5f8a;
}
.pref-btn .count{
  font-weight: 400;
  font-size: 13px;
  margin-left: 4px;
}
.pref-body{
  margin: 0 .5em;
  border-top: 1px solid #A3A3A3;
}
/* エリア修正版 */
.clinic-card{
  padding-top: 1em;
  padding-bottom: 1em;
}
.clinic-card:nth-child(n+2) {
  border-top: 1px solid #A3A3A3;
}
.clinic-top{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  margin-bottom: .5em;
}
.clinic-photo{
  width: 48%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 6px;
  flex-shrink: 0;
}
.clinic-photo-placeholder{
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f1f5f7;
  color: #6b7479;
  font-size: 13px;
}
.clinic-name{
  font-weight: 600;
  font-size: clamp(14px, 3.5vw, 17px);
  line-height: 1.55;
  margin: 4px 0 0;
}
.clinic-access{
  display:flex;
  align-items:center;
  gap: 8px;
  margin-bottom: 18px;
  font-weight: 600;
  font-size: clamp(13px, 3.6vw, 15px);
}
.clinic-access img{
  width: 18px;
  height: auto;
  flex-shrink: 0;
}
.clinic-cta{
  display:block;
  text-align:center;
  background: #FF9933;
  color:#fff;
  font-weight: 600;
  font-size: clamp(13px, 4vw, 21px);
  padding: 10px 12px;
  border-radius: 999px;
  text-decoration:none;
  transition: opacity .15s ease;
  width: min(80%, 400px);
  margin: 0 auto;
}
.clinic-cta:hover{ opacity: .9; }

/*cta*/
#accordion-root .cta-button {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#accordion-root .cta-button .button {
  width: 99.5%;
  aspect-ratio: 1/.20;
  border-radius: 100vmax;
  background: linear-gradient(#00952D, #07CB00);
  display: grid;
  place-content: center;
  place-items: center;
  font-size: min(25px, calc(100vw/24));
  line-height: calc(21/14);
  animation: dokidoki 1s ease-in-out infinite;
  padding-top: 0;
  margin-top: 0;
}
#accordion-root .cta-button .button .ylw {
  color: #FCFF00;
  font-size: min(19px, 3vw);
  letter-spacing: .05em;
  font-weight: 600;
}
#accordion-root .cta-button .button .main {
  font-size: min(38px, calc(100vw/23));
  color: #fff;
  letter-spacing: .025em;
  font-weight: 600;
}
#accordion-root .cta-button .button::before {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  translate: -40% -50%;
  width: 1.25em;
  aspect-ratio: 1;
  background: url("../imgs/line-arrow.svg") no-repeat center/contain;
}

/* 詳細テキスト */
.site-desc-box {
  padding: 14px 0 16px;
}
.site-desc-box p {
  font-size: clamp(14px, 4.5vw, 22px);
  color: #0F6EB1;
  text-align: center;
  font-weight: 600;
}
.site-desc-box p span.str {
  color: #FC3169;
}
.site-desc-box figure {
  margin: 1em auto;
}
.site-desc-box .att {
  padding: .5em 1em;
  font-size: 50%;
  line-height: 1.3;
  color: #0F6EB1;
  text-align: left;
}
/* CTAボタン（吹き出し付き） */
.cta-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 1em;
  position: relative;
}
.cta-wrap .cta-balloon {
  width: min(75%, 20em);
  text-align: center;
  background: #fff;
  border: 2px solid #FC8822;
  border-radius: 100vmax;
  color: #FC8822;
  font-weight: 600;
  font-size: clamp(0.563rem, 0.477rem + 1.45vw, 1.563rem);
  height: 2.5em;
  display: grid;
  place-content: center;
  z-index: 1;
  padding-bottom: 3px;
  position: relative;
}
.cta-wrap .cta-balloon.long{
  width: min(85%, 25em);
  font-size: clamp(0.563rem, 0.477rem + 1.45vw, 1.563rem);
}
.cta-wrap .cta-balloon::before, .cta-wrap .cta-balloon::after {
  content: "";
  width: min(15px, 8vw);
  aspect-ratio: 1/.65;
  clip-path: polygon(0 0, 44% 100%, 100% 0);
  position: absolute;
  left: 50%;
  translate: -50% 100%;
}
.cta-wrap .cta-balloon::before {
  background: #FC8822;
  bottom: 0;
}
.cta-wrap .cta-balloon::after {
  background: #fff;
  bottom: 4px;
}
.cta-wrap .cta-btn {
  width: 95%;
  aspect-ratio: 1/.19;
  border-radius: 5px;
  background: #FC8822;
  display: grid;
  place-content: center;
  place-items: center;
  font-size: min(25px, calc(100vw/24));
  line-height: calc(21/14);
 /* padding-top: .5em;*/
  margin-top: -.5em;
  animation: dokidoki 1s ease-in-out infinite;
  box-shadow: 5px 4px 7px -2px rgba(0, 0, 0, 0.4);
}
.cta-wrap .cta-btn .cta-sub-text {
  color: #FCFF00;
  font-size: clamp(0.688rem, 0.602rem + 1.45vw, 1.688rem);
  letter-spacing: .05em;
  font-weight: 400;
}
.cta-wrap .cta-btn .cta-sub-text_s {
  color: #FCFF00;
  font-size: clamp(0.688rem, 0.655rem + 0.54vw, 1.063rem);
  letter-spacing: 0;
  font-weight: 400;
}
.cta-wrap .cta-btn .cta-sub-text_s small{
  font-size: 0.7em;
}
.cta-wrap .cta-btn .cta-main-text {
  font-size: min(40px, calc(100vw/20));
  color: #fff;
  letter-spacing: .025em;
  font-weight: 600;
  padding-right: 10px;
}
.cta-wrap .cta-btn::before {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  translate: -30% -50%;
  width: 1.25em;
  aspect-ratio: 1;
  background: url("../images/icon-cta-arrow.webp") no-repeat center/contain;
}
a.cta-link {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}

/* 他のクリニックを見る ========== */
.show-more-section{
  padding: 28px 16px;
}
.show-more-btn{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  max-width: 700px;
  margin: 0 auto;
  background:#fff;
  border:none;
  padding: 20px 24px;
  font-family: inherit;
  font-size: clamp(16px, 4vw, 20px);
  font-weight: 600;
  color: #0F6EB1;
  cursor:pointer;
  box-shadow: 0 2px 10px rgba(30,60,100,0.07);
}
.show-more-btn:hover{ opacity:.9; }
.show-more-btn:focus-visible{ outline:2px solid #0F6EB1; outline-offset:2px; }
.show-more-chevron{
  flex-shrink:0;
  margin-left: 12px;
  color: #0F6EB1;
}
.more-clinics{
  max-width: 780px;
  margin: 20px auto 0;
  opacity: 1;
  transition: opacity .35s ease;
}
.more-clinics[hidden]{ display:none; }
.more-clinics.is-entering{ opacity: 0; }
.more-clinics .clinic-placeholder + .clinic-placeholder{ margin-top:16px; }

/* まとめ-おすすめ ===== */
.sec-summary {
  background: #CAE7FF;
  margin: 0 14px;
  border-radius: 0 0 5px 5px;
  box-shadow: 2px 4px 8px 0px rgba(0, 0, 0, 0.15);
}
.summary-box {
  padding: 0 1em 1em;
}
/* 詳細テキスト */
.summary-desc-box {
  padding: 0 0 1em;
  font-weight: 600;
}
.summary-desc-box p {
  font-size: clamp(12px, 3.5vw, 18px);
  color: #0F6EB1;
  text-align: center;
}
.summary-desc-box p span.str {
  color: #FC3169;
  font-size: 120%;
}
.summary-desc-box figure {
  margin: 1em auto;
}
/* Flow */
.flow-wrap {
  padding: 0 0 2em;
}
.flow-list {
  max-width: 700px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.flow-step {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.flow-photo {
  width: 44%;
  max-width: 200px;
  aspect-ratio: 2 / 1.3;
  object-fit: cover;
  flex-shrink: 0;
  padding-top: 5px;
}
.flow-body {
  flex: 1;
}
.flow-badge {
  display: inline-block;
  background: #0F6EB1;
  color: #ffffff;
  font-size: clamp(10px, 2vw, 13px);
  letter-spacing: 0.03em;
  padding: 1px 4px;
  border-radius: 3px;
}
.flow-title {
  font-weight: 600;
  color: #0F6EB1;
  font-size: clamp(16px, 4.6vw, 22px);
  line-height: 1.2;
  margin: 0 0 .3em;
}
.flow-desc {
  font-size: clamp(11px, 3vw, 13px);
  line-height: 1.2;
  color: #5D5D5D;
  margin: 0;
}

/* 追伸 ===== */
.sec-ps {
  background: #fff;
  margin: 1em auto;
}
.ps-head {
  line-height: 1.4;
  background: #0F6EB1;
  color: #fff;
  text-align: center;
  padding: 1em;
  position: relative;
  margin-bottom: 15px;
}
.ps-head span.badge-text {
  background: #fff;
  color: #0F6EB1;
  padding: 4px 2em;
  border-radius: 20px;
  font-weight: 600;
  display: inline-block;
  margin-bottom: 3px;
}
.ps-head span.main {
  font-size: clamp(2.063rem, 1.722rem + 1.7vw, 3rem);
  font-weight: 600;
  line-height: 1.3;
  padding-top: 2px;
}
.ps-body {
  padding: 0 1em 1em;
}
.ps-desc {
  text-align: center;
  padding: 0;
  margin: 0 auto;
}
.ps-desc p.sub {
  font-size: clamp(12px, 3vw, 18px);
  font-weight: 600;
  color: #0F6EB1;
  margin-bottom: 1em;
}
.ps-desc p.main {
  font-size: clamp(1.25rem, 1.205rem + 0.23vw, 1.375rem);
  font-weight: 600;
  color: #0F6EB1;
}
.ps-desc p.main span.str {
  font-size: clamp(3.125rem, 3.011rem + 0.57vw, 3.438rem);
  font-weight: 800;
  color: #FC3169;
  display: inline-block;
  white-space: nowrap;
  letter-spacing: -0.04em;
}
.ps-desc img {
  margin: .0 auto 1em;
}

@media (max-width: 520px) {
  .ps-desc p.main span.str {
    font-size: clamp(2rem, 10vw, 3.125rem);
  }
}

/* 追従バナー ===== */
.cta::after {
  content: '';
  width: clamp(10px, 2.4vw, 16px);
  height: clamp(10px, 2.4vw, 16px);
  border: 0px;
  border-top: solid 2px #FAFAFA;
  border-right: solid 2px #FAFAFA;
  position: absolute;
  top: 48%;
  right: 5%;
  transform: rotate(45deg) translateY(-50%);
}
.cta::before {
  content: "";
  animation: shine 3s ease-in-out infinite;
  background-color: rgba(255, 255, 255, .5);
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: -50px;
  transform: rotate(45deg);
  width: 20px;
}
.fixed-cta-wrap {
  z-index: 50;
  display: none;
  position: fixed;
  bottom: 0;
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
  pointer-events: none;
}
.fixed-cta {
  display: block;
  text-align: center;
  border-radius: 3px;
  color: #fff;
  background: #FC8822;
  line-height: 1.3;
  overflow:hidden;
  padding: min(37px, 4vw) 0;
  position: absolute;
  top: 65%;
  transform: translateY(-50%);
  right: 8px;
  width: 34.5%;
  overflow:hidden;
  font-weight: 600;
  pointer-events: auto;
}
.fixed-cta a {
  font-size: clamp(12px, 3vw, 23px);
  overflow:hidden;
}
.fixed-cta a:before {
  content: "";
  animation: shine 3s ease-in-out infinite;
  background-color: rgba(255, 255, 255, .5);
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: -50px;
  transform: rotate(45deg);
  width: 20px;
}
.fixed-cta a:after {
  right: 7%;
}

@keyframes shine {
  0% {
    transform: scale(0) rotate(45deg);
    opacity: 0;
  }
  80% {
    transform: scale(0) rotate(45deg);
    opacity: 0.5;
  }
  81% {
    transform: scale(4) rotate(45deg);
    opacity: 1;
  }
  100% {
    transform: scale(50) rotate(45deg);
    opacity: 0;
  }
}


/* フッター ===== */
footer {
  background: #0F6EB1;
  padding-right: min(10px, 2vw);
  padding-left: min(10px, 2vw);
  color: #fff;
  margin-bottom: 8em;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}
.foot-nav {
  display: grid;
  grid-template-columns: auto auto auto;
  gap: min(10px, 1vw);
  font-size: min(.8em, 3.3vw);
  text-align: center;
  width: 80%;
  margin: auto;
}
footer > *:not(a) {
    padding-top: min(30px, 10vw);
    padding-bottom: min(30px, 10vw);
}

@keyframes dokidoki {
  0% {
    filter: brightness(1);
    transform: scale(1)
  }
  50% {
    filter: brightness(1);
    transform: scale(1.025)
  }
  51% {
    filter: brightness(1.3);
    transform: scale(1.05)
  }
  75% {
    filter: brightness(1.1);
    transform: scale(1.025)
  }
  100% {
    filter: brightness(1);
    transform: scale(1)
  }
}


/* サブページ ===== */
.page-header {
  background: #0F6EB1;
  min-height: min(120px, 25vw);
  display: flex;
  overflow: hidden;
  padding: min(40px, 6vw);
  justify-content: center;
  align-items: center;
}
.page-title {
  color: #fff;
  font-size: clamp(1.063rem, 0.949rem + 0.57vw, 1.375rem);;
  font-weight: 600;
  text-align: center;
}
/* コンテンツ */
#sub.content {
  padding: 28px 20px 40px;
  background: #fff;
}
/* セクション */
#sub .section {
  margin-bottom: 36px;
}
#sub .section-title {
  font-size: clamp(0.813rem, 0.786rem + 0.45vw, 1.125rem);
  font-weight: 600;
  color: #222;
  padding: 8px 1em;
  background: #F1F9FF;
  border-left: 5px solid #0F6EB1;
}
/* 調査概要 */
.overview-item > dd {
  padding: min(20px, 3vw);
}
.overview-item:last-child > dd {
  padding-bottom: 0;
}
.overview-detail-list dt {
  padding-left: 1em;
  font-weight: 600;
  position: relative;
}
.overview-detail-list dt::before {
  content: "";
  width: .85em;
  aspect-ratio: 1/.65;
  background: #0F6EB1;
  clip-path: polygon(0 0, 50% 100%, 100% 0);
  position: absolute;
  left: 0;
  top: 4px;
  translate: 0 50%;
}
.overview-detail-list dd {
  padding: 10px 10px 10px 1em;
  line-height: calc(20/14);
}
.survey-list li {
  padding-bottom: 10px;
  border-bottom: 1px solid #999;
}
.survey-list li:nth-child(n+2) {
  padding-top: 10px;
  border-top: 1px solid var(--bdr-pale-gry);
}
.survey-result-table {
  width: 100%;
  text-align: center;
}
.survey-result-table th, .survey-result-table td {
  padding: 8px 5px;
}
.survey-result-table thead th {
  background: #f2f2f2;
}
.survey-result-table tbody td {
  font-weight: 600;
  border-bottom: 1px solid #999;
}
.link-area {
  margin-top: min(30px, 10vw);
}
/* テーブル */
.info-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #000;
  overflow: hidden;
}
.info-table th {
  background: #f2f2f2;
  color: #00;
  font-size: clamp(12px, 3vw, 15px);
  font-weight: normal;
  padding: 12px 14px;
  width: 35%;
  vertical-align: middle;
  text-align: left;
  border-bottom: 1px solid #000;
}
.info-table tr:last-child th,
.info-table tr:last-child td {
  border-bottom: none;
}
.info-table td {
  font-size: clamp(12px, 3vw, 15px);
  padding: 12px 14px;
  vertical-align: middle;
  line-height: 1.7;
  border-bottom: 1px solid #000;
}
.info-table a {
  text-decoration: underline;
}
.info-table.site td {
  border-left: none;
}
.info-table.site tr td:first-child {
  width: 60%;
}
.info-textarea p {
  line-height: 1.6em;
}

/* フォーム ===== */
.form-group {
  margin-bottom: 24px;
}
.form-label {
  display: block;
  font-size: clamp(13px, 3.2vw, 15px);
  font-weight: 600;
  color: #333;
  margin-bottom: 8px;
}
.form-label .required {
  display: inline-block;
  background: #e00;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 3px;
  margin-left: 6px;
  vertical-align: middle;
}
.form-input,
.form-textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #000;
  font-size: clamp(13px, 3.2vw, 15px);
  font-family: inherit;
  color: #222;
  transition: border-color 0.2s, background 0.2s;
  outline: none;
  -webkit-appearance: none;
}
.form-input:focus,
.form-textarea:focus {
  border-color: #2a5bbf;
  background: #fff;
}
.form-input::placeholder,
.form-textarea::placeholder {
  color: #bbb;
}
.form-textarea {
  height: 160px;
  resize: vertical;
  line-height: 1.7;
}

/* 送信ボタン */
.btn-wrap {
  margin-top: 32px;
}
.btn-confirm {
  display: block;
  width: 100%;
  padding: 16px;
  border-radius: 5px;
  background: #ff9933;
  color: #fff;
  font-size: clamp(15px, 3.8vw, 18px);
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  text-align: center;
  transition: background 0.2s, color 0.2s;
  box-shadow: 1px 4px 0.98px 0px rgba(252, 136, 34, 0.25);
}
.btn-confirm:hover {
  background: #2a5bbf;
  color: #fff;
}

/* エラーメッセージ */
.error-msg {
  color: #e00;
  font-size: clamp(11px, 2.6vw, 13px);
  margin-top: 5px;
  display: none;
}
.form-input.error,
.form-textarea.error {
  border-color: #e00;
  background: #fff5f5;
}

.confirm-note {
  font-size: clamp(12px, 2.8vw, 14px);
  color: #666;
  margin-bottom: 24px;
}

/* 確認テーブル */
.confirm-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #888;
  overflow: hidden;
  margin-bottom: 32px;
}
.confirm-table tr { border-bottom: 1px solid #0F6EB1; }
.confirm-table tr:last-child { border-bottom: none; }
.confirm-table th {
  background: #0F6EB1;
  color: #fff;
  font-size: clamp(12px, 3vw, 15px);
  font-weight: 600;
  padding: 12px 14px;
  width: 35%;
  vertical-align: top;
  text-align: left;
  border-bottom: 1px solid #888;
}
.confirm-table tr:last-child th { border-bottom: none; }
.confirm-table td {
  font-size: clamp(12px, 3vw, 15px);
  padding: 12px 14px;
  vertical-align: top;
  line-height: 1.7;
  border-left: 1px solid #888;
  border-bottom: 1px solid #888;
  word-break: break-all;
}

/* ボタン */
.btn-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.btn-submit {
  display: block;
  width: 100%;
  padding: 16px;
  border: none;
  border-radius: 5px;
  background: #ff9933;
  color: #fff;
  font-size: clamp(15px, 3.8vw, 18px);
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  text-align: center;
  transition: opacity 0.2s;
  box-shadow: 1px 4px 0.98px 0px rgba(252, 136, 34, 0.25);
}
.btn-submit:hover { opacity: 0.85; }
.btn-back {
  display: block;
  width: 100%;
  padding: 14px;
  border: 2px solid #aaa;
  border-radius: 5px;
  background: #fff;
  color: #666;
  font-size: clamp(13px, 3.2vw, 16px);
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  text-align: center;
  transition: background 0.2s;
}
.btn-back:hover { background: #f5f5f5; }

.thanks-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #0F6EB1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  font-size: 30px;
  color: #fff;
}
.thanks-textbox {
  text-align: center;
  }
.thanks-title {
  font-size: clamp(18px, 4.5vw, 24px);
  font-weight: 800;
  color: #0F6EB1;
  margin-bottom: 16px;
}
.thanks-text {
  font-size: clamp(13px, 3.2vw, 15px);
  color: #555;
  line-height: 1.9;
  margin-bottom: 36px;
}
.btn-top {
  display: block;
  width: 100%;
  padding: 16px;
  border-radius: 5px;
  background: #ff9933;
  color: #fff;
  font-size: clamp(15px, 3.8vw, 18px);
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  text-align: center;
  transition: background 0.2s, color 0.2s;
  box-shadow: 1px 4px 0.98px 0px rgba(252, 136, 34, 0.25);
}
.btn-top:hover { opacity: 0.85; }