/* 講習会一覧テーブルの基本スタイル */
/*.table01 {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  margin: 0 auto;
  font-size: 1em;
}*/
.table01 {
  table-layout: auto;
  width: 100%;
  border-collapse: collapse;
}

/* セル共通スタイル */
.table01 th,
.table01 td {
  padding: 1px;
  border: 1px solid #999;
  word-break: break-word;
  overflow-wrap: break-word;
  text-align: center;
  color: #000;
}

/* 列ごとの幅指定 */
table.table01 th:nth-child(1),
table.table01 td:nth-child(1) {
  width: 6.5% !important;
  min-width: 60px;
  font-size: 0.85em;
  padding: 2px;
  text-align: center;
}

.table01 th:nth-child(2),
.table01 td:nth-child(2) {
  padding: 0;
  font-size: 0.9em;
  text-align: center;
  letter-spacing: -0.03em; /* 文字間をほんの少し詰める */
}

.table01 th:nth-child(3),
.table01 td:nth-child(3) {
  padding: 0;
  font-size: 0.9em;
  text-align: center;
  letter-spacing: -0.03em; /* 文字間をほんの少し詰める */
}

.table01 th:nth-child(4),
.table01 td:nth-child(4) {
  padding: 0;
  font-size: 0.9em;
  text-align: center;
  letter-spacing: -0.03em; /* 文字間をほんの少し詰める */
}

/* ボタン共通スタイル */
.btn-common,
.btn-apply,
.btn-cancel {
  font-size: 16px;
  padding: 6px 12px;
  border: 1px solid #999;
  border-radius: 4px;
  background-color: #f0f0f0;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}

/* 申込ボタン */
.btn-apply {
  background-color: #4CAF50;
  color: white;
}

/* 取消ボタン */
.btn-cancel {
  background-color: #f44336;
  color: white;
}

/* 表示ボタン */
.btn-show {
  background-color: #2196F3;
  color: white;
  font-size: 14px;
  padding: 4px 10px;
  border-radius: 4px;
  border: none;
  cursor: pointer;
}

/* スマホ対応（必要に応じて調整） */
@media screen and (max-width: 768px) {
  .table01 {
    font-size: 0.95em;
  }

  .btn-common,
  .btn-apply,
  .btn-cancel,
  .btn-show {
    font-size: 14px;
    padding: 5px 10px;
  }
}
/* 予定表専用の列幅（colgroupがない場合はこちらを使う） */
.yotei-table th:nth-child(1),
.yotei-table td:nth-child(1) {
  width: 20%;
}

.yotei-table th:nth-child(2),
.yotei-table td:nth-child(2),
.yotei-table th:nth-child(3),
.yotei-table td:nth-child(3) {
  width: 40%;
}

/* テーブル全体の見た目（共通） */
.yotei-table {
  table-layout: fixed;
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95em;
}

/* セル共通 */
.yotei-table th,
.yotei-table td {
  border: 1px solid #999;
  padding: 6px;
  text-align: center;
  word-break: break-word;
}

/* ヘッダーだけ背景色を変える */
.yotei-table th {
  background-color: #eef;
  font-weight: bold;
}
.btn-display {
  background-color: #ffeb3b; /* 明るい黄色 */
  color: #000;               /* 黒文字で視認性アップ */
  border: 1px solid #ccc;
  padding: 2px 6px;
  font-size: 1.5em;
  border-radius: 4px;
  cursor: pointer;
}
/* PC表示 */
.col-date,
.col-show {
  display: table-cell;
}
.mobile-date,
.mobile-show {
  display: none;
}

/* スマホ表示 */
@media screen and (max-width: 768px) {
  .col-date,
  .col-show {
    display: none;
  }

  .mobile-date,
  .mobile-show {
    display: block;
    font-size: 0.9em;
    margin-top: 4px;
  }

  .mobile-label {
    font-weight: bold;
    margin-right: 4px;
  }

  .mobile-show .btn-display {
    margin-top: 4px;
  }
}
/* デフォルト（PC表示）では非表示 */
.mobile-only {
  display: none;
}

/* スマホ表示（768px以下）で表示 */
@media screen and (max-width: 768px) {
  .mobile-only {
    display: block;
    margin-top: 4px;
  }
}
@media screen and (max-width: 768px) {
  .mobile-only {
    display: flex;
    justify-content: center;
    margin-top: 6px;
  }
}
.inline-show-btn {
  background-color: #ffeb3b; /* 実際の表示ボタンと同じ黄色 */
  color: #000;               /* 文字色も同じ黒 */
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 0.9em;
  display: inline-block;
  font-weight: bold;
}