.irx-page { color: #1f2430; font-family: "Noto Sans SC", "Noto Sans JP", "Microsoft YaHei", sans-serif; line-height: 1.82; }
.irx-shell { width: min(1200px, calc(100% - 40px)); margin: 0 auto; }
.irx-shell--narrow { width: min(860px, calc(100% - 40px)); margin: 0 auto; }
.irx-mv { margin: 0 auto 78px; }
.irx-mv img { width: 100%; height: auto; display: block; }
.irx-bar-title { position: relative; margin: 0 0 24px; padding-left: 20px; font-size: clamp(34px, 3.7vw, 50px); line-height: 1.34; font-weight: 700; }
.irx-bar-title::before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: calc(100% - 18px); border-radius: 0 3px 0 3px; background: #05a; }
.irx-copy { margin: 0 auto 72px; font-size: 18px; line-height: 1.85; color: #3a414d; text-align: center; }
.irx-subtitle { margin: 0 0 24px; font-size: clamp(34px, 3.7vw, 50px); line-height: 1.34; text-align: left; font-weight: 700; position: relative; padding-left: 20px; }
.irx-subtitle::before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: calc(100% - 18px); border-radius: 0 3px 0 3px; background: #05a; }
.irx-text { margin: 0 auto 56px; font-size: 18px; line-height: 1.9; color: #3d4451; }
.irx-mini-title { margin: 0 0 26px; font-size: clamp(24px, 2.3vw, 34px); text-align: center; line-height: 1.4; font-weight: 500; }
.irx-figure-wrap { margin: 0 auto 86px; width: min(980px, 100%); }
.irx-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; margin-bottom: 72px; }
.irx-opt-name { margin: 0 0 14px; font-size: 36px; line-height: 1.23; font-weight: 700; }
.irx-opt-desc { margin: 0; color: #3d4451; font-size: 18px; line-height: 1.9; }
.irx-column-box { background: #f4f6f9; padding: 52px 50px; margin-bottom: 76px; }
.irx-column-title { margin: 0 0 32px; font-size: clamp(28px, 2.85vw, 40px); line-height: 1.33; font-weight: 700; }
.irx-column-grid { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr); gap: 34px; align-items: start; }
.irx-column-sub { margin: 0 0 14px; font-size: clamp(24px, 2.15vw, 33px); line-height: 1.38; font-weight: 700; }
.irx-column-text { margin: 0 0 32px; color: #3d4451; font-size: 18px; line-height: 1.9; }
.irx-column-figure { margin: 6px 0 0; }
.irx-column-figure img { width: 100%; height: auto; display: block; }
.irx-cap { margin: 14px 0 0; font-size: 16px; color: #343a46; }
.irx-banner img,
.irx-figure img { width: 100%; height: auto; display: block; }

.alg-page { color: #1f2430; font-family: "Noto Sans SC", "Noto Sans JP", "Microsoft YaHei", sans-serif; line-height: 1.9; }
.alg-shell { width: min(980px, calc(100% - 40px)); margin: 0 auto; }
.alg-shell--narrow { width: min(760px, calc(100% - 40px)); margin: 0 auto; }
.alg-page-title { margin: 38px 0 18px; font-size: clamp(32px, 3vw, 46px); line-height: 1.35; font-weight: 500; color: #202632; }
.alg-mv { margin: 0 auto 26px; }
.alg-mv img { width: 100%; height: auto; display: block; }
.alg-lead { margin: 0 auto 42px; font-size: 15px; color: #353d49; text-align: center; line-height: 2; }
.alg-title-center { margin: 0 0 18px; padding: 16px 0 0; border-top: 1px solid #9ea4ad; font-size: clamp(24px, 2.4vw, 34px); font-weight: 500; line-height: 1.4; text-align: center; }
.alg-text { margin: 0 auto 38px; font-size: 15px; color: #353d49; line-height: 2; }
.alg-title-sub { margin: 2px 0 12px; font-size: 18px; line-height: 1.45; font-weight: 500; color: #232935; }
.alg-row { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr); gap: 30px; align-items: start; margin-bottom: 46px; }
.alg-row p { margin: 0; font-size: 15px; color: #353d49; line-height: 2; }
.alg-row figure { margin: 0; }
.alg-row img { width: 100%; height: auto; display: block; }
.alg-tech { margin-bottom: 56px; }
.alg-tech b { color: #232a36; }

.pro-page { color: #1f2430; font-family: "Noto Sans SC", "Noto Sans JP", "Microsoft YaHei", sans-serif; line-height: 1.9; }
.pro-shell { width: min(980px, calc(100% - 40px)); margin: 0 auto; }
.pro-shell--narrow { width: min(800px, calc(100% - 40px)); margin: 0 auto; }
.pro-title { margin: 38px 0 18px; font-size: clamp(32px, 3vw, 46px); line-height: 1.35; font-weight: 500; color: #202632; }
.pro-mv { margin: 0 auto 24px; }
.pro-mv img { width: 100%; height: auto; display: block; }
.pro-lead { margin: 0 auto 48px; font-size: 15px; color: #353d49; line-height: 1.95; text-align: center; }
.pro-anchor { margin: 0 auto 56px; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 0; row-gap: 14px; }
.pro-anchor li { margin: 0; min-height: 54px; display: flex; align-items: center; border-left: 1px solid #d4dbe3; border-right: 1px solid #d4dbe3; }
.pro-anchor a { display: inline-flex; width: 100%; justify-content: center; align-items: center; gap: 8px; color: #0059a8; text-decoration: none; font-size: 15px; line-height: 1.65; font-weight: 700; padding: 16px 14px; text-align: center; }
.pro-anchor a::before { content: ""; width: 8px; height: 8px; border-right: 1px solid #8fa8bf; border-bottom: 1px solid #8fa8bf; transform: rotate(45deg); flex: 0 0 auto; }
.pro-anchor a:hover { text-decoration: none; opacity: 0.88; }
.pro-sec { padding-top: 4px; margin-bottom: 42px; }
.pro-row { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); gap: 30px; align-items: start; }
.pro-name { margin: 0 0 12px; font-size: clamp(26px, 2.4vw, 34px); line-height: 1.35; font-weight: 500; color: #1f2430; }
.pro-txt { margin: 0 0 12px; font-size: 15px; line-height: 1.95; color: #353d49; }
.pro-txt strong { color: #232a36; font-weight: 700; }
.pro-row figure { margin: 0; }
.pro-row img { width: 100%; height: auto; display: block; }
.pro-footer-space { height: 8px; }

.qtt-page { color: #1f2430; font-family: "Noto Sans SC", "Noto Sans JP", "Microsoft YaHei", sans-serif; line-height: 1.9; }
.qtt-shell { width: min(920px, calc(100% - 40px)); margin: 0 auto; }
.qtt-shell--narrow { width: min(760px, calc(100% - 40px)); margin: 0 auto; }
.qtt-title { margin: 34px 0 16px; font-size: clamp(32px, 3vw, 46px); line-height: 1.35; font-weight: 500; color: #202632; }
.qtt-mv { margin: 0 auto 18px; }
.qtt-mv img { width: 100%; height: auto; display: block; }
.qtt-lead { margin: 0 auto 40px; font-size: 15px; color: #353d49; line-height: 1.92; }
.qtt-center-title { margin: 0 0 14px; font-size: clamp(28px, 2.8vw, 38px); font-weight: 500; line-height: 1.4; text-align: center; }
.qtt-intro { margin: 0 auto 34px; font-size: 15px; color: #353d49; line-height: 1.92; text-align: center; }
.qtt-item { margin-bottom: 28px; }
.qtt-grid { display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(0, 0.94fr); gap: 24px; align-items: start; }
.qtt-name { margin: 0 0 8px; font-size: 20px; line-height: 1.4; font-weight: 500; color: #1f2430; }
.qtt-text { margin: 0; font-size: 15px; line-height: 1.9; color: #353d49; }
.qtt-figs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.qtt-figs--single { grid-template-columns: 1fr; max-width: 50%; }
.qtt-figs img { width: 100%; height: auto; display: block; }

@media (max-width: 900px) {
  .irx-cols,
  .irx-column-grid { grid-template-columns: 1fr; }
  .irx-mv { margin-bottom: 48px; }
  .irx-bar-title, .irx-subtitle { padding-left: 14px; }
  .irx-bar-title::before, .irx-subtitle::before { top: 8px; width: 5px; height: calc(100% - 14px); }
  .irx-column-box { padding: 34px 20px; }
  .irx-opt-name { font-size: 30px; }
  .irx-copy, .irx-text, .irx-opt-desc, .irx-column-text { font-size: 16px; line-height: 1.82; }
  .irx-bar-title, .irx-subtitle { font-size: clamp(26px, 7.2vw, 34px); }

  .alg-page-title { margin: 28px 0 14px; font-size: clamp(28px, 7.2vw, 36px); }
  .alg-mv { margin-bottom: 20px; }
  .alg-lead, .alg-text, .alg-row p { font-size: 14px; line-height: 1.88; }
  .alg-title-center { font-size: clamp(21px, 6.2vw, 27px); padding-top: 12px; margin-bottom: 12px; }
  .alg-title-sub { font-size: 17px; }
  .alg-row { grid-template-columns: 1fr; gap: 24px; margin-bottom: 52px; }
  .alg-text { margin-bottom: 30px; }
  .alg-lead { margin-bottom: 34px; }

  .pro-title { margin: 28px 0 14px; font-size: clamp(28px, 7.2vw, 36px); }
  .pro-mv { margin-bottom: 20px; }
  .pro-lead, .pro-txt { font-size: 14px; line-height: 1.88; }
  .pro-anchor { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 32px; row-gap: 10px; }
  .pro-anchor a { font-size: 16px; padding: 13px 10px; line-height: 1.65; gap: 6px; }
  .pro-anchor a::before { width: 7px; height: 7px; }
  .pro-row { grid-template-columns: 1fr; gap: 20px; }
  .pro-sec { margin-bottom: 34px; }

  .qtt-title { margin: 28px 0 14px; font-size: clamp(30px, 7.2vw, 36px); }
  .qtt-lead, .qtt-intro, .qtt-text { font-size: 14px; line-height: 1.86; }
  .qtt-center-title { font-size: clamp(24px, 6vw, 30px); }
  .qtt-grid { grid-template-columns: 1fr; gap: 16px; }
  .qtt-figs--single { max-width: 100%; }
}

/* 设计理念 dsi- */
.dsi-page { color: #1f2430; font-family: "Noto Sans SC", "Noto Sans JP", "Microsoft YaHei", sans-serif; line-height: 1.9; padding-bottom: 48px; }
.dsi-shell { width: min(980px, calc(100% - 40px)); margin: 0 auto; }
.dsi-shell--wide { width: min(1100px, calc(100% - 40px)); }
.dsi-shell--narrow { width: min(760px, calc(100% - 40px)); margin-left: auto; margin-right: auto; }
.dsi-mv { margin: 0 auto 36px; }
.dsi-mv img { width: 100%; height: auto; display: block; }
.dsi-title-l { margin: 48px 0 20px; font-size: clamp(28px, 2.8vw, 38px); font-weight: 500; line-height: 1.4; text-align: center; color: #202632; }
.dsi-text { margin: 0 auto 28px; font-size: 15px; color: #353d49; line-height: 2; text-align: center; }
/* 轮播：结构/样式对照 OPTEX c-sliderOuter（类名 dsi-） */
.dsi-slider-outer-wrap { margin: 8px auto 56px; padding: 0 12px; overflow: visible; }
@media (min-width: 768px) {
  .dsi-slider-outer-wrap { padding: 0 80px; }
}
.dsi-slider-outer { width: min(73.333vw, 760px); margin: 0 auto; position: relative; }
.dsi-slider { position: relative; }
.dsi-slider .slick-list {
  overflow: hidden;
  border: 1px solid #b5b5b5;
  background: #fff;
  box-sizing: border-box;
}
.dsi-slider .slick-slide { outline: none; }
.dsi-slide { box-sizing: border-box; }
.dsi-slide-img { display: block; width: 100%; height: auto; vertical-align: top; }
.dsi-slider-outer .slick-arrow {
  position: absolute;
  top: 50%;
  z-index: 3;
  overflow: hidden;
  display: block;
  width: 39px;
  height: 42px;
  padding: 0;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  background-size: 100% auto;
  font-size: 0;
  line-height: 0;
  text-indent: 100%;
  white-space: nowrap;
  transform: translateY(-50%);
  cursor: pointer;
}
.dsi-slider-outer .slick-arrow::before { display: none; }
.dsi-slider-outer .slick-arrow:hover { background-position: left bottom; }
.dsi-slider-outer .slick-prev {
  left: -68px;
  background-image: url(/css_com/images/yanfa/design/arr-slider-prev.png);
}
.dsi-slider-outer .slick-next {
  right: -68px;
  background-image: url(/css_com/images/yanfa/design/arr-slider-next.png);
}
.dsi-slider__counter {
  width: 72px;
  height: 28px;
  margin: 16px auto 0;
  border-radius: 14px;
  background-color: #ddd;
  color: #333;
  font-size: 14px;
  line-height: 28px;
  text-align: center;
  letter-spacing: 0.02em;
}
.dsi-cta { text-align: center; margin-top: 20px; padding-top: 8px; }
.dsi-cta-note { margin: 0 0 18px; font-size: 15px; color: #353d49; }
.dsi-cta-btn { display: inline-block; min-width: 280px; padding: 16px 28px; border: 1px solid #0059a8; border-radius: 4px; color: #0059a8; font-size: 15px; line-height: 1.6; text-decoration: none; font-weight: 700; transition: opacity 0.2s; }
.dsi-cta-btn:hover { opacity: 0.85; text-decoration: none; color: #0059a8; }

/* 设计流程 dsf- */
.dsf-page { color: #1f2430; font-family: "Noto Sans SC", "Noto Sans JP", "Microsoft YaHei", sans-serif; line-height: 1.9; padding-bottom: 48px; }
.dsf-shell { width: min(980px, calc(100% - 40px)); margin: 0 auto; }
.dsf-shell--wide { width: min(1100px, calc(100% - 40px)); }
.dsf-shell--narrow { width: min(760px, calc(100% - 40px)); margin-left: auto; margin-right: auto; }
.dsf-mv { margin: 0 auto 32px; }
.dsf-mv img { width: 100%; height: auto; display: block; }
.dsf-title-l { margin: 40px 0 18px; font-size: clamp(28px, 2.8vw, 38px); font-weight: 500; line-height: 1.4; text-align: center; color: #202632; }
.dsf-title-l--sub { margin-top: 56px; }
.dsf-lead { margin: 0 auto 40px; padding: 22px 24px; border: 1px solid #c5cad3; font-size: 15px; color: #353d49; line-height: 2; text-align: center; }
.dsf-step { margin-bottom: 8px; }
.dsf-title-m,
.dsf-tag {
  position: relative;
  padding-left: 24px;
  font-weight: 700;
  line-height: 1.35;
  color: #1f2430;
}
.dsf-title-m {
  margin: 36px 0 22px;
  font-size: clamp(22px, 2.2vw, 30px);
}
.dsf-title-m::before,
.dsf-tag::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  width: 6px;
  height: calc(100% - 7px);
  border-radius: 0 3px 0 3px;
  background: #05a;
}
.dsf-row { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr); gap: 30px; align-items: start; margin-bottom: 36px; }
.dsf-tag {
  margin: 0 0 10px;
  font-size: clamp(18px, 2vw, 24px);
  color: #232935;
}
.dsf-tag + .dsf-text { margin-top: 0; }
.dsf-text + .dsf-tag { margin-top: 18px; }
.dsf-text { margin: 0 0 20px; font-size: 15px; color: #353d49; line-height: 2; }
.dsf-pic { margin: 0; }
.dsf-pic img { width: 100%; height: auto; display: block; }
.dsf-pic figcaption { margin-top: 10px; font-size: 13px; color: #5a6270; line-height: 1.5; }
.dsf-cta { text-align: center; margin-top: 24px; }
.dsf-cta-note { margin: 0 0 18px; font-size: 15px; color: #353d49; }
.dsf-cta-btn { display: inline-block; min-width: 280px; padding: 16px 28px; border: 1px solid #0059a8; border-radius: 4px; color: #0059a8; font-size: 15px; line-height: 1.6; text-decoration: none; font-weight: 700; transition: opacity 0.2s; }
.dsf-cta-btn:hover { opacity: 0.85; text-decoration: none; color: #0059a8; }

/* 设计理念 / 设计流程 — 平板及以下 */
@media (max-width: 900px) {
  .dsi-page, .dsf-page { padding-bottom: 36px; }
  .dsi-shell, .dsi-shell--wide, .dsi-shell--narrow,
  .dsf-shell, .dsf-shell--wide, .dsf-shell--narrow {
    width: calc(100% - 32px);
  }
  .dsi-mv { margin-bottom: 28px; }
  .dsf-mv { margin-bottom: 24px; }
  .dsi-title-l, .dsf-title-l {
    margin: 36px 0 16px;
    font-size: clamp(22px, 5.5vw, 28px);
    line-height: 1.45;
  }
  .dsf-title-l--sub { margin-top: 40px; }
  .dsi-text, .dsf-lead, .dsf-text {
    font-size: 14px;
    line-height: 1.88;
  }
  .dsf-lead { margin-bottom: 32px; padding: 16px 18px; }
  .dsf-title-m,
  .dsf-tag { padding-left: 20px; }
  .dsf-title-m {
    margin: 28px 0 16px;
    font-size: clamp(18px, 4.8vw, 24px);
    line-height: 1.5;
  }
  .dsf-title-m::before,
  .dsf-tag::before {
    top: 0.1em;
    width: 5px;
    height: 1.35em;
  }
  .dsf-tag { font-size: clamp(16px, 4.2vw, 18px); margin-bottom: 8px; }
  .dsf-row {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-bottom: 28px;
  }
  .dsf-pic figcaption { font-size: 12px; line-height: 1.55; }
  .dsi-cta-btn, .dsf-cta-btn { min-width: 0; width: 100%; max-width: 360px; }
}

/* 手机端 */
@media (max-width: 767px) {
  .dsi-page, .dsf-page { padding-bottom: 28px; overflow-x: hidden; }
  .dsi-shell, .dsi-shell--wide, .dsi-shell--narrow,
  .dsf-shell, .dsf-shell--wide, .dsf-shell--narrow {
    width: calc(100% - 24px);
  }
  .dsi-mv { margin-bottom: 22px; }
  .dsf-mv { margin-bottom: 20px; }
  .dsi-title-l, .dsf-title-l {
    margin: 28px 0 14px;
    font-size: 20px;
    word-break: break-word;
  }
  .dsf-title-l--sub { margin-top: 32px; }
  .dsi-text {
    margin-bottom: 18px;
    font-size: 14px;
    line-height: 1.85;
    text-align: left;
  }
  .dsf-lead {
    margin-bottom: 24px;
    padding: 14px 16px;
    font-size: 14px;
    line-height: 1.85;
    text-align: left;
  }
  .dsf-title-m,
  .dsf-tag { padding-left: 16px; }
  .dsf-title-m {
    margin: 24px 0 14px;
    font-size: 17px;
    word-break: break-word;
  }
  .dsf-title-m::before,
  .dsf-tag::before {
    top: -0.1em;
    width: 4px;
    height: 1.4em;
  }
  .dsf-tag { font-size: 16px; margin-bottom: 6px; }
  .dsf-text + .dsf-tag { margin-top: 14px; }
  .dsf-text {
    font-size: 14px;
    line-height: 1.85;
    margin-bottom: 16px;
  }
  .dsf-row { gap: 14px; margin-bottom: 24px; }
  .dsf-pic figcaption { margin-top: 8px; font-size: 12px; }

  /* 轮播：全宽 + 箭头叠在图内，避免横向溢出 */
  .dsi-slider-outer-wrap {
    width: calc(100% - 24px);
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    margin-bottom: 40px;
  }
  .dsi-slider-outer { width: 100%; max-width: 100%; }
  .dsi-slider-outer .slick-arrow {
    width: 32px;
    height: 34px;
    background-color: rgba(255, 255, 255, 0.85);
    border-radius: 2px;
  }
  .dsi-slider-outer .slick-prev { left: 6px; }
  .dsi-slider-outer .slick-next { right: 6px; }
  .dsi-slider__counter {
    width: 64px;
    height: 26px;
    margin-top: 14px;
    border-radius: 13px;
    font-size: 12px;
    line-height: 26px;
  }
}

@media (max-width: 480px) {
  .dsi-shell, .dsi-shell--wide, .dsi-shell--narrow,
  .dsf-shell, .dsf-shell--wide, .dsf-shell--narrow,
  .dsi-slider-outer-wrap {
    width: calc(100% - 16px);
  }
  .dsi-title-l, .dsf-title-l { font-size: 18px; }
  .dsf-title-m,
  .dsf-tag { padding-left: 14px; }
  .dsf-title-m { font-size: 16px; }
  .dsf-tag { font-size: 15px; }
  .dsi-slider-outer .slick-arrow { width: 28px; height: 30px; }
}
