@keyframes title-slide-up-desktop {
  0% {
    margin-top: 56px;
  }
  5% {
    margin-top: 0;
  }
  33% {
    margin-top: 0;
  }
  38% {
    margin-top: -57px;
  }
  66% {
    margin-top: -57px;
  }
  71% {
    margin-top: -117px;
  }
  97% {
    margin-top: -117px;
  }
  99.999% {
    margin-top: -160px;
  }
  100% {
    margin-top: 21px;
  }
}
@keyframes title-slide-up-mobile {
  0% {
    margin-top: 20px;
  }
  5% {
    margin-top: 0;
  }
  33% {
    margin-top: 0;
  }
  38% {
    margin-top: -71px;
  }
  66% {
    margin-top: -71px;
  }
  71% {
    margin-top: -143px;
  }
  97% {
    margin-top: -143px;
  }
  99.999% {
    margin-top: -188px;
  }
  100% {
    margin-top: 20px;
  }
}
.sub-title.fade-in-out span {
  display: none;
}

@media screen and (min-width: 1261px) {
  .title-slide-up {
    height: 50px;
    overflow: hidden;
  }
  .title-slide-up > span {
    display: block;
  }
  .title-slide-up > span > span {
    height: 40px;
    margin-bottom: 20px;
    display: inline-block;
  }
  .title-slide-up span:first-child {
    animation: title-slide-up-desktop 7s ease-in-out infinite;
  }
}
@media screen and (max-width: 1260px) and (min-width: 768px) {
  .title-slide-up {
    height: 50px;
    overflow: hidden;
  }
  .title-slide-up > span {
    display: block;
  }
  .title-slide-up > span > span {
    height: 40px;
    margin-bottom: 20px;
    display: inline-block;
  }
  .title-slide-up span:first-child {
    animation: title-slide-up-desktop 5s linear infinite;
  }
}
@media screen and (max-width: 767px) {
  .title-slide-up {
    height: 30px;
    overflow: hidden;
  }
  .title-slide-up > span {
    display: block;
  }
  .title-slide-up > span > span {
    height: 48px;
    margin-bottom: 24px;
    display: inline-block;
  }
  .title-slide-up span:first-child {
    animation: title-slide-up-mobile 5s linear infinite;
  }
}