.faq-container{

    display:flex;
    flex-direction:column;
    gap:14px;

}

.faq-item{

    border:1px solid #ddd;
    border-radius:12px;
    overflow:hidden;
    background:#fff;

}

.faq-question{

    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:20px;

    border:none;
    background:white;

    cursor:pointer;

}

.faq-question-left{

    display:flex;
    align-items:center;
    gap:10px;

}

.faq-q{

    font-weight:700;
    color:var(--theme);

}

.faq-question-text{

    font-size:17px;
    font-weight:600;
    text-align: left;

}

.faq-clip{

    color:#888;

}

.faq-arrow{

    transition:.3s;

}
.faq-answer {
    max-height: 0;
    overflow: hidden;

    transition:
            max-height .35s ease,
            padding .35s ease;

    padding: 0 20px;
    border-top: 0 solid #eee;

    display: flex;
    flex-direction: column;
    gap: 20px;
}

.faq-item.open .faq-answer {

    max-height: none;

    padding: 20px;

    border-top: 1px solid #eee;
}

.faq-item.open .faq-arrow{

    transform:rotate(180deg);

}

.faq-answer-text{

    padding:16px 18px;

    background:#f8fafc;
    border:1px solid #e8edf4;
    border-left:4px solid var(--theme);

    border-radius:10px;

    line-height:1.9;
    white-space:normal;

}


.faq-file-list {
     display: flex;
     flex-wrap: wrap; /* 자리가 부족하면 아래로 줄바꿈 */
     gap: 12px;
     margin-top: 12px;
 }

.faq-file-list > * {
    flex: 1 1 140px;   /* 기본 최소 120px 확보 */
    max-width: 257px;  /* 최대 257px까지만 늘어남 */
    min-width: 0;
}
.faq-files-header{

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding-bottom:12px;
    margin-bottom:14px;

    border-bottom:1px solid #eceff3;

    font-size:15px;
    font-weight:700;

}
.faq-files {

    border:1px solid #e8edf4;
    border-radius:10px;

    background:#fcfcfd;
    padding: 10px
}
.faq-files-header > div{

    display:flex;
    align-items:center;
    gap:5px;
}

.faq-files-header > div::before{
    content: "";
    height: 16px;
    width: 3px;
    background-color: var(--theme);
}

.faq-download-all{

    border:none;
    background:var(--theme);
    color:white;

    border-radius:6px;

    padding:7px 12px;

    cursor:pointer;

}
.faq-file {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    padding: 14px 10px;


    border:1px solid #e5e7eb;
    border-radius:10px;

    background:#fff;

    transition:.2s;

    cursor: pointer;



    min-height: 60px;

}

.faq-file:hover{

    transform: translateY(-2px);

    border-color: var(--theme);

    box-shadow:0 4px 12px rgba(20,124,246,.12);

}

.faq-file i{

    font-size:28px;

    color:var(--theme);

}

.faq-file-info{

    width:80%;

    display: flex;
    flex-direction: column;

}

.faq-file-name{

    font-size:13px;

    overflow:hidden;

    text-overflow:ellipsis;

    white-space:nowrap;

}

.faq-file-size{

    margin-top:4px;

    font-size:12px;

    color:#888;

}
.notice-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    margin-top: 32px;
}

.notice-pagination .page-btn {
    min-width: 40px;
    height: 40px;
    padding: 0 12px;

    border: 1px solid #ddd;
    background: #fff;

    border-radius: 8px;

    cursor: pointer;

    transition: .2s;
}

.notice-pagination .page-btn:hover:not(.active):not(.disabled) {
    background: #f5f5f5;
}


.notice-pagination .page-btn.active {
    background: var(--theme);
    color: #fff;
    border-color: var(--theme);
    font-weight: 600;
}

.notice-pagination .page-btn.disabled,
.notice-pagination .page-btn:disabled {

    opacity: .35;
    cursor: default;
    pointer-events: none;

    background: #f8f8f8;
    color: #999;

}
@media (max-width:1200px){



}

@media (max-width:900px){



}

@media (max-width:640px){



}