/* 会社概要ページ(2026-10-04)。全規則を .oc- に限定。既存サイトのCSSを変更しない。
   元: docs/design/company_20261004/company.css。色・文字・部品は買取・売買仲介・リフォームのページに揃える。 */
.oc-page{background:#faf8f2;color:#142e48;font-family:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;line-height:1.8;--teal:#126b6b;--line:#bad2d0}
.oc-page *{box-sizing:border-box}.oc-page img{max-width:100%;display:block}
.oc-page a{color:inherit;text-decoration:none}
.oc-page a:focus-visible{outline:3px solid #a86615;outline-offset:5px}
.oc-page h1,.oc-page h2,.oc-page h3,.oc-page p{margin-top:0}
.oc-page h2{font-size:clamp(24px,2.6vw,36px);line-height:1.55;font-weight:600}
.oc-page h3{font-size:21px;line-height:1.6}
.oc-page p{font-size:16px;line-height:1.9}
.oc-page figure{margin:0}
.oc-page .oc-small{font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;font-size:13px;color:#516675;margin:14px 0 0;line-height:1.8}
.oc-page .oc-small a{color:var(--teal);text-decoration:underline;text-underline-offset:3px;margin-left:6px;white-space:nowrap}
.oc-page .oc-nw{display:inline-block;white-space:nowrap}
.oc-page .oc-textlink{display:inline-block;border-bottom:1px solid var(--teal);color:var(--teal);font-weight:600}
.oc-page .oc-button{display:inline-flex;align-items:center;justify-content:center;background:var(--teal);color:#fff;padding:12px 24px;min-height:48px;border-radius:4px;letter-spacing:.06em;white-space:nowrap;font-weight:600}
.oc-page .oc-button:hover{background:#0c5258}
.oc-page .oc-line{background:#06c755}.oc-page .oc-line:hover{background:#05a648}
.oc-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}

/* ヒーロー(代表者の写真は切り取らない: 幅いっぱい・高さ auto) */
.oc-hero{max-width:1200px;margin:auto;padding:56px 28px;display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center}
.oc-page .oc-eyebrow{display:block;color:var(--teal);letter-spacing:.1em;font-size:16px;font-weight:400;line-height:1.8;margin-bottom:12px}
.oc-hero h1{margin-bottom:20px}
.oc-hero .oc-h1-main{display:block;font-size:clamp(28px,3.2vw,44px);line-height:1.5;letter-spacing:-.03em;font-weight:600}
.oc-photo img{width:100%;height:auto;border-radius:6px}
.oc-photo figcaption{font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;font-size:13px;color:#516675;margin-top:8px}

/* 共通の段 */
.oc-section{max-width:1200px;margin:auto;padding:56px 28px}
.oc-band{background:#eaf2ef}
.oc-heading{margin-bottom:28px}.oc-heading>p:last-child{color:#516675;margin-bottom:0}
.oc-rule{border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:16px}
.oc-number{display:block;color:var(--teal);font-size:26px;line-height:1.2}

/* ご挨拶 */
.oc-message{display:grid;grid-template-columns:1fr 1.4fr;gap:48px}
.oc-page .oc-lead{color:#142e48!important;font-size:18px}
.oc-message-body p{margin-bottom:1.1em}
.oc-sign{text-align:right;margin-top:24px}

/* 会社概要の表 */
.oc-table{margin:0;font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;font-size:15px;background:#fff;border:1px solid #d1dddc;border-radius:6px}
.oc-table>div{display:grid;grid-template-columns:14em 1fr;border-top:1px solid #d1dddc}
.oc-table>div:first-child{border-top:0}
.oc-table dt{background:#eef3f2;padding:14px 20px;font-weight:600}
.oc-table dd{margin:0;padding:14px 20px;line-height:1.8}
.oc-table a{color:var(--teal);text-decoration:underline;text-underline-offset:3px}

/* 事業と対応エリア */
.oc-services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.oc-page .oc-service{display:block;background:#fff;border-radius:6px;padding:24px;border-top:3px solid var(--teal)}
.oc-service h3{margin:6px 0 6px}
.oc-service p{font-size:15px;margin:0 0 10px}
.oc-page .oc-area{font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;font-size:14px;font-weight:600}
.oc-area span{display:inline-block;background:#9ab5b0;color:#fff;font-size:12px;padding:1px 10px;border-radius:3px;margin-right:8px;font-weight:400}
.oc-more{color:var(--teal);font-weight:600}

/* アクセス */
.oc-access-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:32px;align-items:start}
.oc-access h3{font-size:19px}
.oc-map{width:100%;height:340px;border:0;border-radius:6px;background:#eef3f2}

/* 相談の帯 */
.oc-closing{max-width:1200px;margin:0 auto 56px;padding:48px 28px;text-align:center;background:#e7f4f1;border-radius:6px}
.oc-closing h2{font-size:27px}
.oc-closing .oc-small{margin-top:16px}

@media(max-width:800px){
  .oc-hero{grid-template-columns:1fr;gap:24px;padding:32px 20px}
  .oc-hero .oc-h1-main{font-size:clamp(26px,7vw,36px)}
  .oc-section{padding:36px 20px}
  .oc-message{grid-template-columns:1fr;gap:12px}
  .oc-table>div{grid-template-columns:1fr}
  .oc-table dt{padding:10px 16px 4px;background:#fff;color:#516675;font-size:13px}
  .oc-table dd{padding:0 16px 12px}
  .oc-services{grid-template-columns:1fr;gap:14px}
  .oc-access-grid{grid-template-columns:1fr;gap:20px}
  .oc-map{height:260px}
  .oc-closing{margin:0 0 0;border-radius:0;padding:36px 20px;text-align:left}
  .oc-actions{justify-content:flex-start;padding-right:88px}   /* ★右下の固定の相談ボタンの分を空ける */
  .oc-actions .oc-button{flex:1 1 100%;font-size:15px}
  .oc-closing h2{font-size:23px}
}
@media(max-width:360px){
  .oc-hero{padding:28px 18px}
  .oc-page .oc-eyebrow{font-size:13px;letter-spacing:.04em}
  .oc-hero .oc-h1-main{font-size:24px}
  .oc-page .oc-button{padding:12px 12px;letter-spacing:.02em;font-size:14px}
  .oc-actions{padding-right:84px}
  .oc-closing h2{font-size:21px}
}