/* BASIC css start */
/* */

.SMS_Product_display .items li .icons span, .SMSnaverStyleGallery .items li .icons span{
    display:inline;
}

.SMS_Product_display .items li .icons .tempDc, .SMSnaverStyleGallery .items li .icons .tempDc{
    height:14px !important;
}


#SMS_AppWeb_wrap .appImg, #SMS_AppWeb_wrap .appText{
    display:inline-block;
}

#SMS_AppWeb_wrap .appImg{
    width:50px;
    height:50px;
}

#SMS_AppWeb_wrap .appText{
    height:50px;
    padding:5px 5px;
    font-size:15px;
}

#SMS_AppWeb_wrap.appnone{
    display:none !important;
}

/* 카카오톡 버튼 이미지 변경 */
.SMS_kakaoFloat {
    background : url('/design/laura33/custom/SkinImg/img/float_kakao.png') no-repeat center;
    background-size: 100%;
    width:40px;
}

.SMS_kakaoFloat span.kakaoImg {
    display:none;
}

/*퀵필터*/
.shop-by-size { width: 100%; background: #fff; margin-bottom: 20px; }
/* 공통 헤더 설정 */
.filter-header { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    padding: 11px; 
    cursor: pointer; 
    background-color: #f8f8f8; 
    background-repeat: no-repeat; 
    background-position: center; /* 이미지 중앙 정렬 */
}

.filter-header .title-box div { display: none; } 

/* 상단용 이미지 (filter-top) */
.filter-top .filter-header { 
    background-image: url('/design/laura33/img/lora_quick_02.png') !important; 
    background-size: 90% auto; 
    background-position: left center; /* 왼쪽 정렬 */
    min-height: 35px; 
    border: none; 
}

/* 본문용 이미지 (filter-main) - 이 부분을 아래처럼 보강하세요 */
.filter-main .filter-header { 
    background-image: url('/design/laura33/img/lora_quick.png') !important; 
    background-size: 80% auto; /* 상단용과 마찬가지로 가로폭을 맞춰줘야 보입니다 */
    background-position: left center; /* 왼쪽 정렬 */
    min-height: 50px; /* 이미지 높이가 50px보다 크다면 이 숫자를 더 키워야 합니다 */
}

.filter-content { padding: 0 20px;}
.filter-content .step-section { margin-top: 20px; }
.filter-content .step-section h4 {font-size: 14px;margin-bottom: 10px;color: #121212;line-height: 1;}
 
.filter-content .btn-grid {
    /* display: grid; */
    /* grid-template-columns: repeat(7, 1fr); */
    gap: 6px;
    display: flex;
    flex-wrap: wrap;
}
.filter-content .btn-grid button {
    border: 1px solid #eee;
    background: #fff;
    cursor: pointer;
    transition: 0.2s;
    color: #121212;
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
} 
.filter-content .btn-grid button.active {border: 2px solid #121212;}
.filter-content .filter-footer {
    margin-top: 22px;
    padding: 13px 15px;
    /* border-top: 1px solid #eee; */
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 20px;
    background: #f8f8f8;
}
.filter-content .result-text {color: #e84972;font-weight: bold;font-size: 30px;line-height: 1;/* font-style: italic; */font-family: 'Inter', sans-serif;position: relative;top: -3px;}
/*
.filter-content .submit-btn {
    background: #121212;
    color: #fff;
    border: none;
    cursor: pointer;
    width: 106px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    font-family: 'Noto Sans KR', sans-serif;
}*/
.product-btn {
  display: inline-flex;
  align-items: center;
  text-decoration: none; 
  background: #e84972;
  
  /* 형태: 완전히 둥근 알약 모양 */
  /* padding: 8px 10px 8px 35px; */ /* 왼쪽 여백을 줘서 텍스트 중앙 정렬 유도 */
  /* border-radius: 50px; */
  
  /* 그림자 */
  box-shadow: 0 0px 7px rgba(0, 0, 0, 0.2);
  transition: transform 0.2s ease;
  border: 0;
  font-family: 'Noto Sans KR', sans-serif;
  height: 37px;
    /* width: 105px; */
    padding: 0 10px;
}

/* 마우스 호버 시 효과 */
/*.product-btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.1);
}*/

.product-btn .text {
  color: #ffffff !important;
  font-size: 16px;
  font-weight: 500;
  /* margin-right: 15px; */ /* 텍스트와 GO 사이 간격 */
  letter-spacing: -0.5px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  position: relative;
  top: 1px;
}

/* 오른쪽 'GO' 원형 뱃지 */
.product-btn .go-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  height: 45px;
  background-color: rgba(0, 0, 0, 0.15); /* 살짝 어두운 투명 배경 */
  color: white;
  border-radius: 50%;
  font-size: 16px;
  font-weight: bold;
  display: none;
}

.filter-header .arrow-icon { transform: rotate(180deg); }
.filter-header.is-open .arrow-icon { transform: rotate(0deg); }
  
/* BASIC css end */