@font-face {
    font-family: NotoSansJP;
    src: url(fonts/NotoSansJP-min.woff) format("woff");
  }
  @font-face {
    font-family: Akira Expand;
    src: url(fonts/Akira\ Expanded\ Demo.otf);
  }
  @font-face {
    font-family: HK Grotesk;
    src: url(fonts/HKGrotesk-Black.otf);
  }



  body{
    font-family:"NotoSansJP","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
    font-size: 1.317vw;
    background-position: 50% 50%;
    background-size: cover;
    -webkit-appearance: none;
    -webkit-text-size-adjust: 100%;
    padding: 0;
    margin: 0;
    background: #efefef;
    color: white;
    width: 100vw;
    overflow-x: hidden;
  }

  html{
    overflow-x: hidden;
    resize: horizontal;
    background-color: #efefef;
    width: 100vw;
  }

  a{
    cursor: pointer;
  }

p{
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

h1{
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

h2{
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

h3{
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

header{
  position: fixed;
  top: 0;
  width:100vw;
  z-index: 1000;
  font-family: a-otf-ryumin-pr6n,serif;
}

header p{
  font-size: 0.56vw;
  width: 2.304vw;
  text-align: left;
  box-sizing: border-box;
  /*ヘッダー文字サイズ*/
}

.top{
  width: 100vw;
  overflow-x: hidden;
  height: 100vh;
  top: 0;
  position:relative;
  background-image: url(hello-photos/hello_top.jpg);
  border-radius: 0px 0px 0px 5vw;
  background-size: cover;
  color: white;
  /*TOPの背景*/
}

.pro-top{
    top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      width: 15vw;
    position: absolute;
    font-size: 3vw;
    text-align: left;
    color: white;
}
.pro-top img{
    width: 15vw;
}


.sc{
    font-family: a-otf-ryumin-pr6n,serif;
    writing-mode: vertical-rl;
    margin-left: 4.55vw;
    letter-spacing: 0.263vw;
    top: 79%;
    box-sizing: border-box;
    position: absolute;
    color: black;
    font-size: 0.79vw;
  }

.tate::after{
    content: "";
      /*描画位置*/
    position: absolute;
    margin-left: 5vw;
    top: 90vh;
    height: 15vh;
    width: 0.039vw;
    background: black;
    position: absolute;
      /*線の形状*/
    width: 0.066vw;
    height: 6.583vw;
    background: black;
      /*線の動き1.4秒かけて動く。永遠にループ*/
    animation: pathmove 1.4s ease-in-out infinite;
    opacity:0;
    z-index: 100;
  }

  /*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
    0%{
      height:0;
      top:42vw;
      opacity: 0;
    }
    30%{
      height:6.583vw;
      opacity: 1;
    }
    100%{
      height:0;
      top:60vw;
      opacity: 0;
    }
  }

  .footer-sp{
    display: none;
  }
  
  footer{
    color: black;
    background-color: white;
    width: 100vw;
    bottom: 0; /*下に固定*/
    font-family: a-otf-ryumin-pr6n,serif;
    overflow: hidden;
    padding-top: 12vh;
    padding-bottom: 4vh;
  }
  
  .icons{
    display: flex;
    gap: 2.633vw;
    flex-wrap: nowrap;
    height: 5.267vw;
    margin-bottom: 3.95vw;
    padding-left: 10vw;
  }
  .icons img{
    width: 2.633vw;
  }
  .icons a:last-child{
    padding-top: 0.461vw;
  }
  .icons a:first-child{
    padding-top: 0.132vw;
  }
  
  .mokuzi{
    display: flex;
    gap: 5.267vw;
    margin-bottom: 1.975vw;
    padding-left: 10vw;
  }
  .mokuzi-hello{
    margin-bottom: 25vh;
    display: flex;
    gap: 1.975vw;
    padding-left: 10vw;
  }
  .mokuzi-hello a{
    text-decoration: none;
    color: black;
    font-size: 1.975vw;
    cursor: pointer;
  }
  .mokuzi-sp{
    display: none;
  }
  .mokuzi a{
    text-decoration: none;
    color: black;
    letter-spacing: 0.263vw;
    font-size: 1.975vw;
    width: auto;
    cursor: pointer;
  }
  .mokuzi a:hover{
    color: #cacaca;
  }
  .mokuzi-hello a:hover{
    color: #cacaca;
  }
  
  .top_bottom{
    width: 70vw;
    list-style: none;
    margin-bottom: 25vh;
    padding-left: 10vw;
  }
  .top_bottom li a{
    text-decoration: none;
    color: black;
    font-size: 20px;
    margin-bottom: 0.987vw;
  }
  
  
  
  .footer-line{
    width: 80vw;
    height: 0.066vw;
    margin: 0;
    margin-left: 10vw;
    margin-bottom: 10px;
  }
  
  .footer-p{
    display: inline-block;
    margin-right: 0vw;
    padding-left: 10vw;
    width: 50vw;
    vertical-align: top;
  }
  
  .footer-p p a{
    text-decoration: none;
    color: black;
    margin-top: -10vw;
    margin-left: -10vw;
    padding-left: 10vw;
    font-size: 5px;
  }
  
  .footer-p p{
    font-size: 5px;
  }
  
  .top_svg{
    width: 20vw;
    margin-top: 3.621vw;
    margin-left: 5vw;
  }
  
  
  .pc-menu{
    display: flex;
    gap: 3vw;
    margin-top: 4.279vw;
    margin-left: 60vw;
    color: #efefef;
  }
  .pc-menu a{
    text-decoration: none;
    color: #efefef;
  }
  .pc-menu-hello{
    display: flex;
    gap: 3vw;
    margin-top: 4vw;
    margin-left: 60vw;
  }
  .pc-menu-hello a{
    text-decoration: none;
    color: black;
  }
  
  .h-menu{
    margin-top: 3vh;
    position: relative;
    margin-left: 95vw;
    display: none;
  }
  
  /*inputのcheckboxは非表示に*/
  .h-menuCheckbox {
    display:none;
  }
  
  /*ハンバーガーメニュー*/
  header p{
      font-weight: bold;
  }
  
  .h-menu{
    border-radius: 50%;
    width: 3.292vw;
    height: 3.292vw;
    text-align: center;
  }
  
  .h-menu_icon {
      display: inline-block;
      width: 10vw;
      height: 10vw;
      vertical-align: middle;
      text-align: center;
      cursor: pointer;
      background-color: white;
      border-radius: 50%;
      -moz-border-radius: 50%;
      -webkit-border-radius: 50%;
  }
  
  .hamburger-icon p{margin-top: 1.646vw;}
  
  /*3本線*/
  .hamburger-icon, .hamburger-icon::before, .hamburger-icon::after {
      content: '';
      display: inline-block;
      position: absolute;
      z-index: 100;
      top: 2.7vw;
      width: 4vw;
      height: 0.6vw;
      padding-left: 2vw;
      background: black;
      cursor: pointer;
      text-align: center;
      left: 2.0vw;
  }
  .hamburger-icon:before {
      top: 1.8vw;
      left: 0;
  }
  .hamburger-icon:after {
      top: 3.8vw;
      left: 0;
  }
  
  /*メニュー以外を暗くする*/
  #h-menu_black {
      display: none;
      position: fixed;
      z-index: 98;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: black;
      opacity: 0;
      transition: .7s ease-in-out;
  }
  
  /*中身*/
  #h-menu_content {
      position: fixed;
      top: 0;
      left: 0;
      background: white;
      color: black;
      z-index: 99;
      /*width: 100%;
      max-width: 21.066vw;*/
      width: 100vw;
      height: 100vh;
      padding: 1.053vw 1.053vw 1.053vw;
      overflow: auto;
      transition: .3s ease-in-out;
      -webkit-transform: translateX(-105%);
      transform: translateX(-105%);
  }
  
  .first{
    margin-top: 10vh;
    margin-left: -2vw;
    text-align: left;
  }
  
  .first li{
    font-size: 6vw;
    letter-spacing: 1vw;
    margin-top: 3.4vw;
    margin-bottom: 0.987vw;
    list-style: none;
    cursor: pointer;
  }
  
  .first a{
    text-decoration: none;
    color: black;
  }
  
  .second{
    margin-top: 15vh;
    margin-left: -2vw;
    text-align: left;
  }
  
  .second li{
    font-size: 4vw;
    margin-top: 0.987vw;
    margin-bottom: 0.987vw;
    list-style: none;
    cursor: pointer;
  }
  
  .second a{
    text-decoration: none;
    color: black;
  }
  
  .kaisei p{
    padding-top: 0.329vw;
    font-size: 1.975vw;
    height: 3.292vw;
    width: 26.333vw;
  }
  
  /*チェックボックスにチェックが入ったら表示*/
  input:checked ~ .h-menu_icon .hamburger-icon{
      background: transparent;
      height: 1.975vw;
  }
  input:checked ~ .h-menu_icon .hamburger-icon::before{
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
      top:0.658vw;
      z-index:999;
  }
  input:checked ~ .h-menu_icon .hamburger-icon::after{
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
      top:0.658vw;
      z-index:999;
  }
  input:checked ~ #h-menu_black {
      display: block;
      opacity: .8;
  }
  #h-menu_checkbox:checked ~ #h-menu_content {
      -webkit-transform: translateX(0%);
      transform: translateX(0%);
      box-shadow: 6px 0 25px rgba(0,0,0,.15);
  }
  .h-menu_icon .hamburger-icon,
  .h-menu_icon .hamburger-icon::before,
  .h-menu_icon .hamburger-icon::after,
  #h-menu_black,
  #h-menu_content{
      -webkit-transition: all .3s;
      transition: all .3s;
  }
  
  /*#h-menu_content ul{
      list-style: none;
      margin: 0;
      padding: 0;
  }
  #h-menu_content ul li{
      border-bottom: solid 1px white;
  }
  #h-menu_content li a {
      display: block;
      color: white;
      font-size: 0.922vw;
      padding: 1.58vw;
      text-decoration: none;
      transition-duration: 0.2s;
  }*/
  #h-menu_content li a:hover {
      background: #cacaca;
  }

  .foo{
    display: inline-block;
    width: 30vw;
    text-align: right;
    vertical-align: top;
  }
  .footer-p{
    display: inline-block;
  }
  
  .kaisei-header{
    width: 55vw;
    height: 8vh;
      margin-top: 8vw;
      margin-left: 6vw;
  }
  .kaisei-header svg{
    width: 55vw;
  }
  .kaisei-header svg image{
    width: 55vw;
  }





  

  .all-pro{
      display: flex;
      width: 90vw;
      height: 130vh;
      padding-left: 5vw;
      padding-right: 5vw;
      padding-top: 10vh;
      padding-bottom: 20vh;
      margin-bottom: 20vh;
      color: white;
      font-family: a-otf-ryumin-pr6n,serif;
      background: #848484;
  }

  .gozen,.gogo{
     width: 45vw;
     font-size: 2.5vw;
  }
  .gozen img,.gogo img{
      padding-left: 3vw;
      width: 15vw;
      padding-bottom: 9vh;
  }
  .gozen p,.gogo p{
      padding-left: 3vw;
      padding-bottom: 7vh;
      letter-spacing: 0.5vw;
    }


    .time-chart{
        color: black;
        background: #efefef;
        position: relative;
        font-family: a-otf-ryumin-pr6n,serif;
    }
    .time{
        top: 5%;
        left: 5%;
        z-index: 999;
        margin-top: 5vh;
        margin-left: 5vw;
        height: 1px;
    }
    .time p{
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
      font-size: 4vw;
    }
    .tate-line{
        margin-left: 20vw;
        width: 2px;
        height: 220vh;
        background: black;
        content: '';
        padding-bottom: 10vh;
        display: inline-block;
        vertical-align: top;
    }
    .right{
      display: inline-block;
      margin-left: 60vw;
      height: 100vh;
      vertical-align: top;
      font-size: 4vh;
      animation: fade;
      animation-duration: 2s;
    }
    .points{
      height: 30vh;
      padding-top: 15vh;
      padding-bottom: 5vh;
      display: flex;
      gap: 2vw;
    }
    .tournament{
      height: 30vh;
      padding-top: 15vh;
      padding-bottom: 5vh;
      display: flex;
      gap: 2vw;
    }
    .tournament p,.points-p{
      -ms-writing-mode: tb-rl;
       writing-mode: vertical-rl;
    }
    .tournament img{
      width: 35vw;
      margin-top: 5vh;
    }

    .kyogi{
        position: absolute;
        top: 0;
        padding-left: 19vw;
        -ms-overflow-style: none;
        scrollbar-width: none;
        scroll-snap-type: y proximity;
        height: 220vh;
        overflow-y: hidden;
        padding-bottom: 10vh;
        font-family: a-otf-ryumin-pr6n,serif;
    }
    .kyogi::-webkit-scrollbar {  /* Chrome, Safari 対応 */
      display:none;
    }

    #kaku1,#kaku2,#kaku3,#kaku4,#kaku5,#kaku6,#kaku7,#kaku8,#kaku9,#kaku10,#kaku11,#kaku12,#kaku13{
        display: flex;
        flex-wrap: wrap;
        vertical-align: middle;
        height: 15vh;
        width: 80vw;
        scroll-snap-align: center;
        position: relative;
    }
    .circle{
        width: 2vw;
        height: 2vw;
        border: 2px solid black;
        background: #efefef;
        border-radius: 50%;
        margin-top: auto;
        margin-bottom: auto;
    }
    .gakunen{
      display: none;
    }
    .name{
        margin-left: 5vw;
        vertical-align: middle;
        font-size: 4vh;
        letter-spacing: 1vh;
        height: 100%;
        line-height: 15vh;
        color: #cccccc;
    }
    .detail{
        display: none;
        margin-left: 50px;
    }
    .detail p{
        width: auto;
        margin-bottom: auto;
        margin-top: 16.5vh;
        height: 9vh;
        font-size: 3vh;
        line-height: 3vh;
    }
    .detail p a{
      text-decoration: none;
      color: black;
      cursor: pointer;
    }
    .detail p a:hover{
      color: #cacaca;
    }

    .kaku-active{
      animation: active-anime;
      animation-duration: 1.5s;
      animation-fill-mode: forwards;
    }

    .kaku-active .name{
      animation: active-anime-p;
      animation-duration: 1.5s;
      animation-fill-mode: forwards;
      color: black;
    }
    .kaku-active .gakunen{
      display: block;
      width: 55vw;
      padding-left: 11vw;
      position: absolute;
      top: 20%;
      font-size: 25px;
    }


    .kaku-negative{
      animation: re-active-anime;
      animation-duration: 1.5s;
      animation-fill-mode: forwards;
    }
    .kaku-negative .name{
      animation: re-active-anime-p;
      animation-duration: 1.5s;
      animation-fill-mode: forwards;
    }
    .kaku-negative .detail{
      display: none;
    }

    .gaiyo{
      display: none;
    }
    .gaiyo a{
      text-decoration: none;
      color: black;
    }
    .gaiyo a:hover{
      color: #cacaca;
    }

    .kaku-active .gaiyo{
      display: block;
      width: 80vw;
      padding-left: 11vw;
      position: absolute;
      bottom: 20%;
      font-size: 25px;
    }

    .zikoku{
      display: none;
    }
    .kaku-active .zikoku{
      margin-top: 10vh;
      height: 20vh;
      width: 8vw;
      font-size: 4vw;
      line-height: 20vh;
      text-align: center;
      margin-left: -3vw;
      margin-bottom: 10vw;
      background: #efefef;
      color: black;
      display: block;
    }
    .kaku-active .circle{
      display: none;
    }


    @keyframes active-anime{
      0%{
        height: 15vh;
      }
      100%{
        height: 40vh;
      }
    }

    @-webkit-keyframes active-anime{
      0%{
        height: 15vh;
      }
      100%{
        height: 40vh;
      }
    }

    @keyframes active-anime-p{
      0%{
        font-size: 4vh;
        line-height: 15vh;
        letter-spacing: 1vh;
      }
      100%{
        font-size: 9vh;
        line-height: 40vh;
        letter-spacing: 2vh;
      }
    }

    @-webkit-keyframes active-anime-p{
      0%{
        font-size: 4vh;
        line-height: 15vh;
        letter-spacing: 1vh;
      }
      100%{
        font-size: 9vh;
        line-height: 40vh;
        letter-spacing: 2vh;
      }
    }

    @keyframes re-active-anime-p{
      0%{
        font-size: 9vh;
        line-height:40vh;
        letter-spacing: 2vh;
      }
      100%{
        font-size: 4vh;
        line-height: 15vh;
        letter-spacing: 1vh;
      }
    }

    @-webkit-keyframes re-active-anime-p{
      0%{
        font-size: 9vh;
        line-height: 40vh;
        letter-spacing: 2vh;
      }
      100%{
        font-size: 4vh;
        line-height: 15vh;
        letter-spacing: 1vh;
      }
    }

    @keyframes re-active-anime{
      0%{
        height: 40vh;
      }
      100%{
        height: 15vh;
      }
    }

    @-webkit-keyframes re-active-anime{
      0%{
        height: 40vh;
      }
      100%{
        height: 15vh;
      }
    }

    .vs-sp{
      display: none;
    }
    .syokai{
      display: none;
    }

    .gaiyo-piku{
      display: none;
      width: 5vh;
      border-radius: 50%;
    }
    .kaku-active .gaiyo-piku{
      display: block;
      position: absolute;
      bottom: 20%;
      left: 12%;
    }
    .syokai-piku{
      display: none;
      width: 4vh;
      border-radius: 50%;
    }

    @keyframes fade{
      0%{opacity: 0;}
      100%{opacity: 1;}
    }

  
  
  
  
  
  @media screen and (min-width: 480px){
    .br-pc{display: block;}
    .br-sp{display: none;}
  }
  
  @media screen and (max-width: 1200px){
    .pc-menu{
        margin-left: 50vw;
      }

      .top_svg{
        width: 20vw;
      }
      .top_svg image{
        width: 20vw;
      }

  }

  
  @media screen and (max-width: 850px){
    .br-pc{display: none;}
    .br-sp{display: block;}

    header{
      position: fixed;
    }

    .pc-menu-hello{
      display: none;
    }

    
    .sc{
        margin-left: 5vw;
        font-size: 2vw;
        margin-top: 3vh;
        letter-spacing: 2vw;
      }

    .top_svg{
        width: 55vw;
        margin-top: 8vw;
        margin-left: 6vw;
      }

    footer{
        padding-left: 10vw;
        width: 90vw;
      }
      .footer-line{
        margin-left: 0;
      }
      .top_bottom{
        padding-left: 0;
      }
  
      .icons{
        padding-left: 0;
      }
      .icons img{
        width: 10vw;
      }
  
      .footer-p{
        padding-left: 0;
      }
      .kaisei svg{
        width: 30vw;
      }
      .kaisei svg image{
        width: 30vw;
      }

      .h-menu{
        margin-left: 85vw;
        display: block;
      }
      .pc-menu{
        display: none;
      }

      .tate::after{
        content: "";
          /*描画位置*/
        position: absolute;
        margin-left: 5.7vw;
        top: 150vh;
        height: 30vh;
        width: 0.039vw;
        background: black;
        position: absolute;
          /*線の形状*/
        width: 0.1vw;
        height: 10vw;
        background: black;
          /*線の動き1.4秒かけて動く。永遠にループ*/
        animation: pathmove 1.4s ease-in-out infinite;
        opacity:0;
        z-index: 100;
      }
  
      /*高さ・位置・透過が変化して線が上から下に動く*/
      @keyframes pathmove{
        0%{
          height:0;
          top:91vh;
          opacity: 0;
        }
        30%{
          height:10vh;
          opacity: 1;
        }
        100%{
          height:0;
          top:110vh;
          opacity: 0;
        }
      }

      .icons{
        height: 26.667vw;
      }
  
      .mokuzi{
        display: none;
      }
      .mokuzi-hello{
        display: none;
      }
      .mokuzi-sp{
        display: block;
        list-style-type: none;
        padding-left: 0;
        letter-spacing: 1vw;
      }
      .mokuzi-sp li{
        margin-bottom: 2.667vw;
      }
      .mokuzi-sp li a{
        text-decoration: none;
        color: black;
        font-size: 6.667vw;
      }


      .all-pro{
        height: 50vh;
      }

      .pro-top img{
        width: 25vw;
      }





      .kaku-active .detail{
        display: block;
      }
      .kaku-active .gaiyo{
        display: none;
      }
      #kaku1,#kaku2,#kaku3,#kaku4,#kaku5,#kaku6,#kaku7,#kaku8,#kaku9,#kaku10,#kaku11,#kaku12,#kaku13{
        width: auto;
      }
      .right{
        display: none;
      }
      .name{
        font-size: 2.5vh;
        letter-spacing: 1vh;
      }

      /*@keyframes active-anime-p{
        0%{
          font-size: 2.5vh;
          line-height: 15vh;
        }
        100%{
          font-size: 5vh;
          line-height: 40vh;
        }
      }
  
      @-webkit-keyframes active-anime-p{
        0%{
          font-size: 2.5vh;
          line-height: 15vh;
        }
        100%{
          font-size: 5vh;
          line-height: 40vh;
        }
      }
  
      @keyframes re-active-anime-p{
        0%{
          font-size: 5vh;
          line-height: 40vh;
        }
        100%{
          font-size: 2.5vh;
          line-height: 15vh;
        }
      }
  
      @-webkit-keyframes re-active-anime-p{
        0%{
          font-size: 5vh;
          line-height: 40vh;
        }
        100%{
          font-size: 2.5vh;
          line-height: 15vh;
        }
      }*/

      @keyframes active-anime-p{
        0%{
          font-size: 2.5vh;
          letter-spacing: 1vh;
        }
        100%{
          font-size: 5vh;
          letter-spacing: 1vh;
        }
      }
  
      @-webkit-keyframes active-anime-p{
        0%{
          font-size: 2.5vh;
          letter-spacing: 1vh;
        }
        100%{
          font-size: 5vh;
          letter-spacing: 1vh;
        }
      }
  
      @keyframes re-active-anime-p{
        0%{
          font-size: 5vh;
          letter-spacing: 1vh;
        }
        100%{
          font-size: 2.5vh;
          letter-spacing: 1vh;
        }
      }
  
      @-webkit-keyframes re-active-anime-p{
        0%{
          font-size: 5vh;
          letter-spacing: 1vh;
        }
        100%{
          font-size: 2.5vh;
          letter-spacing: 1vh;
        }
      }

      .gozen p,.gogo p{
        padding-bottom: 4vh;
      }
      .gozen img,.gogo img{
        padding-bottom: 4vh;
      }

      .kaku-active .zikoku{
        font-size: 5.5vw;
        margin-left: -6vw;
      }

      .name{
        margin-left: 5vw;
        vertical-align: middle;
        font-size: 4vh;
        height: 10vh;
        color: #cccccc;
    }
    .kaku-active .zikoku{
      margin-top: 0;
      line-height: 15.5vh;
      margin-bottom: 0;
    }

    .kaku-active .vs-sp{
      display: block;
      width: 60vw;
      padding-left: 10vw;
    }
    #kaku4 .vs-sp,#kaku5 .vs-sp{
      width: 40vw;
      padding-left: 20vw;
    }
    .kaku-active .gakunen{
      top: 5%;
    }

    .kaku-active .syokai{
      display: block;
      color: black;
      text-decoration: none;
      cursor: pointer;
      font-size: 25px;
      position: absolute;
      top: 35%;
      left: 25%;
    }
    .kaku-active .syokai-piku{
      display: block;
      position: absolute;
      top: 35%;
      left: 12%;
    }
    .kaku-active .gaiyo-piku{
      display: none;
    }

    }
    
    
    @media screen and (max-width: 480px){
        .kaisei svg{
            width: 40vw;
            height: 10vw;
          }
          .kaisei svg image{
            width: 40vw;
            height: 10vw;
          }
          .footer-p{
            font-size: 3px;
            width: 40vw;
          }

          
     /* @keyframes active-anime-p{
        0%{
          font-size: 2.5vh;
          line-height: 15vh;
        }
        100%{
          font-size: 4vh;
          line-height: 40vh;
        }
      }
  
      @-webkit-keyframes active-anime-p{
        0%{
          font-size: 2.5vh;
          line-height: 15vh;
        }
        100%{
          font-size: 4vh;
          line-height: 40vh;
        }
      }
  
      @keyframes re-active-anime-p{
        0%{
          font-size: 4vh;
          line-height: 40vh;
        }
        100%{
          font-size: 2.5vh;
          line-height: 15vh;
        }
      }
  
      @-webkit-keyframes re-active-anime-p{
        0%{
          font-size: 4vh;
          line-height: 40vh;
        }
        100%{
          font-size: 2.5vh;
          line-height: 15vh;
        }
      }*/

      @keyframes active-anime-p{
        0%{
          font-size: 2.5vh;
        }
        100%{
          font-size: 4vh;
        }
      }
  
      @-webkit-keyframes active-anime-p{
        0%{
          font-size: 2.5vh;
        }
        100%{
          font-size: 4vh;
        }
      }
  
      @keyframes re-active-anime-p{
        0%{
          font-size: 4vh;
        }
        100%{
          font-size: 2.5vh;
        }
      }
  
      @-webkit-keyframes re-active-anime-p{
        0%{
          font-size: 4vh;
        }
        100%{
          font-size: 2.5vh;
        }
      }

      .kaku-active .gakunen{
        font-size: 11px;
        line-height: normal;
      }

      .kaku-active .syokai{
        font-size: 15px;
      }

      .name{
        margin-left: 8vw;
        font-size: 2.5vh;
      }

      #kaku4 .name{
        letter-spacing: 0;
        width: 70vw;
        overflow: hidden;
      }
        }