@charset "utf-8";

/*------------ faq ------------*/

.faq-list{

    padding: 0 15px;

}

.faq-list .faq-item{

    position: relative;

    padding: 10px 0;

    border-bottom: 1px dashed #ddd;

    margin: 0 0 10px;

    list-style-type: none;

}

.faq-list .faq-item:before{

    content: "\e1019";

    font-family: 'icon-font' !important;

    speak: none;

    font-style: normal;

    font-weight: normal;

    font-variant: normal;

    text-transform: none;

    line-height: 1;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

    font-size: 30px;

    text-align: center;

    line-height: 47px;

    z-index: 10;

    display: inline-block;

    margin: 0 20px;

    color: #EB4130;

    font-weight: bold;

}

.faq-question{

    color: #7d7d7d;

    font-weight: bold;

    font-size: 20px;

    position: relative;

    padding: 0px 55px 15px 0;

    width: calc(100% - 95px);

    box-sizing: border-box;

    display: inline-block;

    vertical-align: middle;

    transition: all .2s;

    cursor: pointer;

}

.faq-question .name{

    margin: 0;

}

.faq-question i{

    display: inline-block;

    text-align: center;

    font-size: 18px;

    position: absolute;

    right: 20px;

    top: 0;

    transition: all .2s;

    margin: 5px 0 0 0;

    color: #ccc;

    border: 1px solid #ddd;

    text-indent: 0px;

    width: 20px;

}

.faq-item:hover .faq-question,

.faq-item.active .faq-question{

    color: #222;

}

.faq-answer{

    position: relative;

    padding: 15px 20px;

    margin: 5px 63px 5px 70px;

    background: #f5f5f5;

    color: #000;

     display: none; 

}

.faq-answer:before{

    content: "\e1018";

    font-family: 'icon-font' !important;

    speak: none;

    font-style: normal;

    font-weight: normal;

    font-variant: normal;

    text-transform: none;

    line-height: 1;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

    position: absolute;

    right: 100%;

    top: 0;

    font-size: 31px;

    margin: 0 18px 0 0;

    color: #cacaca;

}

.faq-answer .title{

    font-size: 45px;

    font-weight: bold;

}

/*------------ rwd ------------*/

@media screen and (max-width: 1000px){

    .faq-list .faq-item:before{

        margin:0 8px;

    }

    .faq-answer:before{

        display: none;

    }

}

@media screen and (max-width: 900px){

    .faq-answer{

        margin: 10px 0 0 0;

    }

}

@media screen and (max-width: 767px){

    .faq-question{

        width: calc(100% - 40px);

        padding: 0;

    }

    .faq-list .faq-item:before{

        vertical-align: top;

        width: 30px;

        height: 30px;

        font-size: 20px;

        line-height: 30px;

        margin: 0 0px 0 0;

    }

    .faq-question i{

        display: none;

    }

}