﻿:root{
	--main_color:#003e8e;
    --main_red_color:#d71315;
}

.width_1600{ width:1600px; margin:0 auto; }
.clearfix:after{ content: ""; clear: both; visibility: hidden; display: block; height: 0;}
.clearfix{ zoom: 1;}
#fp-nav ul li a span{ background: #fff;}
::-webkit-scrollbar {
  width: 5px;
  height: 40px;
}
::-webkit-scrollbar-track {
  background-color: #eee;
}
::-webkit-scrollbar-thumb {
  background-color: var(--main_red_color);
}
::-webkit-scrollbar-thumb:hover {
  background-color: #eee
}
::-webkit-scrollbar-thumb:active {
  background-color: #eee
}


.product_up,.about{ margin-top:48px;}

/*第一屏*/
#mould86072{ width:100%; position:fixed; top:0; left:0; background:none; z-index:99; transition:1s;}
.navbars41{ padding:0 4%; box-sizing:border-box; height:88px;}
.navbars41 .logo{ float:left; width: 20%; height:100%; display: table;}
.navbars41 .logo a{ display: table-cell; vertical-align: middle;}
.navbars41 .logo a img{ width:100%;}
.navbars41 .logo a img:last-child{ display:none;}
.navbars41 ul{ float:right; width:50%; margin-right:1%; line-height:88px;}
.navbars41 li{ float:left; width:calc(100% / 6); position:relative;}
.navbars41 li>a{ padding:0 24px; font-size: 18px; transition:.5s; color:#fff;}
.navbars41 li>a:hover{ }
.navbars41 li.active a{ }
.navbars41 li:nth-child(3) .hide1{ width:200px;}
.navbars41 li .hide1{ width:140px; position:absolute; top:80px; left:50%; transform:translateX(-60%); background: #fff; padding:10px; box-sizing:border-box; border-radius:5px; display:none; box-shadow: 0 0 10px rgb(0 0 0 / 20%);}
.navbars41 li:hover .hide1{ display:block; text-align:center;}
.navbars41 li .hide1 a{ display:block; padding:0 20px;}
.navbars41 li:hover .hide1 a{ background: none; border-radius:inherit; color:#333; line-height:44px;}
.navbars41 li:hover .hide1 a:hover{ background: var(--main_color); border-radius:5px; color:#fff;}
.navbars41 .phone_a{ float:right; background:url(/images/phone.png) no-repeat left center; background-size: 28px; padding-left:40px; font-size:28px; font-weight:bold; font-family:arial; line-height:88px; color:#fff;}
.navbars41 .language{ float: right; background:url(/images/earth1.png) no-repeat left center; background-size:30px; padding-left:36px; margin-top:29px; margin-left:20px;}
.navbars41 .language a{ line-height:30px; color:#fff; font-family:arial; font-size:18px;}

#mould86072:hover{ background:#fff!important; box-shadow: 0 0 10px rgb(0 0 0 / 20%);}
.navbars41:hover .logo a img:first-child{ display:none;}
.navbars41:hover .logo a img:last-child{ display:block;}
.navbars41:hover li>a{ color:#333}
.navbars41:hover li>a:hover{ color:var(--main_color);}
.navbars41:hover li.active a{ color:var(--main_color);}
.navbars41:hover .phone_a{ background:url(/images/phone1.png) no-repeat left center; background-size: 28px; color:var(--main_color);}
.navbars41:hover .language{ float: right; background:url(/images/earth.png) no-repeat left center; background-size:30px; padding-left:36px; margin-top:29px; margin-left:20px;}
.navbars41:hover .language a{ line-height:30px; color:var(--main_color); font-family:arial; font-size:18px;}

.header_active{ background:#fff!important; box-shadow: 0 0 10px rgb(0 0 0 / 20%);}
.header_active .navbars41 .logo a img:first-child{ display:none;}
.header_active .navbars41 .logo a img:last-child{ display:block;}
.header_active .navbars41 li>a{ color:#333}
.header_active .navbars41 li>a:hover{ color:var(--main_color);}
.header_active .navbars41 li.active a{ color:var(--main_color);}
.header_active .navbars41 .phone_a{ background:url(/images/phone1.png) no-repeat left center; background-size: 28px; color:var(--main_color);}
.header_active .navbars41 .language{ float: right; background:url(/images/earth.png) no-repeat left center; background-size:30px; padding-left:36px; margin-top:29px; margin-left:20px;}
.header_active .navbars41 .language a{ line-height:30px; color:var(--main_color); font-family:arial; font-size:18px;}

/*banner*/
.banner1 .swiper-slide{ position:relative; width:100%!important; overflow: hidden;}
.banner1 .swiper-slide img{ width:100%; height:100vh; transition:1s linear 2s; transform:scale(1.1,1.1);}
.banner1 .swiper-slide .txt{ width:100%; position:absolute; top:52%; left:50%; transform: translate(-50%, -50%); color:#fff; text-align:Center;}
.banner1 .swiper-slide .txt h2{ font-size:70px; line-height:78px; font-weight:bold;}
.banner1 .swiper-slide .txt h3{ font-size:42px; line-height:46px; margin-top:36px;}
.banner1 .swiper-pagination-bullet{ background:#fff; opacity:0.5; width: 12px; height: 12px; border-radius: 6px;}
.banner1 .swiper-pagination-bullet-active{ opacity:1;}



/*第二屏 简介*/
.about{ display: flex;justify-content: space-between;}
.about .left{ width: 45%;color: #fff;}
.about .left h2{ font-size: 48px; font-weight: bold; line-height: 48px;}
.about .left h4{ font-size: 24px; line-height: 24px; margin:30px 0 48px 0;}
.about .left p{ font-size: 18px; line-height: 36px; text-align: justify; padding-bottom: 36px;}
.liaoj{ width: 250px;height: 40px;color: #fff;display: flex;align-items: center;}
.a_img{ position: relative; transform: translateX(20px); animation: jiant 3s infinite linear alternate; display: flex; justify-content: center; align-items: center;}
.liaoj span{ width: 35px; height: 35px; border: 1px solid #fff; border-radius: 50px;}
.liaoj:hover span{ border: 1px solid var(--main_color);}
.liaoj:hover{ color:var(--main_color);}
.liaoj:hover .a_img img:first-child { opacity: 0;}
.liaoj .a_img img:last-child { position: absolute;left: 0;top: 0;opacity: 0;}
.liaoj:hover .a_img img:last-child {opacity: 1;}

.about .right{ width:40%; color: #fff;}
.boxa{ border-top: 1px solid rgba(255,255,255,0.3); padding:30px 0;}
.boxa h3{ font-size: 24px; line-height: 24px; font-weight: bold; margin-bottom:10px; text-shadow: 0 2px 2px rgb(0 0 0 / 30%);}
.boxa p{ font-size: 16px; line-height: 30px;}


/*第三屏 产品*/
.product_up .left{ float:left; color: #fff;}
.product_up .left h2{ font-size: 36px; line-height:36px; font-weight:bold; margin-bottom:20px;}
.product_up .left p{ font-size: 18px;}
.product_up .right{ float:right; margin-top:32px;}
.product_up .right a{ display:inline-block; width:120px; line-height:48px; font-weight:bold; color:#fff; font-size:18px; text-align:Center; border-radius:8px; border:1px solid #fff; box-sizing:border-box;}
.product_up .right a:hover{ background: #fff; color:var(--main_color);}

.banner11{ margin-top:36px;}
.banner11 .swiper-slide{ width:100%; position:relative; overflow:hidden; border-radius:12px;}
.banner11 .swiper-slide:after{ content: ""; width:100%; height:200px; background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1)); position:absolute; bottom:0;}
.banner11 .swiper-slide:hover:after{ background:linear-gradient(rgba(0,62,142,0),rgba(0,62,142,1));}
.banner11 .swiper-slide a{ display:block;}
.banner11 .swiper-slide a img{ transition:.5s;}
.banner11 .swiper-slide:hover a img{ transform:scale(1.05);}
.banner11 .swiper-slide p{ font-size:20px; line-height:20px; font-weight:bold; color:#fff; position:absolute; bottom:30px; left:30px; z-index:2;}
.banner11 .swiper-container{ padding-bottom:36px;}
.banner11 .swiper-container .swiper-pagination{ bottom:0; width: 100%; right: 0; left: inherit;}
.banner11 .swiper-container .swiper-pagination .swiper-pagination-bullet{ background-color:rgb(255, 255, 255);background:rgb(255, 255, 255);opacity:0.4; width:12px!important; height:12px; border-radius:50%!important;}
.banner11 .swiper-container .swiper-pagination .swiper-pagination-bullet-active{ background-color:rgb(255, 255, 255);background:rgb(255, 255, 255);opacity:1; width:12px!important; height:12px; border-radius:50%!important;}



/*第四屏 案例展示*/
.case_a{ padding: 80px 0;}
.case_a ul{ margin-top:36px;}
.case_a li{ width:23.5%; float:left; margin-right:2%; position:relative; border-radius:10px; overflow:hidden;}
.case_a li:nth-child(4n){ margin-right:0;}
.case_a li:nth-child(-n+4){ margin-bottom:20px;}
.case_a li a{ display:block;}
.case_a li a img{ transition:1s;}
.case_a li a:hover img{ transform:scale(1.1);}
.case_a li div{ text-align:center; color:#fff; width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; top:0; left:0;}
.case_a li div p{ font-size:20px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.case_a li:hover div{ display:none;}


/*第五屏 新闻*/
.banner12{ margin-top:36px;}
.banner12 .swiper-slide{ background:#fff; border-radius:16px; overflow:hidden; padding:18px; box-sizing:border-box;}
.banner12 .swiper-slide a{ display:block; border-radius:10px; overflow:hidden;}
.banner12 .swiper-slide a img{ transition:1s;}
.banner12 .swiper-slide a:hover img{ transform:scale(1.1);}
.banner12 .swiper-slide span{ display:block; font-size:20px; font-weight:bold; line-height:20px; margin:24px 0 12px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.banner12 .swiper-slide p{ line-height:26px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}


/*第六屏 底部*/
.lianxi {padding: 7% 0 3%;}
.dianji{display: flex;flex-direction: column;align-items: center;}
.dianji strong {color: #fff;font-size: 36px;line-height: 2; letter-spacing: 2px;}
.lx {color: #fff;border: 1px solid #fff;width: 210px;height: 50px;border-radius: 50px;display: flex;justify-content: center;align-items: center;margin-top: 1%;}
.lx:hover { color:var(--main_color); background:#fff;}
.fnav {padding-top: 3%;background-color: #333;}
.f-nav.width_1600 {display: flex;flex-direction: column;}
.sec {display: flex;flex-direction: row;justify-content: space-between;margin-top: 2%;margin-bottom: 3%;}
.sec ul.clearfix {display: flex;flex: 1.5;justify-content: space-between;margin-right: 2%;/* color: #fff; */}
.tu {display: flex;width: 1;align-items: center;color:#fff;}
.tu1 {flex: 1;max-width: 190px;display: flex;flex-direction: column;align-items: center;margin-left: 5%;}
.tu1 p{line-height:3;}
.tu1:nth-child(1) img{border-radius: 10px;}
.tu1:nth-child(2) img{border-radius: 10px;}
.sec ul li {flex: 1;}
.sec li:nth-child(2){ flex: 1.5;}
.sec li:nth-child(2) h5{ float:left; width:49%;}
.sec li h4 {font-size: 20px; margin-bottom: 7%; position: relative; padding-bottom: 24px;}
.sec li h4::after{content: '';position: absolute;left: 0;right: 0;bottom: 0;height: 1px;width: 35%;background-color: #ffffff3b;}
.sec li:nth-child(2) h4::after{ width:80%;}
.sec a{color:#fff;}
.sec li h5 {font-size: 16px;line-height: 2;margin-bottom: 4%;}
.foo {display: flex;flex-direction: row;justify-content: space-between;margin: 1% 0 2%;color:#fff;align-items: center;}
.foo h2 {font-size: 30px;font-weight: bold;flex: 1;display: flex;align-items: center;}
.foo h2 img {margin-right: 3%;}
.foo h4 img {margin-right: 2%;}
.foo h4 {font-size: 26px; flex: 2;}
.copyright div {display: flex;justify-content: space-between;color:#fff;}
.copyright{border-top: 1px solid #ffffff3b;padding: 1% 0;}
.copyright a{color:#fff;}


@media screen and (max-width:1680px){ 
  .width_1600{ width:92%;}
}
@media screen and (max-width:1500px){ 

}
@media screen and (max-width:1440px){ 

}
@media screen and (max-width:1360px){ 

}














