.gtm-noscript {
  display: none;
  visibility: hidden;
}

.copyright-company {
  float: left;
  margin-block-end: 0;
  margin-inline-start: 20px;
}

#footer .copyright-company a {
  color: #000;
}

/* テーマの transition: all だと、Swiper が初期化で決めるスライド幅の変化までアニメーションしてズームして見えるため、ホバーの演出だけに絞る */
#key .swiper-slide {
  transition-property: box-shadow, background-color;
}

/* 2 ページ目以降はスライダー（#key）を出さず一覧がヘッダーに付くため、#key の下の余白（テーマの値）と同じだけ空ける */
.home.paged #main {
  padding-block-start: 60px;
}

@media (max-width: 599px) {
  .home.paged #main {
    padding-block-start: 30px;
  }
}

/* Swiper の初期化前は 1 枚目が全幅で描かれ、初期化で 3 枚並びに変わって右から出てくるように見えるため、初期化前から同じ並びにしておく。
   600px は site.js の breakpoints と揃える */
@media (min-width: 600px) {
  #key .swiper-container:not(.swiper-initialized) .swiper-slide {
    width: calc(100% / 3);
  }
}

/* スマホのフッター。Keywords は直前のサイドバーに同じ 20 個が並ぶため出さず、Category はタップしやすい 2 列のボタンにする */
@media (max-width: 599px) {
  /* テーマはロゴを横幅 66% まで広げるが、枠の高さが 36px のままで、はみ出たロゴが下の見出しに重なるため、高さを中身に合わせる */
  #footer .logo {
    height: auto;
  }

  /* 右下に絶対配置される「ページの先頭へ」が最後の行のボタンに重ならないよう、下を空ける */
  #footer .footer-left .nav {
    padding-block-end: 56px;
  }

  #footer .footer-left .nav ul.x2 {
    display: none;
  }

  /* テーマが width: 48% !important を付けているため、!important を重ねず min-width で全幅にする */
  #footer .footer-left .nav ul:not(.x2) {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    min-width: 100%;
  }

  #footer .footer-left .nav .tit {
    grid-column: 1 / -1;
    margin-bottom: 4px;
    font-size: 1.4rem;
  }

  #footer .footer-left .nav ul li a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding-inline: 8px;
    font-size: 1.4rem;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #dcdcdc;
    border-radius: 4px;
  }
}
