@charset "UTF-8";
/*px*/
/*px*/
/*px*/
/*px*/
/*px*/
/*rem*/
:root { --leading-trim: calc((1em - 1lh) / 2); }

:lang(en) { --leading-trim: calc((1cap - 1lh) / 2); }

@supports not (top: 1lh) { :root { --leading-trim: 0px; /* `px`などの単位が必要 */ }
  :lang(en) { --leading-trim: calc((1cap - 1lh) / 2); } }
.article a { color: #0073aa; text-decoration: underline; }
.article a:hover { color: #005f8d; }
.article h1, .article h2, .article h3, .article h4, .article h5, .article h6 { line-height: 1.4; margin-block: calc(1rem + var(--leading-trim)); font-weight: bold; }
.article h1 { font-size: 2rem; }
.article h2 { font-size: 1.75rem; }
.article h3 { font-size: 1.5rem; }
.article h4 { font-size: 1.25rem; }
.article h5 { font-size: 1rem; }
.article h6 { font-size: 0.875rem; }
.article p { margin: 1rem 0; }
.article img { max-width: 100%; height: auto; display: block; margin: 1.5rem 0; border-radius: 4px; }
.article ul, .article ol { margin: 1rem 0 1rem 2rem; }
.article ul li, .article ol li { margin-bottom: 0.5rem; }
.article blockquote { border-left: 4px solid #0073aa; padding-left: 1rem; margin: 1.5rem 0; background-color: #f9f9f9; color: #444; }
.article table { width: 100%; border-collapse: collapse; margin: 2rem 0; }
.article table th, .article table td { border: 1px solid #ddd; padding: 0.75rem; text-align: left; }
.article table th { background-color: #f1f1f1; }
.article pre, .article code { font-family: monospace; background-color: #f4f4f4; padding: 0.5rem; border-radius: 4px; }
.article pre { overflow-x: auto; margin: 1.5rem 0; }
.article__grid-section { display: grid; grid-template-columns: 1fr 2fr; gap: 1rem; }
@media (max-width: 768px) { .article__grid-section { grid-template-columns: 1fr; } }
.article__flex-row { display: flex; flex-wrap: wrap; gap: 1rem; }
.article__flex-row > * { flex: 1 1 45%; }
@media (max-width: 600px) { .article__flex-row { flex-direction: column; } }
