@charset "utf-8"; html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, big, del, em, font, img, ins, q, s, small, strong, sub, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, table, tr, th, td {margin:0;padding:0;vertical-align:baseline}:focus{outline:0} ol, ul, li {list-style-type:none} html{font-size:100%} body{font-family:Arial,Helvetica,sans-serif;font-size:1.1em;line-height:1.6em} img{float:left} a{color:#e00;text-decoration:none;outline:none} a:hover{text-decoration:none}
body{width:1000px;height:940px;background:url(../gf0/9.png);-ms-touch-action:none;touch-action:none}
#hrl{position:absolute;top:212px;left:20px;width:960px}
#ban{position:absolute;width:1000px;height:217px}
#area{width:425px;height:45px;background:#dd0;position:absolute;top:18px;left:285px;box-shadow:6px 6px 6px 0 rgba(100,100,100,.8) inset,-6px -6px 6px 0 rgba(255,255,255,.8) inset;border:1px solid #cc0;border-radius:20px;overflow:hidden}
#move{position:absolute;left:430px;width:270px;height:45px;animation:move 5s linear infinite}
@keyframes move{95%, 100%{transform:translate(-700px)}}
#pre{position:absolute;top:850px;width:1000px;height:90px;background:url(../gf0/pre.png)}
#arrow{position:absolute;width:86px;height:90px;left:914px;background:url(../gf0/back.png)}
@font-face {font-family: "Luckiest Guy";src:url("../fonts/Luckiest Guy.ttf") format("truetype")}
#ban {background:url(../gf9/ban16.png)}
#s {position:absolute;top:300px;left:153px;width:690px;height:467px;background:url(../gf9/tap.jpg);z-index:1}
#crt {position:absolute;top:250px;left:99px;width:800px;height:570px;background:url(../gf9/cert.jpg)}
.animate {position:absolute;top:99px;left:260px;font-size:98px;font-weight:900;font-family:Luckiest Guy;-webkit-text-stroke:2px red;text-shadow:0 0 25px #00A;z-index:1}
.animate span {display:inline-block}
.animate span:nth-of-type(1) {animation-delay:.5s}
.animate span:nth-of-type(2) {animation-delay:.6s}
.animate span:nth-of-type(3) {animation-delay:.7s}
.animate span:nth-of-type(4) {animation-delay:.8s}
.animate span:nth-of-type(5) {animation-delay:.9s}
.animate span:nth-of-type(6) {animation-delay:1.0s}
.animate span:nth-of-type(7) {animation-delay:1.1s}
.animate span:nth-of-type(8) {animation-delay:1.2s}
.animate span:nth-of-type(9) {animation-delay:1.3s}
.animate span:nth-of-type(10){animation-delay:1.4s}
.crt span {color:#0F0;opacity:0;transform:translate(-150px, 0) scale(.4);animation:leftRight .5s forwards}
@keyframes leftRight {
40% {transform:translate(50px, 0) scale(.8);opacity:1;color:#F00}
60% {color:#F0F}
80% {transform:translate(0) scale(2);opacity:1;color:#00F}
100% {transform:translate(0) scale(1);opacity:1;color:#0F0}}