

.bannerslick .slick-dots {
    position: absolute;
    overflow: hidden;
    bottom: 39px;
    right: 104px;
    margin: 0 -14px;
}

.bannerslick .slick-dots li {
    cursor: pointer;
    float: left;
    margin: 0 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 37px;
    height: 37px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: rgba(255, 255, 255, .5);
}
.bannerslick .slick-dots li button{
    outline: none;
    background: none;
    color: #000;
    font-size: 18px;
    font-weight: bold;
    border: 0;
}
.bannerslick .slick-dots .slick-active {
   background: rgba(27, 112, 64, .5);
}
.bannerslick .slick-dots .slick-active button{
    color: #fff;
}
.bannerslick{
    position: relative;
}
.bannerslick .pic img{
    display: block;
    width: 100%;
}
.ani{position:absolute;width:543px;height:541px;right:100px;bottom:100px;zoom:.7;}
.ani-0{position:relative}
.ani-0 .btn{position:absolute;right:0;bottom:0;width:100px;height:100px;background:url(../images/plus_03.png) center no-repeat}
.ani-0 .btn li{width:23px;height:1px;background-color:#bd326d;position:absolute}
.ani-0 .btn .l1{top:22px;left:38px;transform:rotate(0)}
.ani-0 .btn .l2{top:30px;left:57px;transform:rotate(45deg)}
.ani-0 .btn .l3{top:50px;left:65px;transform:rotate(90deg)}
.ani-0 .btn .l4{position:absolute;top:69px;left:57px;transform:rotate(135deg)}
.ani-0 .btn .l5{top:77px;left:38px;transform:rotate(180deg)}
.ani-0 .btn .l6{top:69px;left:19px;transform:rotate(-135deg)}
.ani-0 .btn .l7{position:absolute;top:50px;left:11px;transform:rotate(-90deg)}
.ani-0 .btn .l8{position:absolute;top:30px;left:19px;transform:rotate(-45deg)}
.wp1.on span{display:block;height:2px;width:0;background-color:#fff;animation:625ms both ani}
.wp1.on .l2 span{animation:625ms 625ms both ani}
.wp1.on .l3 span{animation:625ms 1.25s both ani}
.wp1.on .l4 span{animation:625ms 1.875s both ani}
.wp1.on .l5 span{animation:625ms 2.5s both ani}
.wp1.on .l6 span{animation:625ms 3.125s both ani}
.wp1.on .l7 span{animation:625ms 3.75s both ani}
.wp1.on .l8 span{animation:625ms 4.375s both ani}
@keyframes ani{
0%{width:calc(0%)}
25%{width:calc(25%)}
50%{width:calc(50%)}
75%{width:calc(75%)}
100%{width:calc(100%)}
}
.ani-0 p{font-family:Georgia!important}
.ani-01 p,.ani-03 p{color:#fff}
.banner .item1, .banner .item2,.banner .slick-slide{display:block;background-repeat:no-repeat;background-position:20% 20%;-webkit-background-size:100%;background-size:100%;position:relative;width:100vw;overflow:hidden}
.banner.s1 .ani-01 h3{display:block;opacity:1;font-weight:400;font-size:28px;animation-name:mymove1;animation-duration:2s;}
.banner.s1 .ani-01 h3 a{color:#fff}
.banner.s2 .ani-02 h3 a,.banner.s3 .ani-02 h3 a{color:#000}
.banner .slick-slide img{width: 100%;max-width: none;}
.ss1 .slick-active img{animation-name:bb1;animation-duration:8s;animation-timing-function:linear}
.ss2 .slick-active img{animation-name:bb2;animation-duration:8s;animation-timing-function:linear}
.ss3 .slick-active img{animation-name:bb3;animation-duration:8s;animation-timing-function:linear}

@keyframes bb1{
from{transform:scale(1)}
to{transform:scale(1.2)}
}
@-webkit-keyframes bb1{
from{transform:scale(1)}
to{transform:scale(1.2)}
}
@keyframes bb2{
from{transform:scale(1.2) translate(0,0)}
to{transform:scale(1.2) translate(50px,0)}
}
@-webkit-keyframes bb2{
from{transform:scale(1.2) translate(0,0)}
to{transform:scale(1.2) translate(50px,0)}
}
@keyframes bb3{
from{transform:scale(1.2) translate(0,0)}
to{transform:scale(1.2) translate(0,50px)}
}
@-webkit-keyframes bb3{
from{transform:scale(1.2) translate(0,0)}
to{transform:scale(1.2) translate(0,50px)}
}
@keyframes mymove1{
from{top:50px;opacity:0}
to{top:100px;opacity:1}
}
@-webkit-keyframes mymove1{
from{top:50px;opacity:0}
to{top:100px;opacity:1}
}
.banner.s1 .ani-01 p{font-size:80px;position:absolute;bottom:0;left:-45px}
.banner.s1 .ani-01{background-color:rgba(147,10,65,.8);color:#fff;padding:102px 40px 47px;height:400px;width:400px;transition:.5s ease-in-out;-webkit-transition:.5s ease-in-out}
.banner.s1 .ani-01 .btn{display:block}
.banner.s1 .ani-02{background-color:rgba(229,229,229,1);width:140px;height:140px;position:absolute;right:3px;bottom:140px;transition:.5s ease-in-out;-webkit-transition:.5s ease-in-out}
.ani-02 .btn,.banner.s1 .ani-02 h3{display:none}
.banner.s1 .ani-02 p{font-size:26px;text-align:center;line-height:140px}
.banner.s1 .ani-03{background-color:rgba(206,156,68,1);width:140px;height:140px;position:absolute;right:143px;bottom:1px;transition:.5s ease-in-out;-webkit-transition:.5s ease-in-out}
.ani-03 .btn,.banner.s1 .ani-03 h3{display:none}
.banner.s1 .ani-03 p{font-size:26px;text-align:center;line-height:140px}
.banner.s2 .ani-02{background-color:rgba(229,229,229,.8);padding:102px 40px 47px;height:400px;width:400px;position:absolute;bottom:0;left:140px;transition:.5s ease-in-out;-webkit-transition:.5s ease-in-out}
.banner.s2 .ani-02 h3{display:block;opacity:1;font-weight:400;font-size:28px;animation-name:mymove2;animation-duration:2s;}
@keyframes mymove2{
from{top:50px;opacity:0}
to{top:100px;opacity:1}
}
@-webkit-keyframes mymove2{
from{top:50px;opacity:0}
to{top:100px;opacity:1}
}
.banner.s2 .ani-02 p{font-size:80px;position:absolute;bottom:0;left:-45px}
.banner.s2 .ani-02 .btn{display:block}
.banner.s2 .ani-01 p{font-size:26px;text-align:center;line-height:140px}
.banner.s2 .ani-01 h3{display:none}
.banner.s2 .ani-01{width:140px;height:140px;background-color:#930a41;transition:.5s ease-in-out;-webkit-transition:.5s ease-in-out;position:absolute;top:0;left:140px}
.banner.s2 .ani-01 .btn{display:none}
.banner.s2 .ani-03{background-color:#ce9c44;width:140px;height:140px;position:absolute;transition:.5s ease-in-out;-webkit-transition:.5s ease-in-out;top:140px;left:0}
.ani-03 .btn,.banner.s2 .ani-03 h3{display:none}
.banner.s2 .ani-03 p{font-size:26px;text-align:center;line-height:140px}
.banner.s3 .ani-03{background-color:rgba(206,156,68,.8);padding:102px 40px 47px;height:400px;width:400px;position:absolute;bottom:0;right:140px;transition:.5s ease-in-out;-webkit-transition:.5s ease-in-out}
.banner.s3 .ani-03 h3{display:block;font-weight:400;font-size:28px;animation-name:mymove3;animation-duration:2s;}
.banner.s3 .ani-03 h3 a{color:#fff}
@keyframes mymove3{
from{top:50px;opacity:0}
to{top:100px;opacity:1}
}
@-webkit-keyframes mymove3{
from{top:50px;opacity:0}
to{top:100px;opacity:1}
}
.banner.s3 .ani-03 p{font-size:80px;position:absolute;left:-45px;bottom:45px}
.banner.s3 .ani-03 .btn{display:block}
.banner.s3 .ani-01 p{font-size:26px;text-align:center;line-height:140px}
.banner.s3 .ani-01 h3{display:none}
.banner.s3 .ani-01{width:140px;height:140px;background-color:#930a41;transition:.5s ease-in-out;-webkit-transition:.5s ease-in-out;position:absolute;top:2px;right:140px}
.banner.s3 .ani-01 .btn{display:none}
.banner.s3 .ani-02{background-color:rgba(229,229,229,1);width:140px;height:140px;position:absolute;top:140px;right:0;transition:.5s ease-in-out;-webkit-transition:.5s ease-in-out}
.ani-02 .btn,.banner.s3 .ani-02 h3{display:none}
.banner.s3 .ani-02 p{font-size:26px;text-align:center;line-height:140px}