:root {
	--base-color:#f8b656;/*#eb6f8b*/
	--base-light-color:rgba(248,182,86,.50); /* #00ff00 #8cff5f #5ac722 */
	--news-color:#ff791b;
	--niji4-color:#fff110;
	--staff-color:#50dfbd;
	--story-color:#ff6d6d;
	--member-color:#67d0ff;
	--movie-color:#c717fa;
	--books-color:#70c228;
	--vote-color:#297fff;
	--tw-color:rgb(29, 161, 242); /* twitter */
	--yt-color:rgb(255, 0, 0); /* Youtube */
	--insta-color:#297fff; /* intagram */
	--radio-color:#adcc00;
	--manga-color:#1ba6ff;
	--cd-color:#c85cff;
	--live-color:#fa73ff;
	--ss-color:#fead00;
	--tv-color:#eb6f8b;
	--nijigasaki-color:#e4007f;
	--bd-color:#735cff;
	--bd-light-color:rgba(115,92,255,.5);
	--book-color:#e40080;
}

#navigation li a.news {
	background-color:  var(--news-color);
}
#navigation li a.news:hover {
	color: var(--news-color);
	border-color: var(--news-color);
}


#navigation li a.niji4 {
	background-color:  var(--niji4-color);
	border-color: #fff;
	color: #111;
}
#navigation li a.niji4:hover {
	color: var(--niji4-color);
	border-color: var(--niji4-color);
	color: #111;
}


#navigation li a.staff {
	background-color: var(--staff-color);
}
#navigation li a.staff:hover {
	color:  var(--staff-color);
	border-color: var(--staff-color);
}


#navigation li a.story {
	background-color: var(--story-color);
}
#navigation li a.story:hover {
	color: var(--story-color);
	border-color: var(--story-color);
}


#navigation li a.member {
	background-color: var(--member-color);
}
#navigation li a.member:hover {
	color: var(--member-color);
	border-color: var(--member-color);
}


#navigation li a.str {
	background-color: var(--movie-color);
}
#navigation li a.str:hover {
	color: var(--movie-color);
	border-color: var(--movie-color);
}


#navigation li a.books {
	background-color: var(--books-color);
}
#navigation li a.books:hover {
	color: var(--books-color);
	border-color: var(--books-color);
}


#navigation li a.vote {
	background-color: var(--vote-color);
}
#navigation li a.vote:hover {
	color: var(--vote-color);
	border-color: var(--vote-color);
}


#navigation li a.radio {
	background-color: var(--radio-color);
}
#navigation li a.radio:hover {
	color: var(--radio-color);
	border-color: var(--radio-color);
}


#navigation li a.manga {
	background-color: var(--manga-color);
}
#navigation li a.manga:hover {
	color: var(--manga-color);
	border-color: var(--manga-color);
}


#navigation li a.cd {
	background-color: var(--cd-color);
}
#navigation li a.cd:hover {
	color: var(--cd-color);
	border-color: var(--cd-color);
}


#navigation li a.live {
	background-color: var(--live-color);
}
#navigation li a.live:hover {
	color: var(--live-color);
	border-color: var(--live-color);
}


#navigation li a.ss {
	background-color: var(--ss-color);
}
#navigation li a.ss:hover {
	color: var(--ss-color);
	border-color: var(--ss-color);
}


#navigation li a.tv {
	background-color: var(--tv-color);
}
#navigation li a.tv:hover {
	color: var(--tv-color);
	border-color: var(--tv-color);
}


#navigation li a.nijigasaki {
	background-color: var(--nijigasaki-color);
}
#navigation li a.nijigasaki:hover {
	color: var(--nijigasaki-color);
	border-color: var(--nijigasaki-color);
}


#navigation li a.bd {
	background-color: var(--bd-color);
}
#navigation li a.bd:hover {
	color: var(--bd-color);
	border-color: var(--bd-color);
}

#navigation li a.book {
	background-color: var(--book-color);
}
#navigation li a.book:hover {
	color: var(--book-color);
	border-color: var(--book-color);
}


@-webkit-keyframes icon {
  0% {
    transform: scale(.9);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes icon {
  0% {
    transform: scale(.9);
  }
  100% {
    transform: scale(1);
  }
}

#navigation li a.new {
	position: relative;
}
@media (min-width:601px) {
	#navigation li a.new::before {
		position: absolute;
		content: url("../img/common/new.png");
		left: 10px;
		top: calc(50% - 10px);
		-webkit-animation: icon .6s ease-in 0s infinite alternate none running;
		animation: icon .6s ease-in 0s infinite alternate none running;
	}
}
@media (max-width:600px) {
	#navigation li a.new::before {
		position: absolute;
		content: url("../img/common/new.png");
		left: 5px;
		top: -10px;
		-webkit-animation: icon .6s ease-in 0s infinite alternate none running;
		animation: icon .6s ease-in 0s infinite alternate none running;
	}
}
