/*软件频道页改版 2025-11-05 */
.flex {
	display: flex;
}
.flex-wrap {
	display: flex;
	flex-wrap: wrap;
}
.flex-between {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.line-1 {
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.line-2 {
    text-overflow: ellipsis;
    text-overflow: -webkit-ellipsis-lastline;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}
.mt-40 {
	margin-top: 40px;
}
.mt-15 {
	margin-top: 15px;
}
.mt-12 {
	margin-top: 12px;
}
.mt-10 {
	margin-top: 10px;
}
.hide {
    display: none;
}

.newIndex_icon,
.xd-ranking-list li:nth-of-type(1) i, 
.xd-ranking-list li:nth-of-type(2) i, 
.xd-ranking-list li:nth-of-type(3) i,
.soft-title-star,
.xd-ranking-list-24 li i:after,
.recommend-list li i:after {
	background: url(../images/newIndex_icon.png) no-repeat;
}
.selected-box {
	margin-top: 35px;
}
.selected-list {
    box-sizing: border-box;
    border: 1px solid #ddd;
}
.selected-list li {
	width: 12.5%;
    border: 0px solid #ddd;
    border-right-width: 1px;
}
.selected-list li:hover {
    box-shadow: 0px 0 12px 3px rgb(233, 233, 233, 1);
    transition: transform 0.5s;
    z-index: 1;
    border: 0;
}
.selected-list a {
	text-align: center;
	width: 100%;
    box-sizing: border-box;
    padding: 20px 30px;
	position: relative;
}
.selected-list a img {
	width: 60px;
	height: 60px;
	display: block;
    margin: 0 auto;
}
.selected-list a>img {
	margin: 0 auto;
	position: relative;
	z-index: 2;
}
.selected-list a p {
	color: #070707;
	font-size: 14px;
	margin-top: 12px;
    width: 100%;
}

.selected-list a:hover span.imgyin {
	display: block;
}
.selected-list a:hover p {
    color: #007aff;
}
.btn-selected {
	width: 42px;
	height: 132px;
	background-color: #007aff;
	color: #ffffff;
	font-size: 16px;
	letter-spacing: 5px;
	cursor: pointer;
	writing-mode: vertical-rl;
	display: flex;
    align-items: center;
    justify-content: center;

}

.btn-selected-left {
	border-radius: 10px 0 0 10px;
}

.btn-selected-right {
	border-radius: 0 10px 10px 0;
}

.btn-selected:hover,
.btn-selected.active {
    font-weight: bold;
}
.btn-selected-left:hover,
.btn-selected-left.active {
    background-image: url(../images/btn-hover.png); 
}
.btn-selected-right:hover,
.btn-selected-right.active {
    background-image: url(../images/btn-hover-right.png);
}

.swiper-container {
	width: calc(100% - 84px);
	height: 132px;
}
img {
	max-width: 100%;
}
.softIcon {
    position: relative;
    /* width: 60px;
    height: 60px; */
}
.softIcon .softIcon-hover {
    background-color: var(--color);
    background-size: cover;
    background-repeat: no-repeat;
    top: -10px;
    left: -13px;
}

.softIcon .softIcon-hover {
    --size: 66px;
    width: var(--size);
    height: var(--size);
    position: absolute;
    top: -3px;
    left: -3px;
    background-image: var(--img);
    border-radius: 5px;
    opacity: .6;
    transform: scale(0) translateX(-50%);
    filter: blur(10px) opacity(50%);
    z-index: -1;
    transition-delay: .05s;
    transition: transform .3s ease-in-out;
}
.selected-list li:hover .softIcon-hover,
.zjbb-list li:hover .softIcon-hover,
.xd-ranking-list li:hover .softIcon-hover,
.sort-list li .softIcon .softIcon-hover {
    transform: scale(1);
}
.zjbb-list li .softIcon .softIcon-hover,
.sort-list li .softIcon .softIcon-hover {
    --size: 76px;
}
.xd-ranking-list li .softIcon .softIcon-hover {
    --size: 56px;
}
.img_icon {
    position: relative;
    width: 55px;
    height: 55px;
}
/* 最新更新 */
.xd-soft-title {
	color: #2c2c2c;
	font-size: 24px;
	font-weight: bold;
    position: relative;
}
.change {
	font-size: 14px;
	color: #9e9e9e;
	line-height: 56px;
	cursor: pointer;
}
.change em {
	margin-left: 5px;
	width: 12px;
	height: 12px;
	background-position: -288px -1px;
	display: inline-block;
	vertical-align: -2px;
}
.change:hover {
	color: #0a7cff;
}
.change:hover em {
	background-position: -288px -16px;
}
.category-list li {
    width: 290px;
    height: 88px;
    padding: 18px 17px;
    margin-top: 20px;
    background: #fff;
    border-radius: 10px;
    position: relative;
    box-sizing: border-box;
    transition: transform 0.5s;
	margin-right: 13px;
	border: 1px solid #eeeeee;
}
.category-list li a {
    display: flex;
}
.category-list li:nth-child(4n+4) {
	margin-right: 0;
}
.software-icon {
	width: 50px;
    height: 50px;
    border-radius: 4px;
}
.software-icon img { 
    width: 100%;
    height: 100%;
}
.software-info {
	flex: 1;
    overflow: hidden;
    margin-left: 12px
}
.software-name {
	color: #040404;
    font-size: 16px;
}
.software-desc {
	padding-top: 6px;
    font-size: 14px;
    color: #979797;
}
.software-desc i {
	vertical-align: 1px;
}
.software-btn {
    display: none;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translate(0, -50%);
    width: 60px;
    height: 26px;
    font-size: 12px;
    color: #fff !important;
    text-align: center;
    line-height: 26px;
    background: #00b951;
    border-radius: 26px;
}

.category-list li:hover {
    box-shadow: 0px 0 12px 3px rgb(233, 233, 233, 1);
    transform: translate(0px, -5px);
    transition: transform 0.5s;
}
.category-list li:hover .software-name {
	color: #0a7cff;
}
.category-list li:hover .software-info {
    padding-right: 70px;
}
.category-list li:hover .software-btn {
	display: block;
}
.software-btn:hover {
	background: #40d872;
}
.xd-more {
    font-size: 14px;
    color: #9e9e9e;
}
.xd-more:after {
    content: "";
    margin-left: 5px;
    width: 6px;
    height: 6px;
    border-right: #9e9e9e solid 1px;
    border-bottom: #9e9e9e solid 1px;
    transform: rotate(-45deg);
    display: inline-block;
    vertical-align: 2px;
}
/* 装机必备软件 */
.zjbb-list li {
    width: 154px;
    height: 180px;
    text-align: center;
	margin-top: 20px;
    margin-right: 20px;
    box-sizing: border-box;
	border: #eee solid 1px;
    background: #fff;
    border-radius: 10px;
    transition: transform 0.5s;
}
.zjbb-list li:nth-child(7n+7) {
	margin-right: 0;
}
.zjbb-list li a {
    padding: 20px 10px;
}
.soft-column {
    flex-direction: column;
    align-items: center;
    overflow: hidden;
}
.software-column-icon {
	width: 70px;
    height: 70px;
    border-radius: 4px;
    margin: 0 auto;
}
.software-column-icon img {
    width: 100%;
    height: auto;
}
.software-category {
    color: #979797;
	font-size: 14px;
}
.zjbb-list p {
    width: 100%;
}
.software-column-btn {
	width: 60px;
    height: 26px;
    font-size: 12px;
    color: #fff;
    text-align: center;
    line-height: 26px;
    background: #01ca44;
    border-radius: 26px;
}
.zjbb-list li:hover {
    box-shadow: 0px 0 12px 3px rgb(233, 233, 233, 1);
    transform: translate(0px, -5px);
    transition: transform 0.5s;
}
.zjbb-list li:hover .software-category {
	display: none;
}
.zjbb-list li:hover .software-column-btn {
	display: block;
}
/* 助手合集神器 */
.xd-soft-head.flex .xd-soft-title {
    padding: 0 5px;
}
.xd-soft-head.flex .xd-soft-title::after {
    content: "";
    width: 100%;
    height: 10px;
    display: block;
    z-index: -1;
    border-radius: 5px;
    position: absolute;
    bottom: -2px;
    left: 0;
}
.soft-title-star {
    width: 15px;
    height: 15px;
    background-position: -271px 0;
    display: inline-block;
    margin-top: 4px;
    margin-left: 10px;
}
.xd-soft-item:nth-child(1) .xd-soft-title::after {
    background-image: linear-gradient(to right, #b8f1ff, #dcfabb);
}
.xd-soft-item:nth-child(2) .xd-soft-title::after {
    background-image: linear-gradient(to right, #ffdeb2, #fff0bc);
}
.xd-soft-item:nth-child(3) .xd-soft-title::after {
    background-image: linear-gradient(to right, #e8d1ff, #ffdeeb);
}
.xd-ranking-list li {
    padding: 16px 20px 15px;
    margin-right: 20px;
    margin-top: 20px;
    width: 386px;
    height: 88px;
    border: #eee solid 1px;
    background: #fff;
    border-radius: 10px;
    box-sizing: border-box;
    transition: transform 0.5s;
}

.xd-ranking-list li i {
    margin-top: 12px;
    margin-right: 14px;
    width: 25px;
    height: 30px;
    font-size: 16px;
    color: #cfcfcf;
    font-weight: bold;
    text-align: center;
    line-height: 30px;
}
.xd-ranking-list li:nth-of-type(1) i, 
.xd-ranking-list li:nth-of-type(2) i, 
.xd-ranking-list li:nth-of-type(3) i {
    width: 25px;
    height: 30px;
    color: #fff;
    line-height: 35px;
}
.xd-ranking-list li:nth-of-type(1) i {
    background-position: -242px -32px;

}
.xd-ranking-list li:nth-of-type(2) i {
    background-position: -269px -33px;
}

.xd-ranking-list li:nth-of-type(3) i {
    background-position: -242px -65px;
}
.xd-ranking-list li:hover {
    background-image: linear-gradient(to left, #f4ffe3, #e7f6ff);
    box-shadow: 0 0px 10px rgba(221, 221, 221, 0.5);
    transform: translate(0px, -5px);
    transition: transform 0.5s;
}
.xd-ranking-list li img {
    width: 50px;
    height: 50px;
    margin-right: 4px;
}
.xd-ranking-list li:hover .software-info {
    padding-right: 70px;
}
.xd-ranking-list li:hover .software-btn {
	display: block;
}
.xd-soft-ranking-box {
    justify-content: space-between;
}
/* 24小时软件下载排行榜 */
.xd-ranking-list-24 {
    background-color: #fff;
    flex-flow: column wrap;
    height: 452px;
    overflow: hidden;
    border: 1px solid #eee;
    box-sizing: border-box;
}
.xd-ranking-list-24 li {
    width: 390px;
    height: 90px;
    margin-top: 0;
    margin-right: 0;
    border: 0;
    border-radius: 2px;
}

.xd-ranking-list-24 li i {
    margin-top: 17px;
    margin-right: 16px;
    padding-right: 2px;
    width: 16px !important;
    height: 23px !important;
    font-size: 14px;
    color: #fff;
    line-height: 23px !important;
    font-weight: bold;
    text-align: right;
    border-radius: 5px 0 0 5px;
    display: inline-block;
    box-sizing: border-box;
    position: relative;
}
.xd-ranking-list-24 li:nth-of-type(-n + 3) i:after {
    content: "";
    width: 8px;
    height: 23px;
    background-position: -188px -87px;
    display: inline-block;
    position: absolute;
    right: -8px;
    top: 0;
}
.xd-ranking-list-24 li:nth-of-type(n + 4) i {
    background: none;
    font-size: 16px;
    color: #e2e2e2;
}
.xd-ranking-list-24 li:nth-of-type(1) i {
    background: #ff5645;
}
.xd-ranking-list-24 li:nth-of-type(1) i:after {
    background-position: -188px -87px;
}
.xd-ranking-list-24 li:nth-of-type(2) i {
    background: #ff8a14;
}
.xd-ranking-list-24 li:nth-of-type(2) i:after {
    background-position: -202px -87px;
}
.xd-ranking-list-24 li:nth-of-type(3) i {
    background: #ffb320;
}
.xd-ranking-list-24 li:nth-of-type(3) i:after {
    background-position: -216px -87px;
}

/* 热门干货 */
.xd-soft-goods {
    width: 386px;
    height: 452px;
    border: 1px solid #eee;
    background-color: #fff;
    overflow: hidden;
}
.xd-soft-goods li {
    padding: 16px 20px 15px;
    border-top: 1px dashed #eee;
    box-sizing: border-box;
}
.xd-soft-goods li:first-child {
    border-top: 0;
}
.xd-soft-goods li .goods-item figure {
    width: 130px;
    height: 80px;
    border: 1px solid #eee;
    overflow: hidden;
}
.xd-soft-goods li .goods-item figure img {
    width: 100%;
    height: 100%;
    display: block;
    transition: transform 0.5s;
}
.goods-info {
    flex: 1;
    margin-left: 13px;
}
.goods-title {
    font-size: 16px;
    color: #131313;
    line-height: 25px;
    margin-bottom: 8px;
}
.goods-info time {
    font-size: 14px;
    color: #adadad;
}
.goods-info time i {
    margin-right: 12px;
    width: 14px;
    height: 14px;
    background-position: -272px -16px;
    display: inline-block;
    vertical-align: -2px;
}
.xd-soft-goods li:hover {
    box-shadow: 0px 0 12px 3px rgb(233, 233, 233, 1);
    transform: translate(0px, -5px);
    transition: transform 0.5s;
    z-index: 9;
}
.xd-soft-goods li:hover .goods-item figure img {
    transform: scale(1.2) rotate(-6deg);
}
.xd-soft-goods li:hover .goods-title {
    color: #0a7cff;
}
/* 热门分类 */
.sort-tab {
    margin-left: 50px;
}

.sort-tab li {
    margin-right: 18px;
    min-width: 110px;
    height: 32px;
    font-size: 16px;
    color: #0d0d0d;
    text-align: center;
    line-height: 32px;
    background-image: linear-gradient(to left, #f9f4e3, #faf3e5);
    border-radius: 32px;
    display: inline-block;
    cursor: pointer;
}
.sort-tab li.on {
    background-image: linear-gradient(to left, #fff0bc, #ffddb2);
    color: #313131;
    font-weight: bold;
}
.sort-list li:hover .software-desc {
    display: none;
}
.sort-list li:hover .software-btn {
    position: relative;
    display: block;
    right:0;
    top: 0;
    transform: none;
    margin-top: 12px;
    width: 80px;
    height: 36px;
    line-height: 36px;
    font-size: 14px;
}

/* 热门分类 */
.sort-list li {
    height: 110px;
}
.sort-list .software-icon {
    width: 70px;
    height: 70px;
}

/* 引用首页底部切换 */
.soft-link-area {
    display: flex;
    position: relative;
}
.bottomTabBox {
    padding-top: 40px;
    width: 100%;
    display: inline-block;
}
.text-clip {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.mt {
    margin-top: 12px;
}
.bottomTabBox .tabtit span {
    margin-right: 25px;
    width: 140px;
    height: 50px;
    font-size: 18px;
    color: #0d0d0d;
    text-align: center;
    line-height: 50px;
    background-image: linear-gradient(to left, #e8f5f9, #ebf4f7);
    border-radius: 50px;
    float: left;
    cursor: pointer;
}
.bottomTabBox .tabtit span.on {
    color: #313131;
    background-image: linear-gradient(to left, #dffbb5, #b5efff);
}
.bottomTabBox ul {
    padding-top: 10px;
    width: 100%;
    float: left;
}
.bottomTabBox ul li {
    margin-top: 20px;
    margin-right: 20px;
    padding: 0 10px;
    width: 132px;
    height: 170px;
    border: #eee solid 1px;
    background: #fff;
    border-radius: 10px;
    text-align: center;
    float: left;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-content: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    transition: transform 0.5s;
}
.bottomTabBox ul li:nth-of-type(8n) {
    margin-right: 0;
}
.bottomTabBox ul li .img {
    width: 60px;
    height: 60px;
    display: inline-block;
}
.bottomTabBox ul li .tit {
    padding-top: 10px;
}
.bottomTabBox ul li .btn {
    margin-top: 10px;
}
.bottomTabBox ul li:hover {
    box-shadow: 0px 0 12px 3px rgb(221, 221, 221, 1);
    transform: translate(0px, -5px);
    transition: transform 0.5s;
}
.bottomTabBox ul li:hover .imgyin {
    display: block;
}

.bottomTabBox ul.zhenxuanhj {
    height: 390px;
    overflow: hidden;
    box-sizing: border-box;
}
.bottomTabBox ul.zhenxuanhj li {
    width: 226px;
    height: 50px;
    margin-right: 17px;
    margin-bottom: 8px;
    font-size: 16px;
    color: #040404;
    text-align: center;
    line-height: 50px;
    background: #fff;
    border: #ececec solid 1px;
    border-radius: 50px;
    float: left;
}
.bottomTabBox ul.zhenxuanhj li:nth-of-type(5n) {
    margin-right: 0;
}
.bottomTabBox ul.zhenxuanhj li:hover {
    color: #1398ff;
    background: #f2fcff;
    border-color: #b0e2ff;
    box-shadow: none;
    transform: translate(0px, 0);
}

/* 列表页 */
.recommend-text-left {
    width: 50px;
    height: 158px;
    border-radius: 10px 0 0 10px;
    background: linear-gradient(#12a7ff, #086eff);
    color: #ffffff;
    font-size: 18px;
    letter-spacing: 10px;
    cursor: pointer;
    font-weight: bold;
    writing-mode: vertical-rl;
    display: flex;
    align-items: center;
    justify-content: center;
}
.recommend-box {
    border: 1px solid #eee;
    border-radius: 10px;
    background-color: #fff;
}
.recommend-list {
    padding: 0 40px;
    width: calc(100% - 50px);
    overflow: hidden;
}
.recommend-list li {
    padding: 0 27px;
    text-align: center;
    width: 10%;
    overflow: hidden;
}
.recommend-list li a {
    position: relative;
    display: block;
    padding: 25px 0;
}
.recommend-list li i {
    padding-top: 2px;
    width: 24px !important;
    height: 20px !important;
    font-size: 14px;
    color: #fff;
    line-height: 20px !important;
    font-weight: bold;
    text-align: center;
    border-radius: 5px 5px 0 0;
    display: inline-block;
    box-sizing: border-box;
    position: absolute;
    top: 19px;
    left: -7px;
    z-index: 9;
}
.recommend-list li:nth-of-type(1) i {
    background: #ff5645;
}
.recommend-list li:nth-of-type(1) i:after {
    background-position: -188px -87px;
}
.recommend-list li:nth-of-type(2) i {
    background: #ff8a14;
}
.recommend-list li:nth-of-type(2) i:after {
    background-position: -202px -87px;
}
.recommend-list li:nth-of-type(3) i {
    background: #ffb320;
}
.recommend-list li:nth-of-type(3) i:after {
    background-position: -216px -87px;
}
.recommend-list li:nth-of-type(n + 4) i {
    display: none;
}
.recommend-list li:nth-of-type(-n + 3) i:after {
    content: "";
    width: 8px;
    height: 23px;
    display: inline-block;
    position: absolute;
    left: 8px;
    bottom: -15px;
    transform: rotate(90deg);
}
.recommend-list .software-name {
    font-size: 18px;
    color: #161616;
}
.recommend-list li:hover .software-name {
    color: #0a7bff;
}
.recommend-list li:hover .software-column-icon {
    transform: scale(1.1);
    transition: transform 0.5s;
}
.xd-sort-title {
    font-size: 22px;
    color: #2c2c2c;
    font-weight: bold;
    position: relative;
    display: inline-block;
}
.xd-sort-title::after {
    content: "";
    width: 100%;
    height: 10px;
    display: block;
    z-index: -1;
    border-radius: 5px;
    position: absolute;
    bottom: -2px;
    left: 0;
    background-image: linear-gradient(to right, #b6efff, #e0fbb4);
}
.sort-type-box {
    background-color: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
    padding: 8px 25px 22px;
}
.type-text {
    margin-top: 15px;
    line-height: 40px;
}
.sort-list-box {
    flex: 1;
}
.sort-list-box li,
.sort-list-two-box a {
    min-width: 90px;
    background-color: #eefafe;
    height: 40px;
    line-height: 40px;
    border-radius: 20px;
    text-align: center;
    margin-right: 20px;
    padding: 0 20px;
    box-sizing: border-box;
    margin-top: 15px;
    color: #0d0d0d;
    font-size: 16px;
}
.sort-list-box li:hover,
.sort-list-box li.active,
.sort-list-two-box a:hover,
.sort-list-two-box a.active {
    background: linear-gradient(#12a7ff, #086eff);
}
.sort-list-one-box li::before {
    content: '';
    margin-right: 8px;
    width: 19px;
    height: 18px;
    background: url(../images/icon-sort.png) no-repeat;
    background-position: 0 0;
    display: inline-block;
    vertical-align: -4px;
}
.sort-list-box li a {
    color: #0d0d0d;
    font-size: 16px;
}
.sort-list-box li:hover a,
.sort-list-box li.active a,
.sort-list-two-box a:hover,
.sort-list-two-box a.active {
    color: #ffffff;
}
:root {
    --base-position: 0px;
    --spacing: -30px;
}
.sort-list-box li a:nth-of-type(n+2) {
    display: none;
}
.sort-list-one-box li {
    min-width: 130px;
    cursor: pointer;
}
.sort-list-one-box li.s1::before { background-position: 0 calc(var(--base-position) + 0 * var(--spacing)); }
.sort-list-one-box li.active.s1::before,
.sort-list-one-box li.s1:hover::before { 
    background-position: -30px calc(var(--base-position) + 0 * var(--spacing)); 
}

.sort-list-one-box li.s2::before { background-position: 0 calc(var(--base-position) + 1 * var(--spacing)); }
.sort-list-one-box li.active.s2::before,
.sort-list-one-box li.s2:hover::before { 
    background-position: -30px calc(var(--base-position) + 1 * var(--spacing));
}

.sort-list-one-box li.s3::before { background-position: 0 calc(var(--base-position) + 2 * var(--spacing)); }
.sort-list-one-box li.active.s3::before,
.sort-list-one-box li.s3:hover::before { 
    background-position: -30px calc(var(--base-position) + 2 * var(--spacing));
}

.sort-list-one-box li.s4::before { background-position: 0 calc(var(--base-position) + 3 * var(--spacing)); }
.sort-list-one-box li.active.s4::before,
.sort-list-one-box li.s4:hover::before { 
    background-position: -30px calc(var(--base-position) + 3 * var(--spacing));
}

.sort-list-one-box li.s5::before { background-position: 0 calc(var(--base-position) + 4 * var(--spacing)); }
.sort-list-one-box li.active.s5::before,
.sort-list-one-box li.s51:hover::before { 
    background-position: -30px calc(var(--base-position) + 4 * var(--spacing));
}

.sort-list-one-box li.s6::before { background-position: 0 calc(var(--base-position) + 5 * var(--spacing)); }
.sort-list-one-box li.active.s6::before,
.sort-list-one-box li.s6:hover::before { 
    background-position: -30px calc(var(--base-position) + 5 * var(--spacing));
}

.sort-list-one-box li.s7::before { background-position: 0 calc(var(--base-position) + 6 * var(--spacing)); }
.sort-list-one-box li.active.s7::before,
.sort-list-one-box li.s7:hover::before { 
    background-position: -30px calc(var(--base-position) + 6 * var(--spacing));
}

.sort-list-one-box li.s8::before { background-position: 0 calc(var(--base-position) + 7 * var(--spacing)); }
.sort-list-one-box li.active.s8::before,
.sort-list-one-box li.s8:hover::before { 
    background-position: -30px calc(var(--base-position) + 7 * var(--spacing));
}

.sort-list-one-box li.s9::before { background-position: 0 calc(var(--base-position) + 8 * var(--spacing)); }
.sort-list-one-box li.active.s9::before,
.sort-list-one-box li.s9:hover::before { 
    background-position: -30px calc(var(--base-position) + 8 * var(--spacing));
}

.sort-list-one-box li.s10::before { background-position: 0 calc(var(--base-position) + 9 * var(--spacing)); }
.sort-list-one-box li.active.s10::before,
.sort-list-one-box li.s10:hover::before { 
    background-position: -30px calc(var(--base-position) + 9 * var(--spacing));
}

.sort-list-one-box li.s11::before { background-position: 0 calc(var(--base-position) + 10 * var(--spacing)); }
.sort-list-one-box li.active.s11::before,
.sort-list-one-box li.s11:hover::before { 
    background-position: -30px calc(var(--base-position) + 10 * var(--spacing));
}

.sort-list-one-box li.s12::before { background-position: 0 calc(var(--base-position) + 11 * var(--spacing)); }
.sort-list-one-box li.active.s12::before,
.sort-list-one-box li.s12:hover::before { 
    background-position: -30px calc(var(--base-position) + 11 * var(--spacing));
}

.sort-list-one-box li.s13::before { background-position: 0 calc(var(--base-position) + 12 * var(--spacing)); }
.sort-list-one-box li.active.s13::before,
.sort-list-one-box li.s13:hover::before { 
    background-position: -30px calc(var(--base-position) + 12 * var(--spacing));
}

.sort-list-one-box li.s14::before { background-position: 0 calc(var(--base-position) + 13 * var(--spacing)); }
.sort-list-one-box li.active.s14::before,
.sort-list-one-box li.s14:hover::before { 
    background-position: -30px calc(var(--base-position) + 13 * var(--spacing));
}

.sort-list-one-box li.s15::before { background-position: 0 calc(var(--base-position) + 14 * var(--spacing)); }
.sort-list-one-box li.active.s15::before,
.sort-list-one-box li.s15:hover::before { 
    background-position: -30px calc(var(--base-position) + 14 * var(--spacing));
}

.sort-list-one-box li.s16::before { background-position: 0 calc(var(--base-position) + 15 * var(--spacing)); }
.sort-list-one-box li.active.s16::before,
.sort-list-one-box li.s16:hover::before { 
    background-position: -30px calc(var(--base-position) + 15 * var(--spacing));
}

.sort-list-one-box li.s17::before { background-position: 0 calc(var(--base-position) + 16 * var(--spacing)); }
.sort-list-one-box li.active.s17::before,
.sort-list-one-box li.s17:hover::before { 
    background-position: -30px calc(var(--base-position) + 16 * var(--spacing));
}

.sort-list-one-box li.s18::before { background-position: 0 calc(var(--base-position) + 17 * var(--spacing)); }
.sort-list-one-box li.active.s18::before,
.sort-list-one-box li.s18:hover::before { 
    background-position: -30px calc(var(--base-position) + 17 * var(--spacing));
}

.sort-list-one-box li.s19::before { background-position: 0 calc(var(--base-position) + 18 * var(--spacing)); }
.sort-list-one-box li.active.s19::before,
.sort-list-one-box li.s19:hover::before { 
    background-position: -30px calc(var(--base-position) + 18 * var(--spacing));
}

/* 游戏分类 */
.sort-game-list .sort-list-one-box li.s1::before { background-position: -60px calc(var(--base-position) + 0 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s1::before,
.sort-game-list .sort-list-one-box li.s1:hover::before { 
    background-position: -90px calc(var(--base-position) + 0 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s2::before { background-position: -60px calc(var(--base-position) + 1 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s2::before,
.sort-game-list .sort-list-one-box li.s2:hover::before { 
    background-position: -90px calc(var(--base-position) + 1 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s3::before { background-position: -60px calc(var(--base-position) + 2 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s3::before,
.sort-game-list .sort-list-one-box li.s3:hover::before { 
    background-position: -90px calc(var(--base-position) + 2 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s4::before { background-position: -60px calc(var(--base-position) + 3 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s4::before,
.sort-game-list .sort-list-one-box li.s4:hover::before { 
    background-position: -90px calc(var(--base-position) + 3 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s5::before { background-position: -60px calc(var(--base-position) + 4 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s5::before,
.sort-game-list .sort-list-one-box li.s51:hover::before { 
    background-position: -90px calc(var(--base-position) + 4 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s6::before { background-position: -60px calc(var(--base-position) + 5 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s6::before,
.sort-game-list .sort-list-one-box li.s6:hover::before { 
    background-position: -90px calc(var(--base-position) + 5 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s7::before { background-position: -60px calc(var(--base-position) + 6 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s7::before,
.sort-game-list .sort-list-one-box li.s7:hover::before { 
    background-position: -90px calc(var(--base-position) + 6 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s8::before { background-position: -60px calc(var(--base-position) + 7 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s8::before,
.sort-game-list .sort-list-one-box li.s8:hover::before { 
    background-position: -90px calc(var(--base-position) + 7 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s9::before { background-position: -60px calc(var(--base-position) + 8 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s9::before,
.sort-game-list .sort-list-one-box li.s9:hover::before { 
    background-position: -90px calc(var(--base-position) + 8 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s10::before { background-position: -60px calc(var(--base-position) + 9 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s10::before,
.sort-game-list .sort-list-one-box li.s10:hover::before { 
    background-position: -90px calc(var(--base-position) + 9 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s11::before { background-position: -60px calc(var(--base-position) + 10 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s11::before,
.sort-game-list .sort-list-one-box li.s11:hover::before { 
    background-position: -90px calc(var(--base-position) + 10 * var(--spacing));
}

.sort-game-list .sort-list-one-box li.s12::before { background-position: -60px calc(var(--base-position) + 11 * var(--spacing)); }
.sort-game-list .sort-list-one-box li.active.s12::before,
.sort-game-list .sort-list-one-box li.s12:hover::before { 
    background-position: -90px calc(var(--base-position) + 11 * var(--spacing));
}

.sort-list-type:nth-child(2) {
    margin-top: 5px;
}
/* AI软件 */
.sort-num {
    font-size: 16px;
    color: #7f7f7f;
}
.sort-num span {
    color: #f43030;
    font-weight: bold;
}
.sort-soft-list li {
    width: 580px;
    height: 122px;
    padding: 25px 30px;
    margin-top: 20px;
    background: #fff;
    border-radius: 10px;
    position: relative;
    box-sizing: border-box;
    transition: transform 0.5s;
    margin-right: 40px;
    border: 1px solid #eeeeee;
}
.sort-soft-list li:nth-child(2n+2) {
    margin-right: 0;
}
.sort-soft-list li a {
    display: flex;
}
.sort-soft-list li .software-name {
    font-size: 18px;
    font-weight: bold;
}
.sort-soft-list li .software-icon {
    width: 70px;
    height: 70px;
}
.sort-soft-list .software-desc p {
    color: #9b9a9a;
    margin-right: 20px;
}
.sort-soft-list .software-desc span,
.software-desc-text {
    font-size: 14px;
    color: #606060;
    line-height: 24px;
}
.sort-soft-list li:hover {
    box-shadow: 0px 0 12px 3px rgb(233, 233, 233, 1);
    transform: translate(0px, -5px);
    transition: transform 0.5s;
}

.category-list li:hover .software-name,
.sort-soft-list li:hover .software-name,
.zjbb-list li:hover .software-name,
.xd-ranking-list li:hover .software-name {
    color: #0a7bff;
    font-weight: bold;
}

.xiaodu_tips {
    background: transparent;
    color: #9b9a9a;
    text-align: center;
    font-size: 14px;
    margin: 30px 0;
}