/*技术经验*/

/*$$

{"color":[{"val":"#ffffff","title":"字体颜色"},

{"val":"rgba(255,255,255,.7)","title":"查看更多字体颜色"}],

"background":[{"val":"#f6f9ff","title":"底色"}],

"border":[{"val":"#ffffff","title":"了解我们边框"},

{"val":"rgba(255,255,255,.7)","title":"查看更多按钮边框"}]}

$$*/

#skill_146 {

	width: 100%;

	background: #f6f9ff;

	padding-top: 40px;

}



#skill_146 .skillBody {

	width: 1200px;

	margin: 0 auto;

	background: url(./../../../static/images/IC00010_01.jpg) no-repeat center !important;

	background-size:cover;

	height: 182px;

}



#skill_146 .skillList {

	width: 41.7%;

	float: left;

	height: 160px;

	background: url(./../../../static/images/IC00006_03.png) no-repeat center;

}



#skill_146 .skillList ul {

	width: 100%;

	padding: 55px 55px 60px 55px;

	display: flex;

	justify-content: space-between;

	align-items: center;

	box-sizing: border-box;

}



#skill_146 .skillList ul li {}



#skill_146 .skillListA {

	font-family: arial;

	font-size: 36px;

	line-height: 33.34px;

	font-weight: bold;

	color: #ffffff;

	position: relative;

	text-align: center;

}



#skill_146 .skillListA span {

	position: absolute;

	font-size: 12px;

	line-height: 33.34px;

	color: #ffffff;

}



#skill_146 .skillListB {

	font-size: 14px;

	line-height: 33.34px;

	color: #ffffff;

	text-align: center;

}



#skill_146 .skillChar {

	width: 55%;

	float: right;

	padding: 40px 60px 30px 0;

	box-sizing: border-box;

}



#skill_146 .skillChar p {

	overflow: hidden;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-box-orient: vertical;

	-webkit-line-clamp: 2;

	font-size: 18px;

	line-height: 42px;

	color: #ffffff;

	float: left;

	max-height: 72px;

}



#skill_146 .skillMore {

	float: right;

	width: 18.7%;

	font-size: 14px;

	margin-top: 10px;

	cursor: pointer;

	position: relative;

	color: #ffffff;

}

#skill_146 .skillMore .tit{

	color: #ffffff;

	line-height: 40px;

	border: rgba(255,255,255,.6) solid 1px;

	color:rgba(255,255,255,.7);

	padding-right: 20px;

	text-align: center;

	background: url(./../../../static/images/IC00006_02.png) no-repeat 90% center;

	line-height: 34px;

	display: block;

	width: 100%;

}

#skill_146 .skillMore:hover .tit{

	color: #ffffff;

}

#skill_146 .skillMore.btnAnimat .inner{

	position:absolute;

	top:0;

	left:0;

	width:100%;

	height:100%;

}

#skill_146 .skillMore.btnAnimat:before,

#skill_146 .skillMore.btnAnimat:after,

#skill_146 .skillMore.btnAnimat .inner:before,

#skill_146 .skillMore.btnAnimat .inner:after{

	background:#ffffff;

}

#skill_146 .skillMore.btnAnimat:before,

#skill_146 .skillMore.btnAnimat:after,

#skill_146 .skillMore.btnAnimat .inner:before,

#skill_146 .skillMore.btnAnimat .inner:after{

	position:absolute;

	content:"";

	display:block;

	-webkit-transition:-webkit-transform 0.3s;

	transition:-webkit-transform 0.3s;

	transition:transform 0.3s;

	transition:transform 0.3s,-webkit-transform 0.3s;

}

#skill_146 .skillMore.btnAnimat:before,

#skill_146 .skillMore.btnAnimat:after{

	left:0;

	width:100%;

	height:1px;

	-webkit-transform:scaleX(0);

	transform:scaleX(0);

}

#skill_146 .skillMore.btnAnimat .inner:before,

#skill_146 .skillMore.btnAnimat .inner:after{

	top:0;

	width:1px;

	height:100%;

	-webkit-transform:scaleY(0);

	transform:scaleY(0);

}



#skill_146 .skillMore.btnAnimat .inner:before{

	left:0;

}

#skill_146 .skillMore.btnAnimat .inner:after{

	right:0;

}

#skill_146 .skillMore.btnAnimat .inner:hover:before,

#skill_146 .skillMore.btnAnimat .inner:hover:after{

	-webkit-transform:scaleY(1);transform:scaleY(1);

}



#skill_146 .skillMore.btnAnimat:before{

	top:0;

}

#skill_146 .skillMore.btnAnimat:after{

	bottom:0;

}

#skill_146 .skillMore.btnAnimat:hover:before,

#skill_146 .skillMore.btnAnimat:hover:after{

	-webkit-transform:scaleX(1);transform:scaleX(1);

}

#skill_146 .skillMore.btnAnimat:hover .inner:before,

#skill_146 .skillMore.btnAnimat:hover .inner:after{

	-webkit-transform:scaleY(1);transform:scaleY(1);

}

#skill_146 .skillMore.btnAnimat.clockwise .inner:before{

	-webkit-transform-origin:top center;

	transform-origin:top center;

}

#skill_146 .skillMore.btnAnimat.clockwise .inner:after{

	-webkit-transform-origin:bottom center;

	transform-origin:bottom center;

}

#skill_146 .skillMore.btnAnimat.clockwise:before{

	-webkit-transform-origin:right center;

	transform-origin:right center;

}

#skill_146 .skillMore.btnAnimat.clockwise:after{

	-webkit-transform-origin:left center;

	transform-origin:left center;

}

#skill_146 .skillMore.btnAnimat.clockwise:hover .inner:before{

	-webkit-transform-origin:bottom center;

	transform-origin:bottom center;

}

#skill_146 .skillMore.btnAnimat.clockwise:hover .inner:after{

	-webkit-transform-origin:top center;

	transform-origin:top center;

}

#skill_146 .skillMore.btnAnimat.clockwise:hover:before{

	-webkit-transform-origin:left center;

	transform-origin:left center;

}

#skill_146 .skillMore.btnAnimat.clockwise:hover:after{

	-webkit-transform-origin:right center;

	transform-origin:right center;

}

@media screen and (max-width:1200px) {

	#skill_146 .skillBody{

		width: 96%;

	}

}

/* ipad */

@media screen and (max-width:992px){

	#skill_146 .skillBody{

		width: 96%;

	}

	#skill_146 .skillList ul{

		padding: 55px 25px 60px 25px;

	}

	#skill_146 .skillChar{

		padding: 40px 30px 30px 0;

	}

	#skill_146 .skillMore{

		width: 30%;

	}

}

/* 手机 */

@media screen and (max-width: 767px) {

	#skill_146 .skillBody{

		width: 100%;

		height: 240px;

	}

	#skill_146{

		padding: 20px 0;

	}

	#skill_146 .skillList{

		width: 100%;

		float: left;

	}

	#skill_146 .skillChar{

		width: 100%;

		float: left;

		padding:15px 15px 20px 15px;

		height: 125px;

		background: url(./../../../static/images/IC00010_01.jpg) no-repeat center center;

	}

	#skill_146 .skillMore{

		width: 35%;

	}

	#skill_146 .skillChar p{

		font-size: 14px;

		line-height: 24px;

		max-height: 48px;

	}

	#skill_146 .skillList{

		height: 120px;

		width: 100%;

		overflow: hidden;

	}

	#skill_146 .skillList ul{

		padding: 30px 25px;

	}

}

