@CHARSET "UTF-8" ;

/* cssのコメントアウトに「//」は使用不可！ */

html{

	scroll-behavior: smooth ;
	scroll-padding-top: 100px;/*スクロール先のずらし*/
	background-color: #FFFFFF ;
	color: #111111 ;

}

div.contents{

	max-width: 1000px ; /* 幅は最大XXXpxまでしか広げない */
	margin: 0 auto ; /* 左右中央(widthの指定が必須) */

}


div.footer{

	text-align: center ;/* 対象はテキストであり要素ではないのでmargin: 0 autoは使用不可 */

}


/*必須*/
table.menu{

	border: 0px ;
	width: 100% ;
	border-collapse: separate ;
	border-spacing: 5px ;

}

table.menu th, table.menu td{

	border: 0px black solid ;

}





h1{
	display: inline ; /* 改行させない ;*/
	font-size: 150% ;
	font-weight: bold ;
}




table.main{

	border: 3px black solid ;
	width: 100% ;
	/*min-width: 1000px ;*/
	border-collapse: collapse ;

}



table.main th, table.main td{

	border: 3px black solid ;
	padding: 5px ;

}



table.sub{

	border: 1px black solid ;
	width: 100% ;
	border-collapse: collapse ;

}



table.sub th, table.sub td{

	border: 1px black solid ;
	padding: 5px ;

}












tr:nth-child(odd).odd{
	background: #F5F5F5 ;
}












@keyframes highlight_green_blinking{
	0% {background-color:#FFDEAD;}
	50% {background-color:transparent;}
	100% {background-color:#FFDEAD;}
}

@keyframes highlight_green_fedeout{
	0%{background-color:#00FF00;}
	100%{background-color:transparent;}
}

@keyframes highlight_pink_fedeout{
	0%{background-color:#FF00FF;}
	100%{background-color:transparent;}
}

/*
<TR>のみ
全て id='ref_***' にすれば発火点(:target)が不要にできる氣がするが後の課題。
*/

tr[id^="t_"]:target{
/*
	animation: highlight_green 30s ease-in-out ;
*/
	animation: highlight_green_blinking 1.0s step-end infinite ;
}

tr[id^="ref_"]{
/*
	animation: highlight_green 30s ease-in-out ;
*/
	animation: highlight_green_blinking 1.0s step-end infinite ;
}





.tooltip, .tooltip_below{

	display: none ;
	background-color: #008000 ;
	font-size: 30px ;
	color: #FFFFFF ;
	font-weight: bold ;
	text-align: center ;
	padding: 10px ;
	margin-top: 10px ;
	border-radius: 0px ;
	position: absolute ;

}














.tooltip{

	margin-left: 0px ;

}

.tooltip_below{

	margin-left: 0px ;

}

.dropdown:hover{

	cursor: pointer ;

}

.dropdown:hover .tooltip,
.dropdown:hover .tooltip_below{

	display: block ;

}