/* LP改善（2026年10月 広告配信向け改善提案への対応） */

/* 比較表：SODATSUの価格を強調 */
.p_top .comparison__table .comparison__price {
  font-size: 4rem;
  color: #00AA6E;
  line-height: 1.1;
}
/* 「補助金利用可」バッジと重ならないよう右に余白 */
@media screen and (min-width: 769px) {
  .p_top .comparison__table tbody tr:first-child .comparison__price {
    padding-right: 3.5rem;
  }
}

/* 比較表・補助金ブロック直後のCTA */
.p_top .cta--subsidy {
  margin-top: 4rem;
}

@media screen and (max-width: 768px) {
  .p_top .comparison__table .comparison__price {
    font-size: 7.24638vw;
  }
  .p_top .cta--subsidy {
    margin-top: 8vw;
  }
}

.fv__price {
  grid-area: price;
  align-self: start;
  justify-self: start;
  width: 39.9rem;
  margin: 0 0 0 3.4rem;
  text-align: center;
  color: #005932;
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.2;
}
.fv__price-main { font-size: 2.4rem; }
.fv__price-main strong {
  margin: 0 .1em;
  color: #e5352b;
  font-size: 4.2rem;
  font-family: "Inter", sans-serif;
  line-height: 1;
}
.fv__price-sub { font-size: 1.6rem; }
.fv__price-note {
  display: block;
  margin-top: .3rem;
  color: #373737;
  font-size: 1.2rem;
  font-weight: 500;
}

/* フォーム：返信目安 */
.p_top .contact__reply {
  margin: -1.5rem 0 3rem;
  text-align: center;
  color: #005932;
  font-weight: 700;
  font-size: 1.6rem;
}

@media screen and (max-width: 768px) {
  .fv__price {
    order: 5;
    width: 100%;
    margin: 0;
    padding: 4.83092vw 3.86473vw 0;
    background: var(--fv-green);
    color: #fff;
    font-size: 3.62319vw;
  }
  .fv__price-main { font-size: 4.83092vw; }
  .fv__price-main strong { color: #ffff53; font-size: 8.69565vw; }
  .fv__price-sub { font-size: 3.38164vw; }
  .fv__price-note { margin-top: .96618vw; color: #fff; font-size: 2.65700vw; }
  .fv__price + .fv__cta { margin-top: -1px; padding-top: 3.86473vw; }
  .p_top .contact__reply { margin: -2vw 0 5.31401vw; font-size: 3.38164vw; }
}

/* 相談ボタン下：アカウントがなくても相談OK */
.cta-sub {
  margin: .8rem 0 0;
  text-align: center;
  color: #fff;
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.4;
}
@media screen and (max-width: 768px) {
  .cta-sub { margin-top: 1.93237vw; font-size: 3.38164vw; }
}


/* 導入事例：導入内容 */
.p_top .case__plan {
  margin: -.4rem 0 1.6rem;
  text-align: center;
  color: #555;
  font-weight: 700;
  font-size: 1.5rem;
}

@media screen and (max-width: 768px) {
  .p_top .case__plan { margin: -1vw 0 3.86473vw; font-size: 3.38164vw; }
}

/* フォーム：選択済みの項目は文字色を濃くする（未選択と見分けるため） */
.p_top .contact .form dl dd .select label select:has(option:checked:not([value=""])) {
  color: #333;
}

/* 比較表：スマホは「SODATSU vs 一般的な制作会社」の2列（横スクロールなし） */
@media screen and (max-width: 768px) {
  .p_top .comparison .comparison_tb--sp2 { margin-right: 0; overflow: visible; }
  .p_top .comparison .comparison_tb--sp2 .comparison__table { width: 100%; }
  .p_top .comparison_tb--sp2 .comparison__table th:nth-child(4),
  .p_top .comparison_tb--sp2 .comparison__table th:nth-child(5),
  .p_top .comparison_tb--sp2 .comparison__table td:nth-child(4),
  .p_top .comparison_tb--sp2 .comparison__table td:nth-child(5) { display: none; }
  .p_top .comparison_tb--sp2 .comparison__table thead th:first-child { width: 22%; }
  .p_top .comparison_tb--sp2 .comparison__table thead th:nth-child(2),
  .p_top .comparison_tb--sp2 .comparison__table thead th:nth-child(3) { width: 39%; }
  .p_top .comparison_tb--sp2 .comparison__table thead th:nth-child(3) {
    border-radius: 4.83092vw 4.83092vw 0 0;
    line-height: 1.2;
  }
  .p_top .comparison_tb--sp2 .comparison__table th:nth-child(3),
  .p_top .comparison_tb--sp2 .comparison__table td:nth-child(3) { border-right: 0 !important; }
}

/* ===== FV：2026/10 改善デザイン（対象テキスト・2ボタン横並び・注記1行） ===== */
.fv__target {
  grid-area: target;
  justify-self: start;
  width: 42rem;
  margin: 0;
  text-align: center;
  color: var(--fv-green);
  font-weight: 900;
  font-size: 2.6rem;
  letter-spacing: .1em;
  line-height: 1.4;
}
.fv__target span { position: relative; display: inline-block; padding: 0 4rem; }
.fv__target span::before,
.fv__target span::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 3px;
  height: 3rem;
  background: currentColor;
}
.fv__target span::before { left: .6rem; transform: translateY(-50%) rotate(-30deg); }
.fv__target span::after { right: .6rem; transform: translateY(-50%) rotate(30deg); }

.fv__cta-buttons { display: flex; gap: .7rem; }
.fv .fv__cta-buttons .fv__cta-link,
.fv .fv__doc-link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 5.8rem;
  border: 2px solid #008b4d;
  border-radius: 3.2rem;
  font-weight: 700;
  box-shadow: 0 .3rem .4rem rgba(0, 0, 0, .18);
}
.fv .fv__cta-buttons .fv__cta-link {
  flex: 0 0 25rem;
  width: auto;
  font-size: 2rem;
  padding-right: 2.4rem;
}
.fv .fv__cta-buttons .fv__cta-link::after { right: 2.2rem; }
.fv .fv__doc-link {
  flex: 1 1 auto;
  background: #fff;
  color: #005932;
  text-align: center;
  font-size: 1.65rem;
  line-height: 1.35;
  white-space: nowrap;
  padding: 0 3.4rem 0 1.2rem;
}
.fv .fv__doc-link::after {
  content: "";
  position: absolute;
  right: 2.2rem;
  top: 50%;
  transform: translateY(-50%);
  width: .807rem;
  height: 1.7rem;
  background: url('../img/ar.webp') center / 100% 100% no-repeat;
}
.fv__cta-sub {
  margin: 1.3rem 0 0;
  color: #005932;
  font-weight: 500;
  font-size: 1.3rem;
  line-height: 1.4;
  text-align: center;
  white-space: nowrap;
}
.fv__cta-sub strong { font-weight: 900; }
.fv__cta-sep {
  display: inline-block;
  width: 1px;
  height: 1.5rem;
  margin: 0 1.5rem;
  vertical-align: middle;
  background: #005932;
}

/* 実績バッジの間の区切り線 */
.fv__stats { position: relative; }
.fv__stats::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 22%;
  width: 1px;
  height: 56%;
  background: #8a8a8a;
}

@media screen and (min-width: 769px) {
  .fv__inner {
    grid-template-rows: auto auto auto auto;
    grid-template-areas: 'target visual' 'title visual' 'price visual' 'cta stats';
  }
  .fv__visual { align-self: start; margin-top: .4rem; }
  .fv__title { padding-top: .6rem; }
  .fv__price { margin-top: 1rem; }
  .fv__cta {
    width: 49rem;
    margin: 2.2rem 0 0 -2.6rem;
    filter: none;
  }
  .fv__stats { align-self: center; margin-top: 2rem; }
}

@media screen and (max-width: 768px) {
  .fv__target {
    order: 0;
    justify-self: auto;
    width: 100%;
    padding-top: 5.31401vw;
    font-size: 5.07246vw;
  }
  .fv__target span { padding: 0 6.76329vw; }
  .fv__target span::before,
  .fv__target span::after { height: 4.83092vw; }
  .fv__target span::before { left: 1.20773vw; }
  .fv__target span::after { right: 1.20773vw; }
  .fv__title { padding-top: 1.20773vw; height: 44.92754vw; }
  .fv__cta-buttons { flex-direction: column; gap: 2.89855vw; }
  .fv .fv__cta-buttons .fv__cta-link,
  .fv .fv__doc-link { flex: none; width: 100%; height: 13.22053vw; border-width: .4198vw; border-radius: 7.24vw; }
  .fv .fv__cta-buttons .fv__cta-link { font-size: 4.82657vw; padding-right: 4.10628vw; }
  .fv .fv__cta-buttons .fv__cta-link::after,
  .fv .fv__doc-link::after { right: 6.5vw; width: 1.68vw; height: 3.56739vw; }
  .fv .fv__doc-link { font-size: 3.86473vw; padding: 0 9vw; }
  .fv .fv__doc-link br { display: none; }
  .fv__cta-sub {
    margin-top: 3.38164vw;
    color: #fff;
    font-size: 3.14010vw;
    white-space: normal;
  }
  .fv__cta-sep { display: block; width: 0; height: .96618vw; margin: 0; background: none; }
}

/* ロゴ：1リストに2周分並べたので、流れる速さを保つため時間も倍に */
.fv__logo-track { animation-duration: 60s; }

/* FV：画面の高さに合わせて拡大し、ロゴの帯を最初の画面の下端に置く（倍率は js/script.js で計算） */
@media screen and (min-width: 769px) {
  .p_top .mv.fv {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 7.5rem);
  }
  .fv__inner {
    zoom: var(--fv-scale, 1);
    margin: auto;
  }
}

/* 余白の調整：補助金CTAの直後の見出しが帯に接しないように */
.p_top .cta--subsidy + .how { padding-top: 6rem; }
/* 余白の調整：緑のセクション（採用成功事例）と直後のCTAの間に白い隙間が出ないように */
.p_top section.success:has(+ .cta) { margin-bottom: 0; }

@media screen and (max-width: 768px) {
  .p_top .cta--subsidy + .how { padding-top: 10.62802vw; }
}

/* フォーム：送信ボタン上のまとめメッセージ */
.p_top .contact .form .error--submit {
  margin: 0 0 1.2rem;
  text-align: center;
  font-weight: 700;
}
.p_top .contact .form button:disabled { opacity: .6; }
