/* [ layout_led_nakadooshibouuki_eng.css ] LED INLINE FLOAT style-sheet */

@charset "utf-8";

body,p,h1,h2,h3,h4,h5{
	margin: 0px;
	padding: 0px;
}

body{
	background-color: #000;
	font-family: 'Prompt', sans-serif;
	font-size: 15px;
	line-height: 26px;
}

h1{
	font-family: 'Days One', sans-serif;
	font-size: 20px;
	line-height: 20px;
	font-weight: 900;
	margin: 0px 0px 20px;
	padding: 0px 0px 7px;
	border-bottom: solid 1px #000;
	text-align: center;
}
h2{
	font-family: 'Days One', sans-serif;
	font-size: 20px;
	line-height: 20px;
	font-weight: 900;
	margin: 0px 0px 20px;
	padding: 0px 0px 7px;
	border-bottom: solid 1px #000;
}

img{
	vertical-align: bottom;
	-ms-interpolation-mode: bicubic;
}
img.img_r{
	border-radius: 10px;
}

a{
	text-decoration: none;
}
a:hover{
	opacity: 0.7;
}

/* ------------------------------------------------------ */

header{
	background: url(header_bg.gif);
	background-position: center top;
	background-repeat: repeat-x;
	width: 100%;
	height: 54px;
}
	#header_logo{
		background: url(header_logo.png);
		background-position: 30px 10px;
		background-repeat: no-repeat;
		width: 1080px;
		height: 54px;
		margin: 0px auto;
	}

footer{
	padding: 20px 0px;
}
	#copyright{
		font-size: 11px;
		line-height: 13px;
		color: #fff;
		text-align: center;
		max-height: 100%;
	}

/* ------------------------------------------------------ */

.box_blank{
	clear: both;
}
.text_item{
	color: red;
}
.color_g{
	color: green;
}
.color_r{
	color: red;
}

/* ------------------------------------------------------ */

#main{
	width: 100%;
	background-image: url(bg_main_back2.jpg);
	background-position: center top;
	background-repeat: no-repeat;
}

	#box_anime{
		position: relative;
		background-image: url(bg_main_back1.jpg);
		background-position: center;
		background-repeat: no-repeat;
		width: 1080px;
		height: 400px;
		margin: 0px auto;
	}
		#box_anime1{
			position: absolute;
			background-image: url(anime_float.jpg);
			background-position: 290px 0px;
			background-repeat: no-repeat;
			width: 1080px;
			height: 400px;
			opacity: 0;
			animation: anime1 30s linear 0s infinite normal;
		}
			@keyframes anime1 {
			    0% { opacity: 0; }
			    2% { opacity: 0; }
			    4% { opacity: 1; }
			   	76% { opacity: 1; }
			   	79% { opacity: 0; }
			    100% { opacity: 0; }
			}
		#box_anime2{
			position: absolute;
			left: 40px;
			top: 0px;
			background-image: url(anime_search.png);
			background-position: -275px -300px;
			background-repeat: no-repeat;
			width: 1000px;
			height: 400px;
			opacity: 0;
			animation: anime2 30s linear 0s infinite normal;
		}
			@keyframes anime2 {
			    0% { opacity: 0; }
			    10% { opacity: 0; background-position: -275px -300px; }
			    11% { opacity: 1; background-position: -275px -300px; }
			    12% { opacity: 1; background-position: -80px -300px; }
			    13% { opacity: 1; background-position: -80px -300px; }
			    14% { opacity: 1; background-position: -80px -370px; }
			    15% { opacity: 1; background-position: -80px -370px; }
			    16% { opacity: 1; background-position: 0px -370px; }
			    17% { opacity: 1; background-position: 0px -370px; }
			    17.25% { opacity: 0; background-position: 0px -370px; }
			    17.5% { opacity: 1; background-position: 0px -370px; }
			    17.75% { opacity: 0; background-position: 0px -370px; }
			    18% { opacity: 1; background-position: 0px -370px; }

			    21% { opacity: 1; background-position: 0px -370px; }
			    22% { opacity: 1; background-position: 0px -336px; }
			    23% { opacity: 1; background-position: 0px -336px; }
			    23.25% { opacity: 0; background-position: 0px -336px; }
			    23.5% { opacity: 1; background-position: 0px -336px; }
			    23.75% { opacity: 0; background-position: 0px -336px; }
			    24% { opacity: 1; background-position: 0px -336px; }

			    27% { opacity: 1; background-position: 0px -336px; }
			    28% { opacity: 1; background-position: 0px -300px; }
			    29% { opacity: 1; background-position: 0px -300px; }
			    30% { opacity: 1; background-position: -191px -300px; }
			    32% { opacity: 1; background-position: -191px -300px; }
			    37% { opacity: 1; background-position: 190px -300px; }
			    38% { opacity: 1; background-position: 275px -300px; }
			    39% { opacity: 0; background-position: 275px -300px; }

			    100% { opacity: 0; }
			}
		#box_anime3{
			position: absolute;
			background-image: url(anime_frame.png);
			background-position: center;
			background-repeat: no-repeat;
			width: 1080px;
			height: 400px;
			opacity: 1;
		}
		#box_anime4{
			position: absolute;
			background-image: url(anime_allow1.png);
			background-position: 190px 88px;
			background-repeat: no-repeat;
			width: 1080px;
			height: 400px;
			opacity: 0;
			animation: anime4 30s linear 0s infinite normal;
		}
			@keyframes anime4 {
			    0% { opacity: 0; }
			    18% { opacity: 0; background-position: 130px 88px; }
			    19% { opacity: 1; background-position: 130px 88px; }
			    19.4% { opacity: 1; background-position: 202px 88px; }
			    19.7% { opacity: 1; background-position: 170px 88px; }
			    20% { opacity: 1; background-position: 190px 88px; }

			    52% { opacity: 1; background-position: 190px 88px; }
			    52.4% { opacity: 1; background-position: 170px 88px; }
			    52.7% { opacity: 1; background-position: 202px 88px; }
			    53% { opacity: 1; background-position: 190px 88px; }

			    68% { opacity: 1; background-position: 190px 88px; }
			   	70% { opacity: 0; }
			    100% { opacity: 0; }
			}
		#box_anime5{
			position: absolute;
			background-image: url(anime_allow2.png);
			background-position: 550px 103px;
			background-repeat: no-repeat;
			width: 1080px;
			height: 400px;
			opacity: 0;
			animation: anime5 30s linear 0s infinite normal;
		}
			@keyframes anime5 {
			    0% { opacity: 0; }
			    24% { opacity: 0; background-position: 610px 103px; }
			    25% { opacity: 1; background-position: 610px 103px; }
			    25.4% { opacity: 1; background-position: 538px 103px; }
			    25.7% { opacity: 1; background-position: 570px 103px; }
			    26% { opacity: 1; background-position: 550px 103px; }

			    54% { opacity: 1; background-position: 550px 103px; }
			    54.4% { opacity: 1; background-position: 570px 103px; }
			    54.7% { opacity: 1; background-position: 538px 103px; }
			    55% { opacity: 1; background-position: 550px 103px; }

			    68% { opacity: 1; background-position: 550px 103px; }
			   	70% { opacity: 0; }
			    100% { opacity: 0; }
			}
		#box_anime6{
			position: absolute;
			background-image: url(anime_main_logo.png);
			background-position: 290px 0px;
			background-size: 500px 400px;
			background-repeat: no-repeat;
			width: 290px;
			height: 400px;
			opacity: 0;
			animation: anime6 30s linear 0s infinite normal;
		}
			@keyframes anime6 {
			    0% { opacity: 0; }
			    32% { opacity: 1; width: 290px; }
			   	37.8% { opacity: 1; width: 790px; }
			   	76% { opacity: 1; width: 790px; }
			   	79% { opacity: 0; width: 790px; }
			    100% { opacity: 0; }
			}
		#box_anime7{
			position: absolute;
			background-image: url(anime_main_logo_sub.png);
			background-position: center;
			background-repeat: no-repeat;
			width: 1080px;
			height: 400px;
			opacity: 0;
			animation: anime7 30s linear 0s infinite normal;
		}
			@keyframes anime7 {
			    0% { opacity: 0; }
			    41% { opacity: 0; }
			   	42% { opacity: 1; }
			   	76% { opacity: 1; }
			    79% { opacity: 0; }
			    100% { opacity: 0; }
			}
		#box_anime8{
			position: absolute;
			background-image: url(logo_lumica.png);
			background-position: center 180px;
 			background-size: 200px 41px;
			background-repeat: no-repeat;
			width: 1080px;
			height: 400px;
			opacity: 0;
			animation: anime8 30s linear 0s infinite normal;
		}
			@keyframes anime8 {
			    0% { opacity: 0; }
			    81% { opacity: 0; }
			    82% { opacity: 1; }
			    83% { opacity: 1; background-position: center 180px; }
			    84% { opacity: 1; background-position: center 170px; }
			    97% { opacity: 1; background-position: center 170px; }
			    98% { opacity: 0; background-position: center 170px; }
			    100% { opacity: 0; }
			}
		#box_anime8b{
			position: absolute;
			background-image: url(logo_japan.png);
			background-position: center 212px;
 			background-size: 260px 20px;
			background-repeat: no-repeat;
			width: 1080px;
			height: 400px;
			opacity: 0;
			animation: anime8b 30s linear 0s infinite normal;
		}
			@keyframes anime8b {
			    0% { opacity: 0; }
			    84% { opacity: 0; }
			   	85% { opacity: 1; }
			    97% { opacity: 1; }
			    98% { opacity: 0; }
			    100% { opacity: 0; }
			}

	#caption{
		background-color: #fff;
		width: 100%;
	}
		#caption_body{
			width: 1020px;
			margin: 0px auto;
			padding: 30px;
		}
			.box_left{
				float: left;
				width: 512px;
				padding: 40px 0px 0px 20px;
				max-height: 100%;
			}

				table#spec{
					border-collapse: collapse;
					width: 512px;
					margin: 0px;
				}
					table#spec td{
						background-color: #fff;
						border: solid 1px #ccc;
						padding: 10px;
						font-size: 15px;
						line-height: 20px;
						text-align: center;
					}
					table#spec td:first-child{
						border-left: solid 1px #fff;
					}
					table#spec td:last-child{
						border-right: solid 1px #fff;
					}
					table#spec tr:first-child td{
						border-top: solid 1px #fff;
						width: 150px;
					}
					table#spec tr:last-child td{
						border-bottom: solid 1px #fff;
					}


			.box_right{
				float: right;
				width: 468px;
				padding: 0px;
			}

					#illust1{
						position: relative;
						background-image: url(illust1.jpg);
						background-position: 270px 20px;
						background-repeat: no-repeat;
						width: 466px;
						margin: 0px;
						padding: 0px;
						height: 740px;
						font-size: 15px;
						line-height: 22px;
						border: solid 1px #ccc;
						border-radius: 10px;
					}
						#i1_text_box1{
							position: absolute;
							width: 240px;
							top: 50px;
							left: 130px;
						}
						#i1_text_box2{
							position: absolute;
							width: 280px;
							top: 130px;
							left: 50px;
						}
						#i1_text_box3{
							position: absolute;
							width: 250px;
							top: 230px;
							left: 70px;
						}
						#i1_text_box4{
							position: absolute;
							width: 220px;
							top: 380px;
							left: 60px;
						}
						#i1_text_box5{
							position: absolute;
							width: 220px;
							top: 489px;
							left: 40px;
						}


	#how_to{
		background-color: #eee;
		width: 100%;
		padding: 30px 0px;
		font-size: 15px;
		line-height: 22px;
	}

		#illust2{
			background-color: #fff;
			width: 958px;
			margin: 0px auto;
			padding: 30px;
			border: solid 1px #aaa;
			border-radius: 10px;
		}
			#illust2_body{
				position: relative;
				background-image: url(illust2.jpg);
				background-position: 70px 20px;
				background-repeat: no-repeat;
				width: 100%;
				margin: 0px;
				padding: 0px;
				height: 900px;
			}
				#i2_text_box1{
					position: absolute;
					width: 430px;
					top: 20px;
					left: 520px;
				}
				#i2_text_box2{
					position: absolute;
					width: 430px;
					top: 140px;
					left: 520px;
				}
				#i2_text_box3{
					position: absolute;
					width: 430px;
					top: 220px;
					left: 520px;
				}
				#i2_text_box4{
					position: absolute;
					width: 430px;
					top: 320px;
					left: 470px;
				}
				#i2_text_box5{
					position: absolute;
					width: 500px;
					top: 420px;
					left: 460px;
				}
					#list_i2_text_box5{
						list-style-type: decimal;
						margin: 10px 0px 0px -10px;
					}
						#list_i2_text_box5 li{
						    padding: 5px 0px 0px;
						}
				#i2_text_box6{
					position: absolute;
					width: 300px;
					top: 290px;
					left: 10px;
				}
				#i2_text_box7{
					position: absolute;
					width: 500px;
					top: 700px;
					left: 458px;
				}
					#i2_text_box7 img{
						border-radius: 10px;
					}

		#illust3{
			background-color: #fff;
			width: 958px;
			margin: 10px auto 0px;
			padding: 30px;
			border: solid 1px #aaa;
			border-radius: 10px;
		}
			#illust3_body{
				position: relative;
				background-image: url(illust3.jpg);
				background-position: 30px 20px;
				background-repeat: no-repeat;
				width: 100%;
				margin: 0px;
				padding: 0px;
				height: 630px;
			}
				#i3_text_box1{
					position: absolute;
					width: 430px;
					top: 70px;
					left: 520px;
				}
				#i3_text_box2{
					position: absolute;
					width: 430px;
					top: 520px;
					left: 200px;
				}

		#illust4{
			background-color: #fff;
			width: 958px;
			margin: 10px auto 0px;
			padding: 30px;
			border: solid 1px #aaa;
			border-radius: 10px;
		}
			#illust4_body{
				position: relative;
				background-image: url(illust4.jpg);
				background-position: center 100px;
				background-repeat: no-repeat;
				width: 100%;
				margin: 0px;
				padding: 0px;
				height: 600px;
			}
				#i4_text_box1{
					position: absolute;
					width: 960px;
					top: 10px;
					left: 0px;
					text-align: center;
				}
				#i4_text_box2{
					position: absolute;
					width: 480px;
					top: 60px;
					left: 0px;
					text-align: center;
					color: #e64a8b;
				}
				#i4_text_box3{
					position: absolute;
					width: 200px;
					top: 320px;
					left: 140px;
				}
				#i4_text_box4{
					position: absolute;
					width: 430px;
					top: 500px;
					left: 20px;
				}
				#i4_text_box5{
					position: absolute;
					width: 480px;
					top: 60px;
					left: 480px;
					text-align: center;
					color: #e64a8b;
				}
				#i4_text_box6{
					position: absolute;
					width: 200px;
					top: 320px;
					left: 620px;
				}
				#i4_text_box7{
					position: absolute;
					width: 360px;
					top: 500px;
					left: 600px;
				}

		#illust5{
			background-color: #fff;
			width: 958px;
			margin: 10px auto 0px;
			padding: 30px;
			border: solid 1px #aaa;
			border-radius: 10px;
		}
			#illust5_body{
				position: relative;
				background-image: url(illust5.jpg);
				background-position: center 20px;
				background-repeat: no-repeat;
				width: 100%;
				margin: 0px;
				padding: 0px;
				height: 550px;
			}
				#i5_text_box1{
					position: absolute;
					width: 200px;
					top: 25px;
					left: 170px;
					color: #e64a8b;
				}
				#i5_text_box2{
					position: absolute;
					width: 100px;
					top: 100px;
					left: 140px;
				}
				#i5_text_box3{
					position: absolute;
					width: 430px;
					top: 25px;
					left: 490px;
					color: #e64a8b;
				}
				#i5_text_box4{
					position: absolute;
					width: 320px;
					top: 100px;
					left: 480px;
				}
				#i5_text_box5{
					position: absolute;
					width: 280px;
					top: 460px;
					left: 570px;
				}

		#illust6{
			background-color: #fff;
			width: 958px;
			margin: 10px auto 0px;
			padding: 30px;
			border: solid 1px #aaa;
			border-radius: 10px;
		}
			#illust6_body{
				position: relative;
				background-image: url(illust6.jpg);
				background-position: center 100px;
				background-repeat: no-repeat;
				width: 100%;
				margin: 0px;
				padding: 0px;
				height: 800px;
				border-radius: 0px 0px 10px 10px;
			}
				#i6_text_box1{
					position: absolute;
					width: 900px;
					top: 10px;
					left: 30px;
				}
				#i6_text_box2{
					position: absolute;
					width: 200px;
					top: 270px;
					left: 380px;
				}
				#i6_text_box3{
					position: absolute;
					width: 260px;
					top: 420px;
					left: 280px;
				}
				#i6_text_box4{
					position: absolute;
					width: 300px;
					top: 640px;
					left: 290px;
				}


	#related_content{
		background-color: #fff;
		width: 100%;
		text-align: center;
		padding: 0px 0px 30px;
	}
		#related_content_body{
			width: 1020px;
			margin: 0px auto;
			padding: 30px;
		}
			#box_related_content{
				font-family: 'Days One', sans-serif;
				font-weight: 900;
				font-size: 20px;
				line-height: 20px;
				color: #000;
				width: 1020px;
				max-height: 100%;
				margin: 0px 0px 20px;
			}
				#related_content_body img{
					width: 505px;
					height: 80px;
				}


/* ------------------------------------------------------ */


