@charset "utf-8";
/* CSS Document */
html, body, div, span, object, iframe,h1, h2,
h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn,
em, img, ins,kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd,
ol, ul, li,fieldset, form, label, legend,table, caption, tbody,
tfoot,thead,tr, th, td,article, aside, canvas, details, figcaption,
figure, footer, header, menu, nav, section, summary,time, mark,
audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	outline-style:none;/*FF*/
}
li{ list-style:none;}
img{ vertical-align:top; border:none;overflow:hidden;}
a{ text-decoration:none;}
.fl{ float:left;}
/*.fr{ float:right;}*/
.pos{position:absolute;}
.fix{position:fixed;}
.position{position:absolute;top: 0;}
.fixed{position:fixed;top: 0;left: 0;}
.relative{position:relative;}
i{font-style:normal;}
b{font-weight: normal;}
.full{width:100%;height:100%;min-height:900px;}
/*.clear:after{ content:''; display:block; clear:both;}*/
input,textarea,select{ background:none; border:none; outline:none;border-radius:0;margin:0;padding:0; resize:none;-webkit-appearance: none;}


	html{height:100%;}
body{font-family: Arial;
	color: #fff;
	background: #000;
	position: relative;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	/*font-family:"思源黑体 CN";*/
	font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;
	min-height:900px;
	overflow:auto
}
.box{
	/*min-width:1200px;*/
	-webkit-overflow-scrolling:touch;
	min-height: 700px;
	height:100%;
	position:absolute;
	top: 0;
	left: 0;
	margin:0 auto;
}
.mt5{
	margin-top: 5px;
}
.mt40{
	margin-top:40px;
}
.news-logo{
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin-bottom: 10px;
}
.news-logo div{
	flex:1;
}
.news-logo div img{
	width:auto;
}
.limit{
	width:1000px;
	height: 700px;
	position: absolute;
	left:50%;
	margin-left:-500px;
	top:50%;
	margin-top:-350px;
}

/*@media screen and (max-height: 900px) {
	.limit {
		margin-top:-270px;
	}
}*/
body{
    position: absolute;
    width: 100%;
    height: 100%;
}
.news-in{
	width:1000px;
	height: 100%;
	position: absolute;
	top:0;
	left:50%;
	margin-left:-500px;
	overflow: hidden;
}
.nav{
	width: 800px;
    top: 0;
    left: 50%;
    margin-left: -400px;
    z-index: 3;
    overflow: hidden;
}
.logo{
	width: 126px;
	height:54px;
	top:20px;
	left:23px;
	z-index: 3;
}

.logo a{
	display:block;
	width: 126px;
	height:54px;
	background: url("../images/logo.png") center no-repeat;
	background-size: cover;
}
.navBar{
	margin-top:43px;
	font-size:20px;
	line-height: 20px;
	color: #959595;
}
.navBar a{
	font-size:20px;
	line-height: 20px;
	color: #959595;
	width:100px;
	text-align: center;
    float:left;
    transition: all 300ms linear;
    -webkit-transition: all 100ms linear;
}
.navBar span{
	font-size:20px;
	line-height: 20px;
	color: #959595;
	margin-left:25px;
}
.navBar .nav-click{
	color: #fff;
}
.navBar a:hover{
	color: #fff;
    cursor:pointer;
    transform:translate(5px,-2px) ;
    -webkit-transform:translate(5px,-2px) ;
}
.navBar span:hover{
	color: #fff;
	cursor:pointer;
}
.black-bg{
	background: rgba(0,0,0,.5);
}

.home-con{
	width:900px;
	height:283px;
	top:50%;
	margin-top:-141px;
	left:0;
}
.home-con p{
	color: #fff;
	font-size:72px;
	line-height:100px;

}
.home-con .p-normal{
	font-size:22px;
	letter-spacing:12px;
	color: #d8d8d8;
	line-height: 130px;
}
.p-normal img{
	padding-top:60px;
	margin-left:-6px;
}

.bg-in{
	background: #000;
}


.home-con p{
	transform: perspective(360px) rotatex(0deg) rotatey(0deg);
	-webkit-transform: perspective(360px) rotatex(0deg) rotatey(0deg);
	transform-style:preserve-3d;
	-webkit-transform-style:preserve-3d;
	display: inline-block;
  }
  .home-con b{
	animation:index-anim-b 8000ms linear infinite;
	 transform-origin:100% 60%;
  }
  @keyframes index-anim-b{
	0%{
	  transform:rotateX(0deg);
	}
	3%{
	  transform:rotateX(360deg);
	}
	100%{
		transform:rotateX(360deg);
	}
  }
.works-btm{
	width:100%;
	height:547px;
	/* background: url("../images/wave.gif")tpa=http://www.nplusgroup.com/images/wave.gif center no-repeat; */
	bottom:0;
	left:0;
}
.list-right{
	width:129px;
	height:26px;
	top:50%;
	right:0;
	margin-top:-65px;
}
.slide-list{
	width:100px;
	top:50%;
	right:0;
	z-index: 1;
}
.slide-list p{
	font-size:14px;
	color: #959595;
	line-height: 14px;
	margin-bottom: 13px;
}
.slide-list section{
	width:129px;
	height:1px;
	background: #fff;
	display:none;
}

.slide-list li{
	height:26px;
	padding-bottom: 26px;
	cursor: pointer;
}
.about-click p{
	color:#fff;
}
.about-click section{
	display: block;
}
.list-right p{
	font-size:14px;
	color: #fff;
	line-height: 14px;
}
.slide-list section,.list-right section{
	width: 26px;
    height: 3px;
    background: #fff;
    margin-top: -22px;
    float: right;
}

.slogan{
	top:55px;
	left:0;
	color: #fff;
}
.slogan .s1{
	margin-bottom:1px;
}
.slogan h1{
	font-size:60px;
}
.slogan h2{
	font-size:48px;
}
.slogan span{
	margin-top:24px;
	font-size:30px;
	margin-left:17px;
}
.slogan i{
	width:33px;
	height:6px;
	background: #fff;
	margin-right:26px;
	margin-top:24px;
}
.works-show{
	width:1200px;
	height:460px;
	position: absolute;
	top:50%;
	background:#000;
	overflow:hidden;
	margin-top:-110px;
}
.list-con{
	padding-top:27px;
	font-size:18px;
	top:382px;
	left:0;
}
.list-con span{
	color: #959595;
	margin-right:16px;
}
.list-con span:hover{
	cursor: pointer;
	color: #fff;
}
.list-con .list-click{
	text-decoration: underline;
	color: #fff;
}
.list-con span i{
	margin:0 3px 0 3px;
}
.png-left{
	width:33px;
	height:68px;
	background:url("../images/list-left.png")/*tpa=http://www.nplusgroup.com/images/list-left.png*/ center no-repeat rgba(0,0,0,.5);
	top:196px;
	left:0;
	display:none;
	z-index: 3
}
.png-right{
	width:33px;
	height:68px;
	background:url("../images/list-right.png")/*tpa=http://www.nplusgroup.com/images/list-right.png*/ center no-repeat rgba(0,0,0,.5);
	top:196px;
	right:0;
	z-index: 3
}

.png-left:hover{
	cursor: pointer;
}
.png-right:hover{
	cursor: pointer;
}
.more{
	top:434px;
	right:0;
	font-size:16px;
	text-decoration: underline;
	color: #7b7b7b;
}
.more:hover{
	color:#fff;
}
.works-list{
	width:798px;
	height:550px;
	overflow: hidden;
}
.works-list li img {
	width:798px;
	height:382px;
}
.list-ul{
	width:100%;
	height:460px;
	overflow:hidden;
}
.list-ul-in{
	width:500%;
	height:100%;
	overflow: hidden;
	position: absolute;
	left:0;
	top:0;
}
.list-ul-in li{
	width:20%;
	height: 460px;
}
.list-ul-in li:hover{
	cursor: pointer;
}
.list-ul-in i:hover{
	background-color: rgba(0,0,0,.9);
}
.news-title{
	top:152px;
	left:0;
}
.news-title h2{
	font-size:60px;
}
.news-title p{
	font-size: 26px;
	margin-top:28px;
	margin-left:10px;
}
.news-frame{
	width:278px;
	min-height:456px;
	border-top:1px solid #fff;
	border-right:1px solid #fff;
	top:243px;
	left:-1px;
}
.news-list{
	width:719px;
	min-height:456px;
	overflow-x: hidden;
	overflow-y: scroll;
	top:244px;
	left: 278px;
}
.news-list::-webkit-scrollbar{
	display: none;
}
.chain{
	width:8px;
	height:1px;
	background: #fff;
	margin-top:59px;
}
.news-ul img{
	margin:0 41px 0 15px;
}
.news-ul h3{
	width:300px;
	font-weight: normal;
	font-size:16px;
	line-height: 20px;
}
.news-ul h3:hover{
	color: #d5d5d5;
}
.news-ul p{
	font-size:16px;
	color: #959595;
	margin:12px 0 51px 0;
}
.news-ul p i{
	margin:0 3px 0 3px;
}
.news-ul a{
	position: absolute;
	bottom:0;
	left:0;
	font-size: 16px;
	color: #959595;
	text-decoration: underline;
}
.news-div{
	height:112px;
}
.news-ul a:hover{
	cursor: pointer;
	color:#fff;
}
.news-ul li{
	width:719px;
	height:115px;
	margin-bottom: 23px;
	cursor: pointer;
}
.news-ul img:hover{
	opacity: .9;
}
.works-con,.news-con{
	width:100%;
	height:100%;
	bottom:0;
	left:0;
	background: #fff;
}
.close{
	width:46px;
	height:49px;
	top:0;
	right:5%;
	cursor: pointer;
	background: url("../images/close.png")/*tpa=http://www.nplusgroup.com/images/close.png*/;
}
.content{
	width:100%;
	height:100%;
	overflow: auto;
}
.content-in{
	width:1000px;
	padding-bottom:100px;
	top:0;
	left:50%;
	margin-left:-500px;
}
.content h4{
	font-size:24px;
	line-height: 24px;
	padding-top:58px;
	padding-bottom:17px;
	color: #313131;
}
.content p{
	color: #434343;
	font-size:16px;
	line-height:28px;
}
.content section p{
	font-size:16px;
	color: #313131;
}
.content h5{
	font-size:16px;
	line-height: 24px;
	color: #1b1b1b;
	margin:28px 0 15px 0;
}
.content img{
	width:1000px;
	display: block;
	margin:0px 0px;
}

.contact-btm{
	width: 100%;
	height: 700px;
	/* background: url("../images/contact-main.png")tpa=http://www.nplusgroup.com/images/contact-main.png center no-repeat; */
	top: 0;
	left: 0;
}
.contact-in{
	width:1060px;
	margin-left:-600px;
}
.contact-title{
	width:563px;
	height:481px;
	margin-top:143px;
}
.contact-us{
	top:52px;
	left:90px;
}
.about h2,.contact-us h2,.service h2{
	font-size:60px;
	line-height: 60px;
}

.title-btm{
	margin-top:183px;
	color: #d6d6d6;
	font-size:18px;
	line-height: 40px;
}
.address{
	margin-top:349px;
}
.address li{
	margin-bottom: 30px;
}
.address h6{
	font-size:18px;
	line-height: 18px;
	color: #d6d6d6;
	margin-bottom:14px;
	font-weight: normal;
}
.address p{
	font-size: 18px;
	line-height: 18px;
	color: #8a8a8a;
}
.o{
	top:62px;
	left:0;
}
.service-in img{
	bottom:0;
	left:0;
}
.about-con{
	overflow: hidden;
}

.about h3{
	font-size:56px;
	line-height: 56px;
	font-weight: normal;
	margin-left:15px;
}
.title-b{
	margin-top:46px;
}
.title-arrow{
	font-size:18px;
	color: #d6d6d6;
	margin-right:177px;
}
.title-b p{
	color: #c1c1c1;
	line-height: 22px;
	font-size:14px;
}
.p-con{
	margin-top:18px;
	color: #d6d6d6;
}
.p-con h4{
	line-height: 30px;
}
.team-top{
	width:848px;
	height:477px;
	overflow: hidden;
}
.team-l div{
	width:249px;
	height:249px;
	border-radius:50%;
	overflow: hidden;
}
.team-l img{
	width:249px;
	height: 249px;
	border-radius: 50%;
}
.team-r{
	width:489px;
	height:477px;
	overflow: hidden;
	margin-left:110px;
}
.team-rIn{
	width:100%;
	height:100%;
	overflow-x: hidden;
	overflow-y:scroll;
}
.team-rIn::-webkit-scrollbar{
	display: none;
}
.team-r h5{
	font-size: 18px;
	line-height:58px;
}
.team-r h5 span{
	margin:0 20px 0 20px;
}
.team-r p{
	color: #828282;
	line-height: 23px;
	font-size: 14px;
}
.team-r i{
	display: block;
	margin-top:10px;
	text-decoration: underline;
	cursor: pointer;
}
.team-btm{
	top:477px;
	left:50px;
}
.team-toL{
	width:44px;
	height:44px;
	border-radius: 50%;
	top:323px;
	left:85px;
	cursor: pointer;
	background:url("../images/list-left.png")/*tpa=http://www.nplusgroup.com/images/list-left.png*/ center no-repeat rgba(0,0,0,.8);

}
.team-toR{
	width:44px;
	height:44px;
	border-radius: 50%;
	top:323px;
	left:432px;
	cursor: pointer;
	background:url("../images/list-right.png")/*tpa=http://www.nplusgroup.com/images/list-right.png*/ center no-repeat rgba(0,0,0,.8);

}
.slide-list p:hover{
	color: #fff;
}

.news-ul img{
	width:223px;
	height:auto;
}
.loading{ background:url("../images/loading.gif")/*tpa=http://www.nplusgroup.com/images/loading.gif*/ no-repeat center center #000; position:absolute;top:0;left:0;width:100%;height:100%;}














/*home*/

.banner{width:100%;}
.all-bg{width:100%;height:100%;overflow:hidden;}
.banner1{left:0;top:0;position:absolute;}
.banner2{left:0;top:0;opacity:0;position: absolute;}
.banner3{left:0;top:0;opacity:0;position: absolute;}
.worList{width:25%;height:50%;float:left;}
.worList1{width:100%;height:100%;float:left;transform-style: preserve-3d;transform-origin: 50% 100% ;}
.worList div img{width:301px;height:100%;display:block;}
.worReverse,.worJust{position: absolute;left:0;top:0;backface-visibility: hidden;transition: 0.5s;transform-style:preserve-3d;width:100%;height:100%;position:relative;-webkit-backface-visibility:hidden;backface-visibility:hidden;}

.worReverse1{position: absolute;left:0;top:0;backface-visibility: hidden;display:none;}

.worReverse{z-index:2;}

.worList .worJust {transform: rotateY(180deg);position: absolute}
.worList:hover .worJust {transform: rotateY(0deg);}
.worList:hover .worReverse {transform: rotateY(180deg);}

.worksList{float:left;}

.about-click p{font-size:30px;}

.serviceImg{position:absolute;left:0;top:50%;margin-top:-62px;}
.serviceCon{width:570px;height:270px;position: absolute;top:50%;margin-top:-135px;right:0;font-size:20px;line-height:30px;}
.serviceCon p{padding-top:20px;}

.serviceCon1{width:100%;height:125px;margin-top:90px;}
.serviceCon1 ul,.serviceCon2 ul{width:100%;height:100%;}
.serviceCon1 ul li,.serviceCon2 ul li{width:25%;height:100%;float:left;text-align: center;}
.serviceCon1 ul li p,.serviceCon2 ul li p{line-height: 25px;font-size:15px;}

.serviceCon1 ul li .con1Top,.serviceCon2 ul li .con1Top{font-weight:600;line-height: 60px;font-size:22px;}

.serviceCon2{width:100%;position:absolute;bottom:0;}
.middleImg{width:580px;margin:50px auto 130px;display:block;}

.techImg{width:395px;display:block;margin:15px auto 0;}
.techCon{width:100%;height:560px;position:absolute;bottom:0;}
.techCon ul{width:100%;height:100%;}
.techCon ul li{width:20%;height:100%;float:left;position:relative;overflow:hidden;}
/*.techCon ul li{position:absolute;}*/
.techConImg{width:100%;height:100%;position:absolute;left:0;top:0;overflow:hidden;transition: 0.2s}
.techConText{background:rgba(0,0,0,0.5);width:100%;height:100%;position:absolute;left:0;top:0;z-index:0;line-height:560px;text-align: center;font-size:25px;font-weight:600}


.clientsTop{width:100%;height:200px;}
.clientsText{font-size:19px;line-height: 25px;width:750px;float:right;padding-top:70px;}

.carousel{width:100%;height:500px;background:rgba(0,0,0,0.5);overflow:hidden;position:relative;}
.carousel ul{width:300%;height:410px;margin-top:45px;background:rgba(255,255,255,0.8);position:absolute;}
.carousel ul li{width:1140px;height:100%;overflow:hidden;float:left;}
.carousel ul li div{width:190px;height:102.5px;float:left;border-right:2px solid #000;box-sizing:border-box ;border-bottom:2px solid #000;}
.carousel ul li div img{height:80%;display:block;margin:5% auto;}

 .aboutCon{width:100%;height:100%;background:url('../images/aboutBack.png') no-repeat center;background-size:0px 0px /*1198px 698px*/;overflow:hidden}
.aboutConImg{margin:60px auto 0;}
.aboutContent{width:690px;height:540px;margin:49px auto 0;font-size:18px;}
.aboutContent p{line-height:25px;color:#dcdcdc;}
.aboutContent h5{line-height: 70px;font-size:22px;}

.aboutContent h6{line-height: 40px;font-size:18px;color:#dcdcdc}
.aboutContent p span{font-size:21px;}

.teamLeft{width:50%;height:100%;float:left;/*background: url('../images/ourTeam.png') no-repeat 0 180px*/}
.teamRight{width:50%;height:100%;float:left;position:relative;}
.teamLeftText{width:415px;line-height:30px;font-size:18px;position:absolute;bottom:180px;}

.boss{width:480px;height:240px;position: absolute;}
.boss1{top:80px;left:0;background:url('../images/boss1.png') no-repeat;background-size:50%;cursor:pointer;}
.boss2{bottom:80px;left:0;background:url('../images/boss2.png') no-repeat right;background-size:50%;cursor:pointer;}

.boss1Con{width:50%;height:100%;float:right;border:2px solid #31a4c3;box-sizing: border-box;text-align: center;}
.boss2Con{width:50%;height:100%;float:left;border:2px solid #31a4c3;box-sizing: border-box;text-align: center;}

.boss1Con h6,.boss2Con h6{font-size:23px;padding-top:50px;padding-bottom:40px;}
.boss1Con p,.boss2Con p{line-height: 30px;font-size:20px;}

.contactCon{width:100%;height:100%;background:url('../images/contactBack.png') no-repeat 0 100px;background-size:760px 510px;position:relative;}
.contactConP1{font-size:20px;position:absolute;left:713px;top:280px;}
.contactConP2{font-size:20px;position: absolute;left:713px;top:315px;}
.contactConP3{font-size:20px;position: absolute;left:713px;top:370px;}
.contactConP4{font-size:20px;position: absolute;left:713px;top:405px;}
.contactUs{position:absolute;bottom:90px;left:0;z-index: 2}

.mengban{width:100%;height:100%;position:fixed;left:0;top:0;background:rgba(0,0,0,0.7);display:none;}

.mengCon{width:790px;height:490px;position:absolute;left:50%;top:50%;margin-top:-345px;margin-left:-395px;background: url('../images/boosBack.png') no-repeat center;background-size:100% 100%;}
.mengImg{position:absolute;right:20px;top:20px;cursor:pointer;}
.mengCon h6{font-size:23px;padding-top:144px;text-align: center;}
.mengCon p{width:610px;margin:40px auto 0;line-height: 30px;font-size:18px;}

.below{width:30px;position:absolute;left:50%;margin-left:-15px;bottom:10px;animation:below 2s linear infinite;opacity:0}
.up{width:30px;position:absolute;left:50%;margin-left:-15px;bottom:-50px;animation:up 2s linear infinite;opacity:0}

@keyframes below{
	0%{
       bottom:10px;
       opacity:0
	}
	100%{
       bottom:0px;
	   opacity: 1;
	}
}
@keyframes up{
	0%{
       bottom:-50px;
       opacity:0
	}
	100%{
       bottom:-40px;
       opacity: 1
	}
}

.navBar a.active{
	color: #fff;
}