.pledge-rect {
  fill: #fff;
  opacity: 0.5;
}
.pledge-xAxis > * {
  stroke: #fff;
  opacity: 0.5;
}
.pledge-xAxis .tick {
  opacity: 1;
}
.pledge-xAxis .tick line {
  opacity: 0;
}
.pledge-text {
  fill: #FEE3AB;
  font-size: 25px;
  font-weight: 400;
  text-anchor: middle;
  stroke: #FEE3AB;
  stroke-width: 0px;
  transform: rotate(-90deg);
  -ms-transform: rotate(-90deg); /* IE 9 */
  -moz-transform: rotate(-90deg); /* Firefox */
  -webkit-transform: rotate(-90deg); /* Safari 和 Chrome */
  -o-transform: rotate(-90deg); /* Opera */
}
.pledge-text-background {
  fill: #ffa82a;
  font-size: 25px;
  text-anchor: middle;
  transform: rotate(-90deg);
  -ms-transform: rotate(-90deg); /* IE 9 */
  -moz-transform: rotate(-90deg); /* Firefox */
  -webkit-transform: rotate(-90deg); /* Safari 和 Chrome */
  -o-transform: rotate(-90deg); /* Opera */
}
.pc .pledge-text {
  fill: #FEE3AB;
  font-size: 20px;
  text-anchor: middle;
  stroke: #FEE3AB;
  stroke-width: 0px;
}
.pc .pledge-text-background {
  fill: #ffa82a;
  font-size: 20px;
  text-anchor: middle;
}

@keyframes showBgStage {
  0% {
    background: rgba(255, 168, 42, 0);
  }
  100% {
    background: rgba(255, 168, 42, 0.75);
  }
}
@keyframes hideBgStage {
  0% {
    background: rgba(255, 168, 42, 0.75);
  }
  100% {
    background: rgba(255, 168, 42, 0);
  }
}

.stage0 .pledge_img {
  animation: 1s showBgStage;
  -webkit-animation: 1s showBgStage;
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
}
.stage1 .pledge_img {
  animation: 1s hideBgStage;
  -webkit-animation: 1s hideBgStage;
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
}
.pledge_img {
  z-index: 10;
}