/*首页通栏广告*/
.g_safe{width: 100%; height: 480px; background: url("{sort:pic}") no-repeat center top; background-size:1920px 480px;}
.g_safe-container{width: 1122px; height: 480px; margin: 0 auto; padding-right: 550px; position: relative;}
.g_safe-img{width: 461px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.g_safe-content{display: flex; flex-direction: column; justify-content: center; height: 480px;padding-left:20px}
.g_safe-content p{font-size: 24px; font-weight: 600; color: #fff; position: relative;padding-top:45px}
.g_safe-content p::after{content: ''; display: block; width: 30px; height: 2px; background: #D8D8D8; margin-top: 15px;padding-left:10px}
.g_safe-content span{display: inline-block; font-size: 16px; color: #fff; line-height: 34px; margin-top: 40px;}
.g_safe-content a{display: flex; align-items: center; justify-content: center; width: 90px; height: 30px; background: #e60012; border-radius: 2px; font-size: 12px; color: #fff; margin-top: 12px;}
.g_safe-content a::after{content: ''; display: inline-block; width: 6px; height: 10px; background: url("http://1.jnxxts.com/img/g_20.png") no-repeat center; background-size:6px 10px; margin-left: 7px;}

.banner-tu {
    width: 100%;
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    
}

.shouyewenzi01 { 
    font-size: 16px; /* 基础字体大小 */
    text-align: center; /* 文字居中对齐 */
    max-width: 1200px;
    height: 50px;
}
 
 
/* 响应式调整 - 在小屏幕上增加字体可读性 */
@media (max-width: 768px) {
    shouyewenzi01 {
        font-size: 18px; /* 在手机上稍微增大字体 */
    }
}
 
/* 更小的手机屏幕调整 */
@media (max-width: 480px) {
    shouyewenzi01 {
        font-size: 16px; /* 保持基础大小 */
        padding: 10px;
    }
}
/*首页4个优势*/

.layout {
	padding-left: 4%;
	padding-right: 4%
}

.section01 {
	background-color: #fff;

}

.index-title {
	text-align: center;
	font-size: 16px;
	color: #666
}

.index-title span {
	display: block;
	font-size: 40px;
	color: #000
}

.index-ser {
	width: 100%
}

.index-ser ul li {
	width: 23.87%;
	float: left;
	margin-top: 60px;
	margin-right: 1.5%;
	margin-right: 1%\0;
	-webkit-transition: all .5s ease;
	transition: all .5s ease
}

.index-ser ul li:hover {
	box-shadow: 0 17px 50px 0 rgba(0,0,0,.19);
	transform: translate3d(0,-2px,0);
	transition: all .3s cubic-bezier(.55,0,.1,1)
}

.index-ser ul li:nth-of-type(4n),.index-ser ul li.mr0 {
	margin-right: 0
}

.index-ser ul li .item {
	border: 1px solid #ddd;
	text-align: center;
	padding: 10% 17%
}

.index-ser ul li .co {
	width: 180px;
	height: 100px;
	display: block;
	margin: 0 auto;
	-webkit-transition: all 1.5s ease;
	transition: all 1.5s ease
}

.index-ser ul li:hover .co {
	background-position: -180px 0
}

.index-ser ul li h2 {
	font-size: 18px;
	color: #333;
	margin: 15px 0
}

.index-ser ul li span {
	font-size: 14px;
	color: #666;
	display: block
}

.section02 {
	background-color: #efefef;
	padding-top: 80px;
	overflow: hidden
}

.index-case {
	width: 100%;
	padding-top: 10px;
	position: relative
}

.index-case .owl-carousel {
	padding-bottom: 40px
}

.index-case .item {
	margin: 0!important
}

.index-case ul {
	padding-bottom: 10px
}

.index-case ul li {
	width: 20%;
	float: left;
  padding-left:.9%;
  padding-bottom:.3%;
	background-color: #fff
}

.index-case ul li:nth-of-type(4n),.index-case ul li.mr0 {
	margin-right: 0
}

.index-case ul li .pic {
	display: block;
	width: 100%;
	overflow: hidden;
	background-color: #eee;
	background-image: url(../../static/image/loading.gif);
	background-position: center center;
	background-repeat: no-repeat;
	position: relative;
}

.index-case ul li .bg {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 5;
	background-color: #000;
	filter: alpha(opacity=50);
	background-color: rgba(0,0,0,.5);
	visibility: hidden;
	opacity: 0;
	-webkit-transition: all .5s ease;
	transition: all .5s ease
}

.index-case ul li:hover .bg {
	visibility: visible;
	opacity: 1
	
	
	
}

.btn-group {
	position: absolute;
	width: 100%;
	height: auto;
	overflow: hidden;
	bottom: 0;
	-webkit-backdrop-filter: blur(10px);
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
	text-align: center
}

.btn-group a {
	display: block;
	width: 100%;
	height: 100px;
	padding-top:25px;
	padding-bottom:20px;
	padding-left:3px;
	font-size: 14px;
	background-color: #00000073;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
	color: #fff;
	line-height: 1.6
}

.btn-group a:hover {
	background: #fffffff5；
	color:#fff;
}

.btn-group .details_btn:before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	background: url(http://1.jnxxts.com/img/bw01.png) no-repeat;
	margin-right: 5px
}

.btn-group .link_btn:before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	background: url(http://1.jnxxts.com/ims/bw02.png) no-repeat;
	margin-right: 5px
}

.index-case ul li:hover .btn-group a,.index-case ul li:hover .btn-group a {
	height: 150px
}

.index-case ul li .inxcasetxt::before,.index-case ul li .inxcasetxt::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 50%;
	height: 1.5px;
	background: #ccc;
	content: '';
	-webkit-transition: opacity .5s,-webkit-transform .5s;
	transition: opacity .5s,transform .5s;
	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
	opacity: 0;
	z-index: 20
}

.index-case ul li:hover .inxcasetxt::before {
	opacity: .8;
	-webkit-transform: translate3d(-50%,-50%,0) rotate(45deg);
	transform: translate3d(-50%,-50%,0) rotate(45deg)
}

.index-case ul li:hover .inxcasetxt::after {
	opacity: .8;
	-webkit-transform: translate3d(-50%,-50%,0) rotate(-45deg);
	transform: translate3d(-50%,-50%,0) rotate(-45deg)
}

.index-case ul li .pic img {
	width: 100%;
	display: block;
	-webkit-transition: all .4s ease;
	transition: all .4s ease;
}

.index-case ul li .pic:hover img {
	-webkit-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2)
}

.index-case ul li .h2 {
	padding: 25px 15px;
	min-height: 20px;
	position: relative;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis
}

.index-case ul li .h2:before {
	content: "";
	position: absolute;
	z-index: 0;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #cb0808;
	-webkit-transform: scaleY(0);
	transform: scaleY(0);
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
	height: 0px\0
}

.index-case ul li:hover .h2 span,.index-case ul li:hover .h2 i {
	color: #fff
}

.index-case ul li:hover .h2:before {
	-webkit-transform: scaleY(1);
	transform: scaleY(1);
	height: auto\0
}

.index-case ul li .h2 span {
	font-size: 16px;
	color: #333;
	margin-right: 10px;
	position: relative;
	z-index: 5
}

.index-case ul li .h2 i {
	font-size: 12px;
	color: #999;
	position: relative;
	z-index: 5
}

.index-case .indexmore {
	position: static;
	left: auto;
	bottom: auto;
	margin: 0 auto;
	transform: translateX(0) translateY(0)
}

.section03 {
	background-color: #fff;
	padding-top: 80px;
	padding-bottom: 95px
}











@media screen and (max-width:960px) {
	.logo {
		padding-top: 25px
	}

	.logo a {
		width: 220px;
		height: 30px
	}

	.nav ul li {
		margin-left: 25px
	}

	.nav .messsn {
		margin-left: 25px
	}

	.contact-box .conform {
		margin-left: 0
	}
}

@media screen and (max-width:768px) {
	.header {
		height: 60px;
		background-color: #fff
	}

	.logo {
		padding-top: 10px
	}

	.logo a {
		width: 170px;
		height: 22px;
	}

	.nav {
		display: none;
		top: 32px;
		right: 75px;
		padding-right: 0
	}

	.nav .messsn {
		background-position: 0 -21px
	}

	.myPhone {
		color: #333;
		background: url(../../static/image/myphone_h.png) left center no-repeat;
		right: 75px;
		top: 22px
	}

	.btn-m-list {
		display: block;
		margin-top: -19px;
		right: 4%
	}

	.btn-m-list span {
		background-color: #333
	}

	.contain {
		padding-top: 60px
	}

	.index-back-box {
		height: 65px
	}

	.IndexList ul {
		padding-top: 10px
	}

	.nub {
		font-size: 25px;
		height: 40px;
		line-height: 40px
	}

	.votewarp {
		padding-top: 60px
	}

	.index-back-box .sub-arrows,.index-back-box .sub-mouse {
		display: none
	}

	.scrollBar .banner ul li .imgTimes>article {
		bottom: 22%
	}

	.index-ser {
		padding-top: 30px
	}

	.index-ser ul li {
		width: 48%;
		margin-right: 3.7%;
		margin-top: 30px
	}

	.index-ser ul li:nth-of-type(2n) {
		margin-right: 0
	}

	.index-case ul li {
		width: 33%
	}

	.index-case ul li:nth-of-type(3n) {
		margin-right: 0
	}
	.footer-fix {box-shadow: 0 0 10px rgba(0,0,0,0.2);position: fixed;bottom: 0;left: 0;width: 100%;background-color: #fff;z-index: 10;display: none;}
.footer-fix li {float: left;width: 25%;}
.footer-fix li a {display: block;text-align: center;padding: 7px 0;font-size: 12px;line-height: 1;}
.footer-fix li i {display: block;height: 20px;background: no-repeat center;background-size: contain;margin-bottom: 4px;}
.footer-fix li i.i1 {background-image: url(../images/f_01.png);}
.footer-fix li i.i2 {background-image: url(../images/f_02.png);}
.footer-fix li i.i3 {background-image: url(../images/f_03.png);}
.footer-fix li i.i4 {background-image: url(../images/f_04.png);}