@charset "utf-8";

body {
  background-color: #191919;
  color: #FFF;
  font-size: 12px;
  line-height: 14px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#wrapper {
  width: 760px;
  margin:0px auto;
  background-color: #000;
  color: #FFF;
}
.container {
  border-top-width: 3px;
  border-top-style: solid;
  border-top-color: #C90;
}

#login {
  overflow:hidden;
}
#login .halfbox {
  float: left;
  background-image: url(https://www.yaminabe.net/img/top_bg.jpg);
  background-repeat: no-repeat;
  height: 500px;
  width:50%;
  text-align:center;
}
#login .halfbox h1 {
  margin:10px;
}
#login .halfbox dl {
  padding:10px 20px;
  display: block;
  margin-bottom: 10px;
  text-align:left;
}
#login .halfbox dt {
  display: block;
  font-size: 16px;
  line-height: 20px;
  font-weight: bold;
  color: #FC0;
}
#login .halfbox dd ul {
  display: block;
  list-style-position: inside;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 0px;
  padding-left: 10px;
}
#login .halfbox dd ul li{
  display: block;
  background-image: url(https://www.yaminabe.net/img/icon_dot.gif);
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 15px;
  margin-bottom: 5px;
}
#login .halfbox dd ol li {
  display: block;
  margin-bottom: 12px;
}
#login .halfbox dd p {
  font-size: 10px;
  line-height: 13px;
  padding-right: 10px;
  padding-left: 10px;
  padding-top: 1px;
  padding-bottom: 1px;
}
.red {
  color:#F00;
}
#login li a {
  height: 53px;
  width: 340px;
  display: block;
  background-image: url(https://www.yaminabe.net/img/enter_btn.gif);
  background-repeat: no-repeat;
  text-indent: -9999px;
  overflow:hidden;
}
#login li.enter a:link {background-position: 0px 0px;}
#login li.enter a:hover {background-position: 0px -53px;}
#login li.exit a:link {background-position: -340px 0px;}
#login li.exit a:hover {background-position: -340px -53px;}
#info {
  overflow:hidden;;
}
.half {
  display: block;
  width: 380px;
  padding: 20px;
  float: left;
}
#info .half dt {
  margin-bottom: 10px;
}
#info .half dt em {
  text-align: center;
  display: block;
  font-size: 16px;
  line-height: 20px;
  font-weight: bold;
  color: #F06;
}
#info .half dd p {
  margin-bottom: 14px;
}

#footer {
  text-align: center;
  padding:20px 0px;
}
@media screen and (max-width:760px){
  body {
    background-color: #000;
  }
  #wrapper {
    max-width: 380px;
    min-width:300px;
    width:auto;
  }
  #login .halfbox, .half {
    clear:left;
    width:100%;
    height:auto;
    padding:10px:
  }
  #login .halfbox dl {
  padding:10px;
  }
  #login .halfbox dt {
    text-align:center;
  }
  #login ol {
    text-align:center;
  }
  #login li a {
    display:inline-block;
    width:300px;
    height:47px;
    background-image: url(https://www.yaminabe.net/img/enter_btn.gif);
    background-repeat: no-repeat;
    text-indent: -9999px;
    background-size:200% auto;
    overflow:hidden;
  }
  #login li.enter a:link {background-position: 0px 0px;}
  #login li.exit a:link {background-position: 100% 0px;}
}