.login-panel-mask {
    background-color:rgba(0,0,0,.1);
    position:fixed;
    width:100%;
    height:100vh;
    top:0;
    left:0;
    z-index:20;
    content:"viewport-units-buggyfill;
    height:100vh"
}
.login-panel-container {
    position:absolute;
    background-color:#fff;
    width:682px;
    padding-top:454px;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    -webkit-justify-content:center;
    justify-content:center;
    box-shadow:0 8px 24px rgba(0,0,0,.16);
    border-radius:8px
}
.login-panel-inner {
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0
}
.login-panel-inner .login-tip-container {
    position:absolute;
    padding-top:10%;
    width:100%
}
.login-panel-inner .login-tip-container .tip {
    color:#242424;
    font-family:Microsoft YaHei;
    font-style:normal;
    font-weight:600;
    font-size:28px;
    text-align:center;
    line-height:30px;
    margin-bottom:20px
}
.login-panel-inner .login-tip-container .sub-tip {
    color:#8f8f8f;
    font-size:12px;
    text-align:center;
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    -webkit-justify-content:center;
    justify-content:center
}
.login-panel-inner .login-tip-container .sub-tip input {
    display:none
}
.login-panel-inner .login-tip-container .sub-tip a {
    text-decoration:none;
    color:#136ce9
}
.login-panel-inner .login-tip-container .sub-tip label {
    display:inline-block;
    width:16px;
    height:16px;
    border-radius:50%;
    border:1px solid #b3b3b3;
    position:relative;
    cursor:pointer;
    margin-right:5px;
    box-sizing:border-box
}
.login-panel-inner .login-tip-container .sub-tip label:before {
    display:inline-block;
    content:" ";
    width:8px;
    height:4px;
    border:2px solid #fff;
    border-top:none;
    border-right:none;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    top:4px;
    left:3px;
    position:absolute;
    opacity:0
}
.login-panel-inner .login-tip-container .sub-tip input:checked+label {
    background:#3697fd;
    border:0
}
.login-panel-inner .login-tip-container .sub-tip input:checked+label:before {
    opacity:1;
    -webkit-transform:all .5s;
    transform:all .5s
}
.login-panel-inner .login-tip-container .sub-tip input.warn+label {
    border-color:red
}
.login-panel-inner .login-tip-container .sub-tip input:checked.warn+label {
    border-color:#b3b3b3
}
.login-panel-close-btn {
    position:absolute;
    right:10px;
    top:10px;
    cursor:pointer
}
.login-btn-container {
    width:80%;
    height:100%;
    margin:0 auto;
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    -webkit-justify-content:center;
    justify-content:center;
    -webkit-flex-direction:column;
    flex-direction:column
}
.login-btn-container[data-lasttype=qq] .login-btn[data-type=qq]:after,.login-btn-container[data-lasttype=wx] .login-btn[data-type=wx]:after {
    content:"";
    right:-10px;
    top:-7px;
    position:absolute;
    width:61px;
    height:25px;
    background-image:url(https://m4.publicimg.browser.qq.com/publicimg/nav/qbtool/last-login-tip.png);
    background-size:cover;
    background-repeat:no-repeat
}
.login-btn {
    height:50px;
    width:55%;
    border-radius:4px;
    color:#fff;
    line-height:50px;
    text-align:center;
    cursor:pointer;
    font-size:16px;
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    -webkit-justify-content:center;
    justify-content:center;
    position:relative
}
.login-btn span {
    margin-left:12px
}
.login-btn[data-type=wx] img {
    width:27px;
    height:23px
}
.login-btn[data-type=qq] img {
    width:22px;
    height:25px
}
.login-btn[data-type=wx] {
    background-color:#2cc469;
    margin-top:10px
}
.login-btn[data-type=qq] {
    background-color:#3697fd;
    margin-top:10px
}
.login-panel-container[data-mobile=true] {
    width:341px;
    padding-top:277px
}
.login-footer {
    position:absolute;
    bottom:12px;
    right:14px;
    left:0;
    text-align:right;
    font-size:12px;
    color:#8f8f8f;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:space-between;
    justify-content:space-between
}
.login-footer a {
    color:#000;
    text-decoration:none
}
.login-footer .auto-login-container {
    display:none;
    margin-left:16px;
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center
}
.login-footer .auto-login-container input {
    display:none
}
.login-footer .auto-login-container label {
    display:inline-block;
    width:16px;
    height:16px;
    border-radius:2px;
    border:1px solid #b3b3b3;
    position:relative;
    cursor:pointer;
    margin-right:4px;
    box-sizing:border-box
}
.login-footer .auto-login-container input:checked+label {
    background:#3697fd;
    border:0
}
.login-footer .auto-login-container label:before {
    display:inline-block;
    content:" ";
    width:8px;
    height:4px;
    border:2px solid #fff;
    border-top:none;
    border-right:none;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    top:4px;
    left:3px;
    position:absolute;
    opacity:0
}
.login-footer .auto-login-container input:checked+label:before {
    opacity:1;
    -webkit-transform:all .5s;
    transform:all .5s
}
.qbtool-share-mask {
    position:fixed;
    display:none;
    width:100%;
    height:100%;
    z-index:21;
    top:0;
    left:0
}
.modal {
    width:360px;
    height:200px;
    background-image:url(https://m4.publicimg.browser.qq.com/publicimg/pcqb/qbtool/tool-share-panel.png);
    background-size:100% 100%;
    background-position:50%;
    background-repeat:no-repeat;
    overflow:hidden;
    position:absolute;
    border-radius:8px;
    bottom:0;
    left:50%;
    display:none;
    padding-top:8px;
    z-index:20;
    -webkit-transform:translate(-71%,100%);
    transform:translate(-71%,100%)
}
.modal .channel-container {
    width:682px;
    height:100%;
    overflow:hidden;
    display:inline-block
}
.modal .channel-list {
    display:-webkit-flex;
    display:flex;
    height:100%;
    -webkit-align-items:center;
    align-items:center;
    -webkit-justify-content:center;
    justify-content:center
}
.modal .channel-list .channel-item {
    position:relative;
    margin-right:40px
}
.modal .channel-list .channel-item:nth-child(2) {
    margin-right:0
}
.modal .channel-list .channel-item img {
    width:120px;
    height:120px
}
.modal .channel-list .channel-item .text {
    text-align:center;
    margin-top:10px;
    font-weight:400;
    font-size:14px;
    line-height:18px;
    color:#000
}
.modal .channel-list .channel-item .copy-succ-tip {
    position:absolute;
    bottom:-14px;
    left:50%;
    -webkit-transform:translate(-50%,100%);
    transform:translate(-50%,100%);
    background:#fff;
    border:1px solid #d4d6d9;
    box-shadow:0 8px 24px rgba(0,0,0,.16);
    border-radius:8px;
    line-height:36px;
    width:116px;
    text-align:center;
    font-size:12px;
    color:#242424
}
.qrcode-container {
    display:inline-block;
    overflow:hidden;
    position:relative
}
.qrcode-container .main-text {
    margin-top:89px;
    text-align:center;
    color:#242424;
    font-size:24px
}
.qrcode-container .sub-text {
    color:#242424;
    font-size:14px;
    text-align:center
}
.qrcode-container .qrcode-box {
    width:140px;
    height:140px;
    border:1px solid #d4d6d9;
    border-radius:4px;
    margin:34px auto
}
.qrcode-container .qrcode-box img {
    width:100%
}
.share-tip {
    padding:10px 20px;
    position:absolute;
    top:10px;
    right:25px;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:flex-start;
    justify-content:flex-start;
    -webkit-align-items:left;
    align-items:left;
    background:#fff;
    border-radius:10px;
    border-top-right-radius:0
}
.share-tip i {
    display:inline-block;
    width:24px;
    height:24px;
    margin-left:8px;
    background:url(//upage.imtt.qq.com/upage_cdn_production/img/share/share_right.png) no-repeat 50%;
    background-size:100% 100%
}
body,html,li,ul {
    padding:0;
    margin:0
}
:global #app {
    min-height:200px;
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column;
    -webkit-justify-content:center;
    justify-content:center;
    margin-top:20px;
    position:relative;
    visibility:hidden
}
:global #login-container {
    position:relative;
    margin-right:15px;
    background:linear-gradient(91.96deg,#9350e6 .83%,#3e6ae3 98.34%);
    border-radius:15px;
    color:#fff;
    font-size:12px;
    line-height:26px;
    font-weight:500;
    width:66px;
    text-align:center;
    cursor:pointer;
    -webkit-flex-shrink:0;
    flex-shrink:0
}
:global #login-container.is-login {
    height:40px
}
:global #login-container.is-login img {
    width:100%;
    height:100%;
    border-radius:50%
}
:global #login-container.is-login {
    background:unset;
    padding:0;
    opacity:1;
    width:unset;
    width:40px
}
:global #login-container img {
    width:30px;
    height:30px;
    border-radius:50%
}
:global #login-container.nopc {
    width:1.8rem;
    display:block;
    position:absolute;
    right:0;
    margin-top:10px;
    margin-right:5%;
    z-index:1
}
:global .main-content {
    display:flow-root
}
:global .top-content {
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    width:1140px;
    margin:0 auto
}
:global .top-content #login-container {
    margin-right:0
}
:global .tool-container {
    background:#f6f7fa;
    border-radius:10px;
    width:1140px;
    padding:20px;
    box-sizing:border-box
}
:global .tool-content-container {
    box-sizing:border-box;
    background:#fff;
    border-radius:10px;
    position:relative
}
:global .tool-content-container::-webkit-scrollbar {
    width:3px
}
:global .tool-content-container::-webkit-scrollbar-thumb {
    border-radius:15px;
    background:#e8e8fd
}
:global .tool-content-container .pc-content {
    padding:0 30px 30px;
    overflow:auto
}
:global body[data-pc=false] .tool-container {
    height:unset;
    width:unset;
    padding:10px;
    background:#f6f7fa;
    border-radius:10px;
    display:block
}
:global body[data-pc=false] .tool-content-container {
    padding:0 15px;
    overflow:hidden
}
:global body[data-pc=false] .tool-content-container .mobile-container {
    background:#f6f7fa;
    padding:10px;
    border-radius:10px
}
:global body[data-pc=false] .tool-content-container .mobile-container .mobile-content-top {
    background:#fff;
    border-radius:10px
}
:global body[data-pc=false] .tool-content-container .mobile-container .mobile-content-bottom {
    background:#fff;
    border-radius:10px;
    padding:20px;
    margin-top:20px
}
main {
    width:1140px;
    min-height:-webkit-calc(100vh - 110px);
    min-height:calc(100vh - 110px);
    margin:0 auto;
    box-sizing:border-box;
    position:relative;
    content:"viewport-units-buggyfill;
    min-height:-webkit-calc(100vh -110px);
    min-height:calc(100vh -110px)"
}
@media (min-width:768px) {
    main {
        width:750px
    }
}@media (min-width:992px) {
    main {
        width:1140px
    }
}@media (max-width:767px) {
    main {
        width:100%
    }
}.license {
     display:-webkit-flex;
     display:flex;
     -webkit-align-items:center;
     align-items:center;
     -webkit-justify-content:center;
     justify-content:center;
     margin-bottom:5px
 }
.license a {
    padding:0 5px;
    color:#7b7b7b!important;
    position:relative;
    margin:0!important
}
.license a:first-child {
    padding-right:6px
}
.license a:first-child:after {
    content:"";
    position:absolute;
    right:0;
    width:1px;
    height:12px;
    top:50%;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    background-color:#7b7b7b
}
.license-pc a {
    color:#8f8f8f!important;
    position:relative;
    margin:0!important;
    font-family:PingFang SC;
    font-style:normal;
    font-weight:400;
    font-size:12px;
    line-height:18px
}
.license-pc a:first-child {
    padding-right:12px
}
.license-pc a:first-child:after {
    content:"";
    position:absolute;
    right:0;
    width:1px;
    height:12px;
    top:50%;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    background-color:#8f8f8f
}
.license-pc a:last-child {
    padding-left:11px
}
.left-nav-placeholder {
    float:left
}
.left-nav,.left-nav-placeholder {
    width:240px;
    height:100vh;
    content:"viewport-units-buggyfill;
    height:100vh"
}
.left-nav {
    left:0;
    top:0;
    position:fixed;
    overflow:hidden;
    background:#f6f7fa;
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column
}
.left-nav:hover::-webkit-scrollbar-thumb {
    visibility:visible
}
.left-nav::-webkit-scrollbar {
    width:3px
}
.left-nav::-webkit-scrollbar-thumb {
    border-radius:15px;
    background:#e8e8fd;
    visibility:hidden
}
.left-nav .logo-container {
    text-decoration:none;
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    margin:40px 0 0 30px;
    white-space:nowrap;
    padding-bottom:30px;
    cursor:pointer
}
.left-nav .logo-container img {
    width:30px;
    height:30px;
    margin-right:23px
}
.left-nav .logo-container div {
    color:#000
}
.left-nav .logo-container div span {
    display:block
}
.left-nav .logo-container div .title {
    font-weight:600;
    font-size:20px;
    line-height:30px
}
.left-nav .logo-container div .sub-title {
    font-size:12px
}
.left-nav .left-nav-inner {
    overflow:auto;
    width:100%;
    -webkit-flex:1;
    flex:1
}
.category-container {
    overflow:hidden;
    padding:0;
    margin:0
}
.category-container .category-entry-wrapper {
    margin:20px 10px 0
}
.category-container .category-entry-wrapper:first-child {
    margin-top:0
}
.category-container .category-entry-wrapper:last-child {
    margin-bottom:20px
}
.category-container .category-entry-wrapper .category-entry-item {
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    height:43px;
    text-decoration:none;
    cursor:pointer
}
.category-container .category-entry-wrapper .category-entry-item[data-actived=true] {
    background:#e8e8fd;
    border-radius:10px
}
.category-container .category-entry-wrapper .category-entry-item img {
    width:20px;
    height:20px;
    margin-right:10px;
    margin-left:20px
}
.category-container .category-entry-wrapper .category-entry-item span {
    font-size:16px;
    line-height:23px;
    color:#242424
}
.category-subentry-item-container {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction:column;
    flex-direction:column
}
.category-container li {
    position:relative;
    white-space:nowrap;
    list-style:none
}
.category-container li[data-children=true] .category-entry-subentry-icon {
    background-size:cover;
    background-position:50%;
    width:20px;
    height:20px;
    position:absolute;
    right:11px;
    top:11px;
    cursor:pointer
}
.category-container li[data-children=true] .category-subentry-item-container {
    height:0;
    overflow:hidden
}
.category-container li[data-children=true] .category-subentry-item-container .category-subentry-item {
    box-sizing:border-box;
    padding-left:60px;
    margin-top:20px;
    height:43px;
    line-height:43px;
    width:100%;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    text-decoration:none;
    color:#242424;
    position:relative
}
.category-container li[data-children=true] .category-subentry-item-container .category-subentry-item[data-actived=true] {
    background:#e8e8fd;
    border-radius:10px;
    width:100%
}
.category-container li[data-children=true] .category-subentry-item-container .category-subentry-item.category-entry-item__holiday {
    position:relative
}
.category-container li[data-children=true] .category-subentry-item-container .category-subentry-item .subentry-item-badge {
    position:absolute;
    top:0;
    right:0;
    max-width:80px;
    height:24px;
    background-color:#ff3227;
    font-size:12px;
    font-weight:700;
    color:#fff;
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    -webkit-justify-content:center;
    justify-content:center;
    border-radius:0 10px;
    padding:0 4px
}
.category-container li[data-children=true][data-open=false] .category-entry-subentry-icon {
    background-image:url(https://m4.publicimg.browser.qq.com/publicimg/nav/qbtool/array-down.png)
}
.category-container li[data-children=true][data-open=false] .category-subentry-item-container {
    height:0
}
.category-container li[data-children=true][data-open=true] .category-subentry-item-container {
    height:auto
}
.category-container li[data-children=true][data-open=true] .category-entry-subentry-icon {
    background-image:url(https://m4.publicimg.browser.qq.com/publicimg/nav/qbtool/array-up.png)
}
.bottom-fixed-content {
    width:100%
}
.bottom-fixed-content .bottom-fixed-content-item {
    color:#242424;
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    text-decoration:none;
    height:43px;
    margin-top:10px;
    white-space:nowrap
}
.bottom-fixed-content .bottom-fixed-content-item:first-child {
    margin-top:0
}
.bottom-fixed-content .bottom-fixed-content-item img {
    width:20px;
    height:20px;
    margin-left:30px;
    margin-right:10px
}
.nav-button-wrap {
    position:fixed;
    right:30px;
    bottom:60px;
    z-index:2
}
.nav-button-wrap .nav-button-item {
    width:50px;
    margin-bottom:10px;
    position:relative
}
.nav-button-wrap .nav-button-item,.nav-button-wrap .nav-button-item .qqgroup-tip {
    box-sizing:border-box;
    height:50px;
    background:#fff;
    border:1px solid #e5eafb;
    border-radius:10px
}
.nav-button-wrap .nav-button-item .qqgroup-tip {
    width:151px;
    position:absolute;
    right:55px;
    top:0;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center;
    -webkit-align-items:center;
    align-items:center;
    font-family:PingFang SC;
    font-style:normal;
    font-weight:500;
    font-size:15.2381px;
    line-height:23px;
    color:#242424;
    visibility:hidden
}
.nav-button-wrap .nav-button-item:nth-child(2):hover .qqgroup-tip {
    visibility:visible
}
.nav-button-wrap .nav-button-item:last-child {
    margin-bottom:0
}
.nav-button-wrap a {
    box-sizing:border-box;
    width:100%;
    height:100%;
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center;
    -webkit-align-items:center;
    align-items:center;
    text-decoration:none;
    cursor:pointer
}
.nav-button-wrap a .nav-button-text {
    font-family:PingFang SC;
    font-style:normal;
    font-weight:500;
    font-size:14px;
    line-height:100%;
    color:#242424
}
.nav-button-wrap a .nav-button-img {
    width:14px;
    height:16px
}
.left-nav-placeholder {
    width:0;
    display:none
}
.left-nav {
    width:0;
    -webkit-transition:all .3s ease;
    transition:all .3s ease;
    z-index:50
}
.left-nav.open {
    width:82.05128205%
}
.category-mask {
    width:100%;
    height:100%;
    position:fixed;
    z-index:20;
    background-color:rgba(0,0,0,.4);
    top:0;
    left:0
}
.search-wrapper {
    height:50px;
    margin:30px 20px 30px 0;
    -webkit-flex:1;
    flex:1
}
.search-container {
    position:relative;
    -webkit-align-items:center;
    align-items:center;
    background:#f6f7fa;
    border-radius:30px;
    overflow:hidden;
    /*z-index:20*/
}
.search-container::-webkit-scrollbar {
    width:3px
}
.search-container::-webkit-scrollbar-thumb {
    border-radius:15px;
    background:#e8e8fd
}
.search-container .search-area {
    display:-webkit-flex;
    display:flex;
    height:50px;
    position:relative;
    -webkit-align-items:center;
    align-items:center
}
.search-container .search-area .search-icon {
    width:40px;
    height:40px;
    left:20px
}
.search-container .search-area .search-input {
    border:0;
    outline:none;
    background:#f6f7fa;
    line-height:30px;
    margin-right:20px;
    -webkit-flex-grow:1;
    flex-grow:1;
    color:#242424;
    font-size:16px
}
.search-container .search-area .statistics-container {
    position:absolute;
    top:10px;
    line-height:30px;
    pointer-events:none;
    color:#b3b3b3
}
.search-container .search-area .statistics-container b {
    color:#136ce9
}
.search-container .search-panel {
    width:100%;
    position:relative;
    background:#f6f7fa;
    z-index:1;
    max-height:448px;
    overflow-y:auto
}
.search-container .search-panel:after {
    content:"";
    position:absolute;
    left:20px;
    right:20px;
    top:0;
    height:1px;
    background-color:#e8e9eb
}
.search-container .search-panel .search-panel-item {
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    padding:13px 0;
    text-decoration:none
}
.search-container .search-panel .search-panel-item:hover {
    background-color:#e8eaf0
}
.search-container .search-panel .search-panel-item img {
    width:24px;
    height:24px;
    margin-left:28px;
    margin-right:10px
}
.search-container .search-panel .search-panel-item span {
    font-size:16px;
    line-height:30px;
    color:#242424
}
.search-wrapper {
    margin:42px 15px 15px
}
.search-container .search-area .search-icon {
    margin:0 5px 0 20px
}
.search-container .search-area .statistics-container {
    left:65px
}
.recommend-title {
    margin-top:50px;
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    -webkit-justify-content:center;
    justify-content:center
}
.recommend-title span {
    font-family:PingFang SC;
    font-style:normal;
    font-weight:600;
    font-size:20px;
    line-height:56px;
    text-align:center;
    color:#242424
}
.recommend-container {
    display:-webkit-flex;
    display:flex;
    -webkit-flex-wrap:wrap;
    flex-wrap:wrap
}
.recommend-container .recommend-item {
    display:block;
    text-decoration:none;
    width:360px;
    height:100px;
    background:#fff;
    box-shadow:0 0 10px rgba(0,0,0,.1);
    border-radius:10px;
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    overflow:hidden;
    margin-right:30px;
    margin-top:30px;
    box-sizing:border-box
}
.recommend-container .recommend-item:nth-child(3n) {
    margin-right:0
}
.recommend-container .recommend-item img {
    width:60px;
    height:60px;
    margin-left:20px
}
.recommend-container .recommend-item .recommend-info {
    margin-left:10px
}
.recommend-container .recommend-item .title {
    font-weight:600;
    display:inline-block;
    font-size:16px;
    line-height:20px;
    color:#242424
}
.recommend-container .recommend-item .desc {
    font-style:normal;
    font-weight:400;
    font-size:14px;
    line-height:20px;
    margin-top:10px;
    color:#8f8f8f;
    max-width:240px;
    display:-webkit-box;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis
}
.footer-placeholder {
    height:173px
}
.footer {
    margin-top:66px;
    margin-bottom:12px;
    font-size:13px;
    line-height:20px;
    width:100%;
    position:absolute;
    left:0;
    bottom:0
}
.footer a {
    text-decoration:none;
    color:#136ce9
}
.footer span {
    color:#7b7b7b
}
.footer .link {
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    -webkit-justify-content:center;
    justify-content:center
}
.footer .link .logo {
    width:30px;
    height:30px;
    margin-right:6px
}
.footer .userid-debug-container {
    height:50px
}
.copyright {
    text-align:center
}
.footer-placeholder-pc {
    height:215px
}
.footer-pc {
    position:absolute;
    bottom:0;
    margin-bottom:50px;
    width:1140px
}
.footer-pc .line {
    border:1px solid #f6f7fa;
    height:0;
    width:100%;
    margin:0 auto
}
.footer-pc a {
    text-decoration:none
}
.footer-pc .userid-debug-container {
    height:50px
}
.footer-pc .footer-infor {
    display:-webkit-flex;
    display:flex
}
.footer-pc .footer-infor .license-pc {
    height:18px;
    line-height:18px
}
.footer-pc .footer-infor .footer-introduce {
    font-family:PingFang SC;
    font-style:normal;
    font-weight:600;
    font-size:16px;
    line-height:18px;
    color:#242424;
    height:18px;
    margin-bottom:10px
}
.footer-pc .footer-infor .logo {
    margin-right:30px;
    height:30px;
    width:27px
}
.footer-pc .footer-infor .copyright-pc {
    font-family:PingFang SC;
    font-style:normal;
    font-weight:400;
    font-size:12px;
    line-height:18px;
    color:#8f8f8f;
    box-sizing:border-box
}
.footer-pc .footer-infor .copyright-pc span {
    line-height:18px
}
.footer-pc .footer-infor .qrcode {
    -webkit-flex:1;
    flex:1
}
.footer-pc .footer-infor .qrcode img {
    right:0;
    top:0;
    width:79px;
    height:79px;
    float:right
}
body {
    width:100%
}
main {
    padding:0
}
header {
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    padding-top:35px;
    overflow:hidden
}
header .menu {
    width:30px;
    height:30px;
    margin-left:18px;
    margin-right:18px
}
header .logo-container {
    display:-webkit-flex;
    display:flex;
    -webkit-flex:1;
    flex:1;
    -webkit-align-items:center;
    align-items:center;
    text-decoration:none
}
header .logo-container .logo {
    width:40px;
    height:40px;
    margin-right:13px
}
header .logo-container .title {
    font-weight:600;
    font-size:20px;
    line-height:30px;
    color:#000;
    white-space:nowrap
}
header .logo-container .sub-title {
    font-size:10px;
    white-space:nowrap;
    color:#000
}
header .share-btn {
    width:20px;
    height:20px;
    margin: 8px;
;
}
.category-name {
    font-family:PingFang SC;
    font-style:normal;
    font-weight:400;
    font-size:16px;
    line-height:30px;
    color:#242424;
    padding-left:15px;
    padding-top:15px;
    padding-bottom:16px
}
.toollist {
    position:relative;
    display:grid;
    grid-template-columns:repeat(4,25%);
    -webkit-justify-content:space-evenly;
    justify-content:space-evenly;
    padding:0 15px
}
.tool-item {
    display:block;
    text-decoration:none;
    margin-bottom:40px;
    cursor:default;
    font-family:PingFang SC;
    font-style:normal;
    font-weight:400;
    color:#000;
    position:relative
}
.tool-item .tool-icon {
    width:46px;
    height:46px;
    display:block;
    margin:0 auto
}
.tool-item .name {
    font-family:PingFang SC;
    font-style:normal;
    margin-top:10px;
    font-weight:400;
    font-size:12px;
    line-height:24px;
    text-align:center;
    color:#242424;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis
}
.tool-item[data-style="2"] .name {
    font-weight:600;
    color:red
}
