.scroll_down p{
    opacity: 1;
    -webkit-transition: all .5s ease-in 3s;
    transition: all .5s ease-in 3s;
  }
  
  .scroll_down p{
    color: white;
    position: absolute;
    bottom: 10px;
    left: 50%;
    display: block;
    background-size: 14px auto;
    z-index: 2;
    text-decoration: none; 
    transform: translate(-50%, -50%);
  }
  
  .scroll_down p:before {
    position: absolute;
    top: calc(50% + 24px);
    left: calc(50% - 8px);
    transform: rotate(-45deg);
    display: block;
    width: 12px;
    height: 12px;
    content: "";
    border: 2px solid white;
    border-width: 0px 0 2px 2px;
    animation: bounce 2s linear infinite;
  }
  
  .scroll_down p:after {
    position: absolute;
    width: 32px;
    height: 32px;
    border: 2px solid white;
    content: "";
    border-radius: 50%;
    top: calc(50% + 16px);
    left: calc(50% - 19px);
  }
  
  @keyframes bounce {
    0%,
    100%,
    20%,
    50%,
    70%,
    80% {
      -webkit-transform: translateY(0)rotate(-45deg);
      -ms-transform: translateY(0)rotate(-45deg);
      transform: translateY(0)rotate(-45deg);
    }
    40% {
      -webkit-transform: translateY(-8px)rotate(-45deg);
      -ms-transform: translateY(-8px)rotate(-45deg);
      transform: translateY(-8px)rotate(-45deg);
    }
    60% {
      -webkit-transform: translateY(-4px)rotate(-45deg);
      -ms-transform: translateY(-4px)rotate(-45deg);
      transform: translateY(-4px)rotate(-45deg);
    }
  }
.f_content2 p{
    margin:0;
}

/* 点滅 */
.bg-wp{
    text-align: center;
    margin-top:10%;
    margin-bottom: 10%;
}
.blinking{
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
 .fotter img{
    width: 50%;
  }
  .f_content3 img{
    width:80%;
  }
  .make{
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .make p{
    margin:0;
    font-size: 150%;
    width:fit-content;
    border:0.8px;
    border-style: solid;
    border-radius: 30px;
  }
  .f_content1{
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .f_content2{
    padding:10%;
    padding-top: 0;
    border-bottom: 1px solid white;
    flex-flow: column;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .f_content3{
    padding:10%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  body{
    font-family:"Century Gothic", sans-serif;
   }
   .hed_tx{
    padding-left: 10%;
    padding-right: 10%;
   }
   .hed_tx p{
    margin:0;
   }
   .men{
        margin-left:15%;
    }
    .men_wp{
        display: flex;
        flex-wrap: wrap;
    }
    .rulu h2{
        text-align: center;
        
    }
    .fotter{
        box-sizing: border-box;
        padding:5%;
        color:white;
        background-color: #9b5ea2;
        width:100%;
        
    }
    html{
        height:100%;
        width:100%;
    }
    .hed{
        color:white;
        width:100%;
        height:100vh;
        padding:5%;
        background-color: #9b5ea2;
        box-sizing: border-box;
        display:flex;
        flex-flow: column;
    }
    .rulu{
        padding-top: 30%;
    }

    .event-content p{
      margin:1%;
    }
    .event-content1{
      margin:2%;
    }
    .event-content2{
      margin:2%;
    }
    .event-content3{
      margin:2%;
    }
    .event-content4{
      margin:2%;
    }
    .event-content{
      margin:1%;
    }
    .play-content{
      margin:1%;
    }
    .play-content p{
      margin:2%;
    }
    .eat-content{
      margin:1%;
    }
    .eat-content p{
      margin:2%;
    }
    .hed img{
      width: 80%;
    }
    .hed h1{
        text-align: center;
        margin:0;
    }
    body{
        height:100%;
        width:100%;
        margin:0;
    }
    .home{
        flex-wrap: wrap;
        display: flex;
        justify-content: space-between;
        width:80%;
        margin: auto;
    }
    .home-wp{
        padding:2%;
    }
    .home-in{
        width: fit-content;
    }
    .cb01{
    margin-top: 10%;
    position:relative;
    transform-style:preserve-3d;
    width:150px;
    height:150px;
    left:75px;
    transition:1.5s;
    transform:rotateX(-10deg) rotateY(-10deg) rotateZ(0deg);
    text-align: center;
    margin: 0 auto
    }
    .cb01 div{
    position:absolute;
    box-sizing:border-box;
    width:100%;
    height:100%;
    border-radius:5px;
    border:3px solid #7d528a;
    background-color:#9b5ea2;
    }
    .cbs1{
    background-image:
    radial-gradient(circle at 50% 50%,#ff0000ff 19%,#ff000000 20%);
    transform:translateZ(75px);
    }
    .cbs2{
    background-image:
    radial-gradient(circle at 75% 25%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 25% 75%,white 10%,#00000000 11%);
    transform:rotateY(90deg) translateZ(75px);
    }
    .cbs3{
    background-image:
    radial-gradient(circle at 75% 25%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 50% 50%,white 15%,#00000000 16%)
    ,radial-gradient(circle at 25% 75%,white 10%,#00000000 11%);
    transform:rotateX(90deg) translateZ(75px);
    }
    .cbs4{
    background-image:
    radial-gradient(circle at 25% 25%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 25% 75%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 75% 25%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 75% 75%,white 10%,#00000000 11%);
    transform:rotateX(-90deg) translateZ(75px);
    }
    .cbs5{
    background-image:
    radial-gradient(circle at 25% 25%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 25% 75%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 50% 50%,white 15%,#00000000 16%)
    ,radial-gradient(circle at 75% 25%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 75% 75%,white 10%,#00000000 11%);
    transform:rotateY(-90deg) translateZ(75px);
    }
    .cbs6{
    background-image:
    radial-gradient(circle at 25% 25%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 25% 50%,white 12%,#00000000 13%)
    ,radial-gradient(circle at 25% 75%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 75% 25%,white 10%,#00000000 11%)
    ,radial-gradient(circle at 75% 50%,white 12%,#00000000 13%)
    ,radial-gradient(circle at 75% 75%,white 10%,#00000000 11%);
    transform:rotateY(180deg) translateZ(75px);
    }
    /* スマホ用のCSSはメディアクエリの外に記述する */

@media screen and (min-width: 481px) {
	/* 481px以上に適用されるCSS（タブレット用） */
  .hed img{
    width: 45%;
  }
  .fotter img{
    width: 30%;
  }
}
@media screen and (min-width: 960px) {
	/* 960px以上に適用されるCSS（PC用） */
  .hed img{
    width: 35%;
  }
  .fotter img{
    width: 20%;
  }
  .f_content3 img{
    width:40%;
  }
  .hed_tx{
    padding-left: 30%;
    padding-right: 30%;
   }
   .home{
    align-items: center;
    flex-flow: column;
    flex-wrap: wrap;
    display: flex;
    justify-content: center;
    width:80%;
    margin: auto;
  }
  .rulu{
    padding-top: 10%;
}
}