@charset "UTF-8";
/* ------------------------------
- base
------------------------------ */
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-ExtraLight.eot");
  src: local("Jost ExtraLight"), local("Jost-ExtraLight"), url("../fonts/Jost/Jost-ExtraLight.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-ExtraLight.woff2") format("woff2"), url("../fonts/Jost/Jost-ExtraLight.woff") format("woff"), url("../fonts/Jost/Jost-ExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-Light.eot");
  src: local("Jost Light"), local("Jost-Light"), url("../fonts/Jost/Jost-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-Light.woff2") format("woff2"), url("../fonts/Jost/Jost-Light.woff") format("woff"), url("../fonts/Jost/Jost-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-SemiBold.eot");
  src: local("Jost SemiBold"), local("Jost-SemiBold"), url("../fonts/Jost/Jost-SemiBold.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-SemiBold.woff2") format("woff2"), url("../fonts/Jost/Jost-SemiBold.woff") format("woff"), url("../fonts/Jost/Jost-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-Regular.eot");
  src: local("Jost Regular"), local("Jost-Regular"), url("../fonts/Jost/Jost-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-Regular.woff2") format("woff2"), url("../fonts/Jost/Jost-Regular.woff") format("woff"), url("../fonts/Jost/Jost-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-ExtraBold.eot");
  src: local("Jost ExtraBold"), local("Jost-ExtraBold"), url("../fonts/Jost/Jost-ExtraBold.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-ExtraBold.woff2") format("woff2"), url("../fonts/Jost/Jost-ExtraBold.woff") format("woff"), url("../fonts/Jost/Jost-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-Black.eot");
  src: local("Jost Black"), local("Jost-Black"), url("../fonts/Jost/Jost-Black.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-Black.woff2") format("woff2"), url("../fonts/Jost/Jost-Black.woff") format("woff"), url("../fonts/Jost/Jost-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-Bold.eot");
  src: local("Jost Bold"), local("Jost-Bold"), url("../fonts/Jost/Jost-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-Bold.woff2") format("woff2"), url("../fonts/Jost/Jost-Bold.woff") format("woff"), url("../fonts/Jost/Jost-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-Medium.eot");
  src: local("Jost Medium"), local("Jost-Medium"), url("../fonts/Jost/Jost-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-Medium.woff2") format("woff2"), url("../fonts/Jost/Jost-Medium.woff") format("woff"), url("../fonts/Jost/Jost-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-Thin.eot");
  src: local("Jost Thin"), local("Jost-Thin"), url("../fonts/Jost/Jost-Thin.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-Thin.woff2") format("woff2"), url("../fonts/Jost/Jost-Thin.woff") format("woff"), url("../fonts/Jost/Jost-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: "Jost";
  src: url("../fonts/Jost/Jost-SemiBoldItalic.eot");
  src: local("Jost SemiBold Italic"), local("Jost-SemiBoldItalic"), url("../fonts/Jost/Jost-SemiBoldItalic.eot?#iefix") format("embedded-opentype"), url("../fonts/Jost/Jost-SemiBoldItalic.woff2") format("woff2"), url("../fonts/Jost/Jost-SemiBoldItalic.woff") format("woff"), url("../fonts/Jost/Jost-SemiBoldItalic.ttf") format("truetype");
  font-weight: 600;
  font-style: italic;
}
/* ------------------------------
- base
------------------------------ */
/* ------------------------------
- base
------------------------------ */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}

* {
  box-sizing: border-box;
  line-height: 1.5;
}

@media screen and (min-width: 750px) {
  html {
    font-size: 11.5px;
  }
}
@media screen and (max-width: 749px) {
  html {
    font-size: 2.66666vw;
  }
}
@media screen and (orientation: landscape) and (max-width: 1023px) {
  html {
    font-size: 1vw;
  }
}
html.is-phone.is-ajust {
  font-size: 12.64px;
  font-size: calc(var(--sizeAjust, 1px) * 12.64);
}

body {
  width: 100%;
  font-family: "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  color: #333;
}

main {
  display: block;
}

li {
  list-style-type: none;
}

a {
  text-decoration: none;
  color: inherit;
}
@media screen and (min-width: 750px) {
  a {
    transition: all 0.3s;
  }
  a::before, a::after {
    transition: all 0.3s;
  }
}

img, svg {
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
}

svg {
  height: auto;
}

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

input, button, textarea, select {
  appearance: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

address {
  font-style: normal;
}

video {
  max-width: 100%;
  max-height: 100%;
}

/* ------------------------------
- base
------------------------------ */
@media screen and (min-width: 1024px) {
  .visible-md, .visible-sm {
    display: none;
  }
  .visible-lg {
    display: inherit;
  }
}
@media screen and (min-width: 750px) and (max-width: 1023px) {
  .visible-lg, .visible-sm {
    display: none;
  }
  .visible-md {
    display: inherit;
  }
}
@media screen and (max-width: 749px) {
  .visible-lg, .visible-md {
    display: none;
  }
  .visible-sm {
    display: inherit;
  }
}

.en {
  font-family: "Jost", "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
}

.rel {
  position: relative;
}

.orange {
  color: #F19637;
}

.title__highlight {
  border-radius: 0.4rem;
}
.title__highlight.iceblue {
  background-color: #74C9DD;
}
.title__highlight.blue {
  background-color: #5e86a9;
}
.title__highlight.pink {
  background-color: #d2576d;
}
.title__highlight.green {
  background-color: #5ea989;
}

.color-yellow {
  color: #fff1bb;
}

.color-black {
  color: #333333;
}

.color-green {
  color: #5ea989;
}

.color-white {
  color: #fff;
}

.bg-yellow {
  background-color: #fff1bb;
}

.bg-blue {
  background: #74C9DD;
}

.color-orange {
  color: #EE6D00;
}

.color-red {
  color: #e20000;
}

.inline {
  display: inline;
}

.inline-block {
  display: inline-block;
}

.underline {
  background: linear-gradient(transparent 10%, #fff1bb 10%, #fff1bb 90%, transparent 100%);
}

.lh1 {
  line-height: 1;
}

.fz16 {
  font-size: 1.6rem;
}

.fz17 {
  font-size: 1.7rem;
}

.fz20 {
  font-size: 2rem;
}

.fz24 {
  font-size: 2.4rem;
}

.fz27 {
  font-size: 2.7rem;
}

.fw500 {
  font-weight: 500;
}

.tac {
  text-align: center;
}

.color-gold {
  color: #B28F28;
}

/* ------------------------------
- common
------------------------------ */
/* ------------------------------
- base
------------------------------ */
html,
body {
  height: 100%;
  overflow: auto;
}

.sound-onoff {
  width: 3.2rem;
  height: 3.2rem;
  background: #000;
  position: absolute !important;
  bottom: 0.5rem;
  left: 0.5rem;
  border-radius: 0.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  padding: 0;
  border: none;
  outline: none;
  z-index: 6;
}
.sound-onoff::before {
  display: block;
  font-family: "icomoon" !important;
  font-size: 1.8rem;
}
.sound-onoff.off {
  opacity: 0.5;
}
.sound-onoff.off::before {
  content: "\e911";
}
.sound-onoff:not(.off) {
  opacity: 0.7;
}
.sound-onoff:not(.off)::before {
  content: "\e912";
}

.zindex5 {
  position: relative;
  z-index: 5;
}

.zindex100 {
  position: relative;
  z-index: 100;
}

.zindex101 {
  position: relative;
  z-index: 101;
}

.screens {
  width: 100%;
  height: 100%;
  max-width: 100%;
  position: relative;
  overflow: hidden;
  padding-top: 5rem;
}

.screen {
  transform: scale(1.8);
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  transition: all 1s;
  pointer-events: none;
}
.screen.active {
  opacity: 1;
  transform: scale(1);
  transition-delay: 0.6s;
  pointer-events: auto;
}
.screen.-nopagehead {
  top: 0;
}
.screen:not(.-nopagehead) {
  top: auto;
  height: calc(100% - 5rem);
}
.screen.-cream {
  background-color: #f8f4e9;
}
.screen.-deco {
  background-image: url("../img/a4_steps/background_deco.png");
  background-repeat: no-repeat;
  background-size: cover;
}

.screen-timer {
  background: #2f8257;
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0.5rem;
  z-index: 16;
  transition: all 0.1s linear;
}

.sub-screen {
  opacity: 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  transition: all 0.5s;
  z-index: -1;
  pointer-events: none;
}
.sub-screen.active {
  opacity: 1;
  z-index: 5;
  pointer-events: auto;
}

.head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 0;
  font-family: "Jost", "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  font-size: 1.5rem;
  font-weight: 500;
  color: #74C9DD;
  border-bottom: 1px solid #DEDEDE;
}

.steps {
  display: flex;
  align-items: center;
}

.step {
  display: flex;
  align-items: center;
  font-size: 17px;
  color: rgba(51, 51, 51, 0.1);
  line-height: 1;
}
.step.active {
  color: #74C9DD;
}
.step::after {
  content: "";
  display: block;
  width: 1.2rem;
  height: 0.2rem;
  background-image: url("../img/seperator_step.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% auto;
  margin: 0 0.8rem;
}

.step__ticket {
  line-height: 1;
}

.step__ticket__img {
  width: 4.6rem;
}

.btn {
  background: #74C9DD;
  color: #fff;
  border: none;
  border-radius: 4.5rem;
  height: 4.8rem;
  width: 40rem;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.2);
  font-weight: 500;
  font-size: 1.6rem;
  font-family: "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  position: relative;
  padding: 0.5rem 1rem;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  transition: all 0.3s, transform 0.2s;
  overflow: hidden;
  cursor: pointer;
  line-height: 1.2;
  user-select: none;
  text-align: center;
}
.btn + .btn {
  margin-top: 1rem;
}
.btn::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  position: absolute;
  right: 2rem;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.2s;
}
.btn.-red {
  background: #e74138;
}
.btn.-pink {
  background: #ef2d55;
}
.btn.-pink2 {
  background: #DF5C78;
}
.btn.-white {
  background: #fff;
  color: #333;
}
.btn.-yellow {
  background: #FFF1BB;
  color: #333;
}
.btn:active {
  transform: translateY(0.3rem);
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2);
}

.pager__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 1.6rem;
  font-weight: bold;
  z-index: 0;
  padding: 2rem 5%;
}

.pager {
  color: #333;
  font-size: 1.6rem;
  display: flex;
  align-items: center;
  gap: 1.2rem;
  border: none;
  padding: 0;
  background: transparent;
  font-weight: bold;
  outline: none;
  transition: all 0.3s;
  user-select: none;
}
.pager::before, .pager::after {
  color: #333;
  font-family: "icomoon" !important;
  width: 4.8rem;
  height: 4.8rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #f2f2f2;
  border-radius: 50%;
}
.pager.-prev::before {
  content: "\e906";
}
.pager.-next::after {
  content: "\e90a";
  background: #74C9DD;
  color: #fff;
}
.pager:not(.-active) {
  opacity: 0;
  visibility: hidden;
}
.pager:active {
  transform: scale(0.93);
}
.pager:active::before, .pager:active:after {
  box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
}

.pager__fraction {
  color: #888;
}
.pager__fraction.-hidden {
  visibility: hidden;
}

.confetti {
  width: 100%;
  height: 50vh;
  z-index: 6;
  position: relative;
}

.container {
  padding: 0 2rem;
}

.screen__title {
  text-align: center;
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: 0.025em;
  margin-bottom: 2rem;
}

.screen__lead {
  text-align: center;
  font-size: 1.6rem;
  font-weight: 500;
  text-align: center;
  margin-bottom: 2rem;
}

.illust__wrapper {
  text-align: center;
}

.step__title {
  font-size: 2rem;
  color: #fff;
  font-weight: 500;
  display: inline-flex;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
}
.step__title:nth-of-type(n + 2) {
  margin-top: 0.6rem;
}
.step__title .-small {
  font-size: 1.2rem;
  transform: translateY(-0.8rem);
  display: inline-block;
}

.highlight-text-group {
  flex-direction: column;
}

.step__title__row {
  position: relative;
  padding: 0.3rem 1.25rem 0.3rem 1rem;
}

.dotlottie {
  max-width: 100%;
}

.focus-layer {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 2;
  opacity: 0;
  visibility: hidden;
  transition: all 1s;
}
.focus-layer.visible {
  opacity: 1;
  visibility: visible;
}

.focus-text {
  transition: all 0.7s;
}
.focus-text.focus-visible {
  color: #fff;
}

.focus-content {
  position: relative;
  z-index: 11;
}

.content__body {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.content__body:not(.-p0) {
  padding: 1.5rem 2.85rem;
}

.content__body__inner {
  flex: 1;
}

.custom-scrollable-y.scrollable::before {
  content: "";
  display: block;
  background-image: url("../img/common/scroll-y.png");
  width: 15rem;
  height: 10rem;
  background-size: contain;
  background-position: center center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.3s;
  z-index: 11;
}
.custom-scrollable-y.scrollable.scrolled:before {
  opacity: 0;
  visibility: hidden;
}
.custom-scrollable-y:hover:before {
  opacity: 0;
  visibility: hidden;
}

.custom-scrollable-slide {
  position: relative;
}
.custom-scrollable-slide::before {
  content: "";
  display: block;
  background-image: url("../img/common/scroll-x.png");
  width: 15rem;
  height: 10rem;
  background-size: contain;
  background-position: center center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.3s;
  z-index: 11;
}
.custom-scrollable-slide:hover::before, .custom-scrollable-slide.user-clicked::before {
  opacity: 0;
  visibility: hidden;
}

.js-tabItem {
  display: none;
}
.js-tabItem.active {
  display: block;
}

/* ------------------------------
- base
------------------------------ */
html.is-changing .transition-fadeInUp {
  transition: all 1000ms;
  transform: scale(1);
}
html.is-animating .transition-fadeInUp {
  opacity: 0;
  transform: scale(1.8);
}

html.is-changing .transition-fadeIn {
  transition: all 600ms;
}
html.is-animating .transition-fadeIn {
  opacity: 0;
}

.fade {
  opacity: 0;
  transition: all 0.8s;
}
.fade.animate {
  opacity: 1;
}

.show {
  visibility: hidden;
}
.show.animate {
  visibility: visible;
}

.hide.animate {
  visibility: hidden;
}

.infinite-scale {
  animation-name: scale;
  animation-duration: 0.8s;
  animation-timing-function: ease-in;
  animation-iteration-count: infinite;
  transform-origin: center center;
}

@keyframes scale {
  0% {
    transform: scale(0.98);
  }
  50% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.98);
  }
}
.blast {
  display: inline-block;
  transition: all 0.3s ease;
  opacity: 0;
  transform: translate(0, 0.5em);
  line-height: 1;
}
.blast.animate-blast {
  opacity: 1;
  transform: translate(0, 0);
}

.highlight.animate {
  width: 100% !important;
}

.highlight,
.highlight-single {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0;
  height: 100%;
}
.highlight.animate,
.highlight-single.animate {
  width: 100%;
}
.highlight.bdrs,
.highlight-single.bdrs {
  border-radius: 0.2em;
}

.highlight-single {
  transition: all 0.5s;
}

.highlight-text {
  position: relative;
  z-index: 1;
}

.fadeIn {
  opacity: 0;
  visibility: hidden;
  transition: all 0.6s;
}
.fadeIn.animate {
  opacity: 1;
  visibility: visible;
}

.fadeInUp {
  opacity: 0;
  visibility: hidden;
  translate: 0 1rem;
  transition: all 0.6s;
}
.fadeInUp.animate {
  opacity: 1;
  visibility: visible;
  translate: 0 0;
}

.fadeInDown {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-1rem);
  transition: all 0.6s;
}
.fadeInDown.animate {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.shake {
  animation-duration: 1s;
  animation-fill-mode: both;
}
.shake.animate {
  animation-name: wobble;
}

@keyframes wobble {
  0% {
    transform: scale(1);
  }
  10%, 20% {
    transform: scale(0.9) rotate(-3deg);
  }
  30%, 50%, 70%, 90% {
    transform: scale(1.1) rotate(3deg);
  }
  40%, 60%, 80% {
    transform: scale(1.1) rotate(-3deg);
  }
  100% {
    transform: scale(1) rotate(0);
  }
}
.blink {
  animation: blink-animation 0.8s steps(5, start) infinite;
}

.blink-long {
  animation: blink-twice 5s infinite; /* Total cycle is 5 seconds */
}

@keyframes blink-twice {
  0%, 100% {
    opacity: 1;
  }
  10%, 20% {
    opacity: 0;
  } /* First blink */
  20%, 40% {
    opacity: 1;
  } /* Visible */
  50%, 70% {
    opacity: 0;
  } /* Second blink */
  60%, 90% {
    opacity: 1;
  } /* Visible */
  100% {
    opacity: 1;
  } /* Rest of the time visible (5 seconds wait) */
}
@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
.delay1 {
  animation-delay: 0.1s;
}

.delay2 {
  animation-delay: 0.2s;
}

.delay3 {
  animation-delay: 0.3s;
}

.delay4 {
  animation-delay: 0.4s;
}

.rotateInLeft {
  transition: all 0.5s;
  display: block;
  transform-origin: center;
  opacity: 0;
}
.rotateInLeft.animate {
  animation: rotate 0.5s linear;
  opacity: 1;
}
.rotateInLeft.go {
  transition: all 0.6s, transform 0.2s;
}

@keyframes rotate {
  0% {
    transform: rotate(-90deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
.hover {
  position: absolute;
  width: 6rem;
  height: 6rem;
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
  display: block;
}
.hover::before, .hover::after {
  content: "";
  display: block;
  position: absolute;
  border-color: #fff;
  border-style: solid;
  border-radius: 50%;
  z-index: 5;
  display: block;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
}
.hover.active::before, .hover.active::after {
  opacity: 1;
}
.hover.-black::before, .hover.-black::after {
  border-color: #f19637;
}

.hover.active::before, .hover.active::after {
  animation: ripple-loader 8s ease-out infinite;
}
.hover.active::after {
  animation-delay: -0.5s;
}

@keyframes ripple-loader {
  0% {
    width: 0;
    height: 0;
    opacity: 1;
    border-width: 4px;
  }
  20% {
    width: 100%;
    height: 100%;
    opacity: 0;
  }
  100% {
    width: 100%;
    height: 100%;
    opacity: 0;
  }
}
@keyframes ripple-click {
  0% {
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    width: 100%;
    height: 100%;
    opacity: 0;
  }
}
.slow {
  transition: all 0.8s;
}
.slow.go {
  transition: all 0.6s, transform 0.2s;
}

.slowest {
  transition: all 1.2s;
}
.slowest.go {
  transition: all 0.6s, transform 0.2s;
}

.underline-animate {
  position: relative;
}

.underline-animate-text {
  position: relative;
  z-index: 1;
}

.underline-animate-line {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 0.6em;
  display: block;
  transition: all 0.8s;
  width: 0;
}
.underline-animate-line.animate {
  width: 100%;
}

.spinFadeIn {
  opacity: 0;
  transform-origin: 50% 50%;
  display: block;
  transform-box: fill-box;
  transition: opacity 1s;
}
.spinFadeIn.animate {
  animation: spin 1s;
  opacity: 1;
}

@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}
.scaleOut {
  transform: scale(1.5);
  transform-box: fill-box;
  transform-origin: 50% 50%;
  opacity: 0;
  transition: all 0.5s;
}
.scaleOut.animate {
  transform: scale(1);
  opacity: 1;
}

/* ------------------------------
- base
------------------------------ */
.page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 0.9rem 1.15rem 0;
  position: absolute;
  z-index: 7;
  left: 0;
  right: 0;
  top: 0;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s;
  transform: translateY(-1rem);
}
.page-header.show {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}
.page-header__back-btn {
  background: #efefef;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3rem 0.8rem;
  text-decoration: none;
  position: relative;
}
.page-header__back-btn::before {
  content: "\e906";
  font-family: "icomoon" !important;
  color: #333333;
  font-size: 1.5rem;
}
.page-header__back-text {
  color: #333333;
  font-size: 1.65rem;
  font-weight: 500;
  letter-spacing: 0.0825rem;
  line-height: 1.5;
}
.page-header__phone-cta {
  background: #e20000;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 3.3rem;
  width: 18.05rem;
  padding: 0 1rem 0 1.5rem;
  position: relative;
  text-decoration: none;
}
.page-header__phone-cta::before {
  content: "";
  background: url("/ad/lisg/sem/bst-general-rally/loop-main01/assets/img/reason/phone-icon.svg") center center/contain no-repeat;
  width: 1.2rem;
  height: 1.2rem;
  position: absolute;
  left: 1.2rem;
}
.page-header__phone-cta::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  color: #ffffff;
  position: absolute;
  right: 0.8rem;
  font-size: 1.4rem;
}
.page-header__phone-text {
  color: #ffffff;
  font-size: 1.65rem;
  font-weight: 700;
  letter-spacing: 0.0825rem;
  line-height: 1.5;
  pointer-events: none;
}
.page-header__phone-text__en {
  font-size: 1.5rem;
}

/* ------------------------------
- base
------------------------------ */
.page-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.page-nav__btn {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  text-decoration: none;
}
.page-nav__btn.hidden {
  visibility: hidden;
  opacity: 0;
}
.page-nav__btn--prev .page-nav__icon {
  background: #efefef;
}
.page-nav__btn--next {
  flex-direction: row-reverse;
}
.page-nav__btn--next .page-nav__icon {
  background: #2f8257;
}
.page-nav__btn--next .page-nav__icon::after {
  content: "\e90a";
  color: #ffffff;
}
.page-nav__btn--next .page-nav__text {
  text-align: right;
}
.page-nav__icon {
  border-radius: 50%;
  width: 4.8rem;
  height: 4.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  flex-shrink: 0;
}
.page-nav__icon::after {
  content: "\e906";
  font-family: "icomoon" !important;
  color: #333333;
  font-size: 1.6rem;
}
.page-nav__text {
  color: #333333;
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.08rem;
  line-height: 1.3;
}
.page-nav__text.-sm {
  font-size: 1.4rem;
}
.page-nav__counter {
  color: #888888;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.08rem;
  line-height: 1.5;
  flex: 1;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-nav__current {
  color: #888888;
}

/* ------------------------------
- base
------------------------------ */
.action-btn {
  border-radius: 3.5rem;
  height: 4.5rem;
  width: 100%;
  display: flex;
  align-items: center;
  text-decoration: none;
  padding: 0 2rem;
  box-shadow: 0 0.2rem 0.8rem rgba(0, 0, 0, 0.16);
  position: relative;
}
.action-btn--primary {
  background: #2f8257;
}
.action-btn--secondary {
  background: #ffffff;
  border: 0.4rem solid #2f8257;
}
.action-btn--video {
  background: #2f8257;
  justify-content: space-between;
  padding: 0.5rem 2rem;
}
.action-btn--with-label {
  padding: 0 1.5rem;
}
.action-btn__text {
  flex: 1;
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.action-btn--secondary .action-btn__text {
  color: #333333;
}
.action-btn--video .action-btn__text {
  line-height: 1.2;
}
.action-btn__text-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  text-align: center;
}
.action-btn__text-small {
  color: #ffffff;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
}
.action-btn__text-large {
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  letter-spacing: 0.08rem;
}
.action-btn__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.action-btn__arrow::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  color: #ffffff;
  font-size: 1.4rem;
}
.action-btn--secondary .action-btn__arrow::after {
  color: #2f8257;
}
.action-btn--with-label .action-btn__arrow {
  position: absolute;
  right: 1.4rem;
}
.action-btn__label {
  background: #fef693;
  border-radius: 0.4rem;
  color: #333333;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0.075rem;
  line-height: 1.2;
  padding: 0.2rem 0.5rem;
  margin-right: 1rem;
  flex-shrink: 0;
}
.action-btn__icon {
  width: 2.1rem;
  height: 2.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.action-btn__icon img {
  display: block;
  width: 100%;
  height: 100%;
}
.action-btn__icon--arrow::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  color: #ffffff;
}

/* ------------------------------
- base
------------------------------ */
.decoration-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.decoration-title__icon {
  width: 1.35rem;
  height: 1.65rem;
  flex-shrink: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.decoration-title__text {
  color: #333333;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  letter-spacing: 0.08rem;
}

/* ------------------------------
- base
------------------------------ */
.step-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 0.5rem;
}
.step-cards__card {
  background: #ffffff;
  border: 1px solid #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  padding: 0.6rem;
  position: relative;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
}
.step-cards__number {
  color: #2f8257;
  font-family: "Poppins", sans-serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
}
.step-cards__icon {
  width: 3.7rem;
  height: 3.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.step-cards__icon img {
  display: block;
  max-width: 100%;
  max-height: 100%;
}
.step-cards__text {
  color: #333333;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  margin: 0;
}

/* ------------------------------
- base
------------------------------ */
.ribbontitle__wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

.ribbontitle__container {
  position: relative;
  padding: 0 1.7rem 0.6rem 1.7rem;
}
.ribbontitle__container::before, .ribbontitle__container::after {
  content: "";
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  position: absolute;
  bottom: 0;
}
.ribbontitle__container::before {
  left: 0;
  background-image: url("../img/common/ribbon_left.png");
}
.ribbontitle__container::after {
  right: 0;
  background-image: url("../img/common/ribbon_right.png");
}

.ribbontitle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  height: 3rem;
  background: #2f8257;
  color: #fff;
  padding: 0 1.3rem;
  border: 0.2rem solid #fff;
  box-sizing: border-box;
  position: relative;
  z-index: 1;
}

/* ------------------------------
- base
------------------------------ */
body {
  background-image: url("../img/side/bg.jpg");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% auto;
}

@media screen and (min-width: 1200px) {
  .content {
    display: grid;
    grid-template-areas: "left main right";
    grid-template-columns: minmax(calc((100% - 474px) / 2), 483px) 474px minmax(calc((100% - 474px) / 2), 483px);
    align-items: center;
    height: 100vh;
    margin: 0 auto;
    min-height: calc(688px + 8rem);
  }
}
@media screen and (max-width: 1199px) {
  .content {
    height: 100%;
  }
}
.is-phone .content {
  min-height: auto;
  height: 100%;
}
.add-ajustContentHeight .content {
  min-height: calc(688px + 8rem);
  width: 474px;
  margin: 0 auto;
}

.content__outer {
  display: flex;
  align-items: center;
  position: relative;
}
@media screen and (min-width: 1200px) {
  .content__outer {
    width: 474px;
  }
  .is-phone .content__outer {
    width: auto;
  }
}
@media screen and (max-width: 1199px) {
  .content__outer {
    width: 100%;
    height: 100%;
  }
}

.content__inner {
  overflow: hidden;
  background: #ffffff url("/ad/lisg/sem/bst-general-rally/loop-main01/assets/img/common/background-light.png") center center/cover no-repeat;
}
@media screen and (min-width: 1200px) {
  .content__inner {
    position: relative;
    grid-area: main;
    box-shadow: rgba(0, 0, 0, 0.16) 0 0 16px;
    aspect-ratio: 474/688;
    height: 688px;
    width: 100%;
  }
  .is-phone .content__inner {
    height: calc(100vh - 8rem);
    height: calc(var(--vh, 1vh) * 100 - 8rem);
  }
}
@media screen and (max-width: 1199px) {
  .content__inner {
    width: 100%;
    height: 100%;
  }
}
.add-ajustContentHeight .content__inner {
  aspect-ratio: 474/688;
  height: 688px;
  width: 474px;
}
.content__inner .frame {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.side__left__head,
.side__right__head {
  position: absolute;
}
.side__left__head img,
.side__right__head img {
  width: 100%;
}

.side__left__head {
  top: calc((100vh - 688px) / -2.5);
  right: calc(100% + 1rem);
  width: calc((100vw - 474px) / 2 - 2rem);
}

.side__right__head {
  top: calc((100vh - 688px) / -2.5);
  left: calc(100% + 1rem);
  width: calc((100vw - 474px) / 2 - 2rem);
}

/* ------------------------------
- base
------------------------------ */
.side {
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 1199px) {
  .side {
    display: none;
  }
}

.side__top img {
  width: 100%;
}

.side__content {
  flex: 1;
  padding: 0 2.5vw 0 2.5vw;
  display: flex;
  align-items: center;
}
.side__content.-left {
  justify-content: flex-end;
}

.side__content__inner {
  width: 35rem;
  max-width: 100%;
}

.side__left {
  grid-area: left;
}

.side__right {
  grid-area: right;
}

.side__spacer {
  height: clamp(10px, 25vh - 10vw, 30vh);
  background: #f3eddc;
}

.side__left__text {
  text-align: center;
  margin-top: 1.7rem;
}

.side__cta {
  text-align: center;
}

.side__cta__img {
  width: 100%;
}
.side__cta__img img {
  width: 100%;
}

.side__cta__title {
  font-size: 1.8rem;
  font-weight: bold;
  margin-top: 4rem;
  display: inline-block;
  position: relative;
  padding: 0 26.32px;
}
.side__cta__title::before, .side__cta__title::after {
  content: "";
  display: block;
  width: 18.87px;
  height: 22.65px;
  background-size: contain;
  background-position: center center;
  position: absolute;
  bottom: 0.3em;
}
.side__cta__title::before {
  background-image: url("../img/side/side_left_dec.png");
  left: 0;
}
.side__cta__title::after {
  background-image: url("../img/side/side_right_dec.png");
  right: 0;
}

.cta__btns {
  margin-top: 1.2rem;
  gap: 1.2rem;
  display: flex;
  flex-direction: column;
}

.side__btn {
  display: flex;
  color: #fff;
  height: 5.2rem;
  align-items: center;
  justify-content: space-between;
  font-size: 1.8rem;
  font-weight: 600;
  border-radius: 999px;
  padding: 0.2rem 2rem 0.2rem 2.7rem;
  letter-spacing: 0.05em;
  width: 100%;
}
.side__btn * {
  pointer-events: none;
}
.side__btn span {
  line-height: 1;
  pointer-events: none;
}
.side__btn::after {
  content: "\e90a";
  font-family: "icomoon" !important;
}
.side__btn.-phone {
  background: #E20000;
  justify-content: flex-start;
}
.side__btn.-phone::after {
  display: none;
}
.side__btn.-email {
  background: #FE7603;
}

.side__btn__sm {
  font-size: 1rem;
  font-weight: normal;
  display: block;
}

.side__btn__number {
  line-height: 1;
  font-weight: 600;
}

.side__btn__inner {
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* ------------------------------
- base
------------------------------ */
.index {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.index__head {
  background: #ffffff;
  padding: 0.4rem 1rem 1.05rem 1rem;
  text-align: center;
}
.index__logo {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 5rem;
  padding: 0.425rem 0.575rem;
}
.index__logo img {
  width: 10.3rem;
  height: auto;
}
.index__heading {
  margin-bottom: 0.7rem;
}
.index__heading-main {
  color: #333333;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.index__subheading {
  background: #2f8257;
  border-radius: 0.4rem;
  padding: 0.4rem 0.8rem;
  display: inline-block;
}
.index__subheading-text {
  color: #ffffff;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.index__body {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  flex: 1;
  padding: 1.6rem 3.15rem;
  position: relative;
}
.index__video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.index__video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.index__cta-btn {
  border: 2px solid #ffffff;
  border-radius: 3.525rem;
  box-shadow: 0 0.5rem 0 #0e5d34;
  display: block;
  height: 4.4rem;
  position: relative;
  text-decoration: none;
  z-index: 1;
  background: linear-gradient(-45deg, #2f8257 50%, rgb(85.3389830508, 193.6610169492, 137.5423728814) 60%, #2f8257 70%);
  background-size: 600% 100%;
  animation: shine 14s infinite;
  animation-delay: 0s;
  animation-timing-function: linear;
}
.index__cta-btn::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  color: #2f8257;
  position: absolute;
  right: 1.4rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.6rem;
  height: 1.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 50%;
  line-height: 1;
  padding-top: 0.1em;
  padding-left: 0.1em;
  box-sizing: border-box;
}
.index__cta-text {
  color: #ffffff;
  font-family: "YuGothic", sans-serif;
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: 0.085rem;
  line-height: 1.2;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.index__foot {
  background: #f9f5ec;
  padding: 0.55rem 1rem 1rem;
}
.index__campaign {
  padding-right: 3.5rem;
  margin-bottom: 0.75rem;
}
.index__points {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  margin-bottom: 0.8rem;
}
.index__point img {
  display: block;
  width: 11.5rem;
  height: auto;
}
.index__disclaimer {
  color: #333333;
  font-size: 0.6rem;
  line-height: 1.5;
  text-align: center;
}

@keyframes shine {
  0% {
    background-position-x: 400%;
  }
  50% {
    background-position-x: 0%;
  }
  100% {
    background-position-x: -400%;
  }
}
/* ------------------------------
- base
------------------------------ */
.select {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.select__head {
  background: #ffffff;
  box-shadow: 0 0.2rem 0.2rem rgba(0, 0, 0, 0.08);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 5rem;
  padding: 0.45rem 10.65rem;
  position: relative;
  z-index: 11;
}
.select__logo img {
  width: 10.3rem;
  height: auto;
}
.select__body {
  flex: 1;
  padding: 2.2rem 2.85rem;
}
.select__title {
  color: #333333;
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.08rem;
  line-height: 1.5;
  text-align: center;
  margin-bottom: 1.2rem;
}
.select__buttons {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  margin-bottom: 1.25rem;
}
.select__button {
  background: #2f8257;
  border-radius: 3.5rem;
  box-shadow: 0 0.2rem 0.8rem rgba(0, 0, 0, 0.16);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 4.5rem;
  padding: 1.75rem 2rem;
  position: relative;
  text-decoration: none;
}
.select__button::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  color: #ffffff;
  position: absolute;
  right: 1.4rem;
  top: 50%;
  transform: translateY(-50%);
}
.select__button-text {
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.08rem;
  line-height: 1.2;
}
.select__button.clicked {
  filter: grayscale(100%);
}
.select__square-buttons {
  display: flex;
  gap: 1.2rem;
  justify-content: center;
}
.select__square-btn {
  display: block;
  flex: 1;
}
.select__square-btn img {
  display: block;
  height: auto;
  box-shadow: 0 0.2rem 0.8rem rgba(0, 0, 0, 0.16);
  border-radius: 1.5rem;
  width: 100%;
  pointer-events: none;
}
.select__square-btn.clicked {
  filter: grayscale(100%);
}
.select__foot__clone {
  flex-shrink: 0;
}
.select__foot__clone, .select__foot {
  height: 11.7rem;
}
.select__foot {
  background: #efefef;
  padding: 1.2rem 2.85rem;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 5;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s;
}
.select__foot.show {
  opacity: 1;
  visibility: visible;
}
.select__campaign {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.2rem;
}
.select__campaign::before, .select__campaign::after {
  content: "";
  background: url("/ad/lisg/sem/bst-general-rally/loop-main01/assets/img/select/campaign-icon-left.svg") center center/contain no-repeat;
  width: 1rem;
  height: 1.2rem;
  margin: 0 0.4rem;
}
.select__campaign::after {
  background-image: url("/ad/lisg/sem/bst-general-rally/loop-main01/assets/img/select/campaign-icon-right.svg");
}
.select__campaign-text {
  color: #333333;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.5;
}
.select__footer-buttons {
  display: flex;
  gap: 0.8rem;
  justify-content: center;
}
.select__footer-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 6.35rem;
  color: #fff;
  border-radius: 999px;
  font-size: 1.3rem;
  font-weight: 500;
  width: 15.5rem;
  position: relative;
}
.select__footer-btn::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  position: absolute;
  right: 1.2rem;
  top: 50%;
  transform: translateY(-50%);
}
.select__footer-btn.-phone {
  background: #E20000;
}
@media screen and (min-width: 750px) {
  .select__footer-btn.-phone::after {
    display: none;
  }
}
.select__footer-btn.-email {
  background: #FE7603;
}
@media screen and (min-width: 750px) {
  .select__footer-btn__phone__sp {
    display: none;
  }
}
@media screen and (max-width: 749px) {
  .select__footer-btn__phone__sp {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
.select__footer-btn__phone__pc__img {
  width: 1.4rem;
  margin-right: 0.5rem;
}
.select__footer-btn__phone__pc {
  font-family: "Jost", "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  font-size: 1.5rem;
}
@media screen and (min-width: 750px) {
  .select__footer-btn__phone__pc {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
@media screen and (max-width: 749px) {
  .select__footer-btn__phone__pc {
    display: none;
  }
}
.select__footer-btn__phone__free {
  background: #fff;
  color: #E20000;
  display: block;
  width: 9.2rem;
  text-align: center;
  padding: 0.1rem;
}
.select__footer-btn * {
  pointer-events: none;
}

/* ------------------------------
- base
------------------------------ */
.reason {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.reason__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2.4rem 1.9rem;
}
.reason__content {
  text-align: center;
}
.reason__title {
  color: #333333;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  margin-bottom: 0.5rem;
}
.reason__title-highlight {
  color: #b28f28;
  font-size: 2.5rem;
}
.reason__title-note {
  color: #333333;
  font-size: 1.3rem;
}
.reason__chart {
  width: 21rem;
  margin: 0 auto;
}
.reason__disclaimer {
  color: #333333;
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.0325rem;
  line-height: 1.8;
  text-align: center;
  margin-top: 0.5rem;
}
.reason__foot {
  padding: 0 2.85rem 3rem;
}
.reason__footer-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.reason__question {
  color: #333333;
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: 0.085rem;
  line-height: 1.5;
  text-align: center;
}
.reason__buttons {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.reason__btn__text {
  padding-right: 4rem;
}

/* ------------------------------
- base
------------------------------ */
.a-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.a-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
  padding: 1rem 2.85rem;
}
.a-page__title {
  color: #333333;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.a-page__subtitle {
  color: #b28f28;
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.a-page__image {
  text-align: center;
}
.a-page__description-text {
  color: #333333;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.08rem;
  line-height: 1.5;
}
.a-page__highlight {
  color: #ee6d00;
}
.a-page__note {
  color: #333333;
  font-size: 1rem;
}
.a-page__footnote {
  color: #333333;
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.0325rem;
  line-height: 1.5;
  margin-top: 0.5rem;
}
.a-page__body--with-note {
  padding-bottom: 0.65rem;
}
.a-page__other-reason {
  display: flex;
  justify-content: center;
}
.a-page__other-reason-btn {
  background: transparent;
  border: 0.15rem solid #ffffff;
  border-radius: 3rem;
  width: 28.05rem;
  height: 4.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.a-page__other-reason-text {
  color: #333333;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
}
.a-page__foot {
  padding: 0 2.85rem 1.6rem;
}

/* ------------------------------
- base
------------------------------ */
.b-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.b-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.6rem;
  padding: 1rem 1.95rem;
}
.b-page__title {
  color: #333333;
  font-size: 1.9rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.b-page__subtitle {
  color: #b28f28;
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.b-page__image {
  text-align: center;
}
.b-page__description-text {
  color: #333333;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.08rem;
  line-height: 1.5;
}
.b-page__highlight {
  color: #ee6d00;
}
.b-page__other-reason {
  display: flex;
  justify-content: center;
}
.b-page__other-reason-btn {
  background: transparent;
  border: 0.15rem solid #ffffff;
  border-radius: 3rem;
  width: 28.05rem;
  height: 4.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.b-page__other-reason-text {
  color: #333333;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
}
.b-page__foot {
  padding: 0 2.85rem 1.6rem;
}

/* ------------------------------
- base
------------------------------ */
.useful-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.useful-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.3rem;
  padding: 1rem 2.725rem 1rem;
}
.useful-page__body.-padding-sm {
  padding: 1rem;
}
.useful-page__body--centered {
  gap: 2.8rem;
}
.useful-page__text-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.useful-page__title {
  color: #333333;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}
.useful-page__highlight {
  color: #B28F28;
}
.useful-page__highlight.-orange {
  color: #EE6D00;
}
.useful-page__badge {
  background: #fef693;
  border-radius: 0.4rem;
  color: #333333;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.075rem;
  padding: 0.5rem 0.4rem;
  text-align: center;
  width: fit-content;
  margin: 0 auto;
}
.useful-page__subtitle {
  color: #b28f28;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.useful-page__subtitle-large {
  color: #b28f28;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}
.useful-page__image {
  text-align: center;
}
.useful-page__description {
  text-align: center;
}
.useful-page__description-text {
  color: #333333;
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: 0.085rem;
  line-height: 1.5;
}
.useful-page__bottom-text {
  color: #333333;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 0.09rem;
  line-height: 1.5;
}
.useful-page__bottom-text.-tal {
  text-align: left;
}
.useful-page__cta-section {
  display: flex;
  justify-content: center;
}
.useful-page__cta-btn {
  background: #ffffff;
  border: 0.2rem solid #2f8257;
  border-radius: 3rem;
  width: 28.05rem;
  height: 7.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.useful-page__cta-text {
  color: #333333;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}
.useful-page__foot {
  padding: 0 2.85rem 1.6rem;
}

.useful02-page__head {
  margin: 0 -1.85rem;
}

/* ------------------------------
- base
------------------------------ */
.item-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.item-page__body {
  flex: 1;
  padding: 2rem 2.85rem 4.8rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.item-page__title {
  color: #333333;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.8;
  text-align: center;
  margin: 0;
}
.item-page__grid-scroll {
  flex: 1;
  position: relative;
}
.item-page__grid-wrapper {
  background: #f2f3ee;
  border: 0.2rem solid #2f8257;
  border-radius: 0.4rem;
  padding: 1rem;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  overflow: auto;
}
.item-page__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.05rem;
}

.item-card {
  background: #ffffff;
  border-radius: 0.8rem;
  box-shadow: 0 0.179rem 0.715rem rgba(0, 0, 0, 0.16);
  display: flex;
  align-items: center;
  padding: 1.607rem 1.072rem;
  text-decoration: none;
}
.item-card__icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 3.55rem;
  height: 3.55rem;
}
.item-card__icon {
  max-width: 100%;
  max-height: 100%;
  display: block;
}
.item-card__label {
  flex: 1;
  color: #333333;
  font-size: 1.34rem;
  font-weight: 700;
  line-height: 1.5;
  margin-left: 0.715rem;
}
.item-card__arrow {
  flex-shrink: 0;
  width: 0.446rem;
  height: 0.893rem;
}
.item-card__arrow::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  color: #333333;
}

/* ------------------------------
- base
------------------------------ */
.product-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.product-page__body {
  flex: 1;
  padding: 2rem 2.85rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.product-page__foot {
  padding: 0 2.85rem 2.85rem;
}

.product-ribbon {
  display: flex;
  justify-content: center;
}
.product-ribbon__image {
  height: auto;
  width: 17.124rem;
  display: block;
}

.product-tabs {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.product-tabs__header {
  display: flex;
  gap: 0.4rem;
  align-items: flex-end;
}
.product-tabs__content {
  background: #ffffff;
  border: 0.2rem solid #2f8257;
  border-radius: 0 0 0.2rem 0.2rem;
  padding: 1.2rem;
}
.product-tabs__content--faq {
  position: relative;
  flex: 1;
}
.product-tabs-faq__scroll {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  overflow: auto;
  padding: 1.2rem 1rem;
}

.product-tab {
  flex: 1;
  background: #ffffff;
  border: 0.2rem solid #2f8257;
  border-bottom: none;
  border-radius: 0.2rem 0.2rem 0 0;
  box-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.08);
  padding: 0.6rem 1.6rem;
  height: 4.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-decoration: none;
  cursor: pointer;
  font-family: inherit;
}
.product-tab--active {
  background: #2f8257;
  height: 4.7rem;
}
.product-tab--active .product-tab__text {
  color: #ffffff;
}
.product-tab--active .product-tab__arrow::after {
  content: "\e90a";
  color: #ffffff;
}
.product-tab__text {
  color: #333333;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
}
.product-tab__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.8rem;
  height: 0.8rem;
  color: #000;
  margin-top: 0.5rem;
}
.product-tab__arrow::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  color: #2f8257;
  transform: rotate(90deg) scaleY(-1);
}

.product-item {
  display: flex;
  gap: 1.6rem;
  margin-bottom: 1.6rem;
}
.product-item__image {
  width: 13.4rem;
  height: auto;
  display: block;
}
.product-item__details {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.3rem;
}
.product-item__name {
  color: #000000;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}
.product-item__price-section {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.product-item__price-label {
  color: #000000;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.3;
}
.product-item__price {
  line-height: 1;
}
.product-item__price-value {
  color: #e20000;
  font-family: "Poppins", sans-serif;
  font-size: 2.75rem;
  font-weight: 700;
}
.product-item__price-unit {
  color: #e20000;
  font-size: 1.2rem;
  font-weight: 900;
}

.product-disclaimer {
  color: #333333;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.3;
}

.product-faq {
  display: flex;
  flex-direction: column;
  gap: 0;
  flex: 1;
}

.product-faq-item__question {
  background: #4d947a;
  border-radius: 0.2rem 0.2rem 0 0;
  padding: 1rem 0.8rem;
  display: flex;
  gap: 0.8rem;
  align-items: center;
}
.product-faq-item__answer {
  background: #f2f3ee;
  padding: 1.2rem 0.8rem;
  display: flex;
  gap: 0.8rem;
}
.product-faq-item__icon {
  background: #ffffff;
  border-radius: 1.5rem;
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #2f8257;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
}
.product-faq-item__icon--answer {
  background: #4d947a;
  color: #ffffff;
}
.product-faq-item__text {
  flex: 1;
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
}
.product-faq-item__answer .product-faq-item__text {
  color: #333333;
  font-weight: 500;
}

.product-actions {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.product-btn {
  border-radius: 3.5rem;
  height: 4.5rem;
  display: flex;
  align-items: center;
  text-decoration: none;
}
.product-btn--primary {
  background: #2f8257;
  box-shadow: 0 0.2rem 0.8rem rgba(0, 0, 0, 0.16);
  padding: 0 2rem;
}
.product-btn--secondary {
  background: #ffffff;
  border: 0.4rem solid #2f8257;
  box-shadow: 0 0.2rem 0.8rem rgba(0, 0, 0, 0.16);
  padding: 0 2rem;
}
.product-btn__text {
  flex: 1;
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-btn--secondary .product-btn__text {
  color: #333333;
}
.product-btn__arrow {
  width: 0.5rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.product-btn__arrow::after {
  content: "\e90a";
  font-family: "icomoon" !important;
  color: #ffffff;
}
.product-btn--secondary .product-btn__arrow::after {
  color: #2f8257;
}

/* ------------------------------
- base
------------------------------ */
.way-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.way-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2.4rem;
  padding: 1rem 1.55rem 2.85rem;
}
.way-page__text-container {
  display: flex;
  flex-direction: column;
}
.way-page__title {
  color: #b28f28;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  margin-bottom: 1rem;
}
.way-page__image {
  display: flex;
  justify-content: center;
  margin-bottom: 2rem;
}
.way-page__image img {
  height: auto;
}
.way-page__question {
  color: #333333;
  font-size: 1.7rem;
  font-weight: 500;
  line-height: 1.5;
  text-align: center;
  letter-spacing: 0.085rem;
  margin-bottom: 1rem;
}
.way-page__buttons {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.way-page__method-btn {
  background: #2f8257;
  border-radius: 3rem;
  height: 6.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.way-page__method-text {
  color: #ffffff;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}
.way-page__foot {
  padding: 0 2.85rem 1.6rem;
}

/* ------------------------------
- base
------------------------------ */
.firsttime-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.firsttime-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.3rem;
  padding: 1.5rem 2.85rem 1.5rem;
}
.firsttime-page__title {
  display: flex;
  flex-direction: column;
  font-weight: 700;
  line-height: 1.3;
  color: #333333;
  text-align: center;
}
.firsttime-page__title p {
  font-size: 2rem;
  margin: 0;
}
.firsttime-page__title h1 {
  font-size: 2rem;
  margin: 0;
}
.firsttime-page__title--05 {
  margin: 0 -2rem 2rem -2rem;
}
.firsttime-page__title--01 {
  margin-bottom: 0.5rem;
}
.firsttime-page__title-black {
  color: #333333;
}
.firsttime-page__title--gold {
  color: #b28f28;
}
.firsttime-page__title-asterisk {
  font-size: 1rem;
  color: #333333;
}
.firsttime-page__subtitle {
  color: #333333;
  font-size: 0.65rem;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.0325rem;
}
.firsttime-page__description {
  color: #333333;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.08rem;
}
.firsttime-page__description--01 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.firsttime-page__image {
  display: flex;
  justify-content: center;
}
.firsttime-page__image img {
  display: block;
  max-width: 100%;
  height: auto;
}
.firsttime-page__video-section {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0 2.85rem 1.5rem 2.85rem;
  z-index: 7;
  opacity: 0;
  visibility: hidden;
  opacity: 0;
  transform: translateY(1rem);
  transition: all 0.3s;
}
.firsttime-page__video-section.show {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}
.firsttime-page__video-btn {
  background: #2f8257;
  border-radius: 3.5rem;
  box-shadow: 0 0.2rem 0.8rem rgba(0, 0, 0, 0.16);
  height: 4.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 2rem;
  text-decoration: none;
}
.firsttime-page__video-btn-text {
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}
.firsttime-page__video-btn-icon {
  width: 2.1rem;
  height: 2.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.firsttime-page__video-btn-icon img {
  display: block;
  max-width: 100%;
  height: auto;
}
.firsttime-page__disclaimer p {
  color: #333333;
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.04rem;
  margin: 0;
}
.firsttime-page__checklist {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.firsttime-page__checklist-item {
  display: flex;
  gap: 0.8rem;
  align-items: center;
}
.firsttime-page__check-icon {
  width: 2.4rem;
  height: 2.4rem;
  flex-shrink: 0;
}
.firsttime-page__check-icon img {
  display: block;
  width: 100%;
  height: 100%;
}
.firsttime-page__checklist-text {
  color: #333333;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
}
.firsttime-page__foot {
  padding: 0 2.85rem 12rem;
}

.firsttime-movie-page__body {
  padding: 0.8rem 2.85rem;
}

.warning-box {
  position: relative;
  margin: 0;
  width: 100%;
}
.warning-box::before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 2.7rem;
  background: #ffffff;
  border-radius: 0.4rem;
  box-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.25);
}
.warning-box.-green::before {
  top: 1.5rem;
}
.warning-box__header {
  background: #b28f28;
  border-radius: 0.4rem;
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.2;
  padding: 0.8rem 1.6rem;
  text-align: center;
  letter-spacing: 0.08rem;
  position: relative;
  display: inline-block;
  margin: 0 auto 0.5rem;
  left: 50%;
  transform: translateX(-50%);
  position: relative;
}
.warning-box__header:after {
  content: "";
  display: block;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 11px 10.5px 0 10.5px;
  border-color: #B28F28 transparent transparent transparent;
  transform: rotate(0deg);
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}
.-green .warning-box__header {
  background: #2f8257;
}
.-green .warning-box__header::after {
  border-color: #2f8257 transparent transparent transparent;
}
.warning-box__list {
  position: relative;
  z-index: 1;
  margin: 0;
  padding: 2rem;
  list-style: none;
}
.warning-box__item {
  display: flex;
  align-items: flex-start;
  gap: 0.8rem;
  margin-bottom: 1.2rem;
}
.warning-box__item:last-child {
  margin-bottom: 0;
}
.warning-box__icon {
  width: 1.6rem;
  height: 1.6rem;
  flex-shrink: 0;
  background: url("/ad/lisg/sem/bst-general-rally/loop-main01/assets/img/firsttime-04/check-icon.svg") center center/contain no-repeat;
  margin-top: 0.2rem;
}
.-green .warning-box__icon {
  background: url("/ad/lisg/sem/bst-general-rally/loop-main01/assets/img/firsttime-05/check-icon-green.svg") center center/contain no-repeat;
}
.warning-box__text {
  color: #333333;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.075rem;
}

.promise-box {
  position: relative;
  margin: 0;
  width: 100%;
}
.promise-box__header {
  background: #2f8257;
  border-radius: 0.4rem;
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.2;
  padding: 0.8rem 1.6rem;
  text-align: center;
  letter-spacing: 0.08rem;
  position: relative;
  display: inline-block;
  margin: 0 auto 2.6rem;
  left: 50%;
  transform: translateX(-50%);
}
.promise-box__header::after {
  content: "";
  position: absolute;
  bottom: -2.1rem;
  left: 50%;
  transform: translateX(-50%) rotate(180deg);
  width: 0;
  height: 0;
  border-left: 2.65rem solid transparent;
  border-right: 2.65rem solid transparent;
  border-top: 2.1rem solid #2f8257;
}
.promise-box__list {
  background: #ffffff;
  border-radius: 0.4rem;
  box-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.25);
  margin: 0;
  padding: 2.45rem 2rem;
  list-style: none;
}
.promise-box__item {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin-bottom: 1.2rem;
}
.promise-box__item:last-child {
  margin-bottom: 0;
}
.promise-box__icon {
  width: 1.6rem;
  height: 1.6rem;
  flex-shrink: 0;
  background: url("/ad/lisg/sem/bst-general-rally/loop-main01/assets/img/firsttime-05/check-icon-green.svg") center center/contain no-repeat;
}
.promise-box__text {
  color: #333333;
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.085rem;
}

.testimonials-swiper-container {
  position: relative;
  margin: 1rem 0 0 0;
}

.testimonials-swiper {
  flex: 1;
  overflow: hidden;
  width: 100%;
}
.testimonials-swiper .swiper-slide {
  height: auto;
}

.testimonials-arrow {
  width: 2.7rem;
  height: 8.9rem;
  background: #2f8257;
  border: none;
  cursor: pointer;
  flex-shrink: 0;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 11;
}
.testimonials-arrow::after {
  font-family: "icomoon" !important;
  color: #ffffff;
  font-size: 1.6rem;
  line-height: 1;
}
.testimonials-arrow--prev {
  border-radius: 1rem 0 0 1rem;
  left: 0.5rem;
}
.testimonials-arrow--prev::after {
  content: "\e906";
}
.testimonials-arrow--next {
  border-radius: 0 1rem 1rem 0;
  right: 0.5rem;
}
.testimonials-arrow--next::after {
  content: "\e90a";
}
.testimonials-arrow.swiper-button-disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.testimonials-pagination {
  display: flex;
  gap: 0.8rem;
  justify-content: center;
  margin: 1rem 0;
  position: static !important;
}
.testimonials-pagination .swiper-pagination-bullet {
  width: 0.75rem;
  height: 0.75rem;
  margin: 0 !important;
  border-radius: 50%;
  background: #cccccc;
  opacity: 1;
  margin: 0;
}
.testimonials-pagination .swiper-pagination-bullet-active {
  background: #2f8257;
}

.testimonials__disclaimer__container {
  padding: 0 2.85rem;
}

.testimonials__disclaimer {
  color: #333333;
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.0325rem;
  margin: 0;
  margin-bottom: 1rem;
}
.testimonials__disclaimer p {
  margin: 0;
}

.testimonial-card {
  background: #f2f3ee;
  border: 0.4rem solid #ffffff;
  border-radius: 0.6rem;
  padding: 0.8rem;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.testimonial-card__header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}
.testimonial-card__avatar {
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  background: #cccccc;
  flex-shrink: 0;
}
.testimonial-card__title {
  color: #2f8257;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.07rem;
  margin: 0;
}
.testimonial-card__body {
  background: #ffffff;
  border-radius: 0.4rem;
  padding: 1rem;
  flex: 1;
}
.testimonial-card__body p {
  color: #333333;
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.055rem;
  margin: 0;
}

.products-grid {
  text-align: center;
}

.video-container {
  display: flex;
  justify-content: center;
  margin: 3.2rem 0;
}
.video-container img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 0.4rem;
}

.firsttime-movie__head {
  text-align: center;
}

.firsttime-movie__head__title0 {
  font-weight: bold;
  font-size: 1.6rem;
}

.firsttime-movie__head__title1 {
  font-size: 2rem;
  color: #B28F28;
}

.firsttime-movie__tab {
  padding: 0.8rem 0;
}

.firsttime-movie__tabHead {
  display: flex;
  align-items: flex-end;
  grid-gap: 0.4rem;
  position: relative;
  z-index: 11;
  margin-bottom: -2px;
}

.firsttime-movie__tabBtnWrap {
  flex: 1;
  height: 5rem;
  display: flex;
  align-items: flex-end;
}

.firsttime-movie__tabBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 4.75rem;
  position: relative;
  z-index: 11;
  border: 2px solid #2f8257;
  border-radius: 0.5rem 0.5rem 0 0;
  background: #fff;
  transition: all 0.3s;
  line-height: 1;
  padding-top: 0.8rem;
  font-weight: 600;
  color: #000;
}
.firsttime-movie__tabBtn.active {
  height: 5rem;
  background: #2f8257;
  color: #fff;
}
.firsttime-movie__tabBtn.active::after {
  color: #fff;
}
.firsttime-movie__tabBtn::after {
  content: "\e90b";
  font-family: "icomoon" !important;
  line-height: 1;
  margin-top: auto;
  color: #2f8257;
}
.firsttime-movie__tabBtn__step {
  font-size: 1rem;
  font-family: "Jost", "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  line-height: 1;
  margin-bottom: 0.3rem;
}
.firsttime-movie__tabBtn__text {
  font-size: 1.2rem;
  line-height: 1;
}

.firsttime-movie__tabItem {
  padding: 1rem 2.2rem 1rem 2.2rem;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s;
  border: 2px solid #2f8257;
}
.firsttime-movie__tabItem.active {
  opacity: 1;
  visibility: visible;
}
.firsttime-movie__tabItem__title {
  font-size: 1.6rem;
  font-weight: bold;
  color: #B28F28;
  text-align: center;
  margin-bottom: 0.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}
.firsttime-movie__tabItem__title__step {
  background: #B28F28;
  color: #fff;
  padding: 0.2rem 0.8rem;
}
.firsttime-movie__tabItem__text {
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center;
  margin-top: 0.6rem;
}
.firsttime-movie__tabItem__text__sm {
  font-size: 1.2rem;
}

.firsttime-page--warnings .firsttime-page__body {
  gap: 1.5rem;
  padding: 1.5rem 2.85rem 1.5rem;
}
.firsttime-page--warnings .firsttime-page__title {
  font-size: 2rem;
}

.firsttime-page--promises .firsttime-page__body {
  gap: 5.8rem;
  padding: 2rem 2.85rem 2.4rem;
}
.firsttime-page--promises .firsttime-page__title {
  font-size: 1.8rem;
}

.firsttime-page--testimonials .firsttime-page__body {
  gap: 2.3rem;
  padding: 2.45rem 1rem 2.45rem;
}
.firsttime-page--testimonials .firsttime-page__title {
  font-size: 2rem;
  padding: 0;
}
.firsttime-page--testimonials .firsttime-page__video-section {
  padding: 0;
}

.firsttime-page--products .firsttime-page__body {
  gap: 1.2rem;
  padding: 1.5rem 2.85rem 1.5rem;
}
.firsttime-page--products .firsttime-page__title {
  font-size: 2rem;
}

.firsttime-page--video .firsttime-page__title {
  font-size: 2rem;
}
.firsttime-page--video .firsttime-page__foot--buttons {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 0 2.85rem 3rem;
}

.action-btn--large {
  height: 4.5rem;
}

.firsttime06-page__body {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.firsttime06-page__body__inner {
  flex: 1;
  width: 100%;
}

/* ------------------------------
- base
------------------------------ */
.campaign-page {
  background: #ffffff url("/ad/lisg/sem/bst-general-rally/loop-main01/assets/img/common/background-dark.png") center center/cover no-repeat;
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.campaign-page__body {
  flex: 1;
  display: flex;
  justify-content: center;
  gap: 1.8rem;
  padding: 1.6rem 2.85rem 2.2rem;
}
.campaign-page__body__inner {
  height: 100%;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.campaign-page__ribbon {
  display: flex;
  justify-content: center;
}
.campaign-page__ribbon img {
  display: block;
  max-width: 100%;
  height: auto;
}
.campaign-page__banner__wrapper {
  margin-bottom: 2rem;
}
.campaign-page__banner {
  margin-top: 2rem;
}
.campaign-page__content__wrapper {
  flex: 1;
  background: #fff;
  position: relative;
  border: 1px solid #C8C8C8;
}
.campaign-page__content__container {
  position: absolute;
  top: 1.5rem;
  bottom: 1.5rem;
  left: 0;
  right: 0;
  overflow: auto;
  padding: 0 1.5rem;
}
.campaign-page__content {
  display: flex;
  flex-direction: column;
  gap: 1.8rem;
}
.campaign-page__section {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.campaign-page__section-header {
  background: #7aae9b;
  padding: 0.8rem 1.5rem;
}
.campaign-page__section-title {
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.08rem;
}
.campaign-page__section-body {
  padding: 0;
}
.campaign-page__section-text {
  color: #000000;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.07rem;
}
.campaign-page__foot {
  padding: 0 2.85rem 3rem;
}

/* ------------------------------
- base
------------------------------ */
.faq-page {
  background: #ffffff url("/ad/lisg/sem/bst-general-rally/loop-main01/assets/img/common/background-dark.png") center center/cover no-repeat;
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.faq-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2.1rem;
  padding: 1.6rem 2.85rem 1.5rem;
}
.faq-page__qa-wrapper {
  flex: 1;
  background: #ffffff;
  border: 0.2rem solid #C8C8C8;
  position: relative;
}
.faq-page__qa-container {
  padding: 0 1.5rem;
  margin-right: 1rem;
  overflow-y: auto;
  position: absolute;
  top: 1.5rem;
  left: 0;
  right: 0;
  bottom: 1.5rem;
}
.faq-page__qa-item + .faq-page__qa-item {
  margin-top: 2rem;
}
.faq-page__question {
  display: flex;
  gap: 1.2rem;
  align-items: center;
  margin-bottom: 0.5rem;
}
.faq-page__q-mark {
  color: #333333;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.08rem;
  opacity: 0.3;
  flex-shrink: 0;
}
.faq-page__q-text {
  flex: 1;
  color: #333333;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.07rem;
}
.faq-page__answer {
  display: flex;
  gap: 1.2rem;
  align-items: flex-start;
}
.faq-page__a-mark {
  color: #b28f28;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.08rem;
  flex-shrink: 0;
  width: 1.25rem;
}
.faq-page__a-text {
  flex: 1;
  color: #b28f28;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.065rem;
}
.faq-page__a-text p:last-child {
  margin-bottom: 0;
}
.faq-page__footnote {
  font-size: 1rem;
}
.faq-page__note {
  color: #333333;
  font-size: 0.9rem;
  letter-spacing: 0.04rem;
  margin-top: 0.5rem;
}
.faq-page__foot {
  padding: 0 2.85rem 3rem;
}

/* ------------------------------
- base
------------------------------ */
.shuccho-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.shuccho-page__body {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 2.8rem;
}
.shuccho-page__title {
  display: flex;
  flex-direction: column;
  font-weight: 700;
  line-height: 1.3;
  color: #b28f28;
  text-align: center;
  margin-bottom: 1.5rem;
  font-size: 1.6rem;
}
.shuccho-page__title span {
  margin: 0;
}
.shuccho-page__title__lg {
  font-size: 2rem;
  margin: 0;
}
.shuccho-page__disclaimer {
  margin-top: 1rem;
}
.shuccho-page__disclaimer p {
  color: #333333;
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.04rem;
  margin: 0;
}
.shuccho-page__foot {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 0 2.85rem 3rem;
}
.shuccho-page__foot .action-btn {
  margin-bottom: 0;
}

/* ------------------------------
- base
------------------------------ */
.shuccho-detail-page {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  width: 100%;
}
.shuccho-detail-page__body {
  flex: 1;
  display: flex;
  padding: 2rem 2.85rem 2rem;
}
.shuccho-detail-page__body__inner {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.shuccho-detail-page__title {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  color: #b28f28;
  text-align: center;
  margin-bottom: 1.5rem;
}
.shuccho-detail-page__title p {
  margin: 0;
}
.shuccho-detail-page__schedule {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.shuccho-detail-page__schedule-header {
  background: #2f8257;
  padding: 1rem;
  border-radius: 0.4rem 0.4rem 0 0;
  text-align: center;
}
.shuccho-detail-page__schedule-header p {
  color: #ffffff;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}
.shuccho-detail-page__schedule-body__wrapper {
  flex: 1;
  position: relative;
  padding: 1.6rem;
}
.shuccho-detail-page__schedule-body {
  background: #ffffff;
  border: 2px solid #2f8257;
  border-top: none;
  border-radius: 0 0 0.4rem 0.4rem;
  padding: 0 1.6rem;
  gap: 1.6rem;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  overflow: auto;
}
.shuccho-detail-page__timeline-group {
  border-top: 1px solid #bbb;
  border-bottom: 1px solid #bbb;
  position: relative;
}
.shuccho-detail-page__timeline-group__img {
  position: absolute;
  top: 1.6rem;
  bottom: 1.6rem;
  right: 0.2rem;
}
.shuccho-detail-page__timeline-group__img img {
  height: 100%;
  width: auto;
}
.shuccho-detail-page__timeline-item {
  padding: 1.6rem 0;
}
.shuccho-detail-page__timeline-item + .shuccho-detail-page__timeline-item {
  border-top: 1px solid #bbb;
}
.shuccho-detail-page__timeline-item--highlighted {
  background: #f2f3ee;
  padding-right: 4.5rem;
}
.shuccho-detail-page__time-header {
  display: flex;
  gap: 1.5rem;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 0.5rem;
}
.shuccho-detail-page__time {
  color: #333333;
}
.shuccho-detail-page__time--green {
  color: #2f8257;
}
.shuccho-detail-page__action {
  color: #333333;
}
.shuccho-detail-page__action--green {
  color: #2f8257;
}
.shuccho-detail-page__description {
  color: #333333;
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 1.3;
  margin: 0;
}
.shuccho-detail-page__average-time {
  background: #2f8257;
  border: 2px solid #2f8257;
  padding: 0.75rem 0;
}
.shuccho-detail-page__average-time p {
  color: #ffffff;
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 1.3;
  margin: 0;
}
.shuccho-detail-page__foot {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0 2.85rem 3rem;
}

/* ------------------------------
- base
------------------------------ */
.delivery-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.delivery-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2.2rem;
  padding: 1.5rem 2.85rem 0;
}
.delivery-page__title {
  display: flex;
  flex-direction: column;
  font-weight: 700;
  line-height: 1.3;
  color: #b28f28;
}
.delivery-page__title p {
  font-size: 1.6rem;
  margin: 0;
}
.delivery-page__title h2 {
  font-size: 2rem;
  margin: 0;
}
.delivery-page__disclaimer p {
  color: #333333;
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04rem;
  margin: 0;
}
.delivery-page__foot {
  padding: 0 2.85rem 1.5rem;
}

/* ------------------------------
- base
------------------------------ */
.delivery-detail-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.delivery-detail-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: 1rem 2.85rem 0;
}
.delivery-detail-page__title h2 {
  color: #b28f28;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}
.delivery-detail-page__description p {
  color: #333333;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.07rem;
  margin: 0;
}
.delivery-detail-page__image {
  text-align: center;
  margin-top: 1.5rem;
}
.delivery-detail-page__disclaimer p {
  color: #333333;
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04rem;
  margin: 0;
}
.delivery-detail-page__foot {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 0 2.85rem 1.5rem;
}

/* ------------------------------
- base
------------------------------ */
.shop-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.shop-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2.15rem;
  padding: 2.8rem 2.85rem 0;
}
.shop-page__title {
  display: flex;
  flex-direction: column;
  font-weight: 700;
  line-height: 1.3;
  color: #b28f28;
}
.shop-page__title p {
  font-size: 1.6rem;
  margin: 0;
}
.shop-page__title h2 {
  font-size: 2rem;
  margin: 0;
}
.shop-page__disclaimer p {
  color: #333333;
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04rem;
  margin: 0;
}
.shop-page__foot {
  padding: 0 2.85rem 2.85rem;
}

/* ------------------------------
- base
------------------------------ */
.shop-detail-page {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  width: 100%;
  gap: 2rem;
}
.shop-detail-page__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem 2.85rem 0;
}
.shop-detail-page__title h1 {
  color: #b28f28;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
  text-align: center;
}
.shop-detail-page__list__wrapper {
  flex: 1;
  background: #fff;
  border: 0.2rem solid #2f8257;
  position: relative;
}
.shop-detail-page__list__container {
  position: absolute;
  top: 1rem;
  bottom: 1rem;
  left: 0;
  right: 0;
  overflow: auto;
  padding: 0 1rem;
}
.shop-detail-page__list {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  overflow-y: auto;
}
.shop-detail-page__region {
  display: flex;
  flex-direction: column;
}
.shop-detail-page__region-header {
  background: #2f8257;
  border: 1px solid #cecece;
  padding: 1.2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
}
.shop-detail-page__region-header span {
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
}
.shop-detail-page__region-header::after {
  content: "\e916";
  font-family: "icomoon" !important;
  color: #ffffff;
  font-size: 1.3rem;
}
.shop-detail-page__region--expanded .shop-detail-page__region-header::after {
  content: "\e913";
}
.shop-detail-page__region:not(.shop-detail-page__region--expanded) .shop-detail-page__region-content {
  display: none;
}
.shop-detail-page__region:not(.shop-detail-page__region--expanded) .shop-detail-page__region-header::after {
  content: "\e916";
}
.shop-detail-page__subregion {
  display: flex;
  flex-direction: column;
}
.shop-detail-page__subregion-header {
  background: #f2f3ee;
  border: 1px solid #cecece;
  border-top: none;
  padding: 1.2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
}
.shop-detail-page__subregion-header span {
  color: #2f8257;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1.3;
}
.shop-detail-page__subregion-header::after {
  content: "\e916";
  font-family: "icomoon" !important;
  color: #2f8257;
  font-size: 1.3rem;
}
.shop-detail-page__subregion--expanded .shop-detail-page__subregion-header::after {
  content: "\e913";
}
.shop-detail-page__subregion--expanded .shop-detail-page__subregion-header::after {
  content: "\e913";
}
.shop-detail-page__subregion:not(.shop-detail-page__subregion--expanded) .shop-detail-page__subregion-content {
  display: none;
}
.shop-detail-page__subregion:not(.shop-detail-page__subregion--expanded) .shop-detail-page__subregion-header::after {
  content: "\e916";
}
.shop-detail-page__store {
  background: #ffffff;
  border: 1px solid #cecece;
  border-top: none;
  padding: 1.2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.shop-detail-page__store-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.shop-detail-page__store-name {
  color: #333333;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}
.shop-detail-page__store-details {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.shop-detail-page__store-details p {
  color: #6f6f6f;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.3;
  margin: 0;
}
.shop-detail-page__store-arrow {
  width: 0.4rem;
  height: 0.8rem;
  flex-shrink: 0;
}
.shop-detail-page__foot {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 0 2.85rem 2.85rem;
}

iframe {
  aspect-ratio: 474/688;
  width: 100%;
  max-width: 474px !important;
  overflow: hidden;
}
.add-ajustContentHeight iframe {
  overflow: auto;
}

@media screen and (max-width: 749px) {
  body {
    overflow: hidden;
  }
}
.add-ajustContentHeight body {
  overflow: auto;
}
@media only screen and (orientation: landscape) {
  body {
    max-width: 100%;
    overflow-x: hidden;
  }
}

.sample {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 3rem;
  padding: 3rem;
  color: #fff;
  font-size: 2rem;
}
.sample.-color1 {
  background: #a1c181;
}
.sample.-color2 {
  background: #e9c46a;
}
.sample.-color3 {
  background: #e76f51;
}
.sample.-color4 {
  background: #fb6f92;
}

.screen__inner {
  position: relative;
  height: 100%;
}