main {
	padding: 12px;
}

/* ====================== */
/* 会社情報 */
/* ====================== */
#about-company {
	margin-bottom: 100px;
}
#about-company .about-company-wrapper {
	flex-flow: column;
	& .company-info {
		width: 100%;
		background: #fff;
	}
	& .company-info > ul {
		padding: 12px;
		padding-bottom: 36px;
	}
	& .company-info > ul > li {
		padding: 12px 0;
		border-bottom: 2px solid #ededed;
	}
	& .company-info p.title {
		margin-bottom: 6px;
		font-weight: 500;
	}
	/* 電話番号 */
	& .company-info .tel {
		flex-flow: column;
		align-items: start;
	}
	& .company-info .tel .wrapper {
		width: 100%;
	}
	& .company-info .tel p:first-child {
		width: 32%;
	}
	& .company-info .tel p:last-child {
		width: 68%;
	}
}
#about-company div.map-iframe {
	width: 100%;
	& iframe {
		width: 100%;
		height: 300px;
	}
}

@media print, screen and (min-width: 764px) {
	#about-company {
		width: 80%;
		margin: 0 auto;
		margin-bottom: 60px;
	}
	#about-company .about-company-wrapper {
		flex-flow: row;
		align-items: stretch;
		& .company-info {
			width: 65%;
		}
	}
	#about-company .about-company-wrapper {
		& .company-info > ul {
			padding: 32px 40px;
		}
		& .company-info > ul > li {
			display: flex;
			flex-flow: row;
		}
		& .company-info p.title {
			width: 20%;
			margin-bottom: 0;
		}
		& .company p.text {
			width: 80%;
		}
		/* 電話番号 */
		& .company-info .tel {
			width: 80%;
		}
		& .company-info .tel .wrapper {
			justify-content: start;
		}
		& .company-info .tel p:first-child {
			width: 120px;
		}
	}
	#about-company div.map-iframe {
		width: 35%;
		& iframe {
			height: 100%;
		}
	}
}

/* 代表取締役のごあいさつ */
#greeting-about .greeting-about-wrapper {
	flex-flow: column;
	& .text-wrapper {
		padding: 32px 12px;
		background: #fff;
		margin-bottom: 44px;
	}
	& h2 {
		margin-bottom: 28px;
		font-family: var(--line);
		font-size: 1.3em;
		font-weight: 700;
	}
	& p.text {
		margin-bottom: 4px;
	}
	& p.name {
		margin-top: 32px;
		text-align: end;
	}
	& .img-wrapper {
		width: 200px;
	}
}

@media print, screen and (min-width: 764px) {
	#greeting-about .greeting-about-wrapper {
		flex-flow: row;
		align-items: end;
		width: 80%;
		margin: 0 auto;
		& .text-wrapper {
			width: 65%;
			margin-bottom: 0;
			padding: 32px 40px;
		}
		& .img-wrapper {
			width: 35%;
			text-align: end;
		}
		& .img-wrapper img {
			width: 80%;
			max-width: 260px;
		}
	}
}