@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard-dynamic-subset.min.css');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');

:root {
  --trans-color: transparent;
  --point-white: #fff;
  --point-color01: #004098;
  --point-color02: #009C42;
  --point-color03: #F2F7FB;
  --point-grad01: linear-gradient(#FFF 0%, #777 100%);
  --border-color01: #ddd;
  --border-color02: #ccc;
  --border-color03: #eee;
  --black-color00: #000;
  --black-color01: #111;
  --black-color02: #222;
  --black-color03: #333;
  --black-color04: #444;
  --black-color05: #555;
  --black-color06: #666;
  --black-color07: #777;
  --black-color08: #888;
  --black-color09: #999;
  --black-color10: #aaa;
  --black-color11: #bbb;
  --black-color12: #3A3938;
  --gray-bg01: #F5F5F5;
  --gray-bg02: #F8F8F8;
  --gray-bg03: #FAFAFA;
  --gray-bg04: #D9D9D9;
  --font-ko: 'Pretendard', 'Noto Sans KR', 'Malgun Gothic', '맑은 고딕', dotum, sans-serif;
  --font-num: 'Inter', 'Pretendard', 'Malgun Gothic', '맑은 고딕', dotum, sans-serif;
  --filter-white: brightness(0) invert(1);
  --filter-black: brightness(0);
  --poly-path01: polygon(100% 0, 0 100%, 100% 100%);
  --poly-path02: polygon(100% calc(100% - 12px), 100% calc(100% - 12px), 100% 100%, calc(100% - 12px) 100%);
  --poly-path03: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  --poly-path04: polygon(85% 0, 85% 40%, 100% 40%, 50% 100%, 0 40%, 15% 40%, 15% 0);
  --poly-path05: polygon(30px 0%, calc(100% - 30px) 0%, 100% 50%, calc(100% - 30px) 100%, 30px 100%, 0% 50%);
  --poly-path06: polygon(0 0, 2px 0, 100% 100%, calc(100% - 2px) 100%);
  --poly-path07: polygon(60% 0, 60% 60%, 100% 60%, 50% 100%, 0 60%, 45% 60%, 45% 0);
  --shadow-01: 3px 3px 5px rgba(0,0,0,0.1);
  --shadow-02: 5px 5px 20px rgba(0,0,0,0.10);
  --shadow-03: 10px 10px 20px rgba(0,0,0,0.15);
  --shadow-04: 20px 20px 20px rgba(0,0,0,0.10);
  --radius-40: 40px;
  --radius-30: 30px;
  --radius-20: 20px;
  --radius-16: 16px;
  --radius-15: 15px;
  --radius-14: 14px;
  --radius-10: 10px;
  --inner-width: 1520px;
  --header-h: 100px;
  --title-20: 20px;
  --title-19: 19px;
  --title-18: 18px;
  --title-17: 17px;
  --title-16: 16px;
  --title-15: 15px;
  --title-14: 14px;
  --title-13: 13px;
  --title-12: 12px;
  --title-11: 11px;
}

@media (max-width: 1023px) {
  :root {
    --title-20: 19px;
    --title-19: 18px;
    --title-18: 17px;
    --title-17: 16px;
    --title-16: 15px;
    --title-15: 14px;
    --title-14: 13px;
    --title-13: 12px;
    --title-12: 11px;
    --title-11: 10px;
  }
}
@media (max-width: 860px) {
  :root {
    --radius-40: 30px;
    --radius-30: 20px;
    --radius-20: 15px;
    --radius-16: 12px;
    --radius-15: 11px;
    --radius-14: 10px;
    --radius-10: 7px;
    --title-20: 18px;
    --title-19: 17px;
    --title-18: 16px;
    --title-17: 15px;
    --title-16: 14px;
    --title-15: 13px;
    --title-14: 12px;
    --title-13: 11px;
    --title-12: 10px;
    --title-11: 10px;
  }
}
@media (max-width: 640px) {
  :root {
    --poly-path05: polygon(20px 0%, calc(100% - 20px) 0%, 100% 50%, calc(100% - 20px) 100%, 20px 100%, 0% 50%);
    --shadow-02: 2.5px 2.5px 10px rgba(0,0,0,0.10);
    --shadow-03: 5px 5px 10px rgba(0,0,0,0.15);
    --shadow-04: 10px 10px 10px rgba(0,0,0,0.10);
    --radius-40: 20px;
    --radius-30: 15px;
    --radius-20: 10px;
    --radius-16: 8px;
    --radius-15: 7.5px;
    --radius-14: 7px;
    --radius-10: 5px;
    --title-20: 17px;
    --title-19: 16px;
    --title-18: 15px;
    --title-17: 14px;
    --title-16: 13px;
    --title-15: 12px;
  }
}
@media (max-width: 479px) {
  :root {
    --title-20: 16px;
    --title-19: 15px;
    --title-18: 14px;
    --title-17: 13px;
  }
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; }
body { font-family: 'Pretendard', 'Malgun Gothic', '맑은 고딕', dotum, sans-serif; color: #111; line-height: 1.5; word-break: keep-all; text-wrap-style: balance; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { border: none; background: none; cursor: pointer; font-family: inherit; }
