/* デフォルト
--------------------------------------------------*/
html, body {
  width: 100%;
  height: 100%;
  color: #B2B8D9;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 11px;
  line-height: 160%;
  background-color: #000;
}

body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, p, img, ol, ul, li {
  margin: 0;
  padding: 0;
}

body {
  display: none;
}

img {
  vertical-align: bottom;
}

/* リンク
--------------------------------------------------*/
a:hover, a:active {
  border: none;
  outline: none;
}

a:focus, *:focus {
  outline: none;
}

/* レイアウト
--------------------------------------------------*/
.wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 900px;
  background-image: url(../image/top_back.jpg);
  background-repeat: no-repeat;
  background-position: center top;
}

.enter {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  text-align: center;
}

.logo {
  width: 60%;
  margin: 0 auto 50px;
}

.logo img {
  width: 100%;
  max-width: 300px;
  height: auto;
}

/* 選択ボタン
--------------------------------------------------*/
.select {
  width: 80%;
  max-width: 775px;
  margin: auto;
  text-align: center;
  font-size: 0;
  list-style: none;
}

.select li {
  display: inline-block;
  margin: 0 15px 20px;
}

.select li img {
  width: 100%;
  height: auto;
}

/* 注意事項
--------------------------------------------------*/
.notice {
  width: 85%;
  max-width: 620px;
  margin: 30px auto 0;
  text-align: center;
  font-size: 0;
  list-style: none;
}

.notice li {
  display: inline-block;
  margin: 0 5px 10px;
  vertical-align: middle;
}

.text1 {
  font-size: 11px;
  text-align: left;
}

/* コピーライト
--------------------------------------------------*/
.copyright {
  margin: 40px auto 0;
  text-align: center;
}

@media screen and (min-width: 775px) {

/* リンク
--------------------------------------------------*/
.opacity {
  display: block;
  -webkit-transition: opacity .3s ease-out;
  transition: opacity .3s ease-out;
  transform: perspective(0);
}

.opacity:hover {
  opacity: .6;
}

/* テキスト
--------------------------------------------------*/
.br::before {
  content: "\A";
  white-space: pre;
}

/* レイアウト
--------------------------------------------------*/
.wrapper {
  min-height: 800px;
}
}