body { margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; background-color: #f5f5f5; }
img { display: block; width: 100%; }
header { width: 100%; height: 50px; padding: 0 10px; box-sizing: border-box; background: #000000; display: box; display: -webkit-box; position: fixed; top: 0; left: 0; z-index: 10; border-bottom: 1px solid #ddd; }
header div { box-flex: 1; -webkit-box-flex: 1; -moz-box-flex: 1; }
.logo { position: absolute; z-index: 11; margin-top: 0.15rem; }
.logo a { display: block; width: 85px; height: 50px; }
.category, .close { /* text-align: right; */ position: absolute; z-index: 11; right: 10px;color:#fff !important; }
.category a, .close a { display: inline-block; width: 25px; height: 20px; background: url(../images/sprit.png) 0 -165px no-repeat; -webkit-background-size: 135px; background-size: 135px; position: absolute; top: 15px; right: 0; /*transform:translate(0,-50%); -webkit-transform:translate(0,-50%); -moz-transform:translate(0,-50%);*/ /* z-index: 99; */ }
.close a { width: 20px; height: 20px; background-position: 0 -190px; }

.cent { width: 100%; position: absolute; z-index: 10; }
.homeSearch { position: relative; margin: 12px 60px 12px 100px; height: 24px; line-height: 24px; padding: 0 15px; background: #ffffff; border: 1px solid #f2f2f2; border-radius: 25px; }
.homeSearch input { float: left; padding: 0 5px; width: 100%; height: 24px; line-height: 24px; border: none; font-size: 14px; outline: none; }
.homeSearch input.serachTxt { width: 80%; margin: 0; }
.homeSearch input.searchBtn { width: 20px; height: 20px; position: absolute; right: 10px; text-indent: -9999px; cursor: pointer; margin: 0; margin-top: 2px; background: url(../images/search_icon.png) no-repeat; background-size: 20px auto; }

/*右上角列表*/
.nav { width: 100%; height: 100%; background-color: rgba(0,0,0,.3); position: fixed; top: 0; left: 0; z-index: 99; display: none; }

nav { background-color: #fff; padding-top: 50px; }

.nav-block ul li:before, .nav-block ul li:after { content: ''; width: 0; height: 0; border-style: solid; border-width: 12px 10px; position: absolute; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); }

.nav-block ul li:before { border-color: transparent transparent transparent #ccc; right: -10px; z-index: 4; }

.nav-block ul li:after { border-color: transparent transparent transparent #fff; right: -9px; z-index: 5; }

.nav-block { margin: 6px 6px 0; padding: 0 15px; background-color: #fff; }

.nav-block ul li { height: 55px; line-height: 55px; font-size: 14px; padding-left: 35px; border-bottom: 1px solid #ddd; position: relative; }

.nav-block ul li:last-child { border-bottom: none; }

.nav-block ul li a { display: block; color: #333; }

.nav-block ul li a span { display: block; width: 22px; height: 22px; /*background: url(../images/sprit.png) no-repeat; -webkit-background-size: 135px; background-size: 135px;*/ position: absolute; top: 20%; left: 0; z-index: 5; margin-top: -11px; }

@keyframes arrowDown {
    from { transform: translate(0, -100%); -webkit-transform: translate(0, -100%); -moz-transform: translate(0, -100%); opacity: 1; }

    to { transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(-50%, 0); opacity: 0.3; }
}

@-webkit-keyframes arrowDown {
    from { transform: translate(0, -100%); -webkit-transform: translate(0, -100%); -moz-transform: translate(0, -100%); opacity: 1; }

    to { transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); opacity: 0.3; }
}

@-moz-keyframes arrowDown {
    from { transform: translate(0, -100%); -webkit-transform: translate(0, -100%); -moz-transform: translate(0, -100%); opacity: 1; }

    to { transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); opacity: 0.3; }
}

@-o-keyframes arrowDown {
    from { transform: translate(0, -100%); -webkit-transform: translate(0, -100%); -moz-transform: translate(0, -100%); opacity: 1; }

    to { transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); opacity: 0.3; }
}


.banner { position: relative; width: 100%; height: 3.1rem; overflow: hidden; }
.banner .swiper { position: relative; width: 100%; height: 100%; }
.banner .swiper .swiper-wrapper .swiper-slide { position: relative; width: 100%; height: 100%; }
.banner .swiper .swiper-wrapper .swiper-slide .img { position: relative; width: 100%; height: 100%; }
.banner .swiper .swiper-wrapper .swiper-slide .txt { position: absolute; z-index: 99; top: 40%; left: 10%; color: #fff; }
.banner .swiper .swiper-wrapper .swiper-slide .txt h2 { font-size: 3.125rem; }
.banner .swiper .swiper-wrapper .swiper-slide .txt h2 b { color: #fff; }
.banner .swiper .swiper-wrapper .swiper-slide .txt p { margin: 1.875rem 0; font-size: 2.25rem; }
.banner .swiper .swiper-wrapper .swiper-button-next,
.banner .swiper .swiper-wrapper .swiper-button-prev { color: #fff; }
.banner .swiper .swiper-wrapper .swiper-pagination.on { color: #fff; }
.banner img.mymove { width: 100%; height: auto; position: relative; animation: mymove 10s infinite; -webkit-animation: mymove 10s infinite; }