@charset "UTF-8";
.point-top-box{
    width: 100%;
    margin-top: var(--header-height);
    margin-bottom: 21px;
    padding-top: 28px;
}
.point-top-box .point-top-info{
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.point-top-box .point-top-info .point-swiper{
    width: 800px;
    height: 416px;
    overflow: hidden;
    position: relative;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}
.point-top-box .point-top-info .point-swiper .swiper-slide{
    display: block;
    width: 100%;
    height: 100%;
}
.point-top-box .point-top-info .point-swiper .swiper-slide img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.point-top-box .point-top-info .point-top-r{
    flex: 1;
    height: 416px;
    border-radius: 5px;
    background: #FFFFFF;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}
.point-top-box .point-top-info .point-top-r .ptr-top{
    width: 100%;
    height: 53px;
    border-bottom: 1px solid #D8D8D8;
    padding: 20px 30px;
    align-items: center;
    justify-content: space-between;
}
.point-top-box .point-top-info .point-top-r .ptr-top p{
    font-size: var(--app-fs-18);
    color: #4C4C4C;
}
.point-top-box .point-top-info .point-top-r .ptr-top a{
    font-size: var(--app-fs-14);
    color: #D92A1D;
}
.point-top-box .point-top-info .point-top-r .ptr-list{
    padding: 16px 31px;
}
.point-top-box .point-top-info .point-top-r .ptr-list .ptr-l-item{
    display: block;
    font-size: var(--app-fs-16);
    color: #3D3D3D;
    line-height: 30px;
}
.point-top-box .point-top-info .point-top-r .ptr-btm{
    width: 100%;
    height: 46px;
    display: flex;
    align-items: center;
    background: #FFF2EA;
    padding-left: 25px;
    font-size: var(--app-fs-14);
    color: #D92A1D;
}
.point-tabs{
    margin-bottom: 25px;
}
.point-tabs .point-tabs-info{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: #fff;
    padding: 20px 36px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}
.point-tabs .point-tabs-info .ctf-l{
    display: flex;
    align-items: center;
}
.point-tabs .point-tabs-info .ctf-l .ctf-l-title{
    font-size: var(--app-fs-20);
    color: #212121;
    font-weight: bold;
    margin-right: 50px;
}
.point-tabs .point-tabs-info .ctf-l .ctf-l-list{
    display: flex;
    align-items: center;
}
.point-tabs .point-tabs-info .ctf-l .ctf-l-list a{
    margin-right: 36px;
    font-size: var(--app-fs-18);
    color: #757575;
}
.point-tabs .point-tabs-info .ctf-l .ctf-l-list a:hover{
    color: #D92A1D;
}
.point-tabs .point-tabs-info .ctf-l .ctf-l-list a.active{
    color: #D92A1D;
}
.point-tabs .point-tabs-info .ctf-l .el-input{
    font-size: var(--app-fs-18);
    color: #757575;
    width: 40%;
}
.point-tabs .point-tabs-info .ctf-l .el-input__inner{
    border: none;
    padding-right: 0;
    font-size: var(--app-fs-18);
    color: #757575;
}
.point-tabs .point-tabs-info .ctf-l input::placeholder {
    color: #757575;
}
.point-tabs .point-tabs-info .ctf-r{
    display: flex;
    align-items: center;
}
.point-tabs .point-tabs-info .ctf-r-list{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.point-tabs .point-tabs-info .ctf-r-list a{
    font-size: var(--app-fs-18);
    color: #757575;
    margin-right: 30px;
    white-space: nowrap;
}
.point-tabs .point-tabs-info .ctf-r-list a:hover{
    color: #D92A1D;
}
.point-tabs .point-tabs-info .ctf-r-list a.active{
    color: #D92A1D;
}
.point-info-list .pil-box{
    justify-content: space-between;
    flex-wrap: wrap;
}
.point-info-list .pil-item{
    display: block;
    width: 24%;
    height: auto;
    overflow: hidden;
}
.point-info-list .pil-item .pil-wrapper{
    padding-bottom: 81.15%;
    position: relative;
    display: block;
    margin-bottom: 21px;
    overflow: hidden;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}
.point-info-list .pil-item .pil-wrapper .pil-img{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
}
.point-info-list .pil-item:hover .pil-img{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
}
.point-info-list .pil-item:hover .pph-title{
    color: #D92A1D;
}
.point-info-list .pph-title-box{
    justify-content: space-between;
    margin-bottom: 17px;
}
.point-info-list .pph-title-box .pph-title {
    font-size: var(--app-fs-16);
    color: #3D3D3D;
    font-weight: 500;
}
.point-info-list .pph-title-box .pph-title-right {
    width: 75px;
    height: 20px;
    background: #D92A1D;
    font-size: var(--app-fs-12);
    color: #fff;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
}
.point-info-list .pph-title-box .pph-title-right p {
    white-space: nowrap;
    margin-left: 3px;
}
.point-info-list .pph-btm-box {
    color: #B5B5B5;
    justify-content: space-between;
    margin-bottom: 30px;
}
.point-info-list .pph-btm-box  .iconfont {
    font-size: var(--app-fs-12);
}
.point-info-list .pph-btm-box  p {
    font-size: var(--app-fs-14);
    margin-left: 8px;
}
.point-info-list .pph-btm-box .pph-item-r .pph-item-r-like {
    margin-left: 15px;
}
.point-recommend{
    width: 100%;
    height: auto;
    background: #fff;
    margin-top: 48px;
    padding-top: 46px;
    padding-bottom: 92px;
    position: relative;
}
.point-recommend .pr-top{
    align-items: center;
    margin-bottom: 40px;
}
.point-recommend .pr-top .pr-top-title{
    font-size: var(--app-fs-24);
    font-weight: bold;
    color: #212121;
    margin-right: 20px;
}
.point-recommend .pr-top .pr-top-subtitle{
    font-size: var(--app-fs-14);
    color: #757575;
}
.point-recommend .point-recommend-swiper{
    width: 100%;
    overflow: hidden;
    position: relative;
}
.point-recommend .point-recommend-swiper .prs-img{
    width: 100%;
    height: 224px;
    object-fit: cover;
    overflow: hidden;
    margin-bottom: 20px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}
.point-recommend .point-recommend-swiper .pph-title-box{
    justify-content: space-between;
    margin-bottom: 17px;
}
.point-recommend .point-recommend-swiper .pph-title-box .pph-title {
    font-size: var(--app-fs-16);
    color: #3D3D3D;
    font-weight: 500;
}
.point-recommend .point-recommend-swiper .pph-title-box .pph-title-right {
    width: 75px;
    height: 20px;
    background: #D92A1D;
    font-size: var(--app-fs-12);
    color: #fff;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
}
.point-recommend .point-recommend-swiper .pph-title-box .pph-title-right p {
    white-space: nowrap;
    margin-left: 3px;
}
.point-recommend .point-recommend-swiper .pph-btm-box {
    color: #B5B5B5;
    justify-content: space-between;
    margin-bottom: 30px;
}
.point-recommend .point-recommend-swiper .pph-btm-box  .iconfont {
    font-size: var(--app-fs-12);
}
.point-recommend .point-recommend-swiper .pph-btm-box  p {
    font-size: var(--app-fs-14);
    margin-left: 8px;
}
.point-recommend .point-recommend-swiper .pph-btm-box .pph-item-r .pph-item-r-like {
    margin-left: 15px;
}
.point-recommend .point-recommend-swiper .swiper-slide:hover .pph-title{
    color: #D92A1D;
}
.point-recommend .pos-r{
    width: 100%;
    position: relative;
}
.point-recommend .swiper-button-prev{
    color: #222;
    font-size: var(--app-fs-24);
    font-weight: 700;
    left: -4%;
}
.point-recommend .swiper-button-next{
    color: #222;
    font-size: var(--app-fs-24);
    font-weight: 700;
    right: -4%;
}
.community-details .point-btn-zs{
    width: 115px;
    height: 34px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    margin-top: 40px;
    background: #D92A1D;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    color: #fff;
    font-size: var(--app-fs-14);
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}
.point-d-r .pdr-btns{
    justify-content: center;
    margin-top: 30px;
}
.point-d-r .pdr-btns .btn-item{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 116px;
    height: 30px;
    border-radius: 5px;
    font-size: var(--app-fs-14);
    color: #757575;
    position: relative;
    background: #FFFFFF;
    border: 1px solid #C0C4CC;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    cursor: pointer;
}
.point-d-r .pdr-btns .btn-item.zs{
    color: #D92A1D;
    border-color: #D92A1D;
    margin-right: 10px;
}
.point-d-r .csr-list-top{
    justify-content: space-between;
}
.point-d-r .csr-list-top .pdr-t{
    font-size: var(--app-fs-18);
    color: #4C4C4C;
}
.page-point-box.point-details{
    margin-top: 40px;
}
.point-details .community-details-title{
    display: flex;
    align-items: center;
    justify-content: center;
}
.point-details .community-details-title span{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 34px;
    height: 20px;
    font-size: var(--app-fs-12);
    color: #fff;
    border-radius: 3px;
    background: #D92A1D;
    margin-left: 15px;
}
.point-user .community-tabs{
    margin-bottom: 18px;
}
.point-user .point-user-num{
    margin-top: 39px;
    justify-content: space-between;
}
.point-user .point-user-num .pun-item{
    text-align: center;
}
.point-user .point-user-num .pun-item p{
    font-size: var(--app-fs-14);
    color: #757575;
    line-height: 22px;
}
.point-user .point-user-num .pun-item p.number{
    font-size: var(--app-fs-14);
    font-weight: 600;
    color: #606266;
}
.appreciate-mask{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 100;
    display: none;
}
.appreciate-box{
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 351px;
    background: #fff;
    z-index: 101;
    border-radius: 5px;
    padding: 25px 40px;
    padding-bottom: 20px;
    display: none;
}
.appreciate-box .app-out{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.appreciate-box .appreciate-title{
    font-size: var(--app-fs-18);
    color: #4c4c4c;
    margin-bottom: 14px;
}
.appreciate-box .appreciate-sub{
    width: 100%;
    padding: 15px 0;
    background: #F9F9F9;
    text-align: center;
    font-size: var(--app-fs-14);
    color: #757575;
    margin-bottom: 15px;
}
.appreciate-box .appreciate-list{
    width: 100%;
    align-items: center;
    justify-content: space-between;
}
.appreciate-box .appreciate-list .appreciate-item{  
    width: 59px;
    height: 30px;
    border-radius: 5px;
    background: #FFFFFF;
    border: 1px solid #C0C4CC;
    font-size: var(--app-fs-14);
    color: #757575;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.appreciate-box .appreciate-list .appreciate-item.active{
    color: #D92A1D;
    border-color: #D92A1D;
}
.appreciate-box .appreciate-btm{
    margin-top: 40px;
}
.appreciate-box .appreciate-btm .input-box{
    width: 136px;
    height: 30px;
    border-radius: 5px;
    background: #FFFFFF;
    box-sizing: border-box;
    border: 1px solid #C0C4CC;
    align-items: center;
    padding: 0 15px;
    margin-right: 25px;
}
.appreciate-box .appreciate-btm .input-box .ib-text{
    font-size: var(--app-fs-14);
    color: #757575;
}
.appreciate-box .appreciate-btm .input-box input{
    width: 60%;
    flex: 1;
    border: none;
    padding-left: 6px;
}
.appreciate-box .appreciate-btm .appb-btn{
    width: 115px;
    height: 34px;
    border-radius: 5px;
    background: #D92A1D;
    font-size: var(--app-fs-14);
    color: #fff;
    cursor: pointer;
}
.appreciate-box .feed-close{
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    font-size: 16px;
}
@media (max-width: 1280px){
    .point-recommend .swiper-button-next{
        right: 1%;
    }
    .point-recommend .swiper-button-prev{
        left: 1%;
    }
}
@media (max-width: 996px){
    .point-top-box .point-top-info .point-swiper{
        height: 316px;
    }
    .point-top-box .point-top-info .point-top-r{
        height: 316px;
    }
    .point-tabs .point-tabs-info{
        padding: 15px;
        margin-bottom: 15px;
        flex-wrap: wrap;
    }
    .point-tabs .point-tabs-info .ctf-l{
        flex-wrap: wrap;
        width: 100%;
    }
    .point-tabs .point-tabs-info .ctf-r{
        margin-top: 15px;
    }
    .point-tabs .point-tabs-info .ctf-l .ctf-l-title{
        width: 100%;
        text-align: center;
        margin-bottom: 15px;
        margin-right: 0;
    }
    .point-tabs .point-tabs-info .ctf-l .ctf-l-list{
        justify-content: space-between;
        width: 100%;
    }
    .point-tabs .point-tabs-info .ctf-l .ctf-l-list a{
        margin-right: 0;
    }
    .point-info-list .pil-item{
        width: 49%;
    }
}
@media (max-width: 768px){
    .point-info-list .pil-item{
        width: 100%;
    }
    .point-top-box .point-top-info{
        flex-wrap: wrap;
    }
    .point-top-box .point-top-info .point-swiper{
        width: 100%;
        height: auto;
    }
    .point-top-box .point-top-info .point-top-r{
        width: 100%;
        height: auto;
    }
    .point-top-box .point-top-info .point-top-r .ptr-top,.point-top-box .point-top-info .point-top-r .ptr-list{
        padding: 15px;
    }
    .point-info-list .pph-btm-box,.point-info-list .pil-item .pil-wrapper,.point-info-list .pph-title-box{
        margin-bottom: 15px;
    }
    .point-recommend{
        margin-top: 25px;
        padding: 15px 0;
    }
    .point-recommend .pr-top{
        margin-bottom: 15px;
    }
    .point-tabs{
        margin-bottom: 0;
    }
    .page-point-box.point-details{
        margin-top: 0;
    }
    .community-sentences{
        padding-bottom: 15px !important;
    }
    .page-point-box .page-point-top,.page-point-box .page-point-hot-box .pph-item .pph-wrapper,.page-point-box .page-point-hot-box .pph-item .pph-title-box{
        margin-bottom: 15px;
    }
    .community-tabs .community-tabs-info .ctf-l .ctf-l-title{
        margin-bottom: 0;
    }
}