/* CSS Document */
@media screen and (min-width: 640px) {
    html {
      font-size: 100px; 
    text-align: center;} }
@media screen and (max-width: 640px) {
    html {
    font-size: 80px; 
   text-align: center;}
    }
@media screen and (max-width: 320px) {
    html {
    font-size: 60px; 
   text-align: center;} }
a{text-decoration: none;color:#fff}
/* a.color{color: #993399;} */
body{overflow-x:hidden;max-width:640px;margin:0 auto;min-width: 320px;}
p{text-align: left;}
li{list-style: none;}
a:link{text-decoration: none;}
a:visited{text-decoration: none; }
a:hover {text-decoration: none;}
a:active{text-decoration: none;}
.clear{clear:both;}
.hide{display:none;}
img{width:100%;margin:0 auto;}
ul{padding:0;margin:0;}
.dw-grid-wrapper{width:100%;height:auto;background-color: #fef2e2;}
.main-special{width:100%; height:auto;background-color: #fef2e2;}
.main-center{width:100%; height:auto; margin:0 auto; display:block;}
.main-centers{width:100%; height:auto; margin:0 auto; display:block;}
.title{
    text-align: center;
    color:#ff6c3a;
    height:auto;
    width:100%;
    padding-top:0.25rem;
    margin-bottom:0.1rem;
/*     background: #fff; */
}
/* hr{
    border-top:1px solid #000;
    margin:0;
}
.title1{
    margin-top:1.5rem;
}
@media screen and (min-width: 640px) {
    .title1 {
     margin-top:2.1rem; } }
@media screen and (max-width: 640px) {
    .title1 {
    margin-top:1.5rem; }
    }
@media screen and (max-width: 320px) {
    .title1 {
    margin-top:1.6rem; } } */
.title h3{
    margin:0px auto;
    font-size: 0.25rem;
    font-weight: 600;
}
.title p{font-size: 0.18rem;padding:0.1rem 0.2rem;color:#000;margin:0 auto;text-align: center;}
@media (min-width: 321px) and (max-width: 349px) {
   .s-area-4-text .title p{
        font-size: 0.15rem;
        padding-top:0.05rem;
    }
}
@media (min-width: 350px) and (max-width: 380px) {
   .s-area-4-text .title p{
        padding-top:0.05rem;
    }
}
@media screen and (min-width: 450px) {
   .s-area-4-text .title p{
        padding-top:0.15rem;
    }
}
.box{
   /*  background-color:#fff; */
    width:100%;
    margin:0 auto;
    height:auto;
    position: relative;
    text-align: center;
}
.s-area-5 .box ul{
    display: flex;
    display: -webkit-flex;
    width:98%;
    margin:0 auto;
    padding:0.2rem 0 0;
}
.s-area-5 .box ul li{
    flex:1;
    margin-right:0.15rem;
    height:1.5rem;
}
@media screen and (max-width: 320px) {
    .s-area-5 .box ul li{
        height:1.65rem;
    }
}
.s-area-5 .box ul li:last-child{
    margin-right:0;
}
.s-area-5 .box ul li p{
    font-size:0.15rem;
    margin:0 0 0.06rem;
    text-align: center;
}
.box .anli{
    display: -webkit-flex;
    display: flex;
    width:100%;
    padding:0.2rem 0px 0rem;
    margin:0 auto;
}
.box .anli li{
    flex:1;
    margin:0.1rem;
 /*    display: -webkit-flex;
    display: flex; */
}
.box .anli li p img{vertical-align: middle; height:0.5rem;width: auto;margin-right: 0.1rem;}
.box .anli li p{
    text-align: center;
    font-size: 0.18rem;
    /* margin:0.1rem auto; */
    /* line-height: 0.25rem; */
    padding:0;
    text-align: center;
}
@media screen and (max-width: 320px) {
    .box .anli{padding-top:0.4rem;}
}
@media screen and (min-width: 410px) {
    .box .anli{padding-top:0.4rem;}
}
@media (min-width: 321px) and (max-width: 346px) {
    .box .anli li p img{
        height:0.4rem;
    }
    .box .anli li p{
        font-size: 0.15rem;
    }
}
@media (min-width: 347px) and (max-width: 374px) {
    .box .anli li p{
        font-size: 0.16rem;
    }
}
.btn1{
    background: #ff6c3a;
    width:auto;
    margin:0.1rem 0 0.1rem;
    color:#fff;
    text-align: center;
    border-radius: 30px;
    padding:0.05rem 0.15rem;

}
.btn1 a{font-size: 0.16rem;}
.btn1>a>span>img{width:0.25rem;height:auto;vertical-align: middle;}
/* .btn2{
    background: url(../images/btn1.png)no-repeat top;
    height:30px;
    background-size: 100% 100%;
    width:auto;
    margin:0.25rem 0 0.25rem;
    color:#fff;
    text-align: center;
    font-size:12px!important;
}
@media screen and (min-width: 640px) {
    .btn2 {
     margin-top:0.5rem; } } */

.dw-grid-container { width:100%;margin:0 auto;position: absolute;top:0;height:100%;}
.dw-grid-container .img-responsive{width:auto;margin:0 auto;}
.s-area-1 { position: relative;}
.s-area-1 img { display:block; }

.s-area-2 { position: relative;}
.s-area-2-text{background: #fff;height:auto;border-radius: 5px;width:96%;margin:0.2rem auto;}
.s-area-2-text ul{display: -webkit-flex;display: flex;padding:0 0.05rem;}
.s-area-2-text ul li{flex:1;margin:0.1rem 0.05rem;border:1px solid #ff6c3a;color:#ff6c3a;font-size:0.18rem;text-align: center;padding:0.15rem 0;}

.s-area-3 { position: relative; background: #fff;width:98%;margin:auto;margin-bottom:0.2rem;box-shadow: #c3c2c2 0px 2px 4px;}
.swiper-container {
            width: 100%;
            height: 100%;
}
.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    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;
}
.swiper-slide div{
    color:#000;
    text-align: center;
    width:98%;
    margin:0 auto;
}
.swiper-slide div h3{margin:0.2rem 0 0.1rem;font-size: 0.25rem;}
.swiper-slide div p{margin:0 0 0.3rem;font-size:0.18rem;text-align: center;}
/* .beizhu-box{width:100%;margin:0 auto;position: relative;}
.beizhu-img{position: absolute;top:0;left:5%;background:url(../images/beizhu.png)no-repeat top;height:0.3rem;color:#fff;width:0.8rem;background-size:100% 100%;line-height: 0.28rem;}
.beizhu{
    background: #f4f4f4;
    width:96%;
    margin: 0 auto 0.2rem;
    padding:0.2rem;
    border-radius: 0.2rem;
}
.beizhu p{
    margin-bottom:0;
    text-indent: 0.3rem;
} */

.left-box,.right-box{
    flex:1;
    text-align: center;
}
.left-thum{
    width: auto;
    height:0.3rem;
    float:left;
    margin:0;
}
.right-box ul li{
    display: flex;
    display: -webkit-flex;
    text-align: left;
    margin:0.02rem 0 0 0.1rem;
}

@media screen and (max-width: 320px) {
    .right-box ul li{
    margin:0.02rem 0 0 0;
} }
.right-box ul li p{
    margin:0;
    font-size:0.15rem;

}
.s-area-4 {position: relative; background: #fef2e2;width:98%;margin:0 auto;}
.s-area-4-text{position: absolute;width:100%;top:0;left:0;}
.yatao-list{position: relative;width:100%;margin:0 auto;}
.yatao{position: relative;width:100%;text-align: center;}
.yatao ul{display: -webkit-flex;display: flex;}
.yatao ul li{flex: 1;margin:0.05rem;}
/* .yatao ul li img{padding:0.05rem 0.1rem;} */
.yatao ul li h4{font-size:0.16rem;color: #000;margin:0.1rem 0 0;}
@media screen and (max-width: 360px) {
    .yatao ul li h4{font-size: 0.15rem;}
}
.yatao ul li p{font-size: 0.15rem;text-align: center;margin:0;}
/* .yatao-bg{height:0.8rem;width:100%;margin: 0 auto;}

@media screen and (max-width: 340px) {
    .yatao-bg{height: 1rem;}
}
@media screen and (max-width: 320px) {
    .yatao-bg{height: 1.3rem;}
}
@media screen and (min-width: 370px) {
    .yatao-bg{height: 0.5rem;}
} */
@media screen and (min-width: 410px) {
    .yatao ul li h4{font-size: 0.18rem;}
    .yatao{top:0.15rem;}
}
@media screen and (min-width: 640px) {
    .yatao ul li h4{font-size: 0.2rem;}
    .yatao-bg{height:0rem;}
    .yatao .btn1{margin-top:0.2rem; }
}
.btn-list{
    width:100%;
    display: -webkit-flex;
    display: flex;
}
.btn-list div{
    flex:5;
}
@media screen and (min-width: 640px) {
    .btn-list div{
    flex:1;
}}
.s-area-5 { position: relative;  }
.box-lc ul{display: -webkit-flex;display: flex;width:100%;}
.box-lc{margin-bottom:0.2rem;}
.box-lc ul li{border:1px solid #000;flex: 1;margin-right:0.1rem;position: relative;border-top:none;margin-top:0.9rem;padding-top:0.8rem;}
.box-lc ul li:last-child{margin-right: 0;}
.box-lc ul li .top-img{position: absolute;z-index: 11;left:0;top:0;transform: translateY(-50%);}
.box-lc ul li h3{margin:0.1rem auto;font-size: 0.2rem;color: #ff6c3a;}
.box-lc ul li h4{margin:0.2rem  auto;font-size:0.18rem;color:#000;}
.box-lc ul li p{font-size: 0.15rem;margin:0 auto 0.05rem;text-align: center;}
.box-lc ul li p img{height:0.09rem;display: inline-block;vertical-align: inherit;width:auto;}
@media screen and (min-width:400px){.box-lc ul li p img{height:0.13rem;}}
@media screen and (min-width:450px){.box-lc ul li{margin-top:1rem;padding-top:1rem;}}
@media screen and (min-width:640px){.box-lc ul li{margin-top:1.2rem;padding-top:1.1rem;}}
.s-area-6 {position: relative; margin:0 auto;margin-bottom:0.2rem;margin-top:0.1rem;width:98%;}


.s-area-7 { position: relative;background: #fff;margin-bottom:0.2rem;box-shadow: #c3c2c2 0px 1px 3px;}
.pinpai-box .hd ul{
    display: -webkit-flex;
    display: flex;
    padding:0;
}
.pinpai-box .hd ul li{
    flex:1;
    margin:0 0.02rem;
    border: #ff6c3a 1px solid;
    color:#ff6c3a;
    font-size: 0.18rem;
    text-align: center;
    padding:0.05rem 0;
}
.pinpai-box .hd ul li.on{
    border: none;
    color: #fff;
    background-color: #ff6c3a;
}
.pinpai-box .bd {
    width:96%;
    margin:0 auto;
    text-align: center;
}
.pinpai-box .bd ul li{
    width:100%;
    margin:0 auto;
}
.pinpai-box .bd ul li img{
    width:100%;
}

.s-area-8 { position: relative; background: #fff;margin-bottom:0.85rem;}

.table-bordered tbody tr td{
    border: #000 1px solid;
    width:36%;
    padding:8px;
    vertical-align: middle;
    text-align: left;
    font-size:0.15rem;
}
.table-bordered tbody tr td:first-child{
    width:28%;
    text-align: center;
    font-size:14px;
}
.table-bordered tbody tr td:last-child{
    color:#767778;
}
.s-area-9 { position: relative; margin-bottom:0.8rem;}
.area-9-box{position: absolute;width: 60%;right:0;top:55%;height:auto;padding-left:5%;padding-right:1%;}
/* .area-9-box h3{font-size:0.19rem;color:#f13062;line-height: 0.25rem;margin-top:0;}
.area-9-box h4{font-size:0.18rem;color:#000;line-height: 0.25rem;} */
.area-9-box .btn-9-box{background: #f13062;color: #fff;border-radius: 20px;font-size: 0.15rem;margin-top:0.15rem;box-shadow: 2px 2px 5px #d12955;}
@media screen and (max-width: 330px) {
    .area-9-box{
    right:3%;
}}

.layui-layer { background-color:transparent; box-shadow:none;  }
.layui-layer-close { top:20px !important; right:-10px !important; }