.section-title{margin-bottom: 9%;}

.section-title h1{ font-size: 1.7rem !important; margin-bottom: 0;}

.section-title p{font-size: 3rem !important;}

.max-w-5xl{
    max-width: 100% !important;
}


.text-center{
    text-align: left !important;
}


.text-sm span{
    content: '';
    background-color: #61B3E6;
    width: 7px;
    height: 7px;
    margin-bottom: 20px;
    border-radius: 50%;
    display: inline-block;
}


.page-section-wrapper{
    max-width: 65% !important;
    padding: 10% 0 15% !important;
}

.p-8{
    padding: 4.5% 3.5% !important;
}

.border-blue-600{
    border-color:#61B3E6 !important;
}
.hover\:bg-blue-800:hover{
    background-color: #2ba7f3 !important;
}

.font-semibold{
    font-family:'Pretendard', sans-serif !important;
}
.rounded-lg{
    padding: 0.6rem 0 0;
}

.text-2xl{
    font-size: 2.2rem !important;
    margin-bottom: 1.3rem;
}

.duration-300{
    padding:1.5% 0;
}

.p-5{
    font-size: 1.4rem !important;
    padding: 1.3rem 1.6rem !important;
}

.text-sm{
    font-size: 1.6rem !important;
}

.shadow-sm{
    font-size: 1.4rem !important;
}

.mt-1{
    margin-top: 1rem !important;
}

.text-white{
    background-color: #61B3E6;
    font-size: 1.3rem;
}
.py-2{ padding-bottom: 0.8rem !important; padding-top: 0.8rem !important;}
.px-3{ padding-left: 1rem !important; padding-right: 1rem !important;}

.h-32{ height: 12rem !important;}

.space-y-6 > :not([hidden]) ~ :not([hidden]){
    margin-top: 3% !important;
}

.faqtop{
    display: flex !important;
    justify-content: space-between;
    border-bottom: 2px solid #8f8f8f;
}

.faqtop .cs-info{
    width: 23% !important;    
}

.faqtop .inquiry{
    width: 75% !important;
    margin-bottom: 8%;
}

.faqtop .list{
    margin-top: 7%;
}

.faqtop .list p{ color: #61B3E6;}




/* 아코디언 아이콘 트랜지션 */
.accordion-icon {
    transition: transform 0.3s ease-in-out;
}
.accordion-button[aria-expanded="true"] .accordion-icon {
    transform: rotate(180deg);
}

/* 커스텀 모달 스타일 */
#custom-modal.hidden {
    display: none;
}
#custom-modal p {
    white-space: pre-wrap; /* 성공 메시지의 줄바꿈을 유지하기 위함 */
    font-size: 1.6rem !important; /* 다른 텍스트 크기와 맞춤 */
    line-height: 1.5;
    color: #333;
}
#modal-close-btn {
    font-size: 1.3rem;
    background-color: #61B3E6;
}

.mt-8 {
    margin-top: 8rem !important;
}

/* FAQ 카테고리 스타일 */
        .faq-categories ul { list-style: none; padding: 0; }
        .faq-categories li {
            padding: 10px 15px;
            cursor: pointer;
            font-size: 1.6rem;
            color: #666;
            border-left: 3px solid transparent;
            transition: all 0.2s ease-in-out;
        }
        .faq-categories li:hover {
            color: #61B3E6; /* red-500 */
        }
        .faq-categories li.active {
            color: #61B3E6; /* red-500 */
            font-weight: 600; /* semibold */
            border-left-color: #61B3E6; /* red-500 */
        }























/* -------------------- 모바일 반응형 -------------------- */
@media screen and (max-width: 720px) {

.page-section-wrapper{
    padding: 38% 0 15% !important;
    max-width: 82% !important;
}

.section-title h1{
    font-size: 1rem !important;
}

.section-title p{
    font-size: 1.5rem !important;
}

.faqtop{
    flex-direction: column;
    padding-bottom: 14%;
    border-bottom: 1px solid #8f8f8f;
}

.faqtop .cs-info{
    display: none;
}

.faqtop .inquiry{
    width: 100% !important;
}

.text-2xl{
    font-size: 1.3rem !important;
    line-height: 1.4rem !important;
}

.pl-4{
    padding-left: 0.7rem !important;
    margin-bottom: 0 !important;
}

.text-sm{
    font-size: 1rem !important;
}

.text-sm span{
    margin-bottom: 12px;
    width: 5px; height: 5px;
}

.mt-1{
    margin-top: 0.8rem !important;
}

.gap-6{
    gap: 1rem;
}

.rounded-lg{
    padding: 1.3rem 0 0 !important;
}

.space-y-6 > :not([hidden]) ~ :not([hidden]){
    margin-top: 7% !important;
}

.shadow-sm{
    font-size: 1rem !important;
}

.flex{
    flex-direction: column;
    gap: 14px;
}

.mt-8{
    margin-top: 1% !important;
}

.w-1\/4{
    width: 100% !important;
    margin-bottom: 5%;
}

.w-3\/4{width: 100% !important;}
.pl-8{padding-left: 0 !important;}
.p-5{font-size: 1rem !important; padding: 0.8rem 0.7rem !important}
.items-center{flex-direction: row !important;}
.faq-categories ul{display: flex; flex-direction: row; justify-content: space-between;}
.faq-categories li{border-bottom: 3px solid transparent; padding: 8px 5px; font-size: 1rem;}
.faq-categories li.active{ border-bottom-color: #61B3E6; border-left-color:transparent !important; }
.space-y-4{ margin-top: 5%; }
.duration-300{ padding: 3% 0  !important;}
.text-white{font-size: 1rem;}
.space-y-16 > :not([hidden]) ~ :not([hidden]){margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))) !important;}







}





























@media (min-width: 721px) {
    .md\:p-8{
        padding: 0 0 !important;
        position: relative !important;
    }
    
}