﻿@import url('css2-Poppins_swap.css'); 
footer{padding-top:40px}
.finfo{margin-top:50px}
h3{color:#fff;text-align:center;text-transform:uppercase;font-weight:400;font-size:1.8rem;line-height:2.8rem}
h3 a{color:#77b917}
h3+p{margin-top:10px;color:#ccc;text-align:center}

/*.faq,.knowledge,.map,.maplist,.news,.s7video{opacity:0}*/

.section2{background:url(../image/bg_2.jpg) center center no-repeat;position:relative}
.section2 .left{padding-top:100px;width:55%;color:#fff}
.section2 .left h2{margin-bottom:10px;font-size:2rem;font-family:Poppins;line-height:3rem}
.section2 .left ul{margin:1rem 0 2rem}
.section2 .left ul li{overflow:hidden;width:8rem;height:8rem;border:1px solid #fff;border-radius:50%}
.section2 .left p{width:100%;color:#fff;text-align:justify;font-size:1rem}
.section2 .left>a{display:block;width:180px;height:3rem;border-radius:4px;background:#77b917;color:#fff;text-align:center;font-size:1.2rem;line-height:3rem}
.section2 .right{width:40%}
.section2 .right img{max-width:100%;height:auto}
.section2 span{position:absolute;top:50%;left:2%;display:block;cursor:pointer}
.section2 span.next{right:8%;left:auto}

.section3{background:url(../image/bg_3.jpg) center center no-repeat}
.section3 .container{display:flex;flex-wrap:wrap;justify-content:space-around}
.section3 .l{width:58%;min-width:300px}
.section3 h3{color:#fff;text-align:left}
.section3 h3+p{color:#fff;text-align:left}
.section3 .r{width:40%;min-width:300px}
.section3 .r div{position:relative;padding-top:56.25%}
.section3 .r iframe{position:absolute;left:0;top:0;width:100%;height:100%}
.com_cul{display:flex;margin-top:35px;width:100%;flex-wrap:wrap}
.com_cul a,.com_cul dd,.com_cul dt,.com_cul span{color:#fff;font-size:1rem;line-height:2rem}
.com_cul dl{display:none;margin-bottom:1rem;width:33%;text-align:center}
.com_cul dl:hover dt{background:#77b917;color:#fff}
.com_cul dl:hover span{color:#77b917}
.com_cul dt{margin:0 auto 10px;width:60px;height:60px;border-radius:50%;background:#fff;display:flex;justify-content:center;align-items:center;transition:all .2s}
.com_cul span{display:block;font-size:1.3rem;line-height:2.3rem}
.section4{background:url(../image/bg_4.jpg) center center no-repeat}
.section4 .container{max-width:1400px}
.solutions{width:100%}
.solutions .hd{display:flex;margin:40px 0;width:100%;justify-content:space-around}
.solutions .hd a,.solutions .hd li{display:block;box-sizing:border-box;padding:.5rem;width:32%;border:1px solid #fff;border-radius:4px;color:#fff;text-align:center;font-size:1rem;line-height:2rem;cursor:pointer;transition:all .2s}
.solutions .hd a.on,.solutions .hd a:hover,.solutions .hd li.on,.solutions .hd li:hover{border-color:#77b917;background:#77b917}
.solutions .bd{width:100%}
.solutions .left{width:calc(100% - 300px);min-width:600px;background:rgba(0,0,0,.5)}
.solutions .left img{float:left;width:49%;height:auto}
.solutions .left ul{float:left;box-sizing:border-box;padding:20px;width:49%;color:#fff}
.solutions .left ul h2,.solutions .left ul li{font-size:1.5rem;line-height:2.5rem}
.solutions .left ul p{margin:1rem auto;color:#fff;font-size:1rem;line-height:2rem}
.solutions .app dl a dd,.solutions h2 a{color:#fff}
.solutions .app{float:left;display:flex;box-sizing:border-box;width:100%;color:#fff;justify-content:space-around}
.solutions .app dl{margin-top:1rem;width:32%;text-align:center}
.solutions .app dt{overflow:hidden;margin:0 auto 1rem;width:80px;height:80px;border:1px solid #fff;border-radius:4px}
.solutions .app dt img{width:100%}
.solutions .right{width:280px}
.solutions .right img{margin-bottom:20px;width:100%}
.section5{background:url(../image/bg_5.jpg) center center no-repeat}
.map{position:relative;margin-top:20px;width:700px;height:400px;background:url(../image/map_world.png) center no-repeat}
.map i{position:absolute;display:block;width:15px;height:15px;border:2px solid #77b917;border-radius:50%;cursor:pointer;transition:all .2s;animation:mapdot 2s infinite ease-in-out}
.map i:first-child{top:135px;left:130px}
.map i:nth-child(2){top:275px;left:220px;animation-delay:.3s}
.map i:nth-child(3){top:120px;left:390px;animation-delay:.8s}
.map i:nth-child(4){top:240px;left:360px}
.map i:nth-child(5){top:130px;left:500px;animation-delay:1s}
.map i:nth-child(6){top:299px;left:570px}
.map i.on{background:#77b917;transform:scale(1.2)}
@keyframes mapdot{0%{opacity:.5;transform:scale(.5)}
50%{opacity:1;transform:scale(1)}
100%{opacity:.5;transform:scale(.5)}
}
.maplist{margin-top:20px;width:430px}
.maplist div{display:none}
.maplist div:first-child{display:block}
.maplist span{display:block;margin-bottom:30px;color:#77b917;font-size:30px}
.maplist dl{margin-bottom:15px;width:100%}
.maplist dl *{transition:all .2s}
.maplist dl:after{clear:both;display:block;content:""}
.maplist dl :hover dd,.maplist dl :hover dt{color:#77b917}
.maplist dt{float:left;width:40px;height:40px;border-radius:50%}
.maplist dd{float:right;width:370px;color:#fff}
.section6{background:url(../image/bg_6.jpg) center center no-repeat}
.section6 .container>p{margin-bottom:35px}
.news{position:relative;float:left;width:49%;height:380px}
.news .bd{width:100%;height:100%}
.news .bd>div{position:relative;width:100%;height:26.2vw;max-height:378px}
.news img{position:absolute;top:0;left:0;width:100%;height:100%}
.news dl{position:absolute;bottom:0;width:100%;height:60px;background:rgba(0,0,0,.5);color:#fff}
.news dt{position:absolute;bottom:0;box-sizing:border-box;padding-left:15px;width:100px;height:60px;background:url(../image/icon_date.png);font-size:1.1rem}
.news dt span{display:block;padding-top:5px;text-align:center;text-indent:-20px;font-size:1.5rem}
.news dd{float:right;width:calc(100% - 100px);height:100%}
.news dd p{overflow:hidden;color:#fff;text-overflow:ellipsis;white-space:nowrap;line-height:60px}
.news .next,.news .prev{position:absolute;top:calc(50% - 20px);right:10px;display:block;width:40px;height:40px;text-align:center;opacity:.5;transition:all .2s}
.news .next:hover,.news .prev:hover{color:#fff;opacity:1}
.news .prev{left:10px}
.faq{float:right;width:49%;height:380px;color:#fff}
.faq dl{overflow:hidden;margin-bottom:20px;width:100%;height:50px;background:rgba(0,0,0,.5);line-height:50px;cursor:pointer}
.faq dl:first-child dt::before{content:"01"}
.faq dl:nth-of-type(2) dt::before{content:"02"}
.faq dl:nth-of-type(3) dt::before{content:"03"}
.faq dl:nth-of-type(4) dt::before{content:"04"}
.faq dt{float:left;width:95px;height:100%;background:url(../image/icon_date.png) right;text-align:center;text-indent:-10px;font-size:2rem}
.faq dd{float:left;overflow:hidden;width:calc(100% - 95px);text-indent:10px;text-overflow:ellipsis;white-space:nowrap;font-size:1.1rem}
.faq dd a{color:#fff}
.faq p{display:none;box-sizing:border-box;margin:20px 0;padding:10px;width:100%;height:98px;border:1px solid #ccc;border-radius:4px;background:rgba(0,0,0,.5);color:#fff;font-size:16px;line-height:22px;word-break:break-word}
.section7{background:url(../image/bg_7.jpg) center center no-repeat}
.section7 .container>p{margin-bottom:40px}
.knowledge{float:left;width:49%}
.knowledge div{position:relative;margin-bottom:20px;width:100%;height:120px}
.knowledge dl{position:absolute;top:10px;left:10px;padding:3px 0;width:50px;background:#77b917;color:#fff;text-align:center;font-size:12px}
.knowledge dl dt{font-size:24px}
.knowledge img{float:left;margin-right:20px;width:180px;height:120px}
.knowledge h3{float:left;overflow:hidden;width:calc(100% - 200px);color:#77b917;text-align:left;text-transform:none;text-overflow:ellipsis;white-space:nowrap;font-size:1.2rem}
.knowledge h3+p{float:left;width:calc(100% - 200px);color:#fff;text-align:justify}
.s7video{float:right;width:49%}
.s7video img{width:100%;height:auto}
.section8{background:url(../image/bg_8.png) center center}
.section8 .index_footer{position:relative}
.section8 .fp-tableCell{vertical-align:bottom}
.s8service.container{display:flex;margin-bottom:600px;height:180px;justify-content:space-around}
.s8service dl{position:relative;overflow:hidden;box-sizing:border-box;padding-top:40px;width:300px;height:180px;border:1px solid #727272;text-align:center;transition:all .2s}
.s8service dl *{transition:all ease-in .2s}
.s8service dl:hover{border-color:#77b917}
.s8service dl:hover dd,.s8service dl:hover dt{opacity:0;transform:scale(.5)}
.s8service dl:hover p{top:0;background:#77b917}
.s8service dl:hover p:before{margin:45px auto 20px;width:100px;background:#fff}
.s8service dl:nth-child(2) dt{background-position-x:-185px}
.s8service dl:nth-child(3) dt{background-position-x:-254px}
.s8service dt{margin:0 auto 10px;width:60px;height:60px;background:url(../image/icon_index.png) -120px -15px}
.s8service dd{font-size:20px}
.s8service P{position:absolute;top:145px;box-sizing:border-box;padding:0 10px;width:100%;height:100%;background:0 0;color:#fff;text-align:justify}
.s8service P::before{display:block;margin:0 auto 50px;width:60px;height:2px;background:#727272;content:"";transition:all .3s}
footer{position:absolute;bottom:0}
@media screen and (max-width:1300px){.solutions .left{width:100%}
.solutions .right{display:none}
.map{width:100%;height:31vw;background-size:contain}
.map i{display:none}
.maplist{display:none}
.knowledge{width:100%}
.knowledge div:not(:first-child){display:none}
.s7video{float:unset;margin:0 auto;min-width:300px}
.section8{background:#333}
.s8service{display:none}
footer{position:unset;padding-top:70px}
}
@media screen and (max-width:1024px){.section2{background:#000}
.section2 .slide2{position:relative;z-index:0}
.section2 .left{width:80%;min-width:300px}
.section2 .right{position:absolute;top:80px;right:5%;z-index:-1;float:unset;min-width:300px;opacity:.4}
.solutions .right{display:none}
}
@media screen and (max-width:800px){.section3 .com_cul{display:none}
.solutions .app,.solutions .left ul li{display:none}
}
@media screen and (max-width:768px){
    .section2{padding-bottom:40px;overflow:hidden}
    .section2 span{display:none}
    .section2 .slide2 .container{clear:both;position:relative;z-index:0}
    
    .section3,.section5,.section7{background-size:cover;padding:40px 0;overflow:hidden;}
    
    .section4,.section6{background:#000;overflow:hidden;padding:40px 0;}
    .solutions .hd li{display:none}
    .solutions .hd a{width:90%}
    .solutions .left{min-width:unset}
    .solutions .left img{width:100%}
    .solutions .left ul{width:100%}
    
    .news{width:100%;height:auto}
    .section6 .news>a{display:none}
    .news .bd>div{height:56vw;max-height:auto}
    .news .bd>div:not(:first-child){display:none}
    .faq{margin-top:2rem;width:100%;height:auto}
    .faq dl{margin-bottom:0}
    .faq dt{display:none}
    .faq dd{width:100%}
    
    .section7 .knowledge{height:auto;margin-bottom:40px}
    .section7 .knowledge div{display:block;height:auto;margin-bottom:0;}
    .section7 .knowledge h3+p{display:none}
    
    .s8service.container{display:none}


footer .container.bg{background:0 0}

}
@media screen and (max-width:550px){.section2 .left ul{display:none}
.section2 .left>a{margin-top:2rem}
.knowledge dl,.knowledge img{display:none}
.knowledge h3,.knowledge h3+p{width:100%}
}
@media screen and (max-width:450px){.solutions .hd{margin:1rem auto}
.solutions .left ul h2{font-size:1.2rem}
.solutions .left ul p{margin:0}
}
