@charset "shift-jis";

.audiojs .play,
.audiojs .loading,
.audiojs .error,
.audiojs .pause{
background-size:30px 120px;
background-repeat:no-repeat;
background-image:url(player.gif);}

.audiojs .play{background-position:0 -3px;}
.audiojs .loading{background-position:0 -33px;}
.audiojs .error{background-position:0 -63px;}
.audiojs .pause{background-position:0 -93px;}

.audiojs .time{color:#fff !important;}

/*再生バーのカスタマイズ*/
.audiojs{width:calc(100% - 10px); background:#0c2d57; border:1px solid #333; border-radius:20px; margin:0 auto 20px;}
 
/*再生ゲージ未再生部分の背景色（単色）*/
.audiojs .scrubber{width:calc(100% - 60px); background:#0c2d57; border:solid 1px #898989;}

/*再生ゲージ再生済み部分の背景色*/
.cat.lm .audiojs .progress{background:#00baff;}
.cat.vm .audiojs .progress{background:#fe06ff;}

/*再生ゲージ再生済み境界線部分の背景色*/
.audiojs .loaded{background:#fff;}

/*再生停止ボタン*/
.audiojs .play-pause{width:40px; height:40px;}

/*再生時間の設定*/
.audiojs .time{display:none;}

/*再生時間の文字設定*/
.audiojs .time em{padding:0px 2px 0px 0px; font-style:normal;}

@media screen and (max-width:480px){.audiojs{width:100%;}}

@media screen and (max-width:420px){
.audiojs{font-size:11px !important; height:40px !important;}
.audiojs *{padding:0 !important; margin:0 !important;}

.audiojs .play-pause{width:50px; height:50px;}
.audiojs .scrubber{width:calc(100% - 60px); height:14px; top:12px;}

.audiojs .play,
.audiojs .loading,
.audiojs .error,
.audiojs .pause{width:50px; height:50px; background-size:50px 200px;}
.audiojs .play{background-position:0 -5px;}
.audiojs .loading{background-position:0 -55px;}
.audiojs .error{background-position:0 -105px;}
.audiojs .pause{background-position:0 -155px;}
}