.grayBlock{
  background: #e6ece5;
  width: 100%;
  height: 20rpx;
}
.swiperBox{
  padding: 20rpx 20rpx;
  height: 180rpx;
  background-color: #e6ece5;
}
.swiperCon{
  border-radius:20rpx;
}
.slideImage{
  width: 100%;
  height: 100%;
}

.swiper_box {
  position: relative;
}
/*用来包裹所有的小圆点 */
.dots {
  width: 100%;
  display: flex;
  flex-direction: row;
  position: absolute;
  justify-content: center;
  bottom: 35rpx;
}
/*未选中时的小圆点样式 */
.dot {
  width: 20rpx;
  height: 4rpx;
  border-radius: 14rpx;
  margin-right: 5rpx;
  background-color: rgba(255, 255, 255, 0.5);
}
/*选中以后的小圆点样式  */
.active {
  width: 40rpx;
  height: 4rpx;
  background-color: #fff;
}

#userTab{
  display: flex;
  background-color: #e6ece5;
  padding-top: 30rpx;
  position: relative;
}
.userTabItem{
  position: relative;
  margin-left: 10rpx;
}
.userTabItem image{
  width: 200rpx;
  height: 60rpx;
  display: block;
}
.userTabItem text{
  position: absolute;
  display: block;
  left: 0;
  bottom: 0;
  width: 100%;
  text-align: center;
  line-height: 60rpx;
  color: #111;
  font-size: 28rpx;
}
/* .userTabItem:first-child{
  margin-left: -10rpx;
} */

#userCenter{
  display: block;
  position: absolute;
  right: 20rpx;
  top: 20rpx;
  width: 48rpx;
  height: 48rpx;
}

/* 头像设置 */
#initial{
  margin-left: 30rpx;
  display: flex;
  align-items: center;
}
.initialIcon{
  display: inline-block;
  width: 22rpx;
  height: 22rpx;
  font-size: 18rpx;
  text-align: center;
  line-height: 22rpx;
  border-radius: 50%;
  background-color: #000;
  color: #fff;
}

#userBox{
  display: flex;
  position: relative;
  padding: 10rpx 0 20rpx 50rpx;
  border-bottom: 1rpx solid #dfdfdf;
}
#setBtn{
  height: 36rpx;
  width: 36rpx;
  position: absolute;
  top: 0;
  right: 25rpx;
}
#userHead{
  display: block;
  height: 120rpx;
  width: 120rpx;
  margin-right: 30rpx;
  border-radius: 50%;
  /* overflow: hidden; */
}
#userInfo{
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#username{
  color: #4f5051;
  font-size: 38rpx;
  margin-bottom: 10rpx;
}
#userDetail{
  font-size: 28rpx;
  color: #999;
  display: flex;
  align-items: center;
}
#userDetail text{
  margin-right: 10rpx;
}
#userGender{
  display: block;
  width: 22rpx;
  height: 22rpx;
  margin-right: 10rpx;
}

/* 训练计划按钮 */
#userBtnBox{
  padding: 30rpx 20rpx;
  display: flex;
  justify-content: space-between;
  border-bottom: 1rpx solid #dfdfdf;
}
#userBtnBox image{
  display: block;
  width: 345rpx;
  height: 90rpx;
}


/* 监控 */
.checkCon{
  padding: 30rpx 20rpx;
}
.checkDes{
  display: flex;
  justify-content: space-between;
  padding-bottom: 20rpx;
}
#trainTime{
  color: #999;
  font-size: 28rpx;
}
#powerBox{
  display: flex;
  align-items: center;
}
#powerBox>image{
  display: block;
  width: 48rpx;
  height: 48rpx;
  margin-left: 10rpx;
}
.PowerOff{
  color: #10d9b8;
  font-size: 28rpx;
}
.checkImg{
  position: relative;
}
/* .checkImg>image{
  display: block;
  width: 100%;
  height: 100rpx;
} */
#checkImgConBox{
  position: relative;
}
#checkImgCon{
  display: block;
  height: 400rpx;
  width: 100%;
}
#btn_refresh{
  width: 48rpx;
  height: 48rpx;
  position: absolute;
  bottom: 30rpx;
  right: 30rpx;
}

#checkImgNo{
  position: relative;
}
#checkImgNo>image{
  position: relative;
  height: 100rpx;
  width: 100%;
}
#checkImgNoRefreshBox{
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
}
#checkImgNoRefresh{
  background: #e6ece5;
  border-radius: 10rpx;
  padding: 4rpx 10rpx;
  color: #10d9b8;
  font-size: 28rpx;
}

/* 目标 */
.target{
  padding: 20rpx;
}
.target>text{
  color: #555;
  font-size: 24rpx;
}
.targetDes{
  height: 80rpx;
  background: #d7d7d7;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 80rpx;
  margin-top: 8rpx;
}
.targetDes>image{
  width: 40rpx;
  height: 36rpx;
  margin-right: 8rpx;
}
.targetDes>view{
  color: #333;
  font-size: 24rpx;
}
.targetDes>view>text{
  font-size: 40rpx;
}

/* 训练报告 */
.report{
  padding: 0 25rpx;
}
.reportTitle{
  display: flex;
  justify-content: space-between;
  padding: 25rpx 0 10rpx;
}
.reportTitleLeft,.trainSortTitleLeft,.resultSortTitleLeft{
  font-size: 32rpx;
  display: flex;
  align-items:center;
  color: #111;
}
.targetHistory,.trainSortTitleRight,.resultSortTitleRight{
  display: flex;
  align-items: center;
}
.targetHistory>text,.trainSortTitleRight>text,.resultSortTitleRight>text{
  color: #888;
  font-size: 32rpx;
  margin-right: 10rpx;
}
.targetHistory>image,.trainSortTitleRight>image,.resultSortTitleRight>image{
  width: 48rpx;
  height: 48rpx;
  display: block;
}

/* 训练报告 */
#taskComplete{
  display: flex;
  align-items: center;
  color: #F7B500;
  font-size: 32rpx;
  margin-bottom: 20rpx;
}
#taskComplete>image{
  width: 48rpx;
  height: 48rpx;
  margin-right: 10rpx;
}
#taskNocomplete{
  display: flex;
  align-items: center;
  color: #50e3c2;
  margin-bottom: 10rpx;
  font-size: 32rpx;
}
#taskNocomplete>image{
  width: 48rpx;
  height: 48rpx;
  margin-right: 10rpx;
}
#taskNocompleteDes{
  color: #111;
  font-size: 34rpx;
}

#taskCompleteDes{
  color: #111;
  font-size: 34rpx;
}
#taskCompleteDes>text{
  font-size: 36rpx;
  margin: 0 6rpx;
}

.reprotChartTitle{
  color: #111;
  font-size: 34rpx;
  margin-top: 10rpx;
  margin-bottom: 20rpx;
}
.reprotChartTitle>text{
  font-size: 36rpx;
  margin: 0 6rpx;
}

.reprotWeekChart {
	width: 100%;
	height: 400rpx;
}
.reprotPieChart {
	width: 100%;
  height: 540rpx;
  margin-top: 20rpx;
  padding-bottom: 30rpx;
}
.reprotChartSuggest{
  color: #888;
  font-size: 24rpx;
  padding-top: 10rpx;
}
.reprotChartSuggestTitle{
  font-size: 28rpx;
  /* color: #111; */
  margin-bottom: 10rpx;
}
.adviseItem{
  display: flex;
  margin-bottom: 20rpx;
}
.adviseItem>image{
  width: 24rpx;
  height: 24rpx;
  margin-right: 10rpx;
  padding-top:7rpx;
}

/* 训练排行 效果排行 */
#trainSort,#resultSort{
  color: #666;
  font-size: 32rpx;
}
.trainSortTitle,.resultSortTitle{
  display: flex;
  justify-content: space-between;
  padding: 30rpx 20rpx;
}
.trainSortListItemWrap,.resultSortListItemWrap{
  padding: 0 20rpx;
}
.trainSortListItemLeft, .resultSortListItemLeft{
  display: flex;
  align-items: center;
}
.trainSortListItemLeft>text, .resultSortListItemLeft>text{
  min-width: 65rpx;
}
.trainSortListItem,.resultSortListItem{
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1rpx solid #E5E5E5;
  padding: 30rpx 20rpx;
}
.trainSortListItemInfo,.resultSortListItemInfo{
  display: flex;
  align-items: center;
}
.trainSortListItemSelf, .resultSortListItemSelf{
  /* background: linear-gradient(to right, #60d4c6, #6be89b); */
  background-color: #dcf9f1;
}
/* .trainSortListItemSelf .trainSortListItem,.resultSortListItemSelf .resultSortListItem{
  border: 0;
} */
.trainSortListItemInfo>image, .resultSortListItemInfo>image{
  width: 50rpx;
  height: 50rpx;
  margin-right: 20rpx;
  border-radius: 50%;
}
.resultSortListItemRight{
  display: flex;
  align-items: center;
}
.resultSortListItemRight>image{
  width: 24rpx;
  height: 32rpx;
  margin-right: 12rpx;
}
.resultSortListItemRightEyeBox{
  display: flex;
  align-items: center;
}
.resultSortListItemRightEye{
  font-size: 28rpx;
  margin-left: 8rpx;
}
/* 底部灰色 */
#indexBottom{
  height: 115rpx;
  width: 100%;
  background: #e6ece5;
}

/* 训练成就 */
#achieve{
  color: #555;
  padding: 0 20rpx;
}
.achieveTitle{
  display: flex;
  justify-content: space-between;
  font-size: 32rpx;
  align-items:center;
  color: #111;
  padding: 25rpx 0;
}
.achieveTitle>image{
  width: 36rpx;
  height: 36rpx;
  display: block;
}
.achieveTime{
  font-size: 34rpx;
  color: #111;
  margin-bottom: 10rpx;
}
.achieveTime>text, .achieveChange>text{
  font-size: 36rpx;
  margin: 0 10rpx;
}
#suggest{
  font-size: 28rpx;
  color: #999;
}
.suggestItem{
  margin-bottom: 15rpx;
}
.achieveChange{
  font-size: 34rpx;
  color: #111;
  padding-bottom: 20rpx;
}
.leftEyeChart{
  position: relative;
	width: 100%;
  height: 480rpx;
  padding-bottom: 40rpx;
  border-bottom: 2rpx solid #e5e5e5;
}
.rightEyeChart{
  position: relative;
	width: 100%;
  height: 480rpx;
}
#leftEyeChartBox,#rightEyeChartBox{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20rpx 0 0rpx;
}
.legend_box{
  display: flex;
  justify-content: center;
  align-items: center;
}
.legend_over,.legend_no{
  display: flex;
  align-items: center;
}
.legend_over{
  margin-right: 30rpx;
}
.legend_over>image,.legend_no>image{
  width: 28rpx;
  height: 28rpx;
  margin-right: 5rpx;
}
.legend_over>text{
  color: #33d1c4;
  font-size: 22rpx;
}
.legend_no>text{
  color: #f7b500;
  font-size: 22rpx;
}
.eyeChartName{
  text-align: center;
  font-size: 28rpx;
  color: #666;
}
.rightEyeChart{
  padding-bottom: 10rpx;
}

#leftYear{
  font-size: 18rpx;
  height: 22rpx;
  line-height: 22rpx;
  background: #888;
  border-radius: 4rpx;
  color: #fff;
  padding: 0 5rpx;
  position: absolute;
  left: 20rpx;
  bottom: 52rpx;
}
#rightYear{
  font-size: 18rpx;
  height: 22rpx;
  line-height: 22rpx;
  background: #888;
  border-radius: 4rpx;
  padding: 0 5rpx;
  color: #fff;
  position: absolute;
  left: 20rpx;
  bottom: 22rpx;
}

/* 更新训练计划弹窗 */
#mustUpdate{
  background: rgba(0,0,0,0.5);
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
#mustUpdateTitle{
  font-size: 36rpx;
  color: #000000;
  padding: 50rpx 0 18rpx;
  text-align: center;
}
#mustUpdateDes{
  font-size: 30rpx;
  color: #888888;
  padding: 0 40rpx 30rpx;
  text-align: center;
}
#mustUpdateBox{
  width: 560rpx;
  position: absolute;
  left: 50%;
  top: 45%;
  border-radius: 8rpx;
  transform: translate(-50%,-50%);
  background: #fff;
}
/* 按钮 */
#mustUpdateBtn{
  font-size: 36rpx;
  color: #33D1C4;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 2rpx solid #E5E5E5;
  overflow: hidden;
}
#mustUpdateBtn>text{
  text-align: center;
  width: 49.2%;
  padding: 25rpx 0;
}
#lastGoBtn{
  border-right: 2rpx solid #E5E5E5;
}