@charset "UTF-8";
:root {
  --mk--color--primary: #00b9ef;
  --mk--color--primary-pale: #f8e8eb;
  --mk--color--base: #756c67;
  --mk--color--base-strong: #706a68;
  --mk--color--white: #fff;
  --mk--color--accent-3: #fffde8;
  --mk--color--accent-4: #fffde8;
  --mk--color--accent-5: #f0faff;
  --mk--color--accent-6: #e5f5ff;
  --mk--color--accent-7: #d4f0ff;
  --mk--color--accent-8: #c0edfc;
  --mk--color--accent-9: #fffdea;
  --mk--color--accent-10: #fff9bf;
  --mk--color--accent-11: #80c5ef;
  --mk--color--accent-12: #eba8a7;
  --mk--color--accent-13: #f49800;
}

:root {
  --line-height: 1.714;
}

:root {
  --mk--spacing-10: 1.333cqw;
  --mk--spacing-20: 2.667cqw;
  --mk--spacing-30: 4cqw;
  --mk--spacing-40: 5.333cqw;
  --mk--spacing-50: 6.667cqw;
  --mk--spacing-60: 8cqw;
  --mk--spacing-70: 9.333cqw;
  --mk--spacing-80: 10.667cqw;
  --mk--spacing-90: 12cqw;
  --mk--spacing-100: 13.333cqw;
  --spacing--use--outside: var(--chg--spacing-xl);
}

:root {
  --leading-trim: calc((1em - 1lh) / 2);
  --leading-trim-en: calc((1cap - 1lh) / 2);
}

:root {
  --font-weight-medium: 400;
  --font-weight-bold: 700;
  --font-family-default:
    "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Helvetica Neue", Arial, "Hiragino Sans",
    "BIZ UDPGothic", Meiryo, sans-serif;
  --font-family-main: var(--font-family-default);
  --font-family-sub: dnp-shuei-mgothic-std, "Shuei MaruGo", var(--font-family-default);
}

:root {
  --radius: var(--spacing-2xs, 10px);
  --radius-s: calc(var(--radius) / 2);
  --radius-l: calc(var(--radius) * 2);
  --radius-xl: calc(var(--radius) * 3);
  --radius-oval: 100vmax;
}

:root {
  --bp--xs: 420;
  --bp--s: 640;
  --bp--m: 750;
}

html {
  scroll-behavior: smooth;
}

.mk-svg-area {
  position: absolute;
  inset-inline-start: -9999px;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.mk-outside-30 {
  margin-inline: var(--mk--spacing-30);
}

.mk-outside-50 {
  margin-inline: var(--mk--spacing-50);
}

.product_goods_wrap .cntBox2 {
  zoom: unset;
  -webkit-text-size-adjust: 100%;
}

.mk-container {
  width: min(100%, 750px);
  margin-inline: auto;
  font-family: var(--font-family-main);
  font-size: min(4vw, 30px);
  font-weight: var(--font-weight-medium);
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  color: var(--mk--color--base);
  line-height: var(--line-height);
  container-type: inline-size;
  overflow: clip;
}

.mk-container a {
  color: var(--mk--anchor--color, var(--mk--color--primary));
  text-decoration: none;
  cursor: pointer;
  transition: var(--duration);
}

.mk-container a.under {
  text-decoration: underline;
}

.mk-container sup {
  font-size: 0.5em;
  vertical-align: super;
}

.mk-container p {
  font-size: inherit;
  line-height: inherit;
}

.mk-u-base {
  color: var(--mk--color--base);
}

.mk-u-primary {
  color: var(--mk--color--primary);
}

.mk-u-fs-20 {
  font-size: 2.667cqw !important;
}

.mk-u-fs-28 {
  font-size: 3.733cqw !important;
}

.mk-u-fs-30 {
  font-size: 4cqw !important;
}

.mk-u-fs-36 {
  font-size: 4.8cqw !important;
}

.mk-u-fs-40 {
  font-size: 5.33cqw !important;
}

.mk-u-fs-50 {
  font-size: 6.67cqw !important;
}

.mk-u-fs-60 {
  font-size: 8cqw !important;
}

.mk-u-fs-70 {
  font-size: 9.33cqw !important;
}

.mk-u-fs-80 {
  font-size: 10.67cqw !important;
}

.mk-fs-small {
  font-size: 0.9em;
}

.mk-u-medium {
  font-weight: var(--font-weight-medium);
}

.mk-u-bold {
  font-weight: var(--font-weight-bold) !important;
}

.mk-u-mt-10 {
  margin-top: var(--mk--spacing-10) !important;
}

.mk-u-mt-15 {
  margin-top: 2cqw !important;
}

.mk-u-mt-20 {
  margin-top: var(--mk--spacing-20) !important;
}

.mk-u-mt-30 {
  margin-top: var(--mk--spacing-30) !important;
}

.mk-u-mt-40 {
  margin-top: var(--mk--spacing-40) !important;
}

.mk-u-mt-50 {
  margin-top: var(--mk--spacing-50) !important;
}

.mk-u-mt-60 {
  margin-top: var(--mk--spacing-60) !important;
}

.mk-u-mt-70 {
  margin-top: var(--mk--spacing-70) !important;
}

.mk-u-mt-80 {
  margin-top: var(--mk--spacing-80) !important;
}

.mk-u-mt-90 {
  margin-top: var(--mk--spacing-90) !important;
}

.mk-u-mt-100 {
  margin-top: var(--mk--spacing-100) !important;
}

.mk-u-center {
  text-align: center;
}

.mk-u-left {
  text-align: left;
}

.mk-u-right {
  text-align: right;
}

.mk-u-visually-hidden {
  position: fixed !important;
  inset: 0 !important;
  inline-size: 4px !important;
  block-size: 4px !important;
  padding: unset !important;
  margin: unset !important;
  pointer-events: none !important;
  visibility: initial !important;
  border: none !important;
  opacity: 0 !important;
  contain: strict !important;
}

.mk-font-sub {
  font-family: var(--font-family-sub);
  font-weight: var(--font-sub--weight, var(--font-weight-medium));
}

.mk-u-note-list .mk-u-note-list__item {
  font-size: 2.67cqw;
  padding-left: 1.8em;
  text-indent: -1.8em;
}

.mk-u-note-list.-indexed {
  counter-reset: mkNoteNumber;
}
.mk-u-note-list.-indexed .mk-u-note-list__item {
  padding-left: 2.4em;
  text-indent: 0;
  position: relative;
}
.mk-u-note-list.-indexed .mk-u-note-list__item::before {
  content: "※" counter(mkNoteNumber) " ";
  counter-increment: mkNoteNumber;
  position: absolute;
  left: 0;
}

.mk-u-note-list.-marked .mk-u-note-list__item {
  padding-left: 1.8em;
  text-indent: 0;
  position: relative;
}
.mk-u-note-list.-marked .mk-u-note-list__item::before {
  content: "※ ";
  position: absolute;
  left: 0;
}

.cntBox2 h4 {
  margin: 0;
  padding-top: 0;
  font-size: inherit;
}

.mk-fv .mk-fv__container {
  background-image: url(/img/items/mk_474acne-spots/fv_bg.png);
  background-position: 50% 0;
  background-size: contain;
  background-repeat: no-repeat;
  aspect-ratio: 750/1100;
  position: relative;
}
.mk-fv .mk-fv__intro {
  font-size: 6.4cqw;
  color: var(--mk--color--primary);
  padding-block-start: 6.67cqw;
  letter-spacing: 0.1em;
  font-weight: 900;
  line-height: 1.417;
}
.mk-fv .mk-fv__intro > span {
  font-size: 4.667cqw;
  color: var(--mk--color--white);
  background-color: var(--mk--color--primary);
  padding-inline: 1.6cqw;
}
.mk-fv .mk-fv__catch {
  font-size: 9.87cqw;
  font-weight: var(--font-weight-bold);
  margin-top: 0cqw;
  letter-spacing: 0.05em;
  color: var(--mk--color--primary);
  line-height: 1.351;
}
.mk-fv .mk-fv__title {
  text-align: center;
  font-size: 2.67cqw;
  font-weight: var(--font-weight-bold) !important;
  margin-block-start: 58.67cqw;
  padding-inline-start: 6.667cqw;
  width: 54.67cqw;
  box-sizing: content-box;
}
.mk-fv .mk-fv__title > span {
  font-size: 3.2cqw;
}
.mk-fv .mk-fv-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.33cqw;
  margin-block-start: 1.33cqw;
  font-size: 3.47cqw;
  line-height: 1.3333333333;
}
.mk-fv .mk-fv-list__item {
  width: 29.73cqw;
  aspect-ratio: 223/220;
  position: relative;
  z-index: 1;
  color: var(--mk--color--primary);
  display: flex;
  align-items: center;
  justify-content: center;
}
.mk-fv .mk-fv-list__item:before {
  content: "";
  position: absolute;
  width: 29.73cqw;
  aspect-ratio: 223/220;
  background-image: url(/img/items/mk_474acne-spots/fv_circle.png);
  background-size: contain;
  background-position: 0 0;
  background-repeat: no-repeat;
  z-index: -1;
}
.mk-fv .mk-fv-list__text {
  text-align: center;
  font-weight: bold;
}
.mk-fv .mk-fv__note {
  font-size: 2.67cqw;
  width: 88cqw;
  margin-inline: auto;
  margin-block-start: 5.07cqw;
  letter-spacing: 0.033em;
  line-height: 1.2;
}
.mk-fv .mk-fv__banner {
  width: 92cqw;
  margin-inline: auto;
  margin-block-start: 6.67cqw;
}

.mk-heading-1 {
  font-size: 7.47cqw;
  font-family: var(--font-family-sub);
  text-align: center;
  line-height: 1.25;
  background-color: var(--mk--color--primary);
  color: var(--mk--color--white);
  padding-block-end: 6.667cqw;
  padding-block-start: 5.333cqw;
  margin-block: 0 5.333cqw;
  clip-path: polygon(100% 0, 100% 75.9036144578%, 50% 100%, 0 75.9036144578%, 0 0);
  font-weight: var(--font-weight-bold);
}

.mk-heading-2 {
  font-family: var(--font-family-sub);
  text-align: center;
  line-height: 1.4583333333;
  position: relative;
  background: url("/img/items/mk_474acne-spots/heading-2_bg.png") center bottom/cover no-repeat;
  color: var(--mk--color--primary);
  margin-block-end: 8cqw;
  margin-block-start: 10.667cqw;
  min-height: 26.67cqw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mk-heading-2__point {
  font-size: 3.733cqw;
}

.mk-heading-2__text {
  font-size: 6.4cqw !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.3;
}

.mk-heading-2__text > span {
  font-size: 0.8em;
  display: inline-block;
  color: var(--mk--color--base);
}

.mk-heading-2__arrow {
  position: absolute;
  width: 21.333cqw;
  height: 5.333cqw;
  inset-block-start: calc(100% - 1px);
  inset-inline-start: 50%;
  translate: -50% 0;
  fill: var(--mk--color--primary-pale);
}

.mk-heading-2:has(+ .mk-b-p2) {
  --mk--heading-2--margin-bottom: 6.667cqw;
}

.mk-point {
  counter-reset: headingPointer;
}

.mk-point__number {
  border-radius: var(--radius-oval);
  background-color: var(--mk--color--primary);
  color: var(--mk--color--white);
  font-size: 3.733cqw;
  position: absolute;
  inset-block-end: 100%;
  inset-inline-start: 50%;
  translate: -50% 50%;
  display: flex;
  align-items: center;
  height: 5.333cqw;
  gap: 0.333em;
  margin-inline: auto;
  padding-inline: 5.333cqw;
}

.mk-point__number:before {
  content: "POINT";
}

.mk-point__number:after {
  content: counter(headingPointer);
  counter-increment: headingPointer;
}

.mk-figure {
  --mk--figure--border-width: clamp(3px, 0.938vw, 6px);
  font-size: 5.067cqw;
  text-align: center;
}

.mk-figure__caption {
  border-radius: 4.8cqw 4.8cqw 0 0;
  background-color: var(--mk--color--accent-3);
  line-height: 1.5;
  padding-block: 4cqw;
  font-family: var(--font-family-sub);
  font-weight: var(--font-weight-bold);
  font-size: 5.33cqw;
}
.mk-figure__caption b {
  font-size: 1.2em;
  color: var(--mk--color--primary);
}

.mk-figure__container {
  background-color: var(--mk--base--white);
  border: var(--mk--figure--border-width) solid var(--mk--color--accent-3);
  border-block-start-width: 0;
  padding-block: 4cqw;
  border-radius: 0 0 4.8cqw 4.8cqw;
  color: var(--mk--color--primary);
  font-size: 5.33cqw;
  line-height: 1.4;
}

.mk-figure__container > span {
  font-size: 0.8em;
}

.mk-circles {
  width: 77.867cqw;
  display: block;
  margin-inline: auto;
}

.mk-footnote {
  font-size: 2.667cqw !important;
  line-height: 1.5 !important;
}

.mk-marker {
  text-decoration-line: underline;
  text-decoration-thickness: var(--mk--marker--thickness, 0.25em);
  text-decoration-color: var(--mk--marker--color, var(--mk--color--primary-pale));
  text-underline-offset: -0.05em;
  text-decoration-skip-ink: none;
}

.mk-plusminus {
  position: relative;
  flex-shrink: 0;
  width: var(--c--plusminus--size, 4cqw);
  aspect-ratio: var(--c--plusminus--ratio, 1);
  margin-inline: auto 0;
}

.mk-plusminus:before,
.mk-plusminus:after {
  position: absolute;
  inset: 0;
  width: var(--c--plusminus--width, 1em);
  height: var(--c--plusminus--height, 0.533cqw);
  margin: auto;
  content: "";
  background-color: var(--mk--color--base-strong);
  transition: transform 0.4s;
}

.mk-plusminus:before {
  transform: rotate(0);
}

.mk-plusminus:after {
  transform: rotate(90deg);
}

.is-open .mk-plusminus:after {
  transform: rotate(180deg);
}

.mk-nav {
  --mk--anchor--color: var(--mk--color--base);
  --mk--nav--padding: 4cqw;
  --mk--nav--border-width: clamp(1px, 0.469vw, 3px);
  font-size: 5.333cqw;
  line-height: 1.4;
  width: 75.733cqw;
  border: var(--mk--nav--border-width) solid var(--mk--color--primary);
  border-radius: 0.333cm;
  padding: var(--mk--nav--padding);
  margin-inline: auto;
  margin-block-start: 16.67cqw;
  margin-block-end: 13.333cqw;
  position: relative;
}

.mk-nav__label {
  line-height: 1;
  position: absolute;
  inset-block-end: 100%;
  inset-inline-start: 50%;
  translate: -50% 50%;
  background-color: var(--mk--color--white);
  padding-inline: 0.5em;
  font-weight: bold;
  letter-spacing: 0.12em;
}

.mk-nav__list {
  background-color: var(--mk--color--white);
  margin-inline: calc((var(--mk--nav--padding) + var(--mk--nav--border-width)) * -1);
  padding-inline: var(--mk--nav--padding);
}

.mk-nav__item {
  font-size: 5.73cqw;
}
.mk-nav__item.-mk {
  font-size: 5.47cqw;
  letter-spacing: -0.02em;
}

.mk-nav__item:not(:last-child) {
  border-block-end: var(--mk--nav--border-width) dotted var(--mk--color--primary);
}

.mk-nav__anchor {
  padding-block: var(--mk--nav--padding);
  padding-inline: 2.53cqw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
}

.mk-nav__arrow {
  width: 4cqw;
  height: 2.667cqw;
  fill: var(--mk--color--primary);
}

.mk-howto {
  padding-bottom: 11.33cqw;
}
.mk-howto .mk-howto__item {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin-left: 7.33cqw;
  margin-right: 4cqw;
  gap: 1.33cqw;
}
.mk-howto .mk-howto__item.-step1 .mk-howto__image-wrapper {
  margin-top: 4.93cqw;
}
.mk-howto .mk-howto__item.-step2 .mk-howto__image-wrapper {
  margin-top: 2.4cqw;
}
.mk-howto .mk-howto__content {
  flex: 1;
}
.mk-howto .mk-howto__image-wrapper {
  width: 40cqw;
}
.mk-howto .mk-howto__image-wrapper .mk-howto__image {
  width: 40cqw;
}
.mk-howto .mk-howto__title {
  font-family: var(--font-family-sub);
  font-size: 4cqw;
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
  margin: 0;
  padding: 0;
  margin-block-end: 2.667cqw;
  margin-bottom: 2.67cqw;
}
.mk-howto .mk-howto__title span {
  font-size: 5.33cqw;
  color: var(--mk--color--accent-12);
  display: inline-block;
}
.mk-howto .mk-howto__title::after {
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  background-color: var(--mk--color--base-strong);
  margin-top: 0.93cqw;
}

.mk-qa {
  padding-bottom: 8.67cqw;
}

.mk-qa__container {
  overflow: hidden;
}

.mk-qa__container + .mk-qa__container {
  margin-top: 4cqw;
}

.mk-qa__title {
  font-size: 4cqw;
  line-height: 1.4666666667;
  display: flex;
  align-items: center;
  gap: 2.667cqw;
  padding: 5.33cqw 0;
  cursor: pointer;
  position: relative;
}
.mk-qa__title::after {
  content: "";
  display: block;
  height: 0.27cqw;
  width: 100%;
  background: url("/img/items/mk_474acne-spots/qa_line.png") repeat-x left top/1.6cqw 0.27cqw;
  position: absolute;
  bottom: 0;
  left: 0;
}

.mk-qa__title:before {
  content: "Q";
  font-family: var(--font-family-sub);
  color: var(--mk--color--white);
  border-radius: 50%;
  background-color: var(--mk--color--primary);
  font-size: 4.8cqw;
  width: 8cqw;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  aspect-ratio: 1;
}

.mk-qa__wrapper {
  font-size: 3.733cqw;
  height: 0;
  overflow: hidden;
  transition: height 0.4s ease-in-out;
}

.mk-qa__content {
  margin-top: 5.33cqw;
  padding: 4cqw;
  background-color: var(--mk--color--accent-6);
}
.mk-qa__content::before {
  content: "A.";
  color: var(--mk--color--primary);
}

.mk-container .mk-skin-features {
  background-color: var(--mk--color--accent-4);
}
.mk-container .mk-heading-1 {
  position: relative;
  z-index: 2;
}
.mk-container .skin-troubles {
  border: 1px solid var(--mk--color--primary);
  background-color: var(--mk--color--white);
  margin-top: -10.67cqw;
  padding: 13.33cqw 4cqw 4cqw 4cqw;
}
.mk-container .mk-skin-troubles__item {
  position: relative;
}
.mk-container .mk-skin-troubles__item:not(:first-child) {
  margin-top: 2cqw;
}
.mk-container .mk-skin-troubles__item-title {
  color: var(--mk--color--primary);
  border-left: 14px solid var(--mk--color--accent-7);
  background-color: var(--mk--color--accent-5);
  padding: 6.67cqw 0 6.67cqw 1.87cqw;
  line-height: 1.25;
  font-weight: var(--font-weight-bold);
}
.mk-container .mk-skin-troubles__item-text {
  padding: 2.67cqw 0 5.33cqw 4cqw;
  line-height: 1.6;
  font-weight: var(--font-weight-bold);
}
.mk-container .mk-skin-troubles__item-text:has(+ .mk-skin-troubles__item-image) {
  padding-right: 40cqw;
}
.mk-container .mk-skin-troubles__item-image {
  position: absolute;
  right: -8cqw;
  top: -2.67cqw;
  z-index: 2;
  width: 45.33cqw;
}
.mk-container .mk-skin-troubles__topics {
  background-color: #f0faff;
  padding: 5.33cqw 0 8cqw;
}
.mk-container .mk-skin-troubles__topic-title {
  line-height: 1.2;
  font-size: 6.4cqw;
  color: var(--mk--color--primary);
  text-align: center;
  margin-bottom: 5.33cqw;
}
.mk-container .mk-skin-troubles__topic-title.-bg {
  margin-bottom: 8cqw;
  position: relative;
}
.mk-container .mk-skin-troubles__topic-title.-bg > * {
  position: relative;
}
.mk-container .mk-skin-troubles__topic-title.-bg::before {
  content: "";
  display: block;
  background: url(/img/items/mk_474acne-spots/troubles_topic-title_bg.png) no-repeat center/contain;
  width: 63.33cqw;
  height: 11.2cqw;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -1.33cqw;
}
.mk-container .mk-skin-troubles__step:not(:first-child) {
  margin-top: 6.67cqw;
}
.mk-container .mk-skin-troubles__step-title {
  margin-bottom: 4cqw;
  display: flex;
  align-items: flex-start;
  gap: 2.67cqw;
  border-top: 0.27cqw solid var(--mk--color--primary);
}
.mk-container .mk-skin-troubles__step-title .mk-skin-troubles__step-badge {
  display: block;
  width: 11.73cqw;
  margin-top: -0.27cqw;
}
.mk-container .mk-skin-troubles__step-title .mk-skin-troubles__step-label {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 5.07cqw;
  padding: 1.07cqw 0;
  border-bottom: 0.27cqw solid var(--mk--color--primary);
}
.mk-container .mk-skin-troubles__step-content {
  display: flex;
  gap: 4cqw;
}
.mk-container .mk-skin-troubles__step-content .mk-skin-troubles__step-figure {
  width: 33.33cqw;
}
.mk-container .mk-skin-troubles__step-content .mk-skin-troubles__step-text {
  flex: 1;
  font-size: 3.73cqw;
  letter-spacing: 0.01em;
  line-height: 1.6;
}
.mk-container .mk-skin-troubles__topic.-second {
  position: relative;
  margin-top: 9.33cqw;
  padding: 9.33cqw 0 10.67cqw;
  background: url(/img/items/mk_474acne-spots/troubles_topic_bg.png) no-repeat center/auto 100%;
}
.mk-container .mk-skin-troubles__topic.-second::before, .mk-container .mk-skin-troubles__topic.-second::after {
  content: "";
  display: block;
  position: absolute;
  width: 14cqw;
  height: 14cqw;
}
.mk-container .mk-skin-troubles__topic.-second::before {
  background: url(/img/items/mk_474acne-spots/skin-troubles_bg_1.png) no-repeat center/contain;
  top: 4cqw;
  left: 4cqw;
}
.mk-container .mk-skin-troubles__topic.-second::after {
  background: url(/img/items/mk_474acne-spots/skin-troubles_bg_2.png) no-repeat center/contain;
  bottom: 0cqw;
  right: 4cqw;
}
.mk-container .mk-skin-troubles__topic-body {
  display: flex;
  gap: 5.33cqw;
}
.mk-container .mk-skin-troubles__topic-body .mk-skin-troubles__topic-image {
  width: 36.67cqw;
  display: block;
}
.mk-container .mk-skin-troubles__topic-body .mk-skin-troubles__topic-text {
  flex: 1;
  font-size: 3.73cqw;
  letter-spacing: 0.07em;
}
.mk-container .skin-solution {
  margin-top: 11.33cqw;
  border-top: 1px solid var(--mk--color--primary);
  background-color: var(--mk--color--accent-5);
  padding: 10.67cqw 4cqw 13.33cqw;
  position: relative;
}
.mk-container .skin-solution::before {
  content: "";
  background-image: url("/img/items/mk_474acne-spots/skin-troubles_arrow.png");
  background-size: contain;
  width: 10.67cqw;
  height: 7.07cqw;
  position: absolute;
  left: 0;
  right: 0;
  top: -4.4cqw;
  margin-inline: auto;
  z-index: 2;
}
.mk-container .skin-solution__title {
  text-align: center;
}
.mk-container .skin-solution__title .title-lead {
  font-size: 4cqw;
  position: relative;
}
.mk-container .skin-solution__title .title-lead::after {
  content: "";
  display: block;
  background: url(/img/items/mk_474acne-spots/solution_title_bg.png) no-repeat center/contain;
  width: 75.87cqw;
  height: 5.87cqw;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.mk-container .skin-solution__title .title-main {
  display: flex;
  gap: 5.33cqw;
  margin-top: 6.67cqw;
  padding-left: 5.33cqw;
}
.mk-container .skin-solution__title .title-main .title-image {
  width: 29.07cqw;
}
.mk-container .skin-solution__title .title-main span {
  text-align: left;
  flex: 1;
  font-size: 5.6cqw;
}
.mk-container .skin-solution__title .title-main span b {
  line-height: 1.16;
  font-size: 8.27cqw;
  color: var(--mk--color--primary);
}
.mk-container .skin-solution__text {
  margin: 8cqw 0 1.87cqw;
  text-align: center;
  font-size: 4cqw;
}
.mk-container .skin-solution__text .text-em {
  font-size: 5.33cqw;
}
.mk-container .skin-solution__text .text-em span {
  font-size: 0.7em;
}
.mk-container .skin-solution__text .text-em.mk-marker {
  text-decoration-color: #eedde0;
  text-decoration-thickness: 2.13cqw;
  text-underline-offset: -1.07cqw;
}
.mk-container .skin-solution__banner-wrapper {
  margin-top: 17.33cqw;
}
.mk-container .skin-solution__banner {
  position: relative;
  display: inline-block;
  width: 89.33cqw;
  margin-inline: auto;
  display: block;
}
.mk-container .skin-solution__banner-text {
  position: absolute;
  line-height: 1;
  left: 0;
  top: -8cqw;
  width: 100%;
  text-align: center;
  color: var(--mk--color--base-strong);
  font-size: 4.93cqw;
}
.mk-container .skin-solution__banner-text b {
  color: var(--mk--color--primary);
  position: relative;
}
.mk-container .skin-solution__banner-text b * {
  position: relative;
}
.mk-container .skin-solution__banner-text::after {
  content: "";
  background-image: url("/img/items/mk_474acne-spots/base_bnr_fukidashi.png");
  background-size: contain;
  background-repeat: no-repeat;
  width: 89.6cqw;
  height: 5.33cqw;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.mk-b-feature-apibox {
  width: 41.33cqw;
  aspect-ratio: 1;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--mk--color--accent-12);
  text-align: center;
  line-height: 1.4;
  font-weight: var(--font-weight-bold);
}
.mk-b-feature-apibox::after {
  content: "";
  background: url("/img/items/mk_474acne-spots/features_bg_circle.png") center center/contain no-repeat;
  width: 59.33cqw;
  aspect-ratio: 1;
  position: absolute;
  inset: 0;
  z-index: -1;
  top: -8.27cqw;
  left: -8cqw;
  display: block;
}

.mk-point {
  padding-bottom: 11.33cqw;
}
.mk-point .mk-figure-2 .mk-figure-2__caption {
  text-align: center;
  color: var(--mk--color--accent-12);
  font-size: 2.93cqw;
  margin-top: 0.67cqw;
  font-weight: var(--font-weight-bold);
}
.mk-point p.mk-u-fs-28 b {
  color: var(--mk--color--primary);
}

.mk-b-feature-col2 {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 4cqw;
}

.mk-b-feature-col3 {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 1.33cqw;
}

.mk-b-feature-col3__item .mk-b-feature-apibox {
  width: 28cqw;
  aspect-ratio: 1;
  font-size: 3.2cqw;
}
.mk-b-feature-col3__item .mk-b-feature-apibox::after {
  width: 40.93cqw;
  top: -5.6cqw;
  left: -5.33cqw;
}

.mk-b-p1__image {
  display: block;
  margin-inline: auto;
  width: 44.4cqw;
  aspect-ratio: 1;
}

.mk-b-p1__content {
  display: flex;
  gap: 9.33cqw;
}
.mk-b-p1__content .mk-figure-2 {
  width: 28cqw;
}
.mk-b-p1__content .mk-b-p1__text {
  flex: 1;
}

.mk-b-p2-step {
  position: relative;
}
.mk-b-p2-step:not(:last-of-type) {
  margin-bottom: 16cqw;
}
.mk-b-p2-step:not(:last-of-type)::after {
  content: "";
  width: 15.47cqw;
  height: 5.33cqw;
  border-top: 5.33cqw solid var(--mk--color--accent-11);
  border-right: 7.73cqw solid transparent;
  border-left: 7.73cqw solid transparent;
  position: absolute;
  bottom: -11.2cqw;
  left: calc(50% - 7.73cqw);
}

.mk-b-p4 .mk-b-p4__image {
  display: block;
  margin-inline: auto;
  width: 81.467cqw;
}
.mk-b-p4 .mk-u-note-list .mk-u-note-list__item {
  letter-spacing: 0.02em;
}

.mk-b-p5 .mk-u-note-list__item {
  letter-spacing: 0.01em;
}

.mk-b-p6 .mk-b-p6-list {
  display: flex;
  flex-direction: column;
  gap: 4.67cqw;
}
.mk-b-p6 .mk-b-p6-list__item {
  background-color: var(--mk--color--accent-6);
  font-size: 4.8cqw;
  padding: 2.67cqw 2.67cqw;
  border-radius: 6.67cqw;
  line-height: 1.5;
  color: var(--mk--color--primary);
  text-align: center;
  font-weight: var(--font-weight-bold);
}

.mk-shiny-design {
  background-color: var(--mk--color--accent-5);
  padding-bottom: 13.33cqw;
}
.mk-shiny-design .mk-heading-1 {
  padding-block-start: 4cqw; /* padding-top 相当 */
  padding-block-end: 9.33cqw; /* padding-bottom 相当 */
  margin-bottom: 1.07cqw;
}
.mk-shiny-design .mk-shiny-design__text {
  letter-spacing: 0em;
  line-height: 2.05;
  background: url("/img/items/mk_474acne-spots/shiny-design_line.png") no-repeat top center/contain;
}
.mk-shiny-design .mk-shiny-design__text.-first {
  background-position: bottom center;
}
.mk-shiny-design .skin-solution__banner-wrapper {
  margin-top: 8cqw;
}
