.page-select-index{
  height: 100%;
}

.wx-flex {
  display: flex;
  align-items: center
}

.wx-flex__item {
  flex: 1
}


.index-group__title {
  padding: 12rpx 24rpx;
  background: #f0f0f0;
}

.anchor-bar__wrp {
  position: fixed;
  right: 0;
  width: 60rpx;
  z-index: 999;
  top:50%;
  transform: translateY(-50%);
}

.anchor-item {
  font-size: 0;
  text-align: center;
  position: relative
}

.anchor-item__inner {
  line-height: 28rpx;
  height: 28rpx;
  width: 28rpx;
  border-radius: 50%;
  display: inline-block;
  font-size: 20rpx;
  margin: 2rpx 0;
  font-weight: 500
}

.tapped .anchor-item__pop {
  display: block
}

.anchor-item__pop {
  position: absolute;
  font-size: 64rpx;
  width: 100rpx;
  height: 100rpx;
  line-height: 100rpx;
  color: #fff;
  background-color: #C9C9C9;
  border-radius: 50%;
  right: 80rpx;
  top: 50%;
  transform: translateY(-50%);
  display: none
}

.anchor-item__pop:after {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  left: 80rpx;
  border: 40rpx solid;
  border-color: transparent transparent transparent #C9C9C9;
  top: 50%;
  transform: translateY(-50%)
}

.anchor-item.selected .anchor-item__inner {
  color: #fff;
  background-color: #00b0f0
}