.wrap-box {

  margin: 0 .2rem;

}

.content {

  padding-top: 1.25rem;

}

.logo {

  text-align: center;

  height: 1.25rem;

  border-bottom: 1px #eee solid;

  background: #fff;

  display: flex;

  align-items: center;

  position: fixed;

  left: 0;

  top: 0;

  width: 100%;

  z-index: 10;

}

.logo span {

  display: inline-block;

  width: 3rem;

  padding-left: .3rem;

}

.logo p {

  font-size: .33rem;

  padding-left: .15rem;

  color: #666;

}

.logo i {

  position: absolute;

  right: .25rem;

  top: 50%;

  transform: translate(0, -50%);

  font-size: .75rem;

  color: #0084F0;

}

/* 标题 */

.common-title {

  text-align: center;

}

.common-title h1 {

  font-size: .55rem;

  font-weight: bold;

  color: #333;

}

.common-title p {

  padding-top: .2rem;

  color: #777;

  font-size: .3rem;

  width: 90%;

  margin: 0 auto;

  line-height: .5rem;

}

/* 头部图片 */

.commonbg-top {

  position: relative;

}

.commonbg-top .text {

  position: absolute;

  top: 50%;

  left: 50%;

  color: #fff;

  transform: translate(-50%, -50%);

  width: 70%;

  text-align: center;

}

.commonbg-top .text span {

  font-size: .65rem;

  font-weight: bold;

}

.commonbg-top .text p {

  font-size: .3rem;

  padding-top: .2rem;

  line-height: .5rem;

}

/* 分类 */

.fenlei-nav {

  display: none;

  position: absolute;

  top: 50px;

  right: 0;

  z-index: 20;

  width: 45%;

  background-color: rgba(5, 5, 5, 0.9);

}

.fenlei-nav li a {

  display: block;

  color: #ccc;

  padding: .3rem 0;

  border-bottom: 1px #444 solid;

  font-size: .38rem;



}

.fenlei-nav li:last-child a {

  border-bottom: 0;

}

/* 轮播 */

.swiperbox {

  overflow: hidden;

}

.swiper-container {

  margin: 0 auto;

  overflow: hidden;

  z-index: 1;

  position: relative;

}

.swiper-wrapper {

  position: relative;

  width: 100%;

  height: 100%;

  z-index: 1;

  display: flex;

  transition-property: transform;

  transition-property: transform, -webkit-transform;

  box-sizing: content-box;

}

.swiper-slide {

  -webkit-flex-shrink: 0;

  -ms-flex: 0 0 auto;

  -ms-flex-negative: 0;

  flex-shrink: 0;

  width: 100%;

  height: 100%;

  position: relative;

}

/* Pagination Styles */

.swiper-pagination {

  position: absolute;

  text-align: center;

  -webkit-transition: 300ms;

  transition: 300ms;

  -webkit-transform: translate3d(0, 0, 0);

  transform: translate3d(0, 0, 0);

  z-index: 10;

}

/* Common Styles */

.swiper-container-horizontal>.swiper-pagination-bullets {

  bottom: 5px;

  left: 0;

  width: 100%;

}

/* Bullets */

.swiper-pagination-bullet {

  width: 6px;

  height: 6px;

  display: inline-block;

  border-radius: 100%;

  background: #000;

  opacity: 0.2;

}

.swiper-pagination-bullet-active {

  opacity: 1;

  background: #FCCC43;

}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {

  margin: 0 3px;

}

.swiper-container .swiper-slide .fadeInDown {

  -webkit-animation: fadeOut 0.3s both 0.3s;

  animation: fadeInOut 0.3s both 0.3s;

}

.swiper-container .swiper-slide-active .fadeInDown {

  -webkit-animation: fadeInDown 0.5s both 0.5s;

  animation: fadeInDown 0.5s both 0.5s;

}

.swiper-container .swiper-slide-active .fadeleft {

  -webkit-animation: fadeInLeft 0.5s both 0.5s;

  animation: fadeInLeft 0.5s both 0.5s;

}

/*底部导航*/

.footer {

  width: 100%;

  height: 2.25rem;

}

.footer .footer-nav {

  position: fixed;

  width: 100%;

  z-index: 10;

  background: #fff;

  bottom: 0px;

  border-top: 1px #eee solid;

  height: 1.25rem;

  display: flex;

  align-items: center;

}

.footer .footer-nav a {

  display: block;

  color: #0084F0;

  text-align: center;

  flex: 1;

  font-size: .3rem;

}

.footer .footer-nav span {

  display: block;

}

.footer .footer-nav i {

  font-size: .6rem;

}

/* 弹出微信 */

/* 弹出罩层 */

.popover-mask {

  background: #fff;

  position: fixed;

  z-index: 5;

  bottom: 50px;

  left: 0;

  right: 0;

  height: 0;

  width: 100%;

  height: 50%;

  display: none;

  border-top: 1px #eee solid;

}

.pop-wx {

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

  z-index: 15;

}

.pop-wx span {

  text-align: center;

  display: block;

  padding-bottom: .35rem;

}

.pop-wx .img {

  width: 4rem;

  padding: .25rem;

  border: 2px #0084F0 solid;

}