/* <system section="theme" selected="neutral"> */
@charset "UTF-8";@import"https://fonts.googleapis.com/css?family=Inter:300,400,500,700|Noto+Sans+JP&display=swap";/*!
  Theme: Neutral
  Author: Hatena Blog Team
  Description: 文章が読みやすいシンプルなテーマ です
  Responsive: yes
 */
* {
    margin: 0;
    padding: 0
}

html,body {
    font-family: Inter,Noto Sans JP,Helvetica Neue,Source Han Sans,Segoe UI,sans-serif;
    font-size: 100%;
    font-style: normal;
    word-wrap: break-word
}

a {
    color: #333;
    text-decoration: none
}

a:hover {
    color: #1a237e
}

#globalheader-container {
    background: #fff
}

#blog-title {
    margin: 32px 0 80px
}

@media screen and (min-width: 992px) {
    #blog-title {
        margin:72px 0 120px
    }
}

#blog-title #blog-title-inner {
    position: relative
}

#blog-title #blog-title-content {
    width: 90%;
    margin: auto;
    padding: 0;
    text-align: center
}

#blog-title #blog-title-content #title {
    line-height: 1
}

#blog-title #blog-title-content #title a {
    font-size: 20px;
    font-weight: 500
}

@media screen and (min-width: 992px) {
    #blog-title #blog-title-content #title a {
        font-size:32px
    }
}

#blog-title #blog-title-content #blog-description {
    font-size: 14px;
    font-weight: 400;
    color: #888;
    margin: 14px 0 0
}

@media screen and (min-width: 992px) {
    #blog-title #blog-title-content #blog-description {
        font-size:16px
    }
}

.header-image-enable #blog-title-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translate(-50%)
}

.header-image-enable #blog-title-inner #title a,.header-image-enable #blog-title-inner #blog-description {
    text-shadow: 0 0 10px #333
}

.header-image-enable #blog-title-inner #blog-description {
    color: #fff!important
}

#top-editarea {
    margin: 0 0 32px
}

#top-box .breadcrumb-inner a,#top-box .breadcrumb-inner span {
    font-size: 14px;
    color: #888
}

#content-inner {
    display: flex;
    flex-flow: column;
    justify-content: center
}

@media screen and (min-width: 992px) {
    #content-inner {
        flex-flow:row
    }
}

#content-inner #main {
    width: auto;
    margin: auto
}

@media screen and (min-width: 992px) {
    #content-inner #main {
        width:620px;
        margin: 0 32px 0 0
    }
}

#content-inner #main-inner {
    margin: 0 0 24px
}

#content-inner #box2 {
    width: auto;
    margin: 0 1em
}

@media screen and (min-width: 992px) {
    #content-inner #box2 {
        width:300px
    }
}

#content-inner #box2-inner {
    padding: 80px 0 0
}

@media screen and (min-width: 992px) {
    #content-inner #box2-inner {
        padding:0
    }
}

#bottom-editarea {
    max-width: 960px;
    margin: 24px 16px
}

@media screen and (min-width: 560px) {
    #bottom-editarea {
        margin:24px auto
    }
}

#footer {
    padding: 32px 0;
    font-size: 90%;
    text-align: center;
    color: #333
}

#footer #footer-inner {
    width: auto;
    margin: auto 1rem
}

@media screen and (min-width: 992px) {
    #footer #footer-inner {
        width:1000px;
        margin: auto
    }
}

#footer address,#footer p {
    margin: 0 8px 0 0;
    display: inline-block
}

#footer address .footer-address-name,#footer p .footer-address-name {
    text-align: left
}

#footer .footer-address a>img {
    vertical-align: sub
}

#top-box {
    margin: 0 1em 1em
}

@media screen and (min-width: 992px) {
    #top-box {
        max-width:960px;
        margin: 16px auto
    }
}

#top-box .breadcrumb-link span:hover,#top-box .breadcrumb-child-link span:hover,#top-box .breadcrumb-link span:focus,#top-box .breadcrumb-child-link span:focus {
    color: #333
}

.entry {
    margin: 0 0 80px;
    padding: 24px 1em 40px;
    background: #fff;
    border-radius: 4px
}

.entry .entry-inner .entry-header {
    position: relative;
    margin: 0 0 32px
}

.entry .entry-inner .entry-header .date a {
    font-size: 14px;
    color: #888
}

@media screen and (min-width: 992px) {
    .entry .entry-inner .entry-header .date {
        font-size:18px
    }
}

.entry .entry-inner .entry-header .date-last-updated {
    font-size: 14px;
    color: #888
}

.entry .entry-inner .entry-header .entry-title {
    font-size: 28px;
    margin: 16px 0;
    padding: 0;
    text-align: left
}

@media screen and (min-width: 992px) {
    .entry .entry-inner .entry-header .entry-title {
        font-size:30px;
        margin: 24px 0 32px
    }
}

.entry .entry-inner .entry-header .entry-categories .entry-category-link {
    font-size: 12px;
    background: #f5f5f5;
    padding: .45em;
    margin: 0 0 4px;
    border-radius: 4px;
    display: inline-block
}

.entry .entry-inner .entry-header .entry-header-menu {
    position: absolute;
    top: 0;
    right: 0
}

.entry .entry-inner .entry-header .entry-header-menu a {
    font-size: 14px;
    padding: .45em;
    border: 1px solid #d9d9d9;
    border-radius: 4px
}

.entry .entry-inner .entry-header .entry-header-menu a:hover,.entry .entry-inner .entry-header .entry-header-menu a:focus {
    background: #f5f5f5;
    border: 1px solid #f5f5f5;
    color: #1a237e
}

.entry .entry-inner .entry-content .entry-category-link {
    display: inline-block;
    color: #333;
    background: #e0e0e0;
    padding: .4rem .8rem;
    border-radius: 4px;
    margin: 0 0 8px;
    font-size: 12px
}

.entry .entry-inner .entry-content .entry-category-link:hover,.entry .entry-inner .entry-content .entry-category-link:focus {
    color: #333
}

@media screen and (min-width: 992px) {
    .entry .entry-inner .entry-content .entry-category-link {
        font-size:14px
    }
}

.entry .entry-inner .entry-content .table-of-contents {
    background: #f5f5f5;
    list-style: none;
    border-radius: 4px;
    margin: 0;
    padding: 1.6em
}

.entry .entry-inner .entry-content .table-of-contents li>ul {
    margin: 0
}

.entry .entry-inner .entry-content .table-of-contents ul li {
    list-style: none;
    line-height: 1.5
}

.entry .entry-inner .entry-content .table-of-contents li,.entry .entry-inner .entry-content .table-of-contents a {
    color: #1a237e
}

.entry .entry-inner .entry-footer {
    margin: 72px 0 0
}

.entry .entry-inner .entry-footer .entry-footer-section {
    font-size: 14px
}

.entry .entry-inner p {
    font-size: 18px;
    line-height: 1.8;
    letter-spacing: .5px;
    font-style: normal;
    margin: 33px 0;
    color: #454545
}

.entry .entry-inner p .keyword {
    border-bottom: 1px dotted #333
}

.entry .entry-inner p .keyword:hover,.entry .entry-inner p .keyword:focus {
    border-bottom: 1px solid #333;
    text-decoration: none
}

.entry .entry-inner p a {
    color: #1a237e
}

.entry .entry-inner p a:hover,.entry .entry-inner p a:focus {
    text-decoration: underline
}

.entry .entry-inner p code {
    background: #272822;
    color: #f8f8f2
}

.entry .entry-inner h1,.entry .entry-inner h2,.entry .entry-inner h3,.entry .entry-inner h4,.entry .entry-inner h5,.entry .entry-inner h6 {
    margin: 33px 0
}

.entry .entry-inner h1 {
    font-size: 28px
}

@media screen and (min-width: 992px) {
    .entry .entry-inner h1 {
        font-size:30px
    }
}

.entry .entry-inner h2 {
    font-size: 26px
}

@media screen and (min-width: 992px) {
    .entry .entry-inner h2 {
        font-size:28px
    }
}

.entry .entry-inner h3 {
    font-size: 24px
}

@media screen and (min-width: 992px) {
    .entry .entry-inner h3 {
        font-size:26px
    }
}

.entry .entry-inner h4 {
    font-size: 22px
}

@media screen and (min-width: 992px) {
    .entry .entry-inner h4 {
        font-size:24px
    }
}

.entry .entry-inner h5 {
    font-size: 20px
}

@media screen and (min-width: 992px) {
    .entry .entry-inner h5 {
        font-size:22px
    }
}

.entry .entry-inner h6 {
    font-size: 16px
}

@media screen and (min-width: 992px) {
    .entry .entry-inner h6 {
        font-size:20px
    }
}

.entry .entry-inner ul,.entry .entry-inner ol,.entry .entry-inner dl {
    margin-inline-start:1.5em}

.entry .entry-inner ul li,.entry .entry-inner ol li,.entry .entry-inner dl li {
    line-height: 1.8
}

.entry .entry-inner hr {
    margin: 16px 0;
    border: none;
    border-top: 1px solid #d9d9d9
}

.entry .entry-inner dd {
    margin-inline-start:40px}

.entry .entry-inner blockquote {
    background: #fff;
    border-left: 3px solid #e0e0e0;
    border-radius: 4px;
    padding: 16px;
    font-size: 14px
}

.entry .entry-inner blockquote p {
    margin: 16px 0;
    font-size: 16px;
    line-height: 1.6;
    font-style: oblique
}

.entry .entry-inner blockquote p cite {
    font-style: initial;
    font-size: 14px
}

.entry .entry-inner pre {
    margin: 0 0 24px;
    padding: 16px 8px;
    background: #272822;
    color: #f8f8f2;
    border-radius: 4px
}

.entry .entry-inner pre .synComment {
    color: #75715e
}

.entry .entry-inner pre .synSpecial {
    color: #e6db74
}

.entry .entry-inner pre .synType {
    color: #66d9ef
}

.entry .entry-inner pre .synPreProc,.entry .entry-inner pre .synStatement {
    color: #f92672
}

.entry .entry-inner pre .synIdentifier {
    color: #a6e22e
}

.entry .entry-inner pre .synConstant {
    color: #ae81ff
}

.entry .entry-inner table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 16px;
    font-size: 14px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    overflow: hidden;
    border-collapse: unset;
    border-spacing: 0
}

.entry .entry-inner table th {
    background: #d9d9d9;
    padding: .45em;
    border-right: 1px solid #fff
}

.entry .entry-inner table th:last-child {
    border-right: none
}

.entry .entry-inner table tbody {
    display: table-row-group;
    text-align: center
}

.entry .entry-inner table tbody tr {
    display: table-row
}

.entry .entry-inner table tbody tr:nth-child(2n) {
    background: #f5f5f5
}

.entry .entry-inner table tbody td {
    padding: .45em;
    border-right: 1px solid #d9d9d9
}

.entry .entry-inner table tbody td:last-child {
    border-right: none
}

.entry .entry-inner .footnote {
    font-size: 14px
}

.entry .entry-inner .entry-see-more {
    color: #333;
    border: 1px solid #d9d9d9;
    font-size: 16px;
    border-radius: 4px;
    padding: .6em .8em
}

.entry .entry-inner .entry-see-more:hover {
    background: #f5f5f5;
    border: 1px solid #f5f5f5;
    color: #1a237e;
    transition: color .3s
}

.entry .entry-inner .entry-footer-ad {
    margin: 8px 0 0;
    padding: 8px 4px;
    border: 1px solid #d9d9d9;
    border-radius: 4px
}

.entry .entry-inner .hatena-star-container {
    margin: 0 0 24px
}

.entry .entry-inner .social-buttons {
    margin: 24px 0
}

.entry .entry-inner .entry-footer-modules .hatena-module-title {
    font-size: 18px;
    margin: 0 0 24px
}

.entry .entry-inner .entry-footer-modules .hatena-module {
    margin: 0;
    padding: 1em 0
}

.entry .entry-inner .entry-footer-modules .related-entries,.entry .entry-inner .entry-footer-modules .entries-access-ranking,.entry .entry-inner .entry-footer-modules .recent-entries {
    margin: 0
}

.entry .entry-inner .comment-box {
    margin: 32px 0 0
}

.entry .entry-inner .comment-box .comment {
    margin: 0
}

.entry .entry-inner .comment-box .comment .entry-comment {
    list-style: none;
    margin: 0 0 32px
}

.entry .entry-inner .comment-box .comment .comment-user-name {
    margin: 0 0 4px;
    display: flex;
    align-items: center
}

.entry .entry-inner .comment-box .comment .comment-user-name .hatena-id-icon {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    margin: 0 8px 0 0
}

.entry .entry-inner .comment-box .comment .comment-content {
    margin: 0 0 16px
}

.entry .entry-inner .comment-box .comment .comment-content p {
    font-size: 16px;
    line-height: 1.6;
    margin: 16px 0
}

.entry .entry-inner .comment-box .comment .comment-metadata {
    margin: 0;
    font-size: 14px;
    color: #888
}

.entry .entry-inner .comment-box .leave-comment-title {
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    color: #333;
    padding: 8px 16px;
    font-size: 16px
}

@media screen and (min-width: 992px) {
    .entry .entry-inner .comment-box .leave-comment-title {
        font-size:14px
    }
}

.entry .entry-inner .comment-box .leave-comment-title:hover,.entry .entry-inner .comment-box .leave-comment-title:focus {
    color: #1a237e;
    background: #f5f5f5;
    border: 1px solid #f5f5f5
}

.pager .pager-prev,.pager .pager-next {
    width: 100%;
    position: relative;
    display: inline-block;
    background: #fff;
    border-radius: 4px
}

.pager .pager-prev a,.pager .pager-next a {
    padding: 1em;
    display: block
}

.pager .pager-prev:hover,.pager .pager-next:hover,.pager .pager-prev:focus,.pager .pager-next:focus {
    color: #1a237e
}

.pager .pager-prev .pager-arrow,.pager .pager-next .pager-arrow {
    font-size: 32px;
    height: 32px;
    line-height: 32px;
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    margin: auto;
    color: #d9d9d9
}

.pager.permalink {
    background: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 4px;
    margin: 24px 16px;
    padding: 8px 16px;
    line-height: 1.5
}

@media screen and (min-width: 992px) {
    .pager.permalink {
        margin:32px auto
    }
}

.pager.permalink .pager-prev {
    margin-right: auto;
    padding: 0 0 0 32px
}

.pager.permalink .pager-prev a {
    text-align: left;
    padding-left: 0
}

.pager.permalink .pager-prev .pager-arrow {
    left: 0
}

.pager.permalink .pager-next {
    margin-left: auto;
    padding: 0 32px 0 0
}

.pager.permalink .pager-next a {
    text-align: right;
    padding-right: 0
}

.pager.permalink .pager-next .pager-arrow {
    right: 0
}

.page-index .pager {
    border-radius: 4px;
    justify-content: center;
    text-align: center
}

.page-index .pager .pager-prev,.page-index .pager .pager-next {
    display: block
}

.hatena-module {
    background: #fff;
    margin: 0 0 32px;
    padding: 16px;
    border-radius: 4px
}

.hatena-module .hatena-module-title {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 24px
}

.hatena-module .hatena-module-title a {
    color: #333
}

.hatena-module .hatena-module-body,.hatena-module .hatena-urllist {
    padding: 0
}

.hatena-module .hatena-module-body .urllist-item,.hatena-module .hatena-urllist .urllist-item {
    list-style: none;
    margin: 0 0 32px
}

.hatena-module .hatena-module-body .urllist-item:last-child,.hatena-module .hatena-urllist .urllist-item:last-child {
    margin-bottom: 0
}

.hatena-module .hatena-module-body .urllist-item .urllist-item-inner .urllist-title-link,.hatena-module .hatena-urllist .urllist-item .urllist-item-inner .urllist-title-link {
    color: #333;
    margin: 0 0 8px;
    font-size: 16px;
    line-height: 1.6;
    display: inline;
    text-align: justify
}

.hatena-module .hatena-module-body .urllist-item .urllist-item-inner .urllist-title-link:hover,.hatena-module .hatena-urllist .urllist-item .urllist-item-inner .urllist-title-link:hover {
    color: #1a237e
}

.hatena-module .hatena-module-body .urllist-item .urllist-item-inner .urllist-date-link,.hatena-module .hatena-urllist .urllist-item .urllist-item-inner .urllist-date-link {
    margin: 0 0 4px
}

.hatena-module .hatena-module-body .urllist-item .urllist-item-inner .urllist-date-link time,.hatena-module .hatena-urllist .urllist-item .urllist-item-inner .urllist-date-link time {
    color: #888
}

.hatena-module .hatena-module-body .urllist-item .urllist-item-inner .urllist-categories,.hatena-module .hatena-urllist .urllist-item .urllist-item-inner .urllist-categories {
    margin: 4px 0 0
}

.hatena-module .hatena-module-body .urllist-item .urllist-item-inner .urllist-categories .urllist-category-link,.hatena-module .hatena-urllist .urllist-item .urllist-item-inner .urllist-categories .urllist-category-link {
    display: inline-block;
    background: #f5f5f5;
    margin: 0 0 8px;
    padding: .4em;
    font-size: 12px;
    border-radius: 4px
}

.hatena-module .hatena-module-body .urllist-item .urllist-item-inner .urllist-categories .urllist-category-link:hover,.hatena-module .hatena-urllist .urllist-item .urllist-item-inner .urllist-categories .urllist-category-link:hover {
    color: #1a237e
}

.hatena-module .hatena-module-body .urllist-item .urllist-item-inner .urllist-entry-body,.hatena-module .hatena-urllist .urllist-item .urllist-item-inner .urllist-entry-body {
    color: #888;
    font-size: 14px;
    margin: 0 0 8px;
    text-align: justify
}

.hatena-module .hatena-module-body .urllist-image,.hatena-module .hatena-urllist .urllist-image {
    border-radius: 4px
}

.hatena-module .hatena-module-body .urllist-see-more-link,.hatena-module .hatena-urllist .urllist-see-more-link {
    border: 1px solid #f5f5f5;
    border-radius: 4px;
    padding: .45em
}

.hatena-module .hatena-module-body .urllist-see-more-link:hover,.hatena-module .hatena-urllist .urllist-see-more-link:hover,.hatena-module .hatena-module-body .urllist-see-more-link:focus,.hatena-module .hatena-urllist .urllist-see-more-link:focus {
    color: #1a237e;
    background: #f5f5f5
}

.hatena-module .hatena-module-body .archive-module-year,.hatena-module .hatena-urllist .archive-module-year {
    margin: 0 0 16px
}

.hatena-module .hatena-module-body .archive-module-year:last-child,.hatena-module .hatena-urllist .archive-module-year:last-child {
    margin: 0
}

.search-form {
    display: flex;
    justify-content: center;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    overflow: hidden;
    position: relative
}

.search-form .search-module-input {
    width: 100%;
    font-size: .8em;
    outline: 0;
    border: none;
    margin: 0;
    padding: .6em
}

.search-form .search-module-button {
    width: 16px;
    height: 16px;
    background: transparent url(https://cdn.blog.st-hatena.com/css/theme/neutral/images/search.png?version=78c0715f7b64d08368630c52fd27c0) no-repeat 50%;
    background-size: 16px 16px;
    position: absolute;
    top: 7px;
    right: 6px;
    border: none;
    padding: .6em;
    outline: 0;
    text-indent: -9999px;
    opacity: .5;
    cursor: pointer
}

.search-form .search-module-button:hover,.search-form .search-module-button:focus {
    transition: color .3s;
    opacity: 1
}

.hatena-module-profile .hatena-module-body {
    display: flex;
    flex-direction: column;
    text-align: center
}

.hatena-module-profile .hatena-module-body .profile-icon {
    border-radius: 4px;
    margin: 0 0 8px
}

.hatena-module-profile .hatena-module-body .profile-description {
    margin: 8px 0 0
}

.hatena-module-profile .hatena-module-body .profile-description p {
    font-size: 14px;
    text-align: left
}

.hatena-module-profile .hatena-module-body .hatena-follow-button-box {
    margin: 24px auto
}

.hatena-module-category .hatena-urllist li {
    list-style: none;
    margin: 0 0 16px
}

.hatena-module-category .hatena-urllist li:last-child {
    margin-bottom: 0
}

.hatena-module-category .hatena-urllist li a {
    color: #333;
    display: inline-block;
    background: #f5f5f5;
    padding: .4rem;
    border-radius: 4px;
    font-size: 14px
}

.hatena-module-category .hatena-urllist li a:hover,.hatena-module-category .hatena-urllist li a:focus {
    color: #1a237e
}

.hatena-module-recent-comments .recent-comments .hatena-id-icon {
    border-radius: 4px
}

.hatena-module-recent-comments .recent-comments li {
    list-style: none;
    margin: 0 0 16px
}

.hatena-module-recent-comments .recent-comments li:last-child {
    margin-bottom: 0
}

.hatena-module-recent-comments .recent-comments .recent-comment-time {
    color: #888;
    font-style: normal
}

.hatena-module-links .hatena-urllist {
    list-style: none;
    line-height: 1.8
}

.hatena-module-authors-list .authors-urllist {
    margin: 0 0 8px
}

.hatena-module-authors-list .authors-urllist a {
    display: flex;
    align-items: center
}

.hatena-module-authors-list .authors-urllist .authors-user-icon {
    border-radius: 4px;
    width: 32px
}

.hatena-module-circles .circle-urllist li {
    display: flex;
    margin: 0 0 16px;
    align-items: center
}

.hatena-module-circles .circle-urllist li:last-child {
    margin-bottom: 0
}

.hatena-module-html ul {
    margin-inline-start:1.2em}

.hatena-module-html p,.hatena-module-html pre {
    line-height: 1.6;
    margin: 16px 0
}

.hatena-module-html code,.hatena-module-html .code {
    background: #272822;
    color: #f8f8f2;
    padding: .24em;
    border-radius: 4px;
    font-size: 14px
}

.hatena-module-archive .calendar-day a {
    color: #888
}

.page-archive .archive-entries {
    background: #fff;
    padding: 32px 16px 40px;
    border-radius: 4px
}

.page-archive .archive-heading {
    margin: 0 0 32px;
    background: #fff;
    border-radius: 4px;
    padding: 16px
}

.page-archive .search-result {
    background: #fff;
    border-radius: 4px;
    padding: 16px 16px 40px
}

.archive-header-category {
    background: #fff;
    border-radius: 4px
}

.archive-header-category .archive-heading {
    margin: 0;
    padding: 16px
}

.page-archive-category .archive-header-category {
    margin: 0 0 40px
}

.page-archive-category .archive-header-category .archive-heading {
    background: #f5f5f5;
    padding: 4px 8px;
    margin: 16px;
    border-radius: 4px;
    display: inline-block;
    font-size: 16px
}

.page-archive-category .archive-header-category .archive-heading .archive-entries .archive-entry {
    margin: 0 0 72px
}

.page-archive-category .archive-header-category .archive-heading .archive-entries .archive-entry:last-child {
    margin-bottom: 0
}

.page-archive-category .archive-header-category .archive-heading .entry-title {
    font-size: 22px;
    line-height: 1.5em
}

.page-archive-category .archive-header-category .archive-heading .entry-title a {
    color: #333
}

.page-archive-category .archive-header-category .archive-heading .entry-title a:hover,.page-archive-category .archive-header-category .archive-heading .entry-title a:focus {
    color: #1a237e
}

.page-archive-category .archive-category-link {
    color: #333;
    background-color: #f5f5f5;
    margin: 0 0 8px;
    padding: .4em;
    border-radius: 4px
}

.archive-entry {
    margin: 0 0 40px
}

@media screen and (min-width: 992px) {
    .archive-entry {
        margin:0 0 72px
    }
}

.archive-entry:last-child {
    margin-bottom: 0
}

.archive-entry .archive-entry-header .date {
    margin: 0 0 8px
}

.archive-entry .archive-entry-header .date time {
    color: #888;
    font-size: 14px
}

@media screen and (min-width: 992px) {
    .archive-entry .archive-entry-header .date {
        font-size:18px
    }
}

.archive-entry .archive-entry-header .entry-title {
    margin: 0 0 16px
}

.archive-entry .archive-entry-header .entry-title .entry-title-link {
    font-size: 18px
}

@media screen and (min-width: 992px) {
    .archive-entry .archive-entry-header .entry-title .entry-title-link {
        font-size:22px;
        margin: 0 0 24px
    }
}

.archive-entry .archive-entry-header .highlight,.archive-entry .archive-entry-body .highlight {
    background: #faeacb;
    border-radius: 4px;
    border: none
}

.archive-entry .categories {
    margin: 0 0 8px
}

.archive-entry .categories .archive-category-link {
    font-size: 12px;
    background: #f5f5f5;
    margin: 0 0 8px;
    padding: .45em;
    border-radius: 4px;
    display: inline-block
}

.archive-entry .entry-thumb {
    border-radius: 4px;
    width: 80px;
    height: 80px
}

@media screen and (min-width: 992px) {
    .archive-entry .entry-thumb {
        width:100px;
        height: 100px
    }
}

.archive-entry .archive-entry-body .entry-description {
    font-size: 14px;
    line-height: 1.5;
    margin: 0 0 8px
}

.page-about .entry-content {
    margin: 0 0 24px
}

.page-about .entry-content img.profile-icon {
    width: 24px;
    height: 24px;
    border-radius: 4px;
    margin: 0 8px 0 0
}

.page-about .entry-content dl {
    margin: 24px 0 0
}

.page-about .entry-content dt {
    font-size: 18px;
    line-height: 1.8;
    margin: 0 0 8px
}

.page-about .entry-content dd {
    margin-bottom: 16px
}

.page-about .entry-content dd li {
    list-style: disc;
    color: #1a237e;
    font-size: 16px
}

.page-about .entry-content dd li a:hover {
    text-decoration: underline
}

/* </system> */
/* <system section="background" selected="default"> */
/* default */
/* </system> */
/* Neutralテーマ向けに記事本文の幅を広げる */
@media screen and (min-width: 992px) {
    #content-inner #main {
        width: 800px;
        margin: 0 32px 0 0;
    }
}

/* syntax highlight */
.entry .entry-inner pre .synSpecial {
    color: #b58900;
}

.entry .entry-inner pre .synComment {
    color: #839496;
}

.entry .entry-inner pre .synIdentifier {
    color: #8844ba;
}

/* https://codelife.cafe/entry/2018/05/22/%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%96%E3%83%AD%E3%82%B0%E3%81%A7%E6%9B%B8%E3%81%84%E3%81%9F%E3%82%B3%E3%83%BC%E3%83%89%E3%83%96%E3%83%AD%E3%83%83%E3%82%AF%E3%81%AB%E8%A1%8C%E7%95%AA%E5%8F%B7%E3%82%92 */
/*code-lineクラスの数でカウント*/
.code-line {
    counter-increment: linenumber;
}

/*行番号を擬似要素として表示*/
.code-line::before {
    content: counter(linenumber);
    display: inline-block;
    color: #777;
    text-align: right;
    width: 25px;
    padding: 0 5px 0 0;
    border-right: 1px solid #777;
    margin-right: 10px;
}

/*コードブロックに言語名を表示*/
pre.code:not(.mermaid):not([data-lang=""]):before {
    content: attr(data-lang);
    display: inline-block;
    background: #888;
    color: white;
    padding: 3px;
    position: absolute;
    margin-top: -30px;
}

pre.code {
    padding-top: 30px;
    padding-left: 0px;
    font-family: monospace;
}

pre.code.mermaid {
    background: #fff;
}

.entry .entry-inner p code, .entry .entry-inner pre {
    background-color: #00000008;
    border: 1px solid rgba(0,0,0,.08);
    color: #454545;
}

/*
  ソースコードのコピーボタン
  https://syu-m-5151.hatenablog.com/entry/2023/05/09/181943
*/
div.copy-button-container {
    position: relative;
}

.copy-button {
    position: absolute;
    top: -8px;
    right: 4px;
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 4px;
    background-color: #f7f7f7;
    color: #454545;
    cursor: pointer;
    font-size: 14px;
    text-decoration: none;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    opacity: 0;
    transition: opacity 0.3s;
}

pre.code:hover .copy-button {
    opacity: 1;
}

.copy-button:focus {
    outline: none;
}

.copy-button:active {
    box-shadow: none;
    transform: translateY(2px);
}

/* Tabel of contents */
.table-of-contents::before {
    content: "📝Contents";
    margin-left: -1.4em;
}

.table-of-contents li {
    list-style-type: disc !important;
}

.table-of-contents li > ul {
    margin-left: 1rem !important;
}

.table-of-contents li li {
    list-style: circle !important;
}

.table-of-contents li li li {
    list-style: square !important;
}

/* 警告記法 */
.markdown-alert {
    border-left: 3px solid !important;
    border-radius: 0px !important;
    padding: 0.5rem !important;
}

.markdown-alert p {
    font-style: normal !important;
    margin: 16px 0 0 !important;
}

.markdown-alert blockquote {
    padding: 4px 8px !important;
    margin: 0 !important;
}

.markdown-alert blockquote p {
    margin: 0 !important;
}

.markdown-alert .markdown-alert-title {
    align-items: center;
    display: flex;
    margin: 0 !important;
}

.markdown-alert .markdown-alert-title svg {
    padding-right: 0.3em !important;
}

.markdown-alert-note {
    border-left-color: #0969da !important;
}

.markdown-alert-note .markdown-alert-title {
    color: #0969da !important;
    fill: #0969da !important;
}

.markdown-alert-tip {
    border-left-color: #1a7f37 !important;
}

.markdown-alert-tip .markdown-alert-title {
    color: #1a7f37 !important;
    fill: #1a7f37 !important;
}

.markdown-alert-important {
    border-left-color: #8250df !important;
}

.markdown-alert-important .markdown-alert-title {
    color: #8250df !important;
    fill: #8250df !important;
}

.markdown-alert-warning {
    border-left-color: #bf8700 !important;
}

.markdown-alert-warning .markdown-alert-title {
    color: #bf8700 !important;
    fill: #bf8700 !important;
}

.markdown-alert-caution {
    border-left-color: #cf222e !important;
}

.markdown-alert-caution .markdown-alert-title {
    color: #cf222e !important;
    fill: #cf222e !important;
}