@charset "UTF-8";
:root {
    --font-family-sans-serif: Noto Sans Japanese;
}

body {
    font-family: var(--font-family-sans-serif);
}

.bg-biobank {
    background-color: #26b6bc;
    color: white;
}

.btn-login {
    background-color: #26b6bc;
    color: white;
}

.btn-biobank-outline {
    border-color: #26b6bc;
    color: #26b6bc;
}

.btn-biobank-outline:hover {
    border-color: #26b6bc;
    background-color: #26b6bc;
    color: white;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-sans-serif);
}

/* rowの中のlabelに設定しておかないとセレクトボックスと位置が合わない。*/
.row > label {
    padding-left: 0;
    padding-right: 0;
}

/* rowの中のselectに設定しておかないと選択肢のボックスとのサイズが合わない。*/
.row > span {
    padding-left: 0;
    padding-right: 0;
}

/*
 * select2レスポンシブ対応用
 * @see https://stackoverflow.com/questions/45276778/select2-not-responsive-width-larger-than-container
 */
.select2 {
    width:100%!important;
}

.sans-serif {
    font-family: 'Nunito', sans-serif;
}

div.row {
    margin-left: auto !important;
    margin-right: auto !important;
}

.last-modified {
    font-size: small;
}

/* グラフ */
.bar-chart {
}

.pagination {
    display: -ms-flexbox;
    flex-wrap: wrap;
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: 0.25rem;
}

/*　横幅がmd以上の場合。 */
@media (min-width: 768px) {
    /* フォームのタイトルを調整する。 */
    .container-fluid > div > div > h5 {
        margin-bottom: 1rem;
    }

    /* フォームの幅を調整する。 */
    form > .row {
        margin-bottom: 1rem;
    }
}

/* 横幅がmd未満の場合。 */
@media (max-width: 768px) {
    button {
        margin-bottom: 10px;
    }

    .last-modified::before {
        content: "\A";
        white-space: pre;
    }

    .mobile-search-col {
        margin-left: auto !important;
    }

    .row > .col-sm-12 > .form-group {
        margin-bottom: 1rem !important;
    }

    .media-md-mb-3 {
        margin-bottom: 1rem !important;
    }

    .card-body {
        padding-left: 0.1rem !important;
        padding-right: 0.1rem !important;
    }
}

@media (prefers-reduced-motion: no-preference) {
    :root {
    }
}
