@-webkit-keyframes musicRotate { 0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

@keyframes musicRotate { 0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

.jx-yinyue.active { -webkit-animation: musicRotate 20s linear infinite; animation: musicRotate 20s linear infinite; }

.music-player-box { width: 1100px; height: 530px; background-color: #ffffff; border-radius: 10px; -webkit-box-shadow: 0 0 10px 0px rgba(146, 146, 146, 0.83); box-shadow: 0 0 10px 0px rgba(146, 146, 146, 0.83); -webkit-box-sizing: border-box; box-sizing: border-box; padding: 41px 54px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) !important; transform: translate(-50%, -50%) !important; background-color: antiquewhite; display: none; z-index: 99; }

.music-player-box .jx-guanbi1 { position: absolute; right: 4px; top: 5px; font-size: 20px; color: #999; cursor: pointer; }

.music-player-box .title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }

.music-player-box .title h4 { font-size: 18px; font-weight: normal; color: #333333; padding-bottom: 22px; margin-right: 24px; }

.music-player-box .title .layui-col:not(:last-child) { margin-right: 10px; }

.music-player-box .title .layui-col .layui-form-select dl dd.layui-this { background-color: #fff; color: #a87b44; }

.music-player-box .swiper-container { height: 364px; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.music-player-box .swiper-container .swiper-slide { padding: 32px 25px; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 10px; opacity: 0; }

.music-player-box .swiper-container .swiper-slide.swiper-slide-active { background-color: #a87b44; border-top-left-radius: 0; opacity: 1; }

.music-player-box .swiper-container .swiper-slide .country { color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; }

.music-player-box .swiper-container .swiper-slide .country:first-child { margin-bottom: 11px; }

.music-player-box .swiper-container .swiper-slide .country h5 { font-weight: bold; white-space: nowrap; }

.music-player-box .swiper-container .swiper-slide .country .layui-input-block { margin-left: 24px; width: 100%; }

.music-player-box .swiper-container .swiper-slide .country .layui-input-block .layui-form-checkbox { color: inherit; margin: 5px 0; width: 25%; overflow: hidden; white-space: nowrap; opacity: 0.8; }

.music-player-box .swiper-container .swiper-slide .country .layui-input-block .layui-form-checkbox[lay-skin="primary"] i { opacity: 0.8; }

.music-player-box .swiper-container .swiper-slide .country .layui-input-block .layui-form-checkbox[lay-skin="primary"]:hover i { border-color: #6d6d6d; }

.music-player-box .swiper-container .swiper-slide .country .layui-input-block .layui-form-checkbox span { color: inherit; }

.music-player-box .swiper-container .swiper-slide .country .layui-input-block .layui-form-checked[lay-skin="primary"] i { border-color: #6d6d6d !important; background-color: #ffffff; color: #6b6b6b; }

.music-player-box .swiper-container .swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 0 !important; width: 74px; -webkit-transform: initial; transform: initial; margin-top: -45px; }

.music-player-box .swiper-container .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev, .music-player-box .swiper-container .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { -webkit-transform: scale(1); transform: scale(1); }

.music-player-box .swiper-container .swiper-pagination { position: static; -ms-flex-negative: 0; flex-shrink: 0; -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; -webkit-transform: unset; transform: unset; }

.music-player-box .swiper-container .swiper-pagination .swiper-pagination-bullet { background: #fff; border-radius: 10px 0 0 10px; color: #a87b44; white-space: nowrap; width: 53px; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; opacity: 1; font-size: 14px; padding: 10px; margin: 0 0 6px 0; }

.music-player-box .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #a87b44; color: #fff; }

.music-player-box .control { position: absolute; bottom: 0; left: 0; width: 100%; background-color: rgba(255, 255, 255, 0.61); height: 57px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.music-player-box .control .audioSource { display: none; }

.music-player-box .control .info { width: 56%; -ms-flex-negative: 0; flex-shrink: 0; -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0 60px; position: relative; color: #a87b44; white-space: nowrap; }

.music-player-box .control .info::before { content: ""; width: 14px; height: 14px; position: absolute; left: 0; top: 53%; background-color: #a87b44; -webkit-transform: translate(-136%, -50%); transform: translate(-136%, -50%); border-radius: 3px; opacity: 0.7; }

.music-player-box .control .playerCtrl { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin-right: 60px; -ms-flex-negative: 0; flex-shrink: 0; }

.music-player-box .control .playerCtrl .iconfont { font-size: 38px; display: inline-block; vertical-align: middle; color: #666; cursor: pointer; }

.music-player-box .control .playerCtrl .iconfont:hover { color: #333; }

.music-player-box .control .playerCtrl .iconfont.jx-22_suijibofang { font-size: 19px; margin-right: 20px; width: 22px; display: block; }

.music-player-box .control .playerCtrl .iconfont.jx-liebiaoxunhuan { font-size: 24px; margin-right: 20px; width: 22px; display: none }

.music-player-box .control .playerCtrl .iconfont.jx-shangyishou, .music-player-box .control .playerCtrl .iconfont.jx-xiayishou { font-size: 26px; }

.music-player-box .control .playerCtrl .iconfont.jx-zanting { display: none; }

.music-player-box .control .playerCtrl .iconfont.jx-bofang2, .music-player-box .control .playerCtrl .iconfont.jx-zanting { margin: 0 10px; color: #a87b44; }
/*# sourceMappingURL=musicPlayer.css.map */
