box0@charset "UTF-8";
*{margin: 0px;padding: 0px;}
/* h1,h2,h3,h4,h5,h6,p,dd{margin:0;} */
ul,ol,dl{margin:0;padding:0;list-style:none;}
img{border:none;vertical-align:middle;}
a{text-decoration:none;color:#000;color:inherit;outline:none;}
body{font:14px/1.5 'Microsoft Yahei',sans-serif;/*sans-serif 是手机默认字体*/}

/******* float *******/
.clearfix:after{
	content: '';
	display: block;
	height: 0;
	line-height: 0;
	visibility: hidden;
	clear: both;
}
.fl-l{float:left;}
.fl-r{float:right;}

/********** S product-list **********/
#content .banner{ /******这个首页不需要******/
    display: flex;
    justify-content: space-between;
    /* align-items: flex-start; */
}  
#content .banner .product-list{
    display: flex;
    flex-wrap: wrap;
    width: 87%;
    /* height: 60%; */
    /* background: rgb(128, 230, 216); */
}
#content .banner .product-list li{
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 33.3%;
    height: 50%;
    /* background: #ddd; */
}
#content .banner .product-list li:nth-child(even){
    background-color: #f8f8f8;
}
#content .banner .product-list li img{
    width: 40%;
    height: auto;
}
#content .banner .product-list li .desc{
    width: 46%;
    /* margin: 0 10% 0 4%; */
}
/********** E product-list **********/

/********** S right-menu **********/
#content .banner .right-menu{
    width: 13%;
    /* background: #eee; */
    padding-top: 90px;
}
#content .banner .right-menu li{
    margin-left: 25px;
    line-height: 37px;
    font-size: 18px;
    color: #999;
    /* cursor: pointer; */
    transition: 0.5s;
}
#content .banner .right-menu li.active{
    color: #000;
    margin-left: 8px;
}
#content .banner .right-menu li:hover{
    background: #fff;
    color: #000;
    margin-left: 8px;
}
#content .banner .right-menu li a{
    display: inline-block;
    width: 100%;
    height: 100%;
}
/********** E right-menu **********/

/********** S solution **********/
#content .banner .solution{
	display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
	width: 87%;
	/* height: 67%; */
}
/* #content .banner .solution li{
	
} */
#content .banner .solution li:nth-child(1),
#content .banner .solution li:nth-child(2){
	width: 33%;
	/* height: 38.4%; */
}
#content .banner .solution li:nth-child(3){
	width: 34%;
	/* height: 38.4%; */
}
#content .banner .solution li:nth-child(4){
	width: 27.8%;
	/* height: 61.6%; */
}
#content .banner .solution li:nth-child(5){
	width: 29.8%;
	/* height: 61.6%; */
}
#content .banner .solution li:nth-child(6){
	width: 42.4%;
	/* height: 61.6%; */
}
#content .banner .solution li img{
	width: 100%;
	height: auto;
}
/* #content .banner .solution li:nth-child(3) img{
    height: 100%;
} */
/********** E solution **********/

/********** S new **********/
#content .banner .new-con{
    width: 87%;
    height: 100%;
}
#content .banner .news{
    margin-top: 80px;
    margin-left: 180px;
}
#content .banner .news>li{
    margin-bottom: 20px;
}
#content .banner .news>li p{
    font-size: 46px;
    color: #000;
}
#content .banner .news-list{
    margin-left: 50px;
}
#content .banner .news-list li{
    line-height: 33px;
}
#content .banner .news-list span:nth-child(1){
    font-size: 16px;
    color: #999;
}
#content .banner .news-list span:nth-child(2){
    font-size: 16px;
    color: #000;
}
/********** E new **********/

/********** S new detail **********/
#content .banner .new-con .new-detail{
    position: relative;
    width: 100%;
    /* height: 100%; */
    padding-top: 50px;
}
#content .banner .new-con .new-detail .newsh{
    text-align: center;
}
#content .banner .new-con .new-detail .newsh h2{
    width: 80%;
    margin: auto;
    font-size: 22px;
    font-weight: normal;
    margin-bottom: 12px;
}
#content .banner .new-con .new-detail .newsh span{
    font-size: 16px;
    color: #999;
}
#content .banner .new-con .new-detail .newsh span:nth-child(1){
    margin-right: 30px;
}
#content .banner .new-con .new-detail .newscon{
    text-align: center;
}
#content .banner .new-con .new-detail .newscon p{
    display: inline-block;
    width: 80%;
    margin-bottom: 20px;
}
#content .banner .new-con .new-detail .newscon p:nth-child(1){
    margin: 25px 0 25px 0;
    text-align: left;
}
#content .banner .new-con .new-detail .btn{
    position: absolute;
    top: 355px;
    width: 100%;
    /* margin-top: -25px; */
    height: 50px;
    line-height: 50px;
}
#content .banner .new-con .new-detail .btn .prve{
    margin-left: 40px;
    padding-left: 20px;
    background: url("../images/baseicon/last_black.png")no-repeat left;
}
#content .banner .new-con .new-detail .btn .next{
    padding-right: 20px;
    margin-right: 40px;
    background: url("../images/baseicon/next_black.png")no-repeat right;
}
/********** E news detail **********/

/********** S industry **********/
#content .banner .industry{
    display: flex;
    width: 87%;
}
#content .banner .industry li{
    overflow: hidden;
}
#content .banner .industry li:nth-child(1),
#content .banner .industry li:nth-child(3){
    width: 32.8%;
}
#content .banner .industry li:nth-child(2){
    width: 34.4%;
}
#content .banner .industry li img{
    width: 100%;
    height: auto;
    transform-origin: center center;
    transition: 0.5s;
}
#content .banner .industry li img:hover{
    transform: scale(1.1);
}
/********** E industry **********/

/********** S about **********/
#content .banner .about{
    display: flex;
    width: 87%;
}
#content .banner .about li{
    position: relative;
    overflow: hidden;
    width: 25%;
    text-align: center;
}
#content .banner .about li img{
    width: 100%;
    height: 100%;
    transition: 0.5s;
}
#content .banner .about li img:hover{
    transform: scale(1.2);
}
#content .banner .about li span{
    display: inline-block;
    position: absolute;
    top: 65px;
    left: 0;
    width: 100%;
    font-size: 28px;
    color: #999;
}
#content .banner .about li a p{
    position: absolute;
    top: 100px;
    width: 100%;
    font-size: 36px;
    color: #fff;
}
/********** E about **********/

/********** S product01 **********/
#content .banner .detail{
    width: 87%;
}
#content .banner .detail .detail-list{
    display: flex;
    width: 90%;
    height: 100%;
    margin: 0 auto;
    /* background: blue; */
}
#content .banner .detail .detail-list li{
    width: 33.3%;
    text-align: center;
    /* background: #ddd; */
}
#content .banner .detail .detail-list li:nth-child(even){
    background: #f8f8f8;
}
#content .banner .detail .detail-list>li .view{
    position: relative;
    width: 123px;
    height: 170px;
    margin: 0 auto;
    margin-top: 50px;
    overflow: hidden;
}
#content .banner .detail .detail-list>li .view .img-list{
    position: absolute;
    left: 0;
    top: 0;
    width: 400%;
    transition: 0.5s;
}

#content .banner .detail .detail-list>li .view .img-list li{
    float: left;
    width: 25%;
    text-align: center;
}
#content .banner .detail .detail-list>li .view .img-list li img{
    width: 100%;
    height: 154px;
}
#content .banner .detail .detail-list>li .view .dot{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    margin: 0 auto;
}
#content .banner .detail .detail-list>li .view .dot span{
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #999;
    cursor: pointer;
}
#content .banner .detail .detail-list>li .view .dot span.on{
    background-color: #555;
}
#content .banner .detail .detail-list>li h3{
    line-height: 50px;
    font-size: 22px;
}
#content .banner .detail .detail-list>li p{
    line-height: 40px;
    font-size: 18px;
    color: #555;
}
#content .banner .detail .detail-list>li span{
    display: block;
    font-size: 16px;
    color: #b5b5b5;
}
/********** E product01 **********/

/********** S solution01 **********/
#content .banner .solution-con{      /*解决方案下公用**/
    width: 87%;
    height: 100%;
}
#content .banner .solution-con .pay-bg{
    width: 100%;
    height: 100%;
    background: url("../images/solution/pay_second.jpg")no-repeat center/100% 100%;
}
#content .banner .solution-con .pay{
    display: flex;
    padding-top: 60px;
}
#content .banner .solution-con .pay li{
    margin: 0 20px;
}
#content .banner .solution-con .pay li h4{
    line-height: 40px;
    margin-bottom: 15px;
    font-size: 26px;
    font-weight: normal;
}
#content .banner .solution-con .pay li p{
    line-height: 30px;
    color: #999;
}
/********** E solution01 **********/

/********** S pet **********/
#content .banner .solution-con .pet-bg{
    width: 100%;
    height: 100%;
    background: url("../images/solution/pet_second.jpg")no-repeat center/100% 100%;
}
#content .banner .solution-con .pet-bg .pet-desc{
    padding: 150px 0 0 100px;
}
#content .banner .solution-con .pet-bg .pet-desc h4{
    line-height: 40px;
    margin-bottom: 15px;
    font-size: 26px;
    font-weight: normal;
}
#content .banner .solution-con .pet-bg .pet-desc p{
    line-height: 30px;
    font-size: 16px;
    color: #999;
}
/********** E pet **********/

/********** S car **********/
#content .banner .solution-con .car-bg{
    position: relative;
    width: 100%;
    height: 100%;
    background: url("../images/solution/car_second.jpg")no-repeat center/100% 100%;
}
#content .banner .solution-con .car-bg .car-desc{
    position: absolute;
    right: 150px;
    top: 200px;
    width: 290px;
}
#content .banner .solution-con .car-bg .car-desc h3{
    font-size: 46px;
    font-weight: normal;
    color: #fff;
}
#content .banner .solution-con .car-bg .car-desc p{
    font-size: 16px;
    color: #b5b5b5;
}
/********** E car **********/

/********** S game **********/
#content .banner .solution-con .game-bg{
    position: relative;
    width: 100%;
    height: 100%;
    background: url("../images/solution/game_second.jpg")no-repeat center/100% 100%;
}
#content .banner .solution-con .game-bg .game-desc{
    position: absolute;
    top: 130px;
    right: 100px;
    width: 300px;
}
#content .banner .solution-con .game-bg .game-desc h3{
    font-size: 46px;
    font-weight: normal;
}
#content .banner .solution-con .game-bg .game-desc p{
    font-size: 16px;
    color: #626262;
}
/********** E game **********/

/********** S sport **********/
#content .banner .solution-con .sport-bg{
    position: relative;
    width: 100%;
    height: 100%;
    background: url("../images/solution/sport_second.jpg")no-repeat center/100% 100%;
}
#content .banner .solution-con .sport-bg .sport-desc{
    position: absolute;
    top: 130px;
    right: 100px;
    width: 300px;
}
#content .banner .solution-con .sport-bg .sport-desc h3{
    font-size: 46px;
    font-weight: normal;
}
#content .banner .solution-con .sport-bg .sport-desc p{
    font-size: 16px;
    color: #555;
}
/********** E sport **********/

/********** S smarthome **********/
#content .banner .solution-con .smarthome-bg{
    width: 100%;
    height: 100%;
    background: url("../images/solution/home_furnishing_second.jpg")no-repeat center/100% 100%;
}
#content .banner .solution-con .smarthome-bg .smarthome-desc{
    width: 90%;
    padding-top: 80px;
    margin: 0 auto;
    text-align: center;
}
#content .banner .solution-con .smarthome-bg .smarthome-desc h3{
    font-size: 46px;
    font-weight: normal;
}
#content .banner .solution-con .smarthome-bg .smarthome-desc p{
    font-size: 16px;
    color: #555;
}
/********** E smarthome **********/

/********** S call4g **********/
#content .banner .solution-con .call4g-bg{
    position: relative;
    width: 100%;
    height: 100%;
    background: url("../images/solution/call_4g_second.jpg")no-repeat center/100% 100%;
}
#content .banner .solution-con .call4g-bg .call4g-desc{
    position: absolute;
    top: 100px;
    right: 60px;
    width: 200px;
}
#content .banner .solution-con .call4g-bg .call4g-desc h3{
    font-size: 46px;
    font-weight: normal;
    color: #fff;
}
#content .banner .solution-con .call4g-bg .call4g-desc p{
    font-size: 16px;
    color: #999;
}
/********** E call4g **********/


/********** S CEOinfo **********/
#content .banner .about-con{
    width: 87%;
    height: 100%;
}
#content .banner .ceo-bg{
    position: relative;
    width: 100%;
    height: 100%;
    background: url("../images/about/ceo_second.jpg")no-repeat center/100% 100%;
}
#content .banner .ceo-bg .ceo-desc{
    position: absolute;
    right: 68px;
    top: 100px;
    width: 323px;
}
#content .banner .ceo-bg .ceo-desc hr{
    display: inline-block;
    width: 80px;
    color: #313131;
    border-bottom: none;
    margin: 0 12px 0 50px;
    vertical-align: middle;
}
#content .banner .ceo-bg .ceo-desc h3{
    font-size: 36px;
    font-weight: normal;
    color: #313131;
}
#content .banner .ceo-bg .ceo-desc span{
    font-size: 28px;
    color: #313131;
}
#content .banner .ceo-bg .ceo-desc p{
    font-size: 16px;
    line-height: 30px;
    color: #b5b5b5;
}
/********** E CEOinfo **********/

/********** S companyinfo **********/
#content .banner .about-con1{position: relative;}
#content .banner .about-con .con1{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 200%;
    transition: 0.5s;
}

#content .banner .companyinfo-bg{
    display: flex;
    justify-content: space-around;
    width: 100%;
    height: 50%;
    padding: 0 30px;
    box-sizing: border-box;
}
#content .banner .companyinfo-bg li{
    width: 45%;
}
#content .banner .companyinfo-bg li h4{
    font-size: 20px;
    font-weight: normal;
    text-align: center;
    margin-top: 60px;
}
#content .banner .companyinfo-bg li:nth-child(1) p{
    text-indent: 20px;
    color: #999;
}
#content .banner .companyinfo-bg li:nth-child(1) .img-wrap{
    margin-top: 50px;
}
#content .banner .companyinfo-bg li img{
    width: 100%;
    height: auto;
}
#content .banner .companyinfo-bg li:nth-child(2) .kind{
    text-align: center;
    margin-top: 125px;
}
#content .banner .companyinfo-bg li:nth-child(2) .kind p{
    font-size: 22px;
    font-weight: normal;
}
#content .banner .companyinfo-bg li:nth-child(2) .kind span{
    font-size: 22px;
    color: #999;
}
#content .banner .about-con .con1 .bg2{
    position: relative;
    height: 50%;
    background: url("../images/about/culture.jpg")no-repeat center/100% 100%;
}
#content .banner .about-con .con1 .bg2 .bg2-desc{
    position: absolute;
    top: 50px;
    right: 50px;
    width: 530px;
    height: 180px;
}
#content .banner .about-con .con1 .bg2 .bg2-desc div{
    font-size: 22px;
}
#content .banner .about-con .con1 .bg2 .bg2-desc p{
    display: inline-block;
    width: 115px;
    color: #1b232b;
}
#content .banner .about-con .con1 .bg2 .bg2-desc span{
    color: #999;
}
#content .banner .about-con .con1 .bg2 .bg2-desc div:nth-child(2) span{
    display: inline-block;
    vertical-align: top;
    /* width: 170px; */
    height: 70px;
}
/********** E companyinfo **********/

/********** S joinus **********/
#content .banner .about-con .con2{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2000%;
    transition: 0.5s;
}
#content .banner .about-con .con2 .box{
    width: 100%;
    height: 5%;
}
#content .banner .about-con .con2 .box0{
    position: relative;
    background: url("../images/about/join_us2.jpg")no-repeat center/100% 100%;
}
#content .banner .about-con .con2 .box0 .desc0{
    position: absolute;
    top: 50px;
    right: 70px;
    width: 390px;
    text-align: center;
}
#content .banner .about-con .con2 .box0 .desc0 h3{
    font-size: 36px;
    font-weight: normal;
    color: #fff;
}
#content .banner .about-con .con2 .box0 .desc0 span{
    font-size: 24px;
    color: #999;
}
#content .banner .about-con .con2 .box0 .desc0 p{
    font-size: 16px;
    color: #999;
    text-align: left;
}
#content .banner .about-con .con2 .box0 .desc0 .station{
    line-height: 30px;
    font-size: 16px;
    color: #fff;
    margin-bottom: 8px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    /* opacity: 0.5; */
}
#content .banner .about-con .con2 .box1 .detail{
    width: 570px;
    margin: auto;
    padding-top: 30px;
}
#content .banner .about-con .con2 .box1 .detail .title{
    width: 375px;
    height: 40px;
    text-align: center;
    margin: auto;
    line-height: 40px;
    font-size: 22px;
    border: 1px solid #000;
}
#content .banner .about-con .con2 .box1 .detail .wrap{
    margin-bottom: 18px;
}
#content .banner .about-con .con2 .box1 .detail .title2{
    font-size: 20px;
    margin-bottom: 5px;
}
#content .banner .about-con .con2 .box1 .detail p{
    font-size: 16px;
    color: #999;
    margin-left: 8px;
}
#content .banner .about-con .con2 .box2,
#content .banner .about-con .con2 .box3,
#content .banner .about-con .con2 .box4,
#content .banner .about-con .con2 .box5,
#content .banner .about-con .con2 .box6,
#content .banner .about-con .con2 .box7,
#content .banner .about-con .con2 .box8,
#content .banner .about-con .con2 .box9,
#content .banner .about-con .con2 .box10{
    text-align: center;
    font-size: 100px;
    line-height: 500px;
}
/********** E joinus **********/

/********** S contact **********/
#content .banner .contact-bg{
    position: relative;
    width: 100%;
    height: 100%;
    background: url("../images/about/waiter.jpg")no-repeat center/100% 100%;
}
#content .banner .contact-bg .contact-desc{
    position: absolute;
    right: 68px;
    top: 100px;
    width: 323px;
}
#content .banner .contact-bg .contact-desc h3{
    font-size: 28px;
    font-weight: normal;
    color: #000;
}
#content .banner .contact-bg .contact-desc h3:nth-of-type(2){
    margin-top: 80px;
}
#content .banner .contact-bg .contact-desc span{
    font-size: 22px;
    font-weight: normal;
    color: #999;
}
#content .banner .contact-bg .contact-desc a{
    font-size: 22px;
    text-decoration: underline;
    color: #000;
}
#content .banner .contact-bg .contact-desc img{
    margin: 0 4px 0 20px;
}
/********** E contact **********/