@media screen and (min-width: 960px) {
  /* PC */
  /* ----------  ---------- */
  .project-info__header {
  }

  .project-info h2.name {
    margin-bottom: 0.25rem;
  }

  .project-info p.category {
    color: var(--main-color-code);
  }

  .project-info a {
  }

  .project-info__body {
    padding-top: 2.75rem;
    padding-bottom: 2.75rem;
  }

  .project-info__footer {
    border-top: 1px solid var(--main-color-code);
  }

  .project-info__footer .portfolio-list-button {
    width: min-content;

    background-color: var(--main-color-code);
    color: #ffffff;

    margin-top: 2.75rem;
    margin-right: auto;
    margin-bottom: 2.75rem;
    margin-left: auto;
  }

}

@media screen and (max-width: 959px) {
  /* Tablet and Mobile */
  /* ----------  ---------- */
  .project-info__header {
  }

  .project-info h2.name {
    margin-bottom: 0.25rem;
  }

  .project-info p.category {
    color: var(--main-color-code);
  }

  .project-info a {
  }

  .project-info__body {
    padding-top: 1.45rem;
    padding-bottom: 1.45rem;
  }

  .project-info__footer {
    border-top: 1px solid var(--main-color-code);
  }

  .project-info__footer .portfolio-list-button {
    width: min-content;

    background-color: var(--main-color-code);
    color: #ffffff;

    margin-top: 1.75rem;
    margin-right: auto;
    margin-bottom: 1.75rem;
    margin-left: auto;
  }
}