@charset "utf-8";

.mr_frbox { 
   width: 70%;
    height: auto;
    margin: 0 auto;
    padding: 0px 22px 0px;
    overflow: hidden;
}
.mr_frBtnL { 
	float: left; 
	margin: 70px 22px 0px 0px; 
	cursor: pointer; 
	display: inline; 
}
.mr_frUl { 
    float: left;
    height: auto;
    width: 93%;
    overflow: hidden;
}
.mr_frBtnR { 
	float: right; 
	margin-top: 70px; 
	cursor: pointer; 
}
.mr_frUl ul li { 
  position: relative;
	display: inline; 
	float: left; 
	height: 200px; 
	width: 23.5%; 
	margin:10px 8px; 
	overflow: hidden; 
}
.mr_frUl ul li img { 
	display: block;  
}
.mr_frUl ul li h3{
  position: absolute;
  bottom:0;
  left:0;
	width:94%;
	text-align: center;
    font-size: 14px;
    line-height: 30px;
    text-overflow: ellipsis;
    overflow: hidden;
    color:#fff;
    white-space: normal;
    padding:5px 3%;
    background:rgba(0,0,0,.5);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

@media screen and (max-width: 1400px){
.mr_frUl {
    width: 90%;
}
.mr_frUl ul li h3{
  width:92%;
}




}


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

.mr_frbox { 
   width: 900px;
   padding: 24px 0 0px; 
}
.mr_frUl { 
    width: 800px;
}

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

.head_top .head_tt {
    width: 95%;
}
.mr_frUl {
    width: 68%;
}
.mr_frbox {
    width: 96%;
}
.mr_frUl {
    width: 88%;
}
.mr_frBtnL {
    margin: 40px 22px 0px 0px;
}
.mr_frBtnR {
    margin-top: 40px;
}




}
@media screen and (max-width: 640px){
.head_top .head_tt .top_r {
    display: none;
}
.mr_frbox {
    padding: 0;
}
.mr_frUl {
    width: 82%;
}
.mr_frBtnL {
    margin: 30px 5px 0px 0px;
}
.mr_frBtnR {
    margin-top: 30px;
}
.mr_frUl ul li {
    width: 50%;
}
.mr_frUl ul li h3 {
    width: 94%;
}




}