/**
 * File: front-style.css
 * Description: フロントエンド検索・表示ページ用のスタイルシート
 */

.medical-search-container { max-width: 900px; margin: 20px auto; font-family: sans-serif; }
.accordion-toggle { width: 100%; padding: 12px 20px; font-size: 1.1em; background-color: #f0f0f0; border: 1px solid #ccc; cursor: pointer; text-align: center; margin-bottom: 0; transition: background-color 0.2s; border-radius: 5px;}
.accordion-toggle:hover { background-color: #e0e0e0; }
.accordion-panel { padding: 1px 20px 20px 20px; border: 1px solid #ddd; border-top: none; margin-bottom: 15px; border-radius: 5px;}
.medical-search-form .search-group { border: 1px solid #eee; padding: 15px; margin-bottom: 15px; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.medical-search-form .name-search-group { display: block; padding: 10px; }
.medical-search-form .name-search-group input[type="text"] { width: 100%; max-width: 100%; box-sizing: border-box; padding: 8px; font-size: 1em; border-radius: 5px; border: 1px #8d8d8d solid;}
.medical-search-form h2 { margin-top: 20px; margin-bottom: 10px; font-size: 1.2em; border-bottom: 2px solid #0073aa; padding-bottom: 5px; }
.medical-search-form label { display: inline-block; cursor: pointer;}
.medical-search-form label:hover{ font-weight: 700;}
.districts-group .district-item { grid-column: 1 / -1; margin-bottom: 10px; }
.districts-group .district-parent { font-size: 1.1em; }
.districts-group .sub-districts { padding-left: 25px; margin-top: 5px; display: flex; flex-wrap: wrap; gap: 10px 15px; }
.search-submit { text-align: center; margin-top: 20px; }
.search-submit button, .search-submit .clear-button { padding: 10px 20px; font-size: 1.1em; border: none; cursor: pointer; }
.search-submit button { background-color: #0073aa; color: white; border-radius: 5px;}
.search-submit .clear-button { background-color: #777; color: white; text-decoration: none; margin-left: 10px; }
.search-divider { margin: 30px 0; }
.search-query-display { font-size: 1.1em; margin-bottom: 15px; padding: 10px 15px; background-color: #f0f8ff; border-left: 5px solid #0073aa; }

.search-results .result-item {
    border: 1px solid #ddd;
    padding: 15px;
    margin-bottom: 15px;
    border-radius: 5px;
}
.result-item-name {
    margin: 0 0 5px 0 !important;
    font-size: 20px;
    font-weight: bold;
	border-bottom: none !important;
}
.result-item-name a {
    text-decoration: none;
    color: #0073aa;
}
/* ★★★ 追加箇所 ★★★ */
.result-item-subjects {
    margin-bottom: 8px;
    font-size: 0.8em;
    color: #333;
    font-weight: nomal;
}
/* ★★★ 追加ここまで ★★★ */
.result-item-info {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    font-size: 0.9em;
    color: #555;
}
.result-item-address,
.result-item-phone {
    /*white-space: nowrap;*/
}
.result-item-phone a {
    color: #555;
    text-decoration: none;
}
.medical-detail-container{ max-width: 1000px; margin: 0 auto;}
.medical-detail-container .kana { color: #555; }
.detail-table { width: 100%; border-collapse: collapse; margin: 20px 0; display: table !important;}
.detail-table th, .detail-table td { padding: 12px; border: 1px solid #ddd; text-align: left; vertical-align: top; }
.detail-table th { width: 120px; background-color: #f7f7f7; font-weight: bold; }
.hours-table th {text-align: center;}
.hours-table td { text-align: center; }
.google-map-container { margin-top: 15px; }
.to_ms_top{margin: 0 0 10px 10px; display: block;}
/* ★★★ 追加箇所 ★★★ */
.google-map-container iframe {
    width: 100%;
    border: none;
}
/* ★★★ 追加ここまで ★★★ */
.hours-remarks { border: 1px solid #eee; background-color: #f9f9f9; padding: 15px; margin-top: -20px; margin-bottom: 20px; }
.hours-remarks p { margin: 0; line-height: 1.6; }
.pagination-container { margin-top: 30px; text-align: center; }
.page-numbers { display: inline-block; padding: 0; margin: 0; list-style: none; }
.page-numbers li { display: inline; }
.page-numbers a, .page-numbers span { display: inline-block; padding: 8px 14px; margin: 0 2px; border: 1px solid #ddd; text-decoration: none; color: #0073aa; background-color: #fff; border-radius: 4px; }
.page-numbers a:hover { background-color: #f0f0f0; }
.page-numbers .current { background-color: #0073aa; color: #fff; border-color: #0073aa; }

/*詳細ページや検索結果で非表示 ms_i、ms_sがms_i_no、ms_s_noに自動変更される*/
.ms_i_no{display:none;}
.ms_s_no{display:none;}

@media screen and (max-width: 768px) {
    .result-item-name { margin-bottom: 10px; font-size: 20px; }
    .result-item-info { flex-direction: column; gap: 5px; }
    .detail-table:not(.hours-table) tr { display: block; /* border-bottom: 2px solid #0073aa; */ /* padding-bottom: 10px; */ /* margin-bottom: 10px; */}
    .detail-table:not(.hours-table) th, .detail-table:not(.hours-table) td { display: block; width: 100%; box-sizing: border-box; border: none; padding: 5px 0; }
    .detail-table:not(.hours-table) th { background-color: transparent; padding-bottom: 0; }
    .detail-table:not(.hours-table) td { padding-left: 10px; }
    .hours-table { border: 1px solid #ddd; }
    .hours-table thead { /*display: none;*/ }
    .hours-table tr { /*display: block;*/ border-bottom: 1px solid #eee; margin-bottom: 15px; padding-bottom: 15px; }
    .hours-table tr:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
    .hours-table td { /*display: block;*/ text-align: left; position: relative; padding-left: 50%; border: none; }
    /*.hours-table td::before { content: attr(data-label); position: absolute; left: 10px; font-weight: bold; text-align: left; }*/
	.google-map-container iframe { min-height: 350px!important; /* スマートフォンでのデフォルトの高さ */}
}
@media screen and (min-width: 769px) {
    .google-map-container iframe { height: 299px !important; /* PCでの高さ */ }
}