/* edit time */
body,
html {
font-size: 20px;
width: 100%;
min-width: 1200px;
}
* {
box-sizing: border-box;
}
a:hover {
cursor: pointer;
}
.container {
width: 100%;
overflow: hidden;
position: relative;
}
#top {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1001;
width: 100%;
}
.w {
width: 1200px;
margin: 0 auto;
}
/* 背景颜色高斯模糊 */
/* #top > .bg1,#top > .bg2,#top > .bg3,#top > .bg4,#top > .bg5,#top > .bg6{
-webkit-backdrop-filter: saturate(180%) blur(6px);
backdrop-filter: saturate(180%) blur(6px);
}
.bg1{ background: rgba(0, 79, 219, 0.6);}
.bg2{ background:rgba(75,89,153,0.6)}
.bg3{ background:rgba(115,83,169,0.6);}
.bg4{ background:rgba(32,132,183,0.6)}
.bg5{ background:rgba(32,149,77,0.6)}
.bg6{ background:rgba(180,150,28,0.6);} */
.top {
width: 100%;
min-width: 1200px;
height: 70px;
padding: 1rem;
display: flex;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
overflow: hidden;
line-height: 1.5rem;
min-height: 1.5rem;
filter: blur(0px);
gap: 40px;
}
.top .logo {
display: inline-block;
float: left;
vertical-align: middle;
}
.top .logo a {
display: inline-block;
}
.top .logo img {
vertical-align: middle;
}
.top .logo>span {
margin-left: 1rem;
padding-left: 1rem;
font-size: 0.7rem;
color: #fff;
display: inline-block;
position: relative;
}
.top .logo>span::before {
position: absolute;
content: "";
top: 0.2rem;
bottom: 0.2rem;
width: 1px;
background: rgba(255, 2555, 255, 0.4);
left: 0rem;
}
.top .mune {
display: flex;
align-items: center;
margin-top: -1rem;
margin-bottom: -1rem;
font-size: 0;
white-space: nowrap;
gap: 40px;
}
.top .mune a {
font-size: 0.8rem;
color: #FFFFFF;
line-height: 3.5rem;
display: inline-block;
}
.top .mune a.active,
.top .mune a:hover {
border-bottom: 3px solid #fff;
}
.top .mune a.up {
border: 1px solid #FFFFFF;
display: flex;
align-items: center;
border-radius: 3rem;
padding: 0 17px;
height: 34px;
line-height: 1;
}
.productAll {
width: 50.5rem;
background: rgba(255, 255, 255, 0.98);
padding: 2rem 1.5rem 2rem 1.6rem;
box-sizing: border-box;
overflow: hidden;
position: absolute;
top: 3.5rem;
right: 3rem;
display: none;
/* -webkit-backdrop-filter: saturate(180%) blur(6px);
backdrop-filter: saturate(180%) blur(6px);
box-shadow: 0 0 25px rgba(0,0,0,0.1); */
}
.productAll>ul {
width: 19%;
display: inline-block;
float: left;
padding: 0 1rem;
box-sizing: border-box;
overflow: hidden;
}
.productAll>ul:nth-child(1) {
width: 20%;
}
.productAll>ul:nth-child(3) {
width: 23%;
}
.productAll>ul li,
.productAll>ul li a {
width: 100%;
text-align: left;
font-size: 0.7rem;
line-height: 1.5rem;
color: #333;
display: block;
}
.productAll>ul li a:hover,
.productAll>ul li a:focus {
color: #7989D3;
position: relative;
}
.productAll>ul li a:hover::after {
width: 4px;
height: 4px;
position: absolute;
content: '';
background-color: #7989D3;
border-radius: 50%;
left: -8px;
top: calc(50% - 1px);
}
.productAll>ul li:first-child {
/* width: 8rem;
height: 6rem; */
display: block;
margin-bottom: 1rem;
position: relative;
}
.productAll>ul li:first-child a {
font-size: 18px;
color: #333333;
letter-spacing: 0;
line-height: 2rem;
overflow: hidden;
padding-bottom: 1rem;
border-bottom: 1px solid #DCDCDC;
display: block;
width: 100%;
overflow: hidden;
/* width: 100%; */
/* height: 100%;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1; */
}
.productAll>ul li:first-child a>i {
width: 2rem;
height: 2rem;
vertical-align: middle;
display: inline-block;
float: left;
margin-right: 0.25rem;
}
.productAll>ul li:first-child a:hover,
.productAll>ul li:first-child a:focus {
color: #333;
}
.productAll>ul li:first-child a:hover::after {
background-color: #fff;
}
/*
.productAll>ul li:first-child div:first-child {
width: 8rem;
height: 6rem;
text-align: center;
line-height: 6rem;
overflow: hidden;
}
.productAll>ul li:first-child div:first-child>img {
width: 100%;
vertical-align: middle;
opacity: 0.9;
}
.productAll>ul li:first-child div:last-child {
width: 8rem;
height: 2rem;
line-height: 2rem;
margin-top: -2rem;
text-align: left;
box-sizing: border-box;
position: relative;
padding: 0 0.5rem;
font-size: 0.8rem;
color: #fff;
}
.productAll>ul li:first-child div:last-child::after {
position: absolute;
content: '';
width: 0.4rem;
height: 0.4rem;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
transform: rotate(-45deg);
top: 0.7rem;
right: 1rem
}*/
.productAll.dark {
background-color: #2D334B;
}
.productAll.dark>ul li a {
color: #909090;
}
.productAll.dark>ul li a:hover {
color: #fff;
}
/* .banner {
display: block;
position: relative;
} */
.banner {
min-height: 13.5rem;
display: block;
position: relative;
}
.banner>img {
width: 100%;
display: block;
position: relative;
}
.banner>h1,
.banner>h3 {
position: absolute;
left: calc( 50% - 30rem);
width: 43rem;
text-align: left;
color: #fff;
line-height: 1.6;
z-index: 2;
}
.banner>h1 {
font-size: 2.4rem;
top: calc( 50% - 3rem);
font-weight: bold;
}
.banner>h3 {
font-size: 1rem;
top: calc( 50% + 3rem);
}
.banner>h3 span {
font-weight: bolder;
font-family: Arial;
}
.data {
padding: 4rem calc(50% - 30rem) 3rem calc(50% - 30rem);
background: #fff;
overflow: hidden;
}
.data>h1 {
font-size: 1.5rem;
text-align: center;
line-height: 1.6;
color: #333333;
margin-bottom: 2.5rem;
}
.data>ul {
width: 100%;
overflow: hidden;
padding: 1rem 0;
}
.data>ul li>a {
position: absolute;
width: 100%;
height: 100%;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.data>ul li {
width: 20%;
display: inline-block;
float: left;
padding: 0 0.75rem;
box-sizing: border-box;
position: relative;
}
.data>ul li:hover {
transform: scale(1.075);
}
.data>ul li>div {
width: 100%;
text-align: center;
}
.data>ul li>div>img,
.data>ul li>div>p,
.data>ul li>div>label {
width: 100%;
text-align: center;
display: block;
color: #fff;
font-weight: normal;
}
.data>ul li>div>img {
/* opacity: 0.6; */
}
.data>ul li:hover>div>img {
opacity: 1;
}
.data>ul li>div>p {
margin-bottom: 2rem;
position: relative;
font-size: 1.2rem;
}
.data>ul li>div>p::after {
position: absolute;
content: '';
width: 1.5rem;
height: 0.1rem;
background: #fff;
bottom: -0.75rem;
left: calc(50% - 0.75rem);
}
.data>ul li>div>label {
font-size: 0.7rem;
}
.data1-bg {
background-image: linear-gradient(112deg, #9CA8DD 7%, #7C88BF 100%);
padding: 2rem 0;
}
.data2-bg {
background-image: linear-gradient(112deg, #B69CE2 7%, #957CBF 100%);
padding: 2rem 0;
}
.data3-bg {
background-image: linear-gradient(112deg, #60BCE7 7%, #459FCA 100%);
padding: 2rem 0;
}
.data4-bg {
background-image: linear-gradient(112deg, #84D7A3 7%, #62B581 100%);
padding: 2rem 0;
}
.data5-bg {
background-image: linear-gradient(112deg, #EBD270 7%, #C4AA46 100%);
padding: 2rem 0;
}
.gray.data {
background: #F6F6F6;
}
.gray.data>ul li {
margin-bottom: 2rem;
}
.gray.data>ul li>div {
/* margin: 0 1rem; */
background-color: #fff;
padding: 1.5rem 0 0rem 0;
box-sizing: border-box;
text-align: center;
}
.gray.data>ul li>div>img {
width: 6rem;
display: inline-block;
}
.gray.data>ul li>div:nth-child(2) {
padding: 1rem 0 0.5rem 0;
}
.gray.data>ul li>div>p {
font-size: 1rem;
color: #333;
}
.gray.data>ul li>div>p::after {
background-color: #777;
}
.foot {
width: 100%;
background-color: #2A2A2A;
}
.foot .search {
width: 100%;
position: relative;
z-index: 3;
}
.foot .search .con {
padding: 1rem calc(50% - 30rem) 1.5rem calc(50% - 30rem);
overflow: hidden;
}
.text {
display: inline-block;
float: left
}
.text h1,
.text h3 {
text-align: left;
line-height: 2;
font-size: 0.8rem;
color: #fff;
}
.text h1 {
font-size: 1.5rem;
}
.foot .search .inp {
display: inline-block;
float: right;
overflow: hidden;
margin-top: 1.15rem;
}
.foot .search .inp input,
.foot .search .inp button {
height: 2.4rem;
padding: 0.5rem;
box-sizing: border-box;
border: none;
display: inline-block;
float: left;
font-size: 0.8rem;
margin: 0;
}
.foot .search .inp input {
background-color: #fff;
color: #333;
width: 12rem;
border: 1px solid #fff;
}
.foot .search .inp button {
padding: 0 4.1rem;
background-image: linear-gradient(-12deg, #1861E3 3%, #0E4DBC 100%);
color: #fff;
}
.foot .search>img {
width: 100%;
min-width: 1660px;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: -1;
}
.com-link {
padding: 5.4rem calc(50% - 30rem) 5rem calc(50% - 30rem);
overflow: hidden;
text-align: center;
}
.com-link a {
width: calc(33.33% - 2.5rem);
margin: 0 1.875rem;
display: inline-block;
float: left;
background: rgba(255, 255, 255, 0.00);
border: 1px solid #888888;
padding: 1.5rem;
box-sizing: border-box;
line-height: 2rem;
color: #FFFFFF;
font-size: 1rem;
text-align: left;
position: relative;
}
.com-link a::after {
position: absolute;
content: '';
top: 2.25rem;
right: 2rem;
width: 0.5rem;
height: 0.5rem;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
transform: rotate(-45deg);
}
.com-link a>img {
vertical-align: middle;
margin-right: 1rem;
display: inline-block;
}
.com-link a:first-child {
margin-left: 0;
}
.com-link a:last-child {
margin-right: 0;
}
.com-link a:last-child::after {
right: 9rem;
}
.com-link a:last-child>img {
margin: -2.85rem -2.85rem -2.75rem 6.1rem
}
.foot>h3 {
text-align: center;
font-size: 0.7rem;
line-height: 2;
padding-bottom: 3.5rem;
color: #999999;
}
/* 产品呢 */
.banner.product .tabs {
padding: 7rem calc(50% - 30rem) 0rem calc(50% - 30rem);
box-sizing: border-box;
overflow: hidden;
position: absolute;
z-index: 101;
width: 100%;
text-align: center;
}
.banner.product .tabs a {
width: 19.8%;
text-align: center;
font-size: 1.2rem;
line-height: 3rem;
color: #fff;
display: inline-block;
}
.banner.product .tabs a.active {
border: 1px solid #fff;
border-radius: 5rem;
}
.banner.product>h1,
.banner.product>h2,
.banner.product>h3 {
position: absolute;
left: calc(50% - 30rem);
width: 43rem;
text-align: left;
color: #fff;
line-height: 1.6;
z-index: 2;
}
.banner.product>h1 {
top: calc(50% - 4.5rem);
}
.banner.product>h2 {
top: calc(50% - 1.5rem);
font-size: 1.5rem;
}
.banner.product>h3 {
top: calc(50% + 3rem);
font-size: 0.8rem;
line-height: 2;
}
.shuzi {
width: 100%;
background: #fff;
}
.shuzi.gray {
background: #f6f6f6;
}
.shuzi .con {
padding: 5rem calc(50% - 30rem) 5rem calc(50% - 30rem);
overflow: hidden;
}
.con-tit {
font-size: 1.5rem;
line-height: 1.6;
}
.co-des {
font-size: 1rem;
line-height: 1.6;
margin-bottom: 2rem;
}
.con-li {
font-size: 0.8rem;
color: #333;
line-height: 2.1;
position: relative;
padding-left: 1.5rem;
}
.con-li::after {
position: absolute;
left: 0.25rem;
top: 0.2rem;
width: 0.4rem;
height: 0.8rem;
content: '';
transform: rotate(45deg);
}
.zi {
color: #6C79B5;
}
.zi~.con-li::after {
border-right: 1px solid #6C79B5;
border-bottom: 1px solid #6C79B5;
}
.fen {
color: #957CBF;
}
.fen~.con-li::after {
border-right: 1px solid #957CBF;
border-bottom: 1px solid #957CBF;
}
.lan {
color: #459FCA;
}
.lan~.con-li::after {
border-right: 1px solid #459FCA;
border-bottom: 1px solid #459FCA;
}
.lv {
color: #35AD63;
}
.lv~.con-li::after {
border-right: 1px solid #35AD63;
border-bottom: 1px solid #35AD63;
}
.huang {
color: #C4AA46;
margin-bottom: 2rem;
}
.huang~.con-li::after {
border-right: 1px solid #C4AA46;
border-bottom: 1px solid #C4AA46;
}
.con .fl,
.conn .fr {
width: 49.5%;
}
.con ul {
width: 100%;
display: block;
overflow: hidden;
padding-top: 2.5rem;
}
.con ul>li {
width: calc(25% - 0.75rem);
margin: 0.5rem;
display: inline-block;
float: left;
background: #FBF9FF;
padding: 1.75rem 2.3rem;
box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.con ul>li:nth-child(4n) {
margin-right: 0;
}
.con ul>li:nth-child(4n+1) {
margin-left: 0;
}
.con ul>li .bag {
position: absolute;
top: 0;
left: 0;
z-index: 2;
width: 2.5rem;
height: 2.5rem;
background: #F3EFFB;
border-bottom-right-radius: 1.5rem;
text-align: center;
line-height: 2.2rem;
}
.con ul>li .bag>img {
vertical-align: middle;
}
.con ul>li h1,
.con ul>li h3 {
text-align: left;
line-height: 1.4;
}
.con ul>li h1 {
font-size: 1rem;
color: #333;
}
.con ul>li h3 {
font-size: 0.8rem;
color: #777777;
}
.shuzi.gray .con ul>li {
background-color: #fff;
}
.shuzi.lan .con ul>li {
background-color: #F7FCFF;
}
.shuzi.lan .con ul>li .bag {
background-color: #E8F4FA;
}
.shuzi.lv .con ul>li {
background-color: #F1FFF6;
width: calc(12.5% - 0.875rem);
margin: 0.5rem;
padding: 1.25rem 0 1.75rem 0;
text-align: center;
}
.shuzi.lv .con ul>li h1,
.shuzi.lv .con ul>li h3 {
text-align: center;
color: #333;
font-size: 0.8rem;
}
.shuzi.lv .con ul>li h3 {
position: relative;
}
.shuzi.lv .con ul>li h3::after {
position: absolute;
content: '';
width: 1rem;
height: 0.1rem;
bottom: -0.5rem;
left: calc(50% - 0.5rem);
background-color: #777;
}
.shuzi.lv .con ul>li:nth-child(8n) {
margin-right: 0;
}
.shuzi.lv .con ul>li:nth-child(8n+1) {
margin-left: 0;
}
.shuzi.lv~.shuzi.gray .con ul>li {
background-color: #fff;
width: calc(12.5% - 0.875rem);
padding: 1.25rem 0 1.75rem 0;
}
.shuzi.lv~.shuzi.gray .con ul>li h1,
.shuzi.lv~.shuzi.gray .con ul>li h3 {
text-align: center;
color: #333;
}
.shuzi.lv~.shuzi.gray .con ul>li h3 {
position: relative;
}
.shuzi.lv~.shuzi.gray .con ul>li h3::after {
position: absolute;
content: '';
width: 1rem;
height: 0.1rem;
bottom: -0.5rem;
left: calc(50% - 0.5rem);
background-color: #777;
}
/* About Us */
.banner.about h1,
.banner.about h2,
.banner.about h3,
.banner.about .honour {
width: 43rem;
text-align: left;
color: #333 !important;
line-height: 1.6;
font-size: 0.8rem;
text-align: justify;
}
.banner.about h1 {
font-size: 2.4rem;
}
.banner.about h2 {
color: #777;
font-size: 1.5rem;
}
.banner.about h3 {
line-height: 2;
margin-bottom: 5rem !important;
margin-top: 3rem !important;
font-size: 0.8rem !important;
}
.banner.about .honour {
overflow: hidden;
}
.banner.about .honour li {
width: 25%;
display: inline-block;
float: left;
text-align: center;
}
.banner.about .honour li:first-child,
.banner.about .honour li:last-child {
width: 12.5%;
}
.banner.about .honour li label,
.banner.about .honour li span {
width: 100%;
display: inline-block;
text-align: center;
line-height: 2.2;
}
.banner>.conn {
position: absolute;
left: calc(50% - 30rem);
right: calc(50% - 30rem);
z-index: 1;
}
.banner>.conn h1,
.banner>.conn h3 {
text-align: left;
color: #fff;
line-height: 1.6;
}
.banner>.conn h1 {
font-size: 2.4rem;
}
.banner>.conn h3 {
font-size: 1.5rem;
margin-bottom: 1.25rem;
text-align: justify;
}
.coop {
margin-left: -12px;
margin-right: -12px;
overflow: hidden;
}
.coop ul {
width: calc(14.2857% - 24px);
margin: 0 12px;
display: inline-block;
float: left;
background-color: rgba(255, 2555, 255, 0.8);
}
.coop ul>li {
width: 100%;
display: inline-block;
text-align: center;
line-height: 4rem;
border-bottom: 1px solid #fff;
}
.coop ul>li img {
width: 92%;
display: inline-block;
vertical-align: middle;
}
.coop ul>li:last-child {
border-bottom-color: transparent;
}
.coop ul>li:first-child {
font-size: 0.7rem;
color: #333;
line-height: 3rem;
background-color: #fff;
}
.adr {
width: 100%;
overflow: hidden
}
.adr>div {
width: 100%;
overflow: hidden;
margin: 1.5rem 0;
}
.adr>div .iconn {
height: 3.2rem;
display: block;
float: left;
width: 3.2rem;
margin-right: 1rem;
text-align: left;
line-height: 3.2rem;
text-align: center;
}
.adr>div .iconn>img {
vertical-align: middle;
}
.adr>div h3 {
width: 80%;
}
.adr>div h3 span,
.adr>div h3 label {
width: 100%;
text-align: left;
display: block;
line-height: 1.5;
color: #333;
font-size: 0.8rem;
}
.adr>div h3 span {
font-size: 1.2rem;
}
/* 新闻 */
.newsList {
padding: 1.5rem calc(50% - 30rem) 3.5rem calc(50% - 30rem);
overflow: hidden;
}
.newsList ul {
overflow: hidden;
margin-left: -0.5rem;
margin-right: -0.5rem;
}
.newsList ul li {
width: calc(50% - 1rem);
margin: 0.5rem;
display: inline-block;
float: left;
overflow: hidden;
background-color: #fff;
padding: 1rem;
box-sizing: border-box;
}
.newsList ul li a {
display: block;
width: 100%;
height: 100%;
overflow: hidden;
}
.newsList ul li .img {
width: 8rem;
height: 8rem;
display: inline-block;
float: left;
margin-right: 1rem;
background: #f6f6f6;
text-align: center;
line-height: 8rem;
}
.newsList ul li .img img {
display: inline-block;
vertical-align: middle;
margin: 0;
}
.newsList ul li .des {
width: calc(100% - 9.1rem);
display: inline-block;
float: left;
}
.newsList ul li .des h1,
.newsList ul li .des h3,
.newsList ul li .des h5 {
line-height: 2;
text-align: left;
width: 100%;
}
.newsList ul li .des h1 {
font-size: 1rem;
color: #333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.newsList ul li .des h3 {
font-size: 0.7rem;
color: #909090;
line-height: 1.6;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
margin-bottom: 2.5rem;
}
.newsList ul li .des h5 {
font-size: 0.7rem;
color: #909090;
}
.newsIndent,
.case {
padding: 2rem calc(50% - 30rem) 4rem calc(50% - 30rem);
overflow: hidden;
}
.indent {
width: 100%;
padding: 2rem 3rem 5rem;
box-sizing: border-box;
background-color: #fff;
}
.indent h1,
.indent h3 {
text-align: center;
width: 100%;
text-align: center;
margin: 0.4rem 0;
line-height: 1.6;
}
.indent h1 {
font-size: 1.2rem;
color: #333333;
}
.indent h3 {
font-size: 0.7rem;
color: #909090;
}
.indent>.con {
margin-top: 1rem;
border-top: 1px solid #DCDCDC;
padding-top: 2rem;
}
.conimg {
width: 30rem;
margin: 0 auto 2rem auto;
min-height: 2rem;
background-color: #F6F6F6;
}
.conimg img {
width: 100%;
display: block;
margin: 0;
}
.context {
width: 100%;
text-align: left;
font-size: 0.7rem;
color: #333;
line-height: 1.8;
}
/* pup */
.mask {
width: 100%;
height: 100%;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 10001;
background: rgba(0, 0, 0, 0.4);
display: none;
}
.pup {
width: 28rem;
top: calc(50% - 14rem);
position: fixed;
left: calc(50% - 14rem);
z-index: 10002;
padding: 0;
background-color: #fff;
display: none;
}
.pup .puptop {
position: relative;
width: 100%;
overflow: hidden;
}
.pup .puptop>img {
width: 140%;
}
.pup .puptop>h1,
.pup .puptop>h3,
.pup .puptop>a {
position: absolute;
left: 3rem;
z-index: 1;
color: #fff;
text-align: left;
line-height: 1.5;
}
.pup .puptop>a {
top: 2rem;
left: auto;
right: 2rem;
width: 2rem;
height: 2rem;
text-align: center;
line-height: 2rem;
}
.pup .puptop>a img {
display: inline-block;
vertical-align: middle;
margin: 0;
}
.pup .puptop>h1 {
font-size: 1.8rem;
top: 2.5rem;
}
.pup .puptop>h3 {
font-size: 1rem;
top: 6.5rem;
}
.pup .inpMgs {
padding: 4rem;
text-align: center;
}
.pup .inpMgs>img {
width: 240px;
}
.case ul {
margin-left: -0.5rem;
margin-right: -0.5rem;
overflow: hidden;
}
.case ul li {
display: inline-block;
float: left;
width: calc(50% - 1rem);
margin: 0.5rem;
background: #fff;
}
.case ul li a {
width: 100%;
height: 100%;
display: block;
overflow: hidden;
}
.case ul li div {
width: 100%;
overflow: hidden;
display: block;
margin: 0;
}
.case ul li div>img {
width: 100%;
display: block;
margin: 0;
}
.case ul li div:last-child {
padding: 1.25rem 1.5rem;
box-sizing: border-box;
height: 14.5rem;
}
.case ul li div h1,
.case ul li div h3 {
text-align: left;
width: 100%;
}
.case ul li div h1 {
margin-bottom: 1rem;
}
.case ul li div h1 span {
width: 100%;
display: block;
font-size: 0.9rem;
color: #333;
line-height: 1.44;
}
.case ul li div h1 span:first-child {
color: #417CDD;
padding-bottom: 0.55rem;
border-bottom: 1px solid #C1D9FF;
margin-bottom: 1.25rem;
}
.case ul li div h3 {
font-size: 0.7rem;
color: #909090;
line-height: 1.8;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
height: 6.15rem;
overflow: hidden;
text-align: justify;
}
.case ul li:hover {
transform: scale(1.035);
}
.caseMore {
width: calc(33.33% - 1.5rem);
margin: 2rem auto 5rem;
display: block;
background: #fff;
font-size: 0.8rem;
color: #333;
text-align: center;
height: 3.6rem;
line-height: 3.6rem;
display: none;
}
.arrows {
height: 2.4rem;
width: 2.4rem;
float: left;
display: block;
position: fixed;
z-index: 10001;
bottom: 5rem;
right: 3rem;
border-radius: 0.2rem;
background-color: rgba(255, 255, 255, .4);
font-size: 0.9rem;
text-align: center;
line-height: 2.4rem;
color: #333;
border: 1px solid #D1DCED;
opacity: 0;
}
.arrows img {
vertical-align: middle;
}
.arrows:hover {
color: #005FCC;
}
.data>ul.des li {
width: 16.6666%;
}
button {
cursor: pointer;
}
.shuzi.lv~.shuzi.gray .con ul.specailLi li {
width: 16.6665%;
margin: 0;
background-color: #fff;
}
.shuzi.lv~.shuzi.gray .con ul.specailLi~ul>li {
width: calc(20% - 0.8rem);
}
.shuzi.lv~.shuzi.gray .con ul.specailLi~ul>li:nth-child(4n),
.shuzi.lv~.shuzi.gray .con ul.specailLi~ul>li:nth-child(4n+1) {
margin: 0.5rem;
}
.shuzi.lv~.shuzi.gray .con ul.specailLi~ul>li:nth-child(5n) {
margin-right: 0;
}
.shuzi.lv~.shuzi.gray .con ul.specailLi~ul>li:nth-child(5n+1) {
margin-left: 0;
}
/* */
.program h1 {
margin-bottom: 0;
}
.program h3 {
font-size: 1rem;
margin: 0;
line-height: 3;
color: #595959;
text-align: center;
margin-bottom: 1rem;
font-weight: normal;
}
.program h3~ul {
width: 100%;
}
.program h3~ul li {
width: calc(33.3333% - 1.35rem);
display: inline-block;
float: left;
background-color: #f5f7fd;
margin: 0 1rem 1.5rem 1rem;
padding: 1rem 2rem 3rem;
}
.program h3~ul li:nth-child(3n+1) {
margin-left: 0;
}
.program h3~ul li:nth-child(3n) {
margin-right: 0;
}
.program h3~ul li:hover {
background-color: #fff;
box-shadow: 0px 0px 20px 0px rgba(40, 46, 55, 0.1);
}
.program h3~ul li:hover>div>p::after {
background-color: #f5f7fd;
}
.program h3~ul li p,
.program h3~ul li p~label {
color: #2A2A2A;
}
.program h3~ul li p~label {
font-size: 0.8rem;
line-height: 2;
width: 100%;
height: 4rem;
display: block;
}
.program h3~ul li div:first-child {
width: 3rem;
height: 3rem;
display: block;
margin: 1rem auto;
}
.tabs,
.mianCon {
display: block;
text-align: center;
}
.mianCon li,
.mianCon li img {
width: 1200px;
}
.tabs>li {
padding: 0 2rem;
display: inline-block;
font-size: 0.7rem;
color: #333333;
line-height: 2;
position: relative;
}
.tabs>li.active {
color: #1a6bfc;
}
.tabs>li.active::after {
position: absolute;
content: '';
width: 1.5rem;
height: 2px;
background-color: #1a6bfc;
bottom: -5px;
left: calc(50% - 0.75rem);
}
#slider_pro {
width: 1200px;
height: 660px;
margin: 0 auto;
overflow: hidden;
position: relative;
}
.mianCon {
overflow: hidden;
position: absolute;
height: 560px;
margin-top: 3rem;
/* padding: 0 0.75rem;
width: 100%;
min-height: 30rem;
position: relative; */
}
.mianCon li {
width: 1200px;
height: 560px;
overflow: hidden;
position: relative;
display: block;
float: left;
}
/*
.mianCon li {
width: calc( 100% / 7)
}
.mianCon li>img {
width: 100%;
} */
#slider_pro~a {
position: absolute;
width: 2rem;
height: 2rem;
border-radius: 50%;
background-color: rgba(0, 0, 0, 0.4);
margin-top: -16rem;
}
#slider_pro~a:hover {
background-color: #1a6bfc;
}
#slider_pro~a.prev {
left: calc(50% - 34rem);
}
#slider_pro~a.next {
right: calc(50% - 34rem);
}
#slider_pro~a::after {
width: 0.6rem;
height: 0.6rem;
position: absolute;
content: '';
top: 14px;
left: 8px;
border: 2px solid #fff;
transform: rotate(45deg);
}
#slider_pro~a.prev::after {
border-top: none;
border-right: none;
left: 15px;
}
#slider_pro~a.next::after {
border-bottom: none;
border-left: none;
}
.programgray {
background-color: #eaebf4;
}
.program.programgray ul li {
width: calc(25% - 0.75rem);
margin: 0.5rem;
background-color: #fff;
padding: 0;
}
.program.programgray ul li div:first-child {
width: 100%;
padding: 0;
margin: 0;
height: auto;
}
.program.programgray ul li div:last-child {
padding: 1rem 2rem 2rem;
box-sizing: border-box;
}
.program.programgray ul li div:last-child p {
margin-bottom: 1rem;
}
.program.programgray ul li div:last-child p~label {
height: 3rem;
}
.program.programgray ul.dataCun li {
width: 20%;
margin: 0;
padding: 0;
background-color: transparent;
display: inline-block;
float: left;
text-align: center;
}
.program.programgray ul.dataCun li:hover {
box-shadow: none;
transform: none;
}
.program.programgray ul.dataCun li span,
.program.programgray ul.dataCun li span~label {
width: 100%;
display: inline-block;
text-align: center;
color: #333;
font-size: 0.7rem;
line-height: 1.44;
}
.program.programgray ul.dataCun li span {
font-weight: bold;
font-size: 1.6rem;
}
.program.programgray ul.dataCun li span>i {
font-size: 2.4rem;
}
.pj,
.pj ul {
width: 100%;
overflow: hidden;
}
.pj ul:nth-child(2) li {
width: 33.33%;
display: inline-block;
float: left;
padding: 1rem 0.5rem 0.5rem;
text-align: center;
box-sizing: border-box;
}
.pj ul:nth-child(2) li>img {
display: inline-block;
}
.programAll {
width: 38rem;
background: rgba(255, 255, 255, 0.98);
padding: 1.5rem;
box-sizing: border-box;
overflow: hidden;
position: absolute;
top: 3.5rem;
right: 3rem;
display: none;
/* -webkit-backdrop-filter: saturate(180%) blur(6px);
backdrop-filter: saturate(180%) blur(6px);
box-shadow: 0 0 25px rgba(0,0,0,0.1); */
}
.programAll>ul {
width: 100%;
overflow: hidden;
}
.programAll>ul li {
width: calc(33.3333% - 0.5rem);
display: inline-block;
float: left;
margin: 0.25rem;
padding: 0.6rem;
box-sizing: border-box;
overflow: hidden;
position: relative;
background-color: #F5F5F5;
}
.programAll>ul li div {
display: inline-block;
float: left;
text-align: left;
height: 2rem;
line-height: 2rem;
box-sizing: border-box;
}
.programAll>ul li div:first-child {
width: 2rem;
margin-right: 0.5rem;
}
.programAll>ul li div:first-child img {
width: 100%;
}
.programAll>ul li div p {
font-size: 0.7rem;
color: #333333;
letter-spacing: 0;
}
.programAll>ul li a {
position: absolute;
top: 0;
left: 0;
bottom: 0;
display: block;
z-index: 1;
right: 0;
width: 100%;
height: 100%;
}