.news-banner-popup { position: absolute; width: 100%; height: 100%; top: 0; left: 0; text-align: center; padding-top: 17%; overflow: hidden; } .news-banner-popup .tit1 { /* margin-top: 17%; */ font-size: 3.75vw; font-weight: bold; line-height: 1.2; color: #021826; opacity: 0.6; } .news-banner-popup .tit2 { font-size: 2.5vw; font-weight: bold; color: #021826; margin-top: -0.5em; line-height: 1.2; } .news-list { padding-top: 0.32rem; } .news-item { display: flex; background: #fff; cursor: pointer; transition: all 0.3s; padding: 0.2rem; border-radius: 5px; border: 1px solid #eee; align-items: center; } .news-item:hover { box-shadow: 0 0.05rem 0.3rem rgba(0, 0, 0, 0.1); } .news-item+.news-item { margin-top: 0.22rem; } .news-item .cover { width: 2.8rem; height: 2.2rem; overflow: hidden; } .news-item .cover img { width: 100%; height: 100%; object-fit: cover; transition: all 1s; } .news-item:hover .cover img { transform: scale(1.1); } .news-item .time { width: 2.13rem; text-align: center; } .news-item .time .date { font-size: 0.48rem; font-weight: 400; line-height: 1.2; color: #333333; } .news-item .time .year { font-size: 0.2rem; font-weight: 400; line-height: 1.4; color: #999999; margin-top: 0.05rem; } .news-item .info { flex: 1; position: relative; } .news-item .info .tit { font-size: 0.24rem; font-weight: 400; color: #333; line-height: 1.2; word-break: break-all; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: all 0.3s; } .news-item:hover .info .tit { color: #0A85D3; } .news-item .info .desc { font-size: 0.16rem; font-weight: 400; color: #999; line-height: 1.8; word-break: break-all; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin-top: 0.15rem; } .news-item .info .tags { position: absolute; bottom: 0.4rem; left: 0.32rem; font-size: 0.18rem; font-weight: 400; color: #999; } .news-item .info .tags .ml { margin-left: 0.16rem; } @media screen and (max-width: 1440px) { .news-banner-popup .tit1 { font-size: 4.25vw; } .news-banner-popup .tit2 { font-size: 3.2vw; } .news-item .cover { width: 2.4rem; height: 2rem; } .news-item .time { width: 1.8rem; } .news-item .time .date { font-size: 0.4rem; } .news-item .time .year { font-size: 0.16rem; } .news-item .info .tit { font-size: 0.2rem; } .news-item .info .desc { line-height: 1.5; } } @media screen and (max-width: 900px) { .news-banner-popup .tit1 { font-size: 7vw; } .news-banner-popup .tit2 { font-size: 5.2vw; } .news-list { padding-top: 0.2rem; padding-bottom: 0; } .news-item { padding: 0.1rem; overflow: hidden; } .news-item+.news-item { margin-top: 0.15rem; } .news-item .cover { width: 0.84rem; height: 0.84rem; margin-right: 0.12rem; } .news-item .info { padding: 0; /* padding-left: 0.12rem; */ padding-bottom: 0.2rem; } .news-item .info .tit { font-size: 0.16rem; line-height: 1.4; -webkit-line-clamp: 1; } .news-item .info .desc { font-size: 0.13rem; margin-top: 0.05rem; line-height: 1.4; -webkit-line-clamp: 2; } .news-item .info .tags { font-size: 0.12rem; bottom: 0; left: 0.12rem; } .news-item .info .tags .ml { margin-left: 0; display: block; } }