@charset "utf-8";
@import url("reset.css");
html,body{ width:100%; height: 100%; }
html{ font-size:16px; -webkit-text-size-adjust:none;}/*-------iOS 旋轉手機畫面時，鎖定文字不縮放的方式----*/
body { font-family: "微軟正黑體",Verdana, Arial, Helvetica, sans-serif ; background-color: #feece0;}
/*----css 清除浮動技巧------*/
.clearfix:before,.clearfix:after { content: " "; display: table;}
.clearfix:after {clear: both;}
.clearfix {*zoom: 1; }
/*-------css 清除浮動技巧----*/

.btn { cursor:pointer;
}
#wrapper {
	min-height: 100%;
	*display: table; /* For IE7 Hack */
	
	width:100%;
	min-width: 1000px;
	background-color: #fde5c9;	
	*min-height: 100%;	
	 
}


#header{
	width:100%;
	height:100px;
	position:relative;
	z-index:99;	
	background-color: #ea4515;
	box-shadow:0 0 10px #aa1b21 ;/*overflow: hidden*/;
}
.headerNav{ width:1000px; margin:0 auto;  position:relative;height:100px;/*overflow: hidden*/}
 
.headerNav .title {
	background-image: url(images/title.png);
	width:585px;
	height: 93px;
	background-repeat: no-repeat;
	position: absolute;
	left: 200px;
	top: 0px;	
}

.headerNav .title a{
	display:block;height: 100%;	width: 100%;
}



.headerNav .date {
	position: absolute;
	top: 15px;
	right: 15px;
	width:136px;
	height:72px;
	background-image: url(images/date.png);
}

.headerNav .logo{
	background-image: url(images/711.png);
	height: 43px;
	width: 126px;
	position: absolute;
	left: 0px;
	top: 0px;
}

.headerNav .logo a{ display:block;height: 100%;	width: 100%;}




#footer {
	position: relative;
	width:100%;
	min-width: 1000px;
	color: #FFF;
	background-color: #ea4515;
	text-align: center;
	line-height: 60px;
	height: 60px;
	font-size: 0.813em;
	margin-top: -60px; /* negative value of footer height */
	clear: both;	
}

#footer a{
	color: #FFF;
	text-decoration: none;	
}

#footer a:hover{
	color: #FFF;
	text-decoration: underline;
}
#footer .copright {
	text-align: center;
	width: 700px;
	height: 60px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	
}

#footer .copy1 {
	float: left;
}

#footer .copy2 {
	float: left;
	line-height: 25px;
	background-color: #FFF;
	height: 25px;
	margin-top: 18px;
	color: #ea575d;
	margin-left: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding-right: 5px;
	padding-left: 5px;
	
}


#footer .copy2  a{
	color: #ea575d;
	text-decoration: none;
}

#footer .copy2  a:hover{
	color: #ea575d;
	text-decoration: underline;
}



#index_section {
	width: 1000px;
	padding-top: 25px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;	
	padding-bottom:60px;/* negative value of footer height */
	}
	

	
#index_section ul {
	width: 825px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left:  auto;
	padding-top: 10px;
	display: block;
	padding-bottom: 10px;
	font-size:0;
	}
	
#index_section ul li {
	height: 146px;
	width: 412px;
	display: inline-block;
	*zoom:1;
	*display:inline;
}

#index_section ul li a{
   display: block;	
	
}




#index_section ul li img {
	width:100%;		height:auto;
}


/*#index_section h1 {
		width:820px;
	height:160px;
	background-image: url(images/top_banner.png);
	margin-left: 90px;
	background-repeat: no-repeat;
}*/


#index_section  h1{
	text-align: center;
	}


#index_section  h1 img {
	width:820px;		height::160px;
	
}

#page_section h1 a{
	display: block;
}

#page_section h1{
	/*text-align: center;*/margin-left:5px;
	}


/*#page_section h1 img {
	width:960px;		height::234px; 
	
}*/

/*.banner_up{
	font-size: 0.875em;
	color: #333;
	clear: both;
	margin-left:15px;
	text-align: center;
	}

.banner_up a{
	color: #EA575D;
	text-decoration: none;
	}
.banner_up a:hover{
	color: #EA575D;
	text-decoration: underline;
	}*/


.banner_up{
	font-size: 0.938em;
	color: #333;
	clear: both;
	margin-left:15px;
	text-align: center;
	line-height:1.4em;
	
	}

.banner_up a{
	color: #EA575D;
	text-decoration: none;
	}
.banner_up a:hover{
	color: #EA575D;
	text-decoration: underline;
	}

/*
#index_section h1{
	text-align: center;
	}


#index_section h1 img {
	width:820px;		height::160px;
}
*/
#index_section h2 {
	margin-bottom: 10px;
	text-align: center;	
}



#index_section h2 img {
	width:820px;		height::160px;
	
	}
	
	
/* -----------內頁-----------------*/	
#page_section {
	width: 1000px;
	padding-top: 25px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;	
	padding-bottom:60px;/* negative value of footer height */
	}
#wrapper .all {
	text-align: center;
	display: block;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
		
.menu {
	width: 100%;
	height: 63px;
	background-color: #e9c88c;
	position: relative;
	font-size: 0.938em;
	font-weight: bold;
	
}



.menu  ul {
	text-align: center;
	width: 1000px;
	height: 63px;
	padding:0;
	margin: 0 auto;
	
	/*選單沒有設寬度 置中作法*
	/*font-size: 0;*/
}



.menu li{
	
	float: left;	
	width: 12.5%;		
	
	/*選單沒有設寬度 置中作法*/
	/*display: inline-block;*/
	/*font-size: 15px;*/ 
	/*text-align: center;*/
}


.menu a {
	color: #ea4515;
	display: inline-block;	
	text-align: center;
	text-decoration: none;
	line-height: 63px;
	padding-right: 10px;
	padding-left: 10px;	
	}
.menu li a {
	width:100%;  /*選單沒有寬置中作法(要拿掉)*/
	border-right: 1px  dotted #ea4515;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

.menu li a:hover {
	color: #ffffff;	
	
}
.menu li:last-child a {
	border-right: 0;
}
.menu a:hover, .menu a:active {
	background-color: #94252b;
	
}

.menu .on a {
	background-color: #94252b;
	color: #FFF;	
}

.menu a#pull {
	display: none;  /*先把手機板的menu隱藏起來*/
}	

#page_section ul li {
	height: 325px;
	width: 230px;
	background-color: #FFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-left: 10px;
	float: left;
	margin-bottom: 20px;
	
}



#page_section  .pic
 {
	height: 140px;
	width: 215px;
	margin-top: 7px;
	margin-left: 7px;
	margin-bottom: 6px;
	position: relative;
   overflow: hidden;
}

#page_section .pic img {
/*	height: auto;
	width: 100%;
    */
}
/*#page_section .pic .notice {
	color: #FFF;
	font-size: 0.75em;
	background-color: #000;
	position: absolute;
	bottom: 0px;
	height: 16px;
	width: 215px;
	z-index: 10;
	text-align: center;
	letter-spacing: 0.2em;
}*/


#page_section .pic .notice {
	position: absolute;
	bottom: 0px;
	left: 4px;
	height: 16px;
	width: 209px;
	/*width: 200px;*/
	z-index: 10;
	background-color: #000;
	
	
}



#page_section li  h3{
	font-size: 0.875em;
	margin-left: 10px;
	/*height: 35px;*/
	width: 210px;
	margin-top: 1px;
	margin-bottom: 3px;
	overflow: hidden;
		
				}
				
html>body #page_section li  h3{

	font-size: 0.875em;
		
				}				
				
				
#page_section li  h2{
	font-size: 0.85em;
	margin-left: 10px;
	margin-top: 3px;
	margin-bottom: 5px;
	font-weight: normal;
	color: #FFF;
	background-color: #ea4515;
	height: 20px;
	width: 60px;
	line-height: 20px;		
	padding-left: 5px;
	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	/*詳細規格*/
}	

#page_section li  h2 a{	
	color: #FFF;
	text-decoration: none;
}	

	
#page_section li  h2:hover{
	
	text-decoration: underline;	
	
}	

#page_section  p{
	font-size:0.813em;
	margin-left: 10px;
	float: left;
	line-height: 20px;
	height: 20px;
	margin-bottom: 5px;
	overflow: hidden;
	width: 165px;
	color: #fd0225;
}
#page_section h4 {
	background-color: #2d8474;
	height: 20px;
	font-size:0.813em;
	color: #FFF;
	line-height: 20px;
	float: right;
	margin-right: 10px;
	margin-bottom: 5px;	
	padding-right: 3px;
	padding-left: 3px;

}

#page_section h4.red {
	background-color: #f9333e;
}


#page_section h5 {
	display: block;
	font-size:0.813em;
	color: #6e6f6e;
	font-weight: normal;
	clear: both;
	/*overflow: hidden;*/
	height: 35px;		
	margin-top: 5px;
	margin-left: 10px;
	width: 210px;
}
#page_section h6 {
	width: 210px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #adaead;
	clear: both;
	margin-left: 10px;
	
}

.page_title {display:none;}


/*#page_section li h2 {
	font-size: 0.813em;
	color: #FFF;
	background-color: #000;
	height: 25px;
	padding-left: 15px;
	float: left;
	display: block;
	margin-top: 5px;	
	酒
}*/

#page_section .barnotice {
	color: #FFF;
	background-color: #000;
	height:70px;
	width: 100%;
	clear: both;
	line-height: 70px;
	text-align: center;
	margin-bottom: 15px;
	font-size: 3em;
}
#page_section .barwar {
	color: #FFF;
	background-color: #000;
	height:70px;
	width: 100%;
	clear: both;
	line-height: 70px;
	text-align: center;
	margin-bottom: 15px;
	font-size: 3em;
}





/*-----------------------------------詳細規格 母親節--------------------------------------------*/

#box_block {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1000;
	left: 0px;
	top: 0px;
}
#box_block #box_bg {
	background-color: #000;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	z-index: 1000;
	/*background:url(images/alpha_bg.png) repeat left top\9; /*ie8 ie7*/
	
	/* works for IE 5+. */
    filter:alpha(opacity=50);
	/* works for IE 8. */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	/* works for old school versions of the Mozilla browsers like Netscape Navigator. */
    -moz-opacity:0.5;
	/* This is for old versions of Safari (1.x) with KHTML rendering engine */
    -khtml-opacity: 0.5;
	/* This is the "most important" one because it's the current standard in CSS. This will work in most versions of Firefox, Safari, and Opera. */  
    opacity: 0.5;
	position: absolute;	
}

	
#box_block #box {
	background-color: #FFF;
	/*height: 400px;*/
	height:auto;
	/*height:90%;*/
	padding-bottom: 20px;
	width: 520px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	position: relative;
	left: 50%;
	/*top: 150px;*/
	top: 15px;
	z-index:1010;
	margin-left: -260px;
	font-size: 1.125em;
	color: #333;
	overflow: auto;	
	
}

#box #bxclose {
	position: absolute;
	top: 0px;
	right: 0px;
	background-image: url(images/close.png);
	background-repeat: no-repeat;
	width:50px;
	height:50px;
	cursor:pointer;
}



a#box #bxclose:hover {
		-webkit-animation:example 1s ease 0s alternate none ;
		-moz-animation:example 1s ease 0s alternate none ;
		animation:example 1s ease 0s alternate none ;
	}	
	
	@-webkit-keyframes example { from{-webkit-transform:rotate(0deg); } to{-webkit-transform:rotate(360deg); } }
	@-moz-keyframes example { from{-moz-transform:rotate(0deg); } to{-moz-transform:rotate(360deg); } }
	@keyframes example { from{transform:rotate(0deg); } to{transform:rotate(360deg); } }
	

#box_block h3 {	
   text-align: center;
	margin-bottom:15px;
	font-size: 1.625em;
	padding-top: 20px;
}

#box_block h5 {
	font-size: 1.125em;	
	margin-bottom: 15px;
	color: #403a3a;
	margin-left: 20px;	
	margin-right: 20px;

}

.display{
	display: block;
}

.nodisplay{
	display: none;
}




#box_block #box p {
	font-size: 1em;
	margin-left: 20px;	
}

#box .qrbox {
	height: 131px;
	width: 480px;
	margin-top: 15px;	
	margin-left: 10px;
	display: inline-block;
	text-align: center;	
}

#box .qrbox .qr1 {
	
	float: left;	
}


#box .qrbox .qr2 {
	/*float: left;	*/
	
	vertical-align: middle;	
	display: inline-block;
}

.barcodeTarget{
	vertical-align: middle;
	display: inline-block;
	margin-top: 25px;
}



/*------------------------------------------------------------------------------*/
#wrapper  #finally {
	height: 300px;
	width: 500px;
	position: relative;
	left: 50%;
	top: 100px;
	z-index:1010;
	margin-left: -250px;
}
#finally h1 {
	font-size: 2.813em;
	letter-spacing: 0.5em;
	text-align: center;
	margin-left: 20px;
	color: #f0000d;
}
#finally .btngo {
	height:126px;
	width: 500px;
	
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 10px;
}

#finally .btngo  img{
	width: 100%;
	height: auto;	
}

/*------------------------------------詳細規格 母親節------------------------------------------*/


/*信用卡的申辦banner*/

#card_banner {
	background-image: url(images/bottom_banner.png);
	width: 965px;
	height:118px;
	background-repeat: no-repeat;
	position: relative;
}
#card_banner .cbtn {
	width:186px;
	position: absolute;
	bottom: 16px;	
	background-repeat: no-repeat;
	right:32px;
}

#card_banner .cbtn1 {
	width:186px;
	position: absolute;
	bottom: 16px;
	background-repeat: no-repeat;
	left:362px;
}

#card_banner .cbtn a.go{
	display:block;
	height:45px;
	background-image: url(images/btn1.png);
	background-repeat: no-repeat;
	
}

#card_banner .cbtn1 a.go{
	display:block;	
	height:45px;
	background-image: url(images/btn1.png);
	background-repeat: no-repeat;
	
}





/*========================手機版========================================================*/
@media screen and (max-width: 640px) {
	
	*{
	box-sizing:border-box;
}

html,body{
	width:100%;
	min-height:100%;
	-webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box;    
    box-sizing: border-box;	
}	

#wrapper {width:100%; min-width: 100%;}	




#header{
	width:100%;	
	height:auto;	
	position:relative;
	z-index:99;	
	/*background-color: #e9565e;*/
	box-shadow:0 0 10px #aa1b21 ;
}
.headerNav{ 
	width:100%; 
    height:0;
	padding-bottom:30%;
	position:relative;	
	}
 
.headerNav .title {
	background-image: url(images/title.png);
	width:100%;
	height:0;
	padding-bottom:15.8%;
	
	position: absolute;	
	top: 35%;
	
	left:0%;
	
	background-size:contain;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;	
}

.headerNav .title a{
	display:block;width:100%;
	height:0;
	padding-bottom:20.4%;
}



.headerNav .date {
	position: absolute;
	top: 0%;
	right: 0%;
	width:200px;
	height:43px;
	background-image: url(images/date_mobie.png);
}

.headerNav .logo {
	background-image: url(images/711.png);
	background-size:contain;
	height: 43px;
	width: 126px;	
	position: absolute;
	top: 0%;
	left:0%;
		 
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;	
	    
  }
  
  
.headerNav .logo a{ display:block;height: 100%;	width: 100%;}

#index_section{
	width:100%;
	position:relative;
	margin:0 auto;
	padding-top: 15px;
}




#index_section ul {
	width:100%;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left:  auto;
	padding-top: 5px;
	display: block;
	padding-bottom: 10px;
	font-size:0;
	}
	

#index_section ul li {
	height:auto;
	width:100%;
	display: inline-block;
	float:none;
}

/*#index_section h1{
	width:100%;
	height:0;
	padding-bottom:25%;
	
	background-image: url(images/top_banner.png);
	margin-left: 0%;		
	
	background-size:contain;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;	
	}
	#index_section h1  img{	width:100%;	height:auto}	
	
	*/
	
#index_section h1  img{	width:100%;	height:auto}
	
#page_section h1 {
	margin-left: 0px;
}
#page_section h1  img{	width:100%;	height:auto}	
	
#index_section h2 img {width:100%;height:auto}

#footer {
	width:100%;
	height: 90px;
	min-width: 100%;
	color: #FFF;
	text-align: center;
	clear: both;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 0.750em;
	margin-top: -37px; /* negative value of footer height */
	
}



#footer .copright {
	text-align: center;
	width:100%;	
	height:auto;	
	margin:0 auto;	
	
	
}


#footer .copy1 {
	float: none;	
	line-height: 25px;
	
}

#footer .copy2 {
	width:65%;	
	float: none;	
	line-height: 25px;
	background-color: #FFF;
	height: 25px;
	margin-top: 1%;
	color: #ea575d;
	margin-left: 20%;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding-right: 5px;
	padding-left: 5px;
	
	-webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box;    
    box-sizing: border-box;	
	
}


#footer .copy2  a{
	color: #ea575d;
	text-decoration: none;
}

#footer .copy2  a:hover{
	color: #ea575d;
	text-decoration: underline;
}


/*----- 手機內頁--------------*/




.menu {
	width: 100%;
	height: auto;	
	/*background-color: #e9c88c;*/
	position: relative;
	
}





.menu  ul {
	width: 100%;
	height: auto;	
	display: none;  /*把內容選單先隱藏*/
  	
}



.menu li{
	float: none;
	display:block;	
	width:100%;
	
}


.menu a {
	/*color: #ea575d;*/
	display: inline-block;
	text-align: center;
	text-decoration: none;
	line-height: auto;
	/*padding-right: 10px;
	padding-left: 10px;	*/
	
	
	width: 100%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;	
	
}
.menu li a {
	border-right: 1px  dotted #ea4515;
	border-bottom: 1px  dotted #ea4515;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

.menu li a:hover {
	color: #fdfafa;	
}
.menu li:last-child a {
	border-right: 0;
}
.menu a:hover, .menu a:active {
	/*background-color: #6a282a;*/
	
}

.menu .on a {
	/*background-color: #6a282a;*/
	color: #FFF;	
}

.menu a#pull {                      /*顯示選單bar*/
	display: block;
	background-color: #e9c88c;
	width: 100%;
	position: relative;
	text-align: center;
	font-size: 1.438em;
	color: #fdfcfc;
	letter-spacing: 2px;
	}
.menu a#pull:after {               /*加入menu icon */
	content:"";
	width: 35px;
	height: 40px;
	display: inline-block;
	position: absolute;
	right: 15px;
	top: 15px;
	background-image: url(images/nav-icon.png);
	background-repeat: no-repeat;
	background-position: left center;
	}
	
#page_section {
	width: 100%;
	padding-top: 20px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;	
	padding-bottom:60px;/* negative value of footer height */
	}
	
#page_section ul li {
	height: auto;
	width: 47%;
	background-color: #FFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-left: 2%;
	float: left;
	margin-bottom: 10px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding-bottom:3%;	
	padding-top:1%;	
}



#page_section  .pic { 
    height: auto;
	width: 97%;
	margin-top: 1.6%;
	margin-left: 1.6%;
	margin-bottom: 1.6%;
	
}
#page_section .pic img {
	height: auto;
	width: 100%;
}
#page_section .pic .notice {
	bottom: 0px;
	height: 10%;
	width: 100%;
	z-index: 10;
	left: 0%;
	
}



#page_section li  h3{
	font-size: 0.875em;
	margin-left: 1%;
	height: 4em;
	width: 99%;
	margin-bottom: 1%;
	overflow: hidden;
	clear: both;	
}

#page_section  p{
	width: 99%;
	font-size:0.813em;	
	float: left;
	line-height: auto;
	height: auto;
	margin-bottom: 1.6%;
	margin-left: 1%;
	overflow: visible;	
	
	color: #fd0225;
}
#page_section h4 {	
    
	height: 20px;
	font-size:0.813em;
	color: #FFF;
	line-height: 20px;
	float: right;
	
	margin-top: 1%;
	margin-right: 1%;
	margin-bottom: 1%;	
	padding-right: 3px;
	padding-left: 3px;
	
	
}

/*沒有冷凍或冷藏標示時*/
#page_section .b {
	
	
	float: left;	
	font-size:0.813em;	
	clear: both;
	width: 30%;
	height: 1.8em;
	margin-left: 1%;
	margin-bottom: 4%;
	
}


#page_section h5 {
	display: block;
	font-size:0.813em;
	color: #5e5f5e;
	font-weight: normal;
	clear: both;
	width: 97%;
	height: 3em;
	margin-left: 1%;
	/*overflow: hidden;	*/
	overflow: visible;
}

#page_section li  h2{
	font-size: 0.85em;
	margin-left: 1.6%;
	margin-top: 10%;
	margin-bottom: 1%;
	font-weight: normal;
	color: #FFF;
	/*background-color: #9c1318;*/
	height: 20px;
	width: 60px;
	line-height: 20px;
	padding-left: 1%;;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}	

#page_section li  h2 a{	
	color: #FFF;
	text-decoration: none;
}	

	
#page_section li  h2:hover{
	text-decoration: underline;	
	
	
}


#page_section h6 {
	width: 99%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #adaead;
	clear: both;
	margin-left: 1%;
	
}

.page_title {
	display:block;
	width:100%;
	height:auto;
	margin-top:-15px;	
	margin-bottom:5px;
	text-align: center;
	font-size:1.313em;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	color: #e4414a;
	font-weight: bold;
}


#page_section .barwar {
	font-size:1.3em;
	color: #FFF;
	background-color: #000;
	height:auto;
	width: 100%;
	clear: both;
	line-height:2em;
	text-align: center;
	margin-bottom: 15px;
	
}


/*.banner_up{
	
	font-size: 0.875em;
	color: #333;
	clear: both;
	width:100%;	height:auto	;
	margin-left:1%;
	}

.banner_up a{
	color: #EA575D;
	text-decoration: none;
	}
.banner_up a:hover{
	color: #EA575D;
	text-decoration: underline;
	}*/

.banner_up{
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	font-size: 0.875em;
	color: #333;
	clear: both;
	width:100%;
	height:auto;
	text-align: left;	
	
	margin-left:0%;
	
	}

.banner_up a{
	color: #EA575D;
	text-decoration: none;
	}
.banner_up a:hover{
	color: #EA575D;
	text-decoration: underline;
	}



/*-----------------------------------詳細規格 母親節--------------------------------------------*/

#box_block {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1000;
	left: 0px;
	top: 0px;
}
#box_block #box_bg {
	background-color: #000;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	z-index: 1000;
	/*background:url(images/alpha_bg.png) repeat left top\9; /*ie8 ie7*/
	
	/* works for IE 5+. */
    filter:alpha(opacity=50);
	/* works for IE 8. */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	/* works for old school versions of the Mozilla browsers like Netscape Navigator. */
    -moz-opacity:0.5;
	/* This is for old versions of Safari (1.x) with KHTML rendering engine */
    -khtml-opacity: 0.5;
	/* This is the "most important" one because it's the current standard in CSS. This will work in most versions of Firefox, Safari, and Opera. */  
    opacity: 0.5;
	position: absolute;	
}





	
#box_block #box {
	background-color: #FFF;
	height:90%;
	padding-bottom: 20px;
	width: 95%;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	position: relative;
	left: 1%;
	top: 2%;
	z-index:1010;
	margin-left: 5px;
	font-size: 1.125em;
	color: #333;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	overflow: auto;	
}


.display{
	display: none;
	}
#box #bxclose {
	position: absolute;
	top: 0px;
	right: 0px;
	background-image: url(images/close.png);
	background-repeat: no-repeat;
	width:50px;
	height:50px;
	cursor:pointer;
}



a#box #bxclose:hover {
		-webkit-animation:example 1s ease 0s alternate none ;
		-moz-animation:example 1s ease 0s alternate none ;
		animation:example 1s ease 0s alternate none ;
	}	
	
	@-webkit-keyframes example { from{-webkit-transform:rotate(0deg); } to{-webkit-transform:rotate(360deg); } }
	@-moz-keyframes example { from{-moz-transform:rotate(0deg); } to{-moz-transform:rotate(360deg); } }
	@keyframes example { from{transform:rotate(0deg); } to{transform:rotate(360deg); } }
	

#box_block #box h3 {
	margin-bottom:10px;	
	
	
	
}

#box_block #box h5 {
	font-size: 1.125em;
	text-align: center;	
	color: #403a3a;
	text-align: left;
    margin-left: 10px;
	margin-right: 10px;
	margin-bottom:10px;
}

.display{
	display: block;
}

.nodisplay{
	display: none;
	
	}
#box_block #box p {
	font-size: 1em;
	margin-left: 10px;
	margin-right: 10px;
}

/*#box .qrbox {
	height: 131px;
	width: 480px;
	margin-top: 10px;	
	display: inline-block;
	text-align: center;
	
}	*/

	
/*------------------------------------詳細規格 母親節------------------------------------------*/


#box .qrbox {
	height: auto;
	width: 100%;
	margin-top: 15px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	text-align: left;	
}


#box .qrbox .qr1 {
	width: 15%;
	height: auto;
	float:none;
	vertical-align: middle;
	display: inline-block;
}
#box .qrbox .qr1 img{
	width: 100%;
	height: auto;	
}
#box .qrbox .qr2 {
	width: 75%;
	height: auto;
	
	vertical-align: middle;
	display: inline-block;
}

#box .qrbox .qr2 img{
	width: 100%;
	height: auto;
	
}
.barcodeTarget{
	vertical-align: middle;
	display: inline-block;
}

#barcode2{
	vertical-align: middle;
	display: inline-block;
}


#wrapper  #finally {
	height: auto;
	width: 100%;
	position: relative;
	left: 0%;
	top: 0%;
	z-index:1010;
	margin-left:0;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	margin-top: 50px;
}
#finally h1 {
	font-size: 2em;
	letter-spacing: none;
	text-align: center;
	margin-left: 0.5em;
	color: #f0000d;
}
#finally .btngo {
	height:auto;
	width: 90%;
	
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 10px;
	
		box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

#finally .btngo  img{
	width: 100%;
	height: auto;	
}


/*信用卡的申辦banner*/

#card_banner {
	background-image: url(images/bottom_banner.png);
	width: 100%;
	-webkit-background-size:contain;  /*用cover也可以*/
	background-size:contain;
	height:0;
	padding-bottom: 12.22%;
	background-repeat: no-repeat;
	position: relative;
}
#card_banner .cbtn {
	/*width:19.27%;*/
	width:25%;
	position: absolute;
	left:77.72%;
	bottom: 15%;	
	right:none;
	background-repeat: no-repeat;
	/*right:43.62%;*/
}

#card_banner .cbtn1 {
	width:25%;
	position: absolute;
	bottom: 15%;	
	background-repeat: no-repeat;
	left:38%;
	
}

#card_banner .cbtn a.go{
	display:block;
	width:100%;
	-webkit-background-size:contain;
	background-size:contain;
	padding-bottom:18.64%;   
	height:0;
	background-image: url(images/btn1.png);
	background-repeat: no-repeat;
	
}

#card_banner .cbtn1 a.go{
	display:block;
	width:100%;
	-webkit-background-size:contain;
	background-size:contain;
	padding-bottom:18.64%;   
	height:0;
	background-image: url(images/btn1.png);
	background-repeat: no-repeat;
	
}


}



/*========================手機版完========================================================*/