body {
  background-image:url("/gazou2026/20260119_washi_haikei_endlessv4.png");
  background-repeat:repeat;
  margin:0;
  margin-top: 210px;

  font-size: 1.25rem;
  line-height: 1.6;

  overflow-x: hidden;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

#MenuButtonTable {
  text-align: center; /* 中身のインライン要素も中央に */
}

#MenuButtonTable table {
  margin-left: auto;
  margin-right: auto; /* テーブル自体を中央に */
}

#MenuButtonTable td {
  text-align: center; /* 各セルの中身も中央に */
}

#fixedHeader{
  position:fixed;
  top:0px;
  left:0;
  width:100%;
  height:210px;
  background-image:url("/gazou2026/20260119_washi_haikei_endlessv4.png");
  z-index:10000;
  border-bottom:3px solid transparent;
  text-align: center;

  /* 最初は影なし */
  box-shadow:none;

  /* ★ふわっと変化 */
  transition: box-shadow 0.3s ease;
}

/* ★スクロール時に付くクラス */
#fixedHeader.scrolled{
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

#toplogo {
  max-width: 90%;
  height: auto;
}

#overlayMenu{
  position:fixed;
  top:210px;
  width:100%;
  height:calc(100% - 210px);
  background:white;
  display:none;
  /* ★これを追加 */
  overflow-y:auto;
}

#closeBtn{
  visibility: hidden;   /* ★ 非表示でも場所を確保 */
  color:#ffffff;
  font-size:25px;
  font-weight: bold;
  padding:8px 14px;
  border-radius:10px;
  cursor:pointer;
  z-index:99999;
  white-space:nowrap;
}

/* 翻訳メニュー用 */
/* 初期から表示 */
#google_translate_element {
  z-index: 10001;
  background: none;
  padding: 5px 8px;
  border-radius: 6px;
  opacity: 1;
  pointer-events: auto;
}

#google_translate_element select {
  background: #5f2d59;
  border: none;
  padding: 4px 8px;
  font-size: 14px;
  border-radius: 4px;
}

/* メニューボタンの押下エフェクト */
#fixedHeader img {
  cursor: pointer;
  transition: transform 0.1s ease, opacity 0.1s ease;
}

#fixedHeader img.active {
  transform: scale(0.95); /* 少し縮む */
  opacity: 0.8;           /* 少し透明にして押下感 */
}

.menuList {
  list-style: none;
  padding: 0;
}

/* ============================
   テキスト版メニュー　リンクのスタイル
   ============================ */
.menu-link {
  display: inline-block;
  padding: 10px;
  text-align: center;

  /* スマートフォンで押しやすいサイズ */
  min-height: 44px;
  font-size: 1.25rem !important;
  line-height: 1.4 !important;
}

/* ============================
   テキスト版メニュー　Google翻訳対策
   ============================ */

#google_translate_element,
.goog-te-gadget,
.goog-te-gadget span,
.goog-te-gadget-simple,
.goog-te-menu-value span,
.goog-te-menu-value span *,
.goog-te-banner-frame,
.goog-te-menu-frame,
.goog-te-menu2,
.goog-te-menu2 * {
  font-size: 1.25rem !important;
  line-height: 1.6 !important;
}

body * {
  font-size: 1.25rem !important;
  line-height: 1.6 !important;
}

@media (min-width: 600px) {
  #menuBtn {
    height: 60px;
    width: auto;
  }
}

/* =========================
   テキスト版メニュー　メニュータイトル帯
   ========================= */
.menutitle {
  background-color: #5f2d59;
  color: #fff;
  font-weight: bold;
  font-size: 1.25rem !important;
  padding: 2px;
  margin-bottom: 10px;
  text-align: center;
}

/* =========================
   20260325追加ここから
   ========================= */

.menuRow {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.menuItem {
  display: flex;
  align-items: center;
  justify-content: center;
}

.menuItem.left,
.menuItem.right {
  min-width: 120px;
}

.menuItem.center {
  flex: 0 0 auto;
}

#menuBtn.menuButton {
  display: flex;
  height: 40px;
  align-items: center;
  gap: 8px;
  cursor: pointer;

  /* ★追加：ボタン化 */
  background: #5f2d59;
  color: #fff;
  border-radius: 14px;

  /* ★ここが重要：左に広げる */
  padding: 8px 16px 8px 18px;

  /* ★立体感 */
  box-shadow: 0 4px 10px rgba(0,0,0,0.25);

  /* ★押した感 */
  transition: transform 0.1s ease, box-shadow 0.1s ease;
}

#menuBtn.menuButton:active {
  transform: translateY(2px);
  box-shadow: 0 2px 5px rgba(0,0,0,0.25);
}

#menuBtn .menuText {
  font-size: 18px;
  font-weight: bold;
  color: #ffffff;
  white-space: nowrap;
}

#closeBtn {
  visibility: hidden;
}

body.menu-open #closeBtn {
  visibility: visible;
}

/* =========================
   20260325追加ここまで
   ========================= */


/* =========================
   ▼ ハンバーガーボタン（修正版）
   ========================= */
#menuBtn .hamburger {
  width: 30px;
  height: 20px;
  position: relative;
  display: inline-block;
}

/* ★中央基準に統一 */
#menuBtn .hamburger::before,
#menuBtn .hamburger::after,
#menuBtn .hamburger span {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  background: #ffffff;
  border-radius: 2px;
  transition: 0.3s;

  top: 50%;
  transform: translateY(-50%);
}

/* 上 */
#menuBtn .hamburger::before {
  transform: translateY(-9px);
}

/* 中央 */
#menuBtn .hamburger span {
  transform: translateY(-50%);
}

/* 下 */
#menuBtn .hamburger::after {
  transform: translateY(6px);
}

/* 三本線 → × */
body.menu-open #menuBtn .hamburger::before {
  transform: translateY(-50%) rotate(45deg);
}

body.menu-open #menuBtn .hamburger::after {
  transform: translateY(-50%) rotate(-45deg);
}

body.menu-open #menuBtn .hamburger span {
  opacity: 0;
}

/* 元テキストは消す → やめる */
#menuBtn .menuText {
  font-size: 18px;
}

#menuBtn .menuText {
  display: inline-block;
  vertical-align: middle;
}

#menuBtn .hamburger {
  display: inline-block;
  vertical-align: middle;
}

/* =========================
   要素はみだし防止
   ========================= */
*,
*::before,
*::after {
  box-sizing: border-box;
}

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

table {
  max-width: 100%;
}

/* =========================
   ▼ language ボタン用 CSS
   ========================= */

/* PC・スマホ共通 */
.langBtn {
  display: inline-flex;
  height: 32px;
  align-items: center;
  gap: 2px;
  cursor: pointer;
  padding: 2px 4px;

  /* ★ボタン化（色だけ変更） */
  background: rgba(255, 255, 255, 0.9);      /* ← 白色の半透明 */
  color: #061e88;              /* 文字色は青系に */

  border-radius: 14px;      /* menuButton と同じ */
  border: none;

  /* ★立体感（同じ影） */
  box-shadow: 0 1px 7px rgba(0,0,0,0.25);

  /* ★押した感 */
  transition: transform 0.1s ease, box-shadow 0.1s ease;
}

/* 押したときの効果 */
.langBtn:active {
  transform: translateY(2px);
  box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}


/* 絵文字を画像に置き換え */

.langIcon {
  width: 20px;
  height: 20px;
}

/* =========================
   ▼ ヘッダーだけスマホで縮小別途global_cssも同時に編集する
   ========================= */

@media (max-width: 600px) {

  .menuRow {
    display: flex;
    justify-content: end;
    margin-right: 30px;
    align-items: center;
    gap: 10px;
  }

  .menuItem.left,
  .menuItem.right {
    min-width: auto;
  }

  #menuBtn {
    height: 40px;
    width: auto;
    display: flex;
    align-items: center;
  }

  #closeBtn {
    font-size: 16px;
    padding: 4px 8px;
  }

  #toplogo {
    max-width: 80%;
    height: auto;
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body {
    margin-top: 106px;
  }

  #fixedHeader{
    height:106px;
  }

  #overlayMenu{
    top:106px;
    height:calc(100% - 106px);
    background:white;
    display:none;
    overflow-y:auto;
  }

  #menuBtn.menuButton {
    gap: 6px;
    /* ★ここが重要：左に広げる */
    padding: 6px 15px 6px 17px;
   }

  #menuBtn .hamburger {
    width: 24px;
    height: 16px;
  }

  #menuBtn .menuText::after {
    font-size: 14px;
  }

  .langBtn {
    padding: 2px 9px;
  }

}