@charset "UTF-8";
    .genre-cheer .theme-nav_cheer a { color: #9fb0bc; }
    .genre-cheer #ThemeNavi li.themeCheer a {
      color: white;
      background: #0075c2;
    }

   .member-photo {
     -webkit-user-drag: none;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     user-select: none;
     pointer-events: auto;
    }
    .cheerArea h3 {
     margin-bottom: 20px;
     padding-left: 10px;
     color: #333;
     border-left: 6px solid #0275c2;
     font-size: 26px;
     font-weight: bold;
     line-height: 1.4;
    }
    .cheerArea img.cheer-bnr { margin-bottom: 20px; }
   /* ===== メンバー一覧 ===== */
   .cheerArea .member-list {
     display: grid;
     grid-template-columns: repeat(5, 1fr);
     gap: 24px;
   }
   .cheerArea .member {
     text-align: center;
   }
   .cheerArea .member img {
     display: block;
     width: 100%;
     aspect-ratio: 1 / 2;
     object-fit: cover;
     border-radius: 10px;
     cursor: pointer;
   }
   .cheerArea .member img:hover { opacity: 0.8; }
   .cheerArea .name {
     margin-top: 12px;
     font-size: 16px;
     font-weight: bold;
   }
   .cheerArea .kana {
    margin-top: 6px;
     font-size: 12px;
     color: #888888;
   }
   .cheerArea .more-btn {
     margin: 12px 0 10px;
     padding: 6px 14px;
     font-size: 12px;
     cursor: pointer;
     background: #0075c2;
     color: #fff;
     border: none;
     border-radius: 30px;
   }
   .cheerArea .more-btn:hover { background-color: #0094f5; }
   /* SP */
   @media (max-width: 768px) {
    .cheerArea h3 { margin: 20px 0 26px; }
     .cheerArea .member-list {
       grid-template-columns: repeat(2, 1fr);
       gap: 16px;
     }
     .cheerArea .member img { aspect-ratio: auto; }
   }
   /* ===== モーダル ===== */
   .cheerArea .modal {
     position: fixed;
     inset: 0;
     background: rgba(0, 0, 0, 0.6);
     display: flex;
     justify-content: center;
     align-items: center;
     opacity: 0;
     visibility: hidden;
     transition: opacity 0.3s ease;
   }
   .cheerArea .modal.show {
     opacity: 1;
     visibility: visible;
     z-index: 1001;
   }
   .cheerArea .modal-content {
     width: 90%;
     max-width: 600px;
     max-height: calc(100vh - 120px);
     background: #fff;
     padding: 32px;
     position: relative;
     border-radius: 10px;
     transform: translateY(20px);
     transition: transform 0.3s ease;
     overflow-y: auto;
    }
   .cheerArea .modal.show .modal-content {
     transform: translateY(0);
   }
   /* ===== モーダル詳細レイアウト ===== */
    .cheerArea .modal-profile {
      display: flex;
      gap: 32px;
      align-items: flex-start;
    }
    .cheerArea .modal-image {
      width: 220px;
      flex-shrink: 0;
    }
    .cheerArea .modal-image img {
      width: 100%;
      display: block;
      border-radius: 10px;
    }
    .cheerArea .modal-text {
      flex: 1;
    }
    .cheerArea .modal-name {
      font-size: 26px;
      font-weight: bold;
      line-height: 1.4;
    }
    .cheerArea .modal-kana {
      margin-top: 4px;
      font-size: 14px;
      color: #888888;
    }
    .cheerArea .profile-list {
      margin-top: 26px;
    }
    .cheerArea .profile-item {
      display: flex;
      margin-bottom: 20px;
      font-size: 15px;
    }
    .cheerArea .profile-label {
      width: 80px;
      margin-right: 8px;
      font-weight: bold;
      line-height: 1.4;
    }
    .cheerArea .profile-value {
      flex: 1;
      line-height: 1.4;
    }
    .cheerArea .message-title {
      margin-top: 26px;
      padding-bottom: 10px;
      font-size: 18px;
      font-weight: bold;
      border-bottom: 1px solid #333;
    }
    .cheerArea .message-text {
      margin-top: 10px;
      line-height: 1.6;
    }
    /* SP */
    @media (max-width: 768px) {
      .cheerArea .modal {
        align-items: flex-start;
        padding: 30px;
        box-sizing: border-box;
      }
      .cheerArea .modal-content {
        margin-top: 20px;
        padding: 20px;
      }
      .cheerArea .modal-profile {
        flex-direction: column;
      }
      .cheerArea .modal-image {
        width: 100%;
        max-width: 240px;
        margin: 0 auto;
      }
      .cheerArea .modal-name {
        font-size: 22px;
      }
    }
   .cheerArea .close {
     display: flex;
     align-items: center;
     justify-content: center;
     position: absolute;
     width: 40px;
     height: 40px;
     top: 12px;
     right: 16px;
     font-size: 24px;
     background: #fff;
     border: none;
     cursor: pointer;
     border: 1px solid #333;
     border-radius: 50%;
    }
    .cheerArea .close:hover { opacity: 0.6; }
   /* モーダル中は背景固定 */
    body.modal-open {
     overflow: hidden;
   }

/* --------------------------------------------------------------------------------------------------------------------------------
CLEER FIX
-------------------------------------------------------------------------------------------------------------------------------- */
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}