page{
  height:100%
}

.left-view {
  width: 27%;
  height: 100%;
  background-color: #f5f7f6;
  float:left;
  padding-top: 88rpx;
}

.category-item {
  width: 100%;
  height: 120rpx;
}

.item-left {
  float: left;
  width: 8rpx;
  background-color: black;
  height: 100%;
  display: none;
}

.selected .item-left {
  display: block;
}

.category-item .item-name {
  height: 100%;
  font-size: 28rpx;
  font-family: PingFang SC;
  color: #cacbca;
  text-align: center;
  line-height: 120rpx;
  overflow: hidden;
  text-overflow:ellipsis;
}

.selected .item-name{
  background-color: white;
  color: black !important;
  padding-right: 8rpx;
  font-size: 30rpx !important;
  overflow: hidden;
  text-overflow:ellipsis;
}

.divide-line {
  height: 2rpx;
  background-color: white;
}

.right-view {
  width:73%;
  height: 100%;
  float:right;
  font-size: 26rpx;
  font-family: PingFang SC;
  padding-top: 88rpx;
}

.category-block {
  width:100%;
  float:left;
}

.category-block-header {
  width:100%;
  height: 60rpx;
  text-align: center;
  line-height: 80rpx;
}

.category-item-block {
  width: 154rpx;
  height: 194rpx;
  background-color: #f5f7f6;
  margin-left:22rpx;
  margin-top:20rpx;
  float:left;
  text-align: center;
}

.category-item-img {
  width: 126rpx;
  height: 170rpx;
}

.category-item-name {
  width: 154rpx;
  margin-top: -20rpx;
  text-align: center;
  font-size: 22rpx;
  color: #444444;
}

.category-item-more {
  width: 100%;
  height: 100%;
  text-align: center;
  vertical-align: middle;
  font-family: 'Helvetica Bold';
  font-size: 24rpx;
  color: #444444;
  padding-top: 51%;
}


.brand-item-block {
  width: 156rpx;
  height: 140rpx;
  margin-left:22rpx;
  margin-top:20rpx;
  float:left;
  text-align: center;
}

.brand-item-img {
  width: 156rpx;
  height: 64rpx;
  padding-top: 18rpx;
  padding-bottom: 18rpx;
}

.brand-item-name {
  width: 156rpx;
  height: 40rpx;
  text-align: center;
  font-size: 22rpx;
  color: #B0B0B0;
}