@charset "UTF-8";

/* ////////////////////////////////////////////////////////////
 * 医薬販売に関する記載事項
//////////////////////////////////////////////////////////// */
body {
    font-family: -apple-system, BlinkMacSystemFont, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3",
        "Hiragino Kaku Gothic Pro", "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
    font-size: 14px;
}

.br-sp {
    display: none;
}

.container {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 16px;
    /* ここでスマホ時の余白も確保 */
    box-sizing: border-box;
}

/* ページタイトル */
.simple-title-box {
    margin: 0 auto;
    padding: 1em;
    font-size: 22px;
    line-height: 1.6;
    color: #333;
    font-weight: bold;
    text-align: center;
}

/* 各ブロックのタイトル */
.table-title {
    background-color: #FF7880;
    padding: 10px;
    margin: 30px 0 10px;
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    margin: 50px auto 15px;
}

/* シンプルな左寄せのテキストブロック */
.simple-text-box {
    margin: 0 auto;
    padding: 1em;
    line-height: 1.6;
    color: #333;
    text-align: left;
}

/* 横罫線ブロック */
.table_design03 {
    border-collapse: collapse;
    width: 100%;
    margin: 0 auto;
}

.table_design03+.table_design03 {
    margin-top: 50px;
}

.table_design03 th,
.table_design03 td {
    border-bottom: 2px solid #c1c7c6;
    padding: 1em;
}

.table_design03 th {
    border-bottom: 2px solid #FF7880;
    font-weight: bold;
    text-align: center;
    width: 30%;
    min-width: 4em;
}

/* 営業時間 横スライド */
.table-scroll {
    overflow-x: auto;
}

.table_design11 {
    border-collapse: collapse;
    min-width: 700px;
    font-weight: bold;
    text-align: center;
    margin: 0 auto;
}

.table_design11 th,
.table_design11 td {
    padding: .5em 1em;
}

.table_design11 th {
    border-top: 2px solid #FF7880;
    border-bottom: 2px solid #FF7880;
    color: #FF7880;
}

/* デフォルトでは非表示 */
.only-sp {
    display: none;
}

/* 表組み */
.table_design08 {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    text-align: center;
    margin: 0 auto 50px;
}

.table_design08 th,
.table_design08 td {
    border: 2px solid #ffc2c6;
    padding: 1em;
}

.table_design08 thead th {
    background-color: #FF7880;
    color: #fff;
    border: 2px solid #FF7880;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
}

.table_design08 thead th:last-of-type {
    border-right: 2px solid #FF7880;
}

.table_design08 tbody th {
    color: #FF7880;
    font-weight: bold;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .table_design08 {
        text-align: left;
    }

    .table_design08 th {
        border: none;
        padding: 1em;
    }

    .table_design08 thead {
        display: none;
    }

    .table_design08 tbody tr {
        display: block;
        margin-bottom: 1.5em;
        /* ↓囲み線を削除 */
        border: none;
        border-radius: 0;
    }

    .table_design08 tbody th {
        display: block;
        background: #FF7880;
        color: #fff;
        padding: 1em;
        text-align: left;
        /* ← 中央から左寄せに変更 */
        font-weight: bold;
        font-size: 1em;
    }

    .table_design08 td {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        /* ← 内容も左寄せ */
        padding: 1em;
        border-top: none;
        text-align: left;
        font-size: 0.95em;
    }

    .table_design08 td::before {
        content: attr(data-label);
        color: #FF7880;
        font-weight: bold;
        display: inline-block;
        width: 40%;
        min-width: 6em;
        text-align: left;
        margin-right: 1em;
        flex-shrink: 0;
    }

    .table_design08 td,
    .table_design08 td::before {
        word-break: break-word;
        text-align: center;
    }

    .table_design08 td[data-label="質問がなくても行う情報提供"]::before {
        content: "質問がなくても行う\A情報提供";
        white-space: pre;
    }

    .table_design08 td[data-label="相談があった場合の応答"]::before {
        content: "相談があった場合の\A応答";
        white-space: pre;
    }
}


@media screen and (max-width: 768px) {
    body {
        font-size: 13px;
    }

    .br-sp {
        display: inline;
    }

    .only-sp {
        display: block;
    }
}