﻿@charset "utf-8";
* {
	margin: 0;
	padding: 0;
	font-family: "微软雅黑";
}

img {
	border: none;
}

li {
	list-style: none;
}


/*产品开始*/

.product {
	width: 100%;
	height: 620px;
	padding: 40px 0;
}


/*---------最新产品中心css----*/

.protit {
	margin-bottom: 30px;
}

.protit b {
	font-weight: normal;
	font-size: 26px;
	color: #000;
	display: block;
	text-align: center;
}

.protit dt {
	display: block;
	width: 50px;
	height: 1px;
	background: #000;
	margin: 10px auto;
}

.protit i {
	font-style: normal;
	display: block;
	text-align: center;
	color: #666;
	font-family: arial;
}

.proNav {
	width: 730px;
	height: 40px;
	margin: 0 auto;
}

.proNav a {
	display: block;
	width: 120px;
	height: 40px;
	float: left;
	font-size: 14px;
	color: #666;
	text-align: center;
	line-height: 40px;
	position: relative;
	margin-right: 30px;
}

.proNav a:last-child {
	margin-right: 0;
}

.proNav a:before {
	content: '';
	display: block;
	width: 1px;
	height: 10px;
	background: #ddd;
	float: right;
	margin-top: 16px;
	left: 134px;
	position: absolute;
}

.proNav a:last-child:before {
	display: none;
}

.proNav a:hover {
	border: solid 1px #000;
	color: #000;
	transition: .4s;
}

.prolist {
	height: 340px;
	border-bottom: solid 1px #ddd;
	margin-top: 40px;
}

.prolist li {
	float: left;
	margin: 0px 12px;
	width: 250px;
	height: 292px;
}

.proIMG {
	width: 250px;
	height: 210px;
	background: #000;
	position: relative;
	overflow: hidden;
}

.proIMG img {
	position: absolute;
	/* width: 100%; */
	height: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.prolist li a {
	display: block;
	width: 250px;
	height: 292px;
	overflow: hidden;
	position: relative;
	z-index: 10;
	top: -210px;
}

.prolist li a span {
	display: block;
	position: absolute;
	width: 40px;
	height: 40px;
	font-size: 20px;
	font-family: arial;
	color: #fff;
	background: #000;
	text-align: center;
	line-height: 40px;
	border-radius: 100px;
	left: 110px;
	top: -40px;
	z-index: 99;
}

.prolist li a dt {
	display: block;
	width: 250px;
	height: 93px;
	background: #000;
	position: absolute;
	top: 290px;
}

.prolist li a b {
	display: block;
	width: 250px;
	text-align: center;
	font-size: 16px;
	color: #000;
	font-weight: normal;
	position: absolute;
	top: 236px;
}

.prolist li a:hover span {
	top: 76px;
	transition: .5s;
}

.prolist li a:hover dt {
	top: 210px;
	transition: .5s;
}

.prolist li a:hover b {
	color: #fff;
	transition: .5s;
}

.promore{
	display: block;
	width: 120px;
	height: 40px;
	border: solid 1px #000;
	font-size: 14px;
	color: #000;
	text-align: center;
	line-height: 40px;
	margin: 30px auto;
}

.promore:hover{
	background: #000;
	color: #fff;
	transition: .4s;
}

/*---------------------------*/

.p_title {
	width: 540px;
	padding: 10px 0;
	position: relative;
}

.p_title h3 {
	font-weight: bold;
	color: #000;
	font-size: 26px;
}

.p_title h6 {
	font-size: 14px;
	font-family: arial;
	color: #999;
	font-style: normal;
	text-transform: uppercase;
	font-weight: normal;
	margin: 8px 0;
}

.p_title span {
	display: block;
	width: 30px;
	height: 1px;
	background: #EE3F3F;
	margin-bottom: 20px;
}

.p_title i {
	color: #666;
	font-size: 14px;
	font-style: normal;
}

.p_title a {}

.p_title a b {
	display: block;
	width: 40px;
	height: 40px;
	background: #EE3F3F;
	font-size: 26px;
	color: #fff;
	font-style: normal;
	text-align: center;
	line-height: 40px;
	position: absolute;
	margin-top: -100px;
	margin-left: 500px;
}

.p_list {
	position: relative;
}

.p_list li div {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.p_list li div img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.p_list li a {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	text-align: center;
	background: rgba(255, 255, 255, .6);
	opacity: 0;
}

.p_list li a p {
	width: 100%;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.p_list li a p span {
	font-size: 20px;
	color: #000;
}

.p_list li a p b {
	display: block;
	width: 30px;
	height: 30px;
	background: #FF0000;
	border-radius: 50%;
	margin: 40px auto;
	font-size: 20px;
	line-height: 30px;
	color: #fff;
}

.p_list li:hover a {
	opacity: 1;
}

.p_list li:nth-child(1) {
	position: absolute;
	width: 538px;
	height: 394px;
	background: red;
	margin-top: -128px;
	margin-left: 559px;
}

.p_list li:nth-child(2) {
	position: absolute;
	width: 538px;
	height: 510px;
	background: yellow;
	margin-top: 40px;
}

.p_list li:nth-child(3) {
	position: absolute;
	width: 256px;
	height: 260px;
	background: black;
	margin-top: 290px;
	margin-left: 560px;
}

.p_list li:nth-child(4) {
	position: absolute;
	width: 256px;
	height: 260px;
	background: red;
	margin-top: 290px;
	margin-left: 840px;
}


/*产品结束*/


/*产品优势开始*/

.cp_adv {
	width: 100%;
	height: 450px;
	/* background: url(../images/td_bj_02.png)no-repeat center; */
	background: #000;
	padding: 60px 0;
}

.cpys_title {
	margin-bottom: 50px;
}

.cpys_title h4 {
	display: block;
	font-size: 26px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	font-style: normal;
}

.cpys_title b {
	display: block;
	font-size: 14px;
	color: #fff;
	text-align: center;
	font-weight: normal;
	text-transform: uppercase;
	margin: 10px 0;
}

.cpys_title tt {
	display: block;
	width: 40px;
	height: 1px;
	background: #fff;
	margin: 0 auto;
}

.cpys_list li {
	float: left;
	width: 324px;
	margin-right: 64px;
}

.cpys_list li:last-child {
	margin-right: 0;
}

.cpys_Img {
	position: relative;
	overflow: hidden;
	width: 188px;
	height: 188px;
	margin: 0 auto;
}

.cpys_Img img {
	position: absolute;
	height: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.cpys_list li h3 {
	display: block;
	width: 324px;
	font-size: 16px;
	font-weight: normal;
	color: #fff;
	font-style: normal;
	text-align: center;
	margin: 16px 0;
}

.cpys_list li span {
	display: block;
	width: 30px;
	height: 2px;
	background: #fff;
	margin: 18px auto;
}

.cpys_list li i {
	display: block;
	width: 324px;
	font-size: 14px;
	font-style: normal;
	text-align: center;
	color: #eee;
	margin-top: 14px;
	line-height: 25px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.cpys_list li:hover {
	margin-top: -8px;
	transition: .8s;
}

.cpys_list li:hover h3 {
	color: #fff;
	transition: .6s;
}


/*产品优势结束*/


/*帆布特点开始*/

.characteristic {
	width: 100%;
	height: 300px;
	padding: 60px 0;
}

.characteristic h3 {
	display: block;
	font-size: 26px;
	font-weight: bold;
	color: #EE3F3F;
	text-align: center;
}

.characteristic span {
	display: block;
	width: 50px;
	height: 3px;
	background: #ddd;
	margin: 20px auto;
}


/*.characteristic p{
	width: 900px;
	font-size: 14px;
	color: #555;
	line-height: 25px;
	text-align: center;
	margin: 10px auto;
	display: -webkit-box;
	-webkit-line-clamp: 7;
	-webkit-box-orient: vertical;
	overflow: hidden;
}*/


/*----------最新帆布特点结束css---------*/

.charaIMG {
	float: left;
	position: relative;
	overflow: hidden;
	width: 500px;
	height: 300px;
}

.charaIMG img {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.FeaturesP {
	float: right;
	width: 500px;
}

.FeaturesP h5 {
	display: block;
	font-size: 26px;
	color: #000;
	position: relative;
	margin-top: 10px;
}

.FeaturesP h5:before {
	content: '';
	display: block;
	width: 50px;
	height: 2px;
	background: #000;
	position: absolute;
	top: 50px;
}

.FeaturesP p {
	font-size: 14px;
	color: #666;
	line-height: 25px;
	margin-top: 40px;
}


/*----------------------------------*/


/*帆布特点结束*/


/*公司优势开始*/

.gsys_adv {
	width: 100%;
	height: 631px;
	background: url(../images/adv1_bj_02.png)no-repeat center;
	padding: 40px 0;
}

.gsys_title {
	float: right;
	width: 710px;
}

.gsys_title h5 {
	display: block;
	font-size: 26px;
	color: #fff;
	text-align: center;
	font-weight: bold;
}

.gsys_title i {
	display: block;
	font-size: 14px;
	font-weight: normal;
	font-style: normal;
	text-transform: uppercase;
	color: #ccc;
	font-family: georgia;
	text-align: center;
	margin: 10px 0 30px;
}

.gsys_list {
	width: 610px;
	float: right;
	padding: 50px 0;
}

.gsys_list li {
	width: 610px;
	height: 110px;
	margin-bottom: 54px;
}

.gsys_list li:last-child {
	margin-bottom: 0;
}

.gsys_list li b {
	float: left;
	display: block;
	width: 100px;
	height: 110px;
	font-family: "宋体";
	font-size: 72px;
	color: #999;
	font-weight: normal;
	text-align: center;
	line-height: 110px;
}

.gsys_list li div {
	float: left;
	margin-left: 20px;
	width: 490px;
}

.gsys_list li div h4 {
	font-size: 24px;
	color: #fff;
	font-weight: normal;
	display: block;
	height: 50px;
	line-height: 50px;
}

.gsys_list li div i {
	display: block;
	font-family: georgia;
	font-size: 14px;
	color: #ccc;
	font-style: normal;
	text-transform: uppercase;
	margin: 10px 0;
}

.gsys_list li div p {
	width: 490px;
	border-top: solid 1px #ddd;
	font-size: 14px;
	color: #fff;
	padding-top: 18px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.gsys_list li:hover h4 {
	color: #fff;
	transition: .4s;
}

.gsys_list li:hover b {
	transform: rotateY(360deg);
	transition: .8s;
}


/*公司优势结束*/


/*公司简介开始*/

.about {
	width: 100%;
	height: 300px;
	padding: 50px 0;
	background: #f4f4f4;
}

.about_l {
	float: left;
	width: 720px;
}

.gsjj_k {
	width: 660px;
	height: 120px;
	background: #f4f4f4;
	padding: 40px 30px;
}

.gsjj_k h3 {
	font-weight: normal;
	font-size: 24px;
	color: #000;
}

.gsjj_k span {
	display: block;
	width: 30px;
	height: 3px;
	background: #EE3F3F;
	margin: 10px 0;
}

.gsjj_k p {
	width: 660px;
	font-size: 14px;
	color: #666;
	line-height: 25px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.gsjj_k a {
	font-size: 14px;
	color: #999;
	float: right;
	font-style: normal;
	margin-top: 10px;
	text-decoration: none;
}

.gsjj_k a:hover {
	color: #EE3F3F;
}

.gsjj_nav {
	margin-top: 20px;
}

.gsjj_nav li {
	float: left;
	width: 230px;
	height: 130px;
	background: #F4F4F4;
	margin-right: 15px;
}

.gsjj_nav li:last-child {
	margin-right: 0;
}

.jjyq {
	float: left;
	margin: 30px 10px 30px 14px;
	width: 59px;
	height: 59px;
	background: #fff;
	border: solid 1px #fff;
	border-radius: 50px;
}

.jjico {
	overflow: hidden;
	width: 24px;
	height: 28px;
	margin: 18px;
}

.gsjj_nav li tt {
	display: block;
	float: left;
	margin-top: 30px;
}

.gsjj_nav li tt h3 {
	font-size: 22px;
	color: #666;
	font-weight: normal;
}

.gsjj_nav li tt i {
	font-family: georgia;
	font-size: 14px;
	color: #999;
	font-style: normal;
	text-transform: uppercase;
}

.gsjj_nav li:hover .jjyq {
	background: #000;
	transition: .4s;
}

.gsjj_nav li:hover {
	background: #000;
	transition: .4s;
}

.gsjj_nav li:hover .jjico img {
	transform: translateY(-50%);
	transition: .4s;
}

.gsjj_nav li:hover tt h3 {
	color: #fff;
	transition: .4s;
}

.gsjj_nav li:hover tt i {
	color: #fff;
	transition: .4s;
}

.jjtp {
	float: right;
	position: relative;
	overflow: hidden;
	width: 366px;
	height: 351px;
}

.jjtp img {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}


/*-------------简介最新版式css--------*/

.aboL {
	float: left;
	width: 500px;
	padding-right: 40px;
}

.aboL h3 {
	display: block;
	position: relative;
	font-size: 26px;
	font-weight: normal;
	color: #000;
	margin-top: 16px;
}

.aboL h3:before {
	content: '';
	display: block;
	width: 80px;
	height: 1px;
	background: #000;
	position: absolute;
	top: 50px;
	left: 4px;
}

.aboL i {
	display: block;
	font-size: 15px;
	color: #999;
	font-style: normal;
	margin-top: 30px;
	font-family: arial;
}

.aboL p {
	width: 500px;
	font-size: 14px;
	color: #666;
	line-height: 25px;
	letter-spacing: 1px;
	margin-top: 30px;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.aboL a {
	display: block;
	width: 120px;
	height: 40px;
	font-size: 14px;
	color: #000;
	border: solid 1px #000;
	text-align: center;
	line-height: 40px;
	margin-top: 40px;
}

.aboL:hover h3:before {
	width: 120px;
	transition: .4s;
}

.aboL:hover a {
	background: #000;
	border: solid 1px #000;
	color: #fff;
	transition: .4s;
}

.aboIMG {
	width: 500px;
	height: 300px;
	background: #000;
	position: relative;
	overflow: hidden;
	float: right;
}

.aboIMG img {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}


/*------------------------------------*/


/*公司简介结束*/


/*新闻开始*/

.news {
	width: 100%;
	height: 600px;
	padding: 40px 0 0;
}

.news_title {
	margin-bottom: 30px;
}

.news_title h3 {
	display: block;
	font-size: 24px;
	color: #000;
	font-weight: normal;
	text-align: center;
}

.news_title i {
	display: block;
	font-size: 14px;
	font-family: georgia;
	color: #999;
	text-align: center;
	font-weight: normal;
	font-style: normal;
	text-transform: uppercase;
	margin: 10px 0;
}

.news_title span {
	display: block;
	width: 40px;
	height: 2px;
	background: #000;
	margin: 0 auto;
}

.news_list li {
	float: left;
	width: 530px;
	height: 80px;
	border-bottom: solid 1px #eee;
	margin-right: 40px;
	margin-bottom: 44px;
	overflow: hidden;
}

.news_list li:nth-child(2n) {
	margin-right: 0;
}

.news_list li div {
	float: left;
	width: 80px;
	height: 80px;
}

.news_list li div b {
	display: block;
	font-family: arial;
	font-size: 30px;
	color: #666;
	text-align: center;
	font-weight: normal;
}

.news_list li div i {
	display: block;
	font-size: 14px;
	font-weight: bold;
	font-style: normal;
	color: #999;
	text-align: center;
}

.news_list li span {
	display: block;
	float: left;
	margin-left: 10px;
	width: 420px;
}

.news_list li span h5 {
	font-size: 16px;
	font-style: normal;
	color: #666;
	font-weight: normal;
}

.news_list li span p {
	width: 420px;
	font-size: 14px;
	color: #888;
	line-height: 25px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.news_list li:hover div {
	transform: translateX(-100px);
	transition: .8s;
}

.news_list li:hover span {
	transform: translateX(-80px);
	transition: .8s;
}

.news_list li:hover span h5 {
	color: #000;
	transition: all .4s;
}


/*新闻结束*/


/*links开始*/

.links {
	width: 100%;
	height: 60px;
}

.links .w1100 span {
	float: left;
	display: block;
	width: 200px;
	height: 60px;
}

.links .w1100 span b {
	display: block;
	float: left;
	width: 100px;
	height: 60px;
	font-size: 24px;
	text-transform: uppercase;
	font-family: arial;
	color: #000;
	text-align: center;
	line-height: 60px;
}

.links .w1100 span i {
	display: block;
	float: left;
	width: 60px;
	height: 60px;
	text-align: center;
	font-size: 14px;
	line-height: 60px;
	color: #666;
	font-style: normal;
}

.links .w1100 div {
	float: left;
	margin-left: 10px;
}

.links .w1100 div a {
	font-size: 14px;
	text-decoration: none;
	color: #666;
	padding: 20px 10px;
	float: left;
}

.links .w1100 div a:hover {
	/* color: #EE3F3F; */
}


/*links结束*/