/*教学阵地*/
.area{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;}
.area dt{position:relative;background:#9a0e0e;color:#fff;padding:5px 20px;border-radius:5px;}
.area dt:after{content:'';display:block;width:0;height:0;border:10px solid transparent;border-top-color:#9a0e0e;position:absolute;left:50%;bottom:-20px;margin-left:-10px;}
.area dd{display:flex;flex-wrap:wrap;flex:1;}
.area dd span{margin:0 0 20px 35px;cursor:pointer;padding:5px 10px;border-radius:5px;}
.area dd span.hover{background:#9a0e0e;color:#fff;}

.areaBox{display:flex;justify-content:space-between;}
.areaBoxTags{background:#fff;padding:15px;box-shadow:0 0 5px #999;width:380px;box-sizing:border-box;margin-right:30px;}
.areaBoxTags dt,.areaBoxContent dt{display:flex;align-items:center;padding:13px;background:#fff5ed;color:#9a0e0e;font-weight:bold;}
.areaBoxTags dt .icon,.areaBoxContent dt .icon{height:20px;width:auto;margin-right:13px;fill:#9a0e0e;}
.areaBoxTags dd p{display:flex;align-items:center;padding:35px 29px;background:#fff5ed;border:1px solid #9a0e0e;margin-top:20px;color:#9a0e0e;cursor:pointer;}
.areaBoxTags dd p .icon{height:30px;width:auto;margin-right:20px;fill:#9a0e0e;}
.areaBoxTags dd p.hover{background:#9a0e0e;color:#fff;font-weight:bold;}
.areaBoxTags dd p.hover .icon{fill:#fff;}
.areaBoxContent{flex:1;background:#fff;padding:15px;box-shadow:0 0 5px #999;display:flex;flex-flow:wrap column;}
.areaBoxContent dd{margin-top:10px;overflow-y:auto;max-height:350px;display:flex;justify-content:space-between;flex-flow:wrap;align-items:flex-start;padding:0 10px;}
.areaBoxContent dd a{width:47%;display:flex;justify-content:space-between;text-decoration:none;padding:18px 0;border-top:1px dashed #d1d1d1;align-items:flex-start;min-height:80px;}
.areaBoxContent dd a:nth-child(1),.areaBoxContent dd a:nth-child(2){border:none;}
.areaBoxContent dd a p{flex:1;font-size:14px;color:#999;}
.areaBoxContent dd a p b{display:block;font-size:16px;font-weight:normal;color:#333;padding-bottom:10px;}
.areaBoxContent dd a span{width:130px;height:80px;overflow:hidden;display:flex;align-items:center;justify-content:center;margin-left:20px;flex-shrink:0;}
.areaBoxContent dd a span img{width:100%;height:100%;object-fit:cover;}
.areaBoxContent dd .sortNone{height:350px;display:flex;align-items:center;justify-content:center;font-size:18px;color:#999;width:100%;}


@media screen and (max-width:860px) {
.area{flex-flow:wrap column;}
.area dt{width:100%;text-align:center;padding:1.5rem 0;}
.area dd{padding-top:3rem;display:flex;flex-flow:wrap;}
.area dd span{margin:0 1rem 0 0;}

.areaBox{flex-flow:wrap column;margin-top:2rem;}
.areaBoxTags,.areaBoxContent{width:100%;padding:0;box-shadow:none;margin:0;background:none;}
.areaBoxTags dd p{padding:1rem 2rem;margin-top:1rem;}
.areaBoxTags dd p .icon{height:2rem;}
.areaBoxContent{margin-top:2rem;}
.areaBoxContent dd{padding:0;max-height:45rem;}
.areaBoxContent dd a{flex-flow:wrap column}
.areaBoxContent dd a span,.areaBoxContent dd a p{width:100%;}
.areaBoxContent dd a span{margin:1.5rem 0 0 0;height:14rem;}

.area dd,.areaBoxTags dd,.areaBoxContent dd a p b{font-size:1.6rem;}
}
/*��ѧ���*/