@font-face {
    font-family: 'social-sharer';
    src: url("//at.alicdn.com/t/font_zgropjjcewd8to6r.eot");
    src: url("//at.alicdn.com/t/font_zgropjjcewd8to6r.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_zgropjjcewd8to6r.woff") format("woff"), url("//at.alicdn.com/t/font_zgropjjcewd8to6r.ttf") format("truetype"), url("//at.alicdn.com/t/font_zgropjjcewd8to6r.svg#social-sharer") format("svg")
}

.social-sharer .icon {
    display: inline-block;
    margin: 0 3px;
    width: 30px;
    height: 30px;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    /*border: 1px solid currentColor;*/
    border-radius: 50%;
    vertical-align: middle;
    text-decoration: none;
    transition: .3s
}

.social-sharer .icon:before {
    font-family: 'social-sharer';
    font-weight: normal;
    font-style: normal;
    font-size: 18px;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga'
}

.social-sharer .icon:hover {
    color: #fff
}

.social-sharer .icon-weibo {
    color: #E6162D;
    border-color: #E6162D
}

.social-sharer .icon-weibo:before {
    content: ""
}

.social-sharer .icon-weibo:hover {
    background-color: #E6162D
}

.social-sharer .icon-qzone {
    color: #F3B73D;
    border-color: #F3B73D
}

.social-sharer .icon-qzone:before {
    content: ""
}

.social-sharer .icon-qzone:hover {
    background-color: #F3B73D
}

.social-sharer .icon-renren {
    color: #0070CE;
    border-color: #0070CE
}

.social-sharer .icon-renren:before {
    content: ""
}

.social-sharer .icon-renren:hover {
    background-color: #0070CE
}

.social-sharer .icon-qq {
    color: #28A8E2;
    border-color: #28A8E2
}

.social-sharer .icon-qq:before {
    content: ""
}

.social-sharer .icon-qq:hover {
    background-color: #28A8E2
}

.social-sharer .icon-wechat {
    color: #0cc417;
    border-color: #0cc417
}

.social-sharer .icon-wechat:before {
    content: ""
}

.social-sharer .icon-wechat:hover {
    background-color: #0cc417
}

.social-sharer .icon-douban {
    color: #007706;
    border-color: #007706
}

.social-sharer .icon-douban:before {
    content: ""
}

.social-sharer .icon-douban:hover {
    background-color: #007706
}

.social-sharer .icon-facebook {
    color: #3b5999;
    border-color: #3b5999
}

.social-sharer .icon-facebook:before {
    content: ""
}

.social-sharer .icon-facebook:hover {
    background-color: #3b5999
}

.social-sharer .icon-twitter {
    color: #1da1f2;
    border-color: #1da1f2
}

.social-sharer .icon-twitter:before {
    content: ""
}

.social-sharer .icon-twitter:hover {
    background-color: #1da1f2
}

.social-sharer .icon-linkedin {
    color: #0077B6;
    border-color: #0077B6
}

.social-sharer .icon-linkedin:before {
    content: ""
}

.social-sharer .icon-linkedin:hover {
    background-color: #0077B6
}

.social-sharer .icon-gplus {
    color: #dd4b39;
    border-color: #dd4b39
}

.social-sharer .icon-gplus:before {
    content: ""
}

.social-sharer .icon-gplus:hover {
    background-color: #dd4b39
}

.social-sharer .icon-evernote {
    color: #79C13A;
    border-color: #79C13A
}

.social-sharer .icon-evernote:before {
    content: ""
}

.social-sharer .icon-evernote:hover {
    background-color: #79C13A
}

.social-sharer .icon-yingxiang {
    color: #79C13A;
    border-color: #79C13A
}

.social-sharer .icon-yingxiang:before {
    content: ""
}

.social-sharer .icon-yingxiang:hover {
    background-color: #79C13A
}

.social-sharer .icon-email {
    color: #1C9FF7;
    border-color: #1C9FF7
}

.social-sharer .icon-email:before {
    content: ""
}

.social-sharer .icon-email:hover {
    background-color: #1C9FF7
}

.social-sharer .icon-webshare {
    color: #00BCD4;
    border-color: #00BCD4
}

.social-sharer .icon-webshare:before {
    content: ""
}

.social-sharer .icon-webshare:hover {
    background-color: #00BCD4
}

.social-sharer .qrcode-box {
    position: absolute;
    bottom: 100%;
    margin-bottom: 20px;
    left: -65px;
    width: 160px;
    padding: 20px 0;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
    text-align: center;
    font-size: 12px;
    cursor: default;
    opacity: 0;
    visibility: hidden;
    transform: scale(0.5);
    transform-origin: 50% 100%;
    transition: .3s
}

.social-sharer .qrcode-box:after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 50%;
    margin-left: -10px;
    border: 10px solid transparent;
    border-top-color: #fff;
    width: 0;
    height: 0
}

.social-sharer .qrcode-box h4 {
    font-size: 1em;
    line-height: 1;
    margin: 0
}

.social-sharer .qrcode-box img {
    display: block;
    width: 160px;
    height: 160px
}

.social-sharer .qrcode-box p {
    margin: 0;
    color: #666;
    line-height: 1
}

.social-sharer .icon-wechat {
    position: relative
}

.social-sharer .icon-wechat:hover .qrcode-box {
    color: #222;
    opacity: 1;
    visibility: visible;
    transform: none
}

.footer-social a{
    color: var(--primary-color5)!important;
}

.footer-social a:hover{
    color: #ffffff!important;
}