/* 共通CSS */

:root {
    /* --main-color-rgb: 45, 91, 181; */
    --main-color-rgb: 255, 128, 0;
    --main-color-rgb: 255, 166, 77;
    /* --sub-color-rgb: 45, 91, 181;*/
    --active-color-rgb: 253, 126, 20;
    --active-color-rgb: 0, 136, 179;
    --active-color-rgb: 18, 56, 179;
    --active-color-rgb: var(--bs-danger-rgb);
    --base-space: 1rem;
    --border-color: rgb(206, 212, 218);
    --border-color-rgb: 206, 212, 218;
    --header-bg: rgba(var(--border-color-rgb), 0.2);
    --max-width: 900px;
    --base-animate-easing: ease-in;
    --bs-gutter-x: var(--base-space);
}

body {
    font-size: 16px;
    background: rgb(var(--main-color-rgb));
    color: var(--bs-white);
    /* font-family: Meiryo, Tahoma, Roboto, 'Droid Sans',Verdana, Arial, sans-serif; */
    font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
}

b,
strong {
    font-weight: bold;
    font-family: -apple-system,
        BlinkMacSystemFont,
        Roboto,
        "Segoe UI semibold",
        "Helvetica Neue",
        HelveticaNeue,
        YuGothic,
        "Yu Gothic",
        "Segoe UI",
        Verdana,
        Meiryo,
        sans-serif;
}

.container {
    max-width: var(--max-width) !important;
    margin: 0 auto;
}

/* .global-header */
.global-header {
    border-bottom: 1px solid rgba(var(--bs-white-rgb), 0.5);
    background: var(--bs-white);
}

.global-header .container {
    /* max-width: 100% !important; */
    padding: 0 var(--base-space);
}

.global-header h1 {
    font-size: 1rem;
    padding: calc(var(--base-space) * 0.5) var(--base-space) calc(var(--base-space) * 0.5) 0;
    line-height: 1.25;
    margin: 0 auto 0 0;
    font-weight: bold;
    font-family: -apple-system,
        BlinkMacSystemFont,
        Roboto,
        "Segoe UI semibold",
        "Helvetica Neue",
        HelveticaNeue,
        YuGothic,
        "Yu Gothic",
        "Segoe UI",
        Verdana,
        Meiryo,
        sans-serif;
}

.global-header h1 img {
    display: block;
    width: auto;
    max-width: 100%;
}

/* bs-sm */
/* スクリーンサイズが576px以上の場合に適用 */
@media (min-width: 576px) {
    .global-header h1 img {
        max-height: 60px;
        width: auto;
    }
}

.global-header-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    align-items: stretch;
    /* margin-right: calc(var(--bs-gutter-x, 0.75rem) * -1); */
    margin-right: calc(var(--base-space) * -1);
    position: relative;
}

.card {
    width: 100%;
}

input[type='text'] {
    box-sizing: border-box;
    font-family: -apple-system,
        BlinkMacSystemFont,
        Roboto,
        "Segoe UI semibold",
        "Helvetica Neue",
        HelveticaNeue,
        YuGothic,
        "Yu Gothic",
        "Segoe UI",
        Verdana,
        Meiryo,
        sans-serif;
    max-width: 100%;
    width: 100%;
}