body,
html,
p,
ul,
li {
    margin: 0;
    padding: 0;
}

*,
:after,
:before {
    box-sizing: border-box;
}

html {
    font-size: 28.5px;
}

@media (max-width: 576px) {
    html {
        font-size: 17.5px;
    }
}

body {
    font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, "\5FAE\8F6F\96C5\9ED1", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: #515a6e;
    background-color: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a {
    color: #2d8cf0;
    background: transparent;
    text-decoration: none;
    outline: none;
    cursor: pointer;
    transition: color .2s ease;
}

#app {
    width: 100%;
    height: 100%;
    margin-right: auto;
    margin-left: auto;
}

.container{
    width: 100%;
    max-width: 400px;
    height: 100%;
    min-height: 100vh;
    margin: 0 auto;
}
.img-box img {
    width: 100%;
    height: 12.5rem;
}

.main-box {
    padding-bottom: 3rem;
}

.main-box .search {
    width: 80%;
    margin: 0 auto;
}

.main-box .search .input-box {
    position: relative;
    margin-bottom: 1.1429rem;
    margin-top: 1.2143rem;
}

.main-box .search .input-box input {
    display: block;
    height: 2.7143rem;
    line-height: 2.7143rem;
    width: 100%;
    color: #333;
    background-color: #fff;
    background-image: none;
    border: .0714rem solid #e4eaec;
    border-radius: .2857rem;
    font-size: .9714rem;
    padding: .4286rem .5714rem;
}

.main-box .search .input-box input:focus {
    border-color: #62a8ea;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: 0
}

.main-box .search .search-btn {
    display: block;
    width: 100%;
    height: 2.7143rem;
    line-height: 2.7143rem;
    border-radius: .2857rem;
    text-align: center;
    color: #fff;
    font-size: .9714rem;
    letter-spacing: 5px;
    background-color: rgb(0, 177, 88);
    border: 0;
}

footer {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 0 0 .7143rem;
    font-size: .7143rem;
    text-align: center;
    color: #bbbec6;
}


/* // +---------------------------------------------------------------------- */
/* // | 查询结果
/* // +---------------------------------------------------------------------- */
#container {
    position: relative;
    min-height: 100vh;
    padding-bottom: 2.875rem;
    background-color: #f7f7f7;
}
#container #header-box>div.right.red {
    background-color: #d71f17;
    color: #d71f17;
}
#container #header-box>div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 7.375rem;
}
#container #header-box>div.right div {
    display: flex
;
    justify-content: center;
    align-items: center;
    font-size: 2.125rem;
}
#container #header-box>div>div {
    width: 5.5rem;
    height: 5.5rem;
    border-radius: 100%;
    background-color: #fff;
}
#container #header-box>div.error {
    background-color: #d71f17
}

#container #header-box>div.error .miss-icon img {
    width: 100%
}

#container #main {
    width: 96%;
    padding: .5rem 0;
    margin: 0 auto;
}
#container #main #success .rusule {
    margin-bottom: .5rem;
    padding: .875rem;
    border-radius: .25rem;
    background-color: #fff;
}
#container .rusule {
    display: flex
;
    align-items: flex-start;
    font-size: .875rem;
    text-indent: 1.5rem;
    text-align: justify;
    word-break: break-all;
}
#container .rusule .audio-icon {
    position: relative;
    width: 0;
    height: 1.1875rem;
    vertical-align: middle;
}
#container .rusule .audio-icon img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    display: block;
    height: .9375rem;
}

#container #main #success .detail {
    padding: 0 .875rem;
    background-color: #fff;
    border-radius: .25rem;
    margin-bottom: .5rem;
}
#container #main #success .detail .box-shadow {
    background-color: #fff;
    border-radius: .25rem;
    padding: 1rem 0 .5rem;
    font-size: .875rem;
}
#container #main #success .detail .box-shadow .label {
    display: flex
;
    justify-content: center;
    align-items: center;
    margin-bottom: 1.125rem;
}
#container #main #success .detail .box-shadow .label img {
    max-width: 10.625rem;
}
#container #main #success .detail .box-shadow table tr td:first-child {
    white-space: nowrap;
    max-width: 30%;
    vertical-align: top;
}
#container #main #success .detail .box-shadow table tr td {
    padding: 4px 0;
}
#container #main #success .detail .query {
    padding: .75rem 0 .875rem;
    font-size: .8571rem;
    border-top: 1px solid #eee;
}
#container #main #success .detail .query span {
    font-size: .8125rem;
    color: #9196a4;
}

#container #main #success .query-log-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #9196a4;
    margin-bottom: .3125rem;
    padding: 0 .875rem;
    font-size: .875rem
}

#container #main #success .query-log-head div:first-child span {
    margin-right: .3125rem
}

#container #main #success .query-log-head .log_btn {
    transition: all 0.3s ease;
}

#container #main #success .query-log-head div:first-child i {
    font-size: 1.1875rem;
}

#container #main #success .query-log-head .counterfeiting {
    color: green
}

#container #main #success .query-log-head .counterfeiting i {
    font-size: 1.25rem;
    margin-right: .3125rem
}

#container #main #success .query-log-list {
    list-style: none;
    color: #9196a4;
    font-size: .75rem;
    transition: max-height 0.5s ease, opacity 0.4s ease;
    opacity: 1;
}

#container #main #success .query-log-list.hidden {
    opacity: 0;
}
        

#container #main #success .query-log-list li {
    padding: 0 .625rem;
    background-color: #fff;
    margin-bottom: 10px;
    border-radius: .25rem
}

#container #main #success .query-log-list li>div:first-child {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #eee;
    padding: .3125rem 0 .25rem
}

#container #main #success .query-log-list li>div:first-child>div {
    display: flex;
    justify-content: flex-start;
    align-items: center
}

#container #main #success .query-log-list li>div:first-child>div>:first-child {
    color: #515a6e
}

#container #main #success .query-log-list li>div:first-child>div span {
    display: inline-block;
    line-height: 1rem
}

#container #main #success .query-log-list li>div:first-child i {
    margin: 0 8px
}

#container #main #success .query-log-list li>div:first-child>span {
    display: block;
    color: #fff;
    width: 3rem;
    border-radius: 1.875rem;
    text-align: center;
    height: 1rem;
    line-height: 1rem;
    font-size: .75rem
}

#container #main #success .query-log-list li>div:first-child>span.message {
    background-color: #ffa2d3
}

#container #main #success .query-log-list li>div:first-child>span.wechat {
    background-color: #7dd11e
}

#container #main #success .query-log-list li>div:first-child>span.website {
    background-color: #2d8cf0
}

#container #main #success .query-log-list li>div:first-child>span.mobile {
    background-color: #f4a11d
}

#container #main #success .query-log-list li>div:first-child>span.alipay {
    background-color: #27a3db
}

#container #main #success .query-log-list li>div:first-child>span.qq {
    background-color: #2f54eb
}

#container #main #success .query-log-list li>div:nth-child(2) {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: .125rem;
    padding: .1875rem 0 .25rem
}

#container #main #success .more {
    font-size: .8125rem;
    text-align: center;
    text-decoration: underline;
    color: #9196a4
}

#container #main #success .more a{
    color: #9196a4 !important
}

#container #main #error .rusule {
    width: 100%;
    margin: 0 auto .5rem;
    padding: 1rem 1.125rem;
    font-size: .875rem;
    background-color: #fff;
    border-radius: .375rem
}

#container #main #error .tip {
    width: 100%;
    margin: 0 auto .5rem;
    padding: 1rem 1.125rem;
    font-size: .8571rem;
    background-color: #fff;
    border-radius: .375rem;
    color: #8a8d93;
    color: #9a9da2
}

#container #main #error .tip .title {
    position: relative;
    text-align: center;
    margin-bottom: .75rem;
    font-size: 1rem
}

#container #main #error .tip .title:before {
    content: "";
    width: 80%;
    height: 1px;
    background-color: #d71f17;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: auto
}

#container #main #error .tip .title span {
    position: relative;
    display: inline-block;
    padding: 0 1.5rem;
    background-color: #fff;
    color: #d71f17
}

#container #main #error .tip ul {
    list-style: none;
    font-size: .75rem
}

#container #main #error .tip ul li i {
    font-size: 1rem
}

#container #main #error .counterfeiting {
    display: flex;
    justify-content: flex-end;
    color: green
}

#container #main #error .counterfeiting i {
    font-size: 1.25rem;
    margin-right: .3125rem
}

#container footer {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 0 0 .6875rem;
    font-size: .75rem;
    text-align: center;
    color: #bbbec6
}

#container .max-queries-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 7;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 11
}

#container .max-queries-popup .box {
    position: relative;
    width: 80%;
    background-color: #d71f17;
    border-radius: .3125rem;
    padding: 2.625rem 0 0;
    text-align: center;
    overflow: hidden
}

#container .max-queries-popup .box .close {
    position: absolute;
    top: .625rem;
    right: .625rem;
    font-size: 1.5625rem;
    color: #fff
}

#container .max-queries-popup .box .head {
    display: flex;
    justify-content: center;
    align-items: center
}

#container .max-queries-popup .box .head span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 7.25rem;
    height: 7.25rem;
    border-radius: 100%;
    background-color: #fff;
    font-size: 3.125rem;
    color: #d71f17
}

#container .max-queries-popup .box .text01 {
    font-size: .9375rem;
    padding: .625rem 0;
    border-bottom: .125rem solid #fff;
    color: #fff
}

#container .max-queries-popup .box .text02 {
    padding: .625rem 0;
    color: #fff;
    font-size: .875rem
}

#container .max-queries-popup .box .text02 span {
    display: block;
    line-height: 1.5625rem
}

#container .max-queries-popup .box .text02 span:nth-child(2) {
    display: inline-block;
    border-bottom: .0625rem solid #fff
}

#container .max-queries-popup .box .corrent {
    text-align: left;
    background-color: #fff;
    padding: 1.25rem
}

#container .max-queries-popup .box .corrent .counterfeiting {
    display: flex;
    justify-content: flex-end;
    font-size: 1rem;
    color: green
}

#container .max-queries-popup .box .corrent .counterfeiting i {
    font-size: 1.4375rem;
    margin-right: .3125rem
}

#container .max-queries-popup .box .corrent .rusule {
    margin-bottom: 0
}

#container .max-queries-popup .mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.5)
}

#container .marketing-button {
    position: absolute;
    left: 78%;
    top: 70%;
    width: 20%;
    cursor: pointer;
    z-index: 6
}

#container .marketing-button img {
    width: 100%
}

#container .marketing-popup {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 7
}

#container .marketing-popup .box {
    position: relative;
    z-index: 6;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

#container .marketing-popup .box .time {
    background: rgba(216,214,214,.5);
    border-radius: 82%;
    position: absolute;
    right: .75rem;
    top: .625rem;
    width: 10%;
    padding-top: 10%;
    text-align: center;
    color: #fff;
    font-size: 1rem
}

#container .marketing-popup .box .time span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

#container .marketing-popup .box .main {
    position: relative;
    width: 100%
}

#container .marketing-popup .box .main .date {
    position: absolute;
    top: 21%;
    left: 0;
    right: 0;
    color: red;
    text-align: center;
    width: 80%;
    margin: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1rem
}

#container .marketing-popup .box .main .image {
    display: block;
    width: 80%;
    margin: 0 auto
}

#container .marketing-popup .box .main .close {
    display: flex;
    justify-content: center;
    width: 13.8%;
    margin: 6% auto 0
}

#container .marketing-popup .box .main .close img {
    width: 100%;
    cursor: pointer
}

#container .marketing-popup .box .main>img {
    display: block;
    width: 92%;
    margin: 0 auto
}

#container .marketing-popup .box .main .input-box {
    position: absolute;
    top: 42%;
    color: red;
    left: 15%;
    text-align: center;
    width: 70%
}

#container .marketing-popup .box .main .input-box input {
    width: 100%;
    height: 2.875rem;
    line-height: 2.875rem;
    color: #333;
    background-color: #fff;
    background-image: none;
    border: .0625rem solid #e4eaec;
    border-radius: .25rem;
    font-size: 1rem;
    padding: .3125rem .875rem
}

#container .marketing-popup .box .main .input-box input:focus {
    border-color: #62a8ea;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: 0
}

#container .marketing-popup .box .main .btn {
    position: absolute;
    bottom: 30%;
    left: 40%;
    text-align: center;
    height: 2.25rem;
    line-height: 2.25rem;
    font-size: 1rem;
    background: #ffe21a;
    color: #835200;
    border-radius: .25rem;
    padding: 0 .875rem;
    box-sizing: border-box
}

#container .marketing-popup .mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.8)
}



@font-face {
    font-family: iconfont;
    src: url('../fonts/iconfont.a2eac21d.woff2') format("woff2");
}
.iconfont {
    font-family: iconfont!important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

@font-face {
    font-family: Ionicons;
    src: url('../fonts/ionicons.143146fa.woff2') format("woff2");
    font-weight: 400;
    font-style: normal
}
.ivu-icon {
    display: inline-block;
    font-family: Ionicons;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    text-rendering: optimizeLegibility;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    vertical-align: -.125em;
    text-align: center
}

.ivu-icon-md-arrow-dropdown:before {
    content: "\F33D";
}
.icon-dajia:before {
    content: "\E62E";
}
.ivu-icon-ios-close-circle-outline:before {
    content: "\F176";
}