@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: #f9e5c2; background:url(images/bg.gif); }
/*----css 清除浮動技巧------*/
.clearfix:before,.clearfix:after { content: " "; display: table;}
.clearfix:after {clear: both;}
.clearfix {*zoom: 1;}
/*-------css 清除浮動技巧----*/


#wrapper {
	min-height: 100%;
	*display: table; /* For IE7 Hack */
	
	width:100%;
	min-width: 1000px;
	background-color: #f9b52c;	
	*min-height: 100%;	
    

}


/*#wrapper {
	min-height: 100%;
	*display: table;  For IE7 Hack 
	*height: 100%;
	width:100%;
	min-width: 1000px;
	background-color: #feece0;		
	
	 *min-height: 100%; 
    

}*/
#wrapper .all {
		
}


#header{
	width:100%;
	height:100px;
	position:relative;
	z-index:99;
	background-color: #FFF;
	box-shadow:0 0 10px #1d3365;	
}
.headerNav{ width:1000px; margin:0 auto;  position:relative;height:100px;}
 
.headerNav .title {
	background-image: url(images/title.png);
	width:455px;
	height: 93px;
	background-repeat: no-repeat;
	position: absolute;
	left: 285px;
	top: 0px;	
}

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



.headerNav .date {
	position: absolute;
	top: 10px;
	right: 68px;
	width: 148px;
	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 {
	width:100%;
	min-width: 1000px;
	color: #FFF;
	background-color: #1d3365;
	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: #1d3365;
	margin-left: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding-right: 5px;
	padding-left: 5px;	
}


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

#footer .copy2  a:hover{
	color: #1d3365;
	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{
	text-align: center;
	}


#page_section h1 img {
	width:965px;		height::193px;	
}


.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 */
	}
		
.menu {
	width: 100%;
	height: 63px;	
	background-color: #eb5d44;
	position: relative;
	font-size: 0.938em;
	font-weight: bold;	
}



.menu  ul {
	width: 1000px;
	height: 63px;
	padding:0;
	margin: 0 auto;	
	text-align: center;
}



.menu li{
	float: left;
	width:25%;
}


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

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

.menu .on a {
	/*background-color: #6a282a;*/
	background-color: #418fcd;
	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: 175px;
	width: 215px;
	margin-top: 5px;
	margin-left: 7px;
	margin-bottom: 5px;
}
#page_section .pic img {
	height: auto;
	width: 100%;
}
#page_section li  h3{
	font-size: 0.875em;
	margin-left: 10px;
	height: 35px;	
	width: 210px;
	margin-bottom: 7px;
	overflow: hidden;
		
	}
	
#page_section li  h2{
	font-size: 0.85em;
	margin-left: 10px;
	margin-top: 3px;
	margin-bottom: 5px;
	font-weight: normal;
	color: #FFF;
	background-color: #eb5d44;
	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 li  h2{
	font-size: 0.875em;
	margin-left: 10px;
	margin-bottom: 10px;
	font-weight: normal;
	color: #600;		
	
}	

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

#page_section li  h2 a: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: #4cbadb;
	height: 20px;
	width: 35px;
	font-size:0.813em;
	color: #FFF;
	line-height: 20px;
	text-align: center;
	float: right;
	margin-right: 10px;
	margin-bottom: 5px;
	overflow: hidden;
}


#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: 550px;*/
	width: 520px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	position: relative;
	left: 50%;
	top: 60px;
	z-index:1010;
	margin-left: -260px;
	padding-bottom:20px;
	font-size: 1.125em;
	color: #333;
		
}


#box_block #box p{
	font-size: 1em;
	margin-right: 15px;
	margin-left: 30px;
}
#box_block #box img{ width:90%; height:auto; display:block;}
#box_block #box .qrblock{
	margin:10px 0 0 0;
	width:100%;
	text-align: center;
}

#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: 30px;
	padding-top: 35px;
}



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


.display{
	display: block;
}

.nodisplay{
	display: none;
}
/*------------------------------------詳細規格 母親節------------------------------------------*/



/*-----------------------------------詳細規格 端午--------------------------------------------*/





#box .qr {
	height: 43px;
	width: 152px;
	text-align: center;	
	
}




#box .qr img {
	height: auto;
	width: 100%;
	
}


#index_section .banner_down a{
	background-image: url(images/banner1.png);
	height: 160px;
	width: 820px;
	clear: both;
	margin-bottom: 15px;
	margin-left: 90px;
	text-align: center;
	display: block;
}


#page_section .banner_down a {
	background-image: url(images/top_banner.png);
	height: 193px;
	width: 965px;
	clear: both;
	margin-bottom: 15px;
	text-align: center;
	display: block;
}

#page_section .banner_down1 a{
	background-image: url(images/top_banner1.png);
	height: 193px;
	width: 965px;
	clear: both;
	margin-bottom: 15px;
	text-align: center;
	display: block;
}

#page_section .banner_down2 a{
	background-image: url(images/top_banner2.png);
	height: 193px;
	width: 965px;
	clear: both;
	margin-bottom: 15px;
	text-align: center;
	display: block;
}

#page_section .banner_down3 a{
	background-image: url(images/top_banner3.png);
	height: 193px;
	width: 965px;
	clear: both;
	margin-bottom: 15px;
	text-align: center;
	display: block;
}

#page_section li .b7 {
	background-color: #15631a;
	height: 60px;
	width: 37px;
	position: absolute;
	top: 2px;
	right: 2px;
	z-index: 10;
}




/*------------------------------------詳細規格 端午完------------------------------------------*/




/*========================手機版========================================================*/
@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:20.4%;
	
	position: absolute;	
	top: 30%;
	
	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  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: #1D3365;
	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: #1D3365;
	text-decoration: none;
}

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

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




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





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



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


.menu a {
	color: #fff;
	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 {
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-right-style: dotted;
	border-bottom-style: dotted;
	border-right-color: #FFF;
	border-bottom-color: #FFF;
}

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

.menu .on a {
	/*background-color: #ecb9c1;
	color: #000;	*/
}

.menu a#pull {                      /*顯示選單bar*/
	display: block;
	background-color: #eb5d44;
	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: 6%;	
}



#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 li  h3{
	font-size: 0.875em;
	margin-left: 1.6%;
	height: 3em;
	width: 99%;
	margin-bottom: 2%;
	overflow: visible;	
}

#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 {
	background-color: #4cbadb;
	height: 20px;
	width: 35px;
	font-size:0.813em;
	color: #FFF;
	line-height: 20px;
	text-align: center;
	float: left;
	margin-left: 1%;
	margin-bottom: 4%;
	margin-top: 1%;
	overflow: visible;
}

/*沒有冷凍或冷藏標示時*/
#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: 4.5em;
	margin-left: 1%;
	
	
	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 li  h2{
	font-size: 0.875em;
	margin-left: 1.6%;
	margin-top: 8%;
	margin-bottom: 1%;
	font-weight: normal;
	color: #600;		
	詳細規格
}	

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

#page_section li  h2 a: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;
	}
*/



/*-----------------------------------詳細規格--------------------------------------------*/

#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;
	
	width: 95%;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	position: relative;
	left: 1%;
/*	top: 10%;*/
	top: 15px;
	z-index:1010;
	margin-left: 5px;
	/*font-size: 1.125em;*/
	font-size: 1em;
	color: #333;	
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


.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 {
	text-align: center;

	margin-bottom:15px;
	font-size: 30px;
	padding-top: 35px;
}
*/

#box_block #box h3 {
	text-align: center;

	margin-bottom:5px;
	font-size: 25px;
	padding-top: 15px;
}

/*#box_block #box h5 {
	font-size: 1.125em;
	text-align: center;
	margin-bottom: 20px;
	color: #403a3a;
}*/

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

.display{
	display: block;
}

.nodisplay{
	display: none;
}






#box_block #box p{
	margin-right: 2%;
	margin-left: 2%;
}

#box .qr {
	height: auto;
	width: 100%;
	text-align: center;
	
}




#box .qr img {
	height: auto;
	width: 100%;
	padding-bottom: 10px;
}


/*------------------------------------詳細規格 完------------------------------------------*/


#index_section .banner_down a{
	background-image: url(images/down.gif);
	height: 0;
	width: 100%;
	padding-bottom:  67%;
	clear: both;
	margin-bottom: 10px;
	margin-left: 0%;
	background-size:cover;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	
	}

#page_section .banner_down a{
	background-image: url(images/down1.gif);
	height: 0;
	width: 100%;
	padding-bottom:  60.9%;
	clear: both;
	margin-bottom: 10px;
	background-size:cover;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	}
	
#page_section .banner_down1 a{
	background-image: url(images/down2.gif);
	height: 0;
	width: 100%;
	padding-bottom:  60.9%;
	clear: both;
	margin-bottom: 10px;
	background-size:cover;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	
	}	


#page_section .banner_down2 a{
	background-image: url(images/down3.gif);
	height: 0;
	width: 100%;
	padding-bottom:  60.9%;
	clear: both;
	margin-bottom: 10px;
	background-size:cover;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	
	}	
	
#page_section .banner_down3 a{
	background-image: url(images/down.gif);
	height: 0;
	width: 100%;
	padding-bottom:  67%;
	clear: both;
	margin-bottom: 10px;
	background-size:cover;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	
	}		
		

.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;
	}



}



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