@charset "UTF-8";
/*!
 * tax-return.css
 * 確定申告・スポット申告LP（/services/tax-return/）の追加スタイル（2026-08-01）
 *
 * style.css は SCSS からのコンパイル成果物のため、再ビルドで上書きされないよう
 * 本ファイルに分離している。読み込みは page-tax-return.php を参照（このページ専用）。
 *
 * 内容
 *   1. ファーストビュー（freee導入支援LPのFVを流用し、差分だけ上書き）
 *   2. 「単発OK！」バッジ
 *   3. SERVICE（プランカード）
 *   4. PLAN（スポットサービス料金・法人／個人の3列テーブル）
 *   5. FLOW の注意書き
 *   6. COMPANY（事務所概要）
 *
 * ※ 数値は Figma（PC 1440px アートボード）の座標をそのまま
 *    min(N * 1rem / var(--font-size), N / 1440 * 100vw) の形で持たせている。
 *    既存の .m-freee-support-hero__* と同じ考え方。
 */

/* =========================================
   1. ファーストビュー

   1-1. 重なり順の固定
        背景の白い線画（hero-bg.svg）は必ず背面、人物イラストは前面。
        freee導入支援LPで同じ症状（キャッシュ状態によって線画が最前面に出る）が
        あったため、同じ処置を最初から入れておく。詳細は freee-support.css を参照。
   ========================================= */
.m-tax-return-hero .m-freee-support-hero__mv {
  isolation: isolate;
}

.m-tax-return-hero .m-freee-support-hero__mv-bg {
  z-index: 0;
}

.m-tax-return-hero .m-freee-support-hero__mv-illu {
  z-index: 1;
  mix-blend-mode: normal;
  /* Figma: 人物イラスト 354x308 を MV枠 720x341 の中に配置 */
  inset-block-start: 0;
  inset-inline-start: 25.4166666667%;
  inline-size: 49.1666666667%;
  block-size: 90.322580645%;
}

/* 1-2. 見出し・カードの位置（Figma のグリッドに合わせて freee版から微調整） */
.m-tax-return-hero .m-freee-support-hero__title {
  inset-inline-start: min(249 * 1rem / var(--font-size), 249 / 1440 * 100vw);
}

.m-tax-return-hero .m-freee-support-hero__card {
  inset-block-start: min(275 * 1rem / var(--font-size), 275 / 1440 * 100vw);
  inset-inline-start: min(825 * 1rem / var(--font-size), 825 / 1440 * 100vw);
  inline-size: min(370 * 1rem / var(--font-size), 370 / 1440 * 100vw);
}

/* 1-3. FVポイント「期限間際・期限後も対応可能」のアイコン枠 */
.m-tax-return-hero__point-icon-inner--deadline {
  inline-size: calc(53 * 1rem / var(--font-size));
  block-size: calc(53 * 1rem / var(--font-size));
}

/* =========================================
   2. 「単発OK！」バッジ
   Figma: Group 20 / x:720 y:211 143x129（円 116x116・メガホン 59x51）
   ========================================= */
.m-tax-return-hero__badge {
  position: absolute;
  inset-block-start: min(211 * 1rem / var(--font-size), 211 / 1440 * 100vw);
  inset-inline-start: min(720 * 1rem / var(--font-size), 720 / 1440 * 100vw);
  z-index: 3;
  display: block;
  inline-size: min(143 * 1rem / var(--font-size), 143 / 1440 * 100vw);
  block-size: min(129 * 1rem / var(--font-size), 129 / 1440 * 100vw);
}

.m-tax-return-hero__badge-text {
  position: absolute;
  inset-block-start: min(13 * 1rem / var(--font-size), 13 / 1440 * 100vw);
  inset-inline-start: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: min(116 * 1rem / var(--font-size), 116 / 1440 * 100vw);
  block-size: min(116 * 1rem / var(--font-size), 116 / 1440 * 100vw);
  border: calc(2 * 1rem / var(--font-size)) solid var(--color__black);
  border-radius: 50%;
  background-color: var(--color__white);
  font-family: var(--font-family__zen);
  font-size: min(16 * 1rem / var(--font-size), 16 / 1440 * 100vw);
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--color__black);
}

.m-tax-return-hero__badge-mark {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: min(84 * 1rem / var(--font-size), 84 / 1440 * 100vw);
  z-index: 1;
  display: block;
  inline-size: min(59 * 1rem / var(--font-size), 59 / 1440 * 100vw);
  block-size: auto;
}

/* =========================================
   3. SERVICE（プランカード）
   Figma: compare/service / node 4915-16646
   ========================================= */
.m-tax-return-service {
  padding-block: calc(80 * 1rem / var(--font-size)) calc(120 * 1rem / var(--font-size));
  border-start-start-radius: calc(80 * 1rem / var(--font-size));
  border-start-end-radius: calc(80 * 1rem / var(--font-size));
  background-color: var(--color__cream);
}

.m-tax-return-service__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(40 * 1rem / var(--font-size));
}

.m-tax-return-service__list {
  display: flex;
  flex-direction: column;
  gap: calc(24 * 1rem / var(--font-size));
  inline-size: 100%;
  list-style: none;
  padding-inline-start: 0;
}

.m-tax-return-service__item {
  display: grid;
  grid-template-columns: calc(400 * 1rem / var(--font-size)) minmax(0, 1fr);
  align-items: center;
  gap: calc(40 * 1rem / var(--font-size));
  padding: calc(40 * 1rem / var(--font-size));
  border-radius: calc(16 * 1rem / var(--font-size));
  background-color: var(--color__white);
}

.m-tax-return-service__head {
  display: flex;
  align-items: center;
  gap: calc(24 * 1rem / var(--font-size));
}

.m-tax-return-service__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  inline-size: calc(120 * 1rem / var(--font-size));
  block-size: calc(120 * 1rem / var(--font-size));
  border-radius: 50%;
  background-color: var(--color__yellow);
}

.m-tax-return-service__icon > img {
  display: block;
  inline-size: 70%;
  block-size: auto;
}

.m-tax-return-service__labels {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(8 * 1rem / var(--font-size));
  min-inline-size: 0;
}

.m-tax-return-service__num {
  display: inline-block;
  padding: calc(6 * 1rem / var(--font-size)) calc(16 * 1rem / var(--font-size));
  border-radius: calc(999 * 1rem / var(--font-size));
  background-color: var(--color__black);
  font-family: var(--font-family__montserrat);
  font-size: calc(14 * 1rem / var(--font-size));
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.1em;
  color: var(--color__white);
}

.m-tax-return-service__title {
  font-family: var(--font-family__zen);
  font-size: calc(24 * 1rem / var(--font-size));
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: var(--color__black);
}

.m-tax-return-service__target {
  font-family: var(--font-family__zen);
  font-size: calc(14 * 1rem / var(--font-size));
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: var(--color__gray700);
}

.m-tax-return-service__body {
  display: flex;
  flex-direction: column;
  gap: calc(16 * 1rem / var(--font-size));
  min-inline-size: 0;
}

.m-tax-return-service__desc {
  font-family: var(--font-family__zen);
  font-size: calc(15 * 1rem / var(--font-size));
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: var(--color__black);
}

.m-tax-return-service__checks {
  display: flex;
  flex-wrap: wrap;
  gap: calc(8 * 1rem / var(--font-size)) calc(24 * 1rem / var(--font-size));
  padding: calc(16 * 1rem / var(--font-size)) calc(24 * 1rem / var(--font-size));
  border-radius: calc(8 * 1rem / var(--font-size));
  background-color: var(--color__gray100);
  list-style: none;
}

.m-tax-return-service__check {
  display: flex;
  align-items: center;
  gap: calc(8 * 1rem / var(--font-size));
  font-family: var(--font-family__zen);
  font-size: calc(15 * 1rem / var(--font-size));
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: var(--color__black);
}

.m-tax-return-service__check-icon {
  flex-shrink: 0;
  inline-size: calc(16 * 1rem / var(--font-size));
  block-size: calc(16 * 1rem / var(--font-size));
}

/* =========================================
   4. PLAN（スポットサービス料金）
   表本体は助成金LPの .m-subsidy-table を流用し、3列用の列幅だけここで定義する
   ========================================= */
.m-tax-return-price .m-subsidy-price__inner {
  gap: calc(40 * 1rem / var(--font-size));
}

.m-tax-return-price__group {
  inline-size: 100%;
}

.m-tax-return-price__group + .m-tax-return-price__group {
  padding-block-start: calc(40 * 1rem / var(--font-size));
}

.m-tax-return-price__group-title {
  font-family: var(--font-family__zen);
  font-size: calc(20 * 1rem / var(--font-size));
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.05em;
  text-align: center;
  color: var(--color__black);
}

.m-subsidy-table--tax-return {
  padding-block-start: calc(24 * 1rem / var(--font-size));
}

.m-subsidy-table--tax-return .m-subsidy-table__grid {
  grid-template-columns: calc(180 * 1rem / var(--font-size)) calc(184 * 1rem / var(--font-size)) minmax(0, 1fr);
}

.m-subsidy-table--tax-return .m-subsidy-table__head:nth-child(3) {
  border-inline-end: calc(2 * 1rem / var(--font-size)) solid var(--color__yellow);
}

.m-subsidy-table--tax-return .m-subsidy-table__grid > *:nth-last-child(-n+3) {
  border-block-end: 0;
}

/* =========================================
   5. FLOW の注意書き（Figma: Frame 2607）
   ========================================= */

/* 縦線は「最後の item 以外」に描かれる（style.css）。このページは注意書きが
   リストの最後に来るため、最終 STEP が最後の item と見なされず線が注意書きまで
   伸びてしまう。注意書きの直前の item では線を消す。 */
.m-incorporation-flow__item:has(+ .m-tax-return-flow__note)
  > .m-incorporation-flow__icon-wrap::after {
  content: none;
}

.m-tax-return-flow__note {
  display: flex;
  flex-direction: column;
  gap: calc(8 * 1rem / var(--font-size));
  padding-block-start: calc(32 * 1rem / var(--font-size));
  list-style: none;
}

.m-tax-return-flow__note-title {
  font-family: var(--font-family__zen);
  font-size: calc(15 * 1rem / var(--font-size));
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: var(--color__black);
}

.m-tax-return-flow__note-text {
  font-family: var(--font-family__zen);
  font-size: calc(13 * 1rem / var(--font-size));
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: var(--color__gray700);
}

/* =========================================
   6. COMPANY（事務所概要）
   表と地図そのものは .m-top-company__*（style.css）を共用しているため、
   ここではセクションの余白・背景だけを定義する。
   前後の MESSAGE / FAQ と同じ gray100 背景で連続させる。
   ========================================= */
.m-tax-return-access {
  padding-block: calc(60 * 1rem / var(--font-size)) calc(20 * 1rem / var(--font-size));
  background-color: var(--color__gray100);
}

.m-tax-return-access__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* =========================================
   SP（767px 以下）
   ========================================= */
@media (max-width: 767px) {
  /* FV：バッジは MV とキャッチコピーの間に流し込む（PCの絶対配置を解除）
     ※ 中の円とメガホンは絶対配置のままなので、relative は残して基準にする */
  .m-tax-return-hero__badge {
    position: relative;
    inset: auto;
    inline-size: calc(104 * 1rem / var(--font-size));
    block-size: calc(94 * 1rem / var(--font-size));
    margin-block-start: calc(16 * 1rem / var(--font-size));
    margin-inline: auto;
  }

  .m-tax-return-hero__badge-text {
    inset-block-start: calc(9 * 1rem / var(--font-size));
    inline-size: calc(84 * 1rem / var(--font-size));
    block-size: calc(84 * 1rem / var(--font-size));
    font-size: calc(13 * 1rem / var(--font-size));
  }

  .m-tax-return-hero__badge-mark {
    inset-inline-start: calc(61 * 1rem / var(--font-size));
    inline-size: calc(43 * 1rem / var(--font-size));
  }

  .m-tax-return-hero .m-freee-support-hero__card {
    inset: auto;
    inline-size: 100%;
    max-inline-size: calc(360 * 1rem / var(--font-size));
    padding-block-start: calc(24 * 1rem / var(--font-size));
  }

  .m-tax-return-hero__point-icon-inner--deadline {
    inline-size: calc(37 * 1rem / var(--font-size));
    block-size: calc(37 * 1rem / var(--font-size));
  }

  /* SERVICE */
  .m-tax-return-service {
    padding-block: calc(56 * 1rem / var(--font-size)) calc(80 * 1rem / var(--font-size));
    border-start-start-radius: calc(40 * 1rem / var(--font-size));
    border-start-end-radius: calc(40 * 1rem / var(--font-size));
  }

  .m-tax-return-service__item {
    grid-template-columns: minmax(0, 1fr);
    gap: calc(20 * 1rem / var(--font-size));
    padding: calc(24 * 1rem / var(--font-size));
  }

  .m-tax-return-service__head {
    gap: calc(16 * 1rem / var(--font-size));
  }

  .m-tax-return-service__icon {
    inline-size: calc(80 * 1rem / var(--font-size));
    block-size: calc(80 * 1rem / var(--font-size));
  }

  .m-tax-return-service__title {
    font-size: calc(19 * 1rem / var(--font-size));
  }

  .m-tax-return-service__desc,
  .m-tax-return-service__check {
    font-size: calc(14 * 1rem / var(--font-size));
  }

  .m-tax-return-service__checks {
    flex-direction: column;
    gap: calc(4 * 1rem / var(--font-size));
    padding: calc(16 * 1rem / var(--font-size));
  }

  /* PLAN：SPは列幅を詰める */
  .m-subsidy-table--tax-return .m-subsidy-table__grid {
    grid-template-columns: calc(96 * 1rem / var(--font-size)) calc(104 * 1rem / var(--font-size)) minmax(0, 1fr);
  }

  /* 料金セル（2列目）は SP の列幅に「330,000円(税込)〜」が 1 行で入らず、
     「円(税込)」が途中で折れて数字と重なるため、数字と単位を 2 行に分ける */
  .m-subsidy-table--tax-return .m-subsidy-table__grid > *:nth-child(3n + 2) {
    flex-wrap: wrap;
  }

  .m-subsidy-table--tax-return .m-subsidy-table__num {
    flex-basis: 100%;
  }

  .m-subsidy-table--tax-return .m-subsidy-table__unit,
  .m-subsidy-table--tax-return .m-subsidy-table__tail {
    white-space: nowrap;
  }

  .m-tax-return-price__group-title {
    font-size: calc(17 * 1rem / var(--font-size));
  }

  /* FLOW 注意書き */
  .m-tax-return-flow__note {
    padding-block-start: calc(24 * 1rem / var(--font-size));
  }

  .m-tax-return-flow__note-title {
    font-size: calc(14 * 1rem / var(--font-size));
  }

  .m-tax-return-flow__note-text {
    font-size: calc(12 * 1rem / var(--font-size));
  }

  /* COMPANY */
  .m-tax-return-access {
    padding-block: calc(40 * 1rem / var(--font-size)) 0;
  }
}
