@scope (.fixed-content) {

/* ===== Lightning(G3) 単一記事：Data Recovery カテゴリ専用 ===== */

/* === 見出し（h2）装飾 === */
/* 【修正1】v5.4.0の .section-heading と競合していたため :not(.section-heading) で除外。
   h2 に wp-block-heading + section-heading が両方付くと、こちらの青ボーダー装飾が
   詳細度で勝ってしまい、二重装飾（青左線＋黒下線）になっていた */

.single-post.category-data-recovery .entry-body h2:not(.section-heading),

.single-post.category-data-recovery .entry-body h2.wp-block-heading:not(.section-heading),

.single-post.category-data-recovery article h2:not(.section-heading),

.single-post.category-data-recovery .entry-content h2:not(.section-heading) {

  border-left: 4px solid #007cba;

  padding-left: 12px;

  background: #f8fbff;

  margin-top: 2.2em;

  margin-bottom: 1em;

}

/* === intro-lead + summary-box === */

.single-post.category-data-recovery .intro-lead.summary-box,

.single-post.category-data-recovery .entry-body .intro-lead.summary-box,

.single-post.category-data-recovery article .intro-lead.summary-box {

  background-color: #f3f8ff;

  border-left: 4px solid #007cba;

  border-radius: 8px;

  padding: 20px 22px;

  margin: 1.5em 0;

  box-shadow: 0 1px 2px rgba(0,0,0,.05);

  font-size: 1.05em;

  line-height: 1.7;

}

/* === section-box（基本） === */

.single-post.category-data-recovery .section-box,

.single-post.category-data-recovery .entry-body .section-box,

.single-post.category-data-recovery article .section-box {

  background: #fdfdfd;

  border: 1px solid #e2e8f0;

  border-radius: 8px;

  padding: 18px 20px;

  margin: 1.4em 0;

  box-shadow: 0 1px 3px rgba(0,0,0,.05);

}

/* === section-box のバリエーション === */

.single-post.category-data-recovery .section-box.alert-box,

.single-post.category-data-recovery .entry-body .section-box.alert-box,

.single-post.category-data-recovery article .section-box.alert-box {

  border-left: 4px solid #ef4444;

  background: #fffbfb;

}

.single-post.category-data-recovery .section-box.action-box,

.single-post.category-data-recovery .entry-body .section-box.action-box,

.single-post.category-data-recovery article .section-box.action-box {

  border-left: 4px solid #007cba;

}

/* === summary-box === */

.single-post.category-data-recovery .summary-box,

.single-post.category-data-recovery .entry-body .summary-box,

.single-post.category-data-recovery article .summary-box {

  background-color: #f3f8ff;

  border-left: 4px solid #007cba;

  border-radius: 8px;

  padding: 20px 22px;

  margin: 2em 0;

  box-shadow: 0 1px 2px rgba(0,0,0,.05);

}

/* === article-footer === */

.single-post.category-data-recovery .article-footer,

.single-post.category-data-recovery .entry-body .article-footer,

.single-post.category-data-recovery article .article-footer {

  background: #f9fafb;

  border-top: 2px solid #e5e7eb;

  padding: 18px 20px;

  margin-top: 2em;

  font-style: italic;

  color: #6b7280;

}

/* === source-info === */

.single-post.category-data-recovery .source-info,

.single-post.category-data-recovery .entry-body .source-info,

.single-post.category-data-recovery article .source-info {

  margin-top: 30px;

  padding: 15px;

  background-color: #f8f9fa;

  border-left: 4px solid #007cba;

  border-radius: 4px;

}

.single-post.category-data-recovery .source-info h4 {

  margin-top: 0;

  margin-bottom: 10px;

  font-size: 1.1em;

  color: #007cba;

}

/* === author-signature === */

.single-post.category-data-recovery .author-signature,

.single-post.category-data-recovery .entry-body .author-signature,

.single-post.category-data-recovery article .author-signature {

  margin-top: 40px;

  padding: 20px;

  background: #f2f2f7;

  border-radius: 8px;

  border: 1px solid #e5e5ea;

}

.single-post.category-data-recovery .author-signature ul {

  list-style: none;

  padding-left: 0;

  margin: 0;

}

.single-post.category-data-recovery .author-signature li {

  margin-bottom: 10px;

  padding-left: 25px;

  background-size: 20px;

  background-repeat: no-repeat;

  background-position: left center;

}

/* === 内側の先頭/末尾マージン調整 === */

.single-post.category-data-recovery .section-box > *:first-child,

.single-post.category-data-recovery .summary-box > *:first-child,

.single-post.category-data-recovery .intro-lead > *:first-child {

  margin-top: 0;

}

.single-post.category-data-recovery .section-box > *:last-child,

.single-post.category-data-recovery .summary-box > *:last-child,

.single-post.category-data-recovery .intro-lead > *:last-child {

  margin-bottom: 0;

}

/* === 投稿者名を非表示 === */

.single-post.category-data-recovery .post-meta .author,

.single-post.category-data-recovery .entry-meta .author,

.single-post.category-data-recovery .byline,

.single-post.category-data-recovery .author-info,

.single-post.category-data-recovery .vk_post_author,

.single-post.category-data-recovery .vk_post_meta_author {

  display: none !important;

}

/* === リンクスタイル === */

.single-post.category-data-recovery .source-info a {

  color: #007cba;

  text-decoration: none;

  border-bottom: 1px solid #007cba;

}

.single-post.category-data-recovery .source-info a:hover {

  color: #005a8e;

  border-bottom-color: #005a8e;

}

/* ===== 選ばれる3つの理由セクション改善 ===== */

/* カードのホバーエフェクト（PCのみ） */

@media (min-width: 768px) {

  .vk_custom_css_6 .vk_gridColumn_item {

    transition: transform 0.3s ease, box-shadow 0.3s ease;

  }

  .vk_custom_css_6 .vk_gridColumn_item:hover {

    transform: translateY(-5px);

    box-shadow: 0 10px 30px rgba(0,0,0,0.15);

  }

}

/* アイコン周りの余白削減（選ばれる理由セクションのみ） */

.vk_custom_css_6 .vk_icon {

  margin-bottom: 10px !important;

}

/* ===== スマホ対応（選ばれる理由セクションのみ） ===== */

@media (max-width: 767px) {

  /* グリッドを1カラムに強制 */

  .vk_custom_css_6 .vk_gridColumn > .row {

    display: flex !important;

    flex-direction: column !important;

    gap: 20px !important;

    margin: 0 !important;

  }

  

  /* カードの幅とレイアウト */

  .vk_custom_css_6 .vk_gridColumn_item {

    width: 100% !important;

    max-width: 100% !important;

    flex: 0 0 100% !important;

    margin: 0 !important;

    padding: 0 !important;

  }

  

  .vk_custom_css_6 .vk_gridColumn_item_inner {

    padding: 1.5rem 1.25rem !important;

  }

  

  /* アイコンのサイズと配置（このセクションのみ） */

  .vk_custom_css_6 .vk_icon_border {

    width: 70px !important;

    height: 70px !important;

  }

  

  .vk_custom_css_6 .vk_icon_font {

    font-size: 2.5rem !important;

  }

  

  .vk_custom_css_6 .vk_icon {

    margin-bottom: 15px !important;

  }

  

  /* ホバー無効化 */

  .vk_custom_css_6 .vk_gridColumn_item:hover {

    transform: none !important;

    box-shadow: none !important;

  }

}

/* ===== サービスの流れセクション - スマホ対応 ===== */

@media (max-width: 767px) {

  /* アイコンと見出しを横並び（選ばれる理由セクション以外） */

  .vk_gridColumn_item_inner > .wp-block-group.is-layout-flex.is-nowrap:not(.vk_custom_css_6 *) {

    flex-direction: row !important;

    align-items: center !important;

    justify-content: center !important;

    flex-wrap: nowrap !important;

    gap: 10px !important;

  }

  

  /* アイコン枠を拡大 */
  /* 【修正2】:not(.vk_custom_css_6 *) を追加。
     margin-0 クラスの組み合わせによっては詳細度(0,3,0)がこの40pxのほうが高く、
     選ばれる理由セクションの70px指定を上書きしてアイコンが縮む恐れがあった */

  .vk_icon.vk_block-margin-0--margin-bottom .vk_icon_border:not(.vk_custom_css_6 *),

  .vk_icon.vk_block-margin-0--margin-top .vk_icon_border:not(.vk_custom_css_6 *) {

    width: 40px !important;

    height: 40px !important;

  }

  

  /* アイコンフォントを拡大 */

  .vk_icon.vk_block-margin-0--margin-bottom .vk_icon_font:not(.vk_custom_css_6 *),

  .vk_icon.vk_block-margin-0--margin-top .vk_icon_font:not(.vk_custom_css_6 *) {

    font-size: 1.5rem !important;

  }

  

  /* 見出しのマージン調整 */

  .vk_gridColumn_item_inner .wp-block-group.is-layout-flex h4 {

    margin: 0 !important;

  }

}

/* ============================================

   138data Blog v5.4.0 - AWWWARDS-Grade Design

   WordPress Custom CSS（Data Recoveryカテゴリ限定版）

   ============================================ */

/* CSS Variables（ライトモードのみ）

   【修正3】@media (prefers-color-scheme: dark) の変数上書きを削除。
   Lightning本体（ページ背景・本文色）はダークモード非対応のため、
   OS側をダーク設定にしているユーザーだけボックス類が暗色に反転し、
   白背景ページの中で「崩れた」見た目になっていた。
   将来テーマ全体をダーク対応させる場合に復活させること */

:scope {

  --v54-ink: #1a1a1a;

  --v54-paper: #fafafa;

  --v54-accent: #c41e3a;

  --v54-accent-hover: #a01830;

  --v54-muted: #666666;

  --v54-border: #e0e0e0;

  --v54-cream: #faf8f5;

}

/* ============================================

   AI Disclosure - 記事冒頭の開示

   ============================================ */

.single-post.category-data-recovery .ai-disclosure,

.single-post.category-data-recovery .entry-body .ai-disclosure,

.single-post.category-data-recovery article .ai-disclosure {

  background: var(--v54-cream);

  border-left: 4px solid var(--v54-accent);

  padding: 16px 20px;

  margin-bottom: 32px;

  font-size: 14px;

  line-height: 1.6;

  color: var(--v54-muted);

  border-radius: 0;

}

.single-post.category-data-recovery .ai-disclosure strong {

  color: var(--v54-ink);

  font-weight: 600;

}

/* ============================================

   Article Lead - リードパラグラフ（上線付き）

   ============================================ */

.single-post.category-data-recovery .article-lead,

.single-post.category-data-recovery .entry-body .article-lead,

.single-post.category-data-recovery article .article-lead {

  border-top: 60px solid var(--v54-ink);

  padding-top: 24px;

  margin-bottom: 32px;

  font-size: 1.25rem;

  line-height: 1.8;

  font-weight: 400;

  color: var(--v54-ink);

}

@media (max-width: 768px) {

  .single-post.category-data-recovery .article-lead {

    border-top-width: 40px;

    font-size: 1.125rem;

    padding-top: 20px;

  }

}

/* ============================================

   Source Attribution - 出典表示

   ============================================ */

.single-post.category-data-recovery .source-attribution,

.single-post.category-data-recovery .entry-body .source-attribution,

.single-post.category-data-recovery article .source-attribution {

  font-size: 14px;

  color: var(--v54-muted);

  margin-bottom: 40px;

  padding-bottom: 16px;

  border-bottom: 1px solid var(--v54-border);

}

.single-post.category-data-recovery .source-attribution a {

  color: var(--v54-accent);

  text-decoration: none;

  transition: color 0.2s ease;

}

.single-post.category-data-recovery .source-attribution a:hover {

  color: var(--v54-accent-hover);

  text-decoration: underline;

}

/* ============================================

   Section Heading - セクション見出し（番号付き）

   ※ 冒頭のh2汎用装飾は :not(.section-heading) で除外済みのため
     ここが確実に適用される（修正1と対）

   ============================================ */

.single-post.category-data-recovery .section-heading,

.single-post.category-data-recovery .entry-body .section-heading,

.single-post.category-data-recovery article .section-heading,

.single-post.category-data-recovery .entry-content h2.section-heading {

  position: relative;

  font-size: 1.5rem;

  font-weight: 600;

  color: var(--v54-ink);

  margin-top: 48px;

  margin-bottom: 24px;

  padding-bottom: 12px;

  padding-left: 0;

  border-bottom: 2px solid var(--v54-ink);

  border-left: none;

  background: transparent;

}

.single-post.category-data-recovery .section-heading::before,

.single-post.category-data-recovery .entry-body .section-heading::before,

.single-post.category-data-recovery article .section-heading::before,

.single-post.category-data-recovery .entry-content h2.section-heading::before {

  content: attr(data-section);

  display: block;

  font-size: 0.75rem;

  font-weight: 400;

  color: var(--v54-muted);

  letter-spacing: 0.1em;

  margin-bottom: 8px;

}

@media (max-width: 768px) {

  .single-post.category-data-recovery .section-heading {

    font-size: 1.25rem;

    margin-top: 36px;

  }

}

/* ============================================

   Styled List - スタイル付きリスト（赤マーカー）

   ============================================ */

.single-post.category-data-recovery .styled-list,

.single-post.category-data-recovery .entry-body .styled-list,

.single-post.category-data-recovery article .styled-list {

  list-style: none;

  padding: 0;

  margin: 24px 0;

}

.single-post.category-data-recovery .styled-list li {

  position: relative;

  padding-left: 20px;

  margin-bottom: 12px;

  line-height: 1.8;

  color: var(--v54-ink);

}

.single-post.category-data-recovery .styled-list li::before {

  content: '';

  position: absolute;

  left: 0;

  top: 0.6em;

  width: 6px;

  height: 6px;

  background: var(--v54-accent);

  border-radius: 0;

}

.single-post.category-data-recovery .styled-list li strong {

  font-weight: 600;

}

/* Numbered List Variant */

.single-post.category-data-recovery .styled-list.numbered {

  counter-reset: list-counter;

}

.single-post.category-data-recovery .styled-list.numbered li {

  padding-left: 32px;

}

.single-post.category-data-recovery .styled-list.numbered li::before {

  content: counter(list-counter, decimal-leading-zero);

  counter-increment: list-counter;

  position: absolute;

  left: 0;

  top: 0;

  width: auto;

  height: auto;

  background: transparent;

  font-size: 0.875rem;

  font-weight: 600;

  color: var(--v54-accent);

}

/* ============================================

   Tech Term - 技術用語リンク

   ============================================ */

.single-post.category-data-recovery .tech-term,

.single-post.category-data-recovery .entry-body .tech-term,

.single-post.category-data-recovery article .tech-term {

  color: var(--v54-accent);

  text-decoration: none;

  border-bottom: 1px dotted var(--v54-accent);

  cursor: help;

  transition: all 0.2s ease;

}

.single-post.category-data-recovery .tech-term:hover {

  color: var(--v54-accent-hover);

  border-bottom-style: solid;

}

/* ============================================

   Article Blockquote - 引用ブロック

   ============================================ */

.single-post.category-data-recovery .article-blockquote,

.single-post.category-data-recovery .entry-body .article-blockquote,

.single-post.category-data-recovery article .article-blockquote {

  margin: 32px 0;

  padding: 24px 32px;

  border-left: 4px solid var(--v54-accent);

  background: var(--v54-cream);

  font-style: italic;

}

.single-post.category-data-recovery .article-blockquote p {

  font-size: 1.125rem;

  line-height: 1.8;

  color: var(--v54-ink);

  margin: 0;

}

.single-post.category-data-recovery .article-blockquote cite {

  display: block;

  margin-top: 12px;

  font-size: 0.875rem;

  font-style: normal;

  color: var(--v54-muted);

}

/* ============================================

   AI Analysis Box - AI分析ボックス（記事末尾）

   ============================================ */

.single-post.category-data-recovery .ai-analysis,

.single-post.category-data-recovery .entry-body .ai-analysis,

.single-post.category-data-recovery article .ai-analysis {

  border-top: 3px solid var(--v54-ink);

  background: var(--v54-cream);

  padding: 32px;

  margin-top: 48px;

  margin-bottom: 32px;

  border-radius: 0;

}

.single-post.category-data-recovery .ai-analysis .ai-header {

  display: flex;

  align-items: center;

  gap: 16px;

  margin-bottom: 20px;

}

.single-post.category-data-recovery .ai-analysis .ai-avatar {

  font-size: 2rem;

  line-height: 1;

}

.single-post.category-data-recovery .ai-analysis .ai-info h4 {

  font-size: 1rem;

  font-weight: 600;

  color: var(--v54-ink);

  margin: 0 0 4px 0;

}

.single-post.category-data-recovery .ai-analysis .ai-badge {

  display: inline-block;

  background: var(--v54-accent);

  color: white;

  font-size: 0.625rem;

  font-weight: 700;

  padding: 2px 6px;

  border-radius: 2px;

  margin-left: 8px;

  vertical-align: middle;

}

.single-post.category-data-recovery .ai-analysis .ai-info span {

  font-size: 0.75rem;

  color: var(--v54-muted);

}

.single-post.category-data-recovery .ai-analysis blockquote {

  margin: 0;

  padding: 0;

  border: none;

  background: transparent;

  font-style: normal;

}

.single-post.category-data-recovery .ai-analysis blockquote p {

  font-size: 1rem;

  line-height: 1.8;

  color: var(--v54-ink);

  margin: 0;

}

/* Highlight in AI Analysis */
/* 【修正3関連】ダークモード用の .highlight 上書きも削除（ライト固定） */

.single-post.category-data-recovery .highlight {

  background: linear-gradient(to bottom, transparent 60%, rgba(196, 30, 58, 0.2) 60%);

  padding: 0 2px;

}

/* ============================================

   Code Blocks（カテゴリ限定）

   ============================================ */

.single-post.category-data-recovery .entry-content pre {

  background: #1e1e1e;

  color: #d4d4d4;

  padding: 20px;

  border-radius: 4px;

  overflow-x: auto;

  font-size: 0.875rem;

  line-height: 1.6;

  margin: 24px 0;

}

.single-post.category-data-recovery .entry-content code {

  font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;

}

/* Inline code */

.single-post.category-data-recovery .entry-content p code,

.single-post.category-data-recovery .entry-content li code {

  background: var(--v54-cream);

  padding: 2px 6px;

  border-radius: 3px;

  font-size: 0.9em;

  color: var(--v54-accent);

}

/* ============================================

   Responsive Adjustments

   ============================================ */

@media (max-width: 768px) {

  .single-post.category-data-recovery .ai-disclosure {

    padding: 14px 16px;

    font-size: 13px;

  }

  .single-post.category-data-recovery .ai-analysis {

    padding: 24px 20px;

  }

  .single-post.category-data-recovery .ai-analysis .ai-header {

    gap: 12px;

  }

  .single-post.category-data-recovery .ai-analysis .ai-avatar {

    font-size: 1.5rem;

  }

  .single-post.category-data-recovery .article-blockquote {

    padding: 20px 24px;

  }

  .single-post.category-data-recovery .styled-list li {

    padding-left: 16px;

    font-size: 0.9375rem;

  }

}

/* ============================================

   Print Styles

   ============================================ */

@media print {

  .single-post.category-data-recovery .ai-disclosure,

  .single-post.category-data-recovery .ai-analysis {

    background: #f5f5f5 !important;

    -webkit-print-color-adjust: exact;

    print-color-adjust: exact;

  }

  .single-post.category-data-recovery .article-lead {

    border-top-color: #000 !important;

  }

  .single-post.category-data-recovery .section-heading {

    border-bottom-color: #000 !important;

  }

}

/* ===== メディアと文章ブロック - レスポンシブ対応 ===== */

/* 画像の高さをテキストに合わせる */

.wp-block-media-text.is-image-fill-element {

  align-items: stretch;

}

/* 画像エリア：最小高さ解除＋相対配置
   【修正4】同一セレクタで2回に分かれていた宣言を統合（動作は同じ、可読性向上） */

.wp-block-media-text.is-image-fill-element > .wp-block-media-text__media {

  position: relative;

  min-height: auto !important;

  align-self: stretch;

}

/* 画像をコンテナにフィット */

.wp-block-media-text.is-image-fill-element > .wp-block-media-text__media img {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: center top;

}

/* テキスト側に最低限のパディング確保 */

.wp-block-media-text.is-image-fill-element > .wp-block-media-text__content {

  padding-top: 2rem;

  padding-bottom: 2rem;

}

/* ===== スマホ時（縦積み）===== */

@media (max-width: 600px) {

  /* スマホでは画像に固定比率を適用 */

  .wp-block-media-text.is-image-fill-element > .wp-block-media-text__media {

    aspect-ratio: 4 / 3;

    min-height: auto !important;

  }

  

  .wp-block-media-text.is-image-fill-element > .wp-block-media-text__media img {

    position: absolute;

    height: 100%;

  }

}

/* ========================================

   わたしたちの想い（page-id-2149）

   スマホ表示 レスポンシブ調整 v2

   ======================================== */

/* ----- スマホ（782px以下） ----- */

@media (max-width: 782px) {

  

  /* ===== 全体のセクション余白 ===== */

  .page-id-2149 .vk-cols--grid,

  .page-id-2149 .wp-block-columns,

  .page-id-2149 .wp-block-group {

    margin-top: 1.5rem !important;

    margin-bottom: 1.5rem !important;

    padding-top: 0 !important;

    padding-bottom: 0 !important;

  }

  

  /* ===== VK Grid 専用 ===== */

  .page-id-2149 .vk-cols--grid > .wp-block-column {

    margin-top: 0 !important;

    margin-bottom: 1rem !important;

    padding-top: 0 !important;

    padding-bottom: 0 !important;

  }

  

  /* ===== 見出し（h2, h3）の余白 ===== */

  .page-id-2149 h2,

  .page-id-2149 .wp-block-heading {

    margin-top: 1.5rem !important;

    margin-bottom: 0.5rem !important;

  }

  

  .page-id-2149 h3 {

    margin-top: 1rem !important;

    margin-bottom: 0.3rem !important;

  }

  

  /* ===== サブタイトル（APPROACH等） ===== */

  .page-id-2149 h2 + p,

  .page-id-2149 h3 + p,

  .page-id-2149 .has-text-align-center {

    margin-top: 0.2rem !important;

    margin-bottom: 0.8rem !important;

  }

  

  /* ===== 画像の余白を大幅削減 ===== */

  .page-id-2149 .wp-block-image,

  .page-id-2149 figure.wp-block-image {

    margin-top: 1rem !important;

    margin-bottom: 1rem !important;

  }

  

  .page-id-2149 .wp-block-image img {

    margin: 0 !important;

  }

  

  /* ===== ボタンの余白 ===== */

  .page-id-2149 .wp-block-buttons,

  .page-id-2149 .wp-block-button {

    margin-top: 1rem !important;

    margin-bottom: 0.5rem !important;

  }

  

  /* ===== 段落の余白 ===== */

  .page-id-2149 p {

    margin-bottom: 0.8rem !important;

  }

  

  /* ===== グループ内部のパディング ===== */

  .page-id-2149 .wp-block-group__inner-container,

  .page-id-2149 .vk_outer-body {

    padding-top: 1rem !important;

    padding-bottom: 1rem !important;

  }

  

  /* ===== カバーブロック ===== */

  .page-id-2149 .wp-block-cover {

    margin-top: 1rem !important;

    margin-bottom: 1rem !important;

    min-height: 180px !important;

  }

  

  /* ===== スペーサーを非表示 ===== */

  .page-id-2149 .wp-block-spacer {

    height: 20px !important;

  }

  

  /* ===== セパレーター ===== */

  .page-id-2149 .wp-block-separator {

    margin-top: 1rem !important;

    margin-bottom: 1rem !important;

  }

  

  /* ===== Lightning固有のクラス ===== */

  .page-id-2149 .vk_outer,

  .page-id-2149 .vk_outer_container {

    padding-top: 1.5rem !important;

    padding-bottom: 1.5rem !important;

  }

  

  /* ===== カラム間の隙間 ===== */

  .page-id-2149 .wp-block-columns {

    gap: 1rem !important;

  }

  

  .page-id-2149 .wp-block-column {

    margin-bottom: 0.5rem !important;

  }

  

}

/* ----- 小さいスマホ（480px以下） ----- */

@media (max-width: 480px) {

  

  .page-id-2149 .vk-cols--grid,

  .page-id-2149 .wp-block-columns,

  .page-id-2149 .wp-block-group {

    margin-top: 1rem !important;

    margin-bottom: 1rem !important;

  }

  

  .page-id-2149 .wp-block-image {

    margin-top: 0.8rem !important;

    margin-bottom: 0.8rem !important;

  }

  

  .page-id-2149 h2 {

    font-size: 1.25rem !important;

    margin-top: 1.2rem !important;

  }

  

  .page-id-2149 h3 {

    font-size: 1.1rem !important;

  }

  

  .page-id-2149 .wp-block-spacer {

    height: 10px !important;

  }

  

  /* ===== 英語サブタイトル（APPROACH等）改行防止 ===== */

  .page-id-2149 .vk_heading_subtext,

  .page-id-2149 .vk-font-family-en {

    white-space: nowrap !important;

  }

  

}

/* ============================================

   ページヘッダー非表示

   ============================================ */

/* お問い合わせページのヘッダーを非表示 */

.page-id-1790 .page-header {

    display: none !important;

}

/* 更新情報（投稿一覧）ページのヘッダーを非表示 */

.blog .page-header {

    display: none !important;

}

/* Web制作ページのみ：ヘッダー上部の空白削除 */

:scope.page-id-8842 {

    padding-top: 0 !important;

}

/* =====================================================

   トップページ：お悩みセクション強化（案E改）修正版

   ===================================================== */

/* 共通：左ボーダー + ホバーエフェクト（トップページのみ）
   【修正5】:not(.vk_gridcolcard-ai-usecase-cards-001 *) を追加。
   元の指定はトップページ上の「すべての」gridcolcard に左ボーダー色と
   ホバーを適用してしまうため、AI活用事例カード等が同居した場合に
   nth-child の色（緑/橙/紫）が意図せず付く恐れがあった */

.home .vk_gridcolcard .vk_gridcolcard_item:not(.vk_gridcolcard-ai-usecase-cards-001 *) {

    border-left: 4px solid transparent;

    transition: transform 0.3s ease, box-shadow 0.3s ease;

}

.home .vk_gridcolcard .vk_gridcolcard_item:not(.vk_gridcolcard-ai-usecase-cards-001 *):hover {

    transform: translateY(-4px);

    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);

}

/* お悩み01（DataGate）- 守り：ブランドカラー */

.home .vk_gridcolcard .vk_gridcolcard_item:nth-child(1):not(.vk_gridcolcard-ai-usecase-cards-001 *) {

    border-left-color: #2B5E4E;

}

.home .vk_gridcolcard .vk_gridcolcard_item:nth-child(1):not(.vk_gridcolcard-ai-usecase-cards-001 *) .wp-block-button__link:hover {

    background-color: #234b3e !important;

}

/* お悩み02（Web制作）- 攻め：オレンジ */

.home .vk_gridcolcard .vk_gridcolcard_item:nth-child(2):not(.vk_gridcolcard-ai-usecase-cards-001 *) {

    border-left-color: #E67E22;

}

.home .vk_gridcolcard .vk_gridcolcard_item:nth-child(2):not(.vk_gridcolcard-ai-usecase-cards-001 *) .wp-block-button__link:hover {

    background-color: #d35400 !important;

}

/* お悩み03（AutoPost）- 攻め：パープル */

.home .vk_gridcolcard .vk_gridcolcard_item:nth-child(3):not(.vk_gridcolcard-ai-usecase-cards-001 *) {

    border-left-color: #7C3AED;

}

.home .vk_gridcolcard .vk_gridcolcard_item:nth-child(3):not(.vk_gridcolcard-ai-usecase-cards-001 *) .wp-block-button__link:hover {

    background-color: #6b32cc !important;

}

/* =====================================================

   フッターナビ：スマホ時の縦線（区切り線）を非表示

   ===================================================== */

@media (max-width: 767px) {

    /* フッターのリスト項目の区切り線を削除 */

    .site-footer li::before,

    .site-footer li::after,

    .site-footer a::before,

    .site-footer a::after,

    footer li::before,

    footer li::after,

    footer a::before,

    footer a::after,

    .footer-nav li::before,

    .footer-nav li::after,

    .vk-mobile-nav li::before,

    .vk-mobile-nav li::after,

    .mobile-fix-nav li::before,

    .mobile-fix-nav li::after {

        display: none !important;

        content: none !important;

        border: none !important;

        width: 0 !important;

        height: 0 !important;

    }

    

    /* ボーダーも念のため削除 */

    .site-footer li,

    .site-footer a,

    footer li,

    footer a,

    .footer-nav li,

    .vk-mobile-nav li,

    .mobile-fix-nav li {

        border-left: none !important;

        border-right: none !important;

    }

}

/* =====================================================

   フッター：サービス案内の縦線のみ削除

   ===================================================== */

/* グリッドカラムカードアイテムのボーダーを削除 */

.block-site-footer .wp-block-vk-blocks-gridcolcard-item,

.block-site-footer .wp-block-vk-blocks-gridcolcard-item-body,

.block-site-footer .vk_gridcolcard_item,

.block-site-footer .vk_gridcolcard_item_body,

footer .wp-block-vk-blocks-gridcolcard-item,

footer .wp-block-vk-blocks-gridcolcard-item-body {

    border-left: none !important;

    border-right: none !important;

    border-left-style: none !important;

    border-right-style: none !important;

}

/* セクション3 ボタンエフェクト */

.vk_gridcolcard-ai-usecase-cards-001 .wp-block-button__link {

  transition: all 0.25s ease !important;

  box-shadow: 0 2px 4px rgba(0,0,0,0.08) !important;

}

.vk_gridcolcard-ai-usecase-cards-001 .wp-block-button__link:hover {

  transform: translateY(-2px) !important;

  box-shadow: 0 6px 16px rgba(0,0,0,0.15) !important;

  opacity: 0.92 !important;

}

.vk_gridcolcard-ai-usecase-cards-001 .wp-block-button__link:active {

  transform: translateY(1px) scale(0.97) !important;

  box-shadow: 0 1px 2px rgba(0,0,0,0.12) !important;

  opacity: 1 !important;

}

/* ============================================

   セクション5 スクロールアニメーション（v2 再設計）

   【修正6】旧版の問題点を解消：
   ・hover の transition: all 0.3s !important が入場アニメの
     transition（0.7s＋遅延）を破壊し、ホバー中に入場が飛ぶ
   ・.sec5-animate-2 / -3 の transition-delay がホバー解除時にも
     効いてしまい、マウスを離すと 0.2〜0.4 秒固まってから戻る
   ・非表示状態（opacity:0）でも hover の transform !important が
     効いてしまう
   → 入場は @keyframes、ホバーは transition に役割分離。
     JS 側の「.is-visible を付与する」仕組みは変更不要。

   ============================================ */

/* 初期状態: 非表示＋下にずらす */

.sec5-animate {

  opacity: 0;

  transform: translateY(40px);

  box-shadow: 0 2px 8px rgba(0,0,0,0.06);

}

/* 表示状態: JSで .is-visible が付与される */

.sec5-animate.is-visible {

  opacity: 1;

  transform: translateY(0);

  animation: sec5-fadeup 0.7s ease-out backwards;

  transition: transform 0.3s ease, box-shadow 0.3s ease;

}

/* カード2: 0.2秒遅延 / カード3: 0.4秒遅延（入場のみに作用） */

.sec5-animate-2.is-visible {

  animation-delay: 0.2s;

}

.sec5-animate-3.is-visible {

  animation-delay: 0.4s;

}

/* カードホバーエフェクト（表示完了後のみ） */

.sec5-animate.is-visible:hover {

  transform: translateY(-4px);

  box-shadow: 0 8px 24px rgba(37, 116, 169, 0.15);

}

/* CTAボタンエフェクト
   【修正7】href の完全一致 [href="…/contact"] だと末尾スラッシュ付き
   （/contact/）の場合に一切効かないため、前方一致 ^= に変更 */

.wp-block-button__link[href^="https://138io.com/contact"] {

  transition: all 0.3s ease !important;

}

.wp-block-button__link[href^="https://138io.com/contact"]:hover {

  transform: translateY(-2px) !important;

  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.4) !important;

  opacity: 0.95 !important;

}

.wp-block-button__link[href^="https://138io.com/contact"]:active {

  transform: translateY(1px) scale(0.98) !important;

  box-shadow: 0 2px 4px rgba(37, 99, 235, 0.3) !important;

}

/* AMZ-LINK wpautop空p対策（GO-D3・2026-07-07・案A・隣接限定） */
aside.tms-amazon-promo + p:empty { display: none; }
p:empty:has(+ aside.tms-amazon-promo) { display: none; }

/* AMZ-LINKカード幅調整（GO-D3・2026-07-07・案W-640）: 本文テキスト幅640pxに一致 */
aside.tms-amazon-promo { max-width: 640px !important; }

/* 138io フッターの大型 CTA 整理（2026-09-26）: 下部固定ナビ（.mobile-fix-nav、991.98px 以下で表示）が出る幅では、
   フッター内の大型ボタンの列（白い「お問い合わせ」＋赤い電話番号）を列ごと非表示にする。
   お問い合わせ・TEL は下部固定ナビ、サイトの導線はフッターの 6 分割メニューに残す。992px 以上（PC）は変更しない。
   :has() 非対応のブラウザ（iOS 15.3 以前など）では何も変わらない（ボタンが表示されたまま）。 */
@media (max-width: 991.98px) {
  .block-site-footer .wp-block-column:has(> .wp-block-vk-blocks-button-outer a.vk_button_link[href^="tel:"]) {
    display: none;
  }
}

/* 投稿記事（シングル）の「更新情報」ページヘッダーを非表示 2026-09-30 */
.single-post .page-header {
  display: none !important;
}

/* 138io 解約した電話番号を画面に出さない（2026-10-21）。すべての幅で次の 4 か所を非表示にする:
   ヘッダー上部の番号・フッターの赤い電話ボタン・下部固定ナビの「TEL」・AI受付の本人確認カードの「お電話でのご相談」のリンク。
   リンク先・HTML は変えない（番号は HTML には残る）。連絡は AI受付の「担当者からの電話を希望」（担当者から折り返し）へ。 */
.header-top li.header-top-tel,
.block-site-footer .vk_buttons a.vk_button_link[href^="tel:"],
.mobile-fix-nav .mobile-fix-nav-menu > li > a[href^="tel:"],
.io138-air__verify .io138-air__verifyPhone {
  display: none;
}
/* :has() 対応のブラウザでは、ボタンの枠・固定ナビの項目ごと消す。
   :has() 非対応のブラウザ（iOS 15.3 以前など）ではこの 2 つの規則だけが無視され、上の規則でリンクは消える（枠や空きが残る場合がある）。 */
.block-site-footer .wp-block-vk-blocks-button:has(> a.vk_button_link[href^="tel:"]) {
  display: none;
}
.mobile-fix-nav .mobile-fix-nav-menu > li:has(> a[href^="tel:"]) {
  display: none;
}

/* 138io AutoPost のお問い合わせの案内（2026-10-22）: 電話の列を削除して 1 列になったため、お問い合わせボタンの列（幅 33.33%）を中央に置く。
   列が縦に並ぶ幅（781px 以下）では列の幅が 100% のため変わらない。:has() 非対応のブラウザでは左に寄ったまま。 */
.page-id-8651 .wp-block-columns > .wp-block-column:only-child:has(> .wp-block-vk-blocks-button a[href="https://138io.com/contact"]) {
  margin-left: auto;
  margin-right: auto;
}


}

@keyframes sec5-fadeup {

  from {

    opacity: 0;

    transform: translateY(40px);

  }

  to {

    opacity: 1;

    transform: translateY(0);

  }

}