/* reset */
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
button,
textarea,
p,
blockquote,
th,
td {
  padding: 0;
  margin: 0;
}

img {
  border: 0;
  vertical-align: middle;
}

ol,
ul {
  list-style: none;
}

a {
  color: #333;
  text-decoration: none;
}

/* 基础布局 - 活动页最小宽度 1200px */
html,
body {
  font:
    14px/1.5 "Microsoft YaHei",
    "PingFang SC",
    Arial,
    "Helvetica Neue",
    Helvetica,
    sans-serif;
  color: #333;
  background: #fff;
  min-width: 1200px;
  padding-bottom: 100px;
  box-sizing: border-box;
}

/* 版心容器 - 1200px 居中，作为内容区域标准宽度 */
.container {
  width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
}

/* 顶部站点栏（左 logo / 右旗下产品，不含登录注册） */
.site-top-header {
  position: relative;
  z-index: 260;
  width: 100%;
  min-width: 1200px;
  height: 52px;
  background: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  box-sizing: border-box;
}

.site-top-header-inner {
  width: 100%;
  min-width: 1200px;
  height: 100%;
  margin: 0;
  padding: 0 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
}

.site-top-logo {
  display: inline-flex;
  align-items: center;
  color: #666;
  font-size: 14px;
  line-height: 1;
}

.site-top-logo-icon {
  width: 56px;
  height: auto;
}

.site-top-logo-sep {
  margin: 0 10px;
  color: #999;
}

.site-top-logo-text {
  color: #666;
}

.site-top-right {
  display: inline-flex;
  align-items: center;
}

.site-top-products {
  position: relative;
}

.site-top-products::after {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 12px;
}

.site-top-products-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 2px;
  color: #333;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

.site-top-products-caret {
  width: 6px;
  height: 6px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}

.site-top-products:hover .site-top-products-caret {
  transform: rotate(225deg) translate(-1px, -1px);
}

.site-top-products-panel {
  position: absolute;
  top: 38px;
  right: 0;
  min-width: 360px;
  padding: 22px 28px;
  border: 1px solid #e7edf5;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 42px;
  align-items: flex-start;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(6px);
  transition:
    opacity 0.2s ease,
    transform 0.2s ease,
    visibility 0s linear 0.2s;
  z-index: 261;
  box-sizing: border-box;
}

.site-top-products:hover .site-top-products-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition-delay: 0s;
}

.site-top-products:focus-within .site-top-products-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition-delay: 0s;
}

.site-top-products-triangle {
  position: absolute;
  top: -6px;
  right: 36px;
  width: 10px;
  height: 10px;
  background: #fff;
  border-left: 1px solid #e7edf5;
  border-top: 1px solid #e7edf5;
  transform: rotate(45deg);
}

.site-top-products-group + .site-top-products-group {
  margin-top: 0;
}

.site-top-products-subtitle {
  color: #666;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  padding-bottom: 6px;
  text-align: left;
  width: 100%;
}

.site-top-products-links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.site-top-products-links a {
  color: #666;
  display: block;
  font-size: 14px;
  line-height: 34px;
  margin-right: 30px;
  text-align: left;
}

.site-top-products-links a:hover {
  color: #005bc4;
}

/* 导航栏 - 背景图长度不够时，居中显示，两侧裁剪，吸顶展示 */
.nav {
  position: sticky;
  top: 0;
  z-index: 200;
  overflow: visible;
  width: 100%;
  min-width: 1200px;
  height: 93px;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 4px 4px 0 rgba(55, 94, 138, 0.09);
  box-sizing: border-box;
}

.nav-container {
  width: 100%;
  min-width: 1200px;
  height: 100%;
  padding: 0 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
}

/* 左侧 Logo */
.nav-logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.nav-logo a {
  display: flex;
  align-items: center;
  gap: 12px;
}

.nav-logo-img {
  height: 64px;
  width: auto;
  display: block;
  flex-shrink: 0;
  margin-right: 6px;
}

.nav-logo-title {
  width: 355px;
  display: block;
  flex-shrink: 0;
}

/* 右侧导航项容器 */
.nav-items-container {
  display: flex;
  align-items: center;
  margin-left: auto;
}

.nav-item-wrapper {
  position: relative;
}

.nav-item {
  display: inline-flex;
  align-items: center;
  padding: 4px 26px;
  font-size: 18px;
  line-height: 42px;
  font-weight: 400;
  color: #042e5e;
  white-space: nowrap;
  cursor: pointer;
}

.nav-item:hover,
.nav-item.selected {
  color: #042e5e;
  font-weight: 600;
  position: relative;
}

.nav-item:hover::after,
.nav-item.selected::after {
  content: "";
  position: absolute;
  bottom: -22px;
  left: 26px;
  right: 26px;
  height: 4px;
  background: #042e5e;
}

/* 下拉菜单 */
.nav-dropdown {
  position: absolute;
  top: 76px;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 0;
  padding: 0;
  min-width: 120px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.2s;
  z-index: 9999;
}

.nav-dropdown.active-show,
.nav-item-wrapper.active .nav-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* 联盟章程：左侧固定「章程下载」（仅路由为 #section-charter 时显示，由 JS 切换 .is-hidden） */
.charter-download-float {
  position: fixed;
  left: 0;
  top: 50%;
  z-index: 150;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px 0 20px;
  margin: 0;
  border: none;
  border-radius: 0 8px 8px 0;
  background: #004595;
  box-shadow: 0 4px 20px 0 rgba(47, 88, 135, 0.2);
  font-size: 18px;
  font-weight: 600;
  line-height: 36px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  box-sizing: border-box;
  transition:
    color 0.2s ease,
    box-shadow 0.2s ease;
}

.charter-download-float:hover {
  background-color: #042e5e;
  color: #fff;
  box-shadow: 0 4px 20px 0 rgba(47, 88, 135, 0.2);
}

.charter-download-float.is-hidden {
  display: none;
}

.nav-dropdown-items {
  display: flex;
  flex-direction: column;
}

.nav-dropdown-item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 10px;
  cursor: pointer;
  background-color: #042e5e;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  transition: background 0.2s;
}

.nav-dropdown-item:last-child {
  border-bottom: none;
}

.nav-dropdown-item-text {
  color: #fff;
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
  text-align: center;
}

.nav-dropdown-item:hover,
.nav-dropdown-item.selected {
  background: #0263d3;
}

.nav-dropdown-item:hover .nav-dropdown-item-text {
  color: #fff;
}

/* 右侧工具栏：收藏本页 + 联系我们 */
.nav-tools {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
  margin-left: 40px;
}

.nav-tool-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 18px;
  line-height: 18px;
  color: #a5a5a5;
  font-weight: 400;
  padding: 10px 16px;
  border-radius: 8px;
}

.nav-tool-btn:hover {
  color: #8b8b8b;
  background-color: #ededed;
}

.nav-tool-icon {
  width: 24px;
  height: 24px;
  display: block;
  object-fit: contain;
  flex-shrink: 0;
}

.nav-tool-text {
  line-height: 24px;
  vertical-align: middle;
}

.nav-tool-wrap {
  position: relative;
}

.nav-tool-wrap--apply-join {
  display: none;
}

.nav-tools--members-query .nav-tool-wrap--collect,
.nav-tools--members-query .nav-tool-wrap--contact {
  display: none;
}

.nav-tools--members-query .nav-tool-wrap--apply-join {
  display: block;
}

.nav-tool-btn--apply-join {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  border-radius: 8px;
  background: #004595;
  color: #fff;
  font-size: 18px;
  font-weight: 400;
  line-height: 42px;
}

.nav-tool-btn--apply-join:hover {
  background: #042e5e;
  color: #fff;
}

.nav-tool-btn--apply-join .nav-tool-text {
  line-height: 1;
  color: inherit;
}

.nav-tool-apply-join-icon {
  display: inline-flex;
  flex-shrink: 0;
  line-height: 0;
}

.nav-tool-apply-join-icon-img {
  display: block;
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.nav-tool-qr-popover {
  position: absolute;
  top: 74px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.2s,
    visibility 0.2s;
  z-index: 100;
}

.nav-tool-wrap:hover .nav-tool-qr-popover {
  opacity: 1;
  visibility: visible;
}

.nav-tool-qr-img {
  display: block;
  width: 140px;
  height: 140px;
  object-fit: contain;
}

/* 收藏本页：悬浮 / 聚焦 / 触屏按下时在按钮下方显示说明 */
.nav-tool-wrap--collect .nav-collect-tip {
  position: absolute;
  top: 76px;
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  max-width: min(320px, calc(100vw - 32px));
  padding: 12px 16px;
  box-sizing: border-box;
  font-size: 14px;
  line-height: 1.5;
  color: #333;
  text-align: center;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
  border: 1px solid #eef0f4;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.2s,
    visibility 0.2s;
  z-index: 100;
}

.nav-tool-wrap--collect .nav-collect-tip-line {
  margin: 0 0 6px;
}

.nav-tool-wrap--collect .nav-collect-tip-kbd {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  color: #042e5e;
}

.nav-tool-wrap--collect:hover .nav-collect-tip,
.nav-tool-wrap--collect:focus-within .nav-collect-tip,
.nav-tool-wrap--collect:active .nav-collect-tip {
  opacity: 1;
  visibility: visible;
}

/* 轮播 Banner */
.banner {
  position: relative;
  width: 100%;
  min-width: 1200px;
  /* 勿对 .banner 设 overflow:hidden：轮播高度未就绪时高度为 0，会裁掉绝对定位的标题层（Safari 尤明显） */
  overflow: visible;
  isolation: isolate;
}

.banner-swiper {
  position: relative;
  z-index: 0;
  width: 100%;
  height: auto;
  overflow: hidden;
}

.banner-member-mask {
  position: absolute;
  inset: 0;
  z-index: 18;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.25s ease,
    visibility 0.25s ease;
}

.banner-swiper .swiper-slide {
  width: 100%;
  height: auto;
}

.banner-slide-img {
  display: block;
  width: 100%;
  height: auto;
}

/* 横向轮播：分页圆点仍叠在 Banner 右侧纵向排列（位置与原先纵向轮播一致） */
.banner-swiper.swiper-horizontal > .swiper-pagination-bullets {
  right: 57px;
  left: auto;
  top: 50%;
  bottom: auto;
  width: auto;
  transform: translate3d(0, -50%, 0);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

.banner-swiper .swiper-pagination-bullet {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.6);
  opacity: 1;
  margin: 14px 0 !important;
}

.banner-swiper .swiper-pagination-bullet-active {
  background: #fff;
  position: relative;
}

.banner-swiper .swiper-pagination-bullet-active::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background: url("../images/banner/current-page.png") no-repeat center center;
  background-size: contain;
}

/* title 和 second-title：叠在轮播区域内（DOM 放在 .banner-swiper 内，与 Swiper 同高，避免被父级裁切） */
.banner-overlay {
  position: absolute;
  top: 0;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  z-index: 20;
  width: 100%;
  max-width: 1200px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  box-sizing: border-box;
  padding: 0 16px;
}

.banner-member-search {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 22;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 1200px;
  padding: 0 16px;
  box-sizing: border-box;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.25s ease,
    visibility 0.25s ease;
}

.banner-member-search-title {
  margin: 0 0 22px;
  font-size: 52px;
  line-height: 1;
  font-weight: 600;
  color: #fff;
  letter-spacing: 2px;
}

.banner-member-search-title-img {
  display: block;
  width: auto;
  max-width: 100%;
  height: 50px;
  margin: 0 auto 32px;
}

.banner-member-search-form {
  display: inline-flex;
  align-items: stretch;
  min-width: 420px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

.banner-member-search-field {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  width: 380px;
  max-width: 100%;
  background: #fff;
  border-radius: 8px 0 0 8px;
  box-sizing: border-box;
}

.banner-member-search-leading {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-left: 12px;
  margin-right: 6px;
  background: url("../images/search/search.png") no-repeat center center;
  background-size: contain;
}

.banner-member-search-field.has-value .banner-member-search-leading {
  display: none;
}

.banner-member-search-input {
  flex: 1 1 auto;
  min-width: 0;
  width: 0;
  padding: 8px 6px 8px 0;
  border: none;
  outline: none;
  font-size: 14px;
  line-height: 22px;
  color: #333;
  box-sizing: border-box;
  background: transparent;
  border-radius: 0;
}

.banner-member-search-field.has-value .banner-member-search-input {
  padding-left: 12px;
}

.banner-member-search-clear {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin: 0 10px 0 4px;
  padding: 0;
  border: none;
  background: url("../images/search/cancel-icon.png") no-repeat center center;
  background-size: contain;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.15s ease,
    visibility 0.15s ease;
}

.banner-member-search-field.has-value .banner-member-search-clear {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.banner-member-search-input::placeholder {
  color: #7e7e7e;
}

.banner-member-search-btn {
  height: 42px;
  padding: 0 26px;
  border: none;
  background: #004695;
  border-radius: 0 8px 8px 0;
  color: #fff;
  font-size: 16px;
  line-height: 24px;
  cursor: pointer;
}

.banner-member-search-btn:hover {
  background: #042e5e;
}

.banner--member-search-active .banner-overlay {
  opacity: 0;
  visibility: hidden;
}

.banner--member-search-active .banner-member-mask,
.banner--member-search-active .banner-member-search {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.banner-member-stats {
  position: absolute;
  left: 50%;
  bottom: 0;
  z-index: 24;
  transform: translate(-50%, 50%);
  width: 1200px;
  max-width: calc(100% - 32px);
  height: 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  border: 1px solid #fff;
  background: linear-gradient(180deg, #eff7ff 0%, #fff 100%);
  box-shadow: 0 0 12px 5px rgba(55, 94, 138, 0.12);
  box-sizing: border-box;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.25s ease,
    visibility 0.25s ease;
}

.banner-member-stats-item {
  flex: 1 1 0;
  min-width: 0;
}

.banner-member-stats-item-inner {
  display: inline-flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  gap: 9px;
  color: #042e5e;
}

.banner-member-stats-icon {
  width: 44px;
  height: 44px;
  object-fit: contain;
}

.banner-member-stats-label {
  color: #333;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 27px;
}

.banner-member-stats-value {
  font-size: 40px;
  line-height: 1;
  font-weight: 600;
  color: #042e5e;
  letter-spacing: 1px;
}

.banner-member-stats-unit {
  color: #333;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 27px;
}

.banner-member-stats-divider {
  width: 1px;
  height: 42px;
  background: #9ecbff;
}

.banner--member-search-active .banner-member-stats {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.banner-title-img {
  display: block;
  width: 100%;
  max-width: 1200px;
  height: auto;
  flex-shrink: 0;
}

.banner-second-title-img {
  display: block;
  width: 47%;
  max-width: 568px;
  height: auto;
  flex-shrink: 0;
}

/* 联盟介绍子 Tab：叠在 Banner 底边 */
.banner-intro-tabs {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 15;
  pointer-events: auto;
}

.banner-intro-tabs-inner {
  box-sizing: border-box;
}

.banner-intro-tabs .intro-subnav {
  margin-bottom: 0;
  border-radius: 8px 8px 0 0;
  box-shadow: 0 -6px 24px rgba(15, 40, 75, 0.12);
}

/* 联盟介绍（主导航「联盟介绍」及子锚点） */
.intro-section {
  width: 100%;
  min-width: 1200px;
  background: #fff;
  scroll-margin-top: 120px;
}

/* 主导航 Tab：仅展示当前路由对应主内容区 */
.main-panel--hidden {
  display: none !important;
}

.intro-section-inner {
  padding: 74px 0 0;
  box-sizing: border-box;
}

.intro-subnav {
  display: flex;
  align-items: center;
  margin-bottom: 36px;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-sizing: border-box;
  padding: 0 26px;
}

.intro-subnav-item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 26px;
  font-size: 18px;
  line-height: 42px;
  color: #042e5e;
  text-decoration: none;
  box-sizing: border-box;
  position: relative;
  transition: color 0.2s ease;
}

.intro-subnav-item:hover {
  color: #042e5e;
}

.intro-subnav-item.is-active {
  color: #042e5e;
  font-weight: 600;
}

.intro-subnav-item.is-active::after {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  bottom: 0;
  height: 1px;
  background: #042e5e;
  border-radius: 2px 2px 0 0;
}

.intro-subnav-divider {
  width: 1px;
  height: 24px;
  margin: 0 24px;
  flex-shrink: 0;
  background: #a5a5a5;
  /* 有固定 height 时不要 stretch，否则按交叉轴起点对齐会贴在顶部 */
  align-self: center;
}

.intro-panel {
  display: none;
  scroll-margin-top: 120px;
}

.intro-panel.is-active {
  display: block;
}

.intro-panel-head {
  position: relative;
  min-height: 76px;
  margin: 0 0 28px;
  text-align: left;
}

.intro-watermark {
  position: absolute;
  left: 0;
  top: -28px;
  max-width: 92%;
  font-size: 75px;
  line-height: 75px;
  font-weight: 400;
  color: #f2f2f2;
  pointer-events: none;
  user-select: none;
}

.intro-panel-title {
  position: relative;
  z-index: 1;
  margin: 0;
  padding-top: 20px;
  font-size: 40px;
  line-height: 40px;
  font-weight: 600;
  color: #042e5e;
}

.intro-panel-logo {
  display: block;
  margin: 0 auto 32px;
  max-width: 100%;
  height: auto;
  max-height: 460px;
  object-fit: contain;
}

.intro-panel-body {
  width: 1200px;
  margin: 0 auto;
  color: #333;
  text-align: justify;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 42px;
  text-indent: 2em;
}

.intro-panel-body .intro-em {
  color: #042e5e;
  font-weight: 600;
}

/* 秘书处常设：顶栏 + 双图并排 + 二维码与联络方式 */
.intro-contact {
  width: 1200px;
  max-width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

.intro-contact-headbar {
  width: 100%;
  margin: 0 0 28px;
  padding: 20px 16px;
  box-sizing: border-box;
  background: #eef1f6;
  border-radius: 2px;
}

.intro-contact-headbar-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.intro-contact-headbar-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-left: 10px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.35;
  color: #042e5e;
}

.intro-contact-headbar-title-text {
  flex-shrink: 0;
}

.intro-contact-headbar-sep {
  flex-shrink: 0;
  width: 1px;
  height: 16px;
  margin: 0 10px;
  background: #aaa;
}

.intro-contact-photos {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  margin: 0 0 36px;
}

.intro-contact-photo-wrap {
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
}

.intro-contact-photo-img {
  display: block;
  width: 100%;
  height: 380px;
  object-fit: cover;
}

.intro-contact-footer {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 20px;
  width: 100%;
}

.intro-contact-qr-col {
  flex: 0 0 auto;
  text-align: center;
}

.intro-contact-qr {
  display: block;
  width: 113px;
  height: auto;
  padding: 14px;
}

.intro-contact-qr-caption {
  color: #979797;
  text-align: justify;
  font-family: "PingFang SC";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
}

.intro-contact-text-col {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
}

.intro-contact-text-line {
  font-size: 18px;
  font-weight: 400;
  line-height: 42px;
  color: #333;
}

.intro-contact-text-label {
  color: #042e5e;
  font-weight: 600;
}

.intro-contact-text-value {
  font-weight: 400;
  color: #333;
}

.intro-contact-text-line:last-child {
  margin-bottom: 0;
}

.intro-leader-modules {
  width: 1200px;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.intro-leader-module {
  width: 100%;
}

.intro-leader-module-title {
  margin: 0 0 24px;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.35;
  color: #042e5e;
  text-align: center;
}

.intro-leader-block-title-icon {
  display: inline-block;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  background: #9ecbff;
  vertical-align: middle;
}

.intro-leader-block-title {
  display: flex;
  align-items: center;
  width: 100%;
  margin-bottom: 22px;
  padding: 20px 16px;
  box-sizing: border-box;
  background: #eef1f6;
  border-radius: 2px;
}

.intro-leader-block-title--inline {
  justify-content: flex-start;
}

.intro-leader-block-title-text {
  margin-left: 10px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.35;
  color: #042e5e;
}

/* 理事长：左图右文 */
.intro-leader-module--chairman .intro-leader-chairman-row {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 22px;
}

.intro-leader-chairman-photo {
  position: relative;
  width: 301px;
  border-radius: 4px;
  overflow: hidden;
  background: #e8eef5;
}

.intro-leader-chairman-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.intro-leader-chairman-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0 0 12px 7px;
  background: linear-gradient(
    180deg,
    rgba(4, 46, 94, 0) 0%,
    rgba(4, 28, 58, 0.82) 100%
  );
  color: #fff;
}

.intro-leader-chairman-name {
  font-size: 20px;
  font-weight: 700;
  line-height: 20px;
  margin-bottom: 6px;
}

.intro-leader-chairman-line {
  font-size: 12px;
  font-weight: 400;
  line-height: 12px;
}

.intro-leader-chairman-message {
  flex: 1;
  color: #333;
  text-align: justify;
  font-family: "PingFang SC";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 42px;
}

.intro-leader-chairman-message p {
  text-indent: 2em;
}

.intro-leader-chairman-message p:last-child {
  margin-bottom: 0;
}

/* 副理事长：顶栏 + 两列网格 */
.intro-leader-vice-headbar {
  width: 100%;
  margin: 70px 0 22px 0;
  padding: 20px 16px;
  box-sizing: border-box;
  background: #eef1f6;
  border-radius: 2px;
}

.intro-leader-vice-headbar-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.intro-leader-vice-headbar-title {
  font-size: 20px;
  font-weight: 500;
  color: #042e5e;
  margin-left: 10px;
}

.intro-leader-vice-headbar-sub {
  font-size: 12px;
  font-weight: 500;
  color: #042e5e;
}

.intro-leader-vice-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}

.intro-leader-vice-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex: 0 0 50%;
  max-width: 50%;
  box-sizing: border-box;
  padding: 0 10px;
  margin-bottom: 22px;
  min-width: 0;
}

.intro-leader-vice-avatar-wrap {
  flex-shrink: 0;
  width: 167px;
  height: 167px;
  margin-right: 22px;
  border-radius: 50%;
  overflow: hidden;
  background: #dde6f0;
}

.intro-leader-vice-avatar {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.intro-leader-vice-text {
  flex: 1;
  min-width: 0;
  text-align: left;
}

.intro-leader-vice-name {
  margin-bottom: 6px;
  color: #042e5e;
  text-align: justify;
  font-size: 26px;
  font-style: normal;
  font-weight: 600;
  line-height: 38px;
}

.intro-leader-vice-title-line {
  color: #5b5b5b;
  text-align: justify;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
}

.intro-leader-module-images {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 20px 24px;
}

.intro-leader-module-img {
  display: block;
  height: auto;
  object-fit: contain;
}

.intro-leader-module:first-of-type .intro-leader-module-img {
  max-width: 400px;
}

.intro-leader-module:not(:first-of-type) .intro-leader-module-img {
  max-width: 220px;
}

.section-route-placeholder {
  width: 100%;
  min-width: 1200px;
  padding: 48px 0 80px;
  background: #fff;
  box-sizing: border-box;
}

.route-placeholder-title {
  margin: 0 0 16px;
  font-size: 32px;
  font-weight: 700;
  color: #042e5e;
  text-align: center;
}

.route-placeholder-desc {
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: #666;
  text-align: center;
}

/* 联盟章程 */
.section-charter {
  width: 100%;
  min-width: 1200px;
  padding: 100px 0 0;
  background: #fff;
  box-sizing: border-box;
}

.charter-page-title {
  margin: 0 0 40px;
  font-size: 32px;
  font-weight: 700;
  color: #042e5e;
  text-align: center;
}

.charter-cards {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  margin: 0 -12px;
  box-sizing: border-box;
}

.charter-card {
  flex: 0 0 50%;
  max-width: 50%;
  box-sizing: border-box;
  padding: 0 10px 20px;
  outline: none;
}

.charter-card:focus-visible .charter-card-inner {
  outline: 2px solid #1a6fd4;
  outline-offset: 2px;
}

.charter-card-inner {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  min-height: 120px;
  padding: 28px 35px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #eef0f4;
  box-shadow: 0 4px 20px 0 rgba(213, 224, 237, 1);
  cursor: pointer;
  box-sizing: border-box;
  transition:
    background 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.charter-card.is-active .charter-card-inner,
.charter-card:hover .charter-card-inner {
  background: #042e5e;
  border-color: #042e5e;
  box-shadow: 0 8px 28px rgba(4, 46, 94, 0.28);
}

.charter-card-num {
  flex: 0 0 74px;
  width: 74px;
  text-align: center;
  font-size: 64px;
  font-weight: 600;
  line-height: 64px;
  color: #042e5e;
  font-variant-numeric: tabular-nums;
}

.charter-card.is-active .charter-card-num,
.charter-card:hover .charter-card-num {
  color: #fff;
}

.charter-card-sep {
  flex-shrink: 0;
  align-self: stretch;
  width: 1px;
  min-height: 72px;
  margin: 0 33px;
  background: #d5d5d5;
}

.charter-card.is-active .charter-card-sep,
.charter-card:hover .charter-card-sep {
  background: rgba(255, 255, 255, 0.85);
}

.charter-card-main {
  flex: 1;
  min-width: 0;
  text-align: left;
}

.charter-card-title {
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 600;
  line-height: 42px;
  color: #333;
}

.charter-card.is-active .charter-card-title,
.charter-card:hover .charter-card-title {
  color: #fff;
}

.charter-card-preview {
  margin: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 38px;
  color: #333;
  white-space: pre-line;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.charter-card.is-active .charter-card-preview,
.charter-card:hover .charter-card-preview {
  color: rgba(255, 255, 255, 0.9);
}

.charter-container {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
}

.charter-list-block.is-hidden {
  display: none;
}

.charter-detail-block {
  box-sizing: border-box;
  padding: 0 8px;
}

.charter-detail-toolbar {
  position: relative;
  min-height: 40px;
  margin-bottom: 8px;
}

.charter-detail-back {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
  padding: 4px 8px 4px 0;
  margin: 0;
  border: none;
  background: transparent;
  font-size: 18px;
  line-height: 18px;
  font-weight: 400;
  color: #333;
  cursor: pointer;
  box-sizing: border-box;
}

.charter-detail-back:hover {
  color: #005bc4;
}

.charter-detail-back-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 0;
  margin-right: 6px;
}

.charter-detail-back-icon svg {
  display: block;
  width: 10px;
  height: 16px;
}

.charter-detail-head {
  text-align: center;
  margin-bottom: 38px;
}

.charter-detail-title {
  margin: 0 0 32px;
  padding: 0 80px;
  font-size: 24px;
  font-weight: 600;
  line-height: 42px;
  color: #333;
  box-sizing: border-box;
}

.charter-detail-rule {
  height: 1px;
  margin: 0;
  background: #e5e5e5;
}

.charter-detail-body {
  max-width: 100%;
  margin: 0 auto;
  font-size: 18px;
  line-height: 42px;
  color: #333;
  text-align: justify;
}

.charter-detail-article {
  margin: 0 0 32px;
  white-space: pre-line;
}

.charter-detail-article:last-child {
  margin-bottom: 0;
}

.charter-detail-article-label {
  font-weight: 600;
  color: #111;
}

.charter-detail-pager {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px 24px;
  max-width: 100%;
  margin: 48px auto 0;
  padding-top: 36px;
  box-sizing: border-box;
}

.charter-detail-pager-col {
  flex: 1 1 0;
  min-width: 0;
}

.charter-detail-pager-col--prev {
  text-align: left;
}

.charter-detail-pager-col--next {
  text-align: right;
}

.charter-detail-pager-link {
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  font-size: 18px;
  line-height: 18px;
  font-weight: 400;
  color: #333;
  text-align: inherit;
  cursor: pointer;
  text-decoration: none;
  box-sizing: border-box;
}

.charter-detail-pager-link:hover {
  color: #005bc4;
}

.charter-detail-pager-muted {
  font-size: 18px;
  line-height: 18px;
  color: #b9b9b9;
  user-select: none;
}

/* 申请流程 */
.section-apply {
  width: 100%;
  min-width: 1200px;
  padding: 100px 0 0;
  background: #fff;
  box-sizing: border-box;
}

.apply-container {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
}

.apply-page-title {
  margin: 0 0 40px;
  font-size: 32px;
  font-weight: 700;
  color: #042e5e;
  text-align: center;
}

.apply-timeline {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 8px 0 16px;
  box-sizing: border-box;
  overflow: visible;
}

.apply-step-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  margin-bottom: 0;
  position: relative;
  z-index: 1;
}

.apply-step-marker {
  flex: 0 0 32px;
  width: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.apply-step-dot {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 0;
}

.apply-step-dot-img {
  display: block;
  width: 17px;
  height: 17px;
  object-fit: contain;
}

/* 流程卡片之间仅 20px 间距；虚线段本身高 86px，在间隙内居中绘制（可上下溢出） */
.apply-step-connector {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  height: 20px;
  flex-shrink: 0;
  box-sizing: border-box;
  position: relative;
  overflow: visible;
}

.apply-step-connector-axis {
  flex: 0 0 32px;
  width: 32px;
  position: relative;
  overflow: visible;
  box-sizing: border-box;
}

.apply-step-connector-line {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0;
  height: 86px;
  margin: 0;
  padding: 0;
  border: none;
  border-left: 2px dotted rgba(91, 142, 200, 0.5);
  transform: translate(-50%, -50%);
  box-sizing: border-box;
  pointer-events: none;
}

.apply-step-connector-spacer {
  flex: 1;
  min-width: 0;
}

.apply-step-panel-wrap {
  flex: 1;
  min-width: 0;
}

.apply-step-panel-inner {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-height: 100px;
  padding: 28px 35px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #eef0f4;
  box-shadow: 0 4px 16px 0 #d5e0ed;
  box-sizing: border-box;
}

.apply-step-num {
  width: 78px;
  text-align: center;
  flex-shrink: 0;
  font-size: 64px;
  font-weight: 600;
  line-height: 64px;
  color: #042e5e;
  font-variant-numeric: tabular-nums;
}

.apply-step-sep {
  flex-shrink: 0;
  align-self: stretch;
  width: 1px;
  min-height: 56px;
  margin: 0 33px;
  background: #d5d5d5;
}

.apply-step-text {
  flex: 1;
  margin: 0;
  min-width: 0;
  font-size: 22px;
  font-weight: 600;
  line-height: 42px;
  color: #333;
  text-align: left;
}

/* 联盟成员单位 */
.section-members {
  width: 100%;
  min-width: 1200px;
  padding: 40px 0 0 0;
  background: #fff;
}

.members-title {
  font-size: 40px;
  line-height: 48px;
  font-weight: 600;
  color: #042e5e;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.members-title::before,
.members-title::after {
  content: "";
  width: 160px;
  height: 160px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.members-title::before {
  margin-right: 35px;
  background-image: url("../images/title-left-icon.png");
}

.members-title::after {
  margin-left: 35px;
  background-image: url("../images/title-right-icon.png");
}

.members-filters {
  position: relative;
  margin: 60px 0 32px;
  display: none;
}

.member-query-active .members-filters {
  display: block;
}

.member-query-active .members-title,
.member-query-active #membersList {
  display: none;
}

.members-query-wrap {
  display: none;
}

.member-query-active .members-query-wrap {
  display: block;
}

.section-members-search {
  width: 100%;
  min-width: 1200px;
  padding: 28px 0 0;
  box-sizing: border-box;
}

/* 与 .charter-detail-back 一致：内联 SVG 继承 color，悬停变色 */
.members-search-back {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
  margin: 0 0 14px;
  padding: 4px 8px 4px 0;
  border: none;
  background: transparent;
  font-size: 18px;
  line-height: 18px;
  font-weight: 400;
  color: #333;
  cursor: pointer;
  box-sizing: border-box;
}

.members-search-back:hover {
  color: #005bc4;
}

.members-search-back-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 0;
  margin-right: 6px;
}

.members-search-back-icon svg {
  display: block;
  width: 10px;
  height: 16px;
}

.search-result-active .banner,
.search-result-active #section-about,
.search-result-active #section-charter,
.search-result-active #section-apply,
.search-result-active #section-members,
.search-result-active #section-rights,
.search-result-active #section-certificate {
  display: none !important;
}

.search-result-active .section-members-search {
  display: block !important;
}

.members-search-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 150px;
}

.members-search-empty[hidden] {
  display: none !important;
}

.members-search-empty-text {
  color: #999;
  text-align: right;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
}

.members-search-empty-img {
  display: block;
  max-width: 100%;
  width: 80px;
  height: auto;
  object-fit: contain;
}

.members-filter-row {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 42px;
  color: #333;
}

.members-filter-prefix {
  font-size: 14px;
  line-height: 1;
  font-weight: 400;
  color: #4b4b4b;
}

.members-filter-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: none;
  background: transparent;
  color: #333;
  font-size: 18px;
  line-height: 1;
  font-weight: 400;
  cursor: pointer;
  padding: 0;
}

.members-filter-trigger.is-selected,
.members-filter-trigger.is-open {
  color: #042e5e;
}

.members-filter-caret {
  width: 6px;
  height: 6px;
  background-color: #6d6d6d;
  -webkit-mask: url("../images/search/triangle.png") no-repeat center center;
  -webkit-mask-size: contain;
  mask: url("../images/search/triangle.png") no-repeat center center;
  mask-size: contain;
  opacity: 0.82;
  transform-origin: 50% 45%;
  backface-visibility: hidden;
  will-change: transform;
  transform: translateY(-1px);
  transition:
    transform 0.28s cubic-bezier(0.22, 0.61, 0.36, 1),
    background-color 0.2s ease,
    opacity 0.2s ease;
}

.members-filter-trigger.is-selected .members-filter-caret,
.members-filter-trigger.is-open .members-filter-caret {
  background-color: #042e5e;
  opacity: 1;
}

.members-filter-trigger.is-open .members-filter-caret {
  transform: translateY(-1px) rotate(180deg);
}

.members-filter-dropdown-panel {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 50;
  width: max-content;
  max-width: min(1200px, 100%);
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.12);
  padding: 22px 28px 26px;
  box-sizing: border-box;
}

.members-filter-tabs {
  display: flex;
  align-items: center;
  gap: 34px;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 18px;
}

.members-filter-tab {
  position: relative;
  border: none;
  background: transparent;
  padding: 0 0 14px;
  font-size: 18px;
  line-height: 1;
  color: #333;
  cursor: pointer;
}

.members-filter-tab.is-active {
  color: #042e5e;
}

.members-filter-tab.is-active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 3px;
  border-radius: 2px;
  background: #042e5e;
}

.members-filter-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 24px;
}

.members-filter-chip {
  border: none;
  border-radius: 4px;
  background: transparent;
  color: #333;
  font-size: 18px;
  line-height: 1.2;
  padding: 4px 8px;
  cursor: pointer;
}

.members-filter-chip:hover {
  background: #d6e9ff;
}

.members-filter-chip.is-active {
  color: #fff;
  background: #042e5e;
}

.members-list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}

.members-list--query {
  justify-content: flex-start;
}

.members-empty {
  margin: 64px 0 40px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.members-empty[hidden] {
  display: none !important;
}

.members-empty-text {
  color: #999;
  text-align: right;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
}

.members-empty-img {
  display: block;
  width: 80px;
  height: auto;
  margin-top: 8px;
  object-fit: contain;
}

.members-query-more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}

.members-query-more-wrap[hidden] {
  display: none !important;
}

.members-search-more-wrap {
  margin-top: 32px;
}

.members-query-more-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  border: 1px solid #042e5e;
  border-radius: 8px;
  background: #fff;
  color: #042e5e;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease,
    opacity 0.2s ease;
}

.members-query-more-btn:hover:not(:disabled):not(.is-disabled) {
  background: #042e5e;
  color: #fff;
}

.members-query-more-caret {
  width: 12px;
  height: 12px;
  margin-left: 10px;
  display: inline-block;
  background-color: currentColor;
  -webkit-mask: url("../images/search/more-icon.svg") no-repeat center center;
  -webkit-mask-size: contain;
  mask: url("../images/search/more-icon.svg") no-repeat center center;
  mask-size: contain;
}

.members-query-more-btn.is-disabled,
.members-query-more-btn:disabled {
  border-color: #aeb8c4;
  color: #aeb8c4;
  cursor: not-allowed;
}

.member-card {
  width: 392px;
  padding: 27px 28px;
  display: flex;
  align-items: center;
  background: #f2f4f7;
  border-radius: 8px;
  box-sizing: border-box;
  position: relative;
  transition: background 0.25s ease;
  cursor: pointer;
  text-decoration: none;
}

.member-card:hover {
  background: linear-gradient(180deg, #d5e9ff 0%, #f1f8ff 100%);
}

.member-card[aria-disabled="true"] {
  cursor: default;
}

.member-card[aria-disabled="true"]:hover {
  background: #f2f4f7;
}

.member-logo {
  width: 82px;
  height: 82px;
  border-radius: 82px;
  background-color: #fff;
  flex-shrink: 0;
  object-fit: contain;
  margin-right: 8px;
}

.member-info {
  flex: 1;
  min-width: 0;
}

.member-level {
  position: absolute;
  top: 0;
  right: 0;
  display: inline-block;
  padding: 7px 19px;
  font-size: 18px;
  line-height: 18px;
  font-weight: 500;
  color: #fff;
  background: #042e5e;
  border-radius: 0 8px 0 8px;
}

.member-name {
  font-size: 20px;
  line-height: 24px;
  font-weight: 600;
  color: #042e5e;
  text-align: justify;
}

/* 权益模块 */
.section-rights {
  width: 100%;
  min-width: 1200px;
  padding: 50px 0 0;
  background: #fff;
}

.rights-title {
  font-size: 40px;
  line-height: 48px;
  font-weight: 600;
  color: #042e5e;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rights-title-highlight {
  background: linear-gradient(
    90deg,
    #906505 54.81%,
    #e6b42c 78.85%,
    #8e6713 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.rights-title::before,
.rights-title::after {
  content: "";
  width: 160px;
  height: 160px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.rights-title::before {
  margin-right: 35px;
  background-image: url("../images/title-left-icon.png");
}

.rights-title::after {
  margin-left: 35px;
  background-image: url("../images/title-right-icon.png");
}

.rights-tabs-wrap {
  position: relative;
  height: 130px;
  background: #eef1f6;
  box-shadow: 0 0 0 100vmax #eef1f6;
  clip-path: inset(0 -100vmax);
}

.rights-tabs {
  display: flex;
  width: 1200px;
  margin: 0 auto;
}

.rights-tab {
  position: relative;
  flex: 1;
  border: none;
  background: transparent;
  color: #858585;
  height: 130px;
  font-size: 28px;
  line-height: 42px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}

.rights-tab:not(.active):hover {
  color: #042e5e;
  font-weight: 600;
}

.rights-tab:not(.active):hover::after {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 0;
  height: 3px;
  background: #042e5e;
}

.rights-tab-no {
  font-size: 28px;
}

.rights-tab-title {
  font-size: 24px;
}

.rights-tab.active {
  background: #042e5e;
  color: #fff;
  font-weight: 600;
}

.rights-panel {
  padding: 65px 0 0;
}

.rights-item {
  display: flex;
  align-items: flex-start;
  background: #fff;
}

.rights-icon {
  width: 44px;
  height: 44px;
  object-fit: contain;
  flex-shrink: 0;
}

.rights-item-title {
  font-size: 22px;
  line-height: 28px;
  color: #042e5e;
  margin-bottom: 6px;
}

.rights-item-desc {
  font-size: 16px;
  line-height: 24px;
  color: #042e5e;
}

/* 01 权威认证授牌 - 证书轮播（coverflow 居中突出） */
.rights-cert-block {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.rights-cert-viewport {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}

.rights-cert-swiper {
  width: 100%;
  margin: 0 auto;
  overflow: visible;
  box-sizing: border-box;
}

.rights-cert-swiper .swiper-wrapper {
  align-items: flex-end;
}

.rights-cert-swiper .swiper-slide {
  box-sizing: border-box;
  flex-shrink: 0;
  height: 379px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  z-index: 1;
}

.rights-cert-swiper .swiper-slide-active {
  z-index: 3;
}

.rights-cert-swiper .swiper-slide-prev {
  z-index: 2;
}

.rights-cert-swiper .swiper-slide-next {
  z-index: 2;
}

.rights-cert-img {
  display: block;
  width: 429px;
  max-width: none;
  height: auto;
  transform-origin: center bottom;
  transition: transform 0.5s ease;
}

.rights-cert-swiper .swiper-slide-prev .rights-cert-img {
  transform: translateX(15px);
}

.rights-cert-swiper .swiper-slide-next .rights-cert-img {
  transform: translateX(-15px);
}

.rights-cert-swiper .swiper-slide-active .rights-cert-img {
  transform: scale(1.19814);
}

.rights-cert-caption {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 22px;
  margin-bottom: 70px;
  padding: 20px 24px;
  background: #eef1f6;
}

.rights-cert-caption-dot {
  width: 6px;
  height: 6px;
  background: #9ecbff;
  flex-shrink: 0;
}

.rights-cert-caption-text {
  font-size: 20px;
  font-weight: 500;
  color: #042e5e;
}

.rights-cert-moments {
  display: flex;
  gap: 14px;
  margin-top: 22px;
}

.rights-cert-moment {
  flex: 1 1 0;
  min-width: 0;
}

.rights-cert-moment-img {
  display: block;
  width: 100%;
  height: auto;
}

.rights-cert-moments-caption {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 22px;
  margin-bottom: 70px;
  padding: 20px 24px;
  background: #eef1f6;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  color: #042e5e;
  text-align: center;
}

.rights-cert-moments-caption::before,
.rights-cert-moments-caption::after {
  content: "";
  width: 6px;
  height: 6px;
  background: #9ecbff;
  flex-shrink: 0;
}

.rights-cert-video-wrap {
  position: relative;
  margin-top: 22px;
}

.rights-cert-video-pause-overlay {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease;
}

.rights-cert-video-pause-overlay.is-visible {
  opacity: 1;
  visibility: visible;
}

.rights-cert-video-pause-cover {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rights-cert-video-pause-icon {
  position: relative;
  z-index: 1;
  display: block;
  width: 64px;
  height: auto;
  object-fit: contain;
}

.rights-cert-video {
  display: block;
  width: 100%;
  height: auto;
  background: #000;
}

.rights-cert-video-caption {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 20px 24px;
  background: #eef1f6;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  color: #042e5e;
  text-align: center;
}

.rights-cert-video-caption::before,
.rights-cert-video-caption::after {
  content: "";
  width: 6px;
  height: 6px;
  background: #9ecbff;
  flex-shrink: 0;
}

/* 02 顶级平台曝光 - platform 排版 */
.rights-platform-block {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding-top: 130px;
}

.rights-platform-plat-panel {
  position: relative;
  width: 1200px;
  height: 643px;
  box-sizing: border-box;
  background: linear-gradient(
    180deg,
    rgba(214, 233, 255, 0.56) 0%,
    rgba(214, 233, 255, 0) 100%
  );
  display: flex;
  flex-direction: column;
}

.rights-platform-plat-row {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
}

.rights-platform-plat-cell {
  min-width: 0;
}

.rights-platform-plat-cell--first {
  position: absolute;
  top: -126px;
  left: 50px;
  z-index: 1;
}

.rights-platform-plat-cell--second {
  align-self: flex-end;
  margin-right: 50px;
}

.rights-platform-plat-img {
  display: block;
  width: auto;
  max-width: calc(1200px - 50px);
  height: auto;
}

.rights-platform-plat-caption,
.rights-platform-gain-caption,
.rights-systemgain-process-caption,
.rights-systemgain-studio-caption,
.rights-academic-llcg-caption,
.rights-academic-cg-caption,
.rights-gdxsqc-sq-caption,
.rights-gdxsqc-sl-caption,
.rights-gdxsqc-jy-caption,
.rights-zyczhh-fw-caption,
.rights-zyczhh-zd-caption,
.rights-cgjzzh-jz-caption {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 20px 24px;
  background: #eef1f6;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  color: #042e5e;
  text-align: center;
}

.rights-platform-plat-caption {
  margin-top: 22px;
  margin-bottom: 70px;
}

.rights-platform-gain-caption {
  margin: 24px 0 0;
  flex-wrap: wrap;
}

.rights-platform-gain-caption-text {
  flex-shrink: 0;
}

.rights-platform-gain-caption-logo {
  display: block;
  height: 30px;
  flex-shrink: 0;
  object-fit: contain;
  align-self: center;
}

.rights-platform-plat-caption::before,
.rights-platform-plat-caption::after,
.rights-platform-gain-caption::before,
.rights-platform-gain-caption::after,
.rights-systemgain-process-caption::before,
.rights-systemgain-process-caption::after,
.rights-systemgain-studio-caption::before,
.rights-systemgain-studio-caption::after,
.rights-academic-llcg-caption::before,
.rights-academic-llcg-caption::after,
.rights-academic-cg-caption::before,
.rights-academic-cg-caption::after,
.rights-gdxsqc-sq-caption::before,
.rights-gdxsqc-sq-caption::after,
.rights-gdxsqc-sl-caption::before,
.rights-gdxsqc-sl-caption::after,
.rights-gdxsqc-jy-caption::before,
.rights-gdxsqc-jy-caption::after,
.rights-zyczhh-fw-caption::before,
.rights-zyczhh-fw-caption::after,
.rights-zyczhh-zd-caption::before,
.rights-zyczhh-zd-caption::after,
.rights-cgjzzh-jz-caption::before,
.rights-cgjzzh-jz-caption::after {
  content: "";
  width: 6px;
  height: 6px;
  background: #9ecbff;
  flex-shrink: 0;
}

.rights-systemgain-process-caption {
  margin-top: 22px;
  margin-bottom: 70px;
}

.rights-systemgain-studio-caption {
  margin-top: 24px;
  margin-bottom: 70px;
}

.rights-academic-llcg-caption {
  margin-top: 22px;
  margin-bottom: 70px;
}

.rights-academic-cg-caption {
  margin-top: 24px;
}

.rights-gdxsqc-sq-caption {
  margin-top: 22px;
  margin-bottom: 70px;
}

.rights-gdxsqc-sl-caption {
  margin-top: 24px;
  margin-bottom: 70px;
}

.rights-gdxsqc-jy-caption {
  margin-top: 22px;
}

.rights-zyczhh-fw-caption {
  margin-top: 22px;
  margin-bottom: 70px;
}

.rights-zyczhh-zd-note {
  margin-top: 24px;
  margin-bottom: 22px;
  color: #1e599c;
  text-align: center;
  font-size: 12px;
}

.rights-zyczhh-zd-note + .rights-zyczhh-zd-caption {
  margin-top: 0;
}

.rights-zyczhh-zd-caption {
  margin-top: 22px;
}

.rights-cgjzzh-jz-caption {
  margin-top: 22px;
  width: 100%;
  box-sizing: border-box;
  justify-content: center;
  align-items: center;
}

.rights-cgjzzh-jz-caption-body {
  flex: 0 1 740px;
  width: 740px;
  max-width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  text-align: center;
}

.rights-cgjzzh-jz-caption-p {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: 28px;
  color: inherit;
}

.rights-cgjzzh-jz-caption-p + .rights-cgjzzh-jz-caption-p {
  margin-top: 10px;
}

/* 05 专业成长护航（fw / zd） */
.rights-zyczhh-block {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.rights-zyczhh-fw-panel {
  box-sizing: border-box;
  overflow: hidden;
  padding: 37px 30px 12px;
  background: linear-gradient(
    180deg,
    rgba(214, 233, 255, 0.56) 0%,
    rgba(214, 233, 255, 0) 100%
  );
}

.rights-zyczhh-fw-row {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  height: 487px;
  border-radius: 8px;
}

.rights-zyczhh-fw-cell {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.rights-zyczhh-fw-img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 487px;
  height: auto;
  object-fit: contain;
  box-shadow: 0 4px 20px 0 rgba(213, 224, 237, 0.7);
}

.rights-zyczhh-zd-panel {
  box-sizing: border-box;
  margin-top: 40px;
  overflow: hidden;
  padding: 37px 30px 12px;
  background: linear-gradient(
    180deg,
    rgba(214, 233, 255, 0.56) 0%,
    rgba(214, 233, 255, 0) 100%
  );
}

.rights-zyczhh-zd-row {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  height: 272px;
  border-radius: 8px;
}

.rights-zyczhh-zd-cell {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.rights-zyczhh-zd-img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 272px;
  height: auto;
  object-fit: contain;
  box-shadow: 0 4px 20px 0 rgba(213, 224, 237, 0.7);
}

/* 06 成果价值转化（jz） */
.rights-cgjzzh-block {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.rights-cgjzzh-jz-panel {
  box-sizing: border-box;
  overflow: hidden;
  padding: 37px 30px 12px;
  background: linear-gradient(
    180deg,
    rgba(214, 233, 255, 0.56) 0%,
    rgba(214, 233, 255, 0) 100%
  );
}

.rights-cgjzzh-jz-row {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  height: 323px;
  border-radius: 8px;
}

.rights-cgjzzh-jz-cell {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.rights-cgjzzh-jz-img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 323px;
  height: auto;
  object-fit: contain;
  box-shadow: 0 4px 20px 0 rgba(213, 224, 237, 0.7);
}

/* 04 高端学术圈层（社群 sq / 沙龙 sl） */
.rights-gdxsqc-block {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.rights-gdxsqc-sq-panel {
  box-sizing: border-box;
  overflow: hidden;
  padding: 37px 31px 12px 31px;
  background: linear-gradient(
    180deg,
    rgba(214, 233, 255, 0.56) 0%,
    rgba(214, 233, 255, 0) 100%
  );
}

.rights-gdxsqc-sq-row {
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  height: 278px;
  gap: 16px;
}

.rights-gdxsqc-sq-cell {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.rights-gdxsqc-sq-img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 278px;
  height: auto;
  object-fit: contain;
  box-shadow: 0 4px 20px 0 rgba(213, 224, 237, 0.7);
}

.rights-gdxsqc-sl-panel {
  box-sizing: border-box;
  margin-top: 40px;
  padding: 0;
  background: transparent;
}

.rights-gdxsqc-sl-inner {
  box-sizing: border-box;
  display: flex;
  align-items: stretch;
  border-radius: 8px;
  background: #ffffff;
}

.rights-gdxsqc-sl-left,
.rights-gdxsqc-sl-right {
  min-width: 0;
  min-height: 0;
  display: flex;
}

.rights-gdxsqc-sl-left {
  flex-direction: row;
  gap: 11.25px;
}

.rights-gdxsqc-sl-right {
  flex-direction: column;
  margin-left: 11.25px;
}

.rights-gdxsqc-sl-cell {
  min-width: 0;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rights-gdxsqc-sl-stack-cell {
  flex: 1 1 0;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rights-gdxsqc-sl-img,
.rights-gdxsqc-sl-stack-img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 100%;
  height: auto;
  object-fit: contain;
}

/* 04 云端教研 jy（两排 3 + 4） */
.rights-gdxsqc-jy-panel {
  box-sizing: border-box;
  margin-top: 40px;
  overflow: hidden;
  padding: 17px 30px 12px;
  background: linear-gradient(
    180deg,
    rgba(214, 233, 255, 0.56) 0%,
    rgba(214, 233, 255, 0) 100%
  );
}

.rights-gdxsqc-jy-inner {
  box-sizing: border-box;
  border-radius: 8px;
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 24px;
}

.rights-gdxsqc-jy-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.rights-gdxsqc-jy-row:first-child {
  gap: 16px;
  height: 298px;
}

.rights-gdxsqc-jy-row:first-child .rights-gdxsqc-jy-img {
  max-height: 298px;
}

.rights-gdxsqc-jy-row:last-child {
  gap: 17px;
  height: 144px;
}

.rights-gdxsqc-jy-row:last-child .rights-gdxsqc-jy-img {
  max-height: 144px;
}

.rights-gdxsqc-jy-cell {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.rights-gdxsqc-jy-img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  box-shadow: 0 4px 20px 0 rgba(213, 224, 237, 0.7);
}

/* 03 系统成果凝练 - 第三、四部分（案例集 / 往期成果） */
.rights-academic-llcg-panel {
  box-sizing: border-box;
  overflow: hidden;
  padding: 35px 30px;
  background: linear-gradient(
    180deg,
    rgba(214, 233, 255, 0.56) 0%,
    rgba(214, 233, 255, 0) 100%
  );
}

.rights-academic-llcg-row {
  border-radius: 8px;
  display: flex;
  align-items: stretch;
  justify-content: center;
  box-sizing: border-box;
  height: 273px;
  background: #ffffff;
  box-shadow: 0 -10px 20px 0 rgba(189, 217, 250, 0.3);
}

.rights-academic-llcg-cell {
  min-width: 0;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border-radius: 8px;
}

.rights-academic-llcg-img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 273px;
  height: auto;
  object-fit: contain;
}

.rights-academic-cg-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  width: 100%;
}

.rights-academic-cg-cell {
  flex: 0 0 calc((100% - 24px) / 4);
  max-width: calc((100% - 24px) / 4);
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rights-academic-cg-link {
  display: block;
  width: 100%;
  aspect-ratio: 441 / 195;
  overflow: hidden;
  line-height: 0;
  text-decoration: none;
  color: inherit;
  border-radius: 8px;
  outline: none;
}

.rights-academic-cg-link:focus-visible {
  outline: 2px solid #1a6fd4;
  outline-offset: 2px;
}

.rights-academic-cg-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
}

/* 03 系统成果凝练 */
.rights-systemgain-block {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.rights-systemgain-process-row {
  height: 280px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: linear-gradient(
    180deg,
    rgba(214, 233, 255, 0.56) 0%,
    rgba(214, 233, 255, 0) 100%
  );
}

.rights-systemgain-process-cell {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rights-systemgain-process-img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 280px;
  height: auto;
  object-fit: contain;
}

.rights-systemgain-process-sep {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rights-systemgain-process-next {
  display: block;
  width: 15px;
  height: auto;
}

.rights-platform-gain-row {
  display: flex;
  align-items: flex-start;
}

.rights-platform-gain-left {
  flex: 0 0 504px;
  width: 474px;
}

.rights-platform-gain-left-img {
  display: block;
  width: 100%;
  height: auto;
}

.rights-platform-gain-grid {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.rights-platform-gain-cell {
  position: relative;
  min-width: 0;
  width: fit-content;
  max-width: 100%;
}

.rights-platform-gain-cell--left {
  align-self: flex-start;
}

.rights-platform-gain-cell--right {
  align-self: flex-end;
}

.rights-platform-gain-cell:nth-child(1) {
  z-index: 1;
}

.rights-platform-gain-cell:nth-child(2) {
  z-index: 2;
}

.rights-platform-gain-cell:nth-child(3) {
  z-index: 3;
}

.rights-platform-gain-cell:nth-child(4) {
  z-index: 4;
}

.rights-platform-gain-cell + .rights-platform-gain-cell {
  margin-top: -70px;
}

.rights-platform-gain-img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
}

/* 03 工作室成果展示（自 gzsjjjh，置于 tab 第二部分） */
.rights-systemgain-studio-wrap {
  width: 100%;
  max-width: 1200px;
}

.rights-systemgain-studio-lists-container {
  position: relative;
  padding-bottom: 0;
  box-sizing: border-box;
  overflow: hidden;
}

.rights-systemgain-studio-lists-container .rights-systemgain-studio-lists {
  width: 1156px;
  max-width: 1156px;
  height: 622px;
  margin: 0 auto;
  overflow: hidden;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 44px;
  box-sizing: border-box;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item::before {
  content: "";
  position: absolute;
  inset: 20px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 2px 20px 0 rgba(213, 224, 237, 0.5);
  z-index: 0;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  > * {
  position: relative;
  z-index: 1;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-header {
  display: flex;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-header
  .studio-list-item-header-logo {
  width: 117px;
  height: 117px;
  filter: drop-shadow(0 3.72px 37.014px rgba(0, 0, 0, 0.07));
  border-radius: 50%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-header
  .studio-list-item-header-logo
  .studio-logo {
  width: 102px;
  height: 102px;
  border-radius: 50%;
  object-fit: cover;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-header
  .studio-list-item-header-text {
  margin-left: 16px;
  min-width: 0;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-header
  .studio-list-item-header-text
  .studio-list-item-header-text-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-header
  .studio-list-item-header-text
  .studio-list-item-header-text-title
  .studio-list-item-header-text-title-name {
  color: #222;
  font-size: 18px;
  font-weight: 600;
  line-height: 18px;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-header
  .studio-list-item-header-text
  .studio-list-item-header-text-title
  .studio-list-item-header-text-title-link {
  display: inline-flex;
  padding: 8px 16px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 8px;
  border: 1px solid #042e5e;
  color: #042e5e;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  line-height: 14px;
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-header
  .studio-list-item-header-text
  .studio-list-item-header-text-title
  .studio-list-item-header-text-title-link:hover {
  background: #042e5e;
  color: #fff;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-header
  .studio-list-item-header-text
  .studio-list-item-header-text-desc {
  color: #333;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  margin-top: 24px;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-content {
  margin-top: 36px;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-content
  .contents-line {
  display: flex;
  gap: 24px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-content
  .contents-line
  .contents-line-item {
  filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.03));
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-content
  .contents-line
  .contents-line-item
  .contents-line-img {
  width: 249px;
  height: 156px;
  display: block;
  object-fit: cover;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-lists
  .studio-list-item
  .studio-list-item-footer {
  color: #444;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 14px;
}

.rights-systemgain-studio-lists-container .rights-systemgain-studio-prev,
.rights-systemgain-studio-lists-container .rights-systemgain-studio-next {
  position: absolute;
  top: 50%;
  width: 26px;
  height: 50px;
  flex-shrink: 0;
  border-radius: 8px;
  background-color: #eef1f6;
  transition: background-color 0.2s ease;
  transform: translateY(-50%);
  z-index: 3;
}

.rights-systemgain-studio-lists-container .rights-systemgain-studio-prev::after,
.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-next::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 13px;
  transform: translate(-50%, -50%);
  background: url("../images/rights/studio-show/right-icon-single.png")
    no-repeat center center;
  background-size: contain;
}

.rights-systemgain-studio-lists-container .rights-systemgain-studio-prev {
  left: 0;
}

.rights-systemgain-studio-lists-container .rights-systemgain-studio-next {
  right: 0;
}

.rights-systemgain-studio-lists-container
  .rights-systemgain-studio-prev::after {
  transform: translate(-50%, -50%) rotate(180deg);
}

.rights-systemgain-studio-lists-container .rights-systemgain-studio-prev:hover,
.rights-systemgain-studio-lists-container .rights-systemgain-studio-next:hover {
  background-color: #042e5e;
}

.rights-systemgain-studio-lists-container .swiper-button-hidden {
  display: none !important;
}

.section-bottom-box {
  padding: 60px 0 40px;
  box-sizing: border-box;
}

.section-bottom-box .container {
  width: min(1600px, calc(100vw - 40px));
}

.bottom-box-demo-title {
  margin-bottom: 16px;
  font-size: 24px;
  line-height: 32px;
  color: #333;
  font-weight: 600;
}

.bottom-box-layout {
  display: flex;
  gap: 10px;
  width: 100%;
  align-items: stretch;
}

.bottom-box-layout--ratio {
  align-items: stretch;
}

.bottom-box-left {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
}

.bottom-box-left--ratio {
  flex: 0 0 calc(100% - 362px);
  aspect-ratio: 16 / 9;
}

.bottom-box-left-group {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
}

.bottom-box-left-inner {
  width: calc((100% - 10px) * 2 / 3);
  aspect-ratio: 16 / 9;
  background: blue;
}

.bottom-box-left-small {
  width: calc((100% - 10px) / 3);
  aspect-ratio: 16 / 9;
  background: blue;
}

.bottom-box-right {
  flex: 0 0 352px;
  background: red;
}

.page-footer {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 180;
  width: 100%;
  min-width: 1200px;
  height: 90px;
  box-sizing: border-box;
  background: url("../images/footer/footer-bg.png") no-repeat center center;
  background-size: cover;
}

.page-footer-inner {
  width: 1200px;
  height: 100%;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 26px;
}

.page-footer-title {
  margin: 0;
  font-size: 32px;
  line-height: 40px;
  color: #fff;
  font-weight: 400;
  text-align: center;
}

.page-footer-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 140px;
  margin-top: 0;
  padding: 10px 40px 10px 22px;
  border: 1px solid #fff;
  border-radius: 8px;
  font-size: 18px;
  line-height: 22px;
  color: #fff;
  text-decoration: none;
  background-color: transparent;
  box-sizing: border-box;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.page-footer-btn:hover {
  background-color: rgba(16, 71, 133, 0.76);
}

.page-footer-btn::after {
  content: "";
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  background: url("../images/footer/right-icon.svg") no-repeat center center;
  background-size: contain;
}
