.inner-header { position: relative; color: var(--navy); background: #fff; border-bottom: 1px solid var(--line); }
.inner-header .main-nav a { color: var(--navy); }
.inner-header .nav-tel { border-color: var(--navy); }
.inner-hero { background: var(--pale); padding: 82px 0 88px; }
.inner-hero .section-kicker { margin-bottom: 19px; }
.breadcrumb { margin: 0 0 29px; color: #657780; font-size: 12px; }
.breadcrumb a { color: inherit; }
.breadcrumb span { margin: 0 10px; }
.inner-hero h1 { margin: 0; color: var(--navy); font-family: 'Noto Serif JP', serif; font-size: clamp(38px, 5vw, 60px); letter-spacing: .08em; line-height: 1.4; }
.inner-hero h1 + p { margin: 22px 0 0; font-family: 'Noto Serif JP', serif; color: var(--navy); font-size: 17px; line-height: 2; }
.office-intro-grid { display: grid; grid-template-columns: .9fr 1fr; align-items: center; gap: 10%; }
.office-photo { height: 450px; overflow: hidden; }
.office-photo img { width: 100%; height: 100%; object-fit: cover; }
.office-intro h2, .approach h2, .office-details h2 { margin: 0; color: var(--navy); font-family: 'Noto Serif JP', serif; font-size: clamp(27px, 3.4vw, 42px); font-weight: 600; letter-spacing: .06em; line-height: 1.6; }
.office-intro h2 + p { margin-top: 29px; }
.office-intro p:not(.section-kicker) + p { margin-top: 17px; }
.approach { background: var(--navy); color: #edf4f5; }
.approach .section-kicker { color: #9cc5d5; }
.approach h2 { color: #fff; }
.approach-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 43px; border-top: 1px solid rgba(255,255,255,.35); }
.approach-grid article { padding: 30px 26px 0 0; }
.approach-grid article + article { padding-left: 27px; border-left: 1px solid rgba(255,255,255,.35); }
.approach-grid span { color: #9cc5d5; font-size: 12px; letter-spacing: .15em; }
.approach-grid h3 { margin: 29px 0 15px; color: #fff; font-family: 'Noto Serif JP', serif; font-size: 21px; font-weight: 600; letter-spacing: .04em; }
.approach-grid p { margin: 0; font-size: 14px; line-height: 1.85; }
.office-details { background: #fff; }
.details-grid { display: grid; grid-template-columns: .85fr 1fr; gap: 10%; }
.details-grid dl { margin: 0; border-top: 1px solid var(--line); }
.details-grid dl div { display: grid; grid-template-columns: 120px 1fr; padding: 22px 0; border-bottom: 1px solid var(--line); }
.details-grid dt { color: #60727b; }
.details-grid dd { margin: 0; color: var(--navy); }
.details-grid dd a { color: inherit; text-decoration: none; }
.office-contact { padding: 90px 0; }
@media(max-width:720px) { .inner-header .menu-button span:not(.sr-only) { background: var(--navy); } .inner-header .main-nav { background: #fff; border-top: 1px solid var(--line); } .inner-header .main-nav a { border-bottom-color: var(--line); } .inner-hero { padding: 55px 0 64px; } .inner-hero h1 + p { font-size: 15px; } .office-intro-grid, .details-grid { grid-template-columns: 1fr; gap: 31px; } .office-photo { height: 270px; } .office-intro h2 br { display: none; } .approach-grid { grid-template-columns: 1fr; margin-top: 29px; } .approach-grid article, .approach-grid article + article { padding: 24px 0; border-left: 0; border-bottom: 1px solid rgba(255,255,255,.35); } .approach-grid h3 { margin: 13px 0 9px; } .details-grid dl div { grid-template-columns: 88px 1fr; padding: 18px 0; } .office-contact { padding: 70px 0; } }