@charset "UTF-8";

/*--------------------------------------------------------
　プラグインやテンプレートパーツ等の自作パーツ系のスタイル
--------------------------------------------------------*/

/* =======================================
　パンくずリスト
======================================= */



/* =======================================
　SNSシェアボタン
======================================= */



/* =======================================
　コメント欄
======================================= */



/* =======================================
　ページャー（前の記事＆後の記事）
======================================= */



/* =======================================
　ページャー（記事数）
======================================= */



/* =======================================
　上に戻るボタン
======================================= */
#scroll-top img {
  background: var(--color-primary);
}


/* =======================================
　　固定お問い合わせボタン
======================================= */

#fixed-contact-btn.visible {
  position: fixed;
  bottom: 24px;
  left: auto;
  right: 0;
  z-index: 100;
  display: flex;
  width: 240px;
  opacity: 0;
  animation-name: fixed-contact;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

#fixed-contact-btn a {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 12px 0 12px 16px;
  text-align: center;
  text-decoration: none;
  font-size: var(--size-primary-font);
  transition: all .5s;
  white-space: nowrap;
  border-radius: 100px 0 0 100px;
  letter-spacing: 1px;
}

@keyframes fixed-contact {
  0% {
    opacity: 0;
    transform: translateX(100%);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}



@media screen and (max-width: 639px) {
  #fixed-contact-btn.visible {
    bottom: 16px;
  }
}