@charset "utf-8";

/*---------------------products----------------*/
.grayBg{
	background:#f3f2f0;
	min-height:250px;
	border-top:1px solid #e8e8e8;
	padding:2% 0.2%;
	text-align:center;
}
.yellowProBg{
	background:#fbcf1f;
	min-height:250px;
	border-top:1px solid #e8e8e8;
	padding:2% 0.2%;
	text-align:center;
}

.proPageBox{
	width:29.33333%;
	margin:4% 2% 4% 2%;
	float:left;
	max-height:426.5px;
	min-height:426.5px;
	border:1px solid #c8c8c8;
}
.proimgBorder{
	width:100%;
	/*margin:6%;*/
	float:left;
	height:340px;
	overflow:hidden;
	display: flex;/*使下層對齊*/
	justify-content: center;/*使下層對齊*/
	align-items: center; /*使下層對齊*/
}
.proimgBorder img{
	width:100%;
	height:auto;
	vertical-align:middle;
	display: inline-block;
}
.proSubBorder{
	font-size:1em;
	padding:5.5% 3%;
	width:100%;
	height:85px;/*52.5*/
	float:left;
	text-align:center;
	font-weight:600;
	color:#111111;
	background:#eae6e6;
}
.proSubBorder a{
	display:block;
	color:#000;
}
.proSubBorder:hover{
	background:#b6b5b5;
}
.proSubBorder >a >span.infoTxt{
		font-size:0.8em;
		font-weight: normal;
	}
.protextBorder{
	margin:2% 3%;
	width:94%;
	float:left;
	font-size:0.8em;
	line-height:1.6em;
	font-weight:600;
	color:#7b7363;
}
.proPageBox >span.moreBtu{
	width:15%;
	font-size:0.7em;
	font-weight:600;
	height:auto;
	float:left;
	margin:2% 3%;
	border-bottom:2px solid #e54072;
}
.proPageBox >span.moreBtu:hover{
	border-bottom:2px solid #fc5033;
}
.proPageBoxText >span.backBtu a{
	width:60%;
	margin-left:20%;
	margin-right:20%;
	font-size:0.9em;
	padding:1% 4%;
	height:auto;
	float:left;
	margin-top:35px;
	background:#eeeeee;
	border: 1px solid #d6d5d5;
	border-radius:6px;
	text-align:center;
	display:block;
	letter-spacing:2px;
}
.proPageBoxText >span.backBtu a:hover{
	background:#ede3d1;
}
.prolistImg{
	width:30%;
	float:left;
	margin-left:15%;
	margin-right:5%;
	height:auto;
}
.prolistImg img{
	width:100%;
	height:auto;
}
.protypelistPageText{
	float:right;
	width:50%;
	text-align:left;
}
span.protypelistPageSub{
	font-size:1.2em;
	color:#fc462a;
	float:left;
	clear:left;
	line-height:1.8em;
	margin-bottom:18px;
}
span.protypelistPageSub1{
	font-size:1.2em;
	font-weight:600;
	color:#66635c;
	float:left;
	clear:left;
	line-height:1.6em;
	margin-top:8px;
	margin-bottom:3px;
}
span.protypelistPageTxt{
	font-size:1em;
	float:left;
	clear:left;
	color:#252524;
	line-height:1.6em;
}
.showbox {
	width:100%;
	float:left;
	margin-top:3%;
	margin-bottom:3%;
	height:auto;
	vertical-align: middle;
}
	/*.showbox img{border: 1px solid #bfb188;}*/
	.abgne-block-20120106 {
		width: 100%;
		overflow: hidden;
	}
	.abgne-block-20120106 a {
		margin-right: 1px;
	}
	.abgne-block-20120106 a img {
		width: 20.5%;
		margin-right:2%;
		height:auto;
		vertical-align: middle;
	}

/*------------------------------------------------------*/
/* RESPONSIVE
/*------------------------------------------------------*/

@media (max-width: 991px) {
}

/*---------- MEDIA 480px ----------*/
@media  (max-width: 768px) {
	
}

@media  (max-width: 480px) {
	.grayBg{
		background:#f3f2f0;
		min-height:250px;
		border-top:1px solid #e8e8e8;
		padding:2% 0.2%;
		text-align:center;
	}
	.yellowProBg{
		background:#fbcf1f;
		min-height:250px;
		border-top:1px solid #e8e8e8;
		padding:2% 0.2%;
		text-align:center;
	}
	
	.proPageBox{
		width:96%;
		margin:4% 2%;
		float:left;
		max-height:441.5px;
		min-height:441.5px;
		/*background:#fbcf1f;*/
	}
	.proimgBorder{
		width:92%;
		margin:2% 4%;
		float:left;
	}
	.proimgBorder img{
		width:100%;
		height:auto;
	}
	.proSubBorder{
		font-size:1.1em;
	}
	.proPageBox >span.moreBtu{
		width:20%;
		font-size:1em;
		font-weight:600;
		height:auto;
		float:left;
		margin:2% 3%;
		border-bottom:2px solid #e54072;
	}
	.proPageBox >span.moreBtu:hover{
		border-bottom:2px solid #fc5033;
	}
	.proPageBoxText >span.backBtu a{
		width:60%;
		margin-left:20%;
		margin-right:20%;
		font-size:0.9em;
		padding:1% 4%;
		height:auto;
		float:left;
		margin-top:35px;
		background:#eeeeee;
		border: 1px solid #d6d5d5;
		border-radius:6px;
		text-align:center;
		display:block;
		letter-spacing:2px;
	}
	.proPageBoxText >span.backBtu a:hover{
		background:#ede3d1;
	}
	.prolistImg{
		width:50%;
		float:left;
		margin-left:25%;
		margin-right:25%;
		margin-bottom:2%;
		height:auto;
	}
	.prolistImg img{
		width:100%;
		height:auto;
	}
	.protypelistPageText{
		float:left;
		width:96%;
		margin-left:2%;
		margin-right:2%;
		margin-top:2%;
		text-align:left;
	}
	span.protypelistPageSub{
		font-size:1.2em;
		color:#fc462a;
		float:left;
		clear:left;
		line-height:1.8em;
		margin-bottom:18px;
	}
	span.protypelistPageSub1{
		font-size:1.2em;
		font-weight:600;
		color:#66635c;
		float:left;
		clear:left;
		line-height:1.6em;
		margin-top:8px;
		margin-bottom:3px;
	}
	span.protypelistPageTxt{
		font-size:1em;
		float:left;
		clear:left;
		color:#252524;
		line-height:1.6em;
	}
	
	.proSubBorder{
	padding:3.7% 2%;
	}
}