@charset "utf-8";
/* join */
.page_box .con {
  margin: auto;
  padding: 50px 0 0;
  width: 80%;
}
.page_box .con a {
  float: left;
  margin: 30px 3%;
  width: 14%;
  border-radius: 5%;
  overflow: hidden;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
.page_box .con a img {
  display: block;
  width: 100%;
  background: #fff no-repeat center;
  background-size: 70%;
}
.page_box .con a:hover {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
  -webkit-filter: grayscale(0);
  -moz-filter: grayscale(0);
  -ms-filter: grayscale(0);
  -o-filter: grayscale(0);
  filter: grayscale(0);
}
/*手机版*/
@media screen and (max-width: 800px) {
  .page_box .con {
    padding: 6vw 0 0;
    width: 90%;
  }
  .page_box .con a {
    margin: 2vw 1.5%;
    width: 30%;
    border-radius: 5%;
    overflow: hidden;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  }
  .page_box .con a img {
    display: block;
    width: 100%;
    background: #fff no-repeat center;
    background-size: 70%;
  }
  .page_box .con a:hover {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
    -webkit-filter: grayscale(0);
    -moz-filter: grayscale(0);
    -ms-filter: grayscale(0);
    -o-filter: grayscale(0);
    filter: grayscale(0);
  }
}