/* -------------------------------------------------- 스와이퍼 -------------------------------------------------- */

.swiper {
    width: 100%;
    z-index: 0;
}

div.swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.swiper-wrapper.flow {
    pointer-events: none;
    transition-timing-function: linear;
}

/* -------------------------------------------------- 레이아웃 ----------------------------------------------------- */


.ovhd {
    overflow: hidden;
}

.show {
    display: flex !important;
}

.absol {
    position: absolute;
}

.rltv {
    position: relative;
}

.flexrow {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
}

.flexcol {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.w100 {
    width: 100%;
}

.h100 {
    height: 100%;
}

.wd_unset {
    width: unset;
}

.h100_obc {
    height: 100%;
    object-fit: cover;
}


.fcc {
    display: flex;
    justify-content: center;
    align-items: center;
}

.fdc {
    display: flex;
    flex-direction: column;
}

.fdcc {
    display: flex;
    flex-direction: column;
    align-items: center;
}

*::selection {
    background: #00000090;
    color: #fff;
}

/* -------------------------------------------------- 애니메이션 ----------------------------------------------------- */

@keyframes marqueeX {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-100%);
    }
}

@keyframes marqueeX_r {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(100%);
    }
}

@keyframes sbmit_blk {

    0%,
    100% {
        background: #e40001;
        color: #fdd900;
    }

    50% {
        background: #fdd900;
        color: #e40001;
    }
}

@keyframes color_blk {

    0%,
    100% {
        color: #fdd900;
    }

    50% {
        color: #e40001;
    }
}

@keyframes sway {

    0%,
    100% {
        transform: rotate(-1deg);
    }

    50% {
        transform: rotate(1deg);
    }
}

@keyframes ddmY {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(10%);
    }
}


@keyframes sway2 {
    50% {
        transform: rotate(1deg);
    }
}

@keyframes smoke {
    0% {
        transform: translate(0, 30%);
        opacity: 0;
    }

    25% {
        opacity: 0.8;
    }

    50% {
        opacity: 1;
    }

    75% {
        opacity: 0.8;
    }

    100% {
        opacity: 0;
    }
}

.smoke {
    animation: smoke infinite 5s ease-in-out;
}


.ddmY {
    animation: ddmY 3s infinite ease-in-out;
}

.ddmY2 {
    animation: ddmY 3s 0.1s infinite ease-in-out;
}

.ddmY3 {
    animation: ddmY 3s 0.2s infinite ease-in-out;
}

.ddmY4 {
    animation: ddmY 3s 0.3s infinite ease-in-out;
}

.ddmY5 {
    animation: ddmY 3s 0.4s infinite ease-in-out;
}

.sway_top {
    animation: sway 2s infinite ease-in-out;
    transform-origin: top;
}

.sway_bot {
    animation: sway 2s infinite ease-in-out;
    transform-origin: bottom;
}

.sway_left_top {
    animation: sway 2s infinite ease-in-out;
    transform-origin: top left;
}

.sway_right_top {
    animation: sway 2s infinite ease-in-out;
    transform-origin: right top;
}

.sway_left_bot {
    animation: sway 2s infinite ease-in-out;
    transform-origin: left bottom;
}

.sway_right_bot {
    animation: sway 2s infinite ease-in-out;
    transform-origin: right bottom
}

.color_blk {
    animation: color_blk 2s steps(1) infinite;
}

.sbmit_blk {
    animation: sbmit_blk 2s steps(1) infinite;
}

.image_sd_wrap {
    overflow: hidden;
}

.image_sd .absol {
    left: 100%;
}

.image_sd_r .absol {
    right: 100%;
}

.image_sd {
    animation: marqueeX 20s infinite linear;
}

.image_sd_r {
    animation: marqueeX_r 20s infinite linear;
}

/* --------------------------------------------------------------------------------------- */

.rot180 {
    transform: rotate(180deg);
}


/* --------------------------------------------------------------------------------------- */

.c_fff {
    color: #fff;
}

.bg_fff {
    background: #fff;
}

.c_000 {
    color: #000;
}

.bg_000 {
    background: #000;
}

.c_111 {
    color: #111;
}

.bg_111 {
    background: #111;
}

.c_777 {
    color: #777;
}

.c_ddd {
    color: #ddd;
}


.bg_yell {
    background: #ffd900;
}

.c_yell {
    color: #ffd900;
}

.c_red {
    color: #e70012;
}

.bg_red {
    background: #e70012;
}

.c_gren {
    color: #009943;
}

.bg_gren {
    background: #009943;
}

/* -------------------- */