@charset "utf-8";

*{word-break: keep-all; line-height:1.4;}
.bg{background-color:var(--primary-bg); }
.saleList{padding:40px 0;}
.saleList+.saleList{padding-top:20px;border-top:0px solid #e1e1e1}
.saleList .inner{max-width:1920px;width:100%;margin:0 auto; padding:0 15px;}
/* .saleList .feature_wrap .inner{max-width:1920px; } */
/* 타이틀 */
.saleList .top_tit{margin-bottom:50px;}
.saleList .tit_txt{font-size:35px;text-align:center;color:#333; /* font-family:'GmarketSansMedium'; */ font-weight:700}
/* .saleList.bg .tit_txt{color:#333;} */

.slider_wrap{position: relative; z-index:1;}
.main_wrap{position: relative; z-index:2;}

/*메인 여백 정리*/
.main_wrap{display:flex; flex-direction:column; gap:15px; padding-bottom:30px;}
.main_wrap .saleList{padding:0;}

.tit{font-size:18px; font-weight:700; }
.desc{font-size:14px; font-weight:400; color:#777;}
.img_box{max-width:80px;}
/* 탭 */
.saleList .tabs.tit_txt{display:flex;justify-content:center}
.saleList .tabs.tit_txt li{position:relative;margin:0 30px;color:#aaa;transition:all .3s;cursor:pointer}
.saleList .tabs.tit_txt li.on{color:#222}
.saleList .tabs.tit_txt li+li:before{position:absolute;left:-30px;top:13px;content:'';width:1px;height:31px;background:#e1e1e1}
.saleList .landTab{display:none;transition:all .3s}

/* 더보기  */
.saleList .more_btn{display:block;width:245px;height:75px;margin:70px auto 0;border:none;border-radius:50px;font-size:16px;color:#222;line-height:75px;text-align:center;background-color:#f5f5f5;;transition:all .2s;font-family:'GmarketSansMedium'}
.saleList .more_btn svg{vertical-align:middle;width:20px;margin-left:10px}
.saleList.bg .more_btn{border:none;background-color:#fff}

/* 메인에서 찜 알람 위치 */
#favorite_alarm {top:50%!important}

.landList .item_list li .tit .price{text-align:right}
.landList .item_list li .kwd{padding-top:20px;color:#888}

/* 검색바 및 배경 */
.search_wrap{height:100vh; position:relative; overflow:hidden; display: flex; justify-content: center; align-items: center; padding:0; }

/* category */
.category_wrap{width:100%; margin-top:-50px;}
.category_wrap .category{display:grid; /* grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));  display:flex;   gap:20px;*/  
	grid-template-columns: repeat(6, 1fr); box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; border-radius:15px; background:#fff; } 
.category_wrap .category li{text-align:center; transition:all .3s; position:relative; }
/* .category_wrap .category li:hover{transform:translateY(-2.5%);} */
.category_wrap .category li:before{position:absolute; display:inline-block; vertical-align:middle;content:""; width:1px; height:70%; background:#eee;
	right:0; top:50%; transform: translate(0, -50%);}
.category_wrap .category li:last-child::before{display:none; }
.category_wrap .category li a{display:flex; flex-direction:column; align-items:center; gap:15px; padding:45px; }

.category_wrap .category li .tit{letter-spacing:-0.05em; }

/* feature */
.feature_wrap .feature{ display:grid;  grid-template-columns: repeat(4, 1fr); gap:15px; border-radius:12px; }
.feature_wrap .feature .img_box{max-width:100px; }
.feature_wrap .feature li{display:flex; gap:4%; padding:25px; }
/* .feature_wrap .feature li .img_box, .feature_wrap .feature li .txt_box{width:48%} */
.feature_wrap .feature li .txt_box{ display:flex; flex-direction:column; justify-content:center; gap:10px;}

/* user_guide */
.user_guide_wrap .top_tit{ margin-bottom:0; position:relative; z-index:1; margin-bottom:15px;}
.user_guide_wrap .top_tit::before{position:absolute; display:inline-block; content:""; width:100%; height:1px; background:#eee; right:0; top:50%; transform: translate(0, -50%); z-index:-1;}
.user_guide_wrap .tit_txt{display:inline-block; text-align:left; background: #fff; padding-right:10px;}

.user_guide_wrap .user_guide_out{display:grid; grid-template-columns:7fr 3fr; gap:30px;}
.user_guide_wrap .user_guide{display:grid;  grid-template-columns: repeat(4, 1fr); gap:15px; gap:50px;}
.user_guide_wrap .user_guide .img_box{max-width:60px;}
.user_guide_wrap .user_guide li{display:flex; flex-direction:column; justify-content:center; align-items:center; gap:10px; text-align:center; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; padding:15px; border-radius:16px; position:relative;}
.user_guide_wrap .user_guide li:not(:first-child)::before {position: absolute; left: -31px; top: 50%; transform: translate(0, -50%); content: "\f054"; font-family: "Font Awesome 6 Free"; font-weight: 900;
    font-size: 20px; color: #999;}
.user_guide_wrap .user_guide li .txt_box{ display:flex; flex-direction:column; justify-content:center; gap:8px;}


/* 내주변업체찾기 */
.user_guide_wrap .ask_wrap *{ color:#fff;}
.user_guide_wrap .ask_wrap{background:var(--primary) url('../img/main/ask_btn_bg.png') no-repeat 90% 50%; border-radius:16px; padding:25px; display:flex; flex-direction:column; gap:10px;}
.user_guide_wrap .ask_wrap .desc{font-size:14px;}
.user_guide_wrap .ask_wrap .tit{font-size:24px;}
.user_guide_wrap .ask_wrap .ask_btn_wrap{}
.user_guide_wrap .ask_wrap .ask_btn{display:inline-block; border:1px solid #eee; padding:3px 15px; border-radius:100px; font-size:16px;}


@media(hover:hover){
	.saleList .more_btn:hover{border-color:#bbb}
}

/* 반응형 [s] */
@media(max-width:1430px){
	
	.saleList .inner{max-width:none;}
}

@media (max-width:1200px){
	.category_wrap .category{grid-template-columns: repeat(3, 1fr);}
	.category_wrap .category li:nth-child(3n)::before{display:none; }

	.feature_wrap .feature li{flex-direction:column; align-items:center; }
	.feature_wrap .feature li .txt_box{align-items:center; text-align:center;}
	.feature_wrap .feature .img_box{max-width:80px;}

	.user_guide_wrap .user_guide_out{grid-template-columns:1fr; gap:20px;}
}

@media(max-width:1024px){
	.saleList{padding: 30px 0;}
	.saleList .inner{margin:0 auto}
	.saleList .tit_txt{font-size:30px}
	.saleList .tabs.tit_txt li+li:before{top:10px;height:28px}
	.saleList .inner{padding-bottom:0}
	.saleList .more_btn{margin:40px auto 0}
	
	.feature_wrap .feature li .txt_box{gap:15px;}	
	.feature_wrap .feature li .desc{font-size:16px; display:none;}

	.user_guide_wrap .user_guide{gap:30px;}
	.user_guide_wrap .user_guide li:not(:first-child)::before{left:-21px;}
}
@media(max-width:768px){
	/* .main_wrap{padding-bottom:0;} */
	.saleList{padding:20px 0}
	/* .saleList .top_tit{padding:0 0 20px 0} */
	.saleList .inner{}
	.saleList .btit{margin-bottom:30px}
	.saleList .btit p{font-size:34px}
	.saleList .tit_txt{font-size:22px}
	.saleList .tabs.tit_txt li+li:before{top:9px;height:22px}
	.saleList .tabs{padding-top:0}
	.saleList .more_btn{width:210px;height:65px;font-size:15px;line-height:68px}
	
	/* category */
	.category_wrap{margin-top:0;}
	.category_wrap .category{grid-template-columns: repeat(2, 1fr); gap:15px; box-shadow: none; border-radius:0;}
	.category_wrap .category li::before{display:none;}
	.category_wrap .category li{ box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; border-radius:15px;}
	.category_wrap .category li a{padding:35px; gap:8px;}
	.category_wrap .category li .tit{font-size:16px; }
	.category_wrap .category li .desc{font-size:13px; }
	
	.feature_wrap .feature{gap:8px;}
	.feature_wrap .feature li .img_box{max-width:55px;}
	.feature_wrap .feature li .img_box, .feature_wrap .feature li .txt_box{width:100%; }
	.feature_wrap .feature li, .feature_wrap .feature li:nth-child(2n) { flex-direction:column; gap:8px; padding:15px; }
	.feature_wrap .feature li .tit{font-size:16px; }
	.feature_wrap .feature li .desc{font-size:14px;}
	
	.user_guide_wrap .user_guide{grid-template-columns:1fr;}
	.user_guide_wrap .user_guide li:not(:first-child)::before{left:50%; transform: translate(-50%, -50%) rotate(90deg); top:-15px;  }
	
}
@media(max-width:480px){
	.saleList{padding:20px 0}
	.saleList .inner{padding-bottom:0}
	.saleList .more_btn{width:180px;height:55px;line-height:53px}
	
	/* category */
	/* .category_wrap .category{grid-template-columns:1fr;} */
}
@media(max-width:360px){
	.category_wrap .category{grid-template-columns:1fr;} 
}
/* 반응형 [e] */
.line1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:normal; }
.list_item {display:flex; flex-wrap:wrap;}
.list_item>li {width:49.5%; margin-right:1%; margin-top:10px; border:1px dashed #ddd; border-radius:10px;}
.list_item>li:hover {box-shadow:5px 5px 10px rgba(0,0,0,0.05); }
.list_item>li:nth-child(2n) {margin-right:0;}
.list_item>li:nth-child(-n+2) {margin-top:0;}
.list_item>li a {display:flex; justify-content:space-between; align-items:center; padding:1.0rem;}
.list_item>li .wrap1 {display:flex; align-items:center; width:calc(100% - 90px - 84px); margin-right:10px;}
.list_item>li .wrap2 {display:flex; align-items:center; }
.list_item>li .area {display:inline-block; background:#6737c0; color:#fff; font-size:13px; font-weight:bold; padding:2px 5px 1px 5px; border-radius:3px; margin-right:10px;}
.list_item>li .shop_name {color:#6737c0; font-size:16px; font-weight:500;}
.list_item>li p {width:90%;font-size:16px; color:#111; padding:1px 0}
.list_item>li p em {display:block;}
.list_item>li p span::after {content:"::"; margin:0 4px;}
.list_item>li .ev {width:75px; display:flex; flex-wrap:wrap; align-items:center; font-family:'Tahoma'; font-weight:bold; color:#777777; font-size:14px;}
.list_item>li .ev li {margin:2px 5px 2px 0;}
.list_item>li .ev li i {vertical-align:middle; margin-right:3px;}
.list_item>li .ev .star i {color:#ffc41d;}
.list_item>li .ev .heart i {color:#ff385c;}
.list_item>li .ev .commu i {color:#379fe1;}
.list_item>li .ev .location {display:none;}
.list_item>li .ev .location i {color:#90c128;}
.list_item>li .price {width:84px; padding:5px 2px; font-size:14px; color:#ff385c; border:1px solid #ff385c; border-radius:3px; font-weight:500; letter-spacing:-0.5px; text-align:center;}

@media all and (max-width:1023px) {
	.list_item>li {width:100%; margin-top:10px; margin-right:0}
	.list_item>li:nth-child(-n+2) {margin-top:10px;}
	.list_item>li:first-child {margin-top:0;}
}

@media all and (max-width:768px) {
	.list_item {padding:0 10px}
	.list_item>li a {flex-wrap:wrap;}
	.list_item>li .wrap1 {flex-wrap:wrap; width:100%; margin-right:0}
	.list_item>li .wrap2 {width:100%; justify-content:space-between; margin-top:5px; }
	.list_item>li .area {font-size:11px; padding:2px 4px 1px 4px}
	.list_item>li .shop_name{font-size:15px;}
	.list_item>li p {width:100%; margin-top:5px;font-size:15px;}
	.list_item>li .ev {width:auto;}
	.list_item>li .ev li {font-size:13px;}
	.list_item>li .price {width:76px; padding:3px 1px 2px 1px; font-size:13px;}
}