@font-face { font-family: 'Conv_DINCondensedC'; src: url('../fonts/DINCondensedC.eot'); src: local('☺'), url('../font/DINCondensedC.woff') format('woff'), url('../font/DINCondensedC.ttf') format('truetype'), url('../font/DINCondensedC.svg') format('svg'); font-weight: normal; font-style: normal; } body { overflow-x: hidden; font-family: 'PingFang SC', 'microsoft yahei ui', 'microsoft yahei', 'simsun'; } ::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background-color: #f1f1f1; } ::-webkit-scrollbar-thumb { border-radius: 4px; background-color: #e0dede; } ::-webkit-scrollbar-thumb:hover { background-color: #bbb; } ::-moz-scrollbar { width: 8px; } ::-moz-scrollbar-track { background-color: #f1f1f1; } ::-moz-scrollbar-thumb { border-radius: 4px; background-color: #e0dede; } ::-moz-scrollbar-thumb:hover { background-color: #bbb; } ::-ms-scrollbar { width: 8px; } ::-ms-scrollbar-track { background-color: #f1f1f1; } ::-ms-scrollbar-thumb { border-radius: 4px; background-color: #e0dede; } ::-ms-scrollbar-thumb:hover { background-color: #bbb; } .home-right-buttom-schedule-Todayoffice_count { scrollbar-color: #e0dede #f1f1f1; /* 第一个方块颜色,第二个轨道颜色(用于更改火狐浏览器样式) */ scrollbar-width: thin; /* 火狐滚动条无法自定义宽度,只能通过此属性使滚动条宽度变细 */ -ms-overflow-style: none; width: 100%; height: calc(100% - 35px); overflow-y: auto; } .home-right-buttom-schedule-Todayoffice_count::-webkit-scrollbar { width: 8px; height: 8px; } .home-right-buttom-schedule-Todayoffice_count::-webkit-scrollbar-thumb { background: #e0dede; } .home-right-buttom-schedule-Todayoffice_count::-webkit-scrollbar-track { border-radius: 0; background: #f1f1f1; } input[type="text"] { -webkit-appearance: none; } textarea { -webkit-appearance: none; } h1, h2, h3, h4, h5, h6, figure { font-weight: 400; } .bold { font-weight: 600 } .big-bold { font-size: 52px; letter-spacing: 1.2px; font-weight: 700 } .relative { position: relative; } ::-webkit-selection { color: #fff; background: #009FE7; } ::-moz-selection { color: #fff; background: #009FE7; } ::selection { color: #fff; background: #009FE7; } .text-lowercase { text-transform: lowercase; } .text-uppercase, .initialism { text-transform: uppercase; } .text-capitalize { text-transform: capitalize; } a { color: #3e3e3e; text-decoration: none } a:focus, a:hover { color: #009FE7; transition: none } a.text-gray:hover { color: #3e3e3e; } p { margin: 0 } dl, dd, ul, li { margin: 0; padding: 0; list-style: none } .fixed { z-index: 9999; } .bg-gray { background: #F7F7F7 } .bg-sub { background: #6e6e6e } .clearfix:after { content: "020"; display: block; height: 0; clear: both; visibility: hidden; } .img-full { width: 100% !important; height: 100% !important; object-fit: cover; } /* 标签 */ .tag { display: inline-block; transition: .5s } .tag.padding { padding: 5px 12px } .tags { color: #009FE7 !important; border: 1px solid #009FE7 !important; background-color: unset; } /* 英文字体begin */ .Conv_DINCondensedC { font-family: "Conv_DINCondensedC"; } /* 英文字体end */ .mb5 { margin-bottom: 5px; } /* 行距 begin*/ .blank { height: 10px; line-height: 10px; clear: both; font-size: 0 } .blank-small { height: 20px; line-height: 20px; clear: both; font-size: 0 } .blank-middle { height: 30px; line-height: 30px; clear: both; font-size: 0 } .blank-big { height: 50px; line-height: 50px; clear: both; font-size: 0 } .blank-large { height: 80px; line-height: 80px; clear: both; font-size: 0 } /* 行距 end*/ .sidebar-l { margin-right: 30px } .sidebar-r { margin-left: 0px; } /* .container-layout{max-width:1200px;} */ .line-large { margin-left: -15px; margin-right: -15px } .line-large .x1, .line-large .x2, .line-large .x3, .line-large .x4, .line-large .x5, .line-large .x6, .line-large .x7, .line-large .x8, .line-large .x9, .line-large .x10, .line-large .x11, .line-large .x12, .line-large .xl1, .line-large .xl2, .line-large .xl3, .line-large .xl4, .line-large .xl5, .line-large .xl6, .line-large .xl7, .line-large .xl8, .line-large .xl9, .line-large .xl10, .line-large .xl11, .line-large .xl12, .line-large .xs1, .line-large .xs2, .line-large .xs3, .line-large .xs4, .line-large .xs5, .line-large .xs6, .line-large .xs7, .line-large .xs8, .line-large .xs9, .line-large .xs10, .line-large .xs11, .line-large .xs12, .line-large .xm1, .line-large .xm2, .line-large .xm3, .line-large .xm4, .line-large .xm5, .line-large .xm6, .line-large .xm7, .line-large .xm8, .line-large .xm9, .line-large .xm10, .line-large .xm11, .line-large .xm12, .line-large .xb1, .line-large .xb2, .line-large .xb3, .line-large .xb4, .line-large .xb5, .line-large .xb6, .line-large .xb7, .line-large .xb8, .line-large .xb9, .line-large .xb10, .line-large .xb11, .line-large .xb12 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px } /* owl-carousel轮播插件 */ .owl-carousel .owl-dots { position: absolute; top: 50%; padding: 0; text-align: left; width: 20px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .owl-carousel .owl-dots .owl-dot { display: inline-block; position: relative; vertical-align: middle } .owl-carousel .owl-dots .owl-dot span { width: 8px; height: 8px; margin: 0 5px; border-radius: 50%; background: #d3d3d3; display: inline-block; text-align: center; -webkit-transition: all ease .5s; -o-transition: all ease .5s; transition: all ease .5s } .owl-carousel .owl-dots .owl-dot.active span { width: 16px; height: 8px; background: #009FE7; border-radius: 20px } .owl-carousel .owl-nav i { font-size: 24px; color: #fff } .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev { background: #000; width: 42px; height: 42px; line-height: 48px; -webkit-transition: all ease .5s; -o-transition: all ease .5s; transition: all ease .5s; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); top: 50%; position: absolute; text-align: center; border-radius: 50%; opacity: 0 } .owl-carousel .owl-nav .owl-prev { background: #000; left: 20px; right: auto } .owl-carousel .owl-nav .owl-next { right: 20px } /* owl-carousel轮播插件 */ /* 首页轮播 */ #startvideo { width: 100%; object-fit: fill; -webkit-filter: grayscale(0); } .slides-arrow:hover .owl-nav .owl-next, .slides-arrow:hover .owl-nav .owl-prev { opacity: .3 } .dot-center .owl-dots { position: relative; top: -30px; padding: 0; text-align: center; vertical-align: middle; display: inline-block; width: 100% } .dot-disable .owl-dots { display: none; } .slides-video {} video::-webkit-media-controls-play-button { display: none; } video::-webkit-media-controls-enclosure { display: none; } .slides-img .textaria, .slides-video .textaria { position: absolute; top: 0; width: 100%; height: 100%; } .slides-img .container, .slides-video .container { height: 100%; display: flex; /* 设置为flex布局 */ align-items: center; /* 水平居中对齐 */ } .slides-img .slogan, .slides-video .slogan { width: 61%; padding-bottom: 0; } .new-position { width: 100%; position: absolute; bottom: 54px; z-index: 1; } .home-newline { height: 80px; background: rgba(255, 255, 255, 0.16); } .home-newline .home-new-more { background: url(../images/new_more.png); background-size: 100% 100%; line-height: 80px; } .home-newline .home-new-item .x12 { height: 80px; display: flex; /* 设置容器为flex布局 */ justify-content: center; /* 水平居中对齐内容 */ } .home-newline .home-new-item .x12 div { align-self: center; /* 垂直居中对齐内容 */ } .home-newline .home-new-item .rb { border-right: 1px solid rgba(255, 255, 255, .2); } .home-newline .home-new-item:last-child .rb { border: none; } /* 首页轮播 */ /* 首页关于我们 */ .home-about .about_data_area { display: grid; grid-gap: 20px; grid-template-columns: repeat(auto-fill, minmax(214px, 1fr)); } .home-about .about_data { padding: 30px 20px; } .home-about .about_data:hover { box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.08); } .home-about .about_data .big { font-size: 28px; color: #00B0FF; font-weight: 500; position: relative; } .home-about .about_data .big .text-jia { position: absolute; top: 0; font-size: 20px; font-weight: 500; } .home-about { background-repeat: no-repeat; background-position: center 50%; background-size: cover } .home-about .padding-large { padding: 40px 50px } .home-about h2 { position: relative; font-size: 38px; font-family: PingFang SC; font-weight: 500; margin-bottom: 40px; word-break: break-all } .home-about h2:before { content: ''; display: block; position: absolute; background: #009FE7; width: 30px; height: 3px; bottom: -15px; left: 0; } /* 首页关于我们 */ /* 关于我们模版 */ .four-technology { padding: 0 100px 0 100px; } .four-technology { display: grid; grid-gap: 20px; grid-template-columns: 45% 55%; } .four-technology.two { display: grid; grid-gap: 20px; grid-template-columns: 55% 45%; } .four-technology .item { height: 320px; padding-top: 20px; border: 1px solid #B3D1FA; background: #E4F1FD; transition: all .5s ease; } .four-technology .item:hover { background: #C6E3FC; padding-top: 0px; } .four-technology .item img { width: 140px; height: 140px; } .three-recognition { width: 83%; margin: 0 auto; display: grid; grid-gap: 20px; grid-template-columns: repeat(3, 33.33%) } .three-recognition .item { height: 480px; background: url(../images/recognition-bg.png); } .three-recognition .item:hover { box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.08); } .three-recognition .item ul li { background: url(../images/list_image.png) no-repeat left; background-size: 16px 16px; padding-left: 30px; line-height: 25px; } .about-main2 { height: 800px; width: 100%; overflow: hidden; } .about-main2 .quxian { width: 100%; } .about-main2 .licheng-bg { width: 100%; height: 100%; position: relative; } .about-main2 .licheng-bg .warper { height: 100%; } .about-main2 .licheng-bg img { height: 518px; position: absolute; bottom: 0px; left: 0; } .about-main2 .ny-title { padding-top: 80px; position: relative; } .about-main2 .licheng-content { width: 100%; height: 100%; position: relative; } .about-main2 .scale { width: 100%; height: 14px; position: absolute; background: url(../images/scale.png); background-size: 100% 100%; top: 284px; } .about-main2 .licheng-content .swiper-wrapper, .about-main2 .licheng-content .swiper-slide, .about-main2 .licheng-content ul { width: calc(100% - 60px); height: 100%; } .about-main2 .licheng-content ul li { width: 25%; float: left; } .about-main2 .licheng-content ul li a { display: block; width: 100%; position: relative; height: 280px } .about-main2 .licheng-content ul li .date { color: #333; font-size: 30px; } .swiper-container .swiper-wrapper { -webkit-transition-timing-function: linear; /*之前是ease-out*/ -moz-transition-timing-function: linear; -ms-transition-timing-function: linear; -o-transition-timing-function: linear; transition-timing-function: linear; } .about-main2 .licheng-content ul li h3 {} .about-main2 .licheng-content ul li.item1 .cl-line, .about-main2 .licheng-content ul li.item3 .cl-line, .about-main2 .licheng-content ul li.item5 .cl-line { margin-bottom: 30px; } .about-main2 .licheng-content ul li.item2 .cl-line, .about-main2 .licheng-content ul li.item4 .cl-line { margin-top: 36px; } .about-main2 .licheng-content ul li.item1 .cl-line:after, .about-main2 .licheng-content ul li.item3 .cl-line:after, .about-main2 .licheng-content ul li.item5 .cl-line:after { width: 10px; height: 10px; background-color: #333; display: block; content: ""; border-radius: 50%; text-align: center; vertical-align: middle; position: absolute; } .about-main2 .licheng-content ul li.item2 .cl-line:before, .about-main2 .licheng-content ul li.item4 .cl-line:before { width: 10px; height: 10px; background-color: #333; display: block; content: ""; border-radius: 50%; text-align: center; vertical-align: middle; position: absolute; } .about-main2 .licheng-content ul li .lc-left { position: absolute; left: 50%; margin-left: -34px; } .about-main2 .licheng-content ul li .cl-line { display: block; position: relative; left: 40px; } .about-main2 .licheng-content ul li .lc-right { position: absolute; width: 560px; height: 100%; display: table; } .about-main2 .licheng-content ul li.item5 .lc-right { width: 200px; } .about-main2 .licheng-content ul li.item2 .lc-right, .about-main2 .licheng-content ul li.item4 .lc-right { width: 100%; } .about-main2 .licheng-content ul li .lc-right .right-text { margin: 10px; padding: 20px; vertical-align: middle; background: rgba(255, 255, 255, .6); border-radius: 8px; height: 220px; } .about-main2 .licheng-content ul li.item1 a { top: 70px; } .about-main2 .licheng-content ul li.item1 .lc-left .cl-line:after { bottom: -22px; left: -7px; } .about-main2 .licheng-content ul li .lc-right .right-text h3 { font-size: 16px; } .about-main2 .licheng-content ul li .lc-right .right-text p { font-size: 12px; } .about-main2 .licheng-content ul li.item2 a { top: 63px; } .about-main2 .licheng-content ul li.item2 .lc-left .cl-line:before { top: -22px; left: -7px; } .about-main2 .licheng-content ul li.item2 .lc-right { top: 100px; } .about-main2 .licheng-content ul li.item3 a { top: 70px; } .about-main2 .licheng-content ul li.item3 .lc-left .cl-line:after { bottom: -22px; left: -7px; } .about-main2 .licheng-content ul li.item3 .lc-right {} .about-main2 .licheng-content ul li.item4 a { top: 203px; } .about-main2 .licheng-content ul li.item4 .lc-left .cl-line:before { top: -22px; left: -7px; } .about-main2 .licheng-content ul li.item4 .lc-right { top: 100px; } .about-main2 .licheng-content ul li.item5 a { top: 99px; } .about-main2 .licheng-content ul li.item5 .lc-left .cl-line:after { bottom: -22px; left: -7px; } .about-main2 .licheng-content ul li.item5 .lc-right { bottom: 100px; } .about-main2 .licheng-content .right-text h3 { font-size: 16px; margin-bottom: 10px; color: #333; font-weight: bold; } .about-main2 .licheng-content .right-text p { font-size: 14px; } .lc-swiper-btn { width: 100px; position: absolute; top: 34px; right: 0; } .lc-swiper-btn a { display: block; position: absolute; } .lc-swiper-btn .btn-prev { position: absolute; left: 15px; top: 50px; cursor: pointer; } .lc-swiper-btn .btn-next { position: absolute; right: 0; top: 50px; cursor: pointer; } .lc-swiper-btn .iconfont { font-size: 30px; } /* 关于我们模版 */ .slides-img { overflow: hidden; } .three-bu { display: grid; grid-gap: 20px; grid-template-columns: 1fr 1fr 1fr; padding: 0 40px 0 40px; } .three-bu .item { /* height: 500px; */ overflow: hidden; position: relative; } .three-bu .item img { object-fit: cover; width: 100%; } .three-bu .item .move { overflow: hidden; position: absolute; bottom: -90px; transition: all .5s ease; width: 100%; height: 155px; } .three-bu .item:hover .move { background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 10%, rgba(0, 0, 0, .8) 94%); bottom: 0px; } .cockpit-bu { display: grid; grid-gap: 20px; grid-template-columns: 1fr 1fr; padding: 0 40px 0 40px; } .cockpit-bu .item { /* height: 500px; */ overflow: hidden; position: relative; } .cockpit-bu .item img { object-fit: cover; width: 100%; } .cockpit-bu .item .move { overflow: hidden; position: absolute; bottom: -90px; transition: all .5s ease; width: 100%; height: 155px; background: linear-gradient(180deg, rgba(89, 120, 234, 0.00), #5978ea 60%); } .cockpit-bu .item .move p { color: #fff !important; } .cockpit-bu .item:hover .move { background: linear-gradient(180deg, rgba(89, 120, 234, 0.00), #5978ea 60%); bottom: 0px; } .vision-core { width: 25%; line-height: 30px; position: absolute; left: 35%; top: 25%; color: #fff; font-size: 20px; font-weight: 500; } .vision-core .vision-core-img { width: 76px; } .vision-core .vision-core-title { margin-top: 24px; } .vision-adv { padding: 50px 220px 0 120px; } .vision-tech { width: 80%; line-height: 50px; position: absolute; left: 8%; top: 15%; } .vision-tech .vision-tech-img { width: 90px; } .vision-tech .vision-tech-title { margin-top: 24px; font-size: 25px; font-weight: 500; } .vision-tech2 { width: 80%; line-height: 50px; position: absolute; left: 10%; top: 10%; } .vision-tech2 .vision-tech2-title { margin-top: 48px; font-size: 25px; font-weight: 500; } .vision-scene { padding: 0 50px; } @media(max-width:760px) { .slides-img { height: 418px } .slogan .small { font-size: 12px; line-height: 32px; margin: 16px 0 20px 0; opacity: 0.9; } .slides-img .slogan, .slides-video .slogan { width: 68%; } .slogan .big { font-size: 32px; letter-spacing: 1.2px; } .vision-core { font-size: 16px; } .vision-core .vision-core-img { width: 46px; } .vision-adv { padding: 10px 140px 0 30px; } .vision-adv h2 { font-size: 26px !important; } .vision-tech .vision-tech-img { width: 66px; } .vision-tech .vision-tech-title { margin-top: 20px; font-size: 22px; } .vision-tech2 .vision-tech2-title { margin-top: 16px; font-size: 22px; } .vision-scene { padding: 0 30px; } .article .post p { font-size: 12px !important; line-height: 20px !important; } .article .post h3, .article .post h4 { font-weight: 600 !important; } .cockpit-video video { width: 100%; height: 420px; } } @media(min-width:760px) { .slides-img .slogan, .slides-video .slogan { width: 68%; } .slides-img { height: 418px } .slogan .small { font-size: 12px; line-height: 32px; margin: 14px 0 18px 0; opacity: 0.9; } .slogan .big { font-size: 32px; letter-spacing: 1.2px; } .slogan .big a { color: #fff; } .vision-core { font-size: 16px; } .vision-core .vision-core-img { width: 46px; } .vision-adv { padding: 10px 140px 0 30px; } .vision-adv h2 { font-size: 26px !important; } .vision-tech .vision-tech-img { width: 66px; } .vision-tech .vision-tech-title { margin-top: 20px; font-size: 22px; } .vision-tech2 .vision-tech2-title { margin-top: 16px; font-size: 22px; } .vision-scene { padding: 0 30px; } .article .post p { font-size: 12px !important; line-height: 20px !important; } .article .post h3, .article .post h4 { font-weight: 600 !important; } .cockpit-video video { width: 100%; height: 420px; } } @media(min-width:1000px) { .slides-img .slogan, .slides-video .slogan { width: 68%; } .slides-img { height: 445px } .slogan .small2 { font-size: 14px; line-height: 32px; margin: 16px 0 20px 0; opacity: 0.9; } .slogan .big2 { font-size: 32px; font-family: PingFang SC; } } @media(min-width:1200px) { .slides-img .slogan, .slides-video .slogan { width: 68%; } .product-bg { height: 620px; } .padding-large { padding: 30px 20px 25px 20px; } .slides-img { height: 445px } .slogan .small2 { font-size: 16px; line-height: 32px; margin: 18px 0 22px 0; opacity: 0.9; letter-spacing: 2px; } .slogan .small { width: 81%; font-size: 16px; } .slogan .big2 { font-family: PingFang SC; font-size: 44px; letter-spacing: 4px; } .slogan { margin-left: 35px; } .button-large { padding: 8px 20px; font-size: 12px; } .home-about .about_data_area { display: grid; grid-gap: 20px; grid-template-columns: repeat(auto-fill, minmax(172px, 1fr)); } .step-box .step-item { width: 320px; } .vision-core { font-size: 16px; } .vision-core .vision-core-img { width: 46px; } .vision-adv { padding: 10px 140px 0 30px; } .vision-adv h2 { font-size: 28px; } .vision-tech .vision-tech-img { width: 66px; } .vision-tech .vision-tech-title { margin-top: 20px; font-size: 22px; } .vision-tech2 .vision-tech2-title { margin-top: 16px; font-size: 22px; } .vision-scene { padding: 0 30px; } .article .post p { font-size: 12px !important; line-height: 20px !important; } .article .post h3, .article .post h4 { font-weight: 600 !important; } .cockpit-video video { width: 100%; height: 420px; } } @media(min-width:1500px) { .slides-img .slogan, .slides-video .slogan { width: 61%; } .product-bg { height: 620px; } .padding-large { padding: 30px 20px 25px 20px; } .slides-img { height: 534px; } .slogan .small { font-size: 16px; } .slogan .big2 { font-family: PingFang SC; font-size: 55px; letter-spacing: 4px; } .slogan .small2 { font-size: 18px; } .slogan { margin-left: 0px; } .step-box .step-item { width: 320px; } .vision-core { font-size: 16px; } .vision-core .vision-core-img { width: 46px; } .vision-adv { padding: 10px 140px 0 30px; } .vision-adv h2 { font-size: 28px; } .vision-tech .vision-tech-img { width: 66px; } .vision-tech .vision-tech-title { margin-top: 20px; font-size: 22px; } .vision-tech2 .vision-tech2-title { margin-top: 16px; font-size: 22px; } .vision-scene { padding: 0 30px; } .article .post p { font-size: 12px !important; line-height: 20px !important; } .article .post h3, .article .post h4 { font-weight: 600 !important; } .cockpit-video video { width: 100%; height: 540px; } } @media(min-width:1600px) { .slides-img .slogan, .slides-video .slogan { width: 61%; } .product-bg { height: 760px; } .slides-img { height: 600px } .slogan .small2 { font-size: 24px; line-height: 32px; margin: 20px 0 24px 0; opacity: 0.9; letter-spacing: 2px; } .slogan .small { width: 70%; } .slogan { margin-left: -20px; } .slogan .big2 { font-family: PingFang SC; font-size: 64px; letter-spacing: 4px; } .button-large { padding: 12px 40px; font-size: 16px; } .home-about .about_data_area { display: grid; grid-gap: 20px; grid-template-columns: repeat(auto-fill, minmax(214px, 1fr)); } .step-box .step-item { width: 395px; } .vision-core { width: 25%; line-height: 30px; position: absolute; left: 35%; top: 25%; color: #fff; font-size: 20px; font-weight: 500; } .vision-core .vision-core-img { width: 76px; } .vision-core .vision-core-title { margin-top: 24px; } .vision-adv { padding: 50px 220px 0 120px; } .vision-tech { width: 80%; line-height: 50px; position: absolute; left: 8%; top: 15%; } .vision-tech .vision-tech-img { width: 90px; } .vision-tech .vision-tech-title { margin-top: 24px; font-size: 25px; font-weight: 600; } .vision-tech2 { width: 80%; line-height: 50px; position: absolute; left: 10%; top: 10%; } .vision-tech2 .vision-tech2-title { margin-top: 48px; font-size: 25px; font-weight: 600; } .vision-scene { padding: 0 50px; } .article .post p { font-size: 14px !important; } .article .post h3, .article .post h4 { font-weight: 600 !important; } .cockpit-video video { width: 100%; height: 750px; } } /* @media(min-width:2000px) { .slides-img {height:1100px} .slides-img .slogan{ color: #fff; padding-top: 400px; } .slides-img .slogan .small{ font-size: 24px; line-height: 80px; opacity: 0.9; } .slides-img .slogan .big{ font-size: 48px; font-weight: 600; } } */ /* 首页业务板块 */ @media(max-width:760px) { .technology .item .img { width: 165px; height: 165px } } @media(min-width:760px) { .technology .item .img { width: 165px; height: 165px } } @media(min-width:1000px) { .technology .item .img { width: 228px; height: 228px } } @media(min-width:1200px) { .technology .item .img { width: 278px; height: 278px } } .technology .item .img img { width: 100%; } .technology .item h2 { font-weight: 600; margin-top: 30px; transition: margin 0.1s linear; } .technology .item:hover h2 { margin-top: 0; } .technology .item .info { padding: 20px; margin-top: 80px; opacity: 0.6; transition: margin 0.2s linear; } .technology .item:hover .info { margin-top: 0; } .technology .item .info span { display: inline-block; width: 46%; text-align: center; margin-bottom: 16px; } .diy-padmove { width: 100%; height: 110px; margin-bottom: 20px; overflow: hidden; } /* 技术底座 */ .diy-videobox { position: relative; overflow: hidden; } .diy-videobox .video-js { width: 100%; } .diy-videobox .div-abtitle { width: 100%; position: absolute; z-index: 9; } .diy-ctrl { width: 48px; height: 48px; position: absolute; bottom: 20px; right: 20px; cursor: pointer; } .diy-ctrl.off { background: url(../images/off.png); background-size: 100% 100%; } .diy-ctrl.on { background: url(../images/on.png); background-size: 100% 100%; } .sub_jindian { text-align: left; } .sub_jindian li { display: inline-block; height: 42px; line-height: 42px; ; margin-right: 72px; cursor: pointer; font-size: 16px; } .sub_jindian li.active { border-bottom: 2px solid #009FE7; color: #009FE7; } .partners-banner { position: relative; overflow: hidden; display: flex; height: 83px; margin-bottom: 20px; } .partners-banner .slides-partners { display: flex; flex-shrink: 0; width: 100%; height: 100%; } .partners-banner .slides-partners .slides-wrapper { display: flex; flex-wrap: nowrap; flex-shrink: 0; } .partners-banner .slides-partners .slides-wrapper .slides-brand { width: 140px; height: 83px; margin-right: 45px; } .brandbox1 { width: 100%; } .partners-banner .slides-partners .slides-wrapper .slides-brand .brandbox1 img { width: 100%; height: 100%; } .brandbox1 ul { display: grid; grid-gap: 20px; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); } .brandbox1 ul li { height: 90px; cursor: pointer; } .brandbox1 ul li:hover { box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.08); } .brandbox1 ul li img { width: 100%; height: 100%; object-fit: cover; } @keyframes case-move { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } } .sub_jindian.imageson { text-align: left; padding-left: 10px; } .diy-media-img {} .diy-media-img .diy-media-img-box { display: block; width: 100%; overflow: hidden; } .diy-media-img .linear-link {} .diy-media-img:hover { /* margin-top: -10px; margin-bottom: 40px; */ } .diy-media-img img { transition: transform 0.2s; width: 100%; } .diy-media-img img:hover { transform: scale(1.1) } .diy-media-img .linear-link .subtitle { padding: 18px; } .diy-media-img .linear-link .subtitle h3 { display: block; color: #3e3e3e; font-size: 18px; height: 32px; line-height: 32px; overflow: hidden; font-weight: 500; } .diy-media-img .linear-link .subtitle p { display: block; height: 84px; line-height: 28px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; /* 设置最大显示行数 */ -webkit-box-orient: vertical; text-overflow: ellipsis; } .diy-more { display: block; width: 148px; height: 48px; } .diy-more img { width: 100%; height: 100%; } .toolfix { width: 48px; position: fixed; bottom: 100px; right: 32px; z-index: 999; } .toolfix .item { display: block; width: 40px; height: 40px; margin-top: 12px; border-radius: 8px; box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, .1); opacity: 0.9; } .toolfix .item.up { background: url(../images/tool1_up.png); background-size: 100% 100%; display: none; } .toolfix .item.weixin { background: url(../images/tool1_wx_act.png); background-size: 100% 100%; } .toolfix .item.zixun { background: url(../images/tool1_zx_act.png); background-size: 100% 100%; } .toolfix .item.up:hover { background: url(../images/tool1_up_act.png); background-size: 100% 100%; } .toolfix .item.weixin:hover { background: url(../images/tool1_wx_act.png); background-size: 100% 100%; } .toolfix .item.zixun:hover { background: url(../images/tool1_zx_act.png); background-size: 100% 100%; } .wehover { display: none; position: fixed; right: 90px; bottom: 24px; border-radius: 8px; box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, .1); background: #fff; width: 298px; height: 168px; padding: 16px; } .wehover .eq { width: 116px; float: left; text-align: center; margin-left: 6px; margin-right: 10px; font-size: 14px; color: #515A6E; line-height: 24px; } .wehover .eq img { width: 100%; } .quotation { padding: 40px 60px; } .quotation .quotation-head { line-height: 48px; padding-bottom: 10px; } .quotation .shares-data span { padding-right: 10px; } .quotation .quotation-body .text-small { margin-top: 10px; } .quotation .text-large { font-size: 72px; } .quotation .text-big { font-size: 28px; } .quotation .quotation-foot .x6 { padding-bottom: 20px; line-height: 28px; } /* 常用TAB */ .tab-normal .tab-head { border-radius: 0; font-size: 0; -webkit-text-size-adjust: none; width: 100%; } .tab-normal .tab .tab-nav li { display: inline-block; width: auto; text-align: center } .tab-normal .tab .tab-nav li a { background: #fff; color: #6e6e6e; border-radius: 30px; padding: 0px 20px; height: 42px; line-height: 42px; margin: 0 10px; display: block; border: 0; font-size: 16px; } .tab-normal .tab .tab-nav .active a { background: linear-gradient(-45deg, #009FE7, #009FE7); cursor: default; color: #fff; border-bottom: 0px solid #FD3C6B; } .tab-normal .tab .tab-nav .active { background: none } .tab-normal .tab .tab-nav .active a:hover { color: #FFF } .tab-normal .tab .tab-nav li a:focus { outline: none; } .tab-normal .tab .tab-nav li a:hover { background: linear-gradient(-45deg, #FFD100, #009FE7); color: #fff } .tab-normal .tab .tab-body { padding: 0; border-radius: 0; border-top: 0px solid #ff0000 } /* 常用TAB */ /* 首页产品 */ .carousel-pro .media { position: relative; -webkit-transition: .5s; transition: .5s; } .carousel-pro .button { background-color: #009FE7; transition: all .5s ease; box-shadow: 0 3px 8px 0px rgba(39, 39, 39, 0.26); } .carousel-pro .media:hover .button { color: #FFF; background-color: #009FE7; transition: all .5s ease; } .carousel-pro .media-body { padding: 10px 0 0 0 } /* .carousel-pro:hover .owl-nav .owl-next,.carousel-pro:hover .owl-nav .owl-prev{opacity:.6} */ .carousel-pro.dot-center .owl-dots { position: relative; top: 30px; padding: 0; text-align: center; vertical-align: middle; display: inline-block; width: 100% } .carousel-pro2.dot-center .owl-dots { position: relative; top: 30px; padding: 0; text-align: center; vertical-align: middle; display: inline-block; width: 100% } .carousel-post .media { position: relative; -webkit-transition: .5s; transition: .5s; } .carousel-post .button { background-color: #009FE7; transition: all .5s ease; box-shadow: 0 3px 8px 0px rgba(39, 39, 39, 0.26); } .carousel-post .media:hover .button { color: #FFF; background-color: #009FE7; transition: all .5s ease; } .carousel-post .media-body { padding: 10px 0 0 0 } /* .carousel-pro:hover .owl-nav .owl-next,.carousel-pro:hover .owl-nav .owl-prev{opacity:.6} */ .carousel-post.dot-center .owl-dots { position: relative; top: 30px; padding: 0; text-align: center; vertical-align: middle; display: inline-block; width: 100% } .carousel-post.dot-center .owl-dots { position: relative; top: 30px; padding: 0; text-align: center; vertical-align: middle; display: inline-block; width: 100% } /* 首页产品 */ /* 首页解决方案 */ .diy-jdal { margin-left: -10px; margin-right: -10px; } .solution .media-img { position: relative; overflow: hidden; } .solution .media-img .mask { opacity: 0; z-index: 3; background: url(../images/solution-hover.png) no-repeat center center; width: 100%; height: 100%; position: absolute; bottom: 0; top: 0; left: 0; right: 0; transition: 0.3s; } .solution .media-img .mask .subtitle { padding: 25px } .solution .media-img .mask .more { position: absolute; bottom: 25px; right: 25px } .solution .media-img:hover .mask { z-index: 5; transition: 0.3s; opacity: 1; transform: scale(1.1); } .solution .media-img .linear-link { z-index: 1; opacity: 1; background: linear-gradient(to bottom, rgba(0, 0, 0, .2) 65%, rgba(0, 0, 0, .8) 100%); width: 100%; height: 100%; position: absolute; bottom: 0; top: 0; left: 0; right: 0; transition: 0.3s; } .solution .media-img .subtitle { padding: 0 25px; z-index: 3; width: 100%; bottom: 5px; left: 0; position: absolute; transition: 0.3s; } .solution .media-img .img-responsive { transition: all 0.2s; } .solution .media-img .img-responsive:hover { transform: scale(1.2); } .solution_bg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: -1; } /* 首页解决方案 */ .cases .owl-item .item a { width: 100%; height: 100%; overflow: hidden; display: block; } .cases .img-responsive { transition: all 0.2s; } .cases .img-responsive:hover { transform: scale(1.2); } .partners .owl-nav { display: none; } .partners .line-technology { margin: 0 -20px; } /* 首页新闻 */ .home-news-l { margin-right: 10px } .home-news-r { margin-left: 0px } .home-news-h .media-img { position: relative; overflow: hidden; height: 410px; } .home-news-h .media-img .img-responsive { transition: all 0.2s; transform: scale(1.0); } .home-news-h .media-img .img-responsive:hover { transform: scale(1.1); } .home-news-r .x3 { overflow: hidden; } .home-news-r .img-responsive { transition: all 0.2s; transform: scale(1.0); } .home-news-r .img-responsive:hover { transform: scale(1.1); } .home-news-h .media-img .post-title { bottom: 0; left: 0; width: 100%; padding: 20px; position: absolute; color: #333; transition: 0.5s; background-color: rgba(0, 0, 0, .3); } .home-news-h .media-img:hover .post-title { bottom: 20px; } .home-news-h .media-img .post-title h3 a { color: #fff; font-size: 18px; font-weight: 600; line-height: 28px; display: block; } /* .home-news-h .media-img:hover .post-title h3 a {color:#FFF;} */ .home-news-h .button { margin-top: 1rem; width: 48px; line-height: 28px; font-size: 18px; background: #009FE7; color: #fff } .home-news-h .media-img:hover .button { background: #009FE7; color: #fff; } .home-news-c:hover { box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.03); } .home-news-c .news-time { margin: 20px 15px 0 0px; border-right: 2px solid #eee; padding: 0 } .home-news-c .news-time .text-large { font-size: 42px; line-height: 48px; } .home-news-c .news-title { margin-top: 10px; margin-left: 20px } .home-news-c .news-title h2 a { font-weight: 500; font-size: 18px; margin-bottom: 6px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .home-news-c:hover .news-title h2 a { color: #009FE7 } /* 首页新闻 end */ /* 专题模版 */ .overhidden { overflow: hidden; } a.overhidden { display: block; overflow: hidden; } .post .img-responsive { transition: all 0.2s; cursor: pointer; } .post .img-responsive:hover { transform: scale(1.2); } .post .shadow:hover { box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.08); } .post .mb-yycj { /* background:url(../images/xgcp-bg.jpg); background-size: cover; */ background: #F5FBFD; } .post .mb-yycj .owl-carousel .item img { max-height: 400px !important; object-fit: cover; } /* 专题模版 end */ /* 路径 */ .color-f { color: #888888 !important; } .nav-bread-news { padding: 0; height: 36px; line-height: 70px; font-size: 0; } .nav-bread { height: 50px; line-height: 50px; font-size: 0; position: fixed; left: 0; z-index: 50; width: 100%; color: #fff; } .fixed-nav-top { top: 90px; } .nav-bread h2, .nav-bread-news h2 { font-size: 24px; font-weight: 600 } .nav-bread a, .nav-bread-news a { color: #888888; font-size: 12px; display: inline-block; } .nav-bread a { color: #fff; } .nav-bread a:hover { color: #009FE7 } .nav-bread .color-f:after { content: ""; padding: 0 10px; background: url(../images/nav-bread.png) no-repeat center 50%; } .nav-bread a:after { content: ""; padding: 0 10px; background: url(../images/nav-bread.svg) no-repeat center 50%; } .nav-bread a:last-child:after { content: ""; background: none; } .nav-bread-news a:hover { color: #009FE7 } .nav-bread-news a:after { content: ""; padding: 0 10px; background: url(../images/nav-bread.png) no-repeat center 50%; } .nav-bread-news a:last-child:after { content: ""; background: none; } /* 路径 */ /* 上下篇 */ .prenext-pro a.button { height: 70px; line-height: 70px; padding: 0 25px } .prenext-pro a.button:hover { background: #009FE7; color: #fff } .prenext-pro a.border { border-right: 1px solid #f8f8f8 } /*分页 begin*/ .pagination li { margin: 0 5px; font-size: 14px; border: none; border-radius: 4px; } .pagination li a { border-radius: 4px; color: #6e6e6e; background: #fff; padding: 12px 16px; border: 1px solid #DCDCDC; } /* .pagination li i {font-weight:bold;font-size:18px;padding:0 3px} */ .pagination li.active a, .pagination li a:hover { background: #009FE7; color: #fff; border: 1px solid #009FE7; } /*分页 end*/ /* 标题样式-居中 */ .title-c { position: relative; } .title-c h3 { position: relative; color: #333; font-size: 40px; font-family: PingFang SC; text-transform: uppercase; margin: 0 auto 20px auto; font-weight: 500 } .title-c .dan { opacity: 0.6; font-size: 16px; line-height: 28px; } /* 标题样式-左 */ .title-l h2 { line-height: 28px; height: 28px; color: #333; position: relative; font-size: 18px; letter-spacing: 0; padding-left: 20px; margin-bottom: 10px; } .title-l h2:before { content: ''; display: block; position: absolute; width: 5px; height: 20px; top: 4px; background: #009FE7; left: 0 } /* 下拉分类 */ .nav-tree { font-size: 0; height: 70px; line-height: 70px } /*font-size:0去掉 display:inline-block间隔 */ .nav-tree li { position: relative; display: inline-block; } .nav-tree li a { color: #6E6E6E; display: block; padding: 0 30px; font-size: 16px; background: #fff; } .nav-tree li a.active, .nav-tree li a.cur { background: linear-gradient(-45deg, #009FE7, #009FE7); color: #fff } .nav-tree li.focusa a { background: linear-gradient(-45deg, #009FE7, #009FE7); color: #fff; border-bottom-left-radius: 0px; border-bottom-right-radius: 0; } .nav-tree li ul:after { position: absolute; top: -8px; left: 50%; margin-left: -8px; display: inline-block; border-right: 8px solid transparent; border-bottom: 8px solid #fff; border-left: 8px solid transparent; content: ''; } .nav-tree li ul { top: 70px; left: 0; background: #fff; padding: 10px 0; z-index: 99; position: absolute; width: 100%; display: none; border-radius: 0px; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.03); } .nav-tree li ul li { display: block; width: 100%; text-align: left; } .nav-tree li ul li.children a { font-size: 14px; background: #fff; border-radius: 0; box-shadow: none; display: block; color: #6e6e6e; line-height: 34px; height: 34px } .nav-tree li ul li.children a.active, .nav-tree li ul li.children a:hover { color: #009FE7 } /* .nav-tree li ul li.children:first-child a{border-top-left-radius:0px;border-top-right-radius:0px;} .nav-tree li ul li.children:last-child a{border-bottom-left-radius:5px;border-bottom-right-radius:5px;} */ /* 下拉分类 */ /* 属性 */ .filter-box .padding-big { padding: 15px 25px } .filter-box dl { margin: 15px 0; } .filter-box dl dt { width: 8%; display: block; float: left; line-height: 24px; font-weight: normal } .filter-box dl dd { display: block; float: left; position: relative; } .filter-nav ul li { margin: 0; display: block; float: left; width: auto; line-height: 24px; } .filter-nav ul li a { margin: 0 10px 0 0; padding: 2px 10px; cursor: pointer; display: block; color: #6E6E6E; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; } .filter-nav ul li a:hover { color: #009FE7; } .filter-nav ul li a.active { color: #fff; background: #ff9600 } .filter-nav ul li b { font-weight: normal; } /* 横向不带ICO导航 */ .nav-x { background: #fff; width: 100%; position: relative; } .nav-x .menu-toggle h3 { display: none } .nav-x ul { font-size: 0; -webkit-text-size-adjust: none; text-align: center } .nav-x li { display: inline-block } .nav-x li i { margin: 0px auto 5px auto; font-size: 24px; display: block; } .nav-x li a { font-size: 16px; padding: 0; height: 70px; line-height: 70px; color: #6e6e6e; text-align: center; display: block; } .nav-x li a:hover { color: #009FE7 } .nav-x li a.active { background: linear-gradient(-45deg, #009FE7, #009FE7); color: #fff } .col-2 { width: 14% } /* 横向不带ICO导航 */ /* 新闻列表 */ .list-news { margin-bottom: 30px } .list-news .time { margin-top: 70px; margin-right: -20px; padding: 15px 0 10px 0; border-right: 1px solid #eee; } .list-news .time .text-large { font-size: 52px; line-height: 54px; } .list-news .news { margin-top: 70px; margin-left: 50px; margin-right: 30px } .list-news .news h3 a { display: block; font-size: 24px; color: #333; margin-bottom: 20px } .list-news .button { margin-top: 70px; width: 70px; line-height: 56px; font-size: 24px; border: 1px solid #ebebeb; } .list-news:hover .button { background: #009FE7; color: #fff; border: 1px solid #009FE7 } .list-news:hover h3 a { color: #009FE7 } .list-news .media-img img { display: block; max-height: 260px; min-height: 240px; object-fit: cover; } /* 新闻列表 */ /* 纯文字列表 begin*/ .list-post-text li { padding: 5px 0; } .list-post-text li a { display: block; } .list-post-text li.dot a { padding-left: 15px; position: relative; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .list-post-text li.dot:hover a:before { background: #009FE7; } .list-post-text li.dot a:before { content: ''; position: absolute; left: -2px; background: #ccc; width: 6px; height: 6px; top: 9px; border-radius: 50% } /* 纯文字列表 end*/ /* 下载列表 */ .normal-list li { position: relative; display: block; background: #FFF; margin-bottom: 20px; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; } .normal-list li a { display: block; font-size: 16px; line-height: 24px; padding: 25px 140px 25px 50px; color: #333; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; } .normal-list li span { color: #888888; position: absolute; right: 30px; top: 28px } .normal-list li:hover { background: #009FE7; color: #FFF; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; } .normal-list li:hover a, .normal-list li:hover span { color: #FFF } .normal-list li.dot:hover a:before { background: #fff; } .normal-list li.dot a { position: relative } .normal-list li.dot a:before { content: ''; position: absolute; left: 30px; background: #ececec; width: 7px; height: 7px; top: 35px; border-radius: 50% } /* 下载详细页begin */ .download-detail { position: relative; z-index: 3 } .download-detail .button-big { padding: 15px 25px } /* 下载详细页end */ /* ===视频教程 beign*/ /* ====视频教程列表 begin*/ .video-list .media { -webkit-transition: .5s; transition: .5s; } .video-list .media:hover { box-shadow: 0 30px 50px rgba(229, 229, 229, .8) } .video-list .media-img { position: relative; overflow: hidden } .video-list .media-body .padding-big { padding: 20px } .video-list .media-body h2 { margin: 0 0 20px 0; overflow: hidden } .video-list .media a.play { opacity: .6; position: absolute; top: 50%; left: 50%; margin-left: -24px; margin-top: -24px; width: 48px; height: 48px; line-height: 48px; background: rgba(0, 0, 0, .6); z-index: 2; -webkit-transition: .5s; -o-transition: .5s; transition: .5s } .video-list .media .playtime { position: absolute; bottom: 10px; right: 10px; padding: 0 8px; height: 20px; line-height: 18px; background: rgba(0, 0, 0, .5); z-index: 2; -webkit-transition: .5s; -o-transition: .5s; transition: .5s } .video-list .media:hover a.collect, .video-list .media:hover a.play { opacity: 1; -webkit-transition: .5s; -o-transition: .5s; transition: .5s } .video-list .excerpt-info ul li.v2-1 { width: 50% } .video-list .excerpt-info ul li.v2-2 { width: 50%; } /* 视频教程列表 end*/ /* =====视频内容页 */ .video-detail .tab-head { border-radius: 0; font-size: 0; -webkit-text-size-adjust: none; padding-left: 25px; border-bottom: 1px solid #EFEFEF } .video-detail .tab .tab-nav li { display: inline-block; width: 13%; margin: 0 } /* .video-detail .tab .tab-nav li:last-child {margin-right:0px} */ .video-detail .tab .tab-nav li a { color: #616770; padding: 18px 0; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; display: block; line-height: 20px; font-weight: 500; border-radius: 0; font-size: 16px; text-align: center; } .video-detail .tab .tab-nav .active { border-radius: 0px; } .video-detail .tab .tab-nav .active a { margin-bottom: -1px; cursor: default; background: #FFF; border-bottom: 2px solid #009FE7; font-weight: 600 } .video-detail .tab .tab-nav li a, .video-detail .tab .tab-nav .active a:focus { outline: none; } .video-detail .tab .tab-body { border-radius: 0; border-top: solid 0px #ebebeb; padding: 25px } /* ======播放器 */ .jw-video-expense { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #616770; z-index: 1; display: none } .jw-video-expense .apply { position: absolute; left: 50%; margin-left: -176px; top: 50%; margin-top: -50px } .jw-video-expense .button { cursor: pointer } .video-period .price { font-size: 32px; margin-top: 5px } .video-buy-now { cursor: pointer; width: 130px; float: right } .video-free-now { width: 130px; padding: 10px 0; float: right } .video-title h1 { font-size: 24px; display: block; } .video-period-title { padding: 15px 10px 15px 20px } .video-period-list { overflow: hidden; height: 410px; overflow-y: auto } .video-period-list li { height: 69px; width: 100%; border-bottom: 1px #433D3D solid; position: relative; text-align: left } .video-period-list li a { display: block; padding: 8px 10px 8px 50px } .video-period-list li a.cur { background: #2D2D2D; display: block; } .video-period-list li:hover { background: #2D2D2D; } .video-period-list li p { font-size: 14px; color: #888888; text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .video-period-list li:before { content: ""; position: absolute; width: 20px; height: 13px; left: 18px; top: 15px; background: url(../images/video-ico.png) no-repeat; z-index: 4 } .video-period-list li .video-info { padding-top: 8px; position: relative; color: #616770 } .video-period-list li .video-info span { position: absolute; right: 0; width: 62px; text-align: right } .video-period-list li:last-child { border-bottom: none } .video-content-tit { padding: 5px 30px 0; line-height: 50px; border-bottom: 1px solid #ECEFF5 } .video-content-tit h2 { font-size: 18px; color: #434C5A; border-bottom: 1px solid #434C5A; display: block; width: 72px; margin-bottom: -1px } /* 播放器 end*/ /* 视频内容页end */ /* 视频教程 end*/ /* 横向左图右字列表 begin*/ .list-post-x .media { margin-bottom: 20px } .list-post-x .media.border { border: 0; border-bottom: 1px solid #ECEFF5; padding-bottom: 20px } .list-post-x .media img { transition: all .3s ease-out } .list-post-x .media .thumb-md { position: relative; max-width: 100px; overflow: hidden } .list-post-x .media .thumb-md .playtime { position: absolute; bottom: 5px; right: 5px; padding: 0 5px; height: 20px; line-height: 18px; background: rgba(0, 0, 0, .6); z-index: 3; -webkit-transition: .5s; -o-transition: .5s; transition: .5s } .list-post-x .media .thumb-md .playicon { position: absolute; bottom: 5px; left: 5px; width: 20px; height: 20px; line-height: 18px } .list-post-x .media:hover img { transition: all .3s ease-out; transform: scale(1.1) } .list-post-x .media.media-x .float-left { margin-right: 15px } .list-post-x .media.media-x .float-right { margin-left: 15px } .list-post-x .media.media-x .media-body { text-align: left; padding: 0 } .list-post-x .media a:hover { color: #434C5A } .list-post-x .media-body p { color: #888888; line-height: 22px } .list-post-x .media:last-child { margin-bottom: 0 } /* 横向上图下字列表 end * /* 内容 begin */ /* .article .post .container{padding: 0 80px 0 80px;} */ .article { overflow: hidden } /* .article .post .mb-yycj .owl-carousel{padding: 0 120px 0 120px;} */ .article .padding-large { padding: 30px 50px } .article .post h1 { font-weight: 500; } .article .post h1 a { color: #fff; } .article .post h2 { font-size: 32px; font-family: PingFang SC; font-weight: 500; margin: 10px 0 } .article .post h3 { font-size: 24px; font-weight: 500; margin: 10px 0 } .article .post h4 { font-size: 18px; font-weight: 400; margin: 10px 0 } .article .post hr { margin: 10px 0; height: 1px } .article .post strong { margin: 10px 0 } .article .post .ld-table { width: 80%; margin: 20px auto; padding-bottom: 40px; border: 1px solid #ccc; } .article .post .ld-table td { padding: 20px; border: 1px solid #ccc; } .article .post table { margin: 20px 0 } .article .post table th { background: #daf0fd; color: #fff; border: 1px solid #fff } .article .post table tr.ue-table-interlace-color-single { background: #daf0fd } .article .post p { font-size: 14px; line-height: 28px; margin-bottom: 10px; } .article .post img { max-width: 100%; height: auto !important; } .article .post a { text-decoration: none; margin-top: 20px; } .article .post .text-right { text-align: right } .article .post ul li { padding: 0 0 5px 20px; position: relative; font-size: 16px } .article .post ul li p { line-height: 24px } .article .post ul li:before { content: ''; position: absolute; top: 8px; left: 0; background: #888888; width: 7px; height: 7px; border-radius: 50% } .article .post ol { padding: 10px 0 0 0 } .article .post ol.list-paddingleft-2 { position: relative } .article .post ol li { padding: 0; position: relative } .article .post ol li p { line-height: 26px; font-size: 16px; color: #888888 } /* 内容 end */ /* 产品列表*/ .product-list .media { -webkit-transition: .3s; transition: .3s; } .product-list .media:hover { -webkit-transition: .3s; transition: .3s; box-shadow: 0 5px 20px 5px rgba(0, 0, 0, .05); } .product-list .media-body { padding: 10px 0 0 0 } .product-list .media:hover .media-body h2 a { color: #009FE7; } .price-info ul li.v2-1 { width: 50% } .price-info ul li.v2-2 { width: 50%; } /*产品列表*/ /* 产品详细页begin */ .product-description .padding-large { padding: 30px 0 0 30px } .product-description .padding-large-top { padding: 0 } .product-description p { line-height: 24px } .product-description .zoomimg { width: 474px } /* PC端独有 */ /* 产品详情TAB begin */ .product-overview .tab-head { border-radius: 0; font-size: 0; -webkit-text-size-adjust: none; width: 100%; border-bottom: 1px solid #EFEFEF } .product-overview .tab .tab-nav li { display: inline-block; width: 12%; } .product-overview .tab .tab-nav li a { margin-bottom: -1px; color: #6E6E6E; padding: 20px 0; display: block; line-height: 24px; border: 0; border-radius: 0; font-size: 18px; text-align: center; } .product-overview .tab .tab-nav .active { border-radius: 0px; } .product-overview .tab .tab-nav .active a { cursor: default; color: #009FE7; background: #FFF; border-bottom: 3px solid #009FE7; } .product-overview .tab .tab-nav li a, .product-overview .tab .tab-nav .active a:focus { outline: none; } .product-overview .tab .tab-body { padding: 0; border-radius: 0; border-top: solid 0px #ebebeb; } /* 产品详情TAB END */ /* 放大镜 begin */ #zoomimg { cursor: pointer; display: block } .pro-thumb .item img { border: 1px solid #ececec } .pro-thumb .item:hover img { border: 1px solid #009FE7 } .pro-thumb:hover .owl-nav .owl-prev, .pro-thumb:hover .owl-nav .owl-next { opacity: .6; } /* 放大镜 end */ /* 商品参数 */ .attribute li { position: relative; color: #666; line-height: 32px; } /* .attribute li:before {content:'';position:absolute;left:0px;background:#ccc;width:6px;height:6px;top:11px;border-radius:50%;} */ .attribute li span { color: #999 } /* 商品参数 end */ /* 商品详情 */ .content img { max-width: 100% !important; height: auto !important; } /* 商品详情 end */ /* 产品详细页end */ .job-list { transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; } .job-list:hover { box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3); transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; } .job-list dt { font-weight: normal } /* 弹出层*/ .dialog { border-radius: 0; border: 0 solid #ebebeb; margin: 0 auto; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3); } .dialog .dialog-head { font-size: 18px; border-bottom: 0; background: #FFF; color: #383838; } .dialog .dialog-head .close { float: right; line-height: 24px } .dialog .dialog-body { padding: 10px 40px 40px 40px; } .dialog-body h3 { font-size: 24px; font-weight: 600; color: #333; margin-bottom: 10px } .dialog-body .form-group { padding-bottom: 20px } .dialog-body .input { height: 48px; line-height: 24px; padding: 0 12px; border: 1px solid #ebebeb; width: 100%; display: block; border-radius: 0px; -webkit-appearance: none; box-shadow: 0 0px 0px rgba(0, 0, 0, 0.0) inset; background: transparent; } .dialog-body .textarea { padding: 10px 12px; line-height: 24px; width: 100%; background: transparent; border: 1px solid #ebebeb; } .dialog-body .label { padding-bottom: 10px; display: block; line-height: 24px; } .dialog-body .label label { font-weight: 400; } .dialog-body select { padding: 0 30px 0 8px; color: #ADADAD; border-radius: 0px; width: 100%; height: 48px; line-height: 48px; border: solid 1px #ebebeb; appearance: none; -moz-appearance: none; -webkit-appearance: none; background: url(../images/select-down.png) no-repeat right 50%; } .dialog-body .form-tips .dialog-body .input-help ul { border: solid 0px #ebebeb; background: #fff; padding: 5px 10px; box-shadow: 0 0 0 #fff; border-radius: 0 0 4px 4px; width: 150px; min-width: 150px; width: auto; _width: 150px; color: #EE3333; font-size: 12px } .dialog-body .input::-webkit-input-placeholder, .dialog-body .textarea::-webkit-input-placeholder { color: #6E6E6E; } .dialog-body .input:-moz-placeholder, .dialog-body .textarea:-moz-placeholder { color: #6E6E6E; } .dialog-body .input::-moz-placeholder, .dialog-body .textarea::-moz-placeholder { color: #6E6E6E; } .dialog-body .input:-ms-input-placeholder, .dialog-body .textarea:-ms-input-placeholder { color: #6E6E6E; } .dialog-body .input-group .addon { background-color: #fff; border: 0px solid #EBEBEB; border-radius: 0px; line-height: 1; padding: 0; text-align: center } .dialog-body .input-group .addon img { max-height: 50px } /* 弹出层 end*/ /* 联系我们begin */ .inside h2 { font-size: 36px; font-weight: 400; margin-bottom: 20px } .inside .contact { padding: 0 0 50px 0; } .inside .contact hr { height: 1px; background: #F2F2F2 } .inside .contact .media { margin: 0; padding: 0 0 30px 0; } .inside .contact .media span { width: 42px; height: 42px; line-height: 64px; } .inside .contact .media i { font-size: 36px; } .inside .contact .media .media-body { padding: 0 0 0 10px; margin-top: 0px; } .inside .contact .media .media-body a, .inside .contact .media .media-body p { color: #333; } .inside .wx { border: 1px solid #eee; padding: 20px 30px; } .home-contact { background: url(../images/bg_jdal.jpg); background-size: 100% 100%; } .home-contact .title { position: relative; width: 590px; float: right; text-align: left; } .home-contact .title h2 { font-size: 64px; line-height: 64px; padding-top: 25%; padding-right: 50px; padding-bottom: 30px; } .home-contact .title h2 span { color: #009FE7 } .home-contact .title a { font-size: 24px; text-decoration: none; border-bottom: 2px solid #009FE7; color: #FFF; } .home-contact .title a:hover { border-bottom: 0 solid #82CC37; } .home-contact .gb { position: relative; width: 590px; margin: 0 auto; } /*guestbook*/ .guestbook { padding: 100px 50px; } .guestbook h2 { font-size: 24px; font-weight: 600; color: #17233d; } .guestbook h5 { color: #515A6E; line-height: 40px; } .guestbook .padding { padding: 50px; } .guestbook .form-group { padding-bottom: 20px } .guestbook .input { font-size: 16px; padding: 0 15px; height: 50px; line-height: 50px; border: 0; width: 100%; display: block; -webkit-appearance: none; transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1) 0s; box-shadow: 0 0px 0px rgba(0, 0, 0, 0.0) inset; border: 1px solid #DCDEE2; } .guestbook .textarea { padding: 12px; line-height: 24px; width: 100%; font-size: 16px; background: #fff; border: 0; border: 1px solid #DCDEE2; } .guestbook .label { display: block; line-height: 24px; } .guestbook .label label { font-weight: 400; } .guestbook .field { font-size: 16px } .guestbook select { font-size: 16px; padding: 0 35px 0 15px; width: 100%; height: 50px; line-height: 50px; border: 0; appearance: none; -moz-appearance: none; -webkit-appearance: none; background: #fff url(../images/select-down.png) no-repeat right 50%; color: #666; border: 1px solid #DCDEE2; } .guestbook .form-tips .guestbook .input-help ul { border: 0; background: #fff; padding: 5px 10px; box-shadow: 0 0 0 #fff; border-radius: 0 0 4px 4px; width: 150px; min-width: 150px; width: auto; _width: 150px; color: #EE3333; font-size: 12px } .guestbook .input::-webkit-input-placeholder, .guestbook .textarea::-webkit-input-placeholder { color: #ccc; font-size: 16px; } .guestbook .input:-moz-placeholder, .guestbook .textarea:-moz-placeholder { color: #111; font-size: 16px; } .guestbook .input::-moz-placeholder, .guestbook .textarea::-moz-placeholder { color: #111; font-size: 16px; } .guestbook .input:-ms-input-placeholder, .guestbook .textarea:-ms-input-placeholder { color: #111; font-size: 16px; } /* 联系我们end */ .channel-banner { height: 400px; position: relative; background-repeat: no-repeat; background-position: center center; background-size: cover; margin: 0; padding: 0; } .channel-banner .banner-info { position: absolute; top: 50%; margin-top: -110px; left: 0; right: 0; z-index: 3 } .channel-banner .banner-info h3 { font-size: 40px; font-weight: 600; position: relative; margin-bottom: 30px } .channel-banner .banner-info h3:before { left: 50%; margin-left: -15px; bottom: -10px; width: 30px; height: 3px; background: #009FE7; content: ''; display: block; position: absolute; } .channel-banner .banner-info p { font-size: 36px; } /* 底部地图版权 begin*/ footer { padding: 0 0 0 0; } footer h3 { font-weight: 700; color: #fff } footer ul li.item-1 { width: 26% } footer ul li.item-5 { width: 21% } footer ul li.item-2 { width: 14% } footer ul li.item-3 { width: 14% } footer ul li.item-4 { width: 14% } footer ul li.item-6 { width: 32% } /* footer ul li.item-7 {width:10%} */ footer ul li ul li a { line-height: 32px; color: #C5C8CE; } footer ul li ul li a:hover, footer .contact .media .media-body a:hover { color: #fff; } footer .contact { padding-top: 3px } footer .contact .media { margin: 0 0 5px 0; padding: 0 0 10px 0; } footer .contact .media span { width: 24px; height: 24px; } footer .contact .media i { line-height: 24px; } footer .contact .media .media-body a, footer .contact .media .media-body { padding: 0; color: #C5C8CE; line-height: 24px; } footer .qr { margin-left: 20px; background: #26293E; } footer .qr img { width: 100% } footer .copyright { padding: 20px 0 60px 0; color: #C5C8CE; border-top: 1px solid #404040; font-size: 12px; text-align: center; } footer .copyright a { margin-left: 5px; color: #C5C8CE } footer .tab-head { border-radius: 0; font-size: 0; -webkit-text-size-adjust: none; padding: 0; border-bottom: 1px solid #404040 } footer .tab .tab-nav li { display: inline-block; width: auto; margin: 0 20px 0 0 } footer .tab .tab-nav li a { color: #888; padding: 10px 0; border: 0; border-bottom: 1px solid transparent; margin-bottom: -1px; display: block; line-height: 20px; border-radius: 0; font-size: 16px; } footer .tab .tab-nav .active { border-radius: 0px; } footer .tab .tab-nav .active a { margin-bottom: -1px; cursor: default; border-bottom: 1px solid #009FE7; } footer .tab .tab-nav li a, footer .tab .tab-nav .active a:focus { outline: none; } footer .tab .tab-body { border-radius: 0; border-top: solid 0px #ebebeb; padding: 25px 0 } footer .tab .tab-body .flink a { display: inline-block; margin-right: 15px; line-height: 24px } footer .tab .tab-body .flink a img { width: 110px; height: 58px; } footer .mycontact { background: url(../images/mycontact-bg.png) right; background-size: cover; } footer .mycontact .dan { color: white; opacity: 0.65; } /* 文字渐变样式(你上面用到的) */ .text-gradient { background: linear-gradient(159deg, #ffffff 36%, #00e1ff 100%); -webkit-background-clip: text; background-clip: text; color: transparent; } .btn-join { display: inline-flex; align-items: center; gap: 12px; padding: 10px 40px; font-size: 16px; color: #ffffff; /* 胶囊圆角 */ border-radius: 999px; background-color: #0f5b9c; /* 青蓝色外描边+发光,模拟图中淡青色外圈 */ box-shadow: 0 0 0 2px #40c8e8; text-decoration: none; transition: all 0.25s ease; } .btn-join img { width: 18px; height: 18px; } .btn-join:hover { background-color: #0b487c; box-shadow: 0 0 0 2px #58d4f0, 0 0 12px rgba(64, 200, 232, 0.45); } /* 产品卡片模块 */ /* ===== 外层:所有产品卡片的大网格 ===== */ .product-section { padding: 60px 20px; background-color: #f6fcff; } .section-title { text-align: center; font-size: 42px; color: #222; font-weight: 600; } .product-grid { display: grid; /* 原图是2列布局 */ grid-template-columns: 1fr 1fr; gap: 24px; } /* 第一个卡片【边缘压缩前端】跨2列 */ .product-card.card-colspan-2 { grid-column: 1 / -1; } /* ===== 卡片内部:产品图片横向排列,用flex,不是grid ===== */ .product-item-row { display: flex; justify-content: center; gap: 84px; flex-wrap: wrap; /* 空间不够自动换行 */ } .product-item-row2 { display: flex; align-items: center; flex-direction: column; gap: 24px; } /* 右侧垂直堆叠容器,内部两个卡片上下排列 */ .product-right-stack { display: grid; grid-template-rows: 1fr 1fr; gap: 24px; } .product-card { background: linear-gradient(180deg, #EAF5FF 0%, #B9D8FE 100%); border-radius: 24px; padding: 30px; } .card-title { font-size: 28px; font-weight: bold; color: #111; margin: 0 0 8px; text-align: center; } .card-sub { font-size: 16px; color: #333; text-align: center; margin: 0 0 24px; } .product-item { text-align: center; } .product-img-wrap { width: 180px; height: 140px; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; } .product-img-wrap img { max-width: 90%; max-height: 90%; object-fit: contain; } .product-name { font-size: 18px; color: #222; } /* 移动端 */ @media (max-width:768px) { .product-grid { grid-template-columns: 1fr; } .card-colspan-2 { grid-column: span 1; } /* 移动端卡片内部图片纵向堆叠 */ .product-item-row { flex-direction: column; align-items: center; } .card-title { font-size: 22px; } .product-img-wrap { width: 160px; height: 120px; } } /* 合作权益模块 */ .cooperate-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; } /* 合作权益卡片文字覆盖层 */ .cooperate-item { position: relative; border-radius: 16px; overflow: hidden; } .cooperate-item img { width: 100%; height: 100%; object-fit: cover; display: block; } .cooperate-item-mask { width: 70%; position: absolute; inset: 0; /* ✅ 上下+水平居中 */ display: flex; flex-direction: column; justify-content: center; padding: 10px 64px 22px; color: #fff; } .cooperate-tag { display: inline-block; font-size: 32px; font-weight: bold; } .cooperate-item-mask h4 { font-size: 32px !important; margin-bottom: 6px; font-weight: bold; } .cooperate-item-mask p { font-size: 16px !important; line-height: 1.55; opacity: 0.92; margin: 0; } .cooperate-item-mask p a { color: #fff !important; } /* 手机端自适应 */ @media (max-width: 768px) { .cooperate-item { height: 220px; } .cooperate-item-mask h4 { font-size: 18px; } .cooperate-item-mask p { font-size: 13px; } } .cooperate-tip { background: #E0EEFE; text-align: center; padding: 16px; border-radius: 12px; margin-top: 20px; color: #0B45AB; font-size: 20px; } .partner-section { background-color: #f6fcff; } .partner-title { text-align: center; font-size: 42px; color: #222; padding: 60px 0; font-weight: 600; } .partner-box { background: #4285f4; border-radius: 32px; padding: 40px 50px; color: #fff; } .partner-item { display: grid; grid-template-columns: 80px 180px 1fr; align-items: center; padding: 24px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.25); gap: 16px; } /* 最后一条取消底部分隔线 */ .partner-item:last-child { border-bottom: none; } .partner-icon { display: flex; align-items: center; justify-content: center; } .partner-icon img { width: 60px; height: 60px; } .partner-name { font-size: 24px; font-weight: 500; border-right: 1px solid rgba(255, 255, 255, 0.25); } .partner-desc { font-size: 20px; line-height: 30px; } .partner-join { text-align: center; padding: 5px 20px; background-color: #4285f4; border-radius: 99px; cursor: pointer; color: #fff; font-size: 14px; } .partner-join:hover { color: #fff !important; background-color: rgba(78, 132, 233, .95); } /* 移动端适配 */ @media (max-width:768px) { .partner-title { font-size: 28px; } .partner-box { padding: 24px 20px; border-radius: 20px; } .partner-item { grid-template-columns: 60px 1fr; grid-template-rows: auto auto; gap: 10px; } .partner-icon { width: 56px; height: 56px; } .partner-name { font-size: 22px; } .partner-desc { font-size: 16px; grid-column: 1 / -1; } } .bandwidth-video { border-radius: 16px; width: 70%; margin: 10px auto; } .bandwidth-video #bandvideo { border-radius: 16px; } .bandwidth-video #recruitvideo { border-radius: 16px; } .ldwidth-video { /* background-color: #eaf5ff; */ padding: 20px 20px 0 20px; border-radius: 16px; width: 100%; } .ldwidth-video video { width: 100%; height: 230px; border-radius: 16px; background-color: #000; box-shadow: 0px 16px 28px 0px rgba(0, 0, 0, 0.58); } .bandwidth-box { display: flex; justify-content: space-between; align-items: flex-end; } .bandwidth-box .bandwidth-item { padding: 20px; background-color: #eaf5ff; color: #000; height: 166px; } .bandwidth-box .bandwidth-item p { color: #333; } .bandwidth-box .bandwidth-item .bandwidth-img img { width: 105px; height: 91px; margin-bottom: 30px; } .bandwidth-box .active_band { background-color: #458AED; border-radius: 16px 16px 0 0 !important; color: #fff; height: 192px; } .bandwidth-box .active_band p { color: #fff; } .recruit-box { display: flex; justify-content: space-between; align-items: flex-end; } .recruit-box .recruit-item { padding: 20px; background-color: #eaf5ff; color: #000; height: 166px; cursor: pointer; } .recruit-box .recruit-item p { color: #333; } .recruit-box .recruit-item .recruit-img img { width: 105px; height: 91px; margin-bottom: 30px; } .recruit-box .active_band { background-color: #458AED; border-radius: 16px 16px 0 0 !important; color: #fff; height: 192px; } .recruit-box .active_band p { color: #fff; } /* 底部地图版权 end*/ .cockpit { width: 100%; position: absolute; left: 0; bottom: 10%; color: #fff; font-size: 20px; font-weight: 500; } .cockpit2 { width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-size: 20px; font-weight: 500; } .cockpit-core-title { margin-top: 20px; line-height: 28px; letter-spacing: 1.2px; } .page-wrapper { max-width: 1200px; margin: 40px auto; padding: 0 20px; } /* 顶部标签样式 */ .top-tabs { display: flex; justify-content: center; gap: 60px; margin-bottom: 30px; } .top-tab { cursor: pointer; color: #333; font-size: 20px; font-weight: 600; padding: 8px 0; } .top-tab.active { color: #2394FE; } .top-title { display: none; } .top-title.active { display: block; } /* 主体内容布局 */ .main-container { display: flex; background: #E8EEF0; padding: 44px; border-radius: 8px; } /* 左侧子导航 */ .left-subtabs { min-width: 180px; margin-right: 32px; display: none; } .left-subtabs.active { display: block; } .subtab-item { text-align: center; padding: 10px 12px; margin-bottom: 8px; border-radius: 8px; cursor: pointer; transition: background 0.3s; color: #333; } .subtab-item.active { background: #CEE5EC; } /* 右侧内容区 */ .content-area { flex: 1; min-width: 0; } .content-item { display: none; } .content-item.active { display: block; } .content-item img { width: 100%; height: auto; border-radius: 4px; margin-bottom: 16px; } .content-desc { color: #666; font-size: 14px; line-height: 1.8; } .content-item video { width: 100%; height: 540px; background-color: #000; } .cockpit-box { display: flex; justify-content: center; gap: 24px; margin-bottom: 42px; } .cockpit-item { width: 16%; height: 110px; background-color: #d6e6ec; border-radius: 16px; color: #000; display: flex; flex-direction: column; align-items: center; justify-content: center; } .cockpit-item .title { font-size: 1.25rem; font-weight: bold; margin-bottom: 10px } .cockpit-item .subtitle { font-size: 1rem; font-weight: bold" }