@charset "UTF-8";

/*====================================================
共通スタイル
====================================================*/
.p-office {
	--contentPaddingLeft: calc(64 * var(--width-ratio-1280));
}
@media screen and (max-width: 768px) {
	.p-office {
		--contentPaddingLeft: 0;
	}
}

.p-office--inner {
	padding-left: var(--contentPaddingLeft);
}

/*====================================================
p-office-about
====================================================*/

/*====================================================
p-office-photo
====================================================*/
.p-office-photo__body {
	margin-top: calc(40 * var(--width-ratio-1280));
}

.p-office-photo__list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: calc(32 * var(--width-ratio-1280));
}
@media screen and (max-width: 768px) {
	.p-office-photo__list {
		grid-template-columns: 1fr;
		gap: calc(16 * var(--width-ratio-1280));
	}
}

.p-office-photo__item {
	position: relative;
}

.p-office-photo__img {
	aspect-ratio: 550/320;
	display: block;
	overflow: hidden;
	border-radius: calc(24 * var(--width-ratio-1280));
}
.p-office-photo__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/*====================================================
p-office-outline
====================================================*/
.p-office-outline__inner {
	display: grid;
	grid-template-columns: calc(555 / 1680 * 100vw) 1fr;
	align-items: center;
	column-gap: calc(32 * var(--width-ratio-1280));
}

@media screen and (max-width: 768px) {
	.p-office-outline__inner {
		display: block;
	}
}

.p-office-outline__img {
	display: block;
	aspect-ratio: 555/637;
	overflow: hidden;
	border-radius: calc(24 * var(--width-ratio-1280));
}

.p-office-outline__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.p-office-outline__content {
	align-self: center;
}
@media screen and (max-width: 768px) {
	.p-office-outline__content {
		margin-top: calc(20 * var(--width-ratio-1280));
	}
}

.p-office-outline__body {
	line-height: 2;
}

/*====================================================
p-office-access
====================================================*/
.p-office-access__inner {
	display: grid;
	grid-template-columns: calc(416 / 1680 * 100vw) 1fr;
	grid-template-columns: 416px 1fr;
	align-items: center;
	column-gap: calc(32 * var(--width-ratio-1280));
}

@media screen and (max-width: 768px) {
	.p-office-access__inner {
		display: block;
	}
}

.p-office-access__content {
}

@media screen and (max-width: 768px) {
	.p-office-access__btn {
		width: 100%;
	}
}

.p-office-access__map {
	overflow: hidden;
	border-radius: calc(24 * var(--width-ratio-1280));
	aspect-ratio: 642/364;
}
@media screen and (max-width: 768px) {
	.p-office-access__map {
		margin-top: calc(20 * var(--width-ratio-1280));
	}
}

.p-office-access__map iframe {
	display: block;
	width: 100%;
	height: 100%;
}