body {
    overflow: hidden;
}
.main-wrap {
    background: 0 0;
    position: relative;
    min-width: 1330px
}
.main-wrap .left-wrap {
    width: 280px;
    height: 100%;
    float: left;
    position: relative;
    background: #fff;
}
.main-wrap .right-wrap {
    float: right;
    width: 349px;
    height: 100%;
    border-left: 1px solid #ebebeb;
    position: relative;
    background: #fff;
}
.main-wrap .center-wrap {
    overflow: hidden;
    height: 100%;
    position: relative;
    background: #fff;
    border-left: 1px solid rgba(0, 0, 0, .05);
}

/* left-wrap */
.left-wrap .content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    overflow: auto;
}
.left-wrap .tap-list {
    margin: 0;
    padding: 25px 18px 0 22px;
    text-align: left;
}
.left-wrap .tap-list .btn-tap {
    display: block;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    color: #333;
    margin-bottom: 10px;
    padding: 0 10px;
}
.left-wrap .tap-list .btn-tap.curr,
.left-wrap .tap-list .btn-tap:hover {
    background: #f3f3f3;
    border-radius: 5px;
    text-decoration: none;
}
.left-wrap .tap-list .btn-tap.curr {
    cursor: default;
}
.left-wrap .tap-list .btn-tap i {
    display: inline-block;
    vertical-align: middle;
    width: 22px;
    height: 22px;
    background: url(/public/images/player2/playlist.png) no-repeat;
    background-size: 100% 100%;
    margin-right: 15px;
}
.left-wrap .tap-list .tap-playlist i {
    background-image: url(/public/images/player2/playlist.png);
}
.left-wrap .tap-list .tap-playlist .playing {
    float: right;
    width: 14px;
    height: 12px;
    background: url(/public/images/player2/playing.png) no-repeat;
    margin: 14px 0 0 0;
    display: none;
}
.left-wrap .tap-list .tap-history i {
    background-image: url(/public/images/player2/history.png);
}
.left-wrap .tap-list .tap-collect i {
    background-image: url(/public/images/player2/collect_b.png);
}
.left-wrap .tap-list .btn-tap span {
    vertical-align: middle;
}
.left-wrap .tap-list .btn-tap:last-child {
    margin-bottom: 0;
}

.left-wrap .make-group {
    padding: 25px 18px 0 22px
}
.left-wrap .making-info-title {
    line-height: 34px;
    font-size: 14px;
    background: #eee;
    padding-left: 20px;
    font-weight: bold;
}
.left-wrap .making-info-list {

}
.left-wrap .making-info-list dl {
    display: block;
    border-bottom: 1px solid #EEE;
    padding: 10px;
}
.left-wrap .making-info-list dt {
    display: inline-block;
    width: 60px;
    vertical-align: top;
    font-weight: bold;
    text-align: center;
}
.left-wrap .making-info-list dd {
    display: inline-block;
    vertical-align: top;
    line-height: 20px;
    text-align: left;
}

/* right-wrap */
.right-wrap .cover {
    padding-top: 25px;
    text-align: center;
    height: 235px;
}
.right-wrap .cover img {
    display: block;
    width: 210px;
    height: 210px;
    margin: 0 auto;
    border-radius: 5px;
    box-shadow: 0 4px 14px 0 rgba(0, 0, 0, .12);
}
.right-wrap .album-name {
    line-height: 26px;
    font-size: 14px;
    font-weight: bold;
    width: 270px;
    margin: 10px auto 0;
    text-align: center;
}
.right-wrap .lrc-box {
    font-size: 14px;
    color: #666;
    line-height: 2;
    width: 80%;
    margin: 10px auto 0;
    -webkit-user-select: none;
    user-select: none;
    overflow: hidden;
}
.right-wrap .lrc-box.normal {
    overflow: auto;
}
/* end right-wrap */

/* center-wrap */
.center-wrap .center-list {
    width: 100%;
    height: 100%;
    position: relative;
    display: none;
}
.center-wrap .playlist {
    display: block;
}
.center-wrap .list-box {
    padding: 25px 30px 0;
}
.center-wrap .list-box .bd {
    overflow: auto;
}
.center-wrap .list-box .hd {
    height: 38px;
    line-height: 38px;
    border-bottom: 1px solid #f2f2f2;
    font-weight: bold;
    overflow: hidden;
}
.center-wrap .list-box .hd>div {
    float: left;
    height: 100%;
}
.center-wrap .list-box .choose {
    width: 40px;
}
.center-wrap .list-box .num {
    width: 50px;
    text-align: center;
}
.center-wrap .list-box .songname {
    width: 40%;
    text-align: left;
}
.center-wrap .list-box .btns {
    width: 15%;
    min-width: 170px;
    margin-left: 10px;
    overflow: hidden;
}
.center-wrap .list-box .btns a {
    display: inline-block;
    font-size: 0;
    width: 16px;
    height: 16px;
    margin-left: 10px;
    background-repeat: no-repeat;
    vertical-align: middle;
    display: none;
    text-decoration: none;
}
.center-wrap .list-box .item:hover .btns a {
    display: inline-block;
}
.center-wrap .list-box .btns .btn-play {
    background-image: url(/public/images/player2/audition.png);
}
.center-wrap .list-box .btns .btn-pause {
    background-image: url(/public/images/player2/pause_s.png);
    display: none;
}
.center-wrap .list-box .btns .btn-view {
    background-image: url(/public/images/player2/more.png);
}
.center-wrap .list-box .btns .btn-add {
    background-image: url(/public/images/player2/add.png)
}
.center-wrap .list-box .btns .btn-addsonglist {
    background-image: url(/public/images/player2/addsonglist.png);
}
.center-wrap .list-box .btns .btn-collect {
    background-image: url(/public/images/player2/collect.png);
}
.center-wrap .list-box .btns .btn-collect.collected {
    background-image: url(/public/images/player2/collected.png);
}
.center-wrap .list-box .btns .btn-delete {
    background-image: url(/public/images/player2/delete.png);
}
.center-wrap .list-box .item.curr .num {
    text-indent: -9999px;
    background: url(/public/images/player2/playing2.png) center center no-repeat;
}
.center-wrap .list-box .item.playing .num {
    background-image: url(/public/images/player2/playing.gif);
}

.center-wrap .list-box .item.playing:hover .btns .btn-play {
    display: none!important;
}

.center-wrap .list-box .item.playing:hover .btns .btn-pause {
    display: inline-block!important;
}

.center-wrap .list-box .singer {
    width: 150px;
    margin-left: 10px;
    text-align: center;
}
.center-wrap .list-box .duration {
    width: 80px;
    text-align: center;
}

.center-wrap .list-box .item {
    height: 50px;
    line-height: 50px;
    overflow: hidden;
}
.center-wrap .list-box .item>div {
    float: left;
    height: 100%;
}
.center-wrap .list-box .item:hover {
    background: #f9f9f9;
}
.center-wrap .list-box .item.curr {
    background: #f9f9f9;
}
.center-wrap .list-box .item:hover .btns .btn-pause {
    display: none;
}
.center-wrap .list-box .item a {
    color: #333;
    text-decoration: none;
}
.center-wrap .list-box .choose .btn-choose {
    display: block;
    width: 16px;
    height: 16px;
    background: url(/public/images/player2/checkbox.png) no-repeat;
    margin: 17px auto 0;
}
.center-wrap .list-box .choose .btn-choose.on {
    background-image: url(/public/images/player2/checkbox_on.png);
}

/* bottom-wrap */
.bottom-wrap {
    height: 70px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 0 1px 1px rgba(0, 0, 0, .05);
    position: relative;
    z-index: 112;
}
