/*================é¦–é¡µæ ·å¼åŠå…¬å…±éƒ¨åˆ†æ ·å¼================*/
body{position: relative;}
.banner{position: relative;}
.banner .pic{ position:relative;}
/*内页in-ban*/
.banner.in-ban .pic{
width: 100%;
height: 324px;
}
.banner.in-ban .pic .lie{position: absolute;left: 0px;top:194px;width: 14.845%;height: 1px;background: #fff;}
.banner.in-ban .pic .w1350{}
.banner.in-ban .pic .w1350 .fl{padding-top: 171px;}
.banner.in-ban .pic .w1350 i{display: block;margin-right: 26px; float: left;width: 35px;height: 46.5px;background: left center no-repeat;}
.banner.in-ban .pic .w1350 b{display: block;float: left;font-size: 30px;color: #fff;}
.banner.in-ban .pic .w1350 b em{padding-left: 10px; font-family: "arial";color: #c0e120;}
.banner.in-ban .pic .w1500{position: absolute;left: 10.9375%;bottom: 0px;height: 50px;line-height: 50px;}
.banner.in-ban .pic .w1500 a{float: left;color: #fff;font-size: 14px;}
.banner.in-ban .pic .w1500 a.other{color: #c1c1c1;}
.banner.in-ban .pic .w1500 a:hover{color: #fff;}
.banner.in-ban .pic .w1500 i{display: block;float: left;width: 20px;color: #fff;font-size: 14px;text-align: center;}
.footer{
position: relative;
z-index: 3;
}
.banner .pic .pro-ban{
display: block;
width: 100%;
height: calc(100vh - 100px);
/*overflow: hidden;*/
}
.banner .pic .pro-ban video{
position: fixed;
right:0;
top:0;
/*min-width:100%;
min-height:50%; */
width: 100%;
height: calc(100vh - 100px);
/*height:100%;*/
z-index:-9999;
background-size: cover;
object-fit: cover;
overflow: hidden;
}
.banner .pic .pos{margin: 0 auto;width:100%;top: 0%; height: 100%;}
.banner .pic .pos .w1500{position: absolute;left: 10.9375%;bottom: 16%;}
.banner .pic .detail-ban{
display: block;
width: 100%;
height:680px;
margin-top: 70px;
}
.banner .pic .pos h1{
color: #fff;
font-size: 40px;
font-weight: 200;
}
.banner .pic .pos h2{
color: #fff;
font-size: 26px;
text-align: left;
font-weight: 200;
margin-bottom: 40px;
}
.banner .pic .pos .p-series a{
/*width: 30%;*/
height: 58px;
line-height: 58px;
display: inline-block;
background-color: #fff;
color: #101010;
text-align: center;
font-size: 26px;
border-radius: 4px;
-moz-transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
-o-transition: all 0.2s linear 0s;
transition: all 0.2s linear 0s;
padding: 0 15px;
}
.banner .pic .pos .p-series a:hover{
color: #8bc34a;
}
.banner .pic .pos .p-series a.on{
background-color: #8bc34a;
color: #fff;
}
.banner .pic .pos.pos-a h1{
text-align: left;
margin-bottom: 22%;
}
.banner .pic .pos.pos-b h1{
text-align: center;
margin-bottom: 35%;
}
.banner .pic .pos.pos-a .p-a,
.banner .pic .pos.pos-a .p-b{
width: 33%!important;
}
.banner .pic .pos.pos-a .p-a{
margin-left: 11%;
}
.banner .pic .pos.pos-a .p-series a,
.banner .pic .pos.pos-a .p-series b{
margin-right: 76px;
}
.banner .pic .pos.pos-b .p-a{
width: 40%;
margin: auto;
text-align: center;
}
.banner .pic .pos.pos-a .p-series a,
.banner .pic .pos.pos-b .p-series a:first-child{
margin-right: 76px;
}
.banner .pic .pos.pos-c h1{
text-align: right;
margin-bottom: 28%;
}
.content .menu{
background: #fff;
height: 100px;
width: 100%;
z-index: 99999;
}
.content .menu h1{
font-size: 26px;
line-height: 100px;
font-weight: 400;
}
.content .menu a.fr{
font-size: 22px;
line-height: 60px;
padding-top: 20px;
font-weight: 400;
color: #101010;
position: relative;
}
.content .menu a.fr:before{
content: '';
background: #8bc34a;
width: 0;
height: 2px;
position: absolute;
left: 0;
bottom: -2px;
-moz-transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
-o-transition: all 0.2s linear 0s;
transition: all 0.2s linear 0s;
}
.content .menu a.fr:hover:before{
width: 100%;
}
.content .menu ul{
}
.content .menu ul li{
display: inline-block;
height: 60px;
line-height: 60px;
margin-left: 60px;
padding-top: 20px;
font-size: 22px;
position: relative;
}
.content .menu ul li:before{
content: '';
background: #8bc34a;
width: 0;
height: 2px;
position: absolute;
left: 0;
bottom: -2px;
-moz-transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
-o-transition: all 0.2s linear 0s;
transition: all 0.2s linear 0s;
}
.content .menu ul li a{
display: block;
text-align: center;
/*padding: 0 10px;*/
color: #101010;
}
/*.content .menu ul li.active{
border-bottom: 2px solid #8bc34a;
}*/
.content .menu ul li:hover:before{
width: 100%;
}
/*ban
------------------------*/
.ban{width:100%;position:relative;height:900px;z-index:1px;/* overflow:hidden; */}
.ban .bd{margin:0 auto;position:relative;z-index:0; overflow:hidden; }
.ban .bd ul{width:100% !important;}
.ban .bd li{width:100% !important;height:900px;overflow:hidden; text-align:center;
}
.ban .bd li a{display:block;}
.ban .hd{width:100%;position:absolute;z-index:99;bottom:-5px;left:0;height:10px;line-height:30px;}
.ban .hd ul{text-align:center;}
.ban .hd ul li{cursor:pointer;display:inline-block;*display:inline;zoom:2; width:40px; height:4px; margin:1px;overflow:hidden;background:#ccc;filter:alpha(opacity=100);line-height:999px; opacity:1}
.ban .hd ul .on{width:40px; height:2px;margin:1px; background:#124b9a;}
.ban .prev,.ban .next{
display: block; position: absolute; z-index: 1; top: 40%; margin-top: -30px; left: 20%; z-index: 1;
width: 50px;height: 100px; background: url(/uploads/image/pswpiicon/slider-arrow.png) 5px /*#eee */no-repeat;
cursor: pointer;filter: alpha(opacity=50);opacity: 0.6; display: block;
}
.ban .next{left:auto;right:20%; background-position:-55px;}
.content .plate-a .w1200{
position: absolute;
left: calc(50% - 600px);
bottom: 10%;
}
.content .plate-a .describe ul li{
float: left;
text-align: center;
}
.content .plate-a .describe ul li i{
display: block;
/*min-height: 48px;*/
line-height: 54px;
color: #fff;
font-size: 28px;
}
.content .plate-a .describe ul li i img{
vertical-align: middle;
}
.content .plate-a .describe ul li span{
display: block;
font-size: 18px;
color: #fff;
margin-top: 20px;
}
.content .plate-a .describe .row-a li{
width: 20%;
}
.content .plate-a .describe .row-b li{
width: 25%;
margin-top: 30px;
}
.content .plate-b {
background: #101010;
}
.content .plate-b .w1500{
padding: 8% 0;
}
.content .plate-b .pb{
width: 45%;
height: 420px;
position: relative;
overflow: hidden;
}
.content .plate-b .pb-a{
float: left;
}
.content .plate-b .pb-b{
float: right;
}
.content .plate-b video{
width: 100%;
height: 100%;
object-fit: cover;
overflow: hidden;
cursor: crosshair;
}
.content .plate-b .pb h1{
width: 380px;
font-size: 26px;
color: #fff;
font-weight: 200;
position: absolute;
top: 20%;
}
.content .plate-b .pb.fl h1{
left: 22.875%;
}
.content .plate-b .pb.fr h1{
right: 22.875%;
}
.content .plate-c{
}
.content .plate-c .pc{
}
.content .plate-c .pc.fl{
width: 280px;
height: 800px;
padding: 50px 70px;
}
.content .plate-c .pc.fl p{
margin: 20px auto 40px;
}
.content .plate-c .parameter{
background: #f5f5f5;
border-radius: 4px;
padding:20px 40px;
line-height: 3;
font-weight: 600;
}
.content .plate-c .pc.fr{
width: calc(100% - 420px);
height: 900px;
}
.content .plate-d{
}
.content .plate-d .pd{
width: 50%;
height: 900px;
position: relative;
}
.content .plate-d .pd.fl{
background-color: #17181a;
}
.content .plate-d .pd.fl .box{
display: table;
width: 380px;
height: 300px;
margin: 300px auto;
}
.content .plate-d .pd.fl h1{
vertical-align: middle;
display: table-cell;
font-size: 26px;
color: #fff;
font-weight: 200;
text-align: center;
}
.content .plate-e{
background: url(/uploads/image/pswpibanner/banner3_bac.jpg) center no-repeat;
background-size: cover;
}
.content .plate-e .pe{
height: 900px;
color: rgba(255,255,255,0.6);
position: relative;
}
.content .plate-e .pe h1{
width: 100%;
text-align: center;
font-weight: 200;
font-size: 30px;
position: absolute;
top: 15%;
}
.content .plate-e .pe .pe-l{
font-size: 28px;
font-weight: 200;
position: absolute;
left: 0;
bottom: 18%;
}
.content .plate-e .pe .pe-r{
font-size: 28px;
font-weight: 200;
position: absolute;
right: 0;
bottom: 18%;
}
.plate-f{
position: relative;
}
.plate-f .pf-ho{
position: absolute;
width: 100%;
z-index: 9;
}
.plate-f .pf-ho .text-box{
background-color: transparent;
display: block;
width: 25%;
height: 800px;
float: left;
cursor: pointer;
position: relative;
color: #fff;
}
.plate-f .pf-ho .text-box:before{
content: '';
background: rgba(255,255,255,0.2);
height: 100%;
width: 1px;
position: absolute;
right: 0;
top: 0;
}
.plate-f .pf-ho .text-box h1{
width: 90%;
text-align: center;
position: absolute;
bottom: 50%;
left: 5%;
font-size: 24px;
font-weight: 400;
-moz-transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
-o-transition: all 0.2s linear 0s;
transition: all 0.2s linear 0s;
}
.plate-f .pf-ho:hover .text-box h1{
bottom: 50px;
}
.plate-f .pf-ho .text-box:hover h1{
bottom: 60px;
}
.plate-f .pf-ho .text-box p{
display: none;
}
.content .plate-f ul li{
height: 800px;
float: left;
width: 25%;
text-align: center;
color: #fff;
overflow: hidden;
position: relative;
-moz-transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
-o-transition: all 0.2s linear 0s;
transition: all 0.2s linear 0s;
}
.content .plate-f ul li:before{
content: '';
background: rgba(0,0,0,0.4);
width: 100%;
height: 100%;
position: absolute;
left: 0;
}
.content .plate-f ul li.w100{
width: 100%!important;
}
.content .plate-f ul li.w0{
width: 0!important;
}
.content .plate-f ul li.w100:before{
background: rgba(0,0,0,0.3);
}
/*.content .plate-f ul li:not(:last-child):before{
content: '';
background: rgba(255,255,255,0.2);
height: 100%;
width: 1px;
position: absolute;
right: 0;
top: 0;
}*/
/*.content .plate-f ul li.pf-a{
background: url(/uploads/image/pswpi/001.jpg) center no-repeat;
background-size: cover;
}
.content .plate-f ul li.pf-b{
background: url(/uploads/image/pswpi/002.jpg) center no-repeat;
background-size: cover;
}
.content .plate-f ul li.pf-c{
background: url(/uploads/image/pswpi/003.jpg) center no-repeat;
background-size: cover;
}
.content .plate-f ul li.pf-d{
background: url(/uploads/image/pswpi/004.jpg) center no-repeat;
background-size: cover;
}*/
.content .plate-f ul li.pf-a{
background: url(/uploads/image/pswpi/1.png) center no-repeat;
background-size: cover;
}
.content .plate-f ul li.pf-b{
background: url(/uploads/image/pswpi/2.png) center no-repeat;
background-size: cover;
}
.content .plate-f ul li.pf-c{
background: url(/uploads/image/pswpi/3.png) center no-repeat;
background-size: cover;
}
.content .plate-f ul li.pf-d{
background: url(/uploads/image/pswpi/4.png) center no-repeat;
background-size: cover;
}
.content .plate-f ul li .box{
display: table;
height: 200px;
margin:300px auto;
}
.content .plate-f ul li .box span{
vertical-align: middle;
display: table-cell;
font-size: 26px;
}
.content .plate-g{
color: #fff;
position: relative;
}
.content .plate-g i,
.content .plate-k i{
display: block;
width: 100%;
height: 900px;
position:relative;
overflow:hidden;
}
.content .plate-g i img,
.content .plate-k i img{
position: absolute;
top: 50%;
left: 50%;
display: block;
min-width: 100%;
min-height: 100%;
transform:translate(-50%,-50%);
}
.content .plate-g .pg{
height: 900px;
font-weight: 200;
position: absolute;
top: 0;
left: 10.9375%;
z-index: 99;
}
.content .plate-g .pg .pg-b{
width: 100%;
font-size: 30px;
text-align: center;
position: absolute;
bottom: 20%;
}
.content .plate-g .pg .pg-l,
.content .plate-g .pg .pg-r{
width: 25%;
font-size: 26px;
position: absolute;
top: 40%;
}
.content .plate-g .pg .pg-r{
right: 0;
}
.content .plate-h .ph-a{
width: calc(50% - 2px);
position: relative;
}
.content .plate-h .ph-a.h1 i{
height: 600px;
}
.content .plate-h .ph-a.h2 i{
height: 860px;
}
.content .plate-h .ph-a i{
display: block;
width: 100%;
position:relative;
overflow:hidden;
}
.content .plate-h .ph-a i img{
position: absolute;
top: 50%;
left: 50%;
display: block;
min-width: 100%;
min-height: 100%;
transform:translate(-50%,-50%);
}
.content .plate-h .ph-a span{
font-size: 26px;
color: #fff;
text-align: center;
width: 60%;
position: absolute;
top: 45%;
left: 20%;
z-index: 2;
}
.content .plate-i {
}
.content .plate-i h1{
background-color: #737373;
line-height: 100px;
text-align: center;
font-size: 26px;
color: #fff;
font-weight: 200;
}
.content .plate-i .pi{
padding: 4% 7%;
}
.content .plate-i .pi .pi-a{
width: 48%;
}
.content .plate-i .pi-a i{
display: block;
width: 100%;
height: 500px;
position:relative;
overflow:hidden;
}
.content .plate-i .pi-a i img{
position: absolute;
top: 50%;
left: 50%;
display: block;
min-width: 100%;
min-height: 100%;
transform:translate(-50%,-50%);
}
.content .plate-i .pi-a span{
display: block;
width: 100%;
line-height: 80px;
font-size: 26px;
color: #101010;
text-align: center;
}
.content .plate-j{
margin: 20px auto;
}
.content .plate-j .pj-a{
width: 30%;
}
.content .plate-j .pj-a .box{
display: table;
width: 80%;
height: 120px;
margin:200px auto;
}
.content .plate-j .pj-a .box h1{
display: table-cell;
vertical-align: middle;
text-align: center;
font-weight: 200;
}
.content .plate-j .pj-b{
width: 70%;
}
.content .plate-j .pj-b i{
display: block;
width: 100%;
height: 520px;
position:relative;
overflow:hidden;
}
.content .plate-j .pj-b i img{
position: absolute;
top: 50%;
left: 50%;
display: block;
min-width: 100%;
min-height: 100%;
transform:translate(-50%,-50%);
}
.content .plate-k{
position: relative;
}
.content .plate-k i{
display: block;
width: 100%;
height: 900px;
position:relative;
overflow:hidden;
}
.content .plate-k i img{
position: absolute;
top: 50%;
left: 50%;
display: block;
min-width: 100%;
min-height: 100%;
transform:translate(-50%,-50%);
}
.content .plate-k .pk{
color: #fff;
position: absolute;
z-index: 2;
}
.content .plate-k .pk.pk-a{
width: 100%;
font-size: 30px;
text-align: center;
position: absolute;
top: 15%;
}
.content .plate-k .pk.pk-b{
width: 50%;
position: absolute;
top: 70%;
left: 25%;
text-align: center;
font-size: 26px;
}
.content .plate-k .pk.pk-b span{
display: inline-block;
padding: 0 20px;
}
.plate-l{
background: #000;
height: 900px;
}
.content .plate-l .pl{
height: inherit;
position: relative;
}
.content .plate-l .pl h1{
color: #fff;
/*margin-left: 50%;*/
font-weight: 200;
position: absolute;
top:90px;
left: 50%;
z-index: 2;
}
.content .plate-l .tab{
width: 100%;
position: absolute;
top: 90px;
}
.content .plate-l .tab-hd {
position: absolute;
top: 60px;
left: 50%;
}
.content .plate-l .tab-hd li{
float:left;
width: 71px;
height: 26px;
line-height: 26px;
margin-right: 15px;
margin-bottom: 10px;
padding: 0 15px;
color:#666;
font-weight: 600;
text-align:center;
cursor:pointer;
border:2px solid #666;
border-radius: 15px;
-moz-transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
-o-transition: all 0.2s linear 0s;
transition: all 0.2s linear 0s;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
}
.content .plate-l .tab-hd li:hover,
.content .plate-l .tab-hd li.active{
color:#fff;
border:2px solid #fff;
}
.content .plate-l .tab-bd>li{
display:none;
font-size:24px;
}
.content .plate-l .tab-bd>li.thisclass{
display:list-item;
}
.content .plate-l .tab-bd .tab-l{
width: 45%;
}
.content .plate-l .tab-bd i{
display: block;
width: 100%;
height: 720px;
position:relative;
overflow:hidden;
}
.content .plate-l .tab-bd i img{
position: absolute;
top: 50%;
left: 50%;
display: block;
min-width: 100%;
min-height: 100%;
transform:translate(-50%,-50%);
}
.content .plate-l .tab-bd .tab-r{
width: 50%;
margin-left: 5%;
padding-top: 150px;
}
.content .plate-l .tab-bd .tab-r ol{
color: #fff;
width: 45%;
float: left;
margin-right: 5%;
}
.content .plate-l .tab-bd .tab-r ol li{
font-size: 14px;
position: relative;
padding: 6px 0 14px;
}
.content .plate-l .tab-bd .tab-r ol li:before{
content: '';
width: 30px;
height: 1px;
background: #fff;
position: absolute;
left: 0;
top: 0;
}
.content .plate-l .tab-bd .tab-r ol li h4{
}
.content .plate-l .tab-bd .tab-r ol li h5{
font-weight: 200;
line-height: 1.5;
}
/*.content .plate-l .tab-bd .tab-r ol{
height: 400px;
color: #fff;
-moz-column-count:2;
-webkit-column-count:2;
column-count:2;
}
.content .plate-l .tab-bd .tab-r ol li{
font-size: 14px;
position: relative;
padding: 6px 0 14px;
}
.content .plate-l .tab-bd .tab-r ol li:before{
content: '';
width: 30px;
height: 1px;
background: #fff;
position: absolute;
left: 0;
top: 0;
}*/
.content .plate-m{
padding: 100px;
line-height: 1.5;
}
.content .download{
background: #fff;
}
.content .plate-m .download li{
width:calc(46% - 2px);
margin: 0 2%;
float: left;
border:1px solid #eee;
}
.content .plate-m .download li .dl-l{
background: url(/uploads/image/pswpiicon/download.png) no-repeat center #eee;
background-size: 50px;
float: left;
width: 160px;
height: 160px;
cursor: pointer;
}
.content .plate-m .download li .dl-r{
float: left;
width: calc(100% - 220px);
height: 120px;
padding: 20px 30px;
position: relative;
}
.content .plate-m .download li .dl-r h1{
color: #333;
font-weight: 300;
}
.content .plate-m .download li .dl-r a{
display: block;
font-size: 16px;
position: absolute;
bottom: 20px;
right: 30px;
color: #999;
}
.content .plate-m .download li .dl-r a:hover{
color: #8bc34a;
}
.product{
padding-top: 70px;
margin-bottom: 100px;
}
.product .pdt-tit{
width: 80%;
margin:0 auto;
font-size: 48px;
font-weight: 400;
text-align: center;
margin-top: 100px;
color: #666;
}
.product .pdt-jj{
width: 80%;
margin:80px auto;
font-size: 28px;
text-align: left;
color: #50aac3;
font-weight: 200;
line-height: 1.4;
}
.product .pdt-list{
}
.product .pdt-list li{
margin: 10px;
float: left;
}
.product .pdt-list li:first-child{
width: calc(100% - 20px) ;
}
.product .pdt-list li:not(:first-child){
width: calc(50% - 20px) ;
}
.product .pdt-list li a{
display: block;
height: 25vw;
}
.product .pdt-list li a .box{
height: inherit;
display: block;
position: relative;
}
.product .pdt-list li:hover a .box{
background: #eee;
-moz-transition: all 0.5s linear 0s;
-webkit-transition: all 0.5s linear 0s;
-o-transition: all 0.5s linear 0s;
transition: all 0.5s linear 0s;
}
.product .pdt-list li a .box .item-a{
background: #f5f5f5;
height: 100%;
position: absolute;
left:0;
top:0;
z-index: 1;
-moz-transition: all 0.5s linear 0s;
-webkit-transition: all 0.5s linear 0s;
-o-transition: all 0.5s linear 0s;
transition: all 0.5s linear 0s;
}
.product .pdt-list li:hover a .box .item-a{
background: #eee;
}
.product .pdt-list li a .box .item-b{
position: absolute;
left:10%;
top:5%;
right: 10%;
bottom:15%;
z-index: 2;
-webkit-transform: scale(0.95);
-ms-transform: scale(0.95);
-o-transform: scale(0.95);
transform: scale(0.95);
-moz-transition: all 0.5s linear 0s;
-webkit-transition: all 0.5s linear 0s;
-o-transition: all 0.5s linear 0s;
transition: all 0.5s linear 0s;
}
.product .pdt-list li:hover a .box .item-b{
-webkit-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
.product .pdt-list li a .box .item-c{
padding: 20px 26px;
position: absolute;
left:0;
top:0;
right: 0;
bottom:0;
z-index: 3;
display: flex;
align-items: flex-end;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-align: end;
align-items: flex-end;
}
.product .pdt-list li a .box .item-c .title{
width: 100%;
display: flex;
display: -ms-flexbox;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-align: end;
align-items: flex-end;
-moz-transition: all 0.5s linear 0s;
-webkit-transition: all 0.5s linear 0s;
-o-transition: all 0.5s linear 0s;
transition: all 0.5s linear 0s;
}
.product .pdt-list li a .box .item-c .title h1{
color: #666;
font-size: 30px;
line-height: 38px;
font-weight: 300;
}
.product .pdt-list li a .box .item-c .title span{
background: url(/uploads/image/pswpiicon/arrow.png) center no-repeat;
background-size: 30px;
display: block;
width: 30px;
height: 30px;
}
.content .menu01{
background: rgba(35,37,38,1);
width: 100%;
height: 100px;
z-index: 99999;
}
.content .menu01 h1{
color: #fff;
font-size: 26px;
line-height: 100px;
font-weight: 400;
}
.content .menu01 ul{
}
.content .menu01 ul li{
display: inline-block;
height: 60px;
line-height: 60px;
margin-left: 60px;
font-size: 22px;
position: relative;
padding-top: 20px;
}
.content .menu01 ul li:before{
content: '';
background: #8bc34a;
width: 0;
height: 2px;
position: absolute;
left: 0;
bottom: -2px;
-moz-transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
-o-transition: all 0.2s linear 0s;
transition: all 0.2s linear 0s;
}
.content .menu01 ul li a{
display: block;
text-align: center;
/*padding: 0 10px;*/
color: #fff;
}
.content .menu01 ul li.on{
border-bottom: 2px solid #8bc34a;
}
.content .menu01 ul li:hover:before{
width: 100%;
}
.content .title-bread{
background: #f7f7f7;
position: relative;
}
.content .title-bread i{
position: absolute;
top: -100px;
}
.content .title-bread .w1200{
padding: 40px 0;
}
.content .title-bread .tit h1{
display: inline-block;
font-size: 36px;
font-weight: 300;
color: #666
}
.content .title-bread .tit span{
font-size: 36px;
font-weight: 300;
color: #8bc34a;
}
.content .title-bread .bread{
color: #999;
}
.content .title-bread .bread a{
color: #999;
font-weight: 200;
}
.content .title-bread .bread a:not(:last-child):hover{
color: #8bc34a;
}
.content .parts {
}
.content .parts .pt{
padding: 4% 0;
}
/*.content .parts h1{
background-color: #737373;
line-height: 100px;
text-align: center;
font-size: 26px;
color: #fff;
font-weight: 200;
}
.content .parts .pt .pt-a{
width: 48.5%;
cursor: pointer;
}
.content .parts .pt .pt-a:nth-child(2n 1){
float: left;
}
.content .parts .pt .pt-a:nth-child(2n 2){
float: right;
}
.content .parts .pt-a i{
display: block;
width: 100%;
height: 360px;
position:relative;
overflow:hidden;
}
.content .parts .pt-a i img{
position: absolute;
top: 50%;
left: 50%;
display: block;
min-width: 100%;
min-height: 100%;
transform:translate(-50%,-50%);
}
.content .parts .pt-a span{
display: block;
width: 100%;
line-height: 60px;
font-size: 20px;
color: #101010;
text-align: center;
}
*/
.parts .pdt-list{
}
.parts .pdt-list li{
margin: 10px;
float: left;
width: calc(50% - 20px) ;
}
.parts .pdt-list li a{
display: block;
height: 350px;
}
.parts .pdt-list li a .box{
height: inherit;
display: block;
position: relative;
}
.parts .pdt-list li:hover a .box{
background: #eee;
-moz-transition: all 0.5s linear 0s;
-webkit-transition: all 0.5s linear 0s;
-o-transition: all 0.5s linear 0s;
transition: all 0.5s linear 0s;
}
.parts .pdt-list li a .box .item-a{
background: #f5f5f5;
height: 100%;
position: absolute;
left:0;
top:0;
z-index: 1;
-moz-transition: all 0.5s linear 0s;
-webkit-transition: all 0.5s linear 0s;
-o-transition: all 0.5s linear 0s;
transition: all 0.5s linear 0s;
}
.parts .pdt-list li:hover a .box .item-a{
background: #eee;
}
.parts .pdt-list li a .box .item-b{
position: absolute;
left:10%;
top:5%;
right: 10%;
bottom:15%;
z-index: 2;
-webkit-transform: scale(0.95);
-ms-transform: scale(0.95);
-o-transform: scale(0.95);
transform: scale(0.95);
-moz-transition: all 0.5s linear 0s;
-webkit-transition: all 0.5s linear 0s;
-o-transition: all 0.5s linear 0s;
transition: all 0.5s linear 0s;
}
.parts .pdt-list li:hover a .box .item-b{
-webkit-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
.parts .pdt-list li a .box .item-c{
padding: 20px 26px;
position: absolute;
left:0;
top:0;
right: 0;
bottom:0;
z-index: 3;
display: flex;
align-items: flex-end;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-align: end;
align-items: flex-end;
}
.parts .pdt-list li a .box .item-c .title{
width: 100%;
display: flex;
display: -ms-flexbox;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-align: end;
align-items: flex-end;
-moz-transition: all 0.5s linear 0s;
-webkit-transition: all 0.5s linear 0s;
-o-transition: all 0.5s linear 0s;
transition: all 0.5s linear 0s;
}
.parts .pdt-list li a .box .item-c .title h1{
color: #666;
font-size: 30px;
line-height: 38px;
font-weight: 300;
}
.parts .pdt-list li a .box .item-c .title span{
background: url(/uploads/image/pswpiicon/arrow.png) center no-repeat;
background-size: 30px;
display: block;
width: 30px;
height: 30px;
}
.download h1{
font-size: 20;
font-weight: 300;
margin-bottom: 15px;
color: #666;
}
.download .dl-l,.download .dl-r{
width: 48.5%;
}
.download .w1200{
padding: 4% 0;
}
.download .list{
margin-bottom: 15px;
}
.download .list>div{
float: left;
}
.download .list .list-a{
width: 50%;
}
.download .list .list-a p{
color: #8bc34a;
}
.download .list .list-a span{
color: #999;
}
.download .list .list-b{
width: 50%;
}
.download .list .list-b a{
display: inline-block;
margin-left: 10px;
padding: 2px 8px;
border: 1px solid #707473;
background: #f7f8f9;
color: #a6acaa;
text-transform: uppercase;
}
/*products 产å“ä¸å¿ƒ*/
.products{}
.products .top{border-bottom: #ddd 1px solid;}
.products .top ul{padding: 33px 0 23px; }
.products .top ul li{margin-bottom: 10px; float: left;width: 12.5%;width: 14.28%; cursor: pointer;}
.products .top ul li a{ padding-right: 11px; position: relative;display: inline-block;}
.products .top ul li p{position: relative;z-index: 2; font-size: 16px;color: #999;line-height: 32px;}
.products .top ul li i{position: absolute;left: 0px;bottom: 7px;width: 100%;height: 7px;background: #fff;}
.products .top ul li.other i,.products .top ul li a:hover i{background: #c0e120;}
/*plate-n*/
.content .plate-n{
background: url(/uploads/image/pswpi/bg01.jpg) no-repeat center top;
background-size: cover;
height:750px;
}
.content .plate-n .txtcon{
padding-top:150px;
position:relative
}
.content .plate-n .txtbox{width:450px;color:#fff}
.content .plate-n .txtbox h3{font-size:40px;line-height:70px}
.content .plate-n .txtbox p{line-height:30px}
.content .plate-n .txtbox .hd{border-bottom:1px solid #fff;padding-bottom:20px;margin-bottom:20px}
.content .plate-n .imgbox{position:absolute;top:200px;right:0}
.content .plate-n .imguav{margin-right:220px}
.content .plate-n .imgtablepc{margin-top:30px}
/*plate-o æ•°å—æ»šåЍ*/
.content .datarow{padding:40px 0;background:#222425;color:#fff}
.content .datarow ul{margin-left:-1px;overflow:hidden;zoom:1}
.content .datarow ul li{float:left;width:33.3333%;text-align:center}
.content .datarow ul .inner{border-left:1px solid #363636}
.content .datarow ul .p1{font-size:20px}
.content .datarow ul .p2{font-size:80px}
.content .datarow ul .p1{font-size:20px}
.ghost-container {
width: 1200px;
height: 600px;
margin: 0 auto;
position:relative;
box-sizing:border-box;
}
.ghost-container .left-box{
position: absolute;
left: 0;
top: 50%;
width: 450px;
height: 270px;
margin-top: -180px;
}
.ghost-container .left-box .pic .scroll{
padding-left: 40px;
}
.ghost-container .left-box .hotspot{width: 100%;height: 100%;overflow:hidden;position:relative}
.ghost-container .left-box .hotspot .pic{ position:relative; height:260px;}
.ghost-container .left-box .hotspot .pic li{overflow:hidden; float:left; font-size: 16px; line-height: 30px;}
.ghost-container .left-box .hotspot .pic h3 {
font-size: 34px;
line-height: 42px;
margin-bottom: 10px;
}
.ghost-container .left-box .hotspot .pic h3 .aicon { display: inline-block; width: 44px; height: 40px; background: ; vertical-align: middle; }
.ghost-container .left-box .hotspot .pic h3 .aicon.qf { background-position: -44px 0;}
.ghost-container .left-box .hotspot .pic h3 .aicon.fh { background-position: -88px 0;}
.ghost-container .left-box .hotspot .pic h3 .aicon.jl { background-position: -132px 0;}
.ghost-container .left-box .hotspot .txt{
height:30px;
overflow:hidden;
position:absolute;
top: 250px;
left:0;
}
.ghost-container .left-box .hotspot .bl {
margin-left: 40px;
}
.ghost-container .left-box .hotspot .bl .btn1{
display: block;
width: 14px;
height: 14px;
float:left;
margin-right: 25px;
border-radius: 7px;
background: #dcdcdc;
}
.ghost-container .left-box .hotspot .bl .btn1.on {
background: #8bc34a;
}
.ghost-container .right-box{
position: absolute;
right: 40px;
top: 25%;
width: 700px;
height: auto;
/*padding: 84px 27px 87px 23px;
margin-top: -350px;
background: yellow;*/
/*background: url(/uploads/image/pswpipage/phone_bg.png) center no-repeat;*/
}
.ghost-container .right-box .phone-inner-img {
width: 100%;
height: auto;
position: absolute;
top: 0;
left: 0;
}
.ghost-container .right-box .phone-inner-img img {
display: block;
width: 100%;
}
/*plate-p 拆解*/
.plate-p{
padding:100px 0;
}
.plate-p h1{
text-align: center;
}
.plate-p .dismantle{
height: 1000px;
position: relative;
font-size: 20px;
}
.plate-p .dismantle .dte-img{
width:300px;
position: absolute;
left: calc(50% - 150px);
}
.plate-p .dismantle .dte-img img{
width: 100%;
}
.plate-p .dismantle .img-a{
top: 100px;
z-index: 1;
}
.plate-p .dismantle .img-b{
top: 162px;
z-index: 4;
}
.plate-p .dismantle .img-c{
top: 316px;
z-index: 3;
}
.plate-p .dismantle .img-d{
top: 366px;
z-index: 2;
}
.plate-p .dismantle .dte-text{
width:300px;
}
.plate-p .dismantle .text-a{
position: absolute;
top: 100px;
}
.plate-p .dismantle .text-b{
position: absolute;
top: 162px;
right: 0;
}
.plate-p .dismantle .text-c{
position: absolute;
top: 316px;
}
.plate-p .dismantle .text-d{
position: absolute;
top: 366px;
right: 0;
}
/*改的部分*/
.proshow .dismantle {
height: 1000px;
}
.proshow .dismantle .img-a {
z-index: 8;
}
.proshow .dismantle .img-b {
z-index: 7;
}
.proshow .dismantle .img-b.skrollable-before {
top: 142px;
}
.proshow .dismantle .img-b-1 {
z-index: 9;
}
.proshow .dismantle .img-c {
top: 300px;
z-index: 3;
}
.proshow .dismantle .img-c.skrollable-before {
top: 100px;
}
.proshow .dismantle .img-d {
z-index: 5;
}
.proshow .dismantle .img-d.skrollable-between {
top: 400px;
}
/*.proshow .dismantle .text-c {
top: 300px;
}
.proshow .dismantle .text-d {
top: 350px;
}*/
.proshow .dismantle .text-d.skrollable-between {
top: 300px;
}
.proshow .dismantle .dte-img img {
width: 68%;
}
/*8.19*/
.plate-p.plate-show .dismantle .dte-img {
width: 210px;
}
.plate-p.plate-show .dismantle .img-a {
left: calc(50% - 155px);
z-index: 99;
}
.plate-p.plate-show .dismantle .img-b {
z-index: 89;
}
.plate-p.plate-show .dismantle .img-a.skrollable-after {
}
.plate-p.plate-show .dismantle .img-a.skrollable-between {
}
.plate-p.plate-show .dismantle .img-a.skrollable-before {
}
.plate-p.plate-show .dismantle .img-b.skrollable-after {
top: 0;
}
.plate-p.plate-show .dismantle .img-b.skrollable-between {
top: 60px;
}
.plate-p.plate-show .dismantle .img-b.skrollable-before {
top: 135px;
}
.plate-p.plate-show .dismantle .img-c.skrollable-after {
top: 100px;
}
.plate-p.plate-show .dismantle .img-c.skrollable-between {
top: 110px;
}
.plate-p.plate-show .dismantle .img-c.skrollable-before {
top: 120px;
}
.plate-p.plate-show .dismantle .img-d.skrollable-after {
top: 345px;
}
.plate-p.plate-show .dismantle .img-d.skrollable-between {
}
.plate-p.plate-show .dismantle .img-d.skrollable-before {
top: 300px;
}
.plate-p.plate-show .dismantle .img-d {
z-index: 88;
}