@charset "utf-8";
/* CSS Document */

/* 網站基本設定
---------------------------------------------*/
html,body {
	height:100%; /*垂直延伸*/
	color: #4e4e4e;
	background:url(../images/mobilr_content_bg.gif) repeat;
	text-align:justify; /*文章齊頭齊尾*/
	text-justify:inter-ideograph;/*文章齊頭齊尾*/
	font: 85% "微軟正黑體", verdana, Geneva;
	background: url(../images/body_bg.jpg) repeat;
}
a {
	color: #444;
	text-decoration: none;
	}
a:hover {
	color: #000000;
	text-decoration: none;
	}
img {	
    display: block;
}
.clean-float {
	clear: both;
}

/* 網站結構設定
---------------------------------------------*/
#wrapper {
	width:100%;
	margin: 0 auto;
	padding:30px 9px;
}
#header{
	position:relative;
	width:982px;
	height:218px;
	margin:0 auto;
	background: url(../images/inside_top.jpg) no-repeat;
	}
#content{
	width:902px;
	margin:0 auto;
	padding:0 40px;
	background: url(../images/insid_middle.jpg) repeat-y;
}
#footer{
	position:relative;
	width:982px;
	height:182px;
	margin:0 auto;
	background: url(../images/inside_bottom_footer.jpg) no-repeat;
	}
#footerContent{
	position:absolute;
	left: 20px;
	top: 70px;
}

/* Header Content
---------------------------------------------*/
#highSpeed{
	position:absolute;
	left:20px;
	top: 112px;
	z-index: 2;
	}
#colorWind01{
	position:absolute;
	left: 489px;
	top: 29px;
	}
#colorWind02{
	position:absolute;
	left: 599px;
	top: 70px;
	}
#fbShare{
	position:absolute;
	width:127px;
	height:23px;
	left: 836px;
	top: 520px;
	}
#fbShare a{
	display:block;
	height:100%;
	background: url(../images/fb_share_icon.gif) no-repeat;
	}
#fbShare a:hover{
	background: url(../images/fb_share_icon_o.gif) no-repeat;
	}
#navigation{
	width:980px;
	height:71px;
	position:absolute;
	display:block;
	left: 1px;
	bottom: 0;
	background: url(../images/index_menu_bar.png) no-repeat;
	z-index: 1;
	}
#menu{
	position:absolute;
	display:block;
	z-index: 2;
	right: 40px;
	top: 164px;
}
#menu li{
	display:block;
	margin-left:6px;
	float:left;
	}
#menu01{width:130px; height:37px;}
#menu01 a{
	display:block;
	height:100%;
	background: url(../images/menu_01.png) no-repeat;
	}
#menu01 a:hover{
	background: url(../images/menu_01_o.png) no-repeat;
}
#menu02{width:130px; height:37px;}
#menu02 a{
	display:block;
	height:100%;
	background: url(../images/menu_02.png) no-repeat;
	}
#menu02 a:hover{
	background: url(../images/menu_02_o.png) no-repeat;
} 
#menu03{width:130px; height:37px;}
#menu03 a{
	display:block;
	height:100%;
	background: url(../images/menu_03.png) no-repeat;
	}
#menu03 a:hover{
	background: url(../images/menu_03_o.png) no-repeat;
}
#menu04{width:209px; height:37px;}
#menu04 a{
	display:block;
	height:100%;
	background: url(../images/menu_04.png) no-repeat;
	}
#menu04 a:hover{
	background: url(../images/menu_04_o.png) no-repeat;
} 
#menu05{width:116px; height:37px;}
#menu05 a{
	display:block;
	height:100%;
	background: url(../images/menu_05.png) no-repeat;
	}
#menu05 a:hover{
	background: url(../images/menu_05_o.png) no-repeat;
} 

#app{
	position:absolute;
	left: 718px;
	top: 41px;
	z-index: 2;
	}
#headerTitle{
	position:absolute;
	z-index: 2;
	left: 47px;
	top: 6px;
	}
	
/* 專刊介紹 Content
---------------------------------------------*/
#pageTitle{ margin-bottom:10px; position:relative;}
#videoBg{
	position:relative;
	width:900px; height:495px;
	background: url(../images/page01_video_bg.png) no-repeat;
	}
#video{
	position:absolute;
	width:562px;
	height:316px;
	left: 170px;
	top: 117px;
	z-index: 4;
}
#videoLine{
	position:absolute;
	z-index: 3;
	left: 160px;
	top: 106px;
	}
#page01Content{
	position:relative;
}
#page01Content p{
	font: bold 15px "微軟正黑體", verdana, Geneva;
	color: #202020;
	margin-bottom:6px;
	}
#page01Content p a{
	display:block;
	height:100%;
	padding:2px 5px;
	text-decoration: none;
	color: #202020;
}
#page01Content p a:hover{
	color: #FFF;
	text-decoration: none;
	background: #111;
	}
#page01Content .leftTop{
	float:left;
	width:428px;
	height:424px;
	background: url(../images/page01_photo01.png) no-repeat;
	margin-bottom:10px;
}
#page01Content .rightTop{ 
    float:right;
	width:428px;
	height:424px;
	background: url(../images/page01_photo02.png) no-repeat;
	margin-bottom:10px;
	}
#page01Content .leftBottom{ 
    float:left;
	width:428px;
	height:424px;
	background: url(../images/page01_photo03.png) no-repeat;
	margin-bottom:10px;
	}
#page01Content .rightBottom{ 
    float:right;
	width:428px;
	height:424px;
	background: url(../images/page01_photo04.png) no-repeat;
	margin-bottom:10px;
	}
#page01Text01{
	position:absolute;
	left: 32px;
	top: 263px;
}
#page01Text02{
	position:absolute;
	left: 493px;
	top: 263px;
}
#page01Text03{
	position:absolute;
	left: 32px;
	top: 691px;
}
#page01Text04{
	position:absolute;
	left: 493px;
	top: 691px;
}
.while{ color:#fff;}
#order{
	position:relative;
	width:900px;
	height:202px;
	background: url(../images/page01_order_bg.png) no-repeat;
}
#orderBtn{
	position:absolute;
	width:367px;
	height:37px;
	left: 269px;
	top: 87px;
}
#orderBtn a{
	display:block;
	height:100%;
	background: url(../images/page01_order_btn.png) no-repeat;
}
#orderBtn a:hover{
	background: url(../images/page01_order_btn_o.png) no-repeat;
}
#phone{}
#phone .left{ float:left;}
#phone .right{ float:right;}

/* 下載抽 iPad mini
---------------------------------------------*/
#infoStep{ padding-top:10px; margin-bottom:5px;}
#infoDownload{}
#infoDownload dt{ padding-bottom:5px;}
#infoDownload_ios{ width:243px; height:40px;}
#infoDownload_ios a{
	display:block;
	height:100%;
	background: url(../images/page04_download_ios.png) no-repeat;
}
#infoDownload_ios a:hover{
	background: url(../images/page04_download_ios_o.png) no-repeat;
} 
#infoDownload_android{width:243px; height:40px;}
#infoDownload_android a{
	display:block;
	height:100%;
	background: url(../images/page04_download_android.png) no-repeat;
}
#infoDownload_android a:hover{
	background: url(../images/page04_download_android_o.png) no-repeat;
}
.infoContent01{ padding-top:30px;}
.infoContent01 h1{
	margin-bottom:10px;
	font-size: 18px;
	color: #000;
}
.infoContent01 h2{
	margin-bottom:10px;
	font-size: 18px;
	color: #000;
}
.infoContent01 .line{ margin-bottom:10px;}
.infoContent01 li{font-size: 15px; color: #000; padding-bottom:8px;}
.infoContent01 li.tip{
	padding-top:5px;
	font-size: 13px;
	color: #000;
}
.infoContent01 p{
	font-size: 15px;
	line-height: 28px;
	color: #000;
}
.infoContent01 td{ padding:5px 0; font-size: 15px; color: #000;}
.red{
	font-weight: bold;
	color: #F00;
}
#infoGift{padding-top:30px; display:block; position:relative;}
#infoGift li{ float:left; display:block; padding-right:80px; padding-bottom:15px;}
#infoGift li.right{ float:right; padding:0;}
#infoGift img{ margin:0; padding:0;}
#infoGift p{
	padding-top:18px;
	font-size: 13px;
	line-height: 21px;
	color: #000;
	text-align: center;
}
.giftIcon{
	width:72px;
	height:72px;
	position:absolute;
	top:30px;
	left: -14px;
	*top:-364px;
}

.infoContent02{ padding-top:30px; clear:both;}
.infoContent02 h1{ margin-bottom:10px;}
.infoContent02 .line{ margin-bottom:10px;}
.infoContent02 p{
	font-size: 15px;
	line-height: 28px;
	color: #000;
	letter-spacing: -0.05;
}

/* 照片票選
---------------------------------------------*/
#search{ position:relative; display:block; width:902px; height:35px;}
#search_name{
	position:absolute;
	top:0;
	left: 305px;
}
#search_name img{ margin-top:4px;}
#search_name dt{ float:left; margin-right:8px;}
#search_fb{
	position:absolute;
	right: 0px;
	top: 0px;
}
#search_fb img{ margin-top:4px;}
#search_fb dt{ float:left; margin-left:8px;}
.searchSelect{
	width:158px;
	padding:2px 2px;
	font-size: 13px;
	color: #000;
	background-color: #fff;
	border: 2px solid #5e5e5e;
}
.searchSelectFb{
	width:158px;
	padding:2px 2px;
	padding:3px 2px\9;
	font-size: 13px;
	color: #000;
	background-color: #fff;
	border: 2px solid #5e5e5e;
}
.searchBtn{width:50px; font-size: 13px;font-weight: bolder;color: #FFF; margin-top:0;}
.searchBtn a{
	color: #FFF;
	display:block;
	background: #595757 url(../inside_images/in_search_arrow_while.gif) no-repeat right center;
	padding:4px 8px 5px 8px;
	padding:3px 8px 5px 8px\9;
	*padding:5px 8px 5px 8px;
	height:17px;}
.searchBtn a:hover{background: #2c2c2c url(../inside_images/in_search_arrow_while.gif) no-repeat right center;text-decoration: none;color: #fff;} 

.fbLogin{
	position:absolute;
	width:100px;
	font-size: 13px;
	font-weight: bolder;
	color: #FFF;
	margin-top:0;
	right: 0px;
	top: 20px;
	text-align: center;
}
.fbLogin a{
	color: #FFF;
	display:block;
	padding:4px 8px 5px 8px;
	padding:3px 8px 5px 8px\9;
	*padding:5px 8px 5px 8px;
	height:17px;
	background: #0058c4;
}
.fbLogin a:hover{
	text-decoration: none;
	color: #fff;
	background: #004191;
} 

#voteMenuBox{ width:902px; display:block; padding:12px 0;}
#voteTip{ float:right; width:345px; padding-top:9px;}
#voteMenu{ float:left; width:530px;}
#voteMenu dt{ display:block; margin-right:8px; float:left;}
#voteMenu01{width:160px; height:36px;}
#voteMenu01 a{
	display:block;
	height:100%;
	background: url(../images/page02_menu01.gif) no-repeat;
	}
#voteMenu01 a:hover{
	background: url(../images/page02_menu01_o.gif) no-repeat;
} 
#voteMenu02{width:160px; height:36px;}
#voteMenu02 a{
	display:block;
	height:100%;
	background: url(../images/page02_menu02.gif) no-repeat;
	}
#voteMenu02 a:hover{
	background: url(../images/page02_menu02_o.gif) no-repeat;
} 
#voteMenu03{width:160px; height:36px;}
#voteMenu03 a{
	display:block;
	height:100%;
	background: url(../images/page02_menu03.gif) no-repeat;
	}
#voteMenu03 a:hover{
	background: url(../images/page02_menu03_o.gif) no-repeat;
} 

#voteList{ display:block; padding:20px 0; font: bold 15px Arial, Helvetica, sans-serif;}
#voteList li{ display:block; float:left; margin:7px; width:165px;}
.voteDetail{ 
	width:165px;
	display:block;
	border: 1px solid #b8b2a7;
	background: #FFF;
}
.voteDetail h1{
	padding:9px 0 7px 0;
	text-align: center;
	color: #774700;
	border-bottom: 1px dotted #bdb7a9;
	overflow:hidden;
	white-space: nowrap;
}
.voteDetail .photo{ width:156px; margin:0 auto; padding:6px 0;}
.voteDetail .writer{
	padding:5px 5px;
	border-top: 1px dotted #bdb7a9;
	border-bottom: 1px dotted #bdb7a9;
	font-size: 12px;
	color: #36271a;
	text-align: center;
	font-weight: normal;
}
.voteDetail .number{
	padding:8px 0;
	height:17px;
	background: url(../images/page02_vote_number.png) no-repeat;
	font-size: 15px;
	font-weight: bold;
	color: #1e0d00;
	text-align: center; 
	margin-bottom:1px;
}
.voteDetail .btn{}
.voteDetail .btn .left{ float:left; width:121px;}
.voteDetail .btn .right{ float:right; width:43px;}
.voteBtn01{width:121px; height:34px;}
.voteBtn01 a{
	display:block;
	height:100%;
	background: url(../images/page02_vote_btn.gif) no-repeat;
	}
.voteBtn01 a:hover{
	background: url(../images/page02_vote_btn_o.gif) no-repeat;
} 
.voteBtn02{width:43px; height:34px;}
.voteBtn02 a{
	display:block;
	height:100%;
	background: url(../images/page02_vote_no_btn.gif) no-repeat;
	}
.voteBtn02 a:hover{
	background: url(../images/page02_vote_no_btn_o.gif) no-repeat;
}

#voteBottomNumber{
	width:902px;
	height:38px;
	background: #FFF;
	filter: alpha(opacity=50);
    -moz-opacity:0.5;
    opacity:0.5;
	margin-top:15px;
}
.PageNum{
	height:22px;
	display:block;
	margin-top:30px;
	padding:0 10px;
	background: #FFF;
}
.PageNum li{
	float:right;
	margin-left:8px;
	font-size: 13px;
	color: #333;
}
.PageNum li.title{
	float:right;
	display:block;
	padding:3px 5px;
	color: #333;
	font-weight: bold;
}
.PageNum li.now{
	display:block;
	padding:3px 5px;
	color: #fff;
	text-decoration:none;
	background: #FF7900;
	font-weight: bold;
	}
.PageNum li a{
	display:block;
	padding:3px 5px;
	color: #333;
	text-decoration:none;
	font-weight: bold;
	}
.PageNum li a:hover{
	display:block;
	padding:3px 5px;
	color: #fff;
	text-decoration:none;
	background: #FF7900;
	}

.winnerBtn{
	position:absolute;
	width:168px; height:37px;
	left: 300px;
	bottom: 0px;
}
.winnerBtn a{
	display:block;
	height:100%;
	background: url(../images/winner_icon.png) no-repeat;
}
.winnerBtn a:hover{
	background: url(../images/winner_icon_o.png) no-repeat;
} 
