@charset "utf-8";

/* ---------------------------------------------------- */
/* ３ページ目 */
/* ---------------------------------------------------- */
#page-3 {
  position: relative;
  width: 100%;
  height: auto;
  margin-bottom: 80px;

  & div {
    z-index: 10;
    position: absolute;
    min-width: 600px;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    color: white;
    text-align: center;
    font-size: 1.25rem;
    filter: drop-shadow(2px 2px 3px #1e1e1e);

    & img {
      width: 75%;
      height: auto;
      margin-bottom: 1.25rem;
    }
  }

  & .haikei {
    z-index: 0;
    object-fit: cover;
  }
}

/* レスポンシブ対応 1200px未満*/
@media screen and (max-width:1199px) {

  #page-3 {
    margin-bottom: 120px;
  }
}

/* レスポンシブ対応 992px未満*/
@media screen and (max-width:991px) {

  #page-3 {
    min-width: 100%;
    height: 400px;

    & .haikei {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}

/* レスポンシブ対応 768px未満*/
@media screen and (max-width:767px) {

  #page-3 {
    margin-bottom: 60px;

    & div {
      min-width: 96%;
      font-size: 1rem;
      top: 55%;

      & img {
        max-height: 3rem;
        width: 96%;
      }
    }
  }
}

/* レスポンシブ対応 576px未満*/
@media screen and (max-width:575px) {

  #page-3 {
    height: 450px;
    margin-bottom: 40px;

    & div {
      min-width: 96%;
      font-size: 15px;
      top: 60%;

      & img {
        max-height: 2.5rem;
        width: 96%;
      }
    }
  }
}