@charset "utf-8"; @layer base, font, low, main, high; @layer main { @media (min-width: 800px) { .qrill-feb7f04d { display: block; position: fixed; inset: 0; transition: all 0.3s ease allow-discrete; z-index: 8; backdrop-filter: blur(4px); opacity: 0; pointer-events: none; } } } @layer main { @media (min-width: 800px) { .search-panel-state-c4f3ae8:checked ~ .qrill-feb7f04d { opacity: 1; pointer-events: unset; } } } @layer main { @media (min-width: 800px) { .qrill-4bb22d0e { display: block; position: fixed; inset: 0; transition: all 0.3s ease allow-discrete; z-index: 8; backdrop-filter: blur(4px); opacity: 0; pointer-events: none; } } } @layer main { @media (min-width: 800px) { .search-panel-state-c4f3ae8:checked ~ .qrill-4bb22d0e { opacity: 1; pointer-events: unset; } } } @layer main { @media (min-width: 800px) { .qrill-feb7f04d { background: rgb(253 254 254); margin-block: 3rem; max-width: 1200px; width: 100%; padding-inline: 1rem; margin-inline: auto; } } } @layer main { @media (min-width: 800px) { .qrill-feb7f04d { display: flex; flex-direction: column; padding: 1rem; color: rgb(100 116 139); } } } @layer main { @media (min-width: 800px) { .qrill-feb7f04d { transition: all 0.25s ease-in-out; } } } @layer main { @media (min-width: 800px) { .qrill-feb7f04d:hover { transform: translateY(-2px); } } } @layer main { @media (min-width: 800px) { .qrill-feb7f04d { background: linear-gradient(180deg, rgb(248 250 252) 0%, rgb(253 254 254) 100%);; border-radius: 16px; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); } } } @layer main { @media (min-width: 800px) { .qrill-feb7f04d:hover { box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.15); } } } @layer main { @media (max-width: 799px) { .qrill-feb7f04d { display: block; position: fixed; inset: 0; transition: all 0.3s ease allow-discrete; z-index: 8; transform: translateY(-120%); } } } @layer main { @media (max-width: 799px) { .search-panel-state-c4f3ae8:checked ~ .qrill-feb7f04d { transform: translateY(0); } } } @layer main { @media (max-width: 799px) { .qrill-feb7f04d { background: rgb(253 254 254); padding: 1rem; } } } @layer main { .qrill-feb7f04d { display: flex; flex-direction: column; gap: 1rem; } } @layer main { .search-result-aba3fbd6 { flex-grow: 1; overflow-y: scroll; } } @layer main { .qrill-39ba6179 { display: flex; flex-direction: row; align-items: center; justify-content: space-between; } } @layer main { .qrill-86b49e3a { font-size: 2rem; } } @layer main { .qrill-9fc5e7f7 { font-size: 2rem; } } @layer main { .qrill-d3aedafb { border-radius: 12px; background: rgb(253 254 254); border: 2px solid rgba(71 85 105 / 0.4); padding: 1rem 1rem; display: flex; flex-direction: row; align-items: center; gap: 1rem; } } @layer main { .search-input-ffa2e3a6 { width: 100%; } } @layer main { .qrill-d3aedafb:has(.search-input-ffa2e3a6:focus) { border: 3px solid rgb(59 130 246); } } @layer main { @media (min-width: 800px) { .qrill-ea47cd2a { display: flex; justify-content: space-between; align-items: center; gap: 2rem; } } } @layer main { @media (min-width: 800px) { .qrill-374209eb { display: flex; justify-content: center; align-items: center; gap: 1rem; } } } @layer main { @media (min-width: 800px) { .qrill-80af8798 { display: flex; justify-content: center; align-items: center; gap: 1rem; } } } @layer main { @media (min-width: 800px) { .qrill-1aa4011a { display: none; } } } @layer main { @media (max-width: 799px) { .qrill-374209eb { flex-direction: column; width: 100%; } } } @layer main { @media (max-width: 799px) { .qrill-80af8798 { display: flex; align-items: center; gap: 1rem; width: 100%; padding: 1rem 3rem; justify-content: space-between; border-block-start: 1px solid rgba(71 85 105 / 0.4); } } } @layer main { @media (max-width: 799px) { .qrill-843c46ac { width: 100%; border-radius: 12px; } } } @layer main { @media (max-width: 799px) { .qrill-843c46ac:hover { background: rgba(59 130 246 / 0.1); } } } @layer main { @media (max-width: 799px) { .qrill-d136836d { display: block; padding: 1rem 2rem; } } } @layer main { @media (max-width: 799px) { .qrill-1aa4011a { display: inline; margin-inline: 1rem; } } } @layer main { @media (max-width: 799px) { .qrill-cda9c459 { font-size: 2rem; } } } @layer main { @media (min-width: 800px) { .qrill-624b1f3d { display: none; } } } @layer main { @media (min-width: 800px) { .qrill-9d4d9069 { display: none; } } } @layer main { @media (min-width: 800px) { .qrill-c856a5bb { display: flex; flex-direction: row; align-items: center; gap: 1rem; } } } @layer main { @media (min-width: 800px) { .search-open-47ff3f60 { width: 100%; border-radius: 12px; background: rgb(241 245 249); border: 2px solid rgba(71 85 105 / 0.4); padding: 0.25rem 1rem; } } } @layer main { @media (min-width: 800px) { .svg-icon-font-solid-magnifying-glass-59f61cd6 { margin-inline-end: 1rem; } } } @layer main { @media (max-width: 799px) { .qrill-c856a5bb { display: block; position: fixed; inset: 0; transition: all 0.3s ease allow-discrete; z-index: 6; transform: translateX(140%); } } } @layer main { @media (max-width: 799px) { .nav-panel-state-a0545885:checked ~ .qrill-c856a5bb { transform: translateX(0); } } } @layer main { @media (max-width: 799px) { .qrill-1550e27c { display: block; position: fixed; inset: 0; transition: all 0.3s ease allow-discrete; z-index: 6; backdrop-filter: blur(4px); opacity: 0; pointer-events: none; } } } @layer main { @media (max-width: 799px) { .nav-panel-state-a0545885:checked ~ .qrill-1550e27c { opacity: 1; pointer-events: unset; } } } @layer main { @media (max-width: 799px) { .qrill-624b1f3d { display: block; } } } @layer main { @media (max-width: 799px) { .qrill-fc3f98bf { display: block; } } } @layer main { @media (max-width: 799px) { .qrill-c856a5bb { position: fixed; top: 0; right: 0; left: unset; width: 75%; height: 100%; display: flex; flex-direction: column; justify-content: flex-start; background: rgb(241 245 249); padding: 1.5rem; font-size: 1.5rem; gap: 1rem; } } } @layer main { @media (max-width: 799px) { .qrill-9d4d9069 { display: flex; align-items: center; justify-content: space-between; } } } @layer main { @media (max-width: 799px) { .search-open-47ff3f60 { width: 100%; border-radius: 12px; background: rgb(241 245 249); border: 2px solid rgba(71 85 105 / 0.4); padding: 1rem 3rem; } } } @layer main { @media (max-width: 799px) { .svg-icon-font-solid-magnifying-glass-59f61cd6 { margin-inline-end: 1rem; } } } @layer main { .qrill-30da83c7 { max-width: 1200px; width: 100%; padding-inline: 1rem; margin-inline: auto; display: flex; justify-content: space-between; align-items: start; padding: 1rem; } } @layer main { .qrill-cacefd49 { font-size: 1.25rem; font-weight: bold; font-style: normal; line-height: 1.0; } } @layer main { .qrill-17c93a0a { font-size: 0.875rem; color: rgb(100 116 139); } } @layer main { .page-footer-fcd47a42 { background: rgb(241 245 249); margin-block-start: 1.5rem; } } @layer main { .qrill-bd78584e { max-width: 1200px; width: 100%; padding-inline: 1rem; margin-inline: auto; padding-block: 3rem; color: rgb(100 116 139); display: flex; flex-direction: row; align-items: start; justify-content: space-between; flex-wrap: wrap; gap: 3rem; } } @layer main { .qrill-6e5d5fb { display: flex; flex-direction: row; align-items: center; } } @layer main { .qrill-6e5d5fb > .qrill-53e012bc:nth-child(n+2) { padding-inline-start: 0.5rem; border-inline-start: 1px solid rgba(100 116 139 / 0.4); } } @layer main { .qrill-6e5d5fb > .qrill-53e012bc:nth-last-child(n+2) { padding-inline-end: 0.5rem; } } @layer base { *, *:before, *:after { margin: 0; padding: 0; border: 0; box-sizing: border-box; font: inherit; color: inherit; } } @layer base { a { text-decoration: inherit; } } @layer base { button { cursor: pointer; } } @layer base { input { width: 100%; border: 0 none; outline: none; } } @layer base { img, video, canvas, svg { display: block; max-width: 100%; height: auto; } } @layer base { :root { font-size: 16px; line-height: 1.6; font-family: Helvetica Neue, Arial, Hiragino Kaku Gothic ProN, Hiragino Sans, Noto Sans JP, Meiryo, sans-serif; } } @layer base { body { background-color: rgb(253 254 254); color: rgb(15 23 42); } } @layer base { ul, ol, menu { list-style-type: none; } } @layer main { .qrill-e3e04706 { position: fixed; top: 0; right: 0; left: 0; z-index: 4; background-color: rgb(253 254 254); } } @layer main { .contents-cc7f3c96 { padding-block: 74px; } } @layer main { .qrill-5cbff06e { display: flex; gap: 0.25rem; align-items: center; } } @layer main { .svg-icon-font-solid-user-73098149 { font-size: 2rem; } } @layer main { .qrill-5933315a { display: inline; width: 2rem; } } @layer main { .qrill-a62d6e1b { display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 1rem; } } @layer main { .qrill-f327aadc { font-size: 1.125rem; font-weight: bold; border-radius: 64px; border: 0 none; padding: 2px 1.5rem; color: rgb(253 254 254); } } @layer main { .qrill-f327aadc { background: linear-gradient(135deg, rgb(96 165 250) 0%, rgb(37 99 235) 100%); border: none; box-shadow: none; } } @layer main { .qrill-4021e79d { font-size: 1.5rem; font-weight: bold; color: #6366f1; } } @layer main { .qrill-d4c34281 { display: flex; flex-direction: column; gap: 0.5rem; } } @layer main { .qrill-21bd7f42 { font-size: 2rem; font-weight: bold; line-height: 1.3; } } @layer main { .date-time-2d14a3a0 { color: rgb(100 116 139); font-weight: bold; } } @layer main { .tag-area-af1b9549 { display: inline-flex; gap: 0.25rem; } } @layer main { .tag-85f03e24 { font-size: 0.875rem; font-weight: bold; color: #0284c7; border-radius: 32px; border: 2px solid #bae6fd; background-color: #f0f9ff; padding: 2px 1.5rem; } } @layer main { .tag-area-af1b9549 { display: flex; } } @layer main { .qrill-5cbff06e { font-weight: bold; } } @layer main { @media (min-width: 800px) { .qrill-5cbff06e { display: none; } } } @layer main { .qrill-926f42fc { display: flex; justify-content: space-between; cursor: pointer; } } @layer main { .qrill-af0d4bcd { display: flex; align-items: center; gap: 0.5rem; font-size: 1.25rem; color: rgb(15 23 42); } } @layer main { .qrill-62130f0c { display: flex; flex-direction: column; justify-content: center; } } @layer main { @media (min-width: 800px) { .qrill-fc07888e::before { content: 'クリック'; } } } @layer main { @media (max-width: 799px) { .qrill-fc07888e::before { content: 'タップ'; } } } @layer main { .qrill-fc07888e::after { content: '展開'; } } @layer main { .toc-state-91ebe5c0:checked ~ .qrill-926f42fc .qrill-fc07888e::after { content: '折りたたみ'; } } @layer main { .qrill-df697fbd::before { content: '◀'; font-size: 1.5rem; } } @layer main { .toc-state-91ebe5c0:checked ~ .qrill-926f42fc .qrill-df697fbd::before { content: '▼'; } } @layer main { .qrill-2c63bc7e { overflow: hidden; counter-reset: h3 0; padding-inline-start: 3rem; } } @layer main { .toc-state-91ebe5c0 ~ .qrill-2c63bc7e { height: 0; transition: all 0.2s ease; } } @layer main { .toc-state-91ebe5c0:checked ~ .qrill-2c63bc7e { height: calc-size(fit-content, size); } } @layer main { .toc-item-main-2b7269f0::marker { content: '第'counter(h3)'回'; font-weight: bold; font-size: 1rem; color: rgb(15 23 42); } } @layer main { .toc-item-main-2b7269f0 { position: relative; color: rgb(15 23 42); margin-block: 1rem; padding-inline-start: 1rem; counter-increment: h3; font-size: 0.875rem; } } @layer main { .qrill-795df93f { color: rgb(15 23 42); font-weight: bold; margin-block: 1rem; } } @layer main { .toc-item-sub-a16a96f6::before { position: absolute; content: '■'; left: -1.5rem; } } @layer main { .toc-item-sub-a16a96f6 { position: relative; font-weight: bold; margin-block: 0.5rem; } } @layer main { .qrill-18a5915f { display: flex; justify-content: space-between; cursor: pointer; } } @layer main { .qrill-35439a30 { display: flex; align-items: center; gap: 0.5rem; font-size: 1.25rem; color: rgb(15 23 42); } } @layer main { .qrill-e8495d6f { display: flex; flex-direction: column; justify-content: center; } } @layer main { @media (min-width: 800px) { .qrill-823dd6f1::before { content: 'クリック'; } } } @layer main { @media (max-width: 799px) { .qrill-823dd6f1::before { content: 'タップ'; } } } @layer main { .qrill-823dd6f1::after { content: '展開'; } } @layer main { .toc-state-57a11a0d:checked ~ .qrill-18a5915f .qrill-823dd6f1::after { content: '折りたたみ'; } } @layer main { .qrill-659fce20::before { content: '◀'; font-size: 1.5rem; } } @layer main { .toc-state-57a11a0d:checked ~ .qrill-18a5915f .qrill-659fce20::before { content: '▼'; } } @layer main { .qrill-b29a0ae1 { margin-inline: 1.25rem; padding-inline: 2rem; overflow: hidden; counter-reset: h3 0; list-style-position: outside; } } @layer main { .toc-state-57a11a0d ~ .qrill-b29a0ae1 { height: 0; transition: all 0.2s ease; } } @layer main { .toc-state-57a11a0d:checked ~ .qrill-b29a0ae1 { height: calc-size(fit-content, size); } } @layer main { .toc-item-main-7e366b53::before { content: counter(h3); margin-inline-end: 1rem; background: rgb(22 32 51); color: rgb(203 213 225); border-radius: 50%; padding-inline: 8px; position: absolute; left: -2rem; } } @layer main { .toc-item-main-7e366b53 { position: relative; color: rgb(15 23 42); font-weight: bold; margin-block: 1rem; counter-increment: h3; } } @layer main { .qrill-ff9447a2 { color: rgb(15 23 42); font-weight: bold; margin-block: 1rem; } } @layer main { .toc-item-sub-bb3277f9::before { position: absolute; content: '■'; left: -1.5rem; } } @layer main { .toc-item-sub-bb3277f9 { position: relative; font-weight: bold; margin-block: 0.5rem; } } @layer main { .qrill-8790f58f { display: flex; justify-content: space-around; margin-block-start: 1.25rem; } } @layer main { .svg-icon-font-brands-x-twitter-6f11f583 { font-size: 1.5rem; color: rgb(253 254 254); background: rgb(15 23 42); padding: 0.6rem; border-radius: 50%; } } @layer main { .markdown-html-8dc09c1e { display: flex; flex-direction: column; gap: 2rem; overflow-wrap: anywhere; text-align: justify; counter-reset: h3 0; } } @layer main { .markdown-html-8dc09c1e h3::before { content: counter(h3); border-radius: 50%; padding-inline: 6px; color: rgb(203 213 225); background: rgb(22 32 51); margin-inline-end: 0.5rem; } } @layer main { .markdown-html-8dc09c1e h3 { counter-increment: h3; font-size: 1.25rem; margin-block: 3rem 0; border-bottom: 2px solid rgba(22 32 51 / 0.3); } } @layer main { .markdown-html-8dc09c1e h4::before { content: '▶'; margin-inline-end: 8px; } } @layer main { .markdown-html-8dc09c1e h4 { font-size: 1.125rem; color: rgba(71 85 105 / 0.8); } } @layer main { .markdown-html-8dc09c1e h5::before { content: '■'; } } @layer main { .markdown-html-8dc09c1e h5 { color: rgba(71 85 105 / 0.7); } } @layer main { .markdown-html-8dc09c1e a { text-decoration: underline 2px; text-underline-offset: 5px; } } @layer main { .markdown-html-8dc09c1e ul { list-style-type: disc; } } @layer main { .markdown-html-8dc09c1e ol { list-style-type: number; } } @layer main { .markdown-html-8dc09c1e li { margin-inline-start: 2rem; } } @layer main { .markdown-html-8dc09c1e p { text-indent: 1rem; } } @layer main { .markdown-html-8dc09c1e input[type='checkbox'] { display: inline; width: revert; } } @layer main { .markdown-html-8dc09c1e strong { font-weight: bold; } } @layer main { .markdown-html-8dc09c1e li.task-list-item { list-style-type: none; list-style-position: outside; margin-inline-start: 0px; } } @layer main { @media (max-width: 799px) { .markdown-html-8dc09c1e h3 { scroll-margin-block-start: 180px; } } } @layer main { @media (max-width: 799px) { .markdown-html-8dc09c1e h4 { scroll-margin-block-start: 180px; } } } @layer main { @media (min-width: 800px) { .markdown-html-8dc09c1e h3 { scroll-margin-block-start: 100px; } } } @layer main { @media (min-width: 800px) { .markdown-html-8dc09c1e h4 { scroll-margin-block-start: 100px; } } } @layer main { .markdown-html-8dc09c1e table { width: 100%; border-collapse: collapse; } } @layer main { .markdown-html-8dc09c1e table th { font-weight: bold; border-bottom: 2px solid rgba(22 32 51 / 0.3); padding: 0.5rem; } } @layer main { .markdown-html-8dc09c1e tbody td { border-bottom: 1px solid rgba(22 32 51 / 0.1); padding-block: 0.5rem; } } @layer main { .markdown-html-8dc09c1e tbody tr:nth-child(even) { background: rgba(22 32 51 / 0.05); } } @layer main { .qrill-87c905c0 { display: flex; flex-direction: column; gap: 1rem; scroll-margin-block-start: 100px; } } @layer main { .qrill-da16611f { aspect-ratio: 16/9; } } @layer main { @media (min-width: 800px) { .base-card-c178fc7e { display: none; } } } @layer main { @media (min-width: 800px) { .base-card-fd25c461 { display: none; } } } @layer main { @media (min-width: 800px) { .base-card-89f2292b { display: none; } } } @layer main { @media (max-width: 799px) { .base-card-c178fc7e { display: flex; flex-direction: column; padding: 1rem; color: rgb(100 116 139); } } } @layer main { @media (max-width: 799px) { .base-card-c178fc7e { transition: all 0.25s ease-in-out; } } } @layer main { @media (max-width: 799px) { .base-card-c178fc7e:hover { transform: translateY(-2px); } } } @layer main { @media (max-width: 799px) { .base-card-c178fc7e { background: linear-gradient(180deg, rgb(248 250 252) 0%, rgb(253 254 254) 100%);; border-radius: 16px; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); } } } @layer main { @media (max-width: 799px) { .base-card-c178fc7e:hover { box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.15); } } } @layer main { @media (max-width: 799px) { .base-card-fd25c461 { display: flex; flex-direction: column; padding: 1rem; color: rgb(100 116 139); } } } @layer main { @media (max-width: 799px) { .base-card-fd25c461 { transition: all 0.25s ease-in-out; } } } @layer main { @media (max-width: 799px) { .base-card-fd25c461:hover { transform: translateY(-2px); } } } @layer main { @media (max-width: 799px) { .base-card-fd25c461 { background: linear-gradient(180deg, rgb(248 250 252) 0%, rgb(253 254 254) 100%);; border-radius: 16px; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); } } } @layer main { @media (max-width: 799px) { .base-card-fd25c461:hover { box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.15); } } } @layer main { @media (max-width: 799px) { .base-card-fd25c461 { position: sticky; top: 80px; } } } @layer main { @media (max-width: 799px) { .base-card-89f2292b { display: flex; flex-direction: column; padding: 1rem; color: rgb(100 116 139); } } } @layer main { @media (max-width: 799px) { .base-card-89f2292b { transition: all 0.25s ease-in-out; } } } @layer main { @media (max-width: 799px) { .base-card-89f2292b:hover { transform: translateY(-2px); } } } @layer main { @media (max-width: 799px) { .base-card-89f2292b { background: linear-gradient(180deg, rgb(248 250 252) 0%, rgb(253 254 254) 100%);; border-radius: 16px; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); } } } @layer main { @media (max-width: 799px) { .base-card-89f2292b:hover { box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.15); } } } @layer main { .qrill-3a96b8ce { font-size: 1.25rem; color: rgb(15 23 42); } } @layer main { .qrill-73d2ca70 { display: flex; justify-content: space-between; cursor: pointer; } } @layer main { .qrill-38d05944 { display: flex; align-items: center; gap: 0.5rem; font-size: 1.25rem; color: rgb(15 23 42); } } @layer main { .qrill-ebd61c83 { display: flex; flex-direction: column; justify-content: center; } } @layer main { @media (min-width: 800px) { .qrill-85ca9605::before { content: 'クリック'; } } } @layer main { @media (max-width: 799px) { .qrill-85ca9605::before { content: 'タップ'; } } } @layer main { .qrill-85ca9605::after { content: '展開'; } } @layer main { .toc-state-89f6739e:checked ~ .qrill-73d2ca70 .qrill-85ca9605::after { content: '折りたたみ'; } } @layer main { .qrill-c0cd0731::before { content: '◀'; font-size: 1.5rem; } } @layer main { .toc-state-89f6739e:checked ~ .qrill-73d2ca70 .qrill-c0cd0731::before { content: '▼'; } } @layer main { .qrill-dc743f2 { margin-inline: 1.25rem; padding-inline: 2rem; overflow: hidden; counter-reset: h3 0; list-style-position: outside; } } @layer main { .toc-state-89f6739e ~ .qrill-dc743f2 { height: 0; transition: all 0.2s ease; } } @layer main { .toc-state-89f6739e:checked ~ .qrill-dc743f2 { height: calc-size(fit-content, size); } } @layer main { .toc-item-main-1facb6ce::before { content: counter(h3); margin-inline-end: 1rem; background: rgb(22 32 51); color: rgb(203 213 225); border-radius: 50%; padding-inline: 8px; position: absolute; left: -2rem; } } @layer main { .toc-item-main-1facb6ce { position: relative; color: rgb(15 23 42); font-weight: bold; margin-block: 1rem; counter-increment: h3; } } @layer main { .qrill-5ac180b3 { color: rgb(15 23 42); font-weight: bold; margin-block: 1rem; } } @layer main { .toc-item-sub-62ffc014::before { position: absolute; content: '■'; left: -1.5rem; } } @layer main { .toc-item-sub-62ffc014 { position: relative; font-weight: bold; margin-block: 0.5rem; } } @layer main { .qrill-fa0918d3 { display: flex; justify-content: space-between; cursor: pointer; } } @layer main { .qrill-bf06a7a7 { display: flex; align-items: center; gap: 0.5rem; font-size: 1.25rem; color: rgb(15 23 42); } } @layer main { .qrill-720c6ae6 { display: flex; flex-direction: column; justify-content: center; } } @layer main { @media (min-width: 800px) { .qrill-c62025cf::before { content: 'クリック'; } } } @layer main { @media (max-width: 799px) { .qrill-c62025cf::before { content: 'タップ'; } } } @layer main { .qrill-c62025cf::after { content: '展開'; } } @layer main { .toc-state-c5a33b81:checked ~ .qrill-fa0918d3 .qrill-c62025cf::after { content: '折りたたみ'; } } @layer main { .qrill-47035594::before { content: '◀'; font-size: 1.5rem; } } @layer main { .toc-state-c5a33b81:checked ~ .qrill-fa0918d3 .qrill-47035594::before { content: '▼'; } } @layer main { .qrill-f67c59bf { overflow: hidden; counter-reset: h3 0; padding-inline-start: 3rem; } } @layer main { .toc-state-c5a33b81 ~ .qrill-f67c59bf { height: 0; transition: all 0.2s ease; } } @layer main { .toc-state-c5a33b81:checked ~ .qrill-f67c59bf { height: calc-size(fit-content, size); } } @layer main { .toc-item-main-7270b831::marker { content: '第'counter(h3)'回'; font-weight: bold; font-size: 1rem; color: rgb(15 23 42); } } @layer main { .toc-item-main-7270b831 { position: relative; color: rgb(15 23 42); margin-block: 1rem; padding-inline-start: 1rem; counter-increment: h3; font-size: 0.875rem; } } @layer main { .qrill-43769680 { color: rgb(15 23 42); font-weight: bold; margin-block: 1rem; } } @layer main { .toc-item-sub-7cc7a117::before { position: absolute; content: '■'; left: -1.5rem; } } @layer main { .toc-item-sub-7cc7a117 { position: relative; font-weight: bold; margin-block: 0.5rem; } } @layer main { .qrill-11540306 { display: flex; justify-content: space-around; margin-block-start: 1.25rem; } } @layer main { .svg-icon-font-brands-x-twitter-366ee6da { font-size: 1.5rem; color: rgb(253 254 254); background: rgb(15 23 42); padding: 0.6rem; border-radius: 50%; } } @layer main { .author-card-ccc540e7 { display: flex; flex-direction: column; gap: 1.125rem; margin-block: 1.25rem; } } @layer main { .qrill-9950b0f3 { font-size: 1.25rem; color: rgb(15 23 42); } } @layer main { @media (max-width: 799px) { .qrill-4c567432 { display: flex; flex-direction: column; padding: 1rem; color: rgb(100 116 139); } } } @layer main { @media (max-width: 799px) { .qrill-4c567432 { transition: all 0.25s ease-in-out; } } } @layer main { @media (max-width: 799px) { .qrill-4c567432:hover { transform: translateY(-2px); } } } @layer main { @media (max-width: 799px) { .qrill-4c567432 { background: linear-gradient(180deg, rgb(248 250 252) 0%, rgb(253 254 254) 100%);; border-radius: 16px; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); } } } @layer main { @media (max-width: 799px) { .qrill-4c567432:hover { box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.15); } } } @layer main { .qrill-4c567432 { display: flex; flex-direction: column; gap: 2rem; } } @layer main { .qrill-e64aedb4 { display: flex; align-items: center; } } @layer main { .svg-icon-font-solid-user-e7e00ccf { font-size: 96px; } } @layer main { .qrill-e0c59ce7 { display: inline; width: 96px; } } @layer main { .qrill-7aba1669 { font-size: 1.125rem; font-weight: bold; color: rgb(15 23 42); } } @layer main { .qrill-c7b4532a { font-size: 1.125rem; font-weight: bold; color: rgb(100 116 139); } } @layer main { .qrill-14ae8feb { color: rgb(71 85 105); } } @layer main { .qrill-61a8ccac { display: flex; flex-direction: column; color: rgb(15 23 42); gap: 0.5rem; } } @layer main { .qrill-fb9d462e { font-size: 1.25rem; } } @layer main { .qrill-489782ef { color: rgb(100 116 139); } } @layer main { .qrill-d09430dc { color: rgb(100 116 139); } } @layer main { .qrill-1d8e6d9d { font-weight: bold; color: rgb(15 23 42); } } @layer main { .date-eee94e02 { color: rgb(100 116 139); } } @layer main { .contents-cc7f3c96 { max-width: 1200px; width: 100%; padding-inline: 1rem; margin-inline: auto; display: flex; gap: 1rem; } } @layer main { .qrill-edd48c3e { max-width: 30%; flex-shrink: 1; } } @layer main { .qrill-a0da4f7d { max-width: 70%; flex-shrink: 3; } } @layer main { @media (max-width: 799px) { .contents-cc7f3c96 { flex-direction: column; } } } @layer main { @media (max-width: 799px) { .qrill-edd48c3e { max-width: 100%; } } } @layer main { @media (max-width: 799px) { .qrill-a0da4f7d { max-width: 100%; } } } @layer main { @media (max-width: 799px) { .qrill-a0da4f7d { max-width: 1200px; width: 100%; padding-inline: 1rem; margin-inline: auto; margin-block: 1.5rem; position: relative; } } } @layer main { @media (max-width: 799px) { .qrill-edd48c3e { max-width: 1200px; width: 100%; padding-inline: 1rem; margin-inline: auto; } } } @layer main { @media (max-width: 799px) { .base-card-f530523f { display: none; } } } @layer main { @media (max-width: 799px) { .base-card-b9838a5c { display: none; } } } @layer main { @media (max-width: 799px) { .qrill-61a8ccac { margin-block: 1.5rem; } } } @layer main { @media (max-width: 799px) { .qrill-9591bfb0 { display: flex; flex-direction: column; gap: 0.5rem; } } } @layer main { @media (max-width: 799px) { .base-card-30dd1a22 { display: flex; flex-direction: column; padding: 1rem; color: rgb(100 116 139); } } } @layer main { @media (max-width: 799px) { .base-card-30dd1a22 { transition: all 0.25s ease-in-out; } } } @layer main { @media (max-width: 799px) { .base-card-30dd1a22:hover { transform: translateY(-2px); } } } @layer main { @media (max-width: 799px) { .base-card-30dd1a22 { background: linear-gradient(180deg, rgb(248 250 252) 0%, rgb(253 254 254) 100%);; border-radius: 16px; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); } } } @layer main { @media (max-width: 799px) { .base-card-30dd1a22:hover { box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.15); } } } @layer main { .qrill-c459c645 { font-size: 1.25rem; color: rgb(15 23 42); } } @layer main { @media (max-width: 799px) { .base-card-c2d2d876 { display: flex; flex-direction: column; padding: 1rem; color: rgb(100 116 139); } } } @layer main { @media (max-width: 799px) { .base-card-c2d2d876 { transition: all 0.25s ease-in-out; } } } @layer main { @media (max-width: 799px) { .base-card-c2d2d876:hover { transform: translateY(-2px); } } } @layer main { @media (max-width: 799px) { .base-card-c2d2d876 { background: linear-gradient(180deg, rgb(248 250 252) 0%, rgb(253 254 254) 100%);; border-radius: 16px; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); } } } @layer main { @media (max-width: 799px) { .base-card-c2d2d876:hover { box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.15); } } } @layer main { @media (min-width: 800px) { .qrill-3acec8ff { display: flex; flex-direction: column; padding: 1rem; color: rgb(100 116 139); } } } @layer main { @media (min-width: 800px) { .qrill-3acec8ff { transition: all 0.25s ease-in-out; } } } @layer main { @media (min-width: 800px) { .qrill-3acec8ff:hover { transform: translateY(-2px); } } } @layer main { @media (min-width: 800px) { .qrill-3acec8ff { background: linear-gradient(180deg, rgb(248 250 252) 0%, rgb(253 254 254) 100%);; border-radius: 16px; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); } } } @layer main { @media (min-width: 800px) { .qrill-3acec8ff:hover { box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.15); } } } @layer main { @media (min-width: 800px) { .qrill-edd48c3e { position: relative; } } } @layer main { @media (min-width: 800px) { .qrill-3acec8ff { display: flex; flex-direction: column; position: sticky; top: 74px; max-height: calc(100vh - 74px); overflow-y: auto; } } } @layer main { @media (min-width: 800px) { .qrill-3acec8ff > *:nth-child(n+2) { padding-block-start: 0.5rem; border-block-start: 1px solid rgba(100 116 139 / 0.8); } } } @layer main { @media (min-width: 800px) { .qrill-3acec8ff > *:nth-last-child(n+2) { padding-block-end: 0.5rem; } } } @layer main { @media (min-width: 800px) { .qrill-9591bfb0 > .base-card-c2d2d876:nth-child(n+2) { padding-block-start: 0.5rem; border-block-start: 1px solid rgba(100 116 139 / 0.8); } } } @layer main { @media (min-width: 800px) { .qrill-9591bfb0 > .base-card-c2d2d876:nth-last-child(n+2) { padding-block-end: 0.5rem; } } } @layer main { .result-card-ab52a42c { display: flex; flex-direction: column; padding: 1rem; color: rgb(100 116 139); } } @layer main { .result-card-ab52a42c { transition: all 0.25s ease-in-out; } } @layer main { .result-card-ab52a42c:hover { transform: translateY(-2px); } } @layer main { .result-card-ab52a42c { background: linear-gradient(180deg, rgb(248 250 252) 0%, rgb(253 254 254) 100%);; border-radius: 16px; box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); } } @layer main { .result-card-ab52a42c:hover { box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.15); } } @layer main { .tag-area-7545596b { display: inline-flex; gap: 0.25rem; } } @layer main { .tag-f0646506 { font-size: 0.875rem; font-weight: bold; color: #0284c7; border-radius: 32px; border: 2px solid #bae6fd; background-color: #f0f9ff; padding: 2px 1.5rem; } } @layer main { .qrill-b3f6280b { font-size: 1.25rem; font-weight: bold; color: rgb(15 23 42); } } @layer main { .qrill-e7df1b0f strong { font-weight: bold; color: rgb(59 130 246); } } @layer main { .result-card-list-98915314 { display: flex; flex-direction: column; gap: 1rem; } } @font-face { font-family: 'fontawesome free generated'; font-style: normal; font-weight: 400; font-display: block; src: url("/blog/posts/%5Bslug%5D.woff2") format("woff2"); } @layer font { .hf { font-family: 'fontawesome free generated'; font-style: normal; font-weight: normal; vertical-align: -0.125em; } } @layer font { .hf::before { content: var(--hf); } } @layer font { .hf-solid-xmark { --hf: "\e000"; } } @layer font { .hf-solid-magnifying-glass { --hf: "\e001"; } } @layer font { .hf-solid-bars { --hf: "\e002"; } } @layer font { .hf-solid-xmark { --hf: "\e003"; } } @layer font { .hf-brands-github { --hf: "\e004"; } } @layer font { .hf-brands-x-twitter { --hf: "\e005"; } } @layer font { .hf-brands-youtube { --hf: "\e006"; } } @layer font { .hf-solid-house { --hf: "\e007"; } } @layer font { .hf-solid-user { --hf: "\e008"; } } @layer font { .hf-solid-box { --hf: "\e009"; } } @layer font { .hf-solid-pen-to-square { --hf: "\e00a"; } } @layer font { .hf-solid-envelope { --hf: "\e00b"; } } @layer font { .hf-solid-magnifying-glass { --hf: "\e00c"; } } @layer font { .hf-solid-user { --hf: "\e00d"; } } @layer font { .hf-solid-layer-group { --hf: "\e00e"; } } @layer font { .hf-solid-book-open { --hf: "\e00f"; } } @layer font { .hf-brands-x-twitter { --hf: "\e010"; } } @layer font { .hf-solid-book-open { --hf: "\e011"; } } @layer font { .hf-solid-layer-group { --hf: "\e012"; } } @layer font { .hf-brands-x-twitter { --hf: "\e013"; } } @layer font { .hf-solid-user { --hf: "\e014"; } }