@charset "utf-8";
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
html {
  font-size: 100%; /* = ブラウザ標準（16px） */
  -webkit-text-size-adjust: 100%;
}
::selection {
  color: #ffffff;
  background-color: #ED7A25;
}
body {
  font-family: dnp-shuei-gothic-kin-std, sans-serif;
  font-weight: 500;
  font-style: normal;
  color: #ffffff;
  background-color: #0D3246;
  scrollbar-gutter: stable; /* スクロールバーが消えても横幅が変わらないようにする */
}
h2 {
  font-family: transat-text, sans-serif;
  font-weight: 700;
  font-style: normal;
  color: #ED7A25;
}
p {
  color: #ffffff;
}
a {
  color: #ED7A25;
  transition: all 0.5s ease;
  text-decoration: none;
  display: block;
}
a:hover {
  color: #ED7A25;
  text-decoration: none;
  background-color: #0D3246;
}
.text_center {
  text-align: center;
}
.red {
  color: #F00;
}
.navy {
  color: #0D3246;
}
.en {}
.en_itbold {}
.zh {}
.vertical_text {}
hr {}
img {
  width: 100%;
  height: auto;
  display: block;
  vertical-align: bottom;
}
.right {
  float: right;
}
.left {
  float: left;
}
@media screen and (min-width: 1025px) and (orientation: landscape) {
  /* 画面サイズが1025px以上横向き */
  br.br_sp, br.br_tab, br.br_pc {
    display: none !important;
  }
  br.br_pc {
    display: block !important;
    content: "" !important; /* Safariなどのブラウザ対策 */
  }
  .h2_titlearea {
    width: auto;
    height: auto;
    text-align: center;
    margin: 11.11vh auto 0;
    display: inline-block;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  h2 {
    font-size: 2.5vw;
    line-height: 3.75vw;
    margin: 0 0 0.93vh;
  }
  .h2_sub {
    font-size: 0.73vw;
    line-height: 1.46vw;
    font-weight: 700;
  }
  p {
    font-size: 1.56vw;
    line-height: 3.13vw;
  }
  .small {
    font-size: 0.73vw;
    line-height: 1.46vw;
  }
  .btn {
    color: #FFFFFF;
    background-color: #ED7A25;
    display: block;
    width: fit-content;
    border-radius: 0.26vw; /* 角を少し丸める */
    transition: all 0.5s ease; /* ホバー時のアニメーション */
  }
  .btn-large {
    font-size: 0.83vw;
    line-height: 1.67vw;
    padding: 0.65vh 1.95vw;
  }
  .btn-small {
    font-size: 0.73vw;
    line-height: 1.85vw;
    margin: 0.93vh 0;
    padding: 0.46vh 0.52vw;
  }
  header {
    position: fixed;
    top: 0;
    width: 100vw;
    height: 11.11vh;
    z-index: 999;
    margin: 0px;
    padding: 0px;
    display: block;
    overflow: hidden;
  }
  .mainlogo {
    width: 20.57vw;
    height: auto;
    position: fixed;
    left: 5.1vw;
    top: 3.7vh;
    z-index: 999;
  }
  .mainlogo a {
    color: unset;
    transition: unset;
    text-decoration: unset;
  }
  .mainlogo a:hover {
    text-decoration: unset;
    background-color: unset;
  }
  /* チェックボックスは隠す */
  #menu-btn-check {
    display: none;
  }
  /* ボタンの土台 */
  .menu-btn {
    display: none !important;
  }
  /* 二本線のハンバーガーボタンを作る */
  .menu-btn span, .menu-btn span::before, .menu-btn span::after {
    content: "";
    display: block;
    height: 0.29vw;
    width: 2.44vw;
    background-color: #ffffff;
    position: absolute;
    transition: all 0.5s ease; /* ふわっと動かす */
  }
  .menu-btn span {
    background-color: transparent; /* 中央の線を透明にする */
  }
  .menu-btn span::before {
    bottom: 0.78vw;
  } /* 上の線 */
  .menu-btn span::after {
    top: 0.78vw;
  } /* 下の線 */
  /* --- クリック（チェック）時の動き --- */
  /* 真ん中の線を透明にする */
  #menu-btn-check {
    display: none !important;
  }
  #navigation_list {
    display: flex !important; /* flexを維持して中身を並べやすく */
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
    position: fixed !important;
    top: 3.7vh;
    right: 5.21vw;
    left: auto; /* 左端固定を解除 */
    width: auto; /* 全画面幅を解除 */
    height: auto; /* ヘッダーの高さに合わせる */
    justify-content: center !important; /* 横方向中央 */
    align-items: center !important; /* 縦方向中央 */
    background-color: transparent !important;
    border: none !important;
    margin: 0;
    z-index: 1000; /* ロゴより手前か同等に */
  }
  #navigation_list ul {
    display: flex !important;
    flex-direction: row !important; /* 横並び */
    justify-content: center !important; /* リスト内横中央 */
    align-items: center !important; /* リスト内縦中央 */
    width: auto !important;
    height: 100%;
    gap: 1.04vw; /* 項目間の最低限の隙間 */
    margin: 0 auto !important;
  }
  #navigation_list .navigation_list_logo {
    display: none !important;
  }
  #navigation_list ul li {
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important; /* 上下に並べる */
    align-items: center !important; /* 左右中央揃え */
    justify-content: center !important; /* 上下中央揃え */
    transition: all 0.3s ease; /* ホバー時の動き用 */
  }
  #navigation_list ul li:nth-child(2) {
    display: none !important; /* NEWSは固定表示なので非表示 */
  }
  #navigation_list ul li a {
    font-family: transat-text, sans-serif !important;
    font-weight: 700;
    font-size: 1.88vw !important;
    line-height: 4.44vh !important;
    color: #FFFFFF;
    text-shadow: 0.7px 0.7px 0px #0D3246;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5px); /* 2. 背景のぼかし */
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
    text-align: center !important; /* テキスト自体のセンター揃え */
    display: block !important;
  }
  #navigation_list ul li a:hover {
    color: #ED7A25;
    text-shadow: 0.7px 0.7px 0px #FFFFFF;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5px); /* 2. 背景のぼかし（少し強めに） */
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  #navigation_list .small.navy {
    display: none !important;
  }
  /* アイコンのデザイン */
  .scrolldown {
    position: fixed;
    bottom: 6vh;
    right: 10vw;
    z-index: 100;
    opacity: 0; /* 最初は隠す */
    pointer-events: none;
    transition: opacity 0.5s ease;
  }
  /* 表示条件に合致した時にJSで付与するクラス */
  .scrolldown.is-visible {
    opacity: 1;
  }
  .scrolldown span {
    display: block;
    font-family: transat-text, sans-serif;
    font-size: 0.73vw;
    color: #FFFFFF;
    letter-spacing: 0.2em;
    writing-mode: vertical-rl;
    position: relative;
    padding-bottom: 60px;
  }
  /* JSで .navy クラスがついた時のアイコン全体の設定 */
  .scrolldown.navy span {
    color: #0D3246 !important; /* 文字の色をネイビーに */
  }
  /* 動く線（before）の色をネイビーに */
  .scrolldown.navy span::before {
    background-color: #0D3246 !important;
  }
  /* 背景の薄い線（after）の色をネイビーに（透過度20%） */
  .scrolldown.navy span::after {
    background-color: rgba(13, 50, 70, 0.2) !important;
  }
  /* アニメーション用の線 */
  .scrolldown span::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 1px;
    height: 50px;
    background: #FFFFFF;
    animation: scroll-anim 2.5s infinite;
  }
  @keyframes scroll-anim {
    0% {
      transform: scale(1, 0);
      transform-origin: 0 0;
    }
    30% {
      transform: scale(1, 1);
      transform-origin: 0 0;
    }
    30.1% {
      transform: scale(1, 1);
      transform-origin: 0 100%;
    }
    60%, 100% {
      transform: scale(1, 0);
      transform-origin: 0 100%;
    }
  }
  /* --- section 共通設定 --- */
  .contents {
    background-color: transparent; /* background-color:透明にする */
    width: 89.79vw;
    margin: 0 5.1vw 0 auto;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    position: static;
  }
  /* 上の固定フレーム */
  .contents::before {
    content: "";
    position: fixed;
    top: 0;
    /* .contentsと同じ幅・同じ位置にする */
    right: 5.1vw;
    width: 89.79vw;
    height: 3.7vh;
    background-color: #0D3246;
    z-index: 800; /* セクションより上に配置 */
    pointer-events: none; /* 下のリンクをクリック可能にする */
  }
  /* 下の固定フレーム */
  .contents::after {
    content: "";
    position: fixed;
    bottom: 0;
    /* .contentsと同じ幅・同じ位置にする */
    right: 5.1vw;
    width: 89.79vw;
    height: 3.7vh;
    background-color: #0D3246;
    z-index: 800;
    pointer-events: none;
  }
  .contents section {
    width: 67.14vw; /* 親の89.79vwに合わせる */
    margin: 0;
    /* 1. heightをautoにし、overflowをvisibleに変更 */
    height: auto !important;
    min-height: 100vh;
    position: relative;
    border-top: 3.7vh solid #0D3246;
    border-bottom: 3.7vh solid #0D3246;
    /* レイアウトの基本：縦並び・中央寄せ */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* 上から順に積む */
    align-items: flex-start;
    overflow: hidden;
  }
  .contents section::before {
    content: ""; /* 必須：これがないと表示されない */
    display: block;
    position: absolute; /* レイアウト用 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: blur(1px) brightness(0.8); /* 少し暗くして文字を浮かせる */
    z-index: -1;
    background-repeat: no-repeat; /* 背景画像を繰り返さない */
    background-size: cover; /* 背景を要素のサイズに合わせて引き伸ばす（隙間を埋める） */
    background-position: center; /* 画像の基準位置を中央にする */
  }
  /* --- 各セクション背景設定 --- */
  #mainvisual {
    display: flex;
    flex-direction: column;
    position: relative;
  }
  #mainvisual::before {
    background-image: url("../images/branding_1920.webp");
  }
  #mainvisual .mv_logo {
    position: relative;
    z-index: 1;
    width: 7.81vw;
    height: auto;
    margin-top: 23.15vh;
    margin-left: 7.81vw;
  }
  #mainvisual .mv_introduction {
    position: relative;
    z-index: 1;
    font-size: 2.04vh;
    line-height: 4.44vh;
    margin-top: 2.6vh; /* ロゴからの距離 */
    margin-left: 7.81vw;
  }
  #mainvisual .mv_semi_introduction {
    position: relative;
    z-index: 1;
    font-size: 0.83vw;
    line-height: 1.67vw;
    width: 50vw;
    height: auto;
    margin-top: 11.07vh; /* 紹介文からの距離 */
    margin-left: 7.81vw;
  }
  #news {
    border-top: 0 !important; /* 上のマージン（帯）を消す */
    border-bottom: 0 !important; /* 下のマージン（帯）を消す */
    position: fixed;
    top: 11.11vh; /* --- 上から 10.42vh 離す --- */
    left: 5.1vw; /* --- 左から 3.91vw --- */
    width: 20.57vw;
    height: 60vh !important;
    min-height: unset !important;
    color: #0D3246;
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: center; /* 中央揃え */
    align-items: center; /* 左右の中央 */
    box-sizing: border-box;
    overflow: hidden;
  }
  #news::before {
    background-color: #DDDDDD;
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  #news .h2_titlearea {
    margin-top: 3.24vh;
    padding: 0;
  }
  #news .h2_titlearea h2 {
    font-size: 1.88vw;
    line-height: 2.81vw;
    margin-bottom: 0.93vh;
  }
  #news .h2_sub, #news p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  .contents #news .blogfeed {
    margin: 1.85vh auto; /* 上下に 1.85vh ずつ */
    padding: 0;
    width: 19.01vw;
    height: calc(100% - 3.7vh);
    overflow-y: auto;
    scrollbar-gutter: stable; /* バーが出ても中身の位置を固定する */
  }
  .blogfeed .rssfeed li {
    list-style-type: none;
    border-bottom: 1px solid #ED7A25;
    margin: 0 0 1.85vh;
    padding: 0;
    /* アイコンを右端に固定するための基準点にする */
    position: relative;
  }
  .blogfeed .rssfeed li:last-child {
    margin-bottom: 0;
  }
  .rssfeed li a {
    color: #0D3246;
    display: block; /*縦並び（日付とタイトル）を維持する */
    text-decoration: none;
    padding: 0.46vh 1.04vw 0.46vh 0.26vw; /* 右側にアイコン用の隙間(3vw)を空ける */
    transition: all 0.5s ease;
    white-space: normal; /* 改行を許可（デフォルトを明示的に） */
    overflow-wrap: break-word; /* 長い単語でも枠線で折り返す */
    word-break: break-all; /* 日本語・英語混じりでも強制的に端で折る */
  }
  .rssfeed li a:hover {
    color: #ED7A25;
  }
  /* ★ liタグの右端にFontAwesomeを埋め込む */
  .blogfeed .rssfeed li::after {
    font-family: "Font Awesome 7 Free", "Font Awesome 6 Free";
    content: "\f105"; /* 矢印（angle-right） */
    font-weight: 900;
    color: #ED7A25;
    font-size: 0.83vw;
    /* 右端・上下中央に配置 */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    /* アイコンの上がクリックできなくなるのを防ぐ */
    pointer-events: none;
    transition: all 0.5s ease;
  }
  .rssfeed li .blog_postday {
    font-size: 0.73vw;
    line-height: 1.46vw;
  }
  .rssfeed li .blog_posttitle {
    font-size: 0.83vw;
    line-height: 1.46vw;
    display: -webkit-box; /* 必須：箱の形を特殊な形式に指定 */
    -webkit-box-orient: vertical; /* 必須：箱を縦方向に並べる指定 */
    -webkit-line-clamp: 1; /* ここで「1行」に制限！ */
    overflow: hidden; /* はみ出た部分を隠す */
  }
  .contents #news p {
    font-size: 1.11vhw;
    line-height: 1.25vw;
  }
  .contents #news .btn {
    align-items: center;
    margin: 1.85vh auto;
  }
  .contents #menulist {}
  .contents #menulist::before {
    background-image: url("../images/menulist_back_1920.webp");
  }
  .contents #menulist .menu_price {
    margin: 4.63vh auto;
    width: 35vw;
    height: auto;
    /* --- Grid設定を追加 --- */
    display: grid;
    grid-template-columns: 1fr auto; /* 左側は残り全部、右側(価格)は中身に合わせる */
    align-items: center;
    row-gap: 2.78vh;
  }
  .contents #menulist .menu_price h3.menu_name {
    font-size: 1.25vw;
    line-height: 2.5vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    width: fit-content;
    display: inline-block; /* 幅を文字ぴったりにする */
    box-shadow: inset 0 -0.46vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0;
    padding: 0;
    grid-column: 1; /* Gridの左列(1列目)に配置 */
  }
  .contents #menulist .menu_price h3.menu_name:nth-of-type(2), .contents #menulist .menu_price h3.menu_name:nth-of-type(3) {
    width: fit-content;
  }
  .contents #menulist .menu_price .price_num {
    font-size: 1.25vw;
    line-height: 2.5vw;
    text-align: right;
    grid-column: 2; /* Gridの右列(2列目)に配置 */
  }
  .contents #menulist .price_notice {
    width: 50vw;
    height: auto;
    margin: 0 auto 2.78vh;
    text-align: center;
  }
  .small.price_notice a {
    display: inline-block;
  }
  .small.price_notice .phone {
    color: #ED7A25;
    font-size: 0.83vw;
    line-height: 1.67vw;
  }
  .contents #aqualock {
    color: #0D3246;
  }
  .contents #aqualock::before {
    background-image: url("../images/store_wall_1920.webp");
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  .contents #aqualock .h2_sub, #aqualock p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  .contents #aqualock .aql_mv {
    margin: 1.85vh auto;
    width: 50vw;
    height: auto;
  }
  .contents #aqualock .aql_intro {
    font-size: 0.83vw;
    line-height: 1.67vw;
    width: 50vw;
    height: auto;
    margin: 0 auto 1.85vh;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  .contents #aqualock .aql_price_container {
    display: flex;
    width: 100%;
    height: auto;
    justify-content: center; /* 左右中央に寄せる */
    align-items: center;
    margin: 0 auto 3.91vh;
    gap: 1.88vw; /* 画像とテキストの距離 */
  }
  .contents #aqualock .aql_price_container .aql_img {
    width: auto;
    height: auto;
    padding: 0;
    display: flex;
    flex-shrink: 0; /* 画像が潰れないように固定 */
  }
  .contents #aqualock .aql_price_container .aql_img img {
    width: 6.25vw;
    height: auto;
  }
  .contents #aqualock .aql_price_container .aql_price {
    /* 中身の幅に合わせる */
    flex-grow: 0;
    width: auto;
    padding: 0;
    /* --- Grid設定を追加 --- */
    display: grid;
    grid-template-columns: 1fr auto; /* 左側は残り全部、右側(価格)は中身に合わせる */
    align-items: center;
    column-gap: 1.04vw; /* --- 1920pxで1.04vwの隙間を確保 --- */
    row-gap: 1.85vh;
  }
  .aql_price_container .aql_price h3.aql_title {
    font-size: 0.83vw;
    line-height: 1.67vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)5pxの太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    justify-self: end; /* Gridセルの中で右端に寄せる */
    text-align: right; /* 複数行になった場合も右揃えにする */
    box-shadow: inset 0 -0.6vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.6vh 0;
  }
  .aql_price_container .aql_price .price_num {
    font-size: 0.83vw;
    line-height: 1.67vw;
  }
  .contents #access {}
  .contents #access::before {
    background-image: url("../images/access_back_1920.webp");
  }
  .contents #access .access_map {
    margin: 0 auto;
    width: 31.25vw;
    height: auto;
  }
  /* --- 表全体のレイアウト --- */
  .contents #access .access_data_grid {
    display: grid;
    /* ここで列の幅を決定します（左残り全部 右20.83vw） */
    grid-template-columns: 1fr 20.83vw;
    width: 26.04vw;
    height: auto;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  /* --- 各マスの設定 --- */
  .contents #access .table_item {
    padding: 0.52vw; /* ボタンがない分、上下余白を少し広めに */
    border-bottom: 1px solid #ccc; /* すべての段の下に線を引く */
    font-size: 0.83vw;
    line-height: 1.67vw;
    display: flex;
    flex-direction: column; /* 縦並び */
    align-items: flex-start; /* 左寄せにする */
  }
  .contents #access .table_item:nth-last-child(-n+2) {
    border-bottom: none; /* 一番下の段の線を消す */
  }
  /* --- 左列（アイコン・見出し） --- */
  .contents #access .table_item.head {
    display: flex; /* flexboxを有効にする */
    align-items: center; /* 縦方向の中央揃え */
    justify-content: center; /* 横方向の中央揃え */
    font-weight: bold;
    white-space: nowrap;
  }
  /* --- 右列（内容） --- */
  .contents #access .table_item p {
    margin: 0;
    font-size: 0.83vw;
    line-height: 1.67vw;
  }
  .contents #access .traffic_data {
    width: auto;
    height: auto;
    margin: 2.78vh auto;
    display: grid;
    grid-template-columns: 1fr auto; /* 左側は残り全部、右側(価格)は中身に合わせる */
    align-items: center;
    column-gap: 1.85vw; /* --- 隙間を確保 --- */
    row-gap: 1.85vh;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  .contents #access .traffic_data h3 {
    font-size: 0.83vw;
    line-height: 1.67vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    justify-self: end; /* Gridセルの中で右端に寄せる */
    text-align: right; /* 複数行になった場合も右揃えにする */
    box-shadow: inset 0 -0.28vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.28vh 0;
  }
  #guide {
    background-color: #0D3246;
    width: 20.31vw;
    height: 21.3vh;
    margin: 0 auto;
    position: fixed;
    top: 74.81vh;
    left: 5.1vw;
    bottom: 3.7vh;
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #fff;
    box-sizing: border-box;
  }
  #guide .guide_list {
    width: auto;
    height: auto;
    margin: 0 auto;
    padding: 0.46vh 0;
    display: inline-block; /* 塊として中央に寄るように設定 */
    text-align: left; /* 中の文字（li）は左寄せにする */
  }
  #guide .guide_list li {
    list-style-type: none;
    font-size: 0.83vw;
    line-height: 1.67vw;
  }
  /* #guide 内の .small を確実に小さくする */
  #guide .small {
    font-size: 0.73vw;
    line-height: 1.46vw;
    display: inline-block; /* 改行や余白を制御しやすくする */
  }
  #guide a {
    display: inline-block;
  }
  #guide .phone {
    color: #ED7A25;
    font-size: 1.15vw;
    line-height: 2.29vw;
  }
  footer {
    position: fixed;
    bottom: 0;
    width: 100vw;
    height: 2.6vh;
    z-index: 999;
    margin: 0px;
    padding: 0px;
  }
  .copyright {
    writing-mode: sideways-lr;
    position: fixed;
    bottom: 3.7vh;
    right: 2.55vw;
    transform: translateX(50%); /* 文字の厚みの半分(50%)だけ右に戻す */
    font-family: "inria-sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 0.73vw;
    line-height: 0.73vw;
  }
}
@media screen and (max-width: 1024px) and (orientation: landscape) {
  /* 画面サイズが1024px横向き */
  br.br_sp, br.br_tab, br.br_pc {
    display: none !important;
  }
  br.br_tab {
    display: block !important;
    content: "" !important; /* Safariなどのブラウザ対策 */
  }
  .h2_titlearea {
    width: auto;
    height: auto;
    text-align: center;
    margin: 13.02vh auto 0;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  h2 {
    font-size: 3.52vw;
    line-height: 5.27vw;
  }
  .h2_sub {
    font-size: 1.17vw;
    line-height: 2.34vw;
    font-weight: 700;
  }
  p {
    font-size: 1.56vw;
    line-height: 3.13vw;
  }
  .small {
    font-size: 1.17vw;
    line-height: 2.34vw;
  }
  .btn {
    color: #FFFFFF;
    background-color: #ED7A25;
    display: block;
    width: fit-content;
    border-radius: 0.49vw; /* 角を少し丸める */
    transition: all 0.5s ease; /* ホバー時のアニメーション */
  }
  .btn-large {
    font-size: 1.17vw;
    line-height: 2.34vw;
    padding: 0.65vh 1.95vw;
  }
  .btn-small {
    font-size: 0.98vw;
    line-height: 1.95vw;
    margin: 1.3vh 0;
    padding: 0.65vh 0.98vw;
  }
  header {
    position: fixed;
    top: 0;
    width: 100vw;
    height: 10.42vh;
    z-index: 999;
    margin: 0px;
    padding: 0px;
    display: block;
    overflow: hidden;
  }
  .mainlogo {
    width: 29.3vw;
    height: auto;
    position: fixed;
    left: 3.91vw;
    top: 2.6vh;
    z-index: 999;
  }
  .mainlogo a {
    color: unset;
    transition: unset;
    text-decoration: unset;
  }
  .mainlogo a:hover {
    text-decoration: unset;
    background-color: unset;
  }
  /* チェックボックスは隠す */
  #menu-btn-check {
    display: none;
  }
  /* ボタンの土台 */
  .menu-btn {
    display: none !important;
  }
  /* 二本線のハンバーガーボタンを作る */
  .menu-btn span, .menu-btn span::before, .menu-btn span::after {
    content: "";
    display: block;
    height: 0.29vw;
    width: 2.44vw;
    background-color: #ffffff;
    position: absolute;
    transition: all 0.5s ease; /* ふわっと動かす */
  }
  .menu-btn span {
    background-color: transparent; /* 中央の線を透明にする */
  }
  .menu-btn span::before {
    bottom: 0.78vw;
  } /* 上の線 */
  .menu-btn span::after {
    top: 0.78vw;
  } /* 下の線 */
  /* --- クリック（チェック）された時の動き --- */
  /* 真ん中の線を透明にする */
  #menu-btn-check {
    display: none;
  }
  #navigation_list {
    display: flex !important; /* flexを維持して中身を並べやすく */
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
    position: fixed !important;
    top: 3.7vh;
    right: 5.21vw;
    left: auto; /* 左端固定を解除 */
    width: auto; /* 全画面幅を解除 */
    height: auto; /* ヘッダーの高さに合わせる（既存数値より） */
    justify-content: center !important; /* 横方向中央 */
    align-items: center !important; /* 縦方向中央 */
    background-color: transparent !important;
    border: none !important;
    margin: 0;
    z-index: 1000; /* ロゴより手前か同等に */
  }
  #navigation_list ul {
    display: flex !important;
    flex-direction: row !important; /* 横並び */
    justify-content: center !important; /* リスト内でも横中央 */
    align-items: center !important; /* リスト内でも縦中央 */
    width: auto !important;
    height: 100%;
    gap: 1.04vw; /* 項目間の最低限の隙間 */
    margin: 0 auto !important;
  }
  #navigation_list .navigation_list_logo {
    display: none !important;
  }
  #navigation_list ul li {
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important; /* 上下に並べる */
    align-items: center !important; /* 左右中央揃え */
    justify-content: center !important; /* 上下中央揃え */
    transition: all 0.3s ease; /* ホバー時の動き用 */
  }
  #navigation_list ul li:nth-child(2) {
    display: none !important; /* NEWSは固定表示なので非表示 */
  }
  #navigation_list ul li a {
    font-family: transat-text, sans-serif !important;
    font-weight: 700;
    font-size: 2.34vw !important;
    line-height: 4.69vh !important;
    color: #FFFFFF;
    text-shadow: 0.7px 0.7px 0px #0D3246;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5px); /* 背景のぼかし（少し強めに） */
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
    text-align: center !important;
    display: block !important;
  }
  #navigation_list ul li a:hover {
    color: #ED7A25;
    text-shadow: 0.7px 0.7px 0px #FFFFFF;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5px); /* 背景のぼかし（少し強めに） */
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  #navigation_list .small.navy {
    display: none !important;
  }
  /* スクロールアイコン */
  .scrolldown {
    position: fixed !important;
    bottom: 7.81vh; /* 768px基準で60px相当 */
    right: 5.21vw; /* 1024px基準で約53px相当 */
    z-index: 100;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.5s ease;
  }
  /* JSで表示フラグが立った時 */
  .scrolldown.is-visible {
    opacity: 1 !important;
  }
  /* テキスト設定 */
  .scrolldown span {
    display: block;
    font-family: transat-text, sans-serif;
    font-size: 1.17vw; /* 1024pxで約12px */
    color: #FFFFFF;
    letter-spacing: 0.2em;
    writing-mode: vertical-rl;
    position: relative;
    padding-bottom: 60px; /* 線との固定余白 */
    transition: color 0.5s ease;
  }
  /* 擬似要素（線）の共通設定 */
  .scrolldown span::before, .scrolldown span::after {
    content: ""; /* 描画に必須 */
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 1px;
    height: 6.51vh; /* 768px基準で50px相当 */
    transition: background-color 0.5s ease;
  }
  /* アニメーションするメインの線 */
  .scrolldown span::before {
    background-color: #FFFFFF;
    animation: scroll-anim-landscape 2.5s infinite !important; /* 強制適用。このブロック内のkeyframesを参照 */
    z-index: 2;
  }
  /* 静止しているガイド線 */
  .scrolldown span::after {
    background-color: rgba(255, 255, 255, 0.2);
    z-index: 1;
  }
  /* ネイビー（aqualockセクション用）設定 */
  .scrolldown.navy span {
    color: #0D3246 !important;
  }
  .scrolldown.navy span::before {
    background-color: #0D3246 !important;
  }
  .scrolldown.navy span::after {
    background-color: rgba(13, 50, 70, 0.2) !important;
  }
  /* キーフレーム定義（この環境専用） */
  @keyframes scroll-anim-landscape {
    0% {
      transform: scale(1, 0);
      transform-origin: 0 0;
    }
    30% {
      transform: scale(1, 1);
      transform-origin: 0 0;
    }
    30.1% {
      transform: scale(1, 1);
      transform-origin: 0 100%;
    }
    60%, 100% {
      transform: scale(1, 0);
      transform-origin: 0 100%;
    }
  }
  /* --- section 共通設定 --- */
  .contents {
    background-color: transparent; /* background-color:透明にする */
    width: 92.19vw;
    margin: 0 3.91vw 0 auto;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    position: static;
    /* フェード用の transition */
    opacity: 1;
    visibility: visible;
    transition: opacity 0.5s ease, visibility 0.8s;
  }
  /* 上の固定フレーム */
  .contents::before {
    content: "";
    position: fixed;
    top: 0;
    /* .contentsと同じ幅・同じ位置 */
    right: 3.91vw;
    width: 92.19vw;
    height: 2.6vh;
    background-color: #0D3246;
    z-index: 800; /* セクションより上に配置 */
    pointer-events: none; /* 下のリンクをクリック可能にする */
  }
  /* 下の固定フレーム */
  .contents::after {
    content: "";
    position: fixed;
    bottom: 0;
    /* .contentsと同じ幅・同じ位置にする */
    right: 3.91vw;
    width: 92.19vw;
    height: 2.6vh;
    background-color: #0D3246;
    z-index: 800;
    pointer-events: none;
  }
  .contents section {
    width: 58.98vw; /* 親の 92.19vwに合わせる */
    margin: 0;
    /* 1. heightをautoにし、overflowをvisibleに変更 */
    height: auto !important;
    min-height: 100vh !important;
    position: relative;
    border-top: 2.6vh solid #0D3246;
    border-bottom: 2.6vh solid #0D3246;
    /* レイアウトの基本：縦並び・中央寄せ */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* 上から順に積む */
    align-items: flex-start;
  }
  /* 最初のセクションだけ上のマージンを戻す */
  .contents section:first-child {
    margin-top: 0;
  }
  .contents section::before {
    content: ""; /* 必須：これがないと表示されない */
    display: block;
    position: absolute; /* レイアウト用 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: blur(1px) brightness(0.8); /* 少し暗くして文字を浮かせる */
    z-index: -1;
    background-repeat: no-repeat; /* 背景画像を繰り返さない */
    background-size: cover; /* 背景を要素のサイズに合わせて引き伸ばす（隙間を埋める） */
    background-position: center; /* 画像の基準位置を中央にする（スマホの縦長画面でも綺麗に切り抜かれます） */
  }
  /* --- 各セクション背景設定 --- */
  #mainvisual {
    display: flex;
    flex-direction: column;
    position: relative;
  }
  #mainvisual::before {
    background-image: url("../images/branding_1920.webp");
  }
  #mainvisual .mv_logo {
    position: relative;
    z-index: 1;
    width: 8.3vw;
    height: auto;
    margin-top: 11.72vh;
    margin-left: 7.81vw;
  }
  #mainvisual .mv_introduction {
    position: relative;
    z-index: 1;
    line-height: 4.69vw;
    margin-top: 2.6vh; /* ロゴからの距離を確保 */
    margin-left: 7.81vw;
    width: fit-content; /* 文字の長さに合わせる */
    display: block;
  }
  #mainvisual .mv_semi_introduction {
    position: relative;
    z-index: 1;
    font-size: 1.37vw;
    line-height: 2.73vw;
    height: auto;
    margin-top: 11.07vh; /* 紹介文からの距離を確保 */
    margin-left: 7.81vw;
    padding-bottom: 6.51vh;
    width: fit-content; /* 50vwを解除して、改行に従わせる */
    height: auto;
    display: block;
  }
  #news {
    border-top: 0 !important; /* 上のマージン（帯）を消す */
    border-bottom: 0 !important; /* 下のマージン（帯）を消す */
    position: fixed;
    top: 10.42vh; /* --- 上から 10.42vh 離す --- */
    left: 3.91vw; /* --- 左から 3.91vw --- */
    width: 29.3vw;
    height: 60vh !important;
    min-height: unset !important;
    color: #0D3246;
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: center; /* 中央揃え */
    align-items: center; /* 左右の中央 */
    box-sizing: border-box;
    overflow: hidden;
  }
  #news::before {
    background-color: #DDDDDD;
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  #news .h2_titlearea {
    margin-top: 2.6vh;
    padding: 0;
  }
  #news .h2_sub, #news p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  .contents #news .blogfeed {
    margin: 2.6vh auto; /* 上下に 2.6vh ずつ */
    padding: 0;
    width: 27.34vw;
    height: calc(100% - 5.2vh);
    overflow-y: auto;
    scrollbar-gutter: stable; /* バーが出ても中身の位置を固定する */
  }
  .blogfeed .rssfeed li {
    list-style-type: none;
    border-bottom: 1px solid #ED7A25;
    margin: 0 0 1.95vh;
    padding: 0;
    /*  アイコンを右端に固定するための基準点 */
    position: relative;
  }
  .blogfeed .rssfeed li:last-child {
    margin-bottom: 0;
  }
  .rssfeed li a {
    color: #0D3246;
    display: block; /* 縦並び（日付とタイトル）を維持する */
    text-decoration: none;
    padding: 0.65vh 1.95vw 0.65vh 0.49vw; /* 右側にアイコン用の隙間(3vw)を空ける */
    transition: all 0.5s ease;
    white-space: normal; /* 改行を許可する（デフォルトを明示的に） */
    overflow-wrap: break-word; /* 長い単語でも枠線で折り返す */
    word-break: break-all; /* 日本語・英語混じりでも強制的に端で折る */
  }
  .rssfeed li a:hover {
    color: #ED7A25;
  }
  /* ★ liタグの右端にFontAwesomeを埋め込む */
  .blogfeed .rssfeed li::after {
    font-family: "Font Awesome 7 Free", "Font Awesome 6 Free";
    content: "\f105"; /* 矢印（angle-right） */
    font-weight: 900;
    color: #ED7A25;
    font-size: 1.17vw;
    /* 右端・上下中央に配置 */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    /* アイコンの上がクリックできなくなるのを防ぐ */
    pointer-events: none;
    transition: all 0.5s ease;
  }
  .rssfeed li .blog_postday {
    font-size: 0.98vw;
    line-height: 1.95vw;
  }
  .rssfeed li .blog_posttitle {
    font-size: 1.17vw;
    line-height: 2.34vw;
    display: -webkit-box; /* 必須：箱の形を特殊な形式に指定 */
    -webkit-box-orient: vertical; /* 必須：箱を縦方向に並べる指定 */
    -webkit-line-clamp: 1; /* ここで「1行」に制限！ */
    overflow: hidden; /* はみ出た部分を隠す */
  }
  .contents #news p {
    font-size: 0.98vw;
    line-height: 1.95vw;
  }
  .contents #news .btn {
    align-items: center;
    margin: 1.3vh auto;
  }
  .contents #menulist {}
  .contents #menulist::before {
    background-image: url("../images/menulist_back_1920.webp");
  }
  .contents #menulist .menu_price {
    margin: 3.91vh auto;
    width: 50vw;
    height: auto;
    /* --- Grid設定を追加 --- */
    display: grid;
    grid-template-columns: 1fr auto; /* 左側は残り全部、右側(価格)は中身に合わせる */
    align-items: center;
    row-gap: 3.91vh;
  }
  .contents #menulist .menu_price h3.menu_name {
    font-size: 1.56vw;
    line-height: 3.13vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    width: fit-content;
    display: inline-block; /* 幅を文字ぴったりにする */
    box-shadow: inset 0 -0.6vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0;
    padding: 0;
    grid-column: 1; /* Gridの左列(1列目)に配置 */
  }
  .contents #menulist .menu_price h3.menu_name:nth-of-type(2), .contents #menulist .menu_price h3.menu_name:nth-of-type(3) {
    width: fit-content;
  }
  .contents #menulist .menu_price .price_num {
    font-size: 2.15vw;
    line-height: 2.73vw;
    text-align: right;
    grid-column: 2; /* Gridの右列(2列目)に配置 */
  }
  .contents #menulist .price_notice {
    width: 50vw;
    height: auto;
    margin: 0 auto 3.91vh;
    text-align: center;
  }
  .small.price_notice a {
    display: inline-block;
  }
  .small.price_notice .phone {
    color: #ED7A25;
    font-size: 1.56vw;
    line-height: 3.13vw;
  }
  .contents #aqualock {
    color: #0D3246;
  }
  .contents #aqualock::before {
    background-image: url("../images/store_wall_1920.webp");
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  .contents #aqualock .h2_sub, #aqualock p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  .contents #aqualock .aql_mv {
    margin: 1.95vh auto;
    width: 100%;
    height: auto;
  }
  .contents #aqualock .aql_intro {
    font-size: 1.37vw;
    line-height: 2.73vw;
    width: 48.83vw;
    height: auto;
    margin: 0 auto 1.95vh;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  .contents #aqualock .aql_price_container {
    display: flex;
    width: 100%;
    height: auto;
    justify-content: center; /* 左右中央に寄せる */
    align-items: center;
    margin: 0 auto 3.91vh;
    gap: 5vw; /* 画像とテキストの距離 */
  }
  .contents #aqualock .aql_price_container .aql_img {
    width: auto;
    height: auto;
    padding: 0;
    display: flex;
    flex-shrink: 0; /* 画像が潰れないように固定 */
  }
  .contents #aqualock .aql_price_container .aql_img img {
    width: 11.52vw;
    height: auto;
  }
  .contents #aqualock .aql_price_container .aql_price {
    /* 中身の幅に合わせる */
    flex-grow: 0;
    width: auto;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr auto; /* 左側は残り全部、右側(価格)は中身に合わせる */
    align-items: center;
    column-gap: 1.85vw; /* --- 隙間を確保 --- */
    row-gap: 1.3vh;
  }
  .aql_price_container .aql_price h3.aql_title {
    font-size: 1.56vw;
    line-height: 3.13vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    justify-self: end; /* Gridセルの中で右端に寄せる */
    text-align: right; /* 複数行になった場合も右揃えにする */
    box-shadow: inset 0 -0.6vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.6vh 0;
  }
  .aql_price_container .aql_price .price_num {
    font-size: 1.56vw;
    line-height: 3.13vw;
  }
  .contents #access {}
  .contents #access::before {
    background-image: url("../images/access_back_1920.webp");
  }
  .contents #access .access_map {
    margin: 0 auto;
    width: 39.06vw;
    height: auto;
  }
  /* --- 表全体のレイアウト --- */
  .contents #access .access_data_grid {
    display: grid;
    /* ここで列の幅を決定します（左残り全部 39.06vw） */
    grid-template-columns: 1fr 39.06vw;
    width: 50vw;
    height: auto;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  /* --- 各マスの設定 --- */
  .contents #access .table_item {
    padding: 0.98vw; /* ボタンがない分、上下余白を少し広めに */
    border-bottom: 1px solid #ccc; /* すべての段の下に線を引く */
    font-size: 1.37vw;
    line-height: 2.73vw;
    display: flex;
    flex-direction: column; /* 縦並びを確定させる */
    align-items: flex-start; /* 左寄せにする */
  }
  .contents #access .table_item:nth-last-child(-n+2) {
    border-bottom: none; /* 一番下の段の線を消す */
  }
  /* --- 左列（アイコン・見出し） --- */
  .contents #access .table_item.head {
    display: flex; /* flexboxを有効にする */
    align-items: center; /* 縦方向の中央揃え */
    justify-content: center; /* 横方向の中央揃え */
    font-weight: bold;
    white-space: nowrap;
  }
  /* --- 右列（内容） --- */
  .contents #access .table_item p {
    margin: 0;
    font-size: 1.37vw;
    line-height: 2.73vw;
  }
  .contents #access .traffic_data {
    width: 50vw;
    height: auto;
    margin: 2.6vh auto;
    display: grid;
    grid-template-columns: 1fr auto; /* 左側は残り全部、右側(価格)は中身に合わせる */
    align-items: center;
    column-gap: 1.85vw; /* --- 隙間を確保 --- */
    row-gap: 1.85vh;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  .contents #access .traffic_data h3 {
    font-size: 1.37vw;
    line-height: 2.73vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    justify-self: end; /* Gridセルの中で右端に寄せる */
    text-align: right; /* 複数行になった場合も右揃えにする */
    box-shadow: inset 0 -0.39vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.39vh 0;
  }
  #guide {
    background-color: #0D3246;
    width: 29.3vw;
    height: 21.77vh;
    margin: 0 auto;
    position: fixed;
    top: 75.63vh;
    left: 3.91vw;
    bottom: 2.6vh;
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #fff;
    box-sizing: border-box;
    overflow-y: auto;
  }
  #guide .guide_list {
    width: auto;
    height: auto;
    margin: 0 auto;
    padding: 0.65vh 0;
    display: inline-block; /* 塊として中央に寄るように設定 */
    text-align: left; /* 中の文字（li）は左寄せにする */
  }
  #guide .guide_list li {
    list-style-type: none;
    font-size: 1.17vw;
    line-height: 2.34vw;
  }
  #guide a {
    display: inline-block;
  }
  #guide .phone {
    color: #ED7A25;
    font-size: 1.37vw;
    line-height: 2.73vw;
  }
  footer {
    position: fixed;
    bottom: 0;
    width: 100vw;
    height: 2.6vh;
    z-index: 999;
    margin: 0px;
    padding: 0px;
  }
  .copyright {
    writing-mode: sideways-lr;
    position: fixed;
    bottom: 2.6vh;
    right: 0vw;
    font-family: "inria-sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 0.98vw;
    line-height: 3.91vw;
  }
}
@media screen and (max-width: 1023px) and (orientation: landscape) and (max-height: 500px) {
  /* 画面サイズが1023pxまで高さ500pxまで横向き */
  br.br_sp, br.br_tab, br.br_pc {
    display: none !important;
  }
  br.br_tab {
    display: block !important;
    content: "" !important; /* Safariなどのブラウザ対策 */
  }
  .h2_titlearea {
    width: auto;
    height: auto;
    text-align: center;
    margin: 24vh auto 0;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  h2 {
    font-size: 4.69vw;
    line-height: 7.03vw;
  }
  .h2_sub {
    font-size: 1.17vw;
    line-height: 2.34vw;
    font-weight: 700;
  }
  p {
    font-size: 1.56vw;
    line-height: 3.13vw;
  }
  .small {
    font-size: 1.17vw;
    line-height: 2.34vw;
  }
  .btn {
    color: #FFFFFF;
    background-color: #ED7A25;
    display: block;
    width: fit-content;
    border-radius: 0.49vw; /* 角を少し丸める */
    transition: all 0.5s ease; /* ホバー時のアニメーション */
  }
  .btn-large {
    font-size: 1.56vw;
    line-height: 2.54vw;
    padding: 0.98vw 1.95vw;
  }
  .btn-small {
    font-size: 0.98vw;
    line-height: 1.95vw;
    margin: 2vh 0;
    padding: 0.49vw 0.98vw;
  }
  header {
    position: fixed;
    top: 0;
    width: 100vw;
    height: 15.63vw;
    z-index: 999;
    margin: 0px;
    padding: 0px;
    display: block;
    overflow: hidden;
  }
  .mainlogo {
    width: 34.18vw;
    height: auto;
    position: fixed;
    left: 3.91vw;
    top: 3.91vw;
    z-index: 999;
  }
  .mainlogo a {
    color: unset;
    transition: unset;
    text-decoration: unset;
  }
  .mainlogo a:hover {
    text-decoration: unset;
    background-color: unset;
  }
  /* チェックボックスは隠す */
  #menu-btn-check {
    display: none;
  }
  /* ボタンの土台 */
  .menu-btn {
    position: fixed !important;
    top: 8vh !important;
    right: 3.91vw !important;
    display: flex !important;
    height: 4.39vw;
    width: 4.39vw;
    justify-content: center;
    align-items: center;
    z-index: 1001 !important; /* ★最前面(1001)に設定。レスポンシブ対策 */
    background-color: #ED7A25; /* サイトの色に合わせて調整 */
    cursor: pointer;
  }
  /* 二本線のハンバーガーボタンを作る */
  .menu-btn span, .menu-btn span::before, .menu-btn span::after {
    content: "";
    display: block;
    height: 0.29vw;
    width: 2.44vw;
    background-color: #ffffff;
    position: absolute;
    transition: all 0.5s ease; /* ふわっと動かす */
  }
  .menu-btn span {
    background-color: transparent; /* 中央の線を透明にする */
  }
  .menu-btn span::before {
    bottom: 0.78vw;
  } /* 上の線 */
  .menu-btn span::after {
    top: 0.78vw;
  } /* 下の線 */
  /* --- クリック（チェック）された時の動き --- */
  /* 真ん中の線を透明にする */
  #menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0) !important;
  }
  /* 上の線を45度回転させて「×」の片側にする */
  #menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
  }
  /* 下の線を-45度回転させて「×」の反対側にする */
  #menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
  }
  #navigation_list {
    z-index: 1000 !important; /* ★レスポンシブ対策 */
    background-color: rgb(255 255 255 / 0.9) !important;
    border-top: 8vh solid #0D3246 !important;
    border-left: 3.91vw solid #0D3246 !important;
    border-right: 3.91vw solid #0D3246 !important;
    border-bottom: 8vh solid #0D3246 !important;
    width: 100vw !important;
    height: 100vh !important;
    margin: 0 auto !important;
    text-align: center !important;
    /* --- 中央配置の設定 --- */
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important; /* 上下中央 */
    align-items: center !important; /* 左右中央 */
    /* --- スクロール制御（重複を整理） --- */
    overflow-y: auto !important; /* 縦に長くなった時だけスクロール */
    overflow-x: hidden !important; /* 横スクロール禁止 */
    scrollbar-gutter: stable !important; /* スクロールバーが出てもガタつかない */
    /* --- 初期状態 --- */
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: scale(0.95) !important;
    transition: 0.6s ease, transform 0.6s ease, visibility 0.6s !important;
    pointer-events: none !important;
  }
  /* --- チェック時の動き --- */
  #menu-btn-check:checked ~ #navigation_list {
    opacity: 1 !important;
    visibility: visible !important;
    transform: scale(1) !important; /* 元の大きさに戻して表示 */
    pointer-events: auto !important; /* クリックできるようにする */
  }
  #navigation_list .navigation_list_logo {
    width: 9.77vw !important;
    height: auto !important;
    margin: 4vh auto !important;
  }
  #navigation_list div.navigation_list_logo, #navigation_list .navigation_list_logo, #navigation_list .navigation_list_logo img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  #navigation_list ul {
    list-style-type: none !important;
    /* 2列にするためにflexを設定 */
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important; /* 左右に振り分け */
    width: 80vw !important;
    height: auto !important;
    margin: 0 auto !important;
    gap: 0 !important; /* 1024px版のgapを解除 */
  }
  #navigation_list ul li {
    list-style-type: none !important;
    margin: 0 0 6vh !important;
    display: flex !important;
    flex-direction: column !important; /* ★ここが2段にする肝 */
    align-items: center !important;
  }
  #navigation_list ul li:nth-child(2) {
    display: block !important; /* ★NEWSの非表示設定を解除して表示 */
  }
  #navigation_list ul li a {
    font-family: transat-text, sans-serif !important;
    font-weight: 700 !important;
    font-style: normal !important;
    font-size: 4.69vw !important;
    line-height: 7.03vw !important;
    display: block !important; /* これで横幅いっぱいに広がる */
    /* 1024px版の背景装飾を解除 */
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    text-shadow: none !important;
    color: #ED7A25 !important; /* オレンジに変更 */
  }
  #navigation_list .small {
    font-size: 1.17vw !important;
    line-height: 2.34vw !important;
    display: block !important; /* ★強制表示（PC版のhidden対策） */
  }
  #navigation_list .small.navy {
    display: block !important; /* ★p.small.navyを表示（1024px版のnoneを解除） */
    color: #0D3246 !important; /* ネイビー色を維持 */
    font-size: 1.17vw !important;
    line-height: 2.34vw !important;
  }
  /* --- section 共通設定 --- */
  .contents {
    background-color: transparent; /* background-color:透明にする */
    width: 92.19vw !important;
    margin: 0 auto !important; /* 右寄せ(static配置)を中央寄せに */
    height: auto;
    display: flex;
    flex-direction: column;
    /* フェード用の transition */
    opacity: 1;
    visibility: visible;
    transition: opacity 0.5s ease, visibility 0.8s;
  }
  .contents section {
    width: 100% !important; /* 個別セクションの幅を 100% (親の92.19vw) に戻す */
    margin: 0 auto !important;
    /* 1. heightをautoにし、overflowをvisibleに変更 */
    height: auto !important;
    min-height: 84vh;
    position: relative;
    border-top: 8vh solid #0D3246;
    border-bottom: 8vh solid #0D3246;
    /* レイアウトの基本：縦並び・中央寄せ */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* 上から順に積む */
  }
  /* 1024px版で追加された上下の固定フレーム(::before/::after)を隠す */
  .contents::before, .contents::after {
    display: none !important;
  }
  /* 最初のセクションだけ上のマージンを戻す */
  .contents section:first-child {
    margin-top: 0;
  }
  .contents section::before {
    content: ""; /* 表示の為に必須 */
    display: block;
    position: absolute; /* レイアウト用 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: blur(1px) brightness(0.8); /* 少し暗くして文字を浮かせる */
    z-index: -1;
    background-repeat: no-repeat; /* 背景画像を繰り返さない */
    background-size: cover; /* 背景を要素のサイズに合わせて引き伸ばす（隙間を埋める） */
    background-position: center; /*  画像の基準位置を中央にする */
  }
  /* --- 各セクション背景設定 --- */
  #mainvisual {
    display: flex;
    flex-direction: column;
    position: relative;
  }
  #mainvisual::before {
    background-image: url("../images/branding_1920.webp");
  }
  #mainvisual .mv_logo {
    position: relative;
    z-index: 1;
    width: 8.3vw;
    height: auto;
    margin-top: 24vh;
    margin-left: 3.91vw;
  }
  #mainvisual .mv_introduction {
    position: relative;
    z-index: 1;
    line-height: 4.69vw;
    margin-top: 4vh; /* ロゴからの距離 */
    margin-left: 3.91vw;
  }
  #mainvisual .mv_semi_introduction {
    position: relative;
    z-index: 1;
    font-size: 1.37vw;
    line-height: 2.73vw;
    width: 50vw;
    height: auto;
    margin-top: 10vh; /* 紹介文からの距離 */
    margin-left: 3.91vw;
    padding-bottom: 5vh;
  }
  #news {
    color: #0D3246;
    position: relative !important; /* 1024px版の fixed を解除 */
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 84vh !important;
    margin: 0 auto !important;
    z-index: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important; /* 中央寄せを解除 */
    border-top: 8vh solid #0D3246 !important;
    border-bottom: 8vh solid #0D3246 !important;
  }
  #news::before {
    background-color: #DDDDDD;
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  #news .h2_titlearea {
    margin-top: 24vh !important;
  }
  #news .h2_sub, #news p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  .contents #news .blogfeed {
    margin: 14vh auto 0 !important;
    padding: 3vh 0;
    width: 50.78vw !important;
    height: auto !important;
    overflow: visible !important;
  }
  .blogfeed .rssfeed li {
    list-style-type: none;
    border-bottom: 1px solid #ED7A25;
    margin: 0 0 18vh;
    padding: 0;
    /* アイコンを右端に固定するための基準点 */
    position: relative;
  }
  .rssfeed li a {
    color: #0D3246;
    display: block; /* 縦並び（日付とタイトル）を維持 */
    text-decoration: none;
    padding: 2vh 2.25vw 2vh 0; /* 右側にアイコン用の隙間 */
    transition: all 0.5s ease;
    white-space: normal; /* 改行を許可する（デフォルトを明示的に） */
    overflow-wrap: break-word; /* 長い単語でも枠線で折り返す */
    word-break: break-all; /* 日本語・英語混じりでも強制的に端で折る */
  }
  .rssfeed li a:hover {
    color: #ED7A25;
  }
  /* ★liタグの右端にFontAwesomeを埋め込む */
  .blogfeed .rssfeed li::after {
    font-family: "Font Awesome 7 Free", "Font Awesome 6 Free";
    content: "\f105"; /* 矢印（angle-right） */
    font-weight: 900;
    color: #ED7A25;
    font-size: 2.6vw;
    /* 右端・上下中央に配置 */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    /* アイコンの上がクリックできなくなるのを防ぐ */
    pointer-events: none;
    transition: all 0.5s ease;
  }
  .rssfeed li .blog_postday {
    font-size: 1.17vw;
    line-height: 2.34vw;
  }
  .rssfeed li .blog_posttitle {
    font-size: 1.56vw;
    line-height: 3.13vw;
    display: -webkit-box; /* 必須：箱の形を特殊な形式に指定 */
    -webkit-box-orient: vertical; /* 必須：箱を縦方向に並べる指定 */
    -webkit-line-clamp: 1; /* ここで「1行」に制限！ */
    overflow: hidden; /* はみ出た部分を隠す */
  }
  .contents #news .btn {
    align-items: center;
    margin: 4vh auto 8vh;
  }
  .contents #menulist {}
  .contents #menulist::before {
    background-image: url("../images/menulist_back_1920.webp");
  }
  .contents #menulist .menu_price {
    margin: 4vh auto 0 !important; /* 元の数値 4vh を維持 */
    width: 31.25vw !important; /* 元の数値 31.25vw を維持 */
    height: auto;
    display: block !important; /* gridを解除して元の縦並びに */
  }
  .contents #menulist .menu_price h3.menu_name {
    font-size: 1.56vw;
    line-height: 3.13vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)5pxの太さ */
    display: inline-block !important; /* 幅を文字ぴったりにする */
    box-shadow: inset 0 -0.6vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 6vh 0 2vh !important; /* 元の数値 6vh / 2vh を維持 */
    width: fit-content !important;
  }
  /* 最初の要素のマージンリセットも元の数値を維持 */
  .contents #menulist .menu_price h3.menu_name:first-of-type {
    margin-top: 0 !important;
  }
  .contents #menulist .menu_price .price_num {
    font-size: 2.15vw !important; /* 元の数値 2.15vw を維持 */
    line-height: 2.73vw;
    display: block !important;
    text-align: left !important; /* Gridの右寄せを解除 */
  }
  .contents #menulist .price_notice {
    width: 50vw;
    height: auto;
    margin: 14vh auto 6vh;
    text-align: center;
  }
  .small.price_notice a {
    display: inline-block;
  }
  .small.price_notice .phone {
    color: #ED7A25;
    font-size: 1.56vw;
    line-height: 2.73vw;
  }
  .contents #aqualock {
    color: #0D3246;
  }
  .contents #aqualock::before {
    background-image: url("../images/store_wall_1920.webp");
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  .contents #aqualock .h2_sub, #aqualock p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  .contents #aqualock .aql_mv {
    margin: 6vh auto;
    width: 100%;
    height: auto;
  }
  .contents #aqualock .aql_intro {
    font-size: 1.56vw;
    line-height: 3.13vw;
    width: 48.83vw;
    height: auto;
    margin: 0 auto 6vh;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  .contents #aqualock .aql_price_container {
    display: flex;
    width: 100%;
    height: auto;
    justify-content: center; /* 左右中央に寄せる */
    align-items: center;
    margin: 0 auto 10vh;
    gap: 4.88vw; /* 画像とテキストの距離 */
  }
  .contents #aqualock .aql_price_container .aql_img {
    width: auto;
    height: auto;
    padding: 0;
    display: flex;
    flex-shrink: 0; /* 画像が潰れないように固定 */
  }
  .contents #aqualock .aql_price_container .aql_img img {
    width: 11.72vw;
    height: auto;
  }
  .contents #aqualock .aql_price_container .aql_price {
    /* 中身の幅に合わせる */
    flex-grow: 0;
    width: auto;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr auto; /* 左側は残り全部、右側(価格)は中身に合わせる */
    align-items: center;
    column-gap: 1.85vw; /* --- 隙間を確保 --- */
    row-gap: 1.85vh;
  }
  .aql_price_container .aql_price h3.aql_title {
    font-size: 1.56vw;
    line-height: 2.34vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    justify-self: end; /* Gridセルの中で右端に寄せる */
    text-align: right; /* 複数行になった場合も右揃えにする */
    box-shadow: inset 0 -0.6vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.6vh 0;
  }
  .aql_price_container .aql_price .price_num {
    font-size: 2.15vw;
    line-height: 4.3vw;
    display: inline-block !important;
    white-space: nowrap;
  }
  .contents #access {}
  .contents #access::before {
    background-image: url("../images/access_back_1920.webp");
  }
  .contents #access .access_map {
    margin: 4vh auto;
    width: 58.59vw;
    height: auto;
  }
  /* --- 表全体のレイアウト --- */
  .contents #access .access_data_grid {
    display: grid;
    grid-template-columns: 1fr 39.06vw; /* ここで列の幅を決める（左残り全部 右39.06vw） */
    width: 50vw;
    height: auto;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  /* --- 各マスの設定 --- */
  .contents #access .table_item {
    padding: 0.98vw; /* ボタンがない分、上下余白を少し広めに */
    border-bottom: 1px solid #ccc; /* すべての段の下に線を引く */
    font-size: 1.37vw;
    line-height: 2.73vw;
    display: flex;
    flex-direction: column; /* 縦並びを確定させる */
    align-items: flex-start; /* 左寄せにする */
  }
  .contents #access .table_item:nth-last-child(-n+2) {
    border-bottom: none; /* 一番下の段の線を消す */
  }
  /* --- 左列（アイコン・見出し） --- */
  .contents #access .table_item.head {
    display: flex; /* flexboxを有効にする */
    align-items: center; /* 縦方向の中央揃え */
    justify-content: center; /* 横方向の中央揃え */
    font-weight: bold;
    white-space: nowrap;
  }
  /* --- 右列（内容） --- */
  .contents #access .table_item p {
    margin: 0;
    font-size: 1.37vw;
    line-height: 2.73vw;
  }
  .contents #access .traffic_data {
    width: max-content;
    height: auto;
    margin: 6vh auto;
    display: grid;
    grid-template-columns: auto auto; /* 左側は残り全部、右側(価格)は中身に合わせる */
    align-items: center;
    column-gap: 1.85vw; /* --- 隙間を確保 --- */
    row-gap: 1.85vh;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  .contents #access .traffic_data h3 {
    font-size: 1.37vw;
    line-height: 2.73vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    justify-self: end; /* Gridセルの中で右端に寄せる */
    text-align: right; /* 複数行になった場合も右揃えにする */
    box-shadow: inset 0 -0.6vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.6vh 0;
  }
  #guide {
    background-color: #0D3246;
    width: 92.19vw;
    height: auto;
    margin: 0 auto 8vh !important;
    display: block;
    text-align: center;
    position: relative !important; /* 固定を解除して流れに戻す */
    top: auto !important; /* PC版のtop指定を無効化 */
    left: auto !important; /* PC版のleft指定を無効化 */
    transform: none !important; /* もしPC版で位置調整してたら解除 */
  }
  #guide .guide_list {
    width: auto;
    height: auto;
    margin: 0 auto 4vh;
    display: inline-block; /* 塊として中央に寄るように設定 */
    text-align: left; /* 中の文字（li）は左寄せ */
  }
  #guide .guide_list li {
    list-style-type: none;
    font-size: 1.37vw;
    line-height: 2.73vw;
  }
  #guide a {
    display: inline-block;
  }
  #guide .phone {
    color: #ED7A25;
    font-size: 2.34vw;
    line-height: 4.69vw;
  }
  footer {
    position: fixed;
    bottom: 0;
    width: 100vw;
    height: 6vh;
    z-index: 999;
    margin: 0px;
    padding: 0px;
  }
  .copyright {
    writing-mode: sideways-lr;
    position: fixed;
    bottom: 8vh;
    right: 0vw;
    font-family: "inria-sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 0.98vw;
    line-height: 3.91vw;
  }
  .scrolldown {
    display: none !important;
  }
}
@media screen and (min-width:768px) and (orientation: portrait) {
  /* 画面サイズが768pxから1024pxまで縦向き */
  br.br_sp, br.br_tab, br.br_pc {
    display: none !important;
  }
  br.br_tab {
    display: block !important;
    content: "" !important; /* Safariなどのブラウザ対策 */
  }
  .h2_titlearea {
    width: auto;
    height: auto;
    text-align: center;
    margin: 11.72vh auto 0;
    display: inline-block;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  h2 {
    font-size: 4.69vw;
    line-height: 7.03vw;
  }
  .h2_sub {
    font-size: 1.56vw;
    line-height: 1.56vw;
    font-weight: 700;
  }
  p {
    font-size: 2.08vw;
    line-height: 4.17vw;
  }
  .small {
    font-size: 1.56vw;
    line-height: 3.13vw;
  }
  .btn {
    color: #FFFFFF;
    background-color: #ED7A25;
    display: block;
    width: fit-content;
    border-radius: 0.65vw; /* 角を少し丸める */
    transition: all 0.5s ease; /* ホバー時のアニメーション */
  }
  .btn-large {
    font-size: 2.08vw;
    line-height: 3.39vw;
    padding: 1.3vw 2.6vw;
  }
  .btn-small {
    font-size: 1.3vw;
    line-height: 2.6vw;
    margin: 0.98vh 0;
    padding: 0.65vw 1.3vw;
  }
  header {
    position: fixed;
    top: 0;
    width: 100vw;
    height: 15.63vw;
    z-index: 999;
    margin: 0px;
    padding: 0px;
    display: block;
    overflow: hidden;
  }
  .mainlogo {
    width: 44.27vw;
    height: auto;
    position: fixed;
    left: 5.21vw;
    top: 5.21vw;
    z-index: 999;
  }
  .mainlogo a {
    color: unset;
    transition: unset;
    text-decoration: unset;
  }
  .mainlogo a:hover {
    text-decoration: unset;
    background-color: unset;
  }
  /* チェックボックスは隠す */
  #menu-btn-check {
    display: none;
  }
  /* ボタンの土台 */
  .menu-btn {
    position: fixed;
    top: 5.21vw;
    right: 5.21vw;
    display: flex;
    height: 5.86vw;
    width: 5.86vw;
    justify-content: center;
    align-items: center;
    z-index: 999;
    background-color: #ED7A25; /* サイトの色に合わせて調整 */
    cursor: pointer;
  }
  /* 二本線のハンバーガーボタンを作る */
  .menu-btn span, .menu-btn span::before, .menu-btn span::after {
    content: "";
    display: block;
    height: 0.39vw;
    width: 3.26vw;
    background-color: #ffffff;
    position: absolute;
    transition: all 0.5s ease; /* ふわっと動かす */
  }
  .menu-btn span {
    background-color: transparent; /* 中央の線を透明にする */
  }
  .menu-btn span::before {
    bottom: 1.04vw;
  } /* 上の線 */
  .menu-btn span::after {
    top: 1.04vw;
  } /* 下の線 */
  /* --- クリック（チェック）された時の動き --- */
  /* 真ん中の線を透明にする */
  #menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);
  }
  /* 上の線を45度回転させて「×」の片側にする */
  #menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
  }
  /* 下の線を-45度回転させて「×」の反対側にする */
  #menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
  }
  #navigation_list {
    background-color: rgb(255 255 255 / 0.9);
    border-top: 11.72vh solid #0D3246;
    border-left: 5.21vw solid #0D3246;
    border-right: 5.21vw solid #0D3246;
    border-bottom: 3.91vh solid #0D3246;
    width: 100vw;
    height: 100vh;
    margin: 0 auto;
    text-align: center;
    /* --- 中央配置の設定 --- */
    display: flex;
    flex-direction: column;
    justify-content: center; /* 上下中央 */
    align-items: center; /* 左右中央 */
    /* --- スクロール制御（重複を整理） --- */
    overflow-y: auto; /* 縦に長くなった時だけスクロール */
    overflow-x: hidden; /* 横スクロールは絶対にさせない */
    scrollbar-gutter: stable; /* スクロールバーが出てもガタつかない */
    /* --- 初期状態 --- */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0;
    visibility: hidden;
    transform: scale(0.95);
    transition: opacity 0.6s ease, transform 0.6s ease, visibility 0.6s;
    pointer-events: none;
  }
  /* --- チェック時の動き --- */
  #menu-btn-check:checked ~ #navigation_list {
    opacity: 1;
    visibility: visible;
    transform: scale(1); /* 元の大きさに戻して表示 */
    pointer-events: auto; /* クリックできるようにする */
  }
  #navigation_list .navigation_list_logo {
    width: 9.77vw;
    height: auto;
    margin: 1.95vh auto 3.91vh;
  }
  #navigation_list ul {
    list-style-type: none;
    width: 26.37vw;
    height: auto;
    margin: 0 auto;
  }
  #navigation_list ul li {
    list-style-type: none;
    margin: 0 0 2.93vh;
  }
  #navigation_list ul li:last-child {
    margin-bottom: 0;
  }
  #navigation_list ul li a {
    font-family: transat-text, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 4.69vw;
    line-height: 4.69vw;
    display: block; /* 横幅いっぱい */
  }
  #navigation_list .small {
    font-size: 1.17vw;
    line-height: 2.34vw;
  }
  /* --- section 共通設定 --- */
  .contents {
    background-color: transparent; /* background-color:透明にする */
    width: 89.58vw;
    margin: 0 auto;
    height: auto;
    display: flex;
    flex-direction: column;
    /* フェード用の transition */
    opacity: 1;
    visibility: visible;
    transition: opacity 0.5s ease, visibility 0.8s;
  }
  .contents section {
    width: 100%; /* 親の89.58vwに合わせる */
    margin: 0 auto;
    /* 1. heightをautoにし、overflowをvisibleに変更 */
    height: auto !important;
    min-height: 92.19vh;
    position: relative;
    border-top: 3.91vh solid #0D3246;
    border-bottom: 3.91vh solid #0D3246;
    /* レイアウトの基本：縦並び・中央寄せ */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* 上から順に積む */
  }
  /* 最初のセクションだけ上のマージンを戻す */
  .contents section:first-child {
    margin-top: 0;
  }
  .contents section::before {
    content: ""; /* 必須：これがないと表示されない */
    display: block;
    position: absolute; /* レイアウト用 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: blur(1px) brightness(0.8); /* 少し暗くして文字を浮かせる */
    z-index: -1;
    background-repeat: no-repeat; /* 背景画像を繰り返さない */
    background-size: cover; /* 背景を要素のサイズに合わせて引き伸ばす（隙間を埋める） */
    background-position: center; /* 画像の基準位置を中央にする */
  }
  /* --- 各セクション背景設定 --- */
  #mainvisual {
    display: flex;
    flex-direction: column;
    position: relative;
  }
  #mainvisual::before {
    background-image: url("../images/branding_tab.webp");
  }
  #mainvisual .mv_logo {
    position: relative;
    z-index: 1;
    width: 11.07vw;
    height: auto;
    margin-top: 16.6vh;
    margin-left: 5.21vw;
  }
  #mainvisual .mv_introduction {
    position: relative;
    z-index: 1;
    line-height: 6.25vw;
    margin-top: 1.95vh; /* ロゴからの距離 */
    margin-left: 5.21vw;
  }
  #mainvisual .mv_semi_introduction {
    position: relative;
    z-index: 1;
    font-size: 1.82vw;
    line-height: 3.65vw;
    width: 45.57vw;
    height: auto;
    margin-top: 18.55vh; /* 紹介文からの距離 */
    margin-left: 5.21vw;
    padding-bottom: 8.79vh;
  }
  #news {
    color: #0D3246;
    display: flex;
    flex-direction: column;
    position: relative !important; /* スマホ横の!importantに負けないように */
    margin-top: 0 !important;
  }
  #news::before {
    background-color: #DDDDDD;
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  #news .h2_sub, #news p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  #news .h2_titlearea {
    margin-top: 11.72vh !important; /* 数値はそのまま、優先度だけ上げる */
  }
  .contents #news .blogfeed {
    margin: 6.84vh auto 0;
    padding: 1.46vh 0;
    width: 67.71vw;
    height: auto;
  }
  .blogfeed .rssfeed li {
    list-style-type: none;
    border-bottom: 1px solid #ED7A25;
    margin: 0 0 8.79vh;
    padding: 0;
    /* アイコンを右端に固定するための基準点 */
    position: relative;
  }
  .rssfeed li a {
    color: #0D3246;
    display: block; /* 縦並び（日付とタイトル）を維持する */
    text-decoration: none;
    padding: 1.3vw 3vw 1.3vw 0; /* 右側にアイコン用の隙間(3vw)を空ける */
    transition: all 0.5s ease;
    white-space: normal; /* 改行を許可する（デフォルトを明示的に） */
    overflow-wrap: break-word; /* 長い単語でも枠線で折り返す */
    word-break: break-all; /* 日本語・英語混じりでも強制的に端で折る */
  }
  .rssfeed li a:hover {
    color: #ED7A25;
  }
  /* ★ liタグの右端にFontAwesomeを埋め込む */
  .blogfeed .rssfeed li::after {
    font-family: "Font Awesome 7 Free", "Font Awesome 6 Free";
    content: "\f105"; /* 矢印（angle-right） */
    font-weight: 900;
    color: #ED7A25;
    font-size: 2.6vw;
    /* 右端・上下中央に配置 */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    /* アイコンの上がクリックできなくなるのを防ぐ */
    pointer-events: none;
    transition: all 0.5s ease;
  }
  .rssfeed li .blog_postday {
    font-size: 1.56vw;
    line-height: 3.13vw;
  }
  .rssfeed li .blog_posttitle {
    font-size: 1.82vw;
    line-height: 3.65vw;
    display: -webkit-box; /* 必須：箱の形を特殊な形式に指定 */
    -webkit-box-orient: vertical; /* 必須：箱を縦方向に並べる指定 */
    -webkit-line-clamp: 1; /* ここで「1行」に制限！ */
    overflow: hidden; /* はみ出た部分を隠す */
  }
  .contents #news .btn {
    align-items: center;
    margin: 1.95vh auto 3.91vh;
  }
  .contents #menulist {}
  .contents #menulist::before {
    background-image: url("../images/menulist_back_tab.webp");
  }
  .contents #menulist .menu_price {
    margin: 1.95vh auto 0;
    width: 41.67vw;
    height: auto;
  }
  .contents #menulist .menu_price h3.menu_name {
    font-size: 2.08vw;
    line-height: 3.13vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    box-shadow: inset 0 -0.49vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 2.93vh 0 0.98vh; /* 全てのh3の上にマージン */
  }
  .contents #menulist .menu_price h3.menu_name:first-of-type {
    margin-top: 0;
  }
  .contents #menulist .menu_price .price_num {
    font-size: 2.86vw;
    line-height: 3.65vw;
  }
  .contents #menulist .price_notice {
    width: 48.18vw;
    height: auto;
    margin: 6.84vh auto 2.93vh;
    text-align: center;
  }
  .small.price_notice a {
    display: inline-block;
  }
  .small.price_notice .phone {
    color: #ED7A25;
    font-size: 2.08vw;
    line-height: 3.65vw;
  }
  .contents #aqualock {
    color: #0D3246;
  }
  .contents #aqualock::before {
    background-image: url("../images/store_wall_tab.webp");
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  .contents #aqualock .h2_sub, #aqualock p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  .contents #aqualock .aql_mv {
    margin: 2.93vh auto;
    width: 100%;
    height: auto;
  }
  .contents #aqualock .aql_intro {
    font-size: 2.08vw;
    line-height: 4.17vw;
    width: 65vw;
    height: auto;
    margin: 0 auto 2.93vh;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  .contents #aqualock .aql_price_container {
    display: flex;
    width: 100%;
    height: auto;
    justify-content: center; /* 左右中央に寄せる（お好みで） */
    align-items: center;
    margin: 0 auto 4.94vh;
    gap: 6.51vw; /* 画像とテキストの距離 */
  }
  .contents #aqualock .aql_price_container .aql_img {
    width: auto;
    height: auto;
    padding: 0;
    display: flex;
    flex-shrink: 0; /* 画像が潰れないように固定 */
  }
  .contents #aqualock .aql_price_container .aql_img img {
    width: 15.63vw;
    height: auto;
  }
  .contents #aqualock .aql_price_container .aql_price {
    /* 中身の幅に合わせる */
    flex-grow: 0;
    width: auto;
    padding: 0;
    display: block !important; /* スマホ横のGridをここで一旦解除 */
  }
  .aql_price_container .aql_price h3.aql_title {
    font-size: 2.08vw;
    line-height: 3.13vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    box-shadow: inset 0 -0.62vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.29vh 0;
  }
  .aql_price_container .aql_price .price_num {
    font-size: 2.86vw;
    line-height: 5.73vw;
    margin: 0 0 0.98vh 0;
  }
  .aql_price_container .aql_price .price_num:last-child {
    margin-bottom: 0;
  }
  .contents #access {}
  .contents #access::before {
    background-image: url("../images/access_back_tab.webp");
  }
  .contents #access .access_map {
    margin: 1.95vh auto;
    width: 53.39vw;
    height: auto;
  }
  /* --- 表全体のレイアウト --- */
  .contents #access .access_data_grid {
    display: grid;
    /* ここで列の幅を決定します（左残り全部 右 33.85vw） */
    grid-template-columns: 1fr 33.85vw;
    width: 41.67vw;
    height: auto;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  /* --- 各マスの設定 --- */
  .contents #access .table_item {
    padding: 1.3vw; /* ボタンがない分、上下余白を少し広めに */
    border-bottom: 1px solid #ccc; /* すべての段の下に線を引く */
    font-size: 1.82vw;
    line-height: 3.65vw;
    display: flex;
    flex-direction: column; /* 縦並びを確定させる */
    align-items: flex-start; /* 左寄せにする */
  }
  .contents #access .table_item:nth-last-child(-n+2) {
    border-bottom: none; /* 一番下の段の線を消す */
  }
  /* --- 左列（アイコン・見出し） --- */
  .contents #access .table_item.head {
    display: flex; /* flexboxを有効にする */
    align-items: center; /* 縦方向の中央揃え */
    justify-content: center; /* 横方向の中央揃え */
    font-weight: bold;
    white-space: nowrap;
  }
  /* --- 右列（内容） --- */
  .contents #access .table_item p {
    margin: 0;
    font-size: 1.82vw;
    line-height: 3.65vw;
  }
  .contents #access .traffic_data {
    width: max-content;
    height: auto;
    margin: 1.95vh auto;
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    column-gap: 1.85vw; /* --- 隙間を確保 --- */
    row-gap: 1.85vh;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  .contents #access .traffic_data h3 {
    font-size: 1.82vw;
    line-height: 3.65vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    justify-self: end; /* Gridセルの中で右端に寄せる */
    text-align: right; /* 複数行になった場合も右揃えにする */
    box-shadow: inset 0 -0.29vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.29vh 0;
  }
  #guide {
    background-color: #0D3246;
    width: 89.58vw;
    height: auto;
    margin: 0 auto 3.91vh;
    display: block;
    text-align: center; /* 中にある inline-block 要素（リストの塊）を中央に寄せる */
  }
  #guide .guide_list {
    width: 30vw;
    height: auto;
    margin: 0 auto 1.95vh;
    display: inline-block; /* 塊として中央に寄るように設定 */
    text-align: left; /* 中の文字（li）は左寄せにする */
  }
  #guide .guide_list li {
    list-style-type: none;
    font-size: 1.82vw;
    line-height: 3.65vw;
  }
  #guide a {
    display: inline-block;
  }
  #guide .phone {
    color: #ED7A25;
    font-size: 3.13vw;
    line-height: 6.25vw;
  }
  footer {
    position: fixed;
    bottom: 0;
    width: 100vw;
    height: 8vw;
    z-index: 999;
    margin: 0px;
    padding: 0px;
  }
  .copyright {
    writing-mode: sideways-lr;
    position: fixed;
    bottom: 3.91vh;
    right: 0vw;
    font-family: "inria-sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3vw;
    line-height: 5.21vw;
  }
  .scrolldown {
    display: none !important;
  }
}
@media screen and (max-width:767px) and (orientation: portrait) {
  /*　画面サイズが768pxまで縦向き　*/
  br.br_sp, br.br_tab, br.br_pc {
    display: none !important;
  }
  br.br_sp {
    display: block !important;
    content: "" !important; /* Safariなどのブラウザ対策 */
  }
  .h2_titlearea {
    width: auto;
    height: auto;
    text-align: center;
    margin: 8.64vh auto 0;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  h2 {
    font-size: 12.8vw;
    line-height: 19.2vw;
  }
  .h2_sub {
    font-size: 3.2vw;
    line-height: 6.4vw;
    font-weight: 700;
  }
  p {
    font-size: 4.27vw;
    line-height: 8.54vw;
  }
  .small {
    font-size: 3.2vw;
    line-height: 6.4vw;
  }
  .btn {
    color: #FFFFFF;
    background-color: #ED7A25;
    display: block;
    width: fit-content;
    border-radius: 1.33vw; /* 角を少し丸める */
    transition: all 0.5s ease; /* ホバー時のアニメーション */
  }
  .btn-large {
    font-size: 4.27vw;
    line-height: 6.93vw;
    padding: 2.67vw 5.33vw;
  }
  .btn-small {
    font-size: 2.67vw;
    line-height: 5.34vw;
    margin: 1.23vh 0;
    padding: 1.33vw 2.66vw;
  }
  header {
    position: fixed;
    top: 0;
    width: 100vw;
    height: 18vw;
    z-index: 999;
    margin: 0px;
    padding: 0px;
    display: block;
    overflow: hidden;
  }
  .mainlogo {
    width: 68.53vw;
    height: auto;
    position: fixed;
    left: 4.8vw;
    top: 5.33vw;
    z-index: 999;
  }
  .mainlogo a {
    color: unset;
    transition: unset;
    text-decoration: unset;
  }
  .mainlogo a:hover {
    text-decoration: unset;
    background-color: unset;
  }
  /* チェックボックスは隠す */
  #menu-btn-check {
    display: none;
  }
  /* ボタンの土台 */
  .menu-btn {
    position: fixed;
    top: 2.47vh;
    right: 4.8vw;
    display: flex;
    height: 12vw;
    width: 12vw;
    justify-content: center;
    align-items: center;
    z-index: 999;
    background-color: #ED7A25; /* サイトの色に合わせて調整 */
    cursor: pointer;
  }
  /* 二本線のハンバーガーボタンを作る */
  .menu-btn span, .menu-btn span::before, .menu-btn span::after {
    content: "";
    display: block;
    height: 0.8vw;
    width: 6.67vw;
    background-color: #ffffff;
    position: absolute;
    transition: all 0.5s ease; /* ふわっと動かす */
  }
  .menu-btn span {
    background-color: transparent; /* 中央の線を透明にする */
  }
  .menu-btn span::before {
    bottom: 2.13vw;
  } /* 上の線 */
  .menu-btn span::after {
    top: 2.13vw;
  } /* 下の線 */
  /* --- クリック（チェック）された時の動き --- */
  /* 真ん中の線を透明にする */
  #menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);
  }
  /* 上の線を45度回転させて「×」の片側にする */
  #menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
  }
  /* 下の線を-45度回転させて「×」の反対側にする */
  #menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
  }
  #navigation_list {
    background-color: rgb(255 255 255 / 0.9);
    border-top: 9.88vh solid #0D3246;
    border-left: 5.33vw solid #0D3246;
    border-right: 5.33vw solid #0D3246;
    border-bottom: 2.47vh solid #0D3246;
    width: 100vw;
    height: 100vh;
    margin: 0 auto;
    text-align: center;
    /* --- 中央配置の設定 --- */
    display: flex;
    flex-direction: column;
    justify-content: center; /* 上下中央 */
    align-items: center; /* 左右中央 */
    /* --- スクロール制御（重複を整理） --- */
    overflow-y: auto; /* 縦に長くなった時だけスクロール */
    overflow-x: hidden; /* 横スクロールは絶対にさせない */
    scrollbar-gutter: stable; /* スクロールバーが出てもガタつかない */
    /* --- 初期状態 --- */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0;
    visibility: hidden;
    transform: scale(0.95);
    transition: opacity 0.6s ease, transform 0.6s ease, visibility 0.6s;
    pointer-events: none;
  }
  /* --- チェック時の動き --- */
  #menu-btn-check:checked ~ #navigation_list {
    opacity: 1;
    visibility: visible;
    transform: scale(1); /* 元の大きさに戻して表示 */
    pointer-events: auto; /* クリックできるようにする */
  }
  #navigation_list .navigation_list_logo {
    width: 18.67vw;
    height: auto;
    margin: 2.47vh auto;
  }
  #navigation_list ul {
    list-style-type: none;
    width: 72vw;
    height: auto;
    margin: 0 auto;
  }
  #navigation_list ul li {
    list-style-type: none;
    margin: 0 0 2.47vh;
  }
  #navigation_list ul li:last-child {
    margin-bottom: 0;
  }
  #navigation_list ul li a {
    font-family: transat-text, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 9.6vw;
    line-height: 9.6vw;
    display: block; /* これで横幅いっぱいにする */
  }
  #navigation_list .small {
    font-size: 3.2vw;
    line-height: 6.4vw;
  }
  /* --- section 共通設定 --- */
  .contents {
    background-color: transparent; /* background-color:透明にする */
    width: 90.13vw !important; /* スマホ横の 92.19vw を上書き */
    margin: 0 auto !important;
    height: auto;
    display: flex;
    flex-direction: column;
    /* フェード用の transition */
    opacity: 1;
    visibility: visible;
    transition: opacity 0.5s ease, visibility 0.8s;
  }
  .contents section {
    width: 100% !important; /* 親の90.13vwに合わせる */
    margin: 0 auto !important;
    /* 1. heightをautoにし、overflowをvisibleに変更 */
    height: auto !important;
    min-height: 95.06vh;
    position: relative;
    border-top: 2.47vh solid #0D3246;
    border-bottom: 2.47vh solid #0D3246;
    /* レイアウトの基本：縦並び・中央寄せ */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* 上から順に積む */
  }
  /* 最初のセクションだけ上のマージンを戻す */
  .contents section:first-child {
    margin-top: 0;
  }
  .contents section::before {
    content: ""; /* 必須：これがないと表示されない */
    display: block;
    position: absolute; /* レイアウト用 */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: blur(1px) brightness(0.8); /* 少し暗くして文字を浮かせる */
    z-index: -1;
    background-repeat: no-repeat; /* 背景画像を繰り返さない */
    background-size: cover; /* 背景を要素のサイズに合わせて引き伸ばす（隙間を埋める） */
    background-position: center; /* 画像の基準位置を中央にする（スマホの縦長画面でも綺麗に切り抜かれます） */
  }
  /* --- 各セクション背景設定 --- */
  #mainvisual {
    display: flex;
    flex-direction: column;
    position: relative;
  }
  #mainvisual::before {
    background-image: url("../images/branding_sp.webp");
  }
  #mainvisual .mv_logo {
    position: relative;
    z-index: 1;
    width: 22.67vw;
    height: auto;
    margin-top: 17.28vh;
    margin-left: 12vw;
  }
  #mainvisual .mv_introduction {
    position: relative;
    z-index: 1;
    line-height: 9.6vw;
    margin-top: 2.96vh; /* ロゴからの距離 */
    margin-left: 12vw;
  }
  #mainvisual .mv_semi_introduction {
    position: relative;
    z-index: 1;
    font-size: 3.2vw;
    line-height: 6.4vw;
    width: 65.33vw;
    height: auto;
    margin-top: 9.88vh; /* 紹介文からの距離 */
    margin-left: 12vw;
    padding-bottom: 10vh;
  }
  #news {
    color: #0D3246;
    display: flex;
    flex-direction: column;
    position: relative !important;
    width: 100% !important;
    margin: 0 auto !important;
    border-top: 2.47vh solid #0D3246 !important;
    border-bottom: 2.47vh solid #0D3246 !important;
  }
  #news::before {
    background-color: #DDDDDD;
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  #news .h2_titlearea {
    margin-top: 8.64vh !important; /* スマホ横用CSSの 24vh をブロック */
  }
  #news .h2_sub, #news p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  .contents #news .blogfeed {
    margin: 3.09vh auto 0 !important;
    padding: 1.23vh 0;
    width: 84vw !important; /* スマホ横用CSSの 50.78vw をブロック */
    height: auto;
  }
  .blogfeed .rssfeed li {
    list-style-type: none;
    border-bottom: 1px solid #ED7A25;
    margin: 0 0 3.09vh;
    padding: 0;
    /* アイコンを右端に固定するための基準点にする */
    position: relative;
  }
  .rssfeed li a {
    color: #0D3246;
    display: block; /* 縦並び（日付とタイトル）を維持する */
    text-decoration: none;
    padding: 1.33vw 8vw 1.33vw 0; /* 右側にアイコン用の隙間(8vw)を空ける */
    transition: all 0.5s ease;
    white-space: normal; /* 改行を許可する（デフォルトを明示的に） */
    overflow-wrap: break-word; /* 長い単語でも枠線で折り返す */
    word-break: break-all; /* 日本語・英語混じりでも強制的に端で折る */
  }
  .rssfeed li a:hover {
    color: #ED7A25;
  }
  /* ★ liタグの右端にFontAwesomeを埋め込む */
  .blogfeed .rssfeed li::after {
    font-family: "Font Awesome 7 Free", "Font Awesome 6 Free";
    content: "\f105"; /* 矢印（angle-right） */
    font-weight: 900;
    color: #ED7A25;
    font-size: 5vw;
    /* 右端・上下中央に配置 */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    /* アイコンの上がクリックできなくなるのを防ぐ */
    pointer-events: none;
    transition: all 0.5s ease;
  }
  .rssfeed li .blog_postday {
    font-size: 3.2vw;
    line-height: 6.4vw;
  }
  .rssfeed li .blog_posttitle {
    font-size: 3.73vw;
    line-height: 7.47vw;
    display: -webkit-box; /* 必須：箱の形を特殊な形式に指定 */
    -webkit-box-orient: vertical; /* 必須：箱を縦方向に並べる指定 */
    -webkit-line-clamp: 1; /* ここで「1行」に制限！ */
    overflow: hidden; /* はみ出た部分を隠す */
  }
  .contents #news .btn {
    align-items: center;
    margin: 4.94vh auto;
  }
  .contents #menulist {}
  .contents #menulist::before {
    background-image: url("../images/menulist_back_sp.webp");
  }
  .contents #menulist .menu_price {
    margin: 2.47vh auto 0;
    width: 72vw;
    height: auto;
  }
  .contents #menulist .menu_price h3.menu_name {
    font-size: 4.27vw;
    line-height: 6.4vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)5pxの太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    box-shadow: inset 0 -0.62vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 1.98vh 0 1.23vh;
  }
  .contents #menulist .menu_price h3.menu_name:first-of-type {
    margin-top: 0;
  }
  .contents #menulist .menu_price .price_num {
    font-size: 4.8vw;
    line-height: 6.4vw;
  }
  .contents #menulist .price_notice {
    width: 84.8vw;
    height: auto;
    margin: 3.7vh auto 2.47vh;
  }
  .small.price_notice a {
    display: inline-block;
  }
  .small.price_notice .phone {
    color: #ED7A25;
    font-size: 4.27vw;
    line-height: 7.47vw;
  }
  .contents #aqualock {
    color: #0D3246;
  }
  .contents #aqualock::before {
    background-image: url("../images/store_wall_sp.webp");
    filter: blur(0px) brightness(1.0); /* ブラー解除 */
  }
  .contents #aqualock .aql_price_container .aql_price, .contents #access .traffic_data {
    display: block !important; /* Gridを解除して縦並びを維持 */
  }
  .contents #aqualock .h2_sub, #aqualock p {
    color: inherit; /* 「親（#aqualock）の色を受け継ぐ」 */
  }
  .contents #aqualock .aql_mv {
    margin: 2.47vh auto;
    width: 100%;
    height: auto;
  }
  .contents #aqualock .aql_intro {
    font-size: 3.73vw;
    line-height: 7.47vw;
    width: 80vw;
    height: auto;
    margin: 0 auto 4.94vh;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px); /* Safari対策 */
  }
  .contents #aqualock .aql_price_container {
    display: flex;
    width: 100%;
    height: auto;
    justify-content: center; /* 左右中央に寄せる */
    margin: 0 auto 4.94vh;
  }
  .contents #aqualock .aql_price_container .aql_img {
    width: 40vw;
    height: auto;
    padding: 0 2.67vw;
    display: flex;
    /* 上下左右中央に寄せる */
    align-items: center; /* 垂直方向中央 */
    justify-content: center; /* 水平方向中央 */
    flex-shrink: 0; /* 画像が潰れないように固定 */
  }
  .contents #aqualock .aql_price_container .aql_img img {
    width: 29.33vw;
    height: auto;
  }
  .contents #aqualock .aql_price_container .aql_price {
    /* 残りの幅をすべて占有させる */
    flex-grow: 1;
    /* 幅が広がりすぎないよう、幅の計算を明示 */
    width: 0;
    padding: 0 2.67vw;
  }
  .aql_price_container .aql_price h3.aql_title {
    font-size: 4.27vw;
    line-height: 6.4vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    box-shadow: inset 0 -0.62vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.62vh 0;
  }
  .aql_price_container .aql_price .price_num {
    font-size: 4.27vw;
    line-height: 6.4vw;
    margin: 0 0 1.48vh;
  }
  .aql_price_container .aql_price .price_num:last-of-type {
    margin-bottom: 0;
  }
  .contents #access {}
  .contents #access::before {
    background-image: url("../images/access_back_sp.webp");
  }
  .contents #access .access_map {
    margin: 1.23vh auto;
    width: 85.33vw;
    height: auto;
  }
  /* --- 表全体のレイアウト --- */
  .contents #access .access_data_grid {
    display: grid;
    /* 列の幅（左残り全部 右64vw） */
    grid-template-columns: 1fr 64vw;
    width: 84.8vw;
    height: auto;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  /* --- 各マスの設定 --- */
  .contents #access .table_item {
    padding: 1.23vw; /* ボタンがない分、上下余白を少し広めに */
    border-bottom: 1px solid #ccc; /* すべての段の下に線を引く */
    font-size: 3.73vw;
    line-height: 3.73vw;
    display: flex;
    flex-direction: column; /* 縦並びを確定させる */
    align-items: flex-start; /* 左寄せにする */
  }
  .contents #access .table_item:nth-last-child(-n+2) {
    border-bottom: none; /* 一番下の段の線を消す */
  }
  /* --- 左列（アイコン・見出し） --- */
  .contents #access .table_item.head {
    display: flex; /* flexboxを有効にする */
    align-items: center; /* 縦方向の中央揃え */
    justify-content: center; /* 横方向の中央揃え */
    font-weight: bold;
    white-space: nowrap;
  }
  /* --- 右列（内容） --- */
  .contents #access .table_item p {
    margin: 0;
    font-size: 3.73vw;
    line-height: 6.4vw;
  }
  .contents #access .traffic_data {
    width: max-content;
    height: auto;
    margin: 2.47vh auto;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px); /* Safari対策 */
  }
  .contents #access .traffic_data h3 {
    font-size: 3.73vw;
    line-height: 6.4vw;
    /* 透明から始まり、60%の位置からオレンジ(半分透明)の線の太さ */
    display: inline-block; /* 幅を文字ぴったりにする */
    box-shadow: inset 0 -0.37vh 0 0 #ED7A25;
    font-weight: 700; /* 太字 */
    margin: 0 0 0.62vh 0;
  }
  .contents #access .traffic_data p {
    margin: 0 0 1.23vh 0;
  }
  .contents #access .traffic_data p:last-child {
    margin-bottom: 0;
  }
  #guide {
    background-color: #0D3246;
    width: 90.13vw;
    height: auto;
    margin: 0 auto 2.47vh;
    display: block;
    text-align: center; /* 中にある inline-block 要素（リストの塊）を中央に寄せる */
  }
  #guide .guide_list {
    width: auto;
    height: auto;
    margin: 0 auto 3.7vh;
    display: inline-block; /* 塊として中央に寄るように設定 */
    text-align: left; /* 中の文字（li）は左寄せにする */
  }
  #guide .guide_list li {
    list-style-type: none;
    font-size: 3.73vw;
    line-height: 7.47vw;
  }
  #guide a {
    display: inline-block;
  }
  #guide .phone {
    color: #ED7A25;
    font-size: 6.4vw;
    line-height: 12.8vw;
  }
  footer {
    position: fixed;
    bottom: 0;
    width: 100vw;
    height: 8vw;
    z-index: 999;
    margin: 0px;
    padding: 0px;
  }
  .copyright {
    writing-mode: sideways-lr;
    position: fixed;
    bottom: 4.94vh;
    right: 0vw;
    font-family: "inria-sans", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 2.67vw;
    line-height: 5.33vw;
  }
  .scrolldown {
    display: none !important;
  }
}