@charset "UTF-8";
/*** 施工事例詳細（single-works.php）専用スタイル ***/

.boxWorksShowroomPics .boxImg img {
	max-width: 544px;
}
@media only screen and (max-width: 750px) {
	.boxWorksShowroomPics .boxImg img {
		max-width: 100%;
	}
}

/* ========================================
   施工レポートセクション
   ======================================== */
.works-construction-report {
	margin-block: clamp(40px, calc(1.29vw + 35.15px), 60px);
	box-sizing: border-box;
}

.construction-report-content {
	display: flex;
	flex-direction: column;
	gap: clamp(28px, calc(2.07vw + 20.23px), 60px);
	box-sizing: border-box;
}

/* セクション（施工前、施工後、おわりに） */
.report-section {
	display: flex;
	flex-direction: column;
	gap: 28px;
	box-sizing: border-box;
}

/* セクションタイトル */
.report-section-title-wrapper {
	display: flex;
	justify-content: center;
	box-sizing: border-box;
}

.report-section-title {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: clamp(18px, calc(0.388vw + 16.55px), 24px);
	font-weight: 700;
	letter-spacing: 3.36px;
	color: var(--color-brand);
	border-bottom: 1px solid var(--color-brand);
	padding: 8px;
	margin: 0;
	box-sizing: border-box;
}

/* レポートアイテムグリッド（2カラム） */
.report-items-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: clamp(24px, calc(1.55vw + 18.18px), 48px);
	justify-content: center;
	box-sizing: border-box;
}

/* レポートアイテム */
.report-item {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding-bottom: clamp(0px, calc(2.33vw - 8.74px), 36px);
	box-sizing: border-box;
}

.report-item-title {
	font-size: 17px;
	font-weight: 600;
	line-height: 1.4;
	color: #191a19;
	padding-inline: 4px;
	margin: 0;
	box-sizing: border-box;
}

.report-item-image-wrapper {
	width: 100%;
	box-sizing: border-box;
}

.report-item-image-wrapper a {
	display: block;
	width: 100%;
	aspect-ratio: 327 / 239;
	overflow: hidden;
	background-color: #d9d9d9;
	box-sizing: border-box;
}

.report-item-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.report-item-text {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: clamp(14px, calc(0.259vw + 13.03px), 18px);
	font-weight: 400;
	line-height: 2;
	color: #191a19;
	padding-inline: 4px;
	margin: 0;
	box-sizing: border-box;
}

/* レスポンシブ対応（タブレット以下） */
@media only screen and (max-width: 1280px) {
	.report-items-grid {
		padding-inline: 40px;
	}
}

/* スマホ版 */
@media only screen and (max-width: 767px) {
	.report-tab-nav {
		gap: 0;
		margin-block: 20px;
	}

	.report-tab-button {
		font-size: 16px;
		letter-spacing: 2px;
		padding: 6px 16px;
	}

	.report-section-title {
		letter-spacing: 1.44px;
	}

	.report-items-grid {
		grid-template-columns: 1fr;
		padding-inline: 0;
	}

	.report-item-text {
		line-height: 1.8;
	}
}