trafficBroadcast/miniprogram/pages/provincialArea/index.wxss

/* miniprogram/pages/provincialArea/index.wxss */
.areaPage {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

.areaItem {
  height: 100vh;
  padding: 10rpx;
  box-sizing: border-box;
}

.content {
  padding: 20rpx 20rpx 60rpx 20rpx;
}

.title {
  text-align: center;
  margin: 20rpx 0;
}

.palybtn {
  position: relative;
  height: 30px;
}

.playAudio {
  z-index: 1;
  right: 20rpx;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  text-align: center;
  position: absolute;
  box-sizing: border-box;
  border: 1rpx solid #000;
}

.playAudioAnimation {
  animation-name: playAudio;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

@keyframes playAudio {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}