@charset "utf-8";
/* header&foot */
@font-face {font-family: "din"; src: url('../font/din.ttf');}
body,*{box-sizing: border-box;}
.box,main{width: 1450px; margin: 0 auto; max-width: 92%;}
header{ width: 100%; position: relative; background-color:  #fff; position: fixed; z-index: 996; left: 0; top: 0; box-shadow: 0 2px 2px 0px rgba(0,0,0,0.03);}
input{ border: none; background: transparent;}
a,img{color: #333; transition: 0.3s;}
a:hover{ color: #feb202;}
.tu{ position: relative; overflow: hidden;}
.tu::before{ content: ""; display: block; padding-top: 100%;}
.tu img{ position: absolute; left: 0; top: 0; z-index: 4; width: 100%; height: 100%; display: block;object-fit: cover;}
.tu1{ position: relative; overflow: hidden;}
.tu1::before{ content: ""; display: block; padding-top: 54%;}
.tu1 img{ position: absolute; left: 0; top: 0; z-index: 4; width: 100%; height: 100%; display: block;object-fit: cover;}
.tu2{ position: relative; overflow: hidden;}
.tu2::before{ content: ""; display: block; padding-top: 51%;}
.tu2 img{ position: absolute; left: 0; top: 0; z-index: 4; width: 100%; height: 100%; display: block;object-fit: contain;}
.djtu:hover img{ transform: scale(1.05);}

.logo{ max-width: 20%; margin-right: 3%; height: calc(100% - 40px);}
.logo img{ max-height: 100%;}
.head.box{ width: 90%; height: 120px;}
nav{ height: 100%; flex: 1;box-sizing: border-box; padding-bottom: 10px;}
.topri{ margin-left: 1%;}
.toprinav{ padding-bottom: 10px; font-size: 18px;}
.toprinav img{ margin-right: 8px;}
.nav-item{position: relative;height: 100%; width: 100%;}
.nav-box{height: 100%;}
.mc{display: none}
.first-nav{ height: 100%; width: 100%;}
.first-nav a{  font-size:18px; display: flex; align-items: center; justify-content: center; height: 100%; position: relative; transition: 0.3s; color: #000;}
.first-nav a i{display: none; margin-left: 10px; transition: 0.3s;}
.first-nav a i::before{content: "\e600";}
.first-nav.focus i{transform: rotate(180deg);}
.first-nav a em{ position: absolute; left: 50%; transform: translateX(-50%); bottom: 20%; width: 0; background-color: #feb202; height: 3px; width: 0; overflow: hidden; transition: 0.3s;}
.second-nav{position: absolute; left: 50%; top: 130px; background: #fff;  box-sizing: border-box;z-index: 99; max-height: 0; overflow: hidden; opacity: 0; transition: 0.3s; min-width: 100%; transform: translateX(-50%); background-color: rgba(255,255,255,0.9);box-shadow: 0px 2px 4px rgba(0,0,0,0.1); }
.second-nav a{color: #333; display: block;text-align: center; font-size: 16px; line-height: 3; transition: 0.3s; white-space: nowrap; padding: 0 30px;}
.second-nav a:hover{ background-color: #feb202; color: #fff;}
.nav-item:hover .first-nav a em,.first-nav.on a em{ width: 44px;}
.nav-item:hover .second-nav{ max-height: 1000px; opacity: 1;}
.mBtn{ width: 40px; height: 40px; border-radius: 4px;cursor: pointer; box-sizing: border-box;display: none;}
.mBtn span{ display: block;  width: 26px;}
.mBtn span i{width: 100%; height: 2px; background: #feb202; display: block; margin: 0 auto;  margin-top: 5px; transition: 0.5s;}
.mBtn span i:first-child{margin-top: 0;}
.mBtn.active{ background-color:transparent;}
.mBtn.active span i:nth-child(1){transform: rotate(45deg) translateY(4px) translateX(4px);}
.mBtn.active span i:nth-child(2){transform: rotate(-45deg) translateY(-1px) translateX(1px);}
.mBtn.active span i:nth-child(3){ width: 4px;}
.banner,.swiper,.bannerbox,.swiper-slide{ width: 100%; overflow: hidden; height: auto;}
.swiper-slide img{display: block;width: 100%; object-fit: cover;}
.swiper-pagination-bullet{ opacity: 0.4; width: 52px; height: 4px; background-color: #fff; border-radius: 0; margin-right: 10px;}
.swiper-pagination-bullet.swiper-pagination-bullet-active{ opacity: 1;}
.swiper-pagination{ bottom: 50px!important; width: 1450px!important;max-width: 92%!important; left: 50%!important; transform: translateX(-50%)!important; text-align: left!important;}
.swiper-button-next,.swiper-button-prev{ overflow: hidden; width: 80px; height: 80px;transition: 0.3s;align-items: center; justify-content: center; border-radius: 100%; background-color: rgba(255,255,255,0.5);box-shadow: 0 5px 5px rgba(0,0,0,0.1); /* transform: translateY(-50%); */}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after,.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{ font-size: 30px; font-weight: bold; color: #feb202;}
.swiper-button-next:hover,.swiper-button-prev:hover{ background-color:rgba(255,255,255,0.8); }
.title{ text-align: center;}
.title h2{ font-size: 68px; font-weight: bold;text-transform:uppercase;background: linear-gradient(to bottom, #f0f0f0 30%, rgba(240,240,240,0) 90%);-webkit-background-clip: text; color: transparent;}
.title h3{ font-size: 46px; font-weight: bold; position: relative; margin-top: -0.5em;}
.title h3 b{ color: #feb202;}
.title p{ font-size: 22px; color: #717071;}
.more{ border: 1px solid #feb202; display: flex; height: 40px; width: 146px; padding: 0 25px;border-radius: 40px; font-size: 16px; color: #feb202;}
.more:hover{ transform: translateY(-4px);}
.more b{ font-size: 26px; position: relative; margin-top: -4px; margin-right: -4px;}
section{ padding:65px 0; position: relative;}
footer{ background-color: #464646; color: #efefef; padding-top: 30px; font-size: 16px;}
footer a{ color: #fff;}
.foot_di{ font-size: 14px; border-top: 1px solid #717171; padding: 25px 0;}
.ft1{ width: 260px;}
.erweima{ border: 1px solid #717171; width: 100%; box-sizing: border-box; margin-top: 20px;}
.erweima img{ width: 118px; height: 118px; box-sizing: border-box; padding:10px; border-right: 1px solid #717171;}
.erweima span{ display: flex; justify-content: center; align-items: center; line-height: 2; width: calc(100% - 118px); text-align: center;}
.foot{ padding-bottom: 40px;}
.ft2{ width: 500px;}
.ft2>div{ width: 200px;}
.ft2 img{ width: 57px; display: block; margin-bottom: 20px;}
.ft2 h3{ font-size: 24px; font-weight: bold; font-family: Arial, Helvetica, sans-serif; color: #cecece; margin-top: 5px;}
.ft2 p{color: #cecece;}
.ft2 h2,.ft2 p{ line-height: 28px;}
.ft3{ width: calc(100% - 260px - 500px - 200px); box-sizing: border-box; padding-left: 30px; border-left: 1px solid #717171; flex-wrap: wrap;}
.ft3 span{ padding: 0 5px; display: flex; flex-direction: column;}
.ft3 span h2{font-weight: bold; margin-bottom: 10px;}
.ft3 span p{ color: #cecece; font-size: 14px; line-height: 2;}

.con1le{ border-radius: 20px 0 0 20px; width: calc(100% - 670px - 50px);}
.con1ri{ width: 670px;}
.con1ri .tit{ font-size: 30px;}
.con1ri .danye{ margin-top: 30px;}
.con1k{ text-align: center; color: #666; font-size: 16px; margin-top: 30px;}
.con1k img{ margin: 0 auto; display: block; margin-bottom: 20px;}
.con1k:hover img{ transform: rotateY(-180deg);}
.con2,.con4{ background-color: #f8f8f8;}
.linktu{ background-color: #fff; width: calc(16.66% - 20px); border-radius: 1rem; box-sizing: border-box; padding: 5px; margin: 12px; margin-left: 0; margin-right: 24px; box-shadow: 0 0px 10px rgba(0,0,0,0.1);}
.linktu img{object-fit: contain;}
.linktu:hover{ transform: translateY(-5px); box-shadow: 0 0px 10px rgba(254,162,2,0.3);}
.linktu:nth-child(6n){ margin-right: 0;}
.juzhong .more{ margin: 0 auto; margin-top: 30px;}
.con4{ padding-bottom: 0;}
.con4le,.con4ri{ width: 50%;}
.con4le{ background-color: #fff;}
.con4tit{ width: 100%;}
.con4ri{ background-color: #fea202; color: #fff; padding: 50px;}
.con4tit h2{ font-size: 26px; position: relative; padding-bottom: 20px;}
.con4tit h2 i{ width: 32px; height: 2px; position: absolute; left: 0;bottom: 0; background-color: #4a4a4a;}
.con4ri .con4tit h2 i{ background-color: #fff;}
.pad40{ padding: 40px;}
.con4 .danye{ margin-top: 30px; line-height: 2.4;}
.con4ri .more{ border: 1px solid #fff; color: #fff; margin-top: 50px;}
.tulist{ background-color: #f8f8f8; position: relative; padding: 10px; border-radius: 10px; overflow: hidden; margin-top: 50px;}
.tulist .fu{ position: absolute; z-index: 4; left: 0; top:0; width: 100%; height: 100%; transition: 0.3s; opacity: 0;}
.tulist:hover .fu{opacity: 1;}
.tulist .futex1{background: url(../img/more.png) center center no-repeat rgba(252,188,75,0.7); background-size: 3.5rem; font-size:24px; text-align: center; color:#fff;display: flex; align-items: flex-end;}
.futex1 p{ padding: 0 20px; text-align: center; width: 100%; line-height: 4;}
.new_sy{ background-color: #f6f6f6; box-sizing:border-box; padding: 40px; padding-bottom: 50px; display: block;}
.new_sy h2{ font-size: 26px; color: #000;}
.new_sy h4{ color: #666; font-size: 22px;}
.new_sy h4 i{ padding-right: 14px;}
.new_sy h3{ font-size: 22px; margin-top: 30px; color: #000;}
.new_sy p{ font-size: 18px; line-height: 2.2; margin-top: 25px; margin-bottom: 35px; color: #666;}

/* 二级分页 */
ul.yiiPager{ display: flex;  justify-content: center;}  
ul.yiiPager li{display:block; margin:0 3px;}  
ul.yiiPager li a{ width: 40px; height: 40px; border-radius:10px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; line-height: 1; border:#ddd solid 1px;color: #666; transition: 0.3s;}  
ul.yiiPager li a:hover{background:#feb202;border:#feb202 solid 1px;color:#FFF;}
ul.yiiPager li.first a::before{content: "\e741";}
ul.yiiPager li.last a::before{content: "\e741"; transform: rotate(180deg);}
ul.yiiPager li.previous a::before{content: "\e694";transform: rotate(180deg); font-size: 14px;}
ul.yiiPager li.next a::before{content: "\e694"; font-size: 14px;}
ul.yiiPager li.selected a{background:#feb202;border:#feb202 solid 1px;color:#FFF;}
ul.yiiPager li.shouye a{ width: 60px; border-radius: 40px;}
.bar{margin-top: 50px; display: flex; justify-content: space-between;}
.bar a{font-size: 16px; color: #666; line-height: 1; transition: 0.3s;background: #F2F2F2;}
.bar a:hover{background: #feb202; color: #fff;}
.bar a.show_prev{display: flex; align-items: center; justify-content: space-between;  padding: 20px 30px; box-sizing: border-box; width: calc(50% - 100px);}
.bar a.show_prev::before{content: "\e694"; transform: rotate(-180deg);}
.bar a.show_prev i{width: calc(100% - 30px);word-wrap:break-word; white-space:nowrap;overflow: hidden;text-overflow:ellipsis;}
.bar a.show_next{display: flex; align-items: center; justify-content: space-between;  padding: 20px 30px; box-sizing: border-box; width: calc(50% - 100px);}
.bar a.show_next::after{content: "\e694"; }
.bar a.show_next i{width: calc(100% - 30px);word-wrap:break-word; white-space:nowrap;overflow: hidden;text-overflow:ellipsis; text-align: right;}
.bar a.back_list{display: flex;align-items: center; justify-content: center; width: 140px;}
.bar a.back_list::before{content: "\e675"; display: block; margin-right: 8px;font-size: 14px;}

.show_title{text-align: center;  border-bottom: 1px #e1e1e1 solid; padding-bottom: 30px;}
.show_title h2{font-size: 28px; font-weight: bold;}
.show_title p{margin-top: 20px; color: #999; font-size: 18px;}
.danye{line-height: 2;font-size: 18px; width: 100%;}
.danye img{max-width: 100%!important; width: 600px!important; display: block; margin: 0 auto;}
.ertitle{ text-align: center;}
.ertitle h2{ font-size: 28px; color: #323232; font-weight: bold;}
.ertitle p{ font-size: 18px; color: #666; margin-top: 10px;}
.newlist{ background-color: #f4f4f4; margin-top: 30px; width: 100%;}
.newlist{ box-sizing: border-box; padding: 30px;}
.newlistle{width: 334px;}
.newlistri{ width: calc(100% - 360px); font-size: 18px; color: #666; transition: 0.3s;}
.newlistri h2{ font-size: 24px; color: #232323; transition: 0.3s;}
.newlistri p{ line-height: 2.2; width: 100%; margin: 15px 0; }
.newlist:hover{ background-color: #feb202;}
.newlist:hover .newlistri,.newlist:hover .newlistri h2{ color: #fff;}
.erbox .tit{ text-align: center; font-size: 30px;}
.ernav{ justify-content: center;}
.ernav a{ font-size: 18px; height: 60px; display: flex; align-items: center; border: 1px solid #cecece; padding: 0 30px; margin: 5px 12px; min-width: 6em; box-sizing: content-box; justify-content: center; text-align: center;}
.ernav a:hover{ border: 1px solid #fea202;}
.ernav a.on{border: 1px solid #fea202; background-color: #fea202; color: #fff;}
.lxmap{  border: 1px solid #fff; width: calc(100% - 400px); height: 476px;}
.lxlist{ width:400px; display: flex; flex-wrap: wrap; justify-content: space-between;}
.lxlist span{ background-color: #f9f9f9; display: flex; flex-direction: column;transition: 0.3s; padding:20px 30px; box-sizing: border-box; width:100%; border: 1px solid #fff;}
.lxlist span img{ width: 20px; height: 24px;}
.lxlist span p{  line-height: 1.7; font-size: 18px; margin-top: 20px;}
.lxfoot{ display: flex; flex-direction: column; justify-content: center; text-align: center; margin-top: 90px;}
.lxfoot span{ width: 812px; max-width: 100%; background: url(../img/xlbj.png) no-repeat center; background-size: 100%; margin: 0 auto;}
.lxfoot span img{ display: block; margin: 0 auto; width: 112px; height: 112px; border: 1px solid #bababa;}
.lxfoot h1{ font-size: 20px; margin-top: 20px; color: #000;}
.lxfoot p{ margin-top: 40px; font-size: 20px; color: #666;}
.lxlist span:hover{ background-color: #f3f3f3;}
.linktu.erlink{ margin: 0 auto; margin-top: 30px; width: 276px; max-width: 50%;}
.sousou{ border: 1px solid #cecece; height: 60px; background: url(../img/sous.png) left 18px center no-repeat; background-size: 24px;}
.sousou input{font-size: 18px;}
.sous{ width: 120px; display: flex; border: none; background-color: #fea202; color: #fff; height: 100%; align-items: center; justify-content: center; transition: 0.3s;}
.souk{ border: none; width: calc(100% - 120px); display: block; height: 100%; padding-right: 20px; padding-left: 58px;}
.sous:hover{ cursor: pointer; background-color: #fa7d03;}

select::-ms-expand { display: none;} 
select {appearance:none; -moz-appearance:none; -webkit-appearance:none;}
/* input::placeholder{color:#999;} */

.kuai3{ width: calc(33.33% - 30px); margin-right:45px;}
.kuai3:nth-child(3n){ margin-right: 0;}
.conf{ display: flex; justify-content: space-between;}
.conc{ display: flex; align-items: center;}
.confw{ display: flex; flex-wrap: wrap;}
.dianji{ cursor: pointer;}
.sj{ display: none;}
.pc{ display: block;}
.cu{ font-weight: bold;}
.cor1{ color: #feb202;}
.mtop40{ margin-top: 40px;}
.mtop30{ margin-top: 30px;}
.mtop50{ margin-top: 50px;}
.mtop20{ margin-top: 20px;}
.mtop10{ margin-top: 10px;}
.mtop60{ margin-top: 60px;}



/*----- 超出省略号///-----*/
.toe{ word-break:keep-all; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.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; /* 设置垂直布局 */}
.ziov4{ display: -webkit-box; /* 将元素作为弹性伸缩容器 */
        overflow: hidden; /* 隐藏溢出内容 */
        text-overflow: ellipsis; /* 使用省略号表示被裁切的部分 */
        line-clamp: 4; /* 限制最大行数为4行 */
        -webkit-line-clamp: 4; /* Safari/Chrome特定的限制最大行数的属性 */
        -webkit-box-orient: vertical; /* 设置垂直布局 */}
.ziov3{ display: -webkit-box; /* 将元素作为弹性伸缩容器 */
        overflow: hidden; /* 隐藏溢出内容 */
        text-overflow: ellipsis; /* 使用省略号表示被裁切的部分 */
        line-clamp: 3; /* 限制最大行数为3行 */
        -webkit-line-clamp: 3; /* Safari/Chrome特定的限制最大行数的属性 */
        -webkit-box-orient: vertical; /* 设置垂直布局 */}
.ziov5{ display: -webkit-box; /* 将元素作为弹性伸缩容器 */
        overflow: hidden; /* 隐藏溢出内容 */
        text-overflow: ellipsis; /* 使用省略号表示被裁切的部分 */
        line-clamp: 5; /* 限制最大行数为5行 */
        -webkit-line-clamp: 5; /* Safari/Chrome特定的限制最大行数的属性 */
        -webkit-box-orient: vertical; /* 设置垂直布局 */}	
.ziov7{ display: -webkit-box; /* 将元素作为弹性伸缩容器 */
        overflow: hidden; /* 隐藏溢出内容 */
        text-overflow: ellipsis; /* 使用省略号表示被裁切的部分 */
        line-clamp: 7; /* 限制最大行数为7行 */
        -webkit-line-clamp: 7; /* Safari/Chrome特定的限制最大行数的属性 */
        -webkit-box-orient: vertical; /* 设置垂直布局 */}	
.ma img{
	image-rendering: -moz-crisp-edges; /* Firefox */
	image-rendering: -webkit-optimize-contrast; /* Webkit (Safari/Chrome) */
	image-rendering: pixelated; /* Standards */
	}