@charset "UTF-8";

.subsList {}
.subsList li{
	padding:24px 16px;
	border-bottom: 1px solid #eee;
}
.subsList li.pd-16{
	padding:16px !important;
}
.subsList .subsTit,
.subsList .subsTit span{
	font-size: 16px;
	font-weight: bold;
	color: #212121;
}
.subsList .subsInfo{
	margin-top:16px;
	display: flex;
	justify-content: flex-start;
}
.subsList .subsInfo.mt-0{
	margin-top:0 !important;
}
.subsList .subsInfo .subsImg{
	width: 80px;
	height: 80px;
	margin-right: 16px;
}
.subsList .subsInfo .subsImg img{
	width: 100%;
	height: 100%;
	border-radius: 8px;
	object-fit:cover;
	object-position:center;
}
.subsList .subsInfo .listInfo{
	flex:1;
}
.subsList .subsInfo .listInfo .storeNm{
	line-height: 1.5;
}
.subsList .subsInfo .listNm{
	font-size: 14px;
	font-weight: 500;
	line-height:1.5;
	color: #212121;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    line-clamp:1;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;

}
.subsList .subsInfo .listOpt{
	margin:4px 0 4px;
}
.subsList .subsInfo .listPrice{
	display: inline-block;
	font-size: 16px;
	font-weight: bold;
	color: #212121;
	vertical-align: text-top;
}
.subsList .subsInfo .discount{
	font-size: 11px;
	color: #2ECC71;
	font-weight: 500;
	padding:4px 7px;
	background-color: #CFF9E1;
	border-radius: 100px;
	margin-left:4px;
	display: inline-block;
}
.subsList .subsInfo .discount::after{
	content: '';
	width: 14px;
	height: 14px;
	display: inline-block;
	margin:-3px 0 0 4px;
	vertical-align:middle;
	background: url("../../images/userApp/ico_subsInfo.png") no-repeat center / 14px auto;
}
.subsList li .viewBtn{
	width: 100%;
	height: 40px;
	border:1px solid #FF8E5E;
	background: #fff;
	color: #FF8E5E;
	font-size: 14px;
	font-weight: bold;
	border-radius: 4px;
	margin-top:16px;
}
.subsList li .listBtmInfo{
	margin-top:8px;
}
.subsList li .listBtmInfo div{
	display: inline-block;
	font-size: 12px;
	color: #757575;
}
.subsList li .listBtmInfo div:first-child::after{
	content: '';
	width: 1px;
	height: 10px;
	background: #757575;
	display: inline-block;
	margin:0 4px;
}
.subsList li .state{
	font-size: 14px;
	margin-bottom:4px;
	font-weight: bold;
}
.subsList li .state.state-orange{
	color: #FF8E5E;
}
.subsList li .state.state-blue{
	color: #2D4FAB;
}
.subsList li .state.state-purple{
	color: #883EBF;
}
.subsList li .state.state-grey{
	color: #757575;
}
.subsList .listInfo .dscPrice{
	margin-top:4px;
}
.subsList .listInfo .dscPrice div{
	display: inline-block;
}
.subsList .listInfo .dscPrice .origin{
	text-decoration: line-through;
	font-weight: 400;
	margin-right: 4px;
	vertical-align: text-top;
}
.subsList .listInfo .dscPrice .price{
	font-weight: bold;
	color: #FF8E5E;
	font-size: 16px;
}
.subsList .listInfo .originPrice{
	font-size: 16px;
	font-weight: bold;
	color: #212121;
	margin-top:4px;
}
.subsList .delivery div{
	font-weight: 500;
	padding:2px 10px;
	border-radius: 100px;
	display: inline-block;
	margin-top:8px;
}
.subsList .delivery .package{
	color: #9B51FF;
	background:#F0E3FF;
}
.subsList .delivery .quick{
	color: #BF5531;
	background:#FFEAE3;
}
.subsList .delivery div::before{
	content: '';
	width: 20px;
	height: 20px;
	display: inline-block;
	margin-right: 4px;
	vertical-align: text-top;
}
.subsList .delivery .package::before{
	background: url("../../images/userApp/ico_package.png") no-repeat center / 20px auto;
}
.subsList .delivery .quick::before{
	background: url("../../images/userApp/ico_quick.png") no-repeat center / 20px auto;
}
.popWrap {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 200;
}
.pop-inner {
    position: absolute;
    top: 50%;
    left: 50%;
    padding-bottom: 20px;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    max-width: 320px;
    width: 100%;
    color: #212121;
}
.pop-header {
    padding: 0 16px;
    height: 46px;
    background: #eee;
    border-radius: 10px 10px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.pop-header div{
	font-size: 14px;
	font-weight: bold;
	color: #212121;
}
.pop-header .closeBtn{
	width: 24px;
	height: 24px;
	background: url("../../images/userApp/ico_close.png")no-repeat center / 24px auto;
}
.pop-body {
    background: #fff;
    border-radius: 0 0 10px 10px;
}
.pop-body.pd-24{
	padding:24px 16px;
}
.dscTableWrap{
	max-height: 384px;
	overflow-y:auto;
}
.dscTableWrap .dscTable{}
.dscTableWrap .dscTable tr{
	border-top:1px solid #eee;
	border-bottom:1px solid #eee;
	height: 48px;
}
.dscTableWrap .dscTable tr th{
	background: #fafafa;
	font-size: 14px;
	color: #212121;
	text-align: center;
	width: 80px;
}
.dscTableWrap .dscTable tr td{
	font-size: 14px;
	padding:0 16px;
	text-align: left;
	color: #212121;
}
.btnWrap{
	display: flex;
	justify-content: space-between;
	gap:8px;
	margin-top:16px;
	flex-wrap: wrap;
}
.btnWrap .grBtn{
	background: #eee;
	border-radius: 4px;
	width: 100%;
	height: 40px;
	font-size: 14px;
	font-weight: 500;
	color: #616161;
}
.btnWrap .prBtn, .prBtn{
	background: #FF8E5E;
	border-radius: 4px;
	width: 100%;
	height: 40px;
	font-size: 14px;
	font-weight: 500;
	color: #ffffff;
}
.btnWrap .prBtn1 a, .prBtn a{
	color: #ffffff;
}
.btnWrap button.wd-50{
	width: 48.5%;
}
.prBtn{
	margin-top:24px;
}
.delivery_info{
	border-top:6px solid #eee;
	border-bottom: 6px solid #eee;
	padding-bottom:24px;
}

.subsCount .countTit{
	height: 46px;
	padding:13px 16px;
	text-align: left;
	background: #fafafa;
	font-size: 14px;
	font-weight: 500;
	color: #212121;
}
.subsCount li{
	padding:16px;
	border-bottom:1px solid #eee;
	display: flex;
	justify-content: flex-start;
}
.subsCount li .countInfo{
	flex:1;
}
.subsCount li .count{
	font-size: 16px;
	font-weight: 500;
	color: #212121;
}
.subsCount li .countPrice{
	margin:6px 0;
	font-weight: bold;
	color: #212121;
	font-size: 14px;
}
.subsCount li .payDate,
.subsCount li .delDate{
	font-size: 12px;
	color: #616161;
	display: inline-block;
}
.subsCount li .payDate::after{
	content: '';
	width: 1px;
	height: 10px;
	display: inline-block;
	background: #ccc;
	margin:0 6px 0 8px;
}
.subsCount .badge{
	width: 65px;
	height: 24px;
	line-height: 24px;
	border-radius: 100px;
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	text-align: center;
}
.subsCount .badge.grey{
	background: #BDBDBD;
}
.subsCount .badge.orange{
	background: #FF8E5E;
}
.subsCount .badge.blue{
	background: #2D4FAB;
}
.subsCount .badge.purple{
	background: #883EBF;
}
.order_btn span{
	font-weight: 500;
}

.pop-body .nowDateWrap{
	padding:16px;
	border-bottom: 6px solid #eee;
}
.pop-body .dateTit{
	font-size: 14px;
	font-weight: 500;
	color: #212121;
}
.pop-body .nowDate{
	width: 100%;
	border-radius: 4px;
	border:1px solid #9e9e9e;
	background: #fafafa;
	height: 40px;
	line-height: 38px;
	padding:0 14px;
	font-size: 14px;
	color: #212121;
	margin-top:8px;
}
.pop-body .calendarWrap{
	padding:24px 16px 30px;
}
.pb-80{
	padding-bottom:80px;
}
.cateWrap .cate{
	padding:24px 16px;
	background: #FFFAF8;
	border-bottom:6px solid #FFEDE5;
	display: flex;
	overflow-x:auto;
    -ms-overflow-style: none;
  	scrollbar-width: none;
}
.cateWrap .cate::-webkit-scrollbar {
    display: none;
}
.cateWrap .cate li{
	margin-right: 14px;
	text-align: center;
}
.cateWrap .cate li:last-child{
	margin-right: 0;
}
.cateWrap .cate li.active .cateIcon{
	border:1px solid #FF8E5E;
}
.cateWrap .cate li .cateIcon{
	width: 62px;
	height: 62px;
	background: #fff;
	border:1px solid #eee;
	border-radius: 4px;
}
.cateWrap .cate li .cateIcon img{
	width: 100%;
	height: 100%;
	border-radius: 8px;
	object-fit:cover;
	object-position:center;
}
.cateWrap .cate li .cateNm{
	font-weight: 500;
	color: #212121;
	margin-top:6px;
	font-size: 14px;
}
.imgSold {
    flex: 1;
    margin-top: 32px;
    padding: 4px 8px;
    width: 38px;
    max-width: 38px;
    height: 22px;
    background-color: #C7C7C7;
    font-size: 12px;
    color: #fff;
    text-align: center;
    z-index: 10;
    border-radius: 2px;
    -webkit-border-radius: 2px;
}