:root {
  --light-green: #97c32b;
  --green: #277d4f;
  --text: #494949;
  --muted: #666;
  --bg: #fff;
  --card: #ffffff;
  --border: #e8e8e8;
}

/* 共通 */
.text-green {
  color: var(--light-green);
}

.sp-only {
  display: none;
}
.tab-only-none {
  display: block;
}
@media (max-width: 994px) {
  header .header_button {
    width: auto;
  }
}
@media (max-width: 767px) {
  section {
    margin-bottom: clamp(3.75rem, -2.917rem + 13.89vw, 7.5rem);
  }
  .tab-only-none {
    display: none;
  }
}
@media (max-width: 468px) {
  .sp-only {
    display: block;
  }
  .tab-only-none {
    display: block;
  }
}
/* ===============================
   メール会員登録ボタン
=============================== */

.mail-entry {
  text-align: center;
}

.mail-entry__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  max-width: 430px;
  width: 100%;
  margin: 0 auto;
  background: #f07a00;
  color: #ffffff;
  font-size: 22px;
  font-weight: 700;
  padding: 12px 30px;
  border-radius: 60px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid #f07a00;
}
.mail-entry__text {
  margin-bottom: -2px;
}

.mail-entry__btn img {
  width: 32px;
  height: auto;
}

/* Hover */
.mail-entry__btn:hover,
.contact-btn--mail:hover,
.contact-btn--tel:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.floating-btn .mail-entry__btn {
  gap: 8px;
  font-size: 16px;
  padding: 8px 10px;
  background: linear-gradient(0deg, #f19845 0%, #ec7302 100%);
  border: none;
}
.floating-btn .mail-entry__btn img {
  width: 22px;
}

/* SP */
@media (max-width: 480px) {
  .mail-entry {
    width: 85%;
    margin: 0 auto;
  }
  .mail-entry__btn {
    font-size: 18px;
    padding: 10px 20px;
  }

  .mail-entry__btn img {
    width: 26px;
  }
}

.fv {
  overflow: hidden;
}

.fv-visual-wrap {
  background-image: url(../images/fv/30fv_pc.jpg);
  background-size: cover;
  padding: 30px 0 0;
  min-height: 400px;
}

.fv-visual {
  max-width: 1200px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 0 15px;
}

/* 左スマホ */

.fv-phone img {
  width: clamp(7.813rem, 1.316rem + 22.16vw, 17.938rem);
}

/* 右女性 */

.fv-woman img {
  width: 520px;
}

@media (max-width: 994px) {
  .fv-woman img {
    width: clamp(26.25rem, 4.889rem + 44.44vw, 32.5rem);
  }
  .fv-woman {
    position: absolute;
    bottom: 0;
    right: 0;
  }
  .fv-visual-wrap {
    min-height: 350px;
  }
  .fv-visual {
    min-height: 350px;
    justify-content: space-between;
  }
}

@media (max-width: 767px) {
  .fv-woman img {
    width: clamp(17.5rem, 5.736rem + 40.13vw, 25rem);
  }
  .fv-visual {
    min-height: 300px;
  }
  .fv-visual-wrap {
    min-height: 300px;
  }
  .fv-title-main {
    font-size: clamp(2.125rem, 0.851rem + 4.35vw, 2.938rem);
  }
  .fv-title-middle {
    font-size: clamp(2.125rem, 0.851rem + 4.35vw, 2.938rem);
  }
  .fv-title-small {
    font-size: clamp(1.375rem, 0.591rem + 2.68vw, 1.875rem);
  }
  .fv-woman img {
    width: clamp(17.5rem, 3.775rem + 46.82vw, 26.25rem);
  }
}

/* 中央コピー */

.fv-copy {
  color: #fff;
}

/* CMバッジ */

.fv-badge {
  position: relative;
  display: inline-block;
  background: #267e4f;
  padding: 6px 8px 1px;
  font-size: clamp(1.25rem, 0.804rem + 0.93vw, 1.5rem);
  margin-bottom: 20px;
  border-radius: 5px;
}

.fv-badge::before {
  position: absolute;
  content: "";
  bottom: -15px;
  left: 30px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 6.5px 0 6.5px;
  border-color: #267e4f transparent transparent transparent;
}

/* メインコピー */

.fv-title {
  font-weight: 400;
  line-height: 1.4;
  color: #323232;
  text-shadow: 0 2px 4px rgba(255, 255, 255, 0.8);
}

.fv-title-small {
  display: block;
  font-size: clamp(1.25rem, 0.127rem + 3.83vw, 3rem);
}
.fv-title-small span {
  font-size: 0.5em;
  letter-spacing: 0.05em;
}

.fv-title-middle {
  display: block;
  font-size: clamp(2rem, 0.396rem + 5.47vw, 4.5rem);
}

.fv-title-main {
  display: block;
  font-size: clamp(2.25rem, 0.806rem + 4.92vw, 4.5rem);
}

@media (max-width: 468px) {
  .fv-title {
    text-align: center;
  }
  .fv-visual {
    flex-direction: column;
    align-items: flex-start;
  }

  .fv-visual-wrap {
    padding: 10px 0 0;
  }

  /* テキスト */

  .fv-copy {
    width: 100%;
    position: relative;
    padding-bottom: 200px;
  }

  /* 女性 */

  .fv-woman {
    width: 100%;
    text-align: center;
    margin-top: -10px;
  }

  .fv-woman img {
    width: 340px;
    position: inherit;
    bottom: 0;
  }

  /* スマホ */

  .fv-phone {
    width: 100%;
  }

  .fv-phone img {
    width: clamp(12.5rem, 8.707rem + 17.24vw, 13.75rem);
    position: absolute;
    bottom: 0;
    left: 0;
  }

  /* テキストサイズ調整 */

  .fv-title-small {
    font-size: 20px;
  }

  .fv-title-middle {
    font-size: 40px;
  }

  .fv-title-main {
    font-size: 40px;
  }

  /* CMバッジ */

  .fv-badge {
    font-size: 16px;
    margin-bottom: 12px;
  }
}

/* ===============================
   Contact Buttons (Bootstrap共存版)
=============================== */

.contact-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;

  max-width: 430px;
  width: 100%;
  margin: 0 auto;

  padding: 22px 30px;
  border-radius: 60px;

  font-size: 18px;
  font-weight: 700;
  text-decoration: none;

  transition: all 0.3s ease;
}

/* メール */
.contact-btn--mail {
  border: 3px solid #2e7d4e;
  color: #2e7d4e;
}
/* 電話 */
.contact-btn--tel {
  border: 3px solid #aaa;
  color: #666;
  padding: 10px 30px;
}
/* アイコン */
.contact-btn img {
  width: 28px;
}

/* 電話テキスト */
.contact-btn__teltext {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.contact-btn__number {
  font-size: 22px;
  font-weight: 700;
}

.contact-btn__time {
  font-size: 12px;
}

@media (max-width: 767px) {
  .contact-btn__number {
    font-size: 18px;
  }
  .contact-btn__time {
    font-size: 10px;
  }
}

/* 法人ボタン */
.contact-stock {
  display: inline-block;
  padding: 15px 40px;
  border: 2px solid #000;
  background: #d6d0c6;
  font-weight: 700;
  text-decoration: none;
  color: #000;
  transition: all 0.3s ease;
}

.contact-stock:hover {
  background: #000;
  color: #fff;
}

/* キャンペーン */
.campaign-label {
  display: inline-block;
  font-size: 14px;
  margin-top: 50px;
  border-radius: 3px;
  background-color: #e23632;
  color: #fff;
  padding: 5px 10px;
}

.campaign-note {
  margin: 0;
  font-size: 12px;
  color: #707070;
}

/* --- レイアウト設定 --- */
.plan-container {
  max-width: 1000px; /* 必要に応じて調整してください */
  margin: 0 auto;
  padding: 20px;
}

.plan-list {
  display: flex;
  /* 横並び時の間隔を50pxに固定 */
  gap: 50px;
  align-items: stretch; /* 高さを揃える */
}

.plan-list__item {
  /* 子要素を均等幅にする設定 */
  flex: 1;
  min-width: 0; /* flexアイテムの崩れ防止 */
  display: flex;
  flex-direction: column;
}

@media (max-width: 767px) {
  .plan-list {
    gap: 10px;
  }
  .plan-list__item {
    width: 100%;
  }
}

@media (max-width: 467px) {
  .contact-stock {
    padding: 15px 20px;
    white-space: nowrap;
    font-size: 12px;
  }
}

/* --- カード装飾 --- */
.plan-card {
  border: 2px solid #ccc;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  cursor: pointer;
  transition: opacity 0.3s;
  display: flex;
  flex-direction: column;
}

.plan-card:hover {
  opacity: 0.8;
}

.plan-card__header {
  padding: 20px;
  text-align: center;
  flex-grow: 1; /* 画像エリアを広げてフッター位置を揃える */
}

.plan-card__title {
  font-size: 1.25rem;
  font-weight: bold;
  margin: 0 0 20px 0;
}

.plan-card__image-wrapper {
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.plan-card__image {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.plan-card__footer {
  padding: 20px 10px;
  text-align: center;
  color: #fff;
}

.plan-card__txt {
  max-width: fit-content;
  margin: 0 auto;
}

.plan-card__price-main {
  margin: 0;
  font-weight: bold;
  display: flex;
  align-items: baseline;
  justify-content: center;
  flex-wrap: wrap;
  gap: 2px;
  font-size: 1.2rem;
}

.plan-card__number {
  font-size: 2.2rem;
  line-height: 1;
}

.plan-card__unit {
  font-size: 1.2rem;
  margin-right: 4px;
}

.plan-card__tax-label {
  font-size: 0.9rem;
}

.plan-card__price-sub {
  margin: 0;
  font-size: 0.85rem;
  opacity: 0.9;
  text-align: right;
}

/* --- カラーバリエーション --- */
.plan-list__item--box .plan-card {
  border-color: var(--light-green);
}
.plan-list__item--box .plan-card__title {
  color: var(--light-green);
}
.plan-list__item--box .plan-card__footer {
  background-color: var(--light-green);
}

.plan-list__item--space .plan-card {
  border-color: var(--green);
}
.plan-list__item--space .plan-card__title {
  color: var(--green);
}
.plan-list__item--space .plan-card__footer {
  background-color: var(--green);
}

/* 注釈 */
.plan-list__note {
  font-size: 0.75rem;
  text-align: right;
  margin-top: 8px;
  color: #333;
}

/* plan */
.price .tab-pane .tab-txt {
  border-bottom: 1px solid #d9d9d9;
}
.price .tab-content p.price-main {
  font-size: clamp(1.125rem, 0.501rem + 1.3vw, 1.313rem);
  font-weight: bold;
  position: relative;
  width: fit-content;
  margin: 0 auto;
  padding: 10px 65px;
}
.price .tab-content p.price-main::before {
  position: absolute;
  content: "";
  background-image: url(../images/new/character.png);
  width: 65px;
  height: 65px;
  background-size: contain;
  bottom: 0;
  right: 0;
}
.price .tab-content p small {
  font-size: clamp(0.875rem, 0.459rem + 0.87vw, 1rem);
}
@media (min-width: 995px) {
  .price .tab-content p small span.small {
    font-size: clamp(0.8125rem, 0.4rem + 0.87vw, 0.5rem);
  }
}
.price-bottom {
  max-width: 95%;
  margin: 0 auto;
}
/* ===============================
   横並び構造
=============================== */

.price-bottom__row {
  display: grid;
  grid-template-columns: 0.75fr 1fr;
  max-width: 92%;
  margin: 0 auto;

  align-items: center;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 1rem;
}
.price-bottom__row.__spaceplan {
  grid-template-columns: 0.5fr 1.5fr;
}

/* 左側タイトル */
.price-bottom__title {
  font-size: clamp(1rem, 0.168rem + 1.73vw, 1.25rem);
  font-weight: bold;
  white-space: nowrap;
}

/* 右側画像群 */
.price-bottom__items {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}

/* アイテム */
.price-bottom__item {
  text-align: center;
}

.price-bottom__image {
  width: 120px;
  height: auto;
  object-fit: contain;
}
.price-bottom__row.__spaceplan .price-bottom__image {
  width: 80px;
  margin-top: 20px;
}

.price-bottom__items.__spaceplan .price-bottom__item.__last {
  width: 160px;
}

.price-bottom__label {
  margin-top: 10px;
  font-size: 0.9rem;
}

.price-bottom-txt {
  color: #fff;
  padding: 10px clamp(0.375rem, -0.963rem + 2.78vw, 1.125rem);
  border-radius: 6px;
  font-weight: bold;
  text-align: center;
  font-size: clamp(0.938rem, 0.826rem + 0.23vw, 1rem);
}
.price-bottom-txt.__lightgreen {
  background: var(--light-green);
}

.price-bottom-txt.__green {
  background: var(--green);
}

.price-bottom-txt.__green + p {
  margin-top: 1rem;
  margin-bottom: 0;
  text-align: center;
  font-size: clamp(0.938rem, 0.826rem + 0.23vw, 1rem);
}
@media screen and (max-width: 767px) {
  .price-bottom-txt.__green + p {
    font-size: 14px;
    margin-top: 0.5rem;
  }
}

.price-bottom-notice {
  width: fit-content;
  margin: 0 0 0 auto;
  font-size: clamp(0.938rem, 0.826rem + 0.23vw, 0.5rem);
}

/* ===============================
   SP対応
=============================== */
@media (max-width: 994px) {
  .price-bottom {
    max-width: 100%;
    margin: 0 auto;
  }
  .price .tab-content p.price-main {
    padding: 10px 25px;
    font-size: clamp(0.938rem, 0.77rem + 0.57vw, 1.125rem);
    width: auto;
  }
  .price-bottom-txt {
    font-size: clamp(0.813rem, 0.701rem + 0.38vw, 0.938rem);
  }
}

@media (max-width: 767px) {
  .plan-card__price-main {
    font-size: 12px;
    font-weight: 400;
    gap: 0;
  }
  .plan-card__footer {
    padding: 10px 5px;
  }
  .plan-card__price-sub {
    font-size: 12px;
  }
  .plan-card__tax-label {
    font-size: 8px;
  }
  .plan-card__unit {
    font-size: 12px;
    margin-right: 0;
  }
  .plan-card__number {
    font-size: 16px;
    font-weight: bold;
  }
  .plan-container {
    padding: 10px;
  }
  .price .tab-content p.price-main {
    padding: 10px 0px;
    font-size: 14px;
    width: auto;
  }
  .price .tab-content p small {
    display: block;
    font-size: 12px;
  }

  .price-bottom__row {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .price-bottom__title {
    white-space: normal;
    margin-bottom: 20px;
  }

  .price-bottom__items {
    gap: 20px;
    justify-content: center;
  }
  .price-bottom__item {
    text-align: center;
    width: calc((100% / 4) - 0px);
  }
  .price-bottom__image {
    width: 90px;
  }
  .price-bottom-txt.__lightgreen {
    font-size: 14px;
    font-weight: 700;
    padding: 10px 5px;
  }
  .plan-card__title {
    font-size: 12px;
  }
  .plan-card__image-wrapper {
    height: 110px;
  }
  .price-bottom__row {
    gap: 0;
  }
}

@media (max-width: 468px) {
  .plan-card__header {
    padding: 15px 5px;
  }
  .price-bottom__title {
    margin-bottom: 0;
  }

  .price-bottom-notice {
    display: none;
  }
  .price-bottom__items {
    gap: 0;
  }

  .price-bottom__label {
    font-size: 9px;
  }
}

/* ===============================
   Comparison Section
=============================== */

.comparison-section {
  background: #f4f4f4;
  padding: 60px 20px 20px;
  margin-bottom: 3rem;
}

.comparison-section__container {
  max-width: 1100px;
  margin: 0 auto;
}

.comparison-section__grid {
  display: flex;
  gap: clamp(1.5rem, -0.284rem + 3.71vw, 2.5rem);
  justify-content: space-between;
  flex-wrap: wrap;
}

/* 各ブロック */
.comparison-section__block {
  flex: 1;
  min-width: 320px;
}

/* 見出し */
.comparison-section__heading {
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: 15px;
}

/* 画像 */
.comparison-section__image {
  margin-bottom: 5px;
}

.comparison-section__img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 18px;
}

/* テキスト */
.comparison-section__text {
  font-size: 1rem;
  line-height: 1.8;
  color: #333;
}

/* 強調 */
.comparison-section__highlight {
  color: #97c32b;
  font-weight: 700;
}

/* ===============================
   Responsive
=============================== */

@media (max-width: 991px) {
  .comparison-section {
    padding: 70px 20px 40px;
  }
  .comparison-section__heading {
    font-size: 1.15rem;
  }
}
@media (max-width: 767px) {
  .comparison-section__grid {
    gap: 30px;
  }
  .comparison-section {
    padding: clamp(1.875rem, 0.966rem + 4.55vw, 4.375rem) 10px 40px;
  }
}
@media (max-width: 468px) {
  .comparison-section__grid {
    flex-direction: column;
  }
}
/* ===============================
   Base
=============================== */
.point3 {
  padding: 80px 0px 0;
  background: #fff;
}

.point3__container {
  max-width: 1100px;
  margin: 0 auto;
}

/* ===============================
   Title
=============================== */
.point3__title {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 8px;
}

.point3__no {
  font-size: 32px;
  font-weight: 700;
  color: var(--light-green);
}

.point3__title h3 {
  font-size: 22px;
  margin: 0;
}

/* ===============================
   01 Layout
=============================== */
.point3__flex {
  display: flex;
  gap: clamp(1.25rem, 0.448rem + 2.74vw, 2.5rem);
  align-items: flex-start;
}

/* .point3__flex .point3__image {
  flex: auto;
} */
.point3__flex .point3__image {
  flex: 1 0 45%;
}

.point3__image {
  flex: 1;
}

.point3__image img {
  width: 100%;
  height: auto;
  aspect-ratio: 912 / 468;
  object-fit: cover;
}

/* Green Box */
.point3__greenbox {
  background: var(--light-green);
  color: #fff;
  padding: 20px;
  border-radius: 8px;
  margin-bottom: 20px;
}

.point3__greenbox h4 {
  margin: 0 0 10px;
  font-size: 16px;
}

.point3__greenbox ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px 20px;
}

.point3__greenbox li span {
  font-weight: bold;
  margin-right: 6px;
}

.point3__text {
  font-size: 16px;
  line-height: 1.8;
  color: var(--muted);
  margin-bottom: 10px;
}

/* ===============================
   02 & 03 Grid
=============================== */
.point3__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  margin: 40px 0;
}

/* ===============================
   Bottom Note
=============================== */
.point3__block .point3__text {
  margin-top: 10px;
}
.point3__note {
  margin-top: 60px;
  display: flex;
  gap: 20px;
  align-items: flex-end;
}

.point3__note-image {
  width: 180px;
  height: auto;
}

.point3__note-lead {
  font-weight: bold;
  color: var(--light-green);
  margin-bottom: 8px;
  font-size: clamp(1.25rem, 1.027rem + 0.46vw, 1.375rem);
}
.point3__note-text {
  font-size: 18px;
  margin-bottom: 0;
  font-weight: bold;
}

/* ===============================
   Responsive
=============================== */
@media (max-width: 994px) {
  .point3__grid {
    grid-template-columns: 1fr;
  }
  /*
  .point3__flex .point3__image {
    flex: 1;
  } */
}
@media (max-width: 767px) {
  .point3__flex {
    gap: clamp(1.25rem, 0.133rem + 3.81vw, 2.5rem);
    flex-direction: column;
  }
  .point3__note-lead {
    font-size: clamp(1rem, 0.909rem + 0.45vw, 1.25rem);
  }
  .point3__note-text {
    font-size: clamp(0.875rem, 0.784rem + 0.45vw, 1.125rem);
  }
}
@media (max-width: 468px) {
  .point3__note {
    text-align: left;
    align-items: center;
  }
  .point3__note-image {
    width: 100px;
    height: auto;
  }
}

/* ===============================
   LINE Green Box
=============================== */

.point3-linebox {
  display: flex;
  border: 3px solid var(--light-green);
  margin-bottom: 25px;
}

/* 左側グリーン */
.point3-linebox__left {
  background: var(--light-green);
  color: #fff;
  padding: 30px 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 18px;
  min-width: 130px;
  line-height: 1.4;
}

.point3-linebox__left p {
  margin-bottom: 0;
  /* font-size: clamp(0.75rem, 0.509rem + 0.82vw, 1.125rem); */
  font-size: clamp(
    12px,
    calc(8.461916461916463px + 0.9828009828009828vw),
    16px
  );
}

/* 右側 */
.point3-linebox__right {
  flex: 1;
  background: #fff;
  padding: 15px;
}

/* リスト */
.point3-linebox__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  font-size: 16px;
}

/* 番号 */
.point3-linebox__list span {
  color: var(--light-green);
  font-weight: bold;
  font-size: 16px;
}

/* ===============================
   Responsive
=============================== */

@media (max-width: 994px) {
  .point3-linebox__list li {
    font-size: clamp(0.688rem, 0.408rem + 0.95vw, 1rem);
  }
}

@media (max-width: 767px) {
  .point3__text {
    font-size: 15px;
  }
  .linebox__left {
    padding: 20px 5px;
  }
  .point3-linebox__right {
    padding: 10px;
  }
  .point3-linebox__list {
    gap: 0px;
    white-space: nowrap;
  }
  .point3-linebox__left {
    min-width: 30%;
    padding: 10px;
  }
  .point3-linebox__left p {
    /* font-size: 10px; */
    font-weight: 400;
  }
}

@media (max-width: 468px) {
  .point3-linebox {
    margin-bottom: 0;
  }
  .point3__title {
    margin-bottom: 0;
  }
}

/* ===============================
   Bottom Message
=============================== */

.point3-message {
  margin-top: 50px;
  display: flex;
  align-items: center;
  gap: 30px;
}

.point3-message__image img {
  width: 140px;
  height: auto;
  display: block;
}

.point3-message__text {
  flex: 1;
}

.point3-message__lead {
  color: #97c32b;
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 10px;
}

.point3-message__text p {
  font-size: 15px;
  line-height: 1.8;
  color: #666;
  margin: 0;
}

/* ===============================
   Responsive
=============================== */

@media (max-width: 767px) {
  .point3-message {
    flex-direction: column;
    text-align: center;
  }

  .point3-message__image img {
    width: 120px;
  }
}

/* ===============================
   Voice Card
=============================== */

.voice-card {
  background: var(--bg);
  border-radius: 24px;
  padding: 40px 40px 30px 40px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  margin: 20px;
  /* min-height: 625px; */
}

/* ヘッダー */
.voice-card__header {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 40px;
}

/* 丸画像 */
.voice-card__avatar {
  aspect-ratio: 1/1 !important;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  overflow: hidden;
}

.voice-card__meta {
  width: calc(100% - 200px - 20px);
}

.voice-card__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* プロフィール */
.voice-card__profile {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 20px;
}

.voice-card__plan-label {
  font-weight: 700;
  font-size: 20px;
  margin-bottom: 5px;
}

.voice-card__plan-text {
  font-size: 20px;
  font-weight: 700;
}

/* セクション */
.voice-card__section {
  margin-bottom: 25px;
}

.voice-card__section h4 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 10px;
}

.voice-card__section p {
  font-size: 20px;
  line-height: 1.5;
  color: #323232;
  margin-bottom: 0;
}

/* 強調 */
.voice-card__section .voice-card__highlight {
  color: var(--light-green);
  font-weight: 700;
}

/* ===============================
   Responsive
=============================== */

@media (max-width: 991px) {
  .voice-card {
    padding: 30px;
  }
  .voice-card__avatar {
    width: 160px;
    height: 160px;
  }
  .voice-card__meta {
    width: calc(100% - 160px - 20px);
  }

  .voice-card__profile {
    font-size: 20px;
  }
  .voice-card__section p {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
}
@media (max-width: 468px) {
  .voice-card__header {
    text-align: left;
    gap: 20px;
    align-items: flex-start;
    margin-bottom: 20px;
  }
  .voice-card__profile {
    font-size: 16px;
    margin-bottom: 10px;
  }
  .voice-card__plan-label {
    font-size: 16px;
    margin-bottom: 5px;
  }
  .voice-card__plan-text {
    font-size: 16px;
    font-weight: 400;
  }
  .voice-card__section p {
    font-size: 14px;
  }
  .voice-card__section h4 {
    font-size: 18px;
    margin-bottom: 5px;
  }
  .voice-card__avatar {
    width: 110px;
    height: 110px;
  }

  .voice-card__meta {
    width: calc(100% - 110px - 20px);
  }
}

/* ===============================
   Questionnaire Section
=============================== */

.questionnaire {
  background: #f4f4f4;
}

/* タイトル */
.questionnaire__title {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.questionnaire__dot {
  width: 10px;
  height: 10px;
  background: #333;
  display: inline-block;
}

/* ボックス */
.questionnaire__box {
  background: #fff;
  border-radius: 20px;
  padding: 20px clamp(1.25rem, -0.98rem + 4.64vw, 2.5rem) 10px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  margin-bottom: 10px;
}

.questionnaire__sub {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 10px;
}

/* ランキング */
.questionnaire__ranking {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
}

.questionnaire__item {
  flex: 1 0 290px;
}
.questionnaire__item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.questionnaire__rank {
  color: #97c32b;
  font-size: clamp(0.875rem, 0.652rem + 0.46vw, 1rem);
  display: inline-block;
  margin-bottom: 25px;
}

.questionnaire__rank span {
  font-size: clamp(1.25rem, 0.581rem + 1.39vw, 1.625rem);
  font-weight: bold;
}

.questionnaire__text {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
}

/* 下部テキスト */
.questionnaire__note-wrap {
  display: flex;
  align-items: anchor-center;
  gap: 10px;
}

.questionnaire__note-wrap img {
  width: 100px;
  object-fit: contain;
}

.questionnaire__note {
  font-size: 15px;
  line-height: 1.8;
  color: #555;
}

/* ===============================
   Responsive
=============================== */

@media (max-width: 991px) {
  .questionnaire__ranking {
    gap: 30px;
  }
  .questionnaire__box {
    padding: 30px;
  }
  .questionnaire__text {
    font-size: 20px;
    margin-bottom: 0;
  }
  .questionnaire__rank {
    margin-bottom: 5px;
  }
}

@media (max-width: 767px) {
  .questionnaire__box {
    padding: 20px;
  }

  .questionnaire__rank {
    padding-left: 5px;
    padding-right: 5px;
    white-space: nowrap;
  }
  .questionnaire__rank span {
    font-size: 20px;
  }
  .questionnaire__item {
    flex: 1 0 auto;
    gap: 10px;
  }
  .questionnaire__title {
    margin-bottom: 20px;
    font-size: 16px;
    white-space: nowrap;
  }
  .questionnaire__ranking {
    gap: 10px;
  }
  .questionnaire__note-wrap img {
    width: 70px;
  }
  .questionnaire__note {
    font-size: 11px;
  }
}

@media (max-width: 468px) {
  .questionnaire__ranking {
    flex-direction: column;
    max-width: 360px;
  }
  .questionnaire__note-wrap img {
    width: 80px;
  }

  .questionnaire__rank span {
    font-size: 28px;
  }
  .questionnaire__text {
    font-size: 17px;
  }
  .questionnaire__note {
    font-size: 14px;
  }
}
/* ===============================
   FLOW 全体
=============================== */

.flow-wrapper {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-top: 60px;
  flex-wrap: wrap;
}

.flow-card {
  width: calc((100% / 2) - 20px);
  background: var(--card);
  overflow: hidden;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  border: 2px solid #555;
}
.flow-card.flow-card--line {
  border: 2px solid var(--light-green);
}

/* ヘッダー */
.flow-card__head {
  background: var(--light-green);
  color: var(--card);
  text-align: center;
  padding: 20px;
  font-weight: 700;
}

.flow-card__head--dark {
  background: #555;
}

.flow-card__head h3 {
  margin: 0;
  font-size: 22px;
}

/* コンテンツ */
.flow-card__content {
  padding: 40px 15px 50px;
}
@media screen and (min-width: 768px) {
  .flow-card__content {
    padding: 40px 8% 50px;
  }
}

/* 各ステップ */
.flow-step {
  position: relative;
  display: grid;
  grid-template-columns: 35px 1fr;
  gap: 14px;
}

.flow-step__num {
  font-size: 26px;
  font-weight: 700;
  color: var(--light-green);
  min-width: 40px;
}

.flow-step__title h4 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}

.flow-step p {
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  margin-left: 35px;
}

/* ハイライト */
.flow-highlight {
  background: var(--light-green);
  color: var(--card);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 13px;
}

/* 完了 */
.flow-complete {
  text-align: center;
  color: var(--light-green);
  font-weight: 700;
  margin-top: 20px;
}

.flow-complete span {
  display: block;
  color: #555;
  font-weight: 400;
}

/* ===============================
   Responsive
=============================== */

@media (max-width: 991px) {
  .flow-wrapper {
    flex-direction: column;
    align-items: center;
    margin-top: 30px;
  }

  .flow-card {
    width: 100%;
    max-width: 520px;
  }
}

@media (max-width: 468px) {
  .flow-wrapper {
    margin-top: 0;
  }
  .flow-card.flow-card--mail .flow-card__head {
    display: none;
  }
  .flow-card.flow-card--line .flow-card__head {
    display: none;
  }
}

/* ===============================
   FLOW 内部レイアウト
=============================== */

.flow-card__grid {
  display: grid;
  grid-template-columns: 1fr 150px;
  gap: 20px;
}

.flow-card__left {
  display: grid;
  gap: 24px;
}

/* 縦ライン */

.flow-step::before {
  content: "";
  position: absolute;
  left: 15px;

  top: 0;
  width: 2px;
  background: #ddd;
  height: 85%;
}
@media screen and (max-width: 767px) {
  .flow-step::before {
    left: 10px;
  }
}

.flow-card__left .flow-step:last-child::before {
  bottom: 24px;
}

/* 右画像 */

.flow-card__right {
  display: grid;
  gap: 18px;
  justify-items: end;
}

.flow-card__img {
  max-width: 180px;
  width: 100%;
}

/* 完了エリア */

.flow-complete {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
.flow-complete-txt {
  text-align: left;
}
.flow-complete p {
  margin-bottom: 0;
}

.flow-complete-img img {
  width: 120px;
}

/* ===============================
   Header LINE Button
=============================== */

.header-btn-line {
  box-sizing: border-box;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  white-space: nowrap;

  width: 100%;
  max-width: 320px;
  margin-left: auto;

  padding: 12px 25px 12px 24px;

  border-radius: 50px;

  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: 18px;

  background: linear-gradient(0deg, #ec7302 0%, #f19845 100%);

  transition: all 0.25s ease;
}

/* LINE丸 */
.contact-btn__icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 44px;
  height: 44px;

  background: #fff;
  border-radius: 50%;

  font-size: 14px;
  font-weight: 700;
  color: #37b45a;
}

/* テキスト */
.contact-btn__text {
  font-size: 16px;
}

/* hover */

.header-btn-line:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.15);
}

/* ===============================
   CTA HERO
=============================== */

.bottom_cta {
  background: #faffed;
}

/* レイアウト */
.cta-hero {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 30px auto 0;
}

/* テキスト */
.cta-hero__text {
  max-width: calc(100% - 250px);
}

/* キャンペーン */
.cta-hero__campaign {
  color: #e53935;
  font-weight: 700;
  font-size: clamp(1rem, 0.168rem + 1.73vw, 1.25rem);
  margin-bottom: 0;
}

/* タイトル */
.cta-hero__title {
  /* font-size: clamp(1.125rem, -1.788rem + 6.06vw, 2rem); */
  font-size: clamp(
    16px,
    calc(0.07862407862407927px + 4.422604422604422vw),
    34px
  );
  font-weight: 700;
  line-height: 1.5;
  color: #444;
  margin-bottom: 10px;
}

.cta-hero__title span {
  color: #8bc34a;
  font-size: 1.2em;
}
/* 説明 */
.cta-hero__desc {
  font-size: 18px;
  color: #555;
}
.cta-hero__desc:not(.sp-txt) {
  white-space: nowrap;
}
/* 人物 */
.cta-hero__image img {
  max-width: 250px;
}
.cta-pc {
  display: flex;
  justify-content: center;
}
.cta-sp {
  display: none;
}
p.cta-hero__desc.sp-txt {
  display: none;
}
/* ===============================
   Responsive
=============================== */

@media (max-width: 767px) {
  .cta-hero__text {
    max-width: 100%;
  }
  .voice-card {
    padding: 25px 15px 25px;
  }
  .flow-complete span {
    font-size: 12px;
  }
  .contact-btn__text {
    font-size: 14px;
    margin-bottom: -1.5px;
  }
  .contact-btn img {
    width: 20px;
  }
  .header-btn-line {
    padding: 10px 12px;
  }
  header .header_button {
    width: auto;
  }
  .cta-pc {
    display: none;
  }
  .cta-sp {
    display: block;
  }
  p.cta-hero__desc.sp-txt {
    display: block;
    margin-top: 30px;
    text-align: center;
  }
  .cta-sp.cta-hero {
    display: flex;
    flex-direction: row;
    gap: 0px;
  }
  .cta-hero__desc {
    font-size: 14px;
  }
  .cta-hero {
    flex-direction: column;
    text-align: center;
  }

  .cta-hero__title {
    font-size: clamp(1.125rem, 0.537rem + 2.01vw, 1.5rem);
    white-space: nowrap;
  }

  .cta-hero__title span {
    font-size: 24px;
  }

  .cta-hero__image img {
    max-width: 200px;
    margin-top: 20px;
  }
  .contact-btn {
    font-size: 18px;
  }
}
@media (max-width: 468px) {
  .cta-hero__image img {
    max-width: 115px;
    margin: 0 0 10px;
  }
  .cta-hero__campaign {
    font-size: 11px;
  }
  .cta-hero__title {
    font-size: 16px;
  }
  .cta-hero__title span {
    font-size: 20px;
  }
}

/* ===============================
   LINE CTA
=============================== */

.line-entry {
  text-align: center;
  margin-bottom: 30px;
}

.line-entry img {
  width: 40px;
}

/* 上のラベル */

.line-entry__label {
  display: inline-block;
  background: #ffffff;
  color: #39c36e;
  font-weight: 700;
  font-size: 16px;
  padding: 0px 9px;
  border-radius: 10px;
  margin-bottom: -20px;
  bottom: -15px;
  border: 1px solid #39c36e;
  position: relative;
  z-index: 2;
}

.line-entry__label span {
  /* font-size: 20px; */
  font-size: 1.3em;
}

.line-entry__label span.unit {
  /* font-size: 20px; */
  font-size: 1.1em;
}

/* LINEボタン */

.line-entry__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;

  max-width: 580px;
  width: 100%;
  margin: 0 auto;

  padding: 25px 30px 15px;

  border-radius: 60px;

  background: #06c755;

  color: #fff;
  font-size: 22px;
  font-weight: 700;

  text-decoration: none;

  transition: all 0.25s ease;
  position: relative;
  z-index: 1;
}

/* アイコン */

.line-entry__icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 42px;
  height: 42px;

  background: #fff;
  border-radius: 50%;

  font-size: 14px;
  font-weight: 700;
  color: #39c36e;
}

/* hover */

.line-entry__btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

/* ===============================
   Monthly Fee Hero
=============================== */

.monthly-fee-hero {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 40px;

  text-align: center;
}

/* ドット */

.monthly-fee-hero__dots {
  color: #8bc34a;
  font-size: 28px;
  letter-spacing: 10px;

  margin-bottom: 10px;
}

/* さらに */

.monthly-fee-hero__title {
  font-size: 36px;
  font-weight: 700;

  margin-bottom: 0;
}

.monthly-fee-hero__title span {
  position: relative;
}
@media (min-width: 995px) {
  .monthly-fee-hero__title span {
    margin: 0 1px;
  }
}

.monthly-fee-hero__title span::before {
  position: absolute;
  content: "";
  top: -15px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--light-green);
}

/* 説明 */

.monthly-fee-hero__desc {
  font-size: 32px;
  font-weight: 700;

  line-height: 1.5;
  color: #444;
}

/* 人物 */

.monthly-fee-hero__image img {
  max-width: 200px;
}

/* ===============================
   Responsive
=============================== */

@media (max-width: 994px) {
  .point3 {
    padding: 40px 0 0;
    background: #fff;
  }
  .point3__title {
    padding: 0 10px;
  }
  .point3__block .point3__text {
    padding: 0 10px;
  }
}
@media (max-width: 468px) {
  .monthly-fee-hero {
    gap: 5px;
  }
  .monthly-fee-hero__title {
    font-size: 28px;
  }
  .monthly-fee-hero__desc {
    font-size: 22px;
  }
  .monthly-fee-hero__image img {
    max-width: 150px;
  }
}

@media (max-width: 468px) {
  .monthly-fee-hero__image img {
    max-width: 110px;
  }

  .line-entry {
    margin-bottom: 25px;
  }

  /* 上のラベル */

  .line-entry__label {
    font-size: 13px;
    bottom: -10px;
  }

  .line-entry__btn {
    padding: 20px 10px 10px;
    font-size: 18px;
  }
  .monthly-fee-hero__title span::before {
    width: 5px;
    height: 5px;
  }
}

/* ===============================
   FLOW STEP 2カラム
=============================== */

.flow {
  margin-top: 130px;
}

.flow-step {
  display: grid;
  /* grid-template-columns: 1fr 150px;
  gap: 30px; */
  grid-template-columns: 1fr 32%;
  min-height: 130px;
  gap: 10px;
  position: relative;
  margin-bottom: 20px;
}
.flow-step.img-none {
  display: block;
}
.flow-step__text {
  display: flex;
  align-items: center;
  margin-bottom: 25px;
}
.flow-step__text.flex-none {
  display: block;
}

.flow-step__title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}

.flow-step__num {
  font-size: 28px;
  font-weight: 700;
  color: var(--light-green);
}

.flow-step__image {
  text-align: center;
  transform: scale(1.1);
}

.flow-step__image img {
  max-width: 200px;
  width: 100%;
}
.flow-step__image img.img-half {
  width: 75px;
}

@media (max-width: 994px) {
  .monthly-fee-hero__desc {
    font-size: clamp(1rem, 0.107rem + 3.05vw, 2rem);
  }
}

@media (max-width: 767px) {
  .flow-step__image {
    text-align: center;
    margin-top: 10px;
  }

  .flow-step {
    /* grid-template-columns: 1fr 120px; */
    grid-template-columns: 1fr 35%;
    padding: 0;
  }

  .monthly-fee-hero__title {
    font-size: 22px;
  }
  .monthly-fee-hero__title span {
    position: relative;
    margin: 0;
  }
}
@media (max-width: 468px) {
  .flow {
    margin-top: 90px;
  }
  .flow-step__image {
    text-align: center;
    margin-top: -10px;
    margin-bottom: 30px;
  }
  .flow-step__num {
    font-size: 20px;
  }
  .flow-step__title h4 {
    font-size: 16px;
  }
  .flow-step__image img.img-half {
    /* width: 40px; */
    width: 50%;
  }
  .monthly-fee-hero__desc {
    font-size: 16px;
  }
}

.swiper-content {
  position: relative;
}

.swiper .swiper-slide {
  height: auto;
}

.swiper-content .swiper-button-prev,
.swiper-content .swiper-button-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.swiper-content .swiper-button-prev {
  left: calc((100% - 900px) / 2 - 40px);
  left: calc(100% / 6.2);
}

.swiper-content .swiper-button-next {
  right: calc((100% - 900px) / 2 - 40px);
  right: calc(100% / 6.2);
}

@media (max-width: 767px) {
  .swiper-content .swiper-button-prev {
    left: calc(100% / 42);
  }
  .swiper-content .swiper-button-next {
    right: calc(100% / 42);
  }
}

@media (max-width: 468px) {
  .swiper-content .swiper-button-prev {
    left: 0;
  }
  .swiper-content .swiper-button-next {
    right: 0;
  }
  .corporation-txt {
    font-size: 14px;
  }
}

/* 基本のブロック */
.price-plan {
  display: flex;
  align-items: center;
  color: #4a4a4a;
  font-weight: bold;
  justify-content: center;
  padding: 20px 0;
  border-bottom: 1px solid #d6d6d6;
}

/* 行のレイアウト */
.price-plan__row {
  display: flex;
  align-items: flex-end;
  gap: 20px;
}

/* 各項目（送料/月額など）のグループ */
.price-plan__group {
  display: flex;
  align-items: flex-end;
  gap: 0;
}

/* ラベルを縦に並べるエリア */
.price-plan__label-stack {
  display: flex;
  flex-direction: column;
  font-size: 1.2rem;
  line-height: 1.2;
  text-align: right;
}

/* ラベル単体 */
.price-plan__label {
  font-size: 32px;
  white-space: nowrap;
  text-align: left;
}

/* 数字と単位の入れ物 */
.price-plan__value-container {
  display: flex;
  align-items: baseline;
}

/* 数字部分の基本設定 */
.price-plan__number {
  color: var(--light-green);
  line-height: 0.8;
  font-size: 64px;
}

/* 数字をさらに大きくするModifier */
.price-plan__number--large {
  font-size: 64px;
}

/* 最も強調する数字（127など）のModifier */
.price-plan__number--highlight {
  font-size: 64px;
  letter-spacing: -3px;
}

/* 単位（円） */
.price-plan__unit {
  font-size: 32px;
}

/* 税表記のエリア */
.price-plan__tax-info {
  display: flex;
  flex-direction: column;
  font-size: 0.75rem;
  line-height: 1.1;
  margin-bottom: 8px;
}

/* 税表記テキスト */
.price-plan__tax-text {
  font-size: 16px;
}

/* 税込価格（小さい方）のModifier */
.price-plan__tax-text--sub {
  font-size: 0.65rem;
}
@media (max-width: 767px) {
  .price-plan__label,
  .price-plan__unit {
    font-size: clamp(1.5rem, 0.716rem + 2.68vw, 2rem);
    text-align: left;
  }
  .price-plan__number--large,
  .price-plan__number--highlight {
    font-size: clamp(2.75rem, 0.789rem + 6.69vw, 4rem);
  }
}
@media (max-width: 468px) {
  .price-plan__number--large,
  .price-plan__number--highlight {
    font-size: clamp(2.375rem, 1.693rem + 3.61vw, 2.75rem);
  }
  .price-plan__label,
  .price-plan__unit {
    font-size: clamp(1.125rem, 0.443rem + 3.61vw, 1.5rem);
    text-align: left;
  }
  .price-plan__tax-text {
    font-size: clamp(0.75rem, 0.295rem + 2.41vw, 1rem);
  }
  .price-plan__tax-text--sub {
    font-size: clamp(0.5rem, 0.273rem + 1.2vw, 0.625rem);
  }
}

.caution {
  font-size: 12px;
}