@import url("reset.css");
/*----------------------------------------------前導頁CSS----------------------------------------------------------*/
body#INDEX{background-color:#87d791;}

#INDEX_WRAPPER{background: url(../img/bg.jpg) 0 0 no-repeat;background-position:center top;width:100%;background-color:#3ec5eb;}
#INDEX_CONTENT{position:relative;width:1000px;height:840px;margin:0 auto;	}

/*百變LOGO*/
#LOGO a{width:260px;height:141px;text-indent:-9999px; background: url(../img/logo.png) 0 0 no-repeat; display:block; position:absolute; left:0px; top:4px;}
#LOGO a:hover{background-position:0 -141.5px;}

/*熱門連結*/
#LINK ul{ width:260px;height:70px;position:absolute; left:750px; top:5px;}
#LINK li{float:left;}
#LINK li a{width:65px;height:70px;text-indent:-9999px; background: url(../img/link_btn.png) 0 0 no-repeat; display:block;}
#LINK li.ba_btn a{background-position:0 0; position:absolute;left:0px;}
#LINK li.ga_btn a{background-position:-65px 0;position:absolute;left:65px;}
#LINK li.fb_btn a{background-position:-128px 0;position:absolute;left:128px;}
#LINK li.as_btn a{background-position:-191px 0;position:absolute;left:191px;}

#LINK li.ba_btn a:hover{background-position:0 -80px;}
#LINK li.ga_btn a:hover{background-position:-65px -80px;}
#LINK li.fb_btn a:hover{background-position:-128px -80px;}
#LINK li.as_btn a:hover{background-position:-191px -80px;}

/*註冊區塊*/
#LOGIN_BLOCK{margin:0 auto; width:710px; height:717px; background:url(../img/login_bg.png) 0 0 no-repeat; z-index:2;}
#LOGIN_BLOCK ul{ width:280px;height:250px; position:absolute; left:482px;top:347px;}
#LOGIN_BLOCK li{ margin:10px auto; font:bold 12px/14px "微軟正黑體",sans-serif;}
#LOGIN_BLOCK li a{ color:#412319;}
.bar{ border:#362e2b 1px solid; height:25px; width:173px; color:#F0F;}
.codebar{ border:#362e2b 1px solid; height:25px; width:94px; float:left;color:#F0F;}
.codeimg{ border:#362e2b 1px solid; height:25px; width:67px;float:left; margin-left:10px;}
.checkarea{ width:285px; height:24px; position:absolute; left:376px; top:558px; margin:10px auto; font:bold 12px/16px "微軟正黑體",sans-serif; color:#412319;}
.checkarea a{ font: bolder 12px/16px "微軟正黑體",sans-serif; color:#ff3700;}

/*註冊區塊按鈕*/
#LOGIN_BLOCK h2{ position:absolute;left:375px;top:605px;}
#LOGIN_BLOCK h3{ position:absolute;left:575px;top:605px;}
#LOGIN_BLOCK h2 a{ width:200px; height:68px;background:url(../img/login_btn.png) 0 0 no-repeat; text-indent:-9999px; display:block;}
#LOGIN_BLOCK h2 a:hover{background-position:0px -70px; }
#LOGIN_BLOCK h3 a{ width:70px; height:68px;background:url(../img/login_btn.png) 0 0 no-repeat; text-indent:-9999px; display:block; background-position:-200px 0;}
#LOGIN_BLOCK h3 a:hover{background-position:-200px -70px; }

/*活動按鈕*/
#ACT_BTN ul{width:350px; height:215px; position:absolute; top:510px; left:690px; z-index:0;}
#ACT_BTN li a{width:350px;height:215px;text-indent:-9999px; background: url(../img/act_btn.png) 0 0 no-repeat; display:block;}
#ACT_BTN li.activity a{ background-position:0 0; z-index:0;}
#ACT_BTN li.activity a:hover{ background-position:-350px 0; z-index:0;}


/*回官網對話框*/
#BACK a{width:115px; height:109px;background:url(../img/back_btn.png) 0 0 no-repeat; text-indent:-9999px; display:block; position:absolute; top:335px; left:875px;}
#BACK a:hover{width:115px; height:109px;background:url(../img/back_btn.png) 0 0 no-repeat;background-position:-115px 0;}

/*FOOTER*/
#FOOTER{width: 100%;height: 90px;background:url(../img/footer_bg.png) 0 0 repeat-x;text-align: center;}
#FOOTER img{margin-top:15px;}

/*訊息視窗*/
#MESSAGE_BOX{width:380px;height:255px;position:relative;background:url(../img/mes_bg.png) 0 0 no-repeat;}
/*關閉按鈕*/
#MESSAGE_BOX a.close{width:40px;height:40px;position:absolute; top:15px;right:15px;background:url(../img/mes_btn.png) 0 0 no-repeat; text-indent:-9999px; display:block;}
#MESSAGE_BOX a.close:hover{background-position:-50px 0;}
/*訊息文字*/
#MESSAGE_BOX h1{width:200px;height:80px; margin:0 auto; font: bolder 16px/24px "微軟正黑體",sans-serif; color:#0FF; text-align:center;padding-top:85px;}
/*下載遊戲，確認按鈕*/
#BTNS {width:280px; height:45px; margin:0 auto;}
#BTNS2 {width:130px; height:45px; margin:0 auto;}
#BTNS li{float:left;width:130px; height:45px;margin:0 2px;}
#BTNS li a,#BTNS2 li a{width:130px; height:45px; background:url(../img/mes_btn.png) 0 0 no-repeat; text-indent:-9999px;display:block;}
#BTNS li.game_download a{background-position:0 -45px;}
#BTNS li.confirm a,#BTNS2 li.confirm a{background-position:-130px -45px;}
#BTNS li.game_download a:hover{background-position:0 -93px;}
#BTNS li.confirm a:hover,#BTNS2 li.confirm a:hover{background-position:-130px -93px;}


/*----------------------------------------------內頁CSS----------------------------------------------------------*/
body#INNER{background-color:#77d8e8;}

#INNER_WRAPPER {margin: 0 auto;width: 100%;background:url(../img/bg_main.jpg) 0 0 no-repeat;background-position:center top;}
#INNER_CONTENT {position: relative;margin: 0 auto;width: 1000px;height: 355px;}
#INNER_CONTENT h2 a{position:absolute;top:0;left:-10px;display:block;  width: 280px;height: 120px;border:0px;text-indent:-9999px;}
#INNER_CONTENT h3 a{position:absolute;top:17px;left:380px;display:block;  width: 120px;height: 40px;border:0px;text-indent:-9999px;}
#INNER_CONTENT h4 a{position:absolute;top:17px;left:402px;display:block;  width: 120px;height: 40px;border:0px;text-indent:-9999px;}
#INNER_CONTENT h5 a{position:absolute;top:17px;left:625px;display:block;  width: 145px;height: 40px;border:0px;text-indent:-9999px;}
#INNER_CONTENT h6 a{position:absolute;top:17px;left:772px;display:block;  width: 140px;height: 40px;border:0px;text-indent:-9999px;}

/*活動按鈕*/
#INNER_CONTENT ul{width: 1100px;height: 115px;background:url(../img/menu_bg.png) 0 0 no-repeat; background-position:left; position:absolute; top:380px;}
#INNER_CONTENT li{ float:left;}
#INNER_CONTENT li a{ display:block; width:205px; height:115px; background:url(../img/menu_btn.png) 0 0 no-repeat; text-indent:-9999px; }
#INNER_CONTENT li.BTN01 a{ background-position:0px 0px;}
#INNER_CONTENT li.BTN01 a:hover{ background-position:0px -115px; }
#INNER_CONTENT li.BTN02 a{ background-position:-205px 0px;}
#INNER_CONTENT li.BTN02 a:hover{ background-position:-205px -115px; }
#INNER_CONTENT li.BTN03 a{ background-position:-410px 0px;}
#INNER_CONTENT li.BTN03 a:hover{ background-position:-410px -115px; }
#INNER_CONTENT li.BTN04 a{ background-position:-615px 0px;}
#INNER_CONTENT li.BTN04 a:hover{ background-position:-615px -115px; }
#INNER_CONTENT li.BTN05 a{ background-position:-820px 0px;}
#INNER_CONTENT li.BTN05 a:hover{ background-position:-820px -115px; }

/*活動內容*/
#CONTENT{ width: 950px; margin:0 auto; background:url(../img/frame_mid.png) 0 0 repeat-y;}
#CONTENT ul{  width: 800px; margin:0 auto; font-size:13px;font-family:Arial, Helvetica, sans-serif;letter-spacing:1px;color: #552e05;line-height:28px;}
li.title{width:480px;height:105px;background:url(../img/content_title.png) 0 0 no-repeat;margin:0 auto;	top:-20px;}

#CONTENT .activity1{background-position:0 0;}
#CONTENT .activity2{ background-position:-480px 0;}
#CONTENT .activity3{background-position:-960px 0;}
#CONTENT .activity4{background-position:-1440px 0;}
#CONTENT .activity5{background-position:-1920px 0;}

#CONTENT li.subtitle{width:500px;font:bold 15px/20px "新細明體";color: #486a00;margin:0 auto;text-align:center;}

#TOP{ width:950px; height: 133px; margin:0 auto; background:url(../img/frame_top.png) 0 0 no-repeat;}
#BOTTOM{ width:950px; height: 77px; margin:0 auto; background:url(../img/frame_btm.png) 0 0 no-repeat;}

.title02 {font-size: 15px;font-weight: bold;color: #004a05;line-height:30px;}
.space{ padding-top:10px;padding-bottom:15px;}
.space2{ padding-top:20px;padding-bottom:10px;}

.tittle03{font-size: 17px;font-weight: bold;color: #FFF;}

table {border:solid 1px #004a05;}
td{ line-height: 22px; height:55px; vertical-align:middle;text-align:center;}

.t01 {background-color:#004a05;font-weight:bold;color:#FFF;}
.t02{background-color:#004a05;color: #004a05;font-weight:bold;}
.t03{color: #004a05;background-color: #d9f2a1;}

.t_bolder{ font-weight:bolder;}
.t_red{color:#F0F;}



#INNER_FOOTER{height: 88px;width: 100%;background:url(../img/footer_bg2.jpg) 0 0 repeat-x;background-position:center top;}
