@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/


/* SWELLのデフォルト「トップへ戻るボタン」のスタイル上書き */
button#pagetop.c-fixBtn {
    background-color: #333 !important; /* 背景色 (濃いグレー/黒系) */
    width: 50px !important; /* ボタンの幅 */
    height: 50px !important; /* ボタンの高さ */
    border-radius: 8px !important; /* 角の丸み */
    border: none !important; /* 元のボーダーを消す */
    padding: 0 !important; /* 元のパディングを消す */
    box-shadow: none !important; /* 元のボックスシャドウを消す (もしあれば) */
    opacity: 1 !important; /* 元の透明度を上書き */
    visibility: visible !important; /* 元の表示状態を上書き */
    transform: translateY(0) !important; /* 元のtransformをリセット (もしあれば) */
    right: 20px; /* 位置 */
    bottom: 20px; /* 位置 */
    /* z-index: 10000 !important; */ /* 必要に応じて */
}

button#pagetop.c-fixBtn:hover {
    background-color: #555 !important;
    opacity: 0.9 !important;
}

/* SWELLのボタン内の既存のアイコンやテキストを非表示にする */
button#pagetop.c-fixBtn > * { /* このセレクタが <i class="c-fixBtn__icon..."> を対象にします */
    display: none !important;
}

/* 新しい矢印アイコンを疑似要素で作成 */
button#pagetop.c-fixBtn::before {
    content: '';
    position: absolute;
    top: 69%;
    left: 50%;
    width: 21px;
    height: 21px;
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    transform: translate(-50%, -75%) rotate(45deg);
    box-sizing: border-box;
}

/* @media (max-width: 992px) {
.p-fixBtnWrap {
		  bottom: 6.5em;
	}
}

@media (min-width: 960px) {
.p-fixBtnWrap {
        bottom: 0.5em!important;
        right: 1em!important;
    }
} */

/* ... 他のCSS ... */

/* 基本のPC表示など */
button#pagetop.c-fixBtn {
    position: fixed !important;
    bottom: -20px !important; /* PCでの通常位置 */
    right: -20px !important;
    z-index: 10000 !important;
}

/* 992px以下の画面幅 */
@media (max-width: 992px) {
    button#pagetop.c-fixBtn {
        bottom: 81px !important; /* 992px以下での位置 */
        right: 0px !important;
    }
}
/* 画面幅600px以下 (かつ401px以上を想定) */
@media (max-width: 600px) {
    button#pagetop.c-fixBtn {
        bottom: 90px !important; /* ご指定の値 */
        right: 0px !important; /* 600pxの時の右からの位置 (適宜調整) */
    }
}

/* 画面幅400px以下 (かつ321px以上を想定) */
/* 400pxでの指定が600px以下の指定を上書きするように、後に記述します */
@media (max-width: 400px) { /* `.entry-btn` の高さが95.2188px */
    button#pagetop.c-fixBtn {
        bottom: 78px !important; /* ご指定の値 */
        right: 0px !important; /* 400pxの時の右からの位置 (適宜調整) */
    }
}

/* 画面幅320px以下 */
/* 320pxでの指定が400px以下の指定を上書きするように、最も後に記述します */
@media (max-width: 320px) { /* `.entry-btn` の高さが86.5312px */
    button#pagetop.c-fixBtn {
        bottom: 74px !important; /* ご指定の値 */
        right:　0px !important; /* 320pxの時の右からの位置 (適宜調整) */
    }
}
