:root {
  --app-main: #000;
  --app-link: #005bac;
  --slider-active: #d39452;
  --content-link: #00a2ff;
  --lsm-active: #00508e;
  --csm-active: #a46d44;
  --pixel-border-dpr: 1;
  --lang-shadow: 0 12px 32px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.08);
  --partner-shadow: 0px 18px 20px -1px rgba(0, 0, 0, 0.08);
  --milestone-shadow: 2px 5px 10px 10px rgba(0, 0, 0, 0.07);
  --milestone-shadow-sm: 2px 10px 20px 10px rgba(0, 0, 0, 0.07);
  --bg-news: #f9f7f4;
  --bg-csm: #e2d7bf;
  --bg-lsm: #d6e6f3;
  --bg-radial-grey: radial-gradient(
    50% 50% at 50% 50%,
    #fff 62.5%,
    #f0f0f0 100%
  );
  --border-dpr: calc(1px / var(--pixel-border-dpr));
  --constant-top: constant(safe-area-inset-top);
  --env-top: env(safe-area-inset-top);
  --constant-right: constant(safe-area-inset-right);
  --env-right: env(safe-area-inset-right);
  --constant-bottom: constant(safe-area-inset-bottom);
  --env-bottom: env(safe-area-inset-bottom);
  --constant-left: constant(safe-area-inset-left);
  --env-left: env(safe-area-inset-left);
}

html,
body {
  height: -webkit-fill-available;
}

html {
  background-color: #fff;
}

.wrap {
  height: -webkit-fill-available;
}

body {
  font-family:
    -apple-system,
    'Microsoft Yahei',
    Roboto,
    Ubuntu,
    Cantarell,
    Noto Sans,
    sans-serif;
  color: var(--app-main);
  background-color: #fff;
  -webkit-text-decoration-skip: objects;
  text-decoration-skip: objects;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}

button,
input,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: initial;
  border: none;
  outline: none;
  border: 0 none;
  background-color: transparent;
}

input {
  -webkit-border-radius: 0px;
  border-radius: 0;
}

input[type='search'] {
  -webkit-appearance: none;
  appearance: none;
}

input::-webkit-search-cancel-button {
  display: none;
}

input::-webkit-contacts-auto-fill-button {
  visibility: hidden;
  display: none !important;
  pointer-events: none;
  position: absolute;
  right: 0;
}

input::-webkit-textfield-decoration-container {
  visibility: hidden;
}

textarea:focus,
input:focus,
select:focus {
  outline: none;
}

[v-cloak] {
  display: none;
}

.svg-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  fill: currentColor;
  vertical-align: -0.1em;
  font-size: 16px;
}

.h5bp {
  display: inline-block;
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
  overflow: hidden;
}

.radial-grey {
  background: var(--bg-radial-grey);
}

.banner .swiper-slide .banner-text {
  opacity: 0;
  transform: translate(-5%, 0);
  transition: all 1.2s ease-in-out;
}

.banner .swiper-slide .banner-text:last-child {
  transition: all 1.5s ease-in-out;
}

.banner .swiper-slide-active .banner-text {
  opacity: 80;
  transform: translate(0, 0);
}

@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}

.toast {
  top: 2rem !important;
  z-index: 9999 !important;
}

.slider .swiper-pagination-current {
  color: var(--slider-active);
}

.slider .swiper-pagination-bullet {
  width: 16px !important;
  height: 16px !important;
}

.slider .swiper-pagination {
  text-align: right !important;
}

.slider .swiper-pagination-bullet {
  border: 1px solid black;
}

.slider .swiper-pagination-bullet-active {
  border-color: var(--swiper-theme-color);
}

.toast .Notivue__notification {
  padding-left: 8px;
  padding-right: 5px;
  border: 1px solid #dcdcdc;
  box-shadow: var(--toast-shadow);
}

.toast .Notivue__content-message {
  overflow: visible !important;
}

.vue3-marquee.horizontal > .marquee {
  align-items: start !important;
}

.commendations.horizontal > .marquee {
  column-gap: 8px;
  margin-right: 8px;
}

.partners.horizontal > .marquee {
  column-gap: 24px;
  margin-right: 24px;
}

@media (max-width: 750px) {
  .toast .Notivue__notification {
    --nv-icon-size: 1rem !important;
    --nv-message-size: 0.875rem !important;
    --nv-spacing: 0.5rem !important;
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
  :root {
    --pixel-border-dpr: 2;
  }
}
@media screen and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 3dppx) {
  :root {
    --pixel-border-dpr: 1.25;
  }
}
@media screen and (-webkit-min-device-pixel-ratio: 4), (min-resolution: 4dppx) {
  :root {
    --pixel-border-dpr: 2.25;
  }
}
