@charset "utf-8";
/***********************************************************************
 @ filename         : basic.css
 @ author           : twin lin
 @ description      : 基本版型
 @ media            : screen
 @ modified         : 2013-1-24
**********************************************************************/

/************basic************/
body {margin:0; padding:0; background:#FFF; color:#FFF; text-align:center;}
html, body {
	color: #000;
	font-size:100%;
	font-family:Microsoft JhengHei, Arial, Helvetica, sans-serif, PMingLiU, "微軟正黑體","黑體";
	text-align: justify;
}
body {
	background:url(../images/basic/body_bg.jpg) center repeat;
}
a {
	color: #313131;
	text-decoration: none;
}
a:hover {
	color: #313131;
	text-decoration: none;
}
/************主框架************/
.addp{position:fixed;}
div.header_bar{
	background:url(../images/basic/head_bar.gif) 0 0 repeat-x;
	width:100%;
	height:5px;	
}
div#wrapper {
	background:url(../images/basic/bg_it.png)center 0 repeat;	
	width:640PX;
	position:relative;
	margin:0 auto;
}

div.QA_frame_back{
	width:640px;
	height:1360px;
	position: absolute;
	top:0;
	left:50%;
	margin-left:-320px;
	/*border:1px solid #FFF;*/
	z-index:999;
}
/**** 關閉按鈕 ****/
a.btn_close {
	width: 105px;
	height: 125px;
	background: url(../images/QA/btn_close.png) no-repeat 0 0;
	top: 25px;
	right: 45px;
    }

/************上方標題************/
div#header {
	width:100%;
	height:745px;
	background:url(../images/basic/header_bg.png) center 0  no-repeat;
	position:relative;
}
div#header h1 {
	width:175px;
	height:50px;
	background:url(../images/basic/logo.png) 0 0 no-repeat;
	position:absolute;
	text-indent:-200em;
	overflow:hidden;
	top:20px;
	left:50%;
	margin-left:-87px;
	
}
a.b_btn{
	width: 290px;
	height: 90px;
	background: url(../images/basic/btn_play.png) 0 0 no-repeat;
	position: absolute;
	text-indent: -200em;
	overflow: hidden;
	top: 560px;
	left: 50%;
	margin-left:-145px;
	z-index: 10;
	}
/************選單************/
/* 黑幕 */
div.mban{
width:100%;
height:100%;
position:fixed;
background:#000;
filter:alpha(opacity=0);/* for IE */
opacity:0;
-webkit-opacity:0;
-moz-opacity:0;
-o-opacity:0;
z-index:90;
}

div#main_menu {}
div.main_menu_hide{
	width: 60px;
	height: 60px;
	background: url(../images/basic/menu_hide.png) 0 0 no-repeat;
	position: absolute;
	top: 10px;
	left: 15px;
	z-index: 100;
}

div.main_menu_hover{
	background: url(../images/basic/menu_show.png) 0 0 no-repeat;
}

div#main_menu a{
	width: 180px;
	height: 50px;
	display:block;
	text-indent:-2000em;	
}

div.menu_show{
	width: 182px;
	height: 645px;
	position: absolute;
	top: 0;
	left: 0px;
	background: url(../images/basic/nav_bg.png) 30px 0 no-repeat;
	z-index:99;
	filter:alpha(opacity=0);/* for IE */
	opacity:0;
	-webkit-opacity:0;
	-moz-opacity:0;
	-o-opacity:0;
}
ul#nav {}
ul#nav li.menu1,ul#nav li.menu2,ul#nav li.menu3,ul#nav li.menu4,ul#nav li.menu5,
ul#nav li.menu1_hover,ul#nav li.menu2_hover,ul#nav li.menu3_hover,ul#nav li.menu4_hover,ul#nav li.menu5_hover{
	width:240px;
	height:100px;
	position:absolute;
	display:block;
}

ul#nav li.menu1{left:0;top:194px}
ul#nav li.menu2{left:0;top:283px}
ul#nav li.menu3{left:0;top:372px}
ul#nav li.menu4{left:0;top:465px}
ul#nav li.menu5{left:0;top:565px}

ul#nav li.menu1_hover{left:0;top:194px;background:url(../images/basic/nav_1.png) 0 100% no-repeat;text-indent:-200em;overflow:hidden;}
ul#nav li.menu2_hover{left:0;top:283px;background:url(../images/basic/nav_2.png) 0 100% no-repeat;text-indent:-200em;overflow:hidden;}
ul#nav li.menu3_hover{left:0;top:372px;background:url(../images/basic/nav_3.png) 0 100% no-repeat;text-indent:-200em;overflow:hidden;}
ul#nav li.menu4_hover{left:0;top:465px;background:url(../images/basic/nav_4.png) 0 100% no-repeat;text-indent:-200em;overflow:hidden;}
ul#nav li.menu5_hover{left:0;top:565px;background:url(../images/basic/nav_5.png) 0 100% no-repeat;text-indent:-200em;overflow:hidden;}

ul#nav li.menu1 a,ul#nav li.menu2 a,ul#nav li.menu3 a,ul#nav li.menu4 a,ul#nav li.menu5 a,
ul#nav li.menu1 a:link,ul#nav li.menu2 a:link,ul#nav li.menu3 a:link,ul#nav li.menu4 a:link,ul#nav li.menu5 a:link{
	width:240px;
	height:100px;
	display:block;
	text-indent:-200em;
	overflow:hidden;
}
ul#nav li.menu1 a,ul#nav li.menu1 a:link{
	background:url(../images/basic/nav_1.png) 0 0 no-repeat;
}
ul#nav li.menu2 a,ul#nav li.menu2 a:link{
	background:url(../images/basic/nav_2.png) 0 0 no-repeat;
}
ul#nav li.menu3 a,ul#nav li.menu3 a:link{
	background:url(../images/basic/nav_3.png) 0 0 no-repeat;
}
ul#nav li.menu4 a,ul#nav li.menu4 a:link{
	background:url(../images/basic/nav_4.png) 0 0 no-repeat;
}
ul#nav li.menu5 a,ul#nav li.menu5 a:link{
	background:url(../images/basic/nav_5.png) 0 0 no-repeat;
}
ul#nav li.menu1 a:hover,ul#nav li.menu2 a:hover,ul#nav li.menu3 a:hover,ul#nav li.menu4 a:hover,ul#nav li.menu5 a:hover{
	background-position:0  100%;
}


/************麵包屑************/
div#aside {
}

/************內容************/
div#title{
	width:100%;
	height:60px;
	position:absolute;
	z-index:-1;
	top:665px;	
	left:50%;
	margin-left:-320px;
}
div#content {
	width:100%;
	margin:0 auto 20px;
   /* border: 1px solid #000;*/
}
ul#food_list{}
ul#food_list li{
	background:url(../images/index/food_list.png) 0 0 no-repeat;
	width:576px;
	height:700px;
	margin:0 auto 18px;
	position:relative;
}
ul#food_list li  div.food_pic{
	max-width: 510px;
	max-height:220px;
	border-radius: 10px;
	-moz-border-radius: 10px; /* 老的 Firefox */
	position: absolute;
	left: 35px;
	top: 20px;
	overflow:hidden;
}
ul#food_list li  div.food_pic img{
	max-width: 510px;
}

ul#food_list li  div.inn_tit{
	width: 510px;
	height: 40px;
	position: absolute;
	left: 37px;
	top: 250px;
	color: #b48753;
	font-size: 155%;
	font-weight: 500;
	letter-spacing: 0.05em;
}

ul#food_list li  div.inn_tit a{
	color:#b48753;
	font-weight:500;
}
ul#food_list li  div.inn_tit a:hover{
	color:#b48753;
	font-weight:500;
}

ul#food_list li  div.inn_con{
	width: 510px;
	height: 250px;
	position: absolute;
	left: 37px;
	top: 300px;
}
ul#food_list li  div.inn_con h2{
	font-size:160%;
	letter-spacing:0.1em;
	color:#ed1f00;
	margin-bottom:5px;
}
ul#food_list li  div.inn_con p{
	font-size: 160%;
	letter-spacing: 0.1em;
	color: #332718;
	text-align: justify;	
}

ul#food_list li  div.fb_share{
	width: 160px;
	height: 60px;
	position: absolute;
	left: 30px;
	top: 585px;
}
ul#food_list li  div.fb_share img.fb_pic{
	border:1px solid #cdb69d;
	border-radius: 100%;
	-moz-border-radius: 100%; /* 老的 Firefox */	
	float:left;
	margin-right:5px;
}
ul#food_list li  div.fb_share div.fb_name{
	font-size:80%;
	color:#000000;
	float:right;
	width:90px;
	height:20px;
	padding-top:10px;
}
ul#food_list li  div.fb_share div.fb_like{
	float:right;
	width:90px;
	height:30px;
}

ul#food_list li div.btn_share{
	width: 110px;
	height: 95px;
	position: absolute;
	right: 30px;
	top: 550px;
}
ul#food_list li div.btn_share a,ul#food_list li div.btn_share a:link{
	background:url(../images/index/btn_share.png) 0 0 no-repeat;
	width: 110px;
	height: 95px;
	text-indent:-200em;
	display:block;
	 -webkit-transition:all .2s ease-in-out;
     -moz-transition:all .2s ease-in-out;
     -o-transition:all .2s  ease-in-out;
     transition:all .2s  ease-in-out;
}
ul#food_list li div.btn_share a:hover{
	/*background-position:0 100%;*/
	background:url(../images/index/btn_share_hover.png) 0 0 no-repeat;
	transform:scale(1.05,1.05);
	-ms-transform:scale(1.05,1.05); 	/* IE 9 */
	-moz-transform:scale(1.05,1.05);	/* Firefox */
	-webkit-transform:scale(1.05,1.05);/* Safari 和 Chrome */
	-o-transform:scale(1.05,1.05); 	/* Opera */
}

 /*clear float*/
  .clear:before, .clear:after {
	  content: "";
	  display: table;
  }
  .clear:after {
	  clear: both;
  }
  .clear {
	  zoom:1; /*IE6, IE7*/
  }

/************置頂按鈕************/
a#goto_top {
		display: block;
		width:70px;
	height:85px;
	background:url(../images/basic/goto_top.png) no-repeat 0 0;
	position: relative;
	margin:0 auto 20px;
	z-index:9999;
}

/**** 按鈕reset ****/
a.btn_reset {
	position: absolute;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	z-index: 9999;
	text-indent:-200em;
	overflow:hidden;
    }