@charset "utf-8";

/*  ==========================================

    SP 

    ==========================================  */

*{
	margin:0;
	padding:0;
}
body {
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	background:url(../../../lib/images/common/bg.png),linear-gradient(#FD376F 20%, #FE9D15 80%);
	background:url(../../../lib/images/common/bg.png),-moz-linear-gradient(#FD376F 20%, #FE9D15 80%);
	background:url(../../../lib/images/common/bg.png),-webkit-linear-gradient(#FD376F 20%, #FE9D15 80%);
}
.fixed {
	width: 100%;
	height: 100%;
}
img{
	vertical-align:bottom;
}
ul,li {
	margin:0;
	padding:0;
	list-style-type:none;
}

#footer{
	text-align:center;
	padding:30px 0;
	background: url(../images/common/bg_footer.png) no-repeat top;
}

/*second*/
#main #header{
	position:fixed;
	top:0;
	width:750px;
	height:80px;
	background:#F20079;
	z-index:2000;
}
#main #header .headContent{
	position:relative;
}
#main #header h1{
	position:absolute;
	top:5px;
	left:5px;
	z-index:2050;
}
#main #contentArea{
	margin-top:100px;
}
/* hamburger*/
#toggle,
#toggle span {
	transition: all .4s;
	box-sizing: border-box;
}
#toggle {
	position: absolute;
	width: 81px;
	height: 92px;
	top:0;
	right:0;
	z-index:2050;
	background:url(../images/common/bg_menu.png) no-repeat;
}
#toggle span {
	position: absolute;
	right:10px;
	width: 45px;
	height: 6px;
	background-color:#FD376F;
}
#toggle span:nth-of-type(1) {
	top: 25px;
}
#toggle span:nth-of-type(2) {
	top: 41px;
}
#toggle span:nth-of-type(3) {
	top: 57px;
}
#toggle.active span:nth-of-type(1) {
	-webkit-transform: translateY(15px) rotate(-315deg);
	transform: translateY(15px) rotate(-315deg);
}
#toggle.active span:nth-of-type(2) {
	opacity: 0;
}
#toggle.active span:nth-of-type(3) {
	-webkit-transform: translateY(-17px) rotate(315deg);
	transform: translateY(-17px) rotate(315deg);
}
#headMenu ul {
	position:absolute;
	top:80px;
}
#headMenu ul li{
	display:none;
}
#overLay {
	display: none;
	width: 100%;
	height:100%;
	text-align: center;
	position: fixed;
	top: 0;
	background:url(../../../lib/images/common/bg.png),#FFF;
	background-attachment:scroll;
	z-index:1500;
}
#footer .btnArea{
	position:relative;
	width: 644px;
	height: 626px;
	margin:0 auto 30px;
}
#footer .btnArea li {
	position:absolute;
}
#footer .btnArea .news {
	top:0;
	left:110px;
}
#footer .btnArea .info {
	top:0;
	left:327px;
}
#footer .btnArea .csg {
	top:418px;
	left:110px;
}
#footer .btnArea .character {
	top:209px;
	left:0;
}
#footer .btnArea .movie {
	top:418px;
	left:327px;
}
#footer .btnArea .theater {
	top:209px;
	left:434px;
}
#footer .btnArea .coming {
	top:209px;
	left:217px;
}

/*news*/
#news #divRss {
	padding-bottom:18px;
}
#news #divRss .updates {
	padding-top:20px;
}
#news #divRss .updates li {
	width:643px;
	margin:0 auto 20px;
	background:url("../images/news/bg_news_ttl.png") center bottom no-repeat;
}
#news #divRss .updates li p{
	padding:2px 0 30px 55px;
}
#news #divRss .updates li span{
	display:block;
	color:#E95098;
	font-size:12px;
	font-weight:normal;
}
#news #divRss .updates li a{
	font-size:20px;
	font-weight:bold;
	color:#E95098;
	text-decoration:none;
}



/* ニュース
-----------------------------------------------------------*/
#main.news .secondRepeat{
	position: relative;
	width: 690px;
  margin: 0 auto;
	background: url(../images/news/bg_pattern.jpg) repeat-y;
	margin-bottom: 82px;
}
#main.news .secondRepeat:after {
	content: "";
	position: absolute;
	background: url(../images/news/bg_bottom.png) no-repeat;
	width: 100%;
	height: 66px;
	bottom: -66px;
}
#main.news #divRss {
	padding-bottom:30px;
}
#main.news #divRss .updates li{
	width: 616px;
	margin:0 auto;
	background:url(../images/news/bg_news_line.png) center bottom no-repeat;
}
#main.news #divRss .updates li p{
	background:url(../images/news/bg_news_icon.png) left 27px no-repeat;
	padding: 15px 0 25px 45px;
}
#main.news #divRss .updates li span{
	display:block;
	color:#E95098;
	font-size:12px;
	font-weight:normal;
}
#main.news #divRss .updates li a{
	font-size:20px;
	font-weight:bold;
	color:#E95098;
}



/*ムービー
-----------------------------------------------------------*/
#main.movie .secondRepeat{
	position: relative;
	width: 690px;
  margin: 0 auto;
	background: url(../images/movie/bg_pattern.jpg) repeat-y;
	margin-bottom: 102px;
}
#main.movie .secondRepeat:after {
	content: "";
	position: absolute;
	background: url(../images/movie/bg_bottom.png) no-repeat;
	width: 100%;
	height: 50px;
	bottom: -50px;
}
#main.movie #divRss{
	background: url(../images/movie/bg_frame.jpg) no-repeat;
}
#main.movie .secondRepeat #divRss .movieArea{
	width: 588px;
	margin: 0 auto;
	text-align: center;
	padding-bottom: 40px;
}
#main.movie .secondRepeat #divRss .title {
	margin-bottom: 30px;
}
#main.movie .secondRepeat #divRss .movieArea .youtube {
	padding: 10px;
	background-color:#FFFFFF;
	background: url(../images/movie/bg_youtube.png) no-repeat;
}
#main.movie .secondRepeat #divRss .movieArea .youtube iframe {
	width: 568px;
	height: 319px;
}
#main.movie .secondRepeat #divRss .movieArea .youtube {
	clear: both;
}

#main.movie .secondRepeat .seriesArea .imgText {
	margin:10px 0;
}

/* シリーズ */
.seriesWrapper {
  width: 690px;
	margin: 15px auto 0;
	background: url(../images/movie/bg_series_btm.png) no-repeat center bottom;
	padding-bottom: 23px;
}
.seriesWrapper .secondRepeat{

}
.seriesWrap{
	 width: 690px;
	background: url(../images/movie/bg_series_top.png) no-repeat center top;
}
.seriesWrap{
	margin:0 auto;
}
.seriesArea{
	width: 294px;
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
}
.seriesArea:nth-child(2n+1){
	padding-left: 41px;
}
.seriesArea:nth-child(2n){
	margin-right: 0;
}
.seriesWrap:after{
	content:" ";
	display:block;
	clear:both;
}
.seriesArea .youtube{
	width: 280px;
	height: 163px;
	background: url(../images/movie/bg_youtube_series.jpg) no-repeat;
	padding: 8px;
	margin-top: 3px;
}
.seriesArea .youtube iframe{
	width: 278px;
	height: 154px;
}




/* info
-----------------------------------------------------------*/
/* 背景 */
#main.info .centerWrap{
	height: 233px;
}
#main.info .secondRepeat{
	position: relative;
	width: 690px;
  margin: 0 auto;
	background: url(../images/info/bg_frame.png) no-repeat;
	margin-bottom: 82px;
	height: 2292px;
}
#main.info .secondRepeat:after {
	content: "";
	position: absolute;
	background: url(../images/info/bg_frame_bottom.png) no-repeat;
	width: 100%;
	height: 46px;
	bottom: -46px;
}
#main.info .secondRepeat .title {
	position: absolute;
	left: 35px;
}
#main.info .secondRepeat .explanation {
	position: absolute;
	top:540px;
	left: 35px;
}


/* 共通
-----------------------------------------------------------*/
.centerWrap{
	text-align: center;
}