﻿/* banner开始 */
.index-banner {
	height: 100vh;
	width: 100%;
	position: relative;
}

.index-banner .banner {
	width: 100%;
	height: 100%;

}

.index-banner .banner img,
.index-banner .banner video {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	position: relative;
}

.index-banner .banner .mb-bg {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .3);
	top: 0;
	left: 0;
}

.index-banner .wp-cont {
	padding-top: 30vh;
	height: 100%;
}

.index-banner .wp-cont h1 {
	margin-bottom: 0.14rem;
	color: #fff;
	font-weight: normal;
}

.index-banner .wp-cont h3 {
	margin-bottom: 0.1rem;
	color:#fff;
	/* opacity: 0; */
}

.index-banner .wp-cont p { color:#fff }

.index-banner .shubiao {
	position: absolute;
	right: calc(var(--wpPaddingNum) + var(--wpContPaddingNum));
	bottom: 5vh;
	z-index: 9;
}


.index-banner .swiper-pagination {
	text-align: left;
	padding-left: calc(var(--wpPaddingNum) + var(--wpContPaddingNum));
	/* display: flex; */
	bottom: 6vh;
}

.draw-h {
	display: block;
	border-radius: 50%;
	text-align: center;
	position: relative
}

.draw-h:before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	border: 1px solid rgba(100%, 100%, 100%, .5);
	border-radius: 50%
}

.index-banner .dots {
	width: 26px !important;
	height: 26px !important;
	display: inline-block;
	background: transparent;
	opacity: 1;
	margin-right: 13px;
	cursor: pointer;
}

.index-banner .dots::before {
	content: '';
	display: block;
	border: 0;
	background: #333;
	transform: scale(.4);
}

.index-banner .dots.on::before {
	background: var(--themeColor);
}

.index-banner .dots.on svg.drawcircle circle {
	animation: svgrotate 8.2s forwards;
}

/* banner结束 */



/* 数字滚动开始 */
.s-shuju {
	width: 100%;
	overflow: hidden;
	position: relative;
	z-index: 9;
	box-shadow: 0 5px 12px 4px rgba(130, 130, 130, .1);
	padding: 0.12rem 0;
}

.s-shuju ul {
	display: grid;
	align-items: center;
	grid-template-columns: repeat(4, 1fr);
	height: 100%;
}

.s-shuju ul li {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
}

.s-shuju ul li::before {
	content: '';
	position: absolute;
	right: 0;
	width: 1px;
	height: 60%;
	background: #eeeeee;
	top: 50%;
	transform: translate(0, -50%);
}

.s-shuju ul li>div {
	display: flex;
	align-items: flex-end;
}

.s-shuju ul li:last-child::before {
	display: none;
}

.s-shuju ul li span {
	font-size: var(--f60);
	/* line-height: 1.125; */
	color: #343333;
	font-family: 'num-font';
	margin-right: 0.06rem;
}

.s-shuju ul li div em {
	color: #343333;
	font-size: var(--f26);
	line-height: 2.0;
}

.s-shuju ul li p {
	color: #828282;
	font-size: var(--f19);
	line-height: 1.5;
	letter-spacing: .02rem;
}

/* 数字滚动结束 */



/* 您将拥有的SERVICES开始 */
.s-zhenghe {
	margin-top: 0.3rem;
	display: flex;
	justify-content: center;
}

.s-zhenghe li .s-zhtitle {
	height: 0.875rem;
	background: #017ffd;
	position: relative;
	margin-top: 0.125rem;
	display: block;
}


.s-zhenghe li .s-zhtitle:nth-child(2), .s-zhenghe li .s-zhtitle:nth-child(4){
	background: #066cd2;
}


.s-zhenghe li .s-zhtitle .s-zh1 {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: #fff;
	padding-top: 0.15rem;
	position: relative;
	z-index: 0;
	transition: none!important;
}

.s-zhenghe li .s-zhtitle .s-zh2 {
	position: absolute;
	width: 100%;
	height: 100%;
	display: none;
	align-items: center;
	justify-content: center;
	/*gap: 0.1875rem;*/
	top: 0;
	left: 0;
	background: #151515;
	transition: none!important;
}

.s-zhenghe li.on .s-zhtitle {
	height: 1rem;
	margin-top: 0;
}

.s-zhenghe li.on .s-zhtitle .s-zh1 {
	display: none;
}

.s-zhenghe li.on .s-zhtitle .s-zh2 {
	display: flex;
	width: 100%;
}

.s-zhenghe li .s-zhtitle .s-zh2 h5 {
	font-size: var(--f30);
	color: #fff;
	line-height: 1.5;
	text-wrap: nowrap;
}

.s-zhenghe li .s-zhtitle .s-zh2 img {
	max-height: 0.78rem;
	width: auto;
}


.s-zhenghe li .s-zhtitle .s-zh1 h5 {
	font-size: var(--f26);
	line-height: 1.5;
}

.s-zhenghe li .s-zhtitle .s-zh1 p,
.s-zhenghe li .s-zhtitle .s-zh2 p {
	font-size: var(--f16);
	line-height: 1.5;
	color: #fff;
	text-wrap: nowrap;
}

.s-zhenghe li .s-zhtitle .s-zh1 img {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, 0);
	z-index: -1;
	max-height: 0.6rem;
	width: auto;
}

.s-zhenghe li {
	width: 18.4%;
	transition: none !important;
	overflow: unset!important;
	/* transition: all .3s cubic-bezier(.4, 0, .2, 1); */
}

.s-zhenghe li:first-child .s-zhtitle {
	border-radius: .0625rem 0 0 0;
}

.s-zhenghe li:first-child .s-zhnr {
	border-radius: 0 0 0 .0625rem;
}

.s-zhenghe li:last-child .s-zhtitle {
	border-radius: 0 .0625rem 0 0;
}

.s-zhenghe li:last-child .s-zhnr {
	border-radius: 0 0 .0625rem 0;
}

.s-zhenghe li.on {
	/* width: 27.4%; */
	border-radius: .0625rem;
}

.s-zhenghe li.on .s-zhtitle {
	border-radius: .0625rem .0625rem 0 0;
	overflow: hidden;
}

.s-zhenghe li:nth-child(odd) .s-zhnr {
	background: #e8e8e8;
}

.s-zhenghe li:nth-child(even) .s-zhnr {
	background: #eeeeee;
}

.s-zhenghe li .s-zhnr {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0.25rem 0.3125rem;
	height: 100%;
}

.s-zhenghe li.on .s-zhnr {
	display: none;
}

.s-zhenghe li .s-zhnrs .swiper {
	width: 2.3rem;
	/* width: 100%; */
	margin-top: 0.1rem;
	padding-bottom: 0.18rem;
	transition: none !important;
    /* max-height: .89rem; */
    height: 1.3rem;
    overflow: hidden;
}

.s-zhenghe li .s-zhnrs .swiper .swiper-wrapper {
	/* transition: none!important; */
}

.s-zhenghe li .s-zhnrs .swiper .swiper-wrapper * {
	/* transition: none !important; */
}

.s-zhenghe li .s-zhnrs .swiper .swiper-pagination-bullet {
	width: 11px;
	height: 11px;
	border: 2px solid #d6d6d6;
	border-radius: 50%;
	background: transparent;
	opacity: 1;
}

.s-zhenghe li .s-zhnrs .swiper .swiper-pagination-bullet-active {
	border: 2px solid #017ffd;
}

.s-zhenghe li .s-zhnrs .swiper-slide {
	/* display: grid; */
	/* gap: 0.15rem; */
}

.s-zhenghe li .s-zhnrs .swiper-slide a {
	background: #f9f9f9;
	display: flex;
	align-items: center;
	justify-content: center;
	/* height: 0.25rem; */
	min-height: 0.25rem;
    height: 100%;
	color: #2b2b2b;
	font-size: 0.09rem;
	line-height: 1.5;
	text-wrap: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	border-radius: 0.045rem;
    flex-direction:column;
    transition: all .8s;
}
.s-zhenghe li .s-zhnrs .swiper-slide a img{
    width:auto;
    height: 32%;
    filter: var(--imgBlack);
    margin-bottom: 0.04rem;
}

.s-zhenghe li .s-zhnrs .swiper-slide a:hover {
	background: #017ffd;
	color: #fff;
	
}
/*
.s-zhenghe li .s-zhnrs .swiper-slide a:hover img{
    filter: var(--imgWhite);
}*/

.s-zhenghe li .s-zhnr a {
	color: #818181;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: var(--f17);
	line-height: 1.5;
	width: 100%;
}

.s-zhenghe li .s-zhnr a i {
	color: #c4c4c4;
	font-size: 0.2rem;
}

.s-zhenghe li .s-zhnrs {
	display: none;
}

.s-zhenghe li .s-zhbox{
	transition: none;
}

.s-zhenghe li.on .s-zhbox {
	box-shadow: 0 5px 12px 4px rgba(152, 152, 152, .26);
	border-radius: 0 0 .0625rem .0625rem;
}

.s-zhenghe li.on .s-zhnrs {
	display: block;
	padding: 0.175rem;
	background: #fff;
	height: calc(100% + 1rem);
	width: 100%;
	border-radius: 0 0 .0625rem .0625rem;
	overflow: hidden;
    min-height:2.05rem;
}

.s-zhenghe li .s-zhbox {
	position: relative;
}

.s-zhenghe li .s-zhnrs > p {
	color: #8c8c8c;
	font-size: var(--f16);
	line-height: 2;
	text-align: left;
	height: 3.8em;
	display: none;
	/* width: 100%; */
	width: 2.15rem;
	text-overflow: ellipsis;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.s-zhenghe li.on .s-zhnrs p {
	display: -webkit-box;
}

/* 您将拥有的SERVICES结束 */





/* 我们创造的CASES开始 */
/* 内容区 */
.s-uspro .wzkind-slide-for {
	margin-top: 0.25rem;
}

/* .s-uspro .wzkind-slide-for ul {
 *     display: grid;
 *     grid-template-columns: repeat(4, 1fr);
 * }
 *
 * .s-uspro .wzkind-slide-for ul li .img {
 *     aspect-ratio: 480/330;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li .img img {
 *     transform: scale(1.05);
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a:hover .img img {
 *     transform: scale(1.1);
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a {
 *     position: relative;
 *     overflow: hidden;
 *     z-index: 0;
 *     display: block;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a>img {
 *     position: absolute;
 *     left: 0.2rem;
 *     top: 0.3125rem;
 *     z-index: 2;
 *     width: auto;
 *     height: .3rem;
 *     object-fit: contain;
 *     max-width: 100%;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a .hover-bg {
 *     position: absolute;
 *     height: 1.21rem;
 *     bottom: -100%;
 *     z-index: 1;
 *     width: 100%;
 *     background: linear-gradient(to top, rgba(200, 10, 20, 0.8), rgba(200, 10, 20, 0));
 *     transition: all .5s;
 * } */

/* .s-uspro .wzkind-slide-for ul li a::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 1.2125rem;
    background: url(../images/hongmb.png)no-repeat;
    background-size: cover;
    left: 0;
    bottom: -100%;
    transition: all .5s;
    z-index: 1;
}

.s-uspro .wzkind-slide-for ul li a:hover::before {
    bottom: 0;
 }*/
/* .s-uspro .wzkind-slide-for ul li a:hover .hover-bg {
 *     bottom: 0;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a .hbjs {
 *     position: absolute;
 *     left: 0;
 *     bottom: 0;
 *     padding: 0.175rem 0.2rem;
 *     z-index: 2;
 *     width: 100%;
 *     opacity: 0;
 *     transition: all .5s;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a .hbjs>div {
 *     display: flex;
 *     align-items: center;
 *     justify-content: space-between;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a .hbjs>div div i {
 *     font-size: 1.6em;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a .hbjs>div div {
 *     display: flex;
 *     align-items: center;
 *     gap: 10px;
 *     color: #fff;
 *     font-size: var(--f14);
 *     line-height: 1.5;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a .hbjs p {
 *     font-size: var(--f18);
 *     color: #fff;
 *     line-height: 1.5;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a .hbjs h5 {
 *     font-size: var(--f25);
 *     line-height: 1.5;
 *     color: #fff;
 * }
 *
 * .s-uspro .wzkind-slide-for ul li a:hover .hbjs {
 *     opacity: 1;
 * } */

/* 我们创造的CASES结束 */





/* 网站建设与数字开发开始 */
.s-kaifa {
	overflow: hidden;
	height: 3rem;
}

.s-kaifa .bg {
	background: url(../image/b3db2e0bcee80707.jpg)center no-repeat;
    background-position: center;
    background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
	animation: bg-zoom 10s infinite;
}

@keyframes bg-zoom {
	0% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.15);
	}

	100% {
		transform: scale(1);
	}
}

.s-kaifa .wp-cont {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.1rem calc(var(--wpContPaddingNum) + 0.2rem) 0;
}

.s-kaifa .wp-cont>img {
	height: 100%;
	object-fit: contain;
	width: auto;
}

.s-kaifa .wp-cont>div {
	width: 52%;
}

.s-kaifa .wp-cont>div h5 {
	color: #fff;
	font-size: var(--f39);
	line-height: 1.5;
	margin-bottom: .075rem;
}

.s-kaifa .wp-cont>div h6 {
	color: #fff;
	font-size: var(--f20);
	line-height: 1.5;
}

.s-kaifa .wp-cont>div i {
	display: block;
	width: 0.35rem;
	height: 0.02rem;
	background: #fff;
	margin: 0.1rem 0 0.3125rem;
}

.s-kaifa .wp-cont>div p {
	font-size: var(--f18);
	line-height: 2em;
	color: #fff;
	margin-bottom: 0.2812rem;
}

.s-kaifa .wp-cont>div div {
	display: flex;
	align-items: center;
	gap: 0.2875rem;
}

.s-kaifa .wp-cont>div div a {
	border: 2px solid #fff;
	border-radius: 0.1875rem;
	transition: all .5s;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: var(--f20);
	line-height: 1.5;
	width: 1.65rem;
	height: 0.35rem;
}

.s-kaifa .wp-cont>div div a:last-child {
	color: #0c0c0c;
	background: #fff;
}

.s-kaifa .wp-cont>div div a:hover {
	/* color: #0c0c0c;
	 * background: #fff; */
    font-size: var(--f22);
}

/* 网站建设与数字开发结束 */


/* 我们能为您做的开始 */
.n-wzjs .wp-cont .ulwzjs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.2125rem 0.29rem;
	margin-top: 0.375rem;
}

.n-wzjs .wp-cont .ulwzjs>li a {
	padding: 0.225rem 0.2rem 0.1375rem;
	position: relative;
	display: block;
	/*background: #fff;*/
	border-radius: 0.1125rem;
	z-index: 0;
	transition: all .5s;
	background: url(../image/wzkindbg.jpg)bottom no-repeat #fff;
}

.n-wzjs .wp-cont .ulwzjs>li a::before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: #;
	background-size: cover;
	border-radius: 0.1125rem;
	opacity: 0;
	z-index: -1;
	transition: all .5s;
	left: 0;
	top: 0;
}

.n-wzjs .wp-cont .ulwzjs>li a .wzhead {
	display: flex;
	align-items: center;
	gap: 0.1rem;
	padding-bottom: 0.125rem;
	border-bottom: 1px solid #f1f1f1;
	margin-bottom: 0.2rem;
}

.n-wzjs .wp-cont .ulwzjs>li a .wzhead div {
	width: 0.3125rem;
	height: 0.3125rem;
	background: #017ffd;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	transition: all .5s;
}

.n-wzjs .wp-cont .ulwzjs>li a .wzhead h5 {
	color: #017ffd;
	font-size: var(--f24);
	line-height: 1.8em;
	transition: all .5s;
}

.n-wzjs .wp-cont .ulwzjs>li a .wzhead img {
	width: 55%;
	height: auto;
	aspect-ratio: 1/1;
}


.n-wzjs .wp-cont .ulwzjs>li a h6 {
	color: #404040;
	font-size: var(--f16);
	line-height: 1.5;
}

.n-wzjs .wp-cont .ulwzjs>li a ul {
	display: grid;
	gap: .0875rem;
	margin: 0.125rem 0 0.25rem;
}


.n-wzjs .wp-cont .ulwzjs>li a ul li {
	/* padding-left: 0.175rem; */
	position: relative;
	color: #636364;
	font-size: var(--f16);
	line-height: 1.5;
}
.n-wzjs .wp-cont .ulwzjs>li a ul li i{
    font-size: var(--f14);
    margin-right: 0.02rem;
}

/* .n-wzjs .wp-cont .ulwzjs>li a ul li:before {
 *     content: '';
 *     position: absolute;
 *     width: 18px;
 *     height: 18px;
 *     border-radius: 50%;
 *     background: url(../images/duiquan.jpg)no-repeat;
 *     background-size: cover;
 *     left: 0;
 *     top: 50%;
 *     transform: translate(0, -50%);
 * } */

.n-wzjs .wp-cont .ulwzjs>li a .xuqiu-p{
    position: relative;
}
.n-wzjs .wp-cont .ulwzjs .progress{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    opacity: 1;
    transition: all .5s .2s;
}
.n-wzjs .wp-cont .ulwzjs .progress > p{
    margin-bottom: .06rem;
    color: #999;
}
.n-wzjs .wp-cont .ulwzjs>li a .xuqiu {
	width: 1.625rem;
	height: 0.35rem;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	color: #fff;
	font-size: var(--f18);
	line-height: 1.5;
	/* background: url(../images/szhoverbg.jpg)center no-repeat; */
	background: var(--btnBgColor);
	background-size: cover;
	border-radius: .0625rem;
	transition: all .5s;
	margin: 0;
    position: relative;
    z-index: 2;
}

.n-wzjs .wp-cont .ulwzjs>li a .xuqiu-1 {
	width: 1.625rem;
	height: 0.35rem;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 1;
	color: #017ffd;
	font-size: var(--f18);
	line-height: 1.5;
	/* background: url(../images/szhoverbg.jpg)center no-repeat; */
	border:1px solid #017ffd;
	background-size: cover;
	border-radius: .0625rem;
	transition: all .5s;
	margin: 0;
    position: absolute;
    z-index: 2;
}

.n-wzjs .wp-cont .ulwzjs>li a:hover .progress{
    opacity: 0;
}
.n-wzjs .wp-cont .ulwzjs>li a:hover .xuqiu,
.n-wzjs .wp-cont .ulwzjs>li a:hover::before {
	opacity: 1;
}

.n-wzjs .wp-cont .ulwzjs>li a:hover .xuqiu-1 {
	opacity: 0;
}


.n-wzjs .wp-cont .ulwzjs>li a:hover .wzhead div {
	background: #045fbb;
}

.n-wzjs .wp-cont .ulwzjs>li a:hover .wzhead h5 {
	color: #045fbb;
}

.n-wzjs .wp-cont .ulwzjs>li a:hover {
	box-shadow: 0px 0px 15px rgba(219, 219, 219, 0.26);
}

/* 我们能为您做的结束 */

        .jishu_youshi_left{
          width:30%;float: left;margin-top: 2vw;
        }
        .jishu_youshi_ico{
          width:0.3125rem; height: 0.3125rem; border-radius: 50px; background: linear-gradient(to right, #0368cc, #017ffd); color: #fff;display: flex;align-items: center;justify-content: center;font-size: 0.1558695652173913rem; font-weight: bold; font-style: italic;
        }
        .jishu_youshi_left h1{line-height: 3;}
        .jishu_youshi_jianjie{color:#666;line-height: 2;}

        .jishu_youshi_right{
          width:30%;float: right;margin-top: 2vw;text-align: right;
        }
        .jishu_youshi_right h1{line-height: 3;}
        .jishu_youshi_ico-2{
          width:0.3125rem; height: 0.3125rem; border-radius: 50px; background: linear-gradient(to right, #0368cc, #017ffd); color: #fff;display: flex;align-items: center;justify-content: center;font-size: 0.1558695652173913rem; font-weight: bold; font-style: italic; margin-left: 90%;
        }


.public-contact-box {
  position: relative;
  width: 100%;
  background: linear-gradient(to bottom, #017ffd, #0368cc);
  /*background: url(../picture/index-contact-bg.png) no-repeat;*/
  background-size: 100% 100%;
}
.public-contact-main {
  display: flex;
  padding: 7vw 0;
}
.public-contact-left {
  width: 50%;
  background: rgba(255, 255, 255, 0.95);
  /*padding: 45px 30px;*/
  padding: 5vw 5vw 2vw 5vw;
}
.public-contact-name {
  font-weight: bold;
  color: #333333;
}
.public-contact-name span {
  color: #017ffd;
}
.public-contact-en {
  font-family: Arial;
  font-weight: 400;
  color: #000000;
  text-transform: uppercase;
  margin-top: 10px;
}
.public-contact-info {
  padding-top: 60px;
}
.public-contact-phone {
  color: #017ffd;
  font-weight: bold;
}
.public-contact-address {
  color: #333;
}
.public-contact-row {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
.public-contact-icon {
  width: 45px;
  height: 45px;
  margin-right: 10px;
}
.public-contact-right {
  width: 50%;
  background: linear-gradient(to top, #0368cc, #017ffd);
  padding: 36px 36px 27px 41px;
}
.public-contact-titles {
  display: flex;
}
.public-contact-titlech {
  font-weight: bold;
  color: #ffffff;
  margin-right: 13px;
}
.public-contact-titleen {
  font-weight: bold;
  color: #ffffff;
  margin-right: 13px;
  opacity: 0.13;
}
.public-form-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 18px;
}
.public-contact-form {
  margin-top: 30px;
}
.public-form-item {
  width: calc(50% - 10px);
  background: rgba(255, 255, 255, 0.1);
  min-height: 48px;
  display: flex;
  align-items: center;
  padding: 0 20px;
}
.public-form-name {
  color: #fff;
}
.public-form-input {
  background: none;
  color: #fff;
  width: calc(100% - 80px);
}
.public-form-textarea {
  background: none;
  color: #fff;
  min-height: 80px;
  width: calc(100% - 100px);
}
.public-form-itemPlus {
  background: rgba(255, 255, 255, 0.1);
  min-height: 78px;
  display: flex;
  align-items: self-start;
  padding: 15px 20px;
}
.public-form-btn {
  width: 120px;
  height: 44px;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px auto;
  border: none;
}
.public-footer-box {
  background: #1b1d2a;
}
.public-footer-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding-top: 63px;
  padding-bottom: 55px;
}
.public-footer-nav {
  width: calc(100% - 250px);
  display: flex;
}
.public-footer-column {
  flex: 1;
}
.pubiic-footer-name {
  position: relative;
  z-index: 2;
  width: fit-content;
  color: rgba(255, 255, 255, 0.6);
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.pubiic-footer-name:hover {
  color: rgba(255, 255, 255, 1);
}
.pubiic-footer-name::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -8px;
  top: -2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  /* border: 2px solid #0d6828; */
  background: url(../image/pubiic-footer-name.png) no-repeat;
  background-size: 100% 100%;
}
.pubiic-footer-ul {
  margin-top: 30px;
}
.pubiic-footer-section {
  color: rgba(255, 255, 255, 0.4);
  line-height: 2.2;
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.pubiic-footer-section:hover {
  color: rgba(255, 255, 255, 0.8);
}
.public-footer-qrcode {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.public-footer-qrcode img {
  width: 112px;
}
.public-footer-qrtext {
  font-size: 14px;
  color: #999999;
  margin-top: 8px;
}
.public-footer-bottom {
  display: flex;
  justify-content: space-between;
  padding-bottom: 40px;
}
.font-size-36{
	font-size: var(--f36);
}
.font-size-14{
	font-size: var(--f14);
}
.font-size-24{
	font-size: var(--f24);
	line-height: 2;
}
.font-size-20{
	font-size: var(--f18);
	line-height: 2;
}

.font-size-16{
	font-size: var(--f16);
	line-height: 2;
}


footer{ width: 100%; height: auto; font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;}
footer .foot{ display: grid; grid-template-columns: 2fr 5fr; grid-gap: 3vw; width: 100%; padding: 3.75vw 7.5vw; background: url('../picture/bg-foot1.png') center center no-repeat; background-size: cover;}
footer .foot .logo{ grid-row: 1 / 3; color:#fff;}
footer .foot .logo .ico{  width: 100%; height: 30px; -webkit-mask: url('../image/logo1.webp') left center no-repeat; background: var(--light);}
footer .foot .logo .cn{ font-size: var(--f30);; font-weight: 700; }
footer .foot .logo .en{ font-size: var(--f16);; text-transform: uppercase; letter-spacing: .1em;}
footer .foot .nav-bottom{ display: flex; justify-content: flex-end; align-items: center;}
footer .foot .nav-bottom a{ position: relative; font-size: var(--f16);; line-height: 1.5; color: #fff;}
footer .foot .nav-bottom a:last-child{ padding-left: 2em;}
footer .foot .nav-bottom a:not(:last-child){ padding: 0 2em}
footer .foot .nav-bottom a:not(:last-child):after{ content: ''; position: absolute; z-index: 0; top: 0; right: 0; bottom: 0; width: 1px; height: 50%; margin: auto; background: #b4e0ff;}
footer .foot .contact{ display: flex; justify-content: flex-end; align-items: center; color: #b4e0ff; font-size: var(--f14);}
footer .foot .contact .itm{ display: flex; align-items: center; margin-left: 0em;}
footer .foot .contact .itm i{ font-size: 1.125rem; line-height: 1; color: var(--secondary); margin-right: 0.5em;}
footer .copyright{ display: flex; justify-content: space-between; width: 100%; padding: 1em 7.5vw; font-size: var(--f16); line-height: 1.5; color: #9ca3af; background: #1e293b;}



.sy_cus{ background:url(../img/haibo-156043_1.jpg) center no-repeat; background-size: cover; width:100%;}
.sy_cus_content{ width:100%; margin:0 auto;}
.zi_en{ font-family:"微软雅黑"; font-size:.30rem; font-weight:bold; color:#000; padding-top:86px; line-height:43px;margin-bottom:50px;}
.zi_cn{font-family:"微软雅黑"; font-size:.26rem; font-weight:bold; color:#000;line-height:24px;}
.zi_xian_bg{width:250px; height:6px; margin-top:50px;}
.zi_xian_1{width:70px; height:5px; background:#017ffd;}
.zi_xian_2{width:250px; height:1px; background:#95989b;}
.zi_cn_1{color:#606060; font-size:.12rem; padding-top:37px;}
.zi_cn_2{font-size:.12rem; color:#000; padding-top:40px; padding-bottom:25px;}
.zi_cn_3{font-size:.10rem; color:#000;line-height:3}

.hangye_body{
    display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.2125rem 0.29rem;
  /*margin-top: 0.375rem;*/
}
.hangye_div{
  width:100%;
  height: auto;
  background: #fff;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
}
.hangye_div:hover{
  background: #017ffd;
  box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}
.hangye_title{text-align:center; padding-top: 30px;font-size: 0.125rem; color: #000; font-weight: bold;}
.hangye_title1{text-align:center; padding-top: 10px;font-size: 0.09rem; color: #999; padding-bottom: 30px;}
.hangye_div:hover .hangye_title{color: #fff;}
.hangye_div:hover .hangye_title1{color: #fff;}