body {
  margin: 0;
  font-family: 'tot-shizukardmin-stdn', 'Yu Gothic', sans-serif;
  font-weight: 300;
  background: #fff;
  color: #222;
}

.kaijyoji-image {
  width: 100%;
}


H2 {
	font-size: 1.0em;
}

lotus-logo {
  width: 54px;
  height: auto;  /* または必要ならheight: 60px; */
  display: inline-block;
  transform: translateX(2px); /* 2px右へ */
  vertical-align: middle; /* 必要なら */
}


.main-header {
  width: 100%;
  background: #fff;
  /* border-bottom: 1px solid #e6e0c7; */
}

.header-inner {
  margin: 0 auto;
  margin-left: 14px;
  margin-top: 20px;
  padding: 0.7em 2vw 0.7em 2vw;
}

.header-title-row {
  display: flex;
  align-items: center;
  gap: 1.1em;
  margin-bottom: 0.4em;
  flex-wrap: wrap;
  position: relative;
}

.temple-title {
  display: flex;
  align-items: baseline;
  gap: 0.4em;
  font-family: 'ah-hakushu-rs', 'Yu Mincho', '游明朝', 'Noto Serif JP', serif;
  font-size: clamp(1.5rem, 2.8vw, 2.3rem);
  font-weight: 700;
  letter-spacing: 0.11em;
  color: #222;
  margin: 0;
  line-height: 1.18;
}
.temple-main {
  font-size: 1.18em;
  color: #222;
  margin: 0 0.4em;
}
.temple-sub {
  font-size: 0.63em;
  color: #222;
  letter-spacing: 0.19em;
}

.header-logo img {
  height: 2.3em;
  width: auto;
  display: block;
  margin-left: 0.3em;
  margin-top: 00px;
}
.temple-title-underline {
  width: 90vw;
  height: 0.7px;
  margin: 0.25em auto 0 auto;
  background: #e6e0c7;
  border-radius: 0.7px;
  margin-top: 14px;
}

.kv {
  height: 85vh;       /* 画面の高さに合わせる */
  min-height: 340px;   /* お好みで調整 */
  max-height: 85vh;
  display: flex;
  align-items: stretch;
  position: relative;
  width: 100vw;
  max-width: 100vw;
  margin: 0;
  margin-bottom: 60px;
  overflow: hidden;
  border-radius: 0;
  box-shadow: none;
}

.kv_container{
	display: flex;
	width: 100vw;
	flex-wrap: nowrap;
}

.kv2 {
  height: 50vh;       /* 画面の高さに合わせる */
  min-height: 340px;   /* お好みで調整 */
  max-height: 50vh;
  display: flex;
  align-items: stretch;
  position: relative;
  width: 50vw;
  max-width: 50vw;
  min-width: 420px;
  margin: 0;
  margin-left: 60px;
  overflow: hidden;
  border-radius: 0;
  box-shadow: none;
}
  

/* キービジュアル */
.kv img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


.kv-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0; top: 0;
  pointer-events: none;
  /* background: linear-gradient(to top, rgba(0,0,0,0.45) 70%, rgba(0,0,0,0));
  padding: 2em 2vw 1.2em 2vw;
  color: #fff; */
}


/* サブキャッチを画像の中央やや下・横幅60%・中央寄せに配置 */
.kv-sub {
  position: absolute;
  left: 48%;
  top: 50%;  /* 画面中央よりやや下（60%〜70%ぐらいは好みで調整OK） */
  transform: translate(-50%, -50%);
  width: 70vw;    /* 横幅：画面の70% */
  max-width: 680px;  /* 文字が長すぎるときの上限（好みで調整） */
  min-width: 240px;  /* スマホでも窮屈になりすぎないように（任意） */
  color: #fff;
  font-size: 1.35em;
  letter-spacing: 0.07em;
  font-weight: 500;
  text-align: center;
  text-shadow: 0 2px 8px rgba(0,0,0,0.28);
  pointer-events: auto;
  background: rgba(0,0,0,0.25); /* ←0.35～0.55くらいが見やすい */
  box-shadow: 0 6px 18px rgba(0,0,0,0.14); /* ほんのり下に影もOK */
  padding: 0.3em 0.3em;
}






/* セクションデザイン */
.section {
  max-width: 1100px;
  margin: 3em auto 0 auto;
  background: #fffbe6;
  border-radius: 18px;
  padding: 2.6em 2em 2.4em 2em;
  box-shadow: 0 1px 8px rgba(200,180,100,0.10);
}

.section h2 {
  font-size: 1.5em;
  color: #b48700;
  margin-bottom: 0.8em;
  border-left: 8px solid #e6e0c7;
  padding-left: 0.6em;
  letter-spacing: 0.04em;
}

.section ul, .section p {
  font-size: 1.08em;
  margin-bottom: 1.2em;
}




/* ===== メニュー ===== */
/* PC用：メニュー横並び＆装飾 */


.navispace{
	display: flex;
	width: 100%;
	padding-top: 0px;
	height: 60px;
}

.main-nav ul {
  display: flex;
  flex-wrap: wrap; 
  gap: 2em;
  justify-content: flex-start; /* 右寄せならここをright, 左ならflex-start */
  list-style: none;
  margin: 0;
  margin-top: -50px; /*ハンバーガーメニュー高さ調整*/
  padding:0 30px 0 30px;
  background: none;
  border: none;
  box-shadow: none;
}

.main-nav li {
  display: flex;
  align-items: center;
}


.main-nav a {
  display: block;
  padding: 0.6em 1.3em;
  color: #222;
  text-decoration: none;
  font-family: tot-shizukardmin-stdn, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 13px;
  /* border-radius: 100vw; */
  position: relative;
  transition: background 0.22s, color 0.22s;
}
.main-nav a:hover {
  background:#E6E594;
  color: #222;
  box-shadow: 0 1px 5px rgba(180,135,0,0.07);
}

.main-nav {
  width: 90%;
  margin: 0 auto;
  position: relative;
  z-index: 100;
  min-height: 48px;  /* ハンバーガー分の高さ確保 */
}

/* ハンバーガーボタン（三本線）をPCでは非表示、スマホでは画面右上に固定 */
.nav-toggle {
  display: none;
}

/* ===========================
   下層ページ共通ナビ修正
   =========================== */
body.common .navispace {
  background: #fff;
  height: 60px;
  position: relative;
  z-index: 500;
}

body.common .main-nav ul {
  margin-top: 0 !important;  /* index用の-50pxを上書き */
}

@media (max-width: 700px) {
  .header-inner {
    padding: 0.5em 1vw 0.5em 1vw;
  }
  .header-title-row {
    align-items: flex-start;
    gap: 0.2em;
    margin-bottom: 0.4em;
  }
  .temple-title {
    font-size: clamp(1.4rem, 5vw, 2.1rem);
    gap: 0.2em;
  }
  .main-nav {
    width: 100%;
    min-height: 44px;
  }
	
 

	
  .nav-toggle {
    display: flex;
    position: fixed;
    top: 14px;      /* 画面の最上部からの距離。お好みで調整 */
    right: 14px;    /* 画面右端からの距離。お好みで調整 */
    background: #fff;
    border: 0px solid #222;
    border-radius: 9px;
    width: 38px;
    height: 38px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 400;
    box-shadow: 0 1px 6px rgba(0,0,0,0.06);
    transition: background 0.2s;
  }
  .nav-toggle span {
    display: block;
    width: 26px;
    height: 3px;
    margin: 2.5px 0;
    background: #222;
    border-radius: 2px;
    transition: all 0.3s;
  }
  /* 三本線→バツ印アニメーション */
  .nav-toggle.open span:nth-child(1) {
    transform: translateY(7.7px) rotate(45deg);
  }
  .nav-toggle.open span:nth-child(2) {
    opacity: 0;
  }
  .nav-toggle.open span:nth-child(3) {
    transform: translateY(-7.7px) rotate(-45deg);
  }

  .main-nav ul {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s;
    display: flex; /* 常にflex。出し入れはopacityとpointer-events */
    flex-direction: column;
    position: fixed;
    top: 50px; left: 0; right: 0;
    width: 100vw;
    background: #fff;
    border-top: 1px solid #e6e0c7;
    text-align: left;
    gap: 0;
    box-shadow: 0 2px 14px rgba(0,0,0,0.10);
    z-index: 300;
    padding-bottom: 0.7em;
  }
  .main-nav ul.open {
     opacity: 1;
    pointer-events: auto;
  }
  .main-nav li {
    display: block;
    border-bottom: 1px solid #f0ecd6;
  }
  .main-nav a {
    display: block;
    padding: 1.1em 1.4em;
    font-size: 1.06em;
  }
  .header-logo img {
    height: 2em;
    margin: 0.3em 0 0 0;
	margin-top: 0px;
  }
}
/* ==== i18n (EN/中文) ==== */
#i18n-message {
  position: relative;
  text-align: left;
}

/* テキスト部分を重ねるための箱 */
#i18n-message .i18n-inner {
  position: relative;
  /* 英文と中文のうち「背の高い方」に合わせて少し余裕を持たせる */
  min-height: 120px;  /* 足りなければ 140px くらいにしてOK */
}

/* 両方同じ位置に重ねておいて、透明にする */
#i18n-message .i18n {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 1.8s ease;
}

/* 表示中の言語だけ見せる */
#i18n-message .i18n.is-visible {
  opacity: 1;
  visibility: visible;
}
/* 言語切替ボタン */
.i18n-switch {
  display: flex;
  gap: 6px;
  justify-content: flex-start;
  align-items: center;
  margin: 0 0 4px 0;  /* 上余白ゼロ、下だけ少し */
}

.i18n-btn {
  appearance: none;
  border: 1px solid #e6e0c7;
  background: #fff;
  color: #222;
  font: inherit;
  font-size: 12px;
  padding: 2px 6px;
  cursor: pointer;
  border-radius: 0;
  line-height: 1.1;
}

.i18n-btn.is-active {
  background: #E6E594;
  border-color: #d8d2b5;
}


/* === スマホ時ナビ修正 追記 === */
@media (max-width: 700px) {
  .main-nav ul {
    width: 100%; /* ← 100vwから変更 */
    left: 0;
    right: 0;
  }
}

/* === 右ハミ出し対策 & ボタン位置調整（SPのみ） === */
@media (max-width: 700px) {
  /* メニューの幅は100%に（100vwだと端末によってはみ出すことがある） */
  .main-nav ul { width: 100%; left: 0; right: 0; } /* 元は100vw指定:contentReference[oaicite:0]{index=0} */

  /* ハンバーガーを画面内に少し寄せる（右に出るのを防止） */
  .nav-toggle {
    right: max(10px, env(safe-area-inset-right) + 10px); /* 元: right:14px:contentReference[oaicite:1]{index=1} */
    top: 12px;
  }
}
.en-message {
  width: 100%;
  max-width: 980px;
  margin: 0px auto 60px auto;      /* 下余白少し減らす */
  margin-left: 80px;
  padding: 16px 1vw 14px 18px;   /* 上を詰めて、右余白も縮めて横幅確保 */
  background: rgba(255,255,255,0.8);
  border-radius: 18px;
  box-shadow: 0 2px 18px rgba(180,180,120,0.08);
  text-align: left;
  font-family: 'Yu Gothic', 'Noto Sans JP', sans-serif;
  box-sizing: border-box;
  position: relative;
  z-index: 200;
}

.en-lead {
  font-size: 1.32em;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #222;
  margin: 0 0 0.7em 0;
  font-family: "area-normal", sans-serif;
  line-height: 1.5;
}

.en-body {
  font-size: 1.05em;
  font-weight: 400;
  color: #444;
  line-height: 1.7;      /* 少しだけ詰めて読みやすく */
  letter-spacing: 0.01em;
  text-align: left;
  margin: 0;
}


@media (max-width: 900px) {
  .en-message {
	margin: 20px auto 10px auto; /* 左右中央寄せに戻す */
    padding: 20px 1vw 10px 1vw;
    border-radius: 10px;
    max-width: 98vw;
  }
  .en-lead {
    font-size: 1.15em;
  }
  .en-body {
    font-size: 1em;
    text-align: left;
    padding: 0;
    max-width: 98vw;
  }
}

/* en-message がpaddingのせいで横に広がらないように（常時） */
.en-message { box-sizing: border-box; } /* en-messageの大きめpaddingがあるため:contentReference[oaicite:2]{index=2} */

/* === SP: キービジュアルを横幅ピッタリに === */

@media (max-width: 700px) {
  .kv {
    width: 100%;         /* 100vw → 100% で端末差の横はみ出し防止 */
    max-width: 100%;
    height: 60vh;        /* 好みに応じて 55–70vh で調整可 */
	margin-bottom: 10px;
  }
  .kv img {
    width: 100%;
    height: 100%;
    object-fit: cover;   /* すでに指定済みだが明示 */
  }
　.navispace {
    height: 24px;
    padding-top: 0;
  }
  /* ハンバーガー開閉用ULの上マージンをリセット */
  .main-nav ul {
    margin-top: 0 !important;
  }
  .en-message {
    margin: -4px auto 10px auto;  /* ← ココがポイント：SPだけ少し上に引き寄せる */
  }
}
/* ===== SP：i18n重なり解消＋文字サイズ調整 ===== */
@media (max-width: 700px) {
  /* 重ね表示をやめて、通常フローで縦に積む */
  #i18n-message .i18n-inner {
    min-height: auto;         /* 固定を解除 */
  }
  #i18n-message .i18n {
    position: static;         /* absolute → static */
    opacity: 1;               /* 片方だけ表示するので常時1でもOK */
    visibility: visible;
    transition: none;         /* フェード不要なら切って軽量化 */
  }
  /* 非表示側だけ消す（高さを作らない） */
  #i18n-message .i18n:not(.is-visible) {
    display: none;
  }

  /* 文字サイズを少し小さく */
  .en-lead { font-size: 1.05em; }   /* 既存より一段落とす */
  .en-body { font-size: 0.95em; line-height: 1.6; }
}
