* {margin: 0;padding: 0;font-family: "Microsoft YaHei";}
body{background: #ffffff;}
h1, h2, h3, h4, h5, h6, p, ul, li {list-style: none;line-height: 120%;}

img {display: block;width: 100%;}

a {text-decoration: none;}

.content {width: 94%;margin: 0 auto;}

/*清除浮动代码*/
.clearfix:after {display: block;clear: both;content: "";visibility: hidden;height: 0}

.clearfix {zoom: 1;clear: both;}
.fl,.left{float: left;}
.fr,.right{float: right;}
.rel{position: relative;}
.abs{position: absolute;}
.center{text-align: center;}
.padding{padding: 9% 0;color: #333333;}

.div-main {max-width: 720px;min-width: 320px;margin: 0 auto;}

.nav {width: 100%;background-color: #ceccca;}
.nav a:nth-child(1) {width: 56.9%;display: block;}
.nav a:nth-child(2) {width: 43%;display: block;}
.banner {position: relative;overflow: hidden}
.banner .swiper-pagination {position: absolute;bottom: 3%;}

.banner .swiper-pagination-bullet {
    width: 5%;height: 0.4rem;border-radius: 2rem;
     opacity: 1;background-color: #fff;
}
.banner .swiper-pagination-bullet-active {
    background: #977a2d;
}

nav{ width:100%; margin:3% auto;}
nav .main{margin: 0 auto}
nav .main a{display: block;width: 31%; float: left; margin:0 1%; }

.column{width: 98%;margin: 3% auto; padding:0 1%}
.column li{float: left; width: 48%; margin-bottom:3%;}
.column li:nth-child(2n){ float: right;}

.chain{margin:0 auto 3%;}
.chain img{margin:0 auto; display:block;}


.Crumbs{background: #f4f4f4;padding: 2% 0;}
.Crumbs p{padding: 0 3%;}
.Crumbs p,.Crumbs p a{font-size: 2.4rem;color: #3d3117;}

.content {padding: 4%;}
.content .p1 {font-size: 3.2rem;color: #3d3117;text-align: center;line-height: 2;margin-bottom: 3%;}
.content .p1 span {font-size: 2.8rem;color: #ff8c00;font-weight: bold;}
.content .p2 {font-size: 2.6rem;color: #696969;text-indent: 2em;text-align: justify;margin: 4% auto;}

footer{background: #cecece;text-align: center;margin: 0 auto;padding: 5% 0;}
footer img{width: 54.3%;margin: 0 auto;}
footer p{font-size: 2.2rem;color: #FFFFFF;padding-top: 2%;}

.service,.environment{padding: 6% 0;overflow: hidden;position: relative;}
.service ul li{display: inline-block;width: 49.6%;float: left;background: #f2f8f4;text-align: center;margin-top:0.8%;padding: 11% 0;}
.service ul li:nth-child(2n+2){float: right;}
.service ul li img{width: 15.55%;margin: 0 auto 1%;}
.service ul li p{font-size: 2.6rem;color: #89abac;}
.service ul li:nth-child(2){background: #f8f2f2;}
.service ul li:nth-child(3){background: #f9f4f8;}
.service ul li:nth-child(4){background: #f7f1e3;}
.service ul li:nth-child(2) p{color: #c89289;}
.service ul li:nth-child(3) p{color: #c399b5;}
.service ul li:nth-child(4) p{color: #84734b;}

.environment h3{font-size: 3rem;color: #282828;text-align: center;padding-bottom: 3%;}
.tab{margin-top: 3%;}
.tab li{width: 19.6%;float: left;margin-left:0.4%;box-sizing: border-box;}
.tab li:nth-child(1){margin-left: 0.1%;}
.tab li.on{outline: 2px solid #ff6d5a;outline-offset: -2px;}
.environment .prev1,.environment .next1 {position: absolute;width: 6.5%;top: 42%;z-index: 2;}
.environment .prev1 {left:3%;}
.environment .next1 {right:3%;}















/*媒体查询*/
@media screen and (min-width: 720px) {
    html, body {
        font-size: 10px;
    }
}

@media only screen and (max-width: 720px), only screen and (max-device-width: 720px) {
    html, body {
        font-size: 10px;
    }
}

@media only screen and (max-width: 640px), only screen and (max-device-width: 640px) {
    html, body {
        font-size: 8.88888888888889px;
    }
}

@media only screen and (max-width: 600px), only screen and (max-device-width: 600px) {
    html, body {
        font-size: 8.333333333333334px;
    }
}

@media only screen and (max-width: 540px), only screen and (max-device-width: 540px) {
    html, body {
        font-size: 7.5px;
    }
}

@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
    html, body {
        font-size: 6.666666666666666px;
    }
}

@media only screen and (max-width: 414px), only screen and (max-device-width: 414px) {
    html, body {
        font-size: 5.75px;
    }
}

@media only screen and (max-width: 400px), only screen and (max-device-width: 400px) {
    html, body {
        font-size: 5.555555555555555px;
    }
}

@media only screen and (max-width: 375px), only screen and (max-device-width: 375px) {
    html, body {
        font-size: 5.208333333333334px;
    }
}

@media only screen and (max-width: 360px), only screen and (max-device-width: 360px) {
    html, body {
        font-size: 5px;
    }
}

@media only screen and (max-width: 320px), only screen and (max-device-width: 320px) {
    html, body {
        font-size: 4.444444444444445px;
    }
}