/*-----------------------nav-----------------*/

.nav11 .container{
	position: absolute;
	right:0;
	left: auto;
	*left: 960px;
	top:58px;
	width:242px;
	height:452px;
	*width:242px;
	*height:452px;
	border:1px solid #e2e2e2;
	background:#fff;
	z-index: 2;
}
.nav11 .container .container-top{
	width:240px;
	height:122px;
}
.nav11 .container .container-top dl{
	width:218px;
	height:80px;
	padding:12px 0 0 22px;
	box-sizing: border-box;

}
.nav11 .container .container-top dl dt{
	float:left;
	width:53px;
	height:53px;
	margin-right:15px;
}
.nav11 .container .container-top dl dd{
	float:left;
	height:43px;
	padding-top:10px;
}
.nav11 .container .container-top dl dd p{
	font-size: 16px;
	height:23px;
	color:#555;
}
.nav11 .container .container-top dl dd span{
	font-size: 14px;
	color:#888;
}
.nav11 .container .container-top .container-top-loginbar{
	width:240px;
	height:40px;
	border-top:1px solid #e2e2e2;
	border-bottom:1px solid #e2e2e2;
	overflow: hidden;
}
.nav11 .container .container-top .container-top-loginbar a{
	float:left;
	display: block;
	font-size: 14px;
	width:119px;
	height:40px;
	line-height: 40px;
	color:#333;
	float: left;
}
.nav11 .container .container-top .container-top-loginbar a.login {
	text-indent: 56px;
	border-right:1px solid #e2e2e2;
	background: #f8f8f8 url(../image/cj-login.png) no-repeat 26px 11px;
}
.nav11 .container .container-top .container-top-loginbar a.join {
	text-indent: 42px;
	background: #f8f8f8 url(../image/cj-join.png) no-repeat 12px 12px;
}
.nav11 .container .container-top .container-top-loginbar a.member {
	text-indent: 42px;
	border-right:1px solid #e2e2e2;
	background: #f8f8f8 url(../image/cj-mem.png) no-repeat 12px 12px;
}
.nav11 .container .container-top .container-top-loginbar a.room {
	text-indent: 42px;
	background: #f8f8f8 url(../image/cj-room.png) no-repeat 12px 12px;
}
.nav11 .container .container-center{
	width:218px;
	height:172px;
	border-bottom: 1px solid #e2e2e2;
	margin:0 auto;

}
.nav11 .container .container-center .container-center-ul li{
	position: relative;
}
.nav11 .container .container-center .container-center-ul li .container-center-ul-li-content{
	position: absolute;
	left:0;
	top:42px;
	width:218px;
	/*height:90px;*/
	padding-top:17px;
	border-top: 1px solid #e2e2e2;
}
.nav11 .container .container-center .container-center-ul li .container-center-ul-li-content a{
	line-height: 25px;
	display: block;
	color:#666666;
}
.nav11 .container .container-center .container-center-ul li .container-center-ul-li-content a:hover{
	color:#e73328;
}
.nav11 .container .container-center .container-center-ul li p{
	float:left;
	width:90px;
	height:26px;
	font-size: 14px;
	padding-top: 16px;
	text-align: center;
	border-bottom: 1px solid #e73328;
	color:#333;
	position: relative;
    z-index: 2;
}
.nav11 .container .container-center .container-center-ul li .container-center-ul-li-content1{
	display:none;
}

.nav11 .container .container-bottom{
	width:218px;
	/*height:162px;*/
	margin:0 auto;
	/*padding-top: 10px;*/
}
.nav11 .container .container-bottom p {
	color: #333;
	font-size: 14px;
}
.nav11 .container .container-bottom p.line{
	height: 32px;
	line-height: 32px;
	font-size: 14px;
	margin-bottom: 10px;
	border-bottom: 1px solid #e2e2e2;
	position: relative;
}
.nav11 .container .container-bottom p.line::after {
	content: "";
	position: absolute;
	width: 90px;
	height: 1px;
	background: #e73828;
	bottom: -1px;
	z-index: 2;
	left: 0;
}
.nav11 .container .container-bottom .address {
	border-bottom: 1px solid #e2e2e2;
	padding-bottom: 18px;
}
.nav11 .container .container-bottom .address a{
	font-size: 12px;
	color: #666;
	line-height: 26px;
	margin-right: 3px;
}
.nav11 .container .container-bottom .address a:hover {
	color: #e73328;
}
.nav11 .container .container-bottom dl{
	width: 66px;
	/*height:72px;*/
	float:left;
	padding: 5px 3px;
}
.nav11 .container .container-bottom dl.last {
	width: 84px;
}
.nav11 .container .container-bottom dl a{
	color:#555;
}
.nav11 .container .container-bottom dt{
	text-align: center;
}
.nav11 .container .container-bottom dl dt img {
	width: 45px;
	transition: all .4s ease-in-out;
}
.nav11 .container .container-bottom dl:hover dt img {
	transform: rotateY(360deg);
}
.nav11 .container .container-bottom dd{
	text-align: center;
}

/*---------------------------------banner--------------------*/

#banner{width:100%;	height: 494px;	margin:0 auto;}
/*#banner .swiper-container{	width:100%;	height: 494px;}*/
.banner{width:100%;height:100%;position:relative;}
.pic{width:100%;height:100%;overflow:hidden;}
.pic ul li{	list-style-type:none;	width:100%;	height:494px;	position:relative;	overflow:hidden;}

/*.pic ul li img{	position: absolute;}*/
.pic ul li .img1{
	height:179px;
	width:569px;
	margin:40px auto 30px;
	position: relative;

}
.pic ul li .img1 img{
	display: block;
	height: 84px;
	width: 84px;
	margin:0 auto;
}
.pic ul li .img1 p{
	color:#fff;
	height: 42px;
	font-size:34px;
	font-weight: bold;
	padding-top: 25px;
	text-align: center;
}
.pic ul li .img1 span{
	display: block;
	width: 100%;
	color:#fff;
	font-size:13px;
	text-align: center;

}



.pic ul li .img2{
	border:3px solid #fff;
	height:43px;
	width:426px;
	margin:0 auto;
	position: relative;
	color:#fff;
	font-size: 20px;
	line-height: 43px;
	text-align: center;
	font-weight: bold;

}
.pic ul li .img3{
	height:52px;
	width:584px;
	margin:70px auto 0;position: relative;

}
.pic ul li .img3 p{
	height: 25px;
	line-height: 25px;
	text-align: center;
	line-height: 25px;
	color:#fff;
}


.banner-nav{
	width:100px;
	height:12px;
	position:absolute;
	bottom:10px;
	left:50%;
	margin-left:-50px;
}
.banner-nav ul li{
	list-style-type:none;
	width:7px;
	height:7px;
	float:left;
	cursor:pointer;
	border:1px solid #fff;
	transform:rotate(45deg);
	/*margin-right:10px;*/
	margin-right:10px;
}
.banner-nav ul .bg{
	background:#fff;
	width:9px;
	height:9px;
	border:none;
}
/*.pic ul li:nth-child(1){
	background: url(../img/cj-banner1.jpg) no-repeat center center;
}*/

/*--------------------------------主要内容区------------------*/
#main{
	margin:40px auto 0;
	width:1200px;
	min-height:400px;
    height:auto !important;
    height:400px;
}

.products-list{
	width:1200px;
	height:320px;
}
.products-list ul li{
	float:left;
	width:276px;
	height:318px;
	border:1px solid #fff;
	margin-right:28px;

}
.products-list ul li.last{
	margin-right:0;
}
.products-list ul li dl{
	width:274px;
	height:316px;
	border:1px solid #dbdcde;
}
.products-list ul li dt{
	height:130px;
	width:274px;
	
	background: #dbdcde;
	padding-top:28px;
}
.products-list ul li dt p.pic0{
	width:60px;
	height:60px;
	margin:0 auto;
	/*background:url(../image/cj-role-need.png) no-repeat left top ;*/
	
}
.products-list ul li dt p.one{
	height:26px;
	width:274px;
	text-align: center;
	padding-top:10px;
	/*color:#fff;*/
	color:#333333;
	font-weight: bold;
	font-size: 18px;
}
.products-list ul li dt p.two{
	
	width:274px;
	text-align: center;
	font-size: 12px;
	color:#666;

}
.products-list ul li dd{
	height:138px;
	width: 274px;
	padding-top:20px;
}

.products-list ul li dd a{
	display: block;
	width: 274px;
	height:36px;
	text-align: center;
	color:#666666;
	line-height: 36px;
	font-size: 14px;

}
.products-list ul li dt p.pic1{
	background:url(../image/cj-role-need.png) no-repeat left -60px ;
}
.products-list ul li dt p.pic2{
	background:url(../image/cj-role-need.png) no-repeat left -180px ;
}
.products-list ul li dt p.pic3{
	background:url(../image/cj-role-need.png) no-repeat left -540px ;
}
.products-list ul li dt p.pic4{
	background:url(../image/cj-role-need.png) no-repeat left -420px ;
}

.products-list ul li:hover dl dt p.pic1{
	background:url(../image/cj-role-need.png) no-repeat left top;
}
.products-list ul li:hover dl dt p.pic2{
	background:url(../image/cj-role-need.png) no-repeat left -120px;
}
.products-list ul li:hover dl dt p.pic3{
	background:url(../image/cj-role-need.png) no-repeat left -480px;
}
.products-list ul li:hover dl dt p.pic4{
	background:url(../image/cj-role-need.png) no-repeat left -360px;
}

.products-list ul li:hover dl dt{
	background:#122a8c;
}
.products-list ul li:hover dl{
	border-color: #122a8c;
}
.products-list ul li:hover{
	border-color: #122a8c;
}
.products-list ul li:hover dl dt p.one{
	color:#fff;
}
.products-list ul li:hover dl dt p.two{
	
	color:#fff;
	opacity: 0.6;
}
.products-list ul li:hover dl dd a{
	color:#122a8c;
}

.products-list ul li dl dd a:hover{
	text-decoration:underline;
}


/*--------------------------------------------------------------------------------------*/
.name-brand{
	width:1200px;
	height:402px;
	overflow: hidden;
}

.name-brand .name-brand-left{
	float: left;
	width:239px;
	height:402px;
	background:#122a8c url(../image/cj-business-bg.jpg) no-repeat left bottom;
}

.name-brand .name-brand-left p{
	color:#fff;
}
.name-brand .name-brand-left p.p1{
	font-size: 18px;
	width:239px;
	height:26px;
	padding-top:50px;
	text-align: center;
}
.name-brand .name-brand-left p.p2{
	font-size:24px;
	width:239px;
	height:38px;
	font-weight: 900;
	text-align: center;
}
.name-brand .name-brand-left p.p3{
	font-size:12px;
	width:239px;
	height:60px;
	text-align: center;
}
.hgxg{
	display: block;
	width:106px;
	height:28px;
	border:1px solid #fff;
	text-align: center;
	line-height: 28px;
	color:#fff;
	margin:0 auto;
	position: relative;
	overflow: hidden;
}
.hgxg::before {
	content: "";
	display: block;
	position: absolute;
	top: -42px;
	left: -29px;
	width: 7px;
	height: 120px;
	background: #fff;
	transform: rotate(45deg);
	z-index: 99;
}
.hgxg::after {
	content: "";
	display: block;
	position: absolute;
	bottom: -42px;
	right: -29px;
	width: 7px;
	height: 120px;
	background: #fff;
	transform: rotate(45deg);
	z-index: 99;
}
@-webkit-keyframes swiper{
	100%{
	left: 130px;
	}
}
@-webkit-keyframes swipel{
	100%{
	right: 130px;
	}
}
.hgxg:hover::before {	animation: swiper .8s;}
.hgxg:hover::after {	animation: swipel .8s;}
.name-brand .name-brand-right{	height:398px;	width: 100%;
   display: flex; flex-wrap: wrap; justify-content: space-between;}

.name-brand .name-brand-right ul li{position: relative;	width:239px;
	height:198px; background:#FFF;	border:1px solid #e2e2e2; margin:10px;
	border-right:none;	border-top:none;	float:left;	overflow: hidden;}
.name-brand .name-brand-right ul li:nth-child(4),.name-brand .name-brand-right ul li:nth-child(8){
	border-right:1px solid #e2e2e2;}
.name-brand .name-brand-right ul li dt{	width:110px;	height: 110px;	margin:18px auto 13px;}
.name-brand .name-brand-right ul li dd p{
	width: 239px;	height:20px;	text-align:center;	color:#333333;	font-size: 14px;}
.name-brand .name-brand-right ul li dd span{

	display: block;
	width:230px;
	height:22px;
	color:#888888;
	text-align:center;	
	overflow: hidden; /*自动隐藏文字*/
    text-overflow: ellipsis;/*文字隐藏后添加省略号*/
    white-space: nowrap;/*强制不换行*/
    text-align: center;
    margin:0 auto;
}
.name-brand .name-brand-right ul li .name-brand-right-vr{
	position: absolute;
	right: 15px;
	top:0;
	z-index:9;

}
.Company{
	bottom:0px;
	position:absolute;
	color:#000;
	/*transform:translateY(198px);
	transition:all 1s;*/
	width:240px;
	height: 198px;
	background:#122a8c;
	opacity: 0.9;
	top:198px;
	transition:all 0.5s;

}
.name-brand-right ul li:hover .Company{
	/*transform:translateY(0);*/
	top:0;
	}
.Company p{
	width:196px;
	margin:53px auto 10px;
	line-height: 19px;
	text-align: center;
	color:#fff;
	height:76px;
	/*white-space:nowrap;*/ 
	overflow:hidden; 
	/*text-overflow:ellipsis;*/
}
.Company a{
	color:#fff;
	display:block;
	width:60px;
	height:14px;
	margin:0 auto;
	border:1px solid #fff;
	padding:5px 10px;
}
.Company a:hover{
	background: #e73328;
	border-color: #e73328;
}




.name-brand1{
	height:380px;
} 
.name-brand1 .local-library{
	height:380px;
	background:#122a8c url(../image/cj-local-bg.jpg) no-repeat left bottom;
}
.name-brand1 .name-brand-right{
	height:375px;
	border-bottom: 1px solid #e2e2e2;
}
.name-brand1 b{
	display: block;
	width:239px;
	height: 50px;
	padding-top:46px;
	color:#fff;
	text-align: center;
	font-size:20px;
}
.name-brand1 i{
	display: block;
	height: 20px;
	line-height: 20px;
	width:100%;
	text-align: center;
	color:#fff;
	font-size: 14px;
}
.name-brand1 .name-brand-right .name-brand-right-l{
	float:left;
	width:279px;
	height:335px;
	border-right:1px solid #e2e2e2;
	padding:20px;
}
.name-brand1 .name-brand-right .name-brand-right-l .name-brand-right-l-t{
	height:119px;
	width:272px;
	border-bottom: 1px solid #e2e2e2;
	padding-left:7px;
}
.cj-address a{
	display: block;
	width:150px;
	height:53px;
	text-indent: 40px;
	background:url(../image/cj-location.png) no-repeat left top;
	font-size: 26px;
	color:#122a8c;
}
.name-brand1 .name-brand-right .name-brand-right-l .name-brand-right-l-t p{
	font-size: 14px;
	color:#999;
	color:#333;
}
.name-brand1 .name-brand-right .name-brand-right-l .name-brand-right-l-t p span{
	font-size:20px;
	color:#e73328;
}
.name-brand1 .name-brand-right .name-brand-right-l .name-brand-right-l-t p span:hover{
	text-decoration: underline;
}
.name-brand-right-l-b{
	width:299px;
	height:204px;
	padding-top:26px;
}
.name-brand-right-l-b dl{
	width:280px;
	height:66px;
}
.name-brand-right-l-b dl dt{
	width:62px;
	height:65px;
	float:left;
}
.name-brand-right-l-b dl dd{
	width:210px;
	float:left;
}
.name-brand-right-l-b dl dd p{
	height:27px;
	color:#333;
	font-size: 14px;
}
.name-brand-right-l-b dl:hover dd p{
	color:#e73328;
}
.name-brand-right-l-b dl dd span{
	height:27px;
	color:#888;
	font-size:12px;
	display: block;
	width: 200px;
	overflow: hidden; /*自动隐藏文字*/
    text-overflow: ellipsis;/*文字隐藏后添加省略号*/
    white-space: nowrap;/*强制不换行*/
}

/*---------------------------产业园区介绍----------------------*/
.park{
	position: relative;
	width:1200px;
	height:440px;
	border-top:3px solid #122a8c;
}

.park ul li {
	height: 440px;
	/*position: absolute;*/
	/*width:240px;*/
	width:240px;
	float:left;
	overflow:hidden;
	transition:all 0.15s;

}
.park ul li:nth-child(1){
	width:719px;
}
.park ul li .aa{
	position:relative;
	float:left;
	width:240px;
	height:440px;
	overflow: hidden;
}
.park ul li .triangle{
	position: absolute;
    z-index: 19;
    left: 0;
    bottom: -53px;
    width: 240px;
    height: 210px;
    transform: skewY(23.5deg);
    transition: transform .4s cubic-bezier(0.23,.45,.79,1.41);
    background-color: #122a8c;
    overflow:hidden;

}
.park ul li:nth-child(1) .triangle{
	transform: skewY(-23.5deg);
	background-color: #e83328;
}
.park ul li:nth-child(1) .map{
	background-color: #e83328;
}
.map{
	position: absolute;
    left: 0;
    bottom:0;
    width:240px;
    height: 70px;
    z-index: 29;
    background-color: #122a8c;
    padding:30px 0 0 0;
    font-size: 20px;
    color:#fff;
}
.map p{
	float:right;
	font-weight:bold;
	width: 180px;
	height: 26px;
	overflow: hidden;
}
.map img{
	float: right;
	width: 21px;
	height: 21px;
	margin-top: 3px;
	margin-left:5px;
	margin-right: 10px;
}
.park ul li .background{
	position: absolute;
    left: 0;
    top: 0;
    z-index: 1;

}
.park ul li:hover .triangle{
	transform: skewY(-23.5deg);
	background: #e83328;
}
.park ul li:hover .map{
	background: #e83328;
}

.park .park-right{
	float: left;
    border-top: 1px solid #e9e9e9;
    border-bottom: 1px solid #e9e9e9;
    padding: 28px 33px 0;
    width: 412px;
    height: 410px;

}
.park .park-right .title{
	height:40px;
	width:100%;
}
.park .park-right .title p{
	height:40px;
	/*width:187px;*/
	float: left;
	font-size:20px;
	color:#000;
}
.park .park-right .title p a{
	color:#000;
}
.park .park-right .title b{
	display: block;
	float: left;
	height: 22px;
	width: 83px;
	color:#fff;
	text-align: center;
	line-height: 22px;
	background: url(../image/zffc.jpg) no-repeat left top;
	margin-top: 4px;
	font-weight: 100;
	font-size: 14px;
}
.park .park-right span{
	height: 83px;
	width: 410px;
	overflow: hidden; /*自动隐藏文字*/
    text-overflow: ellipsis;/*文字隐藏后添加省略号*/
    word-break: break-all;
    display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
    -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
    -webkit-line-clamp: 4; /** 显示的行数 **/
    overflow: hidden;  /** 隐藏超出的内容 **/
}
.park .park-right {
	width:412px;
	line-height: 30px;
	font-size: 14px;
	color:#666666;
}
.park-right table{
	border:1px solid #e2e2e2;
	margin-top: 20px;
}
.park-right table tr th,.park-right table tr td{
	height:38px;
	width: 135px;
	text-align: center;
}
.park-right table tr th{
	background:#f6f6f6;
}
.park-right .park-list img{
	display: block;
	float:left;
	width:102px;
	height:100px;
}
.park-right .park-list{
	margin-top: 50px;
}
.park ul li:nth-child(1){
	left:0;
}
.park ul li:nth-child(2){
	left:240px;
}
.park ul li:nth-child(3){
	left:480px;
}

/*--------------------------新能源汽车展厅------------------------*/
.automobile{
	height:66px;
	width:1200px;
}
.automobile .automobile-left{
	width:240px;
	float: left;
	height: 42px;
	padding-top: 24px; 

}
.automobile .automobile-left b,.automobile .automobile-left span{
	font-size: 26px;
	font-weight: 100;
}
.automobile .automobile-left b{
	color:#e73328;
}
.automobile .automobile-right{
	float:right;
	padding-top:38px;
	height:24px;
}
.automobile .automobile-right ul li{
	float: left;
}
.automobile .automobile-right ul li a{
	padding:0 7px;
	color:#333;
	font-size: 14px;
}
.automobile .automobile-right ul li a:hover{	color:#e83328;}

.guild a:hover{	color:#e83328;}


.links {padding: 19px 26px;	 background:#FFF; overflow:hidden;}
.links a {	font-size: 14px; display:block; float:left;	color: #333;	line-height: 40px;	margin-right: 30px;}
.links a:hover{	color:#e83328;}

/*---------------登陆注册切换块--------------*/

.slideTxtBox{ 
	width:217px;
	height: 156px; 
	/*border:1px solid #ddd; */
	text-align:left;  
}
.slideTxtBox .hd{ 
	height:48px; 
	/*background:#f4f4f4;*/
	position:relative; 
}
.slideTxtBox .hd ul{ 
	float:left;  
	position:absolute; 
	left:0; 
	top:-1px; 
	width: 100%;
	height:48px;    
}
.slideTxtBox .hd ul li{ 
	float:left; 
	height: 26px;
	width: 106px;
	padding-top: 22px;
	cursor:pointer;  
	border-bottom: 1px solid #e2e2e2;
	text-align: center;
}
.slideTxtBox .hd ul .hd-li1{
	border-color: #e73328;
}

.bd-div a span{
	display: block;
	height: 24px;
	line-height: 24px;
	text-indent: 9px;
	color:#666;
	width: 217px;
	overflow: hidden;
    text-overflow: ellipsis;/*文字隐藏后添加省略号*/
    white-space: nowrap;/*强制不换行*/
}
.bd-div .bd-div-a{
	display: block;
	height: 24px;
	width: 100%;
	/*margin-top: 17px;*/}

.bd-div a span:hover{	color:#e73328;}



.slideTxtBox1{ 
	width:378px;
	height: 518px;
}
.slideTxtBox1 .hd{ 
	height:55px; 
	line-height:55px; 
	position:relative; 
}
.slideTxtBox1 .hd ul{ 
	float:left;  
	position:absolute; 
	left:0; 
	top:0; 
	height:55px;   
}
.slideTxtBox1 .hd ul li{ 
	float:left; 
	height: 55px;
	width: 189px;
	border-bottom:1px solid #ddd;  
	cursor:pointer;  
	text-align: center;
	font-size: 18px;
	color:#000;
	padding-top: 0;
}

.slideTxtBox .bd ul{
	zoom:1;  
	/*height: 460px;*/
	width: 377px;
}
.slideTxtBox1 .bd ul li dl{
	height:87px;
	width: 350px;
	border-bottom: 1px solid #e2e2e2;
	margin:0 auto;
	padding-top: 25px;
}

.slideTxtBox1 .bd ul li dl dt{
	float: left;
	width: 118px;
	height: 62px;
	overflow: hidden;
}

.slideTxtBox1 .bd ul li dl dt{
	width: 118px;
	height: 62px;
}

.slideTxtBox1 .bd ul li dl  a  dd{
	height: 70px;
	width: 200px;
	float: left;
	margin-left: 20px;
}

.slideTxtBox1 .bd ul li dl  a  dd p{
	height: 23px;
	padding-top: 2px;
	font-size: 16px;
	color:#000;
	overflow: hidden;
	width: 192px;
	overflow: hidden; /*自动隐藏文字*/
    text-overflow: ellipsis;/*文字隐藏后添加省略号*/
    white-space: nowrap;/*强制不换行*/
}
.slideTxtBox1 .bd ul li dl  a  dd span{
	height: 20px;	line-height: 20px;	font-size: 16px;	color:#888888;	font-size: 12px;
	width: 190px;	display:block;	white-space:nowrap;	 overflow:hidden; 	 text-overflow:ellipsis;}


/*-----------24-3-21--------------*/
.home-brick-box .brick-list,.home-brick-box .brick-promo-list {    margin: 0 0 -14px -14px}
.home-brick-box .tab-content-hide {    display: none}

.brick-list,.brick-promo-list {    height: 614px;   margin: 0;    padding: 0;    list-style-type: none}

.brick-list {  width:1218px;}
.brick-promo-list a {    display: block;    width: 100%;    height: 100%}
.brick-promo-list img {    width: 234px}
.brick-promo-list .brick-item-l img {    height: 614px}
.brick-promo-list .brick-item-m {    height: 300px;    padding: 0}
.brick-promo-list .brick-item-m img {height: 300px}
.brick-promo-list .brick-item-s img {height: 143px}

.brick-item { position: relative;  z-index: 1;  float: left;  width: 288px;  margin-left: 14px;
    margin-bottom: 14px;    background: #fff;
    -webkit-transition: all .2s linear;    transition: all .2s linear}

.brick-item:hover { z-index: 2;
    -webkit-box-shadow: 0 15px 30px rgba(0,0,0,.1);  box-shadow: 0 15px 30px rgba(0,0,0,.1);
    -webkit-transform: translate3d(0,-2px,0); transform: translate3d(0,-2px,0)}


.brick-item-m {  height: 300px;  padding:10px 0 2px; line-height:22px;}
.brick-item-m .figure-img { display: flex;    justify-content: center; /* 水平居中 */  
    align-items: center; /* 垂直居中 */ height:200px; margin-bottom:15px;}
.brick-item-m .figure-img img {max-width: 100%; /* 保证图片不会超出容器宽度 */  
    height: auto; /* 保持图片原始比例 */ max-height:100%; }

.brick-item-m .title {  margin: 0 10px;  font-size: 14px;  font-weight: 400;  color: #333}

.brick-item-m .desc,.brick-item-m .title {  text-align: center;  text-overflow: ellipsis; white-space: nowrap;  overflow: hidden}
.brick-item-m .desc {  margin: 0 10px 20px;  height: 18px;  font-size: 12px;  color: #b0b0b0}
.brick-item-m .price { margin: 10px 10px;  text-align: center;  color: #ff6700}
.brick-item-m .price del { margin-left: .5em;  color: #b0b0b0}
.brick-item-m .price .num{ font-size:22px;}