* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
*:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
html, body, h1, h2, h3, h4, h5, h6, hr, p, iframe, dl, dt, dd, ul, ol, li, pre, form, button, input, textarea, th, td, fieldset { margin: 0; padding: 0 }
ul, ol, dl { list-style-type: none }
html, body { *position:static; overflow-x: hidden;
}
body { background-color: #ffffff; font-family: Microsoft YaHei, helvetica, Arial, Hiragino Sans GB; overflow-y: auto; width: 100%; margin: 0px; padding: 0; font-size: 14px; color: #333; line-height: 1.6 }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
table { border-collapse: collapse; border-spacing: 0; }
ol, ul { list-style: none; padding: 0; margin: 0; }
ul li { padding: 0; margin: 0; }
.vm { vertical-align: middle; }
.vtb { vertical-align: text-bottom; }
.vt { vertical-align: top; }
.tcenter { text-align: center; }
.tleft { text-align: left; }
.tright { text-align: right; }
.fl { float: left }
.fr { float: right; }
.clear { clear: both; }
.fc0 { color: #000000; }
.fc3 { color: #333333; }
.fc4 { color: #444; }
.fc6 { color: #666666; }
.fc9 { color: #999999; }
.fcr { color: red !important; }
.fcw { color: white; }
a { text-decoration: none; cursor: pointer; color: #333; }
a:hover { text-decoration: none; outline: none }
a.ie6:hover { zoom: 1 }
a:focus { outline: none }
a:hover, a:active { outline: none }
:focus { outline: none }
.fs14 { font-size: 14px; }
.fb { font-weight: bold }
.container { width: 1200px; margin: 0 auto; }
.posrelative { position: relative }
@media screen and (max-width: 768px) {
    .container { width: 100%; margin: 0 auto; }
}
.ml-10 { margin-left: 10px; }
.ml-20 { margin-left: 20px; }
.mr-10 { margin-right: 10px; }
.mr-20 { margin-right: 20px; }
.mt-10 { margin-top: 10px; }
.mt-20 { margin-top: 20px; }
.mb-10 { margin-bottom: 10px; }
.mb-20 { margin-bottom: 20px; }
.m-10 { margin: 10px; }
.m-20 { margin: 20px; }
.p-10 { padding: 10px; }
.p-20 { padding: 20px; }
/* 表格样式 */
table { width: 100%; border: 0; text-align: left; border-collapse: collapse; border-spacing: 0; margin-top: 20px; }
table th { background: #f2f4fa; font-weight: normal; line-height: 40px; font-size: 14px; color: #444; font-weight: 700; padding-left: 10px; box-sizing: border-box }
table tr:nth-child(odd) { background: #fff; }
table td:nth-child(even) { height: 50px; }
table td { height: 50px; padding-left: 10px; box-sizing: border-box }
table tr:hover { background: #f4f5f7; }
table td, table th { border: 1px solid #EEE; }
/** 表单鼠标移动上去出现蓝色阴影效果 **/



.form-control { display: block; width: 250px; height: 34px; padding: 0px 5px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; }
/*动画时间*/

.trans1 { transition: all 1s; -moz-transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s; }
.trans04 { transition: All 0.4s ease-in-out; -webkit-transition: All 0.4s ease-in-out; -moz-transition: All 0.4s ease-in-out; -o-transition: All 0.4s ease-in-out; }
/* 以上是公共样式 */
.header{ width: 100%; height: 60px; background: #1c1c1d; position: fixed; top: 0px; left: 0px; z-index: 9;}
.header .navlist{ width: 100%;}
.header .navlist li{ width: 20%; float: left; text-align: center; line-height: 60px; transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s;  }
.header .navlist li a{ color: #fff; display: block; }
.header .navlist li:hover{ background: url(../images/navbg.png) no-repeat center center; }
.header .navlist li:hover a{ color: #ffffff; }
.header .navlist li:hover.logo{ background: none;}
.header .navlist li.active{ background: url(../images/navbg.png) no-repeat center center; }


.header .appnav{ width: 100%; display: none;}
.header .appnavmain{ width: 90%; background: #fff; border-radius: 5px; padding: 0.5rem; position: fixed; top: 70px; box-shadow: 0 0 20px #ccc; left: 5%; display: none; }
.header .appnavmain .appnavlist{ width: 100%; }
.header .appnavmain .appnavlist li{ width: 100%; border-bottom: 1px solid #EEE;  padding: 1rem;}
.header .appnavmain .appnavlist li a{ display: block;}
.header .appnavmain .appnavlist li:nth-last-child(1){ border: none;}
.logo img { height: 75px;}







@media screen and (max-width: 768px) {
    .header .pcnav{ display: none;}
    .header .appnav{ width: 100%; display: block;}
    .header .appnav .logo{ margin-top: 10px;}
    .header .appnav .logo img{ height: 35px;}
    .header .appnav .mulu{ margin-top: 18px;}
    .header{ width: 100%; height: 55px; }
    .header .appnav .mulu img{ width: 22px;}


}

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeInUp {
    from {
        opacity: 0;
        visibility: hidden;
        /*-webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);*/
        -webkit-transform: translate3d(0, 40px, 0);
        transform: translate3d(0, 40px, 0);
    }

    to {
        opacity: 1;
        /*visibility: visible;*/
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        visibility: hidden;
        /*-webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);*/
        -webkit-transform: translate3d(0, 40px, 0);
        transform: translate3d(0, 40px, 0);
    }

    to {
        visibility: visible;
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}
.bannerer{ margin-top: 60px; height: 420px; background: url(../images/banner.jpg) no-repeat center 50%;}
.bannerer111{ margin-top: 5px; height: 420px; background: url(../images/dlsbanner.jpg) no-repeat center 50%;}
@media screen and (max-width: 768px) {
    .bannerer{  height: 200px; background-size: 225%;  }

}

.bannertext{ color: #fff; width: 38%; float: right; margin-top: 150px;}
.bannertext h3{ font-size: 26px; line-height: 30px; margin-bottom: 10px;}

@media screen and (max-width: 768px) {
    .bannerer{ margin-top: 55px; width: 100%; height: 200px; background: url(../images/appbanner.jpg) no-repeat left center; background-size: 100% 100%;}
    .bannerer111{ margin-top: 5px; width: 100%; height: 220px; background: url(../images/dlsappbanner.jpg) no-repeat left center; background-size: 100% 100%;}
    .bannertext{ color: #fff; width: 60%; float: right; margin-top: 65px;}
    .bannertext h3{ font-size: 16px; line-height: 30px; margin-bottom: 10px;}

}





.titleer{ width: 100%; text-align: center; margin-top: 10px;  position: relative; margin-bottom: 20px;   }
.titleer h3{ font-size: 30px; text-transform: uppercase; background: #fff; padding: 0 20px; display: inline-block;}
.titleer p{ font-size: 20px; color: #999; font-size: 16px;}
.titleer:after{ content: ""; width: 100%; height: 1px; background: #EEE; position: absolute; top: 25px; left: 0px; z-index: -1;}

/* 下载 */
.downloader{ padding: 10px 150px; }
.downloader .downlist{ position: relative; border: 1px solid #e7e7e7; cursor: pointer; border-radius: 5px; padding: 50px 30px; text-align: center; box-sizing: border-box; -webkit-transition: 0.5s;
                       -o-transition: 0.5s;
                       transition: 0.5s;  margin: 0 auto; margin-top: 10px;  }
.downloader .downlist .downlistico{ width: 100px; height: 100px; border: 1px dashed #05a6f3; border-radius: 100%; text-align: center; 
                                    margin: 0 auto; position: relative; }
.downloader .downlist .downlistico img{  position: absolute;top: 50%;left: 50%; transform: translate(-50%,-50%);}
.downloader .downlist .downlistbottem{ margin-top: 10px; }
.downloader .downlist .downlistbottem h3{ font-size: 18px;}
.downloader .downlist .downlistbottem p{ color: #999999; margin-top: 10px; display: block;}
.downloader .downlist .downlisterweima{ width: 100%; position: absolute; left: 0px; top: 0px;   text-align: center; padding: 5px; box-sizing: border-box; display: none; 

}

.downloader .downlist .downlisterweima .erweima{ border: 1px solid #EEE; display: inline-block; margin-top: 5px; width: 150px; height: 150px ;  }

.downloader .downlist .downlisterweima .erweima img{ width: 100%; height: 100%;}
.downloader .downlist  .downlisterweimabtn{ width: 150px; margin: 0 auto; background: #05a6f3; line-height: 40px; border-radius: 4px; color: #fff; margin-top: 20px; }
.downloader .downlist  .downlisterweimabtn a{ color: #fff;}
.downloader .downlist:hover .downlisterweima{ display: block;}
.downloader .downlist:hover{ box-shadow: 0px 0px 20px  rgba(186, 186, 186, 0.4); transform: translateY(-10px); }

.downlister{  margin: 0 auto;}

@media screen and (max-width: 768px) {
    .downloader{ padding: 15px ; font-size:1rem  !important }
    .downloader img{ width:100% }
    .downloader h2{ width:100% !important;font-size:1rem  !important }
    .downloader h3{ width:100% !important;font-size:1rem  !important }
    .downloader .downlist{width: auto; height: 215px;}
    .downlister{ width: 100%; }
    .downloader .downlist .downlisterweima .erweima img{ width: 100%;  }
    .downloader .downlist .downlisterweima .downlisterweimabtn{ width: 100%;}
    .downloader .col-6{ padding: 5px;}
    .downloader .downlist  .downlisterweimabtn{ width: 110px; margin: 0 auto; background: #05a6f3; line-height: 40px; border-radius: 4px; color: #fff; margin-top: 15px; }
    .downloader .downlist .downlistbottem p{ color: #999999; margin-top: 10px; display: none;}
    .titleer:after{ content: ""; width: 100%; height: 1px; background: #EEE; position: absolute; top: 22px; left: 0px; z-index: -1;}
    .downloader .downlist{ position: relative; border: 1px solid #e7e7e7; cursor: pointer; border-radius: 5px; padding: 20px 10px; text-align: center; box-sizing: border-box; -webkit-transition: 0.5s;
                           -o-transition: 0.5s;
                           transition: 0.5s;  margin: 0 auto; margin-top: 10px;  }
    .titleer h3{ font-size: 24px; }
    .downloader .downlist .downlisterweima{     top: 10px; }
    .downloader .downlist .downlistbottem h3{ font-size: 16px;}
    .downloader .downlist .downlisterweima .erweima{ width: 140px; height: 140px; }
    .downloader .downlist .downlisterweima{ display: none;}
    .downloader .downlist:hover .downlisterweima{ display: none;}
    .downloader .downlist .downlistico{ width: 80px; height: 80px;  }
    .downloader .downlist .downlistico img{  width: 60%;}


}

/* 推荐 */
.tuijianer{ width: 100%; height: 560px; background: url(../images/bg1.jpg) no-repeat top center; margin-top: 0px; background-size: 100% 100%;}

#certify {
    position: relative;
    width: 1200px;
    margin: 0 auto; margin-left: -50px;
}

#certify .swiper-container {
    padding-bottom: 60px;
}

#certify  .swiper-slide {
    width: 180px;
    height: 300px;
    background: #302d4c;
    box-shadow: 0 20px 20px rgba(0,0,0,.075);

}
#certify  .swiper-slide img{
    display:block; height: 100%; width: 100%; border-radius: 10px;
}


#certify .swiper-pagination {
    width: 100%;
    bottom: 20px;
}

#certify .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px;
    border: 1px solid #fff;
    background: none;
    width: 10px;
    height: 10px;
    opacity: 1;
}
#certify .swiper-pagination-bullets .swiper-pagination-bullet-active {
    border: 1px solid #fff;
    background-color: #fff;
}
#certify .swiper-button-prev {
    left: -80px;
    width: 45px;
    height: 45px;
    background: url(../images/wm_button_icon.png) no-repeat;
    background-position: 0 0;
    background-size: 100%;
}
#certify .swiper-button-prev:hover {
    background-position: 0 -46px;
    background-size: 100%
}
#certify .swiper-button-next {
    right: -80px;
    width: 45px;
    height: 45px;
    background: url(../images/wm_button_icon.png) no-repeat;
    background-position: 0 -93px;
    background-size: 100%;
}

#certify .swiper-button-next:hover {
    background-position: 0 -139px;
    background-size: 100%
}
.titer{ text-align: center; width: 100%; padding: 50px;}
.titer{ color: #fff; text-align: center; font-size: 30px; text-transform: uppercase; text-align: center; display: inline-block; }
.pctuijian{ display: block; }
.apptuijian{ display: none;}



@media screen and (max-width: 768px) {
    .pctuijian{ display: none; }
    .titer{ font-size: 24px;  }
    .apptuijian img{ border: 3px solid rgba(255,255,255,.075);}
    .apptuijian{ display: block;}
    .pcsmalllistleft{ display: none;}
    .titer{ text-align: center; width: 100%; padding: 20px;}
    .tuijianer{ height: auto; padding-bottom: 20px;}

}

.smalltuijianer{ margin-top: 30px;}
.pcsmallimg{ width: 100%; margin-top: 20px;}
.pcsmalllisttit{ width: 100%; color: #fff; background: rgba(0,0,0,.75); position: absolute; bottom: 0px; left: 0px; padding: 10px; box-sizing: border-box; text-transform: uppercase;}
.pcsmalllistleft{ width: 300px;  transition: 0.5s; overflow: hidden; height: 420px; }
.pcsmalllistleft img{ width: 100%; height: 420px;  transition: 0.5s;}
.pcsmalllist{ width:260px; transition: 0.5s;}
.flex{ display: flex;}
.pcsmalllist{ width: 260px; margin-left: 10px;}
.pcsmalllisttop{ width: 260px; height: 205px; margin-top: 10px; overflow: hidden; transition: 0.5s;}
.pcsmalllist img{ width: 100%; height: 100%; transition: 0.5s;}
.pcsmalllisttop:nth-child(1){ margin-top: 0px;}

.pcsmalllist img:hover, .pcsmalllistleft img:hover{ box-shadow: 0px 0px 20px  rgba(186, 186, 186, 0.4); transform: scale(1.2, 1.2);
                                                    -ms-transform:scale(1.2, 1.2); 	/* IE 9 */
                                                    -moz-transform:scale(1.2, 1.2); 	/* Firefox */
                                                    -webkit-transform:scale(1.2, 1.2); /* Safari 和 Chrome */
                                                    -o-transform:scale(1.2, 1.2);  }
.pcsmalllisttop:hover{ transform: translateY(-5px); box-shadow: 0px 0px 20px  rgba(186, 186, 186, 0.4);  }
.pcsmalllistleft:hover{ transform: translateY(-5px); box-shadow: 0px 0px 20px  rgba(186, 186, 186, 0.4); }
.appsmallimg{ display: none;}


@media screen and (max-width: 768px) {
    .appsmallimg{ display: block; margin-top: 0px;}
    .pcsmallimg{ display: none;}
    .appsmallimg{ width: 100%;}
    .appsmallimg ul li{ width: 48%; margin: 5px 1%; position: relative; transition: 0.5s; float: left; overflow: hidden;}
    .appsmallimg ul li img{ width: 100%;  transition: 0.5s;}
    .appsmallimg ul li .appsmalllisttit{ width: 100%; color: #fff; background: rgba(0,0,0,.75); position: absolute; bottom: 5px; left: 0px; padding: 2px 5px; box-sizing: border-box;}
    .appsmallimg ul li:hover{ transform: translateY(-5px); box-shadow: 0px 0px 20px  rgba(186, 186, 186, 0.4); }
    .appsmallimg ul li:hover img{ transform: scale(1.2, 1.2);
                                  -ms-transform:scale(1.2, 1.2); 	/* IE 9 */
                                  -moz-transform:scale(1.2, 1.2); 	/* Firefox */
                                  -webkit-transform:scale(1.2, 1.2); /* Safari 和 Chrome */
                                  -o-transform:scale(1.2, 1.2); }
    .titer h3{  font-size: 24px;}

}

.btner{ width: 100%;  background:url(../images/btnbg.jpg) no-repeat top center; margin-top: 50px; padding-bottom: 50px; background-size: 100% 100%;   }
.titer p{ font-size: 16px;}
.downbtn{ text-align: center;  width: 100%;}
.downbtn a{ padding: 10px 35px; min-width: 185px;  background: #eaeaee; border-radius: 5px; color: #29aced; margin:  5px; transition: 0.5s; display: inline-block; }
.downbtn a i{ margin-right: 5px;}
.downbtn a:hover{ transform: translateY(-10px); box-shadow: 0px 0px 20px  rgba(186, 186, 186, 0.4);}

@media screen and (max-width: 768px) {
    .downbtn a{ width: 45%; padding: 10px 0px; box-sizing: border-box; min-width: auto;}
    .btner{ padding-bottom: 20px;}
    .btner{ width: 100%;  background:url(../images/btnbg.jpg) no-repeat top center; margin-top: 20px; padding-bottom: 50px; background-size: 100% 100%;   }
    .downbtn a:nth-child(3){ margin-top: 1rem;}
    .downbtn a:nth-child(4){ margin-top: 1rem;}



}

.footer{ width: 100%; background: #000000; color: #6f6f6f;}
.footlogo { opacity: 0.5; margin-top: 20px;}
.footright{ margin-left: 100px; border-left: 1px solid #161313; padding-left: 100px; box-sizing: border-box;}
.footer .footnav a{ margin: 10px 20px; margin-top: 40px;  color: #6f6f6f; }
.foot{ width: 900px; margin: 0 auto;}

@media screen and (max-width: 768px) {
    .footlogo{ display: none;}
    .footright{ margin-left: 0px; border-left:none; padding-left: 0px; box-sizing: border-box;}
    .footer .footnav a{  margin: 10px 5px;
                         /* margin-top: 20px; */
                         display: inline-block;
                         line-height: 0px; }
    .foot{ width: 100%; margin: 0 auto; padding-bottom: 20px;}
}

.nybannerer{ margin-top: 60px; height: 420px; background: url(../images/nybanner.jpg) no-repeat center 50%;}
.contacter{ width: 100%; background: #f8f8f8; padding: 50px 0px;}
.nytitle{ margin-bottom: 30px; margin-left: 20px;}
.nytitle h3{ font-size: 30px; text-transform: uppercase;}
.nytitle span{ width: 100px; height: 1px; background: #e3e2e2; display: inline-block;}
.coninfo{ border-left: 1px solid #EEE; padding-left: 25px; margin-left: 20px;}
.coninfo h3{ font-size: 24px;}
.coninfo p{ color: #999;}
.conimg{ margin-top: 15px;}


@media screen and (max-width: 768px) {
    .nybannerer{  height: 200px;background-size: 225%; margin-top: 40px; }
    .nytitle h3{ font-size: 24px; text-transform: uppercase;}
    .contacter{ width: 100%; background: #f8f8f8; padding: 20px 0px;}
    .nytitle{ margin-bottom: 5px; margin-left: 20px;}
}

.yinsimain{ background: #fff; padding: 50px; box-sizing: border-box; width: 100%; margin-top: 65px; border-radius: 5px; margin-bottom: 50px;}

.yinsimaintitle{ font-size: 24px; text-align: center; }

.login{ display: inline-block; border: 1px solid #687282; text-align: center; padding: 5px 15px; position: absolute; right:20px; top: 14px;
        border-radius: 50px;
}
.login a{ color: #fff;}

@media screen and (max-width: 768px) {
    .login{ display: inline-block; border: 1px solid #687282; text-align: center; padding: 5px 15px; position: absolute; right:60px; top: 10px;
            border-radius: 50px;
    }
}

.yinsimain{ margin-top: 90px;}

.huodong{ position: fixed; bottom: 80px; right: 20px; cursor: pointer;z-index: 999999}
.huodong img,.huodong1 img{ width: 300px; height: 200px;}
.huodong1{  position: fixed; bottom: 80px; left: 20px; cursor: pointer;z-index: 999999}
@media screen and (max-width: 768px) { 
    .huodong, .huodong1{ display: block;  bottom: 300px;}
    .huodong img,.huodong1 img{ width: 150px; height: 100px;}
}


.hdbannerer{ margin-top: 60px; height: 200px; width: 100%; background: url(../images/hdbanner.jpg) no-repeat center 50%;}


.hdclose img{ width: 25px; height: 25px; position: absolute; right: 0px;}