/* ===== Material Symbols ===== */
.material-symbols-outlined {
  font-family: 'Material Symbols Outlined', sans-serif;
  font-weight: normal;
  font-style: normal;
  font-size: 16px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
  color: white;
  vertical-align: middle;
}

/* ===== Hero Section ===== */

.hero {
  position: relative;
  overflow: hidden;
  background-color: #fff;
  background-image: url(/assets/BOE/images/hero-bg-sp.webp);
  background-repeat: no-repeat;
  background-size: auto 90%;
  background-position: right top;
}

/* Main content column */
.hero__main {
  position: relative;
  z-index: 1;
  padding: 24px 20px 17px;
}

/* Tag */
.hero__tag {
  display: inline-block;
  background: #0087d2;
  color: #fff;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: 0.7px;
  padding: 2px 8px;
}

/* Heading */
.hero__heading {
  margin-top: 8px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 800;
  color: #141821;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.hero__heading-line1 {
  display: block;
  font-size: 26px;
  line-height: 1.5;
  white-space: nowrap;
}

/* .hero__heading-line1 .hero__heading-close-tight {
  letter-spacing: -10.4px;
} */

.hero__heading-line2 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

.hero__heading-quoted {
  display: flex;
  align-items: center;
  gap: 2px;
  height: 42px;
}

.hero__heading-open-q,
.hero__heading-close-q {
  font-size: 24px;
  color: #0087d2;
  line-height: 1.5;
}

.hero__heading-accent-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.hero__heading-accent-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  border-bottom: 10px solid #ffed56;
  pointer-events: none;
  z-index: -1;
}

.hero__heading-accent {
  font-size: 26px;
  color: #0087d2;
  line-height: 1.5;
}

.hero__heading-accent .text-sm {
  font-size: 24px;
}

.hero__heading-suffix {
  display: block;
  font-size: 28px;
  line-height: 1.5;
  padding-left: 0.5em;
}

/* Feature list */
.hero__features {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-top: 16px;
  display: flex;
  flex-direction: column;
}

.hero__feature {
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1.75;
  letter-spacing: 0.6px;
  color: #141821;
  text-shadow: 0 0 20px #fff, 0 0 20px #fff, 0 0 20px #fff, 0 0 20px #fff, 0 0 0 #000 !important;
}

span.material-symbols-outlined.hero__feature-icon {
  flex-shrink: 0;
  font-family: 'Material Symbols Outlined', sans-serif;
  font-variation-settings: 'FILL' 0, 'wght' 700, 'GRAD' 0, 'opsz' 24;
  font-size: 16px;
  color: #54575f;
  line-height: 1;
  user-select: none;
  white-space: nowrap;
}

.hero__feature-accent {
  color: #0087d2;
}

/* Feature Cards */
.hero__cards {
  display: flex;
  gap: 16px;
  margin-top: 11px;
}

.hero__card {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
  width: 152px;
}

.hero__card-header {
  background: #0087d2;
  color: #fff;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 1.5;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 6px 4px;
  flex-shrink: 0;
}
.hero__card-header span.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24;
  color: #fff;
}

.hero__card-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 12px 12px;
  flex: 1;
  position: relative;
}

.hero__card-deco {
  position: absolute;
  left: -6px;
  top: 32px;
  pointer-events: none;
  z-index: 0;
}

.hero__card-desc {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
  color: #141821;
  margin-top: 0;
  margin-bottom: -8px;
  min-width: 100%;
  position: relative;
  z-index: 1;
}

.hero__card-price {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  margin-bottom: -8px;
  position: relative;
  z-index: 1;
}

.hero__card-price-num {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-style: italic;
  font-size: 40px;
  line-height: 1.5;
  color: #d03086;
}

.hero__card-price-suffix {
  display: flex;
  align-items: center;
  padding-bottom: 12px;
}

.hero__card-price-yen {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.5;
  color: #d03086;
}

.hero__card-price-tilde {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  color: #141821;
}

.hero__card-note {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 10px;
  line-height: 1.5;
  color: #7f8288;
  text-align: right;
  min-width: 100%;
  position: relative;
  z-index: 1;
}

/* Time card */
.hero__card-time-row {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  margin-bottom: -8px;
  height: 54px;
  position: relative;
  z-index: 1;
}

.hero__card-time-pre {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 1.5;
  color: #141821;
  padding-bottom: 14px;
}

.hero__card-time-num {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-style: italic;
  font-size: 40px;
  line-height: 1.5;
  color: #d03086;
}

.hero__card-time-unit {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.5;
  color: #d03086;
  padding-bottom: 12px;
}

.hero__card-time-note {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 1.5;
  color: #141821;
  position: relative;
  z-index: 1;
}

.hero__card-avail {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 1.5;
  color: #141821;
  letter-spacing: 0.6px;
  position: relative;
  z-index: 1;
}

/* Bottom Bar */
.hero__bottom {
  background: rgba(255, 255, 255, 0.85);
  padding: 4px 0 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.hero__bottom-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  width: 100%;
  margin-bottom: 6px;
}

/* Stats */
.hero__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: center;
  width: 367px;
  max-width: 100%;
}

.hero__stat-badge {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 4px;
}

.hero__laurel {
  flex-shrink: 0;
  width: 16px;
}

.hero__stat-content {
  text-align: center;
  flex: 1;
  padding: 0 2px;
}

.hero__stat-number {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding-left: 2px;
}

.hero__stat-val {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1;
  color: #0087d2;
}

.hero__stat-val-suffix {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 12px;
  color: #141821;
  letter-spacing: -2.64px;
}

.hero__stat-val-up {
  font-size: 16px;
  color: #0087d2;
  letter-spacing: -3.52px;
}

.hero__stat-text {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 12px;
  color: #141821;
}

.hero__stat-asterisk {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 6.45px;
  color: #141821;
  align-self: flex-end;
  padding-bottom: 8px;
}

.hero__stat-label {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1.4;
  color: #141821;
  text-align: center;
}

.hero__stats > *:not(:first-child) .hero__stat-label {
  margin-bottom: 2px;
}

.hero__stats > *:nth-child(2) .hero__stat-val {
  font-size: 22px;
  line-height: 1.2;
}

.hero__stats > *:nth-child(3) .hero__stat-val {
  font-size: 20px;
  line-height: 1.2;
}

/* Footnote */
.hero__footnote {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 1.5;
  color: #7f8288;
  padding: 0 16px;
  max-width: 100%;
}

/* ===== SP-only overrides ===== */
@media (min-width: 400px) and (max-width: 1159px) {
  .hero {
    background-size: cover;
    background-image: url(/assets/BOE/images/hero-bg-tb.webp);
  }
}
@media (max-width: 1159px) {
  .hero {
    max-width: 600px;
    margin: 0 auto;
  }
}

/* ===== PC Layout (1160px+) ===== */
@media (min-width: 1160px) {
  .hero {
    background-size: cover;
    background-position: center;
    min-height: 720px;
    background-image: url(/assets/BOE/images/hero-bg-pc.webp);
  }

  .hero__main {
    position: absolute;
    top: 66px;
    left: calc((100% - 980px) / 2 + 14px);
    width: 100%;
    padding: 0;
  }

  .hero__tag {
    font-size: 20px;
    letter-spacing: 1px;
    padding: 6px 16px;
  }

  .hero__heading {
    margin-top: 19px;
    font-weight: 700;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 6px;
  }

  .hero__heading-line1 {
    font-size: 40px;
    line-height: 1.1;
  }

  .hero__heading-line1 .hero__heading-close-tight {
    letter-spacing: -5.12px;
  }

  .hero__heading-line2 {
    flex-direction: row;
    align-items: flex-end;
    margin-right: -8px;
    width: 100%;
  }

  .hero__heading-quoted {
    gap: 0;
  }

  .hero__heading-accent-wrap {
    width: max-content;
  }

  .hero__heading-open-q,
  .hero__heading-close-q {
    font-size: 40px;
    font-weight: 900;
    line-height: 1;
  }

  .hero__heading-accent-wrap::after {
    border-bottom-width: 16px;
    bottom: -6px;
  }

  .hero__heading-accent {
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
  }

  .hero__heading-suffix {
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
    padding-left: 0;
    color: #141821;
    width: 100%;
  }

  .hero__cta {
    margin-top: -8px;
  }

  .hero__features {
    margin-top: 24px;
  }

  .hero__feature {
    font-size: 18px;
    letter-spacing: 0.9px;
    text-shadow: 0 0 20px white, 0 0 20px white, 0 0 20px white, 0 0 20px white, 0 0 20px white;
  }

  .hero__feature-icon {
    font-size: 20px;
  }

  .hero__cards {
    margin-top: 24px;
    gap: 16px;
  }

  .hero__card {
    width: 194px;
  }

  .hero__card-body {
    padding: 8px 12px 12px;
  }

  .hero__card-header {
    font-size: 16px;
    padding: 6px 4px 8px;
  }

  .hero__card-header span.material-symbols-outlined {
    font-variation-settings: "FILL" 0, "wght" 500, "GRAD" 0, "opsz" 24;
  }

  .hero__card-header svg {
    width: 16px;
    height: 16px;
  }

  .hero__card-price-num {
    font-size: 48px;
  }

  .hero__card-price-yen {
    font-size: 20px;
  }

  .hero__card-price-tilde {
    font-size: 20px;
  }

  .hero__card-note {
    font-size: 14px;
  }

  .hero__card-desc {
    font-size: 16px;
  }

  .hero__card-time-row {
    margin-top: 12px;
  }

  .hero__card-time-num {
    font-size: 48px;
  }

  .hero__card-time-unit {
    font-size: 20px;
  }

  .hero__card-time-pre {
    font-size: 16px;
  }

  .hero__card-time-note {
    font-size: 16px;
  }

  .hero__card-avail {
    font-size: 16px;
  }

  .hero__bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 8px 8px 16px;
    gap: 12px;
  }

  .hero__bottom-inner {
    flex-direction: row;
    gap: 47px;
    width: 980px;
    max-width: 100%;
    margin: 0 auto;
  }

  .hero__stats {
    flex-wrap: wrap;
    gap: 16px;
    width: auto;
    flex: 1;
    justify-content: flex-start;
  }

  .hero__stat-badge {
    flex: 0 0 auto;
    padding: 4px;
    gap: 8px;
  }

  .hero__stat-badge svg {
    width: 24px;
    height: 57px;
  }

  .hero__laurel {
    width: 24px;
    height: 56.54px;
  }

  .hero__stat-val {
    font-size: 26px;
  }

  .hero__stat-val-suffix {
    font-size: 20px;
    letter-spacing: -4.4px;
  }

  .hero__stat-val-up {
    font-size: 24px;
    letter-spacing: -5.28px;
  }

  .hero__stat-text {
    font-size: 20px;
  }

  .hero__stat-asterisk {
    font-size: 9px;
    padding-bottom: 8px;
  }

  .hero__stat-label {
    font-size: 20px;
  }

  .hero__footnote br {
    display: none;
  }
}

/* ===================================================
   Block02 Section — "こんな壁や不安に…"
   SP default + PC override at 1160px
   =================================================== */

/* ── Section wrapper ── */
.b02 {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #fff;
  max-width: 600px;
  margin: 0 auto;
}

/* ── Gray top area (heading + cards) ── */
.b02__top {
  background: #ebeef1;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  padding: 48px 16px 24px;
}

/* Header box with corner brackets */
.b02__header {
  position: relative;
  padding: 17px 32px;
  text-align: center;
}

.b02__corner {
  position: absolute;
  display: block;
  width: 24px;
  height: 24px;
}
.b02__corner--tl {
  top: 1px;
  left: 0;
  border-top: 1px solid #0087d2;
  border-left: 1px solid #0087d2;
}
.b02__corner--br {
  bottom: -1px;
  right: 0;
  border-bottom: 1px solid #0087d2;
  border-right: 1px solid #0087d2;
}

.b02__dots {
  position: absolute;
  top: 4px;
  right: 81px;
  font: 700 19px 'Noto Sans JP', sans-serif;
  color: #0087d2;
  letter-spacing: 2px;
  line-height: 1;
  pointer-events: none;
}

/* Heading */
.b02__heading {
  font: 700 20px 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: center;
  letter-spacing: 0.4px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.b02__heading-line1,
.b02__heading-line2 {
  display: block;
  line-height: 32px;
}
.b02__heading-accent {
  color: #0087d2;
  font-size: 28px;
  letter-spacing: 0.56px;
}

/* ── Cards ── */
.b02__cards {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: 600px;
}

.b02__card {
  position: relative;
  background: #fff;
  border-radius: 16px;
  border: 4px solid #99cfed;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 8px;
  padding: 20px 12px 12px 4px;
}

.b02__card-label {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: #0087d2;
  color: #fff;
  font: 700 12px 'Noto Sans JP', sans-serif;
  line-height: 1.5;
  white-space: nowrap;
  padding: 2px 16px;
  border-radius: 32px;
}

.b02__card-illust {
  flex-shrink: 0;
  width: 72px;
  height: 77px;
}
.b02__card-illust img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.b02__card-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.b02__card-text {
  font: 500 14px 'Noto Sans JP', sans-serif;
  color: #141821;
  line-height: 1.5;
  word-break: break-word;
  letter-spacing: 0;
}
.b02__card-divider {
  border: none;
  margin: 0;
  width: 100%;
  background-image: linear-gradient(to right, #D1D4D7, #D1D4D7 3px, transparent 3px, transparent 8px);
  background-repeat: repeat-x;
  background-size: 7px 2px;
  background-position: left bottom;
  padding-bottom: 2px;
}

/* ── Arrow: full-width gray triangle ── */
.b02__arrow {
  width: 100%;
  margin-top: -1px;
  overflow: hidden;
  line-height: 0;
}
.b02__arrow svg {
  display: block;
  width: 100%;
  height: 78px;
}

/* ── White bottom area (copy) ── */
.b02__bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 24px 16px 72px;
  margin-top: -78px;
  width: 100%;
  text-align: center;
}

.b02__copy-main {
  font: 500 14px 'Noto Sans JP', sans-serif;
  color: #141821;
  line-height: 1.75;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.b02__copy-accent {
  color: #0087d2;
  font-weight: 700;
}

.b02__copy-rate {
  font: 500 14px 'Noto Sans JP', sans-serif;
  color: #141821;
  line-height: 1.8;
  height: 17px;
  line-height: 17px;
}
.b02__copy-rate-num {
  font: 700 italic 22px/1.75 'Inter', sans-serif;
  color: #0087d2;
  vertical-align: baseline;
  line-height: 17px;
}

/* Banner */
.b02__copy-banner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 100%;
}
.b02__banner-row {
  display: flex;
  align-items: center;
  gap: 4px;
  font: 500 18px/1.75 'Noto Sans JP', sans-serif;
  color: #141821;
}
.b02__banner-hl {
  display: inline-block;
  background: #0087d2;
  color: #fff;
  font: 700 18px/1.75 'Noto Sans JP', sans-serif;
  padding: 0 6px;
}
.b02__banner-sub {
  font: 500 18px/1.75 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: center;
  display: block;
  line-height: 32px;
}

/* ── SP: cap width of cards ── */
@media (max-width: 1159px) {
  .b02__cards {
    margin: 0 auto;
  }
}

/* ── PC Layout (≥1160px) ── */
@media (min-width: 1160px) {
  /* Top */
  .b02__top {
    gap: 64px;
    padding: 72px 24px;
  }

  /* Header */
  .b02__header {
    padding: 33px 48px;
  }
  .b02__corner {
    width: 40px;
    height: 40px;
  }
  .b02__dots {
    font-size: 32px;
    right: 273px;
    top: 7px;
    letter-spacing: 0.64px;
  }

  /* Heading */
  .b02__heading {
    font-size: 32px;
    letter-spacing: 0.64px;
    gap: 8px;
  }
  .b02__heading-line1 {
    line-height: 1.2;
  }
  .b02__heading-line2 {
    line-height: 1.2;
  }
  .b02__heading-accent {
    font-size: 40px;
    letter-spacing: 0.8px;
  }
  .b02__heading-sp-br {
    display: none;
  }

  /* Cards: horizontal */
  .b02__cards {
    flex-direction: row;
    align-items: stretch;
    gap: 32px;
    width: 1080px;
    max-width: 1080px;
  }
  .b02__card {
    flex: 1;
    flex-direction: column;
    align-items: center;
    padding: 28px 20px;
    gap: 24px;
  }
  .b02__card-label {
    top: -20px;
    font-size: 20px;
    padding: 8px 20px;
  }
  .b02__card-illust {
    width: 120px;
    height: 120px;
    flex-shrink: 0;
  }
  .b02__card-body {
    gap: 15px;
    width: 100%;
  }
  .b02__card-text {
    font-size: 18px;
    line-height: 1.6;
  }

  /* Arrow: 320px centered on PC */
  .b02__arrow {
    display: flex;
    justify-content: center;
    margin-top: -1px;
    overflow: hidden;
  }
  .b02__arrow svg {
    width: 320px;
    height: 78px;
  }

  /* Bottom copy */
  .b02__bottom {
    gap: 16px;
    padding: 48px 24px 96px;
  }
  .b02__bottom > .flex.-gap4 {
    gap: 16px;
  }
  .b02 {
    max-width: none;
    margin: 0;
  }
  .b02__copy-main {
    flex-direction: row;
    gap: 0;
    font-size: 24px;
    font-weight: 700;
    height: 29px;
    line-height: 29px;
  }
  .b02__copy-sp-br,
  .b02__banner-sp-br {
    display: none;
  }
  .b02__copy-rate {
    font-size: 24px;
    height: 48px;
    font-weight: 700;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }
  .b02__copy-rate-num {
    font-size: 44px;
    line-height: 48px;
  }

  /* Banner: full blue bar on PC */
  .b02__copy-banner {
    flex-direction: row;
    justify-content: center;
    background: #0087d2;
    padding: 8px 24px;
    gap: 0;
    width: fit-content;
    border-radius: 4px;
  }
  .b02__banner-row {
    font-size: 24px;
    color: #fff;
    gap: 0;
    height: 29px;
  }
  .b02__banner-hl {
    background: transparent;
    color: #fff;
    font-size: 24px;
    line-height: 29px;
    padding: 0;
  }
  .b02__banner-sub {
    font-size: 24px;
    font-weight: 700;
    line-height: 29px;
    color: #fff;
    display: inline;
  }
  .b02__copy-rate-num {
    font-size: 48px;
    font-style: italic;
  }
}

/* ===================================================
   Block03 Section — "Bizmates 3つの強み / Strengths"
   SP default + PC override at 1160px
   =================================================== */

.b03 {
  background: #e7f3fa;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 48px 16px 48px;
  gap: 40px;
  max-width: 600px;
  margin: 0 auto;
}

/* Decorative rotated background text */
.b03__bg-wrap {
  position: absolute;
  left: -40px;
  top: 16px;
  width: 132px;
  height: 540px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.b03__bg-text {
  display: block;
  font: 700 88px/1.5 'Inter', sans-serif;
  color: #fff;
  white-space: nowrap;
  transform: rotate(90deg);
}

/* === Part 1: Bizmates 3つの強み === */

.b03__strengths {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: 100%;
  z-index: 10;
}

/* Speech-bubble balloon */
.b03__balloon {
  position: relative;
  width: 100%;
  height: 40px;
  background: linear-gradient(156.43deg, #4cabdf 11.272%, #0087d2 66.995%);
  border-radius: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font: 700 16px/1.5 'Noto Sans JP', sans-serif;
  white-space: nowrap;
}
.b03__balloon::after {
  content: '';
  position: absolute;
  bottom: -14px;
  left: calc(50% + 0.5px);
  transform: translateX(-50%);
  width: 16px;
  height: 16px;
  background: #0087d2;
  clip-path: polygon(0% 0%, 0% 100%, 100% 0%);
}

/* Gradient heading "Bizmates3つの強み" */
.b03__main-heading {
  background: linear-gradient(136.68deg, #4cabdf 11.272%, #0087d2 66.995%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  font: 700 28px/1.5 'Noto Sans JP', sans-serif;
  text-align: center;
  letter-spacing: 0.84px;
  white-space: nowrap;
}
.b03__heading-num {
  font-family: 'Inter', sans-serif;
  font-size: 48px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1.44px;
}

/* Strength cards list */
.b03__strength-cards {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

/* Individual strength card */
.b03__scard {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 12px rgba(11, 67, 104, 0.2);
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 24px 16px;
}

/* Card top: default — title above image */
.b03__scard-top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

/* Gradient card title */
.b03__scard-title {
  background: linear-gradient(90deg, #4cabdf 0%, #006eac 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  font: 700 20px/1.5 'Noto Sans JP', sans-serif;
  text-align: center;
  letter-spacing: 1px;
  white-space: nowrap;
}
/* "1%" inside the 採用率 title */
.b03__rate-num {
  font-family: 'Inter', sans-serif;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: 1.4px;
  line-height: 1.25;
}

/* Wide image (カリキュラム / 採用率) */
.b03__scard-img-wide {
  width: 312px;
  height: 114px;
  flex-shrink: 0;
}
.b03__scard-img-wide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* 70% card top: image-left + title-right */
.b03__scard-top--70 {
  flex-direction: row;
  align-items: center;
  gap: 8px;
  justify-content: center;
}
.b03__scard-70img {
  width: 136px;
  height: 136px;
  flex-shrink: 0;
}
.b03__scard-70img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.b03__scard-70title {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 146px;
}
.b03__scard-70label,
.b03__scard-70sub {
  background: linear-gradient(90deg, #4cabdf 0%, #006eac 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  font: 700 20px/1.5 'Noto Sans JP', sans-serif;
  letter-spacing: 1px;
  white-space: nowrap;
  width: fit-content;
}
.b03__scard-70num {
  background: linear-gradient(90deg, #4cabdf 0%, #006eac 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  white-space: nowrap;
  line-height: 1.5;
  letter-spacing: 1px;
  margin: -4px 0;
  width: fit-content;
}
.b03__70bracket { font-size: 32px; letter-spacing: 1.6px; }
.b03__70approx  { font-size: 28px; letter-spacing: 1.4px; }
.b03__70pct {
  font-family: 'Inter', sans-serif;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: 1.6px;
}

/* Card bullet list */
.b03__scard-bullets {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.b03__scard-bullet {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font: 400 16px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
}
/* Blue checkmark icon */
span.material-symbols-outlined.b03__check-icon {
  flex-shrink: 0;
  font-family: 'Material Symbols Outlined', sans-serif;
  font-variation-settings: 'FILL' 0, 'wght' 700, 'GRAD' 0, 'opsz' 24;
  font-size: 24px;
  color: #0087d2;
  line-height: 1;
  user-select: none;
  white-space: nowrap;
}

/* === Divider: "英会話レッスンによくある こんな不安にも" === */

.b03__divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  position: relative;
  max-width: max-content;
}
.b03__divider::before,
.b03__divider::after {
  content: "";
  display: block;
  width: 2px;
  height: 62px;
  position: absolute;
  z-index: 0;
  bottom: 0;
  background-color: #0087d2;
}
.b03__divider::before {
  left: -18px;
  transform: rotate(-17deg);
}
.b03__divider::after{
  right: -18px;
  transform: rotate(17deg);
}
/* .head_w h2.-center{
  margin-left: auto;
  margin-right: auto;
} */


.b03__divider-text {
  font: 700 18px/1.5 'Noto Sans JP', sans-serif;
  color: #006eac;
  text-align: center;
  white-space: nowrap;
  margin-bottom: 6px;
}

/* === Part 2: Anxiety cards === */

.b03__anxiety-cards {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}
.b03__acard {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(11, 67, 104, 0.2);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Gray header */
.b03__acard-header {
  background: #7f8288;
  padding: 16px 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.b03__acard-header h3 {
  font: 500 18px/1.5 'Noto Sans JP', sans-serif;
  color: #fff;
  text-align: center;
  white-space: nowrap;
}
.b03__acard-header--2 p { font-size: 20px; }

/* White body */
.b03__acard-body {
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 32px 16px 24px;
  position: relative;
}

/* Downward gray arrow at top of body */
.b03__anxiety-arrow {
  position: absolute;
  top: 0;
  left: calc(50% - 1px);
  transform: translateX(-50%);
  width: 48px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.b03__anxiety-arrow svg {
  width: 24.908px;
  height: 48px;
  transform: rotate(90deg);
  display: block;
}

/* Highlighted text group */
.b03__acard-hl-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

/* Pink "業界唯一！" badge */
.b03__acard-badge {
  background: #d03086;
  color: #fff;
  font: 700 18px/1.5 'Noto Sans JP', sans-serif;
  padding: 0 8px;
  display: block;
  text-align: center;
}

/* Yellow-underline wrapper + bar */
.b03__hl-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.b03__hl-bar {
  position: absolute;
  inset: 0;
  border-bottom: 10px solid #ffed56;
  pointer-events: none;
}
.b03__acard-hl {
  font: 700 18px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: center;
  white-space: nowrap;
  position: relative;
}

/* Learning cycle image (16:9) */
.b03__acard-img-ratio {
  width: 100%;
  aspect-ratio: 640 / 360;
}
.b03__acard-img-ratio img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Chat image area */
.b03__acard-chat-wrap { width: 100%; }
.b03__chat-sp {
  display: block;
  width: 309px;
  height: 327px;
  object-fit: contain;
  margin: 0 auto;
}
.b03__chat-pc { display: none; }
.b03__chat-note {
  font: 400 10px/1.5 'Noto Sans JP', sans-serif;
  color: #7f8288;
  white-space: nowrap;
}

/* Card description */
.b03__acard-desc {
  font: 400 16px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
  width: 100%;
}

/* ── PC Layout (≥1160px) ── */
@media (min-width: 1160px) {
  .b03 {
    max-width: none;
    margin: 0;
    padding: 96px 80px;
    gap: 80px;
  }

  /* BG text: larger, semi-transparent */
  .b03__bg-wrap {
    left: -48px;
    top: 32px;
    width: 218px;
    height: 1110px;
  }
  .b03__bg-text {
    font-size: 180px;
    font-weight: 800;
    opacity: 0.5;
  }

  /* Balloon: auto-width on PC */
  .b03__balloon {
    width: auto;
    font-size: 20px;
    padding: 0 24px;
  }

  /* Main heading */
  .b03__main-heading { font-size: 36px; letter-spacing: 1.08px; }
  .b03__heading-num  { font-size: 56px; letter-spacing: 1.68px; }

  /* Strengths container */
  .b03__strengths {
    gap: 16px;
    width: 1080px;
    max-width: 1080px;
  }

  /* 3-column cards */
  .b03__strength-cards { flex-direction: row; align-items: stretch; gap: 24px; }
  .b03__scard { flex: 1; }
  .b03__strength-cards > *:nth-child(2) { justify-content: center; }

  /* Divider: larger */
  .b03__divider { gap: 24px; margin-bottom: 0; }
  .b03__divider-brk { width: 27px; height: 81px; }
  .b03__part2.flex.-gap16 { gap: 24px; }
  .b03__divider-text { margin-bottom: 0; }
  .b03__divider::before,
  .b03__divider::after {
    width: 4px;
    height: 85px;
    border-radius: 4px;
  }
  .b03__divider::before {
    left: -35px;
    transform: rotate(-17deg);
  }
  .b03__divider::after{
    right: -35px;
    transform: rotate(17deg);
  }

  .b03__brk-path { stroke-width: 4; }
  .b03__divider-text { font-size: 28px; }

  /* 2-column anxiety cards */
  .b03__anxiety-cards {
    flex-direction: row;
    align-items: stretch;
    gap: 24px;
    width: 1080px;
    z-index: 100;
    position: relative;
    max-width: 1080px;
  }
  .b03__acard { flex: 1; }
  .b03__acard-body { padding: 32px; }

  .b03__acard-header h3    { font-size: 22px; }
  .b03__acard-header--2 p  { font-size: 24px; }
  .b03__acard-badge        { font-size: 22px; }
  .b03__acard-hl           { font-size: 22px; }

  /* Swap chat images for PC version */
  .b03__chat-sp { display: none; }
  .b03__chat-pc { display: block; width: 100%; height: auto; object-fit: contain; }
}

/* =========================================================
   Block04 — SectionBeginner: ビジネス英語＝難しいは誤解です
   ========================================================= */

/* SP defaults */
.b04 {
  background: #fff;
  border-top: 1px solid #ebeef1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 48px 14px;
  gap: 24px;
  max-width: 600px;
  margin: 0 auto;
}

/* Heading block with corner brackets */
.b04__heading-wrap {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  padding: 17px 32px;
}
.b04__corner {
  position: absolute;
  width: 28px;
  height: 28px;
  display: block;
}
.b04__corner svg { display: block; width: 100%; height: 100%; }
.b04__corner--tl { top: 0; left: 0; }
.b04__corner--br { bottom: 0; right: 0; transform: rotate(180deg); }
.b04__dots {
  position: absolute;
  top: 4px;
  left: 174px;
  transform: inherit;
  font: 700 20px/1 'Noto Sans JP', sans-serif;
  color: #0087d2;
  letter-spacing: 0.4px;
  white-space: nowrap;
}
.b04__heading {
  font: 700 20px/1.6 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: center;
  letter-spacing: 0.4px;
  white-space: nowrap;
}
.b04__heading > *:last-child {
  line-height: 32px;
  height: 32px;
}
.b04__heading-accent {
  color: #0087d2;
  font-size: 26px;
  letter-spacing: 0.76px;
}

/* Main content area */
.b04__main {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  width: 100%;
}

/* Stat row */
.b04__stat {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  justify-content: center;
}
.b04__stat-img { width: 138px; height: 138px; flex-shrink: 0; }
.b04__stat-img img { width: 100%; height: 100%; object-fit: contain; display: block; }
.b04__stat-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  max-width: 197px;
}
.b04__beginner-mark {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  transform: scaleX(-1);
}
.b04__beginner-mark svg { display: block; width: 100%; height: 100%; }
.b04__stat-text {
  font: 700 20px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: left;
}
.b04__stat-hl {
  position: relative;
  display: inline;
  background: linear-gradient(transparent 65%, #FFED56 0);
  white-space: nowrap;
}
.b04__stat-hl::after {
  content: '';
  position: absolute;
  bottom: 2px;
  left: 0;
  right: 0;
  height: 8px;
  background: #ffed56;
  z-index: -1;
}

/* Description */
.b04__desc-br { display: none; }
.b04__desc {
  font: 500 16px/1.75 'Noto Sans JP', sans-serif;
  color: #141821;
  width: 100%;
  margin-bottom: 16px;
}

/* Info cards */
.b04__info-cards {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.b04__info-card {
  background: #e7f3fa;
  border: 2px solid #4cabdf;
  border-radius: 8px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
}
.b04__info-card-head {
  display: flex;
  align-items: center;
  gap: 4px;
  font: 500 16px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
}
span.material-symbols-outlined.b04__check-icon {
  flex-shrink: 0;
  font-family: 'Material Symbols Outlined', sans-serif;
  font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 24;
  font-size: 16px;
  color: #0087d2;
  line-height: 1;
  user-select: none;
  white-space: nowrap;
}
.b04__info-card-body {
  font: 400 16px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
}

/* ── PC overrides (≥ 1160px) ── */
@media (min-width: 1160px) {
  .b04 { padding: 96px 80px; max-width: 100%; }

  .b04__heading-wrap { padding: 33px 48px; }
  .b04__corner { width: 40px; height: 40px; }
  .b04__dots { font-size: 32px; top: -2px; left: 275px; }
  .b04__heading.flex.-gap4 {
    font-size: 32px; 
    line-height: 32px;
    flex-direction: row;
  }
  .b04__heading > *:last-child {
    display: inline-flex;
  }
  .b04__heading-accent { font-size: 38px; }
  .b04__heading-br { display: none; }

  .b04__main { width: 1080px; max-width: 1080px; gap: 24px; }

  .b04__stat { gap: 24px; justify-content: center; }
  .b04__stat-img { width: 200px; height: 200px; }
  .b04__stat-body { gap: 24px; max-width: 277px; }
  .b04__beginner-mark { width: 48px; height: 48px; }
  .b04__stat-text { font-size: 28px; }
  .b04__stat-hl::after { height: 10px; }

  .b04__desc { font-size: 20px; margin-bottom: 8px; text-align: center; }
  .b04__desc-br { display: inline; }

  .b04__info-cards { flex-direction: row; gap: 24px; align-items: stretch; }
  .b04__info-card { padding: 22px; }
}

/* =========================================================
   Block05 — 受講生の声 (Voice / Testimonials)
   ========================================================= */

/* SP defaults */
.b05 {
  background: #e7f3fa;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 48px 16px;
  gap: 24px;
  max-width: 600px;
  margin: 0 auto;
}

/* Decorative VOICE bg text */
.b05__bg-wrap {
  position: absolute;
  left: -32px;
  top: 16px;
  width: 132px;
  height: 276px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.b05__bg-text {
  display: block;
  font: 700 88px/1.5 'Inter', sans-serif;
  color: #fff;
  white-space: nowrap;
  transform: rotate(90deg);
}

/* Heading */
.b05__heading-wrap {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 9px 32px 17px;
  z-index: 1;
}
.b05__corner {
  position: absolute;
  width: 24px;
  height: 24px;
  display: block;
}
.b05__corner svg { display: block; width: 100%; height: 100%; }
.b05__corner--tl { top: 0; left: 0; }
.b05__corner--br { bottom: 0; right: 0; transform: rotate(180deg); }
.b05__heading-sub {
  font: 500 12px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
  letter-spacing: 0.24px;
  text-align: center;
  white-space: nowrap;
}
.b05__heading {
  font: 700 20px/32px 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: center;
  letter-spacing: 0.4px;
  white-space: nowrap;
}
.b05__heading-main { font-size: 20px; }
.b05__heading-accent {
  color: #0087d2;
  font-size: 28px;
}
.b05__heading-br { display: inline; }

/* Cards container */
.b05__cards {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  z-index: 1;
  max-width: 343px;
  margin: 0 auto;
}

/* Individual card */
.b05__card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 2px 8px rgba(20, 24, 33, 0.1);
  overflow: hidden;
  position: relative;
  width: 100%;
}
.b05__card-triangle {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 98px;
  height: 98px;
  pointer-events: none;
}
.b05__card-triangle svg { display: block; width: 100%; height: 100%; }
.b05__card-inner {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
}

/* Profile row */
.b05__profile {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}
.b05__avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
  display: block;
}
.b05__profile-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: center;
  align-self: stretch;
}
.b05__profile-name {
  font: 500 12px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
}
.b05__profile-tags {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.b05__tag {
  background: #fff;
  border: 1px solid #0087d2;
  border-radius: 4px;
  padding: 2px 6px;
  font: 500 12px/1.5 'Noto Sans JP', sans-serif;
  color: #0087d2;
  white-space: nowrap;
}

/* Quote block */
.b05__quote {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 98px;
}
.b05__quote-sub {
  font: 500 12px/1.5 'Noto Sans JP', sans-serif;
  color: #54575f;
}
.b05__quote-main {
  font: 700 18px/1.5 'Noto Sans JP', sans-serif;
  color: #0087d2;
}

/* CTA button */
.b05__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  background: #fff;
  border: 1px solid #0087d2;
  border-radius: 8px;
  font: 500 14px/1.5 'Noto Sans JP', sans-serif;
  color: #0087d2;
  text-decoration: none;
  text-align: center;
  transition: all .3s ease;
}
.b05__btn:hover {
  background-color: #e7f3fa;
}

/* ── PC overrides (≥ 1160px) ── */
@media (min-width: 1160px) {
  .b05 { padding: 96px 80px; gap: 40px; max-width: 100%; margin: 0; }

  .b05__bg-wrap { left: -48px; top: 32px; width: 218px; height: 540px; }
  .b05__bg-text { font-size: 180px; font-weight: 800; opacity: 0.5; }

  .b05__heading-wrap { padding: 24px 48px 40px; gap: 8px; }
  .b05__corner { width: 40px; height: 40px; }
  .b05__heading-sub { font-size: 16px; letter-spacing: 0.32px; }
  .b05__heading.flex.-column.-gap4.-center {
    flex-direction: row;
    gap: 0;
  }
  .b05__heading { font-size: 32px; letter-spacing: 0.64px; }
  .b05__heading-main { font-size: 32px; }
  .b05__heading-accent { font-size: 40px; }
  .b05__heading-br { display: none; }

  .b05 { gap: 48px; }
  .b05__heading { height: 32px; display: flex; gap: 0; }
  .b05__cards { flex-direction: row; align-items: stretch; width: fit-content; max-width: 100%; }
  .b05__card { flex: 1; max-width: 448px; height: fit-content; }
  .b05__profile-name { font-size: 16px; }
  .b05__tag { font-size: 16px; }
  .b05__quote-sub { font-size: 16px; }
  .b05__quote-main { font-size: 22px; }
  .b05__btn { font-size: 16px; }
}

/* ===== Block06 — Pricing ===== */
.b06 {
  background: #fff;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 48px 16px;
  gap: 24px;
  max-width: 600px;
  margin: 0 auto;
}

/* Decorative PRICE background text */
.b06__bg-wrap {
  position: absolute;
  left: -34px;
  top: 16px;
  width: 132px;
  height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.b06__bg-text {
  display: block;
  font: 700 88px/1.5 'Inter', sans-serif;
  color: #e7f3fa;
  white-space: nowrap;
  transform: rotate(90deg);
}

/* Heading box with corner brackets */
.b06__heading-wrap {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  padding: 9px 32px 17px;
  gap: 12px;
  z-index: 1;
}
.b06__corner {
  position: absolute;
  width: 24px;
  height: 24px;
  display: block;
}
.b06__corner--tl { top: 0; left: 0; }
.b06__corner--br { bottom: 0; right: 0; transform: rotate(180deg); }
.b06__heading-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.b06__heading-line1 {
  font: 700 20px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: center;
  letter-spacing: 0.4px;
  white-space: nowrap;
}
.b06__heading-line2 {
  font: 700 20px/32px 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: center;
  letter-spacing: 0.4px;
  white-space: nowrap;
  height: 32px;
}
.b06__heading-num {
  font: 700 32px/32px 'Inter', sans-serif;
  font-style: normal;
  color: #0087d2;
}
.b06__heading-yen {
  color: #0087d2;
  font-size: 20px;
}
.b06__heading-dots {
  position: absolute;
  font: 700 22px/1 'Noto Sans JP', sans-serif;
  color: #0087d2;
  left: 167px;
  top: 66px;
  transform: translateX(-50%);
  letter-spacing: -3.3px;
  white-space: nowrap;
  pointer-events: none;
}

/* Plan cards container */
.b06__cards {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  z-index: 1;
  max-width: 343px;
  margin: 0 auto;
}

/* Individual plan card */
.b06__card {
  background: #fff;
  border: 1px solid #0087d2;
  border-radius: 16px;
  overflow: hidden;
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
}
.b06__card-badge {
  position: absolute;
  top: 0;
  left: 0;
  width: 96px;
  height: 96px;
  z-index: 2;
  border-radius: 14px 0 0 0;
  overflow: hidden;
  pointer-events: none;
}
.b06__card-badge img {
  width: 96px;
  height: 96px;
  object-fit: cover;
  display: block;
}
.b06__card-header {
  background: #e7f3fa;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 23px 16px 16px;
  text-align: center;
}
.b06__card-title {
  font: 700 24px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
}
.b06__card-title p { white-space: nowrap; }
.b06__card-sub {
  font: 400 14px/1.5 'Noto Sans JP', sans-serif;
  color: #54575f;
  white-space: nowrap;
}
.b06__card-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 24px 16px 23px;
}
.b06__card-off {
  background: #fff288;
  font: 500 20px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
  padding: 0 8px;
  text-align: center;
  white-space: nowrap;
}
.b06__card-price {
  display: flex;
  align-items: center;
  gap: 8px;
}
.b06__card-price-label {
  font: 400 18px/1.2 'Noto Sans JP', sans-serif;
  color: #141821;
  white-space: nowrap;
}
.b06__card-price-num {
  font: 700 56px/1 'Inter', sans-serif;
  font-style: italic;
  color: #d03086;
  white-space: nowrap;
}
.b06__card-price-suffix {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding-bottom: 8px;
  align-self: flex-end;
}
.b06__card-price-taxin {
  display: block;
  font: 400 12px/1.1 'Noto Sans JP', sans-serif;
  color: #141821;
}
.b06__card-price-yen {
  display: block;
  font: 700 18px/1.1 'Noto Sans JP', sans-serif;
  color: #141821;
}
.b06__card-regular {
  font: 400 14px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: center;
  white-space: nowrap;
}
.b06__card-icons {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  width: 100%;
}
.b06__icon-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 6px 8px;
  border: 1px solid #0087d2;
  border-radius: 4px;
  width: 72px;
  height: 72px;
  flex-shrink: 0;
}
.b06__icon-label {
  font: 700 10px/1.2 'Noto Sans JP', sans-serif;
  color: #0087d2;
  text-align: center;
  white-space: nowrap;
}
.b06__svg-icon { display: block; flex-shrink: 0; }
.b06__double-clock {
  position: relative;
  width: 52px;
  height: 36px;
  flex-shrink: 0;
  padding-top: 6px;
}
.b06__svg-icon--left {
  position: absolute;
  top: 6px;
  left: 0;
  width: 26px;
  height: 26px;
}
.b06__svg-icon--right {
  position: absolute;
  top: 6px;
  left: 26px;
  width: 26px;
  height: 26px;
}
.b06__clock15-wrap {
  position: relative;
  width: 52px;
  height: 36px;
  flex-shrink: 0;
  overflow: hidden;
}
.b06__clock15-wrap .b06__svg-icon {
  position: absolute;
  inset: 13.49% 28.59% 4.68% 14.84%;
  width: auto;
  height: auto;
}
.b06__clock15-label {
  position: absolute;
  font: 700 0px/0 'Noto Sans JP', sans-serif;
  color: #0087d2;
  right: 8px;
  top: 23px;
  transform: translateX(50%);
  text-align: center;
  white-space: nowrap;
}
.b06__clock15-x { font-size: 7px; line-height: 1.2; }
.b06__clock15-num { font: 700 9px/1.2 'Inter', sans-serif; }

.b06__card-features {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  max-width: 272px;
}
.b06__card-feature {
  display: flex;
  align-items: center;
}
.b06__card-feature p,
.b06__card-feature-text {
  font: 400 14px/1.5 'Noto Sans JP', sans-serif;
  color: #141821;
  text-align: center;
  white-space: nowrap;
}
.b06__check-icon-wrap {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.b06__check-icon {
  font-size: 24px !important;
  color: #0087D2 !important;
  line-height: 1 !important;
  font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.b06__sup {
  font-size: 0.65em;
}
.b06__card-note {
  font: 400 10px/1.5 'Noto Sans JP', sans-serif;
  color: #7f8288;
  width: 100%;
  text-align: center;
}

/* ── PC overrides (≥ 1160px) ── */
@media (min-width: 1160px) {
  .b06 { padding: 96px 0 0; gap: 64px; max-width: 100%; margin: 0; }

  .b06__bg-wrap { left: -48px; top: 32px; width: 218px; height: 537px; }
  .b06__bg-text { font-size: 180px; font-weight: 800; opacity: 0.5; }

  .b06__heading-wrap { padding: 32px 48px; gap: 40px; }
  .b06__corner { width: 40px; height: 40px; }
  .b06__heading-line1.flex.-column.-gap4 {
    flex-direction: row;
    gap: 0;
  }
  .b06__heading-line1-br { display: none; }
  .b06__heading-inner { gap: 40px; }
  .b06__heading-dots { top: 68px; left: 252px; transform: translateX(50%); font-size: 32px; letter-spacing: 0.64px; }
  .b06__heading-line1 { font-size: 32px; letter-spacing: 0.64px; line-height: 32px; }
  .b06__heading-line2 { font-size: 32px; letter-spacing: 0.64px; display: flex; }
  .b06__heading-num { font-size: 48px; letter-spacing: 0.96px; }
  .b06__heading-yen { font-size: 32px; }

  .b06__cards {
    flex-direction: row;
    align-items: stretch;
    width: 1080px;
    max-width: 1080px;
    gap: 24px;
  }
  .b06__card { flex: 1; width: auto; }
  .b06__card-header { padding: 23px 16px 16px; }
  .b06__card-features { max-width: 296px; }
  .b06__card-sub { font-size: 16px; }
  .b06__card-body { padding: 24px 16px 23px; gap: 16px; }
  .b06__card-off { font-size: 24px; }
  .b06__card-price-label {
    font: 400 22px/1.1 'Noto Sans JP', sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: stretch;
  }
  .b06__card-price-num { font-size: 58px; }
  .b06__card-price-taxin { font-size: 16px; }
  .b06__card-price-yen { font-size: 22px; }
  .b06__card-regular { font-size: 16px; }
  .b06__card-feature { align-items: flex-start; }
  .b06__card-feature p,
  .b06__card-feature-text { font-size: 16px; text-align: left; white-space: normal; }
  .b06__card-note { margin-top: 16px; text-align: left; }
  .b06__card-icons { justify-content: flex-start; }
  .b06__check-icon { font-size: 20px !important; }
}

/* ===== Block07 — Coaching CTA ===== */
.b07 {
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px 16px 48px;
  max-width: 600px;
  margin: 0 auto;
}
.b07__card {
  background: #0087d2;
  border-radius: 16px;
  overflow: hidden;
  width: 100%;
  max-width: 343px;
  display: flex;
  flex-direction: column;
  margin-bottom: 7px;
}
.b07__header {
  background: #0087d2;
  padding: 16px 16px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.b07__header-text {
  font: 700 18px/1.5 'Noto Sans JP', sans-serif;
  color: #fff;
  text-align: left;
}
.b07__inner {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px 16px 24px;
}
.b07__image-wrap {
  border-radius: 8px;
  overflow: hidden;
  height: 160px;
  flex-shrink: 0;
}
.b07__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
  display: block;
}
.b07__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.b07__sup-text {
  font: 400 12px/1.5 'Noto Sans JP', sans-serif;
  color: #fff;
  text-align: center;
  letter-spacing: 0.6px;
}
.b07__logo {
  width: 238px;
  height: 28px;
  flex-shrink: 0;
}
.b07__logo svg { display: block; }
.b07__desc {
  font: 500 16px/1.75 'Noto Sans JP', sans-serif;
  color: #fff;
}
.b07__btn-wrap {
  width: 100%;
  height: 64px;
  display: flex;
  align-items: center;
}
.b07__btn {
  width: 100%;
  height: 64px;
  background: #0087d2;
  border: 1px solid #fff;
  border-radius: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 24px;
  position: relative;
  cursor: pointer;
}
.b07__btn-text {
  flex: 1;
  font: 700 14px/1.5 'Noto Sans JP', sans-serif;
  color: #fff;
  text-align: center;
  padding-right: 24px;
}
.b07__btn-arrow {
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.b07 .button.-fill {
  border: 1px solid #fff;
  color: #fff;
  max-width: 311px;
}
.b07 .button.-fill > span {
  width: 260px;
  margin-right: 24px;
  text-align: center;
}
.b07 .button.-fill::before {
  color: #fff;
}
.b07 .button.-fill:hover {
  background-color: #006EAC;
}

@media (min-width: 1160px) {
  .b07 { padding: 0 80px 96px; max-width: 100%; margin: 0; }
  .b07__card { max-width: 832px; width: 832px; }
  .b07__header { padding: 24px 40px 0; justify-content: flex-start; }
  .b07__header-text { font-size: 24px; white-space: nowrap; }
  .b07__header-br { display: none; }
  .b07__inner { flex-direction: row; gap: 24px; padding: 0 40px 24px; align-items: center; }
  .b07__image-wrap { flex: 1; height: auto; aspect-ratio: 936 / 480; }
  .b07__image { height: 100%; }
  .b07__content { flex: 1; align-items: center; padding: 16px 16px 24px 16px; max-width: 364px; }
  .b07__desc { text-align: left; }
}

/* ===== Block08 (FinalCTA) ===== */
.b08 {
  background: linear-gradient(99.29deg, #4cabdf 11.27%, #0087d2 67%);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 48px 16px;
  max-width: 600px;
  margin: 0 auto;
}
.b08__left {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  width: 100%;
  max-width: 343px;
}
.b08__heading-wrap {
  position: relative;
  width: 329px;
  height: 110px;
  flex-shrink: 0;
}
.b08__corner {
  position: absolute;
  width: 24px;
  height: 24px;
  display: block;
}
.b08__corner--tl { top: 0; left: 0; }
.b08__corner--br { bottom: 0; right: 0; transform: rotate(180deg); }
.b08__heading-inner {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0.58px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 8px 32px 16px;
}
.b08__heading-line1 {
  font: 700 24px/1.5 'Noto Sans JP', sans-serif;
  color: #fff;
  white-space: nowrap;
  text-align: center;
}
.b08__heading-line2 {
  font: 700 24px/1.5 'Noto Sans JP', sans-serif;
  color: #fff;
  text-align: center;
  white-space: nowrap;
}
.b08__heading-yellow { color: #ffed56; }
.b08__heading-dots {
  position: absolute;
  font: 700 24px/1 'Noto Sans JP', sans-serif;
  color: #ffed56;
  left: 140px;
  top: 39.86px;
  transform: translateX(-50%);
  white-space: nowrap;
  pointer-events: none;
}
.b08__desc {
  font: 500 14px/1.75 'Noto Sans JP', sans-serif;
  color: #fff;
  letter-spacing: 0.7px;
  width: 100%;
}
.b08__desc-sp-br { display: inline; }
.b08__right {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.b08__image-wrap {
  width: 311px;
  height: 207px;
  flex-shrink: 0;
}
.b08__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.b08__btn-outer {
  position: relative;
  width: 343px;
  flex-shrink: 0;
}
.b08__btn {
  background: #ffed56;
  box-shadow: 0 4px 6px rgba(20, 24, 33, 0.2);
  border-radius: 32px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px 10px;
  width: 100%;
  cursor: pointer;
  border: none;
  position: relative;
}
.b08__btn-badge {
  background: #d03086;
  border-radius: 32px;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  font: 700 19px/normal 'Noto Sans JP', sans-serif;
  color: #fff;
  flex-shrink: 0;
  padding: 2px 4px;
}
.b08__btn-texts {
  flex: 1;
  text-align: center;
  display: flex;
  flex-direction: column;
}
.b08__btn-sub {
  font: 500 12px/1.3 'Noto Sans JP', sans-serif;
  color: #141821;
}
.b08__btn-main {
  font: 700 19px/1.3 'Noto Sans JP', sans-serif;
  color: #141821;
}
.b08__btn-arrow {
  position: absolute;
  left: 297px;
  top: 25px;
  width: 22px;
  height: 22px;
}
.b08__btn-tag {
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  background: #141821;
  border-radius: 32px;
  padding: 2px 8px;
  font: 700 10px/normal 'Noto Sans JP', sans-serif;
  color: #fff;
  white-space: nowrap;
}
.b08__btn-tag-num {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 700;
  font-style: normal;
}
.b08 .oel_cta_w {
  margin-top: -10px;
}

@media (min-width: 1160px) {
  .b08 { flex-direction: row; align-items: center; justify-content: center; gap: 40px; padding: 48px 80px 64px; max-width: 100%; margin: 0; }
  .b08__left { align-items: flex-start; flex-shrink: 0; max-width: 608px; }
  .b08__heading-wrap { width: 457px; height: 162px; }
  .b08__corner { width: 40px; height: 40px; }
  .b08__heading-inner { gap: 32px; padding: 32px 48px; top: 1.03px; }
  .b08__heading-line1 { font-size: 32px; line-height: 32px; letter-spacing: 0.64px; }
  .b08__heading-line2 { font-size: 32px; line-height: 32px; letter-spacing: 0.64px; }
  .b08__heading-dots { font-size: 32px; left: 193.5px; top: 67.5px; }
  .b08__desc { font-size: 18px; letter-spacing: 0.9px; white-space: nowrap; }
  .b08__desc-sp-br { display: none; }
}

@media (max-width: 374px) {
  .hero {
    background-position: 70% -30%;
  }
  .hero__heading-quoted {
    height: calc(42/375 * 100vw);
  }
  .hero__heading-line1,
  .hero__heading-accent,
  .hero__heading-suffix {
    font-size: calc(26/375 * 100vw);
  }
  .hero__card-desc,
  .hero__card-avail {
    font-size: calc(12/375 * 100vw);
  }
  .hero__card-price-num,
  .hero__card-time-num {
    font-size: calc(40/375 * 100vw);
  }
  .hero__card-time-unit {
    font-size: calc(16/375 * 100vw);
  }
  .hero__cards {
    margin-top: 16px;
  }
  .hero__stat-badge {
    padding: 8px 0;
  }
  .hero__stat-content {
    padding: 0;
  }
  .hero__stat-val {
    font-size: calc(18/375 * 100vw);
  }
  .hero__stat-val-suffix,
  .hero__stat-text,
  .hero__stat-label,
  .hero__stat-val-up {
    font-size: calc(13/375 * 100vw);
  }
  .hero__stats > *:nth-child(2) .hero__stat-val {
    font-size: calc(22/375 * 100vw);
  }
  .hero__stats > *:nth-child(3) .hero__stat-val {
    font-size: calc(20/375 * 100vw);
  }
  .hero__laurel {
    width: calc(16/375 * 100vw);
    height: calc(38/375 * 100vw);
  }
  .oel_cta_btn__inner.button {
    width: calc(343/375 * 100vw);
    padding: calc(12/375 * 100vw) calc(16/375 * 100vw) calc(10/375 * 100vw);
  }
  .oel_cta_w .oel_cta_btn__text span {
    font-size: calc(12/375 * 100vw);
  }
  .oel_cta_w .oel_cta_btn__text {
    max-width: calc(209/375 * 100vw);
    font-size: calc(19/375 * 100vw);
    padding: 0;
    margin-left: 24px;
  }

  .b02__copy-rate {
    font-size: calc(14/375 * 100vw);
  }
  .b02__copy-main {
    font-size: calc(14/375 * 100vw);
  }
  .b02__copy-rate-num {
    font-size: calc(22/375 * 100vw);
  }
  .b03__part2 {
    width: 100%;
  }
  .b03__balloon {
    font-size: calc(16/375 * 100vw);
  }
  .b03__scard-img-wide {
    width: fit-content;
  }
  .b03__scard-70img {
    width: calc(136/375 * 100vw);
  }
  .b03__chat-note {
    font-size: calc(10/375 * 100vw);
    letter-spacing: 0;
  }
  .b03__scard-title,
  .b04__stat-text {
    font-size: calc(20/375 * 100vw);
  }
  .b04__stat-img {
    width: calc(138/375 * 100vw);
  }
  .b06__card-title {
    font-size: calc(24/375 * 100vw);
  }
  .b06__card-price-label,
  .b06__card-price-yen {
    font-size: calc(18/375 * 100vw);
  }
  .b06__card-price-num {
    font-size: calc(56/375 * 100vw);
  }
  .b06__card-price-taxin {
    font-size: calc(12/375 * 100vw);
  }
  .b06__card-feature p,
  .b06__card-feature-text {
    font-size: calc(14/375 * 100vw);
  }
  .b07__header-text {
    font-size: calc(18/375 * 100vw);
  }
  .b07__desc {
    font-size: calc(16/375 * 100vw);
  }
  .b07__btn {
    padding: 8px calc(24/375 * 100vw);
  }
  .b07__content .button.-fill {
    font-size: calc(14/375 * 100vw);
  }
  .b07__btn-text,
  .b08__desc {
    font-size: calc(14/375 * 100vw);
  }
  .b08__heading-inner {
    padding: 8px calc(32/375 * 100vw) 16px;
  }
  .b08__heading-wrap {
    width: calc(329/375 * 100vw);
  }
  .b08__heading-line1,
  .b08__heading-line2 {
    font-size: calc(24/375 * 100vw);
  }
  .b08__heading-dots {
    font-size: calc(24/375 * 100vw);
    left: calc(140/375 * 100vw);
  }
  .b08__image-wrap {
    width: calc(311/375 * 100vw);
    height: calc(207/375 * 100vw);
  }
}