@charset "UTF-8";
/* dvh */
.searchPage [class^='icon-'] span[class^="icon"] {position:relative;display:flex;align-items: center;justify-content: center;width:40px;height: 50px;}
.searchPage [class^='icon-'] span[class^="icon"]::before {content:"";display: flex;align-items: center;justify-content: center;background-image: url('https://icon.feelway.com/recent/common/icon/spIcon_commons.png');background-repeat:no-repeat;background-size: 250px;}

.commSearchBar {position:fixed;top:0;left:0;right:0;display:flex;align-items:center;height:50px;border-bottom:1px solid #e2e2e2;background-color:#fff;transform: translateZ(0);backface-visibility: hidden;z-index:100;box-sizing:border-box;}
.commSearchBar span[class^="icon"].iconPrevBtn:before {width:12px;height:20px;background-position: -21px -191px;}
.commSearchBar .searchBox {flex:1 1 0;min-width:0;padding:8px 0;margin-right:6px;border:0;height:45px;line-height:45px;}
.commSearchBar .searchBox .searchBox__input {height:100%; min-width:0;}
.commSearchBar .searchBox,
.commSearchBar .searchBox .searchBox__input {font-size:16px;}
.commSearchBar .searchBox [class^='icon-'] span[class^="icon"]::before {background-size: 166px;}
.commSearchBar__function {display: flex;align-items: center;margin-right:6px;}
.commSearchBar__function [class^='icon-'] span[class^="icon"]::before {content: "";width:20px;height:22px;background-size: 166px;}
.commSearchBar__function span[class^="icon"].iconSearch::before {background-position: -28px -33px;}
.commSearchBar__function .iconSearchBtn::before {background-position: -29px -32px;}
.commSearchBar__function .icon-imgSearch {display: flex;align-items: center;justify-content: center;border: none;padding: 0;width: 40px;height: 50px;background: url('//icon.feelway.com/recent/common/icon/icon_imgSearch.png') no-repeat 50% / 24px;}

.searchContent {padding-top:50px;padding-bottom:100px;}
.searchPageContent__section {padding:24px 0;}
.searchPageContent__header {display:flex;justify-content: space-between;align-items: center;padding:0 15px;margin-bottom:12px;}
.searchPageContent__title {font-size:16px;color:#222;font-family:"Pretendard SemiBold";}
.searchPageContent__function {font-size:12px;color:#aaa;}
.searchPageContent__section.searchHistory {background-color: #f5f5f5;}

/* 데이터가 없을때 */
.searchPageContent__empty {display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;margin-top:30px;text-align:center;}
.searchPageContent__emptyText {font-size:13px;color:#aaa;line-height:1.4}
.searchPageContent__empty .searchPageBtn {padding: 8px 12px;}
.searchPageContent__section.searchHistory .searchPageContent__empty .searchPageBtn {min-width:120px}
.searchPageContent__empty.hasIcon:before {content: "";display: inline-flex;width: 56px;height: 56px;background: url("../../../img_1.5/icon-no-result.png") no-repeat 0 0;background-size: 100% auto;}
.searchPageBtn {display:inline-flex;align-items:center;justify-content:center;border:1px solid #d5d5d5;border-radius:8px;background-color:#fff;font-size:13px;color:#222;overflow:hidden}

/* 실시간 인기 */
.searchPageContent__body:has(.trendingRankingList) {overflow: hidden;}
.trendingRankingList__headerSection {display: flex;align-items:center;justify-content:space-between;padding-right: 15px;margin-bottom:10px;}
.trendingRankingList__tabMenu {display: flex;gap: 5px;padding-left:15px;overflow: hidden;overflow-x: auto;max-width: calc(100% - 70px);white-space: nowrap;-webkit-overflow-scrolling: touch;-ms-overflow-style: none;scrollbar-width: none;}
.trendingRankingList__tabMenu::-webkit-scrollbar {display: none;}
.trendingRankingList__tabButton {padding: 8px 12px;background: #fff;border: 1px solid #d5d5d5;border-radius: 16px;color: #666;font-size: 12px;transition: all 0.2s ease;white-space: nowrap;line-height:1;}
.trendingRankingList__tabButton.active {background: #222;color: #fff;border-color:#222;}
.trendingRankingList__actionArea {display: flex;justify-content: flex-end;}
.trendingRankingList__actionList {display: flex;}
.trendingRankingList__actionItem {display: none;line-height:1;}
.trendingRankingList__actionItem.active {display: flex;}
.trendingRankingList__dateInfo {padding: 8px 0;color: #aaa;font-size: 12px;flex-shrink:0;}
.trendingRankingList__actionButton {padding: 8px 0;color: #aaa;font-size: 12px;line-height:1;}
.trendingRankingList__contentSection.swiper-container {padding-left:20px;-webkit-mask-image:linear-gradient(to right, black 80%, transparent 100%);mask-image:linear-gradient(to right, black 80%, transparent 100%);}
.trendingRankingList__contentSection .swiper-slide {width:calc(100% - 70px);}
.trendingRankingList__contentSection .swiper-slide:last-child {padding-right:30px;}
.trendingRankingList__contentSection .swiper-slide.only-empty {width:100% !important;}
.trendingRankingList__contentSection .swiper-pagination {position: relative;margin-top: 20px;}
.trendingRankingList__contentSection .swiper-pagination-bullet {width: 8px;height: 8px;background: #ddd;border-radius: 50%;margin: 0 4px;cursor: pointer;transition: all 0.2s ease;}
.trendingRankingList__contentSection .swiper-pagination-bullet-active {background: #333;transform: scale(1.2);}
.trendingRankingList__contentSection.swiper-container:has(.swiper-pagination-bullet-progressbar) {position: static;}
.trendingRankingList__contentSection.swiper-container-horizontal > .swiper-pagination-bullet-progressbar {width: 260px;height: 3px;top: auto;bottom: 0;left: calc(50% - 10px);transform: translateX(-50%);background: #eee;z-index: 0;}
.trendingRankingList__contentSection.swiper-container-horizontal > .swiper-pagination-bullet-progressbar .swiper-pagination-bullet {background-color: #eee;width: 100%;height: 100%;display: inline-block;border-radius: 0;opacity: 1;}
.trendingRankingList__contentSection.swiper-container-horizontal > .swiper-pagination-bullet-progressbar .swiper-pagination-bullet.swiper-pagination-bullet-active,
.trendingRankingList__contentSection.swiper-container-horizontal > .swiper-pagination-bullet-progressbar.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background-color: #169dab;}
.trendingRankingList__contentSection .rankingLink {display: flex;align-items: center;gap: 6px;padding: 8px 0;line-height: 1;}
.trendingRankingList__contentSection .rankingLink .rankNumber {font-family: "Pretendard SemiBold";font-size: 14px;font-weight: 600;color: #333;min-width: 16px;}
.trendingRankingList__contentSection .rankingLink .keyword {flex: 1;font-size: 12px;color: #333;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
.trendingRankingList__contentSection .rankingLink .rankingValue {display: flex;align-items: center;justify-content: center;font-size:12px;}
.trendingRankingList__contentSection .rankingLink .rankingValue.equal {min-width:32px;padding-left:0;}
.trendingRankingList__contentSection .rankingLink .rankingValue.equal:before {content:"";position:relative;top:auto;left:auto;width:10px;height: 2px;background: #999;transform: none;}
.trendingRankingList__contentSection .rankingLink .rankChange {position: relative;padding-left: 6px;gap: 4px;min-width: 20px;text-align: center;color: #999;}
.trendingRankingList__contentSection .rankingLink .rankChange:before {content:"";position: absolute;left: 0;top: 50%;transform: translateY(-50%);}
.trendingRankingList__contentSection .rankingLink .rankChange.up::before,
.trendingRankingList__contentSection .rankingLink .rankChange.down::before {width: 0;height: 0;border-left: 3px solid transparent;border-right: 3px solid transparent;background: transparent;}
.trendingRankingList__contentSection .rankingLink .rankChange.up::before {border-bottom: 6px solid #d6080e;}
.trendingRankingList__contentSection .rankingLink .rankChange.down::before {border-top: 6px solid #999;}
.trendingRankingList__contentSection .rankingLink .discountRate {min-width:32px;color: #d6080e;}
.trendingRankingList__contentSection .rankingLink .satisfactionRate {min-width:32px;color: #999;}
.trendingRankingList__contentSection .slideSeller .rankingLink .sellerIconGrade {margin-top:0;font-size:12px;color:#333;}
.trendingRankingList__contentSection .slideSeller .rankingLink .keyword {display:flex;align-items: center;gap:6px;}
.trendingRankingList__contentSection .slideSeller .rankingLink .sellerBadge {display:flex;align-items:center;padding:0 6px;height:15px;background-color:#169dab;color:#fff;font-size:10px;line-height:15px;border-radius: 10px;}

.trendingRankingList__contentSection .slideSearch .rankingList,
.trendingRankingList__contentSection .slideBrand .rankingList {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(5, minmax(0, auto));
    grid-auto-flow: column;
    column-gap: 12px;
    /* padding-right: 20px; */
}
/* .trendingRankingList__contentSection .swiper-slide-next {
    opacity: 0.35;
    transition: opacity 0.2s ease;
} */

/* 최근 탐색 */
.recentSearchList {display:flex;flex-direction:column;gap:8px;}
.recentSearchList__item {display:flex;gap: 8px;padding: 0 15px;overflow-x: auto;overflow-y: hidden;white-space: nowrap;scrollbar-width: none;-ms-overflow-style: none;}
.recentSearchList__item::-webkit-scrollbar {display: none;}
.recentSearchList__item .tagItem {flex: 0 0 auto;display: inline-flex;white-space: nowrap;}
.recentSearchList__item .tagItem__link {flex: 1;padding: 8px 0 8px 12px;border: none;background: transparent;font-size: inherit;color: inherit;cursor: pointer;display: flex;align-items: center;}
.recentSearchList__item .tagItem__delete {flex: 0 0 auto;width: 32px;height: 32px;padding: 0;border: none;background: transparent;cursor: pointer;display: flex;align-items: center;justify-content: center;}
.recentSearchList__item .tagItem__text {white-space: nowrap;}
.recentSearchList__item .tagItem__delete .iconDelete {width: 20px;height: 20px;background: url('//icon.feelway.com/recent/mo/mypage/ico_close@2x.png') no-repeat center / 10px 10px;}

/* 최근본상품 */
.viewedHistoryList .goodsList {display: flex;flex-wrap: nowrap;justify-content:flex-start;gap: 12px;overflow-x: auto;overflow-y: hidden;white-space: nowrap;scrollbar-width: none;-ms-overflow-style: none;padding: 0 15px;}
.viewedHistoryList .goodsList::-webkit-scrollbar {display: none;}
.viewedHistoryList .goodsList__item {flex: 0 0 auto;width: 140px;}
.viewedHistoryList .goodsList__item .productPage {display: block;width: 100%;white-space: normal;}
.viewedHistoryList .goodsList__item .brandName .brandNameTxt {display:inline-flex;}

/* 검색결과 */
.searchContent .sideFinderKeyword__header{margin-block-end:0;}
.searchContent .isSideFinderKeyword .sideFinderKeyword .popularKeyword .swiper-wrapper{height:auto;}
.searchContent .brandSearchResults {margin-top:20px;}
.searchContent .brandSearchResults .searchWord {color: #ec5026;font-family: 'Pretendard SemiBold';}
.searchContent .brandSearchBestProduct__title {padding: 0 15px;margin: 15px 0 10px;color: #222;font-size: 15px;font-family: 'Pretendard SemiBold';}
.brandSearchBestProduct .goodsList {display: flex;flex-wrap: nowrap;justify-content:flex-start;gap: 12px;height:auto;overflow-x: auto;overflow-y: hidden;white-space: nowrap;scrollbar-width: none;-ms-overflow-style: none;padding: 0 15px;}
.brandSearchBestProduct .goodsList::-webkit-scrollbar {display: none;}
.brandSearchBestProduct .goodsList .goodsList__item {width: 120px;}
.brandSearchBestProduct .goodsList .powerProduct__dc {margin-top:3px;color: #ec5026;font-size: 10px;}
.brandSearchBestProduct .goodsList .goodsList__item .goodsTitle {display: block;-webkit-line-clamp: none;-webkit-box-orient: initial;white-space: nowrap;}
.brandSearchBestProduct .goodsList .sellerIconGrade{margin-top:3px;}

/* 스켈레톤 공통 */
.skeleton {position: relative;display: block;overflow: hidden;background: #ececec;border-radius: 2px;}
.skeleton::after {content: "";position: absolute;top: 0;left: -120px;width: 80px;height: 100%;background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 50%, rgba(255,255,255,0) 100%);animation: shimmer 1.4s infinite;}
.skeleton.round {border-radius: 999px;}
.skeleton.circle {border-radius: 50%;}
@keyframes shimmer {0% {left: -120px;} 100% {left: 100%;}}

/* 스켈레톤 - 실시간 인기 */
.skeletonTrendContent .skeletonHeaderTitle {width: 84px;height: 18px;}
.skeletonTrendContent .skeletonTabMenu {display: flex;gap: 8px;}
.skeletonTrendContent .skeletonTab {height: 28px;}
.skeletonTrendContent .skeletonTab.search {width: 56px;}
.skeletonTrendContent .skeletonTab.brand {width: 58px;}
.skeletonTrendContent .skeletonTab.luxury {width: 46px;}
.skeletonTrendContent .skeletonTab.seller {width: 58px;}
.skeletonTrendContent .skeletonAction {width: 52px;height: 12px;}
.skeletonTrendContent .skeletonRankingList {margin: 0;padding: 0;list-style: none;}
.skeletonTrendContent .trendingRankingList__contentSection .swiper-slide {padding: 0 30px 0 0;}
.skeletonTrendContent .slideSearch .rankingList,.skeletonTrendContent .slideBrand .rankingList {display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-template-rows: repeat(5, minmax(0, auto));grid-auto-flow: column;column-gap: 12px;}
.skeletonTrendContent .skeletonRankingLink {display: flex;align-items: center;gap: 10px;}
.skeletonTrendContent .skeletonRank {width: 15px;height: 15px;flex: 0 0 15px;}
.skeletonTrendContent .skeletonKeyword {flex: 1 1 auto;min-width: 0;height: 12px;}
.skeletonTrendContent .trendingRankingList__contentSection {position: relative;padding-bottom: 26px;}
.skeletonTrendContent .skeletonPagination {position: absolute;top: auto;bottom: 0;left: 50%;width: 260px;height: 3px;transform: translateX(-50%);border-radius: 999px;z-index: 0;}

/* 스켈레톤 - 최근본상품 */
.skeletonViewedHistory .skeletonHeaderTitle {width: 72px;height: 16px;}
.skeletonViewedHistory .skeletonHeaderAction {width: 40px;height: 12px;}
.skeletonViewedHistory .skeletonGoodsList {display: flex;gap: 12px;margin: 0;padding: 0 15px;list-style: none;overflow: hidden;}
.skeletonViewedHistory .skeletonGoodsItem {flex: 0 0 140px;}
.skeletonViewedHistory .skeletonThumbImg {width: 140px;height: 140px;}
.skeletonViewedHistory .skeletonBrandName {width: 60%;height: 11px;margin-top: 8px;}
.skeletonViewedHistory .skeletonGoodsTitle {width: 90%;height: 11px;margin-top: 4px;}
.skeletonViewedHistory .skeletonGoodsTitle.short {width: 70%;}
.skeletonViewedHistory .skeletonPrice {width: 50%;height: 13px;margin-top: 4px;}