.img-area, .photo, .eye {
  min-height: 15.5vw;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
.eye {
  min-height: 20vw;
}
.photo {
  min-height: 10vw;
}
.client-wrap > li {
  background-color: #111;
}
.title-link {
  padding: .2vw .5vw;
}
.to-detail {
  padding: .25vw 0;
}
#works a {
  text-decoration: none;
}
.eye span {
  opacity: 0;
  transition: 0.15s ease-in-out;
}
.eye:hover span {
  opacity: 1;
}

@media (max-width: 767px){
  .eye {
    min-height: 50vw;
  }
  .img-area {
    min-height: 30vw;
  }
  .photo {
    min-height: 20vw;
  }
    #faq dt {
    padding-left: 8.5vw;
    font-size: 110%;
  }
  #faq dd {
    padding-left: 7vw;
  }
  #faq dt::before,
  #faq dd::before {
    top: -1vw;
  }

}


@media (max-width: 575px){
  .img-area {
    min-height: 55vw;
  }
  .photo {
    min-height: 30vw;
  }
}