/* pages/MemorizingWords/MemorizingWords.wxss */
@import "/pages/index/goldArticle/goldArticle.wxss";

.content_box {
  padding: 0 30rpx;
  margin: 0;
}

.title {
  font-size: 48rpx;
  font-weight: bold;
  color: #1a1a1a;
  margin-left: 30rpx;
}

.content_item {
  padding: 0;
  margin-top: 40rpx;
  /* background: http://ewords.w.bronet.cn/images/ */
}

.swiper_box {
  width: 100%;
  height: 535rpx;
}
.swiper_item{
  padding: 0 30rpx;
  box-sizing: border-box;
}
.sub_title {
  font-size: 24rpx;
  color: #1db9fa;
}

.title_info {
  font-size: 24rpx;
  color: #1a1a1a;
  margin: 5rpx 0;
}

.sub_title_info {
  font-size: 30rpx;
  color: #999;
}

.progress_box {
  width: 100%;
  height: 400rpx;
  background: radial-gradient(circle, #6cf0f9, #1cb9fa);
  /* background: url(http://ewords.w.bronet.cn/images/) */
  border-radius: 10rpx;
  overflow: hidden;
  position: relative;
  margin-top: 10rpx;
}

.progress_num {
  font-size: 87rpx;
  color: #cdefff;
  position: absolute;
  top: 110rpx;
  left: 40rpx;
}

.progress_bar {
  width: 100%;
  height: 60rpx;
  background: rgba(0, 0, 0, 0.2);
  position: absolute;
  left: 0;
  bottom: 48rpx;
}

.progress_ing {
  width: 0%;
  border-top: 60rpx solid rgba(0, 0, 0, 0.2);
  border-right: 37rpx solid transparent;
}

.progress_img {
  width: 51rpx;
  height: 42rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 110rpx;
  left: 0%;
}

.progress_img image {
  width: 100%;
  height: 100%;
}

/* 选完词包的界面 */

.content_progress {
  width: 100%;
  height: 551rpx;
  background: #1dbafa;
  border-radius: 10rpx;
  margin-top: 35rpx;
  position: relative;
  /* display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; */
  overflow: hidden;
}

.label {
  width: 131rpx;
  height: 43rpx;
  font-size: 20rpx;
  color: #fff;
  border-radius: 0 22rpx 22rpx 0;
  background: #ffda94;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 24rpx;
}

.days {
  width: 120rpx;
  height: 120rpx;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  /* overflow: hidden; */
  position: relative;
  margin: 0 auto;
  margin-top: 28rpx;
}

.days image {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.image_txt{
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index:10;
}
.day_num {
font-size:32rpx;
color:#131313;
font-weight:bold;
/* position:absolute;
z-index:10;
top:18rpx;
left:50%;
transform: rotateX(-50%); */

}

.dau_unit {
  font-size: 20rpx;
  font-weight: bold;
  color: #131313;
  /* position: absolute;
  z-index: 10;
  top: 34rpx;
  right: 13rpx; */
}

.plan {
  width: 100rpx;
  height: 40rpx;
  font-size: 20rpx;
  color: #fff;
  border: 1rpx solid rgba(255, 255, 255, 1);
  border-radius: 10rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  margin-top: 18rpx;
  line-height: 40rpx;
}

.plan_box {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 40rpx;
}

.plan_item {
  font-size: 24rpx;
  color: #fff;
  text-align: center;
}

.plan_num {
  font-size: 36rpx;
  font-weight: bold;
  color: #fff;
}

.line {
  font-size: 50rpx;
  color: #fff;
  margin: 0 75rpx;
}

.words_type {
  font-size: 24rpx;
  color: #e0f5ff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 47rpx;
}

.icon-bianji {
  font-size: 15rpx;
  margin-right: 15rpx;
}

.progress_num2 {
  font-size: 72rpx;
  color: #cdefff;
  position: absolute;
  right: 46rpx;
  bottom: 47rpx;
}

.bar2 {
  height: 16rpx;
  position: absolute;
  bottom: 0;
  left: 0;
}

.ing2 {
  border-top: 16rpx solid rgba(0, 0, 0, 0.2);
  border-right: 37rpx solid transparent;
}

.img2 {
  position: absolute;
  bottom: 19rpx;
}

.bottom_btn {
  margin-top: 50rpx;
}

.btn1, .btn2, .btn3 {
  width: 100%;
  height: 80rpx;
  background: rgba(29, 185, 250, 1);
  border-radius: 40rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 36rpx;
  color: #fff;
  margin-bottom: 20rpx;
}

.btn2, .btn3 {
  color: #1db9fa;
  background: none;
  border: 1rpx solid #1db9fa;
}