/*202003 by pekey*/
@charset "utf-8";
/* CSS Document */

/*------------------------------------------CSS Reset 開始-------------------------------*/

/*/////////////////////////////////////////////////////////*/
/*-------主內容區塊--------*/
/*/////////////////////////////////////////////////////////*/

.main.home_main{
	padding: 0 0 50px;
}

@media (max-width: 1600px){

	.main.home_main{
		padding: 0 0 20px;
	}
	
}

@media (max-width: 990px){

	.main.home_main{
		padding: 0 0 5px;
	}
	
}



/*///////////////////////////*/
/*------- banner輪播 --------*/
/*///////////////////////////*/
.banner {
	background:transparent;
	position:relative;
}

	.device {
		position:relative;
		overflow:hidden;
	}
		/*左右鍵*/
		.device .arrow-left, .device .arrow-right {
			position:absolute;
			z-index:9;
			top:50%;
			margin:-18px 0px 0px 0px;
			opacity:0;
			transition:0.3s ease all;
		}
		
			/*左鍵*/
			.device .arrow-left {
				left:-20px;
			}
			
			/*右鍵*/
			.device .arrow-right {
				right:-20px;
			}
				.device:hover .arrow-left {
					opacity:1;
					left:20px;
				}
				.device:hover .arrow-right {
					opacity:1;
					right:20px;
				}
		
		/*輪播區*/
		.swiper-container {
			height:auto;
		}
			.swiper-wrapper {
			}
				.swiper-slide {
				}
					.swiper-slide img {
						width:100%;
						height:auto;
					}
		
		/*輪播點點*/
		.swiper-pagination {
		position: absolute;
		z-index: 1;
		bottom: -39px;
		width: 100%;
		text-align: center;

		display: none;
		}
			.swiper-pagination-switch {
			display: inline-block;
			width: 20px;
			height: 20px;
			border-radius: 5px;
			background: #edbdb4;
			margin: 0 7px;
			cursor: pointer;
			}
			.swiper-active-switch {/*輪播點點當前模式*/
			background: #c42605;
			}
				/*客制區塊*/
				.swiper-slide {
					position:relative;
				}
				.pcBanner2 {
				}
				.mobileBanner {
					display:none;
				}
				
				
@media (max-width: 1023px){
	.device {
		height:auto;
	}
		/*左右鍵*/
		.device .arrow-left, .device .arrow-right {
			display:none;
		}
}

@media (max-width: 641px){
	.pcBanner{
		display: none;
	}
		.mobileBanner {
			display: block;
		}
}
				



/*/////////////////////////////////////////////////////////*/
/*-------首頁內容區塊--------*/
/*/////////////////////////////////////////////////////////*/


	/*首頁內容區塊*/	
	.mainContent{
		
	}


	
@media (max-width: 1023px){
	
	.main {
		
	}	
}




/*///////////////////////////*/
/*------- 關鍵字區塊 --------*/
/*///////////////////////////*/

/* 關鍵字區 */
.keywordBg{
	padding: 30px 0 15px;
}
	.keywordBg .wrap{
	}
		.keywordBg ul{
			padding: 0;
			margin: 0;
			list-style-type: none;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			margin: 0 -15px;
		}
			.keywordBg li{
				padding: 0;
				margin: 0;
				list-style-type: none;
				padding: 5px 15px;
			}
			.keywordBg li a{
				color: #333;
				display: block;
				text-decoration: none;
			}		
			.keywordBg li a:hover{
				opacity: 0.5;
			}				


	
@media (max-width: 990px){

	.keywordBg ul{
		justify-content:unset;
		margin: 0 -5px;
	}	
		.keywordBg li{
			padding: 5px 5px;
		}
}
			



/*///////////////////////////*/
/*------- 廣告圖區塊 --------*/
/*///////////////////////////*/
.ad_mainBg {
}

	/* 列表區塊 */
	.ad_mainBg .list_area{
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		align-items: flex-start;
		justify-content: space-between;
		margin: 0 -12px;
		/* padding: 24px 0 0 ;*/
	}

	.ad_mainBg .list {
		width: 33.3%;
		box-sizing: border-box;
		/* padding: 0px 12px 24px; */
		padding: 15px 12px 0px;
	}

	.ad_mainBg .list.big {
		width: 100%;
	}
		.ad_mainBg .list.big .text_area{
			text-align: center;
			font-size: 20px;
			line-height: 1.2;
			margin: 30px 0;
			font-weight: bold;
			color: #6f777a;
		}

	.ad_mainBg .list.four {
		width: 25%;
	}
		.ad_mainBg .list a {
			display: block;
			text-decoration: none;
			font-size: 0;
		}
		
		.ad_mainBg .list a:hover {
			transition:0.3s ease all;
			opacity: 0.7;
		}
			.ad_mainBg .list a img {
				width: 100%;
				height: auto;
			}
			
	.ad_mainBg img{
		display:block;
		vertical-align:top;
	}
			


@media (max-width: 990px){

	.ad_mainBg .list.big .text_area{
		font-size: 17px;
		margin: 20px 0;
	}

}

@media (max-width: 767px){

	.ad_mainBg .list_area{
		margin: 0 -4px;
		padding: 8px 0 0;
	}
		.ad_mainBg .list {
			/* width: 50%; */
			padding: 0px 4px 8px;
		}
		.ad_mainBg .list.four {
			width: 50%;
		}

		.ad_mainBg .list.big .text_area{
			font-size: 14px;
			line-height: 1.5;
			margin: 15px 0;
		}
}


/*///////////////////////////*/
/*------- 影片+news圖區塊 --------*/
/*///////////////////////////*/

.ad_mainBg.NewsVideo{
	margin: 0;	
	padding: 15px 0 0;
}
	.ad_mainBg.NewsVideo .list_area{
		margin: 0;	
		justify-content:space-between;
	}


/* 影片	----------------------------------- */
.list.video {
	width: 70%;
	position: relative;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0;
	cursor: pointer;
}

.list.video > .vL_text_area {
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: unset;
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

	.list.video .vL_text_area img {
		width: 100px;
		height: auto;
		margin: 0 auto;
	}

	.list.video img {
		width: 100%;
		height: auto;
	}


/* 最新消息	----------------------------------- */
.list.news {
	width: 29%;
	padding: 0;
}

	.indexNewsIn {
		box-shadow: 0px 0px 19px 3px #0000002e;
	}

		.indexNewsImg {		
		}
			.indexNewsImg img {
				width: 100%;
				height: auto;
			}

		.indexNewsBottom {
			padding: 20px;
		}
			.indexNewsBottom .text {
				font-size: 18px;
				line-height: 1.5;
				color: #515151;
			}
			.indexNewsBottom .btn {
				/* color: #000; */
				font-size: 20px;
				margin: 20px 0 0;
				font-weight: bold;
			}
				.indexNewsBottom .btn a {
					color: #2ea7e0;
					text-decoration: none;
					display: block;
					font-size: 20px;
				}



@media (max-width: 767px){
		
	.ad_mainBg.NewsVideo {
		padding: 0px 0 0;
	}
		.NewsVideo .list_area {
			margin: 0 0px;
			padding: 8px 0 0;
		}
	
		/* 影片	----------------------------------- */
		.list.video {
			width: 100%;
			padding: 0px 0px 0px;
			height: 200px !important;
		}
			.list.video .vL_text_area img {
				width: 80px;
			}
			
		/* 最新消息	----------------------------------- */
		.list.news {
			padding: 16px 0px 8px;
			width: 100%;
		}


}










/*///////////////////////////*/
/*------- 產品區塊 --------*/
/*///////////////////////////*/
.product_mainBg{
}



/* 產品列表區塊		 */
.product_mainBg .prodict_listArea.B_type{
	margin: 0px -10px;
}

	/* 列表 */
	.product_mainBg .prodict_list.B_type{
		padding: 15px 10px;
	}


		/* 品名 */
		.product_mainBg .prodict_list .name a{
			font-size: 22px;
			line-height: 28px;
			font-weight: normal;
		}


		.product_mainBg .prodict_list.B_type .price{
			text-align: right;
		}
			.product_mainBg .prodict_list.B_type .price .content{
				float: none;
				padding-top: 15px;
			}

				/* 會員價.優惠價 */
				.product_mainBg .prodict_list.B_type .member_price{
					font-size: 22px;
					line-height: 28px;
					padding-right: 0;
					float: none;
				}

				/* 原價 */
				.product_mainBg .prodict_list.B_type .orignal_price{
					font-size: 18px;
					line-height: 24px;
					float: none;
				}

				
			
@media (max-width: 769px){

.product_mainBg .prodict_listArea.B_type{
	margin: 0px -4px;
}

	/* 列表 */
	.product_mainBg .prodict_list.B_type{
		padding: 15px 4px;
	}

	/* 品名 */
	.product_mainBg .prodict_list .name a{
		font-size: 18px;
		line-height: 24px;
	}

		.product_mainBg .prodict_list.B_type .price .content{
			padding-top: 10px;
		}

			/* 會員價.優惠價 */
			.product_mainBg .prodict_list.B_type .member_price{
				font-size: 18px;
				line-height: 24px;
			}

			/* 原價 */
			.product_mainBg .prodict_list.B_type .orignal_price{
				font-size: 14px;
				line-height: 20px;
			}

}

@media (max-width: 641px){


/* 品名 */
.product_mainBg .prodict_list .name a{
	font-size: 14px;
	line-height: 20px;
}
	.product_mainBg .prodict_list.B_type .price .content {
		padding-top: 5px;
	}

	/* 會員價.優惠價 */
	.product_mainBg .prodict_list.B_type .member_price{
		font-size: 16px;
		line-height: 22px;
	}

	/* 原價 */
	.product_mainBg .prodict_list.B_type .orignal_price{
		font-size: 14px;
		line-height: 20px;
	}
}















 
/*/////////////////////////////////////////////////////////*/
/*-------瀏覽紀錄--------*/
/*/////////////////////////////////////////////////////////*/



.BrowsingHistoryBg {
	/* position: relative;
	max-width: 110px;
	width: 110px;*/
	position: fixed;
	/*right: 0;*/
	right: -130px;
	bottom: 50%;
	-webkit-transform: translateY(50%);
	transform: translateY(50%);
	/* bottom: 30%; */
	transition: 0.3s ease all;   
	z-index: 10;
 }
 .BrowsingHistoryBg.active{
	 /*right: -130px;*/
	 right: 0;
	 transition: 0.3s ease all;
 }
 
 
		 .fixedRightBHZoom{
			 position: absolute;
			 top: 0px;
			 right: 130px;
			 cursor: pointer;
		 }
			 .fixedRightBHZoom span{
				 display: block;
				 background: rgb(51 51 51 / 0.85);
				 color: #fff;
				 font-size: 12px;
				 line-height: 21px;
				 border-radius: 5px 0px 0px 5px;
				 padding: 65px 5px 10px 5px;
				 /* max-width: 14px;*/
			 }
			 .fixedRightBHZoom span:hover{
				 background: #c1272d;
				 transition: 0.3s ease all;
			 }	
			 
			 .fixedRightBHZoom span:before {
				 position: absolute;				
				 content: "\E11d";
				 top: 5px;
				 font-size: 17px;
				 line-height: 17px;
				 font-family: 'LigatureSymbols';
				 display: block;
				 text-align: center;	
				 color: #f8b62d;			
			 }	
			 .fixedRightBHZoom span:after {
				 position: absolute;
				 content: "縮小";
				 top: 25px;
				 left: -2px;
				 font-size: 12px;
				 line-height: 17px;
				 text-align: center;	
				 color: #f8b62d;						
			 }	
			 .BrowsingHistoryBg.active .fixedRightBHZoom span:before {
				 content: "\E053";
			 }	
			 .BrowsingHistoryBg.active .fixedRightBHZoom span:after {
				 content: "放大";				
			 }
 
 
		 
		 .BrowsingHistoryArea{
			 background-color: rgb(51 51 51 / 0.85);
			 padding: 5px 10px;
		 }
		 
		 .swiper-container_bh{
			 height: 220px;
			 /*margin: 0 auto;
			 position: relative;
			 overflow: hidden;
			 list-style: none;
			 padding: 0;
			 z-index: 1;*/
		 }
			 .swiper-container_bh .swiper-slide {
				 box-sizing: border-box;
				 padding: 0px 0px;
				 height: 110px;
				 max-height: 110px;
				 /*min-height: 110px;*/
			 }
				 .swiper-container_bh a{
					 display: block;
					 text-decoration: none;
				 }
		 
		 
				 .hbt_next {
					 text-align: center;
					 cursor: pointer;
					 /*padding-top: 10px;*/
				 }
				 .hbt_before {
					 text-align: center;
					 cursor: pointer;
					 /*padding-top: 10px;*/
				 }
				 .hbt_next img ,
				 .hbt_before img{
					width: 50px;				 
				 }
				 
					 .hbt_before i ,
					 .hbt_next i{
						 color: #fff;
						 font-size: 36px;
					 }
					 .hbt_before i:hover ,
					 .hbt_next i:hover{
						 opacity: 0.5;
					 }					
				 
		 
				 .History_list{
					 position:relative;
					 width:110px;
					 height:110px;
					 max-width: 95%;
					 max-height: 95%;
					 margin: 0 auto;
				 }  
					 .History_list a{
						 display:block;
						 text-decoration:none;
						 transition: 0.3s ease all;
					 } 
					 .History_list a:hover{
						 opacity:0.5;
					 } 				
					 
				 .HistoryImg{	
					 display: block;
					 position: relative;
					 padding-top: 100%;
				 }  					
					 .HistoryImg img{
						border: 1px #7d7d7d solid;
						position: absolute;
						top: 0;
						left: 0;
						bottom: 0;
						right: 0;
						float: none;
						/* border-radius: 50%; */
						width: 100% !important;
						height: 100% !important;
						object-fit: cover;
					 }