#recorder[data-v-ba069d1a]{display:flex;align-items:center;width:100%;justify-content:center}#recorder .record[data-v-ba069d1a]{margin-right:2rem}#recorder .record .record-tip[data-v-ba069d1a]{text-align:center;line-height:10px}#recorder .record .record-box[data-v-ba069d1a]{margin-bottom:1rem;cursor:pointer}#recorder .record .record-box .centant[data-v-ba069d1a]{padding:10px;border-radius:50%;background-color:#4690f5;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;position:relative}.circle[data-v-ba069d1a]{position:absolute;width:100%;height:100%;left:-3px;top:-3px;border-radius:50%;border:3px solid #fff}.circle1[data-v-ba069d1a],.circle2[data-v-ba069d1a]{-webkit-animation:circle-opacity-data-v-ba069d1a 3s infinite;animation:circle-opacity-data-v-ba069d1a 3s infinite}.circle2[data-v-ba069d1a]{-webkit-animation-delay:1s;animation-delay:1s}.circle3[data-v-ba069d1a]{-webkit-animation:circle-opacity-data-v-ba069d1a 3s infinite;animation:circle-opacity-data-v-ba069d1a 3s infinite;-webkit-animation-delay:2s;animation-delay:2s}.circle4[data-v-ba069d1a]{-webkit-animation:circle-opacity-data-v-ba069d1a 3s infinite;animation:circle-opacity-data-v-ba069d1a 3s infinite;-webkit-animation-delay:3s;animation-delay:3s}.startRecord[data-v-ba069d1a]{background-color:rgba(68,149,245,.5)!important}@-webkit-keyframes circle-opacity-data-v-ba069d1a{0%{opacity:1;transform:scale(0)}to{opacity:0;transform:scale(1)}}@keyframes circle-opacity-data-v-ba069d1a{0%{opacity:1;transform:scale(0)}to{opacity:0;transform:scale(1)}}