.MainContainer{max-width:720px;margin:auto;background: #f9f9f9;}

.ShowTypes{line-height: 50px;overflow: hidden;position: relative;}
.ShowTypes:after{content: '';display: block;width: 100%;height: 0px;position: absolute;left: 0px;bottom: 0px;background: #EEE;}
.ShowTypes a{display: block; padding: 0 15px; text-align: center;height: 43px;float: left;position: relative;overflow: hidden;color: #333;}
.ShowTypes a.ck{color: #f30; font-weight:700;}
.ShowTypes a.ck:after{content: '';display: block;width: 30%; height: 3px;position: absolute;left: 35%;bottom: 0px;background: #f30;}

.ListBox{margin:10px 0;}
.ListBox .list{border: #f9f9f9 solid 1px; margin-bottom:10px; background: #fff; border-radius: 5px; box-shadow: 0 3px 10px #f9f9f9;}
.ListBox .list ul{display: table;padding:15px;}
.ListBox .list ul li{display: table-cell;vertical-align: middle;}
.ListBox .list ul li.img{width:120px;padding-right:15px;}
.ListBox .list ul li.img a{display: block;width:120px;overflow: hidden;position: relative;border-radius: 5px;}
.ListBox .list ul li.img a:before{content: '';display: block;padding-top: 100%;}
.ListBox .list ul li.img a img{position: absolute;width:100%;height: 100%;left: 0;top:0;}
.ListBox .list ul li.img a span{display: block;width:20px;height: 20px;text-align: center;line-height: 20px;font-size:14px;color: #FFF; background: #aaa;position: absolute;left:5px;top:0px;box-shadow: 0px 0px 1px #fff;
}
.ListBox .list ul li.img a span.num1{background: #F30;}
.ListBox .list ul li.img a span.num2{background: #F60;}
.ListBox .list ul li.img a span.num3{background: #F90;}

.ListBox .list ul li.info{ text-align:justify;}
.ListBox .list ul li.info .title{font-size: 1rem;line-height: 1.2rem;font-weight: 700;}
.ListBox .list ul li.info .cnt{color: #666; padding: 3px 0; font-size: .8rem; line-height: 18px;}
.ListBox .list ul li.info .cnt i{ color: #666; padding-right: 5px;}
.ListBox .list ul li.info .other{color: #999; padding: 3px 0; font-size: .7rem;  line-height: 18px;}
.ListBox .list ul li.info .other i{padding-right: 5px;}

.ListBox .list ul li.join{width:50px;}
.ListBox .list ul li.join a{display: block;border:#f30 solid 1px;color: #f30;line-height: 20px;text-align: center;border-radius: 10px; font-size:12px;}

.article__header {position:relative;padding:10px; margin:15px; border-radius: 5px; background:#f3f4f5;}
.article__header .gonggao{display: table; }
.article__header .gonggao li{display: table-cell;vertical-align: middle;}
.article__header .i{width:40px; color:#f30; font-size:30px;}
.article__header .title{font-size: 14px; line-height:20px;}
.favor-wrapper {position:absolute;top:50%;right:10px;-webkit-transform:translateY(-50%);background: #f30;border-radius:15px; padding:0 10px;font-size:12px;text-align: center;}
.favor-wrapper a {color:#fff;}

.scroll-sort{padding:10px 15px; background:#f6f6f6;}
.scroll-sort span a{display: block;text-align: center;float: left;position: relative;overflow: hidden;color: #333;}
.scroll-sort span{ margin-right:15px; line-height:30px;display:block;float:left;}
.scroll-sort span:hover a{color:#F60;}
.scroll-sort .choose{border-bottom:2px solid #f30;}
.scroll-sort .choose a{color:#d00;} 
.scroll-sort .stitle{float:left;line-height:30px;padding-right:10px; font-weight:bold;color:#333;}
.swiper-slide_filtrate{width: auto!important;}

.MainMenu{ margin:10px 0;}
.MainMenu:after{content: '';display:block;clear: both;}
.MainMenu li{width:25%;float: left;}
.MainMenu li span{display: block; width:50px;overflow: hidden;margin: auto;text-align: center;position: relative;}
.MainMenu li span{color: #999;}
.MainMenu li em{overflow: hidden;font-size:12px; color: #999;text-align: center;display: block; }
.MainMenu li span i{font-size:30px;}


.butters{text-align:center;padding:20px 0 50px;}
.butters button{width:80%;line-height:40px;background:#f30;color:#FFF;border:0;font-size:16px;border-radius:20px;}
.butters button:hover{background:#F90;}


.sort_button{width:100%;}
.sort_button .swiper-pagination{bottom:0px !important;}
@media (max-width: 500px) and (min-width:401px) {
	.ListBox .list ul li.img{width:100px;}
	.ListBox .list ul li.img a{width:100px;}

	.addGroup ul ol{width:100px;}
}
@media (max-width: 400px) {
	.ListBox .list ul li.img{width:90px;}
	.ListBox .list ul li.img a{width:90px;}

	.addGroup ul ol{width:90px;}
}

.MainContainer .ShowMores{background:orange;border-radius:5px;padding:5px;color:#fff;text-align:center;}