body {position:relative;font-family: "Sawarabi Mincho";}

.mainwrap {position:fixed;left:0px;top:0px;height:100vh;width:100vw;z-index:-1;}
.titlestr {position:fixed;left:0px;width:100%;top:50vh;height:50px;margin-top:-50px;text-align:center;}
.titlestr {font-size:50px;font-weight:bold;letter-spacing:0.1em;}
.titlestr span {display:inline-block;opacity:0;}
.titlestr.on span {opacity:1; transition:3s;}
.titlestr span:nth-child(1){ transform:translate(0, -300px);transition:5s;}
.titlestr span:nth-child(2){ transform:translate(0, -300px);transition:2s;}
.titlestr span:nth-child(3){ transform:translate(0, -300px);transition:4s;}
.titlestr span:nth-child(4){ transform:translate(0, -300px);transition:3.5s;}
.titlestr span:nth-child(5){ transform:translate(0, -300px);transition:6s;}
.titlestr span:nth-child(6){ transform:translate(0, -300px);transition:2s;}
.titlestr span:nth-child(7){ transform:translate(0, -300px);transition:4.5s;}


.titlestr.on span:nth-child(1){ transform:translate(0, 0px);}
.titlestr.on span:nth-child(2){ transform:translate(0, 0px);}
.titlestr.on span:nth-child(3){ transform:translate(0, 0px);}
.titlestr.on span:nth-child(4){ transform:translate(0, 0px);}
.titlestr.on span:nth-child(5){ transform:translate(0, 0px);}
.titlestr.on span:nth-child(6){ transform:translate(0, 0px);}
.titlestr.on span:nth-child(7){ transform:translate(0, 0px);}

.footer {position:fixed;bottom:0px;left:0px;width:98%;height:30px;text-align:right;z-index:10;}
.footer a {font-size:0.7rem;color:#999;padding:0.5em;text-decoration:none;}