*{
    padding: 0;
    margin: 0;
}
main {
    background-color: #fafafa;
}

.section1 {
    width: 80%;
    margin: 0 auto;
    overflow: hidden;
    background-color: #fafafa;
    box-sizing: border-box;
}

.article {
    width: 60%;
    position: relative;
    display: inline-block;
    vertical-align: top;
    float: left;
    margin-left: 10%;
    margin-right: 5%;
}

 .q {
    background-color: #fff;
    position: relative;
    width: 15%;
    float: left;
    top: 15px;
    margin-right: 5%;
}

.list {
    list-style: none;
    background-color: #fff;
    position: relative;
    margin-top: 15px;
    margin-bottom: 15px;
    padding: 20px 10px 0px 210px;
    height: 130px;
}

.list img:hover {
    box-shadow: 10px 10px 10px rgba(240, 233, 233, 0.5);
    -webkit-box-shadow: 5px 5px 5px rgba(180, 170, 170, 0.5);
}

.list img {
    width: 160px;
    height: 110px;
    position: absolute;
    left: 20px;
    top: 20px;
    transition: all 0.5s ease-in-out;
    border-radius: 3px;
}

.list img:hover {
    transform: scale(1.1, 1.1);
}

.list h2 {
    font-size: 18px;
    color: #000;
}

.list h2:hover {
    color: #50c4e5;
}

.list p {
    font-size: 14px;
    margin: 10px 0;
    font: 16px Arial, 'Microsoft Yahei', tahoma;
    overflow: hidden;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    color: #666;
}

.list span {
    position: relative;
    padding-left: 20px;
    color: #888;
}

.list .i1::before {
    content: "";
    background-image: url(../images/sj.png);
    background-repeat: no-repeat;
    position: absolute;
    width: 20px;
    height: 20px;
    top: 0px;
    left: 0;
}

.list .i2::before {
    content: "";
    background-image: url(../images/ll.png);
    background-repeat: no-repeat;
    position: absolute;
    width: 20px;
    height: 20px;
    top: 0px;
    left: 0;
}

h3 {
    margin: 15px 20px 5px 20px;
}

.m {
    margin-top: 20px;
}

.q ul li {
    margin: 5px 20px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 1;
}

.q ul li a {
    margin-left: 5px;
}

.q ul li a:hover {
    color: red;
}