@charset "utf-8";

/* //////////////// */
/* mobile design */

@media (max-width: 919px) {
  .introduction_top {
    padding: 15vh 0vw 10vh 10vw;
    width: 80vw;
  }

  .introduction_top h2 {
    font-size: 2rem;
  }

  .container {
    padding-top: 5vh;
    background-color: #fbfbfd;
  }

  .container img {
    width: 80vw;
    height: auto;
    padding-left: 10vw;
  }

  .container .creator {
    padding: 2vh 10vw 5vh 10vw;
  }

  .creator h3 {
    padding-top: 3vh;
    border-bottom: solid 1px #1d1d1f;
  }

  .creator p {
    padding-left: 3vw;
    padding-top: 1vh;
    line-height: 1.3rem;
    letter-spacing: 1px;
    padding-bottom: 1vh;
  }
}

/* //////////////// */
/* pc design */

@media (min-width: 920px) {
  .introduction_top {
    padding: 25vh 0vw 10vh 10vw;
    width: 80vw;
  }

  .introduction_top h2 {
    font-size: 4vw;
  }

  .container {
    padding-top: 5vh;
    background-color: #fbfbfd;
    display: flex;
  }

  .container img {
    width: 30vw;
    height: 30vw;
    padding-left: 10vw;
  }

  .container .creator {
    padding: 0vh 20vw 5vh 10vw;
  }

  .creator h3 {
    padding-top: 3vh;
    border-bottom: solid 1px #1d1d1f;
  }

  .creator p {
    padding-left: 3vw;
    padding-top: 1vh;
    line-height: 1.3rem;
    letter-spacing: 1px;
    padding-bottom: 1vh;
  }
}