@charset "utf-8";

html{font-family: 'Meiryo','Hiragino Kaku Gothic Pro','Helvetica Neue','Arial', sans-serif;}

header,footer,#container{margin: 0 5rem;}
header{}
header h1{}

header .precoution{}
.precoution .title{font-weight: 800;}
header ol{
    font-size: 0.9em;
    margin-top: 2px; 
    margin-bottom: 0px; 
    font-weight: 600;
}
header ol .caution{color: #ff0000; list-style: none;  font-weight: normal; }

#container{}
#content{}

main{}
main h2{border-bottom: solid 4px #84D8CF;margin: 1em 0;}
main .area{}

.clinic_lst{    margin: 0 2em 1em;
    border-bottom: 2px solid #84D8CF;
    padding-bottom: 1em;}
.clinic_lst summary{font-size: 1.35em;font-weight: 800;}
.clinic_lst span {display: block;margin: 0 1em;padding: 0 1em;}
.clinic_lst .cl_name {
padding-top: 0.125em;
    font-size: 1.25em;
    font-weight: 800;
    border-top: solid 2px #84D8CF;
    border-bottom: solid 2px #84D8CF;
    padding-bottom: 0.125em;
margin-top: 0.5em;
}
.clinic_lst .cl_add,
.clinic_lst .cl_tel,
.clinic_lst .cl_caution,
.clinic_lst .cl_button {
padding: 0px 50px;
line-height: 1.75;
}

.cl_caution {
    font-size: 0.75rem;
    color: red;
}

.cl_caution a {
    color: red;  /* 親要素と同じ色を継承 */
    text-decoration: underline;  /* 下線を表示 */
}

.cl_caution a:hover {
    opacity: 0.7;  /* ホバー時に少し透明に */
    text-decoration: none;  /* ホバー時に下線を消す */
}

/*-- add Higashida 20250124 --*/
details {
    cursor: pointer;
}

/*-- ボタンスタイル --*/
.header-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    display: flex;
    justify-content: space-between; /* 左右に分ける */
    align-items: center;
}

h1 {
    margin: 0; /* デフォルトのマージンを削除 */
}

 /*--20250129 Add Higashida--*/
.btn01 {
    display: inline-block;
    padding: 10px 15px;
    background-color: #0b90bd;
    color: #fff;
    text-decoration: none;
    border-radius: 2px;
    font-size: 16px;
    white-space: nowrap;
    margin-left: 20px;
    border: 1px solid #0a82aa;
    border-left: 2px solid #097797;
    border-bottom: 2px solid #097797;
}

.btn01:hover {
    background-color: #07a4d8;
}

 /*--20250314 Add Higashida--*/
 .btn_link {
    display: inline-block;
    padding: 6px 10px;
    background-color: #84D8CF;
    color: #161616;
    text-decoration: none;
    border-radius: 3px;
    font-size: 11px;
    white-space: nowrap;
    margin-left: 0;
    border: 1px solid #50b3a9;
    border-left: 2px solid #50b3a9;
    border-bottom: 2px solid #50b3a9;
    transition: background-color 0.3s ease;
}

.btn_link:hover {
    background-color: #07a4d8;
    color: #fff;
}

.clinic_lst .cl_button {
    padding: 0px 50px;
    margin: 0.5em 1em;
    display: block;
}

@media screen and (max-width: 768px) {
    
}

 /*--20250129 Add Higashida--*/
/* --- レスポンシブデザイン --- */
@media (max-width: 768px) {
    /* 全体の余白を調整 */
    header, footer, #container {
        margin: 0 1rem;
    }

    /* テキストサイズを調整 */
    header ol {
        font-size: 0.8em;
    }

    header h1{

        font-size: 1.6em;
    }
   
    header .precoution .title{padding-left: 0;}
    header ol{
        padding-left: 15px;
        font-size: 0.75em;
    }

    .clinic_lst {
        margin: 0 1rem 1em;
        padding-bottom: 0.5em;
    }

    .clinic_lst summary {
        font-size: 1.2em;
    }

    .clinic_lst span {
        margin: 0 0.5em;
        padding: 0 0.5em;
    }

    .clinic_lst .cl_name {
        font-size: 1.1em;
    }

    .clinic_lst .cl_add,
    .clinic_lst .cl_tel,
    .clinic_lst .cl_caution
    .clinic_lst .cl_button {
        padding: 0 20px;
        line-height: 1.5;
    }
    .clinic_lst .cl_button {
        padding: 0 20px;
        line-height: 1.5;
        margin-left: 0;
    }
    .header-container {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .btn01 {
        padding: 8px 15px;
        margin-left: 0;
        margin-top: 20px;
        margin-bottom: 10px;
        font-size: 14px;
    }


    .btn_link {
        font-size: 10px;
        padding: 5px 8px;
        margin-left: 0;
    }
}



.clinic_lst .cl_button .btn_link {
    display: inline-block;
    padding: 5px 15px;
    background-color: #b4f1eb;
    color: #161616;
    text-decoration: none;
    border-radius: 4px;
    font-size: 0.9em;
    white-space: nowrap;
    margin-left: 0px;
    border: 1px solid #50b3a9;
    
}

.clinic_lst .cl_button .btn_link:hover {
    background-color: #85f3e8;
}