@charset "utf-8"; /*header start*/ #menuPc > ul > li { position: relative; } #menuPc > ul > li dl { padding-top: 10px; position: absolute; width: 100%; min-width: 200px; top: 100%; background: #fff; box-shadow: 5px 5px 15px 0 rgba(0, 0, 0, 0.2); opacity: 0; visibility: hidden; transform: translateY(2%); transition: all 0.2s; text-align: center; padding: 10px 0; } #menuPc > ul > li:hover dl { opacity: 1; visibility: visible; transform: translateY(0); } #menuPc > ul > li dl dd a { display: block; padding: 5px 10px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; font-size: 1.4rem; font-weight: 400; color: #000000; transition: all 0.6s; } #menuPc > ul > li dl dd a i { font-size: 14px; } #menuPc > ul > li dl dd a:hover { color: #307FE2; } .header { position: fixed; z-index: 2; left: 0; right: 0; padding: 20px 60px; #background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), transparent); background-image: linear-gradient(to bottom, #307fe2, #307fe2); } .header .header-box { position: relative; } .header .h-left { float: left; display: flex; align-items: center; } .header .logo { border-right: 1px solid rgba(255, 255, 255, 0.3); padding-right: 30px; margin-right: 30px; } .header .h-gp { font-weight: 500; color: #FFF; border-radius: 17px; line-height: 34px; height: 34px; padding: 0 18px; background: rgba(48, 127, 226, 0.8); } .video-box video { width: 100%; } #menuPc { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } #menuPc a { color: #FFF; display: block; padding: 0 20px; } #menuPc ul { display: flex; } .h-right { float: right; color: #FFF; } .h-right a { color: #FFF; } .h-right .h-top { margin-bottom: 12px; text-align: right; } .h-tool dl { display: flex; line-height: 1; } .h-tool dl dd { padding: 0 30px; border-right: 1px solid rgba(255, 255, 255, 0.3); } .h-tool dl dd a { display: block; } .h-tool dl dd:nth-last-child(1) { border-right: none; padding: 0; } .h-tool .h-ss { border-right: none; } .h-tool .h-ss img { margin-right: 5px; } .h-lang { position: relative; cursor: pointer; } .h-lang .h-lang-t { display: flex; align-items: center; } .h-lang:hover .h-lang-con { opacity: 1; visibility: visible; top: 100%; } .h-lang:hover .icon { transform: rotateX(-180deg); } .h-lang .h-lang-con { opacity: 0; visibility: hidden; position: absolute; top: 110%; right: 0; background-color: rgba(48, 127, 226, 0.8); min-width: 100%; transition: all 0.5s; padding: 4px 0; } .h-lang .h-lang-con a { display: block; text-align: center; padding: 6px; font-size: 1.4rem; white-space: nowrap; } .h-lang .h-lang-con a:hover { text-decoration: underline; } .h-lang .icon { margin-left: 6px; width: 9px; height: 5px; background: url("../images/h-arrow.png") no-repeat; position: relative; transition: all 0.4s; } #menuWap { display: none; } /*header end*/ /*footer start*/ .footer { margin-top: 18vh; } .f-logo { margin-bottom: 45px; position: relative; } .f-search { position: absolute; right: 0; top: 50%; margin-top: -20px; } .f-search input { border: 1px solid rgba(102, 102, 102, 0.1); height: 40px; padding: 0 20px; background: transparent; font-size: 1.4rem; width: 320px; box-sizing: border-box; color: #002143; } .f-search input::placeholder { color: #666; font-size: 1.4rem; } .f-search button { position: absolute; right: 0; top: 0; height: 100%; border: none; background: url("../images/f-ss.png") no-repeat 50% 50%; width: 60px; } .foot-con { display: flex; flex-wrap: wrap; border-top: 1px solid rgba(102, 102, 102, 0.1); padding-top: 70px; } .f-nav { width: 75%; } .f-nav h3 { font-size: 1.8rem; color: #333; font-weight: 400; margin-bottom: 20px; } .f-nav dd { line-height: 2.5; margin-bottom: 4px; } .f-nav dd a { color: #666; } .f-nav li { float: left; width: 16.66%; } .f-tool { width: 25%; font-size: 1.6rem; box-sizing: border-box; border-left: 1px solid rgba(102, 102, 102, 0.1); padding-left: 7%; } .f-tool label { color: #666; display: block; margin-bottom: 6px; } .f-tool dd { margin-bottom: 16px; } .f-tool p { color: #333; font-size: 1.8rem; } .f-tool p a { color: #333; } .f-share li { float: left; margin-right: 28px; position: relative; } .f-share li:hover .h-text { opacity: 1; visibility: visible; bottom: 100%; } .f-share li .h-text { position: absolute; bottom: 105%; left: 50%; transform: translateX(-50%); background-color: #FFF; padding: 10px; border-radius: 5px; width: 120px; transition: all 0.5s ease-in-out; opacity: 0; visibility: hidden; } .f-share li .h-text img { max-width: 100%; } .f-share li a { display: inline-block; width: 44px; height: 44px; border-radius: 50%; background-color: rgba(51, 51, 51, 0.1); text-align: center; line-height: 44px; transition: all 0.4s; } .f-share li a .iconfont { font-size: 2.6rem; color: rgba(102, 102, 102, 0.8); } .f-share li a:hover { background-color: #307FE2; } .f-share li a:hover .iconfont { color: #FFF; } .foot-copy { margin-top: 50px; border-top: 1px solid rgba(102, 102, 102, 0.1); padding: 26px 0 50px; display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; font-size: 1.4rem; color: #666; } .foot-copy .f-link a { color: #666; display: inline-block; margin-left: 20px; } .foot-copy .f-link a:hover { color: #333; text-decoration: underline; } .foot-copy .f-link label { color: #333; } /*footer end*/ .f-46 { font-size: 4.6rem; } .f-36 { font-size: 3.6rem; } .f-30 { font-size: 3rem; } /*轮播图start*/ .banner { margin: 0 auto 0; width: 100%; background: #FFFFFF; color: #FFF; position: relative; } .banner .video-show { position: relative; height: 100vh; } .banner .video-show .p-icon { position: absolute; left: 50%; transform: translate(-50%, -50%); top: 50%; width: 123px; height: 123px; background: url("../images/bofang.png") no-repeat; z-index: 3; /* display: none; */ } .banner .video-show video { height: 100%; width: 100%; object-fit: cover; } .banner p { font-size: 1.2rem; line-height: 2; opacity: 0.4; } .banner h3 { margin-bottom: 20px; } .banner h3, .banner h2 { font-weight: 500; } .banner .swiper-slide { position: relative; overflow: hidden; height: 100%; } .banner .swiper-slide .video-box { width: 100%; padding-bottom: 40%; position: relative; overflow: hidden; } .banner .swiper-slide .video-box video { position: absolute; left: 0; top: 0; right: 0; bottom: 0; } .banner .bg-box { position: relative; z-index: 1; } .banner .bg-box img { width: 100%; height: 100vh; transform: scale(1.1); transition: all 8s; object-fit: cover; } .banner .wap-box { display: none; } .banner .wap-box img { width: 100%; } .banner .swiper-pagination { bottom: 6vh; } .banner .swiper-pagination-bullet { width: 20px; height: 27px; opacity: 0.5; border-radius: inherit; transition: all 0.6s; background: url("../images/b-dot2.png") no-repeat; } .banner .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; } .banner .swiper-pagination-bullet-active { opacity: 1; } .banner .swiper-container-horizontal > .swiper-pagination-bullets, .banner .swiper-pagination-custom, .banner .swiper-pagination-fraction { bottom: 20px; } .about-innerbanner { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 2; display: flex; flex-direction: column; justify-content: center; } .about-innerbanner .text2 { transition: all 1.5s; transform: translateY(20%); opacity: 0; box-sizing: border-box; width: 62%; background-color: rgba(48, 127, 226, 0.8); padding: 50px; } .about-innerbanner .text2 p { color: #FFF; font-size: 1.8rem; line-height: 2; margin-top: 36px; opacity: 1; } .cur .about-innerbanner .text2 { transform: translateY(0); opacity: 1; } .banner .banner-content { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; justify-content: center; z-index: 9; flex-direction: column; opacity: 0; transition: all 0.3s; } .banner .banner-content .text { background: linear-gradient(90deg, #2C5DC1 0%, rgba(44, 93, 193, 0) 100%); text-align: left; padding: 60px 0; padding-left: 12%; width: 80%; box-sizing: border-box; } .banner .banner-content .text-p { transform: translateY(20%); opacity: 0; transition: all 1s; transition-delay: 0.3s; } .banner.inner-banner.cur .banner-content { opacity: 1; } .inner-banner.cur .imgshow img { transform: scale(1); } .banner.inner-banner.cur .banner-content .text-p { transform: translateY(0); opacity: 1; } .banner.inner-banner .banner-content .text { background: transparent; } .banner.inner-banner .line { width: 64px; height: 3px; background: #FFFFFF; margin-top: 24px; } .banner.inner-banner .bg-box img { height: auto; } .banner .ani-slide .banner-content { opacity: 1; } .ani-slide .imgshow img { transform: scale(1); } .banner .ani-slide .banner-content .text-p { transform: translateY(0); opacity: 1; } /*轮播图end*/ .crumbs-box { padding: 12px 0; } .crumbs-box a { color: #666; display: inline-block; transition: all 0.4s; } .crumbs-box a:hover { color: #307FE2; } .crumbs-box i { display: inline-block; padding: 0 5px; color: #999; } .crumbs-box span { color: #307FE2; } /*公共样式定义 start*/ /*例如,统一间距,统一字体,统一大小写,统一最大距离*/ /* 内容区域宽度+40px */ .m-width-content { max-width: 1440px; margin: 0 auto; } /*置顶按钮 start*/ /*置顶按钮 end*/ /*分页 start*/ .page-box { padding: 70px 0; text-align: center; } .page-box .iconfont { font-size: 1.8rem; } .page-box .page-inner { display: flex; justify-content: center; } .page-box .page-inner a, .page-box .page-inner span { border: 1px solid #D2D2D2; display: inline-flex; font-size: 1.8rem; color: #666; border-radius: 50%; margin: 0 3px; width: 38px; height: 38px; line-height: 38px; justify-content: center; background: transparent; transition: all 0.3s; } .page-box .page-inner a.page-text { width: auto; padding: 9px 15px; border-radius: 17px; height: auto; line-height: 1; } .page-box .page-inner a.page-text:hover { color: #fff; background-color: #307FE2; border: 1px solid #307FE2; } .page-box .page-inner .current, .page-box .page-inner a:hover { color: #fff; background-color: #307FE2; border: 1px solid #307FE2; } /*分页 end*/ /*公共样式定义 end*/ .index-auto-mechgrid { background: url("../images/index-auto-bg.jpg") no-repeat 50% 50%; padding: 1px 0; background-size: cover; } .themebtn.swiper-button-next, .themebtn.swiper-button-prev { width: 46px; height: 46px; border-radius: 50%; margin-top: -23px; background-color: rgba(0, 0, 0, 0.6); background-image: none; color: #FFF; text-align: center; line-height: 46px; } .themebtn.swiper-button-next .iconfont, .themebtn.swiper-button-prev .iconfont { font-size: 24px; } .themebtn.swiper-button-next.swiper-button-disabled, .themebtn.swiper-button-prev.swiper-button-disabled { opacity: 0; } .themebtn.swiper-button-next { right: 0; } .themebtn.swiper-button-prev { left: 0; } .auto-mechine-cont { position: relative; display: flex; margin: 135px 0 0px; } .auto-mechine-cont > .index-title { position: absolute; left: 0; top: 0; transform: translateY(-100%); margin-top: -30px; } .auto-mechine-cont .auto-left { width: 380px; flex-shrink: 0; position: relative; left: -10px; } .auto-mechine-cont .auto-left .a-item { display: flex; align-items: center; } .auto-mechine-cont .auto-left .text { position: absolute; left: 150px; } .auto-mechine-cont .auto-left .text h3 { color: #666; font-size: 1.8rem; } .auto-mechine-cont .auto-left .h-text { padding-left: 30px; height: 100%; display: flex; flex-direction: column; opacity: 0; transition: all 0.6s; visibility: hidden; justify-content: center; } .auto-mechine-cont .auto-left .h-text .t-con { transform: translateY(-70%); } .auto-mechine-cont .auto-left .h-text h3 { font-size: 2rem; color: #222; } .auto-mechine-cont .auto-left .h-text h4 { color: #666; font-size: 1.4rem; } .auto-mechine-cont .auto-left .line { opacity: 0; transition: all 0.6s; visibility: hidden; position: absolute; right: 0; left: 80px; border-bottom: 1px solid rgba(48, 127, 226, 0.5); } .auto-mechine-cont .auto-left .line .l-dot { width: 12px; height: 12px; border-radius: 50%; background-color: #307FE2; position: absolute; top: 50%; left: 0; transform: translateY(-50%); } .auto-mechine-cont .auto-left .line .r-dot { width: 8px; height: 8px; border-radius: 50%; background-color: #307FE2; position: absolute; top: 50%; right: 2px; transform: translateY(-50%); } .auto-mechine-cont .auto-left .swiper { height: 750px; } .auto-mechine-cont .auto-left .swiper-slide.swiper-slide-active .imgshow { transform: scale(1); border: 10px solid rgba(48, 127, 226, 0.1); } .auto-mechine-cont .auto-left .swiper-slide.swiper-slide-active .imgshow img { border: 10px solid rgba(48, 127, 226, 0.2); } .auto-mechine-cont .auto-left .swiper-slide.swiper-slide-active .text { opacity: 0; } .auto-mechine-cont .auto-left .swiper-slide.swiper-slide-active .h-text, .auto-mechine-cont .auto-left .swiper-slide.swiper-slide-active .line { opacity: 1; visibility: visible; } .auto-mechine-cont .auto-left .swiper-slide { height: 150px; top: 0px; } .auto-mechine-cont .auto-left .imgshow { width: 150px; height: 150px; flex-shrink: 0; transform: scale(0.66); border-radius: 50%; overflow: hidden; transition: all 0.3s; background-color: #FFF; box-sizing: border-box; } .auto-mechine-cont .auto-left .imgshow .img-box img { border-radius: 50%; box-sizing: border-box; } .auto-mechine-cont .auto-right { padding: 0 0 0 5%; text-align: center; width: calc(100% - 380px); box-sizing: border-box; display: flex; flex-direction: column-reverse; justify-content: space-between; position: relative; } .auto-mechine-cont .auto-right .text { text-align: center; color: #666; line-height: 1.875; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; text-align: left; } .auto-mechine-cont .auto-right .auto-btn { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .auto-mechine-cont .auto-right .auto-btn .see-more { opacity: 0; transition: all 0.7s; } .auto-mechine-cont .auto-right .auto-btn .see-more:after { width: 0; transition: all 0.7s; } .auto-mechine-cont .auto-right .auto-bigimgshow { width: 100%; margin: 0 auto; position: relative; } .auto-mechine-cont .auto-right .auto-bigimgshow .img-box { /*padding-bottom: 88.94558%;*/ padding-bottom: 59.94558%; } .auto-mechine-cont .auto-right .auto-bigimgshow .imgshow { position: relative; /*max-width: 756px;*/ width: 100%; margin: 0 auto; max-height: 600px; } .auto-mechine-cont .auto-right .auto-bigimgshow .a-item { display: flex; flex-direction: column-reverse; } .auto-mechine-cont .auto-right .auto-bigimgshow .swiper-slide { opacity: 0 !important; /*padding-right: 240px;*/ box-sizing: border-box; } .auto-mechine-cont .auto-right .auto-bigimgshow .swiper-slide.ani-slide { opacity: 1 !important; } .auto-mechine-cont .auto-right .auto-bigimgshow .swiper-slide.ani-slide .see-more { opacity: 1; transition-delay: 2s; } .auto-mechine-cont .auto-right .auto-bigimgshow .swiper-slide.ani-slide .see-more:after { transition-delay: 2.2s; width: 100%; } .auto-mechine-cont .auto-right .auto-bigimgshow .swiper-slide.ani-slide .sm-img { transform: scale(1); opacity: 1; } .auto-mechine-cont .auto-right .auto-bigimgshow .swiper-slide.ani-slide .img-box img { transform: scale(1); opacity: 1; } .auto-mechine-cont .auto-right .auto-bigimgshow .img-box img { transition: all 2s; transform: scale(1.1); opacity: 0; } .auto-mechine-cont .auto-right .auto-bigimgshow .sm-img { position: absolute; left: 72%; top: 14%; width: 140px; height: 140px; border-radius: 50%; overflow: hidden; border: 8px solid #307FE2; box-sizing: border-box; padding: 16px; background-color: #FFF; transition: all 1s; transform: scale(0); transition-delay: 1.2s; } .auto-mechine-cont .auto-right .auto-bigimgshow .sm-img img { width: 100%; height: 100%; object-fit: cover; } .index-title { margin-bottom: 10px; } .index-title h2 { font-size: 4.2rem; color: #222; } .index-title .sub-tt { font-size: 1.6rem; color: #aaa; } @keyframes fd { form { opacity: 1; width: 10px; height: 10px; } to { opacity: 0; width: 60px; height: 60px; } } .index-about-grid { background: url("../images/index-about-bg.png") no-repeat 50% 100%; background-size: cover; padding: 0 0 200px; } .index-about-grid .about-cont { display: flex; } .index-about-grid .about-cont .about-left { width: 55%; } .index-about-grid .about-cont .about-left .text { color: #aaa; font-size: 1.6rem; line-height: 1.875; } .index-about-grid .about-cont .about-right { width: 45%; text-align: right; margin-top: 120px; } .index-about-grid .about-cont .about-right .animated .area-box .text.t-left .line, .index-about-grid .about-cont .about-right .animated .area-box .text.t-right .line { width: 46px; opacity: 1; } .index-about-grid .about-cont .about-right .animated .area-box .text p { opacity: 1; transition-delay: 1s; } .index-about-grid .about-cont .about-right .animated .area-box .text.t-bot .line { height: 47px; opacity: 1; } .index-about-grid .about-cont .about-right .imgshow { transition: all 0.5s; transform: translateY(10%) scale(1.05); position: relative; max-width: 100%; display: inline-block; transition-duration: 1s; } .index-about-grid .about-cont .about-right .imgshow img { max-width: 100%; } .index-about-grid .about-cont .about-right .imgshow.animated { transform: translateY(0px) scale(1); } .index-about-grid .about-numlist { margin: 40px 0 50px; } .index-about-grid .about-numlist ul { display: flex; justify-content: space-between; } .index-about-grid .about-numlist .n-t { line-height: 1; color: #307FE2; display: flex; align-items: flex-start; font-size: 6rem; } .index-about-grid .about-numlist .n-t sub { font-size: 1.6rem; } .index-about-grid .about-numlist .n-p { margin-top: 8px; color: #aaa; font-size: 1.6rem; } .index-about-grid .about-video { margin: 55px 0 0; max-width: 517px; position: relative; height: 0; overflow: hidden; transition: all 1s; transition-delay: 0.5s; } .index-about-grid .about-video .img-box { padding-bottom: 56.28627%; } .index-about-grid .about-video.animated { height: 290px; } .index-about-grid .about-video:hover .icon { top: 51%; } .index-about-grid .about-video .icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: url("../images/play.png") no-repeat; width: 55px; height: 55px; z-index: 2; cursor: pointer; transition: all 0.4s; } .index-about-grid .area-box .dot { width: 10px; height: 10px; border-radius: 50%; background-color: #307FE2; position: relative; } .index-about-grid .area-box .dot:after { content: ''; position: absolute; width: 10px; height: 10px; border-radius: 50%; background-color: rgba(48, 127, 226, 0.2); left: 50%; top: 50%; box-sizing: border-box; transform: translate(-50%, -50%); border: 1px solid rgba(48, 127, 226, 0.5); animation: fd 3s infinite; } .index-about-grid .area-box .dot:before { content: ''; position: absolute; width: 10px; height: 10px; border-radius: 50%; background-color: rgba(48, 127, 226, 0.2); left: 50%; top: 50%; box-sizing: border-box; transform: translate(-50%, -50%); border: 1px solid rgba(48, 127, 226, 0.5); animation: fd 3s 1s infinite; } .index-about-grid .area-box li { position: absolute; left: 15%; top: 15%; z-index: 2; } .index-about-grid .area-box .text { position: absolute; left: 0; display: flex; align-items: center; top: 50%; transform: translateY(-50%); } .index-about-grid .area-box .text.t-left { left: auto; right: 0; flex-direction: row-reverse; } .index-about-grid .area-box .text.t-left .line:after { right: auto; left: 0; margin-left: -10px; margin-right: 0; } .index-about-grid .area-box .text.t-left p { padding-left: 0; padding-right: 20px; } .index-about-grid .area-box .text.t-bot { top: 100%; flex-direction: column; left: 50%; transform: translateX(-50%); } .index-about-grid .area-box .text.t-bot .line { height: 0px; width: 2px; } .index-about-grid .area-box .text.t-bot .line:after { right: 50%; margin-bottom: -10px; top: 100%; margin-right: -5px; } .index-about-grid .area-box .text.t-bot p { padding-left: 0; padding-right: 0px; padding-top: 10px; } .index-about-grid .area-box .text p { padding-left: 20px; color: #777; font-size: 1.4rem; white-space: nowrap; opacity: 0; transition: all 0.3s; } .index-about-grid .area-box .text .line { width: 46px; height: 2px; background-color: #307FE2; position: relative; transition: all 1s; width: 0; opacity: 0; } .index-about-grid .area-box .text .line:after { content: ''; position: absolute; right: 0; width: 10px; height: 10px; border: 2px solid #307FE2; border-radius: 50%; background-color: #FFF; box-sizing: border-box; top: 50%; margin: -5px -10px 0 0; } .see-more { display: inline-block; padding: 16px 28px; line-height: 1; position: relative; border-radius: 35px; overflow: hidden; color: #307FE2; } .see-more.dark { color: #FFF; } .see-more.dark span { color: #FFF; } .see-more.dark:after { background-color: #16529c; } .see-more.dark:before { background-color: #307FE2; } .see-more .iconfont { margin-left: 60px; font-size: 1.8rem; position: relative; z-index: 3; transition: all 0.3s; } .see-more:hover:before { width: 100%; opacity: 1; } .see-more:hover span, .see-more:hover i { color: #FFF; } .see-more span { position: relative; z-index: 4; transition: all 0.3s; } .see-more:after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 100%; z-index: 1; background: #fff; transition: all 0.3s; } .see-more:before { content: ''; position: absolute; left: 50%; transform: translateX(-50%); top: 0; bottom: 0; width: 0%; z-index: 2; background: #16529c; transition: all 0.3s; opacity: 0; } .index-bot-grid { background: url("../images/index-bot-bg2.png") no-repeat 50% 50%; background-size: 100%; } .index-bot-grid .index-title { margin-bottom: 70px; } .index-bg { background: url("../images/footer-bg.png") no-repeat 50% 100%; background-size: 100%; } .application-swiper .swiper-slide { width: 322px; transition: all 0.5s; } .application-swiper .swiper-slide.line { background-color: #C9C9C9; opacity: 0.5; height: 100%; pointer-events: none; width: 1px; } .application-swiper .swiper-slide:nth-child(1) { margin-right: 60px !important; } .application-swiper .swiper-slide:nth-child(1):after { content: ''; position: absolute; right: -30px; top: 0px; height: 100%; width: 1px; background-color: #C9C9C9; opacity: 0.5; } .application-swiper .swiper-slide.cur { width: 720px; } .application-swiper .swiper-slide.cur .a-item .text { opacity: 0; visibility: hidden; } .application-swiper .swiper-slide.cur .a-item .h-text { opacity: 1; visibility: visible; transition-delay: 0.8s; } .application-swiper .imgshow { width: 720px; transform: translateX(-50%); left: 50%; position: relative; } .application-swiper .imgshow .img-box { padding-bottom: 74.58333%; } .application-swiper .a-item { height: 100%; position: relative; overflow: hidden; } .application-swiper .a-item .text { position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; justify-content: space-between; color: #FFF; font-weight: bold; z-index: 1; transition: all 0.4s; padding: 50px; background-image: linear-gradient(to bottom, transparent 0%, transparent 70%, rgba(0, 0, 0, 0.5) 100%); } .application-swiper .a-item .text h3 { font-size: 3rem; } .application-swiper .a-item .num { font-size: 3.6rem; } .application-swiper .a-item .h-text { position: absolute; width: 720px; left: 0; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; justify-content: space-between; color: #FFF; font-weight: bold; box-sizing: border-box; background-color: rgba(48, 127, 226, 0.8); z-index: 2; opacity: 0; visibility: visible; transition: all 0.4s; padding: 50px 12%; } .application-swiper .a-item .h-text h3 { font-size: 3rem; } .application-swiper .a-item .h-text .text-p { font-size: 1.6rem; line-height: 1.875; } .application-swiper .a-page { margin: 16px 0 0; position: relative; display: flex; align-items: center; justify-content: flex-end; } .application-swiper .a-page .swiper-pagination { position: relative; transform: translate(0); margin: 0; width: auto; bottom: 0; color: #666; } .application-swiper .a-page .swiper-pagination .swiper-pagination-current, .application-swiper .a-page .swiper-pagination i { color: #307FE2; font-size: 2.4rem; font-weight: bold; } .application-swiper .a-page .swiper-button-next { position: relative; background: none; height: auto; width: auto; margin: 0; top: 0; margin-left: 20px; } .application-swiper .a-page .swiper-button-next .iconfont { font-size: 2.4rem; color: #307FE2; } .index-panter-grid { padding: 15vh 0; } .index-panter-grid .index-title { text-align: center; } .index-panter-grid .animated .panter-swiper { transform: translateY(0px); opacity: 1; } .index-panter-grid .panter-swiper { transform: translateY(30px); transition: all 1s; opacity: 0; position: relative; } .index-panter-grid .panter-swiper .img-box { padding-bottom: 50%; } .index-panter-grid .panter-swiper .p-item { border: 1px solid #D2D2D2; transition: all 0.4s; } .index-panter-grid .panter-swiper .p-item:hover { transform: scale(1.05); } .index-panter-grid .panter-swiper .swiper-pagination { text-align: center; width: 100%; position: relative; margin: 7vh 0 0; } .index-panter-grid .panter-swiper .swiper-pagination .swiper-pagination-bullet { width: 20px; height: 27px; opacity: 1; border-radius: inherit; transition: all 0.6s; background: url("../images/index-p-icon.png") no-repeat; } .index-panter-grid .panter-swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: url("../images/index-p-icon2.png") no-repeat; } .news-list ul { margin: 0 -18px; } .news-list li { float: left; width: 33.33%; padding: 0 18px; box-sizing: border-box; } .news-list .img-box { padding-bottom: 56.25%; } .news-list .line { width: 60px; height: 2px; background: #307FE2; position: absolute; bottom: 0; left: 0; } .news-list .date { color: #307FE2; font-size: 1.4rem; font-weight: bold; background: url("../images/n-icon.png") no-repeat 0 50%; padding-left: 34px; margin: 0px 0 12px; } .news-list h3 { font-size: 2rem; font-weight: 500; margin-bottom: 12px; } .news-list h3 a { display: block; line-height: 1.5; height: 60px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: #222222; transition: all 0.3s; } .news-list h3 a:hover { color: #2C5DC1; } .news-list .text-p { color: #aaa; } .news-list .text-p p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .news-list .imgshow img { transition: all 0.7s linear; transform: scale(1); } .news-list .n-item { display: flex; flex-direction: column; } .news-list .n-item .text { display: flex; flex-direction: column; position: relative; padding: 25px 0 30px; } .news-list .n-item:hover .imgshow img { transform: scale(1.05); } .news-list .n-item dd .text { border-bottom: 1px solid #D7DCE3; padding: 20px 0; } .news-list .n-item dd .text p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: initial; line-height: 1.875; } .news-list .n-item dd .text h3 { margin-bottom: 16px; } .news-list .n-item dd:nth-child(1) .text { padding-top: 0; } .news-list .n-item dd:nth-child(2) .text { border-bottom: none; padding-bottom: 0; } .news-list .n-item .learn-more { color: #aaa; font-size: 1.4rem; display: block; margin-top: 10px; transition: all 0.3s; } .news-list .n-item .learn-more:hover { color: #2C5DC1; } .news-list li:nth-child(2) .n-item { flex-direction: column-reverse; } .news-list li:nth-child(2) .n-item .line { bottom: auto; top: 0; } .news-list li:nth-child(2) .n-item h3 { margin: 12px 0 0; } .news-list li:nth-child(2) .n-item .text { padding: 30px 0 25px; } .inner-title { text-align: center; margin: 10vh 0 5vh; } .inner-title h2 { color: #333; font-weight: bold; } .inner-title .line { width: 60px; height: 2px; background-color: #307FE2; margin: 10px auto 0; } .product-keylist { position: relative; } .product-keylist ul { margin: 0 -15px; } .product-keylist li { float: left; width: 33.33%; padding: 0 15px; box-sizing: border-box; } .product-keylist ul { display: flex; flex-wrap: wrap; } .product-keylist .img-box { padding-bottom: 64.93506%; } .product-keylist .imgshow { background: url("../images/pro-block-listbg1.png") no-repeat; background-size: cover; padding: 30px 0; } .product-keylist .k-item { box-shadow: 0px 10px 30px 0px rgba(174, 202, 229, 0.3); border-radius: 10px; overflow: hidden; display: block; transition: all 0.3s; background-color: #FFF; } .product-keylist .k-item:hover { transform: translateY(-10px); } .product-keylist .k-item:hover .text { background-color: #307FE2; } .product-keylist .k-item:hover .text h3 { color: #FFF; } .product-keylist h3 { text-align: center; font-size: 1.8rem; font-weight: 500; color: #333; } .product-keylist .text { transition: all 0.4s; background-color: #FFF; padding: 16px 0; } .pkey-btn { text-align: center; margin: 55px 0 0; } .projsj-list { position: relative; } .projsj-list .img-box { padding-bottom: 64.93506%; } .projsj-list h3 { text-align: center; font-size: 1.8rem; font-weight: 500; color: #333; } .projsj-list .text { transition: all 0.4s; background-color: rgba(48, 127, 226, 0.05); padding: 16px 0; } .projsj-list .j-item { background-color: #FFF; box-shadow: 0px 10px 30px 0px rgba(174, 202, 229, 0.3); border-radius: 10px; overflow: hidden; display: block; transition: all 0.3s; } .projsj-list .j-item:hover { transform: translateY(-10px); } .projsj-list .j-item:hover .text { background-color: #307FE2; } .projsj-list .j-item:hover .text h3 { color: #FFF; } .prochechuang-list ul { margin: 0 -15px; } .prochechuang-list li { float: left; width: 33.33%; padding: 0 15px; box-sizing: border-box; } .prochechuang-list ul { display: flex; flex-wrap: wrap; } .prochechuang-list .img-box { padding-bottom: 64.93506%; } .prochechuang-list .imgshow { background-color: #FFF; box-shadow: 0px 10px 30px 0px rgba(174, 202, 229, 0.3); border-radius: 10px; overflow: hidden; } .prochechuang-list .c-item { display: block; transition: all 0.3s; } .prochechuang-list .c-item:hover { transform: translateY(-10px); } .prochechuang-list h3 { font-size: 2.4rem; color: #333; font-weight: 500; padding: 36px 0 0; text-align: center; } .product-autolist { position: relative; } .product-autolist .img-box { padding-bottom: 64.93506%; } .product-autolist .imgshow { background: url("../images/proauto-list-bg.png") no-repeat; background-size: cover; padding: 50px 0; } .product-autolist .k-item { box-shadow: 0px 10px 30px 0px rgba(174, 202, 229, 0.3); border-radius: 10px; overflow: hidden; display: block; transition: all 0.3s; } .product-autolist .k-item:hover { transform: translateY(-10px); } .product-autolist .k-item:hover .text { background-color: #307FE2; } .product-autolist .k-item:hover .text h3 { color: #FFF; } .product-autolist h3 { text-align: center; font-size: 1.8rem; font-weight: 500; color: #333; } .product-autolist .text { transition: all 0.4s; background-color: #FFF; padding: 16px 0; } .product-jmlist ul { margin: 0 -15px; } .product-jmlist li { float: left; width: 33.33%; padding: 0 15px; box-sizing: border-box; } .product-jmlist ul { display: flex; flex-wrap: wrap; } .product-jmlist .img-box { padding-bottom: 64.93506%; } .product-jmlist .k-item { background: url("../images/pro-jm-bg.png") no-repeat; background-size: cover; box-shadow: 0px 10px 30px 0px rgba(174, 202, 229, 0.3); border-radius: 10px; overflow: hidden; display: block; transition: all 0.3s; } .product-jmlist .k-item:hover { transform: translateY(-10px); } .product-jmlist .k-item:hover h3 { color: #307FE2; } .product-jmlist h3 { text-align: center; font-size: 1.8rem; font-weight: 500; color: #333; transition: all 0.3s; } .product-jmlist .text { transition: all 0.4s; padding: 0px 0 36px; } .content-product { background: url("../images/projuhe-bg.png") no-repeat 50% 0%; background-size: cover; } .prohot-list { position: relative; } .prohot-list .swiper-button-next, .prohot-list .swiper-button-prev { background-image: none; background-color: rgba(48, 127, 226, 0.1); width: 40px; height: 40px; border-radius: 50%; margin-top: -20px; text-align: center; line-height: 40px; transition: all 0.4s; } .prohot-list .swiper-button-next .iconfont, .prohot-list .swiper-button-prev .iconfont { font-size: 1.8rem; color: #307FE2; transition: all 0.3s; } .prohot-list .swiper-button-next:hover, .prohot-list .swiper-button-prev:hover { background-color: rgba(48, 127, 226, 0.8); } .prohot-list .swiper-button-next:hover .iconfont, .prohot-list .swiper-button-prev:hover .iconfont { color: #fff; } .prohot-list .h-item { /*background: #EDF5FF url("../images/pro-hotbg.png") no-repeat;*/ display: block; height: 100%; display: flex; flex-direction: column; background-size: cover; } .prohot-list .swiper-slide { width: 576px; height: 326px; border-radius: 10px; overflow: hidden; } .prohot-list .swiper-slide-active .h-item { /*background: #DCECFF url("../images/pro-hotbg.png") no-repeat 50% 60%;*/ background-size: cover; } .prohot-list .imgshow { max-width: 400px; width: 100%; margin: 0 auto; } .prohot-list h3 { font-size: 1.8rem; text-align: center; color: #333; padding: 10px 0 0; } .prohot-list .img-box { padding-bottom: 64.93506%; } .pro-filter { background: #FFFFFF; border-radius: 10px; padding: 40px 40px 20px; margin: 11vh 0 5.5vh; position: relative; z-index: 2; } .pro-filter .radio-box .layui-input-block { width: 100%; display: flex; flex-wrap: wrap; } .pro-filter .radio-box .layui-form-radio > i { display: none; } .pro-filter .radio-box .layui-form-radio { border: 1px solid rgba(48, 127, 226, 0.5); padding: 12px 2px; height: auto; line-height: 1; min-width: 9%; display: inline-block; margin-right: 1.11%; margin-top: 0; text-align: center; transition: all 0.3s; border-radius: 5px; margin-bottom: 20px; box-sizing: border-box; } .pro-filter .radio-box .layui-form-radio:hover, .pro-filter .radio-box .layui-form-radio:focus { color: #FFF; background-color: #307FE2; } .pro-filter .radio-box .layui-form-radio:hover div, .pro-filter .radio-box .layui-form-radio:focus div { color: #FFF; } .pro-filter .radio-box .layui-form-radio.layui-form-radioed { color: #FFF; background-color: #307FE2; } .pro-filter .radio-box .layui-form-radio:nth-of-type(10n) { margin-right: 0; } .pro-filter .f-line .layui-input-block { margin-left: 0; } .pro-filter .f-sort { background: #EAF0F7; border-radius: 5px; position: relative; cursor: pointer; color: #333; } .pro-filter .f-sort .layui-form-select .layui-input { background-color: transparent; border-radius: 5px; padding: 0 18px; height: 46px; } .pro-filter .f-sort .layui-form-select .layui-input::placeholder { color: #333333; } .pro-filter .f-sort .layui-form-select .layui-edge { width: 9px; height: 22px; background: url("../images/s-arrow.png") no-repeat; padding: 0; border: none; margin-top: -11px; } .pro-filter .f-sort .layui-form-selected .layui-edge { transform: rotate(0); } .pro-filter .f-flex { display: flex; } .pro-filter .f-flex .f-sort { width: 12.5%; box-sizing: border-box; margin-right: 1.5%; } .pro-filter .f-input { width: 58%; position: relative; } .pro-filter .f-input input { width: 100%; box-sizing: border-box; padding: 5px; height: 100%; background: #EAF0F7; border-radius: 5px; border: none; color: #333; } .pro-filter .f-input button { position: absolute; right: 5px; box-shadow: none; border: none; color: #FFF; background-color: #307FE2; border-radius: 18px; min-width: 120px; text-align: center; padding: 0 20px; box-sizing: border-box; top: 5px; bottom: 5px; transition: all 0.4s; } .pro-filter .f-input button:hover { background-color: rgba(48, 127, 226, 0.8); } .content-product-list { background: url("../images/pro-list-bg.jpg") no-repeat 50% 0; } .content-product-list .product-keylist li { margin-bottom: 28px; } .prodetail-info { display: flex; flex-wrap: wrap; } .prodetail-info .imgshow { background-color: #D9E2ED; box-sizing: border-box; padding: 40px; border-radius: 10px; width: 48%; flex-shrink: 0; } .prodetail-info .imgshow .img-box { padding-bottom: 64.93506%; } .prodetail-info .text { width: 52%; box-sizing: border-box; padding-left: 5%; color: #666; } .prodetail-info .text h3 { font-size: 3rem; color: #333; font-weight: bold; margin-bottom: 30px; line-height: 1; } .prodetail-info .text .text-p { line-height: 1.875; } .prodetail-info .text .text-p i { color: #307FE2; } .prodetail-download { padding: 5vh 0; } .prodetail-download .d-left { float: left; max-width: 48%; } .prodetail-download .d-right { float: right; max-width: 48%; } .prodetail-download h3 { font-weight: 400; color: #333; margin-bottom: 12px; } .prodetail-download li a { color: #307FE2; display: block; font-size: 1.4rem; padding: 4px 0; border-bottom: 1px solid rgba(184, 203, 209, 0.5); transition: all 0.4s; } .prodetail-download li a:hover { color: #333; } .prodetail-download li:nth-last-child(1) a { border-bottom: none; } .prodetail-download .d-btn a { display: inline-block; border: 1px solid #AAAAAA; border-radius: 30px; line-height: 1; padding: 18px 47px 18px 53px; font-size: 2.4rem; color: #333; margin-left: 36px; transition: all 0.4s; } .prodetail-download .d-btn a:hover { background-color: #307FE2; border-color: #307FE2; color: #fff; } .prodetail-download .d-btn .iconfont { font-size: 2.4rem; margin-right: 10px; } .prodetail-download .online-buy { text-align: right; font-size: 1.6rem; display: block; color: #666; margin-bottom: 36px; transition: all 0.3s; } .prodetail-download .online-buy:hover { color: #FF6403; } .prodetail-download .online-buy .icon { display: inline-block; width: 42px; height: 42px; background-color: #FF6403; text-align: center; border-radius: 50%; box-sizing: border-box; padding-top: 8px; margin-left: 28px; } .prodetail-text { margin: 12vh 0 0; } .prodetail-text h3 { font-size: 3rem; color: #333; margin-bottom: 22px; } .prodetail-text h4 { font-size: 2.4rem; color: #333; line-height: 1.75; margin-bottom: 45px; } .prodetail-text h4 span { display: block; } .prodetail-text .text { color: #666; line-height: 2.1; } .prodetail-text .text p { display: flex; } .prodetail-text .text i { color: #307FE2; padding-right: 3px; } .prodetail-text .text img { display: block; max-width: 100%; height: auto; } .pd-text1 .t-left { float: left; width: 48%; } .pd-text1 .t-right { float: right; width: 50%; } .pd-text2 { padding-right: 50px; } .pd-text2 .t-left { float: left; width: 57.6%; } .pd-text2 .t-right { float: right; width: 39.4%; } .pd-text2 .t-bot { margin-top: 20px; } .pd-imglist { margin: 40px 0 0; } .pd-imglist ul { display: flex; flex-wrap: wrap; justify-content: center; } .pd-imglist li { margin-bottom: 28px; } .pd-imglist .img-box { padding-bottom: 61.0951%; } .pd-imglist ul { margin: 0 -14px; } .pd-imglist li { float: left; width: 25%; padding: 0 14px; box-sizing: border-box; } .pd-text4 .t-left { float: left; width: 61%; } .pd-text4 .t-right { float: right; width: 35%; } .pd-text5 .pd-logo { margin-bottom: 36px; } .pd-text5 .t-left { float: left; width: 52%; } .pd-text5 .t-right { float: right; width: 44%; display: flex; flex-wrap: wrap; justify-content: space-between; } .pd-text5 .t-right .imgshow { width: 49%; } .pd-text5 .t-right .img-box { padding-bottom: 66.11842%; } .text6-list .img-box { padding-bottom: 83.33333%; } .text6-list ul { margin: 0 -15px; } .text6-list li { float: left; width: 33.33%; padding: 0 15px; box-sizing: border-box; } .text6-list .t-item { background-color: #FFF; } .pd-text7 .t-left { float: left; width: 35%; } .pd-text7 .t-right { float: right; width: 62.5%; } .pd-text7 .t-right .img-box { padding-bottom: 107.30594%; } .pd-text7 .t-right ul { margin: 0 -16px; } .pd-text7 .t-right li { float: left; width: 50%; padding: 0 16px; box-sizing: border-box; } .pd-text7 h4 { line-height: 1.5; margin-bottom: 32px; } .ptext8-list { margin: 30px 0; } .ptext8-list ul { display: flex; flex-wrap: wrap; } .ptext8-list .img-box { padding-bottom: 90.10601%; } .ptext8-list ul { margin: 0 -3px; } .ptext8-list li { float: left; width: 20%; padding: 0 3px; box-sizing: border-box; } .ptext8-list .p-item { text-align: center; } .ptext8-list .p-item h5 { font-weight: 500; color: #333; padding: 12px 0; } .pd-text8 h4 { margin-bottom: 8px; } .prodetail-other { margin: 11vh 0 0; padding-bottom: 10vh; border-bottom: 1px solid #307FE2; } .prodetail-other ul { margin: 0 -85px; } .prodetail-other li { float: left; width: 33.33%; padding: 0 85px; box-sizing: border-box; } .prodetail-other ul { justify-content: center; display: flex; flex-wrap: wrap; } .prodetail-other ul li { margin-bottom: 16px; text-align: center; } .prodetail-other ul li:nth-child(1) { margin-top: -16px; } .prodetail-other ul li:nth-child(2) { margin-top: -42px; } .prodetail-other .t-item { width: 300px; display: inline-block; text-align: left; } .prodetail-other h3 { background-color: #307FE2; font-size: 2.4rem; font-weight: 500; color: #fff; text-align: center; border-radius: 30px; padding: 12px 0; margin-bottom: 12px; box-sizing: border-box; } .prodetail-other .text { color: #6A96C8; font-size: 1.8rem; } .prodetail-table .t-unit { color: #307FE2; } .prodetail-table h3 { font-size: 3rem; color: #333; margin: 8vh 0 32px; text-align: center; } .prodetail-table .table-left { float: left; width: 48%; } .prodetail-table .table-right { float: right; width: 48%; } .prodetail-table h4 { color: #333; font-size: 1.8rem; margin: 40px 0 20px; } .prodetail-table .table-cont { padding: 1px 0; } .prodetail-table .table-cont .table-left { width: 48%; float: left; } .prodetail-table .table-cont .table-right { width: 48%; float: right; } .prodetail-table .p-table { border-radius: 8px; border: 1px solid rgba(184, 203, 209, 0.5); overflow: hidden; } .prodetail-table .p-table table { width: 100%; } .prodetail-table .p-table th, .prodetail-table .p-table td { padding-top: 12px; padding-bottom: 12px; border-right: 1px solid rgba(184, 203, 209, 0.5); border-bottom: 1px solid rgba(184, 203, 209, 0.5); text-align: center; } .prodetail-table .p-table th:nth-last-child(1), .prodetail-table .p-table td:nth-last-child(1) { border-right: none; } .prodetail-table .p-table tr td:nth-child(1) { background-color: #eaf2fa; padding: 0 34px; text-align: left; color: #444; } .prodetail-table .p-table tr:nth-last-child(1) td { border-bottom: none; } .prodetail-table .p-table th { background-color: #eaf2fa; font-size: 1.8rem; font-weight: 500; color: #333; } .prodetail-table .p-table th:nth-child(1) { width: 45%; padding: 0 34px; text-align: left; } .prodetail-table .p-table th:nth-child(2) { width: 80px; } .prodetail-table .p-table td { font-size: 1.4rem; color: #888; min-width: 100px; } .content-product-detail { background: url("../images/prodetail-bg.png") no-repeat 50% 0%; background-size: 100%; } .content-news .news-cont { margin: 7vh 0 0; } .content-news .ncontnet-left { float: left; width: 14%; background-color: #F7F7F7; border: 1px solid #EBEBEB; box-sizing: border-box; } .content-news .ncontnet-left .news-leftt h2 { font-size: 2.4rem; font-weight: 500; text-align: center; background: url("../images/news-tt.jpg") no-repeat; color: #FFF; padding: 28px 0; background-size: cover; } .content-news .ncontnet-left li a { color: #333; font-weight: 500; font-size: 1.8rem; display: block; padding: 25px 20px; display: flex; align-items: center; justify-content: space-between; position: relative; } .content-news .ncontnet-left li a:after { content: ''; position: absolute; left: 0; width: 5px; height: 100%; background-color: #307FE2; top: 0; opacity: 0; } .content-news .ncontnet-left li.cur { background-color: rgba(0, 90, 183, 0.1); } .content-news .ncontnet-left li.cur a { color: #307FE2; } .content-news .ncontnet-left li.cur a:after { opacity: 1; } .content-news .ncontnet-left li .iconfont { font-size: 1.6rem; } .content-news .ncontnet-right { float: right; width: 80%; } .news-filter { display: flex; justify-content: space-between; margin-bottom: 32px; } .news-filter .f-input { width: calc(100% - 186px); position: relative; } .news-filter .f-input input { width: 100%; border-radius: 5px; border: 1px solid rgba(119, 119, 119, 0.3); height: 52px; box-sizing: border-box; padding: 0 25px; } .news-filter .f-input input::placeholder { color: #999; font-size: 1.6rem; } .news-filter .f-input button { position: absolute; right: 0; top: 0; height: 100%; background: #307FE2 url("../images/n-sousuo.png") no-repeat 50% 50%; width: 177px; border-radius: 5px; border: none; transition: all 0.3s; } .news-filter .f-input button:hover { background-color: #005AB7; } .news-filter .f-date { flex-shrink: 0; } .news-filter .f-date .layui-input { width: 166px; border-radius: 5px; border: 1px solid rgba(119, 119, 119, 0.3); height: 52px; box-sizing: border-box; padding: 0 18px; background-position: 90% 50%; background-repeat: no-repeat; background-image: url("../images/rili.png"); } .news-filter .f-date .layui-input::placeholder { color: #999; font-size: 1.6rem; } .newsny-list .img-box { padding-bottom: 71.42857%; } .newsny-list .imgshow { width: 21%; flex-shrink: 0; position: relative; overflow: hidden; } .newsny-list .imgshow img { transition: all 0.3s; } .newsny-list .date { position: absolute; left: 0; bottom: 0; z-index: 2; background-color: rgba(0, 0, 0, 0.5); color: #FFF; font-weight: bold; font-size: 1.4rem; padding: 7px; line-height: 1; } .newsny-list .date em { display: block; font-size: 2.4rem; text-align: center; margin: 0 0 6px; } .newsny-list .text { width: 79%; box-sizing: border-box; padding: 0 5%; display: flex; flex-direction: column; justify-content: center; } .newsny-list .n-item { display: flex; flex-wrap: wrap; box-shadow: 0px 2px 8px 0px rgba(52, 52, 52, 0.13); background-color: #fafafa; transition: all 0.3s; } .newsny-list .n-item:hover { background-color: rgba(48, 127, 226, 0.1); } .newsny-list .n-item:hover .imgshow img { transform: scale(1.085); } .newsny-list .n-item h3 { font-size: 1.8rem; font-weight: 500; color: #333; } .newsny-list .n-item .text-p { font-size: 1.4rem; color: #797979; line-height: 2; margin: 10px 0 24px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .newsny-list .n-item .see-detail { color: #797979; font-size: 1.4rem; } .newsny-list li { margin-bottom: 30px; } .content-news-detail .nd-top { padding-top: 60px; max-width: 66%; } .content-news-detail .nd-top .n-tt { padding: 0 20px; } .content-news-detail .nd-top .n-tt h3 { font-weight: 400; color: #333; } .content-news-detail .nd-top .sub-tt { padding: 24px 0 18px; color: #AAAAAA; font-size: 1.4rem; } .content-news-detail .nd-top .sub-tt span { display: inline-block; margin-right: 30px; } .content-news-detail .nd-left { float: left; width: 66%; border-top: 1px solid rgba(0, 0, 0, 0.2); padding-top: 30px; } .content-news-detail .nd-left .text { font-size: 1.6rem; color: #666; line-height: 1.875; } .content-news-detail .nd-left .text img { display: block; margin: 0 auto; max-width: 100%; height: auto; } .content-news-detail .nd-page { margin-top: 9vh; border-top: 1px solid rgba(32, 32, 32, 0.2); padding: 36px 0; } .content-news-detail .nd-page a { display: inline-block; color: #606060; font-size: 1.4rem; transition: all 0.3s; padding: 5px 0; } .content-news-detail .nd-page a:hover { text-decoration: underline; color: #307FE2; } .content-news-detail .nd-right { width: 29%; float: right; position: sticky; top: 0; } .content-news-detail .nd-tjnews .n-tt { border-top: 1px solid rgba(0, 0, 0, 0.2); padding: 30px 0; } .content-news-detail .nd-tjnews .n-tt h3 { font-size: 1.8rem; font-weight: 400; display: flex; align-items: center; } .content-news-detail .nd-tjnews .n-tt .iconfont { margin-right: 10px; font-size: 2.4rem; font-weight: bold; color: #367BC1; } .content-news-detail .nd-tjnews .img-box { padding-bottom: 56.25%; } .content-news-detail .nd-tjnews .one { margin-bottom: 4px; } .content-news-detail .nd-tjnews .one h4 { margin-bottom: 10px; color: #666; } .content-news-detail .nd-tjnews .n-item { display: block; padding: 20px 0; border-top: 1px solid rgba(0, 0, 0, 0.2); } .content-news-detail .nd-tjnews .nt-item { display: flex; align-items: center; border-top: 1px solid rgba(0, 0, 0, 0.2); padding: 20px 0; } .content-news-detail .nd-tjnews .nt-item:hover h5 { color: #307FE2; } .content-news-detail .nd-tjnews .nt-item:hover .date { color: #FFF; background-color: #307FE2; } .content-news-detail .nd-tjnews .nt-item h5 { color: #666; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: all 0.4s; font-weight: 400; } .content-news-detail .nd-tjnews .nt-item .text { width: calc(100% - 85px); box-sizing: border-box; padding-left: 20px; height: 48px; } .content-news-detail .nd-tjnews .nt-item .date { transition: all 0.4s; background-color: #EEEEEE; width: 65px; height: 65px; box-sizing: border-box; border-radius: 5px; font-size: 1.4rem; text-align: center; display: flex; align-items: center; justify-content: center; flex-direction: column; } .content-news-detail .nd-tjnews .nt-item .date em { font-weight: 400; display: block; font-size: 1.8rem; } .appny-list ul { display: flex; flex-wrap: wrap; justify-content: space-around; } .appny-list ul { margin: 0 -24px; } .appny-list li { float: left; width: 33.33%; padding: 0 24px; box-sizing: border-box; } .appny-list .img-box { padding-bottom: 94.44444%; } .appny-list li { margin-bottom: 48px; } .appny-list li .img-box { padding-bottom: 61.15108%; } .appny-list.w2 ul { margin: 0 -24px; } .appny-list.w2 li { float: left; width: 50%; padding: 0 24px; box-sizing: border-box; } .appny-list .a-item { border-radius: 5px; display: block; overflow: hidden; border: 1px solid #BFBFBF; background-color: #FFFFFF; transition: all 0.4s; } .appny-list .a-item h3 { font-size: 2.4rem; font-weight: 500; color: #333; } .appny-list .a-item:hover { background-color: #307FE2; } .appny-list .a-item:hover h3 { color: #FFF; } .appny-list .a-item .text { padding: 32px; text-align: center; } .appny-info { margin-top: 11vh; } .appny-info .imgshow { float: right; width: 50%; } .appny-info .imgshow .img-box { padding-bottom: 72.31947%; } .appny-info .text { float: left; width: 50%; color: #333; } .appny-info .text h3 { margin: 0 0 12px; } .appny-info .text h4 { font-size: 1.8rem; font-weight: 500; } .appny-info .a-btns { margin: 8vh 0 0; } .appny-info .a-btns dd { margin-bottom: 30px; } .appny-info .a-btns a { flex-shrink: 0; width: auto; display: inline-block; border-radius: 25px; background-color: #FFF; color: #307FE2; font-size: 1.8rem; padding: 14px 40px; line-height: 1; transition: all 0.3s; } .appny-info .a-btns a .iconfont { font-size: 2.2rem; margin-right: 18px; } .appny-info .a-btns a:hover { background-color: #307FE2; color: #FFF; } .appdetail-case .text { font-size: 2.4rem; text-align: center; font-weight: bold; color: #333; margin: 0 0 28px; } .appdetail-case .ac-top .imgshow { position: relative; } .appdetail-case .ac-top .imgshow .img-box { padding-bottom: 56.25%; } .appdetail-case .ac-top .imgshow .text-p { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; background: linear-gradient(90deg, rgba(48, 127, 226, 0) 0%, rgba(48, 127, 226, 0.99) 46%, rgba(48, 127, 226, 0) 100%); text-align: center; color: #FFF; padding: 20px 0; } .appdetail-case .ac-bot { padding: 9vh 0 0; } .appdetail-case .ac-bot .imgshow { border: 1px solid #BFBFBF; border-radius: 10px; overflow: hidden; display: flex; align-items: center; background-color: #FFF; } .appdetail-case .ac-bot .imgshow .c-left { width: 55%; flex-shrink: 0; } .appdetail-case .ac-bot .imgshow .c-left .img-box { padding-bottom: 59.49367%; } .appdetail-case .ac-bot .imgshow .c-right { width: 45%; } .appdetail-case .ac-bot .imgshow .c-right .img-box { padding-bottom: 72.86822%; } .appcase-list .sub-tt { text-align: center; font-size: 2.4rem; font-weight: bold; color: #333; margin: 0 0 30px; } .appcase-list ul { display: flex; flex-wrap: wrap; } .appcase-list ul li { margin-bottom: 40px; } .appcase-list ul { margin: 0 -20px; } .appcase-list li { float: left; width: 50%; padding: 0 20px; box-sizing: border-box; } .appcase-list .img-box { padding-bottom: 67.14286%; } .appcase-list .c-item { background-color: #307FE2; border-radius: 10px; overflow: hidden; display: block; } .appcase-list .c-item h3 { text-align: center; color: #fff; font-size: 2.4rem; font-weight: 500; padding: 32px 0; } .case-hezuo { background-color: rgba(48, 127, 226, 0.08); padding: 1px 45px; margin: 12vh 0 0; } .case-hezuo .inner-title { position: relative; margin: 60px 0; text-align: left; } .case-hezuo .inner-title .line { margin-left: 0; } .case-hezuo .inner-title .slot-right { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .case-hezuo .inner-title .slot-right a { display: inline-block; background-color: #307FE2; color: #FFF; border-radius: 25px; padding: 12px 52px; transition: all 0.3s; } .case-hezuo .inner-title .slot-right a:hover { background-color: #005AB7; } .case-hezuo .swiper-slide { background-color: #FFF; border-radius: 10px; overflow: hidden; box-sizing: border-box; padding: 6px; } .case-hezuo .img-box { padding-bottom: 41.00418%; } .case-hezuo .hz-swiper { position: relative; } .case-hezuo .swiper-pagination { position: initial; margin: 55px 0; } .case-hezuo .swiper-pagination .swiper-pagination-bullet { width: 14px; height: 14px; border: 1px solid #307FE2; border-radius: 50%; box-sizing: border-box; margin: 0 6px; background-color: transparent; opacity: 1; } .case-hezuo .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #307FE2; } .content-application-detail { background: url("../images/app-detail-bg.jpg") no-repeat 50% 0%; } .about-info { padding-right: calc((100% - 1440px)/2); padding-left: 8%; box-sizing: border-box; } .about-info .imgshow { float: left; width: 45%; } .about-info .imgshow .img-box { padding-bottom: 69.16427%; } .about-info .text { float: right; width: 51%; font-size: 1.8rem; line-height: 2; color: #333; } .content-about .about-numlist { margin: 7vh 0 0; } .content-about .about-numlist ul { display: flex; } .content-about .about-numlist ul li { width: 50%; flex-shrink: 0; text-align: center; } .content-about .about-numlist ul li em { font-size: 4.8rem; font-weight: bold; } .content-about .about-numlist ul li .n-t { font-size: 2.4rem; font-weight: bold; color: #307FE2; line-height: 1; } .content-about .about-numlist ul li p { color: #333; font-size: 1.8rem; margin-top: 8px; } .about-ldlist .img-box { padding-bottom: 33.76623%; } .about-ldlist .d-item { position: relative; border-radius: 10px; overflow: hidden; } .about-ldlist .d-item .text { transition: all 0.4s; position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; } .about-ldlist .d-item .text h3 { font-weight: bold; color: #fff; font-size: 3rem; } .about-ldlist .d-item .text .icon { display: inline-block; margin-bottom: 12px; } .about-ldlist .d-item .text .icon img { width: 43px; height: 43px; object-fit: cover; } .about-ldlist .swiper-slide-thumb-active .text { background-color: rgba(48, 127, 226, 0.8); } .about-ldlist-text { margin: 8vh 0 0; } .about-ldlist-text .d-text { color: #333; font-size: 1.6rem; } .about-ldlist-text .d-text h4 { font-size: 1.8rem; } .about-ldlist-text .d-text p { line-height: 2.1; } .about-childcom { padding: 17vh 0 5vh; } .about-childcom .imgshow { float: left; width: 58%; } .about-childcom .imgshow .img-box { padding-bottom: 57.5%; } .about-childcom .text { width: 42%; float: left; box-sizing: border-box; z-index: 2; position: relative; } .about-childcom .text .inner-title { padding-left: 50px; margin: 0; text-align: left; } .about-childcom .text .inner-title .line { margin-left: 0; } .about-childcom .about-swiper-text { margin-left: -90px; color: #666; padding: 40px 50px; background-color: #FFF; } .about-childcom .about-swiper-text h4 { font-size: 2.4rem; color: #333; font-weight: 400; margin-bottom: 20px; } .about-childcom .about-swiper-text p { line-height: 1.875; } .about-childcom .about-page { position: relative; display: flex; margin: 34px 0; padding-left: 50px; } .about-childcom .about-page .swiper-button-prev, .about-childcom .about-page .swiper-button-next { position: relative; margin: 0; left: auto; right: auto; width: 46px; height: 46px; border-radius: 50%; border: 1px solid #BBBBBB; border-radius: 50%; box-sizing: border-box; background-image: none; text-align: center; line-height: 46px; margin-right: 30px; color: #BBBBBB; transition: all 0.4s; } .about-childcom .about-page .swiper-button-prev .iconfont, .about-childcom .about-page .swiper-button-next .iconfont { font-size: 3rem; } .about-childcom .about-page .swiper-button-prev:hover, .about-childcom .about-page .swiper-button-next:hover { background-color: #307FE2; border-color: #307FE2; color: #fff; } .about-hyear { position: relative; padding: 12px 80px 0; } .about-hyear .old-y { position: absolute; left: 0; top: 0; } .about-hyear .news-y { position: absolute; right: 0; top: 0; } .about-hyear .old-y, .about-hyear .news-y { transition: all 0.4s; line-height: 1; cursor: pointer; } .about-hyear .old-y .iconfont, .about-hyear .news-y .iconfont { display: block; font-size: 3.6rem; color: #A8A8A8; transition: all 0.4s; } .about-hyear .old-y span, .about-hyear .news-y span { display: inline-block; color: #919191; margin-top: 6px; } .about-hyear .old-y:hover span, .about-hyear .old-y:hover .iconfont, .about-hyear .news-y:hover span, .about-hyear .news-y:hover .iconfont { color: #333; } .about-hyear .old-y:hover span, .about-hyear .news-y:hover span { text-decoration: underline; } .about-honor .year-swiper { margin: 0 0 11vh; text-align: center; position: relative; } .about-honor .year-swiper .swiper-slide { font-size: 2.4rem; font-weight: 400; opacity: 0.5; color: #307FE2; line-height: 30px; cursor: pointer; } .about-honor .year-swiper .swiper-slide.swiper-slide-active { font-size: 3rem; opacity: 1; } .about-honor .year-swiper .swiper-button-next, .about-honor .year-swiper .swiper-button-prev { background-image: none; height: 36px; margin-top: -18px; } .about-honor .year-swiper .swiper-button-next .iconfont, .about-honor .year-swiper .swiper-button-prev .iconfont { font-size: 2.4rem; color: #898989; font-weight: bold; transition: all 0.3s; } .about-honor .year-swiper .swiper-button-next:hover, .about-honor .year-swiper .swiper-button-prev:hover { color: #307FE2; } .about-honor-swiper { position: relative; } .about-honor-swiper .img-box { padding-bottom: 72%; } .about-honor-swiper .swiper-slide { width: 500px; height: auto; } .about-honor-swiper .swiper-slide.swiper-slide-active { opacity: 1; font-size: 3rem; } .about-honor-swiper .swiper-slide.swiper-slide-active .text { opacity: 1; visibility: visible; } .about-honor-swiper .swiper-button-next, .about-honor-swiper .swiper-button-prev { background-image: none; height: 40px; width: 40px; border-radius: 50%; top: 210px; text-align: center; line-height: 40px; background-color: #FFF; transition: all 0.3s; } .about-honor-swiper .swiper-button-next .iconfont, .about-honor-swiper .swiper-button-prev .iconfont { font-size: 2.4rem; color: rgba(48, 127, 226, 0.4); font-weight: bold; transition: all 0.3s; } .about-honor-swiper .swiper-button-next:hover, .about-honor-swiper .swiper-button-prev:hover { color: #307FE2; background-color: #307FE2; } .about-honor-swiper .swiper-button-next:hover .iconfont, .about-honor-swiper .swiper-button-prev:hover .iconfont { color: #fff; } .about-honor-swiper .text { transition: all 0.5s; opacity: 0; visibility: hidden; padding: 36px 25%; } .about-honor-swiper .text h3 { font-size: 2.4rem; font-weight: 500; color: #333; margin-bottom: 12px; } .about-honor-swiper .text p { color: #666; font-size: 1.4rem; } .about-kehuhonor .swiper-wrapper { align-items: flex-end; } .about-kehuhonor .imgshow { text-align: center; overflow: hidden; } .about-kehuhonor .imgshow .img-box { padding-bottom: 132.82443%; } .about-kehuhonor .imgshow img { transition: all 0.3s; } .about-kehuhonor .img-bot { text-align: center; margin: 16px 0 0; height: 38px; display: flex; align-items: center; justify-content: center; } .about-kehuhonor .img-bot img { max-width: 245px; width: 100%; opacity: 0.6; transition: all 0.4s; } .about-kehuhonor h3 { color: #333; font-size: 1.4rem; text-align: center; font-weight: 500; transition: all 0.3s; height: 120px; } .about-kehuhonor .swiper-slide:hover .img-bot img { opacity: 1; max-width: 100%; } .about-kehuhonor .swiper-slide:hover .imgshow img { transform: scale(1.05); } .about-kehuhonor .swiper-slide:hover h3 { font-size: 2rem; } .about-kehuhonor .khzizhi-swiper { position: relative; padding: 0 100px; } .about-kehuhonor .khzizhi-swiper .swiper-button-next { right: 0; } .about-kehuhonor .khzizhi-swiper .swiper-button-prev { left: 0; } .about-kehuhonor .khzizhi-swiper .swiper-button-next, .about-kehuhonor .khzizhi-swiper .swiper-button-prev { background-image: none; height: 40px; width: 40px; border-radius: 50%; margin-top: -20px; text-align: center; line-height: 40px; background-color: #FFF; transition: all 0.3s; } .about-kehuhonor .khzizhi-swiper .swiper-button-next .iconfont, .about-kehuhonor .khzizhi-swiper .swiper-button-prev .iconfont { font-size: 2.4rem; color: rgba(48, 127, 226, 0.4); font-weight: bold; transition: all 0.3s; } .about-kehuhonor .khzizhi-swiper .swiper-button-next:hover, .about-kehuhonor .khzizhi-swiper .swiper-button-prev:hover { color: #307FE2; background-color: #307FE2; } .about-kehuhonor .khzizhi-swiper .swiper-button-next:hover .iconfont, .about-kehuhonor .khzizhi-swiper .swiper-button-prev:hover .iconfont { color: #fff; } .about-hezuo .inner-title { margin-top: 7vh; } .about-hezuo .hz-btn { text-align: center; padding: 6.5vh 0 0; } .about-hzlist ul { margin: 0 -20px; } .about-hzlist li { float: left; width: 25%; padding: 0 20px; box-sizing: border-box; } .about-hzlist .img-box { padding-bottom: 123.0303%; } .about-hzlist .imgshow { border-radius: 10px; overflow: hidden; } .about-hzlist .imgshow img { transition: all 0.4s; } .about-hzlist .text { color: #666; font-size: 1.8rem; margin-top: 28px; } .about-hzlist .a-item { display: flex; flex-direction: column; } .about-hzlist .a-item:hover .imgshow img { transform: scale(1.06); } .about-hzlist li:nth-child(2n) .a-item { flex-direction: column-reverse; align-content: space-between; } .about-hzlist li:nth-child(2n) .text { margin: 0 0 28px 0; } .devprocess-list { position: relative; } .devprocess-list:after { content: ''; position: absolute; top: 346px; height: 1px; width: 100%; background-color: #73818C; z-index: 1; margin-top: -16px; } .devprocess-list .year { font-size: 3rem; color: #333; background-position: 0 50%; background-repeat: no-repeat; background-image: url("../images/dev-date-d.png"); padding-left: 48px; } .devprocess-list .year small { font-size: 2.8rem; } .devprocess-list .img-box { padding-bottom: 66.56716%; } .devprocess-list .imgshow { border-radius: 10px; overflow: hidden; width: 100%; } .devprocess-list .d-con { display: flex; margin: 0 0 40px 0; padding-left: 48px; position: relative; } .devprocess-list .d-con .text { width: 80%; box-sizing: border-box; padding-left: 4%; font-size: 1.6rem; color: #666; position: absolute; left: 100%; top: 0; height: 100%; line-height: 1.875; } .devprocess-list li { width: 420px; flex-shrink: 0; display: flex; height: 100%; margin-right: 30px; padding-bottom: 330px; } .devprocess-list li:nth-last-child(1) { margin-right: 420px; } .devprocess-list li:nth-child(2n) { align-items: flex-end; margin-top: -45px; padding-top: 330px; padding-bottom: 0; } .devprocess-list li:nth-child(2n) .d-item { flex-direction: column; } .devprocess-list li:nth-child(2n) .d-con { top: auto; bottom: 0; margin: 60px 0 0; } .devprocess-list li:nth-child(2n) .dot { top: auto; bottom: 0; } .devprocess-list li:nth-child(2n) .line { top: auto; bottom: 0; } .devprocess-list .d-item { width: 100%; position: relative; height: 50%; display: flex; flex-direction: column-reverse; justify-content: space-between; } .devprocess-list .line { position: absolute; top: 3px; width: 1px; height: 90.5%; left: 11px; background-color: #73818C; } .devprocess-list .dot { position: absolute; top: 0; left: 6.5px; width: 10px; height: 10px; background: #73818C; border-radius: 50%; } .devprocess-list ul { display: flex; position: relative; z-index: 2; } .mCS-grey-thin > .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background: #307fe2 !important; height: 6px; } .mCS-grey-thin > .mCSB_scrollTools .mCSB_draggerRail { background: #9fb1c0 !important; height: 3px; } .about-devprocess { position: relative; margin-left: calc((100% - 1440px)/2); } .about-devprocess .mCSB_horizontal > .mCSB_scrollTools a + .mCSB_draggerContainer { margin: 0 !important; } .about-devprocess .tips-text { position: absolute; left: 0; bottom: 20px; font-size: 1.4rem; color: #999; display: flex; align-items: center; } .about-devprocess .tips-text .iconfont { width: 19px; height: 19px; background: #307FE2; border-radius: 50%; color: #FFF; line-height: 19px; text-align: center; font-size: 1.2rem; margin-left: 12px; } .about-devprocess .mCSB_horizontal > .mCSB_container { padding-bottom: 50px; } .wenhua-swiper .swiper-container { margin: 0 -23px; } .wenhua-swiper .swiper-slide { height: auto; } .wenhua-swiper .icon { width: 72px; margin: 0 auto; position: relative; z-index: 2; } .wenhua-swiper .icon .h-img { display: none; } .wenhua-swiper .text { position: relative; z-index: 2; font-size: 1.4rem; color: #666; line-height: 1.875; } .wenhua-swiper .text h3 { font-size: 2.4rem; font-weight: bold; text-align: center; color: #333; margin: 12px 0 12px; } .wenhua-swiper .w-item { background: #EDF6FF; box-shadow: 8px 13px 30px 0px rgba(14, 98, 145, 0.11); border-radius: 10px; overflow: hidden; transition: all 0.3s; padding: 50px 32px 32px; box-sizing: border-box; height: 100%; position: relative; } .wenhua-swiper .w-item:hover:after { opacity: 1; } .wenhua-swiper .w-item:hover .text { color: #FFF; } .wenhua-swiper .w-item:hover h3 { color: #fff; } .wenhua-swiper .w-item:hover .icon .d-img { display: none; } .wenhua-swiper .w-item:hover .icon .h-img { display: inline-block; } .wenhua-swiper .w-item:after { content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: url("../images/wh-li-bg.jpg") no-repeat; background-size: cover; z-index: 1; opacity: 0; transition: all 0.3s; } .wenhua-swiper .swiper-slide { padding: 20px 23px 30px; box-sizing: border-box; } .about-keyvalue { margin: 12vh 0 0; display: flex; flex-wrap: wrap; padding-right: calc((100% - 1440px)/2); padding-left: 5%; box-sizing: border-box; } .about-keyvalue .img-box { padding-bottom: 57.45614%; } .about-keyvalue .imgshow { width: 59%; } .about-keyvalue .text { width: 41%; box-sizing: border-box; padding-left: 7%; } .about-keyvalue .k-t { display: inline-block; border-bottom: 1px solid #9FB1C0; padding: 26px 0; padding-right: 120px; } .about-keyvalue .k-t h3 { font-size: 2rem; color: #7d7d7d; font-weight: bold; position: relative; } .about-keyvalue .k-t h3:after { content: ''; position: absolute; right: 100%; width: 0px; height: 1px; background: #9FB1C0; top: 50%; margin-right: 40px; transition: all 0.5s; } .about-keyvalue li { margin-bottom: 40px; } .about-keyvalue li:nth-last-child(1) .k-t { border-color: transparent; } .about-keyvalue .t-hide { display: none; } .about-keyvalue .cur h3, .about-keyvalue .act h3 { font-size: 3rem; color: #515151; } .about-keyvalue .cur h3:after, .about-keyvalue .act h3:after { width: 240px; } .about-keyvalue .cur .k-t, .about-keyvalue .act .k-t { border-color: transparent; } .about-keyvalue .cur .line, .about-keyvalue .act .line { width: 60px; height: 2px; background: #307FE2; margin: 18px 0; } .about-keyvalue .cur .t-hide { display: block; } .about-keyvalue .sub-tt { font-size: 1.6rem; color: #333; line-height: 1.8; margin-bottom: 24px; } .about-keyvalue .text-p p { font-size: 1.6rem; position: relative; margin-bottom: 20px; } .about-keyvalue .text-p p .icon { width: 6px; height: 6px; border-radius: 50%; background-color: #307FE2; display: inline-block; margin-right: 5px; vertical-align: middle; } .content-about { background: url("../images/about-bg.png") no-repeat 50% 0%; background-size: cover; } .news-focus { display: flex; flex-wrap: wrap; margin: 8vh 0 0; border-radius: 10px; overflow: hidden; background-color: #EAF2FD; } .news-focus .imgshow { width: 55.5%; } .news-focus .imgshow .img-box { padding-bottom: 52.67081%; } .news-focus .text { width: 44.5%; box-sizing: border-box; padding: 24px 5% 24px 3%; display: flex; flex-direction: column; justify-content: center; } .news-focus h3 { font-size: 2.4rem; font-weight: 500; } .news-focus h3 a { color: #333; } .news-focus .text-p { color: #777; line-height: 1.7; margin: 2vh 0 5vh; display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; } .news-focus .n-bot { display: flex; align-items: center; width: 100%; justify-content: space-between; } .news-focus .n-bot a { transition: all 0.4s; } .news-focus .n-bot a:hover { text-decoration: underline; color: #307FE2; } .news-overviewlist ul { display: flex; flex-wrap: wrap; } .news-overviewlist ul { margin: 0 -11px; } .news-overviewlist li { float: left; width: 33.33%; padding: 0 11px; box-sizing: border-box; } .news-overviewlist .img-box { padding-bottom: 53.23276%; } .news-overviewlist .n-item { border-radius: 10px; overflow: hidden; background: #FFFFFF; box-shadow: 0px 10px 30px 0px rgba(127, 149, 166, 0.15); } .news-overviewlist .text { padding: 32px 24px; border: 1px solid #EAEAEA; } .news-overviewlist .date { color: #999; } .news-overviewlist h3 { font-weight: 500; margin: 12px 0; } .news-overviewlist h3 a { color: #333; font-size: 2.4rem; } .news-overviewlist .text-p { color: #999; line-height: 1.875; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .news-overviewlist .oa-more { color: 333; display: block; margin-top: 30px; } .news-overviewlist li { margin-bottom: 22px; } .news-indlist { overflow: hidden; } .news-indlist ul { display: flex; flex-wrap: wrap; } .news-indlist ul { margin: 0 -23px; } .news-indlist li { float: left; width: 33.33%; padding: 0 23px; box-sizing: border-box; } .news-indlist .img-box { padding-bottom: 57.8125%; } .news-indlist .imgshow { border-radius: 10px; overflow: hidden; } .news-indlist .text { padding: 32px 24px; border: 1px solid #EAEAEA; } .news-indlist .date { color: #999; } .news-indlist h3 { font-weight: 500; margin: 0 0 12px; } .news-indlist h3 a { color: #333; font-size: 2.4rem; } .news-overviewbtn { text-align: center; margin: 7.5vh 0 0; } .about-research-list .imgshow { border-radius: 10px; overflow: hidden; width: 57.5%; flex-shrink: 0; } .about-research-list .imgshow .img-box { padding-bottom: 53.01932%; } .about-research-list .text { width: calc(42.5% + 95px); box-sizing: border-box; background-color: #FFF; box-sizing: border-box; padding: 0 55px; position: relative; border-radius: 10px; margin-right: -95px; } .about-research-list .t-cont { position: relative; padding: 32px 0; line-height: 2; box-sizing: border-box; height: 100%; display: flex; flex-direction: column; justify-content: center; } .about-research-list .r-item { display: flex; align-items: center; flex-direction: row-reverse; position: relative; } .about-research-list .r-item .num { line-height: 1; position: absolute; color: #307FE2; opacity: 0.1; font-weight: bold; pointer-events: none; left: 0; top: 0; font-size: 172px; } .about-research-list li { margin-bottom: 6vh; } .about-research-list li:nth-child(2n) .r-item { flex-direction: row; } .about-research-list li:nth-child(2n) .text { margin-right: 0; margin-left: -95px; } .research-result { display: flex; padding-top: 12vh; } .research-result .imgshow { width: 36%; } .research-result .text { width: 64%; box-sizing: border-box; padding-left: 5%; } .research-result .inner-title { text-align: left; margin-top: 0; } .research-result .inner-title .line { margin-left: 0; } .research-result .text-p { font-size: 1.8rem; line-height: 2; color: #333; } .research-app .text { font-size: 1.8rem; line-height: 2; color: #333; } .content-about-research { background: url("../images/research-bg.png") no-repeat 50% 100%; background-size: cover; padding-bottom: 12vh; } .join-info { text-align: center; color: #666; line-height: 1.75; } .join-gade { background-color: rgba(48, 127, 226, 0.1); padding: 7.7vh 0; margin: 50px 0 0; } .gade-cont { display: flex; align-items: center; } .gade-cont .imgshow { width: 39%; flex-shrink: 0; border-radius: 10px; overflow: hidden; } .gade-cont .imgshow .img-box { padding-bottom: 58.26087%; } .gade-cont .text { width: 61%; box-sizing: border-box; padding-left: 4%; } .gade-cont .text h3 { font-size: 2.8rem; font-weight: bold; color: #333; border-bottom: 1px solid rgba(153, 153, 153, 0.3); padding-bottom: 24px; margin-bottom: 24px; } .gade-cont .text .text-p { color: #888; line-height: 2.1; } .j-title { text-align: center; margin: 85px 0 50px; } .j-title h2 { font-size: 2.8rem; color: #333; } .join-team .img-box { padding-bottom: 30.99415%; } .join-team ul { margin: 0 -11px; } .join-team li { float: left; width: 25%; padding: 0 11px; box-sizing: border-box; } .join-team .t-item { border-radius: 10px; overflow: hidden; border: 1px solid #D2D2D2; height: 100%; background-color: #FFF; } .join-team ul { display: flex; flex-wrap: wrap; } .join-team .imgshow { position: relative; } .join-team .imgshow h3 { position: absolute; left: 0; right: 0; top: 0; bottom: 0; color: #FFF; display: flex; align-items: center; justify-content: center; font-size: 2.4rem; font-weight: blod; } .join-team .text { padding: 24px 34px; color: #888; font-size: 1.4rem; line-height: 1.8; } .jion-tabtt { text-align: center; margin: 11vh 0 6vh; } .jion-tabtt a { font-size: 2.8rem; color: rgba(51, 51, 51, 0.6); } .jion-tabtt a.cur { color: #333; } .jion-tabtt i { color: rgba(5, 34, 70, 0.3); font-size: 2.8rem; display: inline-block; margin: 0 45px; } .join-filter { background: rgba(48, 127, 226, 0.1); border-radius: 10px; padding: 26px 30px; margin-bottom: 45px; position: relative; z-index: 2; } .join-filter .radio-box { display: flex; flex-wrap: wrap; } .join-filter .radio-box .layui-input-block { width: 100%; } .join-filter .radio-box .layui-form-radio > i { display: none; } .join-filter .radio-box .layui-form-radio { border: 1px solid rgba(48, 127, 226, 0.5); padding: 9px 7px; height: auto; line-height: 1; min-width: 9%; display: inline-block; margin-right: 1.11%; margin-top: 0; text-align: center; transition: all 0.3s; border-radius: 5px; box-sizing: border-box; } .join-filter .radio-box .layui-form-radio:hover, .join-filter .radio-box .layui-form-radio:focus { color: #FFF; background-color: #307FE2; } .join-filter .radio-box .layui-form-radio:hover div, .join-filter .radio-box .layui-form-radio:focus div { color: #FFF; } .join-filter .radio-box .layui-form-radio.layui-form-radioed { color: #FFF; background-color: #307FE2; } .join-filter .f-line .layui-input-block { margin-left: 0; } .join-filter .f-sort { background: #EAF0F7; border-radius: 5px; position: relative; cursor: pointer; color: #333; } .join-filter .f-sort .layui-form-select .layui-input { background-color: transparent; border-radius: 5px; padding: 0 18px; border: 1px solid #C5D4E2; height: 46px; } .join-filter .f-sort .layui-form-select .layui-input::placeholder { color: #333333; } .join-filter .f-sort .layui-form-select .layui-edge { width: 9px; height: 22px; background: url("../images/s-arrow.png") no-repeat; padding: 0; border: none; margin-top: -11px; } .join-filter .f-sort .layui-form-selected .layui-edge { transform: rotate(0); } .join-filter .f-flex { display: flex; } .join-filter .f-flex .f-sort { background-color: transparent; width: 20%; box-sizing: border-box; margin-right: 2%; } .join-filter .f-input { width: 44%; position: relative; } .join-filter .f-input input { width: 100%; box-sizing: border-box; padding: 5px; height: 100%; background: transparent; border-radius: 3px; border: none; color: #333; border: 1px solid #C5D4E2; padding-left: 52px; } .join-filter .f-input .iconfont { position: absolute; z-index: 2; top: 50%; transform: translateY(-50%); left: 22px; color: #999; font-size: 1.8rem; } .join-filter .f-input button { position: absolute; right: 5px; box-shadow: none; border: none; color: #FFF; background-color: #307FE2; border-radius: 3px; min-width: 120px; text-align: center; padding: 0 20px; box-sizing: border-box; top: 2px; bottom: 2px; transition: all 0.4s; } .join-filter .f-input button:hover { background-color: rgba(48, 127, 226, 0.8); } .join-list li { margin-bottom: 6px; } .join-list .cur .text { display: block; } .join-list .cur .j-tt, .join-list .act .j-tt { background-color: #307FE2; } .join-list .cur .j-tt h3, .join-list .act .j-tt h3 { color: #fff; } .join-list .cur .j-tt dd, .join-list .act .j-tt dd { color: #FFF; } .join-list .cur .j-tt .j-btn a, .join-list .act .j-tt .j-btn a { background-color: rgba(255, 255, 255, 0.8); color: #307FE2; padding-left: 20px; padding-right: 18px; } .join-list .cur .j-tt .j-btn a:hover, .join-list .act .j-tt .j-btn a:hover { background-color: #FFF; } .join-list .cur .j-tt .j-btn a .iconfont, .join-list .act .j-tt .j-btn a .iconfont { display: inline-block; } .join-list .cur .j-tt .j-btn a .h-btn, .join-list .act .j-tt .j-btn a .h-btn { display: inline-block; } .join-list .cur .j-tt .j-btn a .d-btn, .join-list .act .j-tt .j-btn a .d-btn { display: none; } .join-list .j-tt { background-color: #F0F3F8; padding: 40px 55px; box-sizing: border-box; padding-right: 45%; position: relative; } .join-list .j-tt h3 { font-size: 2.4rem; color: #333; margin-bottom: 18px; font-weight: 500; } .join-list .j-tt dd { color: #6B6B6B; line-height: 2.1; width: 33.33%; } .join-list .j-tt dl { display: flex; flex-wrap: wrap; } .join-list .j-tt .j-btn { position: absolute; right: 55px; top: 50%; transform: translateY(-50%); } .join-list .j-tt .j-btn a { display: inline-block; background-color: #307FE2; color: #FFF; border-radius: 5px; padding: 10px 30px; transition: all 0.3s; } .join-list .j-tt .j-btn a:hover { background-color: rgba(255, 255, 255, 0.8); color: #307FE2; } .join-list .j-tt .j-btn a .h-btn { display: none; } .join-list .j-tt .j-btn a .iconfont { display: none; position: relative; color: #307FE2; transform: rotate(90deg); margin-left: 8px; } .join-list .text { padding: 7vh 0; display: none; } .join-list .text dl:nth-child(1) dt { margin-top: 0; } .join-list .text dt { position: relative; padding: 30px 0 18px; margin: 6vh 0 24px; } .join-list .text dt h4 { font-size: 2.4rem; color: #333; font-weight: 500; } .join-list .text dt:after { content: attr(data-num); position: absolute; left: 0; top: 0; font-size: 84px; line-height: 1; color: #999; opacity: 0.15; z-index: 1; font-weight: bold; } .join-list .text .text-p { line-height: 2.1; display: flex; flex-wrap: wrap; } .join-list .text .text-p p { margin-bottom: 10px; } .join-list .text .text-p .d-left { width: 50%; box-sizing: border-box; padding-right: 4%; } .join-list .text .text-p .d-left:nth-child(2n) { padding-left: 4%; padding-right: 0; border-left: 1px dotted rgba(137, 137, 137, 0.5); } .contact-info { display: flex; flex-wrap: wrap; flex-direction: row-reverse; } .contact-info .inner-title { display: inline-block; text-align: left; margin: 0 0 15vh; } .contact-info .con-left { width: 34%; flex-shrink: 0; padding: 12vh 0 6vh; } .contact-info .con-left h4 { font-size: 2.4rem; font-weight: 500; margin-bottom: 24px; color: #333; } .contact-info .con-left .text-p { color: #666666; font-size: 1.8rem; padding-right: 4%; } .contact-info .con-left .text-p dd { margin-bottom: 16px; padding-left: 42px; background-repeat: no-repeat; background-position: 0 50%; } .contact-info .con-left .text-p .tel { background-image: url("../images/contact-icon-tel.png"); } .contact-info .con-left .text-p .fax { background-image: url("../images/contact-icon-fax.png"); } .contact-info .con-left .text-p .add { background-image: url("../images/contact-icon-add.png"); } .contact-info .con-left .text-p .yb { background-image: url("../images/contact-icon-yb.png"); } .contact-info .con-right { width: 66%; position: relative; } .contact-info .con-right .swiper-container { height: 100%; } .contact-info .con-right .swiper-button-next, .contact-info .con-right .swiper-button-prev { background-image: none; background-color: #307fe2; width: 40px; height: 40px; border-radius: 50%; margin-top: -20px; text-align: center; line-height: 40px; transition: all 0.4s; } .contact-info .con-right .swiper-button-next .iconfont, .contact-info .con-right .swiper-button-prev .iconfont { font-size: 1.8rem; color: #fff; transition: all 0.3s; } .contact-info .con-right .swiper-button-next:hover, .contact-info .con-right .swiper-button-prev:hover { background-color: rgba(48, 127, 226, 0.8); } .contact-info .con-right .swiper-button-next:hover .iconfont, .contact-info .con-right .swiper-button-prev:hover .iconfont { color: #fff; } .contact-info .c-item { display: flex; flex-direction: column; justify-content: center; padding: 0 12px; position: relative; /*首先我们设置边框只显示右侧,宽度为2px的实线。*/ border-right: 1px solid; /*设置线性渐变*/ border-image: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(48, 127, 226, 0.2) 50%, rgba(255, 255, 255, 0) 99%) 2 2 2 2; box-sizing: border-box; height: 100%; } .contact-info .c-item:after { transition: all 0.4s; content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(48, 127, 226, 0.1) 20%, rgba(255, 255, 255, 0) 99%); opacity: 0; } .contact-info .cur .c-item:after { opacity: 1; } .contact-info .cur .c-item h4 { color: #307FE2; } .contact-info .cur .c-item .text-con .line { opacity: 1; } .contact-info .img-pic { position: relative; z-index: 2; } .contact-info .text-con { position: relative; z-index: 2; margin: 24px 0 0; } .contact-info .text-con h4 { font-size: 1.8rem; color: #333; text-align: center; transition: al 0.4s; } .contact-info .text-con .line { transition: all 0.4s; width: 32px; height: 1px; background: #307FE2; margin: 12px auto 0; opacity: 0; } .contact-msg { background-color: rgba(215, 230, 249, 0.5); padding: 6vh 20vh 4vh; } .contact-msg .m-t { text-align: center; line-height: 1.875; color: #666; font-size: 1.6rem; margin: 0 0 6vh; } .msg-form .f-row { display: flex; } .msg-form .f-line { display: flex; border-radius: 5px; width: 100%; margin-bottom: 23px; } .msg-form label { flex-shrink: 0; width: 48px; height: 48px; display: inline-block; text-align: center; line-height: 48px; background-color: #307FE2; } .msg-form .f-input { width: calc(100% - 48px); } .msg-form .f-input .layui-input { height: 49px; padding: 0 20px; box-sizing: border-box; } .msg-form .f-input .layui-input::placeholder { font-size: 1.6rem; color: #666; } .msg-form .f-input textarea.layui-input { height: auto; padding-top: 12px; } .msg-form .w100 .f-input { width: 100%; } .msg-form .layui-form-select .layui-edge { width: 9px; height: 22px; background: url("../images/s-arrow.png") no-repeat; padding: 0; border: none; margin-top: -11px; } .msg-form .f-area { width: 270px; flex-shrink: 0; margin-left: 18px; } .msg-form .f-area .f-input { width: 100%; } .msg-form .layui-form-selected .layui-edge { transform: rotate(0); } .msg-form .layui-input-block { margin-left: 0; } .msg-form .f-btn.f-line { padding-left: 48px; padding-top: 20px; } .msg-form .f-btn.f-line .layui-input-block { width: 100%; text-align: center; } .msg-form .f-btn.f-line .layui-btn { font-size: 1.8rem; border-radius: 5px; min-width: 140px; } .msg-form .f-btn.f-line button[type='reset'] { border-color: rgba(126, 142, 163, 0.5); } .wap-title { display: none; } .right-fix { position: fixed; right: 20px; top: 50%; z-index: 2023; } .right-fix ul { background: #fff; box-shadow: 0px 6px 48px 0px rgba(147, 152, 157, 0.35); border-radius: 12px; overflow: hidden; } .right-fix ul .r-item { width: 52px; height: 52px; text-align: center; line-height: 52px; position: relative; border-radius: 12px; transition: all 0.3s; } .right-fix ul .r-item:hover { background-color: #307FE2; } .right-fix ul .r-item:hover .iconfont { color: #FFF; } .right-fix ul .iconfont { font-size: 30px; transition: all 0.3s; color: #307FE2; } .right-fix .line { width: 28px; height: 1px; background-color: #636569; opacity: 0.2; margin: 0 auto; } #toTop { background-color: #307FE2; width: 52px; height: 52px; text-align: center; line-height: 52px; display: block; color: #FFF; border-radius: 12px; margin-top: 10px; } #toTop .iconfont { font-weight: 400; font-size: 24px; } .index-panter-tabitem { text-align: center; padding-bottom: 30px; } .index-panter-tabitem a { display: inline-block; border: 1px solid #307FE2; color: #307FE2; border-radius: 15px; padding: 10px 40px; line-height: 1; margin: 0 5px; } .index-panter-tabitem a.cur { background-color: #307FE2; color: #FFF; } .search-inputbox { background-color: #F9F9F9; padding:126px 0px 20px; } .search-inputbox input { width: 100%; height: 50px; box-sizing: border-box; padding: 0 11px; background-color: #FFF; border: none; font-size: 14px; color: #333; } .search-inputbox .s-input { position: relative; } .search-inputbox .s-input button { position: absolute; right: 0; top: 0; height: 100%; background-color: #307FE2; color: #FFF; padding: 0 24px; font-size: 1.4rem; border: none; } .search-result { font-size: 14px; color: rgba(51, 51, 51, 0.3); padding: 14px 0; } .search-textlist { padding-top: 50px; } .search-textlist h3 { font-size: 20px; font-weight: bold; } .search-textlist h3 a { color: #333; } .search-textlist h3 a:hover{ color: #307FE2; } .search-textlist li { margin-bottom: 50px; } .search-textlist .text { margin: 12px 0; color: #666; line-height: 2.1; } .search-textlist .s-bro { color: rgba(85, 85, 85, 0.7); font-size: 14px; } .search-textlist .s-bro a { color: rgba(85, 85, 85, 0.7); transition: all 0.3s; } .search-textlist .s-bro a:hover { color: #307FE2; } @media screen and (min-width: 1920px) { .index-auto-mechgrid { background-size: cover; } } @media screen and (max-width: 1600px) { .auto-mechine-cont .auto-left .imgshow { width: 120px; height: 120px; } .auto-mechine-cont .auto-left .swiper-slide { height: 120px; } .auto-mechine-cont .auto-left .swiper { height: 600px; } .auto-mechine-cont { margin-top: 150px; } .auto-mechine-cont .auto-left { left: 10px; } .index-auto-mechgrid { background-position: 50% 77%; } } @media screen and (max-width: 1500px) { #menuPc a { padding: 0 8px; } .h-tool dl dd { padding: 0 16px; } .header .logo { padding-right: 15px; margin-right: 15px; } .m-width-content { max-width: 1200px; } .about-devprocess { margin-left: calc((100% - 1200px)/2); } .news-focus h3, .news-overviewlist h3 a { font-size: 2rem; } .news-focus .text-p { margin: 2vh 0; font-size: 1.4rem; } .news-indlist h3 a { font-size: 2rem; } .inner-title h2 { font-size: 2.8rem; } .research-result .text-p, .research-app .text { font-size: 1.6rem; } .about-innerbanner .text2 p { font-size: 1.4rem; margin-top: 12px; } } @media screen and (max-width: 1466px) { .appny-list .a-item h3 { font-size: 1.8rem; } .appcase-list .sub-tt, .appdetail-case .text { font-size: 1.8rem; } .appcase-list .c-item h3 { font-size: 1.8rem; padding: 16px 0; } .about-info .text, .about-hzlist .text { font-size: 1.6rem; } .header { padding: 12px 24px; } .m-width-content { max-width: 1200px; } .f-share li { margin-right: 14px; } .auto-mechine-cont .auto-left .imgshow { width: 100px; height: 100px; } .auto-mechine-cont .auto-left .swiper-slide { height: 100px; } .auto-mechine-cont .auto-left .swiper { height: 500px; } .ipd-20 { padding: 0 20px; } .index-about-grid .about-numlist .n-t { font-size: 34px; } .inner-title { margin: 40px 0 30px; } .footer { margin-top: 8vh; } .f-nav h3 { font-size: 1.6rem; } .f-tool p { font-size: 1.4rem; } .f-tool { padding-left: 3%; } .foot-copy .f-link a { margin-left: 8px; } .foot-copy .f-rig { text-align: center; padding: 20px 0 0; width: 100%; font-size: 1.2rem; } .ipd-20 { padding: 0 20px; } .about-info, .about-keyvalue { padding-right: calc((100% - 1000px)/2); } } @media screen and (max-width: 1366px) { .join-team .imgshow h3 { font-size: 2.0rem; } .contact-info .text-con h4 { font-size: 1.6rem; } .content-about .about-numlist ul li em { font-size: 3.2rem; } .wenhua-swiper .text h3, .about-childcom .about-swiper-text h4 { font-size: 2.0rem; } .wenhua-swiper .swiper-slide { padding: 20px 12px 20px; } .wenhua-swiper .w-item { box-shadow: 8px 8px 15px 0px rgba(14, 98, 145, 0.11); } .about-keyvalue .k-t h3 { font-size: 2.0rem; } .devprocess-list li { width: 360px; } .about-info .text, .about-hzlist .text, .about-ldlist-text .d-text, .about-hzlist .text, .devprocess-list .d-con .text, .about-keyvalue .text p { font-size: 1.4rem; } .appny-info .a-btns a { font-size: 1.6rem; } .appny-info .a-btns a .iconfont { font-size: 1.8rem; } .auto-mechine-cont .auto-right .auto-bigimgshow .sm-img { width: 80px; height: 80px; border-width: 5px; } .m-width-content { max-width: 1000px; } .application-swiper .a-item .h-text, .application-swiper .swiper-slide.cur { width: 420px; } .auto-mechine-cont .auto-right { padding-right: 0; } .auto-mechine-cont .auto-right .auto-btn a .iconfont { margin-left: 30px; } .auto-mechine-cont .auto-right .auto-bigimgshow .swiper-slide { padding-right: 0; } .auto-mechine-cont .auto-right .auto-btn { bottom: 0; transform: translateY(0); top: auto; } .m-width-content { max-width: 1000px; } .cur .about-innerbanner .text2 h2 { font-size: 2.4rem; } .banner.inner-banner .line { margin-top: 12px; } .product-jmlist .text { padding-bottom: 12px; } .pro-filter .radio-box .layui-form-radio { width: 12%; margin-right: 2%; } .page-box { padding: 32px 0; } .prodetail-download .d-btn a { font-size: 1.6rem; margin-left: 12px; padding-top: 12px; padding-bottom: 12px; } .prodetail-download .d-btn .iconfont { font-size: 15px; } .prodetail-text h3 { font-size: 2.4rem; } .prodetail-text .text { font-size: 1.4rem; } body, input, select, button, textarea { font-size: 1.4rem; } .prodetail-table .table-cont .table-left, .prodetail-table .table-cont .table-right { width: 100%; } .prodetail-text h4 { font-size: 1.8rem; } .header .logo img { height: 40px; } .h-right .h-top { margin-bottom: 8px; } .appny-list .a-item .text { padding: 14px; } .appny-list .a-item h3 { font-size: 1.6rem; } .about-hzlist .text { line-height: 1.875; } .join-team .text { padding: 12px; } .contact-info .con-left .text-p { font-size: 1.6rem; } .contact-msg { padding: 6vh 5% 4vh; } .projsj-list h3, .prochechuang-list h3 { font-size: 1.8rem; } .product-jmlist h3 { font-size: 1.6rem; } .prodetail-text { margin: 30px 0 0; } .prodetail-other h3 { font-size: 1.8rem; } .prodetail-other { margin: 40px 0 0; } .prodetail-table h3 { margin: 30px 0 10px; } .contact-info .inner-title { margin-bottom: 8vh; } .contact-info .con-left h4 { font-size: 1.8rem; } .f-36 { font-size: 2.4rem; } .inner-title h2 { font-size: 2.4rem; } .gade-cont .text h3 { font-size: 1.8rem; } .jion-tabtt a { font-size: 2.4rem; } .about-honor-swiper .text h3 { font-size: 1.8rem; } .about-kehuhonor .swiper-slide:hover h3 { font-size: 1.8rem; } .wenhua-swiper .w-item { padding: 32px 12px 24px; } .about-ldlist .d-item .text h3 { font-size: 1.8rem; } .about-ldlist .d-item .text .icon img { width: 24px; height: 24px; } } @media screen and (max-width: 1000px) { html.mm-blocking body { overflow: initial; } .header { position: sticky; top: 0; left: 0; width: 100%; z-index: 999; } #menuPc { display: none; } #menuWap { display: block; } #page { background: #FFFFFF; } .btn-nav { position: absolute; top: 50%; transform: translateY(-50%); right: 0px; background: transparent; border: none; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; z-index: 99999; display: block; width: 30px; float: right; } .icon-bar { display: block; margin: 6px 0; width: 30px; height: 3px; background-color: #FFF; box-shadow: 0 1px 1px #000000; -webkit-transition: all .7s ease; -moz-transition: all .7s ease; -ms-transition: all .7s ease; -o-transition: all .7s ease; transition: all .7s ease; z-index: 999999; } .mm-opening .top { -webkit-transform: translateY(8px) rotateZ(45deg); -moz-transform: translateY(8px) rotateZ(45deg); -ms-transform: translateY(8px) rotateZ(45deg); -o-transform: translateY(8px) rotateZ(45deg); transform: translateY(8px) rotateZ(45deg); } .mm-opening .bottom { -webkit-transform: translateY(-10px) rotateZ(-45deg); -moz-transform: translateY(-10px) rotateZ(-45deg); -ms-transform: translateY(-10px) rotateZ(-45deg); -o-transform: translateY(-10px) rotateZ(-45deg); transform: translateY(-10px) rotateZ(-45deg); } .mm-opening .middle { width: 0; } .banner .banner-content .f-46 { font-size: 1.8rem; } .banner .banner-content .f-30 { font-size: 1.4rem; } .banner .video-show .p-icon { width: 40px; height: 40px; background-size: cover; } .banner .swiper-pagination { bottom: 10px !important; } .banner h3 { margin-bottom: 12px; } .banner .banner-content .text { padding: 20px 0; padding-left: 20px; } .banner .bg-box img, .banner .video-show { height: 30vh; } .banner .swiper-slide .video-box { display: none; } .h-right { display: none; } .header { padding: 12px 0; } .logo img { height: 30px; } .header .h-gp { font-size: 1.2rem; padding: 6px 12px; height: auto; line-height: 1; } .auto-mechine-cont { margin: 30px 0; } .auto-mechine-cont .auto-left { width: 100%; } .auto-mechine-cont .auto-right { padding: 0; width: 100%; flex-direction: column; } .auto-mechine-cont .auto-left .text { left: 0; position: initial; } .auto-mechine-cont .auto-left .a-item { display: block; text-align: center; } .auto-mechine-cont .auto-left .imgshow { margin: 0 auto 12px; } .auto-mechine-cont .auto-left .h-text { height: auto; padding: 0; } .auto-mechine-cont { flex-wrap: wrap; margin-top: 40px; } .auto-mechine-cont .auto-left .swiper { height: auto; } .auto-mechine-cont .auto-left .swiper-slide { height: auto; } .index-about-grid .about-cont .about-left, .index-about-grid .about-cont .about-right { width: 100%; } .index-about-grid .about-cont { flex-wrap: wrap; } .index-about-grid .about-numlist ul { flex-wrap: wrap; } .index-about-grid .about-numlist ul li { width: 33.33%; margin-bottom: 12px; } .index-about-grid .about-numlist em { font-size: 40px; } .index-about-grid .about-cont .about-right { margin-top: 0; } .index-about-grid .about-video { height: auto; } .auto-mechine-cont .auto-left .h-text .t-con { transform: translateY(0); } .auto-mechine-cont .auto-left .line { display: none; } .auto-mechine-cont .auto-left .text { display: none; } .auto-mechine-cont .auto-left .h-text { display: none; } .auto-mechine-cont .auto-left .swiper-slide-active .h-text { display: block; } .auto-mechine-cont .auto-left .swiper-slide { transform: translateX(0) !important; } .auto-mechine-cont .auto-right .auto-btn { position: initial; transform: translateY(0); margin: 12px 0 0; } .index-title h2 { font-size: 2.4rem; } .auto-mechine-cont .auto-right .auto-bigimgshow .sm-img { width: 80px; height: 80px; border-width: 3px; } .application-swiper .a-item .h-text { width: 100%; box-sizing: border-box; padding: 24px; } .application-swiper .swiper-slide:nth-child(1) { margin-right: 30px !important; } .index-about-grid { padding: 30px 0 70px; } .index-bot-grid .index-title { margin-bottom: 24px; } .application-swiper .swiper-slide.swiper-slide-active .a-item .h-text { opacity: 1; visibility: visible; transition-delay: 0; } .index-panter-grid { padding: 40px 0; } .news-list li { width: 100%; margin-bottom: 30px; } .news-list h3 a { height: auto; display: block; } .news-list .n-item dd:nth-child(1) .text { padding-top: 12px; } .news-list .n-item .text { padding: 12px 0; } .news-list li:nth-child(2) .n-item { flex-direction: column; } .news-list li:nth-child(2) .n-item .line { top: auto; bottom: 0; } .index-news-grid { padding-bottom: 40px; } .f-nav, .f-tool { width: 100%; box-sizing: border-box; } .f-nav li { width: 100%; margin-bottom: 5px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .f-nav li h3 { margin-bottom: 5px; } .f-nav li dl { display: none; } .f-nav li dl dd { padding-left: 20px; font-size: 1.4rem; line-height: 1.5; } .f-nav li.cur dl { display: block; } .f-tool { padding-left: 0; } .foot-copy { margin-top: 24px; padding: 20px 0; } .f-logo { margin-bottom: 24px; padding-bottom: 20px; } .see-more.wow:after { width: 100%; opacity: 1; } .auto-mechine-cont .auto-left .h-text h3 { font-size: 1.4rem; } .auto-mechine-cont .auto-left .swiper-slide.swiper-slide-active .imgshow img, .auto-mechine-cont .auto-left .swiper-slide.swiper-slide-active .imgshow { border-width: 5px; } .auto-mechine-cont .auto-left .h-text h4 { font-size: 1.2rem; } .auto-mechine-cont .auto-right .auto-btn a span { opacity: 1; } .auto-mechine-cont .auto-right .auto-btn a { position: relative; } .auto-mechine-cont .auto-right .auto-btn a:after { width: 100%; opacity: 1; } .news-list .n-item dd .text h3 { font-size: 1.6rem; } .news-list .text-p { font-size: 1.4rem; } .mm-listview > li.waplang > a { display: inline-block; } .application-swiper .a-item .h-text h3 { font-size: 2.4rem; } .application-swiper .imgshow { transform: translateX(0); left: 0; width: 100%; } .application-swiper .a-item .h-text .text-p { font-size: 1.2rem; } .index-panter-grid .panter-swiper .swiper-pagination { margin-top: 20px; } .news-list h3 { font-size: 1.6rem; } .news-list li:nth-child(2) .n-item .text { padding: 12px 0; } .news-list li:nth-child(2) .n-item h3 { margin: 0; } .product-keylist li { margin-bottom: 12px; width: 50%; } .projsj-list li, .product-autolist li, .product-jmlist li { width: 50%; margin-bottom: 12px; } .product-keylist h3m, .projsj-list h3, .prochechuang-list h3 { font-size: 1.4rem; } .prochechuang-list li { width: 100%; margin-bottom: 12px; } .f-search { position: relative; margin: 20px 0 0; top: 0; } .foot-con { padding-top: 20px; } .pro-filter .radio-box .layui-form-radio { width: 32%; margin-bottom: 12px; } .pro-filter .radio-box .layui-form-radio:nth-of-type(3n) { margin-right: 0; } .pro-filter .f-flex .f-sort { width: 100%; margin-right: 0; margin-bottom: 8px; } .pro-filter .f-flex { flex-wrap: wrap; } .pro-filter .f-input { width: 100%; } .pro-filter .f-input input { height: 46px; } .pro-filter { padding: 24px 24px 12px; } .page-box .page-inner a.larger { display: none; } .prodetail-info .imgshow, .prodetail-info .text { width: 100%; } .prodetail-info .imgshow { margin-bottom: 24px; } .prodetail-info .text { padding-left: 0; } .prodetail-info .text h3 { font-size: 2.0rem; margin-bottom: 12px; } .prodetail-download .d-left, .prodetail-download .d-right { width: 100%; max-width: 100%; } .prodetail-download .d-left { margin-bottom: 12px; } .prodetail-download .d-btn { display: flex; } .prodetail-download .d-btn a { margin: 0 1%; width: 48%; padding-left: 0; padding-right: 0; text-align: center; } .pd-text1 .t-left, .pd-text1 .t-right { width: 100%; } .pd-text2 .t-left, .pd-text2 .t-right, .pd-text4 .t-right, .pd-text4 .t-left, .pd-text5 .t-right, .pd-text5 .t-left, .text6-list li, .pd-text7 .t-right, .pd-text7 .t-left { width: 100%; } .pd-text7 .t-right { margin-bottom: 12px; } .prodetail-text { padding-right: 0; } .ptext8-list li { width: 50%; } .prodetail-other ul li { width: 100%; margin-top: 0 !important; } .prodetail-table .p-table { overflow-x: auto; } .prodetail-table .p-table table { min-width: 100%; } .prodetail-table .p-table th { font-size: 1.6rem; } .product-keylist h3 { font-size: 1.4rem; } .prochechuang-list h3 { padding-top: 12px; } .product-autolist h3 { font-size: 1.4rem; } .appny-list li { width: 50%; margin-bottom: 12px; } .appny-list .a-item h3 { font-size: 1.4rem; } .appny-list .a-item .text { padding: 12px 6px; } .appny-list ul { margin: 0 -5px; } .appny-list li { float: left; width: 50%; padding: 0 5px; box-sizing: border-box; } .appny-list.w2 li { padding: 0 5px; } .appny-list.w2 ul { margin: 0 -10px; } .f-search input { width: 100%; } .appny-info .imgshow, .appny-info .text { width: 100%; } .appny-info .imgshow { margin-bottom: 12px; } .appny-info .a-btns { margin: 24px 0 0; } .appdetail-case .text, .appcase-list .sub-tt { font-size: 1.6rem; } .appcase-list .c-item h3 { font-size: 1.2rem; } .appcase-list .c-item h3 { padding: 12px 6px; } .appcase-list ul li { margin-bottom: 12px; } .case-hezuo { margin: 30px 0 0; } .case-hezuo .inner-title .slot-right { position: initial; transform: translateY(0); margin: 12px 0 0; } .case-hezuo { padding: 1px 12px 1px; } .case-hezuo .inner-title { margin: 30px 0; } .case-hezuo .swiper-pagination { margin: 20px 0; } .appny-info { margin-top: 30px; } .appny-info .a-btns a { font-size: 1.4rem; padding: 14px 20px; box-sizing: border-box; text-align: center; width: 100%; } .appny-info .a-btns a .iconfont { font-size: 1.4rem; } .appny-info .a-btns dl { display: flex; justify-content: space-between; } .appny-info .a-btns dl dd { width: 49%; margin-bottom: 0; } .about-info .imgshow, .about-info .text { width: 100%; } .about-info, .about-keyvalue { padding-right: 20px; padding-left: 20px; } .content-about .about-numlist ul li em { font-size: 2.4rem; } .content-about .about-numlist ul li p { font-size: 1.4rem; } .content-about .about-numlist { margin: 24px 0; } .about-info .text { font-size: 1.4rem; } .about-ldlist-text { margin-top: 34px; } .about-childcom { padding: 30px 0; } .about-childcom .imgshow, .about-childcom .text { width: 100%; } .about-childcom .text .inner-title { padding: 0; margin: 12px 0; text-align: center; } .about-childcom .text .inner-title .line { margin: 12px auto 0; } .about-childcom .about-page { padding: 0; text-align: center; justify-content: center; } .about-childcom .about-swiper-text { margin: 0; padding: 20px; } .about-childcom .about-swiper-text h4 { font-size: 2rem; text-align: center; } .about-ldlist-text .d-text { font-size: 1.4rem; } .about-hyear { padding: 12px 40px 0; } .about-honor .year-swiper .swiper-slide { font-size: 1.8rem; } .about-honor .year-swiper .swiper-slide.swiper-slide-active { font-size: 2.4rem; } .about-honor .year-swiper .swiper-button-prev { left: 0; } .about-honor .year-swiper .swiper-button-next { right: 0; } .about-hyear .news-y, .about-hyear .old-y { top: 9px; } .about-kehuhonor .khzizhi-swiper { padding: 0 40px; } .about-kehuhonor h3 { height: auto; } .about-hzlist li { width: 50%; } .about-hzlist .text { font-size: 1.4rem; } .about-hzlist .a-item, .about-hzlist li:nth-child(2n) .a-item { flex-direction: column; } .about-hzlist li { margin-bottom: 12px; } .about-hzlist li .text { margin: 28px 0 0 !important; height: auto !important; } .about-hzlist ul { display: flex; flex-wrap: wrap; } .devprocess-list ul { flex-direction: column; } .devprocess-list li { width: 100%; margin-right: 0; } .about-devprocess { margin: 0; } .devprocess-list li { padding-bottom: 0; } .devprocess-list:after { display: none; } .devprocess-list { padding: 0 20px; } .devprocess-list .d-con .text { width: 100%; position: initial; padding: 12px 0; } .devprocess-list .d-con { flex-wrap: wrap; } .devprocess-list li:nth-child(2n) { margin: 0; padding-top: 0; } .devprocess-list li .d-item { flex-direction: column; } .devprocess-list .line { height: 100%; top: 0; } .devprocess-list .dot { top: auto; bottom: 0; } .about-devprocess .tips-text { display: none; } .devprocess-list li:nth-child(2n) .d-con { margin-top: 24px; margin-bottom: 24px; } .devprocess-list .d-con { margin-top: 24px; } .about-keyvalue .imgshow, .about-keyvalue .text { width: 100%; } .about-keyvalue .text { padding-left: 0; } .about-keyvalue { margin-top: 30px; } .about-keyvalue li { margin-bottom: 0; } .about-keyvalue .k-t { padding-top: 16px; padding-bottom: 16px; } .about-keyvalue .cur h3, .about-keyvalue .act h3 { font-size: 2.4rem; } .wenhua-swiper .text h3 { font-size: 1.8rem; } .devprocess-list .year, .devprocess-list .year small { font-size: 2.4rem; } .about-childcom .about-page .swiper-button-prev, .about-childcom .about-page .swiper-button-next { margin: 0 10px; } .about-research-list .r-item { flex-wrap: wrap; } .about-research-list .imgshow, .about-research-list .text { width: 100%; } .about-research-list .text { margin-top: 12px; margin-right: 0; padding: 0 24px; height: auto !important; } .about-research-list .r-item .num { font-size: 80px; } .about-research-list li:nth-child(2n) .text { margin-left: 0; } .research-result { padding-top: 0; flex-wrap: wrap; } .research-result .imgshow, .research-result .text { width: 100%; } .research-result .imgshow { margin-bottom: 12px; } .research-result .text { padding-left: 0; } .content-about-research { padding-bottom: 40px; } .footer { margin-top: 30px; } .research-result .text-p, .research-app .text { font-size: 1.4rem; } .about-innerbanner { position: initial; width: 100%; } .about-innerbanner .text2 { width: 100%; padding: 24px; transition-duration: 0.3s; } .news-focus .imgshow, .news-focus .text { width: 100%; } .news-focus { margin: 30px 0 0; } .news-focus h3, .news-overviewlist h3 a { font-size: 1.6rem; } .news-overviewlist li { width: 100%; } .news-overviewlist .text-p, .news-overviewlist h3 { height: auto !important; } .news-indlist li { width: 100%; margin-bottom: 12px; } .news-indlist h3 a { font-size: 1.6rem; } .news-indlist .text { padding: 12px; } .news-overviewbtn { margin: 30px 0 0; } .content-news .ncontnet-left, .content-news .ncontnet-right { width: 100%; } .news-filter .f-input { width: 100%; margin-bottom: 12px; } .news-filter { flex-wrap: wrap; margin: 20px 0; } .news-filter .f-input button { width: 60px; } .news-filter .f-date { width: 100%; } .news-filter .f-date .layui-input { width: 100%; } .content-news .ncontnet-left li a { padding: 12px; } .content-news .ncontnet-left .news-leftt h2 { padding: 16px 0; font-size: 2.0rem; } .newsny-list li { margin-bottom: 12px; } .newsny-list .imgshow, .newsny-list .text { width: 100%; } .newsny-list .text { padding: 14px; } .newsny-list .n-item h3 { font-size: 1.6rem; } .content-news-detail .nd-top { max-width: 100%; padding-top: 30px; } .content-news-detail .nd-top .n-tt { padding: 0; } .content-news-detail .nd-top .n-tt h3 { font-size: 2.4rem; } .content-news-detail .nd-left, .content-news-detail .nd-right { width: 100%; } .gade-cont { flex-wrap: wrap; } .gade-cont .imgshow, .gade-cont .text { width: 100%; } .gade-cont .imgshow { margin-bottom: 20px; } .gade-cont .text { padding-left: 0; } .gade-cont .text h3 { padding-bottom: 12px; margin-bottom: 12px; } .join-team li { width: 100%; margin-bottom: 12px; } .j-title { margin: 40px 0 30px; } .jion-tabtt { margin: 40px 0 30px; } .join-filter .f-flex { flex-wrap: wrap; } .join-filter .f-flex .f-sort { width: 100%; margin-bottom: 12px; } .join-filter .f-input { width: 100%; } .join-filter .f-input input { height: 46px; } .join-filter .f-input button { min-width: auto; right: 0; } .join-list .j-tt { padding: 20px; } .join-list .j-tt .j-btn { position: initial; transform: translateY(0); margin-top: 12px; } .join-list .text .text-p .d-left { width: 100%; padding-right: 0; border: none !important; padding-left: 0 !important; } .join-list .text dt { margin: 30px 0 20px; } .join-list .j-tt dd { width: 50%; } .join-list .j-tt dd:nth-child(2n) { text-align: right; } .page-box .page-inner a, .page-box .page-inner span { font-size: 1.4rem; } .join-list .j-tt h3 { font-size: 1.8rem; } .jion-tabtt i { margin: 0 20px; } .contact-info { flex-direction: column; } .contact-info .con-right, .contact-info .con-left { width: 100%; } .pc-hidetitle { display: none !important; } .wap-title { display: block; } .contact-info .con-left { padding: 30px 0; } .contact-info .con-left .text-p { font-size: 1.4rem; padding-right: 0; } .msg-form .f-row { flex-wrap: wrap; } .msg-form .f-area { width: 100%; margin-left: 0; } .msg-form .f-btn.f-line { padding-left: 0; } .contact-info .text-con { display: none; } .contact-info .c-item { padding: 0; } .banner .banner-content .text-p h2 { font-size: 2rem; } .msg-form .f-input .layui-input::placeholder { font-size: 1.4rem; } .msg-form .f-btn.f-line .layui-btn { min-width: auto; } .contact-msg { padding: 30px 20px; } .contact-msg .m-t { margin-bottom: 24px; } .right-fix ul .iconfont, #toTop .iconfont { font-size: 20px; } .right-fix ul .r-item, #toTop { width: 46px; height: 46px; line-height: 46px; } .right-fix { top: auto; bottom: 20px; } .wenhua-swiper .swiper-container { margin: 0 -20px; } .contact-info .c-item:after { display: none; } .msg-form .f-btn.f-line .layui-btn { font-size: 1.6rem; } .see-more { box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.05); } .pro-filter { margin: 30px 0; } .pd-imglist li { width: 33.33%; } .prodetail-other .t-item { width: 100%; padding: 0; text-align: center; } .prodetail-other { padding-bottom: 30px; } .prodetail-other li { padding: 0; box-sizing: border-box; } .prodetail-other ul { margin: 0; } .prodetail-other .text { font-size: 1.6rem; line-height: 2; } .index-panter-tabitem { display: flex; justify-content: space-between; } .index-panter-tabitem a { width: 30%; padding-left: 0; padding-right: 0; font-size: 1.2rem; } .auto-mechine-cont > .index-title { position: relative; transform: translateY(0); margin-top: 30px; } } /* 董事委员会 */ .committee_content {padding: 90px 0 10px 0;} .committee_w1280{width: 1280px;max-width: 92%;margin: 0 auto;} .committee_clear:after{ content: ''; display: table; clear: both; } .committee_dongshi-page{margin-bottom: 30px;float: left;width: 48%;margin-right: 4%;} .committee_dongshi-page:nth-child(even){margin-right: 0;} .committee_size16{font-size: 16px;} .committee_margin-b20{margin-bottom: 20px;} .committee_dongshi-bot{background: url("/images/wyhbg.jpg") no-repeat center;background-size: cover;padding: 25px;} .committee_dongshi-top{border-bottom: 1px solid #ddd;padding-bottom: 20px;margin-bottom: 22px;} .committee_dongshi-top h3{font-size: 14px;} .committee_relative{position: relative;} .committee_zqfw{position: absolute;right: 0;bottom:20px;padding-left: 25px;color: #307FE2;} .committee_zqfw:before{content: '';position: absolute;width: 16px;height: 14px;background: url("/images/qzfw.png") no-repeat center;background-size: cover;left: 0;top:50%;margin-top: -7px;} .committee_person{height: 250px;} .committee_person h3{display: inline-block;position: relative;color: #666;} .committee_person h3:before{width: 13px;height: 2px;background: #ecedf2;content: '';position: absolute;left: -30px;top:50%;margin-top: -1px;} .committee_person h3:after{width: 13px;height: 2px;background: #ecedf2;content: '';position: absolute;right: -30px;top:50%;margin-top: -1px;} .committee_person p{margin-top: 15px;height: 3.2em;} .committee_person li{position: relative;padding-left: 70px;min-height: 40px;margin-bottom: 20px} .committee_person li span{display: inline-block;background: #fff;line-height: 40px;padding: 0 14px;margin-left: 5px;margin-bottom: 8px;min-width: 90px;text-align: center;} .committee_person li span:last-child{margin-right: 0;} .committee_person li span:hover{background: #307FE2;color:#fff;} .committee_person li:last-child{margin-bottom: 0;} .committee_zhuxi{position: absolute;top:0;left: 0;line-height: 40px;} .committee_xize{font-size: 0;padding-top: 30px;} .committee_xize li{display: inline-block;vertical-align: top;font-size: 14px;width: 32%;margin-right: 2%;margin-bottom: 2%;background: #f4f5f9;} .committee_xize li a{display: block;padding: 15px 20px;position: relative;transition: all .4s;} .committee_xize li:nth-child(3n){margin-right: 0;} .committee_xize p{position: relative;padding-left: 24px;margin-right: 25px;transition: all .4s;} .committee_xize p:before{position: absolute;content: '';width: 10px;height: 10px;border-radius: 100%;background: #dbdce3;left: 0;top:50%;margin-top: -5px;transition: all .4s;} .committee_xize .i{width: 17px;height: 23px;position: absolute;right: 20px;top:50%;margin-top: -12px;background: url("/images/pdf.png") no-repeat center;background-size: cover;filter: grayscale(1);transition: all .4s;} .committee_xize a:after{content: "";position: absolute;width: 100%;height: 4px;background: #307FE2;left: 0;bottom:0;display: none;transition: all .4s;} .committee_xize a:hover p{color:#307FE2;} .committee_xize a:hover:after{display: block;} .committee_xize a:hover p:before{background:#307FE2;} .committee_xize a:hover .i{filter: grayscale(0);} @media (max-width:1060px){ .committee_dongshi-page{width: 100%;margin-right: 0;} .committee_person{height: auto;} .committee_xize li{display: block;width: 100%;margin-right: 0;} }