.body{
    margin: 0px;
}
.header{
    width: 100%;
    height: auto;
    color: white;
    font-weight: bold;
    font-size: 18px;
    text-align: left;
    padding-top: 10px;
    padding-bottom: 20px;
    margin: 0px;
}
.big{
    font-size: 30px;
}
.small{
    font-size: 12px;
}
.firstview{
    position: relative;
    width: 100%;
    height: 200px;

}

.title{
    height: auto;
    color: black;
    font-weight: bold;
    font-size: 24px;
    text-align: left;
    margin: 70px 0px 30px 35px;
    padding-top: 10px; 
    position: absolute;
    z-index: 2;
}
.title2{
    width: auto;
    height: auto;
    color: black;
    font-weight: bold;
    font-size: 80px;
    text-align: left;
    margin: 0px 30px; 
    position: relative;
    z-index: 2;
}
.mokuji{
    width: auto;
    height: 100%;
    padding-left: 70%;
    padding-top: 20px;
    text-align: right;
    position: absolute;
    top: 0;
    z-index: 2;
}
.top{
    color: black;
    font-weight: bold;
    font-size: 30px;
    text-decoration: none;
}
.VIDEO{
    color: black;
    font-weight: bold;
    font-size: 30px;
    text-decoration: none;
}
.PROFIRE{
    color: black;
    font-weight: bold;
    font-size: 30px;
    text-decoration: none;
}
.instagram{
    width: 40px;
    height: auto;
    position: absolute;
    display: block;
}
.x{
    width: 40px;
    height: auto;
    position: absolute;
    display: block;
}
.video1{
    width: fit-content;
    height: auto;
    color: black;
    margin-top: -15px;
    margin-left: 20%;
    text-align: left;
    position: relative;
}
.videoojisann{
    width: 1170px;
    height: auto;
    margin-bottom: 30px;
    border-bottom: 1px solid black;
    font-weight: bold;
    font-size: 20px;
}
.hover-brighten img {
    transition: 0.3s ease;
    filter: brightness(80%);
  }

  .hover-brighten img:hover {
    filter: brightness(110%);
  }
.video2{
    width: fit-content;
    height: auto;
    color: black;
    margin-top: 10px;
    margin-left: 20%;
    text-align: left;
    position: relative;
}

.op{
    width: 100%;
    height: 100%;
    position: absolute;
}

.text-animation{
    width: 100%;
    position: absolute;
     font-weight: bold;
     font-size: 40px;
     padding-top: 660px;
}

.text-animation span {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 1.2s ease forwards;
  animation-iteration-count: infinite;
}

.text-animation span:nth-child(1) { animation-delay: 0s; }
.text-animation span:nth-child(2) { animation-delay: 0.1s; }
.text-animation span:nth-child(3) { animation-delay: 0.3s; }
.text-animation span:nth-child(4) { animation-delay: 0.4s; }
.text-animation span:nth-child(5) { animation-delay: 0.6s; }
.text-animation span:nth-child(6) { animation-delay: 0.7s; }
.text-animation span:nth-child(7) { animation-delay: 0.8s; }
.text-animation span:nth-child(8) { animation-delay: 0.9s; }
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
