/**
 * Multi Clinic DB - 共通ベーススタイル
 *
 * CSS変数 (--mcdb-*) を使用し、DB Configから注入されるカラースキームに対応。
 * 既存の taxonomy-area.php / portal-mynavi.css スタイルを移植・変数化。
 */

/* === CSS変数のデフォルト === */
:root {
    --mcdb-primary: #333333;
    --mcdb-accent: #666666;
    --mcdb-text: #333333;
    --mcdb-bg: #ffffff;
}

/* === パンくずリスト === */
.mcdb-breadcrumbs {
    margin: 16px 0;
    font-size: 13px;
    color: #666;
}
.mcdb-breadcrumbs .breadcrumb-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.mcdb-breadcrumbs .breadcrumb-item {
    display: inline-flex;
    align-items: center;
}
.mcdb-breadcrumbs .breadcrumb-item a {
    color: var(--mcdb-primary);
    text-decoration: none;
}
.mcdb-breadcrumbs .breadcrumb-item a:hover {
    text-decoration: underline;
}
.mcdb-breadcrumbs .separator {
    margin: 0 4px;
    color: #999;
}

/* === ページヘッダー === */
.area-page-header {
    margin-bottom: 24px;
}
.area-page-title {
    font-size: 22px;
    font-weight: bold;
    color: var(--mcdb-text);
    margin-bottom: 12px;
    line-height: 1.5;
}
.area-page-description {
    font-size: 15px;
    line-height: 1.8;
    color: #555;
    margin-bottom: 16px;
}

/* === この記事でわかること === */
.article-summary-inline {
    background: var(--mcdb-bg);
    border: 2px solid var(--mcdb-primary);
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 24px;
}
.summary-badge {
    font-weight: bold;
    color: var(--mcdb-primary);
    margin-bottom: 8px;
    font-size: 14px;
}
.summary-list-inline {
    margin: 0;
    padding-left: 20px;
}
.summary-list-inline li {
    font-size: 14px;
    line-height: 1.8;
    color: var(--mcdb-text);
}

/* === アコーディオン === */
.common-content-section {
    margin-bottom: 16px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
}
.common-accordion-toggle {
    width: 100%;
    background: #f8f8f8;
    border: none;
    padding: 16px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
}
.common-accordion-toggle:hover {
    background: #f0f0f0;
}
.common-accordion-toggle .toggle-title {
    font-size: 16px;
    font-weight: bold;
    color: var(--mcdb-text);
}
.common-accordion-toggle .toggle-hint {
    font-size: 12px;
    color: #999;
    display: block;
    margin-top: 4px;
}
.common-accordion-toggle .toggle-icon {
    font-size: 14px;
    color: #999;
    transition: transform 0.3s;
}
.common-accordion-toggle[aria-expanded="true"] .toggle-icon {
    transform: rotate(180deg);
}
.common-accordion-content {
    display: none;
    padding: 16px;
}
.common-content-body {
    font-size: 15px;
    line-height: 1.8;
    color: #444;
}

/* === 子エリアナビゲーション === */
.child-area-navigation {
    margin-bottom: 24px;
}
.area-nav-block {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    margin-bottom: 8px;
    overflow: hidden;
}
.area-nav-accordion-toggle {
    width: 100%;
    background: #fff;
    border: none;
    padding: 12px 16px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.area-nav-accordion-toggle .toggle-title {
    font-weight: bold;
    font-size: 14px;
    color: var(--mcdb-text);
}
.area-nav-accordion-toggle .item-count-badge {
    background: var(--mcdb-primary);
    color: #fff;
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 10px;
    margin-left: 8px;
}
.area-nav-accordion-content {
    display: none;
    padding: 0 16px 16px;
}
.area-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.area-nav-item a {
    display: inline-block;
    padding: 6px 12px;
    background: #f5f5f5;
    border-radius: 4px;
    color: var(--mcdb-primary);
    text-decoration: none;
    font-size: 13px;
}
.area-nav-item a:hover {
    background: var(--mcdb-primary);
    color: #fff;
}
.area-nav-item .item-count {
    color: #999;
    font-size: 12px;
}

/* === セクションタイトル === */
.section-title {
    font-size: 20px;
    font-weight: bold;
    color: var(--mcdb-text);
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 3px solid var(--mcdb-primary);
}

/* === 比較テーブル（参考: afterpill.ashitano.clinic 準拠） === */
.clinic-comparison-wrapper {
    margin-bottom: 32px;
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.scroll-hint-text {
    text-align: center;
    font-size: 11px;
    color: #999;
    margin-bottom: 12px;
    font-weight: 500;
    letter-spacing: 0.05em;
}
.clinic-comparison-table-container {
    position: relative;
    overflow: auto visible;
    -webkit-overflow-scrolling: touch;
    border-radius: 8px;
    border: 1px solid #e8e8e8;
}
.clinic-comparison-table {
    width: 100%;
    min-width: 800px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 11px;
    background: #fff;
}
/* thead sticky */
.clinic-comparison-table thead {
    position: sticky;
    top: 0;
    z-index: 2;
}
.clinic-comparison-table th {
    background: #f5f7fa;
    color: var(--mcdb-text, #333);
    font-weight: 600;
    padding: 8px 10px;
    text-align: center;
    border-bottom: 2px solid #e0e0e0;
    white-space: nowrap;
    font-size: 11px;
    letter-spacing: 0.02em;
    min-width: 100px;
}
/* 項目列（左固定） */
.clinic-comparison-table th.fixed-column {
    position: sticky;
    left: 0;
    z-index: 3;
    background: color-mix(in srgb, var(--mcdb-primary) 12%, #fff);
    color: var(--mcdb-primary);
    border-right: 2px solid var(--mcdb-primary);
    text-align: center;
    min-width: 80px;
    max-width: 80px;
}
.clinic-comparison-table td {
    padding: 8px 10px;
    text-align: center;
    border-bottom: 1px solid #f0f0f0;
    white-space: nowrap;
    font-size: 11px;
    color: #555;
    min-width: 100px;
    transition: background-color 0.15s;
}
.clinic-comparison-table td.fixed-column {
    position: sticky;
    left: 0;
    z-index: 1;
    background: #fff;
    border-right: 2px solid #e0e0e0;
    text-align: center;
    font-weight: 600;
    min-width: 80px;
    max-width: 80px;
    color: var(--mcdb-text, #333);
}
/* ホバー行 */
.clinic-comparison-table tbody tr:hover td {
    background-color: #f8fafb;
}
.clinic-comparison-table tbody tr:hover td.fixed-column {
    background-color: color-mix(in srgb, var(--mcdb-primary) 8%, #fff);
}
/* ◯ / — */
.clinic-comparison-table td.available {
    color: var(--mcdb-primary);
    font-weight: 600;
}
.clinic-comparison-table td.unavailable {
    color: #ccc;
}
/* 診療時間セル */
.clinic-comparison-table td.hours-cell {
    font-size: 10px;
    white-space: normal;
    min-width: 100px;
    max-width: 150px;
    line-height: 1.4;
    text-align: center;
    padding: 6px 8px;
}

/* === クリニック無しメッセージ === */
.no-clinics-message {
    text-align: center;
    padding: 40px 20px;
    color: #999;
    font-size: 15px;
    background: #f9f9f9;
    border-radius: 8px;
}

/* === ページネーション === */
.mcdb-pagination {
    margin: 32px 0;
    text-align: center;
}
.pagination-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: inline-flex;
    gap: 4px;
}
.pagination-item a,
.pagination-item .current {
    display: inline-block;
    padding: 8px 14px;
    border: 1px solid #ddd;
    border-radius: 4px;
    text-decoration: none;
    font-size: 14px;
    color: var(--mcdb-text);
}
.pagination-item a:hover {
    background: var(--mcdb-primary);
    color: #fff;
    border-color: var(--mcdb-primary);
}
.pagination-current .current {
    background: var(--mcdb-primary);
    color: #fff;
    border-color: var(--mcdb-primary);
}

/* === 地方別都道府県リスト === */
.prefecture-list-section {
    margin-bottom: 32px;
}
.region-block {
    margin-bottom: 24px;
}
.region-title {
    font-size: 18px;
    font-weight: bold;
    color: var(--mcdb-text);
    margin-bottom: 12px;
    padding-left: 12px;
    border-left: 4px solid var(--mcdb-primary);
}
.prefecture-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.prefecture-item a {
    display: inline-block;
    padding: 8px 16px;
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    color: var(--mcdb-text);
    text-decoration: none;
    font-size: 14px;
    transition: all 0.2s;
}
.prefecture-item a:hover {
    background: var(--mcdb-primary);
    color: #fff;
    border-color: var(--mcdb-primary);
}

/* === DB固有ヘッダーバー === */
.mcdb-header-bar {
    color: #fff;
    padding: 0;
    margin-bottom: 0;
}
.mcdb-header-bar__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.mcdb-header-bar__brand {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    font-size: 16px;
}
.mcdb-header-bar__brand:hover {
    opacity: 0.85;
    color: #fff;
}
.mcdb-header-bar__logo {
    height: 28px;
    width: auto;
}
.mcdb-header-bar__nav {
    display: flex;
    gap: 16px;
}
.mcdb-header-bar__nav-link {
    color: rgba(255,255,255,0.9);
    text-decoration: none;
    font-size: 14px;
    padding: 4px 8px;
    border-radius: 4px;
    transition: background 0.2s;
}
.mcdb-header-bar__nav-link:hover {
    background: rgba(255,255,255,0.15);
    color: #fff;
}

/* === DB固有フッターバー === */
.mcdb-footer-bar {
    color: #fff;
    padding: 0;
    margin-top: 40px;
}
.mcdb-footer-bar__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    text-align: center;
}
.mcdb-footer-bar__nav {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}
.mcdb-footer-bar__link {
    color: rgba(255,255,255,0.85);
    text-decoration: none;
    font-size: 13px;
}
.mcdb-footer-bar__link:hover {
    color: #fff;
    text-decoration: underline;
}
.mcdb-footer-bar__copyright {
    font-size: 12px;
    color: rgba(255,255,255,0.7);
}

/* === ポータル固有スタイル === */
.mcdb-portal-hero {
    background: linear-gradient(135deg, var(--mcdb-primary), var(--mcdb-accent));
    color: #fff;
    border-radius: 12px;
    padding: 48px 24px;
    text-align: center;
    margin-bottom: 32px;
}
.mcdb-portal-hero__title {
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 12px;
}
.mcdb-portal-hero__subtitle {
    font-size: 16px;
    opacity: 0.9;
    margin-bottom: 24px;
}
.mcdb-portal-hero__cta {
    display: inline-block;
    padding: 12px 32px;
    background: #fff;
    color: var(--mcdb-primary);
    border-radius: 30px;
    text-decoration: none;
    font-weight: bold;
    font-size: 15px;
    transition: transform 0.2s, box-shadow 0.2s;
}
.mcdb-portal-hero__cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.mcdb-portal-section-title {
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    color: var(--mcdb-text);
    margin-bottom: 24px;
}

.mcdb-portal-features {
    margin-bottom: 40px;
}
.mcdb-portal-features__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}
.mcdb-portal-feature-card {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 24px;
    text-align: center;
}
.mcdb-portal-feature-card__icon {
    font-size: 32px;
    margin-bottom: 12px;
}
.mcdb-portal-feature-card__title {
    font-size: 16px;
    font-weight: bold;
    color: var(--mcdb-text);
    margin-bottom: 8px;
}
.mcdb-portal-feature-card__text {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

.mcdb-portal-area-nav {
    margin-bottom: 40px;
}
.mcdb-portal-region-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}
.mcdb-portal-region-block__title {
    font-size: 15px;
    font-weight: bold;
    color: var(--mcdb-text);
    margin-bottom: 8px;
    padding-left: 8px;
    border-left: 3px solid var(--mcdb-primary);
}
.mcdb-portal-region-block__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.mcdb-portal-region-block__list li a {
    display: inline-block;
    padding: 4px 10px;
    font-size: 13px;
    color: var(--mcdb-primary);
    text-decoration: none;
    border-radius: 4px;
}
.mcdb-portal-region-block__list li a:hover {
    background: var(--mcdb-primary);
    color: #fff;
}
.mcdb-portal-area-nav__more {
    text-align: center;
}
.mcdb-portal-btn--outline {
    display: inline-block;
    padding: 10px 24px;
    border: 2px solid var(--mcdb-primary);
    color: var(--mcdb-primary);
    border-radius: 6px;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
}
.mcdb-portal-btn--outline:hover {
    background: var(--mcdb-primary);
    color: #fff;
}

.mcdb-portal-about {
    margin-bottom: 40px;
}
.mcdb-portal-about__content {
    font-size: 15px;
    line-height: 1.8;
    color: #555;
}

.mcdb-portal-articles {
    margin-bottom: 40px;
}
.mcdb-portal-articles__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}
.mcdb-portal-article-card {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    overflow: hidden;
}
.mcdb-portal-article-card__thumb img {
    width: 100%;
    height: 160px;
    object-fit: cover;
}
.mcdb-portal-article-card__body {
    padding: 12px 16px;
}
.mcdb-portal-article-card__date {
    font-size: 12px;
    color: #999;
}
.mcdb-portal-article-card__title {
    font-size: 15px;
    font-weight: bold;
    margin-top: 4px;
    line-height: 1.5;
}
.mcdb-portal-article-card__title a {
    color: var(--mcdb-text);
    text-decoration: none;
}
.mcdb-portal-article-card__title a:hover {
    color: var(--mcdb-primary);
}

/* =============================================
   記事ページ（Sango single.php 準拠 1カラム）
   参考: saruwakakun.com のSango記事デザイン
   body.mcdb-active でスコープし、MCDB記事ページのみに適用
   ============================================= */

/* --- ページ全体の背景 --- */
body.mcdb-active {
    background-color: #f4f5f7;
}

/* --- コンテンツエリア 1カラム制御 --- */
body.mcdb-active #content.one-column {
    max-width: 100%;
    padding-bottom: 40px;
}

body.mcdb-active #content.one-column #inner-content {
    max-width: 780px;
    margin: 0 auto;
    padding: 32px 16px 0;
}

/* --- 記事カード --- */
body.mcdb-active #entry {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    margin-bottom: 28px;
}

/* --- 記事ヘッダー（タイトル・日付・アイキャッチ） --- */
body.mcdb-active .article-header.entry-header {
    padding: 30px 36px 14px;
}

body.mcdb-active .article-header .entry-title {
    font-size: 28px;
    line-height: 1.5;
    font-weight: 700;
    color: #333;
    margin: 10px 0 0;
    letter-spacing: -0.01em;
}

/* --- 公開日・更新日（nojihata.com 準拠） --- */
body.mcdb-active .article-header .entry-meta.vcard {
    margin: 12px 0 0;
    padding: 0;
    font-size: 14px;
    color: #a5aaaf;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
body.mcdb-active .article-header .entry-meta time {
    font-size: 14px;
    color: #a5aaaf;
}
body.mcdb-active .article-header .entry-meta time::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    content: "\f017";
    margin-right: 4px;
    font-size: 13px;
}
body.mcdb-active .article-header .entry-meta time.updated::before {
    content: "\f2f1";
    font-weight: 900;
}

/* --- SNSシェアボタン 完全非表示 --- */
/* FABボタン（ヘッダー内フローティングシェア） */
body.mcdb-active .fab-btn,
body.mcdb-active .fab__close-cover,
body.mcdb-active #fab__contents,
body.mcdb-active .fab__contents-main,
body.mcdb-active .article-header > input[type="checkbox"] {
    display: none !important;
}
/* フッター内SNSシェアボタン */
body.mcdb-active .footer-contents .sns-btn,
body.mcdb-active .sns-btn,
body.mcdb-active .sns-dif,
body.mcdb-active .ss-top,
body.mcdb-active .ss-bottom {
    display: none !important;
}
/* SHAREラベル（FAB展開時のテキスト） */
body.mcdb-active .share-label,
body.mcdb-active .share_txt {
    display: none !important;
}

/* --- パンくずリスト（nojihata.com 準拠・FA5アイコン付き） --- */
body.mcdb-active #breadcrumb.breadcrumb {
    margin: 0 0 6px;
    padding: 0;
    font-size: 14px;
    line-height: 1.5;
}
body.mcdb-active #breadcrumb.breadcrumb ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
body.mcdb-active #breadcrumb.breadcrumb li {
    display: inline !important;
    font-size: 14px;
    color: #808080;
}
/* セパレータ: Font Awesome 5 angle-right (\f105) */
body.mcdb-active #breadcrumb.breadcrumb li::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f105";
    padding: 0 6px;
    color: rgba(0, 0, 0, 0.2);
    font-size: 13px;
}
body.mcdb-active #breadcrumb.breadcrumb li:last-child::after {
    display: none;
}
/* ホームアイコン: Font Awesome 5 home (\f015) */
body.mcdb-active #breadcrumb.breadcrumb li:first-child a::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f015";
    margin-right: 4px;
    font-size: 14px;
}
body.mcdb-active #breadcrumb.breadcrumb a {
    color: var(--mcdb-primary);
    text-decoration: none;
    font-size: 14px;
}
body.mcdb-active #breadcrumb.breadcrumb a:hover {
    text-decoration: underline;
}
body.mcdb-active #breadcrumb.breadcrumb span[itemprop="name"] {
    font-size: 14px;
}

/* アイキャッチ画像 */
body.mcdb-active .article-header .post-thumbnail,
body.mcdb-active .article-header .eye-catch {
    margin: 16px -32px 0;
}
body.mcdb-active .article-header .post-thumbnail img,
body.mcdb-active .article-header .eye-catch img {
    width: 100%;
    height: auto;
    display: block;
}

/* --- 記事本文 --- */
body.mcdb-active .entry-content {
    padding: 16px 36px 8px;
    font-size: 16.5px;
    line-height: 1.9;
    color: #333;
    word-break: break-word;
    overflow-wrap: break-word;
}

body.mcdb-active .entry-content p {
    margin: 0 0 24px;
}

/* 見出し h2 */
body.mcdb-active .entry-content h2 {
    font-size: 22px;
    font-weight: 700;
    color: #333;
    margin: 48px 0 20px;
    padding: 14px 18px;
    background: #f0f4f8;
    border-left: 4px solid var(--mcdb-primary);
    border-radius: 0 4px 4px 0;
    line-height: 1.5;
}

/* 見出し h3 */
body.mcdb-active .entry-content h3 {
    font-size: 19px;
    font-weight: 700;
    color: #333;
    margin: 40px 0 16px;
    padding: 8px 0 8px 14px;
    border-left: 3px solid var(--mcdb-primary);
    line-height: 1.5;
}

/* 見出し h4 */
body.mcdb-active .entry-content h4 {
    font-size: 17px;
    font-weight: 700;
    color: #333;
    margin: 32px 0 12px;
    line-height: 1.5;
}

/* リスト */
body.mcdb-active .entry-content ul,
body.mcdb-active .entry-content ol {
    margin: 0 0 24px;
    padding-left: 24px;
}
body.mcdb-active .entry-content li {
    margin-bottom: 8px;
    line-height: 1.8;
}

/* 引用 */
body.mcdb-active .entry-content blockquote {
    margin: 24px 0;
    padding: 20px 24px;
    background: #f9f9f9;
    border-left: 4px solid #ddd;
    border-radius: 0 4px 4px 0;
    color: #555;
    font-style: italic;
}
body.mcdb-active .entry-content blockquote p:last-child {
    margin-bottom: 0;
}

/* コードブロック */
body.mcdb-active .entry-content pre {
    margin: 24px 0;
    padding: 20px;
    background: #282c34;
    color: #abb2bf;
    border-radius: 6px;
    overflow-x: auto;
    font-size: 14px;
    line-height: 1.6;
}
body.mcdb-active .entry-content code {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 0.9em;
}
body.mcdb-active .entry-content p code,
body.mcdb-active .entry-content li code {
    background: #f0f0f0;
    padding: 2px 6px;
    border-radius: 3px;
    color: #e74c3c;
}

/* 画像 */
body.mcdb-active .entry-content img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}
body.mcdb-active .entry-content .wp-block-image {
    margin: 24px 0;
}

/* テーブル */
body.mcdb-active .entry-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 24px 0;
    font-size: 15px;
}
body.mcdb-active .entry-content table th,
body.mcdb-active .entry-content table td {
    border: 1px solid #e0e0e0;
    padding: 10px 14px;
    text-align: left;
}
body.mcdb-active .entry-content table th {
    background: #f5f7fa;
    font-weight: 700;
    color: #333;
}
body.mcdb-active .entry-content table tr:nth-child(even) td {
    background: #fafbfc;
}

/* リンク */
body.mcdb-active .entry-content a {
    color: var(--mcdb-primary);
    text-decoration: underline;
    text-decoration-color: rgba(0,0,0,0.15);
    text-underline-offset: 3px;
}
body.mcdb-active .entry-content a:hover {
    text-decoration-color: var(--mcdb-primary);
}

/* --- SNSシェアボタン --- */
body.mcdb-active .article-footer,
body.mcdb-active .entry-footer {
    padding: 8px 36px 28px;
}

body.mcdb-active .share-btn-list,
body.mcdb-active .sns-btn {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

/* --- 前後の記事リンク --- */
body.mcdb-active .prev-next-entry,
body.mcdb-active .post-navigation {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    margin-bottom: 28px;
    padding: 20px 24px;
}

/* --- 関連記事・著者情報 --- */
body.mcdb-active .related-box,
body.mcdb-active .author-box {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    margin-bottom: 28px;
    padding: 24px;
}

/* --- コメントセクション --- */
body.mcdb-active #comments {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    padding: 24px;
    margin-bottom: 28px;
}

/* --- フッターバーとの接続 --- */
body.mcdb-active .mcdb-footer-bar {
    margin-top: 0;
}

/* =============================================
   クリニックカード型カセット（エリアページ）
   ============================================= */

/* カードリスト全体 */
.clinic-card-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 32px;
}

/* 個別カード */
.clinic-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.2s;
}
.clinic-card:hover {
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}
.clinic-card.neighbor-clinic {
    border-left: 3px solid #f0ad4e;
}

/* カード内パディング */
.clinic-card-inner {
    padding: 20px 24px;
}

/* クリニック名 */
.clinic-name {
    font-size: 18px;
    font-weight: 700;
    color: var(--mcdb-text);
    margin: 0 0 8px;
    line-height: 1.5;
    display: flex;
    align-items: baseline;
    gap: 8px;
}
.clinic-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    min-width: 28px;
    background: var(--mcdb-primary);
    color: #fff;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
}

/* 最寄り駅 */
.clinic-stations {
    font-size: 13px;
    color: #666;
    margin-bottom: 10px;
    padding-left: 36px;
}
.clinic-stations .station-label {
    font-weight: 600;
    color: #555;
    margin-right: 4px;
}

/* 特徴タグ */
.clinic-feature-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 12px;
    padding-left: 36px;
}
.feature-tag {
    display: inline-block;
    padding: 3px 10px;
    background: var(--mcdb-bg, #f0f7ff);
    border: 1px solid var(--mcdb-primary);
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    color: var(--mcdb-primary);
    line-height: 1.5;
}

/* 詳しい特徴アコーディオン */
.clinic-feature-detail {
    margin-bottom: 14px;
}
.feature-accordion-toggle {
    width: 100%;
    background: #f8f8f8;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    padding: 10px 16px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--mcdb-text);
}
.feature-accordion-toggle:hover {
    background: #f0f0f0;
}
.feature-accordion-toggle .toggle-icon {
    font-size: 12px;
    color: #999;
    transition: transform 0.3s;
}
.feature-accordion-content {
    display: none;
    padding: 12px 0 0;
}
.feature-detail-grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 16px;
}
.feature-detail-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 12px;
    background: #fafafa;
    border-radius: 4px;
    font-size: 13px;
}
.feature-detail-label {
    color: #555;
    font-weight: 500;
}
.feature-detail-value {
    font-weight: 600;
}
.feature-detail-value.available {
    color: var(--mcdb-primary);
}
.feature-detail-value.unavailable {
    color: #ccc;
}

/* 基本情報 */
.clinic-basic-info {
    border-top: 1px solid #eee;
    padding-top: 14px;
    margin-bottom: 14px;
}
.clinic-basic-info .info-item {
    display: flex;
    align-items: flex-start;
    padding: 8px 0;
    font-size: 14px;
    line-height: 1.6;
}
.clinic-basic-info .info-item + .info-item {
    border-top: 1px dashed #eee;
}
.clinic-basic-info .info-label {
    min-width: 80px;
    font-weight: 600;
    color: #555;
    flex-shrink: 0;
}
.clinic-basic-info .info-value {
    color: var(--mcdb-text);
    word-break: break-all;
}
.clinic-basic-info .phone-link {
    color: var(--mcdb-primary);
    text-decoration: none;
    font-weight: 600;
}
.clinic-basic-info .phone-link:hover {
    text-decoration: underline;
}

/* 診療時間テーブル */
.clinic-hours-table-wrap {
    margin: 14px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.clinic-hours-table-heading {
    font-size: 14px;
    font-weight: 700;
    color: var(--mcdb-text, #333);
    margin: 0 0 8px;
    padding: 0;
}
.clinic-hours-table-wrap table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    text-align: center;
    table-layout: fixed;
}
.clinic-hours-table-wrap table thead tr {
    background: var(--mcdb-primary, #2271b1);
    color: #fff;
}
.clinic-hours-table-wrap table thead th,
.clinic-hours-table-wrap table thead td {
    padding: 8px 4px;
    font-weight: 600;
    font-size: 12px;
    border: 1px solid rgba(255,255,255,.2);
}
.clinic-hours-table-wrap table tbody th {
    background: #f8f8f8;
    font-weight: 600;
    font-size: 12px;
    padding: 8px 6px;
    text-align: left;
    white-space: nowrap;
    border: 1px solid #e0e0e0;
}
.clinic-hours-table-wrap table tbody td {
    padding: 8px 4px;
    border: 1px solid #e0e0e0;
    font-size: 14px;
}
/* ● マーク（正常診療） */
.clinic-hours-table-wrap .hour_mark_normal {
    color: var(--mcdb-primary, #2271b1);
    font-weight: 700;
}
/* 休診マーク */
.clinic-hours-table-wrap .hour_mark_none {
    color: #ccc;
}
/* △ マーク（時短等） */
.clinic-hours-table-wrap .hour_mark_short {
    color: #e6a700;
    font-weight: 700;
}
/* 土日祝カラム */
.clinic-hours-table-wrap .hour_sat {
    background: rgba(33, 150, 243, .05);
}
.clinic-hours-table-wrap .hour_sun,
.clinic-hours-table-wrap .hour_hol {
    background: rgba(244, 67, 54, .05);
}

/* DB固有カスタムフィールド（textarea/html型の自動表示） */
.clinic-custom-field-section {
    margin: 14px 0;
    padding: 16px 18px;
    background: #f8fafb;
    border-left: 4px solid var(--mcdb-accent, #5a4fcf);
    border-radius: 0 4px 4px 0;
}
.clinic-custom-field-heading {
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--mcdb-text, #333);
}
.clinic-custom-field-body {
    font-size: 14px;
    line-height: 1.75;
    color: #555;
}
.clinic-custom-field-body p {
    margin: 0 0 6px;
}
.clinic-custom-field-body p:last-child {
    margin-bottom: 0;
}

/* クリニック説明文 */
.clinic-description-section {
    margin: 14px 0;
    padding: 16px 18px;
    background: #f8fafb;
    border-left: 4px solid var(--mcdb-primary, #2271b1);
    border-radius: 0 4px 4px 0;
}
.clinic-description-heading {
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--mcdb-text, #333);
}
.clinic-description-body {
    font-size: 14px;
    line-height: 1.75;
    color: #555;
}
.clinic-description-body p {
    margin: 0 0 6px;
}
.clinic-description-body p:last-child {
    margin-bottom: 0;
}

/* 口コミセクション */
.clinic-reviews-section {
    margin: 14px 0;
}
.clinic-reviews-heading {
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 10px;
    color: var(--mcdb-text, #333);
}
.clinic-reviews-body {
    font-size: 14px;
    line-height: 1.75;
    color: #555;
}

/* Google Map */
.clinic-map-section {
    margin-bottom: 14px;
}
.lazy-map {
    width: 100%;
    height: 250px;
    background: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 8px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.map-placeholder {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #888;
}
.map-placeholder svg {
    display: block;
    margin: 0 auto 8px;
}
.map-placeholder span {
    font-size: 14px;
    font-weight: 500;
}

/* 公式サイトボタン */
.clinic-actions {
    text-align: center;
    padding-top: 4px;
}
.btn-official-site {
    display: inline-block;
    width: 100%;
    max-width: 360px;
    padding: 14px 24px;
    background: var(--mcdb-primary);
    color: #fff;
    border-radius: 8px;
    text-decoration: none;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    transition: background 0.2s, transform 0.15s;
}
.btn-official-site:hover {
    background: var(--mcdb-accent);
    color: #fff;
    transform: translateY(-1px);
}

/* 親エリアに戻るボタン */
.btn-back-parent {
    display: inline-block;
    padding: 8px 20px;
    border: 2px solid var(--mcdb-primary);
    color: var(--mcdb-primary);
    border-radius: 6px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
}
.btn-back-parent:hover {
    background: var(--mcdb-primary);
    color: #fff;
}

/* 関連エリアセクション */
.related-areas-section {
    margin-top: 32px;
    margin-bottom: 16px;
}
.related-area-subtitle {
    font-size: 15px;
    font-weight: 600;
    color: var(--mcdb-text);
    margin-bottom: 10px;
    padding-left: 10px;
    border-left: 3px solid var(--mcdb-primary);
}
.related-area-block {
    margin-bottom: 16px;
}
.related-area-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.related-area-item a {
    display: inline-block;
    padding: 6px 12px;
    background: #f5f5f5;
    border-radius: 4px;
    color: var(--mcdb-primary);
    text-decoration: none;
    font-size: 13px;
}
.related-area-item a:hover {
    background: var(--mcdb-primary);
    color: #fff;
}

/* === レスポンシブ === */
@media (max-width: 768px) {
    .area-page-title {
        font-size: 18px;
    }
    /* 比較テーブル モバイル */
    .clinic-comparison-wrapper {
        margin-bottom: 24px;
        padding: 12px;
        border-radius: 10px;
    }
    .scroll-hint-text {
        font-size: 10px;
        margin-bottom: 10px;
    }
    .clinic-comparison-table-container {
        border-radius: 6px;
    }
    .clinic-comparison-table {
        font-size: 10px;
        min-width: 600px;
    }
    .clinic-comparison-table th {
        padding: 6px;
        font-size: 9px;
        min-width: 70px;
    }
    .clinic-comparison-table th.fixed-column {
        min-width: 60px;
        max-width: 60px;
        font-size: 9px;
        padding: 6px 4px;
    }
    .clinic-comparison-table td {
        padding: 6px;
        font-size: 10px;
        min-width: 70px;
    }
    .clinic-comparison-table td.fixed-column {
        min-width: 60px;
        max-width: 60px;
        font-size: 9px;
        padding: 6px 4px;
    }
    .clinic-comparison-table td.hours-cell {
        font-size: 8px;
        min-width: 70px;
        max-width: 100px;
        padding: 5px 4px;
        line-height: 1.3;
    }
    /* カード型カセット モバイル */
    .clinic-card-inner {
        padding: 16px;
    }
    .clinic-name {
        font-size: 16px;
    }
    .clinic-number {
        width: 24px;
        height: 24px;
        min-width: 24px;
        font-size: 12px;
    }
    .clinic-stations,
    .clinic-feature-tags {
        padding-left: 32px;
    }
    .feature-detail-grid {
        grid-template-columns: 1fr;
    }
    .clinic-basic-info .info-item {
        flex-direction: column;
        gap: 2px;
    }
    .clinic-basic-info .info-label {
        min-width: auto;
        font-size: 12px;
        color: #888;
    }
    .lazy-map {
        height: 200px;
    }
    .btn-official-site {
        font-size: 14px;
        padding: 12px 20px;
    }
    /* 比較テーブル（後方互換） */
    .clinic-comparison-table th,
    .clinic-comparison-table td {
        padding: 8px;
        min-width: 100px;
        font-size: 13px;
    }
    .prefecture-item a {
        padding: 6px 12px;
        font-size: 13px;
    }
    /* ヘッダーバー */
    .mcdb-header-bar__inner {
        flex-direction: column;
        gap: 8px;
        padding: 8px 16px;
    }
    .mcdb-header-bar__nav {
        gap: 8px;
    }
    .mcdb-header-bar__nav-link {
        font-size: 13px;
    }
    /* ポータル */
    .mcdb-portal-hero {
        padding: 32px 16px;
    }
    .mcdb-portal-hero__title {
        font-size: 22px;
    }
    .mcdb-portal-section-title {
        font-size: 18px;
    }
    /* 記事ページ モバイル */
    body.mcdb-active #content.one-column #inner-content {
        padding: 12px 0 0;
    }
    body.mcdb-active #entry {
        border-radius: 0;
        box-shadow: none;
        border-top: 1px solid #e8e8e8;
        border-bottom: 1px solid #e8e8e8;
    }
    body.mcdb-active .article-header.entry-header {
        padding: 20px 16px 10px;
    }
    body.mcdb-active .article-header .entry-title {
        font-size: 21px;
    }
    body.mcdb-active .article-header .post-thumbnail,
    body.mcdb-active .article-header .eye-catch {
        margin: 12px -16px 0;
    }
    body.mcdb-active .entry-content {
        padding: 12px 16px 4px;
        font-size: 15px;
    }
    body.mcdb-active .entry-content h2 {
        font-size: 19px;
        margin: 36px -16px 16px;
        padding: 12px 16px;
        border-radius: 0;
    }
    body.mcdb-active .entry-content h3 {
        font-size: 17px;
        margin: 28px 0 12px;
    }
    body.mcdb-active .article-footer,
    body.mcdb-active .entry-footer {
        padding: 8px 16px 20px;
    }
    body.mcdb-active .prev-next-entry,
    body.mcdb-active .post-navigation {
        border-radius: 0;
        box-shadow: none;
        border-top: 1px solid #e8e8e8;
        border-bottom: 1px solid #e8e8e8;
        padding: 16px;
    }
    body.mcdb-active .related-box,
    body.mcdb-active .author-box {
        border-radius: 0;
        box-shadow: none;
        padding: 16px;
    }
}
