/* CTA-PC フローティングバナー用CSS */

/* CTA-PC セクション基本スタイル */
.cta-pc-section {
    display: block;
}

.cta-pc-container {
    max-width: 100%;
    margin: 0 auto;
}

.cta-pc-column {
    display: block;
}

.cta-pc-col-100 {
    width: 100%;
}

.cta-pc-widget-wrap {
    position: relative;
}

.cta-pc-element {
    position: relative;
}

.cta-pc-widget {
    display: block;
}

.cta-pc-widget-image {
    text-align: center;
}

.cta-pc-widget-container {
    position: relative;
}

/* レスポンシブ対応 - タブレット・モバイルで非表示 */
@media (max-width: 1024px) {
    .cta-pc-hidden-tablet {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .cta-pc-hidden-mobile {
        display: none !important;
    }
}

/* フローティングバナーのメインコンテナ */
.fixed-pc-bnr {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 9999;
}

/* フローティングバナーの画像部分 */
.fixedpc-image {
    position: relative;
    transition: all 0.2s;
    top: 0;
    right: 0;
}

/* フローティングバナーの影効果 */
.fixedpc-image::before {
    content: "";
    position: absolute;
    top: 6px;
    right: -1px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: -1;
    border-radius: 10px;
    transition: all 0.2s;
}

/* ホバー時のバナー本体の動き */
.fixedpc-image:hover {
    top: 6px;
    right: -1px;
}

/* ホバー時の影の変化 */
.fixedpc-image:hover::before {
    top: 0px;
    right: 0px;
    background-color: transparent;
}

/* モバイル・タブレット用のバナーコンテナ */
.fixedsp-bnr_box {
    max-width: 355px;
    width: 100%;
    display: block;
    margin: 0 auto;
}