@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");

* {
  margin: 0px;
  padding: 0px;
  list-style: none;
  color: var(--text-title-color);
  text-decoration: none;
  font-family: "Pretendard Variable", sans-serif;
  box-sizing: border-box;

  font-size: 15px;
  font-weight: normal;
  pointer-events: auto;
  white-space: nowrap;

  /* 중요! print시 배경색을 브라우저가 빼버리는데 아래의 CSS가 있다면 적용시켜줄 수 있다. */
  print-color-adjust : exact;
  -webkit-print-color-adjust : exact;
}
a,
abbr,
acronym,
address,
applet,
b,
big,
blockquote,
button,
caption,
center,
cite,
code,
dd,
del,
dfn,
div,
dl,
dt,
em,
fieldset,
font,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
nav,
object,
ol,
p,
pre,
q,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
title,
tr,
tt,
u,
ul,
var {
  background: transparent;
  border: 0px;
  margin: 0px;
  outline: 0px;
  padding: 0px;
  vertical-align: baseline;
}

:root {
  /* size - html 기본값 15px 기준*/
  --h1-size: 3.5rem; /* px; */
  --h2-size: 2.666rem; /* 40px */
  --h3-size: 1.666rem; /* 25px */
  --h4-size: 1.4rem; /* 21px */
  --h5-size: 1.2666rem; /* 19px */
  --p-size: 1.133rem; /* 17px */
  --span-size: 1rem; /* 15px */
  --small-size: 0.87rem; /* 13px */

  /* text - color */
  --text-body-color: #555555;
  --text-title-color: #1d1d1d;
  --text-disable-color: #8e8e8e;

  /* background - color */
  --background-gray-color1: #f0f0f0;
  --background-gray-color2: #f8f8f8;
  --background-gray-color3: #ffffff;
  --background-disabled-color: #e4e4e4;

  /* theme - color */
  --primary-base-color: #0086e6;
  --primary-hover-color: #0771be;
  --primary-pressed-color: #15486f;
  --primary-light-color: #d4ebfb;
  --primary-light-hover-color: #aad7f7;
  --primary-light-pressed-color: #80c3f3;

  --secondary-base-color: #9cd300;

  --third-base-color: #252899;

  /* used color */
  --red-text-color: #d50136;
  --green-text-color: #56c929;
  --yellow-text-color: #ffc107;
  --red-background-color: #fcdfe6;
  --red-bolder-color: #eb003b;
  --placeholder-color: #717171;

  /* border */
  --border-gray-color: #c6c6c6;
  --border-gray-color2: #d8d8d8;
  --border-primary-light-color: #55aeee;
  --border-primary-light-hover-color: #2b9aea;
}

h1 {
  font-size: var(--h1-size);
  font-weight: bold;
}
h2 {
  font-size: var(--h2-size);
  font-weight: bold;
}
h3 {
  font-size: var(--h3-size);
  font-weight: 700;
}
h4 {
  font-size: var(--h4-size);
  font-weight: 500;
}
h5 {
  font-size: var(--h5-size);
  font-weight: 500;
}
p {
  font-size: var(--p-size);
  font-weight: 500;
}
span {
  font-size: var(--span-size);
  font-weight: 500;
}

body {
  /* 15px */
  font-size: var(--span-size);
  font-weight: 500;
}

small {
  /* 14px */
  font-size: var(--small-size);
  font-weight: 300;
}

button {
  background-color: transparent;
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

/* 스크롤바 */
div::-webkit-scrollbar {
  /* width: 10px; */
  /* height: 10px; */
}
div::-webkit-scrollbar-thumb {
  /* width: 10px; */
  /* border-radius: 20px; */
  /* background-color: var(--highlight-blue); */
}
div::-webkit-scrollbar-track-piece {
  /* background-color: transparent; */
  /* border: 10px; */
}