/* Test-page-only responsive refinements. */

.gpFooter__logo {
  width: min(100%, 30rem);
}

.gpFooter__logo img {
  content: url("/assets/images/common/logoWh.svg");
}

@media screen and (max-width: 599px) {
  .gpFooter__brand,
  .gpFooter__sns,
  .gpFooter__bottom {
    justify-items: center;
    text-align: center;
  }

  .gpFooter__logo {
    margin-inline: auto;
  }

  .gpFooter__snsList,
  .gpFooter__links {
    justify-content: center;
  }
}

@media screen and (min-width: 320px) {
  .gpFooterCard__title {
    right: 7.6rem;
  }

  .gpFooterCard__title span:first-child {
    font-size: 90%;
    line-height: 1;
    white-space: nowrap;
  }

  .gpFooterCard__title span:last-child {
    overflow-wrap: anywhere;
  }

  .gpFooterCard:nth-child(5) .gpFooterCard__title span:first-child {
    font-size: 80%;
  }

  .gpFooterCard:nth-child(11) .gpFooterCard__title span:first-child {
    font-size: 66%;
  }

  .gpFooterCard__apply {
    right: 4rem;
  }

  .countdown.--isNew {
    position: relative;
    inset: auto;
    width: calc(100% - 5vw);
    margin: 0 auto 2.5vw;
    transform: none;
  }

  .countdown.--isNew .countdown__inner {
    width: 100%;
  }

  .countdown.--isNew .countdown__grid {
    flex: 1;
    gap: 1.2vw;
  }

  .countdown.--isNew .countdown__item {
    flex: 1;
    justify-content: center;
    min-width: 0;
  }

  .countdown.--isNew .countdown__sep {
    font-size: 4vw;
    transform: translateY(-.8vw);
  }
}

@media screen and (min-width: 600px) {
  .gpFooterCard__title {
    right: 14rem;
  }

  .countdown.--isNew {
    position: absolute;
    inset: 75vh 1.75vw auto auto;
    width: auto;
    margin: 0;
    transform: none;
  }

  .countdown.--isNew .countdown__inner {
    width: auto;
  }

  .countdown.--isNew .countdown__grid {
    flex: none;
    gap: clamp(8px, 2vw, 14px);
  }

  .countdown.--isNew .countdown__item {
    flex: none;
    justify-content: flex-start;
    min-width: clamp(64px, 11vw, 92px);
  }

  .countdown.--isNew .countdown__sep {
    font-size: clamp(18px, 3vw, 28px);
    transform: translateY(-6px);
  }
}

@media screen and (min-width: 1025px) {
  .gpFooter__logo {
    width: min(100%, 34.5rem);
  }

  .gpFooterCard__apply {
    right: 7.6rem;
  }
}
