@charset "UTF-8";

@media screen and (max-width: 768px) {

/* ============================================================
   セクション6: PRICING（SP版）
   ============================================================
   Figmaの背景高（1337px）を元にコンテナを設定。
   ============================================================ */

.sec-6 {
  position: relative;
  width: 100%;
  max-width: 375px;
  height: 1320px; /* Web画像タブ: CTA(1210+74) + 余白36px */
  margin: 0 auto;
  background: #E9F7F6;
  overflow: hidden;
  z-index: 2;
}
.sec-6.is-sec6-lp {
  height: 1400px; /* LPタブ: CTA(1290+74) + 余白36px */
}

/* PC版の .sec-6__inner を完全にリセット */
.sec-6 .sec-6__inner {
  position: relative;
  width: 375px; /* 常に375pxのキャンバスを中央配置 */
  height: 100%;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
}

/* --- タイトル画像 --- */
.sec-6__title {
  position: absolute;
  width: 292px; /* 265pxから1.1倍に微調整 */
  height: 58px;
  left: calc(50% - 292px/2 + 0.5px);
  top: 40px;
  background: url("../images/sp/sec6/title.png") center / contain no-repeat;
  z-index: 3;
}

/* --- タブ切り替え --- */
/* 背景 (Rectangle 2) */
.sec-6 .sec-6__tab-bg {
  position: absolute;
  width: 335px;
  height: 30px;
  left: 20px;
  top: 133px; /* Figma: 5804 - 5671 */
  background: #D9D9D9;
  border-radius: 100px;
  z-index: 2;
}

/* アクティブインジケーター (Rectangle 78) */
.sec-6 .sec-6__tab-active {
  position: absolute;
  width: 168px;
  height: 30px;
  left: 20px;
  top: 133px; /* Figma: 5804 - 5671 */
  background: #1E333B;
  border-radius: 100px;
  z-index: 3;
  transition: transform 0.3s ease; /* JSでの切り替え用 */
}

/* インジケーターの移動（SP版） */
.sec-6 .sec-6__tab-active.is-right {
  transform: translateX(167px); /* 335px(全体) - 168px(インジケーター) = 167px */
}

/* 左側テキスト (Web画像) */
.sec-6 .sec-6__tab-text-left {
  position: absolute;
  width: 168px;
  height: 30px;
  left: 20px;
  top: 133px;
  font-family: var(--font-primary);
  font-style: normal;
  font-weight: 700;
  font-size: 14px;
  line-height: 30px;
  text-align: center;
  z-index: 4;
}

/* 右側テキスト (ランディングページ) */
.sec-6 .sec-6__tab-text-right {
  position: absolute;
  width: 167px;
  height: 30px;
  left: 188px;
  top: 133px;
  font-family: var(--font-primary);
  font-style: normal;
  font-weight: 700;
  font-size: 14px;
  line-height: 30px;
  text-align: center;
  z-index: 4;
}

/* タブ文字色の切り替え */
.sec-6 .is-active-tab-2 {
  color: #FFFFFF;
}
.sec-6 .is-inactive-tab-2 {
  color: #6A7A80;
}

/* プランバッジ (Web画像) */
.sec-6 .sec-6__web-badge {
  position: absolute;
  width: 92px;
  height: 20px;
  left: calc(50% - 92px / 2 + 0.5px);
  top: 203px; /* Figma: 5874 - 5671 */
  background: url("../images/sp/sec6/897896 1.png") center / contain no-repeat;
  z-index: 2;
}

/* プランバッジ (LP) */
.sec-6 .sec-6__lp-badge {
  position: absolute;
  width: 170.48px;
  height: 20.17px;
  left: calc(50% - 170.48px/2 - 0.26px);
  top: 203px; /* Figma: 5765 - 5562 */
  background: url("../images/sec6/ランディングページ 1.png") center / contain no-repeat;
  z-index: 2;
}

/* SP版ではPC用改行を非表示 */
.sec-6 .sec-6__web-br,
.sec-6 .sec-6__lp-br {
  display: none;
}

/* Web画像タブの説明文 */
.sec-6 .sec-6__web-text {
  position: absolute;
  width: 303px;
  height: auto;
  left: calc(50% - 303px / 2);
  top: 238px;
  font-family: var(--font-primary);
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 175%;
  text-align: center;
  color: #1E333B;
  z-index: 2;
}

/* LPタブの説明文 */
.sec-6 .sec-6__lp-text {
  position: absolute;
  width: 305px;
  height: 78px;
  left: calc(50% - 305px/2);
  top: 238px; /* Figma: 5800 - 5562 */
  font-family: 'Noto Sans JP', sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
  line-height: 175%;
  text-align: center;
  color: #1E333B;
  z-index: 2;
}

/* 全体注釈テキスト（最下部） */
.sec-6 .sec-6__bottom-note {
  position: absolute;
  width: 335px;
  height: auto;
  left: calc(50% - 335px / 2);
  top: 748px;
  font-family: var(--font-primary);
  font-style: normal;
  font-weight: 400;
  font-size: 10px;
  line-height: 175%;
  text-align: center;
  color: #1E333B;
  z-index: 2;
}

/* --- 基本料金 テーブル (Web画像用) --- */
/* セル共通スタイル */
.sec-6 .sec-6__base-cell-left {
  position: absolute;
  width: 80px;
  height: 35px;
  background: #E2F0D2;
  z-index: 2;
}
.sec-6 .sec-6__base-cell-right {
  position: absolute;
  width: 250px;
  height: 35px;
  background: #FFFFFF;
  z-index: 2;
}
.sec-6 .sec-6__base-text-left {
  position: absolute;
  font-family: var(--font-primary);
  font-weight: 400;
  font-size: 12px;
  line-height: 175%;
  text-align: center;
  color: #1E333B;
  z-index: 3;
}
.sec-6 .sec-6__base-text-right {
  position: absolute;
  font-family: var(--font-primary);
  font-weight: 700;
  font-size: 12px;
  line-height: 175%;
  color: #1E333B;
  z-index: 3;
}

/* 行1: 情報量 */
.sec-6 .opt-row-1.sec-6__base-cell-left { left: 20px; top: 493px; }
.sec-6 .opt-row-1.sec-6__base-cell-right { left: 105px; top: 493px; }
.sec-6 .opt-row-1.sec-6__base-text-left { width: 36px; left: 42px; top: 500px; }
.sec-6 .opt-row-1.sec-6__base-text-right { width: 156px; left: 115px; top: 500px; }

/* 行2: 修正回数 */
.sec-6 .opt-row-2.sec-6__base-cell-left { left: 20px; top: 533px; }
.sec-6 .opt-row-2.sec-6__base-cell-right { left: 105px; top: 533px; }
.sec-6 .opt-row-2.sec-6__base-text-left { width: 48px; left: 36px; top: 540px; }
.sec-6 .opt-row-2.sec-6__base-text-right {
  width: auto;
  white-space: nowrap;
  left: 115px;
  top: 540px;
}

/* 行3: ラフ提案数 */
.sec-6 .opt-row-3.sec-6__base-cell-left { left: 20px; top: 573px; }
.sec-6 .opt-row-3.sec-6__base-cell-right { left: 105px; top: 573px; }
.sec-6 .opt-row-3.sec-6__base-text-left { width: 60px; left: 30px; top: 580px; }
.sec-6 .opt-row-3.sec-6__base-text-right { width: 40px; left: 115px; top: 580px; }

/* --- 基本料金ヘッダー (Rectangle 36) --- */
.sec-6 .sec-6__base-header-bg {
  position: absolute;
  width: 335px;
  height: 120px;
  left: calc(50% - 335px / 2);
  top: 353px;
  background: #86C243;
  border-radius: 20px 20px 0px 0px;
  z-index: 2;
}

/* 基本料金 テキスト */
.sec-6 .sec-6__base-title {
  position: absolute;
  width: 96px;
  height: 28px;
  left: calc(50% - 96px / 2 + 0.5px);
  top: 368px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 175%;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

/* 6,000円 価格 */
.sec-6 .sec-6__base-price {
  position: absolute;
  width: 335px;
  height: 52px;
  left: calc(50% - 335px / 2);
  top: 400px;
  font-family: 'DIN 2014', 'Oswald', 'Inter', 'Noto Sans JP', sans-serif;
  font-weight: 600;
  font-size: 38px;
  display: flex;
  justify-content: center;
  align-items: baseline;
  line-height: 1;
  color: #FFFFFF;
  z-index: 3;
  white-space: nowrap;
}

/* 円 記号（SP版） */
.sec-6 .sec-6__base-yen {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 18px;
  margin-left: 2px;
}

/* ※料金は税込です。 */
.sec-6 .sec-6__base-tax-note {
  position: absolute;
  width: 90px;
  height: 18px;
  left: 251px;
  top: 450px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 175%;
  color: #FFFFFF;
  z-index: 3;
}

/* 行4: 素材 */
.sec-6 .opt-row-4.sec-6__base-cell-left { left: 20px; top: 613px; }
.sec-6 .opt-row-4.sec-6__base-cell-right { left: 105px; top: 613px; }
.sec-6 .opt-row-4.sec-6__base-text-left { width: 24px; left: 48px; top: 620px; }
.sec-6 .opt-row-4.sec-6__base-text-right { width: 132px; left: 115px; top: 620px; }

/* 行5: 納品目安 */
.sec-6 .opt-row-5.sec-6__base-cell-left { left: 20px; top: 653px; }
.sec-6 .opt-row-5.sec-6__base-cell-right { left: 105px; top: 653px; }
.sec-6 .opt-row-5.sec-6__base-text-left { width: 48px; left: 36px; top: 660px; }
.sec-6 .opt-row-5.sec-6__base-text-right { width: auto; white-space: nowrap; left: 115px; top: 660px; }

/* 行6: 納品形式 */
.sec-6 .opt-row-6.sec-6__base-cell-left { left: 20px; top: 693px; }
.sec-6 .opt-row-6.sec-6__base-cell-right { left: 105px; top: 693px; }
.sec-6 .opt-row-6.sec-6__base-text-left { width: 48px; left: 36px; top: 700px; }
.sec-6 .opt-row-6.sec-6__base-text-right { width: auto; white-space: nowrap; left: 115px; top: 700px; }


/* ============================================================
   オプション料金テーブル（Web画像用・SP版）
   ============================================================ */

/* Web画像 ＋アイコン 背景丸 */
.sec-6 .sec-6__plus-circle {
  position: absolute;
  width: 35px;
  height: 35px;
  left: calc(50% - 35px/2);
  top: 815px;
  background: #1E333B;
  border-radius: 50%;
  z-index: 2;
}

/* Web画像 ＋アイコン テキスト */
.sec-6 .sec-6__plus-text {
  position: absolute;
  width: 20px;
  height: 35px;
  left: calc(50% - 20px/2 - 0.5px);
  top: 814px;
  font-family: 'Noto Sans JP', sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 20px;
  line-height: 175%;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

/* --- オプション料金ボタン（枠線） --- */
.sec-6 .sec-6__option-border {
  box-sizing: border-box;
  position: absolute;
  width: 335px;
  height: 38px;
  left: calc(50% - 335px/2);
  top: 867px;
  background: #FFFFFF;
  border: 2px solid #86C243;
  border-radius: 100px;
  z-index: 2;
}
.sec-6 .sec-6__option-title {
  position: absolute;
  width: 112px;
  height: 28px;
  left: calc(50% - 112px/2 + 0.5px);
  top: 872px;
  font-family: 'Noto Sans JP', sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 175%;
  text-align: center;
  color: #86C243;
  z-index: 3;
}

/* --- 共通スタイル --- */
.sec-6 .sec-6__opt-bg {
  position: absolute;
  width: 252px;
  height: 35px;
  left: 20px;
  background: #FFFFFF;
  z-index: 2;
}
.sec-6 .sec-6__opt-price-bg {
  position: absolute;
  width: 83px;
  height: 35px;
  left: 272px;
  background: #86C243;
  z-index: 2;
}
.sec-6 .sec-6__opt-text {
  position: absolute;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 175%;
  text-align: center;
  color: #1E333B;
  z-index: 3;
}
.sec-6 .sec-6__opt-price {
  position: absolute;
  font-family: 'DIN 2014', 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 19px;
  line-height: 35px;
  height: 35px;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

.sec-6 .sec-6__yen {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 12px;
  margin-left: 2px;
}

/* 行1: 制作データのお渡し(PSD／AIデータ) - 2,500円 */
.sec-6 .opt-row-1.sec-6__opt-bg { top: 920px; }
.sec-6 .opt-row-1.sec-6__opt-price-bg { top: 920px; }
.sec-6 .text-pos-1.sec-6__opt-text { width: 198px; left: 47px; top: 927px; }
.sec-6 .price-pos-1.sec-6__opt-price { width: 83px; left: 272px; top: 920px; }

/* 行2: 同じデザインで別サイズへのリサイズ - 2,500円 */
.sec-6 .opt-row-2.sec-6__opt-bg { top: 960px; }
.sec-6 .opt-row-2.sec-6__opt-price-bg { top: 960px; }
.sec-6 .text-pos-2.sec-6__opt-text { width: 204px; left: 44px; top: 967px; }
.sec-6 .price-pos-2.sec-6__opt-price { width: 83px; left: 272px; top: 960px; }

/* 行3: 軽微な変更のABテスト版制作 - 3,000円 */
.sec-6 .opt-row-3.sec-6__opt-bg { top: 1000px; }
.sec-6 .opt-row-3.sec-6__opt-price-bg { top: 1000px; }
.sec-6 .text-pos-3.sec-6__opt-text { width: 160px; left: 66px; top: 1007px; }
.sec-6 .price-pos-3.sec-6__opt-price { width: 83px; left: 272px; top: 1000px; }

/* 行4: 納期指定のスピード制作プラン - 2,500円 */
.sec-6 .opt-row-4.sec-6__opt-bg { top: 1040px; }
.sec-6 .opt-row-4.sec-6__opt-price-bg { top: 1040px; }
.sec-6 .text-pos-4.sec-6__opt-text { width: 168px; left: 62px; top: 1047px; }
.sec-6 .price-pos-4.sec-6__opt-price { width: 83px; left: 272px; top: 1040px; }

/* 行5: 原稿作成付きまるっとお任せ制作プラン - 4,500円 */
.sec-6 .opt-row-5.sec-6__opt-bg { top: 1080px; }
.sec-6 .opt-row-5.sec-6__opt-price-bg { top: 1080px; }
.sec-6 .text-pos-5.sec-6__opt-text { width: 216px; left: 38px; top: 1087px; }
.sec-6 .price-pos-5.sec-6__opt-price { width: 83px; left: 272px; top: 1080px; }

/* 行6: 有料素材使用/ 枚 - 2,000円 */
.sec-6 .opt-row-6.sec-6__opt-bg { top: 1120px; }
.sec-6 .opt-row-6.sec-6__opt-price-bg { top: 1120px; }
.sec-6 .text-pos-6.sec-6__opt-text { width: 120px; left: 86px; top: 1127px; white-space: nowrap; }
.sec-6 .price-pos-6.sec-6__opt-price { width: 83px; left: 272px; top: 1120px; }

/* LP用 オプション料金テーブル — SP版は作り直し予定 */

/* --- SP版 CTAボタン --- */
.sec-6 .sec-6__cta {
  position: absolute;
  width: 335px;
  height: 74px;
  left: 50%;
  transform: translateX(-50%);
  top: 1210px;
  background-image: url("../images/sp/sec6/CTA@2x 1.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 10;
  border-radius: 0;
  box-shadow: none;
  overflow: hidden;
}

.sec-6 .sec-6__cta:hover {
  transform: translateX(-50%) scale(1.02);
}

/* SP版でも光るエフェクトを復旧 */
.sec-6 .sec-6__cta::after {
  content: "";
  position: absolute;
  width: 40%;
  height: 100%;
  top: 0;
  left: -40%;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.15) 30%, rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0.15) 70%, transparent 100%);
  z-index: 3;
  pointer-events: none;
  animation: sweepLight 3s ease-in-out infinite;
}

/* オプション税込注記 */
.sec-6 .sec-6__opt-note {
  position: absolute;
  width: 90px;
  height: 18px;
  left: 265px;
  top: 1165px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 175%;
  color: #1E333B;
  z-index: 2;
}

/* 全体注釈テキスト（最下部） */
.sec-6 .sec-6__bottom-note {
  position: absolute;
  width: 335px;
  height: auto;
  left: calc(50% - 335px / 2);
  top: 752px; /* 少し下に移動 */
  font-family: var(--font-primary);
  font-style: normal;
  font-weight: 400;
  font-size: 10px;
  line-height: 175%;
  text-align: center;
  color: #1E333B;
  z-index: 2;
}

/* ============================================================
   LP用 プランカード（SP版） — 横スクロール対応
   ============================================================ */

/* --- PC版のコンプリートプランはスライド内で表示するため非表示解除済み --- */

/* --- LP CTAバナー（SP版） --- */
.sec-6 .sec-6__lp-cta {
  display: block;
  position: absolute;
  width: 335px;
  height: 74px;
  left: calc(50% - 335px/2);
  top: 1290px;
  background: url('../images/sec6/CTA(B) 2.png') no-repeat center center / contain;
  z-index: 5;
  cursor: pointer;
  overflow: hidden;
  border-radius: 40px;
}

/* LP用CTAボタンにも光が走るアニメーションを全復旧 */
.sec-6 .sec-6__lp-cta::after {
  content: "";
  position: absolute;
  width: 40%;
  height: 200%;
  top: -50%;
  left: -40%;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.15) 30%, rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0.15) 70%, transparent 100%);
  z-index: 3;
  pointer-events: none;
  animation: sweepLight 3s ease-in-out infinite;
}

/* ============================================================
   横スクロールコンテナ
   ============================================================ */
.sec-6 .sec-6__lp-scroll {
  position: absolute;
  top: 330px;
  left: 0;
  width: 100%;
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.sec-6 .sec-6__lp-scroll::-webkit-scrollbar {
  display: none;
}

/* 各スライド */
.sec-6 .sec-6__lp-slide {
  min-width: 375px;
  width: 375px;
  height: 550px;
  position: relative;
  scroll-snap-align: start;
  flex-shrink: 0;
}

/* スライド内の要素は visibility で制御（スクロールコンテナ内なので is-lp-hidden は親で効く） */

/* ============================================================
   円記号（共通）
   ============================================================ */
.sec-6 .sec-6__lp-yen {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 18px;
  margin-left: 2px;
}

/* ============================================================
   テーブル共通ベース（ライトプラン 305px基準）
   ============================================================ */
.sec-6 .sec-6__lp-cell-left {
  position: absolute;
  width: 80px;
  height: 35px;
  left: calc(50% - 305px/2);
  background: #E2F0D2;
  z-index: 2;
}
.sec-6 .sec-6__lp-cell-right {
  position: absolute;
  width: 220px;
  height: 35px;
  left: calc(50% - 305px/2 + 85px);
  background: #FFFFFF;
  z-index: 2;
}
.sec-6 .sec-6__lp-label {
  position: absolute;
  width: 48px;
  height: 21px;
  left: calc(50% - 305px/2 + 16px);
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 175%;
  text-align: center;
  color: #1E333B;
  z-index: 3;
}
.sec-6 .sec-6__lp-value {
  position: absolute;
  height: 21px;
  left: calc(50% - 305px/2 + 95px);
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 175%;
  color: #1E333B;
  z-index: 3;
}

/* ============================================================
   LP ライトプラン カード（スライド内相対座標）
   元の section-absolute top から 330px を引いた値
   ============================================================ */

/* --- ヘッダー背景 --- */
.sec-6 .sec-6__lp-card-header--light {
  position: absolute;
  width: 305px;
  height: 192px;
  left: calc(50% - 305px/2);
  top: 23px;
  background: #86C243;
  border-radius: 20px 20px 0px 0px;
  z-index: 2;
}

/* プラン名 */
.sec-6 .sec-6__lp-plan-name--light {
  position: absolute;
  width: 108px;
  height: 32px;
  left: calc(50% - 108px/2);
  top: 38px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 175%;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

/* 価格 */
.sec-6 .sec-6__lp-price--light {
  position: absolute;
  width: 133px;
  height: 67px;
  left: calc(50% - 133px/2);
  top: 53px;
  font-family: 'DIN 2014', 'Oswald', 'Inter', 'Noto Sans JP', sans-serif;
  font-weight: 600;
  font-size: 38px;
  line-height: 175%;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

/* 税込注記 */
.sec-6 .sec-6__lp-tax--light {
  position: absolute;
  width: 90px;
  height: 18px;
  left: calc(50% - 90px/2);
  top: 113px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 175%;
  color: #FFFFFF;
  z-index: 3;
}

/* 説明文背景 */
.sec-6 .sec-6__lp-desc-bg--light {
  position: absolute;
  width: 275px;
  height: 60px;
  left: calc(50% - 275px/2);
  top: 143px;
  background: #FFFFFF;
  border-radius: 4.69px;
  z-index: 3;
}

/* 説明文テキスト */
.sec-6 .sec-6__lp-desc--light {
  position: absolute;
  width: 255px;
  height: 50px;
  left: calc(50% - 255px/2);
  top: 151px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 12px;  /* 12pxに確定 */
  line-height: 175%;
  text-align: center;
  color: #86C243;
  z-index: 4;
}

/* 行1: 内容例 */
.sec-6 .sec-6__lp-row--light-1.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--light-1.sec-6__lp-cell-right { top: 235px; }
.sec-6 .sec-6__lp-label--light-1 { top: 242px; width: 36px; left: calc(50% - 305px/2 + 22px); }
.sec-6 .sec-6__lp-value--light-1 { top: 242px; width: 190px; }

/* 行2: 修正回数 */
.sec-6 .sec-6__lp-row--light-2.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--light-2.sec-6__lp-cell-right { top: 275px; }
.sec-6 .sec-6__lp-label--light-2 { top: 282px; }
.sec-6 .sec-6__lp-value--light-2 { top: 282px; width: 151px; }

/* 行3: ラフ提案数 */
.sec-6 .sec-6__lp-row--light-3.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--light-3.sec-6__lp-cell-right { top: 315px; }
.sec-6 .sec-6__lp-label--light-3 { top: 322px; width: 60px; left: calc(50% - 305px/2 + 10px); white-space: nowrap; }
.sec-6 .sec-6__lp-value--light-3 { top: 322px; width: 20px; }

/* 行4: 納品形式 */
.sec-6 .sec-6__lp-row--light-4.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--light-4.sec-6__lp-cell-right { top: 355px; }
.sec-6 .sec-6__lp-label--light-4 { top: 362px; }
.sec-6 .sec-6__lp-value--light-4 { top: 362px; width: 200px; }

/* 行5: 対応範囲 */
.sec-6 .sec-6__lp-row--light-5.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--light-5.sec-6__lp-cell-right { top: 395px; height: 100px; }
.sec-6 .sec-6__lp-label--light-5 { top: 435px; }
.sec-6 .sec-6__lp-value--light-5 {
  top: 407px;
  width: 200px;
  height: 76px;
  display: flex;
  align-items: center;
}

/* 行6: レスポンシブ */
.sec-6 .sec-6__lp-row--light-6.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--light-6.sec-6__lp-cell-right { top: 500px; }
.sec-6 .sec-6__lp-label--light-6 { top: 507px; width: 72px; left: calc(50% - 305px/2 + 4px); white-space: nowrap; }
.sec-6 .sec-6__lp-value--light-6 { top: 507px; width: 48px; }

/* 王冠アイコン（ライト） */
.sec-6 .sec-6__lp-crown--light {
  position: absolute;
  width: 15px;
  height: 15px;
  left: calc(50% - 305px/2 + 146px);
  top: 510px;
  background: url("../images/sec6/フリーの王冠アイコン (1) 1.png") center / contain no-repeat;
  z-index: 4;
}

/* ============================================================
   LP スタンダードプラン カード（スライド内相対座標）
   同じ相対座標を使用（ヘッダーtop: 23px 〜）
   ============================================================ */

/* --- おすすめバッジ --- */
.sec-6 .sec-6__lp-recommend-circle {
  display: block !important;
  position: absolute;
  box-sizing: border-box;
  width: 70px;
  height: 70px;
  left: calc(50% + 333px/2 - 50px);
  top: 0;
  background: #FFFFE7;
  border: 3px solid #3269BC;
  border-radius: 50%;
  z-index: 5;
}
.sec-6 .sec-6__lp-recommend-crown {
  display: block !important;
  position: absolute;
  width: 35px;
  height: 35px;
  left: calc(50% + 333px/2 - 32px);
  top: 8px;
  background: url("../images/sec6/ゴージャスな王冠の無料アイコン 1.png") center / contain no-repeat;
  z-index: 6;
}
.sec-6 .sec-6__lp-recommend-text {
  display: block !important;
  position: absolute;
  left: calc(50% + 333px/2 - 50px);
  top: 43px;
  width: 70px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 900;
  font-size: 11px;
  line-height: 175%;
  text-align: center;
  letter-spacing: -0.13em;
  color: #3269BC;
  z-index: 6;
}

/* --- ヘッダー背景 --- */
.sec-6 .sec-6__lp-card-header--std {
  position: absolute;
  width: 333px;
  height: 192px;
  left: calc(50% - 333px/2);
  top: 23px;
  background: #3269BC;
  border-radius: 20px 20px 0px 0px;
  z-index: 2;
}

/* プラン名 */
.sec-6 .sec-6__lp-plan-name--std {
  position: absolute;
  width: 162px;
  height: 32px;
  left: calc(50% - 162px/2);
  top: 38px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 175%;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

/* 価格 */
.sec-6 .sec-6__lp-price--std {
  position: absolute;
  width: 153px;
  height: 67px;
  left: calc(50% - 153px/2);
  top: 53px;
  font-family: 'DIN 2014', 'Oswald', 'Inter', 'Noto Sans JP', sans-serif;
  font-weight: 600;
  font-size: 38px;
  line-height: 175%;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

/* 税込注記 */
.sec-6 .sec-6__lp-tax--std {
  position: absolute;
  width: 90px;
  height: 18px;
  left: calc(50% - 90px/2);
  top: 113px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 175%;
  color: #FFFFFF;
  z-index: 3;
}

/* 説明文背景 */
.sec-6 .sec-6__lp-desc-bg--std {
  position: absolute;
  width: 303px;
  height: 60px;
  left: calc(50% - 303px/2);
  top: 143px;
  background: #FFFFFF;
  border-radius: 4.69px;
  z-index: 3;
}

/* 説明文テキスト */
.sec-6 .sec-6__lp-desc--std {
  position: absolute;
  width: 186px;
  height: 50px;
  left: calc(50% - 186px/2);
  top: 148px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 175%;
  text-align: center;
  color: #3269BC;
  z-index: 4;
}

/* --- テーブルセル（青・333px基準）上書き --- */
.sec-6 .sec-6__lp-cell-left--std {
  width: 80px;
  left: calc(50% - 333px/2);
  background: #DDE6F3;
}
.sec-6 .sec-6__lp-cell-right--std {
  width: 248px;
  left: calc(50% - 333px/2 + 85px);
}

/* 行1: 内容例 */
.sec-6 .sec-6__lp-row--std-1.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--std-1.sec-6__lp-cell-right { top: 235px; }
.sec-6 .sec-6__lp-label--std-1 { top: 242px; width: 36px; left: calc(50% - 333px/2 + 22px); white-space: nowrap; }
.sec-6 .sec-6__lp-value--std-1 { top: 242px; width: 218px; left: calc(50% - 333px/2 + 95px); white-space: nowrap; }

/* 行2: 修正回数 */
.sec-6 .sec-6__lp-row--std-2.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--std-2.sec-6__lp-cell-right { top: 275px; }
.sec-6 .sec-6__lp-label--std-2 { top: 282px; left: calc(50% - 333px/2 + 16px); }
.sec-6 .sec-6__lp-value--std-2 { top: 282px; width: 151px; left: calc(50% - 333px/2 + 95px); }

/* 行3: ラフ提案数 */
.sec-6 .sec-6__lp-row--std-3.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--std-3.sec-6__lp-cell-right { top: 315px; }
.sec-6 .sec-6__lp-label--std-3 { top: 322px; width: 60px; left: calc(50% - 333px/2 + 10px); white-space: nowrap; }
.sec-6 .sec-6__lp-value--std-3 { top: 322px; width: 20px; left: calc(50% - 333px/2 + 95px); }

/* 行4: 納品形式 */
.sec-6 .sec-6__lp-row--std-4.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--std-4.sec-6__lp-cell-right { top: 355px; }
.sec-6 .sec-6__lp-label--std-4 { top: 362px; left: calc(50% - 333px/2 + 16px); }
.sec-6 .sec-6__lp-value--std-4 { top: 362px; width: 200px; left: calc(50% - 333px/2 + 95px); }

/* 行5: 対応範囲（高さ拡張: 4行分 90px） */
.sec-6 .sec-6__lp-row--std-5.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--std-5.sec-6__lp-cell-right { top: 395px; height: 100px; }
.sec-6 .sec-6__lp-label--std-5 { top: 435px; left: calc(50% - 333px/2 + 16px); }
.sec-6 .sec-6__lp-value--std-5 {
  top: 400px;
  width: 230px;
  height: 90px;
  left: calc(50% - 333px/2 + 95px);
  display: flex;
  align-items: center;
}

/* 行6: レスポンシブ */
.sec-6 .sec-6__lp-row--std-6.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--std-6.sec-6__lp-cell-right { top: 500px; }
.sec-6 .sec-6__lp-label--std-6 { top: 507px; width: 72px; left: calc(50% - 333px/2 + 4px); white-space: nowrap; }
.sec-6 .sec-6__lp-value--std-6 { top: 507px; width: 48px; left: calc(50% - 333px/2 + 95px); }

/* 王冠アイコン（スタンダード） */
.sec-6 .sec-6__lp-crown--std {
  position: absolute;
  width: 15px;
  height: 15px;
  left: calc(50% - 333px/2 + 146px);
  top: 510px;
  background: url("../images/sec6/フリーの王冠アイコン (1) 1.png") center / contain no-repeat;
  z-index: 4;
}

/* ============================================================
   LP コンプリートプラン カード（スライド内相対座標）
   ゴールドテーマ #CC9D33 / 305px幅
   ============================================================ */

/* --- ヘッダー背景 --- */
.sec-6 .sec-6__lp-card-header--comp {
  display: block !important;
  position: absolute;
  width: 305px;
  height: 192px;
  left: calc(50% - 305px/2);
  top: 23px;
  background: #CC9D33;
  border-radius: 20px 20px 0px 0px;
  z-index: 2;
}

/* プラン名 */
.sec-6 .sec-6__lp-plan-name--comp {
  display: block !important;
  position: absolute;
  width: 162px;
  height: 32px;
  left: calc(50% - 162px/2);
  top: 38px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 175%;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

/* 価格 */
.sec-6 .sec-6__lp-price--comp {
  display: block !important;
  position: absolute;
  width: 183px;
  height: 67px;
  left: calc(50% - 183px/2);
  top: 53px;
  font-family: 'DIN 2014', 'Oswald', 'Inter', 'Noto Sans JP', sans-serif;
  font-weight: 600;
  font-size: 38px;
  line-height: 175%;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

/* 税込注記 */
.sec-6 .sec-6__lp-tax--comp {
  display: block !important;
  position: absolute;
  width: 90px;
  height: 18px;
  left: calc(50% - 90px/2);
  top: 113px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 175%;
  color: #FFFFFF;
  z-index: 3;
}

/* 説明文背景 */
.sec-6 .sec-6__lp-desc-bg--comp {
  display: block !important;
  position: absolute;
  width: 275px;
  height: 60px;
  left: calc(50% - 275px/2);
  top: 143px;
  background: #FFFFFF;
  border-radius: 4.69px;
  z-index: 3;
}

/* 説明文テキスト */
.sec-6 .sec-6__lp-desc--comp {
  display: block !important;
  position: absolute;
  width: 214px;
  height: 50px;
  left: calc(50% - 214px/2);
  top: 148px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 175%;
  text-align: center;
  color: #CC9D33;
  z-index: 4;
}

/* --- テーブルセル（ゴールド・305px基準） --- */
.sec-6 .sec-6__lp-cell-left--comp {
  display: block !important;
  width: 80px;
  left: calc(50% - 305px/2);
  background: #F1E7D0;
}
.sec-6 .sec-6__lp-cell-right--comp {
  display: block !important;
  width: 220px;
  left: calc(50% - 305px/2 + 85px);
}

/* 行1: 内容例 */
.sec-6 .sec-6__lp-row--comp-1.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--comp-1.sec-6__lp-cell-right { top: 235px; }
.sec-6 .sec-6__lp-label--comp-1 { display: block !important; top: 242px; width: 36px; left: calc(50% - 305px/2 + 22px); }
.sec-6 .sec-6__lp-value--comp-1 { display: block !important; top: 242px; width: 210px; white-space: nowrap; font-size: 11px; }

/* 行2: 修正回数 */
.sec-6 .sec-6__lp-row--comp-2.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--comp-2.sec-6__lp-cell-right { top: 275px; }
.sec-6 .sec-6__lp-label--comp-2 { display: block !important; top: 282px; }
.sec-6 .sec-6__lp-value--comp-2 { display: block !important; top: 282px; width: 151px; }

/* 行3: ラフ提案数 */
.sec-6 .sec-6__lp-row--comp-3.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--comp-3.sec-6__lp-cell-right { top: 315px; }
.sec-6 .sec-6__lp-label--comp-3 { display: block !important; top: 322px; width: 60px; left: calc(50% - 305px/2 + 10px); white-space: nowrap; }
.sec-6 .sec-6__lp-value--comp-3 { display: block !important; top: 322px; width: 20px; }

/* 行4: 納品形式 */
.sec-6 .sec-6__lp-row--comp-4.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--comp-4.sec-6__lp-cell-right { top: 355px; }
.sec-6 .sec-6__lp-label--comp-4 { display: block !important; top: 362px; }
.sec-6 .sec-6__lp-value--comp-4 { display: block !important; top: 362px; width: 200px; }

/* 行5: 対応範囲 */
.sec-6 .sec-6__lp-row--comp-5.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--comp-5.sec-6__lp-cell-right { top: 395px; height: 100px; }
.sec-6 .sec-6__lp-label--comp-5 { display: block !important; top: 435px; }
.sec-6 .sec-6__lp-value--comp-5 {
  display: flex !important;
  top: 400px;
  width: 230px;
  height: 90px;
  align-items: center;
}

/* 行6: レスポンシブ */
.sec-6 .sec-6__lp-row--comp-6.sec-6__lp-cell-left,
.sec-6 .sec-6__lp-row--comp-6.sec-6__lp-cell-right { top: 500px; }
.sec-6 .sec-6__lp-label--comp-6 { display: block !important; top: 507px; width: 72px; left: calc(50% - 305px/2 + 4px); white-space: nowrap; }
.sec-6 .sec-6__lp-value--comp-6 { display: block !important; top: 507px; width: 48px; }

/* 王冠アイコン（コンプリート） */
.sec-6 .sec-6__lp-crown--comp {
  display: block !important;
  position: absolute;
  width: 15px;
  height: 15px;
  left: calc(50% - 305px/2 + 146px);
  top: 510px;
  background: url("../images/sec6/フリーの王冠アイコン (1) 1.png") center / contain no-repeat;
  z-index: 4;
}

/* ============================================================
   LP スクロールインジケーター
   ============================================================ */
.sec-6 .sec-6__lp-scroll-indicator {
  position: absolute;
  width: 80px;
  height: 73px;
  left: 276px;
  top: 796px;
  background: url("../images/sp/sec6/scroll 1.png") center / contain no-repeat;
  z-index: 10;
  pointer-events: none;
  transform-origin: bottom center;
  animation: waveHand 1.5s ease-in-out infinite;
  transition: opacity 0.4s ease;
}

/* ============================================================
   LP 注釈テキスト（※1）
   ============================================================ */
.sec-6 .sec-6__lp-footnote {
  position: absolute;
  width: 299px;
  height: 54px;
  left: calc(50% - 299px/2);
  top: 885px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 175%;
  text-align: center;
  color: #1E333B;
  z-index: 2;
}

/* ============================================================
   LP プラスアイコン
   ============================================================ */
.sec-6 .sec-6__lp-plus-circle {
  position: absolute;
  width: 35px;
  height: 35px;
  left: calc(50% - 35px/2 + 2px);
  top: 950px;
  background: #1E333B;
  border-radius: 50%;
  z-index: 2;
}
.sec-6 .sec-6__lp-plus-text {
  position: absolute;
  width: 20px;
  height: 35px;
  left: calc(50% - 20px/2 + 1.5px);
  top: 949px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 175%;
  text-align: center;
  color: #FFFFFF;
  z-index: 3;
}

/* ============================================================
   LP オプション料金テーブル（SP版）
   スクロールコンテナ下に配置（base top: 1000px）
   ============================================================ */

/* --- オプション料金ボタン --- */
.sec-6 .sec-6__lp-option-btn-bg {
  position: absolute;
  box-sizing: border-box;
  width: 335px;
  height: 38px;
  left: calc(50% - 335px/2);
  top: 1000px;
  background: #FFFFFF;
  border: 2px solid #1E333B;
  border-radius: 100px;
  z-index: 2;
}
.sec-6 .sec-6__lp-option-btn-text {
  position: absolute;
  width: 112px;
  height: 28px;
  left: calc(50% - 112px/2);
  top: 1005px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 175%;
  text-align: center;
  color: #1E333B;
  z-index: 3;
}

/* --- オプション テーブル共通 --- */
.sec-6 .sec-6__lp-opt-left {
  position: absolute;
  width: 210px;
  height: 35px;
  left: calc(50% - 335px/2);
  background: #FFFFFF;
  z-index: 2;
}
.sec-6 .sec-6__lp-opt-right {
  position: absolute;
  width: 125px;
  height: 35px;
  left: calc(50% - 335px/2 + 210px);
  background: #1E333B;
  z-index: 2;
}
.sec-6 .sec-6__lp-opt-label {
  position: absolute;
  width: 210px;
  height: 21px;
  left: calc(50% - 335px/2);
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 175%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #1E333B;
  z-index: 3;
}
.sec-6 .sec-6__lp-opt-price {
  position: absolute;
  height: 33px;
  left: calc(50% - 335px/2 + 220px);
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 175%;
  display: flex;
  align-items: center;
  color: #FFFFFF;
  z-index: 3;
}

/* 行1: ドメイン / サーバー契約サポート — 無料対応 */
.sec-6 .sec-6__lp-opt-row--1.sec-6__lp-opt-left,
.sec-6 .sec-6__lp-opt-row--1.sec-6__lp-opt-right { top: 1053px; }
.sec-6 .sec-6__lp-opt-label--1 {
  top: 1060px;
}
.sec-6 .sec-6__lp-opt-price--1 {
  top: 1054px;
  width: auto;
}

/* 王冠アイコン（オプション） — 「無料対応」テキストの右隣 */
.sec-6 .sec-6__lp-opt-crown {
  position: absolute;
  width: 15px;
  height: 15px;
  left: calc(50% - 335px/2 + 279px);
  top: 1064px;
  background: url("../images/sec6/フリーの王冠アイコン (1) 1.png") center / contain no-repeat;
  filter: brightness(0) invert(1);
  z-index: 4;
}

/* 行2: 制作データのお渡し */
.sec-6 .sec-6__lp-opt-row--2.sec-6__lp-opt-left,
.sec-6 .sec-6__lp-opt-row--2.sec-6__lp-opt-right { top: 1093px; }
.sec-6 .sec-6__lp-opt-label--2 {
  top: 1100px;
}
.sec-6 .sec-6__lp-opt-price--2 {
  top: 1094px;
  width: 104px;
}

/* 行3: WordPress構築 */
.sec-6 .sec-6__lp-opt-row--3.sec-6__lp-opt-left,
.sec-6 .sec-6__lp-opt-row--3.sec-6__lp-opt-right { top: 1133px; }
.sec-6 .sec-6__lp-opt-label--3 {
  top: 1140px;
}
.sec-6 .sec-6__lp-opt-price--3 {
  top: 1134px;
  width: 83px;
  font-family: 'DIN 2014', 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 19px;
}

/* 行4: 納期指定のスピード制作プラン */
.sec-6 .sec-6__lp-opt-row--4.sec-6__lp-opt-left,
.sec-6 .sec-6__lp-opt-row--4.sec-6__lp-opt-right { top: 1173px; }
.sec-6 .sec-6__lp-opt-label--4 {
  top: 1180px;
}
.sec-6 .sec-6__lp-opt-price--4 {
  top: 1174px;
  width: 83px;
  font-family: 'DIN 2014', 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 19px;
}

/* 行5: アニメーション実装 */
.sec-6 .sec-6__lp-opt-row--5.sec-6__lp-opt-left,
.sec-6 .sec-6__lp-opt-row--5.sec-6__lp-opt-right { top: 1213px; }
.sec-6 .sec-6__lp-opt-label--5 {
  top: 1220px;
}
.sec-6 .sec-6__lp-opt-price--5 {
  top: 1214px;
  width: 95px;
  font-family: 'DIN 2014', 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 19px;
  white-space: nowrap;
  overflow: hidden;
}

/* オプション税込注記 */
.sec-6 .sec-6__lp-opt-tax {
  position: absolute;
  width: 100px;
  height: 18px;
  left: calc(50% + 335px/2 - 100px);
  top: 1255px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 175%;
  color: #1E333B;
  z-index: 3;
}

} /* end @media */
