#liveon {background-color:#3b3f4a; color:#fff; padding:.8em 0; text-align:center; line-height:150% !important; margin:.2em 0 2em;}
#liveon .infoarea{width:900px; margin:0 auto; position: relative; padding:0 0 0 80px;}
#liveon span.nowst{color:#fff; background-color:#ff3c1e; font-weight:bold; border-radius:20px; padding:.2em .9em; font-size:90%; display:inline-block; vertical-align:middle;}
#liveon .infoarea p{font-weight:bold; background:url(../img/idx_live_play.svg) no-repeat right center !important; width:700px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; display:inline-block; vertical-align:middle; padding:0 4% 0 2%; letter-spacing:.05em; background-size:auto 100% !important; line-height:150% !important;}
#liveon .infoarea a{color:#fff; text-decoration:none; transition:0.4s;}
#liveon .infoarea a:hover{opacity:0.6;}
.nowlive{max-width:90px; animation: flash 2s linear infinite; display:block; position:absolute; left:0; top:0; vertical-align:middle;}
@keyframes flash {
  0% {opacity:1;}
  50% {opacity:0;}
  100% {opacity:1;}
}

@media all and (min-width: 768px) {
}
@media all and (max-width: 767px) {
#liveon{padding:1.5%; line-height:130% !important; text-align:right; margin:.2em 0 5%;}
#liveon .infoarea{width:100%; margin:0 auto; position: relative; padding:0;}
#liveon span.nowst{padding:.5% 2.5%; font-size:2.5vw;}
#liveon .infoarea p{font-size:2.8vw; padding:.5% 5% .5% 2%; text-align:center; width:64%; line-height:130% !important;}
.nowlive{width:14%; max-width:100%; position:absolute; left:0; top:0; bottom:0; margin: auto;}
}