html {
    font-family: 'Noto Sans CJK JP', 'Noto Sans JP', sans-serif;
}
  
/* FontAwesomeのクラスは除外 */
.fa, .fas, .far, .fab {
    font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands' !important;
}

.link-hover:hover {
    opacity: .5;
    color: inherit;
}

.lazy {
    filter: blur(5px);
    transition: filter 0.3s;
}
.lazy.loaded {
    filter: blur(0);
}

.bg-yellow {
    background-color: var(--bs-yellow);
}
.bg-green {
    background-color: var(--bs-teal);
}
.bg-purple {
    background-color: var(--bs-purple);
}
.bg-pink {
    background-color: var(--bs-pink);
}
.bg-red {
    background-color: var(--bs-red);
}
.bg-blue {
    background-color: var(--bs-blue);
}
.bg-orange {
    background-color: var(--bs-orange);
}
.bg-black {
    background-color: var(--bs-dark);
}
.bg-muted {
    background-color: var(--bs-gray-400);
}
.bg-gray {
    background-color: var(--bs-gray);
}

.text-yellow {
    color: var(--bs-yellow);
}
.text-green {
    color: var(--bs-teal);
}
.text-purple {
    color: var(--bs-purple);
}
.text-pink {
    color: var(--bs-pink);
}
.text-red {
    color: var(--bs-red);
}
.text-blue {
    color: var(--bs-blue);
}
.text-orange {
    color: var(--bs-orange);
}
.text-black {
    color: var(--bs-dark);
}
.text-muted {
    color: var(--bs-gray-400);
}

.border-yellow {
    border-left: 3px solid;
    border-color: var(--bs-yellow);
}
.border-green {
    border-left: 3px solid;
    border-color: var(--bs-teal);
}
.border-purple {
    border-left: 3px solid;
    border-color: var(--bs-purple);
}
.border-pink {
    border-left: 3px solid;
    border-color: var(--bs-pink);
}
.border-red {
    border-left: 3px solid;
    border-color: var(--bs-red);
}
.border-blue {
    border-left: 3px solid;
    border-color: var(--bs-blue);
}
.border-orange {
    border-left: 3px solid;
    border-color: var(--bs-orange);
}
.border-dark {
    border-left: 3px solid;
    border-color: var(--bs-dark);
}
.border-all {
    border-left: 3px solid rgba(255,255,255,0);
}

.btn-outline-gray {
    --bs-btn-color: var(--bs-gray);
    --bs-btn-border-color: var(--bs-gray);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-gray);
    --bs-btn-active-border-color: var(--bs-gray);
    --bs-btn-active-shadow: none;
}
.btn-outline-yellow {
    --bs-btn-color: var(--bs-yellow);
    --bs-btn-border-color: var(--bs-yellow);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-yellow);
    --bs-btn-active-border-color: var(--bs-yellow);
    --bs-btn-active-shadow: none;
}
.btn-outline-green {
    --bs-btn-color: var(--bs-teal);
    --bs-btn-border-color: var(--bs-teal);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-teal);
    --bs-btn-active-border-color: var(--bs-teal);
    --bs-btn-active-shadow: none;
}
.btn-outline-purple {
    --bs-btn-color: var(--bs-purple);
    --bs-btn-border-color: var(--bs-purple);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-purple);
    --bs-btn-active-border-color: var(--bs-purple);
    --bs-btn-active-shadow: none;
}
.btn-outline-pink {
    --bs-btn-color: var(--bs-pink);
    --bs-btn-border-color: var(--bs-pink);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-pink);
    --bs-btn-active-border-color: var(--bs-pink);
    --bs-btn-active-shadow: none;
}
.btn-outline-red {
    --bs-btn-color: var(--bs-red);
    --bs-btn-border-color: var(--bs-red);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-red);
    --bs-btn-active-border-color: var(--bs-red);
    --bs-btn-active-shadow: none;
}
.btn-outline-blue {
    --bs-btn-color: var(--bs-blue);
    --bs-btn-border-color: var(--bs-blue);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-blue);
    --bs-btn-active-border-color: var(--bs-blue);
    --bs-btn-active-shadow: none;
}
.btn-outline-orange {
    --bs-btn-color: var(--bs-orange);
    --bs-btn-border-color: var(--bs-orange);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-orange);
    --bs-btn-active-border-color: var(--bs-orange);
    --bs-btn-active-shadow: none;
}
.btn-outline-black {
    --bs-btn-color: var(--bs-dark);
    --bs-btn-border-color: var(--bs-dark);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-dark);
    --bs-btn-active-border-color: var(--bs-dark);
    --bs-btn-active-shadow: none;
}
.btn-outline-muted {
    --bs-btn-color: var(--bs-gray-400);
    --bs-btn-border-color: var(--bs-gray-400);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-gray-400);
    --bs-btn-active-border-color: var(--bs-gray-400);
    --bs-btn-active-shadow: none;
}

.thumbnail-wrapper {
    width: 100%;
    height: 200px;
    overflow: hidden;
    position: relative;
}

.thumbnail {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    position: absolute;
}

.video-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 のアスペクト比 */
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media (max-width: 768px) {
    .calendar-table td {
        padding: 1px !important;
    }
    .calendar-table .day {
        padding-top: 3px;
        padding-left: 3px;
    }
    .event-name {
        font-size: 6px !important; 
    }
}

@media only screen and (max-width: 500px) {
    .mobile-blocky tr,
    .mobile-blocky th,
    .mobile-blocky td {
      display: block; /* セルを縦に */
    }

    .mobile-blocky .indent {
        padding-left: 1em;
    }

    .mobile-blocky thead {
        display: none;
    }
    .mobile-blocky .t-title {
        display: inline;
    }
    /* データが無いセルはスマホでは見出しごと非表示 */
    .mobile-blocky .mobile-empty {
        display: none;
    }
}

@media only screen and (min-width: 501px) {
    .mobile-blocky .t-title {
        display: none;
    }
}
/* メンバーカラー用の追加色（フレームワーク未定義分: light-blue / lite-white） */
/* light-blue（川﨑星輝）: 白文字が乗る中濃度ブルー */
.bg-light-blue {
    background-color: #4dabf7;
}
.text-light-blue {
    color: #339af0;
}
.border-light-blue {
    border-left: 3px solid;
    border-color: #4dabf7;
}
.btn-outline-light-blue {
    --bs-btn-color: #339af0;
    --bs-btn-border-color: #4dabf7;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #4dabf7;
    --bs-btn-active-border-color: #4dabf7;
    --bs-btn-active-shadow: none;
}
.bg-light-blue-lt {
    background-color: #e7f5ff !important;
    color: #1971c2 !important;
}

/* lite-white（矢花黎）: 白系メンバー色。白背景でも視認できるよう淡灰＋暗文字で表現 */
.bg-lite-white {
    background-color: #f1f3f5;
}
.text-lite-white {
    color: #868e96;
}
.border-lite-white {
    border-left: 3px solid;
    border-color: #ced4da;
}
.btn-outline-lite-white {
    --bs-btn-color: #868e96;
    --bs-btn-border-color: #ced4da;
    --bs-btn-active-color: #212529;
    --bs-btn-active-bg: #f1f3f5;
    --bs-btn-active-border-color: #ced4da;
    --bs-btn-active-shadow: none;
}
.bg-lite-white-lt {
    background-color: #f1f3f5 !important;
    color: #495057 !important;
}

/* black（全員）: Tabler に black の light バッジが無いため定義 */
.bg-black-lt {
    background-color: #dee2e6 !important;
    color: #212529 !important;
}