.note-index{padding-block:96px 128px}.note-index__head{flex-direction:column;gap:24px;margin-bottom:72px;display:flex}.note-index__lead{max-width:640px;font-size:var(--font-size-16);line-height:1.9}.note-index--category :is(.page-eyebrow,.page-title){font-family:Noto Sans JP,Noto Sans CJK JP,system-ui,sans-serif}.note-group{margin-bottom:88px;scroll-margin-top:120px}.note-group--with-link .note-card-list{margin-bottom:32px}.note-group__head{border-bottom:1px solid #d0d0d0;margin-bottom:32px;padding-bottom:16px}.note-group__title{font-size:var(--font-size-26);margin-bottom:12px;font-weight:500}.note-group__description{font-size:var(--font-size-15);color:#666;line-height:1.8}.note-card-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 32px;list-style:none;display:grid}.note-card{color:inherit;flex-direction:column;text-decoration:none;display:flex}.note-card__thumbnail{background-color:#ececec;border-radius:4px;margin-bottom:18px;display:block;overflow:hidden}.note-card__thumbnail img{width:100%;height:auto;transition:transform .4s;display:block}.note-card:hover .note-card__thumbnail img{transform:scale(1.04)}.note-card__body{flex-direction:column;flex:1;gap:10px;display:flex}.note-card__category{font-size:var(--font-size-14);color:#888}.note-card__title{font-size:var(--font-size-18);font-weight:700;line-height:1.6}.note-card:hover .note-card__title{text-underline-offset:4px;text-decoration:underline}.note-card__excerpt{font-size:var(--font-size-14);color:#666;flex:1;line-height:1.8}.note-card__date{font-size:var(--font-size-12);color:#999}@media not all and (width>=980px){.note-card-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media not all and (width>=640px){.note-index{padding-block:64px 88px}.note-index__head{margin-bottom:48px}.note-group{margin-bottom:64px}.note-card-list{grid-template-columns:minmax(0,1fr);gap:32px}}.note-detail{padding-block:56px 120px;font-family:Noto Sans JP,Noto Sans CJK JP,system-ui,sans-serif}.note-detail__inner{max-width:900px}.note-breadcrumb{font-size:var(--font-size-12);color:#888;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:40px;display:flex}.note-breadcrumb a{color:inherit}.note-breadcrumb a:hover{text-decoration:underline}.note-breadcrumb [aria-current=page]{color:#bbb}.note-detail__header{flex-direction:column;gap:16px;margin-bottom:40px;display:flex}.note-detail__eyebrow{font-size:var(--font-size-16);color:#888}.note-detail__eyebrow a{color:inherit}.note-detail__eyebrow a:hover{text-decoration:underline}.note-detail__title{font-size:clamp(1.75rem,3.4vw,2.5rem);font-weight:500;line-height:1.4}.note-detail__meta{font-size:var(--font-size-14);color:#999;flex-wrap:wrap;gap:20px;display:flex}.note-detail__thumbnail{background-color:#ececec;border-radius:6px;margin-bottom:56px;overflow:hidden}.note-detail__thumbnail img{width:100%;height:auto;display:block}.note-detail__body{font-size:var(--font-size-16);border-bottom:1px solid #dcdcdc;margin-bottom:40px;padding-bottom:40px;line-height:1.9}.note-detail__body>*{margin-bottom:32px}.note-detail__body>:last-child{margin-bottom:0}.note-detail__body p{line-height:1.95}.note-detail__body>:has(+h2){margin-bottom:128px}.note-detail__body>:has(+h3){margin-bottom:80px}.note-detail__body>:has(+h4){margin-bottom:64px}.note-detail__body :is(h2,h3,h4){scroll-margin-top:96px;font-weight:500;line-height:1.5}.note-detail__body h2{font-size:var(--font-size-26);border-bottom:1px solid #dcdcdc;margin-bottom:40px;padding-bottom:14px}.note-detail__body h3{font-size:var(--font-size-21);margin-bottom:32px}.note-detail__body h4{font-size:var(--font-size-18);margin-bottom:24px}.note-detail__body a{color:inherit;text-underline-offset:3px;text-decoration:underline 1px #bbb;transition:text-decoration-color .25s}.note-detail__body a:hover{text-decoration-color:var(--color-text)}.note-detail__body :is(ul,ol){padding-left:1.4em}.note-detail__body :is(ul,ol) li{margin-bottom:10px;line-height:1.85}.note-detail__body :is(ul,ol) li:last-child{margin-bottom:0}.note-detail__body ul{list-style:outside}.note-detail__body ol{list-style:decimal}.note-detail__body :is(ul,ol) :is(ul,ol){margin-bottom:0}.note-detail__body dl{grid-template-columns:auto 1fr;gap:0;display:grid}.note-detail__body dl>dt{grid-column:1/-1;margin-bottom:6px;font-weight:700}.note-detail__body dl>dd{color:#555;border-bottom:1px solid #e2e2e2;grid-column:1/-1;margin-bottom:20px;padding-bottom:20px}.note-detail__body dl>dd:last-child{margin-bottom:0}.note-detail__body blockquote{color:#666;background-color:#f0f0f0;border-radius:4px;padding:20px 24px}.note-detail__body blockquote p{margin-bottom:8px}.note-detail__body blockquote cite{font-size:var(--font-size-13,.8125rem);color:#999;font-style:normal;display:block}.note-detail__body figure{margin-inline:0}.note-detail__body figure img{border-radius:4px;width:100%;height:auto;margin-bottom:12px;display:block}.note-detail__body figcaption{font-size:var(--font-size-13,.8125rem);color:#999;text-align:center;line-height:1.7}.note-detail__body video{background-color:#000;border-radius:4px;width:100%;height:auto;display:block}.note-detail__body .note-embed{border-radius:4px;width:100%;height:0;padding-bottom:56.25%;position:relative;overflow:hidden}.note-detail__body .note-embed iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.note-detail__body :not(pre)>code{background-color:#f0f0f0;border-radius:3px;padding:.15em .4em;font-family:inherit;font-size:.9em}.note-detail__body pre{font-family:inherit;font-size:var(--font-size-14);border-radius:6px;padding:20px 22px;line-height:1.7;overflow-x:auto}.note-detail__body pre code{font-family:inherit}.note-detail__body .note-table-wrap{overflow-x:auto}.note-detail__body table{border-collapse:collapse;width:100%;font-size:var(--font-size-14)}.note-detail__body :is(th,td){text-align:left;border:1px solid #e0e0e0;padding:12px 16px;line-height:1.7}.note-detail__body th{background-color:#f4f4f4;font-weight:700}.note-detail__body hr{border:0;border-bottom:1px solid #e0e0e0}.note-detail__body .code-example{background-color:#fff;border:1px solid #e6e6e6;border-radius:6px;margin-bottom:16px;padding:32px 24px}.note-section-heading{font-size:var(--font-size-21);margin-bottom:24px;font-weight:500}.note-views{align-items:baseline;gap:4px;display:inline-flex}.note-views[hidden]{display:none}.note-share{align-items:center;gap:20px;margin-bottom:64px;display:flex}.note-share__label{font-size:var(--font-size-16);color:#888}.note-share__list{gap:12px;list-style:none;display:flex}.note-share__btn{border:1px solid #e0e0e0;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:border-color .25s,transform .2s;display:inline-flex}.note-share__btn:hover{border-color:var(--color-text);transform:translateY(-2px)}.note-share__btn img{width:22px;height:22px}.note-author{background-color:#fff;border-radius:8px;margin-bottom:64px;padding:40px}.note-author__eyebrow{font-size:var(--font-size-14);color:#999;margin-bottom:4px}.note-author__heading{font-size:var(--font-size-21);margin-bottom:28px;font-weight:500}.note-author__wrap{grid-template-columns:120px 1fr;align-items:start;gap:28px;display:grid}.note-author__portrait img{width:100%;height:auto;display:block}.note-author__name{font-size:var(--font-size-18);margin-bottom:12px;font-weight:700}.note-author__text{font-size:var(--font-size-14);color:#555;margin-bottom:18px;line-height:1.9}.note-author__sns{gap:14px;list-style:none;display:flex}.note-author__sns a{transition:transform .2s;display:inline-flex}.note-author__sns a:hover{transform:translateY(-2px)}.note-category-list{margin-bottom:64px}.note-category-nav{margin-bottom:56px}.note-category-list ul,.note-category-nav ul{flex-wrap:wrap;gap:12px;list-style:none;display:flex}.note-category-chip{font-size:var(--font-size-14);color:inherit;border:1px solid #d8d8d8;border-radius:999px;padding:8px 18px;text-decoration:none;transition:background-color .25s,border-color .25s,color .25s;display:inline-block}.note-category-chip:hover{border-color:var(--color-text)}.note-category-chip.is-current{color:#fff;background-color:var(--color-text);border-color:var(--color-text)}.note-related{border-bottom:1px solid #dcdcdc;margin-bottom:40px;padding-bottom:40px}.note-related__list{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;list-style:none;display:grid}.note-related__item{color:inherit;flex-direction:column;text-decoration:none;display:flex}.note-related__thumbnail{background-color:#ececec;border-radius:4px;margin-bottom:14px;display:block;overflow:hidden}.note-related__thumbnail img{width:100%;height:auto;transition:transform .4s;display:block}.note-related__item:hover .note-related__thumbnail img{transform:scale(1.04)}.note-related__body{flex-direction:column;flex:1;gap:8px;display:flex}.note-related__category{font-size:var(--font-size-12);color:#999}.note-related__title{font-size:var(--font-size-15);flex:1;font-weight:500;line-height:1.6}.note-related__item:hover .note-related__title{text-underline-offset:3px;text-decoration:underline}.note-related__meta{font-size:var(--font-size-12);color:#999;flex-wrap:wrap;gap:14px;display:flex}@media not all and (width>=640px){.note-share,.note-author,.note-category-list{margin-bottom:48px}.note-author{padding:28px 22px}.note-author__wrap{grid-template-columns:minmax(0,1fr);gap:20px}.note-author__portrait{width:120px}.note-related__list{grid-template-columns:minmax(0,1fr);gap:24px}}.note-detail__navigation{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:48px;display:grid}.note-detail__navigation-link{color:inherit;flex-direction:column;gap:8px;text-decoration:none;display:flex}.note-detail__navigation-link--next{text-align:right}.note-detail__navigation-link span{font-size:var(--font-size-14);color:#999}.note-detail__navigation-link strong{font-size:var(--font-size-15);font-weight:500;line-height:1.6}.note-detail__navigation-link:hover strong{text-underline-offset:4px;text-decoration:underline}.note-detail__back{font-size:var(--font-size-14);color:inherit;text-underline-offset:4px;text-decoration:underline;display:inline-block}@media not all and (width>=640px){.note-detail{padding-block:40px 88px}.note-detail__thumbnail{margin-bottom:40px}.note-detail__body>:has(+h2){margin-bottom:84px}.note-detail__body>:has(+h3){margin-bottom:52px}.note-detail__body>:has(+h4){margin-bottom:42px}.note-detail__body h2{font-size:var(--font-size-24);margin-bottom:28px}.note-detail__body h3{font-size:var(--font-size-18);margin-bottom:24px}.note-detail__body h4{margin-bottom:20px}.note-detail__navigation{grid-template-columns:minmax(0,1fr);gap:24px}.note-detail__navigation-link--next{text-align:left}}
