body,input,h1,h2,h3,h4,h5,h6,b,c,e,i,g,p,div,dl,dt,dd,select,textarea,font,right,left{ margin:0; padding:0;color:#555; font-size:12px; font-family:"arial"; line-height:1;font-weight: normal;letter-spacing: 0.3px;} body,html{height:100%;position:relative;width: 100%;background-color: #ffffff;} img{display: block;} a{ color:#333; text-decoration:none; font-size: 16px;} ul, ol, li, dl, dd {margin: 0;padding: 0; list-style:none;} html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6,span,dd,dt,b,c,e,a,font,right,left{ -webkit-text-size-adjust:100%;} .fl{float: left;} .fr{float: right;} .clearfix:after{display: block;content: '';clear: both;} .bg_big{width: 100%;height: auto;background-color: #f8f8f8;font-family: arial;} img{pointer-events: none;} /**{-webkit-touch-callout: none;-webkit-user-select: none;-moz-user-select: none; -ms-user-select: none;user-select: none;}*/ /*IE*/ .web-ie2018{ font-family: microsoft yahei; position: fixed;width: 100%;height: 100%;top: 0;left: 0;z-index: 9999999999999;background: #666;zoom:1;} .web-ie2018 dl{ position: absolute;width: 700px;height: auto;top: 50%;margin-top: -200px;left: 50%;margin-left: -350px;background: #fff;} .web-ie2018 dl #img{ display: block;margin: 50px auto;} .web-ie2018 dl h3{ display: block;text-align: center;font-size: 28px;font-weight: normal;letter-spacing: 2px;margin: 0 auto 30px;} .web-ie2018 dl h4{ display: block;text-align: center;font-size: 18px;font-weight: normal;letter-spacing: 2px;margin: 50px auto 50px;} .web-ie2018 dl dd{ margin: 0 auto 50px; display: block;text-align: center; margin-bottom:50px;} .web-ie2018 dl dd a{ display: inline-block;margin: 0 20px;} .web-ie2018 dl dd a img{display: block;margin: 0 auto;text-align: center;width: 50%;} .web-ie2018 dl dd a span{display: block;font-size: 16px; color:#666;} /*<------------------------------------->*/ /* pc */ .pc-1200px{display: none;} @media only screen and (max-width:1260px) { .pc-1200px{ position: fixed;width: 100%;height: 100%;top: 0;left: 0;background: #333;z-index: 99999999999999999;display: block;} .pc-1200px p{ position: absolute;transform: translateY(-50%);-webkit-transform: translateY(-50%);width: 100%;top: 50%;left: 0;} .pc-1200px p img{ display: block;margin: 0 auto 2em;height: 50px;} .pc-1200px p strong{ display: block;color: #fff;text-align: center;font-size: 2em;letter-spacing: 1px;line-height: 1em;margin-bottom: 2em;} .pc-1200px p span{ display: block;text-align: center;color: #eee;letter-spacing: 1px;font-size: 16px;} } /* header */ .headerwrap{width: 100%;position: fixed;border-bottom: 1px solid rgba(255,255,255,0.4);top: 0;left: 0;z-index: 99;transition: all .3s;} .headerwrap .header{width: 90%;margin: auto;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;} .headerwrap .header .logo{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: center;} .headerwrap .header .logo img{display: block;width: auto;} .headerwrap .header .logo .img01{height: 80px;} .headerwrap .header .logo .img02{height: 42px;} .headerwrap .header .logo i{display: block;width: 1px;height: 38px;opacity: 0.5;background: #b0b0b0;margin: 0 20px;} .headerwrap .header .right{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: center;} .headerwrap .header .right .nav{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: center;margin-right:20px;} .headerwrap .header .right .nav li{padding: 0 30px;position: relative;} .headerwrap .header .right .nav li:last-child{margin-right: 0;} .headerwrap .header .right .nav li>a{font-size: 16px;color: #fff;height: 90px;display: block;line-height: 90px;position: relative;} .headerwrap .header .right .search{font-size: 16px;color: #FFFFFF;margin:0 40px;opacity:0;display:none;} .headerwrap .header .right .nav li>a::after{content: '';display: block;width: 0%;height: 2px;background-color: #FFFFFF;position: absolute;left: 0;bottom: 0;transition: all .3s;} .headerwrap .header .right .nav li:hover>a{color: #FFFFFF;} .headerwrap .header .right .nav li:hover>a::after,.headerwrap .header .right .nav li>a.active::after{width: 100%;} .headerwrap .header .right .nav li.active>a::after{width: 100%;} .div2_1 .headerwrap .header .right .nav li.active>a{color: #b30606;} .header .right .nav li .nav02{position: absolute;box-sizing: border-box;padding: 0;z-index: 5;width: 610px;left: 0;margin-left: 0px;text-align: center;top: 51.5px;display: none;justify-content: center;flex-flow: row;white-space: nowrap;transition: all .3s;top: 90px;} .header .right .nav li .nav02 a{display: inline-block;width: auto;font-size: 15px;color: #666;line-height: 40px;margin: 0;float: none;margin-right: 0;position: relative;text-align: left;padding-left: 20px;padding-right: 10px;} .header .right .nav li .nav02 a:last-child{margin-right: 0;} .header .right .nav li .nav02 a:hover{color: #b30606;background-color: #fff;} .header .right .nav li .nav02 a:before{content: '';display: inline-block;width: 3px;height: 14px;background-color: #b30606;position: absolute;top: 14px;left: 5px;opacity: 0;} .header .right .nav li .nav02 a:hover:before{opacity: 1} .header .right .nav li .nav02 a i{opacity: 0;transition: all .6s;} .header .right .nav li .nav02 a:hover i{opacity: 0;} .header .right .nav li .nav02{background-color: rgba(255,255,255,0.9);padding: 0;width: 180px;box-shadow: 0px 2px 2px rgba(34,34,34,0.3)} .header .right .nav li .nav02 a{display: block;display: flex;justify-content: space-between;align-items: center;} .header .right .nav li:hover .nav02{display: block;} .header .right .tl{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: center;background-color: #b30606;height: 45px;box-sizing: border-box;padding: 0 20px;color: #fff;font-size: 18px;} .header .right .tl i{font-size:22px;color: #fff;margin-right: 10px;} .div2_1 .headerwrap,.headerwrap:hover,.div3 .headerwrap{background-color: #FFFFFF;} .div2_1 .headerwrap .header .right .nav li>a,.div2_1 .headerwrap .header .right .search,.headerwrap:hover .header .right .nav li>a,.headerwrap:hover .header .right .search,.div3 .headerwrap .header .right .nav li>a,.div3 .headerwrap .header .right .search{color: #222;} .div2_1 .headerwrap .header .right .nav li>a::after,.headerwrap:hover .header .right .nav li>a::after,.div3 .headerwrap .header .right .nav li>a::after{background-color: #b30606;} .div2_1 .headerwrap .header .right .nav li:hover>a,.headerwrap:hover .header .right .nav li:hover>a,.div3 .headerwrap .header .right .nav li:hover>a{color: #b30606;} /* bannerwrap */ .bannerwrap{width: 100%;box-sizing: border-box;position: relative;z-index: 0;height: 100%;} .banner{width: 100%;height: calc(100% - 130px);position: relative;overflow: hidden;} .banner .swiper-container{height: 100%;} .bannerwrap .centerBig{position: relative;} .bannerwrap .centerBig img{display: block;width: auto;min-width: 100%;height: 100%;} .bannerwrap .centerBig .text{width: 90%;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);} .bannerwrap .centerBig .text p{font-size: 30px;color: #FFFFFF;line-height: 48px;text-shadow: 3px 2px 3px rgba(7,0,2,0.75);text-transform: uppercase;} .bannerwrap .centerBig .text h3{font-size: 60px;color: #FFFFFF;font-weight: bold;margin: 30px 0;text-shadow: 3px 2px 3px rgba(7,0,2,0.75);letter-spacing: 10px;} .bannerwrap .centerBig .text h4{font-size: 24px;color: #ffffff;text-shadow: 3px 2px 3px rgba(7,0,2,0.75)} .more{display: block;position: relative;width: 190px;height: 50px;line-height: 50px;font-size: 16px;color: #fff;background-color: #b30606;z-index: 0;text-align: center;text-transform: uppercase;} .more::after{content: '';display: block;width: 0%;height: 100%;background-color: #fff;z-index: -1;transition: all .3s;position: absolute;left: 0;top: 0;} .more:hover::after{width: 100%;} .more:hover{color: #b30606;} .bannerwrap .centerBig .text .more{margin-top: 70px;display: none;} .bannerwrap .swiper-pagination{box-sizing: border-box;padding-left: 5%;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: auto;bottom: 70px;} .bannerwrap .swiper-pagination .swiper-pagination-bullet{background-color: #FFFFFF;position: relative;margin-right: 20px;opacity: 1;} .bannerwrap .swiper-pagination .swiper-pagination-bullet:last-child{margin-right: 0;} .bannerwrap .swiper-pagination .swiper-pagination-bullet::after{content: '';display: block;width: 17px;height: 17px;position: absolute;top: 50%;left: 50%;border-radius: 50%;border:1px solid #FFFFFF;margin-top: -9px;margin-left: -9px;} .bannerwrap .swiper-pagination .swiper-pagination-bullet::after{opacity: 0;} .bannerwrap .swiper-pagination .swiper-pagination-bullet-active::after{opacity: 1;} .bannerwrap .page{width: 44px;height: 100%;position: absolute;top: 0;right: 5%;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-flex-flow: column;flex-flow: column;} .bannerwrap .page .swiper-button-next,.bannerwrap .page .swiper-button-prev{display: flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;border: 1px solid #FFFFFF;width: 42px;height: 42px;border-radius: 50%;font-size: 26px;color: #FFFFFF;position: relative;top: 0;left: 0;margin: 0;background-image: none;} .bannerwrap .page .swiper-button-next{margin-top: 10px;} .bannerlist{width: 100%;box-sizing: border-box;background-color: #000000;position: absolute;left: 0;bottom: 0;z-index: 2;} .bannerlist li{width: calc((100% - 4px)/5);float: left;display: flex;display: -webkit-flex;-webkit-align-items: center;align-items: center;-webkit-justify-content: center;justify-content: center;;box-sizing: border-box;height: 130px;margin-right: 1px;background-color: #272727;} .bannerlist li:last-child{margin-right: 0;} .bannerlist li img{display: block;width: auto;margin-right: 20px;transition: all .6s;} .bannerlist li .text span{display: inline-block;padding-bottom: 5px;border-bottom: 1px solid #868686;font-size: 18px;color: #fff;margin-bottom: 10px;} .bannerlist li .text span br{display: none;} .bannerlist li .text p{text-transform: uppercase;color: #fff;font-size: 14px;} .bannerlist li:hover img{transform: rotateY(180deg);} .bannerwrap .centerBig .sjbanner{display: none;} /* indexwrap */ .indexwrap{background-color: #1e1e1e;width: 100%;box-sizing: border-box;overflow: hidden;position: relative;} /* index01wrap */ .index01wrap{width: 90%;margin: 100px auto;box-sizing: border-box;} .i-tl{width: 100%;text-align: center;position: relative;margin-bottom: 50px;} .i-tl h3{font-size: 60px;color: #FFFFFF;opacity: 0.1;letter-spacing: 2px;text-transform: uppercase;font-weight: bold;font-family: arial;} .i-tl p{position: absolute;top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);font-size: 26px;letter-spacing: 3px;color: #FFFFFF;width: 100%;left: 0;font-weight: bold;} .index01{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-wrap:wrap;flex-wrap: wrap;} .index01 a{display: block;width: calc((100% - 8px)/3);margin-right: 4px;margin-bottom: 4px;position: relative;box-sizing: border-box;} .index01 a:nth-of-type(3n){margin-right: 0;} .index01 a .imgbox{width: 100%;box-sizing: border-box;position: relative;overflow: hidden;} .index01 a .imgbox img{display: block;width: 100%;transition: all .6s;} .index01 a:hover .imgbox img{transform: scale(1.1);} .index01 a .text{width: 100%;box-sizing: border-box;background-color: #2b2b2b;padding: 40px;position: relative;display: flex;display: -webkit-flex;-webkit-align-items: center;align-items: center;transition: all .3s;} .index01 a .text h3{font-size: 20px;color: #FFFFFF;font-weight: bold;box-sizing: border-box;} .index01 a .text i{display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;position: absolute;right: 40px;} .index01 a .text i::before{content: '';display: block;width: 12px;height: 2px;background-color: #fff;transition: all .3s;} .index01 a .text i::after{content: '';display: block;width: 6px;height: 6px;border-top: 2px solid #FFFFFF;border-right: 2px solid #fff;transform: rotate(45deg);-webkit-transform: rotate(45deg);margin-left: -7px;} .index01 a:hover .text i::before{width: 30px;} .index01 a:hover .text{background-color: #b30606;} /* index02wrap */ .index02wrap{width: 100%;box-sizing: border-box;padding: 100px 5%;background-color: #000000;margin: 100px 0;} .index02{width: 100%;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;} .index02 a{width: calc((100% - 120px)/4);margin-right: 40px;position: relative;overflow: hidden;} .index02 a:nth-of-type(4n){margin-right: 0;} .index02 a>img{display: block;width: 100%;transition: all .6s;} .index02 a:hover>img{transform: scale(1.1);} .index02 a .text{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;background-color: rgba(21,21,21,0.9);position: absolute;top: 0;left: 0;height: 100%;transition: all .3s;} .index02 a .text .cont{text-align: center;width: 80%;transform: translateY(36px);-webkit-transform: translateY(36px);transition: all .3s;} .index02 a .text .cont img{display: block;width: auto;height: 50px;margin: auto;margin-bottom: 20px;} .index02 a .text .cont h3{font-size: 22px;color: #FFFFFF;margin-bottom: 10px;} .index02 a .text .cont h4{font-size: 16px;color: #fff;line-height: 30px;margin-bottom: 30px;} .index02 a .text .cont font{display: flex;display: -webkit-flex;background-color: #FFFFFF;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;border-radius: 50%;width: 42px;height: 42px;margin: auto;opacity: 0;transition: all .3s;} .index02 a .text .cont font::before{content: '';display: block;width: 12px;height: 2px;background-color: #B30606;transition: all .3s;} .index02 a .text .cont font::after{content: '';display: block;width: 6px;height: 6px;border-top: 2px solid #B30606;border-right: 2px solid#B30606;transform: rotate(45deg);-webkit-transform: rotate(45deg);margin-left: -7px;} .index02 a:hover .text .cont{transform: none;-webkit-transform: none;} .index02 a:hover .text .cont font{opacity: 1;} .index02 a:hover .text{background-color: rgba(179,6,6,0.9);} /* index03wrap */ .index03wrap{width: 90%;margin: 100px auto;box-sizing: border-box;} .index03wrap .top{display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;} .index03wrap .top .i-tl{text-align: left;} .index03wrap .top .more{margin-top: 0;} .index03{width: 100%;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-wrap: wrap;flex-wrap: wrap;} .index03 a{display: block;width: calc((100% - 12px)/4);margin-right: 4px;margin-bottom: 4px;position: relative;} .index03 a:nth-of-type(4n){margin-right: 0;} .index03 a .imgbox{width: 100%;overflow: hidden;} .index03 a .imgbox img{display: block;width: 100%;transition: all .6s;} .index03 a:hover .imgbox img{transform: scale(1.1);} .index03 a .text{background-color: #2b2b2b;box-sizing: border-box;padding: 40px;width: 100%;} .index03 a .text h3{font-size: 20px;color: #FFFFFF;font-weight: bold;margin-bottom: 30px;transition: all .3s;} .index03 a .text .more{border: 1px solid rgba(255,255,255,0.5);width: 90px;height: 25px;line-height: 25px;background-color: transparent;text-transform: uppercase;font-size: 14px;} .index03 a:hover .text h3{color: #f00; } /* index04wrap */ .index04wrap{width: 100%;box-sizing: border-box;position: relative;margin: 100px auto;padding: 100px 0;} .index04wrap::after{content: '';display: block;width: 70%;height: 100%;background-color: #000;position: absolute;right: 0;top: 0;} .index04{width: 100%;box-sizing: border-box;position: relative;z-index: 1;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;} .index04 .video{width: 60%;box-sizing: border-box;overflow: hidden;} .index04 .video video{display: block;width: 100%;object-fit: fill;} .index04 .text{width: 40%;box-sizing: border-box;padding: 0 5% 0 130px;} .index04 .text .i-tl{text-align: left;margin-bottom: 20px;} .index04 .text .h3{font-size: 20px;color: #FFFFFF;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: center;margin-bottom: 50px;} .index04 .text .h3::before{content: '';display: block;width: 80px;height: 1px;background-color: #FFFFFF;margin-right: 10px;} .index04 .text h4{font-size: 16px;line-height: 26px;text-align: justify;color: #FFFFFF;} .index04 .text .more{margin-top: 60px;} .jsmodern-video-panel{display: none!important;} /* index05wrap */ .index05wrap{width: 90%;margin: 100px auto;box-sizing: border-box;} .index05wrap .top{width: 100%;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;} .index05wrap .top .i-tl{text-align: left;} .index05wrap .top .i05-tab{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;} .index05wrap .top .i05-tab a{font-size: 20px;color: #FFFFFF;border-bottom: 2px solid rgba(255,255,255,0.3);padding-bottom: 8px;white-space: nowrap;margin-right: 30px;transition: all .3s;} .index05wrap .top .i05-tab a:last-child{margin-right: 0;} .index05wrap .top .i05-tab a:hover,.index05wrap .top .i05-tab a.active{border-color: #b30606; color: #f00;} .index05wrap .tabmin{width: 100%;position: relative;box-sizing: border-box;} .index05wrap .tabmin li{width: 100%;display: none;} .index05wrap .tabmin li:first-child{display: block;} .index05wrap .index05{width: 100%;margin: auto;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;position: relative;} .index05wrap .index05 .right{width: 60%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .index05wrap .index05 .right a{display: block;width: 48%;box-sizing: border-box;} .index05wrap .index05 .right a .imgbox{width: 100%;overflow: hidden;} .index05wrap .index05 .right a .imgbox img{display: block;width: 100%;transition: all .6s;} .index05wrap .index05 .right a:hover .imgbox img{transform: scale(1.1);} .index05wrap .index05 .right a .text{width: 100%;box-sizing: border-box;background-color: #353535;padding: 40px;} .index05wrap .index05 .right a .text span{font-size: 16px;color: #fff;margin-bottom: 20px;display: block;} .index05wrap .index05 .right a .text h3{font-size: 18px;color: #fff;line-height: 24px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-align: justify;font-weight: bold;margin-bottom: 30px;min-height: 50px;} .index05wrap .index05 .right a:hover .text h3{ color: #f00; } .index05wrap .index05 .right a:hover .text font::after{width: 100%;} .more03{font-size: 16px;color: #fff;padding-bottom: 3px;position: relative;} .more03::after{content: '';display: block;width: 0%;height: 1px;background-color: #fff;position: absolute;left: 0;bottom: 0;transition: all .3s;} .more03 i{font-size: inherit;color: inherit;margin-left: 20px;} .index05wrap .index05 .left{display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-flex-flow: column;flex-flow: column;width: 40%;box-sizing: border-box;padding-left: 3%;height: 100%;position: absolute;right: 0;top: 0;} .index05wrap .index05 .left a{display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;background-color: #353535;width: 100%;height: 28%;} .index05wrap .index05 .left a .data{display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;background-color: #626262;width: 30%;box-sizing: border-box;height: 100%;} .index05wrap .index05 .left a .data p{font-size: 58px;color: #FFFFFF;text-align: center;} .index05wrap .index05 .left a .data p span{font-size: 16px;color: #FFFFFF;display: block;} .index05wrap .index05 .left a .info{width: 70%;box-sizing: border-box;padding: 0 30px;} .index05wrap .index05 .left a .info h3{font-size: 18px;color: #fff;line-height: 24px;font-weight: bold;margin-bottom: 20px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;} .index05wrap .index05 .left a:hover .info h3{ color: #f00;} .index05wrap .index05 .left a:hover .info font::after{width: 100%;} /* index06 */ .index06wrap{width: 100%;box-sizing: border-box;padding: 100px 0;background-color: #000000;position: relative;} .index06wrap .bg{position: absolute;top: 50px;left: 50%;transform: translateX(-50%);-webkit-transform: translateX(-50%);display: block;width: auto;z-index: 0;} .index06{position: relative;z-index: 1;width: 90%;margin: auto;} .index06 .i-tl h3{color: #363636;opacity: 1;} .index06 .info{width: 40%;margin: auto;text-align: center;font-size: 16px;color: #FFFFFF;line-height: 24px;} .index06 .mumping_mun{width: 1400px;margin: auto;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;margin-top: 80px;} .index06 .mumping_mun li{position: relative;margin-right: 80px;} .index06 .mumping_mun li h3{background-color: #666;box-sizing: border-box;padding: 50px 20px 20px;font-size: 16px;color: #FFFFFF;width: 180px;} /* .mumping_mun li:last-child{margin-right: 0;} */ .index06 .mumping_mun li .mun_top{position: relative;margin-top: -20%;float: right;margin-right: -80px;white-space: nowrap;} .index06 .mumping_mun li .mun_top h2{font-size: 60px;color: #FFFFFF;font-weight: bold;font-style: italic;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;} .index06 .mumping_mun li .mun_top h2::after{content: '+';font-size: 60px;color: #FFFFFF;font-weight: lighter;position: relative;margin-top: -30px;margin-left: 20px;} .index06 .more{margin: auto;margin-top: 50px;} .index06 .list{width: 1400px;margin: 50px auto 90px;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .index06 .list .left{width: 200px;} .index06 .list .left h3{font-size: 28px;color: #ffffff;font-weight: bold;margin-bottom: 6px;} .index06 .list .left p{font-size: 20px;color: #dfdfdf;text-transform: uppercase;} .index06 .list .right{width: calc(100% - 200px);box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-wrap: wrap;flex-wrap: wrap;} .index06 .list .right li{font-size: 16px;color: #ffffff;font-weight: bold;width: 8%;margin-right: 10.4%;border-bottom: 1px solid rgba(255,255,255,0.2);margin-bottom: 26px;padding-bottom: 6px;font-size: 16px;color: #FFFFFF;font-weight: bold; letter-spacing: 1px;} .index06 .list .right li:nth-of-type(6n){margin-right: 0;} /* index07wrap */ .index07wrap{width: 100%;box-sizing: border-box;padding: 100px 0;background: url(../img/bj_lx.jpg)no-repeat fixed;background-size: cover;} .index07{width: 90%;margin: auto;} /* .i-form{width: 810px;margin: auto;} .i-form label{display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;margin-bottom: 2%;} .i-form label input{display: block;width: 49%;background-color: rgba(255,255,255,0.2);height: 54px;border: none;box-sizing: border-box;padding: 20px;font-size: 16px;color: #FFFFFF;resize: none;} .i-form input::-webkit-input-placeholder,.i-form textarea::-webkit-input-placeholder{color: #FFFFFF;} .i-form input::-ms-input-placeholder,.i-form textarea::-ms-input-placeholder{color: #FFFFFF;} .i-form textarea{display: block;width: 100%;height: 90px;box-sizing: border-box;padding: 20px;color: #FFFFFF;font-size: 16px;outline: none;resize: none;background-color: rgba(255,255,255,0.2);border: none;} .i-form .more{border: none;margin: auto;margin-top: 50px;}*/ .index07 .wpcf7-form{width: 810px;margin: auto;} .index07 .wpcf7-form .label{display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;margin-bottom: 2%;} .index07 .wpcf7-form .label input{display: block;width: 100%;background-color: rgba(255,255,255,0.2);height: 54px;border: none;box-sizing: border-box;padding: 0 20px;font-size: 16px;color: #FFFFFF;resize: none;} .index07 .wpcf7-form input::-webkit-input-placeholder,.index07 .wpcf7-form textarea::-webkit-input-placeholder{color: #FFFFFF;} .index07 .wpcf7-form input::-ms-input-placeholder,.index07 .wpcf7-form textarea::-ms-input-placeholder{color: #FFFFFF;} .index07 .wpcf7-form textarea{display: block;width: 100%;height: 90px;box-sizing: border-box;padding: 20px;color: #FFFFFF;font-size: 16px;outline: none;resize: none;background-color: rgba(255,255,255,0.2);border: none;} .index07 .wpcf7-form .more{border: none;margin: auto;margin-top: 50px;} .screen-reader-response,.index07 .wpcf7-form .label br{display: none;} .wpcf7-response-output,.wpcf7-validation-errors{ display: block;color: #fff;text-align: center;font-size: 12px;letter-spacing: 0;margin: 10px 0 0 0;} .index07 .wpcf7-form .label span,.index07 .wpcf7-form p span{display: block;overflow: hidden;position: relative;} .index07 .wpcf7-form .label span span,.index07 .wpcf7-form p span span{ position: absolute;color: #fff;top: 0;right: 10px;line-height: 54px;letter-spacing: 0;font-size: 12px;} /* footer */ .footerwrap{width: 100%;box-sizing: border-box;padding: 100px 0;background-color: #000000;} .footer{width: 90%;box-sizing: border-box;margin: auto;} .footer .top{width: 100%;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;border-bottom: 1px solid rgba(255,255,255,0.2);padding-bottom: 30px;-webkit-align-items: center;align-items: center;} .footer .top h3{font-size: 18px;color: #FFFFFF;font-weight: bold;} .footer .top a{font-size: 16px;color: #FFFFFF;opacity: 0.6;margin-left: 30px;} .footer .top a:hover{opacity: 1;} .footer .list{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;margin-top: 60px;margin-bottom: 120px;} .footer .list .f-logo img{display: block;width: auto;height: 130px;} .footer .list .f-logo .img03{height: 38px;margin: auto;margin-top: 10px;} .footer .list .f-logo p{text-align: center;font-size: 14px;color: #FFFFFF;opacity: 0.6;line-height: 26px;margin-top: 20px;} .footer .list li h3{font-size: 18px;color: #FFFFFF;font-weight: bold;margin-bottom: 30px;} .footer .list li .min a{font-size: 16px;color: #FFFFFF;opacity: 0.6;display: block;margin-bottom: 20px;} .footer .list li .min a:last-child{margin-bottom: 0;} .footer .list li .min a:hover{opacity: 1;text-decoration: underline;} .footer .list li .ewm{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;} .footer .list li .ewm .item{margin-right: 20px;text-align: center;} .footer .list li .ewm .item p{font-size: 16px;color: #FFFFFF;opacity: 0.6;margin-top: 20px;} .footer .bot{display: flex;display: -webkit-flex;width: 100%;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;} .footer .bot h3{font-size: 14px;color: #FFFFFF;} .footer .bot h3 a{margin-left: 10px;} .footer .bot a{font-size: 14px;color: #FFFFFF;} /* 庭院门 */ /* innerbanner */ .innerbanner{width: 100%;box-sizing: border-box;position: relative;height: 100%;overflow: hidden;} .innerbanner img{display: block;width: auto;height: 100%;min-width: 100%;} .innerbanner img.sjimg{display: none;} .innerbanner .text{width: 100%;height: auto;position: absolute;top: 50%;left: 0;transform: translateY(-50%);-webkit-transform: translateY(-50%);text-align: center;} .innerbanner .text h3{font-size: 60px;color: #FFFFFF;font-weight: bold;letter-spacing: 6px;text-shadow: 3px 4px 5px rgba(7,0,2,0.75);margin-bottom: 20px;} .innerbanner .text p{display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;font-size: 20px;letter-spacing: 2px;text-shadow: 3px 4px 5px rgba(7,0,2,0.75);color: #FFFFFF;font-weight: bold;} .innerbanner .text p i{display: block;width: 2px;height: 20px;background-color: #FFFFFF;margin: 0 10px;} .kalo-hero__down{position: absolute;left: 50%;bottom: 30px;z-index: 2;display: flex;display: -webkit-flex;-webkit-align-items: center;align-items: center;cursor: pointer;transform: translateX(-50%);-webkit-transform: translateX(-50%);-webkit-flex-flow: column;flex-flow: column;} .kalo-hero__icon{display: flex;display: -webkit-flex;-webkit-align-items: center;align-items: center;-webkit-flex-flow: column;flex-flow: column;} .kalo-hero__icon .icon{width: 6px;height: 6px;border-left: 1px solid #fff;border-bottom: 1px solid #fff;display: block;-webkit-animation:scroll-down 1.25s ease-in-out infinite;animation:scroll-down 1.25s ease-in-out infinite;position:relative;} .kalo-hero__label{font-size:16px;line-height:20px;text-transform:lowercase;color: #FFFFFF;margin-top: 20px;} .kalo-hero__return{-webkit-transition:opacity .3s ease-in;-o-transition:opacity .3s ease-in;transition:opacity .3s ease-in;-webkit-transition-delay:1.8s;-o-transition-delay:1.8s;transition-delay:1.8s;margin-top:4vh;line-height:1.2} .page-template-sub-services .kalo-hero__return{margin-top:0} .centerBig img{-webkit-animation-name:centerBig;animation-name:centerBig;} .kalo-hero__down02{bottom: 50px;} @keyframes scroll-down { 0% { -webkit-transform: translateY(-100%) rotate(-45deg); transform: translateY(-100%) rotate(-45deg); opacity: 0 } 50% { opacity: 1 } to { -webkit-transform: translateY(100%) rotate(-45deg); transform: translateY(100%) rotate(-45deg); opacity: 0 } } .absolite{width: 100%;height: 90px;} /* innerwrap */ .innerwrap{width: 100%;position: relative;overflow: hidden;box-sizing: border-box;} .pagenewsbanner{ height: auto;} .pagenewsbanner img{ height: auto;} /* pdoor01wrap */ .pdoor01wrap{width: 100%;box-sizing: border-box;position: relative;background-color: #0d0d0d;padding: 100px 0;} .pdoor01wrap::after{content: '';background-color: #1e1e1e;width: 30%;height: 100%;position: absolute;top: 0;left: 0;} .doortl{display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;width: 100%;font-size: 40px;color: #ffffff;letter-spacing: 4px;font-weight: bold;margin-bottom: 60px;position: relative;z-index: 1;} .doortl::before,.doortl::after{content: '';display: block;width: 110px;height: 1px;background-color: #FFFFFF;} .doortl::before{margin-right: 20px;} .doortl::after{margin-left: 20px;} .pdoor01{position: relative;width: 90%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;margin: auto;z-index: 1;} .pdoor01 .imgbox{width: 60%;box-sizing: border-box;position: relative;overflow: hidden;} .pdoor01 .imgbox img{display: block;width: 100%;transition: all .6s;} .pdoor01 .imgbox:hover img{transform: scale(1.1);} .pdoor01 .text{width: 40%;box-sizing: border-box;padding-left: 110px;} .pdoor01 .text h3{font-size: 26PX;color: #ffffff;letter-spacing: 3px;margin-bottom: 30px;font-weight: bold;} .pdoor01 .text p{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: center;font-size: 20px;color: #ffffff;letter-spacing: 2px;margin-bottom: 40px;} .pdoor01 .text p::before{content: '';display: block;width: 66px;background-color: #FFFFFF;height: 1px;opacity: 0.6;margin-right: 20px;} .pdoor01 .text h4{font-size: 16px;color: #fff;line-height: 28px;text-align: justify;margin-bottom: 50px;} /* pdoor02 */ .pdoor02wrap{width: 100%;box-sizing: border-box;background-color: #1e1e1e;padding: 100px 0;} .doortl02{font-size: 26px;color: #ffffff;letter-spacing: 3px;margin-bottom: 50px;text-align: center;font-weight: bold;} .pdoor02{width: 90%;box-sizing: border-box;margin: auto;} .pdoor02 .cont{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-wrap: wrap;flex-wrap: wrap;margin-bottom: 50px;} .pdoor02 .cont a{display: block;width: calc((100% - 15px)/4);box-sizing: border-box;margin-right: 5px;background-color: #2b2b2b;} .pdoor02 .cont a:nth-of-type(4n){margin-right: 0;} .pdoor02 .cont a .imgbox{width: 100%;box-sizing: border-box;position: relative;overflow: hidden;} .pdoor02 .cont a .imgbox img{display: block;width: 100%;transition: all .6s;} .pdoor02 .cont a:hover .imgbox img{transform: scale(1.1);} .pdoor02 .cont a .text{width: 100%;box-sizing: border-box;padding: 40PX 50PX;} .pdoor02 .cont a .text h3{font-size: 20px;color: #ffffff;letter-spacing: 2px;margin-bottom: 30px;font-weight: bold;} .pdoor02 .cont a .text .more{border: 1px solid rgba(255,255,255,0.5);color: #FFFFFF;font-size: 14px;width: 90px;height: 25px;line-height: 25px;background-color: transparent;text-transform: uppercase;} .pdoor02 .cont a .text .more::after{background-color: #b30606;} .pdoor02 .cont a .text .more:hover{border-color: #b30606;} .pdoor02 .botmore{margin: auto;} .pdoor02 .cont a:hover .text h3{color: #b30606;} /* pdoor03wrap */ .pdoor03wrap{width: 100%;box-sizing: border-box;position: relative;background: url(../img/dm_bj_1.jpg)no-repeat fixed;background-size: cover;padding: 100px 0;} .pdoor03{width: 90%;margin: auto;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: flex-start;align-items: flex-start;} .pdoor03 .left{width: 35%;box-sizing: border-box;} .pdoor03 .left h3{font-size: 30px;color: #fff;font-weight: bold;letter-spacing: 3px;margin-bottom: 20px;} .pdoor03 .left h4{font-size: 22px;color: #fff;font-weight: bold;margin-bottom: 20px;} .pdoor03 .left p{font-size: 22px;color: #ffffff;} .pdoor03 .right{width: 60%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .pdoor03 .right a{width: 48%;box-sizing: border-box;background-color: rgba(255,255,255,0.2);border: 1px solid #999;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;padding: 30px 0;transition: all .3s;} .pdoor03 .right a:hover{background-color: rgba(179,6,6,0.5);border-color: rgba(179,6,6,0.5);} .pdoor03 .right a .cont{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;} .pdoor03 .right a .cont img{display: block;width: auto;margin-right: 10px;height: 46px;} .pdoor03 .right a .cont .text h3{font-size: 26px;color: #FFFFFF;font-weight: bold;margin-bottom: 10px;} .pdoor03 .right a .cont .text p{font-size: 16px;color: #CBCBCB;} /* pdoor04 */ .pdoor04wrap{width: 100%;box-sizing: border-box;background: url(../img/dm_bj_2.jpg)no-repeat fixed;background-size: cover;padding: 100px 0;} .pdoor04{width: 90%;margin: auto;box-sizing: border-box;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .pdoor04 .left{width: 20%;box-sizing: border-box;} .pdoor04 .left h3{font-size: 30px;color: #FFFFFF;font-weight: bold;line-height: 60px;margin-bottom: 50px;} .pdoor04 .left .more{border:1px solid #FFFFFF;background-color: transparent;margin-bottom: 30px;} .pdoor04 .left .more::after{background-color: #b30606;} .pdoor04 .left .more:last-child{margin-bottom: 0;} .pdoor04 .left .more:hover{border-color: #b30606;color: #fff;} .pdoor04 .right{width: 70%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .pdoor04 .right li{width: 46%;box-sizing: border-box;padding: 80px;background-color: rgba(0,0,0,0.8);display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: flex-start;align-items: flex-start;position: relative;} .pdoor04 .right li:nth-of-type(2){background-color:rgba(43,43,43,0.9);} .pdoor04 .right li .l-tl{font-size: 20px;color: #FFFFFF;font-weight: bold;writing-mode: tb;border-left: 2px solid #b30606;box-sizing: border-box;padding-left: 10px;letter-spacing: 2px;white-space: nowrap;} .pdoor04 .right li .info{width: calc(100% - 80px);} .pdoor04 .right li .info .item{width: 100%;box-sizing: border-box;margin-bottom: 30px;} .pdoor04 .right li .info .item:last-child{margin-bottom: 0;} .pdoor04 .right li .info .item p{font-size: 16px;color: #FFFFFF;writing-mode: tb;font-weight: bold;} .pdoor04 .right li .info .item h4{font-size: 16px;color: #FFFFFF;line-height: 28px;box-sizing: border-box;padding-left: 30px;margin-top: 20px;min-height: 56px;position: relative;} .pdoor04 .right li .info .item h4::before{content: '';display: block;width: 1px;height: 100%;position: absolute;left: 8px;top: 0;background-color: #FFFFFF;opacity: 0.4;} .pdoor04 .right li .fontbg{font-size: 71px;color: #FFFFFF;font-weight: bold;text-transform: uppercase;opacity: 0.06;position: absolute;left: 0;writing-mode: tb;bottom: 0;} /* .pdoor04 .right li:nth-of-type(2) .fontbg{color: #b30606;} */ /* pdoor05 */ .pdoor05wrap{width: 100%;box-sizing: border-box;background-color: #000000;padding: 100px 0 0;} .pdoor05{width: 90%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-wrap: wrap;flex-wrap: wrap;margin: auto;margin-top: 80px;} .pdoor05 a{display: block;width: 23.5%;box-sizing: border-box;margin-right: 2%;margin-bottom: 80px;background-color: #141414;} .pdoor05 a:nth-of-type(4n){margin-right: 0;} .pdoor05 a .imgbox{width: 100%;box-sizing: border-box;position: relative;} .pdoor05 a .imgbox h3{display: block;width: 100%;position: relative;overflow: hidden;position: relative;z-index: 0;} .pdoor05 a .imgbox h3 img{display: block;width: 100%;transition: all .6s;} .pdoor05 a:hover .imgbox h3 img{transform: scale(1.1);} .pdoor05 a .imgbox font{font-size: 77px;color: #FFFFFF;opacity: 0.3;font-weight: bold;position: absolute;left: 30px;top: -38px;z-index: 1;} .pdoor05 a .text{width: 100%;box-sizing: border-box;padding: 50px;} .pdoor05 a .text p{font-size: 16px;letter-spacing: 2px;color: #FFFFFF;padding-bottom: 10px;border-bottom: 1px solid rgba(255,255,255,0.4);text-transform: uppercase;margin-bottom: 10px;position: relative; letter-spacing: 0.2px;} .pdoor05 a .text p::after{content: '';display: block;width: 0%;height: 1px;background-color: #b30606;position: absolute;left: 0;transition: all .3s;bottom: -1px;} .pdoor05 a:hover .text p::after{width: 100%;} .pdoor05 a .text h3{font-size: 24px;color: #FFFFFF;font-weight: bold;letter-spacing: 2px;} /* 产品中心 */ .innerbanner02 .text .fontbg{font-size: 166px;color: #FFFFFF;opacity: 0.2;font-weight: bold;width: 100%;text-align: center;position: absolute;left: 0;top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);text-transform: uppercase;} .innerbanner02 .text h3{margin-bottom: 0;} .proall01wrap{width: 100%;box-sizing: border-box;position: relative;display: flex ;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;background-color: #1e1e1e;} .proall01wrap .left{width: 20%;box-sizing: border-box;background-color: #2a2a2a;padding-top: 100px;} .proall01wrap .left .tl{width: 100%;box-sizing: border-box;padding-left: 25%;font-size: 26px;color: #FFFFFF;font-weight: bold;margin-bottom: 40px;} .proall01wrap .left .info{width: 100%;box-sizing: border-box;} .proall01wrap .left .info a{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: center;font-size: 16px;color: #FFFFFF;padding-left: 25%;height: 60px;transition: all .3s;box-sizing: border-box;border-left: 2px solid transparent;} .proall01wrap .left .info a.active,.proall01wrap .left .info a:hover{border-color: #b30606;background-color: #000;} .proall01{padding: 166px 5% 0 5%;width: 80%;box-sizing: border-box;position: relative;margin-bottom: 100px;} .proall01 .cont{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-wrap: wrap;flex-wrap: wrap;margin-bottom: 60px;} .proall01 .cont a{display: block;width: 32%;box-sizing: border-box;margin-right: 2%;margin-bottom: 2%;} .proall01 .cont a:nth-of-type(3n){margin-right: 0;} .proall01 .cont a .imgbox{width: 100%;box-sizing: border-box;overflow: hidden;} .proall01 .cont a .imgbox img{display: block;width: 100%;transition: all .6s;pointer-events: all;} .proall01 .cont a:hover .imgbox img{transform: scale(1.1);} .proall01 .cont a .text{width: 100%;box-sizing: border-box;text-align: center;font-size: 24px;color: #fff;background-color: #2A2A2A;line-height: 70px;transition: all .3s;} .proall01 .cont a:hover .text{background-color: #b30606;} /* .fy{width: 100%;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;} .fy a{display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;font-size: 16px;color: #FFFFFF;transition: all .3s;margin-right: 10px;width: auto;min-width: 42px;height: 42px;box-sizing: border-box;padding: 0 12px;} .fy a.active,.fy a:hover{background-color: #b30606;} .fy a:last-child{margin-right: 0;} .fy a:hover:first-child,.fy a:hover:last-child{background-color: transparent;color: #b30606;} .fy a i{color: inherit;font-size: inherit;} */ /* proall02wrap */ .proall02wrap{width: 100%;box-sizing: border-box;position: relative;padding: 100px 5% 80px;box-sizing: border-box;background-color: #000000;} .proall02wrap .imgbox{width: 50%;box-sizing: border-box;position: absolute;left: 0;top: 0;overflow: hidden;z-index: 0; height: 100%;} .proall02wrap .imgbox img{display: -wap-marquee;width: auto;height: 100%;min-width: 100%;transition: all .6s;} .proall02wrap .imgbox:hover img{transform: scale(1.1);} .proall02{width: 100%;box-sizing: border-box;position: relative;z-index: 1;} .proall02 .tl{font-size: 26px;color: #FFFFFF;text-align: center;margin-bottom: 50px;font-weight: bold;} .proall02 .cont{width: 100%;box-sizing: border-box;padding-left: 40%;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-wrap: wrap;flex-wrap: wrap;} .proall02 .cont li{width: 49%;margin-right: 2%;box-sizing: border-box;padding: 50px;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;background-color: #343434;margin-bottom: 2%;transition: all .3s;} .proall02 .cont li:nth-of-type(2n){margin-right: 0;} .proall02 .cont li font{display: block;} .proall02 .cont li font img{display: block;width: 96px;height: auto;} .proall02 .cont li .text{width: calc(100% - 120px);box-sizing: border-box;} .proall02 .cont li .text h3{font-size: 22px;color: #ffffff;font-weight: bold;margin-bottom: 20px;} .proall02 .cont li .text p{font-size: 18px;color: #FFFFFF;line-height: 24px;} .proall02 .cont li:hover{background-color: #b30606;} /* 围栏 */ .pfence01wrap{width: 100%;box-sizing: border-box;padding: 100px 5%;background-color: #000;} .pfence01{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .pfence01 .left{width: 20%;box-sizing: border-box;} .pfence01 .left h3{font-size: 45px;color: #FFFFFF;opacity: 0.3;line-height: 60px;text-transform: uppercase;} .pfence01 .left h4{font-size: 26px;color: #ffffff;margin: 30px 0;} .pfence01 .left p{font-size: 16px;line-height: 26px;color: #FFFFFF;text-align: justify;margin-bottom: 40px;} .pfence01 .right{width: 80%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .pfence01 .right a{display: block;width: 32%;} .pfence01 .right a .imgbox{width: 100%;overflow: hidden;} .pfence01 .right a .imgbox img{display: block;width: 100%;transition: all .6s;} .pfence01 .right a .imgbox img.sjimg{display: none;} .pfence01 .right a:hover .imgbox img{transform: scale(1.1);} .pfence01 .right a .text{width: 100%;box-sizing: border-box;padding: 0 20px;position: relative;margin-top: -40px;} .pfence01 .right a .text h3{font-size: 80px;color: #FFFFFF;} .pfence01 .right a .text strong{display: block;width: 40px;height: 2px;background-color: #B30606;margin: 20px 0;} .pfence01 .right a .text p{font-size: 18px;color: #ffffff;} /* pfence02wrap */ .pfence02wrap{width: 100%;box-sizing: border-box;padding: 100px 5%;background: url(../img/wl_bj_01.jpg)no-repeat fixed;background-size: cover;} .pfence02{width: 100%;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .pfence02 li{width: 16.8%;box-sizing: border-box;border: 1px solid #fff;background-color: rgba(255,255,255,0.4);padding: 50px;transition: all .6s;} .pfence02 li img{display: block;width: auto;} .pfence02 li h3{font-size: 20px;color: #FFFFFF;margin-top: 80px;margin-bottom: 20px;} .pfence02 li h3 font{font-size: 52px;color: #FFFFFF;font-weight: bold;margin-right: 10px;} .pfence02 li p{font-size: 14px;color: #FFFFFF;text-transform: uppercase;margin-bottom: 10px;} .pfence02 li h4{font-size: 18px;color: #FFFFFF;} .pfence02 li:hover{background-color: #b30606;border-color: #b30606;} .pfence02wrap .more{margin: auto;margin-top: 60px;} /* pfence03wrap */ .pfence03wrap{width: 100%;box-sizing: border-box;background-color: #1e1e1e;padding: 140px 0 100px;position: relative;} .pfence03wrap::before{content: '';display: block;width: 100%;height: 50%;position: absolute;top: 0;left: 0;background: url(../img/wl_bj_02.jpg)no-repeat fixed;background-size: cover;z-index: 0;} .pfence03{width: 90%;margin: auto;position: relative;z-index: 1;} .pfence03 .imgbox{width: 100%;overflow: hidden;display: block;} .pfence03 .imgbox img{display: block;width: 100%;transition: all .6s;} .pfence03 .imgbox img:hover{transform: scale(1.1);} .pfencetl{text-align: center;margin-bottom: 50px;} .pfencetl h3{font-size: 26px;color: #FFFFFF;margin-bottom: 20px; font-weight: bold;} .pfencetl p{font-size: 16px;color: #FFFFFF;} .pfence03 .page{width: 100%;position: relative;margin-top: 50px;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;} .pfence03 .page .swiper-button-next,.pfence03 .page .swiper-button-prev{background-image: none;font-size: 26px;color: #fff;position: relative;padding: 0;margin: 0;top: 0;left: 0;right: 0;outline: none;width: 50px;height: 50px;border: 1px solid #666;display: flex;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;transition: all .3s;} .pfence03 .page .swiper-button-next:hover,.pfence03 .page .swiper-button-prev:hover{background-color: #B30606;border-color: #B30606;} .pfence03 .page .swiper-pagination{position: relative;margin: 0 30px;} .pfence03 .page .swiper-pagination-bullet{width: 8px;height: 8px;background-color: transparent;opacity: 1;margin-right: 20px;outline: none;border: 1px solid #fff;} .pfence03 .page .swiper-pagination-bullet:last-child{margin-right: 0;} .pfence03 .page .swiper-pagination-bullet-active{background-color: #FFFFFF;} /* pfence04wrap */ .pfence04wrap{width: 100%;box-sizing: border-box;padding: 100px 0;background: url(../img/wl_bj_sh.jpg)no-repeat fixed;background-size: cover;} .pfence04{width: 100%;position: relative;box-sizing: border-box;padding: 0 5%;} .pfence04::before{content: '';display: block;width: 100%;height: 1px;background-color: #FFFFFF;opacity: 0.2;position: absolute;top: 50%;left: 0;z-index: 0;} .pfence04 ul{width:1300px;margin: auto;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;position: relative;z-index: 1;} .pfence04 ul li{width: 205px;height: 205px;border-radius: 50%;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;background-size: cover;background: url(../img/wl_sh_1.png)no-repeat;background-size: cover;} .pfence04 ul li .mun_top{width: 185px;height: 185px;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;-webkit-flex-flow: column;flex-flow: column;} .pfence04 ul li .mun_top h2{font-size: 60px;color: #FFFFFF;font-weight: bold;} .pfence04 ul li .mun_top strong{display: block;width: 30px;height: 2px;background-color: #FFFFFF;margin: 20px 0;} .pfence04 ul li .mun_top p{font-size: 16px;color: #FFFFFF;} /* 案例展示 */ .case01wrap{width: 100%;box-sizing: border-box;background-color: #1e1e1e;padding: 100px 5%;} .case01wrap .tab{width: 100%;position: relative;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;margin-bottom: 60px;} .case01wrap .tab a{width: 180px;height: 50px;border: 1px solid rgba(255,255,255,0.4);background-color: #353535;font-size: 16px;color: #FFFFFF;border-radius: 50px;overflow: hidden;margin-right: 50px;} .case01wrap .tab a:last-child{margin-right: 0;} .case01wrap .tab a:hover,.case01wrap .tab a.active{border-color: #b30606;} .case01wrap .tab a::after{background-color: #b30606;border-radius: 50px;} .case01wrap .tab a.active::after{width: 100%;} .case01wrap .tab::before{content: '';display: block;width: 100%;height: 1px;background-color: #FFFFFF;opacity: 0.4;position: absolute;left: 0;top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);} .case01{width: 100%;box-sizing: border-box;} .case01 .cont{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-flow: wrap;flex-wrap: wrap;} .case01 .cont a{width: 23.5%;box-sizing: border-box;margin-right: 2%;margin-bottom: 2%;display: block;} .case01 .cont a:nth-of-type(4n){margin-right: 0;} .case01 .cont a .imgbox{width: 100%;box-sizing: border-box;overflow: hidden;} .case01 .cont a .imgbox img{display: block;width: 100%;transition: all .6s;} .case01 .cont a:hover .imgbox img{transform: scale(1.1);} .case01 .cont a .text{width: 100%;text-align: center;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;box-sizing: border-box;padding: 0 10px;text-align: center;font-size: 18px;color: #FFFFFF;height: 68px;background-color: #2a2a2a;transition: all .3s;} .case01 .cont a:hover .text{background-color: #b30606;} .case01 .fy{margin-top: 30px;} /* case02wrap */ .case02wrap{width: 100%;box-sizing: border-box;padding: 100px 0;background: url(../img/al_bj_00.jpg)no-repeat fixed;background-size: cover;} .case02{width: 90%;box-sizing: border-box;margin: auto;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .case02 a{display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;background-color: #2a2a2a;width: 32%;} .case02 a .imgbox{width: 50%;box-sizing: border-box;overflow: hidden;} .case02 a .imgbox img{display: block;width: 100%;transition: all .6s;} .case02 a:hover .imgbox img{transform: scale(1.1);} .case02 a .text{width: 50%;box-sizing: border-box;padding: 0 50px;} .case02 a .text h3{font-size: 24px;color: #ffffff;} .case02 a .text p{font-size: 16px;color: #ffffff;margin-bottom: 40px;text-transform: uppercase;margin-top: 10px;} .case02 a .text .more{background-color: transparent;border: 1px solid #FFFFFF;font-size: 14px;color: #FFFFFF;width: 110px;height: 30px;line-height: 30px;} .case02 a .text .more::after{background-color: #b30606;} .case02 a .text .more:hover{border-color: #b30606;} /* 服务 */ .servide01wrap{width: 100%;box-sizing: border-box;background-color: #1e1e1e;padding: 100px 0;} .contwidth{width: 90%;box-sizing: border-box;} .service{margin: auto;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .service a{display: block;width: 48%;box-sizing: border-box;background-color: #1b1b1b;} .service a .imgbox{width: 100%;box-sizing: border-box;overflow: hidden;} .service a .imgbox img{display: block;width: 100%;transition: all .6s;} .service a:hover .imgbox img{transform: scale(1.1);} .service a .text{width: 100%;box-sizing: border-box;padding: 40px 50px;background-color: #1b1b1b;position: relative;} .service a .text h3{font-size: ;} .service a .text .min{width: 100%;box-sizing: border-box;border-left: 1px solid #b30606;padding-left: 10px;} .service a .text .min h3{font-size: 24px;color: #FFFFFF;font-weight: bold;margin-bottom: 20px;} .service a .text .min h4{font-size: 18px;color: #ffffff;} /* servide02wrap */ .servide02wrap{width: 100%;box-sizing: border-box;position: relative;padding: 0 0 80px;background-color: #1e1e1e;} .servide02{margin: auto;box-sizing: border-box;position: relative;display: -webkit-flex;display: flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-wrap: wrap;flex-wrap: wrap;} .servide02 a{display: block;width: 32%;margin-right: 2%;position: relative;overflow: hidden;margin-bottom: 2%;} .servide02 a:nth-of-type(3n){margin-right: 0;} .servide02 a img{display: block;width: 100%;transition: all .6s;} .servide02 a:hover img{transform: scale(1.1);} .servide02 a .text{width: 100%;box-sizing: border-box;position: absolute;top: 0;left: 0;height: 100%;padding: 60px 50px 40px;background-color: rgba(23,23,23,0.85);transition: all .3s;} .servide02 a .text h3{font-size: 20px;color: #FFFFFF;margin-bottom: 20px; font-weight: bold;} .servide02 a .text h4{font-size: 16px;color: #fff;} .servide02 a .text font{display: block;width: 40px;height: 40px;line-height: 40px;border: 1px solid #999;font-size: 16px;color: #fff;text-align: center;position: absolute;left: 50px;bottom: 40px;} .servide02 a .text p{font-size: 16px;color: #999;text-transform: uppercase;writing-mode: tb;position: absolute;right: 30px;bottom: 30px; font-weight: bold;} .servide02 a:hover .text{background-color: rgba(179,6,6,0.85);} /* servide03wrap */ .servide03wrap{width: 100%;margin-top: 80px;} .servide03{margin: auto;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-flex-wrap: wrap;flex-wrap: wrap;} .servide03 a{display: block;width: 49%;box-sizing: border-box;overflow: hidden;display: -webkit-flex;display: flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;background-color: #383838;margin-bottom: 2%;} .servide03 a .imgbox{width: 35%;box-sizing: border-box;overflow: hidden;} .servide03 a .imgbox img{display: block;width: 100%;transition: all .6s;} .servide03 a:hover .imgbox img{transform: scale(1.1);} .servide03 a .text{width: 65%;box-sizing: border-box;padding-left: 60px;} .servide03 a .text h3{font-size: 24px;color: #fff;margin-bottom: 30px;} .servide03 a .text h3 font{font-size: 70px;color: #fff;} .servide03 a .text p{display: -webkit-flex;display: flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: auto;align-items: center;font-size: 16px;color: #fff;margin-bottom: 20px;text-transform: uppercase;} .servide03 a .text p::before{content: '';display: block;width: 60px;height: 1px;background-color: #b30606;margin-right: 10px;} .servide03 a .text h4{font-size: 24px;color: #ffffff;} /* 新闻 */ .news01wrap{width: 100%;box-sizing: border-box;padding: 100px 0;background-color: #1e1e1e;} .news-tab{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;margin-bottom: 60px;} .news-tab .more{display: block;width: 230px;height:50px;margin-right: 20px;line-height: 50px;background-color: #353535;border: 1px solid rgba(255,255,255,0.2);} .news-tab .more::after{background-color: #b30606;} .news-tab .more.active::after{width: 100%;} .news-tab .more.active,.news-tab .more:hover{color: #FFFFFF;border-color: #b30606;} .news-tab .more:last-child{margin-right: 0;} /* news01 */ .news01{margin: auto;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-flex-wrap: wrap;flex-wrap: wrap;} .news01 a{display: block;width: 32%;box-sizing: border-box;border-top: 1px solid rgba(255,255,255,0.2);margin-right: 2%;} .news01 a:nth-of-type(3n){margin-right: 0;} .news01 a .top{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: flex-end;align-items: flex-end;padding: 20px 0;} .news01 a .top h3{font-size: 40px;color: #FFFFFF;font-weight: bold;} .news01 a .top span{font-size: 16px;color: #ffffff;} .news01 a .imgbox{width: 100%;box-sizing: border-box;overflow: hidden;} .news01 a .imgbox img{display: block;width: 100%;transition: all .6s;} .news01 a:hover .imgbox img{transform: scale(1.1);} .news01 a .text{width: 100%;box-sizing: border-box;padding-top: 30px;} .news01 a .text h3{font-size: 20px;color: #FFFFFF;line-height: 34px;margin-bottom: 20px;transition: all .3s;font-weight: bold;} .news01 a .text .more{width: 170px;height: 44px;line-height: 44px;font-size: 14px;color: #ffffff;line-height: 44px;border: 1px solid #fff;margin-bottom: 30px;background-color: transparent;} .news01 a .text .more:hover{border-color: #b30606;} .news01 a .text .more::after{background-color: #b30606;} .news01 a:hover .text h3{color: #b30606;} .news01wrap .fy{margin-top: 50px;} .news01wrap .fy a{border: 1px solid #999;} .news01wrap .fy a.active{border-color: #b30606;} .screen-reader-text{ display: none; } .fy,.nav-links{width: 100%;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;} .fy a,.nav-links span{display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;font-size: 16px;color: #FFFFFF;transition: all .3s;margin-right: 10px;width: auto;min-width: 42px;height: 42px;box-sizing: border-box;padding: 0 12px;} .fy a.active,.nav-links span,.fy a:hover{background-color: #b30606;} .fy a:last-child{margin-right: 0;} .fy a:hover:first-child,.fy a:hover:last-child{background-color: transparent;color: #b30606;} .fy a i{color: inherit;font-size: inherit;} .news01wrap .fy,.nav-links{margin-top: 50px;} .news01wrap .fy a,.nav-links span{border: 1px solid #999;} .news01wrap .fy a.active{border-color: #b30606;} .nav-links a:hover{background-color: #b30606; color:#fff; } /* 案例详情 */ .caseinfo01wrap{background-color: #1e1e1e;} .caseinfo01{width: 1400px;margin: 100px auto;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;max-width: 90%;} .caseinfo01 .left{width: 65%;box-sizing: border-box;} .caseinfo01 .left .imgslider{width: 100%;position: relative;} .caseinfo01 .left .imgslider img{display: block;width: 100%;} .caseinfo01 .left .imgslider .page{width: 250px;height: 60px;background-color: #FFFFFF;position: absolute;left: 0;bottom: 0;z-index: 2;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;box-sizing: border-box;padding: 0 30px;} .caseinfo01 .left .imgslider .swiper-pagination{width: 80%;text-align: center;position: relative;} .caseinfo01 .left .imgslider .swiper-button-next, .caseinfo01 .left .imgslider .swiper-button-prev{position: absolute;background-image: none;font-size: 30px;color: #fff;margin: 0;padding: 0;top: 50%;left: 0;width: auto;height: auto;width: 60px;height: 60px;background-color: #040404;line-height: 60px;text-align: center;margin-top: -30px;} .caseinfo01 .left .imgslider .swiper-button-next{left: initial;right: 0;} .caseinfo01 .left .imgslider .swiper-pagination-bullet{background-color: #cccccc;opacity: 1;margin-right: 10px;} .caseinfo01 .left .imgslider .swiper-pagination-bullet:last-child{margin-right: 0;} .caseinfo01 .left .imgslider .swiper-pagination-bullet-active{background-color: #b30606;} .caseinfo01 .left .imgslider .bigimgbox{width: 100%;overflow: hidden;display: flex;display: -webkit-flex;-webkit-justify-content:center;justify-content: center;-webkit-align-items:center;align-items: center;} .caseinfo01 .left .imgslider .smallimgbox{width: 100%;} .caseinfo01 .left .imgslider .bigimgbox img,.caseinfo01 .left .imgslider .smallimgbox img{display: block;width: 100%;height: auto;max-width: 100%;} .caseinfo01 .left .imgslider .gallery-thumbs{margin-top: 2%;} .caseinfo01 .left .imgslider .gallery-thumbs .swiper-slide{border: 3px solid #00000000;box-sizing: border-box;} .caseinfo01 .left .imgslider .gallery-thumbs .swiper-slide-thumb-active{border-color: #b30606;} .caseinfo01 .left .imgslider .doortl02{text-align: left;} .caseinfomin{width: 100%;margin: 60px auto;} .caseinfomin .item{width: 100%;margin-bottom: 60px;} .caseinfomin .item .info-tl,.caselistwrap .caselist .info-tl{display: block;width: 100%;font-size: 24px;color: #ffffff;border-bottom: 1px solid rgba(255,255,255,0.3);position: relative;text-align: left;padding-bottom: 20px;margin-bottom: 30px;} .caseinfomin .item .info-tl::before,.caselistwrap .caselist .info-tl::before{content: '';display: block;width: 40px;height: 2px;position: absolute;left: 0;bottom: -1px;background-color: #FFFFFF;} .caseinfomin .item .list{width: 100%;display: flex;display: -webkit-flex;-webkit-align-items: center;align-items: center;-webkit-justify-content: flex-start;justify-content: flex-start;} .caseinfomin .item .list li{width: 32%;box-sizing: border-box;background-color: #373737;height: 70px;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: center;font-size: 16px;padding: 0 20px;margin-right: 2%;color: #fff;} .caseinfomin .item .list li:last-child{margin-right: 0;} .caseinfomin .item .textinfo{font-size: 16px;color: #ffffff;line-height: 30px;text-align: justify;} .caseinfomin .item .textinfo::-webkit-scrollbar {width: 2px;height: 2px;scrollbar-arrow-color:red;} .caseinfomin .item .textinfo::-webkit-scrollbar-thumb {border-radius: 2px;-webkit-box-shadow: inset 0 0 3px rgba(255,255,255,0.2);background: rgba(255,255,255,0.9);scrollbar-arrow-color:red;} .caseinfomin .item .textinfo::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 3px rgba(255,255,255,0.2);border-radius: 0;background: rgba(255,255,255,0.3);} .caseinfomin .item .link{width: 100%;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;border-top: 1px solid rgba(255,255,255,0.3);padding-top: 60px;} .caseinfomin .item .link a{margin-right: 20px;} .caseinfomin .item .link a:last-child{margin-right: 0;} .caseinfo01 .right{width: 30%;box-sizing: border-box;} .caseinfo01 .right .doortl02{text-align: left;} .caseinfo01 .right .list{width: 100%;box-sizing: border-box;} .caseinfo01 .right .list a{display: block;width: 100%;position: relative;margin-bottom: 30px;} .caseinfo01 .right .list a:last-child{margin-bottom: 0;} .caseinfo01 .right a .imgbox{width: 100%;overflow: hidden;} .caseinfo01 .right a .imgbox img{display: block;width: 100%;transition: all .6s;} .caseinfo01 .right a:hover .imgbox img{transform: scale(1.1);} .caseinfo01 .right a .text{background-color: #2b2b2b;box-sizing: border-box;padding: 40px;width: 100%;} .caseinfo01 .right a .text h3{font-size: 20px;color: #FFFFFF;font-weight: bold;margin-bottom: 30px;transition: all .3s;} .caseinfo01 .right a .text .more{border: 1px solid rgba(255,255,255,0.5);width: 90px;height: 25px;line-height: 25px;background-color: transparent;text-transform: uppercase;font-size: 14px;} .caseinfo01 .right a:hover .text h3{color: #f00; } /* 关于 */ .aboutab{margin-top: 100px;margin-bottom: 60px;} .about01wrap{width: 100%;box-sizing: border-box;padding: 100px 0;position: relative;} .about01wrap::after{content: '';display: block;width: 80%;box-sizing: border-box;background-color: #2c2c2c;position: absolute;right: 0;top: 0;height: 100%;z-index: 0;} .about01{width: 100%;position: relative;z-index: 1;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;} .about01 .video{width: 60%;box-sizing: border-box;} .about01 .video video{display: block;width: 100%;outline: none;} .about01 .text{width: 40%;box-sizing: border-box;padding-right: 5%;padding-left: 120px;} .about01 .text font{font-size: 16px;color: #ffffff;margin-bottom: 10px;display: block;text-transform: uppercase;} .about01 .text h3{font-size: 30px;color: #ffffff;font-weight: bold;margin-bottom: 10px;} .about01 .text p{display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: center;align-items: center;font-size: 18px;color: #FFFFFF;margin-bottom: 30px;} .about01 .text p::before{content: '';display: block;width: 50px;height: 1px;background-color: #FFFFFF;margin-right: 10px;} .about01 .text h4{font-size: 16px;color: #FFFFFF;line-height: 28px;text-align: justify;} /* about02wrap */ .about02wrap{width: 100%;box-sizing: border-box;margin: 100px 0;} .a-tl{width: 100%;box-sizing: border-box;text-align: center;margin-bottom: 40px;} .a-tl h3{font-size: 30px;color: #ffffff;font-weight: bold;margin-bottom: 20px;} .a-tl h4{font-size: 16px;color: #ffffff;} .about02wrap .a-tl{text-align: center;} .about02{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;background: url(../img/wh_bj.jpg)no-repeat fixed;background-size: cover; background-attachment: scroll;} .about02 li{width: 20%;box-sizing: border-box;border-right: 1px solid #FFFFFF;padding: 60px 50px;height: 700px;position: relative;} .about02 li::after{content: '';display: block;width: 100%;height: 100%;background-color: rgba(0,0,0,0.7);opacity: 0;transition: all .3s;position: absolute;top: 0;left: 0;z-index: 0;} .about02 li:last-child{border-right: none;} .about02 li .text{width: 100%;height: 100%;position: relative;overflow: hidden;z-index: 1;} .about02 li font{font-size: 100px;color: #FFFFFF;opacity: 0.3;transition: all .3s;} .about02 li:hover font{opacity: 1;} .about02 li .cont{width: 100%;position: absolute;top: 100%;transition: all .3s;transform: translateY(-60px);-webkit-transform: translateY(-60px);} .about02 li .cont h3{font-size: 24px;color: #fff;margin-bottom: 20px;} .about02 li .cont p{font-size: 16px;color: #FFFFFF;margin-bottom: 30px;} .about02 li .cont h4{font-size: 16px;color: #fff;line-height: 28px;} .about02 li:hover .cont{transform: translateY(-100%);-webkit-transform: translateY(-100%);} .about02 li:hover::after{opacity: 1;} /* about03 */ .about03wrap{width: 100%;box-sizing: border-box;margin: 100px 0;} .about03{margin: auto;box-sizing: border-box;} .about03 .imgbox{width: 100%;overflow: hidden;box-sizing: border-box;} .about03 img{display: block;width: 100%;transition: all .6s;} .about03 .imgbox:hover img{transform: scale(1.1);} .about03 .page{position: relative;width: 100%;display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;margin-top: 40px;} .about03 .page .swiper-button-next,.about03 .page .swiper-button-prev{display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;border: 1px solid #FFFFFF;width: 50px;height: 50px;position: relative;margin: 0;padding: 0;left: 0;right: 0;top: 0;background-image: none;outline: none;} .about03 .page .swiper-button-next::before,.about03 .page .swiper-button-prev::before{color: #FFFFFF;font-size: 26px;} .about03 .page .swiper-button-next{margin-left: 40px;} /* 联系我们 */ .contact01{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;-webkit-align-items: center;align-items: center;padding-left: 5%;} .contact01 .left{width: 40%;box-sizing: border-box;padding: 80px;background-color: #3c3c3c;margin-right: -10%;position: relative;z-index: 1;} .contact01 .left h3{font-size: 28px;color: #ffffff;font-weight: bold;margin-bottom: 30px;} .contact01 .left .item h4{font-size: 20px;color: #dfdfdf;text-transform: uppercase;margin-bottom: 20px;} .contact01 .left .item p{font-size: 16px;color: #FFFFFF;} .contact01 .left .item{margin-bottom: 30px;} .contact01 .left .item:last-child{margin-bottom: 0;} .contact01 .left .font{font-size: 93px;color: #FFFFFF;opacity: 0.1;position: absolute;right: 10px;top: 50%;writing-mode: tb;text-transform: uppercase;transform: translateY(-50%);-webkit-transform: translateY(-50%);} .contact01 .imgbox{width: 70%;box-sizing: border-box;overflow: hidden;position: relative;z-index: 0;} .contact01 .imgbox img{display: block;width: 100%;transition: all .6s;} .contact01 .imgbox:hover img{transform: scale(1.1);} /* contact02 */ .contact02{width: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;align-items: center;-webkit-align-items: center;} .contact02 .left{width: 33.5%;text-align: center;} .contact02 .left h3{font-size: 28px;color: #FFFFFF;font-weight: bold;line-height: 36px;} .contact02 .left p{font-size: 20px;color: #dfdfdf;line-height: 30px;text-transform: uppercase;} .contact02 .right{width: 66.5%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .contact02 .right a{width: 25%;box-sizing: border-box;border-left: 1px solid rgba(255,255,255,0.1);text-align: center;padding: 70px 0;position: relative;} .contact02 .right a .imgbox{width: 110px;height: 110px;border-radius: 50%;border: 1px solid #fff;background-color: #323232;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;margin: auto;} .contact02 .right a strong{display: block;width: 60px;height: 1px;background-color: #b30606;margin: 20px auto;} .contact02 .right a p{font-size: 20px;color: #ffffff;} .contact02 .right a .imgbox i{font-size: 30px;color: #FFFFFF;} .contact02 .right a .imgbox img{display: block;width: auto;height: 30px;} .contact02 .right a .hoverewm{width: 112px;height: auto;display: block;position: absolute;top: 70px;left: 50%;margin-left: -56px;opacity: 0;transition: all .3s;} .contact02 .right a:hover .hoverewm{opacity: 1;} /* 新闻详情 */ .newsinfo01wrap{width: 1400px;box-sizing: border-box;margin: 100px auto;max-width: 96%;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;} .newsinfo01{width: 65%;box-sizing: border-box;} .newsinfo01 .tl{width: 100%;box-sizing: border-box;border-bottom: 1px solid rgba(225,255,255,0.4);padding-bottom: 30px;margin-bottom: 40px;position: relative;} .newsinfo01 .tl::before{content: '';display: block;width: 50px;height: 2px;background-color: #FFFFFF;position: absolute;left: 0;bottom: 0;} .newsinfo01 .tl h3{font-size: 20px;color: #ffffff;margin-bottom: 30px;font-weight: bold;} .newsinfo01 .tl p{font-size: 16px;color: #FFFFFF;} .newsinfo01 .min{width: 100%;} .newsinfo01 .min h4,.newsinfo01 .min p,.newsinfo01 .min p a,.newsinfo01 .min span,.newsinfo01 .min font{font-size: 16px;line-height: 30px;color: #FFFFFF;margin-bottom: 0;} .newsinfo01 .min h4 img{display: block;width: 100%;} .newsinfo01 .min p{text-indent:2em;} .newsinfo01 .min p img{ width: auto;height: auto; margin: 0 auto;} .newsinfo01 .link{width: 100%;display: flex;display: -webkit-flex;-webkit-justify-content: flex-start;justify-content: flex-start;border-top: 1px solid rgba(255,255,255,0.3);padding-top: 60px;} .newsinfo01 .link a{margin-right: 20px;} .newsinfo01 .link a:last-child{margin-right: 0;} .newsinfo01wrap .right{width: 30%;box-sizing: border-box;} .newsinfo01wrap .right .doortl02{text-align: left;} .newsinfo01wrap .right .list{width: 100%;box-sizing: border-box;} .newsinfo01wrap .right .list a{display: block;width: 100%;margin-bottom: 30px;} .newsinfo01wrap .right .list a .imgbox{width: 100%;box-sizing: border-box;overflow: hidden;} .newsinfo01wrap .right .list a .imgbox img{display: block;width: 100%;transition: all .6s;} .newsinfo01wrap .right .list a:hover .imgbox img{transform: scale(1.1);} .newsinfo01wrap .right .list a .text{width: 100%;box-sizing: border-box;background-color: #2b2b2b;padding: 30px;} .newsinfo01wrap .right .list a .text p{font-size: 14px;color: #FFFFFF;margin-bottom: 10px;} .newsinfo01wrap .right .list a .text h3{font-size: 16px;color: #fff;font-weight: bold;line-height: 30px;} .newsinfo01wrap .right .list a:hover .text h3{color: #b30606;} .newsinfo01wrap .right .list .tocont{position: relative;box-sizing: border-box;width: 100%;} .newsinfo01wrap .right .list .tocont .img{width: 100%;box-sizing: border-box;overflow: hidden;} .newsinfo01wrap .right .list .tocont .img img{display: block;width: 100%;transition: all .6s;} .newsinfo01wrap .right .list .tocont .img:hover img{transform: scale(1.1);} .newsinfo01wrap .right .list .tocont .img .font{width: 100%;height: 100%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-align-items: auto;align-items: center;box-sizing: border-box;padding: 0 30px;position: absolute;top: 0;left: 0;} .newsinfo01wrap .right .list .tocont .img .font .box{width: 100%; margin-bottom: 50px;} .newsinfo01wrap .right .list .tocont .img .font .box h3{font-size: 30px;color: #FFFFFF;opacity: 0.5;margin-bottom:10px;text-transform: uppercase;} .newsinfo01wrap .right .list .tocont .img .font .box p{font-size: 20px;color: #FFFFFF;} .newsinfo01wrap .right .list .tocont .img .font .box h4{font-size: 18px;color: #FFFFFF;font-weight: bold;margin-top: 20px;margin-bottom: 10px;} .newsinfo01wrap .right .list .tocont .bot{width: 100%;height: 66px;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;font-size: 16px;color: #ffffff;background-color: #b30606;} /* 阳台护栏 */ .balcony01wrap{width: 100%;box-sizing: border-box;padding: 100px 0;background-color: #000000;} .balcony01{width: 90%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;margin: auto;} .balcony01 a{width: 23.5%;margin-right: 2%;overflow: hidden;position: relative;} .balcony01 a>img{display: block;width: 100%;transition: all .6s;} .balcony01 a:hover>img{transform: scale(1.1);} .balcony01 a .top{width: 100%;box-sizing: border-box;padding: 40px;background-color: #1a1a1a;position: absolute;top: 0;z-index: 1;left: 0;transition: all .6s;} .balcony01 a .top strong{display: block;width: 30px;height: 2px;background-color: #FFFFFF;margin-bottom: 20px;} .balcony01 a .top h3{font-size: 22px;color: #FFFFFF;font-weight: bold;} .balcony01 a .top img{display: block;width: auto;height: 60px;} .balcony01 a .top .iconbox{width: auto;height: 60px;position: absolute;right: 40px;top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);} .balcony01 a .top .iconbox .img02{display: none;} .balcony01 a:hover .top .iconbox .img02{display: block;} .balcony01 a:hover .top .iconbox .img01{display: none;} .balcony01 a:hover .top strong{background-color: #b30606;} .balcony01 a:hover .top h3{color: #b30606;} .balcony01 a:hover .top{background-color: transparent;} /* balcony02wrap */ .balcony02wrap{width: 100%;box-sizing: border-box;position: relative;background-color: #1e1e1e;padding: 100px 0;} .balcony02{width: 90%;box-sizing: border-box;position: relative;z-index: 1;margin: auto;} .balcony02 .left{width: 49%;box-sizing: border-box;overflow: hidden;} .balcony02 .left img{display: block;width: 100%;transition: all .6s;} .balcony02 .left:hover img{transform: scale(1.1);} .balcony02 .right{width: 49%;box-sizing: border-box;height: 100%;position: absolute;right: 0;top: 0;} .balcony02 .right a{display: block;width: 100%;height: calc((100% - 40px)/3);position: relative;margin-bottom: 20px;background-color: #262626;box-sizing: border-box;padding: 15px 0 15px 25px;display: flex;display: -webkit-flex;overflow: hidden;} .balcony02 .right a:last-child{margin-bottom: 0;} .balcony02 .right a .text{width: 55%;background-color: rgba(255,255,255,0.2);box-sizing: border-box;padding: 0 40px;display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-flex-flow: column;flex-flow: column;position: relative;z-index: 1;} .balcony02 .right a .text span{font-size: 16px;color: #fff;opacity: 0.6;text-transform: uppercase;display: block;margin-bottom: 10px;} .balcony02 .right a .text h3{font-size: 22px;color: #fff;} .balcony02 .right a .text strong{display: block;width: 50px;background-color: #b30606;height: 2px;margin: 20px 0;} .balcony02 .right a .text p{font-size: 16px;color: #fff;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .balcony02 .right a .imgbox{width: 50%;box-sizing: border-box;overflow: hidden;position: absolute;right: 0;z-index: 0;top: 0;} .balcony02 .right a .imgbox img{display: block;width: 100%;transition: all .6s;} .balcony02 .right a:hover .imgbox img{display: block;transform: scale(1.1);} /* balcony03 */ .balcony03wrap{width: 100%;background-color: #000000;padding: 100px 0;position: relative;} .balcony03wrap::after{content: '';display: block;width: 50%;height: 100%;background: url(../img/balcony02.jpg)no-repeat;background-size: cover;position: absolute;right: 0;top: 0;z-index: 0;} .balcony03{width: 90%;margin: auto;position: relative;z-index: 1;} .balcony03 .text{width: 40%;box-sizing: border-box;} .balcony03 .text h3{font-size: 60px;color: #FFFFFF;opacity: 0.5;text-transform: uppercase;margin-bottom: 40px;} .balcony03 .text p{font-size: 30px;color: #FFFFFF;margin-bottom: 30px;} .balcony03 .text h4{font-size: 16px;color: #ffffff;line-height: 28px;} .balcony03 .mumping_mun{width: 80%;box-sizing: border-box;display: flex;display: -webkit-flex;-webkit-justify-content: space-between;justify-content: space-between;margin-top: 70px;} .balcony03 .mumping_mun li{width: calc((100% - 3px)/4);background-color: rgba(255,255,255,0.8);box-sizing: border-box;padding: 40px;} .balcony03 .mumping_mun li img{display: block;width: auto;margin-bottom: 40px;} .balcony03 .mumping_mun li h2{font-size: 50px;color: #333333;font-weight: bold;} .balcony03 .mumping_mun li h2::after{content: '+';font-size: inherit;color: inherit;} .balcony03 .mumping_mun li p{font-size: 20px;color: #333;margin-top: 20px;} /* 侧边浮动 */ .ass{position: fixed;top: 37%;right: 0;z-index: 11;display: none;} .ass ul li{width: 70px;height: 70px;background-color: #790000;display: block;box-sizing: border-box;margin-bottom: 1px; border-radius: 4px;} .ass ul li a{display: flex;display: -webkit-flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;-webkit-flex-flow: column;flex-flow: column;width: 100%;height: 100%;} .ass ul li a font{font-size: 14px;color: #FFFFFF;margin-top: 10px;} .ass ul li img{width: 25px;margin: 0 auto;} .ass ul li .mobile{position: absolute;top: -28%;right: 102%;width: 150px;height: 150px;background-color:#6b0d0d;text-align: center;display: none;} .ass ul li .adss-1{top: 10%;} .ass ul li .adss-0{top: 10%;} .ass ul li .adss-2{top: 50%;height: auto;} .ass ul li .adss-2 p{font-size: 12px;color: #FFF;margin: 10px 0;} .ass ul li .mobile span{font-size: 70px;color: #FFF;margin: 20px 0 10px;display: inline-block;} .ass ul li .adss-1 p{font-size: 12px;color: #FFF;margin-bottom: 6px;} .ass ul li .adss-0 p{font-size: 12px;color: #FFF;margin-bottom: 6px;} .ass ul li .mobile img{width: 100px;margin: 12px auto;} .ass ul li .adss-2 h4{font-size: 16px;color: #FFF;display: block;} @media only screen and (max-width: 1720px){ .headerwrap .header .logo .img01{height: 60px;} .headerwrap .header .logo .img02{height: 36px;} .headerwrap .header .right .nav li{padding: 0 15px;} .headerwrap .header .right .nav{margin-right: 20px;} .headerwrap .header .right .nav li>a{font-size: 14px;} .headerwrap .header{width: 96%;} .bannerwrap .centerBig .text p{font-size: 24px;} .bannerwrap .centerBig .text h3{font-size: 50px;} .bannerwrap .centerBig .text h4{font-size: 20px;} .bannerlist li img{height: 44px;} .bannerlist li .text span{font-size: 16px;} .bannerlist li .text p{font-size: 12px;} .index02 a .text .cont h4{font-size: 14px;line-height: 24px;} .index02 a .text .cont img{height: 40px;} .index02 a .text .cont h3{font-size: 18px;} .index03 a .text{padding: 30px;} .index03 a .text h3{font-size: 18px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .index04 .text{padding-left: 50px;} .index06 .mumping_mun li{-webkit-justify-content: space-between;justify-content: space-between;width: 100%;margin: auto;margin-top: 80px;} .index06 .mumping_mun{margin-top: 0;} .index06 .list{margin-bottom: 0;} .index06 .mumping_mun li{margin-right: 80px;} .index06 .mumping_mun li h3{width: 160px;padding-top: 40px;} .bannerwrap .centerBig .text p{line-height: normal;} .footer{width: 96%;} .index06 .list{width: 100%;} .index06 .info{width: 60%;} /* 庭院门 */ .innerbanner .text h3{font-size: 50px;} .innerbanner .text p{font-size: 18px;} .pdoor01,.pdoor02,.pdoor03,.pdoor04,.pdoor05{width: 96%;} .pdoor01 .text{padding-left: 80px;} .pdoor02 .cont a .text h3{font-size: 18px;letter-spacing: 1px;} .pdoor02 .cont a .text{padding: 30px 40px;} .pdoor03 .right li .cont .text h3{font-size: 22px;} .pdoor03 .left h3{font-size: 26px;} .pdoor03 .left h4{font-size: 20px;} .pdoor03 .left p{font-size: 16px;} .pdoor04 .left h3{font-size: 26px;line-height: 42px;} .pdoor04 .right li{padding: 40px;} .pdoor05 a .text{padding: 30px 20px;} .pdoor05 a .text p{font-size: 14px;} .pdoor05 a .text h3{font-size: 20px;} .pdoor05 a{margin-bottom: 60px;} .pdoor05wrap{padding-bottom: 40px;} /* 产品中心 */ .proall01wrap .left .tl,.proall01wrap .left .info a{padding-left: 11%;} .proall01{padding: 166px 2% 0 2%;} .proall02wrap{padding: 100px 2% 80px;} .proall02 .cont li{padding: 30px 20px;} .proall02 .cont li font img{width: 86px;} .proall02 .cont li .text h3{font-size: 20px;} .proall02 .cont li .text p{font-size: 16px;} /* 围栏 */ .pfence01wrap{padding: 100px 2%;} .pfence01 .left{width: 28%;} .pfence01 .right{width: 75%;} .pfence01 .left h3{font-size: 36px;line-height: 48px;} .pfence01 .left h4{font-size: 24px;} .pfence01 .left p{font-size: 14px;line-height: 24px;} .pfence01 .left .more{width: 180px;height: 48px;line-height: 48px;} .pfence02wrap{padding: 100px 2%;} .pfence02 li{padding: 40px 30px;width: 18.4%;} .pfence02 li h3{margin-top: 50px;} .pfence02 li h4{font-size: 16px;} .pfence02 li p{font-size: 12px;} .pfence03{width: 96%;} .pfence04 ul{width: 1200px;} /* 案例 */ .case01wrap{padding: 100px 2%;} .case02{width: 96%;} .case02 a .text{padding: 0 20px;} .case02 a .text p{font-size: 14px;margin-bottom: 30px;} .case02 a .text h3{font-size: 22px;} /* 服务 */ .contwidth,.balcony01,.balcony02,.balcony03{width: 96%;} .servide02 a .text{padding: 40px 30px 30px;} .servide02 a .text font{bottom: 30px;left: 30px;} .servide02 a .text h3{margin-bottom: 10px;} .servide02 a .text h4{font-size: 14px;} .servide03 a .text h3{font-size: 20px;margin-bottom: 40px;} .servide03 a .text h3 font{font-size: 70px;} .servide03 a .text h4{font-size: 18px;} .servide03 a .text{padding-left: 40px;} .caseinfo01{max-width: 96%;} /* 关于 */ .about02 li{height: 520px;padding: 50px 30px;} .about01 .text{padding-left: 80px;padding-right: 2%;} /* 联系 */ .contact01{padding-left: 2%;} .contact01 .left{width: 50%;padding: 50px 40px 20px;margin-right: -20%;} .contact01 .left .font{font-size: 72px;} .contact02 .right{width: 68.5%;} .contact02 .left{width: 31.5%;} .index06 .mumping_mun{width: 96%;} .contact01 .left .item p{font-size: 14px;margin-bottom: 12px;} .contact01 .left .item:last-child{margin-bottom: 0} /* 阳台 */ .balcony02 .right a .text h3{font-size: 20px;} .balcony02 .right a .text strong{margin: 15px 0;} .balcony02 .right a .text{padding: 0 20px;padding-right: 40px;} .balcony02 .right a .text span{font-size: 14px;margin-bottom: 8px;} .balcony02 .right a .text p{font-size: 14px;} .balcony02 .right a .imgbox{width: 48%;} .balcony01 a .top{padding: 30px;} .balcony01 a .top strong{width: 20px;margin-bottom: 15px;} .balcony01 a .top h3{font-size: 20px;} .balcony03 .mumping_mun li{padding: 30px;} .balcony03 .mumping_mun li img{margin-bottom: 30px;} .balcony03 .mumping_mun li h2{font-size: 46px;} .balcony03 .mumping_mun li p{font-size: 18px;margin-top: 10px;} .balcony03 .text h3{font-size: 50px;margin-bottom: 30px;} .balcony03 .text p{font-size: 26px;margin-bottom: 20px;} .balcony03 .text h4{font-size: 14px;line-height: 26px;} .balcony03 .mumping_mun{margin-top: 50px;width: 90%;} .contact01 .imgbox{width: 60%;} .contact01 .imgbox img{width: auto;height: 450px;} }