

/*-------表單區----------------------------------------------------------------------------*/
/*表單區底*/
.form_area_bg {
	width: 100%;
    max-width: 800px; 
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0px 20px;
}

	/*表單區備註*/
	.form_remark {
		/* font-size:15px;
		line-height:22px;
		padding:10px 0px 5px 0px; */

        font-size: clamp(0.8750rem, 0.8333vw, 1.0000rem); /* 字體 最小值 14.00px、大小約 0.8333vw、最大值 16.00px */
        line-height: 1.4;
	}

	/* 表單標題 */
	.form_title{
		font-weight: 700;
		/* text-align:center; */
		/* font-size:18px; */
		font-size: clamp(1.1250rem, 1.0417vw, 1.2500rem); /* 字體 最小值 18.00px、大小約 1.0417vw、最大值 20.00px */
		color: var(--seventh_color);
		margin-bottom:1.25rem; /*20px*/
	}
		.form_title strong{
			font-weight: inherit;
			font-size:inherit;
			color: inherit;
		}
		.form_title .title_line{
			position: relative;
			width: 100%;
		}
		.form_title  .title_line::after{
			position: absolute;
			content: "";
			display: block;
			width: calc(100% -  1.25rem - 5px); /* 让底边框宽度占元素宽度的 15% */
			border-bottom: 1px solid var(--seventh_color);
			/* left:50%; */
			/* transform: translateX(-50%); */
			bottom:-10px;
		}
	
		/* 小圖標 */
		.form_title   .title_line .icon-left,
		.form_title   .title_line .icon-right {
			position: absolute;
			width: 1.25rem; /*20px*/
			aspect-ratio: 1;
			/* height: 20px; */
			background-image: url(../../../images/lighticon_grey.svg);
			/* background-image: url(../../images/lighticon_grey.svg); */
			background-size: contain;
			background-repeat: no-repeat;
			bottom: -18px;
			background-size: 20px;
		}

		/* 左圖標 */
		/* .form_title .title_line .icon-left {
			left: calc(50% - 7.5% - 25px);
		} */

		/* 右圖標 */
		.form_title .title_line .icon-right {
			/* right: calc(50% - 7.5% - 25px); */
			right: 0;
		}
		.form_title .title_en{
			font-family: var(--foreign_foreign);
			color: var(--fourth_color);
			/* text-align: center; */
			padding-top: 20px;
			font-size: clamp(0.8571rem, 0.8333vw, 1.0000rem); /* 字體 最小值 13.71px、大小約 0.8333vw、最大值 16.00px */
		}
		





		/*必填icon*/
		.requirde_icon {
			display:inline-block;
			/* border-radius:3px; */
			font-size:inherit;
			color: var(--notice_color);
			/* background:var(--notice_color); */
			line-height:1.4;
			padding:0px 5px;
		}

	/*表單區*/
	.form_area {
		display: flex;
		flex-flow:row wrap;
		vertical-align: top;
		justify-content:flex-end;
		align-content: flex-start;
		/* padding-bottom: 40px; */
	}
		/*表單區左*/
		/* .form_left {
			width:48%;
			float:left;
		} */
		/*表單區右*/
		/* .form_right {
			width:48%;
			float:right;
		}	 */
		.form_listArea{
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			gap: 0.9375rem; /*15px*/
		}

			.form_listArea .form_content{
				display: inherit;
				flex-wrap: inherit;
				justify-content: inherit;
				gap: inherit;
			}
			.form_listArea .form_content.column{
				flex-direction: column;
			}

			.form_list {
				/* font-size: 15px; */
				/* line-height: 21px; */
				/* padding: 12px 0px 0px 0px; */
				display: flex;
				flex-direction: column;
				line-height: 1.4;
				gap: .3125rem; /*5px*/
				font-size: clamp(1.0000rem, 0.9375vw, 1.1250rem); /* 字體 最小值 16.00px、大小約 0.9375vw、最大值 18.00px */
				color: var(--dark_color);
				width: 100%;
			}

				.form_list input[type="text"],
				.form_list input[type="password"],
				.form_list input[type="email"], 
				.form_list input[type="tel"], 
				.form_list input[type="date"], 
				.form_list textarea {
					background: #fff0;
					border: unset;
					border-bottom: 1px solid var(--dark_color);
					font-size: inherit;
					border-radius: 0;
				}
				
				.form_list select {
					/* background-color: #F4F4F4; */
					border: unset;
					padding: 11px 0px 6px 7px;
					/* background-image: url("../../../images/select_arrow.png"); */
					background-image: url("../../../images/select_arrow_gray.png");
					background-size: 20px;
					background-position: calc(100% - 0px) 60%;
					width: 100%;
					border-bottom: 1px #000000 solid;
					font-size: inherit;
					border-radius: 0;
				}

				.form_list select:disabled {
					background-color: #fff;
					border: 1px solid #cecece;
				}

				.form_list input:disabled {
					background-color: #fff;
					color: #b0b0b0;
					border: 1px solid var(--fourth_color);
					background: #F4F4F4;
				}

				.form_list input[type="button"]:disabled ,
				.form_list input[type="submit"]:disabled ,
				.form_list input[type="reset"]:disabled   {
					color: rgba(255 255 255 / 60%) !important;
					background-color: var(--sixth_color) !important;
					border-color: var(--sixth_color) !important;
					cursor: default;
				}	
				.form_list input[type="button"]:disabled:hover ,
				.form_list input[type="submit"]:disabled:hover ,
				.form_list input[type="reset"]:disabled:hover   {
					opacity: 1;
					cursor: default;
				}	

				.form_list textarea{
					/* border: unset; */
					/* background: #F4F4F4; */
				}
			

				.fL_tit {
					font-weight:600;
					/* padding:3px 0px 6px 0px; */
					position:relative;
					padding: 0;
                    line-height: inherit; 
                    font-size: inherit; 
				}
					/*必填icon*/
					.fL_tit .requirde_icon {
						/* position:absolute; */
						/* right:0px; */
					}
				.fL_info {
					/* padding:0px 0px 9px 0px; */
					/* padding:0px 0px 17px 0px; */
					min-height: 42px;
				}

				
				.fL_info a{
					color: inherit;
                    color: #fff;
				}
					
				.form_list.fLType2 {
					/*width: calc((100% / 2) - 0.9375rem);*/ /*15px*/
					width: calc((100% - 0.9375rem) / 2 ); /*15px*/
				}

				.fL_info.captcha{
					display: inline-flex;
					align-items: center;
					gap: 10px; /*0.625rem*/
					width: fit-content;

					flex-wrap: wrap;
				}
				.fL_info.captcha .notice{
					font-size: inherit;
    				color:var(--notice_color);
				}

				/*fL_info 生日*/
				.fL_info.special{
					padding: 0 0 20px;
					display: flex;
					justify-content: space-between;
				}
				.fL_info.special2{
					padding: 0 0 20px;

					/* modify by pekey 20240721 */
					position: relative;
					padding-right: 50px;
					box-sizing: border-box;
				}
					.fL_info.special2 button[type="button"]{
						position: absolute;
    					right: 7px;
					}


				.fL_info.special input:disabled{
					width:110px;
					
				}

				/*fL_info 手機號碼*/
				.fL_info.phone{
					display: flex;
					align-items: center;
					justify-content: space-between;
				}
				
				.fL_info.phone input{
					width: 100%;
				}			

					/*沒有輸入框時*/
					.fL_info.no_input {
						padding: 10px 0px 25px 0px;
    					line-height: 24px;
					}
					
					.fL_info label {
						display:inline-block;
						line-height: 42px;
					}
					
					



					
					/*生日樣式*/
					.fL_info.birthday {
					}
						.fL_info.birthday select {
							width: auto;
							margin: 0px;
							height: 42px;
    						line-height: 42px;
							padding: 0px 15px;
						}
						



					/*地址樣式-----------------------*/
					.fL_info.address {
						display: grid;
						grid-template-columns: repeat(3 , 100px) auto;
						gap: .625rem; /*10px*/
					}
						.fL_info.address select{
							width: auto;
						}
						.fL_info.address input{
						}	
						.fL_info.address input:last-of-type{

						}			
						/* .fL_info.address input:last-of-type{
							grid-column-start: 1;
							grid-column-end: 4;
						}				 */









					/*上傳樣式---------------------------*/
					.fileUploaded {
						margin: 5px 0 0;
						display: block;
					}
					
					.fileUploaded a {
						font-size: 15px;
						line-height: 1.1;
						text-decoration: none;
						display: inline-block;
						color: #005f99;
					}
					
					.inputFile {
						position: relative;
						/* border-bottom: solid 1px #000; */
						background: #fff;
						border-radius: 0;
						padding: 0px 90px 0px 0px;
						/* margin: 0px 0px 17px; */
						/* padding: 0; */
						width: 100%;
					}
					
					.inputFile input[type='text'] {
						border: none;
						background: none;
						height: auto;
						line-height: 42px;
						border-bottom: solid 1px #000;
					}
					
					.inputFile label {
						position: absolute;
						/* top: -6px; */
						top: 0;
						left: 0px;
						width: 100%;
						text-align: right;
						margin: 0;
					}
					
					.inputFile label div {
						background: var(--secondary_color);
						color: #fff;
						font-size: 15px;
						font-size: inherit;
						line-height: 42px;
						text-align: center;
						width: 80px;
						display: inline-block;
						transition: 0.3s ease all;
						border-top-right-radius: 3px;
						border-bottom-right-radius: 3px;
						border-radius:  25px;
						/* margin-bottom: 5px; */
					}
					
					.inputFile input[type='file'] {
						display: none;
					}
					.inputFile label:hover div {
						background: var(--primary_color);
					}
						/*檔案已上傳*/
						.uploaded{		
							color: var(--notice_color);				
						}
							.uploaded a {
								display: block;
								text-decoration: none;
								color: inherit;		
								padding: 0;					
							}
							.uploaded a:hover {
								opacity: 0.5;					
							}
					
					


						/*同意核選*/
						.agreeToTerms{
							display: flex;
							/* align-items: center; */
							flex-direction: column;
							gap: 0.9375rem; /*15px*/
							color: var(--dark_color);
							font-size: inherit;
							font-weight: inherit;
							font-size: clamp(1rem, 0.9375vw, 1.125rem); /* 字體 最小值 16px、大小約 0.9375vw、最大值 18px */
						}
							.agreeToTerms .red{
								color: var(--notice_color);
							}
							.agreeToTerms_item{
								color: inherit;
								display: inline-flex;
								align-items: center;
								gap: .3125rem; /*5px*/
							}
								.agreeToTerms label{
									font-size: inherit;
									font-weight: inherit;
									display: flex;
									flex-direction: column;
									align-items: unset;
									gap: .3125rem;
								}
								.agreeToTerms input{
									font-size: inherit;
									font-weight: inherit;
								}

									.agreeToTerms span{
										display: block;
										letter-spacing: 0;
										font-size: clamp(0.7778rem, 0.7292vw, 0.8750rem); /* 字體 最小值 12.44px、大小約 0.7292vw、最大值 14.00px */
									}



/* 在螢幕放大150%且寬度大於991時，套用這裡的特定樣式 */
@media screen and (min-width: 991px) and (min-height: 600px) and (max-height: 700px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 150/100){

	/* .form_list {
		font-size: calc(15px / var(--magnification150));
		line-height: normal;
	}
		.fL_info {
			min-height: calc(42px / var(--magnification150));
		}

		.form_list select {
			padding: calc(11px / var(--magnification150)) 0px calc(6px / var(--magnification150)) calc(7px / var(--magnification150));
		}

		.captcha img {
			width: calc(72px / var(--magnification150));
		} */

}

@media (max-width: 900px){
	/* .form_area_bg {
		padding:0px;
	} */
}
	

@media (max-width: 900px){
	/*表單區左*//*表單區右*/
	/* .form_left, .form_right {
		float:none;
		width:auto;
	} */

	.form_list.fLType2 {
		width: 100%;
	}

		/*沒有輸入框時*/
		.fL_info.no_input {
			padding: 0px 0px 5px 0px;
		}
		.fL_info label {
			padding: 6px 0px;
		}


		/*地址樣式-----------------------*/
		.fL_info.address {
			grid-template-columns: repeat(3 , 1fr) auto;
		}
			.fL_info.address input:last-of-type{
				grid-column-start: 1;
				grid-column-end: 4;
			}

}
	@media (max-width: 575px){
		.cart_big_tit span.red {
			padding:0px;
		}
	}
		@media (max-width: 500px){
			.cBT_checkbox {
				display: block;
				padding: 5px 0px 0px 0px;
			}
			.receiving_record {
				padding:0px;
			}
		}
			@media (max-width: 320px){
				/*生日樣式*/
				.fL_info.birthday {
					letter-spacing: 0px;
					white-space: nowrap;
					font-size: 12px;
				}
			}
				
			


	.form_list_remark {
		/* font-size: 15px;
		line-height: 21px;
		color: #c13e42;
		padding: 12px 0px 0px 0px; */
	}














    
/*//////////////////////////////////////////////////////*/
/*------- 會員密碼_眼睛 --------*/
/*//////////////////////////////////////////////////////*/

/* 登入_密碼 */
.form_list.password{
}
.form_list.password .fL_info{
	position: relative;							
}
	.form_list.password input{
		padding-right: 2.8125rem; /*45px*/
	}
	
		/*閉眼*/
		.form_list.password i#check_eye ,
		.form_list.password i#check_eye2{
			position: absolute;
			color: var(--dark_color);
			font-size: 1.25rem; /*20px*/
			top: 50%;
			right: .625rem; /*10px*/
			-webkit-transform: translate(0, -50%);
			transform: translate(0, -50%);	
			transition: 0.3s ease all;	
			cursor: pointer;
		}
		/* .form_list.password .eye:before{
			position: absolute;
			transition: 0.3s ease all;
			font-family: 'Bootstrap-icons';
			content: '\F33F';
			color: #333;
			font-size: 20px;
			top: 50%;
			right: 10px;
			-webkit-transform: translate(0, -50%);
			transform: translate(0, -50%);									
		} */
		/*開眼*/
		/* .form_list.password.active .eye:before{
			content: '\F33E';
		} */


/* 在螢幕放大150%且寬度大於991時，套用這裡的特定樣式 */
@media screen and (min-width: 991px) and (min-height: 600px) and (max-height: 700px) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 150/100){

	/*閉眼*/
	/* .form_list.password i#check_eye ,
	.form_list.password i#check_eye2{
		font-size: calc(20px / var(--magnification150));
	} */

}












.pageContent ,
.right_contentBg{
    min-height: unset;
}


.pageContent_in{
    margin: 0 auto;	
    padding: 0;
}







/* ==================忘記密碼css===================== */

.form_listBg.member_login.member_forget {
	display: block;
	/* padding: 0px 40px 60px; */
}
	.form_listBg.member_login.member_forget .form_listArea {
		margin: 0 auto;
		padding: 1.25rem 1.5625rem; /*20px 25px*/
    	max-width: 35.625rem; /* 570px */
		border: 0.05em solid #e8e8e8;
	    box-shadow: 0 3px 10px 0 rgb(0 0 0 / 10%);
	}
	.form_listBg .form_listArea{
		/* width: 50%; */
		/* padding: 0 50px; */
		/* padding: 0 2.6vw; */
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		gap: .9375rem; /*15px*/
	}

	.form_title {
		text-align: center;
		margin-bottom: 0;
	}


		.form_listBg.member_login.member_forget .loginButton {
			/* padding: 25px 0px 0px; */
		}
            .form_listBg.member_login.member_forget .loginButton input{
                width: 100%;
                background-color: var(--primary_color);
                color: #fff;
                border-radius: unset;
                /* font-size: 15px; */
                font-weight: 700;
                border-radius: 100px;
                font-size: inherit;
            }



			.form_listBg.member_login.member_forget .fL_info input[type="date"] {
				/* width: 290px; */
				max-width: 100%;
				/* background-color: #F4F4F4; */
				/* border: unset; */
			}

			.form_listBg.member_login.member_forget .fL_info label {
				padding: 0;
			}


					/*地址樣式-----------------------*/
					.fL_info.address {
						/* display: grid;*/
						grid-template-columns: repeat(3 , 1fr) auto; 
					}
						/* .fL_info.address select{
							width: auto;
						}
						.fL_info.address input{
						}	 */
						.fL_info.address input:last-of-type{
							grid-column-start: 1;
							grid-column-end: 4;
						}



@media (max-width: 1024px) {
	.form_listBg.member_login.member_forget {
		display: block;
		/* padding: 0px 0px 60px; */
	}
}

@media (max-width: 990px) {

    .pageContent {
        padding: 30px 0 ;
    }

		.form_listBg.member_login.member_forget .form_listArea {
			padding: 15px 10px;
		}
}

@media (max-width: 641px){
	.form_listBg.member_login.member_forget .form_listArea {
		width: 100%;
	}
}



















/*/////////////////////////////////////////////////////////*/
/*-------會員忘記密碼--------*/
/*/////////////////////////////////////////////////////////*/


/* 裝飾區塊 */
.form_listBg .deco_bg{
	/* padding: 10px 0px 15px; */
	width: 100%;
}
	.form_listBg .deco_bg .content{
		display: flex;
		-webkit-box-align: center;
		-webkit-align-items: center;
		-moz-box-align: center;
		-ms-flex-align: center;
		align-items: center
	}
		.form_listBg .deco_bg .deco_line{
			flex: 1;
			-webkit-box-flex: 1;
			-webkit-flex: 1;
			-moz-box-flex: 1;
			-ms-flex: 1;

			background-color: var(--sixth_color);
			width: 100%;
			height: 0.05em;
		}
	
		.form_listBg .deco_bg .deco_text{
			color: var(--sixth_color);
			font-size:  clamp(0.8125rem, 0.7292vw, 0.8750rem); /* 字體 最小值 13px、大小約 0.7292vw、最大值 14px */
			padding: 0px 10px;
		}	








/* 其他功能區塊 */
.form_listBg .other_bg{
	padding: 0px;
	text-align: center;
	width: 100%;
}
	.form_listBg .other_bg .content {
		margin: 0px -3px;

		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		align-items: flex-start;
	}
		.form_listBg .other_bg .content .other_list{
			position: relative;

			width: 50%;
			padding: 0px 3px;
			box-sizing: border-box;
		}
			.form_listBg .other_bg .content .other_list:nth-of-type(2):before{
				position: absolute;
				left: -0.5px;

				content:'';
				background-color: #ccc;
				width: 0.05em;
				height: 23px;
			}

			.form_listBg .other_bg .content .other_list a{
				display: block;
				color:  var(--dark_color);
				font-size:  13px;
				padding: 5px 15px;
				transition: 0.2s ease all;
				text-decoration: none;
			}
			.form_listBg .other_bg .content .other_list a:hover{
				color: #305572;
			}

@media(max-width:465px){
	.form_listBg .form_area .form_list > [type="text"] {
		width: 71%;
	}
}

@media(max-width:425px){
	.form_listBg .form_area .form_list > [type="text"] {
		width: 68%;
	}
}

@media (max-width: 414px){
	.form_listBg .form_area .form_list > [type="text"] {
		width: 67%;
	}			
}















.right_title {
    text-align:center
}