* { box-sizing: border-box; }
/* 全要素の境界線位置を要素内側に統一．
width，height で外寸を揃え易くなる． */

div#CALC {
	width: 16em;
	margin: 1em auto;
	padding: 1em;
	border: solid 3px gray;
	background-color: ivory;
}
div#DISPLAY {
	width: 13em;
	margin: 0 auto 1em auto;
	padding: 0.5em;
	border: solid 3px gray;
	text-align: right;
}
table#KEYBOARD {
	width: 13em;
	margin: 0 auto;
	table-layout: fixed;
	border-collapse: collapse;
	!border: solid 3px gray;
	border: none;
}
#KEYBOARD td {
	padding: 0.5ex;
	border: none;
}
#KEYBOARD button {
	width: 100%;
	height: 2em;
}
button.number {		/* 数字キー */
	background-color: lightgray;
	color: black;
}
button.symbol {		/* 演算子キー */
	background-color: lightsteelblue;
	color: black;
}
button.clear {		/* 取消キー */
	background-color: tomato;
	color: white;
}
summary {
	font-weight: bold;
	font-size: large;
	margin: 0;
	padding: 0.5ex;
}
caption {
	font-weight: bold;
	font-size: large;
}