@charset "utf-8";

/* 세리프(명조) : 이 테마의 기본 서체입니다.
   - 한글 : Noto Serif KR
   - 영문 : Cormorant Garamond (이탤릭이 특히 곱습니다)
   ※ @import 는 @charset 다음, 다른 규칙보다 먼저 와야 합니다. */
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@300;400;500;600&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&display=swap");

/* ============================================================
   웹폰트

   - 고딕(Pretendard) 파일은 head.sub.php 의 <link> 에서 불러옵니다.
     본문 중 숫자·폼처럼 또렷해야 하는 곳에만 씁니다.
   - 이 파일은 "어떤 요소에 어떤 서체를 쓸지"만 관리합니다.
   ============================================================ */

:root {
  /* 기본 : 한글 명조 + 영문 개러몬드 */
  --font-base: "Noto Serif KR", "Cormorant Garamond", "Nanum Myeongjo",
    "Apple SD Gothic Neo", serif;

  /* 영문 전용 : 라벨 · 챕터 번호 · 브랜드명처럼 영문만 나오는 자리 */
  --font-en: "Cormorant Garamond", "Noto Serif KR", serif;

  /* 고딕 : 입력폼 · 버튼 등 또렷해야 하는 곳 */
  --font-sans: "Pretendard Variable", Pretendard, -apple-system,
    BlinkMacSystemFont, system-ui, "Apple SD Gothic Neo", "Malgun Gothic",
    sans-serif;

  /* 숫자 전용 */
  --font-num: var(--font-en);
}

body {
  font-family: var(--font-base);
}

/* 영문 라벨 유틸 : 영문·숫자만 들어가는 자리에만 씁니다.
   ※ 한글에는 쓰지 마세요. 개러몬드에 한글 글자가 없어 다른 서체로 떨어지고,
     대문자 변환도 통하지 않으며, 넓은 자간은 낱글자로 흩어져 읽히지 않습니다. */
.en {
  font-family: var(--font-en);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

/* 숫자 유틸 : 자릿수가 바뀌어도 흔들리지 않게 고정폭 */
.num {
  font-family: var(--font-num);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

/* 그누보드 기본 css(default.css / default_shop.css / mobile.css)가
   제목과 폼 요소에 '맑은 고딕'을 따로 지정해 두었기 때문에,
   본문 서체를 그대로 물려받도록 되돌린다. */
h1,
h2,
h3,
h4,
h5,
h6,
optgroup {
  font-family: inherit;
}

/* 입력폼과 버튼은 명조보다 고딕이 읽기 좋다 */
input,
button,
select,
textarea {
  font-family: var(--font-sans);
}