@charset "utf-8";
/* CSS Document */
.container{ max-width:1367px;}
.grayBg{ background:#f5f5f5;}
.m-bannerBox{ display:none;}
.bannerBox{ background:url(banner.jpg) no-repeat center; height:620px;}
.left-btnBox{ padding-left:39px; box-sizing:border-box; margin-top:352px;}
.bannerBtnBox .b-btn{ width:164px; height:50px; border:1px solid #fff; color:#fff; border-radius:3px; line-height:50px; text-align:center; float:left;font-size: 17px;letter-spacing: 2px; margin-right:45px;}
.bannerBtnBox .redBackground{ background:#ff6743; border:1px solid #ff6743;}
.floor{ padding:97px 0;}
.fl-title{margin-bottom: 70px;}
.fl-title h3{ font-size:40px; color:#050915; font-weight:normal; letter-spacing:4px;}
.fl-title .whatWechat{ font-size:20px; color:#737373;letter-spacing:2px;}

.f1-info{ box-sizing:border-box; padding-left:39px;padding-top: 126px;}
.f1-Tab{background: url(f1Tab1.png) no-repeat center 20%; padding:50px 0; position:relative;}
.pagination{ text-align:center;position: absolute;width: 100%;left: 0;bottom: -20px;}
.swiper-pagination-switch{ width:14px; height:14px; box-shadow:none; background:#000;opacity:0.1; margin:0 8px;}
.swiper-active-switch {opacity:0.3;}
.imageTab li{ float:left; width:33.33%;}
.imageTab li img{ display:block; width:100%;transform: scale(0.85); opacity:0.7;transition: .3s;}
.imageTab li.swiper-slide-active{ z-index:100; position:relative;}
.imageTab li.swiper-slide-active img{transform: scale(1); opacity:1;}

.WeChat-ul li{ font-size:16px; color:#919191; letter-spacing:1px; margin-bottom:45px;}
.WeChat-ul li img{ vertical-align:middle;margin-right: 18px;}

.a-center{ text-align:center;}
.productList{border: 1px solid #b5b5b5; background:#fff;}
.productList li{cursor: pointer;border-left:1px solid #b5b5b5; float:left; position:relative; width:20%; box-sizing:border-box; border-right:0; height:365px;transition:.2s;padding-bottom: 60px;}
.productList li:first-child{ border-left:0;}
.productList li .line{transition:0;}
.productList .curr .line{ position:absolute; width:100%; height:100%; border:1px solid #ff8a6f;left:-1px;top:-1px; z-index:10;}
.productList li.curr{width:40%;}
.productList li .productImgBox{ width:84px; height:84px; margin:78px auto; background:#ff8a6f; border-radius:84px; text-align:center; line-height:84px;transition:.3s;}
.productList .productImgBox img{ vertical-align:middle;}
.productList .productBottom{ text-align:center;transition:.3s; max-height:116px; overflow:hidden;}
.productList .productBottom .productInfo{ display:none;}
.productList .productBottom .proTitle{ font-size:22px; color:#3c3c3c;letter-spacing: 2px; position:relative; padding-bottom:24px;}
.productList .proTitle em{ position:absolute; height:4px; width:60px; border-radius:4px; background:#e5e5e5; left:50%; bottom:0; margin-left:-30px;}
.productList .curr .productImgBox{ margin-bottom:25px; background:#f85a36;}
.productList .curr .proTitle em{ width:40px; margin-left:-20px; background:#f86342;}
.productList .curr .productInfo{ display:block; margin-top:29px; font-size:16px; line-height:24px; color:#848484; letter-spacing:2px;}

.infoFl{ padding:60px 0 90px; position:relative;}
.infoFline{width: 100%;height: 1px;background-image: linear-gradient(to right, #ccc 0%, #000 10%, transparent 10%);background-size: 10px 1px;background-repeat: repeat-x;position: absolute;left: 0;bottom: 0;}

.infoFl .showInfo{ padding-top:90px; box-sizing:border-box;}
.infoFl4 .showInfo{ padding-left:110px;}
.infoFImg{ padding-left:110px; box-sizing:border-box;}
.infoFl .showInfo h3{ font-size:20px; font-weight:normal; height:36px; line-height:36px; display:inline-block; padding:0 26px; background:#f86342; color:#fff; border-radius:20px 0px 20px 0; letter-spacing:1px; margin-bottom:25px;}
.infoFl .showInfo p{ font-size:16px; color:#4a4a4a; line-height:24px; letter-spacing:1px; margin-bottom:82px;}
.infoFl .showInfo ul li{ float:left;text-align:center; margin-right:55px;}
.infoFl .showInfo li:last-child{ margin-right:0;}
.infoFl .showInfo li span{ display:block; color:#4b4b4b; font-size:16px; letter-spacing:1px;margin-top: 2px;}
.infoFl .alignr{ text-align:right;}
.infoFl .alignc{ text-align:center;}
.infoFImgBox img{max-width:100%;}
.iconBox{ height:66px; width:66px; line-height:66px;text-align:center;}
.iconBox img{ vertical-align:middle;}

.floor3{ padding-bottom:0;}
.floor4{ background:url(f4bg.jpg) no-repeat center; padding:58px 0; height:406px; box-sizing:border-box;}
.TeBox img{ width:64px;}
.floor4 .fl-title h3{ color:#fff;}
.floor4 .TeBox{ text-align:center;}
.floor4 .TeBox .arrowBox{ margin-top:20px;}
.floor4 .TeBox .arrowBox1{ text-align:right;}
.floor4 .TeBox .arrowBox2{ text-align:left;}
.floor4 .TeBox .TexB{ margin-top:18px;}
.floor4 .TeBox span{ display:block; font-size:20px; color:#fff; letter-spacing:1px;}

.floor5 .fl-title{ margin-bottom:40px;}
.floor5 ul{ margin-bottom:60px;}
.floor5 li{ float:left; width:25%; text-align:center; margin-top:64px;}
.floor5 .functionBox{ margin:0 50px; padding-top:86px;padding-bottom: 55px; border:1px solid #eee; border-radius:15px;box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);}
.floor5 .functionBox p{margin-top: 25px; font-size:18px; color:#050915; letter-spacing:2px;}
.floor5 .functionS{ display:block; text-align:center; height:54px;}
.floor5 .functionS img{ vertical-align:middle;}

.floor6 ul{ padding:0 37px 50px;}
.floor6 li .caseBox{ margin:25px 13px 0; background:#fff; padding:34px; box-sizing:border-box; border-radius: 4px;}
.floor6 .caseBox .logoInfo{ line-height:30px; height:120px; font-size:16px; overflow:hidden;}
.floor6 .caseBox .logoImgBox{ margin-bottom:5px;}
.floor6 .logoImgBox img{ max-width:100%; display:block;height:80px;}

.floor7 ul{ margin-bottom:50px;}
.floor7 ul li{ float:left; width:25%; text-align:center; margin-top:20px; margin-bottom:20px;}
.floor7 .programBox{ width:200px; height:200px; margin:auto; border-radius:200px;border: 1px solid #eee;box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.1);}
.floor7 .programBox h3{ margin-top:55px; font-weight:normal; text-align:center; font-size:35px; letter-spacing:1px;}
.floor7 .programBox p{ font-size:16px; color:#050915; letter-spacing:1px;}

.floor8{ padding:40px 0; background:url(f8bg.jpg) no-repeat center #f86342; color:#fff;}
.floor8 .codeInfo{ font-size:40px; letter-spacing:4px;box-sizing:border-box; padding-left:45px; line-height:167px;}
.floor8 .codeImg img{ display:block;max-width:100%;}

/* pc屏幕 */
@media all and (min-width: 1367px) and (max-width: 1920px) {

}
/* pc1180屏幕 */
@media all and (min-width: 992px) and (max-width: 1367px) {
	.container{ padding:0 20px;box-sizing: border-box;}
	.f1-info{ padding-left:0;}
	.f1-Tab{background-size: auto 100%;}
	.infoFl4 .showInfo{ padding-left:0}
	.floor5 ul{ margin-left:-20px; margin-right:-20px;}
	.floor5 .functionBox{margin: 0 20px;}
	.floor6 ul{ margin-left:-13px; margin-right:-13px; padding:0; margin-top:0; margin-bottom:25px;}
	.floor8 .codeInfo{ padding-left:0;float:none;display:table-cell;vertical-align:middle; line-height:normal;}
	.floor8 .codeImg{float:none;display:table-cell;vertical-align:middle;text-align:right;}
	.floor8 .codeImg img{ display:inline-block;}
	
}
/* 中等屏幕（平板，小于等于 992px） */
@media all and (max-width: 992px) {
	.m-bannerBox{ display:block;}
	.bannerBox{ display:none;}
	
	.f1-info{ padding-top:0;}
	.container{ padding:0 15px;box-sizing: border-box;}
	.floor1 .container{ padding:0;}
	.m-bannerBox{ display:block;}
	.m-bannerBox img{width:100%; display:block;}
	.bannerBox{ display:none;}
	.productList{ border-bottom:0;}
	.productList li,.productList li.curr{ width:50%}
	.productList li{border-bottom: 1px solid #b5b5b5;}
	.infoFl .showInfo ul li{ width:25%; margin-right:0;}
	.infoFl .showInfo .iconBox{ margin:auto;}
	.infoFImg{ padding-left:0;}
	.infoFl4 .showInfo{ padding-left:0;}
	
	.floor5 ul{ margin-left:-20px; margin-right:-20px;}
	.floor5 li{width:33.33%;margin-top: 40px;}
	.floor5 .functionBox {margin: 0 20px;}
	.floor6 ul{ padding:0; margin-left:-13px; margin-right:-13px;}
	.floor6 li .caseBox{padding: 24px; margin-bottom:25px; margin-top:0;}
	.floor7 ul li{width: 25%;}
	.floor7 .programBox{ width:180px; height:180px;}
	.floor7 .programBox h3 {margin-top: 40px;}
	.floor8 .codeInfo{ padding-left:0; font-size:30px;}
	
}
/* 小屏幕（手机，小于等于768px） */
@media screen and (max-width:768px){
	
	.fl-title{text-align: center;}
	.fl-title h3{ font-size:30px;}
	.container{ padding:0 15px;box-sizing: border-box;}
	.floor1 .container{ padding:0;}
	.f1-Tab{background-size: 100%;}
	.infoFl .showInfo{ padding-top:50px;}
	.WeChat-ul li{ margin-bottom:25px;}
	.infoFl1,.infoFl2 .showInfo,.infoFl4 .showInfo{padding-top:0;}
	.infoFl2 .showInfo, .infoFl4 .showInfo{ margin-bottom:50px;}
	.infoFl .showInfo p{margin-bottom: 52px;}
	.f1-info{ padding-left:15px; padding-right:15px; padding-top:0;}
	.infoFImg{ text-align:center;}
	.floor4 .TeBox .arrowBox{ display:none;}
	.floor5 ul{ margin-left:-15px; margin-right:-15px; margin-bottom:0;}
	.floor5 li{width:50%;margin-top: 30px;}
	.floor5 .functionBox{margin: 0 15px;padding-top: 46px;padding-bottom: 30px;}
	.floor5 .functionBox p {margin-top: 15px;}
	
	.floor6 ul {padding: 0px; margin-left:-15px; margin-right:-15px;}
	.floor6 li .caseBox{margin: 25px 12px 0;padding:20px;}
	.floor7 ul{ margin-bottom:0;}
	.floor7 ul li{ width:50%;}
	
}
/* 小屏幕（手机，小于等于 480px） */
@media screen and (max-width:480px){
	.fl-title {margin-bottom: 30px;text-align: center;}
	.fl-title h3{font-size: 25px;}
	.fl-title .whatWechat {font-size: 14px; margin-top:10px;}
	.WeChat-ul li {font-size: 14px;margin-bottom: 20px;text-align: center;}
	.WeChat-ul li img{ margin-right:5px;width: 20px;}
	.f1-Tab{ background-size:100%;}
	.swiper-pagination-switch{ width:10px; height:10px; margin:0 6px;}
	.productList{border:0; background:none;}
	.productList li{ margin:20px 0px 0px; border:1px solid #b5b5b5;}
	.productList li,.productList li.curr{ width:100%; background:#fff;}
	.infoFl .showInfo p{ font-size:14px; margin-bottom:30px;}
	.infoFl .showInfo p br{ display:none;}
	.infoFl .showInfo li span{ font-size:14px;}
	.infoFl .showInfo h3 {font-size: 16px; height:35px; line-height:35px;border-radius: 30px 0px 30px 0;}
	.f1-info{ padding:0px;}
	
	.floor1 .container{ padding:0;}
	.infoFl .showInfo{ padding-top:50px;}
	.infoFl .f1-info{ padding:0 15px;}
	.infoFl .showInfo ul li{width:25%; margin-right:0;}
	.infoFl .showInfo .iconBox{ margin:auto;}
	.infoFl2 .showInfo,.infoFl4 .showInfo{padding-top:0; padding-left:0;padding-bottom:50px;}
	.infoFImg{ padding-left:0; text-align:center;}
	.floor5 ul{ margin-bottom:0; margin-left:-15px; margin-right:-15px;}
	.productList .productBottom .proTitle {font-size: 18px;}
	.productList .curr .productInfo{font-size: 14px;}
	.floor4{ height:auto;padding: 78px 0;}
	.floor4 .TeBox span{ font-size:14px;}
	.floor4 .TeBox .arrowBox{ display:none;}
	.floor5 .functionBox p{ font-size:14px;}
	.floor6 ul {padding:0px;}
	.floor6 li .caseBox{padding: 20px;margin-top: 0;margin-bottom: 20px;}
	.floor6 li:last-child .caseBox{ margin-bottom:0;}
	.floor6 .caseBox .logoInfo{font-size: 14px;line-height: 25px; height:100px;}
	.floor7 ul{ margin-bottom:0; margin-left:-15px; margin-right:-15px;}
	.floor7 .programBox{width: 150px;height: 150px;}
	.floor7 .programBox h3 {margin-top: 35px;font-size: 25px;}
	.floor7 .programBox p{font-size: 14px;}
	.floor8 .codeInfo{ font-size:25px; line-height:45px;padding:0px; text-align:center;}
	.floor8 .codeImg img{margin:40px auto 20px;}
}