/* common styles for all pages */
/* Reset margin and padding */
* {
  margin: 0;
  padding: 0; }

/* padding of form elements */
input[type="text"], input[type="password"], input[type="number"] {
  padding: 2px; }

textarea {
  padding: 2px;
  margin: 1px; }

input[type="button"], input[type="submit"], input[type="reset"], button {
  padding: 2px 6px; }

select {
  padding: 1px; }

option {
  padding: 0 5px 0 3px; }

/* General */
.small {
  font-size: small;
  line-height: 1.5; }

.smaller {
  font-size: smaller; }

.medium {
  font-size: medium;
  line-height: 1.5; }

.bold {
  font-weight: bold; }

.center {
  text-align: center; }

.right {
  text-align: right; }

.justify {
  text-align: justify; }

.nowrap {
  white-space: nowrap; }

/* Link */
a:visited {
  color: violet; }

a:link {
  color: blue; }

a:hover {
  color: blue; }

a:active {
  color: blue; }

a > img {
  border: none; }

/* Heads */
h1, h2, h3, h4, h5, h6, h7 {
  font-weight: bold; }

/* Table */
table {
  border-collapse: collapse; }

/* Layout */
table.layout {
  border: none; }
  table.layout > tbody > tr > td {
    vertical-align: top;
    border: none; }

/* Standards */
table.std {
  margin: 0.75em 0; }
  table.std tr td, table.std tr th {
    border: 1px solid #888;
    padding: 0.25em 0.5em; }
  table.std tr th {
    background: #DED; }

ul.std {
  list-style-position: outside;
  margin: 0.75em 0 0.75em 1.5em; }
  ul.std > li {
    margin: 0.25em 0; }

ol.std {
  list-style-position: outside;
  margin: 0.75em 0 0.75em 2em; }
  ol.std > li {
    margin: 0.25em 0; }

dl.std {
  margin: 0.75em 0; }
  dl.std > dt {
    margin: 0.5em 0 0.25em 0; }
  dl.std > dd {
    margin: 0.25em 0 0.5em 2em; }

/* Body */
body {
  font-family: "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;
  font-weight: 500;
  background: #EEE; }

/* Layout */
#wrapper {
  min-width: 320px;
  max-width: 1240px;
  margin: 0 auto 15px;
  background: white;
  border-style: solid;
  border-color: #888;
  border-width: 0 1px 1px;
  box-shadow: 0 0 15px #888; }

#header {
  padding: 1em; }

#menu {
  padding: 1em; }

#footer {
  padding: 1em; }

main {
  display: block;
  padding: 1em;
  font-size: medium;
  line-height: 1.5;
  min-height: 10em; }

/* Header part */
#header h1 {
  margin: 0.25rem 0 1.5rem;
  font-size: xx-large;
  line-height: 1; }

@media screen and (max-width: 1240px) {
  body {
    background: white; }
  #wrapper {
    border: none;
    box-shadow: none; } }

@media screen and (max-width: 480px) {
  #header {
    padding: 0.25rem 0.5rem; }
    #header h1 {
      margin: 0px 0 8px; }
  main {
    padding: 0.5rem; } }