@charset "utf-8";
/* CSS Document */
/*- global -*/
html{margin-top: 0 ! important}
body{background: url(../images/bg.jpg) #fff8ea repeat-x 0 0;font:13px/100% "微軟正黑體","Microsoft JhengHei",Arial,Helvetica,sans-serif; color:#505050}
#wrapper{width: 100%;z-index: 1}
#wrapper, #container, .content  /*#main, #gift, #register*/{position: relative}
.summary, .fb, .cover, .big_box, .gift, .small_box, .register_btn, .pad_top, .pad_bottom{position: absolute}
#header, #nav{position: fixed;z-index:90}
#header, #footer{background-color:#000;width: 100%;height: 40px}
/*- global -*/
/*- layout css -*/
/*- header -*/
#header{top:0}
.logo{margin: 10px 0 0 20px}
/*- header -*/
/*- container -*/
.content{min-height:600px;width:960px;margin: 0 auto}
/*-- nav -*/
#nav{top:10%;right:0}
#nav > ul > li{width: 146px;text-indent: -9999px;margin-bottom: 5px}
#nav > ul > li.vote{margin-bottom: 0}
#nav > ul > li a{display:block}
#nav > ul > li.login a, #nav > ul > li.login a, #nav > ul > li.vote a, #nav > ul > li.register a, #nav > ul > li.interests a{background: url(../images/nav_btn_bg.png) no-repeat}
#nav > ul > li.login a{width: 146px;height: 52px}
#nav > ul > li.login a:hover{background-position: -300px 0}
#nav > ul > li.vote a{background-position: 0 -100px;
	width: 147px;
	height: 49px}
#nav > ul > li.vote a:hover{background-position:-300px -100px}
#nav > ul > li.register a{
	background-position: 0 -200px;
	width: 147px;
	height: 54px}
#nav > ul > li.register a:hover{background-position:-300px -200px}
#nav > ul > li.interests a{
	background-position: 0 -300px;
	width: 147px;
	height: 49px}
#nav > ul > li.interests a:hover{background-position:-300px -300px}
/*-- nav -*/
.cover{right: -1%;
    top: 22%;
    z-index: 30}
.big_box{top:39%;right:-2.5%;z-index:15}
.gift{right:8%;
    top:15%;z-index:20}
.small_box{   right:3%;
    top: 30%;
    z-index: 10}
/*-- main -*/
#main{background: url(../images/main_bg.png) center 0 no-repeat}
#main > .content > .summary > .box{font-size:18px;color: #c75f1a;font-weight: bold;margin-bottom: 10px}
.summary{min-width: 540px;top:41%;left:0;z-index:100}
.summary > .box > .left, #main .summary .txt{margin-left: 65px}
.summary > .box > .right{margin-right: 75px}
.summary > .box > .right a{color: #c75f1a;display: block}
.fb{ left: 310px;
    top: 230px}
.counter > li{float: left;margin-right:10px}
.counter > li{background: url(../images/num_bg.png) no-repeat;width: 59px;height:85px;text-align: center;padding-top: 30px}
.counter > li >span{font-family: impact;font-size: 54px;color: #fff}
.counter > .icon{
 	background: url(../images/icon_num.png) 0 3px no-repeat;
 	width:55px;
 	height:72px}
.btn{margin:0 0 0 65px}
.btn > li{float: left;text-indent: -9999px}
.btn > li > a{background: url(../images/main_btn_bg.png) no-repeat;display: block;height: 38px;width: 123px}
.btn > li > a:hover{background-position: 0 -100px;display: block}
.btn > li.list a{background-position: right 0}
.btn > li.list a:hover{background-position: right -100px}
/*-- main -*/
/*-- gift -*/
#gift{background: url(../images/gift_bg.png) center 60px no-repeat;padding-top: 130px}
#gift > .content > .title{width: 287px;margin:0 auto 20px}
#gift > .content > .txt{width: 557px;margin:0 auto 20px}
.gift_list{/*margin-left:14%*/width: 800px;margin: 0 auto}
.gift_list li{float: left;margin-right:100px;/*text-align: center*/}
.gift_list li.gift_warranty{margin-right: 0}
.gift_list > li > .box{margin: 0 auto 10px}
.vote_num{background: url(../images/vote_num_title.png) no-repeat;height: 55px;padding-left:60px ;text-align:right;}
.vote_num > span{font-family: Helvetica;font-size: 32px;font-weight: bold;color: #2c5780;line-height: 180%;padding-right: 2px}
.vote_btn a{
	background: url(../images/gift_btn_bg.png) no-repeat;
	width: 168px;
	height: 51px;
	display: block;
	text-indent: -9999px}
.vote_btn a:hover{background-position: 0 -100px}
.gift_list .gift_nexus7{text-align: center}	
/*.gift_list .gift_coupon .box{margin-top:17px}
.gift_list .gift_coupon .vote_num{margin-left:35px; width: 110px;}
.gift_list .gift_coupon .vote_btn{margin-left: 40px}*/
/*.gift_list .gift_warranty .vote_num{margin-left:10px; width: 110px; }*/
/*.gift_list .gift_warranty .vote_btn{margin:0 0 0 15px}*/
.gift_list .vote_btn{width: 168px;margin: 0 auto 10px}
.gift_list .vote_num{width: 108px;margin: 0 auto 10px}
/*-- gift -*/
/*-- register -*/
#register{background: url(../images/register_bg.png) center 313px no-repeat;padding-top: 130px}
#register .content{height:600px; position: relative;}
#register > .content > .title{width: 287px;margin:0 auto 20px}
#register > .content > .txt{width: 487px;margin: -20px auto;z-index: 50}
.register_btn{
	left:10%;
    top: 25%;
    display: block;
	z-index: 30}
#register > .content > .goto_register a { 
	width: 234px;
	height: 53px;
	background: url(../images/register_btn02.png) top no-repeat;
	margin:20px auto 20px}
#register > .content > .goto_register a { display: block; width: 234px; height: 58px; }
#register > .content > .goto_register a span { visibility: hidden; }
#register > .content > .goto_register a:hover { background-position: bottom; }

.goto_login { width: 260px; padding:20px 30px; height:118px; position: absolute; top: 320px;z-index:100; left: 320px; background: url(../images/register_block_bg.png)}
.goto_login .close a { position: absolute; right: 0px; top: 0px; width: 20px; height: 20px; background: url(../images/close.gif) no-repeat;}
.goto_login .close a span { visibility: hidden;}
.goto_login ul { width: 280px; margin: 10px auto; display: block;}
.goto_login ul li { width: 121px; height:38px; float: left; margin: 2px;}
.goto_login ul li a { display: block; width: 121px; height:38px; }
.goto_login ul li a span { visibility:  hidden; }
.goto_login .register_menu_login a { background: url(../images/register_menu.png) top left;}
.goto_login .register_menu_sign a { background: url(../images/register_menu.png) top right;}
.goto_login .register_menu_login a:hover { background: url(../images/register_menu.png) bottom left;}
.goto_login .register_menu_sign a:hover { background: url(../images/register_menu.png) bottom right;}


.pad_top{right:5%;top:-5%}
.pad_bottom{bottom: 28%;
    right:5%}
/*-- register -*/
/*- container -*/
/*- footer -*/
#footer{bottom:0}
#footer > ul{margin: 15px 0 0 20px}
#footer > ul > li{display: inline-block;border-right:1px solid #333}
#footer > ul > li a{color: #606060;padding: 0 5px}
#footer > .right > p{color: #969696;line-height: 160%;margin:10px 20px 0 0}
#footer .pic{margin-right: 10px}
#footer .last{border-right:none}
/*- footer -*/
/*- global -*/
.left{float: left}
.right{float: right}
.blue{color: #005fc0}
.red, .red a{color:#e30000}
.red02{color: #ff3000}
.clear{clear:both}
a{text-decoration:none}
.clearfix:before, .clearfix:after {content: "";display:table}
.clearfix:after{clear:both}
.clearfix{zoom:1}
/*- global -*/

/*- loading -*/
#loading { width: 100%; height: 100%; z-index: 9999; position: fixed;top:0;left:0; background: #f4e8e0; }
#loading #loading_block { position: absolute; top: 30%; left: 46%; width: 167px; height: 172px;}
#loading #loading_black, #loading #loading_color  { width: 167px; height: 172px; position: absolute; }

#loading #loading_black { background: url(../images/loading_black.png); z-index: 999; }
#loading #loading_color { background: url(../images/loading_blue.png); z-index: 1000; }

#loading p { padding-top: 180px; text-align: center; }
/*- loading -*/
/*- inside -*/
#inside { background: url(../images/inside_bg_2.jpg);}
#inside_header { height: 349px; width: 100%; background: url(../images/inside_bg_1.jpg) repeat-x top; }
#inside_header_rules { height: 300px; width: 100%; background: url(../images/inside_bg_1.jpg) repeat-x bottom; }
.header_title { width: 980px; margin: 0 auto; position: relative; }
.header_title p { text-align: center; padding-top: 20px; position: relative;z-index: 0}
.header_title .awards_gift { display: block; position: absolute; top: 150px ; left: -50px; width: 300px; height: 300px }
.header_title .rules_gift { display: block; position: absolute; top: 100px ; left: -70px; width: 300px; height: 300px }
/*.back{display: block;
    height: 150px;
    left: 25%;
    position: absolute;
    top: 15%;
    width: 500px;
	z-index: 90;
	text-indent: -9999px}*/
#inside_content { width: 980px; margin: 0 auto 100px auto;}
.inside_menu ul { width: 121px; float: right; display: block; position: absolute; right: 150px; bottom: 0px;}
.inside_menu ul li { width: 121px; height:38px; float: left; margin: 2px;}
.inside_menu ul li a { display: block; width: 121px; height:38px; }
.inside_menu ul li a span { visibility:  hidden; }
.inside_menu .inside_menu_rules a { background: url(../images/menu_inside.png) top left;}
.inside_menu .inside_menu_awards a { background: url(../images/menu_inside.png) top right;}
.inside_menu .inside_menu_rules a:hover { background: url(../images/menu_inside.png) bottom left;}
.inside_menu .inside_menu_awards a:hover { background: url(../images/menu_inside.png) bottom right;}

/*- inside -*/
/*- awards -*/
.awards_box, .awards_top, .awards_bottom { width: 696px; margin: 0 110px 0 auto;}
.awards_box { margin-top: 30px;}
.awards_top { height: 20px; background: url(../images/award_box_top.png) no-repeat;}
.awards_bottom { height: 34px; background: url(../images/award_box_bottom.png) no-repeat;}
.awards_inner { padding: 0 40px; width: 616px;  background: url(../images/award_box_bg.png) repeat-y;}
.awards_inner h2 { width: 120px; height: 36px; text-indent: -9999px;}
h2.awards_title1 { background: url(../images/awards_subtitle1.jpg); }
h2.awards_title2 { background: url(../images/awards_subtitle2.jpg); }
h2.awards_title3 { background: url(../images/awards_subtitle3.jpg); }
.awards_inner h3 { font-size: 18px; line-height: 40px;}
.awards_inner p { font-size: 15px; line-height: 26px;}
.awards_inner img { float: left;}
.awards_txt {float: left; width: 400px; }

.awards_green { color: #2c6568; }
.awards_gold { color: #825c24; }
.awards_purple { color: #564364; }
/*- awards -*/

/*- rules -*/
.awards_title, #rule_content h3 { font-size: 15px; color: #dc4a5b; line-height: 30px; }
#rule_content  a { color: #dc4a5b;}
#rule_content  a:hover { text-decoration: underline;}
#rule_content { width: 580px; margin: 10px auto 0 250px; text-align: justify; padding-bottom: 200px;}
#rule_content p { line-height: 26px; }
#rule_content ul { line-height: 24px;}
#rule_content ul li { display: block; float: left; }
#rule_content ul li.level_1_item { width: 20px; }
#rule_content ul li.level_1_content { width: 560px; }
#rule_content ul li.level_2_item { width: 32px; text-align: center; padding-left: 10px; clear: both;}
#rule_content ul li.level_2_content { width: 538px; }
#rule_content ul li.level_3_item { width: 30px; text-align: center; padding-left: 36px; }
#rule_content ul li.level_3_content { width: 514px; }
#rule_content ul li.level_4_item { width: 80px; text-align: center; padding-left: 62px; }
#rule_content ul li.level_4_content { width: 430px; }
/*- rules -*/

/*- rules -*/
/*- rules -*/
.link{cursor: pointer}
/* less than 1024px */
@media only screen and (max-width:1024px){
	#main{
	background: url(../images/main_bg.png) center 90px no-repeat;
	-webkit-background-size: 100% auto;
	-moz-background-size: 100% auto;
	background-size: 100% auto}
}
/*- layout css end-*/