*{margin:0;padding:0;list-style: none;text-decoration : none;font-family: \\5FAE\8F6F\96C5\9ED1,Open Sans,Arial,Hiragino Sans GB,Microsoft YaHei,STHeiti,WenQuanYi Micro Hei,SimSun,sans-serif;}
#periphery{
	width: 100%;overflow: auto;
}
.banner,.banner img{width: 100%;position:relative}
.banner span{color:#c71d1d;font-size:20px;position:absolute;left:0;right:2%;bottom:22%;margin:auto;    text-align: center;font-weight:800}
.con{max-width: 1200px;margin:auto;overflow: auto}
.con-l{width: 70%;float: left;padding:10px;margin:10px;box-shadow: 0 0 10px #ccc;}
.con-r{width: 25%;float: right;margin:10px;}

.classify-nav{width: 100%;border-bottom:1px solid#e8e8e8;overflow: auto;padding-bottom: 10px}
.classify-nav h3{
	float: left;
    color: #000;
    font-size: 22px;
    font-weight: bold;
    position: relative;
    padding-left: 14px;
    margin-right: 136px;
    margin-top: 8px;
}
.classify-nav h3::before {
    content: "";
    position: absolute;
    width: 4px;
    height: 24px;
    background: #c71d1d;
    -ms-border-radius: 50em;
    border-radius: 50em;
    left: 0;top: 4px
}
.classify-nav ul{width: 50%;float: left;margin-left: 5%}
.classify-nav ul li{width: 25%;float: left;text-align: center;font-size:16px;}
.classify-nav ul li a{color: #333;display: block;padding: 8px 0 4px;transition: all .5s ease-out;}
.classify-nav ul li a:hover{color: #c71d1d !important;border-bottom:2px solid#c71d1d;transform:scale(1.15);}
.classify-nav-on{color: #c71d1d !important;border-bottom:2px solid#c71d1d;transform:scale(1.15);}
#crumbs{color: #AAA;font-size:14px;border-bottom:1px dashed #e8e8e8;width: 100%;padding:10px 0;}
#crumbs a{color:#aaa}

.article-list{width: 100%}
.list-con{width: 100%;overflow: auto}
.list-con li{width: 98%;padding:20px 1%;border-bottom: 1px dashed #e8e8e8;overflow: auto}
.list-con li img{width: 26%;float: left}
.list-con li div{width: 72%;float: right}
.list-con li div h3{font-size: 20px;display: inline-block;white-space: nowrap; width: 100%; overflow: hidden;text-overflow:ellipsis;color: #000}
.list-con li div p{font-size: 14px;color: #888;width:100%;word-break:break-all;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;    line-height: 20px;text-align: justify;}
.list-con li div h6{color: #888;font-size: 14px;font-weight: 400;padding:0 0 7px;}
.list-con li div span{opacity: .8;font-size:13px;float: left;width: auto;background: #f8f8f8;color: #fff;padding: 0 12px;margin: 15px 10px 0px 0px;height: 26px;line-height: 26px;border-radius: 3px}
.list-con li div span a{color: #fff}

.tutor-rec{width: 95%;box-shadow: 0 0 10px #ccc;padding:10px;}
.tutor-rec h5{text-align: center;font-size: 16px;color: #aaa;font-weight:400;padding: 9px 0;cursor: pointer;}
.tutor-rec h5 span:nth-child(1){float: left}
.tutor-rec h5 span:nth-child(2){float: right}
.tutor-rec h5 span:hover{color: #c71d1d !important;}
.tutor-rec-on{color: #c71d1d !important;}
.tutor-rec ul{width: 100%;padding-top: 10px}
.tutor-rec ul li {width: 100%;border-top: 1px solid#e8e8e8;padding:14px 0 20px 0;}
.tutor-rec ul li img{width: 28%;border-radius: 50%}
.tutor-rec ul li div{width: 70%;float: right}
.tutor-rec ul li div h4{font-size: 16px;color: #c71d1d}
.tutor-rec ul li div h4 a{color: #c71d1d}
.tutor-rec ul li div p{font-size: 13px;color: #808080;padding-top: 4px;width: 100%;word-break: break-all;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.tutor-rec ul li div div{font-size: 14px;width: 60%;color: #fff;background: #c71d1d;height: 26px;line-height: 26px;text-align:center;border-radius: 4px;float: left;margin-top: 4px}
.tutor-rec ul li div div a{color: #fff}
.tutor-rec-con-on{display: none}

.hot-article,.handpick-article,.hot-search{width: 95%;box-shadow: 0 0 10px #ccc;padding:10px;margin-top: 10px}
.hot-article h5,.handpick-article h5,.hot-search h5{font-size: 18px;position: relative;padding: 4px 0 0 12px;font-weight:300;}
.hot-article h5::before ,.handpick-article h5::before,.hot-search h5::before{
    content: "";
    position: absolute;
    width: 4px;
    height: 20px;
    background: #c71d1d;
    -ms-border-radius: 50em;
    border-radius: 50em;
    left: 0;top: 6px
}
.hot-article ul,.handpick-article ul,.hot-search ul{width: 100%;padding:10px 0;border-top: 1px solid#e8e8e8;margin-top: 6px}
.hot-article ul li,.handpick-article ul li{width: 100%;    border-bottom: 1px dashed #f0f0f0;padding:5px 0;}
.hot-article ul li p,.handpick-article ul li p{width: 100%;display: inline-block;white-space: nowrap;width: 100%;overflow: hidden;text-overflow: ellipsis;font-size: 15px;color: #888}
#con-r-banner{width: 101.5%;margin-top: 12px;box-shadow: 0 0 10px #ccc;    position: relative;}
#con-r-banner-a{width:100%}
#con-r-banner-b{width:27%;position: absolute;left:22%;bottom:4%;margin:auto}
.hot-article ul li p a,.handpick-article ul li p a{color:#888}
.hot-article{margin-top:0}

.hot-search ul{overflow: auto}
.hot-search ul li{
	opacity: .8;
    font-size: 13px;
    float: left;
    width: auto;
    background: #f8f8f8;
    color: #fff;
    padding: 0 12px;
    margin: 4px 10px 10px 0px;
    height: 26px;
    line-height: 26px;
    border-radius: 3px;float: left
}
.hot-search ul li a{color: #fff}

.list-fy{width:100%;height:60px;padding-top:14px} 
.pagination{width:100%;    overflow: auto;}
.pagination li {min-width: 37px; line-height: 35px;float:left;text-align: center;border-radius: 2px;border:1px solid#dee2e6;margin-left:5px;    opacity: .7;color:#6c757d }
.pagination li a{color:#6c757d}
.active{background:#c71d1d;color:#fff !important;border:1px solid#c71d1d  !important;}

.mb-footer-nav{display:none;width:100%} 
.mb-footer-nav a img{width:100%}
.mb-footer-nav ul{width:96%;border-bottom: 1px solid #f0f0f0;overflow: auto;margin:auto;padding-bottom:10px;margin-top:10px}
.mb-footer-nav ul li{width:24%;float:left;border-right: 1px solid #f0f0f0;font-size:15px;text-align: center;margin:4px 0;}
.mb-footer-nav ul li a{color:#000;}



@media(max-width: 1220px){
	.con{padding:20px 0 30px;}
	.con-l{width: 90%;margin:auto;float: none}
	.con-r{display: none}
	.banner span {font-size: 18px;bottom: 21%;}
}
@media(max-width: 900px){
	.con-l{width: 95%;}
	.banner span {font-size: 14px;}
}
@media(max-width: 700px){
	.classify-nav ul {width: 58%;margin-left: 0%}
	.banner{display: none}
}
@media(max-width: 600px){
	.con-l{box-shadow: 0 0 0 #ccc;padding:0;margin:0;width: 100%}
	#crumbs{display: none}
	.classify-nav {border-bottom: 2px solid#e8e8e8;}
	.classify-nav h3{display: none;}
	.article-list ul {width: 96%;margin:auto;}
	.article-list ul li div{float: left}
	.article-list ul li img {float: right;}
	.article-list ul li div p {display: none}
	.article-list ul li div h3 {font-weight: 400;font-size: 16px}
	.article-list ul li {border-bottom: 1px solid #e8e8e8;}
	.classify-nav-on{border-bottom: 0px solid#c71d1d;transform: scale(1);}
	.classify-nav ul {width: 90%;margin:auto;float: none;overflow: auto;}
	.classify-nav ul li{width: 24.5%;border-right:1px solid#e8e8e8;}
	.classify-nav ul li a {padding: 4px 0 4px;}
	.classify-nav ul li a:hover{color: #c71d1d !important;border-bottom:0px solid#c71d1d;transform:none;}
	.con {padding: 60px 0 30px;}
	.mb-footer-nav{display:block}
}
@media(max-width: 500px){
	.list-con li div span {display: none}
	.list-con li div h6 {padding: 20px 0 0 0;}
	.list-con li div h3 {font-size: 16px;}
	.classify-nav ul li {font-size: 14px;}
	.list-con {width: 95%;}
	.list-con li {padding:15px 1%;}

}
@media(max-width: 420px){
	.list-con li div h6 {padding: 10px 0 0 0;}
	.list-con li {padding:10px 1%;}
	.classify-nav ul {width: 95%;}
}