/* ---------------- */
/* 검색 */
.search-wrap2{
    width: 360px;
    height: 36px;
    border: 2px solid  var( --color-gray);
    background: var(--bg-100);
    display: flex;
    align-items: center;
    border-radius: 4px;
    font-size: var(--fs-12);
}

.search-wrap2 input {
    flex: 1;
    height: 100%;
    padding: var(--space-8);
}
.search-wrap2 input::placeholder {
    color: var(--fc-gray-99);
    font-size: 0.75rem;
}

.search-wrap2 .btn-search {
    width: 42px;
    height: 36px;
    background:  var( --color-gray);
    position: relative;
  
}

.search-wrap2 .btn-search img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}



/* ---------------- */
/* 라디오 체크박스 */

.checkbox-group{
    display: flex;
    align-items: center;
    gap:var(--space-24);
    font-size: var(--fs-14);
}

.custom-radio {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  cursor: pointer;
}

.custom-radio input {
  display: none;
}

.radio-mark {
  width: 18px;
  height: 18px;
  border: 1px solid var(--color-gray);
  border-radius: 3px;
  background: #fff;
  position: relative;
  transition: all 0.2s ease;
}

/* 선택 상태 */
.custom-radio input:checked + .radio-mark {
  background: var( --color-gray);
  border-color: var( --color-gray);
}

/* 흰색 체크 표시 */
.custom-radio input:checked + .radio-mark::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}



/* ---------------- */
/* 셀렉트 박스 */

.select-box {
    position: relative;
    width: 176px;
    font-size: var(--fs-13);
     font-weight: 600;
}

.select-btn {
    width: 100%;
    height: 36px;
    border: 1px solid var(--line-200);
    background: var(--bg-100);
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--space-12);
   
}

.select-btn i {
    width: 6px;
    height: 6px;
    border-right: 1px solid var(--fc-gray-3c);
    border-bottom: 1px solid var(--fc-gray-3c);
    top: -50%;
    transform: translateY(-30%) rotate(45deg);
    transition: .2s;
}

/* 열렸을 때 화살표 */
.select-box.active .select-btn i {
    transform: rotate(225deg);
}

.select-list {
    display: none;

    position: absolute;
    top: calc(100% + 4px);
    left: 0;

    width: 100%;

    padding: 0;
    margin: 0;

    list-style: none;

    border: 1px solid var(--line-200);
    background: var(--bg-100);
    border-radius: 4px;

    overflow: hidden;
    z-index: 10;
     font-weight: 500;
     color: var(--fc-gray-3c);
}

.select-box.active .select-list {
    display: block;
}

.select-list li {
    padding: var(--space-8);
    cursor: pointer;
}

.select-list li:hover {
    background: var(--bg-200);
}



/* ---------------- */
/* 버튼 */


/* 더보기 버튼 */
.btn-more{
    width: 410px;
    height: 3rem;
    background: var(--bg-400);
    margin:0 auto;
     margin-top:var(--space-30);
     font-size: var(--fs-14);
     display: flex;
     align-items: center;
     justify-content: center;
     gap:var(--space-8);
     
}
.btn-more i{
     position: relative;
   
     
}
.btn-more i::before{
    content: "";
    position: absolute;
    top: 50%;
    left: 0px;
    width: 7px;
    height: 7px;
    border-right: 1px solid var(--color-gray);
    border-bottom: 1px solid var(--color-gray);
    transform: translateY(-60%) rotate(45deg);
     
}