@charset "utf-8";

.header{position: fixed;width: 100%;background: #000; z-index: 100;left: 0;top: 0;}
.headerabox{height: 80px;display: flex;justify-content:space-between; align-items: center;margin: 0 auto;width: 1080px;max-width: 90%;transition: all .5s;}
.headerabox.on{height: 60px;}
.headerabox.on .sub{top: 60px;}
.headerabox.on .logo{width: 200px;}
.headerabox.on .nav li h3 a{line-height: 60px;height: 60px;}
.headerabox.on .fgx{height: 60px;}
.logo{width: 335px;}
.logo img{width: 100%;}
.nav ul{display: flex;justify-content: space-between;gap:25px;}
.nav li{position: relative;}

.nav li h3 a{display: inline-block; line-height: 80px; font-size: 16px;color: #fff;font-weight: 600;height: 80px;}
.nav h3 b{display: inline-block;background:url(../imgaes/a1.png) no-repeat center center;width: 10px;height: 6px;vertical-align: middle; margin: -3px 0 0 5px;}
.nav li h3{position: relative;}
.nav li.cur h3 a{color: #85c6f2;}
.nav li.cur h3:before{width: 100%;}
.nav h3 a:hover{color: #85c6f2;}
.sub{position: absolute; left: 0;top: 80px;z-index: 10;width: 240px;background: #000;border-top: 3px solid #3399ff; padding: 20px 40px;display: none;}
.sub dt{font-weight: bold;font-size: 14px; line-height: 40px;}
.sub dt a{color: #fff;font-weight: bold;transition: .5s;}
.sub dt a:hover{opacity: .7;}
.fgx{height: 80px;}

.banner{overflow: hidden;position: relative;height: 320px;}
.banner:before{position: absolute;content: "";background: rgba(0,0,0,.6);width: 100%;height: 100%; left: 0;top: 0;z-index: 100;}
.banner img{width: 100%;height: 100%; object-fit: cover;animation: scaledh 8s 1;}
@keyframes scaledh{
0%{  transform: scale(1.2);}
100%{  transform: scale(1);}
}
.bannerText{position: absolute;width: 100%; text-align: center; top: 50%;transform: translateY(-50%);left: 0;z-index: 101;}
.bannerText h2{font-weight: 700;color: #fff;font-size: 36px; margin-bottom: 15px;}
.bannerText h2 b{font-size: 20px;font-weight: bold;}
.bannerText p{color: #fff;font-size: 24pt;font-weight: bold;line-height: 1.3;}

.wzcont{width: 1080px;max-width: 90%; margin: 0 auto;}
.cplb ul{display: flex;gap:60px;padding: 85px 0 30px;}
.cplb li{width: calc(33.3333% - 120px/3);}
.cplb span{display: block;overflow: hidden;}
.cplb img{width: 100%;transition: all .5s;aspect-ratio: 320 / 240;object-fit: cover;}
.cplbtext h2{text-align: center;font-weight: bold;color: #3166bf;font-size: 18px;margin: 30px 0 10px;}
.cplbtext p{color: #666; line-height: 1.7em; font-size: 16px;}
.text{border-top: 1px solid #e5e5e5;padding: 20px 0 35px;}
.text p{text-align: center; font-weight: bold;color: #0066bf;font-size: 26px;}

.footer{background: #171717;}
.footerbox{width: 1080px;margin: 0 auto;max-width: 90%;height: 55px;display: flex;justify-content: space-between;align-items: center;}
.footerbox p{font-size: 14px;color: #666;}
.footerbox ul{display: flex;gap:30px;}
.footerbox img{transition: all .5s;}
.footerbox a:hover img{opacity: .6;}

.about{display: flex;justify-content: space-between;padding: 80px 0;}
.aboutLeft{width: calc(100% - 320px); padding-right: 60px;}
.aboutLeft h2{font-weight: bold;    color: #0066bf;font-size: 26px;margin-bottom: 20px;}
.aboutLeft p{color: #666;font-size: 14px; line-height: 1.7em;}
.aboutRight{width: 320px;border-right: 1px solid #e5e5e5;}
.aboutRight h2{color: #0066bf;font-size: 18px;margin-bottom: 20px;font-weight: bold;}
.aboutRight li{color: #666;font-size: 16px; line-height: 34px;}

.Services{display: flex;justify-content: space-between; padding: 80px 0;}
.ServicesLeft{width: calc(100% - 320px); padding-right: 30px;}
.ServicesLeft h2{font-weight: bold;    color: #0066bf;font-size: 26px;margin-bottom: 20px;}
.ServicesLeft li{color: #666;font-size: 16px; line-height: 34px; position: relative; padding-left: 17px;}
.ServicesLeft li:before{position: absolute;content: "";width: 5px;height: 5px;border-radius: 50%;background: #666666;left: 0;top: 14px;}
.ServicesRight{width: 320px;}
.ServicesRight img{width: 100%;}

.contact{display: flex;justify-content: space-between; padding: 80px 0 200px;}
.contactleft{width: calc(100% - 320px);padding-right: 60px;}
.contactleft ul{display: flex;gap:25px;flex-wrap: wrap;}
.contactleft li{width: calc(50% - 25px/2);}
.wby1{width: 100%; height: 50px; line-height: 50px;background: #eeeeee; padding: 0 18px;}
.contactleft ul li:nth-child(3){ width:100%;}
.wby2{width: 100%; height: 150px; background: #eeeeee; padding:18px;}
.btnbox{ padding-top: 10px;}
.btnbox dl{text-align: right;}
.btnbox dt{display: inline-block;color: #666;font-size: 16px;}
.wby3{width: 50px;height: 50px;background: #eeeeee;text-align: center;}
.btn2{height: 50px;border-radius: 4px;border: 2px solid #2ea3f2;font-size: 16px;color: #2ea3f2;background: #fff; margin-left: 18px; padding: 0 20px;transition: all .5s;}
.btn2 b{background: url(../imgaes/a5.png);width: 9px;height: 16px; margin-left: 13px;vertical-align: middle; margin: -3px 0 0 13px;display: none;}
.btn2:hover b{display: inline-block;}
.btn2:hover:hover{border: 2px solid #f2f2f2;background: #f2f2f2;}
.contactright{width: 320px;}
.contactright p{color: #666; font-size: 14px; line-height: 1.7em;}
.contactright p a{color: #2ea3f2;}

.case{padding: 80px 0;}
.case ul{display: flex;gap:60px;}
.case li{width: calc(33.333% - 120px/3); box-shadow:0 0 10px rgba(0, 0, 0, .1); }
.case span{display: block;}
.case img{width: 100%;position: relative;aspect-ratio: 320 / 200;}
.casetext{padding: 30px 20px;}
.casetext h2{color: #0066bf;font-weight: bold;font-size: 18px;margin-bottom: 8px;}
.casetext p{color: #666;font-size: 14px; line-height: 1.7em;}
.casetext a{display: inline-block; line-height: 1.7em;font-size: 14px;color: #2ea3f2;}

.Photo{padding-bottom: 80px;}
.PhotoTitel{text-align: center; padding: 80px 0 70px;}
.PhotoTitel h2{font-weight: bold;color: #0066bf;font-size: 26px;}
.photoNr{display: flex;justify-content: space-between;flex-wrap: wrap;gap:60px;}
.photobox{width: calc(50% - 60px/2);}
.phtext{padding-bottom: 35px;}
.phtext h2{font-weight: bold;color: #0066bf;font-size: 18px;margin-bottom: 10px;}
.phtext a{color: #0292f2;font-size: 14px;}
.phqh{background: #242424;}
.phqh .mySwiper2 img{width: 100%; object-fit: cover;position: relative;aspect-ratio: 510 / 800;}
.phqh .mySwiper img{width: 100%; object-fit: cover;aspect-ratio: 120 / 80;}
.phqh .mySwiper{padding: 5px;}
.phqh .mySwiper .swiper-button-next{width: 26px;height: 26px;font-weight: bold;color: #fff;border-radius: 50%; border: 2px solid #aaabaa; margin-top: -13px;background: rgba(0,0,0,.7);}
.phqh .mySwiper .swiper-button-prev{width: 26px;height: 26px;font-weight: bold;color: #fff;border-radius: 50%; border: 2px solid #aaabaa; margin-top: -13px;background: rgba(0,0,0,.7);}
.phqh .mySwiper .swiper-button-next:after,.phqh .mySwiper .swiper-button-prev:after{font-size: 12px;}
.phqh .swiper-button-next.swiper-button-disabled,.phqh .swiper-button-prev.swiper-button-disabled{opacity: 0;}
.phqh .mySwiper .swiper-slide {opacity: 0.4;cursor: pointer;}
.phqh .mySwiper .swiper-slide-thumb-active { opacity: 1;}

.phqh .mySwiper2 .swiper-button-next:after,.phqh .mySwiper2 .swiper-button-prev:after{font-size: 32px;}
.phqh .mySwiper2 .swiper-button-next{color: #fff;}
.phqh .mySwiper2 .swiper-button-prev{color: #fff;}

.contText{padding: 80px 0 25px;}
.contText h2{color: #0066bf;font-weight: bold;font-size: 30px;margin-bottom: 10px;}
.contText p{font-size: 14px;line-height: 1.7em; color: #666;}
.container{display: flex;gap:60px;flex-wrap: wrap; padding-bottom: 60px;}
.container a{width: calc(25% - 180px/4);display: block; }
.container b{position: relative;display: block;}
.container b:before{position: absolute;content: "";width: 100%;height: 100%; background: rgba(255,255,255,.8);left: 0;top: 0;z-index: 10; opacity: 0;transition: all .5s;}
.container b span{position: absolute;background: url(../imgaes/a6.png);width: 30px;height: 30px;background-size: 100%;left:50%; top:50%; transform:translate(-50%,-50%);z-index: 11;opacity: 0;}
.container a img{width: 100%; object-fit: cover;position: relative;aspect-ratio: 225 / 160;}
.container p{font-weight: bold;font-size: 18px;color: #0066bf; margin-top: 10px;}
.container a:hover b:before{opacity: 1;}
.container a:hover span{opacity: 1;}

.cont2Text{padding: 80px 0 25px;text-align: center;}
.cont2Text h2{color: #0066bf;font-weight: bold;font-size: 30px;margin-bottom: 10px;}
.cont2Text p{font-size: 14px;line-height: 1.7em; color: #666;}
.container1{display: flex;gap:5px;flex-wrap: wrap;justify-content: center;}
.container1 a{display: block; overflow: hidden;width: calc(25% - 15px/4);background: #000;}
.container1 b{position: relative;display: block;}
.container1 span{display: block; position: absolute;font-weight: bold;color: #fff;font-size: 18px; width: 100%; left: 0;top: 50%;transform: translateY(-50%);text-align: center;text-shadow: 2px 2px 5px rgba(0,0,0,0.2);opacity: 0;transition: all .5s;}
.container1 img{width: 100%; object-fit: cover;aspect-ratio: 250 / 250;transition: all .5s;}
.container1 b{display: block;overflow: hidden;}
.container1 a:hover img{transform: scale(1.1);opacity: .9;}
.container1 a:hover span{opacity: 1;}

.wzfy{text-align: right;border-top: 1px solid #e2e2e2; padding: 15px 0 120px;}
.wzfy li{font-size: 16px;display: inline-block; padding-left: 25px;}
.wzfy li a{color: #999;}
.wzfy li.cur a{color: #0066bf;}
.wzfy a:hover{color: #0066bf;}


.wzxqtext{overflow: hidden;}
.wzxqtext a{color: #0066bf;font-size: 14px;}
.wzxqtext img{width: 170px; margin: 0 20px 0 0;float: left;}
.h100{height: 100px;}
.dtbox img{width: 100%;}
.dtbox{padding-top: 30px;}
@media(max-width:1000px){
.headerabox{padding: 0 20px;height: 60px;}
.logo{width: 150px;}
.headerRight  ul li:nth-child(1){ display: none;}
.headerRight  ul li:nth-child(3){ display: none;}
.fgx{height: 60px;}

.nav{background: #000;width: 80%; position: fixed;z-index: 200;overflow: auto;top: 60px;left: -100%;height: calc(100% - 60px); padding: 30px 15px;}
.nav ul{display: block;}
.nav li h3 a{display: block;line-height: 50px;height: 50px;}
.nav li h3:before{display: none;}
.nav h3 b{position: absolute;width: 30px;height: 100%; right: 0;top: 0;}
.dhbj{position: fixed;z-index: 10;left: 0;top: 0;background: rgba(0,0,0,.6);width: 100%;height: 100%;display: none;}
.dhbtn{position: absolute;width: 30px; height: 30px;right:20px; top: 50%;background: url(../imgaes/d1.png) no-repeat center center;background-size: 20px 20px;transform: translateY(-50%);}
.dhbtn.on{background: url(../imgaes/d2.png) no-repeat center center;background-size: 20px 20px;}
.sub{position: static;width: 100%;}
.bannerText h2{font-size: 20px;}
.bannerText h2 b{font-size: 14px;}
.bannerText p{font-size: 16px;}
.cplb ul{padding: 40px 0;display: block;}
.cplb li{width: 100%;padding-bottom: 25px;}
.text p{font-size: 18px;}
.footerbox{display: block;text-align: center; padding: 15px 0;height: auto;}
.footerbox ul{justify-content: center; padding-top: 10px;}
.about{display: block;padding: 40px 0;}
.aboutRight{border: none;width: 100%;}
.aboutLeft{width: 100%; padding: 0 0 25px 0;}
.case{padding: 40px 0;}
.case ul{display: block;}
.case li{width: 100%; margin-bottom: 20px;}

.contact{display: block;padding: 40px 0;}
.contactleft{width: 100%; padding: 0 0 20px 0;}
.contactleft ul{display: block;}
.contactleft li{width: 100%; padding-bottom: 12px;}
.contactright{width: 100%;}
.cont2Text{padding: 40px 0 15px;}
.wzfy{padding-bottom: 40px;}
.container1 a{width: calc(50% - 5px/2);}

.PhotoTitel{padding: 40px 0 30px;}
.photoNr{display: block;}
.photobox{width: 100%;padding-bottom: 30px;}
.phtext{padding-bottom: 15px;}
.Photo{padding-bottom: 20px;}
.contText{padding: 40px 0 20px;}
.container{display: block;padding-bottom: 20px;}
.container a{width: 100%;margin-bottom: 30px;}
.Services{padding: 40px 0;display: block;}
.ServicesLeft{width: 100%; padding: 0 0 30px 0;}
.ServicesRight{width: 100%;}
}