.kbys{
/* スライダーの土台：親の高さを確保しつつ各スライドを重ねる */
.r-s {
  display: grid;
  grid-template-areas: "stack";
  width: 100%;
  overflow: hidden;
  position: relative;
}

/* スライド（子div）を重ねて非表示に */
.r-s > div {
  grid-area: stack;
  opacity: 0;
  animation: rkSliderFade 9s infinite;
}

/* 遅延を3等分 */
.r-s > div:nth-child(1) { animation-delay: 0s; }
.r-s > div:nth-child(2) { animation-delay: 3s; }
.r-s > div:nth-child(3) { animation-delay: 6s; }

/* 初期表示（ロード直後） */
.r-s > div:first-child { opacity: 1; }

/* フェードアニメーション（3枚=9秒周期） */
@keyframes rkSliderFade {
  0%   { opacity: 0; }
  5%   { opacity: 1; }   /* フェードイン */
  30%  { opacity: 1; }   /* 表示キープ */
  35%  { opacity: 0; }   /* フェードアウト */
  100% { opacity: 0; }
}

/* 画像調整 */
.r-s img {
  width: 100%;
  height: auto;
  display: block;
}


    
    
    
/* もしヘッダー等に隠れる場合は有効化（被り対策）
.room-right, .r-s { position: relative; z-index: 1; }
*/

/* 4枚以上にするとき（例：4枚）—— 下3行を追加し、合計を16sに変更
.r-s > div { animation: rkSliderFade 16s infinite; }
.r-s > div:nth-child(4) { animation-delay: 12s; }
*/
    
    
.nav-item,.n-i {
    position: relative;
    width: 180px;
    height: 180px;
    overflow: hidden;
    text-decoration: none;
    color: #fff;
}
.nav-item img,.n-i img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}
    
.indicator-item .bar,.i-it .bar {
    width: 50px;
    height: 8px;
    background-color: #e5e5e5;
    margin-top: 6px;
    transition: background-color 0.3s;
    width: 100%;
}
.indicator-item,.iit {
    text-align: center;
    font-size: 12px;
    width: 30%;
}
    .rboxtext{
        display: block;
        margin: auto;
        text-align: center;
    }
    
}