@charset "UTF-8";
   :root {
--cocoon-sns-color: #333;
--border-color: #ccc;
--s-text-color: #999;
--cocoon-badge-border-radius: 0;
--cocoon-basic-border-radius: 0;
--cocoon-middle-border-radius: 0;
--cocoon-middle-thickness-color: var(--border-color);
--cocoon-thin-color: var(--border-color);
--cocoon-three-d-border-colors: var(--border-color);
--cocoon-text-size-s: 14px;
--cocoon-list-padding: 0;
--cocoon-list-wide-padding: var(--padding15) var(--padding15) var(--padding15) 40px;
} :root {
--aspect-ratio: 16 / 9;
--column: 1;
--swiper: 2;
--fpt-column: 2;
--title-line: 3;
--shadow-color: 0 0 3px rgb(0 0 0 / 20%);
--thumb-width: 120px;
--main-padding: var(--gap30);
--padding15: 15px;
--hvn-white-color: #fff;
}
.hvn-radius {
--border-radius10: 10px;
--border-radius100: 100vmax;
}
.main .toc {
--main-padding: var(--gap30);
} .recommended {
--column: 3;
--gap: var(--padding15);
} .recommended .widget-entry-cards:has(> :nth-child(-n+3):last-child) {
--gap: var(--gap30);
} .related-list,
.ect-2-columns {
--column: 2;
}
.footer,
.ect-3-columns {
--column: 3;
} .fpt-columns .list {
--column: 1;
}
.fpt-3-columns {
--fpt-column: 3;
} .no-sidebar .main,
.container {
--swiper: 3;
}
.main {
--swiper: 2;
}
.sidebar,
.footer {
--swiper: 1;
} @media (width <=1023px) {
.main {
--swiper: 3;
}
}
@media (width <=834px) {
.recommended {
--column: 2;
--gap: var(--gap30);
}
.ect-3-columns {
--column: 2;
}
.footer {
--column: 1;
}
.fpt-columns {
--fpt-column: 1;
}
.fpt-columns:has(.ect-vertical-card) {
--fpt-column: 2;
}
.container,
.no-sidebar .main,
.main,
.footer {
--swiper: 2;
}
}
@media (width <=480px) {
:root,
.main .toc {
--main-padding: 15px;
}
.recommended,
.recommended .widget-entry-cards:has(> :nth-child(-n+3):last-child) {
--gap: var(--padding15);
}
.related-list,
.ect-2-columns,
.ect-3-columns {
--column: 1;
}
.fpt-columns:has(.ect-vertical-card) {
--fpt-column: 1;
}
.container,
.no-sidebar .main,
.main,
.footer {
--swiper: 1;
}
} .body {
background-color: var(--body-color);
overflow-x: clip;
scroll-behavior: smooth;
}
.container,
.sidebar-menu-content {
counter-reset: number;
}
.container {
padding: 0;
}
.body .a-wrap {
background-color: transparent;
border: 0!important;
margin: 0;
opacity: 1!important;
overflow: unset!important;
padding: 0;
position: relative;
width: 100%;
}
blockquote cite,
cite,
figcaption {
color: var(--s-text-color);
font-size: var(--cocoon-text-size-s);
font-style: normal;
opacity: 1;
padding: 0;
}
.editor-styles-wrapper {
z-index: 0;
} pre::-webkit-scrollbar,
.scrollable-table::-webkit-scrollbar,
.tab-label-group::-webkit-scrollbar,
.hvn-content-wrap::-webkit-scrollbar {
background-color: #fefefe;
box-shadow: inset 0 0 2px 0 rgb(0 0 0 / 15%);
height: 10px;
width: 10px;
}
pre::-webkit-scrollbar-thumb,
.scrollable-table::-webkit-scrollbar-thumb,
.tab-label-group::-webkit-scrollbar-thumb,
.hvn-content-wrap::-webkit-scrollbar-thumb {
background-clip: padding-box;
background-color: #ccc;
border: 3px solid transparent;
}
.cat-label {
display: none;
}
::placeholder {
color: var(--cocoon-thin-color);
}
*:focus {
outline: none;
} .header-container {
background-color: #fff;
}
.body .header-in {
height: 80px;
}
.logo-image {
padding: 0;
}
.logo-text {
line-height: 1;
padding: 0;
}
.header .site-name-text {
color: var(--main-color);
font-weight: bold;
}
.logo-header img {
max-height: 80px;
width: auto;
}
.header-container #header .site-name-text {
font-size: clamp(22px, 4.5vw, 30px);
line-height: 1;
} .navi {
background-color: var(--main-color);
}
.navi-in {
padding: 0 10px;
}
.body .navi-in a {
color: var(--text-color);
font-weight: bold;
transition: none;
}
.navi-in a:hover {
background-color: rgb(255 255 255 / 20%);
}
.navi-in > ul li:before {
content: none;
}
.body .item-description {
display: none;
}
.navi-in > ul .sub-menu {
background-color: var(--main-color);
}
#navi-in .sub-menu a {
padding: 0 1.4em;
} .notice-area:not(.nt-warning, .nt-danger) {
background-color: var(--hover-color);
color: var(--main-color);
}
.notice-area {
box-shadow: inset 0 0 3px rgb(0 0 0 / 20%);
font-size: 14px;
font-weight: bold;
line-height: 40px;
overflow: hidden;
padding: 0;
position: relative;
text-overflow: ellipsis;
white-space: nowrap;
}
.nt-warning:before,
.nt-danger:before {
background-image: repeating-linear-gradient(-45deg, #fff 0 5px, transparent 5px 10px);
content: '';
display: block;
height: 100%;
opacity: 0.1;
position: absolute;
top: 0;
width: 100%;
}
.notice-area-link:hover {
opacity: 1;
}
.notice-area-message a:after,
.notice-area-link .swiper-slide:after,
.notice-area-link:not(:has(.swiper)) .notice-area-message:after {
background-color: rgb(255 255 255 / 40%);
border-radius: 100vmax;
content: var(--hvn-notice);
margin-left: 5px;
padding: 3px 10px;
}
.notice-area-message .swiper {
height: 40px;
}
.notice-area-message a {
color: var(--main-color);
display: block;
text-decoration: none;
}
.notice-area:is(.nt-warning, .nt-danger) a {
color: #fff;
} .appeal-in {
padding: var(--gap30) 10px;
}
.appeal-content > div:last-child {
margin-bottom: 0;
}
.appeal-title {
font-size: 16px;
margin-bottom: var(--padding15);
}
.appeal-message {
margin-bottom: var(--padding15);
}
.appeal-content {
background-color: rgb(var(--body-rgb-color) / 85%);
border-radius: var(--border-radius10);
padding: var(--gap30) var(--main-padding);
} .ba-fixed.appeal {
clip-path: inset(0 0 0 0);
}
.ba-fixed.appeal:before {
background-image: inherit;
background-position: top center;
background-size: cover;
content: '';
height: 100vh;
left: 0px;
position: fixed;
top: 0px;
width: 100%;
z-index: -1;
} .recommended {
margin: var(--gap30) 0 0;
}
.body .recommended-in {
padding: 0 10px;
}
.body .recommended .widget-entry-cards {
flex-direction: row;
gap: var(--gap);
justify-content: unset;
margin: 0;
}
.body .container .recommended .a-wrap {
margin: 0;
max-width: calc((100% - var(--gap) * (var(--column) - 1)) / var(--column));
}
.body .recommended .e-card {
border-radius: var(--border-radius10);
} .body .recommended .navi-entry-cards .a-wrap:nth-of-type(n+5) {
display: none;
} .body .recommended.rcs-image-only .card-title {
display: none;
}
.body .recommended.rcs-image-only .card-content {
background-color: unset;
} .content {
margin: var(--gap30) 0 0;
position: relative;
z-index: 1;
} .content-only .content {
margin-bottom: var(--gap30)
}
.content-in {
padding: 0 10px;
} .front-top-page.page .article-header {
display: none;
}
.front-top-page.page .entry-content {
margin-top: 0;
}
.front-top-page.page .entry-content h2:first-child {
margin-top: 0;
}
.front-top-page .article-footer {
display: none;
} .body .main {
align-items: start;
background-color: transparent;
border: 0;
border-radius: 0;
display: grid;
gap: var(--gap30);
grid-template-columns: minmax(0, 1fr);
margin: 0;
padding: 0;
} .body.error404 .main,
.body.page .main,
.body.single .main,
.archive .entry-content,
.body aside.widget:not(.widget_search) {
background-color: var(--content-bgcolor);
border-radius: var(--border-radius10);
display: block;
padding: var(--gap30) var(--main-padding);
}
.body.error404 .article p {
margin: 0;
}
.archive .entry-content h2:first-child {
margin-top: 0;
}
.archive .eye-catch-wrap {
display: none;
} .sidebar {
background-color: transparent;
display: flex;
flex-direction: column;
gap: var(--gap30);
margin: 0!important;
padding: 0!important;
}
.body .sidebar:after {
content: none;
} .footer {
background-color: #fff;
margin: var(--gap30) 0 0;
padding: 0;
}
.footer-in {
display: flex;
flex-direction: column;
gap: var(--gap30);
padding: var(--gap30) 10px 0;
}
.footer-bottom {
margin-top: 0;
padding: 0;
}
.body .footer-bottom .footer-bottom-content {
line-height: 1.4;
}
.navi-footer-in > .menu-footer {
margin-bottom: var(--padding15);
row-gap: 5px;
}
.navi-footer-in a:hover {
background-color: transparent;
}
.copyright {
margin: 0;
}
.navi-footer-in > ul li:before {
content: none;
}
.navi-footer-in > ul li {
font-weight: normal;
}
.footer-bottom a {
line-height: 1.4;
} .pr-label-l {
background-color: unset;
border: 1px solid #eee;
font-size: var(--cocoon-text-size-s);
margin: var(--gap30) 0;
padding: 3px;
}
.pr-label-l:before {
content: '\f071';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
margin-right: 3px;
}
.body .ad-area.ad-index-top,
.body .ad-area.ad-index-bottom,
.body .ad-area.ad-index-middle,
.body .ad-area.ad-sidebar-top,
.body .ad-area.ad-sidebar-bottom {
margin-bottom: 0;
} .body .content .list {
align-items: start;
display: grid;
gap: var(--gap30);
grid-template-columns: repeat(var(--column), minmax(0, 1fr));
margin-bottom: 0!important;
}
.body .list .a-wrap {
max-width: unset;
} .body .container .entry-card-meta {
bottom: 0;
display: flex;
gap: 5px;
margin: 0;
position: absolute;
right: 0;
} .comment-meta:before,
.rss-date:before,
.recent-comment-date:before {
content: '\f017';
font-family: 'Font Awesome 5 Free';
margin-right: 3px;
}
span.fas.fa-history:before {
content: '\f2f1';
} .e-card-info {
gap: 5px;
} .list-wrap,
.list-new-entries,
.list-columns {
display: grid;
gap: var(--gap30);
margin: 0;
position: relative;
}
.front-page-type-category .list-columns:not(:has(.list-column)),
.list-columns.fpt-columns:not(:has(.list-column)) {
display: none;
} .list-columns.fpt-columns {
grid-template-columns: repeat(var(--fpt-column), minmax(0, 1fr));
}
.list-column,
.list-columns.fpt-columns .widget-entry-cards {
display: flex;
flex-direction: column;
gap: var(--gap30);
margin: 0;
width: 100%;
}
.list-columns .a-wrap:after {
content: none;
} .appeal-button,
.ranking-item-link-buttons a,
.cta-button .btn,
.key-btn,
.comment-form .submit,
.list-more-button,
.pagination-next-link {
align-content: center;
background-color: #fff;
border: 1px solid var(--main-color);
border-radius: var(--border-radius100);
box-shadow: var(--shadow-color);
color: #333;
display: block;
font-size: var(--cocoon-text-size-s)!important;
font-weight: normal;
margin: 0;
min-height: 40px;
padding: 0!important;
text-align: center;
transition: none!important;
width: 100%;
}
.appeal-button,
.ranking-item-link-buttons a,
.cta-button .btn {
border-radius: 0;
}
.pager-links a:hover span,
.appeal-button:hover,
.ranking-item-link-buttons a:hover,
.cta-button .btn:hover,
.key-btn:hover,
.comment-form .submit:hover,
.list-more-button:hover,
.pagination-next-link:hover,
.pagination a:hover,
.comment-page-link a:hover {
background-color: var(--hover-color);
color: #333;
opacity: 1;
}
.ranking-item-link-buttons a:after,
.cta-button .btn:after {
content: none;
} .list-more-button-wrap {
margin-top: auto;
}
.pagination-next {
margin: 0;
} .pagination {
gap: 5px;
margin: 0;
}
.pagination .prev,
.pagination .next {
display: none;
}
.body .page-numbers {
background-color: #fff;
border: 1px solid var(--main-color);
border-radius: var(--border-radius100);
box-shadow: var(--shadow-color);
font-size: var(--cocoon-text-size-s);
color: #333;
height: 40px;
line-height: 40px;
margin: 0;
padding: 0;
transition: none!important;
width: 40px;
}
.page-numbers.dots {
background-color: unset;
border: 0;
box-shadow: unset;
color: var(--title-color);
display: block;
opacity: 1;
width: unset;
}
.page-numbers.current {
background-color: var(--main-color);
color: var(--text-color);
opacity: 1;
} .body .main > .article {
margin-bottom: 0;
}
.body:not(.archive) .article-header {
margin-bottom: var(--gap30);
} .body .entry-title {
font-size: 22px;
margin: 0 0 var(--padding15);
padding: 0;
} .entry-categories-tags {
margin-bottom: 0;
}
.entry-categories-tags .entry-tags {
display: flex;
flex-wrap: wrap;
gap: 5px;
margin-bottom: var(--gap30);
} .date-tags {
align-items: center;
display: flex;
gap: 5px;
justify-content: flex-end;
margin-bottom: var(--gap30);
}
.body .post-date,
.body .post-update,
.rss-date,
.body .post-comment-count {
color: var(--s-text-color);
font-size: var(--cocoon-text-size-s);
line-height: 1;
margin: 0;
padding: 0;
}
.post-update {
order: -1;
} .body .pager-post-navi.cf:after {
content: none;
}
.body .pager-post-navi {
border-top: 1px dotted var(--cocoon-basic-border-color);
gap: var(--padding15);
margin: var(--gap30) 0 0 0;
padding: var(--gap30) 0 0 0;
}
.pager-post-navi a.prev-post,
.pager-post-navi a.next-post {
font-size: var(--cocoon-text-size-s);
line-height: 1.4;
margin: 1.5em 0 0 0;
padding: 0;
}
.pager-post-navi a.prev-post .prev-post-title {
margin-left: 10px;
}
.pager-post-navi a.next-post .next-post-title {
margin-right: 10px;
}
.pager-post-navi a.next-post {
margin-left: auto;
}
.pager-post-navi a .iconfont {
font-size: 19px;
}
.pager-post-navi .prev-post .iconfont {
padding: 0 10px 0 0;
}
.pager-post-navi .next-post .iconfont {
padding: 0 0 0 10px;
}
.pager-post-navi a figure {
border: 0;
box-shadow: var(--shadow-color);
max-width: unset;
min-width: unset;
}
.pager-post-navi .card-thumb:before {
color: var(--s-text-color);
content: var(--hvn-prev);
font-size: var(--cocoon-text-size-s);
line-height: 1;
position: absolute;
text-align: center;
top: -1.5em;
width: var(--thumb-width);
}
.pager-post-navi .next-post-thumb:before {
content: var(--hvn-next);
}
.pager-post-navi .prev-next-home {
display: none;
} .archive .breadcrumb {
display: none;
}
.breadcrumb {
color: var(--s-text-color);
display: flex;
flex-wrap: wrap;
font-size: var(--cocoon-text-size-s);
margin: 0 0 var(--padding15);
}
.breadcrumb a {
color: var(--s-text-color);
}
.breadcrumb-caption {
margin: 0;
}
.breadcrumb-item :is(.fa-folder, .fa-file) {
display: none;
}
.breadcrumb-home .fa-home:before {
content: '\f3c5';
} .entry-content {
margin: var(--gap30) 0 0 0;
}
.body .entry-content > *:last-child {
margin-bottom: 0;
}
.read-time {
font-size: var(--cocoon-text-size-s);
margin: var(--gap30) 0;
} .body .under-entry-content > *:last-child {
margin-bottom: 0;
}
.body .related-list {
display: grid;
gap: var(--padding15);
grid-template-columns: repeat(var(--column), minmax(0, 1fr));
margin: 0;
}
.body .related-entry-card-thumb {
width: var(--thumb-width);
} .body .related-list .e-card {
border: 1px solid var(--cocoon-three-d-border-colors);
padding: var(--padding15);
}
.body .e-card .card-content.related-entry-card-content {
padding-bottom: 0;
} .body .toc {
display: block;
font-size: 16px;
padding: 0;
border: 0;
}
.main .toc {
border: 1px solid var(--border-color);
padding: var(--gap30) var(--main-padding);
}
.main .widget_toc .main-widget-label {
display: none;
}
.toc-title {
display: none;
}
.main .toc-title {
border-bottom: 1px dotted var(--border-color);
display: block;
font-size: 16px;
margin-bottom: var(--gap30);
padding: 0 0 var(--padding15);
}
.main .toc-list {
margin-bottom: 0;
}
.toc .toc-list ul {
padding: 0;
}
.body .navi-menu-content li,
.body .widget_nav_menu li,
.body .toc li {
font-size: 16px;
line-height: 1.8;
margin: 0;
padding: 0 0 0 1.5em;
position: relative;
}
.body .navi-menu-content .sub-menu > li,
.body .widget_nav_menu .sub-menu > li,
.toc .toc-list ul > li {
padding-left: 1em;
}
.body .navi-menu-content li:before,
.body .widget_nav_menu li:before,
.toc-list li:before {
color: var(--main-color);
content: '\f105';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
left: 0;
position: absolute;
top: 0;
}
.toc-list > li:before {
content: '\f138';
}
.toc a:hover {
text-decoration: none;
} .body .sns-buttons {
gap: 5px;
margin: 0;
}
.body .sns-buttons a {
height: 30px;
opacity: 1;
width: 30px;
}
.body .sns-share .social-icon {
font-size: 16px;
padding: 0;
}
.body .sns-share-buttons .share-button .button-caption {
display: none;
}
.search-menu-content,
.share-menu-content,
.follow-menu-content {
left: 50%;
top: 100%;
transform: translate(-50%, 1500%);
}
#search-menu-input:checked ~ #search-menu-content,
#share-menu-input:checked ~ #share-menu-content,
#follow-menu-input:checked ~ #follow-menu-content {
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.share-menu-content .sns-share,
.follow-menu-content .sns-follow {
margin-bottom: 0;
}
.article-footer .sns-share,
.article-footer .sns-follow {
margin: var(--gap30) 0;
} .copy-info {
background-color: var(--hover-color);
border: 1px solid var(--main-color);
border-radius: 0;
box-shadow: var(--shadow-color);
color: unset;
opacity: 1;
padding: var(--padding15);
} .icon-x-corp-logo:before {
content: '\e917';
}
.icon-mastodon-logo:before {
content: '\e928';
}
.icon-bluesky-logo:before {
content: "\e923";
}
.icon-misskey-logo:before {
content: '\e924';
}
.icon-facebook-logo:before {
content: '\e919';
}
.icon-hatebu-logo:before {
content: '\e916';
}
.icon-linkedin-logo:before {
content: '\eacb';
}
.icon-line-logo:before {
content: '\e915';
}
.icon-pinterest-logo:before {
content: '\e92c';
}
.sns-button [class^="icon-"] {
font-size: 18px;
}
.body .icon-x-corp-logo,
.body .icon-mastodon-logo,
.body .icon-bluesky-logo,
.body .icon-misskey-logo,
.body .icon-facebook-logo,
.body .icon-hatebu-logo,
.body .icon-linkedin-logo,
.body .icon-line-logo,
.body .icon-pinterest-logo {
font-size: 16px;
} .eye-catch img,
.a-wrap figure img {
height: 100%;
object-fit: cover;
object-position: center;
width: 100%;
}
.a-wrap figure {
aspect-ratio: 1 / 1;
background-color: var(--hover-color);
flex-shrink: 0;
align-self: flex-start;
margin: 0!important;
overflow: hidden;
width: var(--thumb-width);
}
.body .a-wrap:hover img {
transform: scale(1.1);
transition: all 0.3s ease-in-out;
}
.eye-catch,
.front-top-page .ect-big-card-first .a-wrap:first-child figure,
.ect-big-card .a-wrap figure,
.ect-vertical-card .a-wrap figure,
.card-large-image .a-wrap figure {
aspect-ratio: var(--aspect-ratio);
height: auto;
overflow: hidden;
width: 100%;
} .eye-catch-wrap figure {
background-color: var(--hover-color);
border: 5px solid #fff;
box-shadow: var(--shadow-color);
margin: 0 0 var(--padding15);
} .wp-lightbox-overlay .scrim {
background-color: #000!important;
}
.wp-lightbox-overlay svg {
display: none;
}
.wp-lightbox-overlay button:before {
content: '\f00d';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
color: #fff;
font-size: 20px;
}  .blogcard-type[class*="bct-"] {
padding-top: 12.5px;
} .blogcard-type.bct-none {
padding-top: 0;
}
.blogcard {
padding: var(--padding15);
}
.body .blogcard-content {
margin: 0;
max-height: unset;
min-height: unset;
padding-left: var(--padding15);
padding-bottom: var(--gap30);
}
.blogcard-favicon {
display: none;
}
.blogcard-domain:before {
font-family: 'Font Awesome 5 Free';
font-weight: 900;
content: '\f0ac';
margin-right: 3px;
}
.body .blogcard-footer {
bottom: var(--padding15);
color: var(--s-text-color);
font-size: var(--cocoon-text-size-s);
padding: 0;
position: absolute;
right: var(--padding15);
width: calc(100% - var(--thumb-width) - var(--padding15) * 3);
}
.blogcard-site {
float: unset;
justify-content: flex-end;
}
.blogcard-domain {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} .body .comment-area {
margin-bottom: 0;
}
.comment-form-comment {
line-height: 0;
}
.comment-form-comment label {
line-height: 1.8;
}
.comment-reply-title {
font-size: 16px;
}
.comment-form .logged-in-as {
font-size: var(--cocoon-text-size-s);
margin: 0;
}
.comment-form .submit {
margin-bottom: 0;
}
.commets-list li {
border-bottom: 1px dotted var(--border-color);
margin-bottom: var(--gap30);
}
.commets-list .children li {
border: 0;
margin: 0;
} .comment-reply-link {
background-color: #fff;
border: 1px solid var(--main-color);
box-shadow: var(--shadow-color);
color: #333;
display: inline-block;
margin: 0;
padding: 0 1em;
}
.comment-reply-link:hover {
background-color: var(--hover-color);
transition: none;
}
.commets-list .avatar {
background-color: var(--hover-color);
float: left;
margin-right: 10px;
width: 40px;
}
.comment-author .fn {
color: var(--cocoon-text-color);
display: block;
font-weight: bold;
font-size: unset;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.comment-author .fn a {
color: var(--cocoon-text-color);
text-decoration: none;
}
.comment-author .says {
display: none;
}
.body .comment-content p {
margin-bottom: 0;
}
.commets-list .reply {
margin-top: var(--padding15);
} .body .comment-btn,
.body .comment-respond .form-submit,
.body .comment-respond {
margin: var(--gap30) 0 0 0;
} .commets-list li .comment-respond {
margin-bottom: var(--gap30);
}
.body .commets-list > li:last-of-type {
margin-bottom: 0;
} .comment-page-link:has(.page-numbers) {
gap: 5px;
margin: var(--gap30) 0 0 0;
}
.comment-page-link :is(.prev, .next) {
display: none;
} .body .go-to-top {
bottom: var(--gap30);
right: var(--gap30);
z-index: 9998;
}
.go-to-top-button-icon-font {
background-image: linear-gradient(0deg, var(--main-color) 0, var(--main-color) var(--per), #fff var(--per), #fff 100%);
border: 1px solid var(--main-color);
border-radius: var(--border-radius100);
box-shadow: var(--shadow-color);
font-size: var(--cocoon-text-size-s);
height: 50px;
position: relative;
width: 50px;
}
.go-to-top-button span {
background-image: linear-gradient(0deg, #fff 0%, #fff var(--per), var(--main-color) var(--per), var(--main-color) 100%);
color: transparent;
display: grid;
height: 100%;
place-content: center;
width: 100%;
-webkit-background-clip: text;
} .mobile-menu-buttons .menu-caption {
font-size: 11px;
opacity: 1;
}
.mobile-menu-buttons .menu-button {
width: 70px;
}
.mobile-menu-buttons {
align-items: center;
justify-content: space-between;
}
#navi-in .menu-top.menu-mobile {
display: none;
} .menu-content {
background-color: var(--body-color);
max-width: 370px;
padding: 10px;
}
#slide-in-sidebar {
display: flex;
padding: 0;
}
.menu-close-button {
color: var(--title-color);
line-height: 1.4;
}
.sidebar-menu-close-button .fa-times:before {
content: '\f061';
} .entry-card-content:has(.admin-pv) .e-card-title {
margin: 0;
}
.entry-card .admin-pv {
align-items: center;
color: var(--s-text-color);
display: flex;
flex-wrap: wrap;
font-size: var(--cocoon-text-size-s);
margin: 0;
}
.entry-card .admin-pv > span {
padding: 0 5px 0 0;
}
.entry-card .admin-pv .fa-chart-bar {
margin-right: 3px;
}  .sidebar-scroll {
display: flex;
flex-direction: column;
gap: var(--gap30);
} .content-top,
.content-bottom {
margin: var(--gap30) 0 0;
}
.content-top-in,
.content-bottom-in {
display: flex;
flex-direction: column;
gap: var(--gap30);
padding: 0 10px;
} .footer-widgets:after {
content: none;
}
.footer-widgets {
display: grid;
gap: var(--gap30);
grid-template-columns: repeat(var(--column), minmax(0, 1fr));
margin: 0;
}
.body .footer-left,
.body .footer-center,
.body .footer-right {
display: flex;
flex-direction: column;
gap: var(--gap30);
padding: 0;
width: 100%;
} .ect-2-columns > *,
.ect-3-columns > * {
width: unset;
} .body aside.widget {
margin: 0;
}
.body .widget > ul {
display: flex;
flex-direction: column;
gap: 5px;
padding: 0;
} .list-title,
.archive-title {
font-size: 16px;
line-height: 0;
margin: 0;
position: relative;
text-align: center;
}
.body .list-title-in {
color: var(--title-color);
line-height: 1.8;
margin: 0;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.archive-title span {
margin-right: 0;
}
.list-title-in:before,
.list-title-in:after {
background-color: var(--title-color);
}
aside.widget .widget-title {
background-color: unset;
border-top-left-radius: var(--border-radius10);
border-top-right-radius: var(--border-radius10);
color: var(--cocoon-text-color);
font-size: 16px;
font-weight: bold;
line-height: 1.8;
margin: 0 0 var(--gap30) 0;
padding: 0;
position: relative;
}
.body .widget .widget-entry-cards {
margin-bottom: 0;
} .body .blogcard-snippet,
.body .widget-entry-cards .card-snippet,
.body .rss-entry-card-date {
display: none!important;
}
.widget-entry-cards:after,
.e-card:after,
.card-content:after,
.card-arrow .a-wrap:after {
content: none;
} .e-card {
display: flex;
gap: var(--padding15);
height: 100%;
width: 100%;
}
.body .e-card .card-content {
flex: 1;
margin: 0;
padding: 0 0 20px;
position: relative;
}
.body .blogcard-title,
.body .e-card .card-title {
display: -webkit-box;
font-size: 16px;
font-weight: bold;
line-height: 1.4;
margin: 0;
text-align: left;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: var(--title-line);
} .widget-entry-card-date:not(.display-none) {
align-items: center;
bottom: 0;
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
position: absolute;
right: 0;
}
.widget-entry-card-date > span:nth-last-child(2) {
display: none;
}
.large-thumb .new-entry-card-content:not(:has(.new-entry-card-date.display-none)),
.large-thumb .popular-entry-card-content:not(:has(.popular-entry-card-date.display-none)) {
padding: 0 0 20px;
}
.large-thumb-on .widget-entry-card-date {
display: none;
} .front-top-page .ect-big-card-first .a-wrap:first-child .e-card,
.ect-big-card .e-card,
.ect-vertical-card .e-card,
.large-thumb .e-card {
--title-line: 2;
flex-direction: column;
}
.front-top-page .ect-big-card-first .a-wrap:first-child .card-title,
.body .ect-vertical-card .card-title,
.body .large-thumb .card-title {
height: calc(1.4em * var(--title-line));
}
.widget-entry-cards:not(.swiper) {
display: flex;
flex-direction: column;
gap: var(--gap30);
}
.body .widget-entry-card .card-content {
padding: 0;
} .body .border-partition {
gap: var(--padding15);
}
.border-partition:not(.swiper) .a-wrap {
border-bottom: 1px dotted var(--border-color)!important;
padding-bottom: var(--padding15);
}
.border-partition .a-wrap:first-of-type {
border-top: 0;
}
.border-partition .a-wrap:last-of-type {
border-bottom: 0!important;
padding-bottom: 0;
}
.is-list-horizontal.border-partition .a-wrap {
padding-bottom: 0;
} .body .border-square .e-card {
border: 1px solid var(--cocoon-three-d-border-colors);
padding: var(--padding15);
} .body .large-thumb-on .e-card {
padding: 0!important;
}
.body .large-thumb-on .card-content {
background: rgb(0 0 0 / 30%)!important;
display: grid;
height: 100%;
margin: 0!important;
padding: 0;
place-content: center;
position: absolute;
width: 100%;
}
.body .large-thumb-on .card-title {
background-color: unset;
color: #fff;
height: unset;
margin: 0 10px;
}
.body .large-thumb-on .a-wrap:hover .card-content {
transition: all 0.3s ease-in-out;
} .swiper-wrapper {
margin: 0;
padding: 0;
}
.body .swiper .a-wrap {
display: flex;
max-width: unset!important;
width: calc((100% - var(--gap30) * (var(--swiper) - 1)) / var(--swiper));
}
.body .swiper-button-next:after,
.body .swiper-button-prev:after {
border: 0!important;
color: var(--main-color);
content: '\f138'!important;
display: block;
font-family: 'Font Awesome 5 Free';
font-size: 20px;
font-weight: 900;
height: 100%!important;
margin: 0!important;
transform: unset!important;
width: unset!important;
}
.body .swiper-button-prev:after {
content: '\f137'!important;
}
.body .swiper-button-next,
.body .swiper-button-prev {
background-color: unset!important;
box-shadow: none!important;
display: block!important;
height: fit-content!important;
margin: 0!important;
top: 50%!important;
transform: translateY(-50%);
width: fit-content!important;
}
.body .swiper-button-next {
left: auto!important;
right: 0;
}
.body .swiper .swiper-button-prev {
left: 0!important;
right: auto;
} .body .swiper-button-lock {
display: none;
} .body .swiper.ranking-visible,
.body .swiper:has(.ribbon) {
padding-top: 5px;
}
.body .recommended .a-wrap:before,
.body .recommended .a-wrap:after,
.ribbon {
display: none;
}
.body .a-wrap:has(.ribbon-color-1):before {
content: var(--hvn-ribbon1);
}
.body .a-wrap:has(.ribbon-color-2):before {
content: var(--hvn-ribbon2);
}
.body .a-wrap:has(.ribbon-color-3):before {
content: var(--hvn-ribbon3);
}
.body .a-wrap:has(.ribbon-color-4):before {
content: var(--hvn-ribbon4);
}
.body .a-wrap:has(.ribbon-color-5):before {
content: var(--hvn-ribbon5);
} .rsswidget {
text-decoration: none;
}
.rss-widget-title,
.rss-widget-title:hover {
color: unset;
font-weight: bold;
}
.body .widget_rss ul {
gap: var(--padding15);
}
.widget_rss ul li {
border-bottom: 1px dotted var(--border-color);
display: flex;
flex-direction: column;
line-height: 1.4;
padding-bottom: var(--padding15);
}
.widget_rss li:last-child {
border-bottom: 0;
padding-bottom: 0;
}
.body .widget_rss ul li a {
background: unset;
font-weight: bold;
padding: 0;
}
.rss-date {
order: 10;
text-align: right;
}
.rssSummary,
.widget_rss cite {
color: var(--s-text-color);
font-size: var(--cocoon-text-size-s);
font-style: normal;
} .cta-box {
background-color: unset;
border: 1px solid var(--border-color);
color: unset;
display: flex;
flex-direction: column;
gap: var(--padding15);
padding: var(--padding15);
}
.body .cta-heading {
font-size: 16px;
margin-bottom: 0;
padding: 0;
text-align: center;
}
.body .cta-content {
display: flex;
gap: var(--padding15);
}
.cta-left-and-right .cta-content div,
.cta-right-and-left .cta-content div {
width: 100%;
}
.body .cta-message {
font-size: 16px;
margin-top: 0;
word-break: break-all;
}
.body .cta-message p {
margin-bottom: 0;
}
.cta-button {
margin-top: 0;
}
.cta-right-and-left .cta-content {
flex-direction: row-reverse;
}
.nwa .cta-left-and-right .cta-content,
.nwa .cta-right-and-left .cta-content {
flex-direction: column;
}
.nwa .cta-box .cta-content > div {
flex-shrink: 0;
}  .body .widget-entry-cards.ranking-visible .a-wrap:nth-child(n+4):before,
.body .widget-entry-cards.ranking-visible .a-wrap:nth-child(n+4):after {
content: none;
}
.widget-entry-cards.ranking-visible .card-thumb:before {
content: none!important;
}
.body .widget-entry-cards.ranking-visible .a-wrap:before {
content: counter(p-rank);
padding: 0;
width: 20px;
}
.body .widget-entry-cards.ranking-visible .a-wrap:after {
left: 20px;
} .body .popular-entry-cards .widget-entry-card-pv {
background-color: unset!important;
bottom: 0;
color: var(--s-text-color)!important;
font-size: var(--cocoon-text-size-s);
font-style: normal;
line-height: 1;
margin: 0;
opacity: 1!important;
padding: 0;
position: absolute!important;
top: unset!important;
left: 0;
}
.widget-entry-card-pv:before {
content: '\f080';
font-family: 'Font Awesome 5 Free';
margin-right: 3px;
}
.large-thumb-on .widget-entry-card-pv {
display: none;
}
.body .widget-entry-card:has(.widget-entry-card-pv) .card-content {
padding-bottom: 20px;
} .body .widget .author-box {
margin-bottom: 0;
}
.nwa.widget_author_box .widget-title,
.nwa .widget_author_box .widget-title,
.author-widget-name {
display: none;
}
.author-box {
align-items: center;
display: flex;
padding: var(--padding15);
}
.author-box .author-thumb {
flex-shrink: 0;
float: unset;
margin: 0;
width: auto;
}
.body .author-thumb img {
background-color: var(--hover-color);
height: 100px;
object-fit: cover;
object-position: center;
width: 100px;
}
.author-box .author-content {
border-left: 1px solid var(--border-color);
margin-left: var(--padding15);
padding-left: var(--padding15);
}
.author-box .author-name {
margin-bottom: 0;
}
.author-box .author-name,
.author-box .author-name a {
color: unset;
font-size: 16px;
line-height: 1.8;
text-decoration: none;
}
.body .author-description {
color: var(--s-text-color);
font-size: var(--cocoon-text-size-s);
margin: 0;
}
.body .author-box p {
margin: var(--padding15) 0 0 0;
line-height: 1.4;
}
.profile-follows {
margin-top: var(--padding15);
}
.author-box .sns-follow {
margin-bottom: 0;
}
.body .author-box .sns-follow-buttons a.follow-button {
border: 1px solid var(--cocoon-text-color);
color: var(--cocoon-text-color);
border-radius: 0;
display: flex;
height: 30px;
opacity: 1;
width: 30px;
}
.profile-follows:not(:has(.sns-follow-buttons)) {
display: none;
}
.body .nwa .widget_author_box {
padding: 0!important;
}
.body .nwa .widget_author_box .author-box {
margin: 0;
}
.body .nwa .author-box {
border: 0;
border-radius: var(--border-radius10);
display: block;
overflow: hidden;
padding: 0;
}
.body .main :not(.widget-index-top, .widget-index-bottom) .author-box {
border: 1px solid var(--border-color);
border-radius: 0;
}
.nwa .author-box .author-thumb {
margin: var(--gap30) auto 0;
}
.body .nwa .author-thumb img {
border-radius: 50%;
}
.nwa .author-box .author-content {
border: 0;
padding: var(--padding15) var(--main-padding) var(--gap30);
} .no-sidebar .widget-index-top .box-menu,
.no-sidebar .widget-index-bottom .box-menu,
.wwa .box-menu {
width: calc(100% / 6);
}
.body .widget .box-menus {
margin-bottom: 0;
}
.body .box-menu {
background-color: transparent;
box-shadow: inset 1px 1px 0 0 var(--border-color), 1px 1px 0 0 var(--border-color), 1px 0 0 0 var(--border-color)!important;
display: flex;
flex-direction: column;
justify-content: space-around;
padding: 10px;
}
.body .box-menu-icon {
color: var(--main-color);
}
.body .box-menus .box-menu-icon * {
margin: 0;
}
.box-menu-label {
color: var(--cocoon-text-color);
font-weight: unset;
}
.box-menu-description {
display: none;
}
.box-menu:hover {
background-color: var(--hover-color);
}
.nwa .box-menu:nth-last-child(1):nth-child(odd) {
width: 100%;
} .ranking-items {
border: 1px solid var(--border-color);
display: flex;
flex-direction: column;
gap: var(--padding15);
line-height: 1.8;
padding: var(--padding15);
}
.ranking-item {
border: 0;
border-bottom: 1px dotted var(--border-color);
display: flex;
flex-direction: column;
gap: var(--padding15);
margin: 0!important;
padding: 0 0 var(--padding15);
}
.ranking-item:last-child {
border-bottom: 0;
padding-bottom: 0;
}
.ranking-item-name {
align-items: center;
padding: 0;
}
.body .ranking-item-name-text {
font-size: 16px;
}
.body .ranking-item-img-desc {
display: flex;
gap: var(--padding15);
margin: 0;
padding: 0;
}
.body .ranking-item-img-desc > div {
margin: 0;
max-width: unset;
padding: 0;
}
.ranking-item-image-tag {
text-align: center;
}
.nwa .ranking-item-img-desc a {
padding: 0;
}
.body .ranking-items p {
font-size: 16px;
line-height: 1.8;
margin: 0;
word-break: break-all;
}
.ranking-item-link-buttons {
display: flex!important;
gap: var(--padding15);
margin: 0;
}
.ranking-item-link-buttons > div {
padding: 0;
}
.body .nwa .ranking-item-img-desc {
flex-direction: column;
}
.body .nwa .ranking-item-link-buttons {
flex-direction: column;
}
.nwa .ranking-item .ranking-item-img-desc > div,
.nwa .ranking-item .ranking-item-link-buttons > div {
flex-shrink: 0;
} .ranking-item-name-crown div {
all: unset;
}
.ranking-item-name-crown div:after,
.ranking-item-name-crown div:before {
content: none;
}
.ranking-item-name-crown > div:before {
content: '\f521';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
.g-crown:before {
color: #DBB400;
}
.s-crown:before {
color: #BDC3C9;
}
.c-crown:before {
color: #815a2b;
}
.ranking-item-name-crown:not(:has(.g-crown, .s-crown, .c-crown)) {
display: none;
}
.rating-star {
align-items: center;
display: flex;
font-size: 16px;
} .info-list {
display: flex;
flex-direction: column;
gap: var(--padding15);
padding: 0;
}
.info-list-caption {
font-weight: bold;
}
.info-list.is-style-frame-border {
padding: var(--padding15);
}
.info-list-item {
line-height: 1.8;
padding: 0;
}
.info-list .info-list-item:last-child {
padding-bottom: 0;
}
.is-style-divider-line .info-list-item {
border-bottom: 1px dotted var(--border-color);
padding-bottom: var(--padding15);
}
.info-list-item-content {
margin-bottom: 5px;
}
.info-list-item-meta {
color: var(--s-text-color);
font-size: var(--cocoon-text-size-s);
line-height: 1;
opacity: 1;
text-align: right;
}
.info-list-item-date {
margin: 0;
}
.info-list-item-date:before {
content: '\f017';
font-family: 'Font Awesome 5 Free';
margin-right: 3px;
}
.info-list-item-categorys {
display: none;
}
.info-list-item-content-link:hover {
color: unset;
text-decoration: none;
} .article .recent-comments:not(:last-of-type) {
margin-bottom: var(--gap30);
}
.body .recent-comments figure {
aspect-ratio: 1 / 1;
width: unset;
}
.recent-comments .avatar {
width: 40px;
}
.widget_recent_comments .recent-comment-author {
margin-left: 50px;
line-height: 1.8;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.commets-list .comment-meta,
.widget_recent_comments .recent-comment-date {
color: var(--s-text-color);
display: flex;
font-size: var(--cocoon-text-size-s);
justify-content: flex-end;
line-height: 1;
}
.commets-list .comment-meta a {
color: var(--s-text-color);
text-decoration: none;
}
.comment-content,
.recent-comment-content {
background-color: rgb(204 204 204 / 15%);
border: 0;
border-radius: 0;
font-size: 16px;
line-height: 1.8;
margin-top: 10px;
padding: var(--padding15);
position: relative;
}
.recent-comment-article {
color: var(--s-text-color);
font-size: var(--cocoon-text-size-s);
margin-top: 5px;
line-height: 1.4;
}
.comment-content:before,
.recent-comment-content:before {
border: 10px solid transparent;
border-bottom-color: rgb(204 204 204 / 15%);
content: '';
left: 10px;
margin: 0;
position: absolute;
top: -20px;
}
.recent-comment-content:after {
content: none;
} .comment-awaiting-moderation {
color: var(--cocoon-red-color);
font-style: normal;
}
.body .widget .recent-comments {
gap: var(--padding15);
}
.body .widget .recent-comment {
border-bottom: 1px dotted var(--border-color);
padding-bottom: var(--padding15);
}
.body .widget .recent-comment-link:last-of-type .recent-comment {
border: 0;
padding-bottom: 0;
} select {
background-color: #fff;
color: #333;
display: block;
}
.body .widget_archive li,
.body .widget_categories li,
.body .widget_pages li {
margin: 0;
position: relative;
} .calendar_wrap {
margin: 0;
}
.body .wp-calendar-table {
margin: 0;
max-width: unset;
}
.wp-calendar-nav {
display: flex;
justify-content: space-evenly;
}
.wp-calendar-nav a {
color: unset;
text-decoration: none;
}
.body .wp-calendar-table td,
.body .wp-calendar-table th {
line-height: calc(1.8em + 6px);
padding: 0;
}
.wp-calendar-table td a,
.wp-calendar-table [id$="today"] a {
background-color: var(--main-color);
color: var(--text-color);
text-decoration: none;
}
.wp-calendar-table td a:hover,
.wp-calendar-table [id$="today"] a:hover {
background-color: var(--hover-color);
}
.wp-calendar-table [id$="today"] {
background-color: unset;
font-weight: bold;
}
.calendar_wrap i:before {
margin: 0 3px;
} .widget .children {
display: flex;
flex-direction: column;
gap: 5px;
margin: 5px 0 0;
}
.tag-link,
.body .widget_archive a,
.body .widget_categories a,
.body .widget_tag_cloud a,
.body .widget_pages a {
align-items: center;
background-color: rgb(204 204 204 / 15%);
border-radius: 100vmax;
color: var(--cocoon-text-color);
display: flex;
font-size: 16px;
justify-content: space-between;
line-height: 1.8;
min-width: 0;
padding: 0 10px;
transition: none!important;
}
.tag-link:hover,
.body .widget_archive a:hover,
.body .widget_categories a:hover,
.body .widget_tag_cloud a:hover,
.body .widget_pages a:hover {
background-color: var(--hover-color)!important;
}
.tag-link,
.list-item-caption,
.tag-caption,
.body .widget_pages a {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} .sitemap .list-item-caption {
white-space: unset;
} .tagcloud {
gap: 5px;
}
.tag-link,
.body .widget_tag_cloud a {
border: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
margin: 0;
}
.body .tagcloud .tag-caption .tax-icon,
.entry-categories-tags .tax-icon {
margin-right: 3px;
} .body .widget_nav_menu ul {
padding-left: 0;
}
.navi-menu-content .widget {
overflow: hidden;
}
.body .navi-menu-content .menu-drawer {
display: block;
}
.body .navi-menu-content > ul,
.body .widget_nav_menu > ul {
display: block;
}
.body .navi-menu-content .sub-menu,
.body .widget_nav_menu .sub-menu {
padding-left: 0;
}
.body .navi-menu-content li:before,
.body .widget_nav_menu li:before {
content: '\f138';
}
.body .navi-menu-content .sub-menu > li:before,
.body .widget_nav_menu .sub-menu > li:before {
content: '\f105';
}
.body .container .navi-menu-content li a,
.body .container .widget_nav_menu li a {
background-color: transparent;
font-weight: normal;
padding: 0;
}
.navi-menu-close-button .fa-times:before {
content: '\f060';
}
.widget_nav_menu li {
display: list-item;
} :placeholder {
color: transparent;
}
.body .widget_search .widget-title {
display: none;
}
.body .search-box {
margin: 0;
}
.body .search-edit {
padding: 10px;
} .archive-title + .search-box {
display: none;
}
.posts-not-found h2 {
display: none;
}
.posts-not-found {
color: var(--title-color);
width: 100%;
} .body .widget_recent_comments ul,
.body .widget_recent_entries ul {
gap: var(--padding15);
}
.widget_recent_comments li,
.widget_recent_entries li {
border-bottom: 1px dotted var(--border-color);
border-bottom: 1px dotted var(--border-color);
padding-bottom: var(--padding15);
}
.widget_recent_comments li:last-child,
.widget_recent_entries li:last-child {
border-bottom: 0;
padding-bottom: 0;
}
.body .widget_recent_entries ul li a {
background-color: unset;
padding: 0;
}
.widget_recent_entries .post-date {
display: block;
margin-top: 5px;
text-align: right;
}
.widget_recent_entries .post-date:before {
content: '\f017';
font-family: 'Font Awesome 5 Free';
margin-right: 3px;
} .widget_recent_comments a {
text-decoration: none;
color: var(--cocoon-text-color);
}
.widget_recent_comments li {
display: block;
padding-top: 0;
}  .main .article .widget-title,
.main .under-entry-content h2,
.article :is(h2, h3, h4, h5, h6) {
background-color: unset;
border: 0;
font-size: 22px;
font-weight: bold;
line-height: 1.25;
margin: calc(var(--gap30) * 3) 0 var(--gap30) 0;
padding: 0;
position: relative;
text-align: left;
z-index: 0;
}
.body .article :is(h2, h3, h4, h5, h6) {
margin: calc(var(--gap30) * 3) 0 var(--gap30) 0;
} [class*=is-style-icon-list-] > li {
padding-left: 1.8em;
}
:is(ul, ol).has-background {
padding: var(--cocoon-list-wide-padding);
}
.body li > :is(ul, ol).has-border {
border: 0;
padding-bottom: 0;
padding-right: 0;
padding-top: 0;
}
.body :is(ul, ol).has-list-style.has-background,
.body :is(ul, ol).has-list-style {
padding-left: calc(40px - 1.8em);
} .body figure .scrollable-table {
margin-bottom: 0;
}
figure.wp-block-table table,
.body table {
width: 100%;
}
.wp-block-table tfoot,
.wp-block-table thead {
border: 0;
}
.body table tr:nth-of-type(2n+1) {
background-color: unset;
}
.body table th {
background-color: #eee;
border-color: var(--border-color);
font-size: 16px;
padding: 3px 5px;
color: #333;
font-weight: bold;
text-align: center;
}
.body table td {
background-color: transparent;
border-color: var(--border-color);
font-size: 16px;
padding: 3px 5px;
word-break: break-all;
}
.wp-block-table.is-style-stripes {
border-bottom: 0;
}
.scrollable-table.stfc-sticky table:not(.wp-calendar-table) tr > *:first-child {
background-color: #eee;
}
.scrollable-table.is-scrollable:before {
animation: leftright 1s infinite alternate ease-in-out;
content: var(--hvn-table);
display: block;
font-size: var(--cocoon-text-size-s);
left: 0;
margin: 0;
position: sticky;
text-align: right;
top: 0;
}
.scroll-hint-icon-wrap {
display: none;
}
@keyframes leftright {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-10px);
}
}
.scrollable-table th,
.scrollable-table td {
white-space: unset;
} blockquote,
.is-style-comment-box,
.is-style-profile-box,
.profile-box,
.comment-box {
border-color: #ccc;
background-color: #f9f9f9;
}
blockquote:before {
content: '\f10d';
font-weight: 900;
}
blockquote:after {
content: none;
}
blockquote:before,
.is-style-comment-box:before,
.is-style-profile-box:before,
.profile-box:before,
.comment-box:before {
border-color: #ccc;
color: #ccc;
}
blockquote,
.is-style-information-box,
.is-style-question-box,
.is-style-alert-box,
.is-style-memo-box,
.is-style-comment-box,
.is-style-ok-box,
.is-style-ng-box,
.is-style-good-box,
.is-style-bad-box,
.is-style-profile-box,
.information-box,
.question-box,
.alert-box,
.information,
.question,
.alert,
.memo-box,
.comment-box,
.common-icon-box {
border-radius: 0;
border-width: 0;
color: #333;
padding: var(--padding15) var(--padding15) var(--padding15) calc(1em + var(--padding15) * 3);
}
blockquote:before,
.is-style-information-box:before,
.is-style-question-box:before,
.is-style-alert-box:before,
.is-style-memo-box:before,
.is-style-comment-box:before,
.is-style-ok-box:before,
.is-style-ng-box:before,
.is-style-good-box:before,
.is-style-bad-box:before,
.is-style-profile-box:before,
.information-box:before,
.question-box:before,
.alert-box:before,
.information:before,
.question:before,
.alert:before,
.memo-box:before,
.comment-box:before,
.common-icon-box:before {
align-content: center;
border-right: 1px dashed;
display: block;
font-family: 'Font Awesome 5 Free';
font-size: 16px;
inset: 0;
line-height: 1.8;
margin: var(--padding15) 0;
padding: 0;
text-align: center;
width: calc(1em + var(--padding15) * 2);
}
.is-style-alert-box:before,
.alert-box:before,
.alert:before {
content: '\f071';
} .is-style-primary-box,
.is-style-secondary-box,
.is-style-success-box,
.is-style-info-box,
.is-style-warning-box,
.is-style-danger-box,
.is-style-light-box,
.is-style-dark-box,
.primary-box,
.secondary-box,
.success-box,
.info-box,
.warning-box,
.danger-box,
.light-box,
.dark-box {
border-radius: 0;
padding: var(--padding15);
} .blank-box {
--cocoon-custom-border-color: var(--border-color);
border-color: var(--cocoon-custom-border-color);
border-radius: 0;
border-width: 1px;
padding: var(--padding15);
}
[class*=is-style-blank-box-] {
border-width: 1px;
padding: var(--padding15);
} [class*=is-style-sticky-],
.blank-box.sticky {
border-width: 0 0 0 5px;
color: #333;
padding: var(--padding15) var(--padding15) var(--padding15) 10px;
} .blank-box.bb-tab .bb-label {
font-family: unset;
}
.blank-box.bb-tab::before,
.blank-box.bb-tab .bb-label {
border-radius: 0;
font-size: var(--cocoon-text-size-s);
height: 25px;
line-height: 25px;
left: -1px;
padding: 0 var(--padding15);
top: -26px;
}
.blank-box.bb-tab {
margin-top: calc(var(--gap30) + 25px);
} .speech-icon img {
aspect-ratio: 1 / 1;
background-color: var(--hover-color);
border-width: 1px;
object-fit: cover;
}
.speech-balloon {
--cocoon-custom-text-color: #333;
} .blogcard-label {
background-color: var(--content-bgcolor);
border-radius: 0;
color: unset;
font-size: var(--cocoon-text-size-s);
left: 14px;
letter-spacing: normal;
line-height: 25px;
padding: 0 var(--padding15);
top: -12.5px;
} .iconlist-box {
padding-left: 0;
}
.iconlist-box:has(.iconlist-title:empty) {
--cocoon-custom-border-color: transparent;
padding-bottom: 0;
padding-top: 0;
}
.body .iconlist-box :is(ul, ol) {
border: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
}
.body .iconlist-box :is(ul, ol).has-list-style {
padding-left: calc(40px - 1.8em);
} .toggle-wrap {
border: 1px solid var(--border-color);
}
.toggle-button {
background-color: var(--border-color);
border: 0;
color: #333;
padding: var(--padding15) calc(var(--padding15) + 1em) var(--padding15) var(--padding15);
}
.toggle-button:hover {
opacity: 1;
}
.body .toggle-wrap .toggle-content {
transition: none;
}
.toggle-checkbox:checked ~ .toggle-content {
border: 0;
padding: var(--padding15);
}
.is-style-accordion > .caption-box-label:after,
.is-style-accordion > .faq > .faq-question::before,
.toggle-button:before {
align-items: center;
color: unset;
content: '\f107';
display: flex;
font-family: 'Font Awesome 5 Free';
font-size: 16px;
font-weight: 900;
height: 100%;
margin: 0;
opacity: 1;
position: absolute;
right: 1em;
top: 0;
}
.is-style-accordion .caption-box-label.active:after,
.is-style-accordion > .faq > .faq-question.active::before,
.toggle-checkbox:checked ~ .toggle-button:before {
content: '\f106';
} .faq-question {
margin-bottom: var(--gap30);
align-items: unset;
}
.faq-wrap:not(.is-style-square, .is-style-accordion) {
--cocoon-custom-border-color: transparent;
}
.faq-wrap.is-style-accordion {
padding: 0;
}
.body .faq .faq-item-label {
font-size: 16px;
font-weight: bold;
height: 100%;
margin-right: 0.5em;
padding: 0;
text-align: center;
width: 1.8em;
}
.faq-item-content {
margin: 0;
}
.is-style-accordion > .faq > .faq-question {
background-color: var(--border-color);
}
.body .is-style-accordion .caption-box-label,
.body .is-style-accordion .faq-item {
cursor: pointer;
padding: var(--padding15) calc(var(--padding15) + 1em) var(--padding15) var(--padding15);
}
.is-style-accordion .faq-question {
color: #333;
} div.search-form {
gap: 10px;
margin-top: var(--gap30);
}
.search-form > div {
border-color: var(--border-color);
border-radius: 0;
font-size: 16px;
margin-left: 0;
padding: 5px;
}
.search-form div.sbtn {
background-color: var(--main-color);
border: 1px solid var(--main-color);
color: var(--text-color);
transition: none;
}
.search-form div.sbtn:hover {
background-color: var(--hover-color);
border-color: var(--main-color);
color: var(--main-color);
}
.search-form div.sbtn::after {
color: var(--cocoon-text-color);
font-size: 25px;
margin: 0;
} .timeline-box {
padding: var(--padding15);
}
.timeline-item-label {
padding: var(--padding15) 20px 0 0;
}
.timeline-title {
font-size: 16px;
}
.timeline-item-content {
border-color: #eee;
padding: var(--padding15) 0 0 20px;
}
.timeline-item:before {
background-color: var(--main-color);
height: 16px;
left: 103px;
top: 20px;
width: 16px;
}
.timeline-item:last-of-type .timeline-item-content {
padding-bottom: var(--padding15);
}
.body .faq .faq-question-content,
.body .timeline .timeline-item-title {
background: unset;
border: 0;
box-shadow: unset;
color: unset!important;
display: block;
font-size: unset;
line-height: unset;
margin: unset;
min-height: unset;
padding: 0!important;
position: relative;
text-align: unset;
}
.body .timeline .timeline-item-title:before,
.body .timeline .timeline-item-title:after {
content: none;
} .block-box-label::before {
margin-right: 6px;
}
.caption-box {
--cocoon-custom-border-color: var(--border-color);
border-color: var(--cocoon-custom-border-color);
border-width: 1px;
}
.caption-box .caption-box-label,
.caption-box.not-nested-style:not(.has-border-color) .caption-box-label {
background-color: var(--border-color);
color: #333;
padding: var(--padding15);
position: relative;
}
.caption-box-content {
padding: var(--padding15);
} .tab-caption-box {
--cocoon-custom-border-color: var(--border-color);
position: relative;
}
.tab-caption-box-label {
border-radius: 0;
color: #fff;
display: block;
font-size: var(--cocoon-text-size-s);
line-height: 25px;
padding: 0 var(--padding15);
width: fit-content;
}
.tab-caption-box-content {
border-width: 1px;
margin: 0;
padding: var(--padding15);
} .label-box {
padding-top: 12.5px;
position: relative;
}
.label-box-label {
display: block;
font-size: var(--cocoon-text-size-s);
font-weight: normal;
line-height: 25px;
margin: 0 var(--padding15);
padding: 0 var(--padding15);
position: absolute;
text-shadow: none;
top: 0;
width: fit-content;
z-index: 1;
}
.label-box-label:after {
background-color: var(--content-bgcolor, #fff);
content: '';
display: block;
height: 1px;
left: 0;
position: absolute;
top: 12.5px;
width: 100%;
z-index: -1;
}
.label-box-content {
border-width: 1px;
margin: 0;
padding: var(--padding15);
} .micro-balloon {
--cocoon-custom-border-color: var(--border-color);
color: #333
}
.micro-balloon:after,
.micro-balloon:before {
margin: 0;
transform: translateX(-50%);
top: 100%;
}
.micro-bottom.micro-balloon:after,
.micro-bottom.micro-balloon:before {
bottom: 100%;
} [class*=inline-button] {
display: inline-flex;
}
[class*=inline-button-white-] {
border-width: 2px;
}  .keyboard-key {
background-color: #f7f7f7;
box-shadow: none;
color: #333;
font-size: 16px;
margin: 0 3px;
} .booklink-box,
.kaerebalink-box,
.tomarebalink-box,
.product-item-box {
border: 1px solid var(--border-color);
padding: var(--padding15);
width: unset;
} .pager-prev-next {
display: none;
}
.pager-numbers {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 5px;
margin: var(--gap30) 0;
} .wp-block-separator {
border-width: 1px;
} :not(pre) > code {
background-color: #f7f7f7;
border: 1px solid var(--border-color);
border-radius: 2px;
color: #333;
font-family: Menlo, Consolas, sans-serif;
letter-spacing: 0;
margin: 0 3px;
padding: 1px 3px;
} .wp-block-pullquote {
font-size: 16px;
padding: 0;
text-align: unset;
}
.wp-block-pullquote blockquote:before,
.wp-block-pullquote blockquote:after {
box-sizing: border-box;
height: 46px;
margin: 0;
position: absolute;
width: 46px;
}
.wp-block-pullquote blockquote {
background-color: rgb(204 204 204 / 12%);
border: 0;
}
.wp-block-pullquote blockquote:before {
background-color: unset;
border-left: 1px solid var(--main-color);
border-right: 0;
border-top: 1px solid var(--main-color);
color: var(--main-color);
}
.wp-block-pullquote blockquote:after {
border-bottom: 1px solid var(--main-color);
border-right: 1px solid var(--main-color);
bottom: 0;
content: '';
display: block;
right: 0;
}
.wp-block-pullquote cite {
color: var(--s-text-color);
display: block;
font-size: var(--cocoon-text-size-s);
text-align: right;
} .widget .wpforo-widget-wrap {
margin: 0!important;
}
.body .wpforo-widget-wrap .wpforo-widget-content {
padding: 0!important;
}
.body .wpforo-widget-wrap .wpforo-widget-content li:first-child {
padding-top: 0!important;
}
.body .wpforo-widget-wrap .wpforo-widget-content li:last-child {
border-bottom: 0;
padding-bottom: 0!important;
}
.body .wpforo-widget-wrap .wpforo-widget-content li {
padding: var(--padding15) 0!important;
} .tab-label-group {
gap: 0;
}
.tab-label-group .tab-label {
align-content: center;
background-color: transparent;
border-radius: 0;
display: block;
font-size: var(--cocoon-text-size-s);
height: 40px;
padding: 0 var(--padding15);
position: relative;
text-align: center;
width: 100%;
}
.tab-label-group .tab-label.is-active {
background-color: var(--main-color);
color: var(--text-color);
}
.tab-content-group {
border: 1px solid var(--border-color);
border-radius: 0;
padding: var(--padding15);
}
.tab-block:has(> .is-scrollable):before {
animation: leftright 1s infinite alternate ease-in-out;
content: '→';
display: block;
font-size: var(--cocoon-text-size-s);
text-align: right;
} @media (width >1023px) {
.article-footer .sns-share {
height: fit-content;
inset: 0 0 0 var(--gap30);
margin: auto 0;
position: fixed;
width: fit-content;
z-index: 1;
}
.article-footer .sns-share-message {
display: none;
}
.article-footer .sns-share .sns-buttons {
flex-direction: column;
}
.article-footer .sns-share .sns-button {
border-radius: var(--border-radius100);
box-shadow: var(--shadow-color)
}
.body:not(.front-top-page) .article:has(.ad-area, .entry-tags, .article-footer .sns-follow, .article-footer .widget) .entry-content {
border-bottom: 1px dotted var(--border-color);
margin-bottom: var(--gap30);
padding-bottom: var(--gap30);
}
}
@media (width <=1023px) {
.body .header-in {
height: 50px;
}
.logo-header img {
max-height: 50px;
}
.body:not(.front-top-page) .article:has(.entry-tags, .article-footer .sns-button, .article-footer .widget) .entry-content {
border-bottom: 1px dotted var(--border-color);
margin-bottom: var(--gap30);
padding-bottom: var(--gap30);
}
}
@media (width <=834px) {
.list-new-entries .ect-vertical-card-3 .a-wrap:nth-of-type(4),
.list-columns:not(.fpt-columns) .ect-vertical-card-3 .a-wrap:nth-of-type(4) {
display: block;
}
.navi-footer-in > .menu-footer li.menu-item {
margin: 0;
width: 100%;
}
.scrollable-table th,
.scrollable-table td {
white-space: nowrap;
}
:is(.footer-left, .footer-center, .footer-right):not(:has(.widget)) {
display: none;
}
.body .box-menus .box-menu {
width: 50%;
}
.body .box-menus .box-menu:nth-last-child(1):nth-child(odd) {
width: 100%;
}
.body .container .column-wrap {
gap: var(--gap30);
}
.article :is(ul, ol) {
padding-left: 40px;
}
}
@media (width <=480px) {
.timeline-box .timeline {
padding-left: 19px;
}
.timeline > li.timeline-item {
border-left: 3px solid #eee;
}
.timeline-item:before {
left: -10px;
}
.timeline-item-label {
padding-left: 20px;
}
.timeline-item-label:empty {
display: none;
}
.body .widget-index-middle.widget_author_box .author-box {
border: 0;
}
}