/* Google Noto Sans Japanese の埋め込み
-----------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
body {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
	color: rgb(90, 90, 90);

	padding-top: env(safe-area-inset-top, 20px);
	padding-right: env(safe-area-inset-right, 20px);
	padding-bottom: (safe-area-inset-bottom, 20px);
	padding-left: (safe-area-inset-left, 20px);

}
html {
	
  /* touch-action: manipulation; */
	touch-action: none;
	
	/* background-color: rgb(208, 238, 179); */
	background-color: rgb(240, 240, 240);

/* 
	padding-top: env(safe-area-inset-top);
	padding-left: calc(env(safe-area-inset-left));

	top: env(safe-area-inset-top); */
}

canvas {
	display: block; /* デフォルトの余白を防止 */
}

button {	/* タップした時の青い四角を消す */
	-webkit-tap-highlight-color:rgba(0,0,0,0);
  cursor:pointer;
}
.scroll-stop {
	overflow: hidden;
}
input {
	border: none;
	outline: none;
	text-align: right;
	background-color: transparent;
	color: #000;
}

header.fixed-header {
	position: fixed; /* ヘッダーを固定する */
	top: 0; /* 画面の上部に固定 */
	left: 0;
	right: 0;
	width: auto; /* 画面の幅いっぱいに広げる */
	background-color: rgb(240, 240, 240); /* 背景色を設定 */
  /* color: white; */ /* テキストの色を設定 */
	box-sizing: border-box;
	padding: 8px; /* 内側の余白を設定 */
	z-index: 1000; /* ヘッダーを他の要素の上に表示 */
	box-shadow: 0 2px 0 rgba(0, 0, 0, 0.1); /* 下方向に影を追加 */
}

body.fixed-header {
  margin-top: 130px; /* ヘッダーの高さ分だけ下げる */
}

body {
	padding-top: env(safe-area-inset-top);
	padding-left: calc(env(safe-area-inset-left) + .2em);

}


/* SCORE画面のテーブル */
table.ret {
	border-collapse: collapse;
	/* font-size: 1.0em; */
}
table.ret th.tb_top-left, table.ret td.tb_top-left {
	border-top:    3px solid rgb(80, 80, 80);
	border-left:   3px solid rgb(80, 80, 80);
}
table.ret th.tb_top, table.ret td.tb_top {
	border-top:    3px solid rgb(80, 80, 80);
}
table.ret th.tb_top-right, table.ret td.tb_top-right {
	border-top:    3px solid rgb(80, 80, 80);
	border-right:  3px solid rgb(80, 80, 80);
}
table.ret th.tb_right, table.ret td.tb_right {
	border-right:  3px solid rgb(80, 80, 80);
}
table.ret th.tb_left, table.ret td.tb_left {
	border-left:   3px solid rgb(80, 80, 80);
}
table.ret th.tb_bot-left, table.ret td.tb_bot-left {
	border-bottom: 3px solid rgb(80, 80, 80);
	border-left:   3px solid rgb(80, 80, 80);
}
table.ret th.tb_bot, table.ret td.tb_bot {
	border-bottom: 3px solid rgb(80, 80, 80);
}
table.ret th.tb_bot-right, table.ret td.tb_bot-right {
	border-bottom: 3px solid rgb(80, 80, 80);
	border-right:  3px solid rgb(80, 80, 80);
}
table.ret th, table.ret td {
	border: solid 1px black;
}
table.ret th {
	font-size: 0.6em;
	text-align: center;
	background-color: rgb(220, 220, 220);
}
table.ret td {
	font-size: 0.8em;
	text-align: center;
	background-color: white;
}

/* Release Note のリスト */
ul.rn-title {
	padding-left: 8px;
}
li.rn-title {
	list-style: none;
	padding-left: 0px;
	border-bottom: 1px solid #c2c2c2c4;
	/* display: inline-block; */
}
a.version {
	font-weight: bold;
	font-size: 1.0em;
}
a.date {
	font-size: 0.8em;
}
ul.rn-text {
	padding-left: 24px;
	padding-right: 8px;
	padding-bottom: 16px;
	font-size: 0.8em;
}


/* Release Note のリスト */
ul.ret li {
	padding-left: 8px;
	font-size: 0.7em;
	border-bottom: 1px solid #000;
	display: inline-block;
	padding-right: 100px;
}
ul.ret ul {
	padding-left: 8px;
	padding-right: 16px;
	padding-bottom: 4px;
}
strong.ret {
	font-size: 0.8em;
}
a.ret {
	font-size: 0.6em;
}