:root {
	--color:			black;
/*	--bg-color:			#f4f8ff;	*/
	--bg-color:			white;
	--hover-color:		#fee;
	--link-color:		#00e;
	--visited-color:	purple;
	--border-color:		#444;
	--th-bg:			#ddd;

	--content-width:	780px;
	--head-width:		772px;
	--font-size-sx:		12px;
	--font-size-sss:	13px;
	--font-size-ss:		14px;
	--font-size-s:		15px;
	--font-size:		16px;
	--font-size-l:		17px;
	--font-size-ll:		18px;
	--font-size-lll:	19px;
	--font-size-lx:		20px;

	--hover-hilight1:	#fee;
	--hover-hilight2:	#fff;

	--vo-bg: #ffbbbb;
	--da-bg: #bbddff;
	--vi-bg: #ffffaa;
	--me-bg: #aaffaa;

	--vo-bg2: #ffeeee;
	--da-bg2: #eeeeff;
	--vi-bg2: #ffffee;
	--me-bg2: #eeffee;

	--ea-bg: #bbccff;
	--no-bg: #bbffbb;
	--ha-bg: #ffddaa;
	--ex-bg: #ffbbbb;
	--ma-bg: #ddaadd;

	--ea-bg2: #eef4ff;
	--no-bg2: #eeffee;
	--ha-bg2: #fff2dd;
	--ex-bg2: #ffe1e1;
	--ma-bg2: #ffddff;

    --unit-1: #fff68d;
    --unit-2: #853998;
    --unit-3: #fa8333;
    --unit-4: #ff699e;
    --unit-5: #af011c;
    --unit-6: #384D98;
    --unit-7: #008e74;
    --unit-8: #0C0C0C;

    --idol-1: #FFBAD6;
    --idol-2: #144384;
    --idol-3: #FFE012;
    --idol-4: #F84CAD;
    --idol-5: #A846FB;
    --idol-6: #006047;
    --idol-7: #3B91C4;
    --idol-8: #D9F2FF;
    --idol-9: #E5461C;
    --idol-10: #F93B90;
    --idol-11: #FFC602;
    --idol-12: #89C3EB;
    --idol-13: #90E667;
    --idol-14: #F54275;
    --idol-15: #E75BEC;
    --idol-16: #B4B4B0;
    --idol-17: #F30100;
    --idol-18: #5AFF19;
    --idol-19: #FF00FF;
    --idol-20: #50D0D0;
    --idol-21: #BE1E3E;
    --idol-22: #7967C3;
    --idol-23: #FFC639;
    --idol-24: #A6CDB6;
    --idol-25: #760F10;
    --idol-26: #24130D;
    --idol-27: #E0B5D3;
    --idol-28: #EAD7A4;
    --idol-90: #C3D825;
    --idol-91: #000000;
    --idol-93: #000000;
}

/*
@media (prefers-color-scheme: dark) {
  :root {
	--color:			white;
	--bg-color:			black;
	--hover-color:		#422;
	--link-color:		#88f;
	--visited-color:	#e8e;
	--border-color:		#aaa;
	--th-bg:			#444;

	--vo-bg: #442222;
	--da-bg: #222244;
	--vi-bg: #444422;
	--me-bg: #224422;

	--vo-bg2: #ffeeee;
	--da-bg2: #eeeeff;
	--vi-bg2: #ffffee;
	--me-bg2: #eeffee;

	--ea-bg: #bbccff;
	--no-bg: #bbffbb;
	--ha-bg: #ffddaa;
	--ex-bg: #ffbbbb;
	--ma-bg: #ddaadd;

	--ea-bg2: #eef4ff;
	--no-bg2: #eeffee;
	--ha-bg2: #fff2dd;
	--ex-bg2: #ffe1e1;
	--ma-bg2: #ffddff;
  }
}
*/

/* 基本設定 */
body {
	font-size:			var(--font-size);
	color:				var(--color);
	background-color:	var(--bg-color);
}

a										{ color: var(--link-color); }
a:visited								{ color: var(--visited-color); }

table {
	border-collapse:	collapse;
	border-spacing:		0;
	border-style:		none;
	table-layout:		fixed;
	margin-top:			0;
}

td {
	border:				1pt solid var(--border-color);
	padding-left:		5px;
	padding-right:		5px;
	padding-top:		1px;
	padding-bottom:		1px;
	position:			relative;
}

th {
	border:				1pt solid var(--border-color);
	background-color:	var(--th-bg);
	padding-left:		2px;
	padding-right:		2px;
	padding-top:		1px;
	padding-bottom:		1px;
}

p {
	margin-left:		0.5em;
	margin-right:		0.5em;
	margin-top:			0pt;
	margin-bottom:		0pt;
}

h4 {
	margin-top:			0.5em;
	margin-bottom:		0;
}

h3 {
	margin-top:			0.8em;
	margin-bottom:		0em;
}

span.comment							{ font-size: 14px; display: inline-block; }
div.comment								{ width: var(--content-width); }
span.line								{ display: block; }
.no-margin								{ padding: 0px; }

/*----- デフォルト -----*/
table.head 								{ width: var(--content-width); }
table.update							{ width: var(--content-width); }
table.list 								{ width: var(--content-width); }
table.details							{ width: var(--content-width); }
table.footer							{ width: var(--content-width); }

/* リスト */
table.list td.songname					{ text-align: center; }
table.list td.unitname					{ text-align: center; }
table.list td.idolname					{ text-align: center; }
table.list td.artist					{ text-align: center; }
table.list td.time						{ text-align: center; }
table.list td.difficulty				{ text-align: center; }
table.list td.level						{ text-align: center; }
table.list td.notes						{ text-align: center; }
table.list td.navi						{ text-align: center; }
table.list td.obtain					{ text-align: center; }
table.list td.implement					{ text-align: center; }
table.list td.index						{ text-align: center; }
table.list td.star						{ text-align: center; }
table.list td.rarity					{ text-align: center; }
table.list td.kind						{ text-align: center; }
table.list td.status					{ text-align: center; }
table.list td.datetime					{ text-align: center; }
table.list td.point						{ text-align: center; }

table.details td.star					{ text-align: center; }
table.details td.rarity					{ text-align: center; }
table.details td.level					{ text-align: center; }
table.details td.notes					{ text-align: center; }
table.details td.scorerank				{ text-align: center; }
table.details td.rhythm-image			{ text-align: center; }
table.details td.status					{ text-align: center; }
table.details td.cost					{ text-align: center; }
table.details td.pp						{ text-align: center; }
table.details td.evolution				{ text-align: center; }
table.details td.implement				{ text-align: center; }
table.details td.good-schedule			{ text-align: center; }
table.details td.rate					{ text-align: center; }
table.details td.exp					{ text-align: right; }
table.details td.filter					{ text-align: center; }
table.details td.rank					{ text-align: center; }
table.details td.unitname				{ text-align: center; }
table.details td.time					{ text-align: center; }

/*----- 共通 -----*/
span.star.solid							{ color: #f66; margin: 0px; padding: 0px; letter-spacing: -3px; }
span.star.empty							{ color: #aaa; margin: 0px; padding: 0px; letter-spacing: -3px; }

div.reward.rewarditem					{ display: flex;}
span.reward.amount						{}
span.reward.itemname					{ text-align: left;	flex-grow: 1;}

td.star-value							{ font-weight: bold; }
td.star-value.star-1					{ color: #aaa; }
td.star-value.star-2					{ color: #22f; }
td.star-value.star-3					{ color: #f00; }

td.rarity								{ font-weight: bold; }
td.rarity.rarity-1						{ color: #aaa; }
td.rarity.rarity-2						{ color: #22f; }
td.rarity.rarity-3						{ color: #f00; }

span.rarity-1							{ color: #000; }
span.rarity-2							{ color: #22f; }
span.rarity-3							{ color: #f00; }

td.dark-text							{ color: #000; }
td.light-text							{ color: #fff; }
.dark-text								{ color: #000; }
.light-text								{ color: #fff; }

/* フィルター */
div.filter {
	margin:		    4px 4px 5px 5px;
	font-size:		var(--font-size-sss);
	width:			var(--content-width);
}

div.filter div							{ display: inline-block; margin: 0px; }
div.filter div.star-checker				{ width: 217px; /* background: #eef; */ }
div.filter div.rarity-checker			{ width: 217px; /* background: #eef; */ }
div.filter div.obtain-checker			{ width: 291px; /* background: #efe; */ }
div.filter div.disp-selector			{ width: 252px; /* background: #eef; */ }
div.filter div.unit-checker				{ width: 780px; }
div.filter label.star-check   span		{ width: 54px; }
div.filter label.rarity-check span		{ width: 54px; }
div.filter label.obtain-check span		{ width: 80px; }
div.filter label.unit-check   span		{ width: 80px; }
div.filter label.disp-check   span		{ width: 80px; }
div.filter label input					{ display: none; }
div.filter label						{ margin: 0px; padding:	0px; }

div.filter label span {
	display:		inline-block;

    font-size:		var(--font-size-sss);
	text-align:		center;
    border:			1px;
    border-radius:	2px;
	margin:			0px;
	padding:		10px 5px 10px 5px;

    color:			#888;
    background:		#ddd;
    border:			1px solid #888;
}

div.filter label.checker input:checked + span {
    color:			#000;
    background:		#fcc;
    border:			1px solid #000;
}

div.filter label.selector input:checked + span {
    color:			#000;
    background:		#bfb;
    border:			1px solid #000;
}

/*----- 基本構造 -----*/
/* ヘッダ */
table.head								{ border-style: none; }
td.head.title							{ width: 60%; border-style: none; }
td.head.title.link-1					{ width: 80%; border-style: none; }
td.head.link							{ width: 20%; text-align: center; }
td.head.link:hover 						{ width: 20%; text-align: center; }
td.head.link							{ background-color: var(--bg-color); }
td.head.link:hover 						{ background-color: var(--hover-color); }
span.head.page-title					{ font-size: 14pt; font-weight: bold; color: #55C; }
span.page-title							{ white-space: nowrap; }
a.head.link	 							{ display: block; }

span.head.game-title
{
	font-size:				18pt;
	font-weight:			bold;
	background:				linear-gradient(90deg, #99f, #f99);
	color:					var(--color);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

td.head.category.link {
	width: 20%;
}

a.head.link.category {
	padding: 5px;
}

/* フッタ */
td.footer								{ border-style: none; }
div.footer {
	text-align:				right;
	margin-top:				0.5em;
}

/*----- 更新 -----*/
h2.update.month							{ width: var(--head-width); }
h2.update.month							{ background: linear-gradient(90deg, #fff, #ccf) }
h2.update.month							{ border-bottom: 1px solid #88f; }
h2.update.month							{ border-left:   2px solid #88f; }
h2.update.month							{ padding-left:  6px; }
h2.update.month							{ font-size: 16px; margin-top: 20px; margin-bottom: 0px; }
h3.update.day							{ font-size: 14px; margin-top: 10px; margin-bottom: 0px; }

table.update th							{ width: 10%; }
table.update td							{ width: 55%; }
table.update td.id						{ width: 35%; word-wrap: break-word; }

/* ID非表示 */
table.update th.update					{ width: 15%; }
table.update td.update					{ width: 85%; }
table.update td.id						{ width: 0%; display: none; }

span.update.pidol.star.label			{ width: 32px; }
span.update.support.rarity.label		{ width: 40px; }
span.update.cloth.label					{ width: 50px; }
span.update.gasha.pickup-p				{ color: #44f; font-size: 12px; font-weight: bold; }
span.update.gasha.pickup-s				{ color: #f66; font-size: 12px; font-weight: bold; }
span.update.pidol.gasha					{ color: #44f; font-size: 12px; font-weight: bold; }
span.update.schara.gasha				{ color: #f66; font-size: 12px; font-weight: bold; }
span.update.support.gasha				{ color: #f66; font-size: 12px; font-weight: bold; }
span.update.pidol.event					{ color: #44f; font-size: 12px; font-weight: bold; }
span.update.schara.season-pass			{ color: #2b2; font-size: 12px; font-weight: bold; }
span.update.obtain.season-pass			{ color: #2b2; font-size: 12px; font-weight: bold; }


table.update th.gasha					{ background-color: #fee; }
table.update th.event					{ background-color: #ffe; }
table.update th.song					{ background-color: #efe; }
table.update th.pidol					{ background-color: #eff; }
table.update th.support					{ background-color: #eef; }
table.update th.clothes					{ background-color: #fef; }
table.update th.season-pass				{ background-color: #beb; }
table.update th.streaming				{ background-color: #eee; }

a.update.streaming.youtube {
	display:			inline;
	text-align:			left;
	pointer-events:		auto;
	text-decoration:	underline;
	color:				blue;
}

a.update.streaming.youtube:hover {
	display:			inline;
	text-align:			left;
	pointer-events:		auto;
	text-decoration:	none;
	color:				blue;
	background:			#eef;
}

span.update.label {
	display:			inline-block;
	text-align:			center;
/*	color:				red;	*/
}

/*----- 楽曲・譜面 -----*/
/* 楽曲・譜面/リスト */
table.list.rhythm.navi					{ margin-top: 1em; }

table.list.rhythm th	{
	position:			sticky;
	top:				-1px;
/*	top:				27px;	*/
	z-index:			1;
}

table.list.rhythm td.navi.rhythm-update	{ width: 25%; }
table.list.rhythm td.navi.rhythm-level	{ width: 20%; }
table.list.rhythm td.navi.rhythm-notes	{ width: 20%; }

table.list.rhythm th.difficulty			{ font-size: var(--font-size-s); }
table.list.rhythm th.songname			{ width: 32.5%; }
table.list.rhythm th.unitname			{ width: 13.5%; }
table.list.rhythm th.time				{ width: 9%; }
table.list.rhythm th.difficulty			{ width: (45% / 5); }
table.list.rhythm th.easy				{ background-color: var(--ea-bg); }
table.list.rhythm th.normal				{ background-color: var(--no-bg); }
table.list.rhythm th.hard				{ background-color: var(--ha-bg); }
table.list.rhythm th.expert				{ background-color: var(--ex-bg); }
table.list.rhythm th.master				{ background-color: var(--ma-bg); }
table.list.rhythm td.songname			{ padding-top: 0.3em; padding-bottom: 0.3em; }
table.list.rhythm td.easy				{ background-color: var(--ea-bg2); }
table.list.rhythm td.normal				{ background-color: var(--no-bg2); }
table.list.rhythm td.hard				{ background-color: var(--ha-bg2); }
table.list.rhythm td.expert				{ background-color: var(--ex-bg2); }
table.list.rhythm td.master				{ background-color: var(--ma-bg2); }

table.list.rhythm.navi td	 			{ border-style: none; }
table.list.rhythm.navi td	 			{ text-align: center; }

table.list.rhythm td.difficulty:hover 	{ background-color: var(--hover-hilight2); }
table.list.rhythm td.songname:hover 	{ background-color: var(--hover-hilight1); }
table.list.rhythm td.link:hover 		{ background-color: var(--hover-hilight1); }

a.rhythm	 							{ display: block; }
a.song	 								{ display: block; }

/* 楽曲・譜面/詳細 */
table.details.song 						{ margin-top: 1em; }

table.details.song th.songname			{ width: 16.6%; }
table.details.song th.difficulty		{ width: 16.6%; }

table.details.song th.easy				{ background-color: var(--ea-bg) }
table.details.song th.normal			{ background-color: var(--no-bg) }
table.details.song th.hard				{ background-color: var(--ha-bg) }
table.details.song th.expert			{ background-color: var(--ex-bg) }
table.details.song th.master			{ background-color: var(--ma-bg) }

table.details.song td.easy				{ background-color: var(--ea-bg2); }
table.details.song td.normal			{ background-color: var(--no-bg2); }
table.details.song td.hard				{ background-color: var(--ha-bg2); }
table.details.song td.expert			{ background-color: var(--ex-bg2); }
table.details.song td.master			{ background-color: var(--ma-bg2); }

table.details.song td.rhythm-image 		{ padding-top: 0.5em; padding-bottom: 0.5em; }
table.details.song td.rhythm-image:hover { background-color: #fff; }

a.details.rhythm-image:hover 			{ display: block; }

span.details.song.score
{
	display:		inline-block;
	width:			5em;
	text-align:		right;
}

span.live.livespac {
	display:		inline-block;
    border:			1px solid var(--border-color);
    padding:		0px 5px 0px 5px;
    border-radius:	5px;
	margin:			3px 3px 3px 3px;
}

span.live.livespac.songparts			{ background: #fee; }
span.live.livespac.focus				{ background: #fee; }
span.live.livespac.live-3d				{ background: #fee; }
span.live.livespac.live-2d				{ background: #fee; }

/*----- ユニット・アイドル -----*/
/* ユニット・アイドル/リスト */
table.list.idol							{ margin-top: 1em; }
table.list.idol th.unitname				{ width: 17%; }
table.list.idol th.idolname				{ width: 17%; }
table.list.idol th.birthplace			{ width: 12%; }
table.list.idol th.age					{ width: 8%; }
table.list.idol th.birthday				{ width: 13%; }
table.list.idol th.height				{ width: 10%; }
table.list.idol th.weight				{ width: 8%; }
table.list.idol th.bust					{ width: 5%; }
table.list.idol th.waist				{ width: 5%; }
table.list.idol th.hip					{ width: 5%; }
table.list.idol td						{ text-align: center; }

table.list.idol div.idolname			{ display: flex; }
table.list.idol span.color				{ }
table.list.idol span.idolname			{ flex-grow: 1; }

table.list.idol a.idol	 				{ display: block; }
table.list.idol a.fill					{ display: block; }
table.list.idol a.fill2 {
	position:					absolute;
	width:						100%;
	height:						100%;
	top:						0;
	left:						0;
	display:					flex;
	justify-content:			center;
	align-items:				center;
/*	background-color:			#fdd;	*/
}

/*td.list.idol.unitname:hover 			{ background-color: var(--hover-hilight1); }	*/
table.list.idol td.unitname:hover 		{ background-color: var(--hover-hilight1); }
table.list.idol td.idolname:hover 		{ background-color: var(--hover-hilight1); }

/* ユニット・アイドル/アイドル詳細 */
table.details.idol						{ margin-top: 1em; }
table.details.idol th.idol.color		{ width: 14.28%; }
table.details.idol th.idolname			{ width: 28.56%; }
table.details.idol th.phonetics			{ width: 28.56%; }
table.details.idol th.cv				{ width: 28.56%; }
table.details.idol td					{ text-align: center; }
table.details.idol td.hobby				{ text-align: left; padding-left: 0.5em; padding-right: 0.5em; }
table.details.idol td.ability			{ text-align: left; padding-left: 0.5em; padding-right: 0.5em; }
table.details.idol td.desc				{ text-align: left; padding-left: 0.5em; padding-right: 0.5em; }
table.list.produce td.obtain			{ text-align: left; }
table.list.support td.obtain			{ text-align: left; }
table.list.costume td.obtain			{ text-align: left; }

table.list.produce						{ margin-top: 0em; }
table.list.produce th.star				{ width: 10%; }
table.list.produce th.cardname			{ width: 36%; }
table.list.produce th.implement			{ width: 14%; }
table.list.produce th.obtain			{ width: 40%; }

/* ユニット・アイドル/詳細/プロデュース */
table.list.support						{ margin-top: 0em; }
table.list.support th.rarity			{ width: 10%; }
table.list.support th.cardname			{ width: 36%; }
table.list.support th.implement			{ width: 14%; }
table.list.support th.obtain			{ width: 40%; }

/* ユニット・アイドル/詳細/衣装 */
table.list.costume th.kind				{ width: 6%; }
table.list.costume th.costumename		{ width: 35%; }
table.list.costume th.implement			{ width: 10%; }
table.list.costume th.obtain			{ width: 49%; }
table.list.costume td					{ font-size: var(--font-size-sx); }

/* ユニット・ユニット/ユニット詳細 */
table.details.unit						{ margin-top: 1em; }
div.idolcolor							{ display: block; margin: 0px; padding: 0px; }
div.unitcolor							{ margin-top: 0.8em; margin-bottom: 0.8em; }
div.details.unit.unitcolor				{ display: block; padding-top: 15px; padding-bottom: 15px; }

/*
td.details.unit							{ text-align: center; }
td.details.unit.unitname				{ text-align: left; }
td.details.unit.kana					{ padding: 0px; }
*/

table.details.unit td,th				{ text-align: center; }
table.details.unit td.unitcolor			{ width: 12%; }
table.details.unit td.unitname			{ width: 88%; font-size: var(--font-size-ll); }
table.details.unit td.idol-col-1-2		{ width: (88% / 2); }
table.details.unit td.idol-col-2-2		{ width: (88% / 2); }
table.details.unit td.idol-col-1-3		{ width: (88% / 3); }
table.details.unit td.idol-col-2-3		{ width: (88% / 3); }
table.details.unit td.idol-col-3-3		{ width: (88% / 3); }
table.details.unit td.idol-col-1-4		{ width: (88% / 4); }
table.details.unit td.idol-col-2-4		{ width: (88% / 4); }
table.details.unit td.idol-col-3-4		{ width: (88% / 4); }
table.details.unit td.idol-col-4-4		{ width: (88% / 4); }
table.details.unit td.idol-col-1-5		{ width: (88% / 5); }
table.details.unit td.idol-col-2-5		{ width: (88% / 5); }
table.details.unit td.idol-col-3-5		{ width: (88% / 5); }
table.details.unit td.idol-col-4-5		{ width: (88% / 5); }
table.details.unit td.idol-col-5-5		{ width: (88% / 5); }

table.list.unit.song th.songname		{ width: 27%; }
table.list.unit.song th.unitname		{ width: 13%; }
table.list.unit.song th.lyricist		{ width: (60% / 3); }
table.list.unit.song th.composer		{ width: (60% / 3); }
table.list.unit.song th.arranger		{ width: (60% / 3); }

table.list.unit.song td {
	word-break:		keep-all;
	overflow-wrap:	break-word;
}

/*----- Ｐアイドル -----*/
th.status.vo							{ background-color: var(--vo-bg); }
th.status.da							{ background-color: var(--da-bg); }
th.status.vi							{ background-color: var(--vi-bg); }
th.status.me							{ background-color: var(--me-bg); }
td.status.vo							{ background-color: var(--vo-bg2); }
td.status.da							{ background-color: var(--da-bg2); }
td.status.vi							{ background-color: var(--vi-bg2); }
td.status.me							{ background-color: var(--me-bg2); }

/* Ｐアイドル/リスト */
table.list.pidol th.index				{ width: 5%; }
table.list.pidol th.star				{ width: 4%; }
table.list.pidol th.cardname			{ width: 40%; }
table.list.pidol th.idolname			{ width: 12%; } /* 56 */
table.list.pidol th.cardname			{ width: 47%; }
table.list.pidol th.unitname			{ width: 14%; } /* 44 */
table.list.pidol th.obtain				{ width: 16%; }
table.list.pidol th.implement			{ width: 14%; }
table.list.pidol th.status				{ width: 10.81%; }
table.list.pidol th.status.type			{ width: 8%; }
table.list.pidol th.description			{ width: 45.2%; }

table.details.pidol.summary				{ margin-top: 1em; }
table.details.pidol th.star				{ width: 10%; }
table.details.pidol th.cardname			{ width: 50%; }
table.details.pidol th.vocal			{ width: 8%; }
table.details.pidol th.dance			{ width: 8%; }
table.details.pidol th.visual			{ width: 8%; }
table.details.pidol th.mental			{ width: 8%; }
table.details.pidol th.cost				{ width: 8%; }
span.evolution							{ font-weight: bold; color: #000; display: block; }

/* Ｐアイドル/詳細 */
table.details.pidol.skill th.skillname				{ width: 25%; }
table.details.pidol.skill th.level					{ width: 5%; }
table.details.pidol.skill th.pp						{ width: 5%; }
table.details.pidol.skill th.description			{ width: 60%; }

table.details.pidol.potential.skill th.skillname	{ width: 25%; }
table.details.pidol.potential.skill th.level		{ width: 5%; }
table.details.pidol.potential.skill th.description	{ width: 70%; }

table.details.pidol.idolevent th.eventname			{ width: 28%; }
table.details.pidol.idolevent th.description		{ width: 72%; }

/*----- Ｓキャラ -----*/
/* Ｓキャラ/リスト */
table.list.schara th.index				{ width: 5%; }
table.list.schara th.rarity				{ width: 6%; }
table.list.schara th.idolname			{ width: 12%; }
table.list.schara th.cardname			{ width: 45%; }
table.list.schara th.unitname			{ width: 14%; }
table.list.schara th.obtain				{ width: 16%; }
table.list.schara th.implement			{ width: 14%; }

/* Ｓキャラ/詳細 */
table.details.schara.summary			{ margin-top: 1em; }
table.details.schara th.rarity			{ width: 8%; }
table.details.schara th.cardname		{ width: 52%; }
table.details.schara th.level			{ width: 15%; }
table.details.schara th.good-schedule	{ width: 25%; }
table.details.schara th.obtain			{ width: 75%; }
table.details.schara th.implement		{ width: 25%; }

table.details.schara.support.effect th.level		{ width: 5%; }
table.details.schara.support.effect th.effectname	{ width: 35%; }
table.details.schara.support.effect th.description	{ width: 60%; }

table.details.schara.support.skill th.skillname		{ width: 40%; }
table.details.schara.support.skill th.description	{ width: 60%; }

table.details.schara.support.event th.eventname		{ width: 28%; }
table.details.schara.support.event th.description	{ width: 72%; }

/*----- ストーリー -----*/
table.list.story						{ font-size: var(--font-size-s); }
table.list.story th.chapter				{ width: 8%;  }
table.list.story th.title				{ width: 30%; }
table.list.story td.title				{ width: 30%; }
table.list.story td.implement			{ width: 12%; }
table.list.story th.point				{ width: 12%; }
table.list.story th.summary				{ width: 50%; }
table.list.story td.summary				{ width: 50%; }
table.list.story td.point				{ text-align: right; padding-right: 1em; }

table.list.story td.summary				{ padding-left: 5px; }
table.list.story td.title				{ padding-left: 5px; }
table.list.story td.idols				{ padding-left: 5px; }
table.list.story td.title				{ background-color: #eee; }
table.list.story td.implement			{ background-color: #eee; }

table.list.story th.chapter.unit-1		{ background-color: var(--unit-1); color: black; }
table.list.story th.chapter.unit-2		{ background-color: var(--unit-2); color: white; }
table.list.story th.chapter.unit-3		{ background-color: var(--unit-3); color: black; }
table.list.story th.chapter.unit-4		{ background-color: var(--unit-4); color: black; }
table.list.story th.chapter.unit-5		{ background-color: var(--unit-5); color: white; }
table.list.story th.chapter.unit-6		{ background-color: var(--unit-6); color: white; }
table.list.story th.chapter.unit-7		{ background-color: var(--unit-7); color: white; }
table.list.story th.chapter.unit-8		{ background-color: var(--unit-8); color: white; }

table.list.story.idol					{ margin-top: 0em; }
table.list.story.idol td				{ text-align: left; }
table.list.story.idol td.implement		{ text-align: center; }
table.list.story.idol td.event.point	{ padding-right: 10px; }

table.list.story th.chapter.idol-1		{ background-color: var(--idol-1); }
table.list.story th.chapter.idol-2		{ background-color: var(--idol-2); color: white; }
table.list.story th.chapter.idol-3		{ background-color: var(--idol-3); }
table.list.story th.chapter.idol-4		{ background-color: var(--idol-4); }
table.list.story th.chapter.idol-5		{ background-color: var(--idol-5); color: white; }
table.list.story th.chapter.idol-6		{ background-color: var(--idol-6); color: white; }
table.list.story th.chapter.idol-7		{ background-color: var(--idol-7); color: white; }
table.list.story th.chapter.idol-8		{ background-color: var(--idol-8); }
table.list.story th.chapter.idol-9		{ background-color: var(--idol-9); color: white; }
table.list.story th.chapter.idol-10		{ background-color: var(--idol-10); color: white; }
table.list.story th.chapter.idol-11		{ background-color: var(--idol-11); }
table.list.story th.chapter.idol-12		{ background-color: var(--idol-12); }
table.list.story th.chapter.idol-13		{ background-color: var(--idol-13); }
table.list.story th.chapter.idol-14		{ background-color: var(--idol-14); }
table.list.story th.chapter.idol-15		{ background-color: var(--idol-15); }
table.list.story th.chapter.idol-16		{ background-color: var(--idol-16); }
table.list.story th.chapter.idol-17		{ background-color: var(--idol-17); color: white; }
table.list.story th.chapter.idol-18		{ background-color: var(--idol-18); }
table.list.story th.chapter.idol-19		{ background-color: var(--idol-19); }
table.list.story th.chapter.idol-20		{ background-color: var(--idol-20); }
table.list.story th.chapter.idol-21		{ background-color: var(--idol-21); color: white; }
table.list.story th.chapter.idol-22		{ background-color: var(--idol-22); color: white; }
table.list.story th.chapter.idol-23		{ background-color: var(--idol-23); }
table.list.story th.chapter.idol-24		{ background-color: var(--idol-24); }
table.list.story th.chapter.idol-25		{ background-color: var(--idol-25); color: white; }
table.list.story th.chapter.idol-26		{ background-color: var(--idol-26); color: white; }
table.list.story th.chapter.idol-27		{ background-color: var(--idol-27); }
table.list.story th.chapter.idol-28		{ background-color: var(--idol-28); }

/*----- ガシャ ----*/
/* ガシャ/リスト */
table.list.gasha th.id					{ width: 22%; }
table.list.gasha th.resource-id			{ width: 15%; }
table.list.gasha th.datetime			{ width: 25%; }
table.list.gasha th.gashakind			{ width: 32%; }
table.list.gasha th.gashaname			{ width: 43%; }

span.list.gasha.rate					{ display: none; }

table.list.gasha td.kind				{ font-weight: bold; }
table.list.gasha td.gashakind.produce	{ background-color: #eff; }
table.list.gasha td.gashakind.support	{ background-color: #fee; }
table.list.gasha td.gashaname.produce	{ background-color: #eff; }
table.list.gasha td.gashaname.support	{ background-color: #fee; }

/* ガシャ/詳細 */
table.details.gasha th.rarity			{ width: 9%; }
table.details.gasha th.name				{ width: 45%; }
table.details.gasha th.rate				{ width: 9%; }
table.details.gasha th.summary			{ width: 28%; }

table.details.gasha td.pickup			{ background-color: #efe; }

/*----- ミッション ----*/
/* ミッション/リスト */

table.list.mission th.seasonname		{ width: 45%; }
table.list.mission th.dates				{ width: 55%; }

/* ミッション・シーズン */
table.list.mission						{ margin-top: 0em; }

table.details.mission.season th.missonname		{ width: 88%; }
table.details.mission.season th.exp				{ width: 12%; }
table.details.mission.season th.filter			{ width: 12%; }
table.details.mission.season td.exp				{ padding-right: 1.2em; }

table.details.mission.reward th.rank			{ width: 6%; }
table.details.mission.reward th.rewarditem		{ width: 47.5%; }
table.details.mission.reward td.rank			{ text-align: center; }
table.details.mission td.details.mission.season	{ font-size: var(--font-size-s); }

/* 限定 */
table.details.limited.reward			{ width: 450px; }

/*----- ショップ ----*/
table.list.shop th.name					{ width: 64%; }
table.list.shop th.product				{ width: 64%; }
table.list.shop th.price				{ width: 36%; }

/* アイテム */
table.details.shop th.name				{ width: 34%; }
table.details.shop th.product			{ width: 50%; }
table.details.shop th.price				{ width: 16%; }

/* ジュエルショップ */
table.details.shop.jewel th.name		{ width: 40%; }
table.details.shop.jewel th.product		{ width: 20%; }
table.details.shop.jewel th.price		{ width: 20%; }
table.details.shop.jewel th.ratio		{ width: 20%; }

/* ログイン/シーズンパス */
/*table.details.shop.pass th.product	{ width: 50%; }*/
/*table.details.shop.pass th.price		{ width: 16%; }*/

table.details td.price					{ text-align: right; }
table.details td.price					{ padding-right: 0.5em; }
table.details td.ratio					{ text-align: center; }

div.price								{ display: flex; }
div.price span.amount					{ display: flex; padding-right: 1em; }
div.product								{ display: flex; }
span.amount								{ }
span.itemname							{ text-align: left; flex-grow: 1; }
span.price								{ text-align: left; flex-grow: 1; padding-left: 0.5em; }

span.paid.jewel {
	filter:		contrast(100%) sepia(0%) hue-rotate(210deg);
}

td.shop.price span.shop.itemname {
	margin-left:	0em;
}

div.implement {
	text-align:		center;
	color:			#22c;
	font-size:		14px;
	font-weight:	bold;
}

h3.shop {
	margin-bottom:	0.2em;
}

/*----- カード -----*/
table.list.card		{ width: 1800px; }

table.list.card th.cardname		{ width: 13%; }
table.list.card th.idolname		{ width: 7%; }
table.list.card th.skillid		{ width: 6%; }
table.list.card th.skillname	{ width: 16%; }
table.list.card th.level		{ width: 3%; }
table.list.card th.effectid		{ width: 5%; }
table.list.card th.effectname	{ width: 45%; }
table.list.card th.effectid		{ width: 5%; }

/* 無効化 */
.removed-cell							{ display: none; }
.invisible								{ display: none; }
tr.invisible-row						{ display: none; }

a.invalid:hover 						{ background-color: #fff; }
td.invalid:hover 						{ background-color: #fff; }
span.invalid:hover 						{ background-color: #fff; }

a.invalid
{
	pointer-events:		none;
	text-decoration:	none;
	color:				var(--color);
}

/*----- 交換所 -----*/
table.list.exchange						{ margin-top: 0.5em; }
table.details.exchange					{ margin-top: 0.5em; }

table.list.exchange th.name				{ width: 40%; }
table.list.exchange th.data				{ width: 60%; }

table.details.exchange th.product		{ width: 55%; }
table.details.exchange th.price			{ width: 35%; }
table.details.exchange th.limit			{ width: 10%; }
table.details.exchange td.limit			{ text-align: center; }

/*----- プロデュース -----*/
table.list.produce						{ margin-top: 0.5em; }

table.list.produce th.id				{ width: 10%; }
table.list.produce th.vocal				{ width: 8%; }
table.list.produce th.dance				{ width: 8%; }
table.list.produce th.visual			{ width: 8%; }
table.list.produce th.mental			{ width: 8%; }
table.list.produce th.skill.id			{ width: 8%; }
table.list.produce th.cost				{ width: 8%; }
table.list.produce th.usable-count		{ width: 8%; }
table.list.produce th.description		{ width: 34%; }


/*----- イベント -----*/
table.list.event.boxgasha				{  }

table.list.event.boxgasha th.box-number		{ width: 15%; }
table.list.event.boxgasha th.amount			{ width: 10%; }
table.list.event.boxgasha th.product		{ width: 75%; }
table.list.event.boxgasha td.box-number		{ text-align: center; }
table.list.event.boxgasha td.count			{ text-align: center; }

table.list.event.point-ranking th.rank		{ width: 20%; }
table.list.event.point-ranking th.product	{ width: 80%; }
table.list.event.point-ranking td.rank		{ text-align: center; }

table.list.event.score-ranking th.rank		{ width: 20%; }
table.list.event.score-ranking th.product	{ width: 80%; }
table.list.event.score-ranking td.rank		{ text-align: center; }

p.box-number	{
	font-size:		var(--font-size-l);
	font-weight:	bold;
	margin-bottom:	0.5em;
}

/* プロデュース */
/*table.list.produce					{ margin-top: 1em; }*/
table.list.produce th.unitname		{ width: 20%; }
table.list.produce th.chapter		{ width: 50%; }
table.list.produce th.difficulty	{ width: 10%; }
/*table.list.produce td.chapter		{ text-align: center; }*/

/*table.list.cards				{ margin-top: 1em; }*/
table.list.cards th.cardname	{ width: 30%; }
table.list.cards th.cost		{ width: 6%; }
table.list.cards th.effect		{ width: 64%; }

table.list.cards td.cost		{ text-align: center; }

table.list.cards div.effect-desc
{
	display:			flex;
	flex-direction:		row;
	align-items:		center;
}

table.list.cards div.appeal
{
	width:				1.5em;
	text-align:			center;
	margin-right:		0.5em;
}

table.list.cards span.appeal
{
	display:			block;
}

table.list.cards span.appeal
{
	font-size:			var(--font-size-l);
	font-weight:		900;
}

table.list.cards span.appeal.vo	{ color: #f0c; }
table.list.cards span.appeal.da	{ color: #44f; }
table.list.cards span.appeal.vi	{ color: #f60; }

table.list.cards div.effect
{
	flex-grow:			1;
}

table.list.cards span.effect
{
	display:			block;
}

/* 用語 */
div.term {
	background-color: #f4f4f4;
	width: 780px;
}

div.term.highlight {
	background-color: #dfd;
}

div.term.highlight div {
	background-color: #dfd;
}

h4.term {
	border-bottom:	1px solid #000;
	margin-top:		1em;
}

/*table.list.subseasons				{ margin-top: 1em; }*/
table.list.subseasons th.name		{ width: 18%; }
table.list.subseasons th.condition	{ width: 12%; }
table.list.subseasons th.details	{ width: 70%; }

table.list.subseasons td.name		{ text-align: center; }
table.list.subseasons td.condition	{ text-align: center; }
table.list.subseasons td.parameter	{ text-align: center; }

span.strong	{ font-weight: bold; }

.fill-inline {
	display: inline-block;
	width: 100%;
	height: 100%;
}

#popup {
	position: absolute;
	display: none;
	background: #fff;
	border: 1px solid #333;
	padding: 10px;
	z-index: 1000;
	box-shadow: 2px 2px 8px rgba(0,0,0,0.15);
}