@charset "UTF-8";
  body {
        margin: 20px;
        font-size: 14px;
  }
  table {
        border: solid 1px #84b2e0;
        border-collapse: collapse;
  }
  th {
        text-align: center;
        color: white;
        background: linear-gradient(#829ebc, #225588);
        box-shadow: 0px 1px 1px rgba(255, 255, 255, 0.3) inset;
        padding: 4px 10px;
  }
  td {
        padding: 4px 10px;
        border: solid 1px #84b2e0
  }
  button {
        width: 90px;
        margin: 10px 4px;
        padding: 4px;
  }
  .red {
        color:red;
  }
  #nav {
        list-style: none;
        display: flex;
        padding: 0px;
  }
  
  #nav li {
        margin-right: 10px;
  }
  
  .va {
  vertical-align: middle;
  }
  
  /* information message */
  .info_msg {
	  margin-bottom: 0.75em; /*下余白*/
	  padding: 0.75em 1em; /*文字余白*/
	  width: 50%; /*幅*/
	  color: blue; /*文字色*/
	  background-color: #dfefff; /*背景色*/
	  border: 1px solid #379bff; /*線の太さ・色*/
	  border-radius: 8px; /*角の丸み*/
  }
  
  /* warning message */
	  .warn_msg {
	  margin-bottom: 0.75em; /*下余白*/
	  padding: 0.75em 1em; /*文字余白*/
	  width: 50%; /*幅*/
	  color: #bd3e00; /*文字色*/
	  background-color: #ffffc6; /*背景色*/
	  border: 1px solid #ff8040; /*線の太さ・色*/
	  border-radius: 8px; /*角の丸み*/
  }
  
  /* error message */
  .err_msg {
	  margin-bottom: 0.75em; /*下余白*/
	  padding: 0.75em 1em; /*文字余白*/
	  width: 50%; /*幅*/
	  color: red; /*文字色*/
	  background-color: #ffe6e6; /*背景色*/
	  border: 1px solid #ff8080; /*線の太さ・色*/
	  border-radius: 8px; /*角の丸み*/
  }
