@font-face {
  font-family: "FZLTCHK--GBK1";
  src: url("./兰亭粗黑 GBK.TTF") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

:root {
  --color-primary: #28A878;
  --color-primary-dark: #00a86b;
  --color-text: #333;
  --color-text-light: #666;
  --color-text-muted: #999;
  --color-border: #e8e8e8;
  --color-bg: #fff;
  --color-bg-gray: #f5f7fa;
  --color-footer: #1a1a1a;
  --color-green: #52c41a;
  --color-blue: #1890ff;
  --color-yellow: #faad14;
  --color-purple: #722ed1;
  --color-cyan: #13c2c2;
  --color-pink: #eb2f96;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 24px;
  --shadow-sm: 0 2px 8px rgba(0,0,0,.06);
  --shadow-md: 0 4px 16px rgba(0,0,0,.1);
  /* 430 为设计基准宽，不是最大宽；按 jiaoben 比例缩放 */
  --page-pad: 15px;
  --width330: (330 / 430);
  --width344: (344 / 430);
  --width360: (360 / 430);
  --width375: (375 / 430);
  --width390: (390 / 430);
  --width395: (395 / 430);
  --width400: (400 / 430);
  --width412: (412 / 430);
  --width415: (415 / 430);
  --width516: (516 / 430);
  --width525: (525 / 430);
  --width540: (540 / 430);
  --width560: (560 / 430);
  --width750: (750 / 430);
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
  overscroll-behavior-x: none;
  touch-action: pan-y;
  margin: 0;
  padding: 0;
  background: var(--color-bg);
  font-size: 14px;
}
body {
  font-family: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  color: var(--color-text);
  line-height: 1.6;
  min-height: 100vh;
}
a { text-decoration: none; color: inherit; transition: color .2s, background .2s, border-color .2s, box-shadow .2s, transform .2s; }
ul { padding-left: 0; list-style: none; }
img { max-width: 100%; vertical-align: middle; }
.flexRow { display: flex; flex-direction: row; }
.flexColumn { display: flex; flex-direction: column; }
.flexcenter { align-items: center; justify-content: center; }
.overflowclass { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; }
.overflowclassone { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; }
.container { width: 100%; margin: 0 auto; padding: 0 var(--page-pad); box-sizing: border-box; }
.page-list .page-list-body{padding-bottom: 32px;}
/* ===== .顶部导航 ===== */
.site-header { position: sticky; top: 0; z-index: 100; width: 100%; background:#FFFFFF; box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.06); }
.header-inner { display: flex; align-items: center; justify-content: space-between; height:48px; padding:10px 16px 10px 13px;background: #FFFFFF;box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.06);}
.logo { display: flex; align-items: center; gap: 8px; font-size: 18px; font-weight: 600; color: var(--color-text); flex-shrink: 0; }
.logo-img { width: 150px; height: auto; display: block; }
.logo-text em { font-style: normal; color: var(--color-primary); font-weight: 400; font-size: 14px; margin-left: 4px; }
.main-nav { display: none; }
.headin-left{align-items: center;}
.header-actions { display: flex; align-items: center; gap:16px; }
.btn-search, .btn-user, .btn-menu { display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.btn-search img, .btn-user img, .btn-menu img { display: block; width:18px; height:18px; }
.btn-search b, .btn-user b, .btn-menu b { display: none; }
.link-login, .btn-trial { display: none; }

/* ===== 侧滑菜单 ===== */
.m-nav-mask { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 200; }
.m-nav-panel { position: fixed; top: 0; right: 0; width: 78%; max-width: 320px; height: 100%; background: #fff; z-index: 210; transform: translateX(100%); transition: transform .28s ease; box-shadow: -4px 0 24px rgba(0,0,0,.12); }
body.nav-open { overflow: hidden; }
body.nav-open .m-nav-mask { display: block; }
body.nav-open .m-nav-panel { transform: translateX(0); }
.m-nav-hd { display: flex; align-items: center; justify-content: space-between; height: 52px; padding: 0 16px; border-bottom: 1px solid #F0F0F0; font-size: 16px; font-weight: 500; color: #222; }
.m-nav-close b { display: block; width: 20px; height: 20px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3C/svg%3E") no-repeat center; background-size: contain; }
.m-nav-list { padding: 12px 0; gap: 0; }
.m-nav-list a { display: block; padding: 14px 20px; font-size: 15px; color: #333; border-bottom: 1px solid #F7F7F7; }
.m-nav-list a.check, .m-nav-list a:active { color: #28A878; background: #F1F9F3; }

/* ===== 全站导航弹窗（btn-user） ===== */
.site-nav-layer {
  display: none; position: fixed; left: 0; top: 0;
  width: 100%; height: 100%;
  background: #fff; z-index: 320;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
}
body.site-nav-open { overflow: hidden; }
body.site-nav-open .site-nav-layer { display: block; }
.site-nav-inner {
  width: 100%; min-height: 100%;
  padding: 0 0 40px; box-sizing: border-box;
  background: #fff;
}
.site-nav-hd {
  position: sticky; top: 0; z-index: 2; background: #fff;
  display: flex; align-items: center; justify-content: center;
  height: 48px; padding: 0 16px;
}
.site-nav-back {
  position: absolute; left: 8px; top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
}
.site-nav-back b {
  display: block; width: 20px; height: 19px;
  background: url("../image/icon34.png") no-repeat center; background-size: contain;
}
.site-nav-title {
  margin: 0; font-size: 21px; font-weight: 500; color: #222; line-height: 1;
}
.site-nav-body { padding: 16px 16px 0; }
.site-nav-search {
  display: flex; align-items: center; gap: 8px;
  height: 44px; padding: 0 16px; margin: 0 0 18px;border:1px solid #EEF0F5;
  background:#F6F8FA; border-radius: 23px; box-sizing: border-box;
}
.site-nav-search b {
  flex-shrink: 0; display: block; width: 18px; height: 18px;
  background: url("../image/icon64.png") no-repeat center; background-size: contain;
  opacity: .55;
}
.site-nav-search span {
  flex: 1; min-width: 0; font-size: 16px;color: #8E94A8;line-height: 1;
}
.site-nav-list { display: flex; flex-direction: column; gap: 10px; margin: 0 0 50px; }
.site-nav-item {
  display: flex; align-items: center; gap: 6px;
  min-height: 52px; padding: 12px 16px;box-shadow: 0px 0px 4px 0px #F3EEFC;
  background: #fff; border-radius: 10px;
  box-sizing: border-box;
}
.site-nav-item:active { background: #F8FBF9; border-color: #D8EFE4; }
.site-nav-item img {
  width: 20px; height:20px; 
  object-fit: cover; flex-shrink: 0; display: block;
}
.site-nav-item span {
  flex: 1; min-width: 0; font-size: 16px; color: #000000;
}
.site-nav-item i {
  flex-shrink: 0; width: 6px; height: 12px;
  background: url("../image/icon41.png") no-repeat center; background-size: contain;
}
.site-nav-actions { display: flex; flex-direction: column; gap: 16px; }
.site-nav-login,
.site-nav-trial {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  height: 44px; border-radius: 21px; font-size: 16px; box-sizing: border-box;
}
.site-nav-login {
  color: #28A878; border: 1px solid #28A878; background: #fff;
}
.site-nav-login b {
  display: block; width: 16px; height: 16px; flex-shrink: 0;
  background: url("../image/icon65.png") no-repeat center;
  background-size: contain;
}
.site-nav-trial {
  color: #fff;background: linear-gradient( 270deg, #39C491 0%, #28A878 100%); border: none;
}
.site-nav-trial b {
  display: block; width: 14px; height: 14px; flex-shrink: 0;
  background: url("../image/icon66.png") no-repeat center;
  background-size: contain;
}

/* ===== 搜索浮层 search-layer ===== */

.search-layer {
  display: none; position: fixed; left: 0; top: 0;
  width: 100%; height: 100%;
  background: #fff; z-index: 300; overflow-y: auto; -webkit-overflow-scrolling: touch;
}
.search-layerbg { width: 100%; min-height: 100%; background: rgba(0, 0, 0, 0.6); }
.schbg { padding: 16px 16px 26px; position: relative; background: #fff; }
.sechtitle {
  position: absolute; top: 12px; right: 12px; z-index: 2;
  width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
}
.sechtitle b {
  display: block; width: 22px; height: 22px;
  background: url("../image/icon31.png") no-repeat center;
  background-size: contain;
}
.sechcon { margin: 42px 0 0; }
.sechconlogoa {
  display: flex; justify-content: center; margin: 0 auto 20px; width: 198px;
}
.sechconlogoa img { width: 198px; height: auto; display: block; }
.serchd {
  width: 100%; height: 46px; margin: 0 0 18px;
  background: #F6F8FA; border: 1px solid #EEF0F5; border-radius: 23px;
  padding: 0 16px 0 16px; box-sizing: border-box; transition: border-color .2s;
}
.serchd.onfocus { border-color: #28A878; }
.serchd input {
  flex: 1; min-width: 0; border: none; outline: none; background: transparent;
  font-size: 16px; color: #333333;; height: 100%; padding: 0; margin: 0;
}
.serchd input::placeholder { color: #8E94A8;; }
.serchp {
  flex-shrink: 0; width: 36px; height: 36px; margin: 0; padding: 0;
  border: none; background: transparent; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.serchp b {
  display: block; width: 20px; height: 20px;
  background: url("../image/icon32.png") no-repeat center;
  background-size: contain;
}
.serchd.onfocus .serchp b {
  background-image: url("../image/icon33.png");
}
.top-btn { flex-wrap: wrap; gap: 8px; }
.topbtna {
  display: inline-flex; align-items: center; height:18px; padding: 0 12px;
  background:#F2F2F2; border-radius: 11px; font-size: 10px; color: #222222;
  white-space: nowrap;
}
.topbtna:active, .topbtna.check { background: #F1F9F3; color: #28A878; }
body.search-open { overflow: hidden; }

/* ===== Hero 区域（430px） ===== */
.hero-bg-wrap { position: relative; background: #fff;}
.hero { position: relative;}
.curriculum { padding-top: 0; padding-bottom: 8px; background: transparent; }
.hero-inner {min-height: 243px;
  position: relative; text-align: center; z-index: 1;
  background: url(../image/icon4.png) no-repeat center center;
  background-size: cover;
  overflow: hidden;
}
.hero-inner::before,
.hero-inner::after { display: none; }
.hero-title {letter-spacing:6px;
  font-family: FZLTCHK--GBK1, FZLTCHK--GBK1;
  font-size:32px; line-height:36px; margin:26px 0 6px; color:#000000;position: relative; z-index: 1;
}
.hero-title span:nth-child(1){letter-spacing:5px;}
.hero-title .highlight {margin:6px auto;letter-spacing:4px;    width: 210px;
  background: linear-gradient(270deg, #2266F4 0%, #3CDF78 100%);
  background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
.hero-subtitle { font-size: 12px; color: #555555; margin-bottom: 15px; letter-spacing: 0.5px; font-weight: 400; position: relative; z-index: 1; }
.hero-btns { display: flex; justify-content: center; gap: 12px; position: relative; z-index: 1; }
.btn-primary {
  flex: 1; max-width:98px; height:32px; display: flex; align-items: center; justify-content: center;
  background: linear-gradient( 270deg, #39C491 0%, #28A878 100%); color: #fff; border-radius: 22px;font-size: 12px; transition: all .3s ease;
}
.btn-primary:active { background: linear-gradient(270deg, #19895F 0%, #00BF79 100%); }


.btn-outline { --border-width:1px; --border-radius: 44px; position: relative; isolation: isolate; width: 98px; height: 32px; display: flex; align-items: center; justify-content: center; background: #fff; color: #08754C; border-radius:26px; border: none; font-size: 12px;transition: color .3s ease, box-shadow .3s ease; }
.btn-outline::after { --m-i: linear-gradient(#000, #000); --m-o: content-box, padding-box; content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: var(--border-width); border-radius:26px; background-image: linear-gradient(120deg, #3CE079, #24A979); -webkit-mask-image: var(--m-i), var(--m-i); mask-image: var(--m-i), var(--m-i); -webkit-mask-origin: var(--m-o); mask-origin: var(--m-o); -webkit-mask-clip: var(--m-o); mask-clip: var(--m-o); -webkit-mask-composite: destination-out; mask-composite: exclude; z-index: -1; pointer-events: none; filter: hue-rotate(0deg); }





/* ===== 通用区块 ===== */
.section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.section-title { font-size: 18px; font-weight:500; color: #333333; }
.section-more { font-size: 14px; color:#28A878; display:flex; align-items: center; flex-shrink: 0; }
.section-more b{ background:url(../image/icon15.png) no-repeat; background-size: contain; width:8px; height:8px; margin:0 0 0 3px; }

/* ===== Python 课程体系 ===== */
.curriculum-scroll {overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch;
  margin: 0 calc(-1 * var(--page-pad)); padding: 0 var(--page-pad) 4px;scrollbar-width: none;
}
.curriculum-scroll::-webkit-scrollbar { display: none; }
.curriculum-grid { display: flex; gap: 10px; width: max-content; }
.curriculum-card {box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.1);height: auto; min-height:308px; border-radius:5px; overflow: hidden;
  width:165px; flex-shrink: 0; display: flex; flex-direction: column;background: #fff;
}
.card-green{ background: linear-gradient(180deg, #CEF9ED 0%, #FFFFFF 28%); }
.card-blue{ background: linear-gradient(180deg, #CDDFFF 0%, #FFFFFF 28%); }
.card-yellow{ background: linear-gradient(180deg, #FFEDCD 0%, #FFFFFF 28%);}
.card-purple{ background: linear-gradient(180deg, #D8CDFF 0%, #FFFFFF 28%); }
.card-cyan{ background: linear-gradient(180deg, #CDF3FF 0%, #FFFFFF 28%);  }

.card-green .card-head::after{ background: rgba(26,199,134,0.19); }
.card-blue .card-head::after{ background: rgba(26,56,199,0.19); }
.card-yellow .card-head::after{ background: rgba(199,119,26,0.19); }
.card-purple .card-head::after{ background: rgba(146,26,199,0.19); }
.card-cyan .card-head::after{ background: rgba(26,199,159,0.19); }

.card-green .card-head h3{color: #0D6443;}
.card-blue .card-head h3{color: #1B46B4;}
.card-yellow .card-head h3{color: #B4801B;}
.card-purple .card-head h3{color: #6E1BB4;}
.card-cyan .card-head h3{color: #1A95B7;}

.card-green .card-head span{color:#3CA07A;}
.card-blue .card-head span{color:#6192D6;}
.card-yellow .card-head span{color: #D6AC61;}
.card-purple .card-head span{color: #8161D6;}
.card-cyan .card-head span{color: #59C3D0;}
.cardhd-left{z-index:2;flex: 1; min-width: 0;display: flex; flex-direction: column; justify-content: center;height: auto; overflow: visible;}
.products{ margin: 28px 0 0 0; }
.card-head {
  position: relative;
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin: 5px 6px 0 10px; min-height: 56px; height: auto; padding: 0 0 10px 0;
}
.card-head::after {
  content: ""; position: absolute; left: 3px; right: 3px; bottom: 0;
  height: 1px; pointer-events: none;
}
.card-icon {width: 40px; height: 40px; flex-shrink: 0;object-fit: contain; display: block;}
.card-head h3 {font-size: 14px; font-weight: 500; margin: 0 0 2px 0;white-space:nowrap; overflow: visible; text-overflow: clip; word-break: break-word;}
.cardhd-left span{ font-size: 12px; white-space:nowrap; word-break: break-word; }

.card-links li { line-height: 1.9; min-width: 0; }
.card-links a { display: flex; align-items: center; gap: 6px; width: 100%; min-width: 0; font-size: 11px; color: #555555; padding: 0; }
.card-links a span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-links a b { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width:8px; height:8px; border: 1px solid transparent; border-radius: 50%; box-sizing: border-box; }
.card-links a b::before { content: ""; width:3px; height:3px; border-radius: 50%; background: #28A878; }
.cdlt-title{font-weight: bold;font-size: 12px;color: #000000;margin:0 0 5px 0}
.card-list{ margin:10px 10px 10px; flex: 1; display: flex; flex-direction: column; }
.card-links { margin: 0; gap:7px; display: flex; flex-direction: column; flex: 1; }
.card-more { display:flex; margin-top: 10px; font-size: 12px; color: #28A878;align-items: center;justify-content: center;
width: 145px;height: 28px;background: #F4FCF9;border-radius: 14px;
}
.card-more b{background:url(../image/icon10.png) no-repeat;background-size: contain;width:12px;height: 9px;margin:0 0 0 4px;}
.card-blue .card-more b{background:url(../image/icon11.png) no-repeat;background-size: contain;}
.card-yellow .card-more b{background:url(../image/icon12.png) no-repeat;background-size: contain;}
.card-purple .card-more b{background:url(../image/icon13.png) no-repeat;background-size: contain;}
.card-cyan .card-more b{background:url(../image/icon14.png) no-repeat;background-size: contain;}

.card-blue .card-more{background:#F4F7FC;color:#1B46B4;}
.card-yellow .card-more{background:#FCF9F4;color:#B4801B;}
.card-purple .card-more{background:#F6F4FC;color:#6E1BB4;}
.card-cyan .card-more{background:#F4FBFC;color:#1A95B7;}


.card-blue .card-links a b::before{background: #1B46B4; }
.card-yellow .card-links a b::before{background:#B4801B; }
.card-purple .card-links a b::before{background: #6E1BB4;}
.card-cyan .card-links a b::before{background: #1A95B7;}

.curriculum-dots { display: flex; justify-content: center; gap:4px; margin-top: 12px; }
.curriculum-dots .dot { width: 4px; height: 4px; border-radius: 50%; background:#D9D9D9; transition: all .2s; }
.curriculum-dots .dot.active { width: 20px; border-radius:2px; background: #28A878;}

/* ===== 热搜字词 ===== */
.hot-tags { padding:14px 0 8px; }
.hot-tags-row { margin-bottom: 25px; }
.hot-tags-row:last-child { margin-bottom: 0; }
.hot-tags-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.tags-list { display: flex; flex-wrap: wrap; gap: 8px; }
.tag {display: inline-block; max-width: 100%; padding:4px 16px;
  background: #FFFFFF; border: 1px solid #E7E7E7; border-radius: 16px;
  font-size: 14px; color:#333333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tag:active { border-color: #28A878; color: #28A878; }
.schjg .tag{background:#F9FDFC;font-size: 12px;color: #666666;border:none;padding:2px 8px;border-radius: 12px;}

/* ===== 产品应用 Swiper ===== */
.products-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.page-detail .products-grid{ grid-template-columns: repeat(2, 1fr); }
.page-detail .product-card { width: auto; height: auto; padding: 10px; }

/* 提高优先级，避免被 swiper.min.css 的 .swiper-container{padding:0} 覆盖 */
.swiper-container.products-swiper {
  overflow: hidden; width: 100%;
}
.swiper-container.products-swiper .swiper-slide {
  height: auto; box-sizing: border-box;
  /* 给卡片阴影留出空间，避免被 overflow:hidden 裁切 */
  padding: 4px;
}
.swiper-container.products-swiper .products-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;
  width: 100%;
}
.detail-layout .swiper-container.products-swiper .products-grid{gap:16px;}
.swiper-container.products-swiper .product-card { width: 100%; height: 100%; box-sizing: border-box; }
.products-pagination {
  position: static !important; margin-top: 16px;
  display: flex; justify-content: center; align-items: center; gap: 6px;
}
.products-pagination .swiper-pagination-bullet {
  width: 4px; height: 4px; margin: 0 !important;
  background: #D8D8D8; opacity: 1; border-radius: 50%;
}
.products-pagination .swiper-pagination-bullet-active {
  width:20px; border-radius: 2px; background: #28A878;
}

.product-card {
  position: relative; display: block; padding: 10px;
  background: #fff; min-width: 0;
  border-radius:8px; box-shadow:0px 0px 4px 0px rgba(203,203,203,0.42);
  width: auto; height: auto;
}
.product-card:active { border-color: #28A878; }

.product-tags{border-radius: 10px;
  position: absolute; top:8px; left: 10px; z-index: 2;
  gap:3px; flex-wrap: wrap; max-width: calc(100% - 36px); pointer-events: none;
}
.tagsa{ padding:1px 5px; font-size: 10px; color: #FFFFFF; border-radius: 8px; }
.detail-layout .tagsa{padding:1px 4px;}
.tag-blue{ background: linear-gradient(270deg, #5A72FA 0%, #4488F6 100%);}
.tag-purple{background: linear-gradient(270deg, #A483FF 0%, #9076F5 100%); }
.tag-green{background: linear-gradient(270deg, #3EC4A0 0%, #40C5C5 100%); }
.tag-origin{background: linear-gradient(270deg, #F89A76 0%, #F66F5E 100%); }

.product-thumb { width: 100%; height: auto; aspect-ratio: 1; border-radius: 8px; overflow: hidden; margin: 24px 0 0 0; }
.product-thumb img { width: 100%; height: 100%; object-fit: cover; background: #eee; }
.product-name {    font-weight: 400;
  font-size: 16px; color: #000000; margin: 7px 0 3px 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.product-meta {
  font-size: 12px; color: #999999; margin-bottom: 4px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.product-rating {
  display: flex; width: 100%; min-width: 0;
  font-size: 11px; align-items: center; color: #999999; line-height: 1.3;
  overflow: hidden;
}
.product-rating b {
  flex-shrink: 0; display: inline-block;
  background: url(../image/icon16.png) no-repeat; width: 10px; height: 10px;
  margin: 0 2px 0 0; background-size: contain;
}
.product-rating span {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.product-rating span:nth-of-type(1) {
  flex-shrink: 0; color: #FAAD14; margin: 0 3px;
}
.product-rating span:nth-of-type(2) {
  flex: 1; min-width: 0;
}




/* ===== 文章列表 + 精选 ===== */
.feed-layout { display: flex; flex-direction: column; gap: 24px; margin:32px auto 32px; }
.feed-main { flex: 1; min-width: 0; width: 100%; }
.feed-sidebar { width: 100%; box-shadow: none; border-radius: 0; }
.feed-tabs {
  position: relative; display: flex; flex-wrap: nowrap; gap:10px;
  padding-right: 0; max-height: none; overflow-x: auto; overflow-y: hidden;
  -webkit-overflow-scrolling: touch; scrollbar-width: none;
  margin: 0 calc(-1 * var(--page-pad)); padding: 0 var(--page-pad) 2px;
}
.feed-tabs::-webkit-scrollbar { display: none; }
.feed-tabs.is-open { flex-wrap: wrap; overflow: visible; }
.feed-tabs .tab {width:98px;
  padding: 0 24px; height: 32px; border-radius: 16px; font-size: 14px; color: #1C1C1C;
  border: 1px solid #E5E5E5; display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; white-space: nowrap;
}
.feed-tabs .tab.active { background: linear-gradient(270deg, #39C491 0%, #28A878 100%); color: #fff; border: none; }
.feed-tabs .tab.more { position: static; }
.feed-tabs .tab.more b { display: inline-block; background: url(../image/icon11.png) no-repeat; width: 9px; height: 5px; background-size: contain; margin: 0 0 0 4px; flex-shrink: 0; }
.feed-tabs .tab.more.open b { background: url(../image/icon12.png) no-repeat; background-size: contain; }

.page-list .feed-tabs .tab{min-width: 88px; width: 88px;height: 28px;border-radius: 15px;border: 1px solid #E5E5E5;font-size: 12px;color: #1C1C1C;padding:0;}
.page-list .feed-tabs .tab.active{min-width: 88px;width: 88px; background: linear-gradient( 270deg, #39C491 0%, #28A878 100%);color: #FFFFFF;}


.sidiv{ margin: 0;background: #fff; }
.sidiv .tajx-swiper { overflow: hidden; width: 100%; }
.sidiv .tajx-swiper .swiper-slide { height: auto; }
.sidiv .sidebar-list { display: flex; flex-direction: column; gap: 16px; margin: 0; }
.sidiv .sidebar-list li {
  height: 34px; border-bottom: none; border-radius: 4px; overflow: hidden;
}
.sidiv .sidebar-list li.is-hot {
  background: linear-gradient(270deg, rgba(254,240,240,0) 0%, #FEEEEF 100%);
  border-radius: 4px;
}
.sidiv .sidebar-list li.is-new {
  background: linear-gradient(270deg, rgba(254,248,240,0) 0%, #FEF9EE 100%);
  border-radius: 4px;
}
.sidiv .sidebar-list a {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  height: 34px; padding: 0 0 0 7px; font-size: 16px; line-height: 34px; color: #444;
}
.sidiv .sidebar-icon {
  width: 18px; height: 18px; margin: 0 6px 0 0; vertical-align: -4px; object-fit: contain;
}
.sidiv .sidebar-text {
  flex: 1; min-width: 0; display: block;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  -webkit-line-clamp: unset;
}
.sidiv .sidebar-text > span {
  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sidiv .sidebar-views {
  flex-shrink: 0; display: inline-flex; align-items: center; gap:4px;
  font-size: 16px; color:#D29D6B; padding-top: 0; line-height: 1;
}
.sidiv .sidebar-views .views-icon {
  width: 11px; height: 14px; object-fit: contain; display: block;
}
.sidiv .products-pagination { margin-top: 16px; }

.widget-box .swiper-container.widget-swiper { overflow: hidden; width: 100%; }
.widget-box .swiper-container.widget-swiper .swiper-slide { height: auto; }
.widget-box .products-pagination { margin-top: 16px; }

.article-list { display: flex; flex-direction: column; gap: 0; margin:4px 0 0 0; }
.sch-list .article-list[data-panel] { display: none; }
.sch-list .article-list[data-panel].is-active { display: flex; }
.article-item { display: flex; gap: 12px; padding: 10px 0; border-bottom: 1px solid #F0F0F0; }
.article-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.article-title { font-size: 16px;margin-bottom:2px; line-height: 1.4; overflow: hidden; }
.article-title a { display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical; overflow: hidden; color: #222222;white-space: nowrap;}
.article-title a:active { color: #28A878; }
.sch-list.schjg .article-title a span { color: #28A878; }
.article-summary {
  font-size: 14px; color:#555555; height: auto; max-height:20px; line-height: 18px;
  margin-bottom:3px; display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical;
  overflow: hidden; word-break: break-all;
}
.article-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top:4px; }
.article-tag { padding: 1px 8px; background: #F6FBF5; border-radius: 11px; font-size: 10px; color:#146245; border: 1px solid transparent; }
.idx .article-tag,.schjg .article-tag{ background: #F6FBF5; color:#146245; padding:1px 8px; }
.artdtl .article-tag{ background: #F6FBF5; color:#146245; padding:3px 8px;font-size: 12px;border-radius: 12px;}
.article-tag,.page-list .article-tag{ background: #F6FBF5; color:#146245; }
.article-info { font-size: 12px; color:#999999; gap: 10px; flex-wrap: wrap; }
.article-info div{ display:flex; align-items: center; }
.article-thumb { width:148px; height:88px; flex-shrink: 0; border-radius: 6px; overflow: hidden; align-self: flex-start; margin-top: 2px; }
.article-thumb img { width: 100%; height: 100%; object-fit: cover; background: #eee; }
.article-thumb-small{ width:88px; height: 88px; }
.btn-more-info {
  display: flex; align-items: center; justify-content: center; gap:6px;
  height:38px; width: 100%; margin-top: 16px; border-radius: 21px;
  font-size: 16px; color: #666666; background: #F2F2F2;
}
.btn-more-info:active { color: #28A878; background:#F1F9F3; }
.icon-more{ background: url(../image/icon23.png) no-repeat; background-size: contain; width:16px; height: 16px; }
.art-left-down{ justify-content: space-between; flex-wrap: wrap; gap: 8px; }

.info-name b,.info-time b,.info-watch b{ display: inline-block; background-size: contain; background-repeat: no-repeat; margin:0 3px 0 0; width:12px; height: 12px; flex-shrink: 0; }
.info-name b{ background-image: url(../image/icon19.png); }
.info-time b{ background-image: url(../image/icon20.png); }
.info-watch b{ background-image: url(../image/icon22.png); }

/* ===== 侧边栏 / TA的精选 ===== */
.sidebar-title { font-size: 17px; font-weight:500; color: #333333; }
.sidebar-list li { border-bottom: 1px solid #F6F6F6; padding: 0; }
.sidebar-list li:last-child { border-bottom: none; }
.sidebar-list a {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 10px;
  padding: 12px 0; font-size: 14px; line-height: 1.45; color: #444444;
}
.sidebar-list a:active { color: #28A878; }
.sidebar-icon { display: inline-block; width: 16px; height: 16px; object-fit: cover; margin: 0 4px 0 0; vertical-align: -2px; }
.sidebar-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-break: break-word; }
.sidebar-text > span { display: inline; }
.sidebar-views { flex-shrink: 0; font-size: 12px; color: #999; padding-top: 2px; }
.sidebar-more { text-align: center; margin-top: 12px; padding: 7px 0; font-size: 13px; color:#666666; border-radius: 18px; background: #F3F3F3; }
.sidebar-more b{ background: url(../image/icon25.png) no-repeat; background-size: contain; margin:0 0 0 4px; width:10px; height: 10px; }
.sidebar-down{ font-size: 12px; color: #999999; justify-content: space-between; margin:4px 0 0 0; }

/* ===== 页脚 ===== */
.site-footer { width: 100%; background: #000000; color: rgba(255,255,255,.7); }
.footer-inner { display: flex; flex-direction: column;padding: 0 0 16px; }
.footer-brand { width: 100%; margin: 0;padding:16px 15px 0 15px;}
.footer-logo { display: flex; align-items: center; gap: 8px; margin-bottom:8px; }
.footer-logo-img { width: 198px; height: auto; display: block;padding:0 0 0 5px;}
.footer-desc {font-size: 14px; line-height: 1.7; margin-bottom: 10px;color: #979797; width: 100%;}
.footer-social { display: flex; gap: 12px; }
.footer-social a {
  display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 50%;
  background: rgba(255,255,255,.08);
}
.footer-social a img { width:28px; height:28px; border-radius: 50%; display: block; opacity: 1; }
.footer-links {padding:28px 15px 15px 15px;
  display: flex; gap: 0; flex: none;
  justify-content: space-between; width: 100%;
}
.footer-col { flex: 1; min-width: 0; }
.footer-col h4 {font-size: 16px;color:#E9E9E9;margin-bottom: 10px;    font-weight: 400;}
.footer-col ul { gap: 10px; }
.footer-col a { font-size: 14px; color:#7E7E7E;; }
.footer-col a:active { color: #28A878; }
.footer-subscribe {margin:0 15px 0 15px;display: flex; align-items: center; gap: 15px;background: #FFFFFF; border-radius: 12px; padding:5px;}
.footer-qrcode {width: 120px;height: 120px;background: #FFFFFF;border-radius: 4px;border: 1px solid #D3EBDB;
  display: flex; align-items: center; justify-content: center;
  margin: 0; overflow: hidden; box-sizing: border-box;margin:10px 0 10px 10px;
}
.qrcode-img {width: 106px;height: 106px;border-radius: 4px;object-fit: cover; display: block; }
.foot-line{width:2px ;background: #DEF6E2;height:130px;}
.footer-sub-info { flex: 1; min-width: 0;display: flex; flex-direction: column; align-items: stretch;}
.footer-sub-info .sub-title {font-size: 16px; font-weight:500; color: #444444; line-height: 1.3;}
.footer-sub-info .sub-desc {font-size: 14px; color: #8B8E95; margin: 6px 0 14px 0; line-height: 1.45;}
.btn-subscribe {display: flex; align-items: center; justify-content: center;width:152px; height: 32px; padding: 0 12px;
  background:#28A878;color: #FFFFFF; border-radius: 16px;font-size: 12px;box-sizing: border-box;
}
.btn-subscribe:active { opacity: .92; }
.footer-bottom { border-top: 1px solid rgba(242, 242, 242, 0.31); padding: 14px 0 18px; }
.footer-bottom .container {display: flex; align-items: center;gap: 45px; flex-wrap: wrap;justify-content: center;}
.footer-copy,.footer-beian {font-size: 12px; color: #FFFFFF; line-height: 1.5; margin: 0;}
.footer-beian {display: inline-flex; align-items: center; gap: 4px;color: #FFFFFF; white-space: nowrap;}
.footer-beian a { color: #B7B7B7; }
.gh { width: 12px; height: 13px; margin: 0; vertical-align: middle; flex-shrink: 0; }
.foot-qrcode { align-items: center; }
.foot-qrcode p{ font-size: 13px; color: #B7B7B7; }
/* ===== 搜索页（430px） ===== */
.search-hero-inner{padding:0 33px 0 26px;}
.search-hero {padding: 20px 0 18px;background: linear-gradient(180deg, #e8f8f2 0%, #eef5ff 45%, #fff 100%);text-align: center;}
.schjg .search-hero {background: #fff url(../image/icon50.png) no-repeat center top;background-size: 100% auto;padding: 70px 0 28px;}
.search-brand { display: inline-block; margin: 0 auto 14px; }
.search-brand img { height: 28px; width: auto; object-fit: contain; }
.search-box {display: flex; align-items: center; width: 100%; margin: 0 auto 14px;background: #fff; border-radius: 24px; overflow: hidden;
  padding: 3px 3px 3px 0; height:32px;box-shadow: 0 2px 10px rgba(40,168,120,0.16);
}
.search-input {flex: 1; min-width: 0; padding: 0 12px 0 16px; border: none; outline: none;
  font-size: 11px; background: transparent; color: #333;
}
.search-input::placeholder { color: #999; }
.search-submit {padding: 0 12px; height: 28px; border-radius: 19px;background: linear-gradient(270deg, #37C18F 0%, #28A777 100%);
  color: #fff; border: none; font-size: 12px; font-weight:bold;cursor: pointer; white-space: nowrap; align-items: center; flex-shrink: 0;
}
.search-submit b {background: url(../image/icon68.png) no-repeat center; background-size: contain;width: 12px; height: 12px; margin: 0 4px 0 0; display: inline-block;}
.hot-keywords {display: flex; align-items: flex-start; gap: 6px;margin: 0; text-align: left;}
.hot-label {font-size: 14px; color: #AEAEAE; flex-shrink: 0; line-height: 26px; white-space: nowrap;}
.hot-keywords-list {flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap:10px;max-height: 26px; overflow: hidden;}
.hot-keywords.is-open .hot-keywords-list { max-height: none; }
.hot-toggle {flex:0 0 26px;width:26px;height:26px;padding:0;border:0;border-radius:13px;background:rgba(255,255,255,.82);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:none;}
.hot-toggle b {display:block;width:7px;height:7px;border-right:2px solid #25aa7c;border-bottom:2px solid #25aa7c;transform:translateY(-2px) rotate(45deg);transition:transform .2s ease;}
.hot-keywords.is-open .hot-toggle b {transform:translateY(2px) rotate(225deg);}
.search-main { padding: 8px 0 0; }

.search-tabs {display: flex;flex-wrap: nowrap;width:calc(100%-32px);margin:0 0 17px 0;
  overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;padding: 0  22px;
  height: 42px;background: #FFFFFF;box-shadow: 0px 0px 4px 0px #F3EEFC;border-radius: 8px;gap:26px;
}
.search-tabs::-webkit-scrollbar { display: none; }
.search-main .search-tabs{width:100%;gap:8px;justify-content:space-between;box-sizing:border-box}.search-main .search-tab{flex:1 1 0;min-width:64px;text-align:center}
.search-tab {align-items: center;display: flex;
  flex-shrink: 0; font-size: 18px; color: #444444;
  position: relative; margin-bottom: 0; white-space: nowrap;
}
.search-tab:active { color: #222222; }
.search-tab.active { color: #222222; }
.search-tab.active::after {
  content: ""; position: absolute; bottom:6px; left: 50%; transform: translateX(-50%);
  width: 16px; height:2px;background: #222222;
}
.search-right {
  font-size: 12px; color: #AAABB7; margin: 12px 0 4px; text-align: left;
}
.search-right span { color: #28A878; }
.sch-list .article-list { margin-top: 0; }
.search-count { font-size: 13px; color: var(--color-text-muted); }
.search-count em { color: var(--color-primary); font-style: normal; font-weight: 600; }
.empty-state { text-align: center; padding:70px 0 68px; }
.empty-img { width: 259px; height: auto; margin: 0 auto 10px; object-fit: contain; display: block; }
.empty-title { font-size: 14px; color: #333333; margin: 0 auto 10px; line-height: 1.6; word-break: break-all; }
.empty-title em { color: #28A878; font-style: normal; }
.empty-desc { font-size: 14px; color: #999999; line-height: 1.5; }

/* ===== 分页（430px） ===== */
.schjg .pagination { margin: 16px 0 32px; }
.pagination {
  display: flex; flex-direction: column; align-items: center;
  gap: 12px; margin-top: 20px;
}
.page-btns {
  display: flex; align-items: center; justify-content: center;
  flex-wrap: wrap; gap:10px 4px;
}
.page-extra {
  display: flex; align-items: center; justify-content: center;
  gap: 10px; flex-wrap: wrap;
}
.page-btn, .page-num {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 32px; height: 32px; padding: 0 8px;
  border: 1px solid #F2F2F2; border-radius:4px;
  font-size: 12px; color: #000000; background: #fff;
}
.page-btn:active, .page-num:active { border-color: #28A878; color: #28A878; }
.page-num.active { background: #28A878; color: #fff; border-color: #28A878; }
.page-num.active:active { background: #28A878; color: #fff; border-color: #28A878; }
.page-btn.disabled, .page-btn.disabled:active {padding:0 12px;
  color: #8D9099; border-color: #F0F0F3; background: #F7F8FC;
  cursor: not-allowed; pointer-events: none;
}
.page-ellipsis { color: var(--color-text-muted); padding: 0 2px; font-size: 12px; }
.page-total, .page-jump { font-size: 14px; color:#0E0E0E; }
.page-total { margin-left: 0; }
.page-input {
  width: 36px; height: 28px; border: 1px solid #F2F2F2; border-radius: 6px;
  text-align: center; font-size: 12px; margin: 0 4px; outline: none;
}
.page-go {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 14px; height: 28px; margin-left: 4px;border: 1px solid #F2F2F2;
  background: #FFFFFF; color: #0E0E0E; border-radius:3px; font-size: 12px;
}

/* ===== 列表页（430px） ===== */
.page-list { padding: 0 0 24px; min-height: auto; }
.ztlist.page-list { padding-bottom: 0; }
.topic-detail.page-list { padding-bottom: 0; }
.page-list-body { padding: 0; }
.page-list-layout {
  display: flex; flex-direction: column; gap: 0;
  align-items: stretch; min-height: auto;
}
.page-main { flex: 1; min-width: 0; padding-top: 0; width: 100%; }
.artlist.page-main { padding-top: 0; width: 100%; max-width: 100%; margin: 0; }
.page-sidebar { width: 100%; flex-shrink: 0; margin: 0; }
.artdtl .page-sidebar { margin-top: 0; }
.topic-detail.page-list .page-sidebar,
.topic-detail .page-main { margin-top: 0; }

/* 顶部横向分类 */
.m-cat-scroll {
  display: flex; flex-wrap: nowrap; gap:27px;
  overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  padding: 12px 15px 0 15px;
}
.m-cat-scroll::-webkit-scrollbar { display: none; }
.m-cat-item {
  flex-shrink: 0; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 4px; min-width: 68px; padding: 0;
  font-size: 13px; color: #666; position: relative;
}
.m-cat-icon { width: 20px; height: 20px; object-fit: contain; }
.m-cat-item.active { color: #28A878; font-weight: 600; }
.m-cat-item.active::after {
  content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 20px; height: 3px; border-radius: 2px; background: #28A878;
}

/* 子筛 + 目录 */
.m-sub-bar {
  display: flex; align-items: center; gap: 8px;
  padding: 15px 12px 10px 16px; background: #F7F8FA;
}
.m-sub-scroll {
  flex: 1; min-width: 0; display: flex; flex-wrap: nowrap; gap: 8px;
  overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.m-sub-scroll::-webkit-scrollbar { display: none; }
.m-sub-item {
  flex-shrink: 0; height:32px; padding: 0 12px;
  display: inline-flex; align-items: center; justify-content: center;
  background:#F0F2F7;border-radius:8px;
  font-size: 16px; color:#171A23; white-space: nowrap;
}
.m-sub-item.active { background:#F1F9F3;color: #28A878; }
.btn-catalog {
  flex-shrink: 0; width: 40px; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 2px;
  font-size: 10px; color: #666;
}
.btn-catalog b {
  display: block; width: 18px; height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='8' y1='6' x2='21' y2='6'/%3E%3Cline x1='8' y1='12' x2='21' y2='12'/%3E%3Cline x1='8' y1='18' x2='21' y2='18'/%3E%3Ccircle cx='4' cy='6' r='1' fill='%23666'/%3E%3Ccircle cx='4' cy='12' r='1' fill='%23666'/%3E%3Ccircle cx='4' cy='18' r='1' fill='%23666'/%3E%3C/svg%3E") no-repeat center;
  background-size: contain;
}

/* 桌面侧栏导航在移动端隐藏（改用顶部 Tab + 目录浮层） */
.page-list-layout > .left-nav { display: none; }

/* left-nav 基础（目录浮层 / 其他页复用） */
.left-nav {
  width: 100%; flex-shrink: 0; align-self: stretch; background: #fff;
  box-shadow: none; border-radius: 0; margin: 0; padding: 0; overflow: visible; border: none;
}
.left-nav-list {
  overflow: hidden; border-radius: 0; gap: 10px;
  display: flex; flex-direction: column;
}
.left-nav-list > li { position: relative; }
.left-nav-list > li > .nav-parent {
  display: flex; align-items: center; gap: 8px; padding: 8px 16px;
  font-size: 15px; color: #000; position: relative;
}
.left-nav-list > li > .nav-parent:active { color: #28A878; background: #F1F9F3; }
.left-nav-list > li.active > .nav-parent { color: #28A878; background: #F1F9F3; }
.left-nav-list > li.active::before {
  content: ""; position: absolute; left: 0; top: 0; z-index: 1;
  width: 2px; height: 40px; background: #28A878; border-radius: 4px;
}
.left-nav .nav-icon { width: 18px; height: 18px; flex-shrink: 0; object-fit: contain; }
.left-nav .nav-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.left-nav .nav-arrow {
  display: inline-block; width: 10px; height: 10px; margin-left: auto; flex-shrink: 0;
  background: url(../image/icon59.png) no-repeat center; background-size: contain;
}
.left-nav-list > li.open > .nav-parent .nav-arrow { background-image: url(../image/icon60.png); }
.left-nav .sub-nav { display: none; padding: 4px 0 8px; gap: 2px; }
.left-nav-list > li.open > .sub-nav { display: flex; }
.left-nav .sub-nav a {
  display: block; position: relative; padding: 7px 3px;text-align: center;
  font-size: 14px; color:27292C; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.left-nav .sub-nav a::before {
  content: ""; position: absolute; left: 26px; top: 50%; transform: translateY(-50%);
  width: 6px; height: 6px; background: #C1C1C1; border-radius: 50%;
}
.left-nav .sub-nav li.active a, .left-nav .sub-nav a:active { color: #28A878; }
.left-nav .sub-nav li.active a::before, .left-nav .sub-nav a:active::before { background: #28A878; }
.newgx .nav-icon { width: 18px; height: 18px; }

.breadcrumb img { width: 10px; height: 12px; margin: 0 3px 0 0; }
.breadcrumb, .breadcrumb a { font-size: 12px; color: #999999; }
.breadcrumb .lastbreada { color: #333333; }
.breadcrumb { margin: 12px 0 10px; align-items: center; }
.artlist .breadcrumb { display: none; }
.topic-banner {
  display: flex; align-items: center;
  padding: 14px 14px 14px 16px;
  background: url(../image/icon67.png) no-repeat right center;
  background-size: cover;
  margin: 12px 0 14px; border-radius: 10px; height: auto; min-height: 120px;
}
.banner-blue { background: url(../image/icon67.png) no-repeat right center; background-size: cover; }
.banner-body { flex: 1; min-width: 0; max-width: 68%; }
.banner-title {
  font-size: 18px; font-weight:500; color: #333; line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: auto; max-width: 100%;
}
.banner-desc {
  font-size: 14px; color:#4F5C7B; line-height: 18px; margin: 6px 0 8px;
  width: auto; max-width: 100%;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  overflow: hidden; text-overflow: ellipsis;
}
.banner-meta { font-size: 12px; color:#606673; flex-wrap: wrap; gap: 16px; }
.banner-meta span { margin-right: 0; }
.info-name, .info-time, .info-watch, .bninfo-num, .bninfo-gx { align-items: center; }
.bninfo-num b {
  display: inline-block; background: url(../image/icon69.png) no-repeat; background-size: contain;
  margin: 0 3px 0 0; width: 12px; height: 12px;
}
.bninfo-gx b {
  display: inline-block; background: url(../image/icon68.png) no-repeat; background-size: contain;
  margin: 0 3px 0 0; width: 12px; height: 12px;
}
.paglist-sec {
  background: #fff; box-shadow: none; border-radius: 0;margin: 0;
}
.page-list .feed-tabs {
  margin: 0 0 4px; padding: 0 0 2px;
}
.page-list .article-item { padding: 14px 0; }
.page-list .article-info { gap: 12px; margin-bottom: 2px; }
.page-list .article-tags { margin-top: 6px; }
.artlist .topic-banner{
    background: url(../image/icon59.png) no-repeat right center;
  background-size: cover;
}
.topic-banner {
  flex-direction: column; align-items: stretch;
  background: url(../image/icon54.png) no-repeat right center;
  background-size: cover;
  padding: 10px 15px 12px 15px;
  margin: 24px 0 16px; border-radius: 10px;
  min-height: 115px; height: auto; overflow: hidden;
}
.topic-banner .banner-body { max-width: 68%; min-width: 0; }
.topic-banner .banner-tabs {
  display: flex; flex-wrap: nowrap; gap: 8px;
  width: 100%; min-width: 0; max-width: 100%;
  margin: 10px 0 0; padding: 0;
  overflow-x: auto; overflow-y: hidden;
  -webkit-overflow-scrolling: touch; scrollbar-width: none;
  touch-action: pan-x;
}
.topic-banner .banner-tabs::-webkit-scrollbar { display: none; }
.topic-banner .banner-tabs .tab {
  flex-shrink: 0; width: auto !important; min-width: 72px;
  height: 28px; padding: 0 12px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.85); border: 1px solid rgba(255,255,255,.6);
  border-radius: 14px; font-size: 12px; color: #555; white-space: nowrap;
}
.topic-banner .banner-tabs .tab.active {
  min-width: 72px;
  background: linear-gradient(270deg, #39C491 0%, #28A878 100%);
  color: #fff; border-color: transparent;
}
.topic-banner .bninfo-num b {
  background-image: url(../image/icon55.png);
}
.topic-banner .bninfo-gx b {
  background-image: url(../image/icon56.png);
}
.m-cat-item {
  flex-direction: row; min-width: auto; gap: 0;padding:0;
   font-size: 18px;color:#444444;
}
.m-cat-item.active { font-weight:bold; color: #222; }
.m-cat-item.active::after {
  width: 24px; height: 3px; background: #222;
}
.m-sub-bar {
  padding: 15px 12px 0 16px; background: #fff;
}
.btn-catalog {
  border-left: 1px solid #E8E8E8;
  padding-left: 10px; margin-left: 2px;
}
.sidebar-more { display: none; }

/* 目录浮层：btn-menu 显示文章分类，btn-catalog 显示专题列表 */
.catalog-layer .zt-lists { display: none; }
body.catalog-zt .catalog-layer .zt-lists { display: block; }
body.catalog-zt .catalog-layer .menu-right { display: none; }

.banner-img { width: 80px; height: 80px; object-fit: contain; background: transparent; flex-shrink: 0; }

/* ===== 目录浮层（btn-menu） ===== */
.catalog-mask {
  display: none; position: fixed; left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,.45); z-index: 220;
}
.catalog-layer {
  position: fixed; left: auto; right: 0; top: 0; transform: translateX(100%);
  width: 90%; height: 100%;
  background: #fff; z-index: 230;
  transition: transform .28s ease;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
}
body.catalog-open { overflow: hidden; }
body.catalog-open .catalog-mask { display: block; }
body.catalog-open .catalog-layer { transform: translateX(0); }
.catalog-hd {
  position: sticky; top: 0; z-index: 2; background: #fff;
  display: flex; align-items: center; justify-content: center;
  height:48px; padding: 0 18px;
}
.catalog-back {position: absolute; left: 8px; top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
}
.catalog-back b {display: block; width:20px; height:19px;background: url("../image/icon34.png") no-repeat center;background-size: contain;}

.catalog-logo img { height: 28px; width: auto; display: block; }
.catalog-body { padding:0 16px 32px; }
.catalog-sec-title { font-size: 18px; font-weight:500; color: #222; margin: 0 0 12px; }

/* 上半：文章分类卡片 */
.catalog-left { margin: 0 0 28px; }
.catalog-nav { gap: 10px; display: flex; flex-direction: column; margin: 0; overflow: visible; }
.catalog-nav > li {background: #fff; border-radius:8px;box-shadow: 0px 0px 4px 0px #F3EEFC;overflow: hidden;}
.catalog-nav > li > .nav-parent {
  display: flex; align-items: center; gap: 4px; padding: 12px 16px;
  font-size: 16px; color: #222; background: #fff;
}
.catalog-nav > li > .nav-parent:active,
.catalog-nav > li.active > .nav-parent { color: #000000; background: #fff; }
.catalog-nav > li.active::before { display: none; }
.catalog-nav .nav-icon {width: 20px; height: 20px;object-fit: contain; flex-shrink: 0;}
.catalog-nav .nav-label { font-size:16px; }
.catalog-nav .nav-arrow {margin-left: auto; width:6px; height: 12px; flex-shrink: 0;
  background: url("../image/icon41.png") no-repeat center;
  background-size: contain; transition: transform .2s;
}
.catalog-nav > li.open > .nav-parent .nav-arrow {background-image: url("../image/icon42.png");width:12px;height: 6px;}
.catalog-nav .sub-nav {display: none; padding: 0 12px 16px;background: #fff;}
.catalog-nav > li.open > .sub-nav {display: grid; grid-template-columns: repeat(3, 1fr); gap:10px;}
.catalog-sub { width: 100%; }
.catalog-sub li { width: auto; min-width: 0; list-style: none; }
.catalog-sub a {display: flex; align-items: center; justify-content: center;width: 100%; height: 34px; padding: 0 6px; box-sizing: border-box;
  background: #F5F5F5; border-radius: 8px;font-size: 12px; color: #555; position: static;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.catalog-sub a::before { display: none !important; }
.catalog-sub li.active a,
.catalog-sub a:active { background: #F1F9F3; color: #28A878; }

/* 下半：专题列表 = 图标 + 文字 */
.catalog-topics {display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 10px;padding-bottom: 8px;}
.catalog-topics a {display: flex; align-items: center; gap: 6px; min-width: 0;font-size: 13px; color: #333;}
.catalog-topics a img {width: 18px; height: 18px; object-fit: contain; flex-shrink: 0;}
.catalog-topics a span {flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

/* 侧边内容区块在列表页下沉为通栏 */
.page-list .widget-box {box-shadow: none; border-radius: 0; padding:25px 0 0 0;margin: 0;}
.page-list .widget-box .section-header { margin-bottom: 10px; }
.page-list .widget-title,
.page-list .sidebar-title { font-size: 18px;margin: 0; }
.page-list .widget-hot-topics .widget-thumb,
.page-list .widget-courses .widget-thumb { width: 120px;height: 68px;border-radius: 4px;}
.page-list .widget-hot-topics .widget-text,
.page-list .widget-courses .widget-text { font-size: 16px; min-height:42px; line-height: 1.4; }
.page-list .sidebar-more { display: none; }

/* ===== 专题详情 Hero（430px） ===== */
.topic-detail .topic-hero {
  width: 100%; height: auto;
  background: #fff;
  padding: 0 0 10px;
}
.topic-detail .topic-hero .breadcrumb {
  margin: 0; padding: 12px 0 10px;
  align-items: center; gap: 6px;
  font-size: 12px; color: #999;
}
.topic-detail .topic-hero .breadcrumb img {
  width: 14px; height: 14px; object-fit: contain; flex-shrink: 0;
}

.topic-detail .topic-hero .breadcrumb .lastbreada { color: #333; }
.topic-detail .topic-header {
  display: flex; flex-direction: column; gap: 12px;
  margin: 0; padding: 16px;
  background: linear-gradient(0deg, #EEF8F7 0%, #A8E2E8 100%);
  border-radius: 12px;
  border: 1px solid #E6F3EC;
  border-bottom: none;
  box-shadow: 0 2px 8px rgba(40, 168, 120, 0.06);
}
.topic-detail .topic-header-cover {    height: 206px;
    flex-shrink: 0;
    border-radius:10px;
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(154deg, rgba(40, 168, 120, 1), rgba(56, 194, 144, 1)) border-box;
    overflow: hidden;
    box-sizing: border-box;
}
.topic-detail .topic-header-img {
  width: 100%; height: 100%; object-fit: cover;
  border-radius:8px; display: block; background: #f0f0f0;
}
.topic-detail .topic-header-body { flex: 1; min-width: 0; gap: 0; }
.topic-detail .topic-header-title {
  font-size: 18px; font-weight:500; color: #000000;
  margin: 0; line-height: 1.4;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  overflow: hidden; white-space: normal;
}
.topic-detail .topic-header-desc {
  font-size: 16px; color: #444444;
  margin:4px 0 8px;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
  overflow: hidden;
}
.topic-detail .topic-header-meta {
  align-items: center; flex-wrap: wrap; gap:20px;
  font-size: 12px; color: #888888; margin: 0;
}
.topic-detail .topic-header-meta span { margin-right: 0; }
.topic-detail .topic-header-tags {
  align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px;
}
.topic-detail .topic-header-tags .tags-label { font-size: 14px; color: #444444; }
.topic-detail .topic-header-tags .article-tag {
  background:#FFFFFF; color:#28A878; padding: 2px 10px; border-radius: 999px;font-size: 12px;
}
.topic-detail .page-list-body { padding-top: 4px; }
.topic-detail .sidebar-more { display: none; }

/* ===== 侧边栏 Widget ===== */
.widget-box { background: #fff;
  border-radius: 8px; padding:10px 15px 16px 15px; margin-bottom:20px; 
}
.widget-title { font-size:18px;color: #333333;font-weight: 400;}
.xgxz .widget-title{margin-bottom: 10px;}
.widget-list li { border-bottom: 1px solid var(--color-border); }
.widget-list li:last-child,.widget-links li,.widget-topics li{ border-bottom: none; }
.widget-list a { display: flex; align-items: center; gap: 10px; padding: 10px 0; font-size: 13px; color: var(--color-text); }
.widget-list a:hover { color: var(--color-primary); }
.widget-icon { width: 18px; height: 18px; background: #fff3e0; border-radius: 50%; flex-shrink: 0; object-fit: cover; }
.widget-thumb { width: 48px; height: 48px; border-radius: var(--radius-sm); background: var(--color-bg-gray); flex-shrink: 0; object-fit: cover; }
.widget-text { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.widget-meta { font-size: 12px; white-space: nowrap; flex-shrink: 0; justify-content:flex-start;}
.widget-picks a { flex-wrap: wrap; }
.widget-picks .widget-text { flex: 1 1 100%; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.widget-topics a { align-items: flex-start; }
.widget-topics .widget-text { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.widget-hot-topics { gap: 16px; }

.widget-hot-topics .widget-topic-link { display: flex; align-items: flex-start; padding: 0; gap: 0; width: 100%; }
.widget-hot-topics .widget-thumb { width: 120px; height: 68px; border-radius: 4px; margin: 0 10px 0 0; object-fit: cover; flex-shrink: 0; }
.widget-hot-topics .widget-topic-body { flex: 1; min-width: 0; gap: 8px; }
.widget-hot-topics .widget-text { font-size: 16px; color: #000000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;line-height:18px;min-height: 45px;}
.widget-hot-topics .widget-topic-link:hover .widget-text { color: #28A878; }
.widget-hot-topics .widget-meta { align-items: center; gap: 16px; font-size: 12px; color: #888888;line-height: 16px;}
.widget-hot-topics .widget-date, .widget-hot-topics .widget-view { display: inline-flex; align-items: center; gap: 4px; }
.widget-hot-topics .widget-date b { display: inline-block; width: 14px; height: 14px; background: url(../image/icon20.png) no-repeat center; background-size: contain; flex-shrink: 0; }
.widget-hot-topics .widget-view b { display: inline-block; width: 14px; height: 14px; background: url(../image/icon22.png) no-repeat center; background-size: contain; flex-shrink: 0; }
.widget-courses { gap: 16px; }
.widget-courses li:last-child { border-bottom: none; }

.widget-courses .widget-topic-link { display: flex; align-items: flex-start; padding: 0; gap: 0; width: 100%; }
.widget-courses .widget-thumb { width: 110px; height: 62px; border-radius: 4px; margin: 0 9px 0 0; object-fit: cover; flex-shrink: 0; background: #F5F5F5; }
.widget-courses .widget-topic-body { flex: 1; min-width: 0; gap: 8px; }
.widget-courses .widget-text { font-size: 16px; color: #000000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; line-height: 18px;min-height: 36px;}
.widget-courses .widget-topic-link:hover .widget-text { color: #28A878; }
.widget-courses .widget-meta { align-items: center; gap: 16px; font-size: 12px; color: #999999; line-height: 16px; }
.widget-courses .widget-author, .widget-courses .widget-view { display: inline-flex; align-items: center; gap: 4px; }
.widget-courses .widget-author b { display: inline-block; width: 12px; height: 12px; background: url(../image/icon19.png) no-repeat center; background-size: contain; flex-shrink: 0; }
.widget-courses .widget-view b { display: inline-block; width: 12px; height: 12px; background: url(../image/icon22.png) no-repeat center; background-size: contain; flex-shrink: 0; }
.widget-downloads { gap: 13px; }
.widget-downloads li { border-bottom: 1px solid #F6F6F6; padding-bottom: 14px; }
.widget-downloads li:last-child { border-bottom: 1px solid #F6F6F6; }
.widget-downloads .widget-dl-link { display: flex; align-items: center; padding: 0; gap: 10px; width: 100%; }
.widget-downloads .widget-dl-link:hover { color: inherit; }
.widget-downloads .widget-app-icon { width: 48px; height: 48px; border-radius: 55px; object-fit: cover; flex-shrink: 0; background: #F5F5F5; }
.widget-downloads .widget-dl-body { flex: 1; min-width: 0; gap: 4px; }
.widget-downloads .widget-text { font-size: 16px; color: #000000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: none; }
.widget-downloads .widget-dl-link:hover .widget-text { color: #28A878; }
.widget-downloads .widget-desc { display: block; font-size: 14px; color: #6E6E6E; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.widget-downloads .widget-dl-link:hover .widget-desc { color: #6E6E6E; }
.widget-downloads .btn-dl { display: inline-flex; align-items: center; justify-content: center; gap: 2px; width:68px; height: 27px; padding: 0; background: #FFFFFF; border-radius: 14px; border: 1px solid #28A878; font-size: 12px; color: #28A878; flex-shrink: 0; }
.widget-downloads .btn-dl b { display: inline-block; width: 11px; height: 10px; background: url(../image/icon69.png) no-repeat center; background-size: contain; flex-shrink: 0; }
.widget-links li { min-width: 0; list-style: none; }
.widget-links a {line-height: 16px; display: block; position: relative; padding:0 0 0 18px; font-size: 16px; color: #444444; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.widget-links a::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width:4px; height:4px; border: 3px solid #BFBFBF; border-radius: 50%; box-sizing: border-box; }
.widget-links a:hover { color: #28A878; }
.widget-links a:hover::before { border-color: #28A878; }
.xgxz .widget-links a{padding:0 0 0 12px;}
.widget-more { display: block; text-align: center; margin-top: 12px; padding: 8px 0; font-size: 13px; color: var(--color-text-muted); border-top: 1px solid var(--color-border); }
.widget-more:hover { color: var(--color-primary); }
.tags-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.widget-links{gap:12px;}
/* ===== 最新更新页（430px） ===== */
.page-latest { padding: 0 0 24px; }
.latest-layout {
  display: flex; flex-direction: column; gap: 0;margin:16px 0 0 0;
  align-items: stretch;padding:0;
}
.latest-nav { display: none; }

.latest-main {
  flex: 1; min-width: 0; width: 100%;
  background: #fff; border-radius: 0; overflow: visible;
  box-shadow: none; padding: 0;
}
.latest-table {
  width: 100%; border-collapse: collapse; table-layout: fixed;
}
.latest-table thead { background:#F9FAFD;}
.latest-table th {
  padding: 6px 0 6px ; color:#323740; font-size: 14px; font-weight: 400;
  text-align: left; border-bottom: 1px solid #F0F0F0;
}
.latest-table td {
  padding: 12px 0; font-size: 18px; color: #666;
  border-bottom: 1px solid #F0F0F0; vertical-align: middle;
}
.latest-table tbody tr:active { background: #FAFAFA; }
.latest-table td a {
  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: #333333; font-size: 14px;
}
.latest-table td a:active { color: #28A878; }
.latest-table th:nth-child(1),
.latest-table td:nth-child(1) {
  width: 72px; padding-left:16px; padding-right: 4px; white-space: nowrap;
}
.latest-table th:nth-child(1){padding-left: 35px;}
.latest-table th:nth-child(2),
.latest-table td:nth-child(2) {width:42%;
 padding-right: 6px; overflow: hidden;
}
.latest-table th:nth-child(2){padding-left: 64px;  }
.latest-table th:nth-child(3),
.latest-table td:nth-child(3) {
  width: 40px; text-align: center; padding-left: 0; padding-right: 0;
  color: #333333; font-size: 14px; white-space: nowrap;
}
.latest-table th:nth-child(4),
.latest-table td:nth-child(4) {
  width: 42px; text-align: right; padding-left: 0; padding-right:16px;
  color: #333333; font-size: 14px; white-space: nowrap;
}
.cat-tag {
  display: inline-block; padding: 4px 8px; border-radius: 4px;
  font-size: 11px; white-space: nowrap; line-height: 1.4; max-width: 100%;
  overflow: hidden; text-overflow: ellipsis; vertical-align: middle;
}
.cat-ai { background: #EDEFFA; color: #004BD2; }
.cat-browser { background: #FAF3ED; color: #FC6700; }
.cat-mobile { background: #EDF8FA; color: #1AABB8; }
.cat-java { background: #EDFAF1; color: #00BE50; }
.cat-sql { background: #FAF9ED; color: #D4A017; }
.cat-cpp { background: #FAF9ED; color: #D4A017; }
.cat-zone { background: #FAEDED; color: #FE2D4A; }
.cat-hardware { background: #FAF3ED; color: #FC6700; }
.newgx .pagination { margin: 16px 0 8px; }
.latest-main .pagination { padding: 0; margin: 16px 0 8px; }
.latest-nav-list { margin: 0; }


/* ===== 文章详情页（430px） ===== */
.share-bar { display: none; }
.page-detail { padding: 0 0 24px; }
.artdtl .page-detail { padding: 0 0 30px; }
.detail-layout { display: flex; flex-direction: column; gap: 0; align-items: stretch; }
.detail-main { flex: 1; min-width: 0; max-width: 100%; width: 100%; }
.artdtl .breadcrumb { margin: 12px 0 10px; }
.detail-title { font-size: 21px; font-weight:bold; line-height: 1.4; margin-bottom: 12px; color: #333333; }
.detail-meta { display: flex; align-items: flex-start; gap: 8px; padding-bottom:7px; border-bottom: 1px solid #F6F6F6; margin-bottom:10px; }
.author-avatar { width:36px; height:36px; border-radius: 50%; object-fit: cover; margin: 0 8px 0 0; flex-shrink: 0; }
.dtlmt-left { align-items: center; flex: 1; min-width: 0; }
.dtlmtld { min-width: 0; }
.dtlmltdd { font-size: 12px; color: #888; gap:4px; margin: 4px 0 0; flex-wrap: wrap; line-height: 1.4;white-space: nowrap;}
.author-name { font-size: 12px; color: #222;}
.btn-copy { margin-left: auto; padding: 2px 10px; border-radius:3px; font-size: 12px; color: #28A878; background:#F1F9F3; border: 1px solid #F1F9F3; flex-shrink: 0; align-self: flex-start; margin-top: 4px; }
.share-copy-notice{position:fixed;left:50%;bottom:72px;z-index:10000;transform:translate(-50%,12px);padding:9px 16px;border-radius:18px;background:rgba(25,35,32,.92);color:#fff;font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}.share-copy-notice.show{opacity:1;transform:translate(-50%,0)}
.article-item.content-download .article-thumb{aspect-ratio:1/1}.article-item.content-download .article-thumb img{width:100%;height:100%;object-fit:cover}
.detail-content { font-size: 15px; line-height: 1.85; margin-bottom: 20px; color: #333; }
.detail-content h2 { font-size: 22px; font-weight: 600; margin: 18px 0 10px; color: #000000; line-height: 1.4; }
.detail-content p { margin-bottom: 14px; }
.detail-figure { margin: 16px 0; text-align: center; }
.detail-figure img { max-width: 100%; background: var(--color-bg-gray); border-radius: 8px; }
.detail-figure figcaption { font-size: 12px; color: var(--color-text-muted); margin-top: 6px; }
.artcona { display: block; margin: 14px 0; }
.artconimg { width: 100%; border-radius: 8px; display: block; }
.related-box { margin-bottom: 16px; }
.box-title { font-size: 18px; margin-bottom:8px; color: #333333;font-weight: 400;}
.box-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.box-header .box-title { margin-bottom: 0; }
.art-topdes { position: relative; font-size: 14px; color: #666F6D; padding: 15px 18px; background: #F5F8F7; border-radius: 0 8px 8px 0; margin-bottom: 14px; line-height:22px; }
.art-topdes::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width:2px; background: #28A878; border-radius: 2px 0 0 2px; }
.related-list { gap: 8px; }
.related-list li { line-height: 1.4; min-width: 0; list-style: none; }
.related-list a { display: block; position: relative; padding-left:8px; font-size: 16px; color: #444; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.related-list a::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 4px; background: #333; border-radius: 50%; }
.related-list a:active { color: #28A878; }
.related-list a:active::before { background: #28A878; }
.tool-card, .artdtl .tool-card { align-items: center; gap: 12px; padding: 14px; background: #fff; box-shadow: 0 0 4px rgba(203,203,203,.42); border-radius: 8px; margin-bottom: 16px; border: none; }
.tool-icon { width: 56px; height: 56px; border-radius: 8px; margin: 0 10px 0 0; object-fit: cover; flex-shrink: 0; }
.tool-body { flex: 1; min-width: 0; gap: 6px; }
.tolbdd { width: 100%; min-width: 0; overflow: hidden; justify-content: space-between; }
.tolbdd > div { overflow: hidden; }
.tolbddd { align-items: flex-start; min-width: 0; }
.tool-card-text { align-items: center; }
.tool-card-text .tool-body { gap: 4px; }
.tool-card-text .tool-desc { -webkit-line-clamp: 2; }
.tool-name { font-size: 16px; color: #191919; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; }
.tool-author { font-size: 14px; color: #444444; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; }
.tool-meta { align-items: center; flex-wrap: wrap; gap: 10px; margin: 2px 0 0; }
.tool-stars { align-items: center; gap: 2px;height: 16px;}
.tool-stars b { display: inline-block; width: 12px; height: 12px; background-size: contain; background-repeat: no-repeat; background-position: center; }
.tool-stars .star-full { background-image: url(../image/icon16.png); margin: 0 2px 0 0; }
.tool-stars .star-half { background-image: url(../image/icon17.png); }
.tool-stars .star-empty { background-image: url(../image/icon18.png); }
.tool-score { font-size: 12px; color: #666; }
.tool-score span { color: #C5C5C5; }
.tool-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: #444; }
.tool-badge b { display: inline-block; width: 12px; height: 12px; background-size: contain; background-repeat: no-repeat; flex-shrink: 0; }
.tool-badge-safe b { background-image: url(../image/icon61.png); }
.tool-badge-ima b { background-image: url(../image/icon62.png); }
.tool-badge-safe { margin: 0; }
.tool-desc { font-size: 12px; color: #444444; margin: 0; line-height: 1.6; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.tool-btns, .artdtl .tool-btns { justify-content: center; gap: 10px; margin: 0; flex-shrink: 0; }
.tool-btn-copy { width: 88px; height: 26px; border-radius: 17px; display: flex; align-items: center; justify-content: center; background: linear-gradient(270deg, #39C491 0%, #28A878 100%); color: #fff; font-size: 12px; border: none; }
.tool-btn-down { width: 88px; height: 26px; border-radius: 17px; display: flex; align-items: center; justify-content: center; gap: 4px; background: #fff; color: #333333; font-size: 12px; border: 1px solid #EAEAEA; }
.tool-btn-down b { display: inline-block; width: 13px; height:13px; background: url(../image/icon63.png) no-repeat center; background-size: contain; }
.tool-res-card { align-items: stretch; gap: 12px; padding: 12px; }
.tool-res-thumb { width:101px; height: 101px; border-radius:6px; object-fit: cover; flex-shrink: 0; background: #6DB841; }
.tool-res-cover {
  width: 88px; height: 88px; border-radius: 8px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; text-align: center;
  padding: 8px; box-sizing: border-box;
  background: linear-gradient(135deg, #7B5CFF 0%, #5B8CFF 100%);
}
.tool-res-cover span {
  font-size: 12px; font-weight: 600; color: #fff; line-height: 1.35;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
}
.tool-res-body { flex: 1; min-width: 0; gap: 6px; justify-content: space-between; }
.tool-res-card1 .tool-res-cover,
.tool-res-card1 .tool-res-thumb { width: 162px; height:101px; }
.tool-res-head { align-items: center; justify-content: space-between; gap: 8px; }
.tool-res-title { font-size: 16px; font-weight: 600; color: #191919; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; min-width: 0; }
.tool-res-date { align-items: center; gap: 4px; flex-shrink: 0; font-size: 12px; color: #888888; }
.tool-res-date b { display: inline-block; width: 12px; height: 12px; background: url(../image/icon20.png) no-repeat center; background-size: contain; }
.tool-res-desc { font-size: 12px; color: #444444; margin: 0; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tool-res-tags { align-items: center; flex-wrap: wrap; gap: 6px; }
.tool-res-tag { display: inline-block; padding: 1px 8px; background: #F2F2F2; border-radius: 11px; font-size: 10px; color: #222222; }
.tool-res-btn { align-self: flex-start; height: 26px; padding: 0 14px; border-radius: 13px; background: linear-gradient( 270deg, #39C491 0%, #28A878 100%);color: #fff; font-size: 12px; gap: 4px; width: auto; }
.tool-res-btn b { display: inline-block; width: 14px; height: 14px; background: url(../image/icon67.png) no-repeat center; background-size: contain; flex-shrink: 0; }
.btn-sm { padding: 8px 20px; font-size: 13px; }
.detail-tags { display: flex; flex-wrap: wrap; align-items: center; gap:10px; margin-bottom:20px; }
.tags-label { font-size: 16px; color: #444444; }
.detail-declare { padding: 10px; margin-bottom: 16px; background: #F1F9F3;border-radius: 8px; }
.declare-title {font-weight: 400;
  text-align: center; font-size: 16px;color: #28A878;margin: 0 0 10px; position: relative;
}
.declared{background: #FFFFFF;border-radius: 8px;border: 1px solid rgba(40,168,120,0.18);padding:16px 22px;}
.declare-title::before,
.declare-title::after {
  content: ""; position: absolute; top: 50%; width:90px; height: 1px;background:#28A878;
}
.declare-title::before { left: 8px; }
.declare-title::after { right: 8px; }
.detail-declare p { font-size: 14px; color: #555555; line-height:20px; margin: 0 0 6px; }
.detail-declare p:last-child { margin-bottom: 0; }
.detail-disclaimer { display: none; }
.detail-nav { display: flex; flex-direction: column; gap: 10px; font-size: 13px; margin: 0 0 24px; }
.detail-nav a { color: #333; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 
    padding: 8px 16px; height: auto; min-height:38px; background: #fff; box-shadow: 0px 0px 8px 0px rgba(119,118,118,0.08);
    border-radius: 8px;display: flex; align-items: center; gap: 4px;font-size: 12px;
}
.detail-nav a span:nth-child(1) { color: #888; flex-shrink: 0; }
.detail-nav a span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.author-list { gap: 11px; }
.author-list li { display: flex; align-items: center; min-width: 0; gap: 10px; }
.author-list a { position: relative; flex: 1; min-width: 0; padding-left: 10px; font-size: 16px; color: #444; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.author-list a::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width:4px; height:4px; border: 3px solid #BFBFBF; border-radius: 50%; box-sizing: border-box; }
.author-list a:active { color: #28A878; }
.author-list a:active::before { border-color: #28A878; }
.author-list .author-time { display: inline-flex; align-items: center; flex-shrink: 0; gap: 3px; font-size: 12px; color: #999; }
.author-list .author-time b { display: inline-block; width: 12px; height: 12px; background: url(../image/icon20.png) no-repeat center; background-size: contain; }
.author-articles { margin: 0 0 26px; }
.detail-products { margin: 8px 0 0; }
.products-grid-sm { grid-template-columns: repeat(2, 1fr); }
.artdtl .widget-box { box-shadow: none; border-radius: 0; padding: 25px 0 0 0; margin: 0; }
 
.artdtl .sidebar-more { display: none; }
.artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text { font-size: 14px; min-height: 0; line-height: 1.4; }
.artdtl .widget-downloads .widget-text { font-size: 14px; }
.artdtl .widget-downloads .widget-desc { font-size: 12px; }
 
.artcons h1::before, .artcons h2::before { content: ""; display: inline-block; width: 3px; height: 14px; background: url(../image/icon60.png) no-repeat center center; background-size: contain; margin-right: 8px; vertical-align: middle; margin-top: -2px; }
.artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span { display: flex; margin: 0 8px 0 0; background: url(../image/icon6.png) no-repeat; width: 12px; background-size: contain; height: 12px; }
.artcons .artdp, .artcons .artptit, .artcons .artptitp { display: flex; align-items: center; }
.artcons .artdp p, .artcons .artptit p, .artcons .artptitp p { font-weight: bold; font-size: 16px; color: #333; line-height: 1.3; margin: 10px 0; }
.artcons .hp { font-weight: bold; font-size: 15px; color: #333; margin: 10px 0; line-height: 1.3; }
.artcons table { margin: 12px 0; max-width: 100%; width: 100%; border-collapse: collapse; display: block; overflow: auto; }
.artcons table td, .artcons table th { border: 1px solid #ddd; padding: 6px 8px; font-size: 13px; line-height: 1.4; }
.artcons table thead, .artcons table tr:nth-child(2n) { background-color: rgba(102,128,153,.05); }
.artcons pre { background: #f7f7f7; position: relative; width: 100%; max-width: 100%; overflow-x: auto; overflow-y: hidden; box-sizing: border-box; padding: 12px; }
.artcons .pre-numbering { display: none; }
.artcons .CodeMirror { background: #f7f7f7; box-sizing: border-box; margin-bottom: 1em; padding: 0 !important; }
.artcons .CodeMirror-scroll { min-height: 200px; }

.artcons .CodeMirror-fullscreen {
    background: #fff;
    position: fixed!important;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    height: auto;
    z-index: 9
}

.artcons .CodeMirror-sided {
    width: 50%!important
}

.artcons .hljs-cto {
    position: relative
}
.artcons pre code{
    white-space: pre;
    display: block;
}
.artcons .copy_btn {
    position: relative;
    padding: 5px 10px;
    background-color: #666;
    border: none;
    color: #FFF;
    font-size: 12px;
    cursor: pointer;
    border-radius: 5px;
    position: relative;
    top:5px;
    right: 5px;
    z-index: 99;
    float: right;

    display: block;
    margin-bottom: -35px; 
    margin-left: auto; 
    width: max-content;
}



.artcons h1 {
    margin: .67em 0
}
 

.artcons h3 {
    margin: 1em 0
}

.artcons h4 {
    margin: 1.33em 0
}

.artcons h5 {
    margin: 1.67em 0
}

.artcons h6 {
    margin: 2.33em 0
}

 

.artcons pre {
    overflow-y: auto
}

.artcons img {    margin:0 auto;width: 100%;
height: 506px;
border-radius: 8px;
    height: auto!important
}

.artcons a {
    color: #3e71f6
}

.artcons a:hover {
    color: #01B277;
}


.artcons blockquote {
    background: linear-gradient(180deg, #E1FCF3 0%, #F1FDF9 100%);
 
}

 .detail-content ol{margin-left: 20px;}
.artcons h3 {
    font-size: 20px!important
}

.artcons h4 {
    font-size: 18px!important
}

.artcons h5 {
    font-size: 16px!important
}

.artcons h6 {
    font-size: 14px!important
}

.artcons p {
    line-height:26px;color:#333333;
    font-size: 16px;margin:6px 0;
}
 
 
.artcons a em,.artcons blockquote em,.artcons h1 em,.artcons h2 em,.artcons h3 em,.artcons h4 em,.artcons h5 em,.artcons h6 em,.artcons li em,.artcons p em,.artcons sub em,.artcons sup em,.artcons table em {
    font-style: normal!important
}

.artcons a del,.artcons a u,.artcons blockquote del,.artcons blockquote u,.artcons h1 del,.artcons h1 u,.artcons h2 del,.artcons h2 u,.artcons h3 del,.artcons h3 u,.artcons h4 del,.artcons h4 u,.artcons h5 del,.artcons h5 u,.artcons h6 del,.artcons h6 u,.artcons li del,.artcons li u,.artcons p del,.artcons p u,.artcons sub del,.artcons sub u,.artcons sup del,.artcons sup u,.artcons table del,.artcons table u {
    text-decoration: none!important
}

.artcons a {
    color: #333!important;
    padding-bottom: 2px
}

.artcons a:hover {
    color: #acacac!important
}

.artcons p>code {
    color: #128b4e;
    background-color: #e7f3ed!important
}

.artcons p>code span {
    font-size: 12px!important;
    color: #128b4e!important
}

.artcons p>code em {
    font-style: normal
}

.artcons p>code del,.artcons p>code u {
    text-decoration: none
}

.artcons pre .language- {
    color: #595959!important;
    background: none!important;
    font-size: 13px!important
}

.artcons pre .language- span {
    font-size: 13px!important
}
 

.artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: 16px!important
}

.artcons a span {
    font-size: 16px!important;
    color: #333!important
}

.artcons ul.pre-numbering {
    height: 100%
}


.newsArticle .artcons {
    margin-bottom: 120px
}

.newsArticle .artcons img {
    display: block
}

.artcons {
    word-wrap: break-word;
 
    font-size: 16px
}

/* ===== AUTO-GENERATED RESPONSIVE (jiaoben style) ===== */

@media screen and (max-width: 751px) {
  :root {
    --radius-sm: calc(var(--width750) * 4px);
    --radius-md: calc(var(--width750) * 8px);
    --radius-lg: calc(var(--width750) * 24px);
    --page-pad: calc(var(--width750) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width750) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width750) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width750) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width750) * 48px);
    padding: calc(var(--width750) * 10px) calc(var(--width750) * 16px) calc(var(--width750) * 10px) calc(var(--width750) * 13px);
    box-shadow: 0 0 calc(var(--width750) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width750) * 8px);
    font-size: calc(var(--width750) * 18px);
  }

  .logo-img {
    width: calc(var(--width750) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width750) * 14px);
    margin-left: calc(var(--width750) * 4px);
  }

  .header-actions {
    gap: calc(var(--width750) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width750) * 18px);
    height: calc(var(--width750) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width750) * 320px);
    box-shadow: calc(var(--width750) * -4px) 0 calc(var(--width750) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width750) * 52px);
    padding: 0 calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width750) * 20px);
    height: calc(var(--width750) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width750) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width750) * 14px) calc(var(--width750) * 20px);
    font-size: calc(var(--width750) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width750) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width750) * 48px);
    padding: 0 calc(var(--width750) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width750) * 8px);
    width: calc(var(--width750) * 36px);
    height: calc(var(--width750) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width750) * 20px);
    height: calc(var(--width750) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width750) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width750) * 16px) calc(var(--width750) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width750) * 8px);
    height: calc(var(--width750) * 44px);
    padding: 0 calc(var(--width750) * 16px);
    margin: 0 0 calc(var(--width750) * 18px);
    border-radius: calc(var(--width750) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width750) * 18px);
    height: calc(var(--width750) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width750) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width750) * 10px);
    margin: 0 0 calc(var(--width750) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width750) * 6px);
    min-height: calc(var(--width750) * 52px);
    padding: calc(var(--width750) * 12px) calc(var(--width750) * 16px);
    box-shadow: 0 0 calc(var(--width750) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width750) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width750) * 20px);
    height: calc(var(--width750) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width750) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width750) * 6px);
    height: calc(var(--width750) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width750) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width750) * 6px);
    height: calc(var(--width750) * 44px);
    border-radius: calc(var(--width750) * 21px);
    font-size: calc(var(--width750) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width750) * 16px);
    height: calc(var(--width750) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width750) * 14px);
    height: calc(var(--width750) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width750) * 16px) calc(var(--width750) * 16px) calc(var(--width750) * 26px);
  }

  .sechtitle {
    top: calc(var(--width750) * 12px);
    right: calc(var(--width750) * 12px);
    width: calc(var(--width750) * 36px);
    height: calc(var(--width750) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width750) * 22px);
    height: calc(var(--width750) * 22px);
  }

  .sechcon {
    margin: calc(var(--width750) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width750) * 20px);
    width: calc(var(--width750) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width750) * 198px);
  }

  .serchd {
    height: calc(var(--width750) * 46px);
    margin: 0 0 calc(var(--width750) * 18px);
    border-radius: calc(var(--width750) * 23px);
    padding: 0 calc(var(--width750) * 16px) 0 calc(var(--width750) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width750) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width750) * 36px);
    height: calc(var(--width750) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width750) * 20px);
    height: calc(var(--width750) * 20px);
  }

  .top-btn {
    gap: calc(var(--width750) * 8px);
  }

  .topbtna {
    height: calc(var(--width750) * 18px);
    padding: 0 calc(var(--width750) * 12px);
    border-radius: calc(var(--width750) * 11px);
    font-size: calc(var(--width750) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width750) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width750) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width750) * 6px);
    font-size: calc(var(--width750) * 32px);
    line-height: calc(var(--width750) * 36px);
    margin: calc(var(--width750) * 26px) 0 calc(var(--width750) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width750) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width750) * 6px) auto;
    letter-spacing: calc(var(--width750) * 4px);
    width: calc(var(--width750) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width750) * 12px);
    margin-bottom: calc(var(--width750) * 15px);
    letter-spacing: calc(var(--width750) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width750) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width750) * 98px);
    height: calc(var(--width750) * 32px);
    border-radius: calc(var(--width750) * 22px);
    font-size: calc(var(--width750) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width750) * 44px);
    width: calc(var(--width750) * 98px);
    height: calc(var(--width750) * 32px);
    border-radius: calc(var(--width750) * 26px);
    font-size: calc(var(--width750) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width750) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width750) * 12px);
  }

  .section-title {
    font-size: calc(var(--width750) * 18px);
  }

  .section-more {
    font-size: calc(var(--width750) * 14px);
  }

  .section-more b {
    width: calc(var(--width750) * 8px);
    height: calc(var(--width750) * 8px);
    margin: 0 0 0 calc(var(--width750) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width750) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width750) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width750) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width750) * 308px);
    border-radius: calc(var(--width750) * 5px);
    width: calc(var(--width750) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width750) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width750) * 8px);
    margin: calc(var(--width750) * 5px) calc(var(--width750) * 6px) 0 calc(var(--width750) * 10px);
    min-height: calc(var(--width750) * 56px);
    padding: 0 0 calc(var(--width750) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width750) * 3px);
    right: calc(var(--width750) * 3px);
    bottom: 0;
    height: calc(var(--width750) * 1px);
  }

  .card-icon {
    width: calc(var(--width750) * 40px);
    height: calc(var(--width750) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width750) * 14px);
    margin: 0 0 calc(var(--width750) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width750) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width750) * 6px);
    min-width: 0;
    font-size: calc(var(--width750) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width750) * 8px);
    height: calc(var(--width750) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width750) * 3px);
    height: calc(var(--width750) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width750) * 12px);
    margin: 0 0 calc(var(--width750) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width750) * 10px) calc(var(--width750) * 10px) calc(var(--width750) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width750) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width750) * 10px);
    font-size: calc(var(--width750) * 12px);
    width: calc(var(--width750) * 145px);
    height: calc(var(--width750) * 28px);
    border-radius: calc(var(--width750) * 14px);
  }

  .card-more b {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 9px);
    margin: 0 0 0 calc(var(--width750) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width750) * 4px);
    margin-top: calc(var(--width750) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width750) * 4px);
    height: calc(var(--width750) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width750) * 20px);
    border-radius: calc(var(--width750) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width750) * 14px) 0 calc(var(--width750) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width750) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width750) * 8px);
  }

  .tags-list {
    gap: calc(var(--width750) * 8px);
  }

  .tag {
    padding: calc(var(--width750) * 4px) calc(var(--width750) * 16px);
    border-radius: calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width750) * 12px);
    padding: calc(var(--width750) * 2px) calc(var(--width750) * 8px);
    border-radius: calc(var(--width750) * 12px);
  }

  .products-grid {
    gap: calc(var(--width750) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width750) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width750) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width750) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width750) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width750) * 16px);
    gap: calc(var(--width750) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width750) * 4px);
    height: calc(var(--width750) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width750) * 20px);
    border-radius: calc(var(--width750) * 2px);
  }

  .product-card {
    padding: calc(var(--width750) * 10px);
    min-width: 0;
    border-radius: calc(var(--width750) * 8px);
    box-shadow: 0 0 calc(var(--width750) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width750) * 10px);
    top: calc(var(--width750) * 8px);
    left: calc(var(--width750) * 10px);
    gap: calc(var(--width750) * 3px);
    max-width: calc(100% - calc(var(--width750) * 36px));
  }

  .tagsa {
    padding: calc(var(--width750) * 1px) calc(var(--width750) * 5px);
    font-size: calc(var(--width750) * 10px);
    border-radius: calc(var(--width750) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width750) * 1px) calc(var(--width750) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width750) * 8px);
    margin: calc(var(--width750) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width750) * 16px);
    margin: calc(var(--width750) * 7px) 0 calc(var(--width750) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width750) * 12px);
    margin-bottom: calc(var(--width750) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width750) * 11px);
  }

  .product-rating b {
    width: calc(var(--width750) * 10px);
    height: calc(var(--width750) * 10px);
    margin: 0 calc(var(--width750) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width750) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width750) * 24px);
    margin: calc(var(--width750) * 32px) auto calc(var(--width750) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width750) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width750) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width750) * 98px);
    padding: 0 calc(var(--width750) * 24px);
    height: calc(var(--width750) * 32px);
    border-radius: calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width750) * 9px);
    height: calc(var(--width750) * 5px);
    margin: 0 0 0 calc(var(--width750) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width750) * 88px);
    width: calc(var(--width750) * 88px);
    height: calc(var(--width750) * 28px);
    border-radius: calc(var(--width750) * 15px);
    font-size: calc(var(--width750) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width750) * 88px);
    width: calc(var(--width750) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width750) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width750) * 34px);
    border-radius: calc(var(--width750) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width750) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width750) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width750) * 8px);
    height: calc(var(--width750) * 34px);
    padding: 0 0 0 calc(var(--width750) * 7px);
    font-size: calc(var(--width750) * 16px);
    line-height: calc(var(--width750) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width750) * 18px);
    height: calc(var(--width750) * 18px);
    margin: 0 calc(var(--width750) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width750) * 4px);
    font-size: calc(var(--width750) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width750) * 11px);
    height: calc(var(--width750) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width750) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width750) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width750) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width750) * 12px);
    padding: calc(var(--width750) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width750) * 16px);
    margin-bottom: calc(var(--width750) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width750) * 14px);
    max-height: calc(var(--width750) * 20px);
    line-height: calc(var(--width750) * 18px);
    margin-bottom: calc(var(--width750) * 3px);
  }

  .article-tags {
    gap: calc(var(--width750) * 6px);
    margin-top: calc(var(--width750) * 4px);
  }

  .article-tag {
    padding: calc(var(--width750) * 1px) calc(var(--width750) * 8px);
    border-radius: calc(var(--width750) * 11px);
    font-size: calc(var(--width750) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width750) * 1px) calc(var(--width750) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width750) * 3px) calc(var(--width750) * 8px);
    font-size: calc(var(--width750) * 12px);
    border-radius: calc(var(--width750) * 12px);
  }

  .article-info {
    font-size: calc(var(--width750) * 12px);
    gap: calc(var(--width750) * 10px);
  }

  .article-thumb {
    width: calc(var(--width750) * 148px);
    height: calc(var(--width750) * 88px);
    border-radius: calc(var(--width750) * 6px);
    margin-top: calc(var(--width750) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width750) * 88px);
    height: calc(var(--width750) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width750) * 6px);
    height: calc(var(--width750) * 38px);
    margin-top: calc(var(--width750) * 16px);
    border-radius: calc(var(--width750) * 21px);
    font-size: calc(var(--width750) * 16px);
  }

  .icon-more {
    width: calc(var(--width750) * 16px);
    height: calc(var(--width750) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width750) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width750) * 3px) 0 0;
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width750) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width750) * 10px);
    padding: calc(var(--width750) * 12px) 0;
    font-size: calc(var(--width750) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width750) * 16px);
    height: calc(var(--width750) * 16px);
    margin: 0 calc(var(--width750) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width750) * 12px);
    padding-top: calc(var(--width750) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width750) * 12px);
    padding: calc(var(--width750) * 7px) 0;
    font-size: calc(var(--width750) * 13px);
    border-radius: calc(var(--width750) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width750) * 4px);
    width: calc(var(--width750) * 10px);
    height: calc(var(--width750) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width750) * 12px);
    margin: calc(var(--width750) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width750) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width750) * 16px) calc(var(--width750) * 15px) 0 calc(var(--width750) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width750) * 8px);
    margin-bottom: calc(var(--width750) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width750) * 198px);
    padding: 0 0 0 calc(var(--width750) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width750) * 14px);
    margin-bottom: calc(var(--width750) * 10px);
  }

  .footer-social {
    gap: calc(var(--width750) * 12px);
  }

  .footer-social a {
    width: calc(var(--width750) * 32px);
    height: calc(var(--width750) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width750) * 28px);
    height: calc(var(--width750) * 28px);
  }

  .footer-links {
    padding: calc(var(--width750) * 28px) calc(var(--width750) * 15px) calc(var(--width750) * 15px) calc(var(--width750) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width750) * 16px);
    margin-bottom: calc(var(--width750) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width750) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width750) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width750) * 15px) 0 calc(var(--width750) * 15px);
    gap: calc(var(--width750) * 15px);
    border-radius: calc(var(--width750) * 12px);
    padding: calc(var(--width750) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width750) * 120px);
    height: calc(var(--width750) * 120px);
    border-radius: calc(var(--width750) * 4px);
    margin: 0;
    margin: calc(var(--width750) * 10px) 0 calc(var(--width750) * 10px) calc(var(--width750) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width750) * 106px);
    height: calc(var(--width750) * 106px);
    border-radius: calc(var(--width750) * 4px);
  }

  .foot-line {
    width: calc(var(--width750) * 2px);
    height: calc(var(--width750) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width750) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width750) * 14px);
    margin: calc(var(--width750) * 6px) 0 calc(var(--width750) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width750) * 152px);
    height: calc(var(--width750) * 32px);
    padding: 0 calc(var(--width750) * 12px);
    border-radius: calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width750) * 14px) 0 calc(var(--width750) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width750) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width750) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width750) * 4px);
  }

  .gh {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width750) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width750) * 33px) 0 calc(var(--width750) * 26px);
  }

  .search-hero {
    padding: calc(var(--width750) * 20px) 0 calc(var(--width750) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width750) * 70px) 0 calc(var(--width750) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width750) * 14px);
  }

  .search-brand img {
    height: calc(var(--width750) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width750) * 14px);
    border-radius: calc(var(--width750) * 24px);
    padding: calc(var(--width750) * 3px) calc(var(--width750) * 3px) calc(var(--width750) * 3px) 0;
    height: calc(var(--width750) * 32px);
    box-shadow: 0 calc(var(--width750) * 2px) calc(var(--width750) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width750) * 12px) 0 calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width750) * 12px);
    height: calc(var(--width750) * 28px);
    border-radius: calc(var(--width750) * 19px);
    font-size: calc(var(--width750) * 12px);
  }

  .search-submit b {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
    margin: 0 calc(var(--width750) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width750) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width750) * 14px);
    line-height: calc(var(--width750) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width750) * 10px);
    max-height: calc(var(--width750) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width750) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 7px);
  }

  .search-main {
    padding: calc(var(--width750) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width750) * -32px));
    margin: 0 0 calc(var(--width750) * 17px) 0;
    padding: 0  calc(var(--width750) * 22px);
    height: calc(var(--width750) * 42px);
    box-shadow: 0 0 calc(var(--width750) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width750) * 8px);
    gap: calc(var(--width750) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width750) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width750) * 6px);
    width: calc(var(--width750) * 16px);
    height: calc(var(--width750) * 2px);
  }

  .search-right {
    font-size: calc(var(--width750) * 12px);
    margin: calc(var(--width750) * 12px) 0 calc(var(--width750) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width750) * 13px);
  }

  .empty-state {
    padding: calc(var(--width750) * 70px) 0 calc(var(--width750) * 68px);
  }

  .empty-img {
    width: calc(var(--width750) * 259px);
    margin: 0 auto calc(var(--width750) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width750) * 14px);
    margin: 0 auto calc(var(--width750) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width750) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width750) * 16px) 0 calc(var(--width750) * 32px);
  }

  .pagination {
    gap: calc(var(--width750) * 12px);
    margin-top: calc(var(--width750) * 20px);
  }

  .page-btns {
    gap: calc(var(--width750) * 10px) calc(var(--width750) * 4px);
  }

  .page-extra {
    gap: calc(var(--width750) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width750) * 32px);
    height: calc(var(--width750) * 32px);
    padding: 0 calc(var(--width750) * 8px);
    border-radius: calc(var(--width750) * 4px);
    font-size: calc(var(--width750) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width750) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width750) * 2px);
    font-size: calc(var(--width750) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width750) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width750) * 36px);
    height: calc(var(--width750) * 28px);
    border-radius: calc(var(--width750) * 6px);
    font-size: calc(var(--width750) * 12px);
    margin: 0 calc(var(--width750) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width750) * 14px);
    height: calc(var(--width750) * 28px);
    margin-left: calc(var(--width750) * 4px);
    border-radius: calc(var(--width750) * 3px);
    font-size: calc(var(--width750) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width750) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width750) * 27px);
    padding: calc(var(--width750) * 12px) calc(var(--width750) * 15px) 0 calc(var(--width750) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width750) * 4px);
    min-width: calc(var(--width750) * 68px);
    padding: 0;
    font-size: calc(var(--width750) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width750) * 20px);
    height: calc(var(--width750) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width750) * 20px);
    height: calc(var(--width750) * 3px);
    border-radius: calc(var(--width750) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width750) * 8px);
    padding: calc(var(--width750) * 15px) calc(var(--width750) * 12px) calc(var(--width750) * 10px) calc(var(--width750) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width750) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width750) * 32px);
    padding: 0 calc(var(--width750) * 12px);
    border-radius: calc(var(--width750) * 8px);
    font-size: calc(var(--width750) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width750) * 40px);
    gap: calc(var(--width750) * 2px);
    font-size: calc(var(--width750) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width750) * 18px);
    height: calc(var(--width750) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width750) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width750) * 8px);
    padding: calc(var(--width750) * 8px) calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width750) * 2px);
    height: calc(var(--width750) * 40px);
    border-radius: calc(var(--width750) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width750) * 18px);
    height: calc(var(--width750) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width750) * 10px);
    height: calc(var(--width750) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width750) * 4px) 0 calc(var(--width750) * 8px);
    gap: calc(var(--width750) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width750) * 7px) calc(var(--width750) * 3px);
    font-size: calc(var(--width750) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width750) * 26px);
    width: calc(var(--width750) * 6px);
    height: calc(var(--width750) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width750) * 18px);
    height: calc(var(--width750) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width750) * 10px);
    height: calc(var(--width750) * 12px);
    margin: 0 calc(var(--width750) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width750) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width750) * 12px) 0 calc(var(--width750) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width750) * 14px) calc(var(--width750) * 14px) calc(var(--width750) * 14px) calc(var(--width750) * 16px);
    margin: calc(var(--width750) * 12px) 0 calc(var(--width750) * 14px);
    border-radius: calc(var(--width750) * 10px);
    min-height: calc(var(--width750) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width750) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width750) * 14px);
    line-height: calc(var(--width750) * 18px);
    margin: calc(var(--width750) * 6px) 0 calc(var(--width750) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width750) * 12px);
    gap: calc(var(--width750) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width750) * 3px) 0 0;
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width750) * 3px) 0 0;
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width750) * 4px);
    padding: 0 0 calc(var(--width750) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width750) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width750) * 12px);
    margin-bottom: calc(var(--width750) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width750) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width750) * 10px) calc(var(--width750) * 15px) calc(var(--width750) * 12px) calc(var(--width750) * 15px);
    margin: calc(var(--width750) * 24px) 0 calc(var(--width750) * 16px);
    border-radius: calc(var(--width750) * 10px);
    min-height: calc(var(--width750) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width750) * 8px);
    min-width: 0;
    margin: calc(var(--width750) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width750) * 72px);
    height: calc(var(--width750) * 28px);
    padding: 0 calc(var(--width750) * 12px);
    border-radius: calc(var(--width750) * 14px);
    font-size: calc(var(--width750) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width750) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width750) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width750) * 24px);
    height: calc(var(--width750) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width750) * 15px) calc(var(--width750) * 12px) 0 calc(var(--width750) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width750) * 10px);
    margin-left: calc(var(--width750) * 2px);
  }

  .banner-img {
    width: calc(var(--width750) * 80px);
    height: calc(var(--width750) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width750) * 48px);
    padding: 0 calc(var(--width750) * 18px);
  }

  .catalog-back {
    left: calc(var(--width750) * 8px);
    width: calc(var(--width750) * 36px);
    height: calc(var(--width750) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width750) * 20px);
    height: calc(var(--width750) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width750) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width750) * 16px) calc(var(--width750) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width750) * 18px);
    margin: 0 0 calc(var(--width750) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width750) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width750) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width750) * 8px);
    box-shadow: 0 0 calc(var(--width750) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width750) * 4px);
    padding: calc(var(--width750) * 12px) calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width750) * 20px);
    height: calc(var(--width750) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width750) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width750) * 6px);
    height: calc(var(--width750) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width750) * 12px) calc(var(--width750) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width750) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width750) * 34px);
    padding: 0 calc(var(--width750) * 6px);
    border-radius: calc(var(--width750) * 8px);
    font-size: calc(var(--width750) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width750) * 16px) calc(var(--width750) * 10px);
    padding-bottom: calc(var(--width750) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width750) * 6px);
    min-width: 0;
    font-size: calc(var(--width750) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width750) * 18px);
    height: calc(var(--width750) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width750) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width750) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width750) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width750) * 120px);
    height: calc(var(--width750) * 68px);
    border-radius: calc(var(--width750) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width750) * 16px);
    min-height: calc(var(--width750) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width750) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width750) * 12px) 0 calc(var(--width750) * 10px);
    gap: calc(var(--width750) * 6px);
    font-size: calc(var(--width750) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width750) * 14px);
    height: calc(var(--width750) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width750) * 12px);
    margin: 0;
    padding: calc(var(--width750) * 16px);
    border-radius: calc(var(--width750) * 12px);
    box-shadow: 0 calc(var(--width750) * 2px) calc(var(--width750) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width750) * 206px);
    border-radius: calc(var(--width750) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width750) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width750) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width750) * 16px);
    margin: calc(var(--width750) * 4px) 0 calc(var(--width750) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width750) * 20px);
    font-size: calc(var(--width750) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width750) * 8px);
    margin-top: calc(var(--width750) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width750) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width750) * 2px) calc(var(--width750) * 10px);
    border-radius: calc(var(--width750) * 999px);
    font-size: calc(var(--width750) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width750) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width750) * 8px);
    padding: calc(var(--width750) * 10px) calc(var(--width750) * 15px) calc(var(--width750) * 16px) calc(var(--width750) * 15px);
    margin-bottom: calc(var(--width750) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width750) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width750) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width750) * 10px);
    padding: calc(var(--width750) * 10px) 0;
    font-size: calc(var(--width750) * 13px);
  }

  .widget-icon {
    width: calc(var(--width750) * 18px);
    height: calc(var(--width750) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width750) * 48px);
    height: calc(var(--width750) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width750) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width750) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width750) * 120px);
    height: calc(var(--width750) * 68px);
    border-radius: calc(var(--width750) * 4px);
    margin: 0 calc(var(--width750) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width750) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width750) * 16px);
    line-height: calc(var(--width750) * 18px);
    min-height: calc(var(--width750) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 12px);
    line-height: calc(var(--width750) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width750) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width750) * 14px);
    height: calc(var(--width750) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width750) * 14px);
    height: calc(var(--width750) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width750) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width750) * 110px);
    height: calc(var(--width750) * 62px);
    border-radius: calc(var(--width750) * 4px);
    margin: 0 calc(var(--width750) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width750) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width750) * 16px);
    line-height: calc(var(--width750) * 18px);
    min-height: calc(var(--width750) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 12px);
    line-height: calc(var(--width750) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width750) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width750) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width750) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width750) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width750) * 48px);
    height: calc(var(--width750) * 48px);
    border-radius: calc(var(--width750) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width750) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width750) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width750) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width750) * 2px);
    width: calc(var(--width750) * 68px);
    height: calc(var(--width750) * 27px);
    padding: 0;
    border-radius: calc(var(--width750) * 14px);
    font-size: calc(var(--width750) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width750) * 11px);
    height: calc(var(--width750) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width750) * 16px);
    padding: 0 0 0 calc(var(--width750) * 18px);
    font-size: calc(var(--width750) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width750) * 4px);
    height: calc(var(--width750) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width750) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width750) * 12px);
    padding: calc(var(--width750) * 8px) 0;
    font-size: calc(var(--width750) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width750) * 8px);
  }

  .widget-links {
    gap: calc(var(--width750) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width750) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width750) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width750) * 6px) 0 calc(var(--width750) * 6px);
    font-size: calc(var(--width750) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width750) * 12px) 0;
    font-size: calc(var(--width750) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width750) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width750) * 72px);
    padding-left: calc(var(--width750) * 16px);
    padding-right: calc(var(--width750) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width750) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width750) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width750) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width750) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width750) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width750) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width750) * 16px);
    font-size: calc(var(--width750) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width750) * 4px) calc(var(--width750) * 8px);
    border-radius: calc(var(--width750) * 4px);
    font-size: calc(var(--width750) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width750) * 16px) 0 calc(var(--width750) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width750) * 16px) 0 calc(var(--width750) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width750) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width750) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width750) * 12px) 0 calc(var(--width750) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width750) * 21px);
    margin-bottom: calc(var(--width750) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width750) * 8px);
    padding-bottom: calc(var(--width750) * 7px);
    margin-bottom: calc(var(--width750) * 10px);
  }

  .author-avatar {
    width: calc(var(--width750) * 36px);
    height: calc(var(--width750) * 36px);
    margin: 0 calc(var(--width750) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width750) * 12px);
    gap: calc(var(--width750) * 4px);
    margin: calc(var(--width750) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width750) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width750) * 2px) calc(var(--width750) * 10px);
    border-radius: calc(var(--width750) * 3px);
    font-size: calc(var(--width750) * 12px);
    margin-top: calc(var(--width750) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width750) * 15px);
    margin-bottom: calc(var(--width750) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width750) * 22px);
    margin: calc(var(--width750) * 18px) 0 calc(var(--width750) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width750) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width750) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width750) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width750) * 12px);
    margin-top: calc(var(--width750) * 6px);
  }

  .artcona {
    margin: calc(var(--width750) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width750) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width750) * 16px);
  }

  .box-title {
    font-size: calc(var(--width750) * 18px);
    margin-bottom: calc(var(--width750) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width750) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width750) * 14px);
    padding: calc(var(--width750) * 15px) calc(var(--width750) * 18px);
    border-radius: 0 calc(var(--width750) * 8px) calc(var(--width750) * 8px) 0;
    margin-bottom: calc(var(--width750) * 14px);
    line-height: calc(var(--width750) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width750) * 2px);
    border-radius: calc(var(--width750) * 2px) 0 0 calc(var(--width750) * 2px);
  }

  .related-list {
    gap: calc(var(--width750) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width750) * 8px);
    font-size: calc(var(--width750) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width750) * 4px);
    height: calc(var(--width750) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width750) * 12px);
    padding: calc(var(--width750) * 14px);
    box-shadow: 0 0 calc(var(--width750) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width750) * 8px);
    margin-bottom: calc(var(--width750) * 16px);
  }

  .tool-icon {
    width: calc(var(--width750) * 56px);
    height: calc(var(--width750) * 56px);
    border-radius: calc(var(--width750) * 8px);
    margin: 0 calc(var(--width750) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width750) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width750) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width750) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width750) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width750) * 10px);
    margin: calc(var(--width750) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width750) * 2px);
    height: calc(var(--width750) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width750) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width750) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width750) * 4px);
    font-size: calc(var(--width750) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width750) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width750) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width750) * 88px);
    height: calc(var(--width750) * 26px);
    border-radius: calc(var(--width750) * 17px);
    font-size: calc(var(--width750) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width750) * 88px);
    height: calc(var(--width750) * 26px);
    border-radius: calc(var(--width750) * 17px);
    gap: calc(var(--width750) * 4px);
    font-size: calc(var(--width750) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width750) * 13px);
    height: calc(var(--width750) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width750) * 12px);
    padding: calc(var(--width750) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width750) * 101px);
    height: calc(var(--width750) * 101px);
    border-radius: calc(var(--width750) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width750) * 88px);
    height: calc(var(--width750) * 88px);
    border-radius: calc(var(--width750) * 8px);
    padding: calc(var(--width750) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width750) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width750) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width750) * 162px);
    height: calc(var(--width750) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width750) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width750) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width750) * 4px);
    font-size: calc(var(--width750) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width750) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width750) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width750) * 1px) calc(var(--width750) * 8px);
    border-radius: calc(var(--width750) * 11px);
    font-size: calc(var(--width750) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width750) * 26px);
    padding: 0 calc(var(--width750) * 14px);
    border-radius: calc(var(--width750) * 13px);
    font-size: calc(var(--width750) * 12px);
    gap: calc(var(--width750) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width750) * 14px);
    height: calc(var(--width750) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width750) * 8px) calc(var(--width750) * 20px);
    font-size: calc(var(--width750) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width750) * 10px);
    margin-bottom: calc(var(--width750) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width750) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width750) * 10px);
    margin-bottom: calc(var(--width750) * 16px);
    border-radius: calc(var(--width750) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width750) * 16px);
    margin: 0 0 calc(var(--width750) * 10px);
  }

  .declared {
    border-radius: calc(var(--width750) * 8px);
    padding: calc(var(--width750) * 16px) calc(var(--width750) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width750) * 90px);
    height: calc(var(--width750) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width750) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width750) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width750) * 14px);
    line-height: calc(var(--width750) * 20px);
    margin: 0 0 calc(var(--width750) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width750) * 10px);
    font-size: calc(var(--width750) * 13px);
    margin: 0 0 calc(var(--width750) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width750) * 8px) calc(var(--width750) * 16px);
    min-height: calc(var(--width750) * 38px);
    box-shadow: 0 0 calc(var(--width750) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width750) * 8px);
    gap: calc(var(--width750) * 4px);
    font-size: calc(var(--width750) * 12px);
  }

  .author-list {
    gap: calc(var(--width750) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width750) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width750) * 10px);
    font-size: calc(var(--width750) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width750) * 4px);
    height: calc(var(--width750) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width750) * 3px);
    font-size: calc(var(--width750) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width750) * 26px);
  }

  .detail-products {
    margin: calc(var(--width750) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width750) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width750) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width750) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width750) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width750) * 3px);
    height: calc(var(--width750) * 14px);
    margin-right: calc(var(--width750) * 8px);
    margin-top: calc(var(--width750) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width750) * 8px) 0 0;
    width: calc(var(--width750) * 12px);
    height: calc(var(--width750) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width750) * 16px);
    margin: calc(var(--width750) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width750) * 15px);
    margin: calc(var(--width750) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width750) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width750) * 6px) calc(var(--width750) * 8px);
    font-size: calc(var(--width750) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width750) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width750) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width750) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width750) * 5px) calc(var(--width750) * 10px);
    font-size: calc(var(--width750) * 12px);
    border-radius: calc(var(--width750) * 5px);
    top: calc(var(--width750) * 5px);
    right: calc(var(--width750) * 5px);
    margin-bottom: calc(var(--width750) * -35px);
  }

  .artcons img {
    height: calc(var(--width750) * 506px);
    border-radius: calc(var(--width750) * 8px);
  }
   .detail-content ol{margin-left:calc(var(--width750) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width750) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width750) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width750) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width750) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width750) * 26px);
    font-size: calc(var(--width750) * 16px);
    margin: calc(var(--width750) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width750) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width750) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width750) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width750) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width750) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width750) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width750) * 120px);
  }

  .artcons {
    font-size: calc(var(--width750) * 16px);
  }

}

@media screen and (max-width: 561px) {
  :root {
    --radius-sm: calc(var(--width560) * 4px);
    --radius-md: calc(var(--width560) * 8px);
    --radius-lg: calc(var(--width560) * 24px);
    --page-pad: calc(var(--width560) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width560) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width560) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width560) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width560) * 48px);
    padding: calc(var(--width560) * 10px) calc(var(--width560) * 16px) calc(var(--width560) * 10px) calc(var(--width560) * 13px);
    box-shadow: 0 0 calc(var(--width560) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width560) * 8px);
    font-size: calc(var(--width560) * 18px);
  }

  .logo-img {
    width: calc(var(--width560) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width560) * 14px);
    margin-left: calc(var(--width560) * 4px);
  }

  .header-actions {
    gap: calc(var(--width560) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width560) * 18px);
    height: calc(var(--width560) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width560) * 320px);
    box-shadow: calc(var(--width560) * -4px) 0 calc(var(--width560) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width560) * 52px);
    padding: 0 calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width560) * 20px);
    height: calc(var(--width560) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width560) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width560) * 14px) calc(var(--width560) * 20px);
    font-size: calc(var(--width560) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width560) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width560) * 48px);
    padding: 0 calc(var(--width560) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width560) * 8px);
    width: calc(var(--width560) * 36px);
    height: calc(var(--width560) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width560) * 20px);
    height: calc(var(--width560) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width560) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width560) * 16px) calc(var(--width560) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width560) * 8px);
    height: calc(var(--width560) * 44px);
    padding: 0 calc(var(--width560) * 16px);
    margin: 0 0 calc(var(--width560) * 18px);
    border-radius: calc(var(--width560) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width560) * 18px);
    height: calc(var(--width560) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width560) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width560) * 10px);
    margin: 0 0 calc(var(--width560) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width560) * 6px);
    min-height: calc(var(--width560) * 52px);
    padding: calc(var(--width560) * 12px) calc(var(--width560) * 16px);
    box-shadow: 0 0 calc(var(--width560) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width560) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width560) * 20px);
    height: calc(var(--width560) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width560) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width560) * 6px);
    height: calc(var(--width560) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width560) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width560) * 6px);
    height: calc(var(--width560) * 44px);
    border-radius: calc(var(--width560) * 21px);
    font-size: calc(var(--width560) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width560) * 16px);
    height: calc(var(--width560) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width560) * 14px);
    height: calc(var(--width560) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width560) * 16px) calc(var(--width560) * 16px) calc(var(--width560) * 26px);
  }

  .sechtitle {
    top: calc(var(--width560) * 12px);
    right: calc(var(--width560) * 12px);
    width: calc(var(--width560) * 36px);
    height: calc(var(--width560) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width560) * 22px);
    height: calc(var(--width560) * 22px);
  }

  .sechcon {
    margin: calc(var(--width560) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width560) * 20px);
    width: calc(var(--width560) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width560) * 198px);
  }

  .serchd {
    height: calc(var(--width560) * 46px);
    margin: 0 0 calc(var(--width560) * 18px);
    border-radius: calc(var(--width560) * 23px);
    padding: 0 calc(var(--width560) * 16px) 0 calc(var(--width560) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width560) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width560) * 36px);
    height: calc(var(--width560) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width560) * 20px);
    height: calc(var(--width560) * 20px);
  }

  .top-btn {
    gap: calc(var(--width560) * 8px);
  }

  .topbtna {
    height: calc(var(--width560) * 18px);
    padding: 0 calc(var(--width560) * 12px);
    border-radius: calc(var(--width560) * 11px);
    font-size: calc(var(--width560) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width560) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width560) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width560) * 6px);
    font-size: calc(var(--width560) * 32px);
    line-height: calc(var(--width560) * 36px);
    margin: calc(var(--width560) * 26px) 0 calc(var(--width560) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width560) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width560) * 6px) auto;
    letter-spacing: calc(var(--width560) * 4px);
    width: calc(var(--width560) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width560) * 12px);
    margin-bottom: calc(var(--width560) * 15px);
    letter-spacing: calc(var(--width560) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width560) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width560) * 98px);
    height: calc(var(--width560) * 32px);
    border-radius: calc(var(--width560) * 22px);
    font-size: calc(var(--width560) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width560) * 44px);
    width: calc(var(--width560) * 98px);
    height: calc(var(--width560) * 32px);
    border-radius: calc(var(--width560) * 26px);
    font-size: calc(var(--width560) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width560) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width560) * 12px);
  }

  .section-title {
    font-size: calc(var(--width560) * 18px);
  }

  .section-more {
    font-size: calc(var(--width560) * 14px);
  }

  .section-more b {
    width: calc(var(--width560) * 8px);
    height: calc(var(--width560) * 8px);
    margin: 0 0 0 calc(var(--width560) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width560) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width560) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width560) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width560) * 308px);
    border-radius: calc(var(--width560) * 5px);
    width: calc(var(--width560) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width560) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width560) * 8px);
    margin: calc(var(--width560) * 5px) calc(var(--width560) * 6px) 0 calc(var(--width560) * 10px);
    min-height: calc(var(--width560) * 56px);
    padding: 0 0 calc(var(--width560) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width560) * 3px);
    right: calc(var(--width560) * 3px);
    bottom: 0;
    height: calc(var(--width560) * 1px);
  }

  .card-icon {
    width: calc(var(--width560) * 40px);
    height: calc(var(--width560) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width560) * 14px);
    margin: 0 0 calc(var(--width560) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width560) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width560) * 6px);
    min-width: 0;
    font-size: calc(var(--width560) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width560) * 8px);
    height: calc(var(--width560) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width560) * 3px);
    height: calc(var(--width560) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width560) * 12px);
    margin: 0 0 calc(var(--width560) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width560) * 10px) calc(var(--width560) * 10px) calc(var(--width560) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width560) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width560) * 10px);
    font-size: calc(var(--width560) * 12px);
    width: calc(var(--width560) * 145px);
    height: calc(var(--width560) * 28px);
    border-radius: calc(var(--width560) * 14px);
  }

  .card-more b {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 9px);
    margin: 0 0 0 calc(var(--width560) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width560) * 4px);
    margin-top: calc(var(--width560) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width560) * 4px);
    height: calc(var(--width560) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width560) * 20px);
    border-radius: calc(var(--width560) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width560) * 14px) 0 calc(var(--width560) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width560) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width560) * 8px);
  }

  .tags-list {
    gap: calc(var(--width560) * 8px);
  }

  .tag {
    padding: calc(var(--width560) * 4px) calc(var(--width560) * 16px);
    border-radius: calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width560) * 12px);
    padding: calc(var(--width560) * 2px) calc(var(--width560) * 8px);
    border-radius: calc(var(--width560) * 12px);
  }

  .products-grid {
    gap: calc(var(--width560) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width560) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width560) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width560) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width560) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width560) * 16px);
    gap: calc(var(--width560) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width560) * 4px);
    height: calc(var(--width560) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width560) * 20px);
    border-radius: calc(var(--width560) * 2px);
  }

  .product-card {
    padding: calc(var(--width560) * 10px);
    min-width: 0;
    border-radius: calc(var(--width560) * 8px);
    box-shadow: 0 0 calc(var(--width560) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width560) * 10px);
    top: calc(var(--width560) * 8px);
    left: calc(var(--width560) * 10px);
    gap: calc(var(--width560) * 3px);
    max-width: calc(100% - calc(var(--width560) * 36px));
  }

  .tagsa {
    padding: calc(var(--width560) * 1px) calc(var(--width560) * 5px);
    font-size: calc(var(--width560) * 10px);
    border-radius: calc(var(--width560) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width560) * 1px) calc(var(--width560) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width560) * 8px);
    margin: calc(var(--width560) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width560) * 16px);
    margin: calc(var(--width560) * 7px) 0 calc(var(--width560) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width560) * 12px);
    margin-bottom: calc(var(--width560) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width560) * 11px);
  }

  .product-rating b {
    width: calc(var(--width560) * 10px);
    height: calc(var(--width560) * 10px);
    margin: 0 calc(var(--width560) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width560) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width560) * 24px);
    margin: calc(var(--width560) * 32px) auto calc(var(--width560) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width560) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width560) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width560) * 98px);
    padding: 0 calc(var(--width560) * 24px);
    height: calc(var(--width560) * 32px);
    border-radius: calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width560) * 9px);
    height: calc(var(--width560) * 5px);
    margin: 0 0 0 calc(var(--width560) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width560) * 88px);
    width: calc(var(--width560) * 88px);
    height: calc(var(--width560) * 28px);
    border-radius: calc(var(--width560) * 15px);
    font-size: calc(var(--width560) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width560) * 88px);
    width: calc(var(--width560) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width560) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width560) * 34px);
    border-radius: calc(var(--width560) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width560) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width560) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width560) * 8px);
    height: calc(var(--width560) * 34px);
    padding: 0 0 0 calc(var(--width560) * 7px);
    font-size: calc(var(--width560) * 16px);
    line-height: calc(var(--width560) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width560) * 18px);
    height: calc(var(--width560) * 18px);
    margin: 0 calc(var(--width560) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width560) * 4px);
    font-size: calc(var(--width560) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width560) * 11px);
    height: calc(var(--width560) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width560) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width560) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width560) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width560) * 12px);
    padding: calc(var(--width560) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width560) * 16px);
    margin-bottom: calc(var(--width560) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width560) * 14px);
    max-height: calc(var(--width560) * 20px);
    line-height: calc(var(--width560) * 18px);
    margin-bottom: calc(var(--width560) * 3px);
  }

  .article-tags {
    gap: calc(var(--width560) * 6px);
    margin-top: calc(var(--width560) * 4px);
  }

  .article-tag {
    padding: calc(var(--width560) * 1px) calc(var(--width560) * 8px);
    border-radius: calc(var(--width560) * 11px);
    font-size: calc(var(--width560) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width560) * 1px) calc(var(--width560) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width560) * 3px) calc(var(--width560) * 8px);
    font-size: calc(var(--width560) * 12px);
    border-radius: calc(var(--width560) * 12px);
  }

  .article-info {
    font-size: calc(var(--width560) * 12px);
    gap: calc(var(--width560) * 10px);
  }

  .article-thumb {
    width: calc(var(--width560) * 148px);
    height: calc(var(--width560) * 88px);
    border-radius: calc(var(--width560) * 6px);
    margin-top: calc(var(--width560) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width560) * 88px);
    height: calc(var(--width560) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width560) * 6px);
    height: calc(var(--width560) * 38px);
    margin-top: calc(var(--width560) * 16px);
    border-radius: calc(var(--width560) * 21px);
    font-size: calc(var(--width560) * 16px);
  }

  .icon-more {
    width: calc(var(--width560) * 16px);
    height: calc(var(--width560) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width560) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width560) * 3px) 0 0;
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width560) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width560) * 10px);
    padding: calc(var(--width560) * 12px) 0;
    font-size: calc(var(--width560) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width560) * 16px);
    height: calc(var(--width560) * 16px);
    margin: 0 calc(var(--width560) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width560) * 12px);
    padding-top: calc(var(--width560) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width560) * 12px);
    padding: calc(var(--width560) * 7px) 0;
    font-size: calc(var(--width560) * 13px);
    border-radius: calc(var(--width560) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width560) * 4px);
    width: calc(var(--width560) * 10px);
    height: calc(var(--width560) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width560) * 12px);
    margin: calc(var(--width560) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width560) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width560) * 16px) calc(var(--width560) * 15px) 0 calc(var(--width560) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width560) * 8px);
    margin-bottom: calc(var(--width560) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width560) * 198px);
    padding: 0 0 0 calc(var(--width560) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width560) * 14px);
    margin-bottom: calc(var(--width560) * 10px);
  }

  .footer-social {
    gap: calc(var(--width560) * 12px);
  }

  .footer-social a {
    width: calc(var(--width560) * 32px);
    height: calc(var(--width560) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width560) * 28px);
    height: calc(var(--width560) * 28px);
  }

  .footer-links {
    padding: calc(var(--width560) * 28px) calc(var(--width560) * 15px) calc(var(--width560) * 15px) calc(var(--width560) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width560) * 16px);
    margin-bottom: calc(var(--width560) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width560) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width560) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width560) * 15px) 0 calc(var(--width560) * 15px);
    gap: calc(var(--width560) * 15px);
    border-radius: calc(var(--width560) * 12px);
    padding: calc(var(--width560) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width560) * 120px);
    height: calc(var(--width560) * 120px);
    border-radius: calc(var(--width560) * 4px);
    margin: 0;
    margin: calc(var(--width560) * 10px) 0 calc(var(--width560) * 10px) calc(var(--width560) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width560) * 106px);
    height: calc(var(--width560) * 106px);
    border-radius: calc(var(--width560) * 4px);
  }

  .foot-line {
    width: calc(var(--width560) * 2px);
    height: calc(var(--width560) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width560) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width560) * 14px);
    margin: calc(var(--width560) * 6px) 0 calc(var(--width560) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width560) * 152px);
    height: calc(var(--width560) * 32px);
    padding: 0 calc(var(--width560) * 12px);
    border-radius: calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width560) * 14px) 0 calc(var(--width560) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width560) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width560) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width560) * 4px);
  }

  .gh {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width560) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width560) * 33px) 0 calc(var(--width560) * 26px);
  }

  .search-hero {
    padding: calc(var(--width560) * 20px) 0 calc(var(--width560) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width560) * 70px) 0 calc(var(--width560) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width560) * 14px);
  }

  .search-brand img {
    height: calc(var(--width560) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width560) * 14px);
    border-radius: calc(var(--width560) * 24px);
    padding: calc(var(--width560) * 3px) calc(var(--width560) * 3px) calc(var(--width560) * 3px) 0;
    height: calc(var(--width560) * 32px);
    box-shadow: 0 calc(var(--width560) * 2px) calc(var(--width560) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width560) * 12px) 0 calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width560) * 12px);
    height: calc(var(--width560) * 28px);
    border-radius: calc(var(--width560) * 19px);
    font-size: calc(var(--width560) * 12px);
  }

  .search-submit b {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
    margin: 0 calc(var(--width560) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width560) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width560) * 14px);
    line-height: calc(var(--width560) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width560) * 10px);
    max-height: calc(var(--width560) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width560) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 7px);
  }

  .search-main {
    padding: calc(var(--width560) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width560) * -32px));
    margin: 0 0 calc(var(--width560) * 17px) 0;
    padding: 0  calc(var(--width560) * 22px);
    height: calc(var(--width560) * 42px);
    box-shadow: 0 0 calc(var(--width560) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width560) * 8px);
    gap: calc(var(--width560) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width560) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width560) * 6px);
    width: calc(var(--width560) * 16px);
    height: calc(var(--width560) * 2px);
  }

  .search-right {
    font-size: calc(var(--width560) * 12px);
    margin: calc(var(--width560) * 12px) 0 calc(var(--width560) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width560) * 13px);
  }

  .empty-state {
    padding: calc(var(--width560) * 70px) 0 calc(var(--width560) * 68px);
  }

  .empty-img {
    width: calc(var(--width560) * 259px);
    margin: 0 auto calc(var(--width560) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width560) * 14px);
    margin: 0 auto calc(var(--width560) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width560) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width560) * 16px) 0 calc(var(--width560) * 32px);
  }

  .pagination {
    gap: calc(var(--width560) * 12px);
    margin-top: calc(var(--width560) * 20px);
  }

  .page-btns {
    gap: calc(var(--width560) * 10px) calc(var(--width560) * 4px);
  }

  .page-extra {
    gap: calc(var(--width560) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width560) * 32px);
    height: calc(var(--width560) * 32px);
    padding: 0 calc(var(--width560) * 8px);
    border-radius: calc(var(--width560) * 4px);
    font-size: calc(var(--width560) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width560) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width560) * 2px);
    font-size: calc(var(--width560) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width560) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width560) * 36px);
    height: calc(var(--width560) * 28px);
    border-radius: calc(var(--width560) * 6px);
    font-size: calc(var(--width560) * 12px);
    margin: 0 calc(var(--width560) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width560) * 14px);
    height: calc(var(--width560) * 28px);
    margin-left: calc(var(--width560) * 4px);
    border-radius: calc(var(--width560) * 3px);
    font-size: calc(var(--width560) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width560) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width560) * 27px);
    padding: calc(var(--width560) * 12px) calc(var(--width560) * 15px) 0 calc(var(--width560) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width560) * 4px);
    min-width: calc(var(--width560) * 68px);
    padding: 0;
    font-size: calc(var(--width560) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width560) * 20px);
    height: calc(var(--width560) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width560) * 20px);
    height: calc(var(--width560) * 3px);
    border-radius: calc(var(--width560) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width560) * 8px);
    padding: calc(var(--width560) * 15px) calc(var(--width560) * 12px) calc(var(--width560) * 10px) calc(var(--width560) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width560) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width560) * 32px);
    padding: 0 calc(var(--width560) * 12px);
    border-radius: calc(var(--width560) * 8px);
    font-size: calc(var(--width560) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width560) * 40px);
    gap: calc(var(--width560) * 2px);
    font-size: calc(var(--width560) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width560) * 18px);
    height: calc(var(--width560) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width560) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width560) * 8px);
    padding: calc(var(--width560) * 8px) calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width560) * 2px);
    height: calc(var(--width560) * 40px);
    border-radius: calc(var(--width560) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width560) * 18px);
    height: calc(var(--width560) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width560) * 10px);
    height: calc(var(--width560) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width560) * 4px) 0 calc(var(--width560) * 8px);
    gap: calc(var(--width560) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width560) * 7px) calc(var(--width560) * 3px);
    font-size: calc(var(--width560) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width560) * 26px);
    width: calc(var(--width560) * 6px);
    height: calc(var(--width560) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width560) * 18px);
    height: calc(var(--width560) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width560) * 10px);
    height: calc(var(--width560) * 12px);
    margin: 0 calc(var(--width560) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width560) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width560) * 12px) 0 calc(var(--width560) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width560) * 14px) calc(var(--width560) * 14px) calc(var(--width560) * 14px) calc(var(--width560) * 16px);
    margin: calc(var(--width560) * 12px) 0 calc(var(--width560) * 14px);
    border-radius: calc(var(--width560) * 10px);
    min-height: calc(var(--width560) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width560) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width560) * 14px);
    line-height: calc(var(--width560) * 18px);
    margin: calc(var(--width560) * 6px) 0 calc(var(--width560) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width560) * 12px);
    gap: calc(var(--width560) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width560) * 3px) 0 0;
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width560) * 3px) 0 0;
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width560) * 4px);
    padding: 0 0 calc(var(--width560) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width560) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width560) * 12px);
    margin-bottom: calc(var(--width560) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width560) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width560) * 10px) calc(var(--width560) * 15px) calc(var(--width560) * 12px) calc(var(--width560) * 15px);
    margin: calc(var(--width560) * 24px) 0 calc(var(--width560) * 16px);
    border-radius: calc(var(--width560) * 10px);
    min-height: calc(var(--width560) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width560) * 8px);
    min-width: 0;
    margin: calc(var(--width560) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width560) * 72px);
    height: calc(var(--width560) * 28px);
    padding: 0 calc(var(--width560) * 12px);
    border-radius: calc(var(--width560) * 14px);
    font-size: calc(var(--width560) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width560) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width560) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width560) * 24px);
    height: calc(var(--width560) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width560) * 15px) calc(var(--width560) * 12px) 0 calc(var(--width560) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width560) * 10px);
    margin-left: calc(var(--width560) * 2px);
  }

  .banner-img {
    width: calc(var(--width560) * 80px);
    height: calc(var(--width560) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width560) * 48px);
    padding: 0 calc(var(--width560) * 18px);
  }

  .catalog-back {
    left: calc(var(--width560) * 8px);
    width: calc(var(--width560) * 36px);
    height: calc(var(--width560) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width560) * 20px);
    height: calc(var(--width560) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width560) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width560) * 16px) calc(var(--width560) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width560) * 18px);
    margin: 0 0 calc(var(--width560) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width560) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width560) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width560) * 8px);
    box-shadow: 0 0 calc(var(--width560) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width560) * 4px);
    padding: calc(var(--width560) * 12px) calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width560) * 20px);
    height: calc(var(--width560) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width560) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width560) * 6px);
    height: calc(var(--width560) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width560) * 12px) calc(var(--width560) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width560) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width560) * 34px);
    padding: 0 calc(var(--width560) * 6px);
    border-radius: calc(var(--width560) * 8px);
    font-size: calc(var(--width560) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width560) * 16px) calc(var(--width560) * 10px);
    padding-bottom: calc(var(--width560) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width560) * 6px);
    min-width: 0;
    font-size: calc(var(--width560) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width560) * 18px);
    height: calc(var(--width560) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width560) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width560) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width560) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width560) * 120px);
    height: calc(var(--width560) * 68px);
    border-radius: calc(var(--width560) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width560) * 16px);
    min-height: calc(var(--width560) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width560) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width560) * 12px) 0 calc(var(--width560) * 10px);
    gap: calc(var(--width560) * 6px);
    font-size: calc(var(--width560) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width560) * 14px);
    height: calc(var(--width560) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width560) * 12px);
    margin: 0;
    padding: calc(var(--width560) * 16px);
    border-radius: calc(var(--width560) * 12px);
    box-shadow: 0 calc(var(--width560) * 2px) calc(var(--width560) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width560) * 206px);
    border-radius: calc(var(--width560) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width560) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width560) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width560) * 16px);
    margin: calc(var(--width560) * 4px) 0 calc(var(--width560) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width560) * 20px);
    font-size: calc(var(--width560) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width560) * 8px);
    margin-top: calc(var(--width560) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width560) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width560) * 2px) calc(var(--width560) * 10px);
    border-radius: calc(var(--width560) * 999px);
    font-size: calc(var(--width560) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width560) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width560) * 8px);
    padding: calc(var(--width560) * 10px) calc(var(--width560) * 15px) calc(var(--width560) * 16px) calc(var(--width560) * 15px);
    margin-bottom: calc(var(--width560) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width560) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width560) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width560) * 10px);
    padding: calc(var(--width560) * 10px) 0;
    font-size: calc(var(--width560) * 13px);
  }

  .widget-icon {
    width: calc(var(--width560) * 18px);
    height: calc(var(--width560) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width560) * 48px);
    height: calc(var(--width560) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width560) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width560) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width560) * 120px);
    height: calc(var(--width560) * 68px);
    border-radius: calc(var(--width560) * 4px);
    margin: 0 calc(var(--width560) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width560) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width560) * 16px);
    line-height: calc(var(--width560) * 18px);
    min-height: calc(var(--width560) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 12px);
    line-height: calc(var(--width560) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width560) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width560) * 14px);
    height: calc(var(--width560) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width560) * 14px);
    height: calc(var(--width560) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width560) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width560) * 110px);
    height: calc(var(--width560) * 62px);
    border-radius: calc(var(--width560) * 4px);
    margin: 0 calc(var(--width560) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width560) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width560) * 16px);
    line-height: calc(var(--width560) * 18px);
    min-height: calc(var(--width560) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 12px);
    line-height: calc(var(--width560) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width560) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width560) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width560) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width560) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width560) * 48px);
    height: calc(var(--width560) * 48px);
    border-radius: calc(var(--width560) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width560) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width560) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width560) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width560) * 2px);
    width: calc(var(--width560) * 68px);
    height: calc(var(--width560) * 27px);
    padding: 0;
    border-radius: calc(var(--width560) * 14px);
    font-size: calc(var(--width560) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width560) * 11px);
    height: calc(var(--width560) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width560) * 16px);
    padding: 0 0 0 calc(var(--width560) * 18px);
    font-size: calc(var(--width560) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width560) * 4px);
    height: calc(var(--width560) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width560) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width560) * 12px);
    padding: calc(var(--width560) * 8px) 0;
    font-size: calc(var(--width560) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width560) * 8px);
  }

  .widget-links {
    gap: calc(var(--width560) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width560) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width560) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width560) * 6px) 0 calc(var(--width560) * 6px);
    font-size: calc(var(--width560) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width560) * 12px) 0;
    font-size: calc(var(--width560) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width560) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width560) * 72px);
    padding-left: calc(var(--width560) * 16px);
    padding-right: calc(var(--width560) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width560) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width560) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width560) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width560) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width560) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width560) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width560) * 16px);
    font-size: calc(var(--width560) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width560) * 4px) calc(var(--width560) * 8px);
    border-radius: calc(var(--width560) * 4px);
    font-size: calc(var(--width560) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width560) * 16px) 0 calc(var(--width560) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width560) * 16px) 0 calc(var(--width560) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width560) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width560) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width560) * 12px) 0 calc(var(--width560) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width560) * 21px);
    margin-bottom: calc(var(--width560) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width560) * 8px);
    padding-bottom: calc(var(--width560) * 7px);
    margin-bottom: calc(var(--width560) * 10px);
  }

  .author-avatar {
    width: calc(var(--width560) * 36px);
    height: calc(var(--width560) * 36px);
    margin: 0 calc(var(--width560) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width560) * 12px);
    gap: calc(var(--width560) * 4px);
    margin: calc(var(--width560) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width560) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width560) * 2px) calc(var(--width560) * 10px);
    border-radius: calc(var(--width560) * 3px);
    font-size: calc(var(--width560) * 12px);
    margin-top: calc(var(--width560) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width560) * 15px);
    margin-bottom: calc(var(--width560) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width560) * 22px);
    margin: calc(var(--width560) * 18px) 0 calc(var(--width560) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width560) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width560) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width560) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width560) * 12px);
    margin-top: calc(var(--width560) * 6px);
  }

  .artcona {
    margin: calc(var(--width560) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width560) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width560) * 16px);
  }

  .box-title {
    font-size: calc(var(--width560) * 18px);
    margin-bottom: calc(var(--width560) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width560) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width560) * 14px);
    padding: calc(var(--width560) * 15px) calc(var(--width560) * 18px);
    border-radius: 0 calc(var(--width560) * 8px) calc(var(--width560) * 8px) 0;
    margin-bottom: calc(var(--width560) * 14px);
    line-height: calc(var(--width560) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width560) * 2px);
    border-radius: calc(var(--width560) * 2px) 0 0 calc(var(--width560) * 2px);
  }

  .related-list {
    gap: calc(var(--width560) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width560) * 8px);
    font-size: calc(var(--width560) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width560) * 4px);
    height: calc(var(--width560) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width560) * 12px);
    padding: calc(var(--width560) * 14px);
    box-shadow: 0 0 calc(var(--width560) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width560) * 8px);
    margin-bottom: calc(var(--width560) * 16px);
  }

  .tool-icon {
    width: calc(var(--width560) * 56px);
    height: calc(var(--width560) * 56px);
    border-radius: calc(var(--width560) * 8px);
    margin: 0 calc(var(--width560) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width560) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width560) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width560) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width560) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width560) * 10px);
    margin: calc(var(--width560) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width560) * 2px);
    height: calc(var(--width560) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width560) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width560) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width560) * 4px);
    font-size: calc(var(--width560) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width560) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width560) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width560) * 88px);
    height: calc(var(--width560) * 26px);
    border-radius: calc(var(--width560) * 17px);
    font-size: calc(var(--width560) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width560) * 88px);
    height: calc(var(--width560) * 26px);
    border-radius: calc(var(--width560) * 17px);
    gap: calc(var(--width560) * 4px);
    font-size: calc(var(--width560) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width560) * 13px);
    height: calc(var(--width560) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width560) * 12px);
    padding: calc(var(--width560) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width560) * 101px);
    height: calc(var(--width560) * 101px);
    border-radius: calc(var(--width560) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width560) * 88px);
    height: calc(var(--width560) * 88px);
    border-radius: calc(var(--width560) * 8px);
    padding: calc(var(--width560) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width560) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width560) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width560) * 162px);
    height: calc(var(--width560) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width560) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width560) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width560) * 4px);
    font-size: calc(var(--width560) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width560) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width560) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width560) * 1px) calc(var(--width560) * 8px);
    border-radius: calc(var(--width560) * 11px);
    font-size: calc(var(--width560) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width560) * 26px);
    padding: 0 calc(var(--width560) * 14px);
    border-radius: calc(var(--width560) * 13px);
    font-size: calc(var(--width560) * 12px);
    gap: calc(var(--width560) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width560) * 14px);
    height: calc(var(--width560) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width560) * 8px) calc(var(--width560) * 20px);
    font-size: calc(var(--width560) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width560) * 10px);
    margin-bottom: calc(var(--width560) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width560) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width560) * 10px);
    margin-bottom: calc(var(--width560) * 16px);
    border-radius: calc(var(--width560) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width560) * 16px);
    margin: 0 0 calc(var(--width560) * 10px);
  }

  .declared {
    border-radius: calc(var(--width560) * 8px);
    padding: calc(var(--width560) * 16px) calc(var(--width560) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width560) * 90px);
    height: calc(var(--width560) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width560) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width560) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width560) * 14px);
    line-height: calc(var(--width560) * 20px);
    margin: 0 0 calc(var(--width560) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width560) * 10px);
    font-size: calc(var(--width560) * 13px);
    margin: 0 0 calc(var(--width560) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width560) * 8px) calc(var(--width560) * 16px);
    min-height: calc(var(--width560) * 38px);
    box-shadow: 0 0 calc(var(--width560) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width560) * 8px);
    gap: calc(var(--width560) * 4px);
    font-size: calc(var(--width560) * 12px);
  }

  .author-list {
    gap: calc(var(--width560) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width560) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width560) * 10px);
    font-size: calc(var(--width560) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width560) * 4px);
    height: calc(var(--width560) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width560) * 3px);
    font-size: calc(var(--width560) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width560) * 26px);
  }

  .detail-products {
    margin: calc(var(--width560) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width560) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width560) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width560) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width560) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width560) * 3px);
    height: calc(var(--width560) * 14px);
    margin-right: calc(var(--width560) * 8px);
    margin-top: calc(var(--width560) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width560) * 8px) 0 0;
    width: calc(var(--width560) * 12px);
    height: calc(var(--width560) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width560) * 16px);
    margin: calc(var(--width560) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width560) * 15px);
    margin: calc(var(--width560) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width560) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width560) * 6px) calc(var(--width560) * 8px);
    font-size: calc(var(--width560) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width560) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width560) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width560) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width560) * 5px) calc(var(--width560) * 10px);
    font-size: calc(var(--width560) * 12px);
    border-radius: calc(var(--width560) * 5px);
    top: calc(var(--width560) * 5px);
    right: calc(var(--width560) * 5px);
    margin-bottom: calc(var(--width560) * -35px);
  }

  .artcons img {
    height: calc(var(--width560) * 506px);
    border-radius: calc(var(--width560) * 8px);
  }
  .detail-content ol{margin-left:calc(var(--width560) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width560) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width560) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width560) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width560) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width560) * 26px);
    font-size: calc(var(--width560) * 16px);
    margin: calc(var(--width560) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width560) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width560) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width560) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width560) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width560) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width560) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width560) * 120px);
  }

  .artcons {
    font-size: calc(var(--width560) * 16px);
  }

}

@media screen and (max-width: 541px) {
  :root {
    --radius-sm: calc(var(--width540) * 4px);
    --radius-md: calc(var(--width540) * 8px);
    --radius-lg: calc(var(--width540) * 24px);
    --page-pad: calc(var(--width540) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width540) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width540) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width540) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width540) * 48px);
    padding: calc(var(--width540) * 10px) calc(var(--width540) * 16px) calc(var(--width540) * 10px) calc(var(--width540) * 13px);
    box-shadow: 0 0 calc(var(--width540) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width540) * 8px);
    font-size: calc(var(--width540) * 18px);
  }

  .logo-img {
    width: calc(var(--width540) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width540) * 14px);
    margin-left: calc(var(--width540) * 4px);
  }

  .header-actions {
    gap: calc(var(--width540) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width540) * 18px);
    height: calc(var(--width540) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width540) * 320px);
    box-shadow: calc(var(--width540) * -4px) 0 calc(var(--width540) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width540) * 52px);
    padding: 0 calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width540) * 20px);
    height: calc(var(--width540) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width540) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width540) * 14px) calc(var(--width540) * 20px);
    font-size: calc(var(--width540) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width540) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width540) * 48px);
    padding: 0 calc(var(--width540) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width540) * 8px);
    width: calc(var(--width540) * 36px);
    height: calc(var(--width540) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width540) * 20px);
    height: calc(var(--width540) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width540) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width540) * 16px) calc(var(--width540) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width540) * 8px);
    height: calc(var(--width540) * 44px);
    padding: 0 calc(var(--width540) * 16px);
    margin: 0 0 calc(var(--width540) * 18px);
    border-radius: calc(var(--width540) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width540) * 18px);
    height: calc(var(--width540) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width540) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width540) * 10px);
    margin: 0 0 calc(var(--width540) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width540) * 6px);
    min-height: calc(var(--width540) * 52px);
    padding: calc(var(--width540) * 12px) calc(var(--width540) * 16px);
    box-shadow: 0 0 calc(var(--width540) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width540) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width540) * 20px);
    height: calc(var(--width540) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width540) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width540) * 6px);
    height: calc(var(--width540) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width540) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width540) * 6px);
    height: calc(var(--width540) * 44px);
    border-radius: calc(var(--width540) * 21px);
    font-size: calc(var(--width540) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width540) * 16px);
    height: calc(var(--width540) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width540) * 14px);
    height: calc(var(--width540) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width540) * 16px) calc(var(--width540) * 16px) calc(var(--width540) * 26px);
  }

  .sechtitle {
    top: calc(var(--width540) * 12px);
    right: calc(var(--width540) * 12px);
    width: calc(var(--width540) * 36px);
    height: calc(var(--width540) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width540) * 22px);
    height: calc(var(--width540) * 22px);
  }

  .sechcon {
    margin: calc(var(--width540) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width540) * 20px);
    width: calc(var(--width540) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width540) * 198px);
  }

  .serchd {
    height: calc(var(--width540) * 46px);
    margin: 0 0 calc(var(--width540) * 18px);
    border-radius: calc(var(--width540) * 23px);
    padding: 0 calc(var(--width540) * 16px) 0 calc(var(--width540) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width540) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width540) * 36px);
    height: calc(var(--width540) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width540) * 20px);
    height: calc(var(--width540) * 20px);
  }

  .top-btn {
    gap: calc(var(--width540) * 8px);
  }

  .topbtna {
    height: calc(var(--width540) * 18px);
    padding: 0 calc(var(--width540) * 12px);
    border-radius: calc(var(--width540) * 11px);
    font-size: calc(var(--width540) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width540) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width540) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width540) * 6px);
    font-size: calc(var(--width540) * 32px);
    line-height: calc(var(--width540) * 36px);
    margin: calc(var(--width540) * 26px) 0 calc(var(--width540) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width540) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width540) * 6px) auto;
    letter-spacing: calc(var(--width540) * 4px);
    width: calc(var(--width540) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width540) * 12px);
    margin-bottom: calc(var(--width540) * 15px);
    letter-spacing: calc(var(--width540) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width540) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width540) * 98px);
    height: calc(var(--width540) * 32px);
    border-radius: calc(var(--width540) * 22px);
    font-size: calc(var(--width540) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width540) * 44px);
    width: calc(var(--width540) * 98px);
    height: calc(var(--width540) * 32px);
    border-radius: calc(var(--width540) * 26px);
    font-size: calc(var(--width540) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width540) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width540) * 12px);
  }

  .section-title {
    font-size: calc(var(--width540) * 18px);
  }

  .section-more {
    font-size: calc(var(--width540) * 14px);
  }

  .section-more b {
    width: calc(var(--width540) * 8px);
    height: calc(var(--width540) * 8px);
    margin: 0 0 0 calc(var(--width540) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width540) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width540) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width540) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width540) * 308px);
    border-radius: calc(var(--width540) * 5px);
    width: calc(var(--width540) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width540) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width540) * 8px);
    margin: calc(var(--width540) * 5px) calc(var(--width540) * 6px) 0 calc(var(--width540) * 10px);
    min-height: calc(var(--width540) * 56px);
    padding: 0 0 calc(var(--width540) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width540) * 3px);
    right: calc(var(--width540) * 3px);
    bottom: 0;
    height: calc(var(--width540) * 1px);
  }

  .card-icon {
    width: calc(var(--width540) * 40px);
    height: calc(var(--width540) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width540) * 14px);
    margin: 0 0 calc(var(--width540) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width540) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width540) * 6px);
    min-width: 0;
    font-size: calc(var(--width540) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width540) * 8px);
    height: calc(var(--width540) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width540) * 3px);
    height: calc(var(--width540) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width540) * 12px);
    margin: 0 0 calc(var(--width540) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width540) * 10px) calc(var(--width540) * 10px) calc(var(--width540) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width540) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width540) * 10px);
    font-size: calc(var(--width540) * 12px);
    width: calc(var(--width540) * 145px);
    height: calc(var(--width540) * 28px);
    border-radius: calc(var(--width540) * 14px);
  }

  .card-more b {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 9px);
    margin: 0 0 0 calc(var(--width540) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width540) * 4px);
    margin-top: calc(var(--width540) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width540) * 4px);
    height: calc(var(--width540) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width540) * 20px);
    border-radius: calc(var(--width540) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width540) * 14px) 0 calc(var(--width540) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width540) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width540) * 8px);
  }

  .tags-list {
    gap: calc(var(--width540) * 8px);
  }

  .tag {
    padding: calc(var(--width540) * 4px) calc(var(--width540) * 16px);
    border-radius: calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width540) * 12px);
    padding: calc(var(--width540) * 2px) calc(var(--width540) * 8px);
    border-radius: calc(var(--width540) * 12px);
  }

  .products-grid {
    gap: calc(var(--width540) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width540) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width540) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width540) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width540) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width540) * 16px);
    gap: calc(var(--width540) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width540) * 4px);
    height: calc(var(--width540) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width540) * 20px);
    border-radius: calc(var(--width540) * 2px);
  }

  .product-card {
    padding: calc(var(--width540) * 10px);
    min-width: 0;
    border-radius: calc(var(--width540) * 8px);
    box-shadow: 0 0 calc(var(--width540) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width540) * 10px);
    top: calc(var(--width540) * 8px);
    left: calc(var(--width540) * 10px);
    gap: calc(var(--width540) * 3px);
    max-width: calc(100% - calc(var(--width540) * 36px));
  }

  .tagsa {
    padding: calc(var(--width540) * 1px) calc(var(--width540) * 5px);
    font-size: calc(var(--width540) * 10px);
    border-radius: calc(var(--width540) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width540) * 1px) calc(var(--width540) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width540) * 8px);
    margin: calc(var(--width540) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width540) * 16px);
    margin: calc(var(--width540) * 7px) 0 calc(var(--width540) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width540) * 12px);
    margin-bottom: calc(var(--width540) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width540) * 11px);
  }

  .product-rating b {
    width: calc(var(--width540) * 10px);
    height: calc(var(--width540) * 10px);
    margin: 0 calc(var(--width540) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width540) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width540) * 24px);
    margin: calc(var(--width540) * 32px) auto calc(var(--width540) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width540) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width540) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width540) * 98px);
    padding: 0 calc(var(--width540) * 24px);
    height: calc(var(--width540) * 32px);
    border-radius: calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width540) * 9px);
    height: calc(var(--width540) * 5px);
    margin: 0 0 0 calc(var(--width540) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width540) * 88px);
    width: calc(var(--width540) * 88px);
    height: calc(var(--width540) * 28px);
    border-radius: calc(var(--width540) * 15px);
    font-size: calc(var(--width540) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width540) * 88px);
    width: calc(var(--width540) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width540) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width540) * 34px);
    border-radius: calc(var(--width540) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width540) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width540) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width540) * 8px);
    height: calc(var(--width540) * 34px);
    padding: 0 0 0 calc(var(--width540) * 7px);
    font-size: calc(var(--width540) * 16px);
    line-height: calc(var(--width540) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width540) * 18px);
    height: calc(var(--width540) * 18px);
    margin: 0 calc(var(--width540) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width540) * 4px);
    font-size: calc(var(--width540) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width540) * 11px);
    height: calc(var(--width540) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width540) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width540) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width540) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width540) * 12px);
    padding: calc(var(--width540) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width540) * 16px);
    margin-bottom: calc(var(--width540) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width540) * 14px);
    max-height: calc(var(--width540) * 20px);
    line-height: calc(var(--width540) * 18px);
    margin-bottom: calc(var(--width540) * 3px);
  }

  .article-tags {
    gap: calc(var(--width540) * 6px);
    margin-top: calc(var(--width540) * 4px);
  }

  .article-tag {
    padding: calc(var(--width540) * 1px) calc(var(--width540) * 8px);
    border-radius: calc(var(--width540) * 11px);
    font-size: calc(var(--width540) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width540) * 1px) calc(var(--width540) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width540) * 3px) calc(var(--width540) * 8px);
    font-size: calc(var(--width540) * 12px);
    border-radius: calc(var(--width540) * 12px);
  }

  .article-info {
    font-size: calc(var(--width540) * 12px);
    gap: calc(var(--width540) * 10px);
  }

  .article-thumb {
    width: calc(var(--width540) * 148px);
    height: calc(var(--width540) * 88px);
    border-radius: calc(var(--width540) * 6px);
    margin-top: calc(var(--width540) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width540) * 88px);
    height: calc(var(--width540) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width540) * 6px);
    height: calc(var(--width540) * 38px);
    margin-top: calc(var(--width540) * 16px);
    border-radius: calc(var(--width540) * 21px);
    font-size: calc(var(--width540) * 16px);
  }

  .icon-more {
    width: calc(var(--width540) * 16px);
    height: calc(var(--width540) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width540) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width540) * 3px) 0 0;
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width540) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width540) * 10px);
    padding: calc(var(--width540) * 12px) 0;
    font-size: calc(var(--width540) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width540) * 16px);
    height: calc(var(--width540) * 16px);
    margin: 0 calc(var(--width540) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width540) * 12px);
    padding-top: calc(var(--width540) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width540) * 12px);
    padding: calc(var(--width540) * 7px) 0;
    font-size: calc(var(--width540) * 13px);
    border-radius: calc(var(--width540) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width540) * 4px);
    width: calc(var(--width540) * 10px);
    height: calc(var(--width540) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width540) * 12px);
    margin: calc(var(--width540) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width540) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width540) * 16px) calc(var(--width540) * 15px) 0 calc(var(--width540) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width540) * 8px);
    margin-bottom: calc(var(--width540) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width540) * 198px);
    padding: 0 0 0 calc(var(--width540) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width540) * 14px);
    margin-bottom: calc(var(--width540) * 10px);
  }

  .footer-social {
    gap: calc(var(--width540) * 12px);
  }

  .footer-social a {
    width: calc(var(--width540) * 32px);
    height: calc(var(--width540) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width540) * 28px);
    height: calc(var(--width540) * 28px);
  }

  .footer-links {
    padding: calc(var(--width540) * 28px) calc(var(--width540) * 15px) calc(var(--width540) * 15px) calc(var(--width540) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width540) * 16px);
    margin-bottom: calc(var(--width540) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width540) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width540) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width540) * 15px) 0 calc(var(--width540) * 15px);
    gap: calc(var(--width540) * 15px);
    border-radius: calc(var(--width540) * 12px);
    padding: calc(var(--width540) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width540) * 120px);
    height: calc(var(--width540) * 120px);
    border-radius: calc(var(--width540) * 4px);
    margin: 0;
    margin: calc(var(--width540) * 10px) 0 calc(var(--width540) * 10px) calc(var(--width540) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width540) * 106px);
    height: calc(var(--width540) * 106px);
    border-radius: calc(var(--width540) * 4px);
  }

  .foot-line {
    width: calc(var(--width540) * 2px);
    height: calc(var(--width540) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width540) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width540) * 14px);
    margin: calc(var(--width540) * 6px) 0 calc(var(--width540) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width540) * 152px);
    height: calc(var(--width540) * 32px);
    padding: 0 calc(var(--width540) * 12px);
    border-radius: calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width540) * 14px) 0 calc(var(--width540) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width540) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width540) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width540) * 4px);
  }

  .gh {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width540) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width540) * 33px) 0 calc(var(--width540) * 26px);
  }

  .search-hero {
    padding: calc(var(--width540) * 20px) 0 calc(var(--width540) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width540) * 70px) 0 calc(var(--width540) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width540) * 14px);
  }

  .search-brand img {
    height: calc(var(--width540) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width540) * 14px);
    border-radius: calc(var(--width540) * 24px);
    padding: calc(var(--width540) * 3px) calc(var(--width540) * 3px) calc(var(--width540) * 3px) 0;
    height: calc(var(--width540) * 32px);
    box-shadow: 0 calc(var(--width540) * 2px) calc(var(--width540) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width540) * 12px) 0 calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width540) * 12px);
    height: calc(var(--width540) * 28px);
    border-radius: calc(var(--width540) * 19px);
    font-size: calc(var(--width540) * 12px);
  }

  .search-submit b {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
    margin: 0 calc(var(--width540) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width540) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width540) * 14px);
    line-height: calc(var(--width540) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width540) * 10px);
    max-height: calc(var(--width540) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width540) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 7px);
  }

  .search-main {
    padding: calc(var(--width540) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width540) * -32px));
    margin: 0 0 calc(var(--width540) * 17px) 0;
    padding: 0  calc(var(--width540) * 22px);
    height: calc(var(--width540) * 42px);
    box-shadow: 0 0 calc(var(--width540) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width540) * 8px);
    gap: calc(var(--width540) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width540) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width540) * 6px);
    width: calc(var(--width540) * 16px);
    height: calc(var(--width540) * 2px);
  }

  .search-right {
    font-size: calc(var(--width540) * 12px);
    margin: calc(var(--width540) * 12px) 0 calc(var(--width540) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width540) * 13px);
  }

  .empty-state {
    padding: calc(var(--width540) * 70px) 0 calc(var(--width540) * 68px);
  }

  .empty-img {
    width: calc(var(--width540) * 259px);
    margin: 0 auto calc(var(--width540) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width540) * 14px);
    margin: 0 auto calc(var(--width540) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width540) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width540) * 16px) 0 calc(var(--width540) * 32px);
  }

  .pagination {
    gap: calc(var(--width540) * 12px);
    margin-top: calc(var(--width540) * 20px);
  }

  .page-btns {
    gap: calc(var(--width540) * 10px) calc(var(--width540) * 4px);
  }

  .page-extra {
    gap: calc(var(--width540) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width540) * 32px);
    height: calc(var(--width540) * 32px);
    padding: 0 calc(var(--width540) * 8px);
    border-radius: calc(var(--width540) * 4px);
    font-size: calc(var(--width540) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width540) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width540) * 2px);
    font-size: calc(var(--width540) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width540) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width540) * 36px);
    height: calc(var(--width540) * 28px);
    border-radius: calc(var(--width540) * 6px);
    font-size: calc(var(--width540) * 12px);
    margin: 0 calc(var(--width540) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width540) * 14px);
    height: calc(var(--width540) * 28px);
    margin-left: calc(var(--width540) * 4px);
    border-radius: calc(var(--width540) * 3px);
    font-size: calc(var(--width540) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width540) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width540) * 27px);
    padding: calc(var(--width540) * 12px) calc(var(--width540) * 15px) 0 calc(var(--width540) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width540) * 4px);
    min-width: calc(var(--width540) * 68px);
    padding: 0;
    font-size: calc(var(--width540) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width540) * 20px);
    height: calc(var(--width540) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width540) * 20px);
    height: calc(var(--width540) * 3px);
    border-radius: calc(var(--width540) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width540) * 8px);
    padding: calc(var(--width540) * 15px) calc(var(--width540) * 12px) calc(var(--width540) * 10px) calc(var(--width540) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width540) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width540) * 32px);
    padding: 0 calc(var(--width540) * 12px);
    border-radius: calc(var(--width540) * 8px);
    font-size: calc(var(--width540) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width540) * 40px);
    gap: calc(var(--width540) * 2px);
    font-size: calc(var(--width540) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width540) * 18px);
    height: calc(var(--width540) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width540) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width540) * 8px);
    padding: calc(var(--width540) * 8px) calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width540) * 2px);
    height: calc(var(--width540) * 40px);
    border-radius: calc(var(--width540) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width540) * 18px);
    height: calc(var(--width540) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width540) * 10px);
    height: calc(var(--width540) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width540) * 4px) 0 calc(var(--width540) * 8px);
    gap: calc(var(--width540) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width540) * 7px) calc(var(--width540) * 3px);
    font-size: calc(var(--width540) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width540) * 26px);
    width: calc(var(--width540) * 6px);
    height: calc(var(--width540) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width540) * 18px);
    height: calc(var(--width540) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width540) * 10px);
    height: calc(var(--width540) * 12px);
    margin: 0 calc(var(--width540) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width540) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width540) * 12px) 0 calc(var(--width540) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width540) * 14px) calc(var(--width540) * 14px) calc(var(--width540) * 14px) calc(var(--width540) * 16px);
    margin: calc(var(--width540) * 12px) 0 calc(var(--width540) * 14px);
    border-radius: calc(var(--width540) * 10px);
    min-height: calc(var(--width540) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width540) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width540) * 14px);
    line-height: calc(var(--width540) * 18px);
    margin: calc(var(--width540) * 6px) 0 calc(var(--width540) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width540) * 12px);
    gap: calc(var(--width540) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width540) * 3px) 0 0;
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width540) * 3px) 0 0;
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width540) * 4px);
    padding: 0 0 calc(var(--width540) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width540) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width540) * 12px);
    margin-bottom: calc(var(--width540) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width540) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width540) * 10px) calc(var(--width540) * 15px) calc(var(--width540) * 12px) calc(var(--width540) * 15px);
    margin: calc(var(--width540) * 24px) 0 calc(var(--width540) * 16px);
    border-radius: calc(var(--width540) * 10px);
    min-height: calc(var(--width540) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width540) * 8px);
    min-width: 0;
    margin: calc(var(--width540) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width540) * 72px);
    height: calc(var(--width540) * 28px);
    padding: 0 calc(var(--width540) * 12px);
    border-radius: calc(var(--width540) * 14px);
    font-size: calc(var(--width540) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width540) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width540) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width540) * 24px);
    height: calc(var(--width540) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width540) * 15px) calc(var(--width540) * 12px) 0 calc(var(--width540) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width540) * 10px);
    margin-left: calc(var(--width540) * 2px);
  }

  .banner-img {
    width: calc(var(--width540) * 80px);
    height: calc(var(--width540) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width540) * 48px);
    padding: 0 calc(var(--width540) * 18px);
  }

  .catalog-back {
    left: calc(var(--width540) * 8px);
    width: calc(var(--width540) * 36px);
    height: calc(var(--width540) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width540) * 20px);
    height: calc(var(--width540) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width540) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width540) * 16px) calc(var(--width540) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width540) * 18px);
    margin: 0 0 calc(var(--width540) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width540) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width540) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width540) * 8px);
    box-shadow: 0 0 calc(var(--width540) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width540) * 4px);
    padding: calc(var(--width540) * 12px) calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width540) * 20px);
    height: calc(var(--width540) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width540) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width540) * 6px);
    height: calc(var(--width540) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width540) * 12px) calc(var(--width540) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width540) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width540) * 34px);
    padding: 0 calc(var(--width540) * 6px);
    border-radius: calc(var(--width540) * 8px);
    font-size: calc(var(--width540) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width540) * 16px) calc(var(--width540) * 10px);
    padding-bottom: calc(var(--width540) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width540) * 6px);
    min-width: 0;
    font-size: calc(var(--width540) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width540) * 18px);
    height: calc(var(--width540) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width540) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width540) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width540) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width540) * 120px);
    height: calc(var(--width540) * 68px);
    border-radius: calc(var(--width540) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width540) * 16px);
    min-height: calc(var(--width540) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width540) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width540) * 12px) 0 calc(var(--width540) * 10px);
    gap: calc(var(--width540) * 6px);
    font-size: calc(var(--width540) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width540) * 14px);
    height: calc(var(--width540) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width540) * 12px);
    margin: 0;
    padding: calc(var(--width540) * 16px);
    border-radius: calc(var(--width540) * 12px);
    box-shadow: 0 calc(var(--width540) * 2px) calc(var(--width540) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width540) * 206px);
    border-radius: calc(var(--width540) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width540) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width540) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width540) * 16px);
    margin: calc(var(--width540) * 4px) 0 calc(var(--width540) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width540) * 20px);
    font-size: calc(var(--width540) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width540) * 8px);
    margin-top: calc(var(--width540) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width540) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width540) * 2px) calc(var(--width540) * 10px);
    border-radius: calc(var(--width540) * 999px);
    font-size: calc(var(--width540) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width540) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width540) * 8px);
    padding: calc(var(--width540) * 10px) calc(var(--width540) * 15px) calc(var(--width540) * 16px) calc(var(--width540) * 15px);
    margin-bottom: calc(var(--width540) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width540) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width540) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width540) * 10px);
    padding: calc(var(--width540) * 10px) 0;
    font-size: calc(var(--width540) * 13px);
  }

  .widget-icon {
    width: calc(var(--width540) * 18px);
    height: calc(var(--width540) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width540) * 48px);
    height: calc(var(--width540) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width540) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width540) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width540) * 120px);
    height: calc(var(--width540) * 68px);
    border-radius: calc(var(--width540) * 4px);
    margin: 0 calc(var(--width540) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width540) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width540) * 16px);
    line-height: calc(var(--width540) * 18px);
    min-height: calc(var(--width540) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 12px);
    line-height: calc(var(--width540) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width540) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width540) * 14px);
    height: calc(var(--width540) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width540) * 14px);
    height: calc(var(--width540) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width540) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width540) * 110px);
    height: calc(var(--width540) * 62px);
    border-radius: calc(var(--width540) * 4px);
    margin: 0 calc(var(--width540) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width540) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width540) * 16px);
    line-height: calc(var(--width540) * 18px);
    min-height: calc(var(--width540) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 12px);
    line-height: calc(var(--width540) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width540) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width540) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width540) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width540) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width540) * 48px);
    height: calc(var(--width540) * 48px);
    border-radius: calc(var(--width540) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width540) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width540) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width540) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width540) * 2px);
    width: calc(var(--width540) * 68px);
    height: calc(var(--width540) * 27px);
    padding: 0;
    border-radius: calc(var(--width540) * 14px);
    font-size: calc(var(--width540) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width540) * 11px);
    height: calc(var(--width540) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width540) * 16px);
    padding: 0 0 0 calc(var(--width540) * 18px);
    font-size: calc(var(--width540) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width540) * 4px);
    height: calc(var(--width540) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width540) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width540) * 12px);
    padding: calc(var(--width540) * 8px) 0;
    font-size: calc(var(--width540) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width540) * 8px);
  }

  .widget-links {
    gap: calc(var(--width540) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width540) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width540) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width540) * 6px) 0 calc(var(--width540) * 6px);
    font-size: calc(var(--width540) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width540) * 12px) 0;
    font-size: calc(var(--width540) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width540) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width540) * 72px);
    padding-left: calc(var(--width540) * 16px);
    padding-right: calc(var(--width540) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width540) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width540) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width540) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width540) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width540) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width540) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width540) * 16px);
    font-size: calc(var(--width540) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width540) * 4px) calc(var(--width540) * 8px);
    border-radius: calc(var(--width540) * 4px);
    font-size: calc(var(--width540) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width540) * 16px) 0 calc(var(--width540) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width540) * 16px) 0 calc(var(--width540) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width540) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width540) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width540) * 12px) 0 calc(var(--width540) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width540) * 21px);
    margin-bottom: calc(var(--width540) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width540) * 8px);
    padding-bottom: calc(var(--width540) * 7px);
    margin-bottom: calc(var(--width540) * 10px);
  }

  .author-avatar {
    width: calc(var(--width540) * 36px);
    height: calc(var(--width540) * 36px);
    margin: 0 calc(var(--width540) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width540) * 12px);
    gap: calc(var(--width540) * 4px);
    margin: calc(var(--width540) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width540) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width540) * 2px) calc(var(--width540) * 10px);
    border-radius: calc(var(--width540) * 3px);
    font-size: calc(var(--width540) * 12px);
    margin-top: calc(var(--width540) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width540) * 15px);
    margin-bottom: calc(var(--width540) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width540) * 22px);
    margin: calc(var(--width540) * 18px) 0 calc(var(--width540) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width540) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width540) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width540) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width540) * 12px);
    margin-top: calc(var(--width540) * 6px);
  }

  .artcona {
    margin: calc(var(--width540) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width540) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width540) * 16px);
  }

  .box-title {
    font-size: calc(var(--width540) * 18px);
    margin-bottom: calc(var(--width540) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width540) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width540) * 14px);
    padding: calc(var(--width540) * 15px) calc(var(--width540) * 18px);
    border-radius: 0 calc(var(--width540) * 8px) calc(var(--width540) * 8px) 0;
    margin-bottom: calc(var(--width540) * 14px);
    line-height: calc(var(--width540) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width540) * 2px);
    border-radius: calc(var(--width540) * 2px) 0 0 calc(var(--width540) * 2px);
  }

  .related-list {
    gap: calc(var(--width540) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width540) * 8px);
    font-size: calc(var(--width540) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width540) * 4px);
    height: calc(var(--width540) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width540) * 12px);
    padding: calc(var(--width540) * 14px);
    box-shadow: 0 0 calc(var(--width540) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width540) * 8px);
    margin-bottom: calc(var(--width540) * 16px);
  }

  .tool-icon {
    width: calc(var(--width540) * 56px);
    height: calc(var(--width540) * 56px);
    border-radius: calc(var(--width540) * 8px);
    margin: 0 calc(var(--width540) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width540) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width540) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width540) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width540) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width540) * 10px);
    margin: calc(var(--width540) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width540) * 2px);
    height: calc(var(--width540) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width540) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width540) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width540) * 4px);
    font-size: calc(var(--width540) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width540) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width540) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width540) * 88px);
    height: calc(var(--width540) * 26px);
    border-radius: calc(var(--width540) * 17px);
    font-size: calc(var(--width540) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width540) * 88px);
    height: calc(var(--width540) * 26px);
    border-radius: calc(var(--width540) * 17px);
    gap: calc(var(--width540) * 4px);
    font-size: calc(var(--width540) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width540) * 13px);
    height: calc(var(--width540) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width540) * 12px);
    padding: calc(var(--width540) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width540) * 101px);
    height: calc(var(--width540) * 101px);
    border-radius: calc(var(--width540) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width540) * 88px);
    height: calc(var(--width540) * 88px);
    border-radius: calc(var(--width540) * 8px);
    padding: calc(var(--width540) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width540) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width540) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width540) * 162px);
    height: calc(var(--width540) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width540) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width540) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width540) * 4px);
    font-size: calc(var(--width540) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width540) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width540) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width540) * 1px) calc(var(--width540) * 8px);
    border-radius: calc(var(--width540) * 11px);
    font-size: calc(var(--width540) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width540) * 26px);
    padding: 0 calc(var(--width540) * 14px);
    border-radius: calc(var(--width540) * 13px);
    font-size: calc(var(--width540) * 12px);
    gap: calc(var(--width540) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width540) * 14px);
    height: calc(var(--width540) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width540) * 8px) calc(var(--width540) * 20px);
    font-size: calc(var(--width540) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width540) * 10px);
    margin-bottom: calc(var(--width540) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width540) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width540) * 10px);
    margin-bottom: calc(var(--width540) * 16px);
    border-radius: calc(var(--width540) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width540) * 16px);
    margin: 0 0 calc(var(--width540) * 10px);
  }

  .declared {
    border-radius: calc(var(--width540) * 8px);
    padding: calc(var(--width540) * 16px) calc(var(--width540) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width540) * 90px);
    height: calc(var(--width540) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width540) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width540) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width540) * 14px);
    line-height: calc(var(--width540) * 20px);
    margin: 0 0 calc(var(--width540) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width540) * 10px);
    font-size: calc(var(--width540) * 13px);
    margin: 0 0 calc(var(--width540) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width540) * 8px) calc(var(--width540) * 16px);
    min-height: calc(var(--width540) * 38px);
    box-shadow: 0 0 calc(var(--width540) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width540) * 8px);
    gap: calc(var(--width540) * 4px);
    font-size: calc(var(--width540) * 12px);
  }

  .author-list {
    gap: calc(var(--width540) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width540) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width540) * 10px);
    font-size: calc(var(--width540) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width540) * 4px);
    height: calc(var(--width540) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width540) * 3px);
    font-size: calc(var(--width540) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width540) * 26px);
  }

  .detail-products {
    margin: calc(var(--width540) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width540) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width540) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width540) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width540) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width540) * 3px);
    height: calc(var(--width540) * 14px);
    margin-right: calc(var(--width540) * 8px);
    margin-top: calc(var(--width540) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width540) * 8px) 0 0;
    width: calc(var(--width540) * 12px);
    height: calc(var(--width540) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width540) * 16px);
    margin: calc(var(--width540) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width540) * 15px);
    margin: calc(var(--width540) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width540) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width540) * 6px) calc(var(--width540) * 8px);
    font-size: calc(var(--width540) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width540) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width540) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width540) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width540) * 5px) calc(var(--width540) * 10px);
    font-size: calc(var(--width540) * 12px);
    border-radius: calc(var(--width540) * 5px);
    top: calc(var(--width540) * 5px);
    right: calc(var(--width540) * 5px);
    margin-bottom: calc(var(--width540) * -35px);
  }

  .artcons img {
    height: calc(var(--width540) * 506px);
    border-radius: calc(var(--width540) * 8px);
  }
   .detail-content ol{margin-left:calc(var(--width540) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width540) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width540) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width540) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width540) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width540) * 26px);
    font-size: calc(var(--width540) * 16px);
    margin: calc(var(--width540) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width540) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width540) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width540) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width540) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width540) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width540) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width540) * 120px);
  }

  .artcons {
    font-size: calc(var(--width540) * 16px);
  }

}

@media screen and (max-width: 516px) {
  :root {
    --radius-sm: calc(var(--width516) * 4px);
    --radius-md: calc(var(--width516) * 8px);
    --radius-lg: calc(var(--width516) * 24px);
    --page-pad: calc(var(--width516) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width516) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width516) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width516) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width516) * 48px);
    padding: calc(var(--width516) * 10px) calc(var(--width516) * 16px) calc(var(--width516) * 10px) calc(var(--width516) * 13px);
    box-shadow: 0 0 calc(var(--width516) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width516) * 8px);
    font-size: calc(var(--width516) * 18px);
  }

  .logo-img {
    width: calc(var(--width516) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width516) * 14px);
    margin-left: calc(var(--width516) * 4px);
  }

  .header-actions {
    gap: calc(var(--width516) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width516) * 18px);
    height: calc(var(--width516) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width516) * 320px);
    box-shadow: calc(var(--width516) * -4px) 0 calc(var(--width516) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width516) * 52px);
    padding: 0 calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width516) * 20px);
    height: calc(var(--width516) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width516) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width516) * 14px) calc(var(--width516) * 20px);
    font-size: calc(var(--width516) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width516) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width516) * 48px);
    padding: 0 calc(var(--width516) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width516) * 8px);
    width: calc(var(--width516) * 36px);
    height: calc(var(--width516) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width516) * 20px);
    height: calc(var(--width516) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width516) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width516) * 16px) calc(var(--width516) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width516) * 8px);
    height: calc(var(--width516) * 44px);
    padding: 0 calc(var(--width516) * 16px);
    margin: 0 0 calc(var(--width516) * 18px);
    border-radius: calc(var(--width516) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width516) * 18px);
    height: calc(var(--width516) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width516) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width516) * 10px);
    margin: 0 0 calc(var(--width516) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width516) * 6px);
    min-height: calc(var(--width516) * 52px);
    padding: calc(var(--width516) * 12px) calc(var(--width516) * 16px);
    box-shadow: 0 0 calc(var(--width516) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width516) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width516) * 20px);
    height: calc(var(--width516) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width516) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width516) * 6px);
    height: calc(var(--width516) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width516) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width516) * 6px);
    height: calc(var(--width516) * 44px);
    border-radius: calc(var(--width516) * 21px);
    font-size: calc(var(--width516) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width516) * 16px);
    height: calc(var(--width516) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width516) * 14px);
    height: calc(var(--width516) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width516) * 16px) calc(var(--width516) * 16px) calc(var(--width516) * 26px);
  }

  .sechtitle {
    top: calc(var(--width516) * 12px);
    right: calc(var(--width516) * 12px);
    width: calc(var(--width516) * 36px);
    height: calc(var(--width516) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width516) * 22px);
    height: calc(var(--width516) * 22px);
  }

  .sechcon {
    margin: calc(var(--width516) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width516) * 20px);
    width: calc(var(--width516) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width516) * 198px);
  }

  .serchd {
    height: calc(var(--width516) * 46px);
    margin: 0 0 calc(var(--width516) * 18px);
    border-radius: calc(var(--width516) * 23px);
    padding: 0 calc(var(--width516) * 16px) 0 calc(var(--width516) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width516) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width516) * 36px);
    height: calc(var(--width516) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width516) * 20px);
    height: calc(var(--width516) * 20px);
  }

  .top-btn {
    gap: calc(var(--width516) * 8px);
  }

  .topbtna {
    height: calc(var(--width516) * 18px);
    padding: 0 calc(var(--width516) * 12px);
    border-radius: calc(var(--width516) * 11px);
    font-size: calc(var(--width516) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width516) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width516) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width516) * 6px);
    font-size: calc(var(--width516) * 32px);
    line-height: calc(var(--width516) * 36px);
    margin: calc(var(--width516) * 26px) 0 calc(var(--width516) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width516) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width516) * 6px) auto;
    letter-spacing: calc(var(--width516) * 4px);
    width: calc(var(--width516) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width516) * 12px);
    margin-bottom: calc(var(--width516) * 15px);
    letter-spacing: calc(var(--width516) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width516) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width516) * 98px);
    height: calc(var(--width516) * 32px);
    border-radius: calc(var(--width516) * 22px);
    font-size: calc(var(--width516) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width516) * 44px);
    width: calc(var(--width516) * 98px);
    height: calc(var(--width516) * 32px);
    border-radius: calc(var(--width516) * 26px);
    font-size: calc(var(--width516) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width516) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width516) * 12px);
  }

  .section-title {
    font-size: calc(var(--width516) * 18px);
  }

  .section-more {
    font-size: calc(var(--width516) * 14px);
  }

  .section-more b {
    width: calc(var(--width516) * 8px);
    height: calc(var(--width516) * 8px);
    margin: 0 0 0 calc(var(--width516) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width516) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width516) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width516) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width516) * 308px);
    border-radius: calc(var(--width516) * 5px);
    width: calc(var(--width516) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width516) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width516) * 8px);
    margin: calc(var(--width516) * 5px) calc(var(--width516) * 6px) 0 calc(var(--width516) * 10px);
    min-height: calc(var(--width516) * 56px);
    padding: 0 0 calc(var(--width516) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width516) * 3px);
    right: calc(var(--width516) * 3px);
    bottom: 0;
    height: calc(var(--width516) * 1px);
  }

  .card-icon {
    width: calc(var(--width516) * 40px);
    height: calc(var(--width516) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width516) * 14px);
    margin: 0 0 calc(var(--width516) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width516) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width516) * 6px);
    min-width: 0;
    font-size: calc(var(--width516) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width516) * 8px);
    height: calc(var(--width516) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width516) * 3px);
    height: calc(var(--width516) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width516) * 12px);
    margin: 0 0 calc(var(--width516) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width516) * 10px) calc(var(--width516) * 10px) calc(var(--width516) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width516) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width516) * 10px);
    font-size: calc(var(--width516) * 12px);
    width: calc(var(--width516) * 145px);
    height: calc(var(--width516) * 28px);
    border-radius: calc(var(--width516) * 14px);
  }

  .card-more b {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 9px);
    margin: 0 0 0 calc(var(--width516) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width516) * 4px);
    margin-top: calc(var(--width516) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width516) * 4px);
    height: calc(var(--width516) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width516) * 20px);
    border-radius: calc(var(--width516) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width516) * 14px) 0 calc(var(--width516) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width516) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width516) * 8px);
  }

  .tags-list {
    gap: calc(var(--width516) * 8px);
  }

  .tag {
    padding: calc(var(--width516) * 4px) calc(var(--width516) * 16px);
    border-radius: calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width516) * 12px);
    padding: calc(var(--width516) * 2px) calc(var(--width516) * 8px);
    border-radius: calc(var(--width516) * 12px);
  }

  .products-grid {
    gap: calc(var(--width516) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width516) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width516) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width516) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width516) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width516) * 16px);
    gap: calc(var(--width516) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width516) * 4px);
    height: calc(var(--width516) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width516) * 20px);
    border-radius: calc(var(--width516) * 2px);
  }

  .product-card {
    padding: calc(var(--width516) * 10px);
    min-width: 0;
    border-radius: calc(var(--width516) * 8px);
    box-shadow: 0 0 calc(var(--width516) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width516) * 10px);
    top: calc(var(--width516) * 8px);
    left: calc(var(--width516) * 10px);
    gap: calc(var(--width516) * 3px);
    max-width: calc(100% - calc(var(--width516) * 36px));
  }

  .tagsa {
    padding: calc(var(--width516) * 1px) calc(var(--width516) * 5px);
    font-size: calc(var(--width516) * 10px);
    border-radius: calc(var(--width516) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width516) * 1px) calc(var(--width516) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width516) * 8px);
    margin: calc(var(--width516) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width516) * 16px);
    margin: calc(var(--width516) * 7px) 0 calc(var(--width516) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width516) * 12px);
    margin-bottom: calc(var(--width516) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width516) * 11px);
  }

  .product-rating b {
    width: calc(var(--width516) * 10px);
    height: calc(var(--width516) * 10px);
    margin: 0 calc(var(--width516) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width516) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width516) * 24px);
    margin: calc(var(--width516) * 32px) auto calc(var(--width516) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width516) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width516) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width516) * 98px);
    padding: 0 calc(var(--width516) * 24px);
    height: calc(var(--width516) * 32px);
    border-radius: calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width516) * 9px);
    height: calc(var(--width516) * 5px);
    margin: 0 0 0 calc(var(--width516) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width516) * 88px);
    width: calc(var(--width516) * 88px);
    height: calc(var(--width516) * 28px);
    border-radius: calc(var(--width516) * 15px);
    font-size: calc(var(--width516) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width516) * 88px);
    width: calc(var(--width516) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width516) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width516) * 34px);
    border-radius: calc(var(--width516) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width516) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width516) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width516) * 8px);
    height: calc(var(--width516) * 34px);
    padding: 0 0 0 calc(var(--width516) * 7px);
    font-size: calc(var(--width516) * 16px);
    line-height: calc(var(--width516) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width516) * 18px);
    height: calc(var(--width516) * 18px);
    margin: 0 calc(var(--width516) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width516) * 4px);
    font-size: calc(var(--width516) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width516) * 11px);
    height: calc(var(--width516) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width516) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width516) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width516) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width516) * 12px);
    padding: calc(var(--width516) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width516) * 16px);
    margin-bottom: calc(var(--width516) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width516) * 14px);
    max-height: calc(var(--width516) * 20px);
    line-height: calc(var(--width516) * 18px);
    margin-bottom: calc(var(--width516) * 3px);
  }

  .article-tags {
    gap: calc(var(--width516) * 6px);
    margin-top: calc(var(--width516) * 4px);
  }

  .article-tag {
    padding: calc(var(--width516) * 1px) calc(var(--width516) * 8px);
    border-radius: calc(var(--width516) * 11px);
    font-size: calc(var(--width516) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width516) * 1px) calc(var(--width516) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width516) * 3px) calc(var(--width516) * 8px);
    font-size: calc(var(--width516) * 12px);
    border-radius: calc(var(--width516) * 12px);
  }

  .article-info {
    font-size: calc(var(--width516) * 12px);
    gap: calc(var(--width516) * 10px);
  }

  .article-thumb {
    width: calc(var(--width516) * 148px);
    height: calc(var(--width516) * 88px);
    border-radius: calc(var(--width516) * 6px);
    margin-top: calc(var(--width516) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width516) * 88px);
    height: calc(var(--width516) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width516) * 6px);
    height: calc(var(--width516) * 38px);
    margin-top: calc(var(--width516) * 16px);
    border-radius: calc(var(--width516) * 21px);
    font-size: calc(var(--width516) * 16px);
  }

  .icon-more {
    width: calc(var(--width516) * 16px);
    height: calc(var(--width516) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width516) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width516) * 3px) 0 0;
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width516) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width516) * 10px);
    padding: calc(var(--width516) * 12px) 0;
    font-size: calc(var(--width516) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width516) * 16px);
    height: calc(var(--width516) * 16px);
    margin: 0 calc(var(--width516) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width516) * 12px);
    padding-top: calc(var(--width516) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width516) * 12px);
    padding: calc(var(--width516) * 7px) 0;
    font-size: calc(var(--width516) * 13px);
    border-radius: calc(var(--width516) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width516) * 4px);
    width: calc(var(--width516) * 10px);
    height: calc(var(--width516) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width516) * 12px);
    margin: calc(var(--width516) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width516) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width516) * 16px) calc(var(--width516) * 15px) 0 calc(var(--width516) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width516) * 8px);
    margin-bottom: calc(var(--width516) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width516) * 198px);
    padding: 0 0 0 calc(var(--width516) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width516) * 14px);
    margin-bottom: calc(var(--width516) * 10px);
  }

  .footer-social {
    gap: calc(var(--width516) * 12px);
  }

  .footer-social a {
    width: calc(var(--width516) * 32px);
    height: calc(var(--width516) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width516) * 28px);
    height: calc(var(--width516) * 28px);
  }

  .footer-links {
    padding: calc(var(--width516) * 28px) calc(var(--width516) * 15px) calc(var(--width516) * 15px) calc(var(--width516) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width516) * 16px);
    margin-bottom: calc(var(--width516) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width516) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width516) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width516) * 15px) 0 calc(var(--width516) * 15px);
    gap: calc(var(--width516) * 15px);
    border-radius: calc(var(--width516) * 12px);
    padding: calc(var(--width516) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width516) * 120px);
    height: calc(var(--width516) * 120px);
    border-radius: calc(var(--width516) * 4px);
    margin: 0;
    margin: calc(var(--width516) * 10px) 0 calc(var(--width516) * 10px) calc(var(--width516) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width516) * 106px);
    height: calc(var(--width516) * 106px);
    border-radius: calc(var(--width516) * 4px);
  }

  .foot-line {
    width: calc(var(--width516) * 2px);
    height: calc(var(--width516) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width516) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width516) * 14px);
    margin: calc(var(--width516) * 6px) 0 calc(var(--width516) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width516) * 152px);
    height: calc(var(--width516) * 32px);
    padding: 0 calc(var(--width516) * 12px);
    border-radius: calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width516) * 14px) 0 calc(var(--width516) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width516) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width516) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width516) * 4px);
  }

  .gh {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width516) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width516) * 33px) 0 calc(var(--width516) * 26px);
  }

  .search-hero {
    padding: calc(var(--width516) * 20px) 0 calc(var(--width516) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width516) * 70px) 0 calc(var(--width516) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width516) * 14px);
  }

  .search-brand img {
    height: calc(var(--width516) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width516) * 14px);
    border-radius: calc(var(--width516) * 24px);
    padding: calc(var(--width516) * 3px) calc(var(--width516) * 3px) calc(var(--width516) * 3px) 0;
    height: calc(var(--width516) * 32px);
    box-shadow: 0 calc(var(--width516) * 2px) calc(var(--width516) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width516) * 12px) 0 calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width516) * 12px);
    height: calc(var(--width516) * 28px);
    border-radius: calc(var(--width516) * 19px);
    font-size: calc(var(--width516) * 12px);
  }

  .search-submit b {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
    margin: 0 calc(var(--width516) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width516) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width516) * 14px);
    line-height: calc(var(--width516) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width516) * 10px);
    max-height: calc(var(--width516) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width516) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 7px);
  }

  .search-main {
    padding: calc(var(--width516) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width516) * -32px));
    margin: 0 0 calc(var(--width516) * 17px) 0;
    padding: 0  calc(var(--width516) * 22px);
    height: calc(var(--width516) * 42px);
    box-shadow: 0 0 calc(var(--width516) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width516) * 8px);
    gap: calc(var(--width516) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width516) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width516) * 6px);
    width: calc(var(--width516) * 16px);
    height: calc(var(--width516) * 2px);
  }

  .search-right {
    font-size: calc(var(--width516) * 12px);
    margin: calc(var(--width516) * 12px) 0 calc(var(--width516) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width516) * 13px);
  }

  .empty-state {
    padding: calc(var(--width516) * 70px) 0 calc(var(--width516) * 68px);
  }

  .empty-img {
    width: calc(var(--width516) * 259px);
    margin: 0 auto calc(var(--width516) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width516) * 14px);
    margin: 0 auto calc(var(--width516) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width516) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width516) * 16px) 0 calc(var(--width516) * 32px);
  }

  .pagination {
    gap: calc(var(--width516) * 12px);
    margin-top: calc(var(--width516) * 20px);
  }

  .page-btns {
    gap: calc(var(--width516) * 10px) calc(var(--width516) * 4px);
  }

  .page-extra {
    gap: calc(var(--width516) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width516) * 32px);
    height: calc(var(--width516) * 32px);
    padding: 0 calc(var(--width516) * 8px);
    border-radius: calc(var(--width516) * 4px);
    font-size: calc(var(--width516) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width516) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width516) * 2px);
    font-size: calc(var(--width516) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width516) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width516) * 36px);
    height: calc(var(--width516) * 28px);
    border-radius: calc(var(--width516) * 6px);
    font-size: calc(var(--width516) * 12px);
    margin: 0 calc(var(--width516) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width516) * 14px);
    height: calc(var(--width516) * 28px);
    margin-left: calc(var(--width516) * 4px);
    border-radius: calc(var(--width516) * 3px);
    font-size: calc(var(--width516) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width516) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width516) * 27px);
    padding: calc(var(--width516) * 12px) calc(var(--width516) * 15px) 0 calc(var(--width516) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width516) * 4px);
    min-width: calc(var(--width516) * 68px);
    padding: 0;
    font-size: calc(var(--width516) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width516) * 20px);
    height: calc(var(--width516) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width516) * 20px);
    height: calc(var(--width516) * 3px);
    border-radius: calc(var(--width516) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width516) * 8px);
    padding: calc(var(--width516) * 15px) calc(var(--width516) * 12px) calc(var(--width516) * 10px) calc(var(--width516) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width516) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width516) * 32px);
    padding: 0 calc(var(--width516) * 12px);
    border-radius: calc(var(--width516) * 8px);
    font-size: calc(var(--width516) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width516) * 40px);
    gap: calc(var(--width516) * 2px);
    font-size: calc(var(--width516) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width516) * 18px);
    height: calc(var(--width516) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width516) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width516) * 8px);
    padding: calc(var(--width516) * 8px) calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width516) * 2px);
    height: calc(var(--width516) * 40px);
    border-radius: calc(var(--width516) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width516) * 18px);
    height: calc(var(--width516) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width516) * 10px);
    height: calc(var(--width516) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width516) * 4px) 0 calc(var(--width516) * 8px);
    gap: calc(var(--width516) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width516) * 7px) calc(var(--width516) * 3px);
    font-size: calc(var(--width516) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width516) * 26px);
    width: calc(var(--width516) * 6px);
    height: calc(var(--width516) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width516) * 18px);
    height: calc(var(--width516) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width516) * 10px);
    height: calc(var(--width516) * 12px);
    margin: 0 calc(var(--width516) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width516) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width516) * 12px) 0 calc(var(--width516) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width516) * 14px) calc(var(--width516) * 14px) calc(var(--width516) * 14px) calc(var(--width516) * 16px);
    margin: calc(var(--width516) * 12px) 0 calc(var(--width516) * 14px);
    border-radius: calc(var(--width516) * 10px);
    min-height: calc(var(--width516) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width516) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width516) * 14px);
    line-height: calc(var(--width516) * 18px);
    margin: calc(var(--width516) * 6px) 0 calc(var(--width516) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width516) * 12px);
    gap: calc(var(--width516) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width516) * 3px) 0 0;
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width516) * 3px) 0 0;
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width516) * 4px);
    padding: 0 0 calc(var(--width516) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width516) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width516) * 12px);
    margin-bottom: calc(var(--width516) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width516) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width516) * 10px) calc(var(--width516) * 15px) calc(var(--width516) * 12px) calc(var(--width516) * 15px);
    margin: calc(var(--width516) * 24px) 0 calc(var(--width516) * 16px);
    border-radius: calc(var(--width516) * 10px);
    min-height: calc(var(--width516) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width516) * 8px);
    min-width: 0;
    margin: calc(var(--width516) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width516) * 72px);
    height: calc(var(--width516) * 28px);
    padding: 0 calc(var(--width516) * 12px);
    border-radius: calc(var(--width516) * 14px);
    font-size: calc(var(--width516) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width516) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width516) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width516) * 24px);
    height: calc(var(--width516) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width516) * 15px) calc(var(--width516) * 12px) 0 calc(var(--width516) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width516) * 10px);
    margin-left: calc(var(--width516) * 2px);
  }

  .banner-img {
    width: calc(var(--width516) * 80px);
    height: calc(var(--width516) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width516) * 48px);
    padding: 0 calc(var(--width516) * 18px);
  }

  .catalog-back {
    left: calc(var(--width516) * 8px);
    width: calc(var(--width516) * 36px);
    height: calc(var(--width516) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width516) * 20px);
    height: calc(var(--width516) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width516) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width516) * 16px) calc(var(--width516) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width516) * 18px);
    margin: 0 0 calc(var(--width516) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width516) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width516) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width516) * 8px);
    box-shadow: 0 0 calc(var(--width516) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width516) * 4px);
    padding: calc(var(--width516) * 12px) calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width516) * 20px);
    height: calc(var(--width516) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width516) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width516) * 6px);
    height: calc(var(--width516) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width516) * 12px) calc(var(--width516) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width516) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width516) * 34px);
    padding: 0 calc(var(--width516) * 6px);
    border-radius: calc(var(--width516) * 8px);
    font-size: calc(var(--width516) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width516) * 16px) calc(var(--width516) * 10px);
    padding-bottom: calc(var(--width516) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width516) * 6px);
    min-width: 0;
    font-size: calc(var(--width516) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width516) * 18px);
    height: calc(var(--width516) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width516) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width516) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width516) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width516) * 120px);
    height: calc(var(--width516) * 68px);
    border-radius: calc(var(--width516) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width516) * 16px);
    min-height: calc(var(--width516) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width516) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width516) * 12px) 0 calc(var(--width516) * 10px);
    gap: calc(var(--width516) * 6px);
    font-size: calc(var(--width516) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width516) * 14px);
    height: calc(var(--width516) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width516) * 12px);
    margin: 0;
    padding: calc(var(--width516) * 16px);
    border-radius: calc(var(--width516) * 12px);
    box-shadow: 0 calc(var(--width516) * 2px) calc(var(--width516) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width516) * 206px);
    border-radius: calc(var(--width516) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width516) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width516) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width516) * 16px);
    margin: calc(var(--width516) * 4px) 0 calc(var(--width516) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width516) * 20px);
    font-size: calc(var(--width516) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width516) * 8px);
    margin-top: calc(var(--width516) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width516) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width516) * 2px) calc(var(--width516) * 10px);
    border-radius: calc(var(--width516) * 999px);
    font-size: calc(var(--width516) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width516) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width516) * 8px);
    padding: calc(var(--width516) * 10px) calc(var(--width516) * 15px) calc(var(--width516) * 16px) calc(var(--width516) * 15px);
    margin-bottom: calc(var(--width516) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width516) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width516) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width516) * 10px);
    padding: calc(var(--width516) * 10px) 0;
    font-size: calc(var(--width516) * 13px);
  }

  .widget-icon {
    width: calc(var(--width516) * 18px);
    height: calc(var(--width516) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width516) * 48px);
    height: calc(var(--width516) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width516) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width516) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width516) * 120px);
    height: calc(var(--width516) * 68px);
    border-radius: calc(var(--width516) * 4px);
    margin: 0 calc(var(--width516) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width516) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width516) * 16px);
    line-height: calc(var(--width516) * 18px);
    min-height: calc(var(--width516) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 12px);
    line-height: calc(var(--width516) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width516) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width516) * 14px);
    height: calc(var(--width516) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width516) * 14px);
    height: calc(var(--width516) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width516) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width516) * 110px);
    height: calc(var(--width516) * 62px);
    border-radius: calc(var(--width516) * 4px);
    margin: 0 calc(var(--width516) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width516) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width516) * 16px);
    line-height: calc(var(--width516) * 18px);
    min-height: calc(var(--width516) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 12px);
    line-height: calc(var(--width516) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width516) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width516) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width516) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width516) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width516) * 48px);
    height: calc(var(--width516) * 48px);
    border-radius: calc(var(--width516) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width516) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width516) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width516) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width516) * 2px);
    width: calc(var(--width516) * 68px);
    height: calc(var(--width516) * 27px);
    padding: 0;
    border-radius: calc(var(--width516) * 14px);
    font-size: calc(var(--width516) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width516) * 11px);
    height: calc(var(--width516) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width516) * 16px);
    padding: 0 0 0 calc(var(--width516) * 18px);
    font-size: calc(var(--width516) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width516) * 4px);
    height: calc(var(--width516) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width516) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width516) * 12px);
    padding: calc(var(--width516) * 8px) 0;
    font-size: calc(var(--width516) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width516) * 8px);
  }

  .widget-links {
    gap: calc(var(--width516) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width516) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width516) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width516) * 6px) 0 calc(var(--width516) * 6px);
    font-size: calc(var(--width516) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width516) * 12px) 0;
    font-size: calc(var(--width516) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width516) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width516) * 72px);
    padding-left: calc(var(--width516) * 16px);
    padding-right: calc(var(--width516) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width516) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width516) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width516) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width516) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width516) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width516) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width516) * 16px);
    font-size: calc(var(--width516) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width516) * 4px) calc(var(--width516) * 8px);
    border-radius: calc(var(--width516) * 4px);
    font-size: calc(var(--width516) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width516) * 16px) 0 calc(var(--width516) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width516) * 16px) 0 calc(var(--width516) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width516) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width516) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width516) * 12px) 0 calc(var(--width516) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width516) * 21px);
    margin-bottom: calc(var(--width516) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width516) * 8px);
    padding-bottom: calc(var(--width516) * 7px);
    margin-bottom: calc(var(--width516) * 10px);
  }

  .author-avatar {
    width: calc(var(--width516) * 36px);
    height: calc(var(--width516) * 36px);
    margin: 0 calc(var(--width516) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width516) * 12px);
    gap: calc(var(--width516) * 4px);
    margin: calc(var(--width516) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width516) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width516) * 2px) calc(var(--width516) * 10px);
    border-radius: calc(var(--width516) * 3px);
    font-size: calc(var(--width516) * 12px);
    margin-top: calc(var(--width516) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width516) * 15px);
    margin-bottom: calc(var(--width516) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width516) * 22px);
    margin: calc(var(--width516) * 18px) 0 calc(var(--width516) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width516) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width516) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width516) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width516) * 12px);
    margin-top: calc(var(--width516) * 6px);
  }

  .artcona {
    margin: calc(var(--width516) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width516) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width516) * 16px);
  }

  .box-title {
    font-size: calc(var(--width516) * 18px);
    margin-bottom: calc(var(--width516) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width516) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width516) * 14px);
    padding: calc(var(--width516) * 15px) calc(var(--width516) * 18px);
    border-radius: 0 calc(var(--width516) * 8px) calc(var(--width516) * 8px) 0;
    margin-bottom: calc(var(--width516) * 14px);
    line-height: calc(var(--width516) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width516) * 2px);
    border-radius: calc(var(--width516) * 2px) 0 0 calc(var(--width516) * 2px);
  }

  .related-list {
    gap: calc(var(--width516) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width516) * 8px);
    font-size: calc(var(--width516) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width516) * 4px);
    height: calc(var(--width516) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width516) * 12px);
    padding: calc(var(--width516) * 14px);
    box-shadow: 0 0 calc(var(--width516) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width516) * 8px);
    margin-bottom: calc(var(--width516) * 16px);
  }

  .tool-icon {
    width: calc(var(--width516) * 56px);
    height: calc(var(--width516) * 56px);
    border-radius: calc(var(--width516) * 8px);
    margin: 0 calc(var(--width516) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width516) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width516) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width516) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width516) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width516) * 10px);
    margin: calc(var(--width516) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width516) * 2px);
    height: calc(var(--width516) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width516) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width516) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width516) * 4px);
    font-size: calc(var(--width516) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width516) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width516) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width516) * 88px);
    height: calc(var(--width516) * 26px);
    border-radius: calc(var(--width516) * 17px);
    font-size: calc(var(--width516) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width516) * 88px);
    height: calc(var(--width516) * 26px);
    border-radius: calc(var(--width516) * 17px);
    gap: calc(var(--width516) * 4px);
    font-size: calc(var(--width516) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width516) * 13px);
    height: calc(var(--width516) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width516) * 12px);
    padding: calc(var(--width516) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width516) * 101px);
    height: calc(var(--width516) * 101px);
    border-radius: calc(var(--width516) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width516) * 88px);
    height: calc(var(--width516) * 88px);
    border-radius: calc(var(--width516) * 8px);
    padding: calc(var(--width516) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width516) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width516) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width516) * 162px);
    height: calc(var(--width516) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width516) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width516) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width516) * 4px);
    font-size: calc(var(--width516) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width516) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width516) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width516) * 1px) calc(var(--width516) * 8px);
    border-radius: calc(var(--width516) * 11px);
    font-size: calc(var(--width516) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width516) * 26px);
    padding: 0 calc(var(--width516) * 14px);
    border-radius: calc(var(--width516) * 13px);
    font-size: calc(var(--width516) * 12px);
    gap: calc(var(--width516) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width516) * 14px);
    height: calc(var(--width516) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width516) * 8px) calc(var(--width516) * 20px);
    font-size: calc(var(--width516) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width516) * 10px);
    margin-bottom: calc(var(--width516) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width516) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width516) * 10px);
    margin-bottom: calc(var(--width516) * 16px);
    border-radius: calc(var(--width516) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width516) * 16px);
    margin: 0 0 calc(var(--width516) * 10px);
  }

  .declared {
    border-radius: calc(var(--width516) * 8px);
    padding: calc(var(--width516) * 16px) calc(var(--width516) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width516) * 90px);
    height: calc(var(--width516) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width516) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width516) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width516) * 14px);
    line-height: calc(var(--width516) * 20px);
    margin: 0 0 calc(var(--width516) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width516) * 10px);
    font-size: calc(var(--width516) * 13px);
    margin: 0 0 calc(var(--width516) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width516) * 8px) calc(var(--width516) * 16px);
    min-height: calc(var(--width516) * 38px);
    box-shadow: 0 0 calc(var(--width516) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width516) * 8px);
    gap: calc(var(--width516) * 4px);
    font-size: calc(var(--width516) * 12px);
  }

  .author-list {
    gap: calc(var(--width516) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width516) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width516) * 10px);
    font-size: calc(var(--width516) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width516) * 4px);
    height: calc(var(--width516) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width516) * 3px);
    font-size: calc(var(--width516) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width516) * 26px);
  }

  .detail-products {
    margin: calc(var(--width516) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width516) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width516) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width516) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width516) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width516) * 3px);
    height: calc(var(--width516) * 14px);
    margin-right: calc(var(--width516) * 8px);
    margin-top: calc(var(--width516) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width516) * 8px) 0 0;
    width: calc(var(--width516) * 12px);
    height: calc(var(--width516) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width516) * 16px);
    margin: calc(var(--width516) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width516) * 15px);
    margin: calc(var(--width516) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width516) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width516) * 6px) calc(var(--width516) * 8px);
    font-size: calc(var(--width516) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width516) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width516) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width516) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width516) * 5px) calc(var(--width516) * 10px);
    font-size: calc(var(--width516) * 12px);
    border-radius: calc(var(--width516) * 5px);
    top: calc(var(--width516) * 5px);
    right: calc(var(--width516) * 5px);
    margin-bottom: calc(var(--width516) * -35px);
  }

  .artcons img {
    height: calc(var(--width516) * 506px);
    border-radius: calc(var(--width516) * 8px);
  }
  .detail-content ol{margin-left:calc(var(--width516) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width516) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width516) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width516) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width516) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width516) * 26px);
    font-size: calc(var(--width516) * 16px);
    margin: calc(var(--width516) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width516) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width516) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width516) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width516) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width516) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width516) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width516) * 120px);
  }

  .artcons {
    font-size: calc(var(--width516) * 16px);
  }

}

@media screen and (max-width: 501px) {

}

@media screen and (max-width: 431px) {
  :root {
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 24px;
    --page-pad: 15px;
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: 14px;
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: 32px;
  }

  .site-header {
    top: 0;
    box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.06);
  }

  .header-inner {
    height: 48px;
    padding: 10px 16px 10px 13px;
    box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.06);
  }

  .logo {
    gap: 8px;
    font-size: 18px;
  }

  .logo-img {
    width: 150px;
  }

  .logo-text em {
    font-size: 14px;
    margin-left: 4px;
  }

  .header-actions {
    gap: 16px;
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: 18px;
    height: 18px;
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: 320px;
    box-shadow: -4px 0 24px rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: 52px;
    padding: 0 16px;
    font-size: 16px;
  }

  .m-nav-close b {
    width: 20px;
    height: 20px;
  }

  .m-nav-list {
    padding: 12px 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: 14px 20px;
    font-size: 15px;
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 40px;
  }

  .site-nav-hd {
    top: 0;
    height: 48px;
    padding: 0 16px;
  }

  .site-nav-back {
    left: 8px;
    width: 36px;
    height: 36px;
  }

  .site-nav-back b {
    width: 20px;
    height: 19px;
  }

  .site-nav-title {
    margin: 0;
    font-size: 21px;
  }

  .site-nav-body {
    padding: 16px 16px 0;
  }

  .site-nav-search {
    gap: 8px;
    height: 44px;
    padding: 0 16px;
    margin: 0 0 18px;
    border-radius: 23px;
  }

  .site-nav-search b {
    width: 18px;
    height: 18px;
  }

  .site-nav-search span {
    min-width: 0;
    font-size: 16px;
  }

  .site-nav-list {
    gap: 10px;
    margin: 0 0 50px;
  }

  .site-nav-item {
    gap: 6px;
    min-height: 52px;
    padding: 12px 16px;
    box-shadow: 0px 0px 4px 0px #F3EEFC;
    border-radius: 10px;
  }

  .site-nav-item img {
    width: 20px;
    height: 20px;
  }

  .site-nav-item span {
    min-width: 0;
    font-size: 16px;
  }

  .site-nav-item i {
    width: 6px;
    height: 12px;
  }

  .site-nav-actions {
    gap: 16px;
  }

  .site-nav-login,
  .site-nav-trial {
    gap: 6px;
    height: 44px;
    border-radius: 21px;
    font-size: 16px;
  }

  .site-nav-login b {
    width: 16px;
    height: 16px;
  }

  .site-nav-trial b {
    width: 14px;
    height: 14px;
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: 16px 16px 26px;
  }

  .sechtitle {
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
  }

  .sechtitle b {
    width: 22px;
    height: 22px;
  }

  .sechcon {
    margin: 42px 0 0;
  }

  .sechconlogoa {
    margin: 0 auto 20px;
    width: 198px;
  }

  .sechconlogoa img {
    width: 198px;
  }

  .serchd {
    height: 46px;
    margin: 0 0 18px;
    border-radius: 23px;
    padding: 0 16px 0 16px;
  }

  .serchd input {
    min-width: 0;
    font-size: 16px;
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: 20px;
    height: 20px;
  }

  .top-btn {
    gap: 8px;
  }

  .topbtna {
    height: 18px;
    padding: 0 12px;
    border-radius: 11px;
    font-size: 10px;
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: 8px;
  }

  .hero-inner {
    min-height: 243px;
  }

  .hero-title {
    letter-spacing: 6px;
    font-size: 32px;
    line-height: 36px;
    margin: 26px 0 6px;
  }

  .hero-title span:nth-child(1) {
    letter-spacing: 5px;
  }

  .hero-title .highlight {
    margin: 6px auto;
    letter-spacing: 4px;
    width: 210px;
  }

  .hero-subtitle {
    font-size: 12px;
    margin-bottom: 15px;
    letter-spacing: 0.5px;
  }

  .hero-btns {
    gap: 12px;
  }

  .btn-primary {
    max-width: 98px;
    height: 32px;
    border-radius: 22px;
    font-size: 12px;
  }

  .btn-outline {
    --border-radius: 44px;
    width: 98px;
    height: 32px;
    border-radius: 26px;
    font-size: 12px;
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: 26px;
  }

  .section-header {
    margin-bottom: 12px;
  }

  .section-title {
    font-size: 18px;
  }

  .section-more {
    font-size: 14px;
  }

  .section-more b {
    width: 8px;
    height: 8px;
    margin: 0 0 0 3px;
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) 4px;
  }

  .curriculum-grid {
    gap: 10px;
  }

  .curriculum-card {
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.1);
    min-height: 308px;
    border-radius: 5px;
    width: 165px;
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: 28px 0 0 0;
  }

  .card-head {
    gap: 8px;
    margin: 5px 6px 0 10px;
    min-height: 56px;
    padding: 0 0 10px 0;
  }

  .card-head::after {
    left: 3px;
    right: 3px;
    bottom: 0;
    height: 1px;
  }

  .card-icon {
    width: 40px;
    height: 40px;
  }

  .card-head h3 {
    font-size: 14px;
    margin: 0 0 2px 0;
  }

  .cardhd-left span {
    font-size: 12px;
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: 6px;
    min-width: 0;
    font-size: 11px;
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: 8px;
    height: 8px;
  }

  .card-links a b::before {
    width: 3px;
    height: 3px;
  }

  .cdlt-title {
    font-size: 12px;
    margin: 0 0 5px 0;
  }

  .card-list {
    margin: 10px 10px 10px;
  }

  .card-links {
    margin: 0;
    gap: 7px;
  }

  .card-more {
    margin-top: 10px;
    font-size: 12px;
    width: 145px;
    height: 28px;
    border-radius: 14px;
  }

  .card-more b {
    width: 12px;
    height: 9px;
    margin: 0 0 0 4px;
  }

  .curriculum-dots {
    gap: 4px;
    margin-top: 12px;
  }

  .curriculum-dots .dot {
    width: 4px;
    height: 4px;
  }

  .curriculum-dots .dot.active {
    width: 20px;
    border-radius: 2px;
  }

  .hot-tags {
    padding: 14px 0 8px;
  }

  .hot-tags-row {
    margin-bottom: 25px;
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: 8px;
  }

  .tags-list {
    gap: 8px;
  }

  .tag {
    padding: 4px 16px;
    border-radius: 16px;
    font-size: 14px;
  }

  .schjg .tag {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 12px;
  }

  .products-grid {
    gap: 16px;
  }

  .page-detail .product-card {
    padding: 10px;
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: 4px;
  }

  .swiper-container.products-swiper .products-grid {
    gap: 12px;
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: 16px;
  }

  .products-pagination {
    margin-top: 16px;
    gap: 6px;
  }

  .products-pagination .swiper-pagination-bullet {
    width: 4px;
    height: 4px;
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: 20px;
    border-radius: 2px;
  }

  .product-card {
    padding: 10px;
    min-width: 0;
    border-radius: 8px;
    box-shadow: 0px 0px 4px 0px rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: 10px;
    top: 8px;
    left: 10px;
    gap: 3px;
    max-width: calc(100% - 36px);
  }

  .tagsa {
    padding: 1px 5px;
    font-size: 10px;
    border-radius: 8px;
  }

  .detail-layout .tagsa {
    padding: 1px 4px;
  }

  .product-thumb {
    border-radius: 8px;
    margin: 24px 0 0 0;
  }

  .product-name {
    font-size: 16px;
    margin: 7px 0 3px 0;
  }

  .product-meta {
    font-size: 12px;
    margin-bottom: 4px;
  }

  .product-rating {
    min-width: 0;
    font-size: 11px;
  }

  .product-rating b {
    width: 10px;
    height: 10px;
    margin: 0 2px 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 3px;
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: 24px;
    margin: 32px auto 32px;
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: 10px;
    padding-right: 0;
    padding: 0 var(--page-pad) 2px;
  }

  .feed-tabs .tab {
    width: 98px;
    padding: 0 24px;
    height: 32px;
    border-radius: 16px;
    font-size: 14px;
  }

  .feed-tabs .tab.more b {
    width: 9px;
    height: 5px;
    margin: 0 0 0 4px;
  }

  .page-list .feed-tabs .tab {
    min-width: 88px;
    width: 88px;
    height: 28px;
    border-radius: 15px;
    font-size: 12px;
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: 88px;
    width: 88px;
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: 16px;
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: 34px;
    border-radius: 4px;
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: 4px;
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: 4px;
  }

  .sidiv .sidebar-list a {
    gap: 8px;
    height: 34px;
    padding: 0 0 0 7px;
    font-size: 16px;
    line-height: 34px;
  }

  .sidiv .sidebar-icon {
    width: 18px;
    height: 18px;
    margin: 0 6px 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: 4px;
    font-size: 16px;
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: 11px;
    height: 14px;
  }

  .sidiv .products-pagination {
    margin-top: 16px;
  }

  .widget-box .products-pagination {
    margin-top: 16px;
  }

  .article-list {
    gap: 0;
    margin: 4px 0 0 0;
  }

  .article-item {
    gap: 12px;
    padding: 10px 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: 16px;
    margin-bottom: 2px;
  }

  .article-summary {
    font-size: 14px;
    max-height: 20px;
    line-height: 18px;
    margin-bottom: 3px;
  }

  .article-tags {
    gap: 6px;
    margin-top: 4px;
  }

  .article-tag {
    padding: 1px 8px;
    border-radius: 11px;
    font-size: 10px;
  }

  .idx .article-tag,.schjg .article-tag {
    padding: 1px 8px;
  }

  .artdtl .article-tag {
    padding: 3px 8px;
    font-size: 12px;
    border-radius: 12px;
  }

  .article-info {
    font-size: 12px;
    gap: 10px;
  }

  .article-thumb {
    width: 148px;
    height: 88px;
    border-radius: 6px;
    margin-top: 2px;
  }

  .article-thumb-small {
    width: 88px;
    height: 88px;
  }

  .btn-more-info {
    gap: 6px;
    height: 38px;
    margin-top: 16px;
    border-radius: 21px;
    font-size: 16px;
  }

  .icon-more {
    width: 16px;
    height: 16px;
  }

  .art-left-down {
    gap: 8px;
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 3px 0 0;
    width: 12px;
    height: 12px;
  }

  .sidebar-title {
    font-size: 17px;
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: 10px;
    padding: 12px 0;
    font-size: 14px;
  }

  .sidebar-icon {
    width: 16px;
    height: 16px;
    margin: 0 4px 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: 12px;
    padding-top: 2px;
  }

  .sidebar-more {
    margin-top: 12px;
    padding: 7px 0;
    font-size: 13px;
    border-radius: 18px;
  }

  .sidebar-more b {
    margin: 0 0 0 4px;
    width: 10px;
    height: 10px;
  }

  .sidebar-down {
    font-size: 12px;
    margin: 4px 0 0 0;
  }

  .footer-inner {
    padding: 0 0 16px;
  }

  .footer-brand {
    margin: 0;
    padding: 16px 15px 0 15px;
  }

  .footer-logo {
    gap: 8px;
    margin-bottom: 8px;
  }

  .footer-logo-img {
    width: 198px;
    padding: 0 0 0 5px;
  }

  .footer-desc {
    font-size: 14px;
    margin-bottom: 10px;
  }

  .footer-social {
    gap: 12px;
  }

  .footer-social a {
    width: 32px;
    height: 32px;
  }

  .footer-social a img {
    width: 28px;
    height: 28px;
  }

  .footer-links {
    padding: 28px 15px 15px 15px;
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: 16px;
    margin-bottom: 10px;
  }

  .footer-col ul {
    gap: 10px;
  }

  .footer-col a {
    font-size: 14px;
  }

  .footer-subscribe {
    margin: 0 15px 0 15px;
    gap: 15px;
    border-radius: 12px;
    padding: 5px;
  }

  .footer-qrcode {
    width: 120px;
    height: 120px;
    border-radius: 4px;
    margin: 0;
    margin: 10px 0 10px 10px;
  }

  .qrcode-img {
    width: 106px;
    height: 106px;
    border-radius: 4px;
  }

  .foot-line {
    width: 2px;
    height: 130px;
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: 16px;
  }

  .footer-sub-info .sub-desc {
    font-size: 14px;
    margin: 6px 0 14px 0;
  }

  .btn-subscribe {
    width: 152px;
    height: 32px;
    padding: 0 12px;
    border-radius: 16px;
    font-size: 12px;
  }

  .footer-bottom {
    padding: 14px 0 18px;
  }

  .footer-bottom .container {
    gap: 45px;
  }

  .footer-copy,.footer-beian {
    font-size: 12px;
    margin: 0;
  }

  .footer-beian {
    gap: 4px;
  }

  .gh {
    width: 12px;
    height: 13px;
    margin: 0;
  }

  .foot-qrcode p {
    font-size: 13px;
  }

  .search-hero-inner {
    padding: 0 33px 0 26px;
  }

  .search-hero {
    padding: 20px 0 18px;
  }

  .schjg .search-hero {
    padding: 70px 0 28px;
  }

  .search-brand {
    margin: 0 auto 14px;
  }

  .search-brand img {
    height: 28px;
  }

  .search-box {
    margin: 0 auto 14px;
    border-radius: 24px;
    padding: 3px 3px 3px 0;
    height: 32px;
    box-shadow: 0 2px 10px rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 12px 0 16px;
    font-size: 11px;
  }

  .search-submit {
    padding: 0 12px;
    height: 28px;
    border-radius: 19px;
    font-size: 12px;
  }

  .search-submit b {
    width: 12px;
    height: 12px;
    margin: 0 4px 0 0;
  }

  .hot-keywords {
    gap: 6px;
    margin: 0;
  }

  .hot-label {
    font-size: 14px;
    line-height: 26px;
  }

  .hot-keywords-list {
    min-width: 0;
    gap: 10px;
    max-height: 26px;
  }

  .schjg .tag.hot-toggle {
    padding: 0 10px;
  }

  .hot-toggle b {
    width: 12px;
    height: 7px;
  }

  .search-main {
    padding: 8px 0 0;
  }

  .search-tabs {
    width: calc(100%-32px);
    margin: 0 0 17px 0;
    padding: 0  22px;
    height: 42px;
    box-shadow: 0px 0px 4px 0px #F3EEFC;
    border-radius: 8px;
    gap: 26px;
  }

  .search-tab {
    font-size: 18px;
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: 6px;
    width: 16px;
    height: 2px;
  }

  .search-right {
    font-size: 12px;
    margin: 12px 0 4px;
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: 13px;
  }

  .empty-state {
    padding: 70px 0 68px;
  }

  .empty-img {
    width: 259px;
    margin: 0 auto 10px;
  }

  .empty-title {
    font-size: 14px;
    margin: 0 auto 10px;
  }

  .empty-desc {
    font-size: 14px;
  }

  .schjg .pagination {
    margin: 16px 0 32px;
  }

  .pagination {
    gap: 12px;
    margin-top: 20px;
  }

  .page-btns {
    gap: 10px 4px;
  }

  .page-extra {
    gap: 10px;
  }

  .page-btn, .page-num {
    min-width: 32px;
    height: 32px;
    padding: 0 8px;
    border-radius: 4px;
    font-size: 12px;
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 12px;
  }

  .page-ellipsis {
    padding: 0 2px;
    font-size: 12px;
  }

  .page-total, .page-jump {
    font-size: 14px;
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: 36px;
    height: 28px;
    border-radius: 6px;
    font-size: 12px;
    margin: 0 4px;
  }

  .page-go {
    padding: 0 14px;
    height: 28px;
    margin-left: 4px;
    border-radius: 3px;
    font-size: 12px;
  }

  .page-list {
    padding: 0 0 24px;
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: 27px;
    padding: 12px 15px 0 15px;
  }

  .m-cat-item {
    gap: 4px;
    min-width: 68px;
    padding: 0;
    font-size: 13px;
  }

  .m-cat-icon {
    width: 20px;
    height: 20px;
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: 20px;
    height: 3px;
    border-radius: 2px;
  }

  .m-sub-bar {
    gap: 8px;
    padding: 15px 12px 10px 16px;
  }

  .m-sub-scroll {
    min-width: 0;
    gap: 8px;
  }

  .m-sub-item {
    height: 32px;
    padding: 0 12px;
    border-radius: 8px;
    font-size: 16px;
  }

  .btn-catalog {
    width: 40px;
    gap: 2px;
    font-size: 10px;
  }

  .btn-catalog b {
    width: 18px;
    height: 18px;
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: 10px;
  }

  .left-nav-list > li > .nav-parent {
    gap: 8px;
    padding: 8px 16px;
    font-size: 15px;
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: 2px;
    height: 40px;
    border-radius: 4px;
  }

  .left-nav .nav-icon {
    width: 18px;
    height: 18px;
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: 10px;
    height: 10px;
  }

  .left-nav .sub-nav {
    padding: 4px 0 8px;
    gap: 2px;
  }

  .left-nav .sub-nav a {
    padding: 7px 3px;
    font-size: 14px;
  }

  .left-nav .sub-nav a::before {
    left: 26px;
    width: 6px;
    height: 6px;
  }

  .newgx .nav-icon {
    width: 18px;
    height: 18px;
  }

  .breadcrumb img {
    width: 10px;
    height: 12px;
    margin: 0 3px 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: 12px;
  }

  .breadcrumb {
    margin: 12px 0 10px;
  }

  .topic-banner {
    padding: 14px 14px 14px 16px;
    margin: 12px 0 14px;
    border-radius: 10px;
    min-height: 120px;
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: 18px;
  }

  .banner-desc {
    font-size: 14px;
    line-height: 18px;
    margin: 6px 0 8px;
  }

  .banner-meta {
    font-size: 12px;
    gap: 16px;
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 3px 0 0;
    width: 12px;
    height: 12px;
  }

  .bninfo-gx b {
    margin: 0 3px 0 0;
    width: 12px;
    height: 12px;
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 4px;
    padding: 0 0 2px;
  }

  .page-list .article-item {
    padding: 14px 0;
  }

  .page-list .article-info {
    gap: 12px;
    margin-bottom: 2px;
  }

  .page-list .article-tags {
    margin-top: 6px;
  }

  .topic-banner {
    padding: 10px 15px 12px 15px;
    margin: 24px 0 16px;
    border-radius: 10px;
    min-height: 115px;
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: 8px;
    min-width: 0;
    margin: 10px 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: 72px;
    height: 28px;
    padding: 0 12px;
    border-radius: 14px;
    font-size: 12px;
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: 72px;
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: 18px;
  }

  .m-cat-item.active::after {
    width: 24px;
    height: 3px;
  }

  .m-sub-bar {
    padding: 15px 12px 0 16px;
  }

  .btn-catalog {
    padding-left: 10px;
    margin-left: 2px;
  }

  .banner-img {
    width: 80px;
    height: 80px;
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: 48px;
    padding: 0 18px;
  }

  .catalog-back {
    left: 8px;
    width: 36px;
    height: 36px;
  }

  .catalog-back b {
    width: 20px;
    height: 19px;
  }

  .catalog-logo img {
    height: 28px;
  }

  .catalog-body {
    padding: 0 16px 32px;
  }

  .catalog-sec-title {
    font-size: 18px;
    margin: 0 0 12px;
  }

  .catalog-left {
    margin: 0 0 28px;
  }

  .catalog-nav {
    gap: 10px;
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: 8px;
    box-shadow: 0px 0px 4px 0px #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: 4px;
    padding: 12px 16px;
    font-size: 16px;
  }

  .catalog-nav .nav-icon {
    width: 20px;
    height: 20px;
  }

  .catalog-nav .nav-label {
    font-size: 16px;
  }

  .catalog-nav .nav-arrow {
    width: 6px;
    height: 12px;
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: 12px;
    height: 6px;
  }

  .catalog-nav .sub-nav {
    padding: 0 12px 16px;
  }

  .catalog-nav > li.open > .sub-nav {
    gap: 10px;
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: 34px;
    padding: 0 6px;
    border-radius: 8px;
    font-size: 12px;
  }

  .catalog-topics {
    gap: 16px 10px;
    padding-bottom: 8px;
  }

  .catalog-topics a {
    gap: 6px;
    min-width: 0;
    font-size: 13px;
  }

  .catalog-topics a img {
    width: 18px;
    height: 18px;
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: 25px 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: 10px;
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: 18px;
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: 120px;
    height: 68px;
    border-radius: 4px;
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: 16px;
    min-height: 42px;
  }

  .topic-detail .topic-hero {
    padding: 0 0 10px;
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: 12px 0 10px;
    gap: 6px;
    font-size: 12px;
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: 14px;
    height: 14px;
  }

  .topic-detail .topic-header {
    gap: 12px;
    margin: 0;
    padding: 16px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: 206px;
    border-radius: 10px;
  }

  .topic-detail .topic-header-img {
    border-radius: 8px;
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: 18px;
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: 16px;
    margin: 4px 0 8px;
  }

  .topic-detail .topic-header-meta {
    gap: 20px;
    font-size: 12px;
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: 8px;
    margin-top: 10px;
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: 14px;
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px;
  }

  .topic-detail .page-list-body {
    padding-top: 4px;
  }

  .widget-box {
    border-radius: 8px;
    padding: 10px 15px 16px 15px;
    margin-bottom: 20px;
  }

  .widget-title {
    font-size: 18px;
  }

  .xgxz .widget-title {
    margin-bottom: 10px;
  }

  .widget-list a {
    gap: 10px;
    padding: 10px 0;
    font-size: 13px;
  }

  .widget-icon {
    width: 18px;
    height: 18px;
  }

  .widget-thumb {
    width: 48px;
    height: 48px;
  }

  .widget-meta {
    font-size: 12px;
  }

  .widget-hot-topics {
    gap: 16px;
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: 120px;
    height: 68px;
    border-radius: 4px;
    margin: 0 10px 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: 8px;
  }

  .widget-hot-topics .widget-text {
    font-size: 16px;
    line-height: 18px;
    min-height: 45px;
  }

  .widget-hot-topics .widget-meta {
    gap: 16px;
    font-size: 12px;
    line-height: 16px;
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: 4px;
  }

  .widget-hot-topics .widget-date b {
    width: 14px;
    height: 14px;
  }

  .widget-hot-topics .widget-view b {
    width: 14px;
    height: 14px;
  }

  .widget-courses {
    gap: 16px;
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: 110px;
    height: 62px;
    border-radius: 4px;
    margin: 0 9px 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: 8px;
  }

  .widget-courses .widget-text {
    font-size: 16px;
    line-height: 18px;
    min-height: 36px;
  }

  .widget-courses .widget-meta {
    gap: 16px;
    font-size: 12px;
    line-height: 16px;
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: 4px;
  }

  .widget-courses .widget-author b {
    width: 12px;
    height: 12px;
  }

  .widget-courses .widget-view b {
    width: 12px;
    height: 12px;
  }

  .widget-downloads {
    gap: 13px;
  }

  .widget-downloads li {
    padding-bottom: 14px;
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: 10px;
  }

  .widget-downloads .widget-app-icon {
    width: 48px;
    height: 48px;
    border-radius: 55px;
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: 4px;
  }

  .widget-downloads .widget-text {
    font-size: 16px;
  }

  .widget-downloads .widget-desc {
    font-size: 14px;
  }

  .widget-downloads .btn-dl {
    gap: 2px;
    width: 68px;
    height: 27px;
    padding: 0;
    border-radius: 14px;
    font-size: 12px;
  }

  .widget-downloads .btn-dl b {
    width: 11px;
    height: 10px;
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: 16px;
    padding: 0 0 0 18px;
    font-size: 16px;
  }

  .widget-links a::before {
    left: 0;
    width: 4px;
    height: 4px;
  }

  .xgxz .widget-links a {
    padding: 0 0 0 12px;
  }

  .widget-more {
    margin-top: 12px;
    padding: 8px 0;
    font-size: 13px;
  }

  .tags-grid {
    gap: 8px;
  }

  .widget-links {
    gap: 12px;
  }

  .page-latest {
    padding: 0 0 24px;
  }

  .latest-layout {
    gap: 0;
    margin: 16px 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: 6px 0 6px;
    font-size: 14px;
  }

  .latest-table td {
    padding: 12px 0;
    font-size: 18px;
  }

  .latest-table td a {
    font-size: 14px;
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: 72px;
    padding-left: 16px;
    padding-right: 4px;
  }

  .latest-table th:nth-child(1) {
    padding-left: 35px;
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: 6px;
  }

  .latest-table th:nth-child(2) {
    padding-left: 64px;
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: 40px;
    padding-left: 0;
    padding-right: 0;
    font-size: 14px;
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: 42px;
    padding-left: 0;
    padding-right: 16px;
    font-size: 14px;
  }

  .cat-tag {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 11px;
  }

  .newgx .pagination {
    margin: 16px 0 8px;
  }

  .latest-main .pagination {
    padding: 0;
    margin: 16px 0 8px;
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 24px;
  }

  .artdtl .page-detail {
    padding: 0 0 30px;
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: 12px 0 10px;
  }

  .detail-title {
    font-size: 21px;
    margin-bottom: 12px;
  }

  .detail-meta {
    gap: 8px;
    padding-bottom: 7px;
    margin-bottom: 10px;
  }

  .author-avatar {
    width: 36px;
    height: 36px;
    margin: 0 8px 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: 12px;
    gap: 4px;
    margin: 4px 0 0;
  }

  .author-name {
    font-size: 12px;
  }

  .btn-copy {
    padding: 2px 10px;
    border-radius: 3px;
    font-size: 12px;
    margin-top: 4px;
  }

  .detail-content {
    font-size: 15px;
    margin-bottom: 20px;
  }

  .detail-content h2 {
    font-size: 22px;
    margin: 18px 0 10px;
  }

  .detail-content p {
    margin-bottom: 14px;
  }

  .detail-figure {
    margin: 16px 0;
  }

  .detail-figure img {
    border-radius: 8px;
  }

  .detail-figure figcaption {
    font-size: 12px;
    margin-top: 6px;
  }

  .artcona {
    margin: 14px 0;
  }

  .artconimg {
    border-radius: 8px;
  }

  .related-box {
    margin-bottom: 16px;
  }

  .box-title {
    font-size: 18px;
    margin-bottom: 8px;
  }

  .box-header {
    margin-bottom: 10px;
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: 14px;
    padding: 15px 18px;
    border-radius: 0 8px 8px 0;
    margin-bottom: 14px;
    line-height: 22px;
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    border-radius: 2px 0 0 2px;
  }

  .related-list {
    gap: 8px;
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: 8px;
    font-size: 16px;
  }

  .related-list a::before {
    left: 0;
    width: 4px;
    height: 4px;
  }

  .tool-card, .artdtl .tool-card {
    gap: 12px;
    padding: 14px;
    box-shadow: 0 0 4px rgba(203,203,203,.42);
    border-radius: 8px;
    margin-bottom: 16px;
  }

  .tool-icon {
    width: 56px;
    height: 56px;
    border-radius: 8px;
    margin: 0 10px 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: 6px;
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: 4px;
  }

  .tool-name {
    font-size: 16px;
    margin: 0;
  }

  .tool-author {
    font-size: 14px;
    margin: 0;
  }

  .tool-meta {
    gap: 10px;
    margin: 2px 0 0;
  }

  .tool-stars {
    gap: 2px;
    height: 16px;
  }

  .tool-stars b {
    width: 12px;
    height: 12px;
  }

  .tool-stars .star-full {
    margin: 0 2px 0 0;
  }

  .tool-score {
    font-size: 12px;
  }

  .tool-badge {
    gap: 4px;
    font-size: 12px;
  }

  .tool-badge b {
    width: 12px;
    height: 12px;
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: 12px;
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: 10px;
    margin: 0;
  }

  .tool-btn-copy {
    width: 88px;
    height: 26px;
    border-radius: 17px;
    font-size: 12px;
  }

  .tool-btn-down {
    width: 88px;
    height: 26px;
    border-radius: 17px;
    gap: 4px;
    font-size: 12px;
  }

  .tool-btn-down b {
    width: 13px;
    height: 13px;
  }

  .tool-res-card {
    gap: 12px;
    padding: 12px;
  }

  .tool-res-thumb {
    width: 101px;
    height: 101px;
    border-radius: 6px;
  }

  .tool-res-cover {
    width: 88px;
    height: 88px;
    border-radius: 8px;
    padding: 8px;
  }

  .tool-res-cover span {
    font-size: 12px;
  }

  .tool-res-body {
    min-width: 0;
    gap: 6px;
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: 162px;
    height: 101px;
  }

  .tool-res-head {
    gap: 8px;
  }

  .tool-res-title {
    font-size: 16px;
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: 4px;
    font-size: 12px;
  }

  .tool-res-date b {
    width: 12px;
    height: 12px;
  }

  .tool-res-desc {
    font-size: 12px;
    margin: 0;
  }

  .tool-res-tags {
    gap: 6px;
  }

  .tool-res-tag {
    padding: 1px 8px;
    border-radius: 11px;
    font-size: 10px;
  }

  .tool-res-btn {
    height: 26px;
    padding: 0 14px;
    border-radius: 13px;
    font-size: 12px;
    gap: 4px;
  }

  .tool-res-btn b {
    width: 14px;
    height: 14px;
  }

  .btn-sm {
    padding: 8px 20px;
    font-size: 13px;
  }

  .detail-tags {
    gap: 10px;
    margin-bottom: 20px;
  }

  .tags-label {
    font-size: 16px;
  }

  .detail-declare {
    padding: 10px;
    margin-bottom: 16px;
    border-radius: 8px;
  }

  .declare-title {
    font-size: 16px;
    margin: 0 0 10px;
  }

  .declared {
    border-radius: 8px;
    padding: 16px 22px;
  }

  .declare-title::before,
  .declare-title::after {
    width: 90px;
    height: 1px;
  }

  .declare-title::before {
    left: 8px;
  }

  .declare-title::after {
    right: 8px;
  }

  .detail-declare p {
    font-size: 14px;
    line-height: 20px;
    margin: 0 0 6px;
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: 10px;
    font-size: 13px;
    margin: 0 0 24px;
  }

  .detail-nav a {
    padding: 8px 16px;
    min-height: 38px;
    box-shadow: 0px 0px 8px 0px rgba(119,118,118,0.08);
    border-radius: 8px;
    gap: 4px;
    font-size: 12px;
  }

  .author-list {
    gap: 11px;
  }

  .author-list li {
    min-width: 0;
    gap: 10px;
  }

  .author-list a {
    min-width: 0;
    padding-left: 10px;
    font-size: 16px;
  }

  .author-list a::before {
    left: 0;
    width: 4px;
    height: 4px;
  }

  .author-list .author-time {
    gap: 3px;
    font-size: 12px;
  }

  .author-list .author-time b {
    width: 12px;
    height: 12px;
  }

  .author-articles {
    margin: 0 0 26px;
  }

  .detail-products {
    margin: 8px 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: 25px 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: 14px;
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: 14px;
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: 12px;
  }

  .artcons h1::before, .artcons h2::before {
    width: 3px;
    height: 14px;
    margin-right: 8px;
    margin-top: -2px;
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 8px 0 0;
    width: 12px;
    height: 12px;
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: 16px;
    margin: 10px 0;
  }

  .artcons .hp {
    font-size: 15px;
    margin: 10px 0;
  }

  .artcons table {
    margin: 12px 0;
  }

  .artcons table td, .artcons table th {
    padding: 6px 8px;
    font-size: 13px;
  }

  .artcons pre {
    padding: 12px;
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: 200px;
  }

  .artcons .CodeMirror-fullscreen {
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 5px;
    top: 5px;
    right: 5px;
    margin-bottom: -35px;
  }

  .artcons img {
    height: 506px;
    border-radius: 8px;
  }
  .detail-content ol{margin-left: 20px ;}
  .artcons h3 {
    font-size: 20px !important;
  }

  .artcons h4 {
    font-size: 18px !important;
  }

  .artcons h5 {
    font-size: 16px !important;
  }

  .artcons h6 {
    font-size: 14px !important;
  }

  .artcons p {
    line-height: 26px;
    font-size: 16px;
    margin: 6px 0;
  }

  .artcons a {
    padding-bottom: 2px;
  }

  .artcons p>code span {
    font-size: 12px !important;
  }

  .artcons pre .language- {
    font-size: 13px !important;
  }

  .artcons pre .language- span {
    font-size: 13px !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: 16px !important;
  }

  .artcons a span {
    font-size: 16px !important;
  }

  .newsArticle .artcons {
    margin-bottom: 120px;
  }

  .artcons {
    font-size: 16px;
  }

}

@media screen and (max-width: 415px) {
  :root {
    --radius-sm: calc(var(--width415) * 4px);
    --radius-md: calc(var(--width415) * 8px);
    --radius-lg: calc(var(--width415) * 24px);
    --page-pad: calc(var(--width415) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width415) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width415) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width415) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width415) * 48px);
    padding: calc(var(--width415) * 10px) calc(var(--width415) * 16px) calc(var(--width415) * 10px) calc(var(--width415) * 13px);
    box-shadow: 0 0 calc(var(--width415) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width415) * 8px);
    font-size: calc(var(--width415) * 18px);
  }

  .logo-img {
    width: calc(var(--width415) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width415) * 14px);
    margin-left: calc(var(--width415) * 4px);
  }

  .header-actions {
    gap: calc(var(--width415) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width415) * 18px);
    height: calc(var(--width415) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width415) * 320px);
    box-shadow: calc(var(--width415) * -4px) 0 calc(var(--width415) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width415) * 52px);
    padding: 0 calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width415) * 20px);
    height: calc(var(--width415) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width415) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width415) * 14px) calc(var(--width415) * 20px);
    font-size: calc(var(--width415) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width415) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width415) * 48px);
    padding: 0 calc(var(--width415) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width415) * 8px);
    width: calc(var(--width415) * 36px);
    height: calc(var(--width415) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width415) * 20px);
    height: calc(var(--width415) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width415) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width415) * 16px) calc(var(--width415) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width415) * 8px);
    height: calc(var(--width415) * 44px);
    padding: 0 calc(var(--width415) * 16px);
    margin: 0 0 calc(var(--width415) * 18px);
    border-radius: calc(var(--width415) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width415) * 18px);
    height: calc(var(--width415) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width415) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width415) * 10px);
    margin: 0 0 calc(var(--width415) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width415) * 6px);
    min-height: calc(var(--width415) * 52px);
    padding: calc(var(--width415) * 12px) calc(var(--width415) * 16px);
    box-shadow: 0 0 calc(var(--width415) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width415) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width415) * 20px);
    height: calc(var(--width415) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width415) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width415) * 6px);
    height: calc(var(--width415) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width415) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width415) * 6px);
    height: calc(var(--width415) * 44px);
    border-radius: calc(var(--width415) * 21px);
    font-size: calc(var(--width415) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width415) * 16px);
    height: calc(var(--width415) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width415) * 14px);
    height: calc(var(--width415) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width415) * 16px) calc(var(--width415) * 16px) calc(var(--width415) * 26px);
  }

  .sechtitle {
    top: calc(var(--width415) * 12px);
    right: calc(var(--width415) * 12px);
    width: calc(var(--width415) * 36px);
    height: calc(var(--width415) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width415) * 22px);
    height: calc(var(--width415) * 22px);
  }

  .sechcon {
    margin: calc(var(--width415) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width415) * 20px);
    width: calc(var(--width415) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width415) * 198px);
  }

  .serchd {
    height: calc(var(--width415) * 46px);
    margin: 0 0 calc(var(--width415) * 18px);
    border-radius: calc(var(--width415) * 23px);
    padding: 0 calc(var(--width415) * 16px) 0 calc(var(--width415) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width415) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width415) * 36px);
    height: calc(var(--width415) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width415) * 20px);
    height: calc(var(--width415) * 20px);
  }

  .top-btn {
    gap: calc(var(--width415) * 8px);
  }

  .topbtna {
    height: calc(var(--width415) * 18px);
    padding: 0 calc(var(--width415) * 12px);
    border-radius: calc(var(--width415) * 11px);
    font-size: calc(var(--width415) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width415) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width415) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width415) * 6px);
    font-size: calc(var(--width415) * 32px);
    line-height: calc(var(--width415) * 36px);
    margin: calc(var(--width415) * 26px) 0 calc(var(--width415) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width415) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width415) * 6px) auto;
    letter-spacing: calc(var(--width415) * 4px);
    width: calc(var(--width415) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width415) * 12px);
    margin-bottom: calc(var(--width415) * 15px);
    letter-spacing: calc(var(--width415) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width415) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width415) * 98px);
    height: calc(var(--width415) * 32px);
    border-radius: calc(var(--width415) * 22px);
    font-size: calc(var(--width415) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width415) * 44px);
    width: calc(var(--width415) * 98px);
    height: calc(var(--width415) * 32px);
    border-radius: calc(var(--width415) * 26px);
    font-size: calc(var(--width415) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width415) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width415) * 12px);
  }

  .section-title {
    font-size: calc(var(--width415) * 18px);
  }

  .section-more {
    font-size: calc(var(--width415) * 14px);
  }

  .section-more b {
    width: calc(var(--width415) * 8px);
    height: calc(var(--width415) * 8px);
    margin: 0 0 0 calc(var(--width415) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width415) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width415) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width415) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width415) * 308px);
    border-radius: calc(var(--width415) * 5px);
    width: calc(var(--width415) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width415) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width415) * 8px);
    margin: calc(var(--width415) * 5px) calc(var(--width415) * 6px) 0 calc(var(--width415) * 10px);
    min-height: calc(var(--width415) * 56px);
    padding: 0 0 calc(var(--width415) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width415) * 3px);
    right: calc(var(--width415) * 3px);
    bottom: 0;
    height: calc(var(--width415) * 1px);
  }

  .card-icon {
    width: calc(var(--width415) * 40px);
    height: calc(var(--width415) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width415) * 14px);
    margin: 0 0 calc(var(--width415) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width415) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width415) * 6px);
    min-width: 0;
    font-size: calc(var(--width415) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width415) * 8px);
    height: calc(var(--width415) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width415) * 3px);
    height: calc(var(--width415) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width415) * 12px);
    margin: 0 0 calc(var(--width415) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width415) * 10px) calc(var(--width415) * 10px) calc(var(--width415) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width415) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width415) * 10px);
    font-size: calc(var(--width415) * 12px);
    width: calc(var(--width415) * 145px);
    height: calc(var(--width415) * 28px);
    border-radius: calc(var(--width415) * 14px);
  }

  .card-more b {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 9px);
    margin: 0 0 0 calc(var(--width415) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width415) * 4px);
    margin-top: calc(var(--width415) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width415) * 4px);
    height: calc(var(--width415) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width415) * 20px);
    border-radius: calc(var(--width415) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width415) * 14px) 0 calc(var(--width415) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width415) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width415) * 8px);
  }

  .tags-list {
    gap: calc(var(--width415) * 8px);
  }

  .tag {
    padding: calc(var(--width415) * 4px) calc(var(--width415) * 16px);
    border-radius: calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width415) * 12px);
    padding: calc(var(--width415) * 2px) calc(var(--width415) * 8px);
    border-radius: calc(var(--width415) * 12px);
  }

  .products-grid {
    gap: calc(var(--width415) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width415) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width415) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width415) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width415) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width415) * 16px);
    gap: calc(var(--width415) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width415) * 4px);
    height: calc(var(--width415) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width415) * 20px);
    border-radius: calc(var(--width415) * 2px);
  }

  .product-card {
    padding: calc(var(--width415) * 10px);
    min-width: 0;
    border-radius: calc(var(--width415) * 8px);
    box-shadow: 0 0 calc(var(--width415) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width415) * 10px);
    top: calc(var(--width415) * 8px);
    left: calc(var(--width415) * 10px);
    gap: calc(var(--width415) * 3px);
    max-width: calc(100% - calc(var(--width415) * 36px));
  }

  .tagsa {
    padding: calc(var(--width415) * 1px) calc(var(--width415) * 5px);
    font-size: calc(var(--width415) * 10px);
    border-radius: calc(var(--width415) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width415) * 1px) calc(var(--width415) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width415) * 8px);
    margin: calc(var(--width415) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width415) * 16px);
    margin: calc(var(--width415) * 7px) 0 calc(var(--width415) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width415) * 12px);
    margin-bottom: calc(var(--width415) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width415) * 11px);
  }

  .product-rating b {
    width: calc(var(--width415) * 10px);
    height: calc(var(--width415) * 10px);
    margin: 0 calc(var(--width415) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width415) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width415) * 24px);
    margin: calc(var(--width415) * 32px) auto calc(var(--width415) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width415) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width415) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width415) * 98px);
    padding: 0 calc(var(--width415) * 24px);
    height: calc(var(--width415) * 32px);
    border-radius: calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width415) * 9px);
    height: calc(var(--width415) * 5px);
    margin: 0 0 0 calc(var(--width415) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width415) * 88px);
    width: calc(var(--width415) * 88px);
    height: calc(var(--width415) * 28px);
    border-radius: calc(var(--width415) * 15px);
    font-size: calc(var(--width415) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width415) * 88px);
    width: calc(var(--width415) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width415) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width415) * 34px);
    border-radius: calc(var(--width415) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width415) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width415) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width415) * 8px);
    height: calc(var(--width415) * 34px);
    padding: 0 0 0 calc(var(--width415) * 7px);
    font-size: calc(var(--width415) * 16px);
    line-height: calc(var(--width415) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width415) * 18px);
    height: calc(var(--width415) * 18px);
    margin: 0 calc(var(--width415) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width415) * 4px);
    font-size: calc(var(--width415) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width415) * 11px);
    height: calc(var(--width415) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width415) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width415) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width415) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width415) * 12px);
    padding: calc(var(--width415) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width415) * 16px);
    margin-bottom: calc(var(--width415) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width415) * 14px);
    max-height: calc(var(--width415) * 20px);
    line-height: calc(var(--width415) * 18px);
    margin-bottom: calc(var(--width415) * 3px);
  }

  .article-tags {
    gap: calc(var(--width415) * 6px);
    margin-top: calc(var(--width415) * 4px);
  }

  .article-tag {
    padding: calc(var(--width415) * 1px) calc(var(--width415) * 8px);
    border-radius: calc(var(--width415) * 11px);
    font-size: calc(var(--width415) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width415) * 1px) calc(var(--width415) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width415) * 3px) calc(var(--width415) * 8px);
    font-size: calc(var(--width415) * 12px);
    border-radius: calc(var(--width415) * 12px);
  }

  .article-info {
    font-size: calc(var(--width415) * 12px);
    gap: calc(var(--width415) * 10px);
  }

  .article-thumb {
    width: calc(var(--width415) * 148px);
    height: calc(var(--width415) * 88px);
    border-radius: calc(var(--width415) * 6px);
    margin-top: calc(var(--width415) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width415) * 88px);
    height: calc(var(--width415) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width415) * 6px);
    height: calc(var(--width415) * 38px);
    margin-top: calc(var(--width415) * 16px);
    border-radius: calc(var(--width415) * 21px);
    font-size: calc(var(--width415) * 16px);
  }

  .icon-more {
    width: calc(var(--width415) * 16px);
    height: calc(var(--width415) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width415) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width415) * 3px) 0 0;
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width415) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width415) * 10px);
    padding: calc(var(--width415) * 12px) 0;
    font-size: calc(var(--width415) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width415) * 16px);
    height: calc(var(--width415) * 16px);
    margin: 0 calc(var(--width415) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width415) * 12px);
    padding-top: calc(var(--width415) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width415) * 12px);
    padding: calc(var(--width415) * 7px) 0;
    font-size: calc(var(--width415) * 13px);
    border-radius: calc(var(--width415) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width415) * 4px);
    width: calc(var(--width415) * 10px);
    height: calc(var(--width415) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width415) * 12px);
    margin: calc(var(--width415) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width415) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width415) * 16px) calc(var(--width415) * 15px) 0 calc(var(--width415) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width415) * 8px);
    margin-bottom: calc(var(--width415) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width415) * 198px);
    padding: 0 0 0 calc(var(--width415) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width415) * 14px);
    margin-bottom: calc(var(--width415) * 10px);
  }

  .footer-social {
    gap: calc(var(--width415) * 12px);
  }

  .footer-social a {
    width: calc(var(--width415) * 32px);
    height: calc(var(--width415) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width415) * 28px);
    height: calc(var(--width415) * 28px);
  }

  .footer-links {
    padding: calc(var(--width415) * 28px) calc(var(--width415) * 15px) calc(var(--width415) * 15px) calc(var(--width415) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width415) * 16px);
    margin-bottom: calc(var(--width415) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width415) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width415) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width415) * 15px) 0 calc(var(--width415) * 15px);
    gap: calc(var(--width415) * 15px);
    border-radius: calc(var(--width415) * 12px);
    padding: calc(var(--width415) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width415) * 120px);
    height: calc(var(--width415) * 120px);
    border-radius: calc(var(--width415) * 4px);
    margin: 0;
    margin: calc(var(--width415) * 10px) 0 calc(var(--width415) * 10px) calc(var(--width415) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width415) * 106px);
    height: calc(var(--width415) * 106px);
    border-radius: calc(var(--width415) * 4px);
  }

  .foot-line {
    width: calc(var(--width415) * 2px);
    height: calc(var(--width415) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width415) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width415) * 14px);
    margin: calc(var(--width415) * 6px) 0 calc(var(--width415) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width415) * 152px);
    height: calc(var(--width415) * 32px);
    padding: 0 calc(var(--width415) * 12px);
    border-radius: calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width415) * 14px) 0 calc(var(--width415) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width415) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width415) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width415) * 4px);
  }

  .gh {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width415) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width415) * 33px) 0 calc(var(--width415) * 26px);
  }

  .search-hero {
    padding: calc(var(--width415) * 20px) 0 calc(var(--width415) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width415) * 70px) 0 calc(var(--width415) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width415) * 14px);
  }

  .search-brand img {
    height: calc(var(--width415) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width415) * 14px);
    border-radius: calc(var(--width415) * 24px);
    padding: calc(var(--width415) * 3px) calc(var(--width415) * 3px) calc(var(--width415) * 3px) 0;
    height: calc(var(--width415) * 32px);
    box-shadow: 0 calc(var(--width415) * 2px) calc(var(--width415) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width415) * 12px) 0 calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width415) * 12px);
    height: calc(var(--width415) * 28px);
    border-radius: calc(var(--width415) * 19px);
    font-size: calc(var(--width415) * 12px);
  }

  .search-submit b {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
    margin: 0 calc(var(--width415) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width415) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width415) * 14px);
    line-height: calc(var(--width415) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width415) * 10px);
    max-height: calc(var(--width415) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width415) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 7px);
  }

  .search-main {
    padding: calc(var(--width415) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width415) * -32px));
    margin: 0 0 calc(var(--width415) * 17px) 0;
    padding: 0  calc(var(--width415) * 22px);
    height: calc(var(--width415) * 42px);
    box-shadow: 0 0 calc(var(--width415) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width415) * 8px);
    gap: calc(var(--width415) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width415) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width415) * 6px);
    width: calc(var(--width415) * 16px);
    height: calc(var(--width415) * 2px);
  }

  .search-right {
    font-size: calc(var(--width415) * 12px);
    margin: calc(var(--width415) * 12px) 0 calc(var(--width415) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width415) * 13px);
  }

  .empty-state {
    padding: calc(var(--width415) * 70px) 0 calc(var(--width415) * 68px);
  }

  .empty-img {
    width: calc(var(--width415) * 259px);
    margin: 0 auto calc(var(--width415) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width415) * 14px);
    margin: 0 auto calc(var(--width415) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width415) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width415) * 16px) 0 calc(var(--width415) * 32px);
  }

  .pagination {
    gap: calc(var(--width415) * 12px);
    margin-top: calc(var(--width415) * 20px);
  }

  .page-btns {
    gap: calc(var(--width415) * 10px) calc(var(--width415) * 4px);
  }

  .page-extra {
    gap: calc(var(--width415) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width415) * 32px);
    height: calc(var(--width415) * 32px);
    padding: 0 calc(var(--width415) * 8px);
    border-radius: calc(var(--width415) * 4px);
    font-size: calc(var(--width415) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width415) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width415) * 2px);
    font-size: calc(var(--width415) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width415) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width415) * 36px);
    height: calc(var(--width415) * 28px);
    border-radius: calc(var(--width415) * 6px);
    font-size: calc(var(--width415) * 12px);
    margin: 0 calc(var(--width415) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width415) * 14px);
    height: calc(var(--width415) * 28px);
    margin-left: calc(var(--width415) * 4px);
    border-radius: calc(var(--width415) * 3px);
    font-size: calc(var(--width415) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width415) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width415) * 27px);
    padding: calc(var(--width415) * 12px) calc(var(--width415) * 15px) 0 calc(var(--width415) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width415) * 4px);
    min-width: calc(var(--width415) * 68px);
    padding: 0;
    font-size: calc(var(--width415) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width415) * 20px);
    height: calc(var(--width415) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width415) * 20px);
    height: calc(var(--width415) * 3px);
    border-radius: calc(var(--width415) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width415) * 8px);
    padding: calc(var(--width415) * 15px) calc(var(--width415) * 12px) calc(var(--width415) * 10px) calc(var(--width415) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width415) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width415) * 32px);
    padding: 0 calc(var(--width415) * 12px);
    border-radius: calc(var(--width415) * 8px);
    font-size: calc(var(--width415) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width415) * 40px);
    gap: calc(var(--width415) * 2px);
    font-size: calc(var(--width415) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width415) * 18px);
    height: calc(var(--width415) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width415) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width415) * 8px);
    padding: calc(var(--width415) * 8px) calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width415) * 2px);
    height: calc(var(--width415) * 40px);
    border-radius: calc(var(--width415) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width415) * 18px);
    height: calc(var(--width415) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width415) * 10px);
    height: calc(var(--width415) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width415) * 4px) 0 calc(var(--width415) * 8px);
    gap: calc(var(--width415) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width415) * 7px) calc(var(--width415) * 3px);
    font-size: calc(var(--width415) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width415) * 26px);
    width: calc(var(--width415) * 6px);
    height: calc(var(--width415) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width415) * 18px);
    height: calc(var(--width415) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width415) * 10px);
    height: calc(var(--width415) * 12px);
    margin: 0 calc(var(--width415) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width415) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width415) * 12px) 0 calc(var(--width415) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width415) * 14px) calc(var(--width415) * 14px) calc(var(--width415) * 14px) calc(var(--width415) * 16px);
    margin: calc(var(--width415) * 12px) 0 calc(var(--width415) * 14px);
    border-radius: calc(var(--width415) * 10px);
    min-height: calc(var(--width415) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width415) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width415) * 14px);
    line-height: calc(var(--width415) * 18px);
    margin: calc(var(--width415) * 6px) 0 calc(var(--width415) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width415) * 12px);
    gap: calc(var(--width415) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width415) * 3px) 0 0;
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width415) * 3px) 0 0;
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width415) * 4px);
    padding: 0 0 calc(var(--width415) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width415) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width415) * 12px);
    margin-bottom: calc(var(--width415) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width415) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width415) * 10px) calc(var(--width415) * 15px) calc(var(--width415) * 12px) calc(var(--width415) * 15px);
    margin: calc(var(--width415) * 24px) 0 calc(var(--width415) * 16px);
    border-radius: calc(var(--width415) * 10px);
    min-height: calc(var(--width415) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width415) * 8px);
    min-width: 0;
    margin: calc(var(--width415) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width415) * 72px);
    height: calc(var(--width415) * 28px);
    padding: 0 calc(var(--width415) * 12px);
    border-radius: calc(var(--width415) * 14px);
    font-size: calc(var(--width415) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width415) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width415) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width415) * 24px);
    height: calc(var(--width415) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width415) * 15px) calc(var(--width415) * 12px) 0 calc(var(--width415) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width415) * 10px);
    margin-left: calc(var(--width415) * 2px);
  }

  .banner-img {
    width: calc(var(--width415) * 80px);
    height: calc(var(--width415) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width415) * 48px);
    padding: 0 calc(var(--width415) * 18px);
  }

  .catalog-back {
    left: calc(var(--width415) * 8px);
    width: calc(var(--width415) * 36px);
    height: calc(var(--width415) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width415) * 20px);
    height: calc(var(--width415) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width415) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width415) * 16px) calc(var(--width415) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width415) * 18px);
    margin: 0 0 calc(var(--width415) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width415) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width415) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width415) * 8px);
    box-shadow: 0 0 calc(var(--width415) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width415) * 4px);
    padding: calc(var(--width415) * 12px) calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width415) * 20px);
    height: calc(var(--width415) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width415) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width415) * 6px);
    height: calc(var(--width415) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width415) * 12px) calc(var(--width415) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width415) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width415) * 34px);
    padding: 0 calc(var(--width415) * 6px);
    border-radius: calc(var(--width415) * 8px);
    font-size: calc(var(--width415) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width415) * 16px) calc(var(--width415) * 10px);
    padding-bottom: calc(var(--width415) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width415) * 6px);
    min-width: 0;
    font-size: calc(var(--width415) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width415) * 18px);
    height: calc(var(--width415) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width415) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width415) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width415) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width415) * 120px);
    height: calc(var(--width415) * 68px);
    border-radius: calc(var(--width415) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width415) * 16px);
    min-height: calc(var(--width415) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width415) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width415) * 12px) 0 calc(var(--width415) * 10px);
    gap: calc(var(--width415) * 6px);
    font-size: calc(var(--width415) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width415) * 14px);
    height: calc(var(--width415) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width415) * 12px);
    margin: 0;
    padding: calc(var(--width415) * 16px);
    border-radius: calc(var(--width415) * 12px);
    box-shadow: 0 calc(var(--width415) * 2px) calc(var(--width415) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width415) * 206px);
    border-radius: calc(var(--width415) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width415) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width415) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width415) * 16px);
    margin: calc(var(--width415) * 4px) 0 calc(var(--width415) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width415) * 20px);
    font-size: calc(var(--width415) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width415) * 8px);
    margin-top: calc(var(--width415) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width415) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width415) * 2px) calc(var(--width415) * 10px);
    border-radius: calc(var(--width415) * 999px);
    font-size: calc(var(--width415) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width415) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width415) * 8px);
    padding: calc(var(--width415) * 10px) calc(var(--width415) * 15px) calc(var(--width415) * 16px) calc(var(--width415) * 15px);
    margin-bottom: calc(var(--width415) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width415) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width415) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width415) * 10px);
    padding: calc(var(--width415) * 10px) 0;
    font-size: calc(var(--width415) * 13px);
  }

  .widget-icon {
    width: calc(var(--width415) * 18px);
    height: calc(var(--width415) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width415) * 48px);
    height: calc(var(--width415) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width415) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width415) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width415) * 120px);
    height: calc(var(--width415) * 68px);
    border-radius: calc(var(--width415) * 4px);
    margin: 0 calc(var(--width415) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width415) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width415) * 16px);
    line-height: calc(var(--width415) * 18px);
    min-height: calc(var(--width415) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 12px);
    line-height: calc(var(--width415) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width415) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width415) * 14px);
    height: calc(var(--width415) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width415) * 14px);
    height: calc(var(--width415) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width415) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width415) * 110px);
    height: calc(var(--width415) * 62px);
    border-radius: calc(var(--width415) * 4px);
    margin: 0 calc(var(--width415) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width415) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width415) * 16px);
    line-height: calc(var(--width415) * 18px);
    min-height: calc(var(--width415) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 12px);
    line-height: calc(var(--width415) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width415) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width415) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width415) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width415) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width415) * 48px);
    height: calc(var(--width415) * 48px);
    border-radius: calc(var(--width415) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width415) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width415) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width415) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width415) * 2px);
    width: calc(var(--width415) * 68px);
    height: calc(var(--width415) * 27px);
    padding: 0;
    border-radius: calc(var(--width415) * 14px);
    font-size: calc(var(--width415) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width415) * 11px);
    height: calc(var(--width415) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width415) * 16px);
    padding: 0 0 0 calc(var(--width415) * 18px);
    font-size: calc(var(--width415) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width415) * 4px);
    height: calc(var(--width415) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width415) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width415) * 12px);
    padding: calc(var(--width415) * 8px) 0;
    font-size: calc(var(--width415) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width415) * 8px);
  }

  .widget-links {
    gap: calc(var(--width415) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width415) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width415) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width415) * 6px) 0 calc(var(--width415) * 6px);
    font-size: calc(var(--width415) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width415) * 12px) 0;
    font-size: calc(var(--width415) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width415) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width415) * 72px);
    padding-left: calc(var(--width415) * 16px);
    padding-right: calc(var(--width415) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width415) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width415) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width415) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width415) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width415) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width415) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width415) * 16px);
    font-size: calc(var(--width415) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width415) * 4px) calc(var(--width415) * 8px);
    border-radius: calc(var(--width415) * 4px);
    font-size: calc(var(--width415) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width415) * 16px) 0 calc(var(--width415) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width415) * 16px) 0 calc(var(--width415) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width415) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width415) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width415) * 12px) 0 calc(var(--width415) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width415) * 21px);
    margin-bottom: calc(var(--width415) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width415) * 8px);
    padding-bottom: calc(var(--width415) * 7px);
    margin-bottom: calc(var(--width415) * 10px);
  }

  .author-avatar {
    width: calc(var(--width415) * 36px);
    height: calc(var(--width415) * 36px);
    margin: 0 calc(var(--width415) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width415) * 12px);
    gap: calc(var(--width415) * 4px);
    margin: calc(var(--width415) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width415) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width415) * 2px) calc(var(--width415) * 10px);
    border-radius: calc(var(--width415) * 3px);
    font-size: calc(var(--width415) * 12px);
    margin-top: calc(var(--width415) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width415) * 15px);
    margin-bottom: calc(var(--width415) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width415) * 22px);
    margin: calc(var(--width415) * 18px) 0 calc(var(--width415) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width415) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width415) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width415) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width415) * 12px);
    margin-top: calc(var(--width415) * 6px);
  }

  .artcona {
    margin: calc(var(--width415) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width415) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width415) * 16px);
  }

  .box-title {
    font-size: calc(var(--width415) * 18px);
    margin-bottom: calc(var(--width415) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width415) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width415) * 14px);
    padding: calc(var(--width415) * 15px) calc(var(--width415) * 18px);
    border-radius: 0 calc(var(--width415) * 8px) calc(var(--width415) * 8px) 0;
    margin-bottom: calc(var(--width415) * 14px);
    line-height: calc(var(--width415) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width415) * 2px);
    border-radius: calc(var(--width415) * 2px) 0 0 calc(var(--width415) * 2px);
  }

  .related-list {
    gap: calc(var(--width415) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width415) * 8px);
    font-size: calc(var(--width415) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width415) * 4px);
    height: calc(var(--width415) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width415) * 12px);
    padding: calc(var(--width415) * 14px);
    box-shadow: 0 0 calc(var(--width415) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width415) * 8px);
    margin-bottom: calc(var(--width415) * 16px);
  }

  .tool-icon {
    width: calc(var(--width415) * 56px);
    height: calc(var(--width415) * 56px);
    border-radius: calc(var(--width415) * 8px);
    margin: 0 calc(var(--width415) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width415) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width415) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width415) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width415) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width415) * 10px);
    margin: calc(var(--width415) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width415) * 2px);
    height: calc(var(--width415) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width415) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width415) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width415) * 4px);
    font-size: calc(var(--width415) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width415) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width415) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width415) * 88px);
    height: calc(var(--width415) * 26px);
    border-radius: calc(var(--width415) * 17px);
    font-size: calc(var(--width415) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width415) * 88px);
    height: calc(var(--width415) * 26px);
    border-radius: calc(var(--width415) * 17px);
    gap: calc(var(--width415) * 4px);
    font-size: calc(var(--width415) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width415) * 13px);
    height: calc(var(--width415) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width415) * 12px);
    padding: calc(var(--width415) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width415) * 101px);
    height: calc(var(--width415) * 101px);
    border-radius: calc(var(--width415) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width415) * 88px);
    height: calc(var(--width415) * 88px);
    border-radius: calc(var(--width415) * 8px);
    padding: calc(var(--width415) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width415) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width415) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width415) * 162px);
    height: calc(var(--width415) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width415) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width415) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width415) * 4px);
    font-size: calc(var(--width415) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width415) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width415) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width415) * 1px) calc(var(--width415) * 8px);
    border-radius: calc(var(--width415) * 11px);
    font-size: calc(var(--width415) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width415) * 26px);
    padding: 0 calc(var(--width415) * 14px);
    border-radius: calc(var(--width415) * 13px);
    font-size: calc(var(--width415) * 12px);
    gap: calc(var(--width415) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width415) * 14px);
    height: calc(var(--width415) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width415) * 8px) calc(var(--width415) * 20px);
    font-size: calc(var(--width415) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width415) * 10px);
    margin-bottom: calc(var(--width415) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width415) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width415) * 10px);
    margin-bottom: calc(var(--width415) * 16px);
    border-radius: calc(var(--width415) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width415) * 16px);
    margin: 0 0 calc(var(--width415) * 10px);
  }

  .declared {
    border-radius: calc(var(--width415) * 8px);
    padding: calc(var(--width415) * 16px) calc(var(--width415) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width415) * 90px);
    height: calc(var(--width415) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width415) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width415) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width415) * 14px);
    line-height: calc(var(--width415) * 20px);
    margin: 0 0 calc(var(--width415) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width415) * 10px);
    font-size: calc(var(--width415) * 13px);
    margin: 0 0 calc(var(--width415) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width415) * 8px) calc(var(--width415) * 16px);
    min-height: calc(var(--width415) * 38px);
    box-shadow: 0 0 calc(var(--width415) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width415) * 8px);
    gap: calc(var(--width415) * 4px);
    font-size: calc(var(--width415) * 12px);
  }

  .author-list {
    gap: calc(var(--width415) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width415) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width415) * 10px);
    font-size: calc(var(--width415) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width415) * 4px);
    height: calc(var(--width415) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width415) * 3px);
    font-size: calc(var(--width415) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width415) * 26px);
  }

  .detail-products {
    margin: calc(var(--width415) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width415) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width415) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width415) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width415) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width415) * 3px);
    height: calc(var(--width415) * 14px);
    margin-right: calc(var(--width415) * 8px);
    margin-top: calc(var(--width415) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width415) * 8px) 0 0;
    width: calc(var(--width415) * 12px);
    height: calc(var(--width415) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width415) * 16px);
    margin: calc(var(--width415) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width415) * 15px);
    margin: calc(var(--width415) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width415) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width415) * 6px) calc(var(--width415) * 8px);
    font-size: calc(var(--width415) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width415) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width415) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width415) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width415) * 5px) calc(var(--width415) * 10px);
    font-size: calc(var(--width415) * 12px);
    border-radius: calc(var(--width415) * 5px);
    top: calc(var(--width415) * 5px);
    right: calc(var(--width415) * 5px);
    margin-bottom: calc(var(--width415) * -35px);
  }

  .artcons img {
    height: calc(var(--width415) * 506px);
    border-radius: calc(var(--width415) * 8px);
  }
  .detail-content ol{margin-left:calc(var(--width415) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width415) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width415) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width415) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width415) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width415) * 26px);
    font-size: calc(var(--width415) * 16px);
    margin: calc(var(--width415) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width415) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width415) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width415) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width415) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width415) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width415) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width415) * 120px);
  }

  .artcons {
    font-size: calc(var(--width415) * 16px);
  }

}

@media screen and (max-width: 401px) {
  :root {
    --radius-sm: calc(var(--width400) * 4px);
    --radius-md: calc(var(--width400) * 8px);
    --radius-lg: calc(var(--width400) * 24px);
    --page-pad: calc(var(--width400) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width400) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width400) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width400) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width400) * 48px);
    padding: calc(var(--width400) * 10px) calc(var(--width400) * 16px) calc(var(--width400) * 10px) calc(var(--width400) * 13px);
    box-shadow: 0 0 calc(var(--width400) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width400) * 8px);
    font-size: calc(var(--width400) * 18px);
  }

  .logo-img {
    width: calc(var(--width400) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width400) * 14px);
    margin-left: calc(var(--width400) * 4px);
  }

  .header-actions {
    gap: calc(var(--width400) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width400) * 18px);
    height: calc(var(--width400) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width400) * 320px);
    box-shadow: calc(var(--width400) * -4px) 0 calc(var(--width400) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width400) * 52px);
    padding: 0 calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width400) * 20px);
    height: calc(var(--width400) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width400) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width400) * 14px) calc(var(--width400) * 20px);
    font-size: calc(var(--width400) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width400) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width400) * 48px);
    padding: 0 calc(var(--width400) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width400) * 8px);
    width: calc(var(--width400) * 36px);
    height: calc(var(--width400) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width400) * 20px);
    height: calc(var(--width400) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width400) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width400) * 16px) calc(var(--width400) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width400) * 8px);
    height: calc(var(--width400) * 44px);
    padding: 0 calc(var(--width400) * 16px);
    margin: 0 0 calc(var(--width400) * 18px);
    border-radius: calc(var(--width400) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width400) * 18px);
    height: calc(var(--width400) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width400) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width400) * 10px);
    margin: 0 0 calc(var(--width400) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width400) * 6px);
    min-height: calc(var(--width400) * 52px);
    padding: calc(var(--width400) * 12px) calc(var(--width400) * 16px);
    box-shadow: 0 0 calc(var(--width400) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width400) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width400) * 20px);
    height: calc(var(--width400) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width400) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width400) * 6px);
    height: calc(var(--width400) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width400) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width400) * 6px);
    height: calc(var(--width400) * 44px);
    border-radius: calc(var(--width400) * 21px);
    font-size: calc(var(--width400) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width400) * 16px);
    height: calc(var(--width400) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width400) * 14px);
    height: calc(var(--width400) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width400) * 16px) calc(var(--width400) * 16px) calc(var(--width400) * 26px);
  }

  .sechtitle {
    top: calc(var(--width400) * 12px);
    right: calc(var(--width400) * 12px);
    width: calc(var(--width400) * 36px);
    height: calc(var(--width400) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width400) * 22px);
    height: calc(var(--width400) * 22px);
  }

  .sechcon {
    margin: calc(var(--width400) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width400) * 20px);
    width: calc(var(--width400) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width400) * 198px);
  }

  .serchd {
    height: calc(var(--width400) * 46px);
    margin: 0 0 calc(var(--width400) * 18px);
    border-radius: calc(var(--width400) * 23px);
    padding: 0 calc(var(--width400) * 16px) 0 calc(var(--width400) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width400) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width400) * 36px);
    height: calc(var(--width400) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width400) * 20px);
    height: calc(var(--width400) * 20px);
  }

  .top-btn {
    gap: calc(var(--width400) * 8px);
  }

  .topbtna {
    height: calc(var(--width400) * 18px);
    padding: 0 calc(var(--width400) * 12px);
    border-radius: calc(var(--width400) * 11px);
    font-size: calc(var(--width400) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width400) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width400) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width400) * 6px);
    font-size: calc(var(--width400) * 32px);
    line-height: calc(var(--width400) * 36px);
    margin: calc(var(--width400) * 26px) 0 calc(var(--width400) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width400) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width400) * 6px) auto;
    letter-spacing: calc(var(--width400) * 4px);
    width: calc(var(--width400) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width400) * 12px);
    margin-bottom: calc(var(--width400) * 15px);
    letter-spacing: calc(var(--width400) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width400) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width400) * 98px);
    height: calc(var(--width400) * 32px);
    border-radius: calc(var(--width400) * 22px);
    font-size: calc(var(--width400) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width400) * 44px);
    width: calc(var(--width400) * 98px);
    height: calc(var(--width400) * 32px);
    border-radius: calc(var(--width400) * 26px);
    font-size: calc(var(--width400) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width400) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width400) * 12px);
  }

  .section-title {
    font-size: calc(var(--width400) * 18px);
  }

  .section-more {
    font-size: calc(var(--width400) * 14px);
  }

  .section-more b {
    width: calc(var(--width400) * 8px);
    height: calc(var(--width400) * 8px);
    margin: 0 0 0 calc(var(--width400) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width400) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width400) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width400) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width400) * 308px);
    border-radius: calc(var(--width400) * 5px);
    width: calc(var(--width400) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width400) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width400) * 8px);
    margin: calc(var(--width400) * 5px) calc(var(--width400) * 6px) 0 calc(var(--width400) * 10px);
    min-height: calc(var(--width400) * 56px);
    padding: 0 0 calc(var(--width400) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width400) * 3px);
    right: calc(var(--width400) * 3px);
    bottom: 0;
    height: calc(var(--width400) * 1px);
  }

  .card-icon {
    width: calc(var(--width400) * 40px);
    height: calc(var(--width400) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width400) * 14px);
    margin: 0 0 calc(var(--width400) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width400) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width400) * 6px);
    min-width: 0;
    font-size: calc(var(--width400) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width400) * 8px);
    height: calc(var(--width400) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width400) * 3px);
    height: calc(var(--width400) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width400) * 12px);
    margin: 0 0 calc(var(--width400) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width400) * 10px) calc(var(--width400) * 10px) calc(var(--width400) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width400) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width400) * 10px);
    font-size: calc(var(--width400) * 12px);
    width: calc(var(--width400) * 145px);
    height: calc(var(--width400) * 28px);
    border-radius: calc(var(--width400) * 14px);
  }

  .card-more b {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 9px);
    margin: 0 0 0 calc(var(--width400) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width400) * 4px);
    margin-top: calc(var(--width400) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width400) * 4px);
    height: calc(var(--width400) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width400) * 20px);
    border-radius: calc(var(--width400) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width400) * 14px) 0 calc(var(--width400) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width400) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width400) * 8px);
  }

  .tags-list {
    gap: calc(var(--width400) * 8px);
  }

  .tag {
    padding: calc(var(--width400) * 4px) calc(var(--width400) * 16px);
    border-radius: calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width400) * 12px);
    padding: calc(var(--width400) * 2px) calc(var(--width400) * 8px);
    border-radius: calc(var(--width400) * 12px);
  }

  .products-grid {
    gap: calc(var(--width400) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width400) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width400) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width400) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width400) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width400) * 16px);
    gap: calc(var(--width400) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width400) * 4px);
    height: calc(var(--width400) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width400) * 20px);
    border-radius: calc(var(--width400) * 2px);
  }

  .product-card {
    padding: calc(var(--width400) * 10px);
    min-width: 0;
    border-radius: calc(var(--width400) * 8px);
    box-shadow: 0 0 calc(var(--width400) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width400) * 10px);
    top: calc(var(--width400) * 8px);
    left: calc(var(--width400) * 10px);
    gap: calc(var(--width400) * 3px);
    max-width: calc(100% - calc(var(--width400) * 36px));
  }

  .tagsa {
    padding: calc(var(--width400) * 1px) calc(var(--width400) * 5px);
    font-size: calc(var(--width400) * 10px);
    border-radius: calc(var(--width400) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width400) * 1px) calc(var(--width400) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width400) * 8px);
    margin: calc(var(--width400) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width400) * 16px);
    margin: calc(var(--width400) * 7px) 0 calc(var(--width400) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width400) * 12px);
    margin-bottom: calc(var(--width400) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width400) * 11px);
  }

  .product-rating b {
    width: calc(var(--width400) * 10px);
    height: calc(var(--width400) * 10px);
    margin: 0 calc(var(--width400) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width400) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width400) * 24px);
    margin: calc(var(--width400) * 32px) auto calc(var(--width400) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width400) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width400) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width400) * 98px);
    padding: 0 calc(var(--width400) * 24px);
    height: calc(var(--width400) * 32px);
    border-radius: calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width400) * 9px);
    height: calc(var(--width400) * 5px);
    margin: 0 0 0 calc(var(--width400) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width400) * 88px);
    width: calc(var(--width400) * 88px);
    height: calc(var(--width400) * 28px);
    border-radius: calc(var(--width400) * 15px);
    font-size: calc(var(--width400) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width400) * 88px);
    width: calc(var(--width400) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width400) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width400) * 34px);
    border-radius: calc(var(--width400) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width400) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width400) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width400) * 8px);
    height: calc(var(--width400) * 34px);
    padding: 0 0 0 calc(var(--width400) * 7px);
    font-size: calc(var(--width400) * 16px);
    line-height: calc(var(--width400) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width400) * 18px);
    height: calc(var(--width400) * 18px);
    margin: 0 calc(var(--width400) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width400) * 4px);
    font-size: calc(var(--width400) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width400) * 11px);
    height: calc(var(--width400) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width400) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width400) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width400) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width400) * 12px);
    padding: calc(var(--width400) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width400) * 16px);
    margin-bottom: calc(var(--width400) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width400) * 14px);
    max-height: calc(var(--width400) * 20px);
    line-height: calc(var(--width400) * 18px);
    margin-bottom: calc(var(--width400) * 3px);
  }

  .article-tags {
    gap: calc(var(--width400) * 6px);
    margin-top: calc(var(--width400) * 4px);
  }

  .article-tag {
    padding: calc(var(--width400) * 1px) calc(var(--width400) * 8px);
    border-radius: calc(var(--width400) * 11px);
    font-size: calc(var(--width400) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width400) * 1px) calc(var(--width400) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width400) * 3px) calc(var(--width400) * 8px);
    font-size: calc(var(--width400) * 12px);
    border-radius: calc(var(--width400) * 12px);
  }

  .article-info {
    font-size: calc(var(--width400) * 12px);
    gap: calc(var(--width400) * 10px);
  }

  .article-thumb {
    width: calc(var(--width400) * 148px);
    height: calc(var(--width400) * 88px);
    border-radius: calc(var(--width400) * 6px);
    margin-top: calc(var(--width400) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width400) * 88px);
    height: calc(var(--width400) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width400) * 6px);
    height: calc(var(--width400) * 38px);
    margin-top: calc(var(--width400) * 16px);
    border-radius: calc(var(--width400) * 21px);
    font-size: calc(var(--width400) * 16px);
  }

  .icon-more {
    width: calc(var(--width400) * 16px);
    height: calc(var(--width400) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width400) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width400) * 3px) 0 0;
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width400) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width400) * 10px);
    padding: calc(var(--width400) * 12px) 0;
    font-size: calc(var(--width400) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width400) * 16px);
    height: calc(var(--width400) * 16px);
    margin: 0 calc(var(--width400) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width400) * 12px);
    padding-top: calc(var(--width400) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width400) * 12px);
    padding: calc(var(--width400) * 7px) 0;
    font-size: calc(var(--width400) * 13px);
    border-radius: calc(var(--width400) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width400) * 4px);
    width: calc(var(--width400) * 10px);
    height: calc(var(--width400) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width400) * 12px);
    margin: calc(var(--width400) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width400) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width400) * 16px) calc(var(--width400) * 15px) 0 calc(var(--width400) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width400) * 8px);
    margin-bottom: calc(var(--width400) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width400) * 198px);
    padding: 0 0 0 calc(var(--width400) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width400) * 14px);
    margin-bottom: calc(var(--width400) * 10px);
  }

  .footer-social {
    gap: calc(var(--width400) * 12px);
  }

  .footer-social a {
    width: calc(var(--width400) * 32px);
    height: calc(var(--width400) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width400) * 28px);
    height: calc(var(--width400) * 28px);
  }

  .footer-links {
    padding: calc(var(--width400) * 28px) calc(var(--width400) * 15px) calc(var(--width400) * 15px) calc(var(--width400) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width400) * 16px);
    margin-bottom: calc(var(--width400) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width400) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width400) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width400) * 15px) 0 calc(var(--width400) * 15px);
    gap: calc(var(--width400) * 15px);
    border-radius: calc(var(--width400) * 12px);
    padding: calc(var(--width400) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width400) * 120px);
    height: calc(var(--width400) * 120px);
    border-radius: calc(var(--width400) * 4px);
    margin: 0;
    margin: calc(var(--width400) * 10px) 0 calc(var(--width400) * 10px) calc(var(--width400) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width400) * 106px);
    height: calc(var(--width400) * 106px);
    border-radius: calc(var(--width400) * 4px);
  }

  .foot-line {
    width: calc(var(--width400) * 2px);
    height: calc(var(--width400) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width400) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width400) * 14px);
    margin: calc(var(--width400) * 6px) 0 calc(var(--width400) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width400) * 152px);
    height: calc(var(--width400) * 32px);
    padding: 0 calc(var(--width400) * 12px);
    border-radius: calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width400) * 14px) 0 calc(var(--width400) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width400) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width400) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width400) * 4px);
  }

  .gh {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width400) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width400) * 33px) 0 calc(var(--width400) * 26px);
  }

  .search-hero {
    padding: calc(var(--width400) * 20px) 0 calc(var(--width400) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width400) * 70px) 0 calc(var(--width400) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width400) * 14px);
  }

  .search-brand img {
    height: calc(var(--width400) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width400) * 14px);
    border-radius: calc(var(--width400) * 24px);
    padding: calc(var(--width400) * 3px) calc(var(--width400) * 3px) calc(var(--width400) * 3px) 0;
    height: calc(var(--width400) * 32px);
    box-shadow: 0 calc(var(--width400) * 2px) calc(var(--width400) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width400) * 12px) 0 calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width400) * 12px);
    height: calc(var(--width400) * 28px);
    border-radius: calc(var(--width400) * 19px);
    font-size: calc(var(--width400) * 12px);
  }

  .search-submit b {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
    margin: 0 calc(var(--width400) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width400) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width400) * 14px);
    line-height: calc(var(--width400) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width400) * 10px);
    max-height: calc(var(--width400) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width400) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 7px);
  }

  .search-main {
    padding: calc(var(--width400) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width400) * -32px));
    margin: 0 0 calc(var(--width400) * 17px) 0;
    padding: 0  calc(var(--width400) * 22px);
    height: calc(var(--width400) * 42px);
    box-shadow: 0 0 calc(var(--width400) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width400) * 8px);
    gap: calc(var(--width400) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width400) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width400) * 6px);
    width: calc(var(--width400) * 16px);
    height: calc(var(--width400) * 2px);
  }

  .search-right {
    font-size: calc(var(--width400) * 12px);
    margin: calc(var(--width400) * 12px) 0 calc(var(--width400) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width400) * 13px);
  }

  .empty-state {
    padding: calc(var(--width400) * 70px) 0 calc(var(--width400) * 68px);
  }

  .empty-img {
    width: calc(var(--width400) * 259px);
    margin: 0 auto calc(var(--width400) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width400) * 14px);
    margin: 0 auto calc(var(--width400) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width400) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width400) * 16px) 0 calc(var(--width400) * 32px);
  }

  .pagination {
    gap: calc(var(--width400) * 12px);
    margin-top: calc(var(--width400) * 20px);
  }

  .page-btns {
    gap: calc(var(--width400) * 10px) calc(var(--width400) * 4px);
  }

  .page-extra {
    gap: calc(var(--width400) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width400) * 32px);
    height: calc(var(--width400) * 32px);
    padding: 0 calc(var(--width400) * 8px);
    border-radius: calc(var(--width400) * 4px);
    font-size: calc(var(--width400) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width400) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width400) * 2px);
    font-size: calc(var(--width400) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width400) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width400) * 36px);
    height: calc(var(--width400) * 28px);
    border-radius: calc(var(--width400) * 6px);
    font-size: calc(var(--width400) * 12px);
    margin: 0 calc(var(--width400) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width400) * 14px);
    height: calc(var(--width400) * 28px);
    margin-left: calc(var(--width400) * 4px);
    border-radius: calc(var(--width400) * 3px);
    font-size: calc(var(--width400) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width400) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width400) * 27px);
    padding: calc(var(--width400) * 12px) calc(var(--width400) * 15px) 0 calc(var(--width400) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width400) * 4px);
    min-width: calc(var(--width400) * 68px);
    padding: 0;
    font-size: calc(var(--width400) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width400) * 20px);
    height: calc(var(--width400) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width400) * 20px);
    height: calc(var(--width400) * 3px);
    border-radius: calc(var(--width400) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width400) * 8px);
    padding: calc(var(--width400) * 15px) calc(var(--width400) * 12px) calc(var(--width400) * 10px) calc(var(--width400) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width400) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width400) * 32px);
    padding: 0 calc(var(--width400) * 12px);
    border-radius: calc(var(--width400) * 8px);
    font-size: calc(var(--width400) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width400) * 40px);
    gap: calc(var(--width400) * 2px);
    font-size: calc(var(--width400) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width400) * 18px);
    height: calc(var(--width400) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width400) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width400) * 8px);
    padding: calc(var(--width400) * 8px) calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width400) * 2px);
    height: calc(var(--width400) * 40px);
    border-radius: calc(var(--width400) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width400) * 18px);
    height: calc(var(--width400) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width400) * 10px);
    height: calc(var(--width400) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width400) * 4px) 0 calc(var(--width400) * 8px);
    gap: calc(var(--width400) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width400) * 7px) calc(var(--width400) * 3px);
    font-size: calc(var(--width400) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width400) * 26px);
    width: calc(var(--width400) * 6px);
    height: calc(var(--width400) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width400) * 18px);
    height: calc(var(--width400) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width400) * 10px);
    height: calc(var(--width400) * 12px);
    margin: 0 calc(var(--width400) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width400) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width400) * 12px) 0 calc(var(--width400) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width400) * 14px) calc(var(--width400) * 14px) calc(var(--width400) * 14px) calc(var(--width400) * 16px);
    margin: calc(var(--width400) * 12px) 0 calc(var(--width400) * 14px);
    border-radius: calc(var(--width400) * 10px);
    min-height: calc(var(--width400) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width400) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width400) * 14px);
    line-height: calc(var(--width400) * 18px);
    margin: calc(var(--width400) * 6px) 0 calc(var(--width400) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width400) * 12px);
    gap: calc(var(--width400) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width400) * 3px) 0 0;
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width400) * 3px) 0 0;
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width400) * 4px);
    padding: 0 0 calc(var(--width400) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width400) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width400) * 12px);
    margin-bottom: calc(var(--width400) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width400) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width400) * 10px) calc(var(--width400) * 15px) calc(var(--width400) * 12px) calc(var(--width400) * 15px);
    margin: calc(var(--width400) * 24px) 0 calc(var(--width400) * 16px);
    border-radius: calc(var(--width400) * 10px);
    min-height: calc(var(--width400) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width400) * 8px);
    min-width: 0;
    margin: calc(var(--width400) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width400) * 72px);
    height: calc(var(--width400) * 28px);
    padding: 0 calc(var(--width400) * 12px);
    border-radius: calc(var(--width400) * 14px);
    font-size: calc(var(--width400) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width400) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width400) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width400) * 24px);
    height: calc(var(--width400) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width400) * 15px) calc(var(--width400) * 12px) 0 calc(var(--width400) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width400) * 10px);
    margin-left: calc(var(--width400) * 2px);
  }

  .banner-img {
    width: calc(var(--width400) * 80px);
    height: calc(var(--width400) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width400) * 48px);
    padding: 0 calc(var(--width400) * 18px);
  }

  .catalog-back {
    left: calc(var(--width400) * 8px);
    width: calc(var(--width400) * 36px);
    height: calc(var(--width400) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width400) * 20px);
    height: calc(var(--width400) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width400) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width400) * 16px) calc(var(--width400) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width400) * 18px);
    margin: 0 0 calc(var(--width400) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width400) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width400) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width400) * 8px);
    box-shadow: 0 0 calc(var(--width400) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width400) * 4px);
    padding: calc(var(--width400) * 12px) calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width400) * 20px);
    height: calc(var(--width400) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width400) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width400) * 6px);
    height: calc(var(--width400) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width400) * 12px) calc(var(--width400) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width400) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width400) * 34px);
    padding: 0 calc(var(--width400) * 6px);
    border-radius: calc(var(--width400) * 8px);
    font-size: calc(var(--width400) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width400) * 16px) calc(var(--width400) * 10px);
    padding-bottom: calc(var(--width400) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width400) * 6px);
    min-width: 0;
    font-size: calc(var(--width400) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width400) * 18px);
    height: calc(var(--width400) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width400) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width400) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width400) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width400) * 120px);
    height: calc(var(--width400) * 68px);
    border-radius: calc(var(--width400) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width400) * 16px);
    min-height: calc(var(--width400) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width400) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width400) * 12px) 0 calc(var(--width400) * 10px);
    gap: calc(var(--width400) * 6px);
    font-size: calc(var(--width400) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width400) * 14px);
    height: calc(var(--width400) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width400) * 12px);
    margin: 0;
    padding: calc(var(--width400) * 16px);
    border-radius: calc(var(--width400) * 12px);
    box-shadow: 0 calc(var(--width400) * 2px) calc(var(--width400) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width400) * 206px);
    border-radius: calc(var(--width400) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width400) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width400) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width400) * 16px);
    margin: calc(var(--width400) * 4px) 0 calc(var(--width400) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width400) * 20px);
    font-size: calc(var(--width400) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width400) * 8px);
    margin-top: calc(var(--width400) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width400) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width400) * 2px) calc(var(--width400) * 10px);
    border-radius: calc(var(--width400) * 999px);
    font-size: calc(var(--width400) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width400) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width400) * 8px);
    padding: calc(var(--width400) * 10px) calc(var(--width400) * 15px) calc(var(--width400) * 16px) calc(var(--width400) * 15px);
    margin-bottom: calc(var(--width400) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width400) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width400) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width400) * 10px);
    padding: calc(var(--width400) * 10px) 0;
    font-size: calc(var(--width400) * 13px);
  }

  .widget-icon {
    width: calc(var(--width400) * 18px);
    height: calc(var(--width400) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width400) * 48px);
    height: calc(var(--width400) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width400) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width400) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width400) * 120px);
    height: calc(var(--width400) * 68px);
    border-radius: calc(var(--width400) * 4px);
    margin: 0 calc(var(--width400) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width400) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width400) * 16px);
    line-height: calc(var(--width400) * 18px);
    min-height: calc(var(--width400) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 12px);
    line-height: calc(var(--width400) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width400) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width400) * 14px);
    height: calc(var(--width400) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width400) * 14px);
    height: calc(var(--width400) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width400) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width400) * 110px);
    height: calc(var(--width400) * 62px);
    border-radius: calc(var(--width400) * 4px);
    margin: 0 calc(var(--width400) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width400) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width400) * 16px);
    line-height: calc(var(--width400) * 18px);
    min-height: calc(var(--width400) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 12px);
    line-height: calc(var(--width400) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width400) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width400) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width400) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width400) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width400) * 48px);
    height: calc(var(--width400) * 48px);
    border-radius: calc(var(--width400) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width400) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width400) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width400) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width400) * 2px);
    width: calc(var(--width400) * 68px);
    height: calc(var(--width400) * 27px);
    padding: 0;
    border-radius: calc(var(--width400) * 14px);
    font-size: calc(var(--width400) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width400) * 11px);
    height: calc(var(--width400) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width400) * 16px);
    padding: 0 0 0 calc(var(--width400) * 18px);
    font-size: calc(var(--width400) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width400) * 4px);
    height: calc(var(--width400) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width400) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width400) * 12px);
    padding: calc(var(--width400) * 8px) 0;
    font-size: calc(var(--width400) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width400) * 8px);
  }

  .widget-links {
    gap: calc(var(--width400) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width400) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width400) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width400) * 6px) 0 calc(var(--width400) * 6px);
    font-size: calc(var(--width400) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width400) * 12px) 0;
    font-size: calc(var(--width400) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width400) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width400) * 72px);
    padding-left: calc(var(--width400) * 16px);
    padding-right: calc(var(--width400) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width400) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width400) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width400) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width400) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width400) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width400) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width400) * 16px);
    font-size: calc(var(--width400) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width400) * 4px) calc(var(--width400) * 8px);
    border-radius: calc(var(--width400) * 4px);
    font-size: calc(var(--width400) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width400) * 16px) 0 calc(var(--width400) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width400) * 16px) 0 calc(var(--width400) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width400) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width400) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width400) * 12px) 0 calc(var(--width400) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width400) * 21px);
    margin-bottom: calc(var(--width400) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width400) * 8px);
    padding-bottom: calc(var(--width400) * 7px);
    margin-bottom: calc(var(--width400) * 10px);
  }

  .author-avatar {
    width: calc(var(--width400) * 36px);
    height: calc(var(--width400) * 36px);
    margin: 0 calc(var(--width400) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width400) * 12px);
    gap: calc(var(--width400) * 4px);
    margin: calc(var(--width400) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width400) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width400) * 2px) calc(var(--width400) * 10px);
    border-radius: calc(var(--width400) * 3px);
    font-size: calc(var(--width400) * 12px);
    margin-top: calc(var(--width400) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width400) * 15px);
    margin-bottom: calc(var(--width400) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width400) * 22px);
    margin: calc(var(--width400) * 18px) 0 calc(var(--width400) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width400) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width400) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width400) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width400) * 12px);
    margin-top: calc(var(--width400) * 6px);
  }

  .artcona {
    margin: calc(var(--width400) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width400) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width400) * 16px);
  }

  .box-title {
    font-size: calc(var(--width400) * 18px);
    margin-bottom: calc(var(--width400) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width400) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width400) * 14px);
    padding: calc(var(--width400) * 15px) calc(var(--width400) * 18px);
    border-radius: 0 calc(var(--width400) * 8px) calc(var(--width400) * 8px) 0;
    margin-bottom: calc(var(--width400) * 14px);
    line-height: calc(var(--width400) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width400) * 2px);
    border-radius: calc(var(--width400) * 2px) 0 0 calc(var(--width400) * 2px);
  }

  .related-list {
    gap: calc(var(--width400) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width400) * 8px);
    font-size: calc(var(--width400) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width400) * 4px);
    height: calc(var(--width400) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width400) * 12px);
    padding: calc(var(--width400) * 14px);
    box-shadow: 0 0 calc(var(--width400) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width400) * 8px);
    margin-bottom: calc(var(--width400) * 16px);
  }

  .tool-icon {
    width: calc(var(--width400) * 56px);
    height: calc(var(--width400) * 56px);
    border-radius: calc(var(--width400) * 8px);
    margin: 0 calc(var(--width400) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width400) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width400) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width400) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width400) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width400) * 10px);
    margin: calc(var(--width400) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width400) * 2px);
    height: calc(var(--width400) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width400) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width400) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width400) * 4px);
    font-size: calc(var(--width400) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width400) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width400) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width400) * 88px);
    height: calc(var(--width400) * 26px);
    border-radius: calc(var(--width400) * 17px);
    font-size: calc(var(--width400) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width400) * 88px);
    height: calc(var(--width400) * 26px);
    border-radius: calc(var(--width400) * 17px);
    gap: calc(var(--width400) * 4px);
    font-size: calc(var(--width400) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width400) * 13px);
    height: calc(var(--width400) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width400) * 12px);
    padding: calc(var(--width400) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width400) * 101px);
    height: calc(var(--width400) * 101px);
    border-radius: calc(var(--width400) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width400) * 88px);
    height: calc(var(--width400) * 88px);
    border-radius: calc(var(--width400) * 8px);
    padding: calc(var(--width400) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width400) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width400) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width400) * 162px);
    height: calc(var(--width400) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width400) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width400) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width400) * 4px);
    font-size: calc(var(--width400) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width400) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width400) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width400) * 1px) calc(var(--width400) * 8px);
    border-radius: calc(var(--width400) * 11px);
    font-size: calc(var(--width400) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width400) * 26px);
    padding: 0 calc(var(--width400) * 14px);
    border-radius: calc(var(--width400) * 13px);
    font-size: calc(var(--width400) * 12px);
    gap: calc(var(--width400) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width400) * 14px);
    height: calc(var(--width400) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width400) * 8px) calc(var(--width400) * 20px);
    font-size: calc(var(--width400) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width400) * 10px);
    margin-bottom: calc(var(--width400) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width400) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width400) * 10px);
    margin-bottom: calc(var(--width400) * 16px);
    border-radius: calc(var(--width400) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width400) * 16px);
    margin: 0 0 calc(var(--width400) * 10px);
  }

  .declared {
    border-radius: calc(var(--width400) * 8px);
    padding: calc(var(--width400) * 16px) calc(var(--width400) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width400) * 90px);
    height: calc(var(--width400) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width400) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width400) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width400) * 14px);
    line-height: calc(var(--width400) * 20px);
    margin: 0 0 calc(var(--width400) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width400) * 10px);
    font-size: calc(var(--width400) * 13px);
    margin: 0 0 calc(var(--width400) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width400) * 8px) calc(var(--width400) * 16px);
    min-height: calc(var(--width400) * 38px);
    box-shadow: 0 0 calc(var(--width400) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width400) * 8px);
    gap: calc(var(--width400) * 4px);
    font-size: calc(var(--width400) * 12px);
  }

  .author-list {
    gap: calc(var(--width400) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width400) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width400) * 10px);
    font-size: calc(var(--width400) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width400) * 4px);
    height: calc(var(--width400) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width400) * 3px);
    font-size: calc(var(--width400) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width400) * 26px);
  }

  .detail-products {
    margin: calc(var(--width400) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width400) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width400) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width400) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width400) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width400) * 3px);
    height: calc(var(--width400) * 14px);
    margin-right: calc(var(--width400) * 8px);
    margin-top: calc(var(--width400) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width400) * 8px) 0 0;
    width: calc(var(--width400) * 12px);
    height: calc(var(--width400) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width400) * 16px);
    margin: calc(var(--width400) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width400) * 15px);
    margin: calc(var(--width400) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width400) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width400) * 6px) calc(var(--width400) * 8px);
    font-size: calc(var(--width400) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width400) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width400) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width400) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width400) * 5px) calc(var(--width400) * 10px);
    font-size: calc(var(--width400) * 12px);
    border-radius: calc(var(--width400) * 5px);
    top: calc(var(--width400) * 5px);
    right: calc(var(--width400) * 5px);
    margin-bottom: calc(var(--width400) * -35px);
  }

  .artcons img {
    height: calc(var(--width400) * 506px);
    border-radius: calc(var(--width400) * 8px);
  }
  .detail-content ol{margin-left:calc(var(--width400) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width400) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width400) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width400) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width400) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width400) * 26px);
    font-size: calc(var(--width400) * 16px);
    margin: calc(var(--width400) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width400) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width400) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width400) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width400) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width400) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width400) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width400) * 120px);
  }

  .artcons {
    font-size: calc(var(--width400) * 16px);
  }

}

@media screen and (max-width: 395px) {
  :root {
    --radius-sm: calc(var(--width395) * 4px);
    --radius-md: calc(var(--width395) * 8px);
    --radius-lg: calc(var(--width395) * 24px);
    --page-pad: calc(var(--width395) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width395) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width395) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width395) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width395) * 48px);
    padding: calc(var(--width395) * 10px) calc(var(--width395) * 16px) calc(var(--width395) * 10px) calc(var(--width395) * 13px);
    box-shadow: 0 0 calc(var(--width395) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width395) * 8px);
    font-size: calc(var(--width395) * 18px);
  }

  .logo-img {
    width: calc(var(--width395) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width395) * 14px);
    margin-left: calc(var(--width395) * 4px);
  }

  .header-actions {
    gap: calc(var(--width395) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width395) * 18px);
    height: calc(var(--width395) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width395) * 320px);
    box-shadow: calc(var(--width395) * -4px) 0 calc(var(--width395) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width395) * 52px);
    padding: 0 calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width395) * 20px);
    height: calc(var(--width395) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width395) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width395) * 14px) calc(var(--width395) * 20px);
    font-size: calc(var(--width395) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width395) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width395) * 48px);
    padding: 0 calc(var(--width395) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width395) * 8px);
    width: calc(var(--width395) * 36px);
    height: calc(var(--width395) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width395) * 20px);
    height: calc(var(--width395) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width395) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width395) * 16px) calc(var(--width395) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width395) * 8px);
    height: calc(var(--width395) * 44px);
    padding: 0 calc(var(--width395) * 16px);
    margin: 0 0 calc(var(--width395) * 18px);
    border-radius: calc(var(--width395) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width395) * 18px);
    height: calc(var(--width395) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width395) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width395) * 10px);
    margin: 0 0 calc(var(--width395) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width395) * 6px);
    min-height: calc(var(--width395) * 52px);
    padding: calc(var(--width395) * 12px) calc(var(--width395) * 16px);
    box-shadow: 0 0 calc(var(--width395) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width395) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width395) * 20px);
    height: calc(var(--width395) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width395) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width395) * 6px);
    height: calc(var(--width395) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width395) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width395) * 6px);
    height: calc(var(--width395) * 44px);
    border-radius: calc(var(--width395) * 21px);
    font-size: calc(var(--width395) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width395) * 16px);
    height: calc(var(--width395) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width395) * 14px);
    height: calc(var(--width395) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width395) * 16px) calc(var(--width395) * 16px) calc(var(--width395) * 26px);
  }

  .sechtitle {
    top: calc(var(--width395) * 12px);
    right: calc(var(--width395) * 12px);
    width: calc(var(--width395) * 36px);
    height: calc(var(--width395) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width395) * 22px);
    height: calc(var(--width395) * 22px);
  }

  .sechcon {
    margin: calc(var(--width395) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width395) * 20px);
    width: calc(var(--width395) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width395) * 198px);
  }

  .serchd {
    height: calc(var(--width395) * 46px);
    margin: 0 0 calc(var(--width395) * 18px);
    border-radius: calc(var(--width395) * 23px);
    padding: 0 calc(var(--width395) * 16px) 0 calc(var(--width395) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width395) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width395) * 36px);
    height: calc(var(--width395) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width395) * 20px);
    height: calc(var(--width395) * 20px);
  }

  .top-btn {
    gap: calc(var(--width395) * 8px);
  }

  .topbtna {
    height: calc(var(--width395) * 18px);
    padding: 0 calc(var(--width395) * 12px);
    border-radius: calc(var(--width395) * 11px);
    font-size: calc(var(--width395) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width395) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width395) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width395) * 6px);
    font-size: calc(var(--width395) * 32px);
    line-height: calc(var(--width395) * 36px);
    margin: calc(var(--width395) * 26px) 0 calc(var(--width395) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width395) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width395) * 6px) auto;
    letter-spacing: calc(var(--width395) * 4px);
    width: calc(var(--width395) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width395) * 12px);
    margin-bottom: calc(var(--width395) * 15px);
    letter-spacing: calc(var(--width395) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width395) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width395) * 98px);
    height: calc(var(--width395) * 32px);
    border-radius: calc(var(--width395) * 22px);
    font-size: calc(var(--width395) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width395) * 44px);
    width: calc(var(--width395) * 98px);
    height: calc(var(--width395) * 32px);
    border-radius: calc(var(--width395) * 26px);
    font-size: calc(var(--width395) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width395) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width395) * 12px);
  }

  .section-title {
    font-size: calc(var(--width395) * 18px);
  }

  .section-more {
    font-size: calc(var(--width395) * 14px);
  }

  .section-more b {
    width: calc(var(--width395) * 8px);
    height: calc(var(--width395) * 8px);
    margin: 0 0 0 calc(var(--width395) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width395) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width395) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width395) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width395) * 308px);
    border-radius: calc(var(--width395) * 5px);
    width: calc(var(--width395) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width395) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width395) * 8px);
    margin: calc(var(--width395) * 5px) calc(var(--width395) * 6px) 0 calc(var(--width395) * 10px);
    min-height: calc(var(--width395) * 56px);
    padding: 0 0 calc(var(--width395) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width395) * 3px);
    right: calc(var(--width395) * 3px);
    bottom: 0;
    height: calc(var(--width395) * 1px);
  }

  .card-icon {
    width: calc(var(--width395) * 40px);
    height: calc(var(--width395) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width395) * 14px);
    margin: 0 0 calc(var(--width395) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width395) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width395) * 6px);
    min-width: 0;
    font-size: calc(var(--width395) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width395) * 8px);
    height: calc(var(--width395) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width395) * 3px);
    height: calc(var(--width395) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width395) * 12px);
    margin: 0 0 calc(var(--width395) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width395) * 10px) calc(var(--width395) * 10px) calc(var(--width395) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width395) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width395) * 10px);
    font-size: calc(var(--width395) * 12px);
    width: calc(var(--width395) * 145px);
    height: calc(var(--width395) * 28px);
    border-radius: calc(var(--width395) * 14px);
  }

  .card-more b {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 9px);
    margin: 0 0 0 calc(var(--width395) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width395) * 4px);
    margin-top: calc(var(--width395) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width395) * 4px);
    height: calc(var(--width395) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width395) * 20px);
    border-radius: calc(var(--width395) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width395) * 14px) 0 calc(var(--width395) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width395) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width395) * 8px);
  }

  .tags-list {
    gap: calc(var(--width395) * 8px);
  }

  .tag {
    padding: calc(var(--width395) * 4px) calc(var(--width395) * 16px);
    border-radius: calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width395) * 12px);
    padding: calc(var(--width395) * 2px) calc(var(--width395) * 8px);
    border-radius: calc(var(--width395) * 12px);
  }

  .products-grid {
    gap: calc(var(--width395) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width395) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width395) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width395) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width395) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width395) * 16px);
    gap: calc(var(--width395) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width395) * 4px);
    height: calc(var(--width395) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width395) * 20px);
    border-radius: calc(var(--width395) * 2px);
  }

  .product-card {
    padding: calc(var(--width395) * 10px);
    min-width: 0;
    border-radius: calc(var(--width395) * 8px);
    box-shadow: 0 0 calc(var(--width395) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width395) * 10px);
    top: calc(var(--width395) * 8px);
    left: calc(var(--width395) * 10px);
    gap: calc(var(--width395) * 3px);
    max-width: calc(100% - calc(var(--width395) * 36px));
  }

  .tagsa {
    padding: calc(var(--width395) * 1px) calc(var(--width395) * 5px);
    font-size: calc(var(--width395) * 10px);
    border-radius: calc(var(--width395) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width395) * 1px) calc(var(--width395) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width395) * 8px);
    margin: calc(var(--width395) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width395) * 16px);
    margin: calc(var(--width395) * 7px) 0 calc(var(--width395) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width395) * 12px);
    margin-bottom: calc(var(--width395) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width395) * 11px);
  }

  .product-rating b {
    width: calc(var(--width395) * 10px);
    height: calc(var(--width395) * 10px);
    margin: 0 calc(var(--width395) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width395) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width395) * 24px);
    margin: calc(var(--width395) * 32px) auto calc(var(--width395) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width395) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width395) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width395) * 98px);
    padding: 0 calc(var(--width395) * 24px);
    height: calc(var(--width395) * 32px);
    border-radius: calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width395) * 9px);
    height: calc(var(--width395) * 5px);
    margin: 0 0 0 calc(var(--width395) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width395) * 88px);
    width: calc(var(--width395) * 88px);
    height: calc(var(--width395) * 28px);
    border-radius: calc(var(--width395) * 15px);
    font-size: calc(var(--width395) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width395) * 88px);
    width: calc(var(--width395) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width395) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width395) * 34px);
    border-radius: calc(var(--width395) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width395) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width395) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width395) * 8px);
    height: calc(var(--width395) * 34px);
    padding: 0 0 0 calc(var(--width395) * 7px);
    font-size: calc(var(--width395) * 16px);
    line-height: calc(var(--width395) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width395) * 18px);
    height: calc(var(--width395) * 18px);
    margin: 0 calc(var(--width395) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width395) * 4px);
    font-size: calc(var(--width395) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width395) * 11px);
    height: calc(var(--width395) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width395) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width395) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width395) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width395) * 12px);
    padding: calc(var(--width395) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width395) * 16px);
    margin-bottom: calc(var(--width395) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width395) * 14px);
    max-height: calc(var(--width395) * 20px);
    line-height: calc(var(--width395) * 18px);
    margin-bottom: calc(var(--width395) * 3px);
  }

  .article-tags {
    gap: calc(var(--width395) * 6px);
    margin-top: calc(var(--width395) * 4px);
  }

  .article-tag {
    padding: calc(var(--width395) * 1px) calc(var(--width395) * 8px);
    border-radius: calc(var(--width395) * 11px);
    font-size: calc(var(--width395) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width395) * 1px) calc(var(--width395) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width395) * 3px) calc(var(--width395) * 8px);
    font-size: calc(var(--width395) * 12px);
    border-radius: calc(var(--width395) * 12px);
  }

  .article-info {
    font-size: calc(var(--width395) * 12px);
    gap: calc(var(--width395) * 10px);
  }

  .article-thumb {
    width: calc(var(--width395) * 148px);
    height: calc(var(--width395) * 88px);
    border-radius: calc(var(--width395) * 6px);
    margin-top: calc(var(--width395) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width395) * 88px);
    height: calc(var(--width395) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width395) * 6px);
    height: calc(var(--width395) * 38px);
    margin-top: calc(var(--width395) * 16px);
    border-radius: calc(var(--width395) * 21px);
    font-size: calc(var(--width395) * 16px);
  }

  .icon-more {
    width: calc(var(--width395) * 16px);
    height: calc(var(--width395) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width395) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width395) * 3px) 0 0;
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width395) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width395) * 10px);
    padding: calc(var(--width395) * 12px) 0;
    font-size: calc(var(--width395) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width395) * 16px);
    height: calc(var(--width395) * 16px);
    margin: 0 calc(var(--width395) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width395) * 12px);
    padding-top: calc(var(--width395) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width395) * 12px);
    padding: calc(var(--width395) * 7px) 0;
    font-size: calc(var(--width395) * 13px);
    border-radius: calc(var(--width395) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width395) * 4px);
    width: calc(var(--width395) * 10px);
    height: calc(var(--width395) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width395) * 12px);
    margin: calc(var(--width395) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width395) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width395) * 16px) calc(var(--width395) * 15px) 0 calc(var(--width395) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width395) * 8px);
    margin-bottom: calc(var(--width395) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width395) * 198px);
    padding: 0 0 0 calc(var(--width395) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width395) * 14px);
    margin-bottom: calc(var(--width395) * 10px);
  }

  .footer-social {
    gap: calc(var(--width395) * 12px);
  }

  .footer-social a {
    width: calc(var(--width395) * 32px);
    height: calc(var(--width395) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width395) * 28px);
    height: calc(var(--width395) * 28px);
  }

  .footer-links {
    padding: calc(var(--width395) * 28px) calc(var(--width395) * 15px) calc(var(--width395) * 15px) calc(var(--width395) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width395) * 16px);
    margin-bottom: calc(var(--width395) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width395) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width395) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width395) * 15px) 0 calc(var(--width395) * 15px);
    gap: calc(var(--width395) * 15px);
    border-radius: calc(var(--width395) * 12px);
    padding: calc(var(--width395) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width395) * 120px);
    height: calc(var(--width395) * 120px);
    border-radius: calc(var(--width395) * 4px);
    margin: 0;
    margin: calc(var(--width395) * 10px) 0 calc(var(--width395) * 10px) calc(var(--width395) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width395) * 106px);
    height: calc(var(--width395) * 106px);
    border-radius: calc(var(--width395) * 4px);
  }

  .foot-line {
    width: calc(var(--width395) * 2px);
    height: calc(var(--width395) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width395) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width395) * 14px);
    margin: calc(var(--width395) * 6px) 0 calc(var(--width395) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width395) * 152px);
    height: calc(var(--width395) * 32px);
    padding: 0 calc(var(--width395) * 12px);
    border-radius: calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width395) * 14px) 0 calc(var(--width395) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width395) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width395) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width395) * 4px);
  }

  .gh {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width395) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width395) * 33px) 0 calc(var(--width395) * 26px);
  }

  .search-hero {
    padding: calc(var(--width395) * 20px) 0 calc(var(--width395) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width395) * 70px) 0 calc(var(--width395) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width395) * 14px);
  }

  .search-brand img {
    height: calc(var(--width395) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width395) * 14px);
    border-radius: calc(var(--width395) * 24px);
    padding: calc(var(--width395) * 3px) calc(var(--width395) * 3px) calc(var(--width395) * 3px) 0;
    height: calc(var(--width395) * 32px);
    box-shadow: 0 calc(var(--width395) * 2px) calc(var(--width395) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width395) * 12px) 0 calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width395) * 12px);
    height: calc(var(--width395) * 28px);
    border-radius: calc(var(--width395) * 19px);
    font-size: calc(var(--width395) * 12px);
  }

  .search-submit b {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
    margin: 0 calc(var(--width395) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width395) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width395) * 14px);
    line-height: calc(var(--width395) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width395) * 10px);
    max-height: calc(var(--width395) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width395) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 7px);
  }

  .search-main {
    padding: calc(var(--width395) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width395) * -32px));
    margin: 0 0 calc(var(--width395) * 17px) 0;
    padding: 0  calc(var(--width395) * 22px);
    height: calc(var(--width395) * 42px);
    box-shadow: 0 0 calc(var(--width395) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width395) * 8px);
    gap: calc(var(--width395) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width395) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width395) * 6px);
    width: calc(var(--width395) * 16px);
    height: calc(var(--width395) * 2px);
  }

  .search-right {
    font-size: calc(var(--width395) * 12px);
    margin: calc(var(--width395) * 12px) 0 calc(var(--width395) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width395) * 13px);
  }

  .empty-state {
    padding: calc(var(--width395) * 70px) 0 calc(var(--width395) * 68px);
  }

  .empty-img {
    width: calc(var(--width395) * 259px);
    margin: 0 auto calc(var(--width395) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width395) * 14px);
    margin: 0 auto calc(var(--width395) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width395) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width395) * 16px) 0 calc(var(--width395) * 32px);
  }

  .pagination {
    gap: calc(var(--width395) * 12px);
    margin-top: calc(var(--width395) * 20px);
  }

  .page-btns {
    gap: calc(var(--width395) * 10px) calc(var(--width395) * 4px);
  }

  .page-extra {
    gap: calc(var(--width395) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width395) * 32px);
    height: calc(var(--width395) * 32px);
    padding: 0 calc(var(--width395) * 8px);
    border-radius: calc(var(--width395) * 4px);
    font-size: calc(var(--width395) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width395) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width395) * 2px);
    font-size: calc(var(--width395) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width395) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width395) * 36px);
    height: calc(var(--width395) * 28px);
    border-radius: calc(var(--width395) * 6px);
    font-size: calc(var(--width395) * 12px);
    margin: 0 calc(var(--width395) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width395) * 14px);
    height: calc(var(--width395) * 28px);
    margin-left: calc(var(--width395) * 4px);
    border-radius: calc(var(--width395) * 3px);
    font-size: calc(var(--width395) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width395) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width395) * 27px);
    padding: calc(var(--width395) * 12px) calc(var(--width395) * 15px) 0 calc(var(--width395) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width395) * 4px);
    min-width: calc(var(--width395) * 68px);
    padding: 0;
    font-size: calc(var(--width395) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width395) * 20px);
    height: calc(var(--width395) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width395) * 20px);
    height: calc(var(--width395) * 3px);
    border-radius: calc(var(--width395) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width395) * 8px);
    padding: calc(var(--width395) * 15px) calc(var(--width395) * 12px) calc(var(--width395) * 10px) calc(var(--width395) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width395) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width395) * 32px);
    padding: 0 calc(var(--width395) * 12px);
    border-radius: calc(var(--width395) * 8px);
    font-size: calc(var(--width395) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width395) * 40px);
    gap: calc(var(--width395) * 2px);
    font-size: calc(var(--width395) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width395) * 18px);
    height: calc(var(--width395) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width395) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width395) * 8px);
    padding: calc(var(--width395) * 8px) calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width395) * 2px);
    height: calc(var(--width395) * 40px);
    border-radius: calc(var(--width395) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width395) * 18px);
    height: calc(var(--width395) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width395) * 10px);
    height: calc(var(--width395) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width395) * 4px) 0 calc(var(--width395) * 8px);
    gap: calc(var(--width395) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width395) * 7px) calc(var(--width395) * 3px);
    font-size: calc(var(--width395) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width395) * 26px);
    width: calc(var(--width395) * 6px);
    height: calc(var(--width395) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width395) * 18px);
    height: calc(var(--width395) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width395) * 10px);
    height: calc(var(--width395) * 12px);
    margin: 0 calc(var(--width395) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width395) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width395) * 12px) 0 calc(var(--width395) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width395) * 14px) calc(var(--width395) * 14px) calc(var(--width395) * 14px) calc(var(--width395) * 16px);
    margin: calc(var(--width395) * 12px) 0 calc(var(--width395) * 14px);
    border-radius: calc(var(--width395) * 10px);
    min-height: calc(var(--width395) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width395) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width395) * 14px);
    line-height: calc(var(--width395) * 18px);
    margin: calc(var(--width395) * 6px) 0 calc(var(--width395) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width395) * 12px);
    gap: calc(var(--width395) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width395) * 3px) 0 0;
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width395) * 3px) 0 0;
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width395) * 4px);
    padding: 0 0 calc(var(--width395) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width395) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width395) * 12px);
    margin-bottom: calc(var(--width395) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width395) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width395) * 10px) calc(var(--width395) * 15px) calc(var(--width395) * 12px) calc(var(--width395) * 15px);
    margin: calc(var(--width395) * 24px) 0 calc(var(--width395) * 16px);
    border-radius: calc(var(--width395) * 10px);
    min-height: calc(var(--width395) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width395) * 8px);
    min-width: 0;
    margin: calc(var(--width395) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width395) * 72px);
    height: calc(var(--width395) * 28px);
    padding: 0 calc(var(--width395) * 12px);
    border-radius: calc(var(--width395) * 14px);
    font-size: calc(var(--width395) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width395) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width395) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width395) * 24px);
    height: calc(var(--width395) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width395) * 15px) calc(var(--width395) * 12px) 0 calc(var(--width395) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width395) * 10px);
    margin-left: calc(var(--width395) * 2px);
  }

  .banner-img {
    width: calc(var(--width395) * 80px);
    height: calc(var(--width395) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width395) * 48px);
    padding: 0 calc(var(--width395) * 18px);
  }

  .catalog-back {
    left: calc(var(--width395) * 8px);
    width: calc(var(--width395) * 36px);
    height: calc(var(--width395) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width395) * 20px);
    height: calc(var(--width395) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width395) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width395) * 16px) calc(var(--width395) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width395) * 18px);
    margin: 0 0 calc(var(--width395) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width395) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width395) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width395) * 8px);
    box-shadow: 0 0 calc(var(--width395) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width395) * 4px);
    padding: calc(var(--width395) * 12px) calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width395) * 20px);
    height: calc(var(--width395) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width395) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width395) * 6px);
    height: calc(var(--width395) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width395) * 12px) calc(var(--width395) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width395) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width395) * 34px);
    padding: 0 calc(var(--width395) * 6px);
    border-radius: calc(var(--width395) * 8px);
    font-size: calc(var(--width395) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width395) * 16px) calc(var(--width395) * 10px);
    padding-bottom: calc(var(--width395) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width395) * 6px);
    min-width: 0;
    font-size: calc(var(--width395) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width395) * 18px);
    height: calc(var(--width395) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width395) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width395) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width395) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width395) * 120px);
    height: calc(var(--width395) * 68px);
    border-radius: calc(var(--width395) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width395) * 16px);
    min-height: calc(var(--width395) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width395) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width395) * 12px) 0 calc(var(--width395) * 10px);
    gap: calc(var(--width395) * 6px);
    font-size: calc(var(--width395) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width395) * 14px);
    height: calc(var(--width395) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width395) * 12px);
    margin: 0;
    padding: calc(var(--width395) * 16px);
    border-radius: calc(var(--width395) * 12px);
    box-shadow: 0 calc(var(--width395) * 2px) calc(var(--width395) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width395) * 206px);
    border-radius: calc(var(--width395) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width395) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width395) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width395) * 16px);
    margin: calc(var(--width395) * 4px) 0 calc(var(--width395) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width395) * 20px);
    font-size: calc(var(--width395) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width395) * 8px);
    margin-top: calc(var(--width395) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width395) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width395) * 2px) calc(var(--width395) * 10px);
    border-radius: calc(var(--width395) * 999px);
    font-size: calc(var(--width395) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width395) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width395) * 8px);
    padding: calc(var(--width395) * 10px) calc(var(--width395) * 15px) calc(var(--width395) * 16px) calc(var(--width395) * 15px);
    margin-bottom: calc(var(--width395) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width395) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width395) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width395) * 10px);
    padding: calc(var(--width395) * 10px) 0;
    font-size: calc(var(--width395) * 13px);
  }

  .widget-icon {
    width: calc(var(--width395) * 18px);
    height: calc(var(--width395) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width395) * 48px);
    height: calc(var(--width395) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width395) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width395) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width395) * 120px);
    height: calc(var(--width395) * 68px);
    border-radius: calc(var(--width395) * 4px);
    margin: 0 calc(var(--width395) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width395) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width395) * 16px);
    line-height: calc(var(--width395) * 18px);
    min-height: calc(var(--width395) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 12px);
    line-height: calc(var(--width395) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width395) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width395) * 14px);
    height: calc(var(--width395) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width395) * 14px);
    height: calc(var(--width395) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width395) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width395) * 110px);
    height: calc(var(--width395) * 62px);
    border-radius: calc(var(--width395) * 4px);
    margin: 0 calc(var(--width395) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width395) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width395) * 16px);
    line-height: calc(var(--width395) * 18px);
    min-height: calc(var(--width395) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 12px);
    line-height: calc(var(--width395) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width395) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width395) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width395) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width395) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width395) * 48px);
    height: calc(var(--width395) * 48px);
    border-radius: calc(var(--width395) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width395) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width395) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width395) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width395) * 2px);
    width: calc(var(--width395) * 68px);
    height: calc(var(--width395) * 27px);
    padding: 0;
    border-radius: calc(var(--width395) * 14px);
    font-size: calc(var(--width395) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width395) * 11px);
    height: calc(var(--width395) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width395) * 16px);
    padding: 0 0 0 calc(var(--width395) * 18px);
    font-size: calc(var(--width395) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width395) * 4px);
    height: calc(var(--width395) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width395) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width395) * 12px);
    padding: calc(var(--width395) * 8px) 0;
    font-size: calc(var(--width395) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width395) * 8px);
  }

  .widget-links {
    gap: calc(var(--width395) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width395) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width395) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width395) * 6px) 0 calc(var(--width395) * 6px);
    font-size: calc(var(--width395) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width395) * 12px) 0;
    font-size: calc(var(--width395) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width395) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width395) * 72px);
    padding-left: calc(var(--width395) * 16px);
    padding-right: calc(var(--width395) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width395) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width395) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width395) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width395) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width395) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width395) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width395) * 16px);
    font-size: calc(var(--width395) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width395) * 4px) calc(var(--width395) * 8px);
    border-radius: calc(var(--width395) * 4px);
    font-size: calc(var(--width395) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width395) * 16px) 0 calc(var(--width395) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width395) * 16px) 0 calc(var(--width395) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width395) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width395) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width395) * 12px) 0 calc(var(--width395) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width395) * 21px);
    margin-bottom: calc(var(--width395) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width395) * 8px);
    padding-bottom: calc(var(--width395) * 7px);
    margin-bottom: calc(var(--width395) * 10px);
  }

  .author-avatar {
    width: calc(var(--width395) * 36px);
    height: calc(var(--width395) * 36px);
    margin: 0 calc(var(--width395) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width395) * 12px);
    gap: calc(var(--width395) * 4px);
    margin: calc(var(--width395) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width395) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width395) * 2px) calc(var(--width395) * 10px);
    border-radius: calc(var(--width395) * 3px);
    font-size: calc(var(--width395) * 12px);
    margin-top: calc(var(--width395) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width395) * 15px);
    margin-bottom: calc(var(--width395) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width395) * 22px);
    margin: calc(var(--width395) * 18px) 0 calc(var(--width395) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width395) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width395) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width395) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width395) * 12px);
    margin-top: calc(var(--width395) * 6px);
  }

  .artcona {
    margin: calc(var(--width395) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width395) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width395) * 16px);
  }

  .box-title {
    font-size: calc(var(--width395) * 18px);
    margin-bottom: calc(var(--width395) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width395) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width395) * 14px);
    padding: calc(var(--width395) * 15px) calc(var(--width395) * 18px);
    border-radius: 0 calc(var(--width395) * 8px) calc(var(--width395) * 8px) 0;
    margin-bottom: calc(var(--width395) * 14px);
    line-height: calc(var(--width395) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width395) * 2px);
    border-radius: calc(var(--width395) * 2px) 0 0 calc(var(--width395) * 2px);
  }

  .related-list {
    gap: calc(var(--width395) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width395) * 8px);
    font-size: calc(var(--width395) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width395) * 4px);
    height: calc(var(--width395) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width395) * 12px);
    padding: calc(var(--width395) * 14px);
    box-shadow: 0 0 calc(var(--width395) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width395) * 8px);
    margin-bottom: calc(var(--width395) * 16px);
  }

  .tool-icon {
    width: calc(var(--width395) * 56px);
    height: calc(var(--width395) * 56px);
    border-radius: calc(var(--width395) * 8px);
    margin: 0 calc(var(--width395) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width395) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width395) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width395) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width395) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width395) * 10px);
    margin: calc(var(--width395) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width395) * 2px);
    height: calc(var(--width395) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width395) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width395) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width395) * 4px);
    font-size: calc(var(--width395) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width395) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width395) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width395) * 88px);
    height: calc(var(--width395) * 26px);
    border-radius: calc(var(--width395) * 17px);
    font-size: calc(var(--width395) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width395) * 88px);
    height: calc(var(--width395) * 26px);
    border-radius: calc(var(--width395) * 17px);
    gap: calc(var(--width395) * 4px);
    font-size: calc(var(--width395) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width395) * 13px);
    height: calc(var(--width395) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width395) * 12px);
    padding: calc(var(--width395) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width395) * 101px);
    height: calc(var(--width395) * 101px);
    border-radius: calc(var(--width395) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width395) * 88px);
    height: calc(var(--width395) * 88px);
    border-radius: calc(var(--width395) * 8px);
    padding: calc(var(--width395) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width395) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width395) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width395) * 162px);
    height: calc(var(--width395) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width395) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width395) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width395) * 4px);
    font-size: calc(var(--width395) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width395) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width395) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width395) * 1px) calc(var(--width395) * 8px);
    border-radius: calc(var(--width395) * 11px);
    font-size: calc(var(--width395) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width395) * 26px);
    padding: 0 calc(var(--width395) * 14px);
    border-radius: calc(var(--width395) * 13px);
    font-size: calc(var(--width395) * 12px);
    gap: calc(var(--width395) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width395) * 14px);
    height: calc(var(--width395) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width395) * 8px) calc(var(--width395) * 20px);
    font-size: calc(var(--width395) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width395) * 10px);
    margin-bottom: calc(var(--width395) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width395) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width395) * 10px);
    margin-bottom: calc(var(--width395) * 16px);
    border-radius: calc(var(--width395) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width395) * 16px);
    margin: 0 0 calc(var(--width395) * 10px);
  }

  .declared {
    border-radius: calc(var(--width395) * 8px);
    padding: calc(var(--width395) * 16px) calc(var(--width395) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width395) * 90px);
    height: calc(var(--width395) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width395) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width395) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width395) * 14px);
    line-height: calc(var(--width395) * 20px);
    margin: 0 0 calc(var(--width395) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width395) * 10px);
    font-size: calc(var(--width395) * 13px);
    margin: 0 0 calc(var(--width395) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width395) * 8px) calc(var(--width395) * 16px);
    min-height: calc(var(--width395) * 38px);
    box-shadow: 0 0 calc(var(--width395) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width395) * 8px);
    gap: calc(var(--width395) * 4px);
    font-size: calc(var(--width395) * 12px);
  }

  .author-list {
    gap: calc(var(--width395) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width395) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width395) * 10px);
    font-size: calc(var(--width395) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width395) * 4px);
    height: calc(var(--width395) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width395) * 3px);
    font-size: calc(var(--width395) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width395) * 26px);
  }

  .detail-products {
    margin: calc(var(--width395) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width395) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width395) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width395) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width395) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width395) * 3px);
    height: calc(var(--width395) * 14px);
    margin-right: calc(var(--width395) * 8px);
    margin-top: calc(var(--width395) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width395) * 8px) 0 0;
    width: calc(var(--width395) * 12px);
    height: calc(var(--width395) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width395) * 16px);
    margin: calc(var(--width395) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width395) * 15px);
    margin: calc(var(--width395) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width395) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width395) * 6px) calc(var(--width395) * 8px);
    font-size: calc(var(--width395) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width395) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width395) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width395) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width395) * 5px) calc(var(--width395) * 10px);
    font-size: calc(var(--width395) * 12px);
    border-radius: calc(var(--width395) * 5px);
    top: calc(var(--width395) * 5px);
    right: calc(var(--width395) * 5px);
    margin-bottom: calc(var(--width395) * -35px);
  }

  .artcons img {
    height: calc(var(--width395) * 506px);
    border-radius: calc(var(--width395) * 8px);
  }
  .detail-content ol{margin-left:calc(var(--width395) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width395) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width395) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width395) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width395) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width395) * 26px);
    font-size: calc(var(--width395) * 16px);
    margin: calc(var(--width395) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width395) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width395) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width395) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width395) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width395) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width395) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width395) * 120px);
  }

  .artcons {
    font-size: calc(var(--width395) * 16px);
  }

}

@media screen and (max-width: 391px) {
  :root {
    --radius-sm: calc(var(--width390) * 4px);
    --radius-md: calc(var(--width390) * 8px);
    --radius-lg: calc(var(--width390) * 24px);
    --page-pad: calc(var(--width390) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width390) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width390) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width390) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width390) * 48px);
    padding: calc(var(--width390) * 10px) calc(var(--width390) * 16px) calc(var(--width390) * 10px) calc(var(--width390) * 13px);
    box-shadow: 0 0 calc(var(--width390) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width390) * 8px);
    font-size: calc(var(--width390) * 18px);
  }

  .logo-img {
    width: calc(var(--width390) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width390) * 14px);
    margin-left: calc(var(--width390) * 4px);
  }

  .header-actions {
    gap: calc(var(--width390) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width390) * 18px);
    height: calc(var(--width390) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width390) * 320px);
    box-shadow: calc(var(--width390) * -4px) 0 calc(var(--width390) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width390) * 52px);
    padding: 0 calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width390) * 20px);
    height: calc(var(--width390) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width390) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width390) * 14px) calc(var(--width390) * 20px);
    font-size: calc(var(--width390) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width390) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width390) * 48px);
    padding: 0 calc(var(--width390) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width390) * 8px);
    width: calc(var(--width390) * 36px);
    height: calc(var(--width390) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width390) * 20px);
    height: calc(var(--width390) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width390) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width390) * 16px) calc(var(--width390) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width390) * 8px);
    height: calc(var(--width390) * 44px);
    padding: 0 calc(var(--width390) * 16px);
    margin: 0 0 calc(var(--width390) * 18px);
    border-radius: calc(var(--width390) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width390) * 18px);
    height: calc(var(--width390) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width390) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width390) * 10px);
    margin: 0 0 calc(var(--width390) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width390) * 6px);
    min-height: calc(var(--width390) * 52px);
    padding: calc(var(--width390) * 12px) calc(var(--width390) * 16px);
    box-shadow: 0 0 calc(var(--width390) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width390) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width390) * 20px);
    height: calc(var(--width390) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width390) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width390) * 6px);
    height: calc(var(--width390) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width390) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width390) * 6px);
    height: calc(var(--width390) * 44px);
    border-radius: calc(var(--width390) * 21px);
    font-size: calc(var(--width390) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width390) * 16px);
    height: calc(var(--width390) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width390) * 14px);
    height: calc(var(--width390) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width390) * 16px) calc(var(--width390) * 16px) calc(var(--width390) * 26px);
  }

  .sechtitle {
    top: calc(var(--width390) * 12px);
    right: calc(var(--width390) * 12px);
    width: calc(var(--width390) * 36px);
    height: calc(var(--width390) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width390) * 22px);
    height: calc(var(--width390) * 22px);
  }

  .sechcon {
    margin: calc(var(--width390) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width390) * 20px);
    width: calc(var(--width390) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width390) * 198px);
  }

  .serchd {
    height: calc(var(--width390) * 46px);
    margin: 0 0 calc(var(--width390) * 18px);
    border-radius: calc(var(--width390) * 23px);
    padding: 0 calc(var(--width390) * 16px) 0 calc(var(--width390) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width390) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width390) * 36px);
    height: calc(var(--width390) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width390) * 20px);
    height: calc(var(--width390) * 20px);
  }

  .top-btn {
    gap: calc(var(--width390) * 8px);
  }

  .topbtna {
    height: calc(var(--width390) * 18px);
    padding: 0 calc(var(--width390) * 12px);
    border-radius: calc(var(--width390) * 11px);
    font-size: calc(var(--width390) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width390) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width390) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width390) * 6px);
    font-size: calc(var(--width390) * 32px);
    line-height: calc(var(--width390) * 36px);
    margin: calc(var(--width390) * 26px) 0 calc(var(--width390) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width390) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width390) * 6px) auto;
    letter-spacing: calc(var(--width390) * 4px);
    width: calc(var(--width390) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width390) * 12px);
    margin-bottom: calc(var(--width390) * 15px);
    letter-spacing: calc(var(--width390) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width390) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width390) * 98px);
    height: calc(var(--width390) * 32px);
    border-radius: calc(var(--width390) * 22px);
    font-size: calc(var(--width390) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width390) * 44px);
    width: calc(var(--width390) * 98px);
    height: calc(var(--width390) * 32px);
    border-radius: calc(var(--width390) * 26px);
    font-size: calc(var(--width390) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width390) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width390) * 12px);
  }

  .section-title {
    font-size: calc(var(--width390) * 18px);
  }

  .section-more {
    font-size: calc(var(--width390) * 14px);
  }

  .section-more b {
    width: calc(var(--width390) * 8px);
    height: calc(var(--width390) * 8px);
    margin: 0 0 0 calc(var(--width390) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width390) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width390) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width390) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width390) * 308px);
    border-radius: calc(var(--width390) * 5px);
    width: calc(var(--width390) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width390) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width390) * 8px);
    margin: calc(var(--width390) * 5px) calc(var(--width390) * 6px) 0 calc(var(--width390) * 10px);
    min-height: calc(var(--width390) * 56px);
    padding: 0 0 calc(var(--width390) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width390) * 3px);
    right: calc(var(--width390) * 3px);
    bottom: 0;
    height: calc(var(--width390) * 1px);
  }

  .card-icon {
    width: calc(var(--width390) * 40px);
    height: calc(var(--width390) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width390) * 14px);
    margin: 0 0 calc(var(--width390) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width390) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width390) * 6px);
    min-width: 0;
    font-size: calc(var(--width390) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width390) * 8px);
    height: calc(var(--width390) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width390) * 3px);
    height: calc(var(--width390) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width390) * 12px);
    margin: 0 0 calc(var(--width390) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width390) * 10px) calc(var(--width390) * 10px) calc(var(--width390) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width390) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width390) * 10px);
    font-size: calc(var(--width390) * 12px);
    width: calc(var(--width390) * 145px);
    height: calc(var(--width390) * 28px);
    border-radius: calc(var(--width390) * 14px);
  }

  .card-more b {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 9px);
    margin: 0 0 0 calc(var(--width390) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width390) * 4px);
    margin-top: calc(var(--width390) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width390) * 4px);
    height: calc(var(--width390) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width390) * 20px);
    border-radius: calc(var(--width390) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width390) * 14px) 0 calc(var(--width390) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width390) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width390) * 8px);
  }

  .tags-list {
    gap: calc(var(--width390) * 8px);
  }

  .tag {
    padding: calc(var(--width390) * 4px) calc(var(--width390) * 16px);
    border-radius: calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width390) * 12px);
    padding: calc(var(--width390) * 2px) calc(var(--width390) * 8px);
    border-radius: calc(var(--width390) * 12px);
  }

  .products-grid {
    gap: calc(var(--width390) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width390) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width390) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width390) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width390) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width390) * 16px);
    gap: calc(var(--width390) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width390) * 4px);
    height: calc(var(--width390) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width390) * 20px);
    border-radius: calc(var(--width390) * 2px);
  }

  .product-card {
    padding: calc(var(--width390) * 10px);
    min-width: 0;
    border-radius: calc(var(--width390) * 8px);
    box-shadow: 0 0 calc(var(--width390) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width390) * 10px);
    top: calc(var(--width390) * 8px);
    left: calc(var(--width390) * 10px);
    gap: calc(var(--width390) * 3px);
    max-width: calc(100% - calc(var(--width390) * 36px));
  }

  .tagsa {
    padding: calc(var(--width390) * 1px) calc(var(--width390) * 5px);
    font-size: calc(var(--width390) * 10px);
    border-radius: calc(var(--width390) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width390) * 1px) calc(var(--width390) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width390) * 8px);
    margin: calc(var(--width390) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width390) * 16px);
    margin: calc(var(--width390) * 7px) 0 calc(var(--width390) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width390) * 12px);
    margin-bottom: calc(var(--width390) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width390) * 11px);
  }

  .product-rating b {
    width: calc(var(--width390) * 10px);
    height: calc(var(--width390) * 10px);
    margin: 0 calc(var(--width390) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width390) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width390) * 24px);
    margin: calc(var(--width390) * 32px) auto calc(var(--width390) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width390) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width390) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width390) * 98px);
    padding: 0 calc(var(--width390) * 24px);
    height: calc(var(--width390) * 32px);
    border-radius: calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width390) * 9px);
    height: calc(var(--width390) * 5px);
    margin: 0 0 0 calc(var(--width390) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width390) * 88px);
    width: calc(var(--width390) * 88px);
    height: calc(var(--width390) * 28px);
    border-radius: calc(var(--width390) * 15px);
    font-size: calc(var(--width390) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width390) * 88px);
    width: calc(var(--width390) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width390) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width390) * 34px);
    border-radius: calc(var(--width390) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width390) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width390) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width390) * 8px);
    height: calc(var(--width390) * 34px);
    padding: 0 0 0 calc(var(--width390) * 7px);
    font-size: calc(var(--width390) * 16px);
    line-height: calc(var(--width390) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width390) * 18px);
    height: calc(var(--width390) * 18px);
    margin: 0 calc(var(--width390) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width390) * 4px);
    font-size: calc(var(--width390) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width390) * 11px);
    height: calc(var(--width390) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width390) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width390) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width390) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width390) * 12px);
    padding: calc(var(--width390) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width390) * 16px);
    margin-bottom: calc(var(--width390) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width390) * 14px);
    max-height: calc(var(--width390) * 20px);
    line-height: calc(var(--width390) * 18px);
    margin-bottom: calc(var(--width390) * 3px);
  }

  .article-tags {
    gap: calc(var(--width390) * 6px);
    margin-top: calc(var(--width390) * 4px);
  }

  .article-tag {
    padding: calc(var(--width390) * 1px) calc(var(--width390) * 8px);
    border-radius: calc(var(--width390) * 11px);
    font-size: calc(var(--width390) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width390) * 1px) calc(var(--width390) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width390) * 3px) calc(var(--width390) * 8px);
    font-size: calc(var(--width390) * 12px);
    border-radius: calc(var(--width390) * 12px);
  }

  .article-info {
    font-size: calc(var(--width390) * 12px);
    gap: calc(var(--width390) * 10px);
  }

  .article-thumb {
    width: calc(var(--width390) * 148px);
    height: calc(var(--width390) * 88px);
    border-radius: calc(var(--width390) * 6px);
    margin-top: calc(var(--width390) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width390) * 88px);
    height: calc(var(--width390) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width390) * 6px);
    height: calc(var(--width390) * 38px);
    margin-top: calc(var(--width390) * 16px);
    border-radius: calc(var(--width390) * 21px);
    font-size: calc(var(--width390) * 16px);
  }

  .icon-more {
    width: calc(var(--width390) * 16px);
    height: calc(var(--width390) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width390) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width390) * 3px) 0 0;
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width390) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width390) * 10px);
    padding: calc(var(--width390) * 12px) 0;
    font-size: calc(var(--width390) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width390) * 16px);
    height: calc(var(--width390) * 16px);
    margin: 0 calc(var(--width390) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width390) * 12px);
    padding-top: calc(var(--width390) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width390) * 12px);
    padding: calc(var(--width390) * 7px) 0;
    font-size: calc(var(--width390) * 13px);
    border-radius: calc(var(--width390) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width390) * 4px);
    width: calc(var(--width390) * 10px);
    height: calc(var(--width390) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width390) * 12px);
    margin: calc(var(--width390) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width390) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width390) * 16px) calc(var(--width390) * 15px) 0 calc(var(--width390) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width390) * 8px);
    margin-bottom: calc(var(--width390) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width390) * 198px);
    padding: 0 0 0 calc(var(--width390) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width390) * 14px);
    margin-bottom: calc(var(--width390) * 10px);
  }

  .footer-social {
    gap: calc(var(--width390) * 12px);
  }

  .footer-social a {
    width: calc(var(--width390) * 32px);
    height: calc(var(--width390) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width390) * 28px);
    height: calc(var(--width390) * 28px);
  }

  .footer-links {
    padding: calc(var(--width390) * 28px) calc(var(--width390) * 15px) calc(var(--width390) * 15px) calc(var(--width390) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width390) * 16px);
    margin-bottom: calc(var(--width390) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width390) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width390) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width390) * 15px) 0 calc(var(--width390) * 15px);
    gap: calc(var(--width390) * 15px);
    border-radius: calc(var(--width390) * 12px);
    padding: calc(var(--width390) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width390) * 120px);
    height: calc(var(--width390) * 120px);
    border-radius: calc(var(--width390) * 4px);
    margin: 0;
    margin: calc(var(--width390) * 10px) 0 calc(var(--width390) * 10px) calc(var(--width390) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width390) * 106px);
    height: calc(var(--width390) * 106px);
    border-radius: calc(var(--width390) * 4px);
  }

  .foot-line {
    width: calc(var(--width390) * 2px);
    height: calc(var(--width390) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width390) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width390) * 14px);
    margin: calc(var(--width390) * 6px) 0 calc(var(--width390) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width390) * 152px);
    height: calc(var(--width390) * 32px);
    padding: 0 calc(var(--width390) * 12px);
    border-radius: calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width390) * 14px) 0 calc(var(--width390) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width390) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width390) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width390) * 4px);
  }

  .gh {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width390) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width390) * 33px) 0 calc(var(--width390) * 26px);
  }

  .search-hero {
    padding: calc(var(--width390) * 20px) 0 calc(var(--width390) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width390) * 70px) 0 calc(var(--width390) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width390) * 14px);
  }

  .search-brand img {
    height: calc(var(--width390) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width390) * 14px);
    border-radius: calc(var(--width390) * 24px);
    padding: calc(var(--width390) * 3px) calc(var(--width390) * 3px) calc(var(--width390) * 3px) 0;
    height: calc(var(--width390) * 32px);
    box-shadow: 0 calc(var(--width390) * 2px) calc(var(--width390) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width390) * 12px) 0 calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width390) * 12px);
    height: calc(var(--width390) * 28px);
    border-radius: calc(var(--width390) * 19px);
    font-size: calc(var(--width390) * 12px);
  }

  .search-submit b {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
    margin: 0 calc(var(--width390) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width390) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width390) * 14px);
    line-height: calc(var(--width390) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width390) * 10px);
    max-height: calc(var(--width390) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width390) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 7px);
  }

  .search-main {
    padding: calc(var(--width390) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width390) * -32px));
    margin: 0 0 calc(var(--width390) * 17px) 0;
    padding: 0  calc(var(--width390) * 22px);
    height: calc(var(--width390) * 42px);
    box-shadow: 0 0 calc(var(--width390) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width390) * 8px);
    gap: calc(var(--width390) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width390) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width390) * 6px);
    width: calc(var(--width390) * 16px);
    height: calc(var(--width390) * 2px);
  }

  .search-right {
    font-size: calc(var(--width390) * 12px);
    margin: calc(var(--width390) * 12px) 0 calc(var(--width390) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width390) * 13px);
  }

  .empty-state {
    padding: calc(var(--width390) * 70px) 0 calc(var(--width390) * 68px);
  }

  .empty-img {
    width: calc(var(--width390) * 259px);
    margin: 0 auto calc(var(--width390) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width390) * 14px);
    margin: 0 auto calc(var(--width390) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width390) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width390) * 16px) 0 calc(var(--width390) * 32px);
  }

  .pagination {
    gap: calc(var(--width390) * 12px);
    margin-top: calc(var(--width390) * 20px);
  }

  .page-btns {
    gap: calc(var(--width390) * 10px) calc(var(--width390) * 4px);
  }

  .page-extra {
    gap: calc(var(--width390) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width390) * 32px);
    height: calc(var(--width390) * 32px);
    padding: 0 calc(var(--width390) * 8px);
    border-radius: calc(var(--width390) * 4px);
    font-size: calc(var(--width390) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width390) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width390) * 2px);
    font-size: calc(var(--width390) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width390) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width390) * 36px);
    height: calc(var(--width390) * 28px);
    border-radius: calc(var(--width390) * 6px);
    font-size: calc(var(--width390) * 12px);
    margin: 0 calc(var(--width390) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width390) * 14px);
    height: calc(var(--width390) * 28px);
    margin-left: calc(var(--width390) * 4px);
    border-radius: calc(var(--width390) * 3px);
    font-size: calc(var(--width390) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width390) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width390) * 27px);
    padding: calc(var(--width390) * 12px) calc(var(--width390) * 15px) 0 calc(var(--width390) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width390) * 4px);
    min-width: calc(var(--width390) * 68px);
    padding: 0;
    font-size: calc(var(--width390) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width390) * 20px);
    height: calc(var(--width390) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width390) * 20px);
    height: calc(var(--width390) * 3px);
    border-radius: calc(var(--width390) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width390) * 8px);
    padding: calc(var(--width390) * 15px) calc(var(--width390) * 12px) calc(var(--width390) * 10px) calc(var(--width390) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width390) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width390) * 32px);
    padding: 0 calc(var(--width390) * 12px);
    border-radius: calc(var(--width390) * 8px);
    font-size: calc(var(--width390) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width390) * 40px);
    gap: calc(var(--width390) * 2px);
    font-size: calc(var(--width390) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width390) * 18px);
    height: calc(var(--width390) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width390) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width390) * 8px);
    padding: calc(var(--width390) * 8px) calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width390) * 2px);
    height: calc(var(--width390) * 40px);
    border-radius: calc(var(--width390) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width390) * 18px);
    height: calc(var(--width390) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width390) * 10px);
    height: calc(var(--width390) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width390) * 4px) 0 calc(var(--width390) * 8px);
    gap: calc(var(--width390) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width390) * 7px) calc(var(--width390) * 3px);
    font-size: calc(var(--width390) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width390) * 26px);
    width: calc(var(--width390) * 6px);
    height: calc(var(--width390) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width390) * 18px);
    height: calc(var(--width390) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width390) * 10px);
    height: calc(var(--width390) * 12px);
    margin: 0 calc(var(--width390) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width390) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width390) * 12px) 0 calc(var(--width390) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width390) * 14px) calc(var(--width390) * 14px) calc(var(--width390) * 14px) calc(var(--width390) * 16px);
    margin: calc(var(--width390) * 12px) 0 calc(var(--width390) * 14px);
    border-radius: calc(var(--width390) * 10px);
    min-height: calc(var(--width390) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width390) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width390) * 14px);
    line-height: calc(var(--width390) * 18px);
    margin: calc(var(--width390) * 6px) 0 calc(var(--width390) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width390) * 12px);
    gap: calc(var(--width390) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width390) * 3px) 0 0;
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width390) * 3px) 0 0;
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width390) * 4px);
    padding: 0 0 calc(var(--width390) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width390) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width390) * 12px);
    margin-bottom: calc(var(--width390) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width390) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width390) * 10px) calc(var(--width390) * 15px) calc(var(--width390) * 12px) calc(var(--width390) * 15px);
    margin: calc(var(--width390) * 24px) 0 calc(var(--width390) * 16px);
    border-radius: calc(var(--width390) * 10px);
    min-height: calc(var(--width390) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width390) * 8px);
    min-width: 0;
    margin: calc(var(--width390) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width390) * 72px);
    height: calc(var(--width390) * 28px);
    padding: 0 calc(var(--width390) * 12px);
    border-radius: calc(var(--width390) * 14px);
    font-size: calc(var(--width390) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width390) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width390) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width390) * 24px);
    height: calc(var(--width390) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width390) * 15px) calc(var(--width390) * 12px) 0 calc(var(--width390) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width390) * 10px);
    margin-left: calc(var(--width390) * 2px);
  }

  .banner-img {
    width: calc(var(--width390) * 80px);
    height: calc(var(--width390) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width390) * 48px);
    padding: 0 calc(var(--width390) * 18px);
  }

  .catalog-back {
    left: calc(var(--width390) * 8px);
    width: calc(var(--width390) * 36px);
    height: calc(var(--width390) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width390) * 20px);
    height: calc(var(--width390) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width390) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width390) * 16px) calc(var(--width390) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width390) * 18px);
    margin: 0 0 calc(var(--width390) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width390) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width390) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width390) * 8px);
    box-shadow: 0 0 calc(var(--width390) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width390) * 4px);
    padding: calc(var(--width390) * 12px) calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width390) * 20px);
    height: calc(var(--width390) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width390) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width390) * 6px);
    height: calc(var(--width390) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width390) * 12px) calc(var(--width390) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width390) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width390) * 34px);
    padding: 0 calc(var(--width390) * 6px);
    border-radius: calc(var(--width390) * 8px);
    font-size: calc(var(--width390) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width390) * 16px) calc(var(--width390) * 10px);
    padding-bottom: calc(var(--width390) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width390) * 6px);
    min-width: 0;
    font-size: calc(var(--width390) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width390) * 18px);
    height: calc(var(--width390) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width390) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width390) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width390) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width390) * 120px);
    height: calc(var(--width390) * 68px);
    border-radius: calc(var(--width390) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width390) * 16px);
    min-height: calc(var(--width390) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width390) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width390) * 12px) 0 calc(var(--width390) * 10px);
    gap: calc(var(--width390) * 6px);
    font-size: calc(var(--width390) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width390) * 14px);
    height: calc(var(--width390) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width390) * 12px);
    margin: 0;
    padding: calc(var(--width390) * 16px);
    border-radius: calc(var(--width390) * 12px);
    box-shadow: 0 calc(var(--width390) * 2px) calc(var(--width390) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width390) * 206px);
    border-radius: calc(var(--width390) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width390) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width390) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width390) * 16px);
    margin: calc(var(--width390) * 4px) 0 calc(var(--width390) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width390) * 20px);
    font-size: calc(var(--width390) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width390) * 8px);
    margin-top: calc(var(--width390) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width390) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width390) * 2px) calc(var(--width390) * 10px);
    border-radius: calc(var(--width390) * 999px);
    font-size: calc(var(--width390) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width390) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width390) * 8px);
    padding: calc(var(--width390) * 10px) calc(var(--width390) * 15px) calc(var(--width390) * 16px) calc(var(--width390) * 15px);
    margin-bottom: calc(var(--width390) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width390) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width390) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width390) * 10px);
    padding: calc(var(--width390) * 10px) 0;
    font-size: calc(var(--width390) * 13px);
  }

  .widget-icon {
    width: calc(var(--width390) * 18px);
    height: calc(var(--width390) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width390) * 48px);
    height: calc(var(--width390) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width390) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width390) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width390) * 120px);
    height: calc(var(--width390) * 68px);
    border-radius: calc(var(--width390) * 4px);
    margin: 0 calc(var(--width390) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width390) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width390) * 16px);
    line-height: calc(var(--width390) * 18px);
    min-height: calc(var(--width390) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 12px);
    line-height: calc(var(--width390) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width390) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width390) * 14px);
    height: calc(var(--width390) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width390) * 14px);
    height: calc(var(--width390) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width390) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width390) * 110px);
    height: calc(var(--width390) * 62px);
    border-radius: calc(var(--width390) * 4px);
    margin: 0 calc(var(--width390) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width390) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width390) * 16px);
    line-height: calc(var(--width390) * 18px);
    min-height: calc(var(--width390) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 12px);
    line-height: calc(var(--width390) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width390) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width390) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width390) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width390) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width390) * 48px);
    height: calc(var(--width390) * 48px);
    border-radius: calc(var(--width390) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width390) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width390) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width390) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width390) * 2px);
    width: calc(var(--width390) * 68px);
    height: calc(var(--width390) * 27px);
    padding: 0;
    border-radius: calc(var(--width390) * 14px);
    font-size: calc(var(--width390) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width390) * 11px);
    height: calc(var(--width390) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width390) * 16px);
    padding: 0 0 0 calc(var(--width390) * 18px);
    font-size: calc(var(--width390) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width390) * 4px);
    height: calc(var(--width390) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width390) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width390) * 12px);
    padding: calc(var(--width390) * 8px) 0;
    font-size: calc(var(--width390) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width390) * 8px);
  }

  .widget-links {
    gap: calc(var(--width390) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width390) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width390) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width390) * 6px) 0 calc(var(--width390) * 6px);
    font-size: calc(var(--width390) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width390) * 12px) 0;
    font-size: calc(var(--width390) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width390) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width390) * 72px);
    padding-left: calc(var(--width390) * 16px);
    padding-right: calc(var(--width390) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width390) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width390) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width390) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width390) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width390) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width390) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width390) * 16px);
    font-size: calc(var(--width390) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width390) * 4px) calc(var(--width390) * 8px);
    border-radius: calc(var(--width390) * 4px);
    font-size: calc(var(--width390) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width390) * 16px) 0 calc(var(--width390) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width390) * 16px) 0 calc(var(--width390) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width390) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width390) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width390) * 12px) 0 calc(var(--width390) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width390) * 21px);
    margin-bottom: calc(var(--width390) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width390) * 8px);
    padding-bottom: calc(var(--width390) * 7px);
    margin-bottom: calc(var(--width390) * 10px);
  }

  .author-avatar {
    width: calc(var(--width390) * 36px);
    height: calc(var(--width390) * 36px);
    margin: 0 calc(var(--width390) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width390) * 12px);
    gap: calc(var(--width390) * 4px);
    margin: calc(var(--width390) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width390) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width390) * 2px) calc(var(--width390) * 10px);
    border-radius: calc(var(--width390) * 3px);
    font-size: calc(var(--width390) * 12px);
    margin-top: calc(var(--width390) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width390) * 15px);
    margin-bottom: calc(var(--width390) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width390) * 22px);
    margin: calc(var(--width390) * 18px) 0 calc(var(--width390) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width390) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width390) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width390) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width390) * 12px);
    margin-top: calc(var(--width390) * 6px);
  }

  .artcona {
    margin: calc(var(--width390) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width390) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width390) * 16px);
  }

  .box-title {
    font-size: calc(var(--width390) * 18px);
    margin-bottom: calc(var(--width390) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width390) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width390) * 14px);
    padding: calc(var(--width390) * 15px) calc(var(--width390) * 18px);
    border-radius: 0 calc(var(--width390) * 8px) calc(var(--width390) * 8px) 0;
    margin-bottom: calc(var(--width390) * 14px);
    line-height: calc(var(--width390) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width390) * 2px);
    border-radius: calc(var(--width390) * 2px) 0 0 calc(var(--width390) * 2px);
  }

  .related-list {
    gap: calc(var(--width390) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width390) * 8px);
    font-size: calc(var(--width390) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width390) * 4px);
    height: calc(var(--width390) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width390) * 12px);
    padding: calc(var(--width390) * 14px);
    box-shadow: 0 0 calc(var(--width390) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width390) * 8px);
    margin-bottom: calc(var(--width390) * 16px);
  }

  .tool-icon {
    width: calc(var(--width390) * 56px);
    height: calc(var(--width390) * 56px);
    border-radius: calc(var(--width390) * 8px);
    margin: 0 calc(var(--width390) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width390) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width390) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width390) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width390) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width390) * 10px);
    margin: calc(var(--width390) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width390) * 2px);
    height: calc(var(--width390) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width390) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width390) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width390) * 4px);
    font-size: calc(var(--width390) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width390) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width390) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width390) * 88px);
    height: calc(var(--width390) * 26px);
    border-radius: calc(var(--width390) * 17px);
    font-size: calc(var(--width390) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width390) * 88px);
    height: calc(var(--width390) * 26px);
    border-radius: calc(var(--width390) * 17px);
    gap: calc(var(--width390) * 4px);
    font-size: calc(var(--width390) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width390) * 13px);
    height: calc(var(--width390) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width390) * 12px);
    padding: calc(var(--width390) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width390) * 101px);
    height: calc(var(--width390) * 101px);
    border-radius: calc(var(--width390) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width390) * 88px);
    height: calc(var(--width390) * 88px);
    border-radius: calc(var(--width390) * 8px);
    padding: calc(var(--width390) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width390) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width390) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width390) * 162px);
    height: calc(var(--width390) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width390) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width390) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width390) * 4px);
    font-size: calc(var(--width390) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width390) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width390) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width390) * 1px) calc(var(--width390) * 8px);
    border-radius: calc(var(--width390) * 11px);
    font-size: calc(var(--width390) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width390) * 26px);
    padding: 0 calc(var(--width390) * 14px);
    border-radius: calc(var(--width390) * 13px);
    font-size: calc(var(--width390) * 12px);
    gap: calc(var(--width390) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width390) * 14px);
    height: calc(var(--width390) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width390) * 8px) calc(var(--width390) * 20px);
    font-size: calc(var(--width390) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width390) * 10px);
    margin-bottom: calc(var(--width390) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width390) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width390) * 10px);
    margin-bottom: calc(var(--width390) * 16px);
    border-radius: calc(var(--width390) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width390) * 16px);
    margin: 0 0 calc(var(--width390) * 10px);
  }

  .declared {
    border-radius: calc(var(--width390) * 8px);
    padding: calc(var(--width390) * 16px) calc(var(--width390) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width390) * 90px);
    height: calc(var(--width390) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width390) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width390) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width390) * 14px);
    line-height: calc(var(--width390) * 20px);
    margin: 0 0 calc(var(--width390) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width390) * 10px);
    font-size: calc(var(--width390) * 13px);
    margin: 0 0 calc(var(--width390) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width390) * 8px) calc(var(--width390) * 16px);
    min-height: calc(var(--width390) * 38px);
    box-shadow: 0 0 calc(var(--width390) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width390) * 8px);
    gap: calc(var(--width390) * 4px);
    font-size: calc(var(--width390) * 12px);
  }

  .author-list {
    gap: calc(var(--width390) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width390) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width390) * 10px);
    font-size: calc(var(--width390) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width390) * 4px);
    height: calc(var(--width390) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width390) * 3px);
    font-size: calc(var(--width390) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width390) * 26px);
  }

  .detail-products {
    margin: calc(var(--width390) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width390) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width390) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width390) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width390) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width390) * 3px);
    height: calc(var(--width390) * 14px);
    margin-right: calc(var(--width390) * 8px);
    margin-top: calc(var(--width390) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width390) * 8px) 0 0;
    width: calc(var(--width390) * 12px);
    height: calc(var(--width390) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width390) * 16px);
    margin: calc(var(--width390) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width390) * 15px);
    margin: calc(var(--width390) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width390) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width390) * 6px) calc(var(--width390) * 8px);
    font-size: calc(var(--width390) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width390) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width390) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width390) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width390) * 5px) calc(var(--width390) * 10px);
    font-size: calc(var(--width390) * 12px);
    border-radius: calc(var(--width390) * 5px);
    top: calc(var(--width390) * 5px);
    right: calc(var(--width390) * 5px);
    margin-bottom: calc(var(--width390) * -35px);
  }

  .artcons img {
    height: calc(var(--width390) * 506px);
    border-radius: calc(var(--width390) * 8px);
  }
  .detail-content ol{margin-left:calc(var(--width390) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width390) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width390) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width390) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width390) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width390) * 26px);
    font-size: calc(var(--width390) * 16px);
    margin: calc(var(--width390) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width390) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width390) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width390) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width390) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width390) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width390) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width390) * 120px);
  }

  .artcons {
    font-size: calc(var(--width390) * 16px);
  }

}

@media screen and (max-width: 379px) {
  :root {
    --radius-sm: calc(var(--width375) * 4px);
    --radius-md: calc(var(--width375) * 8px);
    --radius-lg: calc(var(--width375) * 24px);
    --page-pad: calc(var(--width375) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width375) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width375) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width375) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width375) * 48px);
    padding: calc(var(--width375) * 10px) calc(var(--width375) * 16px) calc(var(--width375) * 10px) calc(var(--width375) * 13px);
    box-shadow: 0 0 calc(var(--width375) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width375) * 8px);
    font-size: calc(var(--width375) * 18px);
  }

  .logo-img {
    width: calc(var(--width375) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width375) * 14px);
    margin-left: calc(var(--width375) * 4px);
  }

  .header-actions {
    gap: calc(var(--width375) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width375) * 18px);
    height: calc(var(--width375) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width375) * 320px);
    box-shadow: calc(var(--width375) * -4px) 0 calc(var(--width375) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width375) * 52px);
    padding: 0 calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width375) * 20px);
    height: calc(var(--width375) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width375) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width375) * 14px) calc(var(--width375) * 20px);
    font-size: calc(var(--width375) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width375) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width375) * 48px);
    padding: 0 calc(var(--width375) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width375) * 8px);
    width: calc(var(--width375) * 36px);
    height: calc(var(--width375) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width375) * 20px);
    height: calc(var(--width375) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width375) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width375) * 16px) calc(var(--width375) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width375) * 8px);
    height: calc(var(--width375) * 44px);
    padding: 0 calc(var(--width375) * 16px);
    margin: 0 0 calc(var(--width375) * 18px);
    border-radius: calc(var(--width375) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width375) * 18px);
    height: calc(var(--width375) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width375) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width375) * 10px);
    margin: 0 0 calc(var(--width375) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width375) * 6px);
    min-height: calc(var(--width375) * 52px);
    padding: calc(var(--width375) * 12px) calc(var(--width375) * 16px);
    box-shadow: 0 0 calc(var(--width375) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width375) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width375) * 20px);
    height: calc(var(--width375) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width375) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width375) * 6px);
    height: calc(var(--width375) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width375) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width375) * 6px);
    height: calc(var(--width375) * 44px);
    border-radius: calc(var(--width375) * 21px);
    font-size: calc(var(--width375) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width375) * 16px);
    height: calc(var(--width375) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width375) * 14px);
    height: calc(var(--width375) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width375) * 16px) calc(var(--width375) * 16px) calc(var(--width375) * 26px);
  }

  .sechtitle {
    top: calc(var(--width375) * 12px);
    right: calc(var(--width375) * 12px);
    width: calc(var(--width375) * 36px);
    height: calc(var(--width375) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width375) * 22px);
    height: calc(var(--width375) * 22px);
  }

  .sechcon {
    margin: calc(var(--width375) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width375) * 20px);
    width: calc(var(--width375) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width375) * 198px);
  }

  .serchd {
    height: calc(var(--width375) * 46px);
    margin: 0 0 calc(var(--width375) * 18px);
    border-radius: calc(var(--width375) * 23px);
    padding: 0 calc(var(--width375) * 16px) 0 calc(var(--width375) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width375) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width375) * 36px);
    height: calc(var(--width375) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width375) * 20px);
    height: calc(var(--width375) * 20px);
  }

  .top-btn {
    gap: calc(var(--width375) * 8px);
  }

  .topbtna {
    height: calc(var(--width375) * 18px);
    padding: 0 calc(var(--width375) * 12px);
    border-radius: calc(var(--width375) * 11px);
    font-size: calc(var(--width375) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width375) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width375) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width375) * 6px);
    font-size: calc(var(--width375) * 32px);
    line-height: calc(var(--width375) * 36px);
    margin: calc(var(--width375) * 26px) 0 calc(var(--width375) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width375) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width375) * 6px) auto;
    letter-spacing: calc(var(--width375) * 4px);
    width: calc(var(--width375) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width375) * 12px);
    margin-bottom: calc(var(--width375) * 15px);
    letter-spacing: calc(var(--width375) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width375) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width375) * 98px);
    height: calc(var(--width375) * 32px);
    border-radius: calc(var(--width375) * 22px);
    font-size: calc(var(--width375) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width375) * 44px);
    width: calc(var(--width375) * 98px);
    height: calc(var(--width375) * 32px);
    border-radius: calc(var(--width375) * 26px);
    font-size: calc(var(--width375) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width375) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width375) * 12px);
  }

  .section-title {
    font-size: calc(var(--width375) * 18px);
  }

  .section-more {
    font-size: calc(var(--width375) * 14px);
  }

  .section-more b {
    width: calc(var(--width375) * 8px);
    height: calc(var(--width375) * 8px);
    margin: 0 0 0 calc(var(--width375) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width375) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width375) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width375) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width375) * 308px);
    border-radius: calc(var(--width375) * 5px);
    width: calc(var(--width375) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width375) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width375) * 8px);
    margin: calc(var(--width375) * 5px) calc(var(--width375) * 6px) 0 calc(var(--width375) * 10px);
    min-height: calc(var(--width375) * 56px);
    padding: 0 0 calc(var(--width375) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width375) * 3px);
    right: calc(var(--width375) * 3px);
    bottom: 0;
    height: calc(var(--width375) * 1px);
  }

  .card-icon {
    width: calc(var(--width375) * 40px);
    height: calc(var(--width375) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width375) * 14px);
    margin: 0 0 calc(var(--width375) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width375) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width375) * 6px);
    min-width: 0;
    font-size: calc(var(--width375) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width375) * 8px);
    height: calc(var(--width375) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width375) * 3px);
    height: calc(var(--width375) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width375) * 12px);
    margin: 0 0 calc(var(--width375) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width375) * 10px) calc(var(--width375) * 10px) calc(var(--width375) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width375) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width375) * 10px);
    font-size: calc(var(--width375) * 12px);
    width: calc(var(--width375) * 145px);
    height: calc(var(--width375) * 28px);
    border-radius: calc(var(--width375) * 14px);
  }

  .card-more b {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 9px);
    margin: 0 0 0 calc(var(--width375) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width375) * 4px);
    margin-top: calc(var(--width375) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width375) * 4px);
    height: calc(var(--width375) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width375) * 20px);
    border-radius: calc(var(--width375) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width375) * 14px) 0 calc(var(--width375) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width375) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width375) * 8px);
  }

  .tags-list {
    gap: calc(var(--width375) * 8px);
  }

  .tag {
    padding: calc(var(--width375) * 4px) calc(var(--width375) * 16px);
    border-radius: calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width375) * 12px);
    padding: calc(var(--width375) * 2px) calc(var(--width375) * 8px);
    border-radius: calc(var(--width375) * 12px);
  }

  .products-grid {
    gap: calc(var(--width375) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width375) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width375) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width375) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width375) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width375) * 16px);
    gap: calc(var(--width375) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width375) * 4px);
    height: calc(var(--width375) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width375) * 20px);
    border-radius: calc(var(--width375) * 2px);
  }

  .product-card {
    padding: calc(var(--width375) * 10px);
    min-width: 0;
    border-radius: calc(var(--width375) * 8px);
    box-shadow: 0 0 calc(var(--width375) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width375) * 10px);
    top: calc(var(--width375) * 8px);
    left: calc(var(--width375) * 10px);
    gap: calc(var(--width375) * 3px);
    max-width: calc(100% - calc(var(--width375) * 36px));
  }

  .tagsa {
    padding: calc(var(--width375) * 1px) calc(var(--width375) * 5px);
    font-size: calc(var(--width375) * 10px);
    border-radius: calc(var(--width375) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width375) * 1px) calc(var(--width375) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width375) * 8px);
    margin: calc(var(--width375) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width375) * 16px);
    margin: calc(var(--width375) * 7px) 0 calc(var(--width375) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width375) * 12px);
    margin-bottom: calc(var(--width375) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width375) * 11px);
  }

  .product-rating b {
    width: calc(var(--width375) * 10px);
    height: calc(var(--width375) * 10px);
    margin: 0 calc(var(--width375) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width375) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width375) * 24px);
    margin: calc(var(--width375) * 32px) auto calc(var(--width375) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width375) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width375) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width375) * 98px);
    padding: 0 calc(var(--width375) * 24px);
    height: calc(var(--width375) * 32px);
    border-radius: calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width375) * 9px);
    height: calc(var(--width375) * 5px);
    margin: 0 0 0 calc(var(--width375) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width375) * 88px);
    width: calc(var(--width375) * 88px);
    height: calc(var(--width375) * 28px);
    border-radius: calc(var(--width375) * 15px);
    font-size: calc(var(--width375) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width375) * 88px);
    width: calc(var(--width375) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width375) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width375) * 34px);
    border-radius: calc(var(--width375) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width375) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width375) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width375) * 8px);
    height: calc(var(--width375) * 34px);
    padding: 0 0 0 calc(var(--width375) * 7px);
    font-size: calc(var(--width375) * 16px);
    line-height: calc(var(--width375) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width375) * 18px);
    height: calc(var(--width375) * 18px);
    margin: 0 calc(var(--width375) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width375) * 4px);
    font-size: calc(var(--width375) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width375) * 11px);
    height: calc(var(--width375) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width375) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width375) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width375) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width375) * 12px);
    padding: calc(var(--width375) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width375) * 16px);
    margin-bottom: calc(var(--width375) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width375) * 14px);
    max-height: calc(var(--width375) * 20px);
    line-height: calc(var(--width375) * 18px);
    margin-bottom: calc(var(--width375) * 3px);
  }

  .article-tags {
    gap: calc(var(--width375) * 6px);
    margin-top: calc(var(--width375) * 4px);
  }

  .article-tag {
    padding: calc(var(--width375) * 1px) calc(var(--width375) * 8px);
    border-radius: calc(var(--width375) * 11px);
    font-size: calc(var(--width375) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width375) * 1px) calc(var(--width375) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width375) * 3px) calc(var(--width375) * 8px);
    font-size: calc(var(--width375) * 12px);
    border-radius: calc(var(--width375) * 12px);
  }

  .article-info {
    font-size: calc(var(--width375) * 12px);
    gap: calc(var(--width375) * 10px);
  }

  .article-thumb {
    width: calc(var(--width375) * 148px);
    height: calc(var(--width375) * 88px);
    border-radius: calc(var(--width375) * 6px);
    margin-top: calc(var(--width375) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width375) * 88px);
    height: calc(var(--width375) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width375) * 6px);
    height: calc(var(--width375) * 38px);
    margin-top: calc(var(--width375) * 16px);
    border-radius: calc(var(--width375) * 21px);
    font-size: calc(var(--width375) * 16px);
  }

  .icon-more {
    width: calc(var(--width375) * 16px);
    height: calc(var(--width375) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width375) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width375) * 3px) 0 0;
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width375) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width375) * 10px);
    padding: calc(var(--width375) * 12px) 0;
    font-size: calc(var(--width375) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width375) * 16px);
    height: calc(var(--width375) * 16px);
    margin: 0 calc(var(--width375) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width375) * 12px);
    padding-top: calc(var(--width375) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width375) * 12px);
    padding: calc(var(--width375) * 7px) 0;
    font-size: calc(var(--width375) * 13px);
    border-radius: calc(var(--width375) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width375) * 4px);
    width: calc(var(--width375) * 10px);
    height: calc(var(--width375) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width375) * 12px);
    margin: calc(var(--width375) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width375) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width375) * 16px) calc(var(--width375) * 15px) 0 calc(var(--width375) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width375) * 8px);
    margin-bottom: calc(var(--width375) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width375) * 198px);
    padding: 0 0 0 calc(var(--width375) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width375) * 14px);
    margin-bottom: calc(var(--width375) * 10px);
  }

  .footer-social {
    gap: calc(var(--width375) * 12px);
  }

  .footer-social a {
    width: calc(var(--width375) * 32px);
    height: calc(var(--width375) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width375) * 28px);
    height: calc(var(--width375) * 28px);
  }

  .footer-links {
    padding: calc(var(--width375) * 28px) calc(var(--width375) * 15px) calc(var(--width375) * 15px) calc(var(--width375) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width375) * 16px);
    margin-bottom: calc(var(--width375) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width375) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width375) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width375) * 15px) 0 calc(var(--width375) * 15px);
    gap: calc(var(--width375) * 15px);
    border-radius: calc(var(--width375) * 12px);
    padding: calc(var(--width375) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width375) * 120px);
    height: calc(var(--width375) * 120px);
    border-radius: calc(var(--width375) * 4px);
    margin: 0;
    margin: calc(var(--width375) * 10px) 0 calc(var(--width375) * 10px) calc(var(--width375) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width375) * 106px);
    height: calc(var(--width375) * 106px);
    border-radius: calc(var(--width375) * 4px);
  }

  .foot-line {
    width: calc(var(--width375) * 2px);
    height: calc(var(--width375) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width375) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width375) * 14px);
    margin: calc(var(--width375) * 6px) 0 calc(var(--width375) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width375) * 152px);
    height: calc(var(--width375) * 32px);
    padding: 0 calc(var(--width375) * 12px);
    border-radius: calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width375) * 14px) 0 calc(var(--width375) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width375) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width375) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width375) * 4px);
  }

  .gh {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width375) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width375) * 33px) 0 calc(var(--width375) * 26px);
  }

  .search-hero {
    padding: calc(var(--width375) * 20px) 0 calc(var(--width375) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width375) * 70px) 0 calc(var(--width375) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width375) * 14px);
  }

  .search-brand img {
    height: calc(var(--width375) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width375) * 14px);
    border-radius: calc(var(--width375) * 24px);
    padding: calc(var(--width375) * 3px) calc(var(--width375) * 3px) calc(var(--width375) * 3px) 0;
    height: calc(var(--width375) * 32px);
    box-shadow: 0 calc(var(--width375) * 2px) calc(var(--width375) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width375) * 12px) 0 calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width375) * 12px);
    height: calc(var(--width375) * 28px);
    border-radius: calc(var(--width375) * 19px);
    font-size: calc(var(--width375) * 12px);
  }

  .search-submit b {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
    margin: 0 calc(var(--width375) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width375) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width375) * 14px);
    line-height: calc(var(--width375) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width375) * 10px);
    max-height: calc(var(--width375) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width375) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 7px);
  }

  .search-main {
    padding: calc(var(--width375) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width375) * -32px));
    margin: 0 0 calc(var(--width375) * 17px) 0;
    padding: 0  calc(var(--width375) * 22px);
    height: calc(var(--width375) * 42px);
    box-shadow: 0 0 calc(var(--width375) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width375) * 8px);
    gap: calc(var(--width375) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width375) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width375) * 6px);
    width: calc(var(--width375) * 16px);
    height: calc(var(--width375) * 2px);
  }

  .search-right {
    font-size: calc(var(--width375) * 12px);
    margin: calc(var(--width375) * 12px) 0 calc(var(--width375) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width375) * 13px);
  }

  .empty-state {
    padding: calc(var(--width375) * 70px) 0 calc(var(--width375) * 68px);
  }

  .empty-img {
    width: calc(var(--width375) * 259px);
    margin: 0 auto calc(var(--width375) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width375) * 14px);
    margin: 0 auto calc(var(--width375) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width375) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width375) * 16px) 0 calc(var(--width375) * 32px);
  }

  .pagination {
    gap: calc(var(--width375) * 12px);
    margin-top: calc(var(--width375) * 20px);
  }

  .page-btns {
    gap: calc(var(--width375) * 10px) calc(var(--width375) * 4px);
  }

  .page-extra {
    gap: calc(var(--width375) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width375) * 32px);
    height: calc(var(--width375) * 32px);
    padding: 0 calc(var(--width375) * 8px);
    border-radius: calc(var(--width375) * 4px);
    font-size: calc(var(--width375) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width375) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width375) * 2px);
    font-size: calc(var(--width375) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width375) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width375) * 36px);
    height: calc(var(--width375) * 28px);
    border-radius: calc(var(--width375) * 6px);
    font-size: calc(var(--width375) * 12px);
    margin: 0 calc(var(--width375) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width375) * 14px);
    height: calc(var(--width375) * 28px);
    margin-left: calc(var(--width375) * 4px);
    border-radius: calc(var(--width375) * 3px);
    font-size: calc(var(--width375) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width375) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width375) * 27px);
    padding: calc(var(--width375) * 12px) calc(var(--width375) * 15px) 0 calc(var(--width375) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width375) * 4px);
    min-width: calc(var(--width375) * 68px);
    padding: 0;
    font-size: calc(var(--width375) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width375) * 20px);
    height: calc(var(--width375) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width375) * 20px);
    height: calc(var(--width375) * 3px);
    border-radius: calc(var(--width375) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width375) * 8px);
    padding: calc(var(--width375) * 15px) calc(var(--width375) * 12px) calc(var(--width375) * 10px) calc(var(--width375) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width375) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width375) * 32px);
    padding: 0 calc(var(--width375) * 12px);
    border-radius: calc(var(--width375) * 8px);
    font-size: calc(var(--width375) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width375) * 40px);
    gap: calc(var(--width375) * 2px);
    font-size: calc(var(--width375) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width375) * 18px);
    height: calc(var(--width375) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width375) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width375) * 8px);
    padding: calc(var(--width375) * 8px) calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width375) * 2px);
    height: calc(var(--width375) * 40px);
    border-radius: calc(var(--width375) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width375) * 18px);
    height: calc(var(--width375) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width375) * 10px);
    height: calc(var(--width375) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width375) * 4px) 0 calc(var(--width375) * 8px);
    gap: calc(var(--width375) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width375) * 7px) calc(var(--width375) * 3px);
    font-size: calc(var(--width375) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width375) * 26px);
    width: calc(var(--width375) * 6px);
    height: calc(var(--width375) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width375) * 18px);
    height: calc(var(--width375) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width375) * 10px);
    height: calc(var(--width375) * 12px);
    margin: 0 calc(var(--width375) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width375) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width375) * 12px) 0 calc(var(--width375) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width375) * 14px) calc(var(--width375) * 14px) calc(var(--width375) * 14px) calc(var(--width375) * 16px);
    margin: calc(var(--width375) * 12px) 0 calc(var(--width375) * 14px);
    border-radius: calc(var(--width375) * 10px);
    min-height: calc(var(--width375) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width375) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width375) * 14px);
    line-height: calc(var(--width375) * 18px);
    margin: calc(var(--width375) * 6px) 0 calc(var(--width375) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width375) * 12px);
    gap: calc(var(--width375) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width375) * 3px) 0 0;
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width375) * 3px) 0 0;
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width375) * 4px);
    padding: 0 0 calc(var(--width375) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width375) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width375) * 12px);
    margin-bottom: calc(var(--width375) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width375) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width375) * 10px) calc(var(--width375) * 15px) calc(var(--width375) * 12px) calc(var(--width375) * 15px);
    margin: calc(var(--width375) * 24px) 0 calc(var(--width375) * 16px);
    border-radius: calc(var(--width375) * 10px);
    min-height: calc(var(--width375) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width375) * 8px);
    min-width: 0;
    margin: calc(var(--width375) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width375) * 72px);
    height: calc(var(--width375) * 28px);
    padding: 0 calc(var(--width375) * 12px);
    border-radius: calc(var(--width375) * 14px);
    font-size: calc(var(--width375) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width375) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width375) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width375) * 24px);
    height: calc(var(--width375) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width375) * 15px) calc(var(--width375) * 12px) 0 calc(var(--width375) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width375) * 10px);
    margin-left: calc(var(--width375) * 2px);
  }

  .banner-img {
    width: calc(var(--width375) * 80px);
    height: calc(var(--width375) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width375) * 48px);
    padding: 0 calc(var(--width375) * 18px);
  }

  .catalog-back {
    left: calc(var(--width375) * 8px);
    width: calc(var(--width375) * 36px);
    height: calc(var(--width375) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width375) * 20px);
    height: calc(var(--width375) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width375) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width375) * 16px) calc(var(--width375) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width375) * 18px);
    margin: 0 0 calc(var(--width375) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width375) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width375) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width375) * 8px);
    box-shadow: 0 0 calc(var(--width375) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width375) * 4px);
    padding: calc(var(--width375) * 12px) calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width375) * 20px);
    height: calc(var(--width375) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width375) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width375) * 6px);
    height: calc(var(--width375) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width375) * 12px) calc(var(--width375) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width375) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width375) * 34px);
    padding: 0 calc(var(--width375) * 6px);
    border-radius: calc(var(--width375) * 8px);
    font-size: calc(var(--width375) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width375) * 16px) calc(var(--width375) * 10px);
    padding-bottom: calc(var(--width375) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width375) * 6px);
    min-width: 0;
    font-size: calc(var(--width375) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width375) * 18px);
    height: calc(var(--width375) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width375) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width375) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width375) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width375) * 120px);
    height: calc(var(--width375) * 68px);
    border-radius: calc(var(--width375) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width375) * 16px);
    min-height: calc(var(--width375) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width375) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width375) * 12px) 0 calc(var(--width375) * 10px);
    gap: calc(var(--width375) * 6px);
    font-size: calc(var(--width375) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width375) * 14px);
    height: calc(var(--width375) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width375) * 12px);
    margin: 0;
    padding: calc(var(--width375) * 16px);
    border-radius: calc(var(--width375) * 12px);
    box-shadow: 0 calc(var(--width375) * 2px) calc(var(--width375) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width375) * 206px);
    border-radius: calc(var(--width375) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width375) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width375) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width375) * 16px);
    margin: calc(var(--width375) * 4px) 0 calc(var(--width375) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width375) * 20px);
    font-size: calc(var(--width375) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width375) * 8px);
    margin-top: calc(var(--width375) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width375) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width375) * 2px) calc(var(--width375) * 10px);
    border-radius: calc(var(--width375) * 999px);
    font-size: calc(var(--width375) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width375) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width375) * 8px);
    padding: calc(var(--width375) * 10px) calc(var(--width375) * 15px) calc(var(--width375) * 16px) calc(var(--width375) * 15px);
    margin-bottom: calc(var(--width375) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width375) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width375) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width375) * 10px);
    padding: calc(var(--width375) * 10px) 0;
    font-size: calc(var(--width375) * 13px);
  }

  .widget-icon {
    width: calc(var(--width375) * 18px);
    height: calc(var(--width375) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width375) * 48px);
    height: calc(var(--width375) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width375) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width375) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width375) * 120px);
    height: calc(var(--width375) * 68px);
    border-radius: calc(var(--width375) * 4px);
    margin: 0 calc(var(--width375) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width375) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width375) * 16px);
    line-height: calc(var(--width375) * 18px);
    min-height: calc(var(--width375) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 12px);
    line-height: calc(var(--width375) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width375) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width375) * 14px);
    height: calc(var(--width375) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width375) * 14px);
    height: calc(var(--width375) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width375) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width375) * 110px);
    height: calc(var(--width375) * 62px);
    border-radius: calc(var(--width375) * 4px);
    margin: 0 calc(var(--width375) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width375) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width375) * 16px);
    line-height: calc(var(--width375) * 18px);
    min-height: calc(var(--width375) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 12px);
    line-height: calc(var(--width375) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width375) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width375) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width375) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width375) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width375) * 48px);
    height: calc(var(--width375) * 48px);
    border-radius: calc(var(--width375) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width375) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width375) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width375) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width375) * 2px);
    width: calc(var(--width375) * 68px);
    height: calc(var(--width375) * 27px);
    padding: 0;
    border-radius: calc(var(--width375) * 14px);
    font-size: calc(var(--width375) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width375) * 11px);
    height: calc(var(--width375) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width375) * 16px);
    padding: 0 0 0 calc(var(--width375) * 18px);
    font-size: calc(var(--width375) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width375) * 4px);
    height: calc(var(--width375) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width375) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width375) * 12px);
    padding: calc(var(--width375) * 8px) 0;
    font-size: calc(var(--width375) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width375) * 8px);
  }

  .widget-links {
    gap: calc(var(--width375) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width375) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width375) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width375) * 6px) 0 calc(var(--width375) * 6px);
    font-size: calc(var(--width375) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width375) * 12px) 0;
    font-size: calc(var(--width375) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width375) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width375) * 72px);
    padding-left: calc(var(--width375) * 16px);
    padding-right: calc(var(--width375) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width375) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width375) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width375) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width375) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width375) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width375) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width375) * 16px);
    font-size: calc(var(--width375) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width375) * 4px) calc(var(--width375) * 8px);
    border-radius: calc(var(--width375) * 4px);
    font-size: calc(var(--width375) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width375) * 16px) 0 calc(var(--width375) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width375) * 16px) 0 calc(var(--width375) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width375) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width375) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width375) * 12px) 0 calc(var(--width375) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width375) * 21px);
    margin-bottom: calc(var(--width375) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width375) * 8px);
    padding-bottom: calc(var(--width375) * 7px);
    margin-bottom: calc(var(--width375) * 10px);
  }

  .author-avatar {
    width: calc(var(--width375) * 36px);
    height: calc(var(--width375) * 36px);
    margin: 0 calc(var(--width375) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width375) * 12px);
    gap: calc(var(--width375) * 4px);
    margin: calc(var(--width375) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width375) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width375) * 2px) calc(var(--width375) * 10px);
    border-radius: calc(var(--width375) * 3px);
    font-size: calc(var(--width375) * 12px);
    margin-top: calc(var(--width375) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width375) * 15px);
    margin-bottom: calc(var(--width375) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width375) * 22px);
    margin: calc(var(--width375) * 18px) 0 calc(var(--width375) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width375) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width375) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width375) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width375) * 12px);
    margin-top: calc(var(--width375) * 6px);
  }

  .artcona {
    margin: calc(var(--width375) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width375) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width375) * 16px);
  }

  .box-title {
    font-size: calc(var(--width375) * 18px);
    margin-bottom: calc(var(--width375) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width375) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width375) * 14px);
    padding: calc(var(--width375) * 15px) calc(var(--width375) * 18px);
    border-radius: 0 calc(var(--width375) * 8px) calc(var(--width375) * 8px) 0;
    margin-bottom: calc(var(--width375) * 14px);
    line-height: calc(var(--width375) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width375) * 2px);
    border-radius: calc(var(--width375) * 2px) 0 0 calc(var(--width375) * 2px);
  }

  .related-list {
    gap: calc(var(--width375) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width375) * 8px);
    font-size: calc(var(--width375) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width375) * 4px);
    height: calc(var(--width375) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width375) * 12px);
    padding: calc(var(--width375) * 14px);
    box-shadow: 0 0 calc(var(--width375) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width375) * 8px);
    margin-bottom: calc(var(--width375) * 16px);
  }

  .tool-icon {
    width: calc(var(--width375) * 56px);
    height: calc(var(--width375) * 56px);
    border-radius: calc(var(--width375) * 8px);
    margin: 0 calc(var(--width375) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width375) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width375) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width375) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width375) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width375) * 10px);
    margin: calc(var(--width375) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width375) * 2px);
    height: calc(var(--width375) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width375) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width375) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width375) * 4px);
    font-size: calc(var(--width375) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width375) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width375) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width375) * 88px);
    height: calc(var(--width375) * 26px);
    border-radius: calc(var(--width375) * 17px);
    font-size: calc(var(--width375) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width375) * 88px);
    height: calc(var(--width375) * 26px);
    border-radius: calc(var(--width375) * 17px);
    gap: calc(var(--width375) * 4px);
    font-size: calc(var(--width375) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width375) * 13px);
    height: calc(var(--width375) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width375) * 12px);
    padding: calc(var(--width375) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width375) * 101px);
    height: calc(var(--width375) * 101px);
    border-radius: calc(var(--width375) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width375) * 88px);
    height: calc(var(--width375) * 88px);
    border-radius: calc(var(--width375) * 8px);
    padding: calc(var(--width375) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width375) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width375) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width375) * 162px);
    height: calc(var(--width375) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width375) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width375) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width375) * 4px);
    font-size: calc(var(--width375) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width375) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width375) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width375) * 1px) calc(var(--width375) * 8px);
    border-radius: calc(var(--width375) * 11px);
    font-size: calc(var(--width375) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width375) * 26px);
    padding: 0 calc(var(--width375) * 14px);
    border-radius: calc(var(--width375) * 13px);
    font-size: calc(var(--width375) * 12px);
    gap: calc(var(--width375) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width375) * 14px);
    height: calc(var(--width375) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width375) * 8px) calc(var(--width375) * 20px);
    font-size: calc(var(--width375) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width375) * 10px);
    margin-bottom: calc(var(--width375) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width375) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width375) * 10px);
    margin-bottom: calc(var(--width375) * 16px);
    border-radius: calc(var(--width375) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width375) * 16px);
    margin: 0 0 calc(var(--width375) * 10px);
  }

  .declared {
    border-radius: calc(var(--width375) * 8px);
    padding: calc(var(--width375) * 16px) calc(var(--width375) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width375) * 90px);
    height: calc(var(--width375) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width375) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width375) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width375) * 14px);
    line-height: calc(var(--width375) * 20px);
    margin: 0 0 calc(var(--width375) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width375) * 10px);
    font-size: calc(var(--width375) * 13px);
    margin: 0 0 calc(var(--width375) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width375) * 8px) calc(var(--width375) * 16px);
    min-height: calc(var(--width375) * 38px);
    box-shadow: 0 0 calc(var(--width375) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width375) * 8px);
    gap: calc(var(--width375) * 4px);
    font-size: calc(var(--width375) * 12px);
  }

  .author-list {
    gap: calc(var(--width375) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width375) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width375) * 10px);
    font-size: calc(var(--width375) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width375) * 4px);
    height: calc(var(--width375) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width375) * 3px);
    font-size: calc(var(--width375) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width375) * 26px);
  }

  .detail-products {
    margin: calc(var(--width375) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width375) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width375) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width375) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width375) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width375) * 3px);
    height: calc(var(--width375) * 14px);
    margin-right: calc(var(--width375) * 8px);
    margin-top: calc(var(--width375) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width375) * 8px) 0 0;
    width: calc(var(--width375) * 12px);
    height: calc(var(--width375) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width375) * 16px);
    margin: calc(var(--width375) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width375) * 15px);
    margin: calc(var(--width375) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width375) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width375) * 6px) calc(var(--width375) * 8px);
    font-size: calc(var(--width375) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width375) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width375) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width375) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width375) * 5px) calc(var(--width375) * 10px);
    font-size: calc(var(--width375) * 12px);
    border-radius: calc(var(--width375) * 5px);
    top: calc(var(--width375) * 5px);
    right: calc(var(--width375) * 5px);
    margin-bottom: calc(var(--width375) * -35px);
  }

  .artcons img {
    height: calc(var(--width375) * 506px);
    border-radius: calc(var(--width375) * 8px);
  }
  .detail-content ol{margin-left:calc(var(--width375) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width375) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width375) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width375) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width375) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width375) * 26px);
    font-size: calc(var(--width375) * 16px);
    margin: calc(var(--width375) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width375) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width375) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width375) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width375) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width375) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width375) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width375) * 120px);
  }

  .artcons {
    font-size: calc(var(--width375) * 16px);
  }

}

@media screen and (max-width: 361px) {
  :root {
    --radius-sm: calc(var(--width360) * 4px);
    --radius-md: calc(var(--width360) * 8px);
    --radius-lg: calc(var(--width360) * 24px);
    --page-pad: calc(var(--width360) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width360) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width360) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width360) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width360) * 48px);
    padding: calc(var(--width360) * 10px) calc(var(--width360) * 16px) calc(var(--width360) * 10px) calc(var(--width360) * 13px);
    box-shadow: 0 0 calc(var(--width360) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width360) * 8px);
    font-size: calc(var(--width360) * 18px);
  }

  .logo-img {
    width: calc(var(--width360) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width360) * 14px);
    margin-left: calc(var(--width360) * 4px);
  }

  .header-actions {
    gap: calc(var(--width360) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width360) * 18px);
    height: calc(var(--width360) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width360) * 320px);
    box-shadow: calc(var(--width360) * -4px) 0 calc(var(--width360) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width360) * 52px);
    padding: 0 calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width360) * 20px);
    height: calc(var(--width360) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width360) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width360) * 14px) calc(var(--width360) * 20px);
    font-size: calc(var(--width360) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width360) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width360) * 48px);
    padding: 0 calc(var(--width360) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width360) * 8px);
    width: calc(var(--width360) * 36px);
    height: calc(var(--width360) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width360) * 20px);
    height: calc(var(--width360) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width360) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width360) * 16px) calc(var(--width360) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width360) * 8px);
    height: calc(var(--width360) * 44px);
    padding: 0 calc(var(--width360) * 16px);
    margin: 0 0 calc(var(--width360) * 18px);
    border-radius: calc(var(--width360) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width360) * 18px);
    height: calc(var(--width360) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width360) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width360) * 10px);
    margin: 0 0 calc(var(--width360) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width360) * 6px);
    min-height: calc(var(--width360) * 52px);
    padding: calc(var(--width360) * 12px) calc(var(--width360) * 16px);
    box-shadow: 0 0 calc(var(--width360) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width360) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width360) * 20px);
    height: calc(var(--width360) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width360) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width360) * 6px);
    height: calc(var(--width360) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width360) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width360) * 6px);
    height: calc(var(--width360) * 44px);
    border-radius: calc(var(--width360) * 21px);
    font-size: calc(var(--width360) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width360) * 16px);
    height: calc(var(--width360) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width360) * 14px);
    height: calc(var(--width360) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width360) * 16px) calc(var(--width360) * 16px) calc(var(--width360) * 26px);
  }

  .sechtitle {
    top: calc(var(--width360) * 12px);
    right: calc(var(--width360) * 12px);
    width: calc(var(--width360) * 36px);
    height: calc(var(--width360) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width360) * 22px);
    height: calc(var(--width360) * 22px);
  }

  .sechcon {
    margin: calc(var(--width360) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width360) * 20px);
    width: calc(var(--width360) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width360) * 198px);
  }

  .serchd {
    height: calc(var(--width360) * 46px);
    margin: 0 0 calc(var(--width360) * 18px);
    border-radius: calc(var(--width360) * 23px);
    padding: 0 calc(var(--width360) * 16px) 0 calc(var(--width360) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width360) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width360) * 36px);
    height: calc(var(--width360) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width360) * 20px);
    height: calc(var(--width360) * 20px);
  }

  .top-btn {
    gap: calc(var(--width360) * 8px);
  }

  .topbtna {
    height: calc(var(--width360) * 18px);
    padding: 0 calc(var(--width360) * 12px);
    border-radius: calc(var(--width360) * 11px);
    font-size: calc(var(--width360) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width360) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width360) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width360) * 6px);
    font-size: calc(var(--width360) * 32px);
    line-height: calc(var(--width360) * 36px);
    margin: calc(var(--width360) * 26px) 0 calc(var(--width360) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width360) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width360) * 6px) auto;
    letter-spacing: calc(var(--width360) * 4px);
    width: calc(var(--width360) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width360) * 12px);
    margin-bottom: calc(var(--width360) * 15px);
    letter-spacing: calc(var(--width360) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width360) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width360) * 98px);
    height: calc(var(--width360) * 32px);
    border-radius: calc(var(--width360) * 22px);
    font-size: calc(var(--width360) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width360) * 44px);
    width: calc(var(--width360) * 98px);
    height: calc(var(--width360) * 32px);
    border-radius: calc(var(--width360) * 26px);
    font-size: calc(var(--width360) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width360) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width360) * 12px);
  }

  .section-title {
    font-size: calc(var(--width360) * 18px);
  }

  .section-more {
    font-size: calc(var(--width360) * 14px);
  }

  .section-more b {
    width: calc(var(--width360) * 8px);
    height: calc(var(--width360) * 8px);
    margin: 0 0 0 calc(var(--width360) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width360) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width360) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width360) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width360) * 308px);
    border-radius: calc(var(--width360) * 5px);
    width: calc(var(--width360) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width360) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width360) * 8px);
    margin: calc(var(--width360) * 5px) calc(var(--width360) * 6px) 0 calc(var(--width360) * 10px);
    min-height: calc(var(--width360) * 56px);
    padding: 0 0 calc(var(--width360) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width360) * 3px);
    right: calc(var(--width360) * 3px);
    bottom: 0;
    height: calc(var(--width360) * 1px);
  }

  .card-icon {
    width: calc(var(--width360) * 40px);
    height: calc(var(--width360) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width360) * 14px);
    margin: 0 0 calc(var(--width360) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width360) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width360) * 6px);
    min-width: 0;
    font-size: calc(var(--width360) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width360) * 8px);
    height: calc(var(--width360) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width360) * 3px);
    height: calc(var(--width360) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width360) * 12px);
    margin: 0 0 calc(var(--width360) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width360) * 10px) calc(var(--width360) * 10px) calc(var(--width360) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width360) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width360) * 10px);
    font-size: calc(var(--width360) * 12px);
    width: calc(var(--width360) * 145px);
    height: calc(var(--width360) * 28px);
    border-radius: calc(var(--width360) * 14px);
  }

  .card-more b {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 9px);
    margin: 0 0 0 calc(var(--width360) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width360) * 4px);
    margin-top: calc(var(--width360) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width360) * 4px);
    height: calc(var(--width360) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width360) * 20px);
    border-radius: calc(var(--width360) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width360) * 14px) 0 calc(var(--width360) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width360) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width360) * 8px);
  }

  .tags-list {
    gap: calc(var(--width360) * 8px);
  }

  .tag {
    padding: calc(var(--width360) * 4px) calc(var(--width360) * 16px);
    border-radius: calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width360) * 12px);
    padding: calc(var(--width360) * 2px) calc(var(--width360) * 8px);
    border-radius: calc(var(--width360) * 12px);
  }

  .products-grid {
    gap: calc(var(--width360) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width360) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width360) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width360) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width360) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width360) * 16px);
    gap: calc(var(--width360) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width360) * 4px);
    height: calc(var(--width360) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width360) * 20px);
    border-radius: calc(var(--width360) * 2px);
  }

  .product-card {
    padding: calc(var(--width360) * 10px);
    min-width: 0;
    border-radius: calc(var(--width360) * 8px);
    box-shadow: 0 0 calc(var(--width360) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width360) * 10px);
    top: calc(var(--width360) * 8px);
    left: calc(var(--width360) * 10px);
    gap: calc(var(--width360) * 3px);
    max-width: calc(100% - calc(var(--width360) * 36px));
  }

  .tagsa {
    padding: calc(var(--width360) * 1px) calc(var(--width360) * 5px);
    font-size: calc(var(--width360) * 10px);
    border-radius: calc(var(--width360) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width360) * 1px) calc(var(--width360) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width360) * 8px);
    margin: calc(var(--width360) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width360) * 16px);
    margin: calc(var(--width360) * 7px) 0 calc(var(--width360) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width360) * 12px);
    margin-bottom: calc(var(--width360) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width360) * 11px);
  }

  .product-rating b {
    width: calc(var(--width360) * 10px);
    height: calc(var(--width360) * 10px);
    margin: 0 calc(var(--width360) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width360) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width360) * 24px);
    margin: calc(var(--width360) * 32px) auto calc(var(--width360) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width360) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width360) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width360) * 98px);
    padding: 0 calc(var(--width360) * 24px);
    height: calc(var(--width360) * 32px);
    border-radius: calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width360) * 9px);
    height: calc(var(--width360) * 5px);
    margin: 0 0 0 calc(var(--width360) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width360) * 88px);
    width: calc(var(--width360) * 88px);
    height: calc(var(--width360) * 28px);
    border-radius: calc(var(--width360) * 15px);
    font-size: calc(var(--width360) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width360) * 88px);
    width: calc(var(--width360) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width360) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width360) * 34px);
    border-radius: calc(var(--width360) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width360) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width360) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width360) * 8px);
    height: calc(var(--width360) * 34px);
    padding: 0 0 0 calc(var(--width360) * 7px);
    font-size: calc(var(--width360) * 16px);
    line-height: calc(var(--width360) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width360) * 18px);
    height: calc(var(--width360) * 18px);
    margin: 0 calc(var(--width360) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width360) * 4px);
    font-size: calc(var(--width360) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width360) * 11px);
    height: calc(var(--width360) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width360) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width360) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width360) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width360) * 12px);
    padding: calc(var(--width360) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width360) * 16px);
    margin-bottom: calc(var(--width360) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width360) * 14px);
    max-height: calc(var(--width360) * 20px);
    line-height: calc(var(--width360) * 18px);
    margin-bottom: calc(var(--width360) * 3px);
  }

  .article-tags {
    gap: calc(var(--width360) * 6px);
    margin-top: calc(var(--width360) * 4px);
  }

  .article-tag {
    padding: calc(var(--width360) * 1px) calc(var(--width360) * 8px);
    border-radius: calc(var(--width360) * 11px);
    font-size: calc(var(--width360) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width360) * 1px) calc(var(--width360) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width360) * 3px) calc(var(--width360) * 8px);
    font-size: calc(var(--width360) * 12px);
    border-radius: calc(var(--width360) * 12px);
  }

  .article-info {
    font-size: calc(var(--width360) * 12px);
    gap: calc(var(--width360) * 10px);
  }

  .article-thumb {
    width: calc(var(--width360) * 148px);
    height: calc(var(--width360) * 88px);
    border-radius: calc(var(--width360) * 6px);
    margin-top: calc(var(--width360) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width360) * 88px);
    height: calc(var(--width360) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width360) * 6px);
    height: calc(var(--width360) * 38px);
    margin-top: calc(var(--width360) * 16px);
    border-radius: calc(var(--width360) * 21px);
    font-size: calc(var(--width360) * 16px);
  }

  .icon-more {
    width: calc(var(--width360) * 16px);
    height: calc(var(--width360) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width360) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width360) * 3px) 0 0;
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width360) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width360) * 10px);
    padding: calc(var(--width360) * 12px) 0;
    font-size: calc(var(--width360) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width360) * 16px);
    height: calc(var(--width360) * 16px);
    margin: 0 calc(var(--width360) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width360) * 12px);
    padding-top: calc(var(--width360) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width360) * 12px);
    padding: calc(var(--width360) * 7px) 0;
    font-size: calc(var(--width360) * 13px);
    border-radius: calc(var(--width360) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width360) * 4px);
    width: calc(var(--width360) * 10px);
    height: calc(var(--width360) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width360) * 12px);
    margin: calc(var(--width360) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width360) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width360) * 16px) calc(var(--width360) * 15px) 0 calc(var(--width360) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width360) * 8px);
    margin-bottom: calc(var(--width360) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width360) * 198px);
    padding: 0 0 0 calc(var(--width360) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width360) * 14px);
    margin-bottom: calc(var(--width360) * 10px);
  }

  .footer-social {
    gap: calc(var(--width360) * 12px);
  }

  .footer-social a {
    width: calc(var(--width360) * 32px);
    height: calc(var(--width360) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width360) * 28px);
    height: calc(var(--width360) * 28px);
  }

  .footer-links {
    padding: calc(var(--width360) * 28px) calc(var(--width360) * 15px) calc(var(--width360) * 15px) calc(var(--width360) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width360) * 16px);
    margin-bottom: calc(var(--width360) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width360) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width360) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width360) * 15px) 0 calc(var(--width360) * 15px);
    gap: calc(var(--width360) * 15px);
    border-radius: calc(var(--width360) * 12px);
    padding: calc(var(--width360) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width360) * 120px);
    height: calc(var(--width360) * 120px);
    border-radius: calc(var(--width360) * 4px);
    margin: 0;
    margin: calc(var(--width360) * 10px) 0 calc(var(--width360) * 10px) calc(var(--width360) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width360) * 106px);
    height: calc(var(--width360) * 106px);
    border-radius: calc(var(--width360) * 4px);
  }

  .foot-line {
    width: calc(var(--width360) * 2px);
    height: calc(var(--width360) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width360) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width360) * 14px);
    margin: calc(var(--width360) * 6px) 0 calc(var(--width360) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width360) * 152px);
    height: calc(var(--width360) * 32px);
    padding: 0 calc(var(--width360) * 12px);
    border-radius: calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width360) * 14px) 0 calc(var(--width360) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width360) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width360) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width360) * 4px);
  }

  .gh {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width360) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width360) * 33px) 0 calc(var(--width360) * 26px);
  }

  .search-hero {
    padding: calc(var(--width360) * 20px) 0 calc(var(--width360) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width360) * 70px) 0 calc(var(--width360) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width360) * 14px);
  }

  .search-brand img {
    height: calc(var(--width360) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width360) * 14px);
    border-radius: calc(var(--width360) * 24px);
    padding: calc(var(--width360) * 3px) calc(var(--width360) * 3px) calc(var(--width360) * 3px) 0;
    height: calc(var(--width360) * 32px);
    box-shadow: 0 calc(var(--width360) * 2px) calc(var(--width360) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width360) * 12px) 0 calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width360) * 12px);
    height: calc(var(--width360) * 28px);
    border-radius: calc(var(--width360) * 19px);
    font-size: calc(var(--width360) * 12px);
  }

  .search-submit b {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
    margin: 0 calc(var(--width360) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width360) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width360) * 14px);
    line-height: calc(var(--width360) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width360) * 10px);
    max-height: calc(var(--width360) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width360) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 7px);
  }

  .search-main {
    padding: calc(var(--width360) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width360) * -32px));
    margin: 0 0 calc(var(--width360) * 17px) 0;
    padding: 0  calc(var(--width360) * 22px);
    height: calc(var(--width360) * 42px);
    box-shadow: 0 0 calc(var(--width360) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width360) * 8px);
    gap: calc(var(--width360) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width360) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width360) * 6px);
    width: calc(var(--width360) * 16px);
    height: calc(var(--width360) * 2px);
  }

  .search-right {
    font-size: calc(var(--width360) * 12px);
    margin: calc(var(--width360) * 12px) 0 calc(var(--width360) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width360) * 13px);
  }

  .empty-state {
    padding: calc(var(--width360) * 70px) 0 calc(var(--width360) * 68px);
  }

  .empty-img {
    width: calc(var(--width360) * 259px);
    margin: 0 auto calc(var(--width360) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width360) * 14px);
    margin: 0 auto calc(var(--width360) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width360) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width360) * 16px) 0 calc(var(--width360) * 32px);
  }

  .pagination {
    gap: calc(var(--width360) * 12px);
    margin-top: calc(var(--width360) * 20px);
  }

  .page-btns {
    gap: calc(var(--width360) * 10px) calc(var(--width360) * 4px);
  }

  .page-extra {
    gap: calc(var(--width360) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width360) * 32px);
    height: calc(var(--width360) * 32px);
    padding: 0 calc(var(--width360) * 8px);
    border-radius: calc(var(--width360) * 4px);
    font-size: calc(var(--width360) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width360) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width360) * 2px);
    font-size: calc(var(--width360) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width360) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width360) * 36px);
    height: calc(var(--width360) * 28px);
    border-radius: calc(var(--width360) * 6px);
    font-size: calc(var(--width360) * 12px);
    margin: 0 calc(var(--width360) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width360) * 14px);
    height: calc(var(--width360) * 28px);
    margin-left: calc(var(--width360) * 4px);
    border-radius: calc(var(--width360) * 3px);
    font-size: calc(var(--width360) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width360) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width360) * 27px);
    padding: calc(var(--width360) * 12px) calc(var(--width360) * 15px) 0 calc(var(--width360) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width360) * 4px);
    min-width: calc(var(--width360) * 68px);
    padding: 0;
    font-size: calc(var(--width360) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width360) * 20px);
    height: calc(var(--width360) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width360) * 20px);
    height: calc(var(--width360) * 3px);
    border-radius: calc(var(--width360) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width360) * 8px);
    padding: calc(var(--width360) * 15px) calc(var(--width360) * 12px) calc(var(--width360) * 10px) calc(var(--width360) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width360) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width360) * 32px);
    padding: 0 calc(var(--width360) * 12px);
    border-radius: calc(var(--width360) * 8px);
    font-size: calc(var(--width360) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width360) * 40px);
    gap: calc(var(--width360) * 2px);
    font-size: calc(var(--width360) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width360) * 18px);
    height: calc(var(--width360) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width360) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width360) * 8px);
    padding: calc(var(--width360) * 8px) calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width360) * 2px);
    height: calc(var(--width360) * 40px);
    border-radius: calc(var(--width360) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width360) * 18px);
    height: calc(var(--width360) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width360) * 10px);
    height: calc(var(--width360) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width360) * 4px) 0 calc(var(--width360) * 8px);
    gap: calc(var(--width360) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width360) * 7px) calc(var(--width360) * 3px);
    font-size: calc(var(--width360) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width360) * 26px);
    width: calc(var(--width360) * 6px);
    height: calc(var(--width360) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width360) * 18px);
    height: calc(var(--width360) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width360) * 10px);
    height: calc(var(--width360) * 12px);
    margin: 0 calc(var(--width360) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width360) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width360) * 12px) 0 calc(var(--width360) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width360) * 14px) calc(var(--width360) * 14px) calc(var(--width360) * 14px) calc(var(--width360) * 16px);
    margin: calc(var(--width360) * 12px) 0 calc(var(--width360) * 14px);
    border-radius: calc(var(--width360) * 10px);
    min-height: calc(var(--width360) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width360) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width360) * 14px);
    line-height: calc(var(--width360) * 18px);
    margin: calc(var(--width360) * 6px) 0 calc(var(--width360) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width360) * 12px);
    gap: calc(var(--width360) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width360) * 3px) 0 0;
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width360) * 3px) 0 0;
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width360) * 4px);
    padding: 0 0 calc(var(--width360) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width360) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width360) * 12px);
    margin-bottom: calc(var(--width360) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width360) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width360) * 10px) calc(var(--width360) * 15px) calc(var(--width360) * 12px) calc(var(--width360) * 15px);
    margin: calc(var(--width360) * 24px) 0 calc(var(--width360) * 16px);
    border-radius: calc(var(--width360) * 10px);
    min-height: calc(var(--width360) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width360) * 8px);
    min-width: 0;
    margin: calc(var(--width360) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width360) * 72px);
    height: calc(var(--width360) * 28px);
    padding: 0 calc(var(--width360) * 12px);
    border-radius: calc(var(--width360) * 14px);
    font-size: calc(var(--width360) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width360) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width360) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width360) * 24px);
    height: calc(var(--width360) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width360) * 15px) calc(var(--width360) * 12px) 0 calc(var(--width360) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width360) * 10px);
    margin-left: calc(var(--width360) * 2px);
  }

  .banner-img {
    width: calc(var(--width360) * 80px);
    height: calc(var(--width360) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width360) * 48px);
    padding: 0 calc(var(--width360) * 18px);
  }

  .catalog-back {
    left: calc(var(--width360) * 8px);
    width: calc(var(--width360) * 36px);
    height: calc(var(--width360) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width360) * 20px);
    height: calc(var(--width360) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width360) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width360) * 16px) calc(var(--width360) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width360) * 18px);
    margin: 0 0 calc(var(--width360) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width360) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width360) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width360) * 8px);
    box-shadow: 0 0 calc(var(--width360) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width360) * 4px);
    padding: calc(var(--width360) * 12px) calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width360) * 20px);
    height: calc(var(--width360) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width360) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width360) * 6px);
    height: calc(var(--width360) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width360) * 12px) calc(var(--width360) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width360) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width360) * 34px);
    padding: 0 calc(var(--width360) * 6px);
    border-radius: calc(var(--width360) * 8px);
    font-size: calc(var(--width360) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width360) * 16px) calc(var(--width360) * 10px);
    padding-bottom: calc(var(--width360) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width360) * 6px);
    min-width: 0;
    font-size: calc(var(--width360) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width360) * 18px);
    height: calc(var(--width360) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width360) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width360) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width360) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width360) * 120px);
    height: calc(var(--width360) * 68px);
    border-radius: calc(var(--width360) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width360) * 16px);
    min-height: calc(var(--width360) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width360) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width360) * 12px) 0 calc(var(--width360) * 10px);
    gap: calc(var(--width360) * 6px);
    font-size: calc(var(--width360) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width360) * 14px);
    height: calc(var(--width360) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width360) * 12px);
    margin: 0;
    padding: calc(var(--width360) * 16px);
    border-radius: calc(var(--width360) * 12px);
    box-shadow: 0 calc(var(--width360) * 2px) calc(var(--width360) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width360) * 206px);
    border-radius: calc(var(--width360) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width360) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width360) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width360) * 16px);
    margin: calc(var(--width360) * 4px) 0 calc(var(--width360) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width360) * 20px);
    font-size: calc(var(--width360) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width360) * 8px);
    margin-top: calc(var(--width360) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width360) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width360) * 2px) calc(var(--width360) * 10px);
    border-radius: calc(var(--width360) * 999px);
    font-size: calc(var(--width360) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width360) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width360) * 8px);
    padding: calc(var(--width360) * 10px) calc(var(--width360) * 15px) calc(var(--width360) * 16px) calc(var(--width360) * 15px);
    margin-bottom: calc(var(--width360) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width360) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width360) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width360) * 10px);
    padding: calc(var(--width360) * 10px) 0;
    font-size: calc(var(--width360) * 13px);
  }

  .widget-icon {
    width: calc(var(--width360) * 18px);
    height: calc(var(--width360) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width360) * 48px);
    height: calc(var(--width360) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width360) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width360) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width360) * 120px);
    height: calc(var(--width360) * 68px);
    border-radius: calc(var(--width360) * 4px);
    margin: 0 calc(var(--width360) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width360) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width360) * 16px);
    line-height: calc(var(--width360) * 18px);
    min-height: calc(var(--width360) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 12px);
    line-height: calc(var(--width360) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width360) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width360) * 14px);
    height: calc(var(--width360) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width360) * 14px);
    height: calc(var(--width360) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width360) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width360) * 110px);
    height: calc(var(--width360) * 62px);
    border-radius: calc(var(--width360) * 4px);
    margin: 0 calc(var(--width360) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width360) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width360) * 16px);
    line-height: calc(var(--width360) * 18px);
    min-height: calc(var(--width360) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 12px);
    line-height: calc(var(--width360) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width360) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width360) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width360) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width360) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width360) * 48px);
    height: calc(var(--width360) * 48px);
    border-radius: calc(var(--width360) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width360) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width360) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width360) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width360) * 2px);
    width: calc(var(--width360) * 68px);
    height: calc(var(--width360) * 27px);
    padding: 0;
    border-radius: calc(var(--width360) * 14px);
    font-size: calc(var(--width360) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width360) * 11px);
    height: calc(var(--width360) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width360) * 16px);
    padding: 0 0 0 calc(var(--width360) * 18px);
    font-size: calc(var(--width360) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width360) * 4px);
    height: calc(var(--width360) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width360) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width360) * 12px);
    padding: calc(var(--width360) * 8px) 0;
    font-size: calc(var(--width360) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width360) * 8px);
  }

  .widget-links {
    gap: calc(var(--width360) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width360) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width360) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width360) * 6px) 0 calc(var(--width360) * 6px);
    font-size: calc(var(--width360) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width360) * 12px) 0;
    font-size: calc(var(--width360) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width360) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width360) * 72px);
    padding-left: calc(var(--width360) * 16px);
    padding-right: calc(var(--width360) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width360) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width360) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width360) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width360) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width360) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width360) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width360) * 16px);
    font-size: calc(var(--width360) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width360) * 4px) calc(var(--width360) * 8px);
    border-radius: calc(var(--width360) * 4px);
    font-size: calc(var(--width360) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width360) * 16px) 0 calc(var(--width360) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width360) * 16px) 0 calc(var(--width360) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width360) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width360) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width360) * 12px) 0 calc(var(--width360) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width360) * 21px);
    margin-bottom: calc(var(--width360) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width360) * 8px);
    padding-bottom: calc(var(--width360) * 7px);
    margin-bottom: calc(var(--width360) * 10px);
  }

  .author-avatar {
    width: calc(var(--width360) * 36px);
    height: calc(var(--width360) * 36px);
    margin: 0 calc(var(--width360) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width360) * 12px);
    gap: calc(var(--width360) * 4px);
    margin: calc(var(--width360) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width360) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width360) * 2px) calc(var(--width360) * 10px);
    border-radius: calc(var(--width360) * 3px);
    font-size: calc(var(--width360) * 12px);
    margin-top: calc(var(--width360) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width360) * 15px);
    margin-bottom: calc(var(--width360) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width360) * 22px);
    margin: calc(var(--width360) * 18px) 0 calc(var(--width360) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width360) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width360) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width360) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width360) * 12px);
    margin-top: calc(var(--width360) * 6px);
  }

  .artcona {
    margin: calc(var(--width360) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width360) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width360) * 16px);
  }

  .box-title {
    font-size: calc(var(--width360) * 18px);
    margin-bottom: calc(var(--width360) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width360) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width360) * 14px);
    padding: calc(var(--width360) * 15px) calc(var(--width360) * 18px);
    border-radius: 0 calc(var(--width360) * 8px) calc(var(--width360) * 8px) 0;
    margin-bottom: calc(var(--width360) * 14px);
    line-height: calc(var(--width360) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width360) * 2px);
    border-radius: calc(var(--width360) * 2px) 0 0 calc(var(--width360) * 2px);
  }

  .related-list {
    gap: calc(var(--width360) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width360) * 8px);
    font-size: calc(var(--width360) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width360) * 4px);
    height: calc(var(--width360) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width360) * 12px);
    padding: calc(var(--width360) * 14px);
    box-shadow: 0 0 calc(var(--width360) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width360) * 8px);
    margin-bottom: calc(var(--width360) * 16px);
  }

  .tool-icon {
    width: calc(var(--width360) * 56px);
    height: calc(var(--width360) * 56px);
    border-radius: calc(var(--width360) * 8px);
    margin: 0 calc(var(--width360) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width360) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width360) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width360) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width360) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width360) * 10px);
    margin: calc(var(--width360) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width360) * 2px);
    height: calc(var(--width360) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width360) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width360) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width360) * 4px);
    font-size: calc(var(--width360) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width360) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width360) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width360) * 88px);
    height: calc(var(--width360) * 26px);
    border-radius: calc(var(--width360) * 17px);
    font-size: calc(var(--width360) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width360) * 88px);
    height: calc(var(--width360) * 26px);
    border-radius: calc(var(--width360) * 17px);
    gap: calc(var(--width360) * 4px);
    font-size: calc(var(--width360) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width360) * 13px);
    height: calc(var(--width360) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width360) * 12px);
    padding: calc(var(--width360) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width360) * 101px);
    height: calc(var(--width360) * 101px);
    border-radius: calc(var(--width360) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width360) * 88px);
    height: calc(var(--width360) * 88px);
    border-radius: calc(var(--width360) * 8px);
    padding: calc(var(--width360) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width360) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width360) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width360) * 162px);
    height: calc(var(--width360) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width360) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width360) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width360) * 4px);
    font-size: calc(var(--width360) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width360) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width360) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width360) * 1px) calc(var(--width360) * 8px);
    border-radius: calc(var(--width360) * 11px);
    font-size: calc(var(--width360) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width360) * 26px);
    padding: 0 calc(var(--width360) * 14px);
    border-radius: calc(var(--width360) * 13px);
    font-size: calc(var(--width360) * 12px);
    gap: calc(var(--width360) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width360) * 14px);
    height: calc(var(--width360) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width360) * 8px) calc(var(--width360) * 20px);
    font-size: calc(var(--width360) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width360) * 10px);
    margin-bottom: calc(var(--width360) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width360) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width360) * 10px);
    margin-bottom: calc(var(--width360) * 16px);
    border-radius: calc(var(--width360) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width360) * 16px);
    margin: 0 0 calc(var(--width360) * 10px);
  }

  .declared {
    border-radius: calc(var(--width360) * 8px);
    padding: calc(var(--width360) * 16px) calc(var(--width360) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width360) * 90px);
    height: calc(var(--width360) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width360) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width360) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width360) * 14px);
    line-height: calc(var(--width360) * 20px);
    margin: 0 0 calc(var(--width360) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width360) * 10px);
    font-size: calc(var(--width360) * 13px);
    margin: 0 0 calc(var(--width360) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width360) * 8px) calc(var(--width360) * 16px);
    min-height: calc(var(--width360) * 38px);
    box-shadow: 0 0 calc(var(--width360) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width360) * 8px);
    gap: calc(var(--width360) * 4px);
    font-size: calc(var(--width360) * 12px);
  }

  .author-list {
    gap: calc(var(--width360) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width360) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width360) * 10px);
    font-size: calc(var(--width360) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width360) * 4px);
    height: calc(var(--width360) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width360) * 3px);
    font-size: calc(var(--width360) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width360) * 26px);
  }

  .detail-products {
    margin: calc(var(--width360) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width360) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width360) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width360) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width360) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width360) * 3px);
    height: calc(var(--width360) * 14px);
    margin-right: calc(var(--width360) * 8px);
    margin-top: calc(var(--width360) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width360) * 8px) 0 0;
    width: calc(var(--width360) * 12px);
    height: calc(var(--width360) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width360) * 16px);
    margin: calc(var(--width360) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width360) * 15px);
    margin: calc(var(--width360) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width360) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width360) * 6px) calc(var(--width360) * 8px);
    font-size: calc(var(--width360) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width360) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width360) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width360) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width360) * 5px) calc(var(--width360) * 10px);
    font-size: calc(var(--width360) * 12px);
    border-radius: calc(var(--width360) * 5px);
    top: calc(var(--width360) * 5px);
    right: calc(var(--width360) * 5px);
    margin-bottom: calc(var(--width360) * -35px);
  }

  .artcons img {
    height: calc(var(--width360) * 506px);
    border-radius: calc(var(--width360) * 8px);
  }
  .detail-content ol{margin-left:calc(var(--width360) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width360) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width360) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width360) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width360) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width360) * 26px);
    font-size: calc(var(--width360) * 16px);
    margin: calc(var(--width360) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width360) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width360) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width360) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width360) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width360) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width360) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width360) * 120px);
  }

  .artcons {
    font-size: calc(var(--width360) * 16px);
  }

}

@media screen and (max-width: 331px) {
  :root {
    --radius-sm: calc(var(--width330) * 4px);
    --radius-md: calc(var(--width330) * 8px);
    --radius-lg: calc(var(--width330) * 24px);
    --page-pad: calc(var(--width330) * 15px);
  }

  * {
    margin: 0;
    padding: 0;
  }

  html, body {
    margin: 0;
    padding: 0;
    font-size: calc(var(--width330) * 14px);
  }

  ul {
    padding-left: 0;
  }

  .page-list .page-list-body {
    padding-bottom: calc(var(--width330) * 32px);
  }

  .site-header {
    top: 0;
    box-shadow: 0 0 calc(var(--width330) * 4px) 0 rgba(0,0,0,0.06);
  }

  .header-inner {
    height: calc(var(--width330) * 48px);
    padding: calc(var(--width330) * 10px) calc(var(--width330) * 16px) calc(var(--width330) * 10px) calc(var(--width330) * 13px);
    box-shadow: 0 0 calc(var(--width330) * 4px) 0 rgba(0,0,0,0.06);
  }

  .logo {
    gap: calc(var(--width330) * 8px);
    font-size: calc(var(--width330) * 18px);
  }

  .logo-img {
    width: calc(var(--width330) * 150px);
  }

  .logo-text em {
    font-size: calc(var(--width330) * 14px);
    margin-left: calc(var(--width330) * 4px);
  }

  .header-actions {
    gap: calc(var(--width330) * 16px);
  }

  .btn-search img, .btn-user img, .btn-menu img {
    width: calc(var(--width330) * 18px);
    height: calc(var(--width330) * 18px);
  }

  .m-nav-mask {
    inset: 0;
  }

  .m-nav-panel {
    top: 0;
    right: 0;
    max-width: calc(var(--width330) * 320px);
    box-shadow: calc(var(--width330) * -4px) 0 calc(var(--width330) * 24px) rgba(0,0,0,.12);
  }

  .m-nav-hd {
    height: calc(var(--width330) * 52px);
    padding: 0 calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 16px);
  }

  .m-nav-close b {
    width: calc(var(--width330) * 20px);
    height: calc(var(--width330) * 20px);
  }

  .m-nav-list {
    padding: calc(var(--width330) * 12px) 0;
    gap: 0;
  }

  .m-nav-list a {
    padding: calc(var(--width330) * 14px) calc(var(--width330) * 20px);
    font-size: calc(var(--width330) * 15px);
  }

  .site-nav-layer {
    left: 0;
    top: 0;
  }

  .site-nav-inner {
    padding: 0 0 calc(var(--width330) * 40px);
  }

  .site-nav-hd {
    top: 0;
    height: calc(var(--width330) * 48px);
    padding: 0 calc(var(--width330) * 16px);
  }

  .site-nav-back {
    left: calc(var(--width330) * 8px);
    width: calc(var(--width330) * 36px);
    height: calc(var(--width330) * 36px);
  }

  .site-nav-back b {
    width: calc(var(--width330) * 20px);
    height: calc(var(--width330) * 19px);
  }

  .site-nav-title {
    margin: 0;
    font-size: calc(var(--width330) * 21px);
  }

  .site-nav-body {
    padding: calc(var(--width330) * 16px) calc(var(--width330) * 16px) 0;
  }

  .site-nav-search {
    gap: calc(var(--width330) * 8px);
    height: calc(var(--width330) * 44px);
    padding: 0 calc(var(--width330) * 16px);
    margin: 0 0 calc(var(--width330) * 18px);
    border-radius: calc(var(--width330) * 23px);
  }

  .site-nav-search b {
    width: calc(var(--width330) * 18px);
    height: calc(var(--width330) * 18px);
  }

  .site-nav-search span {
    min-width: 0;
    font-size: calc(var(--width330) * 16px);
  }

  .site-nav-list {
    gap: calc(var(--width330) * 10px);
    margin: 0 0 calc(var(--width330) * 50px);
  }

  .site-nav-item {
    gap: calc(var(--width330) * 6px);
    min-height: calc(var(--width330) * 52px);
    padding: calc(var(--width330) * 12px) calc(var(--width330) * 16px);
    box-shadow: 0 0 calc(var(--width330) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width330) * 10px);
  }

  .site-nav-item img {
    width: calc(var(--width330) * 20px);
    height: calc(var(--width330) * 20px);
  }

  .site-nav-item span {
    min-width: 0;
    font-size: calc(var(--width330) * 16px);
  }

  .site-nav-item i {
    width: calc(var(--width330) * 6px);
    height: calc(var(--width330) * 12px);
  }

  .site-nav-actions {
    gap: calc(var(--width330) * 16px);
  }

  .site-nav-login,
  .site-nav-trial {
    gap: calc(var(--width330) * 6px);
    height: calc(var(--width330) * 44px);
    border-radius: calc(var(--width330) * 21px);
    font-size: calc(var(--width330) * 16px);
  }

  .site-nav-login b {
    width: calc(var(--width330) * 16px);
    height: calc(var(--width330) * 16px);
  }

  .site-nav-trial b {
    width: calc(var(--width330) * 14px);
    height: calc(var(--width330) * 14px);
  }

  .search-layer {
    left: 0;
    top: 0;
  }

  .schbg {
    padding: calc(var(--width330) * 16px) calc(var(--width330) * 16px) calc(var(--width330) * 26px);
  }

  .sechtitle {
    top: calc(var(--width330) * 12px);
    right: calc(var(--width330) * 12px);
    width: calc(var(--width330) * 36px);
    height: calc(var(--width330) * 36px);
  }

  .sechtitle b {
    width: calc(var(--width330) * 22px);
    height: calc(var(--width330) * 22px);
  }

  .sechcon {
    margin: calc(var(--width330) * 42px) 0 0;
  }

  .sechconlogoa {
    margin: 0 auto calc(var(--width330) * 20px);
    width: calc(var(--width330) * 198px);
  }

  .sechconlogoa img {
    width: calc(var(--width330) * 198px);
  }

  .serchd {
    height: calc(var(--width330) * 46px);
    margin: 0 0 calc(var(--width330) * 18px);
    border-radius: calc(var(--width330) * 23px);
    padding: 0 calc(var(--width330) * 16px) 0 calc(var(--width330) * 16px);
  }

  .serchd input {
    min-width: 0;
    font-size: calc(var(--width330) * 16px);
    padding: 0;
    margin: 0;
  }

  .serchp {
    width: calc(var(--width330) * 36px);
    height: calc(var(--width330) * 36px);
    margin: 0;
    padding: 0;
  }

  .serchp b {
    width: calc(var(--width330) * 20px);
    height: calc(var(--width330) * 20px);
  }

  .top-btn {
    gap: calc(var(--width330) * 8px);
  }

  .topbtna {
    height: calc(var(--width330) * 18px);
    padding: 0 calc(var(--width330) * 12px);
    border-radius: calc(var(--width330) * 11px);
    font-size: calc(var(--width330) * 10px);
  }

  .curriculum {
    padding-top: 0;
    padding-bottom: calc(var(--width330) * 8px);
  }

  .hero-inner {
    min-height: calc(var(--width330) * 243px);
  }

  .hero-title {
    letter-spacing: calc(var(--width330) * 6px);
    font-size: calc(var(--width330) * 32px);
    line-height: calc(var(--width330) * 36px);
    margin: calc(var(--width330) * 26px) 0 calc(var(--width330) * 6px);
  }

  .hero-title span:nth-child(1) {
    letter-spacing: calc(var(--width330) * 5px);
  }

  .hero-title .highlight {
    margin: calc(var(--width330) * 6px) auto;
    letter-spacing: calc(var(--width330) * 4px);
    width: calc(var(--width330) * 210px);
  }

  .hero-subtitle {
    font-size: calc(var(--width330) * 12px);
    margin-bottom: calc(var(--width330) * 15px);
    letter-spacing: calc(var(--width330) * 0.5px);
  }

  .hero-btns {
    gap: calc(var(--width330) * 12px);
  }

  .btn-primary {
    max-width: calc(var(--width330) * 98px);
    height: calc(var(--width330) * 32px);
    border-radius: calc(var(--width330) * 22px);
    font-size: calc(var(--width330) * 12px);
  }

  .btn-outline {
    --border-radius: calc(var(--width330) * 44px);
    width: calc(var(--width330) * 98px);
    height: calc(var(--width330) * 32px);
    border-radius: calc(var(--width330) * 26px);
    font-size: calc(var(--width330) * 12px);
  }

  .btn-outline::after {
    left: 0;
    top: 0;
    border-radius: calc(var(--width330) * 26px);
  }

  .section-header {
    margin-bottom: calc(var(--width330) * 12px);
  }

  .section-title {
    font-size: calc(var(--width330) * 18px);
  }

  .section-more {
    font-size: calc(var(--width330) * 14px);
  }

  .section-more b {
    width: calc(var(--width330) * 8px);
    height: calc(var(--width330) * 8px);
    margin: 0 0 0 calc(var(--width330) * 3px);
  }

  .curriculum-scroll {
    padding: 0 var(--page-pad) calc(var(--width330) * 4px);
  }

  .curriculum-grid {
    gap: calc(var(--width330) * 10px);
  }

  .curriculum-card {
    box-shadow: 0 0 calc(var(--width330) * 2px) 0 rgba(0,0,0,0.1);
    min-height: calc(var(--width330) * 308px);
    border-radius: calc(var(--width330) * 5px);
    width: calc(var(--width330) * 165px);
  }

  .cardhd-left {
    min-width: 0;
  }

  .products {
    margin: calc(var(--width330) * 28px) 0 0 0;
  }

  .card-head {
    gap: calc(var(--width330) * 8px);
    margin: calc(var(--width330) * 5px) calc(var(--width330) * 6px) 0 calc(var(--width330) * 10px);
    min-height: calc(var(--width330) * 56px);
    padding: 0 0 calc(var(--width330) * 10px) 0;
  }

  .card-head::after {
    left: calc(var(--width330) * 3px);
    right: calc(var(--width330) * 3px);
    bottom: 0;
    height: calc(var(--width330) * 1px);
  }

  .card-icon {
    width: calc(var(--width330) * 40px);
    height: calc(var(--width330) * 40px);
  }

  .card-head h3 {
    font-size: calc(var(--width330) * 14px);
    margin: 0 0 calc(var(--width330) * 2px) 0;
  }

  .cardhd-left span {
    font-size: calc(var(--width330) * 12px);
  }

  .card-links li {
    min-width: 0;
  }

  .card-links a {
    gap: calc(var(--width330) * 6px);
    min-width: 0;
    font-size: calc(var(--width330) * 11px);
    padding: 0;
  }

  .card-links a span {
    min-width: 0;
  }

  .card-links a b {
    width: calc(var(--width330) * 8px);
    height: calc(var(--width330) * 8px);
  }

  .card-links a b::before {
    width: calc(var(--width330) * 3px);
    height: calc(var(--width330) * 3px);
  }

  .cdlt-title {
    font-size: calc(var(--width330) * 12px);
    margin: 0 0 calc(var(--width330) * 5px) 0;
  }

  .card-list {
    margin: calc(var(--width330) * 10px) calc(var(--width330) * 10px) calc(var(--width330) * 10px);
  }

  .card-links {
    margin: 0;
    gap: calc(var(--width330) * 7px);
  }

  .card-more {
    margin-top: calc(var(--width330) * 10px);
    font-size: calc(var(--width330) * 12px);
    width: calc(var(--width330) * 145px);
    height: calc(var(--width330) * 28px);
    border-radius: calc(var(--width330) * 14px);
  }

  .card-more b {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 9px);
    margin: 0 0 0 calc(var(--width330) * 4px);
  }

  .curriculum-dots {
    gap: calc(var(--width330) * 4px);
    margin-top: calc(var(--width330) * 12px);
  }

  .curriculum-dots .dot {
    width: calc(var(--width330) * 4px);
    height: calc(var(--width330) * 4px);
  }

  .curriculum-dots .dot.active {
    width: calc(var(--width330) * 20px);
    border-radius: calc(var(--width330) * 2px);
  }

  .hot-tags {
    padding: calc(var(--width330) * 14px) 0 calc(var(--width330) * 8px);
  }

  .hot-tags-row {
    margin-bottom: calc(var(--width330) * 25px);
  }

  .hot-tags-row:last-child {
    margin-bottom: 0;
  }

  .hot-tags-header {
    margin-bottom: calc(var(--width330) * 8px);
  }

  .tags-list {
    gap: calc(var(--width330) * 8px);
  }

  .tag {
    padding: calc(var(--width330) * 4px) calc(var(--width330) * 16px);
    border-radius: calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 14px);
  }

  .schjg .tag {
    font-size: calc(var(--width330) * 12px);
    padding: calc(var(--width330) * 2px) calc(var(--width330) * 8px);
    border-radius: calc(var(--width330) * 12px);
  }

  .products-grid {
    gap: calc(var(--width330) * 16px);
  }

  .page-detail .product-card {
    padding: calc(var(--width330) * 10px);
  }

  .swiper-container.products-swiper .swiper-slide {
    padding: calc(var(--width330) * 4px);
  }

  .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width330) * 12px);
  }

  .detail-layout .swiper-container.products-swiper .products-grid {
    gap: calc(var(--width330) * 16px);
  }

  .products-pagination {
    margin-top: calc(var(--width330) * 16px);
    gap: calc(var(--width330) * 6px);
  }

  .products-pagination .swiper-pagination-bullet {
    width: calc(var(--width330) * 4px);
    height: calc(var(--width330) * 4px);
    margin: 0 !important;
  }

  .products-pagination .swiper-pagination-bullet-active {
    width: calc(var(--width330) * 20px);
    border-radius: calc(var(--width330) * 2px);
  }

  .product-card {
    padding: calc(var(--width330) * 10px);
    min-width: 0;
    border-radius: calc(var(--width330) * 8px);
    box-shadow: 0 0 calc(var(--width330) * 4px) 0 rgba(203,203,203,0.42);
  }

  .product-tags {
    border-radius: calc(var(--width330) * 10px);
    top: calc(var(--width330) * 8px);
    left: calc(var(--width330) * 10px);
    gap: calc(var(--width330) * 3px);
    max-width: calc(100% - calc(var(--width330) * 36px));
  }

  .tagsa {
    padding: calc(var(--width330) * 1px) calc(var(--width330) * 5px);
    font-size: calc(var(--width330) * 10px);
    border-radius: calc(var(--width330) * 8px);
  }

  .detail-layout .tagsa {
    padding: calc(var(--width330) * 1px) calc(var(--width330) * 4px);
  }

  .product-thumb {
    border-radius: calc(var(--width330) * 8px);
    margin: calc(var(--width330) * 24px) 0 0 0;
  }

  .product-name {
    font-size: calc(var(--width330) * 16px);
    margin: calc(var(--width330) * 7px) 0 calc(var(--width330) * 3px) 0;
  }

  .product-meta {
    font-size: calc(var(--width330) * 12px);
    margin-bottom: calc(var(--width330) * 4px);
  }

  .product-rating {
    min-width: 0;
    font-size: calc(var(--width330) * 11px);
  }

  .product-rating b {
    width: calc(var(--width330) * 10px);
    height: calc(var(--width330) * 10px);
    margin: 0 calc(var(--width330) * 2px) 0 0;
  }

  .product-rating span {
    min-width: 0;
  }

  .product-rating span:nth-of-type(1) {
    margin: 0 calc(var(--width330) * 3px);
  }

  .product-rating span:nth-of-type(2) {
    min-width: 0;
  }

  .feed-layout {
    gap: calc(var(--width330) * 24px);
    margin: calc(var(--width330) * 32px) auto calc(var(--width330) * 32px);
  }

  .feed-main {
    min-width: 0;
  }

  .feed-sidebar {
    border-radius: 0;
  }

  .feed-tabs {
    gap: calc(var(--width330) * 10px);
    padding-right: 0;
    padding: 0 var(--page-pad) calc(var(--width330) * 2px);
  }

  .feed-tabs .tab {
    width: calc(var(--width330) * 98px);
    padding: 0 calc(var(--width330) * 24px);
    height: calc(var(--width330) * 32px);
    border-radius: calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 14px);
  }

  .feed-tabs .tab.more b {
    width: calc(var(--width330) * 9px);
    height: calc(var(--width330) * 5px);
    margin: 0 0 0 calc(var(--width330) * 4px);
  }

  .page-list .feed-tabs .tab {
    min-width: calc(var(--width330) * 88px);
    width: calc(var(--width330) * 88px);
    height: calc(var(--width330) * 28px);
    border-radius: calc(var(--width330) * 15px);
    font-size: calc(var(--width330) * 12px);
    padding: 0;
  }

  .page-list .feed-tabs .tab.active {
    min-width: calc(var(--width330) * 88px);
    width: calc(var(--width330) * 88px);
  }

  .sidiv {
    margin: 0;
  }

  .sidiv .sidebar-list {
    gap: calc(var(--width330) * 16px);
    margin: 0;
  }

  .sidiv .sidebar-list li {
    height: calc(var(--width330) * 34px);
    border-radius: calc(var(--width330) * 4px);
  }

  .sidiv .sidebar-list li.is-hot {
    border-radius: calc(var(--width330) * 4px);
  }

  .sidiv .sidebar-list li.is-new {
    border-radius: calc(var(--width330) * 4px);
  }

  .sidiv .sidebar-list a {
    gap: calc(var(--width330) * 8px);
    height: calc(var(--width330) * 34px);
    padding: 0 0 0 calc(var(--width330) * 7px);
    font-size: calc(var(--width330) * 16px);
    line-height: calc(var(--width330) * 34px);
  }

  .sidiv .sidebar-icon {
    width: calc(var(--width330) * 18px);
    height: calc(var(--width330) * 18px);
    margin: 0 calc(var(--width330) * 6px) 0 0;
  }

  .sidiv .sidebar-text {
    min-width: 0;
  }

  .sidiv .sidebar-views {
    gap: calc(var(--width330) * 4px);
    font-size: calc(var(--width330) * 16px);
    padding-top: 0;
  }

  .sidiv .sidebar-views .views-icon {
    width: calc(var(--width330) * 11px);
    height: calc(var(--width330) * 14px);
  }

  .sidiv .products-pagination {
    margin-top: calc(var(--width330) * 16px);
  }

  .widget-box .products-pagination {
    margin-top: calc(var(--width330) * 16px);
  }

  .article-list {
    gap: 0;
    margin: calc(var(--width330) * 4px) 0 0 0;
  }

  .article-item {
    gap: calc(var(--width330) * 12px);
    padding: calc(var(--width330) * 10px) 0;
  }

  .article-body {
    min-width: 0;
  }

  .article-title {
    font-size: calc(var(--width330) * 16px);
    margin-bottom: calc(var(--width330) * 2px);
  }

  .article-summary {
    font-size: calc(var(--width330) * 14px);
    max-height: calc(var(--width330) * 20px);
    line-height: calc(var(--width330) * 18px);
    margin-bottom: calc(var(--width330) * 3px);
  }

  .article-tags {
    gap: calc(var(--width330) * 6px);
    margin-top: calc(var(--width330) * 4px);
  }

  .article-tag {
    padding: calc(var(--width330) * 1px) calc(var(--width330) * 8px);
    border-radius: calc(var(--width330) * 11px);
    font-size: calc(var(--width330) * 10px);
  }

  .idx .article-tag,.schjg .article-tag {
    padding: calc(var(--width330) * 1px) calc(var(--width330) * 8px);
  }

  .artdtl .article-tag {
    padding: calc(var(--width330) * 3px) calc(var(--width330) * 8px);
    font-size: calc(var(--width330) * 12px);
    border-radius: calc(var(--width330) * 12px);
  }

  .article-info {
    font-size: calc(var(--width330) * 12px);
    gap: calc(var(--width330) * 10px);
  }

  .article-thumb {
    width: calc(var(--width330) * 148px);
    height: calc(var(--width330) * 88px);
    border-radius: calc(var(--width330) * 6px);
    margin-top: calc(var(--width330) * 2px);
  }

  .article-thumb-small {
    width: calc(var(--width330) * 88px);
    height: calc(var(--width330) * 88px);
  }

  .btn-more-info {
    gap: calc(var(--width330) * 6px);
    height: calc(var(--width330) * 38px);
    margin-top: calc(var(--width330) * 16px);
    border-radius: calc(var(--width330) * 21px);
    font-size: calc(var(--width330) * 16px);
  }

  .icon-more {
    width: calc(var(--width330) * 16px);
    height: calc(var(--width330) * 16px);
  }

  .art-left-down {
    gap: calc(var(--width330) * 8px);
  }

  .info-name b,.info-time b,.info-watch b {
    margin: 0 calc(var(--width330) * 3px) 0 0;
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .sidebar-title {
    font-size: calc(var(--width330) * 17px);
  }

  .sidebar-list li {
    padding: 0;
  }

  .sidebar-list a {
    gap: calc(var(--width330) * 10px);
    padding: calc(var(--width330) * 12px) 0;
    font-size: calc(var(--width330) * 14px);
  }

  .sidebar-icon {
    width: calc(var(--width330) * 16px);
    height: calc(var(--width330) * 16px);
    margin: 0 calc(var(--width330) * 4px) 0 0;
  }

  .sidebar-text {
    min-width: 0;
  }

  .sidebar-views {
    font-size: calc(var(--width330) * 12px);
    padding-top: calc(var(--width330) * 2px);
  }

  .sidebar-more {
    margin-top: calc(var(--width330) * 12px);
    padding: calc(var(--width330) * 7px) 0;
    font-size: calc(var(--width330) * 13px);
    border-radius: calc(var(--width330) * 18px);
  }

  .sidebar-more b {
    margin: 0 0 0 calc(var(--width330) * 4px);
    width: calc(var(--width330) * 10px);
    height: calc(var(--width330) * 10px);
  }

  .sidebar-down {
    font-size: calc(var(--width330) * 12px);
    margin: calc(var(--width330) * 4px) 0 0 0;
  }

  .footer-inner {
    padding: 0 0 calc(var(--width330) * 16px);
  }

  .footer-brand {
    margin: 0;
    padding: calc(var(--width330) * 16px) calc(var(--width330) * 15px) 0 calc(var(--width330) * 15px);
  }

  .footer-logo {
    gap: calc(var(--width330) * 8px);
    margin-bottom: calc(var(--width330) * 8px);
  }

  .footer-logo-img {
    width: calc(var(--width330) * 198px);
    padding: 0 0 0 calc(var(--width330) * 5px);
  }

  .footer-desc {
    font-size: calc(var(--width330) * 14px);
    margin-bottom: calc(var(--width330) * 10px);
  }

  .footer-social {
    gap: calc(var(--width330) * 12px);
  }

  .footer-social a {
    width: calc(var(--width330) * 32px);
    height: calc(var(--width330) * 32px);
  }

  .footer-social a img {
    width: calc(var(--width330) * 28px);
    height: calc(var(--width330) * 28px);
  }

  .footer-links {
    padding: calc(var(--width330) * 28px) calc(var(--width330) * 15px) calc(var(--width330) * 15px) calc(var(--width330) * 15px);
    gap: 0;
  }

  .footer-col {
    min-width: 0;
  }

  .footer-col h4 {
    font-size: calc(var(--width330) * 16px);
    margin-bottom: calc(var(--width330) * 10px);
  }

  .footer-col ul {
    gap: calc(var(--width330) * 10px);
  }

  .footer-col a {
    font-size: calc(var(--width330) * 14px);
  }

  .footer-subscribe {
    margin: 0 calc(var(--width330) * 15px) 0 calc(var(--width330) * 15px);
    gap: calc(var(--width330) * 15px);
    border-radius: calc(var(--width330) * 12px);
    padding: calc(var(--width330) * 5px);
  }

  .footer-qrcode {
    width: calc(var(--width330) * 120px);
    height: calc(var(--width330) * 120px);
    border-radius: calc(var(--width330) * 4px);
    margin: 0;
    margin: calc(var(--width330) * 10px) 0 calc(var(--width330) * 10px) calc(var(--width330) * 10px);
  }

  .qrcode-img {
    width: calc(var(--width330) * 106px);
    height: calc(var(--width330) * 106px);
    border-radius: calc(var(--width330) * 4px);
  }

  .foot-line {
    width: calc(var(--width330) * 2px);
    height: calc(var(--width330) * 130px);
  }

  .footer-sub-info {
    min-width: 0;
  }

  .footer-sub-info .sub-title {
    font-size: calc(var(--width330) * 16px);
  }

  .footer-sub-info .sub-desc {
    font-size: calc(var(--width330) * 14px);
    margin: calc(var(--width330) * 6px) 0 calc(var(--width330) * 14px) 0;
  }

  .btn-subscribe {
    width: calc(var(--width330) * 152px);
    height: calc(var(--width330) * 32px);
    padding: 0 calc(var(--width330) * 12px);
    border-radius: calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 12px);
  }

  .footer-bottom {
    padding: calc(var(--width330) * 14px) 0 calc(var(--width330) * 18px);
  }

  .footer-bottom .container {
    gap: calc(var(--width330) * 45px);
  }

  .footer-copy,.footer-beian {
    font-size: calc(var(--width330) * 12px);
    margin: 0;
  }

  .footer-beian {
    gap: calc(var(--width330) * 4px);
  }

  .gh {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 13px);
    margin: 0;
  }

  .foot-qrcode p {
    font-size: calc(var(--width330) * 13px);
  }

  .search-hero-inner {
    padding: 0 calc(var(--width330) * 33px) 0 calc(var(--width330) * 26px);
  }

  .search-hero {
    padding: calc(var(--width330) * 20px) 0 calc(var(--width330) * 18px);
  }

  .schjg .search-hero {
    padding: calc(var(--width330) * 70px) 0 calc(var(--width330) * 28px);
  }

  .search-brand {
    margin: 0 auto calc(var(--width330) * 14px);
  }

  .search-brand img {
    height: calc(var(--width330) * 28px);
  }

  .search-box {
    margin: 0 auto calc(var(--width330) * 14px);
    border-radius: calc(var(--width330) * 24px);
    padding: calc(var(--width330) * 3px) calc(var(--width330) * 3px) calc(var(--width330) * 3px) 0;
    height: calc(var(--width330) * 32px);
    box-shadow: 0 calc(var(--width330) * 2px) calc(var(--width330) * 10px) rgba(40,168,120,0.16);
  }

  .search-input {
    min-width: 0;
    padding: 0 calc(var(--width330) * 12px) 0 calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 11px);
  }

  .search-submit {
    padding: 0 calc(var(--width330) * 12px);
    height: calc(var(--width330) * 28px);
    border-radius: calc(var(--width330) * 19px);
    font-size: calc(var(--width330) * 12px);
  }

  .search-submit b {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
    margin: 0 calc(var(--width330) * 4px) 0 0;
  }

  .hot-keywords {
    gap: calc(var(--width330) * 6px);
    margin: 0;
  }

  .hot-label {
    font-size: calc(var(--width330) * 14px);
    line-height: calc(var(--width330) * 26px);
  }

  .hot-keywords-list {
    min-width: 0;
    gap: calc(var(--width330) * 10px);
    max-height: calc(var(--width330) * 26px);
  }

  .schjg .tag.hot-toggle {
    padding: 0 calc(var(--width330) * 10px);
  }

  .hot-toggle b {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 7px);
  }

  .search-main {
    padding: calc(var(--width330) * 8px) 0 0;
  }

  .search-tabs {
    width: calc(100%calc(var(--width330) * -32px));
    margin: 0 0 calc(var(--width330) * 17px) 0;
    padding: 0  calc(var(--width330) * 22px);
    height: calc(var(--width330) * 42px);
    box-shadow: 0 0 calc(var(--width330) * 4px) 0 #F3EEFC;
    border-radius: calc(var(--width330) * 8px);
    gap: calc(var(--width330) * 26px);
  }

  .search-tab {
    font-size: calc(var(--width330) * 18px);
    margin-bottom: 0;
  }

  .search-tab.active::after {
    bottom: calc(var(--width330) * 6px);
    width: calc(var(--width330) * 16px);
    height: calc(var(--width330) * 2px);
  }

  .search-right {
    font-size: calc(var(--width330) * 12px);
    margin: calc(var(--width330) * 12px) 0 calc(var(--width330) * 4px);
  }

  .sch-list .article-list {
    margin-top: 0;
  }

  .search-count {
    font-size: calc(var(--width330) * 13px);
  }

  .empty-state {
    padding: calc(var(--width330) * 70px) 0 calc(var(--width330) * 68px);
  }

  .empty-img {
    width: calc(var(--width330) * 259px);
    margin: 0 auto calc(var(--width330) * 10px);
  }

  .empty-title {
    font-size: calc(var(--width330) * 14px);
    margin: 0 auto calc(var(--width330) * 10px);
  }

  .empty-desc {
    font-size: calc(var(--width330) * 14px);
  }

  .schjg .pagination {
    margin: calc(var(--width330) * 16px) 0 calc(var(--width330) * 32px);
  }

  .pagination {
    gap: calc(var(--width330) * 12px);
    margin-top: calc(var(--width330) * 20px);
  }

  .page-btns {
    gap: calc(var(--width330) * 10px) calc(var(--width330) * 4px);
  }

  .page-extra {
    gap: calc(var(--width330) * 10px);
  }

  .page-btn, .page-num {
    min-width: calc(var(--width330) * 32px);
    height: calc(var(--width330) * 32px);
    padding: 0 calc(var(--width330) * 8px);
    border-radius: calc(var(--width330) * 4px);
    font-size: calc(var(--width330) * 12px);
  }

  .page-btn.disabled, .page-btn.disabled:active {
    padding: 0 calc(var(--width330) * 12px);
  }

  .page-ellipsis {
    padding: 0 calc(var(--width330) * 2px);
    font-size: calc(var(--width330) * 12px);
  }

  .page-total, .page-jump {
    font-size: calc(var(--width330) * 14px);
  }

  .page-total {
    margin-left: 0;
  }

  .page-input {
    width: calc(var(--width330) * 36px);
    height: calc(var(--width330) * 28px);
    border-radius: calc(var(--width330) * 6px);
    font-size: calc(var(--width330) * 12px);
    margin: 0 calc(var(--width330) * 4px);
  }

  .page-go {
    padding: 0 calc(var(--width330) * 14px);
    height: calc(var(--width330) * 28px);
    margin-left: calc(var(--width330) * 4px);
    border-radius: calc(var(--width330) * 3px);
    font-size: calc(var(--width330) * 12px);
  }

  .page-list {
    padding: 0 0 calc(var(--width330) * 24px);
  }

  .ztlist.page-list {
    padding-bottom: 0;
  }

  .topic-detail.page-list {
    padding-bottom: 0;
  }

  .page-list-body {
    padding: 0;
  }

  .page-list-layout {
    gap: 0;
  }

  .page-main {
    min-width: 0;
    padding-top: 0;
  }

  .artlist.page-main {
    padding-top: 0;
    margin: 0;
  }

  .page-sidebar {
    margin: 0;
  }

  .artdtl .page-sidebar {
    margin-top: 0;
  }

  .topic-detail.page-list .page-sidebar,
  .topic-detail .page-main {
    margin-top: 0;
  }

  .m-cat-scroll {
    gap: calc(var(--width330) * 27px);
    padding: calc(var(--width330) * 12px) calc(var(--width330) * 15px) 0 calc(var(--width330) * 15px);
  }

  .m-cat-item {
    gap: calc(var(--width330) * 4px);
    min-width: calc(var(--width330) * 68px);
    padding: 0;
    font-size: calc(var(--width330) * 13px);
  }

  .m-cat-icon {
    width: calc(var(--width330) * 20px);
    height: calc(var(--width330) * 20px);
  }

  .m-cat-item.active::after {
    bottom: 0;
    width: calc(var(--width330) * 20px);
    height: calc(var(--width330) * 3px);
    border-radius: calc(var(--width330) * 2px);
  }

  .m-sub-bar {
    gap: calc(var(--width330) * 8px);
    padding: calc(var(--width330) * 15px) calc(var(--width330) * 12px) calc(var(--width330) * 10px) calc(var(--width330) * 16px);
  }

  .m-sub-scroll {
    min-width: 0;
    gap: calc(var(--width330) * 8px);
  }

  .m-sub-item {
    height: calc(var(--width330) * 32px);
    padding: 0 calc(var(--width330) * 12px);
    border-radius: calc(var(--width330) * 8px);
    font-size: calc(var(--width330) * 16px);
  }

  .btn-catalog {
    width: calc(var(--width330) * 40px);
    gap: calc(var(--width330) * 2px);
    font-size: calc(var(--width330) * 10px);
  }

  .btn-catalog b {
    width: calc(var(--width330) * 18px);
    height: calc(var(--width330) * 18px);
  }

  .left-nav {
    border-radius: 0;
    margin: 0;
    padding: 0;
  }

  .left-nav-list {
    border-radius: 0;
    gap: calc(var(--width330) * 10px);
  }

  .left-nav-list > li > .nav-parent {
    gap: calc(var(--width330) * 8px);
    padding: calc(var(--width330) * 8px) calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 15px);
  }

  .left-nav-list > li.active::before {
    left: 0;
    top: 0;
    width: calc(var(--width330) * 2px);
    height: calc(var(--width330) * 40px);
    border-radius: calc(var(--width330) * 4px);
  }

  .left-nav .nav-icon {
    width: calc(var(--width330) * 18px);
    height: calc(var(--width330) * 18px);
  }

  .left-nav .nav-label {
    min-width: 0;
  }

  .left-nav .nav-arrow {
    width: calc(var(--width330) * 10px);
    height: calc(var(--width330) * 10px);
  }

  .left-nav .sub-nav {
    padding: calc(var(--width330) * 4px) 0 calc(var(--width330) * 8px);
    gap: calc(var(--width330) * 2px);
  }

  .left-nav .sub-nav a {
    padding: calc(var(--width330) * 7px) calc(var(--width330) * 3px);
    font-size: calc(var(--width330) * 14px);
  }

  .left-nav .sub-nav a::before {
    left: calc(var(--width330) * 26px);
    width: calc(var(--width330) * 6px);
    height: calc(var(--width330) * 6px);
  }

  .newgx .nav-icon {
    width: calc(var(--width330) * 18px);
    height: calc(var(--width330) * 18px);
  }

  .breadcrumb img {
    width: calc(var(--width330) * 10px);
    height: calc(var(--width330) * 12px);
    margin: 0 calc(var(--width330) * 3px) 0 0;
  }

  .breadcrumb, .breadcrumb a {
    font-size: calc(var(--width330) * 12px);
  }

  .breadcrumb {
    margin: calc(var(--width330) * 12px) 0 calc(var(--width330) * 10px);
  }

  .topic-banner {
    padding: calc(var(--width330) * 14px) calc(var(--width330) * 14px) calc(var(--width330) * 14px) calc(var(--width330) * 16px);
    margin: calc(var(--width330) * 12px) 0 calc(var(--width330) * 14px);
    border-radius: calc(var(--width330) * 10px);
    min-height: calc(var(--width330) * 120px);
  }

  .banner-body {
    min-width: 0;
  }

  .banner-title {
    font-size: calc(var(--width330) * 18px);
  }

  .banner-desc {
    font-size: calc(var(--width330) * 14px);
    line-height: calc(var(--width330) * 18px);
    margin: calc(var(--width330) * 6px) 0 calc(var(--width330) * 8px);
  }

  .banner-meta {
    font-size: calc(var(--width330) * 12px);
    gap: calc(var(--width330) * 16px);
  }

  .banner-meta span {
    margin-right: 0;
  }

  .bninfo-num b {
    margin: 0 calc(var(--width330) * 3px) 0 0;
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .bninfo-gx b {
    margin: 0 calc(var(--width330) * 3px) 0 0;
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .paglist-sec {
    border-radius: 0;
    margin: 0;
  }

  .page-list .feed-tabs {
    margin: 0 0 calc(var(--width330) * 4px);
    padding: 0 0 calc(var(--width330) * 2px);
  }

  .page-list .article-item {
    padding: calc(var(--width330) * 14px) 0;
  }

  .page-list .article-info {
    gap: calc(var(--width330) * 12px);
    margin-bottom: calc(var(--width330) * 2px);
  }

  .page-list .article-tags {
    margin-top: calc(var(--width330) * 6px);
  }

  .topic-banner {
    padding: calc(var(--width330) * 10px) calc(var(--width330) * 15px) calc(var(--width330) * 12px) calc(var(--width330) * 15px);
    margin: calc(var(--width330) * 24px) 0 calc(var(--width330) * 16px);
    border-radius: calc(var(--width330) * 10px);
    min-height: calc(var(--width330) * 115px);
  }

  .topic-banner .banner-body {
    min-width: 0;
  }

  .topic-banner .banner-tabs {
    gap: calc(var(--width330) * 8px);
    min-width: 0;
    margin: calc(var(--width330) * 10px) 0 0;
    padding: 0;
  }

  .topic-banner .banner-tabs .tab {
    min-width: calc(var(--width330) * 72px);
    height: calc(var(--width330) * 28px);
    padding: 0 calc(var(--width330) * 12px);
    border-radius: calc(var(--width330) * 14px);
    font-size: calc(var(--width330) * 12px);
  }

  .topic-banner .banner-tabs .tab.active {
    min-width: calc(var(--width330) * 72px);
  }

  .m-cat-item {
    gap: 0;
    padding: 0;
    font-size: calc(var(--width330) * 18px);
  }

  .m-cat-item.active::after {
    width: calc(var(--width330) * 24px);
    height: calc(var(--width330) * 3px);
  }

  .m-sub-bar {
    padding: calc(var(--width330) * 15px) calc(var(--width330) * 12px) 0 calc(var(--width330) * 16px);
  }

  .btn-catalog {
    padding-left: calc(var(--width330) * 10px);
    margin-left: calc(var(--width330) * 2px);
  }

  .banner-img {
    width: calc(var(--width330) * 80px);
    height: calc(var(--width330) * 80px);
  }

  .catalog-mask {
    left: 0;
    top: 0;
  }

  .catalog-layer {
    right: 0;
    top: 0;
  }

  .catalog-hd {
    top: 0;
    height: calc(var(--width330) * 48px);
    padding: 0 calc(var(--width330) * 18px);
  }

  .catalog-back {
    left: calc(var(--width330) * 8px);
    width: calc(var(--width330) * 36px);
    height: calc(var(--width330) * 36px);
  }

  .catalog-back b {
    width: calc(var(--width330) * 20px);
    height: calc(var(--width330) * 19px);
  }

  .catalog-logo img {
    height: calc(var(--width330) * 28px);
  }

  .catalog-body {
    padding: 0 calc(var(--width330) * 16px) calc(var(--width330) * 32px);
  }

  .catalog-sec-title {
    font-size: calc(var(--width330) * 18px);
    margin: 0 0 calc(var(--width330) * 12px);
  }

  .catalog-left {
    margin: 0 0 calc(var(--width330) * 28px);
  }

  .catalog-nav {
    gap: calc(var(--width330) * 10px);
    margin: 0;
  }

  .catalog-nav > li {
    border-radius: calc(var(--width330) * 8px);
    box-shadow: 0 0 calc(var(--width330) * 4px) 0 #F3EEFC;
  }

  .catalog-nav > li > .nav-parent {
    gap: calc(var(--width330) * 4px);
    padding: calc(var(--width330) * 12px) calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 16px);
  }

  .catalog-nav .nav-icon {
    width: calc(var(--width330) * 20px);
    height: calc(var(--width330) * 20px);
  }

  .catalog-nav .nav-label {
    font-size: calc(var(--width330) * 16px);
  }

  .catalog-nav .nav-arrow {
    width: calc(var(--width330) * 6px);
    height: calc(var(--width330) * 12px);
  }

  .catalog-nav > li.open > .nav-parent .nav-arrow {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 6px);
  }

  .catalog-nav .sub-nav {
    padding: 0 calc(var(--width330) * 12px) calc(var(--width330) * 16px);
  }

  .catalog-nav > li.open > .sub-nav {
    gap: calc(var(--width330) * 10px);
  }

  .catalog-sub li {
    min-width: 0;
  }

  .catalog-sub a {
    height: calc(var(--width330) * 34px);
    padding: 0 calc(var(--width330) * 6px);
    border-radius: calc(var(--width330) * 8px);
    font-size: calc(var(--width330) * 12px);
  }

  .catalog-topics {
    gap: calc(var(--width330) * 16px) calc(var(--width330) * 10px);
    padding-bottom: calc(var(--width330) * 8px);
  }

  .catalog-topics a {
    gap: calc(var(--width330) * 6px);
    min-width: 0;
    font-size: calc(var(--width330) * 13px);
  }

  .catalog-topics a img {
    width: calc(var(--width330) * 18px);
    height: calc(var(--width330) * 18px);
  }

  .catalog-topics a span {
    min-width: 0;
  }

  .page-list .widget-box {
    border-radius: 0;
    padding: calc(var(--width330) * 25px) 0 0 0;
    margin: 0;
  }

  .page-list .widget-box .section-header {
    margin-bottom: calc(var(--width330) * 10px);
  }

  .page-list .widget-title,
  .page-list .sidebar-title {
    font-size: calc(var(--width330) * 18px);
    margin: 0;
  }

  .page-list .widget-hot-topics .widget-thumb,
  .page-list .widget-courses .widget-thumb {
    width: calc(var(--width330) * 120px);
    height: calc(var(--width330) * 68px);
    border-radius: calc(var(--width330) * 4px);
  }

  .page-list .widget-hot-topics .widget-text,
  .page-list .widget-courses .widget-text {
    font-size: calc(var(--width330) * 16px);
    min-height: calc(var(--width330) * 42px);
  }

  .topic-detail .topic-hero {
    padding: 0 0 calc(var(--width330) * 10px);
  }

  .topic-detail .topic-hero .breadcrumb {
    margin: 0;
    padding: calc(var(--width330) * 12px) 0 calc(var(--width330) * 10px);
    gap: calc(var(--width330) * 6px);
    font-size: calc(var(--width330) * 12px);
  }

  .topic-detail .topic-hero .breadcrumb img {
    width: calc(var(--width330) * 14px);
    height: calc(var(--width330) * 14px);
  }

  .topic-detail .topic-header {
    gap: calc(var(--width330) * 12px);
    margin: 0;
    padding: calc(var(--width330) * 16px);
    border-radius: calc(var(--width330) * 12px);
    box-shadow: 0 calc(var(--width330) * 2px) calc(var(--width330) * 8px) rgba(40, 168, 120, 0.06);
  }

  .topic-detail .topic-header-cover {
    height: calc(var(--width330) * 206px);
    border-radius: calc(var(--width330) * 10px);
  }

  .topic-detail .topic-header-img {
    border-radius: calc(var(--width330) * 8px);
  }

  .topic-detail .topic-header-body {
    min-width: 0;
    gap: 0;
  }

  .topic-detail .topic-header-title {
    font-size: calc(var(--width330) * 18px);
    margin: 0;
  }

  .topic-detail .topic-header-desc {
    font-size: calc(var(--width330) * 16px);
    margin: calc(var(--width330) * 4px) 0 calc(var(--width330) * 8px);
  }

  .topic-detail .topic-header-meta {
    gap: calc(var(--width330) * 20px);
    font-size: calc(var(--width330) * 12px);
    margin: 0;
  }

  .topic-detail .topic-header-meta span {
    margin-right: 0;
  }

  .topic-detail .topic-header-tags {
    gap: calc(var(--width330) * 8px);
    margin-top: calc(var(--width330) * 10px);
  }

  .topic-detail .topic-header-tags .tags-label {
    font-size: calc(var(--width330) * 14px);
  }

  .topic-detail .topic-header-tags .article-tag {
    padding: calc(var(--width330) * 2px) calc(var(--width330) * 10px);
    border-radius: calc(var(--width330) * 999px);
    font-size: calc(var(--width330) * 12px);
  }

  .topic-detail .page-list-body {
    padding-top: calc(var(--width330) * 4px);
  }

  .widget-box {
    border-radius: calc(var(--width330) * 8px);
    padding: calc(var(--width330) * 10px) calc(var(--width330) * 15px) calc(var(--width330) * 16px) calc(var(--width330) * 15px);
    margin-bottom: calc(var(--width330) * 20px);
  }

  .widget-title {
    font-size: calc(var(--width330) * 18px);
  }

  .xgxz .widget-title {
    margin-bottom: calc(var(--width330) * 10px);
  }

  .widget-list a {
    gap: calc(var(--width330) * 10px);
    padding: calc(var(--width330) * 10px) 0;
    font-size: calc(var(--width330) * 13px);
  }

  .widget-icon {
    width: calc(var(--width330) * 18px);
    height: calc(var(--width330) * 18px);
  }

  .widget-thumb {
    width: calc(var(--width330) * 48px);
    height: calc(var(--width330) * 48px);
  }

  .widget-meta {
    font-size: calc(var(--width330) * 12px);
  }

  .widget-hot-topics {
    gap: calc(var(--width330) * 16px);
  }

  .widget-hot-topics .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-hot-topics .widget-thumb {
    width: calc(var(--width330) * 120px);
    height: calc(var(--width330) * 68px);
    border-radius: calc(var(--width330) * 4px);
    margin: 0 calc(var(--width330) * 10px) 0 0;
  }

  .widget-hot-topics .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width330) * 8px);
  }

  .widget-hot-topics .widget-text {
    font-size: calc(var(--width330) * 16px);
    line-height: calc(var(--width330) * 18px);
    min-height: calc(var(--width330) * 45px);
  }

  .widget-hot-topics .widget-meta {
    gap: calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 12px);
    line-height: calc(var(--width330) * 16px);
  }

  .widget-hot-topics .widget-date, .widget-hot-topics .widget-view {
    gap: calc(var(--width330) * 4px);
  }

  .widget-hot-topics .widget-date b {
    width: calc(var(--width330) * 14px);
    height: calc(var(--width330) * 14px);
  }

  .widget-hot-topics .widget-view b {
    width: calc(var(--width330) * 14px);
    height: calc(var(--width330) * 14px);
  }

  .widget-courses {
    gap: calc(var(--width330) * 16px);
  }

  .widget-courses .widget-topic-link {
    padding: 0;
    gap: 0;
  }

  .widget-courses .widget-thumb {
    width: calc(var(--width330) * 110px);
    height: calc(var(--width330) * 62px);
    border-radius: calc(var(--width330) * 4px);
    margin: 0 calc(var(--width330) * 9px) 0 0;
  }

  .widget-courses .widget-topic-body {
    min-width: 0;
    gap: calc(var(--width330) * 8px);
  }

  .widget-courses .widget-text {
    font-size: calc(var(--width330) * 16px);
    line-height: calc(var(--width330) * 18px);
    min-height: calc(var(--width330) * 36px);
  }

  .widget-courses .widget-meta {
    gap: calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 12px);
    line-height: calc(var(--width330) * 16px);
  }

  .widget-courses .widget-author, .widget-courses .widget-view {
    gap: calc(var(--width330) * 4px);
  }

  .widget-courses .widget-author b {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .widget-courses .widget-view b {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .widget-downloads {
    gap: calc(var(--width330) * 13px);
  }

  .widget-downloads li {
    padding-bottom: calc(var(--width330) * 14px);
  }

  .widget-downloads .widget-dl-link {
    padding: 0;
    gap: calc(var(--width330) * 10px);
  }

  .widget-downloads .widget-app-icon {
    width: calc(var(--width330) * 48px);
    height: calc(var(--width330) * 48px);
    border-radius: calc(var(--width330) * 55px);
  }

  .widget-downloads .widget-dl-body {
    min-width: 0;
    gap: calc(var(--width330) * 4px);
  }

  .widget-downloads .widget-text {
    font-size: calc(var(--width330) * 16px);
  }

  .widget-downloads .widget-desc {
    font-size: calc(var(--width330) * 14px);
  }

  .widget-downloads .btn-dl {
    gap: calc(var(--width330) * 2px);
    width: calc(var(--width330) * 68px);
    height: calc(var(--width330) * 27px);
    padding: 0;
    border-radius: calc(var(--width330) * 14px);
    font-size: calc(var(--width330) * 12px);
  }

  .widget-downloads .btn-dl b {
    width: calc(var(--width330) * 11px);
    height: calc(var(--width330) * 10px);
  }

  .widget-links li {
    min-width: 0;
  }

  .widget-links a {
    line-height: calc(var(--width330) * 16px);
    padding: 0 0 0 calc(var(--width330) * 18px);
    font-size: calc(var(--width330) * 16px);
  }

  .widget-links a::before {
    left: 0;
    width: calc(var(--width330) * 4px);
    height: calc(var(--width330) * 4px);
  }

  .xgxz .widget-links a {
    padding: 0 0 0 calc(var(--width330) * 12px);
  }

  .widget-more {
    margin-top: calc(var(--width330) * 12px);
    padding: calc(var(--width330) * 8px) 0;
    font-size: calc(var(--width330) * 13px);
  }

  .tags-grid {
    gap: calc(var(--width330) * 8px);
  }

  .widget-links {
    gap: calc(var(--width330) * 12px);
  }

  .page-latest {
    padding: 0 0 calc(var(--width330) * 24px);
  }

  .latest-layout {
    gap: 0;
    margin: calc(var(--width330) * 16px) 0 0 0;
    padding: 0;
  }

  .latest-main {
    min-width: 0;
    border-radius: 0;
    padding: 0;
  }

  .latest-table th {
    padding: calc(var(--width330) * 6px) 0 calc(var(--width330) * 6px);
    font-size: calc(var(--width330) * 14px);
  }

  .latest-table td {
    padding: calc(var(--width330) * 12px) 0;
    font-size: calc(var(--width330) * 18px);
  }

  .latest-table td a {
    font-size: calc(var(--width330) * 14px);
  }

  .latest-table th:nth-child(1),
  .latest-table td:nth-child(1) {
    width: calc(var(--width330) * 72px);
    padding-left: calc(var(--width330) * 16px);
    padding-right: calc(var(--width330) * 4px);
  }

  .latest-table th:nth-child(1) {
    padding-left: calc(var(--width330) * 35px);
  }

  .latest-table th:nth-child(2),
  .latest-table td:nth-child(2) {
    padding-right: calc(var(--width330) * 6px);
  }

  .latest-table th:nth-child(2) {
    padding-left: calc(var(--width330) * 64px);
  }

  .latest-table th:nth-child(3),
  .latest-table td:nth-child(3) {
    width: calc(var(--width330) * 40px);
    padding-left: 0;
    padding-right: 0;
    font-size: calc(var(--width330) * 14px);
  }

  .latest-table th:nth-child(4),
  .latest-table td:nth-child(4) {
    width: calc(var(--width330) * 42px);
    padding-left: 0;
    padding-right: calc(var(--width330) * 16px);
    font-size: calc(var(--width330) * 14px);
  }

  .cat-tag {
    padding: calc(var(--width330) * 4px) calc(var(--width330) * 8px);
    border-radius: calc(var(--width330) * 4px);
    font-size: calc(var(--width330) * 11px);
  }

  .newgx .pagination {
    margin: calc(var(--width330) * 16px) 0 calc(var(--width330) * 8px);
  }

  .latest-main .pagination {
    padding: 0;
    margin: calc(var(--width330) * 16px) 0 calc(var(--width330) * 8px);
  }

  .latest-nav-list {
    margin: 0;
  }

  .page-detail {
    padding: 0 0 calc(var(--width330) * 24px);
  }

  .artdtl .page-detail {
    padding: 0 0 calc(var(--width330) * 30px);
  }

  .detail-layout {
    gap: 0;
  }

  .detail-main {
    min-width: 0;
  }

  .artdtl .breadcrumb {
    margin: calc(var(--width330) * 12px) 0 calc(var(--width330) * 10px);
  }

  .detail-title {
    font-size: calc(var(--width330) * 21px);
    margin-bottom: calc(var(--width330) * 12px);
  }

  .detail-meta {
    gap: calc(var(--width330) * 8px);
    padding-bottom: calc(var(--width330) * 7px);
    margin-bottom: calc(var(--width330) * 10px);
  }

  .author-avatar {
    width: calc(var(--width330) * 36px);
    height: calc(var(--width330) * 36px);
    margin: 0 calc(var(--width330) * 8px) 0 0;
  }

  .dtlmt-left {
    min-width: 0;
  }

  .dtlmtld {
    min-width: 0;
  }

  .dtlmltdd {
    font-size: calc(var(--width330) * 12px);
    gap: calc(var(--width330) * 4px);
    margin: calc(var(--width330) * 4px) 0 0;
  }

  .author-name {
    font-size: calc(var(--width330) * 12px);
  }

  .btn-copy {
    padding: calc(var(--width330) * 2px) calc(var(--width330) * 10px);
    border-radius: calc(var(--width330) * 3px);
    font-size: calc(var(--width330) * 12px);
    margin-top: calc(var(--width330) * 4px);
  }

  .detail-content {
    font-size: calc(var(--width330) * 15px);
    margin-bottom: calc(var(--width330) * 20px);
  }

  .detail-content h2 {
    font-size: calc(var(--width330) * 22px);
    margin: calc(var(--width330) * 18px) 0 calc(var(--width330) * 10px);
  }

  .detail-content p {
    margin-bottom: calc(var(--width330) * 14px);
  }

  .detail-figure {
    margin: calc(var(--width330) * 16px) 0;
  }

  .detail-figure img {
    border-radius: calc(var(--width330) * 8px);
  }

  .detail-figure figcaption {
    font-size: calc(var(--width330) * 12px);
    margin-top: calc(var(--width330) * 6px);
  }

  .artcona {
    margin: calc(var(--width330) * 14px) 0;
  }

  .artconimg {
    border-radius: calc(var(--width330) * 8px);
  }

  .related-box {
    margin-bottom: calc(var(--width330) * 16px);
  }

  .box-title {
    font-size: calc(var(--width330) * 18px);
    margin-bottom: calc(var(--width330) * 8px);
  }

  .box-header {
    margin-bottom: calc(var(--width330) * 10px);
  }

  .box-header .box-title {
    margin-bottom: 0;
  }

  .art-topdes {
    font-size: calc(var(--width330) * 14px);
    padding: calc(var(--width330) * 15px) calc(var(--width330) * 18px);
    border-radius: 0 calc(var(--width330) * 8px) calc(var(--width330) * 8px) 0;
    margin-bottom: calc(var(--width330) * 14px);
    line-height: calc(var(--width330) * 22px);
  }

  .art-topdes::after {
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(var(--width330) * 2px);
    border-radius: calc(var(--width330) * 2px) 0 0 calc(var(--width330) * 2px);
  }

  .related-list {
    gap: calc(var(--width330) * 8px);
  }

  .related-list li {
    min-width: 0;
  }

  .related-list a {
    padding-left: calc(var(--width330) * 8px);
    font-size: calc(var(--width330) * 16px);
  }

  .related-list a::before {
    left: 0;
    width: calc(var(--width330) * 4px);
    height: calc(var(--width330) * 4px);
  }

  .tool-card, .artdtl .tool-card {
    gap: calc(var(--width330) * 12px);
    padding: calc(var(--width330) * 14px);
    box-shadow: 0 0 calc(var(--width330) * 4px) rgba(203,203,203,.42);
    border-radius: calc(var(--width330) * 8px);
    margin-bottom: calc(var(--width330) * 16px);
  }

  .tool-icon {
    width: calc(var(--width330) * 56px);
    height: calc(var(--width330) * 56px);
    border-radius: calc(var(--width330) * 8px);
    margin: 0 calc(var(--width330) * 10px) 0 0;
  }

  .tool-body {
    min-width: 0;
    gap: calc(var(--width330) * 6px);
  }

  .tolbdd {
    min-width: 0;
  }

  .tolbddd {
    min-width: 0;
  }

  .tool-card-text .tool-body {
    gap: calc(var(--width330) * 4px);
  }

  .tool-name {
    font-size: calc(var(--width330) * 16px);
    margin: 0;
  }

  .tool-author {
    font-size: calc(var(--width330) * 14px);
    margin: 0;
  }

  .tool-meta {
    gap: calc(var(--width330) * 10px);
    margin: calc(var(--width330) * 2px) 0 0;
  }

  .tool-stars {
    gap: calc(var(--width330) * 2px);
    height: calc(var(--width330) * 16px);
  }

  .tool-stars b {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .tool-stars .star-full {
    margin: 0 calc(var(--width330) * 2px) 0 0;
  }

  .tool-score {
    font-size: calc(var(--width330) * 12px);
  }

  .tool-badge {
    gap: calc(var(--width330) * 4px);
    font-size: calc(var(--width330) * 12px);
  }

  .tool-badge b {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .tool-badge-safe {
    margin: 0;
  }

  .tool-desc {
    font-size: calc(var(--width330) * 12px);
    margin: 0;
  }

  .tool-btns, .artdtl .tool-btns {
    gap: calc(var(--width330) * 10px);
    margin: 0;
  }

  .tool-btn-copy {
    width: calc(var(--width330) * 88px);
    height: calc(var(--width330) * 26px);
    border-radius: calc(var(--width330) * 17px);
    font-size: calc(var(--width330) * 12px);
  }

  .tool-btn-down {
    width: calc(var(--width330) * 88px);
    height: calc(var(--width330) * 26px);
    border-radius: calc(var(--width330) * 17px);
    gap: calc(var(--width330) * 4px);
    font-size: calc(var(--width330) * 12px);
  }

  .tool-btn-down b {
    width: calc(var(--width330) * 13px);
    height: calc(var(--width330) * 13px);
  }

  .tool-res-card {
    gap: calc(var(--width330) * 12px);
    padding: calc(var(--width330) * 12px);
  }

  .tool-res-thumb {
    width: calc(var(--width330) * 101px);
    height: calc(var(--width330) * 101px);
    border-radius: calc(var(--width330) * 6px);
  }

  .tool-res-cover {
    width: calc(var(--width330) * 88px);
    height: calc(var(--width330) * 88px);
    border-radius: calc(var(--width330) * 8px);
    padding: calc(var(--width330) * 8px);
  }

  .tool-res-cover span {
    font-size: calc(var(--width330) * 12px);
  }

  .tool-res-body {
    min-width: 0;
    gap: calc(var(--width330) * 6px);
  }

  .tool-res-card1 .tool-res-cover,
  .tool-res-card1 .tool-res-thumb {
    width: calc(var(--width330) * 162px);
    height: calc(var(--width330) * 101px);
  }

  .tool-res-head {
    gap: calc(var(--width330) * 8px);
  }

  .tool-res-title {
    font-size: calc(var(--width330) * 16px);
    margin: 0;
    min-width: 0;
  }

  .tool-res-date {
    gap: calc(var(--width330) * 4px);
    font-size: calc(var(--width330) * 12px);
  }

  .tool-res-date b {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .tool-res-desc {
    font-size: calc(var(--width330) * 12px);
    margin: 0;
  }

  .tool-res-tags {
    gap: calc(var(--width330) * 6px);
  }

  .tool-res-tag {
    padding: calc(var(--width330) * 1px) calc(var(--width330) * 8px);
    border-radius: calc(var(--width330) * 11px);
    font-size: calc(var(--width330) * 10px);
  }

  .tool-res-btn {
    height: calc(var(--width330) * 26px);
    padding: 0 calc(var(--width330) * 14px);
    border-radius: calc(var(--width330) * 13px);
    font-size: calc(var(--width330) * 12px);
    gap: calc(var(--width330) * 4px);
  }

  .tool-res-btn b {
    width: calc(var(--width330) * 14px);
    height: calc(var(--width330) * 14px);
  }

  .btn-sm {
    padding: calc(var(--width330) * 8px) calc(var(--width330) * 20px);
    font-size: calc(var(--width330) * 13px);
  }

  .detail-tags {
    gap: calc(var(--width330) * 10px);
    margin-bottom: calc(var(--width330) * 20px);
  }

  .tags-label {
    font-size: calc(var(--width330) * 16px);
  }

  .detail-declare {
    padding: calc(var(--width330) * 10px);
    margin-bottom: calc(var(--width330) * 16px);
    border-radius: calc(var(--width330) * 8px);
  }

  .declare-title {
    font-size: calc(var(--width330) * 16px);
    margin: 0 0 calc(var(--width330) * 10px);
  }

  .declared {
    border-radius: calc(var(--width330) * 8px);
    padding: calc(var(--width330) * 16px) calc(var(--width330) * 22px);
  }

  .declare-title::before,
  .declare-title::after {
    width: calc(var(--width330) * 90px);
    height: calc(var(--width330) * 1px);
  }

  .declare-title::before {
    left: calc(var(--width330) * 8px);
  }

  .declare-title::after {
    right: calc(var(--width330) * 8px);
  }

  .detail-declare p {
    font-size: calc(var(--width330) * 14px);
    line-height: calc(var(--width330) * 20px);
    margin: 0 0 calc(var(--width330) * 6px);
  }

  .detail-declare p:last-child {
    margin-bottom: 0;
  }

  .detail-nav {
    gap: calc(var(--width330) * 10px);
    font-size: calc(var(--width330) * 13px);
    margin: 0 0 calc(var(--width330) * 24px);
  }

  .detail-nav a {
    padding: calc(var(--width330) * 8px) calc(var(--width330) * 16px);
    min-height: calc(var(--width330) * 38px);
    box-shadow: 0 0 calc(var(--width330) * 8px) 0 rgba(119,118,118,0.08);
    border-radius: calc(var(--width330) * 8px);
    gap: calc(var(--width330) * 4px);
    font-size: calc(var(--width330) * 12px);
  }

  .author-list {
    gap: calc(var(--width330) * 11px);
  }

  .author-list li {
    min-width: 0;
    gap: calc(var(--width330) * 10px);
  }

  .author-list a {
    min-width: 0;
    padding-left: calc(var(--width330) * 10px);
    font-size: calc(var(--width330) * 16px);
  }

  .author-list a::before {
    left: 0;
    width: calc(var(--width330) * 4px);
    height: calc(var(--width330) * 4px);
  }

  .author-list .author-time {
    gap: calc(var(--width330) * 3px);
    font-size: calc(var(--width330) * 12px);
  }

  .author-list .author-time b {
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .author-articles {
    margin: 0 0 calc(var(--width330) * 26px);
  }

  .detail-products {
    margin: calc(var(--width330) * 8px) 0 0;
  }

  .artdtl .widget-box {
    border-radius: 0;
    padding: calc(var(--width330) * 25px) 0 0 0;
    margin: 0;
  }

  .artdtl .widget-hot-topics .widget-text, .artdtl .widget-courses .widget-text {
    font-size: calc(var(--width330) * 14px);
    min-height: 0;
  }

  .artdtl .widget-downloads .widget-text {
    font-size: calc(var(--width330) * 14px);
  }

  .artdtl .widget-downloads .widget-desc {
    font-size: calc(var(--width330) * 12px);
  }

  .artcons h1::before, .artcons h2::before {
    width: calc(var(--width330) * 3px);
    height: calc(var(--width330) * 14px);
    margin-right: calc(var(--width330) * 8px);
    margin-top: calc(var(--width330) * -2px);
  }

  .artcons .artdp span, .artcons .artptit pspan, .artcons .artptitp span {
    margin: 0 calc(var(--width330) * 8px) 0 0;
    width: calc(var(--width330) * 12px);
    height: calc(var(--width330) * 12px);
  }

  .artcons .artdp p, .artcons .artptit p, .artcons .artptitp p {
    font-size: calc(var(--width330) * 16px);
    margin: calc(var(--width330) * 10px) 0;
  }

  .artcons .hp {
    font-size: calc(var(--width330) * 15px);
    margin: calc(var(--width330) * 10px) 0;
  }

  .artcons table {
    margin: calc(var(--width330) * 12px) 0;
  }

  .artcons table td, .artcons table th {
    padding: calc(var(--width330) * 6px) calc(var(--width330) * 8px);
    font-size: calc(var(--width330) * 13px);
  }

  .artcons pre {
    padding: calc(var(--width330) * 12px);
  }

  .artcons .CodeMirror {
    padding: 0 !important;
  }

  .artcons .CodeMirror-scroll {
    min-height: calc(var(--width330) * 200px);
  }

  .artcons .CodeMirror-fullscreen {
    top: calc(var(--width330) * 50px);
    left: 0;
    right: 0;
    bottom: 0;
  }

  .artcons .copy_btn {
    padding: calc(var(--width330) * 5px) calc(var(--width330) * 10px);
    font-size: calc(var(--width330) * 12px);
    border-radius: calc(var(--width330) * 5px);
    top: calc(var(--width330) * 5px);
    right: calc(var(--width330) * 5px);
    margin-bottom: calc(var(--width330) * -35px);
  }

  .artcons img {
    height: calc(var(--width330) * 506px);
    border-radius: calc(var(--width330) * 8px);
  }

  .detail-content ol{margin-left:calc(var(--width330) * 20px);}
  .artcons h3 {
    font-size: calc(var(--width330) * 20px) !important;
  }

  .artcons h4 {
    font-size: calc(var(--width330) * 18px) !important;
  }

  .artcons h5 {
    font-size: calc(var(--width330) * 16px) !important;
  }

  .artcons h6 {
    font-size: calc(var(--width330) * 14px) !important;
  }

  .artcons p {
    line-height: calc(var(--width330) * 26px);
    font-size: calc(var(--width330) * 16px);
    margin: calc(var(--width330) * 6px) 0;
  }

  .artcons a {
    padding-bottom: calc(var(--width330) * 2px);
  }

  .artcons p>code span {
    font-size: calc(var(--width330) * 12px) !important;
  }

  .artcons pre .language- {
    font-size: calc(var(--width330) * 13px) !important;
  }

  .artcons pre .language- span {
    font-size: calc(var(--width330) * 13px) !important;
  }

  .artcons a,.artcons blockquote,.artcons blockquote span,.artcons table,.artcons table span {
    font-size: calc(var(--width330) * 16px) !important;
  }

  .artcons a span {
    font-size: calc(var(--width330) * 16px) !important;
  }

  .newsArticle .artcons {
    margin-bottom: calc(var(--width330) * 120px);
  }

  .artcons {
    font-size: calc(var(--width330) * 16px);
  }

}

/* ===== END AUTO-GENERATED RESPONSIVE ===== */
/* 标签列表横幅：保留渐变底色，右侧仅展示后台配置的标签图标。 */
.page-list.artlist .topic-banner{
  position:relative;
  flex-direction:row;
  align-items:center;
  background:linear-gradient(118deg,#e6f8fb 0%,#dff3fb 54%,#dce8ff 100%);
}
.page-list.artlist .topic-banner .banner-body{flex:0 1 calc(100% - 138px);max-width:calc(100% - 138px);padding-right:8px}
.page-list.artlist .topic-banner .category-banner-image{
  position:absolute;
  right:18px;
  top:50%;
  width:112px;
  height:96px;
  margin:0;
  object-fit:contain;
  object-position:center;
  transform:translateY(-50%);
  background:transparent;
}
@media (max-width:380px){
  .page-list.artlist .topic-banner .banner-body{flex-basis:calc(100% - 116px);max-width:calc(100% - 116px)}
  .page-list.artlist .topic-banner .category-banner-image{right:12px;width:96px;height:84px}
}

/* 列表目录：去除旧圆点，父分类链接和展开按钮各自拥有独立点击区域。 */
.catalog-layer .catalog-nav > li > .category-parent-row{gap:8px}
.catalog-layer .category-parent-link{align-items:center;gap:8px;min-width:0;flex:1;color:#222}
.catalog-layer .category-parent-link .nav-label{flex:1;min-width:0}
.catalog-layer .catalog-nav .sub-nav a::before{display:none!important;content:none!important}
.catalog-layer .catalog-nav .sub-nav a{padding:7px 6px;text-align:center}
.catalog-layer .catalog-nav .nav-arrow{
  position:relative;
  display:block;
  width:34px!important;
  height:34px!important;
  margin-left:auto;
  padding:0;
  flex:0 0 34px;
  border:0;
  border-radius:50%;
  background:#f4f8f6!important;
}
.catalog-layer .catalog-nav .nav-arrow::after{
  content:"";
  position:absolute;
  left:12px;
  top:10px;
  width:8px;
  height:8px;
  border-right:2px solid #505854;
  border-bottom:2px solid #505854;
  transform:rotate(45deg);
}
.catalog-layer .catalog-nav > li.open .nav-arrow{background:#eaf8f2!important}
.catalog-layer .catalog-nav > li.open .nav-arrow::after{top:14px;transform:rotate(225deg);border-color:#20ad7c}

/* 热门搜索展开按钮：覆盖自动响应式代码对内部图标宽高的重复改写。 */
.hot-keywords .hot-toggle{
  flex:0 0 26px!important;
  width:26px!important;
  height:26px!important;
  padding:0!important;
}
.hot-keywords .hot-toggle b{
  display:block!important;
  width:8px!important;
  height:8px!important;
  box-sizing:border-box!important;
  background:none!important;
  border:0!important;
  border-right:2px solid #25aa7c!important;
  border-bottom:2px solid #25aa7c!important;
  transform:translateY(-2px) rotate(45deg)!important;
  transform-origin:center!important;
}
.hot-keywords.is-open .hot-toggle b{
  transform:translateY(2px) rotate(225deg)!important;
}

/* 搜索结果加载按钮与公共底部保持清晰间距。 */
.search-main .search-load-more{
  margin-bottom:32px;
}

/* 最近更新页：与桌面端保持五类筛选，移动端分页横向展示。 */
.newgx .latest-tabs .m-cat-scroll{gap:8px;padding:0 12px}
.newgx .latest-tabs .m-cat-item{flex:0 0 auto;padding:0 10px;white-space:nowrap}
.newgx .latest-main>.pagination{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  width:100%;
  margin:20px 0 28px!important;
  overflow-x:auto;
  scrollbar-width:none;
}
.newgx .latest-main>.pagination::-webkit-scrollbar{display:none}
.newgx .latest-main>.pagination .page-btn,
.newgx .latest-main>.pagination .page-num{flex:0 0 auto;min-width:28px;height:30px;padding:0 7px}

/* 搜索页的四个推荐词固定显示在一行。 */
.schjg .hot-keywords-list{max-height:none;overflow:visible;flex-wrap:nowrap}

/* 专题封面完整展示；文章标签只保留一行。 */
.topic-detail .topic-header-cover{height:auto;aspect-ratio:16/9;}
.topic-detail .topic-header-img{display:block;width:100%;height:100%;object-fit:contain;}
.topic-detail .paglist-sec .article-info.topic-list-meta{width:100%;justify-content:flex-start;flex-wrap:nowrap;gap:8px;}
.topic-detail .paglist-sec .topic-list-meta>div{flex:0 0 auto;white-space:nowrap;}
.topic-detail .paglist-sec .topic-list-meta .info-name{flex:0 1 auto;min-width:0;}
.topic-detail .paglist-sec .topic-list-meta .author{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.topic-detail .paglist-sec .article-tags{display:flex;flex-wrap:wrap;align-content:flex-start;gap:6px;max-height:26px;overflow:hidden;}
.topic-detail .paglist-sec .article-tags .article-tag{flex:0 0 auto;box-sizing:border-box;height:26px;line-height:26px;padding:0 8px;margin:0;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;}

/* 标签与专题列表：单行标签在前，作者、日期、热度在后。 */
.page-list.artlist .paglist-sec .art-left-down{display:flex;flex-direction:column;align-items:stretch;}
.page-list.artlist .paglist-sec .article-tags,.ztlist .paglist-sec .article-tags{display:flex;flex-wrap:wrap;align-content:flex-start;gap:6px;max-height:26px;overflow:hidden;}
.page-list.artlist .paglist-sec .article-tags .article-tag,.ztlist .paglist-sec .article-tags .article-tag{flex:0 0 auto;box-sizing:border-box;height:26px;line-height:26px;padding:0 8px;margin:0;white-space:nowrap;}
.page-list.artlist .paglist-sec .article-info,.ztlist .paglist-sec .article-info{width:100%;justify-content:flex-start;flex-wrap:nowrap;gap:8px;}
.page-list.artlist .paglist-sec .article-info>div,.ztlist .paglist-sec .article-info>div{flex:0 0 auto;white-space:nowrap;}
.page-list.artlist .paglist-sec .article-info .info-name,.ztlist .paglist-sec .article-info .info-name{flex:0 1 auto;min-width:0;}
.page-list.artlist .paglist-sec .article-info .author,.ztlist .paglist-sec .article-info .author{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.main-feed .article-info{width:100%;justify-content:flex-start;flex-wrap:nowrap;gap:8px;}
.main-feed .article-info>div{flex:0 0 auto;white-space:nowrap;}
.main-feed .article-info .info-name{flex:0 1 auto;min-width:0;}
.main-feed .article-info .author{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.main-feed .article-tags{display:flex;flex-wrap:wrap;align-content:flex-start;gap:6px;max-height:26px;overflow:hidden;}
.main-feed .article-tags .article-tag{flex:0 0 auto;box-sizing:border-box;height:26px;line-height:26px;padding:0 8px;margin:0;white-space:nowrap;}

.page-list.artlist .paglist-sec>.feed-tabs{display:flex;flex-wrap:nowrap;gap:6px;overflow:visible;width:100%;box-sizing:border-box;}
.page-list.artlist .paglist-sec>.feed-tabs>.tab{flex:1 1 0;min-width:0;width:auto;padding:0 3px;box-sizing:border-box;white-space:nowrap;text-align:center;font-size:13px;}

.ztlist .topic-banner{position:relative;background:linear-gradient(110deg,#e9f9f3,#e4f3ff);}
.ztlist .topic-learning-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:26%;max-width:100px;height:auto;aspect-ratio:1;}