* { padding:0; margin:0;}
li { list-style-type:none;}
a { text-decoration:none;}
html , body {
	width:100%;
	font-family:Arial, Helvetica, sans-serif,"微軟正黑體","新細明體";
	
}
#mask{
	background-color: rgba(0,0,0,.8); 
	position:fixed;
	width: 100%;
	height: 100%;
	z-index:10;
}
.cooperation{
	background-color: #ffffff;
	width: 400px;
	height: 200px;
	padding: 20px;
	position:fixed;
	z-index:11;
	top: 50%;
	left: 50%;
	margin-left: -200px;
    transform: translateY(-50%);
}
.cooperation img {
	margin-bottom: 20px;
}
.cooperation h3 {
	margin-bottom: 5px;
}
.cooperation #close{
	cursor: pointer;
	right: 0;
	position: absolute;
	top: -35px;
	color: rgb(196, 196, 196);
}
.cooperation #close:hover{
	color: rgb(233, 233, 233);
}
.cooperation a{
	color: #ce501e;
}

header {
	width:100%;
	height: auto;
}
.mobbn {display:none;}
.mobmenu { display:none;}
.headerbox {
	width:1024px;
	height:80px;
	margin: 0 auto;
}
#topbar {
	width: 100%;
	height: 80px;
	position: fixed;
	background-color: rgba(0,0,0,0.9);
	z-index: 9;
}
.logo {
	width: 235px;
	height: auto;
	float: left;
}
.topmenu {}
.topmenu li {
	float: right;
	padding: 0 20px;
	line-height: 80px;
}
.topmenu li a {color: #ffffff;}
.topmenu li a:hover { color: #f3981b;}
.bn {
	width: 100%;
	height: auto;
	padding-top: 80px;
	display:block;
}
.bn img {width: 100%;}
.acticle {
	width:100%;
	height: auto;
}
.gamemob {display:none;}
.gameitem {
	position: relative;
	width: 1024px;
	height: auto;
	margin: 0 auto;
	padding: 70px 0 0 0;
	clear: both;
}
.gameitem h1 {
	text-align: center;
	line-height: 2;
	color:#e6511c;
} 
.gameitem h6 {
	font-size:18px; 
	color: #9F9F9F;
	float: right;
	position: absolute;
	right:20px;
	display: block;
	top:70px;
}
.gameitem h6 a {color: #0ea3ba;}
.gameitem h6 a:hover {color: #f3981b;}
.gameitem h3 {
	font-size:21px; 
	line-height: 2;
	color: #000000;
	float: left;
	padding-right: 5px;
}
.gameitem ul {
	clear: both;
	padding: 25px 0 0 0;
	display: block;
}
.gameitem ul a {}
.gameitem ul li {
	width:30%;
	height: auto;
	padding: 0 1.6% 50px 1.6%;
	float: left;
}
.gameitem ul li p img {
	width:9%;
	height: auto;
	float:right;
	padding:5px 0 0 5px;
}

.gameitem li img {width: 100%;}
.comitem {
	width: 100%;
	height: auto;
	clear: both;
	background: url(../images/index_Introduce_bg.jpg)no-repeat center top;
	padding:170px 0;
}
.comitembox {
	width: 800px;
	height: auto;
	margin: 0 auto;
}
.comitembox h1 {
	text-align: center;
	line-height: 2;
	color: #FFFFFF;
	padding:0 0 30px 0;
}
.comitembox p {
	text-align: center;
	color: #FFFFFF;
	line-height:1.8;
	margin-bottom:20px;
}
.comitembox ul {
	width:690px;
	height: auto;
	display: block;
	margin: 70px auto 0 auto;
}
.comitembox ul li{
	float: left;
	width:49%;
	height: auto;
	margin: auto 0.5% ;
}
.comitembox ul li img {width:100%;}
.coo_mob {display: none;}
.conpic {margin-top: 20px;}
.conpic img{width:100%;}
.conmail {
	width:900px;
	height: auto;
	margin:0 auto;
	text-align: center;
	background-color:#177d93;
	color: #FFFFFF;
	line-height:4;
	border-radius: 0 0 8px 8px;
	margin-top: -11px;
}

footer {
	width:100%;
	height: auto;
	padding: 50px 0;
	background-color: #262626;
	clear: both;
}
#footerbox {
	width:500px;
	height: auto;
	margin: 0 auto;
	color:#8b8b8b;
}
#footerbox img {
	width: 209px;
	height: auto;
	margin: 0 145px;
	padding-bottom: 30px;
}
#footerbox p {text-align: center;}
.dark {
	font-size:12px; 
	line-height: 2;
}

.con1 {margin-top: 25px;}
.con {color:#8b8b8b;}
.chillaxcon {
	clear: both;
	width: 900px;
	height: auto;
	margin: 0 auto;
	padding:30px 0;
	line-height: 2;
}
.chillaxcon h1 {
	text-align: center;
	padding: 0 0 30px 0;
}
.gamecon {
	clear: both;
	width: 900px;
	height: auto;
	margin: 0 auto;
	padding:30px 0;
	line-height: 2;
}
.gamecon h1 {
	text-align: center;
	padding: 0 0 30px 0;
}
.gameconbox {
	width: 30%;
	height: auto;
	border: 1px solid #D8D8D8;
	margin: 0 0.5% 1.5% 0.5%;
	padding: 8px;
	display: inline-block;
}
.gamefbico {
	width: 111px;
	display: block;
	margin-top: 40px;
	height: 37px;
}
.gamefbico:hover{ opacity:0.8;}
.gameconboxpic img {width: 100%;}
.gameconbox p { line-height:1.6;}
.gameconbox ul{}
.gameconbox ul li{ 
	float: left; 
	padding-right:4px;
	height: 37px;
}
.gameconbox ul li:hover { opacity:0.8;}
.gameconbox ul li img {width:100%;}

.pagination {
	width: 262px;
	height: auto;
	margin:40px auto 50px auto;
}
.newstit {
	font-size:15px; 
	line-height: 2;
	width:100%;
	border-bottom: 2px solid #177b93;
	padding:100px 0 5px 0;
}
.newstitwww {
	width: 900px;
	height: auto;
	margin: 0 auto 0 auto;
}
.www {
	width: 900px;
	height: auto;
	margin: 0 auto 0 auto;
}
.www a {color:#414141;}
.www a:hover { color:#9B9B9B;}

/* --平板版型------------------------------------- */

@media screen and (min-width: 768px) and (max-width: 1024px) {

.mobbn {display:none;}
.mobbn img {}
.mobmenu { display:none;}
.headerbox {
	width:100%;
	height:auto;
	margin: 0 auto;
}
#topbar {
	z-index: 9;
	height: auto;
	background-color: rgba(0,0,0,1);
}
.logo {
	width:30%;
	height: auto;
	float: left;
	padding:0.8% 0 0 2%;
}
.logo img {width: 100%;}
.topmenu {display:block;}
.topmenu li {
	float: right;
	padding: 0 1.5%;
	line-height: 80px;
	padding-right: 2%;
}
.topmenu li a {color: #ffffff;}
.topmenu li a:hover { color: #f3981b;}
.bn {display:block;}
.banner {}
.bn img {}
.acticle {
	width:100%;
	height: auto;
}
.gameitem {
	position: relative;
	width: 94%;
	height: auto;
	margin: 0 3%;
	padding:4% 0 0 0;
	clear: both;
}
.gameitem h1 {
	text-align: center;
	line-height: 2;
} 
.gameitem h6 {
	font-size:18px; 
	color: #9F9F9F;
	float: right;
	position: absolute;
	right:20px;
	display: block;
	top:52%;
}
.gameitem h6 a {color: #0ea3ba;}
.gameitem h6 a:hover {color: #f3981b;}
.gameitem h3 {
	font-size:21px; 
	line-height: 2;
	color: #000000;
	float: left;
	padding-right: 5px;
}
.gameitem ul {
	clear: both;
	padding: 10px 0 0 0;
	display: block;
}
.gameitem ul a {}
.gameitem ul li {
	width:30%;
	height: auto;
	padding: 0 1.6% 50px 1.6%;
	float: left;
}
.gameitem ul li p img {
	width:9%;
	height: auto;
	float:right;
	padding:11px 0 0 5px;
}

.gameitem li img {width: 100%;}
.comitem {
	width: 100%;
	height:auto;
	clear: both;
	display: inline-block;
	background-image: url(../images/index_Introduce_bg.jpg);
	background-position: top center; 
	background-repeat: no-repeat;
	padding:10% 0;
}
.comitembox {
	width:80%;
	height: auto;
	margin: 0 10%;
}
.comitembox h1 {
	text-align: center;
	line-height: 2;
	color: #FFFFFF;
	padding:0 0 3% 0;
}
.comitembox p {
	text-align: center;
	color: #FFFFFF;
	line-height: 2;
}
.comitembox ul {
	width:100%;
	height: auto;
	display: block;
	margin:4% auto 0 auto;
}
.comitembox ul li{
	float: left;
	width:49%;
	height: auto;
	margin: auto 0.5% 2% 0.5%;
}
.comitembox ul li img {width:100%;}
.conpic {
	width: 100%;
	height: auto;
	margin-top:0;
	padding-top: 5%;
}
.conpic img {width:100%;}
.conmail {
	width:100%;
	height: auto;
	margin:0 auto;
	text-align: center;
	background-color:#177d93;
	color: #FFFFFF;
	line-height:4;
	border-radius: 0 0 8px 8px;
	margin-top: -11px;
}

footer {
	width:100%;
	height: auto;
	padding: 7% 0;
	background-color: #262626;
	clear: both;
}
#footerbox {
	width:100%;
	height: auto;
	margin: 0 auto;
	color:#8b8b8b;
}
#footerbox img {
	width: 26%;
	height: auto;
	margin: 0 37%;
	padding-bottom:5%;
}
#footerbox p {text-align: center;}
.dark {
	font-size:12px; 
	line-height: 2;
}

.con1 {margin-top: 25px;}
.con {color:#8b8b8b;}
.chillaxcon {
	clear: both;
	width:90%;
	height: auto;
	margin: 0 5%;
	padding:0 0  8% 0;
	line-height: 2;
}
.chillaxcon h1 {
	text-align: center;
	line-height: 2;
	border-bottom: none;
	padding:6% 0 0 0;
}
.chillaxcon p {padding:0 0 0 0;}
.gamecon {
	clear: both;
	width:90%;
	height: auto;
	margin: 0 5%;
	padding:2% 0  8% 0;
	line-height: 2;
}
.gamecon h1 {
	text-align: center;
	line-height: 2;
	border-bottom:none;
	padding:4% 0 0 0;
}
.gameconbox {
	width:30.2%;
	height: auto;
	border: 1px solid #D8D8D8;
	margin:1% 0.5% 1.5% 0.5%;
	padding:0.7%;
	display: inline-block;
}
.gamefbico {
	width:49%;
	display: block;
	margin-top:7%;
	height:auto;
}
.gamefbico img {width:100%;}
.gamefbico:hover{ opacity:0.8;}
.gameconboxpic img {width: 100%;}
.gameconbox h3 { line-height:1.6;padding-left: 1%;}	
.gameconbox p { line-height:1.6;padding-left: 1%;}
.gameconbox ul{}
.gameconbox ul li{
	float: left; 
	padding-right:0;
	height: 37px;
	margin-top: -3%;
}
.gameconbox ul li:hover { opacity:0.8;}
.gameconbox ul li img {width:90%;}

.www {
	width: 100%;
	height: auto;
	margin: 0 auto 0 auto;
}

	
}

/* --手機版型------------------------------------- */

@media screen and (max-width: 767px) {
	.cooperation{
		background-color: #ffffff;
		width: 84%;
		height: auto;
		padding: 4%;
		position:fixed;
		z-index:11;
		top:32%;
		left:0;
		margin:0 4%;
		transform:none;
	}
	.cooperation img {
		margin-bottom: 20px;
	}
	.cooperation h3 {
		margin-bottom: 5px;
	}
	.cooperation #close{
		cursor: pointer;
		right: 0;
		position: absolute;
		top: -35px;
		color: rgb(196, 196, 196);
	}
	.cooperation #close:hover{
		color: rgb(233, 233, 233);
	}
header {
	width:100%;
	height: auto;
	
}
.mobbn {
	width:100%;
	display:block;
	padding-top: 80px;
}
.mobbn img {width:100%;}
.mobmenu { 
	display:block;
	z-index: 9999;
}
.headerbox {
	width:100%;
	height:80px;
	margin: 0 auto;
}
#topbar {
}
.logo {
	width:56%;
	height: auto;
	float: left;
	padding:2% 22% 0 22%;
}
.logo img {width: 100%;}
.topmenu {display:none;}
.topmenu li {
	float: right;
	padding: 0 20px;
	line-height: 80px;
}
.topmenu li a {color: #0ea3ba;}
.topmenu li a:hover { color: #f3981b;}
.bn {display:none;}
.banner {}
.bn img {}
.acticle {
	width:100%;
	height: auto;
	display:block;
}
.gamemob {
	clear: both;
	display:block;
	width: 90%;
	height: auto;
	margin:5%;
}
.gamemob h1 {
	text-align: center;
	line-height: 2;
}
.gamemob p {
	text-align: center;
	line-height: 2;
	display: block;
	color:#000;
}

.gameitem {
	display:block;
	position: relative;
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding:10% 0 20% 0;
	clear: both;
}
.gameitem h1 {
	text-align: center;
	line-height: 2;
} 
.gameitem h6 {
	font-size:18px; 
	color: #9F9F9F;
	float: right;
	position: absolute;
	right:20px;
	display: block;
	top:70px;
}
.gameitem h6 a {color: #0ea3ba;}
.gameitem h6 a:hover {color: #f3981b;}
.gameitem h3 {
	font-size:21px; 
	line-height: 2;
	color: #000000;
	float: left;
	padding-right: 5px;
}
.gameitem ul {
	clear: both;
	padding: 10px 0 0 0;
	display: block;
}
.gameitem ul a {}
.gameitem ul li {
	width:80%;
	height: auto;
	padding: 0 10% 5% 10%;
	float:none;
}
.gameitem ul li p img {
	width:9%;
	height:28px;
	float:right;
	padding:5px 0 0 5px;
}

.gameitem li img {width: 100%;}
.comitem {
	width: 100%;
	height:auto;
	clear: both;
	display: inline-block;
	background-image: url(../images/index_Introduce_bg.jpg);
	background-position: top center; 
	background-repeat: no-repeat;
	padding:10% 0;
}
.comitembox {
	width: 90%;
	height: auto;
	margin: 0 5%;
}
.comitembox h1 {
	text-align: center;
	line-height: 2;
	color: #FFFFFF;
	padding:0 0 3% 0;
}
.comitembox p {
	text-align: center;
	color: #FFFFFF;
	line-height: 2;
	margin-bottom:0;
}
.comitembox ul {
	width:100%;
	height: auto;
	display: block;
	margin:7% auto 0 auto;
}
.comitembox ul li{
	float: left;
	width:40%;
	height: auto;
	margin: auto 2% 2% 2%;
}
.comitembox ul li img {width:100%;}
.coo_mob {
	display: block;
	cursor: pointer;
	width: 268px;
	text-align: center;
	padding: 5px 7px;
	margin: 8% auto 0 auto;
	
}
.coo_mob ul li{
    border: 1px solid #C0C0C0;
	padding: 5px 7px;
	line-height: 2;
}
.coo_mob a {
	color: rgb(255, 255, 255);
}
.coo_mob a:hover{
	color: rgb(255, 255, 255);
}
.conpic {
	width: 100%;
	height: auto;
	margin-top: 20px;
}
.conpic img {width:100%;}
.conmail {
	width:100%;
	height: auto;
	margin:0 auto;
	text-align: center;
	background-color:#177d93;
	color: #FFFFFF;
	line-height:1.6;
	border-radius: 0 0 8px 8px;
	margin-top: -11px;
	padding: 1% 0;
}
.conmail p {line-height: 2;}

footer {
	width:100%;
	height: auto;
	padding: 10% 0;
	background-color: #262626;
	clear: both;
}
#footerbox {
	width:100%;
	height: auto;
	margin: 0 auto;
	color:#8b8b8b;
}
#footerbox img {
	width: 50%;
	height: auto;
	margin: 0 25%;
	padding-bottom:4%;
}
#footerbox p {text-align: center;}
.dark {
	font-size:12px; 
	line-height: 2;
}

.con1 {margin-top: 25px;}
.con {color:#8b8b8b;}
.chillaxcon {
	clear: both;
	width:90%;
	height: auto;
	margin: 0 5%;
	padding:25% 0  8% 0;
	line-height: 2;
}
.chillaxcon h1 {
	text-align: center;
	line-height: 2;
	border-bottom: 1px solid #dedede;
	padding:4% 0 0 0;
}
.chillaxcon p {padding:3% 0 0 0;}
.gamecon {
	clear: both;
	width:90%;
	height: auto;
	margin: 0 5%;
	padding: 25% 0  8% 0;
	line-height: 2;
}
.gamecon h1 {
	text-align: center;
	line-height: 2;
	border-bottom: 1px solid #dedede;
	padding:4% 0 0 0;
}
.gameconbox {
	width: 96%;
	height: auto;
	border: 1px solid #D8D8D8;
	margin:5% 0 1.5% 0;
	padding:2%;
	display: inline-block;
}
.gamefbico {
	width: 111px;
	display: block;
	margin-top:4%;
	height: 37px;
}
.gamefbico:hover{ opacity:0.8;}
.gameconboxpic img {width: 100%;}
.gameconbox p { line-height:1.6;}
.gameconbox ul{}
.gameconbox ul li{ 
	float: left; 
	padding-right:4px;
	height: 37px;
}
.gameconbox ul li:hover { opacity:0.8;}
.gameconbox ul li img {width:100%;}

.pagination {
	width:262px;
	height: auto;
	margin:7% auto 10% auto;
}

.www {
	width: 100%;
	height: auto;
	margin: 0 auto 0 auto;
}

}
