#content_bg{
  background-image:url(../images/steam/bg.jpg);
}

#submenu{
  display:none !important;
}

#submenu nav>*{
  width:33%;
}

.memo{
  font-style:oblique;
  font-size:80%;
  color:#555;
}
.memo:before{
  content:"▲作業用メモ："
}
a.dummy:before{
  content:"仮";
  font-weight:bold;
  color:rgba(255,255,255,0.7);
  font-size:100px;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  text-shadow:none;
  z-index:1;
}
/*-------*/
#content_area{

}

#content_area>*{
  display: block;
  max-width:900px;
  margin:5% auto;
  width:90%;
}

#header_img{
  max-width:100%;
  margin:0;
  width:100%;
}

#content_area>#submenu{
  width:100%;
  max-width: inherit;
  margin-top:0;
}

/*----特徴----*/
.info{
  background-color:rgba(255,255,255,0.7);
  border:1px #FFF solid;
  padding:2%;
  box-shadow:0 0 3px rgba(0,0,0,0.5);
}

#update_info{
  text-align: left;
  /*margin-top:-7%;
  width:57%;*/
}
#product_info{
  text-align: center;
  margin-top:6%;
  margin-bottom:5%;
  width:100%;

  font-size:100%;
  display: block;
}
#update_info ol{
  margin:0;
  padding:0;
  margin-left:1.5em;
}

#feature{
  margin-top:2%;
}
#feature h3{
  margin:0;
  padding:0;
  margin:7% 0 1%;
  text-align: left;
  font-size:150%;
}
#feature h3:first-child{
  margin-top:0;
}

#feature h3.new:after{
  content:"NEW";
  display: inline-block;
  padding:0px 10px 0;
  background-color: rgba(255,255,255,0.8);
  border:1px #F00 solid;
  color:#F00;
  font-size:60%;
  vertical-align:3px;
  margin-left:3px;
}
#feature .feature_body b{
  font-weight:bold;
}

.feature_img{
  width:97%;
  margin:1.5% auto;
  display: block;
}
.screenshot{
  margin-top:2%;
}
.screenshot img{
  display:inline-block;
  width:100%;
  margin:0.5%;
}


#spec table{
  border-collapse: collapse;
  margin-top:2%;
  width:100%;
}
#spec table th,#spec table td{
  border:1px #AAA solid;
  padding:1.5% 1%;
  text-align:left;
  font-weight: normal;
  font-size:90%;
  text-shadow:none;
  background-color:rgba(255, 255, 255, 0.3);
}
#spec table th{
  background-color:rgba(154, 151, 141, 0.5);
  color:#453f2c;
}

#spec table tr:first-child th{
  width:25%;
  text-align: center;
}
#spec table tr th:first-child{
  width:25%;
}
#spec table td{text-align:center;}

#spec table td ul{
  margin:0;
  padding:0;
  margin-left:1.8em;
  margin-bottom:1%;
}

ul#attention{
  margin:0;
  padding:0;
  margin:2% auto 5%;
  list-style-type: none;
}
ul#attention li{
  font-size:70%;
  text-indent:-1em;
  margin-left:1.8em;
}

#product_info table{
  border-collapse: collapse;
  width:95%;
  margin:0 auto;
}
#product_info table th,
#product_info table td{
  padding:1% 2%;
  border:1px #999 dotted;
  border-width:0 0 1px;
  text-align:left;
  font-size:100%;
}
#product_info table th{width:7em;}

#product_info table tr:last-child th,
#product_info table tr:last-child td{
  border-width:0;
}
#product_info a,
#product_info span{
  display:inline-block;
  background-color:#3671c9;
  border:1px #2462be solid;
  width:45%;
  margin:0.5% 2%;
  text-align:center;
  padding:2%;
  color:#FFF;
  text-shadow: none;
  text-decoration: none;
  border-radius:4px;
}
#product_info span{
  background-color:#8d9fbb;
  border:1px #8d9fbb solid;
  color:#6d7e90;
}
.feature_body a.btn_detail{
  text-shadow:none;
  color:#FFF;
  text-decoration:none;
  text-align:center;
  background-color:#2f648a;
  background:linear-gradient(to bottom,#2f648a,#1c4a6b);

  display:block;
  width:80%;
  max-width:400px;
  margin:3% auto;
  padding:1.5%;
  line-height:1.2;
}

/*----DLC---*/

h3 .price{
  display: inline-block;
  padding:1px 10px;
  color:#FFF;
  font-size:60%;
  vertical-align:3px;
  text-shadow:none;
  border-radius:4px;
  margin-left:5px;
}

h3 .free{background-color:#096ea6;}
h3 .charge{background-color:#e65a1e;}

b.releaseday{
  display: block;
  margin-bottom:2%;
}


.info-update{
  border:1px #900 solid;
  padding:1em;
}
.info-update b{font-size:110%;display:block;margin-bottom:0.5em;}
.info-update b:before{
  content:attr(rel);
  display:inline-block;
  margin-right:0.5em;
  font-size:80%;
  color:#FFF;
  background-color:#900;
  padding:0.2em 1em;
  text-shadow: none;
  vertical-align:1px;
  border-radius:5px;
}
.info-update img{
  width:47%;
  margin:1em 1% 0;
}


@media screen and (max-width:640px){
  #product_info a{
    width:90%;
  }
}
