@charset "utf-8";

.showcases,.showcases li {margin:0;padding:0; list-style: none;}
.showcases li{ float: left; overflow: hidden; padding-bottom:10px; margin-top:10px; }
.showcases .lstinf { display:block; width:95%; box-shadow: 5px 5px 10px #eee; text-align:center;margin:0px;padding:0px;}
.showcases li .cimic{ position: relative; }
.showcases li .cimic img{ width: 273px; height:  203px; }
.showcases li .title{ width: 273px; overflow: hidden; height: 40px; line-height: 40px; text-align: left; padding: 0px 10px;}
.showcases li .title .name{ display: block; width: 160px; height: 40px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; float: left;}
.showcases li .title .city{ min-width: 50px; height: 20px; background: #4dacfe; color: #FFFfff; text-align: center; line-height: 20px; margin-top: 10px; padding:0px 3px; }
.multipleLine .btnnext, .multipleLine .btnprev{ width: 50px;height: 110px;position: absolute;top: 210px;z-index: 10;cursor: pointer;}
.showcases li .ftext { width: 233px; height: 174px; padding: 30px; position: absolute; top: 0px; background: rgba(0,0,0,0.3); color: #fff; display: none;}
.showcases li:hover .ftext {display: block;}
.showcases li:hover .lstinf { box-shadow: 5px 5px 10px #ccc;}

/**/
@media (min-width: 1200px){
	.multipleLine .bd {width: 1200px;}
	.showcases li .cimic img{ width: 273px; height:  203px; }
	.showcases li .title{ width: 273px;}
	.multipleLine .btnnext{right: -100px;}
	.multipleLine .btnprev{left: -100px;}
	.showcases li .ftext {width: 273px; height:  203px; }
}
@media (min-width: 1900px) {
	.multipleLine .bd{ height: 580px; }
	.multipleLine .bd {width: 1280px;}
	.showcases li .cimic img{ width: 300px; }
	.showcases li .title{ width: 300px;}
	.multipleLine .btnnext{right: -80px;}
	.multipleLine .btnprev{left: -80px;}
	.showcases li .ftext {width: 300px; height:  203px; }
}