.scroll-animate .mainTitle,
.scroll-animate .sub-title,
.scroll-animate ul,
.scroll-animate p,
.scroll-animate img,
.scroll-animate .port-title-cont,
.scroll-animate .port-btn-cont,
.scroll-animate a,
.scroll-animate .container .readmore{
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.5s ease;
}
.indexResult.scroll-animate a{
  transform: translate(-50%, 30px);
}

.scroll-animate.animate-in .mainTitle,
.scroll-animate.animate-in .sub-title,
.scroll-animate.animate-in ul,
.scroll-animate.animate-in p,
.scroll-animate.animate-in img,
.scroll-animate.animate-in .port-title-cont,
.scroll-animate.animate-in .port-btn-cont,
.scroll-animate.animate-in a,
.scroll-animate.animate-in .container .readmore {
  opacity: 1;
  transform: translateY(0);
}
.indexResult.scroll-animate a{
  transform: translate(-50%, 0);
}
.scroll-animate.animate-out .mainTitle,
.scroll-animate.animate-out .sub-title,
.scroll-animate.animate-out ul,
.scroll-animate.animate-out p,
.scroll-animate.animate-out img,
.scroll-animate.animate-out .port-title-cont,
.scroll-animate.animate-out .port-btn-cont,
.scroll-animate.animate-out a,
.scroll-animate.animate-out .container .readmore {
  opacity: 0;
  transform: translateY(50px) scale(0.95);
  filter: blur(4px);
  transition: all 0.3s ease-in;
}
.indexResult.scroll-animate a{
  transform: translate(-50%, 30px);
}

.scroll-animate.animate-in .mainTitle {
  transition-delay: 0.1s;
}
.scroll-animate.animate-in .sub-title {
  transition-delay: 0.2s;
}
.scroll-animate.animate-in ul{
  transition-delay: 0.3s;
}
.scroll-animate.animate-in p {
  transition-delay: 0.3s;
}
.scroll-animate.animate-in img {
  transition-delay: 0.5s;
}
.scroll-animate.animate-in a{
  transition-delay: 0.7s;
}
.scroll-animate.animate-in .container .readmore{
  transition-delay: 0.7s;
}