@charset "utf-8";

/* -----------------------------------------------------------
    会社概要
-------------------------------------------------------------- */ :root {
	--msgmargin: 20px;
}

#company {}

#company .contents {}

#company .subpage-header::before {
	display: none;
}

#company .subpage-header .en {
	bottom: -15px;
	opacity: .1;
	mix-blend-mode: unset;
}

@media screen and (max-width: 768px) {
	#company .subpage-header .en {
		bottom: -5px;
	}
}

/* -----------------------------------------------------------
    代表挨拶　message-ara
-------------------------------------------------------------- */
.message-area .message-catch {
	font-size: 2.6rem;
	font-weight: bold;
	line-height: 1.7;
	letter-spacing: .04em;
}

.message-area .message-main {
	margin: 25px 0 0;
}

.message-area .company-cmn-catch {
	font-size: 2.3rem;
	letter-spacing: .03em;
}

.message-area .message-main .message-txt {
	margin: 0 0 var(--msgmargin);
	line-height: 2;
}

.message-area .message-main p:last-of-type {
	margin: 0;
}

.message-area .message-flex {
	display: flex;
	gap: 35px;
}

.message-area .message-ceo-name .img-wrap {
	width: 195px;
	aspect-ratio: 39/31;
	margin: 10px 0 15px;
}

.message-area .message-ceo-name .img-wrap img {
	width: 100%;
}

.message-area .message-ceo-name figcaption {
	align-items: center;
	gap: 10px;
	font: bold 1.65rem / 1 var(--serif);
	display: flex;
	text-align: center;
}

.message-area .message-ceo-name .name img {
	aspect-ratio: 300/66;
	height: 22px;
}

.msg-dl-wrap {
	display: flex;
	flex-direction: column;
}

.msg-dl-wrap dl {
	margin: 33px 0 0;
}

.msg-dl-wrap dt {
	color: var(--main);
	font-weight: 600;
	font-size: 1.7rem;
}

.msg-dl-wrap dd {
	line-height: 1.8;
	margin: 15px 0 0;
}

@media screen and (max-width: 768px) {
	.message-area .message-main {
		margin: 20px 0 0;
	}

	.message-area .company-cmn-catch {
		font-size: 2rem;
	}

	.message-area .message-main p {
		line-height: 2.2;
		font-size: 1.5rem;
		letter-spacing: 0;
	}

	.message-area .message-flex {
		display: block;
	}

	.message-area .message-ceo-name {
		width: fit-content;
		margin: 30px auto 0;
	}

	.message-area .message-ceo-name figcaption {
		font-size: 1.5rem;
		justify-content: center;
	}

	.message-area .message-ceo-name .name img {
		height: 21px;
	}

	.message-area .message-ceo-name .img-wrap {
		margin: 0 0 15px;
	}

	.msg-dl-wrap dl {
		margin: 20px 0 0;
	}

	.msg-dl-wrap dt {
		font-size: 1.6rem;
		line-height: 1.5;
	}

	.msg-dl-wrap dd {
		line-height: 2;
		font-size: 1.5rem;
		letter-spacing: 0;
		margin: 8px 0 0;
	}
}

/* -----------------------------------------------------------
    philosophy-area
-------------------------------------------------------------- */
.philosophy-area .philosophy-list {
	margin: 50px 0 0;
}

.philosophy-area .philosophy-list li {
	font-size: 2.2rem;
	font-weight: 600;
	line-height: 1.7;
	margin: 10px 0 0;
	padding: 0 0 0 50px;
	position: relative;
}

.philosophy-area .philosophy-list li span {
	position: absolute;
	left: 0;
}

@media screen and (max-width: 768px) {
	.philosophy-area .philosophy-list {
		margin: 30px 0 0;
	}

	.philosophy-area .philosophy-list li {
		font-size: 1.8rem;
		line-height: 1.5;
		padding: 0 0 0 40px;
	}
}

/* -----------------------------------------------------------
    overview-area
-------------------------------------------------------------- */
.overview-area .company-cmn-table .td-flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.overview-area .company-cmn-table .td-flex .img-wrap {
	width: 200px;
	aspect-ratio: 2/1;
	margin: 0 auto 10px;
}

/* -----------------------------------------------------------
    company-btn
-------------------------------------------------------------- */
.business-area .business-btn-list {
	display: grid;
	/*justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;*/
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin: 50px 0 0;
}

.business-area .business-btn-list li {
	/*width: calc(580 / 1200 * 100%);*/
	display: contents;
}

.business-block-ttl {
	border-bottom: 5px solid var(--main);
	color: var(--main);
	font-weight: bold;
	font-size: 3.2rem;
	line-height: 1;
	letter-spacing: .03em;
	position: relative;
	padding: 0 0 15px;
	margin: 0 0 35px;
}

.business-btn {
	display: flex;
	color: var(--cmnblack);
	width: 100%;
}

a.business-btn {
	border: 1px solid var(--border1);
}

a.business-btn:hover {
	border-color: var(--sub2);
}

a.business-btn:hover::before {
	opacity: 1;
}

.business-btn > .img-wrap {
	/*width: calc(250 / 580 * 100%);*/
	width: 150px;
	flex-shrink: 0;
}

.business-btn .img-wrap img {
	display: block;
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.technique-txt-wrap {
	position: relative;
	width: 100%;
	padding: 20px;
}

.technique-txt-wrap::after {
	content: "→";
	position: absolute;
	bottom: 10px;
	right: 15px;
	color: var(--cmnblack);
	font-size: 1.8rem;
	transition: .5s;
}

a.business-btn:hover .technique-txt-wrap::after {
	color: var(--main);
	transform: translateX(5px);
}

.technique-txt-wrap .technique-ttl {
	font-size: 2.2rem;
	font-weight: bold;
	color: var(--cmnblack);
	line-height: 1.2;
	margin: 8px 0 15px;
}

.technique-txt-wrap .technique-ttl > .ttl-small {
	display: block;
	font-size: 1.5rem;
	margin: 4px 0 0;
}

.technique-txt-wrap .technique-txt {
	font-size: 1.4rem;
	color: var(--cmnblack);
	line-height: 1.5;
	font-weight: 500;
}

@media screen and (max-width: 768px) {
	.business-area > p {
		line-height: 1.6;
	}

	.business-block {}

	.company-block-ttl {
		font-size: 2.4rem;
		padding: 0 0 15px;
		margin: 0 0 25px;
		text-align: center;
	}

	.business-area .business-btn-list {
		display: block;
		margin: 30px 0 0;
	}

	.business-btn {
		width: 100%;
		margin: 0 auto 20px;
	}

	.business-btn > .img-wrap {
		width: 140px;
	}

	.technique-txt-wrap {
		padding: 20px;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.technique-txt-wrap .technique-ttl {
		font-size: 2rem;
		margin: 10px 0 0;
	}

	/*.technique-txt-wrap .technique-ttl > .pc-br{
		display: inline-block;
	}*/
	.technique-txt-wrap .technique-ttl > .ttl-small {
		font-size: 1.3rem;
		margin: 5px 0 0;
	}

	.technique-txt-wrap .technique-txt {
		display: none;
	}
}

/* -----------------------------------------------------------
    history-box-area
-------------------------------------------------------------- */
/*.history-area .company-cmn-table2 th,
.history-area .company-cmn-table2 td{
	font-size: 1.6rem
}

.history-area .company-cmn-table2 th{
	width: 180px;
	padding: 10px 40px;
}

@media screen and (max-width: 768px){
	.history-area .company-cmn-table2 th{
		width: 100%;
        padding: 0;
	}
}*/
/* -----------------------------------------------------------
    営業所一覧・アクセス access-area
-------------------------------------------------------------- */
.access-area .access-link-list {
	display: flex;
	align-items: center;
	gap: 20px;
	margin: 0 0 40px;
}

.access-area .access-link-list li {
	display: contents;
}

a.access-link {
	display: flex;
	align-items: center;
	color: var(--cmnblack);
	border: 1px solid var(--cmnborder);
	padding: 15px 15px 15px 50px;
}

a.access-link::after {
	content: "";
	width: 5px;
	height: 5px;
	margin-left: 35px;
	border: 1px solid var(--cmnblack);
	border-left: 0;
	border-bottom: 0;
	transform: translateY(-25%) rotate(135deg);
}

a.access-link:hover {
	/*opacity: .7;*/
	color: #fff;
	background: var(--main);
}

a.access-link:hover::after {
	border: 1px solid #fff;
	border-left: 0;
	border-bottom: 0;
}

.access-area .access-list {}

.access-area .access-box {
	padding-top: 110px;
	margin: -110px 0 60px;
}

.access-area .access-box .access-ttl {
	display: flex;
	align-items: center;
	gap: 20px;
	font-size: 2.4rem;
	font-weight: bold;
	color: var(--txtblue);
	padding: 10px 12px 9px;
	line-height: 1;
	margin: 0 auto 0 0;
	white-space: nowrap;
}

.access-area .access-box .access-ttl::after {
	content: "";
	display: inline-block;
	flex: 1;
	height: 2px;
	background: var(--cmnborder);
}

.access-area .access-overview {
	display: flex;
	gap: 30px;
	margin: 30px 0;
}

/*
.access-area .access-overview .company-cmn-table tr{
	display: flex;
	align-items: flex-start;
}
*/
.access-area .access-overview .company-cmn-table {
	margin: 0 0 20px;
}

.access-area .access-overview .company-cmn-table th {
	width: 100px;
	padding: 15px 0 15px 15px;
}

.access-area .access-overview .company-cmn-table td {
	padding: 15px 15px 15px 0;
	vertical-align: top;
}

.access-area .access-overview .company-cmn-table td.tel a {
	color: var(--cmnblack);
	text-decoration: none;
}

.access-area .access-overview .img-wrap {
	width: calc(570 / 860 * 100%);
	aspect-ratio: 570 / 270;
}

.access-area .access-overview .img-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.access-area .access-overview .map-wrap {
	width: calc(700 / 860 * 100%);
	height: 270px;
}

.access-area .access-box:first-of-type .map-wrap {
	width: 100%;
	height: 300px;
	margin-bottom: 30px;
}

.access-area .txt-wrap .train::before {
	content: "\f239";
	display: inline-block;
	font-weight: 700;
	font-family: "Font Awesome 5 Free";
	padding: 0 5px 0 0;
	font-size: 1.8rem;
}

.access-area .map-wrap iframe {
	width: 100%;
	height: 100%;
}

.access-area .visit-wrap {
	margin-bottom: 30px;
}

.access-area .visit-ttl {
	font-size: 2rem;
	font-weight: bold;
	color: var(--cmnblack);
	margin-bottom: 5px;
}

.access-area .visit-wrap .visit-ttl .car, .access-area .visit-wrap .visit-ttl .train {
	margin: 20px 0 0;
}

.access-area .visit-wrap .visit-ttl > .fa-car.car::before {
	content: "\f1b9";
	display: inline-block;
	font-weight: 800;
	font-family: "Font Awesome 6 Free";
	padding: 0 5px 0 0;
	font-size: 1.8rem;
}

.access-area .visit-wrap .visit-ttl > .fa-bus-simple.train::before {
	content: "\f55e";
	display: inline-block;
	font-weight: 800;
	font-family: "Font Awesome 6 Free";
	padding: 0 5px 0 0;
	font-size: 1.8rem;
}

.access-area .visit-sub-txt {
	font-size: 1.8rem;
	font-weight: bold;
	color: var(--sub);
}

@media screen and (max-width: 768px) {
	.access-area .access-link-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 25px;
		gap: 15px;
	}

	.access-area .access-link-list li {
		display: inherit;
		width: calc((100% - 15px) / 2);
	}

	a.access-link {
		justify-content: space-between;
		width: 100%;
		max-width: inherit;
		padding: 15px 10px 15px 15px;
		text-align: center;
	}

	.access-area .access-link-list li:first-of-type a.access-link {
		/*padding: 15px 25px 15px 50px;*/
	}

	a.access-link::after {
		margin-left: 0;
	}

	.access-area .access-box {
		padding-top: 63px;
		margin-top: -63px;
	}

	.access-area .access-overview {
		display: block;
		margin-top: 20px;
	}

	.access-area .access-overview .img-wrap {
		width: 100%;
		/*max-width: 450px;*/
		height: 250px;
		margin: 0 auto 10px;
	}

	.access-area .access-overview .map-wrap {
		width: 100%;
		height: 300px;
		margin: 0 auto 10px;
	}

	.access-area .access-box:first-of-type .map-wrap {
		margin: 0 auto 30px;
	}

	.access-area .access-overview .company-cmn-table th {
		padding: 10px 0 3px;
	}

	.access-area .access-overview .company-cmn-table td {
		padding: 0 15px 15px 10px;
	}

	.access-area .address {
		line-height: 1.6;
	}

	.access-area .access-box p {
		font-size: 1.5rem;
		line-height: 1.5;
	}

	.access-area .access-box .access-ttl {
		font-size: 2rem;
		padding: 10px 10px 9px 0;
	}

	.access-area .visit-wrap {
		margin-bottom: 30px;
	}

	.access-area .access-box .visit-ttl {
		font-size: 1.8rem;
		margin-bottom: 10px;
	}

	.access-area .visit-basic-txt {
		margin: 5px 0 0;
	}

	.access-area .txt-wrap .train, .car {
		margin: 10px 0 0;
		letter-spacing: 0;
	}

	.access-area .txt-wrap .train::before, .car::before {
		font-size: 1.7rem;
	}

	.access-area .access-box .visit-sub-txt {
		font-size: 1.6rem;
	}
}