@charset "UTF-8";

/* スライダー全体 */
.slider-box{
  position: sticky;
    background-color: #000;
    border-top: solid 0.2rem #fff;
    border-bottom: solid 0.2rem #fff;
    box-shadow: 0 0 .2rem #fff, 0 0 .2rem #fff, 0 0 2rem #ffec66, 0 0 0.8rem #ffec66, 0 0 2.8rem #ffec66, inset 0 0 1.3rem #ffec66;

}

.slider-wrapper {
    display: flex; /* スライドのグループを横並び */
    overflow: hidden; /* はみ出たスライドを隠す */
  }
  /* スライド3枚のグループ */
  .slider {
    animation: scroll-left 120s infinite linear .5s both;
    display: flex; /* スライド3枚を横並び */
    align-items: center;
  }
  /* スライド */
  .slide {
    width: calc(60vw / 2.5); /* 3はスライドの枚数 */
  }
  /* スライドの画像 */
  .slide img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  /* CSSアニメーション */
  @keyframes scroll-left {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(-100%);
    }
  }

  .slider li{
    margin: 20px 10px 25px 10px;
  }

.slider p{
  text-align: center;
  margin-top: 10px;
  font-size: 80%;
}

.slider-box h2{
    font-size: 6rem;
     margin-top: 20px;
    margin-bottom: -15px;
   font-family: "Pacifico", cursive;
       font-weight: 100;
           color: #ffbb00;
}

.slider-box h2 span{
  font-size: 9rem;
}

.heading-main-title img{
  width: 300px;
}

/* -------------------------------------------------------------------------------------------------------------------
SP 縦-                                                                                                           
------------------------------------------------------------------------------------------------------------------- */
@media (orientation: portrait) {
  .pc {
    display:none;
  }
  .tb {
    display: block;
  }
  .sp {
    display: block;
  }
  .pcBr {
    display: none;
  }
  .spBr {
    display: block;
  }

    /* スライド */
  .slide {
    width: calc(80vw / 2.5); /* 3はスライドの枚数 */
  }

  .slider-box h2 span{
  font-size: 4.5rem;
}

.slider-box h2{
    font-size: 3rem;
        margin-top: 20px;
        margin-bottom: -15px;
   font-family: "Pacifico", cursive;
   font-weight: 100;
   color: #ffbb00;
}

  .slider p{
  text-align: center;
  margin-top: 10px;
  font-size: 50%;
}

.heading-main-title img{
  width: 120px;
}

}