/* 新しいヘッダー（test.html 2026-10-26 版）を下層ページにも使うための抜き出し */
/* #5 メニュー：英字の小見出し＋日本語。PCは1列で中央、スマホは3列×2段（横スクロールで隠れない） */
.kk-menu{background:rgba(16,26,20,.92);border-bottom:1px solid rgba(192,168,102,.35)}
.kk-menu ul{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));max-width:1100px}
.kk-menu li{border-left:1px solid rgba(255,255,255,.10)}
.kk-menu li:last-child{border-right:1px solid rgba(255,255,255,.10)}
.kk-menu a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:12px 6px 11px;text-decoration:none;color:#f2efe4;font-size:13.5px;font-weight:700;letter-spacing:.04em;line-height:1.3;text-align:center;position:relative;transition:background .2s}
.kk-menu a i{font-style:normal;font-family:var(--display);font-size:11px;font-weight:800;letter-spacing:.16em;color:#c0a866}
.kk-menu a:hover{background:rgba(255,255,255,.06)}
.kk-menu a.on{background:rgba(192,168,102,.14)}
.kk-menu a.on::after{content:"";position:absolute;left:22%;right:22%;bottom:0;height:3px;border-radius:3px 3px 0 0;background:#c0a866}
@media(max-width:760px){
  .kk-menu .wrap{padding:0}
  .kk-menu ul{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kk-menu li{border-left:0;border-right:1px solid rgba(255,255,255,.10)!important;border-bottom:1px solid rgba(255,255,255,.10)}
  .kk-menu li:nth-child(3n){border-right:0!important}
  .kk-menu a{font-size:12px;padding:9px 2px 8px;letter-spacing:0}
  .kk-menu a i{font-size:10px;letter-spacing:.12em}
}

html,body{color-scheme:light}

/* #7 言語切替 */
.kk-lang{display:inline-flex;border:1px solid rgba(192,168,102,.65);border-radius:999px;overflow:hidden;flex:none}
.kk-lang button{appearance:none;-webkit-appearance:none;border:0;background:transparent;color:#f2efe4;font-family:inherit;font-weight:700;font-size:12px;line-height:1;padding:8px 11px;cursor:pointer}
.kk-lang button.on{background:#c0a866;color:#16211a}
@media(max-width:640px){
  .nav{gap:8px}
  .nav-right{gap:8px}
  .nav-cta{padding:8px 11px;font-size:11.5px}
  .kk-lang button{padding:7px 8px;font-size:11px}
}
@media(max-width:420px){.nav-cta{padding:8px 9px;font-size:11px;letter-spacing:-.02em}.kk-lang button{padding:7px 7px}.logo{font-size:13px}.logo small{font-size:8.5px;letter-spacing:.08em}}
@media(max-width:360px){.logo{font-size:12px}.nav-cta{font-size:10.5px;padding:7px 7px}}

/* ══════════════════════════════════════════════════════════════
   2026-10-22 ヘッダー → 2026-10-26 test.html に統合（仁さん「上にのせたら出るカッコいいデザイン・右余白なし」）
   ・ヘッダーとメニューを画面の端から端まで（左右の余白なし）
   ・PC：項目にマウスを乗せると、金の線が中央から伸び、下に小メニューがすっと出る（jin2012.jp と同じ出方）
   ・スマホ：今まで通り3列×2段。小メニューは出さない（タップでそのページへ）
   ══════════════════════════════════════════════════════════════ */
header .wrap.nav{width:100%;max-width:none;padding-left:clamp(14px,2.4vw,36px);padding-right:clamp(14px,2.4vw,36px)}
.kk-menu2>ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));max-width:none;width:100%}
.kk-menu2>ul>li{position:relative;border-left:1px solid rgba(255,255,255,.10)}
.kk-menu2>ul>li:first-child{border-left:0}
.kk-menu2>ul>li:last-child{border-right:0}
.kk-menu2 .kk-top{padding:14px 6px 13px;transition:background .25s,color .25s}
.kk-menu2 .kk-top::before{content:"";position:absolute;left:50%;right:50%;bottom:0;height:3px;background:#c0a866;transition:left .3s ease,right .3s ease}
.kk-menu2 li:hover>.kk-top::before,.kk-menu2 li:focus-within>.kk-top::before{left:14%;right:14%}
.kk-menu2 li:hover>.kk-top{background:rgba(192,168,102,.12)}
.kk-menu2 .has-sub>.kk-top::after{content:"";position:static;display:block;width:7px;height:7px;margin-top:2px;border-right:1.5px solid #c0a866;border-bottom:1.5px solid #c0a866;transform:rotate(45deg);background:none;border-radius:0;opacity:.8}
.kk-menu2 .has-sub>.kk-top.on::after{position:static;left:auto;right:auto;height:7px}
.kk-sub{list-style:none;margin:0;padding:8px 0;position:absolute;top:100%;left:0;right:0;min-width:200px;background:rgba(14,22,17,.97);border-top:2px solid #c0a866;box-shadow:0 14px 30px rgba(0,0,0,.35);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .25s ease,transform .25s ease,visibility 0s linear .25s;z-index:60}
.kk-menu2 li:hover>.kk-sub,.kk-menu2 li:focus-within>.kk-sub{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .25s ease,transform .25s ease,visibility 0s}
.kk-menu2 .kk-sub{display:block;grid-template-columns:none;max-width:none;width:auto}
.kk-menu2 .kk-sub li{border:0!important}
.kk-sub a{display:block;padding:11px 20px;color:#f2efe4;text-decoration:none;font-size:13.5px;font-weight:600;letter-spacing:.04em;text-align:left;transition:background .2s,padding-left .2s,color .2s}
.kk-sub a:hover{background:rgba(192,168,102,.16);color:#fff;padding-left:26px}
@media(max-width:760px){
  .kk-menu2>ul{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kk-menu2>ul>li{border-left:0;border-right:1px solid rgba(255,255,255,.10);border-bottom:1px solid rgba(255,255,255,.10)}
  .kk-menu2>ul>li:nth-child(3n){border-right:0}
  .kk-menu2 .kk-top{padding:9px 2px 8px}
  .kk-menu2 .kk-sub,.kk-menu2 .has-sub>.kk-top::after{display:none}
}

/* 2026-10-25 #6 スマホのトップ（仁さん 10/22「スマホのトップをカッコいいデザインに・上にのせたら出るメニュー・右余白なし」）
   スマホ＝MENUボタンで開くメニュー（画面の端から端まで）＋トップを写真から始める。PCは変えていない
   🔑 やめるときはこのブロックと、HTMLの .kk-mbtn と、末尾の kk-mobile-top スクリプトを消す */
.kk-mbtn{display:none}
@media(max-width:640px){
  .nav-cta{display:none}
  .kk-mbtn{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 13px;border:1px solid #c0a866;border-radius:999px;background:transparent;color:#f2efe4;font:800 11px/1 var(--display);letter-spacing:.16em;cursor:pointer}
  .kk-mbtn span{position:relative;width:16px;height:2px;background:#c0a866;transition:background .2s}
  .kk-mbtn span::before,.kk-mbtn span::after{content:"";position:absolute;left:0;width:16px;height:2px;background:#c0a866;transition:transform .25s}
  .kk-mbtn span::before{top:-5px}.kk-mbtn span::after{top:5px}
  header.kk-open .kk-mbtn span{background:transparent}
  header.kk-open .kk-mbtn span::before{transform:translateY(5px) rotate(45deg)}
  header.kk-open .kk-mbtn span::after{transform:translateY(-5px) rotate(-45deg)}
  .nav-right{gap:8px}
  .kk-menu{display:none;position:absolute;left:0;right:0;top:100%;background:rgba(14,22,17,.97);border-bottom:2px solid #c0a866;box-shadow:0 14px 30px rgba(0,0,0,.45)}
  header.kk-open .kk-menu{display:block;animation:kkDrop .25s ease-out}
  @keyframes kkDrop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
  .kk-menu .wrap{width:100%;max-width:none;margin:0;padding:0}
  .kk-menu ul{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}
  .kk-menu li,.kk-menu li:nth-child(3n){border-right:1px solid rgba(255,255,255,.10)!important}
  .kk-menu li:nth-child(2n){border-right:0!important}
  .kk-menu a{font-size:14px;padding:17px 4px 15px}
  .kk-menu a i{font-size:10.5px}
  .kk-menu,header.kk-open .kk-menu{background:#0e1611!important;backdrop-filter:none}
  header .logo{white-space:nowrap;font-size:15px}
  header .logo small{display:none}
  .hero-old .old-main{max-width:none;padding:0}
  .hero-old .old-main img{border-radius:0}
}

/* 2026-10-26 統合：スマホ（640px以下）は 10/25 の MENU ボタン＋2列のメニューを優先する */
@media(max-width:640px){
  .kk-menu2>ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kk-menu2>ul>li{border-left:0}
  .kk-menu2 .kk-top{padding:17px 4px 15px}
  .kk-menu2 .kk-sub,.kk-menu2 .has-sub>.kk-top::after{display:none}
}

