@charset "utf-8";

/* CSS Document */
/************************************************************************************
RESET
*************************************************************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
	outline: 0;
	font-family: "微軟正黑體";
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body {	
	margin:0;
	padding: 0;
}

ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
   /* border-collapse: collapse;*/
    border-spacing: 0;
}


a img {
	border: none;
}

a:hover {text-decoration:none;}

.clean { clear:both;}

.clearfix {
  overflow: auto;
}

img { width:100%;}

/************************************************************************************
STRUCTURE 主要區塊
*************************************************************************************/

body {
	font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
	background:url(images/body_bg.jpg); 	
}
h1,h2,h3 { display:none; }


.intop_box{
	max-width: 960px;
	position:relative;
	margin: 0 auto;
}

.ob_box{
	background:url(images/top_bg_tablet.jpg);
	line-height:0;
}

.sale_txt{
	padding:10px 0px 0px 0px;
	color: #4a4a4a;
	font-weight: bold;
	margin:0 auto;
	text-align: center;
	line-height: 1.5;
}
.sale_info p{
	font-size: 16px;
	display:inline-block;
	margin-bottom: 13px;	
}

.sale_info{
	padding:0px 0px 20px 0px;
	color: #4a4a4a;
	font-weight: bold;
	margin:0 auto;
	text-align: center;
	line-height: 1.5; 
}

.sale_info span{
	display: block;
}

.sale_info a{
	background:url(images/btn.png) left top;
	display:inline-block;
	text-indent: -9999px;
	width:162px;
	height: 36px;
	vertical-align:middle;
	margin-top:-10px; 
}

.sale_info a:hover{
	background:url(images/btn.png) right top;
}

.desktop_none{
	display: none;
}

.product_box{
	max-width: 960px;
	margin: 0 auto;
	padding: 15px 0 0 0;
}

.product_box .title p{
	text-indent: -9999px;
	display: block;
	margin: 0 auto;
	background-size:contain; 
	max-width: 334px;
	height: 60px;
	margin-bottom:20px;
	background:url(images/product_title.jpg); 
}

.product_list{
	padding: 0 10px;
}

.product_list > ul{
	padding-top: 10px
}

.product_list > ul > li {
	background: #fff;
	border-radius:10px; 
	margin: 0 5px 30px 5px;
	box-shadow: 2px 2px 2px 1px rgba(208, 164, 148, 0.2);
}

.product_list > ul > li:hover{
	box-shadow: 1px 1px 2px 3px rgba(208, 164, 148, 0.7);
}

.product_list > ul > li a{
	color: #4a4a4a;
	padding:8px;
	display: block;
}

.product_list > ul > li a .title{
	font-size: 19px;
	line-height: 1.6;
	font-weight: bold;
}
.product_list > ul > li a .time_tag{
	display:inline-block;
	background: #d2354c;
	font-size: 13px;
	color: #fff;
	padding: 2px 8px;
	border-radius:25em; 
}
.product_list > ul > li a .time_txt{
	color:#d2354c;
	display: inline-block;
	font-size:14px;
}

.product_list > ul > li a img{
	border-radius:4px 4px  0 0; 
}

.product_list > ul > li ul.list_txt{
	font-size: 14px;
	display: block;
	padding-top:5px;
	min-height:65px;
}

.product_list > ul > li a .price{
	padding:18px 0 0 0;
	text-align: center;
}

.product_list > ul > li a .price .txt{
	font-size: 15px;
	color: #414141;
}
.product_list > ul > li a .price .sale{
	color:#e31835;
	margin: 0 2px;
	font-size:29px;
	font-family: Arial, Helvetica, sans-serif;
	line-height:12px;
	font-weight: bold;
}
.product_list > ul > li a .price .sale span{
	font-size:18px;
}

.orange{
	color:#ef3800;
}

.link_more{
	text-align: center;
	padding-bottom: 50px;}

.link_more a{
	text-indent: -9999px;
	display:inline-block;
	width:198px;
	height: 40px;
	background: url(images/link_more.jpg) left top;
}

.link_more a:hover{
	background: url(images/link_more.jpg) right top;
}


/*==========SubPage_優惠訊息============*/

.info_rapper{
	max-width: 960px;
	margin: 0 auto;
}

.info_title{
	background:  url(images/sub_page_title_bg.jpg) left top;
	height: 78px;
}

.info_title p{
	display: block;
	text-indent: -9999px;
	margin: 0 auto;
	background: url(images/sub_page_title.jpg) left top;
	width: 138px;
	height: 38px;
	position: relative;
	top:20px;
}

.info_rapper{
	max-width: 960px;
	padding: 30px 25px;
}
.info_txt{
	background:url(images/sub_page_txt_bg.jpg) left top;
	border-radius:10px; 
}

.info_txt ul{
	list-style: disc;
	padding: 0px 10px 15px 30px;
}

.info_txt ul p{
	text-indent: -17px;
	font-weight: bold;
}

.info_txt ul li{
	font-size: 14px;
	line-height: 1.8;
}

.info_txt .des{
	padding: 15px;
	line-height: 1.8;
	font-weight: bold;
	font-size: 18px;
	color:#be1634;
}



@media only screen and (min-width:580px) {

	.product_list > ul{
		overflow: auto;
	}

	.product_list > ul >li{
		width: 45%;
		margin: 0 2.5% 30px 2.5%;
		float:left;
		overflow: hidden;
	}
	
	.link_more a{
		margin-right:5%;
		text-indent: -9999px;
	}

	


}


/*--------------平版_start---------------*/
@media only screen and (min-width:768px) {
	.main_top{
		background:url(images/top_bg.jpg) center top repeat no-repeat; 	
	}
	.ob_box{
		height: 776px;
		background:url(images/ob_bg.png) center top  no-repeat no-repeat; 	
	}

	.sale_info{
		padding-top: 329px;
		z-index: 10;
		position: relative;
	}

	.intop_box img.tablet_none{
		display: none;
	}
	.sale_txt{
		background:url(images/ob02.png) ;
		width: 628px;
		height: 305px;
		position: absolute;
		left: 50%;
		top:110px;
		margin-left:-324px; 
		padding-top: 220px;
	}
	.desktop_none{
		display: block;
	}
	.desktop_none img{
		width: auto;
	}
	.ob06{
		position: absolute;
		left:3%;
		top:70px;
	}
	.ob03{
		position: absolute;
		top:450px;
		left: 50%;
		margin-left: -420px;
	}
	.ob04{
		position: absolute;
		top:410px;
		left: 50%;
		margin-left: -102px;
	}
	.ob05{
		position: absolute;
		top:460px;
		left:50%;
		margin-left:90px;
	}
	.ob01{
		position: absolute;
		left:50%;
		top:55px;
		margin-left: -150px;
	}

	.link_more {
		overflow: auto;
	}

	.link_more a{
		float: right;
	}




}


/*--------------桌機版_start---------------*/
@media only screen and (min-width:960px) {

	.product_list > ul >li{
		width: 29%;
		margin: 0 1.5% 30px 1.5%;
	}
	
	
	
}