@import url('../style_about/style_team.css');


.staffList .staffList_in:hover {
	opacity: 0.7;
	cursor: pointer;

}

.staffList .staffList_in .staffImg img:hover {

	cursor: pointer;

}


/*/////////////////////////////////////////////////////////*/
/*-------系上成員--------*/
/*/////////////////////////////////////////////////////////*/


/*.TeacherArea{
}
	
	.teacherListTit{
		font-size:20px;
		color:#84bf24;
		line-height:30px;
		margin:30px 0px 20px;
	}
		.teacherListTit i{
			font-size: 20px;
			color: #84bf24;
			line-height: 30px;
			vertical-align: -7%;
		}*/

.teacher_list_area {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	/* justify-content: space-between;
			margin-bottom:-30px; */
	/* margin: 0 -15px 0px; */
	align-items: center;
	display: grid;
	grid-template-columns: repeat(2 , 1fr);
	gap: clamp(0.8065rem, 1.3021vw, 1.5625rem); /* 12.90px , 1.3021vw , 25.00px */
}

.teacher_list {
	padding: 0;
	box-sizing: border-box;
	/* width: 33.3%; */
	/* width: 50%; */
}

.teacherListBorder {
	/* box-shadow: 0px 1px 5px 1px rgba(0, 0, 0, 0.2); */
	padding: 15px;
	height: 100%;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.teacher_list_in {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: center;
	/* justify-content: space-between; */
}

.tL_img {
	/* width: 190px; */
	/* width: 40%; */
	box-sizing: border-box;
	/*width:25%;
					box-sizing: border-box;
					position:relative;
					padding-top:25%;*/
}

.tL_img a,
.tL_img>p {
	display: block;
	position: relative;
	/* padding-top: 100%; */
	aspect-ratio: 17 / 23;
}

.tL_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    float: none;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    transition: 0.3s ease all;
}

.tL_img a:hover img {
	opacity: 0.5;
	transition: all 0.3s ease-out;
}



/*右半邊*/
.tL_right {
	/* width: 60%; */
	/* padding-left: 20px; */
	/* padding-left: clamp(.625rem, 1.0417vw, 1.25rem); */
	/* box-sizing: border-box; */
	/* font-family: "新細明體"; */
	/* line-height: 22px; */
	/* line-height: clamp(.6875rem, 1.1458vw, 1.375rem); */
	/* display: flex; */
	/* flex-direction: column; */
	/* gap: 10px; */
}

/*標題*/
.tLR_tit {
	font-size: 1rem;
	color: var(--primary_color);
	padding-bottom: 5px;
	padding-bottom: 0;
	display: flex;
	/* gap: 10px; */
}

.tLR_tit_left {
	/* font-family: var(--foreign_font); */
	padding-bottom: 0;
}

.tLR_tit_right {
	/* padding-left: 20px; */
}
.tLR_tit_right a{
	display: block;
	color: var(--dark_color);
	text-decoration: none;
}

.tLR_tit span {
	color: var(--dark_color);
	/* font-size: 12px; */
	word-wrap: break-word;
	font-family: var(--foreign_font);
}

.tLR_tit span a {
	/* color: #2e2e2e; */
	text-decoration: none;
	display: inline-block;

}

.tLR_tit span a:hover {
	/* color: #5f4f98; */
}

.tLR_btn {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	font-size: clamp( .875rem, 2.1333vw, 1rem );
	color: var(--primary_color);
}

.tLR_btn i {
	font-size: 1rem;
}

@media (max-width: 1280px) {

	.teacher_list_area {
		/* margin: 0 -10px -20px; */
	}

	.teacher_list {
		/* padding: 0 10px 20px; */
		/* width: 50%; */
	}

	.tL_img {
		/* width: 35%; */
	}

	/*右半邊*/
	.tL_right {
		/* width: 65%; */
	}

}


@media (max-width:1100px) {

	.teacher_list {
		/* width: 100%; */
	}
}



@media (max-width: 768px) {
    .teacher_list_area {
        display: flex;
        flex-wrap: unset;
        flex-direction: column;
        justify-content: unset;
    }
}




@media (max-width: 510px) {
	.teacher_list_area {
		/* display: block;
		flex-wrap: unset;
		flex-direction: unset;
		justify-content: unset; */
		/*margin-bottom:-30px;*/
	}


	.teacherListBorder {
		/* height: auto; */
	}

	.teacher_list_in {
		/* display: block;
		flex-wrap: unset;
		flex-direction: unset;
		align-items: unset; */
	}

	.tL_img {
		/* width: 100%; */
	}


	/*右半邊*/
	.tL_right {
		/* width: 100%;
		padding: 20px 0px 0px; */
	}

	.tLR_tit {
		/* overflow: unset;
		text-overflow: unset;
		white-space: unset; */
	}

}


.mentor_bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
	gap: 20px;
}

.mentorImg {
	width: 19%;
}

.mentorImg span {
	display: block;
	position: relative;
	padding-top: 135.9%;
}

.mentorImg span img {
	width: 100%;
	height: auto;
	transition: all 0.3s ease-out;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	float: none;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	transition: all 0.3s ease-out;

}

.mentor_list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: flex-start;
	justify-content: center;
	width: 80%;
}

.mentor_section {
	border-bottom: dotted 2px var(--primary_color);
	width: 100%;
	padding-bottom: 10px;
}

.mentor_section a {
	text-decoration: none;
	color: #333;

}

.mentor_section a:hover {
	opacity: 0.7;
	transition: all 0.3s ease;

}

@media(max-width:1100px) {
	.mentor_bottom {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 10px;
		gap: 10px;
	}

	.mentorImg {
		width: 100%;
	}

	.mentor_list {
		display: flex;
		flex-direction: column;
		gap: 10px;
		align-items: flex-start;
		justify-content: center;
		width: 100%;
	}
}

/* ================================================================= */
/* 教授頁面filter  css */
/* ================================================================= */

    .professor_filter_area{
        border-radius: .9375rem; /*15*/
        padding:clamp(0.8065rem, 1.3021vw, 1.5625rem); /* 12.90px , 1.3021vw , 25.00px */
        box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
		margin-bottom: clamp( .7813rem, 3.3333vw, 1.5625rem);
    }

        .professor_filter_area .form_area{
            row-gap: clamp(0.8065rem, 1.3021vw, 1.5625rem); /* 12.90px , 1.3021vw , 25.00px */
        }

            .professor_filter_area .fL_tit{
                cursor: pointer;
            }
             .professor_filter_area .fL_tit:hover{
                opacity: 0.7;
            }
                .professor_filter_area .fL_tit i{
                    color: inherit;  
                    font-size: inherit;  
                }
				/* 20250806預設選單全部打開 */
                .professor_filter_area .fL_info{
                    display: flex;
                }
                /* 第一個選單固定打開 */
                /* .form_area .form_list:nth-child(1) .fL_info{
                    display: flex;
                } */

@media (max-width: 990px){

     .professor_filter_area .item_RadioCheckArea {
        flex-direction: row;
    }

}

/*-------表單區----------------------------------------------------------------------------*/
/*表單區底*/
.form_area_bg {
	width: 100%;
    max-width: 800px; 
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0px 20px;
}
	@media (max-width: 800px){
		.form_area_bg {
			padding:0px;
		}
	}
	
	/*表單區備註*/
	.form_remark {
		/*text-align:center;*/
		/*font-size:15px;*/
		font-size:1rem;
		line-height:1.5;
		padding:10px 0px 25px 0px;
	}
		/*必填icon*/
		.requirde_icon {
			display:inline-block;
			/*border-radius:3px;*/
			font-size:1.125rem;
			/*color:#fff;
			background:#c13e42;*/
			line-height:1;
			/*padding:0px 5px;*/
			color: #fbb129;
			background: #ffffff00;
			/*position: unset;
			right: inherit;*/
			padding: 0px;
		}

	/*表單區*/
	.form_area {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		vertical-align: top;
		justify-content: space-between;
		align-content: flex-start;
		gap:  0.9375rem /*15px*/;
	}
		/*表單區左*/
		.form_left {
			width:48%;
			float:left;
		}
		/*表單區右*/
		.form_right {
			width:48%;
			float:right;
		}
			.form_list {
				box-sizing:border-box;
				font-size:0.9375rem;
				line-height:1.4;
				width:100%;
				/*border-bottom: dotted 1px #0f0f0f;*/
				/*padding:12px 0px 0px 0px;*/
				display: flex;
				flex-direction: column;
				gap: 0.6250rem; /*10*/
			}
			.form_list.fLType2{
				width:49%;
			}
			
			
				.fL_tit {
					font-weight: 700;
					font-size: 1.125rem;
					/* font-weight: bold; */
					padding: 0;
					position:relative;
				}
					/*必填icon*/
					.fL_tit .requirde_icon {
						/*position:absolute;
						right:0px;*/
					}
					.fL_tit label {
						font-size: 0.875rem;
						vertical-align: middle;
					}
					.fL_tit label input[type="radio"], input[type="checkbox"]  {
						vertical-align: baseline;
					}					
					
					
				.fL_info {
					/* padding:0px 0px 9px 0px; */
					padding: 0;
				}
					.fL_info input ,
					.fL_info textarea{
						border-color: #e6e6e600;
						background-color: rgb(254 237 215 / 0.6);
					}

					
					.fL_info select{
						width:100%;						
						/*width: auto;
						margin: 0px 0px 0px 0px;*/
						border: solid 1px #aeaeae00;
						background-color: rgb(254 237 215 / 0.6);
					}
					
				
					/*沒有輸入框時*/
					.fL_info.no_input {
						padding: 10px 0px 25px 0px;
    					line-height:1.5;
						font-size: 1rem;
						color: #8e8e8e;
					}
					
					.fL_info label {
						display:inline-block;
					}
					
					/*地址樣式*/
					.fL_info.address{
						position: relative;
						padding-left: 320px;
					}
						.fL_info.address select {
							width: 75px;
							height: 42px;
							position: absolute;
							left: 0px;
						}
						.fL_info.address select:nth-of-type(2) {
							left:80px;
						}	
						.fL_info.address select:nth-of-type(3) {
							left:160px;
						}				
						.fL_info.address > input[type='text'] {
							position: absolute;
							width:75px;
							left:240px;
						}
						.fL_info.address div{
						}
						.fL_info.address div > input[type='text']{
						}
					
					
					
					/*地址樣式*/
					.fL_info.country{
					}
					
					.fL_info.country div{
						position: relative;
						padding-left: 80px;
					}     
						
						.fL_info.country select{
							position: absolute;
							width:75px;
							left:0px;
						}     
						
						.fL_info.country input{
						}					
					       
					
					
					
					
					
					
					
					
					
					
					
					/*生日樣式*/
					.fL_info.birthday {
					}
						.fL_info.birthday select {
							width: auto;
							margin: 0px 0px 0px 0px;
							border: solid 1px #aeaeae00;
							background-color: rgb(254 237 215 / 0.6);
						}
						
						
						
						
				.find_out_area{
					padding: 0px 0px 17px 0px;
					display: flex;
					flex-direction: row;
					flex-wrap: wrap;
					vertical-align: top;
					/* justify-content: space-between; */
					align-content: flex-start;
				}
					.find_out{
						padding: 0px 10px 0px 0px;
					}
					.find_out label{
					}
						.find_out input[type="checkbox"]{
						}
	



			/*檔案上傳樣式*/
			.inputFile {
				position:relative;
				border: solid 1px #aeaeae;
				background:#fff;
				border-radius: 3px;
				padding:0px 80px 0px 0px;
				margin: 0px 0px 17px;
			}
				.inputFile input[type='text'] {
					border:none;
					background:none;
				}
				.inputFile label {
					position: absolute;
					top: 0px;
					left:0px;
					width:100%;
					text-align:right;
				}
					.inputFile label div {
						background: #2b286a;
						color: #fff;
						font-size: 0.9375rem;
						line-height: 42px;
						text-align:center;
						width:80px;
						display: inline-block;
						transition:0.3s ease all;
					}
						.inputFile label:hover div {
							background: #ca0000;
						}
				.inputFile input[type='file'] {
					display:none;
				}
				
				


						
				/*多選----------------------------*/		
				.find_out_area{
					padding: 0px 0px 17px 0px;
					display: flex;
					flex-direction: row;
					flex-wrap: wrap;
					vertical-align: top;
					/* justify-content: space-between; */
					align-content: flex-start;
				}
					.find_out{
						padding: 0px 10px 0px 0px;
					}
					.find_out label{
					}
						.find_out input[type="checkbox"]{
						}
	
						
				/*同意條款*/
				.agreeToTerms {
					font-size:0.9375rem;
					line-height:1.53;
					text-align:center; 
					margin: 20px 0px 0px;
				}
					.agreeToTerms strong {
						padding:10px 0px;
						display:inline-block;
					}
					.agreeToTerms a {
						color:#d7261a;
						text-decoration:none;
					}	
					.agreeToTerms a:hover {
						opacity:0.5;
					}					
					
				
				.agreeArea{
				}	
				.text_area.agreeArea {
					text-align: left;
					height: 200px;
					border-radius: 3px;
					border: solid 1px #aeaeae;
					overflow-y: auto;
					word-break: break-word;
					padding: 10px;
				}	
					
					
					
					
					
					
				/*徵信*/
				/*.fL_info.Credit{
				}*/
				.fL_info.no_input span.CreditList{
					padding-right:5px;
				}                                       
				.fL_info.no_input span.CreditList input[type="text"]{
					width: 150px;
					height: 20px;
					line-height: 20px;
				}                          
					
					
					
					
					
						@media (max-width: 990px){					
						
							/*地址樣式*/
							.fL_info.address{
								position: relative;
								padding-left: 280px;
							}
								.fL_info.address select {
									width: 65px;
								}
								.fL_info.address select:nth-of-type(2) {
									left: 70px;
								}	
								.fL_info.address select:nth-of-type(3) {
									left: 140px;
								}				
								.fL_info.address > input[type='text'] {
									position: absolute;
									width:65px;
									left: 210px;
								}					

						}
						
						
						@media (max-width: 800px){
							/*表單區左*//*表單區右*/
							.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;
								}
								
								.inputFile label {
									top: -6px;
								}
								
								
						}
							@media (max-width: 575px){
								.cart_big_tit span.red {
									padding:0px;
								}
									/*地址樣式*/
									.fL_info.address{
										position: static;
										padding-left: 0px;
										display: flex;
										flex-wrap: wrap;
										flex-direction: row;
										align-items: flex-start;
										justify-content: space-between;
									}
										.fL_info.address select {
											width: 24%;
											height: 42px;
											position: static;
											left: inherit;
										}
										.fL_info.address select:nth-of-type(2) ,
										.fL_info.address select:nth-of-type(3) {
											left:inherit;
										}					
										.fL_info.address > input[type='text'] {
											position: static;
											width: 24%;
											left: inherit;
										}
										.fL_info.address div{
											margin-top: 6px;
											width: 100%;
										}	
							}
								@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: 0.9375rem;
				line-height: 1.4;
				color: #c13e42;
				padding: 12px 0px 0px 0px;
			}











/*========================================================*/
/*-------單選radio和複選Check父層樣式--------*/
/*========================================================*/

.item_RadioCheckArea {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem 0.9375rem;
  /* margin-top: 12px; */
}

/* 附加item_RadioCheckColumn為垂直 */
.item_RadioCheckColumn{
  flex-direction: column;
  align-items: unset;
}
/* 附加item_RadioCheckColumnIn為內部垂直 */
.item_RadioCheckColumnIn{

}




/*============================*/
/*-------複選checkbox樣式--------*/
/*============================*/


    /* .item_CheckArea {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 12px 15px;
      margin-top: 12px;
    } */
    
    /* .item_Check_list  */
    .item_RadioCheckArea .item_Check_list{
      display: inline-flex ;
      align-items: center;
      cursor: pointer;
      gap: 0.4375rem;
    }
    
    /* .item_CheckArea .item_Check_list {
      display: inline-flex;
    } */
    .item_RadioCheckColumn .item_Check_list {
      align-items: unset;
    }
    
    .item_Check_list .item_check {
      position: absolute;
      opacity: 0;
    }
    
    .item_Check_list .custom-check {
      width: 1.25rem;
      aspect-ratio: 1;
      border-radius: 0.25rem; /* 圓角矩形 */
      border: 1px solid #c0c0c0;
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    
    .item_Check_list .custom-check .check-mark {
      width: 0.5rem; /* 勾選標記的寬度 */
      /* height: 8px; */
	  aspect-ratio: 1;
      border-radius: 0.125rem;
      /* width: 12px; 
      height: 12px; */
      background-color: transparent;
      /*clip-path: polygon(14% 44%, 0 28%, 50% 82%, 100% 0, 86% 14%, 50% 60%);  *//* 使用clip-path創建勾選標記 */
      transition: background-color 0.2s ease;
    }
    
    .item_Check_list .item_check:checked + .custom-check {
      border-color: var(--primary_color);
    }
    
    .item_Check_list .item_check:checked + .custom-check .check-mark {
      background-color: var(--primary_color);
    }
    
    .item_Check_list .check-text {
      font-size: inherit; /* 文字大小 */
      color: inherit;     /* 文字颜色 */
    }
    


/*============================*/
/*-------單選radio樣式--------*/
/*============================*/

.item_RadioCheckArea .item_Radio_list {
  display: inline-flex;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  gap: .4375rem;
}
/* 附加item_RadioCheckColumnIn為內部垂直 */
.item_RadioCheckColumnIn .item_Radio_list{
  flex-direction: column;
  text-align: center;
  gap: .1875rem;
  min-width: 5.3125rem;
}

  .item_Radio_list .item_radio {
    /*display: none;*/
    position: absolute;
    opacity: 0;
  }
  .item_Radio_list .custom-radio {
    width: 1.25rem;
	aspect-ratio: 1;
    /* height: 20px; */
    border-radius: 50%;
    border: 1px solid #c0c0c0;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }
    .item_Radio_list .custom-radio .inner-circle {
      width: .5rem;  /* 小圓圈的直徑 */
      aspect-ratio: 1;
      border-radius: 50%;
      background-color: transparent;
      transition: background-color 0.2s ease;
    }
    .item_Radio_list  .item_radio:checked + .custom-radio{
      border-color: var(--primary_color);
    }
    .item_Radio_list  .item_radio:checked + .custom-radio .inner-circle {
      background-color: var(--primary_color);
    }
    .item_Radio_list  .radio-text {
      font-size: inherit; /* 文字大小 */
      color: inherit;     /* 文字颜色 */
    }




@media (max-width: 900px) {

/*-------單選radio和複選Check父層樣式--------*/
.item_RadioCheckArea {
  /* margin-top: 5px; */
  flex-direction: column;
  align-items: unset;
  gap: .625rem .9375rem;
}


  /*-------複選Check樣式--------*/
  .item_RadioCheckArea .item_Check_list {
    padding: 0;
  }
  /*-------單選radio樣式--------*/
  .item_RadioCheckArea .item_Radio_list {
    padding: 0;
  }

  /* 附加item_RadioCheckColumnIn電腦版為內部垂直 */
  .item_RadioCheckColumnIn .item_Radio_list{
    gap: 5px;
    min-width: unset;
    flex-direction: row;
    align-items: center;
  }
    .item_RadioCheckColumnIn .item_Radio_list br{
      display: none;
    }


}
