/* Pushボタンのレイアウト */ div.pushbutton { text-align: center; } button#push { width: 92%; height: 80vh; font-size: 5em; font-weight: bold; padding: 10px 30px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; border: 1px solid #15aeec; background-color: #49c0f0; background-image: -webkit-linear-gradient(top, #49c0f0, #2cafe3); background-image: linear-gradient(to bottom, #49c0f0, #2cafe3); border-radius: 10px; color: #fff; line-height: 50px; -webkit-transition: none; transition: none; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); } button#push:hover { border:1px solid #1090c3; background-color: #1ab0ec; background-image: -webkit-linear-gradient(top, #1ab0ec, #1a92c2); background-image: linear-gradient(to bottom, #1ab0ec, #1a92c2); } button#push:active { background: #1a92c2; box-shadow: inset 0 3px 5px rgba(0, 0, 0, .2); color: #1679a1; text-shadow: 0 1px 1px rgba(255, 255, 255, .5); } button#push:disabled { color: #000; background-color:#f7d034; border: 1px solid #f7d034; background-image: -webkit-linear-gradient(top, #f7d034, #f7ba59); background-image: linear-gradient(to bottom, #f7d034, #f7ba59); } /* チームの早押しリスト */ ol { counter-reset:number; /*数字をリセット*/ list-style-type: none!important; /*数字を一旦消す*/ counter-reset:li; font: 14px/1.6 'arial narrow', sans-serif; list-style: none; padding:0; } ol li { position: relative; font-weight: bold; line-height: 28px; padding: 20px; padding-left: 70px; margin: 10px 0; } ol li:nth-child(6n+1){ border:dashed 2px #ff7f7f; } ol li:nth-child(6n+2){ border:dashed 2px #ffbf7f; } ol li:nth-child(6n+3){ border:dashed 2px #7fbfff; } ol li:nth-child(6n+4){ border:dashed 2px #7fff7f; } ol li:nth-child(6n+5){ border:dashed 2px #ff7fff; } ol li:nth-child(6n+6){ border:dashed 2px #bf7fff; } ol li:before{ counter-increment: li; content: counter(li); position: absolute; left: 10px; color: #fff; text-align: center; line-height: 50px; width: 50px; height: 50px; top: 50%; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } ol li:nth-child(6n+1):before{ background: #ff7f7f; } ol li:nth-child(6n+2):before{ background: #ffbf7f; } ol li:nth-child(6n+3):before{ background: #7fbfff; } ol li:nth-child(6n+4):before{ background: #7fff7f; } ol li:nth-child(6n+5):before{ background: #ff7fff; } ol li:nth-child(6n+6):before{ background: #bf7fff; } /* チームの早押し順位を非表示にする */ #team-list-none{ display:none; } /* 曲リスト */ div#playListArea{ overflow:auto; height:50vh; } li.list-group-item:hover { background: #a9a9a9; cursor:pointer; } /* footer */ footer{ font-size: 90%; width: 100%; text-align: center; padding-top: 10px; padding-bottom: 10px; background-color: #343A40; } footer p.copyright{ color: #fff; } /* footerを最下部に表示する */ html { height: 100%; } body { min-height: 100%; display: flex; flex-direction: column; } .contents { flex: 1; }