/* =========================================
   施設案内ページ専用テーブルスタイル
   ========================================= */

/* テーブル全体の基本設定 */
.facility_table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #ccc;
    margin-bottom: 30px; /* 表ごとの間隔 */
    table-layout: fixed; /* ★重要：列幅を固定して統一する設定 */
}

/* ヘッダー（項目名）とデータセルの共通設定 */
.facility_table th,
.facility_table td {
    padding: 10px 15px;
    border: 1px solid #ccc;
    vertical-align: middle; /* 上下中央揃え */
    word-wrap: break-word;  /* 長い文字も折り返す */
}

/* ヘッダー（名称・住所・電話番号）のデザイン */
.facility_table th {
    background-color: #f5f5f5; /* 薄いグレー */
    border-bottom: 2px solid #ddd;
    text-align: left;
    font-weight: bold;
    color: #333;
}

/* ヘッダー（項目名）とデータセルの共通設定 */
.facility_table th,
.facility_table td {
    padding: 10px 15px;
    border: 1px solid #ccc;
    vertical-align: middle; /* 上下中央揃え */
    word-wrap: break-word;  /* 長い文字も折り返す */
    
    /* ★ここを追加：文字サイズを小さくする */
    font-size: 0.9rem; /* 0.85rem や 13px などお好みで調整してください */
    line-height: 1.4;  /* 行間も少し詰める */
}

/* ヘッダー（項目名）とデータセルの共通設定 */
.facility_table th,
.facility_table td {
    /* padding: 10px 15px; ← 元の余白（広め） */
    padding: 6px 8px;      /* ★ここを変更：上下6px、左右8px程度に狭める */
    
    border: 1px solid #ccc;
    vertical-align: middle;
    word-wrap: break-word;
    
    font-size: 0.9rem;     /* 文字サイズ（前回の変更） */
    line-height: 1.4;
}

/* --- テーブル内の注釈（smallタグ） --- */
.facility_table small {
    display: block;       /* 改行して表示 */
    font-size: 0.9em;     /* 文字サイズをひと回り小さく */
    color: #555;          /* 文字色をグレーに */
    margin-top: 4px;      /* 上に少し隙間を空ける */
    font-weight: normal;  /* 太字を解除 */
    line-height: 1.3;     /* 行間を少し詰める */
}


/* =========================================
   列数に応じた幅の自動調整（Quantity Query）
   ========================================= */

/* --- 3列の場合（三芳町など） --- */
/* 1列目（名称） */
.facility_table th:first-child:nth-last-child(3) {
    width: 45%;
}
/* 2列目（住所） */
.facility_table th:first-child:nth-last-child(3) ~ th:nth-child(2) {
    width: 35%;
}
/* 3列目（電話） */
.facility_table th:first-child:nth-last-child(3) ~ th:nth-child(3) {
    width: 20%;
}   

/* --- 5列の場合（ふじみ野市など） --- */
/* 1列目（名称） */
.facility_table th:first-child:nth-last-child(5) {
    width: 35%;
}
/* 2列目（住所） */
.facility_table th:first-child:nth-last-child(5) ~ th:nth-child(2) {
    width: 22%;
}
/* 3列目（電話） */
.facility_table th:first-child:nth-last-child(5) ~ th:nth-child(3) {
    width: 15%;
}
/* 4, 5列目（災害種別） */
.facility_table th:first-child:nth-last-child(5) ~ th:nth-child(n+4) {
    width: 9%; /* 18 */
}

/* --- 6列の場合（富士見市など） --- */
/* 1列目（名称） */
.facility_table th:first-child:nth-last-child(6) {
    width: 38%;
}
/* 2列目（住所） */
.facility_table th:first-child:nth-last-child(6) ~ th:nth-child(2) {
    width: 24%;
}
/* 3列目（電話） */
.facility_table th:first-child:nth-last-child(6) ~ th:nth-child(3) {
    width: 17%;
}
/* 4, 5, 6列目（災害種別） */
.facility_table th:first-child:nth-last-child(6) ~ th:nth-child(n+4) {
    width: 7%; /* 21 */
}


/* =========================================
   防災拠点（26）専用：記号列の調整
   ========================================= */

/* "disaster" クラスがついたテーブルの、4列目以降のセルにのみ適用 */
.facility_table.disaster td:nth-child(n+4) {
    /* Mac/Winで記号のバランスが良いフォントを優先 */
    font-family: "Yu Gothic", "YuGothic", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
    
    font-size: 1em;   /* 記号を1.2倍に大きく */
    text-align: center; /* 中央揃え */
    padding: 4px;       /* 記号なので余白は少し狭くてもOK */
}


/* =========================================
   医療機関リスト（27）などの4列テーブル設定
   ※スマホ対応なし・PC幅固定版
   ========================================= */

/* 1列目：名称（少し狭くしても入ります） */
.facility_table th:first-child:nth-last-child(4),
.facility_table td:first-child:nth-last-child(4) {
    width: 32%;  /* 名称 */
}

/* 2列目：住所 */
.facility_table th:first-child:nth-last-child(4) ~ th:nth-child(2),
.facility_table th:first-child:nth-last-child(4) ~ td:nth-child(2) {
    width: 30%;  /* 住所 */
}

/* 3列目：科目（文字数が多いので一番広く取る） */
.facility_table th:first-child:nth-last-child(4) ~ th:nth-child(3),
.facility_table th:first-child:nth-last-child(4) ~ td:nth-child(3) {
    width: 21%;  /* 科目 */
}

/* 4列目：電話番号 */
.facility_table th:first-child:nth-last-child(4) ~ th:nth-child(4),
.facility_table th:first-child:nth-last-child(4) ~ td:nth-child(4) {
    width: 17%;  /* 電話 */
    white-space: nowrap; /* 電話番号は折り返さない */
}

/* --- 3列目（科目）の文字サイズと改行設定 --- */
.facility_table.medical td:nth-child(3) {
    font-size: 0.8em;      /* 文字を小さく */
    line-height: 1.3;      /* 行間を詰める */
    word-wrap: break-word; /* 長い単語を折り返す */
    word-break: break-all; /* 必要なら単語の途中でも改行（横幅あふれ防止） */
}


/* =========================================
   診療科目 略称一覧 (JP27s) 用スタイル
   ========================================= */

.abbreviation_box {
    background-color: #f5f5f5; /* 背景を薄いグレーに */
    padding: 15px 20px;        /* 内側の余白 */
    margin-bottom: 40px;       /* 下の表との間隔 */
    border-radius: 4px;        /* 角を少し丸く */
    font-size: 0.8rem;        /* 文字サイズを小さく */
    line-height: 1;
}

.abbreviation_box h4 {
    margin: 0 0 15px 0;
    font-size: 0.9rem;
    border-bottom: 1px solid #ccc; /* 見出しの下線 */
    padding-bottom: 5px;
}

.abbreviation_list {
    list-style: none;          /* ・を消す */
    padding: 0;
    margin: 0;
    display: flex;             /* 横並びにする */
    flex-wrap: wrap;           /* 折り返す */
}

.abbreviation_list li {
    width: 33.33%;             /* PCでは3列 */
    box-sizing: border-box;
    padding: 1px 0px;
    display: flex;
}

/* 略称部分（太字） */
.abbreviation_list li .abbr {
    font-weight: bold;
    color: #333;
    margin-right: 2px;
    min-width: 4em;            /* 略称の幅を揃える */
}
