.footer { background-color: var(--color-tertiary); color: #fff; font-family: var(--font-family-secondary); font-size: 1.5rem; } .footer__inner { display: grid; gap: var(--gap); padding: var(--x-gap); grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; justify-items: center; } .footer__logo { grid-area: 1 / 1 / 2 / 3; } .footer__sns { text-transform: uppercase; grid-area: 2 / 1 / 3 / 2; } .footer__options { grid-area: 2 / 2 / 3 / 3; } .footer__menu { line-height: 1.2; margin-bottom: 1.125rem; } #google_translate_element select { background-color: #fff; } @media(min-width:768px){ .footer__inner { grid-template-columns: repeat(4, 1fr); grid-template-rows: 1fr; justify-items: unset; } .footer__logo { grid-area: 1 / 1 / 2 / 2; justify-self: start; } .footer__sns { grid-area: 1 / 2 / 2 / 3; justify-self: start; } .footer__options { grid-area: 1 / 4 / 2 / 5; justify-self: end; } } @media(min-width:1400px){ .footer__sns .sns { margin-top: 1rem; } }  .copyright { display: flex; justify-content: space-between; flex-wrap: wrap; font-size: 12px; line-height: 1; padding: 1rem var(--x-gap); color: #fff; background-color: #121212; } .copyright img { height: 1.1em; vertical-align: middle; } @media(max-width:400px){ .copyright { justify-content: center; } }