.filter-list {
width: calc(100% - 22.1rem);
display: flex;
flex-wrap: wrap;
}
.filter-item {
width: 100%;
padding-right: 1.6rem;
}
.filter-btn {
position: absolute;
width: 0;
height: 0;
overflow: hidden;
opacity: 0;
visibility: hidden;
}
.filter-btn .btn {
width: 100%;
padding: 0 2.2rem;
}
.filter-select {
position: relative;
width: 100%;
background: var(--white-color);
color: var(--primary-color);
}
.filter-select .filter-selectBtn {
background: var(--white-color);
font-size: 1.6rem;
padding: 1.2rem 4.8rem 1.2rem 1.6rem;
line-height: 2.4rem;
border: 1px solid #e3ecf8;
border-radius: 0.4rem;
box-sizing: border-box;
width: 100%;
cursor: pointer;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.filter-select .filter-selectBtn:after {
position: absolute;
font-family: 'Material Symbols Outlined';
content: "\e5cf";
height: 4rem;
width: 4rem;
top: 0.4rem;
right: 0.8rem;
font-size: 2.4rem;
display: flex;
align-items: center;
justify-content: center;
transition: 0.2s ease;
}
.filter-select .filter-selectBtn.toggle {
border-radius: 0.4rem 0.4rem 0 0;
}
.filter-select .filter-selectBtn.toggle:after {
transform: rotate(-180deg);
}
.filter-select .filter-selectDropdown {
position: absolute;
top: 100%;
width: 100%;
border-radius: 0 0 0.4rem 0.4rem;
max-height: 25rem;
overflow: hidden;
overflow-y: auto;
background: var(--white-color);
border: 1px solid #e3ecf8;
border-top: 0;
z-index: 1;
-webkit-transform: scale(1, 0);
transform: scale(1, 0);
-webkit-transform-origin: top center;
transform-origin: top center;
visibility: hidden;
transition: 0.2s ease;
}
.filter-select .filter-selectDropdown .filterOption {
padding: 1rem 1.6rem;
box-sizing: border-box;
cursor: pointer;
line-height: 2.4rem;
font-size: 1.6rem;
}
.filter-select .filter-selectDropdown .filterOption:hover {
background: #f8f8f8;
}
.filter-select .filter-selectDropdown.toggle {
visibility: visible;
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
} body:has(.sec-search) .breadcrumbs-outer {
position: relative;
margin-bottom: 3.2rem;
} @media (max-width: 1780px) {
.research-price .tooltip-box::before {
left: 0;
right: -9px;
top: auto;
bottom: -9px;
margin: auto;
transform: rotate(-90deg);
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.research-price .tooltip-box::before {
right: 0px;
}
}
@media (min-width: 1780px) {
.research-price p {
text-align: left;
}
}
@media (max-width: 1780px) {
.research-price .tooltip-box {
padding: 2rem;
left: 0;
transform: translate(calc(-50% + 7px), calc(-100% - 24px));
}
}
@media (min-width: 992px) and (max-width: 1780px) {
.research-price p {
text-align: center;
}
}
.research-price {
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: end; width: 19rem;
}
.research-text {
width: calc(100% - 19rem);
}
.research-price .additional-price small {
font-size: 1.2rem!important;
line-height: 1.8rem;
color: #96A3BA;
}
.additional-price {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
}
.research-price .material-symbols-outlined {
display: grid;
}
.research-list + .pagination-list {
margin-bottom: 7.2rem;
}
.hide-desktop  {
display: none;
}
@media (max-width: 767px) {
.hide-desktop {
display: block;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sec-search .col-lg-3 {
width: 33%;
}
.sec-search .col-lg-9 {
width: 67%;
}
.research-price .tooltip-box {
min-width: 28rem;
padding: 2rem;
transform: translate(calc(-50% + 12px), calc(-100% - 30px));
}
.filter-list {
width: calc(100% - 20rem);
}
.filter-item {
padding-right: 0.8rem;
}
.filter-btn {
width: 20rem;
}
.research-list + .pagination-list {
margin-bottom: 4rem;
}
}
@media (min-width: 1780px) {
.research-price .tooltip-box {
left: 2.9rem;
}
}
@media(min-width:768px) and (max-width:991.98px) {
.sec-search .col-lg-3 {
width: 40%;
}
.sec-search .col-lg-9 {
width: 60%;
}
.filter-outer {
padding-bottom: 0;
}
.filter-list {
width: 100%;
}
.filter-item {
width: 100%;
padding-right: 0;
margin-bottom: 2.4rem;
}
.filter-btn {
width: 100%;
}
.research-list + .pagination-list {
margin-bottom: 4rem;
}
}
@media(max-width:767.98px) {
.filter-outer {
padding-bottom: 0;
}
.filter-list {
width: 100%;
}
.filter-item {
width: 100%;
padding-right: 0;
margin-bottom: 2.4rem;
}
.filter-select .filter-selectBtn {
font-size: 1.4rem;
padding: 0.7rem 4.8rem 0.7rem 1.6rem;
}
.filter-btn {
width: 100%;
}
.research-list + .pagination-list {
margin-bottom: 0;
}
}
.research-price .research-price-info {
display: flex;
align-items: center;
gap: 0.8rem;
}