.app_h5{

    padding:50px 0;

    background-color:#f6f6f6;

}

.app_h5n h2{

    text-align: center;

    color:#333333;

    font-size:30px;

    line-height:75px;

    

}

.app_h5n span{

    text-align: center;

    color:#909090;

    font-size:16px;

    display: block;

    line-height:30px;

}

.app_h5c{

    text-align: center;

    position: relative;

    width:1200px;

    margin:0 auto;

    

    background-position:47px 137px;

    height:310px;

}

.app_h5c i{

    display: block;

    width:66px;

    height:66px;

    overflow: hidden;

    

    background-size:100% 100%;

    transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;

    -webkit-transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;

    -moz-transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;

}

.app_h5c li:hover i{

    

    background-size:100% 100%;

    transform: rotateY(360deg);

}

.app_h5c li{

    position: absolute;

}

.app_h5c li span{

    display: block;

    text-align: center;

    width: 24px;

    line-height: 24px;

    border-radius: 50%;

    margin: 0 auto;

    margin-top: 12px;

    

    color: #7c77a9;

    font-size: 14px;

    background-size: 100% 100%;

}

.app_h5c li p{

    display:block;

    text-align: center;

    color:#444444;

    font-size:16px;

    margin-top: 12px;

}

.app_h5c .l1{

    left: 50px;

    top: 146px;

}



.app_h5c .l2{

    left: 190px;

    top: 106px;

}

.app_h5c .l3{

    left: 325px;

    top: 109px;

}

.app_h5c .l4{

    left: 465px;

    top: 98px;

}

.app_h5c .l5{

    left: 595px;

    top: 47px;

}

.app_h5c .l6{

    left: 739px;

    top: 79px;

}

.app_h5c .l7{

    left: 875px;

    top: 126px;

}

.app_h5c .l8{

    left: 1037px;

    top: 133px;

}

.app_h5c i .pic1{

    display:block;

}

.app_h5c i .pic2{

    display: none;

}

.app_h5c li:hover .pic2{

    display:block;

}

.app_h5c li:hover .pic1{

    display: none;

}



.case_ula .case_bigimg{width:100%;height:100%;overflow:hidden;display:block;border-radius: 7px;}

.case_ula .case_bigimg img{width:100%;display:block;

    -webkit-transition: all .5s ease-in-out 0s;

    -moz-transition: all .5s ease-in-out 0s;

    -ms-transition: all .5s ease-in-out 0s;

    -o-transition: all .5s ease-in-out 0s;

    transition: all .5s ease-in-out 0s;

}

.case_ula li:hover .case_bigimg img{

    -webkit-transform: scale(1.13);

    -moz-transform: scale(1.13);

    -o-transform: scale(1.13);

    -ms-transform: scale(1.13);

    transform:scale(1.13);}



.casep{font-size: 16px;width:100%;line-height:54px;height:54px;position:relative; border-bottom:1px solid rgba(255,255,255,0.1);}

.casep a{width:70%;display:block;height:100%;line-height:54px; color:#545454;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap; }



.casep i{display:block;width:18px;position:absolute;bottom:0;left:0;height:1px;background:#3291f2;

    -webkit-transition: all .8s ease 0.2s;

    -moz-transition: all .8s ease 0.2s;

    -ms-transition: all .8s ease 0.2s;

    -o-transition: all .8s ease 0.2s;

    transition: all .8s ease 0.2s;

}

.case_ula li:hover .casep i{width:100%;}





/* style definition */

 

#system-img{margin-top: 60px;position: absolute;right: 0;opacity: 0;animation: syst 1.5s;-moz-animation: syst 1.5s;	/* Firefox */-webkit-animation: syst 1.5s;	/* style definition */-o-animation: syst 1.5s;animation-fill-mode:forwards;}

#system{animation: sys 1.5s;-moz-animation: sys 1.5s;	/* Firefox */-webkit-animation: sys 1.5s;	/* style definition */-o-animation: sys 1.5s;animation-fill-mode:forwards;}

@keyframes sys{from {left: -19.9%;opacity:0;}to {left: 0;opacity:1;}}

@-moz-keyframes sys /* Firefox */{from  {left: -19.9%;opacity:0;}to {left: 0;opacity:1;}}

@-webkit-keyframes sys /* style definition */{from  {left: -19.9%;opacity:0;}to {left: 0;opacity:1;}}

@-o-keyframes sys/* Opera */{from {left: -19.9%;opacity:0;}to {left: 0;opacity:1;}}

            

@keyframes syst{from {right: -18.7%;opacity:0;}to {right: 0;opacity:1;}}

@-moz-keyframes syst /* Firefox */{from  {right: -18.7%;opacity:0;}to {right: 0;opacity:1;}}

@-webkit-keyframes syst /* style definition */{from  {right: -18.7%;opacity:0;}to {right:0;opacity:1;}}

@-o-keyframes syst /* Opera */{from {right: -18.7%;opacity:0;}to {right: 0;opacity:1;}}



/* style definition */ 



@keyframes sl{from {bottom: -60px;opacity:0;}to {bottom: 0;opacity:1;}}

@-moz-keyframes sl {from  {bottom: -60px;opacity:0;}to {bottom:0;opacity:1;}}

@-webkit-keyframes sl {from  {bottom: -60px;opacity:0;}to {bottom:0;opacity:1;}}

@-o-keyframes sl {from {bottom: -60px;opacity:0;}to {bottom:0;opacity:1;}}









/* style definition */            

#mall-img{position: absolute;left: -20.8%;bottom: 0;opacity: 0;animation: mall-img 1.5s;-moz-animation: mall-img 1.5s;	/* Firefox */-webkit-animation: mall-img 1.5s;	/* style definition */-o-animation: mall-img 1.5s;animation-fill-mode:forwards;}

#mall{animation: mall 1.5s;-moz-animation: mall 1.5s;	/* Firefox */-webkit-animation: mall 1.5s;	/* style definition */-o-animation: mall 1.5s;animation-fill-mode:forwards;}

@keyframes mall-img{from {left: -20.8%;opacity:0;}to {left: 4%;opacity:1;}}

@-moz-keyframes mall-img /* Firefox */{from  {left: -20.8%;opacity:0;}to {left: 4%;opacity:1;}}

@-webkit-keyframes mall-img /* style definition */{from  {left: -20.8%;opacity:0;}to {left: 4%;opacity:1;}}

@-o-keyframes mall-img/* Opera */{from {left: -20.8%;opacity:0;}to {left: 4%;opacity:1;}}

            

@keyframes mall{from {right: -18.7%;opacity:0;}to {right: 0;opacity:1;}}

@-moz-keyframes mall /* Firefox */{from  {right: -18.7%;opacity:0;}to {right: 0;opacity:1;}}

@-webkit-keyframes mall /* style definition */{from  {right: -18.7%;opacity:0;}to {right:0;opacity:1;}}

@-o-keyframes mall /* Opera */{from {right: -18.7%;opacity:0;}to {right: 0;opacity:1;}}

            



@keyframes mimg{from {left: 0;opacity:0;}to {left: 19.25%;opacity:1;}}

@-moz-keyframes mimg /* Firefox */{from  {left: 0;opacity:0;}to {left: 19.25%;opacity:1;}}

@-webkit-keyframes mimg /* style definition */{from  {left: 0;opacity:0;}to {left: 19.25%;opacity:1;}}

@-o-keyframes mimg/* Opera */{from {left: 0;opacity:0;}to {left: 19.25%;opacity:1;}}

            

@keyframes mspan{from {right: 0;opacity:0;}to {right: 19.25%;opacity:1;}}

@-moz-keyframes mspan /* Firefox */{from  {right: 0;opacity:0;}to {right: 19.25%;opacity:1;}}

@-webkit-keyframes mspan /* style definition */{from  {right: 0;opacity:0;}to {right:19.25%;opacity:1;}}

@-o-keyframes mspan /* Opera */{from {right: 0;opacity:0;}to {right: 19.25%;opacity:1;}}

            

/* style definition */ 



@keyframes e{from {top:0;opacity: 0;}to {top:74px;opacity: 1;}}

@-moz-keyframes e /* Firefox */{from  {top: 0;opacity:0;}to {top: 74px;opacity:1;}}

@-webkit-keyframes e /* style definition */{from  {top: 0;opacity:0;}to {top:74px;opacity:1;}}

@-o-keyframes e /* Opera */{from {top: 0;opacity:0;}to {top: 74px;opacity:1;}}



            

/* style definition */ 

@keyframes group{from {left:-20.57%;opacity: 0;}to {left:0;opacity: 1;}}

@-moz-keyframes group /* Firefox */{from  {left: -20.57%;opacity:0;}to {left: 0;opacity:1;}}

@-webkit-keyframes group /* style definition */{from  {left: -20.57%;opacity:0;}to {left:0;opacity:1;}}

@-o-keyframes group /* Opera */{from {left: -20.57%;opacity:0;}to {left: 0;opacity:1;}}



/* style definition */

@keyframes lx{from {right:-18.75%;opacity: 0;}to {right:0;opacity: 1;}}

@-moz-keyframes lx /* Firefox */{from  {right: -18.75%;opacity:0;}to {right: 0;opacity:1;}}

@-webkit-keyframes lx /* style definition */{from  {right: -18.75%;opacity:0;}to {right:0;opacity:1;}}

@-o-keyframes lx /* Opera */{from {right: -18.75%;opacity:0;}to {right: 0;opacity:1;}}





/* style definition */

@keyframes yb{from {opacity: 0;}to {opacity: 1;}}

@-moz-keyframes yb /* Firefox */{from  {opacity:0;}to {opacity:1;}}

@-webkit-keyframes yb /* style definition */{from  {opacity:0;}to {opacity:1;}}

@-o-keyframes yb /* Opera */{from {opacity:0;}to {opacity:1;}}



@keyframes yimg{from {bottom: 0;opacity: 0;}to {bottom: 58px;opacity: 1;}}

@-moz-keyframes yimg /* Firefox */{from {bottom: 0;opacity: 0;}to {bottom: 58px;opacity: 1;}}

@-webkit-keyframes yimg /* style definition */{from {bottom: 0;opacity: 0;}to {bottom: 58px;opacity: 1;}}

@-o-keyframes yimg /* Opera */{from {bottom: 0;opacity: 0;}to {bottom: 58px;opacity: 1;}}





@keyframes rule1{from {left:0;opacity: 0;}to {left:50px;opacity: 1;}}

@-moz-keyframes rule1 /* Firefox */{from  {left: 0;opacity:0;}to {left: 50px;opacity:1;}}

@-webkit-keyframes rule1 /* style definition */{from  {left: 0;opacity:0;}to {left:50px;opacity:1;}}

@-o-keyframes rule1 /* Opera */{from {left: 0;opacity:0;}to {left: 50px;opacity:1;}}



@keyframes rule2{from {right:0;opacity: 0;}to {right:50px;opacity: 1;}}

@-moz-keyframes rule2 /* Firefox */{from  {right: 0;opacity:0;}to {right: 50px;opacity:1;}}

@-webkit-keyframes rule2 /* style definition */{from  {right: 0;opacity:0;}to {right:50px;opacity:1;}}

@-o-keyframes rule2 /* Opera */{from {right: 0;opacity:0;}to {right: 50px;opacity:1;}}



@keyframes tp{from {right:-80px;opacity: 0;}to {right:0px;opacity: 1;}}

@-moz-keyframes tp /* Firefox */{from  {right: -80px;opacity:0;}to {right: 0px;opacity:1;}}

@-webkit-keyframes tp /* style definition */{from  {right: -80px;opacity:0;}to {right:0px;opacity:1;}}

@-o-keyframes tp /* Opera */{from {right: -80px;opacity:0;}to {right: 0px;opacity:1;}}





@keyframes word{from {left:-80px;opacity: 0;}to {left:0;opacity: 1;}}

@-moz-keyframes word /* Firefox */{from  {left: -80px;opacity:0;}to {left: 0;opacity:1;}}

@-webkit-keyframes word /* style definition */{from  {left: -80px;opacity:0;}to {left:0;opacity:1;}}

@-o-keyframes word /* Opera */{from {left: -80px;opacity:0;}to {left: 0;opacity:1;}}





/* style definition */

@keyframes xys{from {left: -18.75%;opacity:0;}to {left: 0;opacity:1;}}

@-moz-keyframes xys /* Firefox */{from  {left: -18.75%;opacity:0;}to {left: 0;opacity:1;}}

@-webkit-keyframes xys /* style definition */{from  {left: -18.75%;opacity:0;}to {left: 0;opacity:1;}}

@-o-keyframes xys/* Opera */{from {left: -18.75%;opacity:0;}to {left: 0;opacity:1;}}



@keyframes pic{from {right: -30%;opacity:0;}to {right: -19%;opacity:1;}}

@-moz-keyframes pic /* Firefox */{from  {right:  -30%;opacity:0;}to {right: -19%;opacity:1;}}

@-webkit-keyframes pic /* style definition */{from  {right:  -30%;opacity:0;}to {right: -19%;opacity:1;}}

@-o-keyframes pic /* Opera */{from {right:  -30%;opacity:0;}to {right: -19%;opacity:1;}}



 

/* style definition */



@keyframes dev{from {left:-50px;opacity: 0;}to {left:30px;opacity: 1;}}

@-moz-keyframes dev /* Firefox */{from  {left: -50px;opacity:0;}to {left: 30px;opacity:1;}}

@-webkit-keyframes dev /* style definition */{from  {left: -50px;opacity:0;}to {left:30px;opacity:1;}}

@-o-keyframes dev /* Opera */{from {left: -50px;opacity:0;}to {left: 30px;opacity:1;}}



@keyframes bh{from {right: 0;opacity:0;}to {right: 18.75%;opacity:1;}}

@-moz-keyframes bh /* Firefox */{from  {right: 0;opacity:0;}to {right: 18.75%;opacity:1;}}

@-webkit-keyframes bh /* style definition */{from  {right: 0;opacity:0;}to {right:18.75%;opacity:1;}}

@-o-keyframes bh /* Opera */{from {right: 0;opacity:0;}to {right: 18.75%;opacity:1;}}



@keyframes lbh{from {left: 0;opacity:0;}to {left: 18.75%;opacity:1;}}

@-moz-keyframes lbh /* Firefox */{from  {left: 0;opacity:0;}to {left: 18.75%;opacity:1;}}

@-webkit-keyframes lbh /* style definition */{from  {left: 0;opacity:0;}to {left: 18.75%;opacity:1;}}

@-o-keyframes lbh/* Opera */{from {left: 0;opacity:0;}to {left: 18.75%;opacity:1;}}



@keyframes cx{from {right: 0;opacity:0;}to {right: 5.2%;opacity:1;}}

@-moz-keyframes cx /* Firefox */{from  {right: 0;opacity:0;}to {right: 5.2%;opacity:1;}}

@-webkit-keyframes cx /* style definition */{from  {right: 0;opacity:0;}to {right:5.2%;opacity:1;}}

@-o-keyframes cx /* Opera */{from {right: 0;opacity:0;}to {right: 5.2%;opacity:1;}}



@keyframes ppt{from {bottom: -160px;opacity:0;}to {bottom: -110px;opacity:1;}}

@-moz-keyframes ppt {from  {bottom: -160px;opacity:0;}to {bottom:-110px;opacity:1;}}

@-webkit-keyframes ppt {from  {bottom: -160px;opacity:0;}to {bottom:-110px;opacity:1;}}

@-o-keyframes ppt {from {bottom: -160px;opacity:0;}to {bottom:-110px;opacity:1;}}





/* style definition */



@keyframes ser{from {top:0;opacity: 0;}to {top:136px;opacity: 1;}}

@-moz-keyframes ser /* Firefox */{from  {top: 0;opacity:0;}to {top: 136px;opacity:1;}}

@-webkit-keyframes ser /* style definition */{from  {top: 0;opacity:0;}to {top:136px;opacity:1;}}

@-o-keyframes ser /* Opera */{from {top: 0;opacity:0;}to {top: 136px;opacity:1;}}



@keyframes st{from {bottom: -152px;opacity:0;}to {bottom: -92px;opacity:1;}}

@-moz-keyframes st {from  {bottom: -152px;opacity:0;}to {bottom:-92px;opacity:1;}}

@-webkit-keyframes st {from  {bottom: -152px;opacity:0;}to {bottom:-92px;opacity:1;}}

@-o-keyframes st {from {bottom: -152px;opacity:0;}to {bottom:-92px;opacity:1;}}