*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg:#F7F6F2; --bg2:#FFFFFF; --text:#1C1C1E; --text2:#5F5F66; --border:#E5E4DF;
  --blue:#2D7DD2; --blue-l:#E8F2FC; --blue-d:#1A5FA8;
  --orange:#E8740C; --orange-l:#FFF1E3;
  --yellow:#E0A800; --yellow-l:#FEF7DC;
  --green:#2E9E5B; --green-l:#E6F6EC;
  --red:#D9453A; --red-l:#FCECEA;
  --radius:18px; --radius-sm:11px;
  --shadow:0 2px 18px rgba(0,0,0,0.07);
}
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { font-family:"Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,sans-serif; background:var(--bg); color:var(--text); line-height:1.9; overflow-x:hidden; }
img { max-width:100%; height:auto; display:block; }
a { color:var(--blue); }
.skip { position:absolute; left:-9999px; }
.skip:focus { left:1rem; top:1rem; z-index:300; background:#fff; padding:.5rem 1rem; border-radius:8px; }

/* TOP BAR */
.topbar { background:var(--blue-l); border-bottom:1px solid rgba(45,125,210,.15); font-size:.8rem; color:var(--text2); }
.topbar-inner { max-width:1100px; margin:0 auto; padding:.45rem clamp(1rem,4vw,2rem); display:flex; flex-wrap:wrap; gap:.25rem 1.5rem; justify-content:space-between; }
.topbar a { color:var(--blue-d); font-weight:700; text-decoration:none; }

/* HEADER / NAV */
.site-header { position:sticky; top:0; z-index:200; background:rgba(255,255,255,.95); backdrop-filter:blur(14px); border-bottom:1px solid var(--border); }
.header-inner { max-width:1100px; margin:0 auto; padding:0 clamp(1rem,4vw,2rem); height:66px; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.logo { text-decoration:none; color:var(--text); display:flex; flex-direction:column; line-height:1.25; }
.logo-en { font-size:.68rem; font-weight:700; letter-spacing:.14em; color:var(--orange); }
.logo-ja { font-size:1.15rem; font-weight:800; letter-spacing:.02em; }
.logo-ja span { color:var(--blue); }
.nav-links { display:flex; gap:.2rem; list-style:none; }
.nav-links a { display:block; padding:.45rem .7rem; border-radius:100px; font-size:.86rem; font-weight:600; color:var(--text2); text-decoration:none; transition:background .2s,color .2s; white-space:nowrap; }
.nav-links a:hover { background:var(--blue-l); color:var(--blue); }
.nav-links a[aria-current="page"] { background:var(--blue); color:#fff; }
.nav-toggle { display:none; background:none; border:1.5px solid var(--border); border-radius:10px; width:44px; height:44px; cursor:pointer; align-items:center; justify-content:center; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after { display:block; width:20px; height:2px; background:var(--text); border-radius:2px; position:relative; transition:transform .2s; }
.nav-toggle span::before, .nav-toggle span::after { content:""; position:absolute; left:0; }
.nav-toggle span::before { top:-6px; }
.nav-toggle span::after { top:6px; }
@media(max-width:900px){
  .nav-toggle { display:flex; }
  .site-nav { position:absolute; top:66px; left:0; right:0; background:#fff; border-bottom:1px solid var(--border); box-shadow:0 12px 24px rgba(0,0,0,.06); display:none; }
  .site-nav.open { display:block; }
  .nav-links { flex-direction:column; padding:.5rem 1rem 1rem; gap:.15rem; }
  .nav-links a { padding:.75rem 1rem; border-radius:12px; font-size:.95rem; }
}

/* PAGE HERO */
.page-hero { background:linear-gradient(150deg,#EAF3FF 0%,#FFFFFF 50%,#FFF3E6 100%); padding:3.2rem clamp(1rem,4vw,2rem) 2.6rem; border-bottom:1px solid var(--border); }
.page-hero .wrap { max-width:1100px; margin:0 auto; }
.eyebrow { display:inline-block; background:var(--orange-l); color:var(--orange); border:1px solid rgba(232,116,12,.25); padding:.2rem .85rem; border-radius:100px; font-size:.74rem; font-weight:700; letter-spacing:.08em; margin-bottom:.8rem; }
.page-hero h1 { font-size:clamp(1.6rem,4vw,2.3rem); font-weight:800; line-height:1.35; letter-spacing:.01em; }
.page-hero p { color:var(--text2); margin-top:.5rem; font-size:.95rem; }

.home-hero { padding:4.5rem clamp(1rem,4vw,2rem) 4rem; }
.home-hero h1 { font-size:clamp(1.7rem,4.6vw,2.8rem); }
.home-hero h1 .c1 { color:var(--blue); }
.home-hero h1 .c2 { color:var(--orange); }
.hero-btns { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.8rem; }

/* BUTTONS */
.btn { display:inline-flex; align-items:center; gap:.4rem; padding:.8rem 1.6rem; border-radius:100px; font-weight:700; font-size:.92rem; text-decoration:none; transition:transform .2s,box-shadow .2s; }
.btn:hover { transform:translateY(-2px); }
.btn-blue { background:var(--blue); color:#fff; box-shadow:0 4px 14px rgba(45,125,210,.3); }
.btn-orange { background:var(--orange); color:#fff; box-shadow:0 4px 14px rgba(232,116,12,.3); }
.btn-outline { background:#fff; color:var(--text); border:1.5px solid var(--border); }

/* MAIN LAYOUT */
main { display:block; }
.section { padding:3rem clamp(1rem,4vw,2rem); }
.section.alt { background:#fff; }
.wrap { max-width:1100px; margin:0 auto; }
.narrow { max-width:820px; margin:0 auto; }
h2.sec-title { font-size:clamp(1.3rem,3vw,1.7rem); font-weight:800; margin-bottom:1.2rem; display:flex; align-items:center; gap:.6rem; }
h2.sec-title::before { content:""; width:6px; height:1.3em; border-radius:4px; background:var(--blue); flex-shrink:0; }
h2.sec-title.orange::before { background:var(--orange); }
h2.sec-title.green::before { background:var(--green); }
h2.sec-title.red::before { background:var(--red); }
h2.sec-title.yellow::before { background:var(--yellow); }
h3 { font-size:1.08rem; font-weight:800; margin-bottom:.5rem; }
p + p { margin-top:.9rem; }

.card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:clamp(1.2rem,3vw,1.8rem); box-shadow:var(--shadow); }
.card + .card { margin-top:1.1rem; }
.card.accent { position:relative; overflow:hidden; }
.card.accent::before { content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--blue); }
.card.accent.orange::before { background:var(--orange); }
.card.accent.green::before { background:var(--green); }
.card.accent.red::before { background:var(--red); }
.card.accent.yellow::before { background:var(--yellow); }
.lead { font-size:1.02rem; }
.muted { color:var(--text2); }
.small { font-size:.86rem; }

.notice { border-radius:var(--radius-sm); padding:1rem 1.2rem; font-size:.94rem; }
.notice.yellow { background:var(--yellow-l); border:1px solid rgba(224,168,0,.35); }
.notice.green { background:var(--green-l); border:1px solid rgba(46,158,91,.3); }
.notice.red { background:var(--red-l); border:1px solid rgba(217,69,58,.3); }
.notice.blue { background:var(--blue-l); border:1px solid rgba(45,125,210,.25); }

.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
@media(max-width:760px){ .grid-2, .grid-3 { grid-template-columns:1fr; } }

/* HOME FEATURE CARDS */
.feat { text-decoration:none; color:inherit; display:block; transition:transform .2s,box-shadow .2s; }
.feat:hover { transform:translateY(-4px); box-shadow:0 8px 28px rgba(0,0,0,.1); }
.feat-icon { width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin-bottom:.8rem; }
.bg-blue { background:var(--blue-l); } .bg-orange { background:var(--orange-l); } .bg-green { background:var(--green-l); }
.bg-yellow { background:var(--yellow-l); } .bg-red { background:var(--red-l); }
.feat p { font-size:.88rem; color:var(--text2); line-height:1.8; }

/* NEWS LIST */
.news-list { list-style:none; }
.news-list li { border-bottom:1px solid var(--border); }
.news-list li:last-child { border-bottom:none; }
.news-list a { display:flex; flex-wrap:wrap; gap:.3rem 1rem; padding:.9rem .2rem; text-decoration:none; color:var(--text); }
.news-list a:hover .news-title { color:var(--blue); text-decoration:underline; }
.news-tag { font-size:.72rem; font-weight:700; padding:.12rem .7rem; border-radius:100px; background:var(--red-l); color:var(--red); align-self:center; }
.news-title { font-weight:600; }

/* LISTS */
.dot-list { list-style:none; }
.dot-list li { position:relative; padding-left:1.3rem; }
.dot-list li + li { margin-top:.35rem; }
.dot-list li::before { content:""; position:absolute; left:.2rem; top:.75em; width:8px; height:8px; border-radius:50%; background:var(--blue); }
.num-list { list-style:none; counter-reset:n; }
.num-list > li { counter-increment:n; position:relative; padding-left:2.6rem; }
.num-list > li + li { margin-top:1.2rem; }
.num-list > li::before { content:counter(n); position:absolute; left:0; top:.1rem; width:1.9rem; height:1.9rem; border-radius:50%; background:var(--blue); color:#fff; font-weight:800; font-size:.9rem; display:flex; align-items:center; justify-content:center; }

/* STEPS */
.steps { list-style:none; display:grid; gap:.9rem; }
.step { background:#fff; border:1px solid var(--border); border-radius:var(--radius-sm); padding:1rem 1.2rem; display:grid; grid-template-columns:auto 1fr; gap:.2rem 1rem; }
.step-no { grid-row:span 2; width:2.2rem; height:2.2rem; border-radius:50%; background:var(--orange); color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center; }
.step-title { font-weight:800; }
.step-body { color:var(--text2); font-size:.92rem; }

/* FAQ */
.faq details { background:#fff; border:1px solid var(--border); border-radius:var(--radius-sm); }
.faq details + details { margin-top:.8rem; }
.faq summary { cursor:pointer; padding:1rem 1.2rem; font-weight:800; list-style:none; display:flex; gap:.7rem; align-items:flex-start; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::before { content:"Q"; flex-shrink:0; width:1.7rem; height:1.7rem; border-radius:50%; background:var(--blue); color:#fff; font-size:.85rem; display:flex; align-items:center; justify-content:center; margin-top:.15rem; }
.faq summary::after { content:"＋"; margin-left:auto; color:var(--text2); }
.faq details[open] summary::after { content:"－"; }
.faq .answer { padding:0 1.2rem 1.2rem 3.6rem; color:var(--text); }

/* TABLE */
.table-wrap { overflow-x:auto; }
table.hours { width:100%; border-collapse:separate; border-spacing:0; background:#fff; border:1px solid var(--border); border-radius:var(--radius-sm); overflow:hidden; }
table.hours th, table.hours td { padding:.85rem 1rem; border-bottom:1px solid var(--border); text-align:left; }
table.hours tr:last-child th, table.hours tr:last-child td { border-bottom:none; }
table.hours th { background:var(--blue-l); color:var(--blue-d); width:40%; font-weight:700; }
table.hours td.closed { color:var(--red); font-weight:700; }
table.hours td.special { color:var(--orange); font-weight:700; }

/* CONTACT BOX */
.contact-box { display:grid; gap:.6rem; }
.contact-row { display:flex; flex-wrap:wrap; gap:.2rem 1rem; padding:.7rem 0; border-bottom:1px dashed var(--border); }
.contact-row:last-child { border-bottom:none; }
.contact-label { font-weight:700; color:var(--blue-d); min-width:8em; }
.tel-big { font-size:1.5rem; font-weight:800; color:var(--orange); text-decoration:none; letter-spacing:.03em; }

/* PROFILE */
.profile { display:grid; grid-template-columns:200px 1fr; gap:2rem; align-items:start; }
.profile-photo { border-radius:14px; border:3px solid #fff; box-shadow:var(--shadow); width:200px; }
.profile-name { margin-top:.8rem; font-weight:800; }
.profile-role { font-size:.82rem; color:var(--text2); line-height:1.6; }
@media(max-width:700px){ .profile { grid-template-columns:1fr; } .profile-side { display:flex; gap:1rem; align-items:center; } .profile-photo { width:120px; } }
.career { list-style:none; }
.career li { display:grid; grid-template-columns:9.5em 1fr; gap:.8rem; padding:.55rem 0; border-bottom:1px solid var(--border); font-size:.93rem; }
.career li:last-child { border-bottom:none; }
.career .when { color:var(--blue-d); font-weight:700; }
@media(max-width:520px){ .career li { grid-template-columns:1fr; gap:0; } }
.tags { display:flex; flex-wrap:wrap; gap:.5rem; }
.tag { display:inline-block; padding:.3rem .85rem; border-radius:100px; font-size:.84rem; font-weight:600; border:1.5px solid; }
.tag.blue { background:var(--blue-l); color:var(--blue-d); border-color:rgba(45,125,210,.25); }
.tag.green { background:var(--green-l); color:var(--green); border-color:rgba(46,158,91,.25); }
.tag.orange { background:var(--orange-l); color:var(--orange); border-color:rgba(232,116,12,.25); }

.photo { border-radius:var(--radius-sm); border:1px solid var(--border); background:#fff; }
.map-img { border-radius:var(--radius); border:1px solid var(--border); background:#fff; max-width:560px; width:100%; margin:0 auto; }
.map-embed { display:block; aspect-ratio:1 / 1; height:auto; }
.map-legend { max-width:560px; margin:.6rem auto 0; font-size:.9rem; text-align:center; }

/* ANNOUNCEMENT */
.letter { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:clamp(1.3rem,4vw,2.6rem); box-shadow:var(--shadow); }
.letter-head { display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; margin-bottom:1.6rem; }
.letter-from { text-align:right; }
.letter h2 { font-size:clamp(1.15rem,3vw,1.45rem); font-weight:800; text-align:center; margin:1.2rem 0 1.6rem; line-height:1.6; }
.letter h3 { margin-top:1.6rem; padding-bottom:.3rem; border-bottom:2px solid var(--blue-l); }
.letter .end { text-align:right; margin-top:1.4rem; }
.placeholder { background:var(--yellow-l); border-bottom:2px solid var(--yellow); padding:0 .2rem; }

/* FOOTER */
.site-footer { background:#fff; border-top:4px solid var(--orange); margin-top:2rem; }
.footer-inner { max-width:1100px; margin:0 auto; padding:2.4rem clamp(1rem,4vw,2rem) 1.6rem; display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:2rem; }
.footer-name { font-weight:800; font-size:1.05rem; margin-bottom:.5rem; }
.footer-name small { display:block; font-size:.68rem; color:var(--orange); letter-spacing:.14em; }
.footer-addr { font-size:.88rem; color:var(--text2); line-height:1.85; font-style:normal; }
.footer-addr a { color:var(--blue-d); }
.footer-title { font-size:.8rem; font-weight:800; color:var(--blue-d); letter-spacing:.06em; margin-bottom:.6rem; }
.footer-links { list-style:none; font-size:.88rem; }
.footer-links li + li { margin-top:.3rem; }
.footer-links a { color:var(--text2); text-decoration:none; }
.footer-links a:hover { color:var(--blue); }
.banners { display:flex; flex-direction:column; gap:.7rem; }
.banners img { width:240px; max-width:100%; border-radius:6px; border:1px solid var(--border); }
.copyright { text-align:center; font-size:.76rem; color:var(--text2); padding:1rem; border-top:1px solid var(--border); }
@media(max-width:760px){ .footer-inner { grid-template-columns:1fr; gap:1.5rem; } }
a[href^="tel:"] { white-space:nowrap; }
