body {
	font-family: "Yu Mincho", "YuMincho", serif;
}

body {
	font-weight: 400;
}

body {
	color: #333;
}

.u-desktop {
	display: none;
}

.framed-work-detail {
	padding-bottom: 6.25rem;
	font-family: "Noto Sans JP", sans-serif;
	padding-right: 0;
}

.framed-work-detail .detail__ttl {
	display: flex;
	flex-direction: column;
	gap: clamp(16px, 1.5rem, 30px);
	margin-bottom: clamp(30px, 1.875rem, 50px);
}

.framed-work-detail .detail__ttl__category {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(8px, 0.625rem, 20px);
}

.framed-work-detail .detail__ttl span {
	font-size: clamp(14px, 0.875rem, 18px);
	padding: clamp(6px, 0.375rem, 12px) clamp(18px, 1.125rem, 28px);
	color: #7D7C7C;
	border-radius: 4.5px;
	border: 1px solid #7D7C7C;
	width: fit-content;
}

.framed-work-detail .detail__ttl h1 {
	font-size: clamp(18px, 1.125rem, 28px);
	font-family: "Yu Mincho", "YuMincho", serif;
	font-weight: 400;
}

.framed-work-detail .detail__images {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem;
	margin-bottom: 2.5rem;
	justify-content: flex-start;
}

.framed-work-detail .detail__images img {
	aspect-ratio: 1/1;
	width: min(100%, 360px);
	background-color: #7D7C7C;
}

.framed-work-detail .detail__contents {
	display: flex;
	flex-direction: column;
	gap: clamp(40px, 2.5rem, 56px);
}

.framed-work-detail .detail__contents__item h4 {
	font-size: clamp(18px, 1rem, 20px);
	font-weight: 600;
	padding: 1.25rem 1.5625rem;
	background-color: #F8F7F3;
	margin-bottom: 2.1875rem;
}

.framed-work-detail .detail__contents__item p {
	font-size: clamp(14px, 1rem, 17px);
	font-weight: 300;
}

.framed-work-detail .detail__contents__item__table {
	border-collapse: collapse;
	margin: clamp(40px, 2.5rem, 75px) 0 clamp(30px, 1.875rem, 50px);
	width: 100%;
}

.framed-work-detail .detail__contents__item__table tr {
	display: flex;
	flex-direction: column;
}

.framed-work-detail .detail__contents__item__table tr.u-desktop {
	display: none;
}

.framed-work-detail .detail__contents__item__table tr th,
.framed-work-detail .detail__contents__item__table tr td {
	font-size: clamp(14px, 1rem, 17px);
	font-weight: 400;
}

.framed-work-detail .detail__contents__item__table tr th {
	background-color: #F8F7F3;
	padding: 0.9375rem;
	text-align: left;
	border: 1px none;
	width: 100%;
}

.framed-work-detail .detail__contents__item__table tr td {
	padding: 0.9375rem;
	border-top: none;
	width: 100%;
}

.framed-work-detail .detail__contents__item__table tr:last-of-type td {
	border-bottom: none;
}

.framed-work-detail .detail__contents__item__caption {
	font-size: 1.125rem;
}

.framed-work-detail .detail__contents__item__button {
	margin-top: clamp(50px, 3.125rem, 80px);
	display: flex;
	justify-content: center;
	align-items: center;
}

.framed-work-detail .detail__contents__item__button a {
	max-width: 480px;
	margin: 0 auto;
}

@media screen and (min-width: 1001px) {

.u-desktop {
	display: block;
}

.u-mobile {
	display: none;
}

.framed-work-detail {
	padding-right: 5%;
	padding-bottom: 8.75rem;
}

.framed-work-detail .detail__ttl {
	gap: 2.0625rem;
	margin-bottom: 4.75rem;
}

.framed-work-detail .detail__ttl span {
	font-size: 1rem;
	padding: 0.375rem 1.5625rem;
}

.framed-work-detail .detail__ttl h1 {
	font-size: 2.0625rem;
}

.framed-work-detail .detail__images {
	flex-direction: row;
	gap: 2.5rem;
	margin-bottom: 4.6875rem;
}

.framed-work-detail .detail__images img {
	width: 21rem;
}

.framed-work-detail .detail__contents {
	gap: 3.5rem;
}

.framed-work-detail .detail__contents__item h4 {
	font-size: 1.125rem;
	padding: 1.25rem 1.5625rem;
}

.framed-work-detail .detail__contents__item p {
	font-size: 1.0625rem;
}

.framed-work-detail .detail__contents__item__table {
	margin: 5.625rem 0 2.875rem;
}

.framed-work-detail .detail__contents__item__table tr {
	flex-direction: row;
	justify-content: space-between;
}

.framed-work-detail .detail__contents__item__table tr.u-desktop {
	display: flex;
}

.framed-work-detail .detail__contents__item__table tr th,
.framed-work-detail .detail__contents__item__table tr td {
	font-size: 1.0625rem;
}

.framed-work-detail .detail__contents__item__table tr th {
	width: 30%;
	padding: 1.875rem;
	border-bottom: 1px solid #fff;
}

.framed-work-detail .detail__contents__item__table tr td {
	width: 70%;
	padding: 1.875rem 0.75rem;
	border-top: 1px solid #BCB9B9;
}

.framed-work-detail .detail__contents__item__table tr:last-of-type td {
	border-bottom: 1px solid #BCB9B9;
}

.framed-work-detail .detail__contents__item__button {
	margin-top: 7.5rem;
}

}


/*# sourceMappingURL=framed-work-detail.css.map */