@charset "utf-8";
/* 字形 */
@font-face {
  font-family: "Futura";
  src: url(../font/Futura.eot);
}
@font-face {
  font-family: "Futura";
  src: url(../font/Futura.ttf);
}
@font-face {
    font-family: "Georgia";
    src: url(../font/georgia.eot);
}
@font-face {
    font-family: "Georgia";
    src: url(../font/georgia.ttf);
}
::selection {
    background:#a7c2c2;
    color: #fff;
}
::-moz-selection {
    background:#a7c2c2;
    color: #fff;
}
body{
	font-family:"Futura","sans-serif","LiSong Pro","STSong","NSimSun","SimSun","新細明體", PMingLiU,"Meiryo","文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei";

}
body:after{
    display:none;
    content: url(../images/header_bg.png) url(../images/white.png);
}
/*框*/
.wrapper{
	width:100%;
	height:100%;
	background-color:#fff;
}

/* menu */
.header{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100px;
	z-index:999;
	background-image:url(../images/header_bg.png);
	background-repeat:repeat-x;
	-o-transition: all .3s;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition:  all .3s;
}
.header.mode2{
	background-image:none;
	background-image:url(../images/black.png);
	background-repeat:repeat;
	height:80px;
}
.logo{
	float:left;
}
.logo a{
	display:inline-block;
	width:240px;
	height:50px;
	margin:25px;
	margin-left:50px;
	overflow:hidden;
	background-image:url(../images/logo_2x.png);
	background-size:240px 100px;
	background-position:0 0;
	-o-transition: all .3s;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition:  all .3s;
}
.logo a.mode2{
	width:192px;
	height:40px;
	margin:20px;
	margin-left:50px;
	background-size:192px 80px;
	background-position:0 0;
}
.logo a{
	*display:inline;
}
.logo a:hover{
	
}
.menu{
	width:100%;
	height:100%;
	padding-top:120px;
	display:none;
	position:fixed;
	top:0;
	left:0;
	background-image:url(../images/black_menu.png);
	background-repeat:repeat;
	z-index:800;
}
.menu li{
	display:block;
	text-align:center;
}
.menu li a{
	display:block;
	text-align:center;
	text-decoration:none;
	font-size:36px;
	font-weight:bold;
	letter-spacing:0.3em;
	line-height:70px;
	padding:0 10px;
	color:#fff;
}
.menu li a span{
	display:inline_block;
	text-align:center;
	text-decoration:none;
	font-size:12px;
	font-weight:normal;
	letter-spacing:0.2em;
	line-height:30px;
	font-family: "Georgia";
	font-style:italic;

}
.menu li a:hover{
	background-color:#e5e9ea;
	color:#000;
}
.menu_mobile{
	width:35px;
	height:35px;
	float:right;
	margin:25px;
	margin-right:20px;
	overflow:hidden;
	position:relative;
	cursor:pointer;
	-o-transition: all .3s;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition:  all .3s;
}
.menu_mobile.mode2{
	margin:20px;
}
.menu_icon{
	position:absolute;
	top:0;
	left:0;
	-o-transition: left .3s;
	-webkit-transition: left .3s;
	-moz-transition: left .3s;
	transition:  left .3s;
}
.menu_icon.mode2{
	left:0;
}
/*視差滾動框*/
.pbg{
	width:100%;
	z-index:0;
	overflow:hidden;
	position:relative;
	background-color:#000;
}
.pbg_content{
	width:100%;
	height:inherit;
	position:absolute;
	top:0;
	left:0;
}
.pfg{
	width:100%;
	min-height:100%;
	position:relative;
	z-index:5;
	background-color:#fff;
}
.pfg:last-child{
	min-height:0;
}
.fbg{
	position:relative;
	width:100%;
	height:100%;
}
.fbg img{
	position:absolute;
	top:0;
	left:0;
}

.hideatfirst{
	display:none;
}
.p50{
	width:49%;
	float:left;
}
.p40{
	width:34%;
	float:right;
}
.p60{
	width:64%;
	float:left;
}
.p33{
	width:32%;
	float:left;
}

hr{
	border:none;
	border-top:1px solid #f5f5f5;
	padding:0;
	margin:0px auto;
	width:90%;
}

.deliver{
	font-size:14px;
	width:150px;
	height:30px;
	line-height:30px;
	text-align:center;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	background-color:#fff;
	color:#999;
	letter-spacing:0.1em;
	display:block;
	margin:0 auto;
	position:relative;
	top:-15px;
}
/* category */

.categories{
	width:100%;
}
.category{
	position:relative;
	top:0px;
	-o-transition: top .8s;
	-webkit-transition: top .8s;
	-moz-transition: top .8s;
	transition:  top .8s;
}
.category:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}
.category .cat{
	position:relative;
	width:50%;
	min-height:100px;
	background-color:#fff;	
	-o-transition: background .8s;
	-webkit-transition: background .8s;
	-moz-transition: background .8s;
	transition:  background .8s;
}
.category:hover .cat{
	background-color:#e5e9ea;	
}

.category:nth-child(odd) .cat_text{
	float:left;
}
.category:nth-child(even) .cat_text{
	float:right;
}
.category:nth-child(odd) .cat_img{
	float:right;
	overflow:hidden;
}
.category:nth-child(even) .cat_img{
	float:left;
	overflow:hidden;
}
.cat_text{
	text-align:center;
}
.cat_text h3{
	font-family:"STFangsong";
	font-size:24px;
	color:#774f23;
	line-height:2;
	font-weight:bold;
	width:70%;
	margin:10px auto;
	letter-spacing:0.3em;
}
.cat_text p{
	font-size:13px;
	color:#666;
	line-height:1.5;
	width:60%;
	margin:10px auto;
}
.cat_text p.cat_icon{
	margin-top:30px;
}
.cat_text p a{
	display:inline-block;
	margin:30px 0;
	font-size:12px;
	color:#774f23;
	padding:5px 30px;
	text-decoration:none;
	border:1px solid #774f23;	
	-o-transition: all .3s;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition:  all .3s;
	letter-spacing:1px;
	cursor:pointer;
}
.cat_text p a:hover{
	color:#fff;
	background-color:#774f23;
}
.cat_text p a{
	*display:inline;
}


/* hot */
.hots{
	position:relative;
	top:0px;
	-o-transition: top .8s;
	-webkit-transition: top .8s;
	-moz-transition: top .8s;
	transition:  top .8s;
}

.hots:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}
.hot{
	position:relative;
	width:25%;
	float:left;
	overflow:hidden;
	background-color:#a7c2c2;
}
.hot.info{
	background-color:#fff;
	background-image:none;
}
.hot h3{
	position:relative;
	text-align:center;
	font-size:24px;
	color:#774f23;
	line-height:48px;
	font-weight:bold;
	margin-top:-24px;
	top:50%;
	letter-spacing:0.4em;
}
.hot.info h3 a.fb{
	display:inline-block;
	width:200px;
	height:43px;
	background-image:url(../images/facebook.png);
	background-size:200px 43px;
}
.hot a{
	display:block;
	position:relative;
}
.hot p{
	position:absolute;
	text-align:center;
	display:block;
	top:50%;
	left:0;
	width:100%;
	font-size:18px;
	line-height:1.2;
	color:#ffffff;
	z-index:20;
	opacity: 0; 
	-moz-opacity:0; 
	-khtml-opacity:0;
	filter:alpha(opacity=0);
	letter-spacing:0.1em;
	pointer-events:none;
	-o-transition: all .5s;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition:  all .5s;
}
.hot p span{
	border-top:1px solid #ffffff;
	margin-top:10px;
	text-align:center;
	display:block;
	width:80%;
	margin-left:10%;
	font-size:12px;
	padding-top:10px;
}
.hot:hover p{
	top:40%;
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100);
	display:block;
}
.hot a img{
	position:absolute;
	top:0;
	left:0;
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100);
	-o-transition: opacity .5s;
	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	transition:  opacity .5s;
}
.hot a:hover img{
	opacity: 0; 
	-moz-opacity:0; 
	-khtml-opacity:0;
	filter:alpha(opacity=0);
}




/* 大圖 */
.slider{
	width:100%;
	height:100%;
}
.sliders{
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100); 
	position:relative;
}
.sliders li{
	position:absolute;
	top:0;
	left:0;
	display:none;
}

.sliders-topic{
	position:absolute;
	bottom:15%;
	left:13%;
	width:40%;
	z-index:10;
	display:none;
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100); 
	letter-spacing:2px;
}
.sliders-topic h2{
	font-size:60px;
	line-height:1;
	color:#FFFFFF;
	display:none;
	text-indent:0;
	text-shadow:1px 1px 4px rgba(0,0,0,0.7);
	font-family: "Georgia";
}
.sliders-topic h3{
	font-size:24px;
	line-height:1.5;
	color:#FFFFFF;
	display:none;
	text-shadow:1px 1px 4px rgba(0,0,0,0.7);

}
.sliders-topic a{
	text-decoration:none;
	color:#D2ECFB;
}
.sliders-topic a:hover h2{
	text-decoration:underline;
}
.sliders-btns{
	display: inline-block;
	padding:0px;
	margin-top:20%;
}
.sliders-btns{
	*display: inline;
}
.sliders-btns li{
	display: inline-block;
	width:40px;
	height:40px;
	margin:0px 5px;
	background-image:url(../images/slider-btn-off.png);
	background-repeat:no-repeat;
	cursor:pointer;
	-o-transition: all .8s;
	-webkit-transition: all .8s;
	-moz-transition: all .8s;
	transition:  all .8s;
}
.sliders-btns li.selected,.sliders-btns li:hover{
	background-image:url(../images/slider-btn-on.png);
}
.sliders-btns li{
	*display: inline;
}
.hint{
	width:40px;
	height:40px;
	position:absolute;
	bottom:40px;
	left:50%;
	margin-left:-20px;
	z-index:20;
	cursor:pointer;
	background-image:url(../images/scrolldown.png);
	background-size:40px 40px;
	display:inline-block;
}
.hint:hover{
	bottom:18px;
}
.mask{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:400%;
	background-image:url(../images/dot.png);
	background-repeat:repeat;
	opacity: 0.5; 
	-moz-opacity:0.5; 
	-khtml-opacity:0.5;
	filter:alpha(opacity=50); 
	z-index:5;
}
.mask2{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:400%;
	background-image:url(../images/dot2.png);
	background-repeat:repeat;
	opacity: 0.5; 
	-moz-opacity:0.5; 
	-khtml-opacity:0.5;
	filter:alpha(opacity=50); 
	z-index:5;
}
.bwWrapper {
	position:inherit;
	display: inline-block;
}

.service{
	height:100%;
	overflow:hidden;
}
.services{
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100); 
	position:relative;
	width:100%;
	height:100%;
}
.services li{
	position:absolute;
	top:0;
	left:0;
	display:none;
}

.services-topic{
	position:absolute;
	top:18%;
	left:0;
	width:100%;
	text-align:center;
	z-index:10;
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100); 
	letter-spacing:2px;
	display:none;
	font-weight:bold;
	font-family:"Futura";
}

.services-topic h2{
	display:inline;
	text-align:center;
	font-size:20px;
	line-height:2;
	padding:10px 20px;
	border:1px solid #ffffff;
	color:#FFFFFF;
	text-indent:0;
	letter-spacing:0.2em;
	text-shadow:1px 1px 4px rgba(0,0,0,0.7);
}
.services-topic h3{
	text-align:center;
	font-size:12px;
	line-height:3;
	color:#FFF;
	text-shadow:1px 1px 4px rgba(0,0,0,0.7);
	font-family:"Futura";
}
.services-topic p{
	display:inline-block;
	padding:0 8px;
	width:90%;
	max-width:520px;
	color:#ffffff;
	line-height:1.8;
	font-size:16px;
	text-align:left;
	text-shadow:1px 1px 4px rgba(0,0,0,0.7);
	border-bottom:1px dotted #ffffff;
	font-family:"Futura";
	-o-transition: all .8s;
	-webkit-transition: all .8s;
	-moz-transition: all .8s;
	transition:  all .8s;
}
.services-topic p:hover{
	background-image:url(../images/black_menu.png);
	background-repeat:repeat;
}
.services-topic p span{
	font-size:14px;
	float:right;
	font-family:"Futura";
}
.services-topic p{
	*display:inline;
}

.services-btns{
	display: inline-block;
	width:40px;
	height:40px;
	position:absolute;
	z-index:20;
}
.services-btns{
	*display: inline;
}
.services-btns.next{
	background-image:url(../images/next.png);
	background-size:40px 40px;
	background-repeat:no-repeat;
	cursor:pointer;
	right:10px;
	top:50%;
	margin-top:-20px;
}
.services-btns.prev{
	background-image:url(../images/prev.png);
	background-size:40px 40px;
	background-repeat:no-repeat;
	cursor:pointer;
	left:10px;
	top:50%;
	margin-top:-20px;
}
/* newsroom */
.newsroom{
	width:90%;
	max-width:1100px;
	margin:0 auto;
	padding:50px 0;
}
.newsroom:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}
.newsroom_item{
	position:relative;
	width:32%;
	margin:0 1px 20px;
	display:inline-block;
	background-color:#fff;
}
.newsroom_item .new_img{
	position:relative;
	width:100%;
	height:200px;
	overflow:hidden;
	background-color:#000;
	background-image:url(../images/read.png);
	background-repeat:no-repeat;
	background-position:center center;
}
.newsroom_item a .new_img img{
	position:absolute;
	top:0;
	left:0;
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100);
	-o-transition: opacity .5s;
	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	transition:  opacity .5s;
}
.newsroom_item a:hover .new_img img{
	opacity: 0.3; 
	-moz-opacity:0.3; 
	-khtml-opacity:0.3;
	filter:alpha(opacity=30);
}
.newsroom_item a{
	text-decoration:none;
	color:#666;
}
.newsroom_item a:hover{
	text-decoration:underline;
}
.newsroom_item h2{
	display:inline-block;
	position:relative;
	margin-top:-22px;
	padding:0 10px;
	line-height:22px;
	height:22px;
	font-size:12px;
	color:#fff;
	background-color:#222;
}
.newsroom_item h3{
	width:90%;
	margin:5px auto;
	font-size:18px;
	color:#000;
	line-height:2;
	font-weight:bold;
	letter-spacing:0.2em;
}
.newsroom_item p{
	width:90%;
	margin:5px auto;
	font-size:12px;
	color:#000;
	line-height:1.8;	
}
/*gallery*/
.head_gallery{
	width:100%;
	height:35%;
}
.gallery{
	width:90%;
	margin:0 auto;
	position:relative;
	padding:50px 0;
}
.gallery .preserve{
	position:relative;
	width:60%;
	padding:0 10%;
	float:right;
	text-align:center;
	padding-bottom:40px;
}
.gallery .preserve p{
	font-size:15px;
	color:#666;
	letter-spacing:0.1em;
	line-height:1.8;
	text-align:left;
}
.gallery .preserve a{
	font-size:18px;
	color:#666;
	border:1px solid #666;
	padding:0 15px;
	letter-spacing:0.1em;
	line-height:2;
	display:inline-block;
	text-decoration:none;
	margin:20px auto 0px;
}
.gallery .preserve a:hover{
	background:#666;
	color:#fff;
}
.gallery p.des{
	font-family:"文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "標楷體", DFKai-SB, sans-serif;
	width:90%;
	max-width:280px;
	padding: 50px 0;
	font-size:14px;
	line-height:2;
	color:#666;
	clear:both;
}
.gallery p.des span{
	margin-top:10px;
	display:block;
	font-size:12px;
	color:#000;
	text-align:right;
	letter-spacing:0.2em;
}

.gallery:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}
.gallery_menu{
	width:15%;
	float:left;
}
.gallery_menu li a{
	display:block;
	font-size:16px;
	color:#000;
	line-height:1.5;
	text-decoration:none;
	margin:8px 0;
	-o-transition: all .5s;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition:  all .5s;
}
.gallery_menu li a span{
	display:block;
	font-size:12px;
	color:#bbb;

}
.gallery_menu li a:hover,.gallery_menu li a.selected{
	border-left:8px solid #a7c2c2;
	padding-left:8px;
}


.gallery_menu h1{
	font-family: "Georgia";
	width:80%;
	text-align:center;
	margin:20px auto 50px;
	font-size:36px;
	line-height:1.5;
	color:#999;
}
.gallery_menu h2{
	font-family: "Georgia";
	width:80%;
	margin:0 10%;
	text-align:center;
	font-size:14px;
	line-height:2;
	color:#666;
	letter-spacing:0.1em;
	
}

.gallery_menu h3{
	font-family: "Georgia";
	font-size:12px;
	text-align:center;
	line-height:1.8;
	color:#ccc;
	border-bottom:1px solid #ccc;
	letter-spacing:0.1em;
}
.gallery_menu p{
	width:80%;
	margin:0 10%;
	font-size:16px;
	line-height:1.8;
	color:#333;
	letter-spacing:0.1em;
	
}
.gallery_items{
	position:relative;
	width:80%;
	float:right;
	margin-bottom:0px;
}
.gallery_items:after {
  content: '';
  display: block;
  clear: both;
}
.gallery_items li{
	float: left;
	border:0px solid #ffffff;
}
.gallery_items li a{
	text-decoration:none;
	position:relative;
	display:block;
	
	padding:0px;
	margin:0px;
	border:8px solid #ffffff;
}
.gallery_items li a div.detail{
	position:absolute;
	width:110px;
	z-index:99;
	text-align:center;
	font-size:13px;
	letter-spacing:1px;
	color:#ffffff;
	line-height:26px;
	bottom:8px;
	left:50%;
	
	margin-left:-55px;
	border-top:1px solid #ffffff;
	border-bottom:1px solid #ffffff;
	display:none;
}
.gallery_items li .gallery_img{
	position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
	background-color:#a7c2c2;
}
.gallery_items li .gallery_img img{
	position:absolute;
	top:0;
	left:0;
	-o-transition: opacity .5s;
	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	transition:  opacity .5s;
}

.gallery_items li .gallery_txt{
	position:absolute;
	top:20%;
	left:10%;
	width:80%;
	text-align:center;
	z-index:10;
	-o-transition: all .5s;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition:  all .5s;
}
.gallery_items li.item_p .gallery_txt{
	top:35%;
}
.gallery_items li .gallery_txt h2{
	font-size:18px;
	letter-spacing:0.1em;
	padding:30px 8px;
	color:#ffffff;
	-o-transition: all .5s;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition:  all .5s;
	opacity: 0; 
	-moz-opacity:0; 
	-khtml-opacity:0;
	filter:alpha(opacity=0);
}
.gallery_items li .gallery_txt h3{
	border-top:1px solid #fff;
	font-size:12px;
	letter-spacing:0em;
	padding:30px 8px;
	color:#ffffff;
	-o-transition: all .5s;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition:  all .5s;
	opacity: 0; 
	-moz-opacity:0; 
	-khtml-opacity:0;
	filter:alpha(opacity=0);
}
.gallery_items li a:hover .gallery_txt h2{
	padding:15px 8px;
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100);
}
.gallery_items li a:hover .gallery_txt h3{
	padding:15px 8px;
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100);
}
.gallery_items li a:hover .gallery_img img{
	opacity: 0; 
	-moz-opacity:0; 
	-khtml-opacity:0;
	filter:alpha(opacity=0); 
}

.item{
}
.item_l{
	width:200px;
	height:150px;
}
.item_p{
	width:200px;
	height:300px;
}

/* product */
.product{
	width:90%;
	
	margin:0 auto;
	position:relative;
	padding:50px 0;
}
.product:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}
.product_img{
	width:100%;
	margin:0 auto;
	margin-bottom:50px;
}
.product_img:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}
.product_img li{
	position:relative;
	display:block;
	width:100%;
	margin:0;
	float:left;
	-o-transition: opacity .5s;
	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	transition:  opacity .5s;
}
.product_img li:hover{
	opacity: .9; 
	-moz-opacity:.9; 
	-khtml-opacity:.9;
	filter:alpha(opacity=90); 
}
.product_img li a{

}
.product_img li img{
	width:100%;
	height:auto;
}
.product_txt{
	width:100%;
	margin:0 auto;
	color:#000;
}
.product_txt h2{
	font-size:48px;
	color:#000000;
	line-height:1.5;
	font-weight:bold;
}

.product_txt h2 span{
	display:block;
	font-size:18px;
	color:#999;
	line-height:1.5;
	font-weight:100;
}
.product_txt h3{
	font-size:32px;
	color:#a7c2c2;
	margin:10px 0;
	padding:10px 0;
	line-height:1.5;
	font-weight:bold;
	text-align:right;
	
}
.product_txt h3.pid{
	font-size:14px;
	color:#a7c2c2;
	font-weight:100;
	margin:0;
	padding:0;
	text-align:left;
}
.product_txt p,.product_txt div{
	font-family:"文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "標楷體", DFKai-SB, sans-serif;
	margin:20px 0;
	padding:20px 0;
	font-size:15px;
	color:#000000;
	line-height:1.8;
	border-top:px solid #f5f5f5;
	border-bottom:0px solid #ddd;
}
.product_txt div hr{
	margin:5px auto;
	width:100%;
		
}
.product_txt div a{
	color:#000;
	text-decoration:none;
	border-bottom:1px solid #a7c2c2;
		
}
.product_txt div b{
	font-weight:bold;
		
}
.product_txt div span{
	color:#000;
		
}
.product_txt div a:hover{
	color:#a7c2c2;
}
.product_txt > a{
	font-family:"文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "標楷體", DFKai-SB, sans-serif;
	display:block;
	line-height:3;
	text-align:center;
	font-size:18px;
	color:#a7c2c2;
	border:1px solid #a7c2c2;
	background-color:#fff;
	text-decoration:none;
	margin-bottom:8px;
	-o-transition: background .5s;
	-webkit-transition: background .5s;
	-moz-transition: background .5s;
	transition:  background .5s;
}
.product_txt > a img{
	display:none;
}
.product_txt > a:hover{
	color:#ffffff;
	background-color:#a7c2c2;
}
.product_txt > a:hover img{
	display:inline;
}
/*about*/
.head_contact{
	width:100%;
	height:50%;
}
.head_about{
	width:100%;
	height:70%;
}
.slogan_about{
	position:absolute;
	top:40%;
	left:15%;
	width:70%;
	z-index:10;
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100); 
}
.slogan_about h3{
	font-weight:bold;
	font-size:36px;
	line-height:1.5;
	color:#ffffff;
	text-align:center;
	letter-spacing:0.2em;
	word-break:keep-all;
	display:none;
}
.slogan_about p{
	font-family:"Futura";
	font-size:18px;
	line-height:1.5;
	color:#ffffff;
	text-align:center;
	letter-spacing:0.1em;
	display:none;
}

.about{
	width:100%;
	max-width:800px;
	margin:0 auto;
	position:relative;
	padding:50px 0;
}

img.fw{
	max-width:80%;
	margin:10%;
}
.rline{
	border-right:1px dotted #666;
}
.lline{
	border-left:1px dotted #666;
}
.about:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}

.about h1{
	font-family: "Georgia";
	width:80%;
	text-align:center;
	margin:20px auto 50px;
	font-size:36px;
	line-height:1.5;
	color:#666;
}
.about h2{
	font-family: "Georgia";
	width:80%;
	margin:0 10%;
	text-align:center;
	font-size:14px;
	line-height:2;
	color:#666;
	letter-spacing:0.1em;
	
}
.about h3{
	width:80%;
	margin:0 10%;
	font-size:40px;
	line-height:1.3;
	color:#dbc067;
	padding: 20px 0;
	border-top:4px solid #dece97;
	border-bottom:4px solid #dece97;
	letter-spacing:0.1em;
}
.about p{
	width:80%;
	margin:0 10%;
	font-size:15px;
	line-height:1.8;
	color:#333;
	letter-spacing:0.1em;
	
}
.about p span{
	color:#dbc067;
}
.about p.quote{
	border-bottom:1px solid #ddd;
}
.about p.quote span{
	float:right;
	color:#666;
}
.about p.quote_cat{
	font-size:20px;
	color:#F96;
}
.about p a{
	text-decoration:none;
	color:#630;
}

/*order*/
.order{
	width:100%;
	max-width:800px;
	margin:0 auto;
	position:relative;
	padding:50px 0;
	clear:both;
}
.order:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}
.order h2{
	width:80%;
	text-align:center;
	margin:20px auto 50px;
	font-size:36px;
	line-height:1.5;
	color:#666;
	word-break:keep-all;
}
.order h2 span{
	font-size:18px;
	line-height:2;
	color:#999;
	font-family:"Futura";
}
.order p{
	text-align:center;
	font-size:16px;
	line-height:2;
	color:#000;
	padding:30px 0;
}

.order p:hover{
	background-color:#f9f9f9;
}
.order p.bb{
	border-top:1px solid #ccc;
}
.order p span{
	font-size:20px;
	color:#6e9292;
	font-weight:bold;
}
.order p span.rank{
	font-size:18px;
	display:block;
	line-height:40px;
	margin:0 auto 20px;
	width:40px;
	height:40px;
	color:#ffffff;
	font-weight:bold;
	background-color:#6e9292;
	-webkit-border-radius: 40px; 
 	-moz-border-radius: 40px; 
	border-radius: 40px; 
}
.order p span.rank2{
	font-size:14px;
	display:block;
	line-height:40px;
	margin:0 auto 20px;
	width:40px;
	height:40px;
	color:#ffffff;
	font-weight:bold;
	background-color:#ddd;
	-webkit-border-radius: 40px; 
 	-moz-border-radius: 40px; 
	border-radius: 40px; 
}

/*footer*/
.footer{
	
}
.news{
	position:relative;
	top:-30px;
}
.news:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}
.new{
	position:relative;
	width:33.333%;
	float:left;
	background-color:#fff;
}
.new .new_img{
	position:relative;
	width:100%;
	height:200px;
	overflow:hidden;
	background-color:#000;
	background-image:url(../images/read.png);
	background-repeat:no-repeat;
	background-position:center center;
}
.new a .new_img img{
	position:absolute;
	top:0;
	left:0;
	opacity: 1; 
	-moz-opacity:1; 
	-khtml-opacity:1;
	filter:alpha(opacity=100);
	-o-transition: opacity .5s;
	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	transition:  opacity .5s;
}
.new a:hover .new_img img{
	opacity: 0.3; 
	-moz-opacity:0.3; 
	-khtml-opacity:0.3;
	filter:alpha(opacity=30);
}
.new a{
	text-decoration:none;
	color:#666;
}
.new a:hover{
	text-decoration:underline;
}
.new h2{
	display:inline-block;
	position:relative;
	margin-top:-22px;
	padding:0 10px;
	line-height:22px;
	height:22px;
	font-size:13px;
	letter-spacing:0.1em;
	color:#fff;
	background-color:#774f23;
}
.new h3{
	width:90%;
	margin:5px auto;
	font-size:18px;
	color:#000;
	line-height:2;
	font-weight:bold;
	letter-spacing:0.2em;
}
.new p{
	width:90%;
	margin:5px auto;
	font-size:12px;
	color:#000;
	line-height:1.8;	
}
.copyright{
	width:100%;
	background-color:#e5e9ea;	
	padding:40px 0;
	
}
.copyright:after{
	content:"";
	display:block;
	height: 0;
    clear: both;
    visibility: hidden;
}
.content{
	width:100%;
	max-width:1100px;
	margin:0 auto;
}
.part{
	width:21%;
	float:left;
	padding:0 2%;
}
.part h3{
	line-height:1.5;
	font-size:14px;
	color:#c3c8ca;
	margin-bottom:12px;
	border-left:1px solid #c3c8ca;
	padding-left:8px;
	letter-spacing:0.2em;
}
.part p{
	display:block;
	line-height:1.8;
	font-size:12px;
	color:#c3c8ca;
	letter-spacing:0.1em;
}
.part a{
	display:block;
	line-height:1.8;
	font-size:12px;
	color:#336666;
	text-decoration:none;
	text-indent:9px;
	letter-spacing:0.2em;
}
.part a:hover{
	text-decoration:underline;
}



/**** Isotope Filtering ****/

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:         top, left, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}
@media screen and (max-width: 1150px) {
.p40,.p60{
	width:100%;
	float:none;
}
}
@media screen and (max-width: 820px) { /* Specific to this particular image */
.gallery p.des{
	margin:0 auto;
}
.services-topic{
	top:8%;
}

.rline{
	border-right:0px dotted #666;
}
.lline{
	border-left:0px dotted #666;
}
.header{
	background-image:none;
	background-image:url(../images/black.png);
	background-repeat:repeat;
	height:55px;
}
.header.mode2{
	height:55px;
}
.logo a{
	width:160px;
	height:15px;
	margin:20px;
	margin-left:15px;
	background-size:160px 60px;
}
.logo a.mode2{
	width:160px;
	height:15px;
	margin:20px;
	margin-left:15px;
	background-size:160px 60px;
}
.menu{
	padding-top:80px;
}
.menu li a{
	font-size:24px;
	line-height:44px;
}
.menu_mobile{
	margin:10px;
	margin-right:10px;
}
.menu_mobile.mode2{
	margin:10px;
}
.category .cat{
	width:100%;
	min-height:100px;
	background:none;
	background-image:url(../images/white.png);
	background-repeat:repeat;
}
.category .cat_text{
	float:none;
	position:absolute;
	top:0;
	left:0;
	z-index:500;
}
.category:.cat_img{
	float:none;
	z-index:400;
}

.cat_text p.cat_icon{
	margin-top:30px;
}
.hot{
	width:33.3333%;
}
.hot.info{
	display:none;
}
.hot p{
	font-size:15px;
}
.mask{
	background-color:#000;
}
.mask2{
	background-color:#000;
}


.news{
	display:none;
}
.new{
	width:50%;
	padding-bottom:50px;
}
.new.fb_container{
	display:none;
}
.part{
	width:46%;
	padding-bottom:40px;
}
.slogan_about h3{
	font-size:26px;
	
}
.slogan_about p{
	font-size:18px;
}
.p50,.p40,.p60{
	width:100%;
	float:none;
}
.p33{
	width:100%;
	float:none;
}
.gallery_menu{
	width:100%;
	float:none;
	text-align:left;
	margin-bottom:50px;
}

.gallery .preserve{
	width:100%;
	padding:0;
	float:none;
	padding-bottom:40px;
}
.gallery_items{
	width:100%;
	float:none;
}
.gallery_menu li{
	display:inline;
}
.gallery_menu li a{
	text-align:center;
	display:inline-block;
	border:1px solid #ccc;
	padding:5px 10px;
	margin:3px 1px;
}

.gallery_menu li a:hover span,.gallery_menu li a.selected span{
	color:#ffffff;
}
.gallery_menu li a:hover,.gallery_menu li a.selected{
	border:1px solid #333;
	padding:5px 10px;
	color:#ffffff;
	background-color:#333;
}

.newsroom_item{
	width:49%;
}
.about h3{
	font-size:28px;
	text-align:center;
	word-break:keep-all;
}
.hidewhenmobile{
	display:none;
}
.gallery_items li a div.detail{
	display:block;
}
.product_txt h2{
	font-size:28px;
}
.product_txt h2 span{
	font-size:14px;
}
.product_txt h3{
	font-size:20px;
}
.product_txt h3.pid{
	font-size:12px;
}
}

@media screen and (max-width: 520px) { /* Specific to this particular image */
.newsroom_item{
	width:98%;
}
.cat_text p.cat_brief{
	display:none;
}
.hot{
	width:50%;
}
.sliders-topic{
	text-align:center;
	left:5%;
	width:90%;
	bottom:30%;
}
.sliders-topic h2{
	font-size:30px;
}
.sliders-topic h3{
	font-size:15px;
}
.sliders-btns{
	margin-top:15%;
}
.sliders-btns li{
	width:20px;
	height:20px;
	background-image:url(../images/slider-btn-off.png);
	background-repeat:no-repeat;
	background-position:center center;
	-o-transition:none;
	-webkit-transition:none;
	-moz-transition:none;
	transition:none;
}
.sliders-btns li.selected,.sliders-btns li:hover{
	background-size:20px 20px;
}
.new{
	width:100%;
}
.part{
	text-align:center;
	width:96%;
}
.part h3{
	border-left:0px solid #c3c8ca;
	padding-left:0px;
	text-decoration:underline;
}
.part a{
	text-indent:0;
}
.services-topic h2{
	font-size:18px;
}

.services-topic p{
	font-size:12px;
}
.services-btns{
	width:20px;
	height:20px;
}
.services-btns.next{
	background-size:20px 20px;
	right:5px;
	margin-top:-10px;
}
.services-btns.prev{
	background-size:20px 20px;
	left:5px;
	margin-top:-10px;
}
.about h3{
	font-size:22px;
	text-align:center;
}
.slogan_about h3{
	word-break:normal;
}
}