

#top {
    position: absolute;
    top: -100%;
}

.headertop{
	border-top: 0px solid #fff0;
}


.headerArea{
	/*position:relative;*/
	position: fixed;
	top: 0px;
	left:0px;
	width:100%;
	z-index: 5;
}

/*浮動*/
.headerArea.fixed{
	/* box-shadow: 0px 0px 20px -1px rgba(0,0,0,0.3); */
	transition: 0.3s ease all;
	/*padding: 0px;
	background-color: #fff;*/
	position: fixed;
	top: 0px;
	left:0px;
	width:100%;
	z-index: 5;
}




/*-------版頭----------------------------------------------------------------------------*/
.header {
	/* border-bottom: 2px var(--primary_color) solid;
	background-color: #3D61AF; */
	background-color: var(--third_color);
}

	
		/*手機menu按鍵*/
		.menu_btn {
			position:absolute;
			width:20px;
			top: 50%;
			right: 0px;
			/*right: 15px;*/
			cursor:pointer;
			display:none;
			z-index: 1000;
			margin: -13px 0px 0px;
		}
			.menu_btn span {
				display:block;
				background: #000;
				/*height:2px;*/
				height:4px;
				margin: 4px 0px;
				transition:0.3s ease all;
				border-radius:3px;
			}
				/*點擊*/
				.menu_btn.active {
					width: 30px;
					top: 0%;
					position: fixed;
					-webkit-transform: translateX(20%) translateY(33%);
					transform: translateX(20%) translateY(33%);
				}
					.menu_btn.active span {
						background:var(--primary_color);
					}
					.menu_btn.active span:nth-of-type(1) {
						/*transform: rotate(39deg);*/
						transform: rotate(45deg);
						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: rotate(-45deg);
						transform-origin: bottom left;
					}
}
	.header .wrap {
		position:relative;
	}
		/*logo*/
		.logo {
			width: 250px;
			box-sizing: border-box;
			padding: 31px 0px;
			display: none;
			/* opacity:0.7; */
		}
		
		.logo.logotop {
			padding: 5px 0;
			display: block;
		}

		
		.logo a {
			display:block;
			transition: 0.3s ease all;
		}		
		
		.logo a:hover {
			opacity:0.5;
			transition: 0.3s ease all;
			/*transform:scale(0.8);*/
		}			
			.logo img {
				width:100%;
				height:auto;
			}
				/*.logo_s {
				}
				.logo_b {
					display:none;
				}*/
				
			/*logo的閃光*/
			/*.logo_flash {
				position:absolute;
				width:20px;
				height:86px;
				background: rgba(255,255,255,0.8);
				top:3px;
				left:-25px;
				transform:rotate(20deg);
				transform-origin:center;
				box-shadow: 0px 0px 10px #FFF;
				pointer-events: none;
			}
				.logo_flash_hover {
					left:482px;
					transition:0.4s ease all;
				}*/
		

		/*手機menu按鍵*/
		.menu_btn {
			position: absolute;
			width: 20px;
			top: 50%;
			right: 8%;
			-webkit-transform: translateX(0%) translateY(-50%);
			transform: translateX(0%) translateY(-5%);
			/* right: 15px; */
			cursor: pointer;
			display: none;
			z-index: 1000;
			/* margin: -13px 0px 0px;*/
		}
			.menu_btn span {
				display:block;
				background: #000;
				/*height:2px;*/
				height:4px;
				margin: 4px 0px;
				transition:0.3s ease all;
				border-radius:3px;
			}
				/*點擊*/
				.menu_btn.active {
					width: 30px;
					top: 18px;

					top: 37px;
					/* right:3%; */
					position: fixed;
					/*top: 0%;
					-webkit-transform: translateX(20%) translateY(33%);
					transform: translateX(20%) translateY(33%);*/
				}
					.menu_btn.active span {
						background: #ffffff;
						margin: 6px 0px;
					}
					.menu_btn.active span:nth-of-type(1) {
						/*transform: rotate(39deg);*/
						transform: rotate(45deg);
						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: rotate(-45deg);
						transform-origin: bottom left;
					}
					
					
					
					
					
					
					
					
					
					
					
					
				
		/*版頭右*/
		.headerRight {
			float:right;
			box-sizing: border-box;
		}
			/*版頭右上*/
			/*.headerRightTop {
				position: relative;
				text-align: right;
			}*/
				/*版頭社群*/
				/*.headerRightTop_socialLinkArea {
					float:right;
					padding:0px 7px;
				}
					.hRT_socialLink {
						float:left;
						padding:0px 7px;
					}
						.hRT_socialLink a {
							display:block;
						}
							.hRT_socialLink img {
							}
								.hRT_socialLinkImg1 {
								}
								.hRT_socialLinkImg2 {
									display: none;
								}
									hover
									.hRT_socialLink a:hover .hRT_socialLinkImg1 {
										display:none;
									}
									.hRT_socialLink a:hover .hRT_socialLinkImg2 {
										display: block;
									}*/
									
									
				/*電腦版頭語系*/
				/*.lang_pc{
					border: solid 1px #c5c3c3;
					border-top: 0px;
					z-index:999;
					
					display: inline-block;
					float: right;
					
					color: #fff;
					background: #e9e9e9;
					border-bottom-left-radius: 5px;
					border-bottom-right-radius: 5px;
					
					position: relative;
    				right: -12px;
				}
				
					.lang_pc > a{
						display: block;
						padding: 7px 26px 7px 12px;
						background-color: transparent;
						color: #000000;
						font-size: 12px;
						text-align: center;
						text-decoration: none;
						position: relative;
						
						box-sizing: border-box;
					}
					.lang_pc > a:after{
						position: absolute;
						content: '';
						border-top: solid 6px #c3c1c1;
						border-left: solid 3px rgba(255,255,255,0);
						border-right: solid 3px rgba(255,255,255,0);
						top: 10px;
						right: 10px;
					}
					
					.nL_in{
						display:none;
						
						position: fixed;
   						width: 90px;
						z-index: 1000;
					}
						.nLI_list{
							text-align:center;
						}
							.nLI_list a{
								display:block;
								color:#fff;
								font-size:12px;
								padding:8px;
								background-color: rgba(0,0,0,0.65);
								text-decoration:none;
		
							}
							.nLI_list:hover a{
								background-color: var(--primary_color);
							}*/					
					
					
					/*手機板語系一開始隱藏*/
					/*.lang {
						display:none;
						float:right;
					}
					.langLink {
						position:relative;
						float:left;
						padding:0px 10px;
					}
					.langLink:nth-of-type(2) {
						padding-left:15px;
						padding-right:15px;
					}
						.langLink:after {
							content:'/';
							position:absolute;
							top:4px;
							right:0px;
						}
							.langLink:nth-of-type(2):after {
								display:none;
							}
							
						.langLink a {
							display:block;
							text-decoration:none;
							font-size:14px;
							line-height:22px;
							color:#8c8c8c;
						}
							.langLink a:hover, .langLink.active a {
								color:#0048dc;
							}*/
					
					
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
/*版頭上方區塊---------------------------------------------------------------*/			
			
			
.headerTop {
	background-color: #fff;
	padding: 5px 0px;
	/* position:relative; */
	text-align: right;
}
	
.headerTop .wrap{
	display: flex; 
	align-items: center;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
}





/*版頭上方按鍵區*/
	/* .headerTop_btn{
		display:none;
		text-align:center;
		opacity: 0.6;
	}
		.headerTop_btn a{
			display: block;
			padding: 5px 5px;
			transition: 0.3s ease all;
		}
		.headerTop_btn a:hover{
			transition: 0.3s ease all;
			transform:scale(0.8);
		}		
		
		.headerTop_btn img{
			width: 20px;
			height: auto;
			opacity: 0.8;
		} */
       



.headerTopIn{
	box-sizing: border-box;	
	display: flex;
	align-items: center;
}
	
			
	/*版頭上方按鍵區*/
	.headerTopRightNav{
		text-align: right;
		display: inline-block;
		/* padding: 11px 0; */
		box-sizing: border-box;
		vertical-align: middle;
	}
							
		 /*版頭上方按鍵*/
		.headerTopRightNavList{
			display: inline-block;
			box-sizing: border-box;
			padding-left: 25px;
		} 
		.headerTopRightNavList:first-child{
			padding-left: 0px;
		}
		
		
		
			.headerTopRightNavList a{
				display:block;
				font-size: 13px;
				color: var(--primary_color);
				transition: 0.3s ease all;
				text-decoration:none;
				text-align: center;
				opacity: 1;
			}
			.headerTopRightNavList i{
				font-size: 18px;
				color: #fff;
				vertical-align: -15%;
			}
			.headerTopRightNavList span.tw{
				display: block;				
			}
			.headerTopRightNavList span.en{
				font-family: var(--foreign_font);
				font-size: 12px;
				transform: scale(0.9);
				transform-origin: center;
				margin: 4px 0 0;
				color: var(--primary_color);
				font-weight: normal;
				display: block;
			}
			/* .headerTopRightNavList a:hover ,
			.headerTopRightNavList a:hover span.en{
				color:#fff;
				opacity: .7;
				transition: 0.3s ease all;
			} */











/*================================================*/
/*----- Pc版_搜尋 -----*/
/*================================================*/			



	/*站內搜尋Pc-----------------------------------------*/
	.SearchBgPc {
		/* display:none; */
		position: relative;
		display: inline-block;
		box-sizing: border-box;
		padding-left: 25px;
		/* padding: 5px 0; */
		vertical-align: middle;
		width: 225px;
	}
	
		.SearchBgPc_left{
			position:absolute;
			top:0px;
			left:0px;
			width:30px;
			
			display:none;
		}
			.SearchBgPc_left select{
				font-size: 12px;
				color: #333;
				padding: 11px 18px 11px 7px;
				border-radius: 0px;
				border: none;
				border-right: 1px #dadada solid;
			}				
	
	
		.SearchAreaPc {
			position:relative;
			box-sizing:border-box;
			padding-right: 30px;
			background: #fff;
			width: auto;
			border-radius: 50px;
			border: 1px solid var(--primary_color);
		}
			.SearchAreaPc input[type='text'] {
				border: none;
				background: none;
				height: 30px;
				line-height: 20px;
				font-size: 13px;
				padding: 1px 14px 0;
				color: var(--primary_color);
			}
			.SearchAreaPc label {
				position:absolute;
				top:0px;
				right:0px;
				/*height:23px;*/
				box-sizing:border-box;
				/*padding: 2px 6px;*/
				height: 30px;
				padding: 7px 9px;
			}
				.SearchAreaPc i {
					font-size:18px;
					color: var(--primary_color);
				}
				.SearchAreaPc input[type='submit'] {
					display:none;
				}	


				.SearchAreaPc ::placeholder { /* CSS 3 標準 */
					color: var(--primary_color);
				}
				.SearchAreaPc ::-webkit-input-placeholder { /* Chrome, Safari */
					color: var(--primary_color);
				}				
				.SearchAreaPc :-ms-input-placeholder { /* IE 10+ */
					color: var(--primary_color);
				}
				.SearchAreaPc ::-moz-placeholder { /* Firefox 19+ */
					color: #eaeaea;
					opacity: 1;
				}
				  











	
	
			
			


/*================================================*/
/*----- Mobile版_搜尋 -----*/
/*================================================*/			

/*Mobile搜尋區塊------------------------------------------------*/
.searchAreaMobile{ 
    position: absolute;
    right: calc(8% + 50px);
	right: calc(8% + 20px + 20px); /*第一個20是menu_btn寬度*/
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(0%);
    transform: translateY(-50%) translateX(0%);
	display: none;
}
	/*搜尋icon*/
	.search_iconMobile{
		transition: 0.3s ease all;
	}
		.search_iconMobile label{
			position: relative;
			display: block;
		}
			/*.search_iconMobile i{
				font-size: 35px;
				line-height: 35px;
				color: #3e3a39;
				display: block;
			}*/
			
			.search_iconMobile label div{
				position:relative;
				display:block;
			}
			.search_iconMobile label div img{
				width: 20px;
				height: 20px;
				display: block;
			}
			.search_iconMobile label div:before{
				position: absolute;
				content: '';
				background-color: #3e3a39;
				width: 0%;
				height: 1px;
				bottom: -12px;
				left: 0px;
				opacity: 0;
				transition: 0.2s ease all;
			}
			
			
		/*hover*/
		.search_iconMobile:hover label{
			/*opacity:0.5;*/
			transition: 0.3s ease all;
		}	
		.search_iconMobile:hover label div:before{
			background-color:#5f4f98;
			width: 120%;
			opacity:1;
			transition: 0.2s ease all;
		}		
		
		
		


.search_inAreaMobile{ 
	-webkit-transition: top .2s;
	transition: top .2s;
	position: absolute;
	overflow: hidden;
	width: 300px;
	display: none;
	top: 45px; 
	right: -20px;
	background: rgba(255, 255, 255, 0.95);
	box-sizing: border-box;
	padding: 15px 15px;
	z-index: 2;
	box-shadow: 0 18px 40px rgb(51 51 51 / 20%);
}
.header3.fixed .search_inAreaMobile{
	top: 77px;
}
	
	/*搜尋類別*/
	.search_categoryAreaPC3{
		position: absolute;			
		left: 15px;
		width: 59px;
		z-index: 2;
	}
		.search_categoryAreaPC3 select{
			color: #fff;
			background: #000 url(../images/select_arrow_white.png) no-repeat;
			background-size: 13px;
			background-position: right;
			padding-right: 18px !important;
		}

	.search_inBoxMobile{
		position: relative;
		width: 100%;
		padding: 0px 50px 0px 0px;
		box-sizing: border-box;
	}
		.search_inBoxMobile input{
			background: transparent;
			border: 0px;
			/*color: #fff;*/
			color: #333;
			font-size: 16px;
			font-weight: bold;
			line-height: 22px;
			height: 40px;
			padding: 0px;
			border-radius: 0;
			width: 100%;
			border-bottom: 1px solid #3e3a39;
		}
		.search_inBoxMobile input[type="text"]:focus{
			border: 0px;
		}
		
	.search_inBoxMobile a{
		z-index: 2002;
		color: #3e3a39;
		position: absolute;
		right: 0px;
		top: 10px;
		text-decoration: none;
	}
		.search_inBoxMobile span{
			display:inline-block;
			vertical-align:middle;
		}
		.search_closeMobile{
			font-size:22px;
			font-weight:lighter;
		}	
		
	
	
			
			
			
			
			
			
			
	
					
					
			
			
			
			/*主按鍵----------------------------*/
			.navbar {
				padding: 0px 0px;
				/*padding: 25px 0px;*/
				margin: 0px -35px;
				/*letter-spacing: 0px;*/
			}
				.nav {
					float: left;
					box-sizing:border-box;
					position: relative;		
					transition: 0.3s ease all;			
				}
				/*當螢幕 990px 才會出現*/
				.nav.MB {
					display: none;	
				}
					.nav a {
						display:block;
						text-decoration:none;
						position:relative;
					}
					.nav > a {
						text-align: center;
						font-size: 16px;
						padding: 15px 35px;
						color: #ffffff;
						transition: 0.3s ease all;
						position: relative;
					}

						.nav span{
							display: block;
						}
						.nav span.tw{
						}
						.nav span.en{
							font-family: var(--foreign_font);
							font-size: 12px;
							margin: 8px 0 0;
							color: #eaeaea;
							font-weight: normal;
						}



					/*.nav:hover > a {
						color:#ccc;
						transition: 0.3s ease all;
					}*/						
					.nav:hover > a ,
					.nav:hover > a span.en {
						color:var(--primary_color);
						transition: 0.3s ease all;
						/* opacity:0.5; */
						/*background-color:var(--primary_color);*/
					}	
					
					

					/*.nav > a:before {
						content:url(../images/top_line.png);
						position:absolute;
						left:0px;
						top:0px;
						margin:-6px 0px 0px 0px;
					}*/						
						
					.nav:nth-child(3) > a:before {
						display:none;
					}						
						
	
						
						
						
							/*主按鍵展開*/
							.navOpen {
							}
							
							.navOpen.pc {
								position:absolute;
								width: 215px;
								/* display:none; */
								opacity: 0;
								/* visibility: hidden; */
								z-index: 2;
								top: 66px;
								left:50%;
								-webkit-transform: translateX(-50%) translateY(0%);
								transform: translateX(-50%) translateY(0%);
							}							

							/*hover*/
							.nav:hover .navOpen.pc {
								/* display: block; */
								opacity: 1;
							}	
							
							
							/*.navbar .nav:nth-of-type(4):hover .navOpen.pc {
								display:block;
							}*/	

							/*遮色片 modify by david 20220624 start*/
							/* .navMask {
								position: fixed;
								top: 0;
								left: 0;
								width: 100%;
								height: 100%;
								background-color: rgba(0,0,0,.5);
								z-index: -1;
								opacity: 0;
								visibility: hidden;
							}
			
							.navMask.active {
								opacity: 1;
								visibility: visible;
								transition: 0.2s ease all;
							} */
							/*遮色片 modify by david 20220624 end*/
							
					





							.navOpenBg{
								position: relative;
							}
							.sstc .navOpen.pc .navOpenBg{
								/* animation-name: fadeInUp ; */
								/* position: relative; */
							}

							.navOpenList {
								/*border-top: 1px solid #6b6b6b;*/
								border-bottom: 4px solid var(--primary_color);
							}
								.navOpenList a {
									text-align:center;
									font-size: 14px;
									color: #363a3d;
									line-height:22px;
									padding: 10px 0px;
									background: #fff;
									transition:0.3s ease all;
									letter-spacing: 0px;
								}
								
									.navOpenList > a:hover {
										color: var(--primary_color);
										background-color: #F6F6F7;
									}



									
									/*第二層箭頭*/
									.navArrow {
										width: 47px;
										height: 47px;
										display: block;
										position: absolute;
										top: 0px;
										right: 10px;
									}
									.navArrow.active{

									}				
									.navArrow:after {
										content: "";
										width: 6px;
										height: 6px;
										display: block;
										border-bottom: 2px solid #999 ;
										border-right: 2px solid #999 ;
										position: absolute;
										right: 20px;
										top: 50%;
										z-index: 50;
										-webkit-transform: translateY(-75%) rotate(-45deg);
										transform: translateY(-75%) rotate(-45deg);
									}
							

									
								.navOpen.pc  .navOpenList a {
									text-align: left;
									font-size: 15px;
									padding: 10px 30px;
									color: var(--third_color);
									line-height:22px;
									display: block;
									text-decoration:none;
								}
								
									.navOpen.pc  .navOpenList .in {
										display: inline-block;
									}
									
									.navOpen.pc  .navOpenList a:hover {
										color: var(--primary_color);
										transition: 0.6s ease all;
									}
									
									/*展開選單第二層*/
									.navOpen.pc .nOL_open {
										z-index: 10;
										position: absolute;
										left: calc(100% - 1px);
										top: 0px;
										width: 215px;
										padding: 18px 0;
										border-bottom: 4px solid var(--primary_color);
									}
									.nOL_open {
										
										background: #fff;
										/* z-index: 10;
										position: absolute;
										left: calc(100% - 1px);
										top: 0px;
										width: 215px; */
										/*margin: 0px -5px -1px;*/
										display: none;										
										padding: 0;
										box-sizing: border-box;
										box-shadow: 0 2px 29px rgba(0, 0, 0, 0.05);
									}
									
									.navOpen.pc .navOpenList:hover .nOL_open{
										display:block;
										visibility:unset;
									}

									.sstc .navOpen.pc .navOpenList:hover .nOL_open{
										display:block;
										/* visibility:unset; */
										animation-name: fadeInUp !important;
									}

									.nOLO_list {
										text-align: left;
									}
										.nOLO_list > a {
											display: block;
											color: #fff;
											font-size: 13px;
											line-height: 20px;
											letter-spacing: 0px;
											text-decoration: none;
											padding: 5px 5px;
										}																			
											.nOLO_list a:hover {
												/*color: #333;*/
											}
										
									.navOpenList a:hover .nOL_open{
										display:block;
									}




									.navOpen.mobile {
										display:none;
										opacity:0;
										z-index:-999999;
										position: absolute;
									}
												

@media (max-width: 1300px){

	/* .sstcWrap{
		max-width: 1150px;
	} */

}






@media (max-width: 1280px){	
/* @media (max-width: 1200px){ */


/*logo*/	
/* .logo {
	width: 210px;
    padding: 23px 0px;
}	

		.lang_pc{
			right: unset;
		} */
	
		/*主按鍵*/
		/* .navbar {
			margin: 0px -5px;
		}*/

				.nav > a {
					/* padding: 20px 10px; */
				}
				
					/* .navOpen.pc {
						top: 76px;
					}
					
									
					.navOpen.pc.sstc {
						top: 115px;
					}  */
					

				
}


@media (max-width: 1180px){
			
/*主按鍵*/
/* .navbar {
}
	.nav > a {
	} */		
		/* .sstcWrap{
			max-width: 990px;
		}				 */
}	

@media (max-width: 1020px){

/*主按鍵*/
.navbar {
	margin: 0px;
}

		.nav > a {
		}
		
		.nav.lastnav > a {
			padding-right:0px;
		}			
		
				.nav > a:before {
					display:none;
				}
		
}
	
@media screen and (min-width: 991px){ 

	.sstc:hover .navOpen.pc .navOpenBg{ /*20241022*/
		animation-name: fadeInUp !important;
		visibility: unset!important;
	}

	.sstc .navOpen.pc .navOpenList:hover .nOL_open { /*20241022*/
		animation-name: fadeInUp !important;
		visibility: unset!important;
	}

	.navOpenList:hover .navArrow:after {
		border-bottom: 2px solid var(--primary_color) ;
		border-right: 2px solid var(--primary_color) ;
		transition: 0.6s ease all;
	}

}

@media (max-width: 990px){

.headerArea{
	/*transition: 0.8s ease all;*/
	/*top: -60px;*/
}
.headerArea.active{
	/*transition: 0.8s ease all;*/
}

.header {
    background-color: #ffffff;
}
			
/*版頭上方區塊-----------*/									
.headerTop {
	display: none;
	position: absolute;
	width: 100%;
	top: -60px;
}

.headerArea.active .headerTop {
	position:static;
    top:auto;

	
	animation-name:fadeInDown;	                 /*動畫名稱*/
	animation-duration:0.2s;                     /*動畫持續時間，預設 0，單位 s 或 ms。*/
	animation-delay:0s;	                         /*動畫延遲播放時間，預設 0，單位 s 或 ms。*/
	animation-iteration-count:1;	             /*動畫播放次數，預設 1。其他還有 infinite。*/
	animation-timing-function:ease-in;	         /*動畫加速度函式，預設 ease。  其他還有： linear、ease-in、ease-out、ease-in-out、step-start、step-end、steps(int,start/end)、cubic-bezier(n,n,n,n)。*/
	animation-direction: alternate;	             /*動畫播放方向，預設 normal。其他還有 reverse、alternate、alternate-reverse。*/
	animation-fill-mode: both;                   /*動畫播放前後模式，預設 none。其他還有 forwards、backwards、both。*/
	animation-play-state: running;	             /*動畫播放或暫停狀態，預設 running。其他還有 paused。*/	
}




	/*版頭上方按鍵區*/
	/* .headerTop_btn{
		position: absolute;
		display: block;
		top: 60px;
		left: 50%;
		display:block;
		-webkit-transform: translateX(-50%) translateY(0%);
		transform: translateX(-50%) translateY(0%);
		transition: 0.25s ease all;
	}	
	.headerArea.active .headerTop_btn {
		-webkit-transform: translateX(-50%) translateY(0%) rotate(180deg);
		transform: translateX(-50%) translateY(0%) rotate(180deg);
		transition: 0.25s ease all;
		top: 40px;
	} */


.headerTopRightNavList.headerTopRightNavListMob{
	display:none;
}


	/*logo*/
	.logo {
		padding: 15px 0px;
		display: block;
		width: 290px;
	}
	.logotop{
		display: none;		
	}
	
	
	/*手機menu按鍵*/
	.menu_btn {
		display:block;
	}
	.headerArea.active .menu_btn {
		-webkit-transform: translateX(0%) translateY(55%);
		transform: translateX(0%) translateY(55%);
	}
		
	
	
	
	/*版頭右*/
	.headerRight {
		position: fixed;
		width: 200px;
		top: 0px;
		right: -200px;
		height: 100%;
		box-sizing: border-box;
		background: rgba(0, 0, 0, 0.72);
		transition: 0.3s ease all;
		padding: 70px 0px 0px;
		overflow-y: scroll;
		z-index: 999;
	}
		.headerRight.active {
			right: 0px;
			box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.16);
		}
			/*版頭社群*/
			/*.headerRightTop_socialLinkArea {
				float: none;
				padding: 0px;
				background: rgba(255, 255, 255, 0.95);
				position: absolute;
				width: 100%;
				bottom: 0px;
				text-align: right;
			}
				.hRT_socialLink {
					float: none;

					display: inline-block;
					padding: 0px;
				}
					.hRT_socialLink a {
						padding: 9px 9px;
					}*/
			
			

			
			/*電腦語系消失*/
			.lang_pc{
				display:none;
			}

			/*手機版頭語系*/
			.lang {
				float: none;
				border: none;
				background: #37b6a3;
				border-radius: 0px;
				display:block;
			}
				.langLink {
					box-sizing:border-box;
					width:49.9%;
					text-align:center;
				}
					.langLink a {
						/*line-height: 42px;*/
						color: #fff;
						padding: 7px 0px;
					}

					.langLink:after {
						top: 12px;
						right: -3px;
						color:#fff;
					}
						.langLink a:hover, .langLink.active a {
							color: var(--primary_color);
    						font-weight: bold;
						}
				
				
				
				
				
				/*搜尋區塊------------------------------------------------*/
				.search_areaPC{
					display:none;
				}
				/*Mobile搜尋區塊------------------------------------------------*/
				.searchAreaMobile{ 
					display:block;
				}
					
				/*搜尋mobile-----------------------------------------*/
				/* .siteSearch {
					display:block;
				}		 */
						
				/*電腦版頭搜尋*/
				/*.header_search_area{
					display:none;
				}*/
						
						
				/*手機版頭搜尋*/
				/*.siteSearch {
					display:block;
					float:none;
					padding:0px;
				}
					.siteSearchBg {
						border-radius: 0px;
						background: #fff;
						box-sizing: border-box;
						width:100%;
						border-top: none;
						border-left: none;
						border-right: none;
						border: solid 2px #37b6a3;
					}
						.siteSearchBg input[type='text'] {
							height:38px;
							line-height:38px;
							font-size:15px;
						}
						.siteSearchBg label {
							height:38px;
							padding: 10px 6px;
						}*/		
						
				
						
						
						
						
						
			/*主按鍵*/
			.navbar {
				margin:0px;
				padding:0px;
				border-top:none;
			}
				.nav {
					float:none;
					width:auto;
					padding: 0px;
					border-bottom: solid 1px #555;
				}
				/*當螢幕 990px 才會出現*/
				.nav.MB {
					display: block;
				}
					.lang{
						margin: 0px 0px 5px;
						background-color: #696969;
					}
					.langLink:after {
    					top: 14px;
					}
						.langLink a{
							padding: 10px 0px;
						}
					
					.nav > a {
						font-size: 15px;
						border:none;
						border-radius:0px;
						/*background: #f3f3f3;*/
						color: #f3f3f3;
						text-align:left;
						padding: 12px 20px;
					}
					.nav:hover > a, .nav:hover > a span.en {
						color: #fff;
					}
						/*主按鍵展開*/
						.navOpen {
							position: relative;
							width: auto;
							margin: 0px;
							left: 0px;
							top: 0px;
							padding: 0px;
						}
						.nav:hover .navOpen.pc {
							display:none;
							opacity:0;
							z-index:-999999;
						}
						
						.nav:hover .navOpen.pc.sstc {
							display:none;
						}

						/* 下拉選單箭頭	 */
						.navOpenSstcBotArrow{
							display: none;
						}
						
						.navOpen.pc{
							display: none;
						}


						.navOpen.mobile {
							display:none;
							opacity:1;
							z-index:1;
							position: relative;
						}
							.navOpenBg:before {
								margin: 0px;
								left: 15px;
								border-width: 8px;
								border-bottom: solid 5px #000;
								top: -5px;
							}
								.navOpenList a {
									text-align:left;
									padding: 12px 15px;
									font-size:14px;
									color: var(--third_color);
									/*modify by david 20220623 start*/
									/* color: #fff; */
									/*modify by david 20220623 end*/
								}
								/*modify by david 20220623 start*/
								.navOpenList > a:hover {
									background-color: var(--primary_color);
									color:#fff;
								}
								/*modify by david 20220623 end*/
								/*modify by david 20220622 start*/			
								.navOpenList > a::after{
									display: none;
								}			
								/*modify by david 20220622 end*/
								/*modify by david 20220624 start*/
								.navMask {
									display: none;
								}
								.navMask.active {
									display: none;
								}
								/*modify by david 20220624 end*/

								.nOL_open.active{
									display: block;				
								}

					.navArrow{
						right: 0;
					}	
					.navArrow.active:after{
						border-bottom: 2px solid var(--primary_color) ;
						border-right: 2px solid var(--primary_color) ;
						transition: 0.6s ease all;
					}
}	

@media (max-width: 768px){
		/*logo*/
		.logo {
			/*margin: 0px auto;*/
			float: none;
			/*padding: 5px 0px;*/
		}
				
}

@media (max-width: 640px){
	/*logo*/
	.logo {
		width: 97px;
		padding: 10px 0px;
	}
		.logo_flash {
			display:none;
		}
		
	/*手機menu按鍵*/
	.menu_btn {
	}
		.menu_btn.active {
			top: 5px;
		}	

	.searchAreaMobile {
		/* right: calc(6% + 40px); */
	}
		.search_inAreaMobile {
			width: 250px;
			top: 33px;
		}

	/*版頭右*/
	.headerRight {
		padding: 46px 0px 0px;
	}
}



@media (max-width: 425px){

			
/*版頭上方區塊-----------*/									
/* .headerTop {
	top: -105px;
} */
	/*版頭上方按鍵區*/
	/* .headerTop_btn{
		top: 110px;
	}
	.headerArea.active .headerTop_btn {
		top: 106px;
	} 

.headerTopRightNav {
    text-align: center;
    margin: 0 auto;
    display: block;
}			
	.headerTopRightNavList.headerTopRightNavListMob{
		display:none;
	}
	.headerTopRightNavList{
		display:block;
		padding:5px 0px;
		margin:0 auto;
	}


.headerArea.active .menu_btn {
    -webkit-transform: translateX(0%) translateY(179%);
    transform: translateX(0%) translateY(179%);
}
.headerArea.active .menu_btn.active {
    -webkit-transform: translateX(0%) translateY(50%);
    transform: translateX(0%) translateY(50%);
}*/


	
	/*logo*/
	/* .logo {
		width: 220px;
		margin: 0px;
	} */
					
}




/*================================*/
/*----- 語系 language -----*/
/*================================*/
.language_areaPC {
	position: relative;
	padding-left: 25px;
}

.language {
	padding: 0 11px 0 0;
	text-align: center;
	position: relative;
	/* border-radius: 26px; */
	/* background-color: #fff; */
	/* border: solid 0.5px #bfbfbf00; */
}

.language i {
	font-size: 22px;
	line-height: 18px;
	color: var(--primary_color);
}

.language>a {
	font-size: 16px;
	/* line-height: 34px; */
	color: #fff;
	display: block;
	/*border: 1px #c3c3c3 solid;
		border-radius: 5px;*/
	text-decoration: none;
	padding: 0px 0px 0px 0px;
	/* position: relative; */
	/* background-color: #b0b0b0; */
}

.language>a:before {
	position: absolute;
	content: "";
	border-top: solid 7px var(--primary_color);
	border-left: solid 4px rgba(255, 255, 255, 0);
	border-right: solid 4px rgba(255, 255, 255, 0);
	/* top: 50%; */
	top: 5px;
	right: 0px;
	/* transform: translateY(-45%); */
}


.language_list {
	position: absolute;
	width: 75px;
	top: 24px;
	/* left: 75%; */	
    left: calc(50% + (25px / 2));
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	background-color: #fff;
	border-radius: 3px;
	display: none;
	margin: 5px 0px 0px;
	box-shadow: 1px 2px 3px 1px rgba(0, 0, 0, 0.2);
	font-size: 14px;
	z-index: 999;
}

.language_list {
	text-align: center;
}

.language_list_in>a {
	color: #898989;
	display: inline-block;
	text-decoration: none;
	font-size: 12px;
	line-height: 24px;
	text-decoration: none;
}

.language>a:hover,
.language_list>a:hover {
	opacity: 0.5;
}



.header.fixed .language_areaPC {
	top: 42px;
}

/* 手機版語系 */

.language_areaMB{
	
}

.language_content{
	display: flex;
	justify-content: space-around;
	padding: 10px 0 ;
}
.language_content_in a{
	color: #cecece;
	line-height: 24px;
}

.language_areaMB{
	display: none;
}
.language_areaPC.mobile{
	display: none;
}
@media(max-width:990px){
	/* .language_areaPC {
		display: none;
	}
	.language_areaMB{
		display: block;
	} */
	.language_areaPC.mobile {
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%) translateX(0%);
		transform: translateY(-50%) translateX(0%);
		right: calc(14% + 40px);
		right:calc(8% + 20px + 40px + 20px); /*第1個20是menu_btn寬度，40是距離和搜尋寬度，第2個20是語言距離*/
		display: block;
		padding-left: 0;
	}

	.language>a {
		color: #000;
	}
	.language i {
		color: #000;
	}
	.language>a:before {
		border-top: solid 7px #000;
	}
		
	.language_list {
		left: 50%;
	}
}







/*平板版*/
/*---------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
@media (min-width: 541px) and  (max-width: 950px){
}


/*手機版*/
/*---------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
@media (max-width: 540px){
}