/*============================
#search
============================*/
section#search.search {
	background-color: var(--bgcolor-sub-secondary);
}

section#search.search div.search__container.container {
	padding: min(100vw / 750 * 24, 24px) 0;
	max-width: 1200px;
}

section#search.search div.search__container.container div.search__body {
	display: flex;
	justify-content: space-between;
	gap: min(100vw / 750 * 24, 24px);
	align-items: flex-start;
	flex-wrap: wrap;
}

section#search.search div.search__container.container div.search__body form {
	display: contents;
}

section#search.search div.search__container.container div.search__body form input {}

section#search.search div.search__container.container div.search__body form dl {
	flex: 1 1 auto;
	font-size: clamp(min(14px, 14 / 375 * 100vw / 2.6 + 9px), 14 / 1366 * 100vw, 14px);
}

section#search.search div.search__container.container div.search__body form dl.industry {
	flex: 1 0 20em;
}

section#search.search div.search__container.container div.search__body form dl.purpose {
	flex: 1 0 12em;
}

section#search.search div.search__container.container div.search__body form dl.expression {
	flex: 1 0 11em;
}

section#search.search div.search__container.container div.search__body form dl.duration {
	flex: 1 0 6em;
}

section#search.search div.search__container.container div.search__body form dl.production_time {
	flex: 1 0 6em;
}

section#search.search div.search__container.container div.search__body form dl.price {
	flex: 1 0 6em;
}


section#search.search div.search__container.container div.search__body form dl dt {
	padding: calc(1em / 20 * 4) calc(1em / 20 * (8 + 16 + 10)) calc(1em / 20 * 4) calc(1em / 20 * 8);
	font-size: clamp(min(18px, 18 / 375 * 100vw / 2.6 + 9px), 18 / 1366 * 100vw, 18px);
	font-style: normal;
	font-weight: 800;
	line-height: 140%;
	cursor: pointer;
	border-radius: calc(1em / 20 * 4);
	border: 1px solid #9E9E9E;
	position: relative;
}

section#search.search div.search__container.container div.search__body form dl dt:before,
section#search.search div.search__container.container div.search__body form dl dt:after {
	content: "";
	width: calc(1em / 20 * 16);
	height: calc(1em / 20 * 4);
	position: absolute;
	right: calc(1em / 20 * 8);
	top: 50%;
	transform: translateY(-50%);
	background: var(--button1-bgcolor);
	transition: 0.2s ease;
	transform-origin: center center;
}

section#search.search div.search__container.container div.search__body form dl dt:before {
	transform: translateY(-50%) rotate(-90deg);
}

section#search.search div.search__container.container div.search__body form dl dt.active:before {
	transform: translateY(-50%) rotate(0deg);
}


section#search.search div.search__container.container div.search__body form dl dd>div {
	margin-top: calc(1em / 14 * 12);
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100vw / 375 * 120, 120px), 1fr));
	gap: calc(1em / 14 * 16) calc(1em / 14 * 12);
}

@media screen and (max-width :834px) {
	section#search.search div.search__container.container div.search__body form dl dd {
		display: none;
	}

}

section#search.search div.search__container.container div.search__body form dl dd div {}

section#search.search div.search__container.container div.search__body form dl dd div label {
	font-weight: 400;
	line-height: 140%;
	display: flex;
	gap: 0.5em;
}

section#search.search div.search__container.container div.search__body form dl dd div label input {
	background-color: var(--bgcolor-primary);
	border: none;
	width: calc(1em / 14 * 16);
	height: calc(1em / 14 * 16);
}

section#search.search div.search__container.container div.search__body form dl dd div label input:checked {
	accent-color: var(--button1-bgcolor);
}


section#search.search div.search__container.container div.search__body form div.search__buttons.button {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: min(100vw / 750 * 24, 24px);
	width: 100%;
	margin-top: min(100vw / 750 * 24, 24px);
	font-size: clamp(min(16px, 16 / 375 * 100vw / 2.6 + 9px), 16 / 1366 * 100vw, 16px / 1366 * 1536);
}

section#search.search div.search__container.container div.search__body form div.search__buttons.button div.buttons__button {}

section#search.search div.search__container.container div.search__body form div.search__buttons.button div.buttons__button a {
	border: 1px solid #9e9e9e;
}

section#search.search div.search__container.container div.search__body form div.search__buttons.button div.buttons__button button.button-color1.button-style2 {}



/*============================
#works
============================*/
section#works.works {
	background-color: var(--bgcolor-secondary);
	padding-top: min(100vw / 750 * 56, 56px);
}

section#works.works div.works__container.container {
	max-width: calc(1366px - 160px);
}

section#works.works div.works__container.container h2 {}

section#works.works div.works__container.container h2 span.en {}

section#works.works div.works__container.container div.works__body {
	display: grid;
	gap: min(100vw / 750 * 24, 24px);
	grid-template-columns: repeat(auto-fill, minmax(min(100vw / 375 * 320, 320px), 1fr));
}

section#works.works div.works__container.container div.works__button {
	margin-top: min(100vw / 750 * 40, 40px);
	display: flex;
	justify-content: flex-end;
}

div.pagination {
	display: flex;
	padding-top: min(100vw / 750 * 80, 80px);
	justify-content: center;
	align-items: center;
	gap: min(100vw / 750 * 24, 24px);

	text-align: center;
	font-size: clamp(min(24px, 24 / 375 * 100vw / 2.6 + 9px), 24 / 1366 * 100vw, 24px / 1366 * 1536);
	font-style: normal;
	font-weight: 700;
	line-height: 100%;
}

div.pagination span.page-numbers.current {
	display: flex;
	width: calc(1em / 24 * 56);
	height: calc(1em / 24 * 56);
	justify-content: center;
	align-items: center;
	border-radius: 1000px;
	background: var(--text-color-primary);
	color: #fff;
}

div.pagination a {
	text-decoration: none;
}

div.pagination a.page-numbers {}

div.pagination a.page-numbers span.material-symbols-rounded {
	display: flex;
	width: calc(1em / 24 * 56);
	height: calc(1em / 24 * 56);
	justify-content: center;
	align-items: center;
	border-radius: 1000px;
	background: var(--button1-bgcolor);
	color: #fff;
}

div.pagination a.page-numbers.prev span.material-symbols-rounded {
	padding-left: 0.2em;
}