area:focus {
    outline: none;
}

.snowflakes-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 234vw;
    z-index: 1;
    border-radius: 500px 500px 0 0;
    box-sizing: border-box;
    z-index: 0;
    overflow: hidden;
    margin-top: 1.0666666667vw;
    margin-left: 1.0666666667vw;
    margin-right: 1.0666666667vw;
}

.snowflake__inner:before {
    background-color: #fff;
    border-radius: 100%;
}

.event_xmas {
    background: #000;
    overflow: hidden;
    position: relative;
}

.event_xmas {
    font-family: 'Roboto', 'Noto Sans KR', 'sans-serif';
    box-sizing: border-box;
}

    .event_xmas * {
        box-sizing: border-box;
    }

    .event_xmas input,
    .event_xmas button,
    .event_xmas select,
    .event_xmas textarea {
        font-family: 'Roboto', 'Noto Sans KR', 'sans-serif';
    }

    .event_xmas img {
        width: 100%;
        vertical-align: top;
    }

.event_xmas--gfit img {
    width: 100%;
}

.event_xmas--items {
    position: relative;
}

.event_xmas--buttons {
    position: absolute;
    bottom: 0;
    top: 0;
    width: 100%;
    z-index: 1;
}

    .event_xmas--buttons button {
        outline: 0 !important;
        box-shadow: 0 0 0 rgba(0, 0, 0, 0) !important;
        border: 0;
        position: absolute;
        background: none;
        display: flex;
        align-items: flex-end;
        justify-content: flex-end;
        padding: 0;
        margin: 0;
    }

        .event_xmas--buttons button.on .event_xmas--star {
            display: block;
        }

        .event_xmas--buttons button.on .event_xmas--light {
            opacity: 1;
            display: block;
        }

        .event_xmas--buttons button:nth-child(1) {
            left: 29.5893333333vw;
            bottom: 111.1626666667vw;
        }

            .event_xmas--buttons button:nth-child(1) .event_xmas--items {
                transform: rotateY(180deg);
            }

            .event_xmas--buttons button:nth-child(1) .event_xmas--date {
                top: 3.04vw;
                left: -1.7226666667vw;
                width: 7.4986666667vw;
                height: 5.776vw;
            }

            .event_xmas--buttons button:nth-child(1).on .event_xmas--date {
                transform: rotate(18deg);
                top: -4.56vw;
                left: 0.2026666667vw;
            }

        .event_xmas--buttons button:nth-child(2) {
            left: 51.4773333333vw;
            bottom: 110.96vw;
        }

            .event_xmas--buttons button:nth-child(2) .event_xmas--date {
                top: 3.2426666667vw;
                right: -2.0266666667vw;
                width: 7.4986666667vw;
                height: 4.9653333333vw;
            }

            .event_xmas--buttons button:nth-child(2).on .event_xmas--date {
                top: -4.0533333333vw;
                right: -0.5066666667vw;
                transform: rotate(-5deg);
            }

        .event_xmas--buttons button:nth-child(3) {
            left: 22.0906666667vw;
            bottom: 93.7333333333vw;
        }

            .event_xmas--buttons button:nth-child(3) .event_xmas--items {
                transform: rotateY(180deg);
            }

            .event_xmas--buttons button:nth-child(3) .event_xmas--date {
                top: 3.04vw;
                left: -1.9253333333vw;
                width: 8.1066666667vw;
                height: 5.8773333333vw;
            }

            .event_xmas--buttons button:nth-child(3).on {
                left: 20.7733333333vw;
                bottom: 89.68vw;
            }

                .event_xmas--buttons button:nth-child(3).on .event_xmas--date {
                    top: -4.6613333333vw;
                    right: auto;
                    left: 0.4053333333vw;
                    transform: rotate(18deg);
                }

        .event_xmas--buttons button:nth-child(4) {
            left: 41.1413333333vw;
            bottom: 90.6933333333vw;
        }

            .event_xmas--buttons button:nth-child(4) .event_xmas--date {
                top: 2.0266666667vw;
                right: 4.0533333333vw;
                width: 8.6133333333vw;
                height: 3.8506666667vw;
            }

            .event_xmas--buttons button:nth-child(4).on {
                left: 38.1013333333vw;
                bottom: 87.1466666667vw;
            }

                .event_xmas--buttons button:nth-child(4).on .event_xmas--date {
                    top: -3.4453333333vw;
                    right: 0.5066666667vw;
                    transform: rotate(-5deg);
                }

        .event_xmas--buttons button:nth-child(5) {
            left: 62.016vw;
            bottom: 90.9973333333vw;
        }

            .event_xmas--buttons button:nth-child(5) .event_xmas--items {
                transform: rotateY(160deg) rotate(-10deg);
            }

            .event_xmas--buttons button:nth-child(5) .event_xmas--date {
                top: 1.3173333333vw;
                right: 2.2293333333vw;
                width: 7.8026666667vw;
                height: 6.08vw;
            }

            .event_xmas--buttons button:nth-child(5).on {
                bottom: 88.16vw;
                left: 58.7733333333vw;
            }

                .event_xmas--buttons button:nth-child(5).on .event_xmas--items {
                    transform: rotateY(0deg);
                }

                .event_xmas--buttons button:nth-child(5).on .event_xmas--date {
                    top: -4.1546666667vw;
                    right: -0.608vw;
                    transform: rotate(-12deg);
                }

        .event_xmas--buttons button:nth-child(6) {
            left: 15.7066666667vw;
            bottom: 71.136vw;
        }

            .event_xmas--buttons button:nth-child(6) .event_xmas--items {
                transform: rotate(-10deg);
            }

            .event_xmas--buttons button:nth-child(6) .event_xmas--date {
                top: 4.256vw;
                left: -0.1013333333vw;
                width: 5.2693333333vw;
                height: 8.3093333333vw;
            }

            .event_xmas--buttons button:nth-child(6).on {
                left: 16.72vw;
                bottom: 68.704vw;
            }

                .event_xmas--buttons button:nth-child(6).on .event_xmas--items {
                    transform: rotateY(-180deg);
                }

                .event_xmas--buttons button:nth-child(6).on .event_xmas--date {
                    top: -2.6346666667vw;
                    left: -1.7226666667vw;
                    transform: rotate(7deg);
                }

        .event_xmas--buttons button:nth-child(7) {
            left: 39.4186666667vw;
            bottom: 65.056vw;
        }

            .event_xmas--buttons button:nth-child(7) .event_xmas--items {
                transform: rotateY(180deg) rotate(-20deg);
            }

            .event_xmas--buttons button:nth-child(7) .event_xmas--date {
                top: 1.0133333333vw;
                right: 1.824vw;
                width: 7.7013333333vw;
                height: 6.1813333333vw;
            }

            .event_xmas--buttons button:nth-child(7).on {
                left: 36.9866666667vw;
                bottom: 64.0426666667vw;
            }

                .event_xmas--buttons button:nth-child(7).on .event_xmas--items {
                    transform: rotateY(0deg);
                }

                .event_xmas--buttons button:nth-child(7).on .event_xmas--date {
                    top: 1.52pxvw;
                    right: -5.0666666667pxvw;
                    transform: rotate(34deg);
                }

        .event_xmas--buttons button:nth-child(8) {
            left: 59.6853333333vw;
            bottom: 69.1093333333vw;
        }

            .event_xmas--buttons button:nth-child(8) .event_xmas--date {
                top: 3.04vw;
                right: -2.0266666667vw;
                width: 7.904vw;
                height: 5.8773333333vw;
            }

            .event_xmas--buttons button:nth-child(8).on {
                left: 61.8133333333vw;
                bottom: 67.8933333333vw;
            }

                .event_xmas--buttons button:nth-child(8).on .event_xmas--date {
                    top: 2.2293333333vw;
                    right: -5.3706666667vw;
                    transform: rotate(28deg);
                }

        .event_xmas--buttons button:nth-child(9) {
            left: 13.376vw;
            bottom: 48.8426666667vw;
        }

            .event_xmas--buttons button:nth-child(9) .event_xmas--items {
                transform: rotateY(180deg) rotate(-2deg);
            }

            .event_xmas--buttons button:nth-child(9) .event_xmas--date {
                top: 3.04vw;
                left: -2.2293333333vw;
                width: 6.1813333333vw;
                height: 7.6vw;
            }

            .event_xmas--buttons button:nth-child(9).on {
                left: 12.9706666667vw;
                bottom: 46.816vw;
            }

                .event_xmas--buttons button:nth-child(9).on .event_xmas--date {
                    top: -2.2293333333vw;
                    left: -2.8373333333vw;
                }

        .event_xmas--buttons button:nth-child(10) {
            left: 38.7093333333vw;
            bottom: 41.952vw;
        }

            .event_xmas--buttons button:nth-child(10) .event_xmas--date {
                top: 1.6213333333vw;
                right: -0.8106666667vw;
                width: 8.4106666667vw;
                height: 4.9653333333vw;
            }

            .event_xmas--buttons button:nth-child(10).on {
                left: 35.9733333333vw;
                bottom: 39.52vw;
            }

                .event_xmas--buttons button:nth-child(10).on .event_xmas--date {
                    top: 1.824vw;
                    right: -5.776vw;
                    transform: rotate(40deg);
                }

        .event_xmas--buttons button:nth-child(11) {
            left: 62.5226666667vw;
            bottom: 45.0933333333vw;
        }

            .event_xmas--buttons button:nth-child(11) .event_xmas--items {
                transform: rotateY(180deg) rotate(-14deg);
            }

            .event_xmas--buttons button:nth-child(11) .event_xmas--date {
                top: 1.216vw;
                right: 1.6213333333vw;
                width: 7.904vw;
                height: 5.9786666667vw;
            }

            .event_xmas--buttons button:nth-child(11).on {
                left: 62.2186666667vw;
                bottom: 42.56vw;
            }

                .event_xmas--buttons button:nth-child(11).on .event_xmas--items {
                    transform: rotateY(0deg) rotate(0deg);
                }

                .event_xmas--buttons button:nth-child(11).on .event_xmas--date {
                    top: 2.0266666667vw;
                    right: -5.0666666667vw;
                    transform: rotate(30deg);
                }

.event_xmas .event_xmas--buttons button {
    width: 19.2533333333vw;
    height: 24.8266666667vw;
}

.event_xmas--light {
    position: absolute;
    bottom: 5.0666666667vw;
    right: -6.2826666667vw;
    display: none;
    opacity: 0.8;
    animation: blink-transition 0.8s ease-in-out infinite;
    width: 0;
    width: 22.2933333333vw;
    height: 20.2666666667vw;
}

.event_xmas--star {
    display: none;
    position: absolute;
    right: 6.2826666667vw;
    bottom: 5.0666666667vw;
    animation: dungdung2 2s ease-in-out infinite;
    width: 4.3573333333vw;
    height: 4.6613333333vw;
}

    .event_xmas--star + .event_xmas--star {
        right: -2.0266666667vw;
        bottom: 12.16vw;
        animation: dungdung1 3s ease-in-out infinite;
        width: 1.824vw;
        height: 2.0266666667vw;
    }

.event_xmas--date {
    position: absolute;
}

@keyframes blink-transition {
    0% {
        opacity: 0.5;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0.5;
    }
}

@keyframes dungdung1 {
    0% {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(0, 8px);
    }
}

@keyframes dungdung2 {
    0% {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(1px, 3px);
    }
}