/*========================================================*/
/*-------首頁內容--------*/
/*========================================================*/





.main , .mainContent{
	min-height: 56.0625rem;
}


.main::after{
	opacity: 0;
}

.main::before{
	opacity: 0;
}


/* 在螢幕放大150%且寬度大於991時，套用這裡的特定樣式 */
@media screen and (min-width: 990.1px) and (min-height: 500px) and (max-height: 1000px) and (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.74), only screen and (min-resolution: 150dpi) and (max-resolution: 174dpi) {

	.main , .mainContent{
		min-height: 33.5rem;
	}

}






/*/////////////////////////////////////////////////////////*/
/*-------共用區塊--------*/
/*/////////////////////////////////////////////////////////*/


/*首頁內容區塊*/	
.mainContent{
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	min-height: inherit;
}



	/*----- 首頁標題1 -----*/
	.index_title {
		color: var(--dark_color);
		line-height: 1.3;
		text-align: center;
		margin-bottom: clamp(0.6452rem, 1.0417vw, 1.2500rem); /* 10.32px , 1.0417vw , 20.00px */
		/*font-size: 36px;*/
		font-size: clamp(1.5000rem, 1.8750vw, 2.2500rem); /* 24.00px , 1.8750vw , 36.00px */
		font-weight: 700;
		line-height: normal;
	}	
		.index_title h2{	
			font-size: inherit;
			line-height: initial;
			padding: 0;
			margin: 0;
			display: inline-block;
			font-weight: inherit;
		}	
	





	
@media (max-width: 990px){
	
	.mainContent{	
		/* padding: 25px 0px;	 */
	}	



		/*----- 首頁標題1 -----*/
		.index_title{
			/* font-size: 25px; */
			line-height: 1.2;
		}
		

}


.index_logInBg{
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.index_logIn_area{
	display: flex;
	flex-grow: 1;
}
.index_logIn_left{
	width: 40%;
	/* background: var(--primary_color) url(../images/logIn_Bg.png); */
	background: var(--primary_color) url(../images/logIn_Bg.webp);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;

	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	
	/* padding: 105px 0; */
}
.index_logIn_left_in{
	padding:0 10% ;
	box-sizing: border-box;
	
}
.index_logIn_right{
	width: 60%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
	padding-top: 78px; 

	/* display: none; */
}
.index_logIn_right::before{
	content: '';
	width:352px;
	height: 352px;
	position: absolute;
	left:0%;
	top: 0;
	background: url(../images/circle01.webp);
	background-position: top left;
	background-repeat: no-repeat;
	background-size: contain;
	transform: translateX(-50%);
	z-index: -1;
	opacity: 0.5;
}
.index_logIn_right::after{
	content: '';
	width:352px;
	height: 352px;
	position: absolute;
	right:0%;
	bottom: -10%;
	background: url(../images/circle02.webp);
	background-position: bottom right;
	background-repeat: no-repeat;
	background-size: contain;
	/* transform: translateX(-50%); */
	z-index: -1;
	opacity: 0.5;
}


.index_logIn_logo {
	width: 336px;
	margin: 0 auto;
}
.index_logIn_logo img{
	width: 100%;
	height: auto;
}
.index_logIn_title{
	color: var(--dark_color);
	text-align: center;
	/* font-size: 30px; */
	font-size: clamp(1.5625rem, 1.5625vw, 1.8750rem); /* 25.00px , 1.5625vw , 30.00px */
	font-weight: 700;
	margin: clamp(1.1291rem, 1.8229vw, 2.1875rem) 0; /* 18.07px , 1.8229vw , 35.00px */
}


.index_logIn_section{
	max-height: 22.5rem; /* 360px */
	overflow-x: hidden;
	overflow-y: auto;
}


	.index_logIn_section::-webkit-scrollbar {/*滾動條整體樣式*/
		width: 0.3125rem;     /*高寬分別對應橫豎滾動條的尺寸*/
		height:0.3125rem;
	}
	.index_logIn_section::-webkit-scrollbar-thumb {/*滾動條裡面小方塊*/
		/* -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); */
		background: #fff;
		border-radius: 0.9375rem;
	}
	.index_logIn_section::-webkit-scrollbar-track {/*滾動條裡面軌道*/
		/* -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); */
		border-radius: 0.3125rem;
		background: var(--fifth_color);
	}	



.index_logIn_section .text_area {
	font-size: clamp(1.0000rem, 1.0417vw, 1.2500rem); /* 16.00px , 1.0417vw , 20.00px */
	color: var(--sixth_color);
	line-height: 1.5;
}

.index_logIn_right_in {
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* width: 45%; */
	/* max-width: 48.4375rem; */
	max-width: 31.25rem;
	width: 90%;
}

.index_logIn_right_form {
	/* width: 40%; */
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap:  clamp(0.8065rem, 1.3021vw, 1.5625rem); /* 12.90px , 1.3021vw , 25.00px */
	width: 100%;
}

	.index_logIn_right .form_area{		
		margin: 0 auto;
		width: 100%;
	}







/*----- 按鈕 -----*/
.btn_area {
  margin-bottom: clamp(0.9678rem, 1.5625vw, 1.8750rem) ; /* 15.48px , 1.5625vw , 30.00px */
}
.index_logIn_right_form .btn_area input{
	/*width: 100%;*/
	/*border-radius: clamp(1.0323rem, 1.6667vw, 2.0000rem);*/ /* 16.52px , 1.6667vw , 32.00px */
	/*box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);*/
	/*font-size: clamp(1.2500rem, 1.2500vw, 1.5000rem); *//* 20.00px , 1.2500vw , 24.00px */
	font-weight: 700;
	line-height: normal ;
	/*height: 3.1875rem;*/
}
.index_logIn_right_form .btn_area input.back{
	background: var(--fifth_color);
}

@media (max-width: 1440px) {
	.index_logIn_title {
		/* font-size: 26px; */
		/* margin: 35px 0; */
	}
	.index_logIn_section .text_area{
		font-size: 1rem;
	}
	.index_title {
		/* font-size: 30px; */
	}
	.index_logIn_right_form .btn_area input {
		/* font-size: 20px; */
	}
}

@media (max-width: 1280px) {
	.index_logIn_right_in {
		/* width:60%; */
	}
}


/* 在螢幕放大125%且寬度大於991時，套用這裡的特定樣式 */
@media screen and (min-width: 990.1px) and (min-height: 500px) and (max-height: 1000px) and (-webkit-min-device-pixel-ratio: 1.25) and (-webkit-max-device-pixel-ratio: 1.49), only screen and (min-resolution: 125dpi) and (max-resolution: 149dpi) {

	.index_logIn_right .form_area .form_list:first-child ,
	.index_logIn_right .form_area .form_list:nth-of-type(2){		
  		/*width: calc((100% / 2) - (1 * 0.7813vw / 2));*/ /* 2欄平均寬度，扣除間距 */
	}

}

/* 在螢幕放大150%且寬度大於991時，套用這裡的特定樣式 */
@media screen and (min-width: 990.1px) and (min-height: 500px) and (max-height: 1000px) and (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.74), only screen and (min-resolution: 150dpi) and (max-resolution: 174dpi) {

	.index_logIn_right .form_area .form_list:first-child ,
	.index_logIn_right .form_area .form_list:nth-of-type(2){		
  		/*width: calc((100% / 2) - (1 * 0.7813vw / 2)); *//* 2欄平均寬度，扣除間距 */
	}

}




@media (max-width: 990px) {
	
	.index_logIn_area{
		flex-direction: column;
	}
	.index_logIn_left{
		width: 100%;
		padding: 25px 0;
	}
	.index_logIn_left_in{
		width: 90%;
		margin:  0 auto;
		padding: 0;
		
	}
	.index_logIn_logo {
		width: 270px;
	}
	.index_logIn_title {
		/* font-size: 22px; */
	}
	.index_logIn_right{
		width: 100%;
	}
	.index_logIn_right_in {
		/* width: 70%; */
	}
	.index_logIn_right::before {
		/* width: 200px; */
		/* height: 200px; */
	}
	.index_logIn_right::after {
		/* width: 200px; */
		/* height: 200px; */
	}
	.index_title {
		/* font-size: 22px; */
	}
	.fL_tit {
		font-size: 1rem;
	}
}

@media (max-width: 640px) {
	
	.index_logIn_right_form .btn_area input {
		font-size: 1rem;
		height: 40px;
		line-height: normal;
	}
}

@media (max-width: 540px) {
	.index_logIn_right_in {
		width: 90%;
	}
}