@charset "utf-8";
/* header&foot */
@font-face { font-family:"bahnschrift";src: url(../font/bahnschrift.ttf);}
.box{width: 1200px; margin: 0 auto; max-width: 92%;}
header{ width: 100%; position: relative;}
a,img{ transition: 0.3s;}
a:hover{ color: #1e50ae;}
.head{ height: 120px;}
.head h1{ font-size: 30px; font-weight: bold; color: #ccc;text-transform:uppercase;}
.head h1 b{ color: #1e50ae;}
nav a{ display: flex; width: 100px; justify-content: center; align-items: center; height: 40px; font-size: 16px; margin-left: 20px;}
nav a:hover,nav a.active{ color: #1e50ae; }
.title{ text-align: center;}
.title p{ font-size: 24px;
    line-height: 30px;
    font-weight: normal;
    color: #333; position: relative; font-weight: bold; padding-bottom: 25px;}
.title p i{ position: absolute; width: 76px; background-color: #dcdcdc; height: 1px; left: 50%; bottom: 0; transform: translateX(-50%);}
.tubox img{ display: block; margin: 0 auto; max-width: 100%;}
.danye{ font-size: 14px; color: #999; line-height: 2.6;}

.lxlist{ width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.lxlist span{ margin-top:20px; background-color: #fff; display: flex; flex-direction: column; padding: 30px; box-sizing: border-box; width:31%; font-weight: bold; max-width: 100%;}
.lxlist span img{ width: 20px; height: 24px;}
.lxlist span p{  line-height: 1.8; font-size: 18px; margin-top: 20px;}

.banner{ width:100%;/* margin-top: 124px; */}
.banner_swiper{width: 100%;height: 100%;}
.banner_swiper .swiper-slide{width: 100%; height: 100%; overflow: hidden;}
.ban_bg{width: 100%; height: 100%;}
.ban_bg img{ display: block; width: 100%;}
.banner_swiper .swiper-slide-active .bn_tx h1{transform: translateY(0); opacity: 1;}
.banner_swiper .swiper-slide-active .bn_tx h2{transform: translateY(0);opacity: 1;}
.banner_swiper .swiper-slide-active .bn_tx a{transform: translateY(0);opacity: 1;}
.banner_swiper .swiper-pagination{ width: 1200px; left: 50%;  top: auto; height: 18px!important;  bottom: 40px; text-align: left;  display: flex; justify-content: center;transform: translateX(-50%);}
.banner_swiper .swiper-pagination-bullet{ width:18px;height:18px; box-sizing: border-box; border-radius:50%;  background:#fff; opacity: 0.9; margin: 0 6px!important;}
.banner_swiper .swiper-pagination-bullet-active{opacity: 1; display: flex; align-items: center;width:18px;height:18px; box-sizing: border-box; border-radius:50%;  background:#c28734; }
.banner .swiper-button-next:after,.banner .swiper-button-prev:after{ width: 100%; box-sizing:border-box; height: 50px; line-height: 50px; text-align: center; color: #fff; font-weight: bold; font-size: 20px; border-radius:5px; transition: 0.3s; opacity: 0.8; background-color: rgba(0,0,0,0.2);}
.banner .swiper-button-next,.banner .swiper-button-prev{width: 50px!important;}
.banner .swiper-button-next:hover:after,.banner .swiper-button-prev:hover:after{color: #fff; opacity: 1;}
.banner .swiper-button-next{ right: 36px;}
.banner .swiper-button-prev{ left: 36px;}

footer{ width: 100%; color: #ccc; background-color: #2b2b2b; padding: 40px 0; line-height: 2;}
.foot{ justify-content: center; display: flex; flex-wrap: wrap; font-size: 16px;}
.foot b{ margin: 0 5px; font-weight: normal;}
.foot a{ color: #fff;}


#toTop{ background-color:rgba(0,0,0,0.2); right: 30px; bottom: 60px; width: 50px; height: 50px; border-radius: 50%; display: flex; justify-content: center; align-items: center; transition: 0.3s; z-index: 966; }
#toTop:hover{background-color:rgba(2,178,181,0.6);}
#toTop img{ width: 60%;}

section{position: relative; padding: 100px 0;}
main{width: 1200px; margin: 0 auto; max-width: 92%;}




.conf{ display: flex; box-sizing: border-box; justify-content: space-between;}
.conc{ display: flex; align-items: center;}
.ziov{white-space: nowrap;text-overflow: ellipsis;overflow: hidden; }
.ziov2{ display: -webkit-box; /* 将元素作为弹性伸缩容器 */
        overflow: hidden; /* 隐藏溢出内容 */
        text-overflow: ellipsis; /* 使用省略号表示被裁切的部分 */
        line-clamp: 2; /* 限制最大行数为2行 */
        -webkit-line-clamp: 2; /* Safari/Chrome特定的限制最大行数的属性 */
        -webkit-box-orient: vertical; /* 设置垂直布局 */}
.mtop30{ margin-top: 0.3rem;}
.mtop50{ margin-top: 0.5rem;}
/* @media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
} */
@media only screen and (max-width:1000px) {
	.head h1{ font-size: 22px;}
}
@media only screen and (max-width:750px) {
	.banner_swiper .swiper-pagination{ bottom:10px;}
	.banner_swiper .swiper-pagination-bullet{ width: 10px; height: 10px;}
	.banner_swiper .swiper-pagination-bullet-active::before{ width: 5px; height: 5px;}
	.banner_swiper .swiper-pagination{ height: 10px!important;}
	.banner .swiper-button-next:after, .banner .swiper-button-prev:after{ width: 30px; height: 30px; line-height: 30px;}
	.banner .swiper-button-prev{ left: 10px;}
	.banner .swiper-button-next{ right: 10px;}
	.head h1{ font-size: 16px;}
	.head{ height: 80px;}
	nav a{ width: auto; font-size: 14px;}
	.lxlist span{ width: 100%;}
	.lxlist span p{ font-size: 15px;}
	section{ padding: 50px 0;}
	#toTop{ width: 40px; height: 40px; right: 10px; bottom:50px}
	footer{ padding: 30px 0;}
}
@media only screen and (max-width:500px) {
	.head h1{ font-size: 12px;}
	nav a{font-size: 12px; padding: 0 5px; margin-left: 5px;}
	.title h1{ font-size: 24px;}
	.title p{ font-size: 20px;}
	.foot{ font-size: 14px;}
}