@font-face {
  font-family: "Pretendard";
  src: url("/public/fonts/pretendard/static/woff2/Pretendard-Thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Pretendard";
  src: url("/public/fonts/pretendard/static/woff2/Pretendard-ExtraLight.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Pretendard";
  src: url("/public/fonts/pretendard/static/woff2/Pretendard-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Pretendard";
  src: url("/public/fonts/pretendard/static/woff2/Pretendard-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Pretendard";
  src: url("/public/fonts/pretendard/static/woff2/Pretendard-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Pretendard";
  src: url("/public/fonts/pretendard/static/woff2/Pretendard-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Pretendard";
  src: url("/public/fonts/pretendard/static/woff2/Pretendard-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Pretendard";
  src: url("/public/fonts/pretendard/static/woff2/Pretendard-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Pretendard";
  src: url("/public/fonts/pretendard/static/woff2/Pretendard-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Wanted Sans";
  src: url("/public/fonts/wanted-sans/static/complete/woff2/WantedSans-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Wanted Sans";
  src: url("/public/fonts/wanted-sans/static/complete/woff2/WantedSans-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Wanted Sans";
  src: url("/public/fonts/wanted-sans/static/complete/woff2/WantedSans-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Wanted Sans";
  src: url("/public/fonts/wanted-sans/static/complete/woff2/WantedSans-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Wanted Sans";
  src: url("/public/fonts/wanted-sans/static/complete/woff2/WantedSans-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Wanted Sans";
  src: url("/public/fonts/wanted-sans/static/complete/woff2/WantedSans-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Wanted Sans";
  src: url("/public/fonts/wanted-sans/static/complete/woff2/WantedSans-ExtraBlack.woff2") format("woff2");
  font-weight: 1000;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "GothamBook";
  src: url("/public/fonts/GothamBook.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "GothamLight";
  src: url("/public/fonts/Gotham-Font/GothamLight.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "GothamMedium";
  src: url("/public/fonts/Gotham-Font/GothamMedium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "GothamBold";
  src: url("/public/fonts/Gotham-Font/GothamBold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "GothamBook";
  src: url("/public/fonts/GothamBookItalic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: optional;
}

:root {
  --color-bg: #ffffff;
  --color-text: #111111;
  --color-accent: #000000;
  --color-error: #f04452;
  --page-gutter: 16px;
  --grid-gap: 16px;
  --page-top-space: 72px;
  --shop-top-space: 96px;
  --product-top-space: 72px;
  --footer-row-gap: 24px;
  --page-column-width: calc((100vw - var(--page-gutter) - var(--page-gutter) - var(--grid-gap) - var(--grid-gap)) / 3);
  --page-second-start: calc(var(--page-gutter) + var(--page-column-width) + var(--grid-gap));
  --page-third-start: calc(100vw - var(--page-gutter) - var(--page-column-width));

  --font-kr: "Pretendard", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-en: "GothamBook", sans-serif;
  --font-display: "Wanted Sans", sans-serif;
  --font-book: var(--font-en);
  --font-light: "GothamLight", var(--font-en);
  --font-medium: "GothamMedium", var(--font-en);
  --font-bold: "GothamBold", var(--font-medium);
  --font-kor-body: var(--font-kr);
  --font-kor-ui: var(--font-kr);
  --font-kor-meta: var(--font-kr);
  --font-kor-caption: var(--font-kr);
  --font-kor-form: var(--font-kr);
  --font-kor-legal: var(--font-kr);
  --font-kor-heading: var(--font-display);
  --font-kor-button: var(--font-display);
  --font-kor-sticker: var(--font-display);
  --font-english-ui: var(--font-en);
  --font-base: var(--font-en);
  --tracking-latin: -0.02em;
  --tracking-korean: -0.03em;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 32px;
}

@media (min-width: 960px) {
  :root {
    --page-gutter: 40px;
    --grid-gap: 40px;
    --page-top-space: 160px;
    --shop-top-space: 160px;
    --product-top-space: 112px;
    --footer-row-gap: 32px;
  }
}

.site-footer__text--lead > p:last-child {
  font-family: var(--font-english-ui);
  letter-spacing: var(--tracking-latin);
}

.site-footer__link {
  font-family: var(--font-kor-legal);
  letter-spacing: var(--tracking-korean);
}