@charset "utf-8";

body {
  font-family: sans-serif, system-ui;
}

#logo {
  display: flex;
  justify-content: center;
  align-items: end;
  height: 12em;
}

#logo>img {
  height: 10em;
}

#contents {
  width: 65%;
  margin: 2em auto;
  border: 0.1em #4b3e47 solid;
  border-radius: 8px;
  padding: 2em;
  text-align: center;
  color: #4b3e47;
}

#title {
  font-size: 2.5em;
  font-weight: bold;
  color: black;
}

#header {
  margin: 1em;
  color: black;
}

#noJS {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 6em;
  text-align: center;
  font-weight: normal;
  font-size: 2em;
  color: #ff0000;
}

#language {
  margin: 3em;
  text-align: center;
}

#language>input {
  width: 8em;
  height: 2.5em;
  margin: 0em -0.2em;
  border: none;
}

#language>input:first-of-type {
  border-radius: 20px 0px 0px 20px;
}

#language>input:last-of-type {
  border-radius: 0px 20px 20px 0px;
}

#language>.active {
  color: #eff5fa;
  background-color: #0460aa;
}

#language>.active:hover {
  font-weight: normal;
  cursor: pointer;
}

#language>.inactive {
  color: #0460aa;
  background-color: #eff5fa;
}

#language>.inactive:hover {
  font-weight: bold;
  cursor: pointer;
}

#info {
  width: 65%;
  margin: 3em auto;
  text-align: center;
  font-size: 1.0em;
  font-weight: normal;
  color: #000000;
  line-height: 1.7em;
}

#info.hidden {
  display: none;
}

.important {
  color: #ff0000;
}

#infoTitle {
  padding: 0.6em 0em;
  font-size: 1.2em;
  font-weight: bold;
}

#tos>.tos_title,
#tos>.tos_text {
  margin: 1em 0em;
}

#tos>.tos_title {
  font-size: 1.2em;
  font-weight: bold;
}

#tos>.tos_text {
  font-size: 1.0em;
  font-weight: normal;
}

#contents>.accept {
  width: 13em;
  margin: 0em auto;
  border: 0.1em #4b3e47 solid;
  border-radius: 8px;
  padding: 0.8em;
  text-align: center;
  color: #4b3e47;
}

#contents>.accept>label {
  font-size: 1.0em;
  font-weight: bold;
  cursor: pointer;
}

#contents>.accept>label>input {
  transform: scale(1.5);
  margin: 0.3em;
  cursor: pointer;
}

#contents>.dlButton {
  margin: 1.3em 0em;
  border: none;
  border-radius: 8px;
  padding: 0.7em 2.5em;
  text-align: center;
  font-size: 1.2em;
  font-weight: bold;
  color: #ffffff;
}

#contents>.active {
  background-color: #6fa24a;
}

#contents>.active:hover {
  background-color: #54802f;
  cursor: pointer;
}

#contents>.inactive {
  background-color: #cccccc;
}

#contents>.inactive:hover {
  background-color: #cccccc;
  cursor: not-allowed;
}

#contacts {
  padding: 0em;
}

#contacts>a>img {
  display: inline;
  height: 2.3em;
}

#link {
  width: 65%;
  margin: 2em auto;
  border: 0.1em #4b3e47 solid;
  border-radius: 8px;
  padding: 2em;
  text-align: center;
  color: #4b3e47;
}

#link>div {
}

#link>div>a>img {
  display: inline;
  border: solid 1px #000000;
  border-radius: 15px;
  margin: 1em;
}