.banner {  height: auto;  }

.banner1 {
    position:relative;
    background:url("../images/wechat/index/banner/bannerbg.png") no-repeat center;
    width:100%;
    height:500px
}
#banner1-1 {
    position:absolute;
    animation-delay:0.1s;
    -moz-animation-delay:0.1s;
    -webkit-animation-delay:0.1s;
    -ms-animation-delay:0.1s;
    -o-animation-delay:0.1s;
    top:0;
    left:160px
}
#banner1-2 {
    position:absolute;
    animation-delay:0.2s;
    -moz-animation-delay:0.2s;
    -webkit-animation-delay:0.2s;
    -ms-animation-delay:0.2s;
    -o-animation-delay:0.2s;
    left:130px;
    bottom:0
}
#banner1-3 {
    position:absolute;
    animation-delay:0.2s;
    -moz-animation-delay:0.2s;
    -webkit-animation-delay:0.2s;
    -ms-animation-delay:0.2s;
    -o-animation-delay:0.2s;
    top:50%;
    left:13px
}
#banner1-4 {
    position:absolute;
    animation-delay:0.3s;
    -moz-animation-delay:0.3s;
    -webkit-animation-delay:0.3s;
    -ms-animation-delay:0.3s;
    -o-animation-delay:0.3s;
    top:-20px;
    left:-100px
}
#banner1-5 {
    position:absolute;
    animation-delay:0.4s;
    -moz-animation-delay:0.4s;
    -webkit-animation-delay:0.4s;
    -ms-animation-delay:0.4s;
    -o-animation-delay:0.4s;
    left:-100px;
    bottom:0
}
#banner1-6 {
    position:absolute;
    animation-delay:0.5s;
    -moz-animation-delay:0.5s;
    -webkit-animation-delay:0.5s;
    -ms-animation-delay:0.5s;
    -o-animation-delay:0.5s;
    top:0;
    right:-153px
}
#banner1-7 {
    position:absolute;
    animation-delay:0.6s;
    -moz-animation-delay:0.6s;
    -webkit-animation-delay:0.6s;
    -ms-animation-delay:0.6s;
    -o-animation-delay:0.6s;
    right:-196px;
    bottom:0
}
#banner1-dn {
    position:absolute;
    animation-delay:0.7s;
    -moz-animation-delay:0.7s;
    -webkit-animation-delay:0.7s;
    -ms-animation-delay:0.7s;
    -o-animation-delay:0.7s;
    top:160px;
    left:163px;
    z-index:8
}
#banner1-sj {
    position:absolute;
    animation-delay:0.8s;
    -moz-animation-delay:0.8s;
    -webkit-animation-delay:0.8s;
    -ms-animation-delay:0.8s;
    -o-animation-delay:0.8s;
    top:245px;
    left:437px;
    z-index:8
}
#banner1-8 {
    position:absolute;
    animation-delay:1.1s;
    -moz-animation-delay:1.1s;
    -webkit-animation-delay:1.1s;
    -ms-animation-delay:1.1s;
    -o-animation-delay:1.1s;
    top:410px;
    left:206px
}
#banner1-9 {
    position:absolute;
    animation-delay:1.9s;
    -moz-animation-delay:1.9s;
    -webkit-animation-delay:1.9s;
    -ms-animation-delay:1.9s;
    -o-animation-delay:1.9s;
    top:251px;
    left:18px
}
#banner1-10 {
    position:absolute;
    animation-delay:2s;
    -moz-animation-delay:2s;
    -webkit-animation-delay:2s;
    -ms-animation-delay:2s;
    -o-animation-delay:2s;
    top:171px;
    left:75px
}
#banner1-11 {
    position:absolute;
    animation-delay:2.1s;
    -moz-animation-delay:2.1s;
    -webkit-animation-delay:2.1s;
    -ms-animation-delay:2.1s;
    -o-animation-delay:2.1s;
    top:76px;
    left:93px
}
#banner1-12 {
    position:absolute;
    animation-delay:2.2s;
    -moz-animation-delay:2.2s;
    -webkit-animation-delay:2.2s;
    -ms-animation-delay:2.2s;
    -o-animation-delay:2.2s;
    top:86px;
    left:215px
}
#banner1-13 {
    position:absolute;
    animation-delay:1.9s;
    -moz-animation-delay:1.9s;
    -webkit-animation-delay:1.9s;
    -ms-animation-delay:1.9s;
    -o-animation-delay:1.9s;
    top:28px;
    left:340px
}
#banner1-14 {
    position:absolute;
    animation-delay:2s;
    -moz-animation-delay:2s;
    -webkit-animation-delay:2s;
    -ms-animation-delay:2s;
    -o-animation-delay:2s;
    top:86px;
    left:461px
}
#banner1-15 {
    position:absolute;
    animation-delay:2.1s;
    -moz-animation-delay:2.1s;
    -webkit-animation-delay:2.1s;
    -ms-animation-delay:2.1s;
    -o-animation-delay:2.1s;
    top:117px;
    left:495px
}
#banner1-16 {
    position:absolute;
    animation-delay:2.2s;
    -moz-animation-delay:2.2s;
    -webkit-animation-delay:2.2s;
    -ms-animation-delay:2.2s;
    -o-animation-delay:2.2s;
    top:196px;
    left:533px
}
#banner1-17 {
    position:absolute;
    animation-delay:2.3s;
    -moz-animation-delay:2.3s;
    -webkit-animation-delay:2.3s;
    -ms-animation-delay:2.3s;
    -o-animation-delay:2.3s;
    top:118px;
    left:563px
}
#banner1-18 {
    position:absolute;
    animation-delay:2.4s;
    -moz-animation-delay:2.4s;
    -webkit-animation-delay:2.4s;
    -ms-animation-delay:2.4s;
    -o-animation-delay:2.4s;
    top:266px;
    left:587px
}
#banner1-19 {
    position:absolute;
    animation-delay:2.5s;
    -moz-animation-delay:2.5s;
    -webkit-animation-delay:2.5s;
    -ms-animation-delay:2.5s;
    -o-animation-delay:2.5s;
    top:161px;
    left:610px
}
#banner-versions {
    position:absolute;
    animation-delay:0.5s;
    -moz-animation-delay:0.5s;
    -webkit-animation-delay:0.5s;
    -ms-animation-delay:0.5s;
    -o-animation-delay:0.5s;
    font-size:18px;
    color:#fff;
    top:109px;
    left:703px
}
#banner-speciality {
    position:absolute;
    animation-delay:0.5s;
    -moz-animation-delay:0.5s;
    -webkit-animation-delay:0.5s;
    -ms-animation-delay:0.5s;
    -o-animation-delay:0.5s;
    font-size:32px;
    color:#fff;
    top:160px;
    left:703px
}
#banner-frame {
    position:absolute;
    animation-delay:0.5s;
    -moz-animation-delay:0.5s;
    -webkit-animation-delay:0.5s;
    -ms-animation-delay:0.5s;
    -o-animation-delay:0.5s;
    font-size:16px;
    color:#fff;
    top:230px;
    left:703px
}
svg {
    width:1200px;
    height:495px
}
#svg_1 {
    position:absolute;
    stroke-dasharray:900,900;
    stroke-dashoffset:900;
    animation:dash 3s;
    animation-iteration-count:1;
    animation-delay:1.6s;
    animation-fill-mode:forwards;
    -ms-stroke-dasharray:0;
    -ms-stroke-dashoffset:0;
    -o-stroke-dasharray:900,900;
    -o-stroke-dashoffset:900;
    -o-animation:dash 3s;
    -o-animation-iteration-count:1;
    -o-animation-delay:1.6s;
    -o-animation-fill-mode:forwards;
    -webkit-stroke-dasharray:900,900;
    -webkit-stroke-dashoffset:900;
    -webkit-animation:dash 3s;
    -webkit-animation-iteration-count:1;
    -webkit-animation-delay:1.6s;
    -webkit-animation-fill-mode:forwards;
    top:-60px;
    left:-200px;
    z-index:5
}
#svg_ie {
    position:absolute;
    animation-delay:1.6s;
    -moz-animation-delay:1.6s;
    -webkit-animation-delay:1.6s;
    -ms-animation-delay:1.6s;
    -o-animation-delay:1.6s;
    position:absolute;
    top:-60px;
    left:-200px;
    z-index:5
}
@-webkit-keyframes dash {
    from {
        stroke-dashoffset:900
    }
    to {
        stroke-dashoffset:0
    }
}@-ms-keyframes dash {
    from {
        stroke-dashoffset:900
    }
    to {
        stroke-dashoffset:0
    }
}@-o-keyframes dash {
    from {
        stroke-dashoffset:900
    }
    to {
        stroke-dashoffset:0
    }
}@keyframes dash {
    to {
        stroke-dashoffset:0
    }
}.free-down {
    position:absolute;
    top:320px;
    left:703px;
    z-index:8
}
.banner-left {
    position:absolute;
    top:25%;
    left:0;
    opacity:0;
    z-index:9
}
.banner:hover .banner-left {
    opacity:1
}
.banner:hover .banner-right {
    opacity:1
}
.banner-right {
    position:absolute;
    top:25%;
    right:0;
    opacity:0;
    z-index:9
}