@charset "UTF-8";
/* -----------------------------------------------------------------------
## Color ##################################################
----------------------------------------------------------------------- */
:root {
  --color-black-300: #222222;
  --color-black-400: #666666;
  --color-black-500: #999999;
  --color-black-600: #cccccc;
  --color-black-700: #eeeeee;
  --color-black-800: #f8f8f8;
  --color-black-900: #ffffff;
  --color-purple01: #907cc7;
  --color-purple02: #d69fc7;
  --color-purple03: #fcf7ff;
  --color-yellow01: #ffeb7c;
  --color-yellow02: #fefedf;
  --color-blue01: #00a0e9;
  --color-blue02: #5cb1b9;
  --color-blue03: #65a4dc;
  --color-blue04: #f7feff;
  --color-green01: #00b900;
  --color-orange01: #ED6D00;
  --color-font-default: var(--color-black-300);
  --color-font-accent: var(--color-purple01);
}

/* -----------------------------------------------------------------------
## Spacing ##################################################
----------------------------------------------------------------------- */
:root {
  --space-xxs: 4px;
  --space-xs: 8px;
  --space-sm: 16px;
  --space-base: min(0.8839779006vw + 12.6850828729px, 24px);
  --space-md: min(0.8839779006vw + 20.6850828729px, 32px);
  --space-lg: min(0.8839779006vw + 28.6850828729px, 40px);
  --space-xl: min(2.6519337017vw + 30.0552486188px, 64px);
  --space-2xl: min(1.7679558011vw + 57.3701657459px, 80px);
  --space-3xl: min(6.1878453039vw + 40.7955801105px, 120px);
}

/* -----------------------------------------------------------------------
## Font Family ##################################################
----------------------------------------------------------------------- */
:root {
  --ff-zen: "Zen Kaku Gothic New", "Noto Sans JP", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "游ゴシック", "Yu Gothic", "YuGothic", メイリオ, Meiryo, "ＭＳ Ｐゴシック", Arial, sans-serif;
}

/* -----------------------------------------------------------------------
## Font Size ##################################################
----------------------------------------------------------------------- */
:root {
  --fz-heading-xs: min(0.4419889503vw + 10.3425414365px, 16px);
  --fz-heading-sm: min(0.6629834254vw + 11.5138121547px, 20px);
  --fz-heading-md: min(0.8839779006vw + 12.6850828729px, 24px);
  --fz-heading-lg: min(0.8839779006vw + 16.6850828729px, 28px);
  --fz-heading-xl: min(1.7679558011vw + 17.3701657459px, 40px);
  --fz-heading-lg-zen: min(0.8839779006vw + 16.6850828729px, 28px);
  --fz-heading-xl-zen: min(1.7679558011vw + 17.3701657459px, 40px);
  --fz-heading-sm-english: min(0.6629834254vw + 11.5138121547px, 20px);
  --fz-heading-xl-english: min(2.6519337017vw + 14.0552486188px, 48px);
  --fz-body-xs: min(0.2209944751vw + 9.1712707182px, 12px);
  --fz-body-sm: min(0.2209944751vw + 11.1712707182px, 14px);
  --fz-body-md: min(0.2209944751vw + 13.1712707182px, 16px);
  --fz-body-lg: min(0.2209944751vw + 15.1712707182px, 18px);
  --fz-title-lg: min(3.0939226519vw + 16.3977900552px, 56px);
  --fz-title-lg-english: min(4.4198895028vw + 23.4254143646px, 80px);
  --fz-title-lg-zen: min(3.0939226519vw + 16.3977900552px, 56px);
  --fz-title-xl-zen: min(3.3149171271vw + 21.5690607735px, 64px);
  --fz-label-xs: min(0.2209944751vw + 9.1712707182px, 12px);
  --fz-label-sm: min(0.2209944751vw + 11.1712707182px, 14px);
  --fz-label-md: min(0.2209944751vw + 13.1712707182px, 16px);
}

/* -----------------------------------------------------------------------
## Line Height ##################################################
----------------------------------------------------------------------- */
:root {
  --lh-heading-xs: 1.66;
  --lh-heading-sm: 1.72;
  --lh-heading-md: 1.75;
  --lh-heading-lg: 1.6;
  --lh-heading-xl: 1.66;
  --lh-heading-lg-zen: 1.6;
  --lh-heading-xl-zen: 1.66;
  --lh-heading-sm-english: 1;
  --lh-heading-xl-english: 1.66;
  --lh-body-xs: 1.6;
  --lh-body-sm: 1.66;
  --lh-body-md: 1.72;
  --lh-body-lg: 1.75;
  --lh-body-lg-lead: 2;
  --lh-title-lg: 1.57;
  --lh-title-lg-english: 1.5;
  --lh-title-lg-zen: 1.57;
  --lh-title-xl-zen: 1.53;
  --lh-label-xs: 1.6;
  --lh-label-sm: 1.6;
  --lh-label-md: 1.5;
}
@media screen and (width >= 769px) {
  :root {
    --lh-heading-xs: 1.75;
    --lh-heading-sm: 1.6;
    --lh-heading-md: 1.66;
    --lh-heading-lg: 1.57;
    --lh-heading-xl: 1.5;
    --lh-heading-lg-zen: 1.57;
    --lh-heading-xl-zen: 1.5;
    --lh-heading-sm-english: 0.7;
    --lh-heading-xl-english: 1.5;
    --lh-body-sm: 1.72;
    --lh-body-md: 1.75;
    --lh-body-lg: 1.55;
    --lh-body-lg-lead: 1.77;
    --lh-title-lg: 1.5;
    --lh-title-lg-zen: 1.5;
    --lh-title-xl-zen: 1.5;
    --lh-label-sm: 2;
  }
}

/* -----------------------------------------------------------------------
## Width ##################################################
----------------------------------------------------------------------- */
:root {
  --w-default: 960px;
  --w-box: min(22.0994475138vw + 117.1270718232px, 400px);
  --w-icon: min(1.7679558011vw + 17.3701657459px, 40px);
}

/* -----------------------------------------------------------------------
## Padding ##################################################
----------------------------------------------------------------------- */
:root {
  --px-content: calc(24 / 375 * 100%);
}

/* -----------------------------------------------------------------------
## Border Radius ##################################################
----------------------------------------------------------------------- */
:root {
  --infinity: calc(1px / 0);
}

/* -----------------------------------------------------------------------
## Shadow ##################################################
----------------------------------------------------------------------- */
:root {
  --shadow-default: 10px 20px 20px 0 rgba(217, 217, 217, 0.20);
  --shadow-hover: 0 0 0 0 rgba(217, 217, 217, 0.2);
}

/* -----------------------------------------------------------------------
## Header Height ##################################################
----------------------------------------------------------------------- */
:root {
  --header-height: 56px;
}
@media screen and (width >= 769px) {
  :root {
    --header-height: 74px;
  }
}

/* -----------------------------------------------------------------------
## Z-Index ##################################################
----------------------------------------------------------------------- */
:root {
  --z-index-header: 200;
  --z-index-globalNavi: 100;
  --z-index-globalNaviOverlay: 90;
}

/* -----------------------------------------------------------------------
## Opacity ##################################################
----------------------------------------------------------------------- */
:root {
  --opacity-hover: 0.75;
}

/* -----------------------------------------------------------------------
## Animation ##################################################
----------------------------------------------------------------------- */
:root {
  --animation-color: color 0.2s 0s linear;
  --animation-background-color: background-color 0.2s 0s linear;
  --animation-border-color: border-color 0.2s 0s linear;
  --animation-opacity: opacity 0.2s 0s linear;
  --animation-transform: transform 0.2s 0s linear;
}

/* -----------------------------------------------------------------------
## Reset ##################################################
----------------------------------------------------------------------- */
body h1, body h2, body h3, body h4, body h5, body h6, body p, body figure {
  margin: 0;
}
body ul, body ol, body dl {
  margin: 0;
  padding: 0;
}
body li {
  list-style: none;
}
body img {
  display: block;
  max-width: 100%;
  height: auto;
}
body picture {
  display: block;
}
body figure {
  display: block;
}
body a {
  text-decoration: none;
  color: var(--color-font-default);
}
@media (hover: hover) and (pointer: fine) {
  body a:hover {
    text-decoration: underline;
    color: var(--color-purple01);
  }
}
body a.is-underline {
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  body a.is-underline:hover {
    text-decoration: none;
  }
}
body [id] {
  scroll-margin-top: var(--header-height);
}
body svg {
  display: block;
  width: auto;
}
body small {
  font-size: inherit;
}
body button {
  color: inherit;
  padding: 0;
  -webkit-appearance: none;
  border: none;
  background-color: transparent;
  cursor: pointer;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "游ゴシック", "Yu Gothic", "YuGothic", メイリオ, Meiryo, "ＭＳ Ｐゴシック", Arial, sans-serif;
}

:root:has(.c-movieModal.is-open) {
  overflow: hidden;
  scrollbar-gutter: stable;
}

html,
body,
.editor-styles-wrapper {
  background-color: #fff;
  padding: 0;
  margin: 0;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "游ゴシック", "Yu Gothic", "YuGothic", メイリオ, Meiryo, "ＭＳ Ｐゴシック", Arial, sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* -----------------------------------------------------------------------
## Animation ##################################################
----------------------------------------------------------------------- */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
/* -----------------------------------------------------------------------
## Header ##################################################
----------------------------------------------------------------------- */
.l-header {
  position: sticky;
  top: 0;
  left: 0;
  z-index: var(--z-index-header);
  padding: 8px 56px 8px 8px;
  border-bottom: 2px solid var(--color-purple01);
  background-color: var(--color-black-900);
  height: var(--header-height);
}
@media screen and (width > 768px) and (width <= 1280px) {
  .l-header {
    padding-inline: min(1.3888888889vw + 13.3333333333px, 40px) 80px;
  }
}
@media screen and (width > 1280px) {
  .l-header {
    padding-inline: min(1.3888888889vw + 13.3333333333px, 40px);
  }
}
.l-header__inner {
  display: flex;
  gap: 24px;
  align-items: center;
}
.l-header__logo {
  display: block;
  margin-inline: 0 auto;
  width: 80px;
  transition: var(--animation-opacity);
}
@media screen and (width >= 769px) {
  .l-header__logo {
    width: 140px;
  }
}
@media (hover: hover) and (pointer: fine) {
  .l-header__logo:hover {
    opacity: var(--opacity-hover);
  }
}

/* -----------------------------------------------------------------------
## Header Buttons ##################################################
----------------------------------------------------------------------- */
.l-headerButtons {
  display: flex;
  gap: var(--space-base);
}
@media screen and (width >= 769px) {
  .l-headerButtons {
    gap: min(1.6666666667vw + -8px, 24px);
  }
}
.l-headerButtons :where(a:not(.l-headerButtons__line)) {
  --text-color: var(--color-black-300);
  --bg-color: var(--color-black-300);
  --border-color: var(--color-black-300);
  display: grid;
  align-items: center;
  grid-template-columns: auto 15px;
  gap: 4px;
  padding: 6px 15px;
  border-radius: var(--infinity);
  font-size: var(--fz-label-md);
  font-weight: 700;
  line-height: 1;
  color: var(--text-color);
  background-color: var(--bg-color);
  border: 2px solid var(--border-color);
  transition: var(--animation-color), var(--animation-background-color);
}
@media screen and (width >= 769px) {
  .l-headerButtons :where(a:not(.l-headerButtons__line)) {
    padding: 14px var(--space-base);
    grid-template-columns: auto 24px;
    gap: 8px;
  }
}
@media (hover: hover) and (pointer: fine) {
  .l-headerButtons :where(a):hover {
    text-decoration: none;
    color: var(--bg-color);
    background-color: var(--text-color);
  }
}
.l-headerButtons__shop {
  --text-color: var(--color-orange01);
  --bg-color: var(--color-black-900);
  --border-color: var(--color-orange01);
}
@media screen and (width < 769px) {
  .l-headerButtons__shop {
    display: none;
  }
}
.l-headerButtons__purchase {
  --text-color: var(--color-black-900);
  --bg-color: var(--color-orange01);
  --border-color: var(--color-orange01);
}
.l-headerButtons__purchase svg {
  width: 15px;
}
.l-headerButtons__line {
  --text-color: var(--color-black-900);
  --bg-color: var(--color-green01);
  --border-color: var(--color-green01);
}
.l-headerButtons__line span {
  display: none;
  align-items: center;
  grid-template-columns: auto;
  gap: 8px;
  padding: 14px var(--space-base);
  border-radius: var(--infinity);
  font-size: var(--fz-label-md);
  font-weight: 700;
  line-height: var(--lh-label-md);
  color: var(--text-color);
  background-color: var(--bg-color);
  border: 2px solid var(--border-color);
  transition: var(--animation-color), var(--animation-background-color);
}
@media screen and (width >= 769px) {
  .l-headerButtons__line span {
    display: grid;
  }
}
@media (hover: hover) and (pointer: fine) {
  .l-headerButtons__line span:hover {
    text-decoration: none;
    color: var(--bg-color);
    background-color: var(--text-color);
  }
}
.l-headerButtons__line img {
  display: block;
  width: 40px;
  height: auto;
}
@media screen and (width >= 769px) {
  .l-headerButtons__line img {
    display: none;
  }
}

/* -----------------------------------------------------------------------
## GlobalNavi ##################################################
----------------------------------------------------------------------- */
@media screen and (width <= 1280px) {
  .l-globalNavi {
    display: none;
  }
}

.l-globalNaviList {
  display: flex;
  align-items: center;
  gap: min(3.75vw + -32px, 40px);
}
.l-globalNaviList__link {
  display: flex;
  gap: 4px;
  align-items: center;
  font-size: var(--fz-label-md);
  font-weight: 700;
  line-height: var(--lh-label-md);
  text-align: center;
  transition: var(--animation-color);
}
@media (hover: hover) and (pointer: fine) {
  .l-globalNaviList__link:hover {
    color: var(--color-purple01);
    text-decoration: none;
  }
}
@media screen and (width > 1500px) {
  .l-globalNaviList__link br {
    display: none;
  }
}
.l-globalNaviList__link svg {
  position: relative;
  top: 2px;
  width: 24px;
  height: auto;
  color: var(--color-purple01);
}

.l-globalSubNavi {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  display: none;
  width: 100%;
  min-height: 386px;
  background-color: var(--color-purple03);
  padding: 70px;
}

.l-globalSubNaviList {
  display: grid;
  align-content: center;
  justify-content: center;
  grid-template-columns: repeat(auto-fit, 140px);
  gap: 64px;
}
.l-globalSubNaviList__item {
  display: contents;
}
.l-globalSubNaviList__item a {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  align-items: start;
  gap: 24px;
  transition: var(--animation-color);
}
@media (hover: hover) and (pointer: fine) {
  .l-globalSubNaviList__item a:hover {
    text-decoration: none;
  }
}
.l-globalSubNaviList__item img {
  width: 140px;
  filter: drop-shadow(10px 20px 20px rgba(217, 217, 217, 0.2));
  border: 3px solid transparent;
  border-radius: var(--infinity);
  transition: border-color 0.2s 0s linear, filter 0.2s 0s linear;
}
.l-globalSubNaviList__item img:is(a:hover *) {
  border-color: var(--color-purple01);
  filter: drop-shadow(0 0 0 rgba(217, 217, 217, 0));
}
.l-globalSubNaviList__item span {
  text-align: center;
  font-size: calc(16/16 * 1rem);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}

.l-globalNaviOverlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--z-index-globalNaviOverlay);
  display: none;
  width: 100%;
  height: 100dvh;
}

/* -----------------------------------------------------------------------
## Menu ##################################################
----------------------------------------------------------------------- */
.l-menu {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  display: none;
  width: 100%;
  height: calc(100dvh - var(--header-height));
  background-color: var(--color-purple03);
}
@media screen and (width >= 769px) {
  .l-menu {
    height: auto;
    min-height: 386px;
  }
}
.l-menu[aria-hidden=false] {
  display: block;
}
.l-menu__view {
  height: 100%;
  overflow-y: auto;
}
@media screen and (width >= 769px) {
  .l-menu__view {
    display: grid;
    justify-content: center;
    gap: 32px;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 32px;
    overflow-y: visible;
  }
}
.l-menu__category {
  position: relative;
}
.l-menu__category::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  margin-inline: auto;
  width: calc(343/375 * 100vw);
  height: 1px;
  background-color: var(--color-black-600);
}
@media screen and (width >= 769px) {
  .l-menu__category::after {
    display: none;
  }
}
.l-menu__button {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  text-align: left;
  gap: 8px;
  -webkit-appearance: none;
  background-color: transparent;
  border: none;
  width: 100%;
  padding: 16px 32px;
  cursor: pointer;
  font-size: var(--fz-label-md);
  font-weight: 700;
  line-height: var(--lh-label-md);
  transition: var(--animation-color);
}
@media screen and (width >= 769px) {
  .l-menu__button {
    pointer-events: none;
    padding-inline: 16px;
    font-size: min(1.5625vw + 4px, 24px);
    font-weight: 700;
    line-height: var(--lh-heading-md);
    border-bottom: 1px solid var(--color-black-600);
  }
}
.l-menu__button::after {
  content: "＋";
}
@media screen and (width >= 769px) {
  .l-menu__button::after {
    display: none;
  }
}
@media (hover: hover) and (pointer: fine) {
  .l-menu__button:hover {
    color: var(--color-purple01);
  }
}
.l-menu__button[aria-expanded=true]::after {
  content: "－";
}
.l-menu__button:is([data-category=nyoumore] *) {
  display: none;
}
@media screen and (width >= 769px) {
  .l-menu__button:is([data-category=nyoumore] *) {
    display: grid;
  }
}
.l-menu__close {
  padding-block: var(--space-xl);
}
.l-menu__closeButton {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  padding: 5px 10px 5px 15px;
  margin-inline: auto;
  background-color: var(--color-black-900);
  border: 1px solid var(--color-font-default);
  border-radius: var(--infinity);
  text-align: center;
  font-size: var(--fz-label-md);
  font-weight: 700;
  line-height: var(--lh-label-md);
  transition: var(--animation-color), var(--animation-background-color);
}
@media screen and (width >= 769px) {
  .l-menu__closeButton {
    display: none;
  }
}
@media (hover: hover) and (pointer: fine) {
  .l-menu__closeButton:hover {
    color: var(--color-black-900);
    background-color: var(--color-black-300);
  }
}
.l-menu__closeButton svg {
  width: 24px;
  height: auto;
}

.l-menuContents:not(:is([data-category=nyoumore] *)) {
  display: none;
  padding: 0 var(--space-sm) var(--space-sm);
}
@media screen and (width >= 769px) {
  .l-menuContents:not(:is([data-category=nyoumore] *)) {
    display: block;
    padding-inline: min(1.5625vw + -4px, 16px);
    padding-block-start: var(--space-sm);
  }
}
@media screen and (width >= 769px) {
  .l-menuContents:is([data-category=nyoumore] *) {
    display: block;
    padding-inline: min(1.5625vw + -4px, 16px);
    padding-block-start: var(--space-sm);
  }
}
.l-menuContents__inner:not(:is([data-category=nyoumore] *)) {
  display: grid;
  padding: 8px 0;
  background-color: var(--color-black-900);
  border-radius: 10px;
}
@media screen and (width >= 769px) {
  .l-menuContents__inner:not(:is([data-category=nyoumore] *)) {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    background-color: transparent;
  }
}
@media screen and (width >= 769px) {
  .l-menuContents__inner:is([data-category=nyoumore] *) {
    display: grid;
    padding: 8px 0;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    background-color: transparent;
  }
}
.l-menuContents__item:not(:is([data-category=nyoumore] *)) {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 8px 16px;
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
  transition: var(--animation-color);
}
@media screen and (width >= 769px) {
  .l-menuContents__item:not(:is([data-category=nyoumore] *)) {
    grid-template-columns: auto 1fr;
    padding-inline: 0;
    font-size: min(0.390625vw + 13px, 18px);
  }
}
@media screen and (width >= 769px) {
  .l-menuContents__item:is([data-category=nyoumore] *) {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px;
    padding: 8px 0;
    font-size: min(0.390625vw + 13px, 18px);
    background-color: transparent;
  }
}
@media (hover: hover) and (pointer: fine) {
  .l-menuContents__item:hover {
    text-decoration: none;
    color: var(--color-purple01);
  }
}
.l-menuContents__item svg {
  width: 20px;
  height: auto;
  color: var(--color-purple01);
}
@media screen and (width < 769px) {
  .l-menuContents__item svg {
    display: none;
  }
}
@media screen and (width >= 769px) {
  .l-menuContents__item svg {
    display: block;
    width: 24px;
  }
}
.l-menuContents__item:is([data-category=nyoumore] *) {
  display: grid;
}
@media screen and (width < 769px) {
  .l-menuContents__item:is([data-category=nyoumore] *) {
    grid-template-columns: 1fr auto;
    align-items: center;
    text-align: left;
    gap: 8px;
    -webkit-appearance: none;
    background-color: transparent;
    border: none;
    width: 100%;
    padding: 16px 28px 16px 32px;
    cursor: pointer;
    font-size: var(--fz-label-md);
    font-weight: 700;
    line-height: var(--lh-label-md);
  }
}
@media screen and (width >= 769px) {
  .l-menuContents__item:is([data-category=nyoumore] *) {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px;
    padding: 8px 0;
    font-size: min(0.390625vw + 13px, 18px);
    background-color: transparent;
  }
}
.l-menuContents__item:is([data-category=nyoumore] *) svg {
  display: block;
}
@media screen and (width < 769px) {
  .l-menuContents__item:is([data-category=nyoumore] *) svg {
    color: currentColor;
    order: 2;
  }
}
@media screen and (width >= 769px) {
  .l-menuContents__item:is([data-category=nyoumore] *) span {
    order: 1;
  }
}

.l-menuOverlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--z-index-menuOverlay);
  display: none;
  width: 100%;
  height: 100%;
}

/* -----------------------------------------------------------------------
## Footer ##################################################
----------------------------------------------------------------------- */
.l-footer {
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}

/* Contact ################# */
.l-contact {
  max-width: var(--w-default);
  margin-inline: auto;
  padding: var(--space-xl) 4.8929663609%;
  border: 1px solid var(--color-purple01);
  border-radius: 10px;
}
.l-contact__lead {
  margin-block-start: var(--space-xl);
  text-align: center;
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}

.l-soudan {
  margin-block-start: var(--space-base);
}
.l-soudan__title {
  text-align: center;
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.l-soudan__tel {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-block-start: max(-0.8839779006vw + 19.3149171271px, 8px);
}
@media screen and (width < 769px) {
  .l-soudan__tel {
    flex-direction: column;
  }
}
.l-soudan__tel span {
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.l-soudan__tel a {
  display: inline-block;
}
.l-soudan__notes {
  margin-block-start: 8px;
  text-align: center;
  font-size: var(--fz-body-xs);
  font-weight: 400;
  line-height: var(--lh-body-xs);
}
.l-soudan__line {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  margin-block-start: min(2.6519337017vw + 6.0552486188px, 40px);
  transition: var(--animation-opacity);
}
@media screen and (width >= 769px) {
  .l-soudan__line {
    display: none;
  }
}
@media (hover: hover) and (pointer: fine) {
  .l-soudan__line:hover {
    opacity: var(--opacity-hover);
  }
}

/* Banners ################# */
.l-banners {
  display: grid;
  gap: var(--space-lg);
  margin-block-start: var(--space-3xl);
}
@media screen and (width >= 769px) {
  .l-banners {
    grid-template-columns: repeat(2, auto);
    justify-content: center;
  }
}
.l-banners img {
  width: 100%;
  transition: var(--animation-opacity);
}
@media (hover: hover) and (pointer: fine) {
  .l-banners img:is(a:hover *) {
    opacity: 0.75;
  }
}
.l-banners a {
  display: block;
}

/* Footer Info ################# */
.l-footerInfo {
  margin-block-start: 40px;
}
.l-footerInfo__logo {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: center;
}
.l-footerInfo__logo img {
  width: 100%;
  max-width: 398px;
  transition: var(--animation-opacity);
}
@media (hover: hover) and (pointer: fine) {
  .l-footerInfo__logo img:is(a:hover *) {
    opacity: var(--opacity-hover);
  }
}

/* Local Navi ################# */
.l-localNaviList {
  display: flex;
  justify-content: center;
  margin-block-start: 40px;
  gap: 8px;
}
.l-localNaviList__item {
  display: flex;
  gap: 8px;
}
.l-localNaviList__item:not(:last-child)::after {
  content: "｜";
}
.l-localNaviList__item a {
  color: var(--color-font-default);
  font-size: var(--fz-body-md);
  line-height: var(--lh-body-md);
  transition: var(--animation-color);
}
@media (hover: hover) and (pointer: fine) {
  .l-localNaviList__item a:hover {
    color: var(--color-purple01);
  }
}

/* -----------------------------------------------------------------------
## MARK: Hamburger ##################################################
----------------------------------------------------------------------- */
.c-hamburger {
  position: absolute;
  top: 0;
  right: 0;
  aspect-ratio: 1/1;
  display: grid;
  grid-template-rows: 1fr auto;
  align-items: end;
  width: 56px;
  height: 56px;
  border: none;
  padding: 12px;
  gap: 8px;
  -webkit-appearance: none;
  background-color: transparent;
}
@media screen and (width >= 769px) {
  .c-hamburger {
    width: 74px;
    height: 74px;
  }
}
@media screen and (width > 1280px) {
  .c-hamburger {
    display: none;
  }
}
.c-hamburger > span {
  position: relative;
  display: block;
  height: 100%;
}
.c-hamburger > span::before, .c-hamburger > span::after {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  content: "";
  display: block;
  width: 20px;
  height: 2px;
  border-radius: var(--infinity);
  background-color: var(--color-black-300);
  transition: transform 0.2s 0s linear, box-shadow 0.2s 0s linear;
}
@media screen and (width >= 769px) {
  .c-hamburger > span::before, .c-hamburger > span::after {
    width: 40px;
    height: 4px;
  }
}
.c-hamburger > span::before {
  bottom: 12px;
  box-shadow: 0 6px 0 0 var(--color-black-300);
}
@media screen and (width >= 769px) {
  .c-hamburger > span::before {
    bottom: 24px;
    box-shadow: 0 12px 0 0 var(--color-black-300);
  }
}
.c-hamburger > span::after {
  bottom: 0;
}
.c-hamburger > span:is([aria-expanded=true] *)::before, .c-hamburger > span:is([aria-expanded=true] *)::after {
  top: 10px;
  width: 24px;
}
@media screen and (width >= 769px) {
  .c-hamburger > span:is([aria-expanded=true] *)::before, .c-hamburger > span:is([aria-expanded=true] *)::after {
    width: 40px;
  }
}
.c-hamburger > span:is([aria-expanded=true] *)::before {
  bottom: 0;
  transform: rotate(45deg);
  box-shadow: 0 6px 0 0 rgba(34, 34, 34, 0);
}
.c-hamburger > span:is([aria-expanded=true] *)::after {
  bottom: 0;
  transform: rotate(-45deg);
}
.c-hamburger > svg {
  width: 34px;
  margin-inline: auto;
}
@media screen and (width >= 769px) {
  .c-hamburger > svg {
    width: 38px;
  }
}

/* -----------------------------------------------------------------------
## MARK: パンくずリスト ##################################################
----------------------------------------------------------------------- */
.c-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.c-breadcrumbs__item {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: var(--fz-body-xs);
  font-weight: 400;
  line-height: var(--lh-body-xs);
}
.c-breadcrumbs__item:not(:last-child)::after {
  display: inline-block;
  content: "";
  width: 10px;
  height: 10px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%205%208%22%3E%3Cpath%20d%3D%22M4.72%203.69c.09.09.14.2.14.31%200%20.12-.05.22-.14.31L1.89%207.03a.4.4%200%200%201-.3.11.42.42%200%200%201-.3-.11c-.22-.21-.22-.42%200-.63L3.78%204l-2.5-2.4a.37.37%200%200%201-.15-.3c0-.13.05-.24.14-.33.2-.2.4-.2.6%200L4.73%203.7Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E") no-repeat center center/contain;
}

/* -----------------------------------------------------------------------
## MARK: ページタイトル ##################################################
----------------------------------------------------------------------- */
.c-pageTitle {
  padding: var(--space-xl) var(--px-content) 64px;
  background: url("../../img/chousuanshinpad/common/bg-pageTitle_sp.png") no-repeat right center/auto 100%;
}
@media screen and (width >= 769px) {
  .c-pageTitle {
    background: url("../../img/chousuanshinpad/common/bg-pageTitle_pc.png") no-repeat center bottom/auto auto;
  }
}
.c-pageTitle__inner {
  max-width: 960px;
  margin-inline: auto;
}
.c-pageTitle__title {
  color: var(--color-purple01);
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-xl-zen);
  font-weight: 700;
  line-height: var(--lh-title-xl-zen);
  margin-block-start: min(4.4198895028vw + 7.4254143646px, 64px);
}

.c-pageLead {
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
  margin-block-start: var(--space-base);
}

/* -----------------------------------------------------------------------
## MARK: ColorBg ##################################################
----------------------------------------------------------------------- */
.c-colorBg {
  position: relative;
  overflow: hidden;
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
  background-color: var(--color-purple03);
}
.c-colorBg__inner {
  max-width: 960px;
  margin-inline: auto;
}

/* -----------------------------------------------------------------------
## MARK: SectionTitle ##################################################
----------------------------------------------------------------------- */
.c-sectionTitle {
  display: grid;
  gap: 8px;
  justify-content: center;
  text-align: center;
}
.c-sectionTitle img {
  margin-inline: auto;
}
.c-sectionTitle img[src*=title-] {
  height: min(0.4419889503vw + 14.3425414365px, 20px);
}
.c-sectionTitle span {
  color: var(--color-purple01);
  font-family: var(--ff-zen);
  font-size: var(--fz-title-lg-zen);
  font-weight: 700;
  line-height: var(--lh-title-lg-zen);
}

/* -----------------------------------------------------------------------
## MARK: SectionInner ##################################################
----------------------------------------------------------------------- */
.c-sectionInner {
  max-width: 960px;
  margin-inline: auto;
}

/* -----------------------------------------------------------------------
## MARK: AreaTitle ##################################################
----------------------------------------------------------------------- */
.c-areaTitle {
  color: var(--color-blue01);
  text-align: center;
  font-size: var(--fz-heading-xl);
  font-weight: 700;
  line-height: var(--lh-heading-xl);
  display: grid;
  gap: 8px;
  align-items: center;
  justify-content: center;
}
@media screen and (width >= 769px) {
  .c-areaTitle {
    grid-template-columns: auto auto;
  }
}
.c-areaTitle img {
  margin-inline: auto;
  width: min(2.8729281768vw + 15.226519337px, 52px) !important;
}

/* -----------------------------------------------------------------------
## MARK: Button ##################################################
----------------------------------------------------------------------- */
.c-button {
  --bg-color: var(--color-purple01);
  --color: var(--color-black-900);
  --border-color: var(--color-purple01);
  position: relative;
  display: grid;
  place-items: center;
  width: 295px;
  min-height: 72px;
  text-align: center;
  padding: 12px 24px;
  border-radius: var(--infinity);
  color: var(--color);
  background: var(--bg-color) linear-gradient(93deg, var(--color-purple01) 0%, var(--color-purple01) 33.3%, var(--color-purple02) 66.6%, var(--color-purple02) 100%);
  box-shadow: 10px 20px 20px 0 rgba(217, 217, 217, 0.2);
  background-size: 300% auto;
  background-position: 50% 0;
  transition: background-position 0.2s 0s ease-out;
}
.c-button span {
  display: block;
  color: var(--color);
  font-size: var(--fz-label-md);
  font-weight: 700;
  line-height: var(--lh-label-md);
}
.c-button svg {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.c-button svg:is([data-icon-position=left] *) {
  left: 20px;
  right: auto;
}
@media (hover: hover) and (pointer: fine) {
  .c-button:hover, .c-button:is(a:hover *) {
    color: var(--color);
    text-decoration: none;
    background-position: 0% 0;
  }
}
.c-button[data-type=outline] {
  --color: var(--color-purple01);
  --bg-color: var(--color-black-900);
  --border-color: currentColor;
  color: var(--color);
  background: var(--bg-color);
  border: 2px solid var(--border-color);
  transition: background 0.2s 0s linear, color 0.2s 0s linear;
}
.c-button[data-type=outline] span {
  color: inherit;
}
.c-button[data-type=outline] svg {
  fill: var(--color);
}
@media (hover: hover) and (pointer: fine) {
  .c-button[data-type=outline]:hover, .c-button[data-type=outline]:is(a:hover *) {
    background: var(--color);
    color: var(--bg-color);
    text-decoration: none;
  }
}
.c-button[data-color=hanetuki] {
  --color: var(--color-blue02);
}
.c-button[data-color=men] {
  --color: var(--color-black-300);
}

/* -----------------------------------------------------------------------
## MARK: Text Link Button ##################################################
----------------------------------------------------------------------- */
.c-textLinkButton {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 8px;
  align-items: center;
  font-size: var(--fz-body-lg);
  font-weight: 700;
  line-height: var(--lh-body-lg);
}
.c-textLinkButton::before {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%0D%0A%20%20%3Cpath%20d%3D%22M12%2018.75V5.25M6.75%2013.5%2012%2018.75l5.25-5.25%22%20stroke%3D%22%23fff%22%20stroke-width%3D%222%22%20stroke-miterlimit%3D%2210%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0D%0A%3C%2Fsvg%3E"), linear-gradient(90deg, #907CC7 0%, #907CC7 33%, #D69FC7 66%, #D69FC7 100%);
  background-size: 24px 24px, 300% 100%;
  background-repeat: no-repeat;
  background-position: center center;
  transition: background-position 0.2s 0s ease-out;
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  border-radius: calc(infinity * 1px);
}
@media (hover: hover) and (pointer: fine) {
  .c-textLinkButton:hover::before {
    background-position: center center, 0% 0;
  }
}

/* -----------------------------------------------------------------------
## MARK: Stores ##################################################
----------------------------------------------------------------------- */
.c-stores {
  display: grid;
  gap: var(--space-lg);
}
.c-stores__3rdParty {
  display: grid;
  justify-items: center;
  gap: var(--space-base);
}
@media screen and (width >= 769px) {
  .c-stores__3rdParty {
    justify-content: center;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (width >= 769px) {
  .c-stores__3rdParty .c-storesButton:nth-child(odd) {
    justify-self: end;
  }
}
@media screen and (width >= 769px) {
  .c-stores__3rdParty .c-storesButton:nth-child(even) {
    justify-self: start;
  }
}
.c-stores__fukidashi {
  display: grid;
  grid-template-columns: 12px auto 12px;
  justify-content: center;
  align-items: center;
  gap: var(--space-xs);
  color: var(--color-orange01);
  margin-block-end: var(--space-xs);
}
.c-stores__fukidashi span {
  text-align: center;
  font-size: var(--fz-heading-xs);
  font-weight: 700;
  line-height: var(--lh-heading-xs);
}

.c-storesButton {
  display: grid;
  place-items: center;
  max-width: 400px;
  width: 100%;
  padding: 8px;
  background-color: var(--color-black-900);
  border-radius: var(--infinity);
  border: 1px solid var(--color-black-500);
  box-shadow: var(--shadow-default);
  transition: border-color 0.2s 0s linear, box-shadow 0.2s 0s linear;
}
@media (hover: hover) and (pointer: fine) {
  .c-storesButton:hover {
    border-color: var(--color-purple01);
    box-shadow: var(--shadow-hover);
  }
}

.c-storeSearch {
  display: grid;
  background-color: var(--color-black-900);
  border: 1px solid var(--color-black-700);
  border-radius: 10px;
  overflow: hidden;
  transition: var(--animation-color), border-color 0.2s 0s linear;
}
@media screen and (width >= 769px) {
  .c-storeSearch {
    border-width: 3px;
    grid-template-columns: repeat(2, 1fr);
  }
}
.c-storeSearch > img {
  width: 100%;
}
.c-storeSearch__inner {
  display: grid;
  place-items: center;
  position: relative;
  padding-block: var(--space-md);
}
.c-storeSearch__inner svg {
  position: absolute;
  inset-block: 0;
  right: min(3.0939226519vw + 0.3977900552px, 40px);
  width: min(0.8839779006vw + 28.6850828729px, 40px);
  height: min(0.8839779006vw + 28.6850828729px, 40px);
  margin: auto;
}
.c-storeSearch__text {
  text-align: center;
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.c-storeSearch__text span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  margin-block-start: 4px;
  padding: var(--space-xxs) min(2.2099447514vw + -0.2872928177px, 28px);
  background-color: var(--color-purple01);
  border-radius: 4px;
  color: var(--color-black-900);
  text-align: center;
  font-size: var(--fz-heading-xs);
  font-weight: 700;
  line-height: var(--lh-heading-xs);
  letter-spacing: 0.04em;
}
@media (hover: hover) and (pointer: fine) {
  .c-storeSearch:hover {
    text-decoration: none;
    border-color: var(--color-purple01);
  }
}

/* -----------------------------------------------------------------------
## MARK: Notes ##################################################
----------------------------------------------------------------------- */
.c-notes {
  display: flex;
  font-size: var(--fz-body-xs);
  font-weight: 400;
  line-height: var(--lh-body-xs);
  gap: var(--space-xxs);
}
.c-notes::before {
  content: "※";
}

/* -----------------------------------------------------------------------
## MARK: Wave ##################################################
----------------------------------------------------------------------- */
@keyframes wave {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
.c-wave {
  position: absolute;
  bottom: 0;
  left: 0;
  overflow: hidden;
  width: 100%;
  height: min(7.4033149171vw + -11.7624309392px, 83px);
}
.c-wave .c-wave__inner {
  display: flex;
  animation: wave 5s linear -2.5s infinite normal forwards running;
}
@media screen and (width >= 769px) {
  .c-wave .c-wave__inner {
    animation: wave 10s linear -5s infinite normal forwards running;
  }
}
.c-wave .c-wave__inner > img {
  width: auto;
  height: 100%;
}
.c-wave .c-wave__inner > img:first-child {
  margin-inline-end: -1px;
}

/* -----------------------------------------------------------------------
## MARK: Slider Controls  ################################################
----------------------------------------------------------------------- */
.c-slideCtrls {
  display: flex;
  gap: min(0.8839779006vw + 20.6850828729px, 32px);
  align-items: center;
  justify-content: center;
  margin-block-start: 32px;
}
.c-slideCtrls__arrow {
  background: linear-gradient(93deg, var(--color-purple01) 0%, var(--color-purple01) 33.3%, var(--color-purple02) 66.6%, var(--color-purple02) 100%);
  background-size: 300% auto;
  background-position: 50% 0;
  transition: background-position 0.2s 0s ease-out;
  border-radius: 50%;
  width: min(0.8839779006vw + 28.6850828729px, 40px);
  height: min(0.8839779006vw + 28.6850828729px, 40px);
  display: grid;
  place-items: center;
  color: var(--color-black-900);
}
@media (hover: hover) and (pointer: fine) {
  .c-slideCtrls__arrow:hover {
    background-position: 0% 0;
  }
}
.c-slideCtrls .splide__pagination {
  gap: min(0.4419889503vw + 10.3425414365px, 16px);
}
.c-slideCtrls .splide__pagination li {
  display: grid;
  place-items: center;
}
.c-slideCtrls .splide__pagination li * {
  grid-area: 1/1;
}
.c-slideCtrls .splide__pagination li svg {
  pointer-events: none;
}
.c-slideCtrls .splide__pagination__page {
  width: 16px;
  height: 16px;
  border-radius: var(--infinity);
  background-color: var(--color-black-600);
  transition: background-color 0.2s 0s linear;
}
@media (hover: hover) and (pointer: fine) {
  .c-slideCtrls .splide__pagination__page:hover {
    background-color: var(--color-purple02);
  }
}
.c-slideCtrls .splide__pagination__page.is-active {
  background-color: var(--color-purple01);
}
.c-slideCtrls__toggle {
  width: min(0.8839779006vw + 20.6850828729px, 32px);
  height: min(0.8839779006vw + 20.6850828729px, 32px);
  padding: 0;
  margin-inline-start: max(-0.8839779006vw + 3.3149171271px, -8px);
  border-radius: var(--infinity);
  background: var(--color-black-900);
  color: var(--color-black-300);
  overflow: hidden;
}
.c-slideCtrls__toggle svg {
  transition: background-color 0.2s 0s linear, color 0.2s 0s linear;
}
@media (hover: hover) and (pointer: fine) {
  .c-slideCtrls__toggle:hover svg {
    background: var(--color-black-300);
    color: var(--color-black-900);
  }
}

/* -----------------------------------------------------------------------
## MARK: BlogList  ##################################################
----------------------------------------------------------------------- */
.c-blogList {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: min(0.6629834254vw + 21.5138121547px, 30px);
}
@media screen and (width >= 769px) {
  .c-blogList {
    grid-template-columns: repeat(3, 1fr);
  }
}

.c-blogListItem {
  display: grid;
  gap: 8px;
  align-content: start;
}
.c-blogListItem__thumb {
  width: 100%;
  border-radius: 10px;
  aspect-ratio: 300/226;
  overflow: hidden;
}
.c-blogListItem__thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: var(--animation-transform);
}
@media (hover: hover) and (pointer: fine) {
  .c-blogListItem__thumb:is(.c-blogListItem:hover *) img {
    transform: scale(1.05);
  }
}
.c-blogListItem__title {
  font-size: var(--fz-heading-sm);
  font-weight: 700;
  line-height: var(--lh-heading-sm);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  transition: var(--animation-color);
}
.c-blogListItem__info {
  display: flex;
  flex-wrap: wrap;
  gap: 0 8px;
  color: var(--color-black-400);
  font-size: var(--fz-body-sm);
  font-weight: 400;
  line-height: var(--lh-body-sm);
}
.c-blogListItem__date {
  display: grid;
  grid-template-columns: 14px auto;
  gap: 4px;
  align-items: center;
}
.c-blogListItem__date svg {
  position: relative;
  top: 2px;
  width: 14px;
}
.c-blogListItem .c-blogListItemTerm {
  display: grid;
  grid-template-columns: 14px auto;
  gap: 4px;
  align-items: center;
}
.c-blogListItem .c-blogListItemTerm svg {
  position: relative;
  top: 2px;
  width: 14px;
}
@media (hover: hover) and (pointer: fine) {
  .c-blogListItem:hover {
    text-decoration: none;
  }
}

@keyframes fadeInModal {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeOutModal {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.c-movieModal {
  display: none;
}
.c-movieModal.is-open {
  display: block;
}
.c-movieModal__overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 200;
  width: 100%;
  height: 100%;
  background-color: rgba(102, 102, 102, 0.5);
  will-change: opacity;
}
.c-movieModal__overlay:is([aria-hidden=false] *) {
  animation: fadeInModal 0.2s linear 0s 1 normal forwards running;
}
.c-movieModal__overlay:is([aria-hidden=true] *) {
  animation: fadeOutModal 0.2s linear 0s 1 normal forwards running;
}
.c-movieModal__close {
  position: absolute;
  top: min(4.4198895028vw + 7.4254143646px, 64px);
  right: min(4.4198895028vw + 7.4254143646px, 64px);
  width: min(4.4198895028vw + 23.4254143646px, 80px);
  height: min(4.4198895028vw + 23.4254143646px, 80px);
}
.c-movieModal__container {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  padding-inline: 10%;
  will-change: opacity;
}
.c-movieModal__container:is([aria-hidden=false] *) {
  animation: fadeInModal 0.2s linear 0s 1 normal forwards running;
}
.c-movieModal__container:is([aria-hidden=true] *) {
  animation: fadeOutModal 0.2s linear 0s 1 normal forwards running;
}
.c-movieModal__contents {
  aspect-ratio: 950/540;
  width: 100%;
  height: 100%;
  max-width: 950px;
  height: -moz-fit-content;
  height: fit-content;
}
.c-movieModal__contents iframe {
  width: 100%;
  height: 100%;
}

/* -----------------------------------------------------------------------
## MARK: Pagination  ##################################################
----------------------------------------------------------------------- */
.c-pagination {
  display: grid;
  grid-template-columns: repeat(5, auto);
  gap: 8px;
  justify-content: center;
  margin-block-start: var(--space-xl);
}
.c-pagination .page-numbers {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  font-weight: 450;
  border-radius: var(--infinity);
  background-color: transparent;
  transition: var(--animation-background-color), var(--animation-color), var(--animation-border-color);
}
.c-pagination .page-numbers:is(.current) {
  background-color: var(--color-purple01);
  color: var(--color-black-900);
}
@media (hover: hover) and (pointer: fine) {
  .c-pagination .page-numbers:not(.current):hover {
    text-decoration: none;
    background-color: var(--color-purple02);
    color: var(--color-black-900);
  }
}
.c-pagination .prev,
.c-pagination .next {
  border: 1px solid var(--color-black-300);
}
.c-pagination .prev.is-hidden,
.c-pagination .next.is-hidden {
  opacity: 0;
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  .c-pagination .prev:hover,
  .c-pagination .next:hover {
    border-color: var(--color-purple02);
  }
}
.c-pagination svg {
  width: 24px;
  height: 24px;
}

/* -----------------------------------------------------------------------
## MARK: Purchase ##################################################
----------------------------------------------------------------------- */
.c-purchase {
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
  background-color: var(--color-purple03);
}
.c-purchase__title {
  color: var(--color-purple01);
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-xl-zen);
  font-weight: 700;
  line-height: var(--lh-heading-xl-zen);
}
.c-purchase .c-stores {
  margin-block-start: var(--space-xl);
}
.c-purchase .c-stores__fukidashi svg {
  width: 12px;
}
.c-purchase .c-storesButton:is([data-type=live_do_style]) {
  margin-inline: auto;
}
.c-purchase .c-storeSearch {
  margin-block-start: min(4.4198895028vw + 23.4254143646px, 80px);
}

/* -----------------------------------------------------------------------
## MARK: FAQ ##################################################
----------------------------------------------------------------------- */
.c-faqBox {
  border-top: 1px solid var(--color-black-600);
  border-bottom: 1px solid var(--color-black-600);
}
.c-faqBox:nth-child(n+2) {
  margin-block-start: -1px;
}
.c-faqBox__icon {
  position: relative;
}
.c-faqBox__summary {
  display: grid;
  gap: var(--space-sm);
  grid-template-columns: min(0.3314917127vw + 10.7569060773px, 15px) 1fr 24px;
  font-size: var(--fz-body-sm);
  font-weight: 700;
  line-height: var(--lh-body-sm);
  padding: 24px var(--space-lg) var(--space-base);
  cursor: pointer;
}
.c-faqBox__summary::after {
  content: "";
  width: 24px;
  height: 24px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%0D%0A%20%20%3Cpath%20d%3D%22M11%2013H5v-2h6V5h2v6h6v2h-6v6h-2v-6Z%22%20fill%3D%22%23907CC7%22%2F%3E%0D%0A%3C%2Fsvg%3E") no-repeat center center/auto;
}
@media screen and (width >= 769px) {
  .c-faqBox__summary::after {
    width: 40px;
    height: 40px;
  }
}
.c-faqBox__summary:is([open] *)::after {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%0D%0A%20%20%3Cpath%20d%3D%22M5.4%2012.55v-2.1H18v2.1H5.4Z%22%20fill%3D%22%23907CC7%22%2F%3E%0D%0A%3C%2Fsvg%3E") no-repeat center center/auto;
}
.c-faqBox__summary .c-faqBox__icon {
  top: min(0.6629834254vw + 3.5138121547px, 12px);
}
.c-faqBox__summary span {
  padding-block: min(0.6629834254vw + -0.4861878453px, 8px);
}
.c-faqBox__content {
  display: none;
  grid-template-columns: min(0.3314917127vw + 10.7569060773px, 15px) 1fr;
  gap: var(--space-sm);
  align-items: start;
  background-color: var(--color-black-900);
  padding: var(--space-base) var(--space-lg) var(--space-md);
  font-size: var(--fz-body-sm);
  font-weight: 400;
  line-height: var(--lh-body-sm);
}
.c-faqBox__content .c-faqBox__icon {
  top: 4px;
}
.c-faqBox__content a {
  color: var(--color-purple01);
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .c-faqBox__content a:hover {
    text-decoration: none;
  }
}

/* -----------------------------------------------------------------------
## MARK: タイプ選択 ##################################################
----------------------------------------------------------------------- */
.c-typeSelect {
  padding: var(--space-3xl) var(--px-content) min(2.2099447514vw + 91.7127071823px, 120px);
}
.c-typeSelect__inner {
  max-width: 960px;
  margin-inline: auto;
}

.c-typeSelectList {
  display: grid;
  gap: var(--space-2xl) min(2.34375vw + -6px, 24px);
  margin-block-start: var(--space-xl);
}
@media screen and (width >= 769px) {
  .c-typeSelectList {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (width >= 769px) {
  .c-typeSelectList[data-colmun="2"] {
    justify-content: center;
    grid-template-columns: repeat(2, min(100%, 304px));
  }
}
.c-typeSelectList__package {
  width: 184px;
  margin-inline: auto;
  transition: var(--animation-transform);
}
@media (hover: hover) and (pointer: fine) {
  .c-typeSelectList__package:is(a:hover *) {
    transform: scale(1.05);
  }
}
.c-typeSelectList__link {
  display: block;
}
@media (hover: hover) and (pointer: fine) {
  .c-typeSelectList__link:hover {
    text-decoration: none;
  }
}
.c-typeSelectList .c-button {
  width: 92.9663608563%;
  margin: 40px auto 0;
}
@media screen and (width >= 769px) {
  .c-typeSelectList .c-button {
    width: 100%;
  }
}
.c-typeSelectList .c-button:is([data-type=hane] *) {
  --color: var(--color-blue02);
}
.c-typeSelectList .c-button:is([data-type=mens] *) {
  --color: var(--color-black-400);
}

/* -----------------------------------------------------------------------
## MARK: sceneList（商品詳細） ###########################################
----------------------------------------------------------------------- */
.c-sceneList {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: min(1.6574585635vw + 18.7845303867px, 40px);
}
@media screen and (width >= 769px) {
  .c-sceneList {
    grid-template-columns: repeat(4, 1fr);
  }
}
.c-sceneList__text {
  margin-block-start: var(--space-base);
  text-align: center;
  font-size: var(--fz-heading-xs);
  font-weight: 700;
  line-height: var(--lh-heading-xs);
}

/* -----------------------------------------------------------------------
## MARK: 特徴リスト ###########################################
----------------------------------------------------------------------- */
.c-featuresList {
  max-width: 840px;
  margin-inline: auto;
}
.c-featuresList__item {
  position: relative;
  display: grid;
  gap: min(6.1878453039vw + 0.7955801105px, 80px);
  align-items: center;
}
@media screen and (width >= 769px) {
  .c-featuresList__item {
    align-items: center;
    grid-template-columns: 38.0952380952% 1fr;
  }
}
.c-featuresList__item + .c-featuresList__item {
  margin-block-start: var(--space-2xl);
}
.c-featuresList__num {
  position: absolute;
  top: -20px;
  left: -15px;
}
.c-featuresList__title {
  color: var(--color-purple01);
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
  margin-block-end: 16px;
}
.c-featuresList__title sup {
  font-size: 0.5em;
}
.c-featuresList__text {
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
}
.c-featuresList__text sup {
  font-size: 0.5em;
}

/* -----------------------------------------------------------------------
## MARK: 医師に聞きました！ ###########################################
----------------------------------------------------------------------- */
.c-forDoctor {
  position: relative;
  max-width: 960px;
  margin-inline: auto;
  border-radius: 10px;
  background-color: var(--color-purple03);
  padding: 0 var(--space-xl) var(--space-xl);
}
.c-forDoctor::after {
  display: block;
  position: absolute;
  width: min(6.6298342541vw + 75.138121547px, 160px);
  aspect-ratio: 1;
  right: min(2.2099447514vw + -13.2872928177px, 15px);
  bottom: 0;
  background: url("../../img/chousuanshinpad/common/img-doctor.svg") no-repeat left top/contain;
  content: "";
}
.c-forDoctor__title {
  text-align: center;
  position: relative;
  top: max(-0.4419889503vw + -26.3425414365px, -32px);
  margin-block-end: max(-0.4419889503vw + -26.3425414365px, -32px);
  font-weight: 700;
}
.c-forDoctor__fukidashi {
  position: relative;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  font-size: var(--fz-body-md);
  line-height: var(--lh-body-md);
  background-color: var(--color-yellow01);
  padding: var(--space-sm) var(--space-base);
  border-radius: 10px;
  margin-block-end: min(0.2209944751vw + 9.1712707182px, 12px);
}
.c-forDoctor__fukidashi::after {
  position: absolute;
  top: calc(100% - 6px);
  right: 0;
  left: 0;
  width: 20px;
  height: 18px;
  margin-inline: auto;
  background-color: inherit;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: "";
}
.c-forDoctor__titleText {
  color: var(--color-purple01);
  text-align: center;
  font-size: var(--fz-heading-lg);
  line-height: var(--lh-heading-lg);
}
.c-forDoctor__subTitle {
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  border-top: 1px solid currentColor;
  font-size: var(--fz-body-sm);
  font-weight: 700;
  line-height: var(--lh-body-sm);
  margin-block: var(--space-base) 15px;
  margin-inline: auto;
  padding-block: 4px;
}
.c-forDoctor__subTitle::after {
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  width: 100%;
  height: 8px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20128%208%22%3E%3Cpath%20d%3D%22M.5.5h60.02l3.85%206%203.46-6h59.67%22%20stroke%3D%22%23000%22%2F%3E%3C%2Fsvg%3E  ") no-repeat center bottom/auto 100%;
  margin-inline: auto;
  content: "";
}
.c-forDoctor__text {
  text-align: center;
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg); /* 175% */
}
.c-forDoctor .c-notes {
  margin-block-start: var(--space-xs);
  justify-content: center;
}

/* -----------------------------------------------------------------------
## MARK: ラインナップボックス ###########################################
----------------------------------------------------------------------- */
.c-lineupBox {
  max-width: 960px;
  margin-inline: auto;
  background-color: var(--color-black-900);
  border-radius: 10px;
  box-shadow: 10px 20px 20px 0 rgba(217, 217, 217, 0.2);
}

.c-lineupBoxTitle {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 95px;
  grid-template-columns: 1fr 24px;
  padding: max(-1.7679558011vw + 38.6298342541px, 16px) min(1.3259668508vw + 19.0276243094px, 36px);
  border-radius: 10px;
}
@media screen and (width >= 769px) {
  .c-lineupBoxTitle {
    align-items: center;
  }
}
.c-lineupBoxTitle::after {
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M11%2013H5v-2h6V5h2v6h6v2h-6v6h-2v-6Z%22%20fill%3D%22%231F1F1F%22%2F%3E%3C%2Fsvg%3E") no-repeat center center/24px auto;
}
.c-lineupBoxTitle:is([aria-expanded=true])::after {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M5%2013v-2h14v2H5Z%22%20fill%3D%22%231F1F1F%22%2F%3E%3C%2Fsvg%3E") no-repeat center center/24px auto;
}
.c-lineupBoxTitle__inner {
  display: grid;
  justify-items: center;
}
@media screen and (width >= 769px) {
  .c-lineupBoxTitle__inner {
    grid-template-columns: 1fr 76px 1fr;
    align-items: center;
    gap: 2.6041666667%;
  }
}
.c-lineupBoxTitle__package {
  position: absolute;
  width: 76px;
  top: -105px;
  left: 0;
  right: 0;
  margin-inline: auto;
  pointer-events: none;
}
@media screen and (width >= 769px) {
  .c-lineupBoxTitle__package {
    align-self: end;
    position: static;
    order: 2;
    margin-top: -96px;
  }
}
.c-lineupBoxTitle__text {
  align-self: end;
  font-size: var(--fz-heading-sm);
  font-weight: 700;
  line-height: var(--lh-heading-sm);
  margin-block-end: 8px;
}
@media screen and (width >= 769px) {
  .c-lineupBoxTitle__text {
    font-size: min(1.171875vw + 5px, 20px);
    text-align: left;
    justify-self: end;
    margin-block-end: 0;
    order: 1;
  }
}
.c-lineupBoxTitle__type {
  align-self: end;
  color: var(--color-blue01);
  font-size: var(--fz-heading-xs);
  font-weight: 700;
  line-height: var(--lh-heading-xs);
}
@media screen and (width >= 769px) {
  .c-lineupBoxTitle__type {
    order: 3;
    justify-self: start;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.c-lineupBoxContents {
  display: grid;
  padding-inline: min(6.1878453039vw + 0.7955801105px, 80px);
  padding-block-end: var(--space-lg);
}
@media screen and (width >= 769px) {
  .c-lineupBoxContents {
    align-items: center;
    justify-items: start;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    gap: 0 var(--space-lg);
    padding-block-start: 25px;
    padding-inline-end: min(11.7127071823vw + -19.9226519337px, 130px);
  }
}
.c-lineupBoxContents__package {
  width: 265px;
  height: auto;
  margin-inline: auto;
}
.c-lineupBoxContents__name {
  text-align: center;
  font-size: var(--fz-body-lg);
  font-weight: 700;
  line-height: var(--lh-body-lg);
  letter-spacing: 0.04em;
}
.c-lineupBoxContents__table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
.c-lineupBoxContents__table th,
.c-lineupBoxContents__table td {
  border-bottom: 1px solid var(--color-black-600);
  padding: var(--space-sm) 0;
  text-align: left;
  vertical-align: top;
}
.c-lineupBoxContents__table th {
  width: 42.1052631579%;
  font-size: var(--fz-heading-xs);
  font-weight: 700;
  line-height: var(--lh-heading-xs);
}
@media screen and (width >= 769px) {
  .c-lineupBoxContents__table th {
    width: 32.3595505618%;
  }
}
.c-lineupBoxContents__table td {
  font-size: var(--fz-heading-xs);
  font-weight: 700;
  line-height: var(--lh-heading-xs);
}

.c-shopLinks {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-base);
  justify-content: center;
  margin-inline: auto;
  padding-block-start: min(1.7679558011vw + 17.3701657459px, 40px);
}
@media screen and (width >= 769px) {
  .c-shopLinks {
    width: 100%;
    grid-column: 1/-1;
  }
}
.c-shopLinks__link {
  display: grid;
  place-items: center;
  width: 44.5614035088%;
  height: 54px;
  border: 1px solid var(--color-black-600);
  border-radius: var(--infinity);
  box-shadow: 7.5px 15px 15px 0 rgba(217, 217, 217, 0.2);
  transition: var(--animation-border-color), box-shadow 0.2s 0s ease-out;
}
@media screen and (width >= 769px) {
  .c-shopLinks__link {
    width: 22.2666666667%;
  }
}
@media (hover: hover) and (pointer: fine) {
  .c-shopLinks__link:hover {
    border-color: var(--color-purple01);
    box-shadow: 0 0 0 0 rgba(217, 217, 217, 0.2);
  }
}
.c-shopLinks__logo:is([data-shop=amazon]) {
  width: auto;
  height: min(0.9944751381vw + 31.270718232px, 44px);
}
.c-shopLinks__logo:is([data-shop=rakuten]) {
  width: min(2.5414364641vw + 81.4696132597px, 114px);
}
.c-shopLinks__logo:is([data-shop=livedostyle]) {
  width: min(2.4309392265vw + 76.8839779006px, 108px);
}
.c-shopLinks__logo:is([data-shop=search]) {
  width: min(0.8839779006vw + 81.6850828729px, 93px);
}

/* -----------------------------------------------------------------------
## MARK: Media Box ##################################################
----------------------------------------------------------------------- */
.c-mediaBox {
  display: grid;
  gap: var(--space-lg) var(--space-2xl);
  grid-template-areas: "image" "contents";
  max-width: 960px;
  margin-inline: auto;
}
@media screen and (width >= 769px) {
  .c-mediaBox {
    grid-template-areas: "image contents";
    grid-template-columns: 45.8333333333% 1fr;
  }
}
.c-mediaBox__image {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  width: 100%;
  height: auto;
  grid-area: image;
}
.p-anshinpadMenPage .p-recommendation .p-mediaBox > .c-mediaBox__image {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.p-featuresPage .p-recommendation .p-mediaBox > .c-mediaBox__image {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
@media screen and (width >= 769px) {
  .c-mediaBox__image {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    grid-area: image;
  }
  .p-anshinpadMenPage .p-recommendation .p-mediaBox > .c-mediaBox__image {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .p-featuresPage .p-recommendation .p-mediaBox > .c-mediaBox__image {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
}
.c-mediaBox__image img {
  border-radius: calc(infinity * 1px);
  filter: drop-shadow(10px 20px 20px rgba(217, 217, 217, 0.2));
}
.c-mediaBox__contents {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
  display: grid;
  gap: var(--space-base);
  align-content: center;
  grid-area: contents;
}
.p-anshinpadMenPage .p-recommendation .p-mediaBox > .c-mediaBox__contents {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.p-featuresPage .p-recommendation .p-mediaBox > .c-mediaBox__contents {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
@media screen and (width >= 769px) {
  .c-mediaBox__contents {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    grid-area: contents;
  }
  .p-anshinpadMenPage .p-recommendation .p-mediaBox > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .p-featuresPage .p-recommendation .p-mediaBox > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  @media screen and (width >= 769px){
  .c-mediaBox__image {
      -ms-grid-row: 1;
      -ms-grid-column: 1;
  }
  .c-mediaBox__image {
      -ms-grid-row: 1;
      -ms-grid-column: 1;
  }
  .c-mediaBox__contents {
      -ms-grid-row: 1;
      -ms-grid-column: 2;
  }
  .c-mediaBox__contents {
      -ms-grid-row: 1;
      -ms-grid-column: 2;
  }
  }
}
.c-mediaBox__title {
  color: var(--color-purple01);
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.c-mediaBox__title sup {
  font-size: 0.5em;
}
.c-mediaBox__text {
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.c-mediaBox__text sup {
  font-size: 0.5em;
}
@media screen and (width >= 769px) {
  .c-mediaBox:is([data-direction=reverse]) {
    grid-template-areas: "contents image";
    grid-template-columns: 1fr 45.8333333333%;
  }
  .c-mediaBox:is([data-direction=reverse]) > .c-mediaBox__image {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .c-mediaBox:is([data-direction=reverse]) > .c-mediaBox__image {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .c-mediaBox:is([data-direction=reverse]) > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .c-mediaBox:is([data-direction=reverse]) > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
}

/* -----------------------------------------------------------------------
## MARK: 全体 ##################################################
----------------------------------------------------------------------- */
.c-diagnosis {
  padding: min(8.8397790055vw + 6.8508287293px, 120px) 6.4%;
  background-image: url("../../img/chousuanshinpad/common/diagnosis/bg.png"), linear-gradient(103deg, #D69FC7 0%, #AE96CA 100%);
  background-size: auto, cover;
  background-position: center;
  background-repeat: repeat, no-repeat;
}
.c-diagnosis__inner {
  max-width: 960px;
  margin-inline: auto;
  padding: min(0.8839779006vw + 12.6850828729px, 24px);
  background-color: #F9E8F4;
  border-radius: min(2.2099447514vw + 11.7127071823px, 40px);
}
.c-diagnosis__scene {
  position: relative;
  display: grid;
  place-items: center;
  background: #fff url("../../img/chousuanshinpad/common/diagnosis/bg-check.png") repeat center center/min(0.8839779006vw + 4.6850828729px, 16px) auto;
  border-radius: min(2.2099447514vw + 1.7127071823px, 30px);
  padding: 40px min(2.2099447514vw + -8.2872928177px, 20px);
  border: 2px solid var(--color-purple02);
}
@media screen and (width >= 769px) {
  .c-diagnosis__scene {
    min-height: min(35.138121547vw + 192.2320441989px, 642px);
  }
}
.c-diagnosis .c-diagnosis__contents {
  width: 100%;
}
.c-diagnosis .c-diagnosis__balloon {
  position: absolute;
  top: min(14.9171270718vw + -200.9392265193px, -10px);
  left: min(6.1878453039vw + -55.2044198895px, 24px);
  display: grid;
  width: min(4.0883977901vw + 127.6685082873px, 180px);
  height: min(4.0883977901vw + 127.6685082873px, 180px);
  place-items: center;
  color: var(--color-black-300);
  background: url("../../img/chousuanshinpad/common/diagnosis/balloon.svg") no-repeat center center/contain;
  z-index: 1;
  font-size: var(--fz-heading-sm);
  font-weight: 700;
  line-height: var(--lh-heading-sm);
}
.c-diagnosis .c-button {
  max-width: min(7.0718232044vw + 236.4806629834px, 327px);
  margin-inline: auto;
  margin-block-start: var(--space-md);
}
.c-diagnosis .c-button:is([data-color=male] *) {
  color: var(--color-black-300);
  background-color: var(--color-black-900);
}
@media (hover: hover) and (pointer: fine) {
  .c-diagnosis .c-button:is([data-color=male] *):hover {
    color: var(--color-black-900);
    background-color: var(--color-black-300);
  }
}
.c-diagnosis .c-diagnosis__back {
  display: grid;
  grid-template-columns: auto auto;
  gap: var(--space-xxs);
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  margin-block-start: var(--space-lg);
  font-size: var(--fz-body-sm);
  font-weight: 700;
  line-height: var(--lh-body-sm);
  letter-spacing: 0.04em;
  text-decoration: underline;
  transition: color 0.2s 0s linear;
}
.c-diagnosis .c-diagnosis__back svg {
  width: min(0.8839779006vw + 12.6850828729px, 24px);
}
.c-diagnosis .c-diagnosis__back:is([data-scene=result] *) {
  margin-block-start: var(--space-base);
}
@media (hover: hover) and (pointer: fine) {
  .c-diagnosis .c-diagnosis__back:hover {
    text-decoration: none;
  }
}

/* -----------------------------------------------------------------------
## MARK: 表紙 ##################################################
----------------------------------------------------------------------- */
.c-diagnosis__scene:is([data-scene=top]) .c-diagnosis__title {
  font-size: var(--fz-heading-md);
  line-height: var(--lh-heading-md);
  text-align: center;
}
.c-diagnosis__scene:is([data-scene=top]) .c-diagnosis__title img {
  width: min(69.9447513812vw + 64.7071823204px, 960px);
  margin-inline: auto;
}
.c-diagnosis__scene:is([data-scene=top]) .c-diagnosis__image {
  margin-block-start: var(--space-md);
}
.c-diagnosis__scene:is([data-scene=top]) .c-diagnosis__image img {
  width: min(42.5414364641vw + 135.4696132597px, 680px);
  margin-inline: auto;
}
.c-diagnosis__scene:is([data-scene=top]) .c-diagnosis__description {
  margin-block-start: var(--space-md);
  text-align: center;
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
}

/* -----------------------------------------------------------------------
## MARK: 質問 ##################################################
----------------------------------------------------------------------- */
.c-diagnosis__scene:is([data-scene=question]) {
  padding-block: var(--space-base);
}
.c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__title {
  color: var(--color-purple02);
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-xl-zen);
  font-weight: 700;
  line-height: var(--lh-heading-xl-zen);
}
.c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__title img {
  width: auto;
  height: min(2.0994475138vw + 10.1270718232px, 37px);
  margin-inline: auto;
  margin-block-end: var(--space-xs);
}
.c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__icon {
  display: block;
  width: min(4.4198895028vw + 63.4254143646px, 120px);
  height: min(4.4198895028vw + 63.4254143646px, 120px);
  margin-inline: auto;
  margin-block-start: var(--space-base);
}
.c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
  margin-block-start: var(--space-base);
}
.c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__button {
  color: var(--color-black-300);
  background-color: var(--color-black-900);
  border: 1px solid var(--color-black-300);
  border-radius: var(--infinity);
  height: 40px;
  width: 100%;
  max-width: 275px;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.16);
  transition: color 0.2s 0s linear, background-color 0.2s 0s linear;
}
.c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__button span {
  text-align: center;
  font-size: var(--fz-label-sm);
  font-weight: 700;
  line-height: var(--lh-label-sm);
  letter-spacing: 0.04em;
}
.c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__button:is([data-color=female]), .c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__button:is([data-color=female] *) {
  color: var(--color-purple01);
  border-color: var(--color-purple01);
}
@media (hover: hover) and (pointer: fine) {
  .c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__button:is([data-color=female]):hover, .c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__button:is([data-color=female] *):hover {
    color: var(--color-black-900);
    background-color: var(--color-purple01);
  }
}
@media (hover: hover) and (pointer: fine) {
  .c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__button:is([data-color=male]):hover, .c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__button:is([data-color=male] *):hover {
    color: var(--color-black-900);
    background-color: var(--color-black-300);
  }
}
.c-diagnosis__scene:is([data-scene=question]) .c-diagnosis__button:is([data-scene-num="2"] *) {
  max-width: 124px;
}

/* -----------------------------------------------------------------------
## MARK: 結果 ##################################################
----------------------------------------------------------------------- */
.c-diagnosis__scene:is([data-scene=result]) {
  align-content: start;
  padding-block: min(2.6519337017vw + 30.0552486188px, 64px);
}
.c-diagnosis__scene:is([data-scene=result]) .c-diagnosis__title {
  color: var(--color-purple02);
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-xl-zen);
  font-weight: 700;
  line-height: var(--lh-heading-xl-zen);
}
.c-diagnosis__scene:is([data-scene=result]) .c-diagnosis__anchor {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-xs) min(0.8839779006vw + 28.6850828729px, 40px);
  margin-block-start: var(--space-md);
}
.c-diagnosis__scene:is([data-scene=result]) .c-diagnosis__anchor a {
  transition: color 0.2s 0s linear;
}
.c-diagnosis__scene:is([data-scene=result]) .c-diagnosis__anchor img {
  width: 55px;
  height: auto;
}
.c-diagnosis__scene:is([data-scene=result]) .c-diagnosis__anchor svg {
  width: min(0.8839779006vw + 12.6850828729px, 24px);
  height: min(0.8839779006vw + 12.6850828729px, 24px);
  margin-inline: auto;
  transition: transform 0.2s 0s ease-out;
}
@media (hover: hover) and (pointer: fine) {
  .c-diagnosis__scene:is([data-scene=result]) .c-diagnosis__anchor svg:is(a:hover *) {
    transform: translateY(5px);
  }
}
.c-diagnosis__scene:is([data-scene=result]) .c-diagnosis__lineup {
  display: grid;
  gap: var(--space-lg);
}
.c-diagnosis__scene:is([data-scene=result]) .c-lineupBoxContents {
  width: 100%;
  max-width: 666px;
  margin-inline: auto;
  padding-inline: 4.2666666667%;
  padding-block: 0;
}
@media screen and (width >= 769px) {
  .c-diagnosis__scene:is([data-scene=result]) .c-lineupBoxContents {
    padding-block: var(--space-sm);
  }
}
.c-diagnosis__scene:is([data-scene=result]) .c-lineupBoxContents__package {
  width: 180px;
}
.c-diagnosis__scene:is([data-scene=result]) .c-diagnosis__buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-base) 24px;
  padding-inline: 4.2666666667%;
  margin-block-start: var(--space-lg);
}
.c-diagnosis__scene:is([data-scene=result]) .c-diagnosis__buttons .c-button {
  width: 100%;
  max-width: 295px;
  margin-inline: 0;
  margin-block-start: 0;
}

/* -----------------------------------------------------------------------
## BG ##################################################
----------------------------------------------------------------------- */
.p-topPage .p-bg {
  position: relative;
  background: url(../../img/chousuanshinpad/top/bg-overview_sp.jpg) no-repeat center center/cover;
}
@media screen and (width >= 769px) {
  .p-topPage .p-bg {
    background: url(../../img/chousuanshinpad/top/bg-overview_pc.jpg) no-repeat center center/cover;
  }
}

/* -----------------------------------------------------------------------
## KV ##################################################
----------------------------------------------------------------------- */
/* スライド ################# */
.p-topPage {
  /* パッケージ ################# */
}
.p-topPage .p-slide {
  margin-inline: auto;
  --slide-gap: min(6.1878453039vw + 0.7955801105px, 80px);
  --slide-padding-inline: min(2.6519337017vw + 6.0552486188px, 40px);
  padding-block: min(3.5359116022vw + 18.7403314917px, 64px);
}
.p-topPage .p-slide a {
  display: block;
}
.p-topPage .p-slide img {
  width: calc(295/375 * 100vw);
  max-width: 600px;
  height: auto;
  transition: var(--animation-opacity);
}
@media (hover: hover) and (pointer: fine) {
  .p-topPage .p-slide img:is(a:hover *) {
    opacity: 0.8;
  }
}
.p-topPage .p-package {
  padding-block-start: var(--space-xl);
}
.p-topPage .p-package__title {
  text-align: center;
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
  color: var(--color-purple01);
}
.p-topPage .p-package__image {
  width: min(15.4696132597vw + 141.9889502762px, 340px);
  height: auto;
  margin-inline: auto;
  margin-block-start: var(--space-base);
}

/* -----------------------------------------------------------------------
## Overview ##################################################
----------------------------------------------------------------------- */
.p-topPage .p-overview {
  padding-block: var(--space-3xl) min(16.1325966851vw + 3.5027624309px, 210px);
  padding-inline: var(--px-content);
  background: url(../../img/chousuanshinpad/top/bg-overview_sp.png) no-repeat center top/calc(307/375 * 100vw) auto;
}
@media screen and (width >= 769px) {
  .p-topPage .p-overview {
    background: url(../../img/chousuanshinpad/top/bg-overview_pc.png) no-repeat center top var(--space-3xl)/1430px auto;
  }
}
.p-topPage .p-overview__title {
  color: var(--color-purple01);
  font-family: var(--ff-zen);
  font-size: min(3.5359116022vw + 26.7403314917px, 72px);
  font-weight: 400;
  line-height: 150%;
}
@media screen and (width >= 769px) {
  .p-topPage .p-overview__title {
    text-align: center;
  }
}
.p-topPage .p-overviewMedia {
  display: grid;
  gap: var(--space-2xl);
  margin-block-start: 40px;
}
@media screen and (width >= 769px) {
  .p-topPage .p-overviewMedia {
    grid-template-columns: 1fr 1fr;
  }
}
.p-topPage .p-overviewMedia__text {
  align-self: center;
  font-size: var(--fz-body-lg);
  line-height: var(--lh-body-lg-lead);
}
.p-topPage .p-overviewMedia__text strong {
  color: var(--color-purple01);
}
.p-topPage .p-overviewMedia__text p:nth-child(n+2) {
  margin-block-start: 1.5em;
}
.p-topPage .p-overviewMedia__image {
  position: relative;
  align-self: start;
}
.p-topPage .p-overviewMedia__image [src*=overview01] {
  filter: drop-shadow(10px 20px 20px rgba(217, 217, 217, 0.2));
}
.p-topPage .p-overviewMedia__image [src*=overview02] {
  position: absolute;
  right: 0;
  bottom: max(-4.0883977901vw + 7.3314917127px, -45px);
  width: 88.0733944954%;
  height: auto;
}
@media screen and (width >= 769px) {
  .p-topPage .p-overviewMedia__image [src*=overview02] {
    right: max(-20.3125vw + 156px, -104px);
  }
}
.p-topPage .p-overviewMedia .c-button {
  margin-inline: auto;
  margin-block-start: var(--space-lg);
}
@media screen and (width >= 769px) {
  .p-topPage .p-overviewMedia .c-button {
    margin-inline: 0;
  }
}

/* -----------------------------------------------------------------------
## Structure ##################################################
----------------------------------------------------------------------- */
.p-topPage .p-structure {
  padding-block: var(--space-3xl) 0;
  padding-inline: var(--px-content);
}
.p-topPage .p-structure__contents {
  margin-block-start: var(--space-xl);
}
.p-topPage .p-structure__text {
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
  margin-block-start: 1.5em;
}
.p-topPage .p-structure__text sup {
  font-size: calc(10/16 * 1rem);
}
.p-topPage .p-structure__text strong {
  color: var(--color-purple01);
}
.p-topPage .p-structure__notes {
  margin-block-start: var(--space-xs);
}
.p-topPage .p-structure__image {
  margin-block-end: var(--space-xl);
}
.p-topPage .p-structure .c-button {
  margin-block-start: var(--space-lg);
  margin-inline: auto;
}

/* -----------------------------------------------------------------------
## Feature ##################################################
----------------------------------------------------------------------- */
.p-topPage .p-feature {
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}
.p-topPage .p-feature .c-sectionTitle [src*=text-feature] {
  width: min(14.5856353591vw + 165.3038674033px, 352px);
  margin-block-end: min(0.8839779006vw + 4.6850828729px, 16px);
}
.p-topPage .p-feature .c-button {
  margin-block-start: var(--space-xl);
  margin-inline: auto;
}
.p-topPage .p-featureBox {
  display: grid;
  gap: var(--space-md);
  margin-block-start: var(--space-xl);
  margin-inline: auto;
  max-width: 840px;
}
@media screen and (width >= 769px) {
  .p-topPage .p-featureBox {
    grid-template-columns: 320px 1fr;
    gap: min(15.625vw + -80px, 80px);
  }
}
.p-topPage .p-featureBox:nth-child(n+3) {
  margin-block-start: var(--space-2xl);
}
@media screen and (width >= 769px) {
  .p-topPage .p-featureBox__body {
    align-self: center;
  }
}
.p-topPage .p-featureBox__title {
  color: var(--color-purple01);
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
  margin-block-end: var(--space-sm);
}
.p-topPage .p-featureBox__title sup {
  font-size: calc(10/16 * 1rem);
}
.p-topPage .p-featureBox__text {
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
}

/* -----------------------------------------------------------------------
## Lineup ##################################################
----------------------------------------------------------------------- */
.p-topPage .p-lineup {
  padding-block: var(--space-3xl) 100px;
  padding-inline: var(--px-content);
  background: url(../../img/chousuanshinpad/top/bg-lineup_sp.jpg) no-repeat center top/cover;
}
@media screen and (width >= 769px) {
  .p-topPage .p-lineup {
    background: url(../../img/chousuanshinpad/top/bg-lineup_pc.jpg) no-repeat center center/cover;
  }
}
.p-topPage .p-lineup__lead {
  text-align: center;
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
  margin-block-start: var(--space-md);
}
.p-topPage .p-lineup .c-button {
  margin-block-start: var(--space-2xl);
  margin-inline: auto;
}
.p-topPage .p-lineupTabs {
  position: relative;
  background-color: var(--color-black-700);
  border-radius: var(--infinity);
  display: grid;
  margin-block-start: var(--space-xl);
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
}
.p-topPage .p-lineupTabs::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 33.33%;
  height: 100%;
  background-color: var(--color-blue01);
  border-radius: var(--infinity);
  z-index: 1;
  transition: left 0.6s 0s cubic-bezier(0, 0.67, 0.24, 0.99);
}
.p-topPage .p-lineupTabs:has(.p-lineupTabs__tab:first-child[aria-selected=true])::before {
  left: 0;
}
.p-topPage .p-lineupTabs:has(.p-lineupTabs__tab:nth-child(2)[aria-selected=true])::before {
  left: 33.33%;
}
.p-topPage .p-lineupTabs:has(.p-lineupTabs__tab:last-child[aria-selected=true])::before {
  left: 66.66%;
}
.p-topPage .p-lineupTabs__tab {
  position: relative;
  z-index: 2;
  color: var(--color-black-500);
  text-align: center;
  font-size: var(--fz-body-md);
  font-weight: 700;
  line-height: var(--lh-body-md);
  padding: 12px;
  transition: var(--animation-color), var(--animation-background-color);
  border-radius: var(--infinity);
}
@media screen and (width >= 769px) {
  .p-topPage .p-lineupTabs__tab {
    padding: 5px 12px;
  }
}
.p-topPage .p-lineupTabs__tab[aria-selected=true] {
  color: var(--color-black-900);
}
@media (hover: hover) and (pointer: fine) {
  .p-topPage .p-lineupTabs__tab:hover {
    color: var(--color-black-900);
    background-color: rgba(0, 160, 233, 0.5);
  }
}
.p-topPage .p-lineupPanels {
  margin-block-start: var(--space-xl);
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.p-topPage .p-lineupPanel:not([hidden]) {
  animation: fadeIn 0.4s linear 0s 1 normal forwards running;
}
.p-topPage .p-lineupPanel__grid {
  display: grid;
  grid-template-columns: repeat(2, min(12.3756906077vw + 63.591160221px, 222px));
  gap: var(--space-lg) 40px;
  justify-content: center;
  justify-items: center;
  text-align: center;
}
@media screen and (width >= 769px) {
  .p-topPage .p-lineupPanel__grid {
    gap: var(--space-lg) var(--space-base);
    grid-template-columns: repeat(auto-fit, min(12.3756906077vw + 63.591160221px, 222px));
  }
}
@media screen and (width < 769px) {
  .p-topPage .p-lineupItem:last-child:nth-child(odd) {
    grid-column: span 2;
  }
}
.p-topPage .p-lineupItem__image {
  width: min(12.3756906077vw + 63.591160221px, 222px);
}
@media screen and (width >= 769px) {
  .p-topPage .p-lineupItem__image {
    width: 110px;
  }
}
.p-topPage .p-lineupItem__name {
  margin-block-start: var(--space-base);
  font-size: var(--fz-body-lg);
  font-weight: 700;
  line-height: var(--lh-body-lg);
}

/* -----------------------------------------------------------------------
## Recommendation ##################################################
----------------------------------------------------------------------- */
.p-topPage .p-recommendation {
  position: relative;
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
  background-color: var(--color-purple03);
  overflow: hidden;
}
@media screen and (width < 769px) {
  .p-topPage .p-recommendation .c-sectionTitle img[src*=title] {
    height: 28px;
  }
}
.p-topPage .p-recommendation .p-badge {
  position: absolute;
  top: -2px;
  left: 0;
  right: 0;
  max-width: min(71.9337016575vw + 75.2486187845px, 996px);
  margin-inline: auto;
}
.p-topPage .p-recommendation .p-badge img {
  width: min(12.5966850829vw + 32.7624309392px, 194px);
}
.p-topPage .p-recommendation__lead {
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
  margin-block-start: var(--space-xl);
  text-align: center;
  max-width: 600px;
  margin: 0 auto;
}
.p-topPage .p-recommendation__notes {
  display: flex;
  flex-direction: column;
  margin-left: auto;
  margin-block-start: 8px;
  max-width: 600px;
  margin: 0 auto;
}
.p-topPage .p-recommendation__bnr {
  max-width: 800px;
  margin-block: min(2.6519337017vw + 30.0552486188px, 64px);
  margin-inline: auto;
}
.p-topPage .p-recommendation .c-button {
  margin-block-start: var(--space-xl);
  margin-inline: auto;
}
.p-topPage .p-doctorVoices {
  width: calc(300/375 * 100vw);
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}
@media screen and (width >= 769px) {
  .p-topPage .p-doctorVoices {
    width: auto;
  }
}
.p-topPage .p-doctorVoiceSlider {
  --slide-gap: min(2.4309392265vw + -1.1160220994px, 30px);
}
@media screen and (width < 769px) {
  .p-topPage .p-doctorVoiceSlider .splide__track {
    overflow: visible;
  }
}
@media screen and (width < 769px) {
  .p-topPage .p-doctorVoiceSlider .c-slideCtrls {
    gap: 8px;
  }
}
@media screen and (width < 769px) {
  .p-topPage .p-doctorVoiceSlider .splide__pagination {
    gap: 8px;
  }
}
.p-topPage .p-doctorVoice {
  display: grid;
  grid-template-rows: 1fr;
  width: 100%;
  flex-shrink: 0;
}
@media screen and (width >= 769px) {
  .p-topPage .p-doctorVoice {
    width: 300px;
  }
}
.p-topPage .p-doctorVoice__balloon {
  border-style: solid;
  border-width: 10px 10px 25px 10px;
  -o-border-image: url(../../img/chousuanshinpad/top/bg-balloon.svg) 10 10 25 10 repeat repeat;
     border-image: url(../../img/chousuanshinpad/top/bg-balloon.svg) 10 10 25 10 repeat repeat;
}
.p-topPage .p-doctorVoice__balloonInner {
  display: grid;
  grid-template-rows: 1fr auto;
  height: 100%;
  background-color: var(--color-black-900);
  padding: min(1.1049723757vw + 0.8563535912px, 15px);
}
.p-topPage .p-doctorVoice__image {
  margin-block-start: 5px;
}
.p-topPage .p-doctorVoice__image img {
  margin-inline: auto;
}
.p-topPage .p-doctorVoice__text {
  font-size: var(--fz-heading-xs);
  font-weight: 700;
  line-height: var(--lh-heading-xs);
}
.p-topPage .p-doctorVoice__text strong {
  color: var(--color-purple01);
}
.p-topPage .p-doctorVoice__name {
  margin-block-start: var(--space-xs);
  text-align: right;
  font-size: var(--fz-body-sm);
  font-weight: 400;
  line-height: var(--lh-body-sm);
}
.p-topPage .p-reasons {
  display: grid;
  gap: var(--space-2xl);
  background-color: var(--color-black-900);
  margin-block-start: var(--space-xl);
  padding: var(--space-2xl) min(3.9779005525vw + 9.0828729282px, 60px);
}
.p-topPage .p-reason {
  display: grid;
  gap: var(--space-md);
}
@media screen and (width >= 769px) {
  .p-topPage .p-reason {
    grid-template-columns: 320px 1fr;
    gap: min(15.625vw + -80px, 80px);
  }
}
@media screen and (width >= 769px) {
  .p-topPage .p-reason__body {
    align-self: center;
  }
}
.p-topPage .p-reason__title {
  color: var(--color-purple01);
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.p-topPage .p-reason__text {
  margin-block-start: var(--space-sm);
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
}

/* -----------------------------------------------------------------------
## Blog ##################################################
----------------------------------------------------------------------- */
.p-topPage .p-blog {
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
  background: url(../../img/chousuanshinpad/top/bg-lineup_sp.jpg) no-repeat center top/cover;
}
@media screen and (width >= 769px) {
  .p-topPage .p-blog {
    background: url(../../img/chousuanshinpad/top/bg-lineup_pc.jpg) no-repeat center center/cover;
  }
}
.p-topPage .p-blog .c-blogList {
  margin-block-start: var(--space-xl);
}
.p-topPage .p-blog .c-button {
  margin-block-start: var(--space-xl);
  margin-inline: auto;
}

/* -----------------------------------------------------------------------
## Faq ##################################################
----------------------------------------------------------------------- */
.p-topPage .p-faq {
  position: relative;
  padding-block: min(15.0276243094vw + 7.6464088398px, 200px) min(15.9116022099vw + 20.3314917127px, 224px);
  padding-inline: var(--px-content);
  background: var(--color-purple03) url(../../img/chousuanshinpad/top/bg-faq.jpg) no-repeat center top/auto calc(109/375 * 100vw);
}
@media screen and (width >= 769px) {
  .p-topPage .p-faq {
    background-size: auto auto;
  }
}
.p-topPage .p-faq .c-sectionInner {
  max-width: 1072px;
  padding: var(--space-2xl) var(--space-base);
  background-color: var(--color-black-900);
  border-radius: 10px;
  box-shadow: var(--shadow-default);
}
.p-topPage .p-faq .c-button {
  margin-block-start: var(--space-xl);
  margin-inline: auto;
}
.p-topPage .p-faqContents {
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}
.p-topPage .p-faqContents__group:not(:first-child) {
  margin-block-start: var(--space-lg);
  padding-block-start: var(--space-lg);
  border-top: 1px solid var(--color-black-600);
}
.p-topPage .p-faqContents__question {
  display: grid;
  grid-template-columns: 1em 1fr;
  gap: var(--space-sm);
  font-size: var(--fz-body-lg);
  font-weight: 700;
  line-height: var(--lh-body-lg);
}
.p-topPage .p-faqContents__question::before {
  content: "Q";
  color: var(--color-purple01);
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.p-topPage .p-faqContents__answer {
  display: grid;
  grid-template-columns: 1em 1fr;
  gap: var(--space-sm);
  margin: 0;
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
  margin-block-start: var(--space-base);
}
.p-topPage .p-faqContents__answer::before {
  content: "A";
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  line-height: var(--lh-heading-md);
}

/* -----------------------------------------------------------------------
## Movie ##################################################
----------------------------------------------------------------------- */
.p-topPage .p-movie {
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}
.p-topPage .p-movieContents {
  display: grid;
  gap: var(--space-base);
  margin-block-start: var(--space-xl);
}
@media screen and (width >= 769px) {
  .p-topPage .p-movieContents {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* -----------------------------------------------------------------------
## MARK: シーン ##################################################
----------------------------------------------------------------------- */
.p-anshinpadPage .p-scene {
  padding-block: var(--space-3xl) min(7.0718232044vw + -10.5193370166px, 80px);
}
.p-anshinpadPage .c-sceneList {
  margin-block-start: var(--space-xl);
}

/* -----------------------------------------------------------------------
## MARK: 設計 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadPage .p-design {
  margin-block-start: var(--space-3xl);
}
.p-anshinpadPage .p-design__title {
  color: var(--color-purple01);
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-xl-zen);
  font-weight: 700;
  line-height: var(--lh-heading-xl-zen); /* 166.667% */
}
.p-anshinpadPage .p-designSlide {
  --slide-gap: min(6.1878453039vw + 0.7955801105px, 80px);
  --slide-padding-inline: min(2.6519337017vw + 6.0552486188px, 40px);
  margin-block-start: var(--space-xl);
  margin-inline: calc(-24/375 * 100vw);
}
.p-anshinpadPage .p-designSlide a {
  display: block;
}
.p-anshinpadPage .p-designSlide img {
  width: calc(295/375 * 100vw);
  max-width: 440px;
  height: auto;
  transition: var(--animation-opacity);
  border-radius: 10px;
}
@media (hover: hover) and (pointer: fine) {
  .p-anshinpadPage .p-designSlide img:is(a:hover *) {
    opacity: 0.8;
  }
}

/* -----------------------------------------------------------------------
## MARK: 特徴 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadPage .p-features {
  margin-block-start: var(--space-3xl);
  padding-inline: var(--px-content);
  padding-block-end: var(--space-3xl);
}
.p-anshinpadPage .p-features__title {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  color: var(--color-purple01);
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-title-lg-zen);
  font-weight: 700;
  line-height: var(--lh-title-lg-zen);
}
.p-anshinpadPage .p-features__title img {
  width: min(9.3922651934vw + 229.7790055249px, 350px);
  height: auto;
  margin-inline: auto;
}
.p-anshinpadPage .c-featuresList {
  margin-block-start: var(--space-xl);
}
.p-anshinpadPage .c-forDoctor {
  margin-block-start: min(2.2099447514vw + 83.7127071823px, 112px);
}

/* -----------------------------------------------------------------------
## MARK: ラインナップ ##################################################
----------------------------------------------------------------------- */
.p-anshinpadPage .p-lineup {
  padding-inline: var(--px-content);
  padding-block: var(--space-3xl);
  background-color: var(--color-purple03);
}
.p-anshinpadPage .p-lineup__lead {
  margin-block-start: var(--space-xl);
  text-align: center;
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
}
.p-anshinpadPage .c-lineupBox {
  margin-block-start: max(-6.1878453039vw + 143.2044198895px, 64px);
}

/* -----------------------------------------------------------------------
## MARK: シーン ##################################################
----------------------------------------------------------------------- */
.p-anshinpadHanetukiPage .c-colorBg {
  background-color: var(--color-blue04);
}
.p-anshinpadHanetukiPage .p-scene {
  padding-block: var(--space-3xl) 0;
}
.p-anshinpadHanetukiPage .p-scene .c-sectionTitle span {
  color: var(--color-blue02);
}
.p-anshinpadHanetukiPage .c-sceneList {
  margin-block-start: var(--space-xl);
}
.p-anshinpadHanetukiPage .c-pageTitle {
  background-image: url(../../img/chousuanshinpad/common/bg-pageTitle-wing_sp.png);
}
@media screen and (width >= 769px) {
  .p-anshinpadHanetukiPage .c-pageTitle {
    background-image: url(../../img/chousuanshinpad/common/bg-pageTitle-wing_pc.png);
  }
}
.p-anshinpadHanetukiPage .c-pageTitle__title {
  color: var(--color-blue02);
}

/* -----------------------------------------------------------------------
## MARK: 設計 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadHanetukiPage .p-design {
  margin-block-start: var(--space-3xl);
}
.p-anshinpadHanetukiPage .p-design__title {
  color: var(--color-blue02);
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-xl-zen);
  font-weight: 700;
  line-height: var(--lh-heading-xl-zen);
}
.p-anshinpadHanetukiPage .p-design__images {
  display: grid;
  gap: min(4.4198895028vw + 23.4254143646px, 80px);
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}
@media screen and (width >= 769px) {
  .p-anshinpadHanetukiPage .p-design__images {
    grid-template-columns: repeat(2, 1fr);
  }
}
.p-anshinpadHanetukiPage .p-compare {
  margin-block-start: var(--space-3xl);
}
.p-anshinpadHanetukiPage .p-compare__title {
  color: var(--color-blue02);
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-lg-zen);
  font-weight: 700;
  line-height: 1;
}
.p-anshinpadHanetukiPage .p-compare__title small {
  display: block;
  margin-block-start: var(--space-xs);
  font-size: var(--fz-body-sm);
  font-weight: 400;
  line-height: var(--lh-body-sm);
}
.p-anshinpadHanetukiPage .p-compare__images {
  display: grid;
  gap: min(4.4198895028vw + 23.4254143646px, 80px);
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}
@media screen and (width >= 769px) {
  .p-anshinpadHanetukiPage .p-compare__images {
    grid-template-columns: repeat(2, 1fr);
  }
}
.p-anshinpadHanetukiPage .p-compare__images figcaption {
  text-align: center;
  font-size: var(--fz-body-md);
  font-weight: 700;
  line-height: var(--lh-body-md);
  margin-block-end: var(--space-base);
}
.p-anshinpadHanetukiPage .c-notes:is(.p-compare *) {
  max-width: 960px;
  margin-inline: auto;
  justify-content: end;
  margin-block-start: var(--space-xs);
}

/* -----------------------------------------------------------------------
## MARK: 使い方 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadHanetukiPage .p-howToUse {
  margin-block-start: var(--space-3xl);
  padding-block-end: min(7.0718232044vw + -10.5193370166px, 80px);
}
.p-anshinpadHanetukiPage .p-howToUse .c-sectionTitle span {
  color: var(--color-blue02);
}
.p-anshinpadHanetukiPage .p-howToUse__title {
  color: var(--color-blue02);
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-lg-zen);
  font-weight: 700;
  line-height: 1;
}
.p-anshinpadHanetukiPage .p-howToUse__title small {
  display: block;
  margin-block-start: var(--space-xs);
  font-size: var(--fz-body-sm);
  font-weight: 400;
  line-height: var(--lh-body-sm);
}
.p-anshinpadHanetukiPage .p-howToUse__images {
  display: grid;
  gap: max(-1.1049723757vw + 44.1436464088px, 30px);
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
  justify-content: center;
}
@media screen and (width >= 769px) {
  .p-anshinpadHanetukiPage .p-howToUse__images {
    grid-template-columns: repeat(2, 300px);
  }
}
.p-anshinpadHanetukiPage .p-howToUse__images figcaption {
  margin-block-start: var(--space-xs);
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.p-anshinpadHanetukiPage .p-howToUse__images figcaption sup {
  font-size: 0.5em;
}
.p-anshinpadHanetukiPage .p-howToUse__images figcaption small {
  display: block;
  margin-block-start: var(--space-xs);
  font-size: var(--fz-body-xs);
  font-weight: 400;
  line-height: var(--lh-body-xs);
}

/* -----------------------------------------------------------------------
## MARK: 特徴 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadHanetukiPage .p-features {
  margin-block-start: var(--space-3xl);
  padding-inline: var(--px-content);
  padding-block-end: var(--space-3xl);
}
.p-anshinpadHanetukiPage .p-features__title {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  color: var(--color-blue02);
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-title-lg-zen);
  font-weight: 700;
  line-height: var(--lh-title-lg-zen);
}
.p-anshinpadHanetukiPage .p-features__title img {
  width: min(9.3922651934vw + 229.7790055249px, 350px);
  height: auto;
  margin-inline: auto;
}
.p-anshinpadHanetukiPage .c-featuresList {
  margin-block-start: var(--space-xl);
}
.p-anshinpadHanetukiPage .c-featuresList__title {
  color: var(--color-blue02);
}
.p-anshinpadHanetukiPage .c-forDoctor {
  margin-block-start: min(2.2099447514vw + 83.7127071823px, 112px);
  background-color: var(--color-blue04);
}
.p-anshinpadHanetukiPage .c-forDoctor .c-forDoctor__titleText {
  color: var(--color-blue02);
}

/* -----------------------------------------------------------------------
## MARK: ラインナップ ##################################################
----------------------------------------------------------------------- */
.p-anshinpadHanetukiPage .p-lineup {
  padding-inline: var(--px-content);
  padding-block: var(--space-3xl);
  background-color: var(--color-blue04);
}
.p-anshinpadHanetukiPage .p-lineup .c-sectionTitle span {
  color: var(--color-blue02);
}
.p-anshinpadHanetukiPage .p-lineup__lead {
  margin-block-start: var(--space-xl);
  text-align: center;
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
}
.p-anshinpadHanetukiPage .c-lineupBox {
  margin-block-start: max(-6.1878453039vw + 143.2044198895px, 64px);
}

/* -----------------------------------------------------------------------
## MARK: シーン ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .c-pageTitle {
  background: none;
}
.p-anshinpadMenPage .c-pageTitle__title {
  color: var(--color-font-default);
}
.p-anshinpadMenPage .c-colorBg {
  background-color: var(--color-black-700);
}
.p-anshinpadMenPage .p-featuresAnchors {
  display: grid;
  gap: var(--space-base);
}
@media screen and (width >= 769px) {
  .p-anshinpadMenPage .p-featuresAnchors {
    gap: var(--space-lg);
    grid-template-columns: repeat(3, auto);
    justify-content: center;
  }
}
.p-anshinpadMenPage .p-featuresAnchors a {
  transition: color 0.2s 0s linear;
}
.p-anshinpadMenPage .c-textLinkButton::before {
  transition: background-color 0.2s 0s linear;
  background-color: #fff;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2041%2040%22%3E%3Crect%20x%3D%22.5%22%20width%3D%2240%22%20height%3D%2240%22%20rx%3D%2220%22%20fill%3D%22%23transparent%22%2F%3E%3Cpath%20d%3D%22M20.5%2012.25a1%201%200%200%201%201%201v11.09l3.54-3.55a1%201%200%201%201%201.42%201.42l-5.25%205.25a1%201%200%200%201-.42.25h-.05l-.05.02h-.02a1%201%200%200%201-.34%200h-.06l-.06-.02a1%201%200%200%201-.42-.25l-5.25-5.25a1%201%200%201%201%201.42-1.42l3.54%203.55V13.25a1%201%200%200%201%201-1Z%22%20fill%3D%22%23222%22%2F%3E%3C%2Fsvg%3E");
  background-size: cover;
}
.p-anshinpadMenPage .c-textLinkButton:hover::before {
  background-color: var(--color-black-300);
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2041%2040%22%3E%3Crect%20x%3D%22.5%22%20width%3D%2240%22%20height%3D%2240%22%20rx%3D%2220%22%20fill%3D%22%23transparent%22%2F%3E%3Cpath%20d%3D%22M20.5%2012.25a1%201%200%200%201%201%201v11.09l3.54-3.55a1%201%200%201%201%201.42%201.42l-5.25%205.25a1%201%200%200%201-.42.25h-.05l-.05.02h-.02a1%201%200%200%201-.34%200h-.06l-.06-.02a1%201%200%200%201-.42-.25l-5.25-5.25a1%201%200%201%201%201.42-1.42l3.54%203.55V13.25a1%201%200%200%201%201-1Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}
.p-anshinpadMenPage__kv {
  margin-block-start: var(--space-3xl);
}
.p-anshinpadMenPage .c-sectionTitle:not(.c-typeSelect *) span {
  color: var(--color-black-300);
}
.p-anshinpadMenPage .p-scene {
  padding-block: min(7.0718232044vw + -10.5193370166px, 80px);
}
.p-anshinpadMenPage .c-sceneList {
  margin-block-start: var(--space-xl);
}

/* -----------------------------------------------------------------------
## MARK: 設計 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .p-graph {
  margin-block-start: var(--space-3xl);
}
.p-anshinpadMenPage .p-graph__title {
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-xl-zen);
  font-weight: 700;
  line-height: var(--lh-heading-xl-zen);
}
.p-anshinpadMenPage .p-graph__image {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}

/* -----------------------------------------------------------------------
## MARK: 設計 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .p-design {
  margin-block-start: var(--space-3xl);
}
.p-anshinpadMenPage .p-design__title {
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-heading-xl-zen);
  font-weight: 700;
  line-height: var(--lh-heading-xl-zen);
}
.p-anshinpadMenPage .p-design__images {
  display: grid;
  gap: min(4.4198895028vw + 23.4254143646px, 80px);
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}
@media screen and (width >= 769px) {
  .p-anshinpadMenPage .p-design__images {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* -----------------------------------------------------------------------
## MARK: 使い方 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .p-howToUse__movie {
  margin-block-start: 64px;
}
.p-anshinpadMenPage .p-howToUse__movie .p-movieItem {
  display: block;
  max-width: 540px;
  margin-inline: auto;
}
.p-anshinpadMenPage .p-howToUse__images {
  display: grid;
  gap: max(-1.1049723757vw + 44.1436464088px, 30px);
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: 64px;
  justify-content: center;
}
@media screen and (width >= 769px) {
  .p-anshinpadMenPage .p-howToUse__images {
    grid-template-columns: repeat(3, 300px);
  }
}
.p-anshinpadMenPage .p-howToUse__images figcaption {
  margin-block-start: var(--space-xs);
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.p-anshinpadMenPage .p-howToUse__images figcaption sup {
  font-size: 0.5em;
}
.p-anshinpadMenPage .p-howToUse__images figcaption small {
  display: block;
  margin-block-start: var(--space-xs);
  font-size: var(--fz-body-xs);
  font-weight: 400;
  line-height: var(--lh-body-xs);
}
.p-anshinpadMenPage .p-howToUse .p-attention {
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: 64px;
  background-color: #fff;
  border-radius: 10px;
  padding: min(1.7679558011vw + 17.3701657459px, 40px) min(6.1878453039vw + 0.7955801105px, 80px);
}
.p-anshinpadMenPage .p-howToUse .p-attention__title {
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.p-anshinpadMenPage .p-howToUse .p-attention__list {
  margin-block-start: var(--space-base);
}
.p-anshinpadMenPage .p-howToUse .p-attention__list li {
  display: grid;
  grid-template-columns: 1em 1fr;
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.p-anshinpadMenPage .p-howToUse .p-attention__list li::before {
  content: "・";
}

/* -----------------------------------------------------------------------
## MARK: Movie ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .p-movie {
  --slide-gap: min(1.6574585635vw + 8.7845303867px, 30px);
  --slide-padding-inline: 39px;
  padding-block: 100px;
  background: url(../../img/chousuanshinpad/anshinpad-men/bg-movie_sp.jpg) no-repeat center top/cover;
}
@media screen and (width >= 769px) {
  .p-anshinpadMenPage .p-movie {
    background: url(../../img/chousuanshinpad/anshinpad-men/bg-movie_pc.jpg) no-repeat center top/cover;
  }
}
.p-anshinpadMenPage .p-movieContents {
  margin-block-start: var(--space-xl);
}
.p-anshinpadMenPage .p-movieContents .c-slideCtrls__arrow {
  background: linear-gradient(93deg, var(--color-black-300) 2.82%, var(--color-black-400) 100%);
}
.p-anshinpadMenPage .p-movieContents .c-slideCtrls {
  gap: var(--space-sm);
}
.p-anshinpadMenPage .p-movieContents .c-slideCtrls .splide__pagination {
  gap: var(--space-xs);
}
.p-anshinpadMenPage .p-movieContents .c-slideCtrls .splide__pagination path {
  stroke: #222 !important;
}
.p-anshinpadMenPage .p-movieContents .c-slideCtrls .splide__pagination .is-active {
  background-color: var(--color-black-300);
}
.p-anshinpadMenPage .p-movieItem {
  display: block;
  max-width: 300px;
  margin-inline: auto;
}
.p-anshinpadMenPage .p-movieItem img {
  width: 100%;
  height: auto;
}
.p-anshinpadMenPage .p-movieItem__caption {
  margin-block-start: 16px;
  text-align: center;
  font-size: var(--fz-heading-sm);
  font-weight: 700;
  line-height: var(--lh-heading-sm);
}

/* -----------------------------------------------------------------------
## MARK: 特徴 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .p-features {
  margin-block-start: var(--space-3xl);
  padding-inline: var(--px-content);
  padding-block-end: var(--space-3xl);
}
.p-anshinpadMenPage .p-features__title {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-title-lg-zen);
  font-weight: 700;
  line-height: var(--lh-title-lg-zen);
}
.p-anshinpadMenPage .p-features__title img {
  width: min(9.3922651934vw + 229.7790055249px, 350px);
  height: auto;
  margin-inline: auto;
}
.p-anshinpadMenPage .c-featuresList {
  margin-block-start: var(--space-xl);
}
.p-anshinpadMenPage .c-featuresList__title span {
  color: var(--color-black-300);
}
.p-anshinpadMenPage .c-forDoctor {
  margin-block-start: min(2.2099447514vw + 83.7127071823px, 112px);
}

/* -----------------------------------------------------------------------
## MARK: Doctor ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .p-recommendation {
  position: relative;
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}
@media screen and (width < 769px) {
  .p-anshinpadMenPage .p-recommendation .c-sectionTitle img[src*=title] {
    height: 28px;
  }
}
.p-anshinpadMenPage .p-recommendation__lead {
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
  margin-block-start: var(--space-xl);
  text-align: center;
}
.p-anshinpadMenPage .p-recommendation__notes {
  justify-content: end;
  margin-block-start: 8px;
}
.p-anshinpadMenPage .p-recommendation .p-mediaBox {
  grid-template-areas: "contents" "image";
  gap: var(--space-2xl);
  margin-block-start: var(--space-xl);
}
@media screen and (width >= 769px) {
  .p-anshinpadMenPage .p-recommendation .p-mediaBox {
    grid-template-areas: "contents image";
  }
  .p-anshinpadMenPage .p-recommendation .p-mediaBox > .c-mediaBox__image {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .p-anshinpadMenPage .p-recommendation .p-mediaBox > .c-mediaBox__image {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .p-anshinpadMenPage .p-recommendation .p-mediaBox > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .p-anshinpadMenPage .p-recommendation .p-mediaBox > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
}
.p-anshinpadMenPage .p-recommendation .c-mediaBox__title {
  color: var(--color-black-300);
}
.p-anshinpadMenPage .p-recommendation .p-recommendation__caption {
  text-align: center;
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
  margin-block-start: var(--space-base);
}
.p-anshinpadMenPage .p-recommendation .p-recommendation__caption span, .p-anshinpadMenPage .p-recommendation .p-recommendation__caption b {
  display: block;
}
.p-anshinpadMenPage .p-recommendation .p-recommendation__caption b {
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.p-anshinpadMenPage .p-recommendation .p-caption {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px;
  margin-block-start: var(--space-base);
  font-size: var(--fz-body-xs);
  font-weight: 400;
  line-height: var(--lh-body-xs);
}
.p-anshinpadMenPage .p-recommendation .p-caption dd {
  margin: 0;
}
.p-anshinpadMenPage .p-recommendation .c-notes {
  margin-block-start: 4px;
}

/* -----------------------------------------------------------------------
## MARK: ラインナップ ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .p-lineup {
  padding-inline: var(--px-content);
  padding-block: var(--space-3xl);
  background-color: var(--color-black-700);
}
.p-anshinpadMenPage .p-lineup__lead {
  margin-block-start: var(--space-xl);
  text-align: center;
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
}
.p-anshinpadMenPage .c-lineupBox {
  margin-block-start: max(-6.1878453039vw + 143.2044198895px, 64px);
}
.p-anshinpadMenPage .c-lineupBoxTitle__package {
  top: -75px;
}

/* -----------------------------------------------------------------------
## MARK: 特徴 ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .p-mechanism {
  margin-block-start: var(--space-3xl);
  padding-inline: var(--px-content);
  padding-block-end: var(--space-3xl);
}
.p-anshinpadMenPage .p-mechanism__title {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: center;
  font-family: var(--ff-zen);
  font-size: var(--fz-title-lg-zen);
  font-weight: 700;
  line-height: var(--lh-title-lg-zen);
}
.p-anshinpadMenPage .p-mechanism__title img {
  width: min(9.3922651934vw + 229.7790055249px, 350px);
  height: auto;
  margin-inline: auto;
}
.p-anshinpadMenPage .p-mechanism__image {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}
.p-anshinpadMenPage .p-mechanismContents {
  display: grid;
  gap: max(-1.1049723757vw + 44.1436464088px, 30px);
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: 64px;
  justify-content: center;
}
@media screen and (width >= 769px) {
  .p-anshinpadMenPage .p-mechanismContents {
    grid-template-columns: repeat(3, 300px);
  }
}
.p-anshinpadMenPage .p-mechanismContents__item {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  gap: var(--space-sm);
  background-color: var(--color-black-700);
  border-radius: 10px;
  padding: var(--space-md) var(--space-base);
}
.p-anshinpadMenPage .p-mechanismContents__title {
  align-self: center;
  text-align: center;
  font-size: var(--fz-heading-sm);
  font-weight: 700;
  line-height: var(--lh-heading-sm);
}
.p-anshinpadMenPage .p-mechanismContents__text {
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}

/* -----------------------------------------------------------------------
## MARK: タイプ ##################################################
----------------------------------------------------------------------- */
.p-types {
  position: relative;
  background-color: var(--color-black-700);
  padding-block: min(13.2596685083vw + 30.2762430939px, 200px) var(--space-3xl);
  padding-inline: var(--px-content);
}
.p-types .c-wave {
  top: 0;
  bottom: auto;
  transform: rotateX(180deg);
}

.p-typesAnchors {
  display: grid;
  gap: var(--space-base);
  margin-block-end: var(--space-3xl);
}
@media screen and (width >= 769px) {
  .p-typesAnchors {
    gap: var(--space-lg);
    grid-template-columns: repeat(3, auto);
    justify-content: center;
  }
}
.p-typesAnchors a {
  transition: color 0.2s 0s linear;
}

.p-typeBox {
  display: grid;
  background-color: #fff;
  border-radius: 10px;
  gap: var(--space-lg);
  padding: var(--space-lg) min(6.1878453039vw + 0.7955801105px, 80px);
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: 64px;
}
@media screen and (width >= 769px) {
  .p-typeBox {
    align-items: center;
    grid-template-columns: 200px 1fr;
  }
}
.p-typeBox__image {
  width: 200px;
  margin-inline: auto;
}
.p-typeBox__title {
  margin-block-end: var(--space-sm);
  color: var(--color-blue01);
  font-size: var(--fz-heading-lg);
  font-weight: 700;
  line-height: var(--lh-heading-lg);
}
.p-typeBox__details {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-sm);
}
.p-typeBox__details[data-column="1"] {
  grid-template-columns: 1fr;
}
@media screen and (width >= 769px) {
  .p-typeBox__details[data-column="1"] {
    grid-template-columns: 160px 1fr;
  }
}
.p-typeBox__details dt {
  font-weight: 700;
  font-size: var(--fz-body-md);
  line-height: var(--lh-body-md);
}
.p-typeBox__details dd {
  margin: 0;
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.p-typeBox__details li {
  display: grid;
  grid-template-columns: auto 1fr;
}
.p-typeBox__details li::before {
  content: "・";
}

.p-typeColumn {
  background-color: var(--color-black-700);
  border-radius: 10px;
  padding: var(--space-base);
  margin-block-start: var(--space-sm);
}
.p-typeColumn__title {
  font-size: var(--fz-body-md);
  font-weight: 700;
  line-height: var(--lh-body-md);
}
.p-typeColumn__text {
  margin-block-start: var(--space-xs);
  font-size: var(--fz-body-sm);
  font-weight: 400;
  line-height: var(--lh-body-sm);
}

/* -----------------------------------------------------------------------
## MARK: どんな対策が必要？ ##################################################
----------------------------------------------------------------------- */
.p-measures {
  padding-block: var(--space-3xl) 0;
}
.p-measures .c-areaTitle {
  grid-template-columns: auto auto;
}

/* -----------------------------------------------------------------------
## MARK: 生活習慣の改善 ##################################################
----------------------------------------------------------------------- */
.p-measuresContents:is([data-num="1"]) {
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}

.p-lifeStyle {
  display: grid;
  gap: min(2.2099447514vw + 31.7127071823px, 60px);
  margin-block-start: var(--space-xl);
  max-width: 960px;
  margin-inline: auto;
}
@media screen and (width >= 769px) {
  .p-lifeStyle {
    justify-content: center;
    grid-template-columns: repeat(2, 29.1666666667%);
  }
}
.p-lifeStyle__image {
  width: 200px;
  margin-inline: auto;
}
.p-lifeStyle__title {
  margin-block-start: var(--space-base);
  font-size: var(--fz-heading-xs);
  line-height: var(--lh-heading-xs);
}
.p-lifeStyle__text {
  margin-block-start: min(0.8839779006vw + -3.3149171271px, 8px);
  font-size: var(--fz-body-sm);
  line-height: var(--lh-body-sm);
}

:where(.p-measuresContents:is([data-num="1"])) .p-measuresBox {
  display: grid;
  gap: var(--space-base);
  max-width: 960px;
  margin-inline: auto;
  background-color: var(--color-black-800);
  margin-block-start: var(--space-xl);
  padding: var(--space-lg) min(4.4198895028vw + 7.4254143646px, 64px);
  border-radius: 10px;
}
:where(.p-measuresContents:is([data-num="1"])) .p-measuresBox__title {
  font-size: var(--fz-heading-md);
  line-height: var(--lh-heading-md);
}
:where(.p-measuresContents:is([data-num="1"])) .p-measuresBox__text {
  font-size: var(--fz-body-md);
  line-height: var(--lh-body-md);
}
:where(.p-measuresContents:is([data-num="1"])) .p-measuresBox__text strong {
  display: block;
  margin-block-end: var(--space-xs);
}

/* -----------------------------------------------------------------------
## MARK: 尿モレ対策トレーニング ##################################################
----------------------------------------------------------------------- */
.p-measuresContents:is([data-num="2"]) {
  background-color: var(--color-black-700);
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}

:where(.p-measuresContents:is([data-num="2"])) .p-training {
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}
:where(.p-measuresContents:is([data-num="2"])) .p-training__title {
  font-size: var(--fz-heading-md);
  line-height: var(--lh-heading-md);
  margin-block-end: var(--space-base);
}
:where(.p-measuresContents:is([data-num="2"])) .p-training__text {
  font-size: var(--fz-body-sm);
  line-height: var(--lh-body-sm);
}
:where(.p-measuresContents:is([data-num="2"])) .p-point {
  position: relative;
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: min(1.1049723757vw + 75.8563535912px, 90px);
  border-style: solid;
  border-width: 10px 10px 25px 10px;
  -o-border-image: url(../../img/chousuanshinpad/anshinpad-men/bg-balloon.svg) 10 10 25 10 repeat repeat;
     border-image: url(../../img/chousuanshinpad/anshinpad-men/bg-balloon.svg) 10 10 25 10 repeat repeat;
}
:where(.p-measuresContents:is([data-num="2"])) .p-point__image {
  display: grid;
  place-items: center;
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  margin-inline: auto;
  width: 80px;
  height: 80px;
  transform: translateY(30%);
  border-radius: var(--infinity);
  background-color: var(--color-blue01);
}
@media screen and (width >= 769px) {
  :where(.p-measuresContents:is([data-num="2"])) .p-point__image {
    right: auto;
  }
}
:where(.p-measuresContents:is([data-num="2"])) .p-point__image svg {
  width: min(1.8784530387vw + 32.955801105px, 57px);
}
:where(.p-measuresContents:is([data-num="2"])) .p-point__text {
  padding: 30px min(4.4198895028vw + -2.5745856354px, 54px) min(0.773480663vw + 5.0994475138px, 15px) min(4.4198895028vw + -2.5745856354px, 54px);
  background-color: #fff;
  font-size: var(--fz-body-md);
  font-weight: 700;
  line-height: var(--lh-body-md);
}
:where(.p-measuresContents:is([data-num="2"])) .p-trainingDetails {
  display: grid;
  gap: var(--space-lg);
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}
@media screen and (width >= 769px) {
  :where(.p-measuresContents:is([data-num="2"])) .p-trainingDetails {
    grid-template-columns: repeat(2, 1fr);
  }
}
:where(.p-measuresContents:is([data-num="2"])) .p-trainingDetail {
  display: grid;
  gap: 0;
  background-color: #fff;
  border-radius: 10px;
  padding: var(--space-lg) min(1.7679558011vw + 17.3701657459px, 40px);
}
@media screen and (width >= 769px) {
  :where(.p-measuresContents:is([data-num="2"])) .p-trainingDetail {
    grid-template-rows: subgrid;
    grid-row: span 3;
  }
}
:where(.p-measuresContents:is([data-num="2"])) .p-trainingDetail__title {
  font-size: var(--fz-heading-sm);
  font-weight: 700;
  line-height: var(--lh-heading-sm);
  margin-block-end: var(--space-base);
}
:where(.p-measuresContents:is([data-num="2"])) .p-trainingDetail__step {
  counter-reset: step;
  font-size: var(--fz-body-md);
  line-height: var(--lh-body-md);
}
:where(.p-measuresContents:is([data-num="2"])) .p-trainingDetail__step > li {
  counter-increment: step;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-xs);
}
:where(.p-measuresContents:is([data-num="2"])) .p-trainingDetail__step > li::before {
  content: counter(step) ".";
}
:where(.p-measuresContents:is([data-num="2"])) .p-trainingDetail__image {
  margin-block-start: var(--space-lg);
}

/* -----------------------------------------------------------------------
## MARK: 重度の尿モレ対策 ##################################################
----------------------------------------------------------------------- */
.p-measuresContents:is([data-num="3"]) {
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}

:where(.p-measuresContents:is([data-num="3"])) .p-mediaBox {
  margin-block-start: min(3.5359116022vw + 18.7403314917px, 64px);
}
@media screen and (width < 769px) {
  :where(.p-measuresContents:is([data-num="3"])) .p-mediaBox {
    grid-template-areas: "contents" "image";
  }
  :where(.p-measuresContents:is([data-num="3"])) .p-mediaBox > .c-mediaBox__image {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  :where(.p-measuresContents:is([data-num="3"])) .p-mediaBox > .c-mediaBox__image {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  :where(.p-measuresContents:is([data-num="3"])) .p-mediaBox > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  :where(.p-measuresContents:is([data-num="3"])) .p-mediaBox > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
}
:where(.p-measuresContents:is([data-num="3"])) .c-mediaBox__title {
  color: var(--color-black-300);
}

/* -----------------------------------------------------------------------
## MARK: 医師にどう相談したらいい？ ##################################################
----------------------------------------------------------------------- */
.p-howToTalk {
  background-color: var(--color-black-700);
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}

:where(.p-howToTalk) .p-mediaBox {
  margin-block-start: var(--space-xl);
}
:where(.p-howToTalk) .p-mediaBox + .p-mediaBox {
  margin-block-start: var(--space-3xl);
}
:where(.p-howToTalk) .c-mediaBox__title {
  color: var(--color-black-300);
}
:where(.p-howToTalk) .c-mediaBox__image {
  position: relative;
}
:where(.p-howToTalk) .p-mediaBox__num {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  border-radius: 0 !important;
}
:where(.p-howToTalk) .p-mediaBox__check {
  position: absolute;
  top: min(0.8839779006vw + -67.3149171271px, -56px);
  right: max(-3.5359116022vw + 5.2596685083px, -40px);
  z-index: 2;
  width: 80px;
  height: 80px;
  background-color: var(--color-blue01);
  border-radius: var(--infinity);
  display: grid;
  place-items: center;
}
:where(.p-howToTalk) .p-mediaBox__check img {
  width: min(1.9889502762vw + 36.5414364641px, 62px);
  height: auto;
}
:where(.p-howToTalk) .c-button[data-type=outline] {
  --color: var(--color-blue01);
  --border-color: var(--color-blue01);
  position: relative;
  margin-inline: auto;
}
@media screen and (width >= 769px) {
  :where(.p-howToTalk) .c-button[data-type=outline] {
    margin-inline: 0;
  }
}
:where(.p-howToTalk) .c-button[data-type=outline]:has(.p-mediaBox__check) {
  margin-block-start: 56px;
}
:where(.p-howToTalk) .p-howToTalkList {
  counter-reset: step;
}
:where(.p-howToTalk) .p-howToTalkList > li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-xxs);
  counter-increment: step;
}
:where(.p-howToTalk) .p-howToTalkList > li::before {
  content: counter(step) ".";
}

/* -----------------------------------------------------------------------
## MARK: 医師にどう相談したらいい？ ##################################################
----------------------------------------------------------------------- */
.p-deduction {
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}
.p-deduction__lead {
  text-align: center;
  color: var(--color-blue01);
  margin-block-start: var(--space-xl);
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.p-deduction__image {
  width: 100%;
  max-width: 557px;
  margin-block-start: var(--space-xl);
  margin-inline: auto;
}

.p-deductionBox {
  max-width: 960px;
  margin-inline: auto;
  background-color: var(--color-black-700);
  border-radius: 10px;
  padding: var(--space-lg) min(6.1878453039vw + 0.7955801105px, 80px);
  margin-block-start: var(--space-xl);
}
.p-deductionBox__title {
  font-size: var(--fz-heading-md);
  line-height: var(--lh-heading-md);
}
.p-deductionBox__text {
  font-size: var(--fz-body-md);
  line-height: var(--lh-body-md);
  margin-block-start: var(--space-base);
}

:where(.p-deductionBox) .c-button {
  background-image: linear-gradient(93deg, var(--color-black-300) 2.82%, var(--color-black-400) 100%);
  margin-inline: auto;
  margin-block-start: var(--space-base);
}

/* -----------------------------------------------------------------------
## MARK: シーン ##################################################
----------------------------------------------------------------------- */
.p-anshinpadMenPage .c-typeSelect {
  padding-block-end: min(2.2099447514vw + 91.7127071823px, 120px);
}

/* -----------------------------------------------------------------------
## Archive ##################################################
----------------------------------------------------------------------- */
.p-blogFilter__title {
  margin-block-end: var(--space-base);
  font-size: var(--fz-heading-sm);
  font-weight: 700;
  line-height: var(--lh-heading-sm);
}

.p-blogFilterList {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-base) var(--space-sm);
}
.p-blogFilterList__item {
  border-radius: 100px;
  font-size: var(--fz-body-md);
  font-weight: 700;
  line-height: var(--lh-body-md);
}
.p-blogFilterList__link {
  display: grid;
  grid-template-columns: auto auto;
  padding: 4px min(0.6629834254vw + 3.5138121547px, 12px) 4px var(--space-sm);
  border-radius: 4px;
  transition: var(--animation-color);
}
.p-blogFilterList__link:is(.is-current *) {
  grid-template-columns: auto auto auto;
  gap: var(--space-xxs);
  background: var(--color-blue01);
  color: var(--color-black-900);
}
.p-blogFilterList__link:is(.is-current *)::before {
  align-self: center;
  content: "";
  display: block;
  width: 14px;
  height: 10px;
  margin-inline-end: 4px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2014%2010%22%3E%0D%0A%20%20%3Cpath%20d%3D%22M5.56%209.28c-.2.17-.4.25-.6.25a.75.75%200%200%201-.52-.25L.97%205.84a.76.76%200%200%201-.22-.56c0-.23.07-.42.22-.56.35-.36.73-.36%201.12%200L5%207.62l6.94-6.9a.83.83%200%200%201%201.12%200c.17.14.25.32.25.53%200%20.2-.08.4-.25.56l-7.5%207.47Z%22%20fill%3D%22%23FFF%22%2F%3E%0D%0A%3C%2Fsvg%3E") no-repeat center center/14px auto;
}
@media (hover: hover) and (pointer: fine) {
  .p-blogFilterList__link:not(.is-current *):hover {
    color: var(--color-blue01);
    text-decoration: none;
  }
}
.p-blogFilterList__count {
  color: var(--color-blue01);
}
.p-blogFilterList__count:is(.is-current *) {
  color: var(--color-black-900);
}

.p-blogArchive .c-blogList {
  margin-block-start: var(--space-xl);
}

/* -----------------------------------------------------------------------
## Single ##################################################
----------------------------------------------------------------------- */
.p-blogSingle__backButton {
  margin-block-start: var(--space-xl);
  margin-inline: auto;
}

.p-blogSingleMeta {
  display: flex;
  flex-wrap: wrap;
  gap: 0 8px;
  color: var(--color-black-400);
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.p-blogSingleMeta__date {
  display: grid;
  grid-template-columns: 14px auto;
  gap: 4px;
  align-items: center;
}
.p-blogSingleMeta__date svg {
  position: relative;
  top: 2px;
  width: 14px;
}
.p-blogSingleMeta .c-blogListItemTerm {
  display: grid;
  grid-template-columns: 14px auto;
  gap: 4px;
  align-items: center;
}
.p-blogSingleMeta .c-blogListItemTerm svg {
  position: relative;
  top: 2px;
  width: 14px;
}

.p-blogSingleContent {
  max-width: 800px;
  margin-inline: auto;
  container-type: inline-size;
  container-name: blogSingleContent;
}
.p-blogSingleContent > *:not(.p-blogSingleMeta) {
  margin-block-start: var(--space-lg);
}

.p-blogSingleContent .wp-block-image.aligncenter,
.p-blogSingleContent .wp-block-image.aligncenter,
.p-blogSingleContent .wp-block-post-featured-image.aligncenter,
.p-blogSingleContent .wp-block-post-featured-image.alignright,
.editor-styles-wrapper .wp-block-image.aligncenter,
.editor-styles-wrapper .wp-block-image.aligncenter,
.editor-styles-wrapper .wp-block-post-featured-image.aligncenter,
.editor-styles-wrapper .wp-block-post-featured-image.alignright {
  display: block;
}
.p-blogSingleContent img,
.editor-styles-wrapper img {
  width: -moz-fit-content;
  width: fit-content;
  height: auto;
  max-width: 100%;
}
.p-blogSingleContent img:is(.wp-block-image.aligncenter *), .p-blogSingleContent img:is(.wp-block-post-featured-image.aligncenter *),
.editor-styles-wrapper img:is(.wp-block-image.aligncenter *),
.editor-styles-wrapper img:is(.wp-block-post-featured-image.aligncenter *) {
  margin-inline: auto;
}
.p-blogSingleContent img:is(.wp-block-image.alignright *), .p-blogSingleContent img:is(.wp-block-post-featured-image.alignright *),
.editor-styles-wrapper img:is(.wp-block-image.alignright *),
.editor-styles-wrapper img:is(.wp-block-post-featured-image.alignright *) {
  margin-inline: auto 0;
}

/* -----------------------------------------------------------------------
## MARK: 目次 ##################################################
----------------------------------------------------------------------- */
#toc_container {
  padding: var(--space-base);
  background-color: #fff;
  border-radius: 10px;
}
#toc_container .toc_title {
  text-align: center;
  font-size: var(--fz-heading-lg);
  font-weight: 700;
  line-height: var(--lh-heading-lg);
  margin-block-end: var(--space-base);
}
#toc_container .toc_list {
  display: grid;
  gap: var(--space-sm);
}
#toc_container .toc_list li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px;
}
#toc_container .toc_list li::before {
  position: relative;
  top: 8px;
  content: "";
  display: block;
  width: 14px;
  height: 10px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2014%2010%22%3E%3Cpath%20d%3D%22M5.56%209.28c-.2.17-.4.25-.6.25a.75.75%200%200%201-.52-.25L.97%205.84a.76.76%200%200%201-.22-.56c0-.23.07-.42.22-.56.35-.36.73-.36%201.12%200L5%207.62l6.94-6.9a.83.83%200%200%201%201.12%200c.17.14.25.32.25.53%200%20.2-.08.4-.25.56l-7.5%207.47Z%22%20fill%3D%22%23222%22%2F%3E%3C%2Fsvg%3E") no-repeat center center/contain;
}
#toc_container .toc_list a {
  text-decoration: underline;
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
@media (hover: hover) and (pointer: fine) {
  #toc_container .toc_list a:hover {
    text-decoration: none;
  }
}
#toc_container .toc_accordionButton {
  display: none;
  margin-inline: max(-0.8839779006vw + -12.6850828729px, -24px);
  margin-block-end: max(-0.8839779006vw + -12.6850828729px, -24px);
  padding-block-end: var(--space-base);
}
@container blogSingleContent (width > 1px) {
  #toc_container .toc_accordionButton {
    width: 100cqi;
  }
}
#toc_container .toc_accordionButton__text {
  text-align: center;
  font-size: var(--fz-body-md);
  font-weight: 700;
  line-height: var(--lh-body-md);
}
#toc_container .toc_accordionButton__text::after {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2018%2010%22%3E%3Cpath%20d%3D%22M9.75%209.13c-.22.21-.47.32-.75.32s-.53-.1-.75-.32l-6.52-6.8c-.5-.5-.5-.99%200-1.46.5-.5%201-.5%201.5%200l5.77%206%205.77-6a.89.89%200%200%201%20.7-.32c.31%200%20.58.1.8.32.5.47.5.96%200%201.46l-6.52%206.8Z%22%20fill%3D%22%23222%22%2F%3E%3C%2Fsvg%3E") no-repeat center center/18px auto;
  margin-inline: auto;
  transform-origin: center;
}
#toc_container .toc_accordionButton__text:is([aria-expanded=true] *)::after {
  transform: rotate(180deg);
}
@media (hover: hover) and (pointer: fine) {
  #toc_container .toc_accordionButton:hover .toc_accordionButton__text {
    color: var(--color-purple01);
  }
  #toc_container .toc_accordionButton:hover .toc_accordionButton__text::after {
    content: "";
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2018%2010%22%3E%3Cpath%20d%3D%22M9.75%209.13c-.22.21-.47.32-.75.32s-.53-.1-.75-.32l-6.52-6.8c-.5-.5-.5-.99%200-1.46.5-.5%201-.5%201.5%200l5.77%206%205.77-6a.89.89%200%200%201%20.7-.32c.31%200%20.58.1.8.32.5.47.5.96%200%201.46l-6.52%206.8Z%22%20fill%3D%22%23907cc7%22%2F%3E%3C%2Fsvg%3E") no-repeat center center/18px auto;
  }
}
#toc_container:has(.toc_list > li:nth-child(4)) .toc_accordionButton {
  display: block;
}
#toc_container:has(.toc_list > li:nth-child(4)) .toc_accordion {
  overflow: hidden;
}
#toc_container:has(.toc_list > li:nth-child(4)) .toc_list {
  padding-bottom: 15px;
}

/* -----------------------------------------------------------------------
## MARK: 本文ベース ##################################################
----------------------------------------------------------------------- */
.p-blogSingleContent p,
.editor-styles-wrapper p {
  font-size: var(--fz-body-md);
  line-height: var(--lh-body-md);
}
.p-blogSingleContent p:is(.is-style-notes),
.editor-styles-wrapper p:is(.is-style-notes) {
  position: relative;
  line-height: var(--lh-body-xs);
  font-size: var(--fz-body-xs);
  padding-inline-start: 1.2em;
}
.p-blogSingleContent p:is(.is-style-notes)::before,
.editor-styles-wrapper p:is(.is-style-notes)::before {
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
}
.p-blogSingleContent p:is(.has-background),
.editor-styles-wrapper p:is(.has-background) {
  padding: var(--space-base);
  border-radius: 10px;
}

/* -----------------------------------------------------------------------
## MARK: 見出し ##################################################
----------------------------------------------------------------------- */
.wp-block-heading {
  font-size: var(--fz-heading-sm);
  line-height: var(--lh-heading-sm);
  font-weight: 700;
}
.wp-block-heading:is(.has-background) {
  padding: var(--space-xxs) var(--space-xs);
}
.wp-block-heading:is(.is-style-heading01) {
  background-color: var(--color-purple01);
  color: var(--color-black-900);
  line-height: var(--lh-heading-lg);
  font-size: var(--fz-heading-lg);
  padding: var(--space-xxs) var(--space-xs);
}
.wp-block-heading:is(.is-style-heading02) {
  background-color: var(--color-black-500);
  color: var(--color-black-900);
  line-height: var(--lh-heading-md);
  font-size: var(--fz-heading-md);
  padding: var(--space-xxs) var(--space-xs);
}
.wp-block-heading:is(.is-style-heading03) {
  line-height: var(--lh-heading-md);
  font-size: var(--fz-heading-md);
  padding-block-end: var(--space-xs);
  border-bottom: 1px solid var(--color-black-600);
}
.wp-block-heading:is(.is-style-heading04) {
  color: var(--color-purple01);
  line-height: var(--lh-heading-md);
  font-size: var(--fz-heading-md);
}
.wp-block-heading:is(.is-style-heading05) {
  color: var(--color-purple02);
  line-height: var(--lh-heading-sm);
  font-size: var(--fz-heading-sm);
}

/* -----------------------------------------------------------------------
## MARK: テキストリンク ##################################################
----------------------------------------------------------------------- */
.p-blogSingleContent a:not(.wp-block-button__link),
.editor-styles-wrapper a:not(.wp-block-button__link) {
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .p-blogSingleContent a:not(.wp-block-button__link):hover,
  .editor-styles-wrapper a:not(.wp-block-button__link):hover {
    text-decoration: none;
  }
}
.p-blogSingleContent a:not(.wp-block-button__link):is([target=_blank]),
.editor-styles-wrapper a:not(.wp-block-button__link):is([target=_blank]) {
  display: inline-flex;
  align-items: center;
}
.p-blogSingleContent a:not(.wp-block-button__link):is([target=_blank])::after,
.editor-styles-wrapper a:not(.wp-block-button__link):is([target=_blank])::after {
  content: "";
  width: 1em;
  height: 1em;
  margin-inline-start: var(--space-xxs);
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M15.31%2011.9H4.81a.79.79%200%200%201-.53-.18.79.79%200%200%201-.19-.53V.69c0-.19.07-.35.2-.47A.72.72%200%200%201%204.8%200h10.5a.6.6%200%200%201%20.47.22.6.6%200%200%201%20.22.47v10.5c0%20.2-.07.38-.22.53a.64.64%200%200%201-.47.19ZM5.5%2010.5h9.1V1.4H5.5v9.1Zm6.06%204.66V13.3a.42.42%200%200%200-.15-.34.51.51%200%200%200-.38-.16.51.51%200%200%200-.37.16c-.1.08-.16.2-.16.34v1.66H1.06V5.5H2.7c.33%200%20.5-.17.5-.5a.51.51%200%200%200-.16-.38.42.42%200%200%200-.34-.15H.84a.81.81%200%200%200-.59.25.81.81%200%200%200-.25.6v9.87c0%20.23.08.42.25.6.17.14.36.21.6.21h9.87c.23%200%20.43-.08.6-.25a.81.81%200%200%200%20.24-.6Z%22%20fill%3D%22%23222%22%2F%3E%3C%2Fsvg%3E") no-repeat center center/cover;
}
@media (hover: hover) and (pointer: fine) {
  .p-blogSingleContent a:not(.wp-block-button__link):is([target=_blank]):hover::after,
  .editor-styles-wrapper a:not(.wp-block-button__link):is([target=_blank]):hover::after {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M15.31%2011.9H4.81a.79.79%200%200%201-.53-.18.79.79%200%200%201-.19-.53V.69c0-.19.07-.35.2-.47A.72.72%200%200%201%204.8%200h10.5a.6.6%200%200%201%20.47.22.6.6%200%200%201%20.22.47v10.5c0%20.2-.07.38-.22.53a.64.64%200%200%201-.47.19ZM5.5%2010.5h9.1V1.4H5.5v9.1Zm6.06%204.66V13.3a.42.42%200%200%200-.15-.34.51.51%200%200%200-.38-.16.51.51%200%200%200-.37.16c-.1.08-.16.2-.16.34v1.66H1.06V5.5H2.7c.33%200%20.5-.17.5-.5a.51.51%200%200%200-.16-.38.42.42%200%200%200-.34-.15H.84a.81.81%200%200%200-.59.25.81.81%200%200%200-.25.6v9.87c0%20.23.08.42.25.6.17.14.36.21.6.21h9.87c.23%200%20.43-.08.6-.25a.81.81%200%200%200%20.24-.6Z%22%20fill%3D%22%23907cc7%22%2F%3E%3C%2Fsvg%3E") no-repeat center center/cover;
  }
}

/* -----------------------------------------------------------------------
## MARK: テーブル ##################################################
----------------------------------------------------------------------- */
.wp-block-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  border: 1px solid var(--color-black-700);
  background-color: #fff;
}
.wp-block-table thead {
  border: 0;
}
.wp-block-table th {
  vertical-align: top;
  text-align: left;
  padding: 8px;
  background-color: var(--color-purple01);
  color: var(--color-black-900);
  border: 1px solid var(--color-black-700);
  font-size: var(--fz-body-md);
  font-weight: 700;
  line-height: var(--lh-body-md);
}
.wp-block-table td {
  text-align: left;
  vertical-align: top;
  padding: 8px;
  border: 1px solid var(--color-black-700);
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}

/* -----------------------------------------------------------------------
## MARK: リスト ##################################################
----------------------------------------------------------------------- */
.wp-block-list {
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.wp-block-list li:is(ul *) {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-xxs);
}
.wp-block-list li:is(ul *)::before {
  content: "・";
}
.wp-block-list li:is(ol *) {
  list-style: revert;
  list-style-position: inside;
}
.wp-block-list li:is(ol *):is(.editor-styles-wrapper *) {
  list-style-position: revert;
}

/* -----------------------------------------------------------------------
## MARK: グループブロック ##################################################
----------------------------------------------------------------------- */
.wp-block-group:is(.has-background) {
  padding: var(--space-base);
  border-radius: 10px;
}

/* -----------------------------------------------------------------------
## 安心パッドの想い ##################################################
----------------------------------------------------------------------- */
.p-brandPage .p-overview {
  position: relative;
  background: url(../../img/chousuanshinpad/brand/bg-overview_pc.jpg) no-repeat center center/cover;
  padding-block: var(--space-3xl) min(11.0497237569vw + 22.5635359116px, 164px);
}
.p-brandPage .p-overview__inner {
  max-width: 960px;
  margin-inline: auto;
  box-sizing: content-box;
  padding-inline: var(--px-content);
}
.p-brandPage .p-overview__title {
  color: var(--color-purple01);
  font-size: min(3.5359116022vw + 26.7403314917px, 72px);
  font-weight: 400;
  font-family: var(--ff-zen);
  line-height: 1.16;
}
@media screen and (width >= 769px) {
  .p-brandPage .p-overview__title {
    text-align: center;
  }
}
.p-brandPage .p-overview__media {
  display: grid;
  gap: var(--space-2xl);
  margin-block-start: 40px;
}
@media screen and (width >= 769px) {
  .p-brandPage .p-overview__media {
    align-items: center;
    grid-template-columns: auto 45.8333333333%;
  }
}
.p-brandPage .p-overview__text {
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg-lead);
}
.p-brandPage .p-overview__text strong {
  color: var(--color-purple01);
}
.p-brandPage .p-overview__text:nth-child(n+2) {
  margin-block-start: 2em;
}
.p-brandPage .p-overview__image img {
  filter: drop-shadow(10px 20px 20px rgba(217, 217, 217, 0.2));
}
@keyframes ticker {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
.p-brandPage .p-ticker {
  overflow: hidden;
  display: grid;
  grid-template-columns: auto auto;
  margin-block-start: var(--space-2xl);
}
@media screen and (width >= 769px) {
  .p-brandPage .p-ticker {
    margin-block-start: var(--space-3xl);
  }
}
.p-brandPage .p-ticker__group {
  display: grid;
  gap: var(--space-base);
  grid-template-columns: repeat(3, 621px);
  padding-inline-start: var(--space-base);
  animation: ticker 20s linear 0s infinite normal forwards running;
}

/* -----------------------------------------------------------------------
## 背景（PCのみ） #######################################
----------------------------------------------------------------------- */
.p-brandPage .p-bg {
  background: url(../../img/chousuanshinpad/brand/bg.png) repeat-y center top 70px/auto auto;
}

/* -----------------------------------------------------------------------
## ずっと”もっと良く”を追い求めてきました #######################################
----------------------------------------------------------------------- */
.p-brandPage .p-improvement {
  padding-block: var(--space-3xl) 0;
  padding-inline: var(--px-content);
}
.p-brandPage .p-improvement__lead {
  margin-block-start: var(--space-xl);
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
}
@media screen and (width >= 769px) {
  .p-brandPage .p-improvement__lead {
    text-align: center;
  }
}
.p-brandPage .p-improvement__lead strong {
  color: var(--color-purple01);
}
.p-brandPage .p-improvement__image {
  margin-block-start: var(--space-lg);
  margin-inline: auto;
}

/* -----------------------------------------------------------------------
## これまでのあゆみ #######################################
----------------------------------------------------------------------- */
.p-brandPage .p-history {
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
}
.p-brandPage .p-historyBoxes {
  max-width: 960px;
  margin-inline: auto;
  margin-block-start: var(--space-xl);
}
.p-brandPage .p-historyBox {
  position: relative;
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: var(--space-xl) var(--space-sm);
  padding-block-end: var(--space-xl);
}
@media screen and (width >= 769px) {
  .p-brandPage .p-historyBox {
    gap: 0 var(--space-sm);
    grid-template-columns: 32px 1fr 46.6666666667%;
  }
}
.p-brandPage .p-historyBox:last-child {
  padding-block-end: 0;
}
.p-brandPage .p-historyBox::before {
  position: relative;
  top: min(1.3259668508vw + -0.9723756906px, 16px);
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  background-color: var(--color-purple01);
  border-radius: calc(infinity * 1px);
  grid-row: 1/3;
}
.p-brandPage .p-historyBox::after {
  position: absolute;
  top: min(1.3259668508vw + -0.9723756906px, 16px);
  left: 14.5px;
  width: 3px;
  height: 100%;
  background-color: var(--color-purple01);
  content: "";
}
.p-brandPage .p-historyBox:last-child::after {
  display: none;
}
@media screen and (width >= 769px) {
  .p-brandPage .p-historyBox__contents {
    padding-inline-end: min(4.6875vw + -12px, 48px);
  }
}
.p-brandPage .p-historyBox__year {
  margin-block-end: var(--space-xxs);
  color: var(--color-purple01);
  font-size: var(--fz-heading-xl);
  font-weight: 700;
  line-height: var(--lh-heading-xl);
}
.p-brandPage .p-historyBox__title {
  margin-block-end: var(--space-base);
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.p-brandPage .p-historyBox__text {
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.p-brandPage .p-historyBox__notes {
  margin-block-start: var(--space-xs);
  display: grid;
  grid-template-columns: 1em 1fr;
  gap: var(--space-xxs);
  font-size: var(--fz-body-xs);
  font-weight: 400;
  line-height: var(--lh-body-xs);
}
.p-brandPage .p-historyBox__notes::before {
  content: "※";
}
.p-brandPage .p-historyBox__notes small {
  font-size: inherit;
}
.p-brandPage .p-historyBox .c-button {
  width: 100%;
  max-width: 295px;
  margin-block-start: var(--space-base);
}

/* -----------------------------------------------------------------------
## MARK: Anchor ##################################################
----------------------------------------------------------------------- */
.p-featuresPage .p-featuresAnchors {
  display: grid;
  gap: var(--space-base);
}
@media screen and (width >= 769px) {
  .p-featuresPage .p-featuresAnchors {
    gap: var(--space-lg);
    grid-template-columns: repeat(3, auto);
    justify-content: center;
  }
}

/* -----------------------------------------------------------------------
## MARK: Features ##################################################
----------------------------------------------------------------------- */
.p-featuresPage .p-feature01 {
  padding-block: var(--space-xl) 0;
}
.p-featuresPage .p-feature02 {
  padding-block: var(--space-3xl);
}
.p-featuresPage .p-featureSectionTitle {
  display: grid;
  align-items: center;
  gap: 8px 10px;
  color: var(--color-blue01);
  text-align: center;
  font-size: var(--fz-heading-xl);
  font-weight: 700;
  line-height: var(--lh-heading-xl);
}
@media screen and (width >= 769px) {
  .p-featuresPage .p-featureSectionTitle {
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
    grid-template-columns: auto auto;
  }
}
.p-featuresPage .p-featureSectionTitle svg {
  position: relative;
  top: 2px;
  height: min(1.7679558011vw + 11.3701657459px, 34px);
  margin-inline: auto;
}
@media screen and (width >= 769px) {
  .p-featuresPage .p-featureSectionTitle svg {
    margin-block-end: 0;
  }
}
.p-featuresPage .p-features .p-mediaBox {
  margin-block-start: var(--space-xl);
}
.p-featuresPage .p-features .p-mediaBox__movie {
  padding-block-start: var(--space-lg);
  border-top: 1px solid var(--color-black-600);
}
.p-featuresPage .p-features .p-mediaBox + .c-mediaBox {
  margin-block-start: var(--space-3xl);
}
.p-featuresPage .p-feature {
  display: grid;
  gap: var(--space-base);
  grid-template-columns: 100px 1fr;
  border-top: 1px solid var(--color-black-600);
  padding-block-start: var(--space-base);
}
.p-featuresPage .p-feature__image figcaption {
  text-align: center;
  font-size: var(--fz-body-xs);
  font-weight: 400;
  line-height: var(--lh-body-xs);
  margin-block-end: 8px;
}
.p-featuresPage .p-feature__image img {
  border-radius: calc(infinity * 1px);
}
.p-featuresPage .p-feature__contents {
  display: grid;
  align-content: center;
  gap: var(--space-sm);
}
.p-featuresPage .p-feature__title {
  font-size: var(--fz-heading-xs);
  font-weight: 700;
  line-height: var(--lh-heading-xs);
}
.p-featuresPage .p-feature__text {
  font-size: var(--fz-body-sm);
  font-weight: 400;
  line-height: var(--lh-body-sm);
}
.p-featuresPage .p-feature + .p-feature {
  border-top: none;
  padding-block-start: 0;
}
.p-featuresPage .p-feature02 {
  padding-inline: var(--px-content);
}
.p-featuresPage .p-feature02__text {
  position: relative;
  border-radius: 10px;
  border-style: solid;
  border-width: 25px 10px 10px 10px;
  -o-border-image: url(../../img/chousuanshinpad/features/bg-balloon.svg) 25 10 10 10 repeat repeat;
     border-image: url(../../img/chousuanshinpad/features/bg-balloon.svg) 25 10 10 10 repeat repeat;
  padding: min(0.773480663vw + -2.9005524862px, 7px) min(0.8839779006vw + 2.6850828729px, 14px) min(0.8839779006vw + 2.6850828729px, 14px);
  margin-block-start: 16px;
  font-size: var(--fz-body-md);
  font-weight: 700;
  line-height: var(--lh-body-md);
}
.p-featuresPage .p-feature02__text::before {
  content: "";
  position: absolute;
  bottom: 100%;
  right: 16px;
  display: block;
  width: min(1.7679558011vw + 57.3701657459px, 80px);
  height: min(1.7679558011vw + 57.3701657459px, 80px);
  background: url(../../img/chousuanshinpad/features/ico-new.svg) no-repeat center center/contain;
}

/* -----------------------------------------------------------------------
## MARK: Movie ##################################################
----------------------------------------------------------------------- */
.p-featuresPage .p-movie {
  padding-inline: var(--px-content);
  padding-block: 100px;
  background: url(../../img/chousuanshinpad/features/bg-movie_sp.jpg) no-repeat center top/cover;
}
@media screen and (width >= 769px) {
  .p-featuresPage .p-movie {
    background: url(../../img/chousuanshinpad/features/bg-movie_pc.jpg) no-repeat center top/cover;
  }
}
.p-featuresPage .p-movieContents {
  margin-block-start: var(--space-xl);
}
.p-featuresPage .p-movieItem {
  display: block;
  max-width: 540px;
  margin-inline: auto;
}
.p-featuresPage .p-movieItem img {
  width: 100%;
  height: auto;
}

/* -----------------------------------------------------------------------
## MARK: Doctor ##################################################
----------------------------------------------------------------------- */
.p-featuresPage .p-recommendation {
  position: relative;
  padding-block: var(--space-3xl);
  padding-inline: var(--px-content);
  background-color: var(--color-purple03);
}
@media screen and (width < 769px) {
  .p-featuresPage .p-recommendation .c-sectionTitle img[src*=title] {
    height: 28px;
  }
}
.p-featuresPage .p-recommendation .p-badge {
  position: absolute;
  top: -2px;
  left: 0;
  right: 0;
  max-width: min(71.9337016575vw + 75.2486187845px, 996px);
  margin-inline: auto;
}
.p-featuresPage .p-recommendation .p-badge img {
  width: min(12.5966850829vw + 32.7624309392px, 194px);
}
.p-featuresPage .p-recommendation__lead {
  font-size: var(--fz-body-lg);
  font-weight: 400;
  line-height: var(--lh-body-lg);
  margin-block-start: var(--space-xl);
  text-align: center;
  max-width: 600px;
  margin-inline: auto;
}
.p-featuresPage .p-recommendation__notes {
  margin-block-start: 8px;
  max-width: 600px;
  margin-inline: auto;
}
.p-featuresPage .p-recommendation__bnr {
  max-width: 800px;
  margin-block: min(2.6519337017vw + 30.0552486188px, 64px);
  margin-inline: auto;
}
.p-featuresPage .p-recommendation .p-mediaBox {
  grid-template-areas: "contents" "image";
  gap: var(--space-2xl);
  margin-block-start: var(--space-xl);
}
@media screen and (width >= 769px) {
  .p-featuresPage .p-recommendation .p-mediaBox {
    grid-template-areas: "contents image";
  }
  .p-featuresPage .p-recommendation .p-mediaBox > .c-mediaBox__image {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .p-featuresPage .p-recommendation .p-mediaBox > .c-mediaBox__image {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .p-featuresPage .p-recommendation .p-mediaBox > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .p-featuresPage .p-recommendation .p-mediaBox > .c-mediaBox__contents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
}
.p-featuresPage .p-recommendation .c-mediaBox__text strong {
  color: var(--color-purple01);
}
.p-featuresPage .p-recommendation .p-recommendation__caption {
  text-align: center;
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
  margin-block-start: var(--space-base);
}
.p-featuresPage .p-recommendation .p-recommendation__caption span, .p-featuresPage .p-recommendation .p-recommendation__caption b {
  display: block;
}
.p-featuresPage .p-recommendation .p-recommendation__caption b {
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.p-featuresPage .p-recommendation .p-caption {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px;
  margin-block-start: var(--space-base);
  font-size: var(--fz-body-xs);
  font-weight: 400;
  line-height: var(--lh-body-xs);
}
.p-featuresPage .p-recommendation .p-caption dd {
  margin: 0;
}
.p-featuresPage .p-recommendation .c-notes {
  margin-block-start: 4px;
}
.p-featuresPage .p-reasons {
  display: grid;
  gap: var(--space-lg);
  background-color: var(--color-black-900);
  margin-block-start: var(--space-xl);
  padding: var(--space-2xl) min(3.9779005525vw + 9.0828729282px, 60px);
}
.p-featuresPage .p-reasonsSectionTitle {
  color: var(--color-blue01);
  text-align: center;
  font-size: var(--fz-heading-xl);
  font-weight: 700;
  line-height: var(--lh-heading-xl);
}
.p-featuresPage .p-reason__title {
  display: grid;
  grid-template-columns: min(0.8839779006vw + 44.6850828729px, 56px) 1fr;
  gap: 0 12px;
  align-items: center;
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.p-featuresPage .p-reason__title img {
  width: min(0.8839779006vw + 44.6850828729px, 56px);
  height: min(0.8839779006vw + 44.6850828729px, 56px);
}
.p-featuresPage .p-reason__text {
  margin-block-start: var(--space-xs);
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}
.p-featuresPage .p-ascDoctor {
  display: grid;
  gap: var(--space-base);
  margin-block-start: var(--space-xl);
  padding: var(--space-lg) min(4.4198895028vw + 7.4254143646px, 64px);
  background-color: var(--color-black-900);
  border-radius: 10px;
}
.p-featuresPage .p-ascDoctor__title {
  color: var(--color-purple01);
  font-size: var(--fz-heading-md);
  font-weight: 700;
  line-height: var(--lh-heading-md);
}
.p-featuresPage .p-ascDoctor__text {
  font-size: var(--fz-body-md);
  font-weight: 400;
  line-height: var(--lh-body-md);
}

/* -----------------------------------------------------------------------
## FAQ ##################################################
----------------------------------------------------------------------- */
.p-faqPage .c-areaTitle {
  margin-block-start: var(--space-xl);
}
.p-faqPage .c-faqBoxes {
  margin-block-start: 64px;
}

@media screen and (width >= 769px) {
  .u-spbr {
    display: none;
  }
}

@media screen and (width < 769px) {
  .u-pcbr {
    display: none;
  }
}

.u-preline {
  white-space: pre-line;
}