/* *{ box-sizing:border-box; -webkit-appearance: none; }
*:focus { outline: none; }
html, body{ height: 100%;}
body { margin: 0;line-height:1.5; font-size:14px;font-family:"微软雅黑",microsoft yahei; color:#333; background:#fff; } 
ul,li{list-style: none; padding: 0; margin: 0;}
.clearfix:after{ content:""; display:block; clear:both; height:0; visibility:hidden;}
.clearfix{ zoom:1;}
img{max-width:100%; vertical-align: middle;}*/

@font-face {
	font-family: 'MY';
	src: url('../fonts/MicrosoftYaHei.eot') format('embedded-opentype'),
	  url('../fonts/MicrosoftYaHei.woff2') format('woff2'),
	  url('../fonts/MicrosoftYaHei.woff') format('woff'),
	  url('../fonts/MicrosoftYaHei.ttf') format('truetype');
  }

  @font-face {
	font-family: 'MB';
	src: url('../fonts/Montserrat-Bold.eot?#iefix') format('eot'),
	  url('../fonts/Montserrat-Bold.woff2') format('woff2'),
	  url('../fonts/Montserrat-Bold.woff') format('woff'),
	  url('../fonts/Montserrat-Bold.ttf') format('truetype');
  }

  @font-face {
	font-family: 'MEL';
	src: url('../fonts/Montserrat-ExtraLight.eot') format('eot'),
	  url('../fonts/Montserrat-ExtraLight.woff2') format('woff2'),
	  url('../fonts/Montserrat-ExtraLight.woff') format('woff'),
	  url('../fonts/Montserrat-ExtraLight.ttf') format('truetype');
  }

.main{ 
	/* max-width: 1200px; */
	margin: 0 auto;
	padding:40px 0;
}
.title{
	text-align: center; 
	color:#333; 
	font-size:20px;
	margin: 25px 0;
}

.w-accor{ 
	overflow:hidden; 
	position:relative;
}
.w-accor ul,.w-accor li{
  padding:0; 
  margin:0; 
  list-style:none;
}
.w-accor ul{ 
  width:101%;
}
.w-accor li{ 
	position:relative; 
	overflow:hidden;
	float:left;
	margin-right: 22px;
	border-radius: 10px;
}
.w-accor li:last-child{
	margin-right: 0;
}
.accorClick li{ 
	cursor:pointer;
}
.w-accor li .item{ 
	position:relative;
}
.w-accor li > a{ 
	display:block; 
	position:absolute; 
	left:0; 
	right:0; 
	top:0; 
	bottom:0;
}
.w-accor h3{ 
	font-size:0.9rem; 
	margin:0; 
	padding:0; 
	font-weight:normal;
}
.w-accor .acr_p{ 
	margin-top:0.5em; 
}

.w-accor4 li img{ 
	max-width:100%;
	/* -webkit-filter: grayscale(100%);
    filter: grayscale(100%); */
}
.w-accor4 li .cont_ar{ 
	color:#fff;
	position:absolute; 
	left:0; 
	top:0; 
	bottom:0; 
	right:0;
}
.w-accor4 li .cont_ar:before{ 
	content:'';
	position:absolute; 
	left:0; 
	top:0; 
	bottom:0; 
	right:0; 
	background:#000; 
	opacity:0.35; 
	*filter:alpha(opacity=35); 
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=35);
	transition:all 0.5s;
	-webkit-transition:all 0.5s;
}
.w-accor4 li .finfo{
	position: absolute;
	left: 1.8rem;
	top: 80%;
}
.w-accor4 li h3{
    width: 100%;
	/* word-wrap: break-word; */
	font-size: 0.9rem;
}
.w-accor4 li p{ 
	font-size: 0.6rem;
	font-family: 'MY';
	text-transform: uppercase;
    width: 90%;
	white-space: nowrap;
}
/* :root .w-accor4 li p{
	top: 96%;
} */
.w-accor4 li .dec_ar{
	max-height:100%; 
	position:absolute; 
	z-index:1; 
	left:3.8rem;
	top:50%; 
	top:10%\9; 
	*top:10%; 
	transform:translateY(-50%) scale(0);
	-webkit-transform:translateY(-50%) scale(0); 
	padding:30px 0;
	color:#fff; 
	opacity:0; 
	*filter:alpha(opacity=0); 
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	transition:all 0.5s; 
	-webkit-transition:all 0.5s;
}
.w-accor4 li .dec_ar span{
	font-size:0.9rem;
	text-transform: uppercase;
	font-family: 'MY';
	line-height: 1;
}
	.w-accor4 li .dec_ar h4{
    font-size: 2rem;
    text-transform: capitalize;
    font-family: 'Arial';
    line-height: 1.2;
    margin-top: 0.8rem;
    width: 80%;
    font-weight: bold;
	}
	.w-accor4 li .dec_ar .acr_p{
    font-size: 0.8rem;
    font-family: 'Arial';
    line-height: 2;
    width: 80%;
    font-weight: bold;
    margin-top: 1rem;
	}
:root .w-accor4 li .dec_ar{ 
	top:50%;
}
.w-accor4 li .i_img{ 
	text-align:center; 
	margin-bottom:1em;
}
.w-accor4 li .i_img img{ 
	max-width:80%; 
	max-height:80px;
}
.w-accor4 li.cur .cont_ar:before{
	opacity:0.35; 
	*filter:alpha(opacity=0.35); 
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0.35);
}
.w-accor4 li.cur h3{ 
	opacity:0; 
	*filter:alpha(opacity=0); 
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
}
.w-accor4 li.cur p{ 
	opacity:0; 
	*filter:alpha(opacity=0); 
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
}
.w-accor4 li.cur .dec_ar{
	opacity:1; 
	*filter:alpha(opacity=100); 
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	transform:translateY(-50%) scale(1); 
	-webkit-transform:translateY(-50%) scale(1);
	transition-delay:0.3s; 
	-webkit-transition-delay:0.3s;
}
.w-accor4 li.cur .more{
	display: block; 
	width: 2.8rem; 
	height: 2.8rem; 
	margin-top: 2.75rem; 
	line-height: 2.8rem;  
	background: #fff; 
	border-radius: 50%;
	text-align: center; 
	font-size: 18px;
	color: #999;
	transition: all 1s ease;
    -webkit-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -moz-transition: all 1s ease;
}
.w-accor4 li.cur .more:hover{
	background: #000;
	color: #fff;
	transform: scale(0.9);
	-webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -moz-transform: scale(0.9);
}
.w-accor4 li.cur img{
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
}
.w-accor6 li .dec_ar{ 
	line-height:1.7; 
	max-height:100%; 
	max-height:calc(100% - 7em); 
	overflow:hidden; 
	position:absolute; 
	z-index:1; 
	left:40px; 
	right:40px;
	top:50%; 
	top:10%\9; 
	*top:10%; 
	transform:translateY(-50%) scale(0); 
	-webkit-transform:translateY(-50%) scale(0); 
	opacity:0; *filter:alpha(opacity=0); 
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	transition:all 0.5s; 
	-webkit-transition:all 0.5s; 
}
:root .w-accor6 li .dec_ar{ 
	top:50%;
}

@media (max-width:960px){
	.w-accor4 li .img_ar{ 
		height:350px !important;
	}
	.w-accor4 li .img_ar img{ 
		height:100%; max-width:inherit;
	}
}
@media screen and (max-width:768px){
	.w-accor4 li .dec_ar .acr_p {
		display: none;
	}
	.w-accor4 li .dec_ar h4 {
		font-size: 14px;
	}
	.w-accor4 li.cur .more {
		width: 137px;
		height: 38px;
		margin-top: 20px;
		line-height: 38px;
		font-size: 14px;
	}
}
@media (max-width:767px){
	.w-accor4 li .dec_ar{ 
		left:20px; 
		right:20px; 
		padding:15px;
	}
	:root .w-accor4 li h3{
		top: 25%;	
	  }
	.w-accor4 li h3{
		font-size: 12px;
	}
}

@media (max-width:480px){
	.w-accor4 li .dec_ar{ 
		left:1em; 
		right:1em; 
		padding:1em;
	}
	.w-accor4 li .img_ar{ 
		height:20em !important;
	}
	.w-accor4 li .i_img img{ 
		max-height:3em;
	}
}