/*banner*/




@keyframes fadeOfOpacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}


.indexPart1{ overflow: hidden; padding-bottom: 3.5rem; position: relative;}
.indexPart1:after{ content: ''; position: absolute; right: 0; bottom: 0; width: 63.5%; height: 100%; background: #f7f7fa; }
.indexPart1 .leftDiv{ width: 5.3rem; padding-top: 1.4rem; position: relative; z-index: 1;}
.indexPart1 .txt{ font-size: 0.24rem; line-height: 0.24rem; color: #8c94a3; position: relative; padding-left: 0.7rem; font-weight: bold;}
.indexPart1 .txt:before{ content: ''; position: absolute; left: 0; top: 50%; margin-top: -2px; width: 50px; height: 3px; background: #11a84e; }
.indexPart1 .wen{ padding-top: 0.35rem; font-size: 0.32rem; line-height: 0.6rem; color: #191c22; font-weight: bold; }
.indexPart1 .content{ font-size: 16px; color: #3f4150; line-height: 30px; padding-bottom: 0.6rem;}
.indexPart1 .btnDiv{ padding-top: 0.75rem; }
.indexPart1 .btnDiv a{ display: block; width: 128px; height: 45px; border: #666 solid 1px; line-height: 45px; color: #666; font-size: 14px; text-align: center; }
.indexPart1 .btnDiv a:hover{ border: #11a84e solid 1px; background: #11a84e; color: #fff; }
.indexPart1 .rightDiv{ width: 8.9rem; padding-top: 0.95rem; position: relative; z-index: 1;}
.indexPart1 .numList ul{ display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.indexPart1 .numList li p{ font-size: 14px; color: #666; padding-bottom: 0.2rem; }
.indexPart1 .numList li .num{ font-size: 24px; color: #222222; }
.indexPart1 .numList li .numUp{ font-family:mont; font-size: 0.48rem; line-height: 0.48rem; padding-right: 0.1rem; }
.indexPart1 .botList{ position: absolute; z-index: 1; left: 50%; bottom: 1rem; margin-left: -7.68rem; width: 15.36rem; height: 1.86rem; background: #fff; box-shadow: 0px 3px 60px 0px rgba(0, 0, 0, 0.04); }
.indexPart1 .botList li{ float: left; width: 20%; height: 1.86rem; overflow: hidden; position: relative; cursor: pointer;}
.indexPart1 .botList li:after{ content: ''; position: absolute; right: 0; width: 1px; height: 1.26rem; top: 50%; margin-top: -0.63rem; background: #f1f2f5; z-index: 1; }
.indexPart1 .botList li:last-child:after{ display: none; }
.indexPart1 .botList li .ico{ padding-top: 0.32rem; text-align: center; }
.indexPart1 .botList li .name{ font-size: 0.3rem; color: #222; line-height: 0.3rem; padding-top: 0.15rem; text-align: center; font-weight: bold; }
.indexPart1 .botList li .after{ opacity: 0; position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0 0.42rem 0 0.25rem; box-sizing: border-box; background: #4f81bd; z-index: 2; }
.indexPart1 .botList li .name2{ padding: 0.32rem 0 0.15rem; font-weight: bold; font-size: 0.3rem; color: #fff; line-height: 0.3rem; }
.indexPart1 .botList li .msg{ font-size: 14px; line-height: 24px; height: 72px; color: #fff; position: relative; }
.indexPart1 .botList li .msg:after{ content: ''; position: absolute; right: 0; bottom: 0; width: 17px; height: 7px; background: url(../image/nimg17_1on.png) center no-repeat; }
.indexPart1 .botList li:hover .before{ opacity: 0; }
.indexPart1 .botList li:hover .after{ opacity: 1; }
.indexPart1 .botList li:hover .name2{ opacity: 1;  -webkit-animation: am_top 0.6s ease-in-out 0.3s backwards;}
.indexPart1 .botList li:hover .msg{ opacity: 1; -webkit-animation: am_top 0.8s ease-in-out 0.8s backwards;}

@-webkit-keyframes am_top
{
    0%{ -webkit-transform:translate(0,50px);opacity:0}
    100%{ -webkit-transform:translate(0,0px);opacity:1}
}

@-webkit-keyframes am_left
{
    0%{ -webkit-transform:translate(-50px,0);opacity:0}
    100%{ -webkit-transform:translate(0,0px);opacity:1}
}
.msgData .swiper-slide{ background:#f7f7f7; height:2.5rem;}
.msgData .swiper-slide .ico{ padding:0.45rem 0 0.2rem; text-align:center;}
.msgData .swiper-slide .ico img{ width:0.86rem;}
.msgData .swiper-slide .name{ font-size: 0.32rem;  line-height:0.42rem;color:#191c22; text-align:center;}
.msgData .swiper-pagination{ position: relative; bottom: 0; padding-top: 0.6rem; }
.msgData .swiper-pagination-bullet { position: relative; width: 0.2rem; height: 0.2rem; opacity: 1; box-sizing: border-box; background: #eee; } 
.msgData .swiper-pagination-bullet-active { background: #11a84e; }


@-webkit-keyframes warn{
0%{-webkit-transform:scale(0.8);transform:scale(0.8);opacity:1}
50%{-webkit-transform:scale(1);transform:scale(1);opacity:1}
100%{-webkit-transform:scale(0.8);transform:scale(0.8);opacity:1}
}
@-moz-keyframes warn{
0%{-webkit-transform:scale(0.8);transform:scale(0.8);opacity:1}
50%{-webkit-transform:scale(1);transform:scale(1);opacity:1}
100%{-webkit-transform:scale(0.8);transform:scale(0.8);opacity:1}
}
@-o-keyframes warn{
0%{-webkit-transform:scale(0.8);transform:scale(0.8);opacity:1}
50%{-webkit-transform:scale(1);transform:scale(1);opacity:1}
100%{-webkit-transform:scale(0.8);transform:scale(0.8);opacity:1}
}
@keyframes warn{
0%{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8);opacity:1}
50%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:1}
100%{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8);opacity:1}
}

















