@charset "utf-8";

/*

一般HTML內建標記的樣式設定

*/

body {
	margin:0;
	font-family:微軟正黑體,Arial, Helvetica, sans-serif, Verdana, 新細明體;

}



table {

	/*font-family: 微軟正黑體, Arial, Helvetica, sans-serif, 新細明體;*/

	/*font-family: Arial, Helvetica, sans-serif, 微軟正黑體, 新細明體;*/

	border-collapse:collapse;

}

img{
	max-width:100%;}







a:link       {

/*	color: #333333;*/

	text-decoration: none;

}

a:visited    {

/*	color: #333333;*/

	text-decoration: none

}

a:hover     {

/*	color: #382f30;*/

	text-decoration: none

}


a {
  color: #a36b41;
  text-decoration: none;
}

a:hover,
a:focus {
  color: #b2975e;
  text-decoration: underline;
}

a:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}





form {

	margin: 0px 0px 0px 0px;

}

/*

input {

	font-family: Verdana, Geneva, sans-serif, 微軟正黑體;

}

*/



/*版面自訂區塊樣式*/

/*字型顏色樣式*/

/* 90%的文字大小*/

.font9 {

	font-size: .9em;

}

.font8 {

	font-size: .8em;

}

/*綠色*/

.cg {

	color: #979829;

}

.cred {

	color: #ff0000;

}

.cwhite {

	color: #fff;

}

.cblue {

	color: #0000ff;

}



/*gray color1. 用在商品簡介..*/

.cgray1 {

	color: #515050;

}







/*網頁內容區塊最外層*/

#ContentMain {
	min-height: 100%;
  height: auto !important;
  height: 100%;

  background-image: url(../image_m/bg.jpg);
background-repeat: repeat;

}



/*header樣式*/

#PageHeader {

	width: 100%;
	text-align: left;
	padding:10px;



}
#PageHeader .container{
	position:relative;

}


/*header 區功能bar樣式*/

#PageTop {

	width: 100%;

	height: 33px;

	float:left;

	line-height: 33px;

	text-align: left;

	background:url(../images/topbar.jpg) left top no-repeat;

}



/*header 跑馬標題樣式*/

.marquee_title {

	width: 110px;

	height: 33px;

	line-height: 33px;

	float:left;

	margin-left: 20px;

	color:#FFFFFF;

}



/* 跑馬燈訊息樣式*/

.marquee {

	width: 500px;

	height: 33px;

	line-height: 33px;

	float:left;

	margin-left: 5px;

	color:#FFFFFF;

}

/* 跑馬燈訊息 內文超連結 樣式*/

.marquee a:link	{

	color: #fff;

	text-decoration: none;

}

.marquee a:visited    {

	color: #fff;

	text-decoration: none

}

.marquee a:hover     {

	color: #FF9;

	text-decoration: none

}





/*yui 加入購物車的跳出視窗css, 因為要讓訊息視窗居中且一開始看不到 */

#message_dialog {
	z-index:1000;

	width: 320px;

	opacity: 0.9;

	-moz-opacity:0.9;

	filter:alpha(opacity=90);

	display:none;

	margin: 0 auto;

	position:fixed;

  	top:50%;

  	left:50%;

  	margin-top:-80px;

  	margin-left:-160px;

	_position: absolute;

	_top:expression(documentElement.scrollTop+(documentElement.clientHeight-this.clientHeight)/2);

  	_margin-top:0;
	min-height:300px;



}





/*Pagetop區 會員區樣式*/

.pagetop_r {

	width: 340px;

	height: 33px;

	line-height: 33px;

	float:left;

	margin-left: 5px;

	color: #ddff82;

}

/*Pagetop區 會員區連結樣式*/

.pagetop_r_link a:link {

	color: #ddff82;

	text-decoration: none;

}

.pagetop_r_link a:visited {

	color: #FF9;

	text-decoration: none;

}

.pagetop_r_link a:hover {

	color: #FF9;

	text-decoration: none;

}



/*Pagetop區 購物車連結樣式*/

.pagetop_r_cart a:link {

	color: #fff000;

	text-decoration: none;

}

.pagetop_r_cart a:visited {

	color: #FF9;

	text-decoration: none;

}

.pagetop_r_cart a:hover {

	color: #FF9;

	text-decoration: none;

}



/* 內頁區------------------------------------ */

/*PageBody 網頁內容區塊最外層*/

#PageBody {
	width: 100%;
	font-size:120%;

	
}



/*網頁內頁下方選單Footer */

#PageFooter {
	clear: both;
	padding: 20px;
	line-height: 2;
	text-align: center;
	color: #fff;
	margin-top: 20px;
	background-color: #a36b41;
}


#PageFooter hr{
	border-top-color: #a36b41;
	border-right-color: #a36b41;
	border-bottom-color: #a36b41;
	border-left-color: #a36b41;
	margin:3px 0px;
	}


/*Footer 超連結樣式 */

#PageFooter a:link {

	color: #fff;

	text-decoration:none;

}



#PageFooter a:visited {
	color: #FFFCC1;
	text-decoration: none;
}



#PageFooter a:hover {

	color: #fff000;

	text-decoration:underline;

}



/*Footer 瀏覽器限制的文字樣式 */

#PageFooter .browser {

	color: #dd9b9d;

}

/*Footer email連結的文字樣式 */

.footermail {

	color: #fff;

}

.footermail:link {

	color: #fff;

}

.footermail:visited {

	color: #fff;

}

.footermail:hover {

	color: #fff;

	text-decoration:underline;

}





/*選單區配置*/
#PageHeader{
	
	}
#PageMenu {
	background-color: #a36b41;	
	font-size:120%;
	text-align:center;
	
}
#PageMenu  ul{
	margin:0px;
	padding:0px;
	list-style:none;
	line-height:2;}
#PageMenu  ul li{
	display:inline-block;
	padding:0px 0px;}
	
#PageMenu  ul li a{
	color: #fff;
	text-decoration: none;
	display:inline-block;
	padding:5px 5px;

}
#PageMenu  ul li a:hover{
	/*border-bottom-width: 5px;
	border-bottom-style: solid;
	border-bottom-color: #dab068;
		padding:5px 0px 0px 0px;*/
		background-color:#572405;
		
	}

.navbar-collapse {
  max-height:600px;
}

.navbar-toggle .icon-bar {
	background-color: #a36b41;
}
.navbar-toggle {
	position:absolute;
	top:25px;
	left:0px;

}

.navbar-toggle:hover, .navbar-toggle:focus {
	background-color: #f5d399;
}



/*左方選單上方的商店Logo*/

.StoreImage {

	margin: 0px 0px 0px 10px;

}



.MenuItem {

	width: 136px;

	height: 28px;

	color: #fff;

	margin: 0px 0px 0px 10px;



}

.MenuItem a:link {

	width: 110px;

	height: 28px;

	line-height: 28px;

	display:block;

	background: url(../images/menuleft_off.jpg) left center no-repeat;

	color: #fff;

	margin: 0;

	padding: 0px 0px 0px 26px;

}

.MenuItem a:visited {

	width: 110px;

	height: 28px;

	line-height: 28px;

	display:block;

	color: #fff;

	margin: 0;

	padding: 0px 0px 0px 26px;

	background: url(../images/menuleft_off.jpg) left center no-repeat;

}

.MenuItem a:hover {

	color: #ffffff;

	background: url(../images/menuleft_on.jpg) left center no-repeat;

}



/*自訂按鈕樣式，如結帳或送出鈕，如果是要用自己的按鈕型式的話*/

.cbutton {

	width: 94px;

	height: 26px;

	line-height: 26px;

	text-align: center;

	display: block;

	background: url(../images/icon_button.gif) left center no-repeat;

}



/*左邊商店資訊樣式*/

#CustInfo {



	

}

#CustInfo a:link {



}

#CustInfo a:visited {



}

#CustInfo a:hover {



}

/*商店資訊每列樣式*/

.infolist {

	

}
.clearboth{
	clear:both;}
	
.social-icons {
	position:absolute;
	top:0px;
	right:2px;

  list-style: none;
  padding: 10px 0;
  margin-bottom: 0;
}
.social-icons li {
  float: left;
}
.social-icons li.row-end {
  margin-right: 0;
}
.social-icons img{
	margin:auto;}
.social-icons a {
	text-align:center;
	border: 3px solid #949494;  
	  font-size: 28px;
	  line-height:18px;
	display: inline-block;


  width: 40px;
  height: 40px;
  text-align: center;
  padding-top: 4px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;

  margin-right: 10px;
  float: right;
  
  color:#fff;
}
a.logo{ color:#a36b41; font-size:140%;}
.logo img{
	display:inline-block;}
.social-icons a:hover {
	
 /* background: #6091ba;*/
}
.social-icons a .fa {
  color: #fff;
}
#myCarousel{
	margin:20px 0px 30px;}
#myCarousel img{ width:100%;}	
#myCarousel	.carousel-indicators{
	bottom:-40px;}
.carousel-indicators li {
  border: 1px solid #9a9a9a;
  width:15px;
  height:15px;
  margin-left:3px;
}
.carousel-indicators .active {
	background-color: #9a9a9a;
	  width:17px;
  height:17px;
}
#div_goodnews h2,#div_hotnews h2,#div_hotway h2{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #382f30;
	padding-left:45px;
	height:50px;
	line-height:45px;
background-repeat: no-repeat;
	}
#div_goodnews h2{
	background-image: url(../image_m/index_icon01.png);

	}	
#div_hotnews h2{
	background-image: url(../image_m/index_icon01.png);

	}
#div_hotway h2{
	background-image: url(../image_m/index_icon02.png);

	}
#div_hotnews ul,#div_goodnews ul,.list_style ul{
	margin:0px;
	padding:0px;
list-style:none;
list-style-position:inside;
color:#666;}
#div_hotnews ul a,#div_goodnews ul a,.list_style ul a{
	color:#000;}
#div_hotnews ul li,.list_style ul li{
	padding-left: 10px;
	padding-bottom: 5px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCE6DE;
	background-image: url(../image_m/list_icon.png);
	background-repeat: no-repeat;
	background-position: left 5px;
	margin-bottom:10px;
	}	
#div_goodnews ul li{
	padding-bottom:3px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #382f30;
	
	}	
#div_hotway img,.album_list img{ width:100%;

-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px; }
#div_hotway [class^=col-] .container,#div_hotway [class^=col-] .container{

	padding:0px;
	margin-bottom:10px;
		background-color:#FFF;
	box-shadow: 1px 3px 3px #D8D8D8; 
-webkit-box-shadow: 1px 3px 3px #D8D8D8;
-moz-box-shadow: 1px 3px 3px #D8D8D8; 
}
	
.pro_more a{
	text-align:center;
	width:100%;}	

#div_hotway [class^=col-]  .content,#div_hotway [class^=col-]  .content{

	margin:10px;

}

#div_hotway img{
	margin:auto;}
#div_hotway [class^=col-] h3,#div_hotway [class^=col-] h3{
	/*border-top-width: thin;
	border-top-style: solid;
	border-top-color: #CCC;*/
	text-align:center;
	

	padding:5px 0px;
	font-weight:bolder;
	margin:0px ;
	font-size:120%;}
.price01{
	color:#F00; text-align:right;}	
.more2{
	
	background-color:#a36b41;
	display:inline-block;
	padding:5px 10px;
	color:#fff;
	margin-top:5px;
	-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}		
.more2:hover{
	background-color:#572405;
	color:#fff;
	}
		
.more{
	float:right;
	background-color:#a36b41;
	display:inline-block;
	padding:5px 10px;
	color:#fff;
	margin-top:5px;}		
.more:hover{
	background-color:#572405;
	color:#fff;
	}
.address{
	display: inline-block;
	padding-left: 30px;
	background-image: url(../image_m/icon_map.png);
	background-repeat: no-repeat;
}	
.tel{
	display: inline-block;
	padding-left: 30px;
	background-image: url(../image_m/icon_tel.png);
	background-repeat: no-repeat;
}	
.mail{
		display: inline-block;
	padding-left: 30px;
	background-image: url(../image_m/icon_mail.png);
	background-repeat: no-repeat;
	}
.fax{
		display: inline-block;
	padding-left: 30px;
	background-image: url(../image_m/icon_fax.png);
	background-repeat: no-repeat;
	}	
.pushinfo img{
	padding: 5px;
	
		}


.membetmenu {
	-moz-box-shadow:inset 0px 34px 0px -15px #ffffff;
	-webkit-box-shadow:inset 0px 34px 0px -15px #ffffff;
	box-shadow:inset 0px 34px 0px -15px #ffffff;
	background-color:#ededed;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#777777;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:9px 23px;
	text-decoration:none;
	text-shadow:0px -1px 0px #ffffff;
}
.membetmenu:hover {
	background-color:#dfdfdf;
}
.protable{
	 display: flex;}


@media all and (min-width:480px) {
	.pushinfo{
	
		padding-top:50px;}
		}
@media (max-width: 768px) {
#PageHeader img{
	
	margin:auto;
}

	.social-icons a {
	width:35px;
	height:35px;
	margin-top:30px;
}
.navbar-toggle {
	top:30px;
}
a.logo{ color:#a36b41; font-size:120%;}
#PageHeader img{
	height:25px;
	
	margin:auto;
}
#PageHeader .logo img{
	height:50px;}
	
#PageHeader{
	text-align:center;}

 #PageMenu {
	 background-image:none;
	 margin-top:30px;
	
} 	
}
	
@media all and (min-width: 320px) and (max-width: 480px) {






#PageMenu  ul li{
	display: block;
	margin: 0px;
	padding: 0px;
	line-height: 2;
	padding-left: 10px;
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
	text-align:left;
		}
#PageMenu  ul li a{
	color:#FFF;
		padding-left:10px;
		display:block;
		width:100%;}		
#PageMenu  ul li a:hover{
	color:#FF6;

	/*padding:5px 0px 5px 0px;	*/
	border-bottom-width: 0px;
	border-bottom-style: none;
	border-bottom-color: #dab068;
	/*
	border-left-width: 10px;
	border-left-style: solid;
	border-left-color: #dab068;*/
	
	}		
		}
/*
#572405 -hover
#a36b41
#ad1c15
#382f30 線
#f5d399 選單背景
*/