@charset "utf-8";
.t-h2{font-size:24px; color:#333; letter-spacing:2px; text-align:center; }
.t-p1{font-size:16px; color:#999; text-align:center; line-height:30px; padding:10px 0 70px; position:relative;}
.t-p1::after{content:""; width:60px; height:2px; background-color:#e7390b; position:absolute; bottom:40px; left:50%; margin-left:-30px;}

.part1{overflow:hidden; padding:80px 125px; width:950px;}
.part1 .p2{font-size:16px; color:#666; text-align:center; line-height:32px; letter-spacing:2px;}
.part1 .items{overflow:hidden; margin-top:50px;}
.part1 .items .ii{width:33.33%; float:left; text-align:center;}
.part1 .items .ii h3{font-size:50px; color:#e7390b}
.part1 .items .ii p{font-size:16px; color:#333; letter-spacing:2px; line-height:28px;}

.part2{overflow:hidden; margin-top:70px;}
.part2 .listbox{overflow:hidden;}
.part2 .item{overflow:hidden}
.part2 .item h3{font-size:16px; font-weight:600; color:#333; line-height:34px; padding-top:50px; padding-left:5px;}
.part2 .item p{font-size:15px; color:#666; line-height:28px; padding-bottom:10px; padding-left:5px;}
.part2 .item1{float:left; width:580px; margin-top:60px;}
.part2 .item2{float:right; width:400px;}
.part2 .item3{width:100%; margin-top:60px;}
.part2 .item3 h3{margin-top:140px;}
.part2 .item4{margin-top:60px; float:left}
.part2 .item5{margin-top:125px; float:right}

.part3{overflow:hidden; margin-top:100px; width:1100px; padding:0 50px;}
.part3 .listbox{overflow:hidden}
.part3 .item{width:25%; float:left; text-align:center;}
.part3 .item h3{font-size:16px; font-weight:bold; color:#333; margin-top:25px;}
.part3 .item p{font-size:14px; color:#999; line-height:24px; margin-top:10px;}
.part3 .item .icon{width:90px; height:90px; background:url(../images/brand/part3.png) no-repeat center center; margin:10px auto;}
.part3 .item .icon-web{ background:url(../images/brand/icon-web.png) no-repeat center center;}
.part3 .item .icon-app{ background:url(../images/brand/icon-app.png) no-repeat center center;}
.part3 .item .icon-wechat{ background:url(../images/brand/icon-wechat.png) no-repeat center center;}
.part3 .item .icon-h5{ background:url(../images/brand/icon-h5.png) no-repeat center center;}

.part4{overflow:hidden; margin-top:100px; width:1200px; }
.part4 .listbox{overflow:hidden}
.part4 .item{width:16.666%; float:left; text-align:center; position:relative;}
.part4 .item::after{content:""; width:26px; height:22px; position:absolute; right:0; top:45px; background:url(../images/brand/arrow.png) no-repeat center center;}
.part4 .item.noarrow::after{width:0;}
.part4 .item h3{font-size:16px; font-weight:bold; color:#333; margin-top:25px;}
.part4 .item .icon{width:90px; height:90px; background:url(../images/brand/part4.png) no-repeat center center; margin:10px auto;}
.part4 .item .icon.step1{background:url(../images/brand/step_1.png) no-repeat center center;}
.part4 .item .icon.step2{background:url(../images/brand/step_2.png) no-repeat center center;}
.part4 .item .icon.step3{background:url(../images/brand/step_3.png) no-repeat center center;}
.part4 .item .icon.step4{background:url(../images/brand/step_4.png) no-repeat center center;}
.part4 .item .icon.step5{background:url(../images/brand/step_5.png) no-repeat center center;}
.part4 .item .icon.step6{background:url(../images/brand/step_6.png) no-repeat center center;}

.part5{overflow:hidden; margin-top:100px; }
.part5 .listbox{overflow:hidden; width:1230px;}
.part5 .item{width:380px; float:left; margin-right:30px; margin-bottom:30px; display:block; position:relative;}
.part5 .item img{width:380px; height:285px;}
.part5 .item .mask{position:absolute; top:0; bottom:0; left:0; right:0; background:rgba(0,0,0,0.5); text-align:center; top:285px;}
.part5 .item .mask h3{position:relative; font-weight:bold; font-size:15px; color:#fff; margin-top:80px; padding-bottom:20px;}
.part5 .item .mask h3::after{content:""; width:40px; height:2px; background-color:#e7390b; position:absolute; bottom:0; left:50%; margin-left:-20px;}
.part5 .item .mask p{ font-size:15px; color:#fff; padding:5px 15%; line-height:24px; margin-top:10px;}

.part6{overflow:hidden; margin-top:100px; }
.part6 .listbox{overflow:hidden; width:1218px;}
.part6 .item{width:183px; height: 135px; float:left; margin-right:18px; margin-bottom:18px; border:1px solid #eee; display:block; }
.part6 .item img{width:100%; height: 135px}

.part7{overflow:hidden; margin-top:100px; }
.part7 .listbox{overflow:hidden;}
.part7 .item{width:33.333%; float:left; }
.part7 .item1{width:28%; padding-left:12%;}
.part7 .item2{width:30%; padding-left: 50px;}
.part7 .item3{width:25%;}
.part7 .item p{font-size:15px; line-height:26px; color:#555; padding:8px 0 8px 35px;}
.part7 .item p.tel{background:url(../images/icon_tel.png) no-repeat 0px 12px; }
.part7 .item p.mail{background:url(../images/icon_mail.png) no-repeat 0px 14px; }
.part7 .item p.address{background:url(../images/icon_address.png) no-repeat 0px 15px;}
.part7 .item p.deparment{font-weight:bold; font-size:16px;}

.part8{overflow:hidden; margin-top:100px; padding-bottom:50px;}
.part8 .listbox{overflow:hidden; width:1230px;}
.part8 .item{float:left; width:380px; margin-right:30px;}
.part8 .item .news{background-color:#f4f4f4; padding:30px 25px 10px; overflow:hidden;}
.part8 .item .news .title{font-size:17px; color:#333}
.part8 .item .news .summary{font-size:14px; color:#999; line-height:22px;padding:10px 0px 15px; border-bottom:2px solid #fff}
.part8 .item .news .info{padding:15px 0px;     overflow: hidden;}
.part8 .item .news .date {float:left; width:80px;}
.part8 .item .news .date b{color:#333; font-size:38px; font-weight:normal}
.part8 .item .news .date span{color:#999; font-size:15px; display:block; margin-top:5px;}
.part8 .item .news .view {float:right;margin-right: 5px; margin-top: 40px;}
.part8 .item1{position:relative; display:block;}
.part8 .item1 p{position:absolute; bottom:10%; right:0; width:63%;     height: 60px; padding:5% 22% 5% 5%; font-size:16px; line-height:30px; background:url(../images/brand/arrow.png) no-repeat 290px 55px;background-color:#fff;}
.part8 .item1:hover{color:#e7390b} 
.part8 .item2 .news{ margin-bottom:20px;}
.part8 .item3 .news{padding:30px 25px 12px; overflow:hidden; margin-bottom:20px;}
.part8 .item3 .news .cc{float:right; width:250px; overflow:hidden}
.part8 .item3 .news .info{float:left; padding:0; width:65px;}
.part8 .item3 .news .title{}
.part8 .item3 .news .summary{border-bottom:none;}
.part8 .item3 .news .view {float:right;margin-right: 5px; margin-top: -6px;}
.part8 .item3 .news .date {float:none; width:auto;}
.part8 .item3 .news .date span{border-top:2px solid #fff; padding-top:10px;}


.case{ overflow:hidden; padding-top:100px; padding-bottom: 80px; background-color:#f4f4f4 }


.newsinfo{overflow:hidden;padding:5%;}
.newsinfo p{font-size:15px; line-height:32px; margin-bottom:30px;}
.newsinfo img{max-width:100%; margin:auto;}




@media screen and (max-width:1200px) {
    .t-h2{font-size:18px; color:#333; letter-spacing:1px; text-align:center; }
    .t-p1{font-size:12px;padding: 10px 0 40px; line-height:20px; }
    .t-p1::after{content:""; width:50px; height:2px; background-color:#e7390b; position:absolute; bottom:20px; left:50%; margin-left:-25px;}

    .part1{overflow:hidden; padding:5%; width:90%;}
    .part1 .p2{font-size:14px; color:#666; text-align:justify; line-height:220%; letter-spacing:1px;}
    .part1 .items{overflow:hidden; margin-top:30px;}
    .part1 .items .ii{width:33.33%; float:left; text-align:center;}
    .part1 .items .ii h3{font-size:24px; color:#e7390b}
    .part1 .items .ii p{font-size:14px; color:#333; letter-spacing:0px; line-height:200%;}

    .part2{overflow:hidden; margin-top:40px;}
    .part2 .listbox{overflow:hidden; padding:0 5% 5% 5%;}
    .part2 .item{overflow:hidden}
    .part2 .item img{width:100%;}
    .part2 .item h3{font-size:18px; font-weight:bold; color:#333; line-height:35px; padding-top:15px; padding-left:5px;text-transform: uppercase;}
    .part2 .item p{font-size:15px; color:#666; line-height:28px; padding-bottom:10px; padding-left:5px;}
    .part2 .item1{float:none; width:100%; margin-top:10px;}
    .part2 .item2{float:none; width:100%;}
    .part2 .item3{width:100%; margin-top:30px;}
    .part2 .item3 h3{margin-top:10px;}
    .part2 .item3 .fr{width:100%}
    .part2 .item4{margin-top:30px; float:none}
    .part2 .item5{margin-top:5px; float:none}

    .part3{overflow:hidden; margin-top:20px; width:90%; padding:5%;}
    .part3 .listbox{overflow:hidden}
    .part3 .item{width:50%; float:left; text-align:center;}
    .part3 .item h3{font-size:15px; font-weight:bold; color:#333; margin-top:0px;float: left;text-align:left}
    .part3 .item p{font-size:12px; color:#999; line-height:20px; height:40px; overflow:hidden; margin-top:0;float: left; text-align:left; width:60%;margin-top:10px; margin-bottom: 15px;}
    .part3 .item .icon{width:50px; height:50px; float:left; background:url(../images/brand/part3.png) no-repeat top center; margin:0 5% 0 0; padding-bottom:20px;}
    .part3 .item .icon-web{ background:url(../images/brand/icon-web.png) no-repeat top center; background-size:contain}
    .part3 .item .icon-app{ background:url(../images/brand/icon-app.png) no-repeat top center; background-size:contain}
    .part3 .item .icon-wechat{ background:url(../images/brand/icon-wechat.png) no-repeat top center; background-size:contain}
    .part3 .item .icon-h5{ background:url(../images/brand/icon-h5.png) no-repeat top center; background-size:contain}

    .part4{overflow:hidden; margin-top:10px; width:90%; padding:5%; }
    .part4 .listbox{overflow:hidden}
    .part4 .item{width:33.33%; float:left; text-align:center; position:relative;}
    .part4 .item::after{display:none; content:""; width:26px; height:22px; position:absolute; right:0; top:45px; background:url(../images/brand/arrow.png) no-repeat center center;}
    .part4 .item.noarrow::after{width:0;}
    .part4 .item h3{font-size:14px; font-weight:bold; color:#333; margin-top:0px;}
    .part4 .item .icon{width:45px; height:45px; background:url(../images/brand/part4.png) no-repeat center center; margin:10px auto;}
    .part4 .item .icon.step1{background:url(../images/brand/step_1.png) no-repeat center center; background-size:contain}
    .part4 .item .icon.step2{background:url(../images/brand/step_2.png) no-repeat center center;  background-size:contain}
    .part4 .item .icon.step3{background:url(../images/brand/step_3.png) no-repeat center center; background-size:contain}
    .part4 .item .icon.step4{background:url(../images/brand/step_4.png) no-repeat center center; background-size:contain}
    .part4 .item .icon.step5{background:url(../images/brand/step_5.png) no-repeat center center; background-size:contain}
    .part4 .item .icon.step6{background:url(../images/brand/step_6.png) no-repeat center center; background-size:contain}

    .part5{overflow:hidden; margin-top:30px; width:90%; padding:5% }
    .part5 .listbox{overflow:hidden; width:100%;}
    .part5 .item{width:49%; float:left; margin-right:0; margin-bottom:2%; display:block; position:relative; margin-left:2%}
    .part5 .item:nth-child(2n+1){margin-left:0;}
    .part5 .item img{width:100%; height:auto;}
    .part5 .item .mask{position:absolute; top:0; bottom:0; left:0; right:0; background:rgba(0,0,0,0.5); text-align:center; top:285px;}
    .part5 .item .mask h3{position:relative; font-weight:bold; font-size:15px; color:#fff; margin-top:80px; padding-bottom:20px;}
    .part5 .item .mask h3::after{content:""; width:40px; height:2px; background-color:#e7390b; position:absolute; bottom:0; left:50%; margin-left:-20px;}
    .part5 .item .mask p{ font-size:15px; color:#fff; padding:5px 15%; line-height:24px; margin-top:10px;}

    .part6{overflow:hidden; margin-top:10px; width:90%; padding:5%; }
    .part6 .listbox{overflow:hidden; width:100%;}
    .part6 .item{width:20%; height: auto; float:left; margin-right:0; margin-bottom:0; border:none; display:block; }
    .part6 .item img{width:100%; height: auto}

    .part7{overflow:hidden; margin-top:10px; width:90%; padding:5% }
    .part7 .listbox{overflow:hidden;}
    .part7 .item{width:100%; float:none; position:relative; border-bottom:1px dashed #ddd; padding:20px 0; }
    .part7 .item1{width:100%; padding-left:0%;}
    .part7 .item2{width:100%; padding-left: 0;}
    .part7 .item3{width:100%;}
    .part7 .item p{font-size:15px; line-height:26px; color:#555; padding:5px 0 5px 35px;}
    .part7 .item p.tel{background:url(../images/icon_tel.png) no-repeat 0px 12px; }
    .part7 .item p.mail{background:url(../images/icon_mail.png) no-repeat 0px 14px; }
    .part7 .item p.address{background:url(../images/icon_address.png) no-repeat 0px 15px;}
    .part7 .item p.deparment{font-weight:bold; font-size:15px;    text-indent: -35px;}
    .part7 .item .wechat{position:absolute;  top:25px; right:0; padding:0;}

    .part8{overflow:hidden; margin-top:0px; padding-bottom:50px; width:90%; padding:5%}
    .part8 .listbox{overflow:hidden; width:100%;}
    .part8 .item{float:none; width:100%; margin-right:0;}
    .part8 .item .news{background-color:#f4f4f4; padding:4% 6%; overflow:hidden;}
    .part8 .item .news .title{font-size:17px; color:#333}
    .part8 .item .news .summary{font-size:14px; color:#999; line-height:22px;padding:10px 0px 0px; border-bottom:none}
    .part8 .item .news .info{padding:15px 0px;  display:none;   overflow: hidden;}
    .part8 .item .news .date {float:left; width:80px;}
    .part8 .item .news .date b{color:#333; font-size:38px; font-weight:normal}
    .part8 .item .news .date span{color:#999; font-size:15px; display:block; margin-top:5px;}
    .part8 .item .news .view {float:right;margin-right: 5px; margin-top: 40px;}
    .part8 .item1{position:relative; display:block; display:none}
    .part8 .item1 p{position:absolute; bottom:10%; right:0; width:63%;     height: 60px; padding:5% 22% 5% 5%; font-size:16px; line-height:30px; background:url(../images/brand/arrow.png) no-repeat 290px 55px;background-color:#fff;}
    .part8 .item1:hover{color:#e7390b} 
    .part8 .item2 .news{ margin-bottom:10px;}
    .part8 .item3 .news{padding:4% 6%; overflow:hidden; margin-bottom:10px;}
    .part8 .item3 .news .cc{float:none; width:100%; overflow:hidden}
    .part8 .item3 .news .info{display:none;}
    .part8 .item3 .news .title{}
    .part8 .item3 .news .summary{border-bottom:none;}
    .part8 .item3 .news .view {display:none}
    .part8 .item3 .news .date {float:none; width:auto;}
    .part8 .item3 .news .date span{border-top:2px solid #fff; padding-top:10px;}


    .case{ overflow:hidden; padding-top:40px; padding-bottom: 30px; background-color:#f4f4f4 }
    .case .grid__link h2{font-size:15px; line-height:24px; font-weight:normal}

    .newsinfo{overflow:hidden;padding:0%;}
    .newsinfo p{font-size:15px; line-height:32px; margin-bottom:30px;}
    .newsinfo img{max-width:100%; margin:auto;}
}