@charset "UTF-8";

body {
	overflow-x: hidden;
}

#main_container {
    text-align: center;
    width: 100vw;
}

#logo {
    width: 100vw;
}

#logo .box {
    height: 100%;
    width: 100vw;
    animation: logo-shake .2s infinite;
    overflow: hidden;
}
#logo img {
    height: auto;
    max-width: 100vw;
    max-height: 80vh;
    animation: logo-slide 2.5s infinite linear both;
}

@keyframes logo-shake {
    0% {transform: translate(0px, 0px) rotateZ(0deg)}
    25% {transform: translate(3px, 3px) rotateZ(2deg)}
    50% {transform: translate(0px, 3px) rotateZ(0deg)}
    75% {transform: translate(3px, 0px) rotateZ(-2deg)}
    100% {transform: translate(0px, 0px) rotateZ(0deg)}
}

@keyframes logo-slide {
    from {
      transform: translateX(100%);
    }
    to {
      transform: translateX(-100%);
    }
}

#title .kokin_tv_name {
    margin: 0 auto;
    font-family: "HGP創英角ﾎﾟｯﾌﾟ体";
    font-size: 4.5rem;
    color: #DC143C;
}