body{font-family:"微软雅黑";font-size:16px;}
a{text-decoration: none;color: #0d6efd;}
input,textarea:focus{outline: none;}
.text-truncate1{display: -webkit-box;overflow: hidden;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.text-truncate2{display: -webkit-box;overflow: hidden;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.text-truncate3{display: -webkit-box;overflow: hidden;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
.text-truncate4{display: -webkit-box;overflow: hidden;-webkit-line-clamp: 4;-webkit-box-orient: vertical;}
.animate-box{opacity: 0;}

.items-box{padding: 12px 0 12px 0;}
.items-box:has(.row-lists){padding-bottom: 0;}
.items-title{font-size: 18px;}
.items-desc{font-size: 14px;}
.items-title+.items-desc{margin-top: 5px;}
.items-title+.items-conts,.items-desc+.items-conts{margin-top: 12px;}
.row-lists>[class^="col-"],.row-lists>.item{margin-bottom: 12px;}

.callout{border-radius:3px;margin:0 0 15px 0;padding:8px 15px;border-left:4px solid #dee2e6;background-color:#f8f9fa;color:#212529;}
.callout.callout-info{border-color:#5bc0de;background-color:#f4f8fa;color:#087990;}
.callout.callout-danger{border-color:#d9534f;background-color:#fdf7f7;color:#b02a37;}
.callout.callout-warning{border-color:#f0ad4e;background-color:#fcf8f2;color:#997404;}
.callout a{color:#009e3c !important;text-decoration:none !important;}
.callout a:hover{text-decoration:underline !important;}
.callout h3,.callout h4{font-weight:bold;}
.callout p{margin-bottom:8px;}
.callout p:last-child{margin-bottom:0px;}
.highlights code{font-size: inherit;color: inherit;font-family: inherit;border: 1px solid #dedede;margin: 0px 5px;padding: 2px 6px;word-break: break-all;white-space: pre;display: inline-block;border-radius: 4px;}
.highlights strong{padding: 2px 5px;border-bottom: 2px solid #d9534f;color: #333333;display: inline-block;}
.highlights .table td,.highlights .table p{font-size: 14px;margin-bottom: 0;}

.items-box.bg{background-color: #fafafa;}

.navbar{padding: 0;background-color: #ffffff;box-shadow: 0 0px 8px 0 rgb(0, 0, 0, 0.1);}
.navbar-brand{padding: 0;font-size: 0;}
.navbar-brand .logo{height: 34px;}
.navbar-toggler{padding: 25px 25px;position: relative;display: inline-block;cursor: pointer;border: none;border-radius: 0;}
.navbar-toggler .navbar-toggler-icon,.navbar-toggler:before,.navbar-toggler:after{width: 12px;height: 2px;display: inline-block;position: absolute;top: 50%;left: 50%;background-color: #000000;transform: translate(-50%, 0);}
.navbar-toggler.collapsed:before{content: " ";transform: translate(-50%, -200%);}
.navbar-toggler.collapsed:after{content: " ";transform: translate(-50%, 200%);}
.navbar-toggler.collapsed .navbar-toggler-icon{display: inline-block;}
.navbar-toggler:before{content: " ";transform: translate(-50%, 0%) rotate(-45deg);transition: all .3s;}
.navbar-toggler:after{content: " ";transform: translate(-50%, 0%) rotate(45deg);transition: all .3s;}
.navbar-toggler .navbar-toggler-icon{display: none;}
.navbar-toggler:hover{background-color: #f1f1f1;}
.navbar-collapse{flex-grow: unset;}
.navbar-nav .nav-item .nav-link{font-size: 16px;padding: 13px;color: #000000;text-align: center;}
.navbar-nav .nav-item .nav-link.active{color: #00c1de;}
.navbar-nav .nav-item .nav-link:hover{background-color: #f1f1f1;}
.navbar-gap{height: 50px;}

.banner{padding: 40px 0;background: linear-gradient(300deg, #adc9e4 0%, #1e90ff 100%);overflow: hidden;position: relative;}
.banner .box{display: flex;justify-content: center;position: relative;z-index: 1;}
.banner .infos{font-size: 16px;margin-top: 10px;color: #ffffff;position: relative;z-index: 1;}
.typewriter-box{display: flex;align-items: center;}
.typewriter-box .title{font-size: 22px;line-height: 24px;margin-right: 8px;color: #ffffff;font-weight: bold;}
.typewriter-box .text{font-size: 22px;line-height: 24px;background: linear-gradient(to right, #00c1de 0%, #6ee7f9 51%, #00c1de 100%);-webkit-background-clip: text;background-clip: text;color: transparent;animation: typing 3.5s steps(30, end) forwards,blink-caret 0.75s step-end infinite;font-weight: bold;overflow: hidden;border-right: 3px solid #ffffff;white-space: nowrap;}
@keyframes typing{ from { width: 0 } to { width: 100% } }
@keyframes blink-caret{ from, to { border-color: transparent } 50% { border-color: #ffffff } }
.bubbles{position: absolute;width: 100%;height: 100%;z-index: 0;overflow: hidden;top: 0;left: 0;}
.bubble{position: absolute;bottom: -100px;width: 40px;height: 40px;background: #FFF;border-radius: 4px;opacity: 0.1;animation: rise 10s infinite ease-in;}
.bubble:nth-child(1){width: 40px;height: 40px;left: 10%;animation-duration: 8s;}
.bubble:nth-child(2){width: 20px;height: 20px;left: 20%;animation-duration: 5s;animation-delay: 1s;}
.bubble:nth-child(3){width: 50px;height: 50px;left: 35%;animation-duration: 7s;animation-delay: 2s;}
.bubble:nth-child(4){width: 80px;height: 80px;left: 50%;animation-duration: 11s;animation-delay: 0s;}
.bubble:nth-child(5){width: 35px;height: 35px;left: 55%;animation-duration: 6s;animation-delay: 1s;}
.bubble:nth-child(6){width: 45px;height: 45px;left: 65%;animation-duration: 8s;animation-delay: 3s;}
.bubble:nth-child(7){width: 90px;height: 90px;left: 70%;animation-duration: 12s;animation-delay: 2s;}
.bubble:nth-child(8){width: 25px;height: 25px;left: 80%;animation-duration: 6s;animation-delay: 2s;}
.bubble:nth-child(9){width: 15px;height: 15px;left: 70%;animation-duration: 5s;animation-delay: 1s;}
.bubble:nth-child(10){width: 90px;height: 90px;left: 25%;animation-duration: 10s;animation-delay: 4s;}
@keyframes rise{ 0%{bottom: -100px;transform: translateX(0) rotate(0deg);} 50%{transform: translate(100px) rotate(180deg);} 100%{bottom: 1080px;transform: translateX(-200px) rotate(360deg);} }

.list-temp{border-radius: 4px;height: 100%;display: flex;flex-direction: column;overflow: hidden;background-color: #ffffff;box-shadow: 0 0 6px 0 rgb(0, 0, 0, 0.1);transition: all .3s;}
.list-temp:hover{transform: translateY(-5px);}
.list-temp .image{position: relative;display: block;}
.list-temp .image .img{width: 100%;}
.list-temp .detail{padding: 12px;flex: 1;display: block;}
.list-temp .detail .title{font-size: 16px;color: #000000;}
.list-temp .detail .desc{font-size: 14px;color: #999999;}
.list-temp .detail .info{margin-top: 8px;display: flex;justify-content: space-between;align-items: center;}
.list-temp .detail .info .rating{display: flex;align-items: center;}
.list-temp .detail .info .rating .star{font-size: 0;}
.list-temp .detail .info .rating .star i{font-size: 14px;color: #f9bf00;}
.list-temp .detail .info .rating .count{font-size: 12px;margin-left: 2px;color: #999999;}
.list-temp .detail .info .price{font-size: 0px;}
.list-temp .detail .info .price span{font-size: 18px;margin-right: 8px;color: #000000;font-weight: bold;font-family: "Arial";}
.list-temp .detail .info .price span:last-child{margin-right: 0;}
.list-temp .detail .info .price .line{text-decoration: line-through;}
.list-temp .detail .info .price .free{color: #6ca12b;}
.list-temp .detail .info .price .discount{color: #dc3545;}
.list-temp .btns-box{padding: 0 12px 12px;display: flex;}
.list-temp .btns-box .btn{padding: 6px;margin-right: 12px;font-size: 16px;border-radius: 4px;flex: 1;}
.list-temp .btns-box .btn:last-child{margin-right: 0;}
.list-temp .btns-box .btn.btn-buy{color: #dc3545;border-color: #dc3545;}
.list-temp .btns-box .btn.btn-buy:hover{background-color: #dc3545;color: #ffffff;}
.list-temp .btns-box .btn.btn-preview{color: #00c1de;border-color: #00c1de;}
.list-temp .btns-box .btn.btn-preview:hover{background-color: #00c1de;color: #ffffff;}

.list-article{padding: 0px;flex-direction: column;border-radius: 4px;overflow: hidden;display: flex;background-color: #ffffff;box-shadow: 0 0 6px 0 rgb(0, 0, 0, 0.1);transition: all .3s;}
.list-article:hover{transform: translateY(-5px);}
.list-article .image{width: 100%;padding-right: 0px;overflow: hidden;display: block;}
.list-article .image .img{width: 100%;border-radius: 4px;}
.list-article .detail{padding: 12px;flex: 1;display: flex;flex-direction: column;}
.list-article .detail .body{flex: 1;}
.list-article .detail .body .title{font-size: 16px;color: #000000;}
.list-article .detail .body .desc{font-size: 14px;margin-top: 2px;color: #999999;}
.list-article .detail .tags{font-size: 0px;}
.list-article .detail .tags .tag{font-size: 12px;padding: 3px 5px;border-radius: 4px;color: #666666;display: inline-block;border: 1px solid transparent;}
.list-article .detail .tags .tag:hover{background-color: #f2fafe;border-color: #d3eefb;}
.list-article .detail .tags .tag span{color: #00c1de;}
.list-article .detail .foot{margin-top: 2px;display: flex;justify-content: space-between;}
.list-article .detail .foot .infos{display: flex;align-items: center;}
.list-article .detail .foot .infos .info{font-size: 12px;margin-right: 8px;color: #666666;}
.list-article .detail .foot .infos .info:last-child{margin-right: 0;}
.list-article .detail .foot .comment{display: flex;align-items: center;}
.list-article .detail .foot .comment .commenter{font-size: 0;}
.list-article .detail .foot .comment .commenter .avatar{width: 24px;height: 24px;margin-left: -10px;border: 2px solid #ffffff;border-radius: 50%;display: inline-block;overflow: hidden;box-shadow: 0 0 6px 0 rgb(0, 0, 0, 0.1);}
.list-article .detail .foot .comment .commenter .avatar:first-child{margin-left: 0;}
.list-article .detail .foot .comment .commenter .avatar .img{width: 100%;height: 100%;}
.list-article .detail .foot .comment .count{font-size: 12px;margin-left: 4px;color: #666666;}

.sidebar-wrapper{height: 100%;position: relative;}
.article-tags{display: flex;flex-direction: column;padding: 16px;border-radius: 4px;background-color: #ffffff;box-shadow: 0 0 6px 0 rgb(0, 0, 0, 0.1);transition: all .3s;}
.article-tags.top{left: 0;right: 0;position: absolute;}
.article-tags.bottom{bottom: 24px;left: 0;right: 0;position: absolute;}
.article-tags .head{font-size: 16px;padding-bottom: 8px;border-bottom: 1px solid #f1f1f1;}
.article-tags .body{flex: 1;overflow-y: auto;margin-top: 8px;}
.article-tags .body .item{padding: 8px 0;background-position: 100% 0;border-radius: 4px;display: flex;align-items: center;justify-content: space-between;transition: all .3s;background-size: 220% 100%;background-image: linear-gradient(to right, #d3eefb, #ffffff, #ffffff);}
.article-tags .body .item:hover{padding: 8px 10px;background-position: 0 0;}
.article-tags .body .item .tag{font-size: 14px;color: #666666;}
.article-tags .body .item .tag span{color: #00c1de;}
.article-tags .body .item .count{font-size: 12px;padding: 1px 3px;border-radius: 2px;color: #666666;background-color: #f5f5f5;display: inline-block;}

.list-tool{padding: 8px;border-radius: 4px;height: 100%;display: block;background-color: #ffffff;box-shadow: 0 0 6px 0 rgb(0, 0, 0, 0.1);transition: all .3s;}
.list-tool:hover{background-color: #00c1de;}
.list-tool .image{display: flex;align-items: center;}
.list-tool .image .img{width: 30px;height: 30px;margin-right: 2px;font-size: 20px;display: flex;align-items: center;justify-content: center;color: #333333;}
.list-tool:hover .image .img{color: #ffffff;}
.list-tool .image .img>img{width: 100%;height: 100%;}
.list-tool .image .img:has(i){border: 1px dashed #f1f1f1;}
.list-tool .image .title{font-size: 14px;flex: 1;color: #000000;}
.list-tool:hover .image .title{color: #ffffff;}
.list-tool .detail{padding-top: 2px;}
.list-tool .detail .desc{font-size: 12px;color: #999999;}
.list-tool:hover .detail .desc{color: #ffffff;}

.footer{padding: 15px 0;background-color: #27303F;}
.footer .box{display: flex;justify-content: center;}
.footer .box .item{font-size: 12px;margin-right: 12px;color: #ffffff;}
.footer .box .item:last-child{margin-right: 0;}
.footer .box a.item:hover{color: #00c1de;}

.items-mb24{margin-bottom: 12px;}
.search{padding: 12px;border-radius: 4px;box-shadow: 0 0 6px 0 rgb(0, 0, 0, 0.1);}
.search .group{margin-bottom: 10px;}
.search .group:last-child{margin-bottom: 0;}
.search-box{width: 100%;margin: 0 auto;display: flex;align-items: center;justify-content: center;}
.search-box .input{font-size: 14px;padding: 6px 12px;flex: 1;border: 1px solid #00c1de;border-radius: 4px 0 0 4px;}
.search-box .btn{font-size: 14px;padding: 6px 12px;background-color: #00c1de;border-radius: 0 4px 4px 0;color: #ffffff;}
.search-box .btn:focus{background-color: #00c1de;border-color: #00c1de;color: #ffffff;}
.search-wrap{display: flex;}
.search-wrap .label{margin-right: 12px;padding-top: 5px;width: 28px;font-size: 14px;font-weight: bold;text-align: justify;text-align-last: justify;}
.search-wrap .control{gap: 6px 3px;display: flex;flex-wrap: wrap;align-items: center;flex: 1;}
.search-wrap .control.gap12{gap: 6px 15px;}
.search-wrap .control .option{padding: 4px 12px;font-size: 14px;border: 1px solid transparent;border-radius: 2px;color: #000000;cursor: pointer;display: block;}
.search-wrap .control .option:hover{background-color: #f5f5f5;border-color: #f9f9f9;}
.search-wrap .control .option.active{color: #00c1de;background-color: #f2fafe;border-color: #00c1de;}
.search-wrap .control .sort{margin-top: 5px;font-size: 14px;color: #000000;cursor: pointer;display: block;}
.search-wrap .control .sort.active{color: #00c1de;}

.list-page{padding-top: 8px;margin: 0px;flex-wrap: wrap;gap: 6px;}
.list-page .page-item .page-link{border-radius: 4px !important;background-color: #e2e6e8;border-color: #e2e6e8;color: #333333;}
.list-page .page-item.active .page-link{background-color: #00c1de;border-color: #00c1de;color: #ffffff;}

.comment-page{padding-top: 10px;margin: 0px;flex-wrap: wrap;gap: 6px;}
.comment-page .page-item .page-link{padding: 2px 8px;font-size: 12px;border-radius: 4px !important;background-color: #e2e6e8;border-color: #e2e6e8;color: #333333;}
.comment-page .page-item.active .page-link{background-color: #00c1de;border-color: #00c1de;color: #ffffff;}

.category-tool{padding-bottom: 5px;border-bottom: 1px solid #f1f1f1;display: flex;align-items: center;}
.category-tool .title{font-size: 16px;font-weight: bold;color: #000000;}

.anchor-gap{height: 50px;}
.anchor-box{font-size: 14px;padding: 8px;left: 0;top:50px;right: 0;transform: unset;white-space: nowrap;overflow-x: auto;box-shadow: 0 0px 8px 0 rgb(0, 0, 0, 0.1);background-color: #ffffff;position: fixed;}
.anchor-box .quick-item{padding: 2px 5px;display: inline-block;color: #000000;}
.anchor-box .item{padding: 5px 5px;border-radius: 3px;margin-bottom: 0;display: inline-block;color: #000000;cursor: pointer;position: relative;}
.anchor-box .item:last-child{margin-bottom: 0;}
.anchor-box .item:hover{background-color: #00c1de;color: #ffffff;}
.anchor-box .item.active{background-color: #00c1de;color: #ffffff;}

.view-page{padding: 12px;margin-bottom: 12px;border-radius: 4px;box-shadow: 0 0px 8px 0 rgb(0, 0, 0, 0.1);}
.article .head{margin-bottom: 12px;padding-bottom: 12px;border-bottom: 1px solid #f1f1f1;}
.article .title{font-size: 18px;font-weight: bold;}
.article .attrs{margin-top: 10px;flex-direction: column;display: flex;justify-content: space-between;}
.article .tags{margin-top: 5px;font-size: 0px;}
.article .tags .tag{font-size: 12px;padding: 3px 5px;border-radius: 4px;color: #666666;display: inline-block;border: 1px solid transparent;}
.article .tags .tag:hover{background-color: #f2fafe;border-color: #d3eefb;}
.article .tags .tag span{color: #00c1de;}
.article .infos{display: flex;align-items: center;}
.article .infos .info{font-size: 12px;margin-right: 8px;color: #666666;}
.article .infos .info:last-child{margin-right: 0;}
.article .detail{}
.article .detail p{margin-bottom: 6px;}
.article .detail p:last-child{margin-bottom: 0;}
.article .detail img{max-width: 100%;cursor:pointer;}

.prenext{margin-top:12px;padding-top:12px;font-size: 16px;border-top:1px solid #f1f1f1;}
.prenext .item{margin-bottom: 6px;}
.prenext .item:last-child{margin-bottom: 0px;}
.prenext .item span,.prenext .item a{color: #000000;}
.prenext .item a:hover{color: #00c1de;}

.addon-btns .btn-addon{margin-bottom: 12px;}
.addon-btns .btn-addon:last-child{margin-bottom: 0;}
.btn-addon{font-size: 14px;padding: 10px 12px;width: 100%;display: block;}
.btn-addon .price{color: #dc3545;}
.btn-info{--bs-btn-color: #ffffff;--bs-btn-hover-color: #ffffff;--bs-btn-active-color: #ffffff;--bs-btn-disabled-color: #ffffff;}

.swiper-addon{height: 230px;margin-bottom: 16px;background-color: #fafafa;}
.swiper-addon .image{width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;}
.swiper-addon .image .img{max-width: 100%;max-height: 100%;cursor:pointer;}
.swiper-addon .swiper-pagination-bullet-active{background: #00c1de;}
.swiper-addon .swiper-button-next,.swiper-addon .swiper-button-prev{color: #00c1de;}
.swiper-addon .swiper-button-next:after,.swiper-addon .swiper-button-prev:after{font-size: 20px;}

.addon-info .head{font-size: 14px;padding-bottom: 8px;border-bottom: 1px solid #f1f1f1;}
.addon-info .body{margin-top: 8px;}
.addon-info .body .item{margin-bottom: 8px;display: flex;align-items: center;}
.addon-info .body .item:last-child{margin-bottom: 0;}
.addon-info .body .item .label{width: 56px;font-size: 14px;text-align: justify;text-align-last: justify;}
.addon-info .body .item .control{font-size: 14px;margin-left: 10px;flex: 1;}
.addon-info .body .item .control span{color: #999999;}
.addon-info .body .item .control .rating{display: flex;align-items: center;}
.addon-info .body .item .control .rating .star{font-size: 0;}
.addon-info .body .item .control .rating .star i{font-size: 14px;color: #f9bf00;}
.addon-info .body .item .control .rating .count{font-size: 12px;margin-left: 2px;color: #999999;}

.head-anchor{top: -70px;opacity: 0;display: block;position: absolute;}
.update-log .head{font-size: 14px;position: relative;}
.update-log .body{margin-top: 12px;}
.update-log .item{margin-bottom: 12px;}
.update-log .item .info{font-size: 14px;margin-bottom: 2px;padding-bottom: 2px;border-bottom: 1px solid #f1f1f1;display: flex;align-items: center;}
.update-log .item .info .version{font-weight: bold;}
.update-log .item .info .download{cursor: pointer;}
.update-log .item .detail{font-size: 14px;}
.update-log .item .detail p{margin-bottom: 0px;}
.update-log .item .detail img{max-width: 100%;cursor:pointer;}
.update-log .more{font-size: 14px;cursor: pointer;}

.comment>.head{font-size: 14px;padding-bottom: 8px;position: relative;}
.comment-area .box{font-size: 0px;}
.comment-area .box .content{font-size: 14px;padding: 6px 10px;border-radius: 4px;width: 100%;border: 1px solid #f1f1f1;background-color: #f1f1f1;resize: none;transition: all .3s;}
.comment-area .box .content:hover,.comment-area .box .content:focus{background-color: #ffffff;border-color: #c9ccd0;}
.comment-area .action{margin-top: 5px;display: none;align-items: center;justify-content: space-between;}
.comment-area .action .btn-box .btn{font-size: 12px;padding: 6px 20px;}
.hide-comment-area{display:none;}
.replys-box .comment-area{margin-top: 10px;}
.comment .item{margin-top: 10px;display:flex;}
.comment .item .image{width: 30px;height: 30px;margin-right:6px;}
.comment .item .image .img{border-radius:50%;width:100%;height:100%;}
.comment .item .detail{padding-bottom: 10px;flex:1;border-bottom: 1px solid #f1f1f1;}
.comment .item .detail>.head{display:flex;justify-content: space-between;align-items: center;}
.comment .item .detail>.head .info{display: flex;align-items: center;}
.comment .item .detail>.head .info .name{font-size: 12px;color:#00c1de;}
.comment .item .detail>.head .info .vip{font-size: 12px;margin-left: 3px;color:#333333;}
.comment .item .detail>.body{padding: 5px 0;}
.comment .item .detail>.body .content{font-size: 14px;}
.comment .item .detail>.body .content p{margin-bottom: 0px;}
.comment .item .detail>.foot .infos{display: flex;align-items: center;}
.comment .item .detail>.foot .infos .info{font-size: 12px;margin-right:10px;display: flex;align-items: center;color:#999999;}
.comment .item .detail>.foot .infos .info:last-child{margin-right:0;}
.comment .item .detail>.foot .infos .info.hover:hover{color: #00c1de;cursor: pointer;}
.comment .item .detail>.foot .infos .info .count{margin-left: 5px;}
.comment .item .item .image{margin-right:5px;width: 24px;height: 24px;}
.comment .item .item .detail{padding-bottom: 0px;border-bottom:unset;}
.comment .item .item .detail>.body{padding: 0 0 5px 0;}
.comment .item .item .detail>.body .info{margin: 1px 10px 0 0;display: flex;align-items: center;float: left;}
.comment .item .item .detail>.body .info .name{font-size: 12px;color:#00c1de;}
.comment .item .item .detail>.body .info .vip{font-size: 12px;margin-left: 3px;color:#333333;}
.replys-more{margin-top: 5px;font-size: 12px;display: flex;align-items: center;color: #999999;}
.replys-more .btn{font-size: 12px;border: none;padding: unset;color: #999999;}
.replys-more .btn:hover{color: #00c1de;}

@media (min-width:576px){
    .swiper-addon{height: 320px;}
    .swiper-addon .swiper-button-next:after,.swiper-addon .swiper-button-prev:after{font-size: 28px;}
}
@media (min-width:768px){
    .swiper-addon{height: 420px;}
    .swiper-addon .swiper-button-next:after,.swiper-addon .swiper-button-prev:after{font-size: 44px;}
}
@media (min-width:992px){
    
    .comment>.head{font-size: 16px;}
    .comment-area .box .content{font-size: 16px;padding: 8px 12px;}
    .comment-area .action{margin-top: 10px;}
    .comment-area .action .btn-box .btn{font-size: 14px;}
    .replys-box .comment-area{margin-top: 15px;}
    .comment .item{margin-top: 15px;}
    .comment .item .image{width: 40px;height: 40px;margin-right:12px;}
    .comment .item .detail{padding-bottom: 15px;}
    .comment .item .detail>.head .info .name{font-size: 14px;}
    .comment .item .detail>.head .info .vip{font-size: 14px;margin-left: 5px;}
    .comment .item .detail>.body{padding: 8px 0;}
    .comment .item .detail>.body .content{font-size: 16px;}
    .comment .item .detail>.foot .infos .info{font-size: 14px;margin-right:20px;}
    .comment .item .detail>.foot .infos .info .count{margin-left: 5px;}
    .comment .item .item .image{margin-right:12px;}
    .comment .item .item .detail>.body{padding: 0 0 8px 0;}
    .comment .item .item .detail>.body .info{margin: 1px 16px 0 0;}
    .comment .item .item .detail>.body .info .name{font-size: 14px;}
    .comment .item .item .detail>.body .info .vip{font-size: 14px;margin-left: 5px;}
    .replys-more{margin-top: 10px;font-size: 14px;}
    .replys-more .btn{font-size: 14px;}
    
    .head-anchor{top: -100px;}
    .update-log .head{font-size: 16px;}
    .update-log .body{margin-top: 20px;}
    .update-log .item{margin-bottom: 20px;}
    .update-log .item .info{font-size: 16px;margin-bottom: 5px;padding-bottom: 5px;}
    .update-log .item .detail{font-size: 16px;}
    .update-log .more{font-size: 16px;}
    
    .addon-info .head{font-size: 16px;}
    .addon-info .body .item .label{width: 64px;font-size: 16px;}
    .addon-info .body .item .control{font-size: 16px;margin-left: 16px;}
    .addon-info .body .item .control .rating .star i{font-size: 16px;}
    .addon-info .body .item .control .rating .count{font-size: 14px;}
    
    .swiper-addon{height: 390px;}
    .swiper-addon .swiper-button-next:after,.swiper-addon .swiper-button-prev:after{font-size: 38px;}
    
    .prenext{margin-top:16px;padding-top:16px;}
    
    .view-page{padding: 16px;margin-bottom:24px;}
    .article .head{margin-bottom: 16px;padding-bottom: 16px;}
    .article .title{font-size: 20px;}
    .article .attrs{margin-top: 12px;flex-direction: row;}
    .article .tags{margin-top: 0;}
    .article .tags .tag{font-size: 14px;padding: 3px 7px;}
    .article .infos .info{font-size: 14px;margin-right: 12px;}
    .article .detail{}
    .article .detail p{margin-bottom: 8px;}
    
    .anchor-gap{height: 0px;}
    .anchor-box{font-size: 16px;padding: 0;left: 50%;top: 130px;right: unset;transform: translateX(-820px);white-space: normal;overflow-x: unset;box-shadow: unset;background-color: unset;}
    .anchor-box .quick-item{display:none;}
    .anchor-box .item{padding: 2px 5px;border-radius: 4px;margin-bottom: 5px;display: block;}
    .anchor-box .item.active:before{left: -20px;color: #00c1de;content: "\f0a4";font-family: "Font Awesome 6 Free";position: absolute;top: 50%;transform: translateY(-50%);}
    
    .list-page{padding-top: 16px;}
    
    .items-mb24{margin-bottom: 24px;}
    .search{padding: 24px;}
    .search .group{margin-bottom: 12px;}
    .search-box{width: 50%;}
    .search-box .input{font-size: 16px;padding: 10px 15px;}
    .search-box .btn{font-size: 16px;padding: 10px 15px;}
    .search-wrap .label{margin-right: 20px;}
    .search-wrap .control{gap: 12px 6px;}
    
    .footer{padding: 30px 0;}
    .footer .box .item{font-size: 14px;margin-right: 14px;}
    
    .list-tool{padding: 8px;}
    .list-tool .image .img{width: 32px;height: 32px;margin-right: 4px;}
    .list-tool .image .title{font-size: 16px;}
    .list-tool .detail .desc{font-size: 14px;}
    
    .list-article{padding: 16px;flex-direction: row;}
    .list-article .image{width: 336px;padding-right: 16px;}
    .list-article .detail{padding: 0px;}
    .list-article .detail .body .title{font-size: 18px;}
    .list-article .detail .body .desc{font-size: 16px;margin-top: 10px;}
    .list-article .detail .tags .tag{font-size: 14px;padding: 3px 7px;}
    .list-article .detail .foot{margin-top: 5px;}
    .list-article .detail .foot .infos .info{font-size: 14px;margin-right: 12px;}
    .list-article .detail .foot .comment .commenter .avatar{width: 28px;height: 28px;margin-left: -10px;}
    .list-article .detail .foot .comment .count{font-size: 14px;margin-left: 6px;}
    
    .list-temp .detail{padding: 16px;}
    .list-temp .detail .info{margin-top: 10px;}
    .list-temp .btns-box{padding: 0 16px 16px;}
    .list-temp .btns-box .btn{padding: 5px;margin-right: 16px;}
    
    .banner{padding: 60px 0;}
    .banner .infos{font-size: 18px;margin-top: 15px;}
    .typewriter-box .title{font-size: 36px;line-height: 40px;margin-right: 12px;}
    .typewriter-box .text{font-size: 36px;line-height: 40px;}
    
    .navbar-brand .logo{height: 40px;}
    .navbar-nav .nav-item .nav-link{font-size: 16px;padding: 23px;}
    .navbar-gap{height: 70px;}
    
    .col-lg-5-1{flex: 0 0 auto;width: 20%;}
    .items-box{padding: 60px 0 60px 0;}
    .items-box:has(.row-lists){padding-bottom: 36px;}
    .items-title{font-size: 32px;}
    .items-desc{font-size: 16px;}
    .items-title+.items-desc{margin-top: 10px;}
    .items-title+.items-conts,.items-desc+.items-conts{margin-top: 60px;}
    .row-lists>[class^="col-"],.row-lists>.item{margin-bottom: 24px;}
}
@media (min-width:1200px){
    .swiper-addon{height: 480px;}
    .swiper-addon .swiper-button-next:after,.swiper-addon .swiper-button-prev:after{font-size: 44px;}
    
    .col-xl-5-1{flex: 0 0 auto;width: 20%;}
}
@media (min-width:1400px){
    .col-xxl-5-1{flex: 0 0 auto;width: 20%;}
    
    .container{max-width: 1424px;}
}