/* 市町村検索コンボボックス */
.muni-search {
    position: relative;
    width: 100%;
}

/* トリガー（選択値表示エリア） */
.muni-search__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 1.2rem;
    padding-right: .6rem;
    height: 4.8rem;
    font-size: var(--fs_s);
    border: 1px solid var(--col_gray-border);
    border-radius: .3rem;
    background: var(--col_white);
    cursor: pointer;
    user-select: none;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.muni-search__trigger::after {
    font-family: "Material Symbols Outlined";
    content: "\e5c5";
    font-size: 1.4em;
    color: var(--col_gray);
}
.muni-search.open .muni-search__trigger::after {
    transform: rotate(180deg);
}
.muni-search.open .muni-search__trigger {
    border: 1px solid var(--col_green-04);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

/* ドロップダウンパネル */
.muni-search__dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid var(--col_green-04);
    border-top-width: 0;
    border-radius: 0 0 .3rem .3rem;
    z-index: 10;
    box-shadow: 0 .6rem 1.2rem rgba(0, 0, 0, .06);
}
.muni-search.open .muni-search__dropdown {
    display: block;
}

/* 検索インプット */
.muni-search__input {
    display: block;
    width: 100%;
    padding: .9rem 1.2rem;
    border: none;
    border-bottom: 1px solid var(--col_gray-border);
    outline: none;
    font-size: var(--fs_s);
    box-sizing: border-box;
    background: var(--col_gray-lighter);
}
.muni-search__input:focus {
    background: var(--col_gray-lightest);
}

/* 選択肢リスト */
.muni-search__list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 26rem;
    overflow-y: auto;
}
.muni-search__item {
    display: flex;
    align-items: center;
    height: 4.2rem;
    padding: 0 1.2rem;
    font-size: var(--fs_s);
    cursor: pointer;
}
.muni-search__item:hover {
    background: var(--col_gray-lighter);
}
.muni-search__item.selected {
    background: var(--col_gray-lighter);
}
.muni-search__item.selected:hover {
    background: var(--col_gray-border);
}
.muni-search__item--empty {
    color: var(--col_gray-light);
}

/* =====================================================================
 * /local_specialty 詳細ページ 横はみ出し対策
 * ---------------------------------------------------------------------
 * 本文（管理画面入力の生HTML）やリンクが幅広だとページ自体が横スクロール状態になり、
 * position:fixed のいいねモーダルも「広がったレイアウト幅」基準で配置されるため、
 * Android(Chromium) では可視画面の右にはみ出して見える。
 * （ページ固有クラス .detail_municipalities_furusato には元々CSSが無く、
 *   幅広コンテンツが野放しになっていた。ここで幅を抑える）
 * ===================================================================== */

/* 長いURL/リンク名が display:table で横に伸びるのを防ぐ */
.detail_municipalities_furusato .content_area .content_block .web {
    display: inline-block;
    max-width: 100%;
    word-break: break-all;
    overflow-wrap: anywhere;
}

/* 本文中の画像・表がコンテナ幅を超えないように */
.detail_municipalities_furusato .content_area img {
    max-width: 100%;
}
.detail_municipalities_furusato .content_area table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
}

/* 本文の長い文字列（URL等）の折り返し保険 */
.detail_municipalities_furusato .content_area {
    overflow-wrap: anywhere;
    word-break: break-word;
}