/*banner*/ .banner { width: 100%; height: 340px; overflow: hidden; } .swipper-wrapper { width: 60%; float: left; } .swiper-slide { position: relative } .swipper-wrapper .swiper-pagination-bullet-active { background: #ff6900 !important; } /*headline-box*/ .headline-box { float: right; width: 38%; height: 340px; background-color: #fff; } .headline-news { overflow: hidden; /* padding: 17px 31px 21px; */ } .headline-news .title { margin-bottom: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #ff6900; } .headline-news .title a { color: #ff6900; } .headline-news .title span { float: left; font-size: 12px; font-weight: normal; border: #ff6600 1px solid; padding: 0 5px; border-radius: 3px; color: #ff6600; margin: 4px 8px 0 0; } .headline-news .desc { line-height: 20px; font-size: 14px; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 3; height: 60px; margin-bottom: 10px; color: #888; } .headline-news .t-line { border-top: #ddd 1px solid; } .headline-news .list { padding-top: 10px; padding-left: 0; } .headline-news .list li { padding-left: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 30px; position: relative; list-style-type: none; } .headline-news .list li:before { position: absolute; content: ""; width: 5px; height: 5px; background: #ff6900; border-radius: 10px; left: 0; top: 15px; } .headline-news .list li a { color: #000; } .headline-news .list li a:hover { color: #ff6900; } /** list **/ .content { margin-top: 30px; padding: 20px; } .content.flex { display: flex; padding: 0 !important; } .content .sub-content { flex: 1; padding: 20px; } .content .flex-interval { width: 30px; } .content .title { margin-bottom: 20px; overflow: hidden; } .content .title h2 { border-bottom: solid 2px #ff6900; color: #ff6900; padding-bottom: 10px; float: left; } .content .title a { float: right; color: #000; } .content .title a:hover { float: right; color: #ff6900; } .content .list ul { overflow: hidden; padding: 0; margin: 0; } .content .list ul li { width: 50%; float: left; margin-bottom: 20px; } .content .list ul li:nth-child(5), .content .list ul li:nth-child(6) { margin-bottom: 0 } .content .list ul li:nth-child(even) div { margin: 0 0 0 20px; } .content .list ul li div { display: block; padding: 10px; transition: all 0.5s; color: #000; } .content .line-list ul li div { border: #ddd 1px solid; } .content .list ul li span { width: 70px; height: 70px; font-size: 12px; text-align: center; overflow: hidden; background: #ababab; color: #fff; float: left; margin: 0 10px 0 0; transition: all 0.5s; } /* .content .list ul li b { display: block; font-size: 16px; margin-top: 16px; } */ .content .list ul li h3 { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; font-weight: normal; margin-bottom: 10px; } .content .list ul li h3 a{ color: #333; } .content .list ul li p { font-size: 14px; color: #888; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; line-height: 20px; height: 40px; margin: 0; } .content .list ul li:hover span { background: #ff6900 } .content .list ul li:hover h3 a{ color: #ff6900 } .content .list ul li img { width: 100%; height: 100%; display: inline-block; vertical-align: middle; transition: .5s; } .content .list ul li:hover img { transform: scale(1.2); }