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

/*------------------------------------------CSS Setting Start-------------------------------*/

/*================*/
/*-- loading --*/
/*================*/

.loading {
 	position: fixed;
    top: 0; 
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999999;
    background: #FFF;
	text-align:center;
	
	/*新增by pekey 20171211*/
	padding-top:250px;
 } 
 
	
	/*Loading畫面CSS開始*/
	#circularG{
		position:relative;
		width:58px;
		height:58px;
		margin: auto;
	}
	
	.circularG{
		position:absolute;
		background-color:rgb(201,9,21);  /*此為Loding的點點顏色*/
		width:14px;
		height:14px;
		border-radius:9px;
			-o-border-radius:9px;
			-ms-border-radius:9px;
			-webkit-border-radius:9px;
			-moz-border-radius:9px;
		animation-name:bounce_circularG;
			-o-animation-name:bounce_circularG;
			-ms-animation-name:bounce_circularG;
			-webkit-animation-name:bounce_circularG;
			-moz-animation-name:bounce_circularG;
		animation-duration:1.1s;
			-o-animation-duration:1.1s;
			-ms-animation-duration:1.1s;
			-webkit-animation-duration:1.1s;
			-moz-animation-duration:1.1s;
		animation-iteration-count:infinite;
			-o-animation-iteration-count:infinite;
			-ms-animation-iteration-count:infinite;
			-webkit-animation-iteration-count:infinite;
			-moz-animation-iteration-count:infinite;
		animation-direction:normal;
			-o-animation-direction:normal;
			-ms-animation-direction:normal;
			-webkit-animation-direction:normal;
			-moz-animation-direction:normal;
	}
	
		#circularG_1{
			left:0;
			top:23px;
			animation-delay:0.41s;
				-o-animation-delay:0.41s;
				-ms-animation-delay:0.41s;
				-webkit-animation-delay:0.41s;
				-moz-animation-delay:0.41s;
		}
		
		#circularG_2{
			left:6px;
			top:6px;
			animation-delay:0.55s;
				-o-animation-delay:0.55s;
				-ms-animation-delay:0.55s;
				-webkit-animation-delay:0.55s;
				-moz-animation-delay:0.55s;
		}
		
		#circularG_3{
			top:0;
			left:23px;
			animation-delay:0.69s;
				-o-animation-delay:0.69s;
				-ms-animation-delay:0.69s;
				-webkit-animation-delay:0.69s;
				-moz-animation-delay:0.69s;
		}
		
		#circularG_4{
			right:6px;
			top:6px;
			animation-delay:0.83s;
				-o-animation-delay:0.83s;
				-ms-animation-delay:0.83s;
				-webkit-animation-delay:0.83s;
				-moz-animation-delay:0.83s;
		}
		
		#circularG_5{
			right:0;
			top:23px;
			animation-delay:0.97s;
				-o-animation-delay:0.97s;
				-ms-animation-delay:0.97s;
				-webkit-animation-delay:0.97s;
				-moz-animation-delay:0.97s;
		}
		
		#circularG_6{
			right:6px;
			bottom:6px;
			animation-delay:1.1s;
				-o-animation-delay:1.1s;
				-ms-animation-delay:1.1s;
				-webkit-animation-delay:1.1s;
				-moz-animation-delay:1.1s;
		}
		
		#circularG_7{
			left:23px;
			bottom:0;
			animation-delay:1.24s;
				-o-animation-delay:1.24s;
				-ms-animation-delay:1.24s;
				-webkit-animation-delay:1.24s;
				-moz-animation-delay:1.24s;
		}
		
		#circularG_8{
			left:6px;
			bottom:6px;
			animation-delay:1.38s;
				-o-animation-delay:1.38s;
				-ms-animation-delay:1.38s;
				-webkit-animation-delay:1.38s;
				-moz-animation-delay:1.38s;
		}
		
		
		
		@keyframes bounce_circularG{
			0%{
				transform:scale(1);
			}
		
			100%{
				transform:scale(.3);
			}
		}
		
		@-o-keyframes bounce_circularG{
			0%{
				-o-transform:scale(1);
			}
		
			100%{
				-o-transform:scale(.3);
			}
		}
		
		@-ms-keyframes bounce_circularG{
			0%{
				-ms-transform:scale(1);
			}
		
			100%{
				-ms-transform:scale(.3);
			}
		}
		
		@-webkit-keyframes bounce_circularG{
			0%{
				-webkit-transform:scale(1);
			}
		
			100%{
				-webkit-transform:scale(.3);
			}
		}
		
		@-moz-keyframes bounce_circularG{
			0%{
				-moz-transform:scale(1);
			}
		
			100%{
				-moz-transform:scale(.3);
			}
		}
	/*Loading畫面CSS結束*/

.loading_tit{
	padding:20px 0px 0px 15px;
	display:inline-block;
	font-size:16px;
	font-weight:bold;
	color:#333;
	font-family:微軟正黑體;
	text-align:center;
}







#top{
	position:absolute;
	top:-100%;
}

.headertop{
	border-top: 0px solid #fff0;
}





/*/////////////////////////////////////////////////////////*/
/*-------版頭--------*/
/*/////////////////////////////////////////////////////////*/

.header {
	position: fixed;
	top: 0;
	z-index: 999;
	width: 100%;
	transition: 0.3s ease all;
	background-color: #fff;
}

/*浮動*/
.header.fixed{
	box-shadow: 0px 0px 20px -1px rgba(0,0,0,0.3);
	transition: 0.3s ease all;
	padding: 0px;
	background-color: #fff;
}

	.header > .wrap {
		position: relative;
		max-width: 109.5rem; /*1752px*/
		width: 92%;
	}




/* 在螢幕寬度大於991時，套用這裡的特定樣式 */ 
@media screen and (min-width: 991px) {

	.header > .wrap {
		display: flex;
		justify-content: space-between;
	}


}

/* 在螢幕放大125%且寬度大於991時，套用這裡的特定樣式 */
@media screen and (min-width: 991px) and (min-height: 500px) and (max-height: 1000px) and (-webkit-min-device-pixel-ratio: 1.25) and (-webkit-max-device-pixel-ratio: 1.49), only screen and (min-resolution: 125dpi) and (max-resolution: 149dpi) {

	.header .wrap {
		width: 90%; 
	}

}

/* 在螢幕放大150%且寬度大於991時，套用這裡的特定樣式 */
@media screen and (min-width: 991px) and (min-height: 500px) and (max-height: 1000px) and (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.74), only screen and (min-resolution: 150dpi) and (max-resolution: 174dpi) {

	.header .wrap {
		width: 90%; 
	}

}








/*================*/
/*-- 手機menu按鍵 --*/
/*================*/
.menu_btn {
	position:absolute;
	width:20px;
	top: 50%;
    transform: translateY(-50%);
	right: 0;
	cursor:pointer;
	display:none;
	z-index: 99;
}
	.menu_btn span {
		display:block;
		background-color: var(--primary_color);
		height: 4px;
		width: calc(100% - 10px);
		margin: 4px 0px;
		transition:0.3s ease all;
		border-radius:3px;
		margin: 0;
	}
		/*點擊*/
		.menu_btn.active{
			top: 10px;
			transform: unset;
			/* border-color: #fff; */
		}
		.menu_btn.active span {
			/* background-color: #fff; */
			margin: -0.9px 0;
			margin-left: 8px;
		}
			.menu_btn.active span:nth-of-type(1) {
				transform: rotate(39deg);
				transform-origin: top left;
			}
			.menu_btn.active span:nth-of-type(2) {
				opacity: 0;
			}
			.menu_btn.active span:nth-of-type(3) {
				transform: rotate(-39deg);
				transform-origin: bottom left;
			}

@media (max-width: 990px){
	
	/*手機menu按鍵*/
	.menu_btn {
		display:block;
		border: 2px var(--primary_color) solid;
		aspect-ratio: 1;
		width: 45px;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		gap: 7px;
	}

}

@media (max-width: 360px){

	/*點擊*/
	.menu_btn.active{
		top: 14px;
	}

}







/*================================*/
/*----- logo -----*/
/*================================*/
.logo{	 
	 margin: 0;
	 transition: 0.3s ease all;
	 box-sizing: border-box;
	 animation-name: bounceIn;
	 animation-duration: 1.2s;
	 animation-fill-mode: both;
	 visibility: visible;
	 /* 最小值 10.58px、大小約 1.0677vw、最大值 20.50px */
	 padding: 0;
	 width: 9.375rem; /*150px*/
}

	.logo a ,
	.logo_fix a{
		display: block;
		transition:0.3s ease all;
		/*padding: clamp(0.2903rem, 0.4688vw, 0.5625rem) 0;*/ /* 最小值 4.65px、大小約 0.4688vw、最大值 9.00px */
		padding: .625rem 0;
	}
	
		.logo img {
			width: 100%;
			height: auto; 
		} 
		
		/*hover*/
		.logo a:hover{
			transform: scale(0.9);
			animation: bounceIn;	
		}
	

		


@media (max-width: 990px){
	.logo{
		transition: 0.3s ease all;
		/* width: 150px; */
		/* width: 270px; */
		/* padding: 10px 0px; */
		float: none;
		margin: 0;
	}
	
}

@media (max-width: 640px){
	
}
	


@media (max-width: 360px){

	.logo{
		width: 100px;
	}
		.logo a {
			padding: 24px 0;
		}
	
}

/*================================*/
/*----- 版頭上方區塊 -----*/
/*================================*/

.header_top{

}
	.header_top .wrap{
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
	}
		ul.header_top_link_area{
			transition: 0.3s ease all;
			margin: 0;
			padding: 0;
			list-style-type : none;
			display: block;

			display: flex;
			justify-content: center;
			align-items: center;
			gap:  clamp(.3125rem, 0.5208vw, .625rem);/* 5 ~ 10px */

			/*font-size: clamp(0.6875rem, 0.6771vw, 0.8125rem);*/ /* 字體 最小值 11.00px、大小約 0.6771vw、最大值 13.00px */

			font-size: clamp(0.8125rem, 0.8002vw, 0.9602rem); /* 字體 最小值 13.00px、大小約 0.8002vw、最大值 15.36px */
			color: var(--dark_color);
		}
		ul.header_top_left{
			position: absolute;
			top: 10px;
			left: 0;
		}
		ul.header_top_right{
			position: absolute;
			top: 10px;
			right: 0;
		}
			ul.header_top_link_area li{
				margin: 0;
				padding: 0;
				list-style-type : none;
				display: block;
				position: relative;
			}
				ul.header_top_link_area li span{
					
				}
				ul.header_top_link_area li a{
					color: inherit;
					text-decoration: none;
				}
				ul.header_top_link_area li a:hover{
					opacity: 0.7;
				}

				ul.header_top_right li > a{
					display: flex;
					align-items: center;
					gap: clamp(0.1563rem, 0.2604vw, 0.3125rem); /* 最小值 2.50px、大小約 0.2604vw、最大值 5.00px */
					padding: 2px 0;
				}
				ul.header_top_right li i{	
					font-size: inherit;				
					font-size: 1rem;				
					line-height: 1;
				}



				/* 版頭上方下拉------------------- */
				.header_icon_down{
					left: 50%;
					transform: translateX(-50%);
					transform-origin: top center;
					font-size: inherit;  /*字體 最小值 10px、大小約 0.9375vw、最大值 12px*/
					line-height: 1.1;
					/* z-index: -999999;
					opacity: 0; */
					transition: 0.1s ease all;
					/*預設關閉*/
					letter-spacing: normal;
					padding: 0;
					margin: 0;
					list-style-type: none;
					display: block;
					background-color: var(--primary_color);
					width: 100px;
					text-align: center;
					/* top: 15px; */
					top: 19px;
					display: none;
					position: absolute;
					z-index: 99;
					box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
				}
				.header_icon_downBg{
					background-color: var(--second_color);
					margin: 0;
					padding: 0;
					list-style-type : none;
					display: block;
				}

					.header_top_link.service:hover .header_icon_down ,
					.header_top_link.shopping:hover .header_icon_down{
						display: block;
					}
						.header_down_list{
							padding: 0;
							margin: 0;
							list-style-type: none;
							display: block;
							/*font-size: clamp(0.7292rem, 0.7292vw, 0.8750rem);*/ /* 字體 最小值 11.67px、大小約 0.7292vw、最大值 14.00px */
							color: #fff;
						}
						.header_down_list:not(:last-of-type){	
							border-bottom: 1px #fff solid;
						}
							.header_down_list > a{
								display: flex;
								padding: 7px 0;
								/* border-bottom: 1px var(--fourth_color) solid; */
								justify-content: center;
								color: #fff;
								text-decoration: none;
								font-size: inherit;
								text-indent: 0.25rem; /*4px*/
								letter-spacing: 0.25rem; /*4px*/
								font-size: inherit;
							}
							.header_down_list a:hover{
								opacity: 0.7;
							}
							.header_down_list:last-of-type a{
								border-bottom: none;
							}
							.header_down_list a span.line ,
							.header_down_list span.line{ /* modify by Judy 20260318 */
								background-color:#ffffff;
								width: 1px;
								height: 15px;
								margin: 0 10px;
								padding: 0;
								display: inline-block;
							}










				





/*================================*/
/*----- 版頭右 -----*/
/*================================*/

.header_rightArea{
    /* float: right; */
    box-sizing: border-box;
    /* padding-top: 42px; */
    /* border-bottom: 1px var(--third_color) solid; */
    /* box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; */
}



/*================================*/
/*----- 語系 language -----*/
/*================================*/



.lang_area{
	position:absolute;
	right:0px;
	top: 1.4375rem; /*23px*/
	top: 1.7188rem;
	transform: translateY(0%);
	color: #333;
	font-size: 0.9375rem; /*15px*/
}
	.lang  a{
		color: inherit;
		text-align:center;
		text-decoration:none;
		position:relative;
		padding: 0;
		display: flex;
		align-items: center;
		gap: 10px;
		font-size: inherit;
	}
	.lang a:after{
	}
	.lang span{
	}
	.lang img{
		width: 1.0625rem;
		height: auto;
	}
	.lang a:hover{
		opacity: 0.5;
	}
	.nL_in_area{
		display:none;
		border: 1px var(--third_color) solid;
		box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
		margin-top: .4375rem;
	}
		.nL_in{
			
		}
			.nL_in a{
				display:block;
				color: inherit;
				font-size: inherit;
				padding:8px;
				background-color: #fff;
				/*background:rgba(0,0,0,0.1);*/ /*修改by pekey 20171204*/
				/*background: rgba(212, 212, 212, 0.9);*/ /*modify by pekey 20180212*/
				text-decoration:none;
				text-align: center;
			}
			.nL_in:hover a{
				background-color: var(--third_color);
			}





















/*================================*/
/*----- pc版頭搜尋區塊 -----*/
/*================================*/


/*================================*/
/*----- 版頭搜尋區塊 -----*/
/*================================*/

/*站內搜尋-----------------------------------------*/                        
.search_area{
    font-size: clamp(.75rem, 0.7292vw, .875rem);
}

/*站內搜尋pc---------------------------*/ 
.search_area_pc{

}
/*站內搜尋mobile---------------------------*/ 
.search_area_mobile{
    display:none;
	font-size: 1rem;
}  


	/*站內搜尋-----------------------------------------*/
	.search_content_site {
		position: relative;
		display: inline-block;
		box-sizing: border-box;
		padding-left:  0;
		vertical-align: middle;
		width:  100%;
		/* color: var(--font_color); */
	}


		.search_content {
			position:relative;
			box-sizing:border-box;
			padding-right:  clamp(.9375rem, 1.5625vw, 1.875rem);
			background: #e8e8e8;
			width: auto;
			/* border-radius: 3.125rem; */
		}
			.search_content input[type='text'] {
				border: none;
				background: none;
				height: 2.625rem; /*42px*/
				/*height: 1.5rem;*/ /*24px*/
				font-size:inherit;
				padding: .0625rem  clamp(.4375rem, .7292vw, .875rem) 0;
				color: inherit;
				line-height: normal;
			}
			.search_content label {
				position:absolute;
				top: 50%;
				right: 5px;
				transform: translateY(-50%);
				color: inherit;
				padding: 0;
			}
				.search_content i {
					font-size: inherit;
					color: var(--dark_color);
				}
				.search_content input[type='submit'] {
					display:none;
				}	


				.search_content ::placeholder { /* CSS 3 標準 */
					color: var(--font_color);
				}
				.search_content ::-webkit-input-placeholder { /* Chrome, Safari */
					color: var(--font_color);
				}				
				.search_content :-ms-input-placeholder { /* IE 10+ */
					color: var(--font_color);
				}
				.search_content ::-moz-placeholder { /* Firefox 19+ */
					color: var(--font_color);
					opacity: 1;
				}
				  


				.search_area_pc .search_content_site {
					width:  clamp(7.1875rem, 11.7188vw, 14.0625rem); /*225px ~ 115px*/
				}
					.search_area_pc .search_content {
						border-radius: 3.125rem;
					}
						.search_area_pc .search_content input[type='text'] {
							height: 1.5rem; /*24px*/
						}
						.search_area_pc .search_content i {
							font-size: clamp(.75rem, 0.7292vw, .875rem);
							color: var(--font_color);
						}


/*================================*/
/*----- 主按鍵 -----*/
/*================================*/

	.navbar{
		/* margin-right: -30px; */
		max-width: 1015px;
		max-width:clamp(40.625rem, 52.8646vw, 63.4375rem); /* 最小值650px、大小約 52.8646vw、最大值 1015px */
		/*max-width: clamp(53.2275rem, 85.9375vw, 103.125rem);*/ /* 最小值 851.64px、大小約 85.9375vw、最大值 1650px */
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
		font-size: clamp(1rem, 0.9375vw, 1.1250rem); /* 字體 最小值 16.00px、大小約 0.9375vw、最大值 18.00px */
		font-size: 0.9375rem; /*15px*/
	}
	
	/*浮動*/
	/* .header.fixed .navbar{
		padding: 0px 0px;
	} */
	
		
		.nav{
			/* float: left; */
			box-sizing: border-box;
			position: relative;
		}

		.nav .navTitle{
			/* border-bottom: 1px solid #5b5b5b; */
		}


			.nav > a ,
			.navTitle > a{
				display: block;
				text-decoration: none;
				color: inherit;
				font-size: inherit;
				transition: 0.3s ease all;
				position: relative;
				/* padding: 25px 40px; */


				/*padding:1.5625rem  clamp(1.2904rem, 2.0833vw, 2.5rem); *//*25px */  /* 最小值 20.65px、大小約 2.0833vw、最大值 40.00px */
				
				padding:0  clamp(1.2904rem, 2.0833vw, 2.5rem); /*25px */  /* 最小值 20.65px、大小約 2.0833vw、最大值 40.00px */
				padding-top:1.7188rem ;
				padding-bottom: 1.7188rem ;
			}
			
			/*hover*/
			.nav:hover > a ,
			.navTitle:hover > a{
				/* opacity: 0.5; */
				transition: 0.3s ease all;
				position: relative;
			}

			.nav:hover .navTitle  > a{
				background-color: var(--third_color);
			}
			
			
			.nav > a:before {
				content: "";
				position:
				absolute;
				background-color: #c3c3c3;
				width: 1px;
				height: 15px;
				left: 0;
				top: 50%;
				-webkit-transform: translateY(-50%);
				transform: translateY(-50%);
			}						

			.nav:first-of-type > a:before {
				display:none;
			}

			.navTitle > a:after{
				position: absolute;
				content: "";
				background-color: var(--primary_color);
				height: 3px;
				bottom: 0;
				left: 0;
				width: 0%;
				transition: width 0.9s; /* 只對 width 屬性應用過渡 */
			}
			.nav:hover .navTitle > a:after{
				width: 100%;
			}


				/*主按鍵展開*/
				.navOpen {
					position:absolute;
					left:50%;
					padding:9px 0px 0px;
					width: 180px;
					transform: translateX(-50%);
					/* display:none; */
					z-index: 2;
				}
				/* .navOpen.mobile{
					display:none;
				} */
				/* .nav:hover .navOpen.pc {
					display:block;
				} */
				.navOpenBg {
					position:relative;
					
					
				}
				


				.nav.fr .navOpen.pc{
					display:none;
				}
				.nav.fr:hover .navOpen.pc{
					display:block;
				}





				.navOpen.mobile {
					display:none;
					opacity:0;
					z-index:-999999;
					transform: unset;
					padding: 0;
				}
				.navOpen.pc .navOpenBg:before {
					/* position: absolute;
					content:'';
					border-bottom: solid 8px rgba(255 255 255 / 100%);
					border-left: solid 12px rgba(255,255,255,0);
					border-right: solid 12px rgba(255,255,255,0);
					top:-8px;
					left:50%;
					transform: translateX(-50%); */
				}

					.navOpenList {
						flex: 1;
					}
						.navOpenList a {
							text-align:center;
							/*font-size: clamp(0.8889rem, 0.8333vw, 1.0000rem);*/ /* 字體 最小值 14.22px、大小約 0.8333vw、最大值 16.00px */
							font-size: inherit;
							color: inherit;
							line-height:1.5;
							padding:7px 5px;
							background: rgba(255,255,255,0.97);
							display: block;
							transition:0.3s ease all;
							text-decoration: none;
						}
							.navOpenList a:hover {
								/* opacity: 0.7; */
								transition: all 0.3s ease;
								background-color: var(--third_color);
							}






















	/*滿版pc 主按鍵下拉樣式-----------------------------------------*/
	.nav.sstc{
        position: unset;
	}

	.nav.sstc:hover .navOpen.pc.sstc{
       /* display: block; */
	}
		.nav.sstc .navOpen.pc.sstc{
			position: fixed;
			/* pointer-events: none; */
			left: 0%;
			width: 100%;
			transform: translateX(0%);
			padding: 0;
			top: -100%;

			/* opacity: 0; */
			display: none;
			z-index: -999999;
			filter: blur(0.7px);
			/* transform: scaleY(0); */
			transform-origin: top center;
			transition: top 0.7s ease-in-out, display 0.7s ease-in-out, z-index 1.0s ease-in-out, filter 1.3s ease-in-out; /* 分開設定過渡時間 */ 
		}
		.nav.sstc .navOpen.pc.sstc .navOpenBg:before {
			display: none;
		}			
		/*電腦版滿版主按鍵被移入時的樣式*/
		.nav.sstc .navOpen.pc.sstc.active{
			/* top: 100%; */
			top: 65px;
			/* opacity: 1; */
			display: block;			
			filter: blur(0px);
			z-index: 2;
			/* transform: scaleY(1); */
			transition:top 0.7s ease-in-out, display 0.7s ease-in-out, z-index 1.0s ease-in-out, filter 1.3s ease-in-out; /* 分開設定過渡時間 */ 
		}
	





		
	.nav_stc_Bg{
		position: relative;
		min-height: fit-content;
		background-color: rgba(255,255,255,0.97);
		color: var(--dark_color);
		box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
		flex: 1;
		padding-bottom: clamp(1.613rem, 1.311rem + 1.51vw, 3.125rem);
	}
	
		/* nav_背景 */
		.nav_background{
			height: 100%;
			min-height: inherit;
			width: 100%;
			/*max-width:clamp(32.7430rem, 52.8646vw, 63.4375rem); *//* 最小值 523.89px、大小約 52.8646vw、最大值 1015px */
			margin: 0 auto;
			position: relative;
			
		}

			.nav_wrap{
				width: 100%;
				height: 100%;
				color: inherit;
				line-height: 1.2;
				font-size: clamp(0.875rem, 0.825rem + 0.25vw, 1.125rem);
				border-right: 1px #fff solid;
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
				gap: 0.625rem;

				/* column-gap: clamp(1.613rem, 1.311rem + 1.51vw, 3.125rem); */
				column-gap: 2.6042vw; /*50*/
			}
	
			
	
				.nav_stc_item{
					/* position: relative; */
					/* flex: 1; */
					/*width: calc((100% / 3) - (2 * (1.311rem + 1.51vw) / 3));*/ /* 3欄平均寬度，扣除間距 */
					font-size: 0.9375rem;
				}
	
					.nav_stc_list{
					}
						.nav_stc_list a{
							color: inherit;
							text-decoration: none;
							display: block;
							padding: 10px 0;
							font-size: inherit;
							font-weight: 400;
						}
						.nav_stc_list > a:hover{
							opacity: 0.7;
							transition: all 0.3s ease;
						}
	
						.nav_stc_item span.nav_arrow{
							display: flex;
							width: 42px;
							height: 100%;
							position: absolute;
							right: 0;
							top: 50%;
							transform: translateY(-50%);
							align-items: center;
							justify-content: center;
						}
							.nav_stc_item span.nav_arrow i {
								color: inherit;
								display: block;
							}
	
						/* 第一層 */
						.nav_fir_list{
							position: relative;
						}
							.nav_fir_list a{
							}
	
	
	
						/* 第二層 */
						.nav_open_area_sec{
							position: relative;
							top: 0;
							left: 0;
							/* height: 100%; */
						}
						.nav_open_area_sec.active{
							display: block;
							/* box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; */
							/* border-left: 1px var(--third_color) solid; */
						}
	
							.nav_open_area_sec_in{
								/* display: flex; */
								/* flex-wrap: wrap; */
								/* gap: 5px; */
								/* height: 100%; */
								overflow-y: auto;
								/* padding-left: 1rem; */
								padding-left: clamp(0.875rem, 0.825rem + 0.25vw, 1.125rem);
							}


							/* 模型 */
							.nav_stc_item.model .nav_open_area_sec_in{
								column-count: 2;
								column-gap: 1.3021vw; /*25*/
							}
							
								
								.nav_sec{
								}
									.nav_sec_list{
										position: relative;				
									}
										.nav_sec_list a{
												color: #333;
										}
	
							/* 第三層 */
							.nav_open_area_third{
								position: absolute;
								top: 0;
								left: calc(250px * 1);
								width: calc(250px * 2);
								height: 100%;
								/* background-color: inherit; */
								/* background-color: rgba(0,0,0,0.6); */
								/* background-color: rgba(183 195 183 / 90%); */
								overflow-y: auto;
								display: none;
							}
							.nav_open_area_third.active{
								display: block;
							}
								.nav_third_list{							
								}
									.nav_third_list a{							
									}
	
	
	
	
	
		.nav_wrap::-webkit-scrollbar ,
		.nav_open_area_sec_in::-webkit-scrollbar ,
		.nav_open_area_third::-webkit-scrollbar {/*滾動條整體樣式*/
			width:5px;     /*高寬分別對應橫豎滾動條的尺寸*/
			height: 1px;
		}
		.nav_wrap::-webkit-scrollbar-thumb ,
		.nav_open_area_sec_in::-webkit-scrollbar-thumb ,
		.nav_open_area_third::-webkit-scrollbar-thumb {/*滾動條裡面小方塊*/
			border-radius: 5px;
			-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
			
			/* background: var(--primary_color); */
			background: var(--secondary_color);
		}
		.nav_wrap::-webkit-scrollbar-track,
		.nav_open_area_sec_in::-webkit-scrollbar-track ,
		.nav_open_area_third::-webkit-scrollbar-track  {/*滾動條裡面軌道*/
			/* -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); */
			border-radius: 5px;
			background: #fff0;
		}	









		/*第3層手機 主按鍵 下拉樣式--------------*/
		.navOpen.mobile.sstc {
			background: transparent;
		}
		.mobile.sstc .mobile_sstc_wrap {
			display: block;
			width: auto;
			padding: 0;
			overflow-x: unset;
			overflow-y: unset;
		}

			.mobile.sstc .sstc_item {
				width: auto;
				padding: 0px 0px 0px;
			}
				.mobile.sstc .sstc_title {
					margin: 0px 0px 0px;
					padding: 0px;
					border-left: none;
					color: #fff;


					background-color: rgba(0, 0, 0, 0.7);
					border-bottom: 1px solid #5b5b5b;
					font-size: clamp(0.8889rem, 0.8333vw, 1rem); /* 字體 最小值 14.22px、大小約 0.8333vw、最大值 16px */
				}
					.mobile.sstc .sstc_title a{
						/* padding: 10px 0px 10px 25px; */
						font-weight: 400;
						color: inherit;
						display: block;
						text-decoration: none;


						color: #cecece;
						padding: 12px 15px 12px 30px;
						/* background-color: rgba(0, 0, 0, 0.7); */
						transition: 0.3s ease all;
						text-decoration: none;
						display: block;
						/* border-bottom: 1px solid #5b5b5b; */
					}

				.mobile.sstc .sstc_m_bg{
					display: none;
					font-size: clamp(0.7777rem, 0.7292vw, 0.8750rem); /* 字體 最小值 12.44px、大小約 0.7292vw、最大值 14px */
				}
					.mobile.sstc .navOpenList > a {
						padding-left: 45px;
						font-size: inherit;
					}
















@media screen and (min-width: 991px){		
}






							
									
	

/* 在螢幕寬度大於991時 */ 
@media screen and (min-width: 990.1px) {

	/*浮動*/
	.header.fixed  .header_rightArea{
		/*border-bottom: none;
		margin: 0 auto;
		display: grid;*/
		/*grid-template-columns: clamp(6.4518rem, 10.4167vw, 12.5rem) auto;*/  /* 最小值 103.23px、大小約 10.4167vw、最大值 200px */
		
		
		/*grid-template-columns: clamp(8.0648rem, 13.0208vw, 15.6250rem) auto;*/  /*  最小值 129.04px、大小約 13.0208vw、最大值 250.00px */
		/*max-width: clamp(53.2275rem, 85.9375vw, 103.125rem);*//* 最小值 851.64px、大小約 85.9375vw、最大值 1650px */
		
		/*gap: clamp(1.2904rem, 2.0833vw, 2.5rem);*/ /* 最小值 20.65px、大小約 2.0833vw、最大值 40px */
		
		/*gap: clamp(2.4023rem, 3.9063vw, 4.6875rem);*/ /* 最小值 38.44px、大小約 3.9063vw、最大值 75px */
		
		/*align-items: center;*/
		/* justify-content: space-between; */
	}

	/*浮動*/
	.header.fixed  .navbar{
		/*max-width: clamp(53.2275rem, 85.9375vw, 103.125rem);*/ /* 最小值 851.64px、大小約 85.9375vw、最大值 1650px */
		/*gap: clamp(0.6452rem, 1.0417vw, 1.2500rem);*/ /*  最小值 10.32px、大小約 1.0417vw、最大值 20.00px */
		/*margin: 0;
		max-width: unset;
		justify-content: unset;*/
	}

	/*浮動*/
	.header.fixed  .nav_background{
		/*max-width: clamp(32.2925rem, 52.0833vw, 62.5rem); *//* 最小值 620px、大小約 52.0833vw、最大值 1000px */
	}
	
	/*浮動*/
	.header.fixed .header_top{
		/*background-color: var(--third_color);
		padding: 0.3125rem 0;*/ /*5px*/
		transition: 0.3s ease all;
	}
		.header.fixed .header_top .wrap {
			/*justify-content: space-between;
			transition: 0.3sease all;*/
		}
			/*.header.fixed .logo{
				display: none;
			}
			.header.fixed ul.header_top_left ,
			.header.fixed ul.header_top_right{
				position: unset;
				top: unset;
				left: unset;
				right: unset;
				transition: 0.3sease all;
			}*/

			/*手機才打開*/
			/*.nav_mobile{
				display: none;
			}/


	.logo_fix{
		display: none;
	}
	/*浮動*/
	.header.fixed .logo_fix{
		/*display: block;*/
	}


	
	.header_rightArea{
		padding-right:  clamp(6.2500rem, 7.8125vw, 9.3750rem); /* 最小值 100.00px、大小約 7.8125vw、最大值 150.00px */
	}










	/*主按鍵展開*/
	.nav:not(.sstc) .navOpen {
		display:none;
		padding: 0;
	}
		.nav:not(.sstc):hover .navOpen.pc {
			display:block;
		} 

}



@media (max-width: 990px){

/*----- 版頭上方區塊 -----*/
.header_top{
}
	.header_top .wrap{
	}
		ul.header_top_link_area{
			display: none;
		}



/*----- 版頭右 -----*/
.header_rightArea{
	position: fixed;
	width: 200px;
	top: 0px;
	right: -200px;
	height: 100%;
	box-sizing: border-box;
	background: rgba(0, 0, 0, 0.7);
	background: #fff;
	transition: 0.3s ease all;
	padding: 59px 0px 0;
	padding-top: 77px;
	overflow-y: auto;
	z-index: 4;
	float: none;
	border-bottom:none;
}
.header_rightArea.active {
	right: 0px;
	box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
	/* box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25); */
}



	/*----- 語系 language -----*/
	.lang_area{
		right: 60px;
		top: 1.4375rem; /*23px*/
	}





	/*-----PC搜尋區塊-----*/
	.search_area_pc{
		display: none;
	}
	/*-----mobile搜尋區塊-----*/
	.search_area_mobile{
		display: block;
	}
		.search_area_mobile .search_content input[type='text'] {
			padding: 0 15px;
		}
		.search_area_mobile .search_content i{
			font-size: 1.25rem; /*20px*/
		}


















	/*----- 主按鍵 -----*/
	.navbar {
		margin-right: 0px;
		flex-direction: column;
		justify-content: unset;
		color: var(--primary_color);
	}
		.nav {
			float:none;
			width: 100%;
			padding: 0px;
			position: relative;
		}
			.nav .navTitle{
				border-bottom: 1px solid #5b5b5b;
			}

			.nav > a ,
			.nav .navTitle > a {
				border:none;
				border-radius:0px;
				text-align:left;
				padding: 13px 15px;
				color: inherit;
				/* border-bottom: 1px solid #5b5b5b; */
				/* font-size: 14px; */
			}
			.nav > a:before ,
			.nav .navTitle > a:before {
				display: none;
			}
			

			.header.fixed .nav > a ,
			.header.fixed .nav .navTitle > a{
				transition: 0.3s ease all;
				/* padding: 13px 15px; */
				/* color: #cecece; */
			}
			.nav > a:hover ,
			.nav .navTitle > a:hover  {
				/* color: var(--second_color); */
			}
			.nav:hover .navTitle > a:after{
				width: 0%;
			}
			.nav:hover .navTitle > a {
				background-color: transparent;
			}
					
				/*展開選單*/
				.navOpen {
					position:relative;
					top:0px;
					left:0px;
					margin:0px;
					width:auto;
					border-radius:0px;
					background:#444;
				}


				.nav:not(.sstc) .navOpen.pc {
					display: none !important;
				}
				.nav:not(.sstc):hover .navOpen.pc {
					display: none !important;
				}

				.nav.sstc .navOpen.pc.sstc ,
				.nav.sstc .navOpen.pc.sstc.active{
					display: none;
				}
				/*hover*/
				.nav:hover .navOpen.pc ,
				.fixed_nav:hover .navOpen.pc ,
				.nav.sstc:hover .navOpen.pc.sstc ,
				.nav.fr:hover .navOpen.pc{
					display:none;
				}	
				
					
				.navOpen.mobile {
					display: none;
					opacity: 1;
					z-index: 1;
					position: relative;
				}
					.navOpenBg {
						box-shadow: none;
					}
						.navOpen.mobile  .navOpenList {
						}
						.navOpen.mobile  .navOpenList > a {
							text-align:left;
							/* font-size:14px; */
							/* color: #cecece;
							line-height:22px; */
							padding: 12px 15px 12px 30px;
							/* background-color: rgba(0, 0, 0, 0.7); */
							transition: 0.3s ease all;
							text-decoration: none;
							display: block;
							border-bottom: 1px solid var(--primary_color);
						}
						.navOpenList > a:hover {
							opacity: 0.7;
						}










		/* .nav.sstc > a ,
		.nav.vertical_nav > a 
		.nav.arrow_down > a  , */
		.nav .navTitle.arrow_down{
			padding-right: 40px;
			position: relative;
		}
			.nav .navTitle > a{
				/* margin-right: 45px; */
			}

		.mobile.sstc .sstc_title.arrow_down{
			position: relative;
			background-color: #fff;
			border-bottom: 1px solid var(--primary_color);
		}
			.mobile.sstc .sstc_title.arrow_down > a{
				margin-right: 45px;
				color: var(--primary_color);
			}
			.mobile.sstc .sstc_m_bg .navOpenList > a{
				padding-left: 45px;
			}



		/* .nav.sstc > a::after ,
		.nav.vertical_nav > a::after 		
		.nav.arrow_down > a::after ,*/
		.nav .navTitle.arrow_down::after ,
		.mobile.sstc .sstc_title.arrow_down::after  {
			position: absolute;
			content: "";
			background-image: url(../images/bottom_arrow_icon_black.svg);
			background-repeat: no-repeat;
			background-position: center center;
			background-size: 18px;
			transition: 0.3s ease all;
			width: 18px;
			height: calc(18px / 2);
			z-index: 0;
			right: 0;
			top: 50%;
			transform: translateY(-50%);
			transform-origin: center center;
			width: 33px;
			height: 33px;
			display: flex;
			justify-content: center;
			align-items: center;
			cursor: pointer;
		}
		

		/* .nav.sstc.active > a::after ,
		.nav.vertical_nav.active > a::after
		.nav.arrow_down.active > a::after , */
		.nav.active .navTitle.arrow_down::after ,
		.mobile.sstc .sstc_title.arrow_down.active::after  {
			transform: translateY(-50%) rotate(180deg);
		}










}



@media (max-width: 375px){

	.header_top .wrap {
		justify-content: unset;
	}

}


@media (max-width: 360px){

	/*----- 版頭右 -----*/
	.header_rightArea{
		padding-top: 70px;
	}

	
	/*----- 語系 language -----*/
	.lang_area{
		top: 31px;
	}


}