@import url(https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Noto+Sans+JP:wght@400;700&family=Sawarabi+Gothic&family=Barlow+Semi+Condensed:wght@400;600;800&display=swap);
@import url(https://cdn.jsdelivr.net/npm/@mdi/font@5.x/css/materialdesignicons.min.css);
.v-application {
  font-family: unset;
}

body .v-application .number-display-style {
  font-family: "Barlow Semi Condensed" !important;
}

body .v-application b,
body .v-application b strong {
  font-weight: bold;
}

#nprogress {
  pointer-events: none;
  --logo-anim-speed: 1;
  --logo-anim-duration: 1.5s;
  --logo-anim-letter-count: 12;
}

#nprogress .bar.custom {
  background: #00b286;
  overflow: hidden;
  position: unset;
  z-index: 1031;
  top: 0;
  left: 0;
  width: 100%;
  height: 10px;
}

#nprogress .bar.custom .peg {
  display: none;
  background: #00b286;
  position: unset;
  right: 0px;
  width: 100px;
  height: 100%;
  opacity: 1;
  box-shadow: none;
  transform: rotate(0deg) translate(0px, 0px);
}

.loading-screen-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  display: flex;
  background-color: #00000044;
}

.loading-screen-wrapper .loading-screen {
  background-color: #FFFFFFAA;
  margin: auto;
  padding: 24px;
  border-radius: 24px;
}

.loading-screen-wrapper .loading-screen-logo-wrapper {
  max-width: 150px;
  margin: auto;
}

.loading-screen-wrapper .loading-screen-bar-wrapper {
  overflow: hidden;
  border-radius: 24px;
  background: #81cfbb;
}

.loading-screen-wrapper svg {
  margin: auto;
  --logo-anim-speed: 0.8;
  --logo-anim-duration: 2s;
  --logo-anim-letter-count: 12;
}

.loading-screen-wrapper svg #ikuseo_logo_i {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 0 ) infinite forwards;
}

.loading-screen-wrapper svg #ikuseo_logo_k {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 1 ) infinite forwards;
}

.loading-screen-wrapper svg #ikuseo_logo_u {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 2 ) infinite forwards;
}

.loading-screen-wrapper svg #ikuseo_logo_s {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 3 ) infinite forwards;
}

.loading-screen-wrapper svg #ikuseo_logo_e {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 4 ) infinite forwards;
}

.loading-screen-wrapper svg #ikuseo_logo_o {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 5 ) infinite forwards;
}

.loading-screen-wrapper svg #jp_i {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 6 ) infinite forwards;
}

.loading-screen-wrapper svg #jp_ku {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 7 ) infinite forwards;
}

.loading-screen-wrapper svg #jp_se {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 8 ) infinite forwards;
}

.loading-screen-wrapper svg #jp_o {
  animation: load-letter-animation calc( var(--logo-anim-duration) / var(--logo-anim-speed) ) ease-in-out calc( ( var(--logo-anim-duration) / var(--logo-anim-speed) ) / var(--logo-anim-letter-count) * 9 ) infinite forwards;
}
@keyframes load-letter-animation {
  0% {
    transform: translateY(0%) scale(1);
  }
  15% {
    transform: translateY(2%) scale(0.92);
  }
  30% {
    transform: translateY(0%) scale(1);
  }
  100% {
    transform: translateY(0%) scale(1);
  }
}
