/* --------------------------------------------------------------------------
  VARIABLE
-------------------------------------------------------------------------- */
:root {
  --font-size: 16;
}

@media all and (max-width: 340px) {
  :root {
    --font-size: 20;
  }
}

:root {
  /* -----------------------------
    VARIABLEーフォントサイズ　※単位px（呼び出し用）
  ----------------------------- */
  --text-size-xxxxxl: 28;
  --text-size-xxxxl: 26;
  --text-size-xxxl: 24;
  --text-size-xxl: 22;
  --text-size-xl: 20;
  --text-size-l: 18;
  --text-size-m: 16;
  --text-size-s: 14;
  --text-size-xs: 12;
  --text-size-xxs: 10;

  /* -----------------------------
    VARIABLEーカラー
  ----------------------------- */
  --color-white: #fff;
  --color-gray: #808c85;
  --color-black: #363636;
  --color-blue: #0b788d;
  --color-blue-02: #2178a3;
  --color-blue-03: #026488;
  --color-red: #b93c2f;
  --color-red-02: #D33424;
  --color-orange: #df6600;
  --color-border: #ececec;
  --color-border-02: #e7e2d6;
  --color-btn: #b47e13;
  --color-btn-02: #bf4300;
  --color-bg: #ffffff;
  --color-bg-02: #f9f6ef;
  --color-bg-gray: #f9f9f9;
  --color-bg-gray-02: #f1f1f1;
  --color-bg-blue: #e9f2f6;
  --color-bg-beige: #faf7ee;
  --color-bg-red: #fdeaea;
  --color-bg-red-02: #F6D6D3;
  --color-bg-table: #f5f1e7;
  --color-valid: #f9ede6;
}

@media all and (min-width: 820px), print {
  :root {
    /* -----------------------------
    VARIABLEーフォントサイズ　※単位px（呼び出し用）
  ----------------------------- */
    --text-size-xxxxxl: 28;
    --text-size-xxxxl: 26;
    --text-size-xxxl: 24;
    --text-size-xxl: 22;
    --text-size-xl: 20;
    --text-size-l: 18;
    --text-size-m: 16;
    --text-size-s: 14;
    --text-size-xs: 12;
    --text-size-xxs: 10;
  }
}