@import "common.css";

/*banner下的contact*/
.top-contact{background:#0072cf;padding:1.4rem 2rem;color:#FFF}
.top-contact .text{margin-left:2.6rem}
.top-contact h2{font-size:1.7rem;margin-bottom:0.25rem}
.top-contact p{font-size:1.25rem;margin-top:0.47rem}
.top-contact .btn{margin:0.5rem 0 0 12rem;padding:0.65rem 1.8rem}
@media (max-width:1200px){
    .top-contact .text{margin-left:0}
    .top-contact .btn{margin:1.2rem 0 0 0}
}
@media (max-width:768px){
    .top-contact{padding:1.05rem 0}
    .top-contact p{font-size:1.15rem;margin-top:0}
    .top-contact .btn{font-size:1rem;margin-top:0.8rem;padding:0.4rem 1rem}
}

/*原理简介*/
.section-principle{padding:2.2rem 0 2.5rem}
.section-principle-con{display:flex;flex-flow:row wrap;flex-direction:row-reverse}
.section-principle-con .flexcol{display:flex;flex-direction:column}
.section-principle .img{justify-content:center;align-items:center;width:50%;position: relative;}
.section-principle .img .video-container{position:relative;width:100%;overflow:hidden}
.section-principle .text{justify-content:center;align-items:center;width:50%;padding-left:80px;padding-top:3rem}
.section-principle .text h2:after{position:relative;width:320px;height:80px;background:url(/static/images/wave-line.svg) right center / auto 20px no-repeat}
.section-principle .text p.feature{font-size:20px;font-weight:700;margin-top:2rem}
@media (max-width:1279px){
    .section-principle-con{flex-direction:row}
    .section-principle{padding:2.4rem 0}
    .section-principle .img{width:100%}
    .section-principle .text{width:100%;padding:0 0 50px}
}
@media (max-width:768px){
    .section-principle .text{padding-bottom:0}
    .section-principle .text h2{font-size:1.81rem;line-height:2.6rem}
    .section-principle .text h2:after{width:280px;height:54px}
    .section-principle .text p.lg{font-size:16px}
    .section-principle p{font-size:1.2rem}
    .section-principle .text p.feature{font-size:1.2rem;margin-top:0.8rem}
}


.section-expand .info{gap:20px}
.section-expand li{width:24%;margin-right:2%;overflow:hidden;-webkit-transition:width .3s linear;-o-transition:width .3s linear;transition:width .3s linear}
.section-expand li.item-expand{width:48%}
.section-expand li:last-child{margin-right:0}
.section-expand li h3{font-weight:600;font-size:24px}
.section-expand li.item-expand h3{text-align:left}
.section-expand li.item-expand p{display:block;text-align:left;right:0;-webkit-animation:fade-data-v-da90fcd0  .6s linear;animation:fade-data-v-da90fcd0  .6s linear}
@-webkit-keyframes fade-data-v-da90fcd0{0%{opacity:0}50%{opacity:0}to{opacity:1}}
@keyframes fade-data-v-da90fcd0{0%{opacity:0}50%{opacity:0}to{opacity:1}}
.section-expand li p{display:none;color:#6c6f71;font-size:1.022rem;line-height:1.8rem;position:absolute;top:51%;width:306px;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}
.section-expand li.item-expand a{display:inline-flex}
.section-expand li a{display:none}
.section-expand li.item-expand p{max-width:50%;padding-left:15px}
.section-expand li img{width:280px;height:auto}
.section-expand li .hover-point{margin:16px auto 0;background-color:#eaeaea;border-radius:50%;position:relative;z-index:3;width:12px;height:12px}
.section-expand li.item-expand .hover-point{background-color:#df0819;margin:16px 0 0 0}
.cross-line{position:absolute;top:90px;z-index:2;width:93%;height:1px;left:40px;background-image:-webkit-gradient(linear,left top,right top,from(#bfbfbf),color-stop(50%,#bfbfbf),color-stop(50%,rgba(0,0,0,0)));background-image:-o-linear-gradient(left,#bfbfbf 0,#bfbfbf 50%,rgba(0,0,0,0) 50%);background-image:linear-gradient(90deg,#bfbfbf,#bfbfbf 50%,rgba(0,0,0,0) 0);background-repeat:repeat-x;background-size:10px 1px}

@media (min-width:1200px) and (max-width:1600px){
	.section-expand li.item-expand img{max-width:50%}
}
@media (max-width:1200px){
	.section-expand li{width:100% !important;margin-right:0;margin-bottom:10px}
	.section-expand li.item-expand p{display:none}
	.section-expand li.item-expand h3{text-align:center}
	.section-expand li img{width:100%}
	.section-expand li a{display:inline-flex}
}
@media (min-width:768px) and (max-width:1000px){
	.section-expand li.item-expand p{display:none}
	.section-expand li.item-expand img{max-width:100%}
}

.section-horizontal{padding:2.5rem;background:#3c87c1;text-align:center;position:relative;color:#fff;font-size:2rem}
.section-horizontal .title h2,.section-horizontal .title h3{font-family:Roboto-Bold;font-weight:600;font-size:3.2rem;padding-top:1rem;letter-spacing:0.12rem;}
.section-horizontal .title h3{font-size:2.7rem;}
@media screen and (max-width:768px){
    .section-horizontal{padding:2rem}
	.section-horizontal .title h2{font-size:2.2rem;}
    .section-horizontal .title h3{font-size:1.2rem;}
}
.section-horizontal img{margin-top:1.6rem}
.section-benefit ul{margin-top:5rem}
.section-benefit ul li{position:relative;padding-left:3.2rem;font-size:1.2rem;margin:1.6rem 0 3.8rem}
.section-benefit ul li:before{content:"";background:url('/static/images/tick.svg') center no-repeat;background-size:3.6rem;width:2.8rem;height:2.1rem;position:absolute;left:0}
.section-benefit ul li strong{font-size:1.6rem}
.section-benefit ul li p{margin-top:0.5rem;line-height:1.8rem}
.section-benefit  a{margin-left:0.5rem}

.section-why{background:url('/static/images/Pigging-System.webp') no-repeat center center;background-size:cover}
.section-why::before{background:linear-gradient(to top,rgba(0,0,0,0.5),rgba(0,0,0,0));transition:.3s;z-index:1;content:'';display:block;position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}
.section-why-con li{float:left;width:32%;margin-right:1%}
.section-why-con li a{font-size:1.1rem;color:#fff;background-color:#008fd7;height:80px}
.section-why-con li a:hover{background-color:#fff;color:#333}

.section-about-num{text-align:center}
.section-about-num li{border-right:2px solid #f9f9f9;border-left:2px solid #f9f9f9;background-color:#fff;width:25%}
.section-about-num li:hover{cursor:pointer;transform:scale(1.1);-ms-transform:scale(1.1);-webkit-transform:scale(1.1);transition:all 0.3s linear;-webkit-transition:all 0.3s linear}
.section-about-num li:first-child{border-left:none}
.section-about-num li:last-child{border-right:none}
.section-about-num li h3{font-weight:800;font-size:35px;color:#3a3a3a}
.section-about-num li p{color:#545454;font-size:1.3rem}
@media (max-width:1200px){
	.section-about .col-12{margin-bottom:15px}
	.section-about-num li{width:50%;border-right:none}
	.section-about-num li h3{font-size:30px}
}
@media (max-width:768px){
    .section-why-con li .pl{padding-left:6px!important}
    .section-about-num li h3{font-size:2.1rem}
}

.section-gallery .section-head a{font-weight:700;color:#e70012}
.section-gallery .section-head a::before{background:none}
.section-gallery a::before{background:linear-gradient(to top,rgba(0,0,0,0.2),rgba(0,0,0,0));transition:.3s;z-index:1;content:'';display:block;position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}
.section-gallery a::after{transition:.3s;background:linear-gradient(to top,#00479d,rgba(230,33,41,0));opacity:0;z-index:0;content:'';display:block;position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}
.section-gallery a p{position:absolute;bottom:0;width:100%;z-index:2;text-align:center;font-size:22px;padding:15px;color:#fff;text-shadow:1px 1px 3px rgba(0, 0, 0, 0.6);}
.section-gallery a:hover::after{opacity:1}
.section-gallery a:hover::before{opacity:0}
.section-map p{font-size:18px;line-height:1.625;color:#6c6f71}
@media (max-width:1200px){
	.section-gallery a p{font-size:16px}
    .section-map .text{padding:15px;}
    .section-map .text h3{font-size:14px;word-wrap:break-word;word-break:normal;}
}
@media (max-width:768px){
    .section-gallery a p{font-size:14px}
    .section-gallery .col-md-4:nth-child(odd){padding-right:6px}
    .section-gallery .col-md-4:nth-child(even){padding-left:6px}
}


.section-partner{padding:0}
.section-partner .col-md-6:first-child{background-color:#3c87c1;padding-left:55px}
.section-partner .col-md-6{padding:0}
.section-partner .row.no-gutters{display:flex;margin:0}
.section-partner .col-md-6:first-child h3{font-size:60px;line-height:83px;text-transform:uppercase;color:#fff;font-family:'Poppins',sans-serif;text-align:left;margin-left:155px;margin-bottom:0;font-weight:700;padding-bottom:35px;padding-top:120px;background-image:url(/static/images/white-shadow.webp);background-repeat:no-repeat;background-position:bottom left;margin-bottom:35px}
.section-partner .col-md-6:first-child:before{content:'';background-image:url('/static/images/circle.webp');width:-webkit-fill-available;height:238px;position:absolute;bottom:100px;left:120px;background-repeat:no-repeat}
.section-partner .col-md-6:first-child img{position:relative;right:-12%;z-index:1}
.section-partner .col-md-6:last-child img{width:100%}
@media (max-width:1560px){
    .section-partner .col-md-6:first-child h3{padding-top:38px;font-size:46px}
}
@media (max-width:991px){
    .section-partner{padding:0px 15px}
    .section-partner .row.no-gutters{flex-wrap:wrap}
    .section-partner .col-md-6:first-child{padding-left:0}
    .section-partner .col-md-6:first-child img{right:0}
    .section-partner .col-md-6:first-child h3{margin-left:45px}
    .section-partner .row.no-gutters{margin-left:-15px;margin-right:-15px}
}
@media (max-width:768px){
    .section-partner .col-md-6:first-child h3{font-size:2.4rem;margin-left:25px;padding-top:28px;padding-bottom:10px}
}


.section-blog li{padding-top:1rem;box-shadow:0 8px 10px rgba(28,52,92,.2);border-radius:6px}
.section-blog .section-head h2:after{margin-left:-30px;left:50%}
.section-blog .more{display:inline-block;width:9rem;margin:1.6rem 0 1.5rem;padding:0.8rem;border:2px solid #144977;border-radius:5px;text-align:center;font-weight:bolder;color:#144977}
.section-blog .more:hover{background-color:#008fd7;color:#fff;border:none}
.section-blog a:hover{color:#000;}
.section-blog h3{color:#333}
.section-blog h3{font-size:1.38rem;line-height:2.3rem}
.section-blog h3:hover{color:#008fd7}
.section-blog .row{display:flex;justify-content:space-between;padding:0 14px;}
@media (min-width:768px){
    .section-blog .col-md-4{max-width:31.333333%;}
}