﻿/* 多列图文 */
.portfolio-list { min-height:20px;  position: relative;}
.product-scrollable .price,
.portfolio-list .price{ position: absolute; top: 15px; left:10px;}

.portfolio-list li { margin-bottom:25px; }
	.portfolio-img { margin-bottom:10px; overflow:hidden; }
	.portfolio-img a { position:relative; }
	.portfolio-img a, .portfolio-img img { 
		width:100%; display:block; overflow:hidden;
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
		-webkit-transition: all 0.3s ease-out 0s;
		-moz-transition: all 0.3s ease-out 0s;
		-o-transition: all 0.3s ease-out 0s;
		transition: all 0.3s ease-out 0s;
	}
	.portfolio-img .opacity-overlay {
		width:100%; height:100%; position:absolute; top:0; left:0; z-index:10; cursor:pointer; background-color:#000; opacity:0; filter:alpha(opacity=0); _height:expression( (this.parentElement.clientHeight) +'px'); 
		-webkit-transform:scale(0);
		-moz-transform:scale(0);
		-o-transform:scale(0);
		-ms-transform:scale(0);
		transform:scale(0);
		-webkit-transition:all 0.25s ease-in-out;
		-moz-transition:all 0.25s ease-in-out;
		-o-transition:all 0.25s ease-in-out;
		-ms-transition:all 0.25s ease-in-out;
		transition:all 0.25s ease-in-out;
	}
	.portfolio-img .icon-zoom { display:block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:11; background:url(../images/icon-zoom.png) no-repeat center; }
	.portfolio-img .icon-video { display:block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:11; background:url(../images/icon-video.png) no-repeat center; }
	.portfolio-img a:hover .opacity-overlay { 
		filter:alpha(opacity=70); opacity:0.7;
		-webkit-transform:scale(1);
		-moz-transform:scale(1);
		-o-transform:scale(1);
		-ms-transform:scale(1);
		transform:scale(1);
		-webkit-transition:all 0.25s ease-in-out;
		-moz-transition:all 0.25s ease-in-out;
		-o-transition:all 0.25s ease-in-out;
		-ms-transition:all 0.25s ease-in-out;
		transition:all 0.25s ease-in-out;
	}
	.portfolio-img a:hover img { 
		transform: scale(1.2, 1.2) rotate(10deg);
		-webkit-transform: scale(1.2, 1.2);
		-moz-transform: scale(1.2, 1.2);
		-o-transform: scale(1.2, 1.2);
		-ms-transform: scale(1.2, 1.2);
		-webkit-transition: all 0.3s ease-out 0s;
		-moz-transition: all 0.3s ease-out 0s;
		-o-transition: all 0.3s ease-out 0s;
		transition: all 0.3s ease-out 0s;
	}
	.portfolio-item:hover img, .product-item:hover img, .scrollable-item:hover img { 
		transform: scale(1.2, 1.2);
		-webkit-transform: scale(1.2, 1.2);
		-moz-transform: scale(1.2, 1.2);
		-o-transform: scale(1.2, 1.2);
		-ms-transform: scale(1.2, 1.2);
		-webkit-transition: all 0.3s ease-out 0s;
		-moz-transition: all 0.3s ease-out 0s;
		-o-transition: all 0.3s ease-out 0s;
		transition: all 0.3s ease-out 0s;
	}
	.portfolio-title { margin-bottom:10px; line-height:normal; } 
	.portfolio-title a { text-align:center; display:block;}
	.portfolio-title a:hover { text-decoration:none; color:#FF0000}
	.portfolio-meta { font-size:12px; margin-bottom:10px; color:#808080; }
	.portfolio-meta em { margin:0 8px; }
	.portfolio-meta strong { font-weight:normal; }
	.portfolio-meta a { color:#808080; }
	.portfolio-meta a:hover { color:#cf2a2a; text-decoration:none; }
	.portfolio-summary { color:#808080; font-size:13px; margin-bottom:-10px; }
	.portfolio-summary p { line-height:1.5; }
	.portfolio-detail { padding-right:10px; color:#f30; font-size:13px; background:url(../images/arrow-r.gif) no-repeat right center; }
.portfolio-list .col-4-1 .portfolio-title h2 { font-size:14px; }
.portfolio-list .col-4-1 .portfolio-summary { font-size:12px; }
.portfolio-list .col-5-1 .portfolio-title h2 { font-size:14px;}
.portfolio-list .col-5-1 .portfolio-summary { font-size:12px; }
.portfolio-list-shown .portfolio-img .opacity-overlay { filter:alpha(opacity=40); opacity:0.4; -webkit-transform:scale(1); -moz-transform:scale(1); -o-transform:scale(1); -ms-transform:scale(1); transform:scale(1); }
.portfolio-list-shown .portfolio-img a:hover .opacity-overlay { filter:alpha(opacity=80); opacity:0.8; }
.portfolio-list-shown .portfolio-title { text-align:center; }

.portfolio-gallery .portfolio-title{ text-align: center; }

/*
	.portfolio-item { padding-bottom:20px; background-color:#fff; text-align:center; }
	.portfolio-item .portfolio-title h2 { }
	.portfolio-item .portfolio-title a { color:#333 !important; }
	.portfolio-item .portfolio-title a:hover { color:#cf2a2a !important; }
	.portfolio-item .portfolio-title { padding:5px 10px; }
	.portfolio-item .portfolio-summary  { margin:0 10px; padding-top:5px; }
.portfolio-list .col-2-1 .portfolio-item { min-height:390px; height:auto !important; _height:390px; }
.portfolio-list .col-3-1 .portfolio-item { min-height:360px; height:auto !important; _height:360px; }
.portfolio-list .col-4-1 .portfolio-item { min-height:300px; height:auto !important; _height:300px; }
.portfolio-list .col-5-1 .portfolio-item { min-height:260px; height:auto !important; _height:260px; }
*/

.post-list-item { background-color:#fff; -webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; transition:all 0.3s ease-out 0s; }
.post-img { overflow:hidden; position:relative; }
.post-img img { 
	width:100%; display:block; 
	-webkit-transform:scale(1);	-moz-transform:scale(1); -o-transform:scale(1);	-ms-transform:scale(1);	transform:scale(1);
	-webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; -o-transition:all 0.25s ease-in-out; -ms-transition:all 0.25s ease-in-out; transition:all 0.25s ease-in-out;
}
.post-img span { 
	display:block; width:100%; height:100%; position:absolute; top:0; left:0; background-color:#000; opacity:0; filter:alpha(opacity=0); 
	-webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; -o-transition:all 0.25s ease-in-out; -ms-transition:all 0.25s ease-in-out; transition:all 0.25s ease-in-out;
}
.post-img i { 
	display:block; width:57px; height:57px; position:absolute; top:50%; left:50%; margin-left:-28px; margin-top:-28px; background:url(../images/icon-link.png) no-repeat center; opacity:0; filter:alpha(opacity=0);
	-webkit-transition:-webkit-transform 0.5s ease-out;	-moz-transition:-moz-transform 0.5s ease-out; transition:transform 0.5s ease-out; 
} 
.post-text-box { position:relative; }
.post-text { padding:20px; }
.post-text h2 { line-height:normal; font-size:16px; margin-bottom:10px; }
.post-text-summary { font-size:13px; color:#808080; overflow:hidden; }
.post-text-summary .qhd-content p { line-height:1.6; }
.post-arrow { position:absolute; z-index:10; display:block; overflow:hidden; background-image:url(../images/post-arrow.gif); background-repeat:no-repeat; }
.post-list-item:hover { position:relative; z-index:5; box-shadow:0 0 10px rgba(0,0,0,0.45); 
	/*-webkit-transform:scale(1.01, 1.01); -moz-transform:scale(1.01, 1.01); -o-transform:scale(1.01, 1.01); -ms-transform:scale(1.01, 1.01); transform:scale(1.01, 1.01);*/
}
.post-list-item:hover .post-img img {
	-webkit-transform:scale(1.2, 1.2); -moz-transform:scale(1.2, 1.2); -o-transform:scale(1.2, 1.2); -ms-transform:scale(1.2, 1.2); transform:scale(1.2, 1.2);
	-webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; transition:all 0.3s ease-out 0s;
}
.post-list-item:hover .post-img span { opacity:0.6; filter:alpha(opacity=60); }
.post-list-item:hover .post-img i { opacity:1; filter:alpha(opacity=100); -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); transform:rotate(360deg); }

.post-text-center { text-align:center; }
.post-text-detail { padding-top:10px; line-height:normal; }
.post-text-detail a { display:inline-block; *display:inline; *zoom:1; color:#999; font-size:12px; -webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; transition:all 0.3s ease-out 0s; }
.post-text-detail a:hover {  color:#fab702 !important; }
.light-box .post-text-detail a { color:#999 !important; }

.post-list-2col .post-img, .post-list-2col .post-text-box { float:left; width:50%; }
.post-list-2col .post-text { padding:30px; }
.post-list-2col .post-text h2 { margin-bottom:15px; }
.post-list-2col .post-list-item .post-arrow { width:10px; height:19px; top:50%; left:-10px; margin-top:-10px; background-position:0 -42px; }
.post-list-2col .post-list-item-spec .post-img { float:right; }
.post-list-2col .post-list-item-spec .post-arrow { top:50%; left:auto; right:-10px; margin-top:-10px; background-position:0 -11px; }

.post-list-3col .post-list-item { float:left; width:33.33333%; }
.post-list-3col .post-list-item .post-text { padding:30px; }
.post-list-3col .post-list-item .post-arrow { width:19px; height:10px; top:-10px; left:50%; margin-left:-10px; background-position:0 0; }
.post-list-3col .post-list-item-spec .post-img { top:280px; }
.post-list-3col .post-list-item-spec .post-text-box { top:-280px; }
.post-list-3col .post-list-item-spec .post-arrow { top:auto; bottom:-10px; background-position:0 -31px; }

.post-list-4col .post-list-item { width:50%; float:left; }
.post-list-4col .post-img, .post-list-4col .post-text-box { width:50%; float:left; }
.post-list-4col .post-list-item .post-arrow { width:10px; height:19px; top:50%; left:-10px; margin-top:-10px; background-position:0 -42px; }
.post-list-4col .post-list-item-spec .post-img { float:right; }
.post-list-4col .post-list-item-spec .post-arrow { top:50%; left:auto; right:-10px; margin-top:-10px; background-position:0 -11px; }
.post-list-4col .post-text h2 { font-size:15px; }


.portfolio-grid { }
.portfolio-grid-item { float:left; }
.portfolio-grid-item a { display:block; position:relative; }
.portfolio-grid-img { overflow:hidden; }
.portfolio-grid-img img { 
	display:block; width:100%;
	-webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1);
	-webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; transition:all 0.3s ease-out 0s; 
}
.portfolio-grid-text { 
	position:absolute; top:38%; left:0; z-index:11; width:100%; opacity:0; filter:alpha(opacity=0); 
	-webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; transition:all 0.3s ease-out 0s;
}
.portfolio-grid-text h3 {
	font-size:15px; text-align:center; padding:0 15px; margin-top:-15px; 
	-webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; transition:all 0.3s ease-out 0s; 
}
.portfolio-grid-item .overlay { 
	display:block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:10; background-color:#000; opacity:0; filter:alpha(opacity=0); _height:expression( (this.parentElement.clientHeight) +'px'); 
	-webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; transition:all 0.3s ease-out 0s; 
}
.portfolio-grid-item a:hover img { 
	-webkit-transform:scale(1.2, 1.2); -moz-transform:scale(1.2, 1.2); -o-transform:scale(1.2, 1.2); -ms-transform:scale(1.2, 1.2); transform:scale(1.2, 1.2);		
	-webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; transition:all 0.3s ease-out 0s;
}
.portfolio-grid-item a:hover .portfolio-grid-text { opacity:1; filter:alpha(opacity=100); }
.portfolio-grid-item a:hover .portfolio-grid-text h3 { margin-top:0px; }
.portfolio-grid-item a:hover .overlay { opacity:0.8; filter:alpha(opacity=80); }


.portfolio-grid-4col .portfolio-grid-item { width:25%; }
.portfolio-grid-3col .portfolio-grid-item { width:33.333%; }



.not-animated { opacity:0; }
