@charset "utf-8";

h3,
h3 *{
	font-size: min(3.34vw, 49px);
	font-weight: 500;
	text-align: center;
	letter-spacing: .2em;
}
h3::after {
	display: block;
	content: "";
	height: 3px;
	background: var(--black);
	width: 4.6em;
	margin: 0 auto;
	margin: .88em auto 0 auto;
}

section {
	padding: 0 min(19.1vw, 386px);;
}
section * {
	color: var(--black);
}

dl {
	display: grid;
	grid-template-columns: auto 1fr;
}
dt {
	grid-column: 1;
}
dd {
	grid-column: 2;
}

/* keyvisual */
.key h2 {
	position: absolute;
	top: 26vw;
	display: flex;
	flex-direction: column;
	width: 100%;
	align-items: center;
	row-gap: 18px;
}
.key h2 * {
	text-shadow: 1px 1px 10px rgba(0,0,0,.3);
	color: var(--white);
}

/* company overview */
#company_overview h3 {
	padding-top: 2.9em;
}
#company_overview dl,
#company_overview dl * {
	font-size: min(1.65vw, 27px);
	font-weight: 400;
	letter-spacing: .2em;
	line-height: 1.6em;
}
#company_overview dl {
	margin-top: 7.5em;
	row-gap: 1.2em;
}
#company_overview dl dt:not(:nth-child(1)),
#company_overview dl dd:not(:nth-child(2)) {
	padding-top: 1.2em;
	border-top: 1px solid var(--black);
}
#company_overview dl dt {
	padding-right: min(7.9vw, 179px);
	white-space: nowrap;
}
#company_overview dd .en {
	font-size: min(1.53vw, 25px);
}
#company_overview dd div .zip,
#company_overview dd div .tel {
	padding-right: .5em;
}

/* company history */
#company_history h3 {
	padding-top: 5.1em;
}
#company_history dl,
#company_history dl * {
	font-size: min(1.45vw, 29px);
	font-weight: 400;
	letter-spacing: .08em;
	line-height: 1.6em;
}
#company_history dl {
	margin-top: 4.9em;
	margin-bottom: 7.9em;
}
#company_history dl dt,
#company_history dl dd {
	padding-top: .9em;
	padding-bottom: .9em;
}
#company_history dl dt {
	padding-right: 2.4em;
	padding-left: 1em;
}

/* location */
#location h3 {
	padding-top: 3.68em;
}
#location div {
	display: grid;
	grid-template-columns: 1fr auto;
	column-gap: 1em;
	padding: 4.65em 0 7.3em 0;
}
#location div,
#location div * {
	font-size: min(1.5vw, 23px);
	font-weight: 400;
	letter-spacing: 0;
}
#location iframe {
	object-fit: contain;
	width: 100%;
	height: auto;
	aspect-ratio: 704/787;
}
#location div li.train_line {
	font-size: min(1.66vw, 27px);
}
#location div li.train_line:not(:first-child) {
	margin-top: 2em;
}

@media screen and (max-width:750px) {
	section {
		padding: 0 6.8%;
	}

	h2, h2 span {
		font-size: 15px;
	}
	h2 img {
		width: auto;
		height: 18px;
	}

	h3,
	h3 *{
		font-size: min(5.33vw, 20px);;
	}
	h3::after {
		width: 3em;
		height: 1px;
		margin-top: .53em;
	}
	
	.key h2 {
		top: 30vw;
	}
	
	/* company overview */
	#company_overview h3 {
		padding-top: 2.5em;
	}

	#company_overview dl,
	#company_overview dl * {
		font-size: min(3.2vw, 14px);
	}
	#company_overview dl {
		margin-top: 3em;
	}
	#company_overview dl dt:not(:nth-child(1)),
	#company_overview dl dd:not(:nth-child(2)) {
		padding-top: 1em;
	}
	#company_overview dl dt {
		padding-right: 8vw;
	}
	#company_overview dd .en {
		font-size: min(2.3vw, 12px);
	}
	#company_overview dd div .zip,
	#company_overview dd div .tel  {
		display: block;
	}

	/* company history */
	#company_history h3 {
		padding-top: 2.8em;
	}
	#company_history dl,
	#company_history dl * {
		font-size: min(3.2vw, 14px);
	}
	#company_history dl {
		margin: 3em 0 6.4em 0;
	}
	#company_history dl dt {
		padding-right: 6.67vw;
	}
	
	/* location */
	section#location {
		padding: 0 12.27%;
	}
	#location h3 {
	  padding-top: 2.9em;
	}
	#location div,
	#location div * {
		font-size: min(3.2vw, 14px);
	}
	#location div {
		display: flex;
		flex-flow: wrap;
		row-gap: 3em;
		padding: 3em 0;
	}
	#location iframe {
		aspect-ratio: 567/437;
	}
	#location div li.train_line {
		font-size: min(4.27vw, 16px);
	}
	#location div li.train_line:not(:first-child) {
	  margin-top: 1.6em;
	}
}