@charset "utf-8";
img{
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
}
.container-wrap{
    margin:0 auto;
    background:url("../../image/banner.png") no-repeat center top;
    background-size:auto 280px;
    /* overflow:hidden; */
}
.container-wrap .wrap{
    padding-top:240px;
}
.right-content{
    float:right;
    width:280px;
}
.left-content{
    margin-right:300px;
}
.left-content>div, .right-content>div{
    background:#fff;
    border-radius:4px;
    box-shadow:0 0 6px 0 rgba(206,206,206,0.3);
}
/*用户信息 start*/
.user-info-box .top-info{
    padding:24px;
    font-size:0;
}
.user-info-box .user-headpic{
    display:inline-block;
    vertical-align:middle;
    width:60px;
    height:60px;
    border-radius:50%;
    background:url("../../image/headpic.png") no-repeat center;
    background-size:cover;
}
.user-info-box .user-info{
    display:inline-block;
    vertical-align:middle;
    max-width:160px;
    margin-left:12px;
    text-align:left;
}
.user-info-box .user-info .main-info{
    word-break:break-all;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:18px;
    color:#333;
}
.user-info-box .user-info .sub-info{
    margin-top:12px;
    font-size:14px;
    color:#666;
}
.user-info-box .user-info .sub-info .count{
    padding-left:8px;
}
.user-info-box .bottom-info{
    border-top:1px solid #eee;
    padding:24px 0;
}
.user-info-box .user-score{
    padding:0 24px;
    margin-right:-20px;
    margin-bottom:-25px;
    overflow:hidden;
}
.user-info-box .user-score li{
    box-sizing:border-box;
    float:left;
    width:50%;
    padding-right:20px;
    margin-bottom:25px;
    text-align:left;
    font-size:12px;
    color:#666;
}
.user-info-box .user-score li em{
    font-weight:bold;
    font-size:18px;
    color:#333;
}
.user-info-box .bottom-info .btn-box{
    font-size:0;
    text-align:center;
}
.user-info-box .bottom-info .btn-register{
    margin-left:20px;
}
/*用户信息 end*/
/*qq反馈 start*/
.qq-group{
    margin-top:20px;
    padding:30px 0;
}
.qq-group .qq-box{
    text-align:center;
    font-size:0;
}
.qq-group .icon-qq-gray{
    display:inline-block;
    vertical-align:middle;
    width:40px;
    height:40px;
    background:url("../../image/icon-qq-gray.png") no-repeat center;
    background-size:100% auto;
}
.qq-group .qq-desc{
    display:inline-block;
    vertical-align:middle;
    margin-left:10px;
    text-align:left;
}
.qq-group .teasing{
    font-size:16px;
    color:#333;
}
.qq-group .qq-number{
    margin-top:9px;
    font-size:13px;
    color:#666;
}
.qq-group .add-group-box{
    padding-top:18px;
    text-align:center;
}
/*qq反馈 end*/
/*考试说明 start*/
.exam-instruction{
    padding:30px 50px 30px 30px;
    text-align:left;
}
.exam-instruction .title{
    margin-bottom:16px;
    font-size:18px;
    color:#333;
}
.exam-instruction .desc{
    line-height:24px;
    font-size:14px;
    color:#666;
}
.exam-instruction .btn-box{
    display:none;
    margin-top:15px;
    font-size:0;
}
.exam-instruction .btn-register{
    margin-left:20px;
}
/*考试说明 end*/
/*模考列表 start*/
.mock-wrap{
    margin-top:20px;
    overflow:hidden;
}
.type-list-box{
    padding:28px 30px 26px;
    overflow:hidden;
}
.type-list{
    margin-right:-24px;
    margin-bottom:-20px;
    text-align:left;
}
.type-list li{
    display:inline-block;
    margin-right:24px;
    margin-bottom:20px;
}
.type-list li a{
    font-size:14px;
    color:#333;
}
.type-list li:hover a, .type-list li.active a{
    color:#5172ff;
}
.type-list li.active a{
    text-decoration:underline;
}
/*模考列表 end*/
/*提示 start*/
.tips-box{
    display:none;
    position:relative;
    height:40px;
    line-height:40px;
    background:#faeecf;
    text-align:center;
}
.tips-box .tips{
    font-size:14px;
    color:#948d82;
}
.tips-box .continue{
    padding:0 4px;
    font-weight:bold;
    text-decoration:underline;
    color:#5172ff;
}
.tips-box .icon-close{
    position:absolute;
    right:42px;
    top:50%;
    width:14px;
    height:14px;
    margin-top:-7px;
    background:url("../../image/icon-close-tips.png") no-repeat center;
    background-size:100% auto;
    cursor:pointer;
}
.tips-box .icon-close:hover{
    background:url("../../image/icon-close-tips-hover.png") no-repeat center;
    background-size:100% auto;
}
/*提示 end*/
/*模考列表 start*/
.mock-list-container{
    display:none;
    padding:0 30px 80px;
    overflow:hidden;
}
.mock-item{
    margin-bottom:50px;
}
.mock-item:last-child{
    margin-bottom:0;
}
.mock-item:first-child{
    padding-top:30px;
}
.mock-item .title-box{
    text-align:left;
    color:#333;
    font-size:0;
}
.mock-item .title-box .title{
    display:inline-block;
    font-size:18px;
    font-weight:bold;
}
.mock-item .title-box .intro{
    display:inline-block;
    padding-left:14px;
    font-size:14px;
}
.mock-item .suitable{
    margin-top:20px;
    text-align:left;
    font-size:14px;
    color:#999;
}
.mock-list-wrap{
    padding-top:30px;
    margin-bottom:-18px;
    margin-right:-18px;
    overflow:hidden;
}
.mock-list-wrap .list-item{
    float:left;
    width:33.3%;
    margin-bottom:18px;
}
.mock-list-wrap .item-box{
    position:relative;
    box-sizing:border-box;
    height:215px;
    margin-right:18px;
    border-radius:4px;
    background:#f9f9ff;
    overflow:hidden;
    cursor:pointer;
}
.mock-list-wrap .mock-info{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:1;
    border-radius:4px;
    border:1px solid #f1f1fc;
    padding:15px 20px 0;
    text-align:left;
}
.mock-list-wrap .mock-name-box{
    height:60px;
    overflow:hidden;
    margin-right:70px;
    font-size:0;
}
.mock-list-wrap .no-status .mock-name-box{
    margin-right:0;
}
.mock-list-wrap .mock-name{
    display:inline-block;
    vertical-align:middle;
    width:100%;
    font-size:26px;
    color:#5172ff;
    opacity:0.2;
    font-weight:bold;
    width: 149px;
}
.mock-list-wrap .mock-name-box:after{
    content:"";
    display:inline-block;
    vertical-align:middle;
    width:0;
    height:100%;
}
.mock-list-wrap .mock-data{
    overflow:hidden;
    font-size:14px;
    color:#666;
}
.mock-list-wrap .mock-data .desc{
    float:left;
}
.mock-list-wrap .mock-data .data-box{
    margin-left:76px;
    overflow:hidden;
}
.mock-list-wrap .mock-number{
    padding-top:16px;
}
.mock-list-wrap .mock-score{
    padding-top:18px;
}
.mock-list-wrap .score-list{
    margin-bottom:-10px;
    font-size:0;
}
.mock-list-wrap .score-list li{
    display:inline-block;
    width:70px;
    margin-bottom:10px;
    text-align:left;
    font-size:14px;
}
.mock-list-wrap .score-list .writing .score{
    display:inline-block;
    vertical-align:middle;
}
.list-item.done .mock-score{
    color:#5172ff;
}
.list-item.done .mock-data .desc{
    font-weight:bold;
}
.mock-list-wrap .score-list .icon-complete{
    display:inline-block;
    vertical-align:middle;
    width:15px;
    height:15px;
    background:url("../../image/icon-complete.png") no-repeat center;
    background-size:100% auto;
}
.mock-list-wrap .progress{
    position:absolute;
    bottom:-1px;
    left:-1px;
    right:-1px;
    height:5px;
    background:#d9e5fd;
    border-radius:0 0 4px 4px;
}
.mock-list-wrap .progress .current{
    width:0;
    height:100%;
    background:#859cff;
    border-radius:0 0 4px 4px;
}
.mock-list-wrap .status-break{
    position:absolute;
    top:21px;
    right:11px;
    font-size:0;
}
.mock-list-wrap .status-break .icon-break{
    display:inline-block;
    vertical-align:middle;
    width:16px;
    height:16px;
    background:url("../../image/icon-pause.png") no-repeat center;
    background-size:100% auto;
}
.mock-list-wrap .status-break .status{
    display:inline-block;
    vertical-align:middle;
    padding-left:5px;
    font-size:14px;
    color:#d7deff;
}
.mock-list-wrap .status-complete{
    position:absolute;
    top:11px;
    right:11px;
    width:60px;
    height:59px;
    background:url("../../image/icon-trophy.png") no-repeat center;
    background-size:100% auto;
}
.more-mock .item-box{
    border:1px solid #f1f1fc;
    border-radius:4px;
    background:#fff;
    cursor:default;
}
.more-mock .icon-more{
    width:75px;
    height:66px;
    margin:45px auto 0;
    background:url("../../image/icon-more.png") no-repeat center;
    background-size:100% auto;
}
.more-mock .more{
    text-align:center;
    line-height:22px;
    font-size:14px;
    color:#a6a6a6;
}
.mock-list-wrap .hover-box{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:2;
    transform:translate(0, 100%);
    -ms-transform:translate(0, 100%);
    -moz-transform:translate(0, 100%);
    -o-transform:translate(0, 100%);
    -webkit-transform:translate(0, 100%);
    transition:all 0.6s ease;
    -moz-transition:all 0.6s ease;
    -o-transition:all 0.6s ease;
    -webkit-transition:all 0.6s ease;
    border-radius:4px;
    border:1px solid #f1f1fc;
    background:rgba(255,255,255,0.9);
    text-align:center;
}
.mock-list-wrap .item-box:hover .hover-box{
    transform:translate(0, 0);
    -ms-transform:translate(0, 0);
    -moz-transform:translate(0, 0);
    -o-transform:translate(0, 0);
    -webkit-transform:translate(0, 0);
}
.mock-list-wrap .hover-box .preview-box{
    position:absolute;
    top:17px;
    left:0;
    width:100%;
    text-align:left;
}
.preview-box .preview{
    display:inline-block;
    vertical-align:middle;
    padding-left:17px;
    font-size:14px;
    color:#666;
}
.preview-box .icon-arrow{
    display:inline-block;
    vertical-align:middle;
    width:16px;
    height:16px;
    margin-left:5px;
    background:url("../../image/icon-arrow.png") no-repeat center;
    background-size:100% auto;
}
.preview-box:hover .preview{
    color:#333;
}
.preview-box:hover .icon-arrow{
    background:url("../../image/icon-arrow-hover.png") no-repeat center;
    background-size:100% auto;
}
.mock-list-wrap .hover-box .break-tips{
    position:absolute;
    top:60px;
    left:0;
    width:100%;
    font-size:14px;
    color:#ff9796;
}
.mock-list-wrap .hover-box .btn{
    display:block;
    margin:80px auto 0;
}
.mock-list-wrap .hover-box .btn-hollow{
    display:block;
    margin:10px auto 0;
}
/*模考列表 end*/
/*样题模考 start*/
.mock-sample .list-item{
    width:50%;
}
.mock-sample .mock-info{
    padding-top:30px;
}
.mock-sample .mock-name-box{
    height:auto;
}
.mock-sample .mock-number{
    padding-top:28px;
}
.mock-sample .mock-data .data-box{
    max-width:210px;
}
.mock-sample .status-complete{
    right:21px;
    top:20px;
}
.mock-sample .status-break{
    right:21px;
}
/*样题模考 end*/