/*
 * @site-assets-manager-description: 公開ページ全体の見た目調整CSS
 * @site-assets-manager-public: true
 * @site-assets-manager-priority: 10
 * @site-assets-manager-scope: all
 * @site-assets-manager-updated-by: rest
 */

/* 001. Migrated from WordPress Additional CSS */

/* =========================================================
   修正時の目安
   - 背景色・全体色：01
   - ヘッダー・フッター：10
   - 投稿記事本文：11
   - 記事一覧ページ：14
   - スマホ表示：15
   - フッターのPowered by非表示：16
   - フッターリンク表示：17
   - ヘッダーロゴ横コピー：18
   - スマホ版カテゴリーラベル：20
   - 記事内関連サービス案内：21
   - 参考リンク一覧：22
   - カテゴリー説明文：23
   - スマホメニューのカテゴリー展開：24
   - カテゴリー説明文内の関連カテゴリーリンク：25
   - 記事本文内の通常リスト共通デザイン：26
   - 関連サービス・運営会社カード内ロゴ：27

========================================================= */


/* =========================================================
   01. 全体背景・基本色
   - サイト全体の背景色
   - 本文色
========================================================= */

body,
.site-body,
.siteContent,
.siteContent_after,
.entry-body,
.entry-content {
  background: #F7F3EC;
  color: #333333;
}


/* =========================================================
   10. ヘッダー・フッター
   - ヘッダー背景
   - フッター背景・文字色
========================================================= */

.site-header {
  background: #FFFFFF;
  border-bottom: 1px solid #E6DED2;
}

.site-footer,
.site-footer .copySection {
  background: #F7F3EC;
  color: #7A746C;
  font-size: 13px;
}

.site-footer a,
.copySection a {
  color: #7A746C;
}


/* =========================================================
   11. 投稿記事本文
   - 投稿ページの本文幅
   - 記事タイトル
   - H2/H3
   - 本文・表・リスト・画像
   - テーブル指定もここに統合
========================================================= */

/* 11-1. 投稿本文の幅 */
.single-post .main-section {
  max-width: 820px;
  margin: 0 auto;
  width: 100%;
}

/* 11-2. 記事タイトル */
.single-post .entry-title {
  display: block;
  margin-bottom: 24px;
  font-size: clamp(26px, 2.5vw, 34px);
  line-height: 1.45;
  color: #111111;
}

/* 11-3. 投稿日・更新日などのメタ情報 */
.single-post .entry-meta,
.single-post .entry-meta_items,
.single-post .published,
.single-post .updated {
  color: #7A746C;
  font-size: 13px;
  line-height: 1.7;
}

/* 11-4. 投稿本文全体 */
.single-post .entry-body,
.single-post .entry-content {
  font-size: 17px;
  line-height: 2;
  color: #333333;
}

/* 11-5. 段落 */
.single-post .entry-body p,
.single-post .entry-content p {
  margin-bottom: 1.6em;
}

/* 11-6. 記事内画像 */
.single-post .entry-body figure,
.single-post .entry-content figure {
  margin-top: 32px;
  margin-bottom: 36px;
}

.single-post .entry-body img,
.single-post .entry-content img {
  max-width: 100%;
  height: auto;
  border-radius: 14px;
}

/* 11-7. H2見出し */
.single-post .entry-body h2,
.single-post .entry-content h2 {
  margin-top: 58px;
  margin-bottom: 24px;
  padding: 18px 0 14px;
  font-size: 24px;
  line-height: 1.55;
  color: #111111;
  border-top: 2px solid #22314F;
  border-bottom: 1px solid #DDD4C8;
}

/* 11-8. H3見出し */
.single-post .entry-body h3,
.single-post .entry-content h3 {
  margin-top: 38px;
  margin-bottom: 18px;
  padding-bottom: 10px;
  font-size: 22px;
  line-height: 1.5;
  color: #1F2A44;
  border-bottom: 1px solid #E6DED2;
}

/* 11-9. 箇条書き */
.single-post .entry-body ul,
.single-post .entry-body ol,
.single-post .entry-content ul,
.single-post .entry-content ol {
  margin: 0 0 1.8em 1.4em;
  padding-left: 1.2em;
}

.single-post .entry-body li,
.single-post .entry-content li {
  margin-bottom: 0.65em;
  line-height: 1.9;
}

/* 11-10. 表全体 */
.single-post .entry-body figure.wp-block-table,
.single-post .entry-content figure.wp-block-table,
.single-post .entry-body .wp-block-table,
.single-post .entry-content .wp-block-table {
  margin: 32px 0 40px !important;
  overflow-x: auto !important;
  border: 1px solid #E3DBD0 !important;
  border-radius: 14px !important;
  background: #FFFFFF !important;
}

/* 11-11. 表本体 */
.single-post .entry-body table,
.single-post .entry-content table,
.single-post .main-section table {
  width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  background: #FFFFFF !important;
  border: none !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
}

/* 11-12. 表の見出しセル */
.single-post .entry-body table th,
.single-post .entry-content table th,
.single-post .main-section table th {
  background: #F1EAE0 !important;
  color: #1F2A44 !important;
  font-weight: 700 !important;
  text-align: left !important;
  padding: 14px 16px !important;
  border: 1px solid #D8D0C5 !important;
  white-space: nowrap !important;
}

/* 11-13. 表の本文セル */
.single-post .entry-body table td,
.single-post .entry-content table td,
.single-post .main-section table td {
  background: #FFFFFF !important;
  color: #333333 !important;
  padding: 14px 16px !important;
  border: 1px solid #E3DBD0 !important;
  vertical-align: top !important;
}

/* 11-14. 表の左列を少し強調 */
.single-post .entry-body table td:first-child,
.single-post .entry-content table td:first-child,
.single-post .main-section table td:first-child {
  color: #1F2A44 !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}

/* 11-15. 表の偶数行に薄い背景 */
.single-post .entry-body table tbody tr:nth-child(even) td,
.single-post .entry-content table tbody tr:nth-child(even) td,
.single-post .main-section table tbody tr:nth-child(even) td {
  background: #FBF8F3 !important;
}

/* 11-16. 参考リンクなど記事内リンク */
.single-post .entry-body a,
.single-post .entry-content a {
  color: #8A1F2D;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.single-post .entry-body a:hover,
.single-post .entry-content a:hover {
  color: #6F1824;
}

/* 11-17. 記事下のカテゴリー・前後記事ナビ */
.single-post .entry-footer,
.single-post .postNextPrev,
.single-post .nav-links {
  margin-top: 48px;
  padding-top: 28px;
  border-top: 1px solid #DDD4C8;
}

/* 11-18. スマホ表示 */
@media (max-width: 768px) {
  .single-post .main-section {
    max-width: none;
  }

  .single-post .entry-title {
    font-size: 24px;
    line-height: 1.55;
  }

  .single-post .entry-body,
  .single-post .entry-content {
    font-size: 16px;
    line-height: 1.95;
  }

  .single-post .entry-body h2,
  .single-post .entry-content h2 {
    margin-top: 46px;
    font-size: 19px;
    line-height: 1.55;
  }

  .single-post .entry-body h3,
  .single-post .entry-content h3 {
    margin-top: 32px;
    font-size: 20px;
    line-height: 1.6;
  }

  .single-post .entry-body figure.wp-block-table,
  .single-post .entry-content figure.wp-block-table,
  .single-post .entry-body .wp-block-table,
  .single-post .entry-content .wp-block-table {
    margin: 28px 0 34px !important;
    border-radius: 10px !important;
    overflow-x: auto !important;
  }

  .single-post .entry-body table,
  .single-post .entry-content table,
  .single-post .main-section table {
    min-width: 720px !important;
    font-size: 14px !important;
  }

  .single-post .entry-body table th,
  .single-post .entry-content table th,
  .single-post .main-section table th,
  .single-post .entry-body table td,
  .single-post .entry-content table td,
  .single-post .main-section table td {
    padding: 12px 13px !important;
  }

  .single-post .entry-body img,
  .single-post .entry-content img {
    border-radius: 10px;
  }
}


/* =========================================================
   14. 記事一覧ページ・カテゴリーページ
   - /articles/ の記事一覧
   - /category/ 配下のカテゴリ記事一覧
   - Lightning標準の一覧構造を活かす
   - PCでは余計なカード化・画像加工はしない
   - スマホでは「見出し → 日付 → 写真 → 抜粋 → 続きを読む」の順にする
========================================================= */

/* 14-1. 記事一覧ページの本文幅だけ整える */
.blog .main-section,
.archive .main-section {
  max-width: 980px;
  margin: 0 auto;
  width: 100%;
}

/* 14-2. ページタイトル帯 */
.page-header {
  background: #1F2A44;
  color: #FFFFFF;
  padding: 30px 20px;
  border: none;
}

.page-header-title,
.page-header h1 {
  color: #FFFFFF !important;
  font-size: clamp(26px, 2.5vw, 36px);
  line-height: 1.4;
  text-align: center;
}

/* 14-3. パンくず */
.breadcrumb {
  background: #F7F3EC;
  border-bottom: 1px solid #E6DED2;
}

.breadcrumb-list,
.breadcrumb-list a {
  color: #6F6A63;
  font-size: 13px;
}

/* 14-4. 記事タイトルだけ少し整える */
.blog .postList_title a,
.archive .postList_title a,
.blog .vk_post_title a,
.archive .vk_post_title a {
  color: #1F2A44;
  font-weight: 700;
  text-decoration: none;
}

.blog .postList_title a:hover,
.archive .postList_title a:hover,
.blog .vk_post_title a:hover,
.archive .vk_post_title a:hover {
  color: #8A1F2D;
  text-decoration: underline;
}

/* 14-5. 抜粋文 */
.blog .postList_excerpt,
.archive .postList_excerpt,
.blog .vk_post_excerpt,
.archive .vk_post_excerpt,
.blog .entry-summary,
.archive .entry-summary {
  color: #333333;
  line-height: 1.8;
}

/* 14-6. スマホ表示 */
@media (max-width: 768px) {
  .page-header {
    padding: 16px;
  }

  .page-header-title,
  .page-header h1 {
    font-size: 24px;
    line-height: 1.35;
  }

  .blog .main-section,
  .archive .main-section {
    max-width: none;
  }

  /* 14-6-1. スマホでは記事ごとに縦並びにする */
  .blog .postList_item,
  .archive .postList_item,
  .blog .vk_post,
  .archive .vk_post {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    margin-bottom: 34px;
    padding-bottom: 34px;
    border-bottom: 1px solid #DDD4C8;
  }

  /* 14-6-2. 本文エリア内の要素を並べ替え対象にする */
  .blog .postList_body,
  .archive .postList_body,
  .blog .vk_post_body,
  .archive .vk_post_body {
    display: contents !important;
  }

  /* 14-6-3. 見出しを最初に表示 */
  .blog .postList_title,
  .archive .postList_title,
  .blog .vk_post_title,
  .archive .vk_post_title {
    order: 1;
    margin: 0 0 10px;
    padding: 0;
    border: none;
  }

  .blog .postList_title a,
  .archive .postList_title a,
  .blog .vk_post_title a,
  .archive .vk_post_title a {
    font-size: 21px;
    line-height: 1.55;
  }

  /* 14-6-4. 日付は見出しの下 */
  .blog .postList_date,
  .archive .postList_date,
  .blog .vk_post_date,
  .archive .vk_post_date,
  .blog .published,
  .archive .published {
    order: 2;
    display: block;
    margin: 0 0 14px;
    color: #7A746C;
    font-size: 13px;
  }

  /* 14-6-5. 写真は日付の下。スマホでは横幅いっぱいに表示 */
  .blog .postList_thumbnail,
  .archive .postList_thumbnail,
  .blog .vk_post_imgOuter,
  .archive .vk_post_imgOuter {
    order: 3;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 18px !important;
    overflow: hidden;
  }

  .blog .postList_thumbnail a,
  .archive .postList_thumbnail a,
  .blog .vk_post_imgOuter a,
  .archive .vk_post_imgOuter a {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
  }

  .blog .postList_thumbnail img,
  .archive .postList_thumbnail img,
  .blog .vk_post_imgOuter img,
  .archive .vk_post_imgOuter img {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    aspect-ratio: auto !important;
    object-fit: initial !important;
    border-radius: 0 !important;
  }

  /* 14-6-6. 抜粋文は写真の下 */
  .blog .postList_excerpt,
  .archive .postList_excerpt,
  .blog .vk_post_excerpt,
  .archive .vk_post_excerpt,
  .blog .entry-summary,
  .archive .entry-summary {
    order: 4;
    margin-top: 0;
    color: #333333;
    font-size: 14px;
    line-height: 1.85;
  }

  /* 14-6-7. 続きを読むは最後 */
  .blog .postList_more,
  .archive .postList_more,
  .blog .vk_post_btn,
  .archive .vk_post_btn {
    order: 5;
    margin-top: 14px;
  }
}


/* =========================================================
   15. スマホ表示
   - 768px以下
   - ファーストビュー縦並び
   - リンク下と画像の間隔を確保
   - カード1列
   - 投稿本文調整
========================================================= */

@media (max-width: 768px) {
  .arcx-hero,
  .arcx-section {
    padding: 42px 20px;
  }

  .arcx-hero {
    padding-top: 66px;
    padding-bottom: 60px;
  }

  .arcx-hero-header {
    margin-bottom: 36px;
    text-align: left;
  }

  .arcx-hero h1 {
    max-width: none;
    font-size: clamp(34px, 8vw, 46px);
    line-height: 1.3;
  }

  .arcx-hero-columns {
    display: block !important;
  }

  /* 15-1. スマホ時：左カラム末尾のリンクと画像の間隔を確保 */
  .arcx-hero-columns .wp-block-column:first-child {
    margin-bottom: 36px !important;
  }

  /* 15-2. スマホ時：画像側の余白が二重にならないよう調整 */
  .arcx-hero-image {
    margin-top: 0;
  }

  .arcx-hero-image img {
    aspect-ratio: auto;
    border-radius: 16px;
  }

  .arcx-section h2 {
    padding-top: 20px;
    padding-bottom: 14px;
    margin-bottom: 28px;
    font-size: 30px;
  }

  .arcx-section h3,
  .arcx-card h3 {
    font-size: 21px;
  }

  .arcx-hero p,
  .arcx-section p {
    font-size: 16px;
  }

  .arcx-lead {
    font-size: 18px !important;
  }

  .arcx-grid-2 {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
    margin-top: 24px !important;
  }

  .arcx-card {
    padding: 24px 22px 24px;
    border-radius: 16px;
  }

  .arcx-message {
    padding: 38px 24px;
    border-radius: 18px;
  }

  .arcx-posts .wp-block-latest-posts {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .single-post .main-section,
  .blog .main-section,
  .archive .main-section {
    max-width: none;
  }

  .blog .entry-title,
  .archive .entry-title {
    font-size: 30px;
  }

  .single-post .entry-content h2 {
    font-size: 19px;
    line-height: 1.55;
  }
}


/* =========================================================
   16. フッターのPowered by非表示
   - Lightning / VK All in One Expansion Unit のクレジット行を非表示
   - Copyright 表記は残す
   - CSSで見た目上だけ非表示にする
========================================================= */

.site-footer-copyright p:nth-child(2),
footer .copySection p:nth-child(2),
.copySection p:nth-child(2),
.site-footer .copySection p:nth-child(2),
.site-footer .site-footer-copyright p:nth-child(2) {
  display: none !important;
}


/* =========================================================
   17. フッターリンク表示
   - フッターに運営会社・関連サービスリンクを表示
   - フッター内リンクの文字サイズ・中央寄せを指定
========================================================= */

.site-footer .widget,
.site-footer .widget p {
  text-align: center;
  font-size: 13px;
  line-height: 1.8;
  color: #7A746C;
}

.site-footer .widget a {
  color: #7A746C;
  text-decoration: none;
}

.site-footer .widget a:hover {
  text-decoration: underline;
}


/* =========================================================
   18. ヘッダーロゴ横コピー
   - ロゴ横に「BtoB編集制作スタジオ」を表示
   - PC・スマホともにロゴ右横へ横並びで表示
   - ロゴ画像サイズもCSS側で調整
========================================================= */

/* 18-1. ロゴエリア全体を横並びにする */
.site-header-logo,
.site-header .navbar-brand {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: none !important;
}

/* 18-2. ロゴリンク内を横並びに固定する */
.site-header-logo a,
.navbar-brand {
  display: inline-flex !important;
  align-items: center !important;
  flex-direction: row !important;
  width: auto !important;
  max-width: none !important;
  text-decoration: none !important;
}

/* 18-3. PC・スマホ共通：ロゴ右横にコピーを表示 */
.site-header-logo a::after,
.navbar-brand::after {
  content: "BtoBコンテンツ制作メディア";
  display: inline-flex !important;
  align-items: center !important;
  margin-left: 16px;
  padding-left: 16px;
  border-left: 1px solid #D8D0C5;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.4;
  color: #55504A;
  white-space: nowrap;
  flex-shrink: 0;
}

/* 18-4. スマホ表示：横並びのままコピーだけ調整 */
@media (max-width: 768px) {
  .site-header-logo,
  .site-header .navbar-brand {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    max-width: none !important;
  }

  .site-header-logo a,
  .navbar-brand {
    display: inline-flex !important;
    align-items: center !important;
    flex-direction: row !important;
    width: auto !important;
    max-width: none !important;
  }

  .site-header-logo a::after,
  .navbar-brand::after {
    display: inline-flex !important;
    margin-left: 10px;
    padding-left: 10px;
    border-left: 1px solid #D8D0C5;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.35;
    white-space: nowrap;
  }
}


/* =========================================================
   20. スマホ版カテゴリーラベル
   - 記事一覧や投稿カードのアイキャッチ上に出るカテゴリー表示を小さくする
   - テキストは省略せず、切れないように表示する
   - 角丸は使わず、写真の上でも読みやすい小さな矩形表示にする
   - Lightning / VK系のカテゴリーラベルを対象にする
========================================================= */

@media (max-width: 768px) {

  /* 20-1. アイキャッチ上のカテゴリーラベル本体を小さくする */
  .vk_post_imgOuter_singleTermLabel,
  .vk_post_imgOuter .vk_post_imgOuter_singleTermLabel,
  .postList_thumbnail .vk_post_imgOuter_singleTermLabel,
  .entry-card .vk_post_imgOuter_singleTermLabel {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    max-width: calc(100% - 16px) !important;
    padding: 3px 7px !important;
    font-size: 10px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;
    border-radius: 0 !important;
  }

  /* 20-2. ラベル内のテキストも切らずに表示する */
  .vk_post_imgOuter_singleTermLabel a,
  .vk_post_imgOuter_singleTermLabel span {
    display: inline !important;
    max-width: none !important;
    color: inherit;
    font-size: 10px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;
  }

  /* 20-3. カテゴリーラベルの背景を少しだけ軽くする */
  .vk_post_imgOuter_singleTermLabel {
    opacity: 0.9;
  }
}

/* =========================================================
   21. 記事内関連サービス案内
   - 個別記事の末尾に置く控えめな関連サービス導線
   - 強い営業CTAではなく、読了後の案内として表示
   - ボタンや外部リンクアイコンはVK Blocksなど既存機能を優先
========================================================= */

.arcx-article-note {
  margin: 58px 0 54px;
  padding: 38px 36px;
  background: #FFFFFF;
  border: 1px solid #E3DBD0;
  border-radius: 20px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.04);
}

/* 21-1. 案内枠内の見出し */
.arcx-article-note h2 {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: none !important;
}

/* 21-2. 案内枠内の本文 */
.arcx-article-note p {
  font-size: 16px;
  line-height: 1.9;
}

/* 21-3. VK Blocksボタンを使う場合の余白調整 */
.arcx-article-note .vk_button {
  margin-top: 24px;
}

.arcx-article-note .vk_button_link {
  text-decoration: none !important;
}


/* 21-6. スマホ表示 */
@media (max-width: 768px) {
  .arcx-article-note {
    margin: 46px 0 42px;
    padding: 30px 22px;
    border-radius: 16px;
  }

  .arcx-article-note p {
    font-size: 15px;
  }

  .arcx-article-note .vk_button {
    margin-top: 20px;
  }
}

/* =========================================================
   22. 参考リンク一覧
   - 記事末尾の参考リンクを見やすく整理
   - 箇条書きの「・」は非表示
   - 「参考」ラベルとリンク本文の間隔を確保
   - 矢印はVK Blocksボタンと同系統のFont Awesomeアイコンを使用
========================================================= */

.single-post .entry-content .arcx-reference-list,
.single-post .entry-body .arcx-reference-list {
  margin: 30px 0 48px !important;
  padding: 0 !important;
  list-style: none !important;
  border: 1px solid #E3DBD0;
  border-radius: 16px;
  background: #FFFFFF;
  overflow: hidden;
}

/* 22-1. 各参考リンクの行 */
.single-post .entry-content .arcx-reference-list li,
.single-post .entry-body .arcx-reference-list li {
  position: relative;
  margin: 0 !important;
  padding: 16px 22px 16px 94px;
  list-style: none !important;
  border-bottom: 1px solid #E8E0D6;
  line-height: 1.75;
}

/* 22-2. 箇条書きマーカーを消す */
.single-post .entry-content .arcx-reference-list li::marker,
.single-post .entry-body .arcx-reference-list li::marker {
  content: "" !important;
  font-size: 0 !important;
}

.single-post .entry-content .arcx-reference-list li:last-child,
.single-post .entry-body .arcx-reference-list li:last-child {
  border-bottom: none;
}

/* 22-3. 「参考」ラベル */
.single-post .entry-content .arcx-reference-list li::before,
.single-post .entry-body .arcx-reference-list li::before {
  content: "参考";
  position: absolute;
  left: 22px;
  top: 18px;
  display: inline-block;
  min-width: 38px;
  padding: 3px 6px;
  background: #F1EAE0;
  color: #1F2A44;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  border-radius: 3px;
}

/* 22-4. リンク本文 */
.single-post .entry-content .arcx-reference-list a,
.single-post .entry-body .arcx-reference-list a {
  color: #1F2A44;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.7;
  text-decoration: none;
}

/* 22-5. 外部リンク風アイコン */
.single-post .entry-content .arcx-reference-list a::after,
.single-post .entry-body .arcx-reference-list a::after {
  content: "\f360";
  display: inline-block;
  margin-left: 8px;
  color: #8A1F2D;
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  text-decoration: none !important;
  vertical-align: 1px;
}

/* 22-6. ホバー表示 */
.single-post .entry-content .arcx-reference-list a:hover,
.single-post .entry-body .arcx-reference-list a:hover {
  color: #8A1F2D;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.single-post .entry-content .arcx-reference-list a:hover::after,
.single-post .entry-body .arcx-reference-list a:hover::after {
  color: #8A1F2D;
}

/* 22-7. スマホ表示 */
@media (max-width: 768px) {
  .single-post .entry-content .arcx-reference-list,
  .single-post .entry-body .arcx-reference-list {
    margin: 26px 0 40px !important;
    border-radius: 12px;
  }

  .single-post .entry-content .arcx-reference-list li,
  .single-post .entry-body .arcx-reference-list li {
    padding: 14px 14px 14px 78px;
  }

  .single-post .entry-content .arcx-reference-list li::before,
  .single-post .entry-body .arcx-reference-list li::before {
    left: 14px;
    top: 17px;
    min-width: 36px;
    font-size: 10px;
  }

  .single-post .entry-content .arcx-reference-list a,
  .single-post .entry-body .arcx-reference-list a {
    font-size: 15px;
  }

  .single-post .entry-content .arcx-reference-list a::after,
  .single-post .entry-body .arcx-reference-list a::after {
    margin-left: 7px;
    font-size: 12px;
  }
}

/* =========================================================
   23. カテゴリー説明文
   - カテゴリーページ上部の説明文を読みやすく整える
   - Lightning標準表示を活かし、装飾は最小限にする
========================================================= */

.archive.category .archive-description,
.archive.category .taxonomy-description,
.archive.category .term-description {
  margin: 0 0 34px;
  padding-bottom: 28px;
  border-bottom: 1px solid #DDD4C8;
}

.archive.category .archive-description p,
.archive.category .taxonomy-description p,
.archive.category .term-description p {
  margin: 0;
  font-size: 17px;
  line-height: 1.9;
  color: #333333;
}

@media (max-width: 768px) {
  .archive.category .archive-description,
  .archive.category .taxonomy-description,
  .archive.category .term-description {
    margin-bottom: 28px;
    padding-bottom: 24px;
  }

  .archive.category .archive-description p,
  .archive.category .taxonomy-description p,
  .archive.category .term-description p {
    font-size: 15px;
    line-height: 1.85;
  }
}
/* =========================================================
   24. スマホメニューのカテゴリー展開
   - スマホ表示で「記事」配下のカテゴリーを最初から表示する
   - Lightning / VK系のサブメニューを開いた状態にする
   - 「↓」などの開閉アイコンは非表示にする
   - PC表示には影響させない
========================================================= */

@media (max-width: 991px) {

  /* 24-1. スマホメニュー内のサブメニューを常時表示 */
  .vk-mobile-nav .menu-item-has-children > .sub-menu,
  .site-header .menu-item-has-children > .sub-menu,
  .global-nav .menu-item-has-children > .sub-menu,
  .navbar-nav .menu-item-has-children > .sub-menu {
    display: block !important;
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    transform: none !important;
  }

  /* 24-2. 子カテゴリーを少し下げて階層が分かるようにする */
  .vk-mobile-nav .sub-menu,
  .site-header .sub-menu,
  .global-nav .sub-menu,
  .navbar-nav .sub-menu {
    margin-top: 6px !important;
    padding-left: 18px !important;
    border-left: 1px solid #DDD4C8;
    background: transparent !important;
  }

  /* 24-3. 子カテゴリーの文字サイズと余白 */
  .vk-mobile-nav .sub-menu a,
  .site-header .sub-menu a,
  .global-nav .sub-menu a,
  .navbar-nav .sub-menu a {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
  }

  /* 24-4. 開閉用の矢印・トグルを非表示 */
  .vk-mobile-nav .menu-item-has-children > button,
  .vk-mobile-nav .menu-item-has-children > .acc-btn,
  .vk-mobile-nav .menu-item-has-children > .sub-menu-toggle,
  .vk-mobile-nav .menu-item-has-children > .submenu-toggle,
  .vk-mobile-nav .menu-item-has-children > .vk-menu-acc,
  .vk-mobile-nav .menu-item-has-children > .vk-menu-acc-btn,
  .site-header .menu-item-has-children > button,
  .site-header .menu-item-has-children > .acc-btn,
  .site-header .menu-item-has-children > .sub-menu-toggle,
  .site-header .menu-item-has-children > .submenu-toggle {
    display: none !important;
  }

  /* 24-5. リンク右側に出る矢印装飾がある場合も非表示 */
  .vk-mobile-nav .menu-item-has-children > a::after,
  .site-header .menu-item-has-children > a::after,
  .global-nav .menu-item-has-children > a::after,
  .navbar-nav .menu-item-has-children > a::after {
    display: none !important;
    content: none !important;
  }
}

/* =========================================================
   25. カテゴリー説明文内の関連カテゴリーリンク
   - カテゴリー説明欄ではp/div/classが削られるため、
     カテゴリー説明文内のaタグをボタン風に表示する
   - カテゴリーページ上部の関連カテゴリー導線に使用
========================================================= */

.category .taxonomy-description a,
.category .archive-description a,
.category .term-description a,
.category .archive-header a {
  display: inline-block;
  margin: 0.4em 0.45em 0 0;
  padding: 0.55em 0.95em;
  border: 1px solid #0b5cad;
  border-radius: 999px;
  background: #FFFFFF;
  color: #0b5cad;
  font-weight: 600;
  text-decoration: none;
  line-height: 1.4;
}

.category .taxonomy-description a::after,
.category .archive-description a::after,
.category .term-description a::after,
.category .archive-header a::after {
  content: " ＞";
}

.category .taxonomy-description a:hover,
.category .archive-description a:hover,
.category .term-description a:hover,
.category .archive-header a:hover {
  background: #0b5cad;
  color: #FFFFFF;
  text-decoration: none;
}

.category .taxonomy-description strong,
.category .archive-description strong,
.category .term-description strong,
.category .archive-header strong {
  display: block;
  margin-top: 1.2em;
  margin-bottom: 0.3em;
  color: #0b2a55;
}


/* =========================================================
   26. 記事本文内の通常リスト共通デザイン
   - 記事本文中の通常の箇条書きを読みやすいボックス型に整える
   - 参考リンク一覧（.arcx-reference-list）は22番で管理するため除外
   - 記事末尾の参考リンク一覧崩れを防ぐ
========================================================= */

.single-post .entry-body ul.wp-block-list:not(.arcx-reference-list),
.single-post .entry-content ul.wp-block-list:not(.arcx-reference-list) {
  margin: 1.2em 0 1.8em;
  padding: 1.1em 1.3em;
  border: 1px solid #dbe5f2;
  border-radius: 10px;
  background: #f7f9fc;
  list-style: none;
}

/* 26-1. 通常リスト各項目の余白と区切り線 */
.single-post .entry-body ul.wp-block-list:not(.arcx-reference-list) li,
.single-post .entry-content ul.wp-block-list:not(.arcx-reference-list) li {
  position: relative;
  margin: 0;
  padding: 0.55em 0 0.55em 1.7em;
  border-bottom: 1px solid #e5edf7;
  line-height: 1.8;
}

/* 26-2. 通常リスト最後の項目だけ区切り線を消す */
.single-post .entry-body ul.wp-block-list:not(.arcx-reference-list) li:last-child,
.single-post .entry-content ul.wp-block-list:not(.arcx-reference-list) li:last-child {
  border-bottom: none;
}

/* 26-3. 通常リストの黒丸を小さな矢印風マークに変更 */
.single-post .entry-body ul.wp-block-list:not(.arcx-reference-list) li::before,
.single-post .entry-content ul.wp-block-list:not(.arcx-reference-list) li::before {
  content: "›";
  position: absolute;
  left: 0.2em;
  top: 0.55em;
  color: #0b5cad;
  font-weight: 700;
}

/* 26-4. 通常リスト内リンクの見た目調整 */
.single-post .entry-body ul.wp-block-list:not(.arcx-reference-list) li a,
.single-post .entry-content ul.wp-block-list:not(.arcx-reference-list) li a {
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 26-5. 番号付き手順リスト共通デザイン
   - 順番が意味を持つリストに使う
   - 通常リストと余白・行間をそろえ、番号は残す */
.single-post .entry-body ol.wp-block-list.arcx-step-list,
.single-post .entry-content ol.wp-block-list.arcx-step-list {
  margin: 1.2em 0 1.8em;
  padding: 1.1em 1.3em 1.1em 3.1em;
  border: 1px solid #dbe5f2;
  border-radius: 10px;
  background: #ffffff;
  list-style: decimal;
}

.single-post .entry-body ol.wp-block-list.arcx-step-list li,
.single-post .entry-content ol.wp-block-list.arcx-step-list li {
  margin: 0;
  padding: 0.55em 0;
  border-bottom: 1px solid #e5edf7;
  line-height: 1.8;
}

.single-post .entry-body ol.wp-block-list.arcx-step-list li:last-child,
.single-post .entry-content ol.wp-block-list.arcx-step-list li:last-child {
  border-bottom: none;
}

.single-post .entry-body ol.wp-block-list.arcx-step-list li::marker,
.single-post .entry-content ol.wp-block-list.arcx-step-list li::marker {
  color: #0b2a55;
  font-weight: 700;
}

/* 26-6. 記事内メモ枠・チェック枠の背景色統一
   - 記事本文内の補足カードやチェック枠は白背景にする
   - 過去記事に残るインラインの薄青背景も白へ上書きする */
.single-post .entry-body .wp-block-group[style*="background:#f8fbff"],
.single-post .entry-content .wp-block-group[style*="background:#f8fbff"],
.single-post .entry-body .wp-block-group[style*="background: #f8fbff"],
.single-post .entry-content .wp-block-group[style*="background: #f8fbff"] {
  background: #ffffff !important;
}

/* =========================================================
   27. 関連サービス・運営会社カード内ロゴ
   - 関連サービスカードの見出し上にロゴ画像を配置する
   - ビズログの丸アイコン、アークタンジェントの横長ロゴに対応
========================================================= */

.arcx-service-logo {
  margin: 0 0 18px;
}

.arcx-service-logo img {
  display: block;
  width: auto;
  height: auto;
  object-fit: contain;
}

/* 27-1. ビズログの丸アイコン */
.arcx-service-logo-bzlog img {
  max-width: 72px;
  max-height: 72px;
}

/* 27-2. アークタンジェントの横長ロゴ */
.arcx-service-logo-arctangent img {
  max-width: 210px;
  max-height: 72px;
}

.arcx-service-card h3.wp-block-heading {
  margin-top: 0;
}

@media (max-width: 768px) {
  .arcx-service-logo-bzlog img {
    max-width: 64px;
    max-height: 64px;
  }

  .arcx-service-logo-arctangent img {
    max-width: 190px;
    max-height: 64px;
  }
}


/* 101-107. Migrated from Code Snippets ID 7 */

/* 101. ヘッダーナビ位置 */
.site-header-logo a::after,
.navbar-brand::after {
	content: "BtoBコンテンツ制作メディア" !important;
}

@media (min-width: 992px) {
	body.header_scrolled #global-nav,
	body.scrolled #global-nav {
		margin-left: auto !important;
		margin-right: 0 !important;
	}
}

/* 102. 横スクロール抑制・フッター前ロゴ */
html,
body {
	overflow-x: hidden;
}

.site-body-bottom {
	border-top: 1px solid #1f2a44;
}

.site-body-bottom #block-2 {
	border-top: 0 !important;
}

.arcx-footer-site-links {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	max-width: 1140px;
	margin: 0 auto;
	padding: 18px 15px 16px;
}

.arcx-footer-site-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 190px;
	height: 58px;
	padding: 8px 18px;
	border: 1px solid #d9e2ef;
	border-radius: 8px;
	background: #ffffff;
	box-shadow: 0 10px 26px rgba(20, 36, 64, 0.06);
}

.arcx-footer-site-link img {
	display: block;
	width: auto;
	height: auto;
	max-width: 150px;
	max-height: 38px;
	object-fit: contain;
}

.arcx-footer-site-link-bzlog img {
	max-width: 158px;
	max-height: 42px;
}

.arcx-footer-site-link-zukai img {
	max-width: 156px;
	max-height: 38px;
}

.arcx-footer-site-link-arctangent img {
	max-width: 132px;
	max-height: 40px;
}

.arcx-footer-operator {
	max-width: 1140px;
	margin: -4px auto 0;
	padding: 0 15px 18px;
	text-align: center;
	font-size: 13px;
	line-height: 1.7;
}

.arcx-footer-operator a {
	color: #1f2a44;
	text-decoration: none;
}

.arcx-footer-operator a:hover,
.arcx-footer-operator a:focus-visible {
	color: #8a1f2d;
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 768px) {
	.arcx-footer-site-links {
		flex-direction: column;
		gap: 10px;
	}

	.arcx-footer-site-link {
		width: min(260px, 100%);
	}
}

/* 105. 記事本文・運営元・関連記事 */
.single-post .entry-body ul.wp-block-list:not(.arcx-reference-list),
.single-post .entry-content ul.wp-block-list:not(.arcx-reference-list) {
	background-color: #ffffff !important;
}

.arcx-about-page .arcx-about-button .wp-block-button__link,
.arcx-about-page .arcx-about-button .wp-block-button__link:visited {
	color: #ffffff !important;
	background: #1f2a44 !important;
	text-decoration: none !important;
}

.arcx-about-page .arcx-about-button .wp-block-button__link:hover,
.arcx-about-page .arcx-about-button .wp-block-button__link:focus-visible {
	color: #ffffff !important;
	background: #8a1f2d !important;
}
.single-post .veu_relatedPosts.veu_contentAddSection {
			margin: 64px 0 36px;
			padding: 34px 0 0;
			border-top: 1px solid #d9d2c5;
		}

		.single-post .veu_relatedPosts .relatedPosts_title {
			display: flex;
			align-items: center;
			gap: 16px;
			margin: 0 0 24px;
			padding: 0;
			border: 0;
			color: #061f48;
			font-size: 28px;
			font-weight: 800;
			line-height: 1.35;
			letter-spacing: 0;
		}

		.single-post .veu_relatedPosts .relatedPosts_title::after {
			content: "";
			flex: 1 1 auto;
			height: 1px;
			background: linear-gradient(90deg, #1f2a44 0, #d9d2c5 62%, transparent 100%);
			opacity: .72;
		}

		.single-post .veu_relatedPosts .row {
			display: grid;
			grid-template-columns: repeat(2, minmax(0, 1fr));
			gap: 18px 22px;
			margin: 0 !important;
		}

		.single-post .veu_relatedPosts .relatedPosts_item {
			float: none !important;
			width: auto !important;
			max-width: none !important;
			padding: 0 !important;
			border: 0 !important;
		}

		.single-post .veu_relatedPosts .relatedPosts_item .media {
			display: grid;
			grid-template-columns: 176px minmax(0, 1fr);
			gap: 16px;
			align-items: center;
			height: 100%;
			margin: 0;
			padding: 14px;
			background: #ffffff;
			border: 1px solid #e2d8ca;
			border-radius: 14px;
			box-shadow: 0 14px 34px rgba(24, 35, 56, .055);
			transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
		}

		.single-post .veu_relatedPosts .relatedPosts_item .media:hover {
			transform: translateY(-2px);
			border-color: #cdbfae;
			box-shadow: 0 18px 42px rgba(24, 35, 56, .09);
		}

		.single-post .veu_relatedPosts .postList_thumbnail,
		.single-post .veu_relatedPosts .media-left {
			display: block;
			padding: 0 !important;
			width: 176px;
		}

		.single-post .veu_relatedPosts .postList_thumbnail a {
			display: block;
			position: relative;
			overflow: hidden;
			width: 176px;
			aspect-ratio: 16 / 9;
			border-radius: 10px;
			background: #eef4fb;
			border: 1px solid #e7edf4;
		}

		.single-post .veu_relatedPosts .postList_thumbnail img {
			display: block;
			width: 100% !important;
			height: 100% !important;
			max-width: none !important;
			object-fit: contain;
			object-position: center;
			border: 0 !important;
			border-radius: 0 !important;
		}

		.single-post .veu_relatedPosts .media-body {
			display: flex;
			min-width: 0;
			min-height: 100px;
			flex-direction: column;
			justify-content: center;
		}

		.single-post .veu_relatedPosts .media-heading {
			margin: 0;
			font-size: 16px;
			font-weight: 800;
			line-height: 1.65;
			letter-spacing: 0;
		}

		.single-post .veu_relatedPosts .media-heading a,
		.single-post .veu_relatedPosts .media-heading a:visited {
			color: #061f48 !important;
			text-decoration: none !important;
			border: 0 !important;
			background-image: none !important;
		}

		.single-post .veu_relatedPosts .media-heading a:hover,
		.single-post .veu_relatedPosts .media-heading a:focus-visible {
			color: #8a1f2d !important;
			text-decoration: underline !important;
			text-decoration-thickness: 1px;
			text-underline-offset: 4px;
		}

		.single-post .veu_relatedPosts .media-date {
			display: inline-flex;
			align-items: center;
			gap: 7px;
			margin-top: 10px;
			color: #746b60;
			font-size: 13px;
			line-height: 1.4;
		}

		.single-post .veu_relatedPosts .media-date i {
			color: #9b7a55;
			font-size: 13px;
		}

/* 106. 記事画像・記事一覧画像 */
.single-post .entry-body figure.wp-block-image,
.single-post .entry-content figure.wp-block-image {
	overflow: visible !important;
}

.single-post .entry-body figure.wp-block-image img,
.single-post .entry-content figure.wp-block-image img,
.single-post .entry-body .wp-block-image img,
.single-post .entry-content .wp-block-image img {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	aspect-ratio: auto !important;
	object-fit: contain !important;
	object-position: center center !important;
}

.single-post .veu_relatedPosts .postList_thumbnail,
.single-post .veu_relatedPosts .media-left,
.single-post .veu_relatedPosts .postList_thumbnail a {
	overflow: visible !important;
}

.single-post .veu_relatedPosts .postList_thumbnail a {
	height: auto !important;
	aspect-ratio: auto !important;
}

.single-post .veu_relatedPosts .postList_thumbnail img,
.single-post .veu_relatedPosts .media-left img {
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	aspect-ratio: auto !important;
	object-fit: contain !important;
	object-position: center center !important;
}

.blog .vk_post_imgOuter,
.archive .vk_post_imgOuter,
.page .vk_post_imgOuter,
.single-post .vk_post_imgOuter {
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-color: #ffffff !important;
	aspect-ratio: 16 / 9 !important;
	height: auto !important;
	overflow: hidden !important;
}

.blog .vk_post_imgOuter a,
.archive .vk_post_imgOuter a,
.page .vk_post_imgOuter a,
.single-post .vk_post_imgOuter a {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: 16 / 9 !important;
}

/* 106.1 スマホ関連記事カード */
@media (max-width: 767px) {
	.single-post .veu_relatedPosts.veu_contentAddSection {
		margin-top: 44px !important;
		padding-top: 24px !important;
	}

	.single-post .veu_relatedPosts .relatedPosts_title {
		display: flex !important;
		align-items: center !important;
		gap: 14px !important;
		margin: 0 0 18px !important;
		color: #061f48 !important;
		font-size: 25px !important;
		line-height: 1.25 !important;
		letter-spacing: 0 !important;
	}

	.single-post .veu_relatedPosts .relatedPosts_title::after {
		content: "" !important;
		flex: 1 1 auto !important;
		height: 1px !important;
		background: #cfc6b8 !important;
	}

	.single-post .veu_relatedPosts .row {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 12px !important;
		margin-right: 0 !important;
		margin-left: 0 !important;
	}

	.single-post .veu_relatedPosts .relatedPosts_item {
		width: 100% !important;
		max-width: none !important;
		padding-right: 0 !important;
		padding-left: 0 !important;
	}

	.single-post .veu_relatedPosts .relatedPosts_item .media {
		display: grid !important;
		grid-template-columns: 112px minmax(0, 1fr) !important;
		align-items: center !important;
		gap: 14px !important;
		min-height: 108px !important;
		margin: 0 !important;
		padding: 12px !important;
		border: 1px solid #e0d5c6 !important;
		border-radius: 14px !important;
		background: #ffffff !important;
		box-shadow: 0 10px 26px rgba(24, 35, 56, 0.055) !important;
	}

	.single-post .veu_relatedPosts .postList_thumbnail,
	.single-post .veu_relatedPosts .media-left {
		display: block !important;
		width: 112px !important;
		min-width: 112px !important;
		padding: 0 !important;
		overflow: hidden !important;
	}

	.single-post .veu_relatedPosts .postList_thumbnail a {
		display: block !important;
		width: 112px !important;
		height: auto !important;
		margin: 0 !important;
		aspect-ratio: 16 / 9 !important;
		overflow: hidden !important;
		border: 1px solid #e7edf4 !important;
		border-radius: 8px !important;
		background: #f7f9fc !important;
	}

	.single-post .veu_relatedPosts .postList_thumbnail img,
	.single-post .veu_relatedPosts .media-left img {
		display: block !important;
		width: 100% !important;
		height: 100% !important;
		max-width: none !important;
		aspect-ratio: 16 / 9 !important;
		object-fit: cover !important;
		object-position: center center !important;
	}

	.single-post .veu_relatedPosts .media-body {
		display: flex !important;
		min-width: 0 !important;
		min-height: 0 !important;
		flex-direction: column !important;
		justify-content: center !important;
	}

	.single-post .veu_relatedPosts .media-heading {
		margin: 0 !important;
		color: #061f48 !important;
		font-size: 15px !important;
		font-weight: 800 !important;
		line-height: 1.48 !important;
		letter-spacing: 0 !important;
	}

	.single-post .veu_relatedPosts .media-heading a,
	.single-post .veu_relatedPosts .media-heading a:visited {
		display: -webkit-box !important;
		overflow: hidden !important;
		color: #061f48 !important;
		text-decoration: none !important;
		-webkit-box-orient: vertical !important;
		-webkit-line-clamp: 3 !important;
	}

	.single-post .veu_relatedPosts .media-date {
		display: inline-flex !important;
		align-items: center !important;
		gap: 7px !important;
		margin-top: 8px !important;
		color: #756b60 !important;
		font-size: 12.5px !important;
		line-height: 1.35 !important;
	}

	.single-post .veu_relatedPosts .media-date i {
		color: #9b7a55 !important;
		font-size: 12px !important;
	}
}

/* 107. スマホ固定ヘッダー・メニュー */
.arcx-mobile-drawer-nav {
	display: none;
}

@media (max-width: 991px) {
	body {
		padding-top: 58px !important;
	}

	body.admin-bar {
		padding-top: calc(58px + var(--wp-admin--admin-bar--height, 32px)) !important;
	}

	body .site-header {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		z-index: 10010 !important;
		min-height: 58px !important;
		background-color: #ffffff !important;
		border-bottom: 1px solid #e6ded2 !important;
		box-shadow: 0 6px 18px rgba(31, 42, 68, 0.08) !important;
	}

	body.admin-bar .site-header {
		top: var(--wp-admin--admin-bar--height, 32px) !important;
	}

	body .site-header-container {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		min-height: 58px !important;
		width: 100% !important;
		max-width: none !important;
		padding: 0 14px !important;
		box-sizing: border-box !important;
	}

	body .site-header .site-header-logo,
	body .site-header .site-header-logo a,
	body .site-header .navbar-brand,
	body .site-header .navbar-brand a {
		display: inline-flex !important;
		align-items: center !important;
		min-width: 0 !important;
		max-width: calc(100vw - 78px) !important;
		margin: 0 !important;
		overflow: hidden !important;
	}

	body .site-header .site-header-logo img,
	body .site-header .site-header-logo a img,
	body .site-header .navbar-brand img,
	body .site-header .navbar-brand a img {
		width: auto !important;
		object-fit: contain !important;
	}

	body .site-header .site-header-logo a::after,
	body .site-header .navbar-brand::after {
		display: none !important;
		content: none !important;
	}

	#vk-mobile-nav-menu-btn {
		position: fixed !important;
		top: 7px !important;
		right: 12px !important;
		left: auto !important;
		z-index: 10020 !important;
		width: 44px !important;
		height: 44px !important;
		min-width: 44px !important;
		min-height: 44px !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 1px solid rgba(255, 255, 255, 0.72) !important;
		border-radius: 3px !important;
		background-color: #a2152d !important;
		background-image: none !important;
		box-shadow: none !important;
		text-indent: -9999px !important;
		overflow: hidden !important;
		transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease !important;
	}

	body.admin-bar #vk-mobile-nav-menu-btn {
		top: calc(var(--wp-admin--admin-bar--height, 32px) + 7px) !important;
	}

	#vk-mobile-nav-menu-btn::before,
	#vk-mobile-nav-menu-btn::after {
		content: "" !important;
		position: absolute !important;
		left: 11px !important;
		right: 11px !important;
		height: 2px !important;
		border-radius: 999px !important;
		background-color: #ffffff !important;
		transition: transform 0.18s ease, top 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease !important;
	}

	#vk-mobile-nav-menu-btn::before {
		top: 15px !important;
		box-shadow: 0 6px 0 #ffffff !important;
	}

	#vk-mobile-nav-menu-btn::after {
		top: 27px !important;
	}

	#vk-mobile-nav-menu-btn:hover,
	#vk-mobile-nav-menu-btn:focus-visible {
		transform: translateY(-1px) !important;
		border-color: rgba(255, 255, 255, 0.9) !important;
		box-shadow: none !important;
	}

	#vk-mobile-nav-menu-btn.menu-open {
		border-color: rgba(255, 255, 255, 0.9) !important;
		background-color: #a2152d !important;
		background-image: none !important;
	}

	#vk-mobile-nav-menu-btn.menu-open::before {
		top: 21px !important;
		box-shadow: none !important;
		background-color: #ffffff !important;
		transform: rotate(45deg) !important;
	}

	#vk-mobile-nav-menu-btn.menu-open::after {
		top: 21px !important;
		background-color: #ffffff !important;
		transform: rotate(-45deg) !important;
	}

	#vk-mobile-nav.vk-mobile-nav {
		position: fixed !important;
		top: 58px !important;
		left: 12px !important;
		right: 12px !important;
		z-index: 10015 !important;
		width: auto !important;
		height: auto !important;
		max-height: calc(100dvh - 76px) !important;
		padding: 10px !important;
		overflow-y: auto !important;
		overflow-x: hidden !important;
		border: 1px solid #e3dbd0 !important;
		border-radius: 16px !important;
		background-color: #ffffff !important;
		box-shadow: 0 18px 44px rgba(31, 42, 68, 0.16) !important;
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
		transform: translateY(-12px) !important;
		transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease !important;
	}

	#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open,
	div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open,
	div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open.vk-mobile-nav-drop-in,
	body div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open {
		top: 58px !important;
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important;
		transform: translateY(0) !important;
	}

	#vk-mobile-nav .vk-mobile-nav-menu-outer {
		margin: 0 !important;
	}

	#vk-mobile-nav nav > ul,
	#vk-mobile-nav nav ul {
		border: 0 !important;
	}

	#vk-mobile-nav nav ul li {
		line-height: 1.5 !important;
		margin: 0 !important;
	}

	#vk-mobile-nav nav ul li a {
		display: flex !important;
		align-items: center !important;
		min-height: 46px !important;
		padding: 12px 14px !important;
		border: 0 !important;
		border-radius: 10px !important;
		color: #1f2a44 !important;
		font-weight: 700 !important;
		text-decoration: none !important;
		letter-spacing: 0 !important;
	}

	#vk-mobile-nav nav ul li a:hover,
	#vk-mobile-nav nav ul li a:focus-visible,
	#vk-mobile-nav nav ul li.current-menu-item > a,
	#vk-mobile-nav nav ul li.current_page_item > a {
		background-color: #f4f0e9 !important;
		color: #9f2031 !important;
	}

	#vk-mobile-nav nav ul.sub-menu {
		margin: 4px 0 8px !important;
		padding: 6px !important;
		border-radius: 12px !important;
		background-color: #f8f6f1 !important;
	}

	#vk-mobile-nav nav ul.sub-menu li a {
		min-height: 40px !important;
		padding: 10px 12px !important;
		font-size: 14px !important;
		font-weight: 700 !important;
	}

	#vk-mobile-nav .vk-menu-acc .acc-btn {
		top: 9px !important;
		right: 10px !important;
		width: 30px !important;
		height: 30px !important;
		border: 1px solid rgba(31, 42, 68, 0.18) !important;
		border-radius: 9px !important;
		background-color: #ffffff !important;
		background-size: 18px 18px !important;
	}

	#vk-mobile-nav.has-arcx-drawer-nav {
		left: 0 !important;
		right: 0 !important;
		width: 100vw !important;
		padding: 8px 8px 14px !important;
		border-color: #d6e1ef !important;
		border-right: 0 !important;
		border-left: 0 !important;
		border-radius: 0 !important;
		background: #f5f8fc !important;
		box-shadow: 0 18px 42px rgba(31, 42, 68, 0.16) !important;
		box-sizing: border-box !important;
	}

	#vk-mobile-nav.has-arcx-drawer-nav .vk-mobile-nav-menu-outer {
		display: none !important;
	}

	#vk-mobile-nav .arcx-mobile-drawer-nav {
		display: block;
	}

	.arcx-mobile-drawer-nav__groups {
		overflow: hidden;
		border: 1px solid #cbd9ea;
		border-radius: 7px;
		background: #ffffff;
	}

	.arcx-mobile-drawer-nav__home {
		display: flex;
		align-items: center;
		min-height: 58px;
		padding: 14px 16px;
		border-bottom: 1px solid #d8e3f1;
		color: #061f48 !important;
		font-size: 17px;
		font-weight: 800;
		line-height: 1.35;
		text-decoration: none !important;
	}

	.arcx-mobile-drawer-nav__group {
		margin: 0;
		border-bottom: 1px solid #d8e3f1;
		background: #ffffff;
	}

	.arcx-mobile-drawer-nav__group:last-child {
		border-bottom: 0;
	}

	.arcx-mobile-drawer-nav__summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 14px;
		min-height: 58px;
		padding: 14px 16px;
		color: #061f48;
		cursor: pointer;
		font-size: 17px;
		font-weight: 800;
		line-height: 1.35;
		list-style: none;
	}

	.arcx-mobile-drawer-nav__summary::-webkit-details-marker {
		display: none;
	}

	.arcx-mobile-drawer-nav__summary::after {
		content: "+";
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 28px;
		width: 28px;
		height: 28px;
		border: 1px solid #b8cbe2;
		border-radius: 999px;
		color: #0a3d82;
		background: #ffffff;
		font-size: 23px;
		font-weight: 700;
		line-height: 1;
	}

	.arcx-mobile-drawer-nav__group[open] > .arcx-mobile-drawer-nav__summary {
		background: #eef4fb;
	}

	.arcx-mobile-drawer-nav__group[open] > .arcx-mobile-drawer-nav__summary::after {
		content: "-";
		font-size: 24px;
	}

	.arcx-mobile-drawer-nav__panel {
		padding: 16px;
		border-top: 1px solid #d8e3f1;
		background: #f5f8fc;
	}

	.arcx-mobile-drawer-nav__lead {
		margin: 0 0 14px;
		color: #4d607d;
		font-size: 14px;
		font-weight: 500;
		line-height: 1.75;
	}

	.arcx-mobile-drawer-nav__archive-link {
		display: flex;
		align-items: center;
		min-height: 36px;
		margin: 0 0 8px;
		padding: 8px 10px;
		border: 1px solid #cfdeef;
		border-radius: 7px;
		background: #ffffff;
		color: #0a3d82 !important;
		font-size: 12.5px;
		font-weight: 800;
		line-height: 1.4;
		text-decoration: none !important;
	}

	.arcx-mobile-drawer-nav__category-grid,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__category-list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.arcx-mobile-drawer-nav__category-grid a,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__category-list a,
	.arcx-mobile-drawer-nav__post-page a,
	.arcx-mobile-drawer-nav__latest-list a,
	.arcx-mobile-drawer-nav__category-posts a {
		display: block;
		min-width: 0;
		border: 1px solid #cfdeef;
		border-radius: 7px;
		background: #ffffff;
		color: #061f48 !important;
		font-size: 14px;
		font-weight: 800;
		line-height: 1.45;
		text-decoration: none !important;
	}

	.arcx-mobile-drawer-nav__category-grid a,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__category-list a {
		min-height: 58px;
		padding: 11px 12px;
	}

	.arcx-mobile-drawer-nav__post-page,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__post-page,
	.arcx-mobile-drawer-nav__latest-list,
	.arcx-mobile-drawer-nav__category-posts {
		display: grid;
		gap: 6px;
		color: #4d607d;
		font-size: 12px;
		line-height: 1.55;
	}

	.arcx-mobile-drawer-nav__post-page[hidden],
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__post-page[hidden] {
		display: none !important;
	}

	.arcx-mobile-drawer-nav__post-page a,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__post-page a,
	.arcx-mobile-drawer-nav__latest-list a,
	.arcx-mobile-drawer-nav__category-posts a {
		padding: 8px 10px;
		font-size: 12.5px;
		font-weight: 700;
		line-height: 1.5;
	}

	.arcx-mobile-drawer-nav__category-grid a:hover,
	.arcx-mobile-drawer-nav__category-grid a:focus-visible,
	.arcx-mobile-drawer-nav__archive-link:hover,
	.arcx-mobile-drawer-nav__archive-link:focus-visible,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__category-list a:hover,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__category-list a:focus-visible,
	.arcx-mobile-drawer-nav__post-page a:hover,
	.arcx-mobile-drawer-nav__post-page a:focus-visible,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__post-page a:hover,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__post-page a:focus-visible,
	.arcx-mobile-drawer-nav__latest-list a:hover,
	.arcx-mobile-drawer-nav__latest-list a:focus-visible,
	.arcx-mobile-drawer-nav__category-posts a:hover,
	.arcx-mobile-drawer-nav__category-posts a:focus-visible,
	.arcx-mobile-drawer-nav__category-grid a[aria-current="true"],
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__category-list a[aria-current="true"],
	.arcx-mobile-drawer-nav__post-page a[aria-current="page"],
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__post-page a[aria-current="page"] {
		border-color: #b8cbe2;
		background: #eef4fb;
		color: #8a1f2d !important;
	}

	.arcx-mobile-drawer-nav__pager,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__pager {
		display: flex;
		align-items: center;
		gap: 10px;
		margin-top: 12px;
	}

	.arcx-mobile-drawer-nav__pager button,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__pager button {
		appearance: none;
		min-height: 40px;
		padding: 8px 13px;
		border: 1px solid #cfdeef;
		border-radius: 7px;
		background: #ffffff;
		color: #8a1f2d;
		cursor: pointer;
		font: inherit;
		font-size: 14px;
		font-weight: 800;
		line-height: 1.3;
	}

	.arcx-mobile-drawer-nav__pager-status,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__pager-status {
		color: #5f6f86;
		font-size: 13px;
		font-weight: 800;
	}

	.arcx-mobile-drawer-nav__logo-links,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__logo-links {
		display: grid;
		gap: 8px;
	}

	.arcx-mobile-drawer-nav__logo-links a,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__logo-links a {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 58px;
		padding: 10px;
		border: 1px solid #cfdeef;
		border-radius: 7px;
		background: #ffffff;
	}

	.arcx-mobile-drawer-nav__logo-links img,
	.arcx-mobile-drawer-nav .arcx-mobile-bottom-nav__logo-links img {
		display: block;
		width: auto;
		height: auto;
		max-width: 188px;
		max-height: 40px;
		object-fit: contain;
	}

}

@media (max-width: 480px) {
	body {
		padding-top: 56px !important;
	}

	body.admin-bar {
		padding-top: calc(56px + var(--wp-admin--admin-bar--height, 46px)) !important;
	}

	body .site-header,
	body .site-header-container {
		min-height: 56px !important;
	}

	#vk-mobile-nav-menu-btn {
		top: 6px !important;
	}

	body.admin-bar #vk-mobile-nav-menu-btn {
		top: calc(var(--wp-admin--admin-bar--height, 46px) + 6px) !important;
	}

	#vk-mobile-nav.vk-mobile-nav,
	#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open,
	div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open,
	div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open.vk-mobile-nav-drop-in,
	body div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open {
		top: 56px !important;
		left: 10px !important;
		right: 10px !important;
		max-height: calc(100dvh - 70px) !important;
	}

	#vk-mobile-nav.vk-mobile-nav.has-arcx-drawer-nav,
	#vk-mobile-nav.vk-mobile-nav.has-arcx-drawer-nav.vk-mobile-nav-open,
	div#vk-mobile-nav.vk-mobile-nav.has-arcx-drawer-nav.vk-mobile-nav-open,
	div#vk-mobile-nav.vk-mobile-nav.has-arcx-drawer-nav.vk-mobile-nav-open.vk-mobile-nav-drop-in,
	body div#vk-mobile-nav.vk-mobile-nav.has-arcx-drawer-nav.vk-mobile-nav-open,
	body div#vk-mobile-nav.vk-mobile-nav.has-arcx-drawer-nav.vk-mobile-nav-open.vk-mobile-nav-drop-in {
		left: 0 !important;
		right: 0 !important;
		width: 100vw !important;
	}
}

@media (max-width: 991px) and (min-width: 783px) {
	body.admin-bar #vk-mobile-nav.vk-mobile-nav,
	body.admin-bar #vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open,
	body.admin-bar div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open,
	body.admin-bar div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open.vk-mobile-nav-drop-in {
		top: 90px !important;
		max-height: calc(100dvh - 108px) !important;
	}
}

@media (max-width: 782px) {
	body.admin-bar #vk-mobile-nav.vk-mobile-nav,
	body.admin-bar #vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open,
	body.admin-bar div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open,
	body.admin-bar div#vk-mobile-nav.vk-mobile-nav.vk-mobile-nav-open.vk-mobile-nav-drop-in {
		top: 102px !important;
		max-height: calc(100dvh - 116px) !important;
	}
}

/* 108. ログイン中プレビューの管理バー重なり回避 */
@media (max-width: 782px) {
	html #wpadminbar {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		z-index: 100000 !important;
	}

	body.admin-bar {
		padding-top: calc(58px + var(--wp-admin--admin-bar--height, 46px)) !important;
	}

	body.admin-bar .site-header {
		position: fixed !important;
		top: var(--wp-admin--admin-bar--height, 46px) !important;
		left: 0 !important;
		right: 0 !important;
		z-index: 10010 !important;
	}

	body.admin-bar #vk-mobile-nav-menu-btn {
		position: fixed !important;
		top: calc(var(--wp-admin--admin-bar--height, 46px) + 7px) !important;
	}
}

@media (max-width: 480px) {
	body.admin-bar {
		padding-top: calc(56px + var(--wp-admin--admin-bar--height, 46px)) !important;
	}

	body.admin-bar #vk-mobile-nav-menu-btn {
		top: calc(var(--wp-admin--admin-bar--height, 46px) + 6px) !important;
	}
}


/* =========================================================
   201. 記事・カテゴリナビ
   - Code Snippets ID 8から移行
   - PCサイドカラム、ページャー表示
========================================================= */
/* 201. 記事・カテゴリナビ 共通表示制御 */
.arcx-article-sidebar-nav {
	display: none;
}

.arcx-article-sidebar-nav__post-page[hidden],
.arcx-article-sidebar-nav__pager button[hidden] {
	display: none !important;
}

.arcx-mobile-bottom-nav {
	display: none !important;
}

@media (min-width: 1200px) {
	/* 202. PC本文・サイドカラム配置 */
	.single-post .site-body-container,
	.category .site-body-container,
	.blog .site-body-container {
		display: grid;
		grid-template-columns: minmax(0, 820px) 280px;
		gap: 40px;
		align-items: start;
		max-width: 1180px;
	}

	.single-post .main-section,
	.category .main-section,
	.blog .main-section {
		width: 100% !important;
		max-width: 820px !important;
		margin: 0 !important;
	}

	/* 203. PCサイドナビ本体 */
	.arcx-article-sidebar-nav {
		display: block;
		position: static !important;
		z-index: 20;
		max-height: none;
		padding: 20px 18px;
		border: 1px solid #e2d8ca;
		border-radius: 8px;
		background: #ffffff;
		box-shadow: 0 14px 34px rgba(20, 36, 64, 0.08);
		font-size: 13px;
		line-height: 1.65;
		overflow: visible;
	}

	.arcx-article-sidebar-nav__title {
		margin: 0 0 12px;
		padding-bottom: 10px;
		border-bottom: 1px solid #e6ded2;
		color: #1f2a44;
		font-size: 15px;
		font-weight: 700;
	}

	.arcx-article-sidebar-nav__title::before {
		content: "";
		display: inline-block;
		width: 8px;
		height: 8px;
		margin-right: 8px;
		border-radius: 999px;
		background: #8a1f2d;
		vertical-align: 0.08em;
	}

	.arcx-article-sidebar-nav__section {
		margin-top: 16px;
	}

	.arcx-article-sidebar-nav__label {
		display: flex;
		align-items: center;
		gap: 8px;
		margin: 0 0 8px;
		padding-top: 2px;
		color: #8a1f2d;
		font-size: 12px;
		font-weight: 700;
	}

	.arcx-article-sidebar-nav__label::after {
		content: "";
		flex: 1;
		height: 1px;
		background: #e6ded2;
	}

	.arcx-article-sidebar-nav a {
		display: block;
		border-radius: 6px;
		padding: 8px 9px;
		color: #333333;
		text-decoration: none;
		transition: background-color 0.15s ease, color 0.15s ease;
	}

	.arcx-article-sidebar-nav a:hover,
	.arcx-article-sidebar-nav a:focus-visible {
		color: #8a1f2d;
		background: #f7f3ec;
		text-decoration: none;
	}

	.arcx-article-sidebar-nav a[aria-current="page"],
	.arcx-article-sidebar-nav a[aria-current="true"] {
		color: #8a1f2d;
		background: #f7f3ec;
		font-weight: 700;
	}

	.arcx-article-sidebar-nav__post-list a {
		margin-top: 2px;
		padding-top: 9px;
		padding-bottom: 9px;
		border-top: 1px solid #f0e8dc;
	}

	/* 204. PCサイドナビページャー */
	.arcx-article-sidebar-nav__pager {
		display: flex;
		align-items: center;
		gap: 8px;
		margin-top: 10px;
	}

	.arcx-article-sidebar-nav__pager button {
		appearance: none;
		border: 1px solid #e6ded2;
		border-radius: 6px;
		background: #ffffff;
		color: #8a1f2d;
		cursor: pointer;
		font: inherit;
		font-weight: 700;
		line-height: 1.4;
		padding: 7px 10px;
	}

.arcx-article-sidebar-nav__pager button:hover,
.arcx-article-sidebar-nav__pager button:focus-visible {
		background: #f7f3ec;
	}

	.arcx-article-sidebar-nav__pager-status {
		color: #7a746c;
		font-size: 12px;
		font-weight: 700;
		line-height: 1.4;
		padding: 7px 2px;
	}

	/* 205. PCサイドナビ関連ロゴ */
	.arcx-article-sidebar-nav__logos {
		margin-top: 18px;
		padding-top: 16px;
		border-top: 1px solid #e6ded2;
	}

	.arcx-article-sidebar-nav__logo-links {
		display: grid;
		gap: 8px;
	}

	.arcx-article-sidebar-nav__logo-links a {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 48px;
		padding: 8px 10px;
		border: 1px solid #d9e2ef;
		border-radius: 8px;
		background: #ffffff;
	}

	.arcx-article-sidebar-nav__logo-links img {
		display: block;
		width: auto;
		height: auto;
		max-width: 150px;
		max-height: 34px;
		object-fit: contain;
	}

	.arcx-article-sidebar-nav__logo-bzlog img {
		max-height: 36px;
	}

	.arcx-article-sidebar-nav__logo-zukai img {
		max-width: 158px;
		max-height: 34px;
	}

	.arcx-article-sidebar-nav__logo-arctangent img {
		max-width: 130px;
		max-height: 38px;
	}

	/* 206. PCサイドナビ追従安定化 */
	.single-post .site-body,
	.category .site-body,
	.blog .site-body,
	.single-post .site-body-container,
	.category .site-body-container,
	.blog .site-body-container {
		overflow: visible !important;
	}

	.arcx-article-sidebar-nav.is-fixed-following {
		position: fixed !important;
		top: 118px;
		width: 280px;
		z-index: 50;
	}
}