:root {
--optib-child-shadow-sm: 0 1px 2px rgb(0 0 0 / 6%);
--optib-child-shadow-md: 0 2px 8px rgb(0 0 0 / 8%);
--optib-child-shadow-lg: 0 8px 24px rgb(0 0 0 / 10%);
} .optib-child-no-sidebar .l-grid__main {
grid-column: span 12;
}
.optib-child-no-sidebar .l-grid__sidebar {
display: none;
} @media (min-width: 992px) {
body.optib-child-sidebar-left:not(.optib-child-no-sidebar) .l-grid__sidebar {
grid-column: 1 / span 3;
grid-row: 1;
}
body.optib-child-sidebar-left:not(.optib-child-no-sidebar) .l-grid__main {
grid-column: 4 / span 9;
grid-row: 1;
}
} @media (min-width: 992px) {
body:not(.optib-child-sidebar-left):not(.optib-child-no-sidebar) .l-grid__main {
grid-column: span 9;
}
body:not(.optib-child-sidebar-left):not(.optib-child-no-sidebar) .l-grid__sidebar {
grid-column: span 3;
}
} @media (min-width: 992px) { body.optib-child-sidebar-sticky-on:not(.optib-child-no-sidebar) .l-grid > .l-grid__sidebar {
align-self: start;
}
body.optib-child-sidebar-sticky-on:not(.optib-child-no-sidebar) .l-grid > .l-grid__sidebar.optib-child-sticky-ready {
position: sticky;
bottom: 0; will-change: transform;
}
} body.optib-layouts-thumb-list .p-post--list .p-post__title {
font-size: 20px;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail {
display: flex;
align-items: stretch;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__thumbnail-wrap {
flex: 0 0 37.377%;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__thumbnail {
float: none;
width: 100%;
margin: 0;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__body {
margin-left: 1.6%;
flex: 1 1 auto;
min-width: 0;
display: flex;
flex-direction: column;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__meta {
margin-top: auto;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__excerpt {
margin-bottom: auto;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__body::after {
content: "";
display: block;
height: 32px;
flex-shrink: 0;
} body.optib-layouts-thumb-list .p-post--list .p-post__thumbnail {
aspect-ratio: 16 / 9;
}
body.optib-layouts-thumb-list .p-post--list .p-post__thumbnail img {
object-fit: cover;
height: 100%;
} .widget {
padding: 16px;
} .p-webpush-manager__rule,
.p-webpush-manager__rule-label {
color: #1f2124;
} @media (max-width: 599px) {
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail {
flex-direction: column;
align-items: stretch;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__thumbnail-wrap {
flex: none;
width: 100%;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__body {
margin-left: 0;
margin-top: 16px;
}
body.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__body::after {
display: none;
}
} main .nav-links {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 8px;
clear: both;
padding: 20px 0;
font-size: 14px;
line-height: 1;
overflow: visible;
}
main .nav-links .page-numbers {
display: inline-flex;
text-decoration: none;
align-items: center;
justify-content: center;
float: none;
margin: 0;
min-width: 36px;
height: 36px;
padding: 0 12px;
border: 1px solid var(--color-border);
border-radius: 4px;
background: var(--color-bg-light);
color: var(--color-text);
box-sizing: border-box;
}
main .nav-links a.page-numbers:hover {
border-color: var(--color-primary);
color: var(--color-primary);
}
main .nav-links .page-numbers.current {
background: var(--color-primary);
color: var(--color-bg);
border-color: var(--color-primary);
font-weight: bold;
}
main .nav-links .page-numbers.next,
main .nav-links .page-numbers.prev {
padding: 0 16px;
}
main .nav-links .page-numbers.next::after {
content: "次へ ›";
}
main .nav-links .page-numbers.prev::before {
content: "‹ 前へ";
} .wew-conversation-bubble {
color: #1f2124;
} .l-grid__sidebar .widget a { color: var(--color-link) !important;
} .wp-block-icon svg {
fill: currentColor;
} .widget_media_image {
padding: 0;
} .wp-block-calendar table {
color: var(--color-text);
} @media (min-width: 992px) {
body.search .row { display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 24px;
align-items: start;
}
body.search.optib-child-sidebar-left .row > .l-grid__sidebar {
grid-column: 1 / span 3;
}
body.search.optib-child-sidebar-left .row > .col-lg-8 {
grid-column: 4 / span 9;
}
body.search:not(.optib-child-sidebar-left) .row > .col-lg-8 {
grid-column: span 9;
}
body.search:not(.optib-child-sidebar-left) .row > .l-grid__sidebar {
grid-column: span 3;
}
} body.search .container {
width: 100%;
max-width: var(--container-max-width);
padding-inline: var(--container-padding);
margin-inline: auto;
box-sizing: border-box;
}
@media (min-width: 992px) {
body.search .row {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: var(--spacing-lg);
align-items: start;
}
body.search.optib-child-sidebar-left .row > .l-grid__sidebar {
grid-column: 1 / span 3;
}
body.search.optib-child-sidebar-left .row > .col-lg-8 {
grid-column: 4 / span 9;
}
body.search:not(.optib-child-sidebar-left) .row > .col-lg-8 {
grid-column: span 9;
}
body.search:not(.optib-child-sidebar-left) .row > .l-grid__sidebar {
grid-column: span 3;
}
} .wp-block-search__button {
background-color: var(--color-primary);
color: #fff;
}
.wp-block-search__button:hover {
background-color: color-mix(in srgb, var(--color-primary) 80%, black);
color: #fff;
}  .single-post .optib-child-post-width {
width: 100%;
max-width: 798px;
margin-inline: auto;
}
.single-post .p-post__thumbnail-wrap {
max-width: calc(798px + var(--container-padding) * 2);
margin-inline: auto;
padding-inline: var(--container-padding);
box-sizing: border-box;
} .optib-child-breadcrumb-bar {
background: var(--color-bg-light, #f0f0f0);
padding-block: 10px;
margin-bottom: 24px;
color: var(--color-text-muted);
font-size: 13px;
line-height: 1.6;
}  .optib-child-breadcrumb-bar + .l-site-content {
margin-top: 0;
} .optib-child-breadcrumb-bar .optib-child-crumbs__list {
display: flex;
flex-wrap: wrap;
align-items: center;
margin: 0;
padding: 0;
list-style: none;
}
.optib-child-breadcrumb-bar .optib-child-crumbs__item {
display: flex;
align-items: center;
} .optib-child-breadcrumb-bar .optib-child-crumbs__item + .optib-child-crumbs__item::before {
content: ">";
margin: 0 0.5em;
color: var(--color-text-muted);
} .optib-child-breadcrumb-bar .optib-child-crumbs__item--home::before {
content: "";
display: inline-block;
width: 14px;
height: 14px;
margin-right: 0.4em;
flex: none;
background-color: var(--color-text-muted);
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-8 9 8'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-8 9 8'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3C/svg%3E") center / contain no-repeat;
}
.optib-child-breadcrumb-bar a {
color: var(--color-text-muted);
text-decoration: none;
}
.optib-child-breadcrumb-bar a:hover,
.optib-child-breadcrumb-bar a:focus-visible {
color: var(--color-primary);
text-decoration: underline;
} .optib-child-breadcrumb-bar .optib-child-crumbs__current {
color: var(--color-text);
font-weight: 700;
} .optib-child-breadcrumb-bar .optib-child-crumbs__yoast,
.optib-child-breadcrumb-bar .optib-child-crumbs__yoast p {
margin: 0;
}
.optib-child-breadcrumb-bar .optib-child-crumbs__yoast .breadcrumb_last {
color: var(--color-text);
font-weight: 700;
} .optib-child-headline-row {
display: flex;
align-items: stretch;
gap: var(--spacing-md);
margin-bottom: var(--spacing-md);
}
.optib-child-headline-col {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
justify-content: center;
} .optib-child-post-topline {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--spacing-sm) var(--spacing-md);
margin-bottom: var(--spacing-xs);
}
.optib-child-headline-col .p-post__title {
margin: 0;
} .optib-child-date-badge {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
line-height: 1.15;
min-width: 4.5em;
padding: 0.5em 0.75em;
border-radius: var(--radius-sm, 2px);
background: var(--color-bg-light);
border: 1px solid var(--color-border);
color: var(--color-text);
flex-shrink: 0;
}
.optib-child-date-badge__m {
font-size: 0.75rem;
color: var(--color-text-muted);
}
.optib-child-date-badge__d {
font-weight: 700;
font-size: 1.5rem;
}
.optib-child-date-badge__y {
font-size: 0.6875rem;
color: var(--color-text-muted);
} .optib-child-cat-badges {
display: flex;
flex-wrap: wrap;
gap: 0.375em;
list-style: none;
margin: 0;
padding: 0;
}
.optib-child-cat-badge {
display: inline-block;
padding: 2px 8px;
border-radius: 2px;
background: var(--color-primary);
color: #fff;
font-size: 0.75rem;
text-decoration: none;
line-height: 1.6;
}
.optib-child-cat-badge:hover {
background: color-mix(in srgb, var(--color-primary) 80%, black);
color: #fff;
}
.optib-child-post-author {
display: inline-flex;
align-items: center;
gap: 0.25em;
font-size: 0.875rem;
color: var(--color-text-muted);
}
.optib-child-post-author a {
color: inherit;
} .optib-child-single-with-sidebar .optib-child-post-width {
max-width: none;
margin-inline: 0;
}
.optib-child-single-with-sidebar .p-post__thumbnail-wrap {
max-width: none;
margin-inline: 0;
padding-inline: 0;
} #secondary .widget {
margin-bottom: var(--spacing-lg);
padding-bottom: var(--spacing-lg);
border-bottom: 1px solid var(--color-border);
}
#secondary .widget:last-child {
border-bottom: none;
}
#secondary .widget-title {
margin: 0 0 var(--spacing-md);
font-size: 1rem;
color: var(--color-text);
} .optib-child-single-with-sidebar .l-grid__sidebar {
display: block;
}
@media (min-width: 992px) {
.optib-child-single-with-sidebar .l-grid__main {
grid-column: span 8;
}
.optib-child-single-with-sidebar .l-grid__sidebar {
grid-column: span 4;
}
} .optib-child-single-with-sidebar .l-grid__center-8 {
grid-column: 1 / -1;
} .wp-lightbox-overlay .scrim {
background-color: var(--color-bg) !important;
} .optib-child-subscription-terms + .fct_price_suffix {
display: none;
}
.optib-child-subscription-terms {
line-height: 1.7;
} @media (max-width: 767.98px) { .optib-child-breadcrumb-bar {
margin-bottom: 16px;
font-size: 12px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.optib-child-breadcrumb-bar .optib-child-crumbs__list,
.optib-child-breadcrumb-bar .optib-child-crumbs__yoast {
flex-wrap: nowrap;
white-space: nowrap;
}
.optib-child-headline-row {
flex-direction: column;
align-items: stretch;
gap: var(--spacing-sm, 12px);
margin-bottom: 0;
}
.optib-child-date-badge {
flex-direction: row;
align-items: baseline;
gap: 0.3em;
align-self: flex-start;
min-width: 0;
padding: 0.3em 0.7em;
line-height: 1.2;
font-size: 0.8125rem;
}
.optib-child-date-badge__y {
order: 1;
font-size: inherit;
color: var(--color-text);
}
.optib-child-date-badge__y::after {
content: "年";
}
.optib-child-date-badge__m {
order: 2;
font-size: inherit;
color: var(--color-text);
}
.optib-child-date-badge__d {
order: 3;
font-size: inherit;
font-weight: 600;
}
.optib-child-date-badge__d::after {
content: "日";
}
.optib-child-headline-col .p-post__title {
font-size: 1.375rem;
line-height: 1.45;
}
.single-post .p-post__thumbnail-wrap {
padding-inline: 0;
}
.wp-block-optib-conversation .wew-conversation-avatar {
width: 64px;
flex-basis: 64px;
}
.wp-block-optib-conversation .wew-conversation-avatar img {
width: 48px;
height: 48px;
}
.wp-block-optib-conversation .wew-conversation-participant-name {
font-size: 0.6875rem;
}
} body.optib-child-header-sticky-off .l-header {
position: static;
}  body:is(.optib-headers-bar, .optib-header-theme) .l-header {
background-color: var(--color-primary);
border-bottom: 0;
color: #fff;
} body:is(.optib-headers-bar, .optib-header-theme) .l-header__brand-link,
body:is(.optib-headers-bar, .optib-header-theme) .l-header__phrase {
color: #fff;
} body:is(.optib-headers-bar, .optib-header-theme) .l-header__nav .c-nav__link {
color: #fff;
} body:is(.optib-headers-bar, .optib-header-theme) .l-header__nav .c-nav__link:hover,
body:is(.optib-headers-bar, .optib-header-theme) .l-header__nav .c-nav__link:focus-visible {
color: #fff;
opacity: 0.75;
} body:is(.optib-headers-bar, .optib-header-theme) .l-header__nav .c-nav__item.has-children > .c-nav__link::after {
border-top-color: #fff;
} body:is(.optib-headers-bar, .optib-header-theme) .l-header__nav .c-dropdown__menu {
background-color: #fff;
}
body:is(.optib-headers-bar, .optib-header-theme) .l-header__nav .c-dropdown__menu a {
color: var(--color-text);
opacity: 1;
}
body:is(.optib-headers-bar, .optib-header-theme) .l-header__nav .c-dropdown__menu a:hover,
body:is(.optib-headers-bar, .optib-header-theme) .l-header__nav .c-dropdown__menu a:focus-visible {
color: var(--color-primary);
opacity: 1;
} body:is(.optib-headers-bar, .optib-header-theme) .p-search__btn {
color: #fff;
}
body:is(.optib-headers-bar, .optib-header-theme) .p-search__btn:hover,
body:is(.optib-headers-bar, .optib-header-theme) .p-search__btn:focus-visible {
color: #fff;
opacity: 0.75;
} body:is(.optib-headers-bar, .optib-header-theme) .p-search__overlay {
gap: 12px;
padding: 6px 0;
background-color: var(--color-primary);
}
body:is(.optib-headers-bar, .optib-header-theme) .p-search__form {
position: relative;
flex: 1;
max-width: 640px;
margin: 0 auto;
} body:is(.optib-headers-bar, .optib-header-theme) .p-search__form::before {
content: "";
position: absolute;
top: 50%;
left: 14px;
width: 18px;
height: 18px;
transform: translateY(-50%);
background-color: #8a8a8a;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
pointer-events: none;
}
body:is(.optib-headers-bar, .optib-header-theme) .p-search__input {
height: 40px;
padding: 0 16px 0 42px;
font-size: 15px;
color: var(--color-text, #333);
background-color: #fff;
border: 0;
border-radius: 999px;
box-sizing: border-box;
}
body:is(.optib-headers-bar, .optib-header-theme) .p-search__input:focus {
outline: none;
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35);
}
body:is(.optib-headers-bar, .optib-header-theme) .p-search__input::placeholder {
color: #8a8a8a;
}
body:is(.optib-headers-bar, .optib-header-theme) .p-search__close {
color: #fff;
opacity: 0.85;
}
body:is(.optib-headers-bar, .optib-header-theme) .p-search__close:hover,
body:is(.optib-headers-bar, .optib-header-theme) .p-search__close:focus-visible {
color: #fff;
opacity: 1;
} @media (max-width: 991px) { body:is(.optib-headers-bar, .optib-header-theme) .l-header__toggle {
color: #fff;
} body:is(.optib-headers-bar, .optib-header-theme) .l-header__mobile-nav {
background-color: color-mix(in srgb, var(--color-primary) 85%, #000);
border-bottom: 0;
} body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-nav__link {
color: #fff;
border-bottom-color: rgba(255, 255, 255, 0.12);
}
body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-nav__link:hover,
body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-nav__link:focus-visible {
color: #fff;
opacity: 0.75;
}
body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-nav__item.has-children > .c-nav__link::after {
border-top-color: rgba(255, 255, 255, 0.7);
} body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-dropdown__menu {
position: static;
display: none;
margin: 0 12px 8px;
padding: 4px 0;
background-color: rgba(255, 255, 255, 0.08);
border: 0;
border-radius: 8px;
box-shadow: none;
}
body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-dropdown__menu a {
display: block;
padding: 12px 20px 12px 28px;
color: rgba(255, 255, 255, 0.9);
font-size: 14px;
font-weight: 500;
border-bottom: 0;
opacity: 1;
}
body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-dropdown__menu a:hover,
body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-dropdown__menu a:focus-visible {
color: #fff;
background-color: rgba(255, 255, 255, 0.08);
opacity: 1;
}
body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-dropdown.is-open > .c-dropdown__menu {
display: block;
} body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-dropdown.is-open > .c-nav__link .ti-angle-down,
body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-dropdown.is-open > a .ti-angle-down {
display: inline-block;
transform: rotate(180deg);
} body:is(.optib-headers-bar, .optib-header-theme) .c-nav--mobile .c-dropdown__menu .c-dropdown__menu {
margin: 0 8px 4px;
background-color: rgba(255, 255, 255, 0.06);
}
} body.optib-palettes-dark:is(.optib-headers-bar, .optib-header-theme) .l-header,
body.optib-palettes-dark:is(.optib-headers-bar, .optib-header-theme) .p-search__overlay {
background-color: #111;
}
@media (max-width: 991px) {
body.optib-palettes-dark:is(.optib-headers-bar, .optib-header-theme) .l-header__mobile-nav {
background-color: #000;
}
}.optib-layouts-card-grid:is(.home, .blog, .archive, .search) :is(.l-grid__main, .col-lg-8) {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: var(--spacing-xl);
align-items: start; align-self: start;
} @media (min-width: 768px) {
.optib-layouts-card-grid:is(.home, .blog, .archive, .search) :is(.l-grid__main, .col-lg-8) {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
} @media (min-width: 1200px) {
.optib-layouts-card-grid:is(.home, .blog, .archive, .search) :is(.l-grid__main, .col-lg-8) {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
} .optib-layouts-card-grid:is(.home, .blog, .archive, .search) :is(.l-grid__main, .col-lg-8) > * {
grid-column: 1 / -1;
}
.optib-layouts-card-grid:is(.home, .blog, .archive, .search) :is(.l-grid__main, .col-lg-8) > .p-post--card {
grid-column: auto;
} .optib-layouts-card-grid .p-post--card {
display: flex;
flex-direction: column;
height: 100%;
margin-bottom: 0;
padding-bottom: 0;
overflow: hidden;
background-color: var(--color-bg-light);
border: 1px solid var(--color-border);
border-radius: var(--radius-lg);
box-shadow: var(--optib-child-shadow-sm);
transition: box-shadow var(--transition-base), transform var(--transition-base);
}
.optib-layouts-card-grid .p-post--card:hover {
box-shadow: var(--optib-child-shadow-lg);
transform: translateY(-2px);
}
.optib-layouts-card-grid .p-post--card .p-post__thumbnail {
margin-bottom: 0;
border-radius: 0;
aspect-ratio: 16 / 9;
}
.optib-layouts-card-grid .p-post--card .p-post__thumbnail img {
width: 100%;
height: 100%;
object-fit: cover;
}
.optib-layouts-card-grid .p-post--card .p-post__body {
display: flex;
flex: 1;
flex-direction: column;
gap: var(--spacing-sm);
padding: var(--spacing-lg);
}
.optib-layouts-card-grid .p-post--card .p-post__title {
margin: 0;
font-size: var(--font-size-xl);
}
.optib-layouts-card-grid .p-post--card .p-post__excerpt {
margin-bottom: 0;
font-size: var(--font-size-sm);
color: var(--color-text-muted);
} .optib-layouts-card-grid .p-post--card .p-post__meta {
margin-top: auto;
padding-top: var(--spacing-sm);
font-size: var(--font-size-xs);
border-top: 1px solid var(--color-border);
} .optib-layout-masonry.optib-child-masonry-ready:is(.home, .blog, .archive, .search) :is(.l-grid__main, .col-lg-8) {
grid-auto-rows: 8px; align-items: start;
} .optib-layout-masonry.optib-child-masonry-ready:is(.home, .blog, .archive, .search) :is(.l-grid__main, .col-lg-8) > .p-post--card {
height: auto;
}.optib-skins-card-grid-light .p-post--card {
background-color: #fff;
border: 1px solid #d0d7de;
border-radius: 1rem;
} .optib-skins-card-grid-light .p-post--card .p-post__meta {
border-top: 1px solid #d0d7de;
} .optib-skins-card-grid-light .p-post--card .p-post__excerpt {
color: #6e7781;
}body.optib-preset-blog {
--optib-shadow-sm: 0 1px 2px rgb(0 0 0 / 6%);
--optib-shadow-md: 0 2px 8px rgb(0 0 0 / 8%);
--optib-shadow-lg: 0 8px 24px rgb(0 0 0 / 10%);
} body.optib-preset-blog.optib-no-sidebar .l-grid__main {
grid-column: span 12;
}
body.optib-preset-blog.optib-no-sidebar .l-grid__sidebar {
display: none;
} @media (min-width: 992px) {
body.optib-sidebar-left:not(.optib-no-sidebar) .l-grid__sidebar {
grid-column: 1 / span 3;
grid-row: 1;
}
body.optib-sidebar-left:not(.optib-no-sidebar) .l-grid__main {
grid-column: 4 / span 9;
grid-row: 1;
}
} @media (min-width: 992px) {
body.optib-sidebar-right:not(.optib-no-sidebar) .l-grid__main {
grid-column: span 9;
}
body.optib-sidebar-right:not(.optib-no-sidebar) .l-grid__sidebar {
grid-column: span 3;
}
} @media (min-width: 992px) { body.optib-sidebar-sticky-on:not(.optib-no-sidebar) .l-grid > .l-grid__sidebar {
align-self: start;
}
body.optib-sidebar-sticky-on:not(.optib-no-sidebar) .l-grid > .l-grid__sidebar.optib-sticky-ready {
position: sticky;
bottom: 0; will-change: transform;
}
} body.optib-preset-blog .widget {
padding: 16px;
} @media (min-width: 992px) {
body.optib-preset-blog.search.optib-sidebar-left .row > .l-grid__sidebar {
grid-column: 1 / span 3;
}
body.optib-preset-blog.search.optib-sidebar-left .row > .col-lg-8 {
grid-column: 4 / span 9;
} body.optib-preset-blog.search.optib-sidebar-right .row > .col-lg-8 {
grid-column: span 9;
}
body.optib-preset-blog.search.optib-sidebar-right .row > .l-grid__sidebar {
grid-column: span 3;
}
}  body.optib-preset-blog.single-post .optib-post-width {
width: 100%;
max-width: 798px;
margin-inline: auto;
}
body.optib-preset-blog.single-post .p-post__thumbnail-wrap {
max-width: calc(798px + var(--container-padding) * 2);
margin-inline: auto;
padding-inline: var(--container-padding);
box-sizing: border-box;
}   .optib-breadcrumb-bar + .l-site-content {
margin-top: 0;
} .optib-headline-row {
display: flex;
align-items: stretch;
gap: var(--spacing-md);
margin-bottom: var(--spacing-md);
}
.optib-headline-col {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
justify-content: center;
} .optib-post-topline {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--spacing-sm) var(--spacing-md);
margin-bottom: var(--spacing-xs);
}
.optib-headline-col .p-post__title {
margin: 0;
} .optib-date-badge {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
line-height: 1.15;
min-width: 4.5em;
padding: 0.5em 0.75em;
border-radius: var(--radius-sm, 2px);
background: var(--color-bg-light);
border: 1px solid var(--color-border);
color: var(--color-text);
flex-shrink: 0;
}
.optib-date-badge__m {
font-size: 0.75rem;
color: var(--color-text-muted);
}
.optib-date-badge__d {
font-weight: 700;
font-size: 1.5rem;
}
.optib-date-badge__y {
font-size: 0.6875rem;
color: var(--color-text-muted);
} .optib-cat-badges {
display: flex;
flex-wrap: wrap;
gap: 0.375em;
list-style: none;
margin: 0;
padding: 0;
}
.optib-cat-badge {
display: inline-block;
padding: 2px 8px;
border-radius: 2px;
background: var(--color-primary);
color: #fff;
font-size: 0.75rem;
text-decoration: none;
line-height: 1.6;
}
.optib-cat-badge:hover {
background: color-mix(in srgb, var(--color-primary) 80%, black);
color: #fff;
}
.optib-post-author {
display: inline-flex;
align-items: center;
gap: 0.25em;
font-size: 0.875rem;
color: var(--color-text-muted);
}
.optib-post-author a {
color: inherit;
} body.optib-preset-blog .optib-single-with-sidebar .optib-post-width {
max-width: none;
margin-inline: 0;
}
body.optib-preset-blog .optib-single-with-sidebar .p-post__thumbnail-wrap {
max-width: none;
margin-inline: 0;
padding-inline: 0;
} body.optib-preset-blog #secondary .widget {
margin-bottom: var(--spacing-lg);
padding-bottom: var(--spacing-lg);
border-bottom: 1px solid var(--color-border);
}
body.optib-preset-blog #secondary .widget:last-child {
border-bottom: none;
}
body.optib-preset-blog #secondary .widget-title {
margin: 0 0 var(--spacing-md);
font-size: 1rem;
color: var(--color-text);
} @media (max-width: 767.98px) {
.optib-headline-row {
flex-direction: column;
align-items: stretch;
gap: var(--spacing-sm, 12px);
margin-bottom: 0;
}
.optib-date-badge {
flex-direction: row;
align-items: baseline;
gap: 0.3em;
align-self: flex-start;
min-width: 0;
padding: 0.3em 0.7em;
line-height: 1.2;
font-size: 0.8125rem;
}
.optib-date-badge__y {
order: 1;
font-size: inherit;
color: var(--color-text);
}
.optib-date-badge__y::after {
content: "年";
}
.optib-date-badge__m {
order: 2;
font-size: inherit;
color: var(--color-text);
}
.optib-date-badge__d {
order: 3;
font-size: inherit;
font-weight: 600;
}
.optib-date-badge__d::after {
content: "日";
}
.optib-headline-col .p-post__title {
font-size: 1.375rem;
line-height: 1.45;
}
body.optib-preset-blog.single-post .p-post__thumbnail-wrap {
padding-inline: 0;
}
.wp-block-optib-conversation .wew-conversation-avatar {
width: 64px;
flex-basis: 64px;
}
.wp-block-optib-conversation .wew-conversation-avatar img {
width: 48px;
height: 48px;
}
.wp-block-optib-conversation .wew-conversation-participant-name {
font-size: 0.6875rem;
}
} body.optib-header-sticky-off .l-header {
position: static;
}  body.optib-headers-bar .l-header {
background-color: var(--color-primary);
border-bottom: 0;
color: #fff;
} body.optib-headers-bar .l-header__brand-link,
body.optib-headers-bar .l-header__phrase {
color: #fff;
} body.optib-headers-bar .l-header__nav .c-nav__link {
color: #fff;
} body.optib-headers-bar .l-header__nav .c-nav__link:hover,
body.optib-headers-bar .l-header__nav .c-nav__link:focus-visible {
color: #fff;
opacity: 0.75;
} body.optib-headers-bar .l-header__nav .c-nav__item.has-children > .c-nav__link::after {
border-top-color: #fff;
} body.optib-headers-bar .l-header__nav .c-dropdown__menu {
background-color: #fff;
}
body.optib-headers-bar .l-header__nav .c-dropdown__menu a {
color: var(--color-text);
opacity: 1;
}
body.optib-headers-bar .l-header__nav .c-dropdown__menu a:hover,
body.optib-headers-bar .l-header__nav .c-dropdown__menu a:focus-visible {
color: var(--color-primary);
opacity: 1;
} body.optib-headers-bar .p-search__btn {
color: #fff;
}
body.optib-headers-bar .p-search__btn:hover,
body.optib-headers-bar .p-search__btn:focus-visible {
color: #fff;
opacity: 0.75;
} body.optib-headers-bar .p-search__overlay {
gap: 12px;
padding: 6px 0;
background-color: var(--color-primary);
}
body.optib-headers-bar .p-search__form {
position: relative;
flex: 1;
max-width: 640px;
margin: 0 auto;
} body.optib-headers-bar .p-search__form::before {
content: "";
position: absolute;
top: 50%;
left: 14px;
width: 18px;
height: 18px;
transform: translateY(-50%);
background-color: #8a8a8a;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
pointer-events: none;
}
body.optib-headers-bar .p-search__input {
height: 40px;
padding: 0 16px 0 42px;
font-size: 15px;
color: var(--color-text, #333);
background-color: #fff;
border: 0;
border-radius: 999px;
box-sizing: border-box;
}
body.optib-headers-bar .p-search__input:focus {
outline: none;
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35);
}
body.optib-headers-bar .p-search__input::placeholder {
color: #8a8a8a;
}
body.optib-headers-bar .p-search__close {
color: #fff;
opacity: 0.85;
}
body.optib-headers-bar .p-search__close:hover,
body.optib-headers-bar .p-search__close:focus-visible {
color: #fff;
opacity: 1;
} @media (max-width: 991px) { body.optib-headers-bar .l-header__toggle {
color: #fff;
} body.optib-headers-bar .l-header__mobile-nav {
background-color: color-mix(in srgb, var(--color-primary) 85%, #000);
border-bottom: 0;
} body.optib-headers-bar .c-nav--mobile .c-nav__link {
color: #fff;
border-bottom-color: rgba(255, 255, 255, 0.12);
}
body.optib-headers-bar .c-nav--mobile .c-nav__link:hover,
body.optib-headers-bar .c-nav--mobile .c-nav__link:focus-visible {
color: #fff;
opacity: 0.75;
}
body.optib-headers-bar .c-nav--mobile .c-nav__item.has-children > .c-nav__link::after {
border-top-color: rgba(255, 255, 255, 0.7);
} body.optib-headers-bar .c-nav--mobile .c-dropdown__menu {
position: static;
display: none;
margin: 0 12px 8px;
padding: 4px 0;
background-color: rgba(255, 255, 255, 0.08);
border: 0;
border-radius: 8px;
box-shadow: none;
}
body.optib-headers-bar .c-nav--mobile .c-dropdown__menu a {
display: block;
padding: 12px 20px 12px 28px;
color: rgba(255, 255, 255, 0.9);
font-size: 14px;
font-weight: 500;
border-bottom: 0;
opacity: 1;
}
body.optib-headers-bar .c-nav--mobile .c-dropdown__menu a:hover,
body.optib-headers-bar .c-nav--mobile .c-dropdown__menu a:focus-visible {
color: #fff;
background-color: rgba(255, 255, 255, 0.08);
opacity: 1;
}
body.optib-headers-bar .c-nav--mobile .c-dropdown.is-open > .c-dropdown__menu {
display: block;
} body.optib-headers-bar .c-nav--mobile .c-dropdown.is-open > .c-nav__link .ti-angle-down,
body.optib-headers-bar .c-nav--mobile .c-dropdown.is-open > a .ti-angle-down {
display: inline-block;
transform: rotate(180deg);
} body.optib-headers-bar .c-nav--mobile .c-dropdown__menu .c-dropdown__menu {
margin: 0 8px 4px;
background-color: rgba(255, 255, 255, 0.06);
}
} body.optib-palettes-dark .l-header,
body.optib-palettes-dark .p-search__overlay {
background-color: #111;
}
@media (max-width: 991px) {
body.optib-palettes-dark .l-header__mobile-nav {
background-color: #000;
}
}.optib-layouts-thumb-list .p-post--list {
display: block;
position: relative;
overflow: hidden;
gap: 0;
margin-bottom: 0;
padding: 16px;
font-size: 13px;
} .optib-layouts-thumb-list .p-post--list .p-post__thumbnail {
float: left;
margin: 0 1.6% 0 0;
width: 37.377%;
border-radius: 0;
}
.optib-layouts-thumb-list .p-post--list .p-post__thumbnail img {
display: block;
width: 100%;
height: auto;
object-fit: fill;
} .optib-layouts-thumb-list .p-post--list .p-post__body {
display: block;
}
.optib-layouts-thumb-list .p-post--list.has-post-thumbnail .p-post__body {
margin-left: 37.377%;
}
.optib-layouts-thumb-list .p-post--list .p-post__title {
margin: 0 0 8px;
font-size: 16px;
} .optib-layouts-thumb-list .p-post--list .p-post__meta-item--date {
display: inline-block;
padding: 2px 8px;
vertical-align: middle;
text-align: center;
} .optib-layouts-thumb-list .p-post--list .p-post__meta-item--cat a {
display: inline-block;
margin-bottom: 4px;
padding: 2px 8px;
border: 0;
border-radius: 2px;
text-align: center;
} .optib-layouts-thumb-list .p-post--list .p-post__meta-item--author i {
margin-right: .3em;
} .optib-layouts-thumb-list .p-post--list .p-post__meta-item--author a {
border-bottom: 0;
} .optib-layouts-thumb-list .p-post--list .p-post__meta {
display: flow-root;
gap: 0;
margin: 0;
padding: 0;
list-style: none;
font-size: 12px;
}
.optib-layouts-thumb-list .p-post--list .p-post__meta-item {
display: inline-block;
float: left;
margin: 0 8px 8px 0;
list-style-type: none;
} .optib-layouts-thumb-list .p-post--list .p-post__excerpt {
display: block;
margin-bottom: 32px;
} .optib-layouts-thumb-list .p-post--list .c-btn--outline-primary {
display: inline-block;
padding: 2px 8px;
border-radius: 2px;
font-size: 12px;
font-weight: normal;
line-height: 1.4;
text-align: center;
} .optib-layouts-thumb-list main .page-title {
font-size: 24px;
line-height: 54px;
}
.optib-layouts-thumb-list main .taxonomy-description {
padding: 0 16px;
font-size: 14px;
} .optib-layouts-thumb-list .p-post--list .p-post__title a::after {
position: absolute;
z-index: 0;
inset: 0;
content: "";
} .optib-layouts-thumb-list .p-post--list .p-post__thumbnail a,
.optib-layouts-thumb-list .p-post--list .p-post__excerpt a,
.optib-layouts-thumb-list .p-post--list .p-post__meta-item--cat a,
.optib-layouts-thumb-list .p-post--list .p-post__meta-item--author a,
.optib-layouts-thumb-list .p-post--list .p-post__more {
position: relative;
z-index: 1;
} .optib-layouts-thumb-list .p-post--list {
isolation: isolate;
} .optib-layouts-thumb-list .p-post--list .p-post__more {
display: none;
position: absolute;
right: -100px;
bottom: 8px;
transition: all 0.3s;
}
@media screen and (min-width: 480px) and (hover: hover) {
.optib-layouts-thumb-list .p-post--list .p-post__more {
display: inline-block;
}
.optib-layouts-thumb-list .p-post--list:hover .p-post__more {
right: 0;
}
.optib-layouts-thumb-list .p-post--list .p-post__more:focus,
.optib-layouts-thumb-list .p-post--list:has(.p-post__title a:focus-visible) .p-post__more {
right: 6px;
}
}.optib-skins-thumb-list-light .p-post--list:hover {
background: #eee;
} .optib-skins-thumb-list-light .p-post--list {
border-bottom: dotted 1px #c3c3c3;
} .optib-skins-thumb-list-light .p-post--list .p-post__meta-item--date {
border-left: solid 3px #c3c3c3;
background: #eee;
} .optib-skins-thumb-list-light .p-post--list .p-post__meta-item--cat a {
background: var(--color-primary);
color: #fff;
} .optib-skins-thumb-list-light .p-post--list .p-post__meta-item--cat a:hover {
background: color-mix(in srgb, var(--color-primary) 80%, black);
color: #fff;
} .optib-skins-thumb-list-light .p-post--list .c-btn--outline-primary {
border: solid 1px var(--color-primary);
background-color: transparent;
color: var(--color-primary);
}
.optib-skins-thumb-list-light .p-post--list:hover .c-btn--outline-primary,
.optib-skins-thumb-list-light .p-post--list .c-btn--outline-primary:hover {
background-color: var(--color-primary);
color: #fff;
font-weight: bold;
} .optib-skins-thumb-list-light .p-post--list:has(.p-post__title a:focus-visible),
.optib-skins-thumb-list-light .p-post--list:has(.p-post__more:focus-visible) {
background: #eee;
} .optib-skins-thumb-list-light .p-post--list:has(.p-post__title a:focus-visible) .c-btn--outline-primary,
.optib-skins-thumb-list-light .p-post--list:has(.p-post__more:focus-visible) .c-btn--outline-primary {
background-color: var(--color-primary);
color: #fff;
font-weight: bold;
}.optib-breadcrumb-bar {
background: var(--color-bg-light, #f0f0f0);
padding-block: 10px;
margin-bottom: 24px;
color: var(--color-text-muted);
font-size: 13px;
line-height: 1.6;
} .optib-breadcrumb-bar .optib-crumbs__list {
display: flex;
flex-wrap: wrap;
align-items: center;
margin: 0;
padding: 0;
list-style: none;
}
.optib-breadcrumb-bar .optib-crumbs__item {
display: flex;
align-items: center;
} .optib-breadcrumb-bar .optib-crumbs__item + .optib-crumbs__item::before {
content: ">";
margin: 0 0.5em;
color: var(--color-text-muted);
} .optib-breadcrumb-bar .optib-crumbs__item--home::before {
content: "";
display: inline-block;
width: 14px;
height: 14px;
margin-right: 0.4em;
flex: none;
background-color: var(--color-text-muted);
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-8 9 8'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-8 9 8'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3C/svg%3E") center / contain no-repeat;
}
.optib-breadcrumb-bar a {
color: var(--color-text-muted);
text-decoration: none;
}
.optib-breadcrumb-bar a:hover,
.optib-breadcrumb-bar a:focus-visible {
color: var(--color-primary);
text-decoration: underline;
} .optib-breadcrumb-bar .optib-crumbs__current {
color: var(--color-text);
font-weight: 700;
} .optib-breadcrumb-bar .optib-crumbs__yoast,
.optib-breadcrumb-bar .optib-crumbs__yoast p {
margin: 0;
}
.optib-breadcrumb-bar .optib-crumbs__yoast .breadcrumb_last {
color: var(--color-text);
font-weight: 700;
} @media (max-width: 767.98px) {
.optib-breadcrumb-bar {
margin-bottom: 16px;
font-size: 12px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.optib-breadcrumb-bar .optib-crumbs__list,
.optib-breadcrumb-bar .optib-crumbs__yoast {
flex-wrap: nowrap;
white-space: nowrap;
}
}