/* デザイン ver.3 の下層（2026-10-30 CEO「Y、下層も作る」）。中身は今のページ（b.css の部品）のまま、fujiihouse.co.jp の下層の見え方に寄せて上書きする
   ページの見出し＝大きな英字（Raleway 細字）＋右に小さな日本語と緑の下線、下にパンくずと線。節の見出し＝明朝＋左に緑の縦線、下に小さな英字
   読み込み順：b.css → v3.css → このファイル（body.v3l の中だけに効かせる） */
:root {
  --head: var(--mincho); --num: var(--en); --radius: 0px; --shadow: none;
  --green: var(--acc); --green-soft: #e8f3eb; --blue-soft: #eef2f6; --head-h: 76px;
}
.v3l { letter-spacing: .08em; }
.v3l main :is(p, td, dd, .post-body li) > a:not([class]) { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.v3l .cards a, .v3l .steps li, .v3l .post, .v3l .works > div { border: 0; box-shadow: none; }
.v3l h1, .v3l h2 { font-weight: 600; letter-spacing: .12em; }
.v3l h3 { font-family: var(--gothic); font-weight: 700; letter-spacing: .06em; }

/* ページの見出し */
.v3l .page-title { background: #fff; overflow: visible; border-bottom: 1px solid var(--line); }
.v3l .page-title::after { top: auto; bottom: -1px; right: max(6vw, var(--gut)); width: 150px; height: 128px; border-radius: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 128' fill='none' stroke='%233f9a5a' stroke-width='1.4' stroke-linejoin='round'%3E%3Cpath d='M8 64L75 8l67 56'/%3E%3Cpath d='M24 52v76M126 52v76'/%3E%3Cpath d='M60 128V92h30v36'/%3E%3Cpath d='M104 36V14h14v34'/%3E%3C/svg%3E") center bottom / contain no-repeat; opacity: .55; }
.v3l .page-title .wrap { max-width: 1200px; min-height: 0; display: grid; grid-template-columns: auto 1fr; grid-template-areas: "en ja" "crumb crumb"; align-items: end; gap: 0 36px; padding-block: 72px 36px; }
.v3l .page-title .wrap > * { max-width: none; min-width: 0; }
.v3l .page-title .eyebrow { grid-area: en; justify-self: start; display: block; font: 300 clamp(44px, 6vw, 84px)/1 var(--en); letter-spacing: .02em; color: var(--ink); text-transform: none; }
.v3l .page-title .eyebrow::before { display: none; }
.v3l .page-title h1 { grid-area: ja; justify-self: start; margin-bottom: .5em; padding-bottom: 6px; border-bottom: 3px solid var(--acc); font-family: var(--gothic); font-weight: 700; font-size: clamp(14px, 1.2vw, 17px); letter-spacing: .1em; line-height: 1.6; max-width: 30em; }
.v3l .page-title .crumb { grid-area: crumb; margin-top: 28px; font-size: 11px; letter-spacing: .1em; }
.v3l .crumb a { color: var(--sub); }
.v3l .crumb a:hover { color: var(--acc); }

/* 節と節の見出し */
.v3l main section { padding-block: 120px; }
.v3l main section.tint { background: var(--gray); }
.v3l main section > .wrap { max-width: 1120px; gap: 44px; }
.v3l .sec-head { flex-direction: column; gap: 12px; }
.v3l .sec-head h2 { font-size: clamp(24px, 2.4vw, 32px); letter-spacing: .16em; line-height: 1.4; padding-left: 22px; border-left: 3px solid var(--acc); }
.v3l .eyebrow { font: 400 13px/1 var(--en); color: var(--sub); letter-spacing: .1em; text-transform: none; }
.v3l .sec-head .eyebrow { padding-left: 25px; }
.v3l .sec-head .eyebrow::before { width: 7px; height: 7px; background: none; border-right: 1.5px solid var(--acc); border-bottom: 1.5px solid var(--acc); transform: rotate(45deg) translateY(-3px); }
.v3l .sub-h { font-family: var(--mincho); font-weight: 600; border-left-color: var(--acc); border-left-width: 3px; padding-left: 16px; }
.v3l .lead-in { font-family: var(--mincho) !important; font-weight: 600 !important; color: var(--acc) !important; }

/* ボタン：丸＋文字（TOP の「詳しく見る」と同じ形） */
.v3l .btn, .v3l .btn.line { min-width: 0; background: none; color: var(--ink); border: 0; border-radius: 0; padding: 0; gap: 16px; justify-content: flex-start; flex-direction: row-reverse; font-weight: 700; letter-spacing: .08em; }
.v3l .btn::after, .v3l .more::after { width: 48px; height: 48px; border: 0; background: var(--acc-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6l6 6-6 6' fill='none' stroke='%23303030' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px no-repeat; transition: background-color .3s, transform .3s; }
.v3l .btn:hover, .v3l .btn.line:hover { background: none; color: var(--acc); }
.v3l .btn:hover::after, .v3l .more:hover::after { background-color: var(--acc); transform: scale(1.06); }
.v3l .more { flex-direction: row-reverse; gap: 16px; font-size: 14px; color: var(--ink); }
.v3l .more:hover { color: var(--acc); }

/* 事業内容 */
.v3l .jump { gap: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); justify-content: stretch; }
.v3l .jump li { flex: 1 1 0; min-width: 0; }
.v3l .jump li + li a { border-left: 1px solid var(--line); }
.v3l .jump a { width: 100%; justify-content: center; border: 0; border-radius: 0; background: none; padding: 18px 12px; font-size: 14px; }
.v3l .jump a::after { content: ""; width: 7px; height: 7px; border-right: 1.5px solid var(--acc); border-bottom: 1.5px solid var(--acc); transform: rotate(45deg) translateY(-3px); }
.v3l .jump a:hover { color: var(--acc); }
.v3l .biz-row { gap: 64px; }
.v3l .biz-row img, .v3l .biz-row .ph { aspect-ratio: 3 / 2; }
.v3l .biz-row .lead-in { font-size: 22px; line-height: 1.7; padding-left: 20px; border-left: 1px solid var(--acc); }
.v3l .ph { background: var(--gray); border-color: #cfd3cf; }
.v3l .chips li { background: #fff; color: var(--ink); border: 1px solid var(--line); border-radius: 0; font-weight: 500; }
.v3l .todo { border-radius: 0; }

/* 相談から施工まで */
.v3l .steps { gap: 0; border-top: 1px solid var(--line); }
.v3l .steps li { grid-template-columns: 96px 1fr; gap: 6px 32px; padding: 32px 8px; background: none; border-bottom: 1px solid var(--line); border-radius: 0; }
.v3l .steps b { width: 72px; height: 72px; border-radius: 50%; background: var(--acc-soft); display: grid; place-items: center; font: 300 28px/1 var(--en); color: var(--ink); align-self: start; }
.v3l .steps h3 { font-family: var(--mincho); font-weight: 600; font-size: 20px; letter-spacing: .12em; }
.v3l .steps p { color: var(--ink); }

/* 施工実績・マガジン・取扱物件のカード：写真の下に日付と題名、左に細い縦線 */
.v3l .cards { gap: 48px 32px; }
.v3l .cards a { background: none; padding-bottom: 0; overflow: visible; gap: 10px; }
.v3l .cards a > :not(img) { margin-inline: 0; padding-left: 18px; border-left: 1px solid var(--acc); }
.v3l .cards a:hover { transform: none; border-color: transparent; }
.v3l .cards img { transition: opacity .3s; margin-bottom: 8px; }
.v3l .cards a:hover img { opacity: .8; }
.v3l .cards a:hover h3 { color: var(--acc); }
.v3l .cards h3 { font-size: 15px; line-height: 1.8; }
.v3l .feed-note { color: var(--sub); }

/* お知らせの一覧 */
.v3l .news li { grid-template-columns: 7em 7em 1fr 28px; padding: 24px 0; }
.v3l .news li::after { width: 28px; height: 28px; background: none; border: 1px solid var(--ink); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6l6 6-6 6' fill='none' stroke='%23303030' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-position: center; background-size: 12px; background-repeat: no-repeat; }
.v3l .news time, .v3l .meta time, .v3l .cards time { font-family: var(--en); font-weight: 400; font-size: 13px; }
.v3l .news .cat, .v3l .meta .cat { border-radius: 0; background: none; border: 1px solid var(--line); color: var(--sub); font-weight: 500; }
.v3l .news .cat.k { border-color: var(--acc); color: var(--acc); background: none; }
.v3l .news a { font-weight: 500; }
.v3l .news a:hover { color: var(--acc); }
.v3l .news-tabs span { border-radius: 0; }
.v3l .news-tabs span.on, .v3l .pager .on { background: var(--acc); border-color: var(--acc); }
.v3l .pager a, .v3l .pager span { border-radius: 0; }

/* 企業情報 */
.v3l .greeting { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 48px 72px; max-width: none; align-items: start; }
.v3l .greeting h2 { font-size: clamp(22px, 2.2vw, 30px); line-height: 1.8; letter-spacing: .14em; color: var(--acc); }
.v3l .sign { font-family: var(--mincho); font-weight: 600; letter-spacing: .14em; }
.v3l table.info { background: none; font-size: 14px; border-top: 1px solid var(--line); }
.v3l table.info th, .v3l table.info td { padding: 24px 8px; border-bottom: 1px solid var(--line); }
.v3l table.info tr:last-child th, .v3l table.info tr:last-child td { border-bottom: 1px solid var(--line); }
.v3l table.info th { width: 12em; color: var(--ink); background: none; position: relative; padding-left: 22px; }
.v3l table.info th::before { content: ""; position: absolute; left: 0; top: 33px; width: 10px; height: 2px; background: var(--acc); }
.v3l .history { border-top: 1px solid var(--line); }
.v3l .history li { padding: 20px 8px; gap: 32px; }
.v3l .history time { font: 400 20px var(--en); color: var(--acc); }
.v3l .map { border-radius: 0; background: var(--gray); }
.v3l .map iframe { width: 100%; height: 100%; border: 0; }

/* お問い合せ・記事 */
.v3l .tel-box .tel b { font: 500 40px/1.2 var(--en); color: var(--ink); letter-spacing: .06em; }
.v3l .post { padding: 0; background: none; }
.v3l .post-body h2, .v3l .post-body h3 { font-family: var(--mincho); }
.v3l .post-nav { border-top: 1px solid var(--line); padding-top: 24px; }

/* 中身のふわっと出る動き（TOP と同じ速さ） */
@media (prefers-reduced-motion: no-preference) {
  .js .v3l main section > .wrap, .js .contact-in { opacity: 0; transform: translateY(24px); transition: opacity 1s ease, transform 1s ease; }
  .js .v3l main section > .wrap.in, .js .contact-in.in { opacity: 1; transform: none; }
}
.v3l .contact { padding-top: 120px; }

@media (max-width: 960px) {
  :root { --head-h: 64px; }
  .v3l .page-title { display: block; }
  .v3l .page-title::after { position: absolute; display: block; width: 96px; height: 82px; right: var(--gut); }
  .v3l .page-title .wrap { grid-template-columns: 1fr; grid-template-areas: "en" "ja" "crumb"; gap: 14px; padding-block: 48px 28px; }
  .v3l .page-title .wrap > * { max-width: none; }
  .v3l .page-title h1 { max-width: calc(100% - 100px); }
  .v3l .page-title .crumb { margin-top: 6px; max-width: none; }
  .v3l main section { padding-block: 72px; }
  .v3l .greeting { grid-template-columns: 1fr; gap: 28px; }
  .v3l .jump { display: grid; grid-template-columns: 1fr; }
  .v3l .jump li + li a { border-left: 0; border-top: 1px solid var(--line); }
  .v3l .biz-row { gap: 28px; }
  .v3l .steps li { grid-template-columns: 56px 1fr; gap: 4px 18px; padding: 24px 0; }
  .v3l .steps b { width: 52px; height: 52px; font-size: 20px; }
  .v3l .cards { gap: 36px; }
  .v3l .news li { grid-template-columns: auto 1fr 28px; gap: 6px 14px; }
  .v3l .news a { grid-column: 1 / 3; grid-row: 2; }
  .v3l .news .cat { justify-self: start; padding: 2px 14px; }
  .v3l .news li::after { grid-column: 3; grid-row: 1 / 3; align-self: center; }
  .v3l table.info th, .v3l table.info td { display: block; width: auto; }
  .v3l table.info th { border-bottom: 0; padding: 18px 8px 0 22px; }
  .v3l table.info th::before { top: 31px; }
  .v3l table.info td { padding: 6px 8px 18px 22px; }
  .v3l .history li { grid-template-columns: 5em 1fr; gap: 16px; }
  .v3l .tel-box .tel b { font-size: 30px; }
  .v3l .contact { padding-top: 72px; }
}
