#contentpayment{
  width: 100%;
  height: auto;
}
/* 走马灯 */
.ant-carousel >>> .slick-slide {
    text-align: center;
    height: 100%;
    background: transparent;
    overflow: hidden;
  }
  
  .ant-carousel >>> .custom-slick-arrow {
    width: 25px;
    height: 25px;
    font-size: 35px;
    color: #fff;
    background-color: transparent;
    opacity: 0.3;
  }
  .ant-carousel >>> .custom-slick-arrow:before {
    display: none;
  }
  .ant-carousel >>> .custom-slick-arrow:hover {
    opacity: 0.5;
  }
  
  .ant-carousel >>> .slick-slide p {
    text-align: center;
    color: #fff;
  }
  .ant-carousel >>> .slick-slide p > img {
    width: 249px;
    height: 486px;
  }
  .lunboimg{
      width: auto;
      text-align: center;
  
  }
  .lunboimg>img{
      width: 100%;
      height: 100%;
      height: auto;
      margin: 0;
      padding:54px 20px;
  }
  .contpay_one {
    width: 100%;
    height: 560px;
    background-color: white;
  }
  .contpay_one_top {
    width: 100%;
    height: 387px;
    background: linear-gradient(50deg, #e52d25, #fc4f48);
    display: flex;
    justify-content: center;
  }
  .contpay_one_top_kuan {
    width: 1200px;
    height: 100%;
    /* background-color: burlywood; */
    display: flex;
    justify-content: flex-start;
  }
  .contpay_one_top_left {
    width: 635px;
    height: 100%;
    /* background-color: darkseagreen; */
  }
  .contpay_one_top_right {
    width: 604px;
    height: 100%;
    /* background-color: coral; */
  }
  .contpay_one_topimg {
    text-align: center;
    padding-top: 18px;
  }
  .contpay_one_top_tit {
    font-size: 52px;
    color: white;
    margin: 0;
    padding-top: 88px;
  }
  .contpay_one_top_deco {
    margin: 0;
    padding-top: 5px;
  }
  .contpay_one_top_deco button {
    border-radius: 6px;
    background-color: #ef5b54;
    color: #b6221b;
    font-size: 14px;
    outline: none;
    border: 0;
    margin: 0;
  }
  .contpay_one_top_dect {
    font-size: 18px;
    color: white;
    margin: 0;
    padding-top: 22px;
  }
  .contpay_one_top_btn {
    margin: 0;
    padding-top: 32px;
  }
  .cp_zixun_btn {
    font-size: 19px;
    color: white;
    margin: 0;
    padding: 10px 46px;
    background-color: transparent;
    border: 1px solid white;
    outline: none;
    border-radius: 6px;
  }
  .cper {
    width: 100%;
    height: 915px;
    /* background-color: darkcyan; */
    display: flex;
    justify-content: center;
  }
  .cper_kuan {
    width: 1200px;
    height: 100%;
    /* background-color: salmon; */
  }
  .cper_tit{
      font-size: 38px;
      text-align: center;
      margin: 0;
      padding-top: 8px;
  }
  .cper_dec{
      font-size: 16px;
      color: #808080;
      text-align: center;
      margin: 0;
      padding: 20px 427px 37px;
      /* background-color: saddlebrown; */
  }
  .cper_content{
      width: 100%;
      height: 701px;
      /* background-color: seagreen; */
      display: flex;
      justify-content: flex-start;
  }
  .cperzhengti{
      width: 100%;
      text-align: center;
      padding-top: 20px;
  }
  
  .cpsan {
    width: 100%;
    height: 626px;
    /* background-color: darkgoldenrod; */
    display: flex;
    justify-content: center;
  }
  .cpsan_kuan {
    width: 1200px;
    height: 100%;
    /* background-color: saddlebrown; */
  }
  .cpsan_tit {
    font-size: 38px;
    text-align: center;
    margin: 0;
    padding-top: 28px;
  }
  .cpsan_dec {
    margin: 0;
    padding: 0 317px;
    font-size: 16px;
    color: #808080;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 46px;
  }
  .cpsan_kuan>ul {
    width: 100%;
    height: 361px;
    background-color: white;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
  }             
  
  .cpsan_kuan>ul>li {
    width: 289px;
    height: 100%;
    border: 2px solid #e6e6e6;
    box-shadow: -3px 0 3px #f5f5f5, /*左边阴影*/ 3px 0 3px #f5f5f5,
      /*右边阴影*/ 0 -3px 3px #f5f5f5, /*顶部阴影*/ 0 5px 5px #f5f5f5; /*底边阴影*/
  } 
  .cpsan_kuan>ul>li:hover{
    cursor: pointer;
  }
  .cpsan_kuan>ul>li:hover .cpsan_cont{
    color: red;
  }
  .cpsan_tuyi {
    width: 100%;
    text-align: center;
    height: 262px;
    background-image: url("../img/cpsanimg1.png");
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
  }
  .cpsan_tuyishow{
    position:absolute;
    width: 289px;
    height: 262px;
    background:rgba(0,0,0,0.3);
    top:262px;
    transition: all 0.5s ease-in 0s;
  }
  .cpsan_kuan>ul>li:hover .cpsan_tuyishow{
    top:0;
    position: absolute;
  }
  .cpsan_tushow_img{
    width: 100%;
    text-align: center;
    height: 180px;
    padding-top: 58px;
    background-color: transparent;
  }
  .cpsan_tushow_font{
    text-align: center;
    color: white;
    font-size: 24px;
    margin: 0;
    padding: 0;
  }
  .cpsan_tuyishow:hover .cpsan_tushow_font{
    color: red;
  }
  .cpsan_tuershow:hover .cpsan_tushow_font{
    color: red;
  }
  .cpsan_tusanshow:hover .cpsan_tushow_font{
    color: red;
  }
  .cpsan_tusishow:hover .cpsan_tushow_font{
    color: red;
  }
  .cpsan_tuer {
    width: 100%;
    text-align: center;
    height: 262px;
    background-image: url("../img/cpsanimg2.png");
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
  }
  .cpsan_tuershow{
    position:absolute;
    width: 289px;
    height: 262px;
    background:rgba(0,0,0,0.3);
    top:-262px;
    transition: all 0.5s ease-in 0s;
  }
  .cpsan_kuan>ul>li:hover .cpsan_tuershow{
    top:0;
    position: absolute;
  }

  .cpsan_tusan {
    width: 100%;
    text-align: center;
    height: 262px;
    background-image: url("../img/cpsanimg3.png");
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
  }
  .cpsan_tusanshow{
    position:absolute;
    width: 289px;
    height: 262px;
    background:rgba(0,0,0,0.3);
    top:262px;
    transition: all 0.5s ease-in 0s;
  }
  .cpsan_kuan>ul>li:hover .cpsan_tusanshow{
    top:0;
    position: absolute;
  }
  .cpsan_tusi {
    width: 100%;
    text-align: center;
    height: 262px;
    background-image: url("../img/cpsanimg4.png");
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
  }
  .cpsan_tusishow{
    position:absolute;
    width: 289px;
    height: 262px;
    background:rgba(0,0,0,0.3);
    top:-262px;
    transition: all 0.5s ease-in 0s;
  }
  .cpsan_kuan>ul>li:hover .cpsan_tusishow{
    top:0;
    position: absolute;
  }

  .cpsan_cont {
    text-align: center;
    padding: 15px 50px 0;
    font-size: 18px;
    color: #808080;
  }
  .cpsi {
    width: 100%;
    height: 667px;
    background-color: #fa4f4a;
    display: flex;
    justify-content: center;
  }
  .cpsi_kuan {
    width: 1200px;
    height: 100%;
    background-color: transparent;
    display: flex;
    justify-content: flex-start;
  }
  .cpsi_lunbo {
    width: 629px;
    height: 100%;
    /* background-color: rosybrown; */
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .cpsi_lunboimg {
    width: 265px;
    height: auto;
    background-color: transparent;
  }
  .cpsi_kong {
    width: 37px;
    height: 100%;
    /* background-color: green; */
  }
  .cpsi_content {
    width: 501px;
    height: 100%;
    /* background-color: slategray; */
  }
  .cpsi_content ul {
    width: 100%;
    height: 264px;
    /* background-color: sandybrown; */
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  
  .cpsi_content ul li {
    width: 101px;
    height: auto;
    margin-top: 32px;
    border: 1px solid #fa4f4a;
    border-radius: 6px;
  }
  .cpsi_content ul li:hover {
    background-color: white;
    border: 1px solid #ccc;
    cursor: pointer;
    color: red;
  }
  .cpsi_content ul li:hover .cpsi_tit {
    color: red;
  }
  .erweima {
    width: 144px;
    text-align: center;
    height: 144px;
    line-height: 144px;
    /* background-color: firebrick; */
    margin-top: 38px;
  }
  .cpsi_saoma {
    text-indent: 20px;
    color: white;
    margin: 0;
    padding-top: 15px;
    font-size: 16px;
  }
  .cpsi_showtit {
    color: white;
    font-size: 38px;
    margin: 0;
    padding-top: 44px;
    padding-bottom: 16px;
    /* background-color: skyblue; */
  }
  .cpsiimg {
    width: 100%;
    text-align: center;
    height: 65px;
    line-height: 65px;
    margin: 0;
    background-position: center;
    background-repeat: no-repeat;
  }

  .cpsiimg.img1{
    background-image: url(../img/cpsiimg1.png);
    background-size: contain;
  }
  .cpsi_content ul li:hover .cpsiimg.img1 {
    background-image: url(../img/cpsiimg1_1.png);
    background-size: contain;
  }
  .cpsiimg.img2{
    background-image: url(../img/cpsiimg2.png);
    background-size: contain;
  }
  .cpsi_content ul li:hover .cpsiimg.img2 {
    background-image: url(../img/cpsiimg2_2.png);
    background-size: contain;
  }
  .cpsiimg.img3{
    background-image: url(../img/cpsiimg3.png);
    background-size: contain;
  }
  .cpsi_content ul li:hover .cpsiimg.img3 {
    background-image: url(../img/cpsiimg3_3.png);
    background-size: contain;
  }
  .cpsiimg.img4{
    background-image: url(../img/cpsiimg4.png);
    background-size: contain;
  }
  .cpsi_content ul li:hover .cpsiimg.img4 {
    background-image: url(../img/cpsiimg4_4.png);
    background-size: contain;
  }
  .cpsiimg.img5{
    background-image: url(../img/cpsiimg5.png);
    background-size: contain;
  }
  .cpsi_content ul li:hover .cpsiimg.img5 {
    background-image: url(../img/cpsiimg5_5.png);
    background-size: contain;
  }
  .cpsiimg.img6{
    background-image: url(../img/cpsiimg6.png);
    background-size: contain;
  }
  .cpsi_content ul li:hover .cpsiimg.img6 {
    background-image: url(../img/cpsiimg6_6.png);
    background-size: contain;
  }
  .cpsiimg.img7{
    background-image: url(../img/cpsiimg7.png);
    background-size: contain;
  }
  .cpsi_content ul li:hover .cpsiimg.img7 {
    background-image: url(../img/cpsiimg7_7.png);
    background-size: contain;
  }
  .cpsiimg.img8{
    background-image: url(../img/cpsiimg8.png);
    background-size: contain;
  }
  .cpsi_content ul li:hover .cpsiimg.img8 {
    background-image: url(../img/cpsiimg8_8.png);
    background-size: contain;
  }

  .cpsi_tit {
    font-size: 16px;
    color: white;
    text-align: center;
    margin: 0;
  }
  .cpwu {
    width: 100%;
    height: 648px;
    background-color: #f6f6f9;
    display: flex;
    justify-content: center;
  }
  .cpwu_kuan {
    width: 1200px;
    height: 100%;
    /* background-color: darkcyan; */
    display: flex;
    justify-content: center;
  }
  .cpwu_kong {
    width: 67px;
    height: 100%;
    /* background-color: firebrick; */
  }
  .cpwu_cont {
    flex-grow: 1;
    width: auto;
    height: 100%;
    /* background-color: salmon; */
  }
  .cpwu_tityi {
    font-size: 38px;
    margin: 0;
    padding-top: 185px;
  }
  .cpwu_titer {
    font-size: 38px;
    margin: 0;
  }
  .cpwu_tu {
    width: 618px;
    text-align: center;
    align-self: center;
    /* background-color: darkkhaki; */
  }
  .cpwu_dec {
    font-size: 16px;
    color: #808080;
    width: 359px;
    height: auto;
    padding-top: 23px;
  }
  .cpliu {
    width: 100%;
    height: 709px;
    /* background-color: saddlebrown; */
    display: flex;
    justify-content: center;
  }
  .cpliu_kuan {
    width: 1200px;
    height: 100%;
    /* background-color: salmon; */
  }
  .cpliu_tit {
    font-size: 38px;
    text-align: center;
    margin: 0;
    padding-top: 40px;
  }
  .cpliu_dec {
    font-size: 16px;
    text-align: center;
    margin: 0;
    color: #808080;
    padding-top: 18px;
  }
  .cpliuimg {
    text-align: center;
    padding-top: 70px;
  }
  
  .ptsix {
    width: 100%;
    height: 191px;
    background-color: #fffdfd;
    display: flex;
    justify-content: center;
  }
  .ptsix_kuan {
    border-top: 2px solid #e0e2e5;
    width: 1200px;
    height: 100%;
    /* background-color: burlywood; */
  }
  .ptsix_tit {
    font-size: 14px;
    text-align: center;
    margin: 0;
    padding-top: 35px;
  }
  .xiaochengxu {
    color: red;
  }
  .xiaochengxu:hover {
    cursor: pointer;
    color: black;
  }
  .ptsix_btn {
    text-align: center;
    margin: 0;
    padding-top: 26px;
  }
  .btn_zixun {
    font-size: 16px;
    color: white;
    padding: 10px 36px;
    border-radius: 5px;
    border: 0px;
    outline: none;
    background: linear-gradient(50deg, #f12929, #fb502c);
  }
  .btn_show {
    font-size: 16px;
    color: white;
    background: linear-gradient(50deg, #3684fa, #40a5fc);
    padding: 10px 36px;
    border-radius: 5px;
    border: 0px;
    outline: none;
  }

/* ════════════════════════════════════════════════════════════════════════════
 *  以下全部是静态化改造追加的规则，上面的原规则一行未动。
 *  只服务于第四屏 .cpsi 里的那个走马灯（老代码的 <a-carousel arrows autoplay>）。
 * ══════════════════════════════════════════════════════════════════════════ */

/* ┌──────────────────────────────────────────────────────────────────────────┐
 * │ ① 文件开头那 6 条 ">>>" 规则的等价写法                                    │
 * │                                                                          │
 * │ ">>>" 是 vue-loader 的「深度选择器」，只在 <style scoped> 里有意义，       │
 * │ 编译后会变成 .ant-carousel[data-v-xxxxxxx] .slick-slide 这种形式。         │
 * │ 纯静态页没有 vue-loader，">>>" 在原生 CSS 里是非法组合符，浏览器会把        │
 * │ 整条规则直接丢弃 —— 所以这里各补一份去掉 ">>>" 的同内容规则。              │
 * │ 上面的原规则故意留着不删，方便和老项目逐条比对。                          │
 * └──────────────────────────────────────────────────────────────────────────┘ */

.ant-carousel .slick-slide {
  text-align: center;
  height: 100%;
  background: transparent;
  overflow: hidden;
}

.ant-carousel .custom-slick-arrow {
  width: 25px;
  height: 25px;
  font-size: 35px;
  color: #fff;
  background-color: transparent;
  opacity: 0.3;
}
.ant-carousel .custom-slick-arrow:before {
  display: none;
}
.ant-carousel .custom-slick-arrow:hover {
  opacity: 0.5;
}

/* 这两条在老页面里也是不生效的死规则：幻灯片内是 <h3 class="lunboimg">，
 * 没有 <p>，选择器匹配不到任何元素（它们是从 PCProduct.css 抄过来的残留）。
 * 为了「等价」照样补上，行为与老页面一致 —— 仍然匹配不到。 */
.ant-carousel .slick-slide p {
  text-align: center;
  color: #fff;
}
.ant-carousel .slick-slide p > img {
  width: 249px;
  height: 486px;
}

/* ┌──────────────────────────────────────────────────────────────────────────┐
 * │ ② antd base 层的替身（关乎「和老页面一模一样」）                          │
 * │                                                                          │
 * │ 上面 ① 里的 .custom-slick-arrow 只管长相（大小/颜色/透明度），            │
 * │ 箭头「浮在轮播左右两侧、垂直居中」这件事，老页面是靠 antd.css 里的         │
 * │ .ant-carousel .slick-slider / .slick-prev / .slick-next / .anticon        │
 * │ 提供的。新项目删掉了整包 antd，所以必须把用得到的那几条搬回来，            │
 * │ 否则箭头会退化成两个跟在幻灯片后面的普通块元素。                          │
 * │                                                                          │
 * │ 数值逐条取自 ant-design-vue 1.7.8 的 dist/antd.css，没有自己发明。        │
 * │ 只搬「影响几何」的声明；被 .custom-slick-arrow 覆盖掉的那些               │
 * │ （width/height/font-size/color/background）不搬，避免层叠顺序变化。       │
 * └──────────────────────────────────────────────────────────────────────────┘ */

/* antd 的定位上下文是内层的 .slick-slider（position:relative）。
 * 静态页把 .ant-carousel 和 .slick-slider 两层合成了一层，
 * 所以 relative 挪到 .ant-carousel 上。 */
.ant-carousel {
  position: relative;
}

/* 原 .ant-carousel .slick-prev, .ant-carousel .slick-next */
.ant-carousel .slick-arrow {
  position: absolute;
  top: 50%;
  display: block;
  margin-top: -10px;
  padding: 0;
  line-height: 0;
  border: 0;
  outline: none;
  cursor: pointer;
}
/* 这两条会被 HTML 里的 inline style（left:-40px / right:-30px）覆盖，
 * 和老页面一样 —— 老代码就是用 slot 上的 style 覆盖 antd 默认值的。 */
.ant-carousel .slick-prev { left: -25px; }
.ant-carousel .slick-next { right: -25px; }

/* 原 .anticon / .anticon > * / .anticon svg，只留影响几何的三条。
 * a-icon 渲染出来的 <svg> 是 width/height:1em，父级 font-size:35px → 35px。 */
.ant-carousel .slick-arrow .anticon {
  display: inline-block;
  line-height: 0;
  text-align: center;
  vertical-align: -0.125em;
}
.ant-carousel .slick-arrow .anticon > svg {
  display: inline-block;
  line-height: 1;
}

/* 原 .ant-carousel .slick-slide img { display: block }
 * 少了这条，图片退回 inline，行盒会在图片下方多出几像素空白。 */
.ant-carousel .slick-slide img {
  display: block;
}

/* .lunboimg 老代码就是 <h3>（不是这次改的）。
 * 老页面它吃 antd base 的 h3 规则：margin-bottom:.5em，而 h3 默认
 * font-size 是 1.17em（14px × 1.17 ≈ 16.4px），折算约 8px。
 * 新 reset.css 把 h1~h6 归零成 font-size:inherit + margin-bottom:1em（14px），
 * 会让轮播整体高出约 6px（.cpsi_lunbo 是 align-items:center，表现为内容上移约 3px）。
 * 这里把老值显式写回来，保持视觉一致。 */
.lunboimg {
  margin: 0 0 8px;
}