/*初始化*/ @charset "utf-8"; html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; } fieldset, img { border:none; } /*为了照顾ie6 链接图片有边框*/ img{display: block;} ul, ol { list-style:none; } input { padding-top:0; padding-bottom:0; font-family: "SimSun","宋体";} select, input { vertical-align:middle; } select, input, textarea { font-size:12px; margin:0; } textarea { resize:none; } table { border-collapse:collapse; } h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;} body {font-size:12px; color:#000;font-family:"微软雅黑";} .clearfix:after { content:"."; display:block; height:0; visibility:hidden; clear:both; } .clearfix { zoom:1; } .clearit { clear:both; height:0; font-size:0; overflow:hidden; } a { color:#000; text-decoration:none; } a:hover { color:#000; text-decoration:none; } html { -webkit-text-size-adjust:100%; -ms-text-size-adjust: 100%; } img { max-width: 100%; height: auto; width: auto; } body,html{ font-family: "微软雅黑"; font-size: 14px; } /* ******** */ .left { float: left; } .right { float: right; } .g-box { width: 100%; margin: 0 auto; } .part { padding: 1px 0; width: 100%; box-sizing: border-box; } .greyBg { background: #ebeae9; } .w1200 { position: relative; width: 1200px; margin: 0 auto; } .w78 { width: 78%; margin: 0 auto; } .w82 { width: 82%; margin: 0 auto; } .flexDiv { display: flex; justify-content: space-between; } .headBox { box-sizing: border-box; width: 78%; height: 120px; margin: 0 auto -1px; /* padding: 0 4%; */ display: flex; align-items: center; justify-content: space-between; background: #fff; } .headBox .t_logo { flex-shrink: 0; } .nav { flex: 1; text-align: right; height: 100%; margin: 0 15px; white-space: nowrap; } .nav ul { height: 100%; } .nav li { position: relative; display: inline-block; height: 100%; /* margin: 0 15px; */ } .nav li > a { display: block; height: 100%; padding: 0 15px; box-sizing: border-box; color: #151e26; font-size: 22px; line-height: 120px; text-align: center; } .nav li > a.active, .nav li > a:hover { font-weight: bold; color: #fff; background-color: rgb(19, 129, 202); } .nav li > a:hover .nav li > a:active { color: #fff; background-color: rgb(19, 129, 202); } .nav li .drop { position: absolute; background: rgba(19, 129, 202, 1); top: 120px; left: 50%; transform: translateX(-50%); border-radius: 0px 0px 9px 9px; min-width: 120%; filter: alpha(opacity=0); opacity: 0; transition: all 0.4s; height: 0px; overflow: hidden; padding: 0px; z-index: 10; } .nav li .open-left { /* left: 0px; */ } .nav li .open-right { /* right: 0px; */ } .nav li .drop p { height: 34px; line-height: 34px; font-size: 16px; padding: 0px 25px; white-space: nowrap; text-align: center; } .nav li .drop p a { color: #fff; } .nav li .drop p:hover a { color: #b68c39; } .nav li:hover .drop { filter: alpha(opacity=100); opacity: 1; height: auto; padding: 10px 0px 20px; } .top_right { flex-shrink: 0; } .top_right a { position: relative; display: inline-block; margin: 0 5px; } .top_right a .r_box { position: absolute; bottom: -10px; left: 50%; transform: translate(-50% , 100%); white-space: nowrap; min-width: 96px; width: auto; padding: 5px; visibility: hidden; filter: alpha(opacity=0); opacity: 0; z-index: 9; background: #fff; border-radius: 8px; transition-delay: 0.1s; transition-duration: 0.15s; transition-timing-function: ease-out; } .top_right a:hover .r_box { visibility: visible; filter: alpha(opacity=100); opacity: 1; z-index: 10; transition: 0.3s ease-out; } .top_right a .r_box::after { content: ""; position: absolute; top: 0; left: 50%; transform: translate(-50%,-100%); width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid rgba(19, 129, 202,0.8); z-index: 9; } .top_right a .r_box img { width: 96px !important; height: 96px ; } .bannerBox { position: relative; width: 100%; } .bannerBox::after{ content: ""; background: url(../img/banner_after.png) top center no-repeat; background-size: 100%; display: block; height: 20px; } .bannerBox .txt { display: none; position: absolute; bottom: 60px; right: 0; height: 178px; width: 40%; padding: 30px; box-sizing: border-box; background: rgba(0, 0, 0,0.5); } .bannerBox .txt h2 { font-size: 42px; color: #fff; } .bannerBox .txt p { margin: 10px 0; font-size: 30px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .bannerBox .swiper-slide a { display: flex; align-items: end; justify-content: center; height: 700px; } .bannerBox img { margin: 0; width: 100%; height: auto; } .sw_banner .swiper-pagination { width: auto; left: 50%; bottom: 15px; transform: translateX(-50%); } .sw_banner .swiper-pagination-bullet { width: 12px; height: 12px; border-radius: 5px; opacity: 1; background: #fff; } .sw_banner .swiper-pagination-bullet-active { background: transparent; border: 2px solid #fff; } .loginBox { position: absolute; right: 9.7%; align-self: center; width: 27.8%; height: auto; padding: 60px 0; box-sizing: border-box; border: 2px solid #fff; overflow: hidden; z-index: 9; } .loginBox h2 { font-size: 27px; color: #fff; text-align: center; } /* 关于我们 */ .p_bg1 { background: url(../img/p_bg1.png) bottom center no-repeat; background-size: cover; margin: 0 auto; padding: 1px 0 50px; } .m-title { text-align: center; text-transform:uppercase; width: 91%; margin: 55px auto 65px; } .m-title h2 { font-size: 48px; font-weight: bold; background-image: linear-gradient(to right, #1a9ed7 0%,#1381ca 40%, #032d67 65%); -webkit-background-clip: text; color: transparent; } .m-title p { font-size: 24px; color: rgba(0, 0, 0, 0.502); } .m-title::after { content: ""; display: block; margin: 9px auto 0; width: 77px; height: 6px; border-radius: 4px; background-image: -moz-linear-gradient( 0deg, #bbeaff 33%, #22bf44 33%,#22bf44 66%,#1381ca 66%); background-image: -webkit-linear-gradient( 0deg, #bbeaff 33%, #22bf44 33%,#22bf44 66%,#1381ca 66%); background-image: -ms-linear-gradient( 0deg, #bbeaff 33%, #22bf44 33%,#22bf44 66%,#1381ca 66%); } .m-title2 { text-align: left; width: 100%; margin: 55px auto 65px; } .m-title2 h2 { background-image: linear-gradient(to right, #fff, #a6e4ff); } .m-title2 p { color: rgba(255, 255, 255, 0.5); } .m-title2::after { margin: 10px 0 0; background-image: -moz-linear-gradient( 0deg, #bbeaff 33%, #22bf44 33%,#22bf44 66%,#e19d32 66%); background-image: -webkit-linear-gradient( 0deg, #bbeaff 33%, #22bf44 33%,#22bf44 66%,#e19d32 66%); background-image: -ms-linear-gradient( 0deg, #bbeaff 33%, #22bf44 33%,#22bf44 66%,#e19d32 66%); } .intro { width: 50%; height: 548px; padding: 35px 75px 30px 50px; box-sizing: border-box; border: 1px solid rgb(19, 129, 202); background: rgb(255, 255, 255,0.1); } .intro ul { margin: 0 auto 25px; display: flex; align-items: center; justify-content: space-between; } .intro li { width: 30%; } .intro li img { width: 100%; margin: 0 auto !important; } .intro li p { width: 80%; margin: 0 auto; font-size: 18px; color: rgb(3, 45, 103); font-weight: bold; text-align: center; } .intro .txt_intro { display: -webkit-box; -webkit-line-clamp: 15; /* 控制显示的行数 */ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .intro .txt_intro:after { content: ""; display: block; height: 1em; margin-top: -1em; background: linear-gradient(to bottom, transparent, white); /* 渐变效果 */ } .intro .p1, .intro > p { font-size: 16px; color: rgb(0, 0, 0); line-height: 1.8em; text-align: justify; text-indent: 2em; /* overflow: hidden; */ /* text-overflow: ellipsis; */ /* display: -webkit-box; */ /* -webkit-box-orient: vertical; */ /* -webkit-line-clamp: 8; */ } .more { display: block; margin: 20px auto; width: 107px; height: 37px; text-align: center; line-height: 37px; font-size: 14px; color: rgba(0, 0, 0, 0.8); border-radius: 30px; border: 1px solid rgb(26, 158, 215); background-color: rgb(255, 255, 255,0.4); } .videoBox { position: relative; width: 50%; height: 548px; } .videoBox img { width: 100%; height: 100%; } .vdoList { width: 100%; height: 100%; } .blackBg { position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); } .vdoList:hover { cursor: pointer; } img.play { width: 129px; height: auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 9; } img.play:hover { cursor: pointer; } .videos { display: none; border: 1px solid #080808; position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 9; } .vclose { position: absolute; width: 1vw; height: 1vw; right: 1%; top: 1%; border-radius: 100%; cursor: pointer; z-index: 10; } .vclose:hover { opacity: 0.8; } /* 产品与创新 */ .p_bg2 { background: url(../img/p_bg2.png) top center no-repeat; background-size: cover; margin: 0 auto; padding: 1px 0 0 11%; position: relative; } .left_tab { margin: 0 0 50px; } .left_tab li { position: relative; width: 369px; height: 65px; line-height: 65px; padding: 0px 10px 0 25px; font-size: 22px; color: #fff; border-radius: 0 30px 30px 0; background: rgba(19, 129, 202,0.1); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; } .left_tab li:nth-child(odd) { background: rgba(195, 231, 255,0.1); } .left_tab li.active { font-size: 30px; font-weight: bold; box-sizing: border-box; } .left_tab li::before { content: ""; width: 0; height: 0; border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-left: 14px solid rgba(255,255,255,0.1); position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 10; } .left_tab li.active::before { border-left: 14px solid #fff; } .cp_intro { position: absolute; right: 0; top: 0; height: 100%; } .cp_intro ul { height: 100%; display: flex; flex-direction: column; justify-content: space-between; } .cp_intro li { padding: 30px 40% 0 30px; box-sizing: border-box; margin: 0 auto; width: 641px; height: 33%; } .cp_intro li:nth-child(1) { background: url(../img/cp1.png) top center no-repeat; background-size: 100%; } .cp_intro li:nth-child(2) { background: url(../img/cp2.png) top center no-repeat; background-size: 100%; } .cp_intro li:nth-child(3) { background: url(../img/cp3.png) top center no-repeat; background-size: 100%; } .cp_intro li h2 { margin-bottom: 15px; font-size: 36px; color: #fff; text-align: justify; } .cp_intro li p { font-size: 16px; line-height: 1.5em; color: #fff; text-align: justify; } .cp_intro li .more { width: 130px; height: 37px; line-height: 35px; margin: 35px 0 0; font-size: 16px; color: #fff; border: 1px solid rgb(255, 255, 255,0.4); } /* 新闻资讯 */ .picBox { width: 60%; } .pic { position: relative; margin-top: 15px; box-shadow: 0 0 6px 4px rgba(0, 0, 0, 0.1); } .pic1 { float: left; width: 59%; } .pic2 { width: 39%; float: right; } .pic3 { width: 39%; float: right; box-shadow: none; } .pic1 img { width: 100%; height: 320px; } .pic2 img { width: 100%; height: 200px; } .pic3 img { width: 100%; height: 170px; } .pic .txt { padding: 10px 15px; } .pic h2 { font-size: 22px; color: rgba(0, 0, 0, 0.9); font-weight: bold; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pic2 h2 { font-size: 19px; } .pic .p1 { margin-top: 10px; font-size: 16px; color: rgba(0, 0, 0, 0.6); line-height: 1.6em; text-align: justify; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .pic .p2 { margin-top: 5px; font-size: 14px; color: #c3c3c3; line-height: 1.7em; } .pic .p2 span + span::before { content: "|"; display: inline-block; margin: 0 15px; } .pic .p2 .tag { color: rgb(3, 45, 103); } .pic3 p { position: absolute; bottom: 0; width: 100%; font-size: 14px; color: #fff; line-height: 1.6em; padding: 5px 15px; text-align: justify; background: rgba(0,0,0,0.3); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .list1 { width: 35%; overflow: hidden; } .list1 li { position: relative; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px dashed rgba(0, 0, 0, 0.2); } .list1 li a { display: block; font-size: 16px; color: rgba(0, 0, 0, 0.6); line-height: 1.6em; text-align: justify; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .list1 li img { width: 100%; border-radius: 5px; } .list1 li .p2 { margin-top: 5px; font-size: 14px; color: #c3c3c3; line-height: 1.7em; } .list1 li .p2 span + span::before { content: "|"; display: inline-block; margin: 0 15px; } .list1 li .p2 .tag { color: rgb(3, 45, 103); } .list1 .more { margin: 30px 0 0; border-radius: 0; color: rgb(26, 158, 215); } /* 服务中心 */ .p_bg3 { background: url(../img/p_bg3.png) top center no-repeat; background-size: cover; margin: 70px auto 0; padding-bottom: 100px; position: relative; } .p_bg3 .m-title2 { text-align: center; } .p_bg3 .m-title2::after { margin: 10px auto 0; } .contactUs h2 { font-size: 36px; color: #fff; } .p_bg3 .telBox { margin: 10px 0; padding-bottom: 25px; display: flex; align-items: center; color: #fff; border-bottom: 1px solid #fff; } .p_bg3 .txtBox .telBox img { width: 100px; margin: 0 18px 0 0; } .p_bg3 .txtBox .telBox span { display: block; font-size: 26px; text-align: left; line-height: 1em; } .p_bg3 .txtBox .telBox .tel { font-size: 60px; font-weight: bold; font-family: "Arial"; } .contactUs p { font-size: 22px; color: #fff; text-transform: uppercase; line-height: 2em; text-shadow: 0px 0px 13px rgba(0, 72, 111, 0.63); } .c_info li { width: 611px; height: 120px; margin: 50px 0; color: #fff; border-radius: 20px; background: rgba(3, 45, 103, 0.302); } .c_info li > a { height: 100%; display: flex; align-items: center; justify-content: center; } .c_info li i { margin-right: 15px; width: 48px; height: 48px; } .c_info li .i_gn { background: url(../img/i_gn.png) center center no-repeat; background-size: contain; } .c_info li .i_gw { background: url(../img/i_gw.png) center center no-repeat; background-size: contain; } .c_info li .i_qq { background: url(../img/i_qq.png) center center no-repeat; background-size: contain; } .c_info li span { font-size: 36px; color: #fff; } .c_info li:nth-child(3) { height: 200px; display: flex; align-items: center; justify-content: center; } .c_info li:nth-child(3) a { position: relative; height: auto; flex: 1; display: block; } .c_info li:nth-child(3) i { display: block; margin: 0 auto; } .c_info li:nth-child(3) span { margin-top: 15px; display: block; text-align: center; font-size: 18px; } .c_info li:nth-child(3) a .r_box { position: absolute; top: -15px; left: 50%; transform: translate(-50% , -100%); white-space: nowrap; min-width: 96px; width: auto; padding: 5px; visibility: hidden; filter: alpha(opacity=0); opacity: 0; z-index: 9; background: #fff; border-radius: 8px; transition-delay: 0.1s; transition-duration: 0.15s; transition-timing-function: ease-out; } .c_info li:nth-child(3) a:hover .r_box { visibility: visible; filter: alpha(opacity=100); opacity: 1; z-index: 10; transition: 0.3s ease-out; } .c_info li:nth-child(3) a .r_box::after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translate(-50%,100%); width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid rgba(255, 255, 255,0.8); z-index: 9; } .c_info li:nth-child(3) a .r_box img { width: 96px !important; height: 96px ; } .footer { padding: 50px 0 0; } .footer > div { padding-bottom: 50px; } .footer .linkGroup .link { display: inline-block; vertical-align: top; margin-right: 60px; font-size: 14px; line-height: 1.6em; } .footer .linkGroup .link .p1 { margin: 10px 0; font-size: 18px; color: rgb(0, 0, 0); } .footer .linkGroup .link a { display: block; color: #999; } .footer .linkGroup .link a:hover { color: #1381ca; } .p_bg3 .txtBox { text-align: right; font-size: 16px; line-height: 2em; color: #fff; } .p_bg3 .txtBox img { margin: 0 0 10px; } .f_botm { width: 100%; height: 62px; line-height: 62px; color: #fff; text-align: center; background: #032d67; } .f_botm span { margin: 0 15px; } .footer2 { margin: 50px 0 0; background: #333; } .footer2 .linkGroup .link .p1 { color: #fff; } .footer2 .txtBox { color: #fff; } .footer2 .f_botm { background: #181818; } .txtBox i { background: url(../img/beian.png) center center no-repeat; background-size: contain; margin: 0 5px 5px 0; width: 18px; height: 20px; display: inline-block; vertical-align: middle; } /* *******二级页-产品与创新******* */ .topBox { height: 46px; background: #032d67; } .topBox > div { display: flex; align-items: center; justify-content: flex-end; } .topBox p { margin-right: 15px; color: #666; font-size: 14px; line-height: 46px; text-align: right; } .topBox p span { margin-left: 15px; } .topBox p i { width: 19px; height: 16px; display: inline-block; margin-right: 5px; vertical-align: text-top; } .topBox p .i1 { background: url(../img/i1.png) center center no-repeat; background-size: contain; } .topBox p .i2 { background: url(../img/i2.png) center center no-repeat; background-size: contain; } .headBox.w1200 { /* width: 1200px; */ padding: 0; } .c_banner { position: relative; } .c_banner .txt { position: absolute; top: 120px; left: 18%; height: 178px; width: 40%; padding: 30px; box-sizing: border-box; background-image: -moz-linear-gradient( 0deg, rgba(0, 0, 0,0.3) 0%, rgba(0, 0, 0,0) 100%); background-image: -webkit-linear-gradient( 0deg, rgba(0, 0, 0,0.3) 0%, rgba(0, 0, 0,0) 100%); background-image: -ms-linear-gradient( 0deg, rgba(0, 0, 0,0.3) 0%, rgba(0, 0, 0,0) 100%); } .c_banner .txt h2 { font-size: 42px; color: #fff; } .c_banner .txt p { margin: 10px 0; font-size: 30px; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .breadcrumb { font-size: 14px; color: rgb(162, 162, 163); } .breadcrumb>li { display: inline-block; } .breadcrumb >li a, .breadcrumb>.active { color: rgb(162, 162, 163); } .breadcrumb>li+li+li:before { padding: 0 5px; color: rgb(162, 162, 163); content: ">"; } .breadcrumb .home { background: url(../img/i_home.png) center center no-repeat; background-size: contain; width: 16px; height: 16px; display: inline-block; vertical-align: middle; margin-right: 5px; } .c-title { height: 96px; line-height: 96px; box-shadow: 0 5px 6px 0px rgb(173, 172, 172,0.15); } .c-title .c-ul { color: #3c3c3c; } .c-title .c-ul li { position: relative; min-width: 128px; width: auto; height: 100%; padding: 0 10px; box-sizing: border-box; display: inline-block; font-size: 20px; text-align: center; color: rgb(67, 67, 67); cursor: pointer; } .c-title .c-ul li:first-child { /* background: #f6f6f6; */ } .c-title .c-ul li.active { border-bottom: 3px solid #0066b3; } .c-title .c-ul li::after { color: rgb(162, 162, 163); content: ""; width: 1px ; height: 96px; position: absolute; right: 0; background: #e6e6e6; display: inline-block; vertical-align: top; } .c-title .c-ul a { color: #3c3c3c; } .c-title .c-ul li.active, .c-title .c-ul li:hover { background: #f6f6f6; border-bottom: 3px solid #0066b3; } .c-title .c-ul a:hover, .c-title .c-ul a:active { color: #0066b3; } .main-title { margin-top: 57px; } .main-title img { width: 112px; margin: 18px auto; } .main-title h2 { margin: 0 auto; } .main-title p { font-size: 18px; color: #000; width: 830px; margin: 47px auto; line-height: 1.5em; text-align: center; } .main-title .p1 { font-size: 20px; color: #b7b7b8; } .s-title { position: relative; width: 838px; padding-bottom: 15px; margin: 80px auto 0; font-size: 30px; color: #030000; text-align: center; border-bottom: 1px solid rgba(51, 51, 51,0.4); } .s-title .blue { color: #1381ca; } .s-title::after { content: ""; width: 6em; height: 4px; display: block; position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%); background: #0066b3; } .cpList { padding: 80px 0 30px; margin: 0 0 20px; position: relative; } .a_title { position: absolute; top: 0; padding: 0 40px 0 0; box-sizing: border-box; font-size: 24px; text-indent: 40px; color: #fff; width: 270px; height: 509px; background-color: #1381ca; z-index: 0; } .a_title h2 { margin-top: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .a_title h2 span { font-size: 42px; font-weight: bold; } .cpList ul { position: relative; width: calc(100% - 40px); transform: translateX(40px); margin: 10px 0; display: flex; justify-content: space-between; z-index: 9; } .cpList2 ul { transform: translateX(0); } .cpList2 .a_title { right: 0; } .cpList2 .a_title h2 { text-align: right; } .cpList li { width: 346px; height: auto; background: #fff; box-shadow: 0px 0px 13px 2px rgba(127, 127, 127, 0.2); } .cpList li .imgBox { display: flex; align-items: center; position: relative; width: 100%; height: 226px; overflow: hidden; } .cpList li .imgBox img { height: 100%; width: 100%; } .cpList li .imgBox p { position: absolute; bottom: 0; width: 100%; box-sizing: border-box; padding: 5px 10px; color: #fff; font-size: 16px; line-height: 1.6em; text-align: center; background: rgba(0, 0, 0, 0.6); } .cpList li .txt { padding: 10px; box-sizing: border-box; } .cpList li .p1 { font-size: 14px; color: #999; line-height: 1.7em; text-align: justify; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .cpList li h2 { font-size: 26px; color: #5b5e66; } .cpList .more { position: absolute; right: 0; top: 10px; } .cpList2 .more { right: auto; left: 0; } .c_more { display: block; margin: 10px 0; width: 100px; height: 27px; line-height: 25px; font-size: 14px; color: rgb(153, 153, 153); text-transform: uppercase; text-align: center; border-radius: 20px; border: 1px solid rgb(26, 158, 215); } .c_more:hover { color: #fff; background: rgb(26, 158, 215); } .yfList ul { position: relative; margin: 10px 0 50px; } .yfList li { width: 346px; height: auto; } .yfList li .imgBox { display: flex; align-items: center; position: relative; width: 90%; margin: 0 auto -110px; box-shadow: 0px 0px 13px 2px rgba(127, 127, 127, 0.2); } .yfList li .imgBox img { height: 254px; width: 100%; } .yfList li .txt { padding: 130px 10px 10px; box-sizing: border-box; background: #fff; } .yfList li .p1 { font-size: 16px; color: #999; line-height: 1.7em; text-align: center; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .sw2 .swiper-pagination-bullet { width: 12px; height: 12px; opacity: 1; background: #fff; } .sw2 .swiper-pagination-bullet-active { background: #1381ca; } .cp_bg1 { background: url(../img/cp_bg1.png) top center no-repeat; background-size: cover; margin: 0 auto; position: relative; } .cp_bg1 .s-title{ color: #fff; border-bottom: 1px solid #fff; } .cp_bg1 .main-title p { color: #fff; } .list2 ul { display: flex; justify-content: space-between; margin-bottom: 30px; } .list2 li { width: 48%; display: flex; background: #fff; } .list2 .imgBox { flex-shrink: 0; width: 370px; height: 230px; } .list2 .txt { flex: 1; margin: 15px; position: relative; overflow: hidden; } .list2 .imgBox img { width: 100%; height: 100%; } .list2 .txt h3 { margin-bottom: 10px; position: relative; font-size: 18px; color: rgb(1, 0, 0); } .list2 .txt p { text-align: justify; font-size: 14px; color: rgb(1, 0, 0); line-height: 1.6em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; } .list2 li a { float: right; color: rgb(1, 0, 0); } .list2 li a:hover { color: #1f53a6; } .btn { display: block; margin: 70px auto; width: 235px; height: 62px; line-height: 62px; text-align: center; font-size: 24px; color: #fff; background: #1381ca; } .btn:hover { color: #fff; } /* 关于我们 */ .p_us { min-height: 900px; } .leftTab { flex-shrink: 0; margin-right: 25px; width: 225px; position: relative; } .leftTab .p1 { height: 110px; line-height: 110px; margin-bottom: 10px; font-size: 20px; color: #fff; text-align: center; background: #1381ca; } .leftTab li { position: relative; height: 77px; font-size: 16px; line-height: 77px; padding: 0 5px; box-sizing: border-box; text-align: center; color: rgba(0,0,0,0.86); background: #f6f6f6; border-bottom: 1px solid #d6d6d6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; } .leftTab li.active { color: #fff; background: #1381ca; } .leftTab li.active::after { content: ""; position: absolute; right:0px; top:50%; transform: translate(100%,-50%); width:0px; height:0px; border: 10px solid transparent; border-left: 10px solid #1381ca; } .leftTab li a { color: rgba(0,0,0,0.86); } .leftTab li.active a { color: #fff; } .leftTab li span { font-size: 14px; } .p_us .tabCon { flex:1; } .qyIntro { display: flex; } .qyIntro .left, .qyIntro .right { position: relative; width: 48%; height: auto; overflow: hidden; } .qyIntro .left { display: none; margin-right: 20px; } .qyIntro .left img { height: 100%; } .qyIntro .left p { width: 100%; padding: 10px 15px; box-sizing: border-box; position: absolute; bottom: 0; color: #fff; font-size: 20px; text-align: justify; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: rgba(3, 45, 103, 0.75); } .qyIntro .right h3 { margin-bottom: 30px; padding-bottom: 10px; position: relative; font-size: 20px; color: rgb(2, 2, 2); border-bottom: 1px solid #c2c1c1; } .qyIntro .right { width: 100%; } .qyIntro .right img { margin: 20px auto; } .qyIntro .right p { margin: 10px 0 15px; text-align: justify; font-size: 16px; color: #848484; line-height: 2.2em; text-indent: 1em; } .wrapper { margin: 0 auto; } /* _timeline.css */ .timeline { position: relative; margin: 0 auto; } .timeline::before { content: ""; position: absolute; top: 0; left: 50%; width: 2px; height: 100%; background-color: rgb(155, 155, 155); } .timeline_item { margin-bottom: 30px; position: relative; } .timeline_item::after{ content: ""; clear: both; display: table; } .timeline_item .item_con_right { float: right; } .item_node { background-color: #f64b00; width: 40px; height: 40px; position: absolute; border-radius: 50%; top: 0; left: 50%; transform: translateX(40%); color: #fff; text-align: center; line-height: 40px; font-size: 18px; margin-left: -33px; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .item_con { width: 40%; float: left; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; } .item_con .imgBox { width: 100%; height: 102px; display: flex; align-items: center; justify-content: center; } .item_con .imgBox img { height: 100%; } .item_date { width: fit-content; position: relative; font-size: 20px; padding-bottom: 5px; margin-bottom: 10px; color: #f64b00; } .item_date::after { content: ""; position: absolute; right:0px; top:6px; transform: translate(100%,0); width:0px; height:0px; border: 8px solid transparent; border-right: 8px solid #f64b00; } .item_date::before { content: ""; position: absolute; left: 0; bottom: 0; width: 30px; height:2px; background: #f64b00; } .timeline_item:nth-child(2n) .item_con .item_date { float: right; } .timeline_item:nth-child(2n) .item_con .item_date::after { left:-5px; top:6px; transform: translate(-100%,0); border-left: 8px solid #f64b00; border-right:transparent; } .item_description { width: 100%; font-size: 14px; line-height: 24px; color: #787878; text-indent: 2em; text-align: justify; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; } /* _site-footer.css */ .site-footer { padding: 50px 0 200px 0; } .site-footer__text { color: #e6e6e6; font-size: 14px; text-align: center; } .site-footer__text__link { color: #8287a9; } .list3 ul { width: 100%; display: flex; flex-wrap: wrap; } .list3 li { width: 32%; margin: 0 2% 25px 0; height: auto; border: 1px solid #e1e1e1; } .list3 li:nth-child(3n) { margin-right: 0; } .list3 li .imgBox { display: flex; justify-content: center; align-items: center; position: relative; width: 100%; height: 214px; overflow: hidden; } .list3 li .imgBox img { height: 100%; width: 100%; } .list3 li h2 { position: relative; margin: 15px 0 0; padding-bottom: 15px; font-size: 24px; color: rgb(19, 129, 202); text-align: center; } .list3 li h2::after { content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 30px; height:3px; border-radius: 3px; background: rgb(19, 129, 202); } .list3 li .p1 { font-size: 14px; color: rgb(4, 4, 4); line-height: 1.7em; text-align: justify; margin: 20px 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; } .list3_honor li .p1 { margin: 10px; font-size: 16px; line-height: 1.8em; -webkit-line-clamp: 1; } .list3_honor li .c_more { margin: 10px; } .list3_honor li p span { margin: 0 5px 0 0; } .honor_list ul { display: flex; align-items: center; flex-wrap: wrap; } .honor_list li { display: flex; justify-content: center; align-items: center; width: 32%; height: 240px; margin: 0 2% 20px 0; /* background-color: #e0dfdf; */ box-shadow: 0 0 6px 4px rgb(0 0 0 / 10%); overflow: hidden; } .honor_list li img { height: 100%; } .honor_list li p { display: flex; align-items: center; background:url(../img/zs_bg2.png) center center no-repeat; background-size: contain; font-size: 18px; padding: 0 25%; height: 100%; box-sizing: border-box; color: rgb(3, 45, 103); font-weight: bold; text-align: center; } .honor_list li:nth-child(3n) { margin-right: 0; } .tabCon > div, .tabCon > .s-title { display: none; } .tabCon > div:nth-child(1), .tabCon > .s-title:nth-child(1) { display: block; } /* 产品列表 */ .p_cplb .tabCon { flex: 1; } .p_cplb .list3 li { border: none; } .p_cplb .list3 li .imgBox { height: 230px; } .p_cplb .list3 li .imgBox a { display: block; height: 100%; } .p_cplb .list3 li .p1 { margin: 0; padding: 10px; font-size: 18px; text-align: center; background: #f7f7f7; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .p_cplb .list3 li:hover { background-color: rgb(255, 255, 255); box-shadow: 0px 0px 16px 4px rgba(25, 78, 148, 0.2); } /* 新闻详情 */ .news_title { padding-bottom: 40px; border-bottom: 1px solid #adadad; } .news_title h2 { font-size: 28px; color: rgb(4, 0, 0); text-align: center; } .news_title p { margin-top: 35px; font-size: 18px; color: rgb(96, 96, 96); text-align: center; } .newsDetail { margin: 60px auto 115px; } .newsDetail .txtBox p { margin: 2em 0; font-size: 20px; color: rgb(3, 0, 0); line-height: 1.8em; text-indent: 2em; text-align: justify; } .newsDetail .txtBox h2 { font-size: 24px; line-height: 1.8em; } .newsDetail .txtBox img { margin: 35px auto; } .newsDetail .back { display: block; margin: 94px auto 0; width: 166px; height: 63px; line-height: 63px; font-size: 24px; text-align: center; color: rgb(93, 93, 93); border-radius: 10px; border: 1px solid #adabab; } .moreNews { padding-top: 20px; border-top: 1px solid #adadad; } .moreNews li { width: 70%; margin: 0 auto; margin-bottom: 15px; font-size: 14px; color: #666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .moreNews li a { color: #666; } /* 产品详情 */ .cpDetail { padding: 50px 0; } .cpDetail .imgBox { flex-shrink: 0; align-self: flex-start; width: 370px; height: auto; margin-right: 30px; padding: 10px 10px 30px; box-sizing: border-box; background: #fff; box-shadow: 0px 10px 21px 0px rgba(127, 127, 127, 0.14); } .cpDetail .imgBox img { width: 100%; height: auto; } .cpDetail .imgBox p { margin-top: 10px; text-align: center; font-size: 20px; color: rgb(0, 3, 5); text-transform: uppercase; } .cpDetail .cp_name { padding-bottom: 15px; border-bottom: 1px solid #1381ca; } .cpDetail .cp_name h2 { font-size: 24px; color: rgb(0, 3, 5); } .cpDetail .cp_name p { margin-top: 10px; font-size: 20px; color: rgb(19, 129, 202); text-transform: uppercase; } .cpDetail .txt { margin: 20px 0 30px; } .cpDetail .txt h3 { margin-bottom: 20px; width: fit-content; padding: 0 15px; height: 27px; line-height: 27px; font-size: 16px; text-align: center; color: rgba(255, 255, 255, 0.8); background: rgb(19, 129, 202); border-radius: 20px; } .cpDetail .txt p { font-size: 14px; color: rgb(0, 3, 5); line-height: 1.8em; } /* 服务与支持 */ .p_serve .list3 { margin: 50px 0; } .p_serve .list3 li { border:none; } .p_serve .list3 li .imgBox { height: auto; } .p_serve .list3 li .p1 { text-align: center; font-size: 24px; color: rgb(0, 3, 5); } .serveBox { margin: 50px auto; display: flex; align-items: center; justify-content: space-between; background: #fff; } .serveBox .s_left, .serveBox .s_right { width: 49%; } .serveBox img { margin: 0; width: 100%; } .serveBox .txt { margin: 0 20px; } .serveBox .txt h2 { padding-bottom: 15px; margin-bottom: 15px; font-size: 36px; color: rgb(19, 129, 202); border-bottom: 1px solid #d4d4d4; } .serveBox .txt h3 { font-size: 25px; color: #4b4b4b; } .serveBox .txt p { font-size: 18px; line-height: 1.8em; } .serveBox .txt i { display: inline-block; vertical-align: middle; margin-right: 15px; width: 48px; height: 48px; } .serveBox .txt .i_gn { background: url(../img/i_gn2.png) center center no-repeat; background-size: contain; } .serveBox .txt .i_gw { background: url(../img/i_gw2.png) center center no-repeat; background-size: contain; } .serveBox .txt .more { float: right; width: auto; height: auto; line-height: 1em; color: #00a0e8; border: none; padding: 0; border-bottom: 1px solid #00a0e8; border-radius: 0; background: none; } /* 新闻资讯 */ .media, .media-body { overflow: hidden; zoom: 1; } .media-body, .media-left, .media-right { display: table-cell; vertical-align: top; } .media img { max-width: unset; } .media-body { width: 10000px; } .news_list .media { margin: 30px auto; padding: 15px; box-sizing: border-box; border: 1px solid #e1e1e1; } .news_list .media:hover { background: #f8f8f8; } .news_list .media-heading { margin: 20px auto; font-size: 22px; font-weight: bold; color: rgb(4, 0, 0); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .news_list .media-heading a { color: rgb(4, 0, 0); } .news_list .p1 { text-align: justify; font-size: 16px; color: rgb(4, 4, 4); line-height: 1.6em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .news_list .media-left img { width: 455px; height: 282px; margin-right: 30px; } .news_list .p2 { margin-top: 120px; font-size: 14px; line-height: 15px; color: rgb(102, 102, 102); } .news_list .p2 span { margin-right: 20px; } .news_list i { display: inline-block; vertical-align: bottom; margin-right: 5px; width: 15px; height: 15px; } .news_list .i_time { background: url(../img/i_time.png) center center no-repeat; background-size: contain; } .news_list .i_eye { background: url(../img/i_eye.png) center center no-repeat; background-size: contain; } .pageDiv ul { margin: 50px auto; display: flex; justify-content: center; align-self: center; } .pageDiv ul li { margin: 0 5px; height: 28px; line-height: 28px; font-size: 12px; } .pageDiv ul li a { padding: 0 10px; color: #333; display: inline-block; border: 1px solid rgb(234, 234, 234); } .pageDiv ul li span { color: rgb(102, 102, 102); } .pageDiv ul li input { padding: 0 10px; height: 100%; width: 3em; color: #333; text-align: center; border: 1px solid rgb(234, 234, 234); } .pageDiv ul li a:hover { color: #fff; background: #0066b3; } .pageDiv ul li.disabled a { color: rgb(153, 153, 153); } .pageDiv ul li.disabled a:hover { background: #fff; } .tcBox { display: none; position: absolute; left: 50%; top: 120px; transform: translateX(-50%); width: 500px; height: 600px; /* height: auto; */ z-index: 99; } .tcBox .close { position: absolute; top: 5px; right: 0; width: 30px; } .tcBox iframe { width: 100%; height: 100%; } .ai_kf { position: fixed; right: 0; top: 60%; height: 40px; z-index: 99; } .ai_kf img { height: 100%; } /* 手机 */ .title_ph, .p_ph { display: none; } .menubtn{ display: none; } .i_cancel { position: relative; background: url(../img/i_cancel.png) center center no-repeat; background-size: 50%; width: 30px; height: 30px; margin-right: 10px; cursor: pointer; display: none; /* z-index: 99; */ background-color: #1381ca; border-radius: 30px; } .searchBox { display: none; position: absolute; top: 1px; right: 12%; /* display: flex; */ align-items: center; justify-content: center; width: 350px; padding: 0 15px; box-sizing: border-box; height: 80px; background: rgba(22, 130, 203 ,0.5); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); z-index: 11; } .searchBox form { width: 98%; } .searchBox input { width: 100%; height: 46px; line-height: 46px; padding: 0 20px; box-sizing: border-box; font-size: 16px; color: #fff; border: 1px solid rgba(255,255,255,0.8); /* backdrop-filter: blur(35px); */ border-radius: 29px; outline: none; background: transparent; } .searchBox input::placeholder { color: #fff; } .searchBox i { position: absolute; right: 34px; background: url(../img/i_search2.png) center center no-repeat; background-size: 100%; display: inline-block; width: 30px; height: 30px; cursor: pointer; } .topBox > div .searchBox { top: 0; height: 45px; } .topBox > div .searchBox input { height: 30px; line-height: 30px; font-size: 13px; } .topBox > div .searchBox i { width: 23px; } /* 英文版 */ #language_en .nav li > a { font-size: 16px; } #language_en .headBox .t_logo img { height: 50px; } #language_en .bannerBox .txt h2 { font-size: 32px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #language_en .bannerBox .txt p { margin: 15px 0; font-size: 20px; } #language_en .footer .linkGroup .link { margin-right: 30px; }