/* BASIC css start */
.order-sp{
    width:100%;
    display:flex;
    justify-content:center;
    margin:80px 0;
 font-family: "Noto Sans Korean", sans-serif;
    font-size:14px;

}

/* 카드 영역 */
.order-sp .frm-wrap{
    width:420px;
    background:#fff;

    border-radius:10px;
    padding:35px 40px;
    box-shadow:0 5px 18px rgba(0,0,0,0.0);
}

/* 제목 */
.order-sp h3{
    text-align:center;
    margin-bottom:25px;
}

/* 안내문 */
.order-sp p{
    text-align:center;
    margin-bottom:25px;
font-color: #898989;
}

/* 리스트 초기화 */
.order-sp .frm-list{
    list-style:none;
    padding:0;
    margin:0;
}

/* 입력 줄 정렬 */
.order-sp .frm-list li {
    display: flex;
    align-items: center; /* 수직 중앙 정렬 */
    margin-bottom: 15px;
    gap: 10px; /* 라벨과 입력칸 사이 간격 추가 */
}

/* 라벨 영역 */
.order-sp .frm-list label{
    width: 100px; /* 원하는 라벨 폭으로 조정 */
    flex-shrink: 0; /* 줄어들지 않도록 고정 */
    text-align: left; /* 라벨을 오른쪽 끝으로 정렬 */
}
/* 입력칸 */
.order-sp .frm-list input{
    flex: 1; /* 남은 공간 채우기 */
    height: 42px;
    border: 1px solid #fff;
    border-bottom: 2px solid #cecece;
    padding: 0 10px;
    font-size: 13px;
    box-sizing: border-box;
  border-bottom: 2px solid #cecece; /* 선 두께, 스타일, 색상 */
  padding-bottom: 2px; /* 텍스트와 선 사이 간격 */
}

/* 입력칸 focus */
.order-sp .frm-list input:focus{
    border-color:#fff;
  border-bottom: 2px solid #000; /* 선 두께, 스타일, 색상 */
  padding-bottom: 2px; /* 텍스트와 선 사이 간격 */
    outline:none;
}

/* 버튼 영역 */
.order-sp .btn-sch{
    display:block;
    margin:25px auto 0;
    cursor:pointer;
}

/* 반응형 */
@media (max-width:480px){

    .order-sp .frm-wrap{
        width:90%;
        padding:25px;
    }

    .order-sp .frm-list label{
        width:80px;
    }

}

.order-search-btn {
    display: block;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: #000;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    border-radius: 12px;
    text-decoration: none;
    margin-top: 20px;
    transition: background 0.5s ease, opacity 0.2s ease; /* 배경색과 투명도 동시에 부드럽게 */
    opacity: 1; /* 초기값 */
}

.order-search-btn:hover {
    background: #333;
}

.btn-sch {
    opacity: 1;
    transition: opacity 0.5s ease; /* JS에서도 사용 가능 */
}
/* BASIC css end */