@charset "big5";
@import url("/css/_reset.css");
@import url("/css/fancybox/jquery.fancybox.css");
@import url("https://xdb2.x-legend.com.tw/icon/css/font-awesome.min.css");
body {}
#XlegendTop {min-width: 1000px;}
#googleCode {position: absolute; z-index: 900; }

ul, li { list-style-type: none; }
a { color: #39F; text-decoration: underline; }
a:hover { color: #4E65C2; text-decoration: none; }

.wrapper { position: relative; min-width: 1000px; background: url('img/bg.jpg') center 0px no-repeat; }

.clearFix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html .clearFix             { zoom: 1; } /* IE6 */
*:first-child+html .clearFix { zoom: 1; } /* IE7 */
/*------------------------------------------------------------------------------------------------------------------------------------- 
Bar & Menu
-------------------------------------------------------------------------------------------------------------------------------------*/
.Bar { position: absolute; z-index: 10; top: 0px; right: 50%; margin-right: -496px; }
.Bar.fixed { position: fixed; top: 0px; }
.Bar_head { margin-left: 56px; padding: 233px 0 0 20px; width: 245px; height: 59px; background: url('img/bar_head.png') 0 0 no-repeat; }
.Bar_head .month { width: 60px; text-align: center; font-size: 50px; color: #FFF; font-weight: bold; font-family: Arial; }
.Bar_menu { margin-left: 50px; width: 245px; background: url('img/bar_bg.png') top right repeat-y; }
.Bar_foot a { 
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
  display: block;
  margin-left: 50px;
  margin-top: -10px;
  width: 245px; height: 56px; background: url('img/bar_foot.png') top right repeat-y;  }

.Bar_menu li a { 
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
  display: block;
  width: 100%; height: 100%;
  background: url('img/menu_all.png') 0 0 no-repeat;
  
}
.Bar_menu li {
  margin: 0px 0px 2px 26px;
  width:199px; height: 47px; 
  position: relative;
  z-index: 11;
}
.Bar_menu li.m1 a { background-position: 0 0; margin-top: 0px; }
.Bar_menu li.m2 a { background-position: 0 -49px; }
.Bar_menu li.m3 a { background-position: 0 -98px; }
.Bar_menu li.m4 a { background-position: 0 -147px; }
.Bar_menu li.m5 a { background-position: 0 -196px; }
.Bar_menu li.m6 a { background-position: 0 -245px; }
.Bar_menu li.m7 a { background-position: 0 -294px; }

.Bar_menu li.m1 a:hover, .Bar_menu li.m1 a.active { background-position: -199px 0; }
.Bar_menu li.m2 a:hover, .Bar_menu li.m2 a.active { background-position: -199px -49px; }
.Bar_menu li.m3 a:hover, .Bar_menu li.m3 a.active { background-position: -199px -98px; }
.Bar_menu li.m4 a:hover, .Bar_menu li.m4 a.active { background-position: -199px -147px; }
.Bar_menu li.m5 a:hover, .Bar_menu li.m5 a.active { background-position: -199px -196px; }
.Bar_menu li.m6 a:hover, .Bar_menu li.m6 a.active { background-position: -199px -245px; }
.Bar_menu li.m7 a:hover, .Bar_menu li.m7 a.active { background-position: -199px -294px; }

.Bar_menu li.m1s, .Bar_menu li.m2s, .Bar_menu li.m3s, .Bar_menu li.m4s, .Bar_menu li.m5s, .Bar_menu li.m6s, .Bar_menu li.m7s {
  background: url('img/menu_all.png') 0 0 no-repeat;
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
  display: block;
}
.Bar_menu li.m1s { background-position: -398px 0; }
.Bar_menu li.m2s { background-position: -398px -49px; }
.Bar_menu li.m3s { background-position: -398px -98px; }
.Bar_menu li.m4s { background-position: -398px -147px; }
.Bar_menu li.m5s { background-position: -398px -196px; }
.Bar_menu li.m6s { background-position: -398px -245px; }
.Bar_menu li.m7s { background-position: -398px -294px; }

/*------------------------------------------------------------------------------------------------------------------------------------- 
logo
-------------------------------------------------------------------------------------------------------------------------------------*/
.logo_AR a { position: absolute; margin: 15px 0 0 30px; width: 283px; height: 191px; background: url('img/logo_AR.png') no-repeat; }
.logo_DS a { position: absolute; margin: 15px 0 0 30px; width: 280px; height: 174px; background: url('img/logo_DS.png') no-repeat; }
.logo_FF a { position: absolute; margin: 7px 0 0 33px; width: 280px; height: 198px; background: url('img/logo_FF.png') no-repeat; }
.logo_LH a { position: absolute; margin: 40px 0 0 30px; width: 298px; height: 126px; background: url('img/logo_LH.png') no-repeat; }
.logo_GD a { position: absolute; margin: 20px 0 0 40px; width: 295px; height: 181px; background: url('img/logo_GD.png') no-repeat; }
.logo_FN a { position: absolute; margin: 7px 0 0 33px; width: 284px; height: 200px; background: url('img/logo_FN.png') no-repeat; }
.logo_JS a { position: absolute; margin: 40px 0 0 0px; width: 345px; height: 146px; background: url('img/logo_JS.png') no-repeat; }
.logo_GF a { position: absolute; margin: 15px 0 0 30px; width: 290px; height: 190px; background: url('img/logo_GF.png') no-repeat; }


/*------------------------------------------------------------------------------------------------------------------------------------- 
page
-------------------------------------------------------------------------------------------------------------------------------------*/
#slide { margin: 0 auto 30px; width: 945px; padding-top: 485px; padding-left: 35px; }
#mask { overflow: hidden; width: 686px; }
#panel .pages { float: left; padding: 0 9px; }

#panel img { border: 0px }
#panel .title { width: 668px; height: 85px; }
#panel .pager { width: 650px; margin: 0 auto 20px; font-size: 15px; color: #666; line-height: 24px;  }
.border { padding: 9px;border: 1px #CCC solid;  }
#panel .pager .border {margin-bottom: 30px;padding: 9px;border: 1px #CCC solid; }


#panel .pager p { margin-bottom: 20px; } 
#panel .pager h1 { font-size: 24px; color: #63C ; margin-bottom: 12px; }
#panel .pager h2 { font-size: 18px; color: #099; margin-bottom: 3px; }
#panel ol.num li { margin-left: 28px; color: #BD2626; list-style-type: decimal; }

/*------------------------------------------------------------------------------------------------------------------------------------- 
table
-------------------------------------------------------------------------------------------------------------------------------------*/
table {font-size: 13px;font-weight: normal;}
.tbstyle { border: 2px solid #e9e9e9; padding:1px; margin: 0px 0px 5px; line-height: 24px; text-align: center; }
.tbstyle table { border: 1px solid #ccc; border-width:1px 1px 0px 0px; }
.tbstyle th, .tbstyle td { padding: 5px 8px; border:1px solid #B7B7B7; border-width: 0px 0px 1px 1px; }
.tbstyle th { background: #565a94; color: #D0EBFF; font-size: 16px; font-weight: bold; }
.tbstyle td { background: #FFF; }
.tbstyle td.odd { background: #efefef; }
.tbstyle td.odd_2 { background: #73ae74; color: #FFF; }
.tbstyle td.odd_3 { background: #b18cbd; color: #FFF; }
div.Mb { margin-bottom: 27px; }


/*------------------------------------------------------------------------------------------------------------------------------------- 
common
-------------------------------------------------------------------------------------------------------------------------------------*/
.Left { text-align: left; }
.textCenter {text-align: center;}
.textRight {text-align: right;}
.color_1 { color: #4E65C2; }
.color_2 { color: #C60; }
.color_3 { color: #BD2626; }
.color_4 { color: #e540b1; }
.color_5 { color: #34c812; }
.strong {
  font-weight: bold;
}
.fontXL {font-size: 18px;}

/*------------------------------------------------------------------------------------------------------------------------------------- 
btn
-------------------------------------------------------------------------------------------------------------------------------------*/
a.btn_1 { display: block; margin: 0 auto; width: 294px; height: 84px; white-space: nowrap;text-indent: 100%;overflow: hidden;display: block;background-color: #d20038; }
a.btn_1:hover  { background-color: #472960; }



.btn {text-decoration: none;background: #b9004b;color: #fff;font-size: 21px;padding: 15px 30px;display: inline-block;font-weight: bold;margin-top: 5px;}
.btn:hover {color: #fffc00;background: #ee005b;}
/*-------------------------------------------------------------------------------------------------------------------------------------
footer
-------------------------------------------------------------------------------------------------------------------------------------*/
.footer { width: 100%; height: 84px; background: url('img/bg_copyright.gif') top center repeat-x; }
.copyright { width: 980px; margin: 0 auto; padding-top: 22px; height: 62px; font-size: 11px; color: #111; font-family: Arial; }
.copyright li { float: left; }
li.logo { margin: 12px 20px 0 20px ; width: 108px; height: 29px; background: url('img/logo_copyright.png') no-repeat; }
li.txt { margin: 21px 30px 0 100px; }
li.R12 { width: 43px; height: 43px; background: url('img/+12.gif') no-repeat; }
li.R15 { width: 43px; height: 43px; background: url('img/+15.gif') no-repeat;float: right;margin-right: 40px;} 


.prize {text-align: center;width: 668px;margin: 0 auto;min-height: 360px;}
.accountInfo {margin-bottom: 15px;}
.account {width: 450px;margin: 15px auto;}
.account li {text-align: left;line-height: 1.8em;}



.btnBox {border-top: 1px solid #d6d6d6;padding: 20px 0; text-align: center;}
.btnBox a {margin: 0 5px;}
#prize_1 .btnBox .clearFix {width: 500px;margin: 0 auto;}
#prize_2 .btnBox .clearFix,
#prize_3 .btnBox .clearFix {width: 247px;margin: 0 auto;}

.PocketsMoney {width: 435px;margin: 0 auto;}
.PocketsMoney li {float: left;margin: 0 10px 15px;}
.PocketsMoney li a {display: block;background: url('img/redPocketsMoney.jpg') 0px 6px no-repeat;width: 125px;height: 220px;}
.PocketsMoney li a:hover {background-position: 0px 0px;}

.space {margin-bottom: 20px;}

.getPrize ,
.getPrize2 {margin-bottom: 20px;line-height: 1.8em;}
.getPrize2 {display: none;}

#zone_fb_login,#zone_fb_like,#zone_xdb_select_gid {display: none;}

.pageNav:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html .pageNav             { zoom: 1; } /* IE6 */
*:first-child+html .pageNav { zoom: 1; } /* IE7 */
.pageNav {padding: 10px 0px 30px;}
.pageNav li {float: left;border-right: 1px solid #aaa;line-height: 15px;}
.pageNav li.last {border:none;}
.pageNav li a {padding: 0px 15px;color:#ae0001;}
.pageNav li a:hover,
.pageNav li.active a {color: #ff009b;text-decoration: none;}


.items ul {
  position: relative;
}
.items ul:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
* html .items ul ,
*:first-child+html .items ul { zoom: 1; } /* IE7 */

.items li {
  float: left;
  width: 31%;
  text-align: center;
  margin: 0 1% 15px;
  border: 1px solid #ccc;
  height: 150px;
  padding-top: 20px;
}
.items img {
  margin-bottom: 10px;
}