@charset "UTF-8";
.itemList .index-product-cover, .itemList li .index-product-item{
	transition: all 0.4s ease;
	}

.itemList .index-product-cover .boder_line span:before, .itemList .index-product-cover .boder_line span:after, .itemList .index-product-cover .boder_line:before, .itemList .index-product-cover .boder_line:after {
	position: absolute;
	content:"";
	display:block;
	transition:all 1s;
	background-color:#f9b707;
	opacity:0;
	}

.itemList .index-product-cover .boder_line span:after, .itemList .index-product-cover .boder_line:before {
	width:0;
	height:2px;
	}

.itemList .index-product-cover .boder_line span:before, .itemList .index-product-cover .boder_line:after {
	width:2px;
	height:0;
	}

.itemList li:hover .index-product-item .index-product-cover .boder_line span:after, .itemList li:hover .index-product-item .index-product-cover .boder_line:before {
	width:100%;
	height:2px;
	}

.itemList li:hover .index-product-item .index-product-cover .boder_line span:before, .itemList li:hover .index-product-item .index-product-cover .boder_line:after{
	width:2px;
	height:100%;
	}

.classNote{
	padding-bottom:10px;
	line-height:1.8;
	font-size:15px;
	color:#222;
	}

.classNote h2{text-align:center;}

.classNote img{
  max-width:100%;
  -webkit-backface-visibility:hidden;
          backface-visibility:hidden;
}

.itemList{margin:0 -15px; display:flex; flex-wrap:wrap;}

.itemList li{width:25%; padding:0 15px 30px;}

.itemList li:hover .index-product-item .index-product-cover{
	box-shadow:0px 0px 38px 0px rgba(0, 0, 0, 0.36);
	}

.itemList li:hover .index-product-item .index-product-cover:before{
	transform:scale(1.05);
	opacity:1;
	}

.itemList li:hover .index-product-item .index-product-cover .boder_line:before, .itemList li:hover .index-product-item .index-product-cover .boder_line:after{
	opacity:1;
	}

.itemList li:hover .index-product-item .index-product-cover .boder_line span:before, .itemList li:hover .index-product-item .index-product-cover .boder_line span:after{
	opacity:1;
	}

.itemList .index-product-cover{
	background-image:url(../images/index-product-bg.jpg);
	background-repeat:no-repeat;
	position:relative;
	overflow:hidden;
	}

.itemList .index-product-cover a{
	display:block;
	overflow:hidden;
	}

.itemList .index-product-cover img{
	display:block;
	width:100%;
	display:block;
	width:100%;
	-webkit-backface-visibility:hidden;
	      backface-visibility:hidden;
	position:relative;
	z-index:2;
	}

.itemList .index-product-cover .boder_line{
	position:absolute;
	left:10px;
	right:10px;
	top:10px;
	bottom:10px;
	margin:auto;
	z-index:1;
	}

.itemList .index-product-cover .boder_line:before, .itemList .index-product-cover .boder_line:after{
	left:0;
	top:0;
	}

.itemList .index-product-cover .boder_line span{
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
	z-index:1;
	}

.itemList .index-product-cover .boder_line span:before, .itemList .index-product-cover .boder_line span:after{
	right:0;
	bottom:0;
	}

.itemList .index-product-cover:before{
	content:"";
	display:block;
	background-image:url(../images/index-product-bg-hover.jpg);
	background-repeat:no-repeat;
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
	background-size:cover;
	transition:all 0.3s linear;
	opacity:0;
	}

.itemList .index-product-cover:hover img{
	transform: scale(1.0, 1.0);
	transition:all 0.5s ease 0s;
	}

.itemList .index-product-cover:hover img{
	transform: scale(1.1, 1.1);
	transition:all 0.25s ease 0s;
	}

.index-product-itemList .index-product-txt{
	padding:15px;
	text-align:center;
	background-color:#fff;
	}

.itemList .index-product-txt p{
	width:90%;
	margin:0 auto;
	padding:10px 0;
	/*height:60px;*/
	line-height:1.8;
	font-size:16px;
	color:#000;
	}

.itemList h3{
	/*white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;*/
	min-height:90px;
	text-align:left;
	background-color:rgba(0, 0, 0, 0.3);
	letter-spacing:inherit;
	text-transform:inherit;
	padding-left:25px;
	}

.itemList h3 a{
	display:block;
	font-size:22px;
	font-weight:600;
	line-height:1.3em;
	color:#fff;
	text-shadow:#000 0.1em 0.1em 0.2em;
	/*white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;*/
	padding:10px 0;
	transition:all 0.4s ease;
	}

.index-product-item:hover h3{/*background-color:rgba(234, 96, 0, 1);*/}
.index-product-item:hover h3 a{/*color:#fff;*/}

.pageBox{text-align:center;}

/********標題區*******/
.titleArea {
	clear:both;
	margin-bottom:30px;
	padding:15px 10px;
	border-bottom:1px dashed #b6b6b6;
	}

.titleArea h1{
	font-size:19px;
	font-weight:400;
	color:#2f2f2f;
	overflow:hidden;
	}

.titleArea h1 strong{
	display:block;
	font-weight:400;
	}

/*標題區左-訊息日期*/
.titleArea h1 b{
	margin-left:5px;
	font-size:12px;
	font-weight:400;
	color:#a3a3a3;
	}

.titleArea .btn-fb{float:left;}

.titleArea a.back{
	float:right;
	display:block;
	margin-left:5px;
	font-size:10pt;
	color:#06F;
	cursor:pointer;
	}

.articleTitle{text-align:left;}

.articleTitle:after{margin-left:0;}

.albumBox{margin-right:30px; padding:0;}

.albumBox img{
	display:block;
	width:100%;
	-webkit-backface-visibility:hidden;
	      backface-visibility:hidden;
	}

.side_album{width:100%; margin:20px -1px 0;}

.side_album li{float:left; width:25%; overflow:hidden;}

.side_album img{
	display:block;
	width:100%;
	-webkit-backface-visibility: hidden;
	       backface-visibility: hidden;
	}

.side_album a{display:block;}

/*產品介紹縮圖文字*/
.introBox{overflow:hidden;}

.introBox .Txt{
	margin-top:20px;
	line-height:1.6;
	font-size:15px;
	color:#6c6c6c;
	}

.introBox .btn{text-align:center;}

.introBox .btn a{
	display:inline-block;
	font-size:15px;
	color:#eb2935;
	background-color:#ffffff;
	border:1px solid #eb2935;
	}

.introBox .btn a:hover{
	color:#ffffff;
	background-color:#eb2935;
	border-color:#ffffff;
	}

.share{
	clear:both;
	padding-top:10px;
	margin-top:20px;
	border-top:1px dashed #ccc;
	}

.share b{
	display:inline-block;
	font-size:13px;
	font-weight:400;
	color:#666;
	}

.share a{
	display:inline-block;
	width:25px;
	font-size:18px;
	color:#666;
	text-align:center;
	}

.share a:hover{opacity:0.8;}

.code{display:block; font-size:12px; font-weight:400; color:#999;}


@media (max-width:980px){
	.itemList h3 a{font-size:20px;}
	}

@media (max-width:768px){
	.itemList li{width:50%;}
	}

@media (max-width: 767px){
	.productIntro .albumBox{float:none; margin:0 0 30px 0;}
	}

@media (max-width:480px){
	.itemList{display:block; margin:0;}
	.itemList li{width:100%; padding-left:0; padding-right:0;}
	}