#faq{
    position: relative;
    top: 35px;
    width: 100%;
    height: auto;
    overflow: hidden;
    text-align: center;
    background-color: #FDFDFD;

}


.faq-wrapper{
    margin-top: 70px;
    margin-bottom: 70px;
    z-index: 2;
}

.faq-name{
    font-family: 'Noto Sans TC', 'Arial';
    font-size: 22px;
}

.faq-description{
    width: auto;
    display:block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 35px;
    color: rgb(119,119,119);
}

.accordion-container{
    width: auto;
    height: auto;
    display: inline-block;
    margin: auto;
}

#ac-0, #ac-1, #ac-2{
    margin-bottom: 35px;
    background-color: #F7F7F7;
    border: none;
    -webkit-tap-highlight-color: transparent;
}

/* Question font */
.ac>.ac-q {
    font-family: 'Noto Sans TC', 'Arial';
    font-size: 14px;
}

/* Border around question div */
.ac>.ac-q{
    border: none;
}


/* Border around active question */
#ac-0.ac.js-enabled.is-active h4, #ac-1.ac.js-enabled.is-active h4, #ac-2.ac.js-enabled.is-active h4{
    border: none;
}

/* Blue outline around active question */
#ac-0.ac.js-enabled  h4, #ac-1.ac.js-enabled  h4, #ac-2.ac.js-enabled h4{
    outline: none !important;
}
    

/* Answer container */
.ac-a{
    background: #FDFDFD;
}

/* Answer */
.ac>.ac-a p {
    font-family: 'Roboto', 'Arial';
    color: rgb(119, 119, 119);
}

/* Plus button */
.ac>.ac-q::after {
    color: #A58861;
    padding: 2px;
    
}





/* Responsive */

@media screen and (min-width: 605px)
{
    .faq-name{
        font-size: 24px;
    }

}

@media screen and (min-width: 1143px)
{
    #faq{
        /* Ensures div is positioned correctly */
        top: 35px;
     
    }

    .faq-name{
        font-size: 22px;
    }

    .ac>.ac-a p, .faq-description, .ac>.ac-q {
        font-size: 16px;
    }

    .faq-description{
        width: auto;
    }
    
    .accordion-container{
        width: auto;
    }

    .faq-name{
        font-size: 26px;
    }
}



@media screen and (min-width: 1727px)
{

    .faq-wrapper{
        margin-top: 120px;
        margin-bottom: 120px;
    }

    .faq-name{
        font-size: 28px;
    }
        
}

@media screen and (min-width: 2355px)
{

    .faq-name{
        font-size: 30px;
    }

      
}

