/*講習会 training レコード*/

/*---　rows内の設定　---*/
.cancel_participants .col_1 {
  flex: 3;
}

.cancel_participants .col_2 {
  flex: 2;
}

.cancel_participants .col_3 {
  flex: 1;
  text-align: center;
}

.cancel_participants .col_4 {
  flex: 2;
  text-align: center;
}

/* statusアイコン */

/* 参加 */
.cancel_participants .attended .stat::before {
  content: "参加";
  background-color: var(--blue1);
  color: #fff;
}

/* キャンセル */
.cancel_participants .cancelled .stat::before {
  content: "キャンセル";
  background-color: var(--red);
  color: #fff;
}

/* 処理済 */
.cancel_participants .refunded .stat::before {
  content: "処理済";
  background-color: var(--gray4);
  color: #fff;
}

/* 背景色の設定 */

/* キャンセル */
.cancel_participants .cancelled {
  background-color: var(--cancelled);
}

/* 処理済 */
.cancel_participants .refunded {
  background-color: var(--refunded);
}

/* キャンセル日の表示 */

/* 参加 */
.cancel_participants .attended .col_2::before,
.cancel_participants .attended .col_3::before,
.cancel_participants .attended .col_4::before {
  content: "—";
}

/* 処理日 未処理の表示 */
.cancel_participants .cancelled .col_4::before {
  content: "未処理";
}

@media only screen and (max-width: 768px) {
  .cancel_participants .col_3 {
    text-align: left;
  }
}