* {margin: 0; padding: 0; box-sizing: border-box;}
html, body {
    height: 100%;
}
.tab {
    height: 100%;
    position: relative;
    overflow-y: scroll;
    overflow-x: hidden;
}
.search {
    display: flex;
    height: .96rem;
    border: 1px solid #ccc;
    border-radius: .533333rem;
    margin: .133333rem .533333rem;
    align-items: center;
    overflow: hidden;
}
.search > input {
    padding-left: .266667rem;
    border: none;
    border-radius: .533333rem;
    flex: 1;
}
.search > img {
    width: .746667rem;
    height: .573333rem;
    margin-right: .4rem;
}
.filter {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
}
.filter > div {
    flex: 1;
    line-height: 1.226667rem;
    text-align: center;
    font-size: .373333rem;
    font-weight: bold;
}
.filter > div:first-child {
    border-right: 1px solid #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
}
.filter > div:first-child > img {
    width: .44rem;
    height: .6rem;
    margin-right: .44rem;
}
.filter > div:last-child {
    display: flex;
    align-items: center;
    justify-content: center;
}
.filter > div:last-child > img {
    width: .533333rem;
    height: .56rem;
    margin-right: .44rem;   
}
.questionAbs, .filter_abs {
    position: absolute;
    top: 0;
    left: 100%;
    right: 0;
    z-index: 999;
    background-color: #fff;
    width: 100%;
    bottom: 0;
    transition: all 0.5s ease;
}
.questionAbs {
    display: flex;
    flex-direction: column;
}
.questionAbs_content {
    flex: 1;
    overflow: auto;
}
.title{
    width: 100%;
    height: 1.213333rem;
    line-height: 1.213333rem;
    font-size: .32rem;
    letter-spacing: .026667rem;
    color: #9b9b9b;
    border-top: 1px solid #e4e3ea;
    border-bottom: 1px solid #e4e3ea;
    padding-left: .506667rem;

}
.check {
    display: flex;
    align-items: center;
    /* height: 1.066667rem; */
    line-height: 1.066667rem;
    font-size: .48rem;
    padding-left: .506667rem;
    border-bottom: 1px solid #e6e5eb;
}
.check > input {
    display: none;
}
.check > span:first-of-type {
    width: .466667rem;
    height: .466667rem;
    border-radius: 50%;
    border: 1px solid #c3c3c3;
    flex-shrink: 0;
    margin-right: .333333rem;
}
.check > input:checked + span {
    background: url('./images/chosen.png') no-repeat;
    background-size: contain;
    border: none;
}
.filter_btn_navs, .questionAbs_btn {
	width:100%;
    padding: .266667rem .666667rem;
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, .6), #fff); 
    position:absolute;
    bottom:0;
    z-index:99;
}
.quesSub, .filter_btn {
    color: #d50012;
    border: 1px solid #fe0000;
    font-size: .373333rem;
    border-radius: 1.12rem;
    width: 100%;
    height: 1.306667rem;
    line-height: 1.306667rem;
    text-align: center;
    letter-spacing: 0.3em;
    background:#fff;
    /* margin: 2rem auto 0; */
}
.filter_btn {
    margin-top: 0;
}
.filter_abs {
    
}
.filter_content {
    height: 100%;
    overflow-y: auto;
    box-sizing: border-box;
    padding-bottom:1.75rem;
}






.tabList {
    display: flex;
    align-items: center;
}
.tabList > div {
    flex: 1;
    height: 1.066667rem;
    text-align: center;
    line-height: 1.066667rem;
    position: relative;
    font-size: .373333rem;
    color: #787878;
    font-weight: bold;
}
.tabList > div.active {
    color: #000;
    font-size: .453333rem;
}
.tabList > div.active::after {
    content: '';
    display: block;
    position: absolute;
    bottom: -0.026667rem;
    width: .8rem;
    height: .053333rem;
    background-color: #000;
    left: 50%;
    transform: translate3d(-50%, 0, 0);
}
.tabListContent > div {
    display: none;
}
.tabListContent > div.active {
    display: block;
}
.tabListContent_1 {}
.tabListContent_1 > div, .tabListContent_3 > div {
    margin: 0 .533333rem;
    border-bottom: 1px solid #e7e6ec;
    font-size: .373333rem;
    position: relative;
    height: 1.626667rem;
    display: flex;
    align-items: center;
    padding-right: .533333rem;
}
.tabListContent_1 > div::after, .tabListContent_3 > div::after {
    content: '';
    display: block;
    width: .266667rem;
    height: .466667rem;
    position: absolute;
    background: url('./images/right_arrow.png') no-repeat;
    background-size: contain;
    top: 50%;
    transform: translate3d(0, -50%, 0);
    right: 0;
}
.tabListContent_2 {
    padding: 0 .666667rem;
}
.tabListContent_2 > div {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.tabListContent_2 > div > div {
    flex: 0.5;
    width: 18.75rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-top: .666667rem;
    font-size: .373333rem;
    color: 000;
}
.tabListContent_2 > div > div > video {
    background-color: #ccc;
    border-radius: .24rem;
    width: 4rem;
    height: 2.666667rem;
}
.tabListContent_2 > div > div > span {
    padding-top: .213333rem;
}
.tabListContent_3 {
    display: flex;
    flex-direction: column;
}
.tabListContent_3 > div {
    font-size: .373333rem;
    padding-left: .8rem;
}
.tabListContent_3 > div::before {
    content: '';
    display: block;
    width: .613333rem;
    height: .306667rem;
    position: absolute;
    background: url('./images/pdf.png') no-repeat;
    background-size: contain;
    top: 50%;
    transform: translate3d(0, -50%, 0);
    left: 0;
}
.abs {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: .106667rem;
    z-index: 89;
    display: none;
    background-color: #fff;
}
.abs.active {
    display: flex;
}
.abs > div {
    width: 100%;
    text-align: center;
    font-size: .346667rem;
    line-height: .533333rem;
    line-height: .533333rem;
    padding: .266667rem 0;
    border-bottom: 1px solid #ccc;
}