/* 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: #effaff;}
.main-special{width:100%; height:auto;background-color: #effaff;}
.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:#000;
    height:auto;
    width:100%;
    padding-top:0.2rem;
    margin-bottom:0.08rem;
    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;
}
.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 0.1rem;
}
.box .anli li p{
    text-align: center;
    font-size: 0.15rem;
    margin:0.1rem auto;
}
.btn1{
    background: #ee3030;
    width:auto;
    margin:0.1rem 0 0.1rem;
    color:#fff;
    text-align: center;
    
}
.btn1 a{font-size: 0.16rem;}
.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;background-color:#effaff;}
.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 #054766;color:#11516f;font-size:0.18rem;text-align: center;padding:0.15rem 0;}

.s-area-3 { position: relative; background: #fff;}
.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:#11516f;
    text-align: center;
}
.swiper-slide div h3{margin:0.1rem 0 0.05rem;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: #fff;}
.yatao-list{position: relative;width:100%;margin:0 auto;}
.yatao{position: absolute;top:0.1rem;left:0;width:100%;text-align: center;z-index: 11;}
.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: #11516f;margin:0.05rem 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;  background: #fff;}
.box-lc{margin-bottom:0.2rem;}
.box-lc ul li{border:1px solid #11516f;border-radius: 5px;padding:0.02rem;}
.box-lc ul li h3{margin:0.06rem auto;font-size: 0.25rem;width:0.3rem;height: 0.3rem;border: #c3c2c2 1px solid;border-radius: 50%;color: #11516f;}
.box-lc ul li h4{margin:0.08rem auto;font-size:0.2rem;color:#11516f;}
.s-area-6 {position: relative; background: #fff;padding-bottom:0.2rem;}


.s-area-7 { position: relative;background: #fff;}
.pinpai-box .hd ul{
    display: -webkit-flex;
    display: flex;
    padding:0;
}
.pinpai-box .hd ul li{
    flex:1;
    margin:0 0.02rem;
    border: #04334b 1px solid;
    color:#04334b;
    font-size: 0.18rem;
    text-align: center;
}
.pinpai-box .hd ul li.on{
    border: none;
    color: #fff;
    background-color: #04334b;
}
.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;}

.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; }
