:root {
  /** COLOR**/
  --primary: #E4096D;

  --primary-light: #cc5b8f;
  --primary-dark: #902c5a;

  --evaluator: #2448b2;
  --evaluator-light: #546db9;

  --admin: #222222;
  --admin-light: #464646;

  --secondary: #9fa0a0;
  --sky-dark: #80a6cf;

  --gray-0: #ffffff;
  --gray-50: #f8f8f8;
  --gray-100: #e5e5e5;
  --gray-150: #d9d9d9;
  --gray-200: #cccccc;
  --gray-250: #bfbfbf;
  --gray-300: #b2b2b2;
  --gray-350: #a6a6a6;
  --gray-400: #999999;
  --gray-450: #8c8c8c;
  --gray-500: #808080;
  --gray-550: #737373;
  --gray-600: #666666;
  --gray-650: #595959;
  --gray-700: #4d4d4d;
  --gray-750: #404040;
  --gray-800: #333333;
  --gray-850: #262626;
  --gray-900: #1a1a1a;
  --gray-950: #0d0d0d;
  --gray-000: #000000;

  --border-gray: #9d9d9d;
  --defaultTextColor: #000000;

  /** FONT FAMILY**/
  --defaultFont: "Pretendard", "Noto Sans KR", "맑은 고딕", sans-serif;
  --kanit: "Kanit", "Pretendard", sans-serif;

  /** FONT SIZE **/
  --defaultTextSize: 16px;
  --padFontSize: 15px;
  --mobileFontSize: 14px;

  /** TRANSITION **/
  --transition: all 0.2s;

  /** SHADOW **/
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),
    0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),
    0 8px 10px -6px rgb(0 0 0 / 0.1);
  --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
  --shadow-none: 0 0 #0000;
}