@font-face {
  font-family: vitroCore;
  src: url("../fonts/VITRO CORE OTF.otf")format("opentype");
  font-display: swap
}

@font-face {
  font-family: vitroCore Fallback;
  src: local(Arial);
  ascent-override: 80.18%;
  descent-override: 29.0%;
  line-gap-override: 0.0%;
  size-adjust: 121.72%
}

.font-vitrocore--class-name {
  font-family: vitroCore, vitroCore Fallback
}

.font-vitrocore {
  --font-vitro-core: "vitroCore", "vitroCore Fallback"
}

:root {
  --primary: #85000d;
  --primary-dark: #85000d;
  --secondary: #114436;
  --background: #fff;
  --foreground: #111;
  --gray-100: #f5f5f5;
  --gray-200: #eee;
  --gray-800: #333;
  --header-height: 76px;
  --transition: all .3s cubic-bezier(.4, 0, .2, 1)
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0
}

.only-pc {
  display: block;
}

.only-mobile {
  display: none;
}

@media (max-width: 768px) {
  .only-pc {
    display: none;
  }

  .only-mobile {
    display: block;
  }
}

html,
body {
  max-width: 100vw;
  color: var(--foreground);
  background: var(--background);
  scroll-behavior: smooth;
  font-family: Pretendard Variable, Pretendard, sans-serif;
  overflow-x: hidden
}

section[id],
#contact,
.customer-proof__platform-block[id] {
  scroll-margin-top: calc(var(--header-height) + 20px)
}

a {
  color: inherit;
  text-decoration: none
}

ul {
  list-style: none
}

button {
  cursor: pointer;
  background: 0 0;
  border: none;
  font-family: inherit
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px
}

.btn-primary {
  background: var(--primary);
  color: #fff;
  transition: var(--transition);
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  padding: 12px 24px;
  font-size: 1rem;
  font-weight: 600;
  display: inline-flex;
  box-shadow: 0 4px 15px #9b081e4d
}

.btn-primary:hover {
  background: var(--secondary);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px #064e3b66
}

.hero-title {
  font-family: var(--font-vitro-core), sans-serif;
  line-height: 1.2
}

.main-section-pc {
  display: flex !important;
}

.main-section-mobile {
  display: none !important;
}

@media (max-width: 768px) {
  .main-section-pc {
    display: none !important;
  }

  .main-section-mobile {
    display: flex !important;
  }
}