/*
Theme Name: Parabola Child
Template: parabola
*/

/* =========================================================
   1) 演奏会（個別ページ / single-concert.php）
   ========================================================= */

.concert{
  max-width: 960px;
  margin: 0 auto;
  padding: 16px;
}
.concert__title{
  margin: 0 0 12px;
  font-size: 1.8em;
}

.concert__hero{
  display: flex;
  gap: 18px;
  align-items: flex-start;
  margin: 12px 0 22px;
  background: #f6f6f6;
  border: 1px solid #e3e3e3;
  border-radius: 10px;
  padding: 14px;
}

.concert__poster{
  width: 180px;
  max-width: 40%;
}
.concert__poster img{
  width: 100%;
  display: block;
}

.concert__meta{
  flex: 1;
  min-width: 360px;
}

.concert__metaRow{
  display: grid;
  grid-template-columns: 5em 1fr;
  gap: 0.8em;
  margin: 6px 0;
  line-height: 1.6;
}

.concert__section{ margin: 28px 0; }
.concert__section h2{
  margin-bottom: 10px;
  font-size: 1.2em;
  border-bottom: 1px solid #ccc;
  padding-bottom: 4px;
}

.concert__programText{
  white-space: pre-wrap;
  line-height: 1.8;
}

@media (max-width: 700px){
  .concert__hero{ flex-direction: column; }
  .concert__meta{ min-width: auto; }
}


/* =========================================================
   2) 演奏会一覧
   ========================================================= */

.concertList{
  list-style: none;
  margin: 12px 0 32px;
  padding: 0;
}
.concertList__item{
  display: flex;
  gap: 0.8em;
  margin: 6px 0;
}
.concertList__date{
  flex: 0 0 9em;
  text-align: right;
  color: #555;
}
.concertList__link{
  text-decoration: none;
}
.concertList__link:hover{
  text-decoration: underline;
}

/* 演奏会一覧：予定ラベル */
.concertLabel{
  display: inline-block;
  margin-right: 0.5em;
  padding: 2px 6px;
  font-size: 11px;
  line-height: 1.4;
  border-radius: 4px;
  font-weight: 700;
  vertical-align: middle;
}
.concertLabel--future{
  background: #fff2e5;
  color: #c65300;
  border: 1px solid #f2b27a;
}

//* =========================
   演奏会情報：スマホで本文ボックスの幅固定/中央寄せを解除
   ========================= */
@media (max-width: 768px) {

  /* 本文の白い箱（テーマの囲い）を広げる */
  #content .post,
  #content .page,
  #content .type-page,
  #content .entry-content,
  #content .entry,
  #content article {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* 演奏会情報の中身は左寄せ（中央寄せ継承を遮断） */
  .concertYear__title,
  .concertList,
  .concertList * {
    text-align: left !important;
  }

  /* 日付だけは右寄せで揃える */
  .concertList__date{
    text-align: right !important;
    white-space: nowrap;
  }

  /* 余計な左右paddingが強い場合の保険 */
  #content .entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

/* =========================
   演奏会一覧：1行を3列に固定してズレ防止
   - 予定ラベル / 日付 / タイトル
   ========================= */

.concertList__item{
  display: grid;
  grid-template-columns: 3.2em 8.5em 1fr; /* ラベル / 日付 / タイトル */
  column-gap: 0.8em;
  align-items: center;
}


/* 予定ラベルが無い行でも列を維持するため空欄もOK */
.concertLabel{
  justify-self: start;
}

/* 日付は固定幅列の中で右寄せ（あなたの狙い通り） */
.concertList__date{
  justify-self: end;
  white-space: nowrap; /* 折り返さない */
}

/* タイトルも折り返しは自然に */
.concertList__link{
  min-width: 0;
}

/* =========================
   演奏会：前後ナビ
   ========================= */
.concert-nav{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 32px 0 12px;
}

.concert-nav a{
  display: inline-block;
  padding: 10px 14px;
  border: 1px solid #ddd;
  border-radius: 10px;
  text-decoration: none;
  font-size: 14px;
}

.concert-nav a:hover{
  background: #f6f6f6;
}

/* プログラム本文と後援の間に余白 */
.concert__supportersAfterProgram{
  margin-top: 36px; /* ここを増やす */
}

/* ついで：後援ブロック自体も少し呼吸させる（任意） */
.concert__supportersAfterProgram strong{
  margin-right: 6px;
}




/* =========================================================
   3) 団員専用ナビ（上部2段目 / /member 配下のみ）
   ---------------------------------------------------------
   目的：
   - Parabolaテーマ側の nav/ul/li の float 指定に負けず横並び
   - 右に飛ぶ/縦積みを防ぐ
   - 現在ページを黒反転で強調
   ========================================================= */

.member-topnav{
  clear: both;              /* 右回り込み対策 */
  width: 100%;
  margin: 0;
  padding: 8px 0;
  border-bottom: 1px solid #e3e3e3;
}

.member-topnav__menu{
  list-style: none;
  margin: 0 auto;
  padding: 0 12px;

  display: flex;
  align-items: center;
  justify-content: flex-start;  /* center にしたければここだけ変更 */
  flex-wrap: wrap;
  gap: 10px;

  float: none;              /* テーマ側 float 打ち消し */
}

.member-topnav__menu > li{
  margin: 0;
  float: none;              /* テーマ側 float 打ち消し */
  display: block;
}

.member-topnav__menu > li > a{
  display: block;
  padding: 8px 12px;
  border: 1px solid #ddd;
  border-radius: 6px;
  text-decoration: none;
  background: transparent;
}

.member-topnav__menu > li > a:hover{
  background: #f6f6f6;
}

/* 現在ページを黒反転（WordPressが付けるclassを幅広く拾う） */
.member-topnav__menu > li.current-menu-item > a,
.member-topnav__menu > li.current_page_item > a,
.member-topnav__menu > li.current-menu-ancestor > a,
.member-topnav__menu > li.current-menu-parent > a,
.member-topnav__menu > li.current_page_parent > a{
  background: #222;
  color: #fff;
  border-color: #222;
}


/* =========================================================
   4) 練習日程テーブル
   ========================================================= */

/* PC/共通 */
.practice-table{
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}
.practice-table th,
.practice-table td{
  padding: 6px 8px;
}

/* PCだけ：横1行で省略（…） */
@media (min-width: 769px){
  .practice-table th,
  .practice-table td{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* スマホだけ：折り返し許可（保険） */
@media (max-width: 768px){
  .practice-table th,
  .practice-table td{
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    word-break: break-word;
  }
}


/* =========================
   練習日程：スマホだけカード表示（4列固定）
   ※ 表ブロックの追加CSSクラスに「schedule-table」が入っている前提
   ========================= */
@media (max-width: 768px) {

  .wp-block-table.schedule-table table,
  .wp-block-table.schedule-table thead,
  .wp-block-table.schedule-table tbody,
  .wp-block-table.schedule-table tr,
  .wp-block-table.schedule-table th,
  .wp-block-table.schedule-table td{
    display: block;
    width: 100%;
  }

  .wp-block-table.schedule-table thead{
    display: none;
  }

  .wp-block-table.schedule-table tr{
    margin: 0 0 14px;
    padding: 12px 12px 10px;
    border: 1px solid #e3e3e3;
    border-radius: 10px;
    background: #fff;
  }

  /* セル：左ラベル / 右値（必ず左揃え） */
  .wp-block-table.schedule-table td{
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 6px 0;
    border: none;

    /* 値が複数行になっても中央寄りに見えないようにする */
    text-align: left;
    justify-content: flex-start;

    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;

    font-size: 15px;
    line-height: 1.5;
  }

 /* ラベル（左）幅を少し縮めて、値側を広げる */
  .wp-block-table.schedule-table td::before{
    flex: 0 0 5.6em;   /* ← 7.5em は広すぎ。まず 5.6em を推奨 */
    font-weight: 700;
    color: #555;
    text-align: left;
  }

  /* 値側（右）が潰れないようにする */
  .wp-block-table.schedule-table td{
    min-width: 0;      /* flexのはみ出し対策 */
  }

  /* 値側（右）に入る要素も必ず左揃え（p等が入っても崩れない） */
  .wp-block-table.schedule-table td > *{
    text-align: left;
  }


  .wp-block-table.schedule-table td:nth-child(1)::before{ content: "月日"; }
  .wp-block-table.schedule-table td:nth-child(2)::before{ content: "時間"; }
  .wp-block-table.schedule-table td:nth-child(3)::before{ content: "練習場所"; }
  .wp-block-table.schedule-table td:nth-child(4)::before{ content: "備考"; }

  /* =========================
     練習日程：備考が空の行はスマホで非表示
     ========================= */

  /* 備考（4列目）は一旦隠す */
  .wp-block-table.schedule-table td:nth-child(4){
    display: none;
  }

  /* 中身があるときだけ表示（空でなければ表示） */
  .wp-block-table.schedule-table td:nth-child(4):not(:empty){
    display: flex;
  }
}



/* =========================================================
   5) あゆみ
   ========================================================= */

.entry-content .ayumi{
  max-width: 820px;
  margin: 0 auto;
}

/* あゆみ：年の下の本文を字下げ */
.ayumi .ayumi-body{
  padding-left: 1.6em;   /* 字下げ量（好みで 1.2〜2.0em） */
}

/* =========================================================
   6) 団員一覧
   ========================================================= */

.memberlist{
  max-width: 1100px;
  margin: 0 auto;
}

/* =========================
   Member表（TablePress ID=1）
   - スマホ：横スクロール（外側ラッパーで実装）
   - 列見出しズレ対策：DataTablesの水平スクロールはOFF推奨
   - 係/備考は自然に折り返し（2文字改行を防ぐ）
   ========================= */
@media (max-width: 768px){

  /* 横スクロール用の“箱”
     - DataTables ON : #tablepress-1_wrapper が存在
     - DataTables OFF: .tablepress が箱になる */
  #tablepress-1_wrapper,
  .tablepress{
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

  /* テーブルは縮まない（横に伸びてスクロール） */
  table#tablepress-1{
    width: max-content;
    min-width: 100%;
    table-layout: auto;
  }

  /* 基本：折り返し禁止（2文字改行を防ぐ） */
  #tablepress-1 th,
  #tablepress-1 td{
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
    text-align: left;
  }

  /* 係（D列）・備考（E列）は折り返しOK（ただし2文字縦積みを避ける） */
  #tablepress-1 th.column-4,
  #tablepress-1 td.column-4,
  #tablepress-1 th.column-5,
  #tablepress-1 td.column-5{
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere; /* 長文は自然に折り返し */
  }

  /* 係/備考の列幅を確保（“だいたい10文字/14文字”で折り返す） */
  #tablepress-1 th.column-4,
  #tablepress-1 td.column-4{
    min-width: 10em;
  }

  #tablepress-1 th.column-5,
  #tablepress-1 td.column-5{
    min-width: 14em;
  }

  /* DataTablesの固定ヘッダー等が出ていたら非表示（保険） */
  .fixedHeader-floating,
  .fixedHeader-locked{
    display: none !important;
  }
}

/* =========================================================
   7) スマホ：ハンバーガー横に「MENU」表示（最終・統一版）
   ---------------------------------------------------------
   header.php の #nav-toggle 内に
     <b class="nav-menu-text">MENU</b>
   を入れている前提。
   ※ 以前の .menu-toggle::after 版、重複ブロックは削除しました。
   ========================================================= */
@media (max-width: 768px){

  /* ハンバーガー + MENU を横並びに */
  #nav-toggle{
    display: flex;
    align-items: center;
    gap: 6px;
  }

  /* MENU文字（bでもspanでも同じクラスならOK） */
  #nav-toggle .nav-menu-text{
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.05em;
    color: #fff;
    line-height: 1;
    text-decoration: none;

    /* テーマ側装飾の影響を受けにくくする保険 */
    background: transparent;
    border: 0;
    box-shadow: none;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
  }

  /* まれに疑似要素で線を足すテーマ対策 */
  #nav-toggle .nav-menu-text::before,
  #nav-toggle .nav-menu-text::after{
    content: none;
    display: none;
  }
}

/* =========================================================
   8) 写真アルバム一覧（最終版）
   ---------------------------------------------------------
   ・Parabolaテーマ寄せ
   ・ダークグレー背景
   ・白は使わずオフホワイト
   ・オレンジはアクセントのみ
   ========================================================= */

.album-archive{
  max-width: 960px;
  margin: 0 auto;
  padding: 16px;
}

.album-year-block{
  margin: 26px 0 34px;
}

.album-year-title{
  display: inline-block;
  padding: 10px 14px;
  font-size: 1.35em;
  background: #f6f6f6;
  border-left: 6px solid #333;
  margin-bottom: 14px;
}

/* グリッド */
.album-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

/* カード */
.album-card{
  background: #1f1f1f;              /* テーマ寄せダーク */
  border: 1px solid #333;
  border-radius: 12px;
  overflow: hidden;
  transition: transform .15s ease,
              box-shadow .15s ease,
              border-color .15s ease;
}

.album-card:hover{
  transform: translateY(-2px);
  border-color: #d3542a;            /* Parabolaオレンジ */
  box-shadow: 0 10px 26px rgba(0,0,0,.45);
}

.album-card__link{
  display: block;
  text-decoration: none;
  color: #f2f2f2;
}

/* サムネ */
.album-card__thumb{
  background: #2a2a2a;
}
.album-card__thumb img{
  width: 100%;
  height: 180px;
  object-fit: cover;
  display: block;
}

/* 本文 */
.album-card__body{
  padding: 12px 14px 14px;
}

/* アルバムカードのタイトル：メニュー文字寄せ */
.album-card__title{
  margin: 0;
  font-size: 1.05em;
  font-weight: 500;      /* 600 → 500 */
  color: #e0e0e0;        /* #f2f2f2 → 少し落とす */
  border-left: 3px solid #d3542a; /* 線も少し細く */
  padding-left: 8px;
}

/* レスポンシブ */
@media (max-width: 900px){
  .album-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px){
  .album-grid{ grid-template-columns: 1fr; }
}

/* アルバム：投稿者・日付などのメタ情報を非表示 */
.single-album .entry-meta,
.single-album .postmetadata{
  display: none !important;
}

/* アルバム：フッターのメタ（ブックマーク/パーマリンク等）を非表示 */
.single-album .entry-utility,
.single-album .footer-meta,
.single-album .post-utility{
  display: none !important;
}

/* =========================================================
   album：他ページと同じ幅 + 上の隙間を追加（最終調整）
   ========================================================= */

body.post-type-archive-album .album-archive,
body.tax-album_year .album-archive,
body.tax-album_category .album-archive{

  /* 他ページ寄せ（演奏会ページの白枠に合わせる） */
  max-width: 1300px;
  margin: 20px auto 35px;   /* ↑上を増やす：48px（好みで調整） */

  /* 半透明の白枠 */
  background: rgba(255,255,255,0.8);
  padding: 24px;
  border-radius: 16px;
  box-shadow: 0 8px 28px rgba(0,0,0,0.15);

  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* 年ラベル：カードと同じ文法の「ダークチップ」 */
.album-year-block .album-year-title{
  display: inline-block !important;

  background: rgba(31,31,31,0.90) !important; /* カードの黒に寄せる */
  color: #f2f2f2 !important;

  font-size: 1.05em !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;

  padding: 6px 12px !important;
  border-radius: 999px !important; /* ピル型 */
  border: 1px solid rgba(255,255,255,0.10) !important;

  box-shadow: none !important;     /* にじみ対策：影なし */
  border-left: none !important;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.album-year-block{
  padding-top: 4px;
}



/* =========================================================
   団員掲示板：背景を白カードにして読みやすく
   ========================================================= */

/* 掲示板全体を白背景カードに */
.iwe-board {
  background: #ffffff;
  border-radius: 12px;
  padding: 24px;
  margin-top: 20px;
}

/* フォームエリア */
.iwe-board__form {
  background: #f9f9f9;
}

/* タイトル文字を濃く */
.iwe-board__title,
.iwe-board__h2,
.iwe-board__label {
  color: #222;
}

/* 投稿履歴カード */
.iwe-board__card {
  background: #ffffff;
}

/* 背景画像が強いテーマ対策 */
#content .iwe-board {
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}

/* =========================================================
   団員掲示板 仕上げ微調整（任意）
   ========================================================= */

/* 入力欄を広く */
.iwe-board__input,
.iwe-board__textarea {
  max-width: 100%;
}

/* 見出しを少し強調 */
.iwe-board__title {
  font-size: 1.9em;
  margin-bottom: 16px;
}

.iwe-board__h2 {
  border-left: 4px solid #d35400;
  padding-left: 8px;
}

/* =========================================================
   団員掲示板：フォーム見た目の改善
   ========================================================= */

/* 「新規投稿（ML配信）」の下に余白を作って入力開始が分かるように */
.iwe-board__form .iwe-board__h2{
  margin-bottom: 14px;
}
.iwe-board__form form{
  margin-top: 10px;
}

/* 各入力項目の間を広げる */
.iwe-board__field{
  margin: 0 0 16px;
}

/* ラベルと入力欄の間 */
.iwe-board__label{
  margin: 0 0 8px;
}

/* 入力枠を大きく（Parabolaの制限を上書き） */
.iwe-board__input{
  width: 100%;
  max-width: 560px;     /* PCで間延びしすぎない */
  height: 40px;
  font-size: 16px;
}
.iwe-board__textarea{
  width: 100%;
  max-width: 720px;
  min-height: 180px;
  font-size: 16px;
}

/* 添付ファイル3つを縦並びに（br無しでも確実に縦） */
.iwe-board__files{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 6px;
}

/* Sendボタンを目立たせる */
.iwe-board__btn{
  background: #d35400;  /* オレンジ系 */
  color: #fff;
  font-weight: bold;
  padding: 10px 18px;
  border-radius: 10px;
}
.iwe-board__btn:hover{
  opacity: .9;
}

/* Sendの注意事項 */
.iwe-board__note{
  margin-top: 10px;
  font-size: 13px;
  opacity: .85;
}

/* =========================================================
   団員掲示板：投稿履歴の前に余白を追加
   ========================================================= */

/* 「投稿履歴」セクション全体の上に余白 */
.iwe-board__list {
  margin-top: 28px;
}

/* 見出し自体も少し下げて強調 */
.iwe-board__list .iwe-board__h2 {
  margin-top: 0;
  padding-top: 8px;
}

/* =========================================================
   団員掲示板：送信完了メッセージを目立たせる
   ========================================================= */

/* 送信完了メッセージ */
.iwe-board__success{
  background: #eaf6ea;          /* 薄いグリーン */
  border-left: 6px solid #2ecc71;
  padding: 14px 18px;
  margin: 0 0 20px;
  font-weight: bold;
  font-size: 16px;
  color: #1e7e34;
}

/* 念のため p や div で出ている場合も拾う */
.iwe-board .success,
.iwe-board .notice-success{
  background: #eaf6ea;
  border-left: 6px solid #2ecc71;
  padding: 14px 18px;
  margin-bottom: 20px;
  font-weight: bold;
}

/* =========================================================
   団員掲示板：投稿履歴の区切り・日時表示
   ========================================================= */

/* 投稿1件ごとのカード */
.iwe-board__item{
  padding: 14px 0;
  margin-bottom: 18px;
  border-bottom: 1px solid #ddd;
}

/* 最後の投稿だけ線を消す */
.iwe-board__item:last-child{
  border-bottom: none;
}

/* 投稿日時 */
.iwe-board__date{
  font-size: 13px;
  color: #666;
  margin: 4px 0 8px;
}

/* =========================================================
   団員掲示板：送信成功メッセージを目立たせる（確実版）
   ========================================================= */
.iwe-board__notice--ok{
  background: #eaffea;
  border: 2px solid #2ecc71;
  border-left-width: 10px;
  padding: 14px 16px;
  margin: 0 0 18px;
  border-radius: 10px;

  font-size: 17px;
  font-weight: 700;
  color: #146c2e;
}

.iwe-board__notice--ok::before{
  content: "✔ ";
  font-weight: 900;
  margin-right: 6px;
}

/* =========================================================
   団員掲示板：投稿履歴の区切りを明確に（確実版）
   ========================================================= */

/* 投稿一覧の各カードを強制的に独立させる */
.iwe-board__cards{
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.iwe-board__card{
  background: #fff;
  border: 1px solid #dcdcdc;
  border-left: 6px solid #d35400;
  border-radius: 10px;
  padding: 14px 16px;
}

/* 件名を強く */
.iwe-board__subject{
  font-weight: 800;
  font-size: 16px;
  margin-bottom: 8px;
}

/* 投稿日時・投稿者は小さめでまとめる */
.iwe-board__date,
.iwe-board__meta{
  font-size: 13px;
  color: #555;
  margin: 2px 0;
}

/* 本文は読みやすく */
.iwe-board__body{
  margin-top: 10px;
  line-height: 1.65;
  white-space: pre-wrap;
}

/* 添付は本文と分離 */
.iwe-board__attach{
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed #e0e0e0;
  font-size: 13px;
}
.iwe-board__attach ul{
  margin: 6px 0 0;
  padding-left: 18px;
}

.member-docs__details {
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  margin: 10px 0;
  background: #fafafa;
}
.member-docs__summary {
  cursor: pointer;
  padding: 10px 12px;
  font-weight: 700;
  list-style: none;
}
.member-docs__summary::-webkit-details-marker { display: none; }
.member-docs__summary::before { content: "▶"; margin-right: 8px; }
.member-docs__details[open] > .member-docs__summary::before { content: "▼"; }

.member-docs__details .member-docs__list {
  padding: 0 10px 10px;
  background: #fff;
  border-top: 1px solid #e5e5e5;
}

/* 団員資料：中分類見出し（総会など）を確実に白くする */
#content .member-docs .member-docs__title {
  color: #ffffff;
  font-weight: 700;
}

/* =========================================================
   あゆみ：年（本文サイズ＋太字）
   - .ayumi-title を見出しっぽくせず、強調だけする
   ========================================================= */
#content .ayumi .ayumi-title{
  font-size: 1em;      /* 本文と同じ */
  font-weight: 700;    /* 太字 */
  margin: 14px 0 4px;  /* 余白だけ少し調整 */
}

/* 年の直後の本文との間隔を詰める（必要なら） */
#content .ayumi .ayumi-body{
  margin: 0 0 10px;
}

#content .ayumi .ayumi-year {
  margin-bottom: 16px;
}

/* =========================================
   トップ：次回演奏会カード（完成形）
   ・カード感を強める
   ・視線の流れを整理
   ========================================= */
body.home .top-concert{
  margin: 28px 0 0;
  padding: 22px 26px;
  background: #f9f9f9;
  border: 1px solid #e0e0e0;
  border-radius: 14px;
}

/* 見出し */
body.home .top-concert__head{
  margin: 0 0 12px;
  font-size: 1.35em;
  font-weight: 700;
}

/* 日付（補助情報として整える） */
body.home .top-concert__date{
  margin: 0 0 14px;
  font-size: 0.95em;
  font-weight: 600;
  color: #666;
}

/* 演奏会名：主役 */
body.home .top-concert__title{
  margin: 0 0 18px;
  font-size: 1.6em;
  font-weight: 800;
  line-height: 1.25;
}

/* タイトルリンク */
body.home .top-concert__title a{
  text-decoration: none;
}

/* 詳細ボタン：カード内のアクションとして明確に */
body.home .top-concert__more a{
  display: inline-block;
  padding: 10px 18px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid #d0d0d0;
  font-size: 0.9em;
  font-weight: 700;
  text-decoration: none;
}

/* =========================
   曜日色分け（日=赤 / 土=青）
   ========================= */
.dow { font-weight: 700; }

.dow-sun { color: #d32f2f; } /* 日曜 */
.dow-sat { color: #1976d2; } /* 土曜 */


/* =========================================================
   演奏会一覧（年別）：スマホでも崩れない整列
   - 3列：ラベル / 日付（右寄せ） / タイトル
   - ラベルが無い行も揃うように「空ラベル」を用意する前提
   ========================================================= */

/* 共通：3列グリッド */
#content .concertList__item{
  display: grid;
  grid-template-columns: 3.0em 7.0em 1fr; /* ラベル / 日付 / タイトル */
  column-gap: 0.7em;
  align-items: center; /* 縦の見た目を揃える */
  margin: 6px 0;
}

/* ラベル（箱） */
#content .concertLabel{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
  font-size: 11px;
  line-height: 1.2;
  border-radius: 4px;
  font-weight: 700;
}

/* 未来：予定 */
#content .concertLabel--future{
  background: #fff2e5;
  color: #c65300;
  border: 1px solid #f2b27a;
}

/* 空ラベル（場所だけ確保） */
#content .concertLabel--empty{
  visibility: hidden;
}

/* 日付は列の右端に寄せる */
#content .concertList__date{
  justify-self: end;
  white-space: nowrap;
}

/* タイトルは自然に折り返し */
#content .concertList__link{
  min-width: 0;
  word-break: break-word;
}

/* =========================================================
   通常ページの「白い箱」をうっすら透過（本命）
   ========================================================= */

body:not(.post-type-archive-album):not(.single-album) #container,
body:not(.post-type-archive-album):not(.single-album) #primary,
body:not(.post-type-archive-album):not(.single-album) #content{
  background: transparent !important; /* 外側の白を消す */
}

body:not(.post-type-archive-album):not(.single-album) article,
body:not(.post-type-archive-album):not(.single-album) .page,
body:not(.post-type-archive-album):not(.single-album) .post{
  background: rgba(255,255,255,0.94) !important; /* ここが白箱本体 */
  border-radius: 12px;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

/* =========================
   団員専用：Document / Library のファイル名折り返し対策
   ========================= */

/* 1行（1項目）を 左：説明 / 右：ファイル一覧 の2カラムにする */
#content .member-docs .member-docs__row,
#content .member-docs .member-docs__item{
  display: flex;
  gap: 18px;
  align-items: flex-start;
}

/* 左側（説明エリア）は縮んでもOK、ただし中身が潰れないよう min-width:0 */
#content .member-docs .member-docs__meta,
#content .member-docs .member-docs__left{
  flex: 1 1 auto;
  min-width: 0;
}

/* 右側（ファイル一覧）を少し広めに固定 */
#content .member-docs .member-docs__files,
#content .member-docs .member-docs__right{
  flex: 0 0 420px;   /* ←ここを 360〜520px で好み調整 */
  min-width: 320px;
}

/* ファイル名は折り返さず 1行省略（…） */
#content .member-docs .member-docs__files a,
#content .member-docs .member-docs__right a{
  display: block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* スマホでは固定幅をやめて縦並び（省略は維持） */
@media (max-width: 768px){
  #content .member-docs .member-docs__row,
  #content .member-docs .member-docs__item{
    display: block;
  }
  #content .member-docs .member-docs__files,
  #content .member-docs .member-docs__right{
    flex: none;
    min-width: 0;
    margin-top: 8px;
  }
}

/* 右側（ファイル名）を“絶対に2段にしない”＆長い時は…で省略 */
#content .member-docs .member-docs__files a,
#content .member-docs .member-docs__right a{
  display: block;
  width: 100%;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* 右側のカラムをもう少し広くしたい場合（必要なら） */
#content .member-docs .member-docs__files,
#content .member-docs .member-docs__right{
  flex: 0 0 460px;   /* 420→460に拡張。好みで 400〜520 */
  min-width: 340px;
}

/* ファイル名にホバー時ヒント */
#content .member-docs .member-docs__files a{
  position: relative;
}

#content .member-docs .member-docs__files a:hover::after{
  content: attr(href);
  position: absolute;
  left: 0;
  top: 100%;
  z-index: 10;
  background: #333;
  color: #fff;
  font-size: 12px;
  padding: 4px 6px;
  white-space: nowrap;
  border-radius: 4px;
}

/* =========================
   団員募集状況：スマホだけカード表示（安定版）
   ========================= */
@media (max-width: 768px){

  /* 表を縦展開 */
  .wp-block-table.recruit-table table,
  .wp-block-table.recruit-table thead,
  .wp-block-table.recruit-table tbody,
  .wp-block-table.recruit-table tr,
  .wp-block-table.recruit-table th,
  .wp-block-table.recruit-table td{
    display: block;
    width: 100%;
  }

  /* 見出し行はスマホでは非表示 */
  .wp-block-table.recruit-table thead{
    display: none;
  }

  /* 1行＝1カード */
  .wp-block-table.recruit-table tr{
    margin: 0 0 14px;
    padding: 12px 12px 10px;
    border: 1px solid #e3e3e3;
    border-radius: 10px;
    background: #fff;
  }

  /* セル：左ラベル / 右値（gridで固定） */
  .wp-block-table.recruit-table td{
    display: grid;
    grid-template-columns: 5.2em 1fr; /* ← ラベル幅 */
    column-gap: 10px;
    align-items: start;

    padding: 6px 0;
    border: none;

    font-size: 15px;
    line-height: 1.5;

    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
    min-width: 0;
    text-align: left;
  }

  /* ラベル（左） */
  .wp-block-table.recruit-table td::before{
    font-weight: 700;
    color: #555;
    text-align: left;
  }

  /* ▼列数に合わせてラベルを付与（4列） */
  .wp-block-table.recruit-table td:nth-child(1)::before{ content: "楽器名"; }
  .wp-block-table.recruit-table td:nth-child(2)::before{ content: "団員数"; }
  .wp-block-table.recruit-table td:nth-child(3)::before{ content: "募集状況"; }
  .wp-block-table.recruit-table td:nth-child(4)::before{ content: "備考"; }

  /* ▼備考が空っぽ（空白/改行だけ等）の行は、いったん隠して… */
  .wp-block-table.recruit-table td:nth-child(4){
    display: none;
    font-size: 14px; /* 備考だけ少し小さく */
    color: #666;
  }

  /* …何か入っている時だけ表示 */
  .wp-block-table.recruit-table td:nth-child(4):not(:empty){
    display: grid;
  }
}


 /* 送信ボタン 複数クリック対策 */
.wpcf7 form.is-submitting{
  opacity: .65;
  pointer-events: none;
}
.wpcf7 form.is-submitting input[type="submit"]{
  opacity: 1;
}