@import url("reset.css");
@import url("un-reset.css");

/****************************************************************************************************************************************************************************************/
/*�i����html�j*/
body{/* font-family:Arial,"�s�ө���",Verdana,"�L�n������"; font-family:"�L�n������","Microsoft JhengHei";*/ background:#000;}

/****************************************************************************************************************************************************************************************/
/*�i�ج[Wrapper�j*/
#Wrapper{ width:100%; max-width:1172px; height:auto; margin:0px auto;}
.mv{ -webkit-transition:all 0.8s; -moz-transition:all 0.8s; -ms-transition:all 0.8s; o-transition:all 0.8s; transition:all 0.8s;}

/****************************************************************************************************************************************************************************************/
/*�i����header�j*/
header{ display:block; width:100%; max-width:1172px; height:auto; min-height:110px; overflow:hidden;}
.logo{ display:block; width:112px; height:112px; overflow:hidden; margin:20px auto 0 auto;}

/****************************************************************************************************************************************************************************************/
/*�i���earticle�j*/
article{ display:block; width:100%; max-width:1172px; height:auto; overflow:hidden;}

.host{ display:block; width:100%; max-width:1172px; height:auto; overflow:hidden; position:relative;}
/* .arrow-left,.slidesjs-previous{position:absolute; left:10px; z-index:9999; display:block; width:2.5%; min-width:20px; margin:20% 0 0 0; overflow:hidden;}
.arrow-left a,.slidesjs-previous{ display:block; opacity:1; filter:alpha(opacity=100);}
.arrow-left a:hover,.slidesjs-previous{ opacity:0.2; filter:alpha(opacity=20);}
.arrow-left img{ display:block; width:100%;}
.slidesjs-pagination{position:absolute; top:50px; right:50px;z-index:9999;font-size:0px;}
.arrow-right,.slidesjs-next{position:absolute; right:10px; z-index:9999; display:block; width:2.5%; min-width:20px; margin:20% 0 0 0; overflow:hidden;}
.arrow-right a,.slidesjs-next{ display:block; opacity:1; filter:alpha(opacity=100);}
.arrow-right a:hover,.slidesjs-next{ opacity:0.2; filter:alpha(opacity=20);}
.arrow-right img{ display:block; width:100%;} */
.slidesjs-pagination{position:absolute; right:50px;z-index:10000;font-size:1px; margin:-5% 0 0 0;}
.slidesjs-pagination li{display:inline; margin-left:5px;font-weight:bold;font-size:15px;border:white solid;background-color:white;}
.arrow-left a,.slidesjs-previous{ position:absolute;left:10px;z-index:9999; height:13.5%;display:block; width:2.5%; min-width:20px; margin:-20% 0 0 0; background:url(../images/arrow-left.png); /* overflow:hidden; */}
.slidesjs-previous,.slidesjs-next{z-index:9999;font-size:0px;}
.arrow-right a,.slidesjs-next{position:absolute;right:10px; z-index:9999;height:13.5%; display:block; width:2.5%; min-width:20px; margin:-20% 0 0 0;  background:url(../images/arrow-right.png); /* overflow:hidden; */}
.image{ display:block; width:100%; height:auto; overflow:hidden;}
.image img{ display:block; width:100%;}
.cmemu{ position:absolute; top:0; z-index:999; display:block; width:100%; max-width:1172px; height:auto; min-height:80px; background:url(../images/bg_cmemu.png) top center no-repeat; overflow:hidden;}
.cmemu-list{ margin:0 auto;}
.cmemu-list li{ float:left; display:block; width:16.66%; text-align:center; padding:15px 0 0 0; overflow:hidden;}
.cmemu-list li a{ display:block; font:0.85em "�L�n������","Microsoft JhengHei"; color:#fff; opacity:1; filter:alpha(opacity=100);}
.cmemu-list li a:hover{ opacity:0.5; filter:alpha(opacity=5);}
.cmemu-list li.on a{}
.cmemu-list li i{}
.mmemu{ display:none;}
.cterm{ display:block; position:absolute; bottom:0; z-index:9999; display:block; width:100%; max-width:1172px; height:auto; min-height:80px; background:url(../images/bg_slogan.png) bottom center no-repeat; font:1.1em"Microsoft JhengHei"; color:#222; text-align:center; padding:35px 0 0 0; overflow:hidden;}
.mterm{ display:none;}

.content{ display:block; width:100%; max-width:1172px; height:auto; overflow:hidden; position:relative;}

.note{ padding:25px 0;}
.note img{ display:block; margin:0 auto;}

.brand{ display:block; width:100%; padding:30px 0; overflow:hidden;}
/*.brandbox{ display:block; width:33%; padding:0 2%; float:left;}*/
.brandbox{ display:block; width:33%; padding:0 2%; float:left;}
/*.brandbox-image{ display:block; max-width:140px; max-height:56px; margin:0 auto 15px auto; overflow:hidden;}*/
.brandbox-image{ display:block; max-width:200px; max-height:200px; margin:0 auto 15px auto; overflow:hidden;}
.brand li:nth-child(1) a{ background-image:url(../images/brand_1.png);}
/*.brand li:nth-child(2) a{ background-image:url(../images/brand_sliverspoon.jpg);}*/
/*.brand li:nth-child(3) a{  background-image:url(../images/brand_littlespoon.jpg);}*/ /*background-image:url(../images/brand_tungspoon.jpg);*/
/*.brand li:nth-child(4) a{ background-image:url(../images/brand_littlespoon.jpg);}*/
/*.brand li:nth-child(5) a{ background-image:url(../images/brand_fatolive.jpg);}*/
.brand li:nth-child(2) a{ background-image:url(../images/brand_2.png);}
/*.brand li:nth-child(3) a{ background-image:url(../images/brand_3.png);}*/
.brand li:nth-child(3) a{ background-image:url(../images/brand_4.png);}
.brandbox-image a{ display:block; width:100%; background-position:top;	
	height:0;
	/*padding-bottom:40%;*/
	padding-bottom:100%;
	background-size:cover;
	/*	�Ϥ���Y ������Y��
    height:0;
	padding-bottom:68.75%;  �Q��padding���U���}; ����/�e��=���  440/640=0.6875
	background-size:cover;  �۰ʦ��Y  */
}
.brandbox-image a:hover{ background-position:bottom;}
.brand li.brandbox .brandbox-button a{ display:block; width:27px; height:26px; background:url(../images/fb.jpg) top no-repeat; background-size:100% auto; margin:10px auto 0 auto; overflow:hidden;}
.brand li.brandbox .brandbox-button a:hover{ background:url(../images/fb.jpg) bottom no-repeat;}

.counter{ display:block; width:100%; font:0.75em '�L�n������'; text-align:center; opacity:0.5; filter:alpha(opacity=5); margin:10px 0;}

/****************************************************************************************************************************************************************************************/
/*�i����footer�j*/
footer{ display:block; width:100%; max-width:1172px; height:auto; font:0.7em "�L�n������","Microsoft JhengHei"; color:#222; text-align:center; margin:0 0 10px 0; overflow:hidden;}
footer a, a:hover{ color:#222;}

/****************************************************************************************************************************************************************************************/
/*�i��L�]�w�j*/
.imgL{ padding:5px; margin:0 20px 0 0; float:left;}
.imgC{ padding:5px; margin:20px auto;}
.imgR{ padding:5px; margin:0 0 0 20px; float:right;}

.ftL{ float:left;}
.ftC{ float:none; margin:0 auto;}
.ftR{ float:right;}

a{ color:#555; text-decoration:none;}
a:hover{}

/*====================================================================================================*\
 Table
\*====================================================================================================*/
@media screen and (max-width: 1024px) {
}

@media only screen and (max-width: 768px) {
}

/*====================================================================================================*\
Mobile phone  (big size)
\*====================================================================================================*/
@media only screen and (max-width: 640px) {
/*�i���earticle�j*/
.cmemu{ display:none;}
.mmemu{ display:block;}
.mmemu-button{
	display:block;
	width:100%;
	height:40px;
	background:#811e00;
	font:0.9em "�L�n������","Microsoft JhengHei";
	color:#fff;
	line-height:40px;
	text-align:center;
	border:none;
	overflow:hidden;
	cursor:pointer;}
.mmemu-list{ display:none; width:100%; background:#811e00; padding:10px 0; overflow:hidden; position:absolute; top:167px; right:0; z-index:99999;}
.mmemu-list li{ float:left; width:33.33%; padding:0 20px;}
.mmemu-list li a{ display:block; font:0.85em "�L�n������","Microsoft JhengHei"; color:#eee; line-height:35px; text-align:center; overflow:hidden;}
.mmemu-list li a:hover{ opacity:0.5; filter:alpha(opacity=5);}

.cterm{ display:none;}
.mterm{ display:block; display:block; width:100%; max-width:1172px; height:auto; min-height:40px; background:#fff; font:1em"Microsoft JhengHei"; line-height:40px; text-align:center; overflow:hidden;}
}

@media only screen and (max-width: 480px) {
/*�i���earticle�j*/
.brandbox{ width:50%; padding:0 2% 15px 2%;}
}

/*====================================================================================================*\
iphone
\*====================================================================================================*/
@media only screen and (max-width: 320px) {
/*�i���earticle�j*/
.mmemu-list{ padding:0;}
.mmemu-list li{ float:none; width:100%; border-bottom:solid #000 1px;}
.mmemu-list li:nth-last-child(1){ border-bottom:none;}

.brandbox{ width:100%; border-bottom:solid #222 1px; padding:5px 2% 15px 2%; float:none;}
.brandbox:nth-child(1){ border-top:solid #222 1px;}
}