.section-input .el-input,.section-input .el-textarea {
    width: 290px;
    height: 45px
}

.section-input .el-input input,.section-input .el-input textarea,.section-input .el-textarea input,.section-input .el-textarea textarea {
    height: 45px;
    border: 2px solid #eee;
    border-radius: 0;
    font-size: 14px;
    padding: 10px 15px
}

.section-input .el-input input:hover,.section-input .el-input textarea:hover,.section-input .el-textarea input:hover,.section-input .el-textarea textarea:hover {
    border: 2px solid #222
}

.section-input .el-input input::-webkit-input-placeholder,.section-input .el-input textarea::-webkit-input-placeholder,.section-input .el-textarea input::-webkit-input-placeholder,.section-input .el-textarea textarea::-webkit-input-placeholder {
    color: #343538;
    opacity: .3
}

.section-input textarea {
    padding: 5px 15px
}

.pay-success[data-v-abf6adc2] {
    line-height: 23px
}

.download-single-model[data-v-abf6adc2] {
    border-right: 1px solid #eff2f6;
    position: absolute;
    width: 600px;
    right: -600px;
    top: 0;
    bottom: 0;
    transition: all .3s ease-in-out;
    z-index: 4003;
    background: #fff;
    box-shadow: 0 5px 15px rgba(71,80,89,.2);
    padding: 0;
    color: #222
}

.download-single-model .back[data-v-abf6adc2] {
    cursor: pointer;
    position: absolute;
    top: 20px;
    left: 20px;
    line-height: 16px;
    font-size: 24px
}

.download-single-model .back i[data-v-abf6adc2] {
    font-size: inherit
}

.download-single-model .download-body[data-v-abf6adc2] {
    width: 360px;
    color: #737680
}

.download-single-model .download-body .real-img-box[data-v-abf6adc2] {
    background: #eff2f6;
    position: relative;
    height: 300px;
    width: 300px;
    margin: 0 auto 40px
}

.download-single-model .download-body .real-img-box div[data-v-abf6adc2] {
    color: #333;
    line-height: 1.56;
    font-weight: 500;
    position: absolute;
    top: 50%;
    width: 100%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    text-align: center;
    font-size: 20px
}

.download-single-model .download-body .free-download-text[data-v-abf6adc2] {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.56;
    white-space: nowrap
}

.download-single-model .download-body button[data-v-abf6adc2] {
    border-radius: 0;
    padding: 12px 20px
}

.download-single-model .download-body.unactive[data-v-abf6adc2] {
    visibility: hidden
}

.download-single-model .transform-center[data-v-abf6adc2] {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

.container[data-v-abf6adc2] {
    box-sizing: border-box;
    border-right: 1px solid #eff2f6;
    position: absolute;
    width: 600px;
    right: -600px;
    top: 0;
    bottom: 0;
    transition: all .3s ease-in-out;
    z-index: 4003;
    background: #fff;
    box-shadow: 0 5px 15px rgba(71,80,89,.2);
    padding: 60px 0 0 46px;
    color: #222
}

.container .back[data-v-abf6adc2] {
    cursor: pointer;
    position: absolute;
    top: 20px;
    left: 20px;
    line-height: 16px;
    font-size: 24px
}

.container .back i[data-v-abf6adc2] {
    font-size: inherit
}

.container h1[data-v-abf6adc2] {
    font-size: 32px;
    font-weight: 600;
    line-height: 1.5;
    margin: 0 0 25px
}

.container h1 span[data-v-abf6adc2] {
    padding: 0 2px;
    box-shadow: inset 0 -12px 0 #fdc839
}

.container .section[data-v-abf6adc2] {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 25px
}

.container .section .header[data-v-abf6adc2] {
    line-height: 1.23;
    color: #9fa3a7;
    margin-bottom: 8px
}

.container .section .list[data-v-abf6adc2] {
    display: flex
}

.container .section .list .item[data-v-abf6adc2] {
    cursor: pointer;
    color: #737680;
    font-size: 12px;
    margin-right: 10px;
    padding: 9px 13px;
    min-width: 78px;
    height: 36px;
    box-sizing: border-box;
    border: 2px solid #eee;
    text-align: center
}

.container .section .list .item.selected[data-v-abf6adc2],.container .section .list .item[data-v-abf6adc2]:hover {
    color: #222;
    border: 2px solid #222
}

.container .section .list .item.disabled[data-v-abf6adc2] {
    cursor: no-drop;
    color: #737680!important;
    border: 2px solid #eee!important
}

.container .price-part[data-v-abf6adc2] {
    display: flex;
    height: 34px;
    line-height: 34px;
    align-items: center
}

.container .price-part .header[data-v-abf6adc2] {
    margin-bottom: 0
}

.container .price-part .price[data-v-abf6adc2] {
    color: #f9593a;
    font-size: 24px;
    font-weight: 900
}

.container .section[data-v-abf6adc2]:last-child {
    margin-bottom: 29px
}

.container button[data-v-abf6adc2] {
    color: #222;
    font-weight: 600;
    padding: 12px 45px;
    font-size: 14px;
    border-radius: 50px
}

.container button .iconfont[data-v-abf6adc2] {
    margin-left: 20px
}

.container .section-phone-input[data-v-abf6adc2] {
    display: flex;
    align-items: center
}

.container .section-phone-input .header[data-v-abf6adc2] {
    margin: 0
}

.container.active[data-v-abf6adc2],.download-single-model.active[data-v-abf6adc2] {
    right: 0;
    transition: all .3s ease-in-out
}

.go-to-pay[data-v-abf6adc2] {
    cursor: pointer;
    margin-top: 20px
}

.go-to-pay span[data-v-abf6adc2] {
    color: #20a0ff
}

.download-qrcode[data-v-abf6adc2] {
    visibility: hidden;
    line-height: .73;
    letter-spacing: .5px;
    color: #737680;
    font-size: 22px;
    font-weight: 500;
    text-align: center
}

.download-qrcode .qrcode-box[data-v-abf6adc2] {
    margin: 30px 0 20px;
    width: 196px;
    height: 196px;
    border: 1px solid #e6e8eb
}

.download-qrcode .qrcode-box img[data-v-abf6adc2] {
    width: 100%;
    height: 100%;
    display: block
}

.download-qrcode .price[data-v-abf6adc2] {
    color: #f9593a;
    font-size: 24px;
    font-weight: 900
}

.download-link[data-v-abf6adc2] {
    visibility: hidden;
    width: 80%
}

.download-link p[data-v-abf6adc2] {
    margin: 0;
    text-align: left
}

.download-link p[data-v-abf6adc2]:first-child {
    font-size: 18px;
    font-weight: 600;
    line-height: .89;
    margin-bottom: 39px
}

.download-link p[data-v-abf6adc2]:nth-child(2) {
    color: #222;
    line-height: 1;
    font-size: 14px;
    margin-bottom: 70px
}

.download-link p:nth-child(2) a[data-v-abf6adc2] {
    color: #20a0ff;
    display: block;
    word-break: break-all;
    line-height: 1.5
}

.download-link.active[data-v-abf6adc2],.download-qrcode.active[data-v-abf6adc2] {
    visibility: visible
}

@media screen and (max-width:770px) {
    .download-single-model[data-v-abf6adc2] {
        box-shadow: none
    }

    .container[data-v-abf6adc2] {
        width: 100%;
        height: 100%;
        z-index: 5000;
        box-shadow: none;
        padding: 40px 15px;
        left: 0;
        right: 0;
        top: auto;
        bottom: -100%
    }

    .container .close[data-v-abf6adc2] {
        cursor: pointer;
        position: absolute;
        top: 20px;
        right: 20px;
        line-height: 16px;
        font-size: 16px
    }

    .container .close i[data-v-abf6adc2] {
        font-size: inherit
    }

    .container h1[data-v-abf6adc2] {
        text-align: center;
        font-size: 24px
    }

    .container .section[data-v-abf6adc2] {
        margin-bottom: 15px
    }

    .container .section .list[data-v-abf6adc2] {
        flex-wrap: wrap
    }

    .container .section .list .item[data-v-abf6adc2] {
        margin-bottom: 10px
    }

    .container .section .list .item[data-v-abf6adc2]:nth-child(4) {
        margin-right: 0
    }

    .container button[data-v-abf6adc2] {
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .container.active[data-v-abf6adc2] {
        bottom: 0
    }
}

.container[data-v-ca33a278] {
    box-sizing: border-box;
    border-right: 1px solid #eff2f6;
    position: absolute;
    width: 600px;
    right: -600px;
    top: 0;
    bottom: 0;
    transition: all .3s ease-in-out;
    z-index: 4003;
    background: #fff;
    box-shadow: 0 5px 15px rgba(71,80,89,.2);
    padding: 60px 0 0 46px;
    color: #222
}

.container .back[data-v-ca33a278] {
    cursor: pointer;
    position: absolute;
    top: 20px;
    left: 20px;
    line-height: 16px;
    font-size: 24px
}

.container .back i[data-v-ca33a278] {
    font-size: inherit
}

.container h1[data-v-ca33a278] {
    font-size: 32px;
    font-weight: 600;
    line-height: 1.5;
    margin: 0 0 25px
}

.container h1 span[data-v-ca33a278] {
    padding: 0 2px;
    box-shadow: inset 0 -12px 0 #fdc839
}

.container .section[data-v-ca33a278] {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 25px
}

.container .section .header[data-v-ca33a278] {
    line-height: 1.23;
    color: #9fa3a7;
    margin-bottom: 8px;
    width: 14%
}

.container .section .list[data-v-ca33a278] {
    display: flex
}

.container .section .list .item[data-v-ca33a278] {
    cursor: pointer;
    color: #737680;
    font-size: 12px;
    margin-right: 10px;
    padding: 9px 13px;
    min-width: 78px;
    height: 36px;
    box-sizing: border-box;
    border: 2px solid #eee;
    text-align: center
}

.container .section .list .item.selected[data-v-ca33a278],.container .section .list .item[data-v-ca33a278]:hover {
    color: #222;
    border: 2px solid #222
}

.container .section .list .item.disabled[data-v-ca33a278] {
    cursor: no-drop;
    color: #737680!important;
    border: 2px solid #eee!important
}

.container .price-part[data-v-ca33a278] {
    display: flex;
    height: 34px;
    line-height: 34px;
    align-items: center
}

.container .price-part .header[data-v-ca33a278] {
    margin-bottom: 0
}

.container .price-part .price[data-v-ca33a278] {
    color: #f9593a;
    font-size: 24px;
    font-weight: 900
}

.container .section[data-v-ca33a278]:last-child {
    margin-bottom: 29px
}

.container button[data-v-ca33a278] {
    color: #222;
    font-weight: 600;
    padding: 12px 45px;
    font-size: 14px;
    border-radius: 50px
}

.container button .iconfont[data-v-ca33a278] {
    margin-left: 20px
}

.container .section-input[data-v-ca33a278] {
    display: flex;
    align-items: center
}

.container .section-input .header[data-v-ca33a278] {
    margin: 0
}

.container.active[data-v-ca33a278] {
    right: 0;
    transition: all .3s ease-in-out
}

@media screen and (max-width:770px) {
    .download-single-model[data-v-ca33a278] {
        box-shadow: none
    }

    .container[data-v-ca33a278] {
        width: 100%;
        height: 100%;
        z-index: 5000;
        box-shadow: none;
        padding: 40px 15px;
        left: 0;
        right: 0;
        top: auto;
        bottom: -100%
    }

    .container .close[data-v-ca33a278] {
        cursor: pointer;
        position: absolute;
        top: 20px;
        right: 20px;
        line-height: 16px;
        font-size: 16px
    }

    .container .close i[data-v-ca33a278] {
        font-size: inherit
    }

    .container h1[data-v-ca33a278] {
        text-align: center;
        font-size: 24px
    }

    .container .section[data-v-ca33a278] {
        margin-bottom: 15px
    }

    .container .section .list[data-v-ca33a278] {
        flex-wrap: wrap
    }

    .container .section .list .item[data-v-ca33a278] {
        margin-bottom: 10px
    }

    .container .section .list .item[data-v-ca33a278]:nth-child(4) {
        margin-right: 0
    }

    .container .section .header[data-v-ca33a278] {
        width: 22%
    }

    .container button[data-v-ca33a278] {
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .container.active[data-v-ca33a278] {
        bottom: 0
    }
}

.search-input input {
    height: 40px;
    padding-left: 35px!important;
    padding-right: 10px!important
}

.search-input input::-webkit-input-placeholder {
    font-size: 14px;
    -webkit-transform: translateY(2px);
    transform: translateY(2px)
}

.photo-list[data-v-d15bf9a2] {
    background: #fff;
    height: 100%;
    overflow: hidden;
    position: relative
}

.photo-list .nodata[data-v-d15bf9a2] {
    font-size: 16px;
    margin: 0;
    text-align: center;
    color: #c0ccda;
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

.photo-list .header[data-v-d15bf9a2] {
    margin: 10px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.photo-list .searchImg[data-v-d15bf9a2] {
    margin: 0 20px 5px
}

.photo-list .upload-btn[data-v-d15bf9a2] {
    position: relative;
    width: 84px;
    height: 28px;
    line-height: 26px;
    padding: 0 8px;
    font-size: 13px
}

.photo-list .upload-btn .el-icon-plus[data-v-d15bf9a2] {
    vertical-align: 1px;
    font-size: 11px;
    margin-right: 4px
}

.photo-list h4[data-v-d15bf9a2] {
    font-size: 18px;
    line-height: 40px;
    margin: 0;
    padding: 0
}

.photo-list a.changeOther[data-v-d15bf9a2] {
    float: right;
    color: #99a9bf;
    cursor: pointer;
    line-height: 60px;
    font-size: 14px
}

.photo-list a.changeOther img[data-v-d15bf9a2] {
    width: 15px;
    vertical-align: -3px;
    margin-right: 2px
}

.photo-list a.changeOther[data-v-d15bf9a2]:hover {
    opacity: .8
}

.photo-list .photo-category-box[data-v-d15bf9a2] {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    padding: 0 25px 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between
}

.photo-list .photo-category-box .category-detail[data-v-d15bf9a2] {
    cursor: pointer;
    text-align: center;
    font-size: 14px;
    width: 41px;
    color: #99a9bf;
    line-height: 20px;
    height: 20px;
    display: inline-block
}

.photo-list .photo-category-box .category-detail-checked[data-v-d15bf9a2] {
    color: #1ea0ff;
    border-bottom: 3px solid #1ea0ff
}

.photo-list .photo-detail-box[data-v-d15bf9a2] {
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
    padding-top: 10px
}

.photo-list .photo-detail-box .el-loading-mask[data-v-d15bf9a2] {
    z-index: 1000!important
}

.photo-list .photo-detail[data-v-d15bf9a2] {
    width: 206px;
    box-sizing: border-box;
    margin: auto;
    margin-bottom: 12px;
    cursor: pointer;
    position: relative;
    height: 120px;
    background-size: cover;
    border-radius: 8px;
    background-position: 50%;
    border: 3px solid #fff;
    transition: all .3s ease;
    background-color: #ddd
}

.photo-list .photo-detail span[data-v-d15bf9a2] {
    position: absolute;
    right: -13px;
    top: -13px;
    background: #f7ba2a;
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 30px;
    color: #fff;
    line-height: 30px;
    text-align: center;
    font-weight: bolder;
    opacity: 0;
    transition: all .3s ease
}

.photo-list .photo-detail .pablo-gallery-item-extra[data-v-d15bf9a2] {
    position: absolute;
    bottom: 10px;
    right: 10px;
    height: 12px;
    line-height: 0
}

.photo-list .photo-detail .pablo-gallery-item-extra .pablo-gallery-item-source[data-v-d15bf9a2] {
    opacity: .9;
    display: inline-block;
    height: 12px;
    text-indent: -9999em;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: 100% 0;
    background-size: contain;
    width: 63px
}

.photo-list .photo-detail .pablo-gallery-item-extra .pablo-gallery-item-source.s-unsplash_search[data-v-d15bf9a2] {
    background-image: url(/img/gallery-source-unsplash.png)
}

.photo-list .photo-detail .pablo-gallery-item-extra .pablo-gallery-item-source.s-pixabay_search[data-v-d15bf9a2] {
    background-image: url(/img/gallery-source-pixabay.png)
}

.photo-list .photo-detail .pablo-gallery-item-extra .pablo-gallery-item-source.s-wocintech[data-v-d15bf9a2] {
    background-image: url(/img/gallery-source-wocintech.png)
}

.photo-list .photo-detail .pablo-gallery-item-extra .pablo-gallery-item-link[data-v-d15bf9a2] {
    float: right
}

.photo-list .photo-detail .pablo-gallery-item-extra .pablo-gallery-item-link[data-v-d15bf9a2]:before {
    content: "";
    display: block;
    margin-left: 5px;
    width: 12px;
    height: 12px;
    background-color: transparent;
    background-image: url(/img/gallery-info-icon.png);
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 12px;
    text-indent: -9999em
}

.photo-list .photo-detail .pablo-gallery-item-extra .pablo-gallery-item-link[data-v-d15bf9a2]:after {
    display: none
}

@media screen and (min-width:768px) {
    .photo-list .photo-detail[data-v-d15bf9a2]:hover {
        border: 3px solid #f7ba2a
    }
}

.photo-list .photo-detail[data-v-d15bf9a2]:last-child {
    margin-bottom: 18px
}

.photo-list .photo-detail-checked[data-v-d15bf9a2] {
    border: 3px solid #f7ba2a
}

.photo-list .photo-detail-checked span[data-v-d15bf9a2] {
    opacity: 1
}

@media screen and (min-width:768px) {
    .photo-list[data-v-d15bf9a2] {
        box-sizing: border-box;
        min-height: 100%;
        float: left;
        width: 280px!important
    }

    .photo-detail-box[data-v-d15bf9a2] {
        height: calc(100vh - 195px)
    }
}

.card[data-v-f821b320] {
    position: relative;
    margin-bottom: 25px;
    transition: all .2s ease-in
}

.card[data-v-f821b320],.card[data-v-f821b320]:hover {
    border-radius: 4px;
    box-shadow: 0 5px 20px 0 rgba(0,0,0,.05);
    overflow: hidden
}

.card[data-v-f821b320]:hover {
    -webkit-transform: scale(1.03);
    transform: scale(1.03)
}

.card[data-v-f821b320]:last-child {
    margin-bottom: 0
}

.card.c-card[data-v-f821b320] {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    background-color: hsla(0,0%,100%,.65)
}

.card.c-card a[data-v-f821b320] {
    display: block;
    margin: 0
}

.card .biz-img[data-v-f821b320],.card .vi-img[data-v-f821b320] {
    max-width: 100%;
    display: block;
    margin: 0
}

.card .vi-img[data-v-f821b320] {
    border-radius: 4px;
    transition: all .3s ease
}

.card .poster-img[data-v-f821b320] {
    border-bottom-left-radius: unset;
    border-bottom-right-radius: unset
}

.card:hover .card-mask[data-v-f821b320] {
    opacity: 1
}

.card-mask[data-v-f821b320] {
    position: absolute;
    z-index: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    font-size: 0;
    text-align: right;
    color: #fff;
    transition: all .2s ease-in;
    opacity: 0;
    pointer-events: none
}

@media screen and (max-width:767px) {
    .card-mask[data-v-f821b320] {
        opacity: 1
    }
}

.card-mask[data-v-f821b320]:after {
    content: "";
    display: inline-block;
    vertical-align: bottom;
    height: 100%
}

.card-mask__download[data-v-f821b320],.card-mask__edit[data-v-f821b320],.card-mask__share[data-v-f821b320] {
    z-index: 999;
    position: relative;
    padding: 0;
    margin: 0 10px 10px 0!important;
    display: inline-block!important;
    vertical-align: bottom;
    border-radius: 50%;
    border: none;
    width: 30px;
    height: 30px;
    text-indent: 101%;
    white-space: nowrap;
    overflow: hidden;
    background-color: #fff;
    opacity: .9;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    box-shadow: 0 0 6px 0 rgba(0,0,0,.04),0 2px 4px 0 rgba(0,0,0,.12);
    transition: all .3s ease;
    text-indent: 0;
    pointer-events: auto
}

.card-mask__download[data-v-f821b320]:after,.card-mask__edit[data-v-f821b320]:after,.card-mask__share[data-v-f821b320]:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-family: iconfont;
    font-size: 14px;
    text-indent: 0;
    color: #333;
    transition: inherit
}

.card-mask__download[data-v-f821b320]:hover,.card-mask__edit[data-v-f821b320]:hover,.card-mask__share[data-v-f821b320]:hover {
    opacity: 1;
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.card-mask__download[data-v-f821b320]:hover:after,.card-mask__edit[data-v-f821b320]:hover:after,.card-mask__share[data-v-f821b320]:hover:after {
    color: #000
}

.card-mask__edit[data-v-f821b320]:after {
    content: "\E67E"
}

.card-mask__share[data-v-f821b320]:after {
    content: "\E68C";
    font-size: 17px
}

.card-mask__download[data-v-f821b320]:after {
    content: "\E673"
}

.poster-card .card-mask__download[data-v-f821b320],.poster-card .card-mask__edit[data-v-f821b320] {
    margin: 0 10px 50px 0!important
}

.remove-button[data-v-f821b320] {
    visibility: hidden;
    position: absolute;
    top: 2px;
    right: 2px;
    font-size: 18px;
    color: #bfcbd9;
    display: flex;
    width: 28px;
    height: 28px;
    justify-content: center;
    align-items: center;
    padding: 0;
    text-align: center;
    transition: all .2s ease-in
}

.card:hover .remove-button[data-v-f821b320] {
    visibility: visible
}

.mark[data-v-f821b320] {
    position: absolute;
    top: 0;
    right: 0;
    height: 60px;
    width: 60px;
    border-radius: 4px;
    color: #fff;
    font-size: 12px
}

.mark[data-v-f821b320]:before {
    content: "";
    width: 0;
    height: 0;
    border-top: 60px solid #878787;
    border-left: 60px solid transparent;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.mark.basic[data-v-f821b320]:before {
    border-top-color: #878787
}

.mark.designer[data-v-f821b320]:before {
    border-top-color: #06c29f
}

.mark.professional[data-v-f821b320]:before {
    border-top-color: #3e8aef
}

.mark.luxury[data-v-f821b320]:before {
    border-top-color: #f7ba2a
}

.mark[data-v-f821b320]:after {
    content: attr(data-text);
    z-index: 2;
    position: absolute;
    width: 60px;
    text-align: center;
    left: 0;
    font-size: 12px;
    -webkit-transform: rotate(45deg) translate3d(16px,8px,0);
    transform: rotate(45deg) translate3d(16px,8px,0);
    color: #fff
}

.mark.professional[data-v-f821b320]:after {
    -webkit-transform: rotate(45deg) scale(.88) translate3d(16px,8px,0);
    transform: rotate(45deg) scale(.88) translate3d(16px,8px,0)
}

.footerloading[data-v-f821b320] {
    margin-top: 67px
}

@media screen and (max-width:767px) {
    .card.c-card[data-v-f821b320] {
        width: 100%
    }

    .mark[data-v-f821b320] {
        height: 50px;
        width: 50px;
        font-size: 10px
    }

    .mark[data-v-f821b320]:before {
        border-top: 50px solid #878787;
        border-left: 50px solid transparent
    }

    .mark[data-v-f821b320]:after {
        width: 50px;
        font-size: 10px;
        -webkit-transform: rotate(45deg) translate3d(14px, 6px, 0);
        transform: rotate(45deg) translate3d(14px, 6px, 0)
    }
}

.symbol-panel-inner[data-v-bb819c96] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 20px 15px
}

.s-n-btn[data-v-bb819c96] {
    width: 76px;
    height: 34px;
    border-radius: 4px;
    border: 1px solid rgba(52,53,56,.1);
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 32px;
    letter-spacing: .4px;
    color: #475669;
    text-align: center;
    transition: all .2s ease-out;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 0
}

.s-n-btn.is-plain[data-v-bb819c96] {
    border-color: rgba(52,53,56,.1)
}

.s-n-btn.is-disabled.is-plain[data-v-bb819c96] {
    border-color: rgba(52,53,56,.05);
    color: rgba(52,53,56,.2)
}

.s-n-btn[data-v-bb819c96]:not(.is-disabled):focus,.s-n-btn[data-v-bb819c96]:not(.is-disabled):hover {
    border-color: #20a0ff;
    color: #20a0ff
}

.sli-title[data-v-bb819c96] {
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.2px;
    color: rgba(52,53,56,.5);
    margin-bottom: 2px
}

@media screen and (max-width:768px) {
    .flex-name-controls .inner[data-v-bb819c96] {
        flex-direction: row;
        justify-content: left;
        padding: 16px;
        overflow-x: auto
    }

    .flex-name-controls .inner .s-n-group[data-v-bb819c96] {
        display: flex;
        padding-right: 12px
    }

    .s--slide[data-v-bb819c96] {
        position: relative;
        height: 40px
    }

    .s--slide .pc-slide[data-v-bb819c96] {
        display: none
    }

    .s--slide
    .mobile-n-slide[data-v-bb819c96] {
        position: absolute;
        left: -10px;
        border: none;
        top: 5px;
        display: block
    }
}

.display-area[data-v-a60dd89e] {
    display: flex;
    justify-content: center;
    width: 100%;
    position: relative
}

.swiper-display[data-v-a60dd89e] {
    width: 100%
}

.single.card[data-v-a60dd89e] {
    width: 100%;
    margin: 15px;
    max-width: 476px
}

.magic-btn[data-v-a60dd89e] {
    position: absolute;
    bottom: -40px;
    font-size: 24px
}

@media screen and (max-width:1280px) {
    .single.card[data-v-a60dd89e] {
        max-width: 390px
    }
}

.hovercard[data-v-a60dd89e] {
    width: 470px;
    height: 350px;
    position: relative
}

.show-panel[data-v-a60dd89e] {
    padding: 10px;
    width: 476px
}

.panel-frame[data-v-a60dd89e] {
    position: absolute;
    z-index: 1
}

.multi-area[data-v-a60dd89e] {
    width: 100%
}

.edit-container[data-v-477e0596] {
    height: 100%;
    overflow-y: auto
}

.show-stage[data-v-477e0596] {
    display: flex;
    flex-direction: column;
    height: 100%
}

.show-stage .panel-frame[data-v-477e0596] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    background-color: #fff;
    flex-shrink: 0
}

.show-stage .display-frame[data-v-477e0596] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh
}

.panel-shadow[data-v-477e0596] {
    box-shadow: 0 0 1px rgba(0,0,0,.2)
}

@media screen and (max-width:768px) {
    .show-stage .display-frame[data-v-477e0596] {
        align-items: flex-start
    }
}

.mobile-controls .el-select .el-input__inner {
    border-radius: 0
}

.mobile-controls .icon-size .el-input__inner {
    border-right: 0
}

.display-area[data-v-8d5457fe] {
    display: flex;
    justify-content: center;
    width: 100%;
    position: relative
}

.swiper-display[data-v-8d5457fe] {
    width: 100%
}

.single.card[data-v-8d5457fe] {
    width: 100%;
    margin: 15px;
    max-width: 476px
}

.magic-btn[data-v-8d5457fe] {
    position: absolute;
    bottom: -40px;
    font-size: 24px
}

@media screen and (max-width:1280px) {
    .single.card[data-v-8d5457fe] {
        max-width: 390px
    }
}

.hovercard[data-v-8d5457fe] {
    width: 470px;
    height: 350px;
    position: relative
}

.show-panel[data-v-8d5457fe] {
    padding: 10px;
    width: 476px
}

.panel-frame[data-v-8d5457fe] {
    position: absolute;
    z-index: 1
}

.multi-area[data-v-8d5457fe] {
    width: 100%
}

.edit-container[data-v-22cf65a0] {
    height: 100%
}

.show-stage[data-v-22cf65a0] {
    display: flex;
    flex-direction: column;
    height: 100%
}

.show-stage .panel-frame[data-v-22cf65a0] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    background-color: #fff;
    flex-shrink: 0
}

.show-stage .display-frame[data-v-22cf65a0] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh
}

.panel-shadow[data-v-22cf65a0] {
    box-shadow: 0 0 1px rgba(0,0,0,.2)
}

#footerMenu[data-v-055be85c] {
    height: 92px;
    position: fixed;
    bottom: -4px;
    width: 100%
}

.footer-menu[data-v-055be85c] {
    border-top: none
}

.footer-menu .item[data-v-055be85c]:nth-child(2) {
    border-left: 0;
    border-right: 0
}

.footer-menu-items[data-v-055be85c] {
    position: fixed;
    height: 92px;
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center
}

.footer-menu-items .item[data-v-055be85c] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

.footer-menu-items .item span[data-v-055be85c] {
    font-size: 12px;
    color: #3a3a3a
}

.footer-menu-items .item img.mini-pg-logo[data-v-055be85c] {
    width: 50px;
    -webkit-transform: translate(1px,8px);
    transform: translate(1px,8px)
}

.footer-menu-items .item span.mini-pg-logo[data-v-055be85c] {
    -webkit-transform: translateY(17px);
    transform: translateY(17px)
}

.footer-menu-items .item img.mini-pg-samples[data-v-055be85c] {
    width: 28px;
    -webkit-transform: translateY(40px);
    transform: translateY(40px)
}

.footer-menu-items .item span.mini-pg-samples[data-v-055be85c] {
    -webkit-transform: translateY(44px);
    transform: translateY(44px)
}

.footer-menu-items .item img.mini-pg-my[data-v-055be85c] {
    width: 27px;
    -webkit-transform: translateY(37px);
    transform: translateY(37px)
}

.footer-menu-items .item span.mini-pg-my[data-v-055be85c] {
    -webkit-transform: translateY(40px);
    transform: translateY(40px)
}

.footer-menu-items img[data-v-055be85c] {
    display: block
}

.preview-share[data-v-318f99fd] {
    display: flex;
    flex-direction: column;
    min-height: 96px;
    text-align: center;
    box-sizing: border-box
}

.preview-share [data-v-318f99fd] {
    box-sizing: inherit
}

.preview-share__title[data-v-318f99fd] {
    margin: 10px auto
}

.preview-share__title[data-v-318f99fd]:first-child {
    margin-top: 0;
    margin-bottom: 20px
}

.preview-share__arrow[data-v-318f99fd] {
    position: relative;
    top: 20px;
    height: 35px
}

.preview-share__form[data-v-318f99fd] {
    display: flex;
    align-items: stretch;
    justify-content: center;
    margin: 10px auto 0;
    max-width: 550px
}

.preview-share__form[data-v-318f99fd] .el-input__inner {
    height: 55px;
    border: 2px solid #3f8aef;
    border-radius: 6px 0 0 6px;
    text-align: center;
    font-size: 16px;
    color: #3f8aef;
    background: transparent
}

.preview-share__form[data-v-318f99fd] .el-input__inner::-webkit-input-placeholder {
    color: rgba(63,138,239,.8)
}

.preview-share__form[data-v-318f99fd] .el-input__inner:-ms-input-placeholder,.preview-share__form[data-v-318f99fd] .el-input__inner::-ms-input-placeholder {
    color: rgba(63,138,239,.8)
}

.preview-share__form[data-v-318f99fd] .el-input__inner::placeholder {
    color: rgba(63,138,239,.8)
}

.preview-share__form--invalid[data-v-318f99fd] .el-input__inner {
    border-color: #f7c10d
}

.preview-share__form--invalid .preview-share__button[data-v-318f99fd] {
    border: 2px solid #f7c10d!important;
    border-left: 0!important
}

.preview-share__button[data-v-318f99fd] {
    margin: auto;
    min-width: 130px;
    width: 240px;
    height: 55px;
    line-height: 55px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    background: #3f8aef;
    cursor: pointer
}

.preview-share__button[data-v-318f99fd]:hover {
    box-shadow: none;
    text-shadow: rgba(0,0,0,.2) 0 1px;
    background: #eab503
}

.preview-share[data-v-318f99fd] .el-button--large {
    padding-top: 14px;
    padding-bottom: 14px;
    margin: auto;
    width: 240px
}

.preview-share__editlink[data-v-318f99fd] {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .09px;
    color: #3f8aef;
    transition: all .3s ease
}

.preview-share__editlink[data-v-318f99fd]:hover {
    -webkit-filter: brightness(80%);
    filter: brightness(80%)
}

.preview-share__editlink[data-v-318f99fd] .iconfont {
    font-size: inherit
}

.preview-share__like[data-v-318f99fd] {
    margin-top: 40px
}

.preview-share__like-tips[data-v-318f99fd] {
    line-height: 1.5
}

.preview-share__like-tips[data-v-318f99fd] .zan {
    font-size: 22px;
    line-height: 0
}

.preview-share__like-tips[data-v-318f99fd] .learn-more {
    color: #1484ff
}

.preview-share__like-list[data-v-318f99fd] {
    position: relative;
    display: flex;
    padding-left: 0;
    margin-top: 10px;
    justify-content: center;
    align-items: center;
    height: 54px;
    list-style: none;
    overflow: hidden
}

.preview-share__like-list .preview-share__like-item[data-v-318f99fd] {
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-left: 2px;
    border: 2px solid #fff;
    border-radius: 27px;
    overflow: hidden;
    box-shadow: -1px 0 1px 0 #148573;
    box-sizing: content-box
}

.preview-share__like-list .preview-share__like-item[data-v-318f99fd]:not(:first-child) {
    margin-left: -15px
}

.preview-share__like-list .preview-share__like-item img[data-v-318f99fd] {
    width: 100%;
    height: 100%
}

.preview-share__like-list .preview-share__like-item--count[data-v-318f99fd] {
    line-height: 40px;
    font-size: 20px;
    color: #fff;
    background: #ababab
}

.preview-share__actions .iconfont[data-v-318f99fd] {
    line-height: 0;
    vertical-align: -1px
}

@media screen and (min-width:1024px) {
    .show-in-pc[data-v-729df404] {
        display: flex
    }

    .show-in-mobile[data-v-729df404] {
        display: none!important
    }
}

@media screen and (max-width:1023px) {
    .show-in-pc[data-v-729df404] {
        display: none!important
    }

    .show-in-mobile[data-v-729df404] {
        display: flex
    }
}

.pos-wrapper[data-v-729df404] {
    width: 170px;
    flex-wrap: wrap;
    justify-content: center
}

.pos-wrapper.show-in-mobile .pos[data-v-729df404] {
    margin: 0 20px 0 0
}

.pos-wrapper .pos[data-v-729df404] {
    height: 36px;
    background: #e8e8e8;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 20px 0 0;
    padding: 3px;
    width: 100%
}

.pos-wrapper .pos span[data-v-729df404] {
    width: 33%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    border-radius: 10px;
    color: #a3aab3;
    cursor: pointer
}

.pos-wrapper .pos span[data-v-729df404]:hover {
    color: #3f8aef
}

.pos-wrapper .pos span.actived[data-v-729df404] {
    background: #fff;
    color: #3f8aef
}

.pos-wrapper .pos span .icon-ziyuan20[data-v-729df404] {
    font-size: 8px
}

.pos-wrapper .pos span .icon-ziyuan21[data-v-729df404] {
    font-size: 13px
}

.pos-wrapper .pos span .icon-ziyuan19[data-v-729df404] {
    font-size: 12px
}

.pos-wrapper[data-v-729df404]:after {
    content: attr(after-content);
    font-size: 12px;
    color: #a3aab3;
    line-height: 28px
}

.symbol-panel-inner[data-v-729df404] {
    display: flex;
    align-items: center;
    justify-content: space-around;
    max-width: 1120px;
    margin: 0 auto;
    padding: 15px 5px;
    flex-direction: column-reverse
}

.symbol-panel-inner .size-slide[data-v-729df404] {
    width: 150px;
    display: none
}

.symbol-panel-inner .size-slide[data-v-729df404]:after {
    content: attr(after-content);
    font-size: 12px;
    color: #a3aab3;
    line-height: 28px
}

.symbol-panel-inner .size-slide .block-inner[data-v-729df404] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.symbol-panel-inner .size-slide .block-inner .el-slider[data-v-729df404] {
    width: 100%
}

.symbol-panel-inner .iconspace-slide[data-v-729df404] {
    width: 150px;
    margin-left: 20px;
    display: none
}

.symbol-panel-inner .iconspace-slide[data-v-729df404]:after {
    content: attr(after-content);
    font-size: 12px;
    color: #a3aab3;
    line-height: 28px
}

.symbol-panel-inner .mobile-controls[data-v-729df404] {
    display: flex;
    margin-top: 15px
}

.symbol-panel-inner .mobile-controls .el-select[data-v-729df404] {
    width: 70px
}

.symbol-panel-inner .mobile-controls .el-select[data-v-729df404]:after {
    content: attr(after-content);
    font-size: 12px;
    color: #a3aab3;
    line-height: 28px
}

.symbol-panel-inner .mobile-controls .el-select .el-input input.el-input__inner[data-v-729df404] {
    border-radius: 0
}

.symbol-panel-inner .symbols-list[data-v-729df404] {
    width: 100%;
    display: flex;
    align-items: stretch;
    justify-content: flex-start
}

.symbol-panel-inner .symbols-list .favorite-symbol[data-v-729df404] {
    width: 40px;
    height: 40px;
    border: 2px dashed #ccd1d6;
    display: inline-block;
    margin: 0 5px;
    border-radius: 12px;
    transition: all .3s ease-out;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    cursor: pointer
}

.symbol-panel-inner .symbols-list .favorite-symbol.filled[data-v-729df404] {
    background: #fff;
    border: none;
    box-shadow: 0 1px 2px rgba(0,0,0,.15);
    -webkit-transform: scale(1);
    transform: scale(1);
    padding: 5px;
    display: flex;
    align-items: center;
    justify-content: center
}

.symbol-panel-inner .symbols-list .favorite-symbol.select[data-v-729df404] {
    border: 2px solid #1485ff
}

.symbol-panel-inner .symbols-list .favorite-symbol img[data-v-729df404] {
    width: 26px
}

@media screen and (min-width:1024px) {
    .symbol-panel-inner[data-v-729df404] {
        flex-direction: row;
        padding: 15px 0
    }

    .symbol-panel-inner .iconspace-slide[data-v-729df404],.symbol-panel-inner .size-slide[data-v-729df404] {
        display: block
    }

    .symbol-panel-inner .mobile-controls[data-v-729df404] {
        display: none
    }

    .symbol-panel-inner .symbols-list[data-v-729df404] {
        width: 400px;
        margin-left: 20px
    }
}

.mobile-slide {
    background: #fff;
    border: 1px solid #bfcbd9;
    border-top: 0;
    display: flex;
    justify-content: center;
    position: absolute;
    z-index: 999999999;
    left: 20%
}

.mslide-input-symbol {
    width: 65px!important;
    height: 36px;
    border: 1px solid #bfcbd9;
    border-left: 0;
    display: flex;
    align-items: center;
    justify-content: space-around;
    position: relative;
    font-size: 12px;
    color: #333
}

.mslide-input-symbol .iconfont {
    font-size: 13px;
    color: #bbb
}

.mslide-input-symbol.fir {
    border-left: 1px solid #bfcbd9
}

.mslide-input-symbol:after {
    content: attr(after-content);
    font-size: 12px;
    color: #a3aab3;
    line-height: 20px;
    width: 100%;
    position: absolute;
    bottom: -20px
}

.symbol-area .symbol-input>.el-input__icon {
    display: none;
    right: 521px
}

.symbol-area .symbol-input>.el-input__inner {
    height: 50px
}

.symbol-area .symbol-input .el-input-group__prepend {
    width: 180px
}

.symbol-area .symbol-input .el-input-group__append .el-button {
    position: absolute;
    background: #20a0ff;
    top: 11px;
    bottom: 0;
    width: 25.5%;
    left: -137px;
    height: 46px;
    font-size: 14px;
    color: #fff;
    padding: 0
}

.symbol-area .symbol-input .el-input-group__append .el-button:hover {
    opacity: .8
}

.symbol-area .symbol-input .el-input-group__append .el-button:focus {
    color: gray
}

@media screen and (max-width:600px) {
    .symbol-area .symbol-search {
        padding: 10px 15px
    }

    .symbol-area .symbol-search .symbol-input {
        display: flex;
        flex-wrap: wrap-reverse
    }

    .symbol-area .symbol-search .symbol-input>.el-input__icon {
        bottom: 25px;
        top: auto;
        right: 0;
        -webkit-transform: translateY(50%);
        transform: translateY(50%)
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__append {
        width: 100%;
        display: block;
        border-radius: 4px;
        border: none;
        background: transparent;
        padding: 0
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__append .symbols {
        display: block;
        overflow: auto;
        height: 50px;
        padding: 5px 0
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__append .el-button {
        right: 12px;
        bottom: -48px;
        top: unset;
        left: auto;
        width: 38.7%
    }

    .symbol-area .symbol-search .symbol-input>.el-input-group__prepend,.symbol-area .symbol-search .symbol-input>.el-input__inner {
        margin-top: 10px;
        width: 60%
    }

    .symbol-area .symbol-search .symbol-input>.el-input-group__prepend+.el-icon-search+.el-input__inner {
        width: 40%
    }

    .symbol-area .symbol-search .symbol-input>.el-input__inner {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        display: block
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__prepend {
        padding: 0
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__prepend .prepend-wrapper {
        padding: 5px 0
    }
}

.vc-chrome-toggle-btn {
    display: none
}

.optional-colors {
    width: 500px;
    max-width: calc(100% - 20px)
}

[data-v-ce33da32] {
    box-sizing: border-box
}

.hidden[data-v-ce33da32] {
    display: none
}

@media screen and (max-width:770px) {
    .card[data-v-ce33da32] {
        width: 100%!important
    }
}

.dialog-content[data-v-ce33da32] {
    position: relative;
    overflow: hidden;
    display: flex;
    width: 100%;
    height: 100%
}

.bizcard-template_model_box[data-v-ce33da32] {
    display: flex;
    height: calc(100% - 40px);
    margin: 20px auto;
    width: calc(100% - 75px);
    justify-content: center;
    align-items: center;
    flex-direction: column
}

.bizcard-template_model_box[data-v-ce33da32] .display-model {
    height: 100%;
    width: 100%;
    position: relative
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box {
    display: flex;
    align-items: center;
    justify-content: space-around;
    line-height: 1;
    display: none;
    z-index: 1000;
    background-color: #242a30;
    border-radius: 2px;
    position: absolute;
    padding: 0 5px;
    width: 237px;
    height: 50px;
    top: -64px;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.5)
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .font-selector {
    opacity: 1!important
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .upload_img_input {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    display: block;
    top: 0;
    opacity: 0;
    box-sizing: border-box
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-family: Helvetica Neue,PingFang SC,Microsoft YaHei!important;
    cursor: pointer;
    position: relative;
    font-size: 12px;
    float: left;
    z-index: 100;
    color: #fff;
    opacity: .7
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .third-dropdown {
    position: absolute;
    top: 55px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .icon-shuaxin {
    display: inline-block;
    font-size: 13px;
    margin-right: 3px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .dropdown-option .text-family {
    height: 20px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 60px;
    display: inline-block
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .dropdown-option .font-css {
    font-size: 15px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown,.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .family-dropdown,.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .font-size-dropdown {
    transition: all .3s ease;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    overflow-y: scroll;
    overflow-x: none;
    width: 91px;
    left: -11px;
    box-sizing: border-box;
    padding: 0;
    height: 230px;
    max-height: 230px;
    background-color: #242a30;
    border-radius: 2px;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.5);
    visibility: hidden;
    display: block;
    position: absolute;
    z-index: 100;
    list-style-type: none;
    margin: 0;
    -webkit-transform: translate3d(0,-20px,0);
    transform: translate3d(0,-20px,0);
    opacity: 0;
    cursor: pointer
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown li,.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .family-dropdown li,.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .font-size-dropdown li {
    box-sizing: border-box;
    font-size: 12px;
    padding: 12px;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown li.selected,.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .family-dropdown li.selected,.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .font-size-dropdown li.selected {
    background: #48576a
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .family-dropdown {
    height: 72px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .font-size-dropdown {
    width: 45px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .family-dropdown.active,.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .font-size-dropdown.active {
    visibility: visible!important;
    transition-property: opacity,-webkit-transform;
    transition-property: opacity,transform;
    transition-property: opacity,transform,-webkit-transform;
    transition-duration: .3s;
    transition-timing-function: ease;
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown {
    height: 99px;
    width: 58px;
    display: flex;
    padding: 0;
    overflow: hidden;
    background-color: #242a30;
    border-radius: 2px;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.5);
    visibility: hidden;
    position: absolute;
    z-index: 100;
    list-style-type: none;
    flex-direction: column;
    margin: 0;
    cursor: pointer;
    overflow: unset;
    left: -23px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown .color-model {
    height: 50%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 36.3px;
    margin: 0 auto;
    cursor: pointer
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown .color-model .iconfont {
    display: block;
    color: #bfcbd8;
    font-size: 18px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown .font-color {
    border-bottom: .5px solid #484d52
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown span.optional-color {
    width: 19px;
    height: 19px;
    margin: 2px;
    border-radius: 2px;
    position: relative
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown span.optional-color.plus {
    border: 1px dashed #ccc;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .color-dropdown span.optional-color.plus:after {
    content: "+";
    font-size: 18px;
    position: absolute;
    line-height: 0;
    left: 3.5px;
    top: 8px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .iconfont {
    display: none
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .edittext {
    transition: all .15s linear;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    display: inline-block
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .edittext.icon-edit {
    vertical-align: -1.5px;
    margin-right: 3px;
    font-size: 13px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown .active-align {
    display: block
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .pc-edittext {
    vertical-align: 4px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .pc-dropdown:hover {
    opacity: 1
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .pc-dropdown .color-dropdown li:hover,.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .pc-dropdown .family-dropdown li:hover,.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .pc-dropdown .font-size-dropdown li:hover {
    transition: all .3s ease;
    background: #48576a
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .function-box .dropdown-fontSize {
    font-size: 15px;
    padding: 16px 13px
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .dropdown.active {
    opacity: 1
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .dropdown.active .edittext {
    transition: all .15s linear;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .model,.bizcard-template_model_box[data-v-ce33da32] .display-model .model1 {
    margin: 0 auto;
    background: #fff;
    position: relative;
    height: 100%;
    width: 100%;
    box-sizing: border-box
}

.bizcard-template_model_box[data-v-ce33da32] .display-model .model-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    box-shadow: 0 0 40px 0 rgba(0,0,0,.15)
}

.bizcard-template_model_box[data-v-ce33da32] .bleeding-line-plane {
    width: 100%;
    height: 100%;
    position: absolute;
    border-color: hsla(0,0%,100%,.5);
    border-style: solid;
    pointer-events: none;
    background: none;
    top: 0;
    left: 0;
    z-index: 11;
    box-sizing: content-box
}

.bizcard-template_model_box[data-v-ce33da32] .bleeding-line-plane:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    border: 1px dashed #333;
    width: 100%;
    height: 100%;
    box-sizing: border-box
}

.card[data-v-ce33da32] {
    position: relative;
    background: #eef2f6;
    width: calc(100% - 280px);
    overflow: hidden;
    display: inline-block
}

.card-print-show[data-v-ce33da32] {
    width: calc(100% - 600px);
    transition: all .3s ease-in-out
}

.card-print-show .layout1-model-box[data-v-ce33da32],.card-print-show .template_model_box[data-v-ce33da32] {
    -webkit-transform: scale(.8);
    transform: scale(.8);
    width: 94%!important;
    margin: 0;
    transition: all .3s ease-in-out
}

.card-r[data-v-ce33da32] {
    overflow: hidden
}

.card-r .btn-list[data-v-ce33da32] {
    box-shadow: 0 3px 11px rgba(71,80,89,.2);
    position: relative;
    height: 74px;
    padding: 17px 0 16px;
    display: flex;
    justify-content: center;
    align-items: center
}

.card-r .btn-list button[data-v-ce33da32] {
    padding: 10px 35px;
    line-height: 20px
}

.card-r .btn-list button .iconfont[data-v-ce33da32] {
    font-size: 14px;
    margin-left: 5px
}

.card-r .btn-list[data-v-ce33da32]:before {
    content: "";
    position: absolute;
    height: .5px;
    width: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.05);
    -webkit-transform: scaleY(.5);
    transform: scaleY(.5)
}

.delete_tit[data-v-ce33da32] {
    font-size: 28px;
    font-weight: 600;
    line-height: 1
}

.delete_info[data-v-ce33da32],.delete_tit[data-v-ce33da32] {
    text-align: center;
    width: 100%;
    font-family: PingFangSC;
    color: #1f2d3d
}

.delete_info[data-v-ce33da32] {
    padding: 15px 0;
    font-size: 16px
}

.delete_info img[data-v-ce33da32] {
    width: 72px;
    height: 88px;
    margin: 31px 0
}

p.S_ShareAndGetFreeLogo[data-v-2634ef4a] {
    display: none;
    padding: 10px;
    background: #fff;
    box-sizing: border-box;
    left: -160px;
    width: 300px;
    position: absolute;
    font-size: 12px;
    color: #333;
    border: 1px solid #d1d9e5;
    z-index: 1;
    border-radius: 2px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.12),0 0 6px 0 rgba(0,0,0,.04);
    font-family: Helvetica Neue,PingFang SC,Microsoft YaHei!important;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    top: 36px;
    bottom: unset;
    line-height: 20px;
    text-align: left;
    font-weight: 400
}

p.S_ShareAndGetFreeLogo.t[data-v-2634ef4a] {
    bottom: 10px
}

p.S_ShareAndGetFreeLogo .zan[data-v-2634ef4a] {
    font-size: 22px
}

p.S_ShareAndGetFreeLogo .ShareAndGetFreeLogo-icon[data-v-2634ef4a] {
    position: absolute;
    top: -5px;
    width: 11px;
    height: 6px;
    bottom: unset;
    left: 0;
    right: -40px;
    margin: auto;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.useBook[data-v-2634ef4a] {
    position: relative;
    color: #888
}

.useBook:hover .S_ShareAndGetFreeLogo[data-v-2634ef4a] {
    display: block
}

@media screen and (max-width:768px) {
    .useBook span[data-v-2634ef4a] {
        display: none
    }

    p.S_ShareAndGetFreeLogo[data-v-2634ef4a] {
        right: -10px;
        left: unset
    }

    p.S_ShareAndGetFreeLogo .ShareAndGetFreeLogo-icon[data-v-2634ef4a] {
        left: unset;
        right: 13px
    }
}

.panel-top button:first-child i.el-icon-caret-top[data-v-2634ef4a] {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: -15px;
    color: #e8f3fd;
    display: none
}

.panel-top button:nth-child(2) i.el-icon-caret-top[data-v-2634ef4a] {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: -14px;
    color: #e8f3fd;
    display: none
}

.panel-top button:nth-child(3) i.el-icon-caret-top[data-v-2634ef4a] {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: -17px;
    color: #e8f3fd;
    display: none
}

.panel-top button:nth-child(4) i.el-icon-caret-top[data-v-2634ef4a] {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: -14px;
    color: #e8f3fd;
    display: none
}

.panel-top button:first-child i.el-icon-caret-top.active[data-v-2634ef4a],.panel-top button:nth-child(2) i.el-icon-caret-top.active[data-v-2634ef4a],.panel-top button:nth-child(3) i.el-icon-caret-top.active[data-v-2634ef4a],.panel-top button:nth-child(4) i.el-icon-caret-top.active[data-v-2634ef4a] {
    display: block
}

.panel-top button:nth-child(3) img[data-v-2634ef4a] {
    width: 15px;
    height: 16px;
    vertical-align: -2px;
    margin: 0 4px 0 0
}

.panel-top button:first-child img[data-v-2634ef4a] {
    width: 14px;
    height: 16px;
    vertical-align: -4px;
    margin: 0 4px 0 0
}

.panel-top .edit-tab-icon[data-v-2634ef4a] {
    width: 18px;
    height: 20px;
    vertical-align: -5px;
    margin: 0 4px 0 0
}

.row-bg[data-v-2634ef4a] {
    padding: 10px 0;
    font-size: 12.5px;
    font-weight: 500;
    margin-bottom: 40px
}

.row-bg .step-tips[data-v-2634ef4a] {
    background: #e8f3fd;
    position: absolute;
    top: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    width: 100%;
    left: 0
}

.row-bg .step-tips span[data-v-2634ef4a] {
    font-weight: 700
}

.row-bg .overNone[data-v-2634ef4a] {
    width: 100%;
    height: 40px;
    overflow: hidden
}

.row-bg .moveParent[data-v-2634ef4a] {
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
    transition: all .5s
}

.row-bg .moveBottom[data-v-2634ef4a],.row-bg .moveTop[data-v-2634ef4a] {
    width: 100%;
    text-align: center
}

.row-bg .panel-top[data-v-2634ef4a] {
    white-space: nowrap
}

.row-bg .panel-top .el-button[data-v-2634ef4a] {
    border: none;
    color: #59606d;
    padding: 10px 15px;
    position: relative
}

.row-bg .panel-top .el-button--primary[data-v-2634ef4a] {
    color: #fff
}

.row-bg .panel-top .el-button--default[data-v-2634ef4a]:hover {
    background-color: #f5f5f5;
    color: #000
}

.row-bg .panel-top .el-button--default[data-v-2634ef4a]:focus {
    color: #000
}

.row-bg .panel-top .row-padding-fiv[data-v-2634ef4a] {
    padding: 5px 0
}

@media only screen and (max-width:600px) {
    .panel-top[data-v-2634ef4a]:before {
        display: none
    }

    .panel-top .el-button[data-v-2634ef4a] {
        margin-left: 0;
        font-size: 12px
    }
}

.addBtn[data-v-729df404] {
    width: 100%;
    height: 36px;
    position: absolute;
    z-index: 1000;
    left: 0;
    top: 0;
    font-size: 24px;
    line-height: 30px;
    cursor: pointer
}

p.S_ShareAndGetFreeLogo[data-v-729df404] {
    display: none;
    padding: 10px;
    background: #fff;
    left: unset;
    right: 0;
    width: 180px;
    position: absolute;
    font-size: 12px;
    color: #333;
    border: 1px solid #d1d9e5;
    z-index: 1;
    border-radius: 2px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.12),0 0 6px 0 rgba(0,0,0,.04);
    font-family: Helvetica Neue,PingFang SC,Microsoft YaHei!important;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    bottom: unset;
    top: 65px;
    line-height: 20px;
    text-align: center
}

p.S_ShareAndGetFreeLogo.t[data-v-729df404] {
    bottom: 10px
}

p.S_ShareAndGetFreeLogo .zan[data-v-729df404] {
    font-size: 22px
}

p.S_ShareAndGetFreeLogo .queen[data-v-729df404] {
    width: 18px;
    height: auto;
    float: left;
    margin: 0
}

p.S_ShareAndGetFreeLogo b[data-v-729df404] {
    margin-left: 5px
}

p.S_ShareAndGetFreeLogo .ShareAndGetFreeLogo-icon[data-v-729df404] {
    position: absolute;
    top: -6px;
    width: 11px;
    height: 6px;
    left: 28px;
    right: unset;
    margin: auto;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

#smallCopyright[data-v-729df404] {
    line-height: 26px;
    text-align: center;
    background: rgba(0,132,233,.5);
    position: absolute;
    right: -7px;
    top: -2px;
    color: #fff;
    font-size: 14px;
    z-index: 100;
    padding: 3px;
    cursor: pointer
}

#smallCopyright img[data-v-729df404] {
    width: 12px;
    height: auto;
    float: left
}

.symbol-area[data-v-729df404] {
    display: flex;
    flex-direction: column
}

.symbol-area .symbol-search[data-v-729df404] {
    justify-content: center;
    width: 100%;
    align-content: center;
    padding: 10px;
    align-items: center;
    font-size: 0;
    box-sizing: border-box
}

.symbol-area .symbol-search .symbol-input[data-v-729df404] {
    max-width: 900px
}

.symbol-area .symbol-search .symbol-input .prepend-wrapper[data-v-729df404] {
    display: flex;
    height: 100%
}

.symbol-area .symbol-search .symbol-input .prepend-wrapper .el-select[data-v-729df404] {
    display: inline-block;
    width: 50%;
    margin: 0
}

.symbol-area .symbol-search .symbol-input .symbols[data-v-729df404] {
    display: flex;
    flex-direction: row;
    text-align: center;
    justify-content: center;
    font-size: 0
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol[data-v-729df404] {
    width: 40px;
    height: 40px;
    border: 2px dashed #ccd1d6;
    display: inline-block;
    margin: 0 5px;
    border-radius: 12px;
    transition: all .3s ease-out;
    -webkit-transform: scale(.8);
    transform: scale(.8)
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol.filled[data-v-729df404] {
    background: #fff;
    border: none;
    box-shadow: 0 1px 2px rgba(0,0,0,.15);
    -webkit-transform: scale(1);
    transform: scale(1);
    padding: 5px
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol.select[data-v-729df404] {
    border: 2px solid #1485ff
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol img[data-v-729df404] {
    width: 100%;
    height: 100%;
    display: block
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol img[data-v-729df404]:hover {
    cursor: pointer;
    opacity: .2
}

.symbol-area .symbol-search .el-input[data-v-729df404],.symbol-area .symbol-search .el-select[data-v-729df404] {
    width: 73px
}

.symbol-area .symbol-search .el-input[data-v-729df404] .el-input .el-input__inner,.symbol-area .symbol-search .el-select[data-v-729df404] .el-input .el-input__inner {
    border-radius: 0
}

.symbol-area .symbol-search .el-input[data-v-729df404]:after,.symbol-area .symbol-search .el-select[data-v-729df404]:after {
    content: attr(after-content);
    font-size: 12px;
    color: #a3aab3;
    line-height: 30px
}

.symbol-area .symbol-search .el-input+.el-select[data-v-729df404] .el-input__inner,.symbol-area .symbol-search .el-select+.el-select[data-v-729df404] .el-input__inner {
    border-left-width: 0
}

.grid-cell[data-v-729df404] {
    display: inline-block;
    padding: 26px
}

.symbol-results[data-v-729df404] {
    display: flex;
    overflow-x: auto;
    margin-top: 15px;
    text-align: center
}

.showcontainer[data-v-729df404] {
    width: 100%;
    height: 80px
}

.grid-cell-bg img[data-v-729df404] {
    cursor: pointer
}

@media screen and (min-width:600px) {
    .el-radio-group[data-v-729df404] {
        margin-right: 20px
    }
}

@media screen and (max-width:600px) {
    .el-radio-group[data-v-729df404] {
        margin-bottom: 10px
    }
}

.transparent-color[data-v-67dcb39c] {
    background: url(/img/transparent_bg.png);
    background-size: 100%;
    border: 1px solid #e6e6e6;
    width: 19px;
    height: 19px;
    margin-left: -1px;
    margin-right: 0
}

.co-color-selected[data-v-67dcb39c] {
    display: flex;
    align-items: center;
    padding: 10px
}

.co-color-selected .top[data-v-67dcb39c] {
    padding: 0 10px
}

.co-color-selected .top>.wrapper>span[data-v-67dcb39c],.co-color-selected .top>span>span[data-v-67dcb39c] {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin: 5px 8px;
    border: 1px solid #fff;
    cursor: pointer;
    box-shadow: 1px 1px 3px rgba(0,0,0,.5);
    overflow: hidden
}

.co-color-selected .top .active[data-v-67dcb39c] {
    box-shadow: 0 0 0 3px #1485ff
}

.co-color-selected .top[data-v-67dcb39c]:after {
    content: attr(after-text);
    display: block;
    text-align: center;
    font-size: 12px;
    color: #bdbdbd
}

.co-color-selected .reverse-btn[data-v-67dcb39c] {
    margin-right: 15px
}

.custom-color-picker[data-v-67dcb39c] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-right: 40px
}

.custom-color-picker .el-color-picker .el-color-picker__trigger[data-v-67dcb39c] {
    padding: 6px 14px
}

.custom-color-picker .text-intro[data-v-67dcb39c] {
    text-align: center;
    font-size: 12px;
    color: #bdbdbd;
    padding-top: 2px
}

span.optional-color[data-v-67dcb39c] {
    display: inline-block;
    width: 21px;
    height: 21px;
    margin: 2px;
    border-radius: 2px;
    position: relative
}

span.optional-color.plus[data-v-67dcb39c] {
    border: 1px dashed #ccc;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer
}

span.optional-color.plus[data-v-67dcb39c]:after {
    content: "+";
    font-size: 18px;
    position: absolute;
    line-height: 0;
    left: 3.5px;
    top: 8px
}

span.optional-color[data-v-67dcb39c]:hover {
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
}

.icon-tip .tip-name[data-v-67dcb39c] {
    float: left;
    line-height: 45px;
    font-size: 16px;
    margin-right: 10px
}

.icon-tip .tip-color[data-v-67dcb39c] {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin: 5px 4px;
    cursor: pointer;
    overflow: hidden
}

@media only screen and (max-width:600px) {
    .icon-tip .tip-color[data-v-67dcb39c] {
        margin: 5px
    }
}

.icon-tip .tip-color[data-v-67dcb39c]:hover {
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
}

@media only screen and (max-width:600px) {
    .co-color-selected[data-v-67dcb39c] {
        flex-direction: column
    }

    .co-color-selected .reverse-btn[data-v-67dcb39c] {
        margin-right: 0
    }

    .co-color-selected .top .wrapper[data-v-67dcb39c] {
        white-space: nowrap;
        overflow: auto;
        width: 100vw
    }
}

@media screen and (max-width:758px) {
    .co-color-selected[data-v-67dcb39c] {
        width: 100vw;
        overflow: hidden
    }
}

.vc-chrome {
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 0 2px rgba(0,0,0,.3),0 4px 8px rgba(0,0,0,.3);
    box-sizing: initial;
    width: 225px;
    font-family: Menlo;
    background-color: #fff
}

.vc-chrome-controls {
    display: flex
}

.vc-chrome-color-wrap {
    position: relative;
    width: 36px
}

.vc-chrome-active-color {
    position: relative;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    overflow: hidden;
    z-index: 1
}

.vc-chrome-color-wrap .vc-checkerboard {
    width: 30px;
    height: 30px;
    border-radius: 15px;
    background-size: auto
}

.vc-chrome-sliders {
    flex: 1
}

.vc-chrome-fields-wrap {
    display: flex;
    padding-top: 16px
}

.vc-chrome-fields {
    display: flex;
    margin-left: -6px;
    flex: 1
}

.vc-chrome-field {
    padding-left: 6px;
    width: 100%
}

.vc-chrome-toggle-btn {
    width: 32px;
    text-align: right;
    position: relative
}

.vc-chrome-toggle-icon {
    margin-right: -4px;
    margin-top: 12px;
    cursor: pointer;
    position: relative;
    z-index: 2
}

.vc-chrome-toggle-icon-highlight {
    position: absolute;
    width: 24px;
    height: 28px;
    background: #eee;
    border-radius: 4px;
    top: 10px;
    left: 12px
}

.vc-chrome-hue-wrap {
    margin-bottom: 8px
}

.vc-chrome-alpha-wrap,.vc-chrome-hue-wrap {
    position: relative;
    height: 10px
}

.vc-chrome-alpha-wrap .vc-alpha-gradient,.vc-chrome-hue-wrap .vc-hue {
    border-radius: 2px
}

.vc-chrome-alpha-wrap .vc-alpha-picker,.vc-chrome-hue-wrap .vc-hue-picker {
    width: 12px;
    height: 12px;
    border-radius: 6px;
    -webkit-transform: translate(-6px,-2px);
    transform: translate(-6px,-2px);
    background-color: #f8f8f8;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.37)
}

.vc-chrome-body {
    padding: 16px 16px 12px;
    background-color: #fff
}

.vc-chrome-saturation-wrap {
    width: 100%;
    padding-bottom: 55%;
    position: relative;
    border-radius: 2px 2px 0 0;
    overflow: hidden
}

.vc-chrome-saturation-wrap .vc-saturation-circle {
    width: 12px;
    height: 12px
}

.vc-chrome-fields .vc-input__input {
    font-size: 11px;
    color: #333;
    width: 100%;
    border-radius: 2px;
    border: none;
    box-shadow: inset 0 0 0 1px #dadada;
    height: 21px;
    text-align: center
}

.vc-chrome-fields .vc-input__label {
    text-transform: uppercase;
    font-size: 11px;
    line-height: 11px;
    color: #969696;
    text-align: center;
    display: block;
    margin-top: 12px
}

.vc-chrome__disable-alpha .vc-chrome-active-color {
    width: 18px;
    height: 18px
}

.vc-chrome__disable-alpha .vc-chrome-color-wrap {
    width: 30px
}

.vc-chrome__disable-alpha .vc-chrome-hue-wrap {
    margin-top: 4px;
    margin-bottom: 4px
}

.vc-editable-input {
    position: relative
}

.vc-input__input {
    padding: 0;
    border: 0;
    outline: none
}

.vc-input__label {
    text-transform: capitalize
}

.radio-gp[data-v-655bc440] {
    width: 238px;
    background: #e8e8e8;
    height: 35px;
    padding: 3px;
    margin: 8px auto 6px;
    font-size: 12px
}

.radio-gp .type-btn[data-v-655bc440],.radio-gp[data-v-655bc440] {
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center
}

.radio-gp .type-btn[data-v-655bc440] {
    width: 50%;
    height: 100%;
    color: #a3aab3;
    cursor: pointer
}

.radio-gp .type-btn[data-v-655bc440]:hover {
    color: #3f8aef
}

.radio-gp .type-btn.actived[data-v-655bc440] {
    background: #fff;
    color: #3f8aef
}

@media screen and (min-width:1120px) {
    .radio-gp[data-v-655bc440] {
        height: 50px;
        font-size: 16px;
        margin: 0 auto
    }
}

.panel-fix.mslide .container.abstop .row-wrapper.forslogan[data-v-b696f426] {
    width: 100%!important;
    marign-right: 0!important
}

.panel-fix.mslide .container.abstop[data-v-b696f426] {
    padding: 10px 0 0!important
}

.panel-fix.mslide .container.abstop[data-v-b696f426]:nth-child(2) {
    margin-top: -18px!important
}

.panel-fix.mslide .container.abstop .row-wrapper.forslogan[data-v-b696f426] {
    margin-right: 0!important
}

.panel-fix.mslide .container.abstop .row-wrapper.forlogoname .el-input--name[data-v-b696f426],.panel-fix.mslide .container.abstop .row-wrapper.forslogan .el-input--slogan[data-v-b696f426] {
    width: calc(100% - 57px)!important
}

.panel-fix.mslide[data-v-b696f426] {
    padding: 0 15px
}

.panel-fix.mslide.container.abstop[data-v-b696f426] {
    padding: 10px 0 0!important
}

.panel-fix.mslide.container.abstop .row-wrapper.forslogan[data-v-b696f426] {
    width: 100%!important;
    margin-right: 0!important
}

.panel-fix .container[data-v-b696f426] {
    overflow: auto;
    max-width: 100vw;
    padding: 5px
}

.panel-fix .container.abstop[data-v-b696f426] {
    padding: 10px 30px 0
}

.panel-fix .container.abstop .row-wrapper[data-v-b696f426] {
    width: 100%;
    margin: 5px 0
}

.panel-fix .container.abstop .row-wrapper.forslogan[data-v-b696f426] {
    width: 332px
}

.panel-fix .container.abstop .row-wrapper .el-input--name.nolinespace[data-v-b696f426],.panel-fix .container.abstop .row-wrapper .el-input--name[data-v-b696f426],.panel-fix .container.abstop .row-wrapper .el-input--slogan[data-v-b696f426] {
    width: 100%
}

@media screen and (min-width:768px) {
    .panel-fix .container[data-v-b696f426] {
        padding: 5px
    }

    .panel-fix .container.abstop .row-wrapper[data-v-b696f426] {
        width: 48%
    }
}

@media screen and (max-width:600px) {
    .panel-fix[data-v-b696f426] {
        align-items: center;
        flex-direction: column
    }

    .panel-fix .container.abstop[data-v-b696f426] {
        width: 100%
    }
}

@media screen and (min-width:375px) {
    .panel-fix .container.abstop .row-wrapper.forslogan[data-v-b696f426] {
        width: 388px
    }
}

@media screen and (min-width:414px) {
    .panel-fix .container.abstop .row-wrapper.forslogan[data-v-b696f426] {
        width: 427px
    }
}

.font-edit .font {
    display: flex;
    align-items: center;
    height: 42px;
    width: 110px;
    text-align: center;
    line-height: 42px
}

.font-edit .font>svg {
    fill: #666;
    width: 90px;
    margin: auto;
    height: 38px
}

.font-edit .font:hover {
    border: 2px solid #666;
    border-radius: 5px
}

.font-edit .font.active {
    border: 2px solid #1485ff;
    border-radius: 5px
}

.font-edit .font.active>svg {
    fill: #1485ff
}

@media only screen and (min-width:600px) {
    .scroll_row[data-v-655bc440] {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        overflow-x: auto
    }

    .scroll_row .el-radio-group[data-v-655bc440] {
        display: flex;
        justify-content: center;
        margin-left: 40px
    }

    .scroll_row .item[data-v-655bc440] {
        display: flex;
        flex-direction: row;
        font-weight: 500;
        align-items: center
    }

    .scroll_row .item span[data-v-655bc440] {
        padding: 10px
    }

    .scroll_row .item span[data-v-655bc440]:first-child {
        margin-left: 10px
    }

    .scroll_row .item span[data-v-655bc440]:last-child {
        margin-right: 40px
    }

    .scroll_row .item span .font-images[data-v-655bc440] {
        display: block
    }

    .scroll_row .item span .font-images[data-v-655bc440]:hover {
        cursor: pointer;
        color: #00aeef
    }

    .box[data-v-655bc440] {
        width: 400px
    }

    .box .bottom[data-v-655bc440] {
        clear: both;
        text-align: center
    }

    .box .item[data-v-655bc440] {
        margin: 4px
    }

    .box .left .el-tooltip__popper[data-v-655bc440],.box .right .el-tooltip__popper[data-v-655bc440] {
        padding: 8px 10px
    }
}

@media only screen and (max-width:600px) {
    .el-radio-button__inner[data-v-655bc440] {
        padding: 5px 10px!important
    }

    .scroll_row[data-v-655bc440] {
        display: flex;
        align-items: center;
        flex-direction: column;
        width: 100%
    }

    .scroll_row .el-radio-group[data-v-655bc440] {
        display: flex;
        justify-content: center
    }

    .scroll_row .item[data-v-655bc440] {
        width: 100%;
        overflow: auto;
        white-space: nowrap
    }

    .scroll_row .item span[data-v-655bc440] {
        display: inline-flex;
        flex-wrap: nowrap;
        flex-direction: row;
        overflow-x: auto;
        padding: 10px
    }

    .scroll_row .item span[data-v-655bc440]:first-child {
        margin-left: 10px
    }

    .scroll_row .item span[data-v-655bc440]:last-child {
        margin-right: 40px
    }

    .scroll_row .item span .font-images[data-v-655bc440] {
        padding: 5px 10px
    }

    .scroll_row .item span .font-images[data-v-655bc440]:hover {
        cursor: pointer;
        color: #00aeef
    }

    .box[data-v-655bc440] {
        width: 400px
    }

    .box .bottom[data-v-655bc440] {
        clear: both;
        text-align: center
    }

    .box .item[data-v-655bc440] {
        margin: 4px
    }

    .box .left .el-tooltip__popper[data-v-655bc440],.box .right .el-tooltip__popper[data-v-655bc440] {
        padding: 8px 10px
    }
}

.mobile-slide {
    background: #fff;
    border: 1px solid #bfcbd9;
    border-top: 0;
    display: flex;
    justify-content: center;
    position: absolute;
    z-index: 999999999;
    left: 20%
}

.mslide-input {
    width: 75px!important;
    height: 36px;
    border: 1px solid #bfcbd9;
    border-left: 0;
    display: flex;
    align-items: center;
    justify-content: space-around;
    position: relative;
    font-size: 12px;
    color: #333
}

.mslide-input[disabled=disabled] {
    background: #e0e0e0;
    color: #9d9b9b
}

.mslide-input .iconfont {
    font-size: 13px;
    color: #bbb
}

.mslide-input:after {
    content: attr(after-content);
    font-size: 12px;
    color: #a3aab3;
    line-height: 20px;
    width: 100%;
    position: absolute;
    bottom: -20px
}

.logonameInput .el-input__inner {
    font-weight: 700!important
}

.row-wrapper {
    display: inline-flex;
    align-items: flex-start;
    margin: 5px
}

.row-wrapper>*+* .el-input__inner {
    border-left-width: 0
}

.row-wrapper .el-input .el-input__inner {
    display: block
}

.row-wrapper .el-select {
    width: 73px;
    flex-shrink: 0
}

.row-wrapper .el-select .el-input .el-input__inner {
    border-radius: 0
}

.row-wrapper .slogan-spacing,.row-wrapper .text-spacing {
    width: 73px
}

.row-wrapper .el-input:after,.row-wrapper .icon-size:after,.row-wrapper .slogan-size:after,.row-wrapper .slogan-spacing:after,.row-wrapper .text-size:after,.row-wrapper .text-spacing:after {
    content: attr(after-content);
    font-size: 12px;
    color: #a3aab3;
    line-height: 20px
}

.row-wrapper .el-input .el-input__inner {
    border-radius: 0
}

@media screen and (min-width:1024px) {
    .show-in-pc {
        display: flex
    }

    .show-in-mobile {
        display: none!important
    }
}

@media screen and (max-width:1023px) {
    .show-in-pc {
        display: none!important
    }

    .show-in-mobile {
        display: flex
    }
}

.flex-text-controls .inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 990px;
    margin: 0 auto;
    padding: 15px 0
}

.flex-text-controls .inner .nameslogan {
    width: 347px
}

.flex-text-controls .inner .nameslogan .input-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-start
}

.flex-text-controls .inner .nameslogan .input-wrapper:before {
    content: attr(before-content);
    font-size: 12px;
    width: 70px;
    text-align: right;
    padding-right: 7px;
    color: #a3aab3
}

.flex-text-controls .inner .nameslogan .input-wrapper:first-child {
    margin-bottom: 10px
}

.flex-text-controls .inner .nameslogan .input-wrapper .el-input--name {
    width: 273px
}

.flex-text-controls .inner .nameslogan .input-wrapper .el-input--slogan {
    width: 269px
}

.flex-text-controls .inner .nameslogan .input-wrapper .el-input-group__append {
    padding: 0
}

.flex-text-controls .inner .nameslogan .input-wrapper .el-input-group__append .icons {
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px
}

.flex-text-controls .inner .nameslogan .input-wrapper .el-input-group__append .icons.disabled {
    background: #edf1f6
}

.flex-text-controls .inner .nameslogan .input-wrapper .el-input-group__append .icons.disabled .iconfont {
    cursor: default
}

.flex-text-controls .inner .nameslogan .input-wrapper .el-input-group__append .icons.disabled .iconfont:hover {
    color: #97a8be
}

.flex-text-controls .inner .nameslogan .input-wrapper .el-input-group__append .icons .iconfont {
    cursor: pointer;
    margin: 0 3px
}

.flex-text-controls .inner .nameslogan .input-wrapper .el-input-group__append .icons .iconfont:hover {
    color: #6881a1
}

.flex-text-controls .inner .sizespace {
    width: calc(100% - 367px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap
}

.flex-text-controls .inner .sizespace.nolinespace .item {
    width: 47%
}

.flex-text-controls .inner .sizespace .item {
    width: 32%
}

.flex-text-controls .inner .sizespace .block-inner {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

.flex-text-controls .inner .sizespace .block-inner.mb {
    margin-bottom: 10px
}

.flex-text-controls .inner .sizespace .block-inner.en:before {
    width: 100px
}

.flex-text-controls .inner .sizespace .block-inner:before {
    content: attr(before-content);
    font-size: 12px;
    width: 30px;
    text-align: right;
    padding-right: 7px;
    color: #a3aab3
}

.flex-text-controls .inner .sizespace .block-inner .el-slider {
    width: calc(100% - 30px)
}

.e-i-input[data-v-0f3d46fa] {
    width: 160px;
    font-weight: 500
}

.e-i-input .el-input__inner[data-v-0f3d46fa] {
    font-weight: 500
}

.input-wrapper[data-v-0f3d46fa] {
    margin-right: -1px;
    z-index: 1
}

@media screen and (max-width:768px) {
    .e-i-input .el-input__inner[data-v-0f3d46fa] {
        font-weight: 500
    }
}

.icon[data-v-0f3d46fa] {
    width: 1em;
    height: 1em;
    vertical-align: -.15em;
    fill: currentColor;
    overflow: hidden
}

.s-n-group[data-v-0f3d46fa] {
    display: flex
}

.s-n-group .e-f-drop[data-v-0f3d46fa] {
    position: relative;
    display: flex;
    justify-content: center;
    width: 98px;
    height: 44px;
    margin-right: -1px;
    border: 1px solid rgba(52,53,56,.1);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    transition: all .2s ease-out;
    background-color: hsla(0,0%,96%,.8)
}

.s-n-group .e-f-drop:not(.disabled).onac[data-v-0f3d46fa],.s-n-group .e-f-drop[data-v-0f3d46fa]:not(.disabled):focus,.s-n-group .e-f-drop[data-v-0f3d46fa]:not(.disabled):hover {
    border-color: #20a0ff;
    z-index: 1
}

.s-n-group .e-f-drop.disabled[data-v-0f3d46fa] {
    border-color: rgba(52,53,56,.05)
}

.s-n-group .e-f-drop.disabled .el-dropdown[data-v-0f3d46fa] {
    cursor: not-allowed
}

.s-n-group .e-f-drop.disabled .el-dropdown .el-dropdown-link .el-t-c[data-v-0f3d46fa],.s-n-group .e-f-drop.disabled .el-dropdown .el-dropdown-link[data-v-0f3d46fa] {
    color: rgba(52,53,56,.2)
}

.s-n-group .e-f-drop .el-dropdown[data-v-0f3d46fa] {
    flex: 1;
    display: flex;
    color: #475669;
    cursor: pointer
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link[data-v-0f3d46fa] {
    display: flex;
    flex: 1;
    justify-content: space-between;
    align-items: center;
    padding: 0 4px 0 6px
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .el-t-c[data-v-0f3d46fa] {
    display: inline-block;
    height: 14px;
    color: #475669;
    flex: 1
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .iconfont[data-v-0f3d46fa] {
    font-size: 12px;
    display: inline-block;
    width: 20px;
    height: 13px;
    -webkit-transform: rotate(0deg) scale(.6);
    transform: rotate(0deg) scale(.6);
    transition: all .2s ease-out
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .iconfont.onac[data-v-0f3d46fa] {
    -webkit-transform: scale(.6);
    transform: scale(.6);
    -webkit-transform: rotate(180deg) scale(.6);
    transform: rotate(180deg) scale(.6)
}

.s-n-group .s-n-btn[data-v-0f3d46fa] {
    width: 50px;
    height: 44px;
    border-radius: 4px;
    border: 1px solid rgba(52,53,56,.1);
    font-family: PingFangSC,inherit;
    font-size: 12px;
    color: #475669;
    text-align: center;
    transition: all .2s ease-out;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 0;
    position: relative;
    background-color: hsla(0,0%,96%,.8)
}

.s-n-group .s-n-btn.is-plain[data-v-0f3d46fa] {
    border-color: rgba(52,53,56,.1)
}

.s-n-group .s-n-btn.is-disabled.is-plain[data-v-0f3d46fa] {
    border-color: rgba(52,53,56,.05);
    color: rgba(52,53,56,.2)
}

.s-n-group .s-n-btn[data-v-0f3d46fa]:not(.is-disabled):focus,.s-n-group .s-n-btn[data-v-0f3d46fa]:not(.is-disabled):hover {
    border-color: #20a0ff;
    color: #20a0ff
}

.s-n-group .s-n-btn.s-size[data-v-0f3d46fa] {
    margin-right: -1px;
    border-radius: 0
}

.s-n-group .s-n-btn.s-size[data-v-0f3d46fa]:focus,.s-n-group .s-n-btn.s-size[data-v-0f3d46fa]:hover {
    z-index: 1
}

.s-n-group .s-n-btn.s-size .icon-zihao1[data-v-0f3d46fa] {
    font-size: 12px
}

.s-n-group .s-n-btn.s-spacing[data-v-0f3d46fa] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.s-n-group .s-n-btn.s-linespacing[data-v-0f3d46fa] {
    width: 42px;
    height: 34px;
    background-color: #fff
}

:lang(zh-CN) .s-n-btn.s-size[data-v-0f3d46fa],:lang(zh-CN) .s-n-btn.s-spacing[data-v-0f3d46fa] {
    width: 60px;
    font-size: 12px;
    font-weight: 600
}

.sli-title[data-v-0f3d46fa] {
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.2px;
    color: rgba(52,53,56,.5);
    margin-bottom: 2px
}

.pos-wrapper[data-v-0f3d46fa] {
    width: 150px;
    min-width: 150px;
    flex-wrap: wrap;
    justify-content: center;
    margin-right: 20px
}

.pos-wrapper.disabled .pos span[data-v-0f3d46fa] {
    cursor: not-allowed
}

.pos-wrapper .pos[data-v-0f3d46fa] {
    height: 34px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    width: 100%
}

.pos-wrapper .pos span[data-v-0f3d46fa] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #c3c3c3;
    cursor: pointer;
    border: 1px solid rgba(52,53,56,.1);
    background-color: #fff;
    border-left: 0;
    transition: all .2s ease-out
}

.pos-wrapper .pos span[data-v-0f3d46fa]:first-child {
    border-left: 1px solid rgba(52,53,56,.1);
    border-radius: 4px 0 0 4px
}

.pos-wrapper .pos span[data-v-0f3d46fa]:last-child {
    border-radius: 0 4px 4px 0
}

.pos-wrapper .pos span[data-v-0f3d46fa]:hover {
    color: #20a0ff
}

.pos-wrapper .pos span.actived[data-v-0f3d46fa] {
    color: #fff;
    background-color: #20a0ff;
    border-color: #20a0ff;
    box-shadow: -1px 0 0 0 #20a0ff
}

.pos-wrapper .pos span .icon[data-v-0f3d46fa] {
    -webkit-transform: scale(1.12);
    transform: scale(1.12)
}

.i--wrapper[data-v-0f3d46fa] {
    display: flex;
    align-items: center
}

.i--pos[data-v-0f3d46fa] {
    display: flex
}

@media screen and (max-width:768px) {
    .flex-name-controls .inner[data-v-0f3d46fa] {
        flex-direction: row;
        justify-content: left;
        padding: 16px;
        overflow-x: auto
    }

    .flex-name-controls .inner .i--pos .s-n-group[data-v-0f3d46fa] {
        padding-right: 12px
    }

    .s--slide[data-v-0f3d46fa] {
        position: relative;
        height: 40px
    }

    .s--slide .pc-slide[data-v-0f3d46fa] {
        display: none
    }

    .s--slide .mobile-n-slide[data-v-0f3d46fa] {
        position: absolute;
        left: -10px;
        border: none;
        top: 5px;
        display: block
    }
}

.flex-name-controls * {
    box-sizing: border-box
}

.e-i-input {
    height: 44px
}

.e-i-input .el-input__inner {
    height: 44px;
    border: 1px solid rgba(6,8,14,.1);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    font-family: PingFangSC,inherit;
    font-size: 14px;
    color: #475669;
    transition: all .2s ease-out;
    padding: 0 12px
}

.e-i-input .el-input__inner:focus,.e-i-input .el-input__inner:hover {
    border-color: #20a0ff
}

.flex-name-controls .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 20px 0
}

.c-drop-menu {
    box-shadow: 0 10px 30px 0 rgba(0,0,0,.1);
    background-color: #fff;
    border: none;
    margin-top: 6px;
    padding: 0;
    min-width: 96px
}

.c-drop-menu .c-drop-item {
    display: flex;
    width: 96px;
    padding: 0 1px;
    align-items: center;
    color: #475669
}

.c-drop-menu .c-drop-item>span {
    display: inline-block;
    height: 16px;
    line-height: 1;
    padding: 9px
}

.c-drop-menu .c-drop-item:nth-child(2)>span {
    height: 19px
}

.c-drop-menu .c-drop-item:nth-child(3)>span {
    height: 18px
}

.c-drop-menu .c-drop-item:nth-child(5)>span {
    height: 19px
}

@media screen and (max-width:768px) {
    .e-i-input .el-input__inner {
        font-weight: 500
    }
}

.symbol-panel [data-v-b5f66cb2] {
    box-sizing: border-box
}

.pos-wrapper[data-v-b5f66cb2] {
    width: 150px;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 20px
}

.pos-wrapper .pos[data-v-b5f66cb2] {
    height: 34px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    width: 100%
}

.pos-wrapper .pos span[data-v-b5f66cb2] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #c3c3c3;
    cursor: pointer;
    border: 1px solid rgba(52,53,56,.1);
    background-color: #fff;
    border-left: 0;
    transition: all .2s ease-out
}

.pos-wrapper .pos span[data-v-b5f66cb2]:first-child {
    border-left: 1px solid rgba(52,53,56,.1);
    border-radius: 4px 0 0 4px
}

.pos-wrapper .pos span[data-v-b5f66cb2]:last-child {
    border-radius: 0 4px 4px 0
}

.pos-wrapper .pos span[data-v-b5f66cb2]:hover {
    color: #20a0ff
}

.pos-wrapper .pos span.actived[data-v-b5f66cb2] {
    color: #fff;
    background-color: #20a0ff;
    border-color: #20a0ff;
    box-shadow: -1px 0 0 0 #20a0ff
}

.pos-wrapper .pos span .icon-ziyuan20[data-v-b5f66cb2] {
    -webkit-transform: scale(.493);
    transform: scale(.493)
}

.pos-wrapper .pos span .icon-ziyuan21[data-v-b5f66cb2] {
    -webkit-transform: scale(.885);
    transform: scale(.885)
}

.pos-wrapper .pos span .icon-ziyuan19[data-v-b5f66cb2] {
    -webkit-transform: scale(.728);
    transform: scale(.728)
}

.symbol-panel-inner[data-v-b5f66cb2] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 20px 15px
}

.symbol-panel-inner .symbols-list[data-v-b5f66cb2] {
    display: flex;
    align-items: stretch;
    justify-content: flex-start
}

.symbol-panel-inner .symbols-list .favorite-symbol[data-v-b5f66cb2] {
    position: relative;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(52,53,56,.1);
    display: inline-block;
    margin: 0 6px;
    border-radius: 4px;
    transition: all .2s ease-out;
    cursor: pointer
}

.symbol-panel-inner .symbols-list .favorite-symbol[data-v-b5f66cb2]:first-child {
    margin-left: 0
}

.symbol-panel-inner .symbols-list .favorite-symbol[data-v-b5f66cb2]:last-child {
    margin-right: 0
}

.symbol-panel-inner .symbols-list .favorite-symbol.filled[data-v-b5f66cb2] {
    background: #fff;
    border: none;
    border: 1px solid rgba(52,53,56,.1);
    padding: 5px;
    display: flex;
    align-items: center;
    justify-content: center
}

.symbol-panel-inner .symbols-list .favorite-symbol.select[data-v-b5f66cb2] {
    border: 2px solid #20a0ff
}

.symbol-panel-inner .symbols-list .favorite-symbol[data-v-b5f66cb2]:not(.select):hover {
    border: 1px solid #20a0ff;
    color: #20a0ff
}

.symbol-panel-inner .symbols-list .favorite-symbol img[data-v-b5f66cb2] {
    width: 30px;
    max-height: 30px
}

.symbol-panel-inner .pos-r-w[data-v-b5f66cb2] {
    display: flex;
    align-items: center
}

.symbol-panel-inner .pos-r-w .s-n-group[data-v-b5f66cb2] {
    display: flex
}

@media screen and (min-width:1024px) {
    .symbol-panel-inner[data-v-b5f66cb2] {
        flex-direction: row;
        align-items: normal;
        padding: 20px
    }

    .symbol-panel-inner .symbols-list[data-v-b5f66cb2] {
        max-width: 430px;
        margin-right: 20px
    }
}

@media screen and (max-width:768px) {
    .symbol-panel[data-v-b5f66cb2] {
        overflow: hidden
    }

    .s-n-btn[data-v-b5f66cb2] {
        width: 76px;
        height: 35px;
        font-size: 12px;
        line-height: 33px
    }

    .symbol-panel-inner[data-v-b5f66cb2] {
        justify-content: left;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding: 16px
    }

    .symbol-panel-inner .symbols-list[data-v-b5f66cb2] {
        margin-right: 20px
    }

    .symbol-panel-inner .pos-r-w .pos-wrapper[data-v-b5f66cb2] {
        margin: 0;
        margin-right: 8px;
        width: 135px
    }

    .symbol-panel-inner .pos-r-w .pos-wrapper .pos[data-v-b5f66cb2] {
        height: 35px
    }

    .symbol-panel-inner .pos-r-w .pos-wrapper .pos .iconfont[data-v-b5f66cb2] {
        font-size: 12px
    }

    .symbol-panel-inner .pos-r-w .s-n-btn.s-size[data-v-b5f66cb2] {
        margin-left: 12px
    }

    .s--slide[data-v-b5f66cb2] {
        position: relative;
        height: 40px
    }

    .s--slide .pc-slide[data-v-b5f66cb2] {
        display: none
    }

    .s--slide .mobile-n-slide[data-v-b5f66cb2] {
        position: absolute;
        left: -10px;
        border: none;
        top: 5px;
        display: block
    }
}

.model-center[data-v-705f4904] {
    margin-top: 30px
}

.display-area-photo-design[data-v-705f4904] {
    max-width: 100%;
    height: 100%
}

.display-area-photo-design .container[data-v-705f4904] {
    max-width: 1120px;
    margin: 0 auto;
    height: 100%
}

.display-area-photo-design .model-center-close[data-v-705f4904] {
    width: 50px;
    margin-left: 30px;
    font-size: 30px;
    position: absolute;
    top: 30px;
    color: #333
}

@media screen and (max-width:768px) {
    .display-area-photo-design .model-center-close[data-v-705f4904] {
        font-size: 20px;
        margin-left: 20px;
        top: 15px;
        width: 20px;
        z-index: 100
    }
}

.display-area-photo-design .model-center-close i[data-v-705f4904] {
    color: #c0ccda;
    cursor: pointer;
    transition: all .3s ease
}

.display-area-photo-design .model-center-close i[data-v-705f4904]:hover {
    -webkit-transform: rotate(180deg) rotate(0);
    transform: rotate(180deg) rotate(0)
}

.display-area-photo-design .tag-display[data-v-705f4904] {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    height: 100px;
    position: relative
}

.display-area-photo-design .tag-display .swiper-component[data-v-705f4904] {
    width: 100%;
    height: 100%;
    position: absolute
}

.display-area-photo-design .tag-display .tag[data-v-705f4904] {
    -webkit-tap-highlight-color: transparent;
    height: 42px
}

.display-area-photo-design .tag-display .tag img[data-v-705f4904] {
    height: 100%;
    display: block
}

.display-area-photo-design .tag-display .tag-selected[data-v-705f4904],.display-area-photo-design .tag-display .tag[data-v-705f4904]:hover {
    opacity: .75
}

.display-area-photo-design .tag-display .swiper-container[data-v-705f4904] {
    width: 94%;
    height: 100%;
    margin: 0 auto;
    box-sizing: border-box
}

.display-area-photo-design .tag-display .swiper-slide[data-v-705f4904] {
    margin-right: 25px;
    cursor: pointer;
    border-radius: 4px;
    transition: all .2s ease-in;
    align-items: center;
    display: flex
}

.display-area-photo-design .tag-display .swiper-slide[data-v-705f4904]:last-child {
    margin-right: 0
}

.display-area-photo-design .picture-box[data-v-705f4904] {
    display: flex
}

.display-area-photo-design .waterFallGroup[data-v-705f4904] {
    display: block;
    padding: 15px 8px;
    width: 20%;
    box-sizing: border-box
}

@media screen and (max-width:768px) {
    .display-area-photo-design .waterFallGroup[data-v-705f4904] {
        width: 50%;
        padding: 8px 5px
    }
}

.display-area-photo-design .waterFallGroup .card[data-v-705f4904] {
    transition: all .3s ease-in;
    position: relative;
    overflow: hidden;
    font-size: 14px;
    border-radius: 7px;
    background-color: #fff;
    color: #4a4a4a;
    text-align: left
}

.display-area-photo-design .waterFallGroup .card .model-name[data-v-705f4904] {
    height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 10px 8px;
    line-height: 20px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.display-area-photo-design .waterFallGroup .card .hover-edit[data-v-705f4904] {
    transition: all .2s ease-in;
    background-color: hsla(0,0%,100%,.56);
    position: absolute;
    top: 0;
    width: 100%;
    height: calc(100% - 40px);
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.display-area-photo-design .waterFallGroup .card .hover-edit .edit-box[data-v-705f4904] {
    position: absolute;
    color: #fff;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width: 80px;
    height: 30px;
    border-radius: 14px;
    background-color: #221e1f;
    line-height: 30px;
    text-align: center
}

.display-area-photo-design .waterFallGroup .card .hover-edit .edit-box .iconfont[data-v-705f4904] {
    margin-right: 5.8px
}

.display-area-photo-design .waterFallGroup .new-card[data-v-705f4904] {
    width: 100%!important;
    height: 200px!important
}

.display-area-photo-design .waterFallGroup .new-card .edit-box[data-v-705f4904] {
    width: 100px!important
}

.display-area-photo-design .waterFallGroup .new-card .edit-box i[data-v-705f4904] {
    font-size: 10px;
    line-height: 30px;
    vertical-align: 1px
}

.display-area-photo-design .waterFallGroup .new-card .hover-edit[data-v-705f4904] {
    height: 100%
}

.display-area-photo-design .waterFallGroup .new-card[data-v-705f4904]:hover {
    box-shadow: 0 0 20px 0 rgba(0,0,0,.1)
}

.display-area-photo-design .waterFallGroup img[data-v-705f4904] {
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.display-area-photo-design .waterfallBox[data-v-705f4904] {
    display: flex;
    flex-direction: column;
    margin: 30px auto;
    width: 18.5%;
    cursor: pointer
}

.display-area-photo-design .model-display[data-v-705f4904] {
    width: 100%;
    position: relative;
    margin: 0 auto
}

@media screen and (max-width:768px) {
    .display-area-photo-design .model-display[data-v-705f4904] {
        height: calc(100% - 72px);
        overflow: scroll
    }
}

.display-area-photo-design .model-footer[data-v-705f4904] {
    position: relative;
    width: 147px;
    bottom: 0;
    left: 50%;
    height: 38px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    cursor: pointer;
    white-space: nowrap
}

.display-area-photo-design .model-footer div[data-v-705f4904] {
    border-radius: 24.5px;
    background-color: #333;
    padding: 4.5px 35px;
    line-height: 29px;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer
}

.display-area-photo-design .model-footer div i[data-v-705f4904] {
    font-size: 11px;
    margin-right: 10px;
    vertical-align: 1px
}

.display-area-photo-design .model-header[data-v-705f4904] {
    margin: 0 .7%;
    margin-bottom: 15px;
    height: 38px;
    position: relative;
    display: flex;
    align-items: stretch;
    flex-direction: row;
    justify-content: space-between
}

.display-area-photo-design .model-header .tag-name[data-v-705f4904] {
    font-size: 20px;
    font-weight: 500;
    margin: 0;
    line-height: 38px;
    color: #000
}

.display-area-photo-design .model-header .right[data-v-705f4904] {
    color: #475669
}

.display-area-photo-design .model-header .right a[data-v-705f4904] {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    line-height: 20px;
    display: inline-block;
    padding: 9px 18px;
    box-shadow: -2px 0 4px 0 rgba(0,0,35,.08);
    border-radius: 20px;
    font-size: 14px;
    background: #fff;
    cursor: pointer
}

.display-area-photo-design .model-header .right a .iconfont[data-v-705f4904] {
    font-size: 18px;
    vertical-align: -2px
}

.display-area-photo-design .model-header .right a[data-v-705f4904]:last-child {
    position: relative;
    z-index: 10
}

.display-area-photo-design .model-header .right a:last-child img[data-v-705f4904] {
    width: 18px;
    height: 18px;
    vertical-align: middle;
    margin-right: 10px;
    margin-top: -3px
}

.display-area-photo-design .model-header .right a[data-v-705f4904]:first-child,.display-area-photo-design .model-header .right a[data-v-705f4904]:nth-child(2),.display-area-photo-design .model-header .right a[data-v-705f4904]:nth-child(3) {
    padding-right: 54px;
    margin-right: -44px
}

.display-area-photo-design .model-header .right .checkedBtn[data-v-705f4904] {
    background-color: #333;
    color: #fff!important
}

.display-area-photo-design .swiper-button-next[data-v-705f4904],.display-area-photo-design .swiper-button-prev[data-v-705f4904] {
    height: 100%;
    width: 100px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-size: 100% 100%;
    top: 50%;
    margin: 0;
    font-size: 20px
}

.display-area-photo-design .swiper-button-next i[data-v-705f4904],.display-area-photo-design .swiper-button-prev i[data-v-705f4904] {
    line-height: 100px;
    color: #221e1f
}

.display-area-photo-design .swiper-button-next.swiper-button-disabled[data-v-705f4904],.display-area-photo-design .swiper-button-prev.swiper-button-disabled[data-v-705f4904] {
    opacity: 0
}

.display-area-photo-design .swiper-button-next[data-v-705f4904] {
    background-image: linear-gradient(90deg,hsla(0,0%,100%,0) 0,#eef2f6 90%)
}

.display-area-photo-design .swiper-button-next i[data-v-705f4904] {
    margin-left: 80px
}

.display-area-photo-design .swiper-button-prev[data-v-705f4904] {
    background-image: linear-gradient(270deg,hsla(0,0%,100%,0) 0,#eef2f6 90%)
}

.display-area-photo-design .swiper-button-prev i[data-v-705f4904] {
    margin-right: 80px
}

.display-area-photo-design .swiper-prev-bg[data-v-705f4904] {
    width: 82px;
    -o-object-fit: contain;
    object-fit: contain;
    background-image: linear-gradient(90deg,rgba(238,242,246,.08),rgba(238,242,246,.81))
}

@media screen and (max-width:768px) {
    .model-center[data-v-705f4904] {
        padding-top: 15px;
        box-sizing: border-box;
        margin: 0
    }

    .display-area[data-v-705f4904] {
        height: 100%!important;
        padding: 0
    }

    .display-area .container[data-v-705f4904] {
        box-sizing: border-box;
        padding: 0 15px
    }

    .display-area .tag-display[data-v-705f4904] {
        width: 100%;
        height: 81px!important
    }

    .display-area .waterfallBox[data-v-705f4904] {
        width: 48.5%;
        margin: 25px 0 0
    }

    .display-area .waterFallGroup[data-v-705f4904] {
        margin-bottom: 15px
    }

    .display-area[data-v-705f4904] {
        -webkit-tap-highlight-color: transparent
    }

    .swiper-container[data-v-705f4904] {
        overflow: hidden;
        height: 100%;
        width: 100%!important
    }

    .model-display[data-v-705f4904] {
        width: 100%!important
    }

    .model-footer[data-v-705f4904] {
        margin-bottom: 36px;
        margin-top: 15px;
        width: 150px;
        position: relative!important;
        bottom: 0!important
    }

    .model-header[data-v-705f4904] {
        margin: 0;
        width: 100%!important;
        flex-direction: column!important;
        text-align: center;
        height: 72px!important
    }

    .model-header .right a[data-v-705f4904] {
        padding-top: 8px!important;
        padding-bottom: 7px!important
    }

    .model-header .tag-name[data-v-705f4904] {
        line-height: 22px!important;
        margin-bottom: 15px!important;
        font-size: 16px!important
    }

    .swiper-button-next[data-v-705f4904] {
        z-index: 10;
        right: -12px;
        width: 20px
    }

    .swiper-button-next i[data-v-705f4904] {
        line-height: 81px
    }

    .swiper-button-prev[data-v-705f4904] {
        z-index: 10;
        left: -12px;
        width: 20px
    }

    .swiper-button-prev i[data-v-705f4904] {
        line-height: 81px
    }
}

#smallCopyright[data-v-72e873f8],.copyright[data-v-72e873f8] {
    line-height: 26px;
    text-align: center;
    background: rgba(0,132,233,.5);
    position: absolute;
    right: -10px;
    top: -8px;
    color: #fff;
    font-size: 14px;
    z-index: 100;
    padding: 3px;
    cursor: pointer
}

#smallCopyright img[data-v-72e873f8],.copyright img[data-v-72e873f8] {
    width: 14px;
    height: auto;
    float: left
}

#smallCopyright[data-v-72e873f8] {
    right: -7px;
    top: -2px;
    padding: 3px
}

#smallCopyright img[data-v-72e873f8] {
    width: 12px
}

.symbol-search-box[data-v-72e873f8] {
    max-width: 100%;
    width: 800px;
    padding: 20px 20px 56px;
    background: #fff;
    position: relative
}

.symbol-search-box .symbol-search-box-title[data-v-72e873f8] {
    font-weight: 700;
    margin: 0 0 20px;
    text-align: left;
    font-size: 16px
}

.symbol-search-box .symbols[data-v-72e873f8] {
    display: flex;
    flex-direction: row;
    text-align: center;
    justify-content: center;
    font-size: 0
}

.symbol-search-box .symbols .favorite-symbol[data-v-72e873f8] {
    width: 40px;
    height: 40px;
    border: 2px dashed #ccd1d6;
    display: inline-block;
    margin: 0 5px;
    border-radius: 12px;
    transition: all .3s ease-out;
    -webkit-transform: scale(.8);
    transform: scale(.8)
}

.symbol-search-box .symbols .favorite-symbol.filled[data-v-72e873f8] {
    background: #fff;
    border: none;
    box-shadow: 0 1px 2px rgba(0,0,0,.15);
    -webkit-transform: scale(1);
    transform: scale(1);
    padding: 5px
}

.symbol-search-box .symbols .favorite-symbol img[data-v-72e873f8] {
    max-width: 30px;
    max-height: 30px;
    height: 100%;
    width: 100%;
    display: block
}

.symbol-search-box .symbols .favorite-symbol .showdelete[data-v-72e873f8],.symbol-search-box .symbols .favorite-symbol .showimg[data-v-72e873f8] {
    display: flex;
    height: 40px;
    background: transparent;
    color: #fff;
    position: relative;
    top: -5px;
    border-radius: 10px;
    width: 40px;
    font-size: 20px;
    left: -5px;
    padding: 0 5px;
    line-height: 35px;
    z-index: 1000;
    align-items: center;
    overflow: hidden
}

.symbol-search-box .symbols .favorite-symbol .showdelete i[data-v-72e873f8],.symbol-search-box .symbols .favorite-symbol .showimg i[data-v-72e873f8] {
    font-size: 14px;
    display: none;
    position: absolute;
    top: 13px;
    left: 0;
    right: 0
}

.symbol-search-box .symbols .favorite-symbol .showdelete[data-v-72e873f8]:hover {
    background: rgba(0,0,0,.5)
}

.symbol-search-box .symbols .favorite-symbol .showdelete:hover i[data-v-72e873f8] {
    display: block
}

.symbol-search-box .tags[data-v-72e873f8] {
    padding: 5px 0;
    overflow: auto;
    white-space: nowrap
}

.symbol-search-box .tags .tag[data-v-72e873f8] {
    border: 1px solid #ddd;
    padding: 2px 5px;
    display: inline-block;
    border-radius: 9px;
    background: #f0f2fa;
    border-top: none;
    border-left: none;
    opacity: 1;
    font-weight: 400;
    font-size: 12px;
    text-decoration: none;
    color: #333
}

.symbol-search-box .tags .tag[data-v-72e873f8]:hover {
    background: #cad1ed;
    color: #1a1919
}

.symbol-search-box .display[data-v-72e873f8] {
    height: 368px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around
}

.symbol-search-box .display .placeholder[data-v-72e873f8] {
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    top: 50%;
    opacity: .7
}

.symbol-search-box .display .grid-cell[data-v-72e873f8] {
    display: inline-block;
    margin: 19px 20px;
    width: 90px;
    height: 90px;
    position: relative;
    z-index: 10;
    padding: 20px;
    border-radius: 50%;
    background: #f7f9fa
}

.symbol-search-box .display .grid-cell.disabled[data-v-72e873f8] {
    pointer-events: none;
    opacity: .4
}

.symbol-search-box .display .grid-cell .own-copyright[data-v-72e873f8] {
    top: 2px;
    right: 2px
}

.symbol-search-box .display .grid-cell .icon[data-v-72e873f8] {
    width: 100%;
    height: 100%;
    opacity: .8;
    transition: all 1s cubic-bezier(.19,.92,.35,1.07)
}

.symbol-search-box .display .grid-cell .icon[data-v-72e873f8]:hover {
    opacity: 1;
    cursor: pointer
}

.symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(odd) {
    width: 135px;
    height: 135px;
    margin: 15px 20px
}

.symbol-search-box .display .grid-cell:nth-child(odd) .own-copyright[data-v-72e873f8] {
    top: 10px;
    right: 10px
}

.symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(3n+2) {
    width: 115px;
    height: 115px;
    margin: 20px
}

.symbol-search-box .display .grid-cell:nth-child(3n+2) .own-copyright[data-v-72e873f8] {
    top: 6px;
    right: 6px
}

.symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(4n+3) {
    width: 150px;
    height: 150px;
    margin: 17px 20px
}

.symbol-search-box .display .grid-cell:nth-child(4n+3) .own-copyright[data-v-72e873f8] {
    top: 12px;
    right: 12px
}

.symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(5n+4) {
    width: 100px;
    height: 100px;
    margin: 18px 20px
}

.symbol-search-box .display .grid-cell:nth-child(5n+4) .own-copyright[data-v-72e873f8] {
    top: 4px;
    right: 4px
}

.symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(6n+5) {
    width: 120px;
    height: 120px;
    margin: 16px 20px
}

.symbol-search-box .display .grid-cell:nth-child(6n+5) .own-copyright[data-v-72e873f8] {
    top: 8px;
    right: 8px
}

.symbol-search-box .display .grid-cell[data-v-72e873f8]:hover {
    box-shadow: 0 10px 20px rgba(0,0,0,.15)
}

.symbol-search-box .display .grid-cell-bg[data-v-72e873f8]:before {
    display: block;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    position: absolute;
    background: #f7f9fa;
    content: "";
    cursor: wait;
    border-radius: 50%;
    transition: -webkit-transform .2s ease-in-out;
    transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out,-webkit-transform .2s ease-in-out
}

.symbol-search-box .done-button[data-v-72e873f8] {
    width: 200px;
    position: absolute;
    bottom: 10px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

@media screen and (max-width:600px) {
    .symbol-search-box[data-v-72e873f8] {
        height: 100%;
        display: flex;
        flex-direction: column;
        padding: 40px 20px 56px
    }

    .symbol-search-box .symbol-search-box-title[data-v-72e873f8] {
        margin: -24px 0 20px
    }

    .symbol-search-box .display[data-v-72e873f8] {
        height: auto
    }

    .symbol-search-box .display .grid-cell[data-v-72e873f8] {
        margin: 13px 0;
        width: 70px;
        height: 70px
    }

    .symbol-search-box .display .grid-cell .own-copyright[data-v-72e873f8] {
        top: 0;
        right: 0
    }

    .symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(odd) {
        width: 115px;
        height: 115px;
        margin: 10px 5px
    }

    .symbol-search-box .display .grid-cell:nth-child(odd) .own-copyright[data-v-72e873f8] {
        top: 6px;
        right: 6px
    }

    .symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(3n+2) {
        width: 95px;
        height: 95px;
        margin: 15px 5px
    }

    .symbol-search-box .display .grid-cell:nth-child(3n+2) .own-copyright[data-v-72e873f8] {
        top: 2px;
        right: 2px
    }

    .symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(4n+3) {
        width: 130px;
        height: 130px;
        margin: 12px 5px
    }

    .symbol-search-box .display .grid-cell:nth-child(4n+3) .own-copyright[data-v-72e873f8] {
        top: 9px;
        right: 9px
    }

    .symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(5n+4) {
        width: 80px;
        height: 80px;
        margin: 13px 5px
    }

    .symbol-search-box .display .grid-cell:nth-child(5n+4) .own-copyright[data-v-72e873f8] {
        top: 1px;
        right: 1px
    }

    .symbol-search-box .display .grid-cell[data-v-72e873f8]:nth-child(6n+5) {
        width: 100px;
        height: 100px;
        margin: 11px 5px
    }

    .symbol-search-box .display .grid-cell:nth-child(6n+5) .own-copyright[data-v-72e873f8] {
        top: 4px;
        right: 4px
    }
}

.el-popover.s-n-pop {
    border: none;
    box-shadow: 0 10px 30px 0 rgba(0,0,0,.1);
    background-color: #fff;
    padding: 18px 22px 6px
}

.el-popover.s-n-pop .popper__arrow {
    border-bottom-color: rgba(0,0,0,.01)
}

.mobile-n-slide {
    display: none
}

.mslide-input-symbol {
    width: 65px!important;
    height: 36px;
    border: 1px solid #bfcbd9;
    border-left: 0;
    display: flex;
    align-items: center;
    justify-content: space-around;
    position: relative;
    font-size: 12px;
    color: #333
}

.mslide-input-symbol .iconfont {
    font-size: 13px;
    color: #bbb
}

.mslide-input-symbol.fir {
    border-left: 1px solid #bfcbd9
}

.mslide-input-symbol:after {
    content: attr(after-content);
    font-size: 12px;
    color: #a3aab3;
    line-height: 20px;
    width: 100%;
    position: absolute;
    bottom: -20px
}

.symbol-area {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.symbol-area .symbol-input>.el-input__icon {
    display: none;
    right: 521px
}

.symbol-area .symbol-input>.el-input__inner {
    height: 50px
}

.symbol-area .symbol-input .el-input-group__prepend {
    width: 180px
}

.symbol-area .symbol-input .el-input-group__append .el-button {
    position: absolute;
    background: #20a0ff;
    top: 11px;
    bottom: 0;
    width: 25.5%;
    left: -137px;
    height: 46px;
    font-size: 14px;
    color: #fff;
    padding: 0
}

.symbol-area .symbol-input .el-input-group__append .el-button:hover {
    opacity: .8
}

.symbol-area .symbol-input .el-input-group__append .el-button:focus {
    color: gray
}

@media screen and (max-width:600px) {
    .symbol-area .symbol-search {
        padding: 10px 15px
    }

    .symbol-area .symbol-search .symbol-input {
        display: flex;
        flex-wrap: wrap-reverse
    }

    .symbol-area .symbol-search .symbol-input>.el-input__icon {
        bottom: 25px;
        top: auto;
        right: 0;
        -webkit-transform: translateY(50%);
        transform: translateY(50%)
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__append {
        width: 100%;
        display: block;
        border-radius: 4px;
        border: none;
        background: transparent;
        padding: 0
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__append .symbols {
        display: block;
        overflow: auto;
        height: 50px;
        padding: 5px 0
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__append .el-button {
        right: 12px;
        bottom: -48px;
        top: unset;
        left: auto;
        width: 38.7%
    }

    .symbol-area .symbol-search .symbol-input>.el-input-group__prepend,.symbol-area .symbol-search .symbol-input>.el-input__inner {
        margin-top: 10px;
        width: 60%
    }

    .symbol-area .symbol-search .symbol-input>.el-input-group__prepend+.el-icon-search+.el-input__inner {
        width: 40%
    }

    .symbol-area .symbol-search .symbol-input>.el-input__inner {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        display: block
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__prepend {
        padding: 0
    }

    .symbol-area .symbol-search .symbol-input .el-input-group__prepend .prepend-wrapper {
        padding: 5px 0
    }
}

.symbol-search-box .search-input>.el-input__icon {
    right: 521px
}

.symbol-search-box .search-input .el-input-group__append,.symbol-search-box .search-input .el-input__inner {
    height: 50px
}

.symbol-search-box .search-input .el-input-group__append .el-button {
    position: absolute;
    right: -190px;
    top: 11px;
    width: 88px;
    bottom: 0;
    left: -80px;
    height: 46px;
    right: auto;
    text-align: center;
    color: #fff;
    background: #20a0ff;
    padding: 0
}

.symbol-search-box .search-input .el-input-group__append .el-button:hover {
    opacity: .8
}

.symbol-search-box .search-input .el-input-group__append .el-button:focus {
    color: gray
}

@media screen and (max-width:600px) {
    .symbol-search-box .search-input {
        display: flex;
        flex-wrap: wrap-reverse;
        min-height: 100px
    }

    .symbol-search-box .search-input>.el-input__icon {
        bottom: 25px;
        top: auto;
        right: 0;
        -webkit-transform: translateY(50%);
        transform: translateY(50%)
    }

    .symbol-search-box .search-input .el-input-group__append {
        width: 100%;
        display: block;
        border-radius: 4px;
        padding: 0;
        border: none;
        background: transparent
    }

    .symbol-search-box .search-input .el-input-group__append .symbols {
        display: block;
        padding: 5px 0;
        overflow: auto
    }

    .symbol-search-box .search-input .el-input-group__append .el-button {
        right: 12px;
        bottom: -48px;
        top: auto;
        left: auto
    }

    .symbol-search-box .search-input>.el-input-group__prepend,.symbol-search-box .search-input>.el-input__inner {
        margin-top: 10px
    }

    .symbol-search-box .search-input>.el-input__inner {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        display: block
    }

    .symbol-search-box .search-input .el-input-group__prepend {
        padding: 0
    }

    .symbol-search-box .search-input .el-input-group__prepend .el-select {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        margin: 0
    }
}

.waterfall-container[data-v-bcf71cde] {
    width: 100%;
    max-width: 1150px;
    text-align: left;
    font-size: 0
}

.waterfall-container .card[data-v-bcf71cde] {
    display: inline-block;
    max-width: 360px;
    width: calc(100% - 20px);
    margin: 10px;
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
    background: #fff;
    transition: all .3s
}

.waterfall-container .card[data-v-bcf71cde]:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05)
}

.waterfall-container .load-more[data-v-bcf71cde],.waterfall-container .tip[data-v-bcf71cde] {
    color: #fff;
    background: #d3d3d3
}

.waterfall-container .load-more h3[data-v-bcf71cde],.waterfall-container .tip h3[data-v-bcf71cde] {
    font-size: 1rem
}

.waterfall-container .load-more p[data-v-bcf71cde],.waterfall-container .tip p[data-v-bcf71cde] {
    font-size: .8rem;
    text-align: center;
    margin-top: 10px
}

.waterfall-container .load-more[data-v-bcf71cde]:before,.waterfall-container .tip[data-v-bcf71cde]:before {
    content: "";
    display: block;
    padding-top: 73.5294118%;
    width: 100%
}

.waterfall-container .load-more .wrapper[data-v-bcf71cde],.waterfall-container .tip .wrapper[data-v-bcf71cde] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 20px 50px;
    border: 5px solid #1484ff;
    background: #fff;
    border-radius: 6px;
    color: #666
}

.waterfall-container .load-more .wrapper *+.el-button[data-v-bcf71cde],.waterfall-container .tip .wrapper *+.el-button[data-v-bcf71cde] {
    position: absolute;
    bottom: 10px
}

.waterfall-container .load-more .wrapper[data-v-bcf71cde] .load-more-logos-btn span,.waterfall-container .tip .wrapper[data-v-bcf71cde] .load-more-logos-btn span {
    font-size: 16px
}

@media screen and (max-width:600px) {
    .waterfall-container .card[data-v-bcf71cde]:hover {
        -webkit-transform: none;
        transform: none
    }
}

.mini-program-house-link[data-v-4a7f5f92] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    display: none
}

.mini-program-house-link img[data-v-4a7f5f92] {
    display: block
}

.mini-program-house-link span[data-v-4a7f5f92] {
    font-size: 12px;
    color: #3a3a3a
}

.openyourlovelogo[data-v-4a7f5f92] {
    font-size: 18px;
    margin-bottom: 15px
}

.options[data-v-4a7f5f92] {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden
}

.options .edit[data-v-4a7f5f92] {
    padding: 30px 10px;
    background: #fff;
    border-bottom: 1px solid #eee;
    position: fixed;
    width: 100%;
    bottom: 0;
    z-index: 1000;
    box-shadow: 0 -1px 12px rgba(0,0,0,.2)
}

.options .edit .edit-wrapper[data-v-4a7f5f92] {
    z-index: 1;
    width: 100%;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.options .edit .edit-wrapper>div[data-v-4a7f5f92] {
    padding: 5px 0
}

.options .edit .edit-wrapper .el-input[data-v-4a7f5f92] {
    width: 200px
}

.options .edit .edit-wrapper .el-input[data-v-4a7f5f92]:before {
    font-size: 12px;
    color: #bfcbd9;
    position: absolute;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    bottom: 0;
    left: 10px
}

.options .edit .edit-wrapper.zh .el-badge[data-v-4a7f5f92] {
    margin: 0 10px
}

.options .edit .edit-wrapper.zh .input-wrapper[data-v-4a7f5f92] {
    opacity: 0;
    position: absolute
}

.options .edit .edit-wrapper.zh .el-button--primary[data-v-4a7f5f92] {
    margin: 0 10px
}

.options .edit .edit-wrapper.zh h3[data-v-4a7f5f92] {
    opacity: 0
}

.options .edit .edit-wrapper .el-input--name.error[data-v-4a7f5f92] .el-input__inner {
    border-color: #ff4949
}

.options .edit .edit-wrapper .el-input--name[data-v-4a7f5f92]:before {
    content: attr(logo-name)
}

.options .edit .edit-wrapper .el-input--slogan[data-v-4a7f5f92]:before {
    content: attr(slogan-name)
}

.options .edit .edit-wrapper .el-badge[data-v-4a7f5f92] .el-badge__content {
    right: 15px
}

.options .edit .edit-wrapper .el-badge[data-v-4a7f5f92],.options .edit .edit-wrapper .el-button--primary[data-v-4a7f5f92],.options .edit .edit-wrapper .el-input[data-v-4a7f5f92],.options .edit .edit-wrapper .warpper[data-v-4a7f5f92] {
    margin: 0 10px
}

.options .scroll-wrapper[data-v-4a7f5f92] {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch
}

.options .scroll-wrapper h3[data-v-4a7f5f92] {
    line-height: 70px;
    font-weight: 400
}

.options .scroll-wrapper h3 span.link[data-v-4a7f5f92] {
    color: #20a0ff;
    cursor: pointer
}

.options .scroll-wrapper .waterfall-container[data-v-4a7f5f92] {
    margin: auto;
    padding-bottom: 130px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap
}

.options .scroll-wrapper .waterfall-container[data-v-4a7f5f92] .card {
    position: relative
}

.options .scroll-wrapper .waterfall-container .card:hover .favourite-button[data-v-4a7f5f92] {
    display: block
}

.options .scroll-wrapper .waterfall-container .card .favourite-button[data-v-4a7f5f92] {
    display: none;
    position: absolute;
    right: 15px;
    top: 15px;
    font-size: 25px;
    padding: 10px 15px;
    color: #d3d3d3;
    border: none;
    padding: 5px
}

.options .scroll-wrapper .waterfall-container .card .favourite-button.display-block[data-v-4a7f5f92] {
    display: block
}

.options .scroll-wrapper .waterfall-container .card .favourite-button .fa-heart[data-v-4a7f5f92] {
    font-size: 20px;
    height: 100%;
    display: block
}

.options .scroll-wrapper .waterfall-container .card .favourite-button.is-favourited[data-v-4a7f5f92] {
    color: red
}

.options .commodity[data-v-4a7f5f92] {
    display: none;
    position: fixed;
    z-index: 2000;
    color: red;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

.options .favorites-dialog[data-v-4a7f5f92] .el-dialog {
    max-width: 240px
}

@media screen and (max-width:600px) {
    .openyourlovelogo[data-v-4a7f5f92] {
        font-size: 13px;
        margin-bottom: 15px;
        width: 282px;
        margin-left: 64px
    }

    .options[data-v-4a7f5f92] {
        padding-bottom: 0
    }

    .options .edit[data-v-4a7f5f92] {
        padding: 10px
    }

    .options .edit h3[data-v-4a7f5f92] {
        font-size: 17px;
        letter-spacing: 0
    }

    .options .edit .edit-wrapper[data-v-4a7f5f92] {
        flex-direction: column
    }

    .options .edit .edit-wrapper .el-badge[data-v-4a7f5f92],.options .edit .edit-wrapper .el-button--primary[data-v-4a7f5f92],.options .edit .edit-wrapper .el-input[data-v-4a7f5f92],.options .edit .edit-wrapper .warpper[data-v-4a7f5f92] {
        margin: 0
    }

    .options .edit .edit-wrapper .input-wrapper[data-v-4a7f5f92] {
        display: flex;
        justify-content: space-between;
        font-size: 0;
        width: 100%
    }

    .options .edit .edit-wrapper .input-wrapper span[data-v-4a7f5f92] {
        display: inline-block;
        width: 48%
    }

    .options .edit .edit-wrapper .input-wrapper .el-input[data-v-4a7f5f92] {
        margin: 0;
        display: inline-block;
        width: 100%
    }

    .options .edit .edit-wrapper .input-wrapper .el-input[data-v-4a7f5f92]:before {
        display: none
    }

    .options .edit .edit-wrapper .button-wrapper[data-v-4a7f5f92] {
        margin-left: 0;
        display: flex;
        justify-content: space-around;
        width: 100%
    }

    .options .edit .edit-wrapper.zh .symbolsButton[data-v-4a7f5f92] {
        width: unset
    }

    .options .edit .edit-wrapper.zh .button-wrapper .item[data-v-4a7f5f92] {
        width: unset;
        margin: unset
    }

    .options .edit .edit-wrapper.zh .el-button--primary[data-v-4a7f5f92] {
        margin: unset
    }

    .options .edit .edit-wrapper.zh .zh-pc-title[data-v-4a7f5f92] {
        display: none
    }

    .options .edit .edit-wrapper .el-input[data-v-4a7f5f92]:before {
        left: -10px;
        -webkit-transform: translate(-100%,50%);
        transform: translate(-100%,50%);
        bottom: inherit
    }

    .options .scroll-wrapper h3[data-v-4a7f5f92] {
        line-height: 25px;
        padding: 20px;
        font-size: 16px
    }

    .options .scroll-wrapper h3.zh[data-v-4a7f5f92] {
        opacity: 1
    }

    .options .scroll-wrapper .waterfall-container[data-v-4a7f5f92] {
        padding: 0 35px 30px
    }
}

@media screen and (max-width:413px) {
    .openyourlovelogo[data-v-4a7f5f92] {
        font-size: 13px;
        margin-bottom: 15px;
        width: 282px;
        margin-left: 42px
    }
}

.el-popover.options-popover {
    padding: 15px
}

@media screen and (max-width:600px) {
    .el-popover.options-popover {
        left: 5px!important;
        right: 5px!important;
        width: auto!important
    }

    .button-wrapper .item {
        width: 41%
    }

    .button-wrapper .item .symbolsButton {
        width: 100%
    }

    .button-wrapper .makemoreButton {
        width: 40%
    }

    .input-wrapper .el-input__inner {
        width: 100%
    }
}

p.S_ShareAndGetFreeLogo[data-v-aef7ee1e] {
    display: none;
    padding: 10px;
    background: #fff;
    box-sizing: border-box;
    left: -160px;
    width: 300px;
    position: absolute;
    font-size: 12px;
    color: #333;
    border: 1px solid #d1d9e5;
    z-index: 1;
    border-radius: 2px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.12),0 0 6px 0 rgba(0,0,0,.04);
    font-family: Helvetica Neue,PingFang SC,Microsoft YaHei!important;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    top: 36px;
    bottom: unset;
    line-height: 20px;
    text-align: left;
    font-weight: 400
}

p.S_ShareAndGetFreeLogo.t[data-v-aef7ee1e] {
    bottom: 10px
}

p.S_ShareAndGetFreeLogo .zan[data-v-aef7ee1e] {
    font-size: 22px
}

p.S_ShareAndGetFreeLogo .ShareAndGetFreeLogo-icon[data-v-aef7ee1e] {
    position: absolute;
    top: -5px;
    width: 11px;
    height: 6px;
    bottom: unset;
    left: 0;
    right: -40px;
    margin: auto;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.useBook[data-v-aef7ee1e] {
    position: relative;
    color: #888
}

.useBook span.use-sn[data-v-aef7ee1e] {
    color: #222;
    opacity: .25;
    font-size: 0;
    font-weight: 600;
    letter-spacing: .3px
}

.useBook:hover .S_ShareAndGetFreeLogo[data-v-aef7ee1e] {
    display: block
}

@media screen and (max-width:768px) {
    .useBook .use-sn span[data-v-aef7ee1e] {
        display: none
    }

    p.S_ShareAndGetFreeLogo[data-v-aef7ee1e] {
        right: -10px;
        left: unset
    }

    p.S_ShareAndGetFreeLogo .ShareAndGetFreeLogo-icon[data-v-aef7ee1e] {
        left: unset;
        right: 13px
    }
}

.row-bg[data-v-aef7ee1e] {
    padding: 12px 0;
    font-size: 12.5px;
    font-weight: 500;
    margin-bottom: 40px
}

.row-bg .step-tips[data-v-aef7ee1e] {
    background: #e8f3fd;
    position: absolute;
    top: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    width: 100%;
    left: 0
}

.row-bg .step-tips span.m-tips[data-v-aef7ee1e] {
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .3px;
    color: #737680
}

.row-bg .overNone[data-v-aef7ee1e] {
    width: 100%;
    height: 40px;
    overflow: hidden
}

.row-bg .moveParent[data-v-aef7ee1e] {
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
    transition: all .5s
}

.row-bg .moveBottom[data-v-aef7ee1e],.row-bg .moveTop[data-v-aef7ee1e] {
    width: 100%;
    text-align: center
}

.row-bg .panel-top[data-v-aef7ee1e] {
    white-space: nowrap
}

.row-bg .panel-top .el-button[data-v-aef7ee1e] {
    border: none;
    color: #737680;
    font-weight: 600;
    background-color: #f5f5f5;
    padding: 0;
    position: relative;
    width: 92px;
    height: 42px;
    line-height: 40px;
    font-size: 14px;
    font-family: PingFangSC,inherit;
    box-sizing: border-box;
    border: 1px solid transparent;
    transition: border-color .2s ease-out
}

.row-bg .panel-top .el-button+.el-button[data-v-aef7ee1e] {
    margin-left: 20px
}

.row-bg .panel-top .el-button i.el-icon-caret-top[data-v-aef7ee1e] {
    font-size: 18px;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: -19px;
    color: #e8f3fd;
    display: none
}

.row-bg .panel-top .el-button i.el-icon-caret-top.active[data-v-aef7ee1e] {
    display: block
}

.row-bg .panel-top .el-button--primary[data-v-aef7ee1e] {
    color: #fff;
    background-color: #20a0ff
}

.row-bg .panel-top .el-button--default[data-v-aef7ee1e]:hover {
    background-color: #f5f5f5;
    border: 1px solid #20a0ff;
    color: #20a0ff
}

.row-bg .panel-top .el-button--default[data-v-aef7ee1e]:focus {
    color: #20a0ff
}

.row-bg .panel-top .row-padding-fiv[data-v-aef7ee1e] {
    padding: 5px 0
}

@media only screen and (max-width:768px) {
    .row-bg[data-v-aef7ee1e] {
        padding: 12px 0
    }

    .row-bg .panel-top[data-v-aef7ee1e]:before {
        display: none
    }

    .row-bg .panel-top .el-button[data-v-aef7ee1e] {
        margin-left: 0;
        font-size: 13px;
        width: 76px;
        height: 35px;
        line-height: 35px
    }

    .row-bg .panel-top .el-button+.el-button[data-v-aef7ee1e] {
        margin-left: 14px
    }

    .row-bg .panel-top .el-button i.el-icon-caret-top[data-v-aef7ee1e] {
        bottom: -19px
    }
}

@media only screen and (max-width:372px) {
    .row-bg .panel-top .el-button[data-v-aef7ee1e] {
        width: 70px
    }

    .row-bg .panel-top .el-button+.el-button[data-v-aef7ee1e] {
        margin-left: 9px
    }
}

.i--inner .input-wrapper .i-wenben,.i--inner .input-wrapper .icon-bianji {
    display: none
}

.i--inner .input-wrapper .e-i-input {
    width: 130px;
    height: 44px;
    margin-right: 0
}

.i--inner .input-wrapper .e-i-input.title-input .el-input__inner {
    font-weight: 600
}

.i--inner .input-wrapper .e-i-input .el-input__inner {
    height: 44px;
    border: 1px solid rgba(6,8,14,.1);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    font-family: PingFangSC,inherit;
    font-size: 14px;
    color: #475669;
    transition: all .2s ease-out;
    padding: 0 12px
}

.i--inner .input-wrapper .e-i-input .el-input__inner:focus,.i--inner .input-wrapper .e-i-input .el-input__inner:hover {
    border-color: #20a0ff
}

.i--inner .s-n-group {
    transition: all .3s ease-out;
    opacity: 1
}

.i--inner.min .input-wrapper {
    position: relative
}

.i--inner.min .input-wrapper .e-i-input {
    margin-right: 1px
}

.i--inner.min .input-wrapper .e-i-input .el-input__inner {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    padding-left: 50px
}

.i--inner.min .input-wrapper .i-wenben {
    position: absolute;
    display: block;
    height: 44px;
    top: 0;
    left: 0;
    z-index: 10;
    color: transparent;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    padding-left: 51px;
    text-align: left;
    min-width: 130px
}

.i--inner.min .input-wrapper .icon-bianji {
    display: block;
    position: absolute;
    font-size: 20px;
    top: 10px;
    left: 20px;
    color: #20a0ff
}

.i--inner.min .s-n-group {
    opacity: 0
}

.flex-name-controls .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 20px 0
}

.flex-name-controls .inner.i---inner {
    align-items: flex-start
}

.c-drop-menu {
    box-shadow: 0 10px 30px 0 rgba(0,0,0,.1);
    background-color: #fff;
    border: none;
    margin-top: 6px;
    padding: 0;
    min-width: 96px
}

.c-drop-menu .c-drop-item {
    display: flex;
    width: 96px;
    padding: 0 1px;
    align-items: center;
    color: #475669
}

.c-drop-menu .c-drop-item>span {
    display: inline-block;
    height: 16px;
    line-height: 1;
    padding: 9px
}

.c-drop-menu .c-drop-item:nth-child(2)>span {
    height: 19px
}

.c-drop-menu .c-drop-item:nth-child(3)>span {
    height: 18px
}

.c-drop-menu .c-drop-item:nth-child(5)>span {
    height: 19px
}

.pos-wrapper[data-v-fce08f90] {
    width: 100px;
    flex-wrap: wrap;
    justify-content: center;
    margin-right: 20px
}

.pos-wrapper .pos[data-v-fce08f90] {
    height: 34px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    width: 100%
}

.pos-wrapper .pos span[data-v-fce08f90] {
    width: 50%;
    max-width: 50%;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #c3c3c3;
    cursor: pointer;
    border: 1px solid rgba(52,53,56,.1);
    background-color: #fff;
    border-left: 0;
    transition: all .2s ease-out
}

.pos-wrapper .pos span[data-v-fce08f90]:first-child {
    border-left: 1px solid rgba(52,53,56,.1);
    border-radius: 4px 0 0 4px
}

.pos-wrapper .pos span[data-v-fce08f90]:last-child {
    border-radius: 0 4px 4px 0
}

.pos-wrapper .pos span[data-v-fce08f90]:hover {
    color: #20a0ff
}

.pos-wrapper .pos span.actived[data-v-fce08f90] {
    color: #fff;
    background-color: #20a0ff;
    border-color: #20a0ff;
    box-shadow: -1px 0 0 0 #20a0ff
}

.pos-wrapper .pos span .icon-zuoyou-bai[data-v-fce08f90] {
    -webkit-transform: scale(.303);
    transform: scale(.303)
}

.pos-wrapper .pos span .icon-shangxia-huise[data-v-fce08f90],.pos-wrapper .pos span .icon-shangxiaduiqi-huise[data-v-fce08f90] {
    -webkit-transform: scale(.685);
    transform: scale(.685)
}

.i---inner[data-v-fce08f90] {
    flex-direction: column;
    align-items: start
}

.i---inner .i--i--line[data-v-fce08f90] {
    display: flex;
    align-items: center
}

.i---inner .i--i--line[data-v-fce08f90]:not(:first-child) {
    margin-top: 10px
}

.input-wrapper[data-v-fce08f90] {
    margin-right: -1px;
    z-index: 1
}

.e-i-input[data-v-fce08f90] {
    font-weight: 600
}

.flex-name-controls [data-v-fce08f90] {
    box-sizing: border-box
}

.s-n-group[data-v-fce08f90] {
    display: flex
}

.s-n-group .e-f-drop[data-v-fce08f90] {
    position: relative;
    display: flex;
    justify-content: center;
    width: 98px;
    height: 44px;
    margin-right: -1px;
    border: 1px solid rgba(52,53,56,.1);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    transition: all .2s ease-out;
    background-color: hsla(0,0%,96%,.8)
}

.s-n-group .e-f-drop:not(.disabled).onac[data-v-fce08f90],.s-n-group .e-f-drop[data-v-fce08f90]:not(.disabled):focus,.s-n-group .e-f-drop[data-v-fce08f90]:not(.disabled):hover {
    border-color: #20a0ff;
    z-index: 1
}

.s-n-group .e-f-drop.disabled[data-v-fce08f90] {
    border-color: rgba(52,53,56,.05)
}

.s-n-group .e-f-drop.disabled .el-dropdown[data-v-fce08f90] {
    cursor: not-allowed
}

.s-n-group .e-f-drop.disabled .el-dropdown .el-dropdown-link .el-t-c[data-v-fce08f90],.s-n-group .e-f-drop.disabled .el-dropdown .el-dropdown-link[data-v-fce08f90] {
    color: rgba(52,53,56,.2)
}

.s-n-group .e-f-drop .el-dropdown[data-v-fce08f90] {
    flex: 1;
    display: flex;
    color: #475669;
    cursor: pointer
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link[data-v-fce08f90] {
    display: flex;
    flex: 1;
    justify-content: space-between;
    align-items: center;
    padding: 0 4px 0 6px
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .el-t-c[data-v-fce08f90] {
    display: inline-block;
    height: 14px;
    color: #475669;
    flex: 1
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .iconfont[data-v-fce08f90] {
    font-size: 12px;
    display: inline-block;
    width: 20px;
    height: 13px;
    -webkit-transform: rotate(0deg) scale(.6);
    transform: rotate(0deg) scale(.6);
    transition: all .2s ease-out
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .iconfont.onac[data-v-fce08f90] {
    -webkit-transform: scale(.6);
    transform: scale(.6);
    -webkit-transform: rotate(180deg) scale(.6);
    transform: rotate(180deg) scale(.6)
}

.s-n-group .s-n-btn[data-v-fce08f90] {
    width: 50px;
    height: 44px;
    border-radius: 4px;
    border: 1px solid rgba(52,53,56,.1);
    font-family: PingFangSC,inherit;
    font-size: 12px;
    color: #475669;
    text-align: center;
    transition: all .2s ease-out;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 0;
    position: relative;
    background-color: hsla(0,0%,96%,.8)
}

.s-n-group .s-n-btn.is-plain[data-v-fce08f90] {
    border-color: rgba(52,53,56,.1)
}

.s-n-group .s-n-btn.is-disabled.is-plain[data-v-fce08f90] {
    border-color: rgba(52,53,56,.05);
    color: rgba(52,53,56,.2)
}

.s-n-group .s-n-btn[data-v-fce08f90]:not(.is-disabled):focus,.s-n-group .s-n-btn[data-v-fce08f90]:not(.is-disabled):hover {
    border-color: #20a0ff;
    color: #20a0ff
}

.s-n-group .s-n-btn.s-size[data-v-fce08f90] {
    margin-right: -1px;
    border-radius: 0
}

.s-n-group .s-n-btn.s-size[data-v-fce08f90]:focus,.s-n-group .s-n-btn.s-size[data-v-fce08f90]:hover {
    z-index: 1
}

.s-n-group .s-n-btn.s-size .icon-zihao1[data-v-fce08f90] {
    font-size: 12px
}

.s-n-group .s-n-btn.s-spacing[data-v-fce08f90] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

:lang(zh-CN) .i--inner[data-v-fce08f90] {
    width: 346px
}

:lang(zh-CN) .s-n-btn.s-size[data-v-fce08f90],:lang(zh-CN) .s-n-btn.s-spacing[data-v-fce08f90] {
    width: 60px;
    font-size: 12px;
    font-weight: 600
}

.sli-title[data-v-fce08f90] {
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.2px;
    color: rgba(52,53,56,.5);
    margin-bottom: 2px
}

.i--inner[data-v-fce08f90] {
    display: flex;
    align-items: center;
    width: 326px;
    transition: all .3s ease-out
}

.i--inner+.i--inner[data-v-fce08f90] {
    margin-left: 20px
}

.i--inner.min[data-v-fce08f90] {
    width: 130px;
    overflow: hidden
}

@media screen and (max-width:768px) {
    .flex-name-controls .inner[data-v-fce08f90] {
        flex-direction: row;
        justify-content: left;
        padding: 16px;
        overflow-x: auto
    }

    .flex-name-controls .inner .s-n-group[data-v-fce08f90] {
        display: flex;
        padding-right: 12px
    }

    .s--slide[data-v-fce08f90] {
        position: relative;
        height: 40px
    }

    .s--slide .pc-slide[data-v-fce08f90] {
        display: none
    }

    .s--slide .mobile-n-slide[data-v-fce08f90] {
        position: absolute;
        left: -10px;
        border: none;
        top: 5px;
        display: block
    }
}

.i--inner .input-wrapper .i-wenben,.i--inner .input-wrapper .icon-bianji {
    display: none
}

.i--inner .input-wrapper .e-i-input {
    width: 130px;
    height: 44px;
    margin-right: 0
}

.i--inner .input-wrapper .e-i-input.title-input .el-input__inner {
    font-weight: 600
}

.i--inner .input-wrapper .e-i-input .el-input__inner {
    height: 44px;
    border: 1px solid rgba(6,8,14,.1);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    font-family: PingFangSC,inherit;
    font-size: 14px;
    color: #475669;
    transition: all .2s ease-out;
    padding: 0 12px
}

.i--inner .input-wrapper .e-i-input .el-input__inner:focus,.i--inner .input-wrapper .e-i-input .el-input__inner:hover {
    border-color: #20a0ff
}

.i--inner .s-n-group {
    transition: all .3s ease-out;
    opacity: 1
}

.i--inner.min .input-wrapper {
    position: relative
}

.i--inner.min .input-wrapper .e-i-input {
    margin-right: 1px
}

.i--inner.min .input-wrapper .e-i-input .el-input__inner {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    padding-left: 50px
}

.i--inner.min .input-wrapper .i-wenben {
    position: absolute;
    display: block;
    height: 44px;
    top: 0;
    left: 0;
    z-index: 10;
    color: transparent;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    padding-left: 51px;
    text-align: left;
    min-width: 130px
}

.i--inner.min .input-wrapper .icon-bianji {
    display: block;
    position: absolute;
    font-size: 20px;
    top: 10px;
    left: 20px;
    color: #20a0ff
}

.i--inner.min .s-n-group {
    opacity: 0
}

.flex-name-controls .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 20px 0
}

.flex-name-controls .inner.i---inner {
    align-items: flex-start
}

.c-drop-menu {
    box-shadow: 0 10px 30px 0 rgba(0,0,0,.1);
    background-color: #fff;
    border: none;
    margin-top: 6px;
    padding: 0;
    min-width: 96px
}

.c-drop-menu .c-drop-item {
    display: flex;
    width: 96px;
    padding: 0 1px;
    align-items: center;
    color: #475669
}

.c-drop-menu .c-drop-item>span {
    display: inline-block;
    height: 16px;
    line-height: 1;
    padding: 9px
}

.c-drop-menu .c-drop-item:nth-child(2)>span {
    height: 19px
}

.c-drop-menu .c-drop-item:nth-child(3)>span {
    height: 18px
}

.c-drop-menu .c-drop-item:nth-child(5)>span {
    height: 19px
}

.pos-wrapper[data-v-26c781f8] {
    width: 150px;
    flex-wrap: wrap;
    justify-content: center;
    margin-right: 20px
}

.pos-wrapper .pos[data-v-26c781f8] {
    height: 34px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    width: 100%
}

.pos-wrapper .pos span[data-v-26c781f8] {
    width: 33%;
    max-width: 33%;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #c3c3c3;
    cursor: pointer;
    border: 1px solid rgba(52,53,56,.1);
    background-color: #fff;
    border-left: 0;
    transition: all .2s ease-out
}

.pos-wrapper .pos span[data-v-26c781f8]:first-child {
    border-left: 1px solid rgba(52,53,56,.1);
    border-radius: 4px 0 0 4px
}

.pos-wrapper .pos span[data-v-26c781f8]:last-child {
    border-radius: 0 4px 4px 0
}

.pos-wrapper .pos span[data-v-26c781f8]:hover {
    color: #20a0ff
}

.pos-wrapper .pos span.actived[data-v-26c781f8] {
    color: #fff;
    background-color: #20a0ff;
    border-color: #20a0ff;
    box-shadow: -1px 0 0 0 #20a0ff
}

.pos-wrapper .pos span .icon-zuoyou-bai[data-v-26c781f8] {
    -webkit-transform: scale(.303);
    transform: scale(.303)
}

.pos-wrapper .pos span .icon-shangxia-huise[data-v-26c781f8],.pos-wrapper .pos span .icon-shangxiaduiqi-huise[data-v-26c781f8] {
    -webkit-transform: scale(.685);
    transform: scale(.685)
}

.i---inner[data-v-26c781f8] {
    flex-direction: column;
    align-items: start
}

.i---inner .i--i--line[data-v-26c781f8] {
    display: flex;
    align-items: center
}

.i---inner .i--i--line[data-v-26c781f8]:not(:first-child) {
    margin-top: 10px
}

.input-wrapper[data-v-26c781f8] {
    margin-right: -1px;
    z-index: 1
}

.e-i-input[data-v-26c781f8] {
    font-weight: 600
}

.flex-name-controls [data-v-26c781f8] {
    box-sizing: border-box
}

.s-n-group[data-v-26c781f8] {
    display: flex
}

.s-n-group .e-f-drop[data-v-26c781f8] {
    position: relative;
    display: flex;
    justify-content: center;
    width: 98px;
    height: 44px;
    margin-right: -1px;
    border: 1px solid rgba(52,53,56,.1);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    transition: all .2s ease-out;
    background-color: hsla(0,0%,96%,.8)
}

.s-n-group .e-f-drop:not(.disabled).onac[data-v-26c781f8],.s-n-group .e-f-drop[data-v-26c781f8]:not(.disabled):focus,.s-n-group .e-f-drop[data-v-26c781f8]:not(.disabled):hover {
    border-color: #20a0ff;
    z-index: 1
}

.s-n-group .e-f-drop.disabled[data-v-26c781f8] {
    border-color: rgba(52,53,56,.05)
}

.s-n-group .e-f-drop.disabled .el-dropdown[data-v-26c781f8] {
    cursor: not-allowed
}

.s-n-group .e-f-drop.disabled .el-dropdown .el-dropdown-link .el-t-c[data-v-26c781f8],.s-n-group .e-f-drop.disabled .el-dropdown .el-dropdown-link[data-v-26c781f8] {
    color: rgba(52,53,56,.2)
}

.s-n-group .e-f-drop .el-dropdown[data-v-26c781f8] {
    flex: 1;
    display: flex;
    color: #475669;
    cursor: pointer
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link[data-v-26c781f8] {
    display: flex;
    flex: 1;
    justify-content: space-between;
    align-items: center;
    padding: 0 4px 0 6px
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .el-t-c[data-v-26c781f8] {
    display: inline-block;
    height: 14px;
    color: #475669;
    flex: 1
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .iconfont[data-v-26c781f8] {
    font-size: 12px;
    display: inline-block;
    width: 20px;
    height: 13px;
    -webkit-transform: rotate(0deg) scale(.6);
    transform: rotate(0deg) scale(.6);
    transition: all .2s ease-out
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .iconfont.onac[data-v-26c781f8] {
    -webkit-transform: scale(.6);
    transform: scale(.6);
    -webkit-transform: rotate(180deg) scale(.6);
    transform: rotate(180deg) scale(.6)
}

.s-n-group .s-n-btn[data-v-26c781f8] {
    width: 50px;
    height: 44px;
    border-radius: 4px;
    border: 1px solid rgba(52,53,56,.1);
    font-family: PingFangSC,inherit;
    font-size: 12px;
    color: #475669;
    text-align: center;
    transition: all .2s ease-out;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 0;
    position: relative;
    background-color: hsla(0,0%,96%,.8)
}

.s-n-group .s-n-btn.is-plain[data-v-26c781f8] {
    border-color: rgba(52,53,56,.1)
}

.s-n-group .s-n-btn.is-disabled.is-plain[data-v-26c781f8] {
    border-color: rgba(52,53,56,.05);
    color: rgba(52,53,56,.2)
}

.s-n-group .s-n-btn[data-v-26c781f8]:not(.is-disabled):focus,.s-n-group .s-n-btn[data-v-26c781f8]:not(.is-disabled):hover {
    border-color: #20a0ff;
    color: #20a0ff
}

.s-n-group .s-n-btn.s-size[data-v-26c781f8] {
    margin-right: -1px;
    border-radius: 0
}

.s-n-group .s-n-btn.s-size[data-v-26c781f8]:focus,.s-n-group .s-n-btn.s-size[data-v-26c781f8]:hover {
    z-index: 1
}

.s-n-group .s-n-btn.s-size .icon-zihao1[data-v-26c781f8] {
    font-size: 12px
}

.s-n-group .s-n-btn.s-spacing[data-v-26c781f8] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

:lang(zh-CN) .i--inner[data-v-26c781f8] {
    width: 346px
}

:lang(zh-CN) .s-n-btn.s-size[data-v-26c781f8],:lang(zh-CN) .s-n-btn.s-spacing[data-v-26c781f8] {
    width: 60px;
    font-size: 12px;
    font-weight: 600
}

.sli-title[data-v-26c781f8] {
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.2px;
    color: rgba(52,53,56,.5);
    margin-bottom: 2px
}

.i--inner[data-v-26c781f8] {
    display: flex;
    align-items: center;
    width: 326px;
    transition: all .3s ease-out
}

.i--inner+.i--inner[data-v-26c781f8] {
    margin-left: 20px
}

.i--inner.min[data-v-26c781f8] {
    width: 130px;
    overflow: hidden
}

@media screen and (max-width:768px) {
    .flex-name-controls .inner[data-v-26c781f8] {
        flex-direction: row;
        justify-content: left;
        padding: 16px;
        overflow-x: auto
    }

    .flex-name-controls .inner .s-n-group[data-v-26c781f8] {
        display: flex;
        padding-right: 12px
    }

    .s--slide[data-v-26c781f8] {
        position: relative;
        height: 40px
    }

    .s--slide .pc-slide[data-v-26c781f8] {
        display: none
    }

    .s--slide .mobile-n-slide[data-v-26c781f8] {
        position: absolute;
        left: -10px;
        border: none;
        top: 5px;
        display: block
    }
}

.i--inner .input-wrapper .i-wenben,.i--inner .input-wrapper .icon-bianji {
    display: none
}

.i--inner .input-wrapper .e-i-input {
    width: 130px;
    height: 44px;
    margin-right: 0
}

.i--inner .input-wrapper .e-i-input.title-input .el-input__inner {
    font-weight: 600
}

.i--inner .input-wrapper .e-i-input .el-input__inner {
    height: 44px;
    border: 1px solid rgba(6,8,14,.1);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    font-family: PingFangSC,inherit;
    font-size: 14px;
    color: #475669;
    transition: all .2s ease-out;
    padding: 0 12px
}

.i--inner .input-wrapper .e-i-input .el-input__inner:focus,.i--inner .input-wrapper .e-i-input .el-input__inner:hover {
    border-color: #20a0ff
}

.i--inner .s-n-group {
    transition: all .3s ease-out;
    opacity: 1
}

.i--inner.min .input-wrapper {
    position: relative
}

.i--inner.min .input-wrapper .e-i-input {
    margin-right: 1px
}

.i--inner.min .input-wrapper .e-i-input .el-input__inner {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    padding-left: 50px
}

.i--inner.min .input-wrapper .i-wenben {
    position: absolute;
    display: block;
    height: 44px;
    top: 0;
    left: 0;
    z-index: 10;
    color: transparent;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    padding-left: 51px;
    text-align: left;
    min-width: 130px
}

.i--inner.min .input-wrapper .icon-bianji {
    display: block;
    position: absolute;
    font-size: 20px;
    top: 10px;
    left: 20px;
    color: #20a0ff
}

.i--inner.min .s-n-group {
    opacity: 0
}

.flex-name-controls .inner {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 20px 0
}

.flex-name-controls .inner.i---inner {
    align-items: flex-start
}

.c-drop-menu {
    box-shadow: 0 10px 30px 0 rgba(0,0,0,.1);
    background-color: #fff;
    border: none;
    margin-top: 6px;
    padding: 0;
    min-width: 96px
}

.c-drop-menu .c-drop-item {
    display: flex;
    width: 96px;
    padding: 0 1px;
    align-items: center;
    color: #475669
}

.c-drop-menu .c-drop-item>span {
    display: inline-block;
    height: 16px;
    line-height: 1;
    padding: 9px
}

.c-drop-menu .c-drop-item:nth-child(2)>span {
    height: 19px
}

.c-drop-menu .c-drop-item:nth-child(3)>span {
    height: 18px
}

.c-drop-menu .c-drop-item:nth-child(5)>span {
    height: 19px
}

.pos-wrapper[data-v-27657378] {
    width: 150px;
    flex-wrap: wrap;
    justify-content: center;
    margin-right: 20px
}

.pos-wrapper .pos[data-v-27657378] {
    height: 34px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    width: 100%
}

.pos-wrapper .pos span[data-v-27657378] {
    width: 33%;
    max-width: 33%;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #c3c3c3;
    cursor: pointer;
    border: 1px solid rgba(52,53,56,.1);
    background-color: #fff;
    border-left: 0;
    transition: all .2s ease-out
}

.pos-wrapper .pos span[data-v-27657378]:first-child {
    border-left: 1px solid rgba(52,53,56,.1);
    border-radius: 4px 0 0 4px
}

.pos-wrapper .pos span[data-v-27657378]:last-child {
    border-radius: 0 4px 4px 0
}

.pos-wrapper .pos span[data-v-27657378]:hover {
    color: #20a0ff
}

.pos-wrapper .pos span.actived[data-v-27657378] {
    color: #fff;
    background-color: #20a0ff;
    border-color: #20a0ff;
    box-shadow: -1px 0 0 0 #20a0ff
}

.pos-wrapper .pos span .icon-zuoyou-bai[data-v-27657378] {
    -webkit-transform: scale(.303);
    transform: scale(.303)
}

.pos-wrapper .pos span .icon-shangxia-huise[data-v-27657378],.pos-wrapper .pos span .icon-shangxiaduiqi-huise[data-v-27657378] {
    -webkit-transform: scale(.685);
    transform: scale(.685)
}

.i---inner[data-v-27657378] {
    flex-direction: column;
    align-items: start
}

.i---inner .i--i--line[data-v-27657378] {
    display: flex;
    align-items: center
}

.i---inner .i--i--line[data-v-27657378]:not(:first-child) {
    margin-top: 10px
}

.input-wrapper[data-v-27657378] {
    margin-right: -1px;
    z-index: 1
}

.e-i-input[data-v-27657378] {
    font-weight: 600
}

.flex-name-controls [data-v-27657378] {
    box-sizing: border-box
}

.s-n-group[data-v-27657378] {
    display: flex
}

.s-n-group .e-f-drop[data-v-27657378] {
    position: relative;
    display: flex;
    justify-content: center;
    width: 98px;
    height: 44px;
    margin-right: -1px;
    border: 1px solid rgba(52,53,56,.1);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    transition: all .2s ease-out;
    background-color: hsla(0,0%,96%,.8)
}

.s-n-group .e-f-drop:not(.disabled).onac[data-v-27657378],.s-n-group .e-f-drop[data-v-27657378]:not(.disabled):focus,.s-n-group .e-f-drop[data-v-27657378]:not(.disabled):hover {
    border-color: #20a0ff;
    z-index: 1
}

.s-n-group .e-f-drop.disabled[data-v-27657378] {
    border-color: rgba(52,53,56,.05)
}

.s-n-group .e-f-drop.disabled .el-dropdown[data-v-27657378] {
    cursor: not-allowed
}

.s-n-group .e-f-drop.disabled .el-dropdown .el-dropdown-link .el-t-c[data-v-27657378],.s-n-group .e-f-drop.disabled .el-dropdown .el-dropdown-link[data-v-27657378] {
    color: rgba(52,53,56,.2)
}

.s-n-group .e-f-drop .el-dropdown[data-v-27657378] {
    flex: 1;
    display: flex;
    color: #475669;
    cursor: pointer
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link[data-v-27657378] {
    display: flex;
    flex: 1;
    justify-content: space-between;
    align-items: center;
    padding: 0 4px 0 6px
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .el-t-c[data-v-27657378] {
    display: inline-block;
    height: 14px;
    color: #475669;
    flex: 1
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .iconfont[data-v-27657378] {
    font-size: 12px;
    display: inline-block;
    width: 20px;
    height: 13px;
    -webkit-transform: rotate(0deg) scale(.6);
    transform: rotate(0deg) scale(.6);
    transition: all .2s ease-out
}

.s-n-group .e-f-drop .el-dropdown .el-dropdown-link .iconfont.onac[data-v-27657378] {
    -webkit-transform: scale(.6);
    transform: scale(.6);
    -webkit-transform: rotate(180deg) scale(.6);
    transform: rotate(180deg) scale(.6)
}

.s-n-group .s-n-btn[data-v-27657378] {
    width: 50px;
    height: 44px;
    border-radius: 4px;
    border: 1px solid rgba(52,53,56,.1);
    font-family: PingFangSC,inherit;
    font-size: 12px;
    color: #475669;
    text-align: center;
    transition: all .2s ease-out;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 0;
    position: relative;
    background-color: hsla(0,0%,96%,.8)
}

.s-n-group .s-n-btn.is-plain[data-v-27657378] {
    border-color: rgba(52,53,56,.1)
}

.s-n-group .s-n-btn.is-disabled.is-plain[data-v-27657378] {
    border-color: rgba(52,53,56,.05);
    color: rgba(52,53,56,.2)
}

.s-n-group .s-n-btn[data-v-27657378]:not(.is-disabled):focus,.s-n-group .s-n-btn[data-v-27657378]:not(.is-disabled):hover {
    border-color: #20a0ff;
    color: #20a0ff
}

.s-n-group .s-n-btn.s-size[data-v-27657378] {
    margin-right: -1px;
    border-radius: 0
}

.s-n-group .s-n-btn.s-size[data-v-27657378]:focus,.s-n-group .s-n-btn.s-size[data-v-27657378]:hover {
    z-index: 1
}

.s-n-group .s-n-btn.s-size .icon-zihao1[data-v-27657378] {
    font-size: 12px
}

.s-n-group .s-n-btn.s-spacing[data-v-27657378] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

:lang(zh-CN) .i--inner[data-v-27657378] {
    width: 346px
}

:lang(zh-CN) .i--inner.graph[data-v-27657378] {
    width: 196px
}

:lang(zh-CN) .s-n-btn.s-size[data-v-27657378],:lang(zh-CN) .s-n-btn.s-spacing[data-v-27657378] {
    width: 60px;
    font-size: 12px;
    font-weight: 600
}

.sli-title[data-v-27657378] {
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.2px;
    color: rgba(52,53,56,.5);
    margin-bottom: 2px
}

.i--inner[data-v-27657378] {
    display: flex;
    align-items: center;
    width: 326px;
    transition: all .3s ease-out
}

.i--inner.graph[data-v-27657378] {
    width: 196px
}

.i--inner.graph .e-i-input[data-v-27657378] {
    width: 40px
}

.i--inner.graph.min .e-i-input[data-v-27657378],.i--inner.graph.min[data-v-27657378] {
    width: 100px
}

.i--inner+.i--inner[data-v-27657378] {
    margin-left: 20px
}

.i--inner.min[data-v-27657378] {
    width: 130px;
    overflow: hidden
}

@media screen and (max-width:768px) {
    .flex-name-controls .inner[data-v-27657378] {
        flex-direction: row;
        justify-content: left;
        padding: 16px;
        overflow-x: auto
    }

    .flex-name-controls .inner .s-n-group[data-v-27657378] {
        display: flex;
        padding-right: 12px
    }

    .s--slide[data-v-27657378] {
        position: relative;
        height: 40px
    }

    .s--slide .pc-slide[data-v-27657378] {
        display: none
    }

    .s--slide .mobile-n-slide[data-v-27657378] {
        position: absolute;
        left: -10px;
        border: none;
        top: 5px;
        display: block
    }
}

.optional-popover {
    padding: 0;
    border: none
}

.optional-picker-popover--slide-down-enter-active,.optional-picker-popover--slide-down-leave-active {
    transition-property: opacity,-webkit-transform;
    transition-property: opacity,transform;
    transition-property: opacity,transform,-webkit-transform;
    transition-duration: .3s;
    transition-timing-function: ease
}

.optional-picker-popover--slide-down-enter,.optional-picker-popover--slide-down-leave-to {
    opacity: 0;
    -webkit-transform: translate3d(0,-40px,0);
    transform: translate3d(0,-40px,0)
}

.row-bg [data-v-566dcf32] {
    box-sizing: border-box
}

.pos-wrapper[data-v-566dcf32] {
    width: 140px;
    flex-wrap: wrap;
    justify-content: center;
    margin-right: 50px
}

.pos-wrapper .pos[data-v-566dcf32] {
    height: 34px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    width: 100%
}

.pos-wrapper .pos span[data-v-566dcf32] {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .4px;
    color: #475669;
    width: 50%;
    max-width: 50%;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    cursor: pointer;
    border: 1px solid rgba(52,53,56,.1);
    background-color: #fff;
    border-left: 0;
    transition: all .2s ease-out
}

.pos-wrapper .pos span[data-v-566dcf32]:first-child {
    border-left: 1px solid rgba(52,53,56,.1);
    border-radius: 4px 0 0 4px
}

.pos-wrapper .pos span[data-v-566dcf32]:last-child {
    border-radius: 0 4px 4px 0
}

.pos-wrapper .pos span[data-v-566dcf32]:hover {
    color: #20a0ff
}

.pos-wrapper .pos span.actived[data-v-566dcf32] {
    color: #fff;
    background-color: #20a0ff;
    border-color: #20a0ff;
    box-shadow: -1px 0 0 0 #20a0ff
}

.transparent-color[data-v-566dcf32] {
    background: url(/img/transparent_bg.png);
    background-size: 100%;
    border: 1px solid #e6e6e6;
    width: 19px;
    height: 19px;
    margin-left: -1px;
    margin-right: 0
}

.co-color-selected[data-v-566dcf32] {
    display: flex;
    align-items: center;
    padding: 15px 10px
}

.co-color-selected .top[data-v-566dcf32] {
    padding: 0 10px;
    font-size: 0
}

.co-color-selected .top>span[data-v-566dcf32] {
    display: inline-block
}

.co-color-selected .top>.wrapper[data-v-566dcf32] {
    min-width: 380px;
    height: 38px
}

.co-color-selected .top>.wrapper>span[data-v-566dcf32],.co-color-selected .top>span>span[data-v-566dcf32] {
    display: inline-block;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    margin: 6px;
    cursor: pointer;
    box-shadow: 0 2px 6px 0 rgba(0,0,0,.1);
    overflow: hidden
}

.co-color-selected .top .active[data-v-566dcf32] {
    box-shadow: 0 0 0 3px #1485ff
}

.co-color-selected .top[data-v-566dcf32]:after {
    content: attr(after-text);
    display: block;
    text-align: center;
    font-size: 12px;
    font-family: PingFangSC,inherit;
    font-weight: 600;
    letter-spacing: 1.2px;
    line-height: 1;
    color: rgba(34,34,34,.25);
    margin-top: 4px
}

.co-color-selected .reverse-btn[data-v-566dcf32] {
    margin-right: 15px
}

.co-color-selected .reverse-btn .iconfont[data-v-566dcf32] {
    font-size: 12px
}

.co-color-selected .s-n-btn[data-v-566dcf32] {
    width: 50px;
    height: 34px;
    border-radius: 4px;
    border: 1px solid rgba(52,53,56,.1);
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 32px;
    letter-spacing: .4px;
    color: #475669;
    text-align: center;
    transition: all .2s ease-out;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 0
}

.co-color-selected .s-n-btn.is-plain[data-v-566dcf32] {
    border-color: rgba(52,53,56,.1)
}

.co-color-selected .s-n-btn[data-v-566dcf32]:focus,.co-color-selected .s-n-btn[data-v-566dcf32]:hover {
    border-color: #20a0ff;
    color: #20a0ff
}

:lang(en) .s-n-btn[data-v-566dcf32] {
    width: 50px
}

.custom-color-picker[data-v-566dcf32] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-right: 40px
}

.custom-color-picker .el-color-picker .el-color-picker__trigger[data-v-566dcf32] {
    padding: 6px 14px
}

.custom-color-picker .text-intro[data-v-566dcf32] {
    text-align: center;
    font-size: 12px;
    color: #bdbdbd;
    padding-top: 2px
}

span.optional-color[data-v-566dcf32] {
    display: inline-block;
    width: 21px;
    height: 21px;
    margin: 2px;
    border-radius: 2px;
    position: relative
}

span.optional-color.plus[data-v-566dcf32] {
    border: 1px dashed #ccc;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer
}

span.optional-color.plus[data-v-566dcf32]:after {
    content: "+";
    font-size: 18px;
    position: absolute;
    line-height: 0;
    left: 3.5px;
    top: 8px
}

span.optional-color[data-v-566dcf32]:hover {
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
}

.icon-tip .tip-name[data-v-566dcf32] {
    float: left;
    line-height: 45px;
    font-size: 16px;
    margin-right: 10px
}

.icon-tip .tip-color[data-v-566dcf32] {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin: 5px 4px;
    cursor: pointer;
    overflow: hidden
}

@media only screen and (max-width:600px) {
    .icon-tip .tip-color[data-v-566dcf32] {
        margin: 5px
    }
}

.icon-tip .tip-color[data-v-566dcf32]:hover {
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
}

.i-co-l[data-v-566dcf32] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center
}

.ai-btn[data-v-566dcf32] {
    width: 50px;
    height: 34px;
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .4px;
    color: #475669;
    line-height: 32px;
    padding: 0;
    border-radius: 4px;
    border: 1px solid rgba(52,53,56,.1);
    transition: all .2s ease-out
}

.ai-btn[data-v-566dcf32]:hover {
    border-color: #20a0ff;
    color: #20a0ff
}

.ai-btn img[data-v-566dcf32] {
    height: 16px;
    vertical-align: middle
}

.ai-btn .iconfont[data-v-566dcf32] {
    font-size: 12px
}

@media screen and (max-width:758px) {
    .row-bg[data-v-566dcf32] {
        align-items: center;
        justify-content: left;
        overflow-x: auto
    }

    .row-bg .i-co-l[data-v-566dcf32] {
        justify-content: left;
        padding: 16px
    }

    .row-bg .co-color-selected[data-v-566dcf32] {
        padding: 0;
        display: flex
    }

    .row-bg .co-color-selected .reverse-btn[data-v-566dcf32] {
        margin-right: 0
    }

    .row-bg .co-color-selected .s-n-btn[data-v-566dcf32] {
        width: 50px;
        height: 35px;
        line-height: 33px;
        font-size: 12px
    }

    .row-bg .co-color-selected .top[data-v-566dcf32] {
        display: flex;
        position: relative;
        margin-top: -15px;
        padding: 0 20px
    }

    .row-bg .co-color-selected .top>span>span[data-v-566dcf32] {
        margin: 0 6px
    }

    .row-bg .co-color-selected .top[data-v-566dcf32]:after {
        position: absolute;
        top: 32px;
        left: 0;
        right: 0;
        margin-top: 0
    }

    .row-bg .co-color-selected .top .wrapper[data-v-566dcf32] {
        white-space: nowrap;
        overflow: hidden;
        width: 100vw
    }

    .row-bg .co-color-selected .top .wrapper span[data-v-566dcf32] {
        margin: 0 6px
    }

    .ai-btn[data-v-566dcf32] {
        width: 50px;
        height: 35px;
        line-height: 35px;
        font-size: 12px
    }
}

.addBtn[data-v-b5f66cb2] {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 44px;
    height: 44px;
    position: absolute;
    z-index: 1000;
    left: -1px;
    top: -1px;
    font-size: 24px;
    color: #c3c3c3;
    cursor: pointer;
    transition: all .2s ease-out
}

.addBtn .iconfont[data-v-b5f66cb2] {
    font-size: 18px
}

.addBtn:hover .iconfont[data-v-b5f66cb2] {
    color: #20a0ff
}

p.S_ShareAndGetFreeLogo[data-v-b5f66cb2] {
    display: none;
    padding: 10px;
    background: #fff;
    left: unset;
    right: 0;
    width: 180px;
    position: absolute;
    font-size: 12px;
    color: #333;
    border: 1px solid #d1d9e5;
    z-index: 1;
    border-radius: 2px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.12),0 0 6px 0 rgba(0,0,0,.04);
    font-family: Helvetica Neue,PingFang SC,Microsoft YaHei!important;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    bottom: unset;
    top: 65px;
    line-height: 20px;
    text-align: center
}

p.S_ShareAndGetFreeLogo.t[data-v-b5f66cb2] {
    bottom: 10px
}

p.S_ShareAndGetFreeLogo .zan[data-v-b5f66cb2] {
    font-size: 22px
}

p.S_ShareAndGetFreeLogo .queen[data-v-b5f66cb2] {
    width: 18px;
    height: auto;
    float: left;
    margin: 0
}

p.S_ShareAndGetFreeLogo b[data-v-b5f66cb2] {
    margin-left: 5px
}

p.S_ShareAndGetFreeLogo .ShareAndGetFreeLogo-icon[data-v-b5f66cb2] {
    position: absolute;
    top: -6px;
    width: 11px;
    height: 6px;
    left: 28px;
    right: unset;
    margin: auto;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

#smallCopyright[data-v-b5f66cb2] {
    line-height: 26px;
    text-align: center;
    background: rgba(0,132,233,.5);
    position: absolute;
    right: -7px;
    top: -2px;
    color: #fff;
    font-size: 14px;
    z-index: 100;
    padding: 3px;
    cursor: pointer
}

#smallCopyright img[data-v-b5f66cb2] {
    width: 12px;
    height: auto;
    float: left
}

.symbol-area[data-v-b5f66cb2] {
    display: flex;
    flex-direction: column
}

.symbol-area .symbol-search[data-v-b5f66cb2] {
    justify-content: center;
    width: 100%;
    align-content: center;
    padding: 10px;
    align-items: center;
    font-size: 0;
    box-sizing: border-box
}

.symbol-area .symbol-search .symbol-input[data-v-b5f66cb2] {
    max-width: 900px
}

.symbol-area .symbol-search .symbol-input .prepend-wrapper[data-v-b5f66cb2] {
    display: flex;
    height: 100%
}

.symbol-area .symbol-search .symbol-input .prepend-wrapper .el-select[data-v-b5f66cb2] {
    display: inline-block;
    width: 50%;
    margin: 0
}

.symbol-area .symbol-search .symbol-input .symbols[data-v-b5f66cb2] {
    display: flex;
    flex-direction: row;
    text-align: center;
    justify-content: center;
    font-size: 0
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol[data-v-b5f66cb2] {
    position: relative;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(52,53,56,.1);
    display: inline-block;
    margin: 0 6px;
    border-radius: 4px;
    transition: all .2s ease-out
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol[data-v-b5f66cb2]:first-child {
    margin-left: 0
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol[data-v-b5f66cb2]:last-child {
    margin-right: 0
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol.filled[data-v-b5f66cb2] {
    background: #fff;
    border: 1px solid rgba(52,53,56,.1);
    padding: 5px
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol.select[data-v-b5f66cb2] {
    border: 2px solid #20a0ff
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol[data-v-b5f66cb2]:hover {
    box-shadow: 0 0 4px rgba(0,0,0,.15)
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol img[data-v-b5f66cb2] {
    width: 100%;
    height: 100%;
    display: block
}

.symbol-area .symbol-search .symbol-input .symbols .favorite-symbol img[data-v-b5f66cb2]:hover {
    cursor: pointer;
    opacity: .2
}

.grid-cell[data-v-b5f66cb2] {
    display: inline-block;
    padding: 26px
}

.s-n-btn[data-v-b5f66cb2] {
    width: 76px;
    height: 34px;
    border-radius: 4px;
    border: 1px solid rgba(52,53,56,.1);
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 32px;
    letter-spacing: .4px;
    color: #475669;
    text-align: center;
    transition: all .2s ease-out;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 0
}

.s-n-btn.is-plain[data-v-b5f66cb2] {
    border-color: rgba(52,53,56,.1)
}

.s-n-btn.is-disabled.is-plain[data-v-b5f66cb2] {
    border-color: rgba(52,53,56,.05);
    color: rgba(52,53,56,.2)
}

.s-n-btn[data-v-b5f66cb2]:not(.is-disabled):focus,.s-n-btn[data-v-b5f66cb2]:not(.is-disabled):hover {
    border-color: #20a0ff;
    color: #20a0ff
}

.s-n-btn.s-size[data-v-b5f66cb2] {
    margin-left: 20px;
    margin-right: 12px
}

.sli-title[data-v-b5f66cb2] {
    font-family: PingFangSC,inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.2px;
    color: rgba(52,53,56,.5);
    margin-bottom: 2px
}