@charset "UTF-8";
/* ===============================================
  * Common Styles - サイト全体で共通のスタイル *
=============================================== */
/* ===============================================
  * Base *
=============================================== */
:root {
  --padding-horizontal-global: 4%;
}
@media screen and (min-width: 768px) {
  :root {
    --container-default: min(
      100%,
      calc(114rem + (var(--padding-horizontal-global) * 2))
    );
    --padding-horizontal-global: min(4.375%, 7rem);
  }
}

html {
  font-size: 62.5%;
  overflow-y: scroll;
  scroll-behavior: smooth;
  scroll-padding-top: var(--height-header);
}

@media screen and (min-width: 768px) {
  html {
    font-size: 10px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1140px) {
  html {
    font-size: calc(10 * 100vw / 1140);
  }
}
html[data-scroll-fixed="active"] {
  overflow: hidden;
}
html:has(input[type="email"]:focus),
html:has(input[type="number"]:focus),
html:has(input[type="password"]:focus),
html:has(input[type="search"]:focus),
html:has(input[type="tel"]:focus),
html:has(input[type="text"]:focus),
html:has(input[type="url"]:focus) {
  scroll-padding: initial !important;
}
body {
  width: 100%;
  color: var(--color-text-default);
  font-weight: 500;
  letter-spacing: 0.05em;
}
body.is-fixed {
  position: fixed;
  left: 0;
}

summary {
  list-style: none;
}
summary::-webkit-details-marker {
  display: none;
}

:where(a) {
  color: var(--color-textlink, inherit);
}

:where(input, button, textarea, select) {
  font-family: inherit;
  font-weight: inherit;
}

/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  :where(a) {
    transition: var(--transition-default);
  }
  :where(a):hover {
    opacity: 0.8;
  }
}

/* ===============================================
  * Utilities *
=============================================== */
.u-visually-hidden {
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(0px 0px 99.9% 99.9%);
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip-path: inset(0px 0px 99.9% 99.9%);
}
.is-hidden {
  display: none !important;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .is-hidden-small {
    display: none !important;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .is-hidden-large {
    display: none !important;
  }
}

/* ===============================================
  * Animation *
=============================================== */
[data-animation-type] {
  --animation-hover: 150ms ease-in;
}

@media screen and (min-width: 768px) and (hover: none) {
  [data-animation-type="text-underline"] {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  [data-animation-type="text-underline"]:active {
    text-decoration: underline !important;
  }
}
@media screen and (min-width: 768px) and (-ms-high-contrast: none),
  screen and (min-width: 768px) and (-ms-high-contrast: active),
  screen and (min-width: 768px) and (-moz-touch-enabled: 0),
  screen and (min-width: 768px) and (hover: hover) {
  [data-animation-type="text-underline"]:hover {
    text-decoration: underline !important;
  }
}

[data-animation-type="opacity"] {
  transition: opacity var(--animation-hover);
}

@media (hover: none) {
  [data-animation-type="opacity"] {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  [data-animation-type="opacity"]:active {
    opacity: var(--hover-opacity);
  }
}
@media (-ms-high-contrast: none),
  (-ms-high-contrast: active),
  (-moz-touch-enabled: 0),
  (hover: hover) {
  [data-animation-type="opacity"]:hover {
    opacity: var(--hover-opacity);
  }
}

[data-animation-type="image-circle"] {
  display: grid;
  place-content: center;
  border-radius: 4px;
  transition: border-radius var(--animation-hover),
    background var(--animation-hover);
}

@media (hover: none) {
  [data-animation-type="image-circle"] {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  [data-animation-type="image-circle"]:active {
    background-color: var(--color-gray-500);
    border-radius: 50%;
  }
}
@media (-ms-high-contrast: none),
  (-ms-high-contrast: active),
  (-moz-touch-enabled: 0),
  (hover: hover) {
  [data-animation-type="image-circle"]:hover {
    background-color: var(--color-gray-500);
    border-radius: 50%;
  }
}
[data-animation-type="image-circle"] > * {
  transition: scale var(--animation-hover);
}
@media (hover: none) {
  [data-animation-type="image-circle"] {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  [data-animation-type="image-circle"]:active > * {
    scale: 0.8;
  }
}
@media (-ms-high-contrast: none),
  (-ms-high-contrast: active),
  (-moz-touch-enabled: 0),
  (hover: hover) {
  [data-animation-type="image-circle"]:hover > * {
    scale: 0.8;
  }
}

/**
 * tabs
 */
[data-tab-trigger] {
  border: 1px solid var(--color-accent);
  border-radius: 100vh;
  background-color: var(--tab-background-active, var(--color-white));
  color: var(--tab-color-active, var(--color-accent));
}
[data-tab-trigger].is-current {
  --tab-background-active: var(--color-accent);
  --tab-color-active: var(--color-white);
}
[data-tab-target] {
  display: var(--tab-display, none);
}
[data-tab-target].is-current {
  --tab-display: block;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .c-global-tabs__list {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    column-gap: 0.6em;
    row-gap: 0.8rem;
  }
  .c-global-tabs__list {
    padding-block-end: var(--tabs-list-spacer, 2rem);
  }
  [data-tab-trigger] {
    padding-block: 0.8rem;
    padding-inline: 1.6rem;
    font-size: 1.4rem;
    line-height: calc(20 / 14);
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .c-global-tabs__list {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1rem;
  }
  .c-global-tabs__list {
    padding-block-end: var(--tabs-list-spacer, 3rem);
  }
  [data-tab-trigger] {
    padding-block: 1rem;
    font-size: 1.6rem;
    line-height: calc(20 / 16);
  }
}

/* ===============================================
  * Layout *
=============================================== */
.global-contents__inner {
  width: 100%;
  margin-inline: auto;
  padding-bottom: 8rem;
}
@media screen and (min-width: 768px) {
  .global-contents__inner {
    width: min(90%, 114rem);
    padding-bottom: 12rem;
  }
}

.global-container {
  display: grid;
  grid-template-rows: auto 1fr auto;
  grid-template-columns: 100%;
  /* display: flex;
  flex-direction: column; */
  min-height: 100svh;
}

.global-content__fluid-wrapper {
  width: var(--container-default);
  margin: auto;
  padding-right: var(--padding-horizontal-global) !important;
  padding-left: var(--padding-horizontal-global) !important;
}

/**
 * carousel
 */
.c-global-carousel-navigation__progressbar,
.c-global-carousel-navigation__scrollbar {
  position: var(--swiper-pagination-progressbar-position, relative) !important;
  margin-inline: auto;
  border-radius: 100vh;
  background-color: rgba(164, 192, 201, 0.2);
  overflow: hidden;
}
.c-global-carousel-navigation__progressbar-fill,
.swiper-scrollbar-drag {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100vh;
  background-color: var(--color-primary);
  transform-origin: left top;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .c-global-carousel-navigation__progressbar,
  .c-global-carousel-navigation__scrollbar {
    --swiper-pagination-progressbar-size: 0.4rem;
    max-width: 33.5rem;
    margin-block-start: var(--carousel-navigation-progressbar-spacer, 2rem);
  }
  .c-global-carousel-navigation__scrollbar {
    height: 0.4rem;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .c-global-carousel-navigation__progressbar,
  .c-global-carousel-navigation__scrollbar {
    --swiper-pagination-progressbar-size: 0.5rem;
    max-width: 70rem;
    margin-block-start: var(--carousel-navigation-progressbar-spacer, 2rem);
  }
  .c-global-carousel-navigation__scrollbar {
    height: 0.5rem;
  }
}

/**
 * global categories tree
 */
.c-global-categories__list {
  display: grid;
}
:where([data-category-id="100"], [data-category-id="300"])
  .c-global-categories__list {
  grid-template-columns: repeat(3, 1fr);
}
.c-global-categories__item {
  border: 1px solid var(--color-primary);
  border-radius: 1rem;
  background-color: var(--color-white);
  overflow: hidden;
}
.c-global-categories__item-link {
  --color-textlink: var(--color-text-default);
  display: grid;
  font-weight: 500;
  text-decoration: none;
}
.global-nav__text--link:hover {
  opacity: 1;
}
.c-global-categories__thumbnail {
  max-width: 9rem;
  aspect-ratio: 1 / 1;
}
.c-global-categories__thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
:where([data-category-id="100"]) .c-global-categories__thumbnail {
  padding: 0.5rem;
}
:where([data-category-id="100"]) .c-global-categories__thumbnail img {
  border-radius: 100vh;
  overflow: hidden;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .c-global-categories__list {
    gap: 0.6rem;
  }
  :where([data-category-id="200"]) .c-global-categories__list {
    grid-template-columns: repeat(2, 1fr);
  }
  .c-global-categories__item-link {
    grid-template-columns: 100%;
    padding-block-start: .8rem;
    padding-block-end: 1rem;
  }
  .c-global-categories__thumbnail {
    margin-inline: auto;
  }
  .c-global-categories__item-name {
    padding-inline: 1rem;
    font-size: 1.3rem;
    line-height: calc(18 / 13);
    text-align: center;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  :where([data-category-id="100"], [data-category-id="300"])
    .c-global-categories__list {
    gap: 1.6rem;
  }
  :where([data-category-id="200"]) .c-global-categories__list {
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
  }
  :where([data-category-id="100"], [data-category-id="300"])
    .c-global-categories__item-link {
    grid-template-columns: auto 1fr;
    align-items: center;
    padding-block: 0.5rem;
    padding-inline: 1rem;
  }
  :where([data-category-id="200"]) .c-global-categories__item-link {
    place-items: center;
    padding-block: 1.3rem;
    padding-inline: 1rem;
  }
  .c-global-categories__item-name {
    font-size: 1.6rem;
    line-height: calc(24 / 16);
  }
}

/**
 * global products
 */
.c-global-product-item__list {
}
.c-global-product-item__list-item.swiper-slide {
  display: flex;
  flex-direction: column;
  height: auto;
}
.c-global-product-item__list-item-inner {
  display: block;
  background-color: var(--color-white);
  color: inherit;
  text-decoration: none;
}
.c-global-product-item__thumbnail-container {
  position: relative;
}
.c-global-product-item__thumbnail {
  position: relative;
  aspect-ratio: 1 / 1;
}
.c-global-product-item__thumbnail > div {
  height: 100%;
}
.c-global-product-item__label {
  background-color: #f0f5f7;
  text-align: center;
}
.c-global-product-item__thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.c-global-product-item__soldout-layer {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  color: var(--color-white);
  z-index: var(--zindex-floating-element);
}
.c-global-product-item__details {
  display: grid;
  grid-template-columns: 100%;
  row-gap: 1rem;
  margin-block-start: 1rem;
}
.c-global-product-item__cicons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.c-global-product-item__cicon-label {
  padding-inline: 0.5rem;
  border: 1px solid rgba(var(--cicon-rgb-color), 0.8);
  border-radius: 0.3rem;
  background-color: var(--color-white);
  font-size: var(--roduct-item-cicon-font-size, 1.1rem);
  line-height: var(--roduct-item-cicon-line-height, calc(19 / 11));
  color: rgb(var(--cicon-rgb-color));
}
.c-global-product-item__cicon-label--01 {
  --cicon-rgb-color: 235, 154, 84;
}
.c-global-product-item__cicon-label--02 {
  --cicon-rgb-color: 237, 74, 74;
}
.c-global-product-item__cicon-label--03 {
  --cicon-rgb-color: 111, 170, 201;
}
.c-global-product-item__cicon-label--04 {
  --cicon-rgb-color: 214, 177, 52;
}
.c-global-product-item__cicon-label--05 {
  --cicon-rgb-color: 214, 177, 52;
}
.c-global-product-item__cicon-label--06 {
  --cicon-rgb-color: 126, 199, 104;
}
.c-global-product-item__cicon-label--07 {
  --cicon-rgb-color: 111, 170, 201;
}
.c-global-product-item__cicon-label--08 {
  --cicon-rgb-color: 111, 170, 201;
}
.c-global-product-item__cicon-label--09 {
  --cicon-rgb-color: 235, 154, 84;
}
.c-global-product-item__cicon-label--10 {
  --cicon-rgb-color: 126, 199, 104;
}
.c-global-product-item__price-container,
.c-global-product-item__price-shell {
  display: grid;
  grid-template-columns: 100%;
  row-gap: var(--product-item-price-gap, 0.5rem);
}
.c-global-product-item__price-shell--subscribe {
  color: var(--color-emphasis);
}
.c-global-product-item__price {
  display: flex;
  align-items: center;
  font-weight: 700;
}
.c-global-product-item__price-badge {
  font-size: 1.1rem;
  font-weight: 500;
}
.c-global-product-item__price-badge--proper {
  color: var(--color-text-default);
}
.c-global-product-item__price-wrapper {
  position: relative;
  width: fit-content;
}
.c-global-product-item__price-tax {
  font-weight: 500;
}
.c-global-product-item__price-shell:has(.c-global-product-item__discountrate) {
  --product-item-price-gap: 0;
}
.c-global-product-item__price--proper:has(.c-global-product-item__discountrate)
  .c-global-product-item__price-wrapper {
  color: #666;
}
.c-global-product-item__price--proper:has(.c-global-product-item__discountrate)
  .c-global-product-item__price-wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  margin: auto;
  background-color: var(--color-text-default);
}
.c-global-product-item__price-shell:has(.c-global-product-item__price-badge) {
  grid-template-columns: auto 1fr;
}
.c-global-product-item__price-shell:has(.c-global-product-item__price-badge)
  .c-global-product-item__price-badge {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}
.c-global-product-item__price-shell:has(.c-global-product-item__price-badge)
  .c-global-product-item__price {
  grid-column: 2;
}
.c-global-product-item__price--discount {
  color: var(--color-emphasis);
}
.c-global-product-item__discountrate {
  color: var(--color-emphasis);
  font-weight: 500;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .c-global-product-item__ranking-badge {
    width: 3.8rem;
    margin-block-end: 0.5rem;
  }
  .c-global-product-item__label {
    font-size: 1.1rem;
    line-height: calc(18 / 11);
  }
  .c-global-product-item__name {
    font-size: 1.5rem;
    line-height: calc(22.5 / 15);
  }
  .c-global-product-item__catchcopy {
    font-size: 1.3rem;
    line-height: calc(21 / 13);
  }
  .c-global-product-item__price {
    flex-wrap: wrap;
    column-gap: 0.6rem;
  }
  .c-global-product-item__price-numeric {
    font-size: var(--product-item-price-numeric-font-size, 2rem);
    line-height: var(--product-item-price-numeric-line-height, calc(26 / 20));
  }
  .c-global-product-item__price-currency {
    font-size: var(--product-item-price-currency-font-size, 1.1rem);
  }
  .c-global-product-item__price-tax {
    font-size: 1rem;
  }
  .c-global-product-item__price--proper:has(
      .c-global-product-item__discountrate
    ) {
    --product-item-price-numeric-font-size: 1.4rem;
    --product-item-price-numeric-line-height: calc(20 / 14);
    --product-item-price-currency-font-size: 1rem;
  }
  .c-global-product-item__price-shell:has(.c-global-product-item__price-badge) {
    column-gap: 0.6rem;
  }
  .c-global-product-item__discountrate {
    font-size: 1.1rem;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .c-global-product-item__ranking-badge {
    width: 4.4rem;
    margin-block-end: 0.5rem;
  }
  .c-global-product-item__label {
    font-size: 1.2rem;
    line-height: calc(20 / 12);
  }
  .c-global-product-item__name {
    font-size: 1.6rem;
    line-height: calc(24 / 16);
  }
  .c-global-product-item__catchcopy {
    font-size: 1.4rem;
    line-height: calc(24 / 14);
  }
  .c-global-product-item__price {
    column-gap: 0.9rem;
  }
  .c-global-product-item__price-numeric {
    font-size: var(--product-item-price-numeric-font-size, 2.2rem);
    line-height: var(--product-item-price-numeric-line-height, calc(26 / 22));
  }
  .c-global-product-item__price-currency {
    font-size: var(--product-item-price-currency-font-size, 1.3rem);
  }
  .c-global-product-item__price-tax {
    font-size: 1.1rem;
  }
  .c-global-product-item__price--proper:has(
      .c-global-product-item__discountrate
    ) {
    --product-item-price-numeric-font-size: 1.6rem;
    --product-item-price-numeric-line-height: calc(24 / 16);
    --product-item-price-currency-font-size: 1rem;
  }
  .c-global-product-item__price-shell:has(.c-global-product-item__price-badge) {
    column-gap: 0.9rem;
  }
  .c-global-product-item__discountrate {
    font-size: 1.2rem;
  }
}

/**
 * instagram
 */
.l-common-instagram .ecbn-selection-widget {
  max-width: var(--container-global-default);
  margin-block: 0;
  margin-inline: auto;
}
.l-common-instagram .vsm-selection-title {
  font-size: initial;
  font-weight: initial;
  margin: 0;
  padding-left: 0;
}
.l-common-instagram {
  margin: 0 !important;
}
.l-common-instagram .vsm-selection-title img {
  display: none;
}
.l-common-instagram .vsm-selection-title span {
  position: relative;
  display: grid;
  grid-template-columns: 100%;
  gap: 0.6rem;
  font-weight: var(--fw-bold);
  letter-spacing: 0.15em;
  text-align: var(--heading-text-align, center);
  color: var(--color-secondary);
  letter-spacing: 0.15em;
}
.l-common-instagram .vsm-selection-title span::before {
  content: '';
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjAiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA2MCA0OCI+IDxkZWZzPiA8Y2xpcFBhdGggaWQ9ImNsaXAtcGF0aCI+IDxyZWN0IGlkPSLplbfmlrnlvaJfNDEyNiIgZGF0YS1uYW1lPSLplbfmlrnlvaIgNDEyNiIgd2lkdGg9IjYwIiBoZWlnaHQ9IjQ4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNDAgNjQ5MCkiIGZpbGw9IiNmZmYiIHN0cm9rZT0iIzcwNzA3MCIgc3Ryb2tlLXdpZHRoPSIxIi8+IDwvY2xpcFBhdGg+IDwvZGVmcz4gPGcgaWQ9IuODnuOCueOCr+OCsOODq+ODvOODl183NCIgZGF0YS1uYW1lPSLjg57jgrnjgq/jgrDjg6vjg7zjg5cgNzQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xNDAgLTY0OTApIiBjbGlwLXBhdGg9InVybCgjY2xpcC1wYXRoKSI+IDxwYXRoIGlkPSJJbnN0YWdyYW1fR2x5cGhfQmxhY2siIGQ9Ik0xMy4wNDQsMi42MjlhMTMuMTI5LDEzLjEyOSwwLDAsMC00LjM2Ni44NDVBOC44MDksOC44MDksMCwwLDAsNS40OTQsNS41NTZhOC44MTcsOC44MTcsMCwwLDAtMi4wNywzLjE5QTEzLjIyNSwxMy4yMjUsMCwwLDAsMi42LDEzLjExN2MtLjA4NSwxLjkxNi0uMSwyLjUzMi0uMDk0LDcuNDJzLjAzMSw1LjUuMTI0LDcuNDIxYTEzLjE1OCwxMy4xNTgsMCwwLDAsLjg0NSw0LjM2Niw5LjIsOS4yLDAsMCwwLDUuMjc1LDUuMjU0LDEzLjIxNCwxMy4yMTQsMCwwLDAsNC4zNy44MjhjMS45MTYuMDg0LDIuNTMzLjEsNy40MTkuMDk0czUuNS0uMDMxLDcuNDIyLS4xMjJhMTMuMTcsMTMuMTcsMCwwLDAsNC4zNjUtLjg0NSw5LjIsOS4yLDAsMCwwLDUuMjU0LTUuMjc1LDEzLjE2NiwxMy4xNjYsMCwwLDAsLjgyOC00LjM2OWMuMDg0LTEuOTIxLjEtMi41MzUuMDk0LTcuNDIycy0uMDMxLTUuNS0uMTIyLTcuNDJhMTMuMTQ3LDEzLjE0NywwLDAsMC0uODQ1LTQuMzY4QTguODM3LDguODM3LDAsMCwwLDM1LjQ0OCw1LjVhOC43ODUsOC43ODUsMCwwLDAtMy4xOTItMi4wNjksMTMuMTcyLDEzLjE3MiwwLDAsMC00LjM3LS44MjhjLTEuOTE2LS4wODMtMi41MzMtLjEtNy40MjEtLjA5NXMtNS41LjAzLTcuNDIuMTI0bS4yMSwzMi41NGE5Ljk4OSw5Ljk4OSwwLDAsMS0zLjM0My0uNjEyLDUuNiw1LjYsMCwwLDEtMi4wNzMtMS4zNDIsNS41NDQsNS41NDQsMCwwLDEtMS4zNS0yLjA2Nyw5Ljk2OSw5Ljk2OSwwLDAsMS0uNjI2LTMuMzQyYy0uMDg5LTEuOS0uMTA4LTIuNDY2LS4xMTgtNy4yNzJzLjAwOC01LjM3NC4wOTEtNy4yNzJhOS45NjIsOS45NjIsMCwwLDEsLjYxMi0zLjM0MkE1LjU3NCw1LjU3NCwwLDAsMSw3Ljc5LDcuODQ3LDUuNTU3LDUuNTU3LDAsMCwxLDkuODU4LDYuNSw5Ljk2Nyw5Ljk2NywwLDAsMSwxMy4yLDUuODdjMS45LS4wOSwyLjQ2Ny0uMTA4LDcuMjcyLS4xMThzNS4zNzUuMDA4LDcuMjc0LjA5MWE5Ljk1NSw5Ljk1NSwwLDAsMSwzLjM0Mi42MTJBNS45NTksNS45NTksMCwwLDEsMzQuNTEsOS44NjZhOS45MTcsOS45MTcsMCwwLDEsLjYyNSwzLjMzOWMuMDksMS45LjExMSwyLjQ2Ny4xMiw3LjI3MnMtLjAwOCw1LjM3NS0uMDkxLDcuMjcyYTEwLDEwLDAsMCwxLS42MTIsMy4zNDQsNS45NjEsNS45NjEsMCwwLDEtMy40MTEsMy40MjIsOS45Nyw5Ljk3LDAsMCwxLTMuMzM5LjYyNmMtMS45LjA4OS0yLjQ2Ny4xMDgtNy4yNzQuMTE4cy01LjM3NC0uMDA5LTcuMjcyLS4wOTFNMjcuOTI5LDEwLjg4M2EyLjE2LDIuMTYsMCwxLDAsMi4xNTYtMi4xNjQsMi4xNiwyLjE2LDAsMCwwLTIuMTU2LDIuMTY0TTExLjI1NywyMC41MjFhOS4yNDMsOS4yNDMsMCwxLDAsOS4yMjQtOS4yNjEsOS4yNDIsOS4yNDIsMCwwLDAtOS4yMjQsOS4yNjFtMy4yNDItLjAwNkE2LDYsMCwxLDEsMjAuNTExLDI2LjUsNiw2LDAsMCwxLDE0LjUsMjAuNTE1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNDkuNTAxIDY0OTMuNDk3KSIgZmlsbD0iI2E0YzBjOSIvPiA8L2c+PC9zdmc+");
  margin-inline: auto;
  background-size: 100%;
  background-repeat: no-repeat;
}
.l-common-instagram .vsm-selection-title span::after {
  content: 'INSTAGRAM';
}
.l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-to-nextpage-btn,
.l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-more-btn {
  --button-border: none;
  --button-font-weight: var(--fw-medium);
  position: relative;
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  min-width: var(--button-min-width, 15rem);
  width: var(--button-width, fit-content) !important;
  margin-block: 0;
  padding-inline: 2rem;
  border: var(--button-border, 1px solid var(--color-accent)) !important;
  border-radius: 100vh !important;
  background-image: linear-gradient(
    90deg,
    #5999b1 0%,
    #9bd2e6 50%,
    #5999b1 100%
  ) !important;
  background-size: 200% 100% !important;
  font-size: var(--button-font-size, 1.5rem) !important;
  font-weight: var(--button-font-weight, var(--fw-bold));
  letter-spacing: 0.1em;
  line-height: var(--button-line-height, calc(21 / 15)) !important;
  text-align: center !important;
  text-decoration: none !important;
  color: var(--color-white) !important;
  transition: var(--transition-default);
}
.l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-to-nextpage-btn::after,
.l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-more-btn::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 2rem;
  margin: auto;
  background-size: 100%;
  background-image: url("data:image/svg+xml;base64,PHN2ZyBpZD0iZXh0ZXJuYWxfbGlua19saW5lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj4gPHBhdGggaWQ9IuODkeOCuV80NjE3IiBkYXRhLW5hbWU9IuODkeOCuSA0NjE3IiBkPSJNMjAsMFYyMEgwVjBaTTEwLjQ5NCwxOS4zODJsLS4wMDksMC0uMDU5LjAyOS0uMDE3LDAtLjAxMiwwLS4wNTktLjAyOWEuMDE3LjAxNywwLDAsMC0uMDIsMGwwLC4wMDgtLjAxNC4zNTcsMCwuMDE3LjAwOC4wMTEuMDg3LjA2Mi4wMTIsMCwuMDEsMCwuMDg3LS4wNjIuMDEtLjAxMywwLS4wMTQtLjAxNC0uMzU2YS4wMTguMDE4LDAsMCwwLS4wMTQtLjAxNW0uMjIxLS4wOTQtLjAxMSwwLS4xNTQuMDc4LS4wMDguMDA4LDAsLjAwOS4wMTUuMzU4LDAsLjAxLjAwNy4wMDYuMTY3LjA3OGEuMDIxLjAyMSwwLDAsMCwuMDI0LS4wMDdsMC0uMDEyLS4wMjgtLjUxMmEuMDIyLjAyMiwwLDAsMC0uMDE3LS4wMThtLS42LDBhLjAxOS4wMTksMCwwLDAtLjAyMy4wMDVsLS4wMDUuMDEyLS4wMjguNTEyYS4wMjEuMDIxLDAsMCwwLC4wMTQuMDJsLjAxMiwwLC4xNjgtLjA3OC4wMDgtLjAwNywwLS4wMDkuMDE0LS4zNTgsMC0uMDEtLjAwOC0uMDA4WiIgZmlsbD0ibm9uZSIvPiA8cGF0aCBpZD0i44OR44K5XzQ2MTgiIGRhdGEtbmFtZT0i44OR44K5IDQ2MTgiIGQ9Ik05LjIyMiw1LjMzM2EuNzc4Ljc3OCwwLDEsMSwwLDEuNTU2SDQuNTU2djguNTU2aDguNTU2VjEwLjc3OGEuNzc4Ljc3OCwwLDEsMSwxLjU1NiwwdjQuNjY3QTEuNTU2LDEuNTU2LDAsMCwxLDEzLjExMSwxN0g0LjU1NkExLjU1NiwxLjU1NiwwLDAsMSwzLDE1LjQ0NFY2Ljg4OUExLjU1NiwxLjU1NiwwLDAsMSw0LjU1Niw1LjMzM1ptNy0yLjMzM0EuNzc4Ljc3OCwwLDAsMSwxNywzLjc3OFY3LjY2N2EuNzc4Ljc3OCwwLDAsMS0xLjU1NiwwVjUuNjU1bC02LjQ1LDYuNDVhLjc3OC43NzgsMCwxLDEtMS4xLTEuMWw2LjQ1LTYuNDVIMTIuMzMzYS43NzguNzc4LDAsMCwxLDAtMS41NTZaIiBmaWxsPSIjZmZmIi8+PC9zdmc+");
  background-repeat: no-repeat;
}
.l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-to-nextpage-btn:hover,
.l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-to-nextpage-btn:active,
.l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-more-btn:hover,
.l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-more-btn:active {
  background-position: 100% 0;
  opacity: 1;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .l-common-instagram .vsm-selection-title + * {
    margin-block-start: var(--instagram-heading-spacer, 3rem) !important;
  }
  .l-common-instagram .vsm-selection-title span {
    font-size: var(--heading-primary-font-size, 2.4rem);
    line-height: var(--heading-primary-line-height, calc(35 / 24));
  }
  .l-common-instagram .vsm-selection-title span::before {
    width: var(--heading-icon-width, 5rem);
    height: var(--heading-icon-height, 4rem);
  }
  .l-common-instagram .vsm-selection-title span::after {
    font-size: var(--heading-secondary-font-size, 1.2rem);
    line-height: var(--heading-secondary-line-height, calc(15 / 12));
  }
  .l-common-instagram .ecbn-selection-to-nextpage {
    margin-block-start: 4rem;
  }
  .l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-to-nextpage-btn,
  .l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-more-btn {
    --button-min-width: 23.5rem;
    padding-bottom: 1.2rem;
  }
  .l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-to-nextpage-btn::after,
  .l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-more-btn::after {
    width: 1.8rem;
    height: 1.8rem;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .l-common-instagram .vsm-selection-title + * {
    margin-block-start: var(--instagram-heading-spacer, 4rem);
  }
  .l-common-instagram .vsm-selection-title span {
    font-size: var(--heading-primary-font-size, 3rem);
    line-height: var(--heading-primary-line-height, calc(44 / 30));
  }
  .l-common-instagram .vsm-selection-title span::before {
    width: var(--heading-icon-width, 6rem);
    height: var(--heading-icon-height, 4.8rem);
  }
  .l-common-instagram .vsm-selection-title span::after {
    font-size: var(--heading-secondary-font-size, 1.4rem);
    line-height: var(--heading-secondary-line-height, calc(17 / 14));
  }
  .l-common-instagram .ecbn-selection-to-nextpage {
    margin-block-start: 5rem;
  }
  .l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-to-nextpage-btn,
  .l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-more-btn {
    --button-min-width: 30rem;
    --button-font-size: 1.8rem;
    --button-line-height: calc(26 / 18);
    padding-bottom: 1.4rem;
  }
  .l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-to-nextpage-btn::after,
  .l-common-instagram .ecbn-selection-to-nextpage > a.ecbn-selection-more-btn::after {
    width: 2rem;
    height: 2rem;
  }
}

/**
 * carousel module / component
 */
.c-global-carousel-navigation {
  display: flex;
  justify-content: center;
  align-items: center;
}
.c-global-carousel-navigation__button {
  background-size: 100%;
  background-repeat: no-repeat;
}
.c-global-carousel-navigation__button.swiper-button-disabled {
  opacity: 0.2;
}
.c-global-carousel-navigation__button--prev {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMC4yMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxMC4yMTggMTgiPiA8cGF0aCBpZD0i44OR44K5XzQ2NzYiIGRhdGEtbmFtZT0i44OR44K5IDQ2NzYiIGQ9Ik0tMzAyNS44NjMsMTcuNjQzbC03Ljc4MS03Ljc4MWExLjIyMSwxLjIyMSwwLDAsMSwwLTEuNzI0bDcuNzgxLTcuNzhBMS4yMTMsMS4yMTMsMCwwLDEtMzAyNSwwYTEuMjExLDEuMjExLDAsMCwxLC44NjIuMzU3LDEuMjE0LDEuMjE0LDAsMCwxLC4zNTcuODYzLDEuMjE0LDEuMjE0LDAsMCwxLS4zNTYuODYyTC0zMDMxLjA1Nyw5bDYuOTE4LDYuOTE5YTEuMjEyLDEuMjEyLDAsMCwxLC4zNTcuODYyLDEuMjE2LDEuMjE2LDAsMCwxLS4zNTYuODYzQTEuMjEyLDEuMjEyLDAsMCwxLTMwMjUsMTgsMS4yMSwxLjIxLDAsMCwxLTMwMjUuODYzLDE3LjY0M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMwMzQpIiBmaWxsPSIjYTRjMGM5Ii8+PC9zdmc+");
}
.c-global-carousel-navigation__button--next {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMC4yMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxMC4yMTggMTgiPiA8cGF0aCBpZD0i44OR44K5XzQ2NzciIGRhdGEtbmFtZT0i44OR44K5IDQ2NzciIGQ9Ik0tMzAyNS44NjMsMTcuNjQzbC03Ljc4MS03Ljc4MWExLjIyMSwxLjIyMSwwLDAsMSwwLTEuNzI0bDcuNzgxLTcuNzhBMS4yMTMsMS4yMTMsMCwwLDEtMzAyNSwwYTEuMjExLDEuMjExLDAsMCwxLC44NjIuMzU3LDEuMjE0LDEuMjE0LDAsMCwxLC4zNTcuODYzLDEuMjE0LDEuMjE0LDAsMCwxLS4zNTYuODYyTC0zMDMxLjA1Nyw5bDYuOTE4LDYuOTE5YTEuMjEyLDEuMjEyLDAsMCwxLC4zNTcuODYyLDEuMjE2LDEuMjE2LDAsMCwxLS4zNTYuODYzQTEuMjEyLDEuMjEyLDAsMCwxLTMwMjUsMTgsMS4yMSwxLjIxLDAsMCwxLTMwMjUuODYzLDE3LjY0M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zMDIzLjc4MiAxOCkgcm90YXRlKDE4MCkiIGZpbGw9IiNhNGMwYzkiLz48L3N2Zz4=");
}
.c-global-carousel-navigation__dots {
  --swiper-pagination-bullet-horizontal-gap: 0;
  --swiper-pagination-bullet-border-radius: 100vh;
  --swiper-pagination-bullet-inactive-color: var(--color-primary);
  display: flex;
  justify-content: center;
  align-items: center;
  width: fit-content !important;
}
.c-global-carousel-navigation__dots:not(
    :has(.c-global-carousel-navigation__dots--progress)
  ) {
  --swiper-pagination-color: var(--color-primary);
}
.c-global-carousel-navigation__dots--progress .swiper-pagination-bullet-active {
  --swiper-pagination-color: rgba(164, 192, 201, 0.2);
  position: relative;
  width: 6rem;
  border-radius: 100vh;
}
.c-global-carousel-navigation__dots--progress
  .swiper-pagination-bullet-active::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  border-radius: 100vh;
  background-color: var(--color-primary);
  animation: progress 2.5s ease-in-out forwards;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .c-global-carousel-navigation {
    margin-block-start: var(--carousel-navigation-spacer, 1.5rem);
    gap: 4rem;
  }
  .c-global-carousel-navigation__button {
    width: var(--carousel-navigation-button-width, 1rem);
    height: var(--carousel-navigation-button-height, 1.8rem);
  }
  .c-global-carousel-navigation__dots {
    --swiper-pagination-bullet-size: 0.6rem;
    gap: 1.6rem;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .c-global-carousel-navigation {
    margin-block-start: var(--carousel-navigation-spacer, 1.5rem);
    gap: 4rem;
  }
  .c-global-carousel-navigation__button {
    width: var(--carousel-navigation-button-width, 1rem);
    height: var(--carousel-navigation-button-height, 1.8rem);
  }
  .c-global-carousel-navigation__dots {
    --swiper-pagination-bullet-size: 0.6rem;
    gap: 1.6rem;
  }
}

/**
 * payment description
 */
.c-global-paymernt-description-cvs-def__container {
  display: grid;
  grid-template-columns: 100%;
  row-gap: 2em;
  padding-block: 1em;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .c-global-paymernt-description-cvs-def__container * {
    font-size: 1.2rem;
  }
  .c-global-paymernt-description-cvs-def__image {
    max-width: 100%;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .c-global-paymernt-description-cvs-def__container * {
    font-size: 1.3rem;
  }
  .c-global-paymernt-description-cvs-def__image {
    max-width: 50rem;
  }
}

/**
 * animation
 */
@-webkit-keyframes progress {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
@keyframes progress {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
