/* 리뷰 섹션 */
.inquiry-container { width: 100%;max-width: 1050px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px } 

/* 리뷰가 없을 때 */
/* 리뷰가 있을 때 */
.inquiry-section { width: 100%; display: flex; flex-direction: column; gap: 50px; padding-bottom: 60px; } 

.inquiry-write-title { width: 100%; display: flex; flex-direction: row; align-items: center; justify-content: space-between; } 

/* 리뷰 섹션 타이틀 */
.inquiry-write-title .title h3 { font-size: 24px; font-weight: 600; color: #333; margin: 0; letter-spacing: -0.5px; } 
.inquiry-write-section.web { display: flex; } 
.inquiry-write-section.web .btn-write-inquiry { width: 130px; height: 40px; border-radius: 5px; background-color: #23B16C; color: #ffffff; font-size: 14px; font-weight: 600; letter-spacing: -0.75px; transition: all 0.3s; } 
.inquiry-write-section.web .btn-write-inquiry:hover { background-color: #209c60; } 
.inquiry-write-section.mobile { display: none; width: 100%; } 
.inquiry-write-section.mobile .btn-write-inquiry { width: 100%; height: 40px; border-radius: 5px; border: 1px solid #23B16C; background-color: #ffffff; color: #23B16C; font-size: 14px; font-weight: 600; letter-spacing: -0.75px; transition: all 0.3s; } 
.inquiry-write-section.mobile .btn-write-inquiry:hover { border-color: #209c60; color: #209c60; } 

/* 문의 빈 상태 */
.inquiry-description-wrap { display: flex; flex-direction: column; text-align: center; } 
.inquiry-description-content { display: flex; flex-direction: column; gap: 10px; width: 100%; align-items: flex-start } 
.inquiry-description-text { list-style: none; display: flex; flex-direction: column; gap: 5px; text-align: left; } 
.inquiry-description { display: flex; flex-direction: column; gap: 5px; text-align: left; position: relative; padding-left: 15px; } 
.inquiry-description::before { content: '•'; position: absolute; left: 0; color: #555555; font-weight: bold; font-size: 14px; } 
.inquiry-description p { font-size: 13px; color: #555555; line-height: 1.4; letter-spacing: -0.75px; } 
.inquiry-text-link { color: #555555; text-decoration: underline; font-size: 13px; letter-spacing: -0.75px; font-weight: 500; transition: all 0.2s ease; text-decoration: underline; } 

.inquiry-text-link:hover { color: #333333; } 

/* 문의 없을 때 */
.no-inquiry { display: flex; justify-content: center; align-items: center; text-align: center; padding-top: 30px; width: 100%; border-top: 1px solid #333; } 

.no-inquiry-content { display: flex; flex-direction: column; align-items: center; width: 100% } 

.no-inquiry-text { display: flex; flex-direction: column } 

.no-inquiry-title,
.no-inquiry-subtitle,
.no-inquiry-description { font-size: 16px; color: #555; font-weight: 500; line-height: 1.4; letter-spacing: -0.75px } 

/* 문의 있을 때 */
.inquiry-list { width: 100%; } 
.inquiry-list .table { width: 100%; } 
.inquiry-list .table table { width: 100%; border-collapse: collapse; border-spacing: 0; } 
.inquiry-list .table table thead { height: 58px; border-top: 1px solid #333; border-bottom: 1px solid #333; } 
.inquiry-list .table table thead tr th { letter-spacing: -0.75px; vertical-align: middle; font-size: 14px; font-weight: 500; color: #333; } 
.inquiry-list .table table thead tr th.title { padding: 0 30px; width: 100%; text-align: left; } 
.inquiry-list .table table thead tr th.author,
.inquiry-list .table table thead tr th.created-date,
.inquiry-list .table table thead tr th.status { width: 100px; white-space: nowrap; } 

.inquiry-list .table table tbody tr { height: 64px; border-bottom: 1px solid rgb(244, 244, 244); line-height: 19px; letter-spacing: -0.5px; } 
.inquiry-list .table table tbody tr td { font-size: 14px; text-align: center; font-weight: 500; color: #333; line-height: 1.4; letter-spacing: -0.75px; cursor: pointer; vertical-align: middle; vertical-align: middle; } 
.inquiry-list .table table tbody tr td .title-wrap { width: 100%; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 5px; text-align: left; font-size: 14px; font-weight: 500; color: #333; line-height: 1.4; letter-spacing: -0.75px; padding: 0 10px; } 
.inquiry-list .table table tbody tr td.author,
.inquiry-list .table table tbody tr td.created-date,
.inquiry-list .table table tbody tr td.status { width: 100px; white-space: nowrap; padding: 0px 5px; } 
.inquiry-list .table table tbody tr td.author p { color: #888; font-size: 14px; } 
.inquiry-list .table table tbody tr td.created-date p { color: #888; font-size: 14px; } 
.inquiry-inner { width: 100%; padding: 25px 30px; display: flex; flex-direction: column; align-items: flex-start; gap: 40px; } 

/* 문의 내용과 답변 스타일 */
.inquiry-content-row,
.inquiry-answer-row { background-color: #f8f9fa; width: 100%; } 

.content-box,
.answer-box { width: 100%; display: flex; gap: 10px; align-items: flex-start; } 

.content-label,
.answer-label { color: #23B16C; font-weight: 800; font-size: 16px; margin: 0; min-width: 20px; } 

.content-text,
.answer-content { color: #333; font-size: 14px; line-height: 1.5; margin: 0; flex: 1; } 

.content-text p,
.answer-content p { width: 100%; display: block; text-align: left;word-break: keep-all; } 
.answer-content p{color: #000000;}

/* 클릭 가능한 문의 항목 스타일 */
.inquiry-item { cursor: pointer; transition: background-color 0.2s ease; } 

.inquiry-item:hover { background-color: #f8f9fa; } 

/* 비밀글 스타일 */
.secret-icon { font-size: 12px; } 
.secret-text { color: #888888; } 
.secret-content { color: #666; font-style: italic; text-align: center; padding: 20px; } 

/* 문의 상세 내용 애니메이션 */
.inquiry-detail { transition: all 0.3s ease; } 

/* 답변 상태 스타일 */
.status .answered { color: #23B16C; font-weight: 500; } 
.status .waiting { color: #888888; font-weight: 500; } 

/* 모달스타일 추가  */
.modal-backdrop { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); } 
.modal-content { position: relative; background-color: #ffffff; border-radius: 8px; padding: 0px; text-align: center; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); max-width: 300px; width: 90%; overflow: hidden; display: flex; flex-direction: column; align-items: center; } 
.modal-content .modal-body{ display: flex; flex-direction: column; align-items: center;justify-content: flex-start; gap: 20px; overflow-y: auto; width: 100%; }
.modal-content .modal-footer { width: 100%; border-top: 1px solid #ddd; } 
 
/* 비밀글 모달 스타일 */
.secret-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; align-items: center; justify-content: center; }
.secret-modal.show { display: flex; } 
.secret-modal .modal-backdrop { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); } 
.secret-modal .modal-content { position: relative; background-color: #ffffff; border-radius: 8px; padding: 0px; text-align: center; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); max-width: 300px; width: 90%; overflow: hidden; display: flex; flex-direction: column; align-items: center; } 

.secret-modal .modal-body { display: flex; flex-direction: column; align-items: center; gap: 20px; overflow-y: hidden; width: 100%; padding: 24px; } 
.secret-modal .secret-message { font-size: 16px; color: #333; margin: 0; font-weight: 500; } 
.secret-modal .modal-footer { width: 100%; border-top: 1px solid #ddd; } 
.secret-modal .confirm-btn { color: #23B16C; border: none; border-radius: 6px; padding: 0; font-size: 16px; font-weight: 600; cursor: pointer; width: 100%; transition: all 0.2s; display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 16px; } 
.secret-modal .confirm-btn:hover { color: #209c60; } 

/* 문의삭제 확인 모달 스타일 */
.delete-inquiry-modal{ display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; align-items: center; justify-content: center; }
.delete-inquiry-modal.show{ display: flex; } 
.delete-inquiry-modal .modal-body{padding: 50px 24px;}
.delete-inquiry-modal .modal-body p{font-size: 16px;line-height: 1; font-weight: 500; letter-spacing: -0.75px;}
.delete-inquiry-modal .modal-footer{display: flex; flex-direction: row;align-items: center; justify-content: center; height: 40px;}
.delete-inquiry-modal .modal-footer button{width: 100%;  height: 100%;  display: flex; flex-direction: row; align-items: center; justify-content: center;font-size: 16px; letter-spacing: -0.75px;font-weight: 500; border-radius: 0; color: #555555; background-color: #ffffff; }
.delete-inquiry-modal .modal-footer .confirm-btn{background-color: #23B16C; color: #ffffff;}


/* 문의 안내 모달 스타일 */
.inquiry-guide-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; align-items: center; justify-content: center; } 
.inquiry-guide-modal.show { display: flex; } 
.inquiry-guide-modal .modal-content { position: relative; background-color: #ffffff; border-radius: 8px; max-width: 450px; width: 90%; max-height: 80vh; display: flex; flex-direction: column; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); overflow: hidden; padding: 0; } 
.inquiry-guide-modal .modal-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; border-bottom: 1px solid #e5e5e5; } 
.inquiry-guide-modal .modal-header h3 { font-size: 18px; font-weight: 600; color: #333; margin: 0; } 
.inquiry-guide-modal .close-btn { background: none; border: none; font-size: 24px; color: #666; cursor: pointer; padding: 0; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; transition: color 0.2s ease; } 
.inquiry-guide-modal .close-btn:hover { color: #333; } 
.inquiry-guide-modal .modal-body { padding: 0 20px; max-height: 60vh; overflow-y: auto; display: flex; flex-direction: column; justify-content: flex-start; } 
.guide-content { width: 100%; display: flex; flex-direction: column; padding: 15px 0; gap: 15px; } 
.guide-section { display: flex; flex-direction: column; gap: 10px; } 
.guide-section h4 { font-weight: 500; font-size: 14px; line-height: 1; letter-spacing: -0.75px; color: #979797; } 
.guide-section ul { width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; } 
.guide-section ul li { font-weight: 400; font-size: 13px; line-height: 1.4; letter-spacing: -0.75px; color: #979797; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 5px; } 
.guide-section ul li::before { content: ''; display: block; width: 2px; height: 2px; background-color: #bbbbbb; border-radius: 50%; } 
.inquiry-guide-modal .modal-footer { box-shadow: 0px -3px 10px #dddddd; } 
.inquiry-guide-modal .modal-footer .confirm-btn { padding: 20px 30px; width: 100%; background-color: #ffffff; color: #23B16C; font-size: 16px; font-weight: 700; letter-spacing: -0.75px; line-height: 1; transition: all 0.3s; } 
.inquiry-guide-modal .modal-footer .confirm-btn:hover { color: #027a40; } 

/* 모바일 문의 */
.inquiry-mobile{display: flex; flex-direction: column; align-items: flex-start; gap: 30px;}
.inquiry-mobile-list{width: 100%;display: flex; flex-direction: column;}
.inquiry-mobile-list .inquiry-mobile-card{display: flex; flex-direction: column;border-bottom: 1px solid #EEEEEE;}
.inquiry-mobile-list .inquiry-mobile-card .inquiry-item{display: flex; flex-direction: column;padding: 20px;background-color: #ffffff;}
.inquiry-mobile-list .inquiry-mobile-card .inquiry-item:hover{background-color: #ffffff;}
.inquiry-mobile-list .inquiry-mobile-card .inquiry-mobile-summary{display: flex;flex-direction: column; gap: 10px;}
/* 문의내용 수정 260616 */
.inquiry-mobile-list .inquiry-mobile-card .inquiry-mobile-summary .subject-wrap .subject{font-size: 14px; letter-spacing: -0.75px;word-break: break-word;color: #202020;}
.inquiry-mobile-list .inquiry-mobile-card .inquiry-mobile-summary .secret-text{font-size: 14px; letter-spacing: -0.75px;}
.inquiry-mobile-list .inquiry-mobile-card .meta{display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 8px;}
.inquiry-mobile-list .inquiry-mobile-card .meta span{font-size: 12px; letter-spacing: -0.75px;color: #888888;}
.inquiry-mobile-list .inquiry-mobile-card .meta .status{font-weight: 600;}
.inquiry-mobile-list .inquiry-mobile-card .meta .status.waiting{color: #888888;}
.inquiry-mobile-list .inquiry-mobile-card .meta .status.answered{color: #23B16C;}
.inquiry-mobile-list .inquiry-mobile-card .inquiry-detail{padding: 20px;}
.inquiry-mobile-list .inquiry-mobile-card .inquiry-detail{background-color: #FAFAFA;}
.inquiry-mobile-list .inquiry-mobile-card .inquiry-detail .inquiry-mobile-detail{display: flex; flex-direction: column; gap: 10px;}
.inquiry-mobile-list .inquiry-mobile-card .inquiry-detail .inquiry-action-buttons .btn{font-size: 12px;}

/*문의작성 모달 */
.inquiry-write-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; align-items: center; justify-content: center; }
.inquiry-write-modal.show { display: flex; } 
.inquiry-write-modal .modal-backdrop { position: absolute; top: 0; left: 0;inset: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); } 
.inquiry-write-modal .modal-content { position: relative;z-index: 1; background-color: #ffffff; border-radius: 8px; max-width: 450px; width: 90%; max-height: 80vh; display: flex; flex-direction: column; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); overflow: hidden; padding: 0; } 
.inquiry-write-modal .modal-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px;  } 
.inquiry-write-modal .modal-header h3 { font-size: 18px; font-weight: 600; color: #333; margin: 0; } 
.inquiry-write-modal .close-btn { background: none; border: none; font-size: 24px; color: #666; cursor: pointer; padding: 0; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; transition: color 0.2s ease; } 
.inquiry-write-modal .close-btn:hover { color: #333; } 
.inquiry-write-modal .modal-content { position: relative; background-color: #ffffff; border-radius: 8px; max-width: 450px; width: 90%; max-height: 80vh; display: flex; flex-direction: column; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); overflow: hidden; padding: 0; } 
.inquiry-write-modal .modal-body { padding: 0 20px; max-height: 60vh; overflow-y: auto; display: flex; flex-direction: column; justify-content: flex-start; } 
.inquiry-write-modal .modal-body .product-info { width: 100%; display: flex; flex-direction: row; gap: 10px; justify-content: flex-start; align-items: flex-start } 
.inquiry-write-modal .modal-body .product-info .product-brand{font-size: 12px; letter-spacing: -0.75px;color: #666;}
.inquiry-write-modal .modal-body .product-info .product-image { min-width: 95px; width: 95px; height: 95px; border-radius: 5px; overflow: hidden; background-color: #efefef;} 
.inquiry-write-modal .modal-body .product-info .product-image img { width: 100%; height: 100%; object-fit: cover; } 
.inquiry-write-modal .modal-body .product-info .product-details { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; } 
.inquiry-write-modal .modal-body .product-info .product-details .brand-name{font-size: 14px;letter-spacing: -0.75px; color: #888888;}
.inquiry-write-modal .modal-body .product-info .product-details .product-name{color: #333333;  font-weight: 500;  letter-spacing: -0.75px;  font-size: 16px;word-break: keep-all;}
.inquiry-write-modal .modal-body .inquiry-wrap{display: flex;width: 100%;flex-direction: column; gap: 20px;}
.inquiry-write-modal .modal-body .inquiry-form { width: 100%; display: flex; flex-direction: column; gap: 20px;padding: 20px 0; border-top: 1px solid #eeeeee;} 
.inquiry-write-modal .modal-body .inquiry-form .form-group{width: 100%; display: flex; flex-direction: column; gap: 10px;}
.inquiry-write-modal .modal-body .inquiry-form .form-group label{font-size: 14px;line-height: 1; font-weight: 500; letter-spacing: -0.75px;}
.inquiry-write-modal .modal-body .inquiry-form .form-group input{padding: 14px 15px; border: 1px solid #ddd; border-radius: 8px; transition: border-color 0.2s ease;}

/* 입력 필드 포커스 상태 */
.inquiry-write-modal .modal-body .inquiry-form .form-group input:focus {
    border-color: #23B16C;
    outline: none;
}
.inquiry-write-modal .modal-body .inquiry-form .form-group .textarea-wrap{width: 100%; display: flex; flex-direction: column; gap: 5px;}
.inquiry-write-modal .modal-body .inquiry-form .form-group .textarea{width: 100%; height: 140px;  padding: 0; border: 1px solid #ddd;  border-radius: 8px;  background: #fff; display: flex; flex-direction: column; overflow: hidden; box-sizing: border-box;}
.inquiry-write-modal .modal-body .inquiry-form .form-group .textarea .char-count{position: static; flex-shrink: 0; padding: 0 15px 10px; color: #B5B5B6;  font-size: 12px; line-height: 1; text-align: right;}
.inquiry-write-modal .modal-body .inquiry-form .form-group textarea{width: 100%;  flex: 1;  min-height: 0;  padding: 15px 15px 8px;  resize: none;  border: 0;  border-radius: 0;
 outline: none;  box-sizing: border-box; overflow-y: auto;}

/* 에러 상태 */
.inquiry-write-modal .modal-body .inquiry-form .form-group .textarea.error {border-color: #ff4444 !important;}

/* 포커스 상태 - 내부 textarea에 포커스가 있을 때 부모 border 변경 */
.inquiry-write-modal .modal-body .inquiry-form .form-group .textarea:focus-within:not(.error) { border-color: #23B16C;}

.inquiry-write-modal .modal-body .inquiry-form .form-group .error-message{
    font-size: 12px; 
    color: #ff4444 !important; 
    margin-top: 8px; 
    display: none !important;
    line-height: 1.4;
    font-weight: 500;
    letter-spacing: -0.5px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease-in-out;
}

/* 에러 메시지가 표시될 때 */
.inquiry-write-modal .modal-body .inquiry-form .form-group .error-message[style*="block"],
.inquiry-write-modal .modal-body .inquiry-form .form-group .error-message.show-error {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    animation: fadeInError 0.2s ease-in-out;
}

@keyframes fadeInError {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 체크박스 스타일 */
.inquiry-write-modal .modal-body .inquiry-form .form-group .privacy-options {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

.inquiry-write-modal .modal-body .inquiry-form .form-group .privacy-options input[type="checkbox"] {
    display: none;
    pointer-events: auto;
}

.inquiry-write-modal .modal-body .inquiry-form .form-group .privacy-options label.checkcircle {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 14px;
    color: #333;
    letter-spacing: -0.75px;
    user-select: none;
    -webkit-user-select: none;
    pointer-events: auto;
    position: relative;
    z-index: 1;
    
}
.inquiry-write-modal .modal-body .inquiry-form .form-group .privacy-options .text p{font-size: 14px; color: #333; letter-spacing: -0.75px; font-weight: 500;}

.inquiry-write-modal .modal-body .inquiry-form .form-group .privacy-options input[type="checkbox"] + label.checkcircle::before {
    content: '';
    min-width: 18px;
    max-width: 18px;
    height: 18px;
    display: block;
    background: url("../../images/icon/check_icon_circle_off.svg") 50% 50%/contain no-repeat;
    transition: all 0.3s;
}

.inquiry-write-modal .modal-body .inquiry-form .form-group .privacy-options input[type="checkbox"]:checked + label.checkcircle::before,
.inquiry-write-modal .modal-body .inquiry-form .form-group .privacy-options label.checkcircle.checked::before {
    background: url("../../images/icon/check_icon_circle_on.svg") 50% 50%/contain no-repeat;
}

.inquiry-write-modal .modal-footer{padding: 20px;}
.inquiry-write-modal .modal-footer .submit-btn{width: 100%;display: flex; flex-direction: row; justify-content: center; align-items: center; height: 55px; border-radius: 5px; background-color: #DADADA; color: #ffffff; font-size: 16px; font-weight: 500; transition: all 0.3s;}
.inquiry-write-modal .modal-footer .submit-btn.active{background-color: #23B16C;}


.inquiry-action-buttons{width: 100%; display: flex; flex-direction: row; justify-content: flex-end; align-items: center; gap: 10px;}
.inquiry-action-buttons .btn{display: flex; flex-direction: row; justify-content: flex-end; align-items: center; gap: 10px; color: #888888; font-size: 14px; letter-spacing: -0.75px;}
.inquiry-action-buttons .btn + .btn::before{content: ''; width: 1px; height: 12px; background-color: #888888;}
/* inquiry-write-section 반응형 표시/숨김 */
/* 웹 버전 - 모바일에서 숨김 */
.inquiry-write-section.web {  display: flex !important;}

@media only screen and (max-width: 1050px) {
.inquiry-section.web{padding: 0 10px;}
}
@media only screen and (max-width: 768px) {
    /* .inquiry-write-title .title{display: none;}
    .inquiry-write-section.web { display: none !important;} */
}

/* 모바일 버전 - 웹에서 숨김 */
/* .inquiry-write-section.mobile {  display: none !important;} */

@media only screen and (max-width: 768px) {
    .inquiry-write-section.mobile { display: block !important; width: 100%;}

    /* 웹 버전 테이블 숨김 */
    .inquiry-list.web { display: none !important; }

    /* 모바일 버전 카드 표시 */
    /* .inquiry-list.mobile {display: block !important;} */
   .inquiry-write-section.mobile .inquiry-mobile.empty .inquiry-description-wrap{display: block;}
   .inquiry-write-section.mobile .inquiry-mobile .inquiry-description-wrap{display: none;}
}

/* 웹에서 모바일 카드 숨김 */
@media only screen and (min-width: 769px) {
    .inquiry-list.mobile {display: none !important;}
}

/* 모바일 문의 카드 스타일 */
.inquiry-section.mobile{display: none;}
.inquiry-cards{display:flex;flex-direction:column;gap:12px}
.inquiry-card{cursor:pointer;border-bottom: 1px solid #eee;  transition:all .2s ease;}
.inquiry-card .card-header .inquiry-title{display: flex; align-items: center;  height: 42px;justify-content: flex-start; flex-direction: row; gap: 5px;padding: 0 20px;}
.inquiry-card .inquiry-title p{font-size: 14px; font-weight: 500; color: #333; line-height: 1.4; letter-spacing: -0.75px;}
.inquiry-card .secret-icon{display:inline-flex;align-items:center;}
.inquiry-card .secret-icon img{width:16px;height:16px}
.inquiry-card .secret-text{color:#888 ; font-size: 14px; font-weight: 500; letter-spacing: -0.75px;}
.inquiry-card .card-info{display: flex; flex-direction: row; align-items: center; gap: 8px;padding: 0 20px 20px; border-bottom: 1px solid #eee;}
.inquiry-card .inquiry-status{flex-shrink:0}
.inquiry-card .status.answered{font-size: 13px; color:#23B16C;font-weight: 500;letter-spacing: -0.75px;}
.inquiry-card .status.waiting{font-size: 13px; color:#888;font-weight: 500;letter-spacing: -0.75px;}
.inquiry-card .author{font-size: 13px; font-weight:400;  letter-spacing: -0.75px;color: #888;}
.inquiry-card .date{color:#999;font-size: 13px; font-weight:400;  letter-spacing: 0;color: #888;}

/* 모바일 상세 내용 스타일 */
.inquiry-detail-mobile{padding: 24px 20px;background-color: #FAFAFA;}
.inquiry-detail-mobile .detail-content{display:flex;flex-direction:column;gap:16px}
.inquiry-detail-mobile .question-section,
.inquiry-detail-mobile .answer-section{display:flex;flex-direction: row;align-items: flex-start;}
.inquiry-detail-mobile .question-label,
.inquiry-detail-mobile .answer-label{flex-shrink:0;width:24px;height: 21px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:14px;font-weight:600;}
.inquiry-detail-mobile .question-label{color:#23B16C}
.inquiry-detail-mobile .answer-label{color: #23B16C}
.inquiry-detail-mobile .question-text,
.inquiry-detail-mobile .answer-text{flex:1;font-size:14px;line-height:1.5;color:#333}
.inquiry-detail-mobile .question-text p,
.inquiry-detail-mobile .answer-text p{margin:0; letter-spacing: -0.75px;}




/* 모바일 문의 없을 때 스타일 */
.mobile-no-inquiry-container{text-align:center; padding: 0 20px;}
.mobile-inquiry-header-wrap{display: flex;  flex-direction: column;  align-items: flex-start; gap: 10px; padding-bottom: 30px; border-bottom: 1px solid #333;}
.mobile-inquiry-header{width: 100%; text-align: left;}
.mobile-inquiry-title{font-size:18px;font-weight:600;color:#333;margin:0;letter-spacing:-0.5px}
.mobile-inquiry-description{ display: flex; flex-direction: column; gap: 10px; width: 100%; align-items: flex-start;}
.mobile-description-text{text-align:left;;position: relative;display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-start;padding-left: 15px;}
.mobile-description-text p::before { content: '•'; position: absolute; left: 0; color: #555555; font-weight: bold; font-size: 14px; } 
.mobile-description-text p{font-size:13px;color:#666;line-height:1.4; letter-spacing: -0.75px;}
.mobile-description-text:last-child{margin-bottom:0}
.mobile-inquiry-link{color:#888;text-decoration:underline;font-weight:500}
.mobile-no-inquiry-message{padding:40px 20px}
.mobile-no-inquiry-text{font-size:14px;color:#999;margin:0;letter-spacing:-0.3px}
.mobile-inquiry-write-section{width: 100%; padding: 0 20px;}
.mobile-btn-write-inquiry{width:100%;height:48px;background-color:#fff;color:#23B16C;border:none;border-radius:8px;font-size:15px;font-weight:600;letter-spacing:-0.5px;cursor:pointer;transition:background-color .2s ease}
.mobile-btn-write-inquiry{width:100%;height:48px;background-color:#fff;color:#23B16C;border:none;border-radius:8px;font-size:15px;font-weight:600;letter-spacing:-0.5px;cursor:pointer;transition:background-color .2s ease}
.mobile-btn-write-inquiry{width:100%;height:48px;background-color:#fff;color:#23B16C;border:1px solid #23B16C;border-radius:8px;font-size:15px;font-weight:600;letter-spacing:-0.5px;cursor:pointer;transition:background-color .2s ease}

@media only screen and (max-width: 1080px){
    .inquiry-section.web{padding: 0 10px 100px;}
}
@media only screen and (max-width: 768px) {
    /* 모바일에서 모달을 하단 정렬 */
    .inquiry-guide-modal,
    .inquiry-write-modal {
        align-items: flex-end !important;
    }
    
    /* 문의 안내 모달 바텀시트 */
    .inquiry-guide-modal .modal-content {
        max-width: 100%;
        width: 100%;
        max-height: 85vh;
        border-radius: 20px 20px 0 0;
        margin-bottom: 0;
        transform: translateY(100%);
        transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
    }
    
    .inquiry-guide-modal.show .modal-content {
        transform: translateY(0);
    }
    
    /* 문의 작성 모달 바텀시트 */
    .inquiry-write-modal .modal-content {
        max-width: 100%;
        width: 100%;
        max-height: 85vh;
        border-radius: 20px 20px 0 0;
        margin-bottom: 0;
        transform: translateY(100%);
        transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
    }
    
    .inquiry-write-modal.show .modal-content {
        transform: translateY(0);
    }
    
    /* 바텀시트 모드에서 모달 헤더에 핸들 추가 */
    .inquiry-guide-modal.show .modal-header::before,
    .inquiry-write-modal.show .modal-header::before {
        content: '';
        position: absolute;
        top: 8px;
        left: 50%;
        transform: translateX(-50%);
        width: 50px;
        height: 5px;
        background-color: #c4c4c4;
        border-radius: 3px;
    }
    
    .inquiry-guide-modal.show .modal-header,
    .inquiry-write-modal.show .modal-header {
        position: relative;
        padding: 16px 20px 20px 20px;
    }
    
    .inquiry-guide-modal .modal-body,
    .inquiry-write-modal .modal-body {
        max-height: calc(85vh - 120px);
        padding-bottom: env(safe-area-inset-bottom, 20px);
    }
    
    /* 바텀시트 열렸을 때 body 스타일 */
    body.inquiry-modal-open,
    body.inquiry-write-modal-open {
        overflow: hidden !important;
        position: fixed !important;
        width: 100% !important;
        height: 100% !important;
    }
}

/* 반응형 처리 */
@media only screen and (max-width: 720px) {
    .product-detail-wrap{padding-left:0 ;padding-right: 0;}
/* 모바일에서 inquiry-section 반응형 처리 */
    .inquiry-section.web {
        display: none !important;
    }

    .inquiry-section.mobile { display: flex !important;  flex-direction: column; gap: 30px;  }
    .inquiry-section.mobile .inquiry-write-section.mobile.top{padding: 0 10px;}
    .inquiry-section.mobile .inquiry-header{padding: 0 10px;}
    .inquiry-section.mobile   .inquiry-description-wrap{padding: 0 10px;}
}

@media only screen and (max-width: 720px) {
.inquiry-write-section.mobile .btn-write-inquiry{height: 48px; font-size: 15px;}
}