/*
 * w2001 - jnp iweb11
 * http://jnp.com.tw
 *
 * Copyright 2013, Evelyn Wang
 * 
 * 
 * December 2013
 */


/*-----------------------------------------------------------------------------
 [TABLE OF CONTENTS]
    +common
        =anchor
        =clear,clearfix
        =banner
    +header
        =cis
        =site-func
        =share-func
        =nav
    +content
        +content-main
        +content-sidebar
    +footer
        =footer-link
        =company-info
-----------------------------------------------------------------------------*/

/* +common
*----------------------------------------------------------------------------*/

* {
    margin: 0;
    padding: 0;
}

body {
	margin:0;
	color: #3d3d3d;
	font-size: 14px;
}

div, h1, h2, h3, h4, h5, h6, hr, p, form, label, input, textarea, img, span, ul, li {
	text-align: left;
	vertical-align: middle;
	margin: 0;
	padding: 0;
	word-wrap: normal;
	word-break: normal;
	border-width: 0;
	font-family: "微軟正黑體", "蘋果儷中黑", "Lucida Grande", "Arial", "Arial Narrow";
}

hr {
	noshade:noshade;
}

th {
	font-weight: normal;
}

ul, li {
	list-style: none;
}

/**
*
* =anchor
*
**/

a:link, a:visited {
	color: #191919;
	font-weight: normal;
	text-decoration: none;
}

a:hover {
	color: #900;
	text-decoration: none;
}

/**
*
* =clear,clearfix
*
**/

/* regular clearing apply to column that should drop below previous ones. */
.clear {
    clear: both;
}

/* this needs to be first because FF3 is now supporting this */
.clearfix {
    display: inline-block;
}

/* clearing floats without extra markup */
.clearfix:after {
    display: block;
    visibility: hidden;
    clear: both;
    height: 0;
    font-size: 0;
    content: ".";
}

/* hides from IE-mac \*/
* html .clearfix {
    height: 1%;
}
.clearfix {
    display: block;
}
/* end hide from IE-mac */


/* +header
*----------------------------------------------------------------------------*/
#header {
	width: 100%;
	height: 214px;
	background: url(../images/all/bg-header.jpg) repeat-x 0 0;
	overflow: hidden;
	position: relative;
}

#header .logoWrap {
	width: 100%;
	height: 170px;
	background: url(../images/all/bg-headerWrap.jpg) center 0;
	overflow: hidden;
}

#header .logoWrap .wrap {
	margin: 0 auto;
	width: 960px;
	overflow: hidden;
	position: relative;
}

/**
*
* =cis
*
**/
#header .logoWrap .wrap #cis {
	width: 425px;
	height: 95px;
	position: absolute;
	z-index: 50;
	top: 25px;
	left: 0;
}

#header .logoWrap .wrap #cis #flash {
	width: 425px;
	height: 130px;
}

#header .logoWrap .wrap #cis #flash h2 a {
	width: 425px;
	height: 130px;
	background: url(../images/all/logo.png) no-repeat 0 0;
	display: block;
	text-indent: -999999px;
}

/**
*
* =casino
*
**/
#header .logoWrap .wrap #casino ,
#header .logoWrap .wrap #casino ul {
	width: 960px;
	height: 170px;
	overflow: hidden;
}
#header .logoWrap .wrap #casino ul li {
	float: left;
}

/**
*
* =nav
*
**/
#header #nav {
	width: 100%;
	height: 51px;
	background: url(../images/all/bg-nav.png) no-repeat center bottom;
	position: absolute;
	bottom: 0;
	z-index: 100;
}

#header #nav h3 {
	display: none;
}

#header #nav ul {
	margin: 0 auto;
	width: 960px;
	overflow: hidden;
}

#header #nav ul li {
	width: 137px;
	height: 51px;
	float: left;
}

#header #nav ul li a.home ,
#header #nav ul li a.games ,
#header #nav ul li a.download ,
#header #nav ul li a.member ,
#header #nav ul li a.point ,
#header #nav ul li a.events ,
#header #nav ul li.last a.service {
	width: 137px;
	height: 51px;
	background: url(../images/all/nav.png) no-repeat 0 0;
	display: block;
	text-indent: -999999px;
}
#header #nav ul li a.home:hover {
	background-position: 0 -51px;
}
#header #nav ul li a.games {
	background-position: -137px 0;
}
#header #nav ul li a.games:hover {
	background-position: -137px -51px;
}
#header #nav ul li a.download {
	background-position: -274px 0;
}
#header #nav ul li a.download:hover {
	background-position: -274px -51px;
}
#header #nav ul li a.member {
	background-position: -685px 0;
}
#header #nav ul li a.member:hover {
	background-position: -685px -51px;
}
#header #nav ul li a.point {
	background-position: -822px 0;
}
#header #nav ul li a.point:hover {
	background-position: -822px -51px;
}
#header #nav ul li a.events {
	background-position: -548px 0;
}
#header #nav ul li a.events:hover {
	background-position: -548px -51px;
}

#header #nav ul li.last {
	margin: 0;
}
#header #nav ul li.last a.service {
	background-position: -411px 0;
}
#header #nav ul li.last a.service:hover {
	background-position: -411px -51px;
}


/* +memberWrap
*----------------------------------------------------------------------------*/
#bannerWrap .wrap .functionWrap {
	width: 335px;
	position: absolute;
	z-index: 10;
	bottom: 0;
}

/**
*
* =callCenter
*
**/
#bannerWrap .wrap .functionWrap #callCenter ,
.contetWrap .content #sidebar #callCenter {
	margin: 0 0 3px;
	width: 335px;
	height: 100px;
	background: url(../images/member/icon-callCenter.gif) no-repeat 0 0;
	text-indent: -999999px;
}

/**
*
* =member
*
**/
#bannerWrap .wrap .functionWrap #member ,
.contetWrap .content #sidebar #member {
	width: 335px;
	background: url(../images/member/bg-member.gif) no-repeat 0 0;
	overflow: hidden;
}

/**
*
* =login
*
**/
#bannerWrap .wrap .functionWrap #member #memberLogin ,
.contetWrap .content #sidebar #member #memberLogin ,
#bannerWrap .wrap .functionWrap #member #memberBox ,
.contetWrap .content #sidebar #member #memberBox {
	overflow: hidden;
}

#bannerWrap .wrap .functionWrap #member #memberLogin h3 ,
.contetWrap .content #sidebar #member #memberLogin h3 {
	display: none;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login ,
.contetWrap .content #sidebar #member #memberLogin .login {
	margin: 85px 30px 10px 15px;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset p ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset p {
	margin: 0 0 8px;
	overflow: hidden;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset p .name ,
#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset p .password ,
#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset p .code ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset p .name ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset p .password ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset p .code {
	width: 105px;
	height: 30px;
	background: url(../images/member/img-loginName.png) no-repeat 0 0;
	display: block;
	float: left;
	text-indent: -999999px;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset p .password ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset p .password {
	background: url(../images/member/img-loginPassword.png) no-repeat 0 0;
}
#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset p .code ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset p .code {
	background: url(../images/member/img-loginCode.png) no-repeat 0 0;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset p input ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset p input {
	padding: 3px;
	width: 175px;
	height: 22px;
	background: #320001;
	border: 1px #ae009e solid;
	float: left;
	color: #ff60ae;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset.btn ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset.btn {
	margin: 15px 0 0;
	overflow: hidden;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset.btn a ,
#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset.btn .btn-submit ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset.btn a ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset.btn .btn-submit {
	width: 105px;
	height: 31px;
	background: url(../images/member/icon-ForgotPassword.jpg) no-repeat 0 0;
	display: inline-block;
	float: right;
	text-indent: -999999px;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset.btn .btn-submit ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset.btn .btn-submit {
	margin: 0 5px 0 0;
	background: url(../images/member/icon-login.jpg) no-repeat 0 0;
}

#bannerWrap .wrap .functionWrap #member #memberLogin .login fieldset.btn .btn-submit:hover ,
.contetWrap .content #sidebar #member #memberLogin .login fieldset.btn .btn-submit:hover {
	background-position: 0 -31px;
}

/**
*
* =join
*
**/
#bannerWrap .wrap .functionWrap #member #memberLogin #join ,
.contetWrap .content #sidebar #member #memberLogin #join {
}

#bannerWrap .wrap .functionWrap #member #memberLogin #join a ,
.contetWrap .content #sidebar #member #memberLogin #join a {
	width: 335px;
	height: 90px;
	background: url(../images/member/icon-join.png) no-repeat 0 0;
	display: block;
	text-indent: -999999px;
}

/**
*
* =membernBox
*
**/
#bannerWrap .wrap .functionWrap #member #memberBox .mamberinfo,
.contetWrap .content #sidebar #member #memberBox .mamberinfo {
	margin: 85px 30px 10px 15px;
	overflow: hidden;
}

#bannerWrap .wrap .functionWrap #member #memberBox .mamberinfo h4 ,
.contetWrap .content #sidebar #member #memberBox .mamberinfo h4 {
	font-size: 16px;
	color: #fff;
}

#bannerWrap .wrap .functionWrap #member #memberBox .mamberinfo ul ,
.contetWrap .content #sidebar #member #memberBox .mamberinfo ul {
	margin: 5px 0 10px;
}

#bannerWrap .wrap .functionWrap #member #memberBox .mamberinfo ul li ,
.contetWrap .content #sidebar #member #memberBox .mamberinfo ul li {
	margin: 0 0 5px;
	padding: 0 0 5px 20px;
	background: url(../images/member/dot02.png) no-repeat 2px 2px;
	border-bottom: 1px #fff dotted;
	overflow: hidden;
}

#bannerWrap .wrap .functionWrap #member #memberBox .mamberinfo ul li a ,
.contetWrap .content #sidebar #member #memberBox .mamberinfo ul li a {
	color: #fff;
}

#bannerWrap .wrap .functionWrap #member #memberBox .mamberinfo .logout ,
.contetWrap .content #sidebar #member #memberBox .mamberinfo .logout {
	margin: 0 0 10px;
	overflow: hidden;
}

#bannerWrap .wrap .functionWrap #member #memberBox .mamberinfo .logout a ,
.contetWrap .content #sidebar #member #memberBox .mamberinfo .logout a {
	width: 105px;
	height: 31px;
	background: url(../images/member/icon-logout.jpg) no-repeat 0 0;
	display: inline-block;
	float: right;
	text-indent: -999999px;
}

#bannerWrap .wrap .functionWrap #member #memberBox #point ,
.contetWrap .content #sidebar #member #memberBox #point ,
.contetWrap .content #sidebar #pointS {
	overflow: hidden;
	display:none;
}

#bannerWrap .wrap .functionWrap #member #memberBox #point a ,
.contetWrap .content #sidebar #member #memberBox #point a ,
.contetWrap .content #sidebar #pointS a {
	width: 335px;
	height: 90px;
	background: url(../images/member/icon-point.gif) no-repeat 0 0;
	display: block;
	text-indent: -999999px;
}

/**
*
* =marquee
*
**/
#bannerWrap .wrap #webSeo {
	padding: 0 0 0 120px;
	width: 495px;
	height: 20px;
	background: url(../images/all/title-notice.png) no-repeat 0 center;
	position: absolute;
	z-index: 20;
	right: 0;
	bottom: 0;
}
#bannerWrap .wrap #webSeo .seo {
	width: 495px;
	height: 20px;
	overflow: hidden;
	line-height: 20px;
	color: #fff;
}


/* +contet
*----------------------------------------------------------------------------*/
.contetWrap {
	width: 100%;
	background: url(../images/all/bg-content.jpg) no-repeat center 0 #08020d;
	overflow: hidden;
}

.contetWrap .content {
	margin: 0 auto;
	width: 960px;
	overflow: hidden;
}

.contetWrap .content #sidebar {
	width: 335px;
	float: left;
}

/**
*
* =gameType
*
**/
.contetWrap .content #sidebar #gameType {
	margin-top: 10px;
	width: 355px;
	overflow: hidden;
}

.contetWrap .content #sidebar #gameType h3 {
	width: 355px;
	height: 85px;
	background: url(../images/all/title-gameType.png) no-repeat 0 0;
	display: block;
	text-indent: -999999px;
}

.contetWrap .content #sidebar #gameType .gameList {
	width: 355px;
	background: url(../images/all/bg-gameList.png) repeat-y 0 0;
	overflow: hidden;
}

.contetWrap .content #sidebar #gameType .gameList .gameinfo {
	width: 355px;
	background: url(../images/all/bg-gameList2.png) no-repeat 0 bottom;
	overflow: hidden;
}

.contetWrap .content #sidebar #gameType .gameList .gameinfo ul {
	width: 355px;
	background: url(../images/all/bg-gameType.png) no-repeat 0 0;
}

.contetWrap .content #sidebar #gameType .gameList .gameinfo ul li {
	margin: 0 33px 15px 22px;
	width: 280px;
}

.contetWrap .content #sidebar #gameType .gameList .gameinfo ul li img {
	width: 280px;
	height: 175px;
}

.contetWrap .content #sidebar #gameTypeBottom {
	width: 355px;
	height: 35px;
	background: url(../images/all/bg-gameListBottom.png) no-repeat 0 0;
}

/**
*
* =contentMain
*
**/
.contetWrap .content .contentMain {
	width: 615px;
	float: right;
	overflow: hidden;
}


/* +footer
*----------------------------------------------------------------------------*/
#footer {
	width: 100%;
	padding: 0 0 20px;
	background: url(../images/all/bg-footer.jpg) no-repeat center 0 #000005;
	overflow: hidden;
}

#footer p ,
#footer .footerNav ,
#footer .design {
	margin: 0 auto;
	width: 960px;
}

#footer p ,
#footer .design {
	margin-bottom: 5px;
	font-size: 12px;
	color: #fff;
	text-align: center;
}

#footer .design p {
	margin: 0 0 5px;
	text-align: center !important;
	color: #fff !important;
}

#footer .design p a {
	color: #fff !important;
}

#footer .footerNav h3 {
	display: none;
}

#footer .footerNav ul {
	margin: 20px auto;
	width: 540px;
	overflow: hidden;
}

#footer .footerNav ul li {
	margin: 0 5px 0 0;
	padding: 0 15px 0 0;
	background: url(../images/all/bg-footerNav.png) no-repeat right center;
	float: left;
}

#footer .footerNav ul li a {
	font-size: 16px;
	color: #fff;
}