@charset "UTF-8";

h2.heading { margin: 0; top: 0; position: sticky; z-index: 9999; box-shadow: 0 0 8px #FFFFFF; }

.timeline {
	padding-top: 32px; position: relative;
	&:before { content: ""; width: 2px; top: 0; bottom: -48px; left: calc(50% - 1px); position: absolute; background: var(--mimasenka-light-blue); }
	> div + div { margin-top: 16px; }
	dt { padding-bottom: 8px; border-bottom: 4px solid #004488; position: relative; font-size: 24px; font-weight: bold; }
	dt:before { content: ""; width: 16px; height: 16px; top: 38px; border-radius: 50%; background: #004488; display: block; position: absolute; }
	dd + dd { margin-top: 16px; border-top: 1px solid #CCCCCC; }
	img { max-width: 100%; height: auto; margin-bottom: 16px; }
	.zadankai-club-logo { max-height: 64px; }
	p + p { margin-top: 8px; }

	> div:nth-of-type(2n - 1) {
		margin-left: calc(50% + 1px);
		dt { padding-left: 16px; }
		dt:before { left: -9px; }
		dd { padding: 16px 0 0 16px; }
	}
	
	> div:nth-of-type(2n) {
		margin-right: calc(50% + 1px);
		dt { padding-right: 16px; }
		dt:before { right: -9px; }
		dd { padding: 16px 16px 0 0; }
	}
}


@media (width <= 960px) {
	.timeline {
		margin-left: 8px;
		&:before { left: 0; }
		> div { margin-left: 2px !important; margin-right: 0 !important; }
		> div + div { margin-top: 24px; }
	
		> div:nth-of-type(2n) {
			dt { padding-left: 16px; padding-right: 0; }
			dt:before { left: -9px; }
			dd { padding-left: 16px; padding-right: 0; }
		}
	}
}