/* ============================================
   HARMONY SHIBUYA — Luxury Gold Design System
   共通スタイルシート（レスポンシブ対応）
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Noto+Serif+JP:wght@200;300;400;500&display=swap');

/* ── Variables ──────────────────────────── */
:root {
  --gold:        #B89E76;
  --gold-dim:    #8B7355;
  --gold-pale:   #F5F0E8;
  --gold-border: #E2DDD5;
  --border:      #E2DDD5;
  --bg-main:     #F9F6F1;
  --bg-sub:      #F3EFE9;
  --bg-dark:     #2a2520;
  --text-main:   #3A3530;
  --text-muted:  #7A726A;
  --white:       #ffffff;
  --line-green:  #06C755;
  --nav-h:       64px;
  --pad:         clamp(20px, 5vw, 64px);
  --serif:       'Cormorant Garamond', Georgia, serif;
  --sans:        'Noto Serif JP', serif;
}

/* ── Reset ──────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html  { scroll-behavior: smooth; }
body  {
  font-family: var(--sans);
  background: var(--bg-main);
  color: var(--text-main);
  line-height: 1.9;
  -webkit-font-smoothing: antialiased;
  padding-top: var(--nav-h);
}
img { max-width: 100%; display: block; }
a   { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: var(--sans); }

/* ── Utilities ──────────────────────────── */
.font-en   { font-family: var(--serif); }
.text-gold { color: var(--gold); }

.gold-line {
  width: 48px; height: 1px;
  background: var(--gold);
  margin: 0 auto;
}
.gold-line-full {
  height: 1px;
  background: linear-gradient(to right, transparent, var(--gold), transparent);
}

/* ── Fade-up animation ──────────────────── */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .9s ease, transform .9s ease;
}
.fade-up.visible { opacity: 1; transform: translateY(0); }

/* ══════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════════ */
.site-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 300;
  height: var(--nav-h);
  background: rgba(249,246,241,.95);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--gold-border);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 var(--pad); gap: 16px;
}
.nav-logo {
  font-family: var(--serif);
  font-size: 20px; letter-spacing: 6px;
  color: var(--gold); font-weight: 400;
}
.nav-links { display: flex; gap: 24px; align-items: center; }
.nav-links a {
  font-size: 11px; letter-spacing: 2px;
  color: var(--text-muted); white-space: nowrap;
  transition: color .2s; font-weight: 300;
}
.nav-links a:hover,
.nav-links a.active { color: var(--gold); }
.nav-back {
  font-size: 11px; letter-spacing: 1.5px;
  color: var(--gold); border-bottom: 1px solid var(--gold);
  padding-bottom: 1px; white-space: nowrap;
  transition: opacity .2s;
}
.nav-back:hover { opacity: .65; }
.nav-cta {
  background: var(--gold); color: var(--white);
  padding: 9px 22px; font-size: 11px;
  letter-spacing: 2px; font-weight: 300;
  transition: all .3s;
}
.nav-cta:hover { background: var(--bg-dark); }

/* Hamburger */
.nav-ham {
  display: none; flex-direction: column; gap: 5px;
  padding: 8px; flex-shrink: 0;
}
.nav-ham span {
  display: block; width: 22px; height: 1px;
  background: var(--text-main); transition: all .3s;
}
.nav-ham.open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-ham.open span:nth-child(2) { opacity: 0; }
.nav-ham.open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Mobile dropdown nav */
.mobile-nav {
  display: none;
  position: fixed; top: var(--nav-h); left: 0; right: 0;
  background: var(--bg-main);
  border-bottom: 1px solid var(--gold-border);
  padding: 16px var(--pad) 24px;
  z-index: 299;
  flex-direction: column;
  box-shadow: 0 12px 32px rgba(0,0,0,.07);
}
.mobile-nav.open { display: flex; }
.mobile-nav a {
  padding: 14px 0;
  border-bottom: 1px solid var(--gold-border);
  font-size: 13px; color: var(--text-muted); letter-spacing: 2px;
}
.mobile-nav a:hover { color: var(--gold); }

/* ══════════════════════════════════════════
   PAGE HEADER（内ページ共通）
═══════════════════════════════════════════ */
.page-header {
  background: var(--gold-pale);
  border-bottom: 1px solid var(--gold-border);
  padding: 56px var(--pad) 48px;
  text-align: center;
}
.page-header .eyebrow {
  font-size: 9px; letter-spacing: 5px;
  color: var(--gold); margin-bottom: 12px;
  font-weight: 300; text-transform: uppercase;
}
.page-header h1 {
  font-family: var(--serif);
  font-size: clamp(32px, 5vw, 52px);
  font-weight: 300; color: var(--text-main);
  letter-spacing: .12em; margin-bottom: 12px;
}
.page-header p {
  font-size: 12px; color: var(--text-muted);
  letter-spacing: 3px; font-weight: 300;
}

/* ══════════════════════════════════════════
   LAYOUT HELPERS
═══════════════════════════════════════════ */
.inner        { max-width: 1040px; margin: 0 auto; }
.inner-narrow { max-width: 760px;  margin: 0 auto; }

.section     { padding: 72px var(--pad); }
.section-alt { padding: 72px var(--pad); background: var(--bg-sub); border-top: 1px solid var(--gold-border); border-bottom: 1px solid var(--gold-border); }
.section-dark{ padding: 72px var(--pad); background: var(--bg-dark); }

.eyebrow {
  font-size: 9px; letter-spacing: 5px;
  color: var(--gold); font-weight: 300;
  text-transform: uppercase; margin-bottom: 10px;
}
.section-title {
  font-family: var(--serif);
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 300; letter-spacing: .08em;
  color: var(--text-main); line-height: 1.3;
  margin-bottom: 32px;
}
.section-dark .section-title { color: var(--white); }

/* ══════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════ */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 8px; padding: 15px 36px;
  font-family: var(--sans); font-size: 11px;
  letter-spacing: 3px; font-weight: 300;
  cursor: pointer; transition: all .3s; white-space: nowrap;
}
.btn-gold {
  background: var(--gold); color: var(--white);
  border: 1px solid var(--gold);
}
.btn-gold:hover { background: transparent; color: var(--gold); }

.btn-dark {
  background: var(--bg-dark); color: var(--white);
  border: 1px solid var(--bg-dark);
}
.btn-dark:hover { background: transparent; color: var(--text-main); border-color: var(--gold-border); }

.btn-outline {
  background: transparent; color: var(--text-main);
  border: 1px solid var(--gold-border);
}
.btn-outline:hover { border-color: var(--gold); color: var(--gold); }

.btn-outline-gold {
  background: transparent; color: var(--gold);
  border: 1px solid var(--gold);
}
.btn-outline-gold:hover { background: var(--gold); color: var(--white); }

.btn-outline-white {
  background: transparent; color: var(--white);
  border: 1px solid #555;
}
.btn-outline-white:hover { border-color: var(--white); }

.btn-line {
  background: var(--line-green); color: var(--white);
  border: 1px solid var(--line-green);
}
.btn-line:hover { background: #05a847; border-color: #05a847; }

/* ══════════════════════════════════════════
   CTA BANNER
═══════════════════════════════════════════ */
.cta-banner { background: var(--bg-dark); padding: 72px var(--pad); text-align: center; }
.cta-banner .eyebrow { color: var(--gold); }
.cta-banner h2 {
  font-family: var(--serif);
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 300; color: var(--white);
  letter-spacing: .08em; margin-bottom: 12px;
}
.cta-banner p { font-size: 12px; color: #777; margin-bottom: 40px; letter-spacing: 2px; font-weight: 300; }
.cta-buttons  { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* ══════════════════════════════════════════
   TABLE（募集要項など）
═══════════════════════════════════════════ */
.h-table { width: 100%; border-collapse: collapse; }
.h-table tr { border-bottom: 1px solid var(--gold-border); }
.h-table tr:first-child { border-top: 1px solid var(--gold-border); }
.h-table td {
  padding: 22px 0; font-size: 13px;
  color: var(--text-muted); vertical-align: top;
  line-height: 2; font-weight: 300;
}
.h-table td:first-child {
  width: 140px; color: var(--text-main);
  font-weight: 400; font-size: 10px;
  letter-spacing: 2.5px; padding-right: 28px;
  white-space: nowrap; padding-top: 26px;
  text-transform: uppercase;
}

/* ══════════════════════════════════════════
   TAGS / BADGES
═══════════════════════════════════════════ */
.tag {
  display: inline-block;
  font-size: 9px; letter-spacing: 2px;
  color: var(--gold); border: 1px solid var(--gold-border);
  background: var(--gold-pale); padding: 3px 10px;
}

/* ══════════════════════════════════════════
   ACCORDION（Q&A）
═══════════════════════════════════════════ */
.acc-item { border-bottom: 1px solid var(--gold-border); }
.acc-item:first-of-type { border-top: 1px solid var(--gold-border); }
.acc-trigger {
  width: 100%; text-align: left;
  padding: 20px 0; background: none; border: none;
  cursor: pointer; display: flex;
  justify-content: space-between; align-items: flex-start;
  gap: 16px; font-family: var(--sans);
}
.acc-icon {
  flex-shrink: 0; width: 24px; height: 24px;
  border: 1px solid var(--gold-border); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--gold); font-size: 16px; line-height: 1;
  transition: all .3s; margin-top: 2px;
}
.acc-trigger[aria-expanded="true"] .acc-icon {
  transform: rotate(45deg); background: var(--gold-pale);
}
.acc-body { display: none; padding: 0 0 24px 36px; }
.acc-body.open { display: block; }
.acc-body p {
  font-size: 13px; color: var(--text-muted);
  font-weight: 300; line-height: 2.2;
}

/* ══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
.site-footer {
  background: var(--bg-dark);
  padding: 56px var(--pad) 32px;
  text-align: center;
  border-top: 1px solid #3a3530;
}
.footer-logo {
  font-family: var(--serif);
  font-size: 22px; letter-spacing: 8px;
  color: var(--gold); font-weight: 300; margin-bottom: 24px;
}
.footer-contact {
  font-size: 12px; color: #888;
  line-height: 2.4; font-weight: 300; margin-bottom: 28px;
}
.footer-contact a { color: #aaa; transition: color .2s; }
.footer-contact a:hover { color: var(--gold); }
.footer-official {
  margin-bottom: 20px;
}
.footer-official p {
  font-size: 9px; letter-spacing: 3px;
  color: #555; text-transform: uppercase; margin-bottom: 8px;
}
.footer-official a {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; letter-spacing: 2px;
  color: #888; transition: color .2s;
}
.footer-official a:hover { color: var(--gold); }
.footer-copy {
  font-size: 9px; letter-spacing: 3px;
  color: #555; text-transform: uppercase;
}

/* ══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 1024px) {
  .nav-links { gap: 16px; }
  .nav-links a { font-size: 10px; }
}
@media (max-width: 1180px) {
  .nav-links { display: none; }
  .nav-ham   { display: flex; }
  .nav-cta   { display: none; }
}
@media (max-width: 540px) {
  .cta-buttons { flex-direction: column; align-items: center; }
  .cta-buttons .btn { width: 100%; max-width: 320px; }
}

/* モバイルメニューボタンの改善 */
.mobile-nav-toggle {
  min-width: 44px; /* Appleのガイドライン基準 */
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

html {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch; /* iPhoneでのスクロールを滑らかにする */
}

/* ══════════════════════════════════════════
   LOCAL UTILITY CLASSES FOR top.html
═══════════════════════════════════════════ */
.scroll-smooth { scroll-behavior: smooth; }
.fixed{position:fixed}.relative{position:relative}.absolute{position:absolute}
.inset-0{inset:0}.top-0{top:0}.bottom-10{bottom:2.5rem}.left-1\/2{left:50%}
.z-10{z-index:10}.z-50{z-index:50}.block{display:block}.inline-block{display:inline-block}
.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}
.w-full{width:100%}.w-6{width:1.5rem}.w-5{width:1.25rem}.w-4{width:1rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-1\.5{width:.375rem}
.h-screen{min-height:100vh}.h-full{height:100%}.h-12{height:3rem}.h-5{height:1.25rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-1\.5{height:.375rem}
.h-\[1px\]{height:1px}.w-\[1px\]{width:1px}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}
.mx-auto{margin-left:auto;margin-right:auto}.ml-auto{margin-left:auto}.mt-1{margin-top:.25rem}.mt-3{margin-top:.75rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-14{margin-top:3.5rem}.mt-20{margin-top:5rem}
.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}.mb-20{margin-bottom:5rem}
.my-10{margin-top:2.5rem;margin-bottom:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-12{padding-left:3rem;padding-right:3rem}
.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-28{padding-top:7rem;padding-bottom:7rem}
.p-1{padding:.25rem}.p-8{padding:2rem}.p-10{padding:2.5rem}.pt-4{padding-top:1rem}.pt-12{padding-top:3rem}.pb-0\.5{padding-bottom:.125rem}.pb-6{padding-bottom:1.5rem}.pl-10{padding-left:2.5rem}.pr-4{padding-right:1rem}
.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-12{gap:3rem}
.items-center{align-items:center}.items-start{align-items:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.shrink-0{flex-shrink:0}
.grid-cols-1{grid-template-columns:1fr}.space-y-2>*+*{margin-top:.5rem}.space-y-3>*+*{margin-top:.75rem}.space-y-4>*+*{margin-top:1rem}.space-y-28>*+*{margin-top:7rem}
.overflow-hidden{overflow:hidden}.object-cover{object-fit:cover}.text-center{text-align:center}.uppercase{text-transform:uppercase}.list-none{list-style:none}.cursor-pointer{cursor:pointer}
.rounded-sm{border-radius:2px}.rounded-full{border-radius:999px}.border{border:1px solid var(--border)}.border-t{border-top:1px solid var(--border)}.border-b{border-bottom:1px solid var(--border)}.border-y{border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.border-gold{border-color:var(--gold)}
.bg-white{background:#fff}.bg-gold{background:var(--gold)}.bg-\[var\(--bg-main\)\]{background:var(--bg-main)}.bg-\[var\(--bg-sub\)\]{background:var(--bg-sub)}.bg-\[\#3A3530\]{background:#3A3530}.bg-\[\#F9F6F1\]\/90{background:rgba(249,246,241,.9)}
.text-gold{color:var(--gold)}.text-white{color:#fff}.text-\[\#F9F6F1\]{color:#F9F6F1}.text-stone-400{color:#a8a29e}.text-stone-500{color:#78716c}.text-stone-600{color:#57534e}
.text-\[var\(--text-main\)\]{color:var(--text-main)}.text-\[var\(--text-muted\)\]{color:var(--text-muted)}.text-\[var\(--gold-dim\)\]{color:var(--gold-dim)}
.text-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-xs{font-size:12px}.text-sm{font-size:14px}.text-base{font-size:16px}.text-xl{font-size:20px}.text-2xl{font-size:24px}.text-4xl{font-size:36px}.text-5xl{font-size:48px}.text-6xl{font-size:60px}
.font-light{font-weight:300}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.not-italic{font-style:normal}
.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.tracking-\[0\.2em\]{letter-spacing:.2em}.tracking-\[0\.25em\]{letter-spacing:.25em}.tracking-\[0\.3em\]{letter-spacing:.3em}.tracking-\[0\.4em\]{letter-spacing:.4em}.tracking-\[0\.5em\]{letter-spacing:.5em}
.leading-none{line-height:1}.leading-relaxed{line-height:1.75}.leading-\[2\.2\]{line-height:2.2}.leading-\[2\.4\]{line-height:2.4}.leading-\[2\.6\]{line-height:2.6}
.opacity-30{opacity:.3}.opacity-40{opacity:.4}.opacity-50{opacity:.5}.opacity-55{opacity:.55}.opacity-70{opacity:.7}
.shadow-sm{box-shadow:0 1px 3px rgba(0,0,0,.08)}.shadow-md{box-shadow:0 8px 20px rgba(0,0,0,.12)}.shadow-lg{box-shadow:0 14px 32px rgba(0,0,0,.16)}
.transition{transition:all .25s ease}.transition-all{transition:all .25s ease}.duration-300{transition-duration:.3s}.backdrop-blur-md{backdrop-filter:blur(12px)}
.min-h-\[220px\]{min-height:220px}.min-h-\[340px\]{min-height:340px}.aspect-\[4\/3\]{aspect-ratio:4/3}
.-translate-x-1\/2{transform:translateX(-50%)}.divide-y>*+*{border-top:1px solid var(--border)}
.img-wrap{overflow:hidden;background:var(--gold-pale)}.img-wrap img{transition:transform .6s ease}.img-wrap:hover img{transform:scale(1.03)}
.hero-overlay{background:linear-gradient(180deg,rgba(249,246,241,.45),rgba(249,246,241,.9))}
.scroll-dot{animation:scrollPulse 1.8s ease-in-out infinite}@keyframes scrollPulse{50%{opacity:.15;transform:scaleY(.7)}}
#mobile-menu{position:fixed;inset:var(--nav-h) 0 auto 0;z-index:400;display:none;flex-direction:column;align-items:center;padding:34px 24px;background:rgba(249,246,241,.98);border-bottom:1px solid var(--border);box-shadow:0 18px 40px rgba(0,0,0,.08)}
#mobile-menu.open{display:flex}
.btn-gold,.btn-outline{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--gold);letter-spacing:.16em;font-weight:500;transition:all .25s ease}
.btn-gold{background:var(--gold);color:#fff}.btn-gold:hover{background:var(--bg-dark);border-color:var(--bg-dark);color:#fff}
.btn-outline{background:transparent;color:var(--text-main);border-color:var(--border)}.btn-outline:hover{border-color:var(--gold);color:var(--gold)}
.hover\:text-gold:hover{color:var(--gold)}.hover\:border-gold:hover{border-color:var(--gold)}

/* ══════════════════════════════════════════
   SUB PAGE COMPONENTS
═══════════════════════════════════════════ */
.section-center{text-align:center}.about-strip,.intro-section{padding:58px var(--pad);text-align:center;background:#fff;border-bottom:1px solid var(--border)}
.about-strip h2{font-size:clamp(24px,4vw,38px);font-weight:300;line-height:1.6;margin-bottom:20px}.about-strip p,.intro-section p{max-width:780px;margin:0 auto;color:var(--text-muted);font-weight:300;line-height:2.4}
.data-table,.requirements-table,.summary-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--border)}
.data-table td,.requirements-table td,.summary-table td{padding:20px 22px;border-bottom:1px solid var(--border);vertical-align:top;color:var(--text-muted);font-size:14px}.data-table td:first-child,.requirements-table td:first-child,.summary-table td:first-child{width:150px;color:var(--text-main);font-weight:500;background:var(--gold-pale)}
.features-grid,.income-grid,.more-grid,.flow-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.feature-cell,.income-cell,.more-card,.flow-card,.sidebar-card{background:#fff;border:1px solid var(--border);padding:28px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.feature-num,.income-label{color:var(--gold);letter-spacing:.18em;font-size:12px;text-transform:uppercase}.feature-title{font-size:18px;margin:14px 0}.feature-desc,.income-desc{color:var(--text-muted);font-size:13px;line-height:2}.income-amount{font-size:34px;color:var(--text-main);margin:16px 0}.income-amount span{font-size:14px;color:var(--text-muted)}.income-cell.dark{background:var(--bg-dark);color:#fff}.income-cell.dark .income-desc{color:#cfc8bd}
.timeline{max-width:760px;margin:0 auto}.timeline-item{display:grid;grid-template-columns:120px 1fr;gap:22px;padding:24px 0;border-bottom:1px solid var(--border)}
.contact-body{padding:64px var(--pad)}.method-selector{display:flex;justify-content:center;gap:12px;margin:0 auto 40px;flex-wrap:wrap}.method-tab{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);background:#fff;padding:14px 22px;color:var(--text-muted);letter-spacing:.08em}.method-tab.active{background:var(--gold);border-color:var(--gold);color:#fff}.tab-icon{width:20px;height:20px}
.contact-panel{display:none}.contact-panel.active{display:block}.line-panel-grid,.form-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:28px;max-width:1040px;margin:0 auto}.line-card,.line-tips,.form-card,.form-sidebar{background:#fff;border:1px solid var(--border);padding:34px;box-shadow:0 2px 8px rgba(0,0,0,.05)}.card-badge{display:inline-block;color:var(--gold);font-size:10px;letter-spacing:.2em;margin-bottom:18px}.line-card h2,.form-card h2,.line-tips h3{font-size:30px;font-weight:300;margin-bottom:16px}.line-card p,.line-tips li,.tips-note{color:var(--text-muted);font-size:13px;line-height:2}.qr-box{width:190px;margin:24px auto;text-align:center}.qr-box img{aspect-ratio:1/1;object-fit:cover;border:1px solid var(--border);padding:8px;background:#fff}.qr-box span{display:block;margin-top:8px;color:var(--gold);font-size:10px;letter-spacing:.2em}.btn-line-lg,.alt-line-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--line-green);color:#fff;padding:14px 24px;margin:10px 0 18px}.tips-note{background:var(--gold-pale);padding:18px;margin-top:18px}
.form-group{margin-bottom:22px}.form-label{display:block;font-size:12px;color:var(--text-main);letter-spacing:.08em;margin-bottom:8px}.req{color:var(--gold);margin-left:4px}.form-input,.form-textarea,.form-select{width:100%;border:1px solid var(--border);background:#fff;padding:13px 14px;font-family:var(--sans);font-size:14px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.radio-group{display:flex;gap:12px;flex-wrap:wrap}.radio-label{font-size:13px;color:var(--text-muted);display:inline-flex;gap:6px;align-items:center}.form-privacy{font-size:12px;line-height:2;color:var(--text-muted);background:var(--gold-pale);padding:16px;margin-bottom:20px}.success-msg{display:none;text-align:center;padding:40px}.success-msg.show{display:block}.tel-number{font-size:28px;color:var(--gold)}
.checkbox-label{display:flex;align-items:flex-start;gap:10px;color:var(--text-muted);font-size:12px;line-height:1.8;margin:18px 0}.checkbox-label input{margin-top:6px}.btn-submit{width:100%;background:var(--gold);color:#fff;border:1px solid var(--gold);padding:16px 24px;font-size:12px;letter-spacing:.18em;transition:all .25s ease}.btn-submit:hover{background:var(--bg-dark);border-color:var(--bg-dark)}.success-icon{width:64px;height:64px;border-radius:50%;border:1px solid var(--gold);color:var(--gold);display:flex;align-items:center;justify-content:center;margin:0 auto 20px}.success-msg h3{font-size:26px;font-weight:300;margin-bottom:14px}.success-msg p{color:var(--text-muted);font-size:13px;line-height:2}.btn-back-top{display:inline-flex;margin-top:22px;color:var(--gold);border-bottom:1px solid var(--gold);font-size:12px;letter-spacing:.12em}.form-sidebar{display:flex;flex-direction:column;gap:18px}.sidebar-card h3{font-size:20px;font-weight:300;margin-bottom:12px}.tel-hours{color:var(--text-muted);font-size:12px;line-height:2}.sidebar-info-list li{color:var(--text-muted);font-size:12px;line-height:1.9;padding:8px 0;border-bottom:1px solid var(--border)}
.filter-bar{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding:34px var(--pad)}.filter-btn{border:1px solid var(--border);padding:10px 16px;background:#fff;color:var(--text-muted);font-size:12px;letter-spacing:.08em}.filter-btn.active{background:var(--gold);color:#fff;border-color:var(--gold)}.voices-grid{max-width:1040px;margin:0 auto;padding:24px var(--pad) 72px;display:grid;gap:28px}.voice-card{display:grid;grid-template-columns:240px 1fr;background:#fff;border:1px solid var(--border)}.voice-card.hidden{display:none}.voice-profile{background:var(--gold-pale);padding:28px;text-align:center}.profile-avatar{width:82px;height:82px;border-radius:50%;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;margin:0 auto 16px}.avatar-initial{font-size:42px;color:var(--gold)}.profile-tag{display:inline-block;border:1px solid var(--gold);color:var(--gold);font-size:10px;padding:2px 7px;margin:2px}.profile-detail,.voice-body p{color:var(--text-muted);font-size:13px;line-height:2}.voice-body{padding:34px}.voice-headline{font-size:26px;font-weight:300;line-height:1.6;margin:10px 0 24px}.interview-item{margin-bottom:22px}.interview-q{display:flex;gap:10px;color:var(--text-main);font-weight:500}.q-badge{color:var(--gold)}.pull-quote{border-left:2px solid var(--gold);padding-left:18px;margin-top:24px}
.cat-nav-list{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;padding:28px var(--pad)}.cat-nav-list a{display:block;padding:9px 13px;border:1px solid var(--border);background:#fff;color:var(--text-muted);font-size:12px}.cat-nav-list a.active{background:var(--gold);border-color:var(--gold);color:#fff}.qa-category{max-width:860px;margin:0 auto 44px;padding:0 var(--pad)}.qa-category h2{font-size:24px;font-weight:300;margin-bottom:18px}.acc-item{background:#fff;border:1px solid var(--border);margin-bottom:12px}.acc-trigger{width:100%;padding:18px 22px;text-align:left;color:var(--text-main);display:flex;justify-content:space-between;gap:14px}.acc-body{display:none;padding:0 22px 20px;color:var(--text-muted);font-size:14px;line-height:2.2}.acc-body.open{display:block}
.step-bar{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:24px var(--pad);background:#fff;border-bottom:1px solid var(--border)}.step-bar-item{border:1px solid var(--border);padding:10px 14px;font-size:12px;color:var(--text-muted);background:var(--gold-pale)}.flow-step{max-width:940px;margin:0 auto;padding:54px var(--pad);border-bottom:1px solid var(--border)}.flow-step h2{font-size:26px;font-weight:300;margin-bottom:18px}.check-list li{display:flex;gap:10px;margin:10px 0;color:var(--text-muted)}.ck{width:18px;height:18px;border:1px solid var(--border);display:inline-flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0}
.step-bar-inner{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;max-width:1120px;margin:0 auto}.step-bar-item{display:flex;align-items:center;gap:8px;min-height:58px;text-align:left}.step-bar-num{color:var(--gold);font-size:18px}.step-bar-label{font-size:11px;line-height:1.5}.step-bar-arrow{color:var(--gold);opacity:.55}.flow-body{max-width:1040px;margin:0 auto;padding:72px var(--pad)}.step-block{display:grid;grid-template-columns:120px minmax(0,1fr);gap:34px;align-items:start}.step-left{display:flex;justify-content:center}.step-circle{width:86px;height:86px;border:1px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff;position:sticky;top:calc(var(--nav-h) + 28px)}.s-num{font-size:42px;color:var(--gold);font-weight:300}.step-tag,.type-tag{display:inline-block;color:var(--gold);font-size:10px;letter-spacing:.24em;text-transform:uppercase;margin-bottom:12px}.step-title{font-size:clamp(28px,4vw,44px);font-weight:300;line-height:1.45;margin-bottom:18px;color:var(--text-main)}.step-lead{color:var(--text-muted);font-size:14px;line-height:2.3;margin-bottom:28px}.step-two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}.step-card,.simulation-box{background:#fff;border:1px solid var(--border);padding:26px;box-shadow:0 1px 3px rgba(0,0,0,.05)}.step-card h4,.simulation-box h4{font-size:15px;color:var(--text-main);letter-spacing:.08em;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--border)}.step-list li{color:var(--text-muted);font-size:13px;line-height:2;margin:8px 0;list-style:disc;margin-left:1.1em}.step-note{margin-top:18px;background:var(--gold-pale);border-left:2px solid var(--gold);padding:18px 20px;color:var(--text-muted);font-size:13px;line-height:2}.step-spacer{height:56px}.sim-flow{display:grid;gap:12px}.sim-item{display:flex;gap:14px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--border)}.sim-num{width:28px;height:28px;border-radius:50%;background:var(--gold);color:#fff;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.sim-text{color:var(--text-muted);font-size:13px;line-height:1.9}.summary-section{background:var(--bg-sub);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:72px var(--pad)}.summary-inner{max-width:860px;margin:0 auto}

/* support.html specific */
.badge-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 auto 36px}.badge{border:1px solid var(--gold);color:var(--gold-dim);background:#fff;padding:9px 13px;font-size:12px;letter-spacing:.08em}.req-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--border)}.req-table td{padding:20px 22px;border-bottom:1px solid var(--border);vertical-align:top;color:var(--text-muted);font-size:14px;line-height:2}.req-table td:first-child{width:150px;background:var(--gold-pale);color:var(--text-main);font-weight:500;letter-spacing:.14em}.req-table ul{margin-top:8px}.req-table li{list-style:disc;margin-left:1.2em}.tag-inline{display:inline-block;margin-left:10px;border:1px solid var(--gold);color:var(--gold);font-size:10px;padding:2px 8px;letter-spacing:.12em}.type-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-bottom:34px}.type-nav-item{border:1px solid var(--border);background:#fff;color:var(--text-muted);padding:12px 16px;font-size:12px;letter-spacing:.08em;display:inline-flex;align-items:center;gap:8px}.type-nav-item.active{background:var(--gold);border-color:var(--gold);color:#fff}.t-num{font-size:16px}.type-panel{display:none;background:#fff;border:1px solid var(--border);padding:38px}.type-panel.active{display:block}.type-header{margin-bottom:30px}.type-title{font-size:clamp(26px,4vw,40px);font-weight:300;line-height:1.5;margin-bottom:18px}.type-lead{color:var(--text-muted);font-size:14px;line-height:2.25}.type-body{display:grid;grid-template-columns:1fr 1fr;gap:28px}.type-section{background:var(--gold-pale);padding:26px}.type-section h3{font-size:20px;font-weight:300;margin-bottom:16px;color:var(--text-main)}.points-list li{color:var(--text-muted);font-size:13px;line-height:2;margin:8px 0;list-style:disc;margin-left:1.2em}.quote-block{border-left:2px solid var(--gold);padding-left:18px;color:var(--gold-dim);font-size:15px;line-height:2}.schedule-table{width:100%;border-collapse:collapse;background:#fff}.schedule-table th,.schedule-table td{border:1px solid var(--border);padding:10px 12px;font-size:12px;text-align:left;color:var(--text-muted)}.schedule-table th{background:var(--gold-pale);color:var(--text-main)}.schedule-table .work{color:#8b8178}.schedule-table .part{color:var(--gold-dim);font-weight:500}

@media (min-width: 640px){.sm\:flex-row{flex-direction:row}}
@media (min-width: 768px){.md\:flex{display:flex}.md\:block{display:block}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:flex-row-reverse{flex-direction:row-reverse}.md\:items-center{align-items:center}.md\:items-start{align-items:flex-start}.md\:w-1\/2{width:50%}.md\:w-1\/4{width:25%}.md\:w-3\/4{width:75%}.md\:pl-10{padding-left:2.5rem}.md\:pr-10{padding-right:2.5rem}.md\:p-14{padding:3.5rem}.md\:px-12{padding-left:3rem;padding-right:3rem}.md\:py-36{padding-top:9rem;padding-bottom:9rem}.md\:mb-0{margin-bottom:0}.md\:text-base{font-size:16px}.md\:text-2xl{font-size:24px}.md\:text-3xl{font-size:30px}.md\:text-8xl{font-size:88px}}
@media (min-width: 1024px){.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width: 860px){.features-grid,.income-grid,.more-grid,.flow-cards,.line-panel-grid,.form-layout,.step-two-col,.type-body{grid-template-columns:1fr}.step-block{grid-template-columns:1fr;gap:18px}.step-left{justify-content:flex-start}.step-circle{position:static;width:64px;height:64px}.s-num{font-size:32px}.step-bar-arrow{display:none}.step-bar-item{flex:1 1 150px}.voice-card{grid-template-columns:1fr}.timeline-item{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.data-table td,.requirements-table td,.summary-table td,.req-table td{display:block;width:100%!important}.type-panel{padding:24px}.text-6xl{font-size:42px}.md\:text-8xl{font-size:48px}.tracking-\[0\.5em\]{letter-spacing:.22em}}

/* ══════════════════════════════════════════
   2026 Recruit Refresh
   top.html と下層ページの見た目を揃えるための上書き
═══════════════════════════════════════════ */
:root {
  --gold: #ad8a54;
  --gold-dim: #84683d;
  --gold-pale: #f4eee5;
  --gold-border: #ded5ca;
  --border: #ded5ca;
  --bg-main: #f8f5ef;
  --bg-sub: #eee8df;
  --bg-dark: #181512;
  --text-main: #292522;
  --text-muted: #746d66;
}

body {
  background:
    radial-gradient(circle at 10% 0%, rgba(173,138,84,.11), transparent 28%),
    var(--bg-main);
  color: var(--text-main);
}

.site-nav {
  height: 62px;
  background: rgba(248,245,239,.92);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(173,138,84,.22);
  box-shadow: none;
}

.nav-logo {
  color: var(--text-main);
  font-family: Didot, "Bodoni 72", "Times New Roman", serif;
  letter-spacing: .18em;
}

.nav-logo::after {
  content: " RECRUIT";
  color: var(--gold);
  font-size: .72em;
  letter-spacing: .16em;
}

.nav-links {
  gap: clamp(8px, 1.15vw, 18px);
}

.nav-links a,
.nav-back,
.mobile-nav a {
  letter-spacing: .08em;
}

.nav-links a {
  font-size: 10px;
}

.nav-back {
  font-size: 10px;
}

.nav-back {
  color: var(--gold);
  border-bottom-color: rgba(173,138,84,.45);
}

.page-header {
  padding: 92px var(--pad) 46px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.46), rgba(238,232,223,.92)),
    var(--gold-pale);
}

.page-header h1 {
  color: var(--text-main);
  font-family: Didot, "Bodoni 72", "Times New Roman", serif;
  letter-spacing: .1em;
}

.page-header p:not(.eyebrow) {
  line-height: 1.9;
}

.section,
.section-alt,
.about-strip,
.intro-section,
.contact-body,
.flow-body,
.summary-section {
  background: transparent;
}

.section-alt,
.summary-section {
  background: var(--bg-sub);
}

.section-title,
.qa-category h2,
.line-card h2,
.form-card h2,
.voice-headline,
.step-title,
.type-title {
  color: var(--text-main);
}

.btn,
.btn-gold,
.btn-outline,
.btn-dark,
.btn-line,
.method-tab,
.filter-btn,
.type-nav-item,
.step-bar-item,
.nav-cta {
  border-radius: 0;
}

.btn-gold,
.nav-cta,
.method-tab.active,
.filter-btn.active,
.type-nav-item.active {
  background: var(--gold);
  border-color: var(--gold);
  color: #fff;
}

.btn-gold:hover,
.nav-cta:hover {
  background: var(--bg-dark);
  border-color: var(--bg-dark);
  color: #fff;
}

.btn-outline,
.btn-dark:hover {
  background: rgba(255,255,255,.35);
}

.req-table,
.data-table,
.requirements-table,
.summary-table,
.feature-cell,
.income-cell,
.more-card,
.flow-card,
.sidebar-card,
.line-card,
.line-tips,
.form-card,
.form-sidebar,
.step-card,
.simulation-box,
.type-panel,
.voice-card,
.acc-item {
  background: #fffdfa;
  border-color: var(--border);
  box-shadow: 0 12px 44px rgba(43,34,24,.055);
}

.req-table td:first-child,
.data-table td:first-child,
.requirements-table td:first-child,
.summary-table td:first-child,
.type-section,
.voice-profile,
.step-bar,
.mobile-nav,
.form-privacy,
.tips-note {
  background: var(--gold-pale);
}

.badge,
.tag,
.tag-inline {
  background: #fffdfa;
  border-color: rgba(173,138,84,.42);
  color: var(--gold-dim);
}

.site-footer,
.cta-banner {
  background: var(--bg-dark);
  border-top-color: rgba(255,255,255,.08);
}

.footer-logo {
  color: #d8d2ca;
  font-family: Didot, "Bodoni 72", "Times New Roman", serif;
}

.recruit-mobile-cta {
  display: none;
}

.link-intro {
  background: #fff;
  border: 1px solid var(--border);
  padding: clamp(26px, 4vw, 46px);
  box-shadow: 0 18px 42px rgba(70,55,38,.08);
}

.link-intro p {
  margin-bottom: 24px;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 2;
  letter-spacing: .08em;
}

.link-intro dl {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 12px 18px;
  padding-top: 22px;
  border-top: 1px solid var(--border);
  font-size: 13px;
}

.link-intro dt {
  color: var(--gold);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.link-intro dd {
  color: var(--text-main);
  letter-spacing: .06em;
}

.own-banner-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-top: 24px;
}

.own-banner-item {
  min-height: 132px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 22px;
  background: #fff;
  border: 1px solid var(--border);
  box-shadow: 0 12px 30px rgba(70,55,38,.06);
}

.own-banner-item img,
.link-banner-grid img {
  width: auto;
  height: auto;
  max-width: 100%;
}

.own-banner-item span {
  color: var(--gold);
  font-size: 10px;
  letter-spacing: .18em;
}

.section-head-center {
  margin-bottom: 34px;
  text-align: center;
}

.section-head-center .section-title {
  margin-bottom: 0;
}

.link-banner-grid {
  display: grid;
  gap: 16px;
  align-items: center;
  justify-items: center;
  margin-top: 28px;
}

.link-banner-grid a {
  width: 100%;
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--border);
  box-shadow: 0 10px 24px rgba(70,55,38,.05);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.link-banner-grid a:hover {
  transform: translateY(-2px);
  border-color: var(--gold);
  box-shadow: 0 16px 34px rgba(70,55,38,.10);
}

.link-banner-grid-small {
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
}

.link-banner-grid-medium {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-top: 42px;
}

.link-banner-grid-large {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr));
  margin-top: 24px;
}

.link-banner-grid-large a {
  min-height: 92px;
}

@media (max-width: 860px) {
  body {
    padding-bottom: 58px;
  }

  .site-nav {
    height: 56px;
  }

  .page-header {
    padding: 82px 20px 38px;
  }

  .page-header h1 {
    font-size: clamp(28px, 8vw, 42px);
  }

  .section,
  .section-alt,
  .contact-body,
  .flow-body {
    padding-left: 20px;
    padding-right: 20px;
  }

  .recruit-mobile-cta {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 500;
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: rgba(16,14,12,.96);
    border-top: 1px solid rgba(255,255,255,.12);
  }

  .recruit-mobile-cta a {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 12px;
    letter-spacing: .14em;
  }

  .recruit-mobile-cta a:first-child {
    background: var(--line-green);
  }

  .link-intro dl {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .own-banner-grid {
    grid-template-columns: 1fr 1fr;
  }

  .link-banner-grid a {
    min-height: 62px;
    padding: 12px;
  }
}

@media (max-width: 520px) {
  .own-banner-grid {
    grid-template-columns: 1fr;
  }
}
