/**************
    media css  col
    by:kom
    2019-01-14
*
******/

.song-audio-det{text-align:left;}
.song-audio-vol{width:438px;height:663px;background:url(../images/song-audio-bg.png) no-repeat;box-sizing: border-box;padding:18px 22px 20px 16px;}
.jp-audio{width:100%;}
.jp-audio .jp-interface{height:140px;}
.jp-audio, .jp-audio-stream, .jp-video{background:none;color:#fff;border:none;}
.jp-interface{background:none;}
.song-type-page{height:150px;}
.jp-audio .jp-controls{width:100%;padding:0px;text-align:Center;margin:30px 0px 20px 0px;}
.jp-controls button{display:inline-block;float:none;margin:0px 5px;}
.jp-controls button.jp-play{margin-right:6px;}
.jp-audio .jp-type-playlist .jp-progress{left:60px;width:280px;z-index:10;}
.jp-audio .jp-progress{top:85px;}
.jp-progress{background:none;overflow: visible;}
.jp-audio .jp-type-playlist .jp-time-holder{width:100%;padding:0px 10px;left:0px;top:78px;box-sizing: border-box;}
.jp-current-time, .jp-duration{font-style:normal;}
.jp-seek-bar{background:#676668;height:5px;border-radius:5px;}
.jp-play-bar{border-radius:5px;background:#ffffff;}

.jp-play{width:60px;height:60px;background:url(../images/song-pause.png) no-repeat;}
.jp-state-playing .jp-play{background:url(../images/song-play.png) no-repeat;background-size:cover;}
.jp-play:active{background:url(../images/song-pause-focus.png) no-repeat;background-size:cover;}
.jp-state-playing .jp-play:active{background:url(../images/song-play-focus.png) no-repeat;background-size:cover;}
.jp-previous,.jp-previous:active{width:32px;height:30px;background:url(../images/song-prev-focus.png) no-repeat;background-size:cover;}
.jp-next,.jp-next:active{width:32px;height:30px;background:url(../images/song-next-focus.png) no-repeat;background-size:cover;}

.jp-play:focus{background:url(../images/song-pause.png) no-repeat;background-size:cover;}
.jp-state-playing .jp-play:focus{background:url(../images/song-play.png) no-repeat;background-size:cover;}
.jp-previous,.jp-previous:focus{width:32px;height:30px;background:url(../images/song-prev.png) no-repeat;background-size:cover;}
.jp-next,.jp-next:focus{width:32px;height:30px;background:url(../images/song-next.png) no-repeat;background-size:cover;}


.jp-progress-pos{background:#fff url(../images/song-point.png) no-repeat center center;width:18px;height:18px;position: absolute;left:0px;top:-8px;border-radius:20px;}
.song-lyric,.song-audio-vol{float:left;}
.song-lyric{margin:120px 0px 0px 60px;width:400px;}
.song-lyric-title{font-size:24px;font-weight:bold;}
.song-lyric-sub{color:#999;padding:10px 0px;}
.song-lyric-sub span{margin-right:20px;}
.song-lyric-det{color:#666;position: absolute;left:0px;top:0px;}
.song-lyric-det p{height:35px;line-height:35px;white-space: nowrap;position: relative;}
.song-lyric-wrap{height:345px;overflow:hidden;position: relative;}
.song-lyric-hover
{
    color: #009900;
    font-weight: 600;
    font-size:18px;
}
.song-type-pic{width:80px;height:80px;border:1px solid #fff;overflow:hidden;background:#999;border-radius:80px;float:left;}
.song-type-page{padding:30px 0px 0px 30px;box-sizing: border-box;}
.song-type-name{float:left;margin:20px 0px 0px 20px;font-size:20px;font-weight:bold;}
.song-type-pic img{width:100%;height:100%;}
.jp-playlist li{list-style: none;}
div.jp-type-playlist div.jp-playlist li.jp-playlist-current{list-style:none;padding:0px;background:rgba(255,255,255,.1);}
.song-icon-number{margin:0px 30px 0px 20px;}
div.jp-type-playlist div.jp-playlist a.jp-playlist-current{color:#fff;}
.jp-details, .jp-playlist{background:none;min-height:50px;line-height:50px;font-size:14px;border:none;}
.jp-playlist ul{padding:0px 10px;font-size:14px;}
.jp-playlist li:hover{background:rgba(255,255,255,.1);}
.jp-video-270p{width:860px;margin:0 auto;height:560px;}
.song-video .jp-interface{background:#070402;border:none;height:50px;}
.song-video .jp-playlist{display:none;}
.song-video .jp-controls-holder{margin-left:0px;width:100%;}
.song-video .jp-type-playlist .jp-controls{margin-left:15px;text-align:left;}
.song-video .jp-current-time{position: absolute;left:30px;top:20px;}
.song-video .jp-duration{position:absolute;left:100px;top:20px;}

.song-video .jp-play{width:18px;height:20px;background:url(../images/song-video-pause.png) no-repeat;margin-top:15px;}
.song-video .jp-play:focus{background:url(../images/song-video-pause.png) no-repeat;}
.song-video .jp-state-playing .jp-play{background:url(../images/song-video-play.png) no-repeat;}
.song-video .jp-state-playing .jp-play:focus{background:url(../images/song-video-play.png) no-repeat;}
.jp-video-play-icon,.jp-video-play-icon:focus{background:url(../images/song-pause.png); width:62px;height:62px;top:30%;}

.song-video .jp-play-bar{background:#cc191b;}
.jp-video .jp-toggles {
    position: absolute;
    right: 0;
    margin: 0;
    margin-top: 10px;
    width: 60px;
    top: 5px;
}
.jp-type-playlist{height:100%;position: relative;}
.jp-full-screen,.jp-full-screen:focus{background:url(../images/song-screen.png) no-repeat;}
.jp-state-full-screen .jp-full-screen,.jp-state-full-screen .jp-full-screen:focus{background:url(../images/song-shrink.png) no-repeat;}
.song-type-catlog,.jp-play-title,.jp-play-close{display:none;}
.song-type-art{font-weight:normal;font-size:14px;}
div.jp-type-playlist div.jp-playlist li:last-child{padding:0px;}
div.jp-type-playlist div.jp-playlist a{color:#fff;}
.jp-playlist li{padding:0px;}
.jp-artist{display:none;}

@media screen  and (min-width: 1023px)  and (max-width: 1025px) {
    .jp-play{width:1.2rem;height:1.2rem;background-size:cover;}
    div.jp-type-playlist div.jp-playlist a{color:#333;}
    .jp-play-title,.jp-play-close{display:block;}
    .song-type-catlog{display:block;}
    .song-audio-vol{width:100%;background-size:100% auto;height:11.5rem;padding:0.18rem 0.38rem 0.2rem 0.28rem;}
    .song-lyric, .song-audio-vol{float:none;}
    .song-type-page{height:2.7rem;padding: 0.5rem 0px 0px 0.5rem;position: relative;}
    .jp-audio .jp-controls{margin:0.4rem 0px 0.2rem 0px;}
    .jp-audio .jp-type-playlist .jp-time-holder{padding:0px 0.1rem;top:1.55rem;}
    .jp-audio .jp-progress{top:1.5rem;top:1.6rem;}
    .jp-audio .jp-type-playlist .jp-progress{left:1rem;width:4.6rem;}
    .song-lyric{width:100%;margin:0px;padding:0px 0.8rem;box-sizing: border-box;color:#fff;position: absolute;left:0px;top:6rem;}
    .jp-audio .jp-interface{height:2.5rem;}
    .song-lyric p{color:#fff;}
    .song-music .jp-playlist{
        display:none;
        background: #fff;
        position: absolute;
        left: 0px;
        width: 100%;
        bottom:0px;z-index:10;
        color:#333;
    }
    .song-audio-det{position: relative;}
    .song-lyric-title{font-size:0.4rem;font-weight:normal;line-height:1.6;}
    .song-lyric-sub{padding:0.1rem 0px;}
    .song-lyric-det p{height:0.6rem;line-height:0.6rem;}
    .song-lyric-det p.song-lyric-hover{color:#ffb403;font-weight:bold;}
    .song-lyric-wrap{height:3.5rem;}
    .song-video-wrap{padding:0px 0.4rem;}
    .jp-video-270p{width:100%;height:3.6rem;}
    .jp-video-270p .jp-video-play{height:3.5rem;margin-top:-3.5rem;}
    .jp-video-play-icon, .jp-video-play-icon:focus{width:1rem;height:1rem;background-size:cover;top:92%;margin-left:-0.5rem;}
    .jp-full-screen{background:url(../images/song-screen.png) no-repeat;}
    .song-type-catlog{display:block;width:0.4rem;height:0.32rem;position: absolute;background:url(../images/song-catlog.png) no-repeat;background-size: cover;right:0.2rem;}
    .jp-type-playlist{height:10.9rem;position: relative;}
    div.jp-type-playlist div.jp-playlist a.jp-playlist-current{color:#333;}
    .jp-play-title{padding-left:0.2rem;border-bottom:1px solid #ccc;}
    .jp-play-close{text-align:center;border-top:1px solid #ddd;}
    .song-icon-number{margin:0px 0.3rem 0px 0.2rem;}
    div.jp-type-playlist div.jp-playlist li.jp-playlist-current{color:#ffb403;}
    div.jp-type-playlist div.jp-playlist a.jp-playlist-current{color:#ffb403;}
    .song-music .jp-playlist ul li{border-bottom:1px solid #eee;}
    .song-music .jp-playlist ul li:last-child{border:none;}
    .song-lyric-sub{color:#fff;}
    .song-type-name{font-size:0.4rem;margin:0.2rem 0px 0px 0.4rem;}
    .song-type-art{font-size:0.28rem;font-weight:normal;margin-top:0.1rem;}


}
@media screen  and (min-width: 639px)  and (max-width: 641px) {
    .jp-play{width:1.2rem;height:1.2rem;background-size:cover;}
    div.jp-type-playlist div.jp-playlist a{color:#333;}
    .jp-play-title,.jp-play-close{display:block;}
    .song-type-catlog{display:block;}
    .song-audio-vol{width:100%;background-size:100% auto;height:11.5rem;padding:0.18rem 0.38rem 0.2rem 0.28rem;}
    .song-lyric, .song-audio-vol{float:none;}
    .song-type-page{height:2.7rem;padding: 0.5rem 0px 0px 0.5rem;position: relative;}
    .jp-audio .jp-controls{margin:0.4rem 0px 0.2rem 0px;}
    .jp-audio .jp-type-playlist .jp-time-holder{padding:0px 0.1rem;top:1.55rem;}
    .jp-audio .jp-progress{top:1.5rem;top:1.6rem;}
    .jp-audio .jp-type-playlist .jp-progress{left:1rem;width:4.6rem;}
    .song-lyric{width:100%;margin:0px;padding:0px 0.8rem;box-sizing: border-box;color:#fff;position: absolute;left:0px;top:6rem;}
    .jp-audio .jp-interface{height:2.5rem;}
    .song-lyric p{color:#fff;}
    .song-music .jp-playlist{
        display:none;
        background: #fff;
        position: absolute;
        left: 0px;
        width: 100%;
        bottom:0px;z-index:10;
        color:#333;
    }
    .song-audio-det{position: relative;}
    .song-lyric-title{font-size:0.4rem;font-weight:normal;line-height:1.6;}
    .song-lyric-sub{padding:0.1rem 0px;}
    .song-lyric-det p{height:0.6rem;line-height:0.6rem;}
    .song-lyric-det p.song-lyric-hover{color:#ffb403;font-weight:bold;}
    .song-lyric-wrap{height:3.5rem;}
    .song-video-wrap{padding:0px 0.4rem;}
    .jp-video-270p{width:100%;height:3.6rem;}
    .jp-video-270p .jp-video-play{height:3.5rem;margin-top:-3.5rem;}
    .jp-video-play-icon, .jp-video-play-icon:focus{width:1rem;height:1rem;background-size:cover;top:92%;margin-left:-0.5rem;}
    .jp-full-screen{background:url(../images/song-screen.png) no-repeat;}
    .song-type-catlog{display:block;width:0.4rem;height:0.32rem;position: absolute;background:url(../images/song-catlog.png) no-repeat;background-size: cover;right:0.2rem;}
    .jp-type-playlist{height:10.9rem;position: relative;}
    div.jp-type-playlist div.jp-playlist a.jp-playlist-current{color:#333;}
    .jp-play-title{padding-left:0.2rem;border-bottom:1px solid #ccc;}
    .jp-play-close{text-align:center;border-top:1px solid #ddd;}
    .song-icon-number{margin:0px 0.3rem 0px 0.2rem;}
    div.jp-type-playlist div.jp-playlist li.jp-playlist-current{color:#ffb403;}
    div.jp-type-playlist div.jp-playlist a.jp-playlist-current{color:#ffb403;}
    .song-music .jp-playlist ul li{border-bottom:1px solid #eee;}
    .song-music .jp-playlist ul li:last-child{border:none;}
    .song-lyric-sub{color:#fff;}
    .song-type-name{font-size:0.4rem;margin:0.2rem 0px 0px 0.4rem;}
    .song-type-art{font-size:0.28rem;font-weight:normal;margin-top:0.1rem;}


}
@media screen  and (min-width: 733px)  and (max-width: 735px) {
    .jp-play{width:1.2rem;height:1.2rem;background-size:cover;}
    div.jp-type-playlist div.jp-playlist a{color:#333;}
    .jp-play-title,.jp-play-close{display:block;}
    .song-type-catlog{display:block;}
    .song-audio-vol{width:100%;background-size:100% auto;height:11.5rem;padding:0.18rem 0.38rem 0.2rem 0.28rem;}
    .song-lyric, .song-audio-vol{float:none;}
    .song-type-page{height:2.7rem;padding: 0.5rem 0px 0px 0.5rem;position: relative;}
    .jp-audio .jp-controls{margin:0.4rem 0px 0.2rem 0px;}
    .jp-audio .jp-type-playlist .jp-time-holder{padding:0px 0.1rem;top:1.55rem;}
    .jp-audio .jp-progress{top:1.5rem;top:1.6rem;}
    .jp-audio .jp-type-playlist .jp-progress{left:1rem;width:4.6rem;}
    .song-lyric{width:100%;margin:0px;padding:0px 0.8rem;box-sizing: border-box;color:#fff;position: absolute;left:0px;top:6rem;}
    .jp-audio .jp-interface{height:2.5rem;}
    .song-lyric p{color:#fff;}
    .song-music .jp-playlist{
        display:none;
        background: #fff;
        position: absolute;
        left: 0px;
        width: 100%;
        bottom:0px;z-index:10;
        color:#333;
    }
    .song-audio-det{position: relative;}
    .song-lyric-title{font-size:0.4rem;font-weight:normal;line-height:1.6;}
    .song-lyric-sub{padding:0.1rem 0px;}
    .song-lyric-det p{height:0.6rem;line-height:0.6rem;}
    .song-lyric-det p.song-lyric-hover{color:#ffb403;font-weight:bold;}
    .song-lyric-wrap{height:3.5rem;}
    .song-video-wrap{padding:0px 0.4rem;}
    .jp-video-270p{width:100%;height:3.6rem;}
    .jp-video-270p .jp-video-play{height:3.5rem;margin-top:-3.5rem;}
    .jp-video-play-icon, .jp-video-play-icon:focus{width:1rem;height:1rem;background-size:cover;top:92%;margin-left:-0.5rem;}
    .jp-full-screen{background:url(../images/song-screen.png) no-repeat;}
    .song-type-catlog{display:block;width:0.4rem;height:0.32rem;position: absolute;background:url(../images/song-catlog.png) no-repeat;background-size: cover;right:0.2rem;}
    .jp-type-playlist{height:10.9rem;position: relative;}
    div.jp-type-playlist div.jp-playlist a.jp-playlist-current{color:#333;}
    .jp-play-title{padding-left:0.2rem;border-bottom:1px solid #ccc;}
    .jp-play-close{text-align:center;border-top:1px solid #ddd;}
    .song-icon-number{margin:0px 0.3rem 0px 0.2rem;}
    div.jp-type-playlist div.jp-playlist li.jp-playlist-current{color:#ffb403;}
    div.jp-type-playlist div.jp-playlist a.jp-playlist-current{color:#ffb403;}
    .song-music .jp-playlist ul li{border-bottom:1px solid #eee;}
    .song-music .jp-playlist ul li:last-child{border:none;}
    .song-lyric-sub{color:#fff;}
    .song-type-name{font-size:0.4rem;margin:0.2rem 0px 0px 0.4rem;}
    .song-type-art{font-size:0.28rem;font-weight:normal;margin-top:0.1rem;}



}
@media screen and (max-width: 601px) {
    .jp-play{width:1.2rem;height:1.2rem;background-size:cover;}
    div.jp-type-playlist div.jp-playlist a{color:#333;}
    .jp-play-title,.jp-play-close{display:block;}
    .song-type-catlog{display:block;}
    .song-audio-vol{width:100%;background-size:100% auto;height:11.5rem;padding:0.18rem 0.38rem 0.2rem 0.28rem;}
    .song-lyric, .song-audio-vol{float:none;}
    .song-type-page{height:2.7rem;padding: 0.5rem 0px 0px 0.5rem;position: relative;}
    .jp-audio .jp-controls{margin:0.4rem 0px 0.2rem 0px;}
    .jp-audio .jp-type-playlist .jp-time-holder{padding:0px 0.1rem;top:1.55rem;}
    .jp-audio .jp-progress{top:1.5rem;top:1.6rem;}
    .jp-audio .jp-type-playlist .jp-progress{left:1rem;width:4.6rem;}
    .song-lyric{width:100%;margin:0px;padding:0px 0.8rem;box-sizing: border-box;color:#fff;position: absolute;left:0px;top:6rem;}
    .jp-audio .jp-interface{height:2.5rem;}
    .song-lyric p{color:#fff;}
    .song-music .jp-playlist{
        display:none;
        background: #fff;
        position: absolute;
        left: 0px;
        width: 100%;
        bottom:0px;z-index:10;
        color:#333;
    }
    .song-audio-det{position: relative;}
    .song-lyric-title{font-size:0.4rem;font-weight:normal;line-height:1.6;}
    .song-lyric-sub{padding:0.1rem 0px;}
    .song-lyric-det p{height:0.6rem;line-height:0.6rem;}
    .song-lyric-det p.song-lyric-hover{color:#ffb403;font-weight:bold;}
    .song-lyric-wrap{height:3.5rem;}
    .song-video-wrap{padding:0px 0.4rem;}
    .jp-video-270p{width:100%;height:3.6rem;}
    .jp-video-270p .jp-video-play{height:3.5rem;margin-top:-3.5rem;}
    .jp-video-play-icon, .jp-video-play-icon:focus{width:1rem;height:1rem;background-size:cover;top:92%;margin-left:-0.5rem;}
    .jp-full-screen{background:url(../images/song-screen.png) no-repeat;}
    .song-type-catlog{display:block;width:0.4rem;height:0.32rem;position: absolute;background:url(../images/song-catlog.png) no-repeat;background-size: cover;right:0.2rem;}
    .jp-type-playlist{height:10.9rem;position: relative;}
    div.jp-type-playlist div.jp-playlist a.jp-playlist-current{color:#333;}
    .jp-play-title{padding-left:0.2rem;border-bottom:1px solid #ccc;}
    .jp-play-close{text-align:center;border-top:1px solid #ddd;}
    .song-icon-number{margin:0px 0.3rem 0px 0.2rem;}
    div.jp-type-playlist div.jp-playlist li.jp-playlist-current{color:#ffb403;}
    div.jp-type-playlist div.jp-playlist a.jp-playlist-current{color:#ffb403;}
    .song-music .jp-playlist ul li{border-bottom:1px solid #eee;}
    .song-music .jp-playlist ul li:last-child{border:none;}
    .song-lyric-sub{color:#fff;}
    .song-type-name{font-size:0.4rem;margin:0.2rem 0px 0px 0.4rem;}
    .song-type-art{font-size:0.28rem;font-weight:normal;margin-top:0.1rem;}





















}