.header {
     border-bottom: solid 3px #d70010 
}

.index_header {
    /* border-bottom: solid 3px #fff; */
}

.header .wrap {
    position: relative;
    width: 1100px;
}


	.headerIn{
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		/* align-items: flex-end; */
	}










.logo_flash,.m_b_line,.m_b_line span,.menu_btn_area {
    position: absolute;
}

.logo {
    box-sizing: border-box;
    /* float: left;
    padding: 9px 0 7px; */
	padding: 7px 0;
	width: 120px;
}
	.logo img{
		width: 100%;
		height: auto;
	}
	.logo a{
		display:block;
	}

.logo_flash {
    width: 20px;
	height: 80px;
    /*height: 66px;*/
    background: rgba(255,255,255,.8);
    top: 3px;
    left: -32px;
    transform: rotate(20deg);
    transform-origin: center;
    box-shadow: 0 0 10px #FFF;
}

.logo_flash_hover {
    left: 183px;
    transition: .5s ease all;
}



@media (max-width: 1280px){
	
	.header .wrap {
		width: 80%;
	}

}

@media (max-width: 1200px){
	
	.header .wrap {
		width: 90%;
	}

}


@media (max-width: 990px){

	.headerIn {
		/*display: unset;
		flex-wrap: unset;
		flex-direction: unset;
		align-items: unset;
		justify-content: unset;*/
	}

	.logo_flash {
		height: 65px;
	}

}

@media (max-device-width: 900px) {
    .pc_logo {
        display:none;
    }

    .mobile_logo {
        display: block;
    }
}

@media (max-width: 768px){
	.logo_flash {
		display: none;
	}
}






.m_b_line span,
.nav > a ,
.nav_open a {
    transition: .3s ease all;
}



		
		
		
		
/*.m_b_line {
    top: 0;
    right: 45px
}

.m_b_line span {
    display: inline-block;
    width: 29px;
    height: 2px;
    background: #000
}*/



/*.m_b_line span:nth-child(1) {
    top: 11px
}

.m_b_line span:nth-child(2) {
    top: 21px
}

.m_b_line span:nth-child(3) {
    top: 31px
}

.menu_but_animaiton span:nth-child(1) {
    transform: rotate(45deg);
    transform-origin: left top;
    -webkit-transform: rotate(45deg);
    -webkit-transform-origin: left top
}

.menu_but_animaiton span:nth-child(2) {
    display: none
}

.menu_but_animaiton span:nth-child(3) {
    transform: rotate(-45deg);
    transform-origin: left bottom;
    -webkit-transform: rotate(-45deg);
    -webkit-transform-origin: left bottom
}*/




/*================*/
/*-- 手機menu按鍵 --*/
/*================*/
.menu_btn {
	position:absolute;
	width:20px;	
	right:0;
	top: 50%;
    right: 0;
	-webkit-transform: translateX(0) translateY(-50%);
    transform: translateX(0) translateY(-50%);
	/*top: 13px;
	left: 20px;*/
	cursor:pointer;
	display:none;
	z-index: 9999;
}
	.menu_btn span {
		display:block;
		background-color: #333;
		height:2px;
		margin: 4px 0px;
		transition:0.3s ease all;
		border-radius:3px;
	}
		/*點擊*/
		.menu_btn.active span {
			background-color: #fff;
		}
			.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;
			}
			
			
			
			
			
			
			




.navbar {
	display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    /* float: right; */
    /* padding: 25px 0 0; */
    box-sizing: border-box;
	/*margin-right: -135px;*/
	
}

.nav {
    /*float: left;*/
	box-sizing:border-box;
	width: 14.2%;
}

.nav > a {
    font-size: 17px;
    font-weight: 700;
    color: #3c3c3c;
    display: block;
    padding: 14px 19px;
	text-align: center;
	text-decoration: none;
}


.nav ,
.nav > a {
    position: relative;
}

.nav > a:hover {
    color: #d70010
}

.nav>a:after {
    position: absolute;
    width: 1px;
    height: 15px;
    background: #cacaca;
    right: 0;
    top: 14px;
}

/*.nav:nth-of-type(7)>a {
    padding-right: 0
}*/

.nav:nth-of-type(7)>a:after {
    display: none;
}

.nav_open_area {
    display: none;
    position: absolute;
    /*width: 100%;
    left: 0;*/
	width: 160px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
    border-top: solid 3px #d70010;
    background: rgba(0,0,0,.7);
    z-index: 9999;
}

.nav_open a {
    font-size: 14px;
    color: #fff;
    display: block;
    text-align: center;
    line-height: 20px;
	padding: 6px 5px;
	text-decoration: none;
}

.nav_open a:hover {
    color: #d70010;
}




@media (max-width: 1280px) {
	.navbar {
		margin-right: -50px;
	}
}

@media (max-width: 990px) {
    .logo,.navbar {
        float:none;
    }

    .logo {
		width:100px;
    }
	
    /*.menu_btn_area*/
	.menu_btn {
        /*display: block;*/
    }

    /*.navbar {
        display: none;
        position: absolute;
        width: 100%;
        z-index: 999;
        padding: 0;
        background: rgba(0,0,0,.7);
        left: 0
    }*/
	.navbar {
		position: fixed;
		width: 100%;
		top: 0px;
		right: -100%;
		height: 100%;
		box-sizing: border-box;
		background: rgba(0, 0, 0, 0.72);
		transition: 0.3s ease all;
		padding: 74px 0px 0px;
		overflow-y: scroll;
		z-index: 999;
		margin:0;
		display: unset;
		flex-wrap: unset;
		flex-direction: unset;
		align-items: unset;
	}
		.navbar.active {
			right: 0px;
			box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.16);
		}
		
		
		
		
    .nav {
       float: none;
    	width: 100%;
    }

    .nav > a {
        color: #fff;
        padding: 15px 0;
    }
	
	.nav > a:after {
		display:none;
	}
	
	
	.nav_open_area {
		position:relative;
		width:100%;
	}
	
	
	
	
}


 /*@media (max-width: 995px) {
	
   .nav > a {
        padding:14px 13px
    }
	
}*/





/*@media (max-width: 690px) {
    .navbar {
        background:rgba(0,0,0,.8)
    }

    .nav {
        float: none;
        width: auto
    }

    .nav>a:after {
        display: none
    }

    .nav>a {
        border-bottom: solid 1px #4E4E4E;
        padding: 18px 0
    }

    .nav_open_area {
        position: relative;
        border-bottom: solid 1px #D0D0D0;
        background: #3A3A3A
    }

    .nav_open a {
        font-size: 15px;
        padding: 14px 5px;
        border-bottom: solid 1px #333
    }
}*/











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

	/*版頭商品搜尋*/
	.header_search_area{
		text-align: right;
		/* display:inline-block; */
		/* vertical-align:middle; */
	}
	/* .header_search_area.pc{
	}
	.header_search_area.mobile{
		display: none;
	} */

		#search{
			/*color:#ccc;*/
			color:#777; /*修改by pekey 20170725*/
		}
		@-moz-document url-prefix() { 
			#search{
				color:#ccc;
			}
		}
		.header_search{
			position: relative;
			font-size: 0px;
			background: #fff;
			border: solid 1px #cacaca;
			/*border: solid 1px #ce2030;
			 width:214px; */
			/* width: 100%; */
			padding-right:22px;
			border-radius: 15px;
		}
			.header_search input {
				height: 26px;
				line-height: 26px;
			}
				.header_search input[type='text']  {
					border: none;
					/*padding:5px;*//*在IE顯示會擠壓到*/
					font-size: 13px;
					background: rgba(255, 255, 255, 0);
					
					padding: 0px 12px;
				}
				.header_search input[type='submit'] {
					position:absolute;
					float:left;
					padding: 0px 0px 6px ;
					display:none;
				}
						
						.header_search label  {
							position: absolute;
							right: 0px;
							top: 0px;
							background: #ce2030;
							padding:2px 0px 0px 3px;
							border-radius: 50%;
							width:24px;
							height:24px;
						}
						
							.header_search  i{
								font-size:20px;
								color:#fff;
								margin: 2px;
							}
									


.HeaderSearchBottom{
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: center;
	margin: 10px 0 0;
}

/*熱門搜尋------------------------------------------------------------*/
.PopularSearchArea{
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: center;
}

	.PopularSearchArea span{
		color: #000;
		font-size: 14px;
		font-weight: bold;
		display: inline-block;
		box-sizing: border-box;
		margin-right: 5px;
	}
		.PopularSearchOpen {
			/* display: flex;
			flex-wrap: wrap;
			flex-direction: row;
			align-items: center; */
			box-sizing: border-box;
			display: block;
		}
			.PopularSearchList{
				display: inline-block;
				box-sizing: border-box;
				padding: 0 4px;
			}
				.PopularSearchList a{
					display: inline-block;
					font-size: 12px;
					color: #fff;
					background-color: #ce2030;
					padding: 5px 5px;
					text-decoration: none;
					border-radius: 20px;
					box-sizing: border-box;
				}   
				.PopularSearchList a:hover{
					transition: 0.3s ease all;
					background-color: #000000;
				} 





/*進階搜尋------------------------------------------------------------*/
.AdvancedSearch {
    /* margin: 20px 0 0; */
    margin-left: 15px;
}
	.AdvancedSearch a{
		display: block;
		text-decoration: none;
		/*color: #ce2030;*/
		color: #000;
		font-size: 14px;
		font-weight: bold;
	}
	.AdvancedSearch a:hover{
		opacity:0.5;
	}
	.AdvancedSearch img{
		height:14px;
		width:auto;
	}



	@media (max-width: 990px) {

		.header_search_area {
			/*margin-right: 45px;*/
			margin-right: 0px;
		}

	}


	@media (max-width: 768px) {

		/* .header_search_area.pc{
			display: none;
		}
		.header_search_area.mobile {
			display: block;
			margin-right: 30px;
			box-sizing: border-box;
			width: calc(100% - 150px);
		} */
		.header_search_area{
			display: block;
			/*margin-right: 30px;*/
			box-sizing: border-box;
			width: calc(100% - 120px);
			/*width: calc(100% - 150px);*/
		}


		.HeaderSearchBottom{
			/* justify-content: space-between; */
		}


			/* 熱門搜尋 */
			.PopularSearchArea{
				margin: 0 5px;				
				position: relative;
				z-index: 10;
			}
			.PopularSearchArea span {
				font-size: 12px;
				margin: 0px;
				display: block;
				position: relative;
				padding-right: 12px;
				color: #ce2030;
				cursor: pointer; 
			}
			.PopularSearchArea span:before {
				position: absolute;
				content: '';
				top: 3px;
				right: 2px;
				border-top: solid 5px #ce2030;
				border-left: solid 3px rgba(255,255,255,0);
				border-right: solid 3px rgba(255,255,255,0);
				border-bottom-width: 0px;
				transition: 0.3s ease all;
			}


			.PopularSearchOpen{
				position: absolute;
				width: 150px;
				top: 23px;
				left: 50%;
				-webkit-transform: translateX(-50%);
				transform: translateX(-50%);
				display: none;
				text-align: center;
				background-color: #ce2030;
				box-shadow: 0px 2px 4px rgb(0 0 0 / 0.5);
			}
				.PopularSearchList {
					display: block;
					padding: 0;
				}
					.PopularSearchList a {
						background-color: #ffffff00;
						padding: 5px 2px;
						border-radius: 0px;
						color: #fff;
						display: block;
					}
					.PopularSearchList a:hover {
						/* opacity: 0.5;
						background-color: #ffffff00; */
					}

			/*進階搜尋--------------*/
			.AdvancedSearch {
				margin: 0 5px;
			}
				.AdvancedSearch a{
					font-size: 12px;
				}
				.AdvancedSearch img{
					display: none;
					height:12px;
				}


	}