html,body{margin: 0;} body, button, input, select, textarea{ font: unset !important; color: unset; } .wrap{ position: relative; } .banner > .title1{ position: absolute; left: 29.92rem; top: 18.83rem; font-size: 3rem; font-family: PingFang-SC-Bold; font-weight: bold; display: block; text-align: center; line-height: 0.42rem; color: #fff; } .banner > .title2{ position: absolute; left: 29.92rem; top: 26.08rem; font-size: 4.85rem; font-family: MicrosoftYaHei-Bold; font-weight: bold; display: block; text-align: center; line-height: 0.5rem; color: #fff; } .sw_left{ width: 4.17rem; margin-right: 2.75rem; background: #F6F6F6; display: flex; flex-direction: column; align-items: center; position: fixed; left: 20.83rem; top: 52.83rem; } .sw_left a.nav { width: 100%; height: 4.17rem; text-align: center; position: relative; display: flex; justify-content: center; align-items: center; } .sw_left a.nav p{ display: none; } .sw_left a.nav.active{ color: #3882E5; } .sw_left a.nav.active p { position: absolute; top: 0; font-size: 1.17rem; font-family: Microsoft YaHei; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .sw_left a.nav:hover{ background-color: #3882E5; } .sw_left a.nav:hover p { position: absolute; top: 0; font-size: 1.17rem; font-family: Microsoft YaHei; color: #FFFFFF; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .sw_left a.nav:hover .line, .sw_left a.nav:hover img{ display: none; } .sw_left .title{ font-size: 1.17rem; font-family: Microsoft YaHei; color: #3882E5; height: 4.17rem; text-align: center; position: relative; display: flex; justify-content: center; align-items: center; } .sw_left .line{ width: 2.67rem; height: 0.04rem; background: #B5B4B4; position: absolute; bottom: 0px; } .sw_left .nav_1 img{ width: 2.33rem; height: 1.67rem; } .sw_left .nav_2 img{ width: 2.33rem; height: 2.33rem; } .sw_left .nav_3 img{ width: 2.33rem; height: 2.33rem; } .sw_left .nav_4 img{ width: 2.58rem; height: 2.17rem; } .sw_left .nav_5 img{ width: 2.25rem; height: 2.25rem; } .sw_left .nav_6 img{ width: 2rem; height: 2.33rem; } .sw_left .nav_7 img{ width: 2.33rem; height: 2.33rem; } .sw_left .nav_8 img{ width: 2.33rem; height: 2.33rem; } .sw_left a.nav.active img{ display: none; } .sw_right{ width: 100rem; } .team_box{ width: 100%; padding-top: 5.22rem; padding-bottom: 8.89rem; } .team_head{ display: flex; justify-content: center; align-items: center; margin-bottom: 7.89rem; } .team_head .team_left,.team_head .team_right{ width: 8.17rem; height: 1.67rem; } .team_head span{ color: #333333; font-size: 2.5rem; margin-left: 4rem; margin-right: 3.58rem; } .team_body{ display: flex; justify-content: center; align-items: center; } .team_body_left { width: 59.56rem; margin-right: 5.56rem; } .team_body_right{ width: 37.67rem; display: flex; flex-wrap: wrap; /* justify-content: space-between; */ } .team_people{ width: 12rem; height: 12rem; display: flex; justify-content: center; align-items: center; margin-top: 0.33rem; margin-bottom: 0.33rem; cursor: pointer; } .team_people.active{ background-image: url(/Public/sw/team_people.png); background-size: 12rem 12rem; } .team_people img{ width: 10rem; height: 10rem; } .team_body_left_head .name{ color: #11468B; font-size: 2rem; } .team_body_left_head .position{ color: #333333; font-size: 1.33rem; } .team_body_left_contact{ font-size: 1.33rem; color: #333333; margin-top: 3.22rem; } .team_body_left_contact .tel{ margin-right: 2.78rem; } .team_body_left_line{ width: 225px; height: 1px; background: linear-gradient(0deg, #116BD0 0%, #8BCEF2 100%); margin-top: 2.22rem; } .team_body_left_content{ width: 100%; font-size: 1.22rem; font-family: PingFang; color: #333333; line-height: 23px; margin-top: 3.11rem; } .youshi_box{ width: 100%; background: #F6F9FA; padding-bottom: 6rem; } .youshi_box_head_box{ width: 100%; background-image: url(/Public/sw/youshi_box_head.png); background-size: 100% 21.67rem; background-repeat: no-repeat; } .youshi_box_head{ display: flex; justify-content: center; align-items: center; padding-top: 5.22rem; } .youshi_box_head .team_left,.youshi_box_head .team_right{ width: 8.25rem; height: 1.67rem; } .youshi_box_head span{ color: #fff; font-size: 2.5rem; margin-left: 2.83rem; margin-right: 2.33rem; } .youshi_box_body_box{ width: 102.79rem; display: inline-flex; margin: 3.89rem 27.77rem 4.78rem 27.77rem; } .youshi_box_body_box .youshi{ width: 29.33rem; height: 16.67rem; background-color: #fff; color: #333333; font-size: 1.33rem; display: flex; justify-content: center; align-items: center; flex-direction: column; font-family: PingFang; position: relative; overflow: hidden; } .youshi_box_body_box .youshi img{ width: 3rem; height: 3rem; } .youshi_box_body_box .youshi p{ font-size: 1.33rem; color: #333333; line-height: 3rem; font-family: PingFang-SC-Medium; } .youshi_box_body_box .youshi span{ font-size: 3rem; color: #11468B; line-height: 3rem; font-family: PingFang-SC-Bold; } .youshi_box_body_box .youshi .detail{ display: flex; width: 100%; height: 100%; font-family: PingFang-SC-Bold; position: absolute; left: 100%; top: 0; padding: 0; margin: 0; background-color: #fff; } .youshi_box_body_box .youshi .detail span{ font-size: 0.83rem; color: #fff; padding-left: 2.25rem; padding-right: 2.25rem; line-height: 1.74rem; display: flex; align-items: center; width: 100%; height: 100%; background-color: rgb(0 89 137 / 40%); } .youshi_box_body_box .youshi6 .detail span{ font-size: 0.81rem; line-height: 1.5rem; } .youshi_box_body_box .youshi2,.youshi_box_body_box .youshi5{ margin-left: 7.56rem; margin-right: 7.56rem; } .youshi_box_body_box .youshi2,.youshi_box_body_box .youshi4,.youshi_box_body_box .youshi6{ margin-top: 1.78rem; } .youshi_box_body_box:last-child{ margin-top: 0; margin-bottom: 3.89rem; } .youshi_box_head_box button{ width: 65px; height: 24px; border: 1px solid #11468B; border-radius: 2px; font-size: 12px; font-family: PingFang; color: #11468B; line-height: 24px; margin: 0 auto; display: block; } .tese_box{ width: 100%; padding-top: 5.22rem; padding-bottom: 8.26rem; } .tese_box .team_head{ width: 100%; margin-bottom: 7.44rem; } .tese_box .team_head .team_left,.tese_box .team_head .team_right{ width: 8.17rem; height: 1.67rem; } .tese_box .team_head span{ color: #333; font-size: 2.5rem; margin-left: 3.08rem; margin-right: 2.5rem; } .tese_body_box{ display: flex; flex-wrap: wrap; justify-content: center; } .tese_body{ width: 100rem; display: flex; justify-content: space-between; } .tese_body_box .test_body2{ margin-top: 4.83rem; margin-bottom: 4.83rem; } .tese_body span{ font-size: 1.33rem; font-family: PingFang; color: #333333; line-height: 3rem; padding: 1.59rem 1.33rem 1.58rem 1.42rem; border: 0.08rem solid #E6E6E6; } .tese_body span:hover{ border: 0.16rem solid #155683; } .kehu_box{ width: 100%; background-image: url(/Public/sw/kehu_background.png); background-size: 100% 100%; } .kehu_box_head{ display: flex; justify-content: center; align-items: center; padding-top: 5.22rem; padding-bottom: 3.495rem; } .kehu_box_head .kehu_left,.kehu_box_head .kehu_right{ width: 8.17rem; height: 1.67rem; } .kehu_box_head span{ color: #fff; font-size: 2.5rem; margin-left: 3.08rem; margin-right: 2.5rem; } .kehu_body_box{ display: flex; justify-content: center; flex-wrap: wrap; padding-bottom: 5.376rem; } .kehu_body{ width: 100rem; margin-top: 1.954rem; margin-bottom: 1.954rem; display: flex; } .kehu_body_left{ width: 5.75rem; font-size: 1.67rem; color: #fff; display: flex; justify-content: center; align-items: center; padding-top: 1.08rem; padding-bottom: 1.08rem; padding-left: 1.78rem; padding-right: 1.78rem; } .kehu_body_left > div{ width: 1.56rem; } .kehu_body_left.china{ background-image: url(/Public/sw/kehu_china.png); background-size: 100% 100%; } .kehu_body_left.meiou{ background-image: url(/Public/sw/kehu_meiou.png); background-size: 100% 100%; } .kehu_body_left.rihan{ background-image: url(/Public/sw/kehu_rihan.png); background-size: 100% 100%; } .kehu_body_right{ width: 94.25rem; background-color: rgb(255, 255, 255, 0.1); display: flex; align-items: center; } .kehu_body_right span{ font-size: 1.17rem; font-family: PingFang; color: #FAFAFA; line-height: 3rem; margin-left: 2rem; margin-top: 4.17rem; margin-bottom: 4.17rem; margin-right: 2.83rem; } .biaoshi_box{ width: 100%; height: 56.25rem; background-image: url(/Public/sw/biaoshi_background.png); background-size: 100% 100%; } .biaoshi_box_head{ display: flex; justify-content: center; align-items: center; padding-top: 8rem; padding-bottom: 5.42rem; } .biaoshi_box_head .biaoshi_left,.biaoshi_box_head .biaoshi_right{ width: 8.25rem; height: 1.67rem; } .biaoshi_box_head span{ color: #fff; font-size: 2.5rem; margin-left: 4.08rem; margin-right: 4rem; } .biaoshi_body_box{ width: 100rem; height: 26.08rem; display: flex; justify-content: space-between; margin: 0 auto; } .biaoshi_body{ width: 49.17rem; height: 33.08rem; background: #FFFFFF; } .biaoshi_body_head{ margin-top: 3.33rem; margin-bottom: 3rem; display: flex; justify-content: center; } .biaoshi_body_head img{ width: 2rem; height: 2rem; } .biaoshi_body_head span{ font-size: 1.5rem; font-family: PingFang SC; color: #333333; margin-left: 1.08rem; } .biaoshi_content_box{ display: flex; flex-wrap: wrap; justify-content: center; } .biaoshi_content{ width: 37rem; display: flex; justify-content: center; align-items: center; line-height: 2.5rem; text-decoration: none; } .biaoshi_content .biaoshi_content_radis{ width: 0.67rem; height: 0.67rem; border-radius: 50%; border: 0.08rem #999 solid; background-color: #fff; box-sizing: border-box; } .biaoshi_content:hover .biaoshi_content_radis{ border-color: #1A67F5; background-color: #1A67F5; } .biaoshi_content_title{ margin-left: 1rem; width: 35.33rem; position: relative; display: flex; justify-content: space-between; } .biaoshi_content_title span:first-child{ color: #333333; font-family: PingFang-SC-Medium; font-weight: SC-Medium; font-size: 1.33rem; line-height: 3.5rem; } .biaoshi_content_title span.line{ color: #999999; font-family: PingFang-SC-Medium; font-weight: SC-Medium; font-size: 1.33rem; line-height: 3.5rem; position: absolute; overflow: hidden; white-space: nowrap; } .biaoshi_content_detail{ color: #11468B; font-family: PingFang-SC-Medium; font-weight: SC-Medium; font-size: 1.33rem; line-height: 3.5rem; } .case_box{ width: 100%; background: #F6F9FA; padding-top: 6.56rem; padding-bottom: 9.89rem; } .case_head{ display: flex; justify-content: center; align-items: center; margin-bottom: 5.11rem; } .case_head .case_left,.case_head .case_right{ width: 8.17rem; height: 1.67rem; } .case_head span{ color: #333333; font-size: 2.5rem; margin-left: 3.33rem; margin-right: 2.92rem; } .class_title{ width: 100rem; height: 5.78rem; font-size: 1.33rem; font-family: PingFang; color: #333333; line-height: 3rem; margin-bottom: 4.44rem; margin-left: auto; margin-right: auto; } .case_body{ width: 100rem; /* padding-left: 4.33rem; padding-right: 4.33rem; */ } .case{ width: 23.75rem; background: #FFFFFF; text-decoration: none; } .case_title{ font-size: 2.5rem; font-family: PingFang; font-weight: bold; color: #FFFFFF; line-height: 3rem; display: flex; justify-content: center; align-items: center; } .case_title1{ background-image: url(/Public/sw/case_title1.png); background-size: 100% 100%; } .case_title2{ background-image: url(/Public/sw/case_title2.png); background-size: 100% 100%; } .case_title3{ background-image: url(/Public/sw/case_title3.png); background-size: 100% 100%; } .case_title4{ background-image: url(/Public/sw/case_title4.png); background-size: 100% 100%; } .case_content{ display: flex; flex-direction: column; margin-top: 3rem; align-items: center; } .case_info{ width: 19.83rem; font-size: 1.17rem; font-family: PingFang; color: #333333; line-height: 3rem; height: 20rem; } .case_detail{ width: 7.17rem; height: 2.67rem; border: 0.08rem solid #11468B; border-radius: 0rem; font-size: 1.17rem; font-family: PingFang; color: #11468B; line-height: 4rem; display: flex; justify-content: center; align-items: center; margin-top: 2.6rem; margin-bottom: 2rem; } .case_body .swiper-button-prev:after{ content: ""; } .case_body .swiper-button-prev{ left: 0; background-image: url(/Public/sw/swiper_left.png); background-size: 1.44rem 2.44rem; width: 1.44rem; height: 2.44rem; } .case_body .swiper-button-next:after{ content: ""; } .case_body .swiper-button-next{ right: 0; background-image: url(/Public/sw/swiper_right.png); background-size: 1.44rem 2.44rem; width: 1.44rem; height: 2.44rem; } .q_box{ width: 100%; background: #FFFFFF; padding: unset; } .q_head{ display: flex; justify-content: center; align-items: center; margin-top: 6.56rem; margin-bottom: 3.67rem; } .q_head .q_left,.q_head .q_right{ width: 8.22rem; height: 1.67rem; } .q_head span{ color: #333333; font-size: 2.56rem; margin-left: 3.56rem; margin-right: 3.56rem; } .q_button{ display: flex; justify-content: center; margin-bottom: 3.11rem; } .q_button a{ background: #F6F9FA; width: 5rem; height: 2.67rem; border-radius: 0.17rem; font-size: 1.33rem; font-family: PingFang; color: #005989; line-height: 3rem; padding: 0.67rem 1.25rem 0.67rem 1.17rem; display: flex; justify-content: center; align-items: center; text-decoration: none; } .q_button a.active{ background: #005989; color: #FFFFFF; } .q_body_box{ display: flex; justify-content: center; margin-bottom: 8.67rem; } .q_body{ display: flex; } .q_body_left{ width: 17.5rem; height: 44.75rem; background-size: 100% 100%; display: flex; flex-direction: column; align-items: center; } .q_body:first-child .q_body_left{ background-image: url(/Public/sw/q_background.png); } .q_body:last-child .q_body_left{ background-image: url(/Public/sw/q_background.png); } .q_body_left img{ width: 7.92rem; height: 7.75rem; margin-top: 5.42rem; } .q_body_left .q_title{ font-size: 2rem; font-family: PingFang; color: #FFFFFF; line-height: 2.5rem; margin-top: 5rem; } .q_body_left .line{ width: 8.17rem; height: 0.17rem; background: #FFFFFF; margin-top: 2.72rem; } .q_body_left a{ width: 9rem; height: 2.75rem; border: 0.08rem solid #FFFFFF; border-radius: 0.33rem; text-align: center; margin-top: 15.58rem; margin-bottom: 3.33rem; text-decoration: none; } .q_body_left a span{ font-size: 1.33rem; font-family: PingFang; color: #FFFFFF; line-height: 2.5rem; } .q_body_right{ width: 82.5rem; height: 44.59rem; background: #FFFFFF; border: 0.08rem solid #E6E6E6; } .q_body_detail{ display: block; padding-left: 3.08rem; text-decoration: none; padding-right: 2.42rem; } .q_body_detail .title{ font-size: 1.5rem; font-family: PingFang; color: #333333; white-space: nowrap; display: inline-block; width: 100%; overflow: hidden; text-overflow: ellipsis; margin-top: 1.9rem; } .q_body_detail .info{ font-size: 1.17rem; font-family: PingFang; color: #666666; white-space: nowrap; display: inline-block; width: 100%; overflow: hidden; text-overflow: ellipsis; margin-top: 1.75rem; } .q_body_detail .line{ width: 76rem; height: 0.08rem; background: #E6E6E6; display: block; margin-top: 2.56rem; } .video_box{ width: 100%; background: #F6F9FA; padding-top: 6.56rem; } .video_head{ display: flex; justify-content: center; align-items: center; margin-bottom: 3.67rem; } .video_head .video_left,.video_head .video_right{ width: 8.22rem; height: 1.67rem; } .video_head span{ color: #333333; font-size: 2.56rem; margin-left: 3.56rem; margin-right: 3.56rem; } .video_button{ display: flex; justify-content: center; margin-bottom: 5.11rem; } .video_button a{ background: #F6F9FA; width: 6.25rem; height: 2.67rem; font-size: 1.33rem; border-radius: 0.17rem; font-family: PingFang; color: #005989; line-height: 3rem; padding: 0.67rem 1.5rem 0.67rem 1.58rem; display: flex; justify-content: center; align-items: center; text-decoration: none; } .video_button a.active{ background: #005989; color: #FFFFFF; } .video_body_box{ /* display: flex; justify-content: center; */ padding-bottom: 8.67rem; } .video_body{ /* display: flex; */ width: 100rem; /* flex-wrap: wrap; */ } .video_body .swiper-slide{ display: flex; flex-wrap: wrap; } .video{ margin-bottom: 3.33rem; cursor: pointer; width: 32.17rem; } .video_body .swiper-slide .video.video_margin{ margin-left: 1.74rem; margin-right: 1.75rem; } .video .play{ /* width: 32.17rem; */ height: 20.48rem; background-image: url(/Public/sw/video_background.png); background-size: 100% 100%; display: flex; justify-content: center; align-items: center; } .video .play img{ width: 3.33rem; height: 3.33rem; } .video .title { margin-top: 1.74rem; display: flex; align-items: center; justify-content: space-between; } .video .title span:first-child{ font-size: 1.5rem; font-family: PingFang SC; color: #333333; white-space: nowrap; overflow: hidden; margin-right: 0.5rem; } .video .title span:last-child{ border: 0.08rem solid #FF6655; border-radius: 0.33rem; font-size: 1.17rem; font-family: PingFang SC; color: #FF6655; width: 6.33rem; height: 2.41rem; display: flex; justify-content: center; align-items: center; } .video .info{ display: flex; margin-top: 1.5rem; } .video .info span:first-child{ font-size: 1.33rem; font-family: PingFang SC; color: #333333; } .video .info span:last-child{ font-size: 1.33rem; font-family: PingFang SC; color: #666666; margin-left: 1.42rem; } .video_body .swiper-button-prev:after{ content: ""; } .video_body .swiper-button-prev{ left: 0; background-image: url(/Public/sw/swiper_left.png); background-size: 1.44rem 2.44rem; width: 1.44rem; height: 2.44rem; } .video_body .swiper-button-next:after{ content: ""; } .video_body .swiper-button-next{ right: 0; background-image: url(/Public/sw/swiper_right.png); background-size: 1.44rem 2.44rem; width: 1.44rem; height: 2.44rem; } .service_box{ width: 100%; background: #F6F9FA; padding-top: 6.56rem; padding-bottom: 4.58rem; } .service_head{ display: flex; justify-content: center; align-items: center; margin-bottom: 8.58rem; } .service_head .service_left,.service_head .service_right{ width: 8.17rem; height: 1.67rem; } .service_head span{ color: #333333; font-size: 2.5rem; margin-left: 3.58rem; margin-right: 4.17rem; } .service_swiper{ width: 100rem; margin: 0 auto; display: flex; flex-wrap: wrap; } .service{ display: flex; flex-direction: column; align-items: center; margin-bottom: 3.5rem; width: 12.5%; /* height: 4rem; */ } .service .img{ width: 7rem; height: 4rem; } .service img{ width: 100%; } .service span{ margin-top: 1.08rem; font-size: 1.33rem; font-family: PingFang; color: #333333; line-height: 1.25rem; }