/* 全局重置 + 基础 */
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    body {
      background: url(/css/2018/images/zxidx_bg_01.jpg) no-repeat center top #0a0905 !important;
      font-family: 'pingfang SC', 'helvetica neue', arial, 'hiragino sans gb', 'microsoft yahei ui', 'microsoft yahei', simsun, sans-serif !important;
      color: #666;
      overflow-x: hidden;
    }
    ul,
    li {
      list-style: none;
    }
    img {
      vertical-align: middle;
      border: none;
      max-width: 100%;
      height: auto;
    }
    a {
      text-decoration: none;
      outline: none;
    }
    a:hover {
      text-decoration: none;
    }
    .clear {
      clear: both;
    }
    i {
      font-style: normal;
    }

    /* 所有容器以zxidx为前缀，最大宽度1350px */
    .zxidx-container {
      max-width: 1350px;
      margin: 0 auto;
      padding: 0 15px;
    }

    /* 通用圆角10px */
    .zxidx-card,
    .zxidx-btn,
    .zxidx-card img,
    .zxidx-card .card,
    .zxidx-btn,
    .zxidx-card .card-img-top,
    .zxidx-card .card-body {
      border-radius: 10px !important;
    }

    /* hover 效果 */
    .zxidx-card-hover {
      transition: all 0.25s ease;
    }
    .zxidx-card-hover:hover {
      transform: translateY(-6px);
      box-shadow: 0 12px 28px rgba(0, 0, 0, 0.5);
      border-color: #28b557;
    }
    .zxidx-btn-hover {
      transition: all 0.2s ease;
      border-radius: 10px;
    }
    .zxidx-btn-hover:hover {
      background: #28b557 !important;
      border-color: #28b557 !important;
      color: #fff !important;
      transform: scale(1.02);
      box-shadow: 0 8px 20px rgba(40, 181, 87, 0.4);
    }

    /**********头图样式*************/
    .zxidx-box {
      text-align: center;
      padding: 20px 0 0;
    }
    .zxidx-top img {
      display: block;
      margin: 0 auto;
      position: relative;
      left: 50px;
      max-width: 90%;
    }
    .zxidx-top2 img {
      display: block;
      margin: 0 auto;
      position: relative;
      top: -90px;
      max-width: 90%;
    }

    /**********专题汇总样式 - 修复移动端适配 *************/
    .zxidx-zthz {
      width: 100%;
      margin: 0 auto;
    }
    .zxidx-tle {
      width: 100%;
      background: url(/css/2018/images/zxidx_tle.png) no-repeat center bottom;
      height: 96px;
      background-size: auto 100%;
    }
    .zthz-con {
      max-width: 1200px;
      margin: 0 auto;
      margin-top: 54px;
      padding-bottom: 30px;
    }
    .zthz-cn {
      width: 95%;
      background: url(/css/2018/images/zxidx_2px.jpg) repeat-y 43px top;
      padding-top: 40px;
      overflow: hidden;
      margin: 0 auto;
    }
    .zthz-cn dl {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-start;
      justify-content: flex-start;
      margin-bottom: 30px;
    }
    .zthz-cn dt {
      flex: 0 0 auto;
      margin-right: 90px;
      margin-top: 64px;
    }
    .zthz-cn dd {
      flex: 0 0 auto;
      margin-right: 12%;
      margin-bottom: 55px;
    }
    .zthz-cn dd:last-child {
      margin-right: 0;
    }
    .zthz-rq {
      width: 76px;
      height: 76px;
      border: 7px solid #b29640;
      border-radius: 50%;
      background: #f7f2e3;
      color: #df1111;
      line-height: 65px;
      text-align: center;
      font-size: 24px;
      font-family: Arial, Helvetica, sans-serif;
      flex-shrink: 0;
    }
    .zthz-rq2 {
      width: 76px;
      height: 76px;
      border: 7px solid #908c75;
      border-radius: 50%;
      background: #f7f2e3;
      color: #353535;
      line-height: 65px;
      text-align: center;
      font-size: 24px;
      font-family: Arial, Helvetica, sans-serif;
      flex-shrink: 0;
    }
    .zthz-zt {
      width: 358px;
      max-width: 100%;
      height: 248px;
      border: 1px solid #b1915e;
      background: url(/css/2018/images/zxidx_ztbg_04.jpg) no-repeat center top;
      background-size: cover;
      text-align: center;
      padding-top: 20px;
      transition: all 0.3s ease;
      border-radius: 10px;
    }
    .zthz-zt img {
      display: block;
      margin: 0 auto;
      max-width: 90%;
      max-height: 200px;
    }
    .zthz-tx a {
      display: block;
      text-align: center;
      font-size: 24px;
      color: #dcca84;
      margin-top: 20px;
      transition: all 0.3s ease;
    }
    .zthz-cn dd:hover .zthz-zt {
      box-shadow: 0px 0px 30px #554a1c;
      border: 1px solid #cba15f;
    }
    .zthz-cn dd:hover a {
      color: #fff5cb;
      text-decoration: underline;
    }

    /**********直销解决方案样式*************/
    .zxidx-box2 {
      width: 100%;
      background: url(/css/2018/images/zxidx_bg_02.jpg) no-repeat center top;
      padding-top: 60px;
      padding-bottom: 60px;
    }
    .zxidx-tle2 {
      width: 100%;
      background: url(/css/2018/images/zxidx_tle2.png) no-repeat center bottom;
      height: 96px;
      background-size: auto 100%;
    }
    .zxidx-jjtx {
      text-align: center;
      max-width: 845px;
      margin: 55px auto 0;
      padding: 0 15px;
    }
    .zxidx-jjtx a {
      font-size: 18px;
      color: #a38255;
      line-height: 30px;
    }
    .zxidx-jjtx a:hover {
      color: #dcca84;
    }
    .zxidx-jjtx span {
      color: #dcca84;
    }
    .zxidx-btn {
      max-width: 370px;
      height: 50px;
      margin: 50px auto 0;
      background: url(/css/2018/images/zxidx_btn.png) no-repeat center;
      background-size: cover;
      border-radius: 10px;
      transition: all 0.3s ease;
    }
    .zxidx-btn a {
      display: block;
      font-size: 24px;
      line-height: 53px;
      color: #ffe093;
      text-align: center;
      border-radius: 10px;
    }
    .zxidx-btn:hover {
      transform: scale(1.03);
    }
    .zxidx-btn:hover a {
      color: #fff;
    }

    /**********直销行业企业安全选择样式 - 修复hover图片路径 *************/
    .zxidx-box3 {
      width: 100%;
      margin: 0 auto;
    }
    .zxidx-tle3 {
      width: 100%;
      background: url(/css/2018/images/zxidx_tle3.png) no-repeat center bottom;
      height: 96px;
      background-size: auto 100%;
      padding-top: 60px;
    }
    .wuh-khlg {
      max-width: 1200px;
      margin: 50px auto 0;
      padding: 15px 0;
    }
    .wuh-khlg ul {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
      margin-bottom: 10px;
      padding: 0;
    }
    .wuh-khlg li {
      flex: 0 0 calc(20% - 10px);
      min-width: 100px;
      height: 95px;
      border: 1px solid #b1915e;
      border-radius: 10px;
      cursor: pointer;
      background-position: center !important;
      background-repeat: no-repeat !important;
      transition: all 0.3s ease;
    }
    .wuh-khlg li:hover {
      border: 1px solid #fff;
      box-shadow: 0px 0px 15px #eec693;
    }
    /* 修复hover图片路径 - 使用正确的图片名称 */
    .khlg_01:hover { background: url(/css/2018/images/wuh_khanl01.png) no-repeat center #FFF !important;  }
    .khlg_02:hover { background: url(/css/2018/images/wuh_khanl02.png) no-repeat center #FFF !important;  }
    .khlg_03:hover { background: url(/css/2018/images/wuh_khanl03.png) no-repeat center #FFF !important;  }
    .khlg_04:hover { background: url(/css/2018/images/wuh_khanl04.png) no-repeat center #FFF !important;  }
    .khlg_05:hover { background: url(/css/2018/images/wuh_khanl05.png) no-repeat center #FFF !important;  }
    .khlg_06:hover { background: url(/css/2018/images/wuh_khanl06.png) no-repeat center #FFF !important;  }
    .khlg_07:hover { background: url(/css/2018/images/wuh_khanl07.png) no-repeat center #FFF !important;  }
    .khlg_08:hover { background: url(/css/2018/images/wuh_khanl08.png) no-repeat center #FFF !important;  }
    .khlg_09:hover { background: url(/css/2018/images/wuh_khanl09.png) no-repeat center #FFF !important;  }
    .khlg_10:hover { background: url(/css/2018/images/wuh_khanl010.png) no-repeat center #FFF !important;  }
    .khlg_11:hover { background: url(/css/2018/images/wuh_khanl011.png) no-repeat center #FFF !important;  }
    .khlg_12:hover { background: url(/css/2018/images/wuh_khanl012.png) no-repeat center #FFF !important;  }
    .khlg_13:hover { background: url(/css/2018/images/wuh_khanl013.png) no-repeat center #FFF !important;  }
    .khlg_14:hover { background: url(/css/2018/images/wuh_khanl014.png) no-repeat center #FFF !important;  }
    .khlg_15:hover { background: url(/css/2018/images/wuh_khanl015.png) no-repeat center #FFF !important;  }
    .khlg_16:hover { background: url(/css/2018/images/wuh_khanl016.png) no-repeat center #FFF !important;  }
    .khlg_17:hover { background: url(/css/2018/images/wuh_khanl017.png) no-repeat center #FFF !important;  }
    .khlg_18:hover { background: url(/css/2018/images/wuh_khanl018.png) no-repeat center #FFF !important;  }
    .khlg_19:hover { background: url(/css/2018/images/wuh_khanl019.png) no-repeat center #FFF !important;  }
    .khlg_20:hover { background: url(/css/2018/images/wuh_khanl020.png) no-repeat center #FFF !important;  }

    .khal-btn {
      margin-top: 50px;
      margin-bottom: 60px;
      text-align: center;
    }
    .khal-btn a {
      display: inline-block;
      height: 45px;
      line-height: 45px;
      padding: 0 30px;
      background: url(/css/2018/images/zxidx_btn2.png) no-repeat center;
      background-size: cover;
      width: 180px;
      text-align: center;
      color: #ffe093;
      font-size: 20px;
      border-radius: 10px;
      transition: all 0.3s ease;
    }
    .khal-btn a:hover {
      color: #fff;
      transform: scale(1.03);
    }

    /**********直销行业企业安全选择样式*************/
    .zxidx-box4 {
      width: 100%;
      margin: 0 auto;
      background: url(/css/2018/images/zxidx_ztbg_03.jpg) no-repeat center bottom;
      background-size: cover;
      padding-top: 60px;
      padding-bottom: 80px;
    }
    .zxidx-tle4 {
      width: 100%;
      background: url(/css/2018/images/zxidx_tle4.png) no-repeat center bottom;
      height: 141px;
      background-size: auto 100%;
    }
    .zxidx-new {
      max-width: 1200px;
      margin: 100px auto 0;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 30px;
      padding: 0 15px;
    }
    .zxidx-new dl {
      display: block;
      width: 100%;
    }
    .zxidx-new dt:hover .zxnew-zt {
      box-shadow: 0px 0px 20px #7b5f09;
    }
    .zxnew-zt {
      border-radius: 10px;
      overflow: hidden;
      transition: all 0.3s ease;
    }
    .zxnew-zt img {
      width: 100%;
      height: auto;
      display: block;
    }
    .zxnew-tx a {
      display: block;
      font-size: 18px;
      height: 50px;
      line-height: 50px;
      background: #8a7147;
      text-align: center;
      color: #fff;
      transition: all 0.3s ease;
      border-radius: 0 0 10px 10px;
    }
    .zxnew-tx a:hover {
      background: #e9d29e;
      color: #291c07;
    }
    .zxidx-new dd {
      margin-top: 25px;
      padding-left: 5px;
    }
    .zxidx-new dd a {
      line-height: 32px;
      color: #a38255;
      font-size: 18px;
      display: block;
      transition: all 0.3s ease;
    }
    .zxidx-new dd a:hover {
      color: #dcca84;
    }

    /**********移动端适配 - 专题汇总完美适配 **********/
    @media (max-width: 1199px) {
      .zthz-cn dl {
        justify-content: center;
      }
      .zthz-cn dt {
        margin-right: 40px;
        margin-top: 30px;
      }
      .zthz-cn dd {
        margin-right: 6%;
        margin-bottom: 30px;
      }
      .zthz-zt {
        width: 280px;
        height: 200px;
      }
      .zxidx-new {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
      }
    }

    @media (max-width: 991px) {
      .zxidx-top img {
        left: 0;
      }
      .zxidx-top2 img {
        top: -40px;
      }
      .zthz-cn {
        background: none;
        width: 100%;
      }
      .zthz-cn dl {
        flex-direction: column;
        align-items: center;
        width: 100%;
      }
      .zthz-cn dt {
        margin-right: 0;
        margin-top: 20px;
        margin-bottom: 10px;
      }
      .zthz-cn dd {
        margin-right: 0;
        margin-bottom: 30px;
        width: 100%;
        max-width: 320px;
      }
      .zthz-zt {
        width: 100%;
        height: 200px;
        max-width: 320px;
      }
      .zthz-zt img {
        max-height: 150px;
      }
      .zthz-tx a {
        font-size: 20px;
      }
      .wuh-khlg li {
        flex: 0 0 calc(20% - 10px);
        min-width: 80px;
        height: 80px;
      }
    }

    @media (max-width: 767px) {
      .zxidx-top img {
        max-width: 70%;
        left: 0;
      }
      .zxidx-top2 img {
        max-width: 85%;
        top: -20px;
      }
      .zxidx-tle,
      .zxidx-tle2,
      .zxidx-tle3,
      .zxidx-tle4 {
        background-size: contain;
        height: 60px;
      }
      .zthz-con {
        margin-top: 20px;
        padding-bottom: 10px;
      }
      .zthz-cn {
        padding-top: 10px;
      }
      .zthz-cn dl {
        margin-bottom: 10px;
      }
      .zthz-cn dt {
        margin-top: 10px;
      }
      .zthz-cn dd {
        max-width: 280px;
        margin-bottom: 25px;
      }
      .zthz-zt {
        height: 170px;
        max-width: 280px;
        padding-top: 15px;
      }
      .zthz-zt img {
        max-height: 120px;
      }
      .zthz-tx a {
        font-size: 18px;
        margin-top: 15px;
      }
      .zxidx-jjtx {
        margin-top: 30px;
      }
      .zxidx-jjtx a {
        font-size: 16px;
        line-height: 26px;
      }
      .zxidx-btn {
        max-width: 280px;
        height: 44px;
        margin-top: 30px;
      }
      .zxidx-btn a {
        font-size: 18px;
        line-height: 44px;
      }
      .wuh-khlg li {
        flex: 0 0 calc(33.33% - 10px);
        min-width: 70px;
        height: 70px;
        background-size: auto 60% !important;
      }
      .wuh-khlg li:hover {
        background-size: auto 60% !important;
      }
      .zxidx-new {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-top: 40px;
      }
      .zxidx-box2 {
        padding-top: 30px;
        padding-bottom: 30px;
      }
      .zxidx-box4 {
        padding-top: 30px;
        padding-bottom: 40px;
      }
      .khal-btn {
        margin-top: 30px;
        margin-bottom: 30px;
      }
      .khal-btn a {
        width: 160px;
        height: 40px;
        line-height: 40px;
        font-size: 16px;
      }
    }

    @media (max-width: 480px) {
      .zxidx-top img {
        max-width: 60%;
      }
      .zxidx-top2 img {
        max-width: 75%;
        top: -10px;
      }
      .wuh-khlg li {
        flex: 0 0 calc(50% - 10px);
        min-width: 60px;
        height: 60px;
        background-size: auto 50% !important;
      }
      .wuh-khlg li:hover {
        background-size: auto 50% !important;
      }
      .zthz-cn dd {
        max-width: 240px;
      }
      .zthz-zt {
        height: 150px;
        max-width: 240px;
        padding-top: 10px;
      }
      .zthz-zt img {
        max-height: 100px;
      }
      .zthz-tx a {
        font-size: 16px;
        margin-top: 10px;
      }
      .zxidx-jjtx a {
        font-size: 14px;
        line-height: 22px;
      }
      .zxidx-btn {
        max-width: 220px;
        height: 38px;
      }
      .zxidx-btn a {
        font-size: 15px;
        line-height: 38px;
      }
      .zxnew-tx a {
        font-size: 15px;
        height: 42px;
        line-height: 42px;
      }
      .zxidx-new dd a {
        font-size: 15px;
        line-height: 28px;
      }
    }