@charset "utf-8";
.infotit{ text-align:center; margin-bottom:30px;}
.infotit span{ font-size:var(--title-size-36); line-height:2; display:block; font-weight:700; letter-spacing:2px; position:relative;}
.infotit span:before{ width:60px; height:3px; background:#010101; position:absolute; left:50%; bottom:0; content:""; margin-left:-30px;}

.infoban{ display:block; position:relative; overflow:hidden;}
.infoban img{ display:block; width:100%;}
.infoban .inftxt{ position:absolute; z-index:5; width:100%; top:50%; transform: translateY(-50%); text-align:center; color:#fff;}
.infoban .inftxt span{ font-size:var(--title-size-44); line-height:1.8; display:block; font-weight:700; letter-spacing:2px;}
.infoban .inftxt i{ font-size:var(--title-size-24); font-family:"urbanist";}
@media screen and (max-width:760px) {
.infoban img{ display:block; width:130%; margin-left:-15%;}
.infoban .inftxt{ top:60%;}
}

.infourl{ border-bottom:1px #d2d2d2 solid;}
.infourl li:nth-child(1){ border-left:1px #d2d2d2 solid;}
.infourl li{ float:left; border-right:1px #d2d2d2 solid;}
.infourl li a{ display:block; padding:22px 35px; font-size:var(--title-size-18); color:#333; line-height:1.5; letter-spacing:1px;}
.infourl li a:hover{ color:var(--main-color);}
.infourl li a.lion{ background:var(--main-color); color:#fff;}
@media screen and (max-width:760px) {
.infourl .symain{ width:100%;}
.infourl li{ width:33.33%; border-bottom:1px #d2d2d2 solid;}
.infourl li:nth-child(3n){ border-right:none;}
.infourl li a{ padding:10px 0; text-align:center; background:#f0f0f0}
}

.viewurl{ line-height:1.6; text-align:right; padding:10px 0 20px;}
.viewurl a{ color:#555; margin:0 10px;}
.viewurl a:hover{color:var(--main-color);}
.viewurl i{ color:#333; margin-left:10px;}
.viewline{ height:1px; background:#ddd;}

.viewnews{ margin:3% 0;}
.viewnews_body h1{ font-size:var(--title-size-32); line-height:1.6; text-align:center;}
.viewnews_body i{ color:#555; padding-left:35px; line-height:3; border-bottom:1px #eee solid; display:block; margin:3% 0; text-align:center; font-size:var(--title-size-18);}
.viewnews_bodys{ color:#333; font-size:var(--title-size-16); line-height:2;}
.viewnews_bodys img{ display:inline; max-width:100% !important; height:auto !important;}

.newshxia{ border-top:1px #ddd solid; padding:30px 0; margin-top:35px;}
.newshxia p{ text-align:left; font-size:var(--title-size-18); color:#666; margin-bottom:10px;}
@media screen and (min-width:760px) {
.newshxia p{ width:50%; float:left;}
.newshxia p:nth-child(2){ text-align:right;}
}
.newshxia p a{ color:#666;}
.newshxia p a:hover{ color:var(--main-color);}


.viewpro{ background:#f8f8f8; padding:3%; margin-top:20px; overflow:hidden;}
@media screen and (min-width:960px) {
.viewpro_img{ float:left; width:50%;}
.viewpro_body{ float:right; width:50%; padding-left:35px;}
}
.viewpro_img img{ display:block; width:100%;}
.viewpro_body{ box-sizing: border-box;}
.viewpro_body h1{ font-size:var(--title-size-32); line-height:2; display:block; color:#333;}
.viewpro_body .pps{ font-size:var(--title-size-16); line-height:2; margin:2% 0; color:#010101;}
.viewpro_body a{ display:inline-block; font-size:var(--title-size-16); line-height:48px; border-radius:24px; color:#fff; padding:0 25px 0 55px;}
.viewpro_body a{ background: url(../images/ico01.png) var(--main-color) no-repeat center left 20px;}

.viewbody{ padding:2% 0; font-size:var(--title-size-16); line-height:2;}
.viewbody h2{ font-size:var(--title-size-32); position:relative; line-height:3; margin-bottom:25px; text-align:center;}
.viewbody h2:before{ width:50px; height:4px; background:#222; position:absolute; left:50%; bottom:0; content:""; margin-left:-25px;}
.viewbody img{ max-width:100% !important; height:auto !important;}

.aboutpro{ margin-bottom:3%;}
.aboutpro h2{ font-size:var(--title-size-32); position:relative; line-height:3; margin-bottom:25px; text-align:center;}
.aboutpro h2:before{ width:50px; height:4px; background:#222; position:absolute; left:50%; bottom:0; content:""; margin-left:-25px;}

.listhezuo{ padding:2% 0;}
.listhezuo h2{ font-size:var(--title-size-32); position:relative; line-height:3; margin-bottom:25px; text-align:center;}
.listhezuo li{ float:left; border:1px #cfcfcf solid;  height:clamp(80px, 20vw, 140px); position:relative;}
.listhezuo li img{ position:absolute; left:50%; top:50%; transform: translate(-50%,-50%); max-width:80%; max-height:80%;}
@media screen and (min-width:760px) {
.listhezuo li{ width: calc(20% - 24px); margin-right:30px; margin-bottom:30px;}
.listhezuo li:nth-child(5n+0){ margin-right:0;}
}
@media screen and (max-width:760px) {
.listhezuo li{ width: calc(50% - 14px); margin-right:24px; margin-bottom:24px;}
.listhezuo li:nth-child(2n+0){ margin-right:0;}
}


.listsj { position: relative; padding:3% 0;}
.listsj ul{ position: relative; overflow: hidden; z-index: 0; margin-top:20px;}
.listsj ul li{ box-sizing: border-box;}
.listsj ul li a{ display:block;}
@media screen and (min-width:1200px) {
.listsj ul li{ width:calc(33.33% - 24px); float:left; margin-right:36px; margin-bottom:30px;}
.listsj ul li:nth-child(3n+0){ margin-right:0;}
.listsj ul li .sjimg{ height:330px;}
}
@media screen and (max-width:1200px) and (min-width:960px) {
.listsj ul li{ width:calc(50% - 20px); float:left; margin-right:40px; margin-bottom:30px;}
.listsj ul li:nth-child(2n+0){ margin-right:0;}
.listsj ul li .sjimg{ height:310px;}
}
@media screen and (max-width:960px) and (min-width:640px) {
.listsj ul li{ width:calc(50% - 20px); float:left; margin-right:40px; margin-bottom:30px;}
.listsj ul li:nth-child(2n+0){ margin-right:0;}
.listsj ul li .sjimg{ height:280px;}
}
@media screen and (max-width:640px) {
.listsj ul li{ margin-bottom:20px;}
.listsj ul li .sjimg img{ width:100%;}
}
.listsj ul li .sjimg{ overflow:hidden; position:relative; margin-bottom:10px;}
.listsj ul li .sjimg img{ transition: all 0.3s; object-fit: cover; width:100%; height:100%; position:relative;}
.listsj ul li:hover img{ transform: scale(1.05); }
.listsj ul li em{ text-align:center; display:block; color:#111; line-height:2; transition: all 0.3s; font-size:var(--title-size-18);}
.listsj ul li:hover em{ color:var(--main-color);}

.listlich{ padding-bottom:5%;}
.listlich li{ text-align:center; cursor: pointer;}
@media screen and (min-width:1200px) {
.listlich li{ float:left; width: calc(16.66% - 50px); margin-right:60px;}
.listlich li:nth-child(6n+0){ margin-right:0;}
}
@media screen and (max-width:1200px) and (min-width:760px) {
.listlich li{ float:left; width: calc(33.33% - 30px); margin-right:45px; margin-bottom:25px;}
.listlich li:nth-child(3n+0){ margin-right:0;}
}
@media screen and (max-width:760px){
.listlich li{ float:left; width: calc(50% - 15px); margin-right:30px; margin-bottom:25px;}
.listlich li:nth-child(2n+0){ margin-right:0;}
}
.listlich li i{ display:inline-block; border:1px var(--main-color) solid; padding:10px; border-radius:50%; margin:10px 0; transition: transform 0.5s ease;}
.listlich li:hover i{transform: rotate(360deg); }
.listlich li span{ display:block; font-size:var(--title-size-24); line-height:2; font-weight:700; position:relative; padding-bottom:8px;  transition: all 0.3s;}
.listlich li span:before{ width:40px; height:1px; background:#010101; position:absolute; left:50%; bottom:0; content:""; margin-left:-20px;  transition: all 0.3s;}
.listlich li:hover span{ color:var(--main-color);}
.listlich li:hover span:before{ width:100px; margin-left:-50px; background:var(--main-color);}
.listlich li p{ padding-top:15px; font-size:var(--title-size-16); color:#666; line-height:1.8;}

.listab{ padding:4% 0; background:url(../images/headerBg2.png) center bottom no-repeat; overflow:hidden;}
.listab_tit span{ font-size:var(--title-size-32); line-height:2; font-weight:700;}
@media screen and (min-width:960px) {
.listab_body{ float:left; width:60%;}
.listab_video{ float:right; width:36%;}
}
@media screen and (max-width:960px) {
.listab_body{ margin-bottom:25px;}
}

.listab_bodys{ padding:2% 0 3%; font-size:var(--title-size-16); color:#333; line-height:2;}
.listab_bodyy li{ float:left; width: calc(33.33% - 20px); border-right:1px #e5e5e5 solid; box-sizing: border-box; margin-right:30px; padding-right:30px;}
.listab_bodyy li:nth-child(3){ margin-right:0; border-right:none; padding-right:0;}
.listab_bodyy li img{ float:right; margin-top:10px; max-width:50px;}
.listab_bodyy li p{ font-size:var(--title-size-26); color:#bb8c59;}
.listab_bodyy li p span{ display:block; font-size:var(--title-size-16); color:#333;}
.listab_bodyy li p i{ font-size:var(--title-size-60); color:#bb8c59; font-family:"urbanist"; font-weight:700; padding-right:10px;}
.listab_video{ position:relative; overflow:hidden;}
.listab_video img{ display:block; position:relative;  transition: all 0.3s;}
.listab_video img.videoimg{ width:100%;}
.listab_video:hover img.videoimg{ transform: scale(1.1); }
.listab_video a{ position:absolute; width:100%; height:100%; z-index:5; cursor: pointer; }
.listab_video a img{ position:absolute; left:50%; top:50%; transform: translate(-50%,-50%);}

.listlishi{ background:url(../images/bg1.jpg) center no-repeat; padding:3% 0;}

.about_b { padding:4% 0; background:url(../images/bg1.jpg) center no-repeat; overflow:hidden;}
.yearbg{ background:url(../images/bg2.png) center no-repeat; padding-bottom:25px;}
.about_b #history .swiper-slide { text-align: center; position: relative; cursor: pointer;}
.about_b #history .swiper-slide i{ padding-top:30px; font-size:var(--title-size-32); color:#333; display:block; transition: all 0.3s; font-family:"urbanist";}
.about_b #history .swiper-slide i:before{ width:11px; height:11px; background:var(--main-color); position:absolute; left:50%; top:0; content:""; border-radius:50%; opacity:0;}
.about_b #history .swiper-slide span{ display:block; opacity:0; font-size:var(--title-size-26); color:var(--main-color); line-height:2; margin:25px 0; transition: all 0.3s;}

.about_b #history .swiper-slide::after { content: ""; position: static; padding-top: 100%;}

.about_b #history .swiper-slide-active i { font-size:var(--title-size-44); color:var(--main-color); padding-top:25px; position:relative;}
.about_b #history .swiper-slide-active i:before{ opacity:1;}
.about_b #history .swiper-slide-active span{ opacity:1;}
.about_b .year_text { max-width:1000px; margin:4% auto;}
.about_b .year_text .textbox { font-size:var(--title-size-24); text-align:center; color:#333; line-height:2;}
@media screen and (max-width:960px) {
.about_b .year_text .textbox { padding:0 30px;}
}



.listpp { position: relative; padding:3% 0;}
.listpp ul{ position: relative; overflow: hidden; z-index: 0; margin-top:20px;}
.listpp ul li{ box-sizing: border-box;}
.listpp ul li a{ display:block;}
@media screen and (min-width:1200px) {
.listpp ul li{ width:calc(25% - 18px); float:left; margin-right:24px; margin-bottom:24px;}
.listpp ul li:nth-child(4n+0){ margin-right:0;}
.listpp ul li .ppimg{ height:260px;}
}
@media screen and (max-width:1200px) and (min-width:960px) {
.listpp ul li{ width:calc(33.33% - 20px); float:left; margin-right:30px; margin-bottom:30px;}
.listpp ul li:nth-child(3n+0){ margin-right:0;}
.listpp ul li .ppimg{ height:310px;}
}
@media screen and (max-width:960px) and (min-width:640px) {
.listpp ul li{ width:calc(50% - 20px); float:left; margin-right:40px; margin-bottom:30px;}
.listpp ul li:nth-child(2n+0){ margin-right:0;}
.listpp ul li .ppimg{ height:280px;}
}
@media screen and (max-width:640px) {
.listpp ul li{ margin-bottom:20px;}
.listpp ul li .ppimg img{ width:100%;}
}
.listpp ul li .ppimg{ overflow:hidden; position:relative; margin-bottom:10px;}
.listpp ul li .ppimg img{ transition: all 0.3s; object-fit: cover; width:100%; height:100%; position:relative;}
.listpp ul li:hover img{ transform: scale(1.05); }
.listpp ul li em{ text-align:center; display:block; color:#111; line-height:2; transition: all 0.3s; font-size:var(--title-size-18);}
.listpp ul li:hover em{ color:var(--main-color);}

.listwh01{ font-size:var(--title-size-36); line-height:1.6; font-weight:700; border-bottom:1px #d4d4d4 solid; margin-bottom:10px; padding-bottom:20px;}
.listwh02 h2{ font-size:var(--title-size-36); color:var(--main-color); font-weight:700; line-height:2.5; }
@media screen and (min-width:960px){
.listwh02 h2{ float:left; padding:0 5% 3% 0;}
}
.listwh02s{ color:#333; font-size:var(--title-size-16); line-height:2; padding-top:20px;}

.listwenhua{ padding:2% 0 5%;}
.listwenhua li{ position:relative; overflow:hidden;}
@media screen and (min-width:960px) {
.listwenhua li{ width:calc(25% - 15px); float:left; margin-right:20px; margin-bottom:20px;}
.listwenhua li:nth-child(4n+0){ margin-right:0;}
}
@media screen and (max-width:960px){
.listwenhua li{ width:calc(50% - 12px); float:left; margin-right:24px; margin-bottom:24px;}
.listwenhua li:nth-child(2n+0){ margin-right:0;}
}
.listwenhua li img{ position:absolute; width:100%; height:100%; object-fit: cover; transition: all 0.3s;}
.listwenhua li:hover img{ transform: scale(1.1); }
.listwenhua li a{ position:relative; z-index:5; padding:25px 25px 70px; display:block; color:#fff; cursor: pointer;}
.listwenhua li a span{ font-size:var(--title-size-24); line-height:2; font-weight:700;}
.listwenhua li a p{ font-size:var(--title-size-16); line-height:24px; height:72px; overflow:hidden;}

.listlixi{ padding:4% 0;}
.listlixi li{ background:#f8f8f8; border-bottom:4px var(--main-color) solid; padding:4% 0; cursor: pointer;}


@media screen and (min-width:960px){
.listlixi li{ float:left; width: calc(20% - 20px); margin-right:25px; text-align:center;}
.listlixi li:nth-child(5n+0){ margin-right:0;}
.listlixi li i{ display:inline-block; margin:0 auto; width:110px; height:110px; overflow:hidden; border:1px var(--main-color) solid; border-radius:50%; position:relative; transition: all 0.3s;}
.listlixi li i img{ position:absolute; left:0; top:0; transition: all 0.3s;}
.listlixi li:hover i{ background:var(--main-color);}
.listlixi li:hover i img{ top:-110px;}
.listlixi li em{ height:60px;}
.listlixi li p{ height:60px;}
}
@media screen and (max-width:960px){
.listlixi li{ padding:20px 25px; min-height:80px;}
.listlixi li i{ width:60px; height:60px; overflow:hidden; border:1px var(--main-color) solid; border-radius:50%; position:relative; float:left; margin-right:15px;}
.listlixi li i img{ position:absolute; left:0; top:0; transition: all 0.3s; width:100%;}
.listlixi li span{ font-weight:700;}
}
.listlixi li span{ display:block; color:#0c1637; font-size:var(--title-size-20); line-height:2.5;}
.listlixi li em{ font-size:var(--title-size-26); color:var(--main-color); display:block; font-weight:700; font-family:"urbanist";}
.listlixi li p{ max-width:80%; margin:0 auto; overflow:hidden; font-size:var(--title-size-16);}

.listly{ background:url(../images/ly.jpg) #ececec center no-repeat; padding:4% 0; overflow:hidden;}
@media screen and (min-width:960px){
.listly_con{ width:40%; float:right;}
}
@media screen and (max-width:960px){
.listly{ background:#ececec;}
}

.listly_con em{ font-size:var(--title-size-32); color:#111; line-height:2;}
.listly_con p{ margin:20px 0;}
.listly_con p .mytxt{ border:1px #989898 solid; width:100%; line-height:4; box-sizing: border-box; padding:0 25px; border-radius:10px; background:#ececec; outline:none;}
.listly_con p .mytxts{ border:1px #989898 solid; width:100%; line-height:3; box-sizing: border-box; padding:25px; border-radius:10px; background:#ececec; outline:none;}
.listly_con p .mysub{ border:0; background:var(--main-color); color:#fff; max-width:210px; width:100%; line-height:2; font-size:var(--title-size-24); border-radius:10px; cursor: pointer; outline:none;}

.vidbox { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 9999; display: none; background:rgba(0,0,0,0.4);}
.videocon { width:50%; margin: 12% auto 0 auto; }
@media(max-width:640px){
.videocon { width: 90%; margin:30% auto 0 auto; }
}
.videocon p { text-align:center; margin-top:15px;}
.videocon p i { cursor: pointer; font-size: 16px; color: #333; background:#fff; padding:13px 45px; border-radius:30px; display:inline-block;font-family:"GOTHICB";}
.videocon p i:hover{  background:var(--main-color); color:#fff;}
.videocon video { object-fit: fill; width:100% !important; height:auto !important;}