.demo-index{touch-action:none;height:100%;display:flex;flex-direction:column;justify-content:space-between}.demo-index .demo-index-top{flex:1;align-self:center}.demo-index .demo-index-top .word{width:90vw;margin:30px 0 10px}.demo-index .demo-index-top .animate{text-align:center;font-size:12vw;letter-spacing:5px}.demo-index .demo-index-top .animate>span{display:inline-block;color:#0f5f94;opacity:0;transform:translate(-150px) scale(.3);animation:leftRight .5s forwards}.demo-index .demo-index-top .animate span:nth-of-type(2){animation-delay:.1s}.demo-index .demo-index-top .animate span:nth-of-type(3){animation-delay:.2s}.demo-index .demo-index-top .animate span:nth-of-type(4){animation-delay:.3s}.demo-index .demo-index-top .animate span:nth-of-type(5){animation-delay:.4s}.demo-index .demo-index-top .animate span:nth-of-type(6){animation-delay:.5s}.demo-index .demo-index-top .animate span:nth-of-type(7){animation-delay:.6s}@keyframes leftRight{40%{transform:translate(50px) scale(.7);opacity:1;color:#0f5f94}60%{color:rgba(15,95,148,.2117647059)}80%{transform:translate(0) scale(2);opacity:0}to{transform:translate(0) scale(1);opacity:1}}.demo-index .demo-index-bottom{position:relative;width:100vw;height:50vh}.demo-index .demo-index-bottom .bird{position:absolute;bottom:202px;left:0;width:200px}.demo-index .demo-index-bottom .tips{text-align:center;position:absolute;z-index:10;bottom:130px;left:0;width:100%;color:#999;font-size:14px}.demo-index .demo-index-bottom .card{position:absolute;z-index:10;bottom:40px;left:0;width:200px;cursor:move}.demo-index .demo-index-bottom .ripple{position:absolute;z-index:1;bottom:0;left:0;width:100%}