* {
    margin : 0;
    padding: 0;
}

html,
body {
    height    : 100%;
    max-width : 640px;
    margin    : 0 auto;
    background: #f8f8f7;
}

.wrapper {
    height        : 100%;
    display       : flex;
    flex-direction: column;
}

.content {
    flex      : 1;
    overflow-y: auto;
}

.content img {
    width: 100%;
}

.top {
    background: #fff;
}

.top_title {
    width      : 100%;
    margin     : 0 auto;
    text-align : center;
    font-size  : .36rem;
    line-height: .4rem;
    font-weight: 500;
    position   : relative;
    padding    : .2rem 0;
    background : #f8f8f7;
}

.top_title>a:first-child {
    display     : block;
    position    : absolute;
    left        : .1rem;
    width       : .16rem;
    height      : .16rem;
    border      : .02rem solid #3f333a;
    transform   : rotate(45deg);
    border-right: 0;
    border-top  : 0;
    margin-top  : .1rem;
    margin-left : .2rem;
}

.top_title a {
    text-decoration: none;
    cursor         : pointer;
    color          : #333;
}

.order_box {
    width        : 7.02rem;
    padding      : .2rem;
    box-sizing   : border-box;
    background   : #fff;
    border-radius: .1rem;
    margin       : 0 auto;
    margin-top   : .2rem;
}

.tit {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
}

.order_num {
    font-size: .24rem;
    color    : #666666;
}

.order_status {
    font-size: .24rem;
    color    : #4d4d4d;
}

.con {
    display   : flex;
    margin-top: .25rem;
}

.con img {
    width        : 1.77rem;
    height       : 1.03rem;
    border-radius: .1rem;
    margin-right : .15rem;
}

.con .msg {
    flex           : 1;
    display        : flex;
    flex-direction : column;
    justify-content: space-between;
}

.product_name {
    font-size         : .26rem;
    color             : #4d4d4d;
    text-overflow     : -o-ellipsis-lastline;
    overflow          : hidden;
    text-overflow     : ellipsis;
    display           : -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp        : 2;
    -webkit-box-orient: vertical;
    padding: .05rem 0;
}

.price_box {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    margin-top: .2rem;
}

.price {
    font-size: .32rem;
    color    : #ff7200;
}

.to_logistics {
    width           : 1.4rem;
    height          : .4rem;
    background-color: #ffffff;
    border-radius   : .15rem;
    border          : solid 1px #ff7200;
    font-size       : .24rem;
    color           : #ff7200;
    text-align      : center;
    line-height     : .4rem;
}

.kefu {
    padding        : .5rem 0;
    display        : flex;
    justify-content: center;
    align-items    : center;
}

.kefu img {
    width       : 1.56rem;
    height      : 1.56rem;
    margin-right: .15rem;
}

.kefu_name,
.kefu_intro {
    font-size : .24rem;
    color     : #4d4d4d;
    text-align: center;
}

.kefu_intro {
    padding      : .1rem .18rem;
    border       : 1px solid #4c4c4c;
    border-radius: .15rem;
    margin-top   : .15rem;
}

.no_data {
    text-align   : center;
    margin-top   : 2rem;
    margin-bottom: 1rem;
}

.no_data img {
    width: 2rem;
}

.no_data p {
    color: #666;
}