body,html{
    height:100%;
    background-color:#ffffff
}
img{
    pointer-events:none;/* 禁止长按图片保存 */
    pointer-event:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    user-select:none;
}
@keyframes zoomIn{
    from{
        transform: scale(0.1);
    }
    to{
        transform: none;
    }
}

@keyframes zoomOut{
    from{
        transform: scale(2);
    }
    to{
        transform: none;
    }
}

@keyframes rotate{
    from{
        transform: rotate(360deg) scale(0.1);
    }
    to{
        transform: none;
    }
}

@keyframes rotate2{
    from{
        transform: rotate(-360deg) scale(2);
    }
    to{
        transform: none;
    }
}
.ani1{
    animation: zoomIn 1s 1;
    opacity: 1 !important;
}

.ani2{
    animation: zoomOut 1s 1;
    opacity: 1 !important;
}

.ani3{
    animation: rotate 1s 1;
    opacity: 1 !important;
}

.ani4{
    animation: rotate2 1s 1;
    opacity: 1 !important;
}
.el{
    opacity: 0;
    position: relative;
}
.container{
    padding-top: 0 !important;
}
.swiper-container {
    width: 100%;
    height: 100vh;
}
.swiper-slide {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/* slide1 */
.slide1-bg{
    width: 100%;
    height: 20.22rem;
    position: absolute;
}
.slide1 .slide1-one{
    width: 7.61rem;
    height: 12.87rem;
    margin: 1.79rem auto 0;
}
.slide1 .slide1-two{
    width: 8.32rem;
    height: 2.17rem;
    margin: 0.45rem auto 0;
}

/* slide2 */
.swiper-box1{
    width: 100%;
    height: 308.97rem;
    position: relative;
}
.slide2-bg01{
    width: 100%;
    height: 308.97rem;
    position: absolute;
    top: 0;
    left: 0;
}
.slide2-img1{
    width: 7.58rem;
    height: 2.35rem;
    padding: 2.99rem 0 0 1.67rem;
}
.slide2-img2{
    width: 8.81rem;
    height: 1.71rem;
    padding: 1.86rem 0 0 1.52rem;
}
.slide2-img3{
    width: 9.44rem;
    height: 1.7rem;
    padding: 1.92rem 0 0 1.36rem;
}
.slide2-img4{
    width: 10.53rem;
    height: 9.5rem;
    padding: 1.04rem 0 0;
}
.slide2-img5{
    width: 10.58rem;
    height: 9.78rem;
    padding: 1.71rem 0 0;
}
.slide2-img6{
    width: 9.44rem;
    height: 1.7rem;
    padding: 1.78rem 0 0 1.36rem;
}
.slide2-img7{
    width: 10.5rem;
    height: 21.35rem;
    padding: 1.19rem 0 0;
}
.slide2-img8{
    width: 9.44rem;
    height: 1.7rem;
    padding: 1.97rem 0 0 1.36rem;
}
.slide2-img9{
    width: 10.51rem;
    height: 44.93rem;
    padding: 1.47rem 0 0;
}
.slide2-img10{
    width: 9.44rem;
    height: 1.7rem;
    padding: 1.85rem 0 0 1.36rem;
}
.slide2-img11{
    width: 10.79rem;
    height: 13.45rem;
    padding: 1.2rem 0 0;
}
.slide2-img12{
    width: 9.44rem;
    height: 1.7rem;
    padding: 1.73rem 0 0 1.36rem;
}
.slide2-img13{
    width: 10.5rem;
    height: 17.58rem;
    padding: 1.09rem 0 0;
}
.slide2-img14{
    width: 9.44rem;
    height: 1.7rem;
    padding: 1.95rem 0 0 1.36rem;
}
.slide2-img15{
    width: 10.53rem;
    height: 25.3rem;
    padding: 1.09rem 0 0;
}
.slide2-img16{
    width: 9.42rem;
    height: 1.7rem;
    padding: 1.95rem 0 0 1.38rem;
}
.slide2-img17{
    width: 10.65rem;
    height: 13.76rem;
    padding: 0.85rem 0 0;
}
.slide2-img18{
    width: 9.42rem;
    height: 1.7rem;
    padding: 1.86rem 0 0 1.38rem;
}
.slide2-img19{
    width: 10.6rem;
    height: 32.58rem;
    padding: 1.32rem 0 0;
}
.slide2-img20{
    width: 9.43rem;
    height: 1.7rem;
    padding: 1.64rem 0 0 1.37rem;
}
.slide2-img21{
    width: 10.8rem;
    height: 67.47rem;
    padding: 1.46rem 0 0;
}

/* slide3 */
.slide3-bg{
    width: 100%;
    height: 90.62rem;
    position: absolute;
}
.slide3-img1{
    width: 8.9rem;
    height: 1.61rem;
    padding: 1.55rem 0 0;
    margin: 0 auto;
}
.slide3-img2{
    width: 9.11rem;
    height: 1.43rem;
    padding: 1.73rem 0 0;
    margin: 0 auto;
}
.slide3-img3{
    width: 9.6rem;
    height: 28.16rem;
    padding: 0.78rem 0 0;
    margin: 0 auto;
}
.slide3-img4{
    width: 9.41rem;
    height: 1.4rem;
    padding: 2.31rem 0 0;
    margin: 0 auto;
}
.slide3-img5{
    width: 9.45rem;
    height: 1.38rem;
    padding: 1.18rem 0 0;
    margin: 0 auto;
}
.slide3-img6{
    width: 9.62rem;
    height: 46.85rem;
    padding: 0.72rem 0 0;
    margin: 0 auto;
}

/* slide4 */
.slide4-bg{
    width: 100%;
    height: 53.88rem;
    position: absolute;
}
.slide4-img1{
    width: 10rem;
    height: 1.33rem;
    padding: 1.76rem 0 0;
    margin: 0 auto;
}
.slide4-img2{
    width: 9.25rem;
    height: 18.78rem;
    padding: 1.73rem 0 0;
    margin: 0 auto;
}
.slide4-img3{
    width: 9.31rem;
    height: 2.74rem;
    padding: 4.88rem 0 0;
    margin: 0 auto;
}
.slide4-img4{
    width: 10.1rem;
    height: 9.88rem;
    padding: 0.72rem 0 0;
    margin: 0 auto;
}
.slide4-img5{
    width: 9.42rem;
    height: 1.91rem;
    padding: 2.68rem 0 0;
    margin: 0 auto;
}

/*动画-start*/
.ani5 {
    animation-duration: 1.5s !important;
    -webkit-animation-duration: 1.5s !important;
    animation-fill-mode: both !important;
    -webkit-animation-fill-mode: both !important;
}
.ani6 {
    animation-duration: 1s !important;
    -webkit-animation-duration: 1s !important;
    animation-fill-mode: both !important;
    -webkit-animation-fill-mode: both !important;
}
/*逐渐显示*/
.ani7 {
    animation: toShow 1.5s 0.5s;
    animation: toShow 1.5s 0.5s;
    animation-fill-mode: both !important;
    -webkit-animation-fill-mode: both !important;
}
/* 放大效果*/
.ani8 {
    animation-name: enlarge;
    -webkit-animation: enlarge;
}
/*从上到下进入*/
.ani9 {
    animation-name: fadeInDown;
    -webkit-animation: fadeInDown;
}
/*从下到上进入*/
.ani10 {
    animation-name: fadeInUpLeft;
    -webkit-animation: fadeInUpLeft;
}
/*从右到左进入*/
.ani11 {
    animation-name: fadeInRight;
    -webkit-animation: fadeInRight;
}
/*从左到右进入*/
.ani12 {
    animation-name: fadeInLeft;
    -webkit-animation: fadeInLeft;
}
/*中心旋转*/
.ani13 {
    animation-name: coreRotate;
    -webkit-animation-name: coreRotate;
}

@keyframes toShow {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@-webkit-keyframes toShow {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

@keyframes enlarge
{
    from {
        opacity: 0;
        -ms-transform: scale(0.1,0.1); /* IE 9 */
        -webkit-transform: scale(0.1,0.1); /* Safari */
        transform: scale(0.1,0.1); /* 标准语法 */
    }
    to {
        opacity:1;
        -webkit-transform:scale(1,1);
        transform:scale(1,1);
    }
}

@-webkit-keyframes enlarge /* Safari 与 Chrome */
{
    from {
        opacity:0;
        -ms-transform: scale(0.1,0.1); /* IE 9 */
        -webkit-transform: scale(0.1,0.1); /* Safari */
        transform: scale(0.1,0.1); /* 标准语法 */
    }
    to {
        opacity:1;
        -webkit-transform:scale(1,1);
        transform:scale(1,1);
    }
}

/*从上到下*/
@keyframes fadeInDown
{
    from {
        opacity: 0;
        -webkit-transform: translate(0,-1000px); /* Safari */
        transform: stranslate(0,-1000px); /* 标准语法 */
    }
    to {
        opacity:1;
        -webkit-transform: translate(0,10px); /* Safari */
        transform: stranslate(0,10px); /* 标准语法 */
    }
}

@-webkit-keyframes fadeInDown /* Safari 与 Chrome */
{
    from {
        opacity:0;
        -webkit-transform: translate(0,-1000px); /* Safari */
        transform: stranslate(0,-1000px); /* 标准语法 */
    }
    to {
        opacity:1;
        -webkit-transform: translate(0,10px); /* Safari */
        transform: stranslate(0,10px); /* 标准语法 */
    }
}
/*从左下到右上*/
@keyframes fadeInUpLeft
{
    from {
        opacity: 0;
        -webkit-transform: translate(-1000px,1000px); /* Safari */
        transform: stranslate(-1000px,1000px); /* 标准语法 */
    }
    to {
        opacity:1;
        -webkit-transform: translate(0,10px); /* Safari */
        transform: stranslate(0,10px); /* 标准语法 */
    }
}

@-webkit-keyframes fadeInUpLeft /* Safari 与 Chrome */
{
    from {
        opacity:0;
        -webkit-transform: translate(-1000px,1000px); /* Safari */
        transform: stranslate(-1000px,1000px); /* 标准语法 */
    }
    to {
        opacity:1;
        -webkit-transform: translate(0,10px); /* Safari */
        transform: stranslate(0,10px); /* 标准语法 */
    }
}
/*从右到左进入*/
@keyframes fadeInRight
{
    from {
        opacity: 0;
        -webkit-transform: translate(1000px,0);
        transform: stranslate(1000px,0);
    }
    to {
        opacity:1;
        -webkit-transform: translate(10px,0);
        transform: stranslate(10px,0);
    }
}

@-webkit-keyframes fadeInRight
{
    from {
        opacity:0;
        -webkit-transform: translate(1000px,0);
        transform: stranslate(1000px,0);
    }
    to {
        opacity:1;
        -webkit-transform: translate(10px,0);
        transform: stranslate(10px,0);
    }
}
/*从左到右进入*/
@keyframes fadeInLeft
{
    from {
        opacity: 0;
        -webkit-transform: translate(-1000px,0);
        transform: stranslate(-1000px,0);
    }
    to {
        opacity:1;
        -webkit-transform: translate(10px,0);
        transform: stranslate(10px,0);
    }
}

@-webkit-keyframes fadeInLeft
{
    from {
        opacity:0;
        -webkit-transform: translate(-1000px,0);
        transform: stranslate(-1000px,0);
    }
    to {
        opacity:1;
        -webkit-transform: translate(10px,0);
        transform: stranslate(10px,0);
    }
}

/*绕中心旋转*/
@keyframes coreRotate {
    5% {
        transform:rotate(5deg);
        -ms-transform:rotate(5deg); /* IE 9 */
        -webkit-transform:rotate(5deg); /* Safari and Chrome */
    }
    30% {
        transform:rotate(-5deg);
        -ms-transform:rotate(-5deg);
        -webkit-transform:rotate(-5deg);
    }
    60% {
        transform:rotate(5deg);
        -ms-transform:rotate(5deg);
        -webkit-transform:rotate(5deg);
    }
    90% {
        transform:rotate(-5deg);
        -ms-transform:rotate(-5deg);
        -webkit-transform:rotate(-5deg);
    }
}
@-webkit-keyframes coreRotate {
    5% {
        transform:rotate(5deg);
        -ms-transform:rotate(5deg); /* IE 9 */
        -webkit-transform:rotate(5deg); /* Safari and Chrome */
    }
    30% {
        transform:rotate(-5deg);
        -ms-transform:rotate(-5deg);
        -webkit-transform:rotate(-5deg);
    }
    60% {
        transform:rotate(5deg);
        -ms-transform:rotate(5deg);
        -webkit-transform:rotate(5deg);
    }
    90% {
        transform:rotate(-5deg);
        -ms-transform:rotate(-5deg);
        -webkit-transform:rotate(-5deg);
    }
}
/*动画-end*/