
@media screen and (min-width:751px) {

    
    .member {
        width: 1400px;
        margin: auto;
        margin-top: 20px;
        display: flex;
        justify-content: space-between;
        background-color: white;
    }
    
    .member-left {
        width: 230px;
    }
    
    .member-left ul li {
        width: 100%;
        border-bottom: 1px solid #999;
        line-height: 26px;
        font-size: 14px;
    }
    
    .member-left ul li:last-child{
        border-bottom: none;
    }
    
    .member-left ul li a {
        display: inline-block;
        width: 100%;
        padding: 10px 20px;
        box-sizing: border-box;
    }
    
    .member-left ul li .select-member {
        background-color: #000;
        color: #fff;
    }
    
    .member-right {
        width: 1130px;
    }
    
    .color-red {
        color: #f34e14;
    }
    
    .color-grey {
        color: #999;
        font-size: 13px;
    }
    
    /* member.css */
    .mod-member{
        display: none;
    }

    .member-header {
        padding: 10px 10px;
        font-size: 14px;
        line-height: 26px;
        background-color: #f7d23a;
    }
    
    .member-header a {
        color: #4ebeff;
    }
    
    .member-user {
        padding: 25px 10px;
        display: flex;
        align-items: center;
    }
    
    .member-user div:first-child {
        margin-right: 10px;
    }
    
    .member-user>div:first-child img {
        width: 80px;
    }
    .member-user div:first-child div{
        display: none;
    }
    
    .member-user>div:nth-child(2) p:nth-child(2) {
        margin-top: 10px;
        color: #4ebeff;
    }
    
    .member-integral {
        display: flex;
        justify-content: space-between;
    }
    
    .member-integral>div {
        width: 30%;
        padding: 20px 0;
        border-radius: 8px;
        overflow: hidden;
        color: #fff;
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    .member-integral .member-level {
        background-image: url("../static/images/vip-6.png");
    }
    
    .member-integral .member-number {
        background-image: url("../static/images/integral.png");
    }
    
    .member-integral .member-coupon {
        background-image: url("../static/images/coupon.png");
    }
    
    .member-integral div .member-laber span {
        display: inline-block;
        padding: 5px 20px;
        border-radius: 0 15px 15px 0;
        font-size: 14px;
    }
    
    .member-integral .member-level .member-laber span {
        background-color: #ac62f5;
    }
    
    .member-integral .member-number .member-laber span {
        background-color: #ff6b9e;
    }
    
    .member-integral .member-coupon .member-laber span {
        background-color: #62a7f5;
    }
    
    .member-integral .member-level .level-font {
        margin-top: 20px;
        padding-left: 20px;
        font-size: 20px;
    }
    
    .member-integral .member-level .level-experience {
        margin: 0 20px;
        margin-top: 25px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .member-integral .member-level .level-experience>span {
        display: inline-block;
        width: 75%;
        height: 6px;
        border-radius: 3px;
        background-color: #fff;
        position: relative;
    }
    
    .member-integral .member-level .level-experience>span span {
        display: inline-block;
        width: 20%;
        height: 100%;
        border-radius: 2px;
        background-color: #f34e14;
        position: absolute;
        left: 0;
        top: 0;
    }
    
    .member-integral .member-level p:last-child {
        margin-top: 10px;
        text-align: center;
        font-size: 12px;
    }
    
    .member-integral .member-level p:last-child span {
        text-decoration: underline;
    }
    
    .member-integral .integral-number {
        text-align: center;
        margin-top: 10px;
        font-size: 60px;
        font-weight: bold;
    }
    
    .member-integral .integral-underline {
        text-align: center;
        text-decoration: underline;
    }
    
    .member-extension {
        width: 100%;
        margin-top: 25px;
    }
    
    .member-extension p {
        width: 100%;
    }
    
    .member-extension p img {
        width: 100%;
    }
    
    .member-extension p:nth-child(2) {
        padding: 4px 0;
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 14px;
        border: 1px solid #ccc;
        border-top: none;
        box-sizing: border-box;
    }
    
    .member-extension p:nth-child(2) .extension-href {
        margin-left: 15px;
    }
    
    .member-extension p:nth-child(2) .extension-href span {
        color: #4ebeff;
        margin-left: 5px;
    }
    
    .member-extension p:nth-child(2) span button {
        padding: 5px 15px;
        border-radius: 3px;
        border: none;
        background-color: #4ebeff;
        color: #fff;
        margin-right: 5px;
        cursor: pointer;
    }
    
    .member-extension p:nth-child(2) #clone-put {
        position: absolute;
        top: -100%;
        left: 0;
        opacity: 0;
        z-index: -10;
    }
    
    .rule {
        position: fixed;
        left: 50%;
        top: 50%;
        background-color: #fff;
        width: 450px;
        transform: translate(-50%, -50%);
        box-shadow: 3px 3px 13px 3px #999;
        display: none;
    }
    
    .rule div:first-child {
        display: flex;
        justify-content: space-between;
        padding: 10px;
        border-bottom: 1px solid #ccc;
    }
    
    .rule div:nth-child(2) {
        padding: 15px;
        line-height: 25px;
    }
    
    .member-order {
        margin-top: 30px;
        border-radius: 3px;
        background-color: #f1f1f1;
    
        font-size: 14px;
        overflow: hidden;
    }
    
    .member-order .order-head {
        padding: 15px;
        background-color: #000;
        color: #fff;
    }
    
    .member-order .order-cont {
        padding: 25px 40px;
        display: flex;
        justify-content: space-between;
        text-align: center;
        line-height: 26px;
    }
    
    .member-order .order-cont p:nth-child(2) {
        margin-top: 5px;
    }
    
    /* order.css */
    .mod-order{
        display: none;
    }

    .all-order {
        padding: 10px;
    }
    .all-order .all-span{
        display: flex;
    }
    .all-order .all-span a {
        display: inline-block;
        flex-grow: 1;
        padding: 3px 0;
        text-align: center;
        border: 1px solid #eee;
        border-left: 0;
        cursor: pointer;
    }
    
    .all-order .all-span a:first-child {
        border-left: 1px solid #eee;
    }
    
    .all-order .all-span .all-select {
        background-color: #eee;
    }
    
    .all-order .order-div {
        width: 100%;
        margin-top: 20px;
        border: 1px solid #f1f1f1;
    }
    
    .all-order .order-div .order-div-head {
        padding: 5px 10px;
        background-color: #f1f1f1;
        display: flex;
        justify-content: space-between;
        font-size: 14px;
    }
    
    .all-order .order-div .order-div-head>span:first-child span {
        margin-left: 20px;
    }
    
    .all-order .order-div .order-div-head>span:nth-child(2) {
        cursor: pointer;
    }
    
    .all-order .order-div .order-div-cont {
        display: flex;
    }
    
    .all-order .order-div .order-div-cont div {
        height: 120px;
        padding: 5px 10px;
        text-align: center;
        border-right: 1px solid #f1f1f1;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }
    
    .all-order .order-div .order-div-cont div:first-child,
    .all-order .order-div .order-div-cont div:nth-child(3) {
        width: 90px;
    }
    
    .all-order .order-div .order-div-cont div:nth-child(2) {
        width: 366px;
        justify-content: flex-start;
        text-align: left;
    }
    .all-order .order-div .order-div-cont div:nth-child(4),
    .all-order .order-div .order-div-cont div:nth-child(5){
        width: 155px;
    }
    .all-order .order-div .order-div-cont div:nth-child(6){
        width: 200px;
    }
    
    .all-order .order-div .order-div-cont div img {
        width: 90px;
        height: 120px;
    }
    
    .all-order .order-div .order-div-cont div p {
        width: 100%;
    }
    
    .all-order .order-div .order-div-cont div p a {
        color: #4ebeff;
    }
    
    /* car.css */
    .mod-car-div{
        display: none;
    }
    .car-div {
        margin: 15px 15px 0;
        border: 1px solid #f1f1f1;
        display: flex;
    }
    
    .car-div>div {
        flex-grow: 1;
        text-align: center;
        border-right: 1px solid #f1f1f1;
    }
    
    .car-div>div:first-child {
        width: 110px;
        flex-grow: 0;
    }
    
    .car-div>div:first-child p img {
        width: 90px;
    }
    
    .car-div>div:nth-child(2) {
        max-width: 250px;
        flex-grow: 1.5;
        text-align: left;
    }
    
    .car-div>div p {
        padding: 5px 10px;
    }
    
    .car-div>div>p:first-child {
        background-color: #f1f1f1;
        text-align: center;
    }
    
    .car-div .car-div-title>div>p:first-child {
        color: #4ebeff;
    }
    
    .car-div .car-div-title>div div {
        margin-top: 10px;
        color: #666;
        font-size: 13px;
    }
    
    .car-div .car-div-num div:nth-child(2) {
        height: calc(100% - 31px);
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .car-div .car-div-num div:nth-child(2) span {
        display: inline-block;
        width: 25px;
        height: 25px;
        border: 1px solid #ccc;
        border-radius: 2px;
    }
    
    .car-div .car-div-num div:nth-child(2) input {
        width: 80px;
        height: 25px;
        border: 1px solid #ccc;
        margin: 0 5px;
        border-radius: 2px;
        outline: none;
        text-align: center;
    }
    
    .car-div .car-div-money p:nth-child(2),
    .car-div .car-div-discount p:nth-child(2) {
        height: calc(100% - 41px);
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .car-div .car-div-operation div {
        height: calc(100% - 31px);
        display: flex;
        flex-direction: column;
        justify-content: center;
        color: #4ebeff;
    }
    
    .car-div .car-div-operation div p {
        cursor: pointer;
    }
    
    .car-subtotal {
        margin: 20px 15px 0;
        text-align: right;
    }
    
    .car-subtotal div {
        display: inline-block;
        width: 300px;
        padding: 10px;
        border: 1px solid #f1f1f1;
        line-height: 30px;
    }
    
    .car-subtotal div p:first-child,
    .car-subtotal div p:nth-child(2) {
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 14px;
    }
    
    .car-subtotal div p:nth-child(3) {
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 17px;
    }
    
    .car-subtotal div p:nth-child(3) span:nth-child(2) {
        color: #ff6b9e;
    }
    
    .car-subtotal div p:nth-child(4) {
        font-size: 12px;
        color: #999;
        line-height: 20px;
    }
    
    .car-subtotal div p:last-child {
        display: flex;
        justify-content: space-around;
    }
    
    .car-subtotal div p:last-child a {
        display: inline-block;
        margin-top: 10px;
        width: 45%;
        padding: 3px 0;
        border-radius: 3px;
        text-align: center;
        color: #fff;
    }
    
    .car-subtotal div p:last-child a:first-child {
        background-color: #f34e14;
    }
    
    .car-subtotal div p:last-child a:nth-child(2) {
        background-color: #ff6b9e;
    }
    
    /* personal.css */
    .personal-div {
        margin: 10px;
    }
    
    .personal-div .personal-head {
        display: flex;
        align-items: center;
    }
    
    .personal-div .personal-head span:first-child {
        display: inline-block;
        width: 80px;
        text-align: center;
    }
    
    .personal-div .personal-head span img {
        width: 100%;
    }
    
    .personal-div .personal-head span:nth-child(2) {
        display: inline-block;
        padding: 3px 10px;
        border: 1px solid #ddd;
        border-radius: 3px;
        margin-left: 20px;
        font-size: 14px;
        cursor: pointer;
    }
    
    .personal-div .personal-text {
        margin-top: 20px;
        font-size: 14px;
    }
    
    .personal-div .personal-text .personal-red {
        color: red;
    }
    
    .personal-div .personal-text .personal-grey {
        color: #666;
        font-size: 12px;
        margin-left: 5px;
    }
    
    .personal-div .personal-input {
        margin-top: 10px;
    }
    
    .personal-div .personal-input input {
        width: 250px;
        height: 30px;
        border: 1px solid #ddd;
        border-radius: 3px;
        text-indent: 10px;
        outline: none;
    }
    
    .personal-div .personal-radio {
        margin-top: 10px;
        font-size: 14px;
    }
    
    .personal-div .personal-radio span {
        margin-right: 10px;
    }
    
    .personal-div .personal-select {
        margin-top: 10px;
    }
    
    .personal-div .personal-select select {
        margin: 0 5px;
        height: 35px;
        padding: 0 5px;
        border-radius: 3px;
        outline: none;
    }
    
    .personal-div .personal-submit {
        margin-top: 30px;
    }
    
    .personal-div .personal-submit span{
        padding: 15px 20px;
        background: #e9aa28;
        border-radius: 7px;
        cursor: pointer;
        color: #fff;
        transition: all .4s;
    }
    
    .personal-submit span:hover{
        background: #cd9424;
        box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.5);
    }

    /* address.css */
    .address-add {
        margin: 15px 15px 0;
    }
    
    .address-add a {
        display: inline-block;
        padding: 5px 15px;
        border-radius: 3px;
        background-color: #f34e14;
        color: #fff;
        font-size: 14px;
    }
    
    .address-div {
        margin: 15px 15px 0;
        border: 1px solid #ddd;
        padding: 10px;
    }

    .address-div-information{
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-bottom: 10px;
        border-bottom: 1px solid #ddd;
    }
    
    .address-div .address-div-one,
    .address-div .address-div-two {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .address-div .address-right p:first-child {
        text-align: right;
    }
    .address-div .address-right p:first-child a {
        color: #4ebeff;
    }
    
    
    .address-div .address-left p:nth-child(2){
        margin-top: 10px;
        font-size: 18px;
        color: #000;
        font-weight: bold;
    }
    
    .address-div .address-right p:nth-child(2) span{
        display: inline-block;
        margin-top: 10px;
        padding: 6px 50px;
        font-size: 14px;
        border-radius: 3px;
        color: #fff;
    }
    
    .address-div .address-right p:nth-child(2) .address-select {
        background-color: #fb0056;
    }
    
    .address-div .address-right p:nth-child(2) .address-grey {
        background-color: #ddd;
    }
    
    .address-div table {
        margin: 15px 15px 0;
        color: #666;
        font-size: 14px;
    }
    
    .address-div table tr td {
        padding: 5px 10px;
    }
    
    .address-div table tr td:first-child {
        text-align: right;
    }
    
    /* address-add.css */
    .address-add-div {
        margin: 15px 15px 0;
        padding: 20px;
        border: 1px solid #ccc;
    }
    
    .address-add-div table {
        color: #666;
        font-size: 14px;
    
    }
    
    .address-add-div table tr td {
        padding: 5px 10px;
    }
    
    .address-add-div table tr td:first-child {
        text-align: right;
    }
    
    .address-add-div table tr td input[type="text"] {
        width: 255px;
        height: 30px;
        border: 1px solid #ccc;
        text-indent: 10px;
        outline: none;
    }
    
    .address-add-div table tr td select {
        width: 255px;
        height: 30px;
        border: 1px solid #ccc;
        outline: none;
    }
    
    .address-add-div table tr td a {
        margin-left: 10px;
        font-size: 12px;
        color: #4ebeff;
        text-decoration: underline;
    }
    
    .address-add-div table tr td button {
        width: 255px;
        height: 30px;
        background-color: #f34e14;
        color: #fff;
        border-radius: 3px;
        border: none;
        cursor: pointer;
    }
    
    /* draw.css */
    .member-draw {
        margin-top: 20px;
        display: flex;
        align-items: center;
    }
    
    .member-draw img {
        width: 440px;
        margin-right: 30px;
    }
    
    .member-draw .member-draw-title {
        font-size: 30px;
        font-weight: bold;
    }
    
    .member-draw .member-draw-opportunity {
        margin-top: 35px;
        font-size: 12px;
    }
    
    .member-draw .member-draw-opportunity span {
        color: #4ebeff;
        text-decoration: underline;
    }
    
    .member-draw .member-draw-go {
        margin-top: 25px;
    }
    
    .member-draw .member-draw-go span {
        display: inline-block;
        padding: 10px 15px;
        background-color: #fb0056;
        color: #fff;
        border-radius: 3px;
        cursor: pointer;
    }
    
    .member-draw .member-draw-how {
        margin-top: 35px;
        font-size: 14px;
        color: #333;
        padding-bottom: 15px;
        border-bottom: 1px solid #ccc;
    }
    
    .member-draw .member-draw-text {
        margin-top: 10px;
        font-size: 14px;
        color: #333;
    }
    
    .draw-record {
        margin-top: 100px;
        border: 1px solid #ddd;
    }
    
    .draw-record .draw-record-head {
        padding: 15px 10px;
        font-size: 14px;
        color: #333;
        background-color: #ddd;
    }
    
    .draw-record .draw-record-cont {
        padding: 15px 10px;
        display: flex;
        font-size: 14px;
        justify-content: space-between;
        color: #444;
        border-bottom: 1px solid #ddd;
    }
    
    .draw-record .draw-record-cont:last-child {
        border: none;
    }
    
    /* integral.css */
    .member-integral-div {
        margin: 10px 15px 0;
        display: flex;
        color: #000;
    }
    
    .integral-div-left {
        width: 340px;
        padding: 20px 0;
        border-radius: 8px;
        color: #fff;
        margin-right: 20px;
        background-image: url("../static/images/integral.png");
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    .integral-div-left .integral-left-laber {
        display: inline-block;
        padding: 5px 20px;
        border-radius: 0 15px 15px 0;
        font-size: 14px;
        background-color: #ff6b9e;
    }
    
    .integral-div-left .integral-left-number {
        text-align: center;
        margin-top: 10px;
        font-size: 60px;
        font-weight: bold;
    }
    
    .integral-div-right {
        width: 740px;
        display: flex;
        flex-wrap: wrap;
        align-content: space-around;
    }
    
    .integral-div-right div {
        width: 31%;
        margin-left: 3.5%;
    }
    
    .integral-div-right div:nth-child(3n+1) {
        margin-left: 0;
    }
    
    .integral-div-right div .integral-number-text {
        display: inline-block;
        width: 100px;
        text-align: right;
    }
    
    .integral-div-right div .integral-number-weight {
        font-size: 25px;
        font-weight: bold;
        
    }
    .integral-div-right div .integral-red{
        color: red;
    }
    
    .integral-header {
        padding: 10px;
        background-color: #f1f1f1;
        margin-top: 40px;
    }
    
    .points-details {
        margin-top: 20px;
    }
    
    .points-details p {
        padding: 10px 0;
        display: flex;
    }
    
    .points-details .points-details-head {
        background-color: #f1f1f1;
        color: #000;
    }
    
    .points-details p span {
        display: inline-block;
        width: 25%;
        text-align: center;
    }
    
    .points-details .points-details-cont {
        color: #333;
        border-bottom: 1px solid #ccc;
        font-size: 14px;
    }
    
    /* coupon.css */
    .coupon-text {
        margin: 20px 15px 0;
        font-size: 14px;
    }
    
    .coupon-div {
        margin: 0 15px ;
        display: flex;
        flex-wrap: wrap;
    }
    
    .coupon-div .coupon-block {
        width: 40%;
        border: 1px solid #faac11;
        border-radius: 3px;
        margin-right: 30px;
        margin-top: 30px;
        overflow: hidden;
    }

    .coupon-div .coupon-gray {
        filter: grayscale(100%);
    }
    
    .coupon-div .coupon-block .coupon-number {
        padding: 20px;
        display: flex;
        align-items: center;
        border-top: 8px solid #faac11;
        border-bottom: 8px solid #faac11;
        position: relative;
    }
    
    .coupon-div .coupon-block .coupon-number::after {
        content: '';
        position: absolute;
        left: 0;
        top: -4px;
        width: 100%;
        height: 8px;
        transform-origin: center left;
        background: radial-gradient(circle, #fff 2px, #fff, transparent 3px, transparent 4px, transparent 4px, transparent);
        background-size: 8px 8px
    
    }
    .coupon-div .coupon-block .coupon-number::before {
        content: '';
        position: absolute;
        left: 0;
        bottom: -4px;
        width: 100%;
        height: 8px;
        transform-origin: center left;
        background: radial-gradient(circle, #fff 2px, #fff, transparent 3px, transparent 4px, transparent 4px, transparent);
        background-size: 8px 8px
    
    }
    .coupon-div .coupon-block .coupon-number .coupon-money{
        font-size: 60px;
        font-weight: bold;
        color: #faac11;
        margin-right: 15px;
    }
    .coupon-div .coupon-block .coupon-number p:first-child{
        font-size: 18px;
        color: #000;
    }
    .coupon-div .coupon-block .coupon-number p:nth-child(2){
        margin-top: 3px;
        font-size: 12px;
        color: #999;
    }
    .coupon-div .coupon-block .coupon-time{
        padding: 5px 10px;
        font-size: 12px;
        color: #faac11;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .coupon-div .coupon-block .coupon-time a{
        display: inline-block;
        padding: 3px 15px;
        background-color: #faac11;
        color: #fff;
        border-radius: 3px;
    }
    
    .coupon-div .coupon-grey {
        width: 40%;
        border: 1px solid #999;
        border-radius: 3px;
        margin-right: 30px;
        margin-top: 30px;
        overflow: hidden;
    }
    
    .coupon-div .coupon-grey .coupon-grey-number {
        padding: 20px;
        display: flex;
        align-items: center;
        border-top: 8px solid #999;
        border-bottom: 8px solid #999;
        position: relative;
    }
    
    .coupon-div .coupon-grey .coupon-grey-number::after {
        content: '';
        position: absolute;
        left: 0;
        top: -4px;
        width: 100%;
        height: 8px;
        transform-origin: center left;
        background: radial-gradient(circle, #fff 2px, #fff, transparent 3px, transparent 4px, transparent 4px, transparent);
        background-size: 8px 8px
    
    }
    .coupon-div .coupon-grey .coupon-grey-number::before {
        content: '';
        position: absolute;
        left: 0;
        bottom: -4px;
        width: 100%;
        height: 8px;
        transform-origin: center left;
        background: radial-gradient(circle, #fff 2px, #fff, transparent 3px, transparent 4px, transparent 4px, transparent);
        background-size: 8px 8px
    
    }
    .coupon-div .coupon-grey .coupon-grey-number .coupon-grey-money{
        font-size: 60px;
        font-weight: bold;
        color: #999;
        margin-right: 15px;
    }
    .coupon-div .coupon-grey .coupon-grey-number p:first-child{
        font-size: 18px;
        color: #000;
    }
    .coupon-div .coupon-grey .coupon-grey-number p:nth-child(2){
        margin-top: 3px;
        font-size: 12px;
        color: #999;
    }
    .coupon-div .coupon-grey .coupon-grey-time{
        padding: 5px 10px;
        font-size: 12px;
        color: #999;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .coupon-div .coupon-grey .coupon-grey-time a{
        display: inline-block;
        padding: 3px 15px;
        background-color: #999;
        color: #fff;
        border-radius: 3px;
    }
    
    /* collection.css */
    .collection{
        margin: 0 15px;
        display: flex;
        flex-wrap: wrap;
    }
    .collection .collection-div{
        width: 31%;
        box-sizing: border-box;
        margin-left: 3.5%;
        margin-top: 20px;
        border: 1px solid #ccc;
    }
    .collection .collection-div:nth-child(3n+1){
        margin-left: 0;
    }
    .collection .collection-div .collection-img{
        width: 100%;
        position: relative;
        overflow: hidden;
    }
    .collection .collection-div .collection-img img{
        width: 100%;
        max-height: 510px;
    }
    .collection .collection-div .collection-img .collection-img-add{
        width: 100%;
        position: absolute;
        left: 0;
        bottom: -100%;
        display: flex;
        transition: all 500ms;
    }
    .collection .collection-div .collection-img .collection-img-add span{
        display: block;
        padding: 10px 0;
        flex-grow: 1;
        color: #fff;
        text-align: center;
        cursor: pointer;
    }
    .collection .collection-div .collection-img .collection-img-add span:first-child{
        background-color: #faac11;
    }
    .collection .collection-div .collection-img .collection-img-add span:nth-child(2){
        background-color: #fb0056;
    }
    .collection .collection-div .collection-two{
        margin: 15px 10px;
        height: 42px;
        text-align: center;
        color: #666;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    
    }
    .collection .collection-div .collection-two a{
        color: #666;
    }
    .collection .collection-div .collection-money{
        margin-top: 10px;
        text-align-last: center;
        font-size: 18px;
        color: #000;
    }
    .collection .collection-div .collection-money span{
        font-size: 13px;
        color: #999;
        text-decoration: line-through;
    }
    .collection .collection-div .collection-explain{
        margin-top: 10px;
        font-size: 13px;
        text-align: center;
    }
    .collection .collection-div .explain-red{
        color: #fb0056;
    }
    .collection .collection-div .explain-grey{
        color: #999;
    }
    
    /* history.css */
    .history{
        margin: 15px 15px 0;
        display: flex;
        align-items: flex-start;
    }
    .history .history-left{
        width: 100px;
        background-color: #f1f1f1;
    }
    .history .history-left .history-ul li p{
        padding: 5px 10px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 14px;
        color: #333;
    }
    .history .history-left .history-ul li p span{
        border: 5px solid transparent;
        border-left: 5px solid #fb0056;
        transition: all 500ms;
        transform-origin: 2.5px;
    
    }
    .history .history-left .history-ul li ul{
        display: none;
    }
    .history .history-left .history-ul li ul li a{
        display: block;
        padding: 5px 10px;
        text-align: right;
        font-size: 14px;
        color: #666;
    }
    .history .history-left .history-ul li ul li .history-select{
        background-color: #fb0056;
        color: #fff;
    }
    .history .history-right{
        width: 970px;
        margin-left: 30px;
    }
    .history .history-right .history-right-title{
        color: #fb0056;
        padding: 5px 0;
        border-bottom: 1px solid #ccc;
    }
    .history .history-right .history-right-cont{
        margin-top: 10px;
        font-size: 14px;
        color: #000;
    }
    .history .history-right .history-right-cont a{
        margin-left: 40px;
    }
    
    /* comment.css */
    .member-comment-head{
        margin: 10px 15px 0;
        
    }
    .member-comment-head a{
        display: inline-block;
        padding: 5px 30px;
        border: 1px solid #f1f1f1;
        font-size: 14px;
        background-color: #f1f1f1;
    }
    .member-comment-head .comment-select{
        background-color: #fff;
    }
    .member-comment{
        margin: 15px 15px 0;
        border: 1px solid #f1f1f1;
    }
    .member-comment .member-comment-one{
        background-color: #f1f1f1;
        font-size: 14px;
        padding: 5px 10px;
    }
    .member-comment-div{
        display: flex;
    }
    .member-comment-div div{
        height: 120px;
        padding: 5px 10px;
        text-align: center;
        border-right: 1px solid #f1f1f1;
        display: flex;
        justify-content: center;
        align-items: center;
        align-content: center;
        flex-wrap: wrap;
        flex-grow: 1;
    }
    .member-comment-div div:first-child{
        width: 90px;
        flex-grow: 0;
    }
    .member-comment-div div:nth-child(2){
        max-width: 366px;
        flex-grow: 2;
        justify-content: flex-start;
    }
    .member-comment-div div:nth-child(5){
        max-width: 366px;
        flex-grow: 2;
        font-size: 14px;
    }
    .member-comment-div div p{
        width: 100%;
    }
    .member-comment-div div:nth-child(5) p a{
        display: inline-block;
        width: 60%;
        padding: 3px 0;
        border-radius: 3px;
        color: #4ebeff;
    }
    .member-comment-div div:nth-child(5) p:nth-child(2) a{
        background-color: #fb0056;
        color: #fff;
        margin-top: 5px;
    }
    
    /* comment-yes.css */
    .mod-yes{
        display: none;
    }
    .comment-confirm{
        display: flex;
    
    }
    .comment-confirm>div{
        padding: 10px;
        border-right: 1px solid #f1f1f1;
    }
    .comment-confirm>div img{
        width: 90px;
        height: 120px;
    }
    .comment-confirm>div:first-child{
        width: 90px;
    }
    .comment-confirm>div:nth-child(2){
        width: 300px;
    }
    .comment-confirm>div:nth-child(3){
        width: 350px;
    }
    .comment-confirm>div:nth-child(4){
        flex-grow: 1;
        font-size: 14px;
        text-align: center;
    }
    .comment-confirm>div:nth-child(2) p:nth-child(2) a{
        display: inline-block;
        margin-top: 15px;
        font-size: 14px;
        color: #4ebeff;
    }
    .comment-confirm>div:nth-child(3) .comment-three-star{
        margin-top: 10px;
    }
    .comment-confirm>div:nth-child(3) .comment-three-img{
        margin-top: 10px;
    }
    .comment-confirm>div:nth-child(3) .comment-three-img img{
        margin-right: 5px;
    }
    .comment-confirm>div:nth-child(4) .comment-four-a a{
        display: inline-block;
        width: 85%;
        padding: 5px 0;
        margin-top: 10px;
        border-radius: 3px;
        color: #fff;
        background-color: #fb0056;
    }
    .comment-confirm>div:nth-child(4) p:nth-child(2),
    .comment-confirm>div:nth-child(4) p:nth-child(3){
        margin-top: 10px;
    }
    .comment-confirm>div:nth-child(4) p:nth-child(3) img{
        width: 20px;
        height: 20px;
    }
    
    /* exchange.css */
    .exchange-div{
        margin: 15px 15px 0;
    }
    .exchange-one{
        display: flex;
    }
    .exchange-number{
        margin-right: 40px;
    }
    .exchange-number .exchange-number-text{
        font-size: 14px;
        line-height: 26px;
    }
    .exchange-number .exchange-number-text2{
        font-size: 14px;
        line-height: 26px;
        margin-top: 20px;
    }
    .exchange-number .exchange-number-cont{
        font-size: 35px;
        font-weight: bold;
    }
    .exchange-number .exchange-number-cont a{
        font-size: 14px;
        color: #4ebeff;
        text-decoration: underline;
    }
    .exchange-rule{
        font-size: 14px;
    }
    .exchange-rule ul{
        margin-top: 20px;
        line-height: 32px;
        color: #666;
    }
    .exchange-money{
        margin-top: 60px;
    }
    .exchange-money input{
        width: 250px;
        height: 30px;
        margin-left: 10px;
        text-indent: 10px;
        border: 1px solid #ccc;
        border-radius: 3px;
        outline: none;
    }
    .exchange-paypel{
        margin-top: 30px;
    }
    .exchange-paypel img{
        width: 30px;
        margin: 0 10px;
    }
    .exchange-paypel .exchange-paypel-one{
        border-bottom: 1px solid #ccc;
        padding-bottom: 10px;
    }
    .exchange-paypel .exchange-paypel-one div{
        padding: 10px;
        padding-left: 20px;
        color: #333;
    }
    .exchange-paypel .exchange-paypel-one div input{
        width: 320px;
        height: 30px;
        border: 1px solid #ccc;
        border-radius: 3px;
        text-indent: 10px;
        margin-left: 15px;
        outline: none;
    }
    .exchange-paypel .exchange-paypel-two{
        padding: 10px 0;
    }
    .exchange-paypel .exchange-paypel-two form{
        padding-left: 20px;
        display: none;
    }
    .exchange-paypel .exchange-paypel-two form div{
        margin-top: 10px;
    }
    .exchange-paypel .exchange-paypel-two form div span{
        display: inline-block;
        width: 100px;
    }
    .exchange-paypel .exchange-paypel-two form div input{
        width: 320px;
        height: 30px;
        border: 1px solid #ccc;
        border-radius: 3px;
        text-indent: 10px;
        margin-left: 15px;
        outline: none;
    }
    .exchange-apply{
        margin-top: 30px;
    }
    .exchange-apply span{
        display: inline-block;
        padding: 5px 20px;
        font-size: 14px;
        color: #fff;
        background-color: #e9aa28;
        border-radius: 3px;
    }
    
    /* modify.css */
    .change-password{
        text-align: center;
        line-height: 30px;
        font-size: 14px;
    }
    .change-password .change-text{
        margin: 30px 0;
    }
    .change-password p{
        margin-top: 10px;
    }
    .change-password p input{
        width: 300px;
        height: 30px;
        border: 1px solid #ccc;
        border-radius: 3px;
        text-indent: 10px;
        margin-left: 15px;
        outline: none;
    }
    .change-password p span{
        display: inline-block;
        width: 200px;
        padding: 5px 0;
        text-align: right;
    }
    .change-password .change-submit span{
        width: 300px;
        margin-left: 210px;
        text-align: center;
        border-radius: 3px;
        background-color: #fb0056;
        color: #fff;
        cursor: pointer;
    }
    
    /* consulting.css*/
    .mod-comment{
        display: none;
    }

    .consulting-div{
        margin-top: 40px;
        display: flex;
    }
    .consulting-div .consulting-left{
        width: 830px;
        box-sizing: border-box;
        padding: 0 30px;
        border-right: 1px solid #ccc
    }
    .consulting-question{
        text-align: center;
    }
    .consulting-question p{
        margin-top: 10px;
    }
    .consulting-question p:first-child{
        margin-top: 0;
    }
    .consulting-question p select,
    .consulting-question p input{
        width: 400px;
        height: 30px;
        border: 1px solid #ccc;
        border-radius: 3px;
        text-indent: 10px;
        outline: none;
    }
    .consulting-question p textarea{
        width: 400px;
        height: 100px;
        box-sizing: border-box;
        border: 1px solid #ccc;
        border-radius: 3px;
        padding: 10px;
        outline: none;
        resize: none;
    }
    .consulting-question p span{
        display: inline-block;
        width: 150px;
        padding: 5px 0;
        text-align: center;
        background-color: #e9aa28;
        border-radius: 3px;
        color: #fff;
    }
    .answer-div{
        width: 100%;
        min-height: 350px;
        max-height: 600px;
        margin-top: 30px;
        border-top: 1px solid #ccc;
        padding-top: 20px;
        overflow-x: hidden;
    }
    .consulting-answer{
        width: 100%;
        padding-right: 50px;
        /* height: 300px; */
        min-height: 350px;
        max-height: 600px;
        overflow: auto;
    }
    .customer-service{
        display: flex;
        align-items: flex-start;
    }
    .customer-service img,
    .consulting-user img{
        width: 60px;
    }
    .customer-service div{
        width: 80%;
        font-size: 14px;
        margin-left: 10px;
    }
    .consulting-user div{
        width: 80%;
        font-size: 14px;
        margin-right: 10px;
        text-align: right;
    }
    .customer-service div p:first-child,
    .consulting-user div p:first-child{
        padding: 5px 10px;
        color: #666;
    }
    .customer-service div p:first-child span{
        margin-left: 10px;
    }
    .consulting-user div p:first-child span{
        margin-right: 10px;
    }
    .customer-service div .msg,
    .consulting-user div .msg{
        display: inline-block;
        padding: 8px 20px 8px 10px;
        background-color: #f1f1f1;
        color: #333;
        border-radius: 3px;
    }
    .consulting-user{
        display: flex;
        align-items: flex-start;
        justify-content: flex-end;
        margin-top: 30px;
    }
    .consulting-submit{
        height: 60px;
        padding: 0 10px;
        display: flex;
        align-items: center;
        margin-top: 40px;
        border: 1px solid #ccc;
        border-radius: 30px;
        background-color: #f1f1f1;
        position: relative;
    }
    .consulting-submit .submit-ques{
        display: inline-block;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 27px;
        border: 2px solid #ccc;
        color: #666;
        font-size: 30px;
        border-radius: 50%;
        cursor: pointer;
    }
    .consulting-submit input{
        width: 600px;
        height: 50px;
        text-indent: 10px;
        background-color: #f1f1f1;
        border: none;
        outline: none;
    }
    .consulting-submit .submit-post{
        display: inline-block;
        width: 100px;
        height: 30px;
        border-radius: 15px;
        line-height: 30px;
        font-size: 14px;
        color: #fff;
        background-color: #ddd;
        text-align: center;
        cursor: pointer;
    }
    .ques-div{
        width: 30%;
        box-sizing: border-box;
        position: absolute;
        left: 20px;
        top: 0;
        transform: translate(0,-110%);
        border: 1px solid #ccc;
        display: none;
    }
    .ques-div p{
        padding: 5px 10px;
        cursor: pointer;
    }
    .consulting-right{
        width: 300px;
    }
    .consulting-right-head{
        padding: 15px 0;
        background-color: #fb0056;
        color: #fff;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
    }
    .consulting-right ul li{
        padding: 10px 20px;
        border-bottom: 1px solid #f1f1f1;
        cursor: pointer;
    }
    
    /* order-info.css */
    .order-text{
        margin-top: 10px;
    }
    .order-table{
        width: 100%;
        margin-top: 10px;
        border-top: 1px solid #ddd;
        border-left: 1px solid #ddd
    }
    .order-table tr td{
        box-sizing: border-box;
        padding: 10px;
        border-right: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
    }
    .order-table tr td:first-child{
        width: 20%;
        text-align: right;
    }
    
    /* write-comment.css */
    .mod-write-more{
        display: none;
    }
    .write-detail{
        margin-top: 20px;
        display: flex;
        align-items: flex-start;
    }
    .write-detail .write-left{
        width: 300px;
        margin-right: 30px;
    }
    .write-detail .write-left img{
        width: 100%;
    }
    .write-detail .write-right{
        width: 1000px;
    }
    .write-detail .write-right .write-title{
        font-size: 30px;
        font-weight: bold;
        line-height: 50px;
        margin-bottom: 10px;
    }
    .write-detail .write-right .comment-money{
        margin-top: 10px;
        font-size: 28px;
        font-weight: bold;
    }
    .write-detail .write-right .comment-money span{
        font-size: 16px;
        font-weight: normal;
        color: #666;
        text-decoration: line-through;
    }
    .write-detail .write-right .write-more{
        width: 90%;
        margin-top: 20px;
        padding: 10px 0;
        line-height: 26px;
        border: 1px solid #f1f1f1;
        font-size: 14px;
        text-align: center;
        color: #333;
    }
    .write-detail .write-right .write-more a{
        color: #4ebeff;
    }
    .write-tab{
        margin-top: 20px;
        border-bottom: 1px solid #ff5050;
    }
    .write-tab span{
        display: inline-block;
        padding: 5px 10px;
        border-radius: 3px 3px 0 0;
        background-color: #ff5050;
        color: #fff;
        cursor: pointer;
        margin-right: 10px;
    }
    .write-form{
        margin: 20px 15px 0;
    }
    .write-form .form-write{
        font-size: 18px;
    }
    .write-form .form-write span{
        margin-left: 10px;
        font-size: 15px;
    }
    .write-form .write-text{
        margin: 10px 0;
    }

    .write-form .write-text label{
        font-size: 18px;
        font-weight: 600px;
    }

    .form-class {
        width: 100%;
        border-radius: 5px;
        padding: 8px 14px;
        font-size: 14px;
        border-radius: 5px;
        border: 1px solid #ddd;
        resize: none;
        outline: none;
        box-sizing: border-box;
        transition: all ease-in-out .5s;
    }

    .form-class:active,.form-class:focus{
        border: 1px solid #ff6b9e;
        box-shadow: 0 0 10px 1px rgba(255, 107, 159, 0.3);
    }

    .write-form .write-add{
        padding: 25px 0;
        border-bottom: 1px dashed #ccc;
        display: flex;
        align-items: center;
    }
    .write-form .write-add .write-span{
        display: inline-block;
        width: 50px;
        height: 50px;
        margin-right: 15px;
        line-height: 50px;
        background-color: #ddd;
        border-radius: 3px;
        text-align: center;
    }
    .write-form .write-add .write-span>input{
        display: inline-block;
        width: 30px;
        height: 30px;
        margin-top: 10px;
        border-radius: 50%;
        line-height: 20px;
        border: 2px solid #fff;
        background-color: #ddd;
        color: #fff;
        font-size: 45px;
    }
    .write-form .write-star{
        margin-top: 20px;
    }
    .write-form .write-star span{
        cursor: pointer;
    }
    .write-form  .form-text{
        margin-top: 10px;
        font-size: 14px;
        color: #999;
    }
    .write-form .write-submit{
        margin-top: 25px;
    }

    .write-form .write-submit span{
        cursor: pointer;
        display: inline-block;
        padding: 5px 25px;
        background-color: #e9aa28;
        color: #fff;
        border-radius: 3px;
        font-weight: bold;
    }

    .bw-toast {
        box-sizing: border-box;
        position: fixed;
        left: 50%;
        bottom: 0;
        max-width: 400px;
        border-radius: 5px;
        color: #fff;
        font-size: 16px;
        line-height: 1;
        padding: 10px 10px;
        background-color: rgba(0, 0, 0, 0.5);
        transition: all .3s;
    }
    
    .upload-container {
        border: 1px dashed #888;
        padding: 20px;
        margin-top: 20px;
        width: 100%;
        max-height: 600px;
        overflow-y: auto;
        display: inline-block;
        box-sizing: border-box;
    }
    
    .upload-container p {
        margin-bottom: 20px;
    }
    
    .upload-container .upload-label {
        padding: 7px 15px;
        color: #3887dc;
        font-size: 12px;
        cursor: pointer;
        border: 1px solid #0075ff;
    }
    
    #file_list_info_show {
        padding-bottom: 20px;
        display: flex;
        flex-wrap: wrap;
    }
    
    #file_list_info_show p {
        display: inline-block;
        padding: 5px;
        margin-bottom: 10px;
        justify-content: space-between;
        position: relative;
        color: #000;
        background-color: #f2f2f2;
        margin-right: 10px;
    }
    #file_list_info_show p .write-append{
        display: block;
        width: 100px;
        height: 150px;
    }
    #file_list_info_show p .write-append img{
        width: 100%;
        height: 100%;
    }
    #file_list_info_show p .line {
        top: 0;
        left: 0;
        height: 1px;
        position: absolute;
        background: #0075ff;
        transition: all .3s;
    }
    
    #file_list_info_show p span {
        font-size: 12px;
        cursor: pointer;
        color: #0075ff;
    }
}


@media screen and (max-width:750px) {

    .member-left,
    .member-log{
        display: none;
    }

    .color-red {
        color: #f34e14;
    }
    
    .color-grey {
        color: #999;
        font-size: 13px;
    }

    .member-right{
        margin: 10px 10px 0;
    }

    .member-header {
        padding: 10px 10px;
        font-size: 14px;
        line-height: 26px;
        background-color: #f1f1f1;
    }


    /* member.css */
    .member-user{
        display: flex;
        align-items: center;
    }
    .member-user>div:first-child{
        width: 80px;
        margin-right: 10px;
    }
    .member-user>div:first-child img{
        width: 100%;
    }
    .member-user div:nth-child(2){
        width: calc(100% - 90px);
    }
    .member-user div:nth-child(2) div:first-child{
        font-weight: bold;
    }
    .member-user div:nth-child(2) div:first-child div{
        display: inline-block;
        width: 130px;
        height: 25px;
        line-height: 25px;
        border-radius: 15px;
        font-size: 12px;
        color: #ff5050;
        background-color: #f1f2f3;
        margin-left: 15px;
    }
    .member-user div:nth-child(2) div:first-child div span{
        display: inline-block;
        width: 25px;
        margin-right: 10px;
    }
    .member-user div:nth-child(2) div:first-child div span img{
        width: 100%;
    }
    .member-user div:nth-child(2) p:nth-child(2){
        margin-top: 10px;
        color: #4ebeff;
    }

    .member-integral {
        margin-top: 20px;
        display: flex;
        justify-content: space-between;
    }
    
    .member-integral>div {
        width: 47%;
        padding: 10px 0;
        border-radius: 8px;
        overflow: hidden;
        color: #fff;
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    .member-integral .member-level {
        background-image: url("../static/images/vip-6.png");
        display: none;
    }
    
    .member-integral .member-number {
        background-image: url("../static/images/integral.png");
    }
    
    .member-integral .member-coupon {
        background-image: url("../static/images/coupon.png");
    }
    
    .member-integral div .member-laber span {
        display: inline-block;
        padding: 5px 20px;
        border-radius: 0 15px 15px 0;
        font-size: 12px;
    }
    
    
    .member-integral .member-number .member-laber span {
        background-color: #ff6b9e;
    }
    
    .member-integral .member-coupon .member-laber span {
        background-color: #62a7f5;
    }
    
    
    .member-integral .integral-number {
        text-align: center;
        margin-top: 5px;
        font-size: 14px;
        font-weight: bold;
    }
    
    .member-integral .integral-underline {
        text-align: center;
        text-decoration: underline;
    }

    .member-extension {
        width: 100%;
        margin-top: 15px;
    }
    
    .member-extension p {
        width: 100%;
    }
    
    .member-extension p img {
        width: 100%;
    }
    
    .member-extension p:nth-child(2) {
        padding: 4px 10px;
        font-size: 12px;
        border: 1px solid #ccc;
        border-top: none;
        box-sizing: border-box;
    }
    
    .member-extension p:nth-child(2) .extension-href {
        display: block;
        margin-bottom: 5px;
    }
    
    .member-extension p:nth-child(2) .extension-href span {
        color: #4ebeff;
        margin-left: 5px;
    }
    
    .member-extension p:nth-child(2) span button {
        padding: 5px 10px;
        border-radius: 3px;
        border: none;
        font-size: 12px;
        background-color: #4ebeff;
        color: #fff;
        margin-right: 5px;
        cursor: pointer;
    }
    
    .member-extension p:nth-child(2) #clone-put {
        position: absolute;
        top: -100%;
        left: 0;
        opacity: 0;
        z-index: -10;
    }
    
    .rule {
        position: fixed;
        left: 50%;
        top: 50%;
        background-color: #fff;
        width: 90%;
        max-width: 450px;
        transform: translate(-50%, -50%);
        box-shadow: 3px 3px 13px 3px #999;
        display: none;
    }
    
    .rule div:first-child {
        display: flex;
        justify-content: space-between;
        padding: 10px;
        border-bottom: 1px solid #ccc;
    }
    
    .rule div:nth-child(2) {
        padding: 15px;
        line-height: 25px;
    }

    .member-order {
        margin-top: 15px;
        border-radius: 3px;
        background-color: #f1f1f1;
    
        font-size: 14px;
        overflow: hidden;
    }
    
    .member-order .order-head {
        padding: 15px;
        background-color: #000;
        color: #fff;
    }
    
    .member-order .order-cont {
        padding: 5px 15px 15px;
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        text-align: center;
        line-height: 26px;
    }

    .member-order .order-cont a{
        width: 25%;
        margin-top: 20px;
    }
    
    .member-order .order-cont p:nth-child(2) {
        margin-top: 5px;
    }

    .member-order .order-cont p img{
        width: 48px;
    }

    
    /* order.css */
    .order-div{
        display: none;
    }

    .order-header{
        height: 28px;
        margin: 10px 0px 0;
        overflow: hidden;
    }
    .order-header-div{
        padding-bottom: 10px;
        overflow: hidden;
        overflow: auto;
    }
    .all-order .all-span{
        width: 750px;
        display: flex;
        border-bottom: 1px solid #ccc;
    }
    .all-order .all-span a {
        display: inline-block;
        flex-grow: 1;
        padding: 3px 0;
        text-align: center;
        cursor: pointer;
    }
    
    .all-order .all-span .all-select {
        color: #ff5050;
        border-bottom: 2px solid #ff5050;
    }

    .mod-order{
        margin-top: 20px;
        border: 1px solid #ccc;
        border-radius: 3px;
        overflow: hidden;
    }
    .mod-order-header{
        padding: 5px 10px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 12px;
        background-color: #f1f2f3;
    }
    .mod-order-header img{
        width: 20px;
    }
    .mod-order-name{
        padding: 10px 10px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 12px;
    }
    .mod-order-name span:first-child{
        color: #ff5050;
        font-size: 15px;
    }
    .mod-order-name span:first-child img{
        width: 18px;
        margin-top: -3px;
    }
    .mod-order-name span:nth-child(2){
        color: #666;
    }
    .mod-order-div{
        padding: 10px;
        border-top: 1px solid #ccc;
        display: flex;
        justify-content: space-between;
    }
    .mod-order-div div{
        position: relative;
    }
    .mod-order-div div:first-child,
    .mod-order-div div:last-child{
        width: 20%;
        line-height: 22px;
        color: #4ebeff;
        text-align: right;
    }
    .mod-order-div div:first-child{
        align-self: flex-start;
    }
    .mod-order-div div:first-child img{
        width: 100%;
    }
    .mod-order-div div:last-child a{
        color: #4ebeff;
        
    }
    .mod-order-div div:nth-child(2){
        width: 50%;
    }
    .mod-order-div div:nth-child(2) p{
        font-size: 12px;
        color: #666;
        line-height: 18px;
    }
    .mod-order-div div:nth-child(2) .mod-order-title{
        font-size: 16px;
        color: #4ebeff;
        margin-bottom: 5px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }
    .mod-order-div div:nth-child(2) .mod-order-number{
        color: red;
        margin-top: 5px;
        font-size: 14px;
    }
    .mod-order .mod-order-money{
        display: flex;
        justify-content: flex-end;
        align-items: center;
        border-top: 1px solid #ccc;
    }
    .mod-order .mod-order-money span{
        font-size: 20px;
    }
    .mod-order .mod-order-money .order-button{
        display: inline-block;
        padding: 10px 25px;
        background-color: #ff5050;
        margin-left: 10px;
        color: #fff;
        font-size: 14px;
    }

    /* car.css */
    .car-div,
    .car-subtotal{
        display: none;
    }

    .mod-car-div{
        margin-top: 15px;
        border: 1px solid #ccc;
        border-radius: 3px;
    }
    .mod-car-div .mod-car-first{
        padding: 10px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .mod-car-div .mod-car-first div .plus_val,
    .mod-car-div .mod-car-first div .reduce_val{
        display: inline-block;
        width: 25px;
        height: 25px;
        text-align: center;
        font-size: 25px;
        line-height: 22px;
        color: #666;
        border: 1px solid #ccc;
        vertical-align: middle;
    }
    .mod-car-div .mod-car-first div input{
        width: 60px;
        height: 26px;
        text-align: center;
        margin: 0 5px;
        border: 1px solid #ccc;
        outline: none;
    }
    .mod-car-div .mod-car-first div  .mod-car-num{
        font-size: 16px;
        margin-left: 15px;
    }
    
    /* personal.css */
    .personal-div {
        margin: 10px;
    }
    
    .personal-div .personal-head {
        display: flex;
        align-items: center;
    }
    
    .personal-div .personal-head span:first-child {
        display: inline-block;
        width: 80px;
        text-align: center;
    }
    
    .personal-div .personal-head span img {
        width: 100%;
    }
    
    .personal-div .personal-head span:nth-child(2) {
        display: inline-block;
        padding: 3px 10px;
        border: 1px solid #ddd;
        border-radius: 3px;
        margin-left: 20px;
        font-size: 14px;
        cursor: pointer;
    }
    
    .personal-div .personal-text {
        margin-top: 20px;
        font-size: 14px;
    }
    
    .personal-div .personal-text .personal-red {
        color: red;
    }
    
    .personal-div .personal-text .personal-grey {
        color: #666;
        font-size: 12px;
        margin-left: 5px;
    }
    
    .personal-div .personal-input {
        margin-top: 10px;
    }
    
    .personal-div .personal-input input {
        width: 250px;
        height: 30px;
        border: 1px solid #ddd;
        border-radius: 3px;
        text-indent: 10px;
        outline: none;
    }
    
    .personal-div .personal-radio {
        margin-top: 10px;
        font-size: 14px;
    }
    
    .personal-div .personal-radio span {
        margin-right: 10px;
    }
    
    
    .personal-div .personal-select select {
        margin: 0 5px;
        height: 28px;
        margin-top: 10px;
        padding: 0 5px;
        border-radius: 3px;
        outline: none;
    }
    
    .personal-div .personal-submit {
        margin-top: 30px;
    }
    
    .personal-div .personal-submit .submit-btn {
        padding: 10px 40px;
        background-color: #e9aa28;
        color: #fff;
        border: none;
        outline: none;
        border-radius: 3px;
    }

    /* address.css */
    .member-right-address{
        position: relative;
        padding-bottom: 120px;
    }
    .address-add {
        width: 100%;
        position: absolute;
        left: 0;
        text-align: center;
        bottom: 60px;
    }
    
    .address-add a {
        display: inline-block;
        padding: 5px 15px;
        border-radius: 3px;
        background-color: #f34e14;
        color: #fff;
        font-size: 14px;
        
    }
    
    .address-div {
        margin: 15px 15px 0;
        border: 1px solid #ddd;
    }

    .address-div-information{
        border-bottom: 1px solid #ddd;
    }
    .address-div .address-left{
        padding: 5px 10px;
        border-bottom: 1px solid #ddd;
    }
    .address-div .address-right{
        padding: 5px 10px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .address-div .address-left p:nth-child(2){
        margin-top: 5px;
        color: #000;
        font-weight: bold;
    }
    

    .address-div .address-right p:first-child {
        text-align: right;
    }
    .address-div .address-right p:first-child a {
        color: #4ebeff;
    }
    
    
    .address-div .address-right p:nth-child(2) span{
        display: inline-block;
        padding: 6px 20px;
        font-size: 12px;
        border-radius: 16px;
        color: #fff;
    }
    
    .address-div .address-right p:nth-child(2) .address-select {
        background-color: #fb0056;
    }
    
    .address-div .address-right p:nth-child(2) .address-grey {
        background-color: #ddd;
    }
    
    .address-div table {
        margin: 15px 15px 0;
        color: #666;
        font-size: 14px;
    }
    
    .address-div table tr td {
        padding: 5px 10px;
    }
    
    .address-div table tr td:first-child {
        text-align: right;
    }
    
    /* address-add.css */
    .address-add-div {
        margin-top: 10px;
        border: 1px solid #ccc;
    }
    
    .address-add-div table {
        padding: 10px 0;
        color: #666;
        font-size: 14px;
    }
    
    .address-add-div table tr td {
        padding: 5px 10px;
    }
    
    .address-add-div table tr td:first-child {
        text-align: right;
    }
    
    .address-add-div table tr td input[type="text"] {
        width: 100%;
        height: 30px;
        border: 1px solid #ccc;
        text-indent: 10px;
        outline: none;
    }
    
    .address-add-div table tr td select {
        width: 100%;
        height: 30px;
        border: 1px solid #ccc;
        outline: none;
    }
    
    .address-add-div table tr td a {
        margin-left: 10px;
        font-size: 12px;
        color: #4ebeff;
        text-decoration: underline;
    }
    
    .address-add-div table tr td button {
        width: 100%;
        height: 30px;
        background-color: #f34e14;
        color: #fff;
        border-radius: 3px;
        border: none;
        cursor: pointer;
    }

    /* draw.css */
    .member-draw {
        margin-top: 20px;
    }
    
    .member-draw img {
        width: 100%;
    }
    
    .member-draw .member-draw-title {
        margin-top: 20px;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
    }
    
    .member-draw .member-draw-opportunity {
        text-align: center;
        margin-top: 15px;
        font-size: 12px;
    }
    
    .member-draw .member-draw-opportunity span {
        color: #4ebeff;
        text-decoration: underline;
    }
    
    .member-draw .member-draw-go {
        margin-top: 15px;
        text-align: center;
    }
    
    .member-draw .member-draw-go span {
        display: inline-block;
        padding: 10px 15px;
        background-color: #fb0056;
        color: #fff;
        border-radius: 3px;
        cursor: pointer;
    }
    
    .member-draw .member-draw-how {
        margin-top: 35px;
        font-size: 14px;
        color: #333;
        padding-bottom: 15px;
        border-bottom: 1px solid #ccc;
    }
    
    .member-draw .member-draw-text {
        margin-top: 10px;
        font-size: 14px;
        color: #333;
    }
    
    .draw-record {
        margin-top: 30px;
        border: 1px solid #ddd;
    }
    
    .draw-record .draw-record-head {
        padding: 15px 10px;
        font-size: 14px;
        color: #333;
        background-color: #ddd;
    }
    
    .draw-record .draw-record-cont {
        padding: 15px 10px;
        display: flex;
        font-size: 14px;
        justify-content: space-between;
        color: #444;
        border-bottom: 1px solid #ddd;
    }
    
    .draw-record .draw-record-cont:last-child {
        border: none;
    }

    /* integral.css */
    .member-integral-div {
        margin-top: 15px;
        color: #000;
    }
    
    .integral-div-left {
        width: 100%;
        padding: 20px 0;
        border-radius: 8px;
        color: #fff;
        margin-right: 20px;
        background-image: url("../static/images/integral.png");
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    .integral-div-left .integral-left-laber {
        display: inline-block;
        padding: 5px 20px;
        border-radius: 0 15px 15px 0;
        font-size: 14px;
        background-color: #ff6b9e;
    }
    
    .integral-div-left .integral-left-number {
        text-align: center;
        margin-top: 10px;
        font-size: 60px;
        font-weight: bold;
    }
    
    .integral-div-right {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        align-content: space-around;
    }
    
    .integral-div-right div {
        width: 31%;
        margin-left: 3.5%;
    }
    
    .integral-div-right div:nth-child(3n+1) {
        margin-left: 0;
    }
    
    .integral-div-right div .integral-number-text {
        display: block;
        margin-top: 15px;
    }
    
    .integral-div-right div .integral-number-weight {
        margin-top: 5px;
        font-size: 25px;
        font-weight: bold;
    }
    .integral-div-right div .integral-red{
        color: red;
    }
    
    .integral-header {
        padding: 10px;
        background-color: #f1f1f1;
        margin-top: 40px;
    }
    
    .points-details {
        margin-top: 20px;
    }
    
    .points-details p {
        padding: 10px 0;
        display: flex;
        align-items: center;
    }
    
    .points-details .points-details-head {
        background-color: #f1f1f1;
        color: #000;
    }
    
    .points-details p span {
        display: inline-block;
        width: 25%;
        text-align: center;
    }
    
    .points-details .points-details-cont {
        color: #333;
        border-bottom: 1px solid #ccc;
        font-size: 14px;
    }

    /* collection.css */
    .collection{
        display: flex;
        flex-wrap: wrap;
    }
    .collection .collection-div{
        width: 48.5%;
        box-sizing: border-box;
        margin-left: 3%;
        margin-top: 10px;
        border: 1px solid #ccc;
    }
    .collection .collection-div:nth-child(2n+1){
        margin-left: 0;
    }
    .collection .collection-div .collection-img{
        width: 100%;
        position: relative;
        overflow: hidden;
    }
    .collection .collection-div .collection-img img{
        width: 100%;
        max-height: 510px;
    }
    .collection .collection-div .collection-img .collection-img-add{
        width: 100%;
        position: absolute;
        left: 0;
        bottom: 0;
        display: flex;
        text-transform: lowercase;
        transition: all 500ms;
    }
    .collection .collection-div .collection-img .collection-img-add span{
        display: block;
        padding: 10px 0;
        flex-grow: 1;
        color: #fff;
        text-align: center;
        cursor: pointer;
    }
    .collection .collection-div .collection-img .collection-img-add span:first-child{
        background-color: #faac11;
    }
    .collection .collection-div .collection-img .collection-img-add span:nth-child(2){
        background-color: #fb0056;
    }
    .collection .collection-div .collection-two{
        margin: 15px 10px;
        text-align: center;
        color: #666;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    
    }
    .collection .collection-div .collection-two a{
        color: #666;
    }
    .collection .collection-div .collection-money{
        margin-top: 10px;
        text-align-last: center;
        font-size: 18px;
        color: #000;
    }
    .collection .collection-div .collection-money span{
        font-size: 13px;
        color: #999;
        text-decoration: line-through;
    }
    .collection .collection-div .collection-explain{
        margin-top: 10px;
        font-size: 13px;
        text-align: center;
    }
    .collection .collection-div .explain-red{
        color: #fb0056;
    }
    .collection .collection-div .explain-grey{
        color: #999;
    }

    /* comment.css */
    .member-comment{
        display: none;
    }

    .member-comment-head{
        margin-top: 10px;
        border-bottom: 1px solid #ccc;
    }
    .member-comment-head a{
        display: inline-block;
        padding: 5px 10px;
        text-align: center;
        cursor: pointer;
    }
    
    .member-comment-head .comment-select{
        color: #ff5050;
        position: relative;
    }
    .member-comment-head .comment-select::after{
        content: '';
        height: 1px;
        width: 100%;
        background-color: #ff5050;
        position: absolute;
        left: 0;
        bottom: -1px;
    }
    .mod-comment{
        margin-top: 15px;
        border: 1px solid #ccc;
    }
    .mod-comment .mod-comment-head{
        padding: 5px 10px;
        background-color: #ddd;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #333;
    }
    .mod-comment .mod-comment-head span:nth-child(2){
        font-size: 12px;
    }
    .mod-comment div .mod-comment-write {
        width: 100%;
        position: absolute;
        bottom: 0;
    }
    .mod-comment div .mod-comment-write a{
        display: inline-block;
        width: 100%;
        text-align: center;
        border-radius: 3px;
        padding: 2px 0;
        background-color: #fb0056;
        color: #fff;
    }

    /* write-comment.css */
    .write-more{
        display: none;
    }
    .write-detail{
        margin-top: 20px;
        display: flex;
        align-items: flex-start;
    }
    .write-detail .write-left{
        width: 80px;
        margin-right: 10px;
    }
    .write-detail .write-left img{
        width: 100%;
    }
    .write-detail .write-right{
        width: calc(100% - 90px);
    }
    .write-detail .write-right .write-title{
        font-size: 20px;
        font-weight: bold;
        line-height: 20px;
        margin-bottom: 10px;
    }
    .write-detail .write-right .comment-money{
        margin-top: 10px;
        font-size: 22px;
        font-weight: bold;
    }
    .write-detail .write-right .comment-money span{
        font-size: 14px;
        font-weight: normal;
        color: #666;
        text-decoration: line-through;
    }
    .mod-write-more{
        margin-top: 20px;
        padding: 10px 0;
        line-height: 26px;
        border: 1px solid #f1f1f1;
        font-size: 14px;
        text-align: center;
        color: #333;
    }
    .mod-write-more a{
        color: #4ebeff;
    }
    .write-tab{
        margin-top: 20px;
        border-bottom: 1px solid #ff5050;
    }
    .write-tab span{
        display: inline-block;
        padding: 5px 10px;
        border-radius: 3px 3px 0 0;
        background-color: #ff5050;
        color: #fff;
        cursor: pointer;
        margin-right: 10px;
    }
    .write-form{
        margin: 20px 15px 0;
    }
    .write-form .form-write{
        font-size: 18px;
    }
    .write-form .form-write span{
        margin-left: 10px;
        font-size: 15px;
    }
    .write-form .write-text{
        margin-top: 10px;
    }
    .write-form .write-text textarea{
        width: 100%;
        height: 150px;
        box-sizing: border-box;
        padding: 10px;
        border-radius: 5px;
        border: 1px solid #ccc;
        resize: none;
        outline: none;
    }
    .write-form .write-add{
        padding: 25px 0;
        border-bottom: 1px dashed #ccc;
        display: flex;
        align-items: center;
    }
    .write-form .write-add .write-span{
        display: inline-block;
        width: 50px;
        height: 50px;
        margin-right: 15px;
        line-height: 50px;
        background-color: #ddd;
        border-radius: 3px;
        text-align: center;
    }
    .write-form .write-add .write-span>input{
        display: inline-block;
        width: 30px;
        height: 30px;
        margin-top: 10px;
        border-radius: 50%;
        line-height: 20px;
        border: 2px solid #fff;
        background-color: #ddd;
        color: #fff;
        font-size: 45px;
    }
    .write-form .write-star{
        text-align: center;
        margin-top: 20px;
    }
    .write-form .write-star span{
        cursor: pointer;
    }
    .write-form  .form-text{
        margin-top: 10px;
        text-align: center;
        font-size: 14px;
        color: #999;
    }
    .write-form .write-submit{
        margin-top: 25px;
        text-align: center;
    }
    .write-form .write-submit span{
        display: inline-block;
        padding: 5px 25px;
        background-color: #e9aa28;
        color: #fff;
        border-radius: 3px;
        font-weight: bold;
    }
    
    .upload-container {
        border: 1px dashed #888;
        padding: 20px;
        margin-top: 20px;
        width: 100%;
        max-height: 600px;
        overflow-y: auto;
        display: inline-block;
        box-sizing: border-box;
    }
    
    .upload-container p {
        margin-bottom: 20px;
    }
    
    .upload-container .upload-label {
        padding: 7px 15px;
        color: #3887dc;
        font-size: 12px;
        cursor: pointer;
        border: 1px solid #0075ff;
    }
    
    #file_list_info_show {
        padding-bottom: 20px;
        display: flex;
        flex-wrap: wrap;
    }
    
    #file_list_info_show p {
        display: inline-block;
        padding: 5px;
        margin-bottom: 10px;
        justify-content: space-between;
        position: relative;
        color: #000;
        background-color: #f2f2f2;
        margin-right: 10px;
    }
    #file_list_info_show p .write-append{
        display: block;
        width: 100px;
        height: 150px;
    }
    #file_list_info_show p .write-append img{
        width: 100%;
        height: 100%;
    }
    #file_list_info_show p .line {
        top: 0;
        left: 0;
        height: 1px;
        position: absolute;
        background: #0075ff;
        transition: all .3s;
    }
    
    #file_list_info_show p span {
        font-size: 12px;
        cursor: pointer;
        color: #0075ff;
    }

    /* comment-yes.css */
    .mod-yes{
        margin-top: 15px;
    }
    .mod-yes .mod-yes-head{
        background-color: #eee;
        padding: 5px 10px;
        display: flex;
        justify-content: space-between;
    }
    .mod-yes .mod-yes-head span:nth-child(2){
        font-size: 12px;
    }
    .mod-yes .mod-confirm{
        display: flex;
        padding: 10px 5px;
        border: 1px solid #eee;
    }
    .mod-yes .mod-confirm div{
        margin: 0 5px;
    }
    .mod-yes .mod-confirm>div:first-child{
        width: 70px;
    }
    .mod-yes .mod-confirm>div:nth-child(3){
        width: 80px;
    }
    .mod-yes .mod-confirm>div:first-child img{
        width: 100%;
    }
    .mod-yes .mod-confirm>div:nth-child(2){
        width: 50%;
    }
    .mod-yes .mod-confirm .confirm-two-title{
        color: #4ebeff;
        font-size: 16px;
    }
    .mod-yes .mod-confirm .confirm-two-cont{
        margin-top: 5px;
        color: #666;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }
    .mod-yes .mod-confirm .confirm-two-star{
        margin-top: 5px;
    }
    .mod-yes .mod-confirm .confirm-two-img img{
        width: 50px;
        margin-right: 5px;
        margin-top: 5px;
    }
    .mod-yes .mod-confirm>div:nth-child(3){
        text-align: center;
        font-size: 12px;
    }
    .mod-yes .mod-confirm>div:nth-child(3) p a{
        color: #4ebeff;
    }
    .mod-yes .mod-confirm>div:nth-child(3) .confirm-three-a a{
        display: inline-block;
        width: 100%;
        padding: 3px 0;
        margin-top: 10px;
        background-color: #fb0056;
        color: #fff;
        border-radius: 3px;
    }
    .mod-yes .mod-confirm>div:nth-child(3) p:nth-child(3),
    .mod-yes .mod-confirm>div:nth-child(3) p:nth-child(4){
        margin-top: 10px;
    }

    /* exchange.css */
    .exchange-div{
        margin: 15px 15px 0;
    }
    .exchange-one{
        display: flex;
        flex-wrap: wrap;
    }
    .exchange-one .integral-div-left{
        margin-right: 0;
    }
    .exchange-number{
        width: 40%;
        margin-top: 10px;
    }
    .exchange-number .exchange-number-text{
        font-size: 14px;
        line-height: 26px;
    }
    .exchange-number .exchange-number-text2{
        font-size: 14px;
        line-height: 26px;
        margin-top: 20px;
    }
    .exchange-number .exchange-number-cont{
        font-size: 35px;
        font-weight: bold;
    }
    .exchange-number .exchange-number-cont a{
        font-size: 14px;
        color: #4ebeff;
        text-decoration: underline;
    }
    .exchange-rule{
        width: 60%;
        font-size: 14px;
        margin-top: 10px;
    }
    .exchange-rule p{
        line-height: 26px;
    }
    .exchange-rule ul{
        margin-top: 10px;
        line-height: 24px;
        color: #666;
    }
    .exchange-money{
        margin-top: 30px;
        font-size: 12px;
    }
    .exchange-money input{
        width: calc(100% - 130px);
        height: 30px;
        margin-left: 10px;
        text-indent: 10px;
        border: 1px solid #ccc;
        border-radius: 3px;
        outline: none;
    }
    .exchange-paypel{
        margin-top: 30px;
    }
    .exchange-paypel img{
        width: 30px;
        margin: 0 10px;
    }
    .exchange-paypel .exchange-paypel-one{
        border-bottom: 1px solid #ccc;
        padding-bottom: 10px;
    }
    .exchange-paypel .exchange-paypel-one div{
        padding: 10px;
        padding-left: 20px;
        color: #333;
    }
    .exchange-paypel .exchange-paypel-one div input{
        width: calc(100% - 70px);
        height: 30px;
        border: 1px solid #ccc;
        border-radius: 3px;
        text-indent: 10px;
        margin-left: 15px;
        outline: none;
    }
    .exchange-paypel .exchange-paypel-two{
        padding: 10px 0;
    }
    .exchange-paypel .exchange-paypel-two form{
        padding-left: 20px;
        display: none;
    }
    .exchange-paypel .exchange-paypel-two form div{
        margin-top: 10px;
    }
    .exchange-paypel .exchange-paypel-two form div span{
        display: inline-block;
        width: 100px;
    }
    .exchange-paypel .exchange-paypel-two form div input{
        width: calc(100% - 120px);
        height: 30px;
        border: 1px solid #ccc;
        border-radius: 3px;
        text-indent: 10px;
        margin-left: 15px;
        outline: none;
    }
    .exchange-apply{
        margin-top: 30px;
    }
    .exchange-apply span{
        display: inline-block;
        padding: 5px 20px;
        font-size: 14px;
        color: #fff;
        background-color: #e9aa28;
        border-radius: 3px;
    }

    /* modify.css */
    .change-password{
        line-height: 30px;
        font-size: 14px;
    }
    .change-password .change-text{
        margin: 20px 0 10px;
    }
    .change-password p{
        margin-top: 10px;
    }
    .change-password p input{
        width: 100%;
        height: 30px;
        border: 1px solid #ccc;
        border-radius: 3px;
        text-indent: 10px;
        outline: none;
    }
    .change-password p span{
        display: inline-block;
        padding: 5px 0;
    }
    .change-password .change-submit span{
        width: 100%;
        text-align: center;
        border-radius: 3px;
        margin-top: 20px;
        background-color: #fb0056;
        color: #fff;
        cursor: pointer;
    }

    /* consulting.css*/
    .mod-comment{
        display: none;
    }

    .consulting-div{
        margin-top: 20px;
    }
    .consulting-div .consulting-left{
        width: 100%;
        box-sizing: border-box;
    }
    .consulting-question{
        text-align: center;
    }
    .consulting-question p{
        margin-top: 10px;
    }
    .consulting-question p:first-child{
        margin-top: 0;
    }
    .consulting-question p select,
    .consulting-question p input{
        width: 100%;
        height: 30px;
        border: 1px solid #ccc;
        border-radius: 3px;
        text-indent: 10px;
        outline: none;
    }
    .consulting-question p textarea{
        width: 100%;
        height: 100px;
        box-sizing: border-box;
        border: 1px solid #ccc;
        border-radius: 3px;
        padding: 10px;
        outline: none;
        resize: none;
    }
    .consulting-question p span{
        display: inline-block;
        width: 150px;
        padding: 5px 0;
        text-align: center;
        background-color: #e9aa28;
        border-radius: 3px;
        color: #fff;
    }
    .answer-div{
        width: 100%;
        height: 330px;
        margin-top: 10px;
        border-top: 1px solid #ccc;
        padding-top: 20px;
        overflow: hidden;
    }
    .consulting-answer{
        width: 100%;
        padding-right: 50px;
        height: 300px;
        overflow: auto;
    }
    .customer-service{
        display: flex;
        align-items: flex-start;
        margin-top: 15px;
    }
    .customer-service:first-child{
        margin-top: 0;
    }
    .customer-service img,
    .consulting-user img{
        width: 60px;
    }
    .customer-service div{
        width: 80%;
        font-size: 14px;
        margin-left: 10px;
    }
    .consulting-user div{
        width: 80%;
        font-size: 14px;
        margin-right: 10px;
        text-align: right;
    }
    .customer-service div p:first-child,
    .consulting-user div p:first-child{
        padding: 5px 10px;
        color: #666;
    }
    .customer-service div p:first-child span{
        margin-left: 10px;
    }
    .consulting-user div p:first-child span{
        margin-right: 10px;
    }
    .customer-service div .msg,
    .consulting-user div .msg{
        display: inline-block;
        padding: 8px 20px 8px 10px;
        background-color: #f1f1f1;
        color: #333;
        border-radius: 3px;
    }
    .consulting-user{
        display: flex;
        align-items: flex-start;
        justify-content: flex-end;
        margin-top: 15px;
    }
    .consulting-submit{
        height: 50px;
        padding: 0 10px;
        display: flex;
        align-items: center;
        /* margin-top: 280px; */
        border: 1px solid #ccc;
        border-radius: 30px;
        background-color: #f1f1f1;
        position: relative;
    }
    .consulting-submit .submit-ques{
        display: inline-block;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 27px;
        border: 2px solid #ccc;
        color: #666;
        font-size: 30px;
        border-radius: 50%;
        cursor: pointer;
    }
    .consulting-submit input{
        width: calc(100% - 120px);
        height: 40px;
        text-indent: 10px;
        background-color: #f1f1f1;
        border: none;
        outline: none;
    }
    .consulting-submit .submit-post{
        display: inline-block;
        width: 80px;
        height: 30px;
        border-radius: 15px;
        line-height: 30px;
        font-size: 14px;
        color: #fff;
        background-color: #ddd;
        text-align: center;
        cursor: pointer;
    }
    
    .ques-div{
        width: 30%;
        box-sizing: border-box;
        position: absolute;
        left: 20px;
        top: 0;
        z-index: 1;
        transform: translate(0,-110%);
        border: 1px solid #ccc;
        display: none;
    }
    .ques-div p{
        padding: 5px 10px;
        cursor: pointer;
    }
    .consulting-right{
        display: none;
        width: 60%;
        border: 1px solid #ccc;
        border-bottom: none;
        position: absolute;
        right: 10px;
        bottom: 70px;
    }
    .consulting-right-head{
        padding: 10px 0;
        background-color: #fb0056;
        color: #fff;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
    }
    .consulting-right ul li{
        padding: 10px 20px;
        border-bottom: 1px solid #ddd;
        cursor: pointer;
    }

    /* coupon.css */
    .coupon-text {
        margin: 20px 0 0;
        font-size: 14px;
    }
    
    .coupon-div {
        display: flex;
        flex-wrap: wrap;
    }
    
    .coupon-div .coupon-block {
        width: 100%;
        border: 1px solid #faac11;
        border-radius: 3px;
        margin-top: 20px;
        overflow: hidden;
    }
    
    .coupon-div .coupon-gray {
        filter: grayscale(100%);
    }

    .coupon-div .coupon-block .coupon-number {
        padding: 20px;
        display: flex;
        align-items: center;
        border-top: 8px solid #faac11;
        border-bottom: 8px solid #faac11;
        position: relative;
    }
    
    .coupon-div .coupon-block .coupon-number::after {
        content: '';
        position: absolute;
        left: 0;
        top: -4px;
        width: 100%;
        height: 8px;
        transform-origin: center left;
        background: radial-gradient(circle, #fff 2px, #fff, transparent 3px, transparent 4px, transparent 4px, transparent);
        background-size: 8px 8px
    
    }
    .coupon-div .coupon-block .coupon-number::before {
        content: '';
        position: absolute;
        left: 0;
        bottom: -4px;
        width: 100%;
        height: 8px;
        transform-origin: center left;
        background: radial-gradient(circle, #fff 2px, #fff, transparent 3px, transparent 4px, transparent 4px, transparent);
        background-size: 8px 8px
    
    }
    .coupon-div .coupon-block .coupon-number .coupon-money{
        font-size: 45px;
        font-weight: bold;
        color: #faac11;
        margin-right: 15px;
    }
    .coupon-div .coupon-block .coupon-number p:first-child{
        font-size: 16px;
        color: #000;
    }
    .coupon-div .coupon-block .coupon-number p:nth-child(2){
        margin-top: 3px;
        font-size: 12px;
        color: #999;
    }
    .coupon-div .coupon-block .coupon-time{
        padding: 5px 10px;
        font-size: 12px;
        color: #faac11;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .coupon-div .coupon-block .coupon-time a{
        display: inline-block;
        padding: 3px 15px;
        background-color: #faac11;
        color: #fff;
        border-radius: 3px;
    }
    
    .coupon-div .coupon-grey {
        width: 100%;
        border: 1px solid #999;
        border-radius: 3px;
        margin-top: 20px;
        overflow: hidden;
    }
    
    .coupon-div .coupon-grey .coupon-grey-number {
        padding: 20px;
        display: flex;
        align-items: center;
        border-top: 8px solid #999;
        border-bottom: 8px solid #999;
        position: relative;
    }
    
    .coupon-div .coupon-grey .coupon-grey-number::after {
        content: '';
        position: absolute;
        left: 0;
        top: -4px;
        width: 100%;
        height: 8px;
        transform-origin: center left;
        background: radial-gradient(circle, #fff 2px, #fff, transparent 3px, transparent 4px, transparent 4px, transparent);
        background-size: 8px 8px
    
    }
    .coupon-div .coupon-grey .coupon-grey-number::before {
        content: '';
        position: absolute;
        left: 0;
        bottom: -4px;
        width: 100%;
        height: 8px;
        transform-origin: center left;
        background: radial-gradient(circle, #fff 2px, #fff, transparent 3px, transparent 4px, transparent 4px, transparent);
        background-size: 8px 8px
    
    }
    .coupon-div .coupon-grey .coupon-grey-number .coupon-grey-money{
        font-size: 45px;
        font-weight: bold;
        color: #999;
        margin-right: 15px;
    }
    .coupon-div .coupon-grey .coupon-grey-number p:first-child{
        font-size: 16px;
        color: #000;
    }
    .coupon-div .coupon-grey .coupon-grey-number p:nth-child(2){
        margin-top: 3px;
        font-size: 12px;
        color: #999;
    }
    .coupon-div .coupon-grey .coupon-grey-time{
        padding: 5px 10px;
        font-size: 12px;
        color: #999;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .coupon-div .coupon-grey .coupon-grey-time a{
        display: inline-block;
        padding: 3px 15px;
        background-color: #999;
        color: #fff;
        border-radius: 3px;
    }

}