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

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





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

.header {
	position: fixed;
	top: 0;
	z-index: 999;
	/* background: #cc3d3d; */
	width: 100%;
	padding: 0px;
	transition: 0.3s ease all;
}
.header.fixed{
	box-shadow: 0px 0px 20px -1px rgba(0,0,0,0.3);
	transition: 0.3s ease all;
	padding: 0px 0px;

	/* background-color: rgba(255,255,255,0.9); */ /* modify by pekey 20220711 */
	background-color: #ffffff;
}



	.header > .wrap {
		width: 90%;
	}
	


	
/*內頁header*/
.header.inheader{
	/*background: rgba(8, 19, 29, 0);*/
}
.header.inheader.fixed{
    background: rgb(29, 63, 95);
}
	.header.inheader > .wrap {
		 /*box-shadow: 0px 1px 2px rgba(38, 84, 128, 0.5);*/
		/*border-bottom: 1px #ea5239 solid;*/
	}
	

.header_area{
	
display: flex;
	
align-items: center;
	
justify-content: space-between;
}

	
		/*手機menu按鍵*/
		.menu_btn {
			position:absolute;
			/*width:20px;*/
			width: 25px;
			top: 50%;
			right: 5%;
			cursor:pointer;
			display:none;
			z-index: 99;
			margin: -15px 0px 0px;
		}
			.menu_btn span {
				display:block;
				background: #000000;
				height:2px;
				margin: 6px 0px;
				transition:0.3s ease all;
				border-radius:3px;
			}
				/*點擊*/
				.menu_btn.active {
					/* top: 45px; */ /* modify by pekey 20220711 */
					top: 13px;
					position: fixed;
					margin: 0px;
					/* right: 15px; */
				}
				.header.fixed .menu_btn.active {
					/* top: 20px; */ /* modify by pekey 20220711 */
				}
				
					.menu_btn.active span {
						background:#fff;
					}
					.menu_btn.active span:nth-of-type(1) {
						/*transform: rotate(39deg);*/
						transform: rotate(42deg);
						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(-42deg);
						transform-origin: bottom left;
					}
				
		/*手機版搜尋按鈕*/
		.search_iconSP{
			display: none;
			position: absolute;
			width: 30px;
			top: 50%;
			right: 55px;
			cursor: pointer;
			z-index: 2;
			margin: -10px 0px 0px;
		}
			.search_iconSP label{
				width: 30px;
				height: 30px;
			}
				.search_iconSP img{
					width: 70%;
					height: auto;
					margin: 0px auto;
				}
				
			
		/*版頭搜尋區塊*/	
		.search_areaSP{
			-webkit-transition: top .2s;
			transition: top .2s;
			z-index: 15;
			/*position: fixed;*/
			position: absolute;
			width: 100%;
			z-index: 2000;
			overflow: hidden;
			display:none;
			/*top: 83px;*/
			top: 70px;
			left: 0px;
			background: #000;
		}
			.search_inAreaSP{
				padding: 15px;
			}
				.search_inAreaSP input{
					background: transparent;
					border: 0px;
					text-align: center;
					color: #fff;
					font-size: 34px;
					font-weight: bold;
					line-height: 40px;
					height: 58px;
					padding: 0px 80px;
				}
				.search_inAreaSP input[type="text"]:focus{
					border: 0px;
				}
				
			.search_inAreaSP a{	
				z-index: 2002;
				color: #fff;
				position: absolute;
				right: 30px;
				top: 35px;
				text-decoration: none;
			}
				.search_inAreaSP span{
					display:inline-block;
					vertical-align:middle;
				}
				.close_iconSP{
					font-size:22px;
					font-weight:lighter;
				}
				
				
				
		.logo{
			width: 200px;
			/* float:left; */
			box-sizing: border-box;
			padding: 10px 0px;
		}
		.header.fixed .logo{
			width: 195px;
			padding: 6px 0px;
		}
			.logo a{
				display:block;
			}
			.logo a:hover{
				opacity:0.8;
			}				
				.logo img{
					width:100%;
					height:auto;
				}
				/* .logo img.logoPc{
				}
				.logo img.logoMobile{
					display:none;
				} */

				
				
				
		/*版頭區塊_右半部*/
		.header_rightArea{
			/* float: right; */
			position: relative;
		}
			
			/*版頭區塊_右半部_上*/
			.headerRight_topArea{
				display:none;
				position: absolute;
				right: 0px;
			}
			.header.fixed .headerRight_topArea{
				display: none;
			}
				
				/*語系*/
				.lang_area {
					float:right;
					box-sizing: border-box;
				}
					.lang_area select {
						width: 90px;
						/*width: 77px;*/
						font-size: 12px;
						color: #5e5e5e;
						border: 1px solid #d3d4d4;
						/*border-radius: 4px;*/
						border-radius: 30px;
						padding: 0px 13px;
						text-align: center;
						height: 30px;
						line-height: 28px;
						cursor: pointer;
						background: #fff url(../images/select_arrow2.png) no-repeat;
						background-size: 18px;
						/*background-position: 53px 8.5px;*/
						background-position: 70px 8.5px;
						padding-right: 25px !important;
					}
	
	
				/*搜尋區塊*/
				.search_area{
					float: left;
					padding: 0px 7px 0px 0px;
					box-sizing: border-box;
				}
					.search_inArea {
						position: relative;
						top: 0;
					}
						.search_inArea input[type='text']{
							height: 30px;
							line-height: 30px;
							font-size: 12px;
							border-radius:36px;
							border-right:0px;
							background:#fff;
							border:0px;
							padding: 0px 48px 0px 16px;
							color: #333;
							border: solid 0.5px #d3d4d4;
     						width: 245px;
						}
						.search_inArea label{
							width: 35px;
							height: 30px;
							cursor: pointer;
							transition: 0.3s ease all;
							position: absolute;
							right: 0px;
							top: 0px;
							/*background: #492582;
							border-radius: 0px 36px 36px 0px;*/
						}
						
						/*.search_inArea label:hover{
							opacity:0.7;
							transition: 0.3s ease all;
						}*/
							.search_inArea i{
								position: relative;
								right: -6px;
								/*top: 3.5px;*/
								top: 5px;
								z-index:10;
								/*color:#fff;*/
								color: #a3a4a4;
								font-size: 20px;
							}
							.search_inArea i:hover{
								opacity:0.7;
								transition: 0.3s ease all;
							}
							.search_inArea input[type='submit']{
								width: 35px;
								height: 30px;
								cursor: pointer;
								transition: 0.3s ease all;
								position: absolute;
								right: 0px;
								top: 0;
								background: rgba(255,255,255,0);
							}
							
							
				/*主按鍵*/
				.navbar{
					/*float: right;
					padding: 24px 0px;*/
					padding: 0px 0px;

					display: flex;
					align-items: center;
					flex-wrap: nowrap;
					margin: 0 -25px;
				}			
				.header.fixed .navbar{
					/*padding: 15px 0px 10px;*/
					padding: 0px 0px 0px;
				}
				
					.nav{
						/*float: left;*/
						position: relative;
						/*position:static;*/
						box-sizing: border-box;						
					}
				
						.nav > a{
							display: block;
							padding: 25px 25px;
							color: #fff;
							font-size: 20px;
							font-weight: bold;
							line-height: 22px;
							border-radius: 3px;
							transition: 0.3s ease all;
							text-shadow: 0px 0px 5px #000;
							
						}
						/* .nav:nth-of-type(6) > a{
							padding-right: 0px;
						} */
						
						
						.header.fixed .nav > a{
							padding: 21px 25px;

							/* modify by pekey 20220711 */
							text-shadow: unset;
							color: #333333;
						}						
						
						/*hover*/
						.nav:hover > a {
							color: #7DCCF3;
							text-decoration:none;
							transition: 0.3s ease all;
						}
						
						.header.fixed .nav:hover > a{
							/* modify by pekey 20220711 */
							color: #7DCCF3;
							text-decoration:none;
							transition: 0.3s ease all;
						}	

						.nav a::after {
							content: "";
							position: absolute;
							left: 0px;
							top: 50%;
							background-color: #fff;
							width: 1px;
							height: 20px;
							padding: 0;
							transform: translateY(-50%);
						}

						.header.fixed .nav > a::after{
							/* modify by pekey 20220711 */
							background-color: #999999;
						}	


						.nav:nth-child(1) > a::after {
							display:none;
						}
							
						/*主按鍵_下拉選單*/
						.navOpen.pc {
							position:absolute;
							left: 50%;
							top: 90px;
							/*right:50%;*/
							padding: 22px 0px 0px;
							-webkit-transform:translateX(-50%);
							transform:translateX(-50%);
							/*width:115px;*/
							/*width: 140px;*/
							/*margin: -22px 0px 0px -355px;*/
							/*margin: -10px -517px 0px 0px;*/
							display: none;
							z-index: 2;
						}
						.header.fixed .navOpen.pc {
							top: 61px;
							/*margin: -22px 0px 0px -355px;
							margin: -2px -517px 0px 0px;*/
						}
						
						
						
						
						/*mobile版*/
						.navOpen.mobile {
							display:none;
							opacity:0;
							z-index:-999999;
      						position: absolute;
						}	
						
						/*hover*/
						.nav:hover .navOpen.pc {
							display: block;
						}	
						
							.navOpenBg {
								position:relative;
								/*background: #285075;*/
								/*box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.2);*/
							}
							
							
							.navOpen.pc .navOpenBg {
								/*padding: 20px 15px;
								width: 657px;*/
								padding: 10px 5px;
								/* width: 601px; */
								background: rgba(0 0 0 / 15%);
								/* text-align:left; */
								width: 151px;
							}								
						
								/*.navOpenBg:before {
									position: absolute;
									content:'';
									border-bottom: solid 8px rgba(0,0,0,0.6);
									border-left: solid 12px rgba(255,255,255,0);
									border-right: solid 12px rgba(255,255,255,0);
									top:-8px;
									left:50%;
									margin:0px 0px 0px -12px;
								}*/
								
								.navOpen.pc .navOpenList {
									/*float:left;*/
									/* display: inline-block; */
									vertical-align: top;
									box-sizing: border-box;
									/*width: 155px;*/
									/* width: 24.2%; */
									padding: 15px 0px;
								}
								
								.navOpen.pc  .navOpenList >a {
									/*text-align:center;*/
									font-size: 15px;
									color:#fff;
									line-height:22px;
									padding: 0px 5px 0px 25px;
									/*margin: 5px 0px;*/
									/*padding: 10px 5px;*/
									transition:0.3s ease all;
									text-decoration:none;
									display: inline-block;
									position:relative;
									letter-spacing: -0.5px;
								}
								.navOpen.pc  .navOpenList >a:before {
									position: absolute;
									content: "";
									background-color: #7DCCF3;
									top: 0px;
									left: 0px;
									padding: 0px 0px 0px 1px;
									height: 100%;
									/*top: 9px;
									left:7px;
									height: 22px;*/
									width: 2px;
								}								
								
								
								/*.navOpen.pc  .navOpenList:nth-last-of-type(1) >a ,
								.navOpen.pc  .navOpenList:nth-last-of-type(2) >a ,
								.navOpen.pc  .navOpenList:nth-last-of-type(3) >a ,
								.navOpen.pc  .navOpenList:nth-last-of-type(4) >a   {
									margin: 5px 0px 5px;
								}*/								
									.navOpen.pc  .navOpenList >a:hover {
										color:#7DCCF3;
										/*background: #c52d2f;*/
										text-decoration:none;
										transition: 0.3s ease all;
									}
										
										
									
								.sL_list_area{
									/*padding-top: 15px;*/
									/*padding-bottom:15px;*/
								}
								.sL_list_area.pc{
									padding-top:25px;
									/*margin: -15px 0px 20px;*/
								}
								
								
								
								/*.navOpenList:nth-last-of-type(1) .sL_list_area.pc ,
								.navOpenList:nth-last-of-type(2) .sL_list_area.pc ,
								.navOpenList:nth-last-of-type(3) .sL_list_area.pc ,
								.navOpenList:nth-last-of-type(4) .sL_list_area.pc{
									padding-bottom:0px;
								}*/								
								
								
								
								.sL_list_area.mobile{
									display:none;
								}
									.navOpenBg.mob2 .navOpenList >a{
										position:relative;
									}
									.navOpenBg.mob2 .navOpenList >a:before{
										content: '+';
										position: absolute;
										font-size: 19px;
										color: #ffffff;
										top: 12px;
										right: 8px;
										transition: 0.3s ease all;
										transform-origin: center center;
									}								
								
									/*.sL_list_area.mobile >a:before{
										-webkit-transform: rotate(45deg);
										transform: rotate(45deg);
										top: 11px;
										font-size: 21px;
									}*/								
								
								
																																		
									.sL_list{
										padding: 0px 0px 0px 17px;
									}
										.sL_list >a{
											display:block;
											color: #dcdcdc;
											text-decoration:none;
											font-size:13px;
											line-height: 33px;
											/*line-height:24px;*/											
										}
										.sL_list >a:hover{
											color:#7DCCF3;										
										}									
									
										
										
										
										
										
												

@media (max-width: 1280px){

	.logo ,
	.header.fixed .logo{
		width: 200px;
	}

	/*主按鍵*/
	.navbar ,
	.header.fixed .navbar{
		margin: 0 -10px;
	}		
		
		.navOpen.pc {
    		top: 71px;
		}
		.header.fixed .navOpen.pc {
			top: 67px;
		}

}

@media (max-width: 1160px){
	
.navOpen.pc {
	/*margin: -22px 0px 0px -430px;*/
}
.header.fixed .navOpen.pc {
	/*margin: -22px 0px 0px -430px;*/
}

	.nav > a{
		/*padding: 40px 16px;
		padding: 0px 16px;*/
	}
		.header.fixed .nav > a {
			/*padding: 10px 16px;
			line-height: 45px;*/
		}	
	
}

/* @media (max-width: 990px){ */ /* modify by pekey 20220706 start */
@media (max-width: 1080px){

	.header {
		padding: 0px;
		/* background-color: rgba(255,255,255,0.9); */

		/* modify pekey 20220711 */
		position: relative;
	}

	.header.fixed {
		/* background-color: rgba(255,255,255,0.9); */

		/* modify pekey 20220711 */
		position: fixed;
	}
		
			
		.header.inheader > .wrap {
			box-shadow:none;
		}	
		
		
		
		/*手機menu按鍵*/
		.menu_btn {
			display:block;
		}
		.header.fixed .menu_btn span {
			/* background: #ea5239; */
		}
		
		.header.fixed .headerRight_topArea{
			/*display: block;*/
		}

						
		/*手機版搜尋按鈕*/
		.search_iconSP{
			/*display: block;*/
		}
		.search_areaSP{
			top: 65px;
		}
				
		
		
		.logo{
			padding: 0px 0px;
		}
		.header .logo img.logoPc{
			display:none;
		}
		.header .logo img.logoMobile{
			display:block;
		}
		
		.header .logo {
			padding: 15px 0px;
			width: 100px;
		}	

		.header.fixed .logo {
			padding: 15px 0px;
			width: 100px;
		}	
			/* .header.fixed .logo img.logoPc{
				display:block;
			}
			.header.fixed .logo img.logoMobile{
				display:none;
			} */

		
		
		
		/*版頭區塊_右半部*/
		.header_rightArea {
			position:fixed;
			top:0px;
			/*right:-225px;*/
			right:-100%;
			transition:0.3s ease all;
			/*width:225px;*/
			width:100%;
			box-sizing:border-box;
			background: rgba(0, 0, 0, 0.8);
			height: 100%;
			overflow-y:scroll;
			/*z-index: 98;*/ /*modify by pekey 20180626*/
			z-index: 3; 
			/* padding: 120px 0px 0px; */ /*modify by pekey 20220711*/
			padding: 75px 0px 0px;
		}
		
		
			.header_rightArea.active {
				right:0px;
				box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.16);
			}
			.header.fixed .header_rightArea {
				/* padding: 75px 0px 0px; */ /*modify by pekey 20220711*/
			}	
			
			


				/*語系*/
				.lang_area {
					position: static;
					float: none;
				}
				
					.lang_area select{
						width: 100%;
						border-radius: 0;
						padding: 0px 13px;
						height: 35px;
						line-height: 35px;
						background: #fff url(../images/select_arrow2.png) no-repeat;
						background-size: 18px;
						background-position: 187px 12.5px;
						padding-right: 25px !important;
						
						font-size: 14px;
					}
					
				
				/*搜尋區塊*/
				.search_area{
					float: none;
					padding: 0px;
				}	
					.search_inArea input[type='text']{
						border-radius: 0px;
						height: 34px;
						line-height: 34px;
						padding: 0px 48px 0px 13px;
						
						font-size: 14px;
						width: 100%;
					}
						.search_inArea label {
							height: 34px;
						}
							.search_inArea i {
								top: 5.5px;
								right: 5px;
							}
							.search_inArea input[type='submit'] {
								height: 34px;
							}
						
				
				/*主按鍵*/
				.navbar {
					float: none;
					padding: 0px 0px 0px;
					display: unset;
					align-items: unset;
					flex-wrap: unset;
				}
				.header.fixed .navbar{
					display: unset;
					align-items: unset;
					flex-wrap: unset;
					/* padding: 0px 0px 0px; */
					/*padding: 75px 0px 0px;*/
				}
				
					.nav {
						float:none;
						padding: 0px;
					}
						.nav  a {
							color:#fff;
							border:none;
						}

						.nav a::after {	
							width: 0px;
							height: 0px;
							
						}
							.nav > a ,
							.header.fixed .nav > a{
								line-height:23px;
								/*padding: 20px 15px;*/
								padding: 12px 15px;
								font-size:16px; 
								border-bottom: 1px #8c8c8c solid; 

								/* modify by pekey 20220711 */
								color: #ffffff;
							}
								/*hover*/
								.nav:hover  > a{
									border:none;
									background: transparent;
									color: #fff;
									opacity: 0.7;
								}
								
								/*當前模式*/
								.nav.active > a{
									background: transparent;
								}
								
								
									/*展開選單*/
									.navOpen {
										position:relative;
										top:0px;
										left:0px;
										margin:0px;
										width:auto;
										border-radius:0px;
										background:#444;
									}
										.navOpen:before, .navOpen:after {
											border-bottom: solid 8px #444;
											left: 23px;
										}
											.nO_list a {
												text-align:left;
												padding: 15px 15px;
											}
											
									
									/*hover*/
									.nav:hover .navOpen.pc {
										display:none;
									}	
									.fixed_nav: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:#fff;
														line-height:22px;
														/*padding: 15px 15px;*/
														padding: 12px 15px;
														background-color: #7DCCF3;
														/*background: rgba(255, 255, 255, 0.5);*/
														transition:0.3s ease all;
														text-decoration:none;
														display:block;
													}
														.navOpenList > a:hover {
															opacity: 0.7;
														}
														
															
		
}


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

@media (max-width: 640px){
	
	
	.search_areaSP{
		top: 74px;
	}
		.search_inAreaSP input{
			padding: 0px 55px;
		}
		
		.search_inAreaSP a{	
			z-index: 2002;
			color: #fff;
			position: absolute;
			right: 30px;
			top: 25px;
			text-decoration: none;
		}
			.search_inAreaSP span:nth-child(2){
				display:none;
			}
			.close_icon{
				font-size:40px;
			}
	
	
	.logo{
		/* width: 240px; */
		/*width: 135px;*/
	}
	
	
}


@media (max-width: 425px){
	
	/* .header.fixed .logo {
		width: 240px;
	} */

}


/* modify by david 20220809 start */
.header.completeheader {
	position: static;
}
.header.completeheader.fixed {
	box-shadow: unset;
}
.header.completeheader .wrap > .header_area {
	justify-content: center;
	padding: 25px 0 0;
}
.header.completeheader .wrap .header_area >.logo {
    width: 200px;
    padding: 10px 0px;
}
@media(max-width:425px){
	.header.completeheader .wrap .header_area >.logo {
		width: 170px;
		padding: 0px;
	}
}
/* modify by david 20220809 end */