/* 株式会社Orthoasset コーポレートサイト共通CSS */
:root{
  --navy:#1b2f45; --navy-d:#12202f; --accent:#3e6b96; --gold:#b9a179;
  --ink:#232a32; --ink2:#5d6872; --line:#e4e8ec; --bg:#ffffff; --gray:#f6f7f9;
  --maxw:980px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",system-ui,sans-serif;color:var(--ink);background:var(--bg);line-height:1.9;font-size:16px;-webkit-text-size-adjust:100%}
img{max-width:100%;display:block}
a{color:var(--accent)}
h1,h2,h3{line-height:1.4;margin:0 0 .6em;font-weight:700}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
section{padding:64px 0}
section.gray{background:var(--gray)}
h2{font-size:clamp(21px,3vw,27px)}
h2 small{display:block;font-size:11.5px;letter-spacing:.25em;color:var(--gold);margin-bottom:8px;font-weight:600}
.btn{display:inline-block;background:var(--navy);color:#fff;font-weight:700;padding:14px 30px;border-radius:4px;text-decoration:none;transition:.2s;font-size:15px}
.btn:hover{background:var(--accent)}
.btn.ghost{background:transparent;color:var(--navy);border:1.5px solid var(--navy)}
.note{font-size:13px;color:var(--ink2)}
/* header */
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:62px}
.logo{text-decoration:none;color:var(--navy);font-weight:800;font-size:18px;letter-spacing:.04em}
.logo span{display:block;font-size:10.5px;letter-spacing:.3em;color:var(--gold);font-weight:600}
header nav a{font-size:13.5px;color:var(--ink2);text-decoration:none;margin-left:20px}
@media(max-width:700px){header nav a{margin-left:12px;font-size:12.5px}}
/* hero */
.hero{background:linear-gradient(135deg,var(--navy-d) 0%,var(--navy) 55%,#2c4a6b 100%);color:#fff;padding:84px 0;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border:1px solid rgba(185,161,121,.35);border-radius:50%}
.hero:after{content:"";position:absolute;right:-60px;top:-60px;width:300px;height:300px;border:1px solid rgba(255,255,255,.12);border-radius:50%}
.hero .kicker{color:var(--gold);letter-spacing:.3em;font-size:12.5px;font-weight:600;margin-bottom:14px}
.hero h1{font-size:clamp(26px,4.4vw,40px);letter-spacing:.02em}
.hero p{opacity:.88;max-width:640px;font-size:15.5px}
/* page hero */
.pagehero{background:linear-gradient(135deg,var(--navy-d),var(--navy));color:#fff;padding:56px 0}
.pagehero .crumb{font-size:12.5px;opacity:.75;margin-bottom:10px}
.pagehero .crumb a{color:#fff;text-decoration:none}
.pagehero h1{font-size:clamp(23px,3.6vw,32px)}
.pagehero h1 small{display:block;font-size:11.5px;letter-spacing:.3em;color:var(--gold);margin-bottom:10px}
/* cards */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:760px){.grid3{grid-template-columns:1fr}}
.biz{background:#fff;border:1px solid var(--line);border-top:3px solid var(--navy);padding:30px 26px;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);transition:.2s}
.biz:hover{box-shadow:0 10px 30px rgba(27,47,69,.12);transform:translateY(-3px)}
.biz .no{font-size:12px;letter-spacing:.2em;color:var(--gold);font-weight:700;margin-bottom:10px}
.biz h3{font-size:19px;color:var(--navy)}
.biz p{margin:0 0 16px;font-size:14px;color:var(--ink2);flex:1}
.biz .more{font-size:13.5px;font-weight:700;color:var(--accent)}
/* table */
table{width:100%;border-collapse:collapse;background:#fff}
th,td{padding:16px 14px;border-bottom:1px solid var(--line);text-align:left;font-size:14.5px;vertical-align:top}
th{width:30%;background:var(--gray);font-weight:700;color:var(--navy)}
/* feature list */
.flist{list-style:none;margin:0;padding:0}
.flist li{padding:14px 0 14px 30px;border-bottom:1px solid var(--line);position:relative;font-size:15px}
.flist li:before{content:"";position:absolute;left:4px;top:24px;width:10px;height:10px;background:var(--gold)}
/* cta band */
.ctaband{background:var(--navy);color:#fff;text-align:center;padding:52px 20px}
.ctaband h2{color:#fff}
.ctaband p{opacity:.85;max-width:620px;margin:0 auto 22px;font-size:14.5px}
.ctaband .btn{background:#fff;color:var(--navy)}
/* footer */
footer{background:var(--navy-d);color:#aebbc8;padding:36px 0;font-size:13px}
footer .wrap{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:700px){footer .wrap{grid-template-columns:1fr}}
footer a{color:#fff;text-decoration:none}
footer nav{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px}
footer nav a{font-size:12.5px;color:#8fa0b0}

/* ===== mobile readability (2026-11-02) ===== */
.grid3>*{min-width:0}
td{overflow-wrap:anywhere}
@media(max-width:700px){
  body{font-size:16.5px}
  .wrap{padding:0 16px}
  section{padding:44px 0}
  header .wrap{flex-direction:column;align-items:flex-start;height:auto;padding-top:8px;padding-bottom:0;gap:2px}
  .logo{font-size:17px}
  .logo span{display:inline;margin-left:8px;font-size:9.5px;letter-spacing:.2em}
  header nav{display:flex;width:100%;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  header nav::-webkit-scrollbar{display:none}
  header nav a{margin:0 18px 0 0;padding:9px 0 10px;font-size:14px}
  .hero{padding:52px 0}
  .hero p{font-size:15.5px}
  .pagehero{padding:40px 0}
  .biz{padding:22px 18px}
  .biz h3{font-size:18px}
  .biz p{font-size:15px}
  table,tbody,tr,th,td{display:block;width:100%}
  th{width:auto;padding:10px 12px;font-size:14px;border-bottom:none}
  td{padding:8px 12px 16px;font-size:15px}
  .flist li{font-size:15.5px}
  footer{font-size:14px}
  footer nav{gap:0 4px}
  footer nav a{display:inline-block;padding:9px 8px;font-size:14px}
}