/* 공통 */
.search-container{
    display: flex;
    gap: 20px;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}

.search-box{
    /* box-shadow: 0 4px 6px -1px #0000001a, 0 -2px 8px -1px #0000000f; */
		width: 100%;
}

.search-res{
    width: 77%;
    transition: width 0.5s ease;
}

.search-res .res-box{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}

.res-search{
    display: flex;
    font-size: .9em;
}

.search-res .res-box .search-input{
    border: none;
    width: 100%;
    height: 100%;
    padding: 0 15px;
    box-sizing: border-box;
    -webkit-appearance: none;
    background: #fff;
    color: #222 !important;
    font-size: 1.118em !important;
    letter-spacing: -0.045em;
    vertical-align: middle;
}

.input_box{
    width: 100%;
    height: 64px;
    position: relative;
    box-sizing: border-box;
    min-width: 300px;
}

.input_box a.search{
    width: 27px;
    height: 27px;
    background: url(/images/icon/ico_search_gray.png) no-repeat;
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
    text-decoration: none;
}

.btn_box{
    height: 64px;
    position: relative;
    box-sizing: border-box;
    width: 155px;
    margin-left: 5px;
}

.btn_box a{
    background-color: #0750bf;
    color: #fff !important;
    height: 100%;
    display: flex;
    text-decoration: none;
    align-items: center;
    justify-content: center;
}

.search-fav{
    min-width: 300px;
}

.search-box .search-title{
    padding: 15px 30px;
    text-align: left;
    font-size: 1.3em;
    background: #ecf3f6;
    display: flex;
    align-items: center;
	font-weight: 700;
}

.res-top-btn{
    display: flex;
    justify-content: space-between;
    padding: 5px;
}

/* 접기/펼치기 버튼 */
.filterBtnArea {
		display:flex;
		/* align-items: center; */
}

.search-title {
	height: 65px !important;
}

.pc{
		display: flex;
}

.mobile{
		display: none;
}	

.filterBtn {
	width: 35px;
	height: 65px;
	cursor: pointer;
	background-color: #294063;
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* -------------------------- pc --------------------------- */

@media only screen and (min-width:1025px){
	.search-filter {
		display:flex;
		transition: width 0.5s ease, min-width 0.5s ease;
		width:20%;
		min-width:430px;
		gap:5px;
	}	
	
	input[type="date"] {
		/* padding-left: 0; */
		text-align: right;
	}

	/* 접기 상태일때 필터 글자 */
	.search-box.closed ~ .filterBtnArea .filterF {
		display: block !important;
	}

	.search-box.closed ~ .filterBtnArea .filterA {
		transform: rotate(180deg) !important;
	}

	.search-box.closed ~ .filterBtnArea .filterA {
		transform: rotate(180deg) !important;
	}

	.search-box.closed ~ .filterBtnArea .filterBtn {
		margin-left: -30px;
	}
	
	.filter-data2 table tr th, .filter-data table tr td {
		/* padding: 0 !important; */
	}
	
	.filterA {
		display: inline-block; 
		width: 17px;
		height: 14px;
		background: url(/images/fs/common/snb_btn.png) no-repeat center;
		background-size: contain; /* 아이콘 크기 자동 조정 (옵션) */
	}

	.filterF {
		color: white;
		display: none;
		writing-mode: vertical-rl;  /* 세로쓰기 */
		text-orientation: upright;  /* 글자 회전 방지 */
	}	
}	 


/* ------------------------ mobile ------------------------- */
@media only screen and (max-width:1024px) {
	.pc{
			display: none;
	}
	
	.mobile{
			display: flex;
	}		

	.search-fav{
			width: 100%;
	}	
	
	.filterBtnArea {
		justify-content: center;
	}
	
	.filterF {
		display: none;
	}
	
	.filterBtn {
    width: 100px !important;
    height: 15px !important;
		border-radius: 0 0 5px 5px !important;
		position:unset !important;
	}	
	
	.filter-box:has(.filpDiv.closed) ~ .filterBtnArea .filterBtn::after {
		transform: rotate(-90deg) !important;
	}
	
	.filterBtnArea .filterBtn::after {
		content: ''; 
		display: inline-block; 
		width: 10px;
		height: 10px;
		background: url(/images/fs/common/snb_btn.png) no-repeat center;
		background-size: contain; /* 아이콘 크기 자동 조정 (옵션) */
		transform:rotate(90deg);
	}
	
	
	
	.search-container {
		display: flex;
		gap: 20px;
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-between;
	}

	.page_nav {
			width: 100% !important;
			text-align: center !important;
			padding: 0 !important;
			margin-top: 0 !important;
			margin-bottom: 10px !important;
	}

	.res-search {
			flex-direction: column;
	}

	.btn_box {
			width: 100% !important;
			margin: 10px 0 0 0 !important;
	}

	.search-input {
			height: 64px !important;
	}

	.search-res{
			width: 100% !important;
	}

	.search-filter {
			min-width: 100% !important;
			width: 100% !important;
			transform: scaleX(1);
	}
	
	.search-filter.closed {
			transform: scaleX(0);
			opacity: 0;
	}	
	
	.form_table{
			border: none !important;
	}	
	
	/* 접기/펼치기 */
	.fav-contents {
			max-height: 500px;
			overflow: hidden;
			transition: max-height 0.4s ease;
	}

	.fav-contents.closed {
			max-height: 0;
	}	
	
	.filpDiv {
			max-height: 1500px;
			overflow: hidden;
			transition: max-height 0.4s ease;
	}

	.filpDiv.closed {
			max-height: 0;
	}
	
	.ulDropDown {
			width: 27px;
			height: 27px;
			background: url(/images/arrow-down-square.svg) no-repeat center;
			position: absolute;
			left: 6px;
			top: 13px;
			cursor: pointer;
			transition: transform 0.3s ease;
	}
	
	.search-box .search-title{
			padding: 15px 15px;
	}
	
	input[type="date"] {padding-left:30px !important; background:url("/images/fs/common/date.png") no-repeat left 5px center #fff !important;}

}