@charset "utf-8";

.haopingbanner{ width:100%; height:450px; background:url(/templates/default/images/haopingbanner.jpg) center top no-repeat}
.classes-wrap{overflow: hidden; border-bottom:1px #ddd solid;}
.haopinglv{ width:630px; margin:0 auto 30px; height:120px;}
.haopinglvfl{ float:left; width:120px; height:120px;}
.haopinglvfr{ float:left; width:calc(100% - 120px); padding-top:20px;}
.haopinglvfr ul li{ float:left; border:1px #ddd solid; padding:1px 10px; color:#333; margin-right:10px; margin-bottom:20px;}
.haopinglvfr ul li:nth-child(5n+1){ clear:left;}
.haopinglvfr ul li:hover{ background:#0066cc; color:#fff; border:1px #0066cc solid; cursor:pointer;}
.content{width: 1200px;margin: 0 auto;position: relative;}
.content:after{content: '';clear: both;height: 0;display: block;}
.clearfix:after{content: " ";display: table;clear: both;width: 100%;}
.classes-wrap .classes-item{width: 100%;float: left;cursor: pointer;padding: 81px 0 58px;position: relative;z-index: 1;overflow: hidden;}
.classes-wrap .classes-item.active:after{display: block;}
.classes-wrap .classes-item:after{content: " ";position: absolute;z-index: 2;background: url(/templates/default/images/helpcenter_sprites.png) no-repeat -56px -235px;width: 36px;height: 18px;bottom: 0;left: 50%;margin-left: -18px;display: none;}
.classes-wrap .classes-item .icon{width: 126px;height: 60px;display: block;margin: 0 auto;}
.classes-wrap .classes-item.active .text{color: #000;font-weight: 700;}
.classes-wrap .classes-item .text{font-size: 16px;color: #535353;display: block;text-align: center;font-weight: 400;margin-top: 15px;}
.classes-wrap .classes-item .icon.icon-login{ background:url(/templates/default/images/haopingtab1.png) center center no-repeat;}
.classes-wrap .classes-item:hover .icon.icon-login,
.classes-wrap .classes-item.active .icon.icon-login{ background:url(/templates/default/images/haopingtabactive1.png) center center no-repeat;}
.classes-wrap .classes-item .icon.icon-config{ background:url(/templates/default/images/haopingtab2.png) center center no-repeat;}
.classes-wrap .classes-item:hover .icon.icon-config,
.classes-wrap .classes-item.active .icon.icon-config{ background:url(/templates/default/images/haopingtabactive2.png) center center no-repeat;}
.classes-wrap .classes-item .icon.icon-award{ background:url(/templates/default/images/haopingtab3.png) center center no-repeat;}
.classes-wrap .classes-item:hover .icon.icon-award,
.classes-wrap .classes-item.active .icon.icon-award{ background:url(/templates/default/images/haopingtabactive3.png) center center no-repeat;}


/*内容*/
.list-wrap{background: #fff;padding: 50px 0;box-sizing: border-box;display: none;}
.list-wrap.active{display: block;}
.list-wrap .list-title{margin-bottom: 20px;    font-size: 30px;
    color: #333;
    text-align: center;
    font-weight: normal;
    line-height: 50px;}
.list-wrap .list-title .icon-question{width: 26px;height: 29px;display: inline-block;vertical-align: -8px;margin-right: 10px;background: url(/templates/default/images/helpcenter_sprites.png) no-repeat -10px -235px;}
.list-wrap .list-content .list-item{display: block; float:left; width:18%; margin:0 1% 1%; position: relative;z-index: 1;}
.list-wrap .list-content .list-item img{ max-width:100%;}
.list-wrap .list-content .list-item p{ font-size:14px; font-weight:normal; text-align:center; color:#333; line-height:25px;height:50px;}
.list-wrap .list-content .list-item a{text-decoration: none;color: #535353;}
.list-wrap .list-content .list-item a:hover{color: #4381fd;}
.list-wrap .list-content .list-item a:before{content: " ";background: #b2b2b2;width: 4px;height: 4px;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;-ms-border-radius: 50%;-o-border-radius: 50%;position: absolute;z-index: 1;top: 42px;left: 0;}
.pagination{margin-top: 45px;text-align: right;display: block;width: 100%;}
.pagination__item{padding: 8px 10.5px;margin: 0 4px;box-sizing: border-box;display: inline-block;border: 1px solid #dadada;border-radius: 4px;font-size: 12px;color: #535353;background: #fff;cursor: pointer;}
.pagination__item:hover{background-color: #b1b1b1;border-color: #999;color: #fff;}
.pagination__item.is-active{background-color: #4381fd;border-color: #4381fd;color: #fff;cursor: default;}


.zhenshi {
  width: 100%;
  height: 950px;
  background-color: #f8f8f8;
}

.zhenshi .zhenshititle {
  font-size: 32px;
  color: #333;
  text-align: center;
  padding-top: 20px;
  font-weight: normal;
  line-height: 110px;
}

.zhenshi .iphone-bg {
  width: 346px;
  height: 746px;
  background: url(/templates/default/images/zs-img1.png) no-repeat;
  position: absolute;
  left: 50%;
  z-index: 2;
  margin-left: -173px;
}

.zhenshi .swiper-container {
  margin-top: 82px;
 height: 540px;
}

.zhenshi .ftitle {
  font-size: 32px;
  color: #333;
  text-align: center;
  font-weight: normal;
  margin-top: 190px;
}

.haopingfoot{ width:100%;}
.haopingfoot img{ max-width:100%;}

.haopingimglist{ width:100%;}
.haopingimglist .ftitle {
  font-size: 32px;
  color: #333;
  text-align: center;
  font-weight: normal;
  margin-top: 60px;
	margin-bottom: 60px;
}

.haopingimglistn{ width:1200px; margin:0 auto;}
.haopingimglistn ul li{ float:left; width:13.7%; margin:0.5% 0.25%;}
.haopingimglistn ul li h3{ width:100%;}
.haopingimglistn ul li img{ width:100%;}
.haopingimglistn ul li p{ font-size:14px; color:#333; text-align:center; line-height:30px;}