@font-face {
	font-family: "myfont";
	src: url('../../assets/fonts/myfont.eot');
	src: url('../../assets/fonts/myfont.eot?#iefix') format('eot'),
		url('../../assets/fonts/myfont.woff') format('woff'),
		url('../../assets/fonts/myfont.ttf') format('truetype'),
		url('../../assets/fonts/myfont.svg#myfont') format('svg');
	font-weight: normal;
	font-style: normal;
}
.myfont {
	display: inline-block;
	font-family: "myfont";
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.myfont-lg {
	font-size: 1.3333333333333333em;
	line-height: 0.75em;
	vertical-align: -15%;
}
.myfont-2x { font-size: 2em; }
.myfont-3x { font-size: 3em; }
.myfont-4x { font-size: 4em; }
.myfont-5x { font-size: 5em; }
.myfont-fw {
	width: 1.2857142857142858em;
	text-align: center;
}
.myfont-human:before { content: "\EA01" }
.myfont-arrow-right:before { content: "\EA02" }

@layer {
  .icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
  }

  .icon.icon-arrow-left {
    mask-image: url('/assets/icons/arrow-left.svg');
    -webkit-mask-image: url('/assets/icons/arrow-left.svg');
  }

  .icon.icon-arrow-right {
    mask-image: url('/assets/icons/arrow-right.svg');
    -webkit-mask-image: url('/assets/icons/arrow-right.svg');
  }

  .icon.icon-arrow-up {
    mask-image: url('/assets/icons/arrow-up.svg');
    -webkit-mask-image: url('/assets/icons/arrow-up.svg');
  }

  .icon.icon-cat-column {
    mask-image: url('/assets/icons/cat-column.svg');
    -webkit-mask-image: url('/assets/icons/cat-column.svg');
  }

  .icon.icon-cat-culture {
    mask-image: url('/assets/icons/cat-culture.svg');
    -webkit-mask-image: url('/assets/icons/cat-culture.svg');
  }

  .icon.icon-cat-gourmet {
    mask-image: url('/assets/icons/cat-gourmet.svg');
    -webkit-mask-image: url('/assets/icons/cat-gourmet.svg');
  }

  .icon.icon-cat-life {
    mask-image: url('/assets/icons/cat-life.svg');
    -webkit-mask-image: url('/assets/icons/cat-life.svg');
  }

  .icon.icon-cat-odekake {
    mask-image: url('/assets/icons/cat-odekake.svg');
    -webkit-mask-image: url('/assets/icons/cat-odekake.svg');
  }

  .icon.icon-share-nodes {
    mask-image: url('/assets/icons/share-nodes.svg');
    -webkit-mask-image: url('/assets/icons/share-nodes.svg');
  }
}
:root {
  --swl-font_family: "Public Sans", "Noto Sans JP", sans-serif;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.icon-modified,
.icon-posted,
.c-categoryList,
.p-postList__cat,
.c-tagList {
  &:before {
    display: none;
  }
}

.c-shareBtns__message .__text {
  padding: 0;
  &:before,
  &:after {
    display: none;
  }
}

.p-postList__thumb {
  box-shadow: none;
}

.-type-card {
  .p-postList__body {
    padding-top: 0.75em;
    line-height: 1;

    * + * {
      margin-top: 0.25em;
    }
  }

  &.p-postList {
    margin-inline: 0;
    .p-postList__item {
      padding-inline: 0;
    }
  }

  &.-pc-col3 {
    @media (width >= 1020px) {
      margin-inline: 0;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: calc(var(--spacing) * 10);

      .p-postList__item {
        margin: 0;
        min-width: 100%;
      }
    }
  }

  &.-sp-col1 {
    .p-postList__item {
      @media (width < 600px) {
        margin-bottom: calc(var(--spacing) * 6);
      }
    }
  }
}

.p-postSlider {
  .p-postList__meta {
    margin-bottom: calc(var(--spacing) * 2);
  }
}

.-type-list {
  .p-postList__item:last-child {
    margin-bottom: 0;
  }

  &.-pc-col1 {
    @media (width >= 1020px) {
      display: grid;
      grid-template-columns: repeat(1, minmax(0, 1fr));
      gap: 0.75em 0;
    }
  }

  &.-pc-col2 {
    display: grid;
    @media (width >= 1020px) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: calc(var(--spacing) * 6) calc(var(--spacing) * 10);
    }
  }

  &.-sp-col1 {
    @media (width < 1020px) {
      display: grid;
      gap: calc(var(--spacing) * 4) 0;

      .p-postList__item {
        margin-bottom: 0;
      }
    }
  }

  @media (width >= 1020px) {
    .p-postList__item {
      margin-bottom: 0;
    }

    .p-postList__link {
      justify-content: flex-start;
      gap: 0 calc(var(--spacing) * 6);
    }

    .p-postList__thumb {
      width: calc(var(--spacing) * 40);
    }

    .p-postList__body {
      flex-grow: 1;
    }
  }

  &.-w-ranking {
    .c-widget & .p-postList__item {
      margin-bottom: calc(var(--spacing) * 3);

      &::before {
        left: 0;
        top: 0;
        background: var(--theme-brand-main);
        border-top-left-radius: 4px;
        border-bottom-left-radius: 0px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 4px;
      }
    }
    #sidebar & {
      .p-postList__link {
        justify-content: flex-start;
        gap: 0 calc(var(--spacing) * 3);
      }
      .p-postList__thumb {
        width: 80px;

        @media (width >= 920px) {
          border-radius: 4px;
        }
      }

      .c-postThumb__figure {
        &::before {
          --list_posts_thumb_ratio: 100%;
        }
      }

      .p-postList__title {
        font-size: 12px;
      }
    }
  }
}

.-type-card.-sp-col1 .p-postList__title {
  @media (width < 600px) {
    font-size: 12px;
  }
}

.-type-list,
.-type-card {
  .p-postList__title {
    font-size: 12px;

    @media (width >= 920px) {
      font-size: 16px;
    }
  }
}

.c-prNotation {
  color: var(--theme-gray-400);
  border: 1px solid;
  border-radius: 16px;
  padding: 0 8px;
  font-size: 12px;
  letter-spacing: 0.05em;
  line-height: 1.5;

  @media (width >= 920px) {
    line-height: 2;
  }
}

.w-fixSide {
  top: calc(8px + var(--swl-adminbarH, 0px) + var(--swl-headerH, 0px));
}

.l-container {
  @media (width < 1020px) {
    --swl-pad_container: clamp(calc(var(--spacing) * 6), 4vw, calc(var(--spacing) * 12));
  }
}

.c-shareBtns__btn {
  border-radius: 9999px;
  width: calc(var(--spacing) * 10);
  aspect-ratio: 1 / 1;
  padding: 0;
}

#wpadminbar {
  html:has(#search_modal.is-opened) & {
    z-index: 1;
  }
}

.c-postTitle__ttl {
  @media (width >= 960px) {
    font-size: 28px;
  }
}

.p-articleMetas {
  justify-content: flex-end;
  margin-bottom: calc(var(--spacing) * 1);

  &.-bottom {
    justify-content: flex-start;
  }
}

.p-postList__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: calc(var(--spacing) * 2);
}

.p-articleFoot {
  margin-bottom: 0;
}

.c-fixBtn {
  opacity: 1;
  border: none;
  border-radius: var(--radius-full);
  width: 72px;
  height: 72px;
  background-color: transparent;
}

.p-toc {
  &.-border {
    border-color: var(--theme-gray-300);
    border-block-width: 1px;
    padding: calc(var(--spacing) * 5);

    #main_content & {
      width: 100%;
      max-width: 100%;
    }

    .p-toc__ttl {
      font-weight: 700;
      font-size: 18px;
      line-height: 1.5;
      text-align: left;
      margin-bottom: calc(var(--spacing) * 1);

      &::before {
        display: none;
      }
    }

    ul.is-style-index li {
      --is-style-index-left-space: calc(var(--spacing) * 4.5);
      --is-style-index-dot-size: 6px;
      margin-block: 0;
      padding-left: var(--is-style-index-left-space);
      font-size: 14px;
      line-height: 2;

      &::before {
        top: calc(0.5lh - var(--is-style-index-dot-size) / 2);
        left: calc(var(--is-style-index-left-space) / 2 - var(--is-style-index-dot-size) / 2);
        width: var(--is-style-index-dot-size);
        height: var(--is-style-index-dot-size);
        border-radius: var(--radius-full);
        background: var(--theme-color-black);
      }

      .p-toc__link {
        font-size: 14px;
        text-decoration: underline;
        line-height: 2;
        text-underline-offset: 2px;
      }
    }
  }
}

.post_content {
  --swl-pad_post_content: 0;
  --swl-h2-margin--x: 0;

  .sr-only + & {
    margin-top: 0;
  }

  & > * {
    margin-block: calc(var(--spacing) * 10);
  }

  & > :is(h2, h3, h4) {
    margin-top: calc(var(--spacing) * 10);
    margin-bottom: calc(var(--spacing) * 3);
  }

  & > :is(h3, h4) + * {
    margin-top: calc(var(--spacing) * 3);
  }

  & > :is(h2, figure) {
    + * {
      margin-block: calc(var(--spacing) * 6);
    }
  }

  & > h2 {
    position: relative;
    padding-top: calc(var(--spacing) * 3);
    font-size: 1.5em;

    &::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: calc(var(--spacing) * 20);
      height: 4px;
      background: var(--theme-brand-main);
    }
  }

  & > h3 {
    font-size: 1.25em;
  }

  & > h4 {
    --color_htag: var(--theme-color-black);
    margin-right: calc(var(--spacing) * 1);
    font-size: 1em;
  }
}

.c-widget {
  .w-singleBottom & {
    &:has(.c-hr:only-child) {
      margin-top: var(--top-common-container-gap);
    }
  }
}

#after_article.l-articleBottom {
  border-block: 4px solid var(--theme-color-black);
  padding-block: calc(var(--spacing) * 10);
}

.l-articleBottom__section.-author {
  margin-block: 0;
}

.l-articleBottom__title {
  border: none;
  padding: 0;
  margin-bottom: calc(var(--spacing) * 6);
}

.p-authorBox {
  border: none;
  border-bottom: 1px solid var(--theme-gray-200);
  padding: 0;
  padding-bottom: calc(var(--spacing) * 10);

  @media (width >= 600px) {
    align-items: center;
  }
}

.p-authorBox__r {
  @media (width >= 600px) {
    border: none;
    padding-left: 0;
  }
}

.p-authorBox__name {
  font-size: 16px;
  text-align: left;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: calc(var(--spacing) * 2);

  @media (width >= 920px) {
    font-size: 18px;
  }
}

.p-articleFoot {
  margin-top: calc(var(--spacing) * 6);
  border: none;
  padding: 0;
}

.p-authorBox__desc {
  text-align: left;
}

.single .p-breadcrumb__item:last-child > span.p-breadcrumb__text {
  display: inline;
}

.c-shareBtns__message {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--spacing) * 1);
  font-size: 12px;
  line-height: 1.5;

  .icon {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
  }
}

.top {
  #content {
    padding-top: var(--top-common-container-gap);
  }
}

.l-footer {
  margin-top: calc(var(--spacing) * 16);

  @media (width >= 920px) {
    margin-top: calc(var(--spacing) * 32);
  }
}

.l-footer__contents {
  display: grid;
  gap: calc(var(--spacing) * 10) calc(var(--spacing) * 6);
}

.l-footer__contentsWrap {
  @media (width >= 920px) {
    grid-template-columns: repeat(2, auto);
    grid-template-rows: minmax(0, 1fr) auto;

    .copyright {
      grid-column: 1 / -1;
      grid-row: 2 / 3;
    }
  }
}

.l-footer__logoList {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(var(--spacing) * 3);

  @media (width >= 920px) {
    grid-template-columns: repeat(3, minmax(calc(var(--spacing) * 32), 1fr));
  }

  @media (width >= 1200px) {
    grid-template-columns: repeat(5, minmax(calc(var(--spacing) * 32), 1fr));
  }
}

.l-footer__logo {
  border-radius: 9999px;
  background: white;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-block: calc(var(--spacing) * 3);
}

.l-footer__sns {
  display: grid;
  gap: calc(var(--spacing) * 2);
  justify-content: start;

  .c-iconList {
    font-size: 24px;
  }

  @media (width >= 920px) {
    justify-content: flex-end;
  }
}

.l-footer__snsTerm {
  font-size: 12px;
  text-align: center;
}

.l-footer__foot {
  padding-block: calc(var(--spacing) * 10);

  @media (width >= 920px) {
    padding-block: calc(var(--spacing) * 16);
  }

  .c-iconList {
    justify-content: flex-start;
  }
}

.l-footer__navWrap {
  display: grid;
  align-content: start;
  gap: calc(var(--spacing) * 6);

  @media (width >= 920px) {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
  }
}

.l-footer__logoMain {
  margin-inline: auto;

  @media (width >= 920px) {
    margin-inline: 0;
  }
}

.l-footer__navList {
  display: grid;
  gap: calc(var(--spacing) * 2);
}

.l-footer__nav {
  padding: 0;
  gap: 0 calc(var(--spacing) * 2);

  @media (width >= 920px) {
    justify-content: flex-start;
  }

  a {
    padding: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;

    @media (width >=600px) {
      border-width: 0;
    }
  }

  li {
    &:first-child {
      a {
        border-width: 0;
      }
    }
  }

  &:nth-of-type(2) {
    gap: 0 calc(var(--spacing) * 4);
  }

  &:nth-of-type(2) {
    a {
      font-size: 12px;
    }
  }

  &:nth-of-type(3) {
    @media (width >= 920px) {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    a {
      font-size: 10px;
      font-weight: 400;
    }
  }
}

.l-footer__banner {
  margin-top: var(--top-common-container-gap);
}

.footer-info-dialog {
  border: none;
  margin: 0;
  background: transparent;
  position: absolute;
  transform: translateX(-100%);
  height: 100%;
  align-items: center;

  &:open {
    display: flex;
  }
}

.footer-info-dialog__inner {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 128px;
  height: 32px;
}

.footer-info-button {
  position: relative;
  transition: opacity 0.3s ease;

  @media (width < 900px) {
    display: none;
  }

  &::after {
    content: "";
    position: absolute;
    inset: 0;
    background: transparent;
    border-radius: var(--radius-full);
    transition: background 0.3s ease;
  }

  &:hover,
  &:focus {
    &::after {
      background: rgba(255, 255, 255, 0.15);
    }
  }
}

.l-header {
  position: sticky;
  top: var(--swl-adminbarH, 0);
}

.l-header__otherNav {
  --logo_size_sp: 24px;

  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 1;

  @media (width >= 960px) {
    justify-content: flex-end;
    gap: calc(var(--spacing) * 5);
  }
}

.l-header__btns {
  display: flex;
  align-items: center;
  gap: calc(var(--spacing) * 2.5);

  @media (width >= 960px) {
    gap: calc(var(--spacing) * 5);
  }
}

.l-header__gnav {
  flex: 1;
}

.c-listMenu {
  a {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    font-size: 16px;
    line-height: 1.5;
    font-weight: bold;
    padding: calc(var(--spacing) * 3) calc(var(--spacing) * 2);

    &:hover {
      padding: calc(var(--spacing) * 3) calc(var(--spacing) * 2);
    }

    @media (width >= 960px) {
      font-size: 20px;
      padding: calc(var(--spacing) * 6) calc(var(--spacing) * 2);

      &:hover {
        padding: calc(var(--spacing) * 6) calc(var(--spacing) * 2);
      }
    }

    &:before {
      display: none;
    }

    .icon {
      &:last-child {
        margin-left: auto;
      }
      &:not(:last-child) {
        .menu-item:nth-child(1) & {
          color: var(--theme-cat-gourmet);
          mask-image: url("/assets/icons/cat-gourmet.svg");
          -webkit-mask-image: url("/assets/icons/cat-gourmet.svg");
        }

        .menu-item:nth-child(2) & {
          color: var(--theme-cat-odekake);
          mask-image: url("/assets/icons/cat-odekake.svg");
          -webkit-mask-image: url("/assets/icons/cat-odekake.svg");
        }

        .menu-item:nth-child(3) & {
          color: var(--theme-cat-life);
          mask-image: url("/assets/icons/cat-life.svg");
          -webkit-mask-image: url("/assets/icons/cat-life.svg");
        }

        .menu-item:nth-child(4) & {
          color: var(--theme-cat-culture);
          mask-image: url("/assets/icons/cat-culture.svg");
          -webkit-mask-image: url("/assets/icons/cat-culture.svg");
        }

        .menu-item:nth-child(5) & {
          color: var(--theme-cat-column);
          mask-image: url("/assets/icons/cat-column.svg");
          -webkit-mask-image: url("/assets/icons/cat-column.svg");
        }
      }
    }
  }
}

.l-header__date {
  flex-shrink: 0;
  font-size: 18px;
  font-weight: bold;
  line-height: 1;

  @media (width < 960px) {
    flex: 1;
  }

  @media (width >= 960px) {
    font-size: 26px;
  }
}

.l-header__dateSmall {
  font-size: 10px;

  @media (width < 960px) {
    display: block;
  }

  @media (width >= 960px) {
    font-size: 14px;
  }
}

.-series {
  .l-header__inner {
    height: 72px;
    gap: 0 calc(var(--spacing) * 3);
    border-bottom: 1px solid var(--theme-color-black);

    @media (width < 960px) {
      padding: 0 calc(var(--spacing) * 6);
    }

    @media (width >= 960px) {
      align-items: center;
    }

    @media (width >= 1280px) {
      --swl-pad_container: 0;
      max-width: var(--container_size);
      height: 100px;
    }
  }

  .l-header__logo {
    margin-right: 0;
    padding: 0;
  }

  .c-headLogo {
    @media (width < 960px) {
      height: calc(var(--spacing) * 6);
    }
    @media (width >= 960px) {
      margin-right: 0;
    }
  }
}

.-img .c-headLogo__link {
  @media (width < 960px) {
    padding: 0;
  }
}

.c-gnav > .menu-item > a .ttl {
  line-height: 1.5;
}

.p-spMenu {
  @media (width >= 960px) {
    display: block;
  }
}

.p-spMenu__inner,
.p-searchModal__inner {
  max-width: 400px;
  padding-inline: clamp(2rem, 1.5229rem + 2.0356vw, 2.5rem);
  &::before {
    background: var(--color_bg);
  }
}

.p-spMenu__closeBtn {
  position: relative;
  margin-left: auto;

  .c-iconBtn__icon {
    font-size: 24px;
  }
}

.p-spMenu__body {
  margin-top: calc(var(--spacing) * 9);
  padding-inline: 0;
}

.p-spMenu__nav {
  margin: 0;
  border-top: 4px solid var(--theme-color-black);
  padding: 0;
}

.p-spMenu__bottomNav {
  display: grid;
  gap: calc(var(--spacing) * 6);
  margin-top: calc(var(--spacing) * 6);
  border-bottom: 4px solid var(--theme-color-black);
  padding-bottom: calc(var(--spacing) * 6);
}

.p-spMenu__bottomNavList {
  font-size: 12px;
  line-height: 2;
  font-weight: bold;
  letter-spacing: 0.05em;

  @media (width >= 960px) {
    font-size: 14px;
  }
}

.p-spMenu__bottomNavSns {
  .c-iconList__link {
    font-size: 24px;
  }
}

.p-spMenu__bottomNavOthers {
  font-size: 10px;
  line-height: 2;
  letter-spacing: 0.05em;

  @media (width >= 960px) {
    font-size: 12px;
  }
}

.l-header-banner {
  position: relative;
  padding: calc(var(--spacing) * 2);
  color: white;
  font-size: 12px;
  font-weight: bold;
  line-height: 2;
  background: var(--theme-cat-gourmet);
  overflow: hidden;
  display: flex;
}

.l-header-banner__wrap {
  display: flex;
  gap: calc(var(--spacing) * 3);
  animation: header-banner 30s linear infinite both;
}

.l-header-banner__item {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: calc(var(--spacing) * 2);
}

@keyframes header-banner {
  0% {
    translate: 0;
  }
  100% {
    translate: -100%;
  }
}

.p-searchModal {
  .p-searchModal__inner {
    inset-block: 0;
    right: 0;
    left: auto;
    z-index: 101;

    display: grid;
    align-content: flex-start;
    gap: calc(var(--spacing) * 10);

    padding-top: var(--logo_size_sp);

    /* background: var(--color_bg); */

    transform: translateX(0) translateY(0);
    translate: 88vw;
    transition-property: translate, opacity, visibility;

    .is-opened > & {
      translate: 0;
    }

    &::before {
      content: "";
      inset: 0;
      position: absolute;
      background: var(--color_bg);
      z-index: 0;
    }
  }
}

.c-modal .c-modal__close {
  position: relative;
  inset: auto;
}

.p-searchModal__content {
  position: relative;
  border-block: 4px solid var(--theme-color-black);
  padding-block: calc(var(--spacing) * 5);

  display: grid;
  gap: calc(var(--spacing) * 5);

  @media (width >= 960px) {
    gap: calc(var(--spacing) * 10);
    padding-block: calc(var(--spacing) * 10);
  }
}

.p-searchModal__section {
  display: grid;
  gap: calc(var(--spacing) * 3);
}

.p-searchModal__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  padding-bottom: calc(var(--spacing) * 1);
  border-bottom: 1px solid var(--theme-gray-200);

  @media (width >= 960px) {
    font-size: 20px;
  }
}

input[type="text"].c-searchForm__s {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--theme-color-black);
  border-radius: 0;
}

.c-searchForm__submit {
  background: transparent;
  border: none;

  &:before {
    color: var(--theme-color-black);
  }
}

.p-searchModal__tags {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--spacing) * 2);
}

.p-searchModal__tag {
  display: block;
  padding: 0 calc(var(--spacing) * 3);
  border-radius: var(--radius-full);
  background: var(--theme-color-white);
  color: var(--theme-color-black);
  border: 1px solid;
  font-size: 12px;
  line-height: 2;

  &:focus-visible {
    border-color: var(--theme-color-black);
    color: var(--theme-color-black);
  }

  @media (hover: hover) {
    &:hover {
      background: var(--theme-color-black);
      color: var(--theme-color-white);
    }
  }
}

:root {
  --theme-color-black: #121e2f;
  --theme-color-white: #fff;
  --theme-gray-200: #e5e7eb;
  --theme-gray-300: #d1d5db;
  --theme-gray-400: #9ca3af;
  --theme-brand-main: var(--theme-orange);
  --theme-orange: #ea7900;
  --theme-cat-gourmet: #d95e40;
  --theme-cat-odekake: #f3b94d;
  --theme-cat-life: #3d7d6f;
  --theme-cat-culture: #056cb6;
  --theme-cat-column: #e26a8a;

  --spacing: 0.25rem;
  --radius-full: calc(infinity * 1px);

  --top-common-container-gap: calc(var(--spacing) * 8);

  @media (width >= 960px) {
    --top-common-container-gap: calc(var(--spacing) * 16);
  }
}

.c-categoryList__link,
.p-postList__cat {
  border: 1px solid #000;
  border-radius: 24px;
  color: white;
  background-color: var(--theme-cat-color, var(--color_main));

  &.theme-cat-gourmet {
    --theme-cat-color: var(--theme-cat-gourmet);
  }

  &.theme-cat-odekake {
    --theme-cat-color: var(--theme-cat-odekake);
  }
  &.theme-cat-life {
    --theme-cat-color: var(--theme-cat-life);
  }
  &.theme-cat-culture {
    --theme-cat-color: var(--theme-cat-culture);
  }
  &.theme-cat-column {
    --theme-cat-color: var(--theme-cat-column);
  }
}

.c-categoryList__link {
  font-size: 12px;
  line-height: 2;
  padding: 0 12px;
}

.p-postList__cat {
  display: inline-block;
  padding: 0 8px;
  line-height: 1.5;
  font-size: 10px;

  @media (width >= 920px) {
    line-height: 2;
  }
}

.c-text-brand-main {
  color: var(--theme-brand-main);
}

.swiper-pagination {
  color: var(--theme-brand-main);
}

.p-postSlider {
  --swiper-pagination-color: var(--theme-brand-main);
  --swiper-pagination-bullet-inactive-color: var(--theme-gray-300);
  --swiper-pagination-bullet-inactive-opacity: 1;

  padding-bottom: 0;

  .swiper-pagination-bullet {
    background: var(--swiper-pagination-bullet-inactive-color, var(--theme-gray-300));
  }

  .swiper-pagination-bullet-active {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
  }

  .p-postList__item {
    @media (width >= 1020px) {
      --ps_space: calc(var(--spacing) * 5);
    }
  }
}

.c-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(var(--spacing) * 3);

  h2& {
    color: var(--c-heading-title-color, var(--theme-color-black));
    margin: 0;
    border: none;
    padding: 0;
    padding-bottom: calc(var(--spacing) * 3);
    border-bottom: 1px solid var(--theme-gray-200);
    background: transparent;

    @media (width >= 960px) {
      font-size: 24px;
    }

    &::before {
      display: none;
    }
  }

  .c-widget & {
    margin-bottom: calc(var(--spacing) * 3);
  }
}

.c-heading__inner {
  display: flex;
  align-items: baseline;
  gap: calc(var(--spacing) * 3);
}

.c-heading__title {
  display: flex;
  align-items: center;
  gap: calc(var(--spacing) * 1);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;

  @media (width >= 960px) {
    font-size: 24px;

    #sidebar & {
      font-size: 18px;
    }
  }
}

.c-heading__Icon {
  flex-shrink: 0;
  color: var(--theme-cat-color);
}

.c-heading__subtitle {
  font-size: 12px;
  font-weight: 500;
  color: var(--theme-cat-color, var(--theme-brand-main));
  letter-spacing: 0;
  line-height: 1.5;
}

.c-heading__link {
  display: flex;
  align-items: center;
  gap: calc(var(--spacing) * 2);
  color: var(--c-heading-link-color, var(--theme-color-black));
}

.c-heading__linkText {
  font-size: 16px;
  color: var(--theme-cat-color, var(--theme-brand-main));
  letter-spacing: 0;
  font-weight: 500;

  @media (width < 960px) {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
  }
}

.c-heading__linkIcon {
  font-size: 16px;

  @media (hover: hover) {
    transition: transform 0.3s ease-in-out;

    a:hover & {
      transform: translateX(calc(var(--spacing) * 1));
    }
  }
}

hr.c-hr {
  border-bottom-width: 4px;
  border-bottom-style: solid;
  border-bottom-color: var(--theme-color-black);
}

.c-fix-snsList {
  position: fixed;
  right: calc(var(--spacing) * 6);
  background: var(--theme-color-black);
  border-radius: var(--radius-full);
  padding: calc(var(--spacing) * 4) calc(var(--spacing) * 2);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  display: none;
  z-index: 101;

  @media (min-width: 920px) {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .c-iconList {
    flex-direction: column;
    gap: calc(var(--spacing) * 2);
    color: var(--theme-color-white);
  }
}

.top-common-container {
  --swl-block-margin: 0;

  .wp-block-group__inner-container {
    & > *:not(.c-heading) + * {
      margin-top: var(--top-common-container-gap, calc(var(--spacing) * 8));
    }

    & > .c-heading + * {
      margin-top: calc(var(--spacing) * 4);
    }
  }

  .wp-block-columns {
    @media (width < 960px) {
      --wp-column-gap: calc(var(--spacing) * 12);
    }
  }
}

.top-pickup {
  --c-heading-title-color: var(--theme-color-white);
  --c-heading-link-color: var(--theme-color-white);
  position: relative;
  left: calc(50% - 50vw + var(--swl-scrollbar_width, 0px) / 2);
  width: calc(100vw - var(--swl-scrollbar_width, 0px));
  overflow: hidden;
  background-color: var(--theme-cat-odekake);
  padding-block: calc(var(--spacing) * 16);
}

.top-pickup__inner {
  display: grid;
  gap: calc(var(--spacing) * 4);

  @media (width >= 960px) {
    margin-inline: max(calc((100vw - var(--container_size, 0px)) / 2), var(--swl-pad_container, 0));
  }

  .p-postList__title {
    font-size: 14px;

    @media (width >= 920px) {
      font-size: 18px;
    }
  }

  .p-postList {
    @media (width < 960px) {
      margin-inline: var(--swl-pad_container, 0);
    }
  }
}

.top-pickup__head {
  --theme-cat-color: var(--theme-color-white);

  @media (width < 960px) {
    padding-inline: var(--swl-pad_container, 0);
    margin-bottom: calc(var(--spacing) * 3);
  }

  @media (width >= 960px) {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    .c-heading__title {
      font-size: 32px;
    }
  }
}