@charset "utf-8";
html, body, p, ul, li {margin:0;padding:0}
body {margin:0 auto;width:1000px;min-height:100vh;overflow-x:hidden;overflow-y:auto;background:url(../gf0/0.jpg) fixed;line-height:1.7em}
li {list-style-type:none}
#nav {z-index:2;margin-left:12px}
#nav.f_layer {position:fixed;top:0;display:flex;padding:5px;pointer-events:auto}
#nav li a {display:block;width:107px;height:29px;position:relative;top:0px;left:0px;color:#000;font-size:21px;font-weight:900;border:solid 1px;background:rgba(0,200,0,1);outline:none;display:inline-block;text-decoration:none;text-align:center;box-shadow:inset 0 0 12px #000;border-radius:3em}
@keyframes animation {
0% {transform:scale(1)}
30% {transform:scale(1.4)}
100% {transform:scale(1)}
}
#nav li > a:hover {font-size:18px;background:#FF0;box-shadow:inset 0 0 20px #333;animation-name:animation;animation-duration:.3s;border-radius:3em;z-index:4}
#nav .slide1 {position:absolute;top:5px;height:29px;width:108px;background:rgba(240,0,0,1);border-radius:3em;box-shadow:inset 0 0 20px #000;transition:.2s;z-index:5}
#dat {position:relative;left:5px;width:1000px;height:160px;background:url(../gf0/8.png);z-index:2;pointer-events:none}
#rol > p {display:block;position:absolute;top:42px;width:100px;height:100px;animation:rotator 7s linear infinite;pointer-events:none;z-index:3}
#rol > p:nth-child(1) {animation-delay:3s;left:0px;background:url(../gf0/1.png)}
#rol > p:nth-child(2) {animation-delay:3.3s;left:61px;background:url(../gf0/2.png)}
#rol > p:nth-child(3) {animation-delay:3.6s;left:120px;background:url(../gf0/3.png)}
#rol > p:nth-child(4) {animation-delay:3.9s;left:184px;background:url(../gf0/4.png)}
#rol > p:nth-child(5) {animation-delay:4.2s;left:264px;background:url(../gf0/5.png)}
#rol > p:nth-child(6) {animation-delay:4.5s;left:345px;background:url(../gf0/6.png)}
#rol > p:nth-child(7) {animation-delay:4.8s;left:408px;background:url(../gf0/7.png)}
@keyframes rotator {
0%   {transform:rotate(0deg)}
10%  {transform:rotate(360deg)}
100% {transform:rotate(360deg)}
}
header {width:1000px;height:160px}
#wrapper {position:relative;width:1000px;margin:0 auto;}
iframe {width:1000px;height:940px;background-color:#ff0;border:0}
* {margin:0;padding:0;box-sizing:border-box}
#viewport {margin:0 auto;position:relative;width:1000px;height:160px;overflow:hidden}
.layer {position:absolute;width:1400px;height:370px;background-size:cover;background-position:center;top:0;left:50%;overflow:hidden}
.next {background:url(../gf0/1.jpg);z-index:2;pointer-events:auto}
.kursor {
position:fixed;left:0;top:0;width:64px;height:64px;transform:translate(-50%, -50%);pointer-events:none;z-index:99;display:none;filter:drop-shadow(0 3px 3px rgba(0,0,0,.25));animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse {
0% {transform:translate(-50%,-50%) scale(1)}
50% {transform:translate(-50%,-50%) scale(1.05)}
100% {transform:translate(-50%,-50%) scale(1)}
}
.kursor.click {animation: click-bounce 500ms ease-out}
@keyframes click-bounce {
0%   {transform:translate(-50%,-50%) scale(1.05)}
100% {transform:translate(-50%,-50%) scale(1)}
}
.kursor svg .star {display:block;transition:fill 150ms ease,stroke 150ms ease}
@media (hover:none) and (pointer:coarse) {body {cursor:auto !important;}
.kursor {display:none !important;}
}
header, header * {
  cursor: none !important;
}