@-webkit-keyframes activity-toast-show {
  0% {-webkit-transform: scale(.5) translate(-50%, -50%);transform: scale(.5) translate(-50%, -50%);}
  75% {-webkit-transform: scale(1.08) translate(-50%, -50%);transform: scale(1.08) translate(-50%, -50%);}
  100% {-webkit-transform: scale(1) translate(-50%, -50%);transform: scale(1) translate(-50%, -50%);}
}
@keyframes activity-toast-show {
  0% {-webkit-transform: scale(.5) translate(-50%, -50%);transform: scale(.5) translate(-50%, -50%);}
  75% {-webkit-transform: scale(1.08) translate(-50%, -50%);transform: scale(1.08) translate(-50%, -50%);}
  100% {-webkit-transform: scale(1) translate(-50%, -50%);transform: scale(1) translate(-50%, -50%);}
}
@-webkit-keyframes activity-toast-hide {
  0% {-webkit-transform: scale(1) translate(-50%, -50%);transform: scale(1) translate(-50%, -50%);}
  25% {-webkit-transform: scale(1.08) translate(-50%, -50%);transform: scale(1.08) translate(-50%, -50%);}
  100% {-webkit-transform: scale(.5) translate(-50%, -50%);transform: scale(.5) translate(-50%, -50%);}
}
@keyframes activity-toast-hide {
  0% {-webkit-transform: scale(1) translate(-50%, -50%);transform: scale(1) translate(-50%, -50%);}
  25% {-webkit-transform: scale(1.08) translate(-50%, -50%);transform: scale(1.08) translate(-50%, -50%);}
  100% {-webkit-transform: scale(.5) translate(-50%, -50%);transform: scale(.5) translate(-50%, -50%);}
}

.activity-toast{
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  padding: 8px;
  border-radius: 5px;
  font-size: 14px;
  color: #fff;
  display: inline-block;
  z-index: 19999;
}
.activity-toast-transition-enter{
  opacity: 0;
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
}
.activity-toast-transition-enter-active{
  opacity: 1;
  -webkit-transition: .3s opacity cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: .3s opacity cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-animation: activity-toast-show .3s cubic-bezier(0.165, 0.84, 0.44, 1);
          animation: activity-toast-show .3s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.activity-toast-transition-exit{
  opacity: 1;
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
}
.activity-toast-transition-exit-active{
  opacity: 0;
  -webkit-transition: .3s opacity cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: .3s opacity cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-animation: activity-toast-hide .3s cubic-bezier(0.165, 0.84, 0.44, 1);
          animation: activity-toast-hide .3s cubic-bezier(0.165, 0.84, 0.44, 1);
}
@-webkit-keyframes activity-toast-show {
  0% {
    -webkit-transform: scale(0.5) translate(-50%, -50%);
    transform: scale(0.5) translate(-50%, -50%);
  }

  75% {
    -webkit-transform: scale(1.08) translate(-50%, -50%);
    transform: scale(1.08) translate(-50%, -50%);
  }

  100% {
    -webkit-transform: scale(1) translate(-50%, -50%);
    transform: scale(1) translate(-50%, -50%);
  }
}

@keyframes activity-toast-show {
  0% {
    -webkit-transform: scale(0.5) translate(-50%, -50%);
    transform: scale(0.5) translate(-50%, -50%);
  }

  75% {
    -webkit-transform: scale(1.08) translate(-50%, -50%);
    transform: scale(1.08) translate(-50%, -50%);
  }

  100% {
    -webkit-transform: scale(1) translate(-50%, -50%);
    transform: scale(1) translate(-50%, -50%);
  }
}

@-webkit-keyframes activity-toast-hide {
  0% {
    -webkit-transform: scale(1) translate(-50%, -50%);
    transform: scale(1) translate(-50%, -50%);
  }

  25% {
    -webkit-transform: scale(1.08) translate(-50%, -50%);
    transform: scale(1.08) translate(-50%, -50%);
  }

  100% {
    -webkit-transform: scale(0.5) translate(-50%, -50%);
    transform: scale(0.5) translate(-50%, -50%);
  }
}

@keyframes activity-toast-hide {
  0% {
    -webkit-transform: scale(1) translate(-50%, -50%);
    transform: scale(1) translate(-50%, -50%);
  }

  25% {
    -webkit-transform: scale(1.08) translate(-50%, -50%);
    transform: scale(1.08) translate(-50%, -50%);
  }

  100% {
    -webkit-transform: scale(0.5) translate(-50%, -50%);
    transform: scale(0.5) translate(-50%, -50%);
  }
}

.activity-toast {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  padding: 0.08rem;
  border-radius: 0.05rem;
  font-size: 0.14rem;
  color: #fff;
  display: inline-block;
  z-index: 9999;
}

.activity-toast-transition-enter {
  opacity: 0;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
}

.activity-toast-transition-enter-active {
  opacity: 1;
  -webkit-transition: 0.3s opacity cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: 0.3s opacity cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-animation: activity-toast-show 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  animation: activity-toast-show 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.activity-toast-transition-exit {
  opacity: 1;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
}

.activity-toast-transition-exit-active {
  opacity: 0;
  -webkit-transition: 0.3s opacity cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: 0.3s opacity cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-animation: activity-toast-hide 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  animation: activity-toast-hide 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.activity-view {
  margin: 0 auto;
  position: relative;
}

.activity-view-pv {
  position: absolute;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 0;
  text-align: center;
}

.activity-view-btn {
  position: absolute;
  display: block;
  cursor: pointer;
}

.activity-view-btn>img {
  width: 100%;
  height: 100%;
}

.activity-view {
  margin: 0 auto;
  position: relative;
}

.activity-view-pv {
  position: absolute;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 0;
  text-align: center;
}

.activity-view-btn {
  position: absolute;
  display: block;
  cursor: pointer;
}

.activity-view-btn>img {
  width: 100%;
  height: 100%;
}