/* ===========================
    Variables
=========================== */

:root {
  /* font-size */
  --font-size-xxl: 8rem;
  --font-size-xl: 6rem;
  --font-size-lg: 4.6rem;
  --font-size-md: 3rem;
  --font-size-base: 2.4rem;
  --font-size-sm: 2rem;
  --font-size-xs: 1.8rem;
  --font-size-xxs: 1.6rem;
  --font-size-tiny: 1.4rem;
  --font-size-mini: 1.2rem;

  /* font weight */
  --font-weight-black: 900;
  --font-weight-extra-bold: 800;
  --font-weight-bold: 700;
  --font-weight-semi-bold: 600;
  --font-weight-medium: 500;
  --font-weight-regular: 400;
  --font-weight-light: 300;
  --font-weight-extra-light: 200;
  --font-weight-thin: 100;

  /* color */
  --color-white: #ffffff;
  --color-black: #000000;
  --color-gray-02: #222222;
  --color-gray-025: #2c2c2c;
  --color-gray-03: #333333;
  --color-gray-04: #484848;
  --color-gray-06: #666666;
  --color-gray-08: #cccccc;
  --color-gray-09: #999999;
  --color-navy-01: #181f2e;

  --color-hover-bg: #2C2E45;
  --color-hover-bg-06: rgba(44, 46, 69, 0.6);
  --color-hover-bg-08: rgba(44, 46, 69, 0.8);
  --color-beige: #E5C095;
  --color-beige-05: rgba(229, 192, 149, 0.5);
  --color-hover-fz: #FFF0DE;
  --color-gray-boder: #bfbfbf;
  
  /* alpha */
  --alpha-white-5: rgba(255, 255, 255, 0.05);
  --alpha-white-10: rgba(255, 255, 255, 0.1);
  --alpha-white-15: rgba(255, 255, 255, 0.15);
  --alpha-white-20: rgba(255, 255, 255, 0.2);
  --alpha-white-25: rgba(255, 255, 255, 0.25);
  --alpha-white-30: rgba(255, 255, 255, 0.3);
  --alpha-white-35: rgba(255, 255, 255, 0.35);
  --alpha-white-40: rgba(255, 255, 255, 0.4);
  --alpha-white-45: rgba(255, 255, 255, 0.45);
  --alpha-white-50: rgba(255, 255, 255, 0.5);
  --alpha-white-55: rgba(255, 255, 255, 0.55);
  --alpha-white-60: rgba(255, 255, 255, 0.6);
  --alpha-white-65: rgba(255, 255, 255, 0.65);
  --alpha-white-70: rgba(255, 255, 255, 0.7);
  --alpha-white-75: rgba(255, 255, 255, 0.75);
  --alpha-white-80: rgba(255, 255, 255, 0.8);
  --alpha-white-85: rgba(255, 255, 255, 0.85);
  --alpha-white-90: rgba(255, 255, 255, 0.9);
  --alpha-white-95: rgba(255, 255, 255, 0.95);

  --alpha-black-5: rgba(0, 0, 0, 0.05);
  --alpha-black-10: rgba(0, 0, 0, 0.1);
  --alpha-black-15: rgba(0, 0, 0, 0.15);
  --alpha-black-20: rgba(0, 0, 0, 0.2);
  --alpha-black-25: rgba(0, 0, 0, 0.25);
  --alpha-black-30: rgba(0, 0, 0, 0.3);
  --alpha-black-35: rgba(0, 0, 0, 0.35);
  --alpha-black-40: rgba(0, 0, 0, 0.4);
  --alpha-black-45: rgba(0, 0, 0, 0.45);
  --alpha-black-50: rgba(0, 0, 0, 0.5);
  --alpha-black-55: rgba(0, 0, 0, 0.55);
  --alpha-black-60: rgba(0, 0, 0, 0.6);
  --alpha-black-65: rgba(0, 0, 0, 0.65);
  --alpha-black-70: rgba(0, 0, 0, 0.7);
  --alpha-black-75: rgba(0, 0, 0, 0.75);
  --alpha-black-80: rgba(0, 0, 0, 0.8);
  --alpha-black-85: rgba(0, 0, 0, 0.85);
  --alpha-black-90: rgba(0, 0, 0, 0.9);
  --alpha-black-95: rgba(0, 0, 0, 0.95);
}