@media{#mPlayer{margin:0px auto;border-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#mPlayer #mpContainer{position:relative}#mPlayer #mpPlayListSec{background-color:rgba(255, 255, 255, 0.2);color:#fff;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:5px}#mpImage{width:80px;height:80px;background-size:cover;background-repeat:no-repeat;background-position:center center;background-color:#222}#mpNameBase{position:absolute;left:120px;width:160px;top:20px;height:25px;font-size:13px;overflow:hidden}#mpNameBase #mpName{white-space:nowrap}#mPlayer #mpBtnPlay{position:absolute;left:170px;top:50px;width:60px;height:60px;background-color:rgba(0, 0, 0, 0.1);text-align:center;font-size:30px;padding-top:30px;padding-left:5px;cursor:pointer;border-radius:50%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-indent:-9999px;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2285.97%2050%2022.03%2013.08%2022.03%2086.92%2085.97%2050%22%2F%3E%3C%2Fsvg%3E");background-position:center center;background-size:30px 30px;background-repeat:no-repeat}#mPlayer #mpBtnPlay:hover{background-color:rgba(255, 255, 255, 0.1)}#mPlayer #mpBtnPlay.pause{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2227.29%22%20y%3D%2213.08%22%20width%3D%2215.26%22%20height%3D%2273.83%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2257.45%22%20y%3D%2213.08%22%20width%3D%2215.26%22%20height%3D%2273.83%22%2F%3E%3C%2Fsvg%3E");background-color:rgba(0, 0, 0, 0.3);padding-left:1px}#mPlayer #mpBtnNext,#mPlayer #mpBtnPrev{position:absolute;width:40px;height:40px;background-color:rgba(0, 0, 0, 0.1);border-radius:50%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-align:center;font-size:18px;padding-top:21px;cursor:pointer;text-indent:-9999px;background-position:center center;background-size:15px 15px;background-repeat:no-repeat;-webkit-transition-duration:0.4s;-o-transition-duration:0.4s;transition-duration:0.4s;top:60px}#mPlayer #mpBtnNext:hover,#mPlayer #mpBtnPrev:hover{background-color:rgba(255, 255, 255, 0.1)}#mPlayer #mpBtnNext.active,#mPlayer #mpBtnPrev.active{background-color:rgba(0, 0, 0, 0.3)}#mPlayer #mpBtnNext{left:235px;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2261.29%2050%2016.13%2013.08%2016.13%2086.92%2061.29%2050%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2268.62%22%20y%3D%2213.08%22%20width%3D%2215.26%22%20height%3D%2273.83%22%2F%3E%3C%2Fsvg%3E")}#mPlayer #mpBtnPrev{left:125px;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2238.71%2050%2083.87%2086.92%2083.87%2013.08%2038.71%2050%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2216.13%22%20y%3D%2213.08%22%20width%3D%2215.26%22%20height%3D%2273.83%22%20transform%3D%22translate(47.51%20100)%20rotate(180)%22%2F%3E%3C%2Fsvg%3E")}#mPlayer #mpBtnFf,#mPlayer #mpBtnRew,#mPlayer #mpBtnStop{position:absolute;width:30px;height:30px;background-color:rgba(0, 0, 0, 0.1);border-radius:50%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-align:center;font-size:12px;padding-top:15px;cursor:pointer;text-indent:-9999px;background-position:center center;background-size:15px 15px;background-repeat:no-repeat;-webkit-transition-duration:0.4s;-o-transition-duration:0.4s;transition-duration:0.4s;top:150px}#mPlayer #mpBtnFf:hover,#mPlayer #mpBtnRew:hover,#mPlayer #mpBtnStop:hover{background-color:rgba(255, 255, 255, 0.1)}#mPlayer #mpBtnStop.active{background-color:rgba(0, 0, 0, 0.3)}#mPlayer #mpBtnFf.active,#mPlayer #mpBtnRew.active{background-color:rgba(0, 0, 0, 0.3)}#mPlayer #mpBtnRew{left:20px;padding-right:3px}#mPlayer #mpBtnStop{left:20px;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2213.08%22%20y%3D%2213.08%22%20width%3D%2273.83%22%20height%3D%2273.83%22%2F%3E%3C%2Fsvg%3E")}#mPlayer #mpBtnFf{left:94px;padding-left:3px}#mpTimeBlock{position:absolute;left:20px;top:120px;width:260px}#mpTimeBlock #mpTimeC,#mpTimeBlock #mpTimeT{float:left;font-size:10px}#mpTimeBlock #mpTimeT{float:right;text-align:right}#mpTimeBlock #mpSeekBase{position:absolute;left:38px;top:5px;width:176px;height:3px;border:3px solid transparent;background-color:rgba(0, 0, 0, 0.1);cursor:pointer}#mpTimeBlock #mpSeekBase #mpProg{position:absolute;left:0px;top:0px;width:0px;height:3px;background-color:#0bfb9f}#mpTimeBlock #mpSeekBase #mpProg #mpProgMark{position:absolute;right:0px;top:-1px;display:block;width:1px;height:5px;background-color:#fff}#mPlayer #mpVolume{position:absolute;left:138px;top:155px;width:90px}#mPlayer #mpVolume #mpVolMinus,#mPlayer #mpVolume #mpVolPlus{position:absolute;width:20px;height:20px;background-color:rgba(0, 0, 0, 0.1);border-radius:50%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-align:center;font-size:10px;padding-top:10px;cursor:pointer;text-indent:-9999px;background-position:center center;background-size:15px 15px;background-repeat:no-repeat;-webkit-transition-duration:0.4s;-o-transition-duration:0.4s;transition-duration:0.4s;top:0px}#mPlayer #mpVolume #mpVolMinus:hover,#mPlayer #mpVolume #mpVolPlus:hover{background-color:rgba(255, 255, 255, 0.1)}#mPlayer #mpVolume #mpVolMinus.active,#mPlayer #mpVolume #mpVolPlus.active{background-color:#c00}#mPlayer #mpVolume #mpVolMinus{left:0px;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2220.15%22%20y%3D%2243.54%22%20width%3D%2259.69%22%20height%3D%2212.92%22%2F%3E%3C%2Fsvg%3E")}#mPlayer #mpVolume #mpVolPlus{right:0px;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2220.15%22%20y%3D%2243.54%22%20width%3D%2259.69%22%20height%3D%2212.92%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2220.15%22%20y%3D%2243.54%22%20width%3D%2259.69%22%20height%3D%2212.92%22%20transform%3D%22translate(100)%20rotate(90)%22%2F%3E%3C%2Fsvg%3E")}#mPlayer #mpVolume #mpVolBase{position:absolute;left:25px;top:10px;width:40px;height:1px;background-color:rgba(0, 0, 0, 0.2)}#mPlayer #mpVolume #mpVolBase #mpVol{position:absolute;left:0px;top:0px;width:0px;height:1px;background-color:#fff}#mPlayer #mpBtnAutoPlay{position:absolute;left:240px;top:155px;width:40px;height:20px;background-color:rgba(0, 0, 0, 0.1);border-radius:5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-align:center;font-size:10px;line-height:0px;padding-top:10px;cursor:pointer}#mPlayer #mpBtnAutoPlay:hover{background-color:rgba(255, 255, 255, 0.1)}#mPlayer #mpBtnAutoPlay.active{background-color:#c00}#mpPlayListSec ul{display:block;min-width:100%}#mpPlayListSec ul li{display:block;font-size:12px;line-height:18px;margin-top:1px;padding:10px 15px;cursor:pointer;background-color:rgba(255, 255, 255, 0.1);border-left:3px solid rgba(255, 255, 255, 0.1);border-radius:0px 3px 3px 0px;-webkit-transition-duration:0.6s;-o-transition-duration:0.6s;transition-duration:0.6s;-webkit-box-sizing:border-box;box-sizing:border-box}#mpPlayListSec ul li:first-child{margin-top:0px}#mpPlayListSec ul li:hover{background-color:rgba(0, 0, 0, 0.1);border-left:3px solid rgba(0, 0, 0, 0.1)}#mpPlayListSec ul li.active{border-left:3px solid rgba(255, 255, 255, 0.6)}.marquee{width:160px;overflow:hidden;position:relative}.marquee p{margin:0;padding-left:160px;display:inline-block;white-space:nowrap;-webkit-animation-name:marquee;-webkit-animation-timing-function:linear;-webkit-animation-duration:10s;-webkit-animation-iteration-count:infinite;-moz-animation-name:marquee;-moz-animation-timing-function:linear;-moz-animation-duration:10s;-moz-animation-iteration-count:infinite;-ms-animation-name:marquee;-ms-animation-timing-function:linear;-ms-animation-duration:10s;-ms-animation-iteration-count:infinite;-o-animation-name:marquee;-o-animation-timing-function:linear;-o-animation-duration:10s;-o-animation-iteration-count:infinite;animation-name:marquee;animation-timing-function:linear;animation-duration:10s;animation-iteration-count:infinite}.marquee p:after{content:"";white-space:nowrap;padding-right:30px}@-webkit-keyframes marquee{0%{-webkit-transform:translate(0%)}99%,to{-webkit-transform:translate(-100%)}}@-moz-keyframes marquee{0%{-moz-transform:translate(0%)}99%,to{-moz-transform:translate(-100%)}}@-ms-keyframes marquee{0%{-ms-transform:translate(0%)}99%,to{-ms-transform:translate(-100%)}}@-o-keyframes marquee{0%{-o-transform:translate(0%)}99%,to{-o-transform:translate(-100%)}}@keyframes marquee{0%{-webkit-transform:translate(0%);transform:translate(0%)}99%,to{-webkit-transform:translate(-100%);transform:translate(-100%)}}}@media only screen and (max-width:767px){#mPlayer{width:300px}#mPlayer #mpContainer{width:300px}#mPlayer #mpImageSec{position:absolute;left:20px;top:20px;width:80px;height:80px}#mPlayer #mpControllerSec{height:200px;background-color:rgba(255, 255, 255, 0.2);color:#fff;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:5px;margin-bottom:3px}#mPlayer #mpPlayListSec{width:300px;padding:10px}.marquee{width:160px;overflow:hidden;position:relative}.marquee p{margin:0;padding-left:160px;display:inline-block;white-space:nowrap;-webkit-animation-name:marquee;-webkit-animation-timing-function:linear;-webkit-animation-duration:10s;-webkit-animation-iteration-count:infinite;-moz-animation-name:marquee;-moz-animation-timing-function:linear;-moz-animation-duration:10s;-moz-animation-iteration-count:infinite;-ms-animation-name:marquee;-ms-animation-timing-function:linear;-ms-animation-duration:10s;-ms-animation-iteration-count:infinite;-o-animation-name:marquee;-o-animation-timing-function:linear;-o-animation-duration:10s;-o-animation-iteration-count:infinite;animation-name:marquee;animation-timing-function:linear;animation-duration:10s;animation-iteration-count:infinite}.marquee p:after{content:"";white-space:nowrap;padding-right:30px}@-webkit-keyframes marquee{0%{-webkit-transform:translate(0%)}99%,to{-webkit-transform:translate(-100%)}}@-moz-keyframes marquee{0%{-moz-transform:translate(0%)}99%,to{-moz-transform:translate(-100%)}}@-ms-keyframes marquee{0%{-ms-transform:translate(0%)}99%,to{-ms-transform:translate(-100%)}}@-o-keyframes marquee{0%{-o-transform:translate(0%)}99%,to{-o-transform:translate(-100%)}}@keyframes marquee{0%{-webkit-transform:translate(0%);transform:translate(0%)}99%,to{-webkit-transform:translate(-100%);transform:translate(-100%)}}}@media only screen and (min-width:768px) and (max-width:1023px){#mPlayer{width:auto}#mPlayer #mpContainer{width:auto;display:-webkit-box;display:-moz-box;display:box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;-webkit-box-lines:single;-moz-box-lines:single;box-lines:single;-webkit-flex-wrap:nowrap;-moz-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:justify;-moz-box-pack:justify;box-pack:justify;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;-ms-flex-pack:justify;-webkit-align-content:center;-moz-align-content:center;align-content:center;-ms-flex-line-pack:center}#mPlayer #mpMainSec{width:300px;position:relative;background-color:rgba(255, 255, 255, 0.2);color:#fff;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:5px}#mPlayer #mpImageSec{position:absolute;left:20px;top:20px}#mPlayer #mpControllerSec{position:relative;margin-bottom:3px;min-height:200px}#mPlayer #mpPlayListSec{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:10px;margin-left:3px}.marquee{width:160px;overflow:hidden;position:relative}.marquee p{margin:0;padding-left:160px;display:inline-block;white-space:nowrap;-webkit-animation-name:marquee;-webkit-animation-timing-function:linear;-webkit-animation-duration:10s;-webkit-animation-iteration-count:infinite;-moz-animation-name:marquee;-moz-animation-timing-function:linear;-moz-animation-duration:10s;-moz-animation-iteration-count:infinite;-ms-animation-name:marquee;-ms-animation-timing-function:linear;-ms-animation-duration:10s;-ms-animation-iteration-count:infinite;-o-animation-name:marquee;-o-animation-timing-function:linear;-o-animation-duration:10s;-o-animation-iteration-count:infinite;animation-name:marquee;animation-timing-function:linear;animation-duration:10s;animation-iteration-count:infinite}.marquee p:after{content:"";white-space:nowrap;padding-right:30px}@-webkit-keyframes marquee{0%{-webkit-transform:translate(0%)}99%,to{-webkit-transform:translate(-100%)}}@-moz-keyframes marquee{0%{-moz-transform:translate(0%)}99%,to{-moz-transform:translate(-100%)}}@-ms-keyframes marquee{0%{-ms-transform:translate(0%)}99%,to{-ms-transform:translate(-100%)}}@-o-keyframes marquee{0%{-o-transform:translate(0%)}99%,to{-o-transform:translate(-100%)}}@keyframes marquee{0%{-webkit-transform:translate(0%);transform:translate(0%)}99%,to{-webkit-transform:translate(-100%);transform:translate(-100%)}}}@media only screen and (min-width:1024px){#mPlayer{width:auto}#mPlayer #mpContainer{width:auto;display:-webkit-box;display:-moz-box;display:box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;-webkit-box-lines:single;-moz-box-lines:single;box-lines:single;-webkit-flex-wrap:nowrap;-moz-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:justify;-moz-box-pack:justify;box-pack:justify;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;-ms-flex-pack:justify;-webkit-align-content:center;-moz-align-content:center;align-content:center;-ms-flex-line-pack:center}#mPlayer #mpMainSec{width:300px;position:relative;background-color:rgba(255, 255, 255, 0.2);color:#fff;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:5px}#mPlayer #mpImageSec{position:absolute;left:20px;top:20px}#mPlayer #mpControllerSec{position:relative;margin-bottom:3px;min-height:200px}#mPlayer #mpPlayListSec{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:10px;margin-left:3px}.marquee{width:160px;overflow:hidden;position:relative}.marquee p{margin:0;padding-left:160px;display:inline-block;white-space:nowrap;-webkit-animation-name:marquee;-webkit-animation-timing-function:linear;-webkit-animation-duration:10s;-webkit-animation-iteration-count:infinite;-moz-animation-name:marquee;-moz-animation-timing-function:linear;-moz-animation-duration:10s;-moz-animation-iteration-count:infinite;-ms-animation-name:marquee;-ms-animation-timing-function:linear;-ms-animation-duration:10s;-ms-animation-iteration-count:infinite;-o-animation-name:marquee;-o-animation-timing-function:linear;-o-animation-duration:10s;-o-animation-iteration-count:infinite;animation-name:marquee;animation-timing-function:linear;animation-duration:10s;animation-iteration-count:infinite}.marquee p:after{content:"";white-space:nowrap;padding-right:30px}@-webkit-keyframes marquee{0%{-webkit-transform:translate(0%)}99%,to{-webkit-transform:translate(-100%)}}@-moz-keyframes marquee{0%{-moz-transform:translate(0%)}99%,to{-moz-transform:translate(-100%)}}@-ms-keyframes marquee{0%{-ms-transform:translate(0%)}99%,to{-ms-transform:translate(-100%)}}@-o-keyframes marquee{0%{-o-transform:translate(0%)}99%,to{-o-transform:translate(-100%)}}@keyframes marquee{0%{-webkit-transform:translate(0%);transform:translate(0%)}99%,to{-webkit-transform:translate(-100%);transform:translate(-100%)}}}