.mri-icon {
  --mri-size: 24px;
  display: inline-grid;
  width: var(--mri-size);
  height: var(--mri-size);
  flex: 0 0 var(--mri-size);
  place-items: center;
  line-height: 0;
  vertical-align: -0.16em;
}

.mri-icon__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.mri-icon.mk-icon {
  --mri-size: 56px;
}

.mri-icon.mk-icon .mri-icon__img {
  width: 70%;
  height: 70%;
}

.mk-trust-row .mri-icon.mk-icon .mri-icon__img,
.mk-route-home .mk-card-grid--dept .mri-icon.mk-icon .mri-icon__img,
.mk-route-medical .mk-card-grid--dept .mri-icon.mk-icon .mri-icon__img {
  width: 74%;
  height: 74%;
}

.hp-fixed-cta .mri-icon,
.spc-button .mri-icon,
.hp-diet-hero__btn .mri-icon,
.hp-beauty-routing-cta__btn .mri-icon,
.hp-beauty-routing-cta__phone .mri-icon {
  --mri-size: 18px;
  color: inherit;
}

.hp-fixed-cta .mri-icon__img,
.hp-diet-hero__btn .mri-icon__img,
.hp-beauty-routing-cta__btn .mri-icon__img,
.hp-hero__btn--primary .mri-icon__img,
.hp-btn--primary .mri-icon__img,
.hp-btn--line .mri-icon__img,
.hp-btn--accent .mri-icon__img {
  filter: brightness(0) invert(1);
}

.hp-beauty-routing-cta__features .mri-icon__img,
.hp-beauty-routing-cta__phone .mri-icon__img {
  filter: none;
}

.hp-pagetop .mri-icon {
  --mri-size: 22px;
  transform: rotate(-90deg);
}

.hp-pagetop .mri-icon__img {
  filter: brightness(0) invert(1);
}

.hp-side-reception__toggle .mri-icon {
  --mri-size: 20px;
}

.hp-branch__icon .mri-icon,
.hp-beauty-portal-nav__icon .mri-icon {
  width: 100%;
  height: 100%;
  flex-basis: 100%;
}

.hp-branch__icon .mri-icon__img,
.hp-beauty-portal-nav__icon .mri-icon__img {
  width: 78%;
  height: 78%;
}

[class*="final-online-pages-module"][class*="__icon"].mri-icon {
  --mri-size: 22px;
  display: inline-grid;
  width: var(--mri-size);
  height: var(--mri-size);
  flex: 0 0 var(--mri-size);
  vertical-align: -0.22em;
}

[class*="final-online-pages-module"][class*="__button"] .mri-icon__img {
  filter: brightness(0) invert(1);
}
