:root {
  color-scheme: light dark;
  color: var(--White);
  background-color: var(--Black-normal);

  font-synthesis: none;
  text-rendering: optimizeLegibility;
  /*드래그 방지*/
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;


  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* Color styles */
  /* White */
  --White: rgb(255, 255, 255, 1);
  /* Gray */
  --Gray-50: rgba(246, 246, 246, 1);
  --Gray-200: rgba(209, 209, 209, 1);
  --Gray-300: rgba(176, 176, 176, 1);
  --Gray-400: rgba(136, 136, 136, 1);
  --Gray-500: rgba(109, 109, 109, 1);
  --Gray-600: rgba(93, 93, 93, 1);
  --Gray-700: rgba(79, 79, 79, 1);
  --Gray-800: rgba(69, 69, 69, 1);
  --Gray-900: rgba(61, 61, 61, 1);
  --Gray-950: rgba(17, 17, 17, 1);
  /* Black */
  --Black-light: rgba(231, 231, 231, 1);
  --Black-light-hover: rgba(219, 219, 219, 1);
  --Black-light-active: rgba(181, 181, 181, 1);
  --Black-normal: rgba(17, 17, 17, 1);
  --Black-normal-hover: rgba(15, 15, 15, 1);
  --Black-normal-active: rgba(14, 14, 14, 1);
  --Black-dark: rgba(13, 13, 13, 1);
  --Black-dark-hover: rgba(10, 10, 10, 1);
  --Black-dark-active: rgba(8, 8, 8, 1);
  --Black-darker: rgba(6, 6, 6, 1);


}
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box
}
/* 스크롤바 숨기기 (시각적으로만) */
::-webkit-scrollbar {
  display: none;
}

body {
  font-family: "Montserrat-Meduim";
  background-color: var(--Black-normal);
  scrollbar-width: none;
}

@font-face {
  font-family: 'Montserrat-Black';
  src: url('../fonts/Montserrat-Black.woff2') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat-ExtraBold';
  src: url('../fonts/Montserrat-ExtraBold.woff2') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat-Bold';
  src: url('../fonts/Montserrat-Bold.woff2') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat-SemiBold';
  src: url('../fonts/Montserrat-SemiBold.woff2') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat-Meduim';
  src: url('../fonts/Montserrat-Medium.woff2') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat-Regular';
  src: url('../fonts/Montserrat-Regular.woff2') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat-Light';
  src: url('../fonts/Montserrat-Light.woff2') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat-ExtraLight';
  src: url('../fonts/Montserrat-ExtraLight.woff2') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat-Thin';
  src: url('../fonts/Montserrat-Thin.woff2') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}


@font-face {
  font-family: 'RixInooAriDuri-Regular';
  src: url('../fonts/RixInooAriDuri-Regular.woff2') format('truetype');
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Ttangsbudaejjigae-Bold';
  src: url('../fonts/Ttangsbudaejjigae-Bold.woff2') format('truetype');
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Ttangsbudaejjigae-Medium';
  src: url('../fonts/Ttangsbudaejjigae-Medium.woff2') format('truetype');
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Ttangsbudaejjigae-Light';
  src: url('../fonts/Ttangsbudaejjigae-Light.woff2') format('truetype');
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Pretendard-Regular';
  src: url('../fonts/Pretendard-Regular.woff') format('truetype');
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Pretendard-SemiBold';
  src: url('../fonts/Pretendard-SemiBold.woff') format('truetype');
  font-style: normal;
  font-display: swap;
}
a {}

a:hover {}

body {
  margin: 0;
  place-items: center;

}

h1 {}
span{
  white-space: break-spaces;

}
button {
  border: 1px solid transparent;
  cursor: pointer;
  transition: border-color 0.25s;
}

button:hover {}

button:focus,
button:focus-visible {
  outline: 4px auto -webkit-focus-ring-color;
}

@media (prefers-color-scheme: light) {
  :root {
    color: var(--Black-normal);
    background-color: var(--White);
  }

  a:hover {
    color: #747bff;
  }

  button {
    background-color: #f9f9f9;
  }
}