@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)}
body{margin:0}
#move{background:url(../gf3/tyt16.png)}
.anim{animation-name:zoom;animation-duration:.5s;width:960px;height:610px;position:absolute;z-index:5}
@keyframes zoom{
0% {transform:scale(0)}
100% {transform:scale(1)}}
#pic p{width:960px;height:750px;position:absolute;left:20px;top:85px;background:url(../gf3/puz2.png);z-index:5;cursor:pointer;border-radius:10px;box-shadow:inset 0 0 1em black}
#collage{position:absolute;top:85px;left:20px;width:960px;height:750px;background:#fa8;border-radius:15px;box-shadow:inset 0 0 1em red}
#collage #actualImageBox{display:inline-block;font-size:.8em;margin:10px 10px;margin-top:-299px;margin-left:500px;vertical-align:top;width:278px}
#puz{position:absolute;top:104px;left:599px;background:url(../gf3/puz1.png);width:280px;height:100px;border-radius:15px}
#collage #stepBox, #collage #timeBox{display:inline-block;width:48%}
#collage #stepBox div{display:inline-block;padding:1px 4px;margin:0px auto;max-width:800px}
#collage img#actualImage{height:278px;width:277px;border:solid 1px;border-radius:12px}
#collage #sortable{list-style-type:none;display:inline-block;margin:-20px;padding:0;width:459px;height:459px;border:ridge 18px #F0F}
#collage #sortable li{cursor:pointer;margin:0;padding:0;float:left}
#wyn{width:280px;height:271px;background-color:#fff;position:absolute;left:600px;top:297px;padding-top:30px;line-height:160%;text-align:center;border-radius:9px}
#collage button{background-color:#ff0;margin-left:60px;border:1px solid;border-radius:12px;display:inline;font-size:22px;width:auto}
#h2{font-size:32px;font-weight:900;color:#080;position:absolute;margin-top:99px;margin-left:17px}
#txt{font-size:22px;color:#000;position:absolute;margin-top:140px;margin-left:45px}
#play{position:absolute;top:240px;left:-67px;width:350px;text-align:center}
#smi{position:absolute;top:-85px;left:39px;width:200px;height:200px;background:url(../gf3/msp.gif)}
#lock{position:absolute;left:98px;top:122px;width:459px;height:459px;background:rgba(0,75,0,.3)}
s{position:absolute;top:74px;left:599px;background:url(../gf3/puz.png);width:279px;height:165px;animation:rotate 2s;animation-delay:.5s}
@keyframes rotate{
0%{transform:rotateY(0)}
100%{transform:rotateY(360deg)}
}