/*===========================================*/
/*-------關於我們_公司沿革--------*/
/*===========================================*/


.history_area{
	color: var(--dark_color);
	display: flex;
	flex-direction: column;
}

	.dot_line_mobile{
		display: none;
	}

	/* 公司沿革_同一年_section */
	.history_section {
		display: flex;
		flex-direction: column;
	}
		.history_item{
			display: grid;
			grid-template-columns: clamp(11.25rem, 13.5417vw, 16.25rem) auto; /* 260 - 180px auto */ 
			column-gap: clamp(1.2904rem, 2.0833vw, 2.5rem); /* 最小值 20.65px、大小約 2.0833vw、最大值 40px */
		}
		/* 公司沿革_left */
		.history_left{
			display: grid;
			grid-template-columns: 2fr 1.25rem 2fr; /* 1fr 20px 1fr */
			align-items: flex-start;
			gap: inherit;
			/* font-family: var(--foreign_font); */
			font-weight: 700;
			font-size: clamp(1.4545rem, 1.6667vw, 2rem); /* 字體 最小值 23.27px、大小約 1.6667vw、最大值 32.00px */
			line-height: 1;
			position: relative;
			color: var(--primary_color);
		}

			.history_item .year{
				font-family: inherit;
				white-space: nowrap;
				text-align: center;
			}
			.history_section .history_item:not(:first-child) .year{
				opacity: 0;
				visibility: hidden;
			}



			.history_item .dot{
				position: relative;
				display: flex;
				justify-content: center;
				height: 100%;
			}
				.history_item .dot span{	
					display: block;			
					background-color: #d6d6d6;
					width: 1px;
					height: 100%;
					left: 50%;
					z-index: 0;
				}
				.history_item .dot .dot_line{
					display: block;
					background-color: var(--primary_color);
					width: 1px;
					height: 0%;
					z-index: 0;
				}
				.history_item .dot span{	
					display: block;	
					background-color: var(--primary_color);		
					border-radius: 50%;		
					
					position: absolute;
					width: 100%;
					height: auto;
					aspect-ratio: 1 / 1;
					top: 0;
					left: 0;
				}
				.history_section:last-of-type .history_item:last-of-type {
					
				}
				.history_section:last-of-type .history_item:last-of-type .dot_line{
					opacity: 0;
				}

			.history_item .month{
				font-family: inherit;
				white-space: nowrap;
				text-align: center;
			}


		/* 公司沿革_right */
		.history_right{					
			padding-bottom: clamp(2.0968rem, 3.3854vw, 4.0625rem); /* 最小值 33.55px、大小約 3.3854vw、最大值 65.00px */
		}
		.history_section:last-child .history_item:last-child .history_right{					
			padding-bottom: 0;
		}
			.history_right_bpx{	
				display: flex;		
				flex-direction: column;			
				gap: 0.625rem; /*10px*/
			}

			/* 公司沿革_event_title */
			.history_right .event_title{
				font-size: clamp(1.0000rem, 1.1458vw, 1.3750rem); /* 字體 最小值 16.00px、大小約 1.1458vw、最大值 22.00px */	
				line-height: 1.1;		
				font-weight: 500;		
				color: var(--white_color);
				font-weight: 700;
			}
			.history_right .text_area{
				color: #818181;
				font-size: clamp(0.8750rem, 0.8333vw, 1rem); /* 字體 最小值 14.00px、大小約 0.8333vw、最大值 16.00px */
			}









@media (max-width: 900px){

.history_area{
}

	/* 公司沿革_同一年_section */
	.history_section {
	}
		.history_item{
			grid-template-columns: 11.25rem auto; /* 180px auto */ 
		}
		
}




@media (max-width: 640px){

	.history_area{
	position: relative;
	}

	.history_item {
		display: flex;
		flex-direction: column;
		grid-template-columns: unset;
		padding-left: 30px;
		position: relative;
		row-gap: 20px; /*10px*/
	}

	

	.dot_line_mobile{
		display: flex;
		position: absolute;
		content: "";
		background-color: transparent;
		width: 2px;
		height: calc(100% + 0px);
		left: calc((15px / 2) - (3px / 2));
		top: 0;

	}

	.dot_line_mobile2{
		background-color: #d6d6d6;
	}

	.history_section:last-child .history_item:last-child::before{
		display: none;
	}
	.history_section:last-child .history_item:last-child .dot_line_mobile{
	}



	/* 公司沿革_left */
	.history_left{
		display: flex;
		flex-direction: column;
		grid-template-columns: unset;
		position: relative;
		align-items: flex-start;
		justify-content: flex-start;
		row-gap: clamp(1.2904rem, 2.0833vw, 2.5000rem); /* 最小值 20.65px、大小約 2.0833vw、最大值 40.00px */
	}
	.history_left::before{
		display: none;
	}
	.history_section:last-child .history_item:last-child .history_left::after{
	}
	.history_item .dot .dot_line{
		display: none;
	}




		.history_item .year{
		}
		.history_section .history_item:not(:first-child) .year{
			display: none;
		}

		.history_item .dot{
			width: 15px;
			left: -30px;
			top: 0;
			position: absolute;
		}


			/* 公司沿革_event_title */
			.history_right .event_title{
				position: relative;
			}
			.history_right .event_title::before{
				position: absolute;
				content: "";
				background-color: var(--primary_color);
				width: 10px;
				aspect-ratio: 1;
				left: calc(-30px + (10px / 2) - 2.5px);
				top: 3px;
				transform: translate(0% , 0);
				z-index: 0;
				border-radius: 50%;
			}

		/* 公司沿革_right */
		.history_section:last-child .history_item:last-child .history_right{
			padding-bottom: 0;
			position: relative;
		}
		.history_section:last-child .history_item:last-child .history_right::before{
			position: absolute;
			content: "";
			background-color: var(--black_color);
			width: 10px;
			height: calc(100% - 10px);
			left: calc((15px / 2) - (3px / 2));
			left: calc(-30px + 2px);
			top: 10px;
			transform: translate(0% , 0);
			z-index: 0;
		}

}