@charset "utf-8";




/*----------------------------------------
	for PC
----------------------------------------*/


	@media screen and (min-width: 481px){

			body.chara #menu li.menu_chara{background:transparent url('../img/common/menu_chara_on.png');}

	/*--------visual---------*/

	body{

	}

	/*--------visualbnr---------*/

	#headline{
		position:relative;
		padding:10px 0;
		border-bottom:1px solid #fff;
	}

	#headline .inner{
		width:950px;
		margin:0 auto 0;
	}

	/*--------contents---------*/

	#contents{
		z-index:60;
	}

	#contents .inner{
		margin:0;padding:0;
		width:865px;
		margin:0 auto 0;
		padding:30px 0 80px;
		position:relative;
	}


	#background{
		background:#A2F6FB url('../img/common/bg.jpg') center top no-repeat;
		background-attachment:fixed;
		min-width:1000px;
		overflow:hidden;
		position:relative;
	}


	#info{
		width:350px;
		border-radius:8px;
		border:1px solid #fff;
		background-color:rgba(255,255,255,0.7);
		box-shadow:3px 3px 0 rgba(0,0,90,0.05);
		color:#09d;
		z-index:20;
		margin:10px 0 130px 40px;
		position:relative;
	}

	#info .name{
		margin:15px 15px;
	}

	#info .thum{
		display:block;
		float:left;
		width:150px;
		margin-left:10px;
	}

	#info .thum img{
		width:100%;
	}

	#info .btn_movie{
		position:relative;
		display:block;
		width:100%;
		margin:0 0 10px;
	}

	#info .btn_movie img{
		display:block;
		width:100%;
	}

	#info .btn_movie:after {
		content:'';
		background-image:url('../img/top/movie_icon.png');
		display:block;
		width:70px;height:70px;
		background-size:100%;
		position:absolute;
		top:50px;
		left:120px;
		opacity:0.6;
	}

	#info .btn_movie.new:before {
		position:absolute;
		top:-8px;
		left:-8px;
		content:'';
		display:block;
		background-image:url('../img/common/icon_newc.png');
		width:40px;
		padding-top:40px;
		background-size:100%;
		background-repeat:no-repeat;
	}

	#info .btn_ftp{
		width:98.5%;
		display:block;
	}

	.mo:hover{
		opacity:0.8;
	}

	#info .inner{
		margin:0 auto 0;
		width:310px;
		padding:10px 0 20px;
	}

	#info .inner_ajust{
		width:320px;
		margin-left:-10px;
	}


	#jp_container_1,
	#jp_container_2{
		width:150px;
		float:left;
	}

	#jp_container_1 img,
	#jp_container_2 img{
		width:100%;
	}

	#jp_container_1:hover,
	#jp_container_2:hover{
		opacity:0.7;
	}

	#jp_container_2{
		margin-left:3px;
	}

	.voice{
		margin:17px 0 12px;
	}


	.twittericon{
		margin-top:15px;
		margin-bottom:20px;
		position:relative;
		background-color:#42BADE;
		display:block;
		border-radius:5px;
		padding:2%;
		box-shadow:2px 2px 1px rgba(0,0,0,0.2);
	}

	/*.twittericon:before{
		content:'';
		display:block;
		position:absolute;
		background-image:url('../img/common/icon_newc.png');
		width:30px;
		top:-9px;
		left:-9px;
		padding-top:30px;
		background-size:100%;
		background-repeat:no-repeat;
		margin-bottom:-8px;
	}*/

	.twittericon h6{
		color:#09d;
		font-weight:800;
		font-size:19px;
		margin-bottom:10px;
		float:left;
		color:#fff;
		padding:17px 0 0 30px;
	}

	.twittericon:hover{
opacity:0.7;
	}

	.twittericon img{
		width:20.2%;
		margin-left:1%;
		display:block;
		float:left;
	}

	.twittericon img:nth-of-type(1){
	margin-left:0;
	}




	.mainImage{
		position:absolute;
		display:block;
		top:10px;
		right:0px;
		z-index:1;
	}

	.ss_dl{position:absolute;left:-80px;top:200px;z-index:30;}
	.ss_dr{position:absolute;right:-520px;top:200px;z-index:30;}

	.mainImage.c01{top:-20px;right:-190px;}
	.mainImage.c02{top:-20px;right:0px;}
	.mainImage.c03{top:-20px;right:-80px;}
	.mainImage.c04{top:-30px;right:-110px;}
	.mainImage.c05{top:-30px;right:-250px;}
	.mainImage.c06{top:-20px;right:-320px;}
	.mainImage.c07{top:-20px;right:-160px;}
	.mainImage.c08{top:-20px;right:-90px;}
	.mainImage.c09{top:-20px;right:-200px;}


}


/*----------------------------------------
	for SP
----------------------------------------*/

	@media screen and (max-width: 480px) {

		body.chara #menu li.menu_chara{background:transparent url('../img/common/menu_chara_on.png');}

/*--------visual---------*/

body{

}

/*--------visualbnr---------*/

#headline{
	position:relative;
	padding:10px 0 0;
	border-bottom:1px solid #fff;
	z-index:100;
}

#headline .inner{
	width:96%;
	margin:0 auto 0;
	padding:0 2%;
}

/*--------contents---------*/

#contents{
	position:relative;
	z-index:60;
}

#contents .inner{
	margin:0;padding:0;
	width:100%;
	margin:0 auto 0;
	padding:100% 0 80px;
	position:relative;
}

#background{
	overflow:hidden;
}

#background::after{
	display:block;
	position:fixed;top:0px;left:0px;
	background:#A2F6FB url('../img/common/bg.jpg') center top no-repeat;
	min-width:100%;
	height:100%;
	z-index:-50;
}


#info{
	width:90%;
	border-radius:8px;
	border:1px solid #fff;
	background-color:rgba(255,255,255,0.7);
	box-shadow:3px 3px 0 rgba(0,0,90,0.05);
	color:#09d;z-index:20;position:relative;
	margin:0px auto 0px;
}

#info .line{
	width:100%;
}

#info .name{
	margin:5% 4% 3%;
	width:100%;
	display:block;
}

#info .thum{
	display:block;
	float:left;
	width:48%;
	margin-left:2%;
}

#info .thum img{
	width:100%;
}


#info .inner{
	margin:0 auto 0;
	width:92%;
	padding:5% 0 5%;
	font-size:15px;
}

#info .inner_ajust{
	width:102%;
	margin-left:-2%;
}

#info .btn_movie{
	position:relative;
	display:block;
	width:100%;
	margin:0 0 10px;
}

#info .btn_movie img{
	display:block;
	width:100%;
}

#info .btn_movie:after {
	content:'';
	background-image:url('../img/top/movie_icon.png');
	display:block;
	width:25%;height:45%;
	background-size:100%;
	background-repeat:no-repeat;
	position:absolute;
	top:30%;
	left:38%;
	opacity:0.6;
}

#info .btn_movie.new:before {
	position:absolute;
	top:-8px;
	left:-8px;
	content:'';
	display:block;
	background-image:url('../img/common/icon_newc.png');
	width:40px;
	padding-top:40px;
	background-size:100%;
	background-repeat:no-repeat;
}

#jp_container_1,
#jp_container_2{
	width:48%;
	float:left;
}

#jp_container_1 img,
#jp_container_2 img{
	width:100%;
}

#jp_container_1:hover,
#jp_container_2:hover{
	opacity:0.7;
}

#jp_container_2{
	margin-left:3px;
}

.voice{
	margin:17px 0 12px;
}

.twittericon{
	margin-top:15px;
	margin-bottom:20px;
	position:relative;
	background-color:#42BADE;
	display:block;
	border-radius:5px;
	padding:2%;
	box-shadow:2px 2px 1px rgba(0,0,0,0.2);
}

/*.twittericon:before{
	content:'';
	display:block;
	position:absolute;
	background-image:url('../img/common/icon_newc.png');
	width:30px;
	top:-9px;
	left:-9px;
	padding-top:30px;
	background-size:100%;
	background-repeat:no-repeat;
	margin-bottom:-8px;
}*/

.twittericon h6{
	color:#09d;
	font-weight:800;
	font-size:19px;
	margin-bottom:10px;
	float:left;
	color:#fff;
	padding:17px 0 0 30px;
}

.twittericon:hover{
opacity:0.7;
}

.twittericon img{
	width:20.2%;
	margin-left:1%;
	display:block;
	float:left;
}

.twittericon img:nth-of-type(1){
margin-left:0;
}

.mainImage{
	position:absolute;
	display:block;
	top:0px;
	right:0px;
}

.ss_dl{position:absolute;left:0px;top:-15%;z-index:30;width:15%;}
.ss_dr{position:absolute;right:0px;top:-15%;z-index:30;width:15%;}

.ss_dl img,
.ss_dr img{
	display:block;
	width:100%;
}

.mainImage.c01{top:-20px;right:-23%;width:142%;}
.mainImage.c02{top:-20px;right:10%;width:102%;}
.mainImage.c03{top:-20px;right:5%;width:123%;}
.mainImage.c04{top:-20px;right:-2%;width:180%;}
.mainImage.c05{top:-20px;right:-26%;width:108%;}
.mainImage.c06{top:-20px;right:-34%;width:125%;}
.mainImage.c07{top:-20px;right:-13%;width:125%;}
.mainImage.c08{top:-20px;right:5%;width:110%;}
.mainImage.c09{top:-20px;right:-14%;width:135%;}

body.chara.c01 #info .name{width:70%;}
body.chara.c02 #info .name{width:38%;}
body.chara.c03 #info .name{width:38%;}
body.chara.c04 #info .name{width:38%;}
body.chara.c05 #info .name{width:38%;}
body.chara.c06 #info .name{width:38%;}
body.chara.c07 #info .name{width:38%;}
body.chara.c08 #info .name{width:38%;}
body.chara.c09 #info .name{width:38%;}

}
