@charset "UTF-8";

/*--------------------------------------------------------------------
works-about.html
works.css
--------------------------------------------------------------------*/

article section:not(:first-of-type) { margin-top: 70px; }

/*------------about---------------------------------------------------------------*/
/*------------topTxt------------------------*/
#about #topTxt > dl > dt {
	margin-top: 25px;
	font-size: 1.5em;
	color: var(--co-lime);
}
#about #topTxt > dl > dd {
	padding: 20px;
	background-color: var(--co-lime);
	color: var(--co-white);
}
#about #topTxt dl dl { display: flex; }
#about #topTxt dl dl:not(:first-of-type) { margin-top: calc(var(--parag-bet) / 2); }
#about #topTxt dl dl dt {
	min-width: 20%;
	font-weight: bold;
}
#about #topTxt dl dl dt::before { content: "【"; }
#about #topTxt dl dl dt::after  { content: "】"; }
#about #topTxt dl dl dd { flex: 1; }
#about #topTxt dl dl dd ul {
	display: flex;
	flex-wrap: wrap;
}
#about #topTxt dl dl dd ul li { text-indent: 0; }
#about #topTxt dl dl dd ul li:not(:last-of-type)::after { content: "・"; }

@media (max-width: 680px) {
	#about #topTxt dl dl { flex-direction: column; }
	#about #topTxt dl dl:not(:first-of-type) { margin-top: var(--parag-bet); }
	#about #topTxt dl dl dt { min-width: inherit; }
	#about #topTxt dl dl dd { padding-left: 2em; }
}
/*------------equipment------------------------*/
#equipment h5 {
	font-size: 1.5em;
	color: var(--co-green);
}
#equipment ul {
	display: flex;
	gap: 40px;
	margin-top: calc(var(--parag-bet) / 2);
}
#equipment #other {
	display: flex;
	gap: 40px;
	margin-top: 40px;
}
#equipment #other dl {
	display: flex;
	gap: 0 3em;
}
#equipment #other dl + p {
	margin-top: calc(var(--parag-bet) / 2);
}

@media (max-width: 480px) {
	#equipment ul {
		flex-direction: column;
		gap: 10px;
	}
	#equipment #other { flex-direction: column; }
}
/*------------device------------------------*/
#device #devList {
	display: flex;
	gap: 20px;
}
#device #devList table tr th { width: 80%; }
#device #devList table tr td { text-align: right; }
#device ul {
	display: flex;
	gap: 20px;
	margin-top: 20px;
}
#device ul p + p {
	margin-top: 0.25em;
	text-align: center;
}

@media (max-width: 960px) {
	#device #devList {
		flex-direction: column;
		gap: 0;
	}
	#device #devList table + table tr:first-of-type th,
	#device #devList table + table tr:first-of-type td { border-top: 0 none; }
}
@media (max-width: 480px) {
	#device #devList table tr th { width: 100%; }
	#device ul {
		flex-direction: column;
	}
}

/*------------product---------------------------------------------------------------*/
#product ul {
	display: flex;
	flex-wrap: wrap;
	gap: 45px 10px;
}
#product ul li { width: calc((100% - 10px * 2) / 3); }
#product ul li p + p {
	text-align: center;
	font-weight: bold;
}

@media (max-width: 960px) {
	#product ul li { width: calc((100% - 10px) / 2); }
}
@media (max-width: 480px) {
	#product ul li { width: 100%; }
}

/*------------result---------------------------------------------------------------*/
#result ul {
	display: flex;
	flex-wrap: wrap;
	gap: 45px 10px;
}
#result ul li { width: calc((100% - 10px * 2) / 3); }
#result ul li p + p {
	text-align: center;
	font-weight: bold;
}

@media (max-width: 960px) {
	#result ul li { width: calc((100% - 10px) / 2); }
}
@media (max-width: 480px) {
	#result ul li { width: 100%; }
}