/* --------以下两行样式代码为固定写法--------  */
.clearfix:after {
    content: '';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
    /* 为 IE6、IE7浏览器设置的清除浮动 */
    *zoom: 1;
}

.container {
    width: 1200px;
    margin: 0 auto 40px;
}


.areasOfFocus {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.areasOfFocus .bannerImg {
    margin-bottom: 20px;
    width: 100%;
    height: auto;
}

.areasOfFocus a {
    width: 180px;
    height: 70px;
    display: flex;
    align-items: center;
    background-color: #e7f1fc;
    text-align: center;
    margin-bottom: 20px;
}

.areasOfFocus a img {
    width: 31px;
    height: 31px;
    margin-right: 10px;
    margin-left: 18px;
}

.areasOfFocus a p {
    text-align: left;
}

.areasOfFocus a:hover {
    border-radius: 10px;
    box-shadow: 0px 5px 10px 0px rgba(86, 220, 243, 0.4);
}


/*适老化样式*/
.newStyle .areasOfFocus a {
    width: 30%;
    height: 100px;
}

.newStyle .areasOfFocus a img {
    width: 50px;
    height: 50px;
}

.newStyle .areasOfFocus a p {
    font-size: 32px;
}

/**在小于1199像素之间的屏幕里，中等屏幕，分辨率低的PC**/
@media only screen and (max-width: 1199px) {


    .container {
        width: 90%;
    }

    .
}

/**在小于991像素之间的屏幕里，小屏幕，主要是PAD**/
@media only screen and (max-width: 991px) {


    .container {
        width: 90%;
    }

}

/*在小于767像素之间的屏幕里，手机。 */
@media only screen and (max-width: 767px) {


}

/*手机*/
@media (max-width: 560px) {

}

/*超小手机*/
@media (max-width: 300px) {

}