@charset "utf-8";
@media screen and (min-width: 1182px) {
/*大屏浏览器*/
#index-banner{ clear:both;float:none;height:622px;width:100%;min-width:1220px;background-repeat:no-repeat;background-position:center top;background-color:#e4e4e4;z-index:1}
#index-banner .right-red{clear:both;float:none;height:0;max-width:1652px;min-width:1200px;position:relative;margin-right:auto;margin-left:auto;padding-right:10px;padding-left:10px;z-index:5}

#index-banner .allproclassbox{clear:both;float:none;height:0;min-width:1200px;max-width:1652px;position:relative;margin-right:auto;margin-left:auto;padding-right:10px;padding-left:10px;z-index:6}
#index-banner .allproclassbox .content{width:250px;position:absolute;top:140px;left:10px;height:482px;overflow:hidden;z-index:5}
#index-banner .allproclassbox .content .box{background-color:#FFF;width:250px;position:absolute;left:0;height:500px;box-sizing:border-box;-moz-box-shadow:0 0 6px rgba(0,0,0,.1);-webkit-box-shadow:0 0 6px rgba(0,0,0,.1);box-shadow:0 0 6px rgba(0,0,0,.1)}
#index-banner .allproclassbox .content .box dl{margin:0;padding:0}
#index-banner .allproclassbox .content .box .phone-head{ display:none;}
#index-banner .allproclassbox .content .box dl dd a{font-size:12px;white-space:nowrap;display:inline-block;margin-right:12px;margin-bottom:8px;color:#666}
#index-banner .allproclassbox .content .box dl dt a{text-decoration:none;display:block;padding-top:10px;padding-right:20px;padding-bottom:10px;padding-left:20px; font-size:14px;color:#000}
#index-banner .allproclassbox .content .box dl:hover dt a{color:#728ddc}
#index-banner .allproclassbox .content .box dl:hover dt a:before{margin-left:4px}
#index-banner .allproclassbox .content .box dl dt a:before{font-family:iconfont;font-size:18px;vertical-align:middle;font-weight:400;margin-right:5px;-o-transition:all .3s;-moz-transition:all .3s;-webkit-transition:all .3s;-ms-transition:all .3s;transition:all .3s}
#index-banner .allproclassbox .content .box dl.c1 dt a:before{content:"\e719"}
#index-banner .allproclassbox .content .box dl.c2 dt a:before{content:"\e6af"}
#index-banner .allproclassbox .content .box dl.c3 dt a:before{content:"\e601"}
#index-banner .allproclassbox .content .box dl.c4 dt a:before{content:"\e62a"}
#index-banner .allproclassbox .content .box dl.c5 dt a:before{content:"\e6a4"}
#index-banner .allproclassbox .content .box dl.c6 dt a:before{content:"\e6af"}
#index-banner .allproclassbox .content .box dl.c7 dt a:before{content:"\e618"}
#index-banner .allproclassbox .content .box dl.c8 dt a:before{content:"\e63f"}
#index-banner .allproclassbox .content .box dl.c9 dt a:before{content:"\e607"}

#index-banner .right-red .box{width:320px;position:absolute;top:140px;right:10px;height:482px;overflow:hidden;z-index:5}
#index-banner .right-red .box ul li{background-color:#FFF;height:210px;width:320px;margin-top:20px;overflow:hidden;-moz-box-shadow:0 0 6px rgba(0,0,0,.05);-webkit-box-shadow:0 0 6px rgba(0,0,0,.05);box-shadow:0 0 6px rgba(0,0,0,.05)}
#index-banner .right-red .box ul li img{-o-transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;-ms-transition:all .5s;transition:all .5s;height:100%;width:100%}
#index-banner .right-red .box ul li:hover img{transform:scale(1.05)}
#index-banner .indexbanner .swiper-slide{height:622px;width:100%;overflow:hidden;background-size:auto 100%;background-repeat:no-repeat;background-position:center center;padding-top:140px;box-sizing:border-box}
#index-banner .indexbanner .swiper-pagination-bullet{height:8px;width:30px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#index-banner .indexbanner .swiper-pagination-white .swiper-pagination-bullet-active{background:rgba(255,255,255,.4)}
#index-banner .indexbanner .swiper-slide .slidecon{max-width:1652px;margin-right:auto;margin-left:auto;padding-right:342px;padding-left:280px;box-sizing:border-box;position:relative}
#index-banner .indexbanner .swiper-slide-active .t1{animation:t1 2s;-moz-animation:t1 2s;-webkit-animation:t1 2s;-o-animation:t1 2s}
@keyframes t1{0%{opacity:0;top:100px}
100%{opacity:1;top:120px}
}
#index-banner .indexbanner .swiper-slide-active .t2{animation:t2 2s;-moz-animation:t2 2s;-webkit-animation:t2 2s;-o-animation:t2 2s}
@keyframes t2{30%{opacity:0;top:160px}
100%{opacity:1;top:200px}
}
#index-banner .indexbanner .swiper-slide-active .t3{animation:t3 2s;-moz-animation:t3 2s;-webkit-animation:t3 2s;-o-animation:t3 2s}
@keyframes t3{60%{opacity:0;top:360px}
100%{opacity:1;top:320px}
}
#index-banner .indexbanner .swiper-slide-active .t4{animation:t4 2s;-moz-animation:t4 2s;-webkit-animation:t4 2s;-o-animation:t4 2s}
@keyframes t4{60%{opacity:0;top:10px}
100%{opacity:1;top:0}
}
#index-banner .indexbanner .swiper-slide .slidecon .t1{font-size:42px;color:#FFF;font-weight:700;position:absolute;top:120px;font-family:"微软雅黑";z-index:2}
#index-banner .indexbanner .swiper-slide .slidecon .t2{font-size:22px;line-height:34px;color:#FFF;position:absolute;top:200px;max-width:40%;z-index:3}
#index-banner .indexbanner .swiper-slide .slidecon .t3{position:absolute;top:320px;z-index:4}
#index-banner .indexbanner .swiper-slide .slidecon .t3 a{font-size:18px;color:#FFF;display:inline-block;padding-top:8px;padding-right:20px;padding-bottom:8px;padding-left:20px;border:1px solid #FFF;text-decoration:none;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#index-banner .indexbanner .swiper-slide .slidecon .t4{z-index:1;height:482px;position:absolute;top:0;right:340px}
#index-banner .indexbanner .swiper-slide .slidecon .t4 span{height:482px;display:table-cell;vertical-align:middle;text-align:center}
}
@media screen and (min-width: 992px) and (max-width: 1181px) {
/*小屏浏览器*/
#index-banner{max-width:1180px;min-width:992px;}
#index-banner .right-red{ display:none;}
#index-banner .allproclassbox{clear:both;float:none;height:0;max-width:1180px;min-width:992px;position:relative;margin-right:auto;margin-left:auto;padding-left:10px;z-index:6}
#index-banner .allproclassbox .content{width:220px;position:absolute;top:140px;left:10px;height:482px;overflow:hidden;z-index:5}
#index-banner .allproclassbox .content .box{background-color:#FFF;width:220px;position:absolute;left:0;height:500px;box-sizing:border-box;-moz-box-shadow:0 0 6px rgba(0,0,0,.1);-webkit-box-shadow:0 0 6px rgba(0,0,0,.1);box-shadow:0 0 6px rgba(0,0,0,.1)}
#index-banner .allproclassbox .content .box dl{margin:0;padding:0}
#index-banner .allproclassbox .content .box .phone-head{ display:none;}
#index-banner .allproclassbox .content .box dl dd a{font-size:12px;white-space:nowrap;display:inline-block;margin-right:12px;margin-bottom:8px;color:#666}
#index-banner .allproclassbox .content .box dl dt a{text-decoration:none;display:block;padding-top:10px;padding-right:20px;padding-bottom:10px;padding-left:20px; font-size:12px;color:#000}
#index-banner .allproclassbox .content .box dl:hover dt a{color:#728ddc}
#index-banner .allproclassbox .content .box dl:hover dt a:before{margin-left:4px}
#index-banner .allproclassbox .content .box dl dt a:before{font-family:iconfont;font-size:18px;vertical-align:middle;font-weight:400;margin-right:5px;-o-transition:all .3s;-moz-transition:all .3s;-webkit-transition:all .3s;-ms-transition:all .3s;transition:all .3s}
#index-banner .allproclassbox .content .box dl.c1 dt a:before{content:"\e719"}
#index-banner .allproclassbox .content .box dl.c2 dt a:before{content:"\e6af"}
#index-banner .allproclassbox .content .box dl.c3 dt a:before{content:"\e601"}
#index-banner .allproclassbox .content .box dl.c4 dt a:before{content:"\e62a"}
#index-banner .allproclassbox .content .box dl.c5 dt a:before{content:"\e6a4"}
#index-banner .allproclassbox .content .box dl.c6 dt a:before{content:"\e6af"}
#index-banner .allproclassbox .content .box dl.c7 dt a:before{content:"\e618"}
#index-banner .allproclassbox .content .box dl.c8 dt a:before{content:"\e63f"}
#index-banner .allproclassbox .content .box dl.c9 dt a:before{content:"\e607"}

#index-banner .indexbanner .swiper-slide .slidecon {max-width: 1180px;padding-right: 10px;padding-left: 290px;}
#index-banner .indexbanner .swiper-slide .slidecon .t4 {right: 30px;}
#index-banner{ clear:both;float:none;height:622px;width:100%;background-repeat:no-repeat;background-position:center top;background-color:#e4e4e4;z-index:1}
#index-banner .right-red{clear:both;float:none;height:0;max-width:1652px;min-width:1200px;position:relative;margin-right:auto;margin-left:auto;padding-right:10px;padding-left:10px;z-index:5}
#index-banner .right-red .box{width:320px;position:absolute;top:140px;right:10px;height:482px;overflow:hidden;z-index:5}
#index-banner .right-red .box ul li{background-color:#FFF;height:210px;width:320px;margin-top:20px;overflow:hidden;-moz-box-shadow:0 0 6px rgba(0,0,0,.05);-webkit-box-shadow:0 0 6px rgba(0,0,0,.05);box-shadow:0 0 6px rgba(0,0,0,.05)}
#index-banner .right-red .box ul li img{-o-transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;-ms-transition:all .5s;transition:all .5s;height:100%;width:100%}
#index-banner .right-red .box ul li:hover img{transform:scale(1.05)}
#index-banner .indexbanner .swiper-slide{height:622px;width:100%;overflow:hidden;background-size:auto 100%;background-repeat:no-repeat;background-position:center center;padding-top:140px;box-sizing:border-box}
#index-banner .indexbanner .swiper-pagination-bullet{height:8px;width:30px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#index-banner .indexbanner .swiper-pagination-white .swiper-pagination-bullet-active{background:rgba(255,255,255,.4)}
#index-banner .indexbanner .swiper-slide .slidecon{max-width:1181px;margin-right:auto;margin-left:auto;padding-right:342px;padding-left:260px;box-sizing:border-box;position:relative}
#index-banner .indexbanner .swiper-slide-active .t1{animation:t1 2s;-moz-animation:t1 2s;-webkit-animation:t1 2s;-o-animation:t1 2s}
@keyframes t1{0%{opacity:0;top:100px}
100%{opacity:1;top:120px}
}
#index-banner .indexbanner .swiper-slide-active .t2{animation:t2 2s;-moz-animation:t2 2s;-webkit-animation:t2 2s;-o-animation:t2 2s}
@keyframes t2{30%{opacity:0;top:160px}
100%{opacity:1;top:200px}
}
#index-banner .indexbanner .swiper-slide-active .t3{animation:t3 2s;-moz-animation:t3 2s;-webkit-animation:t3 2s;-o-animation:t3 2s}
@keyframes t3{60%{opacity:0;top:360px}
100%{opacity:1;top:320px}
}
#index-banner .indexbanner .swiper-slide-active .t4{animation:t4 2s;-moz-animation:t4 2s;-webkit-animation:t4 2s;-o-animation:t4 2s}
@keyframes t4{60%{opacity:0;top:10px}
100%{opacity:1;top:0}
}
#index-banner .indexbanner .swiper-slide .slidecon .t1{font-size:42px;color:#FFF;font-weight:700;position:absolute;top:120px;font-family:"微软雅黑";z-index:2}
#index-banner .indexbanner .swiper-slide .slidecon .t2{font-size:22px;line-height:34px;color:#FFF;position:absolute;top:200px;max-width:40%;z-index:3}
#index-banner .indexbanner .swiper-slide .slidecon .t3{position:absolute;top:320px;z-index:4}
#index-banner .indexbanner .swiper-slide .slidecon .t3 a{font-size:18px;color:#FFF;display:inline-block;padding-top:8px;padding-right:20px;padding-bottom:8px;padding-left:20px;border:1px solid #FFF;text-decoration:none;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#index-banner .indexbanner .swiper-slide .slidecon .t4{z-index:1;height:482px;position:absolute;top:0;right:10px;}
#index-banner .indexbanner .swiper-slide .slidecon .t4 span{height:482px;display:table-cell;vertical-align:middle;text-align:center}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
/*IPAD、移动端大屏、平板*/
#index-banner{ clear:both;float:none;height:5rem;width:100%;width:100%;background-repeat:no-repeat;background-position:center top;background-color:#e4e4e4;z-index:1}
#index-banner .right-red{display: none;}
#index-banner .allproclassbox{display: none;}
#index-banner .indexbanner .swiper-slide{height:5rem;width:100%;overflow:hidden;background-size:auto 100%;background-repeat:no-repeat;background-position:center center;padding-top:1.5rem;box-sizing:border-box}
#index-banner .indexbanner .swiper-pagination-bullet{height:8px;width:30px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#index-banner .indexbanner .swiper-pagination-white .swiper-pagination-bullet-active{background:rgba(255,255,255,.4)}
#index-banner .indexbanner .swiper-slide .slidecon{width:100%;margin-right:auto;margin-left:auto;padding-right:0.4rem;padding-left:0.4rem;box-sizing:border-box;position:relative}
#index-banner .indexbanner .swiper-slide-active .t1{animation:t1 2s;-moz-animation:t1 2s;-webkit-animation:t1 2s;-o-animation:t1 2s}
@keyframes t1{0%{opacity:0;top:0.4rem}
100%{opacity:1;top:0.6rem}
}
#index-banner .indexbanner .swiper-slide-active .t2{animation:t2 2s;-moz-animation:t2 2s;-webkit-animation:t2 2s;-o-animation:t2 2s}
@keyframes t2{30%{opacity:0;top:1rem}
100%{opacity:1;top:1.2rem}
}
#index-banner .indexbanner .swiper-slide-active .t3{animation:t3 2s;-moz-animation:t3 2s;-webkit-animation:t3 2s;-o-animation:t3 2s}
@keyframes t3{60%{opacity:0;top:2.6rem}
100%{opacity:1;top:2.2rem}
}
#index-banner .indexbanner .swiper-slide-active .t4{animation:t4 2s;-moz-animation:t4 2s;-webkit-animation:t4 2s;-o-animation:t4 2s}
@keyframes t4{60%{opacity:0;top:0.4rem}
100%{opacity:1;top:-0.2rem}
}
#index-banner .indexbanner .swiper-slide .slidecon .t1{font-size:0.36rem;color:#FFF;font-weight:700;position:absolute;top:0.6rem;font-family:"微软雅黑";z-index:2}
#index-banner .indexbanner .swiper-slide .slidecon .t2{font-size:0.2rem;line-height:34px;color:#FFF;position:absolute;top:1.2rem;max-width:70%;z-index:3}
#index-banner .indexbanner .swiper-slide .slidecon .t3{position:absolute;top:2.2rem;z-index:4}
#index-banner .indexbanner .swiper-slide .slidecon .t3 a{font-size:0.2rem;color:#FFF;display:inline-block;padding-top:0.06rem;padding-right:0.22rem;padding-bottom:0.08rem;padding-left:0.22rem;border:1px solid #FFF;text-decoration:none;-moz-border-radius:0.04rem;-webkit-border-radius:0.04rem;border-radius:0.04rem}
#index-banner .indexbanner .swiper-slide .slidecon .t4{z-index:1;height:3.8rem;position:absolute;top:-0.2rem;right:0px;}
#index-banner .indexbanner .swiper-slide .slidecon .t4 span{height:3.8rem;display:table-cell;vertical-align:middle;text-align:center}
#index-banner .indexbanner .swiper-slide .slidecon .t4 span img{max-height:3.8rem;}
}
@media screen and (max-width: 767px) {
/*手机端*/
#index-banner{ clear:both;float:none;height:5rem;width:100%;width:100%;background-repeat:no-repeat;background-position:center top;background-color:#e4e4e4;z-index:1}
#index-banner .right-red{display: none;}
#index-banner .allproclassbox{display: none;}
#index-banner .indexbanner .swiper-slide{height:5rem;width:100%;overflow:hidden;background-size:auto 100%;background-repeat:no-repeat;background-position:center center;padding-top:0.8rem;box-sizing:border-box}
#index-banner .indexbanner .swiper-pagination-bullet{height:0.12rem;width:0.36rem;-moz-border-radius:0.04rem;-webkit-border-radius:0.04rem;border-radius:0.04rem}
#index-banner .indexbanner .swiper-pagination-white .swiper-pagination-bullet-active{background:rgba(255,255,255,.4)}
#index-banner .indexbanner .swiper-slide .slidecon{ width:100%; height:100%;text-align: center;margin-right:auto;margin-left:auto;box-sizing:border-box;position:relative}
#index-banner .indexbanner .swiper-slide-active .t1{animation:t1 2s;-moz-animation:t1 2s;-webkit-animation:t1 2s;-o-animation:t1 2s}
@keyframes t1{0%{opacity:0;top:0rem}
100%{opacity:1;top:0.6rem}
}
#index-banner .indexbanner .swiper-slide-active .t2{animation:t2 2s;-moz-animation:t2 2s;-webkit-animation:t2 2s;-o-animation:t2 2s}
@keyframes t2{30%{opacity:0;top:1rem}
100%{opacity:1;top:1.2rem}
}
#index-banner .indexbanner .swiper-slide-active .t3{animation:t3 2s;-moz-animation:t3 2s;-webkit-animation:t3 2s;-o-animation:t3 2s}
@keyframes t3{60%{opacity:0;top:3rem}
100%{opacity:1;top:2.4rem}
}
#index-banner .indexbanner .swiper-slide-active .t4{animation:t4 3s;-moz-animation:t4 3s;-webkit-animation:t4 3s;-o-animation:t4 3s}
@keyframes t4{80%{opacity:0;bottom:-4.4rem}
100%{opacity:1;bottom:-1rem}
}
#index-banner .indexbanner .swiper-slide .slidecon .t1{padding-right:0.2rem;padding-left:0.2rem;font-size:0.36rem;color:#FFF;font-weight:700;position:absolute; left:0px; right:0px;top:0.6rem;font-family:"微软雅黑";z-index:2}
#index-banner .indexbanner .swiper-slide .slidecon .t2{padding-right:0.2rem;padding-left:0.2rem;box-sizing:border-box;font-size:0.22rem;line-height:0.34rem;color:#FFF;position:absolute;left:0px; right:0px;top:1.2rem;z-index:3}
#index-banner .indexbanner .swiper-slide .slidecon .t3{padding-right:0.2rem;padding-left:0.2rem;box-sizing:border-box;position:absolute;top:2.4rem;left:0px; right:0px;z-index:4}
#index-banner .indexbanner .swiper-slide .slidecon .t3 a{font-size:0.25rem;color:#FFF;display:inline-block;padding-top:0.12rem; width:2rem;padding-bottom:0.12rem;border:1px solid #FFF;text-decoration:none;-moz-border-radius:0.04rem;-webkit-border-radius:0.04rem;border-radius:0.04rem}
#index-banner .indexbanner .swiper-slide .slidecon .t4{z-index:1;position:absolute;bottom:-1rem; left:0px;right:0px; width:100%;}
#index-banner .indexbanner .swiper-slide .slidecon .t4 span img{ width:80%;}
#index-banner .indexbanner .swiper-slide .slidecon .t1.xd{font-weight: normal;font-size:0.42rem;}
#index-banner .indexbanner .swiper-slide .slidecon .t2.xz{padding-right:0.8rem;padding-left:0.8rem;}
}