@charset "UTF-8";

:root {
--text-main:#1c1a1a ;
--bg4:rgb(244, 244, 244) ;
--bg3:#fff ;
--bg2:#ffffff ;
--bg1:#ebebeb ;
--bg1-on:#f0f8ffea;
--underline-blue:#a8dafb;
--underline-red:#ffd0d1;
--underline: #ff9;
} @media (prefers-color-scheme: dark) {
:root {
--text-main: #faf8f7;
--bg4: #1c1a1a;
--bg3:#242529;
--bg2:#2d343a;
--bg1:#42505e;
--bg1-on:#313c46bd;
--underline-blue: #234794 ;
--underline:rgba(255, 255, 0, 0.801);
--underline-red:#ff2f33;
}
.marker {
background: yellow;
color: #1c1a1a;
}
.keyboard-key {
box-shadow: 1px 2px 2px #6e6e6e;
} .sbs-line.sbp-r .speech-balloon {
background-color: var(--bg2);
border-color: #85e249;
border-width: 2px;
}
.cocoon-block-balloon.not-nested-style.sbs-line.sbp-r > .speech-balloon {
border-width: 2px;
}
.sbs-line.sbp-r .speech-balloon::after,
.sbs-stn.sbp-r .speech-balloon::after {
border-left-color: var(--bg2);
}
.sbs-line.sbp-l .speech-balloon::after,
.sbs-flat.sbp-l .speech-balloon::after {
border-right-color: var(--bg2);
}
.sbs-flat.sbp-r .speech-balloon::after {
border-left-color: var(--bg2);
}
.sbs-line.sbp-l .speech-balloon,
.sbs-flat.sbp-l .speech-balloon,
.sbs-flat.sbp-r .speech-balloon {
background-color: var(--bg2);
border-color: var(--text-main);
border-width: 2px;
}
.cocoon-block-balloon.not-nested-style.sbs-line.sbp-l,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-l,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-r {
--cocoon-custom-border-color: var(--text-main);
}
.cocoon-block-balloon.not-nested-style.sbs-line.sbp-l > .speech-balloon,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-l > .speech-balloon,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-r > .speech-balloon {
border-width: 2px;
}
.sns-buttons a {
background-color: #585858;
} a {
color: #99ccff;
}
a:hover {
color: #f7a488;
}
.bc-brand-color-white a {
background-color: #888;
} .speech-wrap,
.toggle-box,
.timeline-box,
.iconlist-box,
.faq-wrap,
.caption-box,
.tab-caption-box,
.label-box,
.micro-balloon,
.micro-text {
--cocoon-custom-text-color: var(--text-main);
}
.info-list,
.info-list .info-list-item-content-link,
.widget_info_list {
color: var(--text-main);
}
.breadcrumb.sbp-main-before,
.breadcrumb.sbp-footer-before,
.breadcrumb.pbp-main-before,
.breadcrumb.pbp-footer-before {
background-color: transparent;
}
.toggle-box {
--cocoon-custom-background-color: transparent;
}
.has-box-style,
.has-border {
--cocoon-box-border-color: #ccc;
}
.is-style-border-thin-and-thick,
.is-style-border-radius-s-thin-and-thick,
.is-style-border-radius-l-thin-and-thick {
border-color: rgba(255, 255, 255, 0.1);
}
.is-style-light-background-box {
background-color: rgba(255, 255, 255, 0.1);
}
.is-style-stripe-box {
background-image: repeating-linear-gradient(-45deg, #333 0, #333 3px, transparent 3px, transparent 6px);
}
.is-style-checkered-box {
background-image: linear-gradient(90deg, rgba(232, 238, 236, 0.1) 50%, transparent 50%), linear-gradient(rgba(234, 236, 238, 0.1) 50%, transparent 50%);
}
.is-style-stitch-box {
background-color: rgba(255, 255, 255, 0.2);
box-shadow: 0px 0px 0px 10px rgba(255, 255, 255, 0.2);
}
.is-style-border-top-box {
box-shadow: 0 3px 5px rgba(255, 255, 255, 0.22);
}
.is-style-border-left-box {
box-shadow: 0px 2px 3px rgba(255, 255, 255, 0.33);
}
[class^=is-style-balloon-], [class*=" is-style-balloon-"] {
--cocoon-white-color: var(--bg3);
background: var(--cocoon-white-color);
border: 1px solid var(--cocoon-box-border-color);
}
}
body {
background-color: var(--bg4);
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Meiryo", sans-serif;
}
.main {
background-color: var(--bg3);
color: var(--text-main);
} .list-title-in:before, .list-title-in:after {
background-color: var(--text-main);
}
a.new-entry-card-link.widget-entry-card-link.a-wrap {
margin-top: 10px;
}
#index-tab-1:checked ~ .index-tab-buttons .index-tab-button[for=index-tab-1],
#index-tab-2:checked ~ .index-tab-buttons .index-tab-button[for=index-tab-2],
#index-tab-3:checked ~ .index-tab-buttons .index-tab-button[for=index-tab-3],
#index-tab-4:checked ~ .index-tab-buttons .index-tab-button[for=index-tab-4] {
background: none var(--bg1);
border: 1px solid var(--bg1);
color: var(--text-main);
}
.index-tab-buttons .index-tab-button {
background-color: var(--bg1);
border-color: var(--bg1);
} .list-more-button {
background-color: var(--bg2);
color: var(--text-main);
}
.list-more-button:hover {
color: var(--text-main);
background-color: var(--bg1-on);
}
.pagination-next-link,
.page-numbers {
background-color: var(--bg2);
border-radius: 8px;
color: var(--text-main);
}
.page-numbers.current {
background-color: #757575;
}
.pagination-next-link:hover,
.key-btn:hover {
color: var(--text-main);
background-color: var(--bg1-on);
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
}
.pagination .page-numbers,
.pager-numbers .page-numbers {
border-radius: 99px;
}
.page-numbers.dots {
background: none;
}
.page-numbers:hover {
background-color: var(--bg1-on);
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
}
a.page-numbers:hover {
color: var(--text-main);
background-color: var(--bg4);
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
} .sidebar {
background-color: var(--bg3);
color: var(--text-main);
}
#sidebar ul li a,
a.popular-entry-card-link {
margin: 10px;
}
.widget_recent_entries ul li a, .widget_categories ul li a,
.widget_archive ul li a, .widget_pages ul li a,
.widget_meta ul li a, .widget_rss ul li a,
.widget_nav_menu ul li a,
.wp-block-group ul li a {
border-bottom: 1px solid var(--bg3);
padding-right: 15px;
padding-left: 15px;
}
.author-box .sns-follow-buttons a.follow-button {
color: var(--text-main);
}
.sidebar-menu-content,
.widget-entry-cards .a-wrap {
color: var(--text-main);
background-color: var(--bg2);
} div.recent-comment-content {
background-color: var(--bg1);
color: var(--text-main);
}
.recent-comment-content::after {
border-bottom-color: var(--bg1);
} .search-box input::placeholder {
color: var(--text-main);
}
.search-box input:focus, .search-box button:focus {
outline: 0;
}
input, input[type=submit] {
background-color: var(--bg3);
color: var(--text-main);
}
input.search-edit {
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.02), 0 2px 3px -2px rgba(0, 0, 0, 0.05);
}
input.search-edit::placeholder {
color: var(--text-main);
}
.search-submit {
border-radius: 0 3px 3px 0;
width: 50px;
height: 100%;
top: 0;
right: 0;
}
.box-menu {
background: var(--bg2);
color: var(--text-main);
}
.box-menu:hover {
background-color: var(--bg1-on);
color: var(--text-main);
}
.a-wrap,
.widget_recent_entries ul li a, .widget_categories ul li a,
.widget_archive ul li a, .widget_pages ul li a,
.widget_meta ul li a, .widget_rss ul li a,
.widget_nav_menu ul li a,
.wp-block-group ul li a {
color: var(--text-main);
background-color: var(--bg2);
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
border-radius: 4px;
transition-duration: 0.3s;
}
.a-wrap:hover,
.widget_recent_entries ul li a:hover, .widget_categories ul li a:hover,
.widget_archive ul li a:hover, .widget_pages ul li a:hover,
.widget_meta ul li a:hover, .widget_rss ul li a:hover,
.widget_nav_menu ul li a:hover,
.wp-block-group ul li a:hover {
color: var(--text-main);
background-color: var(--bg1-on);
transform: translateY(-4px);
box-shadow: 0 0 8px rgba(0, 0, 0, 0.24);
transition-duration: 0.3s;
}
.a-wrap > div {
border: none;
} div #carousel-in {
background-color: var(--bg3);
} .navi {
background-color: var(--bg3);
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.25);
font-weight: bold;
}
.navi a {
color: var(--text-main);
}
.navi a:hover {
color: var(--text-main);
background-color: var(--bg1-on);
}
.navi ul .sub-menu {
background-color: var(--bg2);
opacity: 0.95;
}
.navi ul .sub-menu a {
color: var(--text-main);
}
.navi ul .sub-menu a:hover {
background-color: var(--bg1-on);
}
.navi ul .sub-menu a .sub-caption {
opacity: 0.8;
}
.navi-in > ul .sub-menu {
display: block;
}
.navi-in > ul .sub-menu li {
visibility: hidden;
transition: all 0.2s ease;
height: 0;
opacity: 0;
}
.navi-in > ul li:hover > ul > li {
transition: all 0.2s ease;
visibility: visible;
height: 60px;
opacity: 1;
}
.hlt-tm-small .navi-in > ul li:hover > ul > li,
.cl-slim .navi-in > ul li:hover > ul > li {
height: 40px;
}
.navi-in > ul .sub-menu .sub-menu li {
display: none;
}
.navi-in > ul .sub-menu li:hover > ul > li {
display: block;
}
.navi-in > ul > li:last-of-type .sub-menu {
right: 0;
} .fixed-header .header {
background-color: transparent;
}
.fixed-header .navi {
box-shadow: none;
}
.toc a {
color: var(--text-main);
}
div.speech-balloon {
background-color: var(--bg2);
}
.cocoon-block-balloon.not-nested-style {
--cocoon-custom-background-color: var(--bg2);
}
.rating-number {
color: var(--text-main);
} .footer {
background-color: var(--bg3);
color: var(--text-main);
}
div .footer-bottom-content {
color: var(--text-main);
}
.navi-footer-in a {
color: var(--text-main);
}
.navi-footer-in a:hover {
background-color: var(--bg1-on);
}  tr {
background-color: var(--bg2);
}
table tr:nth-of-type(2n+1) {
background-color: var(--bg3);
}
table th,
.scrollable-table th {
background-color: var(--bg1);
} pre.wp-block-code:where(:not(.hljs)),
pre:where(:not(.hljs)) {
color: var(--text-main);
background-color: var(--bg1);
} .breadcrumb,
.breadcrumb-caption {
color: var(--text-main);
} .sns-share-message,
.sns-follow-message {
color: var(--text-main);
} .comment-btn {
background-color: var(--bg1);
color: var(--text-main);
}
.comment-btn:hover {
background-color: var(--bg1-on);
color: var(--text-main);
}
textarea {
background-color: var(--bg3);
color: var(--text-main);
} .widget {
color: var(--text-main);
} blockquote {
background-color: var(--bg2);
} .speech-balloon::after {
border-right-color: var(--bg2);
} .keyboard-key {
background-color: var(--bg2);
color: var(--text-main);
} .marker-under-blue {
background: linear-gradient(transparent 60%, var(--underline-blue) 0%);
}
.marker-under {
background: linear-gradient(transparent 70%, var(--underline) 0%);
}
.marker-under-red {
background: linear-gradient(transparent 60%, var(--underline-red) 0%);
}
.marker-blue {
background: var(--underline-blue);
color: var(--text-main);
}
.marker-red {
background: var(--underline-red);
color: var(--text-main);
} .is-style-information-box, .information-box, .information,
.is-style-question-box, .question-box, .question,
.is-style-alert-box, .alert-box, .alert,
.is-style-memo-box, .memo-box, .memo,
.is-style-comment-box, .comment-box, .comment,
.is-style-good-box, .good-box, .good,
.is-style-bad-box, .bad-box, .bad,
.is-style-ok-box, .ok-box, .ok,
.is-style-ng-box, .ng-box,
.is-style-profile-box, .profile-box {
background-color: var(--bg3);
border-width: 2px;
} .blank-box.sticky,
.sticky.is-style-blank-box-red,
.sticky.is-style-blank-box-navy,
.sticky.is-style-blank-box-blue,
.sticky.is-style-blank-box-yellow,
.sticky.is-style-blank-box-green,
.sticky.is-style-blank-box-pink,
.sticky.is-style-blank-box-orange,
.is-style-sticky-gray,
.is-style-sticky-yellow,
.is-style-sticky-red,
.is-style-sticky-blue,
.is-style-sticky-green,
.is-style-primary-box, .primary-box, .sp-primary, .primary {
color: #1c1a1a;
} .label-box-label {
text-shadow: var(--bg3) 3px 0 0, var(--bg3) 2px 1px 0, var(--bg3) 2px 2px 0, var(--bg3) 2px 3px 0, var(--bg3) 1px 3px 0, var(--bg3) 0 3px 0, var(--bg3) -1px 3px 0, var(--bg3) -2px 2px 0, var(--bg3) -3px 1px 0, var(--bg3) -3px 0 0, var(--bg3) -3px -1px 0, var(--bg3) -3px -2px 0, var(--bg3) -2px -2px 0, var(--bg3) -1px -3px 0, var(--bg3) 0 -3px 0, var(--bg3) 1px -3px 0, var(--bg3) 2px -2px 0, var(--bg3) 2px -2px 0, var(--bg3) 3px -1px 0;
} .caption-box:not(.has-border-color, [class*=cb-]) .caption-box-label {
color: #1c1a1a;
}
.tab-caption-box:not(.has-border-color, [class*=tcb-]) span.tab-caption-box-label-text {
color: #1c1a1a;
}
.toggle-box:not(.has-border-color, [class*=tb-]) label.toggle-button {
color: #1c1a1a;
} .micro-balloon {
background-color: var(--bg3);
}
.micro-balloon::after {
border-top-color: var(--bg3);
}
.micro-bottom.micro-balloon::after {
border-bottom-color: var(--bg3);
} .search-form div.sform {
background-color: var(--bg3);
}
.search-form div.sbtn::after {
color: var(--text-main);
}
.search-form div.sbtn:hover {
color: var(--text-main);
background-color: var(--bg1-on);
} .faq-item-label {
font-size: 26px;
}
.faq-answer-label {
font-size: 20px;
margin-left: 4px;
}
.faq-answer-content.faq-item-content p {
font-size: 16px;
} .article h2,
.sidebar h2,
.sidebar h3 {
background: none;
}
.article h3,
.article h4,
.article h5,
.article h6 {
border: none;
} .post-navi-default.post-navi-border a {
border: 1px solid var(--cocoon-basic-border-color);
}
.post-navi-default.post-navi-border .next-post {
border-top-width: 1px;
margin-top: 6px;
}
@media screen and (max-width: 480px) {
.pager-post-navi.post-navi-square a:last-child {
border-top-width: 1px;
margin-top: 6px;
}
}
:root {
--text-main: #faf8f7;
--bg4: #1c1a1a;
--bg3:#242529;
--bg2:#2d343a;
--bg1:#42505e;
--bg1-on:#313c46bd;
--underline-blue: #234794 ;
--underline:rgba(255, 255, 0, 0.801);
--underline-red:#ff2f33;
}
.marker {
background: yellow;
color: #1c1a1a;
}
.keyboard-key {
box-shadow: 1px 2px 2px #6e6e6e;
} .sbs-line.sbp-r .speech-balloon {
background-color: var(--bg2);
border-color: #85e249;
border-width: 2px;
}
.cocoon-block-balloon.not-nested-style.sbs-line.sbp-r > .speech-balloon {
border-width: 2px;
}
.sbs-line.sbp-r .speech-balloon::after,
.sbs-stn.sbp-r .speech-balloon::after {
border-left-color: var(--bg2);
}
.sbs-line.sbp-l .speech-balloon::after,
.sbs-flat.sbp-l .speech-balloon::after {
border-right-color: var(--bg2);
}
.sbs-flat.sbp-r .speech-balloon::after {
border-left-color: var(--bg2);
}
.sbs-line.sbp-l .speech-balloon,
.sbs-flat.sbp-l .speech-balloon,
.sbs-flat.sbp-r .speech-balloon {
background-color: var(--bg2);
border-color: var(--text-main);
border-width: 2px;
}
.cocoon-block-balloon.not-nested-style.sbs-line.sbp-l,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-l,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-r {
--cocoon-custom-border-color: var(--text-main);
}
.cocoon-block-balloon.not-nested-style.sbs-line.sbp-l > .speech-balloon,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-l > .speech-balloon,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-r > .speech-balloon {
border-width: 2px;
}
.sns-buttons a {
background-color: #585858;
} a {
color: #99ccff;
}
a:hover {
color: #f7a488;
}
.bc-brand-color-white a {
background-color: #888;
} .speech-wrap,
.toggle-box,
.timeline-box,
.iconlist-box,
.faq-wrap,
.caption-box,
.tab-caption-box,
.label-box,
.micro-balloon,
.micro-text {
--cocoon-custom-text-color: var(--text-main);
}
.info-list,
.info-list .info-list-item-content-link,
.widget_info_list {
color: var(--text-main);
}
.breadcrumb.sbp-main-before,
.breadcrumb.sbp-footer-before,
.breadcrumb.pbp-main-before,
.breadcrumb.pbp-footer-before {
background-color: transparent;
}
.toggle-box {
--cocoon-custom-background-color: transparent;
}
.has-box-style,
.has-border {
--cocoon-box-border-color: #ccc;
}
.is-style-border-thin-and-thick,
.is-style-border-radius-s-thin-and-thick,
.is-style-border-radius-l-thin-and-thick {
border-color: rgba(255, 255, 255, 0.1);
}
.is-style-light-background-box {
background-color: rgba(255, 255, 255, 0.1);
}
.is-style-stripe-box {
background-image: repeating-linear-gradient(-45deg, #333 0, #333 3px, transparent 3px, transparent 6px);
}
.is-style-checkered-box {
background-image: linear-gradient(90deg, rgba(232, 238, 236, 0.1) 50%, transparent 50%), linear-gradient(rgba(234, 236, 238, 0.1) 50%, transparent 50%);
}
.is-style-stitch-box {
background-color: rgba(255, 255, 255, 0.2);
box-shadow: 0px 0px 0px 10px rgba(255, 255, 255, 0.2);
}
.is-style-border-top-box {
box-shadow: 0 3px 5px rgba(255, 255, 255, 0.22);
}
.is-style-border-left-box {
box-shadow: 0px 2px 3px rgba(255, 255, 255, 0.33);
}
[class^=is-style-balloon-], [class*=" is-style-balloon-"] {
--cocoon-white-color: var(--bg3);
background: var(--cocoon-white-color);
border: 1px solid var(--cocoon-box-border-color);
}