* {
    box-sizing: border-box;
}
html,
body {
    height: 100%;
}
body {
    background-color: #F7F8FA;
}
.brand-header {
    width: 100%;
    height: .8rem;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99;
    background-color: rgba(255, 255, 255, 1);
    box-shadow: 0rem .04rem .08rem 0rem #F8F8F8;
}
.brand-header.act {
    background-color: #ffffff;
    -webkit-box-shadow: 0 .01rem .04rem 0 rgba(0, 0, 0, .1);
    box-shadow: 0 .01rem .04rem 0 rgba(0, 0, 0, .1);
}
.header-content {
    width: 12rem;
    height: .8rem;
    margin: 0 auto;
    display: flex;
    justify-content: flex-start;
}
.header-content .logo {
    width: 1.2rem;
    height: .8rem;
    margin-right: .2rem;
    padding: .24rem 0;
}
.header-content .logo img {
    display: block;
}
.header-content .mini-nav{
    height: .8rem;
    line-height: .3rem;
    padding: .25rem 0;
    box-sizing: border-box;
    display: flex;
}
.header-content .mini-nav span{
    margin-right: .3rem;
    cursor: pointer;
}
.header-content .mini-nav span a{
    font-size: .16rem;
    color: #2B2929;
    text-decoration: none;
    display: block;
}
.header-content .mini-btns{
    height: .8rem;
    line-height: .3rem;
    padding: .25rem 0;
    box-sizing: border-box;
}
.header-content .mini-btns span{
    margin-right: .2rem;
    cursor: pointer;
    font-size: .16rem;
    color: #2B2929;
    position: relative;
}
.header-content .search-container {
    width: 3.4rem;
    height: .8rem;
    margin: 0 auto;
    padding: .22rem 0;
    display: flex;
}
.header-content .search-container .search-input {
    width: 2.74rem;
    height: .36rem;
    line-height: .34rem;
    font-size: .16rem;
    color: #999999;
    text-align: left;
    background-color: rgba(255, 255, 255, .3);
    border-radius: .18rem 0 0 .18rem;
    padding: 0 .18rem;
    border-radius: .18rem 0 0 .18rem;
    border: .01rem solid #4376FD;
    border-right: none;
}
.header-content .search-container .search-input input {
    width: 100%;
    height: .36rem;
    line-height: .36rem;
    font-size: .16rem;
    color: #999999;
    text-align: left;
    outline: none;
    border: none;
    background: none;
}
.header-content .search-container .search-btn {
    width: .66rem;
    height: .36rem;
    line-height: .36rem;
    font-size: .16rem;
    text-align: center;
    background-color: #4376FD;
    color: #ffffff;
    cursor: pointer;
    border-radius: 0 .18rem .18rem 0;
}
.header-content .usercenter-container .login-container{
    width: .96rem;
    height: .8rem;
    margin-right: .2rem;
}
.header-content .usercenter-container .login-container .login-btn{
    width: .96rem;
    height: .8rem;
    padding: .22rem 0;
    box-sizing: border-box;
    display: none;
}
.header-content .usercenter-container .login-container .login-btn span{
    display: block;
    width: .96rem;
    height: .36rem;
    line-height: .36rem;
    border-radius: .02rem;
    text-align: center;
    font-size: .16rem;
    border: .01rem solid #E80000;
    cursor: pointer;
    color: #e80000;
    box-sizing: border-box;
}
.header-content .usercenter-container .login-container .login-btn span:hover{
    background-color: rgba(232,0,0,.08);
    border: .01rem solid #E80000;
}
.header-content .usercenter-container .login-container .userinfo-btn{
    width: .96rem;
    height: .8rem;
    padding: .2rem 0;
    box-sizing: border-box;
    display: flex;
    justify-content: flex-end;
}
.header-content .usercenter-container .login-container .userinfo-btn .avatar{
    width: .4rem;
    height: .4rem;
    position: relative;
}
.header-content .usercenter-container .login-container .userinfo-btn .avatar .avatar-img{
    display: block;
    width: .4rem;
    height: .4rem;
    border-radius: .2rem;
    overflow: hidden;
    font-size: 0;
    background-color: #F7F8FA;
}
.header-content .usercenter-container .login-container .userinfo-btn .avatar img{
    width: .4rem;
    height: .4rem;
    object-fit: cover;
}
/* 导航 */
.breadcrumb{
    width: 12rem;
    height: 1.3rem;
    line-height: .2rem;
    margin: 0 auto .3rem;
    padding-top: 1.1rem;
    font-size: .14rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    color: #2B2929;
}
.breadcrumb a{
    font-size: .14rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    color: #4376FD;
}
.breadcrumb i{
    font-size: .12rem;
    color: #4376FD;
    margin: 0 .05rem;
}
.main-container{
    width: 12rem;
    height: auto;
    margin: 0 auto;
    display: flex;
}
.main-container.pos{
    position: relative;
}
.main-container .left-container{
    width: 8.3rem;
    height: auto;
    margin-right: .3rem;
}
.main-container.recall .left-container{
    width: 12rem;
    margin-right: 0;
}
.main-container .left-container .title{
    width: 100%;
    height: auto;
    font-size: .22rem;
    font-family: PingFangSC-Semibold;
    font-weight: 600;
    color: #2B2929;
    line-height: .3rem;
    text-align: center;
    margin-bottom: .3rem;
}
.main-container .left-container .recall-item{
    width: 100%;
    height: auto;
    line-height: .24rem;
    font-size: .16rem;
    font-family: PingFangSC-Semibold;
    font-weight: 600;
    color: #2B2929;
    margin-bottom: .1rem;
    word-break: break-all;
}
/* 召回信息汇总页 */
.recall-filter-container{
    width: 100%;
    height: .45rem;
    margin: 0 auto .2rem;
    display: flex;
    padding-bottom: .15rem;
    border-bottom: .01rem solid #EFEFEF;
}
.recall-filter-container .recall-date-selecter,
.recall-filter-container .recall-brand-selecter,
.recall-filter-container .recall-maker-selecter,
.recall-filter-container .recall-series-selecter{
    height: .3rem;
    line-height: .3rem;
    margin-right: .3rem;
    position: relative;
}
.recall-filter-container .recall-maker-selecter,
.recall-filter-container .recall-series-selecter{
    display: none;
}
.recall-filter-container .curr-data{
    height: .3rem;    
    line-height: .3rem;
    cursor: pointer;
    display: flex;
}
.recall-filter-container .curr-data span{
    font-family: PingFangSC-Regular;
    font-weight: 400;
    font-size: .16rem;
    color: #2B2929;
    display: block;
}
.recall-filter-container .curr-data i{
    font-size: .1rem;
    margin-left: .05rem;
    display: block;
}
.recall-down-list .list-box::-webkit-scrollbar {
    width: .04rem;
}
.recall-down-list .list-box::-webkit-scrollbar-track {
    background:#fff;
    border: none;
}
.recall-down-list .list-box::-webkit-scrollbar-thumb {
    background: #EFEFEF;
    border-radius: .02rem;
}

.recall-filter-container .recall-down-list .list-box ul li:hover{
    background-color: #F7F8FA;
}
.recall-filter-container .recall-down-list .list-box ul li.act{
    background-color: #4376FD !important;
    color: #fff !important;
}
/* 年月 */
.recall-filter-container .recall-date-selecter .recall-down-list{
    height: auto;
    max-height: 2rem;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: .3rem;
    display: none;
}
.recall-filter-container .recall-date-selecter .recall-down-list.act{
    display: flex;
}
.recall-filter-container .recall-date-selecter .recall-down-list .list-box{
    height: auto;
    max-height: 2rem;
    overflow-y: auto;
    box-shadow: 0rem 0rem .07rem -0.02rem #A1A1A1;
    border-radius: .02rem;
}
.recall-filter-container .recall-date-selecter .recall-down-list .list-box ul{
    width: 1rem;
    height: auto;
}
.recall-filter-container .recall-date-selecter .recall-down-list .list-box ul li{
    width: 1rem;
    height: .28rem;
    line-height: .28rem;
    text-align: left;
    cursor: pointer;
    color: #2B2929;
    font-size: .16rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    padding: 0 .1rem;
}
/* 品牌 */
.recall-filter-container .recall-brand-selecter .recall-down-list{
    height: auto;
    max-height: 2.8rem;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: .3rem;
    display: none;
}
.recall-filter-container .recall-brand-selecter .recall-down-list.act{
    display: flex;
}
.recall-filter-container .recall-brand-selecter .recall-down-list .list-box{
    width: 100%;
    height: auto;
    max-height: 2.8rem;
    overflow-y: auto;
    box-shadow: 0rem 0rem .07rem -0.02rem #A1A1A1;
    border-radius: .02rem;
}
.recall-filter-container .recall-brand-selecter .recall-down-list .list-box ul{
    width: 100%;
    height: auto;
}
.recall-filter-container .recall-brand-selecter .recall-down-list .list-box ul li{
    width: 100%;
    height: .28rem;
    line-height: .28rem;
    text-align: left;
    cursor: pointer;
    color: #2B2929;
    font-size: .16rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    padding: 0 .1rem;
    word-break: keep-all;
}
.recall-filter-container .recall-brand-selecter .recall-down-list .list-box ul li.initial{
    font-size: .14rem;
    height: .22rem;
    line-height: .22rem;
    background-color: #F7F8FA;
}
.recall-filter-container .recall-search{
    margin-left: auto;
    width: 2.4rem;
    height: .3rem;
    display: flex;
}
.recall-filter-container .recall-search .recall-search-box{
    width: 1.8rem;
    height: .3rem;
    margin-right: .1rem;
    border: .01rem solid #C7C7C7;
    border-radius: .03rem;
    padding: .05rem .1rem;
    background-color: #fff;
    position: relative;
}
.recall-filter-container .recall-search .recall-search-box input{
    width: 100%;
    height: .18rem;
    background-color: #fff;
    border: none;
    outline: none;
    display: block;
}
.recall-filter-container .recall-search .recall-search-box .recall-search-cancel{
    width: .14rem;
    height: .14rem;
    border-radius: .07rem;
    overflow: hidden;
    cursor: pointer;
    text-align: center;
    line-height: .14rem;
    position: absolute;
    right: .1rem;
    top: .07rem;
    display: none;
}
.recall-filter-container .recall-search.act .recall-search-box .recall-search-cancel{
    display: block;
}
.recall-filter-container .recall-search .recall-search-box .recall-search-cancel i{
    font-size: .14rem;
    color: #999;
}
.recall-filter-container .recall-search .recall-search-btn{
    width: .5rem;
    height: .3rem;
    line-height: .3rem;
    background: #999999;
    border-radius: .03rem;
    text-align: center;
    font-size: .12rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    color: #FFFFFF;
    cursor: pointer;
}
.recall-filter-container .recall-search.act .recall-search-btn{
    background-color: #4376FD;
}
.recall-list-container{
    width: 100%;
    height: auto;
    min-height: calc(100% - 4.3rem);
    margin: 0 auto;
}
.recall-list-container .no-data{
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: 1.2rem;
    font-size: .16rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    color: #999;
}
.recall-list-container .list-item{
    width: 100%;
    height: auto;
    margin-bottom: .3rem;
}
.recall-list-container .list-item .r-title{
    width: 100%;
    height: auto;
    margin-bottom: .15rem;
    word-break: break-all;
    line-height: .3rem;
}
.recall-list-container .list-item .r-title a{
    font-size: .2rem;
    font-family: PingFangSC-Semibold;
    font-weight: 600;
    color: #2B2929;
    display: block;
}
.recall-list-container .list-item .r-info{
    width: 100%;
    height: auto;
    margin-bottom: .15rem;
}
.recall-list-container .list-item .r-info .info-item{
    width: 100%;
    height: auto;
    margin-bottom: .15rem;
    display: flex;
}
.recall-list-container .list-item .r-info .info-item span:last-child{
    flex: 1;
    line-height: .22rem;
    font-size: .16rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    color: #2B2929;
    text-align: left;
}
.recall-list-container .list-item .r-info .info-item span:first-child{
    width: .8rem;
    min-width: 60px;
    line-height: .22rem;
    font-size: .16rem;
    font-family: PingFangSC-Semibold;
    font-weight: 600;
    color: #2B2929;
}
.recall-list-container .list-item .check-detail{
    width: 100%;
    height: .42rem;
    background-color: #4376FD;
    border-radius: .03rem;
}
.recall-list-container .list-item .check-detail a{
    display: block;
    width: 100%;
    height: .42rem;
    text-align: center;
    line-height: .42rem;
    font-size: .16rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    color: #fff;
}
.main-container .right-container{
    width: 3.4rem;
    height: auto;
}
.main-container .right-container .sub-title{
    width: 100%;
    height: .45rem;
    padding-bottom: .15rem;
    text-align: left;
    line-height: .3rem;
    font-size: .18rem;
    font-family: PingFangSC-Semibold;
    font-weight: 600;
    color: #2B2929;
}
.recent-recall-container{
    width: 100%;
    height: auto;
    background-color: #fff;
    padding: .2rem;
    padding-bottom: 0;
}
.recent-recall-container ul{
    width: 100%;
    height: auto;
}
.recent-recall-container ul li{
    width: 100%;
    height: auto;
    border-bottom: .01rem solid #efefef;
    padding-bottom: .2rem;
    display: flex;
    margin-bottom: .2rem;
}
.recent-recall-container ul li:last-child{
    border-bottom: none;
}
.recent-recall-container ul li .series-info{
    flex: 1;
    height: .84rem;
    margin-right: .1rem;
}
.recent-recall-container ul li .series-info .title{
    width: 100%;
    height: .25rem;
    line-height: .25rem;
    text-align: left;
    margin-bottom: .05rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.recent-recall-container ul li .series-info .title a{
    font-size: .18rem;
    font-family: PingFang SC;
    font-weight: 500;
    color: #2B2929;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.recent-recall-container ul li .series-info .price{
    width: 100%;
    height: .22rem;
    line-height: .22rem;
    text-align: left;
    margin-bottom: .1rem;
    color: #e80000;
    font-size: .16rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
}
.recent-recall-container ul li .series-info .maker{
    width: 100%;
    height: .2rem;
    line-height: .2rem;
    text-align: left;
    color: #606266;
    font-size: .14rem;
    font-family: PingFangSC-Regular;
    font-weight: 400;
}
.recent-recall-container ul li .series-img{
    width: 1.5rem;
    height: .84rem;
}
.recent-recall-container ul li .series-img img{
    width: 1.5rem;
    height: .84rem;
    object-fit: contain;
    transform: scale(1.4);
}
/* 分页 */
.full-reply-bottom{
    width: 100%;
    height: .64rem;
    padding: .2rem 0;
    display: flex;
}
.full-reply-bottom .hide-full-reply {
    flex: 1;
    height: .24rem;
}
.full-reply-bottom .hide-full-reply span {
    height: .24rem;
    line-height: .24rem;
    text-align: left;
    font-size: .14rem;
    color: #4376FD;
    font-family: PingFangSC-Regular;
    font-weight: 400;
    cursor: pointer;
}
/* 分页器 */
.recall-pagination-container{
    width: 100%;
    height: .76rem;
    padding: .2rem 0;
    display: flex;
    justify-content: center;
}
.pageindex-wrap{
    display: flex;
}
.recall-pagination-container span{
    display: inline-block;
    min-width: .36rem;
    height: .36rem;
    line-height: .34rem;
    border: .01rem solid #EFEFEF;
    color: #999;
    text-align: center;
    font-size: .16rem;
    cursor: pointer;
}
.recall-pagination-container span:hover{
    background-color: #efefef;
}
.recall-pagination-container span.act {
    border: .01rem solid #4376FD;
    background-color: #4376FD;
    color: #fff;
}
.recall-pagination-container span.prev,.recall-pagination-container span.next{
    color: #999;
    font-size: .12rem;
}
.recall-pagination-container span.prev{
    margin-right: .05rem;
}
.recall-pagination-container span.next{
    margin-left: .05rem;
}
.recall-pagination-container .skip-to{
    width: 1rem;
    height: .36rem;
    color: #999;
    font-size: .14rem;
    margin-left: .1rem;
}
.recall-pagination-container .skip-to input#skip_to_page{
    width: .48rem;
    height: .36rem;
    border: .01rem solid #EFEFEF;
    line-height: .34rem;
    text-align: center;
    color: #999;
    font-size: .14rem;
    margin: 0 .05rem;
}
/* 返回顶部 */
.back-to-document-top{
    box-shadow: 0rem .04rem .08rem 0rem #F8F8F8;
}
.back-to-document-top i{
    display: block;
}