@charset "utf-8";
/* CSS Document */
/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓
フェード
〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/

.fade,
.fade_block .fade_blocl_child {
    opacity: 0;
    transform: translate(0, 0) scale(1.003);
    /* ぼかし */
    filter: blur(1px);

    /* 左から出てくる */
    &.fade_left {
        transform: translateX(-1rem);
    }
    /* 右から出てくる */
    &.fade_right {
        transform: translateX(1rem);
    }
    /* かなり下から出てくる */
    &.fade_bottom {
        transform: translateY(2rem);
    }
    &.logo_a,
    &.town_a {
        transform: translateY(0.5rem);
    }
    &.logo_b,
    &.town_b {
        transform: translateY(-0.5rem);
    }
}

/* 発火 */
.fade.fade_in,
.fade_block.fade_in .fade_blocl_child {
    opacity: 1;
    transition: all 0.8s cubic-bezier(0.4, 0.4, 0, 1);
    transform: translate(0, 0) scale(1);
    /* ぼかし */
    filter: blur(0);

    &.logo_a,
    &.town_a,
    &.logo_b,
    &.town_b {
        transition: all 1.2s cubic-bezier(0.4, 0.4, 0, 1);
    }
}

/* ディレイ */
.fade,
.fade_block {
    &.fade_in,
    &.fade_in .fade_blocl_child {
        .fade_delay_01s {
            transition-delay: 0.1s;
        }
        .fade_delay_02s {
            transition-delay: 0.2s;
        }
        .fade_delay_03s {
            transition-delay: 0.3s;
        }
        .fade_delay_04s {
            transition-delay: 0.4s;
        }
        .fade_delay_05s {
            transition-delay: 0.5s;
        }
        .fade_delay_06s {
            transition-delay: 0.6s;
        }
        .fade_delay_07s {
            transition-delay: 0.7s;
        }
        .fade_delay_08s {
            transition-delay: 0.8s;
        }
        .fade_delay_09s {
            transition-delay: 0.9s;
        }
        .fade_delay_10s {
            transition-delay: 1s;
        }
        .fade_delay_11s {
            transition-delay: 1.1s;
        }
        .fade_delay_12s {
            transition-delay: 1.2s;
        }
        .fade_delay_13s {
            transition-delay: 1.3s;
        }
        .fade_delay_14s {
            transition-delay: 1.4s;
        }
        .fade_delay_15s {
            transition-delay: 1.5s;
        }
        .fade_delay_16s {
            transition-delay: 1.6s;
        }
        .fade_delay_17s {
            transition-delay: 1.7s;
        }
        .fade_delay_18s {
            transition-delay: 1.8s;
        }
        .fade_delay_19s {
            transition-delay: 1.9s;
        }
        .fade_delay_20s {
            transition-delay: 2s;
        }
        .fade_delay_21s {
            transition-delay: 2.1s;
        }
        .fade_delay_22s {
            transition-delay: 2.2s;
        }
        .fade_delay_23s {
            transition-delay: 2.3s;
        }
        .fade_delay_24s {
            transition-delay: 2.4s;
        }
        .fade_delay_25s {
            transition-delay: 2.5s;
        }
        .fade_delay_26s {
            transition-delay: 2.6s;
        }
        .fade_delay_27s {
            transition-delay: 2.7s;
        }
        .fade_delay_28s {
            transition-delay: 2.8s;
        }
        .fade_delay_29s {
            transition-delay: 2.9s;
        }
        .fade_delay_30s {
            transition-delay: 3s;
        }
        .fade_delay_31s {
            transition-delay: 3.1s;
        }
        .fade_delay_32s {
            transition-delay: 3.2s;
        }
        .fade_delay_33s {
            transition-delay: 3.3s;
        }
        .fade_delay_34s {
            transition-delay: 3.4s;
        }
        .fade_delay_35s {
            transition-delay: 3.5s;
        }
        .fade_delay_36s {
            transition-delay: 3.6s;
        }
        .fade_delay_37s {
            transition-delay: 3.7s;
        }
        .fade_delay_38s {
            transition-delay: 3.8s;
        }
        .fade_delay_39s {
            transition-delay: 3.9s;
        }
        .fade_delay_40s {
            transition-delay: 4s;
        }
        .fade_delay_50s {
            transition-delay: 5s;
        }
        .fade_delay_60s {
            transition-delay: 6s;
        }
    }
}
/* トップページ */

body.home .main_img_wrap {
    &.fade_block {
        .fade_blocl_child {
            &.bg {
                filter: blur(3px);
            }
        }
        &.fade_in {
            .fade_blocl_child {
                &.bg {
                    filter: blur(0);
                    transition: all 1s ease;
                    transition-delay: 0.2s;
                }
                &.line {
                    transition: all 2s cubic-bezier(0.4, 0.4, 0, 1);
                    transition-delay: 1.5s;
                }
            }
        }
    }
}