/* ==========================================================================
   corporate-plan.css — 法人向けプランページ
   ==========================================================================
   責務:
   - guide/price/corporate/index.html のレイアウト
   - Figma デザイン準拠（PC/キャッチコピー 28px, H2 44px, H3 32px, H4 24px）
   - data-viewport で tablet / desktop の上書きを追加
   ========================================================================== */

/* --------------------------------------------------------------------------
   Block: corporate-plan-catch-copy（キャッチコピー）
   Figma: PC/キャッチコピー 28px Bold, line-height 42px, letter-spacing 2px, #003153
   -------------------------------------------------------------------------- */
.corporate-plan-catch-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: var(--content-max-width);
  margin-inline: auto;
  margin-block-start: 40px;
}

.corporate-plan-catch-copy__main {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 22px;
  font-weight: 700;
  line-height: 33px;
  letter-spacing: 0.44px;
  color: var(--color-main);
  text-align: center;
}

html[data-viewport="tablet"] .corporate-plan-catch-copy__main,
html[data-viewport="desktop"] .corporate-plan-catch-copy__main {
  font-size: 28px;
  line-height: 42px;
  letter-spacing: 0.56px;
}

/* --------------------------------------------------------------------------
   Block: corporate-plan-section（セクション共通）
   Figma: H2_中見出し 44px Bold, line-height 76px, #003153, 下線 4px
          H3 32px Bold, #003153, 左に青バー 8px
   -------------------------------------------------------------------------- */
.corporate-plan-section {
  margin-block-start: 80px;
}

.corporate-plan-section:first-of-type {
  margin-block-start: 60px;
}

html[data-viewport="desktop"] .corporate-plan-section {
  margin-block-start: 100px;
}

html[data-viewport="desktop"] .corporate-plan-section:first-of-type {
  margin-block-start: 80px;
}

.corporate-plan-section h2+* {
  margin-block-start: 24px;
}

/* --------------------------------------------------------------------------
   Block: corporate-plan-section--no-initial-cost
   サブ見出し・POINTバッジ・本文ブロック
   -------------------------------------------------------------------------- */
.corporate-plan-section {
  .wys-images {
    margin-block-start: 10px;
  }

  .corporate-plan-section__kicker {
    margin: 0;
    margin-block-start: 16px;
    font-family: var(--font-sans);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.04em;
    color: var(--color-main);
    text-align: center;
  }

  html[data-viewport="tablet"] .corporate-plan-section__kicker,
  html[data-viewport="desktop"] .corporate-plan-section__kicker {
    margin-block-start: 24px;
    font-size: 1.125rem;
  }
}


/* POINT バッジ（緑丸・中央揃え） */
.corporate-plan-points {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-block-start: 32px;
}

html[data-viewport="tablet"] .corporate-plan-points,
html[data-viewport="desktop"] .corporate-plan-points {
  gap: 24px;
  margin-block-start: 40px;
}

.corporate-plan-point {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 140px;
  height: 140px;
  padding: 16px;
  background-color: var(--color-accent-green);
  border-radius: 50%;
  color: var(--color-white);
  font-family: var(--font-sans);
  text-align: center;
}

html[data-viewport="tablet"] .corporate-plan-point,
html[data-viewport="desktop"] .corporate-plan-point {
  width: 160px;
  height: 160px;
}

.corporate-plan-point__label {
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
}

.corporate-plan-point__term {
  margin-block-start: 4px;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
}

.corporate-plan-point__value {
  margin-block-start: 4px;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1;
}

html[data-viewport="tablet"] .corporate-plan-point__value,
html[data-viewport="desktop"] .corporate-plan-point__value {
  font-size: 2.25rem;
}

.corporate-plan-section__body {
  margin-top: 10px;
  text-align: left;
}

.corporate-plan-section__body .corporate-plan-section__subtitle:first-child {
  margin-block-start: 0;
}

.corporate-plan-section__subtitle {
  margin: 0;
  margin-block-start: 32px;
  font-family: var(--font-sans);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: var(--color-main);
}

.corporate-plan-section__subtitle:first-child {
  margin-block-start: 24px;
}

html[data-viewport="tablet"] .corporate-plan-section__subtitle,
html[data-viewport="desktop"] .corporate-plan-section__subtitle {
  font-size: 1.5rem;
  line-height: 1.5;
}

.corporate-plan-section__subtitle+p {
  margin-block-start: 12px;
}

/* --------------------------------------------------------------------------
   Block: corporate-plan-card-list（link-card-list + card のオーバーライド）
   Figma: 2列グリッド, gap 30px 24px, カードタイトル 24px Bold #003153
   -------------------------------------------------------------------------- */
.corporate-plan-card-list {
  margin-block-start: 24px;
}

.corporate-plan-card-list .card__title {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: var(--color-main);
}

.corporate-plan-card-list .card__description {
  font-size: 1rem;
  line-height: 1.75;
  letter-spacing: 0.32px;
}

html[data-viewport="tablet"] .corporate-plan-card-list .card__title,
html[data-viewport="desktop"] .corporate-plan-card-list .card__title {
  font-size: 1.5rem;
  line-height: 1.5;
  letter-spacing: 0.48px;
}

/* --------------------------------------------------------------------------
   Block: corporate-plan-price-notes（料金表注釈 ＊1 ＊2 形式）
   デザイン準拠: 全角アスタリスク ＊ を使用
   -------------------------------------------------------------------------- */
.corporate-plan-price-notes[data-marker="asterisk"][data-numbered="true"] li::before {
  content: "＊" counter(wys-list-asterisk) "：";
}

/* --------------------------------------------------------------------------
   Block: corporate-plan-table-wrapper（料金表ラッパー）
   -------------------------------------------------------------------------- */
.corporate-plan-table-wrapper {
  margin-block-start: 24px;
  overflow-x: auto;
}

.corporate-plan-table-wrapper img {
  display: block;
  width: 100%;
  height: auto;
}

/* --------------------------------------------------------------------------
   Block: corporate-plan-image-box（画像ボックス #ebf3f8 背景）
   Figma: 背景 #ebf3f8, padding 30px
   -------------------------------------------------------------------------- */
.corporate-plan-image-box {
  margin-block-start: 24px;
  padding: 24px;
  background-color: var(--color-main-light);
}

.corporate-plan-image-box img {
  display: block;
  width: 100%;
  height: auto;
}

.corporate-plan-image-box--narrow {
  padding: 40px 60px;
}

html[data-viewport="tablet"] .corporate-plan-image-box,
html[data-viewport="desktop"] .corporate-plan-image-box {
  padding: 30px;
}

html[data-viewport="tablet"] .corporate-plan-image-box--narrow,
html[data-viewport="desktop"] .corporate-plan-image-box--narrow {
  padding: 60px 80px;
}