/* Shared foundations and components. Page-specific layout belongs in index.css. */
:root { --red:#d0252f; --ink:#333; --muted:#d7d7d7; --surface:#f3f3f4; --content:1120px; --header:100px; }
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; color:var(--ink); font-family:"Noto Sans JP",sans-serif; font-size:16px; font-weight:500; line-height:1.7; overflow-wrap:anywhere; }
h1,h2,h3,p,ul { margin:0; }
ul { padding:0; list-style:none; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; height:auto; }
button { font:inherit; cursor:pointer; }
button,a { -webkit-tap-highlight-color:transparent; }
button { color:inherit; }
a:focus-visible,button:focus-visible { outline:3px solid #327da8; outline-offset:5px; }
[hidden] { display:none !important; }
.container { width:min(var(--content),calc(100% - 80px)); margin-inline:auto; }
.skip-link { position:fixed; top:10px; left:10px; z-index:200; padding:10px 20px; background:#fff; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.button { position:relative; display:flex; justify-content:center; align-items:center; min-height:60px; padding:12px 32px; border:0; border-radius:8px; background:var(--red); color:#fff; font-size:16px; font-weight:700; line-height:1.5; text-align:center; transition:background .2s,box-shadow .2s; }
.button:hover { background:#b51f29; box-shadow:0 5px 15px #00000016; }
.arrow { position:absolute; right:18px; top:50%; width:14px; aspect-ratio:33/19; transform:translateY(-50%); background:url("../img/common/icon05.png") center/contain no-repeat; }
.button--more { width:140px; min-height:44px; padding:8px 32px 8px 18px; font-size:14px; margin-inline:auto; }
.section-heading { position:relative; }
.section-heading__en { display:block; border-bottom:1px solid #ddd; color:var(--muted); font-size:80px; font-weight:500; line-height:1.08; letter-spacing:-2px; }
.section-heading__ja { display:block; padding-top:16px; color:var(--red); font-size:20px; font-weight:700; line-height:1.7; }
.section-heading__art { position:absolute; right:-80px; top:-70px; pointer-events:none; }
.section-heading__art--about { width:186px; }
.section-heading__art--service { width:230px; top:-50px; }
.section-heading__art--news { width:219px; top:-85px; }
.bar-heading { border-left:6px solid var(--red); padding-left:12px; font-size:20px; font-weight:700; line-height:1.5; }
.site-header { position:sticky; top:0; z-index:50; height:var(--header); border-top:5px solid var(--red); display:flex; align-items:center; justify-content:space-between; background:#fff; transition:height .25s,box-shadow .25s; }
.site-header.is-compact { height:72px; box-shadow:0 2px 15px #0000000d; }
.site-header__logo { width:210px; flex-shrink:0; margin-left:40px; transition:width .25s; }
.site-header.is-compact .site-header__logo { width:185px; }
.desktop-nav { align-self:stretch; display:flex; align-items:stretch; gap:30px; font-size:16px; font-weight:700; }
.desktop-nav>a,.desktop-nav__services>a { display:flex; align-items:center; white-space:nowrap; position:relative; }
.desktop-nav a[aria-current="page"] { color:var(--red); }
.desktop-nav a[aria-current="page"]::after { content:""; position:absolute; top:calc(50% + .85em + 4px); width:100%; height:2px; background:var(--red); }
.desktop-nav a:hover { color:var(--red); }
.desktop-nav .desktop-nav__recruit,.desktop-nav .desktop-nav__contact { padding-inline:26px; gap:8px; color:white; }
.desktop-nav__recruit { background:#333; margin-left:10px; }
.desktop-nav .desktop-nav__contact { background:var(--red); margin-left:-30px; }
.desktop-nav .desktop-nav__contact:hover,.desktop-nav .desktop-nav__contact:focus-visible { color:#fff; background:#b51f29; box-shadow:0 5px 15px #00000016; }
.desktop-nav__contact { transition:background .2s,box-shadow .2s; }
.desktop-nav__recruit img { width:14px; }
.desktop-nav__contact img { width:18px; }
.desktop-nav__services { position:relative; display:flex; align-items:stretch; }
.desktop-nav__toggle { width:20px; margin-right:-20px; border:0; background:transparent; }
.desktop-nav__toggle:focus-visible::after { content:"⌄"; }
.desktop-nav__submenu { position:absolute; top:100%; left:-24px; width:260px; background:#fff; box-shadow:0 15px 30px #0002; opacity:0; visibility:hidden; transform:translateY(8px); transition:.2s; }
.desktop-nav__submenu a { display:block; padding:15px 24px; border-bottom:1px solid #eee; font-size:15px; }
.desktop-nav__services:hover .desktop-nav__submenu,.desktop-nav__services:focus-within .desktop-nav__submenu,.desktop-nav__services.is-open .desktop-nav__submenu { opacity:1; visibility:visible; transform:none; }
.desktop-nav__services.is-dismissed .desktop-nav__submenu { opacity:0; visibility:hidden; }
.menu-toggle { display:none; }
.mobile-menu { display:none; }
.contact { position:relative; padding:64px 0 68px; background:#333; color:#fff; }
.contact__grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; }
.contact .section-heading__en { font-size:80px; color:#666; border-color:#555; }
.contact .section-heading__ja { font-size:18px; padding-top:12px; }
.contact__lead { margin-top:18px; font-size:14px; font-weight:700; }
.contact__lead a { border-bottom:1px solid #fff; padding-bottom:3px; }
.contact__hours { display:flex; align-items:center; gap:12px; font-size:20px; font-weight:700; margin-top:35px; }
.contact__hours img,.contact__numbers img { width:26px; }
.contact__numbers { display:flex; align-items:center; gap:30px; margin-top:8px; white-space:nowrap; font-weight:700; }
.contact__numbers>a { display:flex; align-items:center; gap:12px; font-size:24px; }
.contact__numbers>span { font-size:16px; }
.contact__button { width:320px; margin:55px auto 0; }
.contact__calendar .bar-heading { font-size:20px; margin:5px 0 0; }
.contact__calendar iframe { width:100%; border:0; display:block; }
.back-to-top { position:absolute; bottom:0; right:0; display:grid; place-items:center; width:80px; height:80px; background:#000; }
.back-to-top::before { content:""; width:24px; height:24px; border-top:2px solid #fff; border-left:2px solid #fff; transform:translateY(6px) rotate(45deg); }
.footer-main { background:#000; color:#fff; padding:40px 0 44px; }
.footer-main__grid { display:grid; grid-template-columns:1fr 1fr; }
.footer-nav { display:grid; grid-template-columns:1fr 1fr; padding-top:18px; padding-right:45px; border-right:1px solid #555; font-size:14px; font-weight:700; line-height:2.25; }
.footer-nav__group ul { padding-left:22px; }
.footer-nav__group ul a::before { content:"・"; }
.footer-nav a:hover,.footer-company a:hover { opacity:.7; }
.footer-company { padding:20px 0 20px 46px; }
.footer-company__logo { width:427px; }
.footer-company address { font-style:normal; font-size:14px; font-weight:700; line-height:1.85; margin-top:24px; }
.related-banners { display:grid; grid-template-columns:repeat(2,minmax(0,220px)); gap:20px 30px; margin-top:32px; }
.related-banners img { width:100%; }
.copyright { min-height:40px; background:var(--red); color:#fff; display:flex; justify-content:center; align-items:center; text-align:center; padding:8px 15px; }
.copyright small { font-size:12px; font-weight:500; }
.reveal.is-pending { opacity:0; transform:translateY(24px); }
.reveal { transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1),background-color .2s,box-shadow .2s; }
@media (min-width:768px) and (max-width:1250px) {
 .desktop-nav { gap:18px; font-size:13px; }
 .site-header__logo { width:180px; margin-left:22px; }
 .desktop-nav .desktop-nav__recruit,.desktop-nav .desktop-nav__contact { padding-inline:15px; }
 .desktop-nav .desktop-nav__contact { margin-left:-18px; }
 .section-heading__art { right:-20px; }
 .contact__grid { gap:35px; }
 .contact__numbers { gap:16px; flex-wrap:wrap; }
}
@media (max-width:1050px) {
 .desktop-nav { display:none; }
 .menu-toggle { display:flex; flex-direction:column; justify-content:center; align-items:center; align-self:stretch; width:100px; padding:20px; border:0; background:var(--red); color:#fff; gap:12px; z-index:101; }
 .menu-toggle__lines { display:block; flex-shrink:0; position:relative; width:100%; height:26px; border-block:1px solid white; }
 .menu-toggle__lines::before { content:""; position:absolute; width:100%; height:1px; left:0; top:50%; background:#fff; }
 .menu-toggle__label { font-size:18px; line-height:1; }
 .site-header.is-compact .menu-toggle { padding:10px 20px; gap:8px; }
 .site-header.is-compact .menu-toggle__lines { height:22px; }
 .site-header.is-compact .menu-toggle__label { font-size:14px; }
 .menu-toggle[aria-expanded="true"] .menu-toggle__lines { border:0; }
 .menu-toggle[aria-expanded="true"] .menu-toggle__lines::before,.menu-toggle[aria-expanded="true"] .menu-toggle__lines::after { content:""; position:absolute; width:100%; height:1px; left:0; top:50%; background:#fff; transform:rotate(45deg); }
 .menu-toggle[aria-expanded="true"] .menu-toggle__lines::after { transform:rotate(-45deg); }
 .mobile-menu[open] { display:block; position:fixed; z-index:60; top:var(--header); left:0; right:0; bottom:0; width:100%; max-width:none; height:calc(100dvh - var(--header)); max-height:none; margin:0; padding:20px 30px 60px; background:#111; color:white; border:0; overflow:auto; }
 .mobile-menu[open] { clip-path:inset(0 0 100% 0); opacity:0; transform:translateY(-12px); transition:clip-path .38s cubic-bezier(.22,1,.36,1),transform .38s cubic-bezier(.22,1,.36,1),opacity .25s; }
 .mobile-menu[open].is-visible { clip-path:inset(0); opacity:1; transform:none; }
 .header-compact .mobile-menu[open] { top:72px; height:calc(100dvh - 72px); }
 .mobile-menu::backdrop { background:transparent; }
 .mobile-menu a { display:block; padding:16px 10px; border-bottom:1px solid #444; }
 .mobile-menu .footer-nav__group ul { padding-left:20px; }
 body.menu-open { overflow:hidden; }
 body.menu-open .site-header { z-index:100; }
 body.menu-open .mobile-menu { /* dialog remains below the exposed header area */ overscroll-behavior:contain; }
}
@media (max-width:767px) {
 :root { --header:117px; }
 body { font-size:18px; }
 .container { width:calc(100% - 40px); }
 .site-header { border-top-width:4px; }
 .site-header__logo { width:250px; margin-left:15px; }
 .site-header.is-compact { height:76px; }
 .site-header.is-compact .site-header__logo { width:210px; }
 .menu-toggle { width:117px; padding:22px 24px; gap:17px; }
 .menu-toggle__lines { height:31px; }
 .menu-toggle__label { font-size:20px; }
 .site-header.is-compact .menu-toggle { width:90px; padding:12px 22px; gap:8px; }
 .site-header.is-compact .menu-toggle__lines { height:22px; }
 .site-header.is-compact .menu-toggle__label { font-size:14px; }
 .section-heading__en { font-size:72px; letter-spacing:-2px; line-height:1.12; }
 .section-heading__ja { font-size:22px; padding-top:16px; }
 .section-heading__art { right:-14px; top:-55px; }
 .section-heading__art--about { width:120px; }
 .section-heading__art--service { width:170px; top:-50px; }
 .section-heading__art--news { width:130px; top:-20px; right:0; }
 .bar-heading { font-size:22px; }
 .button { min-height:56px; font-size:16px; padding-inline:24px; }
 .button--more { min-height:44px; font-size:16px; width:140px; }
 .contact { padding:50px 0 88px; }
 .contact__grid { display:block; }
 .contact .section-heading__en { font-size:72px; }
 .contact .section-heading__ja { font-size:20px; padding-top:8px; }
 .contact__lead { font-size:16px; margin-top:18px; line-height:1.5; }
 .contact__hours { font-size:22px; margin-top:35px; gap:14px; }
 .contact__hours img,.contact__numbers img { width:24px; margin-left:6px; }
 .contact__numbers { gap:35px; margin-top:8px; }
 .contact__numbers>a { font-size:24px; gap:14px; }
 .contact__numbers>span { font-size:18px; }
 .contact__button { min-height:60px; margin-top:57px; }
 .contact__calendar { margin-top:70px; }
 .contact__calendar .bar-heading { font-size:22px; }
 .contact__calendar iframe { min-height:372px; }
 .footer-main { padding:20px 0 55px; }
 .footer-main__grid { display:block; }
 .footer-nav { display:block; padding:0; border:0; font-size:16px; line-height:1.7; }
 .footer-nav__group ul { padding:0; }
 .footer-nav a { position:relative; display:block; border-bottom:1px solid #444; padding:18px 4px; }
 .footer-nav__group ul a { padding-left:22px; }
 .footer-nav a::after { content:""; position:absolute; right:6px; top:50%; width:14px; aspect-ratio:33/19; background:url("../img/common/icon05.png") center/contain no-repeat; transform:translateY(-50%); }
 .footer-company { padding:67px 10px 0; }
 .footer-company__logo { width:325px; }
 .footer-company address { font-size:14px; line-height:1.85; margin-top:13px; }
 .related-banners { gap:20px 28px; margin:32px 6px 0; }
 .copyright { min-height:37px; }
 .copyright small { font-size:12px; }
 .header-compact .mobile-menu[open] { top:76px; height:calc(100dvh - 76px); }
}
@media (max-width:480px) {
 :root { --header:88px; }
 .site-header__logo { width:205px; }
 .menu-toggle { width:88px; padding:17px 18px; gap:12px; }
 .menu-toggle__label { font-size:15px; }
 .menu-toggle__lines { height:25px; }
 .section-heading__en,.contact .section-heading__en { font-size:clamp(43px,13.3vw,64px); }
 .section-heading__ja { font-size:18px; }
 .section-heading__art--about { width:95px; top:-35px; }
 .section-heading__art--service { width:125px; top:-35px; }
 .section-heading__art--news { width:98px; }
 .contact__lead { font-size:14px; }
 .contact__hours { font-size:18px; }
 .contact__numbers { gap:18px; }
 .contact__numbers>a { font-size:20px; gap:8px; }
 .contact__numbers>span { font-size:14px; }
 .contact__hours img,.contact__numbers img { width:23px; margin-left:0; }
 .contact__button { width:min(320px,100%); font-size:14px; }
 .footer-nav { font-size:15px; }
 .footer-company address { font-size:13px; }
 .copyright small { font-size:10px; }
}
@media (min-width:768px) and (max-width:1000px) {
 .contact__grid { grid-template-columns:1fr; max-width:650px; }
 .contact__calendar { margin-top:30px; }
 .contact__numbers { flex-wrap:nowrap; }
 .footer-main__grid { grid-template-columns:1fr; max-width:650px; }
 .footer-nav { border-right:0; border-bottom:1px solid #444; padding-bottom:30px; }
 .footer-company { padding:35px 0 0; }
}
@media (prefers-reduced-motion:reduce) {
 html { scroll-behavior:auto; }
 *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
 .reveal.is-pending { opacity:1; transform:none; }
}
@media (max-width:360px) {
 .contact__numbers { flex-wrap:wrap; gap:8px 20px; }
 .site-header__logo { width:185px; }
 .site-header.is-compact .site-header__logo { width:185px; }
}

@media print {
 .reveal,.reveal.is-pending { opacity:1; transform:none; transition:none; }
}