@media screen and (min-width: 1024px) {
    .house-list-main{
        margin-top: 1.72rem;
        width: 100%;
        height: 18.28rem;
        padding: 2.14rem;
        display: flex;
        background: #FFFFFF;
        box-shadow: 0 3px 6px 0 rgba(51,51,51,0.102);
        border-radius: .58rem;
        border: 1px solid #F0F0F0;
    }
    .house-list-main .imgCover{
        position: relative;
        width: 23rem;
        height: 100%;
    }
    .house-list-main .imgCover img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: .58rem;
    }
    .house-list-main .imgCover .not-img,
    .house-list-main .imgCover .yes-img{
        position: absolute;
        top: .58rem;
        right: .58rem;
        width: 2rem;
        height: 2rem;
    }
    .house-list-main .imgCover .bookmark-btn{
        position: absolute;
        top: .58rem;
        right: .58rem;
    }
    .house-list-main .info-box{
        width: calc(100% - 23rem);
        height: 100%;
    }
    .house-list-main .info-box .left{
        width: 50rem;
        height: 100%;
        padding: 0 2.86rem;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .house-list-main .info-box .left .title{
        font-size: 2rem;
        color: #333333;
        line-height: 2rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .house-list-main .info-box .left .local{
        display: flex;
        align-items: center;
    }
    .house-list-main .info-box .left .local div{
        margin-left: 4px;
        width: calc(100% - 20px);
        font-size: 1.14rem;
        color: #666666;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .house-list-main .info-box .left .other{
        display: flex;
        align-items: center;
    }
    .house-list-main .info-box .left .other .line{
        margin: 0 1.42rem;
        color: #DDDDDD;
    }
    .house-list-main .info-box .left .bar{
        width: 35.72rem;
        height: 1px;
        background: #F0F0F0;
    }
    .house-list-main .info-box .left .price{
        display: flex;
        align-items: center;
    }
    .house-list-main .info-box .left .price .from{
        font-size: 1.28rem;
        color: #999999;
        margin-right: .72rem;
    }
    .house-list-main .info-box .left .price .mun{
        font-size: 2rem;
        color: #6785FD;
    }
    .house-list-main .info-box .left .price .usd{
        margin-left: 2.14rem;
        color: #999999;
    }
    .house-list-main .info-box .right{
        width: calc(100% - 50rem);
    }
    .toast {
        width: 350px;
        max-width: 100%;
        font-size: 14px;
        pointer-events: auto;
        background-color: rgba(255, 255, 255, .85);
        background-clip: padding-box;
        border: 1px solid rgba(0, 0, 0, .1);
        box-shadow: 0 3px 6px 0 rgba(51, 51, 51, 0.102);
        border-radius: .58rem;
    }
}

@media screen and (min-width: 350px) and (max-width: 1020px){
    .house-list-main{
        margin-top: 14px;
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        background: #FFFFFF;
        box-shadow: 0 0.03rem 0.06rem 0 rgba(51,51,51,0.102);
        border-radius: 8px;
        border: 0.01rem solid #F0F0F0;
    }
    .house-list-main .imgCover{
        position: relative;
        width: 100%;
        height: 200px;
    }
    .house-list-main .imgCover img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 8px 8px 0 0;
    }
    .house-list-main .info-box{
        width: 100%;
        height: auto;
        padding: 12px;
    }
    .house-list-main .info-box .left{
        width: 100%;
        height: 100%;
        padding: 0 .4rem;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .house-list-main .info-box .left .title{
        font-size: 18px;
        color: #333333;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .house-list-main .info-box .left .local{
        margin-top: 10px;
        display: flex;
        align-items: center;
    }
    .house-list-main .info-box .left .local div{
        margin-left: 4px;
        width: calc(100% - 20px);
        font-size: 14px;
        color: #666666;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .house-list-main .info-box .left .other{
        margin-top: 10px;
        display: flex;
        align-items: center;
    }
    .house-list-main .info-box .left .other .line{
        margin: 0 4px;
        color: #DDDDDD;
    }
    .house-list-main .info-box .left .bar{
        margin: 20px 0;
        width: 100%;
        height: 1px;
        background: #F0F0F0;
    }
    .house-list-main .info-box .left .price{
        display: flex;
        align-items: center;
    }
    .house-list-main .info-box .left .price .from{
        font-size: 14px;
        color: #999999;
        margin-right: 4px;
    }
    .house-list-main .info-box .left .price .mun{
        font-size: 18px;
        color: #6785FD;
    }
    .house-list-main .info-box .left .price .usd{
        margin-left: 6px;
        color: #999999;
    }
    .house-list-main .info-box .right{
        display: none;
    }
}