/*header*/ .header{background: #fff;position: fixed;width:100%;z-index: 9999;top:0;transition: all .5s;} .header.active{top:-100%;} .header.shadow{border-bottom: solid 1px #eee;} .header-box{display: flex;flex-direction: row;justify-content: space-between;} .h-logo{width:250px;display: flex;padding:10px 15px;transition: all .5s;flex-direction: row;align-items: center;} .h-logo img{max-height: 100%;} .h-nav{width: calc(100% - 650px);display: flex;flex-direction: row;justify-content: space-around;transition: all .5s} .h-nav li{height: 100%;position: relative;} .h-nav li .yiji{color:#333333;font-size: 18px;transition: all .5s;display: inline-block;height: 100%;line-height: 90px;font-weight: 400;} .h-nav li .yiji:after{content:'';position: absolute;height: 4px;background: var(--zhu-color);left:50%;bottom:-1px;transform: translateX(-50%);width:0;transition: all .5s;} .h-nav li.on .yiji{color:var(--zhu-color);letter-spacing: 1px;font-weight: 700;} .h-nav li.on .yiji:after{width:100%;} .h-nav li .sublist{position: fixed;width:100%;top:90px;left:0;background: rgba(255,255,255,.95);box-shadow:0px 5px 5px 5px rgba(9,9,9,.1);display: none;} .h-nav li .sublist .left{padding:40px 40px 80px;width:30%;float: left;} .h-nav li .sublist .left .hd{padding:40px 0;color:var(--zhu-color);} .h-nav li .sublist .left .hd .t1{font-size:32px;font-weight: bold; } .h-nav li .sublist .left .hd .t2{font-size:22px;font-weight: bold;opacity: 0.1;text-transform: uppercase;font-family:Arial; } .h-nav li .sublist .left .bd{display: flex;flex-direction: column;} .h-nav li .sublist .left .bd p{color:#777;padding:8px 0;} .h-nav li .sublist .left .bd p i{color:var(--zhu-color);float: left;font-size: 16px;line-height: 1.4;margin-right: 5px} .h-nav li .sublist .mid{width:36%;padding:40px;float: left;border-left:solid 1px #eae8e8;border-right:solid 1px #eae8e8;} .h-nav li .sublist .mid .hd{padding:18px 0;border-bottom: solid 1px #eae8e8;} .h-nav li .sublist .mid .hd i{color:var(--zhu-color);font-size: 26px;float: left;margin-right: 10px;line-height: 1.5} .h-nav li .sublist .mid .hd b{color:var(--zhu-color);font-size: 24px;} .h-nav li .sublist .mid .hd span{color:#999;text-transform: uppercase;} .h-nav li .sublist .mid .bd{width:100%;padding:15px 0;} .h-nav li .sublist .mid .bd a{width:50%;display: block;float: left;color:#777;padding:10px;font-size: 16px;} .h-nav li .sublist .mid .bd a i{color:var(--zhu-color);float: left;font-size: 24px;line-height: 1} .h-nav li .sublist .mid .bd a p{width:calc(100% - 24px);float: right;transition: all .5s;} .h-nav li .sublist .mid .bd a:hover p{padding-left: 5px;color:var(--zhu-color);} .h-nav li .sublist .mid .bd.proNav a{width:100%;} .h-nav li .sublist .mid .bd.proNav .sub{padding-left: 28px;} .h-nav li .sublist .mid .bd.proNav .sub a{color:#999;padding:5px;display: inline-block;width:auto;font-size: 14px;transition: all .5s} .h-nav li .sublist .mid .bd.proNav .sub a:hover{color:var(--zhu-color)} .h-nav li .sublist .right{width:34%;float: right;height: 396px;} .h-nav li .sublist .right img{width:130%;object-fit: cover;max-width: none;height: 100%} .h-right{width:330px;display: flex;flex-direction: row;align-items: center;transition: all .5s;} .h-right i{font-size: 30px;color:var(--zhu-color);line-height: 1} .h-right span{font-size: 18px;padding:0 0 0 10px;} .h-right b{font-size:24px;font-family: Arial;color:var(--zhu-color);} .h-menu{width:60px;text-align: center;cursor: pointer;display: none;flex-direction: column;justify-content:center;} .h-menu i{color:#000;font-size: 40px;line-height: 1} @media(max-width: 1600px){ .h-nav li .sublist .right img{width:100%;} } @media(max-width: 1400px){ .h-nav{width:calc(100% - 600px);} } @media(max-width: 1200px){ .h-logo{width:210px;} .h-right{width:auto;padding-right: 15px} .h-right i{margin-right:10px;} .h-right b{font-size: 20px} .h-right span{display: none;} .h-nav{width:calc(100% - 400px);} } @media(max-width: 1024px){ .h-right{display: none;} .h-nav{width:calc(100% - 250px);} } @media(max-width: 992px){ .h-nav{display: none;} .h-logo{width:calc(100% - 100px);} .h-menu{display:flex;} } @media(max-width: 576px){ .h-menu{width:50px;height: 50px} .h-logo{width:calc(100% - 60px);padding:5px 5px;height:50px} } /*banner*/ .banner{height:100vh;position: fixed;top:0;left:0;width:100%;overflow: hidden;} .banner-box{height:100%;} .banner .swiper-slide{position: relative;height: 100%;width:100%;overflow: hidden;} .banner .swiper-slide .bg{position:absolute;top:0;left:0;height: 100vh;object-fit: cover;transform: scale(1.1,1.1);transition: all 3s;width:100%;} .banner .swiper-slide-active .bg{transform: scale(1,1);} .banner1{height:100vh;display: flex;flex-direction: column;align-items: center;justify-content: center;position: relative;z-index: 1;padding:15px;} .banner1-img2{margin-top: 20px;} .banner1-img3{margin-top: 55px;} .banner1 .t1{font-size: 14px;color:#000;line-height: 20px;margin-top: 15px;text-transform: uppercase;} .banner2{display: flex;flex-direction: column;justify-content: center;height: 100vh;padding:0 15px;width:580px;align-items: flex-start;} .banner2 .t2{font-size: 18px;color:#333333;line-height: 36px;padding:30px 0;position: relative;} .banner2 .t3{font-size: 10px;color:var(--zhu-color);line-height: 20px;text-transform: uppercase;position: relative;padding-top: 30px;} .banner2 .t3:before{content:'';position: absolute;top:0;left:0;width:100px;height: 3px;background: var(--zhu-color)} .banner_more{position: absolute;bottom: 10vh;left: 50%;width: 4.5vw;height: 4.5vw;border-radius: 50%;background-color: var(--zhu-color);z-index: 1;animation: banner_more_breathe 3s ease-out infinite;align-items: center;justify-content: center;display: flex;color:#fff;cursor: pointer; } @keyframes banner_more_breathe{ 0%{opacity: 1} 50%{opacity: 0.5} 100%{opacity: 1} } .banner_more i{opacity: 1!important;font-size: 25px} .banner_more::before{position: absolute;content: "";display: block;width: 5.9vw;height: 5.9vw;border: 0.052vw dashed #fff;border-radius: 50%;animation: banner_more_before_breathe 3s ease-out infinite;} @keyframes banner_more_before_breathe{ 0%{width: 4.5vw;height: 4.5vw;} 50%{width: 5.9vw;height: 5.9vw;opacity: 0.5;} 100%{width: 4.5vw;height: 4.5vw;} } .banner_more::after{position: absolute;content: "";display: block;width: 7.3vw;height: 7.3vw;border: 0.052vw dashed #fff;border-radius: 50%;animation: banner_more_after_breathe 3s ease-out infinite;} @keyframes banner_more_after_breathe{ 0%{width: 5.9vw;height: 5.9vw;} 50%{width: 7.3vw;height: 7.3vw;opacity: 0.5;} 100%{width: 5.9vw;height: 5.9vw;} } @media(max-width: 768px){ .banner{height: 60vh;} .banner .swiper-slide .bg{height: 60vh} .banner_more{display: none;} .banner1,.banner2{height: calc(60vh + 60px);width:100%;} .banner1-img3{margin-top: 20px} .banner2 .t2{font-size: 14px;line-height: 20px;padding:15px 0;} .banner2 .t3{display: none} } /*main*/ .main{position: relative;width:100%;z-index: 1;background: #fff;overflow: hidden;} .main::-webkit-scrollbar{width:0;} /*icom*/ .icom{padding:0 40px;} .icom .row>div{border-right:solid 1px #e1e1e1;} .icom .row>div:nth-child(3){border-right:none;} .icom .item{padding:90px 60px;overflow: hidden;display: flex;flex-direction: column;position: relative;height: 790px} .icom .item .t1{font-size: 30px;color:#333333;} .icom .item .t2{-webkit-line-clamp:2;font-size: 16px;color:#666666;margin:30px 0 0;line-height: 30px;} .icom .item .t3 a{color:#666;font-size: 16px;margin-right: 15px;display: inline-block;position: relative;transition: all .5s;padding: 5px 0} .icom .item .t3 a:after{content:'';position: absolute;height: 1px;width:0;bottom:0;left:0;transition: all .5s;background: var(--zhu-color)} .icom .item .t3 a:hover{color:var(--zhu-color);} .icom .item .t3 a:hover:after{width:100%;} .icom .item .more{display: flex;flex-direction: row;align-items: center;margin-top: 45px;} .icom .item .more i{border:solid 1px #666;width:30px;height: 30px;color:#333;border-radius: 50%;text-align: center;line-height: 30px;font-size: 20px;transition: all .5s} .icom .item .more span{font-size: 14px;color:#666666;margin-left: 15px;transition: all .5s} .icom .item .more:hover i{color:#fff;border-color:var(--zhu-color);background: var(--zhu-color);transform: rotate(-30deg);} .icom .item .more:hover span{color:var(--zhu-color);letter-spacing: 1px} .icom .item .pic{position: absolute;top:450px;left:50%;transform: translateX(-50%);width:100%;text-align: center;} @media(max-width:1724px){ .icom{padding:0;} .icom .row>div:nth-child(1) .item{padding-left: 0} .icom .row>div:nth-child(3) .item{padding-right: 0} } @media(max-width: 1400px){ .icom .row>div:nth-child(1) .item{padding-right: 30px} .icom .row>div:nth-child(2) .item{padding:90px 30px} .icom .row>div:nth-child(3) .item{padding-left: 30px} } @media(max-width: 1200px){ .icom .item{height: 700px} } @media(max-width: 992px){ .icom .item{padding:60px 15px 0!important;height: auto;} .icom .item .pic{position: initial;transform: translateX(0);margin-top: 60px;} } @media(max-width:576px){ .icom .item{padding:30px 0px 0!important;} .icom .item .pic{margin-top: 30px;} } /*ititle*/ .ititle{text-align: center;} .ititle span{font-size: 48px;position: relative;} .ititle span:before{position: absolute;top:-10px;right:-30px;content:'';width:20px;height: 20px;border:solid 2px var(--pei-color);border-radius: 50%} .ititle span b{color:var(--zhu-color);} .ititle .t2{font-size: 18px;color:#666666;margin-top: 5px;} @media(max-width: 576px){ .ititle span{font-size: 30px;} .ititle .t2{padding:0 15px;font-size: 14px;} } /*ipro*/ .ipro{background: url('../images/ipro-bg.jpg');padding-top:65px;background-attachment: fixed;} .ipro-md{position:absolute;bottom:0;right:-200px;width:1000px;height: 152px;background: var(--zhu-color);} .ipro-bd{position: relative;padding-right: 100px;} .ipro-bd .hd{position: absolute;right:0;height: calc(100% - 180px)} .ipro-bd .hd .btnn{width:140px;height: 60px;position: absolute;bottom:-140px;right:100px;display: flex;flex-direction: row;justify-content: space-between;z-index: 3} .ipro-bd .hd a{width:60px;height: 60px;border-radius: 50%;border:solid 1px #fff;display: block;text-align: center;line-height: 60px;cursor: pointer;} .ipro-bd .hd a i{color:#fff;font-size: 30px;font-weight:lighter;} .ipro-bd .hd a:hover{background: #fff;border-color:var(--zhu-color);} .ipro-bd .hd a:hover i{color:var(--zhu-color);} .ipro-bd .hd ul{overflow: hidden;display: flex;flex-direction: column;justify-content: center;height: 100%} .ipro-bd .hd ul li{width:90px;height: 90px;display: flex;flex-direction: column;border-radius: 50%;background:#acdaf4;align-items: center;position: relative;margin:15px 0;justify-content: center;cursor: pointer;} .ipro-bd .hd ul li .icon{color:#333;font-size: 30px;color:#000;line-height: 1} .ipro-bd .hd ul li p{padding:0 15px;font-size: 16px;} .ipro-bd .hd ul li .zhezhao{position: absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align: center;transition: all .5s;border-radius: 50%;background: var(--pei-color);width:0;height: 0;display: flex;flex-direction: column;justify-content: center;align-items: center;} .ipro-bd .hd ul li .zhezhao i{transition: all .5s;color:#fff;opacity: 0;} .ipro-bd .hd ul li:hover .zhezhao,.ipro-bd .hd ul li.on .zhezhao{width:100%;height: 100%;} .ipro-bd .hd ul li:hover .zhezhao i,.ipro-bd .hd ul li.on .zhezhao i{opacity: 1;font-size: 50px;} .ipro-bd .bd ul{} .ipro-bd .hdd{display: flex;flex-direction: row;padding:30px 0;} .ipro-bd .hdd .left{width:55%;} .ipro-bd .hdd .left .t1{position: relative;margin:40px 0;height: 120px; } .ipro-bd .hdd .left .t1 .xuhao{z-index: 1;position: relative;} .ipro-bd .hdd .left .t1 .xuhao:before{content:'';position: absolute;background:var(--zhu-color);animation: xuhao 3s ease-out infinite;border-radius: 50%;} .ipro-bd .hdd .left .t1 .xuhao span{width:96px;height: 96px;line-height: 96px;text-align: center;background: var(--zhu-color);font-size: 48px;font-family: Impact;color:#fff;border-radius: 50%;display: block;position: absolute;top:10px;left:10px;} .ipro-bd .hdd .left .t1 .txt{background: var(--pei-color);padding:15px 90px 18px;color:#fff;border-radius: 50px;position: absolute;left:60px;top:22px;display: flex;flex-direction: row;justify-content: center;align-items: center;line-height: 1} .ipro-bd .hdd .left .t1 .txt .title{font-size: 42px;} .ipro-bd .hdd .left .t1 .txt .enTitle{font-size:24px;text-transform: uppercase;margin-left: 15px;margin-top: 5px} .ipro-bd .hdd .left .t2{line-height: 48px;font-size: 20px;color:#333;padding-left: 30px} .ipro-bd .hdd .left .t2 li{margin-bottom: 15px;} .ipro-bd .hdd .left .t2 li span{position: relative;display: inline-block;} .ipro-bd .hdd .left .t2 li span:after{content:'';background: var(--zhu-color);position: absolute;left:0;bottom:10px;height: 3px;width:90%;} .ipro-bd .hdd .left .more{display: block;width:140px;height: 45px;border-radius: 30px;background: var(--zhu-color);display: flex;flex-direction: row;justify-content: center;align-items: center;margin-left: 30px;margin-top: 60px;transition: all .5s} .ipro-bd .hdd .left .more i{border-radius: 50%;width:26px;height: 26px;border:solid 1px #fff;color:#fff;font-size: 18px;margin-right: 10px;line-height: 24px;text-align: center;transition: all .5s} .ipro-bd .hdd .left .more span{color:#fff;} .ipro-bd .hdd .left .more:hover{width:150px;} .ipro-bd .hdd .left .more:hover i{transform: rotate(-30deg);} .ipro-bd .hdd .right{width:40%;margin:0 2.5%;display: flex;flex-direction: column;align-items: center;justify-content: center;} .ipro-bd .hdd .right .img{border:solid 20px #e8eff3;border-radius: 50%;overflow: hidden;padding-bottom: 92.5%;width:100%;} .ipro-bd .hdd .right .img img{width:100%;height: 100%;object-fit: cover} .ipro-bd .bdd{position: relative;height: 152px;} .ipro-bd .bdd .box{position: absolute;display: flex;flex-direction: row;align-items: center;padding:0 50px;top:0;right:0px;height: 100%;width:700px;z-index: 2} .ipro-bd .bdd .box .xuhao{color:#fff;font-family: Impact;width:85px;text-align: center;border-right:dashed 1px #fff;font-size: 48px;line-height: 1} .ipro-bd .bdd .box .txt{padding:0 30px;color:#fff;} .ipro-bd .bdd .box .txt .t1{font-size: 24px;} .ipro-bd .bdd .box .txt .t2{font-size: 12px;text-transform: uppercase;} @keyframes xuhao{ 0%{width: 96px;height: 96px;left:10px;top:10px;} 50%{width:116px;height: 116px;opacity: 0.3;left:0px;top:0px;} 100%{width: 96px;height: 96px;left:10px;top:10px;} } @keyframes xuhao1{ 0%{width: 60px;height: 60px;left:10px;top:10px;} 50%{width:80px;height: 80px;opacity: 0.3;left:0px;top:0px;} 100%{width: 60px;height: 60px;left:10px;top:10px;} } @media(max-width: 1200px){ .ipro-bd .hdd .left .t1{height: 80px} .ipro-bd .hdd .left .t1 .xuhao span{width:60px;height: 60px;line-height: 60px;font-size: 30px;} .ipro-bd .hdd .left .t1 .xuhao:before{animation: xuhao1 3s ease-out infinite;} .ipro-bd .hdd .left .t1 .txt{padding:8px 50px;} .ipro-bd .hdd .left .t1 .txt .title{font-size: 24px;} .ipro-bd .hdd .left .t1 .txt .enTitle{font-size: 20px} .ipro-bd .hdd .left .t2{font-size: 16px;line-height: 32px} .ipro-bd .hdd .left .t2 li span:after{bottom:0;} .ipro-bd .bdd,.ipro-md{height: 120px} .ipro-bd .hd .btnn{bottom:-150px;} } @media(max-width: 992px){ .ipro-bd .hd .btnn{display: none;} .ipro-bd{padding-right: 0} .ipro-bd .bdd, .ipro-md{display: none;} .ipro-bd{display: flex;flex-direction: column;width:100%;} .ipro-bd .hd{width:100%;height: auto;padding:30px 0;position: initial} .ipro-bd .hd ul{display: flex;flex-direction: row;justify-content: center} .ipro-bd .hd ul li{margin:0 10px;} .ipro-bd .hdd .left .t1{margin:0 0 40px;} .ipro-bd .hdd{padding:0 15px 30px;} } @media(max-width: 768px){ .ipro-bd .hdd{flex-direction: column;} .ipro-bd .hdd .left{width:100%;} .ipro-bd .hdd .right{width:50%;margin-top: 45px;} } @media(max-width: 576px){ .ipro-bd .hd ul li{width:70px;height: 70px} .ipro-bd .hd ul li .icon{font-size: 20px} .ipro-bd .hd ul li p{font-size: 12px;} .ipro-bd .hd ul li:hover .zhezhao i, .ipro-bd .hd ul li.on .zhezhao i{font-size: 30px} .ipro-bd .hdd .right{width:90%;margin: 30px auto 0;} .ipro-bd .hdd .left .t1 .txt .enTitle{display: none;} .ipro-bd .hdd .left .t2{padding-left: 15px;} .ipro-bd .hdd .right .img{padding-bottom: 85%} } /*iadv*/ .iadv-hd{padding:65px 0;} .iadv-hd b{font-weight: normal;} .iadv-md{display: flex;flex-direction: row;justify-content: space-between;} .iadv-md li{border-right:solid 1px #cfcccc;width:25%;text-align: center;} .iadv-md li:nth-child(4){border:none;} .iadv-md li .hd{line-height: 1} .iadv-md li .hd b{font-family: Arial;font-size: 72px;position: relative;} .iadv-md li .hd b:before{content:'';top:5px;left:-5px;width:30px;height: 30px;background: #087ac6;border-radius: 50%;position: absolute;z-index: -1;} .iadv-md li .hd span{font-size: 18px;} .iadv-md li .bd{font-size: 24px;line-height: 30px;} .iadv-bd{margin-top: 50px} .bigbox .swiper-slide img{width:100%;height:100%;object-fit: cover} .bigbox .swiper-slide{width:100%;height: 800px;object-fit: cover} .bigbox .swiper-slide .wrapp{top:-100%;height: 100%;} .bigbox .swiper-slide .wrapp .box{width:724px;height: 198px;background: var(--pei-color);overflow: hidden;border-top-left-radius: 50px;border-bottom-right-radius: 50px;position: absolute;top:240px;right:-100%;display: flex;flex-direction: row;transition: all 1s} .bigbox .swiper-slide-active .wrapp .box{right:10px;} .bigbox .swiper-slide .wrapp .box .left{width:200px;height: 100%;display: flex;flex-direction: column;justify-content: center;background: #fff;align-items: center;} .bigbox .swiper-slide .wrapp .box .left i{font-size: 50px;color:var(--pei-color);} .bigbox .swiper-slide .wrapp .box .left p{font-size:34px;color:#333333;} .bigbox .swiper-slide .wrapp .box .right{width:calc(100% - 200px);padding:40px 30px;line-height: 38px;color:#fff;font-size: 18px;} .iadv-bd .wrap{margin-top: -130px;} .smallbox{border-radius: 20px;height: 198px;overflow: hidden;} .smallbox .swiper-slide{display:flex;flex-direction: column;justify-content: center;align-items: center;width:25%;border-right:solid 1px #50a1d7;height: 100%;background: var(--zhu-color);color:#fff;cursor: pointer;} .smallbox .swiper-slide:nth-child(4){border-right:none;} .smallbox .swiper-slide span{position: relative;} .smallbox .swiper-slide span:before{content:'';position: absolute;width:20px;height: 20px;border-radius: 50%;background: var(--pei-color);top:20px;left:-5px;z-index: -1} .smallbox .swiper-slide:nth-child(1) span:before{top:10px;left:-10px;} .smallbox .swiper-slide:nth-child(2) span:before{top:15px;left:10px;} .smallbox .swiper-slide:nth-child(4) span:before{left:0px;} .smallbox .swiper-slide span i{font-size: 60px;} .smallbox .swiper-slide .t1{font-size: 30px;} .smallbox .swiper-slide .t2{text-transform: uppercase;} .smallbox .swiper-slide-thumb-active{background: #fff;color:var(--zhu-color);} .smallbox .swiper-slide-thumb-active .t1,.smallbox .swiper-slide-thumb-active .t2{color:#333;} @media(max-width: 992px){ .bigbox .swiper-slide{height: 600px} .bigbox .swiper-slide .wrapp .box{top:100px;width:470px;height: 120px;} .bigbox .swiper-slide .wrapp .box .left{width:120px;} .bigbox .swiper-slide .wrapp .box .left i{font-size: 40px;} .bigbox .swiper-slide .wrapp .box .left p{font-size: 24px} .bigbox .swiper-slide .wrapp .box .right{width:calc(100% - 120px);padding:15px;line-height: 28px;font-size: 14px} .smallbox{height: 150px} .smallbox .swiper-slide span i{font-size: 40px;} .smallbox .swiper-slide .t1{font-size: 22px;} .smallbox .swiper-slide .t2{font-size: 12px;} } @media(max-width: 768px){ .iadv-md{flex-wrap: wrap;} .iadv-md li{width:50%;border-bottom: solid 1px #cfcccc;padding:30px 0;} .iadv-md li:nth-child(2){border-right:none;} .iadv-md li:nth-child(3){border-bottom:none;} } @media(max-width: 576px){ .iadv-md li{padding:15px 0;} .iadv-md li .hd b{font-size: 40px} .iadv-md li .hd b:before{width:15px;height: 15px;} .iadv-md li .hd span{font-size: 16px;} .iadv-md li .bd{font-size: 14px;} .bigbox .swiper-slide{height: 300px;} .bigbox .swiper-slide .wrapp .box{width:240px;top:45px;height: auto} .bigbox .swiper-slide .wrapp .box .left{width:80px;height:auto} .bigbox .swiper-slide .wrapp .box .left i{font-size: 20px;} .bigbox .swiper-slide .wrapp .box .left p{font-size: 16px;} .bigbox .swiper-slide .wrapp .box .right{width:calc(100% - 80px);font-size: 12px;line-height: 20px;padding:10px;} .iadv-bd .wrap{margin-top: -80px} .smallbox{height: auto;} .smallbox .swiper-slide{padding:10px 0;} .smallbox .swiper-slide span i{font-size: 20px} .smallbox .swiper-slide span:before{display: none;} .smallbox .swiper-slide .t1{font-size: 14px;} .smallbox .swiper-slide .t2{display: none;} } /*inews*/ .inews{margin-top: 45px;} .inews-hd{padding:30px 0;} .inews-bd{padding:15px 0;overflow: hidden;} .inews-bd .item{border:solid 1px #eee;display: block;transition: all .5s;border-radius: 2px;} .inews-bd .item .img{padding-bottom: 65%;} .inews-bd .item .img img{transition: all .5s} .inews-bd .item .txt{padding:15px 15px 30px;} .inews-bd .item .txt .t1{font-size: 18px;color:#333333;margin:10px 0;transition: all .5s} .inews-bd .item .txt .t2{font-size: 14px;color:#999999;line-height: 24px;-webkit-line-clamp:2;} .inews-bd .item .txt .date{display: flex;flex-direction: row;justify-content: space-between;margin-top: 20px;align-items: center;} .inews-bd .item .txt .date .lt{font-size: 18px;color:#999999;} .inews-bd .item .txt .date .rt{width:110px;height: 36px;text-align: center;line-height: 36px;color:#fff;display: flex;flex-direction: row;align-items: center;justify-content: center;border-top-left-radius: 20px;border-bottom-right-radius:20px;background: var(--zhu-color);transition: all .5s} .inews-bd .item .txt .date .rt span{margin-right: 5px;} .inews-bd .item:hover{border:solid 1px #fff;box-shadow:0 0 10px #999} .inews-bd .item:hover .img img{transform: scale(1.15,1.15) rotate(5deg);} .inews-bd .item:hover .t1{color:var(--zhu-color);padding-left: 15px;} .inews-bd .item:hover .txt .date .rt{background: var(--pei-color);} .inews-bd .pagination{margin:45px auto;display: block;text-align: center;} .inews-bd .pagination span{width:12px;height: 12px} @media(max-width: 576px){ .inews-bd .item{margin:0 10px;} } /*footer*/ .footer{background: url(../images/f-bg.jpg) top center no-repeat;position: relative;background-size: auto 100%} .f-hd{display: flex;flex-direction: row;justify-content: space-between;} .f-nav{width:calc(100% - 500px);display: flex;flex-direction: row;justify-content: space-between;padding:30px 15px;} .f-nav .item{width:20%;} .f-nav .item .yiji{color:#fff;display:block;position: relative;font-size: 18px;padding-left: 20px;} .f-nav .item .yiji:before{position: absolute;width:5px;height: 5px;background: #fff;border-radius: 50%;content:'';left:0;top:10px;} .f-nav .item ul{padding:45px 15px;flex-direction: column;display: flex;width:100%;} .f-nav .item ul a{font-size: 14px;color:#fff;opacity: 50%;margin-bottom: 15px;} .f-nav .item ul a:hover{opacity: 1} .f-con{width:500px;display: flex;flex-direction: column;align-items: center;} .f-con .hd{color:#fff;font-size: 26px;padding:20px 0;text-align: center;} .f-con .hd i{font-size: 30px;line-height: 1} .f-con .bd{padding:30px 0;text-align: center;color:#fff;} .f-con .bd img{width:140px;} .f-con .bd p{padding:10px 0;} .footer .line{width:100%;height: 1px;background: #3f413f;position: absolute;top:78px;} .f-bd{border-top:solid 1px #3f413f;padding:25px 15px;} .f-bd .wrap{display:flex;flex-direction: row;justify-content: space-between;} .f-logo{margin-right: 15px;} .f-bd .left{display: flex;flex-direction: row;align-items: center;color:rgba(255,255,255,0.6);width:60%} .f-bd .left a{color:rgba(255,255,255,0.6);} .f-bd .left a:hover{color:rgba(255,255,255,1);} .f-bd .left a.msg{width:140px;height: 30px;background: var(--pei-color);color:#fff;display: flex;flex-direction: row;justify-content: center;line-height: 30px;transition: all .5s} .f-bd .left a.msg span{margin-right: 10px;} .f-bd .left a.msg i{font-size: 20px} .f-bd .left a.msg:hover{border-radius: 10px;} .f-bd .right{text-align: right;color:#fff;display: flex;flex-direction: row;justify-content: flex-end;align-items: center;width:40%;} .f-bd .right a{color:#fff;} .f-bd .right a:hover{color:var(--pei-color);} @media(max-width: 1400px){ .f-con{width:300px;} .f-nav{width:calc(100% - 330px);} } @media(max-width: 1200px){ .f-con{width:300px;} .f-nav{width:calc(100% - 330px);} .f-bd .left{width:100%;} .f-bd .right{display: none;} } @media(max-width: 992px){ .footer{background-size: auto 100%} .f-con{display: none;} .f-nav{width:100%;} } @media(max-width: 768px){ .f-con{display: block;width:100%;} .f-nav{display: none;} .f-bd .wrap{flex-wrap: wrap;} .f-bd .left{flex-direction: column;} } /*position*/ .l-banner{width:100%; } .l-banner img{height: 100%;width:100%;object-fit: cover;} @media(max-width: 1600px){ .l-banner{height: 500px;} } @media(max-width: 1400px){ .l-banner{height:500px;} } @media(max-width: 1200px){ .l-banner{height: 450px;} } @media(max-width: 992px){ .l-banner{height: 350px;} } @media(max-width: 576px){ .l-banner{height: 250px} } /*position*/ .position{margin-top: -80px;background: rgba(0,0,0,0.6);height: 80px;width:100%;position: relative;z-index: 1} .position .wrapp{display: flex;flex-direction:row;justify-content: space-between;} .position .left{height: 100%;background: var(--zhu-color);position: relative;line-height: 79px;color:#fff;font-size: 16px;border-top-right-radius: 50px;padding:0 50px 0 10px;height: 80px;} .position .left a{color:#fff;transition: all .5s} .position .left i{font-size: 20px;} .position .left a:hover{color:var(--pei-color);} .position .left:before{position: absolute;content:'';height: 80px;width:100px;left:-100px;background: var(--zhu-color);} .position .right{display: flex;flex-direction: row;justify-content: flex-end;flex-wrap:wrap;align-items: center;} .position .right a{display: inline-block;color:#fff;font-size: 16px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;margin:0 30px;transition: all .5s} .position .right a i{font-size: 20px;margin-right: 5px} .position .right a:hover{color:var(--pei-color);} @media(max-width: 1200px){ .position .right a{margin:0 15px;} } @media(max-width: 992px){ .position{height:auto;margin-top:0;} .position .left{display: none;} .position .right{padding:15px 0;justify-content: flex-start;} } @media(max-width: 576px){ .position .right{padding:3px 0;} .position .right a{margin:5px 8px;font-size: 14px;} .position .right a i{line-height: 1;font-size: 15px;} } /*l-title*/ .l-title{font-size: 42px;color:#333333;position: relative;text-align: center;padding-bottom:15px;} .l-title:after{content:'';position: absolute;width:56px;height: 3px;background: var(--pei-color);left:50%;transform: translateX(-50%);bottom:0;} @media(max-width: 576px){ .l-title{font-size: 30px;} } /*com-part1*/ .com-part1{padding:45px 50px 100px;background: url(../images/com-part1-bg.jpg) center bottom no-repeat;background-size: auto 100%} .com-part1-txt{font-size: 16px;color:#333333;line-height: 42px;-webkit-line-clamp:6;margin-top: 30px;} .com-part1-txt2{font-size: 16px;line-height:42px;display: none;margin-top: 30px;} .com-part1-more{width:60%;height: 50px;line-height: 48px;text-align: center;background: #f9f9f9;border-radius: 5px;color:#333;font-size: 16px;margin:30px auto;cursor: pointer;max-width: 360px;transition: all .5s} .com-part1-more i{display:inline-block;} .com-part1-more:hover{background: var(--zhu-color);color:#fff;} .com-part1-more.on i{transform: rotate(180deg);} .com-part1-plist{margin:45px -15px 45px;width:calc(100% + 30px);overflow: hidden;padding:15px;} .com-part1-plist a{display: block;border-radius: 3px;position: relative;overflow: hidden;transition: all .5s} .com-part1-plist a .img{padding-bottom: 60.5%;} .com-part1-plist a .zhezhao{position: absolute;left:-100%;bottom:0;background: rgba(0,0,0,0.6);padding:10px 30px;color:#fff;transition: all .5s} .com-part1-plist a:hover{box-shadow: 0 0 15px #999} .com-part1-plist a:hover .zhezhao{left:0;} @media(max-width: 992px){ .com-part1-plist{margin:45px -15px;padding:15px 90px;} } @media(max-width: 768px){ .com-part1-plist{margin:30px -15px;padding:15px 90px;} } @media(max-width: 576px){ .com-part1{padding:30px 10px;} .com-part1-txt{font-size: 14px;line-height: 30px;} .com-part1-txt2{font-size: 14px;line-height: 30px;} .com-part1-plist{padding:15px 30px;width:100%;margin:30px 0;} } /*发展历程*/ .com-part2{background: url(../images/com-part2-bg.jpg) center no-repeat;background-attachment: fixed;padding-bottom: 90px} .com-part2-hd{color:#fff;padding:45px 0 15px;} .com-part2-md{overflow: hidden;margin-top: 110px;position:relative;} .com-part2-md .swiper-slide{background: url(../images/com-part2-icon.png) center bottom no-repeat;text-align: center;height: 70px;padding-top: 10px;cursor: pointer;transition: all .5s} .com-part2-md .swiper-slide b{font-size: 20px;color:#fff;font-weight: bold;transition: all .5s} .com-part2-md .line{background: url(../images/com-part2-line.png) repeat-x;height: 8px;position: absolute;left:0;top:50px;width:100%;} .com-part2-md .swiper-slide-active{padding-top: 0} .com-part2-md .swiper-slide-active b{font-size:30px} .com-part2-md .swiper-slide:hover{padding-top: 0} .com-part2-md .swiper-slide:hover b{font-size: 30px;} .com-part2-bd{width:70%;margin:60px auto;color:#fff;font-size: 30px;overflow: hidden;padding:0 30px;} .com-part2-bd .txt{text-align: center;cursor: pointer;} .com-part2 .btnn{position: relative;left:50%;top:-180px;width:90%;transform: translateX(-50%);} .com-part2 .btnn>div{width:40px;height: 40px;text-align: center;line-height: 40px;color:#fff;border:solid 1px #fff;border-radius: 50%;position: absolute;transition: all .5s} .com-part2 .btnn i{font-size: 24px;} .com-part2 .btnn .prev{left:0;top:30px;} .com-part2 .btnn .next{right:0;top:30px;} .com-part2 .btnn>div:hover{color:var(--pei-color);border-color:var(--pei-color);} @media(max-width: 576px){ .com-part2{padding-bottom: 30px;} .com-part2-md{margin-top: 50px} .com-part2-bd{width:80%;padding:0 15px;} .com-part2 .btnn{width:96%;top:-180px;} .com-part2-bd .txt{font-size: 14px;line-height: 26px;-webkit-line-clamp:5;} .com-part2 .btnn>div{width:30px;height: 30px;line-height: 30px;} .com-part2 .btnn i{font-size: 16px} } /*com-part3*/ .com-part3-hd{margin:45px 0;overflow:hidden;} .com-part3-bd{padding-bottom: 60px;} .com-part3-bd .hd{display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap;} .com-part3-bd li{width:24%;text-align: center;transition: all .5s;padding-bottom: 30px;} .com-part3-bd li .img{padding-bottom: 60.5%;} .com-part3-bd li .img img{transition: all .5s} .com-part3-bd li .t1{font-weight: bold;color:#333333;font-size: 24px;padding:18px 0;} .com-part3-bd li .t2{font-size: 16px;color:#333333;} .com-part3-bd li:hover,.com-part3-bd li.on{box-shadow: 0 0 10px #999;} .com-part3-bd li:hover .img img,.com-part3-bd li.on .img img{transform: scale(1.02,1.02)} @media(max-width: 768px){ .com-part3-bd li{width:48%;margin-bottom: 30px} } @media(max-width: 576px){ .com-part3-bd li{width:98%;margin:0 1% 30px;} } /*com-part4*/ .com-part4{background: url(../images/com-part4-bg.jpg) top center no-repeat;padding-bottom:45px;background-size: auto 100%} .com-part4-hd{margin:45px 0;} .com-part4-bd{background: rgba(255,255,255,0.5);overflow: hidden;padding:0 35px;} .com-part4-bd .hd{padding:30px 0;display: flex;flex-direction: row;} .com-part4-bd .hd .left{width:250px;} .com-part4-bd .hd .right{width:calc(100% - 250px);padding:0 30px;border-left:solid 1px #dcdedc;font-size: 16px;line-height: 30px;color:#999999;} .com-part4-bd .bd{padding:15px 0 30px;text-align: center;overflow: hidden;} .com-part4-bd .bd a{display: block;border:solid 1px #e5e6e5;padding:15px;transition: all .5s;border-radius: 2px} .com-part4-bd .bd a p{color:#666666;font-size: 16px;padding:10px 10px 0;transition: all .5s} .com-part4-bd .bd a:hover,.com-part4-bd .bd .swiper-slide-active a{border-color:var(--zhu-color);} .com-part4-bd .bd a:hover p,.com-part4-bd .bd .swiper-slide-active a p{color:var(--zhu-color);} .com-part4 .pagination{display: block;text-align: center;margin-top: 30px;} .com-part4 .pagination span{width:12px;height: 12px;} @media(max-width: 768px){ .com-part4-bd{padding:0 15px;} .com-part4-bd .hd{flex-direction: column;} .com-part4-bd .hd .left img{height: 45px} .com-part4-bd .hd .right{width:100%;border:none;margin-top: 15px;padding:0;font-size: 14px;line-height: 24px} .com-part4-bd .bd{padding:0 45px;} .com-part4-bd .bd a p{font-size: 14px;} } /*主营业务*/ .imgbg{ width: 100%; height: 100%; transition: ease 1s; background-position: center; background-repeat: no-repeat; background-size: cover;} .imgbg{ width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; transition: ease 1s;} .project_swiper{ width: 100%; position: relative; margin-top: 20px; } .project_info{ height: auto; padding: 20px 10px; padding-bottom: 70px;} .project_swiper li{ padding: 10%;} .project_swiper li .hd{display: flex;flex-direction: row;color:#fff;} .project_swiper li .hd i{width:80px;font-size: 60px;line-height: 1.2} .project_swiper li .hd .txt{width:calc(100% - 80px);} .project_swiper li .hd .txt .t1{font-size: 30px;font-weight: bold;} .project_swiper li .hd .txt .t2{font-size:12px;text-transform: uppercase;opacity: 0.6} .project_swiper li .desc{margin: 15px 0;font-size: 16px;line-height: 30px;} .project_btnbox{ height: 40px; line-height: 40px;} .project_tab{ width: 100%;} .project_tab li{ height: 50px; line-height: 50px; font-size: 12px; font-weight: bold;} .project_tab li a{ color: #fff;display:block;padding:0 10px;width:100%;} .project_hd span{ margin: 0 20px !important; background: none !important;} .project_hd span:nth-child(2)::after{ width: 40px; left: -40px;} .project_hd .swiper-pagination-bullet{ opacity: 0.7;} .project_tab{ transform: translate(0) scale(1,1)!important; opacity: 1;} .project_swiper{transform: perspective(600px) rotate(0); left: 0;} .project_page{ padding: 8.333vw; box-sizing: border-box;} .project_page{ padding: 50px 0;} .project_page img{ transition: ease 1s; } .project_page img:hover{ margin-left: 10px;} .project_info{ height: 100vh; overflow: hidden; position: relative;padding: 6.25vw 8.33333vw; box-sizing: border-box;} .project_bg{ width: 100%; height: 100%; position: absolute; left: 0; top: 0;} .project_bg li{width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition: ease 1s; transform: scale(1.1); opacity: 0;} .project_bg li.on{ transform: scale(1,1); opacity: 1;} .project_swiper{ width: 37.5%; overflow: hidden; background: rgba(0,0,0,0.4); background-size: cover; position: absolute; left: 0; bottom: 0;transition: cubic-bezier(0.215,.61,.355,1) 2s; } /* .project_info.swiper-slide-active .project_swiper{transform: perspective(600px) rotate(0);} */ .project_info.swiper-slide-active .project_swiper{left: 0;} .project_swiper li .desc{ margin: 45px 0;color: #fff;line-height: 30px; } .project_swiper li dl{margin-bottom: 0} .project_swiper li dl dd{ height: 42px; line-height: 42px; background: var(--zhu-color); width: 155px; text-align: center; border-top-left-radius: 30px;border-bottom-right-radius: 30px;cursor: pointer;transition: all .5s} .project_swiper li dl dd a{ color: #fff;width:100%;height: 100%;display: block;} .project_swiper li dl dd:nth-of-type(2){ background: var(--pei-color); margin-left: 20px;} .project_swiper li dl dd:hover{border-radius: 30px;} .project_btnbox{ width: 100%; height: 6.25vw; background: #2f3035; display: flex; align-items: center; justify-content: center;border-top:solid 1px rgba(255,255,255,.3);} .project_hd{ margin: 0 4vw !important; height: 20px; display: flex; align-items: center; width: auto !important;} .project_hd span{ display: inline-block; width: 30px; text-align: center; height: 20px; line-height: 20px; position: relative; margin: 0 2vw !important; } .project_hd span::before{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); color: #777777; z-index: 1;} .project_hd span:nth-child(1)::before{ content: "01";} .project_hd span:nth-child(2)::before{ content: "02";} .project_hd span:nth-child(3)::before{ content: "03";} .project_hd span:nth-child(4)::before{ content: "04";} .project_hd span:nth-child(2)::after,.project_hd span:nth-child(3)::after,.project_hd span:nth-child(4)::after{ content: ""; z-index: 1; display: block;width: 4vw;height: 1px;background: #FFFFFF; position: absolute; left: -4vw; top: 50%; transform: translateY(-50%); } .project_swiper .btn{ color: #fff; cursor: pointer; outline: none; margin-top: -2px; box-shadow: none !important;width:100%;} .project_swiper .btn:hover{ color: var(--pei-color);} .project_hd span.swiper-pagination-bullet-active::before{ color: #fff;} .project_tab{ width: 62.5%; position: absolute; right: 0;bottom: 0; z-index: 1; border-top: 1px solid rgba(255,255,255,.3); transform: translateX(100%); opacity: 0; transition: ease 2s;} .project_tab li{ width: 25%; overflow: hidden; float: left; z-index: 1; cursor: pointer; transition: ease 1s; position: relative; height: 6.15vw; line-height: 6.15vw; text-align: center; color: #fff; font-size: 18px;} .project_tab li::before{ content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0;background: var(--pei-color); transition: ease 1s; transform: translateX(-100%); opacity: 0; z-index: -1;} .project_tab li em{font-family: Gotham;} .project_tab li.active::before{ transform: translateX(0); opacity: 1;} .project_info .project_tab{ transform: translateX(0); opacity: 1;} @media screen and (max-width:1440px){ .project_hd{margin:0 3vw!important;} .project_swiper li{padding:30px 15px;} .project_swiper li dl dd{ width: 35%;} .project_tab li a{font-size: 15px} } @media screen and (max-width:1200px){ .project_swiper li .hd i{font-size: 50px;width:60px;line-height: 1} .project_swiper li .hd .txt{width:calc(100% - 55px);} .project_swiper li .hd .txt .t1{font-size: 22px} .project_swiper li .desc{ font-size: 14px;} .project_tab li{ font-size: 16px;} .project_tab li a{font-size: 14px} .project_swiper .btn{display: none;} } @media screen and (max-width:991px){ .project_swiper{ width: 90%; bottom: 10%; left: 5%;} .project_tab{ width: 100%;} .project_swiper li{ padding: 5%;} .project_btnbox{ height: 10vw;} .project_tab li{ height: 8vw; line-height: 8vw; font-size: 14px;} } @media screen and (max-width:768px){ .project_tab li{ height: 13vw; line-height: 13vw;} .project_swiper li .desc{ font-size: 12px;} } @media(max-width: 576px){ .project_swiper{bottom:15%;} .project_swiper li .desc{margin:15px 0;line-height: 24px} .project_swiper li dl dd{width:45%;} .project_swiper li .hd i{font-size: 40px;width:50px;line-height: 1} .project_swiper li .hd .txt{width:calc(100% - 45px);} .project_swiper li .hd .txt .t1{font-size:18px} .project_tab li{width:50%;} } /*proinfo*/ .proinfo{overflow: hidden;display: flex;flex-direction: row;margin-top: 90px;height: calc(100vh - 90px)} .proinfo-left{width:50%;padding:5vw;position: relative;overflow: hidden;} .proinfo-left .img{padding-bottom: 100%} .proinfo-left .bg{width:100%;background:url(../images/proinfo-bg.png) top center no-repeat;position: absolute;top:0;left:0; height: 100%;z-index: 1;background-size: 100% auto;} .proinfo-left .goods-title{color:#fff;font-size: 26px;position: absolute;bottom:7vw;left:0;text-align: center;z-index: 1;width:100%;padding:0 10px 0 40px;} .proinfo-left .goods-title .t2{text-transform: uppercase;font-size: 20px;font-weight: lighter;} .proinfo-left .btnn{position: absolute;top:40%;z-index: 1;display: flex;flex-direction: row;justify-content: space-between;width:81%;left:12%;} .proinfo-left .btnn>div{width:60px;height: 60px;border-radius: 5px;background: var(--pei-color);color:#fff;text-align: center;line-height: 60px;transition: all .5s;cursor: pointer;} .proinfo-left .btnn>div i{font-size: 30px;} .proinfo-left .btnn>div:hover{background:var(--zhu-color);} .proinfo-right{width:50%;background: url(../images/proinfo-bg2.jpg) center no-repeat;} .proinfo-right .box{width:100%;height: 100%;background: rgba(255,255,255,.65);padding:45px 45px;} .proinfo-right .t1{position: relative;margin:30px 0;height: 120px; } .proinfo-right .t1 .xuhao{z-index: 1;position: relative;} .proinfo-right .t1 .xuhao:before{content:'';position: absolute;background:var(--zhu-color);animation: xuhao 3s ease-out infinite;border-radius: 50%;} .proinfo-right .t1 .xuhao span{width:96px;height: 96px;line-height: 96px;text-align: center;background: var(--zhu-color);font-family: Impact;color:#fff;border-radius: 50%;display: block;position: absolute;top:10px;left:10px;} .proinfo-right .t1 .xuhao span i{font-size: 60px;margin-left:5px;} .proinfo-right .t1 .txt{background: var(--pei-color);padding:15px 90px 18px;color:#fff;border-radius: 50px;position: absolute;left:60px;top:22px;display: flex;flex-direction: row;justify-content: center;align-items: center;line-height: 1} .proinfo-right .t1 .txt .title{font-size: 42px;} .proinfo-right .t1 .txt .enTitle{font-size:24px;text-transform: uppercase;margin-left:15px;} .proinfo-right .t2{margin:30px 0;} .proinfo-right .t2 li{display: flex;flex-direction: column;margin-top: 20px} .proinfo-right .t2 li span{font-size: 24px;color:#282828;font-weight: bold;} .proinfo-right .t2 li p{font-size:18px;color:#333333;line-height: 36px;margin-top: 15px;} .proinfo-right .t3{border-top:solid 1px var(--zhu-color);padding:20px 0;width:100%;display: flex;flex-direction: row;justify-content: space-around;border-bottom:solid 1px var(--zhu-color);} .proinfo-right .t3 li{display: flex;flex-direction: column;align-items: center;width:20%;} .proinfo-right .t3 li span{width:80px;height: 80px;border-radius: 50%;text-align: center;line-height: 80px;border:solid 1px var(--zhu-color);display: block;} .proinfo-right .t3 li span i{font-size: 40px;color:var(--zhu-color);line-height: 1.8} .proinfo-right .t3 li:nth-child(2) span i{font-size: 50px;line-height: 1.6;} .proinfo-right .t3 li:nth-child(3) span i{font-size: 46px;line-height: 1.6;} .proinfo-right .t3 li p{text-align: center;font-size: 16px;padding:5px 0;} .proinfo-right .t4{display: flex;flex-direction: row;padding:45px 30px;align-items: center;justify-content: space-between;} .proinfo-right .t4 .ptel{width:calc(100% - 200px);display: flex;flex-direction: row;justify-content: space-between;} .proinfo-right .t4 .ptel i{width:70px;height: 70px;background: var(--pei-color);text-align: center;line-height: 70px;font-size: 40px;color:#fff;border-radius: 50%;font-weight: lighter;} .proinfo-right .t4 .txt{width:calc(100% - 80px);padding:5px 0;} .proinfo-right .t4 .txt .tt1{font-size:16px;color:#666666;} .proinfo-right .t4 .txt .tt2{font-size:28px;color:var(--pei-color);line-height: 1} .proinfo-right .t4 .pmsg{width:190px;height: 50px;text-align: center;line-height: 50px;color:#fff;background: var(--pei-color);border-top-left-radius:20px;border-bottom-right-radius: 20px;font-size: 16px;transition: all .5s} .proinfo-right .t4 .pmsg:hover{background: var(--zhu-color);} @media(max-width: 1700px){ .proinfo-left{padding:7vw 0;} .proinfo-left .bg{background-size: auto 100%;} } @media(max-width: 1600px){ .proinfo-left{padding:8vw 0;} .proinfo-left .btnn{width:93%;left:6%;} } @media(max-width: 1400px){ .proinfo-left .btnn{top:90%;width:auto;left:40%;} .proinfo-left .btnn .prev{margin-right: 30px;} .proinfo-left .goods-title{bottom:8vw;} .proinfo-right .t1{height: 80px} .proinfo-right .t1 .xuhao span{width:60px;height: 60px;line-height: 60px;font-size: 30px;} .proinfo-right .t1 .xuhao span i{font-size: 30px;margin-left: 0} .proinfo-right .t1 .xuhao:before{animation: xuhao1 3s ease-out infinite;} .proinfo-right .t1 .txt{padding:10px 70px;top:15px;} .proinfo-right .t1 .txt .title{font-size: 26px} .proinfo-right .t1 .txt .enTitle{font-size: 12px;margin-top: 7px;margin-left:10px;} .proinfo-right .t4{padding:45px 0;} } @media(max-width: 1200px){ .proinfo{height: auto;} .proinfo-right .t1{margin:0;} .proinfo-right .t2 li span{font-size: 20px;} .proinfo-right .t2 li p{font-size: 14px;line-height: 24px} .proinfo-right .t3 li span{width:60px;height: 60px;line-height: 60px;} .proinfo-right .t3 li span i{font-size: 30px} .proinfo-right .t3 li:nth-child(2) span i{font-size: 35px} .proinfo-right .t3 li:nth-child(3) span i{font-size: 35px} .proinfo-right .t3 li p{font-size: 14px;} .proinfo-right .t4{padding:15px 0;} .proinfo-right .t4 .ptel{width:calc(100% - 130px);} .proinfo-right .t4 .ptel i{width:60px;height: 60px;line-height: 60px;font-size: 30px} .proinfo-right .t4 .pmsg{width:120px;} .proinfo-right .t4 .txt .tt2{font-size: 24px} .proinfo-left .btnn>div{width:40px;height: 40px;line-height: 40px;} .proinfo-left .btnn>div i{font-size: 26px} } @media(max-width: 992px){ .proinfo{margin-top: 82px;} .proinfo-right .box{padding:30px;} .proinfo-right .t1 .txt .enTitle{display: none} .proinfo-right .t2{margin:15px 0;} .proinfo-right .t2 li{margin-top: 10px} .proinfo-right .t2 li span{font-size: 18px;} .proinfo-right .t2 li p{margin-top: 5px} .proinfo-right .t3{padding:15px 0;} .proinfo-right .t4 .ptel{width:100%;} .proinfo-right .t4 .pmsg{display: none;} } @media(max-width: 850px){ .proinfo-right .t4{display: none;} } @media(max-width: 768px){ .proinfo{flex-direction: column;margin-top: 45px;} .proinfo-left{width:100%;padding:0;} .proinfo-right{width:100%;margin-top: -100px;z-index: 2} .proinfo-left .goods-title{display: none;} .proinfo-left .btnn{top:40%;width:100%;left:0;} } @media(max-width: 576px){ .proinfo-right{margin-top: -40px;} .proinfo-right .box{padding:30px 15px;} .proinfo-right .t1 .txt{padding:10px 30px;} .proinfo-right .t4{display: block;} } /*proinfo-part1*/ .proinfo1-part1{background: url(../images/proinfo-part1-bg.jpg) top center no-repeat;background-size: 100% 100%;overflow: hidden;margin-top: 90px;} .proinfo1-part1 .wrapp{display: flex;flex-direction: row;justify-content: space-between;} .proinfo1-part1-left{position: relative;width:50%;height: calc(100vh - 90px)} .proinfo1-part1-left .imglist{width:530px;position: absolute;top:50%;left:50%;transform:translate(-50%,-50%);overflow: hidden;border-radius: 50%;border:solid 10px #75b1de;} .proinfo1-part1-left .imglist .swiper-slide{cursor: pointer;width:100%;padding-bottom: 100%;overflow: hidden;position: relative;} .proinfo1-part1-left .imglist .swiper-slide img{width:100%;height: 100%;object-fit: cover;position: absolute;top:0;left:0;} .proinfo1-part1-left .prev,.proinfo1-part1-left .next{width:60px;height: 60px;border-radius: 5px;background: var(--pei-color);color:#fff;text-align: center;line-height: 60px;transition: all .5s;cursor: pointer;position: absolute;top:50%;transform: translateY(-50%);} .proinfo1-part1-left .prev{left:30px;} .proinfo1-part1-left .next{right:30px;} .proinfo1-part1-left .btnn>div i{font-size: 30px;} .proinfo1-part1-left .btnn>div:hover{background:var(--zhu-color);} .proinfo1-part1-right{width:50%;position: relative;} .proinfo1-part1-right .bg{width:150%;background:rgba(255,255,255,0.65);top:0;left:0;position: absolute;height: 100%;z-index: 1} .proinfo1-part1-right .box{width:100%;height: 100%;padding:45px 45px;z-index: 2;position: relative;} .proinfo1-part1-right .t1{position: relative;margin:30px 0;height: 120px; } .proinfo1-part1-right .t1 .xuhao{z-index: 1;position: relative;} .proinfo1-part1-right .t1 .xuhao:before{content:'';position: absolute;background:var(--zhu-color);animation: xuhao 3s ease-out infinite;border-radius: 50%;} .proinfo1-part1-right .t1 .xuhao span{width:96px;height: 96px;line-height: 96px;text-align: center;background: var(--zhu-color);font-family: Impact;color:#fff;border-radius: 50%;display: block;position: absolute;top:10px;left:10px;} .proinfo1-part1-right .t1 .xuhao span i{font-size: 60px;margin-left:5px;} .proinfo1-part1-right .t1 .txt{background: var(--pei-color);padding:15px 90px 18px;color:#fff;border-radius: 50px;position: absolute;left:60px;top:22px;display: flex;flex-direction: row;justify-content: center;align-items: center;line-height: 1} .proinfo1-part1-right .t1 .txt .title{font-size: 42px;} .proinfo1-part1-right .t1 .txt .enTitle{font-size:24px;text-transform: uppercase;margin-left:15px;} .proinfo1-part1-right .t2{margin:30px 0;} .proinfo1-part1-right .t2 li{display: flex;flex-direction: column;margin-top: 20px} .proinfo1-part1-right .t2 li span{font-size: 24px;color:#282828;font-weight: bold;} .proinfo1-part1-right .t2 li p{font-size:18px;color:#333333;line-height: 36px;margin-top: 15px;} .proinfo1-part1-right .t3{border-top:solid 1px var(--zhu-color);padding:20px 0;width:100%;display: flex;flex-direction: row;justify-content: space-around;border-bottom:solid 1px var(--zhu-color);} .proinfo1-part1-right .t3 li{display: flex;flex-direction: column;align-items: center;width:20%;} .proinfo1-part1-right .t3 li span{width:80px;height: 80px;border-radius: 50%;text-align: center;line-height: 80px;border:solid 1px var(--zhu-color);display: block;} .proinfo1-part1-right .t3 li span i{font-size: 40px;color:var(--zhu-color);line-height: 1.8} .proinfo1-part1-right .t3 li:nth-child(2) span i{font-size: 50px;line-height: 1.6;} .proinfo1-part1-right .t3 li:nth-child(3) span i{font-size: 46px;line-height: 1.6;} .proinfo1-part1-right .t3 li p{text-align: center;font-size: 16px;padding:5px 0;} .proinfo1-part1-right .t4{display: flex;flex-direction: row;padding:45px 30px;align-items: center;justify-content: space-between;} .proinfo1-part1-right .t4 .ptel{width:calc(100% - 200px);display: flex;flex-direction: row;justify-content: space-between;} .proinfo1-part1-right .t4 .ptel i{width:70px;height: 70px;background: var(--pei-color);text-align: center;line-height: 70px;font-size: 40px;color:#fff;border-radius: 50%;font-weight: lighter;} .proinfo1-part1-right .t4 .txt{width:calc(100% - 80px);padding:5px 0;} .proinfo1-part1-right .t4 .txt .tt1{font-size:16px;color:#666666;} .proinfo1-part1-right .t4 .txt .tt2{font-size:28px;color:var(--pei-color);line-height: 1;font-weight: bold;} .proinfo1-part1-right .t4 .pmsg{width:190px;height: 50px;text-align: center;line-height: 50px;color:#fff;background: var(--pei-color);border-top-left-radius:20px;border-bottom-right-radius: 20px;font-size: 16px;transition: all .5s} .proinfo1-part1-right .t4 .pmsg:hover{background: var(--zhu-color);} @media(max-width: 1500px){ .proinfo1-part1-left{width:45%;} .proinfo1-part1-right{width:55%;} } @media(max-width: 1400px){ .proinfo1-part1-left .prev,.proinfo1-part1-left .next{bottom:30px;transform: translateY(0);top:auto;} .proinfo1-part1-left .prev{left:30%;} .proinfo1-part1-left .next{right:30%;} .proinfo1-part1-right .enTitle{display: none;} .proinfo1-part1-right .t4{padding:30px 0;} } @media(max-width: 1200px){ .proinfo1-part1-left{width:460px;height: auto} .proinfo1-part1-left .imglist{width:400px} .proinfo1-part1-right{width:calc(100% - 460px);} .proinfo1-part1-right .t1{height: 80px} .proinfo1-part1-right .t1 .xuhao span{width:60px;height: 60px;line-height: 60px;font-size: 30px;} .proinfo1-part1-right .t1 .xuhao span i{font-size: 30px;margin-left: 0} .proinfo1-part1-right .t1 .xuhao:before{animation: xuhao1 3s ease-out infinite;} .proinfo1-part1-right .t1 .txt{padding:10px 70px;top:15px;} .proinfo1-part1-right .t1 .txt .title{font-size: 26px} .proinfo1-part1-right .t4{padding:45px 0;} .proinfo1-part1-right .t1{margin:0;} .proinfo1-part1-right .t2 li span{font-size: 20px;} .proinfo1-part1-right .t2 li p{font-size: 14px;line-height: 24px} .proinfo1-part1-right .t3 li span{width:60px;height: 60px;line-height: 60px;} .proinfo1-part1-right .t3 li span i{font-size: 30px} .proinfo1-part1-right .t3 li:nth-child(2) span i{font-size: 35px} .proinfo1-part1-right .t3 li:nth-child(3) span i{font-size: 35px} .proinfo1-part1-right .t3 li p{font-size: 14px;} .proinfo1-part1-right .t4{padding:15px 0;} .proinfo1-part1-right .t4 .ptel{width:calc(100% - 130px);} .proinfo1-part1-right .t4 .ptel i{width:60px;height: 60px;line-height: 60px;font-size: 30px} .proinfo1-part1-right .t4 .pmsg{width:120px;} .proinfo1-part1-right .t4 .txt .tt2{font-size: 24px} } @media(max-width: 992px){ .proinfo1-part1{margin-top:82px;background: none;} .proinfo1-part1 .wrapp{flex-direction:column;} .proinfo1-part1-left{width:100%;height: 500px;background: url(../images/proinfo-part1-bg.jpg) center left no-repeat;} .proinfo1-part1-right{width:100%;background: url(../images/proinfo-part1-bg.jpg) center right no-repeat;} .proinfo1-part1-left .prev,.proinfo1-part1-left .next{transform: translateY(-50%);top:50%;} .proinfo1-part1-left .prev{left:30px;} .proinfo1-part1-left .next{right:30px;} } @media(max-width: 576px){ .proinfo1-part1{margin-top: 50px;} .proinfo1-part1-left{height: 380px} .proinfo1-part1-left .imglist{width:calc(100% - 60px);top:40%;} .proinfo1-part1-left .prev,.proinfo1-part1-left .next{bottom:30px;transform: translateY(0);top:auto;width:40px;height: 40px;line-height: 40px} .proinfo1-part1-left .prev{left:30%;} .proinfo1-part1-left .next{right:30%;} .proinfo1-part1-right{background-size: auto 100%} .proinfo1-part1-right .box{padding:30px 15px;} .proinfo1-part1-right .t1 .txt{padding:10px 30px;} .proinfo1-part1-right .t4{flex-direction: column;} .proinfo1-part1-right .t4 .ptel{width:100%;} .proinfo1-part1-right .t4 .pmsg{width:100%;margin-top: 30px} } .proinfo1-part2-hd{box-shadow: 15px 0 15px rgba(25,113,177,0.3);background:#fff;padding:30px 0;} .proinfo1-part2-hd .wrap ul{display: flex;flex-direction: row;flex-wrap: wrap;} .proinfo1-part2-hd .wrap ul a{padding:0 5vw;font-size: 24px;color:#333333;border-right:solid 1px #b4b6ab;line-height: 1} .proinfo1-part2-hd .wrap ul a:nth-child(4){border:none;} .proinfo1-part2-bd{min-height: 300px;} .proinfo1-part2-bd .section{padding-top:40px;} .proinfo1-part2-bd .section .t1{font-size: 30px;color:#333333;font-weight:bold;display: flex;flex-direction: row;align-items: center;} .proinfo1-part2-bd .section .t1:before{content:'';width:36px;height: 26px;background: url(../images/proinfo1-part2-icon.png);margin-right: 15px;display: block;} .proinfo1-part2-bd .section .t1:after{content:'';width:36px;height: 26px;background: url(../images/proinfo1-part2-icon2.png);margin-left: 15px;display: block;} .proinfo1-part2-bd .section .txt{font-size:150%;line-height:200%;width:100%;margin:15px 0; } .proinfo1-part2-bd .tedian{width:100%;background: var(--zhu-color);padding:35px 60px;border-radius: 20px;margin-top: 30px} .proinfo1-part2-bd .tedian li{width:100%;border-bottom:dashed 1px rgba(255,255,255,.3);display: flex;flex-direction: row;padding:15px;justify-content: space-between;} .proinfo1-part2-bd .tedian li .left{position: relative;width:55px;margin-top: 3px} .proinfo1-part2-bd .tedian li .left i{font-size: 30px;color:#fff;position: absolute;left:10px;top:0px;line-height: 1;} .proinfo1-part2-bd .tedian li:nth-child(2) .left i{font-size: 26px;} .proinfo1-part2-bd .tedian li .left:before{content:'';width:22px;height: 22px;background: var(--pei-color);border-radius: 50%;position:absolute;} .proinfo1-part2-bd .tedian li .right{font-size: 24px;font-weight: bold;color:#fff;width:calc(100% - 40px);} .proinfo1-part2-bd .xiangguan{margin: 30px 0 60px;} .proinfo1-part2-bd .xiangguan .swiper-slide{background:#f3f4f4;padding:30px;overflow: hidden;border-radius: 5px;display: flex;flex-direction: row;justify-content: space-between;transition: all .5s} .proinfo1-part2-bd .xiangguan .swiper-slide .left{width:395px;} .proinfo1-part2-bd .xiangguan .swiper-slide .left .img{border-radius: 3px} .proinfo1-part2-bd .xiangguan .swiper-slide .right{width:calc(100% - 420px);} .proinfo1-part2-bd .xiangguan .swiper-slide .right .t3{font-size:30px;font-weight: bold;padding:15px 0;transition: all .5s} .proinfo1-part2-bd .xiangguan .swiper-slide .right .t2{font-size:15px;line-height: 30px;-webkit-line-clamp:5;font-weight: lighter;transition: all .5s;text-indent: 2em} .proinfo1-part2-bd .xiangguan .swiper-slide .right .btnn{display: flex;flex-direction: row;margin-top: 30px;} .proinfo1-part2-bd .xiangguan .swiper-slide .right .btnn a{display: flex;flex-direction: row;color:var(--zhu-color);font-size: 16px;padding-right:1.5vw;height: 25px;align-items: center;border-right:solid 1px rgba(8,122,198,.3);margin-right:1.5vw;transition: all .5s} .proinfo1-part2-bd .xiangguan .swiper-slide .right .btnn a:nth-child(2){border:none;margin-right: 0;padding-right: 0} .proinfo1-part2-bd .xiangguan .swiper-slide .right .btnn a i{font-size:25px;line-height: 1;margin-right: 5px} .proinfo1-part2-bd .xiangguan .swiper-slide:hover,.proinfo1-part2-bd .xiangguan .swiper-slide-active{background: var(--zhu-color);} .proinfo1-part2-bd .xiangguan .swiper-slide:hover .t3,.proinfo1-part2-bd .xiangguan .swiper-slide-active .t3{color:#fff;} .proinfo1-part2-bd .xiangguan .swiper-slide:hover .t2,.proinfo1-part2-bd .xiangguan .swiper-slide-active .t2{color:#fff;opacity: 0.3;} .proinfo1-part2-bd .xiangguan .swiper-slide:hover .right .btnn a,.proinfo1-part2-bd .xiangguan .swiper-slide-active .right .btnn a{color:#fff;border-color:rgba(255,255,255,.3);} .proinfo1-part2-bd .xiangguan .swiper-slide .right .btnn a:hover{color:var(--pei-color);} @media(max-width: 1600px){ .proinfo1-part2-bd .xiangguan .swiper-slide .left{width:350px;} .proinfo1-part2-bd .xiangguan .swiper-slide .right{width:calc(100% - 380px)} .proinfo1-part2-bd .xiangguan .swiper-slide .right .t2{-webkit-line-clamp:4;} .proinfo1-part2-bd .xiangguan .swiper-slide .right .btnn{margin-top: 15px} } @media(max-width: 1400px){ .proinfo1-part2-bd .xiangguan .swiper-slide{padding:20px;} .proinfo1-part2-bd .xiangguan .swiper-slide .left{width:300px;} .proinfo1-part2-bd .xiangguan .swiper-slide .right{width:calc(100% - 320px)} .proinfo1-part2-bd .xiangguan .swiper-slide .right .t3{padding:0;font-size: 26px} .proinfo1-part2-bd .xiangguan .swiper-slide .right .t2{-webkit-line-clamp:4;} .proinfo1-part2-bd .xiangguan .swiper-slide .right .btnn{margin-top: 15px} .proinfo1-part2-bd .xiangguan .swiper-slide .right .btnn a{padding-right:0.8vw;margin-right:0.8vw;} } @media(max-width: 1200px){ .proinfo1-part2-bd .xiangguan .swiper-slide .left{width:200px;} .proinfo1-part2-bd .xiangguan .swiper-slide .right{width:calc(100% - 220px)} .proinfo1-part2-bd .xiangguan .swiper-slide .right .t2{-webkit-line-clamp:2;} } @media(max-width: 992px){ .proinfo1-part2-bd .xiangguan .swiper-slide{flex-direction: column;} .proinfo1-part2-bd .xiangguan .swiper-slide .left{width:100%;} .proinfo1-part2-bd .xiangguan .swiper-slide .right{width:100%;padding-bottom: 15px} .proinfo1-part2-bd .xiangguan .swiper-slide .right .t3{margin-top: 20px} } @media(max-width: 768px){ .proinfo1-part2-hd .wrap ul a{padding:0 3vw;} .proinfo1-part2-bd .tedian{padding:30px;} } @media(max-width: 576px){ .proinfo1-part2-hd{padding:15px 0;} .proinfo1-part2-hd .wrap ul a{padding:0 8vw;margin:3vw 0;} .proinfo1-part2-hd .wrap ul a:nth-child(2){border-right:none;} .proinfo1-part2-bd .tedian li{padding:15px 0;} .proinfo1-part2-bd .tedian li .right{font-size: 18px} .proinfo1-part2-bd .section .txt{font-size: 110%;} .proinfo1-part2-bd .section .t1{font-size: 24px} .proinfo1-part2-bd .xiangguan .swiper-slide{width:100%;margin-bottom: 15px} .proinfo1-part2-bd .xiangguan .swiper-slide .right .btnn a{padding-right:3vw;margin-right:3vw;} } /*news-part1*/ .news-part1{overflow: hidden;} .news-part1-hd{padding:45px 0;} .news-part1-bd{display: flex;flex-direction:row;justify-content: space-between;} .news-part1-bd .left{width:45%;border:solid 1px #eee;padding:15px;} .news-part1-bd .left .img{padding-bottom: 60%} .news-part1-bd .left .img img{transition: all .5s} .news-part1-bd .left a{display: block;width:100%;transition: all .5s} .news-part1-bd .left a .txt{padding:15px;} .news-part1-bd .left a .txt .t1{font-size: 20px;font-weight: bold;color:#333;transition: all .5s} .news-part1-bd .left a .txt .t2{width:100%;display: flex;flex-direction: row;justify-content: space-between;color:#999;font-size:14px;padding:8px 0;} .news-part1-bd .left a .txt .t2 i{font-size:20px;margin-right: 10px;line-height: 1;float: left;} .news-part1-bd .left a .txt .t3{line-height: 30px;font-size: 16px;color:#666;} .news-part1-bd .left:hover{border-color: var(--pei-color);} .news-part1-bd .left:hover a .img img{transform: scale(1.15,1.15) rotate(5deg);} .news-part1-bd .left:hover a .txt .t1{padding-left: 10px;color:var(--zhu-color);} .news-part1-bd .right{width:53%;display: flex;flex-direction: column;justify-content: space-between;} .news-part1-bd .right a{display: block;width:100%;display: flex;flex-direction: row;justify-content: space-between;padding:15px;border:solid 1px #eee;transition: all .5s} .news-part1-bd .right a .lt{width:280px;} .news-part1-bd .right a .lt .img{padding-bottom:62%;} .news-part1-bd .right a .lt .img img{transition: all .5s} .news-part1-bd .right a .rt{width:calc(100% - 300px);} .news-part1-bd .right a .rt .t1{font-size:18px;font-weight: bold;color:#333;transition: all .5s;padding:15px 0 0;} .news-part1-bd .right a .rt .t2{width:100%;display: flex;flex-direction: row;justify-content: space-between;color:#999;font-size:13px;padding:10px 0;} .news-part1-bd .right a .rt .t2 i{font-size:20px;margin-right: 10px;float: left;line-height: 1} .news-part1-bd .right a .rt .t3{line-height: 30px;font-size: 15px;color:#666;-webkit-line-clamp:2;} .news-part1-bd .right a:hover{border-color: var(--pei-color);} .news-part1-bd .right a:hover .lt .img img{transform: scale(1.15,1.15) rotate(5deg);} .news-part1-bd .right a:hover .rt .t1{padding-left: 10px;color:var(--zhu-color);} @media(max-width: 1600px){ .news-part1-bd .left{margin-bottom: 10px} .news-part1-bd .left a .txt .t2{padding:15px 0;} .news-part1-bd .right a{margin-bottom: 10px} .news-part1-bd .right a .lt{width:260px;} .news-part1-bd .right a .rt{width:calc(100% - 280px);} } @media(max-width: 1400px){ .news-part1-bd .left{width:40%} .news-part1-bd .right{width:58%} .news-part1-bd .right a .lt{width:240px;} .news-part1-bd .right a .rt{width:calc(100% - 260px);} } @media(max-width: 1200px){ .news-part1-bd .right a .lt{width:200px;} .news-part1-bd .right a .rt{width:calc(100% - 220px);} .news-part1-bd .right a .rt .t1{padding:0;} .news-part1-bd .right a .rt .t3{line-height: 26px} } @media(max-width: 992px){ .news-part1-bd{flex-direction: column;} .news-part1-bd .left{width:100%;} .news-part1-bd .right{width:100%;} } @media(max-width: 576px){ .news-part1-hd{padding:30px 0;} .news-part1-bd .left{padding:10px;} .news-part1-bd .left a .txt{padding:15px 0 0;} .news-part1-bd .left a .txt .t1{font-size: 16px} .news-part1-bd .left a .txt .t2{font-size: 12px;padding:8px 0;} .news-part1-bd .left a .txt .t2 i{margin-right: 5px} .news-part1-bd .left a .txt .t3{font-size: 14px} .news-part1-bd .right a{flex-direction: column;padding:10px;} .news-part1-bd .right a .lt,.news-part1-bd .right a .rt{width:100%;} .news-part1-bd .right a .rt{padding:15px 0 0;} .news-part1-bd .right a .rt .t1{font-size: 16px} .news-part1-bd .right a .rt .t2{font-size: 12px;padding:8px 0;} .news-part1-bd .right a .rt .t2 i{margin-right: 5px} } /*news-part2*/ .news-list{ border: 5px solid #f5f5f5;margin-bottom: 45px;width:100%;margin-left: 0px;margin-right: 0px } .news-list .news-item { position: relative; overflow: hidden; cursor: default; background: #fff; } .news-list .news-item::before { display: block; content: ''; height: 216px; position: absolute; bottom: 0; right: 0; border-right: 1px solid #e9e9e9; z-index: 9; } .news-list .news-item::after { -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; -webkit-transform-origin: right center; -moz-transform-origin: right center; -ms-transform-origin: right center; -o-transform-origin: right center; transform-origin: right center; display: block; content: ''; width: 100%; position: absolute; bottom: 0; left: 0; right: 0; border-bottom: 1px solid #e9e9e9; z-index: 3; } .news-list .news-item .item-wrap { position: relative; z-index: 1; } .news-list .news-item .item-wrap .news-img-wrap { padding: 30px; position: absolute; z-index: 1; opacity: 0; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; -webkit-transform: translateY(100px); -moz-transform: translateY(100px); -ms-transform: translateY(100px); -o-transform: translateY(100px); transform: translateY(100px); } .news-list .news-item .item-wrap .news-inf-wrap { position: relative; padding: 30px; background: #ffffff; z-index: 2; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } .news-list .news-item .item-wrap .news-inf-wrap .news-title { font-size: 16px; line-height: 42px; /*margin-top: 10px;*/ margin-bottom: 6px; -ms-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;color:#333;font-size: 18px;font-weight: bold; } .news-list .news-item .item-wrap .news-inf-wrap .news-title span{ color: #666;} .news-list .news-item .item-wrap .news-inf-wrap .news-desc { font-size: 14px; line-height: 26px; color: #999999; height: 52px; overflow: hidden; } .news-list .news-item .item-wrap .news-inf-wrap .news-time { margin-top: 40px; font-size: 16px; color: #999999; line-height: 36px; } .news-list .news-item .item-wrap .news-inf-wrap .news-time i{font-size: 20px;margin-right: 5px;float: left;} .news-list .news-item:nth-child(3n):before { display: none; } .news-list .news-item:hover { overflow: visible; z-index: 9; } .news-list .news-item:hover::after { -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); } .news-list .news-item:hover .news-img-wrap { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); opacity: 1; } .news-list .news-item:hover .news-inf-wrap { -webkit-transform: translateY(235px); -moz-transform: translateY(235px); -ms-transform: translateY(235px); -o-transform: translateY(235px); transform: translateY(235px); } .news-list .news-item:nth-child(n+4):before { top: 0; bottom: auto; } .news-list .news-item:nth-child(n+4)::after { display: none; } .news-list .news-item:nth-child(n+4) .news-img-wrap { -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); } .news-list .news-item:nth-child(n+4):hover .news-img-wrap { background-color: #ffffff; -webkit-transform: translateY(-235px); -moz-transform: translateY(-235px); -ms-transform: translateY(-235px); -o-transform: translateY(-235px); transform: translateY(-235px); opacity: 1; } .news-list .news-item:nth-child(n+4):hover .news-inf-wrap { z-index: 9; -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); } .news-list .news-item:hover .item-wrap .news-inf-wrap .news-title,.news-list .news-item:hover .item-wrap .news-inf-wrap .news-title span{ color: var(--zhu-color);} @media(max-width: 992px){ .news-list .news-item:nth-child(2n):before{display: none;} .news-list .news-item:nth-child(3n):before,.news-list .news-item:nth-child(n+4)::after { display: block; } .news-list .news-item::before{height: 235px} } @media(max-width: 576px){ .news-list .news-item .item-wrap .news-inf-wrap{padding:15px 0;} .news-list .news-item .item-wrap .news-img-wrap{padding:15px 0;} .news-list .news-item:hover .news-inf-wrap{transform: translateY(210px);padding:15px 0;} .news-list .news-item .item-wrap .news-inf-wrap .news-time{margin-top: 25px} } /*newslist*/ .newslist{overflow: hidden;padding:45px 0;} .newslist .row>div{border-right:solid 1px #eee;border-bottom:solid 1px #eee;} .newslist .row>div:nth-child(4n){border-right:none;} .newslist .item{padding:30px;display: block;} .newslist .item .img{padding-bottom: 60%;} .newslist .item .img img{transition: all .5s;} .newslist .item .txt{padding:20px 0;} .newslist .item .txt .t1{font-size: 18px;font-weight: bold;color:#333;transition: all .5s} .newslist .item .txt .t2{font-size: 14px;color:#999;-webkit-line-clamp:2;line-height: 28px;margin:15px 0;} .newslist .item .txt .t3{display: flex;flex-direction: row;justify-content: space-between;color:#666;border-top:solid 1px #eee;padding:15px 0 0;} .newslist .item .txt .t3 span{font-size: 16px;transition: all .5s;padding:5px 0;} .newslist .item:hover .txt .t1{color:var(--zhu-color);} .newslist .item:hover .img img{transform: scale(1.05,1.05);} .newslist .item:hover .txt .t3 .lt{display: block;padding:5px 15px;background: var(--pei-color);color:#fff;} @media(max-width: 576px){ .newslist{padding:30px 0;} .newslist .item{padding:15px 0;} } /*newsinfo*/ .newsinfo{background:#f2f3f4;padding:30px 0;} .newsinfo .box{background:#fff;border-radius: 5px;padding:45px 30px;} .newsinfo .t1{width:100%;text-align: center;font-size: 28px;color:#222;} .newsinfo .t2{width:100%;text-align: center;font-size: 16px;color:#999;padding:15px 30px 30px;border-bottom:solid 1px #eeeddd} .newsinfo .content{padding:30px 0; line-height: 260%;min-height:100px} .newsinfo .newsPage{width:100%;display: flex;flex-direction: row;justify-content: space-between;} .newsinfo .newsPage .btnn{width:60px;display: block;text-align: center;border-radius: 3px;background:#eee;transition: all .5s } .newsinfo .newsPage .btnn i{font-size: 40px;color:#666;line-height: 1.5;transition: all .5s} .newsinfo .newsPage .btnn:hover{background: var(--zhu-color);} .newsinfo .newsPage .btnn:hover i{color:#fff;} .newsinfo .newsPage>div{width:calc(calc(100% - 70px)/2);color:#666;border-radius: 5px;padding:0 15px;background: #eee;line-height: 60px;} .newsinfo .newsPage .page-a{text-align: left;} .newsinfo .newsPage .page-a:nth-child(3){text-align: right;} .newsinfo .newsPage>div a{color:#666;transition: all .5s} .newsinfo .newsPage>div a:hover{color:#222;} @media(max-width: 992px){ .newsinfo .newsPage{flex-direction: column;} .newsinfo .newsPage .btnn{display: none;} .newsinfo .newsPage>div{line-height: 40px;} .newsinfo .newsPage .page-a{width:100%;margin-bottom: 10px;} .newsinfo .newsPage .page-a:nth-child(3){text-align: left;} } @media(max-width: 576px){ .newsinfo .box{padding:30px 15px;} .newsinfo .t1{font-size: 22px;} .newsinfo .t2{font-size: 14px;padding:15px 0 30px;} .newsinfo .newsPage>div{line-height: 20px;padding:10px;} } /*youshi*/ .youshi{margin:30px 0 45px;} .youshi .row li{margin-top: 15px;transition: all .5s;cursor: pointer;} .youshi .item{border:solid 1px #eee;padding:30px;border-radius: 10px;box-shadow: 0 0 15px #ddd;height: 100%;} .youshi .item .hhd{display: flex;flex-direction: row;justify-content: space-between;align-items: center;} .youshi .item .hhd i{font-size: 45px;line-height: 1;color:var(--zhu-color);} .youshi .row>div:nth-child(4) .item .hhd i{font-size: 53px} .youshi .item .hhd .txt{width:calc(100% - 70px);display: flex;flex-direction: column;justify-content: center;} .youshi .item .hhd .txt .t1{font-size: 26px;line-height: 1;transition: all .5s} .youshi .item .hhd .txt .t2{font-size: 14px;text-transform: uppercase;color:#bbb;margin-top: 5px;font-weight: lighter;} .youshi .item .bbd{border-top:solid 1px var(--pei-color);padding:15px 0 0;margin:15px 0 0;line-height:30px;color:#999;} .youshi .row li:hover,.youshi .row li.on{margin-top: 0px;} .youshi .row li:hover .hhd .txt .t1{color:var(--zhu-color);font-weight: bold;} @media(max-width: 1200px){ } .conatct1{background: #f5f5f5; padding: 5px 0 0px 0; overflow: hidden;position: relative;} .conatct1 .map{width:100%;} .contact11 .bd{display: flex;flex-direction: row;justify-content: space-between;} .contact-way{position: absolute;top:60px;left:0;width:100%;z-index: 1} .contact11{ border: 1px solid #dedede; background: #fff; overflow: hidden;width:450px;} .maptxt{ width: 100%; padding: 35px; overflow: hidden;} .maptxt .mapt1{ width: 100%; overflow: hidden; position:relative;} .maptxt .mapt1 .mapt11{ color: var(--zhu-color); font-size: 38px; font-weight: 700; line-height: 55px;} .maptxt .mapt1 .mapt12{ width: 100%; background: #fff; height: 20px; line-height: 20px;overflow:hidden; position: absolute; left:0; bottom:0; z-index:999; color: #333; font-size: 18px;letter-spacing: 1.2px} .maptxt .mpat2{ padding: 20px 0; line-height: 35px; border-bottom: 1px solid #dedede; color: #666; } .maptxt .mpat2 .iconfont{ color: var(--zhu-color); font-size: 24px; margin-right: 10px;position: relative; top:3px; } .mapt3{ padding: 15px 0;width:140px;display: flex;flex-direction: row;} .mapt3 li{ width:100%;text-align: center;} .mapt3 li p{width:100%;float: left;} .mapt3 .conatctewm{ width: 140px; height: 140px; } .mapt33{ width: calc(100% - 160px); float: right; padding: 18px 0;} .mapt33 b{ font-size: 18px; color: #333;} .mapt33 .t100{ font-size: 14px; color: #999;margin: 5px 0 0 0;} .mapt33 .t101{ font-size: 14px; color: #999; margin: 8px 0;margin-right:10px;} .mapt33 .share{padding:10px 0;} .map{ width: 100%; overflow: hidden;} #dituContent{ width: 100%; height:600px; border-left: 1px solid #dedede; } @media(max-width:768px){ .contact-way{position: initial;margin:30px 0;} .maptxt{padding:30px 15px;} .contact11{width:100%;} #dituContent{height: 300px} } @media(max-width: 576px){ .contact11 .bd{flex-direction: column;} .mapt3{width:100%;} .mapt33{width:100%;} } .lxwmb{overflow: hidden;background:url(../images/lxwmb.jpg) center no-repeat;width:100%;padding:60px 0;} .lxwmtitb{width: 80%;text-align: center;margin:0 auto;} .lxwmtitb span{display: block;font-size: 30px;font-weight:600;line-height: 55px;color:#fff;} .lxwmtitb p{line-height: 30px;font-size: 16px;color:#fff;} .lxwmb_a .forma input{display: block;float: left; width: 49%;margin-right: 2%; background: #fff; line-height: 45px;padding-left:4rem;margin-bottom: 1.5rem;border-radius: 5px} .lxwmb_a textarea{display: block;width: 100%;padding-top: 1rem;padding-left: 4rem;margin-bottom: 2rem;background:url(../images/content-icon.png) 15px center no-repeat #fff;background-size: 28px 28px;border:none;border-radius: 5px} .lxwmb_a .forma input:nth-of-type(1){background:url(../images/link-icon.png) 15px center no-repeat #fff;background-size: 28px 28px;} .lxwmb_a .forma input:nth-of-type(2){background:url(../images/tel-icon.png) 15px center no-repeat #fff;margin-right: 0px;background-size: 28px 28px;} .lxwmb_a .code input{float: left;width: 35%;line-height: 45px;background: #fff;text-align: center;border-radius: 5px} .lxwmb_a .code .verify{float: left;width: 30%;margin: 0 3%;} .lxwmb_a .code .verify img{max-width: 100%;height: 45px;} .lxwmb_a .code .submit{float: left;width: 28%; display: block;line-height: 45px;color: #fff;text-align: center; background: var(--zhu-color);transition: .4s;border-radius: 5px} .lxwmb_a .code .submit:hover{background:var(--pei-color);} .mes-form{height: auto;overflow: hidden;} .lxwmb_a .code{width: 36%;margin:0 auto;} @media(max-width: 1200px){ .lxwmtitb p{padding:15px 0;} } @media(max-width: 992px){ .lxwmb_a .code{width:60%;} } @media(max-width: 768px){ .lxwmb_a .code{width:80%;} } @media(max-width: 576px){ .lxwmtitb{width:100%;} .lxwmtitb span{font-size: 28px} .lxwmtitb p{font-size: 15px;} .lxwmb_a{padding-left:0!important;padding-right: 0!important} .lxwmb_a .code{width:100%;} .lxwmb_a .forma input{width:100%;} } /*job-part1*/ .job-part1{padding:45px 0;} .tit_in{ position: relative; text-align: center;} .tit_in p{ float: left; width:50px; border-radius: 100%; text-align: center; } .tit_in span{ position: relative; float: left; padding: 0 20px; color: #373737; font-size: 30px; line-height: 45px;} .tit_in span:before{ position: absolute; content: ''; background: #aeaeae; width: 1px; height: 50%; right: 0; top: 25%; } .tit_cp li{ float: left; padding: 0 1%; line-height: 45px;} .tit_cp li a{ display: inline-block; position: relative; color: #666666;} .tit_cp li a:after{z-index:1;content: ''; position: absolute; left: 0; bottom: 15px; display: block; height:5px; background-color: rgba(195, 0, 47, .2);width:100%; -webkit-transition: transform .5s; -moz-transition: transform .5s; -ms-transition: transform .5s; -o-transition: transform .5s; transition: transform .5s; -webkit-transform: scaleX(0); transform: scaleX(0);-webkit-transform-origin: right center;transform-origin: right center;} .tit_cp li a:hover{ color: #c3002f;} .tit_cp li a:hover::after{ -webkit-transform-origin: left center;transform-origin: left center; -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1);} .tit_font{ float: left; padding-left:20px; height: 45px; line-height: 45px; color: #666666; font-size: 15px;} @media screen and (max-width:1200px){ .tit_cp li{ font-size: 12px; padding: 0 0.5%;} } @media screen and (max-width:991px){ .tit_in span:before{ display: none;} .tit_cp li{ line-height: 35px;} } /*招聘*/ .job-part2{ margin:0 3% 3%;overflow:hidden;padding:55px 3% 15px; } .job-part2 .swiper-slide { transition: 0.3s; position: relative; background: #f5f5f5; padding: 4% 0 3%; cursor: pointer; border-radius: 5px; /* Center slide text vertically */ flex-direction: column; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; border:solid 1px rgba(8,122,198,0.5); transition: all .5s; } .job-part2 .swiper-slide .pic{ position: absolute; left: 50%; top: -52px; text-align: center; width: 105px; height: 105px; background:var(--zhu-color); line-height: 105px; border-radius: 100%;transform: translateX(-50%);transition: all .5s} .job-part2 .swiper-slide .pic i{ color: #fff; font-size: 50px;display: block;} .job-part2 .swiper-slide p{ color: #333333; font-size: 26px; position: relative;padding-bottom: 15px;padding-top: 10px} .job-part2 .swiper-slide p:after{content:'';width:50px;height: 2px;background:var(--pei-color);bottom:0;left:50%;transform: translateX(-50%);position: absolute;transition: all .5s} .job-part2 .swiper-slide span{ display: block; padding: 0 10%; text-align: center; color: #999; font-size: 14px;margin-top:20px;line-height: 28px} .job-part2 .swiper-slide:hover{ border:solid 1px rgba(74,172,49,0.5);box-shadow: 0 0 15px #999;} .job-part2 .swiper-slide:hover .pic{background: var(--pei-color);} .job-part2 .swiper-slide:hover .pic i{animation: swing 1s;} .job-part2 .swiper-slide:hover p:after{background: var(--zhu-color)} @media screen and (max-width:1200px){ .job-part2 .swiper-slide p{ padding-top: 12%;} } @media screen and (max-width:768px){ .job-part2 .swiper-slide p{ padding-top: 15%;} } .job-part3{ background: url("../images/zpjy.jpg") no-repeat center fixed; border-radius: 10px; text-align: center; color: #fff;padding:60px 0;} .job-part3 .tit{ font-size: 30px;padding-bottom: 15px;position: relative;} .job-part3 .tit:after{ content:'';position: absolute;left:50%;transform: translateX(-50%);bottom:0;width:80px;height: 2px;background: var(--pei-color)} .job-part3 .con{ padding: 2% 20% 0; font-size: 16px;line-height: 32px} @media screen and (max-width:768px){ .job-part3 .con{ font-size: 14px; padding: 2%;} } .job-part4{padding-bottom: 60px} #jobs_ul{padding:0;width: 100%;} #jobs_ul li{width: 100%; margin-bottom: 1% !important;} #jobs_ul li .jobs_title{font-size: 14px; width: 100%; line-height: 30px; background: #f4f4f4; color: #666666; padding: 2%; margin: 0;} #jobs_ul li .jobs_box{ padding:20px 3.5% 36px; background: #fff; position: relative;display: none;} #jobs_ul li .jobs_box .info1 { border-bottom: 1px solid #e5e5e5; padding-bottom: 22px; } #jobs_ul li .jobs_box .info1 p { font-size: 14px; color: #333333; line-height: 25px; margin: 5px 0px !important; } #jobs_ul li .jobs_box .info2 { border-bottom: 1px solid #e5e5e5; padding: 14px 0 22px; } #jobs_ul li .jobs_box .info2 h3 { font-size: 18px; color: #333333; line-height: 3; font-weight: normal; } #jobs_ul li .jobs_box .info2 p { font-size: 14px; color: #777777; line-height: 2.5; } #jobs_ul li .jobs_box .info2 .float-left { width: 50%;float: left; } #jobs_ul li .jobs_box .info2 .float-right { width: 43.5%;float: right; } #jobs_ul li .jobs_box .info2 .float-left .info-box { border-right: 1px solid #e5e5e5;padding-right: 10%; } #jobs_ul li .jobs_box .info3 { margin-top: 31px; } #jobs_ul li .jobs_box .info3 .apply_btn { width: 151px; height: 41px; line-height: 41px; background: #1976a0; font-size: 16px; color: #ffffff; float: right; transition: 0.3s; text-align: center; } #jobs_ul li .jobs_box .info3 .apply_btn:hover { background: #333; } #jobs_ul li .jobs_box .info3 .all { float: right; font-size: 14px; color: #777777; height: 41px; line-height: 41px; padding-left: 30px; } #jobs_ul li .jobs_box i { position: absolute; left: 18px; top: -12px; width: 0; height: 0; border-width: 6px; border-style: solid; border-color: transparent transparent #f5f5f5; } .jobs_title{ margin: 3% 0 0;} .jobs_title .td1{ line-height: 40px; border-right: 1px solid #dbdbdb;} .jobs_title .td1 p{ color: #333333; font-size: 22px;} .jobs_title .td1 span{ color: #666666; font-size: 16px;} .jobs_title .td2{ line-height: 40px; padding-left: 5%;} .jobs_title .td2 p{ color: #666666; font-size: 16px;} .jobs_title .td2 p span{ color: var(--zhu-color); font-size: 24px;} .jobs_title .td5{ text-align: center; padding-top: 2%;} .jobs_title .td5 a{ display: block; height: 45px; line-height: 45px; float: right; padding: 0 10%; background:var(--pei-color); border-radius: 5px; color: #fff;font-size: 14px;} @media screen and (max-width:768px){ .jobs_title .td4{ width: 30%;} .jobs_title .td2 p{ font-size: 14px;} .jobs_title .td2 p span{ font-size: 16px;} .jobs_title .td1 span{ font-size: 12px;line-height: 24px;display: block;margin-top: 10px} #jobs_ul li .jobs_box .info2 .float-left{width:100%;} #jobs_ul li .jobs_box .info2 .float-right{width:100%;} #jobs_ul li .jobs_box .info2 .float-left .info-box{border:none;padding-right: 0} } @media(max-width: 576px){ .jobs_title .td2 p span{font-size: 14px;} #jobs_ul li .jobs_box .info1 p{font-size: 12px} } /*no-goods*/ .no-goods,.no-network{padding:60px 0; overflow: hidden; text-align: center;} .no-goods img{display: block; margin:0 auto 30px; width:220px; max-height: 105px;} .no-goods p,.no-network p{font-size:14px; color:#666666; line-height: 20px;} /*prolist*/ .prolist{overflow: hidden;width:100%;margin-top: 45px} .prolist-left{width:296px;margin-bottom: 30px;float: left;} .prolist-left.sticky{position: fixed;} .prolist-right{width:calc(100% - 311px);float: right;} .prolist-right .item{margin-bottom: 30px;display: block;padding:8px;border:solid 1px #eeeddf;position: relative;} .prolist-right .item .img img{transform: scale(1.1,1.1);transition: all .5s} .prolist-right .item p{height: 55px;background: #f5f5f5;line-height: 55px;font-size: 16px;text-align: center;padding:0 15px;transition: all .5s;color:#333;} .prolist-right .item:hover .img img{transform: scale(1,1);} .prolist-right .item:hover p{background: var(--zhu-color);color:#fff;} @media(max-width: 1400px){ .prolist-left .sidebar{width:100%;} } @media(max-width: 1200px){ .prolist .wrapp{padding:0;} .prolist-left{display: none} .prolist-right{width:100%;min-height: auto;} } @media(max-width: 576px){ .prolist-right .row>div{padding-left: 3px;padding-right: 3px;} .prolist-right .item{margin-bottom: 15px;} .prolist-right .item p{padding:0px 5px;font-size: 14px;height: 40px;line-height: 40px;} } /*资质荣誉*/ .honor{overflow: hidden;} .honor .item{background: #f2f2f2;border-radius: 3px;overflow: hidden;} .honor .item a{display: block;width:100%;transition: all .5s;position:relative;} .honor .item a .hd{overflow: hidden;position: relative;width:100%;} .honor .item a .bd{text-align: center;font-size: 16px;line-height: 50px;color:#fff;transition: all .5s;position: absolute;bottom:-15px;left:-15px;padding:0 10px;background: rgba(8,122,198,.7);text-align: center;width:calc(100% + 30px);display: flex;height: 60px;flex-direction: column;align-items: center;} .honor .item a .bd i{font-size: 40px;display: none;} .honor .item .item:hover{box-shadow: 0 0 10px #ccc;} .honor .item:hover a .bd{letter-spacing: 1px;height:calc(100% + 30px);justify-content: center;} .honor .item:hover a .bd i{display: block;} /*厂区环境*/ .environment .item{background: #f2f2f2;transition: all .5s} .environment .item a{display: block;width:100%;overflow: hidden;border-radius: 3px;transition: all .5s;} .environment .item a .hd{overflow: hidden;position: relative;width:100%;} .environment .item a .hd .img img{transform: scale(1.05,1.05);transition: all .5s} .environment .item a .hd .zhezhao{position: absolute;top:0px;height: 100%;width:100%;left:0px;background: rgba(77,173,49,0.75);z-index: 1;padding:15px;opacity: 0;transition: all .5s} .environment .item a .hd .zhezhao .box{width:100%;height: 100%;border:solid 1px rgba(255,255,255,0.3);display: flex;flex-direction: column;justify-content: center;align-items: center;color:#fff;padding:15px;} .environment .item a .hd .zhezhao .box i{font-size: 50px;} .environment .item a .hd .zhezhao .box p{font-size: 17px;margin-top: 5px;background: none;} .environment .item a .bd{text-align: center;font-size: 16px;line-height: 40px;color:#333;margin-top: 10px;transition: all .5s} .environment .item:hover{box-shadow: 0 0 10px #ccc;} .environment .item:hover a .img img{transform: scale(1,1);} .environment .item:hover a .hd .zhezhao{top:20px;height: calc(100% - 40px);width:calc(100% - 40px);left:20px;opacity: 1} .environment .item:hover a .bd{letter-spacing: 1px} @media(max-width: 576px){ .environment .item a{padding:0;} .environment .item a .bd{font-size: 14px;} } /*goods-part1*/ .goods-part1{overflow: hidden;} .goods-part1-hd{padding:45px 0;text-align: center;color:#333;} .goods-part1-hd .t1{font-size: 42px;font-weight: bold;} .goods-part1-hd .t2{font-size: 18px;} .goods-part1-bd{overflow: hidden;margin-top: 15px;} .goods-part1-bd ul{display: flex;flex-direction: row;justify-content: space-between;width:100%;flex-wrap: wrap;} .goods-part1-bd ul li{width:49%;background:#f3f4f4;padding:30px;overflow: hidden;border-radius: 5px;display: flex;flex-direction: row;justify-content: space-between;transition: all .5s} .goods-part1-bd ul li .left{width:395px;} .goods-part1-bd ul li .left .img{border-radius: 3px} .goods-part1-bd ul li .right{width:calc(100% - 420px);} .goods-part1-bd ul li .right .t1{font-size:30px;font-weight: bold;padding:15px 0;transition: all .5s} .goods-part1-bd ul li .right .t2{font-size:15px;line-height: 30px;-webkit-line-clamp:5;font-weight: lighter;transition: all .5s;text-indent: 2em} .goods-part1-bd ul li .right .btnn{display: flex;flex-direction: row;margin-top: 30px;} .goods-part1-bd ul li .right .btnn a{display: flex;flex-direction: row;color:var(--zhu-color);font-size: 16px;padding-right:1.5vw;height: 25px;align-items: center;border-right:solid 1px rgba(8,122,198,.3);margin-right:1.5vw;transition: all .5s} .goods-part1-bd ul li .right .btnn a:nth-child(2){border:none;margin-right: 0;padding-right: 0} .goods-part1-bd ul li .right .btnn a i{font-size:25px;line-height: 1;margin-right: 5px} .goods-part1-bd ul li .right .btnn a:hover{color:var(--pei-color);} .goods-part1-bd ul li:hover{background: var(--zhu-color);} .goods-part1-bd ul li:hover .t1{color:#fff;} .goods-part1-bd ul li:hover .t2{color:#fff;opacity: 0.3;} .goods-part1-bd ul li:hover .btnn a{color:#fff;border-color:rgba(255,255,255,.3);} @media(max-width: 1600px){ .goods-part1-bd ul li .left{width:350px;} .goods-part1-bd ul li .right{width:calc(100% - 380px)} .goods-part1-bd ul li .right .t2{-webkit-line-clamp:4;} .goods-part1-bd ul li .right .btnn{margin-top: 15px} } @media(max-width: 1400px){ .goods-part1-bd ul li{padding:20px;} .goods-part1-bd ul li .left{width:300px;} .goods-part1-bd ul li .right{width:calc(100% - 320px)} .goods-part1-bd ul li .right .t1{padding:0;font-size: 26px} .goods-part1-bd ul li .right .t2{-webkit-line-clamp:4;} .goods-part1-bd ul li .right .btnn{margin-top: 15px} .goods-part1-bd ul li .right .btnn a{padding-right:0.8vw;margin-right:0.8vw;} } @media(max-width: 1200px){ .goods-part1-bd ul li .left{width:200px;} .goods-part1-bd ul li .right{width:calc(100% - 220px)} .goods-part1-bd ul li .right .t2{-webkit-line-clamp:2;} } @media(max-width: 992px){ .goods-part1-bd ul li{flex-direction: column;} .goods-part1-bd ul li .left{width:100%;} .goods-part1-bd ul li .right{width:100%;padding-bottom: 15px} .goods-part1-bd ul li .right .t1{margin-top: 20px} } @media(max-width: 576px){ .goods-part1-hd .t1{font-size: 28px} .goods-part1-hd .t2{font-size: 14px} .goods-part1-bd ul{flex-direction: column;} .goods-part1-bd ul li{width:100%;margin-bottom: 15px} .goods-part1-bd ul li .right .btnn a{padding-right:3vw;margin-right:3vw;} } /*goods-part2*/ .goods-part2{background: url('../images/goods-part2-bg.jpg') center top no-repeat;margin-top: 45px;background: auto 100%} .goods-part2-hd{padding:45px 50px;} .goods-part2-hd .t1{font-size: 42px;font-weight: bold;} .goods-part2-hd .t2{font-size: 18px;} .goods-part2-bd{overflow: hidden;margin:0px 50px;} .goods-part2-bd a{display: block;position: relative;overflow: hidden;border-radius: 5px;margin:30px 0;transition: all .5s} .goods-part2-bd a .img{padding-bottom: 65%} .goods-part2-bd a p{text-align: center;padding:35px 0;background-image: linear-gradient(to bottom,transparent, rgba(0,0,0,0.8)); color:#fff;font-size: 18px;font-weight: bold;position: absolute;bottom:0;left:0;width:100%;} .goods-part2-bd .pagination{padding:15px 0 45px;text-align: center;display: block} .goods-part2-bd .pagination span{width:12px;height: 12px} .goods-part2-bd a:hover{margin-top: 15px} @media(max-width: 576px){ .goods-part2-hd{padding:0px;} .goods-part2-hd .t1{font-size: 28px} .goods-part2-hd .t2{font-size: 14px} .goods-part2-bd{margin:0;} } /*goods-part3*/ .goods-part3{margin-bottom: 60px} .goods-part3-hd{padding:60px 0;text-align: center;} .goods-part3-hd .t1{font-size: 42px;font-weight: bold;} .goods-part3-hd .t2{font-size: 18px;} .goods-part3-bd{overflow: hidden;display: flex;flex-direction: row;justify-content: space-between;padding:10px 50px;flex-wrap:wrap;} .goods-part3-bd li{display: flex;flex-direction: column;border-radius: 10px;background: #f1f3f5;padding:50px;align-items: center;width:23%;transition: all .5s} .goods-part3-bd li .icon{width:115px;height: 115px;border-radius: 50%;background: var(--zhu-color);text-align: center;line-height: 115px;box-shadow: 0 0 15px var(--zhu-color);} .goods-part3-bd li span{position: relative;} .goods-part3-bd li span:before{content:'';width:15px;height: 15px;background: var(--pei-color);border-radius: 50%;border-radius: 50%;top:-35px;left:0;position: absolute;z-index: 0} .goods-part3-bd li:nth-child(1) span:before{left:-8px;top:-40px;} .goods-part3-bd li:nth-child(2) span:before{left:5px;top:-30px;} .goods-part3-bd li span i{font-size: 60px;color:#fff;position: relative;z-index: 1} .goods-part3-bd li .t1{font-size: 30px;padding-bottom: 20px;position: relative;margin-top: 30px} .goods-part3-bd li .t1:after{content:'';position: absolute;left:50%;transform: translateX(-50%);width:32px;height: 5px;background: var(--zhu-color);bottom:0;} .goods-part3-bd li .t2{text-align: center;font-size: 16px;line-height: 28px;margin-top:20px;} .goods-part3-bd li:hover{box-shadow: 0 0 10px #666} @media(max-width: 1200px){ .goods-part3-bd{padding:0;} .goods-part3-bd li{padding:25px;width:24%;} .goods-part3-bd li .icon{width:80px;height: 80px;line-height: 80px} .goods-part3-bd li .icon span{} .goods-part3-bd li span i{font-size: 40px;} .goods-part3-bd li span:before{top:-20px;} .goods-part3-bd li:nth-child(1) span:before{left:-8px;top:-25px;} .goods-part3-bd li:nth-child(2) span:before{left:5px;top:-20px;} } @media(max-width: 992px){ .goods-part3-bd li{width:49%;margin-bottom: 15px;} } @media(max-width: 576px){ .goods-part3-hd .t1{font-size: 28px} .goods-part3-hd .t2{font-size: 14px} .goods-part3-bd li{width: 100%} }