@charset "utf-8";
*{-webkit-box-sizing: border-box; box-sizing: border-box; outline: none; -webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;}
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div,menu,dl,dt,dd,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{border: 0;padding: 0;margin: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section,summary{display: block;}
body,th,td,button,input,select,textarea{font-family:"Microsoft Yahei","Hiragino Sans GB","Helvetica Neue",Helvetica,tahoma,arial,Verdana,sans-serif,"WenQuanYi Micro Hei","\5B8B\4F53";font-size:12px; line-height: 1.6; color: #333;-webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:rgba(255,255,255,0);}
input,button{overflow: visible;vertical-align:middle;outline:none;-webkit-appearance:none; border:none;}
ul,ol,dl{list-style-type:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
i,em{ font-style:normal;}
a{color:#333;text-decoration:none;}
a:link{color:#333;text-decoration:none;}
img{border:0;vertical-align:middle;}
html{font-size: 42.6667px;}
/*{word-wrap:break-word;}//英文强制换行*/
body{margin: 0 auto; padding-bottom: 1.6rem; background: #f6f6f6; overflow-x: hidden;}
.pb11{ padding-bottom: 1.1rem!important;}
/*display*/
.dn{display: none;}
.db{display: block;}
/*img*/
.img{max-width: 100%;}
.img10{width: 100%; height: 100%;}
/*其他*/
.rel{position: relative!important;}
.ovn{overflow: hidden!important;}
.bgf{ background: #fff!important;}
.bgf6{ background: #f6f6f6!important;}
/*浮动*/
.fl{ float: left;}.fr{float: right!important;}
.clearfix:after{display:block;content:"clear";height:0;clear:both;visibility:hidden}
.clearfix{ *zoom: 1;}
/*font*/
.f9{font-size: 9px!important;}.f10{font-size: 10px!important;}.f11{font-size: 11px!important;}.f12{font-size: 12px!important;}.f13{font-size: 13px!important;}.f14{font-size: 14px!important;}.f15{font-size: 15px!important;}.f16{font-size: 16px!important;}.f17{font-size: 17px!important;}.f18{font-size: 18px!important;}.f19{font-size: 19px!important;}.f20{font-size: 20px!important;}.f21{font-size: 21px!important;}.f22{font-size: 22px!important;}.f23{font-size: 23px!important;}.f24{font-size: 24px!important;}
.ti2 { text-indent:2em;}.tc{text-align:center;}.tl{text-align: left;}.tr{text-align: right;}
.fwb{font-weight: bold;}.fwn{font-weight: normal;}
/*radius*/
.radius1{border-radius: 1px; -webkit-border-radius: 1px;}
.radius2{border-radius: 2px; -webkit-border-radius: 2px;}
.radius3{border-radius: 3px; -webkit-border-radius: 3px;}
.radius5{border-radius: 5px; -webkit-border-radius: 5px;}
.radius50{border-radius: 50%; -webkit-border-radius: 50%;}
/* flex */
.flexbox{ display: box; display: -webkit-box; -webkit-box-orient:horizontal; box-orient:horizontal;}
.flexbox > *{ display: block; box-flex:1; -webkit-box-flex:1;width: 0%;}
.flexbox-v{ display: box; display: -webkit-box; -webkit-box-orient:vertical; box-orient:vertical;}
.flexbox-v > *{ display: block; box-flex:1; -webkit-box-flex:1;}
/*ellipsis*/
.ellipsis{ text-overflow:ellipsis; white-space: nowrap; overflow: hidden; }
.ellipsis2{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.ellipsis3{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
.ellipsis4{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden;}
/*margin*/
.mt5{margin-top: .05rem!important;}
.mt10{margin-top: .1rem!important;}
.mt15{margin-top: .15rem!important;}
.mt18{margin-top: .18rem!important;}
.mt20{margin-top: .2rem!important;}
.mt30{margin-top: .3rem!important;}
.mt40{margin-top: .4rem!important;}
.mt50{margin-top: .5rem!important;}
/*padding*/
.pt5{padding-top: 5px;}.pt10{padding-top: 10px;}.pt15{padding-top: 15px;}.pt20{padding-top: 20px;}.pt25{padding-top: 25px;}.pt30{padding-top: 30px;}
.pl15{padding-left: 15px;}.pr15{padding-right: 15px;}
.pb10{ padding-bottom: 10px;}.pb15{ padding-bottom: 15px;}.pb20{ padding-bottom: 20px;}.pb25{ padding-bottom: 25px;}.pb30{ padding-bottom: 30px;}.pb50{padding-bottom: 50px;}
/*width*/
.dw70{ width: 70px!important;}
/*1px边框*/
.bort{ position: relative;}
.bort:before{position: absolute; display: block; content:""; left: 0; top: 0; right: 0; width: 100%; height: 1px; background: #e5e5e5;}
.borb{ position: relative;}
.borb:before{position: absolute; display: block; content:""; left: 0; bottom: 0; right: 0; width: 100%; height: 1px; background: #e5e5e5;}
@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    .menu li dl dd:before,.menu li h3:before{
        -webkit-transform: scaleY(0.5);
                transform: scaleY(0.5);
    }
}
@media only screen and (-webkit-min-device-pixel-ratio: 3) {
    .menu li dl dd:before,.menu li h3:before{
        -webkit-transform: scaleY(0.33);
                transform: scaleY(0.33);
    }
}


/*head*/
.head{ height: 1rem; background: #fff;}
.logo{padding: .3rem 0 0 .21rem;}
.logo img{ width: 1.68rem;}
.menubtn{ width: .88rem; height: 1rem; background: url(../images/icon1.png) no-repeat center; background-size: .46rem auto; -webkit-transition:all .4s; transition:all .4s;}
.menubtn.on{ -webkit-transform:rotate(180deg); transform:rotate(180deg);}
/*.menubtn.on{ -webkit-transform:rotateY(180deg); transform:rotateY(180deg);}*/

/*banner*/
.banner{position: relative; width: 100%; height: 3.61rem; overflow: hidden;}
.banner .swiper-slide{width: 100%; height: 3.61rem;}
.banner .swiper-slide img{width: 100%; height: 3.61rem;}
.pagination1 .swiper-pagination-bullet{ margin: 0 1px!important; width: .52rem; height: 3px; border:1px solid #fff; background: none; border-radius: 0; }
.pagination1 .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: #fff;}

/*nav*/
.nav{}
.nav li{ float: left; padding: .29rem 0 .33rem; width: 20%; text-align: center; overflow: hidden;}
.nav li a{ display: block;}
.nav li .navimg{ width: 61%; margin:0 auto;}
.nav li p{margin-top: .15rem; font-size: .24rem;}

/*title*/
.title{ height: 1.05rem; line-height: 1.05rem; text-align: center; background: #fff; overflow: hidden;}
.title h2{ font-size: .36rem; font-weight: normal;}

/*anli*/
.anli-swiper{position: relative; margin: .2rem .1rem 0; height: 6.1rem; overflow: hidden;}
.anli-swiper .swiper-slide{ height: 5.62rem; background: #fff;}
.anli-swiper .swiper-slide .anli-img{ height: 3.55rem;}
.anli-swiper .swiper-slide h3{position: relative; padding: 0 .2rem;  height: .8rem; line-height: .8rem; text-align: center; font-size: .3rem; font-weight: normal; text-overflow:ellipsis; white-space: nowrap; overflow: hidden; }
.anli-swiper .swiper-slide h3:after{position: absolute; display: block; content: ''; left: 50%; bottom: 0; margin-left: -.2rem; width: .4rem; height: 1px; background: #cc1e1c; }
.anli-swiper .swiper-slide p{margin-top: .15rem; padding: 0 .2rem; font-size: .24rem; color: #666; text-align: center; text-overflow:ellipsis; white-space: nowrap; overflow: hidden; }
.pagination2 .swiper-pagination-bullet{vertical-align: top; margin: 0 1px!important; width: .52rem; height: 3px; border:1px solid #e1dfdf; background: none; border-radius: 0; }
.pagination2 .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: #cc1e1c; border-color: #cc1e1c;}
.pagination2{bottom: 0!important; height: 3px; }

/*news*/
.news-swiper{position: relative; margin: 0 .1rem; height: 6.28rem; overflow: hidden;}
.news-swiper .swiper-slide{}
.news{margin-top: .22rem; padding: 0 .28rem; height: 2.7rem; background: #fff; }
.news .news-time{ width: 1.88rem; height: .48rem; background: #cc1e1c; text-align: center; line-height: .48rem; color: #fff;}
.news h3{height: .8rem; line-height: .8rem; font-size: .28rem; color: #000; text-overflow:ellipsis; white-space: nowrap; overflow: hidden; }
.news p{ font-size: .24rem; color: #666; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
.pagination3 .swiper-pagination-bullet{vertical-align: top; margin: 0 1px!important; width: .52rem; height: 3px; border:1px solid #e1dfdf; background: none; border-radius: 0; }
.pagination3 .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: #cc1e1c; border-color: #cc1e1c;}
.pagination3{bottom: 0!important; height: 3px; }


/*案例*/
.anli-nav{  background: #fff; box-shadow: 0 2px 3px #f7f7f7 inset; overflow-y: hidden; overflow-x: auto;}
.anli-nav .swiper-wrapper{-webkit-transition-duration: 0ms; transition-duration: 0ms;}
.anli-nav .swiper-slide{ width: 1.5rem; text-align: center; height: .8rem; line-height: .8rem; font-size: .24rem;}
.anli-nav .swiper-slide.active{background: #f7f7f7;}
.anli-nav .swiper-slide:before{position: absolute; display: block; content:""; left: 0; bottom: 0; right: 0; width: 100%; height: 1px; background: #e5e5e5;}
.anli-nav .swiper-slide.active:before{ height: 2px; background: #cc1e1c;}

/*原始版*/
/*.anli-nav li{position: relative; float: left; width: 1.5rem; height: .8rem; line-height: .8rem; text-align: center;}
.anli-nav li.on{ background: #f7f7f7;}
.anli-nav li a{display: block; line-height: .8rem; font-size: .24rem;}
.anli-nav li.on a{ color: #cc1e1c;}
.anli-nav li:before{position: absolute; display: block; content:""; left: 0; bottom: 0; right: 0; width: 100%; height: 1px; background: #e5e5e5;}
.anli-nav li.on:before{ height: 2px; background: #cc1e1c;}
*/
.anli-list{}
.anli-list li{ float: left; margin: .2rem 0 0; padding: 0 .1rem; width: 50%; height: 5.6rem; overflow: hidden;}
.anli-list li a{ display: block; height: 5.6rem; background: #fff;}
.anli-list li .anli-img{ height: 3.55rem;}
.anli-list li h3{position: relative; padding: 0 .2rem;  height: .8rem; line-height: .8rem; text-align: center; font-size: .3rem; font-weight: normal; text-overflow:ellipsis; white-space: nowrap; overflow: hidden; }
.anli-list li h3:after{position: absolute; display: block; content: ''; left: 50%; bottom: 0; margin-left: -.2rem; width: .4rem; height: 1px; background: #cc1e1c; }
.anli-list li p{margin-top: .15rem; padding: 0 .2rem; font-size: .24rem; color: #666; text-align: center; text-overflow:ellipsis; white-space: nowrap; overflow: hidden; }

/*pages*/
.page{ margin-top: .4rem; padding: 0 .2rem; height: .6rem;}
.page .prev{ float: left; width: 30%; }
.page .next{ float: right; width: 30%; text-align: right;}
.page .prev a,.page .next a{ display: inline-block; width: 1.6rem; line-height: .6rem; font-size: .24rem; text-align: center; background: #fff; border:1px solid #e5e5e5; -webkit-border-radius: 3px; border-radius: 3px;}
.page .prev.on a,.page .next.om a{ color: #999;}
.page .pages{ float: left; width: 40%; text-align: center; line-height: .6rem; font-size: .3rem;}
.page .pages span{ color: #ec0e07;}

/*案例详情*/
.anli-head{margin: .2rem .11rem 0; padding: 0 .25rem .1rem; background: #fff;}
.anli-head h1{ padding: .2rem 0; line-height: .4rem; font-size: .28rem; text-align: center; border-bottom: 1px solid #cc1e1c;}
.anli-head dl{padding: .2rem 0; font-size: .24rem; color: #666; line-height: .36rem;}
.anli-head dt{}
.anli-author{margin: .2rem .11rem 0; padding: .28rem; background: #fff; overflow: hidden;}
.anli-author .auimg{ float: left; margin: 0.06rem .1rem 0 0; width: .96rem; height: .96rem; -webkit-border-radius: 50%; border-radius: 50%; overflow: hidden;}
.anli-author .auimg img{ width: 100%; height: 100%;}
.anli-author .auinfo{ float: left;}
.anli-author .auinfo h3{ font-size: .24rem; line-height: .4rem;}
.anli-author .auinfo p{ font-size: .18rem; color: #666; line-height: .3rem;}
.anli-author .aucz{ float: right; margin-left: .12rem; padding: .2rem 0 0 ; width: 1.38rem; height: 1.1rem; border:1px solid #e5e5e5; text-align: center;}
.anli-author .aucz img{ width: .4rem; height: .4rem;}
.anli-author .aucz span{ display: block; margin-top: .06rem; font-size: .18rem; color: #666;}
.anli-art{margin: .2rem .11rem 0; padding: .16rem; background: #fff; overflow: hidden;}
.anli-art h2{ position: relative; padding-left: .13rem; margin: .1rem 0 .2rem 0; font-size: .24rem; }
.anli-art h2:after{position: absolute; display: block; content: ""; left: 0; top:50%; margin-top: -3px; width: 2px; height: 6px; background: #cc1e1c;}
.anli-body{ padding-bottom: .2rem;}

/*资讯列表*/
.mews-list{ padding: 0 .2rem;}
.mews-list p{color: #999;}

/*资讯详情*/
.mews-art{margin: .25rem .2rem 0; padding: .14rem; background: #fff; }
.news-head{padding: .2rem 0 .1rem; text-align: center; border-bottom: 1px solid #e5e5e5;}
.news-head h1{padding: 0 .3rem; font-size: .34rem;}
.news-head p{ margin-top: .1rem;}
.news-head p span{padding: 0 .1rem; font-size: .24rem; color: #999;}
.news-body{padding: .2rem 0; color: #666; }
.news-body img{width:100%}
.news-page{margin: .15rem .2rem;}
.news-page p{ margin-top: .15rem; padding: 0 .2rem; line-height: .68rem; height: .68rem; font-size: .24rem; color: #999; background: #fff; text-overflow:ellipsis; white-space: nowrap; overflow: hidden; }
.news-page p a{ color: #333;}


/*title2*/
.title2{}
.title2 h2{position: relative; padding: .4rem 0 .2rem; font-size: .36rem; color: #333; font-weight: normal; text-align: center;}
.title2 h2:after{position: absolute; display: block; content: ""; left: 50%; bottom: 0; margin-left: -.69rem; width: 1.38rem; height: 1px; background: #1ea77b;}

/*文库*/
.why-swiper{position: relative; text-align: center; overflow: hidden;}
.why-swiper .swiper-slide{padding: 0 .6rem; height: 4.2rem; overflow: hidden; }
.why-swiper .swiper-slide .why-img{ margin: .37rem auto 0; width: 1.02rem;}
.why-swiper .swiper-slide h3{margin: .25rem 0 .2rem; font-size: .3rem;}
.why-swiper .swiper-slide p{ font-size: .24rem; color: #666;}
.paginationwk{ bottom: .2rem!important;}
.paginationwk .swiper-pagination-bullet{ margin: 0 1px!important; width: .52rem; height: 3px; border:1px solid #e1dfdf; background: none; border-radius: 0; opacity: 1; }
.paginationwk .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: #1ea77b; border-color: #1ea77b;}
.anli2-swiper {position: relative; width: 100%; height: 5rem; overflow: hidden;}
.anli2-swiper .swiper-slide { height: 4.2rem; text-align: center;}
.anli2-swiper .swiper-slide img { width: auto; height: auto; max-width: 100%; max-height: 100%; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; left: 50%; top: 50%; }
.benefit-swiper{position: relative; margin-top: .6rem; padding-bottom: 1rem; overflow: hidden;}
.benefit-swiper .swiper-slide{ padding: 0 .1rem;}
.benefit-swiper .bene{ float: left; padding: 0 .5rem; min-height: 2.3rem; width: 50%; text-align: center; }
.benefit-swiper .bene:first-child{ border-right: 1px solid #e5e5e5}
.benefit-swiper .bene .why-img{margin:0 auto; padding-top: .1rem; width: 1.1rem;}
.benefit-swiper .bene h3{margin-top: .1rem; font-size: .3rem;}
.benefit-swiper .bene p{margin-top: .05rem; font-size: .18rem; line-height: .3rem;}

/*微信*/
.future{}
.future-swiper{position: relative; height: 5.55rem; overflow: hidden;}
.future-swiper .swiper-slide{ width: 2.9rem; height: 5rem; box-shadow: -.8rem 0 .8rem  #f6f6f6 inset}
.future-swiper .swiper-slide .future-img{height: 2.24rem;}
.future-swiper .swiper-slide h3{position: relative; margin-top: .1rem; padding: 0 .2rem;  height: .8rem; line-height: .8rem; text-align: center; font-size: .3rem; font-weight: normal; text-overflow:ellipsis; white-space: nowrap; overflow: hidden; }
.future-swiper .swiper-slide h3:after{position: absolute; display: block; content: ''; left: 50%; bottom: 0; margin-left: -.2rem; width: .4rem; height: 1px; background: #d8d8d8; }
.future-swiper .swiper-slide p{margin-top: .15rem; padding: 0 .2rem; font-size: .24rem; color: #999; text-align: center; }
.routine-swiper{position: relative; height: 5.5rem; overflow: hidden;}
.routine-swiper li{margin-top: .18rem; height: 2.2rem; background: #fff; text-align: center;}
.routine-swiper li .rouimg{position: relative; height: 1.6rem;}
.routine-swiper li .rouimg img{position: absolute; left: 50%; top: 50%; margin: -.5rem 0 0 -.5rem; width: 1rem; height: 1rem;}
.routine-swiper li h3{ height: .6rem; line-height: .6rem; background: #ddecf9; font-size: .26rem;}
.anli3-swiper {margin-top: .4rem; height: 8rem;}
.anli3-swiper .swiper-slide{ height: 7.34rem;}
.service{ padding-bottom: .4rem;}
.service ul{ margin: 0 .8rem; border-top: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5;}
.service li{ float: left; width: 25%; height: 1.6rem; background: #f8f9fb; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; text-align: center;}
.service li .serimg{position: relative; height: 1.12rem; overflow: hidden;}
.service li .serimg img{margin-top: .37rem; width: .6rem; height: .6rem;}
.service li p{ font-size: .2rem;}

/*APP*/
.worth{ position: relative; height: 5.05rem; overflow: hidden;}
.worth-l{ width: 2.7rem; background:#6242a3; height: 5.05rem; overflow: hidden;}
.worth-l img{margin:.7rem 0 0 .2rem; width: 1.7rem;}
.worth-r{position: absolute; top: .4rem; left: 2.05rem; right: 0; overflow: hidden;}
.worth-r li{margin-top: .05rem; height: .8rem; line-height: .8rem; background:#fff; white-space: nowrap; overflow: hidden;}
.worth-r li b{float: left; padding-left: .26rem; font-size: .24rem; color: #6242a3;}
.worth-r li em{float: left; padding: 0 .2rem 0 .1rem; font-size: .14rem; color: #6242a3;}
.worth-r li span{float: left; font-size: .2rem; color: #333;}

.scheme-swiper{position: relative; margin: 0 .1rem; height: 4.4rem; overflow: hidden;}
.scheme-swiper .swiper-slide{ background:#f6f6f6;overflow: hidden;}
.scheme-swiper .scheme-info{ padding-top: .27rem;}
.scheme-swiper .scheme-info h3{ float: left;margin: 0 .2rem 0 .16rem; width:.96rem; height: .7rem; text-align: center; font-size: .3rem; color: #6242a3; border-right: 1px solid #e5e5e5;}
.scheme-swiper .scheme-info p{position: relative; font-size: .24rem; color: #666; overflow: hidden; }
.scheme-nav{padding-left: 5px; margin-right: -5px; margin-top: .1rem; background:#fff; overflow-x: auto; overflow-y: hidden; white-space: nowrap;}
.scheme-nav li{ float: left; margin-right: 5px; width: 1.28rem; height: 1.28rem; background:#f6f6f6; text-align: center; overflow: hidden; cursor: pointer;}
.scheme-nav li img{ display: block; margin:0 auto; width: .5rem; height: .5rem;}
.scheme-nav li img.sc1{}
.scheme-nav li img.sc2{ display: none;}
.scheme-nav li.on{ background:#6242a3;}
.scheme-nav li.on img.sc1{ display: none;}
.scheme-nav li.on img.sc2{ display: block;}
.scheme-nav li .scnav-img{ padding: .3rem 0 0; height: .8rem;}
.scheme-nav li.on h3{color: #fff;;}
.scheme-nav li h3{ font-size: .24rem; font-weight: normal;}


/*.foot*/
.foot{ position: fixed; left: 0; right: 0; bottom: 0; height: 1.1rem; background: #cc1e1c; z-index: 10;}
.foot li{ float: left; width: 25%; height: 1.1rem; text-align: center; overflow: hidden; }
.foot li a{ display: block; padding-top: .58rem; height: 1.1rem; font-size: .24rem; color: #fff; font-weight: bold;}
.foot li.on a{ color: #cc1e1c;}
.foot li.foot1{ background: url(../images/foot01.png) no-repeat center .2rem; background-size: auto .3rem; }
.foot li.foot2{ background: url(../images/foot02.png) no-repeat center .2rem; background-size: auto .3rem;}
.foot li.foot3{ background: url(../images/foot03.png) no-repeat center .2rem; background-size: auto .3rem;}
.foot li.foot4{ background: url(../images/foot04.png) no-repeat center .2rem; background-size: auto .3rem;}
.foot li.on.foot1{ background: url(../images/foot1.png) no-repeat center .2rem #fff; background-size: auto .3rem; }
.foot li.on.foot2{ background: url(../images/foot2.png) no-repeat center .2rem #fff; background-size: auto .3rem;}
.foot li.on.foot3{ background: url(../images/foot3.png) no-repeat center .2rem #fff; background-size: auto .3rem;}
.foot li.on.foot4{ background: url(../images/foot4.png) no-repeat center .2rem #fff; background-size: auto .3rem;}

/*pop*/
.pop{display: none; position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0,0,0,.5); z-index: 10;}
.pop.active{ display: block;}
.pop.show{ -webkit-animation: dopopshow .4s; animation: dopopshow .4s;}
@keyframes dopopshow
{
    0% {  opacity: 0;}
    100% { opacity: 1;}
}
@-webkit-keyframes dopopshow
{
    0% {  opacity: 0;}
    100% { opacity: 1;}
}
.pop.hide{ -webkit-animation: dopophide .4s; animation: dopophide .4s;}
@keyframes dopophide
{
    0% {  opacity: 1;}
    100% { opacity: 0;}
}
@-webkit-keyframes dopophide
{
    0% {  opacity: 1;}
    100% { opacity: 0;}
}

/*menu*/
.menu{display: none; position: fixed; left: 0; top: 0; bottom: 0;background: #cc1e1c; z-index: 20;}
.menu.active{ display: block;}
.menu.show{ -webkit-animation: tiershow .3s both; animation: tiershow .3s both;}
@keyframes tiershow
{
    0% {transform:translate(-100%,0);}
    100% {transform:translate(0,0);}
}
@-webkit-keyframes tiershow
{
    0% {-webkit-transform:translate(-100%,0);}
    100% {-webkit-transform:translate(0,0);}
}
.menu.hide{ -webkit-animation: tierhide .3s both; animation: tierhide .3s both;}
@keyframes tierhide
{
    0% {transform:translate(0,0);}
    100% {transform:translate(-100%,0);}
}
@-webkit-keyframes tierhide
{
    0% {-webkit-transform:translate(0,0);}
    100% {-webkit-transform:translate(-100%,0);}
}

.menu li{position: relative; padding: 0 .08rem; height: .64rem; line-height: .64rem;}
.menu li h3{position: relative; height: .64rem; line-height: .64rem; width: 2.2rem; font-size: .24rem; font-weight: normal; }
.menu li h3:before{position: absolute; display: block; content:""; left: 0; bottom: 0; right: 0; width: 100%; height: 1px; background: #d33b39;}
.menu li h3 a{display: block; padding-left: .2rem; color: #fff;}
.menu li.on{ background: url(../images/icon2.png) no-repeat 1.99rem center  #fff; background-size: .14rem auto;}
.menu li.on h3:before{display: none;}
.menu li.on h3 a{ color: #cc1e1c;}
.menu li dl{ display: none; position: fixed; left: 2.36rem; top: 0; bottom: 0; padding: 0 0.08rem; background: #fff;}
.menu li dl dd{position: relative; width: 2.2rem;}
.menu li dl dd:before{position: absolute; display: block; content:""; left: 0; bottom: 0; right: 0; width: 100%; height: 1px; background: #e4e3e3;}
.menu li dl dd a{display: block; padding-left: .2rem; font-size: .24rem; color: #333;}
.menu li.on dl{ display: block;}
.closemenu{margin: .37rem 0 0 .27rem; width: .48rem; height: .48rem; background: url(../images/close.png) no-repeat; background-size: .46rem auto}


/*dropload*/
.dropload-up,.dropload-down{ position: relative; height: 0; overflow: hidden; font-size: 12px; /* 开启硬件加速 */ -webkit-transform:translateZ(0); transform:translateZ(0);}
.dropload-down{ height: 50px;}
.dropload-refresh,.dropload-update,.dropload-load,.dropload-noData{ height: 50px; line-height: 50px; text-align: center;}
.dropload-load .loading{ display: inline-block; height: 15px; width: 15px; border-radius: 100%; margin: 6px; border: 2px solid #666; border-bottom-color: transparent; vertical-align: middle; -webkit-animation: rotate 0.75s linear infinite; animation: rotate 0.75s linear infinite;}
@-webkit-keyframes rotate {
    0% { -webkit-transform: rotate(0deg); }
    50% { -webkit-transform: rotate(180deg); }
    100% { -webkit-transform: rotate(360deg); }
}
@keyframes rotate {
    0% { transform: rotate(0deg); }
    50% { transform: rotate(180deg); }
    100% { transform: rotate(360deg); }
}
