*{box-sizing:border-box}body{margin:0;color:#203642;font-family:Arial,'Noto Sans JP',sans-serif;line-height:1.85}a{color:inherit}.wrap{width:min(1100px,calc(100% - 48px));margin:auto}.header{background:#111c22;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:20px 5%;gap:20px}.brand{font-size:21px;font-weight:700;text-decoration:none}.header nav{display:flex;gap:25px;font-size:14px}.header nav a{text-decoration:none}.hero{background:linear-gradient(125deg,#122b3b,#164b57 70%,#246e73);color:white;padding:95px 0 110px}.eyebrow,.label{font-size:12px;letter-spacing:.18em;font-weight:bold;color:#238293}.hero .eyebrow{color:#9ee0df}.eyebrow span{color:white}.hero h1{font-size:clamp(34px,5.3vw,62px);line-height:1.35;margin:26px 0}.lead{font-size:clamp(19px,2.4vw,25px);font-weight:bold}.intro{max-width:720px;color:#d6e9e9;margin-top:24px}.section{padding:85px 0}.tinted{background:#f2f6f7}.section h2,.overview h2,.contact h2{font-size:clamp(27px,3vw,36px);line-height:1.4;margin:8px 0 20px}.section-intro{color:#536a73;max-width:800px;margin-bottom:36px}.overview{padding:48px 0;display:grid;grid-template-columns:1fr 2fr;gap:50px}.overview dl{margin:0}.overview dl div{display:grid;grid-template-columns:115px 1fr;border-bottom:1px solid #dce6e8;padding:12px 0}.overview dt{font-weight:bold}.overview dd{margin:0}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.grid article{background:#fff;border-radius:8px;padding:25px;box-shadow:0 5px 20px #183d4b0a}.grid span{font-size:12px;color:#288998;font-weight:bold;letter-spacing:.1em}.grid h3{font-size:18px;line-height:1.5}.grid p{font-size:14px;color:#52666e}.diagram{margin:0;background:#edf6f5;border:1px solid #c8e2df;border-radius:16px;padding:30px}.diagram figcaption{display:flex;justify-content:space-between;gap:15px;margin-bottom:24px}.diagram figcaption span{color:#2c797a;font-size:13px;font-weight:bold}.flow{display:flex;align-items:stretch;gap:12px}.node{flex:1;text-align:center;background:white;border:1px solid #d2e7e5;border-radius:10px;padding:25px 15px;display:flex;flex-direction:column;justify-content:center}.node small{color:#448989;letter-spacing:.1em;font-size:10px}.node strong{line-height:1.6;margin-top:10px}.node p{font-size:13px;margin-bottom:0}.node.highlight{background:#176674;color:white;border:0}.node.highlight small{color:#ade2de}.arrow{align-self:center;color:#27868b;font-size:25px}.diagram-note,.note{font-size:13px;color:#627b80;margin-bottom:0}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.benefits p{border-left:3px solid #38a3a2;padding:10px 20px;background:#f5f9f9}.benefits strong{font-size:20px}.contact{background:#193d48;color:white;padding:75px 0;text-align:center}.contact .label{color:#90d9d4}.button{display:inline-block;background:#fff;color:#174955;padding:13px 35px;margin-top:20px;border-radius:5px;text-decoration:none;font-weight:bold}footer{background:#101b21;color:white;text-align:center;padding:25px;font-size:14px}footer a{color:#b9d7d8}@media(max-width:760px){.header{align-items:flex-start;flex-direction:column}.header nav{gap:18px;flex-wrap:wrap}.hero{padding:70px 0}.overview{grid-template-columns:1fr;gap:12px}.grid{grid-template-columns:repeat(2,1fr)}.flow{flex-direction:column}.arrow{transform:rotate(90deg)}.benefits{grid-template-columns:1fr}.section{padding:60px 0}}@media(max-width:450px){.grid{grid-template-columns:1fr}.overview dl div{grid-template-columns:1fr}.diagram{padding:20px}}
/* 狭い画面での文字の折り返しとタップ領域 */
.header nav a { display: inline-block; padding: 6px 0; }
.brand, .overview dd, .grid p, .diagram, footer { overflow-wrap: anywhere; }
@media(max-width:450px){
 .wrap { width: calc(100% - 32px); }
 .header { padding: 16px; }
 .header nav { gap: 8px 18px; }
 .node { min-width: 0; }
 .diagram figcaption { flex-wrap: wrap; }
 .contact p br { display: none; }
}
