/* ============================================================
   特設ページ（LP）の言語の切り替え（2026-10-21 前田さんの決定＝LP にも付ける）。全 LP 共通（たたき台の LP も）
   - 右上の「Language」のボタン（.lang-switch--lp＝Showa/lang_switch.ctp・Layout/lp.ctp が出す）：ページのいちばん上の右端に下がる札（LP のヘッダーの札 .head__tag と同じ、こげ茶の地に金の細い枠）。
     押すと白い札で言語の一覧（公式サイトのヘッダーと同じ見た目）。ヘッダーを上に残す形（.head.is-stuck）になっても付いてこない（ページの先頭だけ・フッターにも並びがある）
   - フッターの並び（.lang-list--lp＝Showa/lang_list.ctp・Lp/common/foot.ctp）：言語の名前を「/」で区切って横に。今の言語は下線（押せない）
   読み込み＝Layout/lp.ctp（作り始めた言語が2つ以上のとき）。tailwind のビルドは通さない＝このファイルを手で直す（webroot/assets/lp/lang/{頭}.css と同じ）
   位置の右の余白＝LP のヘッダー（lease.css の .head）と同じ：1181px 以上 56px・921〜1180px 32px・920px 以下 18px
   ============================================================ */
.lang-switch--lp { position: absolute; top: 0; right: 56px; z-index: 25; font-family: "EB Garamond", serif; font-size: 14px; letter-spacing: .06em; line-height: 1; }
.lang-switch--lp .lang-switch__btn { display: inline-flex; align-items: center; gap: .5em; min-height: 30px; padding: 4px 14px 5px; color: #fff; background: rgba(39,23,10,.78); border: 1px solid rgba(199,179,131,.85); border-top: 0; border-radius: 0 0 6px 6px; cursor: pointer; list-style: none; transition: background-color .3s; }
.lang-switch--lp .lang-switch__btn::-webkit-details-marker { display: none; }
.lang-switch--lp .lang-switch__btn::marker { content: ""; }
.lang-switch--lp .lang-switch__btn::after { content: ""; width: .4em; height: .4em; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: translateY(-.15em) rotate(45deg); transition: transform .3s; }
.lang-switch--lp[open] > .lang-switch__btn::after { transform: translateY(.12em) rotate(-135deg); }
.lang-switch--lp .lang-switch__btn:hover, .lang-switch--lp[open] > .lang-switch__btn { background: rgba(39,23,10,.95); }
.lang-switch--lp .lang-switch__btn:focus-visible { outline: 2px solid #c7b383; outline-offset: 2px; }
.lang-switch--lp .lang-switch__list { position: absolute; top: calc(100% + 4px); right: 0; min-width: 10em; margin: 0; padding: 6px 0; list-style: none; background: #fff; color: #2B2019; border: 1px solid #DDD3CA; box-shadow: 0 8px 24px rgba(30,20,14,.16); font-size: 15px; }
.lang-switch--lp .lang-switch__list a, .lang-switch--lp .lang-switch__list span { display: block; padding: 9px 18px; line-height: 1.4; white-space: nowrap; color: inherit; text-decoration: none; }
.lang-switch--lp .lang-switch__list a:hover { background: #F5F1EC; }
.lang-switch--lp .lang-switch__list a:focus-visible { outline: 2px solid #8a6d2f; outline-offset: -2px; }
.lang-switch--lp [aria-current] { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
@media (min-width: 921px) and (max-width: 1180px) { .lang-switch--lp { right: 32px; } }
@media (max-width: 920px) { .lang-switch--lp { right: 18px; font-size: 13px; } }
/* 390px より狭い幅（375px・320px など）：ロゴ（絵）と重ならないよう、ボタンは地球の印だけにする（「Language」の文字は読み上げには残す＝見た目だけ隠す） */
@media (max-width: 389px) {
  .lang-switch--lp { right: 8px; }
  .lang-switch--lp .lang-switch__btn { position: relative; justify-content: center; gap: 0; width: 36px; min-height: 30px; padding: 0; font-size: 0; letter-spacing: 0; }
  .lang-switch--lp .lang-switch__btn::before { content: ""; width: 17px; height: 17px; background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='9.2'/%3E%3Cpath d='M2.8 12h18.4M12 2.8c2.6 2.6 3.9 5.6 3.9 9.2s-1.3 6.6-3.9 9.2M12 2.8C9.4 5.4 8.1 8.4 8.1 12s1.3 6.6 3.9 9.2'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='9.2'/%3E%3Cpath d='M2.8 12h18.4M12 2.8c2.6 2.6 3.9 5.6 3.9 9.2s-1.3 6.6-3.9 9.2M12 2.8C9.4 5.4 8.1 8.4 8.1 12s1.3 6.6 3.9 9.2'/%3E%3C/svg%3E") center / contain no-repeat; }
  .lang-switch--lp .lang-switch__btn::after { content: none; }
  .lang-switch--lp .lang-switch__list { font-size: 15px; letter-spacing: .06em; }
}

/* フッターの並び（運営会社の「公式サイト」の下・SNS の上＝公式サイトのフッターの「言語の切り替え→SNS」と同じ順） */
.lang-list--lp { margin-top: 20px; font-family: "EB Garamond", serif; font-size: 15px; letter-spacing: .04em; line-height: 1.6; }
.lang-list--lp .lang-list__items { display: flex; flex-wrap: wrap; align-items: center; row-gap: 4px; margin: 0; padding: 0; list-style: none; }
.lang-list--lp li:not(:last-child)::after { content: "/"; margin: 0 .55em; opacity: .6; }  /* 区切りは項目の後ろ＝折り返した行が「/」で始まらない */
.lang-list--lp a { display: inline-block; padding: 6px 0; color: inherit; text-decoration: none; opacity: .85; transition: opacity .3s, color .3s; }
.lang-list--lp a:hover { opacity: 1; color: #c7b383; text-decoration: underline; text-underline-offset: 4px; }
.lang-list--lp a:focus-visible { outline: 1px solid currentColor; outline-offset: 3px; }
.lang-list--lp [aria-current] { display: inline-block; padding: 6px 0; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }

/* 言語の名前はその言語の書体で（公式サイトの input.css の .lang-switch__list と同じ並び。Web フォントは読み込まない） */
:is(.lang-switch--lp, .lang-list--lp) [lang="ja"] { font-family: "Shippori Mincho B1", "Yu Mincho", "YuMincho", "Noto Serif JP", serif; }
:is(.lang-switch--lp, .lang-list--lp) [lang="zh-Hans"] { font-family: "Songti SC", "STSong", "SimSun", "Noto Serif SC", "Source Han Serif SC", serif; }
:is(.lang-switch--lp, .lang-list--lp) [lang="zh-Hant"] { font-family: "Songti TC", "PMingLiU", "MingLiU", "Noto Serif TC", "Source Han Serif TC", serif; }
:is(.lang-switch--lp, .lang-list--lp) [lang="ko"] { font-family: "AppleMyungjo", "Batang", "Noto Serif KR", "Nanum Myeongjo", serif; }
:is(.lang-switch--lp, .lang-list--lp) [lang="en"] { font-family: "EB Garamond", serif; }