html,body
{
	height: 99%;
	font-family: sans-serif;
	margin-left:0px;
	margin-right:0px;
}

table {
	border-collapse: collapse;
	border: 0px green solid;  /* 太さNpxで緑色の実線 */
}
th,td {
	border: 0px green solid;  /* 太さNpxで緑色の実線 */
	padding: 0px;
	text-align: center;	
}



.btn-square {
	display: inline-block;
	padding: 4px;
	text-decoration: none;
	background: #F8FF66;/*ボタン色*/
	color: #000;
	border: solid 2px #000000;
	border-radius: 3px;
	margin:4px 0px 4px 0px;
}



select
{
  /* styling */
  background-color: #FFFFEA;
  border: thin solid blue;
  border-radius: 4px;
  display: inline-block;
  font: inherit;
  line-height: 1.0em;
  padding: 0.5em 3.5em 0.5em 1em;

  /* reset */
  margin: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
}
select.classic
{
  background-image:
    linear-gradient(45deg, transparent 50%, blue 50%),
    linear-gradient(135deg, blue 50%, transparent 50%),
    linear-gradient(to right, skyblue, skyblue);
  background-position:
    calc(100% - 20px) calc(1em + 2px),
    calc(100% - 15px) calc(1em + 2px),
    100% 0;
  background-size:
    5px 5px,
    5px 5px,
    2.5em 2.5em;
  background-repeat: no-repeat;
}
input[type='button']
{
	display: inline-block;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	padding: 6px 12px 6px 12px;
	text-decoration: none;
	background: #F8FF66;/*ボタン色*/
	color: #000;
	border: solid 2px #000000;
	border-radius: 3px;
	margin:8px 4px 8px 4px;
}
input[type='submit']
{
	display: inline-block;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	padding: 6px 12px 6px 12px;
	text-decoration: none;
	background: #F8FF66;/*ボタン色*/
	color: #000;
	border: solid 2px #000000;
	border-radius: 3px;
	margin:8px 4px 8px 4px;
}

input[type='text']
{
	display: inline-block;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	border: solid 1px #000000;
	border-radius: 1px;
	background-color: #FFFFEA;
	padding: 6px 10px 6px 10px;
	margin: 6px 0px 6px 6px;
	text-align:left;
	color: black;
	font-weight:normal;
	font-size:20px;
}
input[type='password']
{
	display: inline-block;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	border: solid 1px #000000;
	border-radius: 1px;
	background-color: #FFFFEA;
	padding: 6px 10px 6px 10px;
	margin: 6px 0px 6px 6px;
	text-align:left;
	color: black;
	font-weight:normal;
	font-size:20px;
}



.ECM_RadioInput {
  padding: 0px 0px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.ECM_RadioInput-Input {
  opacity: 0;
  width: 0;
  margin: 0;
}
.ECM_RadioInput-Input:checked + .ECM_RadioInput-DummyInput {
  border: solid 2px #333333;
}
.ECM_RadioInput-Input:checked + .ECM_RadioInput-DummyInput::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #333333;
}
.ECM_RadioInput-DummyInput {
  position: relative;
  top: 4;
  left: 0;
  display: block;
  width: 24px;
  height: 24px;
  border-radius: 50%;
	background-color: #FFFFEA;
  border: solid 2px #888;
}
.ECM_RadioInput-LabelText {
  margin-left: 4px;
  display: block;
  font-size: 18px;
  font-weight: bold;
}



.selectbox {
    width:90%;
    margin:0.4em auto;
  position:relative;
}
select{
	display: inline-block;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	width:100%;
	padding: 8px 10px 8px 10px;
	margin: 6px 6px 6px 6px;
	box-sizing:border-box;
	border:#000 1px solid;
	border-radius:1px;
	background-color: #FFFFEA;
	text-align:left;
	color: black;
	font-weight:normal;
	font-size:20px;
}
.selectbox::after{
  content:"";
  display:block;
  width:10px;
  height:10px;
  position:absolute;
  right:5%;
  top:35%;
  border-bottom:#333 2px solid;
  border-right:#333 2px solid;
  transform:rotate(45deg)translateY(-30%);
}
.color.selectbox select{
  background:blue;
  color:#fff;
  border-radius:2em;
}
.color.selectbox::after{
  border-bottom:#fff 5px solid;
  border-right:#fff 5px solid;
}


input[type=radio] {
	display: none; /* ラジオボタンを非表示にする */
}
input[type="radio"]:checked + label {
	background: #31A9EE;/* マウス選択時の背景色を指定する */
	color: #ffffff; /* マウス選択時のフォント色を指定する */
}
.label {
	font-size:20px;
	display: block; /* ブロックレベル要素化する */ 
	float: left; /* 要素の左寄せ・回り込を指定する */ 
	margin: 5px; /* ボックス外側の余白を指定する */
	width: 80px; /* ボックスの横幅を指定する */
	height: 35px; /* ボックスの高さを指定する */
	color: #888888; /* フォントの色を指定 */
	text-align: center; /* テキストのセンタリングを指定する */
	line-height: 35px; /* 行の高さを指定する */
	cursor: pointer; /* マウスカーソルの形（リンクカーソル）を指定する */
	border: 1px solid #444444;/* ボックスの境界線を実線で指定する */
	border-radius: 5px; /* 角丸を指定する */
}

