@charset "utf-8";

#conversion {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  width: 75rem;
  margin: 0 auto;
  display: none;
  background: rgba(255, 255, 255, 0.7);
}

#conversion .gbBtnWText {
  margin-bottom: 0;
}

/*きらっと光る*/
.btnshine {
  position: relative;
  display: inline-block;
  color: #fff;
  text-decoration: none;
  outline: none;
  overflow: hidden;
  border-radius: 5.9rem;
}

/*キラッと光る*/
.btnshine::before {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 100%
  );
  transform: skewX(-25deg);
  z-index: 5;
}

/*hoverした際の移動のアニメーション*/
.btnshine::before {
  animation: shine 1.5s infinite;
}

@keyframes shine {
  100% {
    left: 125%;
  }
}

.heartbeat {
  display: inline-block;
  transform-origin: center;
  animation: heartbeat 1.5s ease-in-out infinite;
}

@keyframes heartbeat {
  0% {
    transform: scale(1);
  }

  14% {
    transform: scale(1.06);
  }

  28% {
    transform: scale(1);
  }

  42% {
    transform: scale(1.06);
  }

  70% {
    transform: scale(1);
  }
}

.fuwafuwa {
  animation: fuwafuwa 3s ease-in-out infinite alternate;
  display: inline-block;
  transition: 1.5s ease-in-out;
}

@keyframes fuwafuwa {
  0% {
    transform: translate(0, 0) rotate(-7deg);
  }

  50% {
    transform: translate(0, -7px) rotate(0deg);
  }

  100% {
    transform: translate(0, 0) rotate(7deg);
  }
}

.bounce {
  animation: bounce 2s ease-in-out;
}

@keyframes bounce {
  0% {
    transform: translateY(-45%);
    animation-timing-function: ease-in;
    opacity: 1;
  }

  24% {
    opacity: 1;
  }

  40% {
    transform: translateY(-24%);
    animation-timing-function: ease-in;
  }

  65% {
    transform: translateY(-12%);
    animation-timing-function: ease-in;
  }

  82% {
    transform: translateY(-6%);
    animation-timing-function: ease-in;
  }

  93% {
    transform: translateY(-4%);
    animation-timing-function: ease-in;
  }

  25%,
  55%,
  75%,
  87% {
    transform: translateY(0%);
    animation-timing-function: ease-out;
  }

  100% {
    transform: translateY(0%);
    animation-timing-function: ease-out;
    opacity: 1;
  }
}

sup {
  vertical-align: super;
  font-size: smaller;
  position: relative;
  top: -2rem;
}

.gBlock {
  background: var(--bg);
  padding: 4rem 2rem;
  border: 1rem solid rgba(243, 111, 39, 0.2);
  text-align: center;
}
.gBlockInner {
  position: relative;
}
.gBlockRibbon {
  width: 71rem;
  display: block;
  margin: 0 auto;
}
.gBlockLead {
  width: 61rem;
  display: block;
  margin: 1rem auto 2rem;
}

.gBlockCard {
  background: #fff;
  border-radius: 1rem;
  padding: 4.5rem 3.7rem 4rem;
  margin-bottom: 3rem;
}
.gBlockCardTitle {
  color: var(--navy);
  font-size: 4rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 2.5rem;
}
.gBlockList {
  text-align: left;
  list-style: none;
  padding: 0;
}
.gBlockList li {
  font-size: 2.8rem;
  font-weight: 500;
  color: #6e6c6f;
  margin-bottom: 1.5rem;
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
.gBlockList li:last-child {
  margin-bottom: 0;
}
.iconCheck {
  display: inline-block;
  width: 3.7rem;
  height: 3.7rem;
  background: var(--orange);
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
}
.iconCheck::after {
  content: "";
  position: absolute;
  top: 45%;
  left: 50%;
  width: 1.2rem;
  height: 0.6rem;
  border-left: 3px solid #fff;
  border-bottom: 3px solid #fff;
  transform: translate(-50%, -50%) rotate(-45deg);
}
.gBlockCtaText {
  color: var(--navy);
  font-size: 3.8rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 0.5rem;
}

.gBtn {
  display: block;
  margin: 0 auto;
  width: 70rem;
}

.gBtn a {
  display: flex;
  align-items: center;
  height: 13.85rem;
  text-decoration: none;
  background: url(../img/btnGbBg.webp) no-repeat center;
  background-size: 100% 100%;
}

.gBtn a span {
  margin-top: -1.1rem;
  margin-left: 14rem;
}

.ctaTT {
  display: block;
  margin: 0 auto;
  width: 43rem;
}

.cta a {
  display: block;
  width: 75rem;
  margin: 0 auto;
}

/* fv */
.fv {
  background: url(../img/fvBg.webp) no-repeat center top;
  background-size: cover;
  padding-top: 8rem;
  padding-bottom: 3rem;
}
.fv img {
  display: block;
}

.fvTxt {
  width: 55rem;
  margin: 0 auto 0 -1rem;
}

.fvContent {
  width: 56rem;
  margin: 8.5rem auto 0 0;
}

.fvBanner {
  width: 65rem;
  margin: 0 auto;
}

.fv a {
  display: block;
  width: 75rem;
  margin: 3rem auto 0;
}

.fv a img {
  display: block;
  width: 68rem;
  margin: 0 auto;
}

.results {
  background: var(--bg) url(../img/resultsBg.webp) repeat center top;
  background-size: cover;
  padding: 7rem 2rem 8.5rem;
}
.resultsInner {
  max-width: 75rem;
  margin: 0 auto;
}
.resultsTitle {
  text-align: center;
}
.resultsTitle .t1 {
  font-size: 3rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 1.5rem;
}
.resultsTitle .t1 .orange {
  color: var(--orange);
  font-size: 3.8rem;
}
.resultsTitle .t2Box {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 4rem;
  font-size: 4.2rem;
  font-weight: bold;
  color: var(--navy);
  position: relative;
  z-index: 1;
}
.resultsTitle .t2Item {
  border: 2px solid var(--navy);
  padding: 0.5rem 1rem;
  line-height: 1;
}
.resultsTitle .excl {
  font-size: 4rem;
  line-height: 1;
}
.resultsTitle .t2Box::after {
  content: "";
  position: absolute;
  bottom: -0.2rem;
  left: 5%;
  right: 5%;
  height: 1.2rem;
  background: var(--yellow);
  z-index: -1;
  transform: rotate(-1deg);
}
.resultsTitle .t3 {
  font-size: 3.2rem;
  font-weight: 700;
  color: var(--navy);
}

.resultsSlider {
  width: 68rem;
  margin: 0 auto;
  position: relative;
}

.resultsCard {
  overflow: hidden;
  /* margin: 1rem; */
}
.resultsCardImg {
  width: 100%;
  display: block;
  border-radius: 1.5rem;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.08);
}

.resultsSlider .slick-prev,
.resultsSlider .slick-next {
  width: 9rem;
  height: 9rem;
  background: url(../img/next.webp) no-repeat center;
  background-size: contain;
  box-shadow: none;
  border-radius: 0;
  z-index: 10;
}
.resultsSlider .slick-prev {
  left: -3.5rem;
  transform: translate(0, -50%) scaleX(-1);
}
.resultsSlider .slick-next {
  right: -3.5rem;
  transform: translate(0, -50%);
}
.resultsSlider .slick-prev::before,
.resultsSlider .slick-next::before {
  content: none;
}
.resultsSlider .slick-dots {
  bottom: -2.5rem;
}
.resultsSlider .slick-dots li button::before {
  font-size: 1.5rem;
  color: var(--gray-2);
  opacity: 1;
}
.resultsSlider .slick-dots li.slick-active button::before {
  color: var(--orange);
}

/* reason */
.reason {
  background: url(../img/reasonBg.webp) no-repeat center;
  background-size: cover;
  padding: 7.5rem 0;
}

.reasonTT {
  margin-bottom: 5rem;
}

.reasonTT h2 {
  color: var(--navy);
  font-size: 2.8rem;
  font-weight: 900;
  text-align: center;
  margin: 0 0 3rem;
}

.reasonTT p:nth-child(2) {
  background-color: var(--orange);
  color: #fff;
  font-weight: 700;
  text-align: center;
  margin: 0 8rem;
}

.reasonTT p {
  color: var(--orange);
  font-weight: 700;
  text-align: center;
}

.reasonInfoHighlight {
  background-color: var(--orange, #ea5b0c);
  color: #fff;
  display: inline-block;
  padding: 0.1em 0.3em;
  margin-bottom: 0.3em;
  line-height: 1.2;
}

.reasonInfoText {
  color: var(--orange, #ea5b0c);
  display: inline-block;
  margin-left: 0.2em;
}

.reasonInfoImg {
  width: 65rem;
  display: block;
  margin: 0 auto;
}

.reasonSupport {
  width: 70rem;
  display: block;
  margin: 6rem auto 0;
}

/* worrrie */
.worrie {
  background: url(../img/worrieBg.webp) no-repeat center;
  background-size: cover;
  padding: 7.5rem 0;
}

.worrieTT h2 {
  color: #fff;
}

.worrieTT img {
  width: 60rem;
  display: block;
  margin: 2.5rem auto 0;
}

.worrieIssue {
  background: url(../img/worrieIssueBg.webp) no-repeat center;
  background-size: 100% 100%;
  margin: 0 auto 0 3rem;
  padding: 12rem 3rem 4rem;
}

.worrieIssue ul {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

.worrieIssue li {
  color: #303030;
  position: relative;
  padding-left: 5.5rem;
  line-height: 1.5;
}

.worrieIssue li::before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 4rem;
  height: 4rem;
  background: url(../img/checkBox.webp) no-repeat center;
  background-size: contain;
}

.worrieHighlight {
  color: #dc2e2e;
  background-color: #fff;
  padding: 0 0.5rem;
  display: inline-block;
  line-height: 1.2;
}

.worrieInfo {
  position: relative;
  width: 70rem;
  margin: 10rem auto 0;
}

.worrieInfoBg {
  width: 100%;
  display: block;
}

.worrieInfo ul {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.worrieInfo li {
  position: absolute;
  color: var(--orange);
  line-height: 1.5;
  left: 24%;
  width: 72%;
}

.worrieInfo li:nth-child(1) {
  top: 25%;
}

.worrieInfo li:nth-child(2) {
  top: 47%;
}

.worrieInfo li:nth-child(3) {
  top: 75%;
}

.worrieInfoHighlight {
  background-color: var(--yellow);
  padding: 0 0.5rem;
  display: inline-block;
  line-height: 1.2;
}

/* issue */
.issue {
  background: url(../img/issueBg.webp) no-repeat center;
  background-size: 100%;
  padding: 7.5rem 0;
}

.issueTT p {
  background-color: #fff;
  margin: 0 12rem;
}

.issueTT p strong {
  color: var(--orange);
}

.issueImg {
  width: 99%;
  display: block;
  margin: 0 auto;
}

.issueContent {
  background-color: #fff;
  border: 1rem solid;
  border-image: linear-gradient(to right, #ffc965 0%, #f36f27 100%) 1;
  margin: -9rem 4rem 0;
  padding: 2.5rem 3rem;
}

.issueContentLine {
  width: 12rem;
  height: 2px;
  background-color: var(--orange);
  margin: 3rem auto;
}

.issueContentOrange {
  color: var(--orange);
}

.issueContentNavy {
  color: var(--navy);
}

.issueContentGray {
  color: var(--gray);
}

.issueContentMarker {
  background: linear-gradient(transparent 60%, var(--yellow) 60%);
}

/* snsdessign */
.snsdessign {
  padding: 6rem 0;
}

.snsdessignSub {
  color: var(--navy);
  letter-spacing: 0.05em;
}

.snsdessignTitle {
  color: var(--orange);
}

.snsdessignCatch {
  color: var(--gray);
}

.snsdessignCatch strong {
  background-color: var(--orange);
  color: #fff;
  padding: 0 1rem;
  display: inline-block;
}

.snsdessignDesc {
  color: var(--gray);
}

.snsdessignMarker {
  background: linear-gradient(transparent 60%, var(--yellow) 60%);
}

.snsdessign img {
  width: 65rem;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
/* snsdesign */

/* about */
.about {
  background: url(../img/aboutBg.webp);
  background-size: 100% 100%;
  padding: 6rem 0;
}

.aboutSub {
  color: var(--navy);
  letter-spacing: 0.05em;
}

.aboutTitle {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.aboutTitle span {
  color: var(--gray);
  margin-bottom: 0.5rem;
  margin-left: 1rem;
}

.aboutLogo {
  width: 64rem;
  display: block;
  margin: -2rem auto 2rem;
}

.aboutLine::after {
  content: "";
  position: absolute;
  top: 2px;
  left: calc(20% + 0.3rem);
  border-left: 1.2rem solid transparent;
  border-right: 1.2rem solid transparent;
  border-top: 1.6rem solid #fff;
}

.aboutDesc > span:first-child {
  color: var(--gray);
}

.aboutDesc strong {
  color: var(--orange);
  display: inline-block;
  margin-top: 1rem;
}

.aboutBox {
  border: 3px solid var(--orange);
  color: var(--orange);
  padding: 0.5rem 1rem;
  margin-right: 1rem;
}

.aboutContent img {
  width: 70rem;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 3rem;
}

.aboutGray {
  color: var(--gray);
}

.aboutOrange {
  color: var(--orange);
}

.aboutMarker {
  background: linear-gradient(transparent 60%, var(--yellow) 60%);
}

.aboutArr {
  width: 7rem;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
/* about */

/* mentor */
.mentor {
  padding: 6rem 0;
}

.mentorSub {
  color: var(--navy);
  letter-spacing: 0.05em;
}

.mentorTitle strong {
  display: block;
  margin-top: 1rem;
}

.mentorGray {
  color: var(--gray);
}

.mentorOrange {
  color: var(--orange);
}

.mentorMarker {
  background: linear-gradient(transparent 60%, var(--yellow) 60%);
}

.mentorImg {
  width: 69rem;
  display: block;
  margin: 4rem auto 0;
}
.mentorInfo {
  position: relative;
  width: 69rem;
  margin: 7rem auto 0;
}

.mentorInfoImg {
  width: 100%;
  display: block;
}

.mentorConclusion {
  position: absolute;
  bottom: 3rem;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
}
/* mentor */

/* compare */
.compare {
  padding: 6rem 0;
  background: url(../img/issueBg.webp) no-repeat center;
  background-size: 100%;
}

.compareSub {
  color: var(--navy);
  letter-spacing: 0.05em;
}

.compareTitle {
  background-color: var(--orange);
  color: #fff;
  width: 61rem;
  margin-left: auto;
  margin-right: auto;
  padding: 1.5rem 0;
  clip-path: polygon(
    0 0,
    100% 0,
    calc(100% - 2rem) 50%,
    100% 100%,
    0 100%,
    2rem 50%
  );
}

.compare img {
  display: block;
  width: 70rem;
  margin: 4rem auto 0;
}
/* compare */

/* journey */
.journey {
  padding: 6rem 0;
  background: url(../img/journeyBg.webp) no-repeat center;
  background-size: 100%;
}
.journeySub {
  color: var(--navy);
  letter-spacing: 0.05em;
}

.journeyGray {
  color: var(--gray);
}

.journeyOrange {
  color: var(--orange);
}

.journeyBox {
  background-color: #fff;
  padding: 0.5rem 1.5rem;
  display: inline-block;
}

.journeyInfo {
  width: 65rem;
  display: block;
  margin: 6rem auto 0;
}
/* journey */

/* voice */
.voice {
  padding: 8rem 0;
  background-color: #fafbfc;
  background-image:
    linear-gradient(#f0f0f0 1px, transparent 1px),
    linear-gradient(90deg, #f0f0f0 1px, transparent 1px);
  background-size: 2.5rem 2.5rem;
}

.voiceSub {
  color: var(--navy);
  letter-spacing: 0.05em;
}

.voiceOrange {
  color: var(--orange);
  margin-top: -2rem;
}

.voiceGray {
  color: var(--gray);
}

.voiceMarker {
  background: linear-gradient(transparent 60%, var(--yellow) 60%);
}

.voiceSliderBox {
  width: 70rem;
  margin: 7rem auto 0;
}

.voiceSlider img {
  width: 100%;
  display: block;
}

.voiceSliderBox .slick-dots {
  bottom: -4rem;
}

.voiceSliderBox .slick-dots li {
  margin: 0 0.5rem;
  width: 1.2rem;
  height: 1.2rem;
}

.voiceSliderBox .slick-dots li button {
  width: 1.2rem;
  height: 1.2rem;
  padding: 0;
}

.voiceSliderBox .slick-dots li button:before {
  font-size: 1.2rem;
  color: #d9d9d9;
  opacity: 1;
  width: 1.2rem;
  height: 1.2rem;
  line-height: 1.2rem;
}

.voiceSliderBox .slick-dots li.slick-active button:before {
  color: var(--orange);
}

.voiceSliderBox .slick-prev,
.voiceSliderBox .slick-next {
  width: 6rem;
  height: 6rem;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 10;
}

.voiceSliderBox .slick-prev {
  background-image: url(../img/next.webp);
  transform: translate(0, -50%) scaleX(-1);
  left: 0;
}

.voiceSliderBox .slick-next {
  background-image: url(../img/next.webp);
  transform: translate(0, -50%);
  right: 0;
}

.voiceSliderBox .slick-prev:before,
.voiceSliderBox .slick-next:before {
  content: "";
}
/* voice */

/* plan */
.plan {
  padding: 8rem 0;
}

.planSub {
  color: var(--navy);
  letter-spacing: 0.05em;
}

.planGray {
  color: var(--gray);
}

.planOrange {
  color: var(--orange);
}

.planMarker {
  background: linear-gradient(transparent 60%, var(--yellow) 60%);
}

.planContent {
  width: 68rem;
  margin: 5rem auto 0;
}

.planContent img {
  width: 100%;
  display: block;
  margin-top: -3rem;
}

.planContent img:last-child {
  margin-top: 1rem;
}

.planBanner {
  width: 68rem;
  margin: 6rem auto 0;
  display: block;
}

.planGrow {
  width: 72rem;
  margin: 4rem auto 0;
  display: block;
}
/* plan */

/* company */
.company {
  padding: 8rem 0;
  background: url(../img/companyBg.webp) no-repeat center top;
  background-size: 100%;
}

.companySub {
  color: var(--navy);
  letter-spacing: 0.05em;
  font-size: 2.8rem;
}

.companySubJp {
  color: var(--gray);
  font-size: 2.6rem;
  margin-top: 0.5rem;
}

.companyLine {
  width: 4rem;
  height: 0.2rem;
  background-color: var(--orange);
}

.companyTitle {
  color: var(--gray);
  font-size: 5.1rem;
}

.companyGradient {
  width: 90%;
  max-width: 65rem;
  display: block;
  margin: 3rem auto;
}

.companyText {
  color: var(--gray);
  line-height: 2;
  font-size: 2.8rem;
}

.companyCatch {
  color: var(--gray);
  font-size: 4.8rem;
}

.companyOrange {
  color: var(--orange);
}

.companyServices {
  width: 90%;
  max-width: 65rem;
  display: block;
  margin: 3rem auto 0;
}
/* company */

/* qa */
.qa {
  padding: 8rem 0;
  background-color: #fff;
}

.qaSub {
  color: var(--navy);
  letter-spacing: 0.05em;
  font-size: 2.8rem;
}

.qaTitle {
  color: var(--gray);
  font-size: 4.8rem;
}

.qaList {
  width: 90%;
  max-width: 68rem;
  margin: 5rem auto 0;
}

.qaItem {
  margin-bottom: 4rem;
}

.qaQuestion {
  background: linear-gradient(to right, #89dce6 0%, #377ab9 100%);
  padding: 2.5rem 3rem;
  display: flex;
  align-items: center;
  cursor: pointer;
  position: relative;
}

.qaQ {
  background-color: #fff;
  color: #377ab9;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 2.8rem;
  flex-shrink: 0;
  margin-right: 2rem;
}

.qaQText {
  color: #fff;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.5;
  padding-right: 5rem;
  text-align: left;
}

.qaIcon {
  position: absolute;
  right: 3rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2.5rem;
  height: 2.5rem;
  transition: transform 0.3s ease;
}

.qaIcon::before,
.qaIcon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #fff;
  transition:
    transform 0.3s ease,
    opacity 0.3s ease;
}

/* Horizontal line (always visible) */
.qaIcon::before {
  width: 100%;
  height: 0.3rem;
  transform: translate(-50%, -50%);
}

/* Vertical line (hidden when open / default) */
.qaIcon::after {
  width: 0.3rem;
  height: 100%;
  transform: translate(-50%, -50%) scaleY(0);
  opacity: 0;
}

/* When collapsed, rotate whole icon and show vertical line */
.qaQuestion.collapsed .qaIcon {
  transform: translateY(-50%) rotate(180deg);
}

.qaQuestion.collapsed .qaIcon::after {
  transform: translate(-50%, -50%) scaleY(1);
  opacity: 1;
}

.qaAnswer {
  border-style: solid;
  border-width: 0 0.3rem 0.3rem 0.3rem;
  border-image: linear-gradient(to right, #89dce6 0%, #377ab9 100%) 1;
  background-color: #fff;
}

.qaAnswerInner {
  padding: 4rem 3rem;
  color: var(--gray);
  font-size: 1.8rem;
  line-height: 2;
  font-weight: 500;
  text-align: left;
}
/* qa */

/* footer */
footer {
  padding: 2rem 0;
  color: var(--gray);
}


/* WordPress / vanilla slider compatibility */
html, body { margin:0; padding:0; }
#wpadminbar { position: fixed; }
.resultsSlider.ps-slider, .voiceSlider.ps-slider { position: relative; overflow: hidden; }
.ps-slider > .ps-slide { display:none; }
.ps-slider > .ps-slide.is-active { display:block; }
.ps-slider-nav { display:flex; align-items:center; justify-content:center; gap:1rem; margin-top:2rem; }
.ps-slider-arrow { border:0; width:4.8rem; height:4.8rem; cursor:pointer; background:transparent url(../img/next.webp) center/contain no-repeat; text-indent:-9999px; overflow:hidden; }
.ps-slider-arrow.ps-prev { transform:scaleX(-1); }
.ps-slider-dots { display:flex; gap:.8rem; align-items:center; justify-content:center; }
.ps-slider-dot { width:1.2rem; height:1.2rem; border-radius:50%; border:0; padding:0; background:#d9d9d9; cursor:pointer; }
.ps-slider-dot.is-active { background:var(--orange, #ef7b3a); }


/* v1.3: FV brand logo restored */
.lpBrandLogo {
  width: 100%;
  background: #fff;
  line-height: 0;
}
.lpBrandLogo img {
  display: block;
  width: 100%;
  height: auto;
}

/* v1.3: VOICE is a slider only on smartphones */
.ps-mobile-slider-nav { display: none; }
@media screen and (max-width: 749px) {
  .voiceSliderBox {
    width: calc(100% - 4rem);
    margin-left: auto;
    margin-right: auto;
    overflow: visible;
  }
  .voiceSlider.ps-mobile-slider {
    position: relative;
    overflow: hidden;
  }
  .voiceSlider.ps-mobile-slider > .ps-mobile-slide {
    display: none;
  }
  .voiceSlider.ps-mobile-slider > .ps-mobile-slide.is-active {
    display: block;
  }
  .voiceSlider.ps-mobile-slider img {
    width: 100%;
    height: auto;
    display: block;
  }
  .ps-mobile-slider-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem;
    margin-top: 2.4rem;
  }
  .ps-mobile-slider-arrow {
    border: 0;
    width: 4.8rem;
    height: 4.8rem;
    cursor: pointer;
    background: transparent url(../img/next.webp) center/contain no-repeat;
    text-indent: -9999px;
    overflow: hidden;
    padding: 0;
  }
  .ps-mobile-slider-arrow.ps-mobile-prev { transform: scaleX(-1); }
  .ps-mobile-slider-dots {
    display: flex;
    gap: .9rem;
    align-items: center;
    justify-content: center;
  }
  .ps-mobile-slider-dot {
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 50%;
    border: 0;
    padding: 0;
    background: #d9d9d9;
    cursor: pointer;
  }
  .ps-mobile-slider-dot.is-active { background: var(--orange, #f36f27); }
}


/* v1.4: TEST LP compatible achievement/results carousel */
.resultsInner { position: relative; }
.resultsSlider.ps-slider.ps-carousel-ready {
  width: 68rem;
  display: flex;
  overflow: visible;
  margin: 0 auto;
  transition: transform .65s cubic-bezier(.22,.61,.36,1);
  will-change: transform;
}
.resultsSlider.ps-slider.ps-carousel-ready > .ps-carousel-slide {
  display: block !important;
  flex: 0 0 100%;
  width: 100%;
}
.resultsInner { overflow: hidden; }
.resultsInner .resultsTitle { position: relative; z-index: 2; }
.resultsInner .ps-results-arrow {
  position: absolute;
  top: calc(50% + 8rem);
  width: 9rem;
  height: 9rem;
  border: 0;
  padding: 0;
  z-index: 20;
  cursor: pointer;
  background: transparent url(../img/next.webp) center/contain no-repeat;
  text-indent: -9999px;
  overflow: hidden;
}
.resultsInner .ps-results-prev { left: calc(50% - 39rem); transform: translateY(-50%) scaleX(-1); }
.resultsInner .ps-results-next { right: calc(50% - 39rem); transform: translateY(-50%); }
.ps-results-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  margin-top: 2.2rem;
}
.ps-results-dot {
  width: 1.4rem; height: 1.4rem; border-radius: 50%; border: 0; padding: 0;
  background: #cfd4dc; cursor: pointer;
}
.ps-results-dot.is-active { background: var(--orange, #f36f27); }

/* v1.4: VOICE = 3-column carousel on PC, 1-card carousel on smartphone */
.voiceSliderBox.ps-voice-carousel-box {
  width: min(112rem, calc(100% - 8rem));
  position: relative;
  overflow: visible;
}
.voiceSlider.ps-voice-carousel-ready {
  display: flex;
  gap: 2.2rem;
  align-items: stretch;
  overflow: hidden;
}
.voiceSlider.ps-voice-carousel-ready > .ps-voice-slide {
  flex: 1 1 0;
  min-width: 0;
}
.voiceSlider.ps-voice-carousel-ready > .ps-voice-slide img {
  width: 100%; height: auto; display: block;
}
.ps-voice-arrow {
  position: absolute;
  top: 50%;
  width: 6rem; height: 6rem;
  border: 0; padding: 0; z-index: 20; cursor: pointer;
  background: transparent url(../img/next.webp) center/contain no-repeat;
  text-indent: -9999px; overflow: hidden;
}
.ps-voice-prev { left: -4rem; transform: translateY(-50%) scaleX(-1); }
.ps-voice-next { right: -4rem; transform: translateY(-50%); }
.ps-voice-dots {
  display: flex; justify-content: center; align-items: center; gap: .9rem; margin-top: 2.4rem;
}
.ps-voice-dot { width: 1.2rem; height: 1.2rem; border-radius: 50%; border: 0; padding: 0; background: #cfd4dc; cursor: pointer; }
.ps-voice-dot.is-active { background: var(--orange, #f36f27); }

@media screen and (max-width: 749px) {
  .resultsSlider.ps-slider.ps-carousel-ready { width: calc(100% - 6rem); }
  .resultsInner .ps-results-arrow { width: 6.4rem; height: 6.4rem; top: calc(50% + 5rem); }
  .resultsInner .ps-results-prev { left: .5rem; }
  .resultsInner .ps-results-next { right: .5rem; }

  .voiceSliderBox.ps-voice-carousel-box { width: calc(100% - 5rem); }
  .voiceSlider.ps-voice-carousel-ready { gap: 0; }
  .voiceSlider.ps-voice-carousel-ready > .ps-voice-slide { flex: 0 0 100%; }
  .ps-voice-arrow { width: 5.6rem; height: 5.6rem; }
  .ps-voice-prev { left: -2.8rem; }
  .ps-voice-next { right: -2.8rem; }
}


/* v1.5: true autoplay motion, matching the test LP behavior */
.resultsSlider.ps-carousel-ready,
.voiceSlider.ps-voice-carousel-ready {
  will-change: transform;
  backface-visibility: hidden;
  transform: translate3d(0,0,0);
}
.voiceSlider.ps-voice-carousel-ready {
  overflow: visible;
  transition: transform .65s cubic-bezier(.22,.61,.36,1);
}
.voiceSliderBox.ps-voice-carousel-box {
  overflow: hidden;
  padding-left: 4rem;
  padding-right: 4rem;
  box-sizing: border-box;
}
.voiceSlider.ps-voice-carousel-ready > .ps-voice-slide {
  display: block !important;
  flex: 0 0 calc((100% - 4.4rem) / 3);
  min-width: calc((100% - 4.4rem) / 3);
}
.ps-voice-prev { left: .4rem; }
.ps-voice-next { right: .4rem; }

@media screen and (max-width: 749px) {
  .voiceSliderBox.ps-voice-carousel-box {
    width: calc(100% - 1rem);
    padding-left: 3.2rem;
    padding-right: 3.2rem;
  }
  .voiceSlider.ps-voice-carousel-ready > .ps-voice-slide {
    flex: 0 0 100%;
    min-width: 100%;
  }
  .ps-voice-prev { left: .1rem; }
  .ps-voice-next { right: .1rem; }
}

/* v1.6: VOICE uses one large card per viewport on both PC and mobile.
   The viewport clips adjacent cards completely so the next slide never peeks in. */
.voiceSliderBox.ps-voice-carousel-box {
  width: min(92rem, calc(100% - 4rem));
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}
.voiceSlider.ps-voice-carousel-ready {
  display: flex;
  gap: 0;
  width: 100%;
  overflow: visible;
  align-items: stretch;
}
.voiceSlider.ps-voice-carousel-ready > .ps-voice-slide {
  display: block !important;
  flex: 0 0 100%;
  min-width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.voiceSlider.ps-voice-carousel-ready > .ps-voice-slide img {
  display: block;
  width: 100%;
  height: auto;
}
.ps-voice-arrow {
  width: 6rem;
  height: 6rem;
  z-index: 30;
}
.ps-voice-prev { left: .8rem; }
.ps-voice-next { right: .8rem; }

@media screen and (max-width: 749px) {
  .voiceSliderBox.ps-voice-carousel-box {
    width: calc(100% - 2rem);
    padding: 0;
    overflow: hidden;
  }
  .voiceSlider.ps-voice-carousel-ready {
    gap: 0;
  }
  .voiceSlider.ps-voice-carousel-ready > .ps-voice-slide {
    flex: 0 0 100%;
    min-width: 100%;
    max-width: 100%;
  }
  .ps-voice-arrow {
    width: 5.4rem;
    height: 5.4rem;
  }
  .ps-voice-prev { left: .4rem; }
  .ps-voice-next { right: .4rem; }
}


/* v1.8: final hard-clipped RESULTS carousel.
   The viewport and one slide always share exactly the same width.
   Adjacent slides are painted outside the viewport and are fully clipped. */
.resultsInner {
  position: relative;
  overflow: visible;
}
.resultsInner .ps-results-viewport {
  position: relative;
  width: 68rem;
  max-width: calc(100% - 7rem);
  margin: 0 auto;
  padding: 0;
  overflow: hidden !important;
  clip-path: inset(0);
  contain: paint;
  box-sizing: border-box;
}
.resultsInner .ps-results-viewport > .resultsSlider.ps-slider.ps-carousel-ready {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  box-sizing: border-box;
}
.resultsInner .ps-results-viewport > .resultsSlider.ps-slider.ps-carousel-ready > .ps-carousel-slide {
  display: block !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
  overflow: hidden;
}
.resultsInner .ps-results-viewport .resultsCardImg {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}
/* Keep the navigation outside the clipped viewport, matching the test LP. */
.resultsInner .ps-results-arrow {
  z-index: 50;
}
.resultsInner .ps-results-prev {
  left: calc(50% - 39rem);
}
.resultsInner .ps-results-next {
  right: calc(50% - 39rem);
}

@media screen and (max-width: 749px) {
  .resultsInner .ps-results-viewport {
    width: calc(100% - 6rem);
    max-width: none;
  }
  .resultsInner .ps-results-viewport > .resultsSlider.ps-slider.ps-carousel-ready {
    width: 100% !important;
  }
  .resultsInner .ps-results-prev { left: .5rem; }
  .resultsInner .ps-results-next { right: .5rem; }
}
