.main-new25 .sukima-lp {
  --sukima-line: rgba(33, 98, 118, 0.14);
  --sukima-text: #173b49;
  --sukima-muted: #5b7781;
  --sukima-sub: #3e95b6;
  --sukima-sub-strong: #2f7892;
  --sukima-teal: #63beb5;
  --sukima-sky: #78b4eb;
  --sukima-money: #e86a9d;
  --sukima-money-strong: #d94a84;
  --sukima-money-soft: #fff1f7;
  --sukima-surface: #f4fbfc;
  --sukima-surface-strong: #e6f4f7;
  --sukima-shadow: 0 .25rem .75rem rgba(15, 73, 86, 0.1);
  background-color: #fbfefe;
  background-image:
    linear-gradient(180deg, rgba(246, 252, 252, 0.98) 0%, rgba(255, 255, 255, 0.99) 24rem, rgba(243, 249, 252, 0.98) 100%),
    radial-gradient(circle at 16% 10%, rgba(112, 198, 198, 0.14) 0, rgba(112, 198, 198, 0.14) 4.5rem, transparent 4.5rem),
    radial-gradient(circle at 92% 12%, rgba(120, 180, 235, 0.14) 0, rgba(120, 180, 235, 0.14) 5rem, transparent 5rem),
    radial-gradient(circle at 20% 86%, rgba(179, 228, 223, 0.12) 0, rgba(179, 228, 223, 0.12) 4rem, transparent 4rem),
    radial-gradient(circle, rgba(120, 180, 235, 0.1) 0.09rem, transparent 0.1rem),
    radial-gradient(circle, rgba(116, 203, 190, 0.08) 0.09rem, transparent 0.1rem);
  background-position:
    0 0,
    0 0,
    0 0,
    0 0,
    0 0,
    0.625rem 0.625rem;
  background-size:
    auto,
    auto,
    auto,
    auto,
    1.25rem 1.25rem,
    1.25rem 1.25rem;
  color: var(--sukima-text);
  font-family: "Open Sans", sans-serif;
  font-size: 0.875rem;
  font-variation-settings: normal;
  margin: 0 auto;
  /*max-width: 27.5rem;*/
  padding: 0.625rem 0.5rem 3rem;
  width: 100%;
}

.main-new25 .sukima-lp *,
.main-new25 .sukima-lp *::before,
.main-new25 .sukima-lp *::after {
  box-sizing: border-box;
}

.main-new25 .sukima-lp .sukima-delay-1 {
  transition-delay: 0.1s;
}

.main-new25 .sukima-lp .sukima-delay-2 {
  transition-delay: 0.2s;
}

.main-new25 .sukima-lp .sukima-delay-3 {
  transition-delay: 0.3s;
}

.main-new25 .sukima-lp .sukima-delay-4 {
  transition-delay: 0.4s;
}

.main-new25 .sukima-lp .sukima-kana {
  display: inline-block;
  font-size: 0.8em;
}

.main-new25 .sukima-lp h3 .sukima-kana,
.main-new25 .sukima-lp p .sukima-kana {
  font-size: 1em;
}

.main-new25 .sukima-lp .sukima-sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 0.0625rem;
  margin: -0.0625rem;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 0.0625rem;
}

.sukima-hero,
.sukima-modal-dialog {
  background: #fff;
  border: 0.0625rem solid var(--sukima-line);
  border-radius: 1.5rem;
  box-shadow: var(--sukima-shadow);
}

.sukima-hero {
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  margin: -0.625rem -0.5rem -2rem;
  overflow: hidden;
  position: relative;
}

.sukima-hero::before {
  background:
    radial-gradient(circle at 14% 12%, rgba(111, 198, 194, 0.18) 0, rgba(111, 198, 194, 0.18) 5rem, transparent 5rem),
    radial-gradient(circle at 88% 10%, rgba(141, 193, 236, 0.14) 0, rgba(141, 193, 236, 0.14) 6rem, transparent 6rem),
    radial-gradient(circle at 76% 34%, rgba(212, 240, 239, 0.2) 0, rgba(212, 240, 239, 0.2) 3.5rem, transparent 3.5rem),
    linear-gradient(135deg, rgba(214, 229, 232, 0.08) 0, rgba(214, 229, 232, 0.08) 0.0625rem, transparent 0.0625rem, transparent 1rem);
  background-size: auto, auto, auto, 1rem 1rem;
  content: "";
  inset: 0;
  opacity: 0.8;
  pointer-events: none;
  position: absolute;
}

.sukima-hero::after {
  background-image:
    radial-gradient(circle, rgba(33, 43, 48, 0.04) 0.055rem, transparent 0.065rem),
    radial-gradient(circle, rgba(33, 43, 48, 0.025) 0.05rem, transparent 0.06rem);
  background-position: 0 0, 0.7rem 0.7rem;
  background-size: 1.65rem 1.65rem;
  content: "";
  inset: 0;
  opacity: 0.22;
  pointer-events: none;
  position: absolute;
}

.sukima-section {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.sukima-result-line,
.sukima-hero__lead {
  margin: 0;
}

.sukima-num {
  font-family: "Open Sans", sans-serif !important;
  font-variation-settings: "wght"800;
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum"1, "tnum"1;
}

.sukima-hero__content {
  color: #221f22;
  padding: 4rem 0 0;
  position: relative;
  text-align: center;
  z-index: 2;
}

.sukima-hero__content p,
.sukima-hero__content h1,
.sukima-hero__content a {
  text-align: center;
}

.sukima-section__eyebrow,
.sukima-modal-panel__eyebrow {
  background: linear-gradient(135deg, rgba(120, 180, 235, 0.16), rgba(99, 190, 181, 0.18));
  border-radius: 62.4375rem;
  color: var(--sukima-sub-strong);
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin: 0 0 0.75rem;
  padding: 0.375rem 0.75rem;
  text-transform: uppercase;
}

.sukima-result-line {
  align-items: center;
  color: #17171b;
  display: block;
  font-size: clamp(1.2rem, 5vw, 1.625rem);
  font-weight: 800;
  line-height: 1.25;
  margin-inline: auto;
  max-width: 100%;
  padding: 0 2.75rem;
  position: relative;
  text-align: center;
  width: fit-content;
}

.sukima-result-line__text {
  display: inline-block;
}

.sukima-result-line__decor {
  height: auto;
  opacity: 0.95;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 1.375rem;
}

.sukima-result-line__decor--left {
  left: 0.75rem;
}

.sukima-result-line__decor--right {
  right: 0.75rem;
}

.sukima-hero__lead {
  background: linear-gradient(135deg, rgba(118, 200, 193, 0.24), rgba(199, 234, 240, 0.92));
  color: var(--sukima-text);
  display: inline-block;
  font-size: 1.125rem;
  font-weight: 800;
  line-height: 1.2;
  margin-top: 0.875rem;
  padding: 0.75rem 2.5rem;
}

.sukima-hero__title {
  margin: 0 auto 0;
  max-width: min(100%, 31rem);
  width: 100%;
}

.sukima-hero__title img {
  display: block;
  height: auto;
  width: 100%;
}

.sukima-hero__ticker {
  display: grid;
  gap: 0.45rem;
  left: 50%;
  max-width: calc(100% - 0.5rem);
  pointer-events: none;
  position: absolute;
  bottom: 8.5rem;
  transform: translateX(-50%);
  z-index: 2;
}

.sukima-hero__ticker-line {
  align-items: center;
  color: #384950;
  display: flex;
  font-size: 0.8rem;
  font-weight: 800;
  flex-wrap: nowrap;
  gap: 0.3rem;
  justify-content: center;
  letter-spacing: 0.01em;
  text-shadow: 0 0 0.5rem rgba(255, 255, 255, 0.9);
  white-space: nowrap;
}

.sukima-hero__ticker-line span {
  background: #fff;
  border-radius: .5rem;
  box-shadow: 0 0.25rem 0.75rem rgba(67, 53, 34, 0.08);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  padding: 0.25rem 0.4rem;
  white-space: nowrap;
}

.sukima-primary-btn,
.sukima-secondary-btn {
  align-items: center;
  border: 0;
  border-radius: 62.4375rem;
  cursor: pointer;
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  text-align: center;
  text-decoration: none;
  transition: transform 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}

.sukima-primary-btn {
  background: linear-gradient(180deg, #f99b95 0%, #f77d7c 52%, #e76576 100%);
  box-shadow: 0 0.625rem 0 #b85a66;
  color: #fff;
  gap: 0.85rem;
}

.sukima-primary-btn--hero {
  background: linear-gradient(180deg, #f99b95 0%, #f77d7c 52%, #e76576 100%);
  border: 5px solid #fff;
  box-shadow: 0 0.5rem 0 rgba(184, 90, 102, 0.32);
  font-size: 1.6rem;
  letter-spacing: 0.02em;
  line-height: 1.2;
  min-height: 5.25rem;
  max-width: 28rem;
  padding: 1rem 1.5rem;
  position: absolute;
  bottom: 2.5rem;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 2.25rem);
  z-index: 3;
}

.sukima-primary-btn__arrow {
  display: inline-block;
  flex: 0 0 auto;
  height: 0.72em;
  position: relative;
  width: 1.05em;
}

.sukima-primary-btn__label {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
}

.sukima-primary-btn--hero .sukima-primary-btn__label::before,
.sukima-primary-btn--footer-cta .sukima-primary-btn__label::before {
  background-image: url(/assets/images/poke-sig.gif);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: inline-block;
  flex: 0 0 auto;
  height: 2.5rem;
  width: 3rem;
}

.sukima-primary-btn__arrow::after {
  content: "";
  position: absolute;
}

.sukima-primary-btn__arrow::after {
  border-right: 0.12rem solid currentColor;
  border-top: 0.12rem solid currentColor;
  height: 0.45em;
  right: 0.16em;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  width: 0.45em;
}

.sukima-primary-btn.sukima-primary-btn--hero:hover,
.sukima-primary-btn.sukima-primary-btn--hero:focus-visible {
  transform: translateX(-50%) translateY(-0.125rem);
}

.sukima-modal-panel .sukima-primary-btn--full {
  background: linear-gradient(180deg, #f99b95 0%, #f77d7c 52%, #e76576 100%);
  box-shadow: 0 0.625rem 0 #b85a66;
}

.sukima-primary-btn--full {
  display: flex;
  font-size: 0.875rem;
  min-height: 3.25rem;
  padding: 0.75rem 1rem;
  width: 100%;
}

.sukima-secondary-btn {
  background: #edf8fa;
  color: var(--sukima-sub-strong);
  font-size: 0.8125rem;
  min-height: 2.375rem;
  padding: 0.5rem 0.75rem;
}

.sukima-primary-btn:hover,
.sukima-primary-btn:focus-visible,
.sukima-secondary-btn:hover,
.sukima-secondary-btn:focus-visible {
  opacity: 0.96;
  transform: translateY(-0.125rem);
}

.sukima-hero__visual {
  align-items: end;
  display: grid;
  margin-top: -1rem;
  min-height: clamp(28rem, 92vw, 35rem);
  padding: 0 0 5.75rem;
  position: relative;
  z-index: 2;
}

.sukima-hero__visual-main {
  justify-self: center;
  max-width: 37rem;
  width: min(100%, 37rem);
}

.sukima-hero__visual-main img {
  display: block;
  height: auto;
  width: 100%;
}

.sukima-hero__whisper-wrap {
  position: absolute;
  right: 10rem;
  top: 4rem;
  z-index: 3;
}

.sukima-hero__whisper {
  color: #1f1f1f;
  display: inline-block;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.3;
  padding: 0.85rem 0.45rem;
  text-align: center;
  transform: rotate(15deg);
  writing-mode: vertical-rl;
}

.sukima-hero__mascot {
  height: auto;
  position: absolute;
  z-index: 2;
}

.sukima-hero__mascot--phone {
  left: 2rem;
  top: 5rem;
  width: 7rem;
}

.sukima-hero__mascot--mail {
  bottom: 12rem;
  left: 1rem;
  width: 6.5rem;
}

.sukima-hero__mascot--pc {
  bottom: 22.25rem;
  right: 0.5rem;
  width: 7rem;
}

.sukima-hero__ground {
  background-color: #fff;
  background-image:
    radial-gradient(circle, rgba(33, 43, 48, 0.06) 0.065rem, transparent 0.07rem),
    radial-gradient(circle, rgba(33, 43, 48, 0.035) 0.05rem, transparent 0.06rem);
  background-position: 0 0, 0.6rem 0.6rem;
  background-size: 1rem 1rem;
  bottom: 0;
  height: 2rem;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: 1;
}

.sukima-section {
  /*background: #fff;*/
  margin-top: 1.75rem;
  padding: 3rem 1.125rem;
}

.sukima-section--reasons {
  background: #fff;
  border: 0;
  /*box-shadow: 0 0.125rem 0.875rem rgba(15, 73, 86, 0.08);*/
}

.sukima-section--flow {
  background:
    radial-gradient(circle at 12% 18%, rgba(107, 196, 189, 0.14) 0, rgba(107, 196, 189, 0.14) 4.5rem, transparent 4.5rem),
    radial-gradient(circle at 88% 14%, rgba(141, 193, 236, 0.14) 0, rgba(141, 193, 236, 0.14) 5rem, transparent 5rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 255, 0.98));
  position: relative;
}

.sukima-section--flow::before {
  background-image:
    radial-gradient(circle, rgba(63, 149, 182, 0.11) 0.08rem, transparent 0.09rem),
    radial-gradient(circle, rgba(99, 190, 181, 0.08) 0.07rem, transparent 0.08rem);
  background-position: 0 0, 0.6rem 0.6rem;
  background-size: 1.15rem 1.15rem;
  content: "";
  inset: 0;
  opacity: 0.45;
  pointer-events: none;
  position: absolute;
}

.sukima-section--flow > * {
  position: relative;
  z-index: 1;
}

.sukima-section--cta {
  /*background:
    linear-gradient(180deg, rgba(240, 251, 250, 0.98), rgba(255, 255, 255, 0.98)),
    radial-gradient(circle at 18% 20%, rgba(99, 190, 181, 0.14) 0, rgba(99, 190, 181, 0.14) 4rem, transparent 4rem),
    radial-gradient(circle at 86% 16%, rgba(120, 180, 235, 0.12) 0, rgba(120, 180, 235, 0.12) 4.5rem, transparent 4.5rem);*/
  padding: 0rem 1.125rem 3rem;
}

.sukima-section__heading {
  margin-bottom: 4rem;
  text-align: center;
}

.sukima-section__heading p.sukima-heading-script {
  color: rgba(118, 172, 199, 0.72);
  display: inline-block;
  font-family: "Snell Roundhand", "Apple Chancery", "Segoe Script", "Bradley Hand", cursive;
  font-size: 1.3rem;
  letter-spacing: 0.02em;
  line-height: 1;
  margin: 0 0 0.55rem;
  padding: 0 1.6rem;
  position: relative;
  text-shadow: 0 0.25rem 0.8rem rgba(118, 172, 199, 0.12);
}

.sukima-section__heading p.sukima-heading-script::before,
.sukima-section__heading p.sukima-heading-script::after {
  content: "";
  height: 0.0625rem;
  position: absolute;
  top: 58%;
  width: 1.1rem;
}

.sukima-section__heading p.sukima-heading-script::before {
  background: linear-gradient(90deg, transparent, rgba(95, 185, 187, 0.52));
  left: 0;
}

.sukima-section__heading p.sukima-heading-script::after {
  background: linear-gradient(90deg, rgba(76, 149, 203, 0.52), transparent);
  right: 0;
}

.sukima-section__heading h2 {
  color: #153d48;
  font-size: 2.5rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.1;
  margin: .4rem 0 0.625rem;
  position: relative;
  text-align: center;
}

.sukima-section__heading h2::after {
  background-image:
    repeating-linear-gradient(90deg,
      rgba(21, 61, 72, 0.34) 0 0.35rem,
      transparent 0.35rem 0.65rem);
  border-radius: 62.4375rem;
  content: "";
  display: block;
  height: 0.1875rem;
  margin: 0.9rem auto 0;
  width: 5.5rem;
}

.sukima-heading-accent {
  background: linear-gradient(135deg, #5fb9bb 0%, #4c95cb 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  display: inline-block;
  text-shadow: 0 0.35rem 0.9rem rgba(120, 180, 235, 0.18);
}

.sukima-section__heading p,
.sukima-reason-card p,
.sukima-step-card p,
.sukima-modal-panel p,
.sukima-modal-detail dd {
  color: var(--sukima-muted);
  font-size: 1rem;
  line-height: 1.3;
  margin: 0;
}

.sukima-section__heading p {
  text-align: center;
}

.main-new25 .sukima-lp .sukima-section__catch {
  color: #101418;
  font-size: 1.4rem;
  font-weight: 800;
  line-height: 1.4;
  margin: 0 0 0.5rem;
}

.main-new25 .sukima-lp .sukima-section__catch span {
  background: linear-gradient(135deg, #6ebfd2, #5b9fd8);
  border-radius: 0.75rem;
  color: #fff;
  display: inline-block;
  font-size: 1.4rem;
  margin: 0.25rem 0.25rem 0;
  padding: 0.25rem 0.75rem;
}

.sukima-job-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sukima-reason-grid,
.sukima-steps {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 1fr;
}

.sukima-flow-slider {
  display: grid;
  gap: 0.875rem;
}

.sukima-flow-slider__viewport {
  overflow: hidden;
  padding-bottom: 1.5rem;
  margin-bottom: -1.5rem;
}

.sukima-flow-slider__track {
  display: flex;
  transition: transform 0.45s ease;
  will-change: transform;
}

.sukima-flow-slide {
  background: #fff;
  border: 1px solid rgba(31, 95, 114, 0.22);
  border-radius: 1.5rem;
  cursor: pointer;
  display: grid;
  flex: 0 0 100%;
  gap: 2rem;
  padding: 2rem 1rem 2rem;
  position: relative;
  scroll-margin-top: 1rem;
}



.sukima-flow-slide:focus-visible {
  outline: 0.125rem solid var(--sukima-sub);
  outline-offset: 0.1875rem;
}

.sukima-flow-slide__copy {
  display: grid;
  gap: 0.625rem;
  justify-items: center;
  text-align: center;
}

.sukima-flow-slide__copy p {
  color: var(--sukima-muted);
  font-size: 0.9375rem;
  line-height: 1.2;
  margin: 0 auto;
  text-align: center;
  width: 70%;
}

.sukima-flow-slide__copy h3 {
  font-size: 1.4rem;
  line-height: 1.2;
  text-align: center;
}

.sukima-flow-points {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

.sukima-flow-points li {
  background: #eaf6f8;
  border-radius: 62.4375rem;
  color: var(--sukima-sub-strong);
  font-size: 0.75rem;
  font-weight: 800;
  line-height: 1.4;
  padding: 0.4375rem 0.75rem;
}

.sukima-phone-mock {
  background: linear-gradient(180deg, #1f2930, #0d1114);
  border-radius: 2rem;
  box-shadow: 0 1rem 2.25rem rgba(18, 56, 88, 0.22);
  display: flex;
  flex-direction: column;
  height: 24rem;
  margin: 0 auto;
  max-width: 15rem;
  padding: 0.625rem;
  position: relative;
  width: 100%;
}

.sukima-phone-mock__notch {
  background: #050708;
  border-radius: 0 0 0.875rem 0.875rem;
  height: 1rem;
  left: 50%;
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  width: 5.75rem;
  z-index: 2;
}

.sukima-phone-mock__screen {
  background: linear-gradient(180deg, #ffffff, #eef8ff);
  border-radius: 1.5rem;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  padding-top: 0;
}

.sukima-phone-mock__screen img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.sukima-phone-mock__screen--stack {
  display: grid;
  flex: 1 1 auto;
  gap: 0.625rem;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  min-height: 0;
  padding: 0.625rem;
}

.sukima-phone-mock__screen--stack img {
  border-radius: 1rem;
  height: 100%;
  object-fit: cover;
  box-shadow: 0 0.5rem 1.25rem rgba(31, 87, 124, 0.14);
}

.sukima-phone-mock__screen--complete {
  align-content: start;
  display: grid;
  flex: 1 1 auto;
  gap: 0.75rem;
  grid-template-rows: auto 1fr;
  min-height: 0;
  padding: 0.625rem;
}

.sukima-phone-mock__screen--complete img {
  border-radius: 1rem;
  height: auto;
  max-height: 11rem;
  object-fit: contain;
}

.sukima-phone-mock__cash-card {
  background: linear-gradient(135deg, #f08cb6, #db5d91);
  border-radius: 1.25rem;
  color: #fff;
  margin-top: auto;
  padding: 0.875rem 1rem;
}

.sukima-phone-mock__cash-label,
.sukima-phone-mock__cash-amount {
  color: #fff;
  margin: 0;
}

.sukima-phone-mock__cash-label {
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.5;
}

.sukima-phone-mock__cash-amount {
  font-size: 1.375rem;
  font-weight: 800;
  line-height: 1.2;
  margin-top: 0.25rem;
}

.sukima-flow-slider__controls {
  align-items: center;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 2.75rem 1fr 2.75rem;
}

.sukima-flow-slider__arrow {
  align-items: center;
  background: #edf7fa;
  border: 0;
  border-radius: 50%;
  color: var(--sukima-sub-strong);
  cursor: pointer;
  display: inline-flex;
  font-size: 1.75rem;
  height: 2.75rem;
  justify-content: center;
  line-height: 1;
  width: 2.75rem;
}

.sukima-flow-slider__dots {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
}

.sukima-flow-slider__dot {
  background: #d7ebef;
  border: 0;
  border-radius: 62.4375rem;
  cursor: pointer;
  height: 0.5rem;
  padding: 0;
  transition: background-color 0.2s ease, transform 0.2s ease, width 0.2s ease;
  width: 0.5rem;
}

.sukima-flow-slider__dot.is-active {
  background: var(--sukima-sub);
  transform: scale(1.05);
  width: 1.75rem;
}

.sukima-flow-slider__note {
  color: var(--sukima-muted);
  font-size: 0.75rem;
  line-height: 1.7;
  margin: 0;
  text-align: center;
}

.sukima-footer-cta {
  margin: 0 auto;
  max-width: 28rem;
  position: relative;
}

.sukima-footer-cta .sukima-primary-btn--full {
  border: 5px solid #fff;
  box-shadow: 0 0.5rem 0 rgba(184, 90, 102, 0.32);
  font-size: 1.6rem;
  letter-spacing: 0.02em;
  line-height: 1.2;
  min-height: 5.25rem;
  padding: 1rem 1.5rem;
}

.sukima-primary-btn--footer-cta {
  background: linear-gradient(180deg, #f99b95 0%, #f77d7c 52%, #e76576 100%);
  box-shadow: 0 0.5rem 0 rgba(184, 90, 102, 0.32);
}

.sukima-job-card,
.sukima-reason-card,
.sukima-step-card {
  background: #fff;
  /*border: 0.0625rem solid var(--sukima-line);*/
  border-radius: 1.5rem;
  box-shadow: 0 0.125rem 0.875rem rgba(15, 73, 86, 0.08);
}

.sukima-job-card {
  border-color: rgba(33, 88, 130, 0.12);
  border-radius: 1.75rem;
  box-shadow: 0 0 0.7rem rgba(46, 114, 136, 0.22);
  overflow: hidden;
}

.sukima-job-card__image {
  aspect-ratio: 1 / 0.9;
  background: #e5f4f7;
  overflow: hidden;
  position: relative;
}

.sukima-job-card__image img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.sukima-job-card__body {
  display: grid;
  gap: 0.5rem;
  padding: 0.75rem;
}

.sukima-job-card h3,
.sukima-reason-card h3,
.sukima-step-card h3,
.sukima-modal-panel h3 {
  font-size: 1.3rem;
  font-weight: 800;
  line-height: 1.1;
  margin: 0;
}

.sukima-modal-panel h3 {
  font-variation-settings: "wght" 600;
  font-weight: 900;
  margin: 0.35rem 0 0.2rem;
  padding-bottom: 0.7rem;
  position: relative;
}

.sukima-modal-panel h3::after {
  background: currentColor;
  border-radius: 999px;
  bottom: 0;
  content: "";
  height: 0.18rem;
  left: 0;
  opacity: 0.28;
  position: absolute;
  width: 4.25rem;
}

.sukima-modal-panel[data-sukima-modal="commute"] h3 {
  color: #4d96d9;
}

.sukima-modal-panel[data-sukima-modal="commute"] dt {
  color: #4d96d9;
}

.sukima-modal-panel[data-sukima-modal="home"] h3 {
  color: #45b4a0;
}

.sukima-modal-panel[data-sukima-modal="home"] dt {
  color: #45b4a0;
}

.sukima-modal-panel[data-sukima-modal="mail"] h3 {
  color: #4fb0bf;
}

.sukima-modal-panel[data-sukima-modal="mail"] dt {
  color: #4fb0bf;
}

.sukima-modal-panel[data-sukima-modal="vtuber"] h3 {
  color: #488bc2;
}

.sukima-modal-panel[data-sukima-modal="vtuber"] dt {
  color: #488bc2;
}

.sukima-job-card__label {
  color: #fff;
  font-size: 0.875rem;
  font-weight: 800;
  left: 0;
  letter-spacing: 0.04em;
  margin: 0;
  padding: 0.5rem 0.75rem;
  position: absolute;
  text-align: center;
  top: 0;
  width: 100%;
  z-index: 1;
}

.sukima-job-card__label--commute {
  background: linear-gradient(90deg, rgba(77, 150, 217, 0.96), rgba(110, 187, 229, 0.96));
}

.sukima-job-card__label--home {
  background: linear-gradient(90deg, rgba(69, 180, 160, 0.96), rgba(106, 204, 190, 0.96));
}

.sukima-job-card__label--mail {
  background: linear-gradient(90deg, rgba(79, 176, 191, 0.96), rgba(117, 203, 216, 0.96));
}

.sukima-job-card__label--vtuber {
  background: linear-gradient(90deg, rgba(72, 139, 194, 0.96), rgba(101, 193, 207, 0.96));
}

.sukima-job-card__summary {
  color: #263b45;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.3;
  margin: .5rem 0 .5rem;
}

.sukima-job-card__footer {
  display: flex;
  gap: 0.5rem;
}

.sukima-job-card__reward {
  color: var(--sukima-money-strong);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.2;
  margin: 0;
}

.sukima-money-accent {
  color: var(--sukima-money-strong);
  font-weight: 800;
  text-shadow: 0 0.3rem 0.8rem rgba(232, 106, 157, 0.14);
}

.sukima-phone-mock__cash-amount .sukima-money-accent,
.sukima-reason-card .sukima-money-accent {
  background: linear-gradient(135deg, rgba(255, 241, 247, 0.95), rgba(255, 255, 255, 0.98));
  border-radius: 0.75rem;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  color: #d94a84 !important;
  padding: 0.05rem 0.35rem;
}

.sukima-phone-mock__cash-amount .sukima-money-accent .sukima-num {
  color: #d94a84 !important;
}

.sukima-job-card__badge,
.sukima-step-card__number {
  background: rgba(255, 255, 255, 0.94);
  border-radius: 62.4375rem;
  color: var(--sukima-sub);
  font-size: 0.6875rem;
  font-weight: 800;
  line-height: 1.2;
  padding: 0.5rem 0.625rem;
  white-space: nowrap;
}

.sukima-flow-slide .sukima-step-card__number {
  background: transparent;
  color: #4b98b6;
  font-size: 3rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  padding: 0;
  text-align: center;
}

.sukima-job-card__badge {
  bottom: 0.625rem;
  position: absolute;
  right: 0.625rem;
  z-index: 1;
}

.sukima-reason-card,
.sukima-step-card {
  padding: 1.125rem 1rem;
}

.sukima-reason-card {
  background: transparent;
  box-shadow: none;
  align-items: center;
  display: grid;
  gap: 0.875rem;
  grid-template-columns: 6.5rem 1fr;
  overflow: hidden;
  padding-right: 1rem;
  position: relative;
}

.sukima-reason-card__accent {
  width: 100%;
}

.sukima-reason-card__accent img {
  display: block;
  height: auto;
  width: 100%;
}

.sukima-reason-card__body {
  display: grid;
  gap: 0.5rem;
}

.sukima-reason-card h3 {
  color: var(--sukima-sub);
}

.sukima-modal-layer {
  inset: 0;
  position: fixed;
  z-index: 9999;
}

.sukima-modal-backdrop {
  background: rgba(8, 24, 31, 0.6);
  inset: 0;
  position: absolute;
}

.sukima-modal-dialog {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(246, 252, 252, 0.99));
  inset: 50% auto auto 50%;
  max-width: 35rem;
  padding: 3rem;
  position: absolute;
  transform: translate(-50%, -50%);
  width: min(calc(100% - 2rem), 35rem);
  z-index: 1;
}

.sukima-modal-close {
  align-items: center;
  background: #edf7fa;
  border: 0;
  border-radius: 62.4375rem;
  color: var(--sukima-text);
  cursor: pointer;
  display: inline-flex;
  font-size: 1.125rem;
  font-weight: 700;
  height: 2.25rem;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: 2.25rem;
}

.sukima-modal-panel {
  display: grid;
  gap: 1rem;
}

.sukima-modal-panel[hidden] {
  display: none;
}

.sukima-modal-panel__hero {
  display: grid;
  gap: 0.85rem;
}

.sukima-modal-panel__hero > h3 {
  margin: 0;
}

.sukima-modal-panel__hero-media {
  height: 12.5rem;
  background: linear-gradient(180deg, rgba(229, 244, 247, 0.95), rgba(255, 255, 255, 0.98));
  border-radius: 1.1rem;
  box-shadow: 0 0.5rem 1.25rem rgba(32, 93, 111, 0.08);
  width: 100%;
  overflow: hidden;
}

.sukima-modal-panel__hero-media img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.sukima-modal-detail {
  display: grid;
  gap: 0;
  margin: 0;
}

.sukima-modal-detail div {
  align-items: flex-start;
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 0.625rem;
  padding: 0.95rem 0 1rem;
}

.sukima-modal-detail dt {
  color: var(--sukima-sub-strong);
  display: inline-block;
  font-size: 1.2rem;
  font-variation-settings: "wght" 600;
  letter-spacing: 0.04em;
  margin: 0;
  padding:0 0.5rem;
  width: fit-content;
}

.sukima-modal-detail dd {
  border-top: 0.12rem solid rgba(63, 149, 182, 0.22);
  margin: 0;
  color: var(--sukima-text);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.8;
  padding-top: 0.55rem;
}

.sukima-modal-detail__price dd {
  color: var(--sukima-money-strong) !important;
  font-weight: 800;
  line-height: 1.95;
}

.sukima-modal-detail__price dd span.sukima-money-accent,
.sukima-modal-detail__price dd span.sukima-money-accent .sukima-num {
  color: #d94a84;
}

@media (max-width: 420px) {

  .sukima-modal-panel__hero-media {
    height: 10.5rem;
  }

  .sukima-modal-detail div {
    grid-template-columns: 1fr;
    row-gap: 0.625rem;
  }

  .sukima-modal-detail dt {
    width: fit-content;
  }
}

body.is-sukima-modal-open {
  overflow: hidden;
}
