@charset "utf-8";

/*====================================
   戻るボタン全体
====================================*/
    #backToTop {
      position: fixed;
      right: 20px;
      bottom: 25px;
      width: 40px;
      height: 40px;
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.4s ease, visibility 0.4s ease;
      cursor: pointer;
      z-index: 9999;
    }

    #backToTop img {
      width: 100%;
      height: auto;
      display: block;
    }

    #backToTop.show {
      opacity: 1;
      visibility: visible;
    }


/*=========================================================
    ※戻るボタンの基本スタイル
右下50pxの余白と、フェード（不透明度）のアニメーションを定義。
=========================================================*/
/* ページトップボタンの基本スタイル */
.pagetop {
    position: fixed;
    right: 50px;
    bottom: 50px;
    width: 40px;
    height: 40px;
    z-index: 999;
/* 初期状態は非表示（透明かつクリック不可） */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s, visibility 0.5s;
    cursor: pointer;
}

/* 表示状態のクラス（JSで切り替え） */
.pagetop.is-show {
    opacity: 1;
    visibility: visible;
}

/* ボタン内の画像調整 */
.pagetop img {
    width: 100%;
    height: auto;
    display: block;
}

/* スマホ対応：画面が小さい場合は余白を少し調整（任意） */
@media (max-width: 768px) {
    .pagetop {
        right: 20px;
        bottom: 20px;
    }
}