.o,[scroll]{overflow:hidden}.h,.step-1{pointer-events:none}.step-2 ul,.step-3>ul,.tip{text-align:center}body,form,h1,h2,h3,h4,h5,ol,p,ul{margin:0}ol,ul{padding:0}html{color:#222;font:1.5em 'HanHei SC','PingFang SC','Helvetica Neue',Helvetica,STHeitiSC-Light,"Microsoft YaHei","微软雅黑",Arial,sans-serif}button,input,option,select,textarea{font:inherit}h1,h2,h3,h4{font-weight:600}button:focus,input:focus,textarea:focus{outline:0}::-moz-selection{background:rgba(0,149,255,.1)}::selection{background:rgba(0,149,255,.1)}ul{list-style-type:none}a{text-decoration:none;color:#007AFF}img{border:0}.o{zoom:1}.l{float:left}.r,header nav{float:right}.c:after{content:'.';display:block;height:0;clear:both;visibility:hidden}* html .c{height:1%}.h{opacity:0}.none,xmp{display:none}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#2f7ddb}[scroll]{overflow-y:auto;-webkit-overflow-scrolling:touch;overflow-scrolling:touch}#stage,.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)}.layout{width:1120px;margin:auto}.switch input{top:0;right:0;bottom:0;left:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);-moz-opacity:0;opacity:0;z-index:100;position:absolute;width:100%;height:100%;cursor:pointer}.switch{width:460px;height:55px;position:relative;margin:25px auto 0;cursor:pointer;font-size:1em}.span-1,.span-2,.span-3{display:inline-block;vertical-align:middle;color:#fff;margin-left:10px;padding:5px}.index-nav .active{border:solid;border-width:2px;border-radius:5px;font-size:1.1em}header{line-height:40px;padding:60px 0;-webkit-animation:fadeinT .3s ease;animation:fadeinT .3s ease}header h1{float:left;font-size:2.2em;width:210px;height:80px;line-height:80px;background-size:auto 60px}header nav{padding:20px}header nav a{display:inline-block;color:#FFF;padding:0 .5em;text-shadow:0 2px 0 rgba(0,0,0,.2)}header nav a[href*="www.zhujike.com"]{padding-left:50px;margin-right:10px;font-weight:500;position:relative}header nav a[href*="www.zhujike.com"]:after{content:'';position:absolute;left:0;top:-5px;width:40px;height:40px;background:url(img/zhujike.svg) no-repeat;background-size:40px 40px}header nav a.login-link{margin-left:1em;box-shadow:0 0 0 3px rgba(255,255,255,.8);border-radius:.3em;font-weight:700;text-shadow:none;-webkit-transition:background .3s ease,color .3s ease;transition:background .3s ease,color .3s ease}header nav a.login-link:hover{background:#FFF;color:#2f7ddb}@-webkit-keyframes fadeinT{0%{opacity:0;-webkit-transform:translateY(-100px);transform:translateY(-100px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeinT{0%{opacity:0;-webkit-transform:translateY(-100px);transform:translateY(-100px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.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-2{-webkit-transform-style:preserve-3d}.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-3>ul,.tip{pointer-events:none}.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 .bg,.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 .bg{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)}}.step-2{background:#FFF;position:relative;-webkit-perspective:1000px;perspective:1000px;transform-style:preserve-3d}.step-2 *,.step-3{-webkit-transform-style:preserve-3d}.step-2 *{transform-style:preserve-3d}.step-2 .ui-h-1{position:absolute;top:-140px;left:50%;margin-left:-250px}.step-2 ul{max-width:1270px;margin:0 auto;font-weight:200;font-size:0}.step-2 ul li{font-size:21px;display:inline-block;vertical-align:top;padding:1em 0;margin:1em;width:370px;-webkit-transition:-webkit-transform 1s ease;transition:transform 1s ease}.step-2 ul li .icon{font-size:40px;line-height:80px}.step-2 ul li .icon i{display:inline-block;vertical-align:top;width:80px;height:80px;margin-left:-10px;margin-right:10px}.step-2 ul li .icon big{display:inline-block;font-size:52px;font-weight:500;margin-right:.1em}.step-2 ul li .icon cite{display:inline-block;font-size:32px;font-style:normal;font-weight:500}.step-2 ul li h4{font-size:28px;line-height:40px;padding-bottom:6px;font-weight:300}.step-2 ul li p{font-size:18px;font-weight:200;opacity:.5}.step-2 ul li.feature-1 .icon i{background-image:url(img/1.svg)}.step-2 ul li.feature-2 .icon i{background-image:url(img/2.svg)}.step-2 ul li.feature-3 .icon i{background-image:url(img/3.svg)}.step-2 ul li.feature-4 .icon i{background-image:url(img/4.svg)}.step-2 ul li.feature-4 .icon big{margin-right:.2em}.step-2 ul li.feature-5 .icon i{background-image:url(img/5.svg)}.step-2 ul li.feature-6 .icon i{background-image:url(img/6.svg)}.step-2 .after{content:'';position:absolute;top:100%;z-index:-1;left:50%;width:4000px;height:693px;margin-left:-2000px;background:#FFF;margin-top:-350px;-webkit-transform:rotateZ(10deg);transform:rotateZ(10deg);-webkit-transition:-webkit-transform .3s ease;transition:transform .3s ease}.step-2 .content{-webkit-transform:scale(.8);transform:scale(.8);opacity:0;-webkit-transition:opacity .3s ease,-webkit-transform .3s ease;transition:opacity .3s ease,transform .3s ease}.tip{position:fixed;bottom:2em;left:50%;width:120px;margin-left:-60px;color:#222;font-size:24px;-webkit-animation:shell 5s infinite;animation:shell 5s infinite;opacity:0;-webkit-transition:opacity .3s ease;transition:opacity .3s ease}html[step="1"] .tip-1,html[step="2"] .tip-2,html[step="3"] .tip-3{opacity:1;-webkit-transition:opacity 3s ease;transition:opacity 3s ease}html[step="2"] .step-2 .content{-webkit-transform:scale(1);transform:scale(1);opacity:1}@media (max-height:900px){.tip{display:none}}.step-3{-webkit-perspective:1000px;perspective:1000px;transform-style:preserve-3d;padding-top:500px;-webkit-transition:-webkit-transform .3s ease,opacity .3s ease;transition:transform .3s ease,opacity .3s ease;-webkit-transform:scale(.8);transform:scale(.8);opacity:0}.step-3 *{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.step-3>ul{padding:20px 0 40px}.step-3>ul>li{display:inline-block;vertical-align:top;background:#FFF;pointer-events:auto;width:280px;box-shadow:0 30px 30px -15px rgba(3,15,134,.25);border-radius:.4em;margin:1em;-webkit-transition:-webkit-transform .3s ease;transition:transform .3s ease}.step-3>ul>li:hover,.step-3>ul>li:nth-child(2){-webkit-transform:scale(1.1);transform:scale(1.1)}.step-3>ul>li .head{padding:1em 0}.step-3>ul>li .head h5{font-size:18px;font-weight:200;opacity:.5}.step-3>ul>li .head h4 big{display:block;line-height:2}.step-3>ul>li .head h4 small{display:block;font-size:16px;font-weight:400;opacity:.5}.step-3>ul>li>ul{display:block;padding:1em;text-align:left;font-size:16px}.step-3>ul>li>ul>li{display:block;padding:0;line-height:38px}.step-3>ul>li>ul>li i{display:inline-block;vertical-align:top;width:70px;margin-right:.3em;text-align:right;font-weight:200;font-style:normal;font-size:14px;opacity:.5}.step-3>ul>li>ul>li b{font-size:16px;font-weight:400}.step-3>ul>li .button{display:block;background:#2f7ddb;color:#FFF;margin:10px;border:0;line-height:50px;border-radius:.2em;cursor:pointer}.step-3>ul:hover>li{-webkit-transform:scale(1);transform:scale(1)}.step-3>ul:hover>li:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}.step-3 .note{color:#FFF;margin-bottom:-150px}html[step="3"] .step-3{opacity:1;-webkit-transform:scale(1);transform:scale(1)}.step-4{background:url(img/step-1.svg) top center no-repeat #2f7ddb;background-size:4000px 1360px;padding-top:500px}.step-4 #step4{position:relative}.step-4 .shell-2{position:absolute;top:-290px;left:50%;margin-left:100px;height:580px;width:590px;background:url(img/shell-2.png) 50% 50% no-repeat;background-size:cover;-webkit-transition:-webkit-transform .3s ease,opacity .3s ease;transition:transform .3s ease,opacity .3s ease;-webkit-transform:translateX(400px);transform:translateX(400px);pointer-events:none;opacity:0}.step-4 .content{-webkit-transform:scale(.8);transform:scale(.8);opacity:0;text-align:center;-webkit-transition:opacity .3s ease,-webkit-transform .3s ease;transition:opacity .3s ease,transform .3s ease;margin-bottom:-200px}.step-4 .content i{display:inline-block;width:160px;height:160px;background:url(img/7.svg) 50% 50% no-repeat;background-size:160px 160px;margin-bottom:1em}.step-4 .content .note{padding:30px 0}.step-4 .content .note p{padding:10px 0}.step-4 .content .button{display:inline-block;color:#000;font-weight:700;font-size:28px;line-height:56px;padding:0 1em;box-shadow:0 0 0 3px rgba(0,0,0,.8);border-radius:.3em;background:0 0;border:0;cursor:pointer;-webkit-transition:background .3s ease,color .3s ease;transition:background .3s ease,color .3s ease}.step-4 .content .button:hover{background:#000;color:#FFF}.step-4 .content .price{display:block;font-size:1.2em}.step-4 .content .op5{opacity:.5}html[step="4"] .step-4 .content{-webkit-transform:scale(1);transform:scale(1);opacity:1}html[step="4"] .step-4 .shell-2{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}footer{background:url(img/step-2.svg) top center no-repeat #2f7ddb;background-size:4000px 693px;padding-top:450px;color:#FFF;padding-bottom:50px}footer .htko{font-size:2em;line-height:180px;text-align:center}footer .layout{padding:50px 0 0;font-size:14px}footer .layout a{display:inline-block;color:#FFF;padding:.5em;opacity:.4}footer .layout a[href*=hostker]{font-weight:700;opacity:.7}.ui-h{text-align:center;font-size:60px;line-height:70px;font-weight:200;min-width:500px}.ui-h-2{color:#FFF}.note{box-sizing:border-box;padding:0 2em;font-size:18px;line-height:32px}html[app=help] .main-box{background:#FFF;margin:0;min-height:500px}html[app=help] #标题{line-height:180px;text-align:center;color:#FFF;text-shadow:0 3px 1px rgba(0,0,0,.2)}html[app=help] .nav-box{text-align:center;line-height:80px;padding-top:50px}html[app=help] .nav-box a{display:inline-block;vertical-align:top;height:80px;padding:0 1em;color:#FFF;opacity:.7;text-shadow:0 2px 0 rgba(0,0,0,.2);position:relative}html[app=help] .nav-box a.active{font-weight:700;opacity:1}html[app=help] .nav-box a.active:after{content:'';position:absolute;left:50%;bottom:0;font-size:12px;margin-left:-1em;border:1em solid transparent;border-bottom-color:#FFF}html[app=help] .text-banner{text-align:center;font-size:1em;line-height:1.2;padding:100px 0;color:#999}html[app=help] .md-content{padding:100px;box-sizing:border-box;font-size:18px;line-height:2}html[app=help] .md-content p{padding:1em 0}html[app=help] .md-content h1,html[app=help] .md-content h2{padding-top:2em;margin:0}
