@charset "utf-8";*{margin:0;padding:0;border:0;vertical-align:baseline;outline:0;text-align:center;box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{background:#fff;width:100%;font-family:'Calluna Sans',sans-serif;color:#333;overflow:hidden}@keyframes slowShow{0%{opacity:0}100%{opacity:1}}img{image-rendering:-webkit-optimize-contrast}main{width:100vw;background:#fff;height:100vh}.content{width:100vw;height:110vh;position:absolute;left:0;top:-5vh;animation:slowShow .2s cubic-bezier(1,0,.5,.5) .5s both}.content>.inner{display:flex;position:relative;justify-content:center;align-items:center;flex-wrap:wrap}.wrapper{width:72px;height:99px;display:block;margin:0;vertical-align:middle;border:none}.line-breaker{width:100%;height:1px}.odd{transform:translateY(40%)}.wrapper>.inner{position:relative}.people{height:99px;position:relative;width:72px}.people div,.people img{position:absolute;width:100%;display:block;height:100%;transition:all .15s ease-in-out}.people div{background-size:contain}.hand{background-image:url(hand.png)}.eye{z-index:3}.hair{z-index:4}.mask{z-index:5}.body-0 .body{background-image:url(b0.png)}.body-1 .body{background-image:url(b1.png)}.body-0 .feet{background-image:url(f0.png)}.body-1 .feet{background-image:url(f1.png)}.head-0 .head{background-image:url(h0.png)}.head-1 .head{background-image:url(h1.png)}.head-2 .head{background-image:url(h2.png)}.head-3 .head{background-image:url(h3.png)}.head-4 .head{background-image:url(h4.png)}.head-0 .eye{background-image:url(e0.png)}.head-1 .eye{background-image:url(e1.png)}.head-2 .eye{background-image:url(e2.png)}.head-3 .eye{background-image:url(e3.png)}.head-4 .eye{background-image:url(e4.gif)}.head-0 .eye{animation:eye-0 2s ease-out infinite both}@keyframes eye-0{0%{opacity:1}5%{opacity:0}10%{opacity:1}15%{opacity:0}20%{opacity:1}25%{opacity:0}30%{opacity:1}100%{opacity:1}}.head-1 .eye{animation:eye-1 3s ease-out infinite both}@keyframes eye-1{0%{opacity:0}9%{opacity:0}10%{opacity:1}30%{opacity:1}31%{opacity:0}100%{opacity:0}}.head-2 .eye{animation:eye-2 2s ease-out infinite both}.head-3 .eye{animation:eye-0 3.2s ease-in .14s infinite both}@keyframes eye-2{0%{transform:translateX(-4%)}30%{transform:translateX(-4%)}40%{transform:translateX(4%)}60%{transform:translateX(4%)}100%{transform:translateX(-4%)}}.ani-0:active .people,.ani-0:hover .people{animation:ani-a .8s ease-out infinite}.ani-0:active .feet,.ani-0:hover .feet{animation:ani-a .8s ease-out .01s infinite}@keyframes ani-a{0%{transform:none}10%{transform:translateY(-1em)}23%{transform:none}34%{transform:translateY(-1em)}44%{transform:none}}.ani-1:active .eye,.ani-1:active .hair,.ani-1:active .head,.ani-1:hover .eye,.ani-1:hover .hair,.ani-1:hover .head{animation:ani-b .4s ease-out infinite}.ani-1:active .hair,.ani-1:hover .hair{animation-delay:.01s}@keyframes ani-b{0%{transform:none}25%{transform:translateX(3%)}50%{transform:none}75%{transform:translateX(-3%)}100%{transform:none}}.ani-2:active .eye,.ani-2:active .hair,.ani-2:active .head,.ani-2:hover .eye,.ani-2:hover .hair,.ani-2:hover .head{animation:ani-c .4s ease-out infinite}@keyframes ani-c{0%{transform:none}25%{transform:rotate(3deg)}50%{transform:none}75%{transform:rotate(-3deg)}100%{transform:none}}.ani-3:active .people,.ani-3:hover .people{animation:ani-c .7s cubic-bezier(.79,.03,1,.25) infinite;transform-origin:bottom}.ani-4:active .eye,.ani-4:active .hair,.ani-4:active .head,.ani-4:hover .eye,.ani-4:hover .hair,.ani-4:hover .head{animation:ani-d 1s ease-out infinite}.ani-4:active .hair,.ani-4:hover .hair{animation-delay:.01s}@keyframes ani-d{0%{transform:none}5%{transform:translateY(2%)}10%{transform:none}15%{transform:translateY(-2%)}20%{transform:none}25%{transform:translateY(2%)}30%{transform:none}35%{transform:translateY(-2%)}40%{transform:none}}.ani-5:active .hair,.ani-5:hover .hair{animation:ani-e 2s ease-in-out both;transform-origin:50% 10%;z-index:999}@keyframes ani-e{0%{transform:none}100%{transform:translateX(-30rem) rotate(1turn);opacity:0}}.even .ani-5 .people{transform:scaleX(-1)}.ani-6 .people{overflow:hidden}.ani-6 *{transition:.15s ease-in-out}.ani-6 .mask::after,.ani-6 .mask::before{display:block;content:"";width:50%;top:0;height:100%;position:absolute;background:#fff;transition:none;z-index:19}.ani-6:active .mask::after,.ani-6:active .mask::before,.ani-6:hover .mask::after,.ani-6:hover .mask::before{z-index:19;transition:all .25s ease-in}.ani-6 .mask::before{left:-65%;border-right:2px solid #4646ff}.ani-6:active .mask::before,.ani-6:hover .mask::before{left:0}.ani-6 .mask::after{right:-65%;border-left:2px solid #4646ff}.ani-6:active .mask::after,.ani-6:hover .mask::after{right:0}.ani-6:active .mask,.ani-6:active .people,.ani-6:hover .mask,.ani-6:hover .people{transform:scaleY(0);transition-delay:.5s}.ani-6:active .mask,.ani-6:hover .mask{transition-delay:.7s}@keyframes ani-f{0%{display:none}1%{background-image:url(m0.gif);display:block}99%{display:block}100%{display:none;background-image:url(m0.gif)}}.ani-7 .mask{background-image:url(back.png);opacity:0}.ani-7:active,.ani-7:hover{animation:ani-c .5s cubic-bezier(.79,.03,1,.25) infinite;transform-origin:bottom}.ani-7:active .mask,.ani-7:hover .mask{animation:ani-g2 10s ease-out both}.ani-7:active .people,.ani-7:hover .people{animation:ani-g 10s ease-out both}.ani-7:active .body,.ani-7:active .eye,.ani-7:active .hair,.ani-7:active .head,.ani-7:hover .body,.ani-7:hover .eye,.ani-7:hover .hair,.ani-7:hover .head{animation:ani-g3 10s ease-out both}@keyframes ani-g{0%{transform:none}3%{transform:rotateY(180deg)}100%{transform:scale(.01) rotateY(180deg)}}@keyframes ani-g2{0%{opacity:0}3%{opacity:1}100%{opacity:1}}@keyframes ani-g3{0%{opacity:1}3%{opacity:0}100%{opacity:0}}.ani-8:active .people,.ani-8:hover .people{animation:ani-h 1.2s cubic-bezier(.8,0,1,.5) .07s both;z-index:999}.ani-8 .mask-outer::before{content:"";background:url(beam.png) no-repeat bottom center;background-color:rgba(255,255,255,.9);background-size:contain;opacity:0;transform:translateY(-1em) scaleX(0);transition:.17s ease-out;box-shadow:0 0 1000px 100px #fff,0 0 1000px 100px #fff}.ani-8:active .mask-outer::before,.ani-8:hover .mask-outer::before{position:absolute;height:900px;width:72px;display:block;top:-792px;left:0;opacity:.9;transform:translateY(0) scaleX(1);pointer-events:none}@keyframes ani-h{0%{transform:none}99%{opacity:1}100%{transform:translateY(-220%) scale(.6);opacity:0}}.ani-9:active .hand,.ani-9:hover .hand{animation:ani-i .5s cubic-bezier(.79,.03,1,.25) infinite}@keyframes ani-i{0%{transform:none}50%{transform:translateY(-4%)}100%{transform:none}}.ani-10 .mask{z-index:99;position:absolute;background:#fff;border:2px solid #4c4bfe;padding:.2em .5em;width:80%;height:auto;left:10%;top:0;opacity:0;transform:translateY(20%);pointer-events:none;transition:.1s ease-out;display:none}.ani-10:active .mask,.ani-10:hover .mask{transform:none;opacity:1;display:block}.ani-10 .mask::before{content:"别戳我";font-size:.5rem;color:#4c4bfe;line-height:1}.removed{pointer-events:none}.removed .people{display:none}.mid{padding:50px 40px 15px;position:absolute;opacity:0;animation:slowShow .2s cubic-bezier(1,0,.5,.5) .1s both}.mid img{max-width:100%}.mid>.inner{display:flex;width:100%;height:100%;flex-direction:column;justify-content:space-around;align-items:flex-start;font-size:.875rem;color:#4c4afe}.btn{background:#ff0162;padding:.2em .6em .2em .8em;letter-spacing:.2em;color:#fff;font-weight:700;text-decoration:none;z-index:9999;transition:all .1s ease-out;display:block;line-height:1.75;cursor:pointer}.btn:hover{background:#4c4afe;animation:shake-it .15s ease-in-out infinite}@keyframes shake-it{0%{transform:translateY(-5%)}25%{transform:none}75%{transform:translateY(5%)}10%{transform:none}}.btn:active{transform:scale(.95)}.tagline{width:100%;padding:1em 0;line-height:1.65}.tagline span{display:inline-block}.tagline em{font-style:normal;transition:all .1s ease-out}.tagline em:last-of-type{border-bottom:2px solid #4c4afe}.more-info{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;width:100%}.more-info a{font-size:.75rem;margin:.3em 0;background:#4c4afe}.more-info a:hover{background:#ff0162}.buy{width:100%}.sep{height:3px;background:#4c4afe;background-size:50% 100%;width:100%}.buy a{margin:0 auto;font-size:1rem;display:inline-block;border:3px solid transparent;border-left:none;border-top:none;border-image:url(tile.png) 6 round}.popup{z-index:999999;position:absolute;background:#fff;border:2px solid #4c4bfe;padding:1em;top:0}@media screen and (max-width:1050px){.people,.wrapper{width:64px;height:88px}.mid{padding:25px 20px 30px}.more-info{justify-content:center}.ani-8:hover .mask-outer::before{height:800px;width:64px;top:-704px}}@media screen and (max-width:900px){.people,.wrapper{width:40px;height:55px}.mid{padding:20px 20px 25px}.mid>.inner{font-size:.5rem}.buy a{border:none}.ani-8:hover .mask-outer::before{height:500px;width:40px;top:-440px}}