@charset "utf-8";

body {
	min-width: 1230px;
	overflow: hidden;
	background-color: #fee483;
}

a,
a:link,
a:visited{
	color: #000;
	text-decoration: underline;
}
a:hover{
	text-decoration: none;
}

/*-----------------------------------------------------------------コンテンツ*/
/*---------------------------------------------------------------------------*/

div#wrapper{
	min-width: 1230px;
	background-image: url(/common/img/bg.jpg);
	background-position: center top;
	background-repeat: no-repeat;
}

section{
	position: relative;
}

/*-------------------------------------------------------------------ヘッダー*/
/*---------------------------------------------------------------------------*/


header p.sp-keyvisual{
	display: none;
}

#keyvisual{
	min-width: 1240px;
	background-image: url(/common/img/keyvisual.png);
	background-position: center 0;
	background-repeat: no-repeat;
}
header#header{
	position: relative;
	width: 1240px;
	height: 506px;
	margin: 0 auto;
}

header #logo{
	z-index: 20;
	position: absolute;
	left: 469px;
	top: 108px;
}

header p.dengeki{
	position: absolute;
	z-index: 55;
	top: 10px;
	left: 30px;
}

header p.catch{
	position: absolute;
	left: 892px;
	top: 129px;
	z-index: 3;
	animation-delay: 1.3s;
	animation-duration: 0.8s;
}

header p.regist{
	position: absolute;
	left: 1031px;
	top: 292px;
	z-index: 3;
}

/* グローバルナビ */

header div#gnav{
	position: absolute;
	z-index: 10;
	width: 1240px;
	height: 69px;
	left: 0;
	bottom: 0;
	background-image: url(/common/img/gnav-bg.png);
}

header div#gnav ul{
	position: absolute;
	width: 962px;
	height: 65px;
	left: 133px;
	top: 2px;
	background-image: url(/common/img/gnav.png);
}

header div#gnav ul li{
	float: left;
	width: 100%;
	height: 65px;
}

header div#gnav ul li img{
	display: none;
}

header div#gnav ul li a{
	display: block;
	width: 100%;
	height: 65px;
}

header div#gnav ul li.news{
	width: 160px;
}

header div#gnav ul li.about{
	width: 160px;
}

header div#gnav ul li.character{
	width: 160px;
}

header div#gnav ul li.game{
	width: 161px;
}

header div#gnav ul li.goods{
	width: 161px;
}

header div#gnav ul li.special{
	width: 160px;
}

header div#gnav ul li.news a:hover,
#news header div#gnav ul li.news a{
	background-image: url(/common/img/gnav-o.png);
	background-position: left top;
}

header div#gnav ul li.about a:hover,
#about header div#gnav ul li.about a{
	background-image: url(/common/img/gnav-o.png);
	background-position: -160px top;
}

header div#gnav ul li.character a:hover,
#character header div#gnav ul li.character a{
	background-image: url(/common/img/gnav-o.png);
	background-position: -320px top;
}

header div#gnav ul li.game a:hover,
#game header div#gnav ul li.game a{
	background-image: url(/common/img/gnav-o.png);
	background-position: -480px top;
}

header div#gnav ul li.goods a:hover,
#goods header div#gnav ul li.goods a{
	background-image: url(/common/img/gnav-o.png);
	background-position: -641px top;
}

header div#gnav ul li.special a:hover,
#special header div#gnav ul li.special a{
	background-image: url(/common/img/gnav-o.png);
	background-position: -802px top;
}

a#top{
	display: block;
	width: 100%;
	height: 187px;
}

/*-------------------------------------------------------------階層下ヘッダー*/
/*---------------------------------------------------------------------------*/

#news #keyvisual,
#about #keyvisual,
#character #keyvisual,
#game #keyvisual,
#goods #keyvisual,
#special #keyvisual,
#event #keyvisual{
	min-width: 1240px;
	background-image: url(/common/img/subdirectory/keyvisual.png);
	background-position: center 0;
	background-repeat: no-repeat;
	
}

#news header#header,
#about header#header,
#character header#header,
#game header#header,
#goods header#header,
#special header#header,
#event header#header{
	height: 256px;
}

#news header #logo,
#about header #logo,
#character header #logo,
#game header #logo,
#goods header #logo,
#special header #logo,
#event header #logo{
	position: absolute;
	left: 525px;
	top: 3px;
}

#news header p.regist,
#about header p.regist,
#character header p.regist,
#game header p.regist,
#goods header p.regist,
#special header p.regist
#event header p.regist{
	top: -6px;
}

/*-----------------------------------------------------------------コンテンツ*/
/*---------------------------------------------------------------------------*/

#contents{
	position: relative;
	z-index: 25;
	width: 1230px;
	margin: 0 auto;
	background-image: url(/common/img/contents-bg.png);
}

#main{
	width: 1230px;
	padding-bottom: 30px;
	padding-top: 25px;
	background-repeat: repeat-x;
}

#main article{
	float: left;
	width: 762px;
	padding-left: 49px;
}

h2.title-dengeki{
	height: 34px;
	background-image: url(/common/img/title-dengeki.jpg);
	background-size: cover;
}

/*-----------------------------------------------------------------サイドバー*/
/*---------------------------------------------------------------------------*/

#main aside{
	position: relative;
	float: right;
	width: 320px;
	padding-right: 50px;
}

#main aside p.pop{
	position: absolute;
	z-index: 1;
	top: -75px;
	left: 249px;
}

#main aside div.bnr{
	line-height: 0;
}


#main aside div.friends{
	line-height: 0;
}

#main aside div.yoyaku{
	margin-bottom: 10px;
	line-height: 0;
}

#main aside p.bnr{
	line-height: 0;
	margin-bottom: 10px;
}

/* アプリへのリンク */

#main article div.app-link{
	display: none;
}

#main div.app-link{
	position: relative;
	max-width: 320px;
	margin-bottom: 10px;
	padding: 20px 10px;
	box-sizing: border-box;
	background-image: url(/common/img/aside/waku2.png) ,url(/common/img/aside/waku1.png) , url(/common/img/aside/bg2.png) ,url(/common/img/aside/bg1.png);
	background-repeat: no-repeat;
	background-position: center bottom , center top , center bottom , center top;
	text-align: center;
}

#main div.app-link img{
	max-width: 100%;
}

#main div.app-link p.ti{
	top: 20px;
	left: 8px;
}

#main div.app-link .wrap{
	position: relative;
}

#main div.app-link .wrap .ti3{
	display: none;
	position: absolute;
	text-align: center;
    top: -14px;
    left: 46px;
}

#main div.app-link ul{
	background-color: #fff;
	border: 3px solid #ed9e00;
	margin: 20px;
	padding: 20px 20px 20px;
}

#main div.app-link ul li{
	display: inline-block;
	font-size: 14px;
	font-weight: 700;
}

#main div.app-link ul li a{
	color: #000;
}

#main div.app-link ul li.sp{
	display: none;
}

#main div.app-link ul li::after{
	content: ' /';
}

#main div.app-link div.btn-app{
}

#main div.app-link p.ti2{
}

#main div.app-link div.btn-line{
}

/* SNSボタン */

#main div.sns-btn{
	height: 21px;
	margin-bottom: 11px;
}

#main div.sns-btn div.twit{
	float: left;
	width: 120px;
}

#main div.sns-btn div.fb{
	float: left;
	width: 120px;
}

/* タイムライン */

#main aside div.twitter{
	margin-bottom: 10px;
	padding: 9px 10px;
	background-image: url(/common/img/aside/twitter-bg.jpg);
	height: 304px;
	width: 300px;
}

#main aside div.twitter iframe{
	width: 300px;
	height: 259px;
}

#main aside div.twitter div.head{
	position: relative;
	height: 43px;
}

#main aside div.twitter div.head p.follow{
	position: absolute;
	width: 122px;
	height: 32px;
	top: 7px;
	left: 167px;
}

#main aside div.twitter div.head p.follow a{
	display: block;
	width: 122px;
	height: 32px;
	background-image: url(/common/img/aside/follow.png);
}

#main aside div.twitter div.head p.follow a:hover{
	background-image: url(/common/img/aside/follow-o.png);
}

ul.sp-social,
ul.sp-sns{
	display: none;
}


/* 4コマSP */
.sp-bnr-4cell{
	display: none;
}

/*-------------------------------------------------------------フッターライン*/
/*---------------------------------------------------------------------------*/

#footer-line{
	min-width: 1230px;
	height: 1px;
}


#footer{
	height: 100px;
	min-width: 1230px;
	background-color: #321108;
	background-image: url(/common/img/footer-bg.jpg);
	background-position: center top;
	background-repeat: no-repeat;
}

#footer p.copy{
	font-size: 120%;
	color: #fff;
	text-align: center;
	padding-top: 10px;
}

/*-----------------------------------------------------------------背景アニメ*/
/*---------------------------------------------------------------------------*/

div#bg{
	min-height: 800px;
	background-image: url(/common/img/kirakira.png);
	/* -webkit-animation: kira 40s linear infinite;
	-moz-animation: kira 40s linear infinite;
	animation: kira 40s linear infinite; */
}



@-webkit-keyframes kira {
	0% {
		background-position:0 0;
	}
	100% {
		background-position:-994px 3415px;
	}
}

@-moz-keyframes kira {
	0% {
		background-position:0 0;
	}
	100% {
		background-position:-994px 3415px;
	}
}

/*-----------------------------------------------------------------------------------------------------------------------------------スマホ用記述*/
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:640px) and (min-width: 1px){

/*-------------------------------------------------------------スマホヘッダー*/
/*---------------------------------------------------------------------------*/

	/* 背景アニメ削除 */
	div#wrapper div#bg{
		background: none;
	}
	
	body,
	div#wrapper{
		min-width: 0;
	}
	
	/* 電撃ロゴ位置修正 */
	div#wrapper header p.dengeki{
		top: 5px;
		left: 5px;
	}
	div#wrapper header p.dengeki img{
		width: 130px;
	}

	/* キービジュアル配置 */
	header p.sp-keyvisual{
		display: block;
		line-height: 0;
	}
	header p.sp-keyvisual img{
		width: 100%;
	}
	
	a#top{
		display: none;
	}
	
	/* ヘッダー幅 */
	#news header#header,
	#about header#header,
	#character header#header,
	#game header#header,
	#goods header#header,
	#special header#header,
	#event header#header,
	header#header{
		width: 100%;
		height: auto;
	}
	
	/* 階層キービジュ */
	#news #keyvisual, #about #keyvisual, #character #keyvisual, #game #keyvisual, #goods #keyvisual, #special #keyvisual, #event #keyvisual{
		min-width: 0;
		background: none;
	}
	
	/* グローバルナビ */
	
	#news header div#gnav,
	#about header div#gnav,
	#character header div#gnav,
	#game header div#gnav,
	#goods header div#gnav,
	#special header div#gnav,
	#event header div#gnav,
	header div#gnav{
		position: relative;
		width: auto;
		height: auto;
	}
	
	#news header div#gnav ul,
	#about header div#gnav ul,
	#character header div#gnav ul,
	#game header div#gnav ul,
	#goods header div#gnav ul,
	#special header div#gnav ul,
	#event header div#gnav ul,
	header div#gnav ul{
		position: static;
		width: auto;
		height: auto;
		background: none;
	}
	
	#wrapper header div#gnav ul li.news,
	#wrapper header div#gnav ul li.game{
		width: 34.6875%;
		height: auto;
		line-height: 0;
	}
	
	#wrapper header div#gnav ul li.about,
	#wrapper header div#gnav ul li.goods{
		width: 30.9375%;
		height: auto;
		line-height: 0;
	}
	
	#wrapper header div#gnav ul li.character,
	#wrapper header div#gnav ul li.special{
		width: 34.375%;
		height: auto;
		line-height: 0;
	}
	
	
	#news header div#gnav ul li a,
	#about header div#gnav ul li a,
	#character header div#gnav ul li a,
	#game header div#gnav ul li a,
	#goods header div#gnav ul li a,
	#special header div#gnav ul li a,
	#event header div#gnav ul li a,
	header div#gnav ul li a{
		height: auto;
	}
	
	#news header div#gnav ul li img,
	#about header div#gnav ul li img,
	#character header div#gnav ul li img,
	#game header div#gnav ul li img,
	#goods header div#gnav ul li img,
	#special header div#gnav ul li img,
	#event header div#gnav ul li img,
	header div#gnav ul li img{
		display: block;
		width: 100%;
	}

/*-----------------------------------------------------------------コンテンツ*/
/*---------------------------------------------------------------------------*/

	div#contents{
		width: auto;
	}
	
	div#main{
		width: auto;
		padding: 20px 20px 0;
	}
	
	div#contents article{
		width: auto;
		padding: 0;
		float: none;
		margin-bottom: 20px;
	}
	
	div#contents aside{
		width: auto;
		padding: 0;
		float: none;
		margin-bottom: 20px;
	}
	
	header #logo{
		display: none;
	}
	
	/* app-link */
	
	div#main div.app-link{
		display: block;
		margin: 0 auto 20px;
		background-size: 100% auto;
	}

	#main div.app-link ul li.sp{
		display: inline-block;
	}

	#main div.app-link ul li.pc{
		display: none;
	}
	
	/* SNS削除 */
	div#main aside div.sns-btn{
		display: none;
	}
	
	/* バナー削除 */


	#main aside div.bnr{
		display: none;
	}

	#main aside div.friends{
		display: none;
	}
	
	#main aside div.yoyaku{
		display: none;
	}
	

	#main p.pop{
		display: none;
	}
	
	#main aside p.bnr{
		display: none;
	}
	
	#main aside div.archive{
		display: none;
	}
	
	/* twitter */
	#main aside div.twitter{
		margin: 0 auto 20px;
	}
	
	#main aside div.twitter{
		width: 260px;
		background-image: url(/common/img/sp/aside/twitter-bg.jpg);
	}
	#main aside div.twitter #twitter-widget-1{
		width: 260px !important;
	}
	#main aside div.twitter div.head p.follow{
		left: 131px;
	}

	/* 4コマSP */
	.sp-bnr-4cell{
		display: block;
		line-height: 0;
		margin-bottom: 20px;
	}
	
	.sp-bnr-4cell img{
		width: 100%;
	}

	/* スマホ用ソーシャル */
	
	ul.sp-social{
		display: block;
		width: 135px;
		margin: 0px auto;
	}
	
	ul.sp-social li{
		width: 40px;
		height: 40px;
		float: left;
		margin-right: 5px;
	}
	
	ul.sp-social li img{
		width: 100%;
	}
	
	ul.sp-sns{
		display: block;
		text-align: center;
	}
	
	ul.sp-sns li{
		display: inline-block;
		margin-right: 10px;
		vertical-align: top;
	}
	
	ul.sp-sns li:last-child{
		margin-right: 0;
	}

/*-------------------------------------------------------------スマホフッター*/
/*---------------------------------------------------------------------------*/


	footer#footer{
		min-width: 0;
	}


}