﻿@charset "utf-8";



body{
	font-size: 16px;
}
a{
	color: inherit;
}
a:hover,a:visited,a:focus{
	text-decoration: none; 
}

/*关于我们*/
.about_body .showBox{
	padding: 40px 0;
	font-size: 14px;
	line-height: 28px;
} 
.about_body .showBox img{
	max-width: 100%;
}
@media (max-width: 768px) {
	.about_body .showBox{
		padding: 16px 0;
	}
}

/*案例中心*/
.listBox li{
	float: left;
	width: 23.8%;
	margin-right: 1.6%;
	margin-top: 28px;
}
.listBox li:nth-child(4n){
	margin-right: 0;
}
.listBox li a{
	display: block;
}
.listBox li img{
	width: 100%;
	height: 180px;
}
.listBox li span{
	display: block;
	height: 46px;
	line-height: 46px;
	width: 100%;
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: all 0.5s;
}
.listBox li:hover span{
	color: #f7417a;
}
@media (max-width: 1170px) {
	.listBox li img{
		height: 160px;
	}
}
@media (max-width: 768px) {
	.listBox li{
		margin: 0;
		width: 80%;
		margin-left: 10%;
		margin-top: 12px;
	}
	.listBox li img{
		height: unset;
	}
}
.newsBox li{
	margin-top: 28px; 
	border-radius: 10px;
	background-color: rgb(255, 255, 255);
	box-shadow: 0.5px 0.866px 13px 0px rgba(0, 0, 0, 0.2); 
	padding: 20px;
	transition: all 0.5s;
	display: flex;	
} 
.newsBox li a.imgBox{
	display: block;
	width: 22.5%;
}
.newsBox li a.imgBox img{
	max-width: 100%;
}
.newsBox li a.textBox{ 
	width: 75.5%;
	display: flex;
	justify-content: center;
	flex-direction: column; 
	margin-left: 2%;
}
.newsBox li a.textBox span{
	display: block;
	/*margin-top: 24px;*/
	font-size: 18px;
	color: #333333;
	transition: all 0.5s;
}
.newsBox li a.textBox p,
.newsBox li:hover a.textBox p{
	margin-top: 8px;
	font-size: 14px;
	color: #666;
	width: 100%;
	overflow: hidden;
	-ms-text-overflow: ellipsis;text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical; 
	-webkit-line-clamp: 3;
}
.newsBox li:hover{  
  	box-shadow: 0.5px 0.866px 13px 0px rgba(247, 65, 122, 0.2);
}
.newsBox li:hover .textBox span{  
	color: #f7417a;
}
@media (max-width: 1170px) {
	.newsBox li a.textBox span{
		margin-top: 0;
	}
}
@media (max-width: 768px) {
	.newsBox li{
		display: block;
		margin-top: 12px;
		width: 80%;
		margin-left: 10%;
	}
	.newsBox li a.imgBox{
		width: 100%;
		text-align: center;
	}
	.newsBox li a.textBox{
		width: 100%;
		text-align: center;
	}
	.newsBox li a.textBox span{
		margin-top: 8px;
	}
}
/*联系我们*/
.contact_body .infoBox{
	margin-top: 58px;
}
.contact_body .infoBox h1{ 
	font-size: 24px; 
	color: rgb(247, 65, 122);
	margin-bottom: 8px; 
}
.contact_body .infoBox .fl{ 
	background-color: rgb(255, 255, 255);
	box-shadow: 0px 1px 13px 0px rgba(247, 65, 122, 0.15); 
	width: 21.36%;
	padding: 32px;
	text-align: center;
}
.contact_body .infoBox .fl img{
	max-width: 100%;
}
.contact_body .infoBox .fr{ 
	width: 76.75%;
	font-size: 18px; 
	color: rgb(51, 51, 51);
	line-height: 30px; 
}
.contact_body .mapBox{
	width: 100%;
	margin: 56px 0;
	height: 380px;
}
.contact_body .mapBox iframe{
	width: 100%;
	height: 100%;
}
@media (max-width: 768px) {
	.contact_body .infoBox{ 
		margin-top: 12px;
	} 
	.contact_body .infoBox h1{
		font-size: 18px;
	}
	.contact_body .infoBox .fl,
	.contact_body .infoBox .fr{
		width: 100%;
		margin-bottom: 16px;
	}
	.contact_body .infoBox .fr{
		font-size: 16px;
		line-height: 26px;
	}
	.contact_body .mapBox{
		margin: 0 0 16px;
		height: 240px;
	}
}
/*立即留言*/
.liuyan_body .typeBox{
	padding-bottom: 10px;
	height: unset;
	line-height: unset;
}
.liuyan_body .typeBox h1{
	font-size: 18px; 
	color: rgb(247, 65, 122);
	font-weight: bold;  
	float: left;
}
.liuyan_body .typeBox button{
	background-image: -moz-linear-gradient( 78deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	background-image: -webkit-linear-gradient( 78deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	background-image: -ms-linear-gradient( 78deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	border: 0;
	width: 141px;
	height: 38px; 
	line-height: 38px;
	font-size: 14px; 
	color: rgb(255, 255, 255); 
	border-radius: 19px;
	float: right; 
}
.liuyan_body .typeBox button:focus,
.liuyan_body .typeBox button:hover{
	outline: none;
}
.liuyanBox li{
	width: 100%;
	padding: 20px;
	border-radius: 5px;
	background-color: rgb(250, 250, 250);
	margin-top: 28px;
}
.liuyanBox li:hover{ 
	box-shadow: 0px 1px 13px 0px rgba(4, 0, 0, 0.15); 
}
.liuyanBox li span{
	color: #f7417a;
	line-height: 32px;
	font-weight: 700;
}
.liuyanBox li .textBox{
	font-size: 14px;
	line-height: 28px;
}


.zhezhao{
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: rgba(0,0,0,0.5);
	display: none;
}
.hideForm{
	width: 42.5%;
	position: fixed;
	left: 28.75%;
	top: 20%;
	background: #fafafa;
	display: none;
}
.hideForm .formHead{
	background-image: -moz-linear-gradient( 5deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	background-image: -webkit-linear-gradient( 5deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	background-image: -ms-linear-gradient( 5deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	width: 100%; 
	padding: 28px;
	font-size: 14px;
	color: #fff;
	position: relative;
}
.hideForm .formHead span{
	font-weight: 700;
	font-size: 24px;
}
.hideForm .formHead i{
	display: block; 
	border-radius: 2px;
	background-color: rgb(255, 255, 255); 
	width: 28px;
	height: 28px; 
	font-size: 24px;
	color: #f7417a;
	line-height: 31px;
	text-align: center;
	font-style: normal;
	position: absolute;
	right: 32px;
	top: 40px;
}
.hideForm .formHead i:hover{
	cursor: pointer;
}
.hideForm form{
	padding: 24px 32px;
}
.hideForm form input[type=text]{ 
	border-width: 1px;
	border-color: rgb(179, 179, 179);
	border-style: solid;
	background-color: rgb(255, 255, 255); 
	width: 48%;
	height: 40px; 
	line-height: 40px;
	padding: 0 8px;
}
.hideForm form textarea{ 
	border-width: 1px;
	border-color: rgb(179, 179, 179);
	border-style: solid;
	background-color: rgb(255, 255, 255); 
	width: 100%;
	height: 106px; 
	line-height: 40px;
	padding: 0 8px;
	clear: both;
	margin-top: 20px;
}
.hideForm form input[type=text]:focus,
.hideForm form textarea:focus{  
	border-color: rgb(247, 65, 122);
	outline: none;  
}
.hideForm form input[type=submit]{
	background-color: rgb(247, 65, 122);
	width: 148px;
	height: 42px; 
	line-height: 42px;
	border: none;
	font-size: 15px;
	color: #ffffff;
	margin: 24px auto;
	display: block;
}
@media (max-width: 1170px) {
	.hideForm{
		width: 80%; 
	    left: 10%;
	}
}
@media (max-width: 768px) {
	.hideForm{
		top: 15%;
	}
	.hideForm .formHead{
		padding: 12px;
	}
	.hideForm .formHead span{
		font-size: 20px;
	}
	.hideForm .formHead i{
		right: 16px;
		top: 16px;
		width: 20px;
	    height: 20px;
	    font-size: 22px; 
	    line-height: 22px;
	}
	.hideForm form{
		padding: 0 16px 16px;
	}
	.hideForm form input[type=text]{
		width: 100%;
		margin-top: 16px;
	}
	.hideForm form input[type=submit]{
		margin: 8px auto 0;
	}
	.liuyan_body .typeBox button{
		width: 100px;
	    height: 30px;
	    line-height: 30px;
	}
	.liuyan_body .typeBox h1{
		line-height: 30px;
	}
	.typeBox{
		margin-top: 10px;
	}
	.liuyanBox li{
		margin-top: 16px;
		padding: 12px;
	}
	.liuyanBox li .textBox{
		line-height: 24px;
	}
}

/*详情页*/
.article_body{
	border-radius: 5px;
	background-color: rgb(255, 255, 255); 
    padding: 16px;
    margin-top: 32px; 
    margin-bottom: 32px; 
	box-shadow: 0px 1px 13px 0px rgba(247, 65, 122, 0.15);
}
.article_body .posi{
    border-bottom: 1px solid #f2f2f2;	
}
.article_body .article_tit{
	font-size: 24px;
	color: #f7417a;
	margin-top: 48px;
	text-align: center;
}
.article_body .article_date{
	font-size: 14px;
	color: #999999;
	font-style: normal;
	text-align: center;
	display: block;
}
.article_body .article_date:after{
	content: "";
	display: block;
	height: 1px;
	width: 92px;
	background: #f2f2f2;
	margin: 8px auto;
}
.article_body .article_text{
	color: #333;
	font-size: 14px;
	line-height: 32px;
	padding: 32px 0;
	width: 92%;
	margin: 0 4%; 
	min-height: 31vh;
}
.article_body .article_text p{
	text-indent: 2em;
}
.article_body .article_text img{
	max-width: 100%;
}
.article_body .btnBox{
	background: #f7f7f7;
	width: 100%; 
	height: 44px;
	line-height: 44px;
	border-radius: 3px;
	overflow: hidden;
}
.article_body .btnBox .backBtn{
	width: 118px; 
	background: #238eff;
	text-align: center;
	display: block;
	color: #fff;
	font-size: 14px;	
	float: left;
	transition: all 0.3s; 
	background-image: -moz-linear-gradient( 78deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	background-image: -webkit-linear-gradient( 78deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	background-image: -ms-linear-gradient( 78deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
}
.article_body .btnBox .backBtn:hover{
	background-image: -moz-linear-gradient( 78deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	background-image: -webkit-linear-gradient( 78deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
	background-image: -ms-linear-gradient( 78deg, rgb(247,65,122) 0%, rgb(255,150,183) 100%);
}
.article_body .btnBox .shareBox span{
	float: right;
	margin-right: 12px;
}
.article_body .btnBox .shareBox .bdsharebuttonbox{
	float: right;
	margin-top: 9px;
	margin-right: 16px;
}
.article_body .pageBox{
	margin-top: 12px;
}
.article_body .pageBox a{
	font-size: 14px; 
	line-height: 24px;
	color: #666;
} 
@media (max-width: 768px) {
	.article_body .article_tit{
		margin-top: 8px;
		font-size: 22px;
	}
	.article_body .article_text{
		padding: 8px 0;
		line-height: 24px;
		width: 100%;
		margin: 0;
		min-height: unset;
	} 
	.article_body .btnBox{
		height: 36px;
		line-height: 36px;
	}
	.article_body .btnBox .shareBox .bdsharebuttonbox{
		margin-top: 5px;
		margin-right: 0;
	}
	.article_body .btnBox .backBtn{
		width: 88px;
	}
	.article_body .pageBox a{
		float: left;
	}
}

/*首页*/ 
.intit{
	font-size: 30px;
	color: #f7417a;
	line-height: 34px;
	width: 100%;
	text-align: center;
}
.intiten{
	font-size: 14px;
	color: #cccccc;
	width: 100%;
	text-align: center;
}
.swiper_banner a{
	display: block;
	height: 550px;
	background:url() center center no-repeat;
	background-size: cover;
}
.swiper_banner img{
	max-width: 100%;
}
.in_part1{
/*	margin-top: 72px;*/
	margin-top: 40px;
}
.in_part1 .bigBox{
	width: 45.3%;
	background:url() center center no-repeat;
	background-size: cover;
	padding: 320px 40px 40px;
}
.in_part1 .bigBox>div{
	background-color: rgba(255, 255, 255,0.6);  
	width: 100%; 
	padding: 40px;
}
.in_part1 .bigBox h2{
	font-size: 24px; 
	color: rgb(51, 51, 51); 
	line-height: 28px;
}
.in_part1 .bigBox h3{
	font-size: 14px;	 
}
.in_part1 .bigBox .textBox{
	font-size: 14px;  
	line-height: 28px;
}
.in_part1 ul{
	width: 50%;
}
.in_part1 li{
	float: left;
	width: 50%;
	text-align: center;
	margin-top: 40px;
}
.in_part1 li img{ 
	width: 66%; 
	border-radius: 50%;
}
.in_part1 li h2{
	font-size: 18px;
	color: #333;
	line-height: 24px;
	margin-top: 8px;
}
.in_part1 li h3{
	font-size: 14px;
	color: #999;
}
.in_part2{
/*	margin-top: 92px;*/
	margin-top: 40px;
	position: relative;
	padding-bottom: 50px;
}
.in_part2 .container{
	margin-top: 24px;
	position: relative;
}
.in_part2 .videoBox{
	position: relative;
}
.in_part2 .videoBox video{
	z-index: 1;
  	width:100%;
    max-height:550px;
  	/*object-fit:fill; */
}
.in_part2 .videoBox i{
	width: 90px;
	height: 90px;
	background: url(/skin/img/pause.png) center center no-repeat;
	background-size: cover;
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 999;
	transform: translateX(-50%) translateY(-50%);
}
.in_part2 .bgBox{
	background: #f8f8f6;
	width: 100%;
	height: 40%;
	position: absolute;
	bottom: 0;
	left: 0;
}
.in_part2 .textBox{
	color: #999999;
	line-height: 28px;
	margin-top: 44px;
}
.swiper-button-next, 
.swiper-container-rtl .swiper-button-prev{
	right: -72px;
	background-image: url(/skin/img/right.png);
	width: 38px;
	height: 69px;
	background-size: 38px 69px;
}
.swiper-button-prev, 
.swiper-container-rtl .swiper-button-next{
	left: -72px;
	background-image: url(/skin/img/left.png);
	width: 38px;
	height: 69px;
	background-size: 38px 69px;
}
.in_part3{
/*	margin-top: 96px;*/
	margin-top: 40px;
}
.in_part3 .container{
	margin-top: 24px;
	position: relative;
}
.in_part3 .swiper_case a{
	display: block;
}
.in_part3 .swiper_case a:hover{
	color: #f7417a;	
}
.in_part3 .swiper_case .imgBox{
	width: 100%;
	height: 380px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.in_part3 .swiper_case .textBox{
	width: 100%;
	background: #f8f8f6;
	padding: 12px 28px;
}
.in_part3 .swiper_case span{
	display: block;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.in_part3 .swiper_case p{
	display: block;
  	height:24px;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.in_prat4{
	margin: 10px auto 20px;
}
.in_prat4 li{
	width: 16.66%;
	text-align: center;
	float: left;
}
.in_prat4 li img{
	max-width: 100%;

	-webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);    
    filter: grayscale(100%);	
    filter: gray;
    opacity: 0.5;
}
.in_prat4 li:hover{
	cursor: pointer;
}
.in_prat4 li:hover img{ 
	-webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);    
    filter: grayscale(0%);	
    filter: gray;
    opacity: 1;
}
@media (max-width: 1000px) {
	.swiper_banner a{ 
		height: 400px; 
	}
    .in_part2 .videoBox video{ 
      max-height:480px;
  }
}
@media (max-width: 768px) {
	.swiper_banner a{ 
		height: 320px; 
	}


	/*--------------*/
	.in_part1,
	.in_part3{
		margin-top: 32px;
	}
	.in_part1 .bigBox{
		width: 100%;
		padding: 20px;
	}
	.in_part1 .bigBox>div{
		padding: 20px;
	}
	.in_part1 ul{
		width: 100%;
	}
	.in_part1 li{
		width: 25%;
		margin-top: 16px;
	}
	.in_part1 li img{
		width: 84%;
	}
	.in_part1 li h2{
		font-size: 13px;
	}
	.in_part1 li h3{
		line-height: 18px;
	}
	.in_part1 .bigBox .textBox{
		line-height: 22px;
	}
	.in_part2{
		margin-top: 32px;
		padding-bottom: 24px;
	}
	.in_part2 .container{
		margin-top: 0;
	}
	.in_part2 .textBox{
		margin-top: 8px;
		font-size: 14px;
		line-height: 22px;
	}
	.in_part2 .videoBox i{
		width: 40px;
		height: 40px;
	}
	.in_part2 .bgBox{
		height: 56%;
	}
	.in_part2 .container,
	.in_part3 .container{
		margin-top:8px;
		width: 70%;
	}
	.in_part3 .swiper_case .imgBox{
		height: 240px;
	}
	.in_prat4{
		margin: 32px 0;
	}
	.in_prat4 li{
		width: 50%;
		margin-top: 16px;
	}
	.in_prat4 li img{ 
	    -webkit-filter: grayscale(0%);
	    -moz-filter: grayscale(0%);
	    -ms-filter: grayscale(0%);
	    -o-filter: grayscale(0%);
	    filter: grayscale(0%);
	    filter: gray;
	    opacity: 1;
	}
	.swiper-button-next, 
	.swiper-container-rtl .swiper-button-prev,
	.swiper-button-prev, 
	.swiper-container-rtl .swiper-button-next{
		width: 24px;
		height: 40px;
		background-size: 24px 40px;
	}
	.swiper-button-next, 
	.swiper-container-rtl .swiper-button-prev{
		right: -36px;
	}
	.swiper-button-prev, 
	.swiper-container-rtl .swiper-button-next{
		left: -36px;
	}
	.in_part1 .bigBox h2{
		font-size: 20px;
	}
	.intit{
		font-size: 22px;
		line-height: 30px;
	}
  
    .in_part2 .videoBox video{ 
        max-height:320px;
    }

}

@media (max-width: 540px) {
	.swiper_banner a{ 
		height: 220px; 
	}
    .in_part2 .videoBox video{ 
        max-height:240px;
    }
}