html,body{
	height:100%;
	margin:0;
	padding:0;
}
body{
  	background-color: #000;
  	font-family: "Microsoft JhengHei","微軟正黑體";
  	font-size: 14px;
  	-webkit-appearance: none;
  	-moz-appearance: none;
}
#container {
    text-align: center;
  /* max-width: 600px; */
  /* margin: 0 auto; */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.containerWrap{
	max-width: 600;
	margin: 0 auto;
	position: relative;
}
a{
	text-decoration: none;
}
.displayNone{display: none;}
/*--button--*/
.button_orange{
	background-color: #ff8f20;
	color: white;
	text-shadow: 2px 1px 20px #222;
	font-weight: 100;
	opacity: .9;
}
h3{
	font-size: 60px;
	margin: 0;
}
h5{
	color: white;
	font-size: 21px;
	margin: 0px;
	padding-top: 50px;
}
h6{
	color: white;
	font-size: 16px;
	margin:0;
	padding:0;
	font-weight: 100;
	
	line-height: 1.5em;
}
p{
	color: white;
}
/*--index--*/
.intro{
	position: relative;
	margin: 0 auto;
	background-repeat: no-repeat;
	width: 100%;
}
img.index_title{
	width: 70%;
  margin: 0px auto;
  padding-top: 30px;
  padding-left: 10px;
  display: block;
  position: inherit;
}
.indexEnter{
	margin-top: 55%;
  color: white;
  font-size: 30px;
  text-align: center;
  position: relative;
}
.indexEnter .txt{
padding:20px 0 0;
font-size:14px;
line-height:24px;
position: inherit;
  position: relative;}
a.index_btn{
	display: inline-block;
  padding: 15px 40px;
  position: inherit;
  margin-top: 40%;
}
#target{
pointer-events:none;
	position: absolute;
	/*width: 200px;
  	height: 200px;*/
  	animation:move 3s infinite;
  	-webkit-animation:move 3s infinite;
  	-ms-animation:move 3s infinite;
  	transition: animation linear;
	-webkit-transition: animation linear;
	-o-transition: animation linear;
	-moz-transition: animation linear;
}
@-webkit-keyframes move{
	0%{top:30%;left:20%;}
	25%{top:15%;left:30%;}
	50%{top:50%;left:0%;}
	75%{top:40%;left:40%;}
	100%{top:30%;left:20%;}
}
@keyframes move{
	0%{top:30%;left:20%;}
	25%{top:15%;left:30%;}
	50%{top:50%;left:0%;}
	75%{top:40%;left:40%;}
	100%{top:30%;left:20%;}
}
/*--game--*/
.game{
	position: absolute;
	background-size: 100% 624px;
	background-position: center -40px;
	height: 60px;
	margin: 0 auto;
	background-repeat: no-repeat;
	width: 100%;
	z-index:2;
}
#game_score{
	position: absolute;
top:0;
left:0;
width:100%;
color: white;
	font-size: 16px;
	display: block;
}
#game_score .point{
	position: absolute;
  top: -8px;
  /* margin-left: 37%; */
  right: 26px;
}
#game_score .score{
	  position: absolute;
  top: -8px;
  /* margin-left: 40%; */
  left: 51px;
}
.game_scoreBoard{
	  width: 100%;
  height: 60px;
  background-image: url(../image/bk_re.jpg);
  background-repeat: repeat-x;
}
.greyback{
	background-color: #222;
    width: 100%;
    z-index: 999;
    height: 100%;
    opacity: .9;
    transition: opacity .5s;
	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	-o-transition: opacity .5s;
}
.greyback > div#countDown{
	color: white;
	font-size: 70px;
	padding-top: 50%;
}
img.ma{
	
	width: 120px;
}
.fail{
	color:red;
	text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;
}
.success{
	padding: 150px 0px;
}
.success > h6{
	margin-top: 20px;
}
.win{
	color:yellow;
	text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;
}
.game_main{
	position: relative;
	height: 100%;
z-index:1;
margin-top:-5%;
}
.game_main > * {
	position: absolute;
}
.grass{
	width:100%;
	margin: 5px auto 0;
	z-index: 2;
}
.row1{
	margin-top: 18%
}
.row2{
	margin-top: 50%
}
.row3{
	margin-top: 80%
}
.rowx1{
	margin-top: 30%
}
.rowx2{
	margin-top: 61%
}
.rowx3{
	margin-top: 92%
}

.line0{
	left: 0;
}
.line1{
	margin-left: 5%;
}
.line2{
	margin-left: 35%;
}
.line3{
	margin-left: 65%;
}
/*.item{
	width: 70px;
	position: absolute;
}
.itemCase{
	position: absolute;
}*/
.bad{
	background-image: url(../image/bad.png);
}
.good{
	background-image: url(../image/good.png);
}

.getPoint{width: 30px;}

/*share*/
.popout{
	position: absolute;
	width: 100%;
	height: 400px;
	z-index: 999;
	padding: 0px 0px;
}
.popout_box{
	background-image: url(../image/endCut_popout_bk.png);
  	background-size: 100%;
  	width: 74%;
  	margin: 0 auto;
  	box-shadow: 5px 5px 10px 15px rgba(0%,0%,0%,0.3);
  	padding: 40px 30px 40px;
  	position: relative;
}
.close{
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
	position: absolute;
    top: 5px;
    right: 6px;
    color: white;
    font-size: 30px;
    font-weight: 100;
    width: 44px;
    height: 44px;
    cursor: pointer;
}
.endCut_form{
	margin-top: 30px;
}
.endCut_form > input, .endCut_form > button{
	display: block;
  	width: 85%;
  	padding: 15px;
  	margin-top: 20px;
  	border: 0px;
}
.endCut_form > button.submit{
	padding: 10px 15px;
	width: 150px;
	font-size: 18px;
	border-radius: 0;

}
.share{
	position: relative;
  
  background-size: 100%;
  background-position: center -40px;
  margin: 0 auto;
  background-repeat: no-repeat;
  width:300px;
  padding: 30px 0px;
}
.video{
	margin-bottom: 25px;
}
.fb{
	  font-size: 17px;
  border-radius: 4px;
  color: white;
  padding: 20px 25px;
  background-color: rgb(43,72,124);
  display: block;
  margin: 0 auto;
}
.fb_icon{
	width: 23px;
	margin-bottom: -4px;
}
.share_button{
	  padding-bottom: 30px;
  width: 100%;
  position: relative;
  margin: auto;
  padding-top: 30px;
}
.share_button > .button_orange{
	  padding: 14px 17px;
    font-size: 16px;
}
.sb_1{
	margin-right: 11px;
}
.endCut_title{
	width: 275px;
	margin-right: -18px;
	margin-top: 30px;
}