/* 初始化
----------------------------------------------- */
body {
 font-family: Microsoft Yahei, \5FAE\8F6F\96C5\9ED1, \5b8b\4f53, Arial, Lucida, Verdana, Helvetica, sans-serif;
 color: #555;
 background-color: #FFF;
}
body, button, input, textarea {
 font-size: 14px;
 line-height: 1.531;
 outline: none;
 margin: 0;
 padding: 0;
 border: 0;
}
a {
 color: #333333;
}
a:hover {
 color: #333333;
 text-decoration: none;
}
p, ul, ol, dl, dt, dd, form, blockquote {
 margin: 0;
 padding: 0;
}
ul, ol {
 list-style: none;
}
h1, h2, h3, h4, h5, h6 {
 font-size: 14px;
 margin: 0;
 padding: 0;
}
input, select {
 font-family: Microsoft Yahei;
 vertical-align: middle;
}
input:-webkit-autofill {
 -webkit-box-shadow: 0 0 0px 1000px #EEEEEE inset !important;
}
em, b, i {
 font-style: normal;
 font-weight: normal;
}
img {
 vertical-align: middle;
 border: 0;
}
label {
 cursor: pointer;
}
/* 主体框架
----------------------------------------------- */
#wrapper .mb {
 margin-bottom: 50px;
}
.seo-summary {
 margin-bottom: 20px;
 padding: 16px 18px;
 border: 1px solid #E5E5E5;
 background-color: #FAFAFA;
 color: #666666;
}
.seo-summary-title {
 margin-bottom: 8px;
 color: #222222;
 font-size: 24px;
 font-weight: bold;
 line-height: 1.4;
}
.seo-summary p {
 line-height: 1.8;
}
#product-category .seo-summary,
#article-category .seo-summary,
#download-category .seo-summary {
 margin-bottom: 28px;
 padding: 22px 24px;
 border: 1px solid #E5E7EB;
 border-left: 4px solid #1979CC;
 background: linear-gradient(135deg, #FAFCFF 0%, #F4F7FB 100%);
 color: #667085;
}
#product-category .seo-summary .seo-summary-title,
#article-category .seo-summary .seo-summary-title,
#download-category .seo-summary .seo-summary-title {
 margin-bottom: 10px;
 color: #111827;
 font-size: 30px;
 line-height: 1.3;
}
#product-category .seo-summary p,
#article-category .seo-summary p,
#download-category .seo-summary p {
 max-width: 920px;
 color: #4B5563;
 font-size: 15px;
 line-height: 1.9;
}
@media (max-width: 768px) {
 #product-category .seo-summary,
 #article-category .seo-summary,
 #download-category .seo-summary {
  margin-bottom: 22px;
  padding: 18px 18px 18px 20px;
 }
 #product-category .seo-summary .seo-summary-title,
 #article-category .seo-summary .seo-summary-title,
 #download-category .seo-summary .seo-summary-title {
  font-size: 24px;
 }
 #product-category .seo-summary p,
 #article-category .seo-summary p,
 #download-category .seo-summary p {
  font-size: 14px;
 }
}
.detail-page {
 padding: 32px 0 20px;
 min-height: 400px;
}
.detail-hero {
 display: flex;
 align-items: flex-start;
 gap: 32px;
}
.detail-media {
 flex: 0 0 320px;
 max-width: 320px;
}
.detail-media-frame {
 padding: 0;
 border: 0;
 border-radius: 0;
 background: none;
 box-shadow: none;
}
.detail-media a,
.detail-media-link {
 display: block;
}
.detail-media img {
 width: 100%;
 max-width: 100%;
 border: 0;
 border-radius: 0;
 background: #FFFFFF;
}
.detail-media-switcher {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(68px, 1fr));
 gap: 8px;
 margin-top: 10px;
}
.detail-media-thumb {
 display: flex;
 align-items: center;
 justify-content: center;
 padding: 0;
 border: 1px solid #E5E5E5;
 border-radius: 0;
 background: #FFFFFF;
 cursor: pointer;
 transition: border-color .2s ease, background-color .2s ease;
}
.detail-media-thumb:hover {
 border-color: #BFC7D1;
 background-color: #FAFAFA;
}
.detail-media-thumb.is-active {
 border-color: #1979CC;
 background-color: #F5FAFF;
}
.detail-media-thumb img {
 width: 100%;
 aspect-ratio: 1 / 1;
 object-fit: contain;
 border: 0;
 border-radius: 0;
}
.detail-summary {
 flex: 1;
 min-width: 0;
}
.detail-header {
 padding-top: 14px;
 padding-bottom: 18px;
 border-bottom: 1px solid #E5E7EB;
}
.detail-title {
 color: #1F2937;
 font-size: 30px;
 line-height: 1.35;
 font-weight: bold;
}
.detail-meta {
 display: flex;
 flex-wrap: wrap;
 gap: 10px 18px;
 margin: 16px 0 0;
 color: #667085;
 font-size: 14px;
 line-height: 1.8;
}
.detail-meta-item,
.detail-meta li {
 display: flex;
 align-items: flex-start;
 gap: 8px;
}
.detail-meta-list {
 display: flex;
 flex-direction: column;
 gap: 12px;
 margin: 18px 0 0;
}
.detail-meta-list li {
 padding-bottom: 12px;
 border-bottom: 1px dashed #E5E7EB;
}
.detail-meta-list li:last-child {
 padding-bottom: 0;
 border-bottom: 0;
}
.detail-label {
 flex: 0 0 auto;
 color: #98A2B3;
 white-space: nowrap;
}
.detail-value {
 color: #344054;
 word-break: break-word;
}
.detail-section {
 margin-top: 32px;
}
.detail-section-title {
 margin: 0 0 18px;
 padding-left: 14px;
 border-left: 4px solid #1979CC;
 color: #111827;
 font-size: 22px;
 line-height: 1.4;
 font-weight: bold;
}
.detail-related-list {
 display: grid;
 gap: 18px;
}
.detail-related-grid-mode {
 grid-template-columns: repeat(3, minmax(0, 1fr));
}
.detail-related-list-mode {
 grid-template-columns: 1fr;
}
.detail-related-item {
 display: flex;
 align-items: flex-start;
 gap: 16px;
 min-width: 0;
 padding: 16px 0;
 border-top: 1px solid #E5E7EB;
 text-decoration: none;
}
.detail-related-item:first-child {
 padding-top: 0;
 border-top: 0;
}
.detail-related-grid-mode .detail-related-item {
 display: block;
 padding: 0;
 border-top: 0;
}
.detail-related-media {
 display: flex;
 align-items: center;
 justify-content: center;
 flex: 0 0 132px;
 width: 132px;
 aspect-ratio: 4 / 3;
 overflow: hidden;
 background: #F8FAFC;
 border: 1px solid #E5E7EB;
 border-radius: 10px;
}
.detail-related-grid-mode .detail-related-media {
 width: 100%;
 margin-bottom: 12px;
}
.detail-related-media img {
 width: 100%;
 height: 100%;
 object-fit: contain;
}
.detail-related-body {
 display: flex;
 flex-direction: column;
 gap: 8px;
 min-width: 0;
}
.detail-related-name {
 color: #111827;
 font-size: 16px;
 line-height: 1.6;
 font-weight: 600;
 word-break: break-word;
}
.detail-related-desc {
 color: #667085;
 font-size: 14px;
 line-height: 1.7;
}
.detail-related-item:hover .detail-related-name {
 color: #1979CC;
}
.detail-content {
 color: #333333;
 line-height: 1.85;
}
.detail-content h1,
.detail-content h2,
.detail-content h3,
.detail-content h4,
.detail-content h5,
.detail-content h6 {
 margin: 1.4em 0 .7em;
 color: #111827;
 font-weight: 700;
 line-height: 1.35;
}
.detail-content h1 {
 font-size: 32px;
}
.detail-content h2 {
 font-size: 26px;
 padding-bottom: 10px;
 border-bottom: 1px solid #e5e7eb;
}
.detail-content h3 {
 font-size: 22px;
}
.detail-content h4 {
 font-size: 18px;
}
.detail-content h5,
.detail-content h6 {
 font-size: 16px;
}
.detail-content img {
 max-width: 100%;
 height: auto !important;
}
.detail-content p {
 margin-bottom: 16px;
 line-height: 1.85;
}
.detail-content ul,
.detail-content ol {
 margin: 1em 0 1.2em;
 padding-left: 1.6em;
}
.detail-content ul {
 list-style: disc;
}
.detail-content ol {
 list-style: decimal;
}
.detail-content li {
 margin-bottom: .5em;
}
.detail-content hr {
 height: 0;
 margin: 1.6em 0;
 border: 0;
 border-top: 1px solid #d0d5dd;
}
.detail-content strong,
.detail-content b {
 font-weight: 700;
}
.detail-content em,
.detail-content i {
 font-style: italic;
}
.detail-content a {
 color: #1979cc;
 text-decoration: underline;
 word-break: break-word;
}
.detail-content p:empty {
 display: none;
}
.detail-content blockquote {
 margin: 1.2em 0;
 padding: 14px 18px;
 border-left: 4px solid #1979CC;
 background: #f5f8fc;
 color: #334155;
}
.detail-content pre,
.detail-content .md-code {
 margin: 1.2em 0;
 padding: 14px 16px;
 overflow-x: auto;
 border-radius: 12px;
 background: #101828;
 color: #e5edf7;
 line-height: 1.7;
 box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
}
.detail-content code {
 padding: 2px 6px;
 border-radius: 6px;
 background: #f2f4f7;
 color: #b42318;
 font-size: 0.95em;
}
.detail-content pre code,
.detail-content .md-code code {
 padding: 0;
 background: transparent;
 color: inherit;
}
.detail-content .md-table-wrap {
 margin: 1.2em 0;
 overflow-x: auto;
 border: 1px solid #d0d5dd;
 border-radius: 12px;
 background: #fff;
 box-shadow: 0 8px 24px rgba(15,23,42,.06);
}
.detail-content .md-table {
 width: 100%;
 min-width: 520px;
 border-collapse: collapse;
}
.detail-content .md-table th,
.detail-content .md-table td {
 padding: 10px 12px;
 border: 1px solid #d0d5dd;
 text-align: left;
 vertical-align: top;
}
.detail-content .md-table th {
 background: #f8fafc;
 color: #111827;
 white-space: nowrap;
}
.detail-content .md-table tbody tr:nth-child(even) {
 background: #f9fbfd;
}
.detail-content .md-callout {
 margin: 1.2em 0;
 padding: 14px 16px;
 border-radius: 10px;
 border: 1px solid #d0d5dd;
 background: #f8fafc;
}
.detail-content .md-callout-note,
.detail-content .md-callout-info {
 border-color: #bcd7f5;
 background: #eef6ff;
}
.detail-content .md-callout-tip {
 border-color: #b7e4c7;
 background: #edfdf3;
}
.detail-content .md-callout-warning,
.detail-content .md-callout-danger {
 border-color: #f7c9a8;
 background: #fff7ed;
}
.detail-faq {
 margin-top: 32px;
}
.detail-faq-list {
 display: grid;
 gap: 14px;
}
.detail-faq-item {
 padding: 16px 18px;
 border: 1px solid #e5e7eb;
 border-radius: 8px;
 background: #fafafa;
}
.detail-faq-question {
 margin: 0 0 8px;
 color: #111827;
 font-size: 18px;
 line-height: 1.5;
}
.detail-faq-answer {
 color: #4b5563;
 line-height: 1.8;
}
.detail-source {
 margin-top: 28px;
}
.detail-source-list {
 padding: 16px 18px;
 border: 1px solid #e5e7eb;
 border-radius: 8px;
 background: #f8fafc;
}
.detail-source-list div {
 margin-bottom: 10px;
 line-height: 1.8;
 word-break: break-all;
}
.detail-source-list div:last-child {
 margin-bottom: 0;
}
@media (max-width: 768px) {
 .detail-page {
  padding: 24px 0 20px;
 }
 .detail-header {
  padding-top: 10px;
 }
 .detail-hero {
  display: block;
 }
 .detail-media {
  max-width: none;
  margin-bottom: 20px;
 }
 .detail-media-switcher {
  grid-template-columns: repeat(4, minmax(0, 1fr));
 }
 .detail-title {
  font-size: 24px;
 }
 .detail-section-title {
  font-size: 20px;
 }
 .detail-related-grid-mode {
  grid-template-columns: repeat(2, minmax(0, 1fr));
 }
 .detail-related-media {
  flex-basis: 116px;
  width: 116px;
 }
}

@media (max-width: 575.98px) {
 .detail-related-grid-mode {
  grid-template-columns: 1fr;
 }
 .detail-media-switcher {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
 }
 .detail-related-item {
  gap: 12px;
 }
 .detail-related-media {
  flex-basis: 92px;
  width: 92px;
 }
 .detail-related-name {
  font-size: 15px;
 }
 .detail-related-desc {
  font-size: 13px;
 }
}
/* 头部导航
----------------------------------------------- */
/* -- top -- */
#header .top {
 background-color: #EEEEEE;
 height: 30px;
 border-bottom: 1px solid #DDDDDD;
 text-align: right;
}
/* top-nav */
#header .top .top-nav {
 float: left;
 position: relative;
 z-index: 1000;
 height: 30px;
 margin-left: -7px;
}
#header .top .top-nav li {
 border: 1px solid #EEEEEE;
 border-bottom: 0;
 float: left;
 zoom: 1;
 text-align: center;
}
#header .top .top-nav li.spacer {
 overflow: hidden;
 margin: 11px 5px 0;
 width: 1px;
 height: 10px;
 background-color: #BBB;
}
#header .top .top-nav li a {
 padding: 0 7px;
 height: 28px;
 line-height: 28px;
 color: #333;
}
#header .top .top-nav li.hover {
 position: relative;
 background: #FFFFFF;
 border: 1px solid #DDDDDD;
 border-bottom: 0;
}
#header .top .top-nav li.hover s {
 border-left: 1px solid #FFF;
}
#header .top .top-nav ul {
 background: #FFFFFF;
 border: 1px solid #DDDDDD;
 border-top: 0;
 width: 100%;
 display: none;
 position: absolute;
 top: 100%;
 left: -1px;
 padding-bottom: 4px;
}
#header .top .top-nav ul li {
 float: none;
}
#header .top .top-nav li.hover ul li {
 border: none;
}
#header .top .top-nav li.hover ul li a {
 height: 25px;
 line-height: 25px;
}
/* search */
#header .top .search {
 float: right;
 _width: 205px;
}
#header .top .search .search-box {
 border: 1px solid #545454;
 background-color: #545454;
 height: 28px;
 padding-left: 10px;
 box-sizing: content-box;
}
#header .top .search .search-box .keyword {
 background-color: #545454;
 color: #CCCCCC;
}
#header .top .search .search-box .btnSearch {
 background-color: #545454;
}
/* -- navbar -- */
#header .navbar {
	z-index: 1000;
 border-bottom: 1px solid #DDD;
 background-color: #FFF;
}
#header .navbar.fix {
	position: fixed;
 top: 0;
 right: 0;
 left: 0;
 z-index: 1030;
}
@media (min-width:768px) {
 #header .navbar {
  padding: 0;
 }
}
#header .navbar .logo {
 display: block;
 height: 55px;
}
#header .navbar .logo img {
 height: 100%;
}
#header .navbar .menu {
 background-color: transparent;
}
#header .navbar .fa {
 font-size: 30px;
 padding: 0 10px;
 color: #777;
}
/* -- main-nav -- */
#header .main-nav .dropdown-menu {
 padding: 0;
 margin: 0;
 min-width: 100%;
 font-size: 14px;
 color: #212529;
 text-align: left;
 list-style: none;
 background-color: #fff;
 background-clip: padding-box;
 border: 0;
 border-radius: 0;
}
@media (min-width:768px) {
 /* LEVEL ONE */
 #header .main-nav .nav-item .nav-link {
  display: block;
  padding: 0 20px;
  height: 30px;
  line-height: 30px;
  font-size: 14px;
  text-align: center;
  color: #000;
  text-decoration: none;
 }
 #header .main-nav .nav-item .nav-link::after {
  display: none;
 }
 #header .main-nav .nav-item:hover .nav-link, #header .main-nav .active .nav-link {
  background-color: #1979CC;
  color: #FFF;
 }
 /* LEVEL TWO */
 #header .main-nav .dropdown:hover>.dropdown-menu {
  display: block;
 }
 #header .main-nav .dropdown-menu .dropdown-item {
  background: #E0E0E0;
  padding: 0 20px;
  height: 30px;
  line-height: 30px;
  font-size: 14px;
 }
 #header .main-nav .dropdown-menu .dropdown-item:hover {
  background: #1979CC;
  color: #FFF;
 }
 /* LEVEL THREE */
 #header .main-nav .dropdown-menu .dropdown-menu {
  left: 100%;
  top: 0;
  min-width: 98px;
  _width: 98px;
 }
 #header .main-nav .dropdown-submenu:hover>.dropdown-menu {
  display: block;
 }
 #header .main-nav .dropdown-menu .dropdown-toggle::after {
  position: absolute;
  right: 10px;
  top: 13px;
  vertical-align: 0;
  border-right: 0;
  border-top: .2em solid transparent;
  border-left: .3em solid;
  border-bottom: .2em solid transparent;
 }
}
@media (max-width:768px) {
 #header .main-nav .dropdown-toggle::after {
  position: absolute;
  right: 10px;
  top: 23px;
 }
 #header .main-nav .dropdown-menu {
  padding-left: 15px;
 }
 #header .main-nav .dropdown-menu .dropdown-item {
  position: relative;
 }
 #header .main-nav .dropdown-item,  #header .main-nav .nav-link {
  border-bottom: 1px solid #EEE;
  padding: 0.8rem 0;
  background-color: transparent;
 }
 #header .main-nav .dropdown-menu .dropdown-item:active {
  color: #555;
  background-color: #FFF;
 }
}
/* 首页样式
----------------------------------------------- */
/* -- slideShow -- */
.slide-show .swiper-slide a {
 display: block;
 background-color: #DDDDDD;
 height: 400px;
 background-repeat: no-repeat;
 background-position: center center;
 background-size: auto 100%;
}
.slide-show .swiper-pagination-bullet {
 width: 12px;
 height: 12px;
}
.slide-show .swiper-pagination-bullet-active {
 background-color: #1979CC;
}
.slide-show .swiper-button-prev {
 left: 50px;
}
.slide-show .swiper-button-next {
 right: 50px;
}
.slide-show .swiper-button-prev, .slide-show .swiper-button-next {
 display: none;
 color: #FFF;
}
.slide-show:hover .swiper-button-prev, .slide-show:hover .swiper-button-next {
 display: block;
}
@media (max-width:768px) {
 .slide-show .swiper-slide a {
  height: 200px;
 }
}
/* -- index-box -- */
#index .index-box {
  padding: 60px 0;  /* 增加内边距 */
  overflow: hidden;
}

@media (max-width: 768px) {
  #index .index-box {
    padding: 40px 0;  /* 移动端稍微增加内边距 */
  }
}

#index .index-box.bg {
  background-color: #F8F9FA;  /* 稍微调亮背景色 */
}

#index .index-box h3 {
  text-align: center;
  margin-bottom: 40px;  /* 增加标题下方间距 */
}

#index .index-box h3 b {
  color: #222;  /* 加深文字颜色 */
  font-size: 36px;  /* 增大字号 */
  font-weight: 700;  /* 加粗 */
}

#index .index-box h3 em {
  display: block;
  margin-top: 10px;
  text-transform: uppercase;
  color: #777;  /* 稍微加深颜色 */
  font-size: 14px;  /* 指定字号 */
}

#index .index-box .more {
  text-align: center;
  margin-top: 30px;  /* 增加上方间距 */
}

#index .index-box .more a {
  display: inline-block;
  padding: 10px 30px;  /* 增加按钮内边距 */
  border: 1px solid #1979CC;
  color: #1979CC;
  border-radius: 20px;  /* 增加圆角 */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;  /* 过渡效果应用到所有属性 */
  font-weight: 600;  /* 加粗文字 */
}

#index .index-box .more a:hover {
  background-color: #1979CC;
  color: #FFF;
  transform: translateY(-2px);  /* 悬停时微微上浮 */
  box-shadow: 0 6px 12px rgba(25, 121, 204, 0.2);  /* 增强阴影效果 */
}
/* -- index-box about -- */
#index .about .img {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

#index .about .img:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

#index .about .img img {
    width: 100%;
    display: block;
}

#index .about p.about-slogan {
    color: #333;
    font-size: 32px;
    margin-bottom: 15px;
    position: relative;
    padding-bottom: 10px;
}

#index .about p.about-slogan:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50px;
    height: 2px;
    background-color: #1979CC;
}

#index .about .desc {
    color: #666666;
    margin: 20px 0;
    line-height: 1.8;
    max-width: 800px;
}

#index .about .more {
    text-align: left;
    margin-top: 25px;
}

#index .about .more a {
    display: inline-block;
    padding: 10px 20px;
    background-color: #1979CC;
    color: #fff;
    border-radius: 5px;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

#index .about .more a:hover {
    background-color: #1565A9;
}

@media (max-width: 768px) {
    #index .about .img {
        margin-bottom: 25px;
    }
    
    #index .about p.about-slogan {
        font-size: 28px;
        text-align: center;
    }
    
    #index .about p.about-slogan:after {
        left: 50%;
        transform: translateX(-50%);
    }
    
    #index .about .desc {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }
    
    #index .about .more {
        text-align: center;
    }
}
/* -- recProduct -- */
#index .product-list {
 margin-bottom: 25px;
}
#index .product-list .col-md-3, #index .product-list .col-6 {
 padding-left: 9px;
 padding-right: 9px;
}
#index .product-list .item {
 margin-bottom: 15px;
 text-align: center;
}
#index .product-list .item .img {
 border: 1px solid #EEE;
 border-radius: 10px;
 overflow: hidden;
}
#index .product-list .item .img img {
 width: 100%;
 transition: transform 0.3s ease;
}
#index .product-list .item .img:hover img {
 transform: scale(1.05);
}
#index .product-list .item .name {
    margin-top: 12px;
    font-size: 16px;
}

#index .product-list .item .name a {
    display: inline-block;
    text-decoration: none;
    background: linear-gradient(90deg, #333333, #666666);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    transition: all 0.3s ease;
}

#index .product-list .item .name a:hover,
#index .product-list .item .name a:focus {
    background: linear-gradient(90deg, #1979CC, #44C4EE);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
#index .product-list .item .price {
 margin-top: 5px;
}
.product-list .img:hover img {
  transform: scale(1.1);
  transition: all 0.3s ease;
}
/* -- article-list -- */
#index .article-list {
 margin-bottom: 20px;
}
#index .article-list .img {
 text-align: center;
 margin-bottom: 20px;
 overflow: hidden;
}
#index .article-list .img img {
 width: 100%;
}
@media (min-width: 1100px) {
 #index .article-list .img img {
  width: 278px;
  height: 278px;
 }
}
#index .article-list .img em {
 display: block;
 background-color: #EEE;
 line-height: 278px;
 color: #999;
}
#index .article-list .item {
 zoom:1;
 overflow:hidden;
 margin-bottom:20px;
}
#index .article-list .item dt {
 float:left;
 width:80px;
 font-family: Arial, Lucida, Verdana, Helvetica, sans-serif;
 text-align:center;
}
#index .article-list .item dt em {
 display:block;
 background-color:#EEE;
 font-size:36px;
 padding-bottom:3px;
 color:#464646;
}
#index .article-list .item dt b {
 display:block;
 background-color:#1979cc;
 font-size:15px;
 color:#fcfcfc;
}
#index .article-list .item dd {
	margin-left: 100px;
 font-size:14px;
}
#index .article-list .item dd a {
 color:#000;
 font-size: 16px;
}
#index .article-list .item dd p {
 color:#9A9A9A;
 line-height:180%;
}
/* -- link -- */
#index .link {
 padding: 10px 0;
}
#index .link strong {
 color: #7A7F81;
 font-weight: bold;
}
#index .link a {
 color: #555;
}
/* page
----------------------------------------------- */
#page {
 padding: 0;
 min-height: 0;
}
#page .info {
 padding: 2px 0 20px 0;
 color: #999999;
 font-size: 13px;
}
#page .content {
 color: #333333;
 line-height: 1.85;
 padding-top: 0;
}
#page .content p {
 margin-bottom: 16px;
 line-height: 1.85;
}
#page .content p:empty {
 display: none;
}
#page .content img {
 max-width: 100%;
 height: auto !important;
}
/* product_category
----------------------------------------------- */
#product-category .product-list {
 margin-top: 20px;
 margin-bottom: 25px;
}
#product-category .product-list .item {
 margin-bottom: 15px;
 text-align: center;
}
#product-category .product-list .item .img {
 border: 1px solid #EEE;
 border-radius: 10px;
 overflow: hidden;
}
#product-category .product-list .item .img img {
 width: 100%;
 transition: transform 0.3s ease;
}
#product-category .product-list .item .img:hover img {
 transform: scale(1.05);
}
#product-category .product-list .item .name {
 margin-top: 12px;
 font-size: 16px;
}
#product-category .product-list .item .price {
 margin-top: 5px;
}
/* product
----------------------------------------------- */
#product {
 padding: 0;
}
#product .product-img {
 float: none;
 width: auto;
}
#product .product-info {
 margin-left: 0;
 padding-top: 0;
 color: #333333;
 line-height: inherit;
}
#product .product-info ul {
 padding-top: 0;
 margin-bottom: 0;
}
#product .product-info .product-price {
 margin-bottom: 5px;
}
#product .product-info .product-price .price {
 font-family: Arial;
 font-size: 20px;
 font-weight: bold;
}
#product .product-info .btn-ask a {
 display: inline-block;
 padding: 5px 25px;
 background-color: #1979CC;
 color: #FFF;
}
#product .product-info .btn-ask a .fa {
 margin-right: 5px;
}
#product .product-info .btn-buy {
 margin-top: 24px;
 margin-bottom: 0;
}
#product .product-info .btn-buy form {
 display: flex;
 flex-direction: column;
 gap: 12px;
}
#product .product-info .btn-buy .detail-buy-actions {
 display: flex;
 flex-wrap: wrap;
 gap: 12px;
}
#product .product-info .btn-buy .add-to-cart {
 background: #1979CC url(images/btn_addtocart.png) no-repeat 20px 50%;
 color: #FFFFFF;
 padding: 8px 25px 8px 50px;
 text-decoration: none;
 cursor: pointer;
 font-size: 16px;
 border: 0;
 line-height: 1.4;
}
#product .product-info .btn-buy .add-to-cart:hover {
 background-color: #44C4EE;
}
#product .product-info .btn-buy .add-to-cart-secondary {
 background-color: #0F5E9C;
}
#product .product-info .btn-buy .detail-cart-link {
 color: #1979CC;
 text-decoration: underline;
}
#product .product-content {
 padding: 0;
}
#product .product-content .rich-content {
 padding: 0;
 color: #333333;
 line-height: 1.85;
}
#product .product-content .rich-content img {
 max-width: 100%;
 height: auto !important;
}
/* article_category
----------------------------------------------- */
#article-list dl {
 border-bottom: 1px dotted #D1D1D1;
 padding: 20px 0;
 zoom: 1;
 overflow: hidden;
}
#article-list dl.last {
 border-bottom: 0;
}
#article-list dt {
 width: 620px;
 margin-bottom: 10px;
 font-size: 14px;
}
#article-list dd {
 color: #999999;
 line-height: 180%;
 zoom: 1;
 overflow: hidden;
}
#article-list dd p {
 float: left;
}
#article-list dd p.img {
 margin-right: 10px;
}
#article-list dd p.desc {
 width: 590px;
}
#article-list .num-date {
 float: right;
 text-align: right;
 padding-top: 12px;
}
#article-list .num-date em {
 background-color: #0072C6;
 color: #FFF;
 padding: 3px 4px;
 font-size: 14px;
 font-weight: bold;
}
#article-list .num-date p {
 font-size: 16px;
 color: #999999;
 margin-top: 5px;
}
/* article
----------------------------------------------- */
#article {
 padding: 0;
 min-height: 0;
}
#article .info {
 padding: 0;
 color: inherit;
 font-size: inherit;
}
#article .content {
 color: #333333;
 line-height: 1.6;
 font-size: 16px;
 padding: 0;
 overflow: hidden;
}
#article .detail-section {
 margin-top: 24px;
}

/* 文章内容样式强化 */
#article .content h1, 
#article .content h2, 
#article .content h3, 
#article .content h4, 
#article .content h5, 
#article .content h6 {
 margin: 25px 0 15px;
 color: #333;
 font-weight: bold;
 line-height: 1.4;
}

#article .content h1 { font-size: 28px; }
#article .content h2 { font-size: 24px; border-bottom: 1px solid #eee; padding-bottom: 10px; }
#article .content h3 { font-size: 20px; }
#article .content h4 { font-size: 18px; }
#article .content h5 { font-size: 16px; }
#article .content h6 { font-size: 16px; color: #777; }

#article .content p {
 margin-bottom: 16px;
 line-height: 1.6;
}

#article .content p:empty {
 margin: 0;
}

#article .content img {
 max-width: 100%;
 height: auto;
 display: block;
 margin: 20px auto;
 border-radius: 4px;
}

/* 表格样式 */
#article .content table {
 width: 100%;
 border-collapse: collapse;
 border-spacing: 0;
 margin: 20px 0;
 overflow: auto;
}

#article .content table th,
#article .content table td {
 padding: 10px 15px;
 border: 1px solid #ddd;
 text-align: left;
}

#article .content table th {
 background-color: #f7f7f7;
 font-weight: bold;
}

#article .content table tr:nth-child(even) {
 background-color: #fcfcfc;
}

#article .content table tr:hover {
 background-color: #f5f5f5;
}

/* 文本样式 */
#article .content strong,
#article .content b {
 font-weight: bold;
}

#article .content em,
#article .content i {
 font-style: italic;
}

#article .content u {
 text-decoration: underline;
}

#article .content del,
#article .content s {
 text-decoration: line-through;
}

/* 列表样式 */
#article .content ul,
#article .content ol {
 padding-left: 2em;
 margin: 16px 0;
}

#article .content ul {
 list-style: disc;
}

#article .content ol {
 list-style: decimal;
}

#article .content li {
 margin-bottom: 8px;
}

/* 引用样式 */
#article .content blockquote {
 padding: 10px 15px;
 margin: 20px 0;
 border-left: 4px solid #ddd;
 background: #f9f9f9;
 color: #777;
}

/* 代码样式 */
#article .content pre,
#article .content code {
 font-family: Consolas, Monaco, 'Andale Mono', monospace;
 background-color: #f6f8fa;
 border-radius: 3px;
 padding: 2px 4px;
}

#article .content pre {
 padding: 16px;
 overflow: auto;
 line-height: 1.45;
 margin: 16px 0;
}

/* 水平线样式 */
#article .content hr {
 height: 1px;
 border: 0;
 background-color: #ddd;
 margin: 24px 0;
}

/* 链接样式 */
#article .content a {
 color: #1979CC;
 text-decoration: none;
}

#article .content a:hover {
 text-decoration: underline;
}

/* 特殊样式处理 */
#article .content span[style*="text-wrap-mode: wrap"] {
 color: #999;
 font-size: 14px;
 font-style: italic;
}

/* 图片下方的说明文字样式 */
#article .content img + em {
 display: block;
 text-align: center;
 font-size: 14px;
 color: #777;
 margin-top: -10px;
 margin-bottom: 20px;
}

/* 现代 Markdown 文章内容覆写旧文章页样式 */
#article .detail-content pre,
#article .detail-content .md-code {
 margin: 1.2em 0;
 padding: 16px 18px;
 overflow-x: auto;
 border-radius: 12px;
 background: #101828;
 color: #e5edf7;
 line-height: 1.75;
 box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
}
#article .detail-content code {
 padding: 2px 6px;
 border-radius: 6px;
 background: #f2f4f7;
 color: #b42318;
 font-size: 0.95em;
}
#article .detail-content pre code,
#article .detail-content .md-code code {
 padding: 0;
 border-radius: 0;
 background: transparent;
 color: inherit;
}
#article .detail-content .md-table-wrap {
 margin: 1.3em 0;
 overflow-x: auto;
 border: 1px solid #d0d5dd;
 border-radius: 12px;
 background: #fff;
 box-shadow: 0 8px 24px rgba(15,23,42,.06);
}
#article .detail-content .md-table {
 width: 100%;
 min-width: 560px;
 border-collapse: collapse;
}
#article .detail-content .md-table th,
#article .detail-content .md-table td {
 padding: 12px 14px;
 border: 1px solid #d0d5dd;
 text-align: left;
 vertical-align: top;
}
#article .detail-content .md-table th {
 background: #f8fafc;
 color: #111827;
 white-space: nowrap;
}
#article .detail-content .md-table tbody tr:nth-child(even) td {
 background: #f9fbfd;
}

/* 提示信息
----------------------------------------------- */
#dou-msg {
 padding: 10px 0 100px 0;
}
#dou-msg dl {
 padding: 160px 0 200px 0;
 text-align: center;
}
#dou-msg dt {
 color: #0072C6;
 font-size: 16px;
 margin-bottom: 30px;
 font-weight: bold;
}
#dou-msg dd {
 color: #666;
}
#dou-msg dd a {
 margin-left: 5px;
 color: #000;
}
/* 全局样式
----------------------------------------------- */
/* -- ur-here -- */
.ur-here {
 padding: 25px 0 10px 0;
 line-height: 20px;
 color: #999999;
 font-weight: bold;
 font-size: 14px;
 border-bottom: 1px solid #DDD;
}
@media (max-width:768px) {
 .ur-here {
  display: none;
 }
}
.ur-here a {
 color: #999999;
}
.ur-here b {
 margin: 0 8px;
}
/* -- tree -- */
.tree-box {
 margin-bottom: 15px;
}
.tree-box h3 {
 padding: 25px 0 10px 0;
 line-height: 20px;
 color: #999999;
 font-weight: bold;
 font-size: 14px;
 border-bottom: 1px solid #DDD;
 margin-bottom: 15px;
}
@media (max-width:768px) {
 .tree-box h3 {
  display: none;
 }
}
.tree-box li {
 padding: 8px 8px;
}
.tree-box li a {
 color: #000;
 font-size: 14px;
}
.tree-box li.cur {
 background-color: #1979CC;
}
.tree-box li.cur a {
 color: #FFF;
}
@media (max-width:768px) {
 .tree-box {
  margin-top: 10px;
 }
 .tree-box ul {
  display: inline-block;
 }
 .tree-box li {
  display: inline-block;
  padding: 0;
  margin-right: 5px;
  margin-top: 5px;
 }
 .tree-box li i {
  display: none;
 }
 .tree-box li a {
  display: block;
  border: 1px solid #EEE;
  padding: 5px 8px;
 }
 .tree-box ul ul li a {
  color: #888;
 }
}
.tree-box .search {
 display: block;
 margin: 20px 0;
}
@media (max-width: 768px) {
 .tree-box .search {
  margin: 12px 0;
 }
}
.tree-box .search .keyword {
 width: 85px;
}
/* -- screen -- */
.screen {
 padding-top: 20px;
 border-bottom: 1px dotted #DDD;
}
.screen dl {
 margin-bottom: 10px;
}
.screen dl dt {
 display: inline-block;
 font-weight: bold;
}
.screen dl dd {
 display: inline-block;
}
.screen dl dd a {
 display: inline-block;
 background-color: #DDD;
 color: #555;
 padding: 2px 10px;
 margin-right: 8px;
}
@media (max-width: 768px) {
 .screen dl dt {
  display: block;
 }
 .screen dl dd {
  display: block;
 }
 .screen dl dd a {
  margin-top: 8px;
 }
}
.screen dl dd a.cur {
 background-color: #1979CC;
 color: #FFF;
}
/* -- search-box -- */
.search-box {
 border: 1px solid #DDDDDD;
 background-color: #FFF;
 height: 28px;
 padding-left: 10px;
 position: relative;
}
.search-box .keyword {
 color: #CCCCCC;
}
.search-box .btnSearch {
 position: absolute;
 right: 0;
 top: 0;
 background: url(images/icon_search.png) no-repeat 50% 50%;
 width: 28px;
 height: 28px;
 text-indent: -999px;
 overflow: hidden;
 cursor: pointer;
}
/* -- scale -- */
.scale {  
 overflow: hidden;
}
.scale img {  
 width: 100%;
 cursor: pointer;  
 transition: all 0.6s;  
}
.scale img:hover {  
 transform: scale(1.1);  
}
/* -- common -- */
.cue {
 color: red;
 font-size: 14px;
}
.clear {
 clear: both;
 height: 0;
 line-height: 0;
 font-size: 0;
}
.captcha {
 text-transform: uppercase;
}

.price {
 color: #CC0000;
}
.none {
 display: none;
}
.pointer {
 cursor: pointer;
}
/* -- form -- */
.btn {
 display: inline-block;
 background-color: #0072C6;
 color: #EEE;
 padding: 6px 25px;
 text-transform: capitalize;
 cursor: pointer;
 font-weight: bold;
 text-align: center;
 -webkit-appearance: none;
 font-size: 14px;
 line-height: 1.5;
 border-radius: 0;
 border: 0;
}
.btn:hover {
 text-decoration: none;
 color: #FFFFFF;
 background-color: #007AD5;
}
.btn-gray {
 display: inline-block;
 background-color: #CCC;
 border: 0;
 color: #333;
 padding: 6px 15px;
 text-transform: capitalize;
 cursor: pointer;
 font-weight: bold;
 -webkit-appearance: none;
}
.btn-payment {
 display: inline-block;
 background-color: #ff4246;
 color: #FFF;
 padding: 7px 28px;
 text-transform: capitalize;
 cursor: pointer;
 font-weight: bold;
 font-size: 14px;
 text-align: center;
 -webkit-appearance: none;
}
.btn-captcha {
 display: inline-block;
 background-color: #1979CC;
 -moz-border-radius: 2px;
 -webkit-border-radius: 2px;
 border: 0;
 color: #FFF;
 padding: 7px 22px;
 text-transform: capitalize;
 cursor: pointer;
 font-size: 13px;
}
.btn-captcha[disabled], .btn-captcha:disabled, .btn-captcha.disabled {
 color: #FFF;
 background-color: #b2b2b2;
 opacity: 1;
}
/* -- color -- */
.cRed {
 color: #F40;
}
.cOra {
 color: #f30;
}
.cGre {
 color: #0c6;
}
.cBlu {
 color: #69c;
}
.cGra {
 color: #999;
}
/* -- input -- */
.text-input {
 height: 34px;
 padding: 6px;
 font-size: 14px;
 border: 1px solid #E9E9E9;
 background-color: #FFF;
 color: #666;
 -webkit-appearance: none;
}
.text-input[disabled], .text-input:disabled, .text-input.disabled {
	color: #999;
}
.text-area {
 padding: 4px;
 border: 1px solid #E9E9E9;
 background-color: #FFF;
 line-height: 20px;
 -webkit-appearance: none;
}
.text-area-auto {
 border: 1px solid #E9E9E9;
 background-color: #FFF;
 padding: 0;
 font-size: 12px;
 line-height: 20px;
 resize: none;
 min-height: 40px;
 -webkit-appearance: none;
}
@media (max-width: 768px) {
 .btn, .btn-gray, .btn-payment, .btn-captcha, .text-input, .text-area, .text-area-auto, .inp-main {
  max-width: 100%;
 }
}
/*- input-file -*/
.input-file {
 width: 80px;
}
.input-file .input-file-show {
 height: 80px;
 line-height: 80px;
 text-align: center;
 color: #555;
 background-color: #F5F5F5;
}
.input-file .input-file-show img {
 width: 100%;
 height: 80px;
}
.input-file .input-file-btn {
 width: 100%;
 background-color: #EEE;
 color: #999;
 line-height: 25px;
 cursor: pointer;
 text-align: center;
 -webkit-appearance: none;
}
/*- table-basic -*/
.table-basic {
 color: #666666;
 border-left: 1px solid #EEE;
 border-top: 1px solid #EEE;
 border-collapse: collapse;
}
.table-basic select {
 color: #8F8F8F;
}
.table-basic td, .table-basic th {
 border-right: 1px solid #EEE;
 border-bottom: 1px solid #EEE;
}
.table-basic th {
 background-color: #EEE;
}
.table-basic .child {
 background-color: #FFFFFF;
}
.table-basic td label {
 margin-right: 15px;
}
.table-basic td i {
 color: #F00;
 margin-left: 5px;
 font-weight: bold;
}
/*- form-basic -*/
.form-basic dl {
 zoom:1;
 overflow:hidden;
 margin-bottom:20px;
}
.form-basic dl dt {
 font-weight: bold;
 margin-bottom: 5px;
 font-size: 13px;
}
.form-basic dl dt i {
 color:#F00;
 margin-left:5px;
 font-weight:bold;
}
.form-basic dl dd label {
 margin-right: 15px;
 line-height:34px;
}
/*- table-div -*/
.table-div {
 zoom:1;
 overflow:hidden;
}
.table-div dl {
 zoom:1;
 overflow:hidden;
 margin-bottom:20px;
}
.table-div dl dt {
 font-weight: bold;
 margin-bottom: 5px;
 font-size: 13px;
}
.table-div dl dt i {
 color:#F00;
 margin-left:5px;
 font-weight:bold;
}
.table-div dl dd label {
 margin-right: 15px;
 line-height:34px;
}
@media (max-width:768px) {
 .table-div dl dt {
  float: none;
 }
}
/* -- lift -- */
.lift {
 margin-top: 60px;
 color: #999;
 font-size: 14px;
}
.lift a {
 color: #999;
}
.lift span {
 margin-right: 15px;
}
/* -- pager -- */
.pager {
 text-align: right;
 padding-top: 20px;
 color: #666;
 font-size: 14px;
}
.pager a {
 color: #666;
 text-decoration: underline;
}
/* -- pager class two -- */
.pager ul {
 display: inline-block;
 *display: inline;
 border-left: 1px solid #dddddd;
}
.pager ul li {
 display: inline;
}
.pager ul li a {
 float: left;
 padding: 0 14px;
 line-height: 38px;
 text-decoration: none;
 background-color: #ffffff;
 border: 1px solid #dddddd;
 border-left-width: 0;
}
.pager ul li a:hover {
 background-color: #f5f5f5;
}
.pager ul .active a {
 background-color: #f5f5f5;
 color: #999999;
 cursor: default;
}
/* -- online-service -- */
#online-service {
 position: fixed;
 _position: absolute;
 _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight)-380+"px");
 top: 208px;
 right: 0;
 z-index: 999999;
 display: block;
}
#online-service .onlineIcon {
 position: relative;
 cursor: pointer;
 background: url(images/online_service.png) no-repeat;
 width: 34px;
 height: 110px;
 text-indent: -9999px;
 overflow: hidden;
}
#online-service #pop {
 border: 3px solid #1979CC;
 background-color: #F2F2F2;
 padding: 8px;
 width: 95px;
 min-height: 84px;
 position: absolute;
 right: 34px;
 top: 0;
 display: none;
 z-index: 999999;
}
#online-service .online-qq a {
 display: block;
 background: url(images/online_service.png) no-repeat left -160px;
 color: #1979CC;
 width: 82px;
 height: 24px;
 line-height: 23px;
 padding-left: 27px;
 margin-bottom: 8px;
}
#online-service .online-qq a:hover {
 text-decoration: none;
 color: #1979CC;
}
#online-service .service {
 border-top: 1px solid #DDDDDD;
 padding-top: 8px;
 color: #666;
}
#online-service .service a {
 color: #666;
}
#online-service .service li {
 background: url(images/online_service.png) no-repeat left -202px;
 padding-left: 8px;
}
#online-service .goTop {
 display: none;
}
#online-service .goTop .goBtn {
 background: #F2F2F2 url(images/online_service.png) no-repeat left -120px;
 width: 34px;
 height: 34px;
 display: block;
}
/* footer
----------------------------------------------- */
#footer {
 background-color: #F5F5F5;
 padding: 40px 0;
}
@media (max-width:768px) {
 #footer {
  padding: 20px 0;
 }
 #footer .foot-nav {
  margin-bottom: 15px;
  border-bottom: 1px solid #DDD;
 }
}
#footer .foot-nav .nav-parent {
 margin-bottom: 10px;
}
#footer .foot-nav .nav-parent a {
 font-size: 20px;
 display: block;
}
#footer .foot-nav .nav-child a {
 display: block;
 color: #999;
 margin-bottom: 5px;
}
@media (max-width:768px) {
 #footer .foot-nav .nav-parent a {
  font-size: 16px;
 }
 #footer .foot-nav .nav-child a {
  display: inline-block;
  margin-bottom: 10px;
  margin-right: 15px;
 }
}
/* -- contact -- */
#footer .weixin {
 text-align: center;
 margin-bottom: 15px;
}
#footer .weixin img {
 width: 120px;
 height: 120px;
}
#footer .weixin p {
 margin-top: 4px;
 color: #999;
}
/* -- contact -- */
#footer .contact {
 text-align: center;
}
#footer .contact .tel {
 color: #1979CC;
 font-size: 20px;
 margin-bottom: 10px;
}
#footer .contact .online-service {
 margin-bottom: 10px;
}
#footer .contact .online-service a {
 display: inline-block;
 color: #1979CC;
 padding: 5px 20px;
 border: 1px solid #1979CC;
}
#footer .contact .online-service a i {
 margin-right: 5px;
}
#footer .contact .email {
 color: #999;
}
#footer .copy-right {
 border-top: 1px solid #EEE;
 margin-top: 20px;
 padding-top: 20px;
}
#footer .net-safe-record {
 margin-left: 10px;
}
#footer .net-safe-record img {
 vertical-align: bottom;
}
@media (max-width:768px) {
 #footer .copy-right {
  text-align: center;
 }
}

#footer .footer-service-link {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 3px 10px;
 margin-left: 14px;
 border: 1px solid #D8E3EE;
 border-radius: 999px;
 background: #FFFFFF;
 color: #0D6FB8;
 font-size: inherit;
 font-weight: 500;
 line-height: 1.15;
 vertical-align: middle;
 transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
#footer .footer-service-link:hover {
 border-color: #0D6FB8;
 background: #F5FAFF;
 box-shadow: 0 6px 12px rgba(13, 111, 184, 0.08);
 transform: translateY(-1px);
}
#footer .footer-service-link-inline {
 display: inline-flex;
 margin-top: 0;
}
.detail-support-rail {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 18px;
 margin-top: 22px;
 padding: 16px 18px;
 border: 1px solid #E3EAF2;
 border-left: 4px solid #0D6FB8;
 background: linear-gradient(135deg, #FBFDFF 0%, #F4F9FE 100%);
}
.detail-support-copy {
 min-width: 0;
}
.detail-support-copy strong {
 display: block;
 margin-bottom: 4px;
 color: #0F172A;
 font-size: 16px;
 line-height: 1.4;
}
.detail-support-copy span {
 display: block;
 color: #64748B;
 line-height: 1.7;
}
.detail-support-action {
 flex: 0 0 auto;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-width: 108px;
 padding: 10px 18px;
 border-radius: 999px;
 background: linear-gradient(135deg, #0D6FB8 0%, #1E9FE6 100%);
 color: #FFFFFF;
 font-weight: 600;
 box-shadow: 0 14px 28px rgba(13, 111, 184, 0.18);
 transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.detail-support-action:hover {
 color: #FFFFFF;
 transform: translateY(-1px);
 box-shadow: 0 16px 30px rgba(13, 111, 184, 0.24);
}
.js-woto-support-entry.is-support-loading {
 opacity: .72;
 pointer-events: none;
}
.support-float {
 position: fixed;
 right: 18px;
 bottom: 104px;
 z-index: 99989;
 overflow: visible;
 opacity: 1;
 visibility: visible;
 transform: translateY(0);
 transition: opacity .24s ease, transform .24s ease, visibility .24s ease;
}
.support-float.is-hidden {
 opacity: 0;
 visibility: hidden;
 transform: translateY(16px) scale(.96);
}
.support-float .support-float-action {
 display: inline-flex;
 align-items: center;
 gap: 12px;
 min-width: 156px;
 padding: 12px 18px 12px 14px;
 border-radius: 999px;
 background: linear-gradient(135deg, #0F3C74 0%, #0D6FB8 55%, #1E9FE6 100%);
 color: #FFFFFF;
 box-shadow: 0 16px 30px rgba(13, 111, 184, 0.26);
 transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.support-float .support-float-action:hover {
 color: #FFFFFF;
 transform: translateY(-2px);
 box-shadow: 0 20px 36px rgba(13, 111, 184, 0.32);
 filter: saturate(1.03);
}
.support-float .support-float-icon {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 38px;
 height: 38px;
 border-radius: 50%;
 background: rgba(255, 255, 255, 0.15);
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
 animation: support-float-breathe 2.8s ease-in-out infinite;
}
.support-float .support-float-icon svg {
 width: 20px;
 height: 20px;
 fill: currentColor;
 display: block;
}
.support-float .support-float-copy {
 display: flex;
 flex-direction: column;
 min-width: 0;
}
.support-float .support-float-copy strong {
 font-size: 14px;
 font-weight: 700;
 letter-spacing: .02em;
 line-height: 1.2;
}
.support-float .support-float-copy span {
 margin-top: 3px;
 font-size: 12px;
 line-height: 1.3;
 color: rgba(255, 255, 255, 0.84);
 white-space: nowrap;
}
.support-float .support-float-dismiss {
 position: absolute;
 z-index: 3;
 top: -7px;
 right: -2px;
 width: 24px;
 height: 24px;
 border-radius: 50%;
 background: rgba(17, 24, 39, 0.82);
 color: #FFFFFF;
 font-size: 15px;
 line-height: 24px;
 text-align: center;
 box-shadow: 0 8px 18px rgba(17, 24, 39, 0.18);
 cursor: pointer;
 transition: transform .2s ease, background .2s ease;
}
.support-float .support-float-dismiss:hover {
 background: rgba(17, 24, 39, 0.96);
 transform: scale(1.08);
}
@keyframes support-float-breathe {
 0%,
 100% {
  transform: translateY(0) scale(1);
 }
 50% {
  transform: translateY(-1px) scale(1.04);
 }
}
@media (max-width:768px) {
 .detail-support-rail {
  flex-direction: column;
  align-items: flex-start;
 }
 .detail-support-action {
  width: 100%;
 }
 .support-float {
  right: 12px;
  bottom: calc(82px + env(safe-area-inset-bottom, 0px));
 }
 .support-float .support-float-action {
  min-width: 58px;
  width: 58px;
  height: 58px;
  padding: 0;
  justify-content: center;
 }
 .support-float .support-float-copy {
  display: none;
 }
 .support-float .support-float-icon {
  width: 58px;
  height: 58px;
  background: transparent;
  box-shadow: none;
 }
 .support-float .support-float-icon svg {
  width: 22px;
  height: 22px;
 }
 .support-float .support-float-dismiss {
  top: -8px;
  right: -4px;
 }
 #footer .footer-service-link,
 #footer .footer-service-link-inline {
  margin-left: 10px;
  margin-top: 8px;
 }
}

.back-to-top {
 position: fixed;
 right: 18px;
 bottom: 22px;
 z-index: 99990;
 overflow: visible;
 opacity: 0;
 visibility: hidden;
 transform: translateY(18px) scale(0.96);
 transition: opacity .28s ease, transform .28s ease, visibility .28s ease;
}
.back-to-top.is-visible {
 opacity: 1;
 visibility: visible;
 transform: translateY(0) scale(1);
}
.back-to-top.is-dismissed {
 opacity: 0;
 visibility: hidden;
 transform: translateY(18px) scale(0.96);
}
.back-to-top .back-to-top-action {
 position: relative;
 z-index: 1;
 display: inline-flex;
 align-items: center;
 gap: 10px;
 min-width: 132px;
 padding: 12px 18px 12px 14px;
 border: 0;
 border-radius: 999px;
 background: linear-gradient(135deg, #0d6fb8 0%, #1e9fe6 100%);
 color: #FFF;
 box-shadow: 0 14px 28px rgba(13, 111, 184, 0.28);
 cursor: pointer;
 -webkit-appearance: none;
 appearance: none;
 touch-action: manipulation;
 transition: transform .22s ease, box-shadow .22s ease, background .22s ease;
}
.back-to-top .back-to-top-action:hover {
 background: linear-gradient(135deg, #0b629f 0%, #198bc7 100%);
 transform: translateY(-2px);
 box-shadow: 0 18px 32px rgba(13, 111, 184, 0.32);
}
.back-to-top .back-to-top-action:active {
 transform: translateY(0) scale(0.98);
}
.back-to-top .back-to-top-action:focus,
.back-to-top .back-to-top-dismiss:focus {
 outline: 2px solid rgba(13, 111, 184, 0.35);
 outline-offset: 2px;
}
.back-to-top .back-to-top-icon {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 32px;
 height: 32px;
 border-radius: 50%;
 background: rgba(255, 255, 255, 0.18);
 animation: back-to-top-float 2.6s ease-in-out infinite;
}
.back-to-top .back-to-top-icon svg {
 width: 18px;
 height: 18px;
 fill: currentColor;
 display: block;
}
.back-to-top .back-to-top-text {
 font-size: 14px;
 font-weight: 600;
 letter-spacing: .02em;
}
.back-to-top .back-to-top-dismiss {
 position: absolute;
 z-index: 3;
 top: -7px;
 right: -2px;
 width: 24px;
 height: 24px;
 padding: 0;
 border: 0;
 border-radius: 50%;
 background: rgba(17, 24, 39, 0.82);
 color: #FFF;
 font-size: 15px;
 line-height: 24px;
 text-align: center;
 box-shadow: 0 8px 18px rgba(17, 24, 39, 0.18);
 cursor: pointer;
 -webkit-appearance: none;
 appearance: none;
 touch-action: manipulation;
 transition: transform .2s ease, background .2s ease;
}
.back-to-top .back-to-top-dismiss:hover {
 background: rgba(17, 24, 39, 0.96);
 transform: scale(1.08);
}
@keyframes back-to-top-float {
 0%,
 100% {
  transform: translateY(0);
 }
 50% {
  transform: translateY(-2px);
 }
}
@media (max-width:768px) {
 .back-to-top {
  right: 12px;
  bottom: calc(14px + env(safe-area-inset-bottom, 0px));
 }
 .back-to-top .back-to-top-action,
 .back-to-top.is-compact .back-to-top-action {
  min-width: 54px;
  width: 54px;
  height: 54px;
  padding: 0;
  justify-content: center;
  border-radius: 50%;
 }
 .back-to-top .back-to-top-text,
 .back-to-top.is-compact .back-to-top-text {
  display: none;
 }
 .back-to-top .back-to-top-icon,
 .back-to-top.is-compact .back-to-top-icon {
  width: 54px;
  height: 54px;
  background: transparent;
 }
 .back-to-top .back-to-top-icon svg,
 .back-to-top.is-compact .back-to-top-icon svg {
  width: 20px;
  height: 20px;
 }
 .back-to-top .back-to-top-dismiss {
  top: -8px;
  right: -4px;
 }
}

.back-to-top.is-compact .back-to-top-action {
 min-width: 54px;
 width: 54px;
 height: 54px;
 padding: 0;
 justify-content: center;
 border-radius: 50%;
}
.back-to-top.is-compact .back-to-top-text {
 display: none;
}
.back-to-top.is-compact .back-to-top-icon {
 width: 54px;
 height: 54px;
 background: transparent;
}
.back-to-top.is-compact .back-to-top-icon svg {
 width: 20px;
 height: 20px;
}

/* 强制浏览器重新加载样式 - 添加版本号 */
html {
  /* v1.0.4 */
}

.order-page {
 padding: 36px 0 56px;
}
.order-grid {
 display: grid;
 grid-template-columns: minmax(0, 2fr) minmax(280px, 0.9fr);
 gap: 24px;
 align-items: start;
}
.order-panel {
 background: #FFFFFF;
 border: 1px solid #E3E9F0;
 border-radius: 18px;
 box-shadow: 0 18px 50px rgba(18, 50, 87, 0.08);
 padding: 24px;
}
.order-panel-head {
 display: flex;
 justify-content: space-between;
 align-items: center;
 margin-bottom: 18px;
}
.order-panel-head h1 {
 margin: 0;
 font-size: 30px;
}
.order-count {
 min-width: 42px;
 height: 42px;
 border-radius: 999px;
 background: #EEF5FB;
 color: #1979CC;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-weight: 700;
}
.order-table {
 width: 100%;
 border-collapse: collapse;
}
.order-table th,
.order-table td {
 padding: 14px 12px;
 border-bottom: 1px solid #E9EEF4;
 vertical-align: middle;
}
.order-table th {
 color: #5E6C7A;
 font-weight: 600;
}
.order-item-cell {
 min-width: 220px;
}
.order-item-link {
 display: flex;
 align-items: center;
 gap: 14px;
 color: #24384E;
 text-decoration: none;
}
.order-item-media {
 width: 72px;
 height: 72px;
 border-radius: 12px;
 overflow: hidden;
 background: #F7FAFD;
 flex-shrink: 0;
}
.order-item-media img {
 width: 100%;
 height: 100%;
 object-fit: cover;
}
.order-item-name {
 font-weight: 600;
 line-height: 1.5;
}
.order-qty-input {
 width: 84px;
 padding: 8px 10px;
 border: 1px solid #C9D4E0;
 border-radius: 10px;
}
.order-qty-input.is-syncing {
 opacity: .72;
}
[data-order-item-row].is-syncing {
 opacity: .68;
}
.order-actions {
 display: flex;
 flex-wrap: wrap;
 gap: 12px;
 margin-top: 22px;
 align-items: center;
}
.order-actions-center {
 justify-content: center;
}
.order-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-height: 46px;
 padding: 0 18px;
 border-radius: 12px;
 border: 1px solid transparent;
 text-decoration: none;
 cursor: pointer;
 font-size: 15px;
 font-weight: 600;
}
.order-btn-primary {
 background: #1979CC;
 color: #FFFFFF;
}
.order-btn-light {
 background: #F5F8FB;
 border-color: #D6E0EA;
 color: #22374D;
}
.order-summary-row {
 display: flex;
 justify-content: space-between;
 align-items: center;
 padding: 10px 0;
 border-bottom: 1px solid #E9EEF4;
}
.order-summary-row-total {
 font-size: 20px;
 font-weight: 700;
 border-bottom: 0;
}
.order-note {
 margin: 18px 0 0;
 color: #62707C;
 line-height: 1.8;
}
.order-empty {
 min-height: 240px;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 gap: 16px;
 color: #5A6876;
}
.order-link-danger {
 color: #C74B4B;
}
.order-cart-status {
 flex: 1 1 220px;
 color: #62707C;
 line-height: 1.7;
}
.order-cart-status.is-loading {
 color: #4F6F8C;
}
.order-cart-status.is-success {
 color: #1C7A43;
}
.order-cart-status.is-error {
 color: #C74B4B;
}
.order-form-grid {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 16px;
}
.order-form-grid label {
 display: flex;
 flex-direction: column;
 gap: 8px;
 color: #33475B;
 font-weight: 600;
}
.order-form-grid input,
.order-form-grid textarea,
.order-form-grid select {
 width: 100%;
 border: 1px solid #C8D4DF;
 border-radius: 12px;
 padding: 12px 14px;
 font-size: 15px;
 color: #24384E;
 background: #FFFFFF;
}
.order-form-full {
 grid-column: 1 / -1;
}
.order-required {
 display: inline-block;
 margin-left: 4px;
 color: #C74B4B;
 font-style: normal;
}
.order-form-cue {
 margin-bottom: 18px;
 padding: 14px 16px;
 border-radius: 14px;
 background: #F5F9FD;
 border: 1px solid #D9E7F3;
 color: #29445F;
 line-height: 1.8;
}
.order-form-cue strong {
 display: block;
 margin-bottom: 4px;
 font-size: 16px;
}
.order-address-prefill {
 display: flex;
 flex-direction: column;
 gap: 10px;
 padding: 14px 0 0;
 border-top: 1px solid #E4EBF2;
 color: #29445F;
}
.order-address-prefill-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
}
.order-address-prefill-head strong {
 font-size: 15px;
 color: #22374D;
}
.order-address-prefill-message {
 margin: 0;
 color: #62707C;
 font-size: 13px;
 font-weight: 400;
 line-height: 1.8;
}
.order-address-prefill-trigger {
 min-height: 36px;
 padding: 0 14px;
 border-radius: 999px;
 font-size: 13px;
}
.order-address-prefill-results {
 display: flex;
 flex-direction: column;
 gap: 0;
 width: 100%;
 border-top: 1px solid #E9EEF4;
}
.order-address-prefill-item {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 12px 0;
 border-bottom: 1px solid #E9EEF4;
 background: transparent;
}
.order-address-prefill-item:last-child {
 border-bottom: 0;
}
.order-address-prefill-item-copy {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 gap: 8px;
 min-width: 0;
}
.order-address-prefill-summary {
 font-size: 14px;
 color: #24384E;
 line-height: 1.7;
 word-break: break-word;
}
.order-address-prefill-meta {
 color: #6E7D8B;
 font-size: 12px;
 line-height: 1.4;
}
.order-address-prefill-use {
 flex-shrink: 0;
 min-height: 34px;
 padding: 0 12px;
 border-radius: 999px;
 font-size: 13px;
}
.order-address-prefill.is-loading {
 opacity: 0.8;
}
.order-address-prefill .order-btn[disabled] {
 opacity: 0.7;
 cursor: wait;
}
.order-overseas-note {
 padding: 14px 16px;
 border-radius: 14px;
 border: 1px solid #F2D4A8;
 background: #FFF8EE;
 color: #7A5320;
 line-height: 1.8;
}
.order-overseas-note strong {
 display: block;
 margin-bottom: 4px;
 font-size: 15px;
 color: #6A471B;
}
.order-overseas-note p {
 margin: 0;
 font-size: 13px;
 font-weight: 400;
}
.order-form-cue p,
.order-field-hint {
 margin: 0;
}
.order-field-hint {
 color: #62707C;
 font-size: 13px;
 font-weight: 400;
 line-height: 1.8;
}
.order-address-grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 16px;
}
.order-payment-box {
 margin-top: 24px;
 padding-top: 20px;
 border-top: 1px solid #E9EEF4;
}
.order-payment-box h2 {
 margin: 0 0 14px;
 font-size: 20px;
}
.order-payment-option {
 display: flex;
 gap: 12px;
 align-items: flex-start;
 padding: 14px 0;
 border-bottom: 1px solid #EEF2F6;
 cursor: pointer;
}
.order-payment-body {
 display: flex;
 flex-direction: column;
 gap: 6px;
}
.order-payment-body em {
 color: #62707C;
 font-style: normal;
 font-size: 14px;
}
.order-alert {
 margin-bottom: 16px;
 padding: 12px 14px;
 border-radius: 12px;
 background: #FFF4F2;
 color: #B24A3E;
}
.order-service-notice {
 margin-bottom: 16px;
 padding: 12px 14px;
 border-radius: 12px;
 background: #F1F8F4;
 color: #1F6B44;
}
.order-side-list {
 list-style: none;
 padding: 0;
 margin: 0 0 18px;
}
.order-side-list li {
 display: flex;
 justify-content: space-between;
 gap: 12px;
 align-items: flex-start;
 padding: 10px 0;
 border-bottom: 1px solid #E9EEF4;
}
.order-side-item-main {
 flex: 1 1 auto;
 min-width: 0;
 display: flex;
 flex-direction: column;
 gap: 6px;
}
.order-side-item-total {
 color: #62707C;
 font-size: 13px;
 line-height: 1.6;
}
.order-side-item-actions {
 flex-shrink: 0;
 display: flex;
 align-items: center;
}
.order-side-qty-input {
 width: 64px;
 min-height: 36px;
 padding: 6px 8px;
 text-align: center;
}
.order-side-cart-status {
 display: block;
 margin: 14px 0 6px;
 font-size: 13px;
}
.order-side-link {
 color: #24384E;
 text-decoration: none;
 font-weight: 600;
 line-height: 1.6;
 flex: 1 1 auto;
 min-width: 0;
 padding-right: 12px;
}
.order-side-link:hover {
 color: #1979CC;
 text-decoration: underline;
}
.order-success-card {
 max-width: 980px;
 margin: 0 auto;
 background: #FFFFFF;
 border: 1px solid #E3E9F0;
 border-radius: 20px;
 box-shadow: 0 18px 50px rgba(18, 50, 87, 0.08);
 padding: 30px;
}
.order-success-card h1 {
 margin: 0 0 12px;
 font-size: 34px;
}
.order-service-card {
 max-width: 1080px;
}
.order-success-lead {
 color: #5D6C79;
 font-size: 16px;
 line-height: 1.8;
 margin-bottom: 18px;
}
.order-success-sn {
 font-size: 18px;
 margin-bottom: 12px;
}
.order-success-meta {
 display: flex;
 flex-wrap: wrap;
 gap: 18px;
 color: #435769;
 margin-bottom: 22px;
}
.order-progress-box {
 margin-bottom: 24px;
 padding: 20px;
 border-radius: 18px;
 border: 1px solid #DCE8F2;
 background: linear-gradient(180deg, #F8FBFE 0%, #FFFFFF 100%);
}
.order-progress-head {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 gap: 12px;
 margin-bottom: 16px;
 color: #2A4259;
}
.order-progress-head h2 {
 margin: 0;
 font-size: 20px;
}
.order-progress-grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 14px;
}
.order-progress-step {
 padding: 16px;
 border-radius: 14px;
 border: 1px solid #DDE7F0;
 background: #FFFFFF;
 color: #6C7B88;
 min-height: 92px;
}
.order-progress-step strong,
.order-progress-step span {
 display: block;
}
.order-progress-step strong {
 margin-bottom: 8px;
 color: #38506A;
 font-size: 15px;
}
.order-progress-step span {
 line-height: 1.7;
 font-size: 13px;
}
.order-progress-step.is-done {
 border-color: #C7E4D2;
 background: #F3FBF6;
}
.order-progress-step.is-done strong,
.order-progress-step.is-done span {
 color: #246A3E;
}
.order-progress-step.is-current {
 border-color: #8CBDE8;
 background: #EDF6FE;
 box-shadow: inset 0 0 0 1px rgba(25, 121, 204, 0.08);
}
.order-progress-step.is-current strong,
.order-progress-step.is-current span {
 color: #1C5B96;
}
.order-instruction-box {
 background: #F6FAFD;
 border: 1px solid #DCE8F2;
 border-radius: 16px;
 padding: 18px;
 margin-bottom: 24px;
}
.order-instruction-box h2 {
 margin: 0 0 10px;
 font-size: 20px;
}
.order-instruction-text {
 color: #435769;
 line-height: 1.8;
}
.order-instruction-text p {
 margin: 0 0 8px;
}
.order-instruction-text p:last-child {
 margin-bottom: 0;
}
.order-service-form {
 margin-bottom: 24px;
}
.order-service-meta {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 14px;
 margin: 0 0 24px;
}
.order-service-meta div {
 display: flex;
 flex-direction: column;
 gap: 6px;
 padding: 14px 16px;
 border: 1px solid #DDE7F0;
 border-radius: 14px;
 background: #F8FBFD;
 color: #435769;
}
.order-service-meta strong {
 font-size: 14px;
 color: #24384E;
}
.order-table-link {
 color: #1979CC;
 text-decoration: none;
 font-weight: 600;
}
.order-table-link:hover {
 text-decoration: underline;
}
.order-btn-inline {
 width: auto;
}
.order-pay-box {
 padding: 10px 0 4px;
 text-align: center;
}
.order-pay-qr-wrap {
 display: flex;
 justify-content: center;
 margin: 6px 0 18px;
}
.order-pay-qr {
 width: 264px;
 min-height: 264px;
 padding: 12px;
 background: #fff;
 border: 1px solid #d8e4ee;
 border-radius: 18px;
 box-shadow: 0 18px 40px rgba(18, 50, 87, 0.08);
 display: flex;
 align-items: center;
 justify-content: center;
}
.order-pay-qr canvas,
.order-pay-qr img {
 max-width: 100%;
 height: auto;
}
.order-pay-lead {
 margin: 0 0 8px;
 font-size: 18px;
 font-weight: 600;
 color: #22374d;
}
.order-pay-link-row {
 display: flex;
 flex-wrap: wrap;
 gap: 12px;
 justify-content: center;
 margin-top: 16px;
}
.order-pay-status {
 margin: 18px 0 0;
 color: #4f6f8c;
 line-height: 1.8;
}
.order-pay-status.is-success {
 color: #1c7a43;
}
.order-pay-status.is-error {
 color: #c74b4b;
}

@media (max-width: 900px) {
 .order-grid {
  grid-template-columns: 1fr;
 }
 .order-form-grid {
  grid-template-columns: 1fr;
 }
 .order-address-grid {
  grid-template-columns: 1fr;
 }
 .order-address-prefill {
  gap: 12px;
 }
 .order-address-prefill-head {
  flex-direction: column;
  align-items: flex-start;
 }
 .order-address-prefill-item {
  flex-direction: column;
  align-items: flex-start;
 }
 .order-side-list li {
  flex-direction: column;
 }
 .order-side-item-actions {
  width: 100%;
 }
}

@media (max-width: 640px) {
 .order-page {
  padding: 24px 0 42px;
 }
 .order-panel,
 .order-success-card {
  padding: 18px;
  border-radius: 16px;
 }
 .order-service-meta {
  grid-template-columns: 1fr;
 }
 .order-progress-grid {
  grid-template-columns: 1fr;
 }
 .order-panel-head h1,
 .order-success-card h1 {
  font-size: 26px;
 }
 .order-table,
 .order-table thead,
 .order-table tbody,
 .order-table tr,
 .order-table th,
 .order-table td {
  display: block;
  width: 100%;
 }
 .order-table thead {
  display: none;
 }
 .order-table tr {
  padding: 12px 0;
  border-bottom: 1px solid #E9EEF4;
 }
 .order-table td {
  padding: 6px 0;
  border-bottom: 0;
 }
 .order-item-cell {
  min-width: 0;
 }
 .order-actions {
  flex-direction: column;
  align-items: stretch;
 }
 .order-cart-status {
  order: -1;
  flex: 1 1 auto;
 }
 .order-btn {
  width: 100%;
 }
 .order-pay-qr {
  width: 100%;
  min-height: 240px;
 }
 .order-pay-link-row {
  flex-direction: column;
 }
 .detail-buy-actions {
  flex-direction: column;
 }
 .detail-buy-actions .add-to-cart {
  width: 100%;
 }
}