@charset "utf-8";

/* カラー設定
==================================================== */
:root {
    --menu-number: 7; /* グロナビの数 */
    --text-color: #040000;
    --main-color: #628d27;
    --sub-color: #e6e6e7;
    --menu01-color: #c36775;
    --menu01-color-light: #f5e9e8;
    --menu02-color: #2e90a5;
    --menu02-color-light: #e4e8ea;
    --menu03-color: #49558f;
    --menu03-color-light: #f3f2f6;
    --menu04-color: #b7aa00;
    --menu04-color-light: #f9f8ea;
    --menu05-color: #628d27;
    --menu05-color-light: #e9efe1;
    --member-color: #c87735;
    --member-color-light: #f7ede1;
    --gray: #717071;
    --gray-light: #F2F2F2;
    --gray-dark: #231815;
    --green: #628d27;
}

body {
    color: var(--text-color);
}
a {
    color: var(--gray-dark) !important;
}
a:not(.bg-member):hover  {
    color: var(--main-color) !important;
}
.bg-primary a:hover {
    color: rgba(255,255,255,.7) !important;
}
.bg-primary {
    background-color: var(--main-color) !important;
}
.bg-light {
    background-color: var(--gray-light) !important;
}
.nav-link {
    color: var(--gray-dark);
}
.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show > .nav-link,
body.page-home .navbar-light .navbar-nav  .nav-home > .nav-link,
body.page-menu01 .navbar-light .navbar-nav .nav-menu01 > .nav-link,
body.page-menu02 .navbar-light .navbar-nav .nav-menu02 > .nav-link,
body.page-menu03 .navbar-light .navbar-nav .nav-menu03 > .nav-link,
body.page-menu04 .navbar-light .navbar-nav .nav-menu04 > .nav-link,
body.page-menu05 .navbar-light .navbar-nav .nav-menu05 > .nav-link {
    color: #FFF !important;
    background-color: var(--main-color) !important;
}
.navbar-light .navbar-nav .nav-link:not(.bg-member):focus, .navbar-light .navbar-nav .nav-link:not(.bg-member):hover {
    color: #FFF !important;
    background-color: var(--main-color) !important;
}
.dropdown-item.active, .dropdown-item:active {
    background-color: var(--sub-color) !important;
}
.btn-check:active + .btn-light, .btn-check:checked + .btn-light, .btn-light.active, .btn-light:active, .show > .btn-light.dropdown-toggle {
    color: #FFF !important;
    background-color: var(--main-color) !important;
    border-color: var(--main-color) !important;
}
#globalHeader .bg-light {
    background-color: var(--sub-color) !important;
}
#sidebar .menu01 h3, .border-menu01 {
    border-color: var(--menu01-color) !important;
}
#sidebar .menu01 h3, .menu01 .bi, .menu01 .nav-link:focus, .menu01 .nav-link:hover, .text-menu01 {
    color: var(--menu01-color) !important;
}
#sidebar .menu02 h3, .border-menu02 {
    border-color: var(--menu02-color) !important;
}
#sidebar .menu02 h3, .menu02 .bi, .menu02 .nav-link:focus, .menu02 .nav-link:hover, .text-menu02 {
    color: var(--menu02-color) !important;
}
#sidebar .menu03 h3, .border-menu03 {
    border-color: var(--menu03-color) !important;
}
#sidebar .menu03 h3, .menu03 .bi, .menu03 .nav-link:focus, .menu03 .nav-link:hover, .text-menu03 {
    color: var(--menu03-color) !important;
}
#sidebar .menu04 h3, .border-menu04 {
    border-color: var(--menu04-color) !important;
}
#sidebar .menu04 h3, .menu04 .bi, .menu04 .nav-link:focus, .menu04 .nav-link:hover, .text-menu04 {
    color: var(--menu04-color) !important;
}
#sidebar .menu05 h3, .border-menu05 {
    border-color: var(--menu05-color) !important;
}
#sidebar .menu05 h3, .menu05 .bi, .menu05 .nav-link:focus, .menu05 .nav-link:hover, .text-menu05 {
    color: var(--menu05-color) !important;
}
#sidebar .member, .border-member {
    border-color: var(--member-color) !important;
}
#sidebar .member h3, .bg-member {
    background-color: var(--member-color) !important;
}
.member .bi, .member .nav-link:focus, .member .nav-link:hover, .text-member {
    color: var(--member-color) !important;
}
.text-green {
    color: var(--green) !important;
}
.bg-menu01 {
    background-color: var(--menu01-color) !important;
}
.bg-menu02 {
    background-color: var(--menu02-color) !important;
}
.bg-menu03 {
    background-color: var(--menu03-color) !important;
}
.bg-menu04 {
    background-color: var(--menu04-color) !important;
}
.bg-menu05 {
    background-color: var(--menu05-color) !important;
}

@media (min-width: 992px) {
    #globalHeader .navbar-nav .nav-item {
        width: calc(100% / var(--menu-number)) !important;
    }
    #fontSizeChange {
        min-width: calc(100% / var(--menu-number));
    }
}

/* rounded
==================================================== */

.sideMenu__section {
    border-width: 0 !important;
}
.sideMenu__title {
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
    border-width: 0 !important;
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
}
.sideMenu__section .nav li:not(:last-of-type) {
    border-bottom: 1px solid #FFF !important;
}
.sideMenu__section .nav-link {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
}
.sideMenu__section .nav li:last-of-type .nav-link {
    border-bottom-left-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
}

#sidebar .menu01 h3.sideMenu__title {
    background-color: var(--menu01-color) !important;
    color: #FFF !important;
}
#sidebar .menu02 h3.sideMenu__title {
    background-color: var(--menu02-color) !important;
    color: #FFF !important;
}
#sidebar .menu03 h3.sideMenu__title {
    background-color: var(--menu03-color) !important;
    color: #FFF !important;
}
#sidebar .menu04 h3.sideMenu__title {
    background-color: var(--menu04-color) !important;
    color: #FFF !important;
}
#sidebar .menu05 h3.sideMenu__title {
    background-color: var(--menu05-color) !important;
    color: #FFF !important;
}
#sidebar .member h3.sideMenu__title {
    background-color: var(--member-color) !important;
    color: #FFF !important;
}
.menu01 .nav-link {
    background-color: var(--menu01-color-light) !important;
}
.menu02 .nav-link {
    background-color: var(--menu02-color-light) !important;
}
.menu03 .nav-link {
    background-color: var(--menu03-color-light) !important;
}
.menu04 .nav-link {
    background-color: var(--menu04-color-light) !important;
}
.menu05 .nav-link {
    background-color: var(--menu05-color-light) !important;
}
.member .nav-link {
    background-color: var(--member-color-light) !important;
}

.section__title, .page__title {
    border-radius: 10px !important;
}
