body,ul{margin:0;padding:0}ul{list-style:none}

.container{margin:0 auto;width:940px}

.roll-wrap:hover 
.control{display:block}
.roll-wrap{position:relative;width:100%;height:520px;overflow:hidden}
.roll-wrap .roll__list{}.roll_row .roll__list::before,.roll_row 
.roll__list::after{content:"";display:table;line-height:0}
.roll_row .roll__list::after{clear:both}
.roll_row .roll__list{width:9999px}
.roll_row .roll__list li{float:left;display:block;margin-right:20px;width:100px;height:100px;line-height:100px;font-weight:700;font-size:30px;text-align:center;color:#fff;background-color:#f90}.control{position:absolute;top:240px;display:none;padding:10px 5px;font-weight:700;text-decoration:none;color:#fff;background-color:rgba(0,0,0,.3)}
.control:hover{background-color:rgba(0,0,0,.5)}
.control.pre{left:5px}.control.next{right:5px}
.roll_col{width:100%;height:520px;overflow:hidden}
.roll_col .roll__list{width:100%}
.h330{height:330px}
.roll_col li{display:block;height:110px; overflow: hidden; padding-left: 2%}
.roll_col-star li{display:block;height:520px; overflow: hidden; padding-left: 0}
.roll_col li .tp{ width:17.5%; background: #fff; height:auto; border: 1px solid #e4e4e4; float: left; margin: auto 0.5%}
.roll_col li .tp img{width:100%;max-width:237px;}

.roll_col .li-2{background-color:#09f}
.roll_col .li-3{background-color:#f09}
.roll_col .li-4{background-color:#0f9}
.roll_col .control{top:130px}



/*<1360*/
@media screen and (max-width:1360px) 
{
	
.roll-wrap{;height:480px;}
.roll_col{height:480px;}
.roll_col-star li{height:480px; }
}

/*<1280*/
@media screen and (max-width:1280px) 
{
	
.roll-wrap{;height:430px;}
.roll_col{height:430px;}
.roll_col-star li{height:430px; }
}

/*<1100*/
@media screen and (max-width:1100px) 
{
	
.roll-wrap{;height:400px;}
.roll_col{height:400px;}
.roll_col-star li{height:400px; }
}

/*<1000*/
@media screen and (max-width:1000px) 
{
	
.roll-wrap{;height:355px;}
.roll_col{height:355px;}
.roll_col-star li{height:355px; }
}

/*<800*/
@media screen and (max-width:800px) 
{
	
.roll-wrap{;height:300px;}
.roll_col{height:300px;}
.roll_col-star li{height:300px; }
}

/*<660*/
@media screen and (max-width:660px) 
{
	.roll_col li{padding-left: 1%;height: 50px;}
	.h330{ height:150px;}
	.roll_col .control{    top: 50px;}
	
	.roll-wrap{;height:150px;}
.roll_col{height:150px;}
.roll_col-star li{height:150px; }
}