@charset "UTF-8";
/* café 彼女の家 ── 共通スタイル
   方針: グラデーション不使用／英字テンプレラベル不使用／単色・明朝主体・余白広め */

:root{
  --paper:#FAF6EF;      /* 地 */
  --paper-2:#F3EADB;    /* 一段沈めた地 */
  --ink:#241a12;        /* 本文 */
  --ink-2:#6d5a48;      /* 補助文字 */
  --line:#ded1bd;       /* 罫 */
  --dark:#2B1D12;       /* 濃い面 */
  --mango:#D8871A;      /* 主色 */
  --mango-lt:#EDB25A;   /* 主色・淡 */
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:"Hiragino Mincho ProN","Yu Mincho",serif;
  color:var(--ink); background:var(--paper);
  line-height:2.0; font-size:16px; -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.gothic{font-family:"Hiragino Sans","Noto Sans JP",sans-serif}
.wrap{width:min(1080px,90%);margin-inline:auto}
.narrow{width:min(760px,90%);margin-inline:auto}

/* ── ヘッダー ── */
header{position:sticky;top:0;z-index:60;background:rgba(250,246,239,.95);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
/* backdrop-filter は position:fixed の基準（containing block）を作ってしまうため、
   メニューを開いている間だけ外す。これが無いとナビが header の中に閉じ込められる。 */
body.nav-open header{backdrop-filter:none;-webkit-backdrop-filter:none}
.hdr{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 0;flex-wrap:nowrap}
.hdr>*{min-width:0}
.logo{display:flex;align-items:center;gap:12px;flex:none}
.logo-mark{height:44px;width:auto}
.logo small{font-family:"Hiragino Sans",sans-serif;font-size:10px;color:var(--ink-2);
  letter-spacing:.12em;white-space:nowrap}
.logo .sep{opacity:.4;margin:0 4px}
#gnav{flex:none}
#gnav ul{display:flex;gap:18px;list-style:none;font-size:13.5px;letter-spacing:.02em}
#gnav li{white-space:nowrap}
#gnav a{padding-bottom:3px;border-bottom:1px solid transparent;transition:.2s;display:inline-block}
#gnav a:hover{border-color:var(--mango)}
#gnav a.cur{color:var(--mango);border-color:var(--mango)}
.tel{font-family:"Hiragino Sans",sans-serif;font-size:12px;color:var(--ink-2);white-space:nowrap}
.tel b{font-size:17px;color:var(--ink);letter-spacing:.01em}
/* ハンバーガー（スマホ用・PCでは非表示） */
.navtoggle{display:none;flex:none;width:44px;height:44px;border:1px solid var(--line);background:#fff;
  cursor:pointer;position:relative;padding:0}
.navtoggle span,.navtoggle span::before,.navtoggle span::after{
  content:"";position:absolute;left:12px;width:20px;height:1.5px;background:var(--ink);transition:.25s}
.navtoggle span{top:50%;transform:translateY(-50%)}
.navtoggle span::before{top:-6px;left:0}
.navtoggle span::after{top:6px;left:0}
body.nav-open .navtoggle span{background:transparent}
body.nav-open .navtoggle span::before{top:0;transform:rotate(45deg)}
body.nav-open .navtoggle span::after{top:0;transform:rotate(-45deg)}

/* ナビが出ている幅では、ロゴ脇の説明文は出さない（重なり防止） */
@media(max-width:1440px){.logo small{display:none}}
@media(max-width:1240px){#gnav ul{gap:14px;font-size:13px} .tel span{display:none}}

/* ── 1080px以下＝スマホ／タブレット：ハンバーガーで開く ── */
@media(max-width:1080px){
  .navtoggle{display:block}
  .hdr .tel{display:none}          /* 電話はメニューの中とページ内CTAに集約 */
  #gnav{position:fixed;left:0;right:0;top:0;bottom:0;z-index:70;background:var(--paper);
    padding:76px 8% 40px;overflow-y:auto;opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .25s ease, visibility .25s}
  body.nav-open #gnav{opacity:1 !important;visibility:visible !important;pointer-events:auto}
  body.nav-open{overflow:hidden}
  #gnav ul{flex-direction:column;gap:0;font-size:19px}
  #gnav li{border-bottom:1px solid var(--line)}
  #gnav li a{display:block;padding:18px 2px;border-bottom:none}
  #gnav li a.cur{color:var(--mango)}
  #gnav .nav-extra{margin-top:28px;display:block}
  #gnav .nav-tel{display:block;font-family:"Hiragino Sans",sans-serif;background:var(--mango);color:#fff;
    text-align:center;padding:16px;font-size:16px;font-weight:600;margin-bottom:18px}
  #gnav .nav-note{font-family:"Hiragino Sans",sans-serif;font-size:12.5px;color:var(--ink-2);line-height:1.9}
  .navtoggle{z-index:80}
}
.nav-extra{display:none}
@media(max-width:560px){.logo-mark{height:36px}}


/* LP・多言語ページはナビが無いので、ロゴ脇の説明文は出したまま（560px以下のみ非表示） */
.lp-hdr .logo small{display:inline}
@media(max-width:560px){.lp-hdr .logo small{display:none}}

/* ── 見出し ── */
h1,h2,h3{font-weight:500;letter-spacing:.04em;line-height:1.65}
.h-lead{font-size:clamp(22px,3.6vw,34px);margin-bottom:20px}
.h-sub{font-size:clamp(18px,2.6vw,24px);margin-bottom:14px}
.h-min{font-family:"Hiragino Sans",sans-serif;font-size:13px;letter-spacing:.12em;
  color:var(--mango);margin-bottom:12px;font-weight:600}
.lead{font-size:15.5px;line-height:2.15;color:var(--ink-2);max-width:42em}
.lead strong{color:var(--ink)}
section{padding:clamp(58px,8vw,100px) 0}
.rule{width:44px;height:1px;background:var(--mango);margin:0 0 22px}

/* ── ボタン ── */
.btn{display:inline-block;font-family:"Hiragino Sans",sans-serif;font-size:13.5px;
  letter-spacing:.06em;padding:14px 30px;border:1px solid transparent;transition:.22s}
.btn-main{background:var(--mango);color:#fff}
.btn-main:hover{background:#c0760f}
.btn-line{border-color:var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--ink);color:var(--paper)}
.btn-ghost{border-color:rgba(255,255,255,.65);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.15)}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

/* ── フッター ── */
footer{background:var(--dark);color:rgba(255,255,255,.7);padding:56px 0 28px;
  font-family:"Hiragino Sans",sans-serif;font-size:13px}
.f-top{display:flex;flex-wrap:wrap;gap:36px;justify-content:space-between;
  padding-bottom:30px;border-bottom:1px solid rgba(255,255,255,.13)}
.f-mark{width:190px;opacity:.9}
.f-logo p{margin-top:14px;line-height:1.95;font-size:12.5px}
.f-nav{display:flex;gap:46px;flex-wrap:wrap}
.f-nav b{color:#fff;font-size:12px;letter-spacing:.1em;display:block;margin-bottom:13px;font-weight:500}
.f-nav ul{list-style:none;display:grid;gap:9px;font-size:12.5px}
.f-nav a:hover{color:var(--mango-lt)}
.copy{padding-top:22px;font-size:11.5px;color:rgba(255,255,255,.42);text-align:center}

/* ── 作業表示 ── */
.draft{position:fixed;right:12px;bottom:12px;z-index:99;background:rgba(110,28,28,.92);
  color:#fff;font-family:"Hiragino Sans",sans-serif;font-size:10.5px;padding:7px 13px;
  letter-spacing:.05em;box-shadow:0 6px 18px rgba(0,0,0,.3)}
