html,body{
    background: #fff;
    min-height: 100%;
}
.mui-bar-nav{
    background: #3723da;
    padding:0 12px;
}
.mui-bar-nav.mui-bar .mui-icon{
    color: #fff;
    font-size: 24px;
    padding: 0;
    line-height: 44px;
    margin: 0;
}
.mui-bar .mui-title{
    color: #fff;
    font-size: 17px;
    font-weight: 400;
}
.mui-bar-nav.mui-bar .r-text{
    line-height: 44px;
    color: #fff;
    font-size:17px;
}
.mui-content{
    background: #fff;
    height: 100%;
}
.mui-off-canvas-left, .mui-off-canvas-right{
    width: 82%;
    background: #343232;
}
.user{
    display: flex;
    display: -webkit-flex;
    border-bottom: 1px solid #444;
    padding: 14px 0 10px 0;
}
.user .img-box{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    margin:0 14px;

}
.user .img-box img{
    display: block;
    width: 100%;
}
.user .info{
    width: 100px;
    flex-grow: 1;
    line-height: 40px;
    -webkit-flex-grow: 1;
    color: #ffffff;
    font-size: 14px;
}
ul,li{
    list-style: none;
    padding: 0;
}
.nav-list{
    border-bottom: 1px solid #444;
}
.nav-list .nav-item{
    display: flex;
    display: -webkit-flex;
    margin: 10px 0;
}
.nav-list .nav-item img{
    width: 26px;
    height: 21px;
    margin: 0 22px 0 24px;
}
.nav-list .nav-item a{
    width: 100px;
    flex-grow: 1;
    -webkit-flex-grow: 1;
    color: #fff;
    font-size: 14px;
    line-height: 21px;
}

.mui-content{
    background: #fff;
}
.mui-content .type-list{
    width: 100%;
    padding: 0 15px;
    border-bottom: 1px solid #dcdcdc;
    line-height: 34px;
    display: flex;
    display: -webkit-flex;
}
.mui-content .type-list a{
    color: #333;
    text-align: center;
    font-size: 12px;
}
.mui-content .type-list .type-item{
    flex-grow: 1;
    -webkit-flex-grow: 1;
    width: 100px;
    z-index: 999;
    display: block;
}
.mui-content .type-list  .on{
    color: #3723da;
    border-bottom: 2px solid #3723da;
}
.mui-content .inp-group{
    width: 100%;
}
.mui-content .inp-group .inp-row{
    border-bottom: 1px solid #dcdcdc;
    display: flex;
    display: -webkit-flex;
    line-height: 32px;
    padding-left: 12px;
}
.mui-content .inp-group .inp-row label{
    font-size: 14px;
    color: #333;
    width: 120px;
    text-align: center;
}
.mui-content .inp-group .inp-row input{
    padding:0 0 0 6px;
    border: 0;
    margin: 0;
    width: 100px;
    font-size: 14px;
    flex-grow: 1;
    -webkit-flex-grow: 1;
    height: 35px;
    line-height: 35px;
}
.mui-content .inp-group .inp-row textarea{
    resize: none;
    border: 0;
    height: 120px;
    font-size: 14px;
    padding:6px 0;
    margin-bottom: 0;
}
.mui-content .inp-sel{
    border-bottom: 1px solid #dcdcdc;
    display: flex;
    display: -webkit-flex;
    line-height: 32px;
    padding-left: 12px;
}
.mui-content .inp-sel .sel-box span{
    display: block;
    width:10px;
    height: 10px;
    border: 1px solid #dcdcdc;
    margin-top: 11px;
    margin-right: 10px;
}
.mui-content  .inp-sel .sel-box img{
    width: 10px;
    vertical-align: 15px;
}
.mui-content .inp-sel .sel-box p{
    margin: 0;
    color: #333;
    font-size: 14px;
}
.mui-content .inp-sel .sel-box .protocol{
    color: #999;
}
.mui-content .inp-sel .sel-box .protocol a{
    color: #3723da;
    font-size: 14px;
}
.mui-content .btn{
    width: 120px;
    line-height: 36px;
    border-radius: 4px;
    padding: 0;
    font-size: 14px;
    color: #fff;
    text-align: center;
    display: block;
    background: #221396;
    border: 0;
    margin:20px auto;
}
.mui-content .other{
    text-align: center;
    margin: 20px 0 70px;
    font-size:14px;
    color: #333;
    width: 100%;
}
.mui-content .other img{
    width: 12px;
    vertical-align: -2px;
}
.mui-content .other a{
    color: #3723da;
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    color: #999;
}
input[type=radio]:checked {
    background: url(../images/selicon.png) center center no-repeat;
    background-size: 33px 33px;

}


/* text-color */
.text-white   { color: #fff !important; }
.text-light   { color: #999 !important; }
.text-muted   { color: #808080 !important; }
.text-gray    { color: #666 !important; }
.text-dark    { color: #333 !important;}
.text-primary { color: #f04848 !important; }
.text-success { color: #46be8a !important; }
.text-info    { color: #57c7d4 !important; }
.text-warning { color: #f2a654 !important; }
.text-danger  { color: #f96868 !important; }
.text-pink    { color: #e53b75 !important; }
.text-purple  { color: #6d45bc !important; }
.text-indigo  { color: #465bd4 !important; }
.text-red     { color: #221396 !important; }
.text-blue    { color: #0066cc !important; }
.text-green   { color: #27ae60 !important; }
.text-orange  { color: #d35400 !important; }
.text-yellow  { color: #ffec00 !important; }
.text-brown   { color: #8d6658 !important; }

/* bg-color */
.bg-primary{ background-color: #369ce0 !important; }
.bg-success{ background-color: #46be8a !important; }
.bg-info   { background-color: #57c7d4 !important; }
.bg-warning{ background-color: #f2a654 !important; }
.bg-danger { background-color: #f96868 !important; }
.bg-grey   { background-color: #757575 !important; }
.bg-red    { background-color: #f96868 !important; }
.bg-pink   { background-color: #f96197 !important; }
.bg-purple { background-color: #926dde !important; }
.bg-indigo { background-color: #677ae4 !important; }
.bg-blue   { background-color: #62a8ea !important; }
.bg-cyan   { background-color: #57c7d4 !important; }
.bg-teal   { background-color: #3aa99e !important; }
.bg-green  { background-color: #46be8a !important; }
.bg-yellow { background-color: #f7da64 !important; }
.bg-orange { background-color: #f2a654 !important; }
.bg-brown  { background-color: #8d6658 !important; }
.bg-light  { background-color: #fcfdff !important; }
.bg-white  { background-color: #ffffff !important; }

/* faq-group */
.faq-group{ 
    margin: 0 auto;
    padding: 20px 25px;
    overflow: hidden;   
    zoom: 1;
}
.faq-tite{font-size: 16px}
    .faq-item{ overflow: hidden; zoom: 1; }
    .faq-item .faq-tite a{
        position: relative;
        display: block;
        height: 24px;
        line-height: 24px;
        font-size: 16px;    
        overflow: hidden;
        font-weight: 400;
        padding: 9px;
        border-radius: 3px;
        -webkit-transition: .3s;
        transition: .3s;
    }       
        .faq-item .faq-tite a:hover{ text-decoration: none; color: #018ebb;}
        .faq-item .faq-tite a strong{ font-weight: 400;}    
        .faq-item .faq-tite a .iconfont-arrow-down{
            position: absolute;
            top: 8px;
            right: 5px;
            font-size: 20px;
            color: #bbb;
            -webkit-transition: .3s;
            transition: .3s;
       }                
            .faq-item .faq-tite a.open .iconfont-arrow-down{ -webkit-transform: rotate(180deg); transform: rotate(180deg);} 
            .faq-item .faq-tite a.open{ color: #018ebb;}
            .faq-item .faq-tite a.open:hover{ background-color: transparent;}
    
        .faq-item .faq-cont{
            font-size: 15px;
            margin-top: 0;
            padding: 0 2px 10px 2px;
            line-height: 1.8;
            font-size: 13px;
            color: #666;
        
        }
        .faq-item .faq-cont p{
    margin: 0 0 5px 5px;
    font-size: 14px;
    padding: 2px;
    color: #080;
    line-height: 1.5;
    border-left: 2px solid #e5e5e5;
    text-align: left;
}

/* faq-box */
.faq-box .faq-group{ float: left; width: 867px; height: 315px; border-right: 1px solid #eee; }
.faq-more{ 
    float: right;
    width: 250px;
    padding: 15px;
    overflow: hidden;
    text-align: center; 
}
    .faq-more img{ width: 250px; display: block;margin-bottom: 35px; }
    .faq-more li{ float: left; width: 50%; text-align: left; line-height: 28px; text-indent: 10px;}
    .faq-more li a{ color: #808080;}
    .faq-more li a:hover{ color: #018ebb;}
    .faq-more .btn{ padding-right: 7px; padding-left: 12px;}
   .btn-primary{
        display: inline-block;    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;user-select: none;
    color: #018ebb;
    border: 2px solid transparent;
    background-color: #3723da;
    border-radius: 3px;
    -webkit-transition: .3s;
    transition: .3s;height: 30px;
    line-height: 30px;
    padding: 0 4px;
    font-size: 13px;    color: #fff;
    border-color: #3723da;
    margin-right: 5px
    }
