/* ========================================
  オリジナルお菓子本舗ブランドカラー
======================================== */
.o_page {
  --color-primary-okashi: #ff6f91;
}

.o_page .global-nav__link--search {
  background-color: var(--color-primary-okashi);
  border-bottom: 1px solid var(--color-primary-okashi);
}

.o_page .global-nav__item:first-child {
  border-bottom: 1px solid var(--color-primary-okashi);
}

.o_page .search__cat-btn {
  background-color: var(--color-primary-okashi);
}

.o_page .search__form {
  border: 2px solid var(--color-primary-okashi);
}

.o_page .drawer__acc-root-btn {
  background-color: var(--color-primary-okashi);
}

.o_page .drawer__acc-btn .accordion__icon::before,
.o_page .drawer__acc-btn .accordion__icon::after {
  background-color: var(--color-primary-okashi);
}

.o_page .drawer__submit {
  color: var(--color-primary-okashi);
  border-color: var(--color-primary-okashi);
}

.o_page .btn {
  color: var(--color-primary-okashi);
  border-color: var(--color-primary-okashi);
}

.o_page .splide__pagination__page.is-active {
  background-color: var(--color-primary-okashi);
}

.o_page .heading__jp::after {
  background: linear-gradient(to right, var(--color-primary-okashi) 50%, var(--color-text-light) 50%);
}

.o_page .ranking-tabs__btn.tabs__btn.is-active {
  color: var(--color-primary-okashi);
  background-color: #fff7f7;
  border-bottom: 2px solid var(--color-primary-okashi);
}

.o_page .ranking-tabs__btn.tabs__btn.is-active::before {
  border-top: 9px solid var(--color-primary-okashi);
}

.o_page .top-ranking__progress-bar {
  background-color: var(--color-primary-okashi);
}

.o_page .footer__middle .footer__section-title::after {
  background: linear-gradient(
    to right,
    var(--color-primary-okashi) 0,
    var(--color-primary-okashi) 40px,
    #333333 40px,
    #333333 100%
  );
}

.o_page .top-side__submit {
  color: var(--color-primary-okashi);
  border-color: var(--color-primary-okashi);
}

.o_page .drawer__submit {
  color: var(--color-primary-okashi);
  border-color: var(--color-primary-okashi);
}

@media screen and (min-width: 1200px) {
  .o_page .search__form {
    border: 1px solid #888888;
  }

  .o_page .search__cat-btn {
    background-color: #888888;
  }

  .o_page .footer__nav .footer__col-btn::after {
    background: linear-gradient(
      to right,
      var(--color-primary-okashi) 0,
      var(--color-primary-okashi) 40px,
      #333333 40px,
      #333333 100%
    );
  }
}

/* ========================================
  ヘッダー
======================================== */
.o_header__logo {
  max-width: 193px;
}

.o_header__logo img {
  width: 100%;
}

@media screen and (min-width: 1200px) {
  .o_header__inner {
    grid-template-columns: 350px minmax(0, 1fr) auto;
  }

  .o_header__logo {
    max-width: none;
    margin-top: 9px;
  }

  .o_header__logo img {
    width: 100%;
  }
}

/* ========================================
  フッター
======================================== */
@media screen and (min-width: 1200px) {
  .o_footer__logo {
    width: 391px;
  }
}
