/* 列表 */
   .CaseBigBox {
       display: grid;
       grid-template-columns: repeat(2, 1fr);
       grid-gap: 60px 40px;
   }

   .CaseList {
       width: 100%;
       overflow: hidden;
       position: relative;
   }

   .CaseList .img {
       display: block;
       position: relative;
       z-index: 1;
       width: 100%;
   }

   .CaseList span {
       display: block;
       width: 100%;
       height: 100%;
       position: absolute;
       z-index: 2;
       background: linear-gradient(180deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.6) 100%);
   }

   .CaseList .text {
       width: 100%;
       padding: 45px;
       position: absolute;
       z-index: 3;
       left: 0;
       bottom: 0;
       display: flex;
       justify-content: space-between;
   }

   .CaseList .text::after {
       content: "";
       display: block;
       position: absolute;
       left: 0;
       bottom: 0;
       width: 0%;
       height: 2px;
       background: var(--color);
       transition: 0.5s;
   }

   .CaseList:hover .text::after {
       width: 100%;
   }

   .CaseList .text h1 {
       font-family: PuHuiTi85;
       font-size: 24px;
       line-height: 1.5;
       color: #FFFFFF;
   }

   .CaseList .text img {
       opacity: 0;
       width: 36px;
       height: 36px;
       transition: 0.5s;
   }

   .CaseList:hover .text img {
       opacity: 1;
   }


   @media screen and (max-width: 1200px) {
       .CaseBigBox {
           grid-gap: 30px 20px;
       }

       .CaseList .text {
           padding: 15px;
       }

       .CaseList .text h1 {
           font-size: 20px;
       }
   }

   @media screen and (max-width: 460px) {
       .CaseBigBox {
           grid-template-columns: repeat(1, 1fr);
       }
   }




   /* 详情 */
   .cpjj {
       padding-bottom: 90px;
       position: relative;
       z-index: 2;
       width: 100%;
       display: flex;
       align-items: center;
       justify-content: center;
   }

   .CpImg {
       width: 40%;
       position: relative;
   }

   .CpImg1 {
       width: 100%;
       margin: 0;
   }

   .CpImg2 {
       width: 100%;
       height: auto;
       margin-top: 10px;
   }

   .CpImg img {
       width: 100%;
       height: 100%;
       object-fit: contain;
       background: #fff;
   }

   .CpText {
       width: 60%;
       padding-left: 75px;

   }

   .CpText h2 {
       font-weight: 400;
       font-size: 24px;
       line-height: 1;
       text-transform: uppercase;
       color: #686868;
   }

   .xqBox1 {
       margin-top: 20px;
       padding-bottom: 30px;
       display: flex;
       align-items: center;
       justify-content: space-between;
       position: relative;

   }

   .xqBox1::after {
       content: '';
       position: absolute;
       bottom: 0;
       left: 0;
       width: 100%;
       height: 1px;
       background: repeating-linear-gradient(to right, #A5A5A5, #A5A5A5 10px, transparent 10px, transparent 15px);
   }

   .CpText h1 {
       font-weight: 700;
       font-size: 40px;
       line-height: 1;
       color: #171717;
   }


   .CpText .desc {
       margin: 30px 0;
       display: flex;
       flex-direction: column;
   }

   .CpText .desc p {
       width: 100%;
       font-weight: 400;
       font-size: 18px;
       line-height: 2;
       color: #000000;
   }

   .CpText a {
       width: 175px;
       height: 50px;
       background: var(--color);
       border-radius: 4px;
       font-size: 16px;
       line-height: 1;
       color: #FFFFFF;
       display: flex;
       align-items: center;
       justify-content: center;
   }


   @media (max-width:1440px) {
       .xqBox1 .phone {
           width: 45%;
       }

       .CpText {
           padding-left: 45px;
       }

       .CpText .desc p {
           width: 45%;
           line-height: 1.5;
       }

       .CpText .desc {
           margin: 20px 0 40px;
       }
   }

   @media (max-width:1200px) {

       .cpjj {
           padding-bottom: 75px;
           display: flex;
           align-items: flex-start;
           justify-content: center;
           flex-direction: column;
       }

       .CpImg {
           width: 500px;
           position: relative;
       }

       .CpText {
           width: 100%;
           padding-left: 0;
           margin-top: 60px;
           margin-bottom: 30px;
           display: flex;
           flex-direction: column;
           align-items: flex-start;
       }

       .CpText .xqBox1 {
           width: 100%;
       }

       .CpText .desc {
           width: 100%;
       }

       .CpText h1 {
           padding-left: 0;
       }

       .CpImg1 {
           border-bottom: 7px solid var(--color);
       }
   }

   @media (max-width:720px) {
       .cpjj {
           padding-bottom: 45px;
       }

       .CpImg {
           width: 100%;
       }

       .CpText .xqBox1 {
           width: 100%;
           display: flex;
           flex-direction: column;
           align-items: flex-start;
       }

       .CpText h1 {
           margin-bottom: 15px;
       }

       .CpText .desc {
           display: flex;
           flex-direction: column;
           grid-gap: 15px 0;
       }

       .CpText .desc p {
           width: 100%;
       }
   }

   @media (max-width:460px) {
       .cpjj {
           padding-top: 30px;
           padding-bottom: 30px;
       }

       .CpImg1 {
           border-bottom: 4px solid var(--color);
       }

       .CpText {
           margin-top: 45px;
       }

       .CpText h2 {
           font-size: 20px;
       }

       .CpText h1 {
           font-size: 24px;
       }

       .xqBox1 .phone {
           width: 100%;
       }

       .CpText .desc {
           margin: 15px 0 20px;
           grid-gap: 10px 0;
       }

       .CpText .desc p {
           font-size: 16px;
       }

       .CpText a {
           width: 140px;
           height: 40px;
       }
   }

   /* 简介*/
   .nyTitle {
       position: relative;
       font-weight: 500;
       font-size: 32px;
       line-height: 1;
       color: #000000;
       padding-left: 45px;
       display: flex;
       align-items: center;
   }

   .nyTitle::after {
       content: "";
       display: block;
       width: 20px;
       height: 20px;
       background: var(--color);
       position: absolute;
       left: 0;
   }

   @media (max-width: 1200px) {
       .nyTitle {
           font-size: 28px;
       }
   }

   @media (max-width: 720px) {
       .nyTitle {
           font-size: 24px;
       }

       .nyTitle::after {
           width: 16px;
           height: 16px;
       }
   }

   .content {
       margin: 60px 0;
       background: #F0F0F0;

   }

   @media (max-width: 1200px) {
       .content {
           margin: 45px 0;
       }
   }

   @media (max-width: 720px) {
       .content {
           margin: 30px 0;
       }
   }