/* rise-ac.jp 共通デザイン
   紺とグレーを基調に白を多く。文字の大きさ・種類は旧サイトに合わせる(本文14px、Verdana+メイリオ/ヒラギノ)。 */

:root {
  --navy: #1f2a44;
  --navy-2: #2f4067;
  --ink: #222831;
  --gray: #5c6470;
  --line: #d9dde3;
  --pale: #f3f5f8;
  --white: #ffffff;
  --accent: #8a1c1c;
  --wrap: 960px;
}

*, *::before, *::after { box-sizing: border-box; }
html { font-size: 14px; -webkit-text-size-adjust: 100%; scroll-padding-top: 1rem; }
body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-size: 1rem;
  line-height: 1.48;
  overflow-wrap: anywhere;
}

input, button { font-family: inherit; }
img { max-width: 100%; height: auto; }
a { color: var(--navy-2); text-underline-offset: 3px; }
a:hover { color: var(--accent); }
.ext::after { content: "↗"; font-size: .8em; margin-left: .2em; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 16px; }

.skip { position: absolute; left: -9999px; }
.skip:focus { left: 8px; top: 8px; background: var(--white); padding: 8px; z-index: 10; }

/* ---- 上部 ---- */
.site-header { background: var(--navy); color: var(--white); }
.header-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding-top: 14px; padding-bottom: 12px; }
.brand { color: var(--white); text-decoration: none; display: flex; flex-direction: column; line-height: 1.12; }
.brand:hover { color: var(--white); }
.brand-name { font-size: 1.35rem; font-weight: 700; letter-spacing: .06em; }
.brand-sub { font-size: .85rem; letter-spacing: .04em; opacity: .9; }
.header-tel { display: flex; flex-direction: column; align-items: flex-start; }
.tel-button { color: var(--white); font-size: 1.15rem; font-weight: 700; text-decoration: none; letter-spacing: .04em; }
.tel-button:hover { color: var(--white); text-decoration: underline; }
.tel-label { font-size: .8rem; font-weight: 400; border: 1px solid rgba(255,255,255,.6); padding: 0 .5em; margin-right: .3em; border-radius: 3px; vertical-align: 2px; }
.hours { font-size: .8rem; opacity: .9; }
@media (min-width: 768px) { .header-tel { align-items: flex-end; } }

.global-nav { background: var(--navy-2); }
.global-nav ul { list-style: none; margin: 0 auto; display: flex; flex-wrap: wrap; }
.global-nav li { flex: 1 1 33%; }
@media (min-width: 600px) { .global-nav li { flex: 1 1 auto; } }
.global-nav a { display: block; color: var(--white); text-decoration: none; text-align: center; padding: 10px 4px; font-size: .95rem; border-bottom: 3px solid transparent; }
.global-nav a:hover, .global-nav a[aria-current] { border-bottom-color: var(--white); color: var(--white); }

.breadcrumb { max-width: var(--wrap); margin: 0 auto; padding: 10px 16px 0; font-size: .85rem; color: var(--gray); }
.breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.breadcrumb li + li::before { content: "›"; margin: 0 .5em; }

/* ---- 本文 ---- */
main { padding-top: 8px; padding-bottom: 56px; }
.page-photo { margin: 12px 0 0; }
.page-photo img { display: block; width: 100%; height: auto; aspect-ratio: 800 / 222; object-fit: cover; }
@media (max-width: 599px) { .page-photo img { aspect-ratio: 16 / 7; } }
.photo-right { float: right; width: 40%; max-width: 222px; margin: 0 0 12px 16px; }
@media (max-width: 599px) { .photo-right { float: none; display: block; width: auto; max-width: 100%; margin: 0 auto 16px; } }
h1 { font-size: 1.6rem; line-height: 1.2; color: var(--navy); margin: 24px 0 16px; padding-bottom: 10px; border-bottom: 3px solid var(--navy); }
h2 { font-size: 1.3rem; line-height: 1.2; color: var(--navy); margin: 48px 0 14px; padding: 6px 0 6px 12px; border-left: 5px solid var(--navy); background: var(--pale); }
h3 { font-size: 16px; line-height: 1.2; color: var(--navy); margin: 32px 0 10px; padding-bottom: 4px; border-bottom: 1px solid var(--line); }
h4 { font-size: 1rem; color: var(--navy); margin: 22px 0 6px; }
p { margin: 0 0 1em; }
ul, ol { padding-left: 1.4em; margin: 0 0 1em; }
li { margin-bottom: .3em; }
.lead { font-size: 1.12rem; font-weight: 700; color: var(--navy); }
.note { font-size: .9rem; color: var(--gray); }
.small { font-size: .9rem; }
.in-progress { padding: 14px 16px; background: var(--pale); border: 1px dashed var(--gray); color: var(--gray); }
/* アイコン(見出しの左) */
.icon { width: 44px; height: 44px; vertical-align: middle; margin-right: 10px; flex: none; }
.card h3 { display: flex; align-items: center; }

/* 手順の図(番号つき。スマホは縦、パソコンは横) */
.steps { list-style: none; padding: 0; margin: 12px 0 20px; counter-reset: step; display: flex; flex-direction: column; gap: 22px; }
.steps li { counter-increment: step; position: relative; margin: 0; padding: 10px 12px 10px 52px; background: var(--white); border: 1px solid var(--line); border-radius: 6px; font-weight: 700; color: var(--navy); }
.steps li::before { content: counter(step); position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%; background: var(--navy); color: var(--white); font-size: .9rem; display: flex; align-items: center; justify-content: center; }
.steps li + li::after { content: "▼"; position: absolute; left: 50%; top: -20px; transform: translateX(-50%); color: var(--gray); font-size: .75rem; }
@media (min-width: 900px) {
  .steps { flex-direction: row; gap: 26px; }
  .steps li { flex: 1 1 0; padding: 44px 10px 12px; text-align: center; font-size: .92rem; }
  .steps li::before { left: 50%; top: 10px; transform: translateX(-50%); }
  .steps li + li::after { content: "▶"; left: -19px; top: 50%; transform: translateY(-50%); }
}

/* 略歴の年表 */
.dl.timeline { border-top: 0; }
.dl.timeline > div { border-bottom: 0; padding: 0 0 14px 22px; position: relative; border-left: 2px solid var(--line); margin-left: 6px; }
.dl.timeline > div::before { content: ""; position: absolute; left: -7px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--navy); }
.dl.timeline > div:last-child { border-left-color: transparent; }
@media (min-width: 700px) { .dl.timeline > div { grid-template-columns: 6em 1fr; } }

.flow { list-style: none; padding: 0; margin: 0 0 20px; }
.flow li { border: 1px solid var(--line); border-left: 4px solid var(--navy); padding: 8px 14px; margin: 0; }
.flow li + li { margin-top: 28px; position: relative; }
.flow li + li::before { content: "↓"; position: absolute; left: 50%; top: -26px; color: var(--navy); font-weight: 700; }
.figure { margin: 20px 0; text-align: center; }
.figure img { border: 1px solid var(--line); }

.box { border: 1px solid var(--line); padding: 16px 18px; margin: 0 0 20px; background: var(--white); }
.box > :last-child { margin-bottom: 0; }
.box-title { font-weight: 700; color: var(--navy); margin-bottom: .4em; }

/* カードの並び(業務内容など) */
.cards { display: grid; gap: 16px; grid-template-columns: 1fr; margin: 0 0 24px; }
@media (min-width: 700px) { .cards { grid-template-columns: 1fr 1fr; } }
@media (min-width: 700px) { .cards-center-last > .card:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; width: calc(50% - 8px); } }
.card { border: 1px solid var(--line); border-top: 4px solid var(--navy); padding: 16px 18px; background: var(--white); }
.card h3 { margin-top: 0; border: 0; padding: 0; }
.card > :last-child { margin-bottom: 0; }
.more { display: inline-block; margin-top: .4em; font-weight: 700; }
.more::after { content: " ›"; }

/* トップのメッセージ */
.hero { background: var(--pale); border-left: 6px solid var(--navy); padding: 22px 20px; margin: 24px 0 8px; }
.hero p:last-child { margin-bottom: 0; }
.hero ol { font-weight: 700; color: var(--navy); }

/* 見出しと説明の組(所在地・事例など) */
.dl { margin: 0 0 20px; border-top: 1px solid var(--line); }
.dl > div { display: grid; grid-template-columns: 1fr; padding: 10px 0; border-bottom: 1px solid var(--line); }
.dl dt { font-weight: 700; color: var(--navy); }
.dl dd { margin: 0; }
@media (min-width: 700px) { .dl > div { grid-template-columns: 9em 1fr; gap: 16px; } }

/* 略歴 */
.profile-top { display: grid; gap: 20px; grid-template-columns: 1fr; align-items: start; }
.profile-top img { width: 200px; }
@media (min-width: 700px) { .profile-top { grid-template-columns: 200px 1fr; } }

/* Q&A */
.qa { margin: 0 0 18px; border: 1px solid var(--line); }
.qa dt, .qa dd { margin: 0; padding: 12px 16px 12px 3.2em; position: relative; }
.qa dt { font-weight: 700; color: var(--navy); background: var(--pale); }
.qa dt::before, .qa dd::before { position: absolute; left: 14px; top: 10px; font-weight: 700; font-size: 1.1rem; }
.qa dt::before { content: "Q"; color: var(--navy); }
.qa dd::before { content: "A"; color: var(--accent); }
.qa dd > :last-child { margin-bottom: 0; }

/* 表(料金など本当に表の情報だけ)。スマホでは横にスクロール */
.table-scroll { overflow-x: auto; margin: 0 0 20px; }
table { border-collapse: collapse; min-width: 100%; }
th, td { border: 1px solid var(--line); padding: 8px 12px; text-align: left; vertical-align: top; }
th { background: var(--pale); }

.button { display: inline-block; background: var(--navy); color: var(--white); text-decoration: none; padding: 10px 18px; border-radius: 4px; font-weight: 700; }
.button:hover { background: var(--navy-2); color: var(--white); }

.subnav { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; }
.subnav a { display: inline-block; border: 1px solid var(--line); padding: 4px 12px; text-decoration: none; font-size: .92rem; background: var(--white); }

/* ---- ブログ ---- */
.blog-search { margin: 16px 0; }
.blog-search label { display: block; font-size: .9rem; color: var(--gray); }
.search-row { display: flex; gap: 8px; }
.search-row input { flex: 1; min-width: 0; font-size: 16px; padding: 8px 10px; border: 1px solid var(--gray); border-radius: 4px; }
.search-row button { font-size: 1rem; padding: 8px 16px; background: var(--navy); color: var(--white); border: 0; border-radius: 4px; cursor: pointer; }
.blog-tabs { display: flex; gap: 8px; }
.blog-tabs a { border: 1px solid var(--line); padding: 2px 14px; text-decoration: none; font-size: .92rem; }
.post-list { list-style: none; padding: 0; border-top: 1px solid var(--line); }
.post-list li { padding: 12px 0; border-bottom: 1px solid var(--line); margin: 0; }
.post-list time { display: block; font-size: .85rem; color: var(--gray); }
.post-list .snippet { font-size: .9rem; color: var(--gray); margin: .3em 0 0; }
.post-date { color: var(--gray); font-size: .9rem; }
.old-post-notice { border: 2px solid var(--accent); color: var(--accent); background: #fff7f7; padding: 12px 16px; margin: 0 0 20px; font-weight: 700; }
.current-rule { border: 2px solid var(--navy); background: var(--pale); padding: 12px 16px; margin: 0 0 20px; }
.current-rule-title { font-weight: 700; color: var(--navy); margin-bottom: .3em; }
.post-body { margin-bottom: 32px; }
.post-nav { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--line); padding-top: 16px; font-size: .95rem; }
.pager { display: flex; gap: 16px; justify-content: center; align-items: center; margin: 16px 0; }
.archive-year ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; }
.count { color: var(--gray); font-size: .85rem; margin-left: .2em; }

/* ---- 下部 ---- */
.site-footer { background: var(--pale); border-top: 4px solid var(--navy); padding: 32px 0 20px; font-size: .92rem; }
.footer-links { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 24px; }
@media (min-width: 768px) { .footer-links { grid-template-columns: repeat(3, 1fr); } }
.footer-links h2 { font-size: .95rem; margin: 0 0 6px; padding: 0; border: 0; background: none; }
.footer-links ul { list-style: none; padding: 0; margin: 0 0 16px; }
.footer-links li { margin: 0 0 4px; }
.footer-office { border-top: 1px solid var(--line); margin-top: 8px; padding-top: 16px; }
.footer-office p { margin: 0 0 .2em; }
.footer-name { font-weight: 700; color: var(--navy); }
.copyright { margin-top: 16px; font-size: .78rem; color: var(--gray); }

/* 色の差し色(事務所概要の所長略歴以下)。帯と線だけに色を付け、文字は紺のまま。所長指示 2026-10-07 */
.tone-teal  { --tone: #1f6f78; --tone-pale: #e9f3f4; --tone-mid: #a9cfd3; }
.tone-green { --tone: #3a6b45; --tone-pale: #edf4ee; --tone-mid: #b5d0ba; }
.tone-amber { --tone: #8a5a14; --tone-pale: #faf3e6; --tone-mid: #e3c99a; }
.tone h2 { border-left-color: var(--tone); background: var(--tone-pale); }
.tone h3 { border-bottom-color: var(--tone-mid); border-bottom-width: 2px; }
.tone .box { border-left: 4px solid var(--tone); }
.tone .dl.timeline > div::before { background: var(--tone); }
.tone .dl.timeline > div { border-left-color: var(--tone-mid); }
.tone .dl.timeline > div:last-child { border-left-color: transparent; }
.tone .in-progress { background: var(--tone-pale); border-color: var(--tone); }
/* 資格名は25%大きく(14px → 17.5px) */
.box-title.qual { font-size: 17.5px; line-height: 1.3; }

/* 中小M&Aガイドライン遵守宣言(番号つきの項目) */
.decl h3 { margin-top: 36px; }
.decl h4 { margin-top: 24px; }
.decl-ki, .decl-ijo { text-align: center; margin: 1em 0; }
.decl-ijo { text-align: right; }
.decl .no, .decl .sub { position: relative; padding-left: 2.8em; }
.decl .sub[data-no^="（"] { padding-left: 4.8em; }
.decl .no::before, .decl .sub::before { content: attr(data-no); position: absolute; left: 0; }
.decl .no::before { font-weight: 700; color: var(--navy); }
.decl .sub { margin-left: 1.4em; margin-bottom: .5em; }
.decl ul { margin-left: 2.4em; }
.decl li .sub { margin-left: 0; margin-top: .4em; }
.decl .kome { margin-left: 2.4em; font-size: .95rem; }
.decl li .kome { margin-left: 2.4em; }
.decl .lead-in { margin-top: 1.2em; }
@media (max-width: 599px) {
  .decl ul { margin-left: .6em; padding-left: 1.2em; }
  .decl .sub { margin-left: .4em; }
  .decl .sub[data-no^="（"] { padding-left: 4.6em; }
  .decl li .kome, .decl .kome { margin-left: .8em; }
}

/* セミナー等: 本文の右側に写真(表示は横160×縦120で全写真同じ)。狭いスマホでは本文の下に右寄せ */
.seminar-row { display: flex; align-items: flex-start; gap: 16px; }
.seminar-row > p { flex: 1 1 auto; min-width: 0; }
.seminar-photos { flex: 0 0 auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin: 0 0 1em auto; }
.seminar-photos img { width: 160px; height: auto; border: 1px solid var(--line); }
.seminar-photos.large img { width: 192px; } /* 2014年以降は2割増し(所長指示) */
@media (max-width: 480px) { .seminar-row { flex-direction: column; align-items: stretch; gap: 0; } }
@media (max-width: 480px) { .seminar-photos.large { flex-wrap: nowrap; } .seminar-photos.large img { min-width: 0; flex: 0 1 auto; } }

/* ブログのトップページの来訪者カウンター(ページ名の太い線の右端) */
h1.has-counter { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; }
.visit-counter { font-size: 12px; font-weight: normal; color: var(--gray); white-space: nowrap; line-height: 1.4; }
.visit-counter[hidden] { display: none; }
.visit-counter b { font-size: 14px; color: var(--navy); }

/* スマホ(幅599px以下)では、すべての文字を15%大きく(2026-10-08 所長指示)
   ほとんどの文字は html の大きさ(14px)を基準にしているので、それを 14px × 1.15 = 16.1px に。
   基準を使わず px で決めている文字だけ、個別に1.15倍にする */
@media (max-width: 599px) {
  html { font-size: 16.1px; }
  h3 { font-size: 18.4px; }                     /* 16px × 1.15 */
  .search-row input { font-size: 18.4px; }      /* 16px × 1.15 */
  .box-title.qual { font-size: 20.1px; }        /* 17.5px × 1.15 */
  .visit-counter { font-size: 13.8px; }         /* 12px × 1.15 */
  .visit-counter b { font-size: 16.1px; }       /* 14px × 1.15 */
}
