/*Font: Roboto*/
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");

/*Font: Pretendard*/
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Thin.woff") format("woff");
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraLight.woff") format("woff");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff") format("woff");
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard";
  src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
}

/*body*/

html,
body {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Open Sans", "Helvetica Neue", sans-serif !important;
  letter-spacing: -0.025em;
  font-size: 10px;
}
div,
h1,
h2,
h3,
h4,
h5,
h6,
p {
  letter-spacing: -0.025em;
}

/* font */
.f_robo {
  font-family: "Roboto" !important;
  letter-spacing: -0.02em;
}

/*dft*/
.dft {
  word-break: keep-all;
  color: #111;
  text-transform: none;
}
h1.dft {
  font-size: 4.5rem;
  line-height: 1.3em;
}
h1.dft.bigsize {
  font-size: 5.5rem;
  line-height: 1.2em;
}
h1.dft.bigger {
  font-size: 6.5rem;
  line-height: 1.2em;
}
h1.dft.huge {
  font-size: 8.5rem;
  line-height: 1.2em;
}
h2.dft {
  font-size: 3.2rem;
  line-height: 1.3em;
}
h3.dft {
  font-size: 2.8rem;
  line-height: 1.3em;
  color: #333;
}
h4.dft {
  font-size: 2.4rem;
  line-height: 1.6em;
}
h4.dft.mini {
  font-size: 2.2rem;
  line-height: 1.4em;
}
h5.dft {
  font-size: 2rem;
  line-height: 1.6em;
}
h6.dft {
  font-size: 1.4rem;
  line-height: 1.6em;
}
p.dft {
  font-size: 1.8rem;
  line-height: 1.6em;
}
p.dft.mini {
  font-size: 1.6rem;
  line-height: 1.6em;
}
@media (max-width: 1200px) {
  h1.dft {
    font-size: calc(100vw * (45 / 1200));
  }
}
@media (max-width: 1200px) and (min-width: 992px) {
  h1.dft {
    font-size: calc(100vw * (45 / 1200));
  }
  h1.dft.bigsize {
    font-size: calc(100vw * (55 / 1200));
  }
  h1.dft.bigger {
    font-size: calc(100vw * (60 / 1200));
  }
  h1.dft.huge {
    font-size: calc(100vw * (65 / 1200));
  }
  h2.dft {
    font-size: calc(100vw * (35 / 1200));
  }
  h3.dft {
    font-size: calc(100vw * (30 / 1200));
  }
  h4.dft {
    font-size: calc(100vw * (24 / 1200));
  }
  h4.dft.mini {
    font-size: calc(100vw * (22 / 1200));
  }
  h5.dft {
    font-size: calc(100vw * (20 / 1200));
  }
  h6.dft {
    font-size: calc(100vw * (15 / 1200));
  }
  p.dft {
    font-size: calc(100vw * (18 / 1200));
  }
  p.dft.mini {
    font-size: calc(100vw * (16 / 1200));
  }
}
@media (max-width: 991px) and (min-width: 768px) {
  h1.dft {
    font-size: calc(100vw * (40 / 992));
  }
  h1.dft.bigsize {
    font-size: calc(100vw * (45 / 992));
  }
  h1.dft.bigger {
    font-size: calc(100vw * (50 / 992));
  }
  h1.dft.huge {
    font-size: calc(100vw * (55 / 992));
  }
  h2.dft {
    font-size: calc(100vw * (30 / 992));
  }
  h3.dft {
    font-size: calc(100vw * (30 / 992));
  }
  h4.dft {
    font-size: calc(100vw * (26 / 992));
  }
  h4.dft.mini {
    font-size: calc(100vw * (24 / 992));
  }
  h5.dft {
    font-size: calc(100vw * (22 / 992));
  }
  h6.dft {
    font-size: calc(100vw * (15 / 992));
  }
  p.dft {
    font-size: calc(100vw * (18 / 992));
  }
  p.dft.mini {
    font-size: calc(100vw * (16 / 992));
  }
}
@media (max-width: 768px) and (min-width: 500px) {
  h1.dft {
    font-size: calc(100vw * (35 / 768));
  }
  h1.dft.bigsize {
    font-size: calc(100vw * (40 / 768));
  }
  h1.dft.bigger {
    font-size: calc(100vw * (42 / 768));
  }
  h1.dft.huge {
    font-size: calc(100vw * (45 / 768));
  }
  h2.dft {
    font-size: calc(100vw * (30 / 768));
  }
  h3.dft {
    font-size: calc(100vw * (30 / 768));
  }
  h4.dft {
    font-size: calc(100vw * (26 / 768));
  }
  h4.dft.mini {
    font-size: calc(100vw * (24 / 768));
  }
  h5.dft {
    font-size: calc(100vw * (22 / 768));
  }
  h6.dft {
    font-size: calc(100vw * (15 / 768));
  }
  p.dft {
    font-size: calc(100vw * (18 / 768));
  }
  p.dft.mini {
    font-size: calc(100vw * (16 / 768));
  }
}
@media (max-width: 501px) {
  h1.dft {
    font-size: calc(100vw * (32 / 500));
  }
  h1.dft.bigsize {
    font-size: calc(100vw * (40 / 500));
  }
  h1.dft.bigger {
    font-size: calc(100vw * (42 / 500));
  }
  h1.dft.huge {
    font-size: calc(100vw * (45 / 500));
  }
  h2.dft {
    font-size: calc(100vw * (30 / 500));
  }
  h3.dft {
    font-size: calc(100vw * (24 / 500));
  }
  h4.dft {
    font-size: calc(100vw * (22 / 500));
  }
  h4.dft.mini {
    font-size: calc(100vw * (20 / 500));
  }
  h5.dft {
    font-size: calc(100vw * (18 / 500));
  }
  h6.dft {
    font-size: calc(100vw * (15 / 500));
  }
  p.dft {
    font-size: calc(100vw * (18 / 500));
  }
  p.dft.mini {
    font-size: calc(100vw * (16 / 500));
  }
}
/* word-keep */
.word-keep {
  word-break: keep-all;
}
.word-break {
  word-break: break-all;
}
/* font-weight */
.font-Thin {
  font-weight: 100 !important;
}
.font-ExtraLight {
  font-weight: 200 !important;
}
.font-Light {
  font-weight: 300 !important;
}
.font-Regular {
  font-weight: 400 !important;
}
.font-Medium {
  font-weight: 500 !important;
}
.font-Bold {
  font-weight: 600 !important;
}
.font-ExtraBold {
  font-weight: 700 !important;
}
.font-Heavy {
  font-weight: 800 !important;
}
.font-Black {
  font-weight: 900 !important;
}

/* subP */
.subP {
  font-weight: 300;
  letter-spacing: -0.08em;
}

/*color*/
.c_bei {
  color: #99977f !important;
}
.c_gd {
  color: #b6a679 !important;
}
.c_rd {
  color: #f00000 !important;
}
.c_org {
  color: #ff7427 !important;
}
.c_lorg {
  color: #f59a23 !important;
}
.c_yl {
  color: #ffd106 !important;
}
.c_rd {
  color: #ef3f41 !important;
}
.c_pk {
  color: #e30e87 !important;
}
.c_pp {
  color: #37018d !important;
}
.c_sky {
  color: #04a6e1 !important;
}
.c_lsky {
  color: #51e4ff !important;
}
.c_bw {
  color: #967440 !important;
}
.c_navy {
  color: #282468 !important;
}
.c_dbl {
  color: #251ab8 !important;
}
.c_bl {
  color: #2a60e9 !important;
}
.c_dgray {
  color: #444 !important;
}
.c_gray {
  color: #666 !important;
}
.c_lgray {
  color: #858585 !important;
}
.c_blgray {
  color: #a6b2c9 !important;
}
.c_sig {
  color: #b1b1b1 !important;
}
.c_dft {
  color: #0d174e !important;
}
.c_pt {
  color: #004eec !important;
}

/* gradient */
.gr_gd {
  display: inline-block;
  background: linear-gradient(97deg, #ffefbb, #eebc65);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.gr_gd2 {
  display: inline-block;
  background: linear-gradient(97deg, #fff8e3, #eebc65);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}