@charset "utf-8";

/* ------------------------------------------

	沿革

------------------------------------------ */
._history {
	--color-history: #0068bf;

	& .c-secondaryHeading {
		display: flex;
		flex-wrap: wrap;
		line-height: 1.5;
		color: var(--color-history);

		& b {
			flex: 0 0 auto;
			padding: 0 1em 0 0;

			& span {
				font-size: 0.66em;
			}
		}
	}

}

/* アンカー
------------------------------------------ */
.history__tab {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
	max-width: 800px;

	& a {
		display: flex;
		align-items: center;
		gap: 20px;
		height: 55px;
		padding: 0 1em 0 1.5em;
		font-size: 1.6rem;
		line-height: 1;
		color: var(--color-hover);
		border: solid 1px var(--color-hover);
		border-radius: 10px;
		text-decoration: none;

		&::after {
			content: url('data:image/svg+xml;utf-8, <svg xmlns="http://www.w3.org/2000/svg" width="27" height="27" viewBox="0 0 27 27"><path id="d" data-name="c" d="M13.5,27C6.06,27,0,20.94,0,13.5S6.06,0,13.5,0s13.5,6.06,13.5,13.5-6.06,13.5-13.5,13.5ZM13.5,1C6.61,1,1,6.61,1,13.5s5.61,12.5,12.5,12.5,12.5-5.61,12.5-12.5S20.39,1,13.5,1ZM18.31,12.37l-3.91,4.27h-1.28l-4.42-4.27h2.14l2.83,2.94,2.5-2.94s2.14,0,2.14,0Z" fill="%230068be"/></svg>');
			font-size: 0;
		}
		&::before {
			content: none;
		}
	}
}
@media (max-width: 767px) {
	.history__tab a {
		height: 45px;
		font-size: 1.4rem;
	}

	.history__tab a::after {
		transform: scale(90%);
	}
}


/* 年イベント
------------------------------------------ */
.history__item {
	display: flex;
	margin: 10px 0;
	padding: 40px;
	color: #383838;
	background-color: #f1f9fd;

	@media (max-width: 767px) {
		display: block;
		padding: 5vw;
	}

	&:first-of-type {
		margin: 40px 0 0 0;
	}

	& dt {
		flex: 0 0 auto;
		width: 70px;
		font-size: 2.0rem;
		line-height: 1.4;
		color: var(--color-history);
	}

	& dd {
		display: flex;
		flex-direction: row-reverse;
		@media (max-width: 767px) {
			display: block;
		}

		& ul {
			font-size: 1.6rem;
			@media (max-width: 767px) {
				margin: 1em 0;
				font-size: 1.4rem
			}
		}

		& div {
			display: flex;
			flex: 0 0 auto;
			padding: 0 30px 0 0;
			@media (768px <= width <= 960px) {
				display: block;
			}

			@media (max-width: 767px) {
				flex-wrap: wrap;
				gap: 20px 0;
			}
		}
		& figure {
			min-width: 150px;
			text-align: center;

			& + figure {

				@media (768px <= width <= 960px) {
					margin: 20px 0 0 0;
				}

			}

		}

		& figcaption {
			padding: 0.6em 0 0 0;
			font-size: 1.2rem;
			line-height: 1.6;
		}
	}

}