@media screen and (max-width: 1200px) {
    html, body {
      font-size: 12.5px;
    }
    main .banners {
      margin-top: 3.87em;
      background-image: url(../images/case/case_banner_img01-2.png);
      background-size: cover;
      font-size: 3rem;
    }
    main .banners p {
      width: 92%;
      font-size: 2.5em;
      margin: 28.87rem 0 26.12rem 0;
    }
    main .case_tit {
      display: flex;
      align-items: center;
      font-size: 2.5rem;
      width: 92%;
      margin: 0 auto 1.15em auto;
    }
    main .case_tit .case_phpne {
      display: none;
    }
    main .case_tit .case_header {
      width: 100%;
    }
    main .case_tit .case_header ul {
      width: 100%;
      display: flex;
      align-items: center;
      position: relative;
    }
    main .case_tit .case_header ul div {
      display: none;
    }
    main .case_tit .case_header ul li {
      width: 25%;
      height: 5.3em;
      margin-left: 0;
      padding-bottom: 0;
      border-bottom: 0px;
    }
    main .case_tit .case_header ul li:nth-child(1) {
      margin-left: 0;
    }
    main .case_tit .case_header ul li:hover {
      border-bottom: 0px;
    }
    main .case_tit .case_header ul li:hover a {
      background-color: #38be86;
      color: #ffffff;
    }
    main .case_tit .case_header ul li a {
      width: 100%;
      height: 100%;
      font-size: 1em;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    main .case_tit .case_header ul li.active {
      border-bottom: 0px;
      background-color: #38be86;
    }
    main .case_tit .case_header ul li.active a {
      color: #ffffff;
    }
    main .case_box {
      font-size: 2.5rem;
      width: 100%;
      display: none;
      flex-direction: column;
      align-items: center;
    }
    main .case_box .case_list {
      width: 92%;
      margin-bottom: 2.2em;
    }
    main .case_box .case_list:nth-child(even) a {
      flex-direction: column-reverse;
    }
    main .case_box .case_list:nth-child(even) a::after {
      left: auto;
      right: 0;
    }
    main .case_box .case_list:nth-child(even) a .case_inner p {
      margin-left: 5.6%;
    }
    main .case_box .case_list:nth-child(even) a .case_inner .gdt {
      margin-left: 5.6%;
    }
    main .case_box .case_list:nth-child(even) a .case_inner span {
      margin-left: 5.6%;
    }
    main .case_box .case_list:nth-child(even) a .case_inner .movese {
      margin-left: 5.6%;
    }
    main .case_box .case_list:nth-child(even) a .imgs {
      right: auto;
      left: 0;
    }
    main .case_box .case_list a {
      width: 100%;
      flex-direction: column-reverse;
      align-items: flex-start;
      padding-top: 2.05em;
    }
    main .case_box .case_list a::after {
      content: "";
      position: absolute;
      width: 47.53%;
      height: 100%;
      left: 0;
      top: 0;
      background: #f6f8fb;
      z-index: -1;
    }
    main .case_box .case_list a .case_inner {
      width: 100%;
      margin-bottom: 0;
      padding: 1.82em 0 2.84em 0;
      background: none;
      position: relative;
    }
    main .case_box .case_list a .case_inner p {
      width: 81.73%;
      font-size: 1.4em;
      margin-left: 5.6%;
      margin-bottom: 3.68rem;
    }
    main .case_box .case_list a .case_inner .gdt {
      width: 9.13%;
      height: .3em;
      background-color: #38be86;
      margin-left: 5.6%;
      margin-bottom: 2.12em;
    }
    main .case_box .case_list a .case_inner span {
      width: 81.73%;
      line-height: 1.5em;
      margin-bottom: 4rem;
      -webkit-line-clamp: 2;
    }
    main .case_box .case_list a .case_inner .movese {
      margin-left: 5.6%;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 26.37%;
      height: 2.65em;
    }
    main .case_box .case_list a .case_inner .movese div {
      width: 1.3em;
      height: 1.3em;
    }
    main .case_box .case_list a .imgs {
      position: static;
      right: 0;
      bottom: 0;
      width: 100%;
    }
  }