.huage-structure { margin-block:48px; padding-block:32px; border-block:1px solid #9996; color:inherit; min-width:0; }
.huage-structure * { box-sizing:border-box; }
.huage-structure > h2 { margin:0 0 24px; font-size:clamp(24px,2.5vw,32px); line-height:1.4; font-weight:400; }
.huage-structure .huage-structure-date { display:block; margin-top:8px; font-size:12px; font-weight:400; font-style:normal; line-height:1.6; opacity:.65; }
.huage-structure h2,.huage-structure h3 { font-family:inherit; }
.huage-structure-layout { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:24px; align-items:start; }
.huage-structure figure { min-width:0; margin:0; }
.huage-structure-visual { position:relative; overflow:hidden; border-radius:14px; background:#f7f4ee; }
.huage-structure .huage-structure-visual img { display:block; width:100%; max-width:none; height:auto; aspect-ratio:1280/853; object-fit:contain; margin:0; }
.huage-structure .huage-structure-dot { position:absolute; display:grid; place-items:center; width:28px; height:28px; border:2px solid #fff; border-radius:50%; background:#302b25; color:#fff; font:600 13px/1 sans-serif; text-decoration:none; box-shadow:0 1px 7px #0005; transform:translate(-50%,-50%); }
.huage-structure-dot:focus-visible { outline:3px solid #aa7b31; outline-offset:3px; }
.huage-structure figcaption { margin:12px 0 0; font-size:13px; line-height:1.75; color:inherit; opacity:.75; text-align:start; letter-spacing:normal; word-spacing:normal; }
.huage-structure .huage-structure-parts { display:grid; grid-template-columns:1fr; gap:0; margin:0; padding:0; }
.huage-structure .huage-structure-parts > div { display:block; min-width:0; border-bottom:1px solid #9994; padding:0 0 16px; margin:0 0 16px; scroll-margin-top:190px; }
.huage-structure .huage-structure-parts dt,.huage-structure .huage-structure-parts dd { width:auto; max-width:none; padding:0; text-align:start; }
.huage-structure-parts dt { font-size:17px; line-height:1.5; font-weight:600; margin:0 0 8px; }
.huage-structure-parts dd { font-size:15px; line-height:1.85; margin:0; }
.huage-structure-example { padding-top:24px; margin-top:8px; border-top:1px solid #9994; }
.huage-structure .huage-structure-example h3 { margin:0 0 16px; font-size:20px; line-height:1.5; }
.huage-structure .huage-structure-example dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 24px; margin:0 0 20px; }
.huage-structure .huage-structure-example dl > div { display:block; min-width:0; }
.huage-structure-example dt { font-size:13px; line-height:1.6; opacity:.7; }
.huage-structure-example dd { font-size:15px; line-height:1.75; margin:4px 0 0; }
.huage-structure .huage-structure-reference { font-size:13px; line-height:1.8; margin:24px 0 0; }
.huage-structure-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.huage-structure .huage-structure-card { display:block; min-width:0; text-decoration:none; }
.huage-structure .huage-structure-card img { display:block; width:100%; height:auto; aspect-ratio:640/427; border-radius:12px; object-fit:contain; margin:0 0 12px; }
.huage-structure .huage-structure-card span { font-size:17px; line-height:1.6; text-decoration:underline; text-underline-offset:4px; }
@media(max-width:1000px) {
 .huage-structure-layout { grid-template-columns:1fr; }
 .huage-structure-parts { margin-top:8px; }
}
@media(max-width:600px) {
 .huage-structure { margin-block:32px; padding-block:24px; }
 .huage-structure-cards,.huage-structure .huage-structure-example dl { grid-template-columns:1fr; }
 .huage-structure .huage-structure-dot { width:26px; height:26px; font-size:12px; }
 .huage-structure-parts > div { scroll-margin-top:112px; }
}