/* Global */
/*font*/
@font-face {
  font-family: NanumSquareRound;
  src: url(asset/fonts/NanumSquareRoundL.eot) format('embedded-opentype'),
    url(asset/fonts/NanumSquareRoundL.woff) format('woff'),
    url(asset/fonts/NanumSquareRoundL.ttf) format('truetype');
  font-weight: 300;
}
@font-face {
  font-family: NanumSquareRound;
  src: url(asset/fonts/NanumSquareRoundR.eot) format('embedded-opentype'),
    url(asset/fonts/NanumSquareRoundR.woff) format('woff'),
    url(asset/fonts/NanumSquareRoundR.ttf) format('truetype');
  font-weight: 400;
}
@font-face {
  font-family: NanumSquareRound;
  src: url(asset/fonts/NanumSquareRoundB.eot) format('embedded-opentype'),
    url(asset/fonts/NanumSquareRoundB.woff) format('woff'),
    url(asset/fonts/NanumSquareRoundB.ttf) format('truetype');
  font-weight: 700;
}
@font-face {
  font-family: NanumSquareRound;
  src: url(asset/fonts/NanumSquareRoundEB.ttf) format('truetype');
  font-weight: 900;
}
@font-face {
  font-family: Gwangju;
  src: url(asset/fonts/빛고을광주_Light.ttf) format('truetype');
  font-weight: 300;
}
@font-face {
  font-family: Gwangju;
  src: url(asset/fonts/빛고을광주_Medium.ttf) format('truetype');
  font-weight: 400;
}
@font-face {
  font-family: Gwangju;
  src: url(asset/fonts/빛고을광주_Bold.ttf) format('truetype');
  font-weight: 700;
}
@font-face {
  font-family: Jua;
  src: url(asset/fonts/Jua-Regular.ttf) format('truetype');
  font-weight: 700;
}
:root {
  /* Color */
  --color-white: #ffffff;
  --color-light-white: #f3f3f4;
  --color-dark-white: #eeeeee;
  --color-green-light: #48c5bd;
  --color-green-yellow: #b8e352;
  --color-black: #000000;
  --color-dark-grey: #202020;
  --color-grey: #6f7271;
  --color-light-grey: #dededf;
  --color-point: #1cc5a3;
  --color-yellow: #ffe330;
  --color-beige: #f9f3e4;
  --color-blue: #494c8a;
  --color-transparent-white: rgba(255, 255, 255, 0);

  /* Font size */
  --font-large: 2.975rem; /* 48px */
  --font-medium: 1.75rem; /* 32px */
  --font-regular: 1rem; /* 16px */
  --font-small: 0.875rem; /* 14px */
  --font-micro: 0.8rem; /* 12px */

  /* Font weight */
  --weight-black: 900;
  --weight-bold: 700;
  --weight-regular: 400;
  --weight-light: 300;

  /* Size */
  --size-border-radius: 8px;

  /* line-height */
  --line-height-regular: 1.8rem;
  --line-height-small: 1.4rem;

  /* padding */
  --padding-small: 0.25rem;
  --padding-medium: 0.5rem;
  --padding-large: 1rem;
  --padding-section: 6rem;

  /* Annimation */
  --annimation-duration: 300ms;
}

/* reset */
* {
  box-sizing: border-box;
}
body {
  font-family: 'NanumSquareRound', sans-serif;
}
a,
a:hover,
a:focus {
  text-decoration: none;
  color: var(--color-black);
}
li {
  list-style: none;
}
button {
  background-color: transparent;
  cursor: pointer;
  border: none;
  outline: none;
  padding: 0;
}
/* Typography */
h1 {
  /* logo-img */
}

h2 {
  /* main slider title */
  font-size: var(--font-large);
  font-weight: var(--weight-regular);
  color: var(--color-black);
}

h3 {
  /* section title */
  font-size: var(--font-medium);
  font-weight: var(--weight-black);
  color: var(--color-grey);
  font-family: jua;
}

h4,
h5 {
  /* inner title(list, banner) */
  font-size: var(--font-regular);
  font-weight: var(--weight-bold);
  color: var(--color-black);
}
p {
  font-size: var(--font-regular);
  font-weight: var(--font-regular);
  color: var(--color-dark-grey);
  word-break: keep-all;
}

/* 48rem = 768px */
@media screen and (max-width: 48rem) {
  :root {
    /* Font size */
    --font-large: 2rem; /* 32px */
    --font-medium: 1.5rem; /* 24px */
    --font-regular: 1rem; /* 16px */
    --font-small: 0.875rem; /* 14px */
    --font-micro: 0.75rem; /* 12px */
  }
}