html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-family: inherit;
	font-size: 100%;
	vertical-align: baseline;
	text-decoration: none;
}
html {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
q, blockquote {
	quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
	content: "";
	content: none;
}
a img {
	border: none;
}
a{
	color: #faff3f;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
	display: block;
}
a, p, li, h1, h2, h3, h4, h5, h6, select, input {
	font-family: "微軟正黑體", "Microsoft JhengHei", "PingFang TC", "Noto Sans TC", "Heiti TC", "黑體-繁", sans-serif;
}
body{
	background:#38005d;
}
.m01{
	background:#fff200;
	height: 50px;
}
.m02{
	background:#000000;
	padding: 15px 0;
	margin: 30px 0;
	text-align: center;
}
.ques{
	font-size: 1.6em;
	font-weight: bolder;
	line-height: 1.4em;
	color:#FFFFFF;
}
.roundicon img{
	width: 45%;
}
.smonster{
	width: 30%;
	float:right;
}
.smonster img{
	width: 100%;
}
.ttt th{
	padding: 6px 0;
	color:#000000;
	font-size: 1.2em;
}
.ttt td{
	padding: 6px 0;
	color:#FFFFFF;
	font-size: 1.2em;
}
.gold{
	color: #fff200;
	font-weight: bolder;
}
.pridenotice{
	width: 550px;
	margin: 30px auto;
	font-size: 1.2em;
	font-weight: bolder;
	line-height: 1.4em;
}
.bbg{
	width:99.5%;
	border-radius: 50px;
	background: linear-gradient(to bottom, #bfae73, #6a3800);
}
.yellow{
	color: #fff200;
	font-size: 1.2em;
	text-decoration-line: underline;
}
.red{
	color:#e8001c;
	font-size: 1em;
	line-height: 1.2em;
}
.mbig{
	letter-spacing: 5px;
	line-height: 1.6em;
	color:#000000;
	font-size: 1.6em;
	font-weight: bold;
}
.big{
	color:#000000;
	font-size: 2.5em;
	font-weight: bold;
}
.ssbig{
	color:#FFFFFF;
	font-size: 3.5em;
	font-weight: bold;
}
.white{
	color:#FFFFFF;
	font-size: 1.2em;
	font-weight: bold;
}
.sp{
	letter-spacing: 5px;
	font-weight: 600;
	color: #fff200;
	font-size: 1.4em;
}
.sw{
	letter-spacing: 5px;
	font-weight: 600;
	color: #FFFFFF;
	font-size: 1.4em;
}
.ss{
	font-size: 0.9em;
	font-weight:200;
}
.underLineStyle {
	outline: none;
	border: 1px solid #A5A5A5;
	font-size: 20px;
	padding: 5px 20px;
	border-radius: 0.5em;
	margin: 15px 0;
	text-align: center;
}
.underLineStyle-info {
	outline: none;
	border: 1px solid #A5A5A5;
	font-size: 20px;
	padding: 5px 20px;
	border-radius: 0.5em;
	margin: 15px 0;
	width: 95%;
}
.stai{
	border-bottom: 2px #fff200 solid;
	padding-bottom: 10px;
}
.card-l{
	margin-left: 65%;
}
.input{
	width: 90%;
	height:	50px;
	border-radius: 12px;
	border: 0;
	text-align: center;
	margin: 30px 0 50px 0;
	font-size: 1em
}
.hint{
	position:fixed;
	bottom: 21%;
	right: 15%;
	width: 220px;
	-webkit-animation: baloon_1 3s infinite;
    -moz-animation: baloon_1 3s infinite;
    -ms-animation: baloon_1 3s infinite;
    -o-animation: baloon_1 3s infinite;
    animation: baloon_1 3s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
.hint img{
	width: 100%;
}
.engingbg-11{
	background: url(images/game-end-bg11.jpg);
}
.engingbg-12{
	background: url(images/game-end-bg12.jpg);
}
.engingbg-13{
	background: url(images/game-end-bg13.jpg);
}
.engingbg-14{
	background: url(images/game-end-bg14.jpg);
}
.engingbg-15{
	background: url(images/game-end-bg15.jpg);
}
.engingbg-16{
	background: url(images/game-end-bg16.jpg);
}
.engingbg-17{
	background: url(images/game-end-bg17.jpg);
}
.engingbg-18{
	background: url(images/game-end-bg18.jpg);
}
.engingbg-19{
	background: url(images/game-end-bg19.jpg);
}
.engingbg-21{
	background: url(images/game-end-bg21.jpg);
}
.engingbg-22{
	background: url(images/game-end-bg22.jpg);
}
.engingbg-23{
	background: url(images/game-end-bg23.jpg);
}
.engingbg-24{
	background: url(images/game-end-bg24.jpg);
}
.engingbg-25{
	background: url(images/game-end-bg25.jpg);
}
.engingbg-26{
	background: url(images/game-end-bg26.jpg);
}
.engingbg-27{
	background: url(images/game-end-bg27.jpg);
}
.engingbg-28{
	background: url(images/game-end-bg28.jpg);
}
.engingbg-29{
	background: url(images/game-end-bg29.jpg);
}
.engingbg-31{
	background: url(images/game-end-bg31.jpg);
}
.engingbg-32{
	background: url(images/game-end-bg32.jpg);
}
.engingbg-33{
	background: url(images/game-end-bg33.jpg);
}
.engingbg-34{
	background: url(images/game-end-bg34.jpg);
}
.engingbg-35{
	background: url(images/game-end-bg35.jpg);
}
.engingbg-36{
	background: url(images/game-end-bg36.jpg);
}
.engingbg-37{
	background: url(images/game-end-bg37.jpg);
}
.engingbg-38{
	background: url(images/game-end-bg38.jpg);
}
.engingbg-39{
	background: url(images/game-end-bg39.jpg);
}
.engingbg-41{
	background: url(images/game-end-bg41.jpg);
}
.engingbg-42{
	background: url(images/game-end-bg42.jpg);
}
.engingbg-43{
	background: url(images/game-end-bg43.jpg);
}
.engingbg-44{
	background: url(images/game-end-bg44.jpg);
}
.engingbg-45{
	background: url(images/game-end-bg45.jpg);
}
.engingbg-46{
	background: url(images/game-end-bg46.jpg);
}
.engingbg-47{
	background: url(images/game-end-bg47.jpg);
}
.engingbg-48{
	background: url(images/game-end-bg48.jpg);
}
.engingbg-49{
	background: url(images/game-end-bg49.jpg);
}
.engingbg-btn{
	width: 70%;
	margin: 15px 0;
}
.engingbg-btn img{
	width: 100%;
}
#hide01{
	width: 250px;
	margin: 0 auto;
	background: #FFFFFF;
	color: #000;
	font-size: 1.1em;
	font-weight: bold;
	text-align: center;
	padding: 10px 10px 15px 10px;
	border-radius: 30px;
	visibility: hidden;
}
#hide01 img{
	margin-bottom: -8px;
}
#hide02{
	position:fixed;
	bottom: 20%;
	left:20%;
	width: 50%;
	background:#FFFFFF;
	padding: 1%;
	border-radius: 15px;
	visibility: hidden;
	z-index: 100;
}
#hide02 img{
	margin-bottom: -8px;
}

/*----------------- 最外層包裝 --------------------*/
#wrapper {
	width:100%;
	position:relative;
	text-align:left;
}
/*----------------- header --------------------*/
#header{
	width: 100%;
	position: absolute;
}
#header .logo{
	width: 300px;
	float: left;
	margin: 50px;
}
#header .logo img{
	width: 100%;
}
#header .menu{
	width: 768px;
	float: right;
	margin: 20px 0 0 0;
	font-size: 1.2em;
}
#header .menu ul{
	margin: 0;
	padding: 0;
}
#header .menu ul li{
	float: left;
	margin-top: 30px;
	padding:10px 20px 10px 20px;
	border-right: 1px #616161 solid;
	color: #FFFFFF;
	background:#000;
}
#header .menu ul li a{
	color:#bfae73;
}
#header .menu ul li a:hover{
	color:#FFFFFF;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-ms-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
#header .menu ul li:last-child{
	border-right:0;
}
/*----------------- header-in --------------------*/
#header-in{
	width: 100%;
	float: left;
}
#header-in .logo{
	width: 300px;
	float: left;
	margin: 20px;
}
#header-in .logo img{
	width: 100%;
}
#header-in .menu{
	width: 780px;
	float: right;
	margin: 10px 0 0 0;
	font-size: 1.2em;
}
#header-in .menu ul{
	margin: 0;
	padding: 0;
}
#header-in .menu ul li{
	float: left;
	margin-top: 25px;
	padding:10px 10px 10px 10px;
	color: #FFFFFF;
}
#header-in .menu ul li a{
	color:#bfae73;
}
#header-in .menu ul li a:hover{
	color:#FFFFFF;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-ms-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
#header-in .menu ul li:last-child{
	border-right:0;
}
/*----------------- main-index --------------------*/
#index-main{
	width: 100%;
	float: left;
	background:url(images/index-bg.jpg);
	background-position:center;
	background-attachment:scroll;
	background-size: 120%;
}
#index-tai{
	width: 40%;
	float: left;
	margin:150px 0 240px 11%;
}
#index-tai img{
	width: 100%;
}
#index-tai-words{
	width: 553px;
	position: relative;
	top: 470px;
	left: 30px;
	z-index: 30;
	color: #FFFFFF;
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1.2em;
	text-align: center;
}
#index-main .in-btn{
	width: 18%;
	position:absolute;
	top: 520px;
	left: 42%;
	-webkit-animation: baloon_1 5s infinite;
    -moz-animation: baloon_1 5s infinite;
    -ms-animation: baloon_1 5s infinite;
    -o-animation: baloon_1 3s infinite;
    animation: baloon_1 5s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
#index-main .in-btn img{
	width: 100%;
}
@-webkit-keyframes baloon_1{
0% { transform:translateY(20px);}
50% {transform:translateY(50px);}
100% {transform:translateY(20px);}
}

@-moz-keyframes baloon_1{
0% { transform:translateY(20px);}
50% {transform:translateY(50px);}
100% {transform:translateY(20px);}
}

@-ms-keyframes baloon_1{
0% { transform:translateY(20px);}
50% {transform:translateY(50px);}
100% {transform:translateY(20px);}
}

@-o-keyframes baloon_1{
0% { transform:translateY(20px);}
50% {transform:translateY(50px);}
100% {transform:translateY(20px);}
}

@keyframes baloon_1{
0% { transform:translateY(20px);}
50% {transform:translateY(50px);}
100% {transform:translateY(20px);}
}

#note{
	width: 90%;
	margin: 0 auto;
	padding: 0 0 30px 0;
}
#note h2{
	font-size: 2.2em;
	line-height: 1.2em;
	color:#FB7602;
	text-align: center;
}
#note p{
	font-size: 1.2em;
	line-height: 1.4em;
	color:#4F4F4F;
}
#note p span{
	color: #bfae73;
	font-weight: bold;
}
#note .nline{
	width: 100%;
	height: 2px;
	background: #bfae73;
	clear: both;
	float: left;
	margin: 20px 0;
}
#note ul{
	padding: 0;
	margin: 0;
}
#note ul li{
	width: 98%;
	float: left;
	list-style: decimal;
	color: #4F4F4F;
	margin-left: 20px;
	padding: 5px 0;
	font-size: 1.2em;
	line-height: 1.4em;
}
/*----------------- main-act --------------------*/
#act-main{
	width: 100%;
	padding:0;
	float: left;
	background:url(images/act-bg.jpg);
	background-position:center;
	background-attachment:scroll;
	background-size:cover;
}
#act-main .act-tai, #game-main .act-tai{
	width: 17%;
	position:absolute;
	top: 100px;
	left: 2%;
	-webkit-animation: baloon_1 5s infinite;
    -moz-animation: baloon_1 5s infinite;
    -ms-animation: baloon_1 5s infinite;
    -o-animation: baloon_1 5s infinite;
    animation: baloon_1 5s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
#act-main .act-tai img, #game-main .act-tai img{
	width: 100%;
}
#act-main .act-box{
	width: 60%;
	float: left;
	margin-left: 10%;
	background: url(images/act-box-bg.png);	
	padding: 5% 10%;
}
#act-main .act-box h2{
	font-size: 2.2em;
	letter-spacing: 8px;
	text-align: center;
	color: #002d6a;
	margin-bottom: 30px;
	padding-top: 10px;
	border-radius: 50px;
}
#act-main .act-box h2 img{
	margin: 5px 5px -14px 5px;
}
#act-main .act-box h3{
	font-size: 2.2em;
	letter-spacing: 6px;
	text-align: center;
	color: #002d6a;
	margin-bottom: 30px;
	padding-top: 10px;
	border-radius: 50px;
}
#act-main .act-box h3 img{
	margin: 5px 5px -14px 5px;
}
#act-main .act-box p{
	font-size: 1.2em;
	line-height: 1.4em;
	color: #FFFFFF;
}
#act-main .act-box ul{
	padding: 0;
	margin: 0;
}
#act-main .act-box ul li{
	width: 98%;
	float: left;
	list-style:disc;
	margin-left: 20px;
	padding: 8px 0;
	font-size: 1.2em;
	line-height: 1.4em;
	color: #FFFFFF;
}
#act-main .act-box2{
	width: 60%;
	float: left;
	margin-left: 10%;
	background: url(images/act-box-bg.png);	
	padding: 5% 10%;
}
#act-main .act-box2 h2{
	font-size: 2.2em;
	letter-spacing: 8px;
	text-align: center;
	color: #002d6a;
	margin-bottom: 30px;
	padding-top: 10px;
	border-radius: 50px;
}
#act-main .act-box2 h2 img{
	margin: 5px 5px -14px 5px;
}
#act-main .act-box2 p{
	font-size: 1.2em;
	line-height: 1.4em;
	color: #000000;
}
#act-main .act-box2 ul{
	padding: 0;
	margin: 0;
}
#act-main .act-box2 ul li{
	width: 22%;
	float: left;
	list-style:none;
	margin-top: 20px;
	margin-right: 4%;
	padding: 5px 0;
}
#act-main .act-box2 ul li:last-child{
	margin-right: 0;
}
#act-main .act-box2 ul li img{
	width: 100%;
}
#act-main .act-box2 ul li p{
	font-size: 1.2em;
	line-height: 1.2em;
	color: #000000;
	text-align: center;
	font-weight: bold;
}
#act-main .act-box3{
	width: 100%;
	float:left;
}
#act-main .act-box3 ul{
	padding: 0;
	margin: 0;
}
#act-main .act-box3 ul li{
	width: 48%;
	float: left;
	list-style:none;
	margin-top: 20px;
	margin-right: 4%;
	padding: 5px 0;
}
#act-main .act-box3 ul li:last-child{
	margin-right: 0;
}
#act-main .act-box3 ul li img{
	width: 100%;
}
#act-main .act-box3 ul li p{
	font-size: 1.2em;
	line-height: 1.2em;
	color: #000000;
	text-align: center;
	font-weight: bold;
}
#act-main .act-box4{
	width: 60%;
	float: left;
	margin-left: 10%;
	background: url(images/act-box-bg.png);	
	padding: 5% 10%;
}
#act-main .act-box4 h2{
	font-size: 2.2em;
	letter-spacing: 8px;
	text-align: center;
	color: #002d6a;
	margin-bottom: 30px;
	padding-top: 10px;
	border-radius: 50px;
}
#act-main .act-box4 h2 img{
	margin: 5px 5px -14px 5px;
}
#act-main .act-box4 p{
	font-size: 1em;
	line-height: 1.4em;
	color: #000000;
}
#act-main .act-box4 ul{
	padding: 0;
	margin: 0;
}
#act-main .act-box4 ul li{
	width: 24%;
	float: left;
	list-style:none;
	margin: 20px 3% 0 0;
	padding:20px;
	border-radius: 12px;
	text-align: center;
	background: rgba(255,255,255,.8);
}
#act-main .act-box4 ul li p{
	font-size: 1.2em;
	line-height: 1.2em;
	color: #000000;
	font-weight: bold;
}
#act-main .act-box4 ul li p a{
	color: #000000;
}
#act-main .act-box4 ul li p a:hover{
	color: #0053a5;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-ms-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
#act-main .act-box5{
	width: 100%;
	float: left;
	margin-bottom: 50px;
}
#act-main .act-box5 h3{
	font-size: 2.2em;
	color: #fff200;
	text-align: center;
}
#act-main .send{
	width: 330px;
	margin: 50px auto 0 auto;
	background: #fff200;
	border-radius: 12px;
	text-align: center;
	padding: 20px;
}
#act-main .send h2{
	font-size: 1.4em;
	font-weight: 800;
	line-height: 140%;
}
#act-main .send p{
	font-size: 1.2em;
	line-height: 140%;
	font-weight: 600;
}
#act-main .sendbtn{
	width: 60%;
	margin: 20px auto 0 auto;
	background: #002d6a;
	border-radius: 30px;
	text-align: center;
	padding: 8px 0;
	letter-spacing: 5px;
	color: #fff200;
}
#listline{
	width: 100%;
	height: 2px;
	background: #fff200;
	clear: both;
	float: left;
	margin:15px 0;
}
#act-main .act-box5 ul{
	padding: 0;
	margin: 0;
	list-style:none;
}
#act-main .act-box5 ul li{
	width: 25%;
	float: left;
	list-style:none;
	margin-right: 3%;
	padding:8px;
	font-size: 1.1em;
}
#act-main .act-box5 ul li:last-child{
	margin-right: 0;
}
#act-main .act-box6{
	width: 60%;
	float: right;
	background: url(images/act-box-bg4.png);	
	border-radius: 15px;
	padding: 30px 50px;
	margin: 15px 35px 0 50px;
}
#act-main .act-box6 h2{
	font-size: 2.2em;
	letter-spacing: 8px;
	line-height: 180%;
	color: #FFFFFF;
	text-align: center;
	margin-bottom: 30px;
}
#act-main .act-box6 h2 img{
	margin: 5px 5px -14px 5px;
}
#act-main .act-box6 h3{
	font-size: 1.5em;
	line-height: 1.4em;
	color:#000000;
}
#act-main .act-box6 ul{
	padding: 0;
	margin: 0;
}
#act-main .act-box6 ul li{
	width: 95%;
	float: left;
	list-style:none;
	margin: 10px 2%;
	padding: 8px;
}
#act-main .act-box6 ul li img{
	width: 100%;
}
#act-main .act-box7{
	width: 60%;
	float: right;
	background: url(images/act-box-bg3.png);	
	border-radius: 15px;
	padding: 30px 50px;
	margin: 15px 35px 0 50px;
}
#act-main .act-box7 h2{
	font-size: 2.5em;
	line-height: 1em;
	letter-spacing: 1px;
	color: #FFFFFF;
	text-align: center;
	margin-bottom: 30px;
}
#act-main .act-box7 p{
	font-size: 1.2em;
	line-height: 1.4em;
}
/*------------------------------*/
#act-main .act-box-item{
	width: 60%;
	float: right;
	background: url(images/act-box-bg4.png);	
	border-radius: 15px;
	padding: 30px 50px;
	margin: 15px 35px 0 50px;
}
#act-main .act-box-item h2{
	font-size: 2.2em;
	letter-spacing: 8px;
	color: #FFFFFF;
	margin-bottom: 30px;
}
#act-main .act-box-item h2 img{
	margin: 5px 5px -14px 5px;
}
#act-main .act-box-item h3{
	font-size: 1.5em;
	line-height: 1.4em;
	color: #FFFFFF;
}
#act-main .act-box-item ul{
	padding: 0;
	margin: 0;
}
#act-main .act-box-item ul li{
	width: 44%;
	float: left;
	list-style:none;
	margin: 20px 2%;
	padding: 8px;
}
#act-main .act-box-item ul li img{
	width: 100%;
}
/*----------------- main-game --------------------*/
#game-main{
	width: 100%;
	padding:0;
	float: left;
	background:url(images/act-bg.jpg);
	background-position:center;
	background-attachment:scroll;
	background-size:cover;
}
#game-main .game-box{
	width: 60%;
	float: left;
	margin-left: 10%;
	background: url(images/act-box-bg.png);	
	padding: 5% 10%;
}
#game-main .game-box h2{
	font-size: 2.5em;
	letter-spacing: 8px;
	color: #fff200;
	margin-bottom: 0;
}
#game-main .game-box h3{
	font-size: 2.2em;
	letter-spacing: 6px;
	text-align: center;
	color: #002d6a;
	margin-bottom: 30px;
	padding-top: 10px;
	border-radius: 50px;
}
#game-main .game-box p, .card-box p{
	font-size: 1.2em;
	line-height: 1.4em;
	color: #FFFFFF;
}
#game-main .gold1{
	width: 100%;
	background: url(images/game00-bg.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 16% 0;
}
#game-main .gold2{
	width: 100%;
	background: url(images/game00-bg-1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 16% 0;
}
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 12% 0 16% 0;
}
#game-main .endingword{
	width: 50%;
	margin-left: 50%;
	text-align: left;
}
#game-main .gold1 p, #game-main .gold2 p, #game-main .ending p{
	color: #000000;
	font-size: 1.5em;
	line-height: 1.6em;
}
#game-main .gold1 h2, #game-main .gold2 h2, #game-main .ending h2{
	color: #af102f;
	font-size: 1.6em;
}
#game-main .ddd{
	text-align: center;
	margin: 20px 0;
}
#game-main .eee{
	width: 100%;
	clear: both;
	float: left;
	text-align: center;
	margin: 10px 0;
}
#game-main .card-box{
	width: 100%;
	float:left;
	margin-bottom: 20px;
}
#game-main .card-box ul{
	padding: 0;
	margin: 0;
}
#game-main .card-box ul li{
	width: 29%;
	float: left;
	margin: 1.8%;
	padding:0;
	border: 1px #FFFFFF solid;
}
#game-main .card-box ul li img{
	width: 100%;
}
#game-main .card-box ul li a:hover{
	filter:drop-shadow(0 0 10px rgba(255,255,255,.8));
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-ms-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}

#game-main .card-box-3{
	clear: both;
	float: left;
	width: 98%;
	background: #bfae73;
	margin: 1%;
}
#game-main .card-box-3 ul{
	padding: 0;
	margin: 0;
}
#game-main .card-box-3 ul li{
	width: 30%;
	float: left;
	margin: 1.2%;
	padding:0;
}
#game-main .card-box-3 h2{
	font-size: 2.2em;
	letter-spacing: 8px;
	color:#FFFFFF;
}
#game-main .card-box-3 p{
	font-size: 1.5em;
	line-height: 100%;
	color: #000;
}

#game-main .ready{
	clear: both;
	float: left;
	width: 100%;
	margin: 20px 0;
	border: 1px #bfae73 solid;
}
#game-main .ready-in{
	float: left;
	width: 98%;
	background: #bfae73;
	margin: 1%;
}

#game-main .ready-in ul{
	width: 50%;
	display: block;
	padding:0;
	margin: 30px auto;
}
#game-main .ready-in ul li{
	width:45%;
	float: left;
	margin:2%;
	padding:0;
}
#game-main .ready-in ul li img{
	width: 90%;
}
#game-main .ready-in h2{
	font-size: 2.2em;
	letter-spacing: 8px;
	color:#FFFFFF;
}
#game-main .ready-in p{
	font-size: 1.5em;
	line-height: 100%;
	color: #000;
}
#game-main .ready-in-c{
	float: left;
	width: 98%;
	background: #bfae73;
	margin: 1%;
}

#game-main .ready-in-c ul{
	width: 50%;
	display: block;
	padding:0;
	margin: 10px auto;
}
#game-main .ready-in-c ul li{
	width:45%;
	float: left;
	margin:2%;
	padding:0;
}
#game-main .ready-in-c ul li img{
	width: 80%;
}
#game-main .ready-in-c h2{
	font-size: 2.2em;
	letter-spacing: 8px;
	color:#FFFFFF;
}
#game-main .ready-in-c p{
	font-size: 1.5em;
	line-height: 100%;
	color: #000;
}
#game-main .h2p{
	clear: both;
	text-align: center;
	margin: 50px 0;
}

#game-main .ques-box{
	width: 100%;
	float:left;
	padding: 0 0 30px 0;
}

#game-main .btn{
	text-align: center;
	width: 100%;
	clear: both;
	float: left;
	margin: 50px 0 0 0;
}
#game-main .btn img{
	width: 100%;
}
#game-main .btn-b{
	text-align: center;
	width: 100%;
	clear: both;
	float: left;
	margin: 0 0 40px 0;
}
#game-main .btn-b img{
	width: 300px;
}
#game-main .data-l-card{
	width: 80%;
	float: right;
	margin-top:5%;
}
#game-main .data-r-card{
	width: 80%;
	float:left;
	margin-top:5%;
}
#game-main .data-m-card{
	width: 100%;
	float: right;
}
#game-main .data-l-card img, #game-main .data-r-card img, #game-main .data-m-card img{
	width: 100%;
}
#game-main .win-tai{
	text-align: center;
	margin: 50px 0;
}
#game-main .pricepic{
	width: 540px;
	text-align: center;
	margin:0 auto;
}
#game-main .pricepic img{
	width:80%;
}
/*------------------------------*/
#answer{
	width: 100%;
	float: left;
	margin: 20px 0;
}
#answer ul{
	padding: 0;
	margin: 0;
}
#answer ul li{
	float: left;
	list-style:none;
	width: 97%;
	margin: 10px 0;
	padding: 5px 1.5%;
	background: #fffac0;
	text-align:left;
}
#answer ul li a{
	font-size: 1.5em;
	font-weight: 800;
	line-height: 1.2em;
	padding: 12px;
	color: #1d687f;
	display: block;
	width: 97%;
	height: 100%;
}
#answer ul li a:hover{
	color: #af102f;
}
#gamepic{
	width: 72%;
	margin: 20px auto;
}
#gamepic img{
	width: 100%;
	border: 3px #FFFFFF solid;
}
#gamebtn{
	width: 100%;
	text-align: center;
}
#gamepic-1{
	width: 75%;
	margin: 20px auto;
	border: 3px #FFFFFF solid;
}
#gamepic-1 img{
	width: 100%;
}
#gamepic-1 .butt{
	width: 100%;
	text-align: center;
	background: #727272;
}
#gamepic-1 .butt img{
	width: 120px;
	margin: 10px 20px;
}

#cer{
	width: 570px;
	margin: 0 auto;
	background:#540013;
	border-radius: 30px;
}
#cer .www{
	padding:5%;
	width:90%;
}
#cer .www p{
	text-align: center;
	font-size: 1.2em;
	line-height: 160%;
	color:#bfae73;
}
/*----------------- footer --------------------*/
#footer{
	width: 100%;
	clear: both;
	float: left;
}
#footer-left{
	width: 400px;
	float:left;
	margin: 20px 0 20px 30px;
}
#footer-left .menu2{
	width: 100%;
}
#footer-left .menu2 ul{
	margin: 0;
	padding: 0;
}
#footer-left .menu2 ul li{
	float: left;
	padding:0px 10px 0 10px;
	color: #FFFFFF;
}
#footer-left .menu2 ul li a{
	color:#bfae73;
}
#footer-left .menu2 ul li a:hover{
	color:#FFFFFF;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-ms-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
#footer-left .menu2 ul li:last-child{
	border-right:0;
}
#footer-left .sicon{
	width: 180px;
	clear: both;
	float:left;
	margin: 20px 0 0 10px;
}
#footer-left .sicon img{
	width: 35px;
	margin-right: 10px;
}
#footer .co{
	width: 700px;
	float:right;
	margin: 15px 30px 20px 0;
	color: #bfae73;
	font-size: 15px;
	line-height: 160%;
	text-align: right;
}
#footer .co a{
	color: #bfae73;
	text-decoration: underline;
}
#footer .co a:hover{
	color:#FFFFFF;
	text-decoration:none;
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-ms-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}
#m-block{
	display:none;
}



@media only screen and (max-width:1600px) {
#index-tai{
	width: 40%;
	float: left;
	margin:120px 0 240px 11%;
}
#index-main .in-btn{
	width: 18%;
	position:absolute;
	top: 480px;
	left: 38%;
	-webkit-animation: baloon_1 3s infinite;
    -moz-animation: baloon_1 3s infinite;
    -ms-animation: baloon_1 3s infinite;
    -o-animation: baloon_1 3s infinite;
    animation: baloon_1 3s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
#game-main .gold1{
	width: 100%;
	background: url(images/game00-bg.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 13% 0;
}
#game-main .gold2{
	width: 100%;
	background: url(images/game00-bg-1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 13% 0;
}
#game-main .gold1 p, #game-main .gold2 p, #game-main .ending p{
	color: #000000;
	font-size: 1.5em;
	line-height: 1.6em;
}
#game-main .gold1 h2, #game-main .gold2 h2, #game-main .ending h2{
	color: #af102f;
	font-size: 1.6em;
}
}



@media only screen and (max-width:1550px) {
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 12% 0 12% 0;
}
#game-main .ending p{
	color: #000000;
	font-size: 1.4em;
	line-height: 1.5em;
}
#game-main .ending h2{
	color: #af102f;
	font-size: 1.5em;
}
}



@media only screen and (max-width:1450px) {
.m02{
	background:#000000;
	padding: 15px 0;
	margin: 15px 0;
	text-align: center;
}
.card-l{
	margin-left: 45%;
}
.underLineStyle {
	outline: none;
	border: 1px solid #A5A5A5;
	font-size: 20px;
	padding: 5px 20px;
	border-radius: 0.5em;
	margin: 5px 0;
	text-align: center;
}
.underLineStyle-info {
	outline: none;
	border: 1px solid #A5A5A5;
	font-size: 20px;
	padding: 5px 20px;
	border-radius: 0.5em;
	margin: 5px 0;
	width: 95%;
}
#index-main{
	width: 100%;
	height: 750px;
	float: left;
}
#act-main .act-box4 ul li{
	width: 26%;
	float: left;
	list-style:none;
	margin: 20px 0 0 3%;
	padding:10px;
	border-radius: 12px;
	text-align: center;
}
#game-main .ready-in ul li{
	width:45%;
	float: left;
	margin:2%;
	padding:0;
}
#game-main .ready-in-c ul li{
	width:50%;
	float: left;
	margin:2% 0 2% 8%;
	padding:0;
}
#game-main .gold1{
	width: 100%;
	background: url(images/game00-bg.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 15% 0;
}
#game-main .gold2{
	width: 100%;
	background: url(images/game00-bg-1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 15% 0;
}
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 10% 0 10% 0;
}
#game-main .gold1 p, #game-main .gold2 p{
	color: #000000;
	font-size: 1.3em;
	line-height: 1.4em;
}
#game-main .gold1 h2, #game-main .gold2 h2{
	color: #af102f;
	font-size: 1.5em;
}
.hint{
	position:fixed;
	bottom: 25%;
	right: 15%;
	width: 220px;
	-webkit-animation: baloon_1 3s infinite;
    -moz-animation: baloon_1 3s infinite;
    -ms-animation: baloon_1 3s infinite;
    -o-animation: baloon_1 3s infinite;
    animation: baloon_1 3s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
#hide02{
	position:fixed;
	bottom: 25%;
	left:20%;
	width: 50%;
	background:#FFFFFF;
	padding: 1%;
	border-radius: 15px;
	visibility: hidden;
	z-index: 100;
}
}



@media only screen and (max-width:1350px) {
#act-main .act-box6 ul li{
	width: 95%;
	float: left;
	list-style:none;
	margin: 10px 2%;
	padding: 8px;
}
#act-main .act-box-item ul li{
	width: 42%;
	float: left;
	list-style:none;
	margin: 20px 2%;
	padding: 8px;
}
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 12% 0 12% 0;
}
#game-main .ending p{
	color: #000000;
	font-size: 1.2em;
	line-height: 1.3em;
}
#game-main .ending h2{
	color: #af102f;
	font-size: 1.3em;
}
}



@media only screen and (max-width:1280px) {
.hint{
	position:fixed;
	bottom: 25%;
	right: 12%;
	width: 220px;
	-webkit-animation: baloon_1 3s infinite;
    -moz-animation: baloon_1 3s infinite;
    -ms-animation: baloon_1 3s infinite;
    -o-animation: baloon_1 3s infinite;
    animation: baloon_1 3s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
#hide02{
	position:fixed;
	bottom: 20%;
	left:20%;
	width: 50%;
	background:#FFFFFF;
	padding: 1%;
	border-radius: 15px;
	visibility: hidden;
	z-index: 100;
}
#index-main{
	width: 100%;
	height: 650px;
	float: left;
	background:url(images/index-bg.jpg);
	background-size:120%;
	background-position:center;
	background-repeat: no-repeat;
}

#index-tai{
	margin:100px 0 0 5%;
}
#act-main .act-box h3, #game-main .game-box h3{
	font-size: 2.2em;
	letter-spacing: 1px;
	margin-bottom: 30px;
}
#game-main .win-tai{
	text-align: center;
	margin: 20px 0;
}
#index-main .in-btn{
	width: 18%;
	position:absolute;
	top: 350px;
	left: 35%;
}
#game-main .gold1{
	width: 100%;
	background: url(images/game00-bg.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 13% 0;
}
#game-main .gold2{
	width: 100%;
	background: url(images/game00-bg-1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 13% 0;
}
#game-main .gold1 p, #game-main .gold2 p{
	color: #000000;
	font-size: 1.3em;
	line-height: 1.4em;
}
#game-main .gold1 h2, #game-main .gold2 h2{
	color: #af102f;
	font-size: 1.5em;
}
}



@media only screen and (max-width:1165px) {
.mbig{
	line-height: 1.3em;
}
#header .menu, #header-in .menu{
	display: none;
}
#header{
	margin-top: 40px;
}
#header-in{
	margin-top: 40px;
}
#header .logo{
	width: 300px;
	float:none;
	margin: 30px auto;
}
#header-in .logo{
	width: 300px;
	float:none;
	margin: 20px auto;
}
#index-main{
	width: 100%;
	height: 650px;
	float: left;
	background:url(images/index-bg.jpg);
	background-size:140%;
	background-position:center;
	background-repeat: no-repeat;
}
#index-tai{
	width: 45%;
	position: relative;
	top: -15px;
	left: 0;
	z-index: 10;
}
#btn-gameon{
	width: 30%;
	position: relative;
	top: 63%;
	left: 10%;
	z-index: 50;
}
#btn-gameon img{
	width: 100%;
}
#index-tai-words{
	width: 40%;
	position: relative;
	top: 65%;
	left: 6%;
	z-index: 30;
	color: #FFFFFF;
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1.2em;
	text-align: center;
}
#index-main .in-btn{
	width: 18%;
	position:absolute;
	top: 350px;
	left: 40%;
}
#act-main .act-box4{
	width: 75%;
	float:left;
	background: url(images/act-box-bg.png);	
	border-radius: 15px;
	padding: 30px 50px;
	margin: 20px 0 0 8%;
}
#act-main .act-box6{
	width: 75%;
	float:left;
	background: url(images/act-box-bg4.png);	
	border-radius: 15px;
	padding: 30px 50px;
	margin: 20px 0 0 8%;
}
#act-main .act-box7{
	width: 75%;
	float:left;
	background: url(images/act-box-bg3.png);	
	border-radius: 15px;
	padding: 30px 50px;
	margin: 20px 0 0 8%;
}
#act-main .act-box-item{
	width: 75%;
	float:left;
	background: url(images/act-box-bg4.png);	
	border-radius: 15px;
	padding: 30px 50px;
	margin: 20px 0 0 8%;
}
#footer-left{
	width: 400px;
	float:none;
	margin: 20px auto;
}
#hide02{
	position:fixed;
	bottom: 20%;
	left:15%;
	width: 53%;
	background:#FFFFFF;
	padding: 1%;
	border-radius: 15px;
	visibility: hidden;
	z-index: 100;
}
#game-main .game-box{
	width: 70%;
	float: left;
	margin-left: 5%;
	background: url(images/act-box-bg.png);	
	padding: 5% 10%;
}
#game-main .gold1{
	width: 100%;
	background: url(images/game00-bg.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 15% 0;
}
#game-main .gold2{
	width: 100%;
	background: url(images/game00-bg-1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 15% 0;
}
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 14% 0 13% 0;
}
#game-main .gold1 p, #game-main .gold2 p{
	color: #000000;
	font-size: 1.3em;
	line-height: 1.4em;
}
#game-main .gold1 h2, #game-main .gold2 h2{
	color: #af102f;
	font-size: 1.5em;
}
#game-main .ready-in ul{
	width: 60%;
	display: block;
	padding:0;
	margin: 30px auto;
}
#game-main .ready-in-c ul{
	width: 60%;
	display: block;
	padding:0;
	margin: 30px auto;
}
#game-main .btn-b{
	text-align: center;
	width: 100%;
	clear: both;
	float: left;
	margin: 0 0 20px 0;
}
#game-main .btn-b img{
	width: 250px;
}
#game-main .ddd{
	text-align: center;
	margin: 30px 0;
}
#game-main .eee{
	width: 100%;
	clear: both;
	float: left;
	text-align: center;
	margin: 30px 0;
}
#cer{
	width: 400px;
	margin: 0 auto;
	background:#540013;
	border-radius: 30px;
}
#cer img{
	width: 100%;
}
#footer{
	font-size: 14px;
}
#footer-left .sicon{
	width: 150px;
	clear: both;
	float:none;
	margin: 20px auto;
	padding-top: 20px;
}
#footer-left .sicon img{
	width: 25px;
	margin: 0 5px;
}
#footer .co{
	width: 90%;
	float:none;
	margin: 15px auto;
	color: #bfae73;
	font-size: 14px;
	line-height: 150%;
	text-align:center;
}
}



@media only screen and (max-width:1024px) {
.hint{
	position:fixed;
	bottom: 25%;
	right: 8%;
	width: 220px;
	-webkit-animation: baloon_1 3s infinite;
    -moz-animation: baloon_1 3s infinite;
    -ms-animation: baloon_1 3s infinite;
    -o-animation: baloon_1 3s infinite;
    animation: baloon_1 3s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
#header-in .logo{
	width: 200px;
	float:none;
	margin: 10px auto;
}
#index-main{
	width: 100%;
	height: 550px;
	float: left;
	background:url(images/index-bg.jpg);
	background-size:140%;
	background-position:center;
	background-repeat: no-repeat;
}
#index-tai{
	width: 40%;
	position: relative;
	top: -15px;
	left: 5%;
	z-index: 10;
}
#index-main .in-btn{
	width: 18%;
	position:absolute;
	top: 320px;
	left: 38%;
}
#game-main .gold1{
	width: 100%;
	background: url(images/game00-bg.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 15% 0;
}
#game-main .gold2{
	width: 100%;
	background: url(images/game00-bg-1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 15% 0;
}
#game-main .gold1 p, #game-main .gold2 p{
	color: #000000;
	font-size: 1.2em;
	line-height: 1.3em;
}
#game-main .gold1 h2, #game-main .gold2 h2{
	color: #af102f;
	font-size: 1.3em;
}
}



@media only screen and (max-width:925px) {
#index-tai{
	width: 50%;
	position: relative;
	top: -15px;
	left: 0;
	z-index: 10;
}
#index-main .in-btn{
	width: 20%;
	position:absolute;
	top: 320px;
	left: 42%;
}
#game-main .gold1{
	width: 100%;
	background: url(images/game00-bg.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 12% 0;
}
#game-main .gold2{
	width: 100%;
	background: url(images/game00-bg-1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 12% 0;
}
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 10% 0 10% 0;
}
}



@media only screen and (max-width:850px) {
.mbig{
	line-height: 1.3em;
	font-size: 1.3em;
}
.red{
	color:#ff0522;
	font-size: 1em;
}
.m01{
	background:#fff200;
	height: 40px;
}
.ques{
	font-size: 1.2em;
	font-weight: bolder;
	line-height: 1.2em;
	color:#FFFFFF;
}
.m02{
	background:#000000;
	padding: 15px 0;
	margin:0;
	text-align: center;
}
.underLineStyle-info {
	outline: none;
	border: 1px solid #A5A5A5;
	font-size: 1em;
	padding: 5px 20px;
	border-radius: 0.5em;
	margin: 5px 0;
	width: 90%;
}
.ssbig{
	color:#FFFFFF;
	font-size: 3em;
	font-weight: bold;
}
.hint{
	position:fixed;
	bottom: 35%;
	right: 5%;
	width: 220px;
	-webkit-animation: baloon_1 3s infinite;
    -moz-animation: baloon_1 3s infinite;
    -ms-animation: baloon_1 3s infinite;
    -o-animation: baloon_1 3s infinite;
    animation: baloon_1 3s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
#hide02{
	position:fixed;
	bottom: 35%;
	left:10%;
	width: 56%;
	background:#FFFFFF;
	padding: 2%;
	border-radius: 15px;
	visibility: hidden;
	z-index: 100;
}
#act-main .act-box{
	width: 80%;
	float: left;
	margin-left: 5%;
	background: url(images/act-box-bg.png);	
	padding: 5% 5%;
}
#act-main .act-tai, #game-main .act-tai{
	display: none;
}
#act-main .act-box2{
	width: 80%;
	float: left;
	margin-left: 5%;
	background: url(images/act-box-bg.png);	
	padding: 5% 5%;
}
#act-main .act-box4{
	width: 90%;
	float:left;
	background: url(images/act-box-bg.png);	
	border-radius: 15px;
	padding: 20px;
	margin: 10px 2.6%;
}
#act-main .act-box4 ul li{
	width: 43%;
	float: left;
	list-style:none;
	margin: 20px 3% 0 1%;
	padding:5px;
	border-radius: 12px;
	text-align: center;
}
#act-main .act-box h3, #game-main .game-box h3{
	font-size: 1.6em;
	letter-spacing: 1px;
	margin-bottom: 30px;
}
#act-main .act-box h3 img{
	margin: 5px 5px -18px 5px;
}
#game-main .btn{
	text-align: center;
	width: 100%;
	clear: both;
	float: left;
	margin: 40px 0;
}
#game-main .btn img{
	width: 100%;
}
#game-main .ready-in ul{
	width: 75%;
	display: block;
	padding:0;
	margin: 30px auto;
}
#game-main .ready-in-c ul{
	width: 75%;
	display: block;
	padding:0;
	margin: 30px auto;
}
#answer ul li a{
	font-size: 1.2em;
	font-weight: 800;
	line-height: 1.2em;
	padding: 12px;
	color: #1d687f;
	display: block;
	width: 97%;
	height: 100%;
}
#game-main .game-box{
	width: 80%;
	float:left;
	background: url(images/act-box-bg.png);	
	padding: 25px 5%;
	margin:0 5%;
}
#game-main .game-box h2{
	font-size: 2.2em;
	letter-spacing: 8px;
	margin-bottom: 10px;
}
#game-main .ddd{
	text-align: center;
	margin: 20px 0;
}
#game-main .eee{
	width: 100%;
	clear: both;
	float: left;
	text-align: center;
	margin: 20px 0;
}
#game-main .data-l-card{
	width: 70%;
	float: right;
	margin-top:30%;
}
#game-main .data-r-card{
	width: 70%;
	float:right;
	margin-top:30%;
	margin-right:9%;
}
#game-main .data-m-card{
	width: 120%;
	float:left;
}
#game-main .win-tai{
	text-align: center;
	margin: 0 0 20px 0;
}
#game-main .pricepic{
	width: 450px;
	margin:0 auto;
}
#game-main .gold1{
	width: 100%;
	background: url(images/game00-bg.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 12% 0;
}
#game-main .gold2{
	width: 100%;
	background: url(images/game00-bg-1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 12% 0;
}
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 12% 0 12% 0;
}
#game-main .gold1 p, #game-main .gold2 p{
	color: #000000;
	font-size: 1.2em;
	line-height: 1.3em;
}
#game-main .gold1 h2, #game-main .gold2 h2{
	color: #af102f;
	font-size: 1.3em;
}
}



@media only screen and (max-width:720px) {
#game-main .endingword{
	width: 55%;
	margin-left: 45%;
	text-align: left;
}
#game-main .ending p{
	color: #000000;
	font-size: 1em;
	line-height: 1.2em;
}
#game-main .ending h2{
	color: #af102f;
	font-size: 1.2em;
}
}



@media only screen and (max-width:680px) {
.hint{
	position:fixed;
	bottom: 33%;
	right: 1%;
	width: 180px;
	-webkit-animation: baloon_1 3s infinite;
    -moz-animation: baloon_1 3s infinite;
    -ms-animation: baloon_1 3s infinite;
    -o-animation: baloon_1 3s infinite;
    animation: baloon_1 3s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
#hide02{
	position:fixed;
	bottom: 30%;
	left:10%;
	width: 60%;
	background:#FFFFFF;
	padding: 2%;
	border-radius: 15px;
	visibility: hidden;
	z-index: 100;
}
#index-main{
	width: 100%;
	height: 500px;
	float: left;
	background:url(images/index-bg.jpg);
	background-size:200%;
	background-position:center;
	background-repeat: no-repeat;
}
#index-tai{
	width: 60%;
	position: relative;
	top: -15px;
	left: 0;
	z-index: 10;
}
#index-main .in-btn{
	width: 25%;
	position:absolute;
	top: 200px;
	left: 55%;
}
#act-main .act-box h3, #game-main .game-box h3{
	font-size: 1.5em;
	letter-spacing:0;
	margin-bottom: 30px;
}
#game-main .gold1{
	width: 100%;
	background: url(images/game00-bg.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 13% 0;
}
#game-main .gold2{
	width: 100%;
	background: url(images/game00-bg-1.jpg);
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: center;
	padding: 13% 0;
}
#game-main .gold1 p, #game-main .gold2 p{
	color: #000000;
	font-size: 1em;
	line-height: 1.2em;
}
#game-main .gold1 h2, #game-main .gold2 h2{
	color: #af102f;
	font-size: 1.2em;
}
}



@media only screen and (max-width:615px) {
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 10% 0 8% 0;
}
.engingbg-btn{
	width: 70%;
	margin: 10px 0;
}
}



@media only screen and (max-width:560px) {
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 10% 0 10% 0;
}
#game-main .ending p{
	color: #000000;
	font-size: 14px;
	line-height: 120%;
}
#game-main .ending h2{
	color: #af102f;
	font-size: 16px;
}
.engingbg-btn{
	width: 75%;
	margin: 10px 0 0 0;
}
}



@media only screen and (max-width:500px) {
.m01{
	height: 30px;
}
.ttt th{
	padding: 5px 0;
	color: #FFFFFF;
	font-size: 1em;
}
.ttt td{
	padding: 5px 0;
	color: #FFFFFF;
	font-size: 1em;
}
.pridenotice{
	width: 80%;
	margin: 15px auto;
	font-size: 1em;
	line-height: 1.2em;
}
.ques{
	font-size: 1.2em;
	line-height: 1.2em;
	color: #FFFFFF;
	margin-top: 20px;
}
.bbg{
	width:98%;
	margin: 3px;
	border-radius: 50px;
	background: linear-gradient(to bottom, #bfae73, #6a3800);
}
.smonster{
	display: none;
}
.yellow{
	color: #ffc136;
	font-size: 1em;
}
.card-l{
	margin-left: 28%;
}
.underLineStyle-info {
	outline: none;
	border: 1px solid #A5A5A5;
	font-size: 1em;
	padding: 5px 20px;
	border-radius: 0.5em;
	margin: 5px 0;
	width: 85%;
}
.ssbig{
	color:#FFFFFF;
	font-size: 1.8em;
	font-weight: bold;
}
.hint{
	position:fixed;
	bottom: 25%;
	right: 1%;
	width: 130px;
	-webkit-animation: baloon_1 3s infinite;
    -moz-animation: baloon_1 3s infinite;
    -ms-animation: baloon_1 3s infinite;
    -o-animation: baloon_1 3s infinite;
    animation: baloon_1 3s infinite;
    -webkit-animation-direction: alternate;
    -moz-animation-direction: alternate;
    -ms-animation-direction: alternate;
    -o-animation-direction: alternate;
    animation-direction: alternate;
	z-index: 500;
}
#hide02{
	position:fixed;
	bottom: 20%;
	left:10%;
	width: 62%;
	background:#FFFFFF;
	padding: 2%;
	border-radius: 15px;
	visibility: hidden;
	z-index: 100;
}
#header .logo, #header-in .logo{
	width: 200px;
	float:none;
	margin: 15px auto;
}
#index-main{
	width: 100%;
	height: 450px;
	float: left;
	background:url(images/index-bg.jpg);
	background-size:220%;
	background-position:center;
	background-repeat: no-repeat;
}
#index-tai{
	width: 65%;
	position: relative;
	top: -40px;
	left: 0;
	z-index: 10;
}
#index-main .in-btn{
	width: 25%;
	position:absolute;
	top: 230px;
	left: 60%;
}
#index-tai-words{
	width: 50%;
	position: relative;
	top: 60%;
	left: 25%;
	z-index: 30;
	color: #FFFFFF;
	font-size: 1em;
	font-weight: bold;
	line-height: 1.2em;
	text-align: center;
}
#btn-gameon{
	width: 50%;
	position: relative;
	top: 60%;
	left: 25%;
	z-index: 50;
}
#act-main .act-box p{
	font-size: 1em;
	line-height: 1.2em;
	color: #FFFFFF;
}
#act-main .act-box ul li{
	width: 98%;
	float: left;
	list-style:disc;
	margin-left: 20px;
	padding: 8px 0;
	font-size: 1em;
	line-height: 1.4em;
	color: #FFFFFF;
}
#act-main .act-box, #act-main .act-box2{
	width:85%;
	float:left;
	background: url(images/act-box-bg.png);	
	border-radius: 15px;
	padding: 20px;
	margin: 10px 2.6%;
}
#act-main .act-box2 ul li{
	width: 45%;
	float: left;
	list-style:none;
	margin-top: 20px;
	margin-right: 5%;
	padding: 5px 0;
}
#act-main .act-box2 ul li p{
	font-size: 1em;
	line-height: 1.2em;
	color: #000000;
	text-align: center;
	font-weight: bold;
}
#act-main .act-box3 ul li{
	width: 95%;
	float: left;
	list-style:none;
	margin-top: 20px;
	margin-right: 4%;
	padding: 5px 0;
}
#act-main .act-box3 ul li p{
	font-size: 1em;
	line-height: 1.2em;
	color: #000000;
	text-align: center;
	font-weight: bold;
}
#act-main .act-box4{
	width: 88%;
	float:left;
	background: url(images/act-box-bg.png);	
	border-radius: 15px;
	padding: 20px;
	margin: 10px 0.8%;
}
#act-main .act-box4 ul li{
	width: 43%;
	float: left;
	list-style:none;
	margin: 20px 3% 0 1%;
	padding:5px;
	border-radius: 12px;
	text-align: center;
}
#act-main .act-box4 ul li p{
	font-size: 0.8em;
	line-height: 1.2em;
	color: #000000;
	font-weight: bold;
}
#act-main .act-box6{
	width: 85%;
	float:left;
	background: url(images/act-box-bg4.png);	
	border-radius: 15px;
	padding: 20px;
	margin: 10px 2.6%;
}
#act-main .act-box-item{
	width: 85%;
	float:left;
	background: url(images/act-box-bg4.png);	
	border-radius: 15px;
	padding: 20px;
	margin: 10px 2.6%;
}
#act-main .act-box7{
	width: 85%;
	float:left;
	background: url(images/act-box-bg3.png);	
	border-radius: 15px;
	padding: 20px;
	margin: 10px 2.6%;
}
#act-main .act-box h2, #act-main .act-box2 h2, #act-main .act-box4 h2, #act-main .act-box6 h2, #act-main .act-box7 h2, #act-main .act-box-item h2{
	font-size: 1.2em;
	margin-bottom: 30px;
}
#act-main .act-box h2 img, #act-main .act-box2 h2 img, #act-main .act-box4 h2 img, #act-main .act-box6 h2 img, #act-main .act-box7 h2 img, #act-main .act-box-item h2 img{
	width: 40px;
	margin: 5px 5px -10px 5px;
}
#act-main .act-box2 p, #act-main .act-box2 p, #act-main .act-box4 p, #act-main .act-box6 p, #act-main .act-box7 p, #act-main .act-box-item p{
	font-size: 1em;
	line-height: 1.2em;
	color: #000000;
}
#act-main .act-box5 h3{
	text-align: center;
	font-size: 1.5em;
	margin-bottom: 10px;
}
#act-main .act-box6 h2{
	letter-spacing: 3px;
}
#act-main .act-box6 h3{
	font-size: 1em;
	}
#act-main .act-box6 ul li{
	width: 95%;
	float: left;
	list-style:none;
	margin: 5px 0;
	padding:0;
}
#act-main .act-box-item h2{
	letter-spacing: 3px;
}
#act-main .act-box-item h3{
	font-size: 1em;
	}
#act-main .act-box-item ul li{
	width: 95%;
	float: left;
	list-style:none;
	margin: 20px 0;
	padding:0;
}
#listline{
	margin:0;
}
#act-main .act-box5 ul li{
	width: 36%;
	float: left;
	list-style:none;
	margin-right: 3%;
	padding:5px;
	font-size: 1em;
	text-align: center;
}
#act-main .act-box7 p{
	font-size: 1em;
	line-height: 1.2em;
}
#gamepic{
	width: 100%;
	margin: 0 auto;
}
#gamepic img{
	width: 100%;
}
#gamebtn{
	width: 200px;
	margin: 0 auto;
	text-align: center;
}
#gamebtn img{
	width: 100%;
}
#gamepic-1{
	width: 100%;
}
#gamepic-1 img{
	width: 100%;
}
#gamepic-1 .butt{
	width: 100%;
	text-align: center;
	background: #727272;
}
#gamepic-1 .butt img{
	width: 80px;
	margin: 10px 10px;
}
#footer-left{
	width: 350px;
	float:none;
	margin: 10px auto;
}
#footer-left .sicon{
	width: 120px;
	clear: both;
	float:none;
	margin: 20px auto;
	padding-top: 20px;
}
#footer-left .sicon img{
	width: 25px;
	margin: 0 5px;
}
#footer-left .menu2 ul li{
	float: left;
	padding:0 10px 0;
	border-right: 1px #bfae73 solid;
	color: #bfae73;
	font-size: 12px;
}
#footer .co{
	width: 90%;
	float:none;
	margin: 10px auto;
	color: #bfae73;
	font-size: 12px;
	line-height: 140%;
	text-align:center;
}
#note h2{
	font-size: 1.5em;
	line-height: 1.2em;
	color: #FB7602;
	text-align: center;
}
#note p{
	font-size: 1em;
	line-height: 1.2em;
	color: #4F4F4F;
}
#note ul li{
	font-size: 1em;
	line-height: 1.2em;
}
#act-main .act-box h3, #game-main .game-box h3{
	font-size: 1.05em;
	letter-spacing: 1px;
	margin-bottom: 30px;
}
#act-main .act-box h3 img{
	margin: 5px 5px -28px 5px;
}
#game-main .game-box{
	width: 80%;
	float:left;
	background: url(images/act-box-bg.png);
	padding: 20px 5% 0 5%;
	margin:0 5%;
}
#m-block{
	display: block;
	width: 100%;
	clear: both;
	float: left;
	height: 35px;
}
#game-main .ready-in ul{
	width: 95%;
	display: block;
	padding:0;
	margin: 30px auto;
}
#game-main .ready-in h2{
	font-size: 1.5em;
	letter-spacing: 8px;
	color:#FFFFFF;
}
#game-main .ready-in p{
	font-size: 1.2em;
	line-height: 100%;
	color: #000;
}

#game-main .ready-in-c ul{
	width: 95%;
	display: block;
	padding:0;
	margin: 10px auto;
}
#game-main .ready-in-c h2{
	font-size: 1.5em;
	letter-spacing: 8px;
	color:#FFFFFF;
}
#game-main .ready-in-c p{
	font-size: 1.2em;
	line-height: 100%;
	color: #000;
}

#game-main .btn{
	text-align: center;
	width: 100%;
	clear: both;
	float: left;
	margin: 20px 0 20px 0;
}
#game-main .h2p{
	clear: both;
	text-align: center;
	margin: 20px 0;
}
#game-main .ready-in ul li{
	width:45%;
	float: left;
	margin:2%;
	padding:0;
}
#game-main .ready-in-c ul li{
	width:70%;
	float: left;
	margin:2%;
	padding:0;
}
#game-main .game-box h2{
	font-size: 1.5em;
	letter-spacing: 8px;
	margin-bottom: 10px;
}
#game-main .card-box-3 p{
	font-size: 1em;
	line-height: 100%;
	color: #000;
}
#game-main .btn-b img{
	width: 180px;
}
#game-main .game-box p, .card-box p{
	font-size: 1em;
	line-height: 100%;
	color: #FFFFFF;
}
#game-main .pricepic{
	width:80%;
	margin:0 auto;
}
#cer{
	width: 250px;
	margin: 0 auto;
	background:#540013;
	border-radius: 30px;
}
#cer .www p{
	text-align: center;
	font-size: 1em;
	line-height: 140%;
	color:#bfae73;
}
#game-main .gold1 p, #game-main .gold2 p{
	color: #000000;
	font-size: 0.8em;
	line-height: 1em;
}
#game-main .gold1 h2, #game-main .gold2 h2{
	color: #af102f;
	font-size: 1em;
	letter-spacing: 0;
}
#game-main .ending{
	width: 100%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding: 12% 0 10% 0;
}
#game-main .endingword{
	width: 60%;
	margin-left: 40%;
	text-align: left;
}
#game-main .ending p{
	color: #000000;
	font-size: 13px;
	line-height: 120%;
}
#game-main .ending h2{
	color: #af102f;
	font-size: 14px;
}
.engingbg-btn{
	width: 65%;
	margin: 0 0 0 0;
}
.mbig{
	line-height: 14px;
	font-size: 120%;
}
}
/* /game、闖關完成頁: 金色框內文字改為品牌深藍, 貼近設計稿 */
#game-main .gold1 p, #game-main .gold2 p{
	color: #002d6a;
}

/* 手機: 金色框內文字縮小 + 加大行距 (放最後, 覆蓋各斷點, 修正行距過小重疊) */
@media only screen and (max-width:1165px) {
	#game-main .gold1, #game-main .gold2{
		padding: 12% 12%;
		box-sizing: border-box;
	}
	#game-main .gold1 p, #game-main .gold2 p{
		font-size: 0.78em;
		line-height: 1.8em;
	}
	#game-main .gold1 h2, #game-main .gold2 h2{
		font-size: 1em;
	}
}