.type-pers-parent {
  perspective: 150px;
  -webkit-perspective: 150px;
/*  height: 559px; */
  background-color: #2196F3;
  overflow: hidden;
}
.type-pers-child {
  text-align: justify;
  padding: 0%;
  animation: typetext ease-in 19s infinite;
  -webkit-animation: typetext ease-in 10s infinite;
  animation-play-state: running;
  color: #f90202;
  font-size: 28px;
  letter-spacing: 7px;
}
@-webkit-keyframes typetext {
/*   0% {	
   		transform: rotateX(4deg) translate(0,0);
   		-ms-transform: rotateX(4deg) translate(0,0);
   }
*/
  100% {
  		transform: rotateX(45deg) translate(0,-500px);
  		-ms-transform: rotateX(45deg) translate(0,-500px);
  }
}
@keyframes typetext {
/*   0% {	
   		transform: rotateX(4deg) translate(0,0);
   		-ms-transform: rotateX(4deg) translate(0,0);
   }
*/
  100% {
  		transform: rotateX(6deg) translate(0,-1600px);
  		-ms-transform: rotateX(6deg) translate(0,-1600px);
  }
}
p.sawara {
  font-family: "Sawarabi Gothic";
  letter-spacing: -6.5px;
  font-weight: bold;
}

/* jpeg Slider */
.slider{
    width:100%;
/*    height:400px;*/
    margin:0 auto;
    position:relative;
}
.slider ul{
    margin:0;
    padding:0;
    list-style:none;
}
.slider ul li{
    width:100%;
/*    height:400px;*/
    position:absolute;
    top:0;
    left:0;
    animation-iteration-count:1;
    animation-duration:5s;
}
.slider ul li:nth-child(1){
    animation-name:slider;
    animation-delay:-1s;
}
.slider ul li:nth-child(2){
    animation-name:slider;
    animation-delay:1s;
    opacity:0;
}
.slider ul li:nth-child(3){
    animation-name:slider;
    animation-delay:3s;
    opacity:0;
}
.slider ul li:nth-child(4){
    animation-name:slider;
    animation-delay:5s;
    opacity:0;
}
 
@keyframes slider{
    0%{
        opacity:0;
    }
    20.83%{
        opacity:1;
    }
    33.33%{
        opacity:1;
    }
    45.83%{
        opacity:0;
    }
    100%{
        opacity:0;
    }   
}