﻿body {
    background: #000; /* 背景色 */
}

.xwrap {
    position: relative;
    z-index: 0;
    margin: 0;
    padding: 0;
    margin: auto;
    width: 500px;
}

.upright {
    position: absolute;
    margin: -250px 0 0 0;
    width: 40px;
    height: 500px;
    transform: skewX(-40deg);
    background: #222;
    top: 50%;
    left: 50%;
}

.downright-left {
    position: absolute;
    margin: -250px 0 0 -40px;
    width: 40px;
    height: 500px;
    transform: skewX(35deg);
    background: #222;
    top: 50%;
    left: 50%;
}

.downright-right {
    position: absolute;
    margin: -250px 0 0 60px;
    width: 40px;
    height: 500px;
    transform: skewX(35deg);
    background: #222;
    top: 50%;
    left: 50%;
}

.downright-top {
    position: absolute;
    margin: -250px 0 0 -165px;
    width: 60px;
    height: 30px;
    transform: skewX(35deg);
    background: #222;
    top: 50%;
    left: 50%;
}

.downright-bottom {
    position: absolute;
    margin: 220px 0 0 165px;
    width: 60px;
    height: 30px;
    transform: skewX(35deg);
    background: #222;
    top: 50%;
    left: 50%;
}

.downright-back {
    position: absolute;
    margin: -250px 0 0 0px;
    width: 60px;
    height: 500px;
    transform: skewX(35deg);
    background: #000;
    top: 50%;
    left: 50%;
}

.first-bright {
    animation-delay: 0s;
    animation: flash-first 6s infinite;
}

.second-bright {
    animation-delay: 0s;
    animation: flash-second 6s infinite;
}

@keyframes flash-first {
    24%, 64% {
        /* 光るよう影を重ねる */
        box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #fff inset, 0 0 70px #fff, 0 0 80px #fff, 0 0 100px #fff inset, 0 0 150px #fff inset;
    }
    0%, 16%, 72%, 100% {
        /* 光を打ち消すように暗くする */
        box-shadow: 0 0 10px #000, 0 0 20px #000, 0 0 30px #000, 0 0 40px #000 inset;
    }
}

@keyframes flash-second {
    40%, 72% {
        /* 光るよう影を重ねる */
        box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #fff inset, 0 0 70px #fff, 0 0 80px #fff, 0 0 100px #fff inset, 0 0 150px #fff inset;
    }
    0%, 24%, 80%, 100% {
        /* 光を打ち消すように暗くする */
        box-shadow: 0 0 10px #000, 0 0 20px #000, 0 0 30px #000, 0 0 40px #000 inset;
    }
}


