/*
.{
  background: url(img/_c.png);
  background-size: 100%;
  float: left;
  width: %;
  margin-left: %;
  margin-top: %;
  box-shadow: 10px 15px 15px -5px #555;
}
. img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
. img:hover {
  opacity: 0;
}
*/

body{
  max-width: 1500px;
  min-width: 100px;
  margin-left: 20%;
  margin-right: 22%;
  background-color: #eef;
}

.yushisasaki{
  font-family: sans-serif;
  font-size: 11px;
  font-weight: bold;
  position: fixed;
  left: 20px;
}
.yushisasaki a{
  text-decoration: none;
  color: black;
}

.kanji{
  background: url(img/kanji_c.png);
  background-size: 100%;
  float: left;
  width: 55%;
  margin-left: 5%;
  margin-top: 20%;
  box-shadow: 10px 15px 15px -5px #555;
}
.kanji img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.kanji img:hover {
  opacity: 0;
}

.observer{
  background: url(img/observer_c.png);
  background-size: 100%;
  float: left;
  width: 50%;
  margin-left: 5%;
  margin-top: 50%;
  box-shadow: 10px 15px 15px -5px #555;
}
.observer img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.observer img:hover {
  opacity: 0;
}

.typo{
  background: url(img/typo_c.png);
  background-size: 100%;
  float: left;
  width: 45%;
  margin-left: 0;
  margin-top: 15%;
  box-shadow: 10px 15px 15px -5px #555;
}
.typo img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.typo img:hover {
  opacity: 0;
}

.sunkei{
  background: url(img/sunkei_c.png);
  background-size: 100%;
  float: left;
  width: 45%;
  margin-left: 3%;
  margin-top: 17%;
  box-shadow: 10px 15px 15px -5px #555;
}
.sunkei img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.sunkei img:hover {
  opacity: 0;
}

.ghost{
  background: url(img/ghost_c.png);
  background-size: 100%;
  float: left;
  width: 30%;
  margin-left: 10%;
  margin-top: 30%;
  box-shadow: 10px 15px 15px -5px #555;
}
.ghost img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.ghost img:hover {
  opacity: 0;
}

.zine{
  background: url(img/zine_c.png);
  background-size: 100%;
  float: left;
  width: 45%;
  margin-left: 8%;
  margin-top: 5%;
  box-shadow: 10px 15px 15px -5px #555;
}
.zine img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.zine img:hover {
  opacity: 0;
}

.shibuya{
  background: url(img/1031_c.png);
  background-size: 100%;
  float: left;
  width: 50%;
  margin-left: 2%;
  margin-top: 12%;
  box-shadow: 10px 15px 15px -5px #555;
}
.shibuya img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.shibuya img:hover {
  opacity: 0;
}

.sea{
  background: url(img/sea_c.png);
  background-size: 100%;
  float: left;
  width: 40%;
  margin-left: 5%;
  margin-top: 5%;
  box-shadow: 10px 15px 15px -5px #555;
}
.sea img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.sea img:hover {
  opacity: 0;
}

.dish{
  background: url(img/dish_c.png);
  background-size: 100%;
  float: left;
  width: 70%;
  margin-left: 5%;
  margin-top: 5%;
  box-shadow: 10px 15px 15px -5px #555;
}
.dish img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.dish img:hover {
  opacity: 0;
}

.chair{
  background: url(img/chair_c.png);
  background-size: 100%;
  float: left;
  width: 45%;
  margin-left: 5%;
  margin-top: 10%;
  box-shadow: 10px 15px 15px -5px #555;
}
.chair img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.chair img:hover {
  opacity: 0;
}

.dataportrait{
  background: url(img/dataportrait_c.png);
  background-size: 100%;
  float: left;
  width: 55%;
  margin-left: 15%;
  margin-top: 10%;
  margin-bottom: 10%;
  box-shadow: 10px 15px 15px -5px #555;
}
.dataportrait img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.dataportrait img:hover {
  opacity: 0;
}

.cinemascore{
  background: url(img/cinemascore_c.png);
  background-size: 100%;
  float: left;
  width: 90%;
  margin-left: 10%;
  margin-top: 7%;
  box-shadow: 10px 15px 15px -5px #555;
}
.cinemascore img{
  width: 100%;
  transition: all 0.3s ease;
  vertical-align: bottom;
}
.cinemascore img:hover {
  opacity: 0;
}
