@charset "UTF-8";
.ai-music {
  position: relative;
}
.ai-music .mv-dialog {
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0;
  inset-inline-start: 0;
  background: rgba(0, 0, 0, 0.74);
  z-index: 1000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .mv-dialog.loading .mv-dialog-content-main::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.2);
  z-index: 1001;
}
.ai-music .mv-dialog.loading .mv-dialog-content-main::after {
  position: absolute;
  content: "";
  display: inline-block;
  width: 40px;
  height: 40px;
  background: url("../img/ai-music/icon_loading-white.svg") no-repeat;
  background-size: cover;
  -webkit-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
  z-index: 1002;
}
@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.ai-music .mv-dialog .mv-dialog-content {
  width: 860px;
  padding: 22px 30px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border-radius: 19px;
  position: relative;
  overflow: hidden;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-top p {
  font: normal normal bold 20px/26px Poppins;
  color: #39325A;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-top p > span {
  font: inherit;
  color: inherit;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-top > span {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/mv_close.svg");
  -ms-flex-negative: 0;
      flex-shrink: 0;
  cursor: pointer;
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-top > span:hover {
    background: url("../img/ai-music/mv_close_hover.svg");
  }
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main {
  width: 800px;
  height: 450px;
  border-radius: 16px;
  margin: 23px 0;
  overflow: hidden;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #000;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main video {
  width: 100%;
  height: 100%;
  z-index: 8;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-play {
  width: 74px;
  height: 74px;
  background: url("../img/ai-music/mv_play_big.svg") no-repeat center;
  background-size: cover;
  position: absolute;
  z-index: 9;
  cursor: pointer;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-pause {
  width: 74px;
  height: 74px;
  background: url("../img/ai-music/mv_pause_big.svg") no-repeat center;
  background-size: cover;
  position: absolute;
  z-index: 9;
  cursor: pointer;
  display: none;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle {
  width: 100%;
  position: absolute;
  bottom: 15px;
  z-index: 9;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-grid-column-align: center;
      justify-self: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 12px;
  padding: 0 20px;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-dialog-content-main-handle-play {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  cursor: pointer;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-dialog-content-main-handle-play::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url("../img/ai-music/mv_play_white.svg");
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-dialog-content-main-handle-play:hover {
    background: rgba(255, 255, 255, 0.2) 0% 0% no-repeat padding-box;
  }
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-progress-track {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff)) no-repeat, rgba(255, 255, 255, 0.5);
  background: linear-gradient(#fff, #fff) no-repeat, rgba(255, 255, 255, 0.5);
  background-size: 0% 100%;
  border-radius: 5px;
  height: 6px;
  cursor: pointer;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-time {
  min-width: 60px;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-time, .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-time span {
  font: normal normal normal 12px/16px Roboto;
  color: #FFFFFF;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main.playing .mv-dialog-content-main-play {
  display: none;
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main.playing:hover .mv-dialog-content-main-pause {
    display: block;
  }
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main.playing .mv-dialog-content-main-handle .mv-dialog-content-main-handle-play::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url("../img/ai-music/mv_pause.svg");
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0 12px;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div {
  width: 86px;
  height: 56px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border: 1px solid rgba(140, 140, 151, 0.3019607843);
  border-radius: 6px;
  cursor: pointer;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div > p {
  font: normal normal normal 12px/20px Poppins;
  color: #1E1E2E;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div > span {
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url("../img/ai-music/mv_zoom.svg") no-repeat center;
  cursor: pointer;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div#mvEdit > span {
  background: url("../img/ai-music/mv_edit.svg") no-repeat center;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div#mvShare > span {
  background: url("../img/ai-music/mv_share.svg") no-repeat center;
}
.ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div#mvDownload > span {
  background: url("../img/ai-music/mv_download.svg") no-repeat center;
}
.ai-music .zoom-dialog {
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0;
  inset-inline-start: 0;
  background: rgba(0, 0, 0, 0.74);
  z-index: 1001;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .zoom-dialog.loading .zoom-dialog-main::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.2);
  z-index: 1001;
}
.ai-music .zoom-dialog.loading .zoom-dialog-main::after {
  position: absolute;
  content: "";
  display: inline-block;
  width: 40px;
  height: 40px;
  background: url("../img/ai-music/icon_loading-white.svg") no-repeat;
  background-size: cover;
  -webkit-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
  z-index: 1002;
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.ai-music .zoom-dialog .zoom-dialog-close {
  width: 44px;
  height: 44px;
  border-radius: 22px;
  background-color: rgba(255, 255, 255, 0.55);
  -webkit-transition: 0.2s;
  transition: 0.2s;
  position: absolute;
  top: 25px;
  inset-inline-end: 25px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .zoom-dialog .zoom-dialog-close > span {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/mv_zoom_close.svg") no-repeat center;
}
.ai-music .zoom-dialog .zoom-dialog-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 1200px;
  height: 675px;
}
.ai-music .zoom-dialog .zoom-dialog-content .zoom-dialog-content-play {
  width: 74px;
  height: 74px;
  background: url("../img/ai-music/mv_play_big.svg") no-repeat center;
  background-size: cover;
  position: absolute;
  z-index: 9;
  cursor: pointer;
}
.ai-music .zoom-dialog .zoom-dialog-content .zoom-dialog-content-pause {
  width: 74px;
  height: 74px;
  background: url("../img/ai-music/mv_pause_big.svg") no-repeat center;
  background-size: cover;
  position: absolute;
  z-index: 9;
  cursor: pointer;
  display: none;
}
.ai-music .zoom-dialog .zoom-dialog-main {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: #000;
  border-radius: 16px;
  position: relative;
}
.ai-music .zoom-dialog .zoom-dialog-main.playing .zoom-dialog-content-play {
  display: none;
}
.ai-music .zoom-dialog .zoom-dialog-main.playing:hover .zoom-dialog-content-pause {
  display: block;
}
.ai-music .zoom-dialog .zoom-dialog-main.playing .zoom-dialog-main-handle .zoom-dialog-main-handle-play::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url("../img/ai-music/mv_pause.svg");
}
.ai-music .zoom-dialog .zoom-dialog-main video {
  width: 100%;
  height: 100%;
  border-radius: 16px;
}
.ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle {
  width: 100%;
  position: absolute;
  bottom: 15px;
  z-index: 9;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-grid-column-align: center;
      justify-self: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 12px;
  padding: 0 20px;
}
.ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-dialog-main-handle-play {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  cursor: pointer;
}
.ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-dialog-main-handle-play::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url("../img/ai-music/mv_play_white.svg");
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-dialog-main-handle-play:hover {
    background: rgba(255, 255, 255, 0.2) 0% 0% no-repeat padding-box;
  }
}
.ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-progress-track {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff)) no-repeat, rgba(255, 255, 255, 0.5);
  background: linear-gradient(#fff, #fff) no-repeat, rgba(255, 255, 255, 0.5);
  background-size: 0% 100%;
  border-radius: 5px;
  height: 6px;
  cursor: pointer;
}
.ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-time {
  min-width: 60px;
}
.ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-time, .ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-time span {
  font: normal normal normal 12px/16px Roboto;
  color: #FFFFFF;
}
.ai-music .zoom-dialog .zoom-dialog-handle {
  width: 100%;
  margin-top: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
}
.ai-music .zoom-dialog .zoom-dialog-handle > div {
  width: 86px;
  height: 56px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid rgba(140, 140, 151, 0.3019607843);
  border-radius: 6px;
  cursor: pointer;
}
.ai-music .zoom-dialog .zoom-dialog-handle > div > span {
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url("../img/ai-music/mv_share.svg");
}
.ai-music .zoom-dialog .zoom-dialog-handle > div > p {
  font: normal normal normal 12px/20px Poppins;
  color: #1E1E2E;
}
.ai-music .zoom-dialog .zoom-dialog-handle > div#zoomEdit > span {
  background: url("../img/ai-music/mv_edit.svg");
}
.ai-music .zoom-dialog .zoom-dialog-handle > div#zoomDownload {
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}
.ai-music .zoom-dialog .zoom-dialog-handle > div#zoomDownload > span {
  background: url("../img/ai-music/mv_download.svg");
}
.ai-music .globel-mask {
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0;
  inset-inline-start: 0;
  background: rgba(255, 255, 255, 0.5);
  z-index: 100;
  display: none;
}
.ai-music .lyrics-dialog {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.7) 0% 0% no-repeat padding-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 9999;
}
.ai-music .lyrics-dialog .lyrics-dialog-content {
  width: 579px;
  height: 666px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #707070;
  border-radius: 19px;
  padding: 17px 27px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 9px;
  position: relative;
}
.ai-music .lyrics-dialog .lyrics-dialog-content .lyrics-dialog-close {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/close.svg") no-repeat center;
  background-size: cover;
  position: absolute;
  right: 17px;
  top: 17px;
  cursor: pointer;
}
.ai-music .lyrics-dialog .lyrics-dialog-content .lyrics-dialog-close:hover {
  background: url("../img/ai-music/close-hover.svg") no-repeat center;
  background-size: cover;
}
.ai-music .lyrics-dialog .lyrics-dialog-content .title {
  text-align: center;
  font: normal normal bold 28px/46px Poppins;
  color: #39325A;
}
.ai-music .lyrics-dialog .lyrics-dialog-content .lyrics-text {
  text-align: center;
  font: normal normal normal 14px/26px Poppins;
  color: #39325A;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  overflow-y: scroll;
}
.ai-music .card-container input[type=checkbox] {
  display: none;
}
.ai-music .card-container input[type=checkbox] + .card {
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: #efeff3 0% 0% no-repeat padding-box;
  border-radius: 8px;
  display: block;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.ai-music .card-container input[type=checkbox] + .card span.radio {
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 2px solid #d6d6d6;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  position: absolute;
  bottom: 8px;
  right: 8px;
}
.ai-music .card-container input[type=checkbox]:checked + .card span.radio {
  background-image: url("../img/ai-music/icon_tick.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
  background-color: #8b3dff;
  border: none;
}
.ai-music .card-container input[type=checkbox]:checked + .card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  -webkit-box-shadow: 0 0 0 3px #8b3dff inset;
          box-shadow: 0 0 0 3px #8b3dff inset;
  border-radius: inherit;
}
.ai-music .card-container .card-body {
  width: 100%;
  position: relative;
}
.ai-music .card-container .card-body img {
  display: block;
  width: 100%;
  font: normal normal 500 14px/21px Poppins;
  height: inherit;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
}
.ai-music .card-container .card-footer {
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 4px 0 8px;
  font: normal normal 500 14px/21px Poppins;
  letter-spacing: 0px;
  color: #39325a;
}
.ai-music .custom-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 24px;
}
.ai-music .custom-container > img {
  width: 20px;
  -webkit-margin-end: 6px;
          margin-inline-end: 6px;
  -webkit-box-ordinal-group: 1;
      -ms-flex-order: 0;
          order: 0;
}
.ai-music .custom-container > span {
  font: normal normal 500 18px/27px Poppins;
  color: #39325a;
  -webkit-margin-end: 16px;
          margin-inline-end: 16px;
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
.ai-music .custom-container .custom-selector {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}
.ai-music .custom-selector {
  position: relative;
}
.ai-music .custom-select {
  width: 136px;
  height: 46px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 11px 20px;
  font: normal normal normal 16px/25px Poppins;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 2px solid rgba(57, 50, 90, 0.5019607843);
  border-radius: 8px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
  position: relative;
}
.ai-music .custom-select::after {
  content: "";
  display: block;
  width: 13px;
  height: 8px;
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  right: 20px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.ai-music .custom-select.active::after {
  -webkit-transform: translateY(-50%) rotate(180deg);
          transform: translateY(-50%) rotate(180deg);
}
.ai-music .custom-select.active, .ai-music .custom-select:hover {
  background: #FAF3FE 0% 0% no-repeat padding-box;
}
.ai-music .custom-select-list {
  display: none;
  position: absolute;
  width: 100%;
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 2px solid #D2C8FF;
  border-radius: 8px;
  overflow: auto;
  z-index: 50;
  max-height: 237px;
  bottom: calc(100% + 8px);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 6px;
}
.ai-music .custom-select-list.upward {
  top: auto;
  bottom: calc(100% + 8px);
}
.ai-music .custom-select-list-item {
  min-height: 40px;
  font: normal normal normal 16px/25px Poppins;
  color: #39325a;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 14px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .custom-select-list-item.active {
  background: #F2E9FF 0% 0% no-repeat padding-box;
}
.ai-music .custom-select-list-item.active::after {
  content: "";
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/checked.png") no-repeat center;
}
.ai-music .custom-select-list-item:hover {
  background: #F2E9FF 0% 0% no-repeat padding-box;
}
.ai-music .custom-select-list::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.ai-music .custom-select-list::-webkit-scrollbar-track {
  border-radius: 10px;
  background: #fff;
}
.ai-music .custom-select-list::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(236, 234, 243, 0.7) 0% 0% no-repeat padding-box;
}
.ai-music .inspiring {
  position: relative;
}
.ai-music .inspiring.lyics-generate-btn.loading::before,
.ai-music .inspiring .photo-generate-btn.loading::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(255, 255, 255, 0.65);
  z-index: 99;
  cursor: no-drop;
  border-radius: 35px;
}
.ai-music .inspiring.credit_tip.loading::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(255, 255, 255, 0.65);
  z-index: 99;
  cursor: no-drop;
  border-radius: 16px 16px 0px 16px;
}
.ai-music .inspiring.loading::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(255, 255, 255, 0.65);
  z-index: 99;
  cursor: no-drop;
  border-radius: 10px;
}
.ai-music .generate-content {
  width: 100%;
  margin: 0 auto;
  position: sticky;
  bottom: 0;
  background-image: -webkit-gradient(linear, left bottom, left top, from(white), color-stop(60%), to(transparent));
  background-image: linear-gradient(0deg, white, 60%, transparent);
  -webkit-backdrop-filter: blur(50px);
          backdrop-filter: blur(50px);
  z-index: 30;
}
.ai-music .generate-content.generating::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(255, 255, 255, 0.65);
  z-index: 99;
}
.ai-music .generate-content .generate-bg {
  margin: 0 auto;
  padding: 25px 0 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 148px;
  background-image: -webkit-gradient(linear, left bottom, left top, from(white), color-stop(60%), to(transparent));
  background-image: linear-gradient(0deg, white, 60%, transparent);
  background-size: 0;
}
.ai-music .generate-content .generate-bg .deep-handle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .generate-content.sticky .generate-bg {
  background-size: 100%;
}
.ai-music .generate-content .generate-btn {
  width: 314px;
  border-radius: 25px;
  height: 48px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: #8B3DFF 0% 0% no-repeat padding-box;
  margin-bottom: 6px;
  cursor: pointer;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  position: relative;
}
.ai-music .generate-content .generate-btn:hover {
  background: #8E4DFF 0% 0% no-repeat padding-box;
}
.ai-music .generate-content .generate-btn > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}
.ai-music .generate-content .generate-btn span {
  font: normal normal 500 17px/26px Poppins;
  color: #ffffff;
}
.ai-music .generate-content p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font: normal normal 500 13px/20px Poppins;
  color: #6f6f6f;
}
.ai-music .generate-content p::before {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background-image: url("../img/ai-music/icon_copyright.svg");
  background-size: cover;
  margin-right: 4px;
}
.ai-music .custom-tip {
  position: relative;
  display: block;
  width: 16px;
  height: 16px;
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}
.ai-music .custom-tip img {
  width: inherit;
  height: inherit;
  -webkit-margin-start: 8px;
          margin-inline-start: 8px;
}
.ai-music .custom-tip > span {
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  opacity: 0;
  padding: 14px 16px;
  width: 206px;
  position: absolute;
  background-color: #fff;
  -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
          box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
  border: 1px solid #e2e5ee;
  text-align: left;
  font: normal normal 600 12px/18px Poppins;
  letter-spacing: 0px;
  color: #39325a;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  bottom: calc(100% + 18px);
  left: calc(50% + 63px);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  border-radius: 10px;
  pointer-events: none;
  z-index: 5;
}
.ai-music .custom-tip > span::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  background: #ffffff;
  -webkit-box-shadow: 5px 3px 6px rgba(0, 0, 0, 0.1607843137);
          box-shadow: 5px 3px 6px rgba(0, 0, 0, 0.1607843137);
  top: 91%;
  left: 40px;
}
.ai-music .custom-tip > img:hover + span {
  opacity: 1;
}
.ai-music .generating .music-container {
  position: relative;
  overflow: hidden;
}
.ai-music .generating .music-container::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 12px;
  bottom: 0;
  background: rgba(255, 255, 255, 0.85);
  z-index: 2;
}
.ai-music .generating .generate-btn {
  background-color: #cbbffd;
  pointer-events: none;
  cursor: not-allowed;
}
.ai-music .generate-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 16px;
  width: 1087px;
  margin: 20px auto 0;
  padding-bottom: 50px;
}
.ai-music .generate-list .generate-item {
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 1px solid #e2e2e2;
  border-radius: 10px;
  height: 72px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.ai-music .generate-list .generate-item .lottie-player {
  position: relative;
  width: 72px;
  height: 72px;
}
.ai-music .generate-list .generate-item .lottie-player > lottie-player {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.ai-music .generate-list .generate-item.generating {
  display: none;
}
.ai-music .generate-list .generate-item > span.isGenerating {
  font: normal normal normal 12px/18px Poppins;
  letter-spacing: 0px;
  color: #39325a;
}
.ai-music .generate-list .generate-item.music {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0 16px 0 24px;
}
.ai-music .music .music-left {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.ai-music .music .music-title {
  font: normal normal 600 14px/21px Poppins;
  color: #39325a;
  margin-bottom: 8px;
  width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ai-music .music .music-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .music .music-btn {
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: 100%;
  margin-right: 8px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  cursor: pointer;
}
.ai-music .music .music-btn.play {
  background-image: url("../img/ai-music/icon_play.svg");
}
.ai-music .music .music-btn.pause {
  background-image: url("../img/ai-music/icon_pause.svg");
}
.ai-music .music .music-time {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font: normal normal normal 12px/18px Poppins;
  letter-spacing: 0px;
  color: #39325a;
  width: 60px;
}
.ai-music .music .music-progress {
  width: 100%;
  height: 28px;
  margin: 0 26px 0 24px;
  position: relative;
  overflow: hidden;
}
.ai-music .music .music-progress-bg {
  background-image: url("../img/ai-music/icon_music_gray.png");
  position: absolute;
  cursor: pointer;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}
.ai-music .music .music-progress-bar {
  position: absolute;
  left: 0;
  width: 0%;
  background: transparent -webkit-gradient(linear, left top, left bottom, from(#8E4DFF), to(#8b3dff)) 0% 0% no-repeat padding-box;
  background: transparent linear-gradient(180deg, #8E4DFF 0%, #8b3dff 100%) 0% 0% no-repeat padding-box;
  height: 100%;
  z-index: 2;
  -webkit-transition: width 0.1s linear;
  transition: width 0.1s linear;
}
.ai-music .music .music-progress-track {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  background: #efeff3 0% 0% no-repeat padding-box;
  z-index: 1;
}
.ai-music .music .download-btn {
  padding: 11px 20px;
  background: #8B3DFF 0% 0% no-repeat padding-box;
  border-radius: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  font: normal normal 500 12px/18px Poppins;
  color: #ffffff;
  margin: 0 11px;
  height: 40px;
}
.ai-music .music .download-btn::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background-image: url("../img/ai-music/bth_icon_download.svg");
  background-size: cover;
  background-repeat: no-repeat;
  margin-right: 8px;
}
.ai-music .music .download-btn:hover {
  background: #8E4DFF 0% 0% no-repeat padding-box;
}
.ai-music .music .download-btn .flac-icon {
  display: inline-block;
  padding: 4px 16px;
  background: #FFAF26 0% 0% no-repeat padding-box;
  border-radius: 13px;
  font: normal normal bold 12px/18px Poppins;
  color: #0D033A;
  -webkit-margin-start: 22px;
          margin-inline-start: 22px;
}
.ai-music .music .view-lyrics {
  width: 40px;
  height: 40px;
  background: rgba(57, 50, 90, 0.1) 0% 0% no-repeat padding-box;
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  cursor: pointer;
}
.ai-music .music .view-lyrics:hover {
  background: rgba(57, 50, 90, 0.2) 0% 0% no-repeat padding-box;
  border-radius: 8px;
}
.ai-music .music .view-lyrics::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background: no-repeat center url("../img/ai-music/view.svg");
  background-size: 100%;
}
.ai-music .music .mobile-right {
  display: none;
}
.ai-music .custom-dialog {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 550px;
  max-width: 550px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 20px 31px 18px;
  background: #ffffff 0% 0% no-repeat padding-box;
  -webkit-box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1137254902);
          box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1137254902);
  border: 1px solid #e2e2e2;
  border-radius: 13px;
  z-index: 100;
}
.ai-music .custom-dialog .close-btn {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 7px;
  right: 9px;
  cursor: pointer;
}
.ai-music .custom-dialog .close-btn:hover path {
  stroke: #8b3dff;
}
.ai-music .custom-dialog-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 8px;
}
.ai-music .custom-dialog-footer .custom-comfirm-btn {
  width: 156px;
  height: 32px;
  background: #8E4DFF 0% 0% no-repeat padding-box;
  border-radius: 99px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 15px;
  font-weight: 500;
  font-family: Poppins;
  color: #ffffff;
  cursor: pointer;
}
.ai-music .custom-dialog-footer .custom-comfirm-btn:hover {
  opacity: 0.8;
}
.ai-music .generating-animate {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 3px;
  margin-left: 1px;
}
.ai-music .generating-animate i {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  display: block;
  background: white;
  -webkit-animation: progressgenerate 1.5s linear infinite;
          animation: progressgenerate 1.5s linear infinite;
}
.ai-music .generating-animate i:nth-child(2) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.ai-music .generating-animate i:nth-child(3) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}

.home-header .home-menu .menu-main .home-btn .credit-box .credit_menu {
  width: 418px;
}

.bottom-message.ero {
  background: #FC5959 !important;
}
.bottom-message.ero .icon-before {
  background: url("../img/ai-music/prompt_error.svg") !important;
}
.bottom-message.ero .text {
  color: #ffffff !important;
}

@-webkit-keyframes progressgenerate {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  70.1% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes progressgenerate {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  70.1% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
#failed-dialog,
#confirm-dialog,
#buy-dialog,
#flac-dialog,
#upgrade-dialog {
  z-index: 1001;
}
#failed-dialog .buy-dialog,
#confirm-dialog .buy-dialog,
#buy-dialog .buy-dialog,
#flac-dialog .buy-dialog,
#upgrade-dialog .buy-dialog {
  width: unset;
  height: unset;
  padding: 8px 31px;
  background: -webkit-gradient(linear, left top, right top, from(#F4D21B), to(#FF9362));
  background: linear-gradient(90deg, #F4D21B 0%, #FF9362 100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#failed-dialog .buy-dialog .buy-dialog_icon,
#confirm-dialog .buy-dialog .buy-dialog_icon,
#buy-dialog .buy-dialog .buy-dialog_icon,
#flac-dialog .buy-dialog .buy-dialog_icon,
#upgrade-dialog .buy-dialog .buy-dialog_icon {
  width: 15px;
  height: 15px;
  background: no-repeat center url("../img/image-to-video/bth_coins.svg");
  background-size: 100%;
  margin-right: 6px;
}
#failed-dialog .buy-dialog .buy-dialog_num,
#confirm-dialog .buy-dialog .buy-dialog_num,
#buy-dialog .buy-dialog .buy-dialog_num,
#flac-dialog .buy-dialog .buy-dialog_num,
#upgrade-dialog .buy-dialog .buy-dialog_num {
  font: normal normal 500 15px/20px Poppins;
}
#failed-dialog .failed-body,
#confirm-dialog .failed-body,
#buy-dialog .failed-body,
#flac-dialog .failed-body,
#upgrade-dialog .failed-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 17px;
  margin-bottom: 27px;
}
#failed-dialog .failed-body > img,
#confirm-dialog .failed-body > img,
#buy-dialog .failed-body > img,
#flac-dialog .failed-body > img,
#upgrade-dialog .failed-body > img {
  width: 56px;
  height: 56px;
}
#failed-dialog .failed-body .failed-title,
#confirm-dialog .failed-body .failed-title,
#buy-dialog .failed-body .failed-title,
#flac-dialog .failed-body .failed-title,
#upgrade-dialog .failed-body .failed-title {
  font: normal normal bold 17px/26px Poppins;
  color: #39325a;
  margin-bottom: 3px;
}
#failed-dialog .failed-body .failed-desc,
#confirm-dialog .failed-body .failed-desc,
#buy-dialog .failed-body .failed-desc,
#flac-dialog .failed-body .failed-desc,
#upgrade-dialog .failed-body .failed-desc {
  font: normal normal normal 14px/21px Poppins;
  color: #39325a;
}

#success-dialog {
  display: none;
}
#success-dialog .success-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
  margin-bottom: 3px;
}
#success-dialog .success-header img {
  width: 32px;
  height: 32px;
}
#success-dialog .success-header > div {
  font: normal normal bold 16px/25px Poppins;
  color: #8E4DFF;
}
#success-dialog .success-body {
  text-align: left;
  font: normal normal 300 14px/21px Poppins;
  letter-spacing: 0px;
  margin-bottom: 20px;
}
#success-dialog .success-body span {
  text-decoration: underline;
  font: normal normal 300 14px/21px Poppins;
  color: #8E4DFF;
  cursor: pointer;
}

#downloading-dialog {
  display: none;
  padding-bottom: 36px;
}
#downloading-dialog .custom-progress-body > p {
  font: normal normal 500 17px/26px Poppins;
  color: #39325a;
  margin-bottom: 20px;
}
#downloading-dialog .custom-progress-bar {
  width: 100%;
  height: 11px;
  border-radius: 99px;
  background: #eeecff 0% 0% no-repeat padding-box;
  border: 1px solid #eeecff;
  position: relative;
  overflow: hidden;
}
#downloading-dialog .custom-progress-bar .custom-progress {
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  position: absolute;
  left: 0;
  top: 0;
  width: 0%;
  height: 100%;
  background: #8E4DFF 0% 0% no-repeat padding-box;
}

#downloading-select-dialog {
  display: none;
}

.ai-music {
  width: 100%;
  background-image: -webkit-gradient(linear, left top, right top, from(#fff9f9), to(#ebe9ff));
  background-image: linear-gradient(to right, #fff9f9, #ebe9ff);
  min-height: 50vh;
  padding-top: 24px;
}
.ai-music .ai-music-h1 {
  font: normal normal bold 34px/55px Poppins;
  font-weight: 600;
  text-align: center;
  color: #39325a;
  letter-spacing: 0px;
}
.ai-music .ai-music-p {
  width: 1086px;
  height: auto;
  margin: auto;
  text-align: center;
  font: normal normal 300 18px/30px Poppins;
  font-size: 18px;
  line-height: 27px;
  letter-spacing: 0px;
  margin-top: 5px;
  color: #39325a;
}
.ai-music .ATA__tab_bar {
  width: 860px;
  height: 53px;
  margin: auto;
  margin-top: 15px;
  background: #ffffff 0% 0% no-repeat padding-box;
  -webkit-box-shadow: 0px 6px 16px rgba(139, 61, 255, 0.2705882353);
          box-shadow: 0px 6px 16px rgba(139, 61, 255, 0.2705882353);
  border: 1px solid rgba(139, 61, 255, 0.2117647059);
  border-radius: 99px;
  padding: 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.ai-music .ATA__tab_bar .tab__bar_item {
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  width: 330px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #39325a;
  border-radius: 99px;
  text-align: center;
  font: normal normal 600 16px Poppins;
  letter-spacing: 0px;
  cursor: pointer;
  position: relative;
}
.ai-music .ATA__tab_bar .tab__bar_item .new {
  position: absolute;
  right: 8px;
  top: -5px;
  display: inline-block;
  padding: 0 5px;
  background: #E10808 0% 0% no-repeat padding-box;
  border-radius: 9px;
  font: normal normal 500 12px/18px Poppins;
  color: #FFFFFF;
}
.ai-music .ATA__tab_bar .tab__bar_item.active {
  background: #8b3dff 0% 0% no-repeat padding-box !important;
  color: #fff !important;
}
.ai-music .ATA__tab_bar_mob {
  display: none;
}
.ai-music .music-container {
  width: 1087px;
  margin: 0px auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding-bottom: 120px;
}
.ai-music .music-container .style-content-container {
  background: #fff 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  border-radius: 24px;
  padding: 0.32rem 0.3rem 0;
}
.ai-music .music-container .style-content-container .style-content-container-title {
  font: normal normal bold 22px/35px Poppins;
  color: #39325A;
  margin-bottom: 16px;
}
.ai-music .tabcontent {
  display: none;
}
.ai-music .tabcontent.active {
  display: block;
}
.ai-music .style-content {
  margin-bottom: 16px;
}
.ai-music .style-title {
  font: normal normal bold 18px/27px Poppins;
  color: #39325a;
  margin-bottom: 16px;
}
.ai-music .style-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.ai-music .style-list .card-container {
  width: 156px;
  margin-right: 17px;
  margin-bottom: 16px;
}
.ai-music .style-list .card-container .card-body {
  height: 116px;
}
.ai-music .style-list .card-container:nth-child(6n) {
  margin-right: 0;
}
.ai-music .text-title {
  margin-bottom: 18px;
  font: normal normal bold 24px/35px Poppins;
  letter-spacing: 0px;
  color: #39325a;
}
.ai-music .text-content {
  position: relative;
  margin: 22px auto 20px;
  width: 1087px;
  background: #fff 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  border-radius: 24px;
  padding: 22px 32px;
}
.ai-music .text-content .text-banner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 12px;
}
.ai-music .text-content .text-banner .title {
  font: normal normal bold 22px/35px Poppins;
  color: #39325A;
}
.ai-music .text-content .text-banner .title .char {
  font: italic normal normal 13px/20px Poppins;
  color: #8B8B8B;
  -webkit-margin-start: 10px;
          margin-inline-start: 10px;
}
.ai-music .text-content .text-banner .title .char.error {
  color: #e93030;
}
.ai-music .text-content .text-banner .library-container {
  position: relative;
}
.ai-music .text-content .text-banner .library-container .library-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .text-content .text-banner .library-container .library-btn::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background-image: url("../img/ai-music/icon_music.svg");
  background-size: cover;
  margin-right: 8px;
}
.ai-music .text-content .text-banner .library-container .library-btn > span {
  text-align: right;
  font: normal normal 500 18px/27px Poppins;
  margin-right: 12px;
  color: #8b3dff;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .text-content .text-banner .library-container .library-btn > img {
  width: 10px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.ai-music .text-content .text-banner .library-container .library-btn.active > span, .ai-music .text-content .text-banner .library-container .library-btn:hover > span {
  text-decoration: underline;
}
.ai-music .text-content .text-banner .library-container .library-btn.active > img {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.ai-music .text-content .text-banner .library-container .library-list-content {
  display: none;
  position: absolute;
  width: 578px;
  background: #ffffff 0% 0% no-repeat padding-box;
  -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
          box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
  border-radius: 6px;
  padding: 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  z-index: 50;
  top: calc(100% + 8px);
  right: -20px;
  max-height: 285;
  overflow: auto;
}
.ai-music .text-content .text-banner .library-container .library-list-content::-webkit-scrollbar {
  width: 4px;
  height: 10px;
}
.ai-music .text-content .text-banner .library-container .library-list-content::-webkit-scrollbar-track {
  border-radius: 10px;
  background: #fff;
}
.ai-music .text-content .text-banner .library-container .library-list-content::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(236, 234, 243, 0.7) 0% 0% no-repeat padding-box;
}
.ai-music .text-content .text-banner .library-container .library-list-content::-webkit-scrollbar-thumb:hover {
  background: rgb(236, 234, 243) 0% 0% no-repeat padding-box;
}
.ai-music .text-content .text-banner .library-container .library-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 8px;
}
.ai-music .text-content .text-banner .library-container .library-list .library-item {
  width: 105px;
  cursor: pointer;
}
.ai-music .text-content .text-banner .library-container .library-list .library-item .library-img > img {
  width: 100%;
  height: 60px;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 8px;
  display: block;
  margin-bottom: 2px;
  font: normal normal 500 12px/18px Poppins;
}
.ai-music .text-content .text-banner .library-container .library-list .library-item > p {
  font: normal normal 500 12px/18px Poppins;
  letter-spacing: 0px;
  color: #2c374f;
}
.ai-music .text-content .text-banner .library-container .library-list .library-item:nth-child(3n) {
  margin-right: 0;
}
.ai-music .text-content .text-banner .library-container .library-list .library-item.active .library-img {
  position: relative;
}
.ai-music .text-content .text-banner .library-container .library-list .library-item.active .library-img::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-box-shadow: 0 0 0 2px #8b3dff inset;
          box-shadow: 0 0 0 2px #8b3dff inset;
  border-radius: 8px;
}
.ai-music .text-content .text-banner .library-container .library-list .library-item.active > p {
  font: normal normal 500 12px/18px Poppins;
  color: #8E4DFF;
}
.ai-music .text-content .textarea-wrap {
  display: block;
  width: 100%;
  height: 142px;
  padding: 10px 16px;
  border-radius: 10px;
  border: 1px solid #e2e2e2;
  background: #ffffff 0% 0% no-repeat padding-box;
}
.ai-music .text-content .textarea-wrap textarea::-webkit-scrollbar {
  width: 4px;
  height: 10px;
}
.ai-music .text-content .textarea-wrap textarea::-webkit-scrollbar-track {
  border-radius: 10px;
  background: #fff;
}
.ai-music .text-content .textarea-wrap textarea::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(236, 234, 243, 0.7) 0% 0% no-repeat padding-box;
}
.ai-music .text-content .textarea-wrap textarea::-webkit-scrollbar-thumb:hover {
  background: rgb(236, 234, 243) 0% 0% no-repeat padding-box;
}
.ai-music .text-content #textarea {
  width: 100%;
  height: 100%;
  text-align: left;
  font: normal normal 500 14px/21px Poppins;
  color: #39325a;
  resize: none;
  outline: none;
  border: none;
  background-color: transparent;
}
.ai-music .text-content #textarea::-webkit-input-placeholder {
  color: #8b8b8b;
  font: normal normal 500 14px/21px Poppins;
}
.ai-music .text-content #textarea::-moz-placeholder {
  color: #8b8b8b;
  font: normal normal 500 14px/21px Poppins;
}
.ai-music .text-content #textarea:-ms-input-placeholder {
  color: #8b8b8b;
  font: normal normal 500 14px/21px Poppins;
}
.ai-music .text-content #textarea::-ms-input-placeholder {
  color: #8b8b8b;
  font: normal normal 500 14px/21px Poppins;
}
.ai-music .text-content #textarea::placeholder {
  color: #8b8b8b;
  font: normal normal 500 14px/21px Poppins;
}
.ai-music .tool-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 46px;
  padding-top: 4px;
}
.ai-music .tool-content .custom-container {
  margin-bottom: 0;
}
.ai-music .lyics-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 24px;
  margin: 22px 0;
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.85) 0% 0% no-repeat padding-box;
  border: 1px solid rgb(226, 226, 226);
  border-radius: 10px;
}
.ai-music .lyics-content.generating {
  position: relative;
}
.ai-music .lyics-content.generating::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(255, 255, 255, 0.65);
  z-index: 99;
  border-radius: 10px;
}
.ai-music .lyics-content .lyics-title {
  font: normal normal bold 24px/35px Poppins;
  color: #39325A;
  margin-bottom: 8px;
}
.ai-music .lyics-content .lyics-title > span {
  display: inline-block;
  font: normal normal bold 24px/35px Poppins;
  color: #E10808;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -webkit-margin-end: auto;
          margin-inline-end: auto;
}
.ai-music .lyics-content .lyics-left {
  width: 577px;
  position: relative;
}
.ai-music .lyics-content .lyics-left .lyics-song-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  padding: 9px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  border-radius: 10px;
  gap: 8px;
  margin-bottom: 16px;
}
.ai-music .lyics-content .lyics-left .lyics-song-title input {
  padding: 4px;
  font: normal normal 500 14px/24px Poppins;
  color: #39325A;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.ai-music .lyics-content .lyics-left .lyics-song-title input::-webkit-input-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-song-title input::-moz-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-song-title input:-ms-input-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-song-title input::-ms-input-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-song-title input::placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn {
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 4px;
  padding: 8px 19px;
  font: normal normal 500 14px/20px Poppins;
  color: #FFFFFF;
  background: #8B3DFF 0% 0% no-repeat padding-box;
  border-radius: 8px;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn:hover {
  background: #7A31E8 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn > span {
  display: inline-block;
  width: 14px;
  height: 14px;
  background: url("../img/ai-music/star.png") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn#inspire > span {
  display: inline-block;
  width: 12px;
  height: 16px;
  background: url("../img/ai-music/flesh.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn#inspireLoading {
  padding: 4px 30px;
}
.ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn#inspireLoading lottie-player {
  width: 30px;
  height: 30px;
}
.ai-music .lyics-content .lyics-left #lyicsChar {
  font: italic normal normal 13px/20px Poppins;
  color: #8B8B8B;
  position: absolute;
  right: 0;
  top: 135px;
}
.ai-music .lyics-content .lyics-left #lyicsChar.error {
  color: #e93030;
}
.ai-music .lyics-content .lyics-left .lyics-text {
  width: 100%;
  height: 497px;
  padding: 6px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
  position: relative;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  border: none;
  outline: none;
  padding: 10px;
  resize: none;
  font: normal normal 500 14px/24px Poppins;
  color: #39325A;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea::-webkit-input-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea::-moz-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea:-ms-input-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea::-ms-input-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea::placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea::-webkit-scrollbar {
  width: 4px;
  height: 10px;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea::-webkit-scrollbar-track {
  border-radius: 10px;
  background: #fff;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(236, 234, 243, 0.7) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-left .lyics-text textarea::-webkit-scrollbar-thumb:hover {
  background: rgb(236, 234, 243) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags {
  width: 100%;
  background: rgba(57, 50, 90, 0.031372549) 0% 0% no-repeat padding-box;
  border-radius: 6px;
  padding: 12px 10px;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-title {
  font: normal normal normal 14px/24px Poppins;
  color: #39325A;
  margin-bottom: 12px;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .more-close {
  position: absolute;
  display: inline-block;
  width: 20px;
  height: 20px;
  right: -150px;
  top: 30px;
  background: url("../img/ai-music/close.svg") no-repeat;
  background-size: cover;
  z-index: 999;
  cursor: pointer;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .more-close:hover {
  background: url("../img/ai-music/close-hover.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item {
  padding: 3px 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px;
  border: 1px solid #9B94BB;
  border-radius: 6px;
  font: normal normal normal 14px/24px Poppins;
  color: #39325A;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item:hover {
  background: #F6F3FF 0% 0% no-repeat padding-box;
  border: 1px solid #8B3DFF;
  color: #8B3DFF;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item:hover > span {
  background: url("../img/ai-music/add-hover.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item > span {
  display: inline-block;
  width: 12px;
  height: 12px;
  background: url("../img/ai-music/add.png") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more {
  position: relative;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more > span {
  background: url("../img/ai-music/more.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more:hover, .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more.active {
  border: 1px solid #8E4DFF;
  color: #8E4DFF;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more:hover > span, .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more.active > span {
  background: url("../img/ai-music/more-hover.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content {
  width: 328px;
  height: 422px;
  position: absolute;
  left: 0;
  bottom: 36px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  -webkit-box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1137254902);
          box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1137254902);
  border: 1px solid #E2E2E2;
  border-radius: 13px;
  padding: 12px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 12px;
  z-index: 9;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0 12px 0 16px;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-title > p {
  font: normal normal 600 16px/24px Poppins;
  color: #39325A;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  overflow-y: scroll;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list::before {
  content: "";
  height: 2px;
  width: 96%;
  background-color: #f0f0f0;
  position: absolute;
  left: 8px;
  top: 46px;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list::-webkit-scrollbar {
  width: 4px;
  height: 10px;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list::-webkit-scrollbar-track {
  border-radius: 10px;
  background: #fff;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(236, 234, 243, 0.7) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list::-webkit-scrollbar-thumb:hover {
  background: rgb(236, 234, 243) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item {
  padding: 8px 16px;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item:hover {
  background: rgba(57, 50, 90, 0.0509803922) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item .title > p {
  font: normal normal 500 14px/16px Poppins;
  color: #39325A;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item .title .type {
  display: inline-block;
  padding: 0 8px;
  background: rgba(109, 77, 255, 0.1) 0% 0% no-repeat padding-box;
  border-radius: 6px;
  font: normal normal normal 12px/16px Poppins;
  color: #8B3DFF;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item .title .type.Common {
  background: rgba(54, 183, 139, 0.1) 0% 0% no-repeat padding-box;
  color: #36B78B;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item .title .type.Func {
  background: rgba(32, 110, 200, 0.1) 0% 0% no-repeat padding-box;
  color: #206EC8;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item .title .type.Perf {
  background: rgba(255, 77, 148, 0.1) 0% 0% no-repeat padding-box;
  color: #FF4D94;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item .title .type.Theory {
  background: rgba(0, 212, 220, 0.1) 0% 0% no-repeat padding-box;
  color: #00D4DC;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item .title .type.Other {
  background: rgba(255, 170, 0, 0.1) 0% 0% no-repeat padding-box;
  color: #FFAA00;
}
.ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item .des {
  font: normal normal normal 12px/24px Poppins;
  color: #938FA4;
}
.ai-music .lyics-content .lyics-left #mySong {
  padding: 10px 12px;
  background: rgba(139, 61, 255, 0.15) 0% 0% no-repeat padding-box;
  border-radius: 8px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 6px;
  font: normal normal 500 14px/16px Poppins;
  color: #8B3DFF;
  margin-top: 18px;
  cursor: pointer;
}
.ai-music .lyics-content .lyics-left #mySong span {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url("../img/ai-music/mySong.svg") no-repeat center;
}
.ai-music .lyics-content .lyics-left #mySong:hover {
  background: rgba(139, 61, 255, 0.2) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-right {
  width: 486px;
}
.ai-music .lyics-content .lyics-right .lyics-right-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .lyics-content .lyics-right .lyics-randomize {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 6px;
  font: normal normal 500 12px/20px Poppins;
  color: #8B3DFF;
  cursor: pointer;
}
.ai-music .lyics-content .lyics-right .lyics-randomize:hover {
  text-decoration: underline;
}
.ai-music .lyics-content .lyics-right .lyics-randomize > span {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("../img/ai-music/radom.png") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .prompt-cover-tab {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  background: #E5E5E6 0% 0% no-repeat padding-box;
  border-radius: 10px 10px 0px 0px;
  position: relative;
  bottom: -1px;
}
.ai-music .lyics-content .lyics-right .prompt-cover-tab > div {
  padding: 12px 36px;
  border-radius: 10px 10px 0px 0px;
  font: normal normal normal 14px/18px Poppins;
  color: #8B8B8B;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  cursor: pointer;
}
.ai-music .lyics-content .lyics-right .prompt-cover-tab > div:hover {
  background: #F2E9FF 0% 0% no-repeat padding-box;
  color: #8B3DFF;
}
.ai-music .lyics-content .lyics-right .prompt-cover-tab > div:hover::before {
  border: 4px solid #8B3DFF;
}
.ai-music .lyics-content .lyics-right .prompt-cover-tab > div > span {
  display: inline-block;
  padding: 1px 5px;
  font: normal normal 500 12px/18px Poppins;
  color: #FFFFFF;
  background: #E10808 0% 0% no-repeat padding-box;
  border-radius: 9px;
}
.ai-music .lyics-content .lyics-right .prompt-cover-tab > div::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 7px;
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 4px solid #8B8B8B;
}
.ai-music .lyics-content .lyics-right .prompt-cover-tab > div.active {
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  border-bottom: unset;
  font: normal normal 600 14px/18px Poppins;
  color: #8B3DFF;
}
.ai-music .lyics-content .lyics-right .prompt-cover-tab > div.active::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 7px;
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 4px solid #8B3DFF;
}
.ai-music .lyics-content .lyics-right .cover-content {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 13px 16px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  gap: 8px;
  border-radius: 0 10px 10px 10px;
  margin-bottom: 8px;
}
.ai-music .lyics-content .lyics-right .cover-content .title {
  font: normal normal normal 14px/19px Poppins;
  color: #39325A;
}
.ai-music .lyics-content .lyics-right .cover-content #musicUpload {
  display: none;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 11px 12px;
  font: normal normal normal 14px/19px Poppins;
  color: #39325A;
  background: rgba(155, 148, 187, 0.031372549) 0% 0% no-repeat padding-box;
  border: 1px solid #9B94BB;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item.disabled {
  cursor: no-drop;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item.disabled:hover {
  border: 1px solid #9B94BB;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item.disabled:hover .check-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url("../img/ai-music/checked.svg") no-repeat;
  background-size: cover;
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item.cover-content-item-uploading.disabled {
  cursor: pointer;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item.cover-content-item-uploading.disabled:hover {
  border: 1px solid #8B3DFF;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item.cover-content-item-uploading.disabled:hover .check-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url("../img/ai-music/checked_active.svg") no-repeat;
  background-size: cover;
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font: normal normal normal 14px/19px Poppins;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-text .placeholder {
  font: normal normal normal 14px/19px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-text .placeholder span {
  font: inherit;
  color: inherit;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 100%;
  font: normal normal normal 14px/19px Poppins;
  background: transparent;
  border: none;
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-padding-end: 12px;
          padding-inline-end: 12px;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl::-webkit-input-placeholder {
  font: normal normal normal 14px/19px Poppins;
  color: #8B8B8B;
  opacity: 1;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl::-moz-placeholder {
  font: normal normal normal 14px/19px Poppins;
  color: #8B8B8B;
  opacity: 1;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl:-ms-input-placeholder {
  font: normal normal normal 14px/19px Poppins;
  color: #8B8B8B;
  opacity: 1;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl::-ms-input-placeholder {
  font: normal normal normal 14px/19px Poppins;
  color: #8B8B8B;
  opacity: 1;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl::placeholder {
  font: normal normal normal 14px/19px Poppins;
  color: #8B8B8B;
  opacity: 1;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item.active {
  border: 1px solid #8B3DFF;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item.active .check-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url("../img/ai-music/checked_active.svg") no-repeat;
  background-size: cover;
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item:hover {
  border: 1px solid #8B3DFF;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .upload {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/upload_icon.svg") no-repeat;
  background-size: cover;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .youtube {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/youtube.svg") no-repeat;
  background-size: cover;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .play {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/play_black.svg") no-repeat;
  background-size: cover;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .play.stop {
  background: url("../img/ai-music/stop.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .check-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url("../img/ai-music/checked.svg") no-repeat;
  background-size: cover;
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .close-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/delete_icon.svg") no-repeat;
  background-size: cover;
  -webkit-margin-start: 8px;
          margin-inline-start: 8px;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .close-icon:hover {
  background: url("../img/ai-music/error_h.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .uploading {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/uploading_icon.svg") no-repeat;
  background-size: cover;
  -webkit-margin-end: 8px;
          margin-inline-end: 8px;
  -webkit-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-time,
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-time {
  width: 90px;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-time,
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-time > span {
  font: normal normal normal 14px/24px Poppins;
  color: #39325A;
}
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-progress-track {
  width: 220px;
  height: 6px;
  background: rgba(57, 50, 90, 0.1) 0% 0% no-repeat padding-box;
  border-radius: 3px;
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.ai-music .lyics-content .lyics-right .cover-content .hr {
  width: 100%;
  height: 1px;
  border: 1px dashed #707070;
  margin: 36px 0;
}
.ai-music .lyics-content .lyics-right .lyics-style {
  width: 100%;
  height: 372px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
  padding: 6px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  border-radius: 0 10px 10px 10px;
  margin-bottom: 16px;
}
.ai-music .lyics-content .lyics-right #lyicsStyle {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  padding: 12px 10px;
  border: none;
  outline: none;
  padding: 10px;
  resize: none;
  font: normal normal 500 14px/24px Poppins;
  color: #39325A;
}
.ai-music .lyics-content .lyics-right #lyicsStyle::-webkit-input-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-right #lyicsStyle::-moz-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-right #lyicsStyle:-ms-input-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-right #lyicsStyle::-ms-input-placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-right #lyicsStyle::placeholder {
  font: normal normal 500 14px/24px Poppins;
  color: #8B8B8B;
}
.ai-music .lyics-content .lyics-right #lyicsStyle::-webkit-scrollbar {
  width: 4px;
  height: 10px;
}
.ai-music .lyics-content .lyics-right #lyicsStyle::-webkit-scrollbar-track {
  border-radius: 10px;
  background: #fff;
}
.ai-music .lyics-content .lyics-right #lyicsStyle::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(236, 234, 243, 0.7) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-right #lyicsStyle::-webkit-scrollbar-thumb:hover {
  background: rgb(236, 234, 243) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-right .lyics-style-content {
  width: 100%;
  height: 253px;
  background: rgba(57, 50, 90, 0.031372549) 0% 0% no-repeat padding-box;
  border-radius: 6px;
  padding: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 26px;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab > .lyics-style-tips {
  -webkit-margin-start: auto;
          margin-inline-start: auto;
  display: inline-block;
  min-width: 16px;
  height: 16px;
  background: url("../img/ai-music/icon_tips.svg") no-repeat;
  background-size: cover;
  cursor: pointer;
  position: relative;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab > .lyics-style-tips:hover {
  background: url("../img/ai-music/icon_tips-h.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab > .lyics-style-tips:hover .tips-words {
  display: inline-block;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab > .lyics-style-tips .tips-words {
  position: absolute;
  display: none;
  padding: 14px 9px;
  width: 236px;
  font: normal normal normal 12px/18px Poppins;
  color: #39325A;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
          box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
  border: 1px solid #E2E5EE;
  top: -80px;
  left: -30px;
  border-radius: 6px;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab > .lyics-style-tips .tips-words::after {
  content: "";
  position: absolute;
  bottom: -9px;
  /* 让小三角位于 tips-words 的底部 */
  left: 30px;
  /* 小三角的左侧距离 tips-words 的左边沿 30px */
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 10px solid #FFFFFF;
  /* 小三角颜色与背景相同 */
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab .lyics-style-tab-item {
  font: normal normal 300 14px/24px Poppins;
  color: #79748F;
  cursor: pointer;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab .lyics-style-tab-item:hover {
  color: #39325A;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab .lyics-style-tab-item.active {
  font: normal normal 600 14px/24px Poppins;
  color: #8B3DFF;
  position: relative;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab .lyics-style-tab-item.active::before {
  content: "";
  width: 22px;
  height: 4px;
  background: #8B3DFF 0% 0% no-repeat padding-box;
  border-radius: 2px;
  position: absolute;
  left: 0;
  bottom: -5px;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-container {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  overflow-y: scroll;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-container::-webkit-scrollbar {
  width: 4px;
  height: 10px;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-container::-webkit-scrollbar-track {
  border-radius: 10px;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-container::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(236, 234, 243, 0.7) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-container::-webkit-scrollbar-thumb:hover {
  background: rgb(236, 234, 243) 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-container .lyics-style-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-container .lyics-style-list .lyics-style-list-item {
  padding: 3px 14px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #9B94BB;
  border-radius: 6px;
  font: normal normal normal 14px/24px Poppins;
  color: #39325A;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-container .lyics-style-list .lyics-style-list-item:hover {
  background: #F6F3FF 0% 0% no-repeat padding-box;
  color: #8B3DFF;
}
.ai-music .lyics-content .lyics-right .lyics-gender {
  padding: 18px 16px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  margin-bottom: 22px;
}
.ai-music .lyics-content .lyics-right .lyics-gender .gender-item {
  padding: 4px 14px;
  border: 1px solid #9B94BB;
  border-radius: 6px;
  color: #39325A;
  font: normal normal normal 14px/24px Poppins;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .lyics-content .lyics-right .lyics-gender .gender-item.active {
  background: #8B3DFF 0% 0% no-repeat padding-box;
  border: 1px solid #8B3DFF;
  color: #FFFFFF;
}
.ai-music .lyics-content .lyics-right .lyics-gender .gender-item.active:hover {
  background: #8B3DFF 0% 0% no-repeat padding-box;
  border: 1px solid #8B3DFF;
  color: #FFFFFF;
}
.ai-music .lyics-content .lyics-right .lyics-gender .gender-item:hover {
  background: #F6F3FF 0% 0% no-repeat padding-box;
  border: 1px solid #8B3DFF;
  color: #8B3DFF;
}
.ai-music .lyics-content .lyics-right .lyics-generate-btn {
  width: 100%;
  height: 64px;
  border-radius: 35px;
  background: #8B3DFF 0% 0% no-repeat padding-box;
  text-align: center;
  font: normal normal 500 17px/64px Poppins;
  color: #FFFFFF;
  margin-bottom: 8px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
.ai-music .lyics-content .lyics-right .lyics-generate-btn .credit_tip {
  position: absolute;
  top: -13px;
  right: 7px;
  height: 25px;
  border-radius: 16px 16px 0px 16px;
  background: -webkit-gradient(linear, left top, right top, from(#F4D21B), to(#FF9362));
  background: linear-gradient(90deg, #F4D21B 0%, #FF9362 100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 11px;
  display: none;
  z-index: 9;
}
.ai-music .lyics-content .lyics-right .lyics-generate-btn .credit_tip .credit_icon {
  width: 12px;
  height: 12px;
  background: no-repeat center url("../img/image-to-video/bth_coins.svg");
  background-size: 100%;
  margin-right: 6px;
}
.ai-music .lyics-content .lyics-right .lyics-generate-btn .credit_tip .credit_num {
  font: normal normal 600 11px/12px Poppins;
}
.ai-music .lyics-content .lyics-right .lyics-generate-btn:hover {
  background: #8E4DFF 0% 0% no-repeat padding-box;
}
.ai-music .lyics-content .lyics-right .lyics-generate-btn .generating-animate {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 3px;
  margin-left: 1px;
  margin-top: 10px;
}
.ai-music .lyics-content .lyics-right .lyics-generate-btn .generating-animate i {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  display: block;
  background: white;
  -webkit-animation: progressgenerate 1.5s linear infinite;
          animation: progressgenerate 1.5s linear infinite;
}
.ai-music .lyics-content .lyics-right .lyics-generate-btn .generating-animate i:nth-child(2) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.ai-music .lyics-content .lyics-right .lyics-generate-btn .generating-animate i:nth-child(3) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.ai-music .lyics-content .lyics-right .share-text, .ai-music .lyics-content .lyics-right .mv-text {
  font: normal normal normal 13px/20px Poppins;
  color: #6F6F6F;
  margin-bottom: 11px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 6px;
  cursor: pointer;
}
.ai-music .lyics-content .lyics-right .share-text > span, .ai-music .lyics-content .lyics-right .mv-text > span {
  display: inline-block;
  min-width: 16px;
  height: 16px;
  background: url("../img/ai-music/check_normal.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .share-text:hover > span, .ai-music .lyics-content .lyics-right .mv-text:hover > span {
  background: url("../img/ai-music/check_hover.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .share-text.selected > span, .ai-music .lyics-content .lyics-right .mv-text.selected > span {
  background: url("../img/ai-music/check_selected.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .share-text.selected:hover > span, .ai-music .lyics-content .lyics-right .mv-text.selected:hover > span {
  background: url("../img/ai-music/check_selected.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .deep-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font: normal normal normal 13px/20px Poppins;
  color: #6F6F6F;
}
.ai-music .lyics-content .lyics-right .deep-text > span {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: inline-block;
  width: 14px;
  height: 14px;
  background: url("../img/ai-music/icon_copyright.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .deep-text > .lyics-style-tips {
  -webkit-margin-start: auto;
          margin-inline-start: auto;
  display: inline-block;
  min-width: 16px;
  height: 16px;
  background: url("../img/ai-music/icon_tips.svg") no-repeat;
  background-size: cover;
  cursor: pointer;
  position: relative;
}
.ai-music .lyics-content .lyics-right .deep-text > .lyics-style-tips:hover {
  background: url("../img/ai-music/icon_tips-h.svg") no-repeat;
  background-size: cover;
}
.ai-music .lyics-content .lyics-right .deep-text > .lyics-style-tips:hover .tips-words {
  display: inline-block;
}
.ai-music .lyics-content .lyics-right .deep-text > .lyics-style-tips .tips-words {
  position: absolute;
  display: none;
  padding: 14px 9px;
  width: 236px;
  font: normal normal normal 12px/18px Poppins;
  color: #39325A;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
          box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
  border: 1px solid #E2E5EE;
  top: -100px;
  left: -30px;
  border-radius: 6px;
  z-index: 999;
}
.ai-music .lyics-content .lyics-right .deep-text > .lyics-style-tips .tips-words::after {
  content: "";
  position: absolute;
  bottom: -9px;
  /* 让小三角位于 tips-words 的底部 */
  left: 30px;
  /* 小三角的左侧距离 tips-words 的左边沿 30px */
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 10px solid #FFFFFF;
  /* 小三角颜色与背景相同 */
}
.ai-music .explorer-container {
  position: relative;
}
.ai-music .explorer-container .isowner-text {
  position: absolute;
  inset-inline-start: 14px;
  bottom: 18px;
  font: normal normal normal 13px/20px Poppins;
  color: #6F6F6F;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 6px;
  cursor: pointer;
  z-index: 97;
}
.ai-music .explorer-container .isowner-text > span {
  display: inline-block;
  min-width: 16px;
  height: 16px;
  background: url("../img/ai-music/check_normal.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .isowner-text:hover > span {
  background: url("../img/ai-music/check_hover.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .isowner-text.selected > span {
  background: url("../img/ai-music/check_selected.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .isowner-text.selected:hover > span {
  background: url("../img/ai-music/check_selected.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .explorer-container .explorer-top .explorer-title {
  font: normal normal bold 24px/35px Poppins;
  color: #39325A;
}
.ai-music .explorer-container .explorer-top .explorer-select {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 12px;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-item {
  padding: 8px 14px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #9B94BB;
  border-radius: 6px;
  font: normal normal normal 14px/18px Poppins;
  color: #39325A;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  cursor: pointer;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-item:hover, .ai-music .explorer-container .explorer-top .explorer-select .tag-item.active {
  background: #F6F3FF 0% 0% no-repeat padding-box;
  border: 1px solid #8B3DFF;
  color: #8B3DFF;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more {
  padding: 8px 14px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 2px solid #E4E3E6;
  border-radius: 6px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 6px;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  cursor: pointer;
  position: relative;
  height: 38px;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content {
  position: absolute;
  padding: 16px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  -webkit-box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1137254902);
          box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1137254902);
  border: 1px solid #E2E2E2;
  border-radius: 13px;
  z-index: 100;
  top: 45px;
  width: 410px;
  right: -290px;
  height: 268px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 12px;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab > .tag-more-tips {
  -webkit-margin-start: auto;
          margin-inline-start: auto;
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("../img/ai-music/icon_tips.svg") no-repeat;
  background-size: cover;
  cursor: pointer;
  position: relative;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab > .tag-more-tips:hover {
  background: url("../img/ai-music/icon_tips-h.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab .tag-more-tab-item {
  font: normal normal 300 14px/24px Poppins;
  color: #79748F;
  cursor: pointer;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab .tag-more-tab-item:hover {
  color: #39325A;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab .tag-more-tab-item.active {
  font: normal normal 600 14px/24px Poppins;
  color: #8B3DFF;
  position: relative;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab .tag-more-tab-item.active::before {
  content: "";
  width: 22px;
  height: 4px;
  background: #8B3DFF 0% 0% no-repeat padding-box;
  border-radius: 2px;
  position: absolute;
  left: 0;
  bottom: -5px;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  overflow-y: scroll;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container::-webkit-scrollbar {
  width: 4px;
  height: 10px;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container::-webkit-scrollbar-track {
  border-radius: 10px;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(236, 234, 243, 0.7) 0% 0% no-repeat padding-box;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container::-webkit-scrollbar-thumb:hover {
  background: rgb(236, 234, 243) 0% 0% no-repeat padding-box;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container .tag-more-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container .tag-more-list .tag-more-list-item {
  padding: 3px 14px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #9B94BB;
  border-radius: 6px;
  font: normal normal normal 14px/24px Poppins;
  color: #39325A;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container .tag-more-list .tag-more-list-item:hover {
    background: #F6F3FF 0% 0% no-repeat padding-box;
    color: #8B3DFF;
    border: 1px solid #8B3DFF;
  }
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container .tag-more-list .tag-more-list-item.selected {
  background: #F6F3FF 0% 0% no-repeat padding-box;
  color: #8B3DFF;
  border: 1px solid #8B3DFF;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url("../img/ai-music/tag-more.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text {
  font: normal normal normal 14px/18px Poppins;
  color: #39325A;
  opacity: 0.5;
  -webkit-padding-end: 20px;
          padding-inline-end: 20px;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text .clear-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("../img/ai-music/error.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text .clear-icon:hover {
  background: url("../img/ai-music/error_h.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text > .tag-text {
  font: inherit;
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text.active {
  font: normal normal normal 16px/25px Poppins;
  color: #8B3DFF;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 10px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  opacity: 1;
  -webkit-padding-end: 0;
          padding-inline-end: 0;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text.active > .tag-text {
  font: inherit;
  color: inherit;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-down {
  display: inline-block;
  width: 13px;
  height: 8px;
  background: url("../img/ai-music/icon_pull_down.svg") no-repeat;
  background-size: cover;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more.active {
  border: 2px solid #8B3DFF;
  color: #8B3DFF;
}
.ai-music .explorer-container .explorer-top .explorer-select .tag-more.active .tag-down {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.ai-music .explorer-container .explorer-list {
  margin-top: 8px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  border-radius: 10px;
  padding: 14px;
  position: relative;
  overflow: hidden;
  min-height: 500px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.ai-music .explorer-container .explorer-list .explorer-loading {
  position: absolute;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 98;
}
.ai-music .explorer-container .explorer-list .explorer-loading p {
  text-align: center;
  font: normal normal normal 14px/21px Poppins;
  color: #39325A;
}
.ai-music .explorer-container .explorer-list .explorer-empty {
  position: absolute;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  z-index: 98;
  gap: 10px;
}
.ai-music .explorer-container .explorer-list .explorer-empty p {
  text-align: center;
  font: normal normal normal 14px/24px Poppins;
  color: #39325A;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 16px;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-line-pack: start;
      align-content: flex-start;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item {
  background: rgba(57, 50, 90, 0.0392156863) 0% 0% no-repeat padding-box;
  border-radius: 6px;
  width: 340px;
  height: 64px;
  padding: 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 8px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  position: relative;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .delete-icon {
  position: absolute;
  bottom: 8px;
  right: 8px;
  display: inline-block;
  width: 16px;
  height: 16px;
  cursor: pointer;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .mv-icon {
  position: absolute;
  top: 8px;
  right: 8px;
  display: inline-block;
  width: 18px;
  height: 16px;
  cursor: pointer;
  background: url("../img/ai-music/mv_icon.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item:hover .delete-icon {
  background: url("../img/ai-music/delete.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item:hover .delete-icon:hover {
  background: url("../img/ai-music/delete_hover.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item:hover .explorer-item-img::before, .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item.stop .explorer-item-img::before {
  position: absolute;
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/play.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item.loading .explorer-item-img::before {
  position: absolute;
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/icon_loading-white.svg") no-repeat;
  background-size: cover;
  -webkit-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item.active .explorer-item-img::before {
  position: absolute;
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/stop.svg") no-repeat;
  background-size: cover;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item.active .explorer-item-prompt {
  display: none;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item.active .explorer-item-progress {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-img {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(57, 50, 90, 0.1019607843);
  border-radius: 6px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  overflow: hidden;
  position: relative;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-img > img {
  width: 100%;
  height: 100%;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-name {
  font: normal normal 600 16px/25px Poppins;
  color: #39325A;
  width: 250px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-prompt {
  font: normal normal normal 12px/18px Poppins;
  color: #39325A;
  opacity: 0.6;
  width: 250px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 18px;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress {
  display: none;
  gap: 0 10px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress .explorer-item-progress-track {
  width: 185px;
  height: 6px;
  background: rgba(57, 50, 90, 0.1) 0% 0% no-repeat padding-box;
  border-radius: 3px;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress .explorer-item-time {
  font: normal normal normal 11px/17px Poppins;
  color: #39325A;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress .explorer-item-time .explorer-item-current-time {
  font: normal normal normal 11px/17px Poppins;
  color: #8B3DFF;
}
.ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress .explorer-item-time .explorer-item-total-time {
  font: normal normal normal 11px/17px Poppins;
  color: #39325A;
}
.ai-music .explorer-container .explorer-list .explorer-list-deep {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 12px;
  min-height: 26px;
}
.ai-music .explorer-container .explorer-list .explorer-pagation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 12px;
  -webkit-margin-start: auto;
          margin-inline-start: auto;
}
.ai-music .explorer-container .explorer-list .explorer-pagation .page-el {
  display: inline-block;
  width: 22px;
  height: 22px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #383357;
  background: url("../img/ai-music/icon-left.svg") no-repeat center;
  background-position: center;
  border-radius: 6px;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.ai-music .explorer-container .explorer-list .explorer-pagation .page-el:hover {
  border: 1px solid #8B3DFF;
  background: url("../img/ai-music/icon-left-hover.svg") no-repeat center;
  background-position: center;
}
.ai-music .explorer-container .explorer-list .explorer-pagation .page-el.disabled {
  border: 1px solid #CFCCDE;
  background: url("../img/ai-music/icon-left-disabled.svg") no-repeat center;
  background-position: center;
  cursor: no-drop;
}
.ai-music .explorer-container .explorer-list .explorer-pagation .page-el.next-el {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.ai-music .explorer-container .explorer-list .explorer-pagation .page-text {
  font: normal normal normal 16px/25px Poppins;
  color: #39325A;
}
.ai-music .explorer-container .explorer-list .explorer-pagation .page-text span {
  font: inherit;
  color: inherit;
}
.ai-music .photo-content {
  width: 1087px;
  margin: 22px auto 0;
}
.ai-music .photo-content .photo-content-wrapper {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
}
.ai-music .photo-content .photo-content-wrapper.disabled::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: #ffffff;
  opacity: 0.85;
  z-index: 99;
}
.ai-music .photo-content .photo-content-wrapper > div {
  background: rgba(255, 255, 255, 0.85) 0% 0% no-repeat padding-box;
  border: 1px solid #E2E2E2;
  border-radius: 10px;
  padding: 16px;
  width: 524px;
  height: 620px;
}
.ai-music .photo-content .photo-content-wrapper > div.photo-content-right {
  width: 540px;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper {
  position: relative;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-img-area {
  position: absolute;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  top: -2px;
  left: -2px;
  z-index: 9;
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 1px solid rgba(57, 50, 90, 0.2);
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-img-area .delete-icon {
  width: 38px;
  height: 38px;
  position: absolute;
  right: 12px;
  top: 12px;
  background: rgba(0, 0, 0, 0.6) 0% 0% no-repeat padding-box;
  border: 1px solid rgba(255, 255, 255, 0.7019607843);
  border-radius: 6px;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-img-area .delete-icon::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url("../img/ai-music/delete_white.svg") no-repeat center;
  background-size: cover;
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-img-area .delete-icon:hover {
    background: #D64E6A 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
  }
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-img-area img {
  width: auto;
  height: auto;
  max-height: 100%;
  max-width: 100%;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area {
  width: 100%;
  padding: 63px 0 28px;
  background: rgba(139, 61, 255, 0.0509803922) 0% 0% no-repeat padding-box;
  border: 1px dashed #8B3DFF;
  border-radius: 8px;
  text-align: center;
  margin-bottom: 35px;
  position: relative;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .drag-area {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  background-image: -webkit-gradient(linear, left bottom, left top, from(white), color-stop(60%), to(transparent));
  background-image: linear-gradient(0deg, white, 60%, transparent);
  -webkit-backdrop-filter: blur(20px);
          backdrop-filter: blur(20px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  font: normal normal normal 18px/24px Poppins;
  letter-spacing: 0px;
  color: #39325A;
  z-index: 99;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area #photoUpload {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .photo-upload-btn {
  display: inline-block;
  width: 220px;
  height: 48px;
  margin: 40px auto 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  font: normal normal normal 14px/48px Poppins;
  color: #FFFFFF;
  background: #8B3DFF 0% 0% no-repeat padding-box;
  border-radius: 8px;
  cursor: pointer;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .photo-upload-btn::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/upload-icon.svg") no-repeat center;
  background-size: cover;
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .photo-upload-btn:hover {
    background: #8E4DFF 0% 0% no-repeat padding-box;
  }
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .photo-upload-btn.loading {
  background: #8E4DFF 0% 0% no-repeat padding-box;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .photo-upload-btn.loading::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ai-music/icon_loading-white.svg") no-repeat;
  background-size: cover;
  -webkit-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area p {
  font: normal normal normal 14px/21px Poppins;
  color: #39325A;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .tips {
  margin-top: 62px;
  font: normal normal normal 12px/18px Poppins;
  color: #39325A;
  opacity: 0.6;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .hr {
  width: 90%;
  margin: 0 auto 35px;
  height: 2px;
  background-color: #f0f0f0;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper > p {
  text-align: center;
  font: normal normal normal 14px/21px Poppins;
  color: #39325A;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .simple-area {
  margin-top: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .simple-area .simple-item {
  width: 111px;
  height: 111px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .simple-area .simple-item:hover {
    opacity: 0.8;
  }
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .simple-area img {
  border-radius: 10px;
  width: 100%;
  height: 100%;
}
.ai-music .photo-content .photo-content-wrapper > div .left-wapper .simple-area.disabled::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: #ffffff;
  opacity: 0.85;
  z-index: 99;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-title {
  font: normal normal 600 16px/22px Poppins;
  color: #39325A;
  margin-bottom: 8px;
}
.ai-music .photo-content .photo-content-wrapper > div .prompt-area {
  padding: 16px;
  overflow-y: scroll;
  max-height: 155px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 12px;
  border: 1px solid #E2E2E2;
  border-radius: 10px;
  margin-bottom: 12px;
}
.ai-music .photo-content .photo-content-wrapper > div .prompt-area .photo-prompt-item {
  padding: 3px 14px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #9B94BB;
  border-radius: 6px;
  font: normal normal normal 14px/24px Poppins;
  color: #39325A;
  cursor: pointer;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .photo-content .photo-content-wrapper > div .prompt-area .photo-prompt-item:hover {
    background: #F6F3FF 0% 0% no-repeat padding-box;
    color: #8B3DFF;
  }
}
.ai-music .photo-content .photo-content-wrapper > div .prompt-area .photo-prompt-item.active {
  background: #8B3DFF 0% 0% no-repeat padding-box;
  color: #ffffff;
  border: 1px solid #8B3DFF;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn {
  width: 100%;
  height: 64px;
  border-radius: 35px;
  background: #8B3DFF 0% 0% no-repeat padding-box;
  text-align: center;
  font: normal normal 500 17px/64px Poppins;
  color: #FFFFFF;
  margin-bottom: 8px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .credit_tip {
  position: absolute;
  top: -13px;
  right: 7px;
  height: 25px;
  border-radius: 16px 16px 0px 16px;
  background: -webkit-gradient(linear, left top, right top, from(#F4D21B), to(#FF9362));
  background: linear-gradient(90deg, #F4D21B 0%, #FF9362 100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 11px;
  display: none;
  z-index: 9;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .credit_tip .credit_icon {
  width: 12px;
  height: 12px;
  background: no-repeat center url("../img/image-to-video/bth_coins.svg");
  background-size: 100%;
  margin-right: 6px;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .credit_tip .credit_num {
  font: normal normal 600 11px/12px Poppins;
}
@media (hover: hover) and (pointer: fine) {
  .ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn:hover {
    background: #8E4DFF 0% 0% no-repeat padding-box;
  }
}
.ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .generating-animate {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 3px;
  margin-left: 1px;
  margin-top: 10px;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .generating-animate i {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  display: block;
  background: white;
  -webkit-animation: progressgenerate 1.5s linear infinite;
          animation: progressgenerate 1.5s linear infinite;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .generating-animate i:nth-child(2) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .generating-animate i:nth-child(3) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-tips {
  margin-top: 8px;
  font: normal normal normal 13px/20px Poppins;
  letter-spacing: 0px;
  color: #6F6F6F;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
}
.ai-music .photo-content .photo-content-wrapper > div .photo-tips span {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  display: inline-block;
  width: 14px;
  height: 14px;
  background: url(../img/ai-music/icon_copyright.svg) no-repeat;
  background-size: cover;
}

@media screen and (min-width: 1200px) {
  .ai-music .ai-music-p {
    width: 1080px;
  }
  .ai-music .custom-select::after {
    background-image: url("../img/ai-music/icon_pull_down.svg");
  }
  .ai-music .library-item:hover .library-img {
    position: relative;
  }
  .ai-music .library-item:hover .library-img::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-box-shadow: 0 0 0 2px #8b3dff inset;
            box-shadow: 0 0 0 2px #8b3dff inset;
    border-radius: 8px;
  }
  .ai-music .library-item:hover > p {
    font: normal normal 500 12px/18px Poppins;
    color: #8E4DFF;
  }
  .ai-music .card-container:hover .card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
    -webkit-box-shadow: 0 0 0 3px #8b3dff inset;
            box-shadow: 0 0 0 3px #8b3dff inset;
    border-radius: inherit;
  }
  .ai-music .ATA__tab_bar .tab__bar_item:hover {
    cursor: pointer;
    color: #000;
    background: #eee2ff 0% 0% no-repeat padding-box;
  }
}
@media screen and (max-width: 1200px) {
  .bottom-message {
    width: 90% !important;
    position: fixed;
    top: 50% !important;
  }
  .ai-music {
    padding-top: 0.3rem;
  }
  .ai-music .mv-dialog .mv-dialog-content {
    width: 90%;
    height: unset;
    padding: unset;
    border-radius: 0.4rem;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-top {
    padding: 0.4rem;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-top p {
    font: normal normal bold 0.32rem/0.32rem Poppins;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-top > span {
    min-width: 0.32rem;
    min-height: 0.32rem;
    background: url("../js/share-dialog/image/winIconClose.png") no-repeat;
    background-size: cover;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main {
    width: 100%;
    border: 1px solid rgba(57, 50, 90, 0.2);
    border-radius: unset;
    margin: unset;
    background-color: #000;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-play {
    display: none;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-pause {
    display: none;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle {
    width: 100%;
    bottom: 0.25rem;
    gap: 0 0.2rem;
    padding: 0 0.2rem;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-dialog-content-main-handle-play {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    cursor: pointer;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-dialog-content-main-handle-play::before {
    content: "";
    display: inline-block;
    width: 22px;
    height: 22px;
    background: url("../img/ai-music/mv_play_white.svg");
  }
}
@media screen and (max-width: 1200px) and (hover: hover) and (pointer: fine) {
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-dialog-content-main-handle-play:hover {
    background: rgba(255, 255, 255, 0.2) 0% 0% no-repeat padding-box;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-time {
    min-width: 60px;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-time, .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main .mv-dialog-content-main-handle .mv-time span {
    font: normal normal normal 0.2rem/0.26rem Roboto;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main.playing .mv-dialog-content-main-play {
    display: none;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-main.playing .mv-dialog-content-main-handle .mv-dialog-content-main-handle-play::before {
    content: "";
    display: inline-block;
    width: 22px;
    height: 22px;
    background: url("../img/ai-music/mv_pause.svg");
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0.4rem;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div {
    width: unset;
    min-width: 2rem;
    height: unset;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: unset;
    -webkit-box-direction: unset;
        -ms-flex-direction: unset;
            flex-direction: unset;
    border: 1px solid rgba(140, 140, 151, 0.3019607843);
    border-radius: 6px;
    padding: 0.15rem 0.25rem;
    gap: 0.12rem;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div#mvEdit {
    display: none;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div > p {
    font: normal normal normal 0.24rem/0.24rem Poppins;
  }
  .ai-music .mv-dialog .mv-dialog-content .mv-dialog-content-handle > div > span {
    display: inline-block;
    min-width: 0.34rem;
    min-height: 0.34rem;
    background: url("../img/ai-music/mv_zoom.svg") no-repeat center;
    background-size: cover;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .zoom-dialog .zoom-dialog-close {
    z-index: 1002;
  }
  .ai-music .zoom-dialog .zoom-dialog-content {
    max-width: 100%;
    height: 100%;
    position: relative;
  }
  .ai-music .zoom-dialog .zoom-dialog-content .zoom-dialog-content-play {
    display: none;
  }
  .ai-music .zoom-dialog .zoom-dialog-content .zoom-dialog-content-pause {
    display: none;
  }
  .ai-music .zoom-dialog .zoom-dialog-main {
    background-color: unset;
    position: unset;
  }
  .ai-music .zoom-dialog .zoom-dialog-main video {
    width: 100%;
    height: 100%;
    border-radius: unset;
  }
  .ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle {
    position: absolute;
    bottom: 1.2rem;
    gap: 0 0.2rem;
    padding: 0 0.2rem;
  }
  .ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-time {
    min-width: 60px;
  }
  .ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-time, .ai-music .zoom-dialog .zoom-dialog-main .zoom-dialog-main-handle .zoom-time span {
    font: normal normal normal 0.2rem/0.2rem Roboto;
    color: #FFFFFF;
  }
  .ai-music .zoom-dialog .zoom-dialog-handle {
    display: none;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .lyrics-dialog .lyrics-dialog-content {
    width: 90%;
    height: 10rem;
    border-radius: 0.4rem;
    padding: 0.37rem;
    gap: 0.26rem;
  }
  .ai-music .lyrics-dialog .lyrics-dialog-content .title {
    font: normal normal bold 0.36rem/0.55rem Poppins;
  }
  .ai-music .lyrics-dialog .lyrics-dialog-content .lyrics-text {
    font: normal normal normal 0.24rem/0.36rem Poppins;
    -webkit-padding-end: 0.2rem;
            padding-inline-end: 0.2rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .custom-container {
    margin-bottom: 0.1rem;
  }
  .ai-music .custom-container > img {
    width: 0.32rem;
    height: 0.32rem;
    margin-right: 0.12rem;
  }
  .ai-music .custom-container > span {
    font: normal normal 500 0.24rem/0.35rem Poppins;
    letter-spacing: 0rem;
    color: #39325a;
    margin-right: 0.34rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .custom-select {
    width: 1.79rem;
    height: 0.64rem;
    padding: 0.16rem;
    border: 0.02rem solid #f2cfff;
    border-radius: 0.04rem;
    text-align: left;
    font: normal normal 500 0.24rem/0.35rem Poppins;
    letter-spacing: 0rem;
    color: #39325a;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -webkit-margin-start: auto;
            margin-inline-start: auto;
    -webkit-transition: 0.2s;
    transition: 0.2s;
  }
  .ai-music .custom-select::after {
    width: 0.24rem;
    height: 0.2rem;
    right: 0.24rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    background-image: url("../img/ai-music/icon_drop-down.png");
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .custom-select-list {
    padding: 0.08rem;
    border: 0.02rem solid #f2cfff;
    border-radius: 0.04rem;
    bottom: calc(100% + 0.16rem);
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .custom-select-list-item {
    padding: 0 0.12rem;
    min-height: 0.4rem;
    font: normal normal 500 0.24rem/0.68rem Poppins;
  }
  .ai-music .custom-select-list-item.active {
    background-size: 0.32rem;
    background-position: right 0.08rem center;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .generate-container {
    position: relative;
    z-index: 35;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .generate-content {
    width: 100%;
    margin: 0 auto;
    background: rgb(255, 255, 255) 0% 0% no-repeat padding-box;
    -webkit-backdrop-filter: blur(0.5rem);
            backdrop-filter: blur(0.5rem);
  }
  .ai-music .generate-content .generate-bg {
    padding: 0.25rem 0;
    width: 100%;
    background-image: -webkit-gradient(linear, left bottom, left top, from(white), color-stop(70%), to(transparent));
    background-image: linear-gradient(0deg, white, 70%, transparent);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-line-pack: center;
        align-content: center;
    gap: 0.41rem;
  }
  .ai-music .generate-content .generate-bg > div {
    width: 100%;
  }
  .ai-music .generate-content .tool-content {
    padding: 0 0.9rem;
  }
  .ai-music .generate-content .deep-handle {
    padding: 0 0.3rem;
  }
  .ai-music .generate-content .generate-btn {
    width: 90%;
    height: 0.88rem;
    margin-bottom: 0.16rem;
  }
  .ai-music .generate-content .generate-btn span {
    font: normal normal 500 0.26rem/0.39rem Poppins;
  }
  .ai-music .generate-content .generate-btn i.generating-animate {
    gap: 0.06rem;
    margin-right: 0.1rem;
  }
  .ai-music .generate-content .generate-btn i.generating-animate > i {
    width: 0.06rem;
    height: 0.06rem;
  }
  .ai-music .generate-content.sticky .generate-bg {
    margin: 0 auto;
  }
  .ai-music .generate-content p {
    font: normal normal 500 0.2rem/0.3rem Poppins;
  }
  .ai-music .generate-content p::before {
    width: 0.2rem;
    height: 0.2rem;
    margin-right: 0.08rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .ai-music-h1 {
    font: normal normal bold 0.45rem/0.6rem Poppins;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .ai-music-p {
    width: 6.3rem;
    height: auto;
    font: normal normal 300 0.3rem/0.46rem Poppins;
    letter-spacing: 0rem;
    color: #39325a;
    margin-top: 0.16rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .ATA__tab_bar {
    display: none;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .ATA__tab_bar_mob {
    display: block;
    padding: 0 0.6rem;
    margin: 0.25rem 0 0.36rem;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper {
    position: relative;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_active {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 0.44rem;
    height: 0.86rem;
    background: #8B3DFF 0% 0% no-repeat padding-box;
    border-radius: 0.43rem;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_active .ATA__tab_bar_mob_text {
    font: normal normal 600 0.33rem/0.55rem Poppins;
    color: #FFFFFF;
    -webkit-margin-end: 0.12rem;
            margin-inline-end: 0.12rem;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_active .ATA__tab_bar_mob_new {
    display: inline-block;
    padding: 1px 0.1rem;
    background: #E10808 0% 0% no-repeat padding-box;
    border-radius: 0.15rem;
    font: normal normal 500 0.21rem/0.3rem Poppins;
    color: #FFFFFF;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_active .ATA__tab_bar_mob_down {
    display: inline-block;
    width: 0.24rem;
    height: 0.24rem;
    -webkit-margin-start: auto;
            margin-inline-start: auto;
    background: url("../img/ai-music/icon_drop-down.svg") no-repeat;
    background-size: cover;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_list {
    display: none;
    position: absolute;
    top: 0.9rem;
    left: 0;
    width: 100%;
    border-radius: 0.12rem;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
            box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
    border: 1px solid #E2E5EE;
    padding: 0.12rem 0.44rem;
    z-index: 999;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_list .ATA__tab_bar_mob_list_item,
.ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_list a {
    display: block;
    padding: 0.24rem 0;
    font: normal normal 600 0.28rem/0.48rem Poppins;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_list .ATA__tab_bar_mob_list_item.active,
.ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_list a.active {
    color: #8B3DFF;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_list .ATA__tab_bar_mob_list_item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 12px;
  }
  .ai-music .ATA__tab_bar_mob .ATA__tab_bar_mob_wapper .ATA__tab_bar_mob_list .ATA__tab_bar_mob_list_item span {
    display: inline-block;
    padding: 1px 0.1rem;
    background: #E10808 0% 0% no-repeat padding-box;
    border-radius: 0.15rem;
    font: normal normal 500 0.21rem/0.3rem Poppins;
    color: #FFFFFF;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .music-container {
    width: 100%;
    padding: 0 0.6rem 1rem;
  }
  .ai-music .music-container .style-content-container .style-content-container-title {
    font: normal normal bold 0.28rem/0.46rem Poppins;
    color: #39325A;
    margin-bottom: unset;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .style-content {
    margin-bottom: 0.16rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .style-title {
    text-align: left;
    font: normal normal bold 0.24rem/0.46rem Poppins;
    margin-bottom: 0.16rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .style-list {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .ai-music .style-list .card-container {
    width: calc((100% - 0.22rem) / 2);
    margin-right: 0.22rem;
    margin-bottom: 0.24rem;
  }
  .ai-music .style-list .card-container:nth-child(even) {
    margin-right: 0;
  }
  .ai-music .style-list .card-container .card {
    width: 100%;
    border-radius: 0.08rem;
  }
  .ai-music .style-list .card-container .card-body {
    height: 1.24rem;
    width: 100%;
  }
  .ai-music .style-list .card-container .card-footer {
    padding: 0.08rem 0 0.16rem;
    font: normal normal 500 0.24rem/0.35rem Poppins;
    letter-spacing: 0rem;
    color: #39325a;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .card-container input[type=checkbox] + .card span.radio {
    width: 0.28rem;
    height: 0.28rem;
    bottom: 0.16rem;
    right: 0.16rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .card-container input[type=checkbox]:checked + .card span.radio {
    background-size: 0.28rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .text-title {
    font: normal normal bold 0.3rem/0.46rem Poppins;
    letter-spacing: 0rem;
    color: #39325a;
    margin-bottom: 0.2rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .text-content {
    width: 100%;
    margin-bottom: 0.2rem;
    position: relative;
    padding: 0.32rem 0.3rem 0.8rem;
  }
  .ai-music .text-content .text-banner {
    width: 100%;
  }
  .ai-music .text-content .text-banner .title {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font: normal normal bold 0.3rem/0.46rem Poppins;
    color: #39325A;
  }
  .ai-music .text-content .text-banner .title .char {
    font: italic normal normal 0.2rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .text-content .text-banner .library-container {
    position: absolute;
    bottom: 0.26rem;
  }
  .ai-music .text-content .text-banner .library-container .library-list-content {
    width: 198%;
    top: 0.5rem;
    left: -0.3rem;
  }
  .ai-music .text-content .text-banner .library-container .library-btn::before {
    width: 0.3rem;
    height: 0.3rem;
  }
  .ai-music .text-content .text-banner .library-container .library-btn span {
    font: normal normal 500 0.24rem/0.35rem Poppins;
  }
  .ai-music .text-content .text-banner .library-container .library-btn img {
    width: 0.18rem;
    height: 0.18rem;
  }
  .ai-music .text-content .textarea-wrap {
    display: block;
    width: 100%;
    height: 2.6rem;
    padding: 0.2rem;
    padding-bottom: 0.4rem;
    border-radius: 0.2rem;
    border: 0.01rem solid #e2e2e2;
    background: #ffffff 0% 0% no-repeat padding-box;
  }
  .ai-music .text-content #textarea {
    height: 100%;
    font: normal normal 500 0.2rem/0.3rem Poppins;
    color: #39325a;
  }
  .ai-music .text-content #textarea::-webkit-input-placeholder {
    color: #bdbcc3;
    font: normal normal 500 0.2rem/0.3rem Poppins;
  }
  .ai-music .text-content #textarea::-moz-placeholder {
    color: #bdbcc3;
    font: normal normal 500 0.2rem/0.3rem Poppins;
  }
  .ai-music .text-content #textarea:-ms-input-placeholder {
    color: #bdbcc3;
    font: normal normal 500 0.2rem/0.3rem Poppins;
  }
  .ai-music .text-content #textarea::-ms-input-placeholder {
    color: #bdbcc3;
    font: normal normal 500 0.2rem/0.3rem Poppins;
  }
  .ai-music .text-content #textarea::placeholder {
    color: #bdbcc3;
    font: normal normal 500 0.2rem/0.3rem Poppins;
  }
  .ai-music .text-content span {
    right: auto;
    left: 0.2rem;
    bottom: 0.16rem;
    font: normal normal 500 0.2rem/0.3rem Poppins;
    letter-spacing: 0rem;
    color: #8b8b8b;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .library-list {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .library-item {
    width: 30% !important;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .tool-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0.06rem;
  }
  .ai-music .tool-content .custom-container {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .ai-music .tool-content .custom-container:nth-child(2) > span {
    margin-right: 0.12rem;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .custom-tip {
    font-size: 0;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-right: 0.34rem;
    width: 0.28rem;
    height: 0.28rem;
  }
  .ai-music .custom-tip > span {
    padding: 0.16rem;
    left: calc(50% + 64px);
    bottom: calc(100% + 0.25rem);
    font: normal normal 500 0.22rem/0.33rem Poppins;
  }
  .ai-music .custom-tip > span::after {
    width: 0.24rem;
    height: 0.24rem;
    left: 40px;
    top: calc(100% - 0.15rem);
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .lyics-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0.24rem;
    margin-top: 0.36rem;
    background: unset;
    border: unset;
    border-radius: unset;
  }
  .ai-music .lyics-content.generating {
    position: relative;
  }
  .ai-music .lyics-content.generating::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(255, 255, 255, 0.85);
    z-index: 99;
    border-radius: 10px;
  }
  .ai-music .lyics-content .lyics-title {
    font: normal normal bold 0.3rem/0.46rem Poppins;
    margin-bottom: 0.1rem;
  }
  .ai-music .lyics-content .lyics-title > span {
    font: normal normal bold 0.3rem/0.46rem Poppins;
  }
  .ai-music .lyics-content .lyics-left {
    width: 100%;
    position: relative;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
    padding: 0px;
    background: unset;
    border: unset;
    border-radius: unset;
    gap: 8px;
    margin-bottom: 16px;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title input {
    width: 100%;
    height: 0.64rem;
    -webkit-padding-start: 0.3rem;
            padding-inline-start: 0.3rem;
    border-radius: 10px;
    border: 1px solid #E2E2E2;
    font: normal normal 500 0.24rem/0.64rem Poppins;
    background: #FFFFFF 0% 0% no-repeat padding-box;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title input::-webkit-input-placeholder {
    font: normal normal 500 0.24rem/0.9rem Poppins;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title input::-moz-placeholder {
    font: normal normal 500 0.24rem/0.9rem Poppins;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title input:-ms-input-placeholder {
    font: normal normal 500 0.24rem/0.9rem Poppins;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title input::-ms-input-placeholder {
    font: normal normal 500 0.24rem/0.9rem Poppins;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title input::placeholder {
    font: normal normal 500 0.24rem/0.9rem Poppins;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn {
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 0.64rem;
    min-width: 1.8rem;
    -webkit-margin-start: auto;
            margin-inline-start: auto;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 7px;
    font: normal normal 500 0.24rem/0.64rem Poppins;
    color: #FFFFFF;
    background: #8B3DFF 0% 0% no-repeat padding-box;
    border-radius: 10px;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn > span {
    width: 0.32rem;
    height: 0.32rem;
    display: inline-block;
    background: url("../img/ai-music/star-m.svg") no-repeat;
    background-size: cover;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn#inspire > span {
    display: inline-block;
    width: 0.26rem;
    height: 0.36rem;
    background: url("../img/ai-music/flesh.svg") no-repeat;
    background-size: cover;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn#inspireLoading {
    padding: 4px 30px;
  }
  .ai-music .lyics-content .lyics-left .lyics-song-title .inspire-btn#inspireLoading lottie-player {
    width: 0.6rem;
    height: 0.6rem;
  }
  .ai-music .lyics-content .lyics-left #lyicsChar {
    font: italic normal normal 0.24rem/0.24rem Poppins;
    top: 2.5rem;
    right: 0.1rem;
  }
  .ai-music .lyics-content .lyics-left .lyics-text {
    height: 6.7rem;
  }
  .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags {
    width: 100%;
    background: rgba(57, 50, 90, 0.031372549) 0% 0% no-repeat padding-box;
    border-radius: 6px;
    padding: 0.1rem;
  }
  .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-title {
    font: normal normal normal 14px/24px Poppins;
    color: #39325A;
    margin-bottom: 12px;
  }
  .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0.16rem 0.1rem;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    position: relative;
  }
  .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .more-close {
    position: absolute;
    top: 1.7rem;
    right: 0.5rem;
  }
  .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item {
    padding: 0.13rem;
    font: normal normal normal 0.24rem/0.24rem Poppins;
  }
  .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item:hover {
    background: unset;
    border: 1px solid #9B94BB;
    color: #39325A;
  }
  .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item:hover > span {
    background: url("../img/ai-music/add.png") no-repeat;
    background-size: cover;
  }
  .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content {
    width: 5.72rem;
    height: 7.36rem;
    top: 36px;
    left: -104px;
    z-index: 999;
  }
  .ai-music .lyics-content .lyics-left .lyics-text .lyics-text-tags .tags-list .tag-item.more .more-content .more-list .more-item:hover {
    background: unset;
  }
  .ai-music .lyics-content .lyics-left #mySong {
    background: unset;
    border-radius: unset;
    gap: 0.1rem;
    font: normal normal 500 0.24rem/0.3rem Poppins;
    position: absolute;
    padding: unset;
    top: 1.15rem;
    inset-inline-start: 0;
  }
  .ai-music .lyics-content .lyics-left #mySong span {
    display: inline-block;
    width: 0.28rem;
    height: 0.28rem;
    background: url("../img/ai-music/mySong.svg") no-repeat center;
    background-size: cover;
  }
  .ai-music .lyics-content .lyics-left #mySong:hover {
    background: unset;
  }
  .ai-music .lyics-content .lyics-right {
    width: 100%;
  }
  .ai-music .lyics-content .lyics-right .lyics-randomize {
    font: normal normal 500 0.24rem/0.35rem Poppins;
  }
  .ai-music .lyics-content .lyics-right .lyics-randomize:hover {
    text-decoration: unset;
  }
  .ai-music .lyics-content .lyics-right .lyics-randomize > span {
    display: inline-block;
    width: 0.28rem;
    height: 0.28rem;
    background: url("../img/ai-music/radom.png") no-repeat;
    background-size: cover;
  }
  .ai-music .lyics-content .lyics-right .prompt-cover-tab {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    background: unset;
    border-radius: unset;
    position: unset;
    gap: 0.1rem;
    bottom: unset;
  }
  .ai-music .lyics-content .lyics-right .prompt-cover-tab > div {
    padding: 0.3rem 0.15rem;
    border-radius: 0.24rem 0.24rem 0px 0px;
    background: #E5E5E6 0% 0% no-repeat padding-box;
    border: 1px solid #E5E5E6;
    border-bottom: unset;
    font: normal normal normal 0.24rem/0.42rem Poppins;
    color: #8B8B8B;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 0.16rem;
    text-align: center;
  }
  .ai-music .lyics-content .lyics-right .prompt-cover-tab > div.cover-tab {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
  .ai-music .lyics-content .lyics-right .prompt-cover-tab > div:hover {
    background: #E5E5E6 0% 0% no-repeat padding-box;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right .prompt-cover-tab > div:hover::before {
    border: 4px solid #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right .prompt-cover-tab > div > span {
    padding: 1px 0.1rem;
    font: normal normal 500 0.21rem/0.31rem Poppins;
    border-radius: 0.15rem;
  }
  .ai-music .lyics-content .lyics-right .prompt-cover-tab > div::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 7px;
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 4px solid #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right .prompt-cover-tab > div.active {
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #E2E2E2;
    border-bottom: none;
    font: normal normal 600 0.24rem/0.42rem Poppins;
  }
  .ai-music .lyics-content .lyics-right .prompt-cover-tab > div.active::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 7px;
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 4px solid #8B3DFF;
  }
  .ai-music .lyics-content .lyics-right .cover-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 0.3rem;
    gap: 0.22rem;
    border-radius: 0 0 0.24rem 0.24rem;
    margin-bottom: 8px;
    border-top: unset;
  }
  .ai-music .lyics-content .lyics-right .cover-content .title {
    font: normal normal 500 0.19rem/0.3rem Poppins;
    color: #39325A;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item {
    height: 0.8rem;
    -ms-flex-line-pack: center;
        align-content: center;
    padding: 0 0.18rem;
    background: rgba(139, 61, 255, 0.031372549) 0% 0% no-repeat padding-box;
    border: 1px solid #9B94BB;
    border-radius: 0.1rem;
    font: normal normal normal 0.19rem/0.3rem Poppins;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl {
    font: normal normal normal 0.19rem/0.3rem Poppins;
    max-width: 3.6rem;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl::-webkit-input-placeholder {
    font: normal normal normal 0.19rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl::-moz-placeholder {
    font: normal normal normal 0.19rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl:-ms-input-placeholder {
    font: normal normal normal 0.19rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl::-ms-input-placeholder {
    font: normal normal normal 0.19rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item #youtubeUrl::placeholder {
    font: normal normal normal 0.19rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item.active .check-icon {
    min-width: 0.32rem;
    min-height: 0.32rem;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-text {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    font: normal normal normal 0.19rem/0.3rem Poppins;
    display: unset;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-text .placeholder {
    font: normal normal normal 0.19rem/0.3rem Poppins;
    white-space: nowrap;
    max-width: 3.5rem;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item span {
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .upload {
    width: 0.32rem;
    height: 0.32rem;
    -webkit-margin-end: 0.2rem;
            margin-inline-end: 0.2rem;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .youtube {
    width: 0.32rem;
    height: 0.32rem;
    -webkit-margin-end: 0.2rem;
            margin-inline-end: 0.2rem;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .play {
    width: 0.32rem;
    height: 0.32rem;
    -webkit-margin-end: 0.2rem;
            margin-inline-end: 0.2rem;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .check-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url("../img/ai-music/checked.svg") no-repeat;
    background-size: cover;
    -webkit-margin-start: auto;
            margin-inline-start: auto;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .close-icon {
    width: 0.32rem;
    height: 0.32rem;
    -webkit-margin-start: 0.2rem;
            margin-inline-start: 0.2rem;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .uploading {
    width: 0.32rem;
    height: 0.32rem;
    -webkit-margin-end: 0.2rem;
            margin-inline-end: 0.2rem;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-time,
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-time {
    width: 1rem;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-time,
.ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-time > span {
    font: normal normal normal 0.16rem/0.2rem Poppins;
    color: #39325A;
  }
  .ai-music .lyics-content .lyics-right .cover-content .cover-content-item .cover-content-item-progress .cover-content-item-progress-track {
    width: 2.1rem;
    height: 6px;
    background: rgba(57, 50, 90, 0.1) 0% 0% no-repeat padding-box;
    border-radius: 3px;
  }
  .ai-music .lyics-content .lyics-right .cover-content .hr {
    margin: 0.5rem 0;
  }
  .ai-music .lyics-content .lyics-right .lyics-style {
    border-radius: 0 0 0.24rem 0.24rem;
    border-top: unset;
  }
  .ai-music .lyics-content .lyics-right #lyicsStyle {
    font: normal normal 500 0.22rem/0.3rem Poppins;
  }
  .ai-music .lyics-content .lyics-right #lyicsStyle::-webkit-input-placeholder {
    font: normal normal 500 0.22rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right #lyicsStyle::-moz-placeholder {
    font: normal normal 500 0.22rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right #lyicsStyle:-ms-input-placeholder {
    font: normal normal 500 0.22rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right #lyicsStyle::-ms-input-placeholder {
    font: normal normal 500 0.22rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right #lyicsStyle::placeholder {
    font: normal normal 500 0.22rem/0.3rem Poppins;
    color: #8B8B8B;
  }
  .ai-music .lyics-content .lyics-right .lyics-style-content {
    width: 100%;
    height: 250px;
    background: rgba(57, 50, 90, 0.031372549) 0% 0% no-repeat padding-box;
    border-radius: 6px;
    padding: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 26px;
  }
  .ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 10px;
  }
  .ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab .tips-words {
    top: -80px;
    right: -30px;
    left: unset !important;
  }
  .ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-tab .tips-words::after {
    left: unset !important;
    right: 30px;
  }
  .ai-music .lyics-content .lyics-right .lyics-style-content .lyics-style-container .lyics-style-list .lyics-style-list-item:hover {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    color: #39325A;
  }
  .ai-music .lyics-content .lyics-right .lyics-gender .gender-item {
    font: normal normal 300 0.22rem/0.48rem Poppins;
  }
  .ai-music .lyics-content .lyics-right .lyics-gender .gender-item:hover {
    background: #8B3DFF 0% 0% no-repeat padding-box;
    border: 1px solid #8B3DFF;
    color: #FFFFFF;
  }
  .ai-music .lyics-content .lyics-right .lyics-generate-btn {
    width: 100%;
    height: 0.88rem;
    border-radius: 0.44rem;
    font: normal normal 500 0.26rem/0.26rem Poppins;
    margin-bottom: 0.16rem;
  }
  .ai-music .lyics-content .lyics-right .lyics-generate-btn .credit_tip {
    top: 15;
    right: 5px;
  }
  .ai-music .lyics-content .lyics-right .lyics-generate-btn .generating-animate {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 3px;
    margin-left: 1px;
    margin-top: 6px;
  }
  .ai-music .lyics-content .lyics-right .lyics-generate-btn .generating-animate i {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    display: block;
    background: white;
    -webkit-animation: progressgenerate 1.5s linear infinite;
            animation: progressgenerate 1.5s linear infinite;
  }
  .ai-music .lyics-content .lyics-right .lyics-generate-btn .generating-animate i:nth-child(2) {
    -webkit-animation-delay: 0.2s;
            animation-delay: 0.2s;
  }
  .ai-music .lyics-content .lyics-right .lyics-generate-btn .generating-animate i:nth-child(3) {
    -webkit-animation-delay: 0.3s;
            animation-delay: 0.3s;
  }
  .ai-music .lyics-content .lyics-right .deep-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font: normal normal 500 0.2rem/0.3rem Poppins;
    color: #39325A;
  }
  .ai-music .lyics-content .lyics-right .deep-text > span {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url("../img/ai-music/icon_copyright.svg") no-repeat;
    background-size: cover;
  }
  .ai-music .lyics-content .lyics-right .deep-text > .lyics-style-tips .tips-words {
    top: -80px;
    right: -30px;
    left: unset;
  }
  .ai-music .lyics-content .lyics-right .deep-text > .lyics-style-tips .tips-words::after {
    right: 30px;
    left: unset;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .generate-list {
    width: 6.3rem;
    gap: 0.16rem;
    margin-bottom: 1rem;
  }
  .ai-music .generate-list .generate-item {
    height: 1.59rem;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    border-radius: 0.08rem;
  }
  .ai-music .generate-list .generate-item .lottie-player {
    width: 0.72rem;
    height: 0.72rem;
  }
  .ai-music .generate-list .generate-item lottie-player {
    width: 2.6rem !important;
    height: 2.6rem !important;
  }
  .ai-music .generate-list .generate-item > span.isGenerating {
    font: normal normal normal 0.22rem/0.33rem Poppins;
    color: #39325a;
  }
  .ai-music .generate-list .generate-item.music {
    height: 1.32rem;
    padding: 0 0.2rem 0 0.24rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    position: relative;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .music .music-left {
    margin-bottom: 0.13rem;
    position: absolute;
  }
  .ai-music .music .music-title {
    font: normal normal bold 0.26rem/0.39rem Poppins;
    color: #39325a;
    margin-bottom: 0.28rem;
    width: 5.3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .ai-music .music .music-content > .music-btn {
    display: none;
  }
  .ai-music .music .music-content .music-time {
    font: normal normal 500 0.22rem/0.33rem Poppins;
    color: #39325a;
    width: 0.6rem;
  }
  .ai-music .music .download-btn {
    display: none;
  }
  .ai-music .music .mv-btn {
    display: none;
  }
  .ai-music .music .music-progress {
    margin: 0 0.22rem 0.23rem 1.4rem;
    height: 0.28rem;
  }
  .ai-music .music .music-progress-bg {
    background-repeat: round;
  }
  .ai-music .music .mobile-right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0.08rem;
    margin-bottom: 0.13rem;
  }
  .ai-music .music .mobile-right > div {
    min-width: 0.52rem;
    min-height: 0.52rem;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
  .ai-music .music .mobile-right > div.mv-btn-mobile {
    min-width: unset;
    min-height: unset;
    width: 0.51rem;
    height: 0.51rem;
    border-radius: 0.25rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #ffffff;
    background: #8B3DFF 0% 0% no-repeat padding-box;
    font: normal normal 500 0.2rem/0.2rem Poppins;
  }
  .ai-music .music .mobile-right .music-btn {
    margin-right: 0;
    z-index: 9999;
  }
  .ai-music .music .mobile-right .music-btn.play {
    background-image: url("../img/ai-music/icon_play-b.svg");
  }
  .ai-music .music .mobile-right .music-btn.pause {
    background-image: url("../img/ai-music/icon_pause-b.svg");
  }
  .ai-music .music .mobile-right .more-btn {
    background: url("../img/ai-music/icon_more.svg") no-repeat center;
    background-size: cover;
    position: relative;
  }
  .ai-music .music .mobile-right .more-btn > div {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    -webkit-box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1137254902);
            box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1137254902);
    border: 1px solid #E2E2E2;
    border-radius: 13px;
    position: absolute;
    padding: 0.15rem 0;
    min-width: 2.6rem;
    top: 0.5rem;
    right: 0;
    z-index: 99999;
    display: none;
  }
  .ai-music .music .mobile-right .more-btn > div p {
    -webkit-padding-start: 0.3rem;
            padding-inline-start: 0.3rem;
    font: normal normal 500 0.26rem/0.6rem Poppins;
    color: #39325A;
  }
  .ai-music .music .mobile-right .download {
    background-image: url("../img/ai-music/icon_download-b.svg");
    background-size: 100%;
  }
  .ai-music .music .view-lyrics {
    display: none;
  }
}
@media screen and (max-width: 1200px) {
  .ai-music .custom-dialog {
    width: 6.25rem;
    padding: 0.3rem 0.26rem 0.64rem;
    background: #ffffff 0% 0% no-repeat padding-box;
    -webkit-box-shadow: 0rem 0.1rem 0.1rem rgba(0, 0, 0, 0.1137254902);
            box-shadow: 0rem 0.1rem 0.1rem rgba(0, 0, 0, 0.1137254902);
    border: 0.01rem solid #e2e2e2;
    border-radius: 0.13rem;
  }
  .ai-music .custom-dialog .close-btn {
    top: 0.12rem;
    right: 0.15rem;
    width: 0.34rem;
  }
  .ai-music .custom-dialog-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .ai-music .custom-dialog-footer .custom-comfirm-btn {
    width: 2.34rem;
    height: 0.8rem;
    font-size: 0.3rem;
    background: #8B3DFF 0% 0% no-repeat padding-box;
    border-radius: 0.12rem;
  }
}
@media screen and (max-width: 1200px) {
  #failed-dialog .failed-body,
#confirm-dialog .failed-body,
#buy-dialog .failed-body,
#flac-dialog .failed-body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: 0.6rem;
    margin-bottom: 0.5733rem;
  }
  #failed-dialog .failed-body > img,
#confirm-dialog .failed-body > img,
#buy-dialog .failed-body > img,
#flac-dialog .failed-body > img {
    width: 1.12rem;
    height: 1.12rem;
  }
  #failed-dialog .failed-body > div,
#confirm-dialog .failed-body > div,
#buy-dialog .failed-body > div,
#flac-dialog .failed-body > div {
    text-align: center;
  }
  #failed-dialog .failed-body > div .failed-title,
#confirm-dialog .failed-body > div .failed-title,
#buy-dialog .failed-body > div .failed-title,
#flac-dialog .failed-body > div .failed-title {
    font: normal normal 600 0.3rem/0.35rem Poppins;
    margin-bottom: 0.33rem;
    color: #39325A;
  }
  #failed-dialog .failed-body > div .failed-desc,
#confirm-dialog .failed-body > div .failed-desc,
#buy-dialog .failed-body > div .failed-desc,
#flac-dialog .failed-body > div .failed-desc {
    font: normal normal 300 0.24rem/0.32rem Poppins;
    color: #39325A;
  }
}
@media screen and (max-width: 1200px) {
  #success-dialog .success-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0.17rem;
    margin-bottom: 0.085rem;
    margin-top: 0.79rem;
  }
  #success-dialog .success-header > img {
    width: 1.27rem;
    height: 1.27rem;
  }
  #success-dialog .success-header > div {
    font: normal normal bold 0.3rem/0.46rem Poppins;
  }
  #success-dialog .success-body {
    text-align: center;
    font: normal normal 300 0.24rem/0.35rem Poppins;
    margin-bottom: 0.43rem;
  }
  #success-dialog .success-body span {
    font: normal normal 300 0.24rem/0.35rem Poppins;
  }
}
@media screen and (max-width: 1200px) {
  #downloading-dialog {
    padding-top: 0.8rem;
    padding-bottom: 0.48rem;
  }
  #downloading-dialog .custom-progress-body > p {
    font: normal normal 300 0.22rem/0.33rem Poppins;
    margin-bottom: 0.21rem;
  }
  #downloading-dialog .custom-progress-bar {
    height: 0.2rem;
    border-radius: 0.99rem;
  }
}
@media screen and (max-width: 1200px) {
  #downloading-select-dialog {
    display: none;
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.7) 0% 0% no-repeat padding-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    z-index: 999;
  }
  #downloading-select-dialog .dialog-main {
    width: 5rem;
    padding: 0.62rem 0.34rem;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #707070;
    border-radius: 0.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0.7rem;
  }
  #downloading-select-dialog .dialog-main .download {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 0.2rem;
    font: normal normal 500 0.28rem/0.42rem Poppins;
    color: #39325A;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  #downloading-select-dialog .dialog-main .download .icon {
    display: inline-block;
    min-width: 0.44rem;
    min-height: 0.44rem;
    background-image: url("../img/ai-music/icon_download_m.svg");
    background-size: 100%;
  }
  #downloading-select-dialog .dialog-main .download .pro {
    display: inline-block;
    font: normal normal bold 0.24rem/0.35rem Poppins;
    color: #0D033A;
    padding: 0rem 0.16rem;
    background: #FFAF26 0% 0% no-repeat padding-box;
    border-radius: 0.18rem;
  }
}
:root {
  --btn-bg-color: #8b3dff;
  --text-color: #fff;
  --text-b-color: #000000;
  --border-color: #ebebeb;
  --border-radius: 3px;
  --ball-color: #ddc7ff;
  --border-top-color: #a065f9;
  --dot-color: #beb8cb;
  --dot-active-color: #8E4DFF;
  --bg-color: #f8f8f8;
  --border-bottom-color: #d2d0de;
  --a-val: 0.17;
  --click-btn-color: #15151c;
  --bg-hover-color: #eadcff;
  --article-border-color: #d7d4e5;
}

.pc_show {
  display: block;
}

.mob_show {
  display: none;
}

.faqs__translator {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding-top: 13.3333333333vw;
  padding-bottom: 13.3333333333vw;
  background-color: var(--bg-color);
}
.faqs__translator .faqs__translator_p {
  text-align: center;
  font: normal normal 600 0.28rem/0.5rem Poppins;
  letter-spacing: 0.1064rem;
  color: #8b3dff;
  margin-bottom: 0.24rem;
}
.faqs__translator .faqs__translator_title {
  max-width: 84vw;
  margin-bottom: 3.2vw;
  font-size: 5.8666666667vw;
  font-weight: 600;
  line-height: 10.8vw;
  font-family: inherit;
  color: var(--text-b-color);
  text-align: center;
  margin-bottom: 6.8vw;
}
.faqs__translator .faqs__translator_lists {
  max-width: 84vw;
}
.faqs__translator .faqs__translator_item {
  width: 100%;
  border-bottom: 1px solid var(--border-bottom-color);
  padding-bottom: 4.4vw;
}
.faqs__translator .faqs__translator_item + .faqs__translator_item {
  padding-top: 3.4666666667vw;
}
.faqs__translator .faqs__translator_item .faqs__translator_item-header {
  font-size: 4.2666666667vw;
  font-weight: 500;
  line-height: 6.4vw;
  font-family: inherit;
  color: var(--text-b-color);
  text-align: left;
  margin-bottom: 1.0666666667vw;
  max-width: 71.8666666667vw;
  position: relative;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.faqs__translator .faqs__translator_item .faqs__translator_item-header::before {
  content: "";
  position: absolute;
  top: 0;
  right: -6.5333333333vw;
  width: 5.3333333333vw;
  height: 5.3333333333vw;
  background-color: transparent;
  background-image: url("../img/video-translate/arrow-down.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.faqs__translator .faqs__translator_item .faqs__translator_item-header.show::before {
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-transform: rotate(-180deg);
          transform: rotate(-180deg);
}
.faqs__translator .faqs__translator_item .faqs__translator_item-body {
  font-size: 4.2666666667vw;
  font-weight: 300;
  line-height: 7.3333333333vw;
  font-family: inherit;
  color: var(--text-b-color);
  text-align: left;
  letter-spacing: 0.64px;
  max-height: 0;
  overflow: hidden;
  -webkit-transition: max-height 0.5s ease;
  transition: max-height 0.5s ease;
}
.faqs__translator .faqs__translator_item .faqs__translator_item-body a {
  color: #8a3dfd;
}

.recommende__article {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding-top: 10.6666666667vw;
  padding-bottom: 10.6666666667vw;
  width: 100%;
}
.recommende__article .recommende__article__title {
  max-width: 84vw;
  margin-bottom: 3.2vw;
  font-size: 6.4vw;
  font-weight: 600;
  line-height: 10.1333333333vw;
  font-family: inherit;
  color: var(--text-b-color);
  text-align: center;
  margin-bottom: 5.8666666667vw;
}
.recommende__article .swiper-button-next,
.recommende__article .swiper-button-prev {
  display: none;
}
.recommende__article .recommende__article_swiper {
  width: 100%;
  height: 74.6666666667vw;
}
.recommende__article .recommende__article_swiper .swiper-wrapper {
  overflow-x: auto;
  overflow-y: hidden;
  -ms-scroll-snap-type: x mandatory;
      scroll-snap-type: x mandatory;
}
.recommende__article .recommende__article_swiper .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.recommende__article .recommende__article_swiper .swiper-slide__title {
  font-size: 4.2666666667vw;
  font-weight: 300;
  line-height: 7.3333333333vw;
  font-family: inherit;
  color: var(--dot-active-color);
  text-align: left;
  padding: 4.4vw 4.4vw 0 4.4vw;
}
.recommende__article .recommende__article_swiper .swiper-slide {
  width: 66.9333333333vw;
  height: 68vw;
  background: var(--text-color);
  -webkit-box-shadow: 0px 12px 16px rgba(170, 167, 188, 0.1607843137);
          box-shadow: 0px 12px 16px rgba(170, 167, 188, 0.1607843137);
  border: 1px solid #d7d4e5;
  border-radius: 4px;
  scroll-snap-align: center;
}
.recommende__article .recommende__article_swiper .swiper-slide + .swiper-slide {
  margin-left: 4vw;
}
.recommende__article .recommende__article_swiper .swiper-slide:first-child {
  margin-left: 16.5333333333vw;
}
.recommende__article .recommende__article_swiper .swiper-slide:last-child {
  margin-right: 16.5333333333vw;
}
.recommende__article .recommende__article_swiper .swiper-slide__img {
  width: 100%;
  height: 34.1333333333vw;
}
.recommende__article .recommende__article_swiper .swiper-slide__img > img {
  width: 100%;
  height: 34.1333333333vw;
  -o-object-fit: cover;
     object-fit: cover;
}

@media screen and (min-width: 1200px) {
  .seo_button {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    min-width: 354px;
    padding: 20px 64px;
    background: #8b3dff 0% 0% no-repeat padding-box;
    border-radius: 32px;
    text-align: center;
    font: normal normal 500 18px/27px Poppins;
    letter-spacing: 1.44px;
    color: #ffffff;
    text-transform: uppercase;
    margin: auto;
    cursor: pointer;
  }
  .seo_button:hover {
    background: #8b3dff linear-gradient(95deg, #8b3dff 0%, #bc8fff 100%);
  }
  .section1 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding-top: 118px;
    padding-bottom: 65px;
  }
  .section1 h2 {
    width: 1086px;
    text-align: center;
    font: normal normal 600 40px/60px Poppins;
    letter-spacing: 0px;
    margin: auto;
    color: #000;
  }
  .section1 h2 a {
    color: #8b3dff;
  }
  .section1 .section1_des {
    font: normal normal 300 18px/35px Poppins;
    width: 1088px;
    text-align: center;
    margin: auto;
  }
  .section1 .section1_content {
    position: relative;
  }
  .section1 .section1_content .bgBox {
    position: absolute;
    top: 100px;
    width: 100%;
    height: 279px;
    background-image: url("../img/ai-music/seo/music_bg.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 0;
  }
  .section1 .section1_content .slider {
    position: relative;
    width: 1086px;
    height: 393px;
    overflow: hidden;
    margin: auto;
  }
  .section1 .section1_content .slider .background {
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 952px;
    height: 309px;
    background-image: url("../img/ai-music/seo/music_bg_1.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-transition: opacity 1s ease;
    transition: opacity 1s ease;
    z-index: 0;
    -webkit-transition: background-image 1s;
    transition: background-image 1s;
  }
  .section1 .section1_content .slider .imgBox {
    position: absolute;
    bottom: 25px;
    left: 50%;
    width: 530px;
    height: 353px;
    -webkit-transition: opacity 1s, -webkit-transform 1s;
    transition: opacity 1s, -webkit-transform 1s;
    transition: transform 1s, opacity 1s;
    transition: transform 1s, opacity 1s, -webkit-transform 1s;
    opacity: 0;
    -webkit-transform: translateX(-60%);
            transform: translateX(-60%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .section1 .section1_content .slider .imgBox img {
    width: 530px;
    height: 353px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  }
  .section1 .section1_content .slider .active {
    opacity: 1;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .section1 .section1_content .slider button {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background-color: transparent;
    background-image: url("../img/ai-music/seo/left_normal.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
  }
  .section1 .section1_content .slider button:hover {
    background-image: url("../img/ai-music/seo/left_pre.svg");
  }
  .section1 .section1_content .slider .btn_right {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
    position: absolute;
    right: 222px;
    bottom: 70px;
    z-index: 1;
  }
  .section1 .section1_content .slider .btn_left {
    position: absolute;
    left: 222px;
    bottom: 70px;
    z-index: 1;
  }
  .section1 .section1_content .musicMask {
    position: absolute;
    bottom: 40px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 1086px;
    height: 337px;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 63px;
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    z-index: 0;
  }
  .section1 .section1_content .musicTextBox {
    position: relative;
    top: -26px;
    width: 1086px;
    height: 337px;
    margin: auto;
    z-index: 1;
    padding-bottom: 47px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .section1 .section1_content .musicTextBox .title {
    width: 100%;
    text-align: center;
    font: normal normal 600 22px/38px Poppins;
    letter-spacing: 0px;
    color: #000000;
    opacity: 1;
  }
  .section1 .section1_content .musicTextBox .description {
    width: 100%;
    text-align: center;
    font: normal normal 300 12px/18px Poppins;
    letter-spacing: 0px;
    color: #000000;
  }
  .section1 .section1_content .musicTextBox .musicBg {
    position: relative;
    margin: auto;
    width: 734px;
    height: 35px;
    margin-top: 14px;
    -webkit-transform: all 0.3s;
            transform: all 0.3s;
  }
  .section1 .section1_content .musicTextBox .musicBg img {
    width: 734px;
    height: 35px;
    position: absolute;
  }
  .section1 .section1_content .musicTextBox .musicBg .musicBg1 {
    display: block;
  }
  .section1 .section1_content .musicTextBox .musicBg .musicBg2 {
    display: none;
  }
  .section1 .section1_content .musicTextBox .musicBg audio {
    display: none;
  }
  .section1 .section1_content .musicTextBox .active .musicBg1 {
    display: none;
  }
  .section1 .section1_content .musicTextBox .active .musicBg2 {
    display: block;
  }
  .section1 .section1_content .musicTextBox .functionalZone {
    width: 226px;
    height: 64px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin: auto;
    margin-top: 18px;
  }
  .section1 .section1_content .musicTextBox .functionalZone .btn_replay {
    width: 40px;
    height: 40px;
    background-image: url("../img/ai-music/seo/replay_normal.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
  }
  .section1 .section1_content .musicTextBox .functionalZone .btn_replay:hover {
    background-image: url("../img/ai-music/seo/replay_pre.svg");
  }
  .section1 .section1_content .musicTextBox .functionalZone .btn_play {
    width: 64px;
    height: 64px;
    background-image: url("../img/ai-music/seo/play.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
  }
  .section1 .section1_content .musicTextBox .functionalZone .active_play {
    background-image: url("../img/ai-music/seo/stop.svg");
  }
  .section1 .section1_content .musicTextBox .functionalZone .btn_love {
    width: 40px;
    height: 28px;
    background-image: url("../img/ai-music/seo/like_normal.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
  }
  .section1 .section1_content .musicTextBox .functionalZone .active_love {
    background-image: url("../img/ai-music/seo/like_pre.svg");
  }
  .section1 .section1_content .seo_button {
    margin-top: 22px;
  }
  .section2 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding-top: 152px;
    padding-bottom: 131px;
    background-image: url("../img/ai-music/seo/section2_bg.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
  }
  .section2 h2 {
    width: 1155px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: center;
    font: normal normal 600 40px/60px Poppins;
    letter-spacing: 0px;
    color: #ffffff;
    margin: auto;
  }
  .section2 .section2_content_mb {
    display: none;
  }
  .section2 .section2_content {
    width: 1086px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    margin: auto;
    margin-top: 89px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .section2 .section2_content .section2_content_item {
    width: 100%;
    height: 436px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 40px;
  }
  .section2 .section2_content .section2_content_item:first-child {
    margin-top: 0;
  }
  .section2 .section2_content .section2_content_item img {
    width: 568px;
    height: 436px;
  }
  .section2 .section2_content .section2_content_item .content_text {
    padding-left: 60px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .section2 .section2_content .section2_content_item .content_text a {
    color: #8a3dfd;
  }
  .section2 .section2_content .section2_content_item .content_text h3 {
    width: 458px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font: normal normal 600 22px/33px Poppins;
    letter-spacing: 0px;
    color: #ffffff;
  }
  .section2 .section2_content .section2_content_item .content_text p {
    margin-top: 10px;
    width: 458px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font: normal normal 300 16px/25px Poppins;
    letter-spacing: 0px;
    color: #ffffff;
  }
  .section2 .section2_content .reserve {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
  .section2 .section2_content .reserve .content_text {
    padding-left: 0;
    padding-right: 60px;
  }
  .section2 .seo_button {
    margin-top: 24px;
    width: 352px;
    height: 49px;
    padding: 0;
    font: normal normal 500 16px/27px Poppins;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-left: 0;
  }
  .section3 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding-top: 90px;
    padding-bottom: 57px;
  }
  .section3 h2 {
    width: 1085px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    margin: auto;
    text-align: center;
    font: normal normal 600 40px/60px Poppins;
    letter-spacing: 0px;
    color: #000000;
  }
  .section3 .section3_content {
    margin: auto;
    margin-top: 62px;
    width: 100%;
    height: 714px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .section3 .section3_content .section3_content_item1 {
    width: 844px;
    height: 612px;
    background: transparent -webkit-gradient(linear, right top, left top, from(#d5cce6), color-stop(49%, rgba(255, 255, 255, 0)), to(#ecfdf6)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(270deg, #d5cce6 0%, rgba(255, 255, 255, 0) 49%, #ecfdf6 100%) 0% 0% no-repeat padding-box;
    padding: 103px 349px;
    padding-right: 79px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .section3 .section3_content .section3_content_item1 h3 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font: normal normal 600 32px/56px Poppins;
    letter-spacing: 0px;
    color: #000000;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text {
    margin-top: 19px;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text:first-child {
    margin-top: 13px;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text .title {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font: normal normal bold 16px/25px Poppins;
    letter-spacing: 0px;
    color: #13131e;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text .title .icon {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 4.5px;
    background-color: #ceceda;
    margin-right: 10px;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text .description {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font: normal normal 300 16px/25px Poppins;
    letter-spacing: 0px;
    color: #13131e;
    margin-left: 19px;
  }
  .section3 .section3_content .section3_content_item2 {
    width: 1076px;
    height: 714px;
    border-radius: 10px 0px 0px 10px;
    background-image: url("../img/ai-music/seo/section3_bg.png");
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 142px 96px;
    padding-bottom: 123px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .section3 .section3_content .section3_content_item2 h3 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font: normal normal 600 32px/56px Poppins;
    letter-spacing: 0px;
    color: #ffffff;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text {
    margin-top: 19px;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text:first-child {
    margin-top: 13px;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text .title {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font: normal normal bold 16px/25px Poppins;
    letter-spacing: 0px;
    color: #fff;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text .title .icon {
    display: inline-block;
    width: 18px;
    height: 14px;
    background-image: url("../img/ai-music/seo/check.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    margin-right: 12px;
    position: relative;
    top: 4px;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text .description {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font: normal normal 300 16px/25px Poppins;
    letter-spacing: 0px;
    color: #fff;
    margin-left: 30px;
  }
  .section3 .section3_content .section3_content_item2 .seo_button {
    margin-top: 48px;
    margin-left: 0;
  }
  .progress {
    position: relative;
    width: 812px;
    height: 7px;
    background: #e3e4f2 0% 0% no-repeat padding-box;
    border-radius: 8px;
    margin: auto;
    margin-top: 34px;
  }
  .progress span {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 40%;
    height: 100%;
    background: #a467ff 0% 0% no-repeat padding-box;
    border-radius: 3px;
    -webkit-transition: 0.3s;
    transition: 0.3s;
  }
  .seo_section4 {
    width: 100%;
    padding-top: 60px;
    padding-bottom: 105px;
    background: transparent linear-gradient(359deg, #c5b2e8 0%, #ffffff 100%) 0% 0% no-repeat padding-box;
    background-repeat: no-repeat;
    background-position: center;
    overflow: hidden;
    background-size: 100% 100%;
  }
  .seo_section4 h2 {
    width: 1080px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: center;
    font: normal normal 600 40px/60px Poppins;
    letter-spacing: 0px;
    color: #000000;
    margin: auto;
  }
  .seo_section4 p {
    margin: auto;
    margin-top: 12px;
    width: 1086px;
    text-align: center;
    font: normal normal 300 18px/28px Poppins;
    letter-spacing: 0px;
    color: #000000;
  }
  .seo_section4 .use__occasions_swiper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 980px;
    height: 568px;
    margin: auto;
    margin-top: 50px;
    overflow: initial !important;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item {
    position: initial;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    height: auto !important;
    cursor: pointer;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    overflow: hidden;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item > img {
    max-width: 100%;
    height: auto;
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
    opacity: 0.2;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item > .text {
    position: absolute;
    bottom: 0;
    width: 980px;
    padding: 68px 54px;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item > .text > h3 {
    text-align: left;
    font: normal normal 600 30px/60px Poppins;
    letter-spacing: 0px;
    color: #ffffff;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    margin-bottom: 0;
    opacity: 0;
    overflow: hidden;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item > .text > p {
    width: 100%;
    text-align: left;
    font: normal normal 300 16px/25px Poppins;
    letter-spacing: 0px;
    color: #ffffff;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    margin-top: 0;
    opacity: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item > .text > p a {
    color: #8b3dff;
    cursor: pointer;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item > .text > .seo_button {
    position: absolute;
    bottom: -64px;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active {
    width: 980px !important;
    height: 568px !important;
    overflow: hidden;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active img,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active img {
    opacity: 1;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text {
    background: transparent -webkit-gradient(linear, left top, left bottom, from(transparent), to(#000)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, transparent 0%, #000 100%) 0% 0% no-repeat padding-box;
    border-radius: 10px;
    -webkit-transition: 0.3s;
    transition: 0.3s;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text > h3,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text > h3 {
    opacity: 1;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text > p,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text > p {
    opacity: 1;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text > .seo_button,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text > .seo_button {
    position: absolute;
    bottom: -70px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: 0;
    margin-top: 37px;
    -webkit-box-shadow: 0px 6px 14px var(--unnamed-color-000000);
            box-shadow: 0px 6px 14px var(--unnamed-color-000000);
    background: #8b3dff 0% 0% no-repeat padding-box;
    -webkit-box-shadow: 0px 6px 14px #000000;
            box-shadow: 0px 6px 14px #000000;
    border: 1px solid #caa7ff;
    border-radius: 35px;
    text-align: center;
    font: normal normal 600 18px/27px Poppins;
    letter-spacing: 0px;
    color: #ffffff;
    overflow: hidden;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text .seo_button:hover,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text .seo_button:hover {
    background: #8b3dff linear-gradient(95deg, #8b3dff 0%, #bc8fff 100%);
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text:hover,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text:hover {
    padding-bottom: 135px;
    padding-top: 320px;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text:hover > .seo_button,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text:hover > .seo_button {
    bottom: 42px;
  }
  .seo_section4 .use__occasions_swiper .swiper-button-next,
.seo_section4 .use__occasions_swiper .swiper-button-prev {
    position: absolute;
    width: 102px;
    height: 102px;
    border-radius: 51px;
    opacity: 0.88;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    top: 40%;
    cursor: pointer;
    z-index: 1;
  }
  .seo_section4 .use__occasions_swiper .swiper-button-next:hover,
.seo_section4 .use__occasions_swiper .swiper-button-prev:hover {
    opacity: 1;
  }
  .seo_section4 .use__occasions_swiper .swiper-button-next div,
.seo_section4 .use__occasions_swiper .swiper-button-prev div {
    width: 21px;
    height: 32px;
    background-image: url("../img/ai-music/seo/arrow.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .seo_section4 .use__occasions_swiper .swiper-button-next {
    background: transparent linear-gradient(269deg, #fd60bb 0%, #506dff 100%) 0% 0% no-repeat padding-box;
    background-repeat: no-repeat;
    background-position: center;
    right: -22%;
  }
  .seo_section4 .use__occasions_swiper .swiper-button-prev {
    background: transparent linear-gradient(91deg, #fd60bb 0%, #506dff 100%) 0% 0% no-repeat padding-box;
    background-repeat: no-repeat;
    background-position: center;
    left: -22%;
  }
  .seo_section4 .use__occasions_swiper .swiper-button-prev div {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }
  .seo_section4 .seo_button {
    display: none;
  }
  .seo_section6 {
    width: 100%;
    padding-top: 90px;
    padding-bottom: 206px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: 549px;
    margin: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: transparent url("../img/ai-music/seo/banner_bj_4.png") 0% 0% no-repeat padding-box;
    background-position: center;
    background-size: 100% 100%;
  }
  .seo_section6 h2 {
    width: 998px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: center;
    font: normal normal 600 40px/60px Poppins;
    letter-spacing: 0px;
    color: #ffffff;
  }
  .seo_section6 p {
    width: 784px;
    text-align: center;
    font: normal normal 300 18px/28px Poppins;
    letter-spacing: 0.36px;
    color: #ffffff;
    margin-top: 9px;
    margin-bottom: 54px;
  }
  .seo_section6 .seo_button {
    font: normal normal 600 18px/27px Poppins;
    cursor: pointer;
  }
  .faqs__translator {
    padding-top: 94px;
    padding-bottom: 81px;
    background: #f3f3f5 0% 0% no-repeat padding-box;
  }
  .faqs__translator .faqs__translator_p {
    text-align: center;
    font: normal normal 600 25px/50px Poppins;
    letter-spacing: 9.5px;
    color: #8b3dff;
    margin-bottom: 12px;
  }
  .faqs__translator .faqs__translator_title {
    text-align: center;
    font: normal normal 600 40px/56px Poppins;
    letter-spacing: 0px;
    color: #000000;
    margin-bottom: 42px;
  }
  .faqs__translator .faqs__translator_lists {
    max-width: 700px;
    margin: auto;
  }
  .faqs__translator .faqs__translator_item {
    padding-bottom: 25.5px;
  }
  .faqs__translator .faqs__translator_item + .faqs__translator_item {
    padding-top: 25.5px;
  }
  .faqs__translator .faqs__translator_item .faqs__translator_item-header {
    max-width: 666px;
    cursor: pointer;
    text-align: left;
    font: normal normal 300 18px/27px Poppins;
    letter-spacing: 0px;
    color: #000000;
    margin-bottom: 0;
  }
  .faqs__translator .faqs__translator_item .faqs__translator_item-header.show {
    padding-bottom: 25.5px;
  }
  .faqs__translator .faqs__translator_item .faqs__translator_item-header::before {
    width: 18px;
    height: 18px;
    right: 0;
  }
  .faqs__translator .faqs__translator_item .faqs__translator_item-body {
    max-width: 666px;
    text-align: left;
    font: normal normal 300 16px/25px Poppins;
    letter-spacing: 0px;
    color: #000000;
  }
  .faqs__translator .faqs__translator_item .faqs__translator_item-body a {
    color: #8a3dfd;
  }
  .recommende__article {
    padding-top: 80px;
    padding-bottom: 80px;
    position: relative;
    margin: auto;
  }
  .recommende__article .swiper-button-next,
.recommende__article .swiper-button-prev {
    position: absolute;
    width: 33px;
    height: 33px;
    border: 2px solid var(--click-btn-color);
    border-radius: 100%;
    color: var(--click-btn-color);
    --swiper-navigation-size: 14px;
    font-weight: 800;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-image: url("../img/ai-music/seo/chevron-right-o.svg");
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
  }
  .recommende__article .swiper-button-prev {
    left: calc((100% - 1088px) / 2 - 33px - 27px);
    top: 50%;
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }
  .recommende__article .swiper-button-next {
    right: calc((100% - 1088px) / 2 - 33px - 27px);
    top: 50%;
  }
  .recommende__article .disabled {
    opacity: 0.3;
    pointer-events: none;
  }
  .recommende__article .recommende__article__title {
    font-size: 40px;
    font-weight: 600;
    line-height: 56px;
    font-family: inherit;
    color: var(--text-b-color);
    text-align: center;
    margin-bottom: 45px;
  }
  .recommende__article .recommende__article_swiper {
    width: 1088px;
    height: 380px;
    overflow: hidden;
    position: relative;
    margin: auto;
  }
  .recommende__article .recommende__article_swiper .swiper-wrapper {
    overflow: initial;
  }
  .recommende__article .recommende__article_swiper .swiper-slide {
    height: 340px;
    background-color: var(--text-color);
    border: 1px solid var(--article-border-color);
    border-radius: 4px;
    cursor: pointer;
    -webkit-transition: 0.5s;
    transition: 0.5s;
  }
  .recommende__article .recommende__article_swiper .swiper-slide:first-child {
    margin-left: 0;
  }
  .recommende__article .recommende__article_swiper .swiper-slide:last-child {
    margin-right: 0;
  }
  .recommende__article .recommende__article_swiper .swiper-slide + .swiper-slide {
    margin-left: 0;
  }
  .recommende__article .recommende__article_swiper .swiper-slide:hover {
    background: #f5efff;
    -webkit-box-shadow: 0px 12px 16px rgba(170, 167, 188, 0.568627451);
            box-shadow: 0px 12px 16px rgba(170, 167, 188, 0.568627451);
    -webkit-transition: 0.5s;
    transition: 0.5s;
  }
  .recommende__article .recommende__article_swiper .swiper-slide:hover .swiper-slide__title {
    color: var(--btn-bg-color);
    text-decoration: underline;
  }
  .recommende__article .recommende__article_swiper .swiper-slide:hover .swiper-slide__img > img {
    -webkit-transition: 0.5s;
    transition: 0.5s;
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
  }
  .recommende__article .recommende__article_swiper .swiper-slide__img {
    width: 100%;
    height: 195px;
    overflow: hidden;
  }
  .recommende__article .recommende__article_swiper .swiper-slide__img > img {
    width: 100%;
    height: 195px;
    -o-object-fit: cover;
       object-fit: cover;
    -webkit-transition: 0.5s;
    transition: 0.5s;
  }
  .recommende__article .recommende__article_swiper .swiper-slide__title {
    width: 100%;
    padding: 25px 25px 0 25px;
    font-size: 16px;
    font-weight: 300;
    line-height: 25px;
    font-family: inherit;
    color: var(--btn-bg-color);
    text-align: left;
  }
  .seo_sectionNew1 {
    padding: 106px 0 90px;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .seo_sectionNew1 h2 {
    text-align: center;
    font: normal normal 500 44px/60px Poppins;
    color: #000000;
  }
  .seo_sectionNew1 .sectionNewBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    width: 1090px;
  }
  .seo_sectionNew1 .sectionNewBox.mob_show {
    display: none !important;
  }
  .seo_sectionNew1 .sectionNewBox + .sectionNewBox {
    margin-top: 20px;
  }
  .seo_sectionNew1 .sectionNewBox .card_item {
    width: 350px;
    height: 421px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: relative;
    margin-right: 16px;
    padding: 27px 30px 0;
    background: transparent -webkit-gradient(linear, left top, left bottom, from(var(--unnamed-color-ffffff)), to(#f1f1f1)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, var(--unnamed-color-ffffff) 0%, #f1f1f1 100%) 0% 0% no-repeat padding-box;
    background: transparent -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f1f1f1)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, #ffffff 0%, #f1f1f1 100%) 0% 0% no-repeat padding-box;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .logo {
    width: 82px;
    height: 82px;
    margin-bottom: 23px;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .logo img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .author {
    font: normal normal 500 20px/30px Poppins;
    color: #000000;
    text-align: center;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .job {
    font: normal normal 500 14px/21px Poppins;
    color: #0e0d11;
    text-align: center;
    padding: 5.5px 0 16px;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .desc {
    width: 100%;
    text-align: center;
    font: normal normal 300 14px/21px Poppins;
    color: #0e0d11;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .star {
    position: absolute;
    bottom: 31px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 73px;
    height: 12px;
    background-image: url("../img/ai-music/seo/star.svg");
    background-size: cover;
    background-repeat: no-repeat;
  }
  .seo_sectionNew1 .sectionNewBox .card_item:nth-child(3n) {
    margin-right: 0;
  }
}
.additional__content1__pc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 640px;
  background-image: url("../img/ai-vocal-remover/additional1.png");
  background-size: cover;
  margin-top: -70px;
}
.additional__content1__pc .title {
  font: normal normal 600 40px/60px Poppins;
  margin: auto;
  color: #000;
}
.additional__content1__pc .contentBox {
  margin-top: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
}
.additional__content1__pc .contentBox .contentValue {
  min-height: 200px;
  width: 354px;
  padding: 0 24px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.additional__content1__pc .contentBox .contentValue .num {
  margin: 0 auto 26px;
  width: 36px;
  height: 36px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 24px;
  color: #FFFFFF;
  background-color: #8B3DFF;
  border-radius: 36px;
}
.additional__content1__pc .contentBox .contentValue .text1 {
  font-weight: 600;
  font-size: 17px;
  color: #000000;
  height: 80px;
}
.additional__content1__pc .contentBox .contentValue .text2 {
  margin-top: 9px;
  font-size: 15px;
}
.additional__content1__pc .btn {
  margin-top: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 294px;
  height: 49px;
  color: #FFFFFF;
  font-size: 18px;
  border-radius: 25px;
  background-color: #8B3DFF;
  cursor: pointer;
}

@media screen and (max-width: 1200px) {
  .mob_show {
    display: block;
  }
  .seo_button {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    min-width: 81.3333333333vw;
    padding: 3.7333333333vw 6.667vw !important;
    background: #8b3dff 0% 0% no-repeat padding-box;
    border-radius: 6.6666666667vw;
    text-align: center;
    font-family: "Poppins";
    font-weight: 500;
    line-height: 6.4vw;
    font-size: 4.2666666667vw;
    letter-spacing: 0px;
    color: #ffffff;
    text-transform: uppercase;
    margin: auto;
  }
  .section1 {
    width: 100%;
    padding-bottom: 15.2vw;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
  }
  .section1 h2 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding-left: 8vw;
    padding-right: 8vw;
    text-align: center;
    font-size: 5.8666666667vw;
    line-height: 10.8vw;
    font-weight: 600;
    font-family: "Poppins";
    letter-spacing: 0px;
    color: #000000;
  }
  .section1 h2 a {
    color: #8b3dff;
  }
  .section1 .section1_des {
    font: normal normal 300 0.28rem/0.55rem Poppins;
    color: #000000;
    text-align: center;
    padding-left: 8vw;
    padding-right: 8vw;
    padding-top: 5.6vw;
  }
  .section1 .section1_content {
    position: relative;
  }
  .section1 .section1_content .bgBox {
    position: absolute;
    top: 14.9333333333vw;
    width: 100%;
    height: 14.9333333333vw;
    background-image: url("../img/ai-music/seo/music_bg.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 0;
  }
  .section1 .section1_content .slider {
    position: relative;
    width: 100%;
    height: 56vw;
    overflow: hidden;
    margin: auto;
  }
  .section1 .section1_content .slider .background {
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 100%;
    height: 42.6666666667vw;
    background-image: url("../img/ai-music/seo/music_bg_1.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-transition: opacity 1s ease;
    transition: opacity 1s ease;
    z-index: 0;
    -webkit-transition: background-image 1s;
    transition: background-image 1s;
  }
  .section1 .section1_content .slider .imgBox {
    position: absolute;
    bottom: 4vw;
    left: 50%;
    width: 100%;
    height: 49.3333333333vw;
    -webkit-transition: opacity 1s, -webkit-transform 1s;
    transition: opacity 1s, -webkit-transform 1s;
    transition: transform 1s, opacity 1s;
    transition: transform 1s, opacity 1s, -webkit-transform 1s;
    opacity: 0;
    -webkit-transform: translateX(-60%);
            transform: translateX(-60%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .section1 .section1_content .slider .imgBox img {
    height: 42.6666666667vw;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  }
  .section1 .section1_content .slider .active {
    opacity: 1;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .section1 .section1_content .slider button {
    width: 10.6666666667vw;
    height: 10.6666666667vw;
    border-radius: 5.3333333333vw;
    background-color: transparent;
    background-image: url("../img/ai-music/seo/left_normal.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
  }
  .section1 .section1_content .slider .btn_right {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
    position: absolute;
    right: 8vw;
    bottom: 13.3333333333vw;
    z-index: 1;
  }
  .section1 .section1_content .slider .btn_left {
    position: absolute;
    left: 8vw;
    bottom: 13.3333333333vw;
    z-index: 1;
  }
  .section1 .section1_content .musicMask {
    position: absolute;
    bottom: 8vw;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 100%;
    height: 58.2666666667vw;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 3.4666666667vw;
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    z-index: 0;
  }
  .section1 .section1_content .musicTextBox {
    position: relative;
    top: -16px;
    width: 100%;
    height: 58.2666666667vw;
    margin: auto;
    z-index: 1;
    padding-bottom: 7.0666666667vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .section1 .section1_content .musicTextBox .title {
    width: 100%;
    text-align: center;
    font-weight: 600;
    font-family: "Poppins";
    line-height: 8vw;
    font-size: 4.2666666667vw;
    letter-spacing: 0px;
    color: #000000;
    opacity: 1;
  }
  .section1 .section1_content .musicTextBox .description {
    width: 100%;
    text-align: center;
    font-weight: 300;
    font-family: "Poppins";
    line-height: 7.3333333333vw;
    font-size: 2.9333333333vw;
    letter-spacing: 0px;
    color: #000000;
  }
  .section1 .section1_content .musicTextBox .musicBg {
    position: relative;
    margin: auto;
    width: 83.8666666667vw;
    height: 4vw;
    margin-top: 1.7333333333vw;
  }
  .section1 .section1_content .musicTextBox .musicBg img {
    width: 83.8666666667vw;
    height: 4vw;
    position: absolute;
  }
  .section1 .section1_content .musicTextBox .functionalZone {
    width: 32.9333333333vw;
    height: 8vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin: auto;
    margin-top: 4.2666666667vw;
  }
  .section1 .section1_content .musicTextBox .functionalZone .btn_replay {
    width: 8vw;
    height: 8vw;
    background-image: url("../img/ai-music/seo/replay_normal.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
  }
  .section1 .section1_content .musicTextBox .functionalZone .btn_replay:hover {
    background-image: url("../img/ai-music/seo/replay_pre.svg");
  }
  .section1 .section1_content .musicTextBox .functionalZone .btn_play {
    width: 8.5333333333vw;
    height: 8.5333333333vw;
    background-image: url("../img/ai-music/seo/play.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
  }
  .section1 .section1_content .musicTextBox .functionalZone .active_play {
    background-image: url("../img/ai-music/seo/stop.svg");
  }
  .section1 .section1_content .musicTextBox .functionalZone .btn_love {
    width: 8.1333333333vw;
    height: 6.4vw;
    background-image: url("../img/ai-music/seo/like_normal.svg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
  }
  .section1 .section1_content .musicTextBox .functionalZone .active_love {
    background-image: url("../img/ai-music/seo/like_pre.svg");
  }
  .section1 .section1_content .seo_button {
    margin-top: 4.5333333333vw;
  }
  .section2 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding-top: 10.5333333333vw;
    padding-bottom: 19.0666666667vw;
    padding-left: 8vw;
    padding-right: 8vw;
    background: #13131e 0% 0% no-repeat padding-box;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
  }
  .section2 h2 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: center;
    font-family: "Poppins";
    font-weight: 500;
    line-height: 10.8vw;
    font-size: 5.8666666667vw;
    letter-spacing: 0px;
    color: #ffffff;
    margin: auto;
  }
  .section2 .section2_content {
    display: none;
  }
  .section2 .section2_content_mb {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    margin: auto;
    margin-top: 10vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .section2 .section2_content_mb .section2-swiper {
    width: 100%;
    overflow: hidden;
  }
  .section2 .section2_content_mb .section2-swiper .swiper-slide {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .section2 .section2_content_mb .section2-swiper .swiper-slide a {
    color: #8a3dfd;
  }
  .section2 .section2_content_mb .section2-swiper .swiper-slide > img {
    width: 75.7333333333vw;
    height: 58.1333333333vw;
  }
  .section2 .section2_content_mb .section2-swiper .swiper-slide > h3 {
    margin-top: 4.5333333333vw;
    text-align: center;
    font-weight: 600;
    font-family: "Poppins";
    line-height: 8vw;
    font-size: 4.2666666667vw;
    color: #FFFFFF;
  }
  .section2 .section2_content_mb .section2-swiper .swiper-slide > p {
    margin-top: 4vw;
    text-align: center;
    font-weight: 300;
    font-family: "Poppins";
    line-height: 7.3333333333vw;
    font-size: 3.7333333333vw;
    color: #FFFFFF;
  }
  .section2 .section2_content_mb .section2-swiper .swiper-slide .seo_button {
    margin-top: 5.6vw;
    padding-left: 6.6666666667vw;
    padding-right: 6.6666666667vw;
  }
  .section2 .section2_content_mb .section2-swiper .section2-swiper-pagination {
    width: 1.94rem;
    margin: 0.42rem auto 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .section2 .section2_content_mb .section2-swiper .section2-swiper-pagination span {
    border-radius: 50%;
    width: 0.12rem;
    height: 0.12rem;
    background: #7d7d83;
    margin-right: 0.1rem;
  }
  .section2 .section2_content_mb .section2-swiper .section2-swiper-pagination span.swiper-pagination-bullet-active {
    width: 0.74rem;
    height: 0.12rem;
    border-radius: 1rem;
    background: transparent -webkit-gradient(linear, left top, right top, from(#3C0094), color-stop(50%, #AB51FF), to(#E8ECFD)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(90deg, #3C0094 0%, #AB51FF 50%, #E8ECFD 100%) 0% 0% no-repeat padding-box;
    -webkit-transition: width 0.3s ease-in-out;
    transition: width 0.3s ease-in-out;
  }
  .section3 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding-top: 12.1333333333vw;
    background: transparent -webkit-gradient(linear, left bottom, left top, from(#ffffff), to(#eceff5)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(0deg, #ffffff 0%, #eceff5 100%) 0% 0% no-repeat padding-box;
  }
  .section3 h2 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding-left: 8vw;
    padding-right: 8vw;
    margin: auto;
    text-align: center;
    font-weight: 600;
    font-family: "Poppins";
    line-height: 10.8vw;
    font-size: 5.8666666667vw;
    letter-spacing: 0px;
    color: #000000;
  }
  .section3 .section3_content {
    margin: auto;
    margin-top: 6.1333333333vw;
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .section3 .section3_content .section3_content_item1 {
    width: 84vw;
    margin: auto;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    background: transparent -webkit-gradient(linear, left top, left bottom, from(#ecfdf6), color-stop(49%, rgba(255, 255, 255, 0)), to(#d5cce6)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(to bottom, #ecfdf6 0%, rgba(255, 255, 255, 0) 49%, #d5cce6 100%) 0% 0% no-repeat padding-box;
    padding: 9.6vw 5.6vw 7.6vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    border-radius: 1.3333333333vw 1.3333333333vw 0 0;
  }
  .section3 .section3_content .section3_content_item1 h3 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: center;
    font-weight: 600;
    font-family: "Poppins";
    line-height: 7.4666666667vw;
    font-size: 4.8vw;
    letter-spacing: 0px;
    color: #000000;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text {
    margin-top: 2.9333333333vw;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text:first-child {
    margin-top: 5.0666666667vw;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text .title {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font-weight: 600;
    font-family: "Poppins";
    line-height: 7.3333333333vw;
    font-size: 3.7333333333vw;
    letter-spacing: 0px;
    color: #000000;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text .title .icon {
    display: inline-block;
    width: 2.4vw;
    height: 2.4vw;
    border-radius: 1.2vw;
    background-color: #ceceda;
    margin-right: 2.9333333333vw;
  }
  .section3 .section3_content .section3_content_item1 .section3_content_item1_text .description {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font-weight: 300;
    font-family: "Poppins";
    line-height: 7.3333333333vw;
    font-size: 3.7333333333vw;
    letter-spacing: 0px;
    color: #000000;
    margin-left: 5.3333333333vw;
  }
  .section3 .section3_content .section3_content_item2 {
    position: relative;
    width: 95.2vw;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    margin: auto;
    border-radius: 1.3333333333vw;
    background-image: none;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 14.8vw 5.6vw;
    padding-bottom: 25.8666666667vw;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    background-color: #0d0c15;
  }
  .section3 .section3_content .section3_content_item2 h3 {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: center;
    font-weight: 600;
    font-family: "Poppins";
    line-height: 7.4666666667vw;
    font-size: 4.8vw;
    letter-spacing: 0px;
    color: #ffffff;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text {
    margin-top: 3.0666666667vw;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text:first-child {
    margin-top: 7.6vw;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text .title {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font-weight: 600;
    font-family: "Poppins";
    line-height: 7.3333333333vw;
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
    color: #fff;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text .title .icon {
    display: inline-block;
    width: 3.4666666667vw;
    height: 2.6666666667vw;
    background-image: url("../img/ai-music/seo/check.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    margin-right: 4.1333333333vw;
    position: relative;
    top: 0.2666666667vw;
  }
  .section3 .section3_content .section3_content_item2 .section3_content_item2_text .description {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    text-align: left;
    font-weight: 300;
    font-family: "Poppins";
    line-height: 7.3333333333vw;
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
    color: #fff;
    margin-left: 7.6vw;
  }
  .section3 .section3_content .section3_content_item2 .seo_button {
    position: relative;
    margin-top: 9.6vw;
    padding-left: 13.3333333333vw;
    padding-right: 13.3333333333vw;
    z-index: 2;
  }
  .section3 .section3_content .section3_content_item2 .mob_bg {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 95.2vw;
    height: 38.8vw;
    background-image: url("../img/ai-music/seo/seo_section3_bg_mob.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 1;
  }
  .seo_section4 {
    padding: 0.88rem 0.6rem;
    padding-bottom: 1.14rem;
    background: transparent -webkit-gradient(linear, left bottom, left top, from(#c5b2e8), to(#ffffff)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(360deg, #c5b2e8 0%, #ffffff 100%) 0% 0% no-repeat padding-box;
    overflow: hidden;
  }
  .seo_section4 h2 {
    width: 100%;
    font: normal normal 600 0.44rem/0.81rem Poppins;
    text-align: center;
  }
  .seo_section4 p {
    width: 100%;
    margin-top: 0.38rem;
    text-align: center;
    font: normal normal 300 0.28rem/0.55rem Poppins;
    letter-spacing: 0.0056rem;
    color: #000000;
  }
  .seo_section4 .swiper-wrapper {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .seo_section4 .use__occasions_swiper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 8.01rem;
    margin-top: 0.37rem;
    overflow: initial !important;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item {
    position: initial;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    height: 7rem !important;
    cursor: pointer;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    overflow: hidden;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item > img {
    width: 6.3rem;
    height: 8.01rem;
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
    opacity: 0.4;
  }
  .seo_section4 .use__occasions_swiper .use__occasions_swiper-item > .text {
    display: none;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active {
    width: 6.3rem !important;
    height: 8.01rem !important;
    z-index: 2;
    overflow: hidden;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active img,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active img {
    opacity: 1;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text {
    display: block;
    background: transparent -webkit-gradient(linear, left top, left bottom, from(transparent), to(#000)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, transparent 0%, #000 100%) 0% 0% no-repeat padding-box;
    border-radius: 0.1rem;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 0.54rem;
    padding-top: 1.5rem;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text > h3,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text > h3 {
    font: normal normal 600 0.36rem/0.6rem Poppins;
    opacity: 1;
    color: #ffffff;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text > p,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text > p {
    text-align: left;
    font: normal normal 300 0.28rem/0.55rem Poppins;
    letter-spacing: 0.0056rem;
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    margin-top: 0.17rem;
    opacity: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    opacity: 1;
    color: #ffffff;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text > p a,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text > p a {
    color: #8b3dff;
    cursor: pointer;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text > .seo_button,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text > .seo_button {
    display: none;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text:hover,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text:hover {
    padding: 0.54rem;
  }
  .seo_section4 .use__occasions_swiper .swiper-slide-active > .text:hover > .seo_button,
.seo_section4 .use__occasions_swiper .swiper-slide-duplicate-active > .text:hover > .seo_button {
    display: none;
  }
  .seo_section4 .use__occasions_swiper .swiper-button-next,
.seo_section4 .use__occasions_swiper .swiper-button-prev {
    display: none;
  }
  .seo_section4 .seo_button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .progress {
    position: relative;
    width: 5.99rem;
    height: 0.14rem;
    background: #e3e4f2 0% 0% no-repeat padding-box;
    border-radius: 0.7rem;
    margin: auto;
    margin-top: 0.26rem;
    margin-bottom: 0.62rem;
  }
  .progress span {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 40%;
    height: 100%;
    background: #a467ff 0% 0% no-repeat padding-box;
    border-radius: 0.1rem;
    -webkit-transition: 0.3s;
    transition: 0.3s;
  }
  .seo_section6 {
    padding: 1.72rem 0.6rem 3.15rem 0.6rem;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: 10.72rem;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: transparent url("../img/ai-music/mob/banner_bj_4.png") 0% 0% no-repeat padding-box;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
  }
  .seo_section6 h2 {
    width: 100%;
    font: normal normal 600 0.44rem/0.81rem Poppins;
    color: #ffffff;
  }
  .seo_section6 p {
    width: 100%;
    font: normal normal 300 0.28rem/0.55rem Poppins;
    letter-spacing: 0.0056rem;
    margin-top: 0.23rem;
    margin-bottom: 0.9rem;
    color: #ffffff;
    text-align: center;
  }
  .seo_section6 .seo_button {
    width: 100%;
    font: normal normal 500 0.32rem/0.48rem Poppins;
    padding-left: 1rem;
    padding-right: 1rem;
    text-align: center;
  }
  .seo_sectionNew1 {
    padding: 0.93rem 0.6rem 0.8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .seo_sectionNew1 h2 {
    font: normal normal 500 0.54rem/0.77rem Poppins;
    letter-spacing: -0.0086rem;
    text-align: center;
    color: #000000;
  }
  .seo_sectionNew1 .sectionNewBox {
    width: 100%;
    position: relative;
    overflow: hidden;
  }
  .seo_sectionNew1 .sectionNewBox .card_item {
    background: transparent -webkit-gradient(linear, left top, left bottom, from(var(--unnamed-color-ffffff)), to(#f1f1f1)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, var(--unnamed-color-ffffff) 0%, #f1f1f1 100%) 0% 0% no-repeat padding-box;
    background: transparent -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f1f1f1)) 0% 0% no-repeat padding-box;
    background: transparent linear-gradient(180deg, #ffffff 0%, #f1f1f1 100%) 0% 0% no-repeat padding-box;
    border-radius: 0.1rem;
    width: 100%;
    height: 8.08rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: relative;
    padding: 0.8rem 0.55rem 0;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .logo {
    width: 1.64rem;
    height: 1.64rem;
    margin-bottom: 0.3rem;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .logo img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .author {
    font: normal normal 500 0.36rem/0.55rem Poppins;
    color: #000000;
    text-align: center;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .job {
    font: normal normal 300 0.28rem/0.55rem Poppins;
    letter-spacing: 0.0056rem;
    color: #0e0d11;
    text-align: center;
    padding: 0.1rem 0 0.3rem;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .desc {
    width: 100%;
    text-align: center;
    font: normal normal 300 0.28rem/0.35rem Poppins;
    letter-spacing: 0.0056rem;
    color: #0e0d11;
  }
  .seo_sectionNew1 .sectionNewBox .card_item .star {
    position: absolute;
    bottom: 0.5rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 1.31rem;
    height: 0.22rem;
    background-image: url("../img/ai-music/seo/star.svg");
    background-size: cover;
    background-repeat: no-repeat;
  }
  .seo_sectionNew1 .sectionNewBox-pagination {
    margin-top: 0.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .seo_sectionNew1 .sectionNewBox-pagination span {
    border-radius: 50%;
    width: 0.24rem;
    height: 0.24rem;
    background: #beb8cb 0% 0% no-repeat padding-box;
    margin-right: 0.2rem;
  }
  .seo_sectionNew1 .sectionNewBox-pagination span.swiper-pagination-bullet-active {
    width: 0.4rem;
    height: 0.4rem;
    background: #8E4DFF 0% 0% no-repeat padding-box;
  }
  .additional__content1__pc {
    height: auto;
    padding-bottom: 13.3333333333vw;
    background-image: url("../img/ai-vocal-remover/additional1-m.png");
    background-size: cover;
    margin-top: 5.3333333333vw;
  }
  .additional__content1__pc .title {
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding-left: 8vw;
    padding-right: 8vw;
    text-align: center;
    font-size: 5.8666666667vw;
    line-height: 10.8vw;
    font-weight: 600;
    font-family: "Poppins";
    color: #000000;
  }
  .additional__content1__pc .title a {
    color: #8b3dff;
  }
  .additional__content1__pc .contentBox {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: 8vw;
  }
  .additional__content1__pc .contentBox .contentValue {
    margin-bottom: 16vw;
    width: initial;
  }
  .additional__content1__pc .contentBox .contentValue .num {
    margin: 0 auto 3.3333333333vw;
  }
  .additional__content1__pc .contentBox .contentValue .text1 {
    width: 84vw;
    font-size: 4.5333333333vw;
  }
  .additional__content1__pc .contentBox .contentValue .text2 {
    margin-top: 2.4vw;
    width: 84vw;
    font-size: 4.1333333333vw;
  }
  .ai-music .explorer-container {
    margin-top: -1rem;
    position: relative;
  }
  .ai-music .explorer-container .isowner-text {
    position: absolute;
    top: 0.26rem;
    inset-inline-start: 0.22rem;
    bottom: unset;
  }
  .ai-music .explorer-container .explorer-top .explorer-title {
    font: normal normal bold 0.3rem/0.46rem Poppins;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-item {
    display: none;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more {
    padding: 0.14rem;
    border-radius: 0.1rem;
    gap: 0 8px;
    height: 0.56rem;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content {
    padding: 0.22rem;
    width: 6.4rem;
    right: 0;
    top: 35px;
    left: unset;
    height: 5.5rem;
    gap: 0.3rem;
    border-radius: 10px;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab {
    gap: 0.25rem;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab .tag-more-tab-item {
    font: normal normal 600 0.24rem/0.36rem Poppins;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-tab .tag-more-tab-item.active {
    font: normal normal 600 0.24rem/0.36rem Poppins;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container .tag-more-list {
    gap: 0.2rem;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container .tag-more-list .tag-more-list-item {
    padding: 3px 14px;
    font: normal normal normal 0.24rem/0.36rem Poppins;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-more-content .tag-more-container .tag-more-list .tag-more-list-item.selected {
    background: #F6F3FF 0% 0% no-repeat padding-box;
    color: #8B3DFF;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-icon {
    width: 0.28rem;
    height: 0.28rem;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text {
    font: normal normal normal 0.24rem/0.36rem Poppins;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text > .tag-text {
    font: inherit;
    max-width: 2.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text .clear-icon {
    width: 0.32rem;
    height: 0.32rem;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text.active {
    font: normal normal normal 0.24rem/0.36rem Poppins;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .more-text.active > .tag-text {
    font: inherit;
    color: inherit;
  }
  .ai-music .explorer-container .explorer-top .explorer-select .tag-more .tag-down {
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
  .ai-music .explorer-container .explorer-list {
    margin-top: 6px;
    border-radius: 0.24rem;
    padding: 0.87rem 0.22rem 0.26rem;
    min-height: 8rem;
    padding-bottom: 0.3rem;
  }
  .ai-music .explorer-container .explorer-list .explorer-empty img {
    width: 2.6rem;
    height: 2.6rem;
  }
  .ai-music .explorer-container .explorer-list .explorer-empty p {
    font: normal normal 300 0.24rem/0.24rem Poppins;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper {
    gap: 0;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item {
    background: unset;
    border-radius: unset;
    width: 100%;
    height: unset;
    padding: 0.22rem 0;
    gap: 0 0.22rem;
    border-bottom: 1px solid rgba(57, 50, 90, 0.1);
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .delete-icon {
    position: absolute;
    bottom: 8px;
    right: 8px;
    display: inline-block;
    width: 16px;
    height: 16px;
    cursor: pointer;
    background: url("../img/ai-music/delete.svg") no-repeat;
    background-size: cover;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .mv-icon {
    position: absolute;
    top: 8px;
    right: 8px;
    display: inline-block;
    width: 18px;
    height: 16px;
    cursor: pointer;
    background: url("../img/ai-music/mv_icon.svg") no-repeat;
    background-size: cover;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item:hover .explorer-item-img::before {
    width: 0;
    height: 0;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item.stop .explorer-item-img::before {
    width: 0.52rem;
    height: 0.52rem;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item.loading .explorer-item-img::before {
    width: 0.52rem;
    height: 0.52rem;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item.active .explorer-item-img::before {
    width: 0.52rem;
    height: 0.52rem;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-img {
    width: 1.18rem;
    height: 1.18rem;
    border-radius: 0.18rem;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-name {
    font: normal normal 600 0.28rem/0.42rem Poppins;
    margin-bottom: 0.18rem;
    width: 4rem;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-prompt {
    font: normal normal normal 0.22rem/0.28rem Poppins;
    width: 3.5rem;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress {
    gap: 0 0.3rem;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress .explorer-item-progress-track {
    width: 2.3rem;
    height: 0.2rem;
    border-radius: 0.13rem;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress .explorer-item-time {
    font: normal normal normal 0.22rem/0.33rem Poppins;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress .explorer-item-time .explorer-item-current-time {
    font: normal normal normal 0.22rem/0.33rem Poppins;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-wapper .explorer-item .explorer-item-right .explorer-item-progress .explorer-item-time .explorer-item-total-time {
    font: normal normal normal 0.22rem/0.33rem Poppins;
  }
  .ai-music .explorer-container .explorer-list .explorer-list-deep {
    display: unset;
    min-height: unset;
  }
  .ai-music .explorer-container .explorer-list .explorer-pagation .page-el:hover {
    border: 1px solid #383357;
    background: url("../img/ai-music/icon-left.svg") no-repeat center;
    background-position: center;
  }
  .ai-music .explorer-container .explorer-list .explorer-pagation .page-el.disabled {
    border: 1px solid #CFCCDE;
    background: url("../img/ai-music/icon-left-disabled.svg") no-repeat center;
    background-position: center;
    cursor: no-drop;
  }
  .ai-music .explorer-container .explorer-list .explorer-pagation .page-el.disabled:hover {
    border: 1px solid #CFCCDE;
    background: url("../img/ai-music/icon-left-disabled.svg") no-repeat center;
    background-position: center;
  }
  .ai-music .photo-content {
    width: 100%;
    margin: 0.36rem 0;
    padding: 0 0.6rem;
  }
  .ai-music .photo-content .photo-content-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0.24rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div {
    border-radius: 0.32rem;
    width: 100%;
    height: unset;
  }
  .ai-music .photo-content .photo-content-wrapper > div.photo-content-right {
    width: 100%;
    background: unset;
    border: unset;
    padding: unset;
  }
  .ai-music .photo-content .photo-content-wrapper > div.photo-content-right .prompt-area-wapper {
    padding: 0.24rem 0.2rem;
    background: rgba(255, 255, 255, 0.85) 0% 0% no-repeat padding-box;
    border: 1px solid rgb(226, 226, 226);
    border-radius: 0.24rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0.32rem;
    margin-bottom: 0.35rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-img-area img {
    width: auto;
    height: auto;
    max-height: 100%;
    max-width: 100%;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area {
    padding: 0.74rem 0 0.2rem;
    font-size: 0;
    margin-bottom: 0.3rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area > img {
    width: 0.96rem;
    height: 0.96rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area #photoUpload {
    width: 100%;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .photo-upload-btn {
    width: 4rem;
    height: 0.88rem;
    font: normal normal normal 0.24rem/0.88rem Poppins;
    margin: 0.52rem auto 1.38rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .photo-upload-btn::before {
    width: 0.32rem;
    height: 0.32rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area p {
    font: normal normal normal 14px/21px Poppins;
    color: #39325A;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .drop-text {
    display: none;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .photo-area .tips {
    margin-top: 0;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .hr {
    margin-bottom: 0.3rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper > p {
    font: normal normal normal 0.24rem/0.35rem Poppins;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .simple-area {
    margin-top: 0.32rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .simple-area .simple-item {
    width: 24%;
    height: unset;
  }
  .ai-music .photo-content .photo-content-wrapper > div .left-wapper .simple-area img {
    width: 100%;
    height: auto;
  }
  .ai-music .photo-content .photo-content-wrapper > div .photo-title {
    font: normal normal 600 0.28rem/0.32rem Poppins;
    margin-bottom: -0.16rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div .prompt-area {
    padding: unset;
    overflow-y: unset;
    max-height: unset;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 0.2rem 0.16rem;
    border: unset;
    border-radius: unset;
  }
  .ai-music .photo-content .photo-content-wrapper > div .prompt-area .photo-prompt-item {
    padding: 0.12rem 0.2rem;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #9B94BB;
    border-radius: 0.1rem;
    font: normal normal normal 0.24rem/0.24rem Poppins;
  }
  .ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn {
    width: 100%;
    height: 0.88rem;
    border-radius: 0.44rem;
    font: normal normal 500 0.26rem/0.26rem Poppins;
    margin-bottom: 0.16rem;
  }
  .ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .credit_tip {
    top: 15;
    right: 5px;
  }
  .ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .generating-animate {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 3px;
    margin-left: 1px;
    margin-top: 10px;
  }
  .ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .generating-animate i {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    display: block;
    background: white;
    -webkit-animation: progressgenerate 1.5s linear infinite;
            animation: progressgenerate 1.5s linear infinite;
  }
  .ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .generating-animate i:nth-child(2) {
    -webkit-animation-delay: 0.2s;
            animation-delay: 0.2s;
  }
  .ai-music .photo-content .photo-content-wrapper > div .photo-generate-btn .generating-animate i:nth-child(3) {
    -webkit-animation-delay: 0.3s;
            animation-delay: 0.3s;
  }
  .ai-music .photo-content .photo-content-wrapper > div .photo-tips {
    margin-top: 8px;
    font: normal normal 500 0.2rem/0.3rem Poppins;
    color: #39325A;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 8px;
  }
  .ai-music .photo-content .photo-content-wrapper > div .photo-tips span {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    display: inline-block;
    width: 0.2rem;
    height: 0.2rem;
    background: url(../img/ai-music/icon_copyright.svg) no-repeat;
    background-size: cover;
  }
}