@import url("reset.css");

body{ background:#f5f5f5; position: relative;}

#wrapper{width: 100%;height: 100%; overflow: hidden; /position: relative;}

/*top BEGIN*/
#top{width: 100%; height: 530px; background:url(../images/top_bg.jpg) center center no-repeat ; margin: auto;position: relative;}
.logo_block{width: 100%;height: 60px; margin: 10px auto auto 0;padding: 0;position: absolute;z-index: 100;}
.bh_logo {width: 60px;height: 60px; display: block;position: absolute;top: 0;left: 20px;}
.mobile01_logo {display: block;position: absolute; top: 0;right: 20px;}
.fb{
	width:33px;
	height:35px;
	position:absolute;
	top:0;
	right:188px;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	background:url(../images/share_fb.png) no-repeat top left
	}
.fb:hover{background:url(../images/share_fb.png) no-repeat bottom left}
.slogan_block{width: 1000px;height: 530px; margin: auto;padding: 0; position:relative;}
.slogan_01{position: absolute;top: 145px;right: 189px;}
.slogan_02{position: absolute;top: 219px;right: 35px;}
.slogan_s{position: absolute;top: 282px;right: 85px;}
.light{position: absolute;top: 150px;right: 0px;}
.go_article {
	display: block;
	width: 146px;
	height: 33px;
	background:rgba(0,0,0,0.5);
	border:2px solid #fff;
	color:#fff;
	font-family: "微軟正黑體";
	font-size: 24px;
	font-weight: bold;
	text-decoration:none;
	text-align: center;
	position: absolute;
	padding-top: 7px;
	top: 440px;
	right: 274px;

	}

.go_article:hover{
	background:rgba(255,255,255,1);
	color:#000;
	}
/*top END*/

/*product BEGIN*/
#product{width: 1000px; height: 425px; overflow: hidden; margin: auto ;position: relative;}
.product_title{width: 778px;height: 38px; margin: 22px auto auto auto;}
.product_block {position: relative; width: 980px; height: 322px; margin: 20px auto auto auto;}
.product_block ul {
	width: 920px;	/* 整個區塊的寬 - 兩個左右鈕的寬 */
	height: 322px;
	position: absolute;
	left: 30px;		/* 一個左鈕的寬 */
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
	}
.product_block li a {outline: none;}
.product_block li a img {vertical-align: middle;border: none;}
.product_block .controls {
	position: absolute;
	top: 180px;		/* (整個區塊的高 - 自己的高) / 2 */
	display: block;
	width: 20px;
	height: 22px;
	outline: none;
	background: url(../images/arrow.png) no-repeat;
	}
.product_block .prev {left: 0;background-position: 0 0;}
.product_block .next {right: 0;background-position: -20px 0;}
/*product END*/
/*article BEGIN*/
#article{
	width: 100%;
	height: 370px;
	margin: auto;
	background:url(../images/article_bg.jpg) center center no-repeat ;
	}
.article_block{width: 970px;height: 320px; padding: 20px 0 30px 0; margin: auto;}
.article_block li{width: 310px;height: 320px;overflow: hidden;position: relative;float: left;}
.article_block li a{		
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #000;
	opacity: 0.5;
	-webkit-transition: opacity 0.4s linear;
	-moz-transition: opacity 0.4s linear;
	-o-transition: opacity 0.4s linear;
	transition: opacity 0.4s linear;
	}
.article_img{
	width: 306px;
	height: 256px;
	position: absolute;
	top: 60px;
	border:2px solid #000;
	overflow: hidden;

	}
.article_img img {
	-webkit-transition: width 0.4s linear, height 0.4s linear, -webkit-transform 0.4s linear;
	-moz-transition: width 0.4s linear, height 0.4s linear, -moz-transform 0.4s linear;
	-o-transition: width 0.4s linear, height 0.4s linear, -o-transform 0.4s linear;
	transition: width 0.4s linear, height 0.4s linear, transform 0.4s linear;
	
	}
.article_img:hover img {
	width: 330px;
	height: 277px;
	-webkit-transform: translate(-10px, -7px);
	-moz-transform: translate(-10px, -7px);
	-o-transform: translate(-10px, -7px);
	transform: translate(-10px, -7px);
		
	}
.article_block li:hover a {opacity: 0;}
.article_b ,.article_c{margin-left: 20px;}
.article_title{
	width: 310px;
	height: 52px;
	padding-top: 8px;
	background: #000;
	color: #fff;
	text-align: center;
	font-family: "微軟正黑體";
	font-size: 17px;
	line-height: 22px;
	position: absolute;
	top: 0;
	}
.model_name{
	width: 188px;
	height: 30px;
	position: absolute;
	bottom: 0;
	z-index: 100;
	}
/*article END*/

/*FOOTER BEGIN*/
#footer{height: 22px;width: 100%;background: #000;padding: 8px 0 0 0;}
.copyright {width: 1000px;height: 16px;margin: auto;overflow: hidden;font-family: "微軟正黑體"; font-size: 12px; color: #fff;text-align: center;}
/*FOOTER END*/
#jSplash { 
    margin: auto;
    height: 100px;
    width: 100px;
    background: url(../images/bh_logo.png);
    }