/* ==========================================================================
   小杉総合型ゼミナール 固有のパーツ
   土台は Mepath塾LP（home.css / lp.css）。色：紺 #1D2D5C・緑 #7DBE79、書体：Arial（和文はヒラギノ角ゴ・游ゴシック）
   ========================================================================== */
:root {
  --kz-navy: #1D2D5C;
  --kz-navy-soft: #3E5A9A;
  --kz-green: #7DBE79;
  --kz-green-ink: #3F7F3C;
  --kz-green-tint: #EEF6ED;
  --kz-gray: #F4F6F9;
  --kz-line: #DDE3EC;
  --kz-ink: #1F2638;
  --kz-mute: #5C6578;
}

body {
  font-family: Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, Meiryo, sans-serif;
}

.kz_todo {
  display: inline-block;
  margin-left: 4px;
  padding: 0 8px;
  border-radius: 6px;
  background: #FFF3DC;
  color: #9A6312;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  vertical-align: 1px;
}

/* ---------- ロゴ（横長なので幅で合わせる） ---------- */
.lp_header .header__logo img {
  width: 176px;
  height: auto;
}
@media (min-width: 768px) {
  .lp_header .header__logo img { width: 232px; }
}
.footer__logo img {
  width: 220px;
  height: auto;
}

/* ---------- 表紙の見出し ---------- */
@media (max-width: 767px) {
  .mp_copy__ttl.mp_copy__ttl--v2.kz_ttl { font-size: clamp(24px, calc((100vw - 40px) / 10.6), 34px); }
}

/* ---------- 表紙の直下：料金と入塾金0円 ---------- */
.kz_offer {
  position: relative;
  z-index: 2;
  padding-block: 0 8px;
  background: var(--kz-gray);
}
.kz_offer .inner {
  display: grid;
  gap: 10px;
}
.kz_offer__card {
  display: grid;
  gap: 16px;
  margin-top: -36px;
  padding: 22px 20px 20px;
  border: 2px solid var(--kz-navy);
  border-radius: 18px;
  background: #fff;
  box-shadow: 4px 4px 0 var(--kz-navy);
}
.kz_offer__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.kz_offer__price {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.kz_offer__price small {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--kz-mute);
}
.kz_offer__price p {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 2px 6px;
  color: var(--kz-navy);
  line-height: 1.1;
}
.kz_offer__price span {
  font-size: 15px;
  font-weight: 700;
}
.kz_offer__price b {
  font-size: clamp(38px, 10.6vw, 60px);
  font-weight: 900;
  letter-spacing: 0.01em;
  font-variant-numeric: tabular-nums;
}
.kz_offer__price i {
  font-style: normal;
  font-size: 18px;
  font-weight: 900;
}
.kz_offer__price em {
  font-style: normal;
  font-size: 12px;
  color: var(--kz-mute);
}
.kz_offer__zero {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: var(--kz-navy);
  color: #fff;
  text-align: center;
  line-height: 1.15;
}
.kz_offer__zero small {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.kz_offer__zero b {
  display: block;
  font-size: 32px;
  font-weight: 900;
  color: var(--kz-green);
}
.kz_offer__zero b i {
  font-style: normal;
  font-size: 15px;
  color: #fff;
  margin-left: 2px;
}
.kz_offer__list {
  display: grid;
  gap: 8px;
  padding-top: 14px;
  border-top: 1px dashed var(--kz-line);
}
.kz_offer__list li {
  position: relative;
  padding-left: 28px;
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.6;
  color: var(--kz-ink);
}
.kz_offer__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--kz-green);
}
.kz_offer__list li::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 6px;
  width: 5px;
  height: 9px;
  border-right: 2.5px solid var(--kz-navy);
  border-bottom: 2.5px solid var(--kz-navy);
  transform: rotate(45deg);
}
.kz_offer__list b {
  font-weight: 900;
  color: var(--kz-navy);
  background: linear-gradient(transparent 62%, rgba(125, 190, 121, 0.45) 62%);
}
.kz_offer__list sup {
  font-size: 11px;
  color: var(--kz-mute);
}
.kz_offer__btn {
  justify-self: stretch;
}
.kz_offer__note {
  font-size: 11.5px;
  line-height: 1.7;
  color: var(--kz-mute);
}
@media (min-width: 900px) {
  .kz_offer__card {
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 28px;
    margin-top: -56px;
    padding: 24px 30px;
  }
  .kz_offer__top { gap: 22px; }
  .kz_offer__list {
    padding-top: 0;
    padding-left: 28px;
    border-top: 0;
    border-left: 1px dashed var(--kz-line);
  }
  .kz_offer__btn { justify-self: end; }
}

/* ---------- 保護者への連絡の例 ---------- */
.kz_rp__grid {
  display: grid;
  gap: 28px;
  align-items: center;
}
.kz_phone {
  justify-self: center;
  width: min(340px, 100%);
  padding: 12px;
  border-radius: 32px;
  background: var(--kz-navy);
  box-shadow: 0 18px 40px rgba(29, 45, 92, 0.18);
}
.kz_phone__screen {
  overflow: hidden;
  border-radius: 22px;
  background: #E9EEF5;
}
.kz_phone__bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: #fff;
  border-bottom: 1px solid var(--kz-line);
}
.kz_phone__bar img {
  width: 32px;
  height: 32px;
  padding: 3px;
  object-fit: contain;
  border: 1px solid var(--kz-line);
  border-radius: 50%;
  background: #fff;
}
.kz_phone__bar b {
  font-size: 13px;
  line-height: 1.3;
  color: var(--kz-navy);
}
.kz_phone__bar small {
  display: block;
  font-size: 10.5px;
  font-weight: 500;
  color: var(--kz-mute);
}
.kz_chat {
  display: grid;
  gap: 10px;
  padding: 16px 14px 20px;
}
.kz_chat__day {
  justify-self: center;
  padding: 2px 10px;
  border-radius: 999px;
  background: rgba(29, 45, 92, 0.12);
  color: var(--kz-navy-soft);
  font-size: 10.5px;
}
.kz_bubble {
  max-width: 92%;
  padding: 12px 14px;
  border-radius: 4px 16px 16px 16px;
  background: #fff;
  font-size: 13px;
  line-height: 1.7;
  color: var(--kz-ink);
}
.kz_bubble b {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--kz-green-ink);
}
.kz_bubble time {
  display: block;
  margin-top: 6px;
  text-align: right;
  font-size: 10px;
  color: var(--kz-mute);
}
.kz_rp__body {
  display: grid;
  gap: 16px;
}
.kz_rp__ttl {
  font-size: 19px;
  font-weight: 700;
  line-height: 1.6;
  color: var(--kz-navy);
}
.kz_rp__list {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--kz-line);
}
.kz_rp__list li {
  display: grid;
  grid-template-columns: 9.5em 1fr;
  gap: 12px;
  padding: 12px 2px;
  border-bottom: 1px solid var(--kz-line);
  font-size: 14.5px;
  color: var(--kz-mute);
}
.kz_rp__list b {
  color: var(--kz-navy);
}
.kz_rp__note {
  font-size: 12px;
  color: var(--kz-mute);
}
@media (min-width: 900px) {
  .kz_rp__grid {
    grid-template-columns: 360px 1fr;
    gap: 64px;
    max-width: 920px;
    margin: 0 auto;
  }
  .kz_rp__ttl { font-size: 22px; }
}

/* ---------- 合格までの流れ ---------- */
.kz_flow {
  display: grid;
  max-width: 920px;
  margin: 0 auto;
}
.kz_flow li {
  position: relative;
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 16px;
  padding-bottom: 26px;
}
.kz_flow li:last-child { padding-bottom: 0; }
.kz_flow li::before {
  content: "";
  position: absolute;
  left: 23px;
  top: 50px;
  bottom: 2px;
  width: 2px;
  background: repeating-linear-gradient(180deg, var(--kz-green) 0 6px, transparent 6px 12px);
}
.kz_flow li:last-child::before { display: none; }
.kz_flow__no {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--kz-navy);
  color: #fff;
  font-size: 20px;
  font-weight: 900;
}
.kz_flow li > div {
  display: grid;
  gap: 4px;
  padding-top: 9px;
}
.kz_flow b {
  font-size: 17.5px;
  color: var(--kz-navy);
}
.kz_flow p {
  font-size: 14px;
  line-height: 1.7;
  color: var(--kz-mute);
}
.kz_extra {
  display: grid;
  gap: 12px;
  max-width: 920px;
  margin: 40px auto 0;
  padding: 24px 22px;
  border-radius: 18px;
  background: #fff;
  border: 2px solid var(--kz-green);
}
.kz_extra__ttl {
  font-size: 16px;
  font-weight: 700;
  color: var(--kz-navy);
}
.kz_extra ul {
  display: grid;
  gap: 10px;
}
.kz_extra li {
  position: relative;
  padding-left: 22px;
  font-size: 14.5px;
  line-height: 1.65;
}
.kz_extra li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 0.55em;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--kz-green);
}
@media (min-width: 900px) {
  .kz_flow {
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
  }
  .kz_flow li {
    grid-template-columns: 1fr;
    justify-items: center;
    padding-bottom: 0;
    text-align: center;
  }
  .kz_flow li::before {
    left: calc(50% + 32px);
    right: calc(-50% + 16px);
    top: 23px;
    bottom: auto;
    width: auto;
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--kz-green) 0 6px, transparent 6px 12px);
  }
  .kz_flow li > div { padding-top: 0; }
  .kz_extra {
    padding: 28px 34px;
  }
  .kz_extra ul {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
}

/* ---------- 料金 ---------- */
.kz_rows {
  display: grid;
  margin-top: 12px;
  border-top: 1px dashed var(--kz-line);
}
.kz_rows p {
  display: flex;
  align-items: baseline;
  gap: 6px;
  padding: 14px 2px;
  border-bottom: 1px solid var(--kz-line);
  color: var(--kz-navy);
}
.kz_rows p:last-child { border-bottom: 0; }
.kz_rows span {
  margin-right: auto;
  font-size: 15px;
  font-weight: 700;
  color: var(--kz-mute);
}
.kz_rows b {
  font-size: 32px;
  font-weight: 900;
  letter-spacing: 0.01em;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.kz_rows i {
  font-style: normal;
  font-size: 14px;
  font-weight: 700;
}
.kz_inc,
.kz_essay {
  max-width: 960px;
  margin: 22px auto 0;
  padding: 22px 22px 20px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--kz-line);
}
.kz_inc__ttl,
.kz_essay__ttl {
  font-size: 16px;
  font-weight: 700;
  color: var(--kz-navy);
}
.kz_essay__ttl small {
  margin-left: 8px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--kz-mute);
}
.kz_inc .pr_card__list {
  margin-top: 12px;
}
.kz_essay ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.kz_essay li {
  display: grid;
  gap: 2px;
  padding: 12px 8px;
  border-radius: 12px;
  background: var(--kz-gray);
  text-align: center;
}
.kz_essay li span {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--kz-mute);
}
.kz_essay li b {
  font-size: 19px;
  font-weight: 900;
  color: var(--kz-navy);
  font-variant-numeric: tabular-nums;
}
.kz_essay li b i {
  font-style: normal;
  font-size: 12px;
  margin-left: 1px;
}
@media (min-width: 768px) {
  .kz_inc .pr_card__list {
    grid-template-columns: 1fr 1fr;
    column-gap: 28px;
  }
}

/* ---------- 運営会社：ロゴなしの見出し ---------- */
.co_card__head {
  justify-content: flex-start;
}

/* ---------- 調整 ---------- */
.mp_view { overflow: hidden; }
.kz_inc { --c: var(--kz-green); }
@media (max-width: 767px) {
  .kz_offer__price b { font-size: clamp(32px, 9.2vw, 44px); }
  .kz_offer__price p { flex-wrap: nowrap; white-space: nowrap; }
  .kz_offer__zero { width: 80px; height: 80px; }
  .kz_offer__zero b { font-size: 28px; }
}
@media (max-width: 374px) {
  .kz_offer__card { padding-inline: 16px; }
  .kz_offer__price span { font-size: 13px; }
  .kz_offer__price b { font-size: 30px; }
  .kz_offer__price i { font-size: 15px; }
  .kz_offer__zero { width: 70px; height: 70px; }
  .kz_offer__zero b { font-size: 24px; }
}
@media (min-width: 900px) {
  .kz_offer__card {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "top list" "top btn";
    align-items: center;
    column-gap: 36px;
    row-gap: 14px;
  }
  .kz_offer__top { grid-area: top; padding-right: 36px; border-right: 1px dashed var(--kz-line); }
  .kz_offer__list { grid-area: list; padding-left: 0; border-left: 0; }
  .kz_offer__btn { grid-area: btn; justify-self: start; }
  .kz_offer__price b { font-size: 52px; }
  .kz_offer__price p { flex-wrap: nowrap; white-space: nowrap; }
  .kz_offer__list li { font-size: 15px; }
}
.kz_offer__list b { white-space: nowrap; }

/* 線を少し淡く（料金カードの枠・悩みのマーカー） */
.pr_card {
  border-width: 1.5px;
  border-color: color-mix(in srgb, var(--c) 45%, #fff);
  box-shadow: 3px 3px 0 color-mix(in srgb, var(--c) 18%, #fff);
}
.wr_item b {
  background: linear-gradient(transparent 66%, rgba(125, 190, 121, 0.32) 66%);
}
.pr_card--b { border-color: color-mix(in srgb, var(--c) 65%, #fff); box-shadow: 3px 3px 0 color-mix(in srgb, var(--c) 28%, #fff); }

/* 運営会社カード：ロゴ・URL、枠を淡く */
.co_card {
  border-width: 1.5px;
  border-color: color-mix(in srgb, var(--mp-1) 45%, #fff);
  box-shadow: 3px 3px 0 color-mix(in srgb, var(--mp-1) 18%, #fff);
}
.co_card__head img { width: 132px; }
.co_card__dl > div { grid-template-columns: 6.5em 1fr; }
.co_card__dl dt { white-space: nowrap; }
.co_card__dl dd { min-width: 0; overflow-wrap: anywhere; }
.co_card__dl dd a { text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 768px) { .co_card__head img { width: 160px; } }

/* 見出しを1行に */
.ac_row__ttl.kz_one {
  white-space: nowrap;
  font-size: min(23px, calc((100vw - 44px) / 16.6));
}
@media (min-width: 768px) {
  .ac_row__ttl.kz_one { font-size: min(30px, 2.4vw); }
}

/* 特徴：公式LINEの画面イメージ */
.kz_line {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 6px;
  background: #9DB4D6;
  font-size: 12px;
  line-height: 1.55;
  color: #1F2638;
}
.kz_line__bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: #fff;
  border-bottom: 1px solid #E3E8F0;
}
.kz_line__bar b { font-size: 13px; font-weight: 700; }
.kz_line__back {
  width: 9px; height: 9px;
  border-left: 2px solid #1F2638;
  border-bottom: 2px solid #1F2638;
  transform: rotate(45deg);
  margin-left: 2px;
}
.kz_line__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px 12px 16px;
}
.kz_line__day {
  align-self: center;
  padding: 1px 10px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.18);
  color: #fff;
  font-size: 10.5px;
}
.kz_line__msg { display: flex; align-items: flex-start; gap: 8px; }
.kz_line__msg--me { justify-content: flex-end; }
.kz_line__icon {
  flex: none;
  width: 32px !important;
  height: 32px !important;
  aspect-ratio: 1 !important;
  padding: 4px;
  border-radius: 50% !important;
  background: #fff;
  object-fit: contain !important;
}
.kz_line__col { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.kz_line__name { font-size: 10.5px; color: #33415C; }
.kz_line__row { display: flex; align-items: flex-end; gap: 5px; }
.kz_line__row small {
  flex: none;
  font-size: 9.5px;
  line-height: 1.3;
  color: #3D4A63;
  text-align: right;
}
.kz_line__bbl {
  max-width: 82%;
  padding: 8px 11px;
  border-radius: 16px;
  background: #fff;
  overflow-wrap: anywhere;
}
.kz_line__msg--me .kz_line__bbl { background: #8DE055; }
.kz_line__card {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 210px;
  max-width: 100%;
  padding: 11px 12px 0;
  border-radius: 14px;
  background: #fff;
}
.kz_line__card b { font-size: 12.5px; color: var(--kz-navy); }
.kz_line__card span { font-size: 11px; color: #5f6b72; }
.kz_line__card em {
  margin: 8px -12px 0;
  padding: 8px 0;
  border-top: 1px solid #E3E8F0;
  font-style: normal;
  font-weight: 700;
  font-size: 11.5px;
  text-align: center;
  color: #2F6FD0;
}
@media (min-width: 768px) {
  .kz_line { font-size: 13px; }
  .kz_line__body { padding: 16px 18px 20px; gap: 12px; }
}

/* ===== デザイン更新 2026-10-22 ===== */

/* 見出しのマーカーを淡く */
.lp_dom__ttl em,
.mp_copy__ttl .mp_hl--u {
  background: linear-gradient(transparent 62%, rgba(125, 190, 121, 0.42) 62%);
}

/* 悩み→つなぎの文：改行を整える */
.wr_bridge p { text-wrap: balance; }

/* 特徴：番号で流れを出す */
.ac_rows { counter-reset: kzf; }
.ac_row__body::before {
  counter-increment: kzf;
  content: "0" counter(kzf);
  display: block;
  margin-bottom: 8px;
  font-family: Arial, sans-serif;
  font-size: 30px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.02em;
  color: var(--kz-navy);
  opacity: 0.28;
}
.ac_row--flip .ac_row__body::before { color: var(--kz-green-ink); opacity: 0.55; }
@media (min-width: 900px) {
  .ac_row__body::before { font-size: 40px; margin-bottom: 10px; }
}

/* 月1回のまとめレポート（見本） */
.kz_report {
  justify-self: center;
  width: min(420px, 100%);
  padding: 18px 18px 20px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid var(--kz-line);
  box-shadow: 0 18px 40px rgba(29, 45, 92, 0.12);
  font-size: 13px;
  line-height: 1.6;
  color: var(--kz-ink);
}
.kz_report__head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--kz-navy);
}
.kz_report__head img {
  flex: none;
  width: 34px;
  height: 34px;
  padding: 3px;
  border: 1px solid var(--kz-line);
  border-radius: 50%;
  background: #fff;
  object-fit: contain;
}
.kz_report__head div { min-width: 0; flex: 1; }
.kz_report__head small { display: block; font-size: 10px; color: var(--kz-mute); letter-spacing: 0.02em; }
.kz_report__head b { display: block; font-size: 15.5px; color: var(--kz-navy); line-height: 1.3; }
.kz_report__head span {
  flex: none;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--kz-green);
  color: var(--kz-green-ink);
  font-size: 10px;
  font-weight: 700;
}
.kz_report__meta {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
  font-size: 11px;
  color: var(--kz-mute);
}
.kz_report__ttl {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  font-size: 12px;
  font-weight: 700;
  color: var(--kz-navy);
}
.kz_report__ttl::before { content: ""; width: 4px; height: 14px; border-radius: 2px; background: var(--kz-green); }
.kz_report__bars { display: grid; gap: 9px; margin-top: 8px; }
.kz_report__bars li {
  display: grid;
  grid-template-columns: 7.2em 1fr;
  grid-template-areas: "n b" "n e";
  column-gap: 10px;
  row-gap: 2px;
  align-items: center;
}
.kz_report__bars span { grid-area: n; font-weight: 700; color: var(--kz-ink); font-size: 12.5px; }
.kz_report__bars i {
  grid-area: b;
  display: block;
  height: 10px;
  border-radius: 999px;
  background: var(--kz-gray);
  overflow: hidden;
}
.kz_report__bars i::before {
  content: "";
  display: block;
  width: var(--p);
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--kz-navy), var(--kz-green));
}
.kz_report__bars em { grid-area: e; font-style: normal; font-size: 11px; color: var(--kz-mute); }
.kz_report__list { display: grid; gap: 5px; margin-top: 8px; }
.kz_report__list li { position: relative; padding-left: 16px; font-size: 12.5px; }
.kz_report__list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 0.6em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--kz-green);
}
.kz_report__next {
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--kz-gray);
  font-size: 12.5px;
}
.kz_rp__list li { grid-template-columns: 7.5em 1fr; font-size: 14px; }
@media (min-width: 900px) {
  .kz_rp__grid { grid-template-columns: 420px 1fr; gap: 56px; }
  .kz_report { padding: 22px 24px 24px; font-size: 13.5px; }
  .kz_rp__list li { grid-template-columns: 8.5em 1fr; }
}

/* 流れ：PCはカードに */
@media (min-width: 900px) {
  .kz_flow { gap: 14px; }
  .kz_flow li {
    padding: 22px 14px 20px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid var(--kz-line);
    box-shadow: 0 6px 18px rgba(29, 45, 92, 0.05);
  }
  .kz_flow li::before {
    left: 100%;
    right: auto;
    width: 14px;
    top: 44px;
  }
  .kz_flow b { font-size: 16.5px; line-height: 1.4; }
  .kz_flow p { font-size: 13px; }
  .kz_extra { border-width: 1.5px; border-color: color-mix(in srgb, var(--kz-green) 70%, #fff); }
}
@media (max-width: 899px) {
  .kz_flow li > div {
    padding: 10px 14px 12px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid var(--kz-line);
  }
  .kz_flow li { padding-bottom: 14px; }
  .kz_flow li::before { top: 50px; bottom: -2px; }
}

/* 料金の下の誘導：紺の帯に */
.pr_cta {
  gap: 18px;
  padding: 30px 20px 32px;
  background: var(--kz-navy);
  color: #fff;
}
.pr_cta__ttl { color: #fff; font-size: 21px; }
.pr_cta__sub { margin-top: 8px; font-size: 13px; line-height: 1.8; color: rgba(255, 255, 255, 0.82); }
.pr_cta__txt { text-align: center; }
@media (min-width: 900px) {
  .pr_cta {
    grid-template-columns: 1fr auto;
    align-items: center;
    padding: 36px 44px;
  }
  .pr_cta__txt { text-align: left; }
  .pr_cta__ttl { font-size: 24px; }
  .pr_cta__sub { max-width: 520px; }
  .pr_cta .tr__btn--main { width: 320px; }
}

/* 代表あいさつ：引用符のあしらい */
.ms_card__body { position: relative; }
.ms_card__body::before {
  content: "\201C";
  position: absolute;
  top: -52px;
  left: -14px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 120px;
  line-height: 1;
  color: rgba(125, 190, 121, 0.22);
  pointer-events: none;
}
.ms_card__lead { position: relative; }
.kz_rp__ttl { text-wrap: balance; }
@media (max-width: 899px) {
  .kz_rp__ttl { font-size: 18px; }
  .kz_rp__list li { grid-template-columns: 6.5em 1fr; }
  .kz_flow { margin-top: 22px; }
}

/* ===== 料金：1回60分・税込表記、小論文 ===== */
.kz_card__meta {
  display: block;
  margin-top: 4px;
  font-size: 11.5px;
  font-weight: 500;
  color: var(--kz-mute);
}
.kz_rows i small { font-size: 11px; font-weight: 500; color: var(--kz-mute); margin-left: 2px; }
.kz_essay__head {
  display: grid;
  gap: 8px;
  align-items: end;
}
.kz_essay__lead {
  display: flex;
  align-items: baseline;
  gap: 4px;
  color: var(--kz-navy);
  line-height: 1.1;
}
.kz_essay__lead span { font-size: 13px; font-weight: 700; color: var(--kz-mute); margin-right: 4px; }
.kz_essay__lead b { font-size: 30px; font-weight: 900; font-variant-numeric: tabular-nums; }
.kz_essay__lead i { font-style: normal; font-size: 14px; font-weight: 700; }
.kz_essay__lead em { font-style: normal; font-size: 11px; font-weight: 500; color: var(--kz-mute); }
.kz_essay ul { margin-top: 14px; }
@media (min-width: 768px) {
  .kz_essay__head { grid-template-columns: 1fr auto; }
  .kz_essay__lead b { font-size: 34px; }
}

/* ===== ボタンの色を公式LINEの緑に統一 ===== */
:root { --kz-line-green: #06C755; }
.tr__btn--main {
  background: var(--kz-line-green);
  color: #fff;
  box-shadow: 0 8px 22px rgba(6, 199, 85, 0.28);
}
.tr__btn--main i {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #fff;
  overflow: hidden;
}
.tr__btn--main i img { display: block; width: 30px; height: auto; }
.tr__btn--main b { color: #fff; }
.tr__btn--main small { color: rgba(255, 255, 255, 0.88); }
.tr__btn--main em { border-color: #fff; }
.lp_hbtn--main {
  gap: 6px;
  background: var(--kz-line-green);
  color: #fff;
}
.lp_hbtn--main img { width: 20px; height: auto; }
.lp_bar .btn--primary {
  background: var(--kz-line-green);
  color: #fff;
  box-shadow: 0 4px 14px rgba(6, 199, 85, 0.3);
}
.lp_bar .btn--primary::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.pr_cta .tr__btn--main { box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25); }

/* ===== 無料面談までの流れ ===== */
.kz_steps {
  display: grid;
  gap: 12px;
  max-width: 900px;
  margin: 30px auto 0;
  text-align: left;
}
.kz_steps li {
  position: relative;
  display: grid;
  grid-template-columns: 40px 1fr;
  grid-template-areas: "no ttl" "no txt" "no bbl";
  column-gap: 14px;
  row-gap: 4px;
  padding: 16px 16px 16px 14px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--kz-line);
  box-shadow: 0 6px 18px rgba(29, 45, 92, 0.05);
}
.kz_steps__no {
  grid-area: no;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--kz-navy);
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 17px;
  font-weight: 800;
}
.kz_steps li:nth-child(2) .kz_steps__no { background: var(--kz-line-green); }
.kz_steps b { grid-area: ttl; align-self: center; font-size: 15.5px; color: var(--kz-navy); line-height: 1.4; }
.kz_steps p { grid-area: txt; font-size: 13px; line-height: 1.7; color: var(--kz-mute); }
.kz_steps__bbl {
  grid-area: bbl;
  justify-self: start;
  position: relative;
  margin-top: 6px;
  padding: 8px 14px;
  border-radius: 14px 14px 14px 4px;
  background: var(--kz-line-green);
  color: #fff;
  font-size: 13.5px;
  font-weight: 700;
}
.kz_steps__bbl::before {
  content: "トーク例";
  position: absolute;
  right: 0;
  top: -16px;
  font-size: 10px;
  font-weight: 500;
  color: var(--kz-mute);
}
.mp_end__box { margin-top: 26px; }
@media (min-width: 900px) {
  .kz_steps {
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 36px;
  }
  .kz_steps li {
    grid-template-columns: 1fr;
    grid-template-areas: "no" "ttl" "txt" "bbl";
    justify-items: center;
    row-gap: 8px;
    padding: 20px 16px 20px;
    text-align: center;
  }
  .kz_steps li::after {
    content: "";
    position: absolute;
    top: 38px;
    left: 100%;
    width: 14px;
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--kz-green) 0 4px, transparent 4px 8px);
  }
  .kz_steps li:last-child::after { display: none; }
  .kz_steps b { font-size: 15px; }
  .kz_steps p br { display: none; }
  .kz_steps__bbl { justify-self: center; border-radius: 14px; }
  .kz_steps__bbl::before { left: 50%; right: auto; transform: translateX(-50%); white-space: nowrap; }
  .mp_end__box { margin-top: 34px; }
}
@media (min-width: 900px) {
  .pr_cta .tr__btn--main { grid-column: auto; }
  .kz_steps b { display: flex; align-items: center; min-height: 2.9em; font-size: 14.5px; white-space: nowrap; }
  .kz_steps li { padding-inline: 12px; }
}
@media (min-width: 900px) {
  .pr_cta { grid-template-columns: minmax(0, 1fr) 320px; justify-content: stretch; }
  .pr_cta__txt { grid-column: 1; grid-row: 1; }
  .pr_cta .tr__btn--main { grid-column: 2; grid-row: 1; width: 100%; }
}

/* ===== 特徴：料金の比較表 ===== */
.kz_cmp {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--kz-ink);
}
.kz_cmp th, .kz_cmp td {
  padding: 10px 8px;
  border-bottom: 1px solid var(--kz-line);
  text-align: center;
  vertical-align: middle;
}
.kz_cmp thead th {
  padding: 10px 6px;
  background: var(--kz-gray);
  font-size: 11.5px;
  font-weight: 700;
  color: var(--kz-navy);
}
.kz_cmp thead th.kz_cmp__us {
  background: var(--kz-navy);
  color: #fff;
}
.kz_cmp thead th img {
  display: block;
  width: 22px;
  height: 22px;
  margin: 0 auto 3px;
  padding: 2px;
  border-radius: 50%;
  background: #fff;
  object-fit: contain;
}
.kz_cmp tbody th {
  width: 7em;
  text-align: left;
  font-weight: 700;
  font-size: 12px;
  color: var(--kz-navy);
  background: #FAFBFD;
}
.kz_cmp tbody tr:last-child th, .kz_cmp tbody tr:last-child td { border-bottom: 0; }
.kz_cmp td.kz_cmp__us {
  background: rgba(125, 190, 121, 0.14);
  color: var(--kz-navy);
}
.kz_cmp td.kz_cmp__us b { font-size: 14px; font-weight: 900; }
.kz_cmp td.kz_cmp__us small { font-size: 10px; font-weight: 500; }
.kz_cmp td:not(.kz_cmp__us) { color: var(--kz-mute); }
.kz_cmp .kz_todo { margin-right: 4px; }
@media (min-width: 900px) {
  .kz_cmp { font-size: 13.5px; }
  .kz_cmp th, .kz_cmp td { padding: 13px 10px; }
  .kz_cmp thead th { font-size: 12.5px; }
  .kz_cmp tbody th { width: 9em; font-size: 13px; padding-left: 14px; }
  .kz_cmp td.kz_cmp__us b { font-size: 16px; }
}

/* ===== 特徴：講師の採用 ===== */
.kz_hire {
  padding: 18px 16px 14px;
  border-radius: 6px;
  background: #fff;
}
.kz_hire__ttl {
  font-size: 13px;
  font-weight: 700;
  color: var(--kz-navy);
  letter-spacing: 0.04em;
}
.kz_hire__steps {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.kz_hire__steps li {
  position: relative;
  display: grid;
  grid-template-columns: 30px 1fr;
  grid-template-areas: "n b" "n s";
  column-gap: 10px;
  align-items: center;
  padding: 9px 12px;
  border-radius: 10px;
  background: var(--kz-gray);
}
.kz_hire__steps li::after {
  content: "";
  position: absolute;
  left: 14px;
  bottom: -8px;
  width: 2px;
  height: 8px;
  background: var(--kz-line);
}
.kz_hire__steps li:last-child::after { display: none; }
.kz_hire__steps span {
  grid-area: n;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--kz-navy);
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 13px;
  font-weight: 800;
}
.kz_hire__steps b { grid-area: b; font-size: 14px; color: var(--kz-navy); }
.kz_hire__steps small { grid-area: s; font-size: 11.5px; color: var(--kz-mute); }
.kz_hire__steps li.is-goal { background: rgba(125, 190, 121, 0.16); }
.kz_hire__steps li.is-goal span { background: var(--kz-green-ink); }
.kz_hire__note { margin-top: 10px; font-size: 11px; color: var(--kz-mute); }
@media (min-width: 900px) {
  .kz_hire { padding: 22px 22px 18px; }
  .kz_hire__steps li { padding: 11px 14px; }
  .kz_hire__steps b { font-size: 15px; }
  .kz_hire__steps small { font-size: 12.5px; }
}
@media (max-width: 899px) {
  .kz_cmp tbody th { width: 5.6em; padding-left: 8px; }
  .kz_cmp .kz_todo { display: block; width: max-content; margin: 0 auto 3px; }
  .kz_cmp td.kz_cmp__us small { display: block; }
}

/* 最初の料金カード：月4コマも */
.kz_offer__price p.kz_offer__p2 { margin-top: 2px; }
.kz_offer__price p.kz_offer__p2 b { font-size: clamp(24px, 6.4vw, 34px); }
.kz_offer__price p.kz_offer__p2 i { font-size: 14px; }
.kz_offer__price p.kz_offer__p2 span { font-size: 13.5px; }
@media (max-width: 374px) {
  .kz_offer__price p.kz_offer__p2 b { font-size: 22px; }
}
/* 運営会社ロゴ（白背景の画像） */
.co_card__head img { width: 150px; border-radius: 6px; }
@media (min-width: 768px) { .co_card__head img { width: 190px; } }

/* 比較表：行見出しの折り返し */
.kz_cmp tbody th { white-space: nowrap; }
.kz_cmp td.kz_cmp__us small { display: block; }
@media (max-width: 899px) {
  .kz_cmp tbody th { width: auto; font-size: 11.5px; padding-inline: 8px 6px; }
  .kz_cmp { font-size: 12px; }
}
/* 最初の料金カード：箇条書きの折り返し */
.kz_offer__list li { word-break: auto-phrase; text-wrap: pretty; }

/* 講師の条件（3つ） */
.kz_hire__pts {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}
.kz_hire__pts li {
  display: grid;
  grid-template-columns: 44px 1fr;
  grid-template-areas: "i b" "i s";
  column-gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 12px;
  background: var(--kz-gray);
}
.kz_hire__pts i {
  grid-area: i;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--kz-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6L9 17l-5-5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 22px no-repeat;
}
.kz_hire__pts li:nth-child(2) i { background-color: var(--kz-green-ink); }
.kz_hire__pts b { grid-area: b; font-size: 18px; font-weight: 900; color: var(--kz-navy); line-height: 1.3; }
.kz_hire__pts small { grid-area: s; font-size: 12px; color: var(--kz-mute); }
@media (min-width: 900px) {
  .kz_hire__pts { gap: 12px; margin-top: 16px; }
  .kz_hire__pts li { padding: 18px 20px; }
  .kz_hire__pts b { font-size: 20px; }
  .kz_hire__pts small { font-size: 13px; }
}
@media (max-width: 899px) {
  .kz_cmp td.kz_cmp__us b { font-size: 13px; white-space: nowrap; }
  .kz_cmp td { padding-inline: 6px; }
}
@media (min-width: 900px) {
  .kz_cmp td br, .kz_cmp tbody th br { display: none; }
}

/* 代表：プロフィール */
.kz_ceo { display: grid; gap: 14px; justify-items: center; align-content: start; }
.kz_ceo .ms_card__pic { margin: 0; }
.kz_ceo__prof { display: grid; gap: 10px; width: min(300px, 100%); }
.kz_ceo__badge {
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--kz-navy);
  color: #fff;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.55;
  text-align: center;
}
.kz_ceo__badge span {
  display: block;
  margin-bottom: 2px;
  font-size: 11px;
  font-weight: 500;
  opacity: 0.8;
  letter-spacing: 0.04em;
}
.kz_ceo__badge b {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 8px;
  border-radius: 6px;
  background: var(--kz-green);
  color: var(--kz-navy);
  font-weight: 900;
}
.kz_ceo__prof dl { display: grid; gap: 4px; }
.kz_ceo__prof dl > div {
  display: grid;
  grid-template-columns: 3em 1fr;
  gap: 8px;
  font-size: 12.5px;
  line-height: 1.6;
}
.kz_ceo__prof dt { font-weight: 700; color: var(--kz-navy); }
.kz_ceo__prof dd { color: var(--kz-mute); }
@media (min-width: 768px) {
  .kz_ceo { justify-items: stretch; }
  .kz_ceo .ms_card__pic { width: 100%; }
  .kz_ceo__prof { width: 100%; }
}
.kz_ceo__prof dl > div { justify-content: center; grid-template-columns: auto auto; }
@media (max-width: 767px) { .ms_card__body { padding-top: 26px; } }
@media (min-width: 768px) { .kz_ceo__prof dl > div { justify-content: start; } }
/* 表紙見出し（A案：2行目が13文字） */
@media (max-width: 767px) {
  .mp_copy__ttl.mp_copy__ttl--v2.kz_ttl { font-size: clamp(22px, calc((100vw - 40px) / 13.6), 32px); }
}
.kz_ttl .mp_copy__ttl_l2 { white-space: nowrap; }

/* 入塾金0円：シール風に目立たせる */
.kz_offer__zero {
  position: relative;
  width: 112px;
  height: 112px;
  background: none;
  color: var(--kz-navy);
  transform: rotate(-8deg);
  filter: drop-shadow(0 6px 12px rgba(29, 45, 92, 0.22));
  animation: kzZeroIn 0.6s cubic-bezier(.2,1.4,.4,1) 0.4s both;
}
.kz_offer__zero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #FFD84D;
  clip-path: polygon(50.00% 0.00%,57.04% 5.55%,65.45% 2.45%,70.43% 9.90%,79.39% 9.55%,81.82% 18.18%,90.45% 20.61%,90.10% 29.57%,97.55% 34.55%,94.45% 42.96%,100.00% 50.00%,94.45% 57.04%,97.55% 65.45%,90.10% 70.43%,90.45% 79.39%,81.82% 81.82%,79.39% 90.45%,70.43% 90.10%,65.45% 97.55%,57.04% 94.45%,50.00% 100.00%,42.96% 94.45%,34.55% 97.55%,29.57% 90.10%,20.61% 90.45%,18.18% 81.82%,9.55% 79.39%,9.90% 70.43%,2.45% 65.45%,5.55% 57.04%,0.00% 50.00%,5.55% 42.96%,2.45% 34.55%,9.90% 29.57%,9.55% 20.61%,18.18% 18.18%,20.61% 9.55%,29.57% 9.90%,34.55% 2.45%,42.96% 5.55%);
}
.kz_offer__zero::after {
  content: "";
  position: absolute;
  inset: 13px;
  border: 1.5px dashed rgba(29, 45, 92, 0.35);
  border-radius: 50%;
}
.kz_offer__zero > span { position: relative; z-index: 1; }
.kz_offer__zero small {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--kz-navy);
  color: #fff;
  font-size: 11px;
}
.kz_offer__zero b {
  margin-top: 2px;
  font-size: 44px;
  line-height: 1;
  color: var(--kz-navy);
  letter-spacing: -0.02em;
}
.kz_offer__zero b i { font-size: 17px; color: var(--kz-navy); margin-left: 1px; }
@keyframes kzZeroIn {
  from { transform: rotate(-30deg) scale(0.4); opacity: 0; }
  to { transform: rotate(-8deg) scale(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .kz_offer__zero { animation: none; } }
@media (max-width: 767px) {
  .kz_offer__zero { width: 100px; height: 100px; }
  .kz_offer__zero::after { inset: 11px; }
  .kz_offer__zero b { font-size: 38px; }
}
@media (max-width: 374px) {
  .kz_offer__zero { width: 86px; height: 86px; }
  .kz_offer__zero::after { inset: 9px; }
  .kz_offer__zero small { font-size: 10px; padding: 1px 6px; }
  .kz_offer__zero b { font-size: 32px; }
  .kz_offer__zero b i { font-size: 14px; }
}
@media (min-width: 900px) {
  .kz_offer__zero { width: 132px; height: 132px; }
  .kz_offer__zero::after { inset: 15px; }
  .kz_offer__zero small { font-size: 12.5px; }
  .kz_offer__zero b { font-size: 54px; }
  .kz_offer__zero b i { font-size: 20px; }
}

/* 表紙の白い帯：左右の余白をそろえる（字間の分だけ右を詰める） */
.mp_copy__ttl--v2.kz_ttl .mp_hl {
  padding-left: 0.28em;
  padding-right: calc(0.28em - 0.06em);
}

/* 03 講師：条件チップ＋合格実績 */
.kz_hire--v2 { padding: 18px 16px 14px; }
.kz_hire__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.kz_hire__chips li {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px 5px 9px;
  border-radius: 999px;
  background: var(--kz-navy);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
.kz_hire__chips li::before {
  content: "";
  width: 12px;
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6L9 17l-5-5' fill='none' stroke='%237DBE79' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.kz_res__ttl {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed var(--kz-line);
  font-size: 14px;
  font-weight: 700;
  color: var(--kz-navy);
  line-height: 1.4;
}
.kz_res__ttl small {
  display: block;
  margin-bottom: 2px;
  font-family: Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.14em;
  color: var(--kz-green-ink);
}
.kz_res__ttl b {
  margin-left: 2px;
  background: linear-gradient(transparent 62%, rgba(125, 190, 121, 0.4) 62%);
}
.kz_res {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}
.kz_res li {
  display: grid;
  grid-template-columns: 6.8em 1fr;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 10px;
  background: var(--kz-gray);
}
.kz_res b {
  font-size: 13.5px;
  font-weight: 900;
  color: var(--kz-navy);
  white-space: nowrap;
}
.kz_res span {
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--kz-mute);
  min-width: 0;
}
.kz_res li.is-top {
  background: var(--kz-navy);
}
.kz_res li.is-top b { color: #fff; }
.kz_res li.is-top span { color: rgba(255, 255, 255, 0.82); }
.kz_res__note {
  margin-top: 10px;
  font-size: 10.5px;
  line-height: 1.6;
  color: var(--kz-mute);
}
@media (min-width: 900px) {
  .kz_hire--v2 { padding: 22px 22px 18px; }
  .kz_hire__chips li { font-size: 13px; padding: 6px 13px 6px 10px; }
  .kz_res__ttl { font-size: 15.5px; }
  .kz_res li { padding: 10px 14px; }
  .kz_res b { font-size: 15px; }
  .kz_res span { font-size: 12.5px; }
}
@media (min-width: 375px) and (max-width: 399px) {
  .kz_offer__zero { width: 90px; height: 90px; }
  .kz_offer__zero::after { inset: 10px; }
  .kz_offer__zero b { font-size: 34px; }
  .kz_offer__top { gap: 8px; }
}
@media (max-width: 899px) {
  .kz_hire--v2 { padding: 16px 14px 12px; }
  .kz_hire__chips { flex-wrap: nowrap; gap: 5px; }
  .kz_hire__chips li { font-size: 11px; padding: 4px 9px 4px 7px; gap: 3px; white-space: nowrap; }
  .kz_hire__chips li::before { width: 10px; height: 10px; }
  .kz_res li { grid-template-columns: 1fr; gap: 1px; padding: 8px 12px; }
  .kz_res span { font-size: 11.5px; }
}

/* 無料面談までの流れ②：LINEのトーク画面（ミニ） */
.kz_steps__chat {
  grid-area: bbl;
  width: min(300px, 100%);
  margin-top: 8px;
  overflow: hidden;
  border-radius: 12px;
  border: 1px solid var(--kz-line);
  background: #9DB4D6;
  text-align: left;
}
.kz_mini__bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  background: #fff;
  font-size: 11px;
  font-weight: 700;
  color: var(--kz-ink);
}
.kz_mini__bar i {
  width: 7px;
  height: 7px;
  border-left: 1.5px solid var(--kz-ink);
  border-bottom: 1.5px solid var(--kz-ink);
  transform: rotate(45deg);
}
.kz_mini__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 10px 12px;
}
.kz_mini__row {
  display: flex;
  align-items: flex-end;
  gap: 5px;
}
.kz_mini__row--me { justify-content: flex-end; }
.kz_mini__row img {
  align-self: flex-start;
  flex: none;
  width: 24px;
  height: 24px;
  padding: 3px;
  border-radius: 50%;
  background: #fff;
  object-fit: contain;
}
.kz_mini__row small {
  flex: none;
  font-size: 9px;
  line-height: 1.3;
  color: #33415C;
  text-align: right;
}
.kz_mini__bbl {
  padding: 6px 10px;
  border-radius: 14px;
  background: #fff;
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--kz-ink);
}
.kz_mini__row--me .kz_mini__bbl { background: #8DE055; font-weight: 700; }
@media (min-width: 900px) {
  .kz_steps__chat { justify-self: stretch; width: 100%; }
  .kz_mini__bbl { font-size: 11px; }
}
.kz_mini__bbl { white-space: nowrap; }
@media (min-width: 900px) {
  .kz_steps li { align-content: start; }
  .kz_steps b { min-height: 0; }
  .kz_steps__chat { margin-top: 6px; }
  .kz_mini__body { padding: 9px 8px 11px; }
  .kz_mini__bbl { font-size: 10.5px; padding: 5px 9px; }
  .kz_mini__row img { width: 20px; height: 20px; }
}

/* 表紙の白い帯：文字を少し下へ（帯の大きさはそのまま） */
.mp_copy__ttl--v2.kz_ttl .mp_hl__ch { position: relative; top: 0.06em; }