.step-1{pointer-events:none}
.step-1,header{overflow:hidden}[scroll]::-webkit-scrollbar{width:3px;height:6px}[scroll]::-webkit-scrollbar-thumb{height:40px;background-color:rgba(140,140,140,.3)}[scroll]::-webkit-scrollbar-thumb:hover{background-color:rgba(140,140,140,.5)}
.step-1{height:1200px;color:#FFF;-webkit-perspective:1200px;perspective:1200px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;position:relative}.step-1 *,
.step-1 a{pointer-events:auto;display:inline-block;color:#FFF;padding:0 .5em}.step-1 .hr,.step-1 .light,.step-1 .shell-box,.step-1 h2,
.step-1 .step-1-in{-webkit-animation:test-in 1s;animation:test-in 1s}.step-1 *{transform-style:preserve-3d}.step-1 #test{height:1200px;height:100vh;-webkit-transform:rotateY(10deg) rotateZ(0);transform:rotateY(10deg) rotateZ(0);-webkit-transform-origin:50% 50%;transform-origin:50% 50%}.step-1 h2{position:absolute;left:50%;margin-left:-50px;top:270px;font-size:3.6em;color:transparent;-webkit-transform:translateZ(100px);transform:translateZ(100px);-webkit-animation:step-one-title-in 1.3s;animation:step-one-title-in 1.3s}.step-1 h2 .line{display:block;position:absolute}.step-1 h2 .line-1{width:540px;height:115px;background:url(img/line-1.png) 50% 50% no-repeat;background-size:cover;top:0;left:-30px}.step-1 h2 .line-1 .moji-1{position:absolute;top:0;left:233px;width:200px;height:110px;background:url(img/moji-1.png) 50% 50% no-repeat;background-size:cover;-webkit-transform:translateZ(50px);transform:translateZ(50px)}.step-1 h2 .line-2{width:455px;height:85px;background:url(img/line-2.png) 50% 50% no-repeat;background-size:cover;top:126px;left:100px}.step-1 .bg1,.step-1 .link-more,.step-1 .link-reg,.step-1 .shell-box{left:50%;position:absolute}.step-1 .link-reg{top:560px;margin-left:-30px;padding:0 1em;font-size:1.4em;line-height:70px;font-weight:700;box-shadow:0 0 0 4px rgba(255,255,255,.8),0 0 0 0 transparent;border-radius:.3em;-webkit-transform:translateZ(150px);transform:translateZ(150px);-webkit-transition:-webkit-transform .3s ease,background .3s ease,color .3s ease;transition:transform .3s ease,background .3s ease,color .3s ease;-webkit-animation:opacity-in 3s;animation:opacity-in 3s}.step-1 .link-reg:hover{background:#FFF;color:#2f7ddb;box-shadow:0 0 0 4px rgba(255,255,255,.8),0 20px 20px -10px rgba(255,0,255,.1);-webkit-transform:translateZ(180px);transform:translateZ(180px)}.step-1 .link-more{top:560px;line-height:70px;margin-left:290px;-webkit-animation:opacity-in 5s;animation:opacity-in 5s}.step-1 .bg1{top:0;margin-left:-500px;background:url(img/pcb.png) 50% 50% no-repeat;width:1128px;height:821px;-webkit-transform:translateZ(-300px) scale(1.2);transform:translateZ(-300px) scale(1.2)}.step-1 .shell-box{top:250px;margin-left:-590px;-webkit-animation:shell-in 1s;animation:shell-in 1s}.step-1 .shell{position:absolute;top:0;left:0;-webkit-animation:shell 7s infinite;animation:shell 7s infinite}.step-1 .shell span{display:block;height:785px;width:500px;background:url(img/shell.png) 50% 50% no-repeat;background-size:cover;-webkit-transform:translateZ(50px);transform:translateZ(50px)}.step-1 .shell-shadow{position:absolute;top:40px;left:0;height:785px;width:500px;background:url(img/shell-shadow.png) 50% 50% no-repeat;background-size:cover;opacity:.3;-webkit-transform:translateZ(1px);transform:translateZ(1px)}.step-1 .light{position:absolute;top:170px;left:50%;width:470px;height:470px;margin-left:-235px;background:url(img/light@1x.png) 50% 50% no-repeat;background-size:cover;-webkit-transform:translateZ(820px);transform:translateZ(820px)}.step-1 .hr{position:absolute;top:420px;left:50%;margin-left:-2000px;width:4000px;height:1360px;background:url(img/step-1.svg) 50% 50% no-repeat;background-size:cover}@-webkit-keyframes test-in{from{-webkit-transform:translateY(-500px);transform:translateY(-500px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes test-in{from{-webkit-transform:translateY(-500px);transform:translateY(-500px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes shell{50%{-webkit-transform:translateY(-4px);transform:translateY(-4px)}}@keyframes shell{50%{-webkit-transform:translateY(-4px);transform:translateY(-4px)}}@-webkit-keyframes shell-in{30%,from{-webkit-transform:translateX(-1000px) translateZ(200px) rotateY(-20deg) rotateZ(70deg);transform:translateX(-1000px) translateZ(200px) rotateY(-20deg) rotateZ(70deg)}}@keyframes shell-in{30%,from{-webkit-transform:translateX(-1000px) translateZ(200px) rotateY(-20deg) rotateZ(70deg);transform:translateX(-1000px) translateZ(200px) rotateY(-20deg) rotateZ(70deg)}}@-webkit-keyframes opacity-in{50%,from{opacity:0}from{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes opacity-in{50%,from{opacity:0}from{-webkit-transform:translateZ(0);transform:translateZ(0)}}@-webkit-keyframes step-one-title-in{50%,from{-webkit-transform:translateZ(2000px);transform:translateZ(2000px)}}@keyframes step-one-title-in{50%,from{-webkit-transform:translateZ(2000px);transform:translateZ(2000px)}}