* {
  /* font-family: '\5B8B\4F53'; */
}

:root {
  --main-color: #B61E22;
  --font-color: #fff;

  --toolbox-top: 0;
  --toolbox-left: 0;
  --toolbox-width: 240px;
  --toolbox-padding: 0 10px;

  --colors-primary-base: var(--main-color);
  --colors-primary-click: #005046;

  --font-active: #EECC63;

}

* {
  -webkit-backface-visibility: hidden;
  /* -webkit-transform-style: preserve-3d; */
}


.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s ease;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

.right-enter-from,
.right-leave-to {
  transform: translate3d(100%, 0, 0);
}

.right-leave-from,
.right-enter-to {
  transform: translate3d(0, 0, 0);
}

.right-enter-active,
.right-leave-active {
  transition: all 0.3s;
}


.slide-enter-from,
.slide-leave-to {
  max-height: 0;
}

.slide-leave-from,
.slide-enter-to {
  max-height: 300px;
}

.slide-enter-active,
.slide-leave-active {
  overflow: hidden;
}