@charset "Shift_JIS";

.clearfix:after {
  content: ".";
  visibility: hidden;
  clear: both;
  display: block;
  height: 0;
}

.clearfix {
 zoom: 1;
 margin-bottom: 0;
}


/* HEADER */

#header {
  position: relative;
  width: 800px;
  background: url(../img/header/header.jpg) no-repeat;
  background-size: 800px;
}

#header ul {
  margin: 0;
  padding: 0;
}

#header li {
  margin: 0;
  padding: 0;
  list-style: none;
}

#header .nav {
  padding-top: 135px;
  width: 800px;
}

#header .nav > li {
  float: left;
  display: inline-block;
  position: relative;
}

#header .nav > li > a {
  display: block;
  background-image: url(../img/header/nav.png);
  background-repeat: no-repeat;
  background-size: 800px;
  height: 25px;
  font-size: 0;
}

#header .nav > li:hover > a,
#header .nav > li > a.crnt {
  background-image: url(../img/header/nav_over.png);
}

#header .nav > li.top > a {
  width: 77px;
  background-position: 0px top;
}

#header .nav > li.bd-dvd > a {
  width: 130px;
  background-position: -77px 0;
}

#header .nav > li.news > a {
  width: 83px;
  background-position: -207px 0;
}

#header .nav > li.cinema > a {
  width: 124px;
  background-position: -290px 0;
}

#header .nav > li.det > a {
  width: 88px;
  background-position: -414px 0;
}

#header .nav > li.download > a {
  width: 109px;
  background-position: -502px 0;
}

#header .nav > li.link > a {
  width: 83px;
  background-position: -611px 0;
}

#header .nav > li.banner > a {
  width: 106px;
  background-position: -694px 0;
}

#header .nav > li ul > li > a {
  display: block;
  font-size: 0;
}

#header .nav > li.news ul > li > a {
  background-image: url(../img/header/nav_news.png);
  background-repeat: no-repeat;
  background-size: 134px;
  width: 134px;
}

#header .nav > li.news:hover > ul > li:hover a,
#header .nav > li.news > ul > li a.crnt {
  background-image: url(../img/header/nav_news_over.png);
}

#header .nav > li.news ul > li.dvd > a {
  background-position: 0 0;
  height: 19px;
}

#header .nav > li.news ul > li.dvd-lateshow > a {
  background-position: 0 -19px;
  height: 19px;
}

#header .nav > li.news ul > li.ost > a {
  background-position: 0 -38px;
  height: 18px;
}

#header .nav > li.news ul > li.record > a {
  background-position: 0 -57px;
  height: 19px;
}

#header .nav > li.news ul > li.blog > a {
  background-position: 0 -76px;
  height: 19px;
}

#header .nav > li.news ul > li.info > a {
  background-position: 0 -95px;
  height: 18px;
}

#header .nav > li.news ul > li.latest-news > a {
  background-position: 0 -113px;
  height: 20px;
}

#header .nav > li.cinema ul > li > a {
  background-image: url(../img/header/nav_cinema.png);
  background-repeat: no-repeat;
  background-size: 134px;
  width: 134px;
}

#header .nav > li.cinema:hover ul > li:hover a,
#header .nav > li.cinema ul > li a.crnt {
  background-image: url(../img/header/nav_cinema_over.png);
}

#header .nav > li.cinema ul > li.cinema-goods > a {
  background-position: 0 0;
  height: 20px;
}

#header .nav > li.det ul > li > a {
  background-image: url(../img/header/nav_det.png);
  background-repeat: no-repeat;
  background-size: 134px;
  width: 134px;
}

#header .nav > li.det:hover > ul > li:hover a,
#header .nav > li.det > ul > li a.crnt {
  background-image: url(../img/header/nav_det_over.png);
}

#header .nav > li.det ul > li.highlight > a {
  background-position: 0 0;
  height: 19px;
}

#header .nav > li.det ul > li.chara > a {
  background-position: 0 -19px;
  height: 19px;
}

#header .nav > li.det ul > li.themesong > a {
  background-position: 0 -38px;
  height: 18px;
}

#header .nav > li.det ul > li.staff > a {
  background-position: 0 -57px;
  height: 19px;
}

#header .nav > li.det ul > li.exposition > a {
  background-position: 0 -76px;
  height: 19px;
}

#header .nav > li.det ul > li.story > a {
  background-position: 0 -95px;
  height: 18px;
}

#header .nav > li.det ul > li.introduction > a {
  background-position: 0 -113px;
  height: 20px;
}

#header .nav li ul {
  position: absolute;
  bottom: 25px;
}

#header .nav li.news ul {
  left: -26px;
}

#header .nav li.cinema ul {
  left: -5px;
}

#header .nav li.det ul {
  left: -24px;
}

#header .logo {
  position: absolute;
  top: 43px;
  left: 493px;
  margin: 0;
  padding: 0;
  width: 288px;
  height: 67px;
}

#header .logo a {
  display: block;
  width: 288px;
  height: 67px;
  font-size: 0;
}

/* FOOTER */
#footer {
  margin: 20px 0;
  border-top: 1px solid #c91901;
  width: 800px;
}

#footer .copyright {
  padding: 18px 0 0 0;
  width: 760px;
  text-align: right;
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Verdana,"MS PGothic",sans-serif;
  font-size: 10px;
}