@charset "UTF-8";

/*
**************************************
*Since: 2013-07-12
*Modified: 2013-00-00
**************************************
*/


/* luck
---------------------------------------------------------------------------------------- */
#luck {
	width: 100%;
}


/* telop
---------------------------------------------------------------------------------------- */
#telop {
	width: 100%;
	height: 30px;
	background: url(../img/bg_telop.png) repeat-x;
	background-size: auto 30px;
}

#telop p {
	width: 2%;
	z-index: 1;
}

#telop p.left {
	float: left;
	text-align: left;
}

#telop p.right {
	float: right;
	text-align: right;
}


#telop p img {
	height: 30px;
}

#telop .tickercontainer {
	float: left;
	overflow: hidden; 
	width: 96%; 
	height: 30px; 
}

#telop .tickercontainer .mask {
	overflow: hidden;
	position: relative;
	height: 30px;
}

#telop ul.newsticker {
	position: relative;
}

#telop ul.newsticker li {
	float: left;
	margin: 0;
	height: 30px;
	color: #FFF;
	line-height: 30px;
}

#telop ul.newsticker li strong {
	color: #FFFF00;
	line-height: 30px;
}

/* main
---------------------------------------------------------------------------------------- */
#game {
	overflow: hidden;
	position: absolute;
	width: 100%;
	padding: 141.40625% 0 0 0;
	top: 30px;
	left: 0;
	z-index: 100;
}

#main {
	position: absolute;
	width: 100%;
	top: 0;
}


#main #logo,
#main #logo_hit,
#main #frame,
#main #line,
#main #lamp,
#main #lamp_hit,
#main #light_hit,
#main #finish,
#main #start,
#main #normal,
#main #bg_red {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	text-align: center;
}

#main #frame {
	padding: 141.40625% 0 0 0;
	background: url(../img/bg_game.png) no-repeat top;
	background-size: 100% auto;
}

#main #finish p.center {
	position: absolute;
	width: 100%;
	padding: 10% 0 0 0;
	top: 0;
	left: 0;
}

#main #start p.push {
	position: absolute;
	width: 100%;
	padding: 18% 0 0 0;
	top: 0;
	left: 0;
}

#main #start p.arrow01,
#main #start p.arrow02,
#main #start p.arrow03 {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
}

#main #start p.arrow01 {padding: 46% 0 0 0;}
#main #start p.arrow02 {padding: 52% 0 0 0;}
#main #start p.arrow03 {padding: 58% 0 0 0;}


#main #start p.go {
	position: absolute;
	width: 100%;
	padding: 6% 0 0 0;
	top: 0;
	left: 0;
}

#main #start p.ready {
	position: absolute;
	width: 100%;
	padding: 29% 0 0 0;
	top: 0;
	left: 0;
}


#main #finish p.left,
#main #start p.left,
#main #normal p.left {
	position: absolute;
	width: 50%;
	top: 0;
	left: 0;
	text-align: left;
}

#main #finish p.right,
#main #start p.right,
#main #normal p.right {
	position: absolute;
	width: 50%;
	top: 0;
	right: 0;
	text-align: right;
}

#main #line {
	margin: 0 auto;
	padding: 112.5% 0 0 0;
	font-size: 0;
	line-height: 0;
	text-align: center;
}

#main #line img {width: 71%;}

#main #finish {top: 10%;}
#main #start {top: 10%;}
#main #normal {top: 10%;}

#main #logo img,
#main #logo_hit img,
#main #lamp img,
#main #lamp_hit img,
#main #light_hit img,
#main #finish img,
#main #start img,
#main #normal img {width: 100%;}

#main #start p.push img {width: 64%;}

#main #start p.arrow01 img,
#main #start p.arrow02 img,
#main #start p.arrow03 img {width: 16%;}

#main #bg_red {height: 100%;}

#main #bg_red img {width: 100%;}


#main #logo {z-index: 1;}
#main #logo_hit {z-index: 2;}
#main #finish {z-index: 3;}

#main #finish p.left,
#main #start p.left,
#main #normal p.left {z-index: 4;}

#main #finish p.right,
#main #start p.right,
#main #normal p.right {z-index: 5;}

#main #finish p.center,
#main #start p.go,
#main #start p.ready {z-index: 6;}

#main #start p.arrow01,
#main #start p.arrow02,
#main #start p.arrow03 {z-index: 7;}

#main #start p.push {z-index: 8;}

#main #frame {z-index: 10;}
#main #line {z-index: 11;}

#main #push {z-index: 12;}

#main #push span {z-index: 13;}

#main #btn_ex,
#main #btn_restart {z-index: 31;}

#main #lamp {z-index: 20;}
#main #bg_red {z-index: 21;}
#main #lamp_hit {z-index: 22;}
#main #light_hit {z-index: 23;}

#score p {z-index: 30;}


#main #nav {
	position: relative;
	width: 100%;
	padding: 85% 0 0 0;
}

#main #push {
	position: absolute;
	width: 100%;
	z-index: 30;
}

#main #push button {
	display: block;
	width: 45.6%;
	margin: 0 auto;
	padding: 0;
	background: none;
	border: 0;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	outline: none;
	outline: 0;
}

@-moz-document url-prefix() {
#main #push button {
		width: 46.8%;
	}
}

#main #push button img {width:  100%;}

#main #push span {
	position: absolute;
	display: block;
	width: 45.6%;
	margin: 0 auto;
	padding: 0;
	bottom: 0;
	border: none;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	text-align: center;
	left: 27.2%;
}

@-moz-document url-prefix() {
#main #push span {
	top: 1%;
	}
}

#main #push span img {width:  100%;}

#main #btn_ex,
#main #btn_restart {
	position: absolute;
	width: 14%;
	bottom: -30.2%;
	cursor: pointer;
}

#main #btn_ex {left: 6.1%;}
#main #btn_restart {right: 6.3%;}

#main #btn_ex img,
#main #btn_restart img {width: 100%;}


/* score
---------------------------------------------------------------------------------------- */
#score {
	position: relative;
	width: 100%;
	padding: 37.5% 0 0 0;
}

#score p {
	font-size: 0;
	line-height: 0;
	left: 0;
}


#score .hit {
    position: absolute;
	width: 50%;
    height: 20%;
	padding: 0 50% 0 0;
	text-align: right;
}

#score .rest {
    position: absolute;
	width: 92%;
    height: 16%;
	padding: 0 8% 0 0;
	bottom: -13.5%;
	text-align: right;
}

#score .probability {
    position: absolute;
	width: 92%;
    height: 16%;
	padding: 0 8% 0 0;
	bottom: -31.5%;
	text-align: right;
}

#score .hit img {
	width: 16%;
	margin: 0 0 0 0.9%;
}

#score .rest img,
#score .probability img {
	width: 4.3%;
	margin: 0 0 0 0.8%;
}