.banner .swiper { width: 100%; height: 100vh; overflow: hidden; } .banner .swiper .swiper-slide { height: 100%; position: relative; } .banner .swiper .swiper_image { width: 100%; height: 100%; } .banner .swiper .swiper_image > img { width: 100%; height: 100%; object-fit: cover; } .banner .swiper .swiper_info { position: absolute; top: 50%; left: 50%; transform: translatex(-50%); color: #fff; } .banner .swiper .swiper-pagination-bullet { width: 46px; height: 6px; opacity: 0.3; background: #ffffff; border-radius: 0; } .banner .swiper .swiper-pagination-bullet-active { opacity: 1; } .news { padding: 96px 0; } .news .news_top { display: flex; flex-wrap: wrap; justify-content: space-between; } .news .news_top > p { text-align: center; color: #333333; } .news .news_box { margin-top: 38px; width: 100%; display: flex; } .news .news_box > div { width: calc((100% - 60px)/2); overflow: hidden; } .news .news_box > div > div:nth-child(2) { margin-top: 25px; } .news .news_box > div:not(:last-child) { margin-right: 30px; } .news .news_box > div .news_list .news_image { width: 100%; height: 210px; overflow: hidden; } .news .news_box > div .news_list .news_image img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s linear; -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; -o-transition: all 0.4s linear; -ms-transition: all 0.4s linear; } .news .news_box > div .news_list .news_image:hover img { transform: scale(1.05); } .news .news_box > div .news_listmain { padding: 30px 30px 20px 30px; border: 1px solid #cecece; } .news .news_box > div .news_listmain .news_tit { font-weight: 400; text-align: left; color: #222222; line-height: 1.55; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .news .news_box > div .news_listmain .news_tit:hover a { color: #004a96; } .news .news_box > div .news_listmain .news_list_f { margin-top: 34px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; } .news .news_box > div .news_listmain .news_list_f > p { font-weight: 400; text-align: left; color: #737373; } .news .news_box > div .news_listmain .news_list_f > a { transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear; -ms-transition: all 0.2s linear; } .news .news_box > div .news_listmain .news_list_f:hover > a { transform: translatex(4px); } .news .news_box > div .news_banner { width: 100%; height: 387px; position: relative; overflow: hidden; } .news .news_box > div .news_banner .news_bannerimage { display: block; width: 100%; height: 100%; overflow: hidden; } .news .news_box > div .news_banner .news_bannerimage img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s linear; -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; -o-transition: all 0.4s linear; -ms-transition: all 0.4s linear; } .news .news_box > div .news_banner:hover img { transform: scale(1.05); } .news .news_box > div .news_banner .swiper-pagination { width: auto; bottom: 26px; right: 30px; left: auto; } .news .news_box > div .news_banner .swiper-pagination .swiper-pagination-bullet { width: 8px; height: 8px; background: rgba(255, 255, 255, 0); border: 1px solid #fff; border-radius: 0; transform: none; } .news .news_box > div .news_banner .swiper-pagination .swiper-pagination-bullet-active { transform: none; background-color: #fff; } .news .news_box > div .news_banner .news_listmain { position: absolute; bottom: 0; left: 0; border: none; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0)); padding-bottom: 30px; } .news .news_box > div .news_banner .news_listmain p, .news .news_box > div .news_banner .news_listmain a { color: #fff; } .strength { background-image: url(/uploads/image/scimg/strength_bg.jpg); background-repeat: no-repeat; background-size: cover; } .strength .strength_box { display: flex; } .strength .strength_box .strength_l { flex: 1; padding: 114px 80px 0 0; color: #ffffff; } .strength .strength_box .strength_l .strength_subtit { margin-top: 110px; } .strength .strength_box .strength_l .strength_con { font-weight: 400; margin-top: 14px; } .strength .strength_box .strength_l ul { display: flex; align-items: center; margin-top: 60px; } .strength .strength_box .strength_l ul hr { width: 1px; height: 87px; opacity: 0.4; background-color: #ffffff; margin: 0 50px; } .strength .strength_box .strength_l ul .numcount_list { display: flex; align-items: flex-end; } .strength .strength_box .strength_l ul .numcount_list .fnt_60 { line-height: 1; } .strength .strength_box .strength_l ul .numcount_listtit { margin-top: 12px; } .strength .strength_box .strength_l .topage { margin-top: 50px; } .strength .strength_box .strength_l .topage a { color: #fff; } .strength .strength_box .strength_r { flex: 0 0 640px; display: flex; flex-wrap: wrap; } .strength .strength_box .strength_r .strength_r_list { flex: 0 0 50%; background: rgba(0, 51, 115, 0); border: 1px solid #eeeeee; padding: 80px 54px 44px 54px; color: #fff; } .strength .strength_box .strength_r .strength_r_list > img { height: 62px; } .strength .strength_box .strength_r .strength_r_list > p { margin: 22px 0 48px 0; } .strength .strength_box .strength_r .strength_r_list a { color: #fff; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear; -ms-transition: all 0.2s linear; } .strength .strength_box .strength_r .strength_r_list a:hover { margin-left: 4px; } .strength .strength_box .strength_r .strength_r_list .fnt_30 { margin: 0; } .strength .strength_box .strength_r .strength_r_list:nth-child(2n-1) { border-right: none; } .strength .strength_box .strength_r .strength_r_list:not(:nth-last-child(-n 2)) { border-bottom: none; } .strength .strength_box .strength_r .strength_r_list:nth-last-child(2) { display: flex; /*align-items: center;*/ justify-content: center; flex-direction: column; border: none; padding: 0; border-top: 1px solid #eeeeee; } .strength .strength_box .strength_r .strength_r_list a{ margin-top:20px; } .project { width: 100%; position: relative; } .project .swiper-button-prev, .project .swiper-button-next { bottom: 78px; top: auto; } .project .swiper-button-prev { left: 110px; } .project .swiper-button-prev::after, .project .swiper-button-next::after { color: #fff; font-size: 32px; } .project .swiper-button-next { right: 110px; } .project .project_swiper { width: 100%; overflow: hidden; } .project .project_swiper img { width: 100%; } .project .project_swiper .project_swiper_main { overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translatey(-50%) translatex(-50%); color: #fff; } .project .project_swiper .project_swiper_main .project_nav_tit { color: #ffffff; display: inline-block; padding: 10px 20px; background: #005cbb; margin-bottom: 36px; } .project .project_swiper .project_swiper_main .swiper-pagination { margin-top: 10px; position: static; width: auto; text-align: left; } .project .project_swiper .project_swiper_main .swiper-pagination .swiper-pagination-bullet { width: 8px; height: 8px; background-color: transparent; border: 1px solid #fff; border-radius: 0; opacity: 1; } .project .project_swiper .project_swiper_main .swiper-pagination .swiper-pagination-bullet-active { background-color: #fff; } .project .project_swiper .project_swiper_main .project_to { display: inline-block; max-width: 50%; color: #fff; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .project .project_swiper .project_swiper_main .topage { color: #fff; margin-top: 54px; } .project .project_swiper .project_swiper_main .topage a { color: #fff; border-color: #fff; } .project .project_swiper .project_swiper_main .topage path { fill: #fff; } .project .project_swiper2 { position: absolute; bottom: 76px; left: 50%; transform: translatex(-50%); color: #fff; overflow: hidden; } .project .project_swiper2 .swiper-slide { opacity: 0.7; cursor: pointer; } .project .project_swiper2 .swiper-slide > div { width: 100%; height: 3px; opacity: 0.35; background: #f0efef; margin-bottom: 24px; } .project .project_swiper2 .swiper-slide-active > div { opacity: 1; } .project .project_swiper2 .swiper-slide-active { opacity: 1; } .achievement { padding: 66px 0 50px 0; background-image: url(/uploads/image/scimg/achievement_bg.jpg); background-repeat: no-repeat; background-size: cover; } .achievement .achievement_head { display: flex; justify-content: space-between; } .achievement .achievement_head .achievement_head_r { display: flex; align-items: center; } .achievement .achievement_head .achievement_head_r .swiper-button-prev:after, .achievement .achievement_head .achievement_head_r .swiper-button-next:after { font-size: 14px; color: #b8b8b6; } .achievement .achievement_head .achievement_head_r > div { position: static; width: 65px; height: 36px; border: 1px solid #b8b8b6; opacity: 1; margin-left: 16px; margin-top: 0; } .achievement .achievement_head .achievement_head_r > div:hover { background-color: #065fb9; } .achievement .achievement_head .achievement_head_r > div:hover:after { color: #fff; } .achievement .achievement_swiper { width: 100%; overflow: hidden; margin-top: 36px; } .achievement .achievement_swiper .swiper-slide { padding: 30px 40px 40px 40px; border: 1px solid #cecece; } .achievement .achievement_swiper .swiper-slide .achievement_list_tit { background-image: -webkit-linear-gradient(45deg, #b78439 0%, #eee09c 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-align: center; color: #506588; line-height: 1.2; height: 2.4em; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; vertical-align: middle; max-width: 280px; margin: auto; } .achievement .achievement_swiper .swiper-slide .achievement_list_subtit { width: 100%; text-align: center; line-height: 1.5; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; vertical-align: middle; margin-top: 20px; } .introduce { background-image: url(/uploads/image/scimg/introduce_bg.jpg); background-repeat: no-repeat; background-size: cover; padding: 114px 0 107px 0; } .introduce .introduce_box { text-align: center; } .introduce .introduce_box .introduce_tit { text-align: center; } .introduce .introduce_box .introduce_subtit { /*text-align: center;*/ text-align: left; line-height: 2; color: #666; margin: 24px 0 44px 0; } .introduce .introduce_box .topage { margin: auto; } .introduce .introduce_box .introduce_con { margin-top: 38px; display: flex; flex-wrap: wrap; } .introduce .introduce_box .introduce_con .introduce_list { flex: 0 0 25%; padding: 47px 0 50px 0; color: #333; border: 1px solid rgba(191, 191, 191, 0.5); } .introduce .introduce_box .introduce_con .introduce_list:hover { color: #fff; background-color: #0063b4; } .introduce .introduce_box .introduce_con .introduce_list:hover .introduce_list_image img { filter: brightness(0) invert(1); } .introduce .introduce_box .introduce_con .introduce_list:hover .introduce_list_num { color: #fff; } .introduce .introduce_box .introduce_con .introduce_list .introduce_list_image { text-align: center; } .introduce .introduce_box .introduce_con .introduce_list .introduce_list_image img { height: 69px; } .introduce .introduce_box .introduce_con .introduce_list .introduce_list_tit { padding: 0 10%; text-align: center; line-height: 1.5; height: 3em; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin: 24px 0 40px 0; } .introduce .introduce_box .introduce_con .introduce_list .introduce_list_num { color: #004a96; display: flex; justify-content: center; } .introduce .introduce_box .introduce_con .introduce_list .introduce_list_num p { font-weight: 500; } @media only screen and (max-width: 1800px) { .project .swiper-button-prev { left: 2%; } .project .swiper-button-next { right: 2%; } } @media only screen and (max-width: 1600px) { .news { padding: 5vw 0; } .strength .strength_box .strength_r { flex: 0 0 50%; } .introduce .introduce_box .introduce_con .introduce_list .introduce_list_tit { margin-bottom: 2.0833vw; } .strength .strength_box .strength_l ul hr { margin: 0 2.6042vw; } .strength .strength_box .strength_l { padding: 5.9375vw 4.1667vw 0 0; } .strength .strength_box .strength_l .strength_subtit { margin-top: 5.2083vw; } .strength .strength_box .strength_l ul { margin-top: 3.125vw; } .strength .strength_box .strength_l .topage { margin-top: 2.6042vw; } .strength .strength_box .strength_r .strength_r_list { padding: 4.1667vw 2.8125vw 5.9896vw 2.8125vw; } .achievement { padding: 3.4375vw 0 2.6042vw 0; } .project .project_swiper .project_swiper_main .topage { margin-top: 2.8125vw; } .introduce { padding: 5.9375vw 0 5.5729vw 0; } .introduce .introduce_box .introduce_subtit { margin-bottom: 2.2917vw; } .strength .strength_box .strength_r .strength_r_list > p { margin: 1.1458vw 0 2.5vw 0; } } @media only screen and (max-width: 1500px) { .news .news_box > div .news_banner { height: 360px; } .news .news_box > div .news_listmain .news_list_f { margin-top: 20px; } } @media only screen and (max-width: 1440px) { .news .news_box { margin-top: 1.9792vw; } .achievement .achievement_swiper .swiper-slide { padding: 1.5625vw 2.0833vw 2.0833vw 2.0833vw; } .introduce .introduce_box .introduce_con .introduce_list { padding: 2.4479vw 0 2.6042vw 0; } .introduce .introduce_box .introduce_subtit { margin-top: 1.25vw; } .project .project_swiper .project_swiper_main .project_nav_tit { margin-bottom: 1.875vw; } .achievement .achievement_swiper .swiper-slide .achievement_list_subtit { margin-top: 1vw; } .news .news_box > div .news_listmain { padding: 20px; } } @media only screen and (max-width: 1366px) { .achievement .achievement_swiper .swiper-slide { padding: 1.5625vw 2.0833vw 2.0833vw 2.0833vw; } .achievement .achievement_swiper { margin-top: 1.875vw; } .introduce .introduce_box .introduce_subtit { margin: 1.1458vw 0 2.2917vw 0; } .introduce .introduce_box .introduce_con .introduce_list { padding: 2.4479vw 0 2.6042vw 0; } .news .news_box > div .news_banner { height: 350px; } } @media only screen and (max-width: 1200px) { .strength .strength_box .strength_l ul hr { margin: 0 20px; } .banner .swiper .swiper-pagination-bullet { width: 30px; height: 4px; } .project .project_swiper2 { width: 80%; } .project .swiper-button-prev { left: 5%; } .project .swiper-button-next { right: 5%; } .news .news_box > div .news_list .news_image { height: 190px; } .news .news_box > div .news_banner { height: 330px; } .strength .strength_box .strength_r .strength_r_list > img { height: 40px; } .project .project_swiper2 .swiper-slide > div { margin-bottom: 1.25vw; } .introduce .introduce_box .introduce_con .introduce_list .introduce_list_image img { height: 40px; } } @media only screen and (max-width: 768px) { .banner .swiper { height: 300px; } .news .news_box { display: flex; flex-wrap: wrap; } .news .news_box > div { width: 100%; margin-top: 20px; } .strength .strength_box .strength_r .strength_r_list > p { margin: 10px 0 20px 0; } .news .news_box > div:not(:last-child) { margin-right: 0; } .news .news_box > div > div:nth-child(2) { margin-top: 16px; } .news .news_box > div .news_listmain { padding: 20px; } .strength .strength_box { flex-wrap: wrap; } .strength .strength_box .strength_l ul { flex-wrap: wrap; } .strength .strength_box .strength_l ul li { flex: 0 0 50%; margin: 10px 0; } .strength .strength_box .strength_l ul hr { display: none; } .strength .strength_box .strength_l { flex: 0 0 100%; } .strength .strength_box .strength_r { flex: 0 0 100%; margin-top: 32px; } .achievement .achievement_head .achievement_head_r > div { width: 40px; height: 24px; } .achievement .achievement_swiper { margin-top: 20px; } .achievement .achievement_swiper .swiper-slide { padding: 20px; } .achievement { padding: 40px 0; } .strength .strength_box .strength_l { padding: 40px 0 0 0; } .news { padding: 40px 0; } .project .project_swiper img { height: 400px; width: 100%; object-fit: cover; } .project .project_swiper2 { bottom: 20px; } .project .swiper-button-prev, .project .swiper-button-next { bottom: 16px; } .project .swiper-button-prev::after, .project .swiper-button-next::after { font-size: 20px; } .project .project_swiper2 { width: 70%; } .introduce { padding: 40px 0; } .introduce .introduce_box .introduce_subtit { margin: 20px 0; } .introduce .introduce_box .introduce_con .introduce_list { padding: 20px 10px; } .introduce .introduce_box .introduce_con .introduce_list { flex: 0 0 50%; } }