:root {

   /* ======================
     COLOR
  ====================== */

   /* Brand */
   --color-primary: #ff0000;

   --color-navy-01: #292e75;
   --color-navy-02: #002d72;
   --color-navy-03: #0d3674;
   --color-navy-04: #0a264e;
   --color-gray: #7b7b7b;



   /* Font */
   --fc-white: #fff;
   --fc-black: #111;
   --fc-gray-99: #999;
   --fc-gray-88: #888;
   --fc-gray-76: #767676;
   --fc-gray-66: #666;
   --fc-gray-50: #505050;
   --fc-gray-3c: #3c3c3c;

   /* Background */
   --bg-100: #fff;
   --bg-200: #f8f8f8;
   --bg-300: #f5f5f5;
   --bg-400: #f4f4f4;

   /* Border */
   --line-100: #f1f1f1;
   --line-200: #e5e5e5;
   --line-300: #dbdbdb;


   /* ======================
     SEMANTIC
  ====================== */

   --color-text: var(--fc-black);
   --color-bg: var(--bg-100);


   /* ======================
     TYPOGRAPHY
  ====================== */

   --fs-12: 0.75rem;
   --fs-13: 0.8125rem;
   --fs-14: 0.875rem;
   --fs-15: 0.9375rem;
   --fs-16: 1rem;
   --fs-18: 1.125rem;
   --fs-20: 1.25rem;
   --fs-24: 1.5rem;
   --fs-30: 1.875rem;
   --fs-36: 2.25rem;

   --font-ko: "Noto Sans KR", sans-serif;
   --font-en: "Montserrat", sans-serif;
   --font-jp: "GenEi M Gothic", "Noto Sans JP", sans-serif;


   /* ======================
     SPACING
  ====================== */

   --space-4: 0.25rem;
   --space-8: 0.5rem;
   --space-12: 0.75rem;
   --space-16: 1rem;
   --space-20: 1.25rem;
   --space-24: 1.5rem;
   --space-30: 1.875rem;
   --space-32: 2rem;


   /* ======================
     LAYOUT
  ====================== */

   --container-width: 1480px;
   --container-padding: 16px;


   /* ======================
     EFFECT
  ====================== */

   --transition: .3s ease;


   /* ======================
     Z-INDEX
  ====================== */

   --z-dropdown: 100;
   --z-header: 500;
   --z-modal: 1000;
}