/*///////////////////////////*/
/*------- 會員登入區塊 --------*/
/*///////////////////////////*/
.member_loginBg{
	padding: 15px 0px 0px;
}
	.member_loginIn{

	}
		/* 標題 */
		.member_loginIn .title{
			font-size: 24px;
			font-weight: bold;
			color: #000;
			text-align: start;
		}

		
		/* 登入內容區塊 */
		.login_contentBg{
			margin: 30px auto;
			width: 400px;
			max-width: 100%;
			padding: 17.5px 27.5px 20px;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
			border: 0.05em solid #e8e8e8;
			box-shadow: 0 3px 10px 0 rgb(0 0 0 / 0.1);
			overflow: hidden;
			background-color: #ffffff;
		}

			.login_contentIn{
				
			}

				/* 表單區塊 */
				.member_loginBg .form_listBg{

				}
					/* 列表 */
					.form_listArea .form_list{
						position: relative;
						padding: 7.5px 0px;
						box-sizing: border-box;
					}

					/* 標題 */
					.form_listArea .form_list .title{
						position: relative;
						left: 0;
						top: 50%;
						-webkit-transform: unset;
						transform: unset;
						font-weight: bold;
						font-size: 15px;
						line-height: 21px;
						padding: 7px 0px;
					}

					/* 欄位 */
					.form_listArea .form_list .content{
						padding: 0;
						font-size: 15px;
						/* line-height: 21px; */
						line-height: 38px;
						letter-spacing: 1px;
					}
						.form_listArea .form_list .content input{
							letter-spacing: 1px;
							padding: 0px 7px;
							font-size: 13px;
							line-height: 17px;
						}

					/* 按鈕 */
					.form_list.login_button {
						padding: 22.5px 0px 0px;
					}
						.form_list.login_button input[type="submit"] {
							width: 100%;
							background-color: var(--primary_color);
							color: #000;
							border-radius: 3px;
						}


					/* 社群登入按鈕 */
					.form_list.login_button.sns {
						margin: 0px -3px;

						display: flex;
						flex-wrap: wrap;
						flex-direction: row;
						align-items: flex-start;
					}

						.form_list.login_button.sns .button{
							width: 50%;
							box-sizing: border-box;
							/* padding: 0px 3px; */
							padding: 3px 3px;
						}
							
							
							.form_list.login_button.sns .button input{
								text-align: center;
								width: 100%;
								font-size: 13px;
								padding: 10px 5px 10px 28px;
								color: #ffffff;
								line-height: normal;
							}

							/* line */
							.form_list.login_button.sns .button.line input{
								background-color: #00c300;
								background-image: url(../../../images/line_icon.png);
								background-repeat: no-repeat;
								background-position: 10px center;
								background-size: 28px;
							}
							
							/* facebook */
							.form_list.login_button.sns .button.fb input{
								background-color: #3B5998 ;
								background-image: url(../../../images/fb_icon.png);
								background-repeat: no-repeat;
								background-position: 5px center;
								background-size: 28px;
							}
							/* google */
							.form_list.login_button.sns .button.google {
								width: 50%;
							}
								.form_list.login_button.sns .button.google input{
									background-color: #f70f4d;
									background-image: url(../../../images/google_icon.svg);
									background-repeat: no-repeat;
									background-position: 8% center;
									background-size: 23px;
								}
							/* 忘記密碼頁 */
							.form_list.login_button.forget input[type="button"] {
								background-color: #666666;
							}



				/* 裝飾區塊 */
				.member_loginBg .deco_bg{
					padding: 25px 0px 15px;
					
				}
					.member_loginBg .deco_bg .content{
						display: flex;
						-webkit-box-align: center;
						-webkit-align-items: center;
						-moz-box-align: center;
						-ms-flex-align: center;
						align-items: center
					}
						.member_loginBg .deco_bg .deco_line{
							flex: 1;
							-webkit-box-flex: 1;
							-webkit-flex: 1;
							-moz-box-flex: 1;
							-ms-flex: 1;

							background-color: #dbdbdb;
							width: 100%;
							height: 0.05em;
						}
					
						.member_loginBg .deco_bg .deco_text{
							color: #ccc;
							font-size:  13px;
							padding: 0px 10px;
						}		



				/* 其他功能區塊 */
				.member_loginBg .other_bg{
					padding: 0px;
					text-align: center;
				}
					.member_loginBg .other_bg .content {
						margin: 0px -3px;

						display: flex;
						flex-wrap: wrap;
						flex-direction: row;
						align-items: flex-start;
					}
						.member_loginBg .other_bg .content .other_list{
							/* float: left; */
							/* display: inline-block;
							box-sizing: border-box;
							position: relative;
							width: 48%; */ 

							position: relative;

							width: 50%;
							padding: 0px 3px;
							box-sizing: border-box;
						}
							.member_loginBg .other_bg .content .other_list:nth-of-type(2):before{
								position: absolute;
								left: -0.5px;

								content:'';
								background-color: #ccc;
								width: 0.05em;
								height: 23px;
							}

							.member_loginBg .other_bg .content .other_list a{
								display: block;
								color: #000;
								font-size:  13px;
								padding: 5px 15px;
								transition: 0.2s ease all;
								text-decoration: none;
							}
							.member_loginBg .other_bg .content .other_list a:hover{
								color:#79b560;
							}				



/* 註冊會員頁面 class 加 special */
.member_loginBg.special .form_listArea .form_list .title {
	left: 0;
}

.member_loginBg.special .form_listArea .form_list.password .title {
	left: 0;
}

.member_loginBg.special .form_listArea .form_list .content {
    padding: 0;
}


	.member_loginBg.special .form_listArea .form_list .content input[type="date"] {
		width: 100%;
	}




/* 修改資料頁面 */
.member_loginBg.modify  .login_contentBg{
	padding: 12.5px 27.5px 22.5px;
}
	.member_loginBg.modify .form_listArea .form_list{
		
	}
		.member_loginBg.modify .form_listArea .form_list .title{
			position: static;
			left: unset;
			top: unset;
			-webkit-transform: unset;
			transform: unset;
			text-align: left;
		}

		.modify .form_listArea .form_list .content{
			padding-left: 0;
		}


		/* 地址 */
		.form_listArea .form_list .content.home{
			display: block;
		}
			
			.member_loginBg.modify .form_list.login_button input[type="submit"]{
				background-color: #555555;
			}




							
@media (max-width: 641px){


	/* 社群登入按鈕 */
	.member_loginBg .form_list.login_button.sns {
		margin: 0px;
		padding: 7.5px 0px;
	}

		.member_loginBg .form_list.login_button.sns .button{
			width: 100%;
			padding: 4px 0px;
			/* padding: 7.5px 0px; */
		}
			.member_loginBg .form_list.login_button.sns .button input{
				padding: 10px 10px;
				font-size: 15px;
			}
			
	.form_list.login_button.sns .button.line input ,
	.form_list.login_button.sns .button.fb input ,
	.form_list.login_button.sns .button.google input{
		background-position: 10px center;
		background-size: 28px;
	}

	.member_loginBg .deco_bg {
		padding: 20px 0px 15px;
	}

	

}


@media (max-width: 500px){

	.login_contentBg {
		padding: 12.5px 15px 22.5px;
	}

}


@media (max-width: 376px){

	/* 標題 */
	.member_loginBg .form_listArea .form_list .title{
		font-size: 13px;
		line-height: 17px;
		position: static;
		left: unset;
		top: unset;
		-webkit-transform: unset;
		transform: unset;
						
		text-align: left;
	}
	.member_loginBg.special .form_listArea .form_list .title{
		position: static;
		left: unset;
	}

	/* 欄位 */
	.member_loginBg .form_listArea .form_list .content{
		padding-left: 0;
	}
	.member_loginBg.special .form_listArea .form_list .content{
		padding-left: 0;
	}

		.member_loginBg .form_listArea .form_list .content input{
			font-size: 13px;
			line-height: 17px;
		}
		

}




/*///////////////////////////*/
/*------- 會員專區功能頁面 --------*/
/*///////////////////////////*/

/* 會員專區區塊 */
.member_centerBg {
    width: 1500px;
	max-width: 100%;
    margin: 0px auto;
	padding: 15px 0px;
	box-sizing: border-box;
}

	.member_centerIn{
		border: solid 2px #cccccc;
		border-top-left-radius: 5px;
		/* border-top-left-radius: 25px; */
		border-top-right-radius: 5px;
		border-bottom-left-radius: 5px;
		border-bottom-right-radius: 5px;
	}

		/* 會員專區的選單 */
		.member_centerBg .tag_listArea{
			display: flex;
			/* flex-wrap: wrap; */
			
			flex-wrap: nowrap;
			flex-direction: row;
			align-items: flex-start;
			margin: 0;
		}
			.member_centerBg .tag_listArea .list{
				/* width: 25%; */
				
				width: 100%;
				box-sizing: border-box;
				text-align: center;
			} 
				.member_centerBg .tag_listArea .list a{
					display:block;
					text-decoration:none;
					background-color: #fcfcfc;
					padding: 7px 12px 5px;
					font-size: 15px;
					line-height: 48px;
					box-sizing: border-box;
					text-align: center;
					color: #888888;
					/* border-top: solid 1px #dddddd; */
					border-bottom: solid 2px #dddddd;
					/* border-right: solid 1px #dddddd; */
					border-left: solid 1px #dddddd;
				}  
				.member_centerBg .tag_listArea .list:nth-of-type(1) a{
					/* border-left: solid 1px #dddddd; */
					/* border-top-left-radius: 25px; */
					border-left: 0;
					border-top-left-radius: 25px;
				}
				.member_centerBg .tag_listArea .list:last-of-type a{
					border-top-right-radius: 5px;
				}
				
				/* active */
				.member_centerBg .tag_listArea .list.active a {
					background-color: #ffffff;
					color: #333333;
					border-bottom: 0;

					/* modify by pekey 20210625 */
					border-bottom: solid 2px #ffffff;
				}

				/* hover */
				.pageContent.member .tag_listArea .list a:hover{
					transition: all 0.3s ease-out;
					background-color: #ffffff;
					color: #333333;
					opacity:0.5;
				} 		


@media (max-width: 1079px){

.member_centerIn{
	/* border-top-left-radius: 5px; */
}

	.member_centerBg .tag_listArea .list {
		/* width: 25%; */
	}   
		.member_centerBg .tag_listArea .list a{
			padding: 15px 2px;
			font-size: 14px;
		} 
		.member_centerBg .tag_listArea .list:nth-of-type(1) a{
			border-top-left-radius: 5px;
		}   
} 

@media (max-width: 990px){
/* @media (max-width: 769px){ */

	/*商品上方選單*/
	.member_centerBg .tag_listArea {
		/* margin: 30px 0 0; */
		margin: 0;
	} 

		.member_centerBg .tag_listArea .list a{
			/* font-size: 13px;
			line-height: 19px; */

			padding: 10px 0px;
			font-size: 12px;
			line-height: 18px;
			letter-spacing: 0;
	
			padding: 0;
			display: flex;
			align-items: center;
			justify-content: center;
			text-align: center;
			min-height: 58px;
		} 
			.member_centerBg .tag_listArea .list span{
				display: block;
				margin: auto;
				/* min-height: calc(18px * 2); */
			} 
}

/* @media (max-width: 641px){

	.member_centerBg .tag_listArea .list a{
		padding: 10px 0px;
		font-size: 12px;
		line-height: 18px;
		letter-spacing: 0;

		padding: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		min-height: 58px;
	} 
	.member_centerBg .tag_listArea .list span{
		display: block;
		margin: auto;
	} 
} */




/*///////////////////////////*/
/*---- 會員專區內容區塊 -----*/
/*///////////////////////////*/

.center_contentBg {
	padding: 30px 27.5px;
	/* border: solid 1px #dddddd;
	border-top: 0;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px; */
}

	.center_contentBg .form_listBg{
		max-width: 100%;
	}	

		/* 等級 */
		.form_listBg .content.level{

		}
			.form_listBg .content.level .level_name{
				display: inline-block;
				min-width: 95px;
				height: 30px;
				line-height: 32px;
				font-size: 14px;
				padding: 0px 10px 2px;
				text-align: center;
				color: #000;
				background-color: var(--primary_color);
				border-radius: 24px;
				box-sizing: border-box;
			}
				


		.center_contentBg .box_listBg{
			display: flex;
			flex-wrap: wrap;
			flex-direction: row;
			align-items: flex-start;
			margin: 0px -10px;
		}

			.box_list{
				width: 50%;
				padding: 0px 10px;
				box-sizing: border-box;
			}

				/* 50樣式 */
				.form_list.type_50{
					width: 50%;
					margin: 0 auto;
				}
	
					.center_contentBg .home .address .address_select input {
						width: 104px;
					}


				.center_contentBg .form_list.button {
					display: flex;
					flex-wrap: wrap;
					flex-direction: row;
					align-items: flex-start;
					/*  modify by peggy 20241023  */
					margin: 58.5px -5px 0px;
					padding: 0;
				}
					.center_contentBg .form_list.button .button  {
						width: 50%;
						box-sizing: border-box;
						padding: 0px 5px;
					}
						.center_contentBg .form_list.button .button input {
							width: 100%;
						}
						.center_contentBg .form_list.button .button input[type="reset"] {
							background-color: #ffffff;
							color: var(--second_color);
							border: 1px solid var(--second_color);
						}
						.center_contentBg .form_list.button .button input[type="submit"] {
							background-color: var(--primary_color);
							color: #000;
						}


@media (max-width: 1079px){

	.center_contentBg{
		border-top-right-radius: 0;
	}
}
				
@media (max-width: 920px){

	.center_contentBg .box_listBg{
		margin: 10px auto 0px;
	}

		.box_list{
			width: 100%;
			padding: 0px;
		}
}


@media (max-width: 524px){

	.center_contentBg {
		padding: 17.5px 17.5px;
	}

		.center_contentBg .form_list .title{
			font-size: 13px;
    		line-height: 17px;
		}

		.center_contentBg .form_list.phone .title,
		.center_contentBg .form_list.address .title  {
			position: static;
			left: unset;
			top: unset;
			-webkit-transform: unset;
			transform: unset;
		}

		.form_listArea .form_list .content {
			padding: 0px 0px 0px 75px;
			font-size: 13px;
			line-height: 17px;
			word-break: break-all;
		}

		.center_contentBg .form_list.phone .content,
		.center_contentBg .form_list.address .content {
			padding-left: 0;
		}


		.center_contentBg .home .address .address_select select {
			width: 30%;
		}
		.center_contentBg .home .address .address_select input {
			width: 32%;
		}



	.center_contentBg .form_list.button {
		margin: 20px -5px 0px;
	}

}

