//第一部分 .part1 { width: 100%; height: 475px; overflow: hidden; margin-top: 30px; margin-bottom: 30px; .inner { width: 1200px; margin: 0 auto; //左侧 .part1_left { float: left; width: 900px; position: relative; .hengxian { width: 900px; height: 2px; background: #DD7D18; margin-top: 10px; em { display: inline-block; width: 100px; height: 6px; background: #DD7D18; position: absolute; top: 10px; left: 46px; } } .part1_left_title { font-family: Microsoft YaHei, Microsoft YaHei; font-weight: bold; font-size: 24px; color: #333333; margin-top: 20px; a { color: #333333; } img { width: 30px; height: 30px; vertical-align: middle; margin-right: 10px; } } .part1_left_content { width: 900px; height: 300px; margin-top: 20px; .part1_left_content1 { float: left; .part1_left_photo { width: 410px; height: 160px; .part1_left_photo11 { width: 195px; height: 160px; float: left; img { width: 195px; height: 117px; } .left_content { width: 195px; height: 40px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 40px; font-weight: 400; font-size: 18px; color: #333333; } } .part1_left_photo11:hover { .left_content { color: #dd7d18; } } .part1_left_photo11:first-child { margin-right: 20px; } } .part1_left_context { float: left; width: 410px; height: 160px; margin-top: 20px; .part1_left_contextList { width: 410px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; color: #333333; margin-bottom: 22px; a { color: #333333; } } .part1_left_contextList:first-child { width: 410px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: bold; font-size: 18px; color: #333333; a { color: #333333; } } .part1_left_contextList:hover a { color: #dd7d18; } } .part1_left_content2 { float: right; width: 450px; height: 300px; margin-top: 40px; background-color: #333333; } } .part1_left_content2 { float: left; width: 450px; margin-left: 30px; .part1_left_context222 { width: 450px; .part1_left_contextList222 { width: 450px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; color: #333333; margin-bottom: 20px; a { color: #333333; } } .part1_left_contextList222:hover a { color: #dd7d18; } .part1_left_contextList222:first-child { font-weight: bold; } } .part1_left_context222:last-child { margin-top: 30px; } } } } //右侧 .part1_right { float: right; width: 270px; .part1_right_title { font-size: 22px; .part1_right_titlelist { color: #999999; margin-right: 20px; } .part1_right_titlelist1 { color: #999999; } .active { font-weight: bold; color: #333333; } } .part1_right_photo_text { width: 270px; margin-top: 20px; img { width: 270px; height: 170px; } .part1_right_text { margin-top: 10px; width: 270px; height: 50px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; word-break: break-all; overflow: hidden; font-size: 18px; color: #333333; } } .part1_right_photo_text:hover { .part1_right_text { color: #dd7d18; } } .part1_right_content { width: 270px; margin-top: 26px; .part1_right_contentList { width: 275px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; color: #333333; margin-bottom: 20px; a { color: #333333; } em { display: inline-block; width: 8px; height: 8px; background-color: #ccc; border-radius: 4px; margin-right: 10px; } } .part1_right_contentList:hover { a { color: #dd7d18; } } } } } } //第二部分 .part2 { width: 100%; height: 525px; margin-bottom: 30px; margin-top: 30px; .inner { width: 1200px; margin: 0 auto; .part2_left { float: left; width: 900px; position: relative; .part2_hengxian { width: 900px; height: 2px; background: #DD7D18; margin-top: 10px; em { display: inline-block; width: 100px; height: 6px; background: #DD7D18; position: absolute; top: 10px; left: 46px; } } .part2_left_title { font-family: Microsoft YaHei, Microsoft YaHei; font-weight: bold; font-size: 24px; color: #333333; margin-top: 20px; a { color: #333333; } img { width: 30px; height: 30px; vertical-align: middle; margin-right: 10px; } } .part2_left_content1 { float: left; width: 420px; margin-top: 25px; margin-right: 30px; .part2_left_content111 { // margin-top: 30px; .part2_left_content1_list { width: 420px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; color: #333333; margin-bottom: 20px; a { color: #333333; } a .nav2_title { color: #999999; padding-right: 10px; border-right: 1px solid #dd7d18; } .nav2_title:hover { color: #dd7d18; } a .nav2_title_content { color: #333333; margin-left: 10px; } .nav2_title_content:hover { color: #dd7d18; } } .part2_left_content1_list:nth-child(5n+1) { .nav2_title_content { font-weight: bold; } } .part2_left_content1_list:last-child{ margin-bottom: 0; } } } .part2_left_content2 { position: relative; float: right; width: 450px; height: 430px; margin-top: 25px; .part2_left_content2list { display: flex; width: 450px; height: 120px; margin-bottom: 30px; img { float: left; width: 180px; height: 120px; } .content2_text { float: right; width: 252px; height: 120px; padding-left: 15px; position: relative; .content2_text_content { width: 252px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; word-break: break-all; // display: block; font-weight: bold; font-size: 18px; color: #333333; } .content2_text_title { display: block; width: 66px; height: 28px; line-height: 28px; text-align: center; font-size: 14px; color: #999999; background-color: #f5f5f7; position: absolute; left: 15px; bottom: 0; } } .content2_text:hover { .content2_text_content { color: #dd7d18; } } } .adlogo3{ position: absolute; bottom: 0; right: 0; width: 450px; height: 290px; } } } .part2_right { float: right; width: 270px; // height: 1000px; .part2_right_title { font-weight: bold; font-size: 22px; color: #333333; a { color: #333333; } } .part2_right_content { width: 270px; margin-top: 15px; .part2_right_contentList { width: 270px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; color: #333333; padding-top: 17px; padding-bottom: 16px; box-sizing: border-box; border-bottom: 1px solid #DDDDDD; a { color: #333333; } .listNumber { font-family: DingTalk JinBuTi, DingTalk JinBuTi; font-weight: 400; font-size: 20px; color: #D9D9D9; margin-right: 15px; } } .part2_right_contentList:hover { a { color: #dd7d18; } } .part2_right_contentList:nth-child(1) { .listNumber { color: #DD7D18; } } .part2_right_contentList:nth-child(2) { .listNumber { color: #DD7D18; } } .part2_right_contentList:nth-child(3) { .listNumber { color: #DD7D18; } } } } } } //第三部分 .part3 { width: 100%; height: 575px; overflow: hidden; margin-bottom: 30px; margin-top: 30px; .inner { width: 1200px; overflow: hidden; margin: 0 auto; background-color: #fff; .part3_left { float: left; width: 900px; background-color: #fff; position: relative; .part3_hengxian { width: 900px; height: 2px; background: #DD7D18; margin-top: 10px; em { display: inline-block; width: 100px; height: 6px; background: #DD7D18; position: absolute; top: 10px; left: 46px; } } .part3_left_title { font-family: Microsoft YaHei, Microsoft YaHei; font-weight: bold; font-size: 24px; color: #333333; margin-top: 20px; a { color: #333333; } img { width: 30px; height: 30px; vertical-align: middle; margin-right: 10px; } } .part3_left_content { width: 900px; margin-top: 20px; .part3_left_content1 { float: left; width: 410px; margin-right: 30px; .part3_left_content1_photo1 { font-size: 18px; a img { width: 410px; height: 260px; } .part3_left_content1_text { width: 410px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; color: #333333; margin-top: 15px; } } .part3_left_content1_photo1:hover { .part3_left_content1_text { color: #dd7d18; } } .part3_left_content1_photo2 { width: 410px; margin-top: 30px; display: flex; justify-content: space-between; .part3_left_content1_photo2list { width: 195px; a img { width: 195px; height: 117px; } .part3_left_content1_text { width: 195px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; color: #333333; margin-top: 10px; } } .part3_left_content1_photo2list:hover { .part3_left_content1_text { color: #dd7d18; } } } } .part3_left_content2 { float: right; .part3_left_content2_text { width: 460px; .part3_left_content2_list { margin-bottom: 20px; .nav3_title { font-size: 18px; color: #999; padding-right: 10px; border-right: 1px solid #dd7d18; } .nav3_title:hover { color: #dd7d18; } .nav3_title_content { display: inline-block; width: 366px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: 10px; font-size: 18px; color: #333333; vertical-align: -4px; } .nav3_title_content:hover { color: #dd7d18; } } .part3_left_content2_list:first-child { .nav3_title_content { font-weight: bold; } } } .part3_left_content2_text:last-child { margin-top: 30px; } } } } .part3_right { float: right; width: 270px; height: 430px; .part3_right_title { font-weight: bold; font-size: 22px; color: #333333; a { color: #333333; } } .part3_right_content { .right_photo_text { width: 270px; height: 80px; margin-top: 15px; a img { float: left; width: 120px; height: 80px; margin-right: 10px; } .right_text { float: right; width: 135px; height: 75px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; word-break: break-all; font-size: 18px; color: #333333; } } .right_photo_text:hover { .right_text { color: #dd7d18; } } .rightcontent_text { width: 270px; margin-top: 15px; .rightcontent_textlist { width: 270px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; color: #333333; margin-bottom: 15px; a { color: #333333; } em { display: inline-block; width: 8px; height: 8px; background-color: #ccc; border-radius: 4px; margin-right: 5px; } } .rightcontent_textlist:hover { a { color: #dd7d18; } } } } } } } //第四部分 .part4 { width: 100%; height: 600px; // background-color: #ccc; overflow: hidden; margin-bottom: 30px; margin-top: 30px; .inner { display: flex; justify-content: space-between; width: 1200px; overflow: hidden; background-color: #fff; .part4_one { width: 380px; float: left; .part4_title { width: 380px; position: relative; .part4_hengxian { width: 380px; height: 2px; background: #DD7D18; margin-top: 10px; em { display: inline-block; width: 130px; height: 6px; background: #DD7D18; position: absolute; top: 0px; left: 38px; } } .part4_left_title { font-family: Microsoft YaHei, Microsoft YaHei; font-weight: bold; font-size: 24px; color: #333333; margin-top: 20px; a { color: #333333; } img { width: 30px; height: 30px; vertical-align: middle; margin-right: 10px; } } } .part4_photo_text { position: relative; margin-top: 20px; width: 380px; height: 249px; a img { width: 380px; height: 249px; } .text { position: absolute; bottom: 0; left: 0; width: 380px; height: 54px; line-height: 54px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #fff; font-size: 18px; padding-left: 20px; padding-right: 20px; box-sizing: border-box; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%); } } .part4_photo_content { margin-top: 30px; width: 380px; // height: 150px; .part4_photo_contentlist { // display: flex; width: 380px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; color: #333333; margin-bottom: 20px; a { color: #333333; } .nav11_title { font-size: 18px; color: #999; padding-right: 10px; box-sizing: border-box; border-right: 1px solid #dd7d18 } .nav11_title:hover { color: #dd7d18; } .nav11_title_content { display: inline-block; width: 290px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: 10px; box-sizing: border-box; font-size: 18px; color: #333333; vertical-align: -4px; } .nav11_title_content:hover { color: #dd7d18; } .nav11_title_content2 { display: inline-block; width: 370px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: 10px; box-sizing: border-box; font-size: 18px; color: #333333; vertical-align: -4px; } .nav11_title_content2:hover { color: #dd7d18; } } .part4_photo_contentlist:hover { a { color: #dd7d18; } } .part4_photo_contentlist:first-child { font-weight: bold; .nav11_title_content { font-weight: bold; } .nav11_title { font-weight: 400; } } .part4_photo_contentlist:last-child { margin-bottom: 0px; } } } } }