:root{										/* rootはグローバル変数という意味。https://jajaaan.co.jp/web-production/frontend/css-variables/		*/
	--base-font-size:			medium;		/* xx-small x-small small medium large x-large xx-large xxx-large									*/
	--base-kaigyouhaba:			160%;
	--base-font-color:			#cccccc;
	--base-haikei:				#262522;
	--base-haikei-table:		#262522;	/* #302e2b;	*/
	--base-link-font-color:		yellow;
}

/************************************************************************************************************************/

canvas{
	max-width:			1200px;				/* 拡大縮小。heightを省略すると同比率にしてくれる				*/
	width:				100%;				/* 実画面は1200×900と考えて計算すれば良く、cssは拡大縮小を担当	*/
	background-color:	black;
	border:				none;
	margin:				0px 0px 0px 0px;	/* [上][右][下][左] */
	padding:			0px 0px 0px 0px;
}

/************************************************************************************************************************/

.ss:link{	 color:var(--base-link-font-color); text-decoration:none;	   font-weight:normal; }			/* 未訪問のリンク																	*/
.ss:visited{ color:var(--base-link-font-color); text-decoration:none;	   font-weight:normal; }			/* 訪問済みのリンク																	*/
.ss:hover{	 color:red;							text-decoration:underline; font-weight:bold;   }			/* カーソル直上																		*/
.ss:active{	 color:red;							text-decoration:none;	   font-weight:bold;   }			/* 押した瞬間																		*/

div{
	margin:					0px 0px 0px 0px;		/* [上][右][下][左]		*/
	padding:				0px 0px 0px 0px;
	background-color:		var(--base-haikei);
	&.is-Right{			text-align:	right;		}
	&.is-Hidden{			display:none;		}
	&.is-Flexbox{
		display:			flex;					/* Flexbox(Flexible Box Layout Module)指定して、子要素を横並びにする								*/
		gap:				10px;					/* 子要素間の間隔																					*/
		flex-wrap:			wrap;					/* 子アイテムが並ぶ隙間がないと改行する。これを指定しないと全子アイテムを縮小して一行に押し込む		*/
		justify-content:	left;					/* 子アイテムの位置。センタリング																	*/
		height:				100vh;					/* DIVの高さ=画面の高さと同一にする。こうしないと画面下が余って白くなる								*/
		background-color:	var(--base-haikei);
	}
}

ul   {	border:0px skyblue dashed;	list-style-position:outside;	margin:0px 0px 0px 1em;		padding:0px 0px 0px 0px;	}		/* 箇条書き														*/
ul li{																margin:0px 0px 0px 0.5em;	padding:0px 0px 0px 0px;	}		/* １文字 = 1em		デフォルトで一文字分下げられている模様		*/
ol   {	border:0px skyblue dashed;	list-style-position:outside;	margin:0px 0px 0px 1em;		padding:0px 0px 0px 0px;	}		/* ナンバリング													*/
ol li{																margin:0px 0px 0px 0em;		padding:0px 0px 0px 0px;	}

b{
	color:white;
}

/************************************************************************************************************************/

html{
	color:				var(--base-font-color);			/* 文字の色																			*/
	font-size:			var(--base-font-size);			/* 文字の大きさ																		*/
	line-height:		var(--base-kaigyouhaba);		/* 改行幅																			*/
	letter-spacing:		normal;							/* 文字間隔 normal 1px 0.1em														*/
	word-spacing:		normal;							/* 単語間隔																			*/
	font-weight:		normal;							/* 文字の太さ normal bold lighter													*/
	font-style:			normal;							/* スタイル	  標準（normal）イタリック体（italic）斜体（oblique）					*/
														/* font-family:		"Arial","メイリオ","sans-serif"; フォント指定しないほうが綺麗	*/
}

body{
	margin:				0px 0px 0px 0px;				/* [上][右][下][左]		*/
	padding:			0px 0px 0px 0px;
	background-color:	var(--base-haikei);
}

table{
	border-collapse:	collapse;						/* collapse:セル同士の間に間隔を空けない separate:間隔をあけて表示する（枠線非表示でも間隔があく	*/
	border:				none;
	margin:				0px 0px 0px 0px;				/* [上][右][下][左]		*/
	padding:			0px 0px 0px 0px;
	max-width:			600px;
	width:				100%;
	height:				16px;
	background-color:	var(--base-haikei);
	tr,td{
		margin:				0px 0px 0px 0px;			/* [上][右][下][左]		*/
		padding:			0px 0px 0px 0px;
	}
}

h1{	
	color:			yellow;
	font-size:		2.5rem;				/* 文字サイズ　親要素の２倍					*/
	line-height:	1.0;				/* 改行幅　　　フォントサイズの1.5倍		*/
	font-weight:	bold;				/* 文字の太さ　normal bold lighter			*/
	text-align:		center;
	margin:			0px 0px 0px 0px;	/* [上][右][下][左]							*/
	padding:		0px 0px 0px 0px;
}

h2{	
	color:			yellow;
	font-size:		1.2rem;				/* 文字サイズ　親要素の２倍					*/
	line-height:	1.0;				/* 改行幅　　　フォントサイズの1.5倍		*/
	font-weight:	bold;				/* 文字の太さ　normal bold lighter			*/
	text-align:		center;
	margin:			0px 0px 0px 0px;	/* [上][右][下][左]							*/
	padding:		0px 0px 0px 0px;
}

img{
	width:			auto;
	height:			auto;
	border:			none;
	margin:			0px 0px 0px 0px;			/* [上][右][下][左] */
	padding:		0px 0px 0px 0px;
}