.swiper-container {
  margin-top: 0.6rem !important; }

.actv_case {
  border-bottom: 2px solid #0087D7 !important; }

.container {
  width: 12rem; }
  .container .title {
    width: 100%;
    font-weight: bold;
    font-size: 0.3rem;
    text-align: center;
    border-bottom: 1px solid #EEEEEE;
    padding: 0.3rem 0;
    position: relative;
    margin-bottom: 0.4rem; }
  .container .title::after {
    content: '';
    width: 0.64rem;
    height: 0.05rem;
    background: #0082DC;
    position: absolute;
    bottom: 0rem;
    left: 50%;
    margin-left: -.32rem; }
  .container > .sear_case {
    width: 3.72rem;
    height: 0.46rem;
    float: right;
    background: #FAFAFA;
    margin: 30px 0;
    position: relative; }
    .container > .sear_case > input {
      width: 100%;
      height: 100%;
      position: absolute;
      background: #FAFAFA;
      left: 0;
      top: 0; }
    .container > .sear_case > img {
      max-width: 0.16rem;
      position: absolute;
      right: .2rem;
      top: 0.14rem; }
  .container > .classfiy {
    width: 100%;
    margin: 0.3rem 0; }
    .container > .classfiy > div {
      width: 100%;
      display: flex;
      justify-content: space-between; }
      .container > .classfiy > div > p {
        font-weight: bold;
        display: inline-block;
        width: 1rem;
        margin-top: .1rem; }
      .container > .classfiy > div > div {
        width: 100%; }
        .container > .classfiy > div > div > span {
          display: inline-block;
          width: 1.34rem;
          height: 0.46rem;
          background: #FAFAFA;
          text-align: center;
          line-height: 0.46rem;
          cursor: pointer;
          position: relative;
          border-bottom: 2px solid transparent;
          margin-bottom: 0.1rem;
          font-size: .16rem;
          margin-right: 0.1rem; }
      .container > .classfiy > div > div > span:hover {
        border-bottom: 2px solid #0087D7; }
    .container > .classfiy .more1 {
      display: none; }
  .container .case_list {
    display: flex;
    flex-flow: wrap; }
    .container .case_list > .item:nth-child(3n+2) {
      margin: 0 0.3rem; }
    .container .case_list > .item:hover {
      box-shadow: 0px 10px 20px 0px rgba(126, 126, 126, 0.1);
      cursor: pointer; }
    .container .case_list > .item:hover img {
      transform: scale(1.1); }
    .container .case_list > .item:hover h3 {
      color: #0087D7; }
    .container .case_list > .item:hover:after {
      opacity: 1;
      transform: translate(-50%) scaleX(1); }
    .container .case_list > .item:after {
      content: "";
      position: absolute;
      left: 50%;
      bottom: 0rem;
      width: 100%;
      opacity: 0;
      border-bottom: 2px solid #0087D7;
      transform: translate(-50%) scaleX(0);
      transition: .2s ease-in-out;
      z-index: 1; }
    .container .case_list > .item {
      position: relative;
      width: 3.8rem;
      height: 4.25rem;
      background: #FFFFFF;
      border-bottom: 1px solid #EEEEEE;
      margin: 0 0 0.3rem;
      box-shadow: 0px 10px 20px 0px rgba(126, 126, 126, 0.1); }
      .container .case_list > .item > .img_c {
        width: 3.8rem;
        height: 2.87rem;
        overflow: hidden;
        position: relative; }
        .container .case_list > .item > .img_c > img {
          width: 100%;
          height: 100%;
          transition: all 0.3s; }
        .container .case_list > .item > .img_c > #bq {
          position: absolute;
          bottom: 0;
          left: 0;
          z-index: 100; }
          .container .case_list > .item > .img_c > #bq > span {
            color: #FFFFFF;
            display: inline-block;
            width: 0.9rem;
            height: 0.3rem;
            text-align: center;
            line-height: 0.3rem;
            font-size: 0.16rem;
            border-radius: 2px; }
          .container .case_list > .item > .img_c > #bq > span:nth-child(1) {
            background: #0082DC; }
          .container .case_list > .item > .img_c > #bq > span:nth-child(2) {
            background: #ff8e14; }
      .container .case_list > .item > .d_case {
        width: 3.8rem; }
        .container .case_list > .item > .d_case > h3 {
          margin: 0.15rem 0;
          text-align: center;
          box-sizing: border-box;
          padding: 0 .1rem; }
        .container .case_list > .item > .d_case > p {
          font-size: 0.14rem;
          color: #666666;
          width: 96%;
          margin: auto;
          line-height: 0.26rem;
          text-align: center;
          position: absolute;
          bottom: 0.2rem; }
  .container .qgss {
    overflow: hidden; }
    .container .qgss > .t_i {
      width: 100%;
      overflow: hidden; }
      .container .qgss > .t_i > div {
        display: inline-block; }
        .container .qgss > .t_i > div > span {
          display: inline-block;
          width: 0.52rem;
          height: 0.3rem;
          text-align: center;
          line-height: 0.3rem;
          font-size: 0.16rem; }
      .container .qgss > .t_i > div:nth-child(1) {
        width: 6%;
        float: left; }
        .container .qgss > .t_i > div:nth-child(1) > span {
          width: 100%; }
      .container .qgss > .t_i > div:nth-child(2) {
        width: 94%;
        float: right; }
        .container .qgss > .t_i > div:nth-child(2) > span {
          cursor: pointer; }
    .container .qgss .qg_list > .item:hover {
      border: 1px solid #0089E7; }
      .container .qgss .qg_list > .item:hover h3 {
        color: #0089E7; }
    .container .qgss .qg_list > .item {
      margin-top: 0.2rem;
      transition: all  .3s;
      width: 100%;
      height: 3.2rem;
      border: 1px solid #E2E2E2;
      display: flex;
      align-items: center;
      justify-content: space-between; }
      .container .qgss .qg_list > .item > div:nth-child(1) {
        width: 4.02rem;
        height: 2.8rem;
        margin: 0 0.2rem; }
        .container .qgss .qg_list > .item > div:nth-child(1) > img {
          width: 100%;
          height: 100%; }
      .container .qgss .qg_list > .item > div:nth-child(2) {
        width: 7rem;
        height: 100%; }
        .container .qgss .qg_list > .item > div:nth-child(2) > div > div {
          display: flex; }
          .container .qgss .qg_list > .item > div:nth-child(2) > div > div > p {
            margin-left: 0.1rem;
            width: 80%; }
            .container .qgss .qg_list > .item > div:nth-child(2) > div > div > p > span {
              display: block; }
        .container .qgss .qg_list > .item > div:nth-child(2) > div {
          margin-top: 20px; }
          .container .qgss .qg_list > .item > div:nth-child(2) > div > p {
            margin: 0.1rem 0; }
          .container .qgss .qg_list > .item > div:nth-child(2) > div > div {
            margin-top: 0.1rem; }
            .container .qgss .qg_list > .item > div:nth-child(2) > div > div > img {
              float: left;
              margin-right: 10px; }
            .container .qgss .qg_list > .item > div:nth-child(2) > div > div > div {
              width: 100%; }
              .container .qgss .qg_list > .item > div:nth-child(2) > div > div > div > p {
                margin-bottom: 0.1rem; }
      .container .qgss .qg_list > .item > div:nth-child(3) {
        width: 1.54rem;
        height: 100%;
        background-size: 100%;
        background-position: center; }
        .container .qgss .qg_list > .item > div:nth-child(3) > button {
          display: block;
          width: 1.2rem;
          margin: 0.5rem auto 0;
          height: 0.36rem;
          background: #FFFFFF;
          box-shadow: 0px 1px 10px 0px rgba(0, 137, 231, 0.3);
          border-radius: 0.18rem;
          cursor: pointer; }
    .container .qgss .choose {
      background: #0089E7;
      color: #fff; }

.more {
  display: none; }

@media screen and (max-width: 800px) {
  .swiper-button-next, .swiper-button-prev {
    display: none; }
  #page {
    display: none !important; }
  .swiper-container {
    height: auto; }
  .container {
    width: 100%; }
    .container > .sear_case {
      width: 96%;
      height: .6rem;
      margin: .3rem auto 0;
      float: none; }
      .container > .sear_case > input {
        width: auto; }
      .container > .sear_case > img {
        max-width: 0.3rem; }
    .container > .classfiy {
      width: 96%;
      margin: .3rem auto; }
      .container > .classfiy > div {
        display: block;
        margin-bottom: 0.2rem; }
        .container > .classfiy > div > div {
          width: 100%;
          overflow: hidden;
          font-size: .26rem;
          height: auto;
          transition: all .3s;
          display: flex; }
          .container > .classfiy > div > div > span {
            float: left;
            width: 31%;
            height: 0.68rem;
            line-height: .68rem; }
          .container > .classfiy > div > div > span:nth-child(3n+2) {
            margin: 0 3%; }
        .container > .classfiy > div > p {
          width: 100%;
          margin-bottom: 0.3rem; }
    .container .case_list {
      display: block; }
      .container .case_list > .item {
        width: 96% !important;
        margin: auto;
        height: auto !important;
        padding-bottom: 0.4rem;
        margin-bottom: 0.3rem; }
        .container .case_list > .item > .img_c {
          width: 100%;
          height: 4.2rem; }
        .container .case_list > .item > .d_case {
          width: 100%; }
          .container .case_list > .item > .d_case > p {
            line-height: 0.4rem;
            font-size: .26rem; }
          .container .case_list > .item > .d_case > h3 {
            font-size: .32rem; }
      .container .case_list > .item:nth-child(3n+2) {
        margin: auto; }
    .container .more1 {
      margin: 0.4rem 0;
      color: #0087D7;
      display: block; }
      .container .more1 > img {
        max-width: .6rem;
        vertical-align: middle; }
      .container .more1 > span {
        font-size: 0.26rem;
        position: relative;
        left: .2rem;
        top: .04rem; }
  .container .qgss > .t_i > div:nth-child(1) {
    display: block;
    width: 100%; }
    .container .qgss > .t_i > div:nth-child(1) > span {
      font-size: 0.3rem;
      text-align: left;
      margin-bottom: 0.1rem; }
  .container .qgss > .t_i > div:nth-child(2) {
    display: block;
    width: 100%; }
    .container .qgss > .t_i > div:nth-child(2) > span {
      font-size: 0.3rem;
      width: 1rem;
      height: 0.5rem;
      line-height: 0.5rem; }
  .container .qgss .qg_list > .item {
    display: contents; }
    .container .qgss .qg_list > .item span {
      font-size: 0.28rem !important; }
    .container .qgss .qg_list > .item > div {
      width: 100% !important;
      margin: 0.2rem 0 !important; }
    .container .qgss .qg_list > .item > div:nth-child(1) {
      height: auto; }
      .container .qgss .qg_list > .item > div:nth-child(1) > img {
        width: 100%; }
    .container .qgss .qg_list > .item > div:nth-child(2) > div > div > p > span {
      display: block; }
    .container .qgss .qg_list > .item > div:nth-child(2) h3 {
      font-size: 0.32rem; }
    .container .qgss .qg_list > .item > div:nth-child(2) p {
      font-size: 0.28rem; }
    .container .qgss .qg_list > .item > div:nth-child(3) {
      height: 1.6rem;
      text-align: center; }
      .container .qgss .qg_list > .item > div:nth-child(3) > button {
        display: inline-block;
        width: 2rem;
        height: 0.6rem;
        border-radius: 0.3rem; } }