.elementor-46111 .elementor-element.elementor-element-ce4d44c{--display:flex;}/* Start custom CSS for html, class: .elementor-element-cebe196 *//* =========================================
     ベーススタイル
  ========================================= */
  #mm-area-guide-v4 {
    /* 基本スタイル */
    font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
    color: #333333;
    line-height: 1.8;
    font-size: 16px;
    max-width: 100%;
    margin: 0 auto;

        /* 変数定義 (Scope内) */
        --primary-color: #2c3e50;
        --bg-light: #f9f9f9;
        --border-color: #e0e0e0;
        --text-main: #333333;
        --link-color: #3498db;
        
        --thamrin-accent: #0f9d58; /* タムリン */
        --thamrin-bg: #e7f5ef;
        --thamrin-map-btn: #d1ece0;
        --thamrin-apt-btn: #45b37e;
        
        --sudirman-accent: #ff5252; /* スディルマン */
        --sudirman-bg: #fff5f5;
        --sudirman-map-btn: #ffe5e5;
        --sudirman-apt-btn: #ff7b7b;
        
        --kuningan-accent: #fba00d; /* クニンガン */
        --kuningan-bg: #fef4e3;
        --kuningan-map-btn: #feecce;
        --kuningan-apt-btn: #fcb543;
        
        --casablanca-accent: #9c27b0; /* カサブランカ */
        --casablanca-bg: #f5e0f9;
        --casablanca-map-btn: #eccef2;
        --casablanca-apt-btn: #b255c2;
        
        --senayan-accent: #0288d1; /* スナヤン & プルマタ・ヒジャウ */
        --senayan-bg: #e7f4fa;
        --senayan-map-btn: #d0e9f6;
        --senayan-apt-btn: #3ba3db;
        
        --scbd-accent: #795548; /* SCBD */
        --scbd-bg: #efe0da;
        --scbd-map-btn: #e3d2cb;
        --scbd-apt-btn: #97786d;
        
        --senopati-accent: #f6a21c; /* セノパティ */
        --senopati-bg: #fff7ea;
        --senopati-map-btn: #feeed5;
        --senopati-apt-btn: #f8b750;
        
        --blokm-accent: #673ab7; /* ブロックM */
        --blokm-bg: #e6def4;
        --blokm-map-btn: #d9ceee;
        --blokm-apt-btn: #8763c6;
        
        --kemang-accent: #7cb342; /* クマン */
        --kemang-bg: #ebf5e1;
        --kemang-map-btn: #d1ece0;
        --kemang-apt-btn: #98c46a;
        
        --gandaria-accent: #7e7313; /* ガンダリア & パクボノ */
        --gandaria-bg: #f3f1e1;
        --gandaria-map-btn: #e7e4cc;
        --gandaria-apt-btn: #9b9347;
        
        --pondokindah-accent: #3949ab; /* ポンドック・インダ */
        --pondokindah-bg: #e0e3f3;
        --pondokindah-map-btn: #cfd4ec;
        --pondokindah-apt-btn: #6370bd;
        
        --simatupang-accent: #f6749f; /* シマトゥパン */
        --simatupang-bg: #f8e8ed;
        --simatupang-map-btn: #f8dce5;
        --simatupang-apt-btn: #f791b3;
  }

  #mm-area-guide-v4 p {
    margin-bottom: 1.5em;
  }
  
  /* 各セクションの下部余白設定 */
  #mm-area-guide-v4 section {
    margin-bottom: 80px;
  }

  /* 記事公開・編集日時 */
  #mm-area-guide-v4 .mm-publish-date {
      display: block;
      text-align: right;
      margin-top: 0;
      margin-bottom: 40px; /* 次のセクションとの間隔 */
      color: #888;
      font-size: 0.95em;
  }
  
  /* 強調テキスト用のハイライト */
  #mm-area-guide-v4 .m-highlight {
    background: linear-gradient(transparent 60%, #ffeba1 60%);
    font-weight: bold;
  }

  /* =========================================
     リンク（全体共通）
  ========================================= */
  #mm-area-guide-v4 a {
    color: #2b6cb0;
    text-decoration: underline;
    font-weight: bold;
    transition: color 0.2s ease;
  }
  #mm-area-guide-v4 a:hover {
    color: #ed8936;
  }

  /* =========================================
    目次 (折りたたみ対応)
  ========================================= */
  #mm-area-guide-v4 .custom-toc {
    background-color: #f9f9f9;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 25px;
    margin-bottom: 0;
  }
  #mm-area-guide-v4 .custom-toc .toc-title {
    font-size: 1.2em;
    font-weight: bold;
    color: #2c3e50;
    text-align: left;
    margin-top: 0; /* H2対応: 上余白をリセット */
    margin-bottom: 15px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e0e0e0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
  }
  #mm-area-guide-v4 .custom-toc .toc-title svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
  }
  
  /* 目次のコンテンツエリア（折りたたみ用） */
  #mm-area-guide-v4 .toc-content {
    position: relative;
    max-height: 250px; /* 約30%相当の初期表示高さ */
    overflow: hidden;
    transition: max-height 0.5s ease;
  }
  #mm-area-guide-v4 .custom-toc.is-expanded .toc-content {
    max-height: 2500px; /* 展開時の十分大きな高さ */
  }
  
  /* 下部のフェードグラデーション */
  #mm-area-guide-v4 .toc-fade {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 80px;
    background: linear-gradient(to bottom, rgba(249, 249, 249, 0) 0%, rgba(249, 249, 249, 1) 100%);
    pointer-events: none;
    transition: opacity 0.3s ease;
    z-index: 1;
  }
  #mm-area-guide-v4 .custom-toc.is-expanded .toc-fade {
    opacity: 0;
    visibility: hidden;
  }
  
  /* 「目次を見る」ボタン */
  #mm-area-guide-v4 .toc-toggle-wrapper {
    text-align: center;
    margin-top: -15px; /* フェード部分に少し重ねる */
    position: relative;
    z-index: 2;
  }
  #mm-area-guide-v4 .custom-toc.is-expanded .toc-toggle-wrapper {
    margin-top: 20px;
  }
  #mm-area-guide-v4 .toc-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    border: 1px solid #cbd5e0;
    color: #4b6279;
    font-weight: bold;
    padding: 8px 24px;
    border-radius: 24px;
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  }
  /* PC環境のみホバー適用 */
  @media (hover: hover) and (pointer: fine) {
    #mm-area-guide-v4 .toc-toggle-btn:hover {
      background-color: #f1f8ff;
      border-color: #a0aec0;
      color: #2c3e50;
      transform: translateY(-1px);
      box-shadow: 0 4px 8px rgba(0,0,0,0.08);
    }
  }
  #mm-area-guide-v4 .toc-toggle-btn svg {
    width: 18px;
    height: 18px;
    margin-left: 6px;
    fill: currentColor;
    transition: transform 0.3s ease;
  }
  #mm-area-guide-v4 .custom-toc.is-expanded .toc-toggle-btn svg {
    transform: rotate(180deg);
  }

  #mm-area-guide-v4 .custom-toc ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
  }
  #mm-area-guide-v4 .custom-toc li {
    position: relative;
    padding-left: 18px;
  }
  #mm-area-guide-v4 .custom-toc li::before {
    content: '\25B6'; /* 古いブラウザ用（音声読み上げされる） */
    content: '\25B6' / ""; /* 対応ブラウザ用（音声読み上げなし） */
    position: absolute;
    left: 0;
    top: 4px;
    font-size: 0.8em;
    color: #4b6279;
  }
  #mm-area-guide-v4 .custom-toc > ul > li {
    margin-bottom: 10px;
    font-weight: bold;
    color: #4b6279;
  }
  #mm-area-guide-v4 .custom-toc ul ul {
    padding-left: 15px;
    margin-top: 5px;
    font-weight: normal;
  }
  #mm-area-guide-v4 .custom-toc ul ul li {
    margin-bottom: 5px;
    font-size: 0.95em;
  }
  #mm-area-guide-v4 .custom-toc ul ul li::before {
    content: "-"; /* 古いブラウザ用 */
    content: "-" / "";
    color: #4b6279;
    font-size: 1em;
    top: 0;
  }
  #mm-area-guide-v4 .custom-toc a {
    color: #2c3e50;
    text-decoration: none;
    font-weight: inherit; /* 全体共通の太字指定を打ち消し */
    transition: opacity 0.2s ease, color 0.2s;
  }
  #mm-area-guide-v4 .custom-toc a:hover {
    text-decoration: underline;
    color: #2c3e50; /* 全体共通のオレンジ色を打ち消し */
    opacity: 0.7;
  }

  /* =========================================
    H1, H2, H3 見出し
  ========================================= */
  /* --- H1 見出し --- */
  #mm-area-guide-v4 .mm-page-title {
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    margin: 0 0 30px;
    color: var(--primary-color);
    border-bottom: 2px solid var(--primary-color);
    padding-bottom: 15px;
    line-height: 1.4;
  }
  
  #mm-area-guide-v4 .mm-page-subtitle {
    font-size: 0.6em; /* 文字の大きさ */
    font-weight: 500;   /* 文字の太さ */
    display: block;    /* ブロック化して行を分ける */
    margin-top: 5px;   /* 上との余白 */
    opacity: 0.9;      /* ほんの少し透過させると馴染みます */
  }

  #mm-area-guide-v4 .custom-lead {
    font-size: 1.05em;
    line-height: 1.8;
    color: #4a5568; 
    padding: 0 20px;
    margin-bottom: 40px;
  }

  /* --- H2 見出し --- */
  #mm-area-guide-v4 h2.custom-h2 {
    font-size: 1.6em;
    color: #1a365d;
    background-color: #f8fafc;
    padding: 16px 20px;
    border-left: 6px solid #1a365d;
    border-bottom: 1px solid #e2e8f0;
    margin-top: 60px;
    margin-bottom: 24px;
    border-radius: 0 8px 8px 0;
    font-weight: bold;
  }

  /* --- H3 見出し --- */
  #mm-area-guide-v4 h3.custom-h3 {
    font-size: 1.2em;
    color: #2d3748;
    padding-bottom: 8px;
    border-bottom: 2px dashed #cbd5e0;
    margin-top: 45px;
    margin-bottom: 20px;
    position: relative;
    display: flex;
    align-items: center;
  }
  #mm-area-guide-v4 h3.custom-h3::before {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    background-color: #ed8936;
    border-radius: 50%;
    margin-right: 12px;
  }

  /* =========================================
    装飾ボックス & カラーバリエーション
  ========================================= */
  #mm-area-guide-v4 .custom-box { margin: 35px 0; padding: 25px 20px 20px; border-radius: 8px; position: relative; border: 1px solid transparent; border-left-width: 4px; }
  #mm-area-guide-v4 .custom-box .box-title { 
    margin-top: 0; /* H3, H4対応: 上余白をリセット */
    font-weight: bold; margin-bottom: 12px; font-size: 1.1em; 
  }
  #mm-area-guide-v4 .custom-box ul,
  #mm-area-guide-v4 .custom-box ol { list-style: none; padding: 0; margin: 0; }
  #mm-area-guide-v4 .custom-box li { position: relative; padding-left: 20px; margin-bottom: 8px; }
  #mm-area-guide-v4 .custom-box li::before {
    content: '\25B6'; /* 古いブラウザ用（音声読み上げされる） */
    content: '\25B6' / ""; /* 対応ブラウザ用（音声読み上げなし） */
    position: absolute;
    left: 0;
    font-size: 0.8em;
    top: 4px;
  }
  
  #mm-area-guide-v4 .custom-box ul ul,
  #mm-area-guide-v4 .custom-box ol ol,
  #mm-area-guide-v4 .custom-box ul ol,
  #mm-area-guide-v4 .custom-box ol ul {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  #mm-area-guide-v4 .custom-box ul ul li,
  #mm-area-guide-v4 .custom-box ol ol li,
  #mm-area-guide-v4 .custom-box ul ol li,
  #mm-area-guide-v4 .custom-box ol ul li {
    padding-left: 16px;
    margin-bottom: 6px;
  }
  #mm-area-guide-v4 .custom-box ul ul li::before,
  #mm-area-guide-v4 .custom-box ol ol li::before,
  #mm-area-guide-v4 .custom-box ul ol li::before,
  #mm-area-guide-v4 .custom-box ol ul li::before {
    content: '\25C6'; /* 古いブラウザ用（音声読み上げされる） */
    content: '\25C6' / ""; /* 対応ブラウザ用（音声読み上げなし） */
    font-size: 0.8em; /* 黒丸を小さく表示 */
    top: 3px; /* 高さの微調整 */
  }
  #mm-area-guide-v4 .custom-box.info-box, 
  #mm-area-guide-v4 .custom-box[class*="box-"] { padding: 25px 25px; } /* バリエーション共通padding */

  /* 色バリエーション: オレンジ (従来の info-box) */
  #mm-area-guide-v4 .custom-box.info-box,
  #mm-area-guide-v4 .custom-box.box-orange { background-color: #fffaf0; border-color: #fbd38d; border-left-color: #ed8936; }
  #mm-area-guide-v4 .custom-box.info-box .box-title,
  #mm-area-guide-v4 .custom-box.box-orange .box-title,
  #mm-area-guide-v4 .custom-box.box-orange h3.compact-cta-title { color: #9c4221; }
  #mm-area-guide-v4 .custom-box.info-box li::before,
  #mm-area-guide-v4 .custom-box.box-orange li::before { color: #ed8936; }

  /* 色バリエーション: 交通機関用（画像背景色に合わせる） */
  #mm-area-guide-v4 .custom-box.box-transit { background-color: #f9f2e0; border-color: #fbd38d; border-left-color: #ed8936; }
  #mm-area-guide-v4 .custom-box.box-transit .box-title { color: #9c4221; }

  /* 色バリエーション: レッド */
  #mm-area-guide-v4 .custom-box.box-red { background-color: #fff5f5; border-color: #feb2b2; border-left-color: #e53e3e; }
  #mm-area-guide-v4 .custom-box.box-red .box-title,
  #mm-area-guide-v4 .custom-box.box-red h3.compact-cta-title { color: #9b2c2c; }
  #mm-area-guide-v4 .custom-box.box-red li::before { color: #e53e3e; }

  /* 色バリエーション: ブルー */
  #mm-area-guide-v4 .custom-box.box-blue { background-color: #f8fafc; border-color: #90cdf4; border-left-color: #2b6cb0; }
  #mm-area-guide-v4 .custom-box.box-blue .box-title,
  #mm-area-guide-v4 .custom-box.box-blue h3.compact-cta-title { color: #2c5282; }
  #mm-area-guide-v4 .custom-box.box-blue li::before { color: #ed8936; }

  /* 色バリエーション: グリーン */
  #mm-area-guide-v4 .custom-box.box-green { background-color: #f0fff4; border-color: #9ae6b4; border-left-color: #38a169; }
  #mm-area-guide-v4 .custom-box.box-green .box-title,
  #mm-area-guide-v4 .custom-box.box-green h3.compact-cta-title { color: #22543d; }
  #mm-area-guide-v4 .custom-box.box-green li::before { color: #38a169; }

  /* リスト装飾 */
  #mm-area-guide-v4 .standard-list {
    padding-left: 20px;
    margin-bottom: 24px;
  }
  #mm-area-guide-v4 .standard-list li {
    margin-bottom: 8px;
  }

  #mm-area-guide-v4 .box-desc {
    margin-bottom: 12px;
    font-size: 0.95em;
  }

  /* JJSリンク用など：赤色のアウトラインボタン */
  #mm-area-guide-v4 .btn-outline-red {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    font-size: 0.9em;
    border-radius: 6px;
    background: #ffffff;
    color: #e53e3e;
    border: 2px solid #e53e3e;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.2s;
  }

  /* PC環境のみホバー適用 */
  @media (hover: hover) and (pointer: fine) {
    #mm-area-guide-v4 .btn-pill-outline:hover {
      background-color: #1a365d;
      color: #ffffff;
    }
    #mm-area-guide-v4 .btn-outline-red:hover {
      background-color: #ffe1e1;
      color: #c53030;
      border-color: #c53030;
    }
  }

/* =========================================
   画像＋テキストリスト用 (.media-list)
========================================= */
#mm-area-guide-v4 .media-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
#mm-area-guide-v4 .media-list li {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 25px;
  border-bottom: 1px solid #eee;
  padding-bottom: 15px;
  padding-left: 0; /* custom-boxの▶用余白を消す */
}
#mm-area-guide-v4 .media-list li:last-child {
  margin-bottom: 0;
  border-bottom: none;
  padding-bottom: 0;
}
#mm-area-guide-v4 .media-list li::before {
  content: none; /* ▶を非表示 */
}
#mm-area-guide-v4 .media-list-img {
  flex: 0 0 120px;
  max-width: 120px;
}
#mm-area-guide-v4 .media-list-img img {
  width: 100%;
  height: auto;
  display: block;
}
#mm-area-guide-v4 .media-list-content {
  flex: 1;
}
#mm-area-guide-v4 .media-list-content strong {
  display: block;
  font-size: 1.1em;
  margin-bottom: 5px;
}
#mm-area-guide-v4 .media-list-content p {
  margin: 0;
  font-size: 0.95em;
  line-height: 1.6;
}

  /* =========================================
     テーブル（比較表・リンク集など）
  ========================================= */
  #mm-area-guide-v4 .custom-table-wrapper {
    overflow-x: auto;
    margin: 30px 0;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
  }
  #mm-area-guide-v4 .custom-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 600px;
    font-size: 0.95em;
  }
  #mm-area-guide-v4 .custom-table th,
  #mm-area-guide-v4 .custom-table td {
    border: 1px solid #e2e8f0;
    padding: 14px 16px;
    text-align: left;
    vertical-align: middle;
  }
  #mm-area-guide-v4 .custom-table th {
    background-color: #1a365d;
    color: #ffffff;
    font-weight: bold;
    text-align: center;
    white-space: nowrap;
  }
  #mm-area-guide-v4 .custom-table tbody tr:nth-child(even) {
    background-color: #f8fafc;
  }
  #mm-area-guide-v4 .custom-table tbody tr:hover {
    background-color: #ebf8ff;
  }
  #mm-area-guide-v4 .custom-table td:first-child {
    font-weight: bold;
    background-color: #eff3f6;
    color: #2d3748;
    text-align: center;
  }
  /* 視覚的には隠すが、検索エンジンやスクリーンリーダーには読ませる設定 */
  #mm-area-guide-v4 .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  /* =========================================
     エリア リンクボックス（複数箇所設置用）
  ========================================= */
  #mm-area-guide-v4 .area-link-box {
    background-color: #f1f5f9; /* フッターナビと同じ背景色に */
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 18px 20px;
    margin: 30px 0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.03);
  }
  #mm-area-guide-v4 .area-link-box-title {
    margin-top: 0; /* H3, H4対応: 上余白をリセット */
    font-weight: bold;
    color: #2d3748;
    margin-bottom: 16px;
    font-size: 1em;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  #mm-area-guide-v4 .area-link-box-title svg {
    width: 20px;
    height: 20px;
    fill: #e53e3e;
  }
  #mm-area-guide-v4 .area-link-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  /* 各エリアボタンの配色用変数割り当て */
  #mm-area-guide-v4 .item-thamrin { --item-bg: var(--thamrin-bg); --item-accent: var(--thamrin-accent); }
  #mm-area-guide-v4 .item-sudirman { --item-bg: var(--sudirman-bg); --item-accent: var(--sudirman-accent); }
  #mm-area-guide-v4 .item-kuningan { --item-bg: var(--kuningan-bg); --item-accent: var(--kuningan-accent); }
  #mm-area-guide-v4 .item-casablanca { --item-bg: var(--casablanca-bg); --item-accent: var(--casablanca-accent); }
  #mm-area-guide-v4 .item-senayan { --item-bg: var(--senayan-bg); --item-accent: var(--senayan-accent); }
  #mm-area-guide-v4 .item-scbd { --item-bg: var(--scbd-bg); --item-accent: var(--scbd-accent); }
  #mm-area-guide-v4 .item-senopati { --item-bg: var(--senopati-bg); --item-accent: var(--senopati-accent); }
  #mm-area-guide-v4 .item-blokm { --item-bg: var(--blokm-bg); --item-accent: var(--blokm-accent); }
  #mm-area-guide-v4 .item-kemang { --item-bg: var(--kemang-bg); --item-accent: var(--kemang-accent); }
  #mm-area-guide-v4 .item-gandaria { --item-bg: var(--gandaria-bg); --item-accent: var(--gandaria-accent); }
  #mm-area-guide-v4 .item-pondokindah { --item-bg: var(--pondokindah-bg); --item-accent: var(--pondokindah-accent); }
  #mm-area-guide-v4 .item-simatupang { --item-bg: var(--simatupang-bg); --item-accent: var(--simatupang-accent); }

  #mm-area-guide-v4 .area-link-item {
    display: inline-flex;
    align-items: center;
    padding: 6px 16px;
    background-color: var(--item-bg, #fff);
    color: var(--item-accent, var(--link-color));
    border: 1px solid var(--item-accent, var(--link-color));
    border-radius: 20px;
    font-size: 0.8em;
    text-decoration: none;
    transition: all 0.2s ease;
    font-weight: bold;
  }
  /* PC環境のみホバー適用 */
  @media (hover: hover) and (pointer: fine) {
    #mm-area-guide-v4 .area-link-item:hover {
      background-color: var(--item-accent, var(--link-color));
      color: #ffffff;
      transform: translateY(-2px);
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }
  }
  #mm-area-guide-v4 .area-link-item.disabled {
    background-color: #f7fafc;
    color: #a0aec0;
    border-color: #e2e8f0;
    pointer-events: none;
    font-weight: normal;
    box-shadow: none;
    transform: none;
  }

  /* =========================================
     エリアフィルター機能（タグ絞り込み）
  ========================================= */
  #mm-area-guide-v4 .area-filter-wrapper {
    margin-bottom: 25px;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
  }
  #mm-area-guide-v4 .area-filter-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    border-bottom: 1px dashed #cbd5e0;
    padding-bottom: 8px;
  }
  #mm-area-guide-v4 .filter-label {
    font-weight: bold;
    font-size: 0.95em;
    color: #2d3748;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }
  #mm-area-guide-v4 .filter-label svg {
    width: 18px;
    height: 18px;
    margin-right: 6px;
    fill: #ed8936;
  }
  #mm-area-guide-v4 .filter-hint {
    font-size: 0.8em;
    font-weight: normal;
    color: #718096;
    margin-left: 8px;
  }
  #mm-area-guide-v4 .filter-result-count {
    font-size: 0.85em;
    font-weight: bold;
    color: #3182ce;
    background-color: #ebf8ff;
    padding: 4px 12px;
    border-radius: 12px;
    border: 1px solid #bee3f8;
  }
  #mm-area-guide-v4 .area-filter-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
  }
  
  #mm-area-guide-v4 .area-filter-btn {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border-radius: 20px;
    border: 1px solid #cbd5e0;
    background-color: #ffffff;
    color: #4a5568;
    font-size: 0.85em;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.2s ease;
  }
  #mm-area-guide-v4 .area-filter-btn:hover {
    border-color: #3182ce;
    color: #3182ce;
    background-color: #ebf8ff;
  }
  #mm-area-guide-v4 .area-filter-btn.active {
    background-color: #3182ce;
    color: #ffffff;
    border-color: #3182ce;
    box-shadow: 0 2px 6px rgba(49, 130, 206, 0.3);
  }
  
  #mm-area-guide-v4 .area-filter-btn-clear {
    background-color: #e2e8f0;
    color: #4a5568;
    border-color: #cbd5e0;
    margin-right: 4px;
  }
  #mm-area-guide-v4 .area-filter-btn-clear svg {
    width: 14px;
    height: 14px;
    margin-right: 4px;
    fill: currentColor;
    display: none;
  }
  #mm-area-guide-v4 .area-filter-btn-clear:hover {
    background-color: #cbd5e0;
  }
  #mm-area-guide-v4 .area-filter-btn-clear.is-filtering {
    background-color: #fff5f5;
    color: #e53e3e;
    border-color: #feb2b2;
  }
  #mm-area-guide-v4 .area-filter-btn-clear.is-filtering svg {
    display: inline-block;
  }
  #mm-area-guide-v4 .area-filter-btn-clear.is-filtering:hover {
    background-color: #fed7d7;
  }

  #mm-area-guide-v4 .no-result-msg {
    display: none;
    padding: 30px;
    text-align: center;
    background-color: #f8fafc;
    border: 1px dashed #cbd5e0;
    border-radius: 8px;
    color: #718096;
    margin-bottom: 24px;
  }

  /* 目次ジャンプ時：フィルターのアニメーションを一時的に無効化する */
  #mm-area-guide-v4 .jump-no-transition * {
    transition: none !important;
    animation: none !important;
  }

  /* =========================================
     エリア紹介カード & アクションボタン共通設定
  ========================================= */

  #mm-area-guide-v4 .area-card {
    border: 1px solid var(--card-accent);
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
    background-color: var(--card-bg);
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    transition: transform 0.3s ease, box-shadow 0.3s ease, opacity 0.25s ease;

    --card-accent: #1a365d;
    --card-bg: #edf2f7;
    --card-tag-bg: #ebf8ff;
    --card-tag-text: #2b6cb0;
    --card-map-border: #cbd5e0;
    --card-map-hover: #f7fafc;
    --card-apt-hover: #2a4365;
  }

  /* PC環境のみホバー適用 */
  @media (hover: hover) and (pointer: fine) {
    #mm-area-guide-v4 .area-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    }
  }

  #mm-area-guide-v4 .theme-thamrin {
    --card-accent: var(--thamrin-accent);
    --card-bg: var(--thamrin-bg);
    --card-tag-bg: var(--thamrin-accent);
    --card-tag-text: var(--thamrin-accent);
    --card-map-border: var(--thamrin-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--thamrin-apt-btn);

    --list-accent: var(--thamrin-accent);
    --list-bg: var(--thamrin-bg);
    --list-border: var(--thamrin-map-btn);
    --list-text: var(--thamrin-accent);
  }
  #mm-area-guide-v4 .theme-sudirman {
    --card-accent: var(--sudirman-accent);
    --card-bg: var(--sudirman-bg);
    --card-tag-bg: var(--sudirman-accent);
    --card-tag-text: var(--sudirman-accent);
    --card-map-border: var(--sudirman-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--sudirman-apt-btn);

    --list-accent: var(--sudirman-accent);
    --list-bg: var(--sudirman-bg);
    --list-border: var(--sudirman-map-btn);
    --list-text: var(--sudirman-accent);
  }
  #mm-area-guide-v4 .theme-kuningan {
    --card-accent: var(--kuningan-accent);
    --card-bg: var(--kuningan-bg);
    --card-tag-bg: var(--kuningan-accent);
    --card-tag-text: var(--kuningan-accent);
    --card-map-border: var(--kuningan-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--kuningan-apt-btn);

    --list-accent: var(--kuningan-accent);
    --list-bg: var(--kuningan-bg);
    --list-border: var(--kuningan-map-btn);
    --list-text: var(--kuningan-accent);
  }
  #mm-area-guide-v4 .theme-casablanca {
    --card-accent: var(--casablanca-accent);
    --card-bg: var(--casablanca-bg);
    --card-tag-bg: var(--casablanca-accent);
    --card-tag-text: var(--casablanca-accent);
    --card-map-border: var(--casablanca-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--casablanca-apt-btn);

    --list-accent: var(--casablanca-accent);
    --list-bg: var(--casablanca-bg);
    --list-border: var(--casablanca-map-btn);
    --list-text: var(--casablanca-accent);
  }
  #mm-area-guide-v4 .theme-senayan {
    --card-accent: var(--senayan-accent);
    --card-bg: var(--senayan-bg);
    --card-tag-bg: var(--senayan-accent);
    --card-tag-text: var(--senayan-accent);
    --card-map-border: var(--senayan-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--senayan-apt-btn);

    --list-accent: var(--senayan-accent);
    --list-bg: var(--senayan-bg);
    --list-border: var(--senayan-map-btn);
    --list-text: var(--senayan-accent);
  }
  #mm-area-guide-v4 .theme-scbd {
    --card-accent: var(--scbd-accent);
    --card-bg: var(--scbd-bg);
    --card-tag-bg: var(--scbd-accent);
    --card-tag-text: var(--scbd-accent);
    --card-map-border: var(--scbd-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--scbd-apt-btn);

    --list-accent: var(--scbd-accent);
    --list-bg: var(--scbd-bg);
    --list-border: var(--scbd-map-btn);
    --list-text: var(--scbd-accent);
  }
  #mm-area-guide-v4 .theme-senopati {
    --card-accent: var(--senopati-accent);
    --card-bg: var(--senopati-bg);
    --card-tag-bg: var(--senopati-accent);
    --card-tag-text: var(--senopati-accent);
    --card-map-border: var(--senopati-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--senopati-apt-btn);

    --list-accent: var(--senopati-accent);
    --list-bg: var(--senopati-bg);
    --list-border: var(--senopati-map-btn);
    --list-text: var(--senopati-accent);
  }
  #mm-area-guide-v4 .theme-blokm {
    --card-accent: var(--blokm-accent);
    --card-bg: var(--blokm-bg);
    --card-tag-bg: var(--blokm-accent);
    --card-tag-text: var(--blokm-accent);
    --card-map-border: var(--blokm-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--blokm-apt-btn);

    --list-accent: var(--blokm-accent);
    --list-bg: var(--blokm-bg);
    --list-border: var(--blokm-map-btn);
    --list-text: var(--blokm-accent);
  }
  #mm-area-guide-v4 .theme-kemang {
    --card-accent: var(--kemang-accent);
    --card-bg: var(--kemang-bg);
    --card-tag-bg: var(--kemang-accent);
    --card-tag-text: var(--kemang-accent);
    --card-map-border: var(--kemang-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--kemang-apt-btn);

    --list-accent: var(--kemang-accent);
    --list-bg: var(--kemang-bg);
    --list-border: var(--kemang-map-btn);
    --list-text: var(--kemang-accent);
  }
  #mm-area-guide-v4 .theme-gandaria {
    --card-accent: var(--gandaria-accent);
    --card-bg: var(--gandaria-bg);
    --card-tag-bg: var(--gandaria-accent);
    --card-tag-text: var(--gandaria-accent);
    --card-map-border: var(--gandaria-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--gandaria-apt-btn);

    --list-accent: var(--gandaria-accent);
    --list-bg: var(--gandaria-bg);
    --list-border: var(--gandaria-map-btn);
    --list-text: var(--gandaria-accent);
  }
  #mm-area-guide-v4 .theme-pondokindah {
    --card-accent: var(--pondokindah-accent);
    --card-bg: var(--pondokindah-bg);
    --card-tag-bg: var(--pondokindah-accent);
    --card-tag-text: var(--pondokindah-accent);
    --card-map-border: var(--pondokindah-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--pondokindah-apt-btn);

    --list-accent: var(--pondokindah-accent);
    --list-bg: var(--pondokindah-bg);
    --list-border: var(--pondokindah-map-btn);
    --list-text: var(--pondokindah-accent);
  }
  #mm-area-guide-v4 .theme-simatupang {
    --card-accent: var(--simatupang-accent);
    --card-bg: var(--simatupang-bg);
    --card-tag-bg: var(--simatupang-accent);
    --card-tag-text: var(--simatupang-accent);
    --card-map-border: var(--simatupang-map-btn);
    --card-map-hover: #ffffff;
    --card-apt-hover: var(--simatupang-apt-btn);

    --list-accent: var(--simatupang-accent);
    --list-bg: var(--simatupang-bg);
    --list-border: var(--simatupang-map-btn);
    --list-text: var(--simatupang-accent);
  }

  #mm-area-guide-v4 .area-card-title {
    margin-top: 0; /* H3対応: 上余白をリセット */
    font-size: 1.3em;
    color: var(--card-accent);
    font-weight: bold;
    margin-bottom: 12px;
    border-bottom: 2px solid var(--card-map-border);
    padding-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  #mm-area-guide-v4 .area-card-tags {
    margin-bottom: 15px;
  }
  
  #mm-area-guide-v4 .area-tag {
    display: inline-block;
    background-color: var(--card-accent); /* フォールバック用 */
    background-color: color-mix(in srgb, var(--card-accent) 70%, var(--card-bg) 30%);
    color: #ffffff;
    border: 1px solid var(--card-accent); /* フォールバック用 */
    border: 1px solid color-mix(in srgb, var(--card-accent) 70%, var(--card-bg) 30%);
    padding: 3px 11px;
    border-radius: 20px;
    font-size: 0.8em;
    margin-right: 3px;
    margin-bottom: 6px;
    font-weight: bold;
  }

  /* ボタンの共通スタイル */
  #mm-area-guide-v4 .action-buttons { 
    display: flex;
    gap: 7px;
    margin-top: 20px;
    flex-wrap: wrap;
    align-items: center;
  }
  
  #mm-area-guide-v4 .btn-map,
  #mm-area-guide-v4 .btn-detail,
  #mm-area-guide-v4 .btn-inquiry {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: bold;
    font-size: 0.9em;
    transition: all 0.2s;
  }
  
  #mm-area-guide-v4 .btn-map {
    background-color: var(--card-bg); /* フォールバック用 */
    background-color: color-mix(in srgb, var(--card-accent) 20%, var(--card-bg) 80%);
    color: var(--card-accent);
    border: 1px solid var(--card-accent); /* フォールバック用 */
    border: 1px solid color-mix(in srgb, var(--card-accent) 35%, var(--card-bg) 65%);
  }
  #mm-area-guide-v4 .btn-map svg {
    width: 18px;
    height: 18px;
    margin-right: 8px;
    fill: currentColor;
  }

  #mm-area-guide-v4 .btn-detail {
    background-color: var(--card-accent);
    color: #ffffff;
    border: 1px solid var(--card-accent);
  }

  /* 相談ボタン (CVR向上) */
  #mm-area-guide-v4 .btn-inquiry {
    background-color: #06C755;
    color: #ffffff;
    border: 1px solid #06C755;
  }

  /* PC環境のみホバー適用 */
  @media (hover: hover) and (pointer: fine) {
    #mm-area-guide-v4 .btn-map:hover {
      background-color: var(--card-accent); /* フォールバック用 */
      background-color: color-mix(in srgb, var(--card-accent) 30%, var(--card-bg) 70%);
      border-color: var(--card-accent); /* フォールバック用 */
      border-color: color-mix(in srgb, var(--card-accent) 30%, var(--card-bg) 70%);
      color: var(--card-accent);
    }
    #mm-area-guide-v4 .btn-detail:hover {
      background-color: var(--card-apt-hover);
      color: #ffffff;
      border-color: var(--card-apt-hover);
    }
    #mm-area-guide-v4 .btn-inquiry:hover {
      background-color: #05a546;
      border-color: #05a546;
      color: #ffffff;
    }
  }

/* =========================================
     別窓リンク（target="_blank"）にアイコンを追加
  ========================================= */
  
  /* hrefの指定（ドメイン絞り込み）を外し、すべての_blankリンクを対象にする */
  #mm-area-guide-v4 a[target="_blank"]:not(.lifestyle-area-name)::after {
    content: "";
    display: inline-block;
    width: 0.85em;    
    height: 0.85em;
    margin-left: 4px; 
    margin-right: 2px;
    vertical-align: middle;
    background-color: currentColor; 
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z'/%3E%3C/svg%3E");
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    opacity: 0.65; 
  }

  /* 例外：ボタンデザインやカードには適用しない（非表示にする） */
  #mm-area-guide-v4 a[target="_blank"].mm-link-btn::after,
  #mm-area-guide-v4 a[target="_blank"].btn-map::after,
  #mm-area-guide-v4 a[target="_blank"].btn-detail::after,
  #mm-area-guide-v4 a[target="_blank"].btn-inquiry::after,
  #mm-area-guide-v4 a[target="_blank"].btn-outline-red::after,
  #mm-area-guide-v4 a[target="_blank"].btn-pill::after,
  #mm-area-guide-v4 a[target="_blank"].btn-pill-outline::after,
  #mm-area-guide-v4 a[target="_blank"].apt-link::after,
  #mm-area-guide-v4 a[target="_blank"].sns-btn::after,
  #mm-area-guide-v4 a[target="_blank"].mm-map-overlay-btn::after {
    display: none;
  }

    /* --------------------------------------------------
       概要 & 地図
       -------------------------------------------------- */
    #mm-area-guide-v4 .mm-overview-text {
        margin-bottom: 30px;
        background: transparent;
        border: none;
        padding: 0;
    }
    #mm-area-guide-v4 .mm-map-wrapper {
        position: relative;
        margin: 30px 0;
        border-radius: 8px;
        background: #f0f0f0;
        width: 100%;
        height: 480px;
        display: block;
        overflow: hidden;
        color: #666;
        font-weight: bold;
    }
    #mm-area-guide-v4 .mm-map-wrapper iframe {
        display: block;
        width: 100%;
        height: 100%;
    }

    /* 地図上のオーバーレイボタン */
    #mm-area-guide-v4 .mm-map-overlay-btn {
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 10;
        display: inline-flex;
        align-items: center;
        background-color: rgba(255, 255, 255, 0.95);
        color: #333;
        font-size: 0.85em;
        font-weight: bold;
        text-decoration: none;
        padding: 8px 14px;
        border-radius: 4px;
        box-shadow: 0 2px 6px rgba(0,0,0,0.3);
        transition: all 0.2s ease;
        border: 1px solid #ddd;
    }

    #mm-area-guide-v4 .mm-map-overlay-btn:hover {
        background-color: #fff;
        color: #3498db;
        transform: translateY(-1px);
        box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    }

    #mm-area-guide-v4 .mm-map-overlay-btn svg {
        width: 16px;
        height: 16px;
        margin-right: 6px;
        fill: currentColor;
    }

    #mm-area-guide-v4 .mm-map-note {
        margin-top: 0px;
        margin-bottom: 60px;
        color: #888;
        font-size: 0.85em;
        line-height: 1.6;
    }

    #mm-area-guide-v4 .mm-map-note ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    #mm-area-guide-v4 .mm-map-note li {
        margin-bottom: 4px;
        padding-left: 0;
    }

  /* --------------------------------------------------
    目的別・ライフスタイル別 リスト
  -------------------------------------------------- */
  #mm-area-guide-v4 .lifestyle-section {
    margin-bottom: 60px;
  }
  
  #mm-area-guide-v4 h3.lifestyle-title {
    font-size: 1.25em;
    font-weight: bold;
    color: #2c3e50;
  }
  
  #mm-area-guide-v4 h3.lifestyle-title::before {
    display: none;
  }
  
  #mm-area-guide-v4 h3.lifestyle-title svg {
    width: 24px;
    height: 24px;
    margin-right: 10px;
    fill: #ed8936;
    flex-shrink: 0;
  }

  #mm-area-guide-v4 .lifestyle-area-list {
    --list-accent: #3182ce;
    --list-bg: #f8fafc;
    --list-border: #e2e8f0;
    --list-text: #1a365d;

    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px 20px;
  }

  #mm-area-guide-v4 .lifestyle-area-list li {
    background-color: var(--list-bg);
    border-left: 4px solid var(--list-accent);
    padding: 12px 40px 12px 15px; 
    margin-bottom: 0;
    border-radius: 0 20px 20px 0;
    border-top: 1px solid var(--list-border);
    border-right: 1px solid var(--list-border);
    border-bottom: 1px solid var(--list-border);
    position: relative;
    /* 親要素自体のふわっとした変化 */
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
    overflow: hidden; /* アイコンのはみ出し防止 */
  }
  
  /* PC環境のみホバー適用 */
  @media (hover: hover) and (pointer: fine) {
    #mm-area-guide-v4 .lifestyle-area-list li:hover {
      transform: translateY(-3px);
      box-shadow: 0 4px 12px rgba(0,0,0,0.08);
      background-color: var(--list-bg); /* フォールバック用 */
      background-color: color-mix(in srgb, var(--list-bg) 85%, var(--list-accent) 15%);
    }
  }

  /* アイコン部分の再定義 */
  #mm-area-guide-v4 .lifestyle-area-list li::before {
    content: '\203A'; /* 古いブラウザ用（音声読み上げされる） */
    content: '\203A' / ""; /* 対応ブラウザ用（音声読み上げなし） */
    position: absolute;
    right: 15px;
    top: 50%;
    /* 初期位置 */
    transform: translateY(-50%); 
    font-family: Consolas, Monaco, monospace; /* 矢印を綺麗に見せる */
    font-weight: bold;
    font-size: 1.2em;
    color: var(--list-accent);
    
    /* 【重要】ここに transition を入れないとスライドしません */
    transition: transform 0.3s ease, right 0.3s ease; 
    z-index: 1;
    pointer-events: none;
  }

  /* ホバー時に右にスライドさせる（PC環境のみホバー適用） */
  @media (hover: hover) and (pointer: fine) {
    #mm-area-guide-v4 .lifestyle-area-list li:hover::before {
      transform: translateY(-50%) translateX(8px); /* 右に8pxスライド */
    }
  }

  /* エリア名のスタイル（リンク範囲を広げる） */
  #mm-area-guide-v4 .lifestyle-area-name {
    font-weight: bold;
    color: var(--list-text);
    font-size: 1.05em;
    display: block;
    text-decoration: none;
    z-index: 2;
    position: static;
  }

  #mm-area-guide-v4 .lifestyle-area-name::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    border-radius: 0 20px 20px 0;
  }

  /* PC環境のみホバー適用 */
  @media (hover: hover) and (pointer: fine) {
    #mm-area-guide-v4 .lifestyle-area-list li:hover .lifestyle-area-name {
      color: var(--link-color);
    }
  }

  #mm-area-guide-v4 .lifestyle-apartments {
    font-size: 0.9em;
    color: #4a5568;
    margin-top: 10px;
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
  }
  
  #mm-area-guide-v4 .lifestyle-apartments strong {
    color: #fff;
    background-color: var(--list-accent);
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 0.85em;
    white-space: nowrap;
  }

  #mm-area-guide-v4 .apt-link {
    color: #ffffff;
    background-color: var(--list-accent);
    text-decoration: none;
    font-weight: bold;
    transition: opacity 0.2s ease, transform 0.2s ease;
    padding: 4px 14px;
    border-radius: 20px;
    font-size: 0.85em;
    line-height: 1.4;
    display: inline-block;
  }
  
  #mm-area-guide-v4 .apt-link:hover {
    color: #ffffff;
    opacity: 0.75;
    transform: translateY(2px);
  }

    /* --------------------------------------------------
       ▼ページ途中差し込み用 超シンプルエリアナビ
       -------------------------------------------------- */
    #mm-area-guide-v4 .mm-simple-area-nav {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        align-items: center;
        margin: 10px 0;
        padding: 12px 16px;
        background-color: #f1f5f9;
        border-radius: 8px;
        border: 1px solid #e0e0e0;
    }
    
    #mm-area-guide-v4 .mm-simple-area-nav .nav-parent {
        display: inline-flex;
        align-items: center;
        font-weight: bold;
        font-size: 0.85em;
        color: var(--primary-color);
        text-decoration: none;
        margin-right: 6px;
        margin-bottom: 0;
    }
    #mm-area-guide-v4 .mm-simple-area-nav .nav-parent svg {
        width: 16px;
        height: 16px;
        margin-right: 6px;
    }
    #mm-area-guide-v4 .mm-simple-area-nav .nav-parent:hover {
        color: var(--link-color);
    }
    
    #mm-area-guide-v4 .mm-simple-area-nav .mm-simple-link {
        font-size: 0.75em;
        color: #4a5568;
        background: #fff;
        padding: 4px 10px;
        border-radius: 20px;
        border: 1px solid #cbd5e0;
        text-decoration: none;
        font-weight: normal; /* 全体リンクの太字を打ち消し */
        transition: all 0.2s ease;
        white-space: nowrap;
    }
    #mm-area-guide-v4 .mm-simple-area-nav .mm-simple-link:hover {
        border-color: var(--link-color);
        color: var(--link-color);
        background: #f1f8ff;
    }
    #mm-area-guide-v4 .mm-simple-area-nav .mm-simple-link.current {
        background: var(--primary-color);
        color: #fff;
        border-color: var(--primary-color);
        pointer-events: none;
    }

  /* --------------------------------------------------
       Line & 問い合わせフォーム ボックス
    -------------------------------------------------- */
    /* 装飾ボックス (ベースと背景色) */
    #mm-area-guide-v4 .custom-box { 
        margin: 20px 0; 
        padding: 15px; 
        border-radius: 8px; 
        position: relative; 
        border: 1px solid transparent; 
        border-left-width: 4px; 
    }
    #mm-area-guide-v4 .custom-box.info-box { 
        padding: 15px; 
        background-color: #fffaf0; 
        border-color: #fbd38d; 
        border-left-color: #ed8936; 
    }

    /* コンパクトCTA (テキストレイアウト) */
    #mm-area-guide-v4 .compact-cta {
        margin: 25px 0 0; 
        text-align: center;
        border-width: 2px;
        border-radius: 8px;
        padding: 0 15px;
    }
    #mm-area-guide-v4 .compact-cta-title {
        color: #9c4221;
        margin-top: 0;
        margin-bottom: 10px;
        font-size: 1.1em;
        font-weight: bold;
    }
    #mm-area-guide-v4 .compact-cta-desc {
        margin-bottom: 12px;
        font-size: 0.9em;
        line-height: 1.5;
    }
    #mm-area-guide-v4 .compact-cta-buttons {
        display: flex;
        gap: 10px;
        justify-content: center;
        flex-wrap: wrap;
    }

    /* ボタン類のスタイル */
    #mm-area-guide-v4 .btn-pill {
        padding: 8px 18px;
        font-size: 0.9em;
        border-radius: 25px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: bold;
        text-decoration: none;
        transition: all 0.2s;
    }
    #mm-area-guide-v4 .btn-pill-outline {
        padding: 8px 18px;
        font-size: 0.9em;
        border-radius: 25px;
        background: #fff;
        color: #1a365d !important;
        border: 2px solid #1a365d;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: bold;
        transition: all 0.2s;
        text-decoration: none;
    }
    /* LINE相談ボタン (緑色) */
    #mm-area-guide-v4 .btn-inquiry {
        background-color: #06C755;
        color: #ffffff !important;
        border: 1px solid #06C755;
    }

    /* PC環境のみホバー適用（マウスオーバー時のアクション） */
    @media (hover: hover) and (pointer: fine) {
        #mm-area-guide-v4 .btn-pill-outline:hover {
            background-color: #1a365d;
            color: #ffffff !important;
        }
        #mm-area-guide-v4 .btn-inquiry:hover {
            background-color: #05a546;
            border-color: #05a546;
            color: #ffffff;
        }
    }

    /* --------------------------------------------------
       CTAボックス内のサブリンク (控えめなナビゲーション)
    -------------------------------------------------- */
    #mm-area-guide-v4 .compact-cta-sublinks {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px 12px;
        margin-top: 15px;
        padding-top: 15px;
        padding-bottom: 3px;
        border-top: 1px dashed #fbd38d; /* CTAボックスの枠色と調和する点線 */
    }
    
    #mm-area-guide-v4 .compact-cta-sublink {
        display: inline-flex;
        align-items: center;
        font-size: 0.8em;
        color: #7b4f2a; /* テキスト色も少し暖色に寄せて馴染ませる */
        background-color: #fff;
        border: 1px solid #f6ad55; /* 薄いオレンジ系の枠 */
        padding: 5px 12px;
        border-radius: 20px;
        text-decoration: none;
        transition: all 0.2s ease;
        white-space: nowrap; /* 途中で改行されないようにする */
    }
    
    #mm-area-guide-v4 .compact-cta-sublink svg {
        width: 14px;
        height: 14px;
        margin-right: 5px;
        fill: currentColor;
    }
    
    /* PC環境のみホバー適用 */
    @media (hover: hover) and (pointer: fine) {
        #mm-area-guide-v4 .compact-cta-sublink:hover {
            background-color: #fff;
            color: #dd6b20;
            border-color: #dd6b20;
            transform: translateY(-1px);
            box-shadow: 0 2px 5px rgba(0,0,0,0.05);
        }
    }

    /* --------------------------------------------------
       交通・電子マネー カード共通スタイル
    -------------------------------------------------- */
    #mm-area-guide-v4 .mm-card-grid {
      display: grid;
      gap: 20px;
      margin: 25px 0 40px;
    }

    /* 電子マネー：4列（スマホ2列） */
   #mm-area-guide-v4 .emoney-grid {
      grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    }

    #mm-area-guide-v4 .mm-info-card {
      background: #fff;
      border: 1px solid #e2e8f0;
      border-radius: 10px;
      overflow: hidden;
      box-shadow: 0 2px 5px rgba(0,0,0,0.05);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
      display: flex;
      flex-direction: column;
    }

    /* PC環境のみホバー適用 */
    @media (hover: hover) and (pointer: fine) {
      #mm-area-guide-v4 .mm-info-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 15px rgba(0,0,0,0.1);
      }
    }

    /* 画像エリアの準備 */
    #mm-area-guide-v4 .card-img-placeholder {
      width: 100%;
      aspect-ratio: 16 / 9; /* 黄金比 */
      background-color: #edf2f7;
      object-fit: cover;
      border-bottom: 1px solid #e2e8f0;
    }

    #mm-area-guide-v4 .card-body {
      background-color: #edf1f5;
      padding: 15px;
      flex-grow: 1;
    }

    #mm-area-guide-v4 .card-title {
      font-weight: bold;
      color: #2d3748;
      margin-bottom: 8px;
      display: block;
      font-size: 1em;
    }

    #mm-area-guide-v4 .card-text {
      font-size: 0.85em;
      color: #4a5568;
      line-height: 1.6;
      margin: 0;
    }

    /* 電子マネーカード専用（MRTの画像と同様にレスポンシブ対応） */
    #mm-area-guide-v4 .emoney-grid .card-img-placeholder {
      width: 100%;
      height: auto;
      display: block;
      aspect-ratio: auto; /* 全体設定の16:9を解除して画像の元サイズに従う */
      object-fit: contain; /* 画像が見切れないように全体を表示 */
    }

    @media (max-width: 480px) {
      #mm-area-guide-v4 .emoney-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
      }
    }

    /* --------------------------------------------------
       SNSボタンの共通設定
    -------------------------------------------------- */
    #mm-area-guide-v4 .sns-btn {
        display: inline-flex;
        align-items: center;
        background: #f8f9fa;
        border: 1px solid #dee2e6;
        border-radius: 4px;
        padding: 4px 10px;
        margin: 2px 4px 2px 0;
        font-size: 0.7em;
        font-weight: bold;
        color: #495057 !important;
        text-decoration: none !important;
        transition: all 0.2s ease;
    }

    #mm-area-guide-v4 .sns-btn:hover {
        background: #e9ecef;
        border-color: var(--link-color);
        box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    }

    #mm-area-guide-v4 .sns-btn svg {
        width: 16px;
        height: 16px;
        margin-right: 6px;
        fill: currentColor; /* 文字色と同じ色になります */
    }
    
    /* --------------------------------------------------
       スマート・フッターナビゲーション
    -------------------------------------------------- */
    #mm-area-guide-v4 .footer-nav {
        margin: 40px 0 40px;
        padding: 40px 30px;
        background: #f1f5f9;
        border-radius: 12px;
    }
    #mm-area-guide-v4 .nav-parent {
        display: flex;
        align-items: center;
        font-weight: bold;
        font-size: 1.1em;
        color: var(--primary-color);
        margin-bottom: 25px;
        text-decoration: none;
    }
    #mm-area-guide-v4 .nav-parent:hover {
        color: var(--link-color);
    }
    #mm-area-guide-v4 .nav-parent svg {
        width: 20px;
        height: 20px;
        margin-right: 10px;
    }
    #mm-area-guide-v4 .nav-parent.current {
        color: var(--primary-color) !important;
        cursor: default !important;
        pointer-events: none;
    }
    #mm-area-guide-v4 .nav-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 12px;
    }
    #mm-area-guide-v4 .nav-item {
        display: flex;
        align-items: center;
        background: #fff;
        padding: 12px 18px;
        border-radius: 8px;
        text-decoration: none;
        color: var(--text-main);
        font-size: 0.9em;
        font-weight: normal; /* 全体リンクの太字を打ち消し */
        border: 1px solid var(--border-color);
        transition: transform 0.2s, box-shadow 0.2s;
    }
    /* PC環境のみホバー適用 */
    @media (hover: hover) and (pointer: fine) {
      #mm-area-guide-v4 .nav-item:hover {
        background-color: #f1f8ff;
        border-color: var(--link-color);
        color: var(--link-color);
        /* 浮き上がる動作 */
        transform: translateY(-2px);
        box-shadow: 0 4px 10px rgba(0,0,0,0.05);
      }
    }
    #mm-area-guide-v4 .nav-item.current {
        background: var(--primary-color);
        color: #fff;
        font-weight: bold;
        pointer-events: none;
        border-color: var(--primary-color);
    }
    #mm-area-guide-v4 .nav-item::before {
        content: none;
    }

    /* --------------------------------------------------
       「ページトップへ」ボタンのCSS
    -------------------------------------------------- */
    #mm-area-guide-v4 .page-top-btn {
        /* position: fixed は画面の右下端に対する「相対配置」です */
        position: fixed;
        right: 63px;       /* PC時の画面右端からの距離 */
        bottom: 132px;     /* PC時の画面下端からの距離 */
        width: 50px;
        height: 50px;
        background-color: #124b82;
        color: #ffffff;
        border: none;
        border-radius: 50%;
        cursor: pointer;
        display: flex;
        justify-content: center;
        align-items: center;
        box-shadow: 0 4px 10px rgba(0,0,0,0.15);
        opacity: 0;
        visibility: hidden;
        transform: translateY(10px);
        transition: all 0.3s ease;
        z-index: 999;
    }

    #mm-area-guide-v4 .page-top-btn.is-show {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    @media (hover: hover) and (pointer: fine) {
        #mm-area-guide-v4 .page-top-btn:hover,
        #mm-area-guide-v4 .page-top-btn:active {
            background-color: #3498db;
        }
    }

/* =========================================
     静的FAQセクション（スニペット対応用）
  ========================================= */
  #mm-area-guide-v4 .faq-container {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    gap: 25px;
  }
  #mm-area-guide-v4 .faq-item-static {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
    padding: 20px 25px;
  }
  #mm-area-guide-v4 .faq-item-static .custom-h3 {
    margin-top: 0;
    margin-bottom: 15px;
    border-bottom: none;
    padding-bottom: 0;
    font-size: 1.15em;
    align-items: flex-start;
  }
  #mm-area-guide-v4 .faq-item-static .custom-h3::before {
    display: none; /* デフォルトのオレンジ丸を消す */
  }
  #mm-area-guide-v4 .faq-q-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background-color: #3182ce;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    font-size: 0.85em;
    margin-right: 12px;
    flex-shrink: 0;
    margin-top: 2px;
  }
  #mm-area-guide-v4 .faq-answer-static p:first-child {
    font-weight: bold;
    color: #2d3748;
    background-color: #f8fafc;
    padding: 12px 15px;
    border-left: 4px solid #ed8936;
    margin-bottom: 15px;
  }
  #mm-area-guide-v4 .faq-answer-static p:last-child {
    margin-bottom: 0;
  }

    /* -----------------------------------------
       タブレット＆スマホ用（画面幅1024px以下すべて）
       ----------------------------------------- */
    @media (max-width: 1024px) {
        #mm-area-guide-v4 .page-top-btn {
            /* 横位置: 常にLINEアイコンの真上に来るように「25px」に固定 */
            /* （もし微妙に左右にズレる場合は、この数値を1〜2px調整してください） */
            right: 25px;   
            
            /* 縦位置: 縦向きでちょうど良かった元の間隔 */
            bottom: 90px;  
            
            width: 45px;
            height: 45px;
        }
    }

    /* -----------------------------------------
       横向き（ランドスケープ）専用の高さ調整
       ----------------------------------------- */
    @media (max-width: 1024px) and (orientation: landscape) {
        #mm-area-guide-v4 .page-top-btn {
            /* 横向きの時だけ上に持ち上げて間隔を広げる（元は90px） */
            bottom: calc(115px + env(safe-area-inset-bottom));
            
            /* 横位置は縦向きと同じ（常にLINEの真上） */
            right: 25px; 
        }
    }

    /* =========================================
       レスポンシブ調整 (スマホ・タブレット向け最適化)
       ========================================= */
    @media (max-width: 768px) {
        /* 全体・見出し・余白 */
        #mm-area-guide-v4 section { margin-bottom: 50px; }
        #mm-area-guide-v4 h1 { font-size: 1.5em; margin-bottom: 20px; line-height: 1.3; }
        #mm-area-guide-v4 h2.custom-h2 { font-size: 1.3em; padding: 12px 15px; margin-top: 40px; margin-bottom: 20px; }
        #mm-area-guide-v4 h3.custom-h3 { font-size: 1.1em; margin-top: 35px; }
        
        /* スマホではPC用の改行を無効化（非表示）にする */
        #mm-area-guide-v4 .pc-only {
            display: none;
        }
        
        /* 目次 */
        #mm-area-guide-v4 .custom-toc { padding: 15px; }

        /* 装飾ボックス */
        #mm-area-guide-v4 .custom-box { padding: 15px; margin: 25px 0; }
        
        /* エリアカード */
        #mm-area-guide-v4 .area-card { padding: 16px; margin-bottom: 20px; }
        #mm-area-guide-v4 .area-card-title { font-size: 1.2em; }
        
        /* フィルターボタン関連 */
        #mm-area-guide-v4 .area-filter-wrapper { padding: 12px; }
        #mm-area-guide-v4 .area-filter-header { 
            flex-direction: column; /* 縦並びに */
            align-items: flex-start; 
            gap: 10px; 
        }
        #mm-area-guide-v4 .area-filter-btn { padding: 6px 12px; font-size: 0.8em; }

        /* ボタン類を幅100%にして縦に積む */
        #mm-area-guide-v4 .action-buttons { flex-direction: column; width: 100%; gap: 8px; }
        #mm-area-guide-v4 .action-buttons a { width: 100%; box-sizing: border-box; }
        #mm-area-guide-v4 .compact-cta-buttons { flex-direction: column; width: 100%; gap: 8px; }
        #mm-area-guide-v4 .compact-cta-buttons a { width: 100%; box-sizing: border-box; }

        /* マップ (スマホでは高さを抑える) */
        #mm-area-guide-v4 .mm-map-wrapper { height: 350px; }
        #mm-area-guide-v4 .mm-map-note { margin-bottom: 40px; }

        /* 目的別リスト（2列を1列に） */
        #mm-area-guide-v4 .lifestyle-area-list { grid-template-columns: 1fr; gap: 10px; }
        #mm-area-guide-v4 .lifestyle-area-list li { padding: 12px 35px 12px 12px; }

        /* メディアリスト（スマホ対応：画像を少し小さくして間隔を詰める） */
        #mm-area-guide-v4 .media-list li { gap: 15px; }
        #mm-area-guide-v4 .media-list-img { flex: 0 0 80px; max-width: 80px; }
        #mm-area-guide-v4 .media-list-content strong { font-size: 1em; }
        #mm-area-guide-v4 .media-list-content p { font-size: 0.9em; }

        /* テーブル */
        #mm-area-guide-v4 .custom-table th, #mm-area-guide-v4 .custom-table td { padding: 10px; font-size: 0.9em; }
        #mm-area-guide-v4 .custom-table-wrapper::before {
          content: "※表は横にスクロールできます →";
          display: inline-block; /* blockから変更 */
          position: sticky;
          left: 0;
          font-size: 0.8em;
          color: #718096;
          padding-bottom: 8px;
          padding-right: 4px;
          font-weight: bold;
        }

        /* フッターナビ */
        #mm-area-guide-v4 .footer-nav { padding: 20px; margin: 30px 0; }
        #mm-area-guide-v4 .nav-grid { grid-template-columns: 1fr; } /* 確実にはみ出さないよう1列に */
        
        /* 超シンプルエリアナビ */
        #mm-area-guide-v4 .mm-simple-area-nav { padding: 12px; gap: 6px; }
        #mm-area-guide-v4 .mm-simple-area-nav .nav-parent { width: 100%; font-size: 0.9em; margin-bottom: 4px; }
        #mm-area-guide-v4 .mm-simple-area-nav .mm-simple-link { font-size: 0.85em; margin: 1px 0; padding: 4px 8px; }

        /* トップへ戻るボタン */
        #mm-area-guide-v4 .page-top-btn {
            right: 20px;
            bottom: calc(90px + env(safe-area-inset-bottom));
            width: 45px;
            height: 45px;
        }

        /* スマホ用FAQ調整 */
        #mm-area-guide-v4 .faq-item-static { padding: 15px; }
        #mm-area-guide-v4 .faq-item-static .custom-h3 { font-size: 1.05em; margin-bottom: 10px; }
        #mm-area-guide-v4 .faq-answer-static p:first-child { padding: 10px 12px; font-size: 0.9em; }
        #mm-area-guide-v4 .faq-q-icon { width: 20px; height: 20px; font-size: 0.8em; margin-right: 10px; }
    }/* End custom CSS */