﻿.fadein {
  -webkit-transform: translate(0, 50px);
  transform: translate(0, 50px);
  opacity: 0;
  transition: transform 1.4s, opacity 1.4s;
}
.animation.fadein {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}
.fade_view {
  opacity: 0;
  transition: opacity 1.0s;
}
.animation.fade_view {
  opacity: 1;
}

.loop_wrap {
    display: flex;
    width: 100vw;
    padding-top: 10px;
    padding-bottom: 10px;
	position: absolute;
	bottom: 0;
}
.loop__item {
    flex: 0 0 auto;
    font-size: 7.0rem;
	line-height: 1;
    white-space: nowrap;
    padding-right: 25px;
    padding-left: 25px;
    color: #fff;
}

.loop__item:nth-child(odd) {
    animation: loop 50s -25s linear infinite;
}
.loop__item:nth-child(even) {
    animation: loop2 50s linear infinite;
}

@keyframes loop {
    0% {
        transform: translateX(100%);
    }
    to {
        transform: translateX(-100%);
    }
}

@keyframes loop2 {
    0% {
        transform: translateX(0);
    }
    to {
        transform: translateX(-200%);
    }
}
@keyframes scroll-hint-appear {
    0% {
        transform: translateX(40px);
        opacity: 0
    }

    10% {
        opacity: 1
    }

    50%,to {
        transform: translateX(-40px);
        opacity: 0
    }
}