@charset "utf-8";

/* 그누보드 default.css 전역 규칙과 /web 리뉴얼 충돌 보정 */

body.page-main,
body.page-sub,
#wrap,
#wrap h1,
#wrap h2,
#wrap h3,
#wrap h4,
#wrap h5,
#wrap h6 {
  font-family: var(--font-base, "SUIT Variable", "Pretendard", "Noto Sans KR", sans-serif) !important;
}

body.page-main {
  font-size: 16px;
  color: var(--color-text, #05121c);
}

body.page-main #wrapper,
body.page-main #container_wr,
body.page-main #container {
  display: contents;
}

body.page-main #container_title,
body.page-main #quick_menu,
body.page-sub #quick_menu,
#ft {
  display: none !important;
}

/* 링크: default.css a { color:#000 } */
#wrap .header a,
#wrap .m-nav a,
#wrap .aside a,
#wrap .footer a {
  color: inherit;
}

#wrap .header__cs,
#wrap .header__login,
#wrap .m-nav__btn--cs,
#wrap .m-nav__btn--login,
#wrap .more-btn-w,
#wrap .ft-link,
#wrap .sm-item-telegram .side-menu-link {
  color: var(--color-white, #FEFEFE);
}

#wrap .aside .side-menu-top {
  color: var(--color-white, #FEFEFE);
  background-color: var(--color-primary, #1A3365);
}

#wrap .sm-item-kakao .side-menu-link {
  color: var(--color-text, #05121c);
}

/* 히어로: default.css h1 { color:#1A3365; text-align:center } */
.page-main .banner-text,
.page-main .banner-title,
.page-main .banner-title h1,
.page-main .banner-title h3,
.page-main .banner-title h4,
.page-main .banner-desc {
  color: var(--color-white, #FEFEFE);
  text-align: inherit;
}

.page-main .banner-title h1 {
  font-family: var(--font-base, "SUIT Variable", "Pretendard", "Noto Sans KR", sans-serif) !important;
  font-size: 8rem;
  font-weight: 800;
  text-transform: uppercase;
}

.page-main .section-title h2,
#wrap footer.footer h6 {
  color: inherit;
  text-align: inherit;
  text-transform: none;
}

/* 이미지: default.css img { width:100% } + ID 선택자 덮어쓰기 */
#wrap img {
  max-width: 100%;
}

#wrap .logo a img,
#wrap .m-nav__logo img {
  width: auto;
  height: 3.75rem;
}

#wrap .m-nav__logo img {
  height: 2.5rem;
}

#wrap .banner-item > img,
#wrap .ms-list-img,
#wrap .m-nav__content-img img {
  width: 100%;
  height: 100%;
}

#wrap .aside .sm-icon {
  width: 35%;
  height: auto;
}

#wrap .ms-grid-icon {
  width: 70px;
}

#wrap .main-cs-icon {
  width: 20%;
}

/* 버튼: default.css button { width:200px; height:60px; border-radius:30px } */
#wrap .header button,
#wrap .m-nav button,
#wrap .ham-menu,
#wrap .m-nav__close,
#wrap .banner-nav .swiper-button-prev,
#wrap .banner-nav .swiper-button-next {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  width: auto;
  height: auto;
  appearance: none;
  box-shadow: none !important;
  border-radius: 0 !important;
  transform: none;
  font-size: inherit;
  font-weight: inherit;
}

#wrap .ham-menu {
  width: 30px;
  height: 2.8rem;
}

footer.footer {
  height: auto;
  color: var(--color-white-muted, #f5f5f5);
  font-size: inherit;
  font-weight: inherit;
}

footer.footer .inner {
  width: 80%;
  max-width: var(--inner-max, 1400px);
  margin: 0 auto;
  display: block;
  padding-top: 0;
  justify-content: unset;
}

.page-sub .header {
  background-color: var(--color-white, #FEFEFE);
  color: var(--color-text, #05121c);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

.page-sub .header .logo a img,
.page-sub .header.on .logo a img {
  filter: brightness(0) invert(0);
}

.page-sub .header .ham-menu span,
.page-sub .header.on .ham-menu span {
  background: var(--color-text, #05121c);
}

.page-sub #wrapper {
  padding-top: var(--header-h, 6.25rem);
  min-height: 60vh;
}

@media (max-width: 1280px) {
  .page-main .banner-title h1 {
    font-size: clamp(4rem, 9vw, 7rem);
  }

  #wrap .ms-grid-icon {
    width: 50px;
  }
}

@media (max-width: 768px) {
  #wrap .logo a img {
    height: 3rem;
  }

  #wrap .ham-menu {
    width: 24px;
    height: 24px;
  }

  #wrap .aside .sm-icon {
    width: 25px;
    max-height: 20px;
  }
}

@media (max-width: 500px) {
  .page-main .banner-title h1 {
    font-size: clamp(4rem, 9vw, 7rem);
  }

  footer.footer .inner {
    width: 90%;
  }

  #wrap .main-cs-icon {
    width: 30px;
    height: 30px;
  }
}