@charset "utf-8";

* {
	box-sizing: border-box;
}

.layout-sub-section {
	p {
		strong {
			font-weight: 400;
			display: inline;
			background: linear-gradient(transparent 70%, var(--color-gold-light03) 70%);
		}
	}
}

.athlete-list-box {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: min(10.66vw, 40px);
	margin: min(10.66vw, 40px) auto;
	border: 2px solid var(--color-gray-light02);
	padding: min(8.53vw, 40px) min(4.26vw, 32px);
	background-color: var(--color-gray-light);
	width: 100%;

	li {
		display: grid;
		grid-template-columns: min(32vw, 140px) 1fr;
		gap: min(5.33vw, 20px);
		position: relative;

		&::before {
			content: "";
			position: absolute;
			width: 100%;
			height: 1px;
			left: 0;
			bottom: max(-5.33vw, -20px);
			border-bottom: .5px dashed var(--color-gray);

		}

		&:last-child {
			&::before {
				content: none;
			}
		}
	}

	.headline {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		height: min(32vw, 140px);
		font-family: var(--font-serif);
		color: var(--color-white);
		font-weight: 500;
		line-height: 1.4;
		z-index: 0;

		&::before {
			content: "";
			position: absolute;
			width: min(32vw, 140px);
			height: min(32vw, 140px);
			line-height: min(32vw, 140px);
			border-radius: 50%;
			background-color: var(--color-gray-dark);
			z-index: -1;

		}
	}

	.text {
		p {
			margin-bottom: min(6.4vw, 24px);
			font-size: min(3.73vw, 15px);

			&:last-child {
				margin-bottom: 0;
			}
		}
	}
}

@media screen and (max-width: 767px) {
	.athlete-list-box {

		li {
			grid-template-columns: repeat(1, 1fr);
		}

		.headline {
			font-weight: 600;
		}
	}
}


.athlete-message {
	p {
		margin-bottom: min(6.4vw, 24px);

		&:last-child {
			margin-bottom: 0;
		}
	}

	.name {
		width: 100%;
		margin: min(10.66vw, 40px) auto 0;
		padding-top: min(10.66vw, 40px);
		font-family: var(--font-serif);
		font-weight: 500;
		text-align: right;
		border-top: 1px solid var(--color-gray);
	}
}