@charset "UTF-8";

/*--------------------------------------------------------------------
company.html
company.css
--------------------------------------------------------------------*/

/*------------greeting--社長挨拶-------------------------------------------------------------*/
#greeting h4 {
	margin-bottom: 0.5em;
	padding-bottom: 0;
	text-align: center;
	font-size: 1.9em;
	font-weight: bold;
	color: var(--co-white);
	text-shadow: 
		 3px  3px 3px var(--co-red),
		-3px  3px 3px var(--co-red),
		 3px -3px 3px var(--co-red),
		-3px -3px 3px var(--co-red),
		 3px  0px 3px var(--co-red),
		 0px  3px 3px var(--co-red),
		-3px  0px 3px var(--co-red),
		 0px -3px 3px var(--co-red);
}
#greeting h4::before,
#greeting h4::after { display: none; }
#greeting dl {
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
	margin-top: 1em;
}
#greeting dl * { font: bold 1em / 1.2 var(--mincho); }
#greeting dl dd {
	margin-left: 0.25em;
	font-size: 1.5em;
}

/*------------overview--会社概要-------------------------------------------------------------*/
#overview span:not(:last-of-type) { margin-right: 1em; }
#overview ul { display: flex; }
#overview ul li:not(:last-of-type)::after {
	margin: 0 0.25em;
	content: "／";
}

/*------------history--会社沿革-------------------------------------------------------------*/
#history span { color: transparent; }


/*------------access--アクセス-------------------------------------------------------------*/
#access .flePR { flex-flow: row; }
#access p { margin-bottom: var(--parag-bet); }
#access dl { display: flex; }
#access dl dt::after { content: "："; }


@media (max-width: 680px) {
	#access .flePR { flex-flow: column; }
}
@media (max-width: 480px) {}


/*------------affiliated--アクセス-------------------------------------------------------------*/
#affiliated .flePR { flex-flow: row; }
#affiliated table tr th { width: 20%; }

@media (max-width: 680px) {
	#affiliated .flePR { flex-flow: column; }
}
@media (max-width: 480px) {
	#affiliated table tr th { width: 100%; }
}


/*------------delivery--アクセス-------------------------------------------------------------*/
#delivery ul {
	display: flex;
	flex-flow: wrap;
	gap: 0.5em 1em;
}
#delivery ul li { width: calc((100% - 1em * 3) / 4); }

@media (max-width: 680px) {
	#delivery ul li { width: calc((100% - 1em) / 2); }
}
@media (max-width: 420px) {
	#delivery ul li { width: 100%; }
}