body{
	margin:0;
	padding:0;
    overflow-x: hidden;
}

/* ナビゲーション */
.main-nav {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9999;
  background-color: rgb(255 196 85 / 50%);
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  font-family: "Noto Sans JP", sans-serif;
}

.nav-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 16px;
  max-width: 1600px;
  margin: 0 auto;
}

.nav-logo {
  font-size: 16px;
  font-weight: bold;
}

.nav-items a {
  margin: 0 10px;
  text-decoration: none;
  color: #3f250e;
  font-weight: 500;
  font-size: 16px;
  transition: color 0.2s;
}

.nav-items a:hover {
  color: #007acc;
}

/* ハンバーガーメニュー */
.nav-toggle {
  display: none;
  flex-direction: column;
  cursor: pointer;
  padding: 10px;
}

.nav-toggle span {
  width: 25px;
  height: 3px;
  background:rgba(207, 134, 74, 0.5);
  margin: 4px 0;
}

/* スマホ用メニュー */
.nav-links {
  display: none;
  flex-direction: column;
  background: rgb(20 20 20 / 50%);
  padding: 10px 16px;
  border-top: 1px solid #ddd;
}

.nav-links a {
  padding: 10px 0;
  text-decoration: none;
  color: #ffffff;
  border-bottom: 1px solid #eee;
}

.nav-links a:hover {
  color: #007acc;
}

.nav-links.active {
  display: flex;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
  .nav-items {
    display: none;
  }

  .nav-logo {
    display:none;
    }

  .nav-toggle {
    display: flex;
    }
    .main-nav {
    background-color: transparent; 
  }
}





/* 選ばれる理由 */
.festa2025_wrapper{
    background-image:url("img/festa25bk.jpg");
    background-attachment: fixed;
    background-size: 1000px;
}

.festa2025-top{
    position:absolute;
}

/* top */

.o-festa2025 {
    width: 100%;
    height: 36vw;
    background: url('img/o-festa2025.jpg') no-repeat;
    background-size: 100%;
}

.o-festa2025::before {
content: "";
width: 100%;
height: 36vw;
position: absolute;
background: url('img/o-kumo.png') repeat-x;
background-size: 80%;
animation: o-festa_scroll-anim 10s linear infinite;
}

.o-festa2025::after {
content: "";
width: 100%;
height: 36vw;
position: absolute;
background: url('img/fes2025-front.png')no-repeat;
background-size: 100%;
}

/* スマホ */
.o-festa2025_sp {
    width: 100%;
    height: 100vw;
    background: url('img/o-festa2025_sp.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative
}

.o-festa2025_sp::before {
    content: "";
    width: 100%;
    height: 100vw;
    position: absolute;
    background: url('img/o-kumo_sp.png') repeat-x;
    background-size: 80%;
    animation: o-festa_scroll-anim 5s linear infinite;
}

.o-festa2025_sp::after {
    content: "";
    width: 100%;
    height: 100vw;
    position: absolute;
    background: url('img/fes2025-front_sp.png')no-repeat;
    background-size: 100%;
}



@keyframes o-festa_scroll-anim {
100% {
    background-position: -100% 0;
}
}


.festa2025-pc{
    display: block;
    margin: 0 auto;
}

.festa2025-sp{
    display:none;
}

.o-festa2025{
    display: block;
}

.o-festa2025_sp{
    display:none;
}


/* info */
.festainfo_wrapper{
    /* max-width:800px; */
    display:flex;
    margin: 0 auto;
    padding: 40px;
    background-image: url("img/o-stripe.jpg");
    background-size: 380px;
    height:160px;
    /* background-color:#ffffff; */
    padding: 4em 12em;
    text-align: left;
    letter-spacing: calc((50 / 1000)*2em) 
}


.festa_centerdscwrap{
    max-width:900px;
    margin: 0 auto;
}

.festa_centerdsc{
    width:600px;
    padding: 10px;
    font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    font-weight: bold;
    word-break: break-all;
}

.sidefuwafuwa{
    width: 200px;
}

.NSWwirel{
    transform-origin: center bottom;
    animation: fuwafuwa_2 3s ease 0s infinite;

}

.NSWwirer{
    transform-origin: center bottom;
    animation: yurayura 2s linear infinite;
}

@keyframes yurayura {
  0% , 100%{
      transform: rotate(10deg);
  }
  50%{
      transform: rotate(-10deg);
  }
}


@keyframes fuwafuwa_2 {
    0% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(0, -8%);
    }
    100% {
        transform: translate(0, 0);
    }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}



/* メニュー */
.fesnavwrapper {
    position: relative;
    /* width: 100%;
    height: 100vh; */
    background-color: #a10707;
    padding: 2em;
    text-align: center;
}

.fesnavwrapper::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #a10707;
    z-index: -1;
}

.fesnavwrapper {
    background: url('img/schedulebk.png') no-repeat center center;
    background-size: contain; /* 画像を縮小しても比率を保つ */
    margin: 0 auto;
    height: auto;
}







.fes25scheduletitle{
    width:200px;
}

.fesnav-links{
    display: flex;
    flex-wrap:wrap;
    justify-content: center;
    list-style: none;
}

.fesnav-links>li{
    padding:10px;
}


/* リボン見出し */
.festaevent-title{
    text-align:center;
    margin-top:4em;
}



/* イベント */
.festa2025box-wrapper{
    max-width:800px;
    margin: 0 auto;
    padding: 40px;
}
.festa2025box{
    background-color:rgb(255 255 255 / 60%);
    display:flex;
    flex-wrap: wrap;
    margin-top:40px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

.festa2025box_title >img{
    width:300px;
}
.festa2025box_contents >img{
    width:350px;
}


.festa2025box_contents{
    width:350px;
    margin:24px;
}

.festa2025box_contents >img{
    text-align: center;
}

.festa2025box_dsc{
    /* font-size:small; */
    line-height: 40px;
}

h2{
    text-align: center;
    margin: 30px 0;
    font-size:1rem;
}

.festaevent-titlewrap{
    max-width:800px;
    margin: 0 auto;
}

.eventdsc{
    max-width: 730px;
    margin: 0 auto;
    font-size:large;
    font-weight:bold;
    color:#310101;
    border-radius: 8px;
    padding: 8px;
    padding-bottom: 5em;
}

/* セール */

.festasalewrapper {
    background: url('img/festa-infobk.jpg') no-repeat center center;
    background-size: cover; /* 背景画像を横幅いっぱいに調整 */
    background-attachment: fixed;
    margin: 0 auto;
    width: 100%; /* 横幅を100%に設定 */
    height: auto;
}



.festasale{
    text-align:center;
}

.detailspage{
    text-align: right;
}


/* ちょうちんメニュー */

/* 全体の横並びレイアウト */
.lantern-container {
    display: flex;
    justify-content: space-around; /* 各ちょうちんを均等に配置 */
    align-items: center;
    flex-wrap: wrap;
    max-width: 900px;
    margin: 0 auto;
    padding-bottom: 3em;
}

/* リンクの基本設定 */
.lantern-link {
    text-decoration: none; /* リンクの下線を消す */
    display: inline-block; /* リンクをブロック全体に適用 */
    cursor: pointer; /* ポインタがクリック可能な状態になる */
}

/* 各ちょうちんの基本設定 */
.lantern {
    position: relative;
    width: 200px;
    overflow: hidden;
    text-align: center;
}

.lantern-image {
    width: 100%;
    height: auto;
    transition: opacity 0.5s ease, transform 0.5s ease;
}

/* 1と3のちょうちんは右揺れ */
#osaka .lantern-image,
#tokyo .lantern-image {
    animation: sway-right 5s infinite ease-in-out;
}

#osaka:hover .lantern-image,
#tokyo:hover .lantern-image {
    opacity: 0.9;
    transform: scale(1.05);
    animation-play-state: paused;
}

/* 2と4のちょうちんは左揺れ */
#nagoya .lantern-image,
#webfes .lantern-image {
    animation: sway-left 5s infinite ease-in-out;
}

#nagoya:hover .lantern-image,
#webfes:hover .lantern-image {
    opacity: 0.9;
    transform: scale(1.05);
    animation-play-state: paused;
}

/* 画像の切り替え */
#osaka:hover .lantern-image {
    content: url('img/osaka-a.png');
}

#nagoya:hover .lantern-image {
    content: url('img/nagoya-a.png');
}

#tokyo:hover .lantern-image {
    content: url('img/tokyo-a.png');
}

#webfes:hover .lantern-image {
    content: url('img/webfes-a.png');
}

/* ボタンのテキストスタイル */
.button-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 2.5vw; /* PC用のサイズ */
    font-weight: bold;
    pointer-events: none;
    transition: color 0.5s ease;
    text-align: center;
    width: 100%; /* 画像幅いっぱいにテキストを収める */
}

.lantern:hover .button-text {
    color: #1f2e55;
}

/* スマホ（SP）向けのスタイル */
@media screen and (max-width: 480px) {
    .button-text {
        font-size: 6vw; /* スマホ用の文字サイズ */
    }
}


/* 1と3の右揺れアニメーションを7段階に増やす */
@keyframes sway-right {
    0% , 100%{
        transform: rotate(4deg);
    }
    50%{
        transform: rotate(-4deg);
    }
}

/* 2と4の左揺れアニメーションを7段階に増やす */
@keyframes sway-left {
    0% , 100%{
        transform: rotate(-4deg);
    }
    50%{
        transform: rotate(4deg);
    }
}






/* ご利用ガイド */

.shopguide_wrap{
    padding:10px;
}

.shopguide_info {
background: rgba(255, 255, 255, .8);
box-shadow: 5px 5px 5px rgb(0 0 0 / 35%);
border-radius:20px;
max-width: 800px;
margin: 0 auto;
padding: 4em 2em;
color: #071D2D;
}
.shopguide_info>dl {
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-bottom: 1px solid #b1c1cd;
padding: 2em 1em;
max-width: 750px;
margin: 0 auto;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.shopguide_info>dl:last-child {
border-bottom: 0;
}
.shopguide_info>dl>dt {
font-size: 26px;
text-align: left;
/* width: 28%; */
line-height: 1.2;
font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.shopguide_info>dl>dd {
text-align: left;
width: 70%;
font-size: 16px;
font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
margin: 0 auto;
}
.shopguide_info>dl>dd p {
font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.shopguide_info>dl>dd a {
color: #1d4586;
}
.shopguide_info>dl>dd>span {
font-size: 12px;
display: block;
line-height: 1.2;
margin-top: 1em;
}

  /* ご利用ガイドここまで */


/* お問合せ */
.member-regist_information{
    background-color: #eeeeee;
    max-width: 500px;
    margin: 4em auto 1em ;
    padding: 4em;
    text-align: left;
    letter-spacing: calc((50 / 1000)*2em) 
}

.caution{
    font-size:12px;
}


/* ボタン */
.kfbtn-wrap {
    text-align: center;
    margin: 4em auto 0;
    max-width: 1080px;

}
.member-registbtn-wrap {
    margin-bottom: 2em;
    padding: 1em 0.2em;
    text-align: center;
}

/* 青ボタン */
a.kfbtn--red {
    color: #ffffff;
    background-color: #d52042;
    border-bottom: 5px solid #b41936;
}
a.kfbtn--red:hover {
margin-top: 3px;
color: #dddddd;
background: #b91b38;
border-bottom: 2px solid #810f24;
}

/* 問合せボタン */
a.kfbtn--ktblue {
color: #ffffff;
background-color: #d52042;
border-bottom: 5px solid #b41936;
}
a.kfbtn--ktblue:hover {
margin-top: 3px;
color: #dddddd;
background: #b91b38;
border-bottom: 2px solid #810f24;
}

a.kfbtn--shadow {
-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
}

.kfbtn, a.kfbtn, button.kfbtn {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.5;
    position: relative;
    display: inline-block;
    padding: 1.2rem 4rem;
    cursor: pointer;
    transition: all .3s;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
    letter-spacing: .1em;
    color: #ffffff;
    border-radius: 5rem;
}

/* 営業所案内メニュー */
.button {
    width: 280px;
    padding: 10px 0; /* 縦の余白を調整 */
    background-color: #f7f3ea; /* メインカラー */
    border: 2px solid #c24f3c; /* 外枠 */
    position: relative;
    font-size: 16px; /* テキストサイズ */
    text-align: center;
    color: #c24f3c; /* テキストカラー */
  }
  
  .button::before {
    content: "";
    position: absolute;
    top: 4px;
    right: 4px;
    bottom: 4px;
    left: 4px;
    border: 1px solid #c24f3c; /* 4px内側のボーダー */
  }
  
  .button:hover {
    background-color: #f7f3ea; /* ホバー時の背景色（オプション） */
    cursor: pointer;
  }











/* 問合せ先 */
.festacontact_information{
    /* background-color: #cfe3f1; */
    background-color: #eb725c;
    color:#ffffff;
    max-width: 500px;
    margin: 10em auto ;
    padding: 4em;
    text-align: left;
    letter-spacing: calc((50 / 1000)*2em) 
}


/* 戻るボタン */
.backbtn-fes {
    background-color: #00a69d;
    border-bottom: 6px solid #048a83;
    font-size: 18px;
    color: white;
    width: 200px;
    height: 44px;
    line-height: 44px;
    border-radius: 8px;
    text-align: center;
    font-weight: bold;
    margin: 8px auto 40px;
    display: block;
}

.backbtn-fes a {
    color: white;
    text-decoration: none;
}

@media screen and (min-width: 768px){
    .br-sp {display: none; }
    }
@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用） */
    .o-festa2025{
        display: none;
    }
    
    .o-festa2025_sp{
        display:block;
    }

    .festa2025-pc{
        display: none;
    }
    
    .festa2025-sp{
        display:block;
    }

.festa2025box_contents {
    width: 350px;
    margin: 24px;
}

    .festainfo_wrapper{
        display:flex;
        margin: 0 auto;
        background-image: url("img/o-festa2025.jpg") no-repeat;
        background-size: 420px;
        height:300px;
        padding: 10px;
        text-align: left;
        letter-spacing: calc((50 / 1000)*2em) 
    }
    .NSWwirel{
        /* display:none; */
    }

    .NSWwirer{
     vertical-align: bottom;
        /* display:none; */
    }

    .festasalewrapper {
        background-size: cover; /* 背景をフルカバー */
        background-position: center; /* 背景画像の位置を中央に */
    }

    


    .festa_centerdscwrap{
        margin: 0 auto;
        /* padding:10px; */
    }
    
    .festa_centerdsc{
        width:100%;
        font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
        font-weight: bold;
        word-break: break-all;
        font-size:14px;
        padding:20px 8px;
    }


    .festa2025box-wrapper{
        padding:10px;
    }


    .festa2025box.en{
        display:flex;
        flex-wrap: wrap-reverse;
    }


    .festa2025box_title >img{
        width: 240px;
    }
    .festa2025box_contents >img{
        width:300px;
        text-align: center;
    }

    .lantern-image {
        width: 70%;
    }

	.kfbtn-wrap {
        margin:auto 0;
        padding: 10px;
        text-align: center;
    }

    .kfbtn, a.kfbtn, button.kfbtn {
        font-size: 18px;
        padding: 1.2rem 2rem;
    }


    .member-registbtn-wrap {
        margin:0 auto;
        padding: 1em 0.2em;
        text-align: center;
    }

    .kfbtn, a.kfbtn, button.kfbtn {
        width:200px;
    }

    .contact_information {
        margin: 6em auto;
        padding: 2em;
        letter-spacing: calc((50 / 1000)*1em);
    }

    .shopguide_info {
        padding:1em;
        margin: 4em auto;
    }

    .shopguide_info>dl>dd {
    width: 100%;
    font-size: 16px;
    margin: 10px auto;
    }

    .detailspage {
        text-align: right;
        font-size: small;
    }
}

.festa2025-sign a{
    text-decoration: none;
    color:#fff;
    
}

.festa2025-sign:hover {
    opacity: 0.8;}



    img {
        max-width: 100%;
        height: auto;
    }

.festa-footer {
  background-image: url('img/festafooter.jpg');
  background-size: 1000px;
  background-position: center;
  padding: 40px 20px;
  color: #fff;
  text-align: center;
  font-size: 14px;
}

.footer-inner {
  max-width: 1000px;
  margin: 0 auto;
}


/* ↓イージェット */
/* ===== New Product (E-JET) ===== */
/* === New Product stage === */
.np-hero{ padding: clamp(40px,6vw,80px) 0; }

.np-stage{
  position: relative;
  width: min(1000px,92vw);
  aspect-ratio: 16 / 9;           /* 舞台の比率を固定 → 配置が安定 */
  margin: 0 auto;
  overflow: visible;
}

/* 舞台内の共通素性 */
.np-stage img{
  position: absolute;
  display: block;
  max-width: none;
  will-change: transform, opacity, bottom, left, right, top;
}

/* ---- 初期配置（静止時） ---- */
/* ④ 朝日：車より背面(z:1)。下に隠しておく */
.np-sun{
  z-index: 1;
  left: 48%; bottom: -18%;
  width: 46%;
  transform: translate(-50%,0) scale(.9);
  opacity: 0;
}

/* ① 車（最前面）右外から入れる */
.np-car{
  z-index: 2;
  left: 10%; bottom: -10%;
  width: 58%;
  opacity: 0;
  transform: translate(120%,0);   /* 右の外に待機 */
}

/* ② 見出し：右上 */
.np-heading{
  z-index: 2;
  right: 4%; top: 10%;
  width: 18%;
  opacity: 0;
  transform: translateY(-12px);
}

/* ③ ロゴ：下寄せ中央 */
.np-logo{
  z-index: 3;
  left: 28%; bottom: 2%;
  width: 40%;
  transform: translateY(12px);
  opacity: 0;
}

/* ---- 発火時（JSで .on を付与） ---- */
.np-hero.on .np-car{
  animation: np-car-in 900ms ease-out forwards;
}
.np-hero.on .np-heading{
  animation: np-fade-up 600ms ease-out 1s forwards;       /* 1秒後 */
}
.np-hero.on .np-logo{
  animation: np-fade-up 600ms ease-out 1.5s forwards;     /* さらに0.5秒後 */
}
.np-hero.on .np-sun{
  animation: np-sunrise 1600ms cubic-bezier(.22,1,.36,1) .6s forwards;
}

/* ---- keyframes ---- */
@keyframes np-car-in{
  0%   { opacity:0; transform: translate(120%,0); }
  100% { opacity:1; transform: translate(0,0); }
}
@keyframes np-fade-up{
  0%   { opacity:0; transform: translateY(12px); }
  100% { opacity:1; transform: translateY(0); }
}
@keyframes np-sunrise{
  0%   { opacity:0; bottom:-18%; transform: translate(-50%,0) scale(.9); }
  100% { opacity:1; bottom:12%;  transform: translate(-50%,0) scale(1); }
}

/* SP微調整（必要なら） */
@media (max-width: 480px){
  .np-heading{ width:22%; right:2%; top:-40%; }
  .np-logo{ width:60%; left:-10%; }
  .np-car{ width:90%; left:10%; bottom:-40%; }
  .np-sun{ width:52%; left:56%; }
}