ol,ul,li{list-style:none;}
.pc{display:block}
.phone{display:none}
.fl{float:left}
.fr{float:right}
.fixed:after{content:".";display:block;clear:both;height:0;visibility:hidden;}
.fixed {display:block;min-height:1%;}
.section1{padding: 130px 0 150px;background: url("/images/ecology-banner.jpg")no-repeat center;background-size: cover;color: #ffffff;text-align: center}
.section1 h1{margin-bottom: 40px;font-weight: 700}
.section1 p{line-height: 32px;color: #ffffff;font-size: 16px;max-width: 800px;padding: 0 15px;margin: 0 auto}
.section1-btn{margin-top: 60px;}
.section1-btn>a{display: inline-block;text-align: center;color: #ffffff;margin-right: 40px;border: 0;border-radius:50px;font-size: 16px;position: relative;overflow: hidden}
.section1-btn>a>span:first-child{position: relative;z-index: 5;padding: 10px 40px;display: block;border: 2px solid #ffffff;border-radius: 50px;}
.mask{  background-color: #fff;  color: #222021;  opacity: 1; z-index: 2;  padding-top: 0; display: block;  transition: transform .2s ease-in;  height: 100%;position: absolute;width: 100%;left: 0;top: 0;border-radius: 20px;
}
.section{padding-top: 0}
.section1-btn>a:hover{color: #333333}
.section1-btn>a:hover .mask{transform: translateY(0)!important;}

.section2{padding: 90px 0}
.section2 h1{text-align: center;margin-bottom: 50px;}
.section2 h3{margin-bottom: 20px;margin-top: 20px;}
.section2 p{line-height: 24px;text-align: justify}
.section2 ul>li{width: 49%}
.section2 ul>li>div>img{width: 100%}
.section2 ul>li img{width: 100%}
.dplay-connect ul li{float:left;width:15%;margin-right: 2%;text-align: center;border: 1px solid #eeeeee;position: relative;padding-top: 10px;margin-bottom: 10px;cursor: pointer}
.dplay-connect ul li>div>img{max-width: 100%}
.dplay-connect ul li.no{cursor:initial}
.dplay-connect ul li.no:after{display: none}
.dplay-connect ul li:after{content: "";display: block;position: absolute;left: 0;bottom: 0;width: 100%;height: 0;background-color: #ffffff;transition: all 0.3s}
.dplay-connect ul li:hover:after{height: 4px;background-color: #ab2153;}
.dplay-connect ul li:nth-child(6n){margin-right: 0}
.dplay-connect ul li p{text-align: center;margin-top: 10px;margin-bottom: 10px}
.dplay-connect>h3>img{height: 25px;vertical-align: text-top;margin-right: 5px;}
.section3 h1{text-align: center;margin-bottom: 30px;font-size: 30px;}
.section3 h1 img{height: 30px;vertical-align:middle}
.section3>div>p{text-align: center;max-width:570px;margin:  0 auto }
.dplay-connect{margin-top: 30px;margin-bottom: 40px;}
.dplay-connect>h3{margin-bottom: 30px;}
.section3 h1 img:nth-child(3){height: 25px;}

@media (max-width:998px) {
    .dplay-connect ul li{width: 19%;margin-right: 1.25%}
    .dplay-connect ul li:nth-child(6n){margin-right: 1.25%}
    .dplay-connect ul li:nth-child(5n){margin-right: 0}
}
@media (max-width:767px) {
    h1, .h1{font-size:20px;}
    .dplay-connect ul li{width:49%;margin-right:2%}
    .dplay-connect ul li:nth-child(5n){margin-right:2%}
    .dplay-connect ul li:nth-child(6n){margin-right:2%}
    .dplay-connect ul li:nth-child(2n){margin-right:0}
    .dplay-connect ul li p{margin: 20px 0}
    .section1{text-align: center;padding:100px 0}
    .section1 p{text-align: center;font-size: 14px;width: 100%;line-height:24px;}
    .section1 h1{text-align: center;margin-bottom: 20px;}
    .section1-btn{margin:20px auto 0}
    .section1-btn>a{margin-right:0}
    .section2{padding: 50px 0}
    .section2 ul>li>.fl{width: 100%}
    .section2 h3{font-size: 18px;}
    .section2 h1{margin-bottom: 20px;}
    .section2 ul>li>.fr{width: 100%}
    .dplay-connect>h3{text-align: center}
    .section2 ul>li{width: 100%;margin-bottom: 40px;}
    .section2 h3{margin: 20px 0 10px;}
    .section2 ul{padding-left: 0}
    .section3 ul{padding-left: 0}
    .section3 h1{height: auto}
}