@layer component {

  /* p-footer-sns */
  .p-footer-sns {
    margin-top: 100px;
  }
  .p-footer-sns__ttl {
    font-size: 1.25rem;
    font-weight: 400;
    letter-spacing: 0.03em;
    color: #999;
    text-align: center;
  }
  .p-footer-sns__box {
    background-color: #f7f7f8;
    padding-top: 60px;
    padding-bottom: 60px;
    padding-left: calc(var(--mc-layout--offset--of-outer-left) + var(--mc-layout--offset--of-inner-left));
    padding-right: calc(var(--mc-layout--offset--of-outer-right) + var(--mc-layout--offset--of-inner-right));
    margin-top: 16px;
  }
  .p-footer-sns__list {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 64px;
  }
  .p-footer-sns__item {
    width: 48px;
    height: fit-content;
  }
  .p-footer-sns__item.p-footer-sns__item--youtube {
    width: 68px;
  }
  .p-footer-sns__link {
    display: inline-block;
    transition: scale 0.3s;
    will-change: scale;
  }
  .p-footer-sns__link img {
    display: block;
    width: 100%;
    height: auto;
  }
  .p-footer-sns__item.p-footer-sns__item--linkedin img {
    width: auto;
    height: 48px;
  }
  @media screen and (min-width: 768px) {
    .p-footer-sns__link:hover {
      scale: 1.08;
    }
  }
  @media screen and (max-width: 767px) {
    .p-footer-sns {
      margin-top: calc(4 * var(--base-unit));
    }
    .p-footer-sns__ttl {
      font-size: 1rem;
    }
    .p-footer-sns__box {
      background-color: #f7f7f8;
      padding-top: calc(4 * var(--base-unit));
      padding-bottom: calc(4 * var(--base-unit));
      padding-left: var(--mc-layout--offset--of-outer-left);
      padding-right: var(--mc-layout--offset--of-outer-right);
      margin-top: calc(1.2 * var(--base-unit));
    }
    .p-footer-sns__list {
      column-gap: calc(3 * var(--base-unit));
    }
    .p-footer-sns__item {
      width: calc(4.2 * var(--base-unit));
    }
    .p-footer-sns__item.p-footer-sns__item--youtube {
      width: calc(6 * var(--base-unit));
    }
    .p-footer-sns__item.p-footer-sns__item--linkedin img {
      height: calc(4.2 * var(--base-unit));
    }
  }

}