@charset "UTF-8";
body{background: #f1f1f1;}
.content1-wrapper{padding:10px;box-sizing: border-box;}
.article-cate-out{background: #fff;padding:10px;box-sizing: border-box;margin-top: 10px;}
.art-cate-grid{display: grid;float: left;width:100%;grid-template-columns: repeat(3,calc((100% - 10px) / 3));gap: 5px;}
.art-cate-links{width:calc(100% - 2px);height: 34px;border:1px solid #d3d3d3;cursor: pointer;transition: 0.2s ease-in-out 0s;}
.art-cate-names{height: 34px;position: relative;}
.art-cate-names > span{display: block;float: left;width:100%;height: 34px;position: absolute;z-index: 30;left: 0;top: 0;transition: 0.2s ease-in-out 0s;}
.art-cate-names > span:first-child{z-index: 31;text-align: center;line-height: 34px;font-size: 14px;}
.art-cate-names > span:last-child{width:0;left:50%;top: 0;height: 34px;background: var(--theme-bg-color--);transition: 0.2s ease-in-out 0s;}
.art-cate-links:hover{border:1px solid var(--theme-bg-color--);}
.art-cate-links:hover > .art-cate-names > span:first-child{color:#ffffff;}
.art-cate-links:hover > .art-cate-names > span:last-child{left:0;width:100%;}
.art-cate-active{border:1px solid var(--theme-bg-color--);background: var(--theme-bg-color--);}
.art-cate-active > .art-cate-names > span:first-child{color:#ffffff;}
.art-cate-active > .art-cate-names > span:last-child{left:0;width:100%;}
.art-content-wrapper{padding:15px;box-sizing: border-box;background: #fff;}
.art-content-title{font-family: 'guanhei';font-size: 20px;text-align: center;font-weight: normal;width:100%;color: #2f2f2f;padding-bottom: 6px;border-bottom: 1px solid #c2c2c2;}
.art-info-data{float: left;width:100%;height: 24px;align-items: center;justify-content: space-around;border-bottom: 1px solid #c2c2c2;padding:4px 0;}
.art-info-data > span{display: block;float: left;width: fit-content;height: 24px;line-height: 24px;font-size: 13px;color:#a1a1a1;}
.art-content-panel{padding: 20px 0;border-bottom: 1px solid #c2c2c2;}
.art-num-total{display: block;float: left;height: 24px;line-height: 24px;font-size: 13px;color:#a1a1a1;text-align: center;border-bottom: 1px solid #c2c2c2;}
.qr-code-box{float: left;width:100%;padding:20px 0 0 0;align-items: center;justify-content: center;}
.qr-code-out{float: left;width:120px;aspect-ratio: 1 / 1;border:1px dashed #c5c5c5;padding:5px;box-sizing: border-box;}
.qr-img-container{width: 100%;height: 100%;background: #f6f6f6;}
.qr-img-container > img{display: block;float: left;width:100%;height: 100%;}
.qr-code-tag{height: 24px;text-align: center;font-size: 13px;line-height: 24px;color: #757575;margin-top:8px;}
.article-tools{height: 36px;margin-top:10px;}
.article-tools > a{display: block;float: left;height: 36px;background: #2961c1;margin-right: 1px;transition: 0.2s ease-in-out 0s;}
.article-tools > a:first-child,.article-tools > a:last-child{width:calc(50% - 22px);background: #2961c1;}
.article-tools > a:nth-child(2){width: 42px;height: 36px;}
.article-tools > a:last-child{margin-right: 0;}
.article-tools > a > span{display: block;float: left;width: auto;height: 36px;}
.article-tools > a:first-child > .iconfont,.article-tools > a:last-child > .iconfont{width: 36px;height: 36px;text-align: center;line-height: 36px;color: #f3f3f3;font-size: 24px;transition: 0.2s ease-in-out 0s;}
.article-tools > a:first-child > span:nth-child(2),.article-tools > a:last-child > span:nth-child(1){width:calc(100% - 36px);height: 36px;line-height: 36px;color:#f3f3f3;transition: 0.2s ease-in-out 0s;text-align: center;font-size: 14px;}
.article-tools > a:last-child > .iconfont{float: right;}
.article-tools > a:nth-child(2){text-align: center;line-height: 36px;font-size: 22px;color:#fff;cursor: pointer;transition: 0.2s ease-in-out 0s;}
.article-tools > a:hover{background: var(--theme-bg-color--);}
.art-recomd-box{margin-top:20px;}
@media (min-width: 640px){
    .art-content-wrapper{padding:20px;}
    .art-content-title{font-size: 24px;}
    .art-cate-grid{grid-template-columns: repeat(4,calc((100% - 15px) / 4));gap: 5px;}
}
@media (min-width: 768px){
    .art-content-wrapper{padding:30px;}
    .art-content-title{font-size: 28px;}
    .article-tools{width:400px;margin-left: calc(50% - 200px);}
    .art-recomd-box{margin-top:40px;}
    .art-cate-grid{grid-template-columns: repeat(5,calc((100% - 20px) / 5));gap: 5px;}
}
@media (min-width: 992px){
    .art-content-title{padding-bottom: 30px;}
    .art-content-wrapper{padding:40px;}
    .art-recomd-box{margin-top:60px;}
    .art-cate-grid{display: block;float: left;width:100%;}
    .art-cate-links{display: block;float: left;width:138px;margin-right: 5px;margin-bottom: 5px;}
    .article-cate-out{padding-bottom: 5px;margin-top:20px;}
    .web-path-box,.art-content-out,.article-cate-out{width:960px;margin-left: calc((100% - 960px) / 2);}
    .art-content-out{margin-top:20px;}
    .article-tools{margin-top:20px;}
}
@media (min-width: 1200px){
    .web-path-box,.art-content-out,.article-cate-out{width:1160px;margin-left: calc(50% - 580px);}
}
@media (min-width: 1440px){
    .web-path-box,.art-content-out,.article-cate-out{width:1380px;margin-left:calc(50% - 690px);}
}
@media (min-width: 1560px){
    .web-path-box,.art-content-out,.article-cate-out{width:1480px;margin-left: calc(50% - 740px);}
}