/* 框架 */
     section {
         position: relative;
         z-index: 1;
         overflow: hidden;
         width: 100%;
         padding: 90px var(--container);
     }

     @media (max-width: 1200px) {
         section {
             padding: 60px var(--container);
         }
     }

     @media (max-width: 720px) {
         section {
             padding: 30px var(--container);
         }
     }

     /* 标题 */
     .indexTitle {
         width: calc(100% - 400px);
         display: flex;
         flex-direction: column;
         align-items: flex-start;
         grid-gap: 30px;
         position: relative;
         z-index: 2;
     }

     .indexTitle::before {
         content: "";
         width: 150px;
         height: 16px;
         position: absolute;
         z-index: -1;
         bottom: 10px;
         left: -30px;
         background: linear-gradient(to right, rgb(16, 109, 186), rgb(255, 255, 255));
     }

     .indexTitle h1 {
         font-size: 32px;
         font-weight: bold;
         color: #666;
         line-height: 1;
         position: relative;
     }

     .indexTitle h2 {
         font-size: 24px;
         color: #666;
         line-height: 2;
     }

     .IndexTop {
         display: flex;
         justify-content: space-between;
     }

     .indexMore {
         width: 140px;
         height: 54px;
         display: flex;
         justify-content: center;
         align-items: center;
         border: 2px solid var(--color);
         color: var(--color);
     }

     @media (max-width: 1200px) {
         .indexTitle {
             width: calc(100% - 200px);
             grid-gap: 15px;
         }

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

         .indexTitle h2 {
             font-size: 18px;
         }

         .indexTitle::before {
             bottom: -5px;
             left: -15px;
             background: linear-gradient(to right, rgb(16, 109, 186), rgb(255, 255, 255));
         }
     }

     @media (max-width: 720px) {
         .indexTitle {
             width: calc(100% - 150px);
         }

         .indexMore {
             width: 120px;
             height: 45px;
             font-size: 14px;
         }
     }

     @media (max-width: 460px) {
         .IndexTop {
             display: flex;
             justify-content: space-between;
             flex-direction: column;
             grid-gap: 15px;
         }

         .indexTitle {
             width: 100%;
         }

     }

     .animation1 {
         position: relative;
         overflow: hidden;
     }

     .animation1:before {
         content: "";
         position: absolute;
         display: block;
         transition: all .6s;
         width: 100%;
         height: 0;
         border-radius: 50%;
         left: 50%;
         top: 50%;
         padding-top: 100%;
         transform: translateX(-50%) translateY(-50%)
     }

     .animation1:hover:before {
         animation: style1 .75s;
         z-index: 1
     }

     @keyframes style1 {
         0% {
             background: rgba(0, 0, 0, .25);
             transform: translateX(-50%) translateY(-50%) scale(0)
         }

         to {
             background: 0 0;
             transform: translateX(-50%) translateY(-50%) scale(1)
         }
     }