@charset "UTF-8";
/* =========================================================
 Base
========================================================= */
:root {
  /* メインビジュアル、見出し、ボタンに使用される色 */
  --primary-color: #ff572a;
  /* 本文テキストカラー */
  --text-color: #333333;
  --accent-color: #ffdb46;
  /* table */
  /* テーブルデータ文字色 */
  --td-color: var(--text-color);
  /* テーブルヘッダー背景 */
  --th-bg: rgba(22, 116, 134, 0.6);
  /* テーブルヘッダー2 背景 */
  --th-sub-bg: rgba(123, 186, 198, 0.5);
  /* テーブルデータ背景 */
  --td-bg: rgba(227, 246, 242, 0.5);
  /* テーブルヘッダー文字色 */
  --th-color: #fff;
  /* テーブルヘッダー2 文字色 */
  --th-sub-color: var(--text-color);
  /* テーブルで目立たせたいエリアの背景と文字色 */
  --th-primary: var(--primary-color);
  --td-primary-normal: #fbf1e4;
  --td-primary-sum: #ffeace;
  --td-secondary: rgba(179, 222, 229, 0.3);
}

/*=============================
  背景
============================= */
.background-1 {
  background-color: #fcf5d8;
}

.background-2 {
  background-color: #fff;
}

.background-3 {
  background: #fbf1e4 url("../images/campaign/period_bg_2.jpg") no-repeat right bottom/contain;
}

@media (min-width: 960px) {
  .background-3 {
    background-size: 33% auto;
  }
}

.background-4 {
  background-color: #ffeeaa;
}

.background-white {
  background-color: #fff;
}