/*---------------------------------------------
カウントダウン
---------------------------------------------*/
.count{
	cursor: pointer;
}

.count:hover{
	opacity: 0.6;
}

.countArea{
	max-width: 650px;
	padding: 2em;
	margin: auto;
}

.countArea .sv{
	text-align: right;
	font-size: 150%;
	margin: 1em auto 0;
	font-weight: bold;
}

.countArea .sv .play-bt,
.countArea .sv .stop-bt{
	width: 8%;
	display: inline-block;
	vertical-align: middle;
	margin-left: 0.5em;
	background-image: url("../count/play.png");
	background-size: 100%;
}

.countArea .sv  .stop-bt{
	background-image: url("../count/stop.png");
}


@media (hover: none) {
.countArea .sv  .play-bt:active{
		background-image: url("../count/stop.png");
	}
}

.countArea .sv img{
	width: 100%;
	max-width: 100%;
}


/*---------------------------------------------
バナー
---------------------------------------------*/

#topBanner  .play-bt,
#topBanner  .stop-bt{
	display:block;
	cursor: pointer;
}

#topBanner  .stop-bt{
	opacity: 0.6;
}

@media (hover: none) {
#topBanner  .play-bt:active{
		opacity: 0.6;
	}
}


/*---------------------------------------------
カウントバックナンバー
---------------------------------------------*/

.backNum{
	display: flex;
	padding: 1em 0 0;
	flex-wrap: wrap;
	gap: 1em;
}

.backNum .box{
	border: 1px solid;
	border-image: linear-gradient(to right, rgba(0, 126, 255, 1) 0%, rgba(95, 40, 219, 1) 50%, rgba(207, 14, 255, 1)) 1;
	text-align: left;
	width: calc(100% / 3 - 1em);
	background-color: var(--black);
}

.backNum .box .txt{
	padding: 1.5em;
}

.backNumIll{
	width: 100%;
	max-width: 600px;
	margin: auto;
	border: 1px solid;
	border-image: linear-gradient(to right, rgba(0, 126, 255, 1) 0%, rgba(95, 40, 219, 1) 50%, rgba(207, 14, 255, 1)) 1;
}

.backNum .box.big{
	width: 100%;
	max-width: 600px;
	margin: auto;
}

.backNum .box .title,
.backNumIll .title{
	background-color: var(--purple);
	color: var(--white);
	padding:1em;
	text-align: center;
	font-weight: bold;
}

.backNum .box .title.today{
	background: var(--grd1);
}

.backNum .play-bt,
.backNum  .stop-bt{
	cursor: pointer;
}

.backNum  .stop-bt{
	opacity: 0.6;
}

@media (hover: hover) {
.backNum  .play-bt:hover{
		opacity: 0.6;
	}
}

@media (hover: none) {
.backNum  .play-bt:active{
		opacity: 0.6;
	}
}


/*######################################################################
メディアクエリ
######################################################################*/
/*//////////////////////////////////////////////////////////////////////*/
@media screen and (max-width: 800px) {
/*//////////////////////////////////////////////////////////////////////*/
.countArea{
	padding: 5em 2em;
}
	
.countArea .sv .play-bt,
.countArea .sv .stop-bt{
	width: 15%;
}

/*---------------------------------------------
カウントバックナンバー
---------------------------------------------*/
.backNum{
	display: block;
}
	
.backNum .box{
	width: calc(100% / 1);
	margin-bottom: 2em;
}
	
/*//////////////////////////////////////////////////////////////////////*/
}