@charset "utf-8";

@font-face {
  font-family: 'ITC Avant Garde Pro';
  src: url('../font/ITCAvantGardeGothic.woff2') format('woff2'),
    url('../font/ITCAvantGardeGothic.woff') format('woff');
}

/*
 * グローバルスタイル（モバイルファースト）
 * - フォント: Zen Kaku Gothic New (Medium/Bold)
 * - ブレークポイント: 768px, 1024px
 */

:root {
  /* 色 */
  --color-text: #1B1D1D;
  --color-muted: #003A57;
  --color-primary: #006AB8;
  --color-secondary: #DD60A4;

  /* 余白・幅 */
  --container-max: 1240px;
  --gutter: 16px;
  --radius: 20px;
}

/* リセット（最小限） */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  color: var(--color-text);
  background: url(../img/bg-body-sp.jpg) no-repeat center top / contain;
  font-weight: 500;
  font-family: "Zen Kaku Gothic New", sans-serif;
  line-height: 1.8;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
ul, ol { padding: 0; margin: 0; list-style: none; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 0.5em; font-weight: 500; }
p { margin: 0 0 1em; }
a { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
button { -webkit-tap-highlight-color: transparent; }

/* レイアウト */
html.is-locked,
body.is-locked {
  overflow: hidden;
  height: 100%;
}

.container {
  width: min(100% - var(--gutter) * 2, var(--container-max));
  margin-left: auto;
  margin-right: auto;
}

.site-header {
  padding: 26px 0;
}
.site-header .container {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 93.89312vw;
  height: 64px;
  box-shadow: 0px 3px 20px 0px rgba(112, 176, 237, 0.2);
  background: rgba(255, 255, 255, 0.9);
}
.site-logo {
  width: 175px;
  height: auto;
  margin-bottom: 0;
}

.nav-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 101;
  width: 64px;
  height: 64px;
  background: transparent;
  border: none;
  cursor: pointer;
}
.nav-toggle span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 2px;
  background: var(--color-primary);
  border-radius: 2px;
  position: relative;
  transition: all 0.3s ease;
}
.nav-toggle span::before,
.nav-toggle span::after {
  position: absolute;
  width: 100%;
  height: 2px;
  background: var(--color-primary);
  border-radius: 2px;
  transition: all 0.3s ease;
  content: '';
}
.nav-toggle span::before {
  top: -7px;
}
.nav-toggle span::after {
  bottom: -7px;
}
.nav-toggle[aria-expanded="true"] span {
  background: transparent;
}
.nav-toggle[aria-expanded="true"] span::before {
  top: 0;
  transform: rotate(30deg);
}
.nav-toggle[aria-expanded="true"] span::after {
  bottom: 0;
  transform: rotate(-30deg);
}

.site-nav {
  display: none;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100vw;
  height: 100svh;
  background: url(../img/bg-nav.jpg) no-repeat center center / cover;
}
.site-nav ul {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  max-width: 273px;
  margin: 0 auto;
}
.site-nav ul li:has(.btn-entry) {
  margin-top: 42px;
}
.site-nav a:not(.btn) {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 4px 28px;
  color: var(--color-muted);
  font-size: 1.0625rem;
}
.site-nav a:not(.btn)::after {
  width: 32px;
  height: 32px;
  margin-left: auto;
  background: url(../img/icon-arrow-blue.svg) no-repeat center center / contain;
  content: '';
}
.site-nav .btn {
  width: 100%;
  color: #FFF;
  letter-spacing: 0.05em;
  text-align: center;
}
.btn.btn-mypage {
  border: 1px solid var(--color-secondary);
  background: #FBEDF5;
  color: var(--color-secondary);
}
.btn.btn-partner {
  border: 1px solid #4B5A91;
  background: #4B5A91;
}

.site-mascot {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  left: 6px;
  width: 60px;
  color: var(--color-primary);
  transform: translateY(-50%);
}
.site-mascot-text {
  margin-bottom: 0;
  font-size: 0.375rem;
  line-height: 1;
  text-align: center;
}
.site-mascot-text span {
  display: block;
  font-weight: 700;
  font-size: 0.5rem;
}

.site-main { overflow: hidden; }

/* ヒーロー */
.sec-hero {
  padding-top: 30px;
  padding-bottom: 30px;
}
.sec-hero .container {
  position: relative;
  z-index: 1;
  display: grid;
}
.hero__left {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.hero__visual {
  position: relative;
  width: 100%;
  max-width: 315px;
}
.hero__right {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.hero__pricing {
  width: 100%;
  max-width: 315px;
  color: var(--color-primary);
  text-align: center;
}
.hero__pricing picture { display: flex; align-items: center; justify-content: center; }
.hero__pricing picture img { max-width: 278px; margin-left: 20px; }
.hero-title { margin-top: -1em; margin-bottom: 0.25em; font-weight: 700; font-size:1.625rem; }
.hero-lead { margin-bottom: 0.5em; font-size: 0.875rem; }
.hero-note { font-size: 0.625rem; }

/* セクション共通 */
.section { padding-top: 48px; padding-bottom: 48px; }
.section-title { font-size: 22px; margin-bottom: 16px; }

/* グリッド */
.grid { display: grid; gap: 16px; }
.grid-3 { grid-template-columns: 1fr; }

/* カード */
.card, .plan-card { padding: 20px; border-radius: var(--radius); background: #fff; }
.card-title { font-size: 18px; margin-top: 12px; }
.card-text { color: var(--color-primary); }

/* 料金 */
.plan-name { font-size: 18px; }
.plan-price { font-size: 28px; font-weight: 700; margin: 8px 0 12px; }
.plan-features { color: var(--color-primary); margin-bottom: 12px; }

/* FAQ */
.faq-item { border-radius: var(--radius); padding: 12px 16px; }
.faq-item + .faq-item { margin-top: 8px; }
.faq-answer { color: var(--color-primary); padding-top: 8px; }

/* フォーム */
.form-field { display: grid; gap: 6px; margin-bottom: 12px; }
.form-actions { margin-top: 8px; }
input, textarea { width: 100%; padding: 12px 14px; border-radius: 8px; font: inherit; }
button, .btn { display: inline-block; padding: 12px 18px; border-radius: 999px; font-weight: 700; cursor: pointer; border: 1px solid transparent; }
.btn-primary { background: var(--color-primary); color: var(--color-primary-contrast); }
.btn-secondary { background: #fff; }
.snow-monkey-form {
  max-width: 726px;
  margin-right: auto;
  margin-left: auto;
}
.smf-form .smf-radio-button-control__control {
  padding: 0;
}
.smf-item__label__text {
  white-space: nowrap;
}
@media (min-width: 640px) {
  .smf-form--simple-table .smf-item__col--label {
    flex: 0 0 16.5em;
    max-width: 16.5em;
  }
  .smf-form--simple-table .smf-item:not(:has(.smf-item__col--label)) .smf-item__col {
    flex: 1 1 calc(100% - 16.5em);
    max-width: calc(100% - 16.5em);
    margin-left: auto;
  }
}

/* フッター */
.site-footer {
  position: relative;
  background: url(../img/bg-footer-sp.jpg) no-repeat left center / cover;
  padding-top: 48px;
  padding-bottom: 84px;
  color: var(--color-primary);
  overflow: hidden;
}
.site-footer .container {
  position: relative;
  z-index: 1;
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  font-size: min(0.8125rem, 3.30788vw);
  line-height: 1;
  letter-spacing: 0.05em;
}
.footer-links a {
  color: var(--color-primary);
}
.footer-links a:not(:last-child)::after {
  margin-left: 8px;
  color: var(--color-muted);
  content: '/';
}

.footer-cta {
  margin-top: 48px;
}
.footer-cta-buttons {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.footer-cta-main {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  width: 100%;
  max-width: 323px;
}
.btn-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 68px;
  border-radius: 50px;
  color: #FFF;
}
.btn-cta::before {
  width: 29px;
  height: 29px;
  margin-right: 10px;
  background: url(../img/icon-arrow-circle.svg) no-repeat center center / contain;
  content: '';
}
.btn-cta.btn-inquiry {
  background: var(--color-primary);
  color: #FFF;
}
.btn-cta.btn-inquiry::after {
  position: absolute;
  top: 44px;
  left: 50%;
  transform: translateX(-50%);
  width: 51px;
  height: 10px;
  background: url(../img/txt-contact.svg) no-repeat center center / contain;
  content: '';
}
.btn-entry {
  border: 1px solid var(--color-secondary);
  background: var(--color-secondary);
  color: #FFF;
}
.btn-cta.btn-entry::after {
  position: absolute;
  top: 44px;
  left: 50%;
  transform: translateX(-50%);
  width: 30px;
  height: 12px;
  background: url(../img/txt-entry.svg) no-repeat center center / contain;
  content: '';
}
.btn-cta .btn-text {
  margin-bottom: 5px;
  font-weight: 700;
  font-size: 1.3125rem;
  letter-spacing: 0.05em;
}

.footer-logo {
  width: 258px;
  margin: 48px auto 2px;
}

.footer-cta-sub {
  width: 100%;
  max-width: 303px;
  margin: 0 auto;
}
.btn-footer.btn-partner {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 66px;
  border: 1px solid #DFECFA;
  border-radius: 50px;
  background: #FAFBFF;
  color: #4B5A91;
  font-weight: 700;
  font-size: 1.125rem;
  letter-spacing: 0.05em;
}
.btn-footer.btn-partner::before {
  width: 54px;
  height: 35px;
  margin-right: 16px;
  background: url(../img/icon-partner.svg) no-repeat center center / contain;
  content: '';
}

.footer-nav {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
  max-width: 303px;
  margin: 44px auto 0;
}
.footer-nav-group ul {
  display: grid;
}
.footer-nav-group a {
  display: block;
  position: relative;
  padding: 10px 0 10px 6px;
  color: var(--color-primary);
  font-weight: 700;
  font-size: 0.9375rem;
  letter-spacing: 0.05em;
}
.footer-nav-group > ul > li > a::after {
  position: absolute;
  right: 0;
  top: calc(50% - 9px);
  width: 18px;
  height: 18px;
  background: url(../img/icon-arrow-sp.svg) no-repeat center center / contain;
  content: '';
}
.footer-nav-group li:has(ul) > a::after {
  background-image: url(../img/icon-arrow-down.svg);
}
.footer-nav-group li > ul {
  margin-left: 12px;
}
.footer-nav-group li > ul > li > a {
  font-weight: 500;
}
.footer-nav-group li > ul > li > a::before {
  margin-right: 6px;
  content: '-';
}

.copyright {
  margin-top: 60px;
  margin-bottom: 0;
  font-size: 0.6875rem;
  letter-spacing: 0.05em;
  text-align: center;
}

.footer-fixed {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  padding: 16px 5vw;
  box-shadow: 0px 3px 20px 0px rgba(112, 176, 237, 0.2);
  background: rgba(255, 255, 255, 0.76);
}
@media (max-width: 399px) {
  .footer-fixed {
    padding: 16px 3.05344vw;
  }
}
.footer-fixed-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 0 auto;
}
.btn-fixed {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 40px;
  padding: 0 14px;
  border-radius: 20px;
  color: #FFF;
}
.btn-simulation {
  background: var(--color-primary);
}
.btn-simulation::before {
  width: 23px;
  height: 24px;
  margin-right: 4px;
  background: url(../img/icon-simulation.svg) no-repeat center center / contain;
  content: '';
}
.btn-fixed .btn-desc {
  display: none;
}
.btn-fixed .btn-title {
  font-weight: 700;
  font-size: 1rem;
  font-feature-settings: 'palt';
}
@media (max-width: 389px) {
  .btn-fixed .btn-title,
  .btn-fixed .btn-text {
    font-size: min(0.9375rem, 4.375vw);
    white-space: nowrap;
  }
}
@media (min-width: 390px) {
  .btn-simulation::after {
    width: 20px;
    height: 20px;
    margin-left: 8px;
    background: url(../img/icon-arrow-circle.svg) no-repeat center center / contain;
    content: '';
  }
}

/* ブレークポイント: 768px */
@media (min-width: 768px) {
  body { background: url(../img/bg-body.jpg) no-repeat center top / contain; }

  .site-header { padding: 34px 0; }
  .site-header .container { height: 96px; }
  .site-logo { width: 258px; }
  .nav-toggle { width: 100px; height: 100px; }
  .nav-toggle span { width: 48px; height: 3px; border-radius: 2px; }
  .nav-toggle span::before, .nav-toggle span::after { height: 3px; border-radius: 2px; }
  .nav-toggle span::before { top: -12px; }
  .nav-toggle span::after { bottom: -12px; }
  .site-mascot { left: 32px; width: 85px; }
  .site-mascot-text { margin-top: 2px; font-size: 0.5rem; }
  .site-mascot-text span { font-size: 0.625rem; }

  .sec-hero { padding-top: 0; padding-bottom: 56px; }
  .sec-hero .container { grid-template-columns: 1.1fr 1fr; align-items: flex-start; max-width: 1040px; }
  .hero__left {
    flex-direction: row;
    align-items: flex-end;
    margin-top: 40px;
  }
  .hero__visual {
    max-width: 486px;
    margin-bottom: 0;
  }
  .hero__pricing {
    max-width: 450px;
  }
  .hero__pricing picture img {
    width: 79.22077%;
    max-width: 411px;
    margin-left: 0;
  }
  .hero-title { margin-top: -0.5em; margin-bottom: 0.5em; font-size: max(2rem, 4.16667vw); line-height: 1; }
  .hero-lead { font-size: 1rem; }
  .hero-note { font-size: 0.75rem; }

  .grid-3 { grid-template-columns: repeat(2, 1fr); }

  .site-footer {
    padding-top: 64px;
    padding-bottom: 120px;
    background: url(../img/bg-footer.jpg) no-repeat center center / cover;
  }
  .site-footer .container { width: 93.89312vw; }
  .footer-links {
    gap: 40px;
    font-size: 0.9375rem;
  }
  .footer-links a:not(:last-child)::after { margin-left: 40px; }

  .footer-logo { margin: 24px auto; }

  .footer-cta-main {
    grid-template-columns: repeat(2, 1fr);
    max-width: inherit;
  }
  .footer-cta-sub { max-width: 430px; }
  .btn-footer.btn-partner {
    height: 56px;
    border-color: #4B5A91;
    background: #FAFBFF;
  }
  
  .footer-nav {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    max-width: 540px;
    margin-top: 48px;
  }
  .footer-nav-group a { padding: 6px 0; }
  .footer-nav-group li > ul { margin-left: 0; }
  .footer-nav-group > ul > li > a::after { display: none; }

  .footer-fixed { padding: 13px 3.05344vw; }
  .footer-fixed-buttons {
    gap: 30px;
  }
  .btn-simulation {
    flex-direction: column;
    align-items: flex-start;
    width: 467px;
    height: 64px;
    padding-left: 186px;
    border-radius: 32px;
  }
  .btn-simulation::before {
    position: absolute;
    top: 20px;
    left: 32px;
    width: 100px;
    height: 29px;
    background: url(../img/txt-simulation.svg) no-repeat center center / contain;
    content: '';
  }
  .btn-simulation::after {
    position: absolute;
    top: calc(50% - 12px);
    right: 38px;
    width: 24px;
    height: 24px;
  }
  .btn-fixed .btn-desc {
    display: block;
    font-size: 0.5625rem;
  }
  .btn-fixed .btn-title {
    position: relative;
    font-size: 1.25rem;
    line-height: 1.2;
  }
  .btn-fixed .btn-title::before {
    display: block;
    position: absolute;
    bottom: -2px;
    left: -46px;
    width: 36px;
    height: 40px;
    background: url(../img/icon-simulation.svg) no-repeat center center / contain;
    content: '';
  }
  .btn-fixed.btn-entry {
    width: calc(100% - 497px);
    height: 44px;
    border-radius: 22px;
    font-size: 1.0625rem;
  }
}

/* ブレークポイント: 1024px */
@media (min-width: 1024px) {
  .hero__visual {
    max-width: 500px;
  }
  .hero__pricing {
    max-width: 500px;
  }
  .hero-title { font-size: 3rem; }
  .hero-lead { font-size: 1.125rem; }
  .grid-3 { grid-template-columns: repeat(3, 1fr); }

  .footer-cta {
    max-width: 796px;
    margin-right: auto;
    margin-left: auto;
  }

  .footer-nav {
    display: flex;
    gap: 64px;
    max-width: 1064px;
  }

  .footer-fixed-buttons {
    max-width: 798px;
  }
  .btn-simulation {
    width: 497px;
  }
  .btn-fixed.btn-entry { width: calc(100% - 527px); }
}

/* ブレークポイント: 1200px */
@media (min-width: 1200px) {
  .footer-fixed-buttons {
    max-width: 1024px;
  }
  .btn-simulation {
    width: 662px;
    height: 92px;
    padding-left: 214px;
    border-radius: 48px;
  }
  .btn-simulation::before {
    top: 32px;
    width: 112px;
    height: 38px;
  }
  .btn-simulation::after {
    top: calc(50% - 16px);
    right: 48px;
    width: 32px;
    height: 32px;
  }
  .btn-fixed .btn-title::before {
    left: -56px;
    width: 46px;
    height: 52px;
  }
  .btn-fixed .btn-desc {
    font-size: 0.75rem;
  }
  .btn-fixed .btn-title {
    font-size: 1.5rem;
    letter-spacing: 0.05em;
  }
  .btn-fixed.btn-entry {
    height: 60px;
    border-radius: 30px;
    font-size: 1.375rem;
  }
}

/* ブレークポイント: 1440px */
@media (min-width: 1440px) {
  .site-header { padding: 20px 0 36px; }
  .site-header .container {
    width: calc(100% - 80px);
    padding-right: 40px;
    padding-left: 40px;
  }
  .site-mascot {
    position: static;
    margin-right: auto;
    margin-left: 20px;
    transform: translateY(0);
  }
  .site-nav {
    display: block;
    position: static;
    width: auto;
    height: auto;
    background: transparent;
  }
  .site-nav ul {
    flex-direction: row;
    align-items: center;
    gap: 24px;
    max-width: inherit;
  }
  .site-nav ul li:has(.btn-entry) {
    margin-top: 0;
    margin-right: -8px;
    margin-left: -4px;
  }
  .site-nav ul li:has(.btn-partner) {
    display: none;
  }
  .site-nav .btn {
    padding: 7px 23px;
  }
  .site-nav a:not(.btn) { padding: 0; font-size: 0.9375rem; }
  .site-nav a:not(.btn)::after { display: none; }
  .nav-toggle { display: none; }

  .site-footer {
    padding-top: 80px;
    padding-bottom: 140px;
  }
}

/* キャンペーン */
.sec-campaign {
  padding-top: 46px;
  padding-bottom: 46px;
  background: #FBBA1E;
}
.sec-campaign .container {
  width: 100%;
  max-width: 874px;
}
.campaign__item__button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 93.89312vw;
  margin-right: auto;
  margin-left: auto;
}
.campaign__item__button a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  height: 64px;
  padding: 8px 12px;
  border-radius: 32px;
  background: #1B1D1D;
  color: #FFF;
  font-weight: 700;
  font-size: min(1rem, 4.07124vw);
  line-height: 1;
}
.campaign__item__button a::after {
  width: 32px;
  height: 32px;
  background: url(../img/icon-arrow-circle.svg) no-repeat center center / contain;
  content: '';
}
@media (min-width: 768px) {
  .sec-campaign {
    padding-top: 70px;
    padding-bottom: 70px;
  }
  .sec-campaign .container {
    max-width: 700px;
  }
  .campaign__item__button {
    width: 600px;
  }
  .campaign__item__button a {
    position: relative;
    width: 100%;
    font-size: 1.25rem;
  }
  .campaign__item__button a::after {
    position: absolute;
    top: calc(50% - 16px);
    right: 24px;
  }
}

/* トップページ */
.sec-reason {
  padding-top: 56px;
  padding-bottom: 80px;
  background: url(../img/bg-reason-sp.jpg) no-repeat center top / cover;
}
.sec-reason .container {
  width: 93.89312vw;
  max-width: 980px;
}
body.home #lead {
  display: flex;
  flex-direction: column;
  color: var(--color-primary);
}
body.home #lead::before {
  width: 100%;
  max-width: 359px;
  height: 91.3486vw;
  max-height: 359px;
  border-radius: 50%;
  background: url(../img/img-top.jpg) no-repeat center center / cover;
  overflow: hidden;
  margin-right: auto;
  margin-bottom: 56px;
  margin-left: auto;
  content: '';
}
body.home #lead h2 {
  margin-bottom: 1em;
  font-weight: 500;
  font-size: 1.5rem;
  line-height: 1.67;
}
body.home #lead p {
  font-size: 0.875rem;
  line-height: 2;
  letter-spacing: 0.05em;
}
body.home #lead .wp-block-group {
  justify-content: center;
  gap: 56px;
  margin-top: 56px;
}
body.home #lead .wp-block-button__link,
body.home .link__button .wp-block-button__link {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 130px;
  height: 130px;
  box-shadow: 0px 3px 40px 0px rgba(0, 0, 0, 0.16);
  border-radius: 50%;
  background: var(--color-primary);
  color: #FFF;
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1;
}
body.home #lead .wp-block-button__link::after {
  width: 32px;
  height: 32px;
}
body.home #recommend {
  margin-top: 180px;
}
body.home #recommend h2 {
  color: var(--color-primary);
  font-weight: 500;
  font-size: min(1.5rem, 6.10687vw);
}
body.home #feature {
  margin-top: 180px;
  color: var(--color-primary);
}
body.home #feature h3 {
  width: 85.24173vw;
  margin-right: auto;
  margin-left: auto;
  font-weight: 500;
  font-size: 1.5rem;
}
body.home #feature h3 + p {
  width: 85.24173vw;
  margin-right: auto;
  margin-left: auto;
  font-size: 0.875rem;
  line-height: 2;
  letter-spacing: 0.05em;
}
body.home #feature .note {
  width: 85.24173vw;
  margin-top: 1.5em;
  margin-right: auto;
  margin-left: auto;
  color: var(--color-secondary);
  font-size: 0.8125rem;
}
.sec-plan {
  padding-top: 20px;
  padding-bottom: 80px;
  background: url(../img/bg-plan-sp.jpg) no-repeat center top / cover;
}
.sec-plan h2,
.sec-case h2,
.sec-faq h2,
.sec-news h2 {
  color: var(--color-primary);
  font-weight: 500;
  font-size: 1.5rem;
}
.sec-case h2 .is-secondary {
  color: var(--color-secondary);
}
.sec-plan p {
  font-size: 0.875rem;
}
.link__button {
  margin-top: 3rem;
  text-align: center;
}
.link__button p {
  color: var(--color-primary);
}
.sec-case {
  padding-top: 80px;
  padding-bottom: 80px;
}
.sec-case .plan-case__item__title {
  margin-top: 10px;
  color: var(--color-secondary);
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.2;
  letter-spacing: 0.05em;
}
.sec-case .plan-case__item__text {
  font-size: 0.8125rem;
  line-height: 1.8;
}
.sec-faq {
  padding-top: 80px;
  padding-bottom: 80px;
  background: url(../img/bg-faq-sp.jpg) no-repeat center top / cover;
}
body.home .sec-faq p.is-lead {
  display: block;
  margin-bottom: 40px;
  color: var(--color-primary);
  font-size: 0.8125rem;
  line-height: 1.8;
  text-align: center;
}
.sec-news {
  padding-top: 80px;
  padding-bottom: 80px;
}
.wp-block-news {
  max-width: 750px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 768px) {
  .sec-reason {
    padding-top: 80px;
  }
  body.home #lead {
    position: relative;
  }
  body.home #lead::before {
    position: absolute;
    top: 60px;
    right: 0;
    width: 300px;
    height: 300px;
  }
  body.home #lead h2 {
    font-size: min(2rem, 4.16667vw);
  }
  body.home #lead p {
    padding-right: 300px;
  }
  body.home #lead p + p {
    padding-right: 0;
  }
  body.home #lead .wp-block-group {
    justify-content: flex-start;
  }
  body.home #recommend,
  body.home #feature {
    margin-top: 100px;
  }
  body.home #recommend h2 {
    margin-bottom: 1em;
    font-size: 1.75rem;
  }
  .sec-plan h2,
  .sec-case h2,
  .sec-faq h2,
  .sec-news h2 {
    font-size: 1.75rem;
  }
  body.home #feature h3 + p {
    width: auto;
  }
}
@media (min-width: 1024px) {
  .sec-reason {
    background: url(../img/bg-reason.jpg) no-repeat center top / cover;
  }
  body.home #lead::before {
    width: 456px;
    height: 456px;
  }
  body.home #lead p {
    padding-right: 0;
    line-height: 2.4;
  }
  body.home #recommend h2 {
    font-size: 2.25rem;
  }
}

/* お知らせ */
.news__list {
  margin: 0;
  padding: 0 8px 8px 8px;
}
.news__item a {
  display: block;
  padding: 1em 5px;
}
.news__item time {
  font-weight: 500;
  font-size: 0.9375em;
  letter-spacing: 0.05em;
}
.news__item-term {
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 2px 18px;
  margin-left: 5px;
  background: #F2F4FF;
  color: var(--color-primary);
  font-weight: 500;
  font-size: 0.8125rem;
  line-height: 1;
}
.news__item-term.-important {
  background: #FDECF5;
  color: var(--color-secondary);
}
.news__item-text {
  margin-top: 4px;
  margin-bottom: 0;
  font-size: 0.9375rem;
}
.news__button {
  text-align: center;
  margin-top: 30px;
}
.news__button a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 12px 24px;
  border-radius: 999px;
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
  font-weight: 700;
  font-size: 1rem;
  line-height: 1;
}
@media (min-width: 768px) {
  .news__item a {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  .news__item-text {
    margin-top: 0;
    }
}
@media (min-width: 1024px) {
  .sec-news {
    margin: 40px auto;
    max-width: 780px;
    padding: 40px 0 24px;
    border-radius: 24px;
  }
  .news__list {
    padding: 0;
  }
  .news__item-term {
    justify-content: center;
    min-width: 130px;
  }
  .news__item-text {
    font-size: 1.125rem;
    letter-spacing: 0.05em;
  }
  .news__button {
    margin-top: 16px;
  }
  .news__button a {
    font-size: 1.25rem;
  }
}

/* お知らせ詳細 */
.entry-header {
  display: flex;
  flex-direction: column-reverse;
}
.entry-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.entry-title {
  margin-top: 0.5em;
  margin-bottom: 1.5em;
  font-size: 1.75rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
}
.entry-meta time {
  font-weight: 500;
  font-size: 0.9375em;
  letter-spacing: 0.05em;
}
.entry-category {
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 2px 18px;
  background: #F2F4FF;
  color: var(--color-primary);
  font-weight: 500;
  font-size: 0.8125rem;
  line-height: 1;
}
.entry-category.-important {
  background: #FDECF5;
  color: var(--color-secondary);
}
.entry-body {
  max-width: 750px;
  margin-right: auto;
  margin-left: auto;
}
.entry-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  margin-top: 40px;
  margin-bottom: 60px;
}
.entry-footer > a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 12px 24px;
  border-radius: 999px;
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
  font-weight: 700;
  font-size: 1rem;
  line-height: 1;
}
.entry-nav {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 20px;
}
.entry-nav a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 12px 16px;
  border-radius: 999px;
  background: var(--color-primary);
  color: #FFF;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1;
}
.entry-nav a[rel="prev"] {
  margin-right: auto;
}
.entry-nav a[rel="next"] {
  margin-left: auto;
}
.entry-nav a[rel="prev"]::before {
  width: 7px;
  height: 12px;
  margin-right: 8px;
  background: url(../img/icon-arrow-prev.svg) center center / contain no-repeat;
  transform: rotate(180deg);
  content: '';
}
.entry-nav a[rel="next"]::after {
  width: 7px;
  height: 12px;
  margin-left: 8px;
  background: url(../img/icon-arrow-next.svg) center center / contain no-repeat;
  content: '';
}
@media (min-width: 1024px) {
  .entry-title {
    text-align: center;
  }
}

/* パンくずリスト */
.breadcrumb .container {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 93.89312vw;
  color: #1B1D1D;
  font-weight: 400;
  font-size: 0.75rem;
  line-height: 1;
}
.breadcrumb a {
  color: #1B1D1D;
  text-decoration: underline;
}
@media (min-width: 1024px) {
  .breadcrumb .container {
    font-size: 0.875rem;
  }
}
@media screen and (min-width: 1440px) {
  .breadcrumb .container {
    width: calc(100% - 80px);
    padding: 0 40px;
    font-size: 0.9375rem;
  }
}

/* ページヘッダー */
.page-header {
  padding: 40px 0;
  color: var(--color-primary);
  text-align: center;
}
.page-header .container {
  width: 93.89312vw;
  max-width: 1024px;
}
.page-title {
  font-weight: 500;
  font-size: 1.75rem;
  line-height: 1.2;
  letter-spacing: 0.05em;
}
.page-lead {
  margin-top: 2rem;
  font-size: 0.875rem;
  line-height: 2.2;
  letter-spacing: 0.05em;
}
@media (min-width: 768px) {
  .page-title {
    font-size: 2rem;
  }
}
@media (min-width: 1024px) {
  .page-header {
    padding: 64px 0;
  }
  .page-title {
    font-size: 2.5rem;
  }
  .page-lead {
    font-size: 0.9375rem;
  }
}
@media (min-width: 1440px) {
  .page-title {
    font-size: 3rem;
  }
}

/* ページコンテンツ */
.page-content {
  padding-bottom: 80px;
  font-size: 0.875rem;
}
.page-content .container {
  width: 93.89312vw;
  max-width: 980px;
}
.page-content .is-pink {
  color: var(--color-secondary);
}
@media (max-width: 767px) {
  body.about .page-content h3.is-pink + p.has-text-align-center {
    text-align: left;
  }
}
body:not(.simulation) .page-content h2,
.page-content h3,
.page-content h4,
.page-content h5,
.page-content h6 {
  font-weight: 500;
}
body:not(.simulation) .page-content h2 {
  color: var(--color-primary);
  font-size: 1.375rem;
  margin-bottom: 1em;
}
.page-content h3 {
  color: var(--color-primary);
  font-size: 1.25rem;
  margin-bottom: 1em;
}
.page-content h4 {
  font-size: 1rem;
}
body:not(.simulation) .page-content p {
  line-height: 2;
}
.page-content p a {
  display: inline-block;
  color: var(--color-primary);
  text-decoration: underline;
}
.page-content .wp-block-column iframe {
  width: 100%;
}
.page-content .wp-block-buttons>.wp-block-button {
  min-width: 248px;
}
.page-content .wp-block-button__link {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 8px 12px;
  background-color: var(--color-primary);
  font-size: 0.875rem;
}
.page-content .wp-block-button__link[target="_blank"]::after {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-left: 6px;
  border-radius: 50%;
  background: url(../img/icon-arrow-circle.svg) no-repeat center center / contain;
  content: '';
}
.page-content .wp-block-table td,
.pege-content .wp-block-table th {
  padding: 0.25em 0;
  border: 0;
  vertical-align: top;
}
.page-content .wp-block-table td:first-child {
  padding-right: 1em;
  white-space: nowrap;
}
@media (min-width: 768px) {
  body:not(.simulation) .page-content h2 {
    font-size: 1.75rem;
  }
  .page-content h3 {
    font-size: 1.5rem;
  }
  .page-content h4 {
    font-size: 1.125rem;
  }
}
@media (min-width: 1024px) {
  .page-content {
    font-size: 1rem;
  }
  body:not(.simulation) .page-content h2 {
    font-size: 2.25rem;
  }
  .page-content h3 {
    font-size: 1.625rem;
  }
  .page-content h4 {
    font-size: 1.25rem;
  }
}

/* 選ばれる理由 */
body.reason #lead h2 {
  font-size: clamp(1.25rem, 5.33334vw, 1.5rem);;
}
body.reason #lead h2 + p {
  max-width: 622px;
  margin-right: auto;
  margin-left: auto;
}
body.reason #lead .wp-block-media-text {
  margin-top: 60px;
}
body.reason #reason {
  margin-top: 60px;
}
body.reason #reason .wp-block-buttons {
  justify-content: center;
  margin-top: 2em;
}
body.reason #about .wp-block-group.is-layout-flex {
  gap: 40px;
  margin-top: 1em;
}
@media (max-width: 599px) {
  body.reason #lead .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content .wp-block-heading {
    text-align: center;
  }
  body.reason #lead .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content {
    padding: 8% 0 0;
  }
  body.reason #reason .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content {
    padding: 8% 0 16%;
  }
}
@media (min-width: 600px) {
  body.reason #reason .wp-block-media-text {
    grid-template-columns: 1fr 2fr;
    margin-top: 40px;
  }
  body.reason #reason .wp-block-media-text + .wp-block-media-text {
    margin-top: 60px;
  }
  body.reason #lead .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content,
  body.reason #reason .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content {
    padding: 0 0 0 6%;
  }
  body.reason #reason .wp-block-buttons {
    justify-content: flex-start;
  }
  body.reason #about {
    margin-top: 60px;
  }
  body.reason #about h4,
  body.reason #about .wp-block-group.is-layout-flex,
  body.reason #about .wp-block-image,
  body.reason #about .wp-block-column:has(iframe) {
    max-width: 420px;
    margin-right: auto;
    margin-left: auto;
  }
}
@media (min-width: 768px) {
  body.reason #lead h2 {
    font-size: 1.875rem;
  }
  body.reason #reason,
  body.reason #about {
    margin-top: 100px;
  }
  body.reason #about h4,
  body.reason #about .wp-block-group.is-layout-flex,
  body.reason #about .wp-block-image,
  body.reason #about .wp-block-column:has(iframe) {
    max-width: inherit;
    margin-right: 0;
    margin-left: 0;
  }
  body.reason #about h4 {
    margin-top: 40px;
  }
  body.reason #about .wp-block-group.is-layout-flex {
    flex-wrap: nowrap;
    flex-direction: row;
  }
  body.reason #about .wp-block-group.is-layout-flex .wp-block-group + .wp-block-group {
    margin-left: auto;
  }
  body.reason #about .wp-block-columns:has(iframe) {
    flex-wrap: nowrap !important;
    gap: 0;
  }
  body.reason #about .wp-block-columns:has(iframe) .wp-block-column:has(img) {
    width: calc(50% - 1.5rem);
    padding-right: 1.5rem;
  }
  body.reason #about .wp-block-columns:has(iframe) .wp-block-column:has(iframe) {
    width: 50%;
    height: 450px;
  }
}
@media (min-width: 1024px) {
  body.reason #lead .wp-block-group__inner-container {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  body.reason #lead h2 + p {
    max-width: inherit;
  }
  .page-content .wp-block-button__link {
    font-size: 0.9375rem;
  }
}
@media (min-width: 1440px) {
  body.reason #lead h2 {
    font-size: 2.5rem;
  }
}

/* みんなのでんきの特徴 */
body.home #feature h2:has(.zero),
body.about .page-content h2:has(.zero) {
  display: flex;
  justify-content: center;
  align-items: center;
}
body.home #feature h2:has(.zero) {
  flex-wrap: wrap;
  color: var(--color-primary);
  font-weight: 500;
  font-size: 2rem;
}
body.home #feature h2 span,
body.about .page-content h2 span {
  margin-bottom: 0.25em;
  line-height: 1;
}
body.home #feature h2:has(.zero) .heading {
  width: 100%;
  font-size: 1.5rem;
}
body.home #feature h2 .num {
  margin-right: 0.125em;
  margin-left: 0.125em;
  font-size: 3rem;
}
body.about .page-content h2 .num {
  margin-left: 0.25em;
  font-size: 3rem;
}
body.home #feature h2 .zero {
  font-size: 1.25rem;
}
body.about .page-content h2 .zero {
  font-size: 2.5rem;
}
body.home .wp-block-group.features,
body.about .wp-block-group.features {
  gap: 0 4.07124vw;
  max-width: 400px;
  margin-right: auto;
  margin-left: auto;
  color: var(--color-primary);
}
body.home .wp-block-group.features > .wp-block-group,
body.about .wp-block-group.features > .wp-block-group {
  width: 28.49872vw;
  max-width: 112px;
}
body.home .wp-block-group.features > .wp-block-group .wp-block-group__inner-container,
body.about .wp-block-group.features > .wp-block-group .wp-block-group__inner-container {
  position: relative;
  padding-top: 74.10741%;
}
body.home .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image,
body.about .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
body.home .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image + p,
body.about .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image + p {
  position: relative;
  z-index: 1;
  font-size: min(0.75rem, 3.2vw);
  line-height: 1.5;
  white-space: nowrap;
}
body.home .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image + p + p,
body.about .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image + p + p {
  margin-bottom: 0;
  color: var(--color-muted);
  font-size: min(0.6875rem, 2.93334vw);
  line-height: 1.8;
  white-space: nowrap;
}
body.about .page-content h3 strong {
  font-weight: 500;
  font-size: 1.5rem;
}
body.about #recommend {
  position: relative;
  margin-top: 60px;
  padding-top: 60px;
  padding-bottom: 40px;
}
body.about #recommend .wp-block-group__inner-container > h2 {
  font-size: 1.5rem;
}
body.about #recommend::before {
  position: absolute;
  top: 0;
  left: calc(50% - 50vw);
  z-index: -1;
  width: 100vw;
  height: 100%;
  background: #ECF3F9;
  content: '';
}
body.home #minnas,
body.about #minnas {
  max-width: 390px;
  margin-right: auto;
  margin-left: auto;
}
body.home #minnas .wp-block-group__inner-container,
body.about #minnas .wp-block-group__inner-container {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}
body.home #minnas .wp-block-group + .wp-block-group,
body.about #minnas .wp-block-group + .wp-block-group {
  margin-top: 19px;
}
body.home #minnas .wp-block-group__inner-container .wp-block-image,
body.about #minnas .wp-block-group__inner-container .wp-block-image {
  width: 44.56824%;
  max-width: 160px;
}
body.home #minnas .wp-block-group__inner-container .wp-block-group,
body.about #minnas .wp-block-group__inner-container .wp-block-group {
  width: calc(100% - 172px);
  max-width: 52.08913%;
}
body.home #minnas h2,
body.about #minnas h2 {
  margin-bottom: 0;
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.5;
}
body.home #minnas h2 span,
body.about #minnas h2 span {
  display: block;
  margin-bottom: 0;
  font-weight: 400;
  font-size: 0.75rem;
}
body.home #minnas .wp-block-list,
body.about #minnas .wp-block-list {
  max-width: 222px;
  font-size: 0.8125rem;
  line-height: 1.8;
}
body.home #minnas .wp-block-list li,
body.about #minnas .wp-block-list li {
  position: relative;
  padding-left: 1em;
}
body.home #minnas .wp-block-list li::before,
body.about #minnas .wp-block-list li::before {
  position: absolute;
  top: 0;
  left: 0;
  content: '・';
}
body.home #minnas .wp-block-buttons>.wp-block-button,
body.about .page-content .wp-block-buttons>.wp-block-button {
  min-width: 80px;
  margin-top: 8px;
}
body.home #minnas .wp-block-buttons>.wp-block-button .wp-block-button__link,
body.about .page-content .wp-block-buttons>.wp-block-button .wp-block-button__link {
  width: 80px;
  padding: 2px 12px;
  border: 1px solid var(--color-primary);
  background-color: transparent;
  color: var(--color-primary);
  font-size: 0.9375rem;
}
body.about .flex-buttons {
  gap: 8px;
}
body.about #step {
  margin-top: 60px;
}
#step .smb-step__body:before {
  display: none;
}
#step .smb-step__item {
  margin-left: 0;
}
#step .smb-step__item__title {
  padding-top: 32px;
  color: var(--color-primary);
}
#step .smb-step__item__title>.smb-step__item__number {
  position: absolute;
  top: 0;
  left: 0;
  width: 78px;
  height: 25px;
  margin-left: 0;
  border-radius: 0;
  transform: none;
  content: '';
}
#step .smb-step__item:nth-of-type(1) .smb-step__item__title>.smb-step__item__number {
  background: url(../img/icon-step-01.svg) no-repeat center center / contain;
}
#step .smb-step__item:nth-of-type(2) .smb-step__item__title>.smb-step__item__number {
  background: url(../img/icon-step-02.svg) no-repeat center center / contain;
}
#step .smb-step__item:nth-of-type(3) .smb-step__item__title>.smb-step__item__number {
  background: url(../img/icon-step-03.svg) no-repeat center center / contain;
}
#step .smb-step__item:nth-of-type(4) .smb-step__item__title>.smb-step__item__number {
  background: url(../img/icon-step-04.svg) no-repeat center center / contain;
}
#step .smb-step__item__number:before {
  display: none;
}
#step .smb-step__item__summary p {
  line-height: 1.5;
}
#step .smb-step__body>*+* {
  position: relative;
}
#step .smb-step__body>*+*::before {
  position: absolute;
  top: calc(var(--smb-step--gap) * -1 + 10px);
  left: 32px;
  width: 15px;
  height: calc(var(--smb-step--gap) - 20px);
  background: url(../img/img-arrow-step.svg) no-repeat center bottom / cover;
  content: '';
}
@media (max-width: 359px) {
  body.about .page-content h2:has(span) {
    display: block;
  }
}
@media (min-width: 768px) {
  body.home .wp-block-group.features,
  body.about .wp-block-group.features {
    max-width: inherit;
  }
  body.home .wp-block-group.features > .wp-block-group .wp-block-group__inner-container,
  body.about .wp-block-group.features > .wp-block-group .wp-block-group__inner-container {
    padding-top: 83.81502%;
  }
  body.home .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image + p,
  body.about .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image + p {
    font-size: 0.875rem;
  }
  body.about #recommend {
    margin-top: 100px;
    padding-top: 100px;
  }
  body.about #recommend .wp-block-group__inner-container > h2 {
    font-size: 1.75rem;
  }
  body.home #minnas {
    grid-template-columns: 1fr 1fr;
    row-gap: 40px;
    max-width: inherit;
    margin-right: auto;
    margin-left: auto;
  }
  body.about #minnas {
    row-gap: 40px;
    max-width: 580px;
    margin-right: auto;
    margin-left: auto;
  }
  body.about #minnas .wp-block-group__inner-container {
    flex-direction: column;
    align-items: center;
  }
  body.home #minnas .wp-block-group + .wp-block-group,
  body.about #minnas .wp-block-group + .wp-block-group {
    margin-top: 0;
  }
  body.home #minnas .wp-block-group__inner-container .wp-block-image {
    width: 160px;
  }
  body.about #minnas .wp-block-group__inner-container .wp-block-image {
    width: 160px;
  }
  body.home #minnas .wp-block-group__inner-container .wp-block-group {
    max-width: inherit;
  }
  body.about #minnas .wp-block-group__inner-container .wp-block-group {
    align-items: center;
    width: 100%;
    max-width: inherit;
  }
  body.about #minnas h2 {
    width: 100%;
    font-weight: 500;
    font-size: 1.5rem;
    text-align: center;
  }
  body.about #minnas h2 span {
    text-align: left;
  }
  body.home #feature h2:has(.zero) .heading,
  body.home #feature h3 {
    font-size: 2rem;
  }
  body.about .flex-buttons {
    gap: 30px;
  }
  body.about .flex-buttons .btn-fixed.btn-entry {
    max-width: 360px;
  }
  body.about .flex-buttons .btn-fixed.btn-entry .btn-title::before {
    display: none;
  }
  #step .smb-step__body {
    padding-left: 180px;
  }
  #step .smb-step__body>*+* {
    margin-top: 40px;
  }
  #step .smb-step__item {
    position: relative;
    min-height: 62px;
  }
  #step .smb-step__item::before {
    position: absolute;
    top: 56px;
    left: -119px;
    width: 15px;
    height: calc(100% - 32px);
    background: url(../img/img-arrow-step.svg) no-repeat center bottom / cover;
    content: '';
  }
  #step .smb-step__item:last-of-type::before {
    display: none;
  }
  #step .smb-step__item__title {
    padding-top: 0;
    font-size: 1.25rem;
  }
  #step .smb-step__item__title>.smb-step__item__number {
    left: -180px;
    width: 138px;
    height: 43px;
  }
}
@media (min-width: 1024px) {
  body.home #minnas h2 {
    font-weight: 500;
    font-size: 1.5rem;
    line-height: 1.5;
  }
  body.home .wp-block-group.features,
  body.about .wp-block-group.features {
    gap: 28px;
    width: 100%;
    max-width: inherit;
  }
  body.home .wp-block-group.features {
    margin-bottom: 40px;
  }
  body.home .wp-block-group.features > .wp-block-group,
  body.about .wp-block-group.features > .wp-block-group {
    width: calc( (100% - 112px) / 5);
    max-width: 173px;
  }
}
@media (min-width: 1200px) {
  body.home .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image + p,
  body.about .wp-block-group.features > .wp-block-group .wp-block-group__inner-container .wp-block-image + p {
    font-size: 1rem;
  }
  body.home #feature h2:has(.zero) .heading,
  body.home #feature h3 {
    font-size: 2.5rem;
  }
  body.about .page-content h3 strong {
    font-size: 2.5rem;
  }
  body.home #minnas,
  body.about #minnas {
    width: 100%;
    max-width: inherit;
  }
}

/* プラン料金 */
body.plan .page-content .container > p {
  max-width: 736px;
  margin-right: auto;
  margin-left: auto;
}
#plan {
  margin-top: 60px;
}
#plan h2 + .wp-block-group {
  gap: 1.5rem 40px;
}
#plan .wp-block-group > .wp-block-group {
  max-width: 300px;
  margin-right: auto;
  margin-left: auto;
}
#plan h3 {
  margin-bottom: 0.5em;
  color: var(--color-text);
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.5;
}
#plan h3 a {
  display: block;
  position: relative;
}
#plan h3 a::after {
  position: absolute;
  top: -3px;
  right: 0;
  width: 32px;
  height: 32px;
  background: url(../img/icon-arrow-blue.svg) no-repeat center center / contain;
  content: '';
}
#plan p a {
  color: var(--color-text);
  line-height: 1.84615;
  text-decoration: none;
}
@media (min-width: 768px) {
  #plan h2 + .wp-block-group {
    grid-template-columns: 1fr 1fr;
    max-width: 640px;
    margin-right: auto;
    margin-left: auto;
  }
  #plan {
    margin-top: 80px;
  }
}
@media (min-width: 1024px) {
  #plan h2 + .wp-block-group {
    row-gap: 40px;
  }
  #plan h3 {
    font-weight: 500;
    font-size: 1.25rem;
  }
  #plan p {
    font-size: 0.875rem;
  }
}
@media (min-width: 1366px) {
  .sec-plan #plan h2 + .wp-block-group {
    max-width: 1280px;
    grid-template-columns: 1fr 1fr 1fr 1fr
  }
}

/* プラン詳細 */
body.single-plan #about {
  margin-top: 40px;
}
body.single-plan #about h2 {
  color: var(--color-muted);
}
body.single-plan #tips {
  margin-top: 40px;
  margin-bottom: 40px;
  padding: 20px 0;
  border-top: 2px solid #CFE2F5;
  border-bottom: 2px solid #CFE2F5;
}
body.single-plan #tips h2 {
  color: var(--color-muted);
}
body.single-plan #tips .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content {
  padding: 8% 8% 0;
}
body.single-plan #tips .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content h3 {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--color-text);
  font-weight: 700;
  font-size: 1.125rem;
}
body.single-plan #tips .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content h3::before {
  width: 49px;
  height: 22px;
  background: url(../img/icon-tips.svg) no-repeat center center / contain;
  content: '';
}
body.single-plan #tips .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content p {
  margin-bottom: 0;
}
body.single-plan #tips .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__media {
  max-width: 300px;
  margin-right: auto;
  margin-left: auto;
}
body.single-plan #bill h2 {
  font-weight: 700;
  font-size: 1.125rem;
}
body.single-plan #bill p:has(strong) {
  font-size: min(1rem, 4.26667vw);
  white-space: nowrap;
}
body.single-plan #bill p:has(strong):not(.has-background) + p {
  padding: 1em 2em;
}
body.single-plan .wp-block-group.has-background {
  position: relative;
  margin-bottom: 40px;
  padding: 2em 0;
}
body.single-plan .wp-block-group.has-background::before {
  position: absolute;
  top: 0;
  left: calc(50% - 50vw);
  z-index: -1;
  width: 100vw;
  height: 100%;
  background: #F7FAFD;
  content: '';
}
body.single-plan .page-content h4 {
  padding: 4px 0.5em;
  background: #CFE2F5;
  font-weight: 700;
}
body.single-plan p.has-background {
  padding: 0.5em 1em;
}
body.home p.is-lead,
body.single-plan p.is-lead {
  display: none;
}
body.single-plan #plan {
  margin-top: 80px;
}
@media (min-width: 768px) {
  body.single-plan #about {
    margin-top: 60px;
  }
  body.single-plan #about h2 {
    font-size: 1.5rem;
  }
  body.single-plan #tips {
    margin-top: 60px;
    margin-bottom: 60px;
    border-top-width: 4px;
    border-bottom-width: 4px;
  }
  body.single-plan #tips .wp-block-media-text.has-media-on-the-right {
    grid-template-columns: 60% 40%;
  }
  body.single-plan #tips .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content {
    padding: 0 8%;
  }
  body.single-plan #tips .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content h3 {
    gap: 12px;
    font-size: 1.25rem;
  }
  body.single-plan #tips .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__media {
    max-width: 390px;
    margin-right: 0;
  }
  body.single-plan #bill h2 {
    font-size: 1.25rem;
  }
  body.single-plan .wp-block-group.has-background {
    margin-top: 40px;
    padding: 3em 2em;
  }
  body.single-plan .wp-block-group.has-background::before {
    display: none;
  }
  body.single-plan p.has-background {
    padding: 1em 2em;
  }
  body.single-plan #plan {
    margin-top: 100px;
  }
  body.single-plan #bill p:has(strong) {
    white-space: wrap;
  }
}

/* よくある質問 */
body.faq .wp-block-group:has(.wp-block-buttons),
body.single-post .wp-block-group:has(.wp-block-buttons) {
  flex-direction: column;
  gap:12px;
}
body.faq .wp-block-group:has(.wp-block-button) p,
body.single-post .wp-block-group:has(.wp-block-button) p {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 8px 1.5em;
  border-radius: 9999px;
  background: #FFF;
}
body.single-post .wp-block-group:has(.wp-block-button) p {
  border: 1px solid var(--color-primary);
}
body.faq .page-content .wp-block-buttons,
body.single-post .page-content .wp-block-buttons {
  width: 100%;
}
body.faq .page-content .wp-block-buttons>.wp-block-button,
body.single-post .page-content .wp-block-buttons>.wp-block-button {
  width: calc((100% - 1em) / 3);
  min-width: inherit;
}
body.faq .page-content .wp-block-button__link,
body.single-post .page-content .wp-block-button__link {
  padding: 8px 0;
}
body.faq .wp-block-group[id^="sec"],
body.agreement .page-content .container >.wp-block-group,
body.document .page-content .container >.wp-block-group {
  margin-top: 40px;
  padding-top: 20px;
}
body.faq .page-content h2,
body.agreement .page-content h2,
body.document .page-content h2 {
  padding: 4px 2em;
  border-radius: 9999px;
  background: #4DA5E6;
  color: #FFF;
  font-weight: 700;
  font-size: 1.125rem;
}
.smb-faq {
  border-top: 0;
}
.smb-faq__item {
  border-bottom: 0;
}
.smb-faq__item {
  padding: 2em 1.5em 2em 1em;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.7);
}
.smb-faq__item + .smb-faq__item {
  margin-top: 1.5rem;
}
.smb-faq__item__question {
  position: relative;
  margin-bottom: 0;
  padding-right: 42px;
  font-weight: 500;
}
.smb-faq__item__question::before,
.smb-faq__item__question::after {
  position: absolute;
  top: 6px;
  right: 0;
  width: 24px;
  height: 24px;
  background: url(../img/icon-faq.svg) no-repeat center center / contain;
  content: '';
}
.smb-faq__item__question::after {
  transform: rotate(90deg);
  transition: all 0.3s ease;
}
.smb-faq__item__question__label {
  margin-right: 0.5em;
  color: var(--color-primary);
  font-weight: 500;
  font-size: 1.5rem;
}
.smb-faq__item__answer__label {
  margin-right: 0.5em;
  color: var(--color-secondary);
  font-weight: 500;
  font-size: 1.5rem;
}
.smb-faq__item__question__body {
  color: var(--color-muted);
  font-weight: 500;
  font-size: 1.125rem;
}
.smb-faq__item__answer__body p strong {
  font-weight: 500;
  font-size: 1rem;
} 
.smb-faq__item__answer__body p:not(:has(strong)) {
  margin-bottom: 0;
  color: #707070;
}
/* FAQアコーディオン */
.smb-faq__item.is-open .smb-faq__item__question::after {
  transform: rotate(0);
}
.smb-faq__item__answer {
  height: 0;
  margin-top: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.smb-faq__item.is-open .smb-faq__item__answer {
  height: auto;
  margin-top: 1.5rem;
  opacity: 1;
}
@media (min-width: 768px) {
  body.faq::before {
    position: absolute;
    top: 1000px;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 2368px;
    background: url(../img/bg-faq.jpg) no-repeat center top / 1920px auto;
    content: '';
  }
  body.faq .wp-block-group:has(.wp-block-buttons),
  body.single-post .wp-block-group:has(.wp-block-buttons) {
    flex-direction: row;
    justify-content: center;
  }
  body.faq .wp-block-group:has(.wp-block-button) p,
  body.single-post .wp-block-group:has(.wp-block-button) p {
    width: 182px;
    white-space: nowrap;
  }
  body.faq .page-content .wp-block-buttons,
  body.single-post .page-content .wp-block-buttons {
    width: auto;
  }
  body.faq .page-content .wp-block-buttons>.wp-block-button,
  body.single-post .page-content .wp-block-buttons>.wp-block-button {
    width: auto;
  }
  body.faq .page-content .wp-block-button__link,
  body.single-post .page-content .wp-block-button__link {
    padding: 8px 1.5em;
  }
  .smb-faq__item__question,
  .smb-faq__item__answer {
    max-width: 750px;
    margin-right: auto;
    margin-left: auto;
  }
}
@media (min-width: 1024px) {
  .smb-faq__item__question__label,
  .smb-faq__item__answer__label {
    font-size: 2rem;
  }
  .smb-faq__item__question__body {
    font-size: 1.25rem;
  }
  .smb-faq__item__answer__body p strong {
    font-size: 1.125rem;
  }
}

/* 導入事例 */
.wp-block-case {
  max-width: 340px;
  margin-right: auto;
  margin-left: auto;
}
.plan-case__item {
  position: relative;
  margin-top: 40px;
  padding: 20px;
  border-radius: 20px;
  background: #E9F5FE;
}
@media (max-width: 600px) {
  .plan-case__item {
    padding: 20px 5.33334vw;
  }
}

.sec-case .plan-case__item {
  padding-top: 40px;
}
.plan-case__item__plan {
  position: absolute;
  top: 20px;
  left: 0;
  margin-bottom: 0 !important;
  padding: 4px 10px;
  background: var(--color-primary);
  color: #FFF;
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1 !important;
  letter-spacing: 0.05em;
}
.sec-case .plan-case__item__plan {
  position: static;
  width: 100%;
  margin-bottom: 1rem !important;
  padding: 0;
  background: transparent;
  color: var(--color-primary);
  font-size: 1.5rem;
}
.plan-case__item__image {
  overflow: hidden;
  aspect-ratio: 7 / 4;
}
.plan-case__item__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-content .plan-case__item__title {
  margin-top: 10px;
  margin-bottom: 0;
  color: var(--color-secondary);
  font-weight: 700;
  font-size: 1.125rem;
}
.page-content .plan-case__item__text {
  margin-bottom: 0;
  color: var(--color-muted);
  font-weight: 500;
  font-size: 0.8125rem;
}
.plan-case__item__comparison {
  display: flex;
  align-items: center;
  gap: 8px;
  line-height: 1.6;
  white-space: nowrap;
}
.plan-case__item__before > span,
.plan-case__item__after > span {
  color: #B4B4B4;
  font-weight: 700;
  font-size: 0.6875rem;
}
.plan-case__item__comparison .number {
  font-size: min(1.25rem, 5.33334vw);
  font-family: "ITC Avant Garde Pro", sans-serif;
}
.plan-case__item__comparison .plan-case__item__after .number {
  font-size: min(1.375rem, 5.86667vw);
}
.plan-case__item__comparison .unit {
  font-size: 0.75rem;
}
.plan-case__item__before__value {
  color: var(--color-primary);
}
.plan-case__item__after__value {
  color: var(--color-secondary);
}
.plan-case__item__arrow img {
  margin-top: 20px;
}
.sec-case .plan-case__item__metric__list {
  display: flex;
  align-items: center;
  gap: 4px;
  position: relative;
}
.plan-case__item__metric {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 8px;
  background: rgba(255, 255, 255, 0.7);
  line-height: 1 !important;
  white-space: nowrap;
}
.plan-case__item__metric + .plan-case__item__metric {
  margin-top: 4px;
}
.sec-case .plan-case__item__metric {
  flex: 1;
}
.sec-case .plan-case__item__metric + .plan-case__item__metric {
  flex: 1.43;
  margin-top: 0;
}
.metric-label {
  color: #707070;
  font-size: 0.75rem;
}
.metric-value {
  margin-top: 4px;
  color: var(--color-secondary);
  font-weight: 700;
  font-size: 0.8125rem;
}
.metric-value em {
  margin: 0 4px;
  font-weight: 500;
  font-style: normal;
  font-size: min(1.25rem, 5.33334vw);
  font-family: "ITC Avant Garde Pro", sans-serif;
  vertical-align: -2px;
}
.plan-case__item__metric__monthly {
  display: inline-flex;
  align-items: flex-end;
  gap: 2px;
  position: absolute;
  top: -80px;
  right: 0;
  padding: 8px 4px 0;
  background: var(--color-secondary);
  color: #FFF;
  line-height: 1.4 !important;
  white-space: nowrap;
}
.plan-case__item__metric__monthly::after {
  position: absolute;
  bottom: -10px;
  left: 20px;
  border-width: 0 15px 10px 15px;
  border-style: solid;
  border-color: transparent transparent transparent var(--color-secondary);
  content: '';
}
.plan-case__item__metric__monthly span:first-child {
  position: absolute;
  top: 3px;
  left: 4px;
  font-size: 0.625rem;
}
.plan-case__item__metric__monthly .number {
  font-size: 1.125rem;
  font-family: "ITC Avant Garde Pro", sans-serif;
}
.plan-case__item__metric__monthly .unit {
  margin-bottom: 4px;
  font-size: 0.6875rem;
}
.plan-case__item__metric__monthly .value {
  margin-bottom: 4px;
  -webkit-text-emphasis: filled;
  text-emphasis: filled;
  font-size: 0.8125rem;
}
.plan-case__item__button {
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}
.plan-case__item__button a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-width: 248px;
  height: 40px;
  padding: 0 14px;
  border-radius: 20px;
  background: var(--color-secondary);
  color: #FFF;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1;
}
@media (min-width: 768px) {
  .wp-block-case {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    max-width: 680px;
    margin-top: 60px;
  }
  .sec-case .wp-block-case {
    gap: 20px;
    max-width: 980px;
    margin-right: auto;
    margin-left: auto;
  }
  .plan-case__item {
    width: 320px;
    margin-top: 0;
  }
  .sec-case .plan-case__item {
    width: 100%;
    padding: 40px 20px;
  }
  .sec-case .plan-case__item__inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 740px;
    margin-right: auto;
    margin-left: auto;
  }
  .sec-case .plan-case__item__plan {
    font-size: 1.75rem;
  }
  .sec-case .plan-case__item__image {
    width: 40.54054%;
  }
  .sec-case .plan-case__item__content {
    width: 54.05405%;
    padding-right: 10.13513%;
  }
  .sec-case .plan-case__item__title {
    margin-top: 0;
  }
  .sec-case .plan-case__item__text {
    margin-bottom: 0;
  }
  .plan-case__item__metric__monthly {
    top: -60px;
    right: -18.75%;
  }
  .plan-case__item__button {
    text-align: left;
  }
}
@media (min-width: 1024px) {
  body.cases .page-content .wp-block-buttons,
  body.tax-case_category .page-content .wp-block-buttons {
    width: auto;
  }
  body.cases .page-content .wp-block-buttons>.wp-block-button,
  body.tax-case_category .page-content .wp-block-buttons>.wp-block-button {
    width: auto;
    min-width: inherit;
  }
  body.cases .page-content .wp-block-button__link,
  body.tax-case_category .page-content .wp-block-button__link {
    padding: 8px 1.5em;
  }
  .wp-block-case {
    max-width: 1040px;
  }
  .plan-case__item {
    width: calc((100% - 80px) / 3);
    max-width: 320px;
  }
  .sec-case .plan-case__item {
    max-width: inherit;
    padding: 40px 80px;
  }
}
@media (min-width: 1120px) {
  .wp-block-case {
    margin-right: -30px;
    margin-left: -30px;
  }
  .sec-case .wp-block-case {
    margin-right: auto;
    margin-left: auto;
  }
}

/* ページネーション */
.p-pagination {
  display: flex;
  justify-content: center;
  margin-top: 50px;
}
.page-numbers {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  font-weight: 500;
  line-height: 1;
}
.page-numbers li {
  display: inline-block;
}
.page-numbers li a {
  width: 36px;
  height: 36px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 2px;
  border-radius: 50%;
  border: 1px solid var(--color-primary);
  background: var(--color-primary);
  color: #FFF;
}
.page-numbers li span.current {
  width: 36px;
  height: 36px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 2px;
  border-radius: 50%;
  border: 1px solid var(--color-primary);
  background: #FFF;
  color: var(--color-primary);
}
.page-numbers li a.next,
.page-numbers li a.prev {
  position: relative;
  border-radius: 50%;
  background: var(--color-primary);
  font-size: 0;
}
.page-numbers li a.next::before,
.page-numbers li a.prev::before {
  position: absolute;
  top: calc(50% - 6px);
  left: calc(50% - 3px);
  width: 7px;
  height: 12px;
  background: url(../img/icon-arrow-next.svg) center center / contain no-repeat;
  content: '';
}
.page-numbers li a.prev::before {
  right: calc(50% - 3px);
  left: inherit;
  transform: rotate(180deg);
}
@media screen and (max-width: 768px) {
  .page-numbers li a,
  .page-numbers li span.current {
    width: 38px;
    height: 38px;
    font-size: 1.25rem;
  }
}

/* ご契約前にご確認いただく事項 */
body.agreement .page-content h2 + .wp-block-group,
body.document .page-content h2 + .wp-block-group {
  justify-content: center;
  gap: 40px;
}
body.agreement .page-content h3,
body.document .page-content h3 {
  color: var(--color-text);
  font-weight: 700;
}
body.agreement .page-content h2 + .wp-block-group > .wp-block-group,
body.document .page-content h2 + .wp-block-group > .wp-block-group {
  width: 100%;
}
body.agreement .page-content h2 + .wp-block-group > .wp-block-group > .wp-block-group__inner-container,
body.document .page-content h2 + .wp-block-group > .wp-block-group > .wp-block-group__inner-container {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body.agreement .page-content .wp-block-button__link,
body.document .page-content .wp-block-button__link {
  font-size: 1rem;
}
body.agreement .page-content .wp-block-button__link::before,
body.document .page-content .wp-block-button__link::before {
  width: 26px;
  height: 26px;
  margin-right: 10px;
  background: url(../img/icon-arrow-blue.svg) no-repeat center center / contain;
  content: '';
}
body.agreement .page-content .wp-block-button__link[href$=".pdf"]::before,
body.document .page-content .wp-block-button__link[href$=".pdf"]::before {
  background-image: url(../img/icon-arrow-pink.svg);
}
body.important ol,
body.supply ol {
  margin-left: 1em;
}
@media (min-width: 768px) {
  body.agreement .page-content h2 + .wp-block-group > .wp-block-group,
  body.document .page-content h2 + .wp-block-group > .wp-block-group {
    width: calc(50% - 20px);
  }
}

/* フォーム */
.smf-form > p > strong {
  color: var(--wp--preset--color--vivid-red);
  font-weight: 500;
  font-size: 1.2em;
}
.smf-item__label__text {
  position: relative;
}
.smf-item:has([data-validations~="required"]) .smf-item__label__text::after {
  content: "*";
  display: inline-block;
  margin-left: .125em;
  color: var(--wp--preset--color--vivid-red);
  font-weight: 500;
  font-size: 1.2em;
}

/* 料金シミュレーション */
.simulation-section {
  max-width: 400px;
  margin: 0 auto;
  border: 12px solid var(--color-primary);
  border-radius: 32px;
  background: #FFF;
}

.simulation-header {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  padding: 24px 12px 4px;
  border-top-right-radius: 20px;
  border-top-left-radius: 20px;
  background: linear-gradient(124deg,rgba(248, 235, 247, 1) 0%, rgba(251, 252, 247, 1) 50%, rgba(230, 253, 255, 1) 100%);
}
.simulation-title {
  margin-bottom: 0;
  color: var(--color-primary);
  font-weight: 700;
  font-size: 1.75rem;
  text-align: center;
}
.simulation-text {
  position: relative;
  margin-bottom: 0;
  padding-left: 64px;
  font-size: 0.8125rem;
  line-height: 1.53846;
  letter-spacing: 0.05em;
  color: var(--color-primary);
}
.simulation-text::before {
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 47px;
  height: 54px;
  background: url(../img/img-simulation.svg) no-repeat center center / contain;
  content: '';
}

.simulation-block {
  container-type: inline-size;
}
.simulation-form-group {
  padding: 32px 3.56234vw 0;
}
.form-label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 12px;
  font-weight: 700;
  font-size: 0.9375rem;
  line-height: 1.4;
  color: var(--color-primary);
  white-space: nowrap;
}
.form-labels .form-label {
  gap: 4px;
  font-size: 0.8125rem;
}
.form-label .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-secondary);
}
@media (min-width: 380px) {
  .form-label {
    letter-spacing: 0.05em;
  }
}

.area-buttons {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px 12px;
}
.area-btn {
  display: block;
  position: relative;
  padding: 12px 16px;
  border: 2px solid var(--color-primary);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.7);
  color: var(--color-muted);
  font-weight: 500;
  font-size: 0.9375rem;
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
}
.area-btn input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.area-btn:hover {
  background: rgba(255, 255, 255, 0.9);
}
.area-btn input[type="radio"]:checked + span,
.area-btn:has(input[type="radio"]:checked) {
  background: var(--color-primary);
  color: #FFF;
}

.select-wrapper {
  position: relative;
}
.select-wrapper::after {
  position: absolute;
  right: 10px;
  top: calc(50% - 9px);
  width: 18px;
  height: 18px;
  background: url(../img/icon-arrow-down.svg) no-repeat center center / contain;
  pointer-events: none;
  content: '';
}
.plan-select,
.manual_size_unit-select,
.campaign-select {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 40px;
  padding: 0 20px;
  border: none;
  border-radius: 10px;
  background: #F1EFEF;
  color: var(--color-muted);
  font-weight: 700;
  font-size: 1rem;
  font-family: inherit;
  letter-spacing: 0.05em;
  cursor: pointer;
}
.manual_size_unit-select {
  min-width: 120px;
}
.plan-select:focus,
.manual_size_unit-select:focus,
.campaign-select:focus {
  outline: 2px solid var(--color-primary);
}
.simulation-input-group {
  display: grid;
  gap: 24px;
  padding: 32px 3.56234vw 0;
}

.input-item {
  display: grid;
  gap: 12px;
}

.form-labels,
.input-boxes {
  display: grid;
  grid-template-columns: 0.75fr 1fr 1fr;
  gap: 12px;
}
.input-row + .input-row {
  margin-top: 18px;
}

.input-capacity {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}
.input-box {
  display: flex;
  align-items: center;
  gap: 3px;
}
.input-box:has(select) {
  position: relative;
}
.input-box:has(select)::after {
  position: absolute;
  right: 4px;
  top: calc(50% - 9px);
  width: 18px;
  height: 18px;
  background: url(../img/icon-arrow-down.svg) no-repeat center center / contain;
  pointer-events: none;
  content: '';
}
.input-field {
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0 8px;
  border: none;
  border-radius: 10px;
  background: #F1EFEF;
  color: var(--color-muted);
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.2;
  font-family: inherit;
  letter-spacing: 0.05em;
  text-align: right;
}
select.input-field {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
}
.input-field:focus {
  outline: 2px solid var(--color-primary);
}
.input-capacity .input-box {
  width: 140px;
}
.input-capacity .input-field {
  padding: 0 20px;
  text-align: left;
}
/* 入力エラー時の赤枠 */
.input-field.is-error {
  outline: 3px solid #ff0000;
}
.input-field option {
  text-align: left;
}
.input-unit {
  color: var(--color-muted);
  font-weight: 700;
  font-size: 0.875rem;
}

.input-comments { display: none; }
.input-comments.is-visible {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}

.input-comment {
  margin-bottom: 0;
  /* color: var(--color-primary); */
  color: #303030;
  font-weight: 700;
  font-size: 0.8125rem;
  line-height: 1.2;
}
.input-comment span > span {
  /* color: var(--color-secondary); */
  color: #303030;
}
.input-comment span em {
  font-style: normal;
  font-size: 1.125rem;
  letter-spacing: 0.05em;
}
.input-comment span.text-negative {
  color: #ff1111;
}
.input-comment span.text-positive {
  color: #1111ff;
}
.input-comment span.text-smaller {
  font-size: 0.6875rem;
  color: #ff1111;
  letter-spacing: -0.05em;
}
.addition-action {
  margin-top: 20px;
  text-align: center;
}
.btn-add-row {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  background: transparent;
  border: none;
  color: var(--color-primary);
  font-weight: 700;
  font-size: 0.9375rem;
  line-height: 1.2;
  letter-spacing: 0.05em;
  cursor: pointer;
}
.btn-add-row span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.btn-add-row span::before {
  width: 26px;
  height: 26px;
  background: url(../img/icon-add.svg) no-repeat center center / contain;
  content: '';
}

.simulation-action {
  text-align: center;
  margin-top: 40px;
  margin-bottom: 32px;
}
.btn-simulate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  max-width: 300px;
  padding: 16px 32px;
  border: none;
  border-radius: 54px;
  background: var(--color-primary);
  color: #FFF;
  font-weight: 700;
  font-size: 1.1875rem;
  letter-spacing: 0.05em;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.3s ease;
}
.btn-simulate::after {
  position: absolute;
  top: calc(50% - 13px);
  right: 16px;
  width: 26px;
  height: 26px;
  background: url(../img/icon-arrow-circle.svg) no-repeat center center / contain;
  content: '';
}
.btn-simulate:hover {
  opacity: 0.9;
  transform: translateY(2px);
}
.btn-simulate span {
  margin-right: 0.5em;
}

.simulation-result {
  position: relative;
  width: 84.92653cqw;
  height: 77.97101cqw;
  margin: 90px auto 0;
}
.simulation-result::before {
  position: absolute;
  top: -62px;
  left: calc(50% - 14.5px);
  width: 34px;
  height: 29px;
  background: url(../img/icon-result.svg) no-repeat center center / contain;
  content: '';
  transform: rotate(90deg);
}
.simulation-result::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/img-flame-sp.svg) no-repeat center center / contain;
  content: '';
  pointer-events: none;
}
.result-container {
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.result-header {
  padding: 38px 11.59420cqw 20px;
  background: linear-gradient(rgba(248, 235, 247, 1) 0%, rgba(251, 252, 247, 1) 50%, rgba(230, 253, 255, 1) 100%);
}

.result-title {
  font-weight: 700;
  font-size: 0.875rem;
  color: var(--color-primary);
  margin-bottom: 4px;
}
.result-text,
.result-title-sub {
  font-weight: 700;
  font-size: 0.875rem;
  color: var(--color-primary);
}
.result-text {
  margin-bottom: 1px;
}

.result-content {
  padding: 20px 11.59420cqw 38px;
  background: #F8EBF7;
}

.result-price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  font-weight: 700;
}
.price-value {
  font-size: 1.75rem;
  line-height: 1;
  color: var(--color-secondary);
}
.price-unit {
  font-size: 1rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--color-secondary);
}

.result-savings {
  display: flex;
  align-items: baseline;
  gap: 8px;
  color: var(--color-secondary);
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  white-space: nowrap;
}
@media (max-width: 410px) {
  .result-savings {
    font-size: 0.6875rem;
  }
}
.savings-value {
  font-size: 1.75rem;
  line-height: 1.2;
}
.savings-value.text-negative {
  color: #ff1111;
}
.savings-value.text-positive {
  color: #1111ff;
}
.savings-label.text-positive {
  color: #1111ff;
}
.savings-label .text-smaller {
  font-size: 0.6875rem;
  color: #ff1111;
  letter-spacing: -0.2em;
}

.result-description {
  font-size: 12px;
  line-height: 1.45em;
  letter-spacing: 0.05em;
  color: var(--color-secondary);
}
.price-note {
  margin-top: 0;
  font-size: 0.75rem;
  text-align: center;
  line-height: 1.41;
  color: #303030;
}

.simulation-notes {
  padding: 32px 3.56234vw 0;
}
.simulation-notes p {
  font-size: 0.75rem;
  line-height: 1.41;
  color: var(--color-secondary);
  margin-bottom: 0;
}
.simulation-notes ul {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
}
.simulation-notes li {
  font-size: 0.6875rem;
  line-height: 1.27;
  color: #1B1D1D;
  margin-top: 12px;
}
.simulation-notice {
  text-align: center;
  font-size: 0.8125rem;
  line-height: 1.27;
  color: #1B1D1D;
  margin: 1em 0 0;
}

/* レスポンシブ対応 */
@media (min-width: 768px) {
  .simulation-notes p {
    font-size: 0.8125rem;
  }
  .simulation-notes li {
    font-size: 0.75rem;
  }
  .simulation-notice {
    margin-top: 2em;
    font-size: 0.875rem;
  }
  .simulation-notice br {
    display: none;
  }
}

@media (min-width: 980px) {
  .simulation-section {
    display: flex;
    flex-wrap: wrap;
    max-width: 980px;
    border-width: 18px;
  }
  .simulation-header {
    width: 100%;
    margin-bottom: 80px;
    padding: 40px 0 20px 84px;
  }
  .page-content .simulation-title {
    width: 340px;
    line-height: 1.4;
    text-align: left;
  }
  .simulation-text {
    width: 340px;
    padding-left: 0;
    white-space: nowrap;
  }
  .simulation-text br {
    display: none;
  }
  .simulation-text::before {
    top: -14px;
    bottom: inherit;
    left: -84px;
    width: 78px;
    height: 88px;
  }
  .simulation-block {
    width: 446px;
    margin-left: 42px;
  }
  .simulation-block + .simulation-block {
    width: 360px;
    margin-right: 50px;
    margin-left: auto;
  }
  .simulation-form-group {
    padding: 0 0 32px;
  }
  .simulation-input-group {
    padding: 30px 0 0;
  }
  .form-label {
    gap: 8px;
    margin-bottom: 20px;
    font-size: 1.125rem;
  }
  .form-labels .form-label {
    gap: 8px;
    font-size: 1.125rem;
  }
  .form-label .dot {
    width: 9px;
    height: 9px;
  }
  .area-buttons {
    gap: 16px 14px;
    width: 400px;
    margin-left: 18px;
  }
  .area-btn {
    padding: 13px 16px;
    font-size: 1.125rem;
  }
  .select-wrapper,
  .input-capacity {
    width: 400px;
    margin-left: 18px;
  }
  .input-capacity .select-wrapper {
    width: 150px;
    margin-left: 0;
  }
  .plan-select,
  .manual_size_unit-select,
  .campaign-select {
    height: 48px;
    font-size: 1.125rem;
  }
  .input-row {
    margin-left: 18px;
  }
  .form-labels,
  .input-boxes {
    gap: 16px;
  }
  .input-field {
    height: 48px;
    padding: 0 16px;
    font-size: 1.125rem;
  }
  .input-box:has(select)::after {
    right: 6px;
  }
  .input-capacity .input-box {
    width: 310px;
  }
  .input-unit {
    font-size: 1.125rem;
  }
  .input-comment {
    font-size: 0.9375rem;
  }
  .input-comment span em {
    font-size: 1.5rem;
  }
  .btn-add-row {
    font-size: 1.125rem;
  }
  .btn-add-row span {
    gap: 12px;
  }
  .btn-add-row span::before {
    width: 32px;
    height: 32px;
  }
  .simulation-action {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .btn-simulate {
    max-width: 394px;
    height: 76px;
    font-size: 1.5rem;
  }
  .btn-simulate::after {
    top: calc(50% - 16px);
    right: 20px;
    width: 32px;
    height: 32px;
  }
  .simulation-result {
    width: 100%;
    height: 335px;
    margin-top: 0;
  }
  .simulation-result::before {
    display: none;
  }
  .simulation-result::after {
    background-image: url(../img/img-flame.svg);
  }
  .result-header {
    padding: 42px 44px 14px;
  }
  .result-content {
    padding: 13px 44px 38px;
  }
  .result-title {
    font-size: 1.125rem;
  }
  .price-value {
    font-size: 3rem;
  }
  .price-unit {
    font-size: 1.5rem;
  }
  .result-savings {
    font-size: 1.1875rem;
    letter-spacing: 0;
  }
  .savings-value {
    font-size: 2rem;
  }
  .result-savings.savings-yearly {
    margin-top: 4px;
    font-size: 1.25rem;
  }
  .savings-yearly .savings-value {
    font-size: 2.5rem;
  }
  .simulation-notes {
    margin-top: 100px;
    margin-bottom: 80px;
    padding: 0;
  }
  .simulation-notes p {
    font-size: 0.875rem;
  }
  .simulation-notes li {
    font-size: 0.8125rem;
    line-height: 1.41;
  }
}