*{margin:0;padding:0;}
html{color:#fff;}
body{width:100%; margin:0 auto;font-family:"Microsoft YaHei"; line-height: 1.7;}
ol,ul,li{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
img{border:0 none;-ms-interpolation-mode:bicubic;}
.clear,.clearfix{zoom:1;}
.clear:after,.clearfix:after{content:' ';display:block;clear:both;height:0;visibility:hidden;}
.hidden,.hide{display:none;}
.over{ overflow:hidden}
.fl{float: left;}
.fr{float: right;}
a{text-decoration:none; cursor: pointer;}
.fixed{position:fixed;top:0;z-index:99;_position:absolute;_top:expression(documentElement.scrollTop + documentElement.clientHeight-this.offsetHeight);*zoom:1;left: 0; right: 0;}
.navhigh{ width: 100%; display: none;}
.container{ width: 100%; max-width: 1920px; min-width: 1024px; margin: 0 auto; overflow:hidden;font-size: 18px; color: #ffffff; background: #24092e;}
.container h2{ width: 100%;font-size: 48px; height: 40px;  font-weight: bold;color: #ffffff; text-align: center;line-height: 1;margin: 20px 0 0; padding: 10px 0;}
.container h2 span{ display: block;font-weight: normal;font-size: 14px;margin-top: 5px; color:#ddd5df;}
.mt20{margin-top: 20px;}
.banner{ width: 100%; height: 600px; clear: both;}
.banner .ban1{ background: url(../images/banner1.jpg) no-repeat center; width:100%; height: 300px; }
.banner .ban2{ background: url(../images/banner2.jpg) no-repeat center; width:100%; height: 300px; }
#subnav{ width: 100%; height: 70px; line-height: 70px; background: #de2253; overflow: hidden;}
#subnav a{float: left; width:12%;text-align: center;height: 65px; margin-top: 5px; font-size: 18px;color: #fff; transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear;}
#subnav a:nth-child(4){ width: 16%;}
#subnav a:hover,#subnav a.on{background-color: #ffffff; color: #de2253}
.wrapper{ width: 1180px; margin: 0 auto;}
.btn-transition{transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear;}
.btn-transition:hover{-moz-box-shadow:0px 0px 10px #fff; -webkit-box-shadow:0px 0px 10px #fff; box-shadow:0px 0px 10px #fff;color:#fff;}
a.btnas{display: block;background-color: rgb(246, 30, 86); width: 390px;height:70px; text-align: center;line-height: 70px; border-radius: 35px; font-size: 28px;color: #fff;margin: 50px auto}
a.btnas:hover{box-shadow: 0px 5px 0px 0px rgba(198, 13, 61, 0.75);}



#section1 h2{ background: url(../images/hbg1.png) no-repeat center;}
.itemdl{ width: 105%; overflow: hidden;}
.itemdl dl{float: left; width: 250px; height: 210px; background: #ffffff;border:5px solid #e1e2e4;margin-right: 45px;margin-top: 30px;text-align: center; color: #000000;font-size: 24px;}

#section2{ width: 100%; height: 930px; background: url(../images/bg2.jpg)  no-repeat center; overflow: hidden;}
#section2 h2{ height: 100px; padding: 0 0; background: url(../images/hbg2.png) no-repeat center;}
#section2 h2 span{font-size: 40px;font-weight: normal;}
#section2 .wrapper{ overflow: hidden; width: 100%;margin-top: 40px;}
#section2 .wrapper *{transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear; }
#section2 .wrapper dl{ width: 20%;float: left;position: relative;}
#section2 .wrapper dl:nth-child(1){ background: url(../images/case1.jpg) no-repeat center /cover;}
#section2 .wrapper dl:nth-child(2){ background: url(../images/case2.jpg) no-repeat center /cover;}
#section2 .wrapper dl:nth-child(3){ background: url(../images/case3.jpg) no-repeat center /cover;}
#section2 .wrapper dl:nth-child(4){ background: url(../images/case4.jpg) no-repeat center /cover;}
#section2 .wrapper dl:nth-child(5){ background: url(../images/case5.jpg) no-repeat center;}
#section2 .wrapper dl:nth-child(1):hover{ background: url(../images/case11.jpg) no-repeat center /cover;}
#section2 .wrapper dl:nth-child(2):hover{ background: url(../images/case21.jpg) no-repeat center /cover;}
#section2 .wrapper dl:nth-child(3):hover{ background: url(../images/case31.jpg) no-repeat center /cover;}
#section2 .wrapper dl:nth-child(4):hover{ background: url(../images/case41.jpg) no-repeat center /cover;}
#section2 .wrapper dl:nth-child(5):hover{ background: url(../images/case51.jpg) no-repeat center /cover;}
#section2 .wrapper dl dt{ background-color: rgb(0, 0, 0);height: 122px; width: 100%; opacity: 0; position: absolute; left: 0; bottom: 0; z-index: 10}
#section2 .wrapper dl dd{ width: 100%; height: 120px; position: absolute; left: 0; bottom: 0; z-index: 11; opacity: 0;}
#section2 .wrapper dl dd strong{ display: block;background-color: rgb(255, 255, 255);width: 115px;  height: 35px; margin-left: 30px;margin-top: 30px; margin-bottom: 10px;text-align: center;line-height: 35px;font-size: 22px;color: #21052c}
#section2 .wrapper dl dd p{padding: 0 30px; line-height: 1;}
#section2 .wrapper dl:hover dt{ opacity: 0.6;}
#section2 .wrapper dl:hover dd{ opacity: 1;}

#section3{ width: 100%; height: auto; background: url(../images/bg3.jpg) no-repeat center top; overflow: hidden;}
#section3 h2{ height: 100px; margin-top: 70px; padding: 0; margin-bottom: 50px;}
#section3 h2 span{font-size: 40px;font-weight: normal;}
#section3 .wrapper{ background: #ffffff; overflow: hidden; padding-bottom: 25px;}
#section3 ul.title{background-color: rgb(255, 55, 107);width: 185px;  height: 50px;text-align: center;line-height: 50px; color: #fff;font-size:28px;margin-top: 30px;}
#section3 .imgboxs{margin: 0 20px; padding: 30px 0; border-bottom: 12px solid #e5e5e5; overflow:hidden;}
#section3 .imgboxs img{ display: block;}
#section3 .imgboxs ul{ width: 105%;}
#section3 .imgboxs ul li{float: left;margin-right: 30px;}
#section3 .imgboxs.b2{padding: 30px 0 20px;}
#section3 .imgboxs.b2 ul li{margin-bottom: 10px;}
#section3 .imgboxs.b2.bnone{border:  none;}
#section3 .imgboxs ul li.texts{ background: #ffe3ea;font-size: 20px; color: #666666}
#section3 .imgboxs ul li.texts.t1{width: 270px; height: 265px; padding: 115px 40px 0; }
#section3 .imgboxs ul li.texts.t2{width: 270px; height: 255px; padding: 65px 40px 0; }


#section4{ width: 100%; overflow: hidden; background: #24092e;}
#section4 h2{ height: 100px; padding: 0 0;background: url(../images/hbg3.png) no-repeat center;margin-bottom: 40px;margin-top: 80px;}
#section4 h2 span{font-size: 40px;font-weight: normal;}
.section4-1{ width: 100%; height: 800px; overflow: hidden; background: url(../images/bg4.jpg) repeat;}
.casescroll{ width: 1180px; height: 800px; position: relative; margin: 0 auto;  overflow: hidden;}
.casescroll .sider{ position: relative; height: 800px;}
.casescroll .sider li{width: 1180px; height: 800px; float: left; position: relative;}
.casescroll .casebox.c1{ background: url(../images/c1.jpg) no-repeat left center;}
.casescroll .casebox.c2{ background: url(../images/c2.jpg) no-repeat right center;}
.casescroll .casebox.c3{ background: url(../images/c3.jpg) no-repeat left center;}
.casescroll .casebox .content{ width: 665px;font-size: 16px; color: #dcdcdc}
.casescroll .casebox .content h3{ padding-left: 123px; height: 86px;font-size: 42px;color: #fff; line-height: 1;margin-top: 55px;margin-bottom: 25px;}
.casescroll .casebox .content h3 span{ display: block;font-size: 38px;font-weight: normal;margin-top: 5px;}
.casescroll .casebox .content h3.b1{ background: url(../images/t1.png) no-repeat left center;}
.casescroll .casebox .content h3.b2{ background: url(../images/t2.png) no-repeat left center;}
.casescroll .casebox .content h3.b3{ background: url(../images/t3.png) no-repeat left center;}
.casescroll .casebox .content p>strong{ display: block;background-color: rgb(231, 51, 97);width: 120px;height: 35px;text-align: center;line-height: 35px;color: #fff;font-size: 22px;margin-top: 30px;}
.casescroll .casebox .content .aboxs2{ overflow: hidden; width: 100%; }
.casescroll .casebox .content .aboxs2 li{ float: left;text-align: center;background:url(../images/abg2.png) no-repeat center; width: 143px; height: 88px;margin-right: 23px; padding-top: 53px; line-height: 1;font-size: 26px;transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear;margin-top: 40px;}
.casescroll .casebox .content .aboxs2 li span{ display: block; font-size: 12px;margin-top: 5px;}
.casescroll .casebox .content .aboxs2 li:hover{background:url(../images/abg1.png) no-repeat center;}
.casescroll .casebox a.btnc{ display: block; background:url(../images/btna.png); width: 152px; height: 152px; border-radius: 50%; position: absolute;}
.casescroll .casebox.c1 a.btnc,.casescroll .casebox.c3 a.btnc{ left: 205px; bottom:145px }
.casescroll .casebox.c2 a.btnc{ right: 130px; bottom:145px }


.casescroll .hd{ position:absolute; bottom:30px;text-align: center; z-index: 999; height: 22px; width: 100%;text-align: center; }
.casescroll .hd li{ display: inline-block; border-radius: 50%;background-color: rgb(102, 102, 102);width: 22px;height: 22px;  margin:0 10px; text-indent:-9999px; }
.casescroll .hd li.on{background-color: rgb(231, 51, 97);}






#section5{ width: 100%; overflow: hidden; background: #24092e}
#section5 h2{ height: 70px; padding: 15px 0;background: url(../images/hbg4.png) no-repeat center;margin-bottom: 40px;margin-top: 70px;}
#section5 dl{float: left; width: 25%; height: 457px; position: relative;}
#section5 dl dt{ width: 243px; height: 243px; border-radius: 50%; overflow:hidden; position: absolute; left: 32px; top: 0;transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear; z-index: 11}
#section5 dl dd{ background: #6b2a88; width: 100%; height: 223px; position: absolute; bottom: 0; left: 0;z-index: 9}
#section5 dl dd p{ margin: 0 23px; color: #fff;font-size: 16px;}
#section5 dl dd p.title{font-size: 28px;font-weight: bold;text-align: center; line-height: 1;margin: 40px 23px 15px; padding-bottom: 10px; border-bottom: 2px solid #fff}
#section5 dl dd.bgs{ background: #8e42b0;}

#section6 h2{ color: #000; padding-bottom: 5px; height: 75px;padding-top: 0;}
#section7{ background: #24092e; width: 100%; overflow: hidden;}
#section7 h2{ height: 70px; padding: 15px 0;background: url(../images/hbg4.png) no-repeat center;margin-bottom: 30px;margin-top: 70px;}
#section7 .itema{ width: 105%; overflow: hidden; padding: 10px 0;}
#section7 .itema a{ display: block;float: left;border-radius: 50%;height: 171px; width: 186px; padding: 105px 45px 0; font-size: 24px; color: #fff; margin-right: 25px;font-size: 20px;line-height: 1.5;}
#section7 .itema a:nth-child(1){ background: url(../images/a1.png) no-repeat center;}
#section7 .itema a:nth-child(2){ background: url(../images/a2.png) no-repeat center;}
#section7 .itema a:nth-child(3){ background: url(../images/a3.png) no-repeat center;}
#section7 .itema a:nth-child(4){ background: url(../images/a4.png) no-repeat center;}


#section8{ overflow: hidden; width: 100%; padding-bottom: 60px; background: #390f4d; margin-top: 80px;}
#section8 h2{ color:#fff;font-size: 38px; background: url(../images/hbg6.png) no-repeat center bottom; padding-bottom: 10px;margin-bottom: 30px; height: 40px;}
.tabnav2{ width: 110%; height: 134px; overflow: hidden; margin-top: 30px; margin-bottom: 10px;}
.tabnav2 dl{ float: left; width: 144px; height: 134px; position: relative; margin-right: 4px; cursor: pointer;}
.tabnav2 dl dt{width: 59px;height: 59px; border-radius: 50%;margin-left: 44px; background-color: #9b56bc;background-repeat: no-repeat;background-position: center;transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear;}
.tabnav2 dl:hover dt{ background-color: rgb(255, 174, 0);}
.tabnav2 dl:nth-child(1) dt{background-image: url(../images/icon1.png);}
.tabnav2 dl:nth-child(2) dt{background-image: url(../images/icon2.png);}
.tabnav2 dl:nth-child(3) dt{background-image: url(../images/icon3.png);}
.tabnav2 dl:nth-child(4) dt{background-image: url(../images/icon4.png);}
.tabnav2 dl:nth-child(5) dt{background-image: url(../images/icon5.png);}
.tabnav2 dl:nth-child(6) dt{background-image: url(../images/icon6.png);}
.tabnav2 dl:nth-child(7) dt{background-image: url(../images/icon7.png);}
.tabnav2 dl:nth-child(8) dt{background-image: url(../images/icon8.png);}
.tabnav2 dl dd{ width: 100%; height: 50px;background-color: #9b56bc; text-align: center;line-height: 50px; color:#fff; margin-top: 15px;transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear;}
.tabnav2 dl:hover dd,.tabnav2 dl.on dd,.tabnav2 dl:hover dt,.tabnav2 dl.on dt{background-color: #f61e56;}
.tabnav2 dl span{ display: block; border-left: 10px solid transparent;    border-right: 10px solid transparent;    border-top: 10px solid #f61e56; position: absolute; left: 50%; margin-left: -10px;bottom: 0;transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear; opacity: 0;}
.tabnav2 dl:hover span,.tabnav2 dl.on span{ opacity: 1;}
.changebox{ width: 1180px; height: 420px;  overflow: hidden; position: relative;}
.changebox .change{ position: absolute; left: 0; top: 0; height: 420px;}
.changebox .change .content{ width: 1180px; height: 420px; float: left;}
.changebox .change .content .imgs {float: left; width: 620px; height: 420px}
.changebox .change .content .text{ float: right; width: 560px;height: 420px; background: url(../images/bg9.jpg) no-repeat center; position: relative; overflow: hidden; display: inline-block;}
.changebox .change .content .text h5{font-size: 34px;color: #000000;font-weight: bold;text-align: center; line-height: 1; margin-top: 45px;margin-bottom: 20px; overflow: hidden;}
.changebox .change .content .text p{font-size: 16px; color:#333333;text-indent: 2em; padding: 0 40px; line-height: 2;}
.changebox .change .content .text a{ display: block; border:2px solid  rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0); width: 170px; height: 45px; line-height: 45px; text-align: center; color: #000000; position: absolute; bottom: 60px; left: 110px;transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear;}
.changebox .change .content .text a.zixun{background-color: #890b84; color: #fff;border:2px solid  #890b84; left: 300px;}
.changebox .change .content .text a:hover{background-color: #f61e56; color: #fff;border:2px solid  #f61e56; }
.sections h2{ color:#000;}

.casesshow{ width: 110%; overflow: hidden;margin-bottom: 40px;}
.casesshow dl{float: left; height: 430px; position: relative; overflow: hidden;margin-right: 30px;}
.casesshow dl *{transition:all 300ms linear;-moz-transiton:all 300ms linear;-webket-transition:all 300ms linear;-o-transition:all 300ms linear;}
.casesshow dl span{ display: block; width: 100%;background-color: rgb(0, 0, 0);opacity: 0;position: absolute; left: 0;bottom: 0; height: 40px; z-index: 10;}
.casesshow dl dd{ width: 100%; height: 40px; text-align: center;line-height: 40px;color: #fff; position: absolute;  left: 0; bottom: 0; z-index: 11;font-size: 16px; opacity: 0}
.casesshow dl:hover span{ opacity: 0.712}
.casesshow dl:hover dd{ opacity: 1}