#Outline > #Contents > div.search {
	margin: 20px 0 0 0;
	border-radius: 10px;
	border: 2px solid var(--contents-color);
	width: 100%;
	background-color: var(--contents-bg-color);
	overflow: hidden;
	box-sizing: border-box;
}
#Outline > #Contents > div.search > header {
	position: relative;
	width: 100%;
	height: 40px;
	line-height: 40px;
	font-size: 1rem;
	font-weight: var(--font-weight-bold);
	text-align: center;
	background-color: #fff;
	cursor: pointer;
}
#Outline > #Contents > div.search > header > button {
	position: absolute;
	border: none;
	top: 10px; right: 30px;
	width: 20px;
	height: 20px;
	background-color: #fff;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
#Outline > #Contents > div.search > header > button {
	background-image: url('../../../../file/parts/button.search.open.svg')
}
#Outline > #Contents > div.search.open > header > button {
	background-image: url('../../../../file/parts/button.search.close.svg')
}

#Outline > #Contents > div.search form {
	display: none;
}
#Outline > #Contents > div.search.open > form {
	display: block;
}


#Outline > #Contents > div.search dl {
	margin:  10px auto 0;
	width: calc(100% - 40px);
	max-width: none;
	gap: 0;
}
#Outline > #Contents > div.search dl > dt,
#Outline > #Contents > div.search dl > dd {
	padding:  10px 0;
	font-size: 0.9rem;
}
#Outline > #Contents > div.search dl > dt:not(:first-child),
#Outline > #Contents > div.search dl > dt:not(:first-child) + dd {
	border-top: 1px solid var(--base-color);
}
#Outline > #Contents > div.search dl > dd label {
	display: inline-block;
	width: 220px;
}
#Outline > #Contents > div.search dl > dd input {
	font-size: inherit;
	padding: 0.1em 0.2em;
}
#Outline > #Contents > div.search .button {
	margin: 20px 0;
}
#Outline > #Contents > div.search .button > a,
#Outline > #Contents > div.search .button > button {
	color: var(--base-color);
	background-color: #fff;
	filter: drop-shadow(2px 2px 0 #fff);
}