.linehide { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: break-all; } .clearfix:after { content: ""; clear: both; height: 0; overflow: hidden; visibility: hidden; display: block; } .clearfix { zoom: 1; } img, a { display: block; } .title { padding-top: 62px; } .title img { width: 399px; margin: 0 auto; } .title2 { padding-top: 60px; } .title2 img { margin: 0 auto; width: 166px; } /* 20230424新增 */ .contentbox { margin-top: 20px; margin-bottom: 38px; } .contentbox .layout { padding: 42px 60px 62px; background-color: #f6f8fc; border-radius: 10px; box-shadow: 0 18px 30px 0 #e9edf9; border: 2px solid #fff; } .contentbox .layout .t { font-size: 32px; font-family: pingfang sc-heavy, pingfang sc; font-weight: 800; color: #3a72f6; text-align: center; margin-bottom: 22px; } .contentbox .layout .c { font-size: 16px; font-family: pingfang sc-medium, pingfang sc; font-weight: 500; color: #666666; line-height: 26px; } .contentbox .layout .c a { display: inline-block; font-size: 16px; font-family: pingfang sc-medium, pingfang sc; font-weight: 500; color: #666666; line-height: 26px; } /* 20230424新增end */ .part1 { background: no-repeat; background-size: 100% 100%; padding-bottom: 76px; height: 732px; } .part1 .layout { width: 1500px; } .part1 .title { margin-bottom: 96px; } .part1 ul { margin: 0 auto; } .part1 ul li { position: relative; float: left; cursor: pointer; } .part1 ul li .writer { position: absolute; writing-mode: vertical-lr; font-size: 16px; font-family: sourcehansanscn-bold, sourcehansanscn; font-weight: bold; color: #2693fe; top: 45px; left: 66px; letter-spacing: 0.2em; } .part1 ul li .writer span { margin-top: 5px; font-size: 16px; font-family: sourcehansanscn-normal, sourcehansanscn; font-weight: 400; color: #2693fe; } .part1 ul li .mark { padding: 68px 15px 0px 20px; height: 100%; position: absolute; top: 0; right: 0; transition: all .3s; opacity: 0; } .part1 ul li .mark .name { font-size: 18px; font-family: sourcehansanscn-medium, sourcehansanscn; font-weight: 500; color: #ffffff; } .part1 ul li .mark .xian { margin-top: 9px; margin-bottom: 3px; width: 110px; height: 1px; background-color: #fff; } .part1 ul li .mark .c { width: 112px; font-size: 16px; font-family: sourcehansanscn-regular, sourcehansanscn; font-weight: 400; color: #ffffff; line-height: 21px; } .part1 ul li:nth-child(1) .mark, .part1 ul li:nth-child(2) .mark, .part1 ul li:nth-child(3) .mark { background: no-repeat; } .part1 ul li:nth-child(4) { z-index: 1; } .part1 ul li:nth-child(4) .mark { top: 10px; right: auto; left: 22px; background: no-repeat; width: 100%; } .part1 ul li:nth-child(4) .mark .xian { width: calc(81%); } .part1 ul li:nth-child(4) .mark .c { width: calc(81%); } .part1 ul li:nth-child(4) .writer { left: 44px; font-size: 18px; color: #ffb44a; } .part1 ul li:nth-child(4) .writer span { color: #ffb44a; } .part1 ul li:nth-child(5) .mark, .part1 ul li:nth-child(6) .mark, .part1 ul li:nth-child(7) .mark { right: auto; left: 0; background: no-repeat; } .part1 ul li:nth-child(5) .writer, .part1 ul li:nth-child(6) .writer, .part1 ul li:nth-child(7) .writer { left: auto; right: 66px; } .part1 ul li:nth-child(1) { transform: translatex(136px); } .part1 ul li:nth-child(2) { transform: translatex(79px); } .part1 ul li:nth-child(3) { transform: translatex(23px); } .part1 ul li:nth-child(5) { transform: translatex(-23px); } .part1 ul li:nth-child(6) { transform: translatex(-79px); } .part1 ul li:nth-child(7) { transform: translatex(-136px); } .part1 ul li:hover { margin-top: -5px; } .part1 ul li:hover .mark { opacity: 1; } .part2 { width: 100%; height: 740px; background: no-repeat; background-size: 100% 740px; } .part2 .c { width: 1076px; height: 390px; margin: 62px auto 0; } .part3 .layout .content { background-color: #f3f9ff; } .part3 .layout .content1 { margin-top: 64px; margin-bottom: 40px; padding: 0px 62px 66px; } .part3 .layout .content1 .title2 { margin-bottom: 46px; } .part3 .layout .content1 ul { overflow: hidden; height: 265px; transition: all .3s; } .part3 .layout .content1 ul li { float: left; width: 510px; height: 265px; border-radius: 20px 20px 20px 20px; margin-right: 56px; margin-bottom: 20px; } .part3 .layout .content1 ul li:nth-child(2n) { margin-right: 0; } .part3 .layout .content1 ul li a { width: 100%; height: 100%; position: relative; } .part3 .layout .content1 ul li a img { position: absolute; top: 0px; left: 0; z-index: 0; height: 266px; width: 510px; } .part3 .layout .content1 ul li a .bottom { position: absolute; bottom: 0; left: 0; width: 100%; height: 220px; padding-left: 30px; } .part3 .layout .content1 ul li a .bottom .ing { background: #64bd06; } .part3 .layout .content1 ul li a .bottom .over { background: #939393; } .part3 .layout .content1 ul li a .bottom .foretell { background: #feb100; } .part3 .layout .content1 ul li a .bottom .style { margin-top: 36px; margin-bottom: 10px; display: flex; justify-content: center; align-items: center; width: 65px; height: 20px; border-radius: 9px; font-size: 12px; font-family: pingfangsc-medium, pingfang sc; font-weight: 500; color: #ffffff; } .part3 .layout .content1 ul li a .bottom .style i { display: block; border-radius: 50%; width: 4px; height: 4px; background: #ffffff; margin-right: 7px; } .part3 .layout .content1 ul li a .bottom .t { margin-bottom: 10px; width: 260px; height: 48px; font-size: 18px; font-family: pingfangsc-medium, pingfang sc; font-weight: 500; color: #0053a5; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; word-break: break-all; } .part3 .layout .content1 ul li a .bottom .time { font-size: 16px; font-family: pingfangsc-regular, pingfang sc; font-weight: 400; color: #0053a5; } .part3 .layout .content1 ul li a .bottom .z { margin-top: 31px; display: flex; font-size: 16px; font-family: sourcehansanscn-normal, sourcehansanscn; font-weight: 400; color: #ffffff; } .part3 .layout .content1 ul li a .bottom .z span { width: 240px; display: inline-block; font-size: 16px; font-family: sourcehansanscn-normal, sourcehansanscn; font-weight: 400; color: #ffffff; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; word-break: break-all; } .part3 .layout .content1 ul li a .bottom .name { position: absolute; bottom: 30px; left: 80%; transform: translatex(-50%); font-size: 20px; font-family: sourcehansanscn-bold, sourcehansanscn; font-weight: bold; color: #0a58a1; } .part3 .layout .content1 ul li:nth-child(3) a .bottom .name { transform: translatex(-73%); } .part3 .layout .content1 .all { cursor: pointer; width: auto; margin: 62px auto 0; font-size: 21px; font-family: sourcehansanscn-medium, sourcehansanscn; font-weight: 500; color: #0064ff; text-align: center; } .part3 .layout .content1 .all span { font-size: 21px; color: #0064ff; margin-left: 5px; } .part3 .layout .content2 { margin-bottom: 62px; padding: 0 32px 76px; } .part3 .layout .content2 .title2 { margin-bottom: 39px; } .part3 .layout .content2 .swiper .swiper-button-next:after, .part3 .layout .content2 .swiper .swiper-button-prev:after { content: ""; } .part3 .layout .content2 .swiper .swiper-button-next { right: 1px; } .part3 .layout .content2 .swiper .swiper-button-prev { left: 1px; } .part3 .layout .content2 .swiper .swiper-button-next img, .part3 .layout .content2 .swiper .swiper-button-prev img { width: 31px; } .part3 .layout .content2 .swiper ul { margin-left: 42px; } .part3 .layout .content2 .swiper ul li { float: left; margin-right: 17px; margin-bottom: 39px; } .part3 .layout .content2 .swiper ul li:nth-child(2n) { margin-right: 0; } .part3 .layout .content2 .swiper ul li:nth-child(3), .part3 .layout .content2 .swiper ul li:nth-child(4) { margin-bottom: 0; } .part3 .layout .content2 .swiper ul li a { display: flex; } .part3 .layout .content2 .swiper ul li a img { width: 284px; height: 162px; } .part3 .layout .content2 .swiper ul li a .left { background: #ffffff; border-radius: 0px 20px 20px 0px; padding: 23px 16px 18px 19px; } .part3 .layout .content2 .swiper ul li a .left .t { margin-bottom: 27px; width: 198px; height: 52px; font-size: 18px; font-family: pingfangsc-regular, pingfang sc; font-weight: 400; color: #777777; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; word-break: break-all; } .part3 .layout .content2 .swiper ul li a .left .xian { width: 36px; height: 3px; background: #0064ff; margin-bottom: 6px; } .part3 .layout .content2 .swiper ul li a .left .writer { font-size: 16px; font-family: pingfangsc-regular, pingfang sc; font-weight: 400; color: #999999; } .part3 .layout .content3 { padding: 0 83px 41px; } .part3 .layout .content3 .title2 { margin-bottom: 49px; } .part3 .layout .content3 .box li { float: left; margin-right: 41px; } .part3 .layout .content3 .box li:nth-child(1) .top { background: no-repeat; background-size: contain; } .part3 .layout .content3 .box li:nth-child(2) .top { background: no-repeat; background-size: contain; } .part3 .layout .content3 .box li:nth-child(3) { margin-right: 0; } .part3 .layout .content3 .box li:nth-child(3) .top { background: no-repeat; background-size: contain; } .part3 .layout .content3 .box li .top { width: 317px; height: 144px; font-size: 28px; font-family: pingfangsc-semibold, pingfang sc; font-weight: 600; color: #ffffff; display: flex; justify-content: center; align-items: center; } .part3 .layout .content3 .box li .c { transform: translatey(-32px); width: 283px; background-color: #fff; padding: 42px 23px 32px; margin: 0 auto; } .part3 .layout .content3 .box li ul { height: 174px; } .part3 .layout .content3 .box li ul li { margin-bottom: 10px; } .part3 .layout .content3 .box li ul li:hover a { color: #0064ff; } .part3 .layout .content3 .box li ul li:hover a i { background-color: #0064ff; } .part3 .layout .content3 .box li ul li a { width: 236px; font-size: 18px; font-family: pingfangsc-regular, pingfang sc; font-weight: 400; color: #454545; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: break-all; } .part3 .layout .content3 .box li ul li a i { display: block; float: left; width: 4px; height: 4px; border-radius: 50%; margin-top: 10px; margin-right: 10px; background-color: #454545; } .part3 .layout .content3 .box li .more { margin-top: 42px; font-size: 14px; font-family: pingfangsc-regular, pingfang sc; font-weight: 400; color: #454545; text-align: center; } .part3 .layout .content3 .box li .more:hover { color: #0064ff; } .part3 .layout .content3 .box li .more:hover span { color: #0064ff; } .part3 .layout .content3 .box li .more span { margin-left: 5px; font-size: 14px; color: #454545; } .part4 { margin-top: 67px; background-color: #f3f9ff; padding-bottom: 124px; } .part4 .layout .title { margin-bottom: 17px; } .part4 .layout .box { margin: 0 auto; width: 1077px; padding: 40px; background: #2379ff; } .part4 .layout .box .bg { width: 1003px; box-shadow: 0px 2px 10px 0px rgba(47, 25, 25, 0.04); border-radius: 6px; background: no-repeat; background-position: bottom 0 right 30px; background-color: #ffffff; } .part4 .layout .box .bg .wtdetail_moduler { border-radius: 6px; width: 662px; box-sizing: border-box; padding: 46px 0px 0px 63px; background: #ffffff; } .part4 .layout .box .bg .wtdetail_moduler .item_ask .item_dl { padding-top: 12px; padding-bottom: 20px; border-bottom: 1px solid #c7c7c7; } .part4 .layout .box .bg .wtdetail_moduler .item_ask .item_dl .item_title { font-size: 16px; font-family: sourcehansanscn-normal, sourcehansanscn; font-weight: 400; color: #656565; line-height: 20px; word-break: break-all; } .part4 .layout .box .bg .wtdetail_moduler .item_ask .item_dl .item_tips_list { margin-top: 18px; font-size: 12px; font-weight: 400; color: #898989; line-height: 18px; } .part4 .layout .box .bg .wtdetail_moduler .item_ask .item_dl .item_tips_list span { font-size: 12px; font-weight: 400; color: #898989; line-height: 18px; margin-right: 10px; word-break: break-all; } .part4 .layout .box .bg .wtdetail_moduler .ask_head { height: 30px; } .part4 .layout .box .bg .wtdetail_moduler .ask_head .head_icon { height: 30px; float: left; margin-right: 8px; padding-top: 2px; box-sizing: border-box; } .part4 .layout .box .bg .wtdetail_moduler .ask_head .head_title { float: left; font-size: 18px; font-family: sourcehansanscn-medium, sourcehansanscn; font-weight: 500; color: #656565; line-height: 30px; } .part4 .layout .box .bg .wtdetail_moduler .item_answer { margin-top: 20px; } .part4 .layout .box .bg .wtdetail_moduler .item_answer .item_dl { padding: 16px 0 20px 0; } .part4 .layout .box .bg .wtdetail_moduler .item_answer .item_dl .item_title { font-size: 16px; font-family: sourcehansanscn-normal, sourcehansanscn; font-weight: 400; color: #656565; line-height: 20px; word-break: break-all; } .part4 .layout .box .bg .wtdetail_moduler .item_answer .item_dl .item_time { margin-top: 24px; font-size: 12px; font-weight: 400; color: #898989; line-height: 18px; word-break: break-all; } .part4 .layout .box .bg .wtdetail_moduler .answer_head { height: 30px; } .part4 .layout .box .bg .wtdetail_moduler .answer_head .head_icon { height: 30px; float: left; margin-right: 8px; padding-top: 2px; box-sizing: border-box; color: #fff; } .part4 .layout .box .bg .wtdetail_moduler .answer_head .head_title { float: left; font-size: 18px; font-family: sourcehansanscn-medium, sourcehansanscn; font-weight: 500; color: #656565; line-height: 30px; word-break: break-all; } .part4 .layout .box .bg .more { padding-bottom: 20px; font-size: 14px; font-family: pingfangsc-regular, pingfang sc; font-weight: 400; color: #0064ff; text-align: center; } .part4 .layout .box .bg .more span { margin-left: 5px; font-size: 14px; color: #0064ff; } .part5 .layout .title { margin-bottom: 68px; } .part5 .layout ul { width: 1165px; margin: 0 auto; } .part5 .layout ul li { float: left; display: flex; } .part5 .layout ul li a .t { width: 279px; font-size: 18px; font-family: pingfangsc-regular, pingfang sc; font-weight: 400; color: #555555; line-height: 25px; } .part5 .layout ul li a .c { height: 66px; margin-top: 16px; width: 279px; font-size: 16px; font-family: pingfangsc-regular, pingfang sc; font-weight: 400; color: #777777; line-height: 22px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; word-break: break-all; } /* .part5 .layout ul li:nth-child(1):after, .part5 .layout ul li:nth-child(2):after { content: ""; float: left; display: inline-block; margin: 0 81px; width: 2px; height: 149px; background-color: #e8e8e8; } */ .part5 .layout ul li .xian { /* float: left; */ display: inline-block; margin: 0 81px; width: 2px; height: 149px; background-color: #e8e8e8; } .part5 .layout ul li:nth-child(3) .xian { display: none; } .part5 .layout ul li:hover .t { color: #0064ff; } .part5 .layout .more { padding-bottom: 20px; margin-right: 20px; font-size: 14px; font-family: pingfangsc-regular, pingfang sc; font-weight: 400; color: #0064ff; text-align: right; } .part5 .layout .more span { margin-left: 5px; font-size: 14px; color: #0064ff; }