@charset "UTF-8";


/*----------------------------------------------------
	TOP layout
----------------------------------------------------*/

div.Index {
  background: transparent url(../../images/common/bg.png) repeat top left;
  background-size: 100px auto;
}

div.Index div.top_container {
  width: auto;
  padding: 0 25px 20px 25px;
  position: relative;
}

div.Index p.key {
  width: auto;
  text-align: center;
}

div.Index p.read01 {
  width: 100px;
  position: absolute;
  top: 20%;
  right: 10px;
}

div.Index p.read02 {
  width: 100px;
  position: absolute;
  top: 22%;
  left: 10px;
}

div.Index p img {width: 100%;}



/*----------------------------------------------------
	Page layout
----------------------------------------------------*/

div.Page h2.page_title {
  width: auto;
  padding: 0 0 25px 0;
}

div.Page h2.page_title img {width: 100%;}


/*----------------------------------------------------
	Story layout
----------------------------------------------------*/

div.Story p.bgimg {
  width: auto;
  padding: 0 5px 25px 5px;
}

div.Story p.bgimg img {width: 100%;}



/*----------------------------------------------------
	Character layout
----------------------------------------------------*/

div.Character div.slid_wrapp {
  width: auto;
}

div.Character div.slid_wrapp div.slidBg ul.slides {
  width: auto;
}

div.Character div.slid_wrapp div.slidBg ul.slides li {
  width: auto;
  padding: 0 10px;
}

div.Character div.slid_wrapp div.slidBg ul.slides li img {
  width: 100%;
  height: auto;
}



div.Character div.slid_wrapp ul.slides-nav {
  width: auto;
  margin: 0;
  padding: 15px 0 0 0;
}

div.Character div.slid_wrapp ul.slides-nav li {
  width: auto;
  margin: 0;
  padding: 0 5px;
}

div.Character div.slid_wrapp ul.slides-nav li img {
  width: 100%;
  height: auto;
}





div.Character p.bgimg {
  width: auto;
  padding: 0 0 0 80%;
  position: absolute;
  top: 86px;
  right: 0;
}

div.Character p.bgimg img {width: 100%;}


/*----------------------------------------------------
	Staff layout
----------------------------------------------------*/

div.Staff div.container {
  width: auto;
}

div.Staff div.LA01 {
  padding: 0 0 15px 0;
}

div.Staff div.container h3 {
  width: auto;
  padding: 5px 0 5px 10px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  background-color: #FF8860;
}

div.Staff div.container ul {
  width: auto;
  padding: 15px 5px 0 5px;
}

div.Staff div.container ul li {
  width: 50%;
  padding: 0 0 15px 0;
  float: left;
}

div.Staff div.container ul li dl {
  width: auto;
  padding: 0 5px 0 15px;
}

div.Staff div.container ul li dl dt {
  width: auto;
  font-weight: bold;
  font-size: 14px;
}

div.Staff div.LA01 ul li dl dt {color: #4E68D1;}
div.Staff div.LA02 ul li dl dt {color: #339999;}

div.Staff div.container ul li dl dd {
  width: auto;
}

div.Staff p.bgimg {
  width: auto;
  padding: 0 10px;
}

div.Staff p.bgimg img {width: 100%;}



/*----------------------------------------------------
	Movie layout
----------------------------------------------------*/

div.Movie div.youtube_container {
  width: auto;
  padding: 0 10px;
}

div.Movie div.youtube_container p {
  width: auto;
  margin: 10px 0 0 0;
  padding: 4px 0;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  background-color: #FFCC33;
  border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
}


div.Movie div.youtube_container div.youtube_inner {
  position: relative;
  padding: 0 0 56.25% 0;
  height: 0;
}
 
div.Movie div.youtube_container div.youtube_inner iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


div.Movie div.moveList {
  width: auto;
  padding: 5px 0 0 0;
  overflow: hidden;
}

div.Movie div.moveList ul {
  width: auto;
  padding: 0 5px;
}

div.Movie div.moveList ul li {
  width: 50%;
  float: left;
  padding: 20px 0 0 0;
}

div.Movie div.moveList ul li a {
  width: auto;
  display: block;
  vertical-align: top;
}

div.Movie div.moveList ul li a:hover {
  filter:alpha(opacity=50);
  -moz-opacity:0.5;
  opacity:0.5;
}

div.Movie div.moveList ul li dl {
  width: auto;
  padding: 0 5px;
}

div.Movie div.moveList ul li dl dt {
  width: auto;
  margin: 0;
  padding: 0 2px 2px 2px;
  vertical-align: top;
  overflow: hidden;
  position: relative;

}

div.Movie div.moveList ul li.c1 dl dt {
  border: 1px #F06467 solid;
}

div.Movie div.moveList ul li.c2 dl dt {
  border: 1px #33CC99 solid;
}

div.Movie div.moveList ul li dl dt span {
  width: auto;
  display: block;
  margin: 0 auto;
  /*padding: 0 2px;*/
}

div.Movie div.moveList ul li dl dt span img {
  width: 100%;
  height: auto;
}

div.Movie div.moveList ul li dl dt em.playicon {
  width: 30px;
  height: 30px;
  display: block;
  position: absolute;
  top: 30%;
  left: 40%;
}

div.Movie div.moveList ul li dl dt em.playicon img {width: 100%;}

div.Movie div.moveList ul li dl dd {
  width: auto;
  margin: 10px 0 0 0;
  padding: 4px 0;
  font-size: 9px;
  color: #000;
  text-align: center;
  border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
}

div.Movie div.moveList ul li.c1 dl dd {
  background-color: #F06467;
}

div.Movie div.moveList ul li.c2 dl dd {
  background-color: #33CC99;
}


div.Movie p.bgimg {
  width: auto;
  padding: 10px 10px 0 10px;
}

div.Movie p.bgimg img {width: 100%;}




div.Movie div.main_container span.mv_img {
  width: auto;
  display: block;
  padding: 35px 10px 0 10px;
}

div.Movie div.main_container span.mv_img img {width: 100%;}

div.Movie div.main_container ul.mv_list {
  width: auto;
  padding: 15px 10px 35px 10px;
  overflow: hidden;
}

div.Movie div.main_container ul.mv_list li {
  width: auto;
  margin: 10px 0 0 0;
  padding: 7px 0;
  font-size: 11px;
  color: #000;
  text-align: center;
  border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
}

div.Movie div.main_container ul.mv_list li.m1 {
  background-color: #F06467;
}

div.Movie div.main_container ul.mv_list li.m2 {
  background-color: #33CC99;
}

div.Movie div.main_container ul.mv_list li a {
  color: #000;
}

div.Movie div.main_container ul.mv_list li a:hover {
  filter:alpha(opacity=50);
  -moz-opacity:0.5;
  opacity:0.5;
}