/* Filter & Search�֌W */
section.filter{
	background-color:#cccccc;
	padding:10px 0;
}
section.filter .container{
	max-width:680px;
	margin:0 auto;
}

section.filter #input-area{
	/* display:none; */
}
section.filter.open #input-area{
	/* display:block; */
}
section.filter.top_midle{
	padding-bottom:40px;
}
section.filter.top_midle #nab-area{
	display:none;
}
section.filter form{
	margin-top:30px;
}
section.filter form .row{
	width:100%;
	margin-top:20px;
}
section.filter input,
section.filter select,
section.filter button{
	border-radius: 0;
	width:100%;
}

section.filter .filter-item,
section.filter .search-item {
	padding:0;
	width:100%;
	max-width:210px;
	margin:0 12.5px;
}
section.filter .filter-item:first-of-type,
section.filter .search-item:first-of-type {
	margin-left:auto;
}
section.filter .filter-item:last-of-type,
section.filter .search-item:last-of-type {
	margin-right:auto;
}

section.filter .filter-item button{
	background-color: #777777;
	color:#FFFFFF;
}


section.filter .search-item {
	position: relative;
	display: flex;
}

section.filter .search-item button {
	border: none;
	background: none;
	color:#777;
	cursor: pointer;
	font-size: 18px;
	line-height:1;
	padding: .6em 6.75px;
	transition: 0.5s;
	position: absolute;
	width:auto;
}

section.filter .search-item input.form-control{
	background-color: #eaeaea;
	border:1px solid #999;
	color:#777;
	flex-grow: 1;
	font-size:12px;
	line-height:1.5;
	padding: 0.9em 0 0.9em 3.0em;
}

section.filter .search-item input:focus {
	box-shadow:none;
}

section.filter .search-item button:hover {
	color: #4eadb8;
	transform: scale(1.2);
}


section.filter #nab-area{
	padding:15px 0;
}
section.filter.open #nab-area{
	padding:25px 0;
}

section.filter #nab-area button{
	background-color: transparent;
	border: none;
	box-shadow:none;
	color:#221815;
	line-height:1;
}
section.filter #nab-area button span:after{
	content:"";
	display: inline-block;
	border-left: 1.5px solid;
	border-top: 1.5px solid;
	margin: 0 0 0 25px;
	transform: rotate(225deg);
	transition: transform .4s;
	position: relative;
	width: 10.75px;
	top: -3px;
	height: 10.75px;

}
section.filter.open #nab-area button span:after{
	transform: rotate(45deg);
	top: 3px;
}
@media (max-width: 679px){
	section.filter{
		padding:5px 0;
	}
	section.filter.open{
		padding:10px 0;
	}
	section.filter form,
	section.filter form .row{
		margin:0 0 0;
	}
	section.filter form .row:last-of-type{
		margin:10px 0 0;
		}

	section.filter .filter-item,
	section.filter .search-item {
		padding:0;
		width:calc(100% - 60px);
		max-width:none;
	}
	section.filter .filter-item{
		margin:10px 30px 0;
	}
	section.filter .search-item {
		margin:20px 30px 0;
	}
	section.filter .search-item:first-of-type{
		margin:40px 30px 0;
	}
	section.filter #nab-area{
		padding:0;
	}
	section.filter.open #nab-area{
		padding:20px 0 5px;
	}
	section.filter input,
	section.filter select,
	section.filter button{
		line-height:2.5;
	}

	section.filter .search-item button {
		font-size: 20px;
		line-height: 2.5;
		padding: 2.5px 0.75em;
	}


	section.filter .search-item input.form-control{
		font-size:16px;
	}
	section.filter #nab-area button{
		line-height:2.5;
	}





/* /Filter & Search�֌W */