@charset "UTF-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css");
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css");
.template-post-740-60-370 {
  display: flex;
  justify-content: center;
  column-gap: 60px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-740-60-370 .main-image {
  width: 740px;
}
.template-post-740-60-370 .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-740-60-370 .main-video {
  width: 740px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-740-60-370 .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-740-60-370 .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-740-60-370 .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-740-60-370 .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-740-60-370 .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-740-60-370 .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-740-60-370 .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-740-60-370 .main-video video {
  display: block;
}
.template-post-740-60-370 .main-video img {
  display: block;
  width: 100%;
}
.template-post-740-60-370 .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-740-60-370 .writing.row {
  display: flex;
}
.template-post-740-60-370 .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-740-60-370 .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-740-60-370 .writing .beginner, .template-post-740-60-370 .writing .intermediate, .template-post-740-60-370 .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-740-60-370 .writing .beginner {
  color: #1199af;
}
.template-post-740-60-370 .writing .intermediate {
  color: #83ae00;
}
.template-post-740-60-370 .writing .advanced {
  color: #962bd7;
}
.template-post-740-60-370 .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-740-60-370 .writing .title.en {
  word-break: break-word;
}
.template-post-740-60-370 .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-740-60-370 .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-740-60-370 .writing .description.en {
  word-break: break-word;
}
.template-post-740-60-370 .writing .description.ja {
  word-break: inherit;
}
.template-post-740-60-370 .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-740-60-370.mpti .writing {
  width: 470px;
}
.template-post-740-60-370.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-740-60-370 {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-740-60-370 .main-image {
    width: 100%;
  }
  .template-post-740-60-370 .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-740-60-370 .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-740-60-370 .main-video.with-image {
    gap: 19px;
  }
  .template-post-740-60-370 .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-740-60-370 .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-740-60-370 .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-740-60-370 .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-740-60-370 .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-740-60-370 .writing.row {
    display: block;
  }
  .template-post-740-60-370 .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-740-60-370 .writing .beginner, .template-post-740-60-370 .writing .intermediate, .template-post-740-60-370 .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-740-60-370 .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-740-60-370 .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-740-60-370 .writing.rolling .title {
    text-align: center;
  }
  .template-post-740-60-370 .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-740-60-370 .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-740-60-370.mpti .writing {
    width: 335px;
  }
  .template-post-740-60-370.mpti .main-video {
    width: 335px;
  }
}
.template-post-740-60-370 .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-770-130-270 {
  display: flex;
  justify-content: center;
  column-gap: 130px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-770-130-270 .main-image {
  width: 770px;
}
.template-post-770-130-270 .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-770-130-270 .main-video {
  width: 770px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-770-130-270 .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-770-130-270 .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-770-130-270 .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-770-130-270 .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-770-130-270 .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-770-130-270 .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-770-130-270 .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-770-130-270 .main-video video {
  display: block;
}
.template-post-770-130-270 .main-video img {
  display: block;
  width: 100%;
}
.template-post-770-130-270 .writing {
  width: 270px;
  margin-top: 20px;
}
.template-post-770-130-270 .writing.row {
  display: flex;
}
.template-post-770-130-270 .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-770-130-270 .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-770-130-270 .writing .beginner, .template-post-770-130-270 .writing .intermediate, .template-post-770-130-270 .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-770-130-270 .writing .beginner {
  color: #1199af;
}
.template-post-770-130-270 .writing .intermediate {
  color: #83ae00;
}
.template-post-770-130-270 .writing .advanced {
  color: #962bd7;
}
.template-post-770-130-270 .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-770-130-270 .writing .title.en {
  word-break: break-word;
}
.template-post-770-130-270 .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-770-130-270 .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-770-130-270 .writing .description.en {
  word-break: break-word;
}
.template-post-770-130-270 .writing .description.ja {
  word-break: inherit;
}
.template-post-770-130-270 .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-770-130-270.mpti .writing {
  width: 470px;
}
.template-post-770-130-270.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-770-130-270 {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-770-130-270 .main-image {
    width: 100%;
  }
  .template-post-770-130-270 .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-770-130-270 .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-770-130-270 .main-video.with-image {
    gap: 19px;
  }
  .template-post-770-130-270 .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-770-130-270 .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-770-130-270 .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-770-130-270 .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-770-130-270 .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-770-130-270 .writing.row {
    display: block;
  }
  .template-post-770-130-270 .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-770-130-270 .writing .beginner, .template-post-770-130-270 .writing .intermediate, .template-post-770-130-270 .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-770-130-270 .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-770-130-270 .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-770-130-270 .writing.rolling .title {
    text-align: center;
  }
  .template-post-770-130-270 .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-770-130-270 .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-770-130-270.mpti .writing {
    width: 335px;
  }
  .template-post-770-130-270.mpti .main-video {
    width: 335px;
  }
}
.template-post-770-130-270 .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-770-100-270 {
  display: flex;
  justify-content: center;
  column-gap: 100px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-770-100-270 .main-image {
  width: 770px;
}
.template-post-770-100-270 .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-770-100-270 .main-video {
  width: 770px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-770-100-270 .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-770-100-270 .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-770-100-270 .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-770-100-270 .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-770-100-270 .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-770-100-270 .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-770-100-270 .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-770-100-270 .main-video video {
  display: block;
}
.template-post-770-100-270 .main-video img {
  display: block;
  width: 100%;
}
.template-post-770-100-270 .writing {
  width: 270px;
  margin-top: 20px;
}
.template-post-770-100-270 .writing.row {
  display: flex;
}
.template-post-770-100-270 .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-770-100-270 .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-770-100-270 .writing .beginner, .template-post-770-100-270 .writing .intermediate, .template-post-770-100-270 .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-770-100-270 .writing .beginner {
  color: #1199af;
}
.template-post-770-100-270 .writing .intermediate {
  color: #83ae00;
}
.template-post-770-100-270 .writing .advanced {
  color: #962bd7;
}
.template-post-770-100-270 .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-770-100-270 .writing .title.en {
  word-break: break-word;
}
.template-post-770-100-270 .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-770-100-270 .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-770-100-270 .writing .description.en {
  word-break: break-word;
}
.template-post-770-100-270 .writing .description.ja {
  word-break: inherit;
}
.template-post-770-100-270 .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-770-100-270.mpti .writing {
  width: 470px;
}
.template-post-770-100-270.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-770-100-270 {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-770-100-270 .main-image {
    width: 100%;
  }
  .template-post-770-100-270 .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-770-100-270 .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-770-100-270 .main-video.with-image {
    gap: 19px;
  }
  .template-post-770-100-270 .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-770-100-270 .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-770-100-270 .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-770-100-270 .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-770-100-270 .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-770-100-270 .writing.row {
    display: block;
  }
  .template-post-770-100-270 .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-770-100-270 .writing .beginner, .template-post-770-100-270 .writing .intermediate, .template-post-770-100-270 .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-770-100-270 .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-770-100-270 .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-770-100-270 .writing.rolling .title {
    text-align: center;
  }
  .template-post-770-100-270 .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-770-100-270 .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-770-100-270.mpti .writing {
    width: 335px;
  }
  .template-post-770-100-270.mpti .main-video {
    width: 335px;
  }
}
.template-post-770-100-270 .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-480-126-370 {
  display: flex;
  justify-content: center;
  column-gap: 126px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-480-126-370 .main-image {
  width: 480px;
}
.template-post-480-126-370 .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-480-126-370 .main-video {
  width: 480px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-480-126-370 .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-480-126-370 .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-480-126-370 .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-480-126-370 .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-480-126-370 .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-480-126-370 .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-480-126-370 .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-480-126-370 .main-video video {
  display: block;
}
.template-post-480-126-370 .main-video img {
  display: block;
  width: 100%;
}
.template-post-480-126-370 .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-480-126-370 .writing.row {
  display: flex;
}
.template-post-480-126-370 .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-480-126-370 .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-480-126-370 .writing .beginner, .template-post-480-126-370 .writing .intermediate, .template-post-480-126-370 .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-480-126-370 .writing .beginner {
  color: #1199af;
}
.template-post-480-126-370 .writing .intermediate {
  color: #83ae00;
}
.template-post-480-126-370 .writing .advanced {
  color: #962bd7;
}
.template-post-480-126-370 .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-480-126-370 .writing .title.en {
  word-break: break-word;
}
.template-post-480-126-370 .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-480-126-370 .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-480-126-370 .writing .description.en {
  word-break: break-word;
}
.template-post-480-126-370 .writing .description.ja {
  word-break: inherit;
}
.template-post-480-126-370 .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-480-126-370.mpti .writing {
  width: 470px;
}
.template-post-480-126-370.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-480-126-370 {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-480-126-370 .main-image {
    width: 100%;
  }
  .template-post-480-126-370 .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-480-126-370 .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-480-126-370 .main-video.with-image {
    gap: 19px;
  }
  .template-post-480-126-370 .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-480-126-370 .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-480-126-370 .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-480-126-370 .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-480-126-370 .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-480-126-370 .writing.row {
    display: block;
  }
  .template-post-480-126-370 .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-480-126-370 .writing .beginner, .template-post-480-126-370 .writing .intermediate, .template-post-480-126-370 .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-480-126-370 .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-480-126-370 .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-480-126-370 .writing.rolling .title {
    text-align: center;
  }
  .template-post-480-126-370 .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-480-126-370 .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-480-126-370.mpti .writing {
    width: 335px;
  }
  .template-post-480-126-370.mpti .main-video {
    width: 335px;
  }
}
.template-post-480-126-370 .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-715-95-370 {
  display: flex;
  justify-content: center;
  column-gap: 95px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-715-95-370 .main-image {
  width: 715px;
}
.template-post-715-95-370 .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-715-95-370 .main-video {
  width: 715px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-715-95-370 .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-715-95-370 .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-715-95-370 .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-715-95-370 .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-715-95-370 .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-715-95-370 .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-715-95-370 .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-715-95-370 .main-video video {
  display: block;
}
.template-post-715-95-370 .main-video img {
  display: block;
  width: 100%;
}
.template-post-715-95-370 .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-715-95-370 .writing.row {
  display: flex;
}
.template-post-715-95-370 .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-715-95-370 .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-715-95-370 .writing .beginner, .template-post-715-95-370 .writing .intermediate, .template-post-715-95-370 .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-715-95-370 .writing .beginner {
  color: #1199af;
}
.template-post-715-95-370 .writing .intermediate {
  color: #83ae00;
}
.template-post-715-95-370 .writing .advanced {
  color: #962bd7;
}
.template-post-715-95-370 .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-715-95-370 .writing .title.en {
  word-break: break-word;
}
.template-post-715-95-370 .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-715-95-370 .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-715-95-370 .writing .description.en {
  word-break: break-word;
}
.template-post-715-95-370 .writing .description.ja {
  word-break: inherit;
}
.template-post-715-95-370 .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-715-95-370.mpti .writing {
  width: 470px;
}
.template-post-715-95-370.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-715-95-370 {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-715-95-370 .main-image {
    width: 100%;
  }
  .template-post-715-95-370 .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-715-95-370 .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-715-95-370 .main-video.with-image {
    gap: 19px;
  }
  .template-post-715-95-370 .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-715-95-370 .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-715-95-370 .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-715-95-370 .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-715-95-370 .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-715-95-370 .writing.row {
    display: block;
  }
  .template-post-715-95-370 .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-715-95-370 .writing .beginner, .template-post-715-95-370 .writing .intermediate, .template-post-715-95-370 .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-715-95-370 .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-715-95-370 .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-715-95-370 .writing.rolling .title {
    text-align: center;
  }
  .template-post-715-95-370 .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-715-95-370 .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-715-95-370.mpti .writing {
    width: 335px;
  }
  .template-post-715-95-370.mpti .main-video {
    width: 335px;
  }
}
.template-post-715-95-370 .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-774-28-370 {
  display: flex;
  justify-content: center;
  column-gap: 28px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-774-28-370 .main-image {
  width: 774px;
}
.template-post-774-28-370 .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-774-28-370 .main-video {
  width: 774px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-774-28-370 .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-774-28-370 .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-774-28-370 .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-774-28-370 .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-774-28-370 .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-774-28-370 .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-774-28-370 .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-774-28-370 .main-video video {
  display: block;
}
.template-post-774-28-370 .main-video img {
  display: block;
  width: 100%;
}
.template-post-774-28-370 .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-774-28-370 .writing.row {
  display: flex;
}
.template-post-774-28-370 .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-774-28-370 .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-774-28-370 .writing .beginner, .template-post-774-28-370 .writing .intermediate, .template-post-774-28-370 .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-774-28-370 .writing .beginner {
  color: #1199af;
}
.template-post-774-28-370 .writing .intermediate {
  color: #83ae00;
}
.template-post-774-28-370 .writing .advanced {
  color: #962bd7;
}
.template-post-774-28-370 .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-774-28-370 .writing .title.en {
  word-break: break-word;
}
.template-post-774-28-370 .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-774-28-370 .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-774-28-370 .writing .description.en {
  word-break: break-word;
}
.template-post-774-28-370 .writing .description.ja {
  word-break: inherit;
}
.template-post-774-28-370 .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-774-28-370.mpti .writing {
  width: 470px;
}
.template-post-774-28-370.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-774-28-370 {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-774-28-370 .main-image {
    width: 100%;
  }
  .template-post-774-28-370 .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-774-28-370 .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-774-28-370 .main-video.with-image {
    gap: 19px;
  }
  .template-post-774-28-370 .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-774-28-370 .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-774-28-370 .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-774-28-370 .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-774-28-370 .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-774-28-370 .writing.row {
    display: block;
  }
  .template-post-774-28-370 .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-774-28-370 .writing .beginner, .template-post-774-28-370 .writing .intermediate, .template-post-774-28-370 .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-774-28-370 .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-774-28-370 .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-774-28-370 .writing.rolling .title {
    text-align: center;
  }
  .template-post-774-28-370 .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-774-28-370 .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-774-28-370.mpti .writing {
    width: 335px;
  }
  .template-post-774-28-370.mpti .main-video {
    width: 335px;
  }
}
.template-post-774-28-370 .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-575-55-400 {
  display: flex;
  justify-content: center;
  column-gap: 55px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-575-55-400 .main-image {
  width: 575px;
}
.template-post-575-55-400 .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-575-55-400 .main-video {
  width: 575px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-575-55-400 .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-575-55-400 .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-575-55-400 .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-575-55-400 .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-575-55-400 .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-575-55-400 .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-575-55-400 .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-575-55-400 .main-video video {
  display: block;
}
.template-post-575-55-400 .main-video img {
  display: block;
  width: 100%;
}
.template-post-575-55-400 .writing {
  width: 400px;
  margin-top: 20px;
}
.template-post-575-55-400 .writing.row {
  display: flex;
}
.template-post-575-55-400 .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-575-55-400 .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-575-55-400 .writing .beginner, .template-post-575-55-400 .writing .intermediate, .template-post-575-55-400 .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-575-55-400 .writing .beginner {
  color: #1199af;
}
.template-post-575-55-400 .writing .intermediate {
  color: #83ae00;
}
.template-post-575-55-400 .writing .advanced {
  color: #962bd7;
}
.template-post-575-55-400 .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-575-55-400 .writing .title.en {
  word-break: break-word;
}
.template-post-575-55-400 .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-575-55-400 .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-575-55-400 .writing .description.en {
  word-break: break-word;
}
.template-post-575-55-400 .writing .description.ja {
  word-break: inherit;
}
.template-post-575-55-400 .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-575-55-400.mpti .writing {
  width: 470px;
}
.template-post-575-55-400.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-575-55-400 {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-575-55-400 .main-image {
    width: 100%;
  }
  .template-post-575-55-400 .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-575-55-400 .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-575-55-400 .main-video.with-image {
    gap: 19px;
  }
  .template-post-575-55-400 .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-575-55-400 .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-575-55-400 .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-575-55-400 .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-575-55-400 .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-575-55-400 .writing.row {
    display: block;
  }
  .template-post-575-55-400 .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-575-55-400 .writing .beginner, .template-post-575-55-400 .writing .intermediate, .template-post-575-55-400 .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-575-55-400 .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-575-55-400 .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-575-55-400 .writing.rolling .title {
    text-align: center;
  }
  .template-post-575-55-400 .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-575-55-400 .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-575-55-400.mpti .writing {
    width: 335px;
  }
  .template-post-575-55-400.mpti .main-video {
    width: 335px;
  }
}
.template-post-575-55-400 .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-390-20-370-start {
  display: flex;
  justify-content: start;
  column-gap: 20px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-390-20-370-start .main-image {
  width: 390px;
}
.template-post-390-20-370-start .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-390-20-370-start .main-video {
  width: 390px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-390-20-370-start .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-390-20-370-start .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-390-20-370-start .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-390-20-370-start .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-390-20-370-start .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-390-20-370-start .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-390-20-370-start .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-390-20-370-start .main-video video {
  display: block;
}
.template-post-390-20-370-start .main-video img {
  display: block;
  width: 100%;
}
.template-post-390-20-370-start .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-390-20-370-start .writing.row {
  display: flex;
}
.template-post-390-20-370-start .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-390-20-370-start .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-390-20-370-start .writing .beginner, .template-post-390-20-370-start .writing .intermediate, .template-post-390-20-370-start .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-390-20-370-start .writing .beginner {
  color: #1199af;
}
.template-post-390-20-370-start .writing .intermediate {
  color: #83ae00;
}
.template-post-390-20-370-start .writing .advanced {
  color: #962bd7;
}
.template-post-390-20-370-start .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-390-20-370-start .writing .title.en {
  word-break: break-word;
}
.template-post-390-20-370-start .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-390-20-370-start .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-390-20-370-start .writing .description.en {
  word-break: break-word;
}
.template-post-390-20-370-start .writing .description.ja {
  word-break: inherit;
}
.template-post-390-20-370-start .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-390-20-370-start.mpti .writing {
  width: 470px;
}
.template-post-390-20-370-start.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-390-20-370-start {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-390-20-370-start .main-image {
    width: 100%;
  }
  .template-post-390-20-370-start .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-390-20-370-start .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-390-20-370-start .main-video.with-image {
    gap: 19px;
  }
  .template-post-390-20-370-start .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-390-20-370-start .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-390-20-370-start .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-390-20-370-start .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-390-20-370-start .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-390-20-370-start .writing.row {
    display: block;
  }
  .template-post-390-20-370-start .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-390-20-370-start .writing .beginner, .template-post-390-20-370-start .writing .intermediate, .template-post-390-20-370-start .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-390-20-370-start .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-390-20-370-start .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-390-20-370-start .writing.rolling .title {
    text-align: center;
  }
  .template-post-390-20-370-start .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-390-20-370-start .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-390-20-370-start.mpti .writing {
    width: 335px;
  }
  .template-post-390-20-370-start.mpti .main-video {
    width: 335px;
  }
}
.template-post-390-20-370-start .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-728-20-370-start {
  display: flex;
  justify-content: start;
  column-gap: 20px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-728-20-370-start .main-image {
  width: 728px;
}
.template-post-728-20-370-start .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-728-20-370-start .main-video {
  width: 728px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-728-20-370-start .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-728-20-370-start .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-728-20-370-start .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-728-20-370-start .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-728-20-370-start .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-728-20-370-start .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-728-20-370-start .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-728-20-370-start .main-video video {
  display: block;
}
.template-post-728-20-370-start .main-video img {
  display: block;
  width: 100%;
}
.template-post-728-20-370-start .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-728-20-370-start .writing.row {
  display: flex;
}
.template-post-728-20-370-start .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-728-20-370-start .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-728-20-370-start .writing .beginner, .template-post-728-20-370-start .writing .intermediate, .template-post-728-20-370-start .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-728-20-370-start .writing .beginner {
  color: #1199af;
}
.template-post-728-20-370-start .writing .intermediate {
  color: #83ae00;
}
.template-post-728-20-370-start .writing .advanced {
  color: #962bd7;
}
.template-post-728-20-370-start .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-728-20-370-start .writing .title.en {
  word-break: break-word;
}
.template-post-728-20-370-start .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-728-20-370-start .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-728-20-370-start .writing .description.en {
  word-break: break-word;
}
.template-post-728-20-370-start .writing .description.ja {
  word-break: inherit;
}
.template-post-728-20-370-start .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-728-20-370-start.mpti .writing {
  width: 470px;
}
.template-post-728-20-370-start.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-728-20-370-start {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-728-20-370-start .main-image {
    width: 100%;
  }
  .template-post-728-20-370-start .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-728-20-370-start .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-728-20-370-start .main-video.with-image {
    gap: 19px;
  }
  .template-post-728-20-370-start .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-728-20-370-start .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-728-20-370-start .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-728-20-370-start .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-728-20-370-start .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-728-20-370-start .writing.row {
    display: block;
  }
  .template-post-728-20-370-start .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-728-20-370-start .writing .beginner, .template-post-728-20-370-start .writing .intermediate, .template-post-728-20-370-start .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-728-20-370-start .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-728-20-370-start .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-728-20-370-start .writing.rolling .title {
    text-align: center;
  }
  .template-post-728-20-370-start .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-728-20-370-start .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-728-20-370-start.mpti .writing {
    width: 335px;
  }
  .template-post-728-20-370-start.mpti .main-video {
    width: 335px;
  }
}
.template-post-728-20-370-start .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-793-20-370-start {
  display: flex;
  justify-content: start;
  column-gap: 20px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-793-20-370-start .main-image {
  width: 793px;
}
.template-post-793-20-370-start .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-793-20-370-start .main-video {
  width: 793px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-793-20-370-start .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-793-20-370-start .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-793-20-370-start .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-793-20-370-start .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-793-20-370-start .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-793-20-370-start .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-793-20-370-start .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-793-20-370-start .main-video video {
  display: block;
}
.template-post-793-20-370-start .main-video img {
  display: block;
  width: 100%;
}
.template-post-793-20-370-start .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-793-20-370-start .writing.row {
  display: flex;
}
.template-post-793-20-370-start .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-793-20-370-start .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-793-20-370-start .writing .beginner, .template-post-793-20-370-start .writing .intermediate, .template-post-793-20-370-start .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-793-20-370-start .writing .beginner {
  color: #1199af;
}
.template-post-793-20-370-start .writing .intermediate {
  color: #83ae00;
}
.template-post-793-20-370-start .writing .advanced {
  color: #962bd7;
}
.template-post-793-20-370-start .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-793-20-370-start .writing .title.en {
  word-break: break-word;
}
.template-post-793-20-370-start .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-793-20-370-start .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-793-20-370-start .writing .description.en {
  word-break: break-word;
}
.template-post-793-20-370-start .writing .description.ja {
  word-break: inherit;
}
.template-post-793-20-370-start .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-793-20-370-start.mpti .writing {
  width: 470px;
}
.template-post-793-20-370-start.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-793-20-370-start {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-793-20-370-start .main-image {
    width: 100%;
  }
  .template-post-793-20-370-start .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-793-20-370-start .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-793-20-370-start .main-video.with-image {
    gap: 19px;
  }
  .template-post-793-20-370-start .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-793-20-370-start .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-793-20-370-start .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-793-20-370-start .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-793-20-370-start .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-793-20-370-start .writing.row {
    display: block;
  }
  .template-post-793-20-370-start .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-793-20-370-start .writing .beginner, .template-post-793-20-370-start .writing .intermediate, .template-post-793-20-370-start .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-793-20-370-start .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-793-20-370-start .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-793-20-370-start .writing.rolling .title {
    text-align: center;
  }
  .template-post-793-20-370-start .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-793-20-370-start .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-793-20-370-start.mpti .writing {
    width: 335px;
  }
  .template-post-793-20-370-start.mpti .main-video {
    width: 335px;
  }
}
.template-post-793-20-370-start .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-511-20-370-start {
  display: flex;
  justify-content: start;
  column-gap: 20px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-511-20-370-start .main-image {
  width: 511px;
}
.template-post-511-20-370-start .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-511-20-370-start .main-video {
  width: 511px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-511-20-370-start .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-511-20-370-start .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-511-20-370-start .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-511-20-370-start .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-511-20-370-start .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-511-20-370-start .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-511-20-370-start .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-511-20-370-start .main-video video {
  display: block;
}
.template-post-511-20-370-start .main-video img {
  display: block;
  width: 100%;
}
.template-post-511-20-370-start .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-511-20-370-start .writing.row {
  display: flex;
}
.template-post-511-20-370-start .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-511-20-370-start .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-511-20-370-start .writing .beginner, .template-post-511-20-370-start .writing .intermediate, .template-post-511-20-370-start .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-511-20-370-start .writing .beginner {
  color: #1199af;
}
.template-post-511-20-370-start .writing .intermediate {
  color: #83ae00;
}
.template-post-511-20-370-start .writing .advanced {
  color: #962bd7;
}
.template-post-511-20-370-start .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-511-20-370-start .writing .title.en {
  word-break: break-word;
}
.template-post-511-20-370-start .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-511-20-370-start .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-511-20-370-start .writing .description.en {
  word-break: break-word;
}
.template-post-511-20-370-start .writing .description.ja {
  word-break: inherit;
}
.template-post-511-20-370-start .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-511-20-370-start.mpti .writing {
  width: 470px;
}
.template-post-511-20-370-start.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-511-20-370-start {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-511-20-370-start .main-image {
    width: 100%;
  }
  .template-post-511-20-370-start .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-511-20-370-start .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-511-20-370-start .main-video.with-image {
    gap: 19px;
  }
  .template-post-511-20-370-start .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-511-20-370-start .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-511-20-370-start .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-511-20-370-start .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-511-20-370-start .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-511-20-370-start .writing.row {
    display: block;
  }
  .template-post-511-20-370-start .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-511-20-370-start .writing .beginner, .template-post-511-20-370-start .writing .intermediate, .template-post-511-20-370-start .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-511-20-370-start .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-511-20-370-start .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-511-20-370-start .writing.rolling .title {
    text-align: center;
  }
  .template-post-511-20-370-start .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-511-20-370-start .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-511-20-370-start.mpti .writing {
    width: 335px;
  }
  .template-post-511-20-370-start.mpti .main-video {
    width: 335px;
  }
}
.template-post-511-20-370-start .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-774-28-370-start {
  display: flex;
  justify-content: start;
  column-gap: 28px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-774-28-370-start .main-image {
  width: 774px;
}
.template-post-774-28-370-start .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-774-28-370-start .main-video {
  width: 774px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-774-28-370-start .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-774-28-370-start .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-774-28-370-start .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-774-28-370-start .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-774-28-370-start .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-774-28-370-start .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-774-28-370-start .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-774-28-370-start .main-video video {
  display: block;
}
.template-post-774-28-370-start .main-video img {
  display: block;
  width: 100%;
}
.template-post-774-28-370-start .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-774-28-370-start .writing.row {
  display: flex;
}
.template-post-774-28-370-start .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-774-28-370-start .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-774-28-370-start .writing .beginner, .template-post-774-28-370-start .writing .intermediate, .template-post-774-28-370-start .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-774-28-370-start .writing .beginner {
  color: #1199af;
}
.template-post-774-28-370-start .writing .intermediate {
  color: #83ae00;
}
.template-post-774-28-370-start .writing .advanced {
  color: #962bd7;
}
.template-post-774-28-370-start .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-774-28-370-start .writing .title.en {
  word-break: break-word;
}
.template-post-774-28-370-start .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-774-28-370-start .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-774-28-370-start .writing .description.en {
  word-break: break-word;
}
.template-post-774-28-370-start .writing .description.ja {
  word-break: inherit;
}
.template-post-774-28-370-start .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-774-28-370-start.mpti .writing {
  width: 470px;
}
.template-post-774-28-370-start.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-774-28-370-start {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-774-28-370-start .main-image {
    width: 100%;
  }
  .template-post-774-28-370-start .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-774-28-370-start .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-774-28-370-start .main-video.with-image {
    gap: 19px;
  }
  .template-post-774-28-370-start .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-774-28-370-start .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-774-28-370-start .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-774-28-370-start .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-774-28-370-start .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-774-28-370-start .writing.row {
    display: block;
  }
  .template-post-774-28-370-start .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-774-28-370-start .writing .beginner, .template-post-774-28-370-start .writing .intermediate, .template-post-774-28-370-start .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-774-28-370-start .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-774-28-370-start .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-774-28-370-start .writing.rolling .title {
    text-align: center;
  }
  .template-post-774-28-370-start .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-774-28-370-start .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-774-28-370-start.mpti .writing {
    width: 335px;
  }
  .template-post-774-28-370-start.mpti .main-video {
    width: 335px;
  }
}
.template-post-774-28-370-start .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-772-28-370-start {
  display: flex;
  justify-content: start;
  column-gap: 28px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-772-28-370-start .main-image {
  width: 772px;
}
.template-post-772-28-370-start .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-772-28-370-start .main-video {
  width: 772px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-772-28-370-start .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-772-28-370-start .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-772-28-370-start .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-772-28-370-start .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-772-28-370-start .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-772-28-370-start .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-772-28-370-start .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-772-28-370-start .main-video video {
  display: block;
}
.template-post-772-28-370-start .main-video img {
  display: block;
  width: 100%;
}
.template-post-772-28-370-start .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-772-28-370-start .writing.row {
  display: flex;
}
.template-post-772-28-370-start .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-772-28-370-start .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-772-28-370-start .writing .beginner, .template-post-772-28-370-start .writing .intermediate, .template-post-772-28-370-start .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-772-28-370-start .writing .beginner {
  color: #1199af;
}
.template-post-772-28-370-start .writing .intermediate {
  color: #83ae00;
}
.template-post-772-28-370-start .writing .advanced {
  color: #962bd7;
}
.template-post-772-28-370-start .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-772-28-370-start .writing .title.en {
  word-break: break-word;
}
.template-post-772-28-370-start .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-772-28-370-start .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-772-28-370-start .writing .description.en {
  word-break: break-word;
}
.template-post-772-28-370-start .writing .description.ja {
  word-break: inherit;
}
.template-post-772-28-370-start .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-772-28-370-start.mpti .writing {
  width: 470px;
}
.template-post-772-28-370-start.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-772-28-370-start {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-772-28-370-start .main-image {
    width: 100%;
  }
  .template-post-772-28-370-start .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-772-28-370-start .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-772-28-370-start .main-video.with-image {
    gap: 19px;
  }
  .template-post-772-28-370-start .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-772-28-370-start .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-772-28-370-start .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-772-28-370-start .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-772-28-370-start .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-772-28-370-start .writing.row {
    display: block;
  }
  .template-post-772-28-370-start .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-772-28-370-start .writing .beginner, .template-post-772-28-370-start .writing .intermediate, .template-post-772-28-370-start .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-772-28-370-start .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-772-28-370-start .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-772-28-370-start .writing.rolling .title {
    text-align: center;
  }
  .template-post-772-28-370-start .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-772-28-370-start .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-772-28-370-start.mpti .writing {
    width: 335px;
  }
  .template-post-772-28-370-start.mpti .main-video {
    width: 335px;
  }
}
.template-post-772-28-370-start .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-770-30-370-start {
  display: flex;
  justify-content: start;
  column-gap: 30px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-770-30-370-start .main-image {
  width: 770px;
}
.template-post-770-30-370-start .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-770-30-370-start .main-video {
  width: 770px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-770-30-370-start .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-770-30-370-start .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-770-30-370-start .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-770-30-370-start .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-770-30-370-start .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-770-30-370-start .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-770-30-370-start .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-770-30-370-start .main-video video {
  display: block;
}
.template-post-770-30-370-start .main-video img {
  display: block;
  width: 100%;
}
.template-post-770-30-370-start .writing {
  width: 370px;
  margin-top: 20px;
}
.template-post-770-30-370-start .writing.row {
  display: flex;
}
.template-post-770-30-370-start .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-770-30-370-start .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-770-30-370-start .writing .beginner, .template-post-770-30-370-start .writing .intermediate, .template-post-770-30-370-start .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-770-30-370-start .writing .beginner {
  color: #1199af;
}
.template-post-770-30-370-start .writing .intermediate {
  color: #83ae00;
}
.template-post-770-30-370-start .writing .advanced {
  color: #962bd7;
}
.template-post-770-30-370-start .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-770-30-370-start .writing .title.en {
  word-break: break-word;
}
.template-post-770-30-370-start .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-770-30-370-start .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-770-30-370-start .writing .description.en {
  word-break: break-word;
}
.template-post-770-30-370-start .writing .description.ja {
  word-break: inherit;
}
.template-post-770-30-370-start .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-770-30-370-start.mpti .writing {
  width: 470px;
}
.template-post-770-30-370-start.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-770-30-370-start {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-770-30-370-start .main-image {
    width: 100%;
  }
  .template-post-770-30-370-start .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-770-30-370-start .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-770-30-370-start .main-video.with-image {
    gap: 19px;
  }
  .template-post-770-30-370-start .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-770-30-370-start .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-770-30-370-start .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-770-30-370-start .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-770-30-370-start .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-770-30-370-start .writing.row {
    display: block;
  }
  .template-post-770-30-370-start .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-770-30-370-start .writing .beginner, .template-post-770-30-370-start .writing .intermediate, .template-post-770-30-370-start .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-770-30-370-start .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-770-30-370-start .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-770-30-370-start .writing.rolling .title {
    text-align: center;
  }
  .template-post-770-30-370-start .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-770-30-370-start .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-770-30-370-start.mpti .writing {
    width: 335px;
  }
  .template-post-770-30-370-start.mpti .main-video {
    width: 335px;
  }
}
.template-post-770-30-370-start .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-post-370-30-770-start {
  display: flex;
  justify-content: start;
  column-gap: 30px;
  align-items: flex-start;
  width: 1170px;
}
.template-post-370-30-770-start .main-image {
  width: 370px;
}
.template-post-370-30-770-start .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-370-30-770-start .main-video {
  width: 370px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-370-30-770-start .main-video.no-line {
  border: 0px;
  border-radius: 0px;
  box-shadow: none;
}
.template-post-370-30-770-start .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.template-post-370-30-770-start .main-video.with-image {
  display: flex;
  gap: 30px;
  border: none;
  box-shadow: none;
}
.template-post-370-30-770-start .main-video.with-image .main-image {
  width: 370px;
  height: 478px;
}
.template-post-370-30-770-start .main-video.with-image .main-image.on-border {
  border-radius: 20px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.template-post-370-30-770-start .main-video.with-image .main-image img {
  height: 100%;
}
.template-post-370-30-770-start .main-video.with-image video {
  width: 370px;
  height: 478px;
  border-radius: 20px;
  box-sizing: border-box;
  border: 6px solid #000;
}
.template-post-370-30-770-start .main-video video {
  display: block;
}
.template-post-370-30-770-start .main-video img {
  display: block;
  width: 100%;
}
.template-post-370-30-770-start .writing {
  width: 770px;
  margin-top: 20px;
}
.template-post-370-30-770-start .writing.row {
  display: flex;
}
.template-post-370-30-770-start .writing .sub {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-post-370-30-770-start .writing .sub .coming {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: -0.42px;
  color: #6d6d6d;
}
.template-post-370-30-770-start .writing .beginner, .template-post-370-30-770-start .writing .intermediate, .template-post-370-30-770-start .writing .advanced {
  font-family: "SF Pro Display", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 29px; /* 161.111% */
  letter-spacing: -0.5px;
  margin-bottom: 16px;
}
.template-post-370-30-770-start .writing .beginner {
  color: #1199af;
}
.template-post-370-30-770-start .writing .intermediate {
  color: #83ae00;
}
.template-post-370-30-770-start .writing .advanced {
  color: #962bd7;
}
.template-post-370-30-770-start .writing .title {
  margin-bottom: 25px;
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  word-break: break-all;
}
.template-post-370-30-770-start .writing .title.en {
  word-break: break-word;
}
.template-post-370-30-770-start .writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
.template-post-370-30-770-start .writing .description {
  margin-bottom: 25px;
  color: #444;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-all;
  letter-spacing: normal;
}
.template-post-370-30-770-start .writing .description.en {
  word-break: break-word;
}
.template-post-370-30-770-start .writing .description.ja {
  word-break: inherit;
}
.template-post-370-30-770-start .more-button {
  display: inline-block;
  margin-top: 5px;
  padding: 15px 30px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}
.template-post-370-30-770-start.mpti .writing {
  width: 470px;
}
.template-post-370-30-770-start.mpti .main-video {
  width: 636px;
}
@media all and (max-width: 768px) {
  .template-post-370-30-770-start {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: calc(100% - 36px);
  }
  .template-post-370-30-770-start .main-image {
    width: 100%;
  }
  .template-post-370-30-770-start .main-video {
    border-radius: 9px;
    border: 4px solid #000;
    width: 100%;
  }
  .template-post-370-30-770-start .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .template-post-370-30-770-start .main-video.with-image {
    gap: 19px;
  }
  .template-post-370-30-770-start .main-video.with-image .main-image {
    width: 160px;
    height: 191px;
  }
  .template-post-370-30-770-start .main-video.with-image .main-image.on-border {
    border-radius: 9px;
    border: 4px solid #000;
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .template-post-370-30-770-start .main-video.with-image .main-image img {
    height: 100%;
  }
  .template-post-370-30-770-start .main-video.with-image video {
    width: 160px;
    height: 191px;
    border: 4px solid #000;
    border-radius: 9px;
  }
  .template-post-370-30-770-start .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .template-post-370-30-770-start .writing.row {
    display: block;
  }
  .template-post-370-30-770-start .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    word-break: break-all;
  }
  .template-post-370-30-770-start .writing .beginner, .template-post-370-30-770-start .writing .intermediate, .template-post-370-30-770-start .writing .advanced {
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    margin-bottom: 5px;
  }
  .template-post-370-30-770-start .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-370-30-770-start .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .template-post-370-30-770-start .writing.rolling .title {
    text-align: center;
  }
  .template-post-370-30-770-start .writing .sub-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #ec0047;
  }
  .template-post-370-30-770-start .writing .description {
    margin-bottom: 25px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
  .template-post-370-30-770-start.mpti .writing {
    width: 335px;
  }
  .template-post-370-30-770-start.mpti .main-video {
    width: 335px;
  }
}
.template-post-370-30-770-start .more-button {
  display: inline-block;
  margin-top: 30px;
  padding: 15px 35px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: white;
  text-decoration: none;
}

.template-multi-image-440 {
  width: 100%;
  height: 440px;
  overflow: hidden;
}
.template-multi-image-440 .multi-image-frame {
  position: relative;
  left: 0%;
  width: 100%;
  height: 100%;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.template-multi-image-440 .multi-image-frame img {
  position: absolute;
  width: 100%;
  height: 100%;
}
.template-multi-image-440 .buttons {
  position: relative;
  top: -22px;
  display: flex;
  justify-content: center;
  column-gap: 12px;
}
.template-multi-image-440 .buttons .multi-image-button {
  height: 12px;
  border: none;
  cursor: pointer;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.template-multi-image-440 .buttons .multi-image-button.on {
  width: 37px;
  border-radius: 8px;
  background-color: #000;
}
.template-multi-image-440 .buttons .multi-image-button.off {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: grey;
}
@media all and (max-width: 768px) {
  .template-multi-image-440 {
    width: 100%;
    height: auto;
    overflow: hidden;
  }
  .template-multi-image-440 .multi-image-frame {
    position: relative;
    left: 0%;
    width: 100%;
    height: 100%;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .template-multi-image-440 .multi-image-frame img {
    position: absolute;
    width: 100%;
    height: 100%;
  }
  .template-multi-image-440 .buttons {
    position: relative;
    display: flex;
    justify-content: center;
    column-gap: 12px;
    top: -6px;
  }
  .template-multi-image-440 .buttons .multi-image-button {
    height: 12px;
    border: none;
    cursor: pointer;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .template-multi-image-440 .buttons .multi-image-button.on {
    width: 37px;
    border-radius: 8px;
    background-color: #000;
  }
  .template-multi-image-440 .buttons .multi-image-button.off {
    padding: 0px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    opacity: 0.35;
    background-color: #000;
  }
}

.template-pricing {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 1280px;
}
.template-pricing .contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
  width: 1170px;
  padding: 40px 0;
}
.template-pricing .contents > .title {
  margin-top: 80px;
  font-size: 36px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
.template-pricing .contents > .title.ja {
  font-size: 35px;
}
.template-pricing .contents > .options {
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 30px;
  width: 100%;
}
.template-pricing .contents > .options .option {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 268px;
  height: 507px;
  border-radius: 14px;
  box-shadow: 0 15px 15px -5px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  transition: all 0.5s ease;
  padding: 40px 20px 20px;
  box-sizing: border-box;
  z-index: 0;
  cursor: pointer;
}
.template-pricing .contents > .options .option.heatmap {
  height: 720px;
}
.template-pricing .contents > .options .option.heatmap .option-price {
  display: inline-block;
}
.template-pricing .contents > .options .option:hover {
  transform: scale(1.02);
  z-index: 1;
}
.template-pricing .contents > .options .option.recommend {
  border: solid 4px #ec0047;
  margin: -4px;
  box-shadow: 0 15px 15px -5px rgba(0, 0, 0, 0.16);
}
.template-pricing .contents > .options .option-recommend-image {
  position: absolute;
  top: 0;
  left: 0;
}
.template-pricing .contents > .options .option-title {
  position: relative;
  width: 100%;
  color: #333;
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -0.5px;
  text-align: center;
}
.template-pricing .contents > .options .option-title .sub {
  display: block;
  position: absolute;
  top: 40px;
  width: 100%;
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #0e99af;
}
.template-pricing .contents > .options .option-main-image {
  margin-top: 30px;
  height: 108px;
}
.template-pricing .contents > .options .option-pv {
  color: #EC0047;
  font-size: 18px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.template-pricing .contents > .options .option > i.icon {
  flex-shrink: 0;
  margin-bottom: -8px;
}
.template-pricing .contents > .options .option .icon-everyone {
  width: 208px;
  height: 117px;
  background-image: url("../../images/icon-everyone.svg");
}
.template-pricing .contents > .options .option .icon-pro {
  width: 208px;
  height: 117px;
  background-image: url("../../images/icon-pro.svg");
}
.template-pricing .contents > .options .option .icon-master {
  width: 208px;
  height: 117px;
  background-image: url("../../images/icon-master.svg");
}
.template-pricing .contents > .options .option .icon-custom {
  width: 208px;
  height: 117px;
  background-image: url("../../images/icon-custom.svg");
  margin-top: 16px;
}
.template-pricing .contents > .options .option-price {
  margin-bottom: 8px;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -1px;
  color: #333;
  position: relative;
  text-align: center;
}
.template-pricing .contents > .options .option-price.custom.en, .template-pricing .contents > .options .option-price.custom.ja {
  margin-top: -16px;
}
.template-pricing .contents > .options .option-price .option-price-wrap {
  display: flex;
  gap: 2px;
  align-items: center;
}
.template-pricing .contents > .options .option-price .option-price-unit {
  display: block;
}
.template-pricing .contents > .options .option-price .number {
  line-height: 140%;
}
.template-pricing .contents > .options .option-price .option-price-dc {
  position: absolute;
  width: 100%;
  text-align: center;
  top: 100%;
  left: 0;
  color: #888888;
  font-size: 12.5px;
  line-height: 1;
}
.template-pricing .contents > .options .option-price .medium {
  display: inline-block;
  font-size: 18px;
  font-weight: 600;
  line-height: 140%;
  color: #333;
  letter-spacing: -1px;
}
.template-pricing .contents > .options .option-price .medium.custom {
  font-weight: 800;
  padding-bottom: 8px;
}
.template-pricing .contents > .options .option-price .small {
  font-size: 11px;
  font-weight: 600;
  line-height: 12px;
  color: #333;
  margin-left: 3px;
}
.template-pricing .contents > .options .option-price .vat {
  position: relative;
  font-size: 13px;
  top: -2px;
  left: 5px;
}
.template-pricing .contents > .options .option-price-cancel {
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
  text-decoration: line-through;
}
.template-pricing .contents > .options .option-price-cancel.ja {
  font-size: 15px;
}
.template-pricing .contents > .options .option-price-cancel.en {
  font-size: 14px;
}
.template-pricing .contents > .options .option-btn {
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  min-width: 180px;
  height: 48px;
  padding: 0px 20px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #fff;
  text-decoration: none;
  text-align: center;
}
.template-pricing .contents > .options .option-btn:hover {
  background-color: #c60c3b;
}
.template-pricing .contents > .options .option-btn .sale {
  position: absolute;
  top: -50%;
  right: -20px;
}
.template-pricing .contents > .options .option-btn.disabled {
  pointer-events: none;
  background-color: rgba(0, 0, 0, 0.16) !important;
}
.template-pricing .contents > .options .option-spec {
  display: flex;
  flex-direction: column;
}
.template-pricing .contents > .options .option-spec .item-description {
  font-size: 15px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.7;
  letter-spacing: normal;
  color: #444;
  text-align: center;
}
.template-pricing .contents > .options .option-spec .item-check-list {
  display: flex;
  flex-direction: column;
  row-gap: 6px;
}
.template-pricing .contents > .options .option-spec .item-check {
  display: flex;
  align-items: center;
  padding-left: 25px;
  max-width: 300px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-check-green.svg") no-repeat 0% 50%;
  font-size: 13px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: normal;
  color: #444;
}
.template-pricing .contents > .options .option-spec .item-check.ko.tight {
  letter-spacing: -1px;
}
.template-pricing .contents > .options .option-spec .item-detail {
  display: flex;
  justify-content: center;
  margin-top: 6px;
  font-size: 12.5px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #888;
}
.template-pricing .contents > .options .option-spec .item-info-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 12px;
  height: 126px;
}
.template-pricing .contents > .options .option-spec .item-info-list.en {
  row-gap: 8px;
}
.template-pricing .contents > .options .option-spec .item-info-list .item-benefit {
  color: #333;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: -0.5px;
  margin-bottom: 4px;
}
.template-pricing .contents > .options .option-spec .item-info-list .item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 230px;
  color: #444;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  line-height: 15px; /* 115.385% */
}
.template-pricing .contents > .options .option-spec .item-info-list .item.en {
  align-items: flex-start;
}
.template-pricing .contents > .options .option-spec .item-info-list .item > span {
  display: flex;
  align-items: center;
  gap: 4px;
  background-color: #fff;
  text-align: start;
}
.template-pricing .contents > .options .option-spec .item-info-list .item > span .icon-ai {
  display: inline-block;
  width: 25px;
  height: 15px;
  background: url("../../images/icon-ai.svg") no-repeat center center;
}
.template-pricing .contents > .options .option-spec .item-info-list .item .frame {
  height: 15px;
  background-color: #fff;
}
.template-pricing .contents > .options .option-spec .item-info-list .item .additional-info {
  position: relative;
  display: inline-block;
  width: 15px;
  height: 15px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-info.svg") no-repeat center center;
  background-size: cover;
}
.template-pricing .contents > .options .option-spec .item-info-list .item .additional-info:hover .info-bubble {
  display: block;
}
.template-pricing .contents > .options .option-spec .item-info-list .item .additional-info.pop .info-bubble {
  display: block;
}
.template-pricing .contents > .options .option-spec .item-info-list .item .additional-info .info-bubble {
  display: none;
  position: absolute;
  right: -45px;
  bottom: 25px;
  max-width: 500px;
  width: max-content;
  box-sizing: border-box;
  padding: 16px;
  border-radius: 10px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  text-align: start;
  color: #767676;
  z-index: 10;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.template-pricing .contents > .options .option-spec .item-info-list .item .additional-info .info-bubble::after {
  content: "";
  position: absolute;
  bottom: -1px;
  right: 44px;
  background-color: #fff;
  z-index: 2;
  transform: rotate(-45deg) translateX(-50%);
  width: 10px;
  height: 10px;
  -webkit-box-shadow: -1px 1px 0 0 rgba(0, 0, 0, 0.16);
  box-shadow: -1px 1px 0 0 rgba(0, 0, 0, 0.16);
}
.template-pricing .contents > .options .option-spec .item-info-list .item .additional-info .info-bubble .pro-only {
  width: max-content;
  margin-bottom: 6px;
  padding: 4px 5px;
  border-radius: 4px;
  background-color: #ff2d92;
  font-family: NewRubrik;
  font-size: 9px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #fff;
  text-align: center;
}
.template-pricing .contents > .options .option-spec .item-info-list .item .additional-info .info-bubble.right-side {
  right: auto;
  bottom: auto;
  top: -200px;
  left: 100%;
  margin-left: 10px;
}
.template-pricing .contents > .options .option-spec .item-info-list .item .additional-info .info-bubble.right-side:after {
  bottom: auto;
  right: 100%;
  top: 200px;
  transform: translate(50%, 0) rotate(45deg);
}
.template-pricing .contents > .options .option .ps_message {
  position: absolute;
  bottom: 25px;
  color: #000;
  text-align: center;
  font-family: Inter;
  font-size: 13px;
}
.template-pricing .contents > .options .option.heatmap {
  width: 370px;
  height: 720px;
  padding: 0;
  gap: 0;
}
.template-pricing .contents > .options .option.heatmap .option-title {
  margin-top: 50px;
  font-size: 30px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.5px;
  color: #333;
}
.template-pricing .contents > .options .option.heatmap .option-pv {
  margin-top: 14px;
  padding: 10px 0px;
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #ec0047;
  display: inline-block;
}
.template-pricing .contents > .options .option.heatmap .option-pv-select {
  cursor: pointer;
  margin-top: 14px;
  height: 40px;
  padding: 11px 36px 11px 12px;
  border-radius: 6px;
  border: solid 1px #b1b1b1;
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 92% 50%;
  font-size: 16px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
  appearance: none;
}
.template-pricing .contents > .options .option.heatmap .option-price {
  margin-top: 20px;
  font-size: 36px;
  font-weight: 700;
  font-stretch: normal;
  font-style: normal;
  line-height: 36px;
  letter-spacing: -0.51px;
}
.template-pricing .contents > .options .option.heatmap .option-price .small {
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 18px;
  letter-spacing: -0.44px;
}
.template-pricing .contents > .options .option.heatmap .option-price.ko .small {
  position: relative;
  top: -2px;
  right: -2px;
}
.template-pricing .contents > .options .option.heatmap .option-spec .item-info-list {
  row-gap: 19px;
}
.template-pricing .contents > .options .option.heatmap .option-spec .item-info-list .item {
  justify-content: space-between;
  width: 306px;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.15;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}
.template-pricing .contents > .options .option.heatmap .option-spec .item-info-list .item.special {
  color: #ff2d92;
}
.template-pricing .contents > .options .option.heatmap .option-spec .item-info-list .item > span {
  padding-right: 5px;
}
.template-pricing .contents > .options .option.heatmap .option-spec .item-info-list .item::before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  z-index: -1;
  width: 99%;
  height: 5px;
  background-image: radial-gradient(#979797 25%, #fff 20%);
  background-size: 5px 5px;
}
.template-pricing .contents > .options .option.heatmap .option-spec .item-info-list .item .frame {
  display: grid;
  align-items: center;
  grid-template-columns: auto 15px;
  column-gap: 3px;
  text-align: end;
  background-color: #fff;
  padding-left: 5px;
}
.template-pricing .contents > .expand-wrap {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 32px;
}
.template-pricing .contents > .expand-wrap .option {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 40px;
  flex: 1;
  height: 220px;
  flex-shrink: 0;
  border-radius: 14px;
  box-shadow: 0 15px 15px -5px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  transition: all 0.5s ease;
  box-sizing: border-box;
  padding-top: 30px;
  padding-left: 35px;
  cursor: pointer;
}
.template-pricing .contents > .expand-wrap .option:hover {
  transform: scale(1.02);
}
.template-pricing .contents > .expand-wrap .option .option-title {
  font-size: 36px;
  font-weight: 700;
  line-height: 1;
  text-align: left;
  color: #222;
}
.template-pricing .contents > .expand-wrap .option .option-container {
  display: flex;
  gap: 8px;
}
.template-pricing .contents > .expand-wrap .option .option-container .option-text-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.template-pricing .contents > .expand-wrap .option .option-container .option-text-wrap .option-sub {
  color: #333;
  font-size: 20px;
  font-weight: 800;
  line-height: 140%; /* 28px */
  letter-spacing: -1px;
}
.template-pricing .contents > .expand-wrap .option .option-container .option-text-wrap .option-desc {
  color: #333;
  font-size: 14px;
  font-weight: 600;
  line-height: 16px; /* 114.286% */
}
.template-pricing .contents > .expand-wrap .option .icon-wrap {
  position: absolute;
  right: 20px;
  bottom: 10px;
}
.template-pricing .contents > .expand-wrap .option .icon-wrap .icon-agency {
  display: inline-block;
  width: 170px;
  height: 117px;
  background-image: url("../../images/icon-agency.svg");
}
.template-pricing .contents > .expand-wrap .option .icon-wrap .icon-enterprise {
  display: inline-block;
  width: 170px;
  height: 117px;
  background-image: url("../../images/icon-enterprise.svg");
}
.template-pricing .contents > .manual {
  margin-top: 80px;
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  text-align: center;
  color: #555;
}

.template-pricing-mobile {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.template-pricing-mobile .title {
  margin-top: 40px;
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.3;
  letter-spacing: -0.45px;
  text-align: center;
  color: #333;
}
.template-pricing-mobile .options {
  width: 100%;
  margin-top: 40px;
}
.template-pricing-mobile .options .option {
  border-top: 2px solid #888;
  padding: 15px 20px;
  z-index: 0;
}
.template-pricing-mobile .options .option-main {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.template-pricing-mobile .options .option-main .icon-arrow {
  width: 20px;
  height: 20px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.template-pricing-mobile .options .option-main.on .icon-arrow {
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.template-pricing-mobile .options .option-main-title {
  font-size: 20px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
  position: relative;
}
.template-pricing-mobile .options .option-main-title .additional {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
}
.template-pricing-mobile .options .option-main-title .recommend {
  padding: 4px 6px;
  border-radius: 3px;
  background-color: #1199af;
  margin-left: 5px;
  margin-top: -1px;
  font-size: 10px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #fff;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.template-pricing-mobile .options .option-main-price {
  display: flex;
  align-items: center;
  column-gap: 9px;
  margin-top: 8px;
  font-size: 20px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #0e99af;
}
.template-pricing-mobile .options .option-main-price .recommend {
  padding: 4px;
  border-radius: 3px;
  background-color: #1199af;
  font-size: 10px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #fff;
}
.template-pricing-mobile .options .option-main-price .cancel {
  font-size: 13px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #7e36e0;
  text-decoration: line-through;
}
.template-pricing-mobile .options .option-main-price .vat {
  position: relative;
  font-size: 12px;
  top: -2px;
  left: 5px;
  color: #2F2F2F;
}
.template-pricing-mobile .options .option-main-price-journey {
  display: flex;
  align-items: center;
  column-gap: 9px;
  margin-top: 8px;
  font-size: 20px;
  font-weight: 600;
  color: #0E99AF;
  font-family: "Apple SD Gothic Neo";
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}
.template-pricing-mobile .options .option-main-price-journey .small {
  color: #444;
  font-size: 13px;
  font-weight: 500;
}
.template-pricing-mobile .options .option-main-price-journey .recommend {
  padding: 4px;
  border-radius: 3px;
  background-color: #1199af;
  font-size: 10px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #fff;
}
.template-pricing-mobile .options .option-main-price-journey .cancel {
  font-size: 13px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #FF2D92;
  text-decoration: line-through;
}
.template-pricing-mobile .options .option-sub-wrap {
  overflow: hidden;
  height: 0px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.template-pricing-mobile .options .option-sub-wrap.on {
  height: auto;
  padding-top: 20px;
}
.template-pricing-mobile .options .option-sub {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #ececec;
  margin-bottom: 30px;
}
.template-pricing-mobile .options .option-sub:last-child {
  border: 0;
  margin: 0;
}
.template-pricing-mobile .options .option-sub-title {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 20px;
}
.template-pricing-mobile .options .option-sub-benefit, .template-pricing-mobile .options .option-sub-pv {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 10px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
}
.template-pricing-mobile .options .option-sub-benefit span.right, .template-pricing-mobile .options .option-sub-pv span.right {
  text-align: end;
}
.template-pricing-mobile .options .option-sub-benefit span.desc, .template-pricing-mobile .options .option-sub-pv span.desc {
  color: #888;
}
.template-pricing-mobile .options .option-sub-benefit select, .template-pricing-mobile .options .option-sub-pv select {
  padding: 11px 37px 11px 9px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 92% 50%;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
  appearance: none;
}
.template-pricing-mobile .options .option-sub-benefit {
  justify-content: flex-start;
  padding: 0 5px;
  margin-bottom: 5px;
}
.template-pricing-mobile .options .option-sub-benefit-cxreport {
  display: flex;
  align-items: center;
  gap: 4px;
}
.template-pricing-mobile .options .option-sub-benefit-cxreport .icon-ai {
  margin-bottom: 2px;
}
.template-pricing-mobile .options .option-sub-benefit:last-child {
  margin: 0;
}
.template-pricing-mobile .options .option-sub-description {
  font-size: 13px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #444;
  text-align: center;
}
.template-pricing-mobile .options .option-sub-check {
  width: 20px;
  height: 20px;
  padding-left: 5px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-check-green.svg") no-repeat 0% 50%;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #444;
}
.template-pricing-mobile .options .option-sub-detail {
  padding-right: 14px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-right.svg") no-repeat 100% 50%;
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #888;
}
.template-pricing-mobile .options .option-sub-button {
  width: auto;
  padding: 12px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 15px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
.template-pricing-mobile.heatmap .option-sub {
  overflow: hidden;
  height: 0px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.template-pricing-mobile.heatmap .option-sub.on {
  height: auto;
  padding-top: 20px;
}
.template-pricing-mobile.heatmap .option-sub-check {
  flex-grow: 1;
  padding-left: 20px;
  width: 100%;
}
.template-pricing-mobile.heatmap .option-sub-detail {
  width: fit-content;
  flex-shrink: 0;
}

#popup.container {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}
#popup.container .popup {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: calc(50% - 150px);
  left: calc(50% - 215px);
  width: 430px;
  height: 300px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  border-radius: 14px;
  background-color: #ffffff;
}
#popup.container .popup-image {
  width: 50px;
  height: 50px;
}
#popup.container .popup-title {
  font-size: 20px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.3;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}
#popup.container .popup-description {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: normal;
  text-align: center;
  color: #2f2f2f;
}
#popup.container .popup-button {
  margin-top: 25px;
  padding: 12px 36px;
  border-radius: 20px;
  border: solid 1px #bbb;
  background-color: #fff;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}

.solution--arrow-bottom {
  display: inline-block;
  width: 86px;
  height: 34px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/solution--arrow-bottom.svg") no-repeat center center;
  background-size: contain;
}

.solution--arrow-top {
  display: inline-block;
  width: 93px;
  height: 77px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/solution--arrow-top.svg") no-repeat center center;
  background-size: contain;
}

.solution--underline {
  display: inline-block;
  width: 100%;
  height: 48px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/solution--underline.svg") no-repeat center center;
  background-size: contain;
}

.heatmap--title {
  display: inline-block;
  width: 213px;
  height: 141px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/heatmap--title.svg") no-repeat center center;
  background-size: contain;
}

.icon--arrow-opal {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--arrow-opal.svg") no-repeat center center;
  background-size: contain;
}

.icon--arrow-light {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--arrow-light.svg") no-repeat center center;
  background-size: contain;
}

.icon--check-deep {
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--check-deep.svg") no-repeat center center;
  background-size: contain;
}

.icon--heatmap-ab {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--heatmap-ab.svg") no-repeat center center;
  background-size: contain;
}

.icon--heatmap-auto {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--heatmap-auto.svg") no-repeat center center;
  background-size: contain;
}

.icon--heatmap-capture {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--heatmap-capture.svg") no-repeat center center;
  background-size: contain;
}

.icon--heatmap-realtime {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--heatmap-realtime.svg") no-repeat center center;
  background-size: contain;
}

.icon--heatmap-segment {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--heatmap-segment.svg") no-repeat center center;
  background-size: contain;
}

.icon--heatmap-tagging {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--heatmap-tagging.svg") no-repeat center center;
  background-size: contain;
}

.icon--heatmap-rising {
  display: inline-block;
  width: 133px;
  height: 101px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--heatmap-rising.svg") no-repeat center center;
  background-size: contain;
}

.icon--heatmap-real {
  display: inline-block;
  width: 116px;
  height: 116px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--heatmap-real.svg") no-repeat center center;
  background-size: contain;
}

.icon--heatmap-billion {
  display: inline-block;
  width: 94px;
  height: 56px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--heatmap-billion.svg") no-repeat center center;
  background-size: contain;
}

.icon--journey-ranking {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--journey-ranking.svg") no-repeat center center;
  background-size: contain;
}

.icon--journey-docent {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--journey-docent.svg") no-repeat center center;
  background-size: contain;
}

.icon--journey-report {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--journey-report.svg") no-repeat center center;
  background-size: contain;
}

.icon--journey-dashboard {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--journey-dashboard.svg") no-repeat center center;
  background-size: contain;
}

.icon--journey-map {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--journey-map.svg") no-repeat center center;
  background-size: contain;
}

.icon--journey-flow {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--journey-flow.svg") no-repeat center center;
  background-size: contain;
}

.icon--journey-compare {
  display: inline-block;
  width: 132px;
  height: 55px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--journey-compare.svg") no-repeat center center;
  background-size: contain;
}

.icon--journey-insight {
  display: inline-block;
  width: 243px;
  height: 91px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--journey-insight.svg") no-repeat center center;
  background-size: contain;
}

.icon--bi-etl {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--bi-etl.svg") no-repeat center center;
  background-size: contain;
}

.icon--bi-engine {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--bi-engine.svg") no-repeat center center;
  background-size: contain;
}

.icon--bi-learning {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--bi-learning.svg") no-repeat center center;
  background-size: contain;
}

.icon--bi-build {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--bi-build.svg") no-repeat center center;
  background-size: contain;
}

.icon--bi-visualization {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--bi-visualization.svg") no-repeat center center;
  background-size: contain;
}

.icon--bi-link {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--bi-link.svg") no-repeat center center;
  background-size: contain;
}

.icon--geo-ai {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--geo-ai.svg") no-repeat center center;
  background-size: contain;
}

.icon--geo-detect {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--geo-detect.svg") no-repeat center center;
  background-size: contain;
}

.icon--geo-mpti {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--geo-mpti.svg") no-repeat center center;
  background-size: contain;
}

.icon--geo-schema {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--geo-schema.svg") no-repeat center center;
  background-size: contain;
}

.icon--geo-llms {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--geo-llms.svg") no-repeat center center;
  background-size: contain;
}

.icon--geo-dna {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--geo-dna.svg") no-repeat center center;
  background-size: contain;
}

.icon--ai-verification {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--ai-verification.svg") no-repeat center center;
  background-size: contain;
}

.icon--ai-engine {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--ai-engine.svg") no-repeat center center;
  background-size: contain;
}

.icon--ai-expansion {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--ai-expansion.svg") no-repeat center center;
  background-size: contain;
}

.icon--ai-agentic {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--ai-agentic.svg") no-repeat center center;
  background-size: contain;
}

.icon--ai-rapaid {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--ai-rapaid.svg") no-repeat center center;
  background-size: contain;
}

.icon--ai-data {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--ai-data.svg") no-repeat center center;
  background-size: contain;
}

.icon--cx-report {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--cx-report.svg") no-repeat center center;
  background-size: contain;
}

.icon--cx-domain {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--cx-domain.svg") no-repeat center center;
  background-size: contain;
}

.icon--cx-benchmark {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--cx-benchmark.svg") no-repeat center center;
  background-size: contain;
}

.icon--cx-signal {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--cx-signal.svg") no-repeat center center;
  background-size: contain;
}

.icon--cx-formula {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--cx-formula.svg") no-repeat center center;
  background-size: contain;
}

.icon--cx-react {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--cx-react.svg") no-repeat center center;
  background-size: contain;
}

.icon--pattern-plan {
  display: inline-block;
  width: 44px;
  height: 44px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--pattern-plan.svg") no-repeat center center;
  background-size: contain;
}

.icon--pattern-date {
  display: inline-block;
  width: 44px;
  height: 44px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--pattern-date.svg") no-repeat center center;
  background-size: contain;
}

.icon--pattern-curio {
  display: inline-block;
  width: 44px;
  height: 44px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--pattern-curio.svg") no-repeat center center;
  background-size: contain;
}

.icon--pattern-interest {
  display: inline-block;
  width: 44px;
  height: 44px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--pattern-interest.svg") no-repeat center center;
  background-size: contain;
}

.icon--pattern-price {
  display: inline-block;
  width: 44px;
  height: 44px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--pattern-price.svg") no-repeat center center;
  background-size: contain;
}

.icon--ai-tech {
  display: inline-block;
  width: 73px;
  height: 72px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--ai-tech.svg ") no-repeat center center;
  background-size: contain;
}

.icon--ai-stack {
  display: inline-block;
  width: 94px;
  height: 74px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--ai-stack.svg") no-repeat center center;
  background-size: contain;
}

.icon--cx-point {
  display: inline-block;
  width: 117px;
  height: 79px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--cx-point.svg") no-repeat center center;
  background-size: contain;
}

.icon--diff-highlight1 {
  display: inline-block;
  width: 16px;
  height: 19px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--diff-highlight1.svg") no-repeat center center;
  background-size: contain;
}

.icon--diff-highlight2 {
  display: inline-block;
  width: 293px;
  height: 150px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--diff-highlight2.svg") no-repeat center center;
  background-size: contain;
}

.icon--data-arrow {
  display: inline-block;
  width: 139px;
  height: 143px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--data-arrow.svg") no-repeat center center;
  background-size: contain;
  margin-right: 24px;
  margin-left: 17px;
  margin-bottom: 56px;
}

.icon--industry-terms {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--industry-terms.svg") no-repeat center center;
  background-size: contain;
}

.icon--industry-operation {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--industry-operation.svg") no-repeat center center;
  background-size: contain;
}

.icon--industry-monthly {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--industry-monthly.svg") no-repeat center center;
  background-size: contain;
}

.icon--industry-customer {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--industry-customer.svg") no-repeat center center;
  background-size: contain;
}

.icon--modal-close {
  display: inline-block;
  width: 28px;
  height: 28px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--modal-close.svg") no-repeat center center;
  background-size: contain;
}

.icon--white-arrow {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--white-arrow.svg") no-repeat center center;
  background-size: contain;
}

.icon--link-move {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--link-move.svg") no-repeat center center;
  background-size: contain;
}
.icon--link-move-dark {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--link-move-dark.svg") no-repeat center center;
  background-size: contain;
}
.icon--link-move-red {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--link-move-red.svg") no-repeat center center;
  background-size: contain;
}

.icon--synergy {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("https://dream-cdn.beusable.net/home/images/main-new/icon--synergy.svg") no-repeat center center;
  background-size: contain;
}

.forum-logo {
  display: inline-block;
  width: 87px;
  height: 41px;
  background: url("https://dream-cdn.beusable.net/home/images/my/forum-logo.svg") no-repeat center center;
  background-size: contain;
}

.logo-geo {
  display: inline-block;
  width: 162px;
  height: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/logo-geo.svg") no-repeat center center;
  background-size: contain;
}

.icon--start-bot {
  display: inline-block;
  width: 150px;
  height: 126px;
  background: url("https://dream-cdn.beusable.net/home/images/icon--start-bot.svg") no-repeat center center;
  background-size: contain;
}

.icon--kakao {
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url("https://dream-cdn.beusable.net/home/images/icon--kakao.svg") no-repeat center center;
  background-size: contain;
}

.icon--checked-bold {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("https://dream-cdn.beusable.net/home/images/icon--checked-bold.svg") no-repeat center center;
  background-size: contain;
}

.icon-geo-diagnosis {
  display: inline-block;
  width: 52px;
  height: 52px;
  background: url("/images/icon-geo-diagnosis.svg") no-repeat center center;
  background-size: contain;
}

.icon--close-14 {
  display: inline-block;
  width: 14px;
  height: 14px;
  background: url("https://dream-cdn.beusable.net/home/images/icon--close-444.svg") no-repeat center center;
  background-size: contain;
}

.icon--dialog-check {
  display: inline-block;
  width: 50px;
  height: 50px;
  background: url("https://dream-cdn.beusable.net/home/images/icon--dialog-check.svg") no-repeat center center;
  background-size: contain;
}

.icon--dialog-warning {
  display: inline-block;
  width: 50px;
  height: 50px;
  background: url("https://dream-cdn.beusable.net/home/images/icon--dialog-warning.svg") no-repeat center center;
  background-size: contain;
}

.icon--refresh-white {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/icon--refresh-white.svg") no-repeat center center;
  background-size: contain;
}

.icon--refresh-blue {
  display: inline-block;
  width: 28px;
  height: 28px;
  background: url("https://dream-cdn.beusable.net/home/images/icon--refresh-blue.svg") no-repeat center center;
  background-size: contain;
}

.icon--download-blue {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("https://dream-cdn.beusable.net/home/images/icon--download-blue.svg") no-repeat center center;
  background-size: contain;
}

#header.container {
  position: relative;
  top: -1px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 1170px;
  height: 84px;
  background-color: #eff2d6;
  z-index: 20;
  letter-spacing: normal;
}
#header.container.cx-header {
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: top center;
  top: 0px;
}
#header.container.cx-header .contents .navigation {
  display: flex;
  margin-left: 48px;
}
#header.container.cx-header .contents .navigation > div {
  position: relative;
}
#header.container.cx-header .contents .navigation > div > a {
  display: block;
  padding: 10px 0px;
  font-size: 15px;
  font-weight: bold;
  color: #333;
}
#header.container.cx-header .contents .navigation > div > a.selected {
  border-bottom: 3px solid #EC0047;
  margin-bottom: -3px;
  color: #EC0047;
}
#header.container.cx-header .contents .navigation > div > a.link {
  padding-right: 20px;
}
#header.container.cx-header .contents .navigation > div > a.link:hover {
  background: url("https://dream-cdn.beusable.net/home/images/logo-link-popup-white.svg") no-repeat 100% 50%;
}
#header.container.cx-header .contents .navigation > div:hover > a {
  color: #EC0047;
}
#header.container.geo-header {
  background: #000;
  transition: box-shadow 0.3s ease;
  z-index: 999;
}
#header.container.geo-header .contents {
  background: #000;
  padding-top: 14px;
  z-index: 100;
  height: initial;
}
#header.container.geo-header .contents .navigation > div > a {
  color: #FFF;
  font-weight: 700;
  line-height: 16px; /* 100% */
}
#header.container.geo-header .contents .navigation > div > a.selected {
  border-bottom: 3px solid #EC0047;
  margin-bottom: -3px;
  color: #EC0047;
}
#header.container.geo-header .contents .navigation > div > a.link {
  padding-right: 20px;
}
#header.container.geo-header .contents .navigation > div > a.link:hover {
  background: url("https://dream-cdn.beusable.net/home/images/logo-link-popup-white.svg") no-repeat 100% 50%;
}
#header.container.geo-header .contents .navigation > div:hover > a {
  color: #EC0047;
}
#header.container.geo-header .contents .buttons .button.start {
  background-color: #fff;
  color: #222;
}
#header.container.geo-header .contents .buttons .button.start:hover {
  background-color: rgba(255, 255, 255, 0.84);
}
#header.container.geo-header .contents .buttons .button.signin {
  border: 1px solid #FFF;
  color: #fff;
}
#header.container.geo-header .contents .buttons .button.signin:hover {
  background-color: #fff;
  color: #222;
}
#header.container .shadow-line {
  display: none;
  position: absolute;
  transform: translateY(100%);
  bottom: 0;
  left: 0px;
  width: 100%;
  height: 28px;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 60%);
}
@keyframes line-movein {
  0% {
    height: 0px;
  }
  100% {
    height: 28px;
  }
}
#header.container.is-pinned {
  box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.06);
}
#header.container.is-pinned .shadow-line {
  display: block;
  animation: line-movein 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s 1;
  animation-fill-mode: forwards;
}
@keyframes header-movein {
  0% {
    top: -84px;
  }
  100% {
    top: -1px;
  }
}
@keyframes header-moveout {
  0% {
    top: -1px;
  }
  100% {
    top: -84px;
  }
}
#header.container.is-scrolled {
  position: fixed;
  animation: header-movein 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s 1;
  animation-fill-mode: forwards;
  box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.06);
}
#header.container.is-scrolled .shadow-line {
  display: block;
}
#header.container.is-scroll-out {
  position: fixed;
  animation: header-moveout 0.1s linear 0s 1;
  animation-fill-mode: forwards;
}
#header.container .contents {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1170px;
  width: 100%;
  height: 100%;
}
#header.container .contents .buttons {
  flex-shrink: 0;
}
#header.container .contents-right {
  display: flex;
  gap: 32px;
}
#header.container .contents .logo {
  width: 127px;
  height: 22px;
  background: url("https://dream-cdn.beusable.net/home/images/logo-main.svg") no-repeat center center;
  background-size: contain;
}
#header.container .contents .navigation {
  display: flex;
  gap: 28px;
}
#header.container .contents .navigation > div {
  position: relative;
}
#header.container .contents .navigation > div > a {
  display: block;
  padding: 10px 0px;
  white-space: nowrap;
  font-size: 15px;
  font-weight: bold;
  color: #333;
  cursor: pointer;
  text-decoration: none;
}
#header.container .contents .navigation > div > a.selected {
  border-bottom: 3px solid #ec0047;
  margin-bottom: -3px;
  color: #ec0047;
}
#header.container .contents .navigation > div > a.link {
  padding-right: 20px;
}
#header.container .contents .navigation > div > a.link:hover {
  background: url("https://dream-cdn.beusable.net/home/images/logo-link-popup-red.svg") no-repeat 100% 50%;
}
#header.container .contents .navigation > div:hover > a {
  color: #ec0047;
}
#header.container .contents .navigation > div .submenu {
  opacity: 0;
  display: flex;
  position: absolute;
  flex-direction: column;
  row-gap: 8px;
  left: 28px;
  top: 55px;
  box-sizing: border-box;
  width: 230px;
  height: 0px;
  border-radius: 8px;
  background-color: #fff;
  overflow: hidden;
  z-index: 20;
  transition: padding 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#header.container .contents .navigation > div .submenu .cell {
  opacity: 0;
  box-sizing: border-box;
  width: 200px;
  border-radius: 4px;
  padding: 6px 10px;
  background-color: white;
  font-size: 14px;
  color: #444;
  cursor: pointer;
  text-decoration: none;
  visibility: hidden;
}
#header.container .contents .navigation > div .submenu .cell.cxdata-report {
  background: url("https://dream-cdn.beusable.net/home/images/cx_trend/graph--icon.svg") no-repeat 98% 50%;
}
#header.container .contents .navigation > div .submenu .cell:hover {
  background-color: rgba(0, 0, 0, 0.08);
}
#header.container .contents .navigation > div .submenu .cell:hover.hassub {
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-right.svg") no-repeat 98% 50% rgba(0, 0, 0, 0.08);
}
#header.container .contents .navigation > div .submenu .cell:hover.cxdata-report {
  background: url("https://dream-cdn.beusable.net/home/images/cx_trend/graph--icon-red.svg") no-repeat 98% 50% rgba(0, 0, 0, 0.08);
}
#header.container .contents .navigation > div .submenu .cell.disabled {
  color: #999;
  pointer-events: none;
}
#header.container .contents .navigation > div .submenu .division {
  margin-top: 15px;
  padding-left: 10px;
  color: #999;
}
#header.container .contents .navigation > div:hover .submenu {
  opacity: 1;
  height: auto;
  padding: 17px 15px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
}
#header.container .contents .navigation > div:hover .submenu .cell {
  opacity: 1;
  visibility: visible;
}
#header.container .contents .buttons {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
#header.container .contents .buttons.ja {
  margin-left: 18px;
}
#header.container .contents .buttons .button {
  text-decoration: none;
  padding: 11px 18px;
  border-radius: 21px;
  cursor: pointer;
  transition: all 0.5s ease;
  font-size: 14px;
  font-weight: 700;
  line-height: 16px;
}
#header.container .contents .buttons .button.start {
  background-color: #ec0047;
  color: #fff;
}
#header.container .contents .buttons .button.start:hover {
  background-color: #c60c3b;
}
#header.container .contents .buttons .button.signin {
  border: solid 1px #666;
  box-sizing: border-box;
  padding: 10px 18px;
  color: #222;
}
#header.container .contents .buttons .button.signin:hover {
  border: solid 1px rgba(0, 0, 0, 0);
  background-color: #ec0047;
  color: #fff;
}

#header-main.container {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 1170px;
  height: 84px;
  background-color: transparent;
  z-index: 20;
  letter-spacing: normal;
}
#header-main.container .contents {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1170px;
  height: 100%;
}
#header-main.container .contents .logo {
  width: 149px;
  height: 26px;
  background: url("https://dream-cdn.beusable.net/home/images/logo-white.svg") no-repeat center center;
  background-size: contain;
}
#header-main.container .contents .navigation {
  display: flex;
  margin-left: 48px;
}
#header-main.container .contents .navigation > div {
  position: relative;
}
#header-main.container .contents .navigation > div > a {
  display: block;
  margin: 10px 0px 10px 26px;
  padding: 10px 0px;
  font-size: 15px;
  font-weight: bold;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
}
#header-main.container .contents .navigation > div > a.selected {
  border-bottom: 3px solid #ec0047;
  margin-bottom: -3px;
  color: #ec0047;
}
#header-main.container .contents .navigation > div > a.link {
  padding-right: 20px;
}
#header-main.container .contents .navigation > div > a.link:hover {
  background: url("https://dream-cdn.beusable.net/home/images/logo-link-popup-white.svg") no-repeat 100% 50%;
}
#header-main.container .contents .navigation > div:hover > a {
  color: rgba(255, 255, 255, 0.75);
}
#header-main.container .contents .navigation > div .submenu {
  opacity: 0;
  display: flex;
  position: absolute;
  flex-direction: column;
  row-gap: 8px;
  left: 28px;
  top: 55px;
  box-sizing: border-box;
  width: 230px;
  height: 0px;
  border-radius: 8px;
  background-color: #fff;
  overflow: hidden;
  z-index: 20;
  transition: padding 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#header-main.container .contents .navigation > div .submenu .cell {
  opacity: 0;
  box-sizing: border-box;
  width: 200px;
  border-radius: 4px;
  padding: 6px 10px;
  background-color: white;
  font-size: 14px;
  color: #444;
  cursor: pointer;
  text-decoration: none;
  visibility: hidden;
}
#header-main.container .contents .navigation > div .submenu .cell.cxdata-report {
  background: url("https://dream-cdn.beusable.net/home/images/cx_trend/graph--icon.svg") no-repeat 98% 50%;
}
#header-main.container .contents .navigation > div .submenu .cell:hover {
  background-color: rgba(0, 0, 0, 0.08);
}
#header-main.container .contents .navigation > div .submenu .cell:hover.hassub {
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-right.svg") no-repeat 98% 50% rgba(0, 0, 0, 0.08);
}
#header-main.container .contents .navigation > div .submenu .cell:hover.cxdata-report {
  background: url("https://dream-cdn.beusable.net/home/images/cx_trend/graph--icon-red.svg") no-repeat 98% 50% rgba(0, 0, 0, 0.08);
}
#header-main.container .contents .navigation > div .submenu .cell.disabled {
  color: #999;
  pointer-events: none;
}
#header-main.container .contents .navigation > div .submenu .division {
  margin-top: 15px;
  padding-left: 10px;
  font-size: 16px;
  font-weight: bold;
  font-size: 13px;
  font-weight: 500;
  color: #999;
}
#header-main.container .contents .navigation > div:hover .submenu {
  opacity: 1;
  height: auto;
  padding: 17px 15px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
}
#header-main.container .contents .navigation > div:hover .submenu .cell {
  opacity: 1;
  visibility: visible;
}
#header-main.container .contents .buttons {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
#header-main.container .contents .buttons.ja {
  margin-left: 18px;
}
#header-main.container .contents .buttons .button {
  text-decoration: none;
  padding: 12px 18px;
  border-radius: 21px;
  cursor: pointer;
  transition: all 0.5s ease;
  font-size: 16px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 16px;
  letter-spacing: normal;
}
#header-main.container .contents .buttons .button.start {
  background-color: #fff;
  color: #222;
}
#header-main.container .contents .buttons .button.start:hover {
  background-color: rgba(255, 255, 255, 0.84);
}
#header-main.container .contents .buttons .button.signin {
  border: solid 1px #fff;
  box-sizing: border-box;
  padding: 11px 22px;
  color: #fff;
}
#header-main.container .contents .buttons .button.signin:hover {
  background-color: #fff;
  color: #222;
}

@media all and (max-width: 768px) {
  #header-mobile.container {
    position: relative;
    display: block;
    top: 0px;
    width: 100%;
    background-color: white;
    z-index: 20;
  }
  #header-mobile.container.cx-header {
    background-color: #000;
    border-bottom: none;
    top: 0;
  }
  #header-mobile.container.cx-header .top .logo {
    display: block;
  }
  #header-mobile.container.cx-header .top .title {
    color: #fff;
  }
  #header-mobile.container.cx-header .top .navigation-button svg {
    width: 24px;
    height: 24px;
    transition: all 0.5s ease;
  }
  #header-mobile.container.cx-header .top .navigation-button svg path {
    stroke-linecap: square;
    stroke-linejoin: square;
    stroke-width: 2;
    stroke: #fff;
    transition: all 0.5s ease;
    transform-origin: 18px 13px;
  }
  #header-mobile.container.cx-header .top.on .navigation-button path {
    stroke: black;
  }
  #header-mobile.container.geo-header {
    background-color: #000;
    border-bottom: none;
    transition: all 0.3s;
  }
  #header-mobile.container.geo-header .top .title {
    color: #fff;
  }
  #header-mobile.container.geo-header .top .navigation-button svg {
    width: 24px;
    height: 24px;
    transition: all 0.5s ease;
  }
  #header-mobile.container.geo-header .top .navigation-button svg path {
    stroke-linecap: square;
    stroke-linejoin: square;
    stroke-width: 2;
    stroke: #fff;
    transition: all 0.5s ease;
    transform-origin: 18px 13px;
  }
  #header-mobile.container.geo-header .top.on .navigation-button path {
    stroke: black;
  }
  #header-mobile.container.main-header {
    height: auto;
    background: #000;
  }
  #header-mobile.container.main-header .top .logo {
    display: block;
  }
  #header-mobile.container.main-header.is-scrolled {
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(26px);
  }
  #header-mobile.container.main-header.is-menu-open {
    height: 100vh;
  }
  #header-mobile.container.main-header .top.on {
    background: transparent;
  }
  #header-mobile.container.main-header .top.on .navigation-button path {
    stroke: #767676;
  }
  #header-mobile.container.main-header .navigation.on {
    background: transparent;
  }
  #header-mobile.container.main-header .navigation > div {
    border-color: #444;
  }
  #header-mobile.container.main-header .navigation > div.on .mainmenu span {
    color: #fff;
  }
  #header-mobile.container.main-header .navigation > div .external_link {
    justify-content: flex-start;
    gap: 4px;
  }
  #header-mobile.container.main-header .navigation > div .mainmenu span {
    color: #fff;
  }
  #header-mobile.container.main-header .navigation > div .submenu .cell {
    color: #fff;
  }
  #header-mobile.container .shadow-line {
    display: none;
    position: absolute;
    transform: translateY(100%);
    bottom: 0;
    left: 0px;
    width: 100%;
    height: 28px;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 60%);
  }
  @keyframes line-movein {
    0% {
      height: 0px;
    }
    100% {
      height: 28px;
    }
  }
  #header-mobile.container.is-pinned {
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.06);
  }
  #header-mobile.container.is-pinned .shadow-line {
    display: block;
    animation: line-movein 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s 1;
    animation-fill-mode: forwards;
  }
  @keyframes header-movein {
    0% {
      top: -84px;
    }
    100% {
      top: -1px;
    }
  }
  @keyframes header-moveout {
    0% {
      top: -1px;
    }
    100% {
      top: -84px;
    }
  }
  #header-mobile.container.is-scrolled {
    position: fixed;
    animation: header-movein 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s 1;
    animation-fill-mode: forwards;
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.06);
  }
  #header-mobile.container.is-scrolled .shadow-line {
    display: block;
  }
  #header-mobile.container.is-scroll-out {
    position: fixed;
    animation: header-moveout 0.1s linear 0s 1;
    animation-fill-mode: forwards;
  }
  #header-mobile.container .top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 16px 15px 16px;
    z-index: 20;
  }
  #header-mobile.container .top.on {
    position: fixed;
    top: 0;
    width: calc(100% - 32px);
    background-color: white;
  }
  #header-mobile.container .top .home {
    height: 26px;
  }
  #header-mobile.container .top.on .home {
    display: none;
  }
  #header-mobile.container .top .logo {
    width: 98px;
    height: 17px;
    display: none;
    background: url("https://dream-cdn.beusable.net/home/images/logo-main.svg") no-repeat center center;
    background-size: contain;
  }
  #header-mobile.container .top.on .logo {
    display: block;
  }
  #header-mobile.container .top .title {
    font-family: NewRubrik;
    font-size: 18px;
    font-weight: bold;
    color: #ec0047;
  }
  #header-mobile.container .top.on .title {
    display: none;
  }
  #header-mobile.container .top .navigation-button svg {
    width: 24px;
    height: 24px;
    transition: all 0.5s ease;
  }
  #header-mobile.container .top .navigation-button svg path {
    stroke-linecap: square;
    stroke-linejoin: square;
    stroke-width: 2;
    stroke: #ec0047;
    transition: all 0.5s ease;
    transform-origin: 18px 13px;
  }
  #header-mobile.container .top.on .navigation-button path {
    stroke: black;
  }
  #header-mobile.container .top.on .navigation-button .d1 {
    transform: rotate(-45deg);
  }
  #header-mobile.container .top.on .navigation-button .d2 {
    transform-origin: 50% 50%;
    transform: scaleX(0);
  }
  #header-mobile.container .top.on .navigation-button .d3 {
    transform: rotate(45deg);
  }
  #header-mobile.container .navigation {
    position: fixed;
    top: 50px;
    width: 100%;
    height: 0;
    background-color: white;
    opacity: 0;
    overflow: hidden;
    transition: padding 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    z-index: 10;
  }
  #header-mobile.container .navigation.on {
    padding-top: 31px;
    min-height: 100vh;
    opacity: 1;
  }
  #header-mobile.container .navigation.on .mainmenu {
    display: flex;
  }
  #header-mobile.container .navigation.on .submenu .cell {
    display: flex;
  }
  #header-mobile.container .navigation > div {
    border-bottom: 1px solid #ebebeb;
    padding: 18px 20px 18px 26px;
  }
  #header-mobile.container .navigation > div .mainmenu {
    display: none;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
  }
  #header-mobile.container .navigation > div .mainmenu span {
    font-size: 16px;
    font-weight: bold;
    font-size: 18px;
    color: #2f2f2f;
  }
  #header-mobile.container .navigation > div .mainmenu span.link {
    padding-right: 20px;
    background: url("https://dream-cdn.beusable.net/home/images/logo-link-popup.svg") no-repeat 100% 50%;
  }
  #header-mobile.container .navigation > div .mainmenu img {
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #header-mobile.container .navigation > div .submenu {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    padding-left: 10px;
    height: 0;
    box-sizing: border-box;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #header-mobile.container .navigation > div .submenu .cell {
    display: none;
    align-items: center;
    column-gap: 5px;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    font-weight: 500;
    color: #2f2f2f;
    text-decoration: none;
  }
  #header-mobile.container .navigation > div .submenu .cell.disabled {
    color: #999;
    pointer-events: none;
  }
  #header-mobile.container .navigation > div .submenu .division {
    padding-top: 20px;
    border-top: dashed 1px #e3e3e3;
    font-size: 16px;
    font-weight: bold;
    font-size: 12px;
    font-weight: normal;
    line-height: 0.83;
    color: #999;
  }
  #header-mobile.container .navigation > div.on .mainmenu span {
    color: #ec0047;
  }
  #header-mobile.container .navigation > div.on .mainmenu img {
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #header-mobile.container .navigation > div.on .submenu {
    height: auto;
    padding-top: 36px;
    padding-bottom: 12px;
  }
  #header-mobile.container .navigation > div.off .mainmenu span {
    color: #b1b1b1;
  }
  #header-mobile.container .navigation > div.off .mainmenu span.link {
    background: url("https://dream-cdn.beusable.net/home/images/icon-link-popup-grey.svg") no-repeat 100% 50%;
  }
  #header-main-mobile.container {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    z-index: 20;
  }
  #header-main-mobile.container .top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 16px 15px 16px;
    z-index: 20;
  }
  #header-main-mobile.container .top.on {
    position: fixed;
    top: 0;
    width: calc(100% - 32px);
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(26px);
  }
  #header-main-mobile.container .top .home {
    height: 26px;
  }
  #header-main-mobile.container .top.on .home {
    display: none;
  }
  #header-main-mobile.container .top .logo {
    width: 98px;
    height: 17px;
    background: url("https://dream-cdn.beusable.net/home/images/logo-white.svg") no-repeat center center;
    background-size: contain;
  }
  #header-main-mobile.container .top.on .logo {
    display: block;
    background: url("https://dream-cdn.beusable.net/home/images/logo-main.svg") no-repeat center center;
    background-size: contain;
  }
  #header-main-mobile.container .top .title {
    font-family: NewRubrik;
    font-size: 18px;
    font-weight: bold;
    color: #ec0047;
  }
  #header-main-mobile.container .top.on .title {
    display: none;
  }
  #header-main-mobile.container .top .navigation-button svg {
    width: 24px;
    height: 24px;
    transition: all 0.5s ease;
  }
  #header-main-mobile.container .top .navigation-button svg path {
    stroke-linecap: square;
    stroke-linejoin: square;
    stroke-width: 2;
    stroke: #ec0047;
    transition: all 0.5s ease;
    transform-origin: 18px 13px;
  }
  #header-main-mobile.container .top.on .navigation-button path {
    stroke: #767676;
  }
  #header-main-mobile.container .top.on .navigation-button .d1 {
    transform: rotate(-45deg);
  }
  #header-main-mobile.container .top.on .navigation-button .d2 {
    transform-origin: 50% 50%;
    transform: scaleX(0);
  }
  #header-main-mobile.container .top.on .navigation-button .d3 {
    transform: rotate(45deg);
  }
  #header-main-mobile.container .navigation {
    position: fixed;
    top: 50px;
    width: 100%;
    height: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(26px);
    opacity: 0;
    overflow: hidden;
    transition: padding 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    z-index: 10;
  }
  #header-main-mobile.container .navigation.on {
    padding-top: 31px;
    min-height: 100vh;
    opacity: 1;
  }
  #header-main-mobile.container .navigation.on .mainmenu {
    display: flex;
  }
  #header-main-mobile.container .navigation.on .submenu .cell {
    display: flex;
  }
  #header-main-mobile.container .navigation > div {
    border-bottom: 1px solid #ebebeb;
    padding: 18px 20px 18px 26px;
  }
  #header-main-mobile.container .navigation > div .mainmenu {
    display: none;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
  }
  #header-main-mobile.container .navigation > div .mainmenu span {
    font-size: 16px;
    font-weight: bold;
    font-size: 18px;
    color: #2f2f2f;
  }
  #header-main-mobile.container .navigation > div .mainmenu span.link {
    padding-right: 20px;
    background: url("https://dream-cdn.beusable.net/home/images/logo-link-popup.svg") no-repeat 100% 50%;
  }
  #header-main-mobile.container .navigation > div .mainmenu img {
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #header-main-mobile.container .navigation > div .submenu {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    padding-left: 10px;
    height: 0;
    box-sizing: border-box;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #header-main-mobile.container .navigation > div .submenu .cell {
    display: none;
    align-items: center;
    column-gap: 5px;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    font-weight: 500;
    color: #2f2f2f;
    text-decoration: none;
  }
  #header-main-mobile.container .navigation > div .submenu .cell.disabled {
    color: #999;
    pointer-events: none;
  }
  #header-main-mobile.container .navigation > div .submenu .division {
    padding-top: 20px;
    border-top: dashed 1px #e3e3e3;
    font-size: 16px;
    font-weight: bold;
    font-size: 12px;
    font-weight: normal;
    line-height: 0.83;
    color: #999;
  }
  #header-main-mobile.container .navigation > div.on .mainmenu span {
    color: #ec0047;
  }
  #header-main-mobile.container .navigation > div.on .mainmenu img {
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #header-main-mobile.container .navigation > div.on .submenu {
    height: auto;
    padding-top: 36px;
    padding-bottom: 12px;
  }
  #header-main-mobile.container .navigation > div.off .mainmenu span {
    color: #b1b1b1;
  }
  #header-main-mobile.container .navigation > div.off .mainmenu span.link {
    background: url("https://dream-cdn.beusable.net/home/images/icon-link-popup-grey.svg") no-repeat 100% 50%;
  }
}
.navbar {
  flex-shrink: 0;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  position: fixed;
  z-index: 10;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(8px);
  max-width: 1206px;
  width: 100%;
  height: 78px;
  min-width: 1206px;
}
.navbar * {
  box-sizing: border-box;
}
.navbar, .navbar * {
  font-family: "Pretendard Variable", AppleSDGothicNeo, "Noto Sans KR", sans-serif;
}
.navbar.en .inner, .navbar.ja .inner {
  justify-content: space-between;
  gap: 0;
}
.navbar.en .button-container, .navbar.ja .button-container {
  margin-left: 0;
}
.navbar .inner {
  padding: 21px 21px 21px 39px;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 68px;
}
.navbar .logo {
  width: 112px;
  height: 20px;
  background: url(https://dream-cdn.beusable.net/home/images/logo-main.svg) no-repeat center center;
  background-size: contain;
}

.button-container {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  margin-left: auto;
}
.button-container .button {
  border-radius: 50em;
  color: #fff;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.15px;
  padding: 8px 16px;
  cursor: pointer;
  text-decoration: none;
}
.button-container .signin {
  font-weight: 500;
  border: 1px solid rgba(255, 255, 255, 0.05);
  background: rgba(255, 255, 255, 0.1);
}
.button-container .start {
  font-weight: 700;
  background: #ec0047;
}

.link-container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
}
.link-container.ja {
  gap: 27px;
}
.link-container.en {
  gap: 5px;
}
.link-container .link {
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.15px;
  cursor: pointer;
  padding: 6px 12px;
  text-decoration: none;
}
.link-container .link:hover {
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.16);
}

.contactus-button {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 90px;
  height: 90px;
  border-radius: 100%;
  z-index: 999;
  cursor: pointer;
}

#footer.container {
  width: 100%;
  min-width: 1280px;
  margin-top: 100px;
}
#footer.container * {
  box-sizing: border-box;
}
#footer.container.geo-footer {
  position: relative;
  margin-top: 0;
}
#footer.container .box1 {
  display: flex;
  justify-content: center;
  width: 100%;
  background-color: #f6e136;
}
#footer.container .box1 .contents {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#footer.container .box1 .contents > div {
  margin-top: 80px;
  font-size: 40px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.13;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
#footer.container .box1 .contents > div.en {
  letter-spacing: -0.8px;
}
#footer.container .box1 .contents .desc {
  margin-top: 10px;
  color: #222;
  text-align: center;
  font-size: 20px;
  font-weight: 500;
  line-height: 37px; /* 185% */
  letter-spacing: -0.5px;
}
#footer.container .box1 .contents .desc.realtime-desc {
  font-size: 26px;
  margin-top: 12px;
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  font-weight: 600;
  line-height: 150%;
}
#footer.container .box1 .contents > a {
  margin-top: 28px;
  padding: 18px 44px;
  border-radius: 27px;
  background-color: #ec0047;
  font-size: 20px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.9;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#footer.container .box1 .contents > a:hover {
  filter: brightness(0.84);
}
#footer.container .box1 .contents > img {
  margin-top: 32px;
  position: relative;
  bottom: -9px;
  left: -17px;
  width: 524px;
  min-height: 228px;
}
#footer.container .box1 .contents > img.realtime-image {
  width: 500px;
  height: 213px;
  margin-left: 23px;
  margin-top: 13px;
}
#footer.container .box1.scroll .title {
  margin-top: 76px;
}
#footer.container .box1.scroll .footer-btn {
  margin-top: 38px;
}
#footer.container .box1.scroll .footer-image {
  bottom: -1px;
  left: auto;
  width: auto;
  min-height: auto;
}
#footer.container .box2 {
  display: flex;
  justify-content: center;
  width: 100%;
  background-color: #000;
}
#footer.container .box2 .division {
  width: 100%;
  height: 1px;
  background-color: #2F2F2F;
}
#footer.container .box2 .contents {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 20px;
  width: 100%;
  max-width: 1244px;
  margin-top: 80px;
  margin-bottom: 80px;
}
#footer.container .box2 .contents .footer-box {
  display: flex;
  gap: 81px;
  padding: 36px 0;
}
#footer.container .box2 .contents .top {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
#footer.container .box2 .contents .top__left {
  display: flex;
  gap: 17px;
  align-items: flex-start;
  flex-direction: column;
}
#footer.container .box2 .contents .top .logo {
  transform: translateY(-2px);
  height: 18px;
}
#footer.container .box2 .contents .top .description {
  width: 380px;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: normal;
  color: #999;
}
#footer.container .box2 .contents .top .language {
  display: flex;
  flex-direction: column;
  color: #CCC;
  gap: 12px;
  font-size: 12px;
  font-weight: 600;
  line-height: 100%;
}
#footer.container .box2 .contents .top .language ul {
  display: flex;
  column-gap: 10px;
}
#footer.container .box2 .contents .top .language ul li {
  position: relative;
  height: 26px;
  border-radius: 13px;
  background-color: #fff;
  cursor: pointer;
}
#footer.container .box2 .contents .top .language ul li.select::after {
  position: absolute;
  top: 28px;
  left: 7px;
  display: block;
  content: " ";
  width: 12px;
  height: 12px;
  background: url(https://dream-cdn.beusable.net/home/images/icon-arrow-red.svg) transparent;
  transition: all 0.3s ease;
}
#footer.container .box2 .contents .navigation {
  display: flex;
  column-gap: 81px;
}
#footer.container .box2 .contents .navigation .cell {
  min-width: 123px;
}
#footer.container .box2 .contents .navigation .cell .category {
  font-size: 15px;
  font-weight: 600;
  line-height: 23px;
  color: #ec0047;
}
#footer.container .box2 .contents .navigation .cell .item {
  display: grid;
  grid-template-rows: repeat(6, 1fr);
  grid-auto-flow: column;
  margin-top: 22px;
}
#footer.container .box2 .contents .navigation .cell .item a {
  color: #B1B1B1;
  font-size: 13px;
  font-weight: 400;
  line-height: 34px;
}
#footer.container .box2 .contents .info {
  padding-top: 24px;
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 30px;
  width: 100%;
}
#footer.container .box2 .contents .info .sns-icons {
  position: absolute;
  display: flex;
  align-items: center;
  column-gap: 10px;
  top: -9px;
  right: 0px;
}
#footer.container .box2 .contents .info .sns-icons a {
  width: 32px;
  height: 32px;
}
#footer.container .box2 .contents .info .sns-icons a img {
  width: 100%;
  height: 100%;
}
#footer.container .box2 .contents .info .link-box {
  display: flex;
  column-gap: 35px;
}
#footer.container .box2 .contents .info .link-box a {
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #999;
}
#footer.container .box2 .contents .info span {
  color: #999;
  font-size: 13px;
  font-weight: 400;
  line-height: 23px;
}
#footer.container .box2 .contents .info .copyright {
  font-weight: 500;
  line-height: 21px;
}

@media all and (max-width: 768px) {
  #footer.container {
    width: 100%;
    min-width: auto;
    margin-top: 0px;
  }
  #footer.container.geo-footer {
    position: relative;
    margin-top: 0;
  }
  #footer.container .box1 {
    display: flex;
    justify-content: center;
    width: 100%;
    background-color: #f6e136;
  }
  #footer.container .box1 .contents {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #footer.container .box1 .contents > div {
    margin-top: 40px;
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.28;
    letter-spacing: normal;
    text-align: center;
    color: #292929;
  }
  #footer.container .box1 .contents > div.realtime-title {
    font-size: 22px;
    line-height: 150%;
  }
  #footer.container .box1 .contents .desc {
    margin-top: 12px;
    color: #444;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
  }
  #footer.container .box1 .contents .desc.realtime-desc {
    font-size: 18px;
    color: #292929;
    font-weight: 600;
    line-height: 150%;
  }
  #footer.container .box1 .contents > a {
    margin-top: 18px;
    padding: 11px 30px;
    border-radius: 25px;
    background-color: #ec0047;
    font-size: 15px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #fff;
  }
  #footer.container .box1 .contents > img {
    margin-top: 32px;
    position: relative;
    bottom: -4px;
    left: 0px;
    width: 262px;
    min-height: 114px;
  }
  #footer.container .box1 .contents > img.realtime-image {
    margin-top: 19px;
    width: 250px;
    height: 107px;
  }
  #footer.container .box1.scroll .title {
    margin-top: 30px;
  }
  #footer.container .box1.scroll .footer-btn {
    margin-top: 30px;
  }
  #footer.container .box1.scroll .footer-image {
    width: 250px;
    margin-top: 11px;
  }
  #footer.container .box2 {
    display: flex;
    justify-content: center;
    width: 100%;
  }
  #footer.container .box2 .contents {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-top: 80px;
    margin-bottom: 80px;
  }
  #footer.container .box2 .contents .footer-box {
    flex-direction: column;
    width: 100%;
    gap: 44px;
  }
  #footer.container .box2 .contents .division {
    width: 100%;
    height: 1px;
    background-color: #333;
  }
  #footer.container .box2 .contents .top {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  #footer.container .box2 .contents .top__left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  #footer.container .box2 .contents .top .logo {
    height: 17px;
  }
  #footer.container .box2 .contents .top .description {
    width: auto;
    color: #999;
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
  }
  #footer.container .box2 .contents .top .language {
    display: flex;
    flex-direction: column;
  }
  #footer.container .box2 .contents .navigation {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 20px;
    row-gap: 40px;
    width: 100%;
  }
  #footer.container .box2 .contents .info .sns-icons {
    position: absolute;
    display: flex;
    align-items: center;
    column-gap: 10px;
    top: -9px;
    right: 0px;
  }
  #footer.container .box2 .contents .info .sns-icons a {
    width: 32px;
    height: 32px;
  }
  #footer.container .box2 .contents .info .sns-icons a img {
    width: 100%;
    height: 100%;
  }
  #footer.container .box2 .contents .info .link-box {
    display: flex;
    flex-direction: column;
    row-gap: 18px;
    column-gap: 0px;
  }
  #footer.container .box2 .contents .info .link-box a {
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #999;
  }
  #footer.container .box2 .contents .info span {
    text-align: center;
  }
}
#lnb.container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 1280px;
  height: 72px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  letter-spacing: normal;
}
#lnb.container .sub-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 72px;
  background-color: white;
  z-index: 15;
}
#lnb.container .sub-container .contents {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 1280px;
}
#lnb.container .sub-container .contents .title {
  margin-left: 55px;
  font-family: NewRubrik;
  font-size: 20px;
  font-weight: bold;
  line-height: 0.9;
  text-decoration: none;
  color: #ec0047;
}
#lnb.container .sub-container .contents .navigation {
  display: flex;
  align-items: center;
  column-gap: 15px;
  margin-right: 83.5px;
}
#lnb.container .sub-container .contents .navigation .division {
  width: 1px;
  height: 16px;
  background-color: #d1d1d1;
}
#lnb.container .sub-container .contents .navigation .menu {
  position: relative;
  padding: 10px 0px;
}
#lnb.container .sub-container .contents .navigation .menu .mainmenu {
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: normal;
  color: #333;
  cursor: pointer;
}
#lnb.container .sub-container .contents .navigation .menu.hassub .mainmenu {
  position: relative;
  display: flex;
  align-items: center;
  column-gap: 6px;
  padding: 4px 10px 4px 4px;
  border: solid 1px #d1d1d1;
  border-radius: 5px;
}
#lnb.container .sub-container .contents .navigation .menu.hassub .mainmenu:hover img {
  background-color: rgba(0, 0, 0, 0.06);
}
#lnb.container .sub-container .contents .navigation .menu.hassub .mainmenu.selected {
  border: solid 1px #ec0047;
  color: #ec0047;
}
#lnb.container .sub-container .contents .navigation .menu.notsub .mainmenu {
  padding: 3px;
  border-radius: 2px;
}
#lnb.container .sub-container .contents .navigation .menu.notsub .mainmenu:hover {
  background-color: rgba(0, 0, 0, 0.06);
}
#lnb.container .sub-container .contents .navigation .menu.notsub .mainmenu.selected {
  color: #ec0047;
}
#lnb.container .sub-container .contents .navigation .menu .submenu {
  position: absolute;
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  right: 2px;
  top: 45px;
  box-sizing: border-box;
  width: 230px;
  height: 0px;
  border-radius: 8px;
  background-color: #fff;
  overflow: hidden;
  z-index: 10;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#lnb.container .sub-container .contents .navigation .menu .submenu .cell {
  box-sizing: border-box;
  width: 200px;
  border-radius: 4px;
  padding: 6px 10px;
  background-color: white;
  font-size: 14px;
  color: #444;
  cursor: pointer;
  text-decoration: none;
}
#lnb.container .sub-container .contents .navigation .menu .submenu .cell:hover {
  background-color: rgba(0, 0, 0, 0.08);
}
#lnb.container .sub-container .contents .navigation .menu .submenu .cell.selected {
  color: rgb(236, 0, 71);
}
#lnb.container .sub-container .contents .navigation .menu .submenu .cell.dashboard, #lnb.container .sub-container .contents .navigation .menu .submenu .cell.realtime, #lnb.container .sub-container .contents .navigation .menu .submenu .cell.scroll {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#lnb.container .sub-container .contents .navigation .menu:hover .submenu {
  height: auto;
  padding: 17px 15px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
}
#lnb.container.geo-lnb {
  position: fixed;
  top: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease, box-shadow 0.3s ease;
  z-index: 999;
  width: 100%;
}
#lnb.container.geo-lnb .sub-container .contents {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 1280px;
}
#lnb.container.geo-lnb .sub-container .contents .title {
  color: #EC0047;
  font-family: NewRubrik;
  font-size: 24px;
  font-weight: 700;
  line-height: 18px; /* 75% */
}
#lnb.container.geo-lnb .sub-container .contents .navigation .menu {
  display: flex;
  align-items: center;
  gap: 57px;
}
#lnb.container.geo-lnb .sub-container .contents .navigation .menu a {
  color: #2F2F2F;
  font-family: "Pretendard Variable";
  font-size: 16px;
  font-weight: 700;
  line-height: 100%; /* 16px */
  transition: color 0.3s ease;
}
#lnb.container.geo-lnb .sub-container .contents .navigation .menu a:hover {
  color: #EC0047;
}
#lnb.container.geo-lnb .sub-container .contents .navigation .menu a.active {
  color: #EC0047;
}
#lnb.container.geo-lnb.scroll {
  opacity: 1;
  pointer-events: auto;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.07);
  min-width: 1170px;
}
#lnb.container.geo-lnb.scroll .sub-container {
  position: relative;
  top: 0;
}
#lnb.container.scroll .sub-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.07);
}

@media all and (max-width: 768px) {
  #lnb.container {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 320px;
    height: 56px;
    border-bottom: none;
  }
  #lnb.container .sub-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 56px;
  }
  #lnb.container .sub-container .contents {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  #lnb.container .sub-container .contents .title {
    margin-left: 16px;
    font-family: NewRubrik;
    font-size: 18px;
    font-weight: bold;
    line-height: 0.9;
    letter-spacing: -0.3px;
    text-decoration: none;
    color: #ec0047;
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #lnb.container .sub-container .contents .navigation {
    display: flex;
    align-items: center;
    column-gap: 15px;
    margin-right: 15px;
  }
  #lnb.container .sub-container .contents .navigation .division {
    width: 1px;
    height: 16px;
    background-color: #d1d1d1;
  }
  #lnb.container .sub-container .contents .navigation-select {
    position: relative;
    display: block;
    max-width: calc(100vw - 280px);
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 24px;
    border: 0px;
    font-family: inherit;
    font-size: 14px;
    color: #333;
    text-align: end;
    background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 98% 50%;
  }
  #lnb.container .sub-container .contents .navigation-select select {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    max-width: calc(100vw - 240px);
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 24px;
    border: 0px;
    opacity: 0;
    font-family: inherit;
    font-size: 14px;
    color: #333;
    text-align: end;
    background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 98% 50%;
    appearance: none;
  }
  #lnb.container .sub-container .contents .navigation-select select:focus {
    outline: none;
  }
  #lnb.container .sub-container .contents .navigation .menu {
    min-width: 65px;
  }
  #lnb.container .sub-container .contents .navigation .menu .mainmenu {
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.14;
    letter-spacing: normal;
    color: #333;
    cursor: pointer;
  }
  #lnb.container .sub-container .contents .navigation .menu.hassub {
    display: none;
  }
  #lnb.container.geo-lnb {
    top: 0;
    z-index: 9;
  }
  #lnb.container.geo-lnb .sub-container .contents {
    max-width: 1170px;
    justify-content: center;
  }
  #lnb.container.geo-lnb .sub-container .contents .title {
    margin-left: 34px;
    color: #EC0047;
    font-family: New Rubrik;
    font-size: 24px;
    font-weight: 700;
    line-height: 18px; /* 75% */
  }
  #lnb.container.geo-lnb .sub-container .contents .navigation {
    margin: 0 auto;
  }
  #lnb.container.geo-lnb .sub-container .contents .navigation .menu {
    display: flex;
    align-items: center;
    gap: 38px;
    padding: 10px 16px;
    width: 100%;
    justify-content: space-between;
  }
  #lnb.container.geo-lnb .sub-container .contents .navigation .menu.en {
    gap: 32px;
  }
  #lnb.container.geo-lnb .sub-container .contents .navigation .menu.ja {
    gap: 19px;
  }
  #lnb.container.geo-lnb .sub-container .contents .navigation .menu a {
    color: #0E0E0E;
    font-size: 12px;
    font-weight: 600;
    line-height: 150%; /* 18px */
    letter-spacing: -0.132px;
    transition: color 0.3s ease;
  }
  #lnb.container.geo-lnb .sub-container .contents .navigation .menu a.active {
    color: #EC0047;
  }
  #lnb.container.geo-lnb.scroll {
    min-width: initial;
  }
  #lnb.container.geo-lnb.scroll .sub-container {
    box-shadow: none;
    border-top: 1px solid #E2E2E2;
    position: relative;
    top: 0;
  }
  #lnb.container.scroll .sub-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.07);
  }
  #lnb.container.scroll .sub-container .title {
    opacity: 1;
  }
}
#journey-index.container {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 1280px;
}
#journey-index.container .contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 1280px;
  overflow: hidden;
}
#journey-index.container .contents > .title {
  margin-top: 90px;
  min-height: 83px;
  font-family: NewRubrik;
  font-size: 90px;
  font-weight: bold;
  font-stretch: normal;
  font-style: italic;
  line-height: 0.98;
  letter-spacing: -1.53px;
  text-align: center;
  color: #ec0047;
}
#journey-index.container .contents h2 {
  margin-top: 31px;
  color: #222;
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  line-height: 42px; /* 140% */
}
#journey-index.container .contents h2.en {
  letter-spacing: -1px;
}
#journey-index.container .contents .desc {
  color: #444;
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: 42px; /* 161.538% */
}
#journey-index.container .contents .desc2 {
  color: #444;
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: 42px; /* 161.538% */
}
#journey-index.container .contents .main-image {
  width: 706px;
  min-height: 412px;
}
#journey-index.container .contents .analyze-button {
  display: flex;
  align-items: center;
  column-gap: 12px;
  margin-top: 30px;
  padding: 13px 19px 13px 32px;
  border: solid 2px #ec0047;
  border-radius: 34px;
  box-shadow: 0 20px 18px -16px rgba(0, 0, 0, 0.25);
  background-color: #fff;
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #ec0047;
  text-decoration: none;
  cursor: pointer;
}
#journey-index.container .contents .analyze-button img {
  height: 35px;
}
#journey-index.container .contents .analyze-button:hover {
  filter: brightness(0.9);
}
#journey-index.container .contents .icon-journey-1 {
  width: 873px;
  height: 389px;
  margin-top: 60px;
}
#journey-index.container .contents .features {
  display: flex;
  flex-direction: column;
  row-gap: 160px;
  align-items: center;
  margin-top: 248px;
}
#journey-index.container .contents .features .item {
  display: grid;
  grid-template-columns: 740px 370px;
  justify-content: start;
  column-gap: 60px;
  width: 1170px;
}
#journey-index.container .contents .features .item .icon-journey-2.only-mobile {
  width: 335px;
  height: 208px;
}
#journey-index.container .contents .features .item.reverse {
  grid-template-columns: 470px 740px;
}
#journey-index.container .contents .features .item.reverse .title {
  width: 100%;
}
#journey-index.container .contents .features .item.reverse .icon-journey-3 {
  width: 740px;
  height: 363px;
}
#journey-index.container .contents .features .item__image {
  width: 100%;
}
#journey-index.container .contents .features .item__writing {
  width: 100%;
  margin-top: 45px;
}
#journey-index.container .contents .features .item__writing .title {
  width: 370px;
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
#journey-index.container .contents .features .item__writing .title.mobile {
  display: none;
}
#journey-index.container .contents .features .item__writing .title.en {
  letter-spacing: -2px;
}
#journey-index.container .contents .features .item__writing .sub {
  margin-top: 10px;
  color: #444;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  word-break: break-word;
  white-space: normal;
}
#journey-index.container .contents .features .item__writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
#journey-index.container .contents .features .item__writing .description {
  margin-top: 25px;
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  color: #444;
}
#journey-index.container .contents .features .item__writing .description.en {
  letter-spacing: -0.6px;
}
#journey-index.container .contents .features .item__writing .description.ja {
  letter-spacing: normal;
}
#journey-index.container .contents .features-link-wrapper {
  margin-top: 228px;
  margin-bottom: 90px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 128px;
}
#journey-index.container .contents .features-link-wrapper h2 {
  color: #222;
  text-align: center;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
#journey-index.container .contents .features-link-wrapper .items-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  max-width: 810px; /* 390px * 2 + 30px (gap) */
  margin: 0 auto; /* 중앙 정렬 */
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item {
  flex: 0 0 390px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  width: 390px;
  height: 412px;
  border-radius: 10px;
  background: #FFF;
  box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.27), 0px 3px 9px 0px rgba(0, 0, 0, 0.14);
  transition: all 0.3s;
  cursor: pointer;
  box-sizing: border-box;
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item:hover {
  background-color: rgba(0, 0, 0, 0.06);
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item:active {
  border-radius: 10px;
  border: 3px solid #EC0047;
  box-sizing: border-box;
  background: #FFF;
  box-shadow: 0px 22px 33px -7px rgba(0, 0, 0, 0.14), 0px 3px 9px 0px rgba(0, 0, 0, 0.14);
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-benchmark {
  width: 370px;
  height: 180px;
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-aireport {
  width: 168px;
  height: 172px;
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-target {
  width: 370px;
  height: 180px;
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-core {
  width: 370px;
  height: 180px;
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-survey {
  width: 163px;
  height: 142px;
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-mpti {
  width: 198px;
  height: 137px;
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item .item-title {
  margin-top: 10px;
  color: #2F2F2F;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
#journey-index.container .contents .features-link-wrapper .items-wrap .item .item-desc {
  text-align: center;
  color: #666;
  font-size: 15px;
  font-weight: 400;
  line-height: 23px; /* 153.333% */
}
#journey-index.container .contents .purpose-wrap {
  margin-top: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  width: 100%;
}
#journey-index.container .contents .purpose-wrap .purpose-title {
  color: #2F2F2F;
  text-align: center;
  font-size: 52px;
  font-weight: 600;
  line-height: 65px; /* 125% */
}
#journey-index.container .contents .purpose-wrap .purpose-title .highlight {
  position: relative;
}
#journey-index.container .contents .purpose-wrap .purpose-title .highlight .underline {
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 100%;
}
#journey-index.container .contents .purpose-wrap .pricing-button {
  display: flex;
  align-items: center;
  column-gap: 12px;
  margin-top: 26px;
  padding: 13px 19px 13px 32px;
  border: solid 2px #ec0047;
  border-radius: 34px;
  box-shadow: 0 20px 18px -16px rgba(0, 0, 0, 0.25);
  background-color: #fff;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  color: #ec0047;
  text-decoration: none;
  cursor: pointer;
}
#journey-index.container .contents .purpose-wrap .pricing-button img {
  height: 35px;
}
#journey-index.container .contents .purpose-wrap .pricing-button:hover {
  filter: brightness(0.9);
}
#journey-index.container .contents .purpose-wrap .purpose-item-wrap {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 30px;
  margin-top: 32px;
}
#journey-index.container .contents .purpose-wrap .purpose-item-wrap .tab {
  width: 270px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
  padding: 25px;
  border: solid 3px #fff;
  border-radius: 7px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.14), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  cursor: pointer;
  transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#journey-index.container .contents .purpose-wrap .purpose-item-wrap .tab:hover {
  box-shadow: 0 22px 33px -7px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.1);
}
#journey-index.container .contents .purpose-wrap .purpose-item-wrap .tab.on {
  border: solid 3px #ec0047;
  box-shadow: 0 22px 33px -7px rgba(0, 0, 0, 0.15);
}
#journey-index.container .contents .purpose-wrap .purpose-item-wrap .tab.on::after {
  content: "";
  position: absolute;
  bottom: -34px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/why/tab-select.svg") no-repeat center center;
}
#journey-index.container .contents .purpose-wrap .purpose-item-wrap .tab__title {
  color: #2F2F2F;
  font-size: 20px;
  font-weight: 700;
  line-height: 30px; /* 150% */
  margin-bottom: 15px;
}
#journey-index.container .contents .purpose-wrap .purpose-item-wrap .tab__desc {
  color: #444;
  font-size: 13px;
  font-weight: 600;
  line-height: 23px; /* 164.286% */
}
#journey-index.container .contents .purpose-wrap .purpose-item-wrap .tab__image {
  position: absolute;
  width: 60px;
  height: 60px;
  right: 10px;
  bottom: 18px;
}
#journey-index.container .contents .purpose-wrap .purpose-contents {
  margin-bottom: 160px;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
#journey-index.container .contents .purpose-wrap .purpose-contents {
  display: flex;
  flex-direction: column;
  row-gap: 30px;
  box-sizing: border-box;
  padding: 30px;
  width: 1170px;
  border-radius: 7px;
  box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.1), 0 0 1px 0 rgba(0, 0, 0, 0.35);
  background-color: #fff;
}
#journey-index.container .contents .purpose-wrap .purpose-contents.fadein {
  animation: fadeIn 0.5s cubic-bezier(0, 0, 0.2, 1);
  animation-fill-mode: forwards;
}
#journey-index.container .contents .purpose-wrap .purpose-contents:not(.ecommerce) {
  display: none;
  padding: 52px 50px;
  box-sizing: border-box;
}
#journey-index.container .contents .purpose-wrap .purpose-contents:not(.ecommerce) .item ul {
  margin: 0;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .division {
  height: 1px;
  background-color: rgba(0, 0, 0, 0.1);
  margin-top: 11px;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item {
  display: flex;
  flex-direction: column;
  row-gap: 34px;
  position: relative;
  box-sizing: border-box;
  width: 100%;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item ul {
  display: flex;
  flex-direction: column;
  row-gap: 15px;
  padding-left: 20px;
  margin-top: 22px;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item ul li {
  display: flex;
  align-items: flex-start;
  column-gap: 10px;
  padding-right: 250px;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item ul li span {
  color: #444;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px; /* 140% */
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content {
  gap: 30px;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content h3 {
  text-align: center;
  color: #2F2F2F;
  font-size: 25px;
  font-weight: 700;
  line-height: 30px; /* 120% */
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content ul {
  display: flex;
  flex-direction: row;
  gap: 30px;
  margin: 0;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content ul .content-item {
  flex: 1;
  border-radius: 7px;
  background: #FFF;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 2px 4px 0px rgba(0, 0, 0, 0.14);
  padding: 23px;
  position: relative;
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.3s;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content ul .content-item:hover {
  background-color: rgba(0, 0, 0, 0.06);
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content ul .content-item > a {
  display: flex;
  flex-direction: column;
  gap: 47px;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content ul .content-item > a span {
  width: 350px;
  color: #2F2F2F;
  font-family: "Apple SD Gothic Neo";
  font-size: 20px;
  font-weight: 700;
  line-height: 30px; /* 150% */
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content ul .content-item > a span.author {
  color: #EC0047;
  font-family: "Apple SD Gothic Neo";
  font-size: 15px;
  font-weight: 700;
  margin-top: 0;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content ul .content-item > a img {
  position: absolute;
  right: 20px;
  bottom: 31px;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content ul .content-item > a img.icon-ecommerce {
  width: 126px;
  height: 116px;
}
#journey-index.container .contents .purpose-wrap .purpose-contents .item.content ul .content-item > a img.icon-ecommerce2 {
  right: 40px;
  bottom: 36px;
  width: 85px;
  height: 95px;
}
#journey-index.container .contents .banner {
  width: 1206px;
  background-image: url("https://dream-cdn.beusable.net/home/images/journey/renewal/icon-banner-bg.svg");
  background-repeat: no-repeat;
  box-shadow: 0px 17px 18px rgba(0, 0, 0, 0.14), 0px 0px 1px rgba(0, 0, 0, 0.62);
  border-radius: 22px;
  padding-bottom: 60px;
  margin-bottom: 230px;
  position: relative;
}
#journey-index.container .contents .banner .icon-logo {
  position: absolute;
  top: 28px;
  left: 28px;
  width: 99px;
  height: 18px;
}
#journey-index.container .contents .banner .banner-text {
  display: flex;
  flex-direction: column;
  gap: 13px;
  margin-top: 95px;
  margin-left: 60px;
}
#journey-index.container .contents .banner .banner-text .title {
  font-family: NanumSquareRound;
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.131px;
  color: #fff;
}
#journey-index.container .contents .banner .banner-text .sub {
  margin-top: 0;
  text-align: left;
  color: #fff;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  font-family: NanumSquareRound;
  font-size: 45px;
  font-weight: 800;
  line-height: 130%; /* 58.5px */
  letter-spacing: -0.225px;
}
#journey-index.container .contents .banner .banner-text .sub.en {
  font-size: 36px;
  letter-spacing: -1px;
}
#journey-index.container .contents .banner .banner-text .sub.ja {
  font-size: 40px;
}
#journey-index.container .contents .banner .icon-banner {
  position: absolute;
  top: 68px;
  right: 69px;
  width: 272px;
  height: 195px;
}

@media all and (max-width: 768px) {
  #journey-index.container {
    display: flex;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-width: 0px;
  }
  #journey-index.container .contents {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #journey-index.container .contents .title {
    margin-top: 35px;
    min-height: 50px;
    width: 335px;
  }
  #journey-index.container .contents h2 {
    margin-top: 20px;
    padding: 0px 25px;
    color: #333;
    font-size: 20px;
    line-height: 26px; /* 130% */
  }
  #journey-index.container .contents h2.ja {
    letter-spacing: -1px;
  }
  #journey-index.container .contents .desc {
    margin-top: 15px;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    padding: 0 10px;
  }
  #journey-index.container .contents .desc2 {
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    padding: 0 10px;
  }
  #journey-index.container .contents .analyze-button {
    display: flex;
    align-items: center;
    column-gap: 8px;
    margin-top: 52px;
    padding: 13px 18px;
    border: solid 2.5px #ec0047;
    border-radius: 34px;
    box-shadow: 0 20px 18px -16px rgba(0, 0, 0, 0.25);
    background-color: #fff;
    font-size: 15px;
    font-weight: 800;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: -0.34px;
    text-align: center;
    color: #ec0047;
    cursor: pointer;
  }
  #journey-index.container .contents .analyze-button img {
    height: 20px;
  }
  #journey-index.container .contents .icon-journey-1 {
    width: 335px;
    height: 208px;
    background-repeat: no-repeat;
    background-size: 335px;
    margin-top: 52px;
  }
  #journey-index.container .contents .features {
    display: flex;
    flex-direction: column;
    row-gap: 80px;
    align-items: center;
    width: 100%;
    margin-top: 120px;
    padding: 0 20px;
  }
  #journey-index.container .contents .features .item {
    width: 335px;
    display: grid;
    grid-template-columns: 100%;
    justify-content: center;
    row-gap: 20px;
  }
  #journey-index.container .contents .features .item.reverse {
    grid-template-columns: 100%;
  }
  #journey-index.container .contents .features .item.reverse .icon-journey-3 {
    width: 335px;
    height: 208px;
    background-size: 335px;
    background-repeat: no-repeat;
  }
  #journey-index.container .contents .features .item__image {
    width: 100%;
  }
  #journey-index.container .contents .features .item__writing {
    width: 100%;
    margin-top: 0;
    order: -1;
  }
  #journey-index.container .contents .features .item__writing .title {
    width: 335px;
    margin-top: 0;
    color: #333;
    font-size: 22px;
    line-height: 30px; /* 136.364% */
    text-align: left;
    word-break: break-word;
    letter-spacing: normal;
  }
  #journey-index.container .contents .features .item__writing .title.en, #journey-index.container .contents .features .item__writing .title.ja {
    word-break: break-word;
    white-space: normal;
    letter-spacing: -0.7px;
  }
  #journey-index.container .contents .features .item__writing .description {
    color: rgba(51, 51, 51, 0.8);
    font-size: 14px;
    line-height: 22px; /* 157.143% */
    word-break: break-word;
  }
  #journey-index.container .contents .features .item__writing .description.ja {
    letter-spacing: -0.6px;
  }
  #journey-index.container .contents .features-link-wrapper {
    margin-top: 80px;
    gap: 60px;
    padding: 0 20px;
  }
  #journey-index.container .contents .features-link-wrapper .features-link-title {
    font-size: 22px;
    line-height: 30px; /* 136.364% */
    padding: 0;
    letter-spacing: normal;
    width: 335px;
    word-break: break-all;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 30px;
    max-width: 810px; /* 390px * 2 + 30px (gap) */
    margin: 0 auto; /* 중앙 정렬 */
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item {
    flex: 0 0 335px;
    gap: 20px;
    width: 335px;
    height: 337px;
    border-radius: 10px;
    background: #FFF;
    box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.27), 0px 3px 9px 0px rgba(0, 0, 0, 0.14);
    transition: all 0.3s;
    cursor: pointer;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item:hover {
    background-color: rgba(0, 0, 0, 0.06);
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-benchmark {
    width: 215px;
    height: 119px;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-aireport {
    width: 127px;
    height: 130px;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-target {
    width: 216px;
    height: 109px;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-core {
    width: 237px;
    height: 101px;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-survey {
    width: 124px;
    height: 107px;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .icon-mpti {
    width: 150px;
    height: 104px;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .item-title {
    margin-top: 17px;
    color: #333;
    font-size: 20px;
    line-height: 26px;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .item-desc {
    width: 295px;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .item-desc.en {
    letter-spacing: -0.6px;
  }
  #journey-index.container .contents .features-link-wrapper .items-wrap .item .item-desc.ja {
    letter-spacing: -0.6px;
  }
  #journey-index.container .contents .purpose-wrap {
    display: none;
  }
  #journey-index.container .contents .purpose-wrap--mobile {
    width: 100%;
    margin-bottom: 80px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-title-wrapper {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: center;
    padding: 54px 20px 40px;
    background: #EEE;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-title {
    text-align: center;
    color: #333;
    font-size: 22px;
    font-weight: 700;
    line-height: 30px; /* 136.364% */
    letter-spacing: -0.541px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-title .highlight {
    position: relative;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-title .highlight .underline {
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 100%;
  }
  #journey-index.container .contents .purpose-wrap--mobile .pricing-button {
    max-width: 157px;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
    box-sizing: border-box;
    padding: 13px 18px;
    border: solid 2.5px #ec0047;
    border-radius: 34px;
    box-shadow: 0 20px 18px -16px rgba(0, 0, 0, 0.25);
    background-color: #fff;
    color: #EC0047;
    text-align: center;
    font-size: 14px;
    font-weight: 800;
    line-height: 14px; /* 93.333% */
    letter-spacing: -0.341px;
    text-decoration: none;
    cursor: pointer;
  }
  #journey-index.container .contents .purpose-wrap--mobile .pricing-button img {
    height: 20px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .pricing-button:hover {
    filter: brightness(0.9);
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab {
    position: relative;
    border-top: 1px solid #64708f;
    padding: 25px 16px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab:first-child {
    padding-bottom: 0;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab:last-child {
    border-bottom: 1px solid #64708f;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__title {
    font-size: 19px;
    font-weight: 600;
    line-height: 26px;
    color: #333;
    padding-right: 20px;
    cursor: pointer;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__title.ko {
    width: 290px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__desc {
    margin-top: 12px;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.83;
    color: #4d4d4d;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__arrow {
    position: absolute;
    right: 16px;
    top: 25px;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    cursor: pointer;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__arrow.show {
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide {
    max-height: 0px;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide.show {
    max-height: 1045px;
    padding-bottom: 20px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    row-gap: 27px;
    background-color: #fff;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item {
    color: #444;
    font-size: 12px;
    font-weight: 500;
    line-height: 19px; /* 158.333% */
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul {
    display: flex;
    flex-direction: column;
    gap: 17px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li {
    display: flex;
    align-items: flex-start;
    gap: 6px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li .icon-plan-check {
    width: 15px;
    height: 15px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content .item__title h3 {
    color: #333;
    font-size: 18px;
    font-weight: 700;
    line-height: 26px; /* 144.444% */
    text-align: center;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content .item__title h3.en {
    letter-spacing: -1.3px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content ul {
    width: 335px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin: 0;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content ul .content-item {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex: 1;
    border-radius: 7px;
    background: #FFF;
    box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 2px 4px 0px rgba(0, 0, 0, 0.14);
    padding: 23px;
    box-sizing: border-box;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content ul .content-item > a {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 20px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content ul .content-item > a span {
    width: 295px;
    color: #333;
    text-align: center;
    font-size: 19px;
    font-weight: 600;
    line-height: 26px; /* 136.842% */
    letter-spacing: -1px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content ul .content-item > a span.author {
    color: #EC0047;
    text-align: center;
    font-size: 15px;
    font-weight: 700;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content ul .content-item > a img {
    margin-top: 10px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content ul .content-item > a img.icon-ecommerce {
    width: 126px;
    height: 116px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item.content ul .content-item > a img.icon-ecommerce2 {
    width: 85px;
    height: 95px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .division {
    height: 1px;
    background-color: rgba(0, 0, 0, 0.1);
    margin-bottom: 6px;
  }
  #journey-index.container .contents .purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents__btn {
    padding: 13px 34px;
    border-radius: 22px;
    background-color: #ec0047;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    color: #fff;
  }
  #journey-index.container .contents .banner {
    width: 355px;
    min-height: 238px;
    background-image: linear-gradient(42deg, #9257FF -1.06%, #803BFF 91.2%);
    margin-bottom: 20px;
    padding: 25px;
    box-sizing: border-box;
  }
  #journey-index.container .contents .banner a {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  #journey-index.container .contents .banner a img {
    position: static;
    width: 99px;
    height: 18px;
  }
  #journey-index.container .contents .banner a img.arrow {
    position: static;
    width: 26px;
    height: 26px;
    object-fit: contain;
    margin-top: 15px;
  }
  #journey-index.container .contents .banner a .banner-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 13px;
    margin-top: 25px;
    margin-left: 0;
  }
  #journey-index.container .contents .banner a .banner-text .title {
    color: #F3ECFF;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px; /* 162.5% */
    letter-spacing: -0.471px;
    margin-top: 0;
    width: fit-content;
    min-height: fit-content;
  }
  #journey-index.container .contents .banner a .banner-text .sub {
    margin-top: 0;
    color: #FFF;
    text-align: center;
    text-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
    font-size: 26px;
    font-weight: 400;
    line-height: 34px; /* 130.769% */
    letter-spacing: -1px;
    padding: 0;
    font-family: "Apple SD Gothic Neo";
  }
  #journey-index.container .contents .banner a .banner-text .sub.en {
    font-size: 23px;
    letter-spacing: normal;
    line-height: 28px;
    font-family: NanumSquareRound;
    font-weight: 800;
  }
  #journey-index.container .contents .banner a .banner-text .sub.ja {
    font-size: 20px;
  }
}
#journey-features.container {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 1280px;
}
#journey-features.container .contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 1280px;
}
#journey-features.container .contents h1 {
  margin-top: 110px;
  text-align: center;
}
#journey-features.container .contents h2 {
  margin-top: 25px;
  text-align: center;
}
#journey-features.container .contents .navigation {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 65px;
  row-gap: 100px;
  margin-top: 170px;
}
#journey-features.container .contents .navigation .cell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  width: 390px;
  padding: 40px 15px 100px;
  transition: all 0.5s ease;
  text-decoration: none;
}
#journey-features.container .contents .navigation .cell:hover {
  border-radius: 10px;
  box-shadow: 0 3px 9px 0 rgba(0, 0, 0, 0.14), 0 0 1px 0 rgba(0, 0, 0, 0.27);
}
#journey-features.container .contents .navigation .cell:hover .arrow-button {
  filter: brightness(0.84);
}
#journey-features.container .contents .navigation .cell .main-image {
  height: 140px;
}
#journey-features.container .contents .navigation .cell h3 {
  margin-top: 25px;
  text-align: center;
}
#journey-features.container .contents .navigation .cell h4 {
  width: 305px;
  margin-top: 22px;
  text-align: center;
}
#journey-features.container .contents .navigation .cell .arrow-button {
  position: absolute;
  bottom: 32px;
  width: 38px;
}
#journey-features.container .contents .banner {
  margin-top: 160px;
  height: 346px;
  transition: all 0.5s ease;
}
#journey-features.container .contents .banner:hover {
  transform: scale(1.02);
}
#journey-features.container .contents .banner-mobile {
  display: none;
}

@media all and (max-width: 768px) {
  #journey-features.container {
    display: flex;
    justify-content: center;
    width: 100%;
    min-width: auto;
  }
  #journey-features.container .contents {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  #journey-features.container .contents h1 {
    width: calc(100% - 40px);
    margin-top: 0;
    padding-top: 55px;
    font-size: 30px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    text-align: center;
    color: #222;
    text-align: center;
  }
  #journey-features.container .contents h2 {
    width: calc(100% - 56px);
    margin-top: 15px;
    padding: 0px 28px 50px 28px;
    border-bottom: solid 1px #c1c1c1;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: #222;
    text-align: center;
  }
  #journey-features.container .contents .navigation {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
    row-gap: 70px;
    width: calc(100% - 20px);
    margin-top: 50px;
  }
  #journey-features.container .contents .navigation .cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: auto;
  }
  #journey-features.container .contents .navigation .cell .main-image {
    width: 100%;
    height: 92px;
    object-fit: contain;
  }
  #journey-features.container .contents .navigation .cell h3 {
    display: flex;
    align-items: center;
    height: 52px;
    margin-top: 25px;
    text-align: center;
  }
  #journey-features.container .contents .navigation .cell h4 {
    width: auto;
    height: auto;
    margin-top: 22px;
    text-align: center;
  }
  #journey-features.container .contents .navigation .cell .arrow-button {
    width: 38px;
    margin-top: 36px;
  }
  #journey-features.container .contents .banner {
    display: none;
  }
  #journey-features.container .contents .banner-mobile {
    display: block;
    margin-top: 80px;
    width: 100%;
  }
}
#journey-features-detail.container {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 1280px;
}
#journey-features-detail.container .contents {
  display: flex;
  position: relative;
  flex-direction: column;
  align-items: center;
  width: 1280px;
  margin-bottom: 300px;
}
#journey-features-detail.container .contents .back-button {
  display: flex;
  align-items: center;
  column-gap: 10px;
  position: absolute;
  top: 30px;
  left: 55px;
  padding: 9px 15px 9px 9px;
  border-radius: 20px;
  box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  text-decoration: none;
}
#journey-features-detail.container .contents .back-button img {
  height: 16px;
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#journey-features-detail.container .contents .back-button span {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: right;
  color: #444;
}
#journey-features-detail.container .contents .summary {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 970px;
  margin-top: 110px;
}
#journey-features-detail.container .contents .summary h1 {
  color: #222;
  font-family: "Apple SD Gothic Neo";
  font-size: 55px;
  font-weight: 700;
  line-height: 72px; /* 130.909% */
  text-align: center;
}
#journey-features-detail.container .contents .summary h2 {
  margin-top: 25px;
  color: #222;
  text-align: center;
  font-family: "Apple SD Gothic Neo";
  font-size: 26px;
  font-weight: 500;
  line-height: 42px; /* 161.538% */
}
#journey-features-detail.container .contents .summary .img-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 770px;
  height: 410px;
  margin-top: 45px;
}
#journey-features-detail.container .contents .summary img.icon-benchmark {
  width: 512px;
  height: 282px;
}
#journey-features-detail.container .contents .summary img.icon-target {
  width: 513px;
  height: 258px;
}
#journey-features-detail.container .contents .summary img.icon-survey {
  width: 294px;
  height: 255px;
}
#journey-features-detail.container .contents .summary img.icon-aireport {
  width: 302px;
  height: 309px;
}
#journey-features-detail.container .contents .summary img.icon-core {
  width: 564px;
  height: 240px;
}
#journey-features-detail.container .contents .summary img.icon-mpti {
  width: 356px;
  height: 247px;
}
#journey-features-detail.container .contents .sub-summary {
  margin-top: 260px;
  margin-bottom: -100px;
  font-family: NewRubrik;
  font-size: 65px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -1.5px;
  text-align: center;
  color: #2f2f2f;
}
#journey-features-detail.container .contents .features {
  display: flex;
  row-gap: 170px;
  flex-direction: column;
  align-items: center;
  margin-top: 120px;
}
#journey-features-detail.container .contents .features .feature-items {
  align-items: center;
  margin-bottom: 26px;
}
#journey-features-detail.container .contents #ut.bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 450px;
  margin-top: 320px;
}
#journey-features-detail.container .contents #ut.bottom div {
  font-size: 55px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: -1px;
  text-align: center;
  color: #222;
}
#journey-features-detail.container .contents #ut.bottom img {
  position: relative;
  top: -30px;
  width: 1580px;
}

@media all and (max-width: 768px) {
  #journey-features-detail.container {
    display: flex;
    justify-content: center;
    width: 100%;
    min-width: auto;
  }
  #journey-features-detail.container .contents {
    display: flex;
    position: relative;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-bottom: 80px;
  }
  #journey-features-detail.container .contents .back-button {
    display: none;
    align-items: center;
    column-gap: 10px;
    position: absolute;
    top: 30px;
    left: 55px;
    padding: 9px 15px 9px 9px;
    border-radius: 20px;
    box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.08);
    background-color: #fff;
    text-decoration: none;
  }
  #journey-features-detail.container .contents .back-button img {
    height: 16px;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #journey-features-detail.container .contents .back-button span {
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: right;
    color: #444;
  }
  #journey-features-detail.container .contents .summary {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 45px;
    border-bottom: 1px solid #c1c1c1;
    padding: 0 20px;
    box-sizing: border-box;
  }
  #journey-features-detail.container .contents .summary h1 {
    color: #222;
    text-align: center;
    font-family: "Apple SD Gothic Neo";
    font-size: 30px;
    font-weight: 700;
    line-height: 39px; /* 130% */
  }
  #journey-features-detail.container .contents .summary h2 {
    margin-top: 15px;
    color: #222;
    text-align: center;
    font-family: "Apple SD Gothic Neo";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
    word-break: break-all;
    letter-spacing: normal;
  }
  #journey-features-detail.container .contents .summary h2.en {
    word-break: break-word;
  }
  #journey-features-detail.container .contents .summary .img-wrap {
    margin-top: 25px;
    margin-bottom: 30px;
    width: 278px;
    height: 135px;
  }
  #journey-features-detail.container .contents .summary .img-wrap img {
    width: 278px;
    height: 135px;
  }
  #journey-features-detail.container .contents .sub-summary {
    margin-top: 95px;
    margin-bottom: 0px;
    font-size: 26px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.19;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #journey-features-detail.container .contents .features {
    width: 100%;
    display: flex;
    row-gap: 80px;
    flex-direction: column;
    align-items: center;
    padding: 0 20px;
    box-sizing: border-box;
    margin-top: 50px;
  }
  #journey-features-detail.container .contents .features .features-item {
    margin-bottom: 0;
  }
  #journey-features-detail.container .contents .features .template-post-740-60-370 {
    width: 100%;
  }
  #journey-features-detail.container .contents #ut.bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 20px;
    width: 100%;
    margin-top: 128px;
  }
  #journey-features-detail.container .contents #ut.bottom div {
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #journey-features-detail.container .contents #ut.bottom img {
    position: relative;
    top: 0px;
    width: 100%;
  }
}
.feature-flex-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 1170px;
}
.feature-flex-column .main-image {
  width: 740px;
}
.feature-flex-column .main-video {
  width: 740px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.feature-flex-column .main-video.no-line {
  border: 0px;
  border-radius: 0px;
}
.feature-flex-column .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.feature-flex-column .main-video video {
  display: block;
}
.feature-flex-column .writing {
  width: 970px;
}
.feature-flex-column .writing .title {
  margin-bottom: 25px;
  color: #222;
  text-align: center;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
.feature-flex-column .writing .description {
  margin-bottom: 20px;
  color: #444;
  text-align: center;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
.feature-flex-column .videos {
  display: flex;
  gap: 30px;
  margin-top: 70px;
  margin-bottom: 18px;
}
.feature-flex-column .videos .left-video, .feature-flex-column .videos .right-video {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
.feature-flex-column .videos .left-video .main-video, .feature-flex-column .videos .right-video .main-video {
  width: 570px;
  border-radius: 15px;
  border: 6px solid #000;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.feature-flex-column .videos .left-video .main-video img, .feature-flex-column .videos .right-video .main-video img {
  display: block;
  width: 100%;
}
.feature-flex-column .videos img.icon-survey-1 {
  position: absolute;
  right: 38px;
  top: -60px;
}
.feature-flex-column .videos img.icon-survey-2 {
  position: absolute;
  right: 16px;
  top: -20px;
}
.feature-flex-column .videos .left-video > span {
  padding: 6px 12px;
  border-radius: 6px;
  background: #75BD00;
  box-sizing: border-box;
  color: #fff;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 700;
  line-height: 29px; /* 161.111% */
}
.feature-flex-column .videos .right-video > span {
  padding: 6px 12px;
  box-sizing: border-box;
  border-radius: 6px;
  background: #FF3D00;
  color: #fff;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 700;
  line-height: 29px; /* 161.111% */
}

@media all and (max-width: 768px) {
  .feature-flex-column {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    column-gap: 0;
    width: 100%;
  }
  .feature-flex-column .main-image {
    width: 100%;
  }
  .feature-flex-column .main-video {
    width: 335px;
    border-radius: 9px;
    border: 4px solid #000;
  }
  .feature-flex-column .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .feature-flex-column .writing {
    width: 100%;
    margin-top: 0px;
    order: -1;
  }
  .feature-flex-column .writing.row {
    display: block;
  }
  .feature-flex-column .writing .title {
    margin-bottom: 15px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
    text-align: start;
  }
  .feature-flex-column .writing .sub {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ec0047;
  }
  .feature-flex-column .writing .sub .coming {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.69;
    letter-spacing: normal;
    color: #6d6d6d;
  }
  .feature-flex-column .writing .description {
    margin-bottom: 20px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
    text-align: start;
  }
  .feature-flex-column .videos {
    flex-wrap: wrap;
    margin-top: 20px;
    margin-bottom: 0;
  }
  .feature-flex-column .videos .left-video, .feature-flex-column .videos .right-video {
    gap: 10px;
  }
  .feature-flex-column .videos .left-video .main-video, .feature-flex-column .videos .right-video .main-video {
    width: 335px;
    border-radius: 9px;
    border: 4px solid #000;
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    isolation: isolate;
  }
  .feature-flex-column .videos .left-video .main-video video, .feature-flex-column .videos .right-video .main-video video {
    display: block;
  }
  .feature-flex-column .videos .left-video > span {
    padding: 3px 8px;
    font-family: "SF Pro Display";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
  }
  .feature-flex-column .videos .right-video > span {
    padding: 3px 8px;
    font-family: "SF Pro Display";
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
  }
}
.feature-tab-rolling {
  display: flex;
  flex-direction: column;
  width: 1170px;
}
.feature-tab-rolling.flex-center {
  align-items: center;
}
.feature-tab-rolling .rolling {
  display: grid;
  grid-template-columns: 740px 364px;
  align-items: center;
  column-gap: 45px;
}
.feature-tab-rolling .rolling__frame {
  width: 100%;
  overflow: hidden;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0px 26px 30px -11px rgba(0, 0, 0, 0.3);
  overflow: hidden;
  isolation: isolate;
}
.feature-tab-rolling .rolling__frame .images {
  position: relative;
  left: 0%;
  width: 100%;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.feature-tab-rolling .rolling__frame .images img {
  position: absolute;
  width: 100%;
}
.feature-tab-rolling .rolling__frame .images video {
  display: block;
  top: 0;
}
.feature-tab-rolling .rolling__tabs {
  display: flex;
  flex-direction: column;
  row-gap: 5px;
}
.feature-tab-rolling .rolling__tabs .tab {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  padding: 22px 22px 30px;
  box-sizing: border-box;
  transition: all 0.5s ease;
  cursor: pointer;
}
.feature-tab-rolling .rolling__tabs .tab__title {
  display: flex;
  align-items: center;
  column-gap: 12px;
}
.feature-tab-rolling .rolling__tabs .tab__title img {
  width: 40px;
  height: 40px;
}
.feature-tab-rolling .rolling__tabs .tab__title h3 {
  color: #222;
  font-size: 20px;
  font-weight: 600;
}
.feature-tab-rolling .rolling__tabs .tab__description {
  color: #2F2F2F;
  font-size: 15px;
  font-weight: 400;
  line-height: 24px; /* 160% */
  letter-spacing: normal;
}
.feature-tab-rolling .rolling__tabs .tab.on, .feature-tab-rolling .rolling__tabs .tab:hover {
  border-radius: 6px;
  box-shadow: 0px 8px 16px 8px rgba(0, 0, 0, 0.06);
  background-color: #fff;
}
.feature-tab-rolling .main-video {
  width: 740px;
  border-radius: 20px;
  border: 6px solid #000;
  box-shadow: 0 0 0 2px #000 inset;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
}
.feature-tab-rolling .main-video.no-line {
  border: 0px;
  border-radius: 0px;
}
.feature-tab-rolling .main-video.on-shadow {
  box-shadow: 0px 20.054px 23.139px -8.484px rgba(0, 0, 0, 0.3);
}
.feature-tab-rolling .main-video video {
  display: block;
}
.feature-tab-rolling .main-video img {
  display: block;
  width: 100%;
}
.feature-tab-rolling .writing {
  margin-top: 20px;
}
.feature-tab-rolling .writing .title {
  margin-bottom: 25px;
  color: #222;
  text-align: center;
  font-family: "Apple SD Gothic Neo";
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
.feature-tab-rolling .writing .title.text-start {
  text-align: start;
}
.feature-tab-rolling .writing .description {
  margin-bottom: 45px;
  color: #444;
  text-align: center;
  font-family: "Apple SD Gothic Neo";
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
.feature-tab-rolling .writing .description.text-start {
  text-align: start;
}
.feature-tab-rolling .writing .description.text-center {
  text-align: center;
}

@media all and (max-width: 768px) {
  .feature-tab-rolling {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .feature-tab-rolling .crs {
    display: flex;
    width: 100%;
    align-items: center;
    column-gap: 30px;
    align-items: center;
    position: relative;
  }
  .feature-tab-rolling .crs .item {
    display: flex !important;
    flex-direction: column;
    align-items: center;
  }
  .feature-tab-rolling .crs .crs__image {
    width: 320px;
    border-radius: 9px;
    border: 4px solid #0A1529;
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
  }
  .feature-tab-rolling .crs .crs__buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 10px;
    position: absolute;
    top: 200px;
    left: 50%;
    transform: translateX(-50%);
  }
  .feature-tab-rolling .crs .crs__buttons button {
    width: 8px;
    height: 8px;
    padding: 0px;
    border-radius: 4px;
    border: 0px;
    opacity: 0.35;
    background-color: #000;
    color: rgba(0, 0, 0, 0);
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    cursor: pointer;
  }
  .feature-tab-rolling .crs .crs__buttons .slick-active button {
    width: 25px;
    height: 8px;
    border-radius: 6px;
    background-color: #000;
    opacity: 1;
  }
  .feature-tab-rolling .crs .crs__title {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 5px;
    margin-top: 40px;
    padding-right: 20px;
    color: #2F2F2F;
    text-align: center;
    font-family: "Apple SD Gothic Neo";
    font-size: 20px;
    font-weight: 700;
    line-height: 26px; /* 130% */
  }
  .feature-tab-rolling .crs .crs__desc {
    margin-top: 10px;
    padding: 0px 30px;
    color: rgba(51, 51, 51, 0.8);
    text-align: center;
    font-family: "Apple SD Gothic Neo";
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
  }
  .feature-tab-rolling .rolling-mobile {
    display: flex;
    width: 100%;
    align-items: center;
    column-gap: 30px;
    align-items: center;
  }
  .feature-tab-rolling .rolling-mobile .frame {
    width: 100%;
    overflow: hidden;
  }
  .feature-tab-rolling .rolling-mobile .frame .item {
    display: flex !important;
    flex-direction: column;
    width: 100%;
  }
  .feature-tab-rolling .rolling-mobile .frame .images {
    position: relative;
    left: 0%;
    width: 100%;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .feature-tab-rolling .rolling-mobile .frame .images img {
    position: absolute;
    width: 100%;
  }
  .feature-tab-rolling .rolling-mobile .frame .buttons {
    position: relative;
    top: 0px;
    display: flex;
    justify-content: center;
    column-gap: 12px;
  }
  .feature-tab-rolling .rolling-mobile .frame .buttons button {
    height: 12px;
    border: none;
    cursor: pointer;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .feature-tab-rolling .rolling-mobile .frame .buttons button.on {
    width: 37px;
    border-radius: 8px;
    background-color: #000;
  }
  .feature-tab-rolling .rolling-mobile .frame .buttons button.off {
    width: 12px;
    height: 12px;
    padding: 0px;
    border-radius: 50%;
    background-color: grey;
  }
  .feature-tab-rolling .rolling-mobile .rolling__title {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 5px;
    margin-top: 48px;
  }
  .feature-tab-rolling .rolling-mobile .rolling__title img {
    width: 40px;
    height: 40px;
  }
  .feature-tab-rolling .rolling-mobile .rolling__title h3 {
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    text-align: center;
    color: #2f2f2f;
  }
  .feature-tab-rolling .rolling-mobile .rolling__description {
    margin-top: 12px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: rgba(51, 51, 51, 0.8);
  }
  .feature-tab-rolling .main-video {
    width: 335px;
    border-radius: 9px;
    border: 4px solid #000;
  }
  .feature-tab-rolling .main-video.on-shadow {
    box-shadow: 0px 11px 13px -5px rgba(0, 0, 0, 0.3);
  }
  .feature-tab-rolling .writing {
    width: 100%;
    margin-top: 0px;
  }
  .feature-tab-rolling .writing .title {
    margin-bottom: 15px;
    color: #333;
    font-family: "Apple SD Gothic Neo";
    font-size: 22px;
    font-weight: 700;
    line-height: 30px; /* 136.364% */
  }
  .feature-tab-rolling .writing .title.text-start {
    text-align: center;
  }
  .feature-tab-rolling .writing .description {
    margin-bottom: 25px;
    color: rgba(51, 51, 51, 0.8);
    font-family: "Apple SD Gothic Neo";
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
  }
  .feature-tab-rolling .writing .description.text-start {
    text-align: center;
  }
}
#uxheatmap-index.container {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 1280px;
}
#uxheatmap-index.container .contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 1280px;
}
#uxheatmap-index.container .contents > .title {
  margin-top: 90px;
  min-height: 83px;
  font-family: NewRubrik;
  font-size: 90px;
  font-weight: bold;
  font-stretch: normal;
  font-style: italic;
  line-height: 0.98;
  letter-spacing: -1.53px;
  text-align: center;
  color: #ec0047;
}
#uxheatmap-index.container .contents h2 {
  margin-top: 30px;
  font-size: 30px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.37;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
#uxheatmap-index.container .contents h2.en {
  letter-spacing: -0.5px;
}
#uxheatmap-index.container .contents .main-image {
  margin-top: 50px;
  width: 706px;
  min-height: 412px;
}
#uxheatmap-index.container .contents .analyze-button {
  display: flex;
  align-items: center;
  column-gap: 12px;
  margin-top: 40px;
  padding: 13px 19px 13px 32px;
  border: solid 2px #ec0047;
  border-radius: 34px;
  box-shadow: 0 20px 18px -16px rgba(0, 0, 0, 0.25);
  background-color: #fff;
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #ec0047;
  text-decoration: none;
  cursor: pointer;
}
#uxheatmap-index.container .contents .analyze-button img {
  height: 35px;
}
#uxheatmap-index.container .contents .analyze-button:hover {
  filter: brightness(0.9);
}
#uxheatmap-index.container .contents .features {
  display: flex;
  flex-direction: column;
  row-gap: 160px;
  align-items: center;
  margin-top: 200px;
}
#uxheatmap-index.container .contents .features .item {
  display: grid;
  grid-template-columns: 740px 370px;
  justify-content: start;
  column-gap: 60px;
  width: 1170px;
}
#uxheatmap-index.container .contents .features .item.reverse {
  grid-template-columns: 370px 740px;
}
#uxheatmap-index.container .contents .features .item.top {
  justify-content: center;
  grid-template-rows: auto 380px;
  grid-template-columns: none;
  row-gap: 28px;
  grid-auto-flow: column;
  text-align: center;
}
#uxheatmap-index.container .contents .features .item__image {
  width: 100%;
}
#uxheatmap-index.container .contents .features .item__images {
  display: grid;
  grid-template-columns: repeat(3, 280px);
  grid-auto-rows: 180px;
  column-gap: 50px;
  margin-top: 100px;
  width: 100%;
}
#uxheatmap-index.container .contents .features .item__images .box {
  position: relative;
  overflow: hidden;
}
#uxheatmap-index.container .contents .features .item__images .box .frame {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#uxheatmap-index.container .contents .features .item__writing {
  width: 100%;
  margin-top: 45px;
}
#uxheatmap-index.container .contents .features .item__writing .title {
  font-size: 36px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: -1px;
  color: #222;
  text-align: left;
}
#uxheatmap-index.container .contents .features .item__writing .title.center {
  text-align: center;
}
#uxheatmap-index.container .contents .features .item__writing .sub {
  margin-top: 10px;
  font-size: 25px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.3px;
  color: #222;
}
#uxheatmap-index.container .contents .features .item__writing .sub-title {
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #ec0047;
}
#uxheatmap-index.container .contents .features .item__writing .description {
  margin-top: 25px;
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #444;
}

@media all and (max-width: 768px) {
  #uxheatmap-index.container {
    display: flex;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-width: 0px;
    padding: 0px 20px;
  }
  #uxheatmap-index.container .contents {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  #uxheatmap-index.container .contents .title {
    width: 100%;
    min-height: 50px;
    margin-top: 35px;
    font-family: NewRubrik;
    font-size: 50px;
    font-weight: bold;
    font-stretch: normal;
    font-style: italic;
    line-height: 1;
    letter-spacing: -0.85px;
    text-align: center;
    color: #ec0047;
  }
  #uxheatmap-index.container .contents h2 {
    margin-top: 20px;
    padding: 0px 25px;
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #uxheatmap-index.container .contents .main-image {
    margin-top: 30px;
    width: 100%;
    min-height: 209px;
  }
  #uxheatmap-index.container .contents .analyze-button {
    display: flex;
    align-items: center;
    column-gap: 8px;
    margin-top: 52px;
    padding: 13px 18px;
    border: solid 2.5px #ec0047;
    border-radius: 34px;
    box-shadow: 0 20px 18px -16px rgba(0, 0, 0, 0.25);
    background-color: #fff;
    font-size: 15px;
    font-weight: 800;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: -0.34px;
    text-align: center;
    color: #ec0047;
    cursor: pointer;
  }
  #uxheatmap-index.container .contents .analyze-button img {
    height: 20px;
  }
  #uxheatmap-index.container .contents .features {
    display: flex;
    flex-direction: column;
    row-gap: 100px;
    align-items: center;
    width: 100%;
    margin-top: 120px;
    margin-bottom: 100px;
  }
  #uxheatmap-index.container .contents .features .item {
    display: grid;
    grid-template-columns: 100%;
    row-gap: 20px;
    width: 100%;
  }
  #uxheatmap-index.container .contents .features .item.reverse {
    grid-template-columns: 100%;
  }
  #uxheatmap-index.container .contents .features .item.top {
    grid-template-columns: 100%;
    grid-template-rows: none;
    row-gap: 28px;
    grid-auto-flow: row;
    text-align: start;
  }
  #uxheatmap-index.container .contents .features .item__image {
    width: 100%;
  }
  #uxheatmap-index.container .contents .features .item__images {
    display: grid;
    grid-template-columns: repeat(1, 280px);
    grid-auto-rows: 180px;
    column-gap: 50px;
    row-gap: 30px;
    justify-content: center;
    margin-top: 20px;
    width: 100%;
  }
  #uxheatmap-index.container .contents .features .item__images .box {
    position: relative;
    overflow: hidden;
  }
  #uxheatmap-index.container .contents .features .item__images .box .frame {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  #uxheatmap-index.container .contents .features .item__writing {
    width: 100%;
    margin-top: 45px;
    order: -1;
  }
  #uxheatmap-index.container .contents .features .item__writing .title {
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    color: #333;
  }
  #uxheatmap-index.container .contents .features .item__writing .sub {
    margin-top: 10px;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #333;
  }
  #uxheatmap-index.container .contents .features .item__writing .sub-title {
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.61;
    letter-spacing: normal;
    color: #ec0047;
  }
  #uxheatmap-index.container .contents .features .item__writing .description {
    margin-top: 15px;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: rgba(51, 51, 51, 0.8);
  }
}
#uxheatmap-features.container {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 1280px;
}
#uxheatmap-features.container .contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 1280px;
}
#uxheatmap-features.container .contents h1 {
  margin-top: 110px;
  text-align: center;
}
#uxheatmap-features.container .contents h2 {
  margin-top: 25px;
  text-align: center;
}
#uxheatmap-features.container .contents .navigation {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 5px;
  row-gap: 100px;
  margin-top: 170px;
}
#uxheatmap-features.container .contents .navigation .cell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  width: 390px;
  padding: 40px 15px 100px;
  transition: all 0.5s ease;
  text-decoration: none;
}
#uxheatmap-features.container .contents .navigation .cell:hover {
  border-radius: 10px;
  box-shadow: 0 3px 9px 0 rgba(0, 0, 0, 0.14), 0 0 1px 0 rgba(0, 0, 0, 0.27);
}
#uxheatmap-features.container .contents .navigation .cell:hover .arrow-button {
  filter: brightness(0.84);
}
#uxheatmap-features.container .contents .navigation .cell .main-image {
  height: 140px;
}
#uxheatmap-features.container .contents .navigation .cell h3 {
  margin-top: 25px;
  text-align: center;
}
#uxheatmap-features.container .contents .navigation .cell h4 {
  width: 305px;
  margin-top: 22px;
  text-align: center;
}
#uxheatmap-features.container .contents .navigation .cell h4.realtime {
  width: 100%;
  word-break: normal;
}
#uxheatmap-features.container .contents .navigation .cell .arrow-button {
  position: absolute;
  bottom: 32px;
  width: 38px;
}
#uxheatmap-features.container .contents .banner {
  margin-top: 160px;
  height: 346px;
  transition: all 0.5s ease;
}
#uxheatmap-features.container .contents .banner:hover {
  transform: scale(1.02);
}
#uxheatmap-features.container .contents .banner-mobile {
  display: none;
}

@media all and (max-width: 768px) {
  #uxheatmap-features.container {
    display: flex;
    justify-content: center;
    width: 100%;
    min-width: auto;
  }
  #uxheatmap-features.container .contents {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  #uxheatmap-features.container .contents h1 {
    width: calc(100% - 40px);
    margin-top: 0;
    padding-top: 55px;
    font-size: 30px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    text-align: center;
    color: #222;
    text-align: center;
  }
  #uxheatmap-features.container .contents h2 {
    width: calc(100% - 56px);
    margin-top: 15px;
    padding: 0px 28px 50px 28px;
    border-bottom: solid 1px #c1c1c1;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: #222;
    text-align: center;
  }
  #uxheatmap-features.container .contents .navigation {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
    row-gap: 70px;
    width: calc(100% - 20px);
    margin-top: 50px;
  }
  #uxheatmap-features.container .contents .navigation .cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: auto;
  }
  #uxheatmap-features.container .contents .navigation .cell .main-image {
    width: 100%;
    height: 92px;
    object-fit: contain;
  }
  #uxheatmap-features.container .contents .navigation .cell h3 {
    display: flex;
    align-items: center;
    height: 52px;
    margin-top: 25px;
    text-align: center;
  }
  #uxheatmap-features.container .contents .navigation .cell h4 {
    width: auto;
    height: auto;
    margin-top: 22px;
    text-align: center;
  }
  #uxheatmap-features.container .contents .navigation .cell .arrow-button {
    width: 38px;
    margin-top: 36px;
  }
  #uxheatmap-features.container .contents .banner {
    display: none;
  }
  #uxheatmap-features.container .contents .banner-mobile {
    display: block;
    margin-top: 80px;
    width: 100%;
  }
}
#uxheatmap-features-detail.container {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 1280px;
}
#uxheatmap-features-detail.container .contents {
  display: flex;
  position: relative;
  flex-direction: column;
  align-items: center;
  width: 1280px;
  margin-bottom: 300px;
}
#uxheatmap-features-detail.container .contents .back-button {
  display: flex;
  align-items: center;
  column-gap: 10px;
  position: absolute;
  top: 30px;
  left: 55px;
  padding: 9px 15px 9px 9px;
  border-radius: 20px;
  box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  text-decoration: none;
}
#uxheatmap-features-detail.container .contents .back-button img {
  height: 16px;
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#uxheatmap-features-detail.container .contents .back-button span {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: right;
  color: #444;
}
#uxheatmap-features-detail.container .contents .summary {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 970px;
  margin-top: 110px;
}
#uxheatmap-features-detail.container .contents .summary h1 {
  text-align: center;
}
#uxheatmap-features-detail.container .contents .summary h2 {
  margin-top: 35px;
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.62;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
#uxheatmap-features-detail.container .contents .summary img {
  height: 280px;
  margin-top: 80px;
}
#uxheatmap-features-detail.container .contents .sub-summary {
  margin-top: 260px;
  margin-bottom: -100px;
  font-family: NewRubrik;
  font-size: 65px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -1.5px;
  text-align: center;
  color: #2f2f2f;
}
#uxheatmap-features-detail.container .contents .features {
  display: flex;
  row-gap: 250px;
  flex-direction: column;
  align-items: center;
  margin-top: 200px;
}
#uxheatmap-features-detail.container .contents #ut.bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 450px;
  margin-top: 320px;
}
#uxheatmap-features-detail.container .contents #ut.bottom div {
  font-size: 55px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: -1px;
  text-align: center;
  color: #222;
}
#uxheatmap-features-detail.container .contents #ut.bottom img {
  position: relative;
  top: -30px;
  width: 1580px;
}

@media all and (max-width: 768px) {
  #uxheatmap-features-detail.container {
    display: flex;
    justify-content: center;
    width: 100%;
    min-width: auto;
  }
  #uxheatmap-features-detail.container .contents {
    display: flex;
    position: relative;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-bottom: 300px;
  }
  #uxheatmap-features-detail.container .contents .back-button {
    display: none;
    align-items: center;
    column-gap: 10px;
    position: absolute;
    top: 30px;
    left: 55px;
    padding: 9px 15px 9px 9px;
    border-radius: 20px;
    box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.08);
    background-color: #fff;
    text-decoration: none;
  }
  #uxheatmap-features-detail.container .contents .back-button img {
    height: 16px;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #uxheatmap-features-detail.container .contents .back-button span {
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: right;
    color: #444;
  }
  #uxheatmap-features-detail.container .contents .summary {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 45px;
    border-bottom: 1px solid #c1c1c1;
  }
  #uxheatmap-features-detail.container .contents .summary h1 {
    font-family: NewRubrik;
    font-size: 32px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #2f2f2f;
  }
  #uxheatmap-features-detail.container .contents .summary h2 {
    margin-top: 15px;
    margin: 15px 20px 0px 20px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #uxheatmap-features-detail.container .contents .summary img {
    height: 120px;
    margin-top: 35px;
    margin-bottom: 40px;
  }
  #uxheatmap-features-detail.container .contents .sub-summary {
    margin-top: 95px;
    margin-bottom: 0px;
    font-size: 26px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.19;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #uxheatmap-features-detail.container .contents .features {
    width: 100%;
    display: flex;
    row-gap: 105px;
    flex-direction: column;
    align-items: center;
    margin-top: 50px;
  }
  #uxheatmap-features-detail.container .contents #ut.bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 20px;
    width: 100%;
    margin-top: 128px;
  }
  #uxheatmap-features-detail.container .contents #ut.bottom div {
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #uxheatmap-features-detail.container .contents #ut.bottom img {
    position: relative;
    top: 0px;
    width: 100%;
  }
}
#support.bottom {
  width: 100%;
  display: grid;
  justify-content: center;
  grid-template-columns: repeat(3, 370px);
  column-gap: 30px;
  margin-top: 100px;
  padding-top: 100px;
  border-top: 2px solid #d7d7d7;
}
#support.bottom .item {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 25px;
}
#support.bottom .item .title {
  font-size: 34px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.18;
  letter-spacing: -0.5px;
  text-align: center;
  color: #2f2f2f;
}
#support.bottom .item .title.tight.ja {
  letter-spacing: -1.5px;
}
#support.bottom .item .description {
  min-height: 72px;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}
#support.bottom .item > a {
  box-sizing: border-box;
  border-radius: 24px;
  border: solid 1px #ec0047;
  min-width: 100px;
  padding: 14px 20px;
  background-color: #fff;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #ec0047;
  text-decoration: none;
}
#support.bottom .item > a:hover {
  filter: brightness(0.94);
}

@media all and (max-width: 768px) {
  #support.bottom {
    display: grid;
    justify-content: center;
    grid-template-columns: repeat(1, 100%);
    column-gap: 30px;
    row-gap: 60px;
    box-sizing: border-box;
    width: 100%;
    margin-top: 30px;
    margin-bottom: 80px;
    padding: 60px 20px 0px 20px;
    border-top: 2px solid #d7d7d7;
  }
  #support.bottom .item {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 25px;
  }
  #support.bottom .item .title {
    font-size: 26px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.19;
    letter-spacing: normal;
    text-align: center;
    color: #2f2f2f;
  }
  #support.bottom .item .description {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: #444;
  }
  #support.bottom .item > a {
    box-sizing: border-box;
    border-radius: 21px;
    border: solid 1px #ec0047;
    min-width: 100px;
    padding: 14px 20px;
    background-color: #fff;
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #ec0047;
    text-decoration: none;
  }
}
#documentation.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  min-width: 1280px;
}
#documentation.container .contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 1170px;
}
#documentation.container .contents > h1 {
  margin-top: 110px;
  font-family: NewRubrik;
  font-size: 65px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -1.5px;
  text-align: center;
  color: #2f2f2f;
}
#documentation.container .contents > h2 {
  margin-top: 35px;
  font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.62;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
#documentation.container .contents > .select-tab {
  display: flex;
  justify-content: center;
  column-gap: 10px;
  box-sizing: border-box;
  margin-top: 100px;
  border-radius: 24px;
  box-shadow: 0 0 0 1px #d7d7d7 inset;
}
#documentation.container .contents > .select-tab > span {
  box-sizing: border-box;
  min-width: 140px;
  padding: 15px 30px;
  border-radius: 24px;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  cursor: pointer;
}
#documentation.container .contents > .select-tab > span.selected {
  background-color: #ec0047;
  color: white;
}
#documentation.container .contents > .select-tab > span:not(.selected):hover {
  filter: opacity(0.75);
}
#documentation.container .contents .cells {
  display: none;
  flex-direction: column;
  row-gap: 60px;
  width: 1170px;
  margin-top: 130px;
}
#documentation.container .contents .cells.selected {
  display: flex;
}
#documentation.container .contents .cells .cell .category {
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #ec0047;
}
#documentation.container .contents .cells .cell .files {
  margin-top: 25px;
  display: flex;
  column-gap: 30px;
}
#documentation.container .contents .cells .cell .files .file {
  width: 330px;
  padding: 20px;
  border-radius: 14px;
  box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  background: url("https://dream-cdn.beusable.net/home/images/icon-pdf.svg") no-repeat 92% 50%;
  cursor: pointer;
}
#documentation.container .contents .cells .cell .files .file .title {
  font-size: 15px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #444;
}
#documentation.container .contents .cells .cell .files .file .version {
  margin-top: 10px;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #666;
}
#documentation.container .contents .cells .division {
  height: 2px;
  background-color: #d7d7d7;
}

@media all and (max-width: 768px) {
  #documentation.container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    min-width: auto;
  }
  #documentation.container .contents {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  #documentation.container .contents > h1 {
    margin-top: 60px;
    font-family: NewRubrik;
    font-size: 32px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #2f2f2f;
  }
  #documentation.container .contents > h2 {
    margin-top: 15px;
    padding: 0px 20px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #documentation.container .contents > .select-tab {
    display: flex;
    justify-content: center;
    column-gap: 10px;
    margin-top: 100px;
    border-radius: 24px;
    border: solid 1px #d7d7d7;
  }
  #documentation.container .contents > .select-tab > span {
    box-sizing: border-box;
    min-width: 140px;
    padding: 15px 30px;
    border-radius: 24px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #444;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    cursor: pointer;
  }
  #documentation.container .contents > .select-tab > span.selected {
    background-color: #ec0047;
    color: white;
  }
  #documentation.container .contents > .select-tab-mobile {
    width: calc(100% - 32px);
    margin-top: 50px;
    padding: 12px;
    border: solid 1px #bbb;
    border-radius: 6px;
    background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 97.5% 50%;
    appearance: none;
    color: black;
  }
  #documentation.container .contents .cells {
    display: none;
    flex-direction: column;
    row-gap: 30px;
    width: 100%;
    margin-top: 30px;
  }
  #documentation.container .contents .cells .cell {
    padding: 0px 16px;
  }
  #documentation.container .contents .cells .cell .category {
    font-size: 18px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ec0047;
  }
  #documentation.container .contents .cells .cell .files {
    margin-top: 15px;
    display: flex;
    flex-direction: column;
    row-gap: 15px;
  }
  #documentation.container .contents .cells .cell .files .file {
    width: auto;
    padding: 20px;
    border-radius: 14px;
    box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.08);
    background: url("https://dream-cdn.beusable.net/home/images/icon-pdf.svg") no-repeat 92% 50%;
    cursor: pointer;
  }
  #documentation.container .contents .cells .cell .files .file .title {
    font-size: 15px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #444;
  }
  #documentation.container .contents .cells .cell .files .file .version {
    margin-top: 10px;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #666;
  }
  #documentation.container .contents .cells .division {
    height: 2px;
    background-color: #d7d7d7;
  }
}
#contactus.container {
  padding-top: 110px;
  padding-bottom: 150px;
}
#contactus.container .contactus {
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}
#contactus.container .contactus-title {
  font-family: NewRubrik;
  font-size: 65px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -1.5px;
  text-align: center;
  color: #2f2f2f;
}
#contactus.container .contactus-description {
  margin-top: 35px;
  font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.62;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
#contactus.container .contactus-contents {
  display: flex;
  column-gap: 67px;
  margin-top: 90px;
  padding-bottom: 70px;
}
#contactus.container .contactus-contents .form-section {
  display: flex;
  padding: 31px 0 50px 0;
  border-top: 2px solid #bbbbbb;
}
#contactus.container .contactus-contents .form-section-title {
  width: 100px;
  font-size: 15px;
  font-weight: 700;
}
#contactus.container .contactus-contents .form-section-title.required {
  color: #ec0047;
}
#contactus.container .contactus-contents .form-section-title.optional {
  color: #767676;
}
#contactus.container .contactus-contents .form-section-items {
  display: flex;
  flex-direction: column;
  row-gap: 35px;
}
#contactus.container .contactus-contents .form-section-items .item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#contactus.container .contactus-contents .form-section-items .item.flexstart {
  align-items: flex-start;
}
#contactus.container .contactus-contents .form-section-items .item-category {
  width: 138px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.07;
  letter-spacing: normal;
  color: #555;
}
#contactus.container .contactus-contents .form-section-items .item-category .required {
  color: #ec0047;
}
#contactus.container .contactus-contents .form-section-items .item-category .sub {
  font-size: 13px;
}
#contactus.container .contactus-contents .form-section-items .item-input {
  position: relative;
  box-sizing: border-box;
  width: 496px;
  padding: 10px 12px;
  border: solid 1px #b1b1b1;
  border-radius: 5px;
  outline: none;
  background-color: #fff;
  font-size: 14px;
  color: #2f2f2f;
  transition: border-color 0.3s ease;
}
#contactus.container .contactus-contents .form-section-items .item-input::placeholder {
  opacity: 0.5;
}
#contactus.container .contactus-contents .form-section-items .item.error .item-input {
  border-color: #e60724;
}
#contactus.container .contactus-contents .form-section-items .item-error {
  position: absolute;
  top: 43px;
  left: 140px;
  color: #e60724;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.08;
  opacity: 0;
  transition: opacity 0.2s ease;
}
#contactus.container .contactus-contents .form-section-items .item.error .item-error {
  opacity: 1;
}
#contactus.container .contactus-contents .form-section-items .item-checkbox {
  display: flex;
  flex-direction: column;
  row-gap: 22px;
  width: 496px;
}
#contactus.container .contactus-contents .form-section-items .item-checkbox > div {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
#contactus.container .contactus-contents .form-section-items .item-checkbox > div .box {
  box-sizing: border-box;
  width: 18px;
  height: 18px;
  position: relative;
}
#contactus.container .contactus-contents .form-section-items .item-checkbox > div .box::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  height: 20px;
  width: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-checkbox-red.svg") transparent no-repeat center center;
  background-size: 20px 20px;
  opacity: 0;
}
#contactus.container .contactus-contents .form-section-items .item-checkbox > div .box:checked::before {
  opacity: 1;
}
#contactus.container .contactus-contents .form-section-items .item-checkbox > div .main {
  font-size: 15px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.93;
  letter-spacing: normal;
  color: #555;
}
#contactus.container .contactus-contents .form-section-items .item-checkbox > div .sub {
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: -0.5px;
  color: #767676;
}
#contactus.container .contactus-contents .form-section-items .item-select {
  width: 496px;
  padding: 11px 12px;
  border-radius: 6px;
  border: solid 1px #b1b1b1;
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 97% 50%;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
  appearance: none;
}
#contactus.container .contactus-contents .form-section-items .item.error .item-select {
  border-color: #e60724;
}
#contactus.container .contactus-contents .form-section-items .item-textarea {
  box-sizing: border-box;
  width: 496px;
  min-height: 174px;
  padding: 10px 12px;
  border-radius: 3px;
  border: solid 1px #b1b1b1;
  resize: none;
  font-family: inherit;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
}
#contactus.container .contactus-contents .form-section-items .item.error .item-textarea {
  border-color: #e60724;
}
#contactus.container .contactus-contents .form-section-items .item-agreement {
  display: flex;
  align-items: center;
  column-gap: 6px;
  width: 496px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: normal;
  color: #767676;
}
#contactus.container .contactus-contents .form-section-items .item-agreement .box {
  width: 18px;
  height: 18px;
  position: relative;
}
#contactus.container .contactus-contents .form-section-items .item-agreement .box::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  height: 20px;
  width: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-checkbox-red.svg") transparent no-repeat center center;
  background-size: 20px 20px;
  opacity: 0;
}
#contactus.container .contactus-contents .form-section-items .item-agreement .box:checked::before {
  opacity: 1;
}
#contactus.container .contactus-contents-nav {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 40px 30px 0px 30px;
  border-radius: 8px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.2);
  background-color: #fff;
}
#contactus.container .contactus-contents-nav .title {
  font-size: 26px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.19;
  letter-spacing: normal;
  color: #222;
}
#contactus.container .contactus-contents-nav .title.en {
  letter-spacing: -0.5px;
}
#contactus.container .contactus-contents-nav .image {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  margin-top: 14px;
}
#contactus.container .contactus-contents-nav .image img {
  width: 155px;
}
#contactus.container .contactus-contents-nav .item {
  width: 310px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 25px 0px;
}
#contactus.container .contactus-contents-nav .item-writing {
  display: flex;
  flex-direction: column;
  row-gap: 15px;
  width: 190px;
}
#contactus.container .contactus-contents-nav .item-writing-title {
  font-size: 20px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.29px;
  color: #2f2f2f;
}
#contactus.container .contactus-contents-nav .item-writing-description {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: normal;
  color: #444;
}
#contactus.container .contactus-contents-nav .item-button {
  width: 100px;
  padding: 12px 0;
  border-radius: 20px;
  border: solid 1px #ec0047;
  background-color: #fff;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #ec0047;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#contactus.container .contactus-contents-nav .item-button:hover {
  color: white;
  background-color: #ec0047;
}
#contactus.container .contactus-contents-nav .division {
  width: 310px;
  border-top: 1px solid #ececec;
}
#contactus.container .contactus-bottom-submit {
  padding: 14px 52px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #fff;
  cursor: pointer;
}

.contactus-iframe-wrapper {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 999;
}
.contactus-iframe {
  height: 100%;
  width: 100%;
  border: none;
}
.contactus-text {
  position: absolute;
  top: -35px;
  right: 50%;
  transform: translateX(50%);
  display: inline-block;
  min-width: max-content;
  background-color: #000;
  color: #fff;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  line-height: 144%;
  border-radius: 3px;
  padding: 2px 5px;
  margin-bottom: 12px;
  box-sizing: border-box;
  letter-spacing: -0.5px;
  font-family: Roboto, "Apple SD Gothic Neo", sans-serif;
}
.contactus-text.en {
  letter-spacing: 0;
  font-family: "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif, "SF Pro KR", "SF Pro Text";
}
.contactus-text.ja {
  font-family: Osaka, Meiryo, MS PGothic, MS UI Gothic, Noto Sans JP, sans-serif;
}
.contactus-button {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 999;
}
.contactus-button.ja {
  right: 35px;
}
.contactus-icon {
  display: flex;
  align-items: center;
  width: 90px;
  height: 90px;
  border-radius: 100%;
  background-image: url(../../images/icon-floating-default.svg);
  background-size: cover;
  background-repeat: no-repeat;
  filter: drop-shadow(0px 12px 16px rgba(0, 0, 0, 0.12));
  cursor: pointer;
  border: 2px solid #FFF;
  box-sizing: border-box;
  box-shadow: 0px 20px 38px -10px rgba(0, 0, 0, 0.32);
  transition: transform 0.3s;
}

@media all and (max-width: 768px) {
  #contactus.container {
    padding-top: 23px;
    padding-bottom: 150px;
  }
  #contactus.container .contactus {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
  }
  #contactus.container .contactus-title {
    font-family: NewRubrik;
    font-size: 32px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #2f2f2f;
  }
  #contactus.container .contactus-description {
    width: 100%;
    margin-top: 15px;
    padding-bottom: 40px;
    border-bottom: solid 1px #e1e1e1;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #contactus.container .contactus-contents {
    display: flex;
    flex-direction: column;
    column-gap: 67px;
    width: 100%;
    margin-top: 40px;
    padding-bottom: 50px;
  }
  #contactus.container .contactus-contents .form {
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: auto;
    padding: 30px 20px 0px 20px;
    border-top: 1px solid #e1e1e1;
  }
  #contactus.container .contactus-contents .form-section {
    display: block;
    padding: 0;
    border: none;
  }
  #contactus.container .contactus-contents .form-section-title {
    display: none;
  }
  #contactus.container .contactus-contents .form-section-items {
    display: flex;
    flex-direction: column;
    row-gap: 30px;
  }
  #contactus.container .contactus-contents .form-section-items .item {
    display: flex;
    flex-direction: column;
    row-gap: 5px;
    align-items: flex-start;
    justify-content: space-between;
  }
  #contactus.container .contactus-contents .form-section-items .item.flexstart {
    align-items: flex-start;
  }
  #contactus.container .contactus-contents .form-section-items .item-category {
    width: 100%;
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #767676;
  }
  #contactus.container .contactus-contents .form-section-items .item-category .required,
  #contactus.container .contactus-contents .form-section-items .item-category .optional {
    display: inline;
    padding-left: 4px;
    font-size: 12px;
    font-weight: 400;
  }
  #contactus.container .contactus-contents .form-section-items .item-input {
    box-sizing: border-box;
    width: 100%;
    padding: 10px 12px;
    border: solid 1px #b1b1b1;
    border-radius: 5px;
    outline: none;
    background-color: #fff;
    font-size: 14px;
    color: #2f2f2f;
    transition: border-color 0.3s ease;
  }
  #contactus.container .contactus-contents .form-section-items .item-error {
    position: absolute;
    top: 60px;
    left: 5px;
    color: #e60724;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.08;
    opacity: 0;
    transition: opacity 0.2s ease;
  }
  #contactus.container .contactus-contents .form-section-items .item-checkbox {
    display: flex;
    flex-direction: column;
    row-gap: 12px;
    width: 100%;
    margin-top: 15px;
  }
  #contactus.container .contactus-contents .form-section-items .item-checkbox > div {
    display: flex;
    align-items: center;
    column-gap: 5px;
  }
  #contactus.container .contactus-contents .form-section-items .item-checkbox > div .box {
    width: 18px;
    height: 18px;
    position: relative;
  }
  #contactus.container .contactus-contents .form-section-items .item-checkbox > div .box::before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    height: 20px;
    width: 20px;
    background: url("https://dream-cdn.beusable.net/home/images/icon-checkbox-red.svg") transparent no-repeat center center;
    background-size: 20px 20px;
    opacity: 0;
  }
  #contactus.container .contactus-contents .form-section-items .item-checkbox > div .box:checked::before {
    opacity: 1;
  }
  #contactus.container .contactus-contents .form-section-items .item-checkbox > div .main {
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #555;
  }
  #contactus.container .contactus-contents .form-section-items .item-checkbox > div .sub {
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.54;
    letter-spacing: -0.54px;
    color: #767676;
  }
  #contactus.container .contactus-contents .form-section-items .item-select {
    width: 100%;
    padding: 11px 12px;
    border-radius: 6px;
    border: solid 1px #b1b1b1;
    background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 97% 50%;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #2f2f2f;
    appearance: none;
  }
  #contactus.container .contactus-contents .form-section-items .item-textarea {
    box-sizing: border-box;
    width: 100%;
    min-height: 174px;
    padding: 10px 12px;
    border-radius: 3px;
    border: solid 1px #b1b1b1;
    resize: none;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #contactus.container .contactus-contents .form-section-items .item-agreement {
    display: flex;
    align-items: center;
    column-gap: 6px;
    width: 100%;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.14;
    letter-spacing: normal;
    color: #767676;
  }
  #contactus.container .contactus-contents .form-section-items .item-agreement .box {
    width: 18px;
    height: 18px;
    position: relative;
  }
  #contactus.container .contactus-contents .form-section-items .item-agreement .box::before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    height: 20px;
    width: 20px;
    background: url("https://dream-cdn.beusable.net/home/images/icon-checkbox-red.svg") transparent no-repeat center center;
    background-size: 20px 20px;
    opacity: 0;
  }
  #contactus.container .contactus-contents .form-section-items .item-agreement .box:checked::before {
    opacity: 1;
  }
  #contactus.container .contactus-contents-nav {
    display: flex;
    flex-direction: column;
    order: -1;
    width: 100%;
    box-sizing: border-box;
    height: auto;
    padding: 0px 20px;
    border-radius: 8px;
    box-shadow: none;
    background-color: #fff;
  }
  #contactus.container .contactus-contents-nav .title {
    font-size: 22px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: center;
    color: #222;
  }
  #contactus.container .contactus-contents-nav .image {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 14px;
    margin-bottom: 20px;
  }
  #contactus.container .contactus-contents-nav .image img {
    width: 129px;
  }
  #contactus.container .contactus-contents-nav .item {
    width: 100%;
    display: grid;
    grid-template-columns: auto 32px;
    justify-content: space-between;
    align-items: center;
    padding: 25px 0px;
  }
  #contactus.container .contactus-contents-nav .item-writing {
    display: grid;
    flex-direction: column;
    row-gap: 5px;
    width: auto;
    padding-right: 10px;
  }
  #contactus.container .contactus-contents-nav .item-writing-title {
    font-size: 18px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.61;
    letter-spacing: normal;
    color: #444;
  }
  #contactus.container .contactus-contents-nav .item-writing-description {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.54;
    letter-spacing: normal;
    color: #666;
  }
  #contactus.container .contactus-contents-nav .item-button {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding: 0;
    border: solid 1px #ec0047;
    background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-right-red-circle.svg") no-repeat center center;
    background-size: cover;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: rgba(0, 0, 0, 0);
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #contactus.container .contactus-contents-nav .item-button:hover {
    color: rgba(0, 0, 0, 0);
    background-color: #ec0047;
  }
  #contactus.container .contactus-contents-nav .division {
    width: 100%;
    border-top: 1px solid #ececec;
  }
  #contactus.container .contactus-bottom {
    width: 100%;
    box-sizing: border-box;
    padding: 0px 20px;
  }
  #contactus.container .contactus-bottom-submit {
    padding: 14px 52px;
    border-radius: 25px;
    background-color: #ec0047;
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #fff;
    text-align: center;
    cursor: pointer;
  }
  #contactus.container .contactus-iframe-wrapper {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
  }
}
#book.container {
  padding-top: 110px;
  padding-bottom: 150px;
}
#book.container .book {
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}
#book.container .book-title {
  font-family: NewRubrik;
  font-size: 65px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -1.5px;
  text-align: center;
  color: #2f2f2f;
}
#book.container .book-description {
  margin-top: 35px;
  margin-bottom: 100px;
  font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.62;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
#book.container .book-image {
  width: 569px;
  min-height: 399px;
}
#book.container .book-info {
  display: flex;
  column-gap: 114px;
}
#book.container .book-info-items {
  display: flex;
  flex-direction: column;
  align-items: center;
  border-bottom: solid 2px #d7d7d7;
}
#book.container .book-info-items .item {
  display: flex;
  align-items: center;
  column-gap: 65px;
  width: 740px;
  padding: 20px 0px;
  border-top: solid 2px #d7d7d7;
}
#book.container .book-info-items .item span {
  display: flex;
  align-items: center;
  min-width: 235px;
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  color: #444;
}
#book.container .book-info-pay {
  display: flex;
  flex-direction: column;
  row-gap: 15px;
  column-gap: 20px;
}
#book.container .book-info-pay a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 270px;
  height: 54px;
  border-radius: 27px;
}
#book.container .book-bg {
  margin-top: 150px;
  width: 100%;
}
#book.container .book-detail {
  display: flex;
  flex-direction: column;
  row-gap: 70px;
}
#book.container .book-detail .writing {
  display: flex;
  column-gap: 30px;
  margin-top: 80px;
}
#book.container .book-detail .writing-category {
  width: 285px;
  font-size: 36px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: -1px;
  color: #2f2f2f;
}
#book.container .book-detail .writing-description {
  max-width: 670px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #444;
}
#book.container .book-detail .writing-description ul {
  list-style: none;
  margin-left: 10px;
}
#book.container .book-detail .writing-description ul li {
  display: flex;
  align-items: center;
  column-gap: 5px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: normal;
  color: #444;
}
#book.container .book-detail .writing-description ul li::before {
  content: "";
  width: 3px;
  height: 3px;
  background: #444;
}
#book.container .book-detail .writing-description .title {
  margin-bottom: 30px;
  font-size: 24px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.42;
  letter-spacing: normal;
  color: #2f2f2f;
}
#book.container .book-detail .writing-description .title .sub {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: normal;
  color: #2f2f2f;
}
#book.container .book-detail .writing-description .red {
  font-weight: 500;
  color: #ec0047;
}
#book.container .book-detail .writing-list {
  display: flex;
  flex-direction: column;
  border-bottom: 2px solid #b1b1b1;
}
#book.container .book-detail .writing-list .item {
  width: 670px;
  padding: 23px 15px;
  border-top: 2px solid #b1b1b1;
}
#book.container .book-detail .writing-list .item .main-item {
  display: flex;
  justify-content: space-between;
  width: 100%;
  cursor: pointer;
}
#book.container .book-detail .writing-list .item .main-item span {
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #2f2f2f;
}
#book.container .book-detail .writing-list .item .main-item img {
  width: 20px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#book.container .book-detail .writing-list .item.on .main-item img {
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#book.container .book-detail .writing-list .item .sub-item {
  max-height: 0px;
  padding-top: 0px;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#book.container .book-detail .writing-list .item.on .sub-item {
  max-height: 500px;
  padding-top: 42px;
}
#book.container .book-detail .writing-pay-buttons {
  display: flex;
  margin-top: 40px;
  row-gap: 15px;
  column-gap: 20px;
}
#book.container .book-detail .writing-pay-buttons a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 270px;
  height: 54px;
  border-radius: 27px;
}
#book.container .book-detail .multi-image {
  position: relative;
  width: 970px;
  height: 645px;
  padding: 0px 78px;
  overflow: hidden;
}
#book.container .book-detail .multi-image-frame {
  width: 970px;
  height: 100%;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#book.container .book-detail .multi-image-frame .contents {
  position: relative;
  left: 0%;
  height: 100%;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#book.container .book-detail .multi-image-frame img {
  width: 100%;
  height: 100%;
}
#book.container .book-detail .multi-image-arrow {
  position: absolute;
  top: 50%;
  width: 48px;
  height: 48px;
  cursor: pointer;
}
#book.container .book-detail .multi-image-arrow.left {
  left: 0px;
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#book.container .book-detail .multi-image-arrow.right {
  right: 0px;
}
#book.container .book-detail .multi-image-buttons {
  display: flex;
  justify-content: center;
  column-gap: 7px;
  position: relative;
  top: -22px;
}
#book.container .book-detail .multi-image-buttons button {
  margin: 0px;
  padding: 0px;
  border: 0px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  opacity: 0.15;
  background-color: #000;
  color: rgba(0, 0, 0, 0);
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#book.container .book-detail .multi-image-buttons .slick-active button {
  opacity: 1;
  background-color: #fff;
}

@media all and (max-width: 768px) {
  #book.container {
    padding-top: 62px;
    padding-bottom: 80px;
  }
  #book.container .book {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
  }
  #book.container .book-title {
    font-family: NewRubrik;
    font-size: 32px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #2f2f2f;
  }
  #book.container .book-description {
    margin-top: 15px;
    margin-bottom: 30px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #book.container .book-image {
    width: 289px;
    min-height: 200px;
  }
  #book.container .book-info {
    display: flex;
    flex-direction: column;
    row-gap: 25px;
    width: 100%;
  }
  #book.container .book-info-items {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-bottom: solid 1px #e6e6e6;
    width: 100%;
  }
  #book.container .book-info-items .item {
    display: flex;
    align-items: center;
    column-gap: 0px;
    justify-content: space-between;
    box-sizing: border-box;
    width: 100%;
    padding: 20px 16px;
    border-top: solid 1px #e6e6e6;
  }
  #book.container .book-info-items .item span {
    display: flex;
    align-items: center;
    min-width: 0;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #444;
  }
  #book.container .book-info-pay {
    display: flex;
    flex-direction: column;
    row-gap: 15px;
    column-gap: 20px;
    padding: 0px 16px;
  }
  #book.container .book-info-pay a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 48px;
    border-radius: 27px;
  }
  #book.container .book-bg {
    margin-top: 100px;
    width: auto;
    height: 150px;
  }
  #book.container .book-detail {
    display: flex;
    flex-direction: column;
    row-gap: 50px;
    width: 100%;
    margin-top: 50px;
  }
  #book.container .book-detail .writing {
    display: flex;
    flex-direction: column;
    column-gap: 30px;
    margin-top: 0px;
    box-sizing: border-box;
    width: 100%;
    padding: 0px 16px;
  }
  #book.container .book-detail .writing-category {
    width: 270px;
    margin-bottom: 30px;
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #book.container .book-detail .writing-description {
    max-width: none;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #444;
  }
  #book.container .book-detail .writing-description ul {
    list-style: none;
    margin-left: 10px;
  }
  #book.container .book-detail .writing-description ul li {
    display: flex;
    align-items: flex-start;
    column-gap: 5px;
    position: relative;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.54;
    letter-spacing: normal;
    color: #444;
  }
  #book.container .book-detail .writing-description ul li::before {
    position: relative;
    top: 7px;
    content: "";
    width: 3px;
    height: 3px;
    background: #444;
  }
  #book.container .book-detail .writing-description .title {
    margin-bottom: 30px;
    font-size: 16px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #book.container .book-detail .writing-description .title .sub {
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.54;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #book.container .book-detail .writing-description .red {
    font-weight: 500;
    color: #ec0047;
  }
  #book.container .book-detail .writing-list {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid #b1b1b1;
  }
  #book.container .book-detail .writing-list .item {
    position: relative;
    left: -16px;
    width: 100%;
    padding: 23px 15px;
    border-top: 1px solid #b1b1b1;
  }
  #book.container .book-detail .writing-list .item .main-item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    cursor: pointer;
  }
  #book.container .book-detail .writing-list .item .main-item span {
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #444;
  }
  #book.container .book-detail .writing-list .item .main-item img {
    width: 20px;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #book.container .book-detail .writing-list .item.on .main-item img {
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #book.container .book-detail .writing-list .item .sub-item {
    height: 0px;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #book.container .book-detail .writing-list .item.on .sub-item {
    height: auto;
    padding-top: 42px;
  }
  #book.container .book-detail .writing-pay-buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 15px;
    column-gap: 20px;
  }
  #book.container .book-detail .writing-pay-buttons a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 48px;
    border-radius: 27px;
  }
  #book.container .book-detail .multi-image {
    position: relative;
    width: 100%;
    height: auto;
    padding: 0px;
    overflow: hidden;
  }
  #book.container .book-detail .multi-image-frame {
    width: 100%;
    height: auto;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #book.container .book-detail .multi-image-frame .contents {
    position: relative;
    left: 0%;
    height: 100%;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #book.container .book-detail .multi-image-frame img {
    width: 100%;
    height: 100%;
  }
  #book.container .book-detail .multi-image-arrow {
    position: absolute;
    top: 45%;
    width: 36px;
    height: 36px;
  }
  #book.container .book-detail .multi-image-arrow.left {
    left: 10px;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #book.container .book-detail .multi-image-arrow.right {
    right: 10px;
  }
  #book.container .book-detail .multi-image-buttons {
    display: flex;
    justify-content: center;
    column-gap: 7px;
    position: relative;
    top: -22px;
  }
  #book.container .book-detail .multi-image-buttons button {
    margin: 0px;
    padding: 0px;
    border: 0px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    opacity: 0.15;
    background-color: #000;
    color: rgba(0, 0, 0, 0);
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #book.container .book-detail .multi-image-buttons .slick-active button {
    opacity: 1;
    background-color: #fff;
  }
}
#privacy.container {
  position: relative;
  display: flex;
  justify-content: center;
  width: 100%;
  padding-bottom: 100px;
}
#privacy.container .privacy {
  position: relative;
  display: flex;
  align-items: center;
  flex-direction: column;
  width: 100%;
}
#privacy.container .privacy__title {
  position: relative;
  margin-top: 112px;
  width: 400px;
  padding-right: 770px;
  font-size: 55px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: -1.27px;
  color: #2f2f2f;
}
#privacy.container .privacy__image {
  position: absolute;
  top: 35px;
  right: 0px;
  width: 273px;
  height: 195px;
}
#privacy.container .privacy__blue-box {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: 80px;
  padding: 60px 0px;
  opacity: 0.85;
  background-color: #1199af;
  background-repeat: repeat-x;
  z-index: -1;
}
#privacy.container .privacy__blue-box__text {
  width: 970px;
  font-size: 22px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.59;
  letter-spacing: normal;
  color: #fff;
}
#privacy.container .privacy__blue-box__text .sub {
  font-size: 15px;
  line-height: 1.8;
}
#privacy.container .privacy__contents {
  display: flex;
  flex-direction: column;
  width: 970px;
  margin-top: 81px;
}
#privacy.container .privacy__contents__articles {
  display: flex;
  flex-direction: column;
  row-gap: 80px;
}
#privacy.container .privacy__contents__articles .article {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}
#privacy.container .privacy__contents__articles .article__title {
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  color: #2f2f2f;
}
#privacy.container .privacy__contents__articles .article__description {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #666;
}
#privacy.container .privacy__contents__articles .article__table--wide {
  width: 100%;
  border: solid 1px #d7d7d7;
  border-collapse: collapse;
}
#privacy.container .privacy__contents__articles .article__table--wide th {
  width: 33.3333333333%;
  padding: 9px 11px 6px 11px;
  border: solid 1px #d7d7d7;
  font-size: 15px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #2f2f2f;
  text-align: start;
}
#privacy.container .privacy__contents__articles .article__table--wide td {
  width: 33.3333333333%;
  padding: 14px 11px 11px 11px;
  border: solid 1px #d7d7d7;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #666;
}
#privacy.container .privacy__contents__articles .article__table--narrow {
  display: none;
}

@media all and (max-width: 768px) {
  #privacy.container {
    position: relative;
    display: flex;
    justify-content: center;
    width: 100%;
    padding-bottom: 100px;
  }
  #privacy.container .privacy {
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
  }
  #privacy.container .privacy__title {
    position: relative;
    margin-top: 17px;
    width: calc(100% - 40px);
    padding-right: 0;
    font-size: 30px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #privacy.container .privacy__image {
    position: absolute;
    top: 88px;
    right: 0px;
    width: 145px;
    height: 102px;
  }
  #privacy.container .privacy__blue-box {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 129px;
    padding: 30px 0px;
    opacity: 0.85;
    background-color: #1199af;
    background-repeat: repeat-x;
    z-index: -1;
  }
  #privacy.container .privacy__blue-box__text {
    width: calc(100% - 40px);
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #fff;
  }
  #privacy.container .privacy__blue-box__text .sub {
    font-size: 14px;
    line-height: 1.57;
  }
  #privacy.container .privacy__contents {
    display: flex;
    flex-direction: column;
    width: calc(100% - 40px);
    margin-top: 42px;
  }
  #privacy.container .privacy__contents__articles {
    display: flex;
    flex-direction: column;
    row-gap: 45px;
  }
  #privacy.container .privacy__contents__articles .article {
    display: flex;
    flex-direction: column;
    row-gap: 15px;
  }
  #privacy.container .privacy__contents__articles .article__title {
    font-size: 18px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #privacy.container .privacy__contents__articles .article__description {
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.8;
    letter-spacing: normal;
    color: #666;
  }
  #privacy.container .privacy__contents__articles .article__table--wide {
    display: none;
  }
  #privacy.container .privacy__contents__articles .article__table--narrow {
    display: table;
    width: 100%;
    border: solid 1px #d7d7d7;
    border-collapse: collapse;
  }
  #privacy.container .privacy__contents__articles .article__table--narrow tr {
    display: grid;
    grid-template-columns: 108px auto;
    width: 100%;
  }
  #privacy.container .privacy__contents__articles .article__table--narrow tr th {
    padding: 9px 11px 6px 11px;
    border: solid 1px #d7d7d7;
    font-size: 15px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.8;
    letter-spacing: normal;
    color: #2f2f2f;
    text-align: center;
  }
  #privacy.container .privacy__contents__articles .article__table--narrow tr td {
    padding: 14px 11px 11px 11px;
    border: solid 1px #d7d7d7;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #666;
  }
}
#terms.container {
  position: relative;
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 112px 0px 100px 0px;
}
#terms.container .terms {
  display: flex;
  flex-direction: column;
  row-gap: 102px;
  width: 970px;
}
#terms.container .terms__title {
  font-size: 55px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: -1.27px;
  color: #2f2f2f;
}
#terms.container .terms__description {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.8;
  color: #666;
}
#terms.container .terms__articles {
  display: flex;
  flex-direction: column;
  row-gap: 80px;
}
#terms.container .terms__articles .article {
  display: flex;
  flex-direction: column;
  row-gap: 15px;
}
#terms.container .terms__articles .article__title {
  font-size: 15px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #2f2f2f;
}
#terms.container .terms__articles .article__description {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #666;
}

@media all and (max-width: 768px) {
  #terms.container {
    position: relative;
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 17px 0px 100px 0px;
  }
  #terms.container .terms {
    display: flex;
    flex-direction: column;
    row-gap: 60px;
    width: calc(100% - 40px);
  }
  #terms.container .terms__title {
    font-size: 30px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #terms.container .terms__articles {
    display: flex;
    flex-direction: column;
    row-gap: 45px;
  }
  #terms.container .terms__articles .article {
    display: flex;
    flex-direction: column;
    row-gap: 15px;
  }
  #terms.container .terms__articles .article__title {
    font-size: 15px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.8;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #terms.container .terms__articles .article__description {
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.8;
    letter-spacing: normal;
    color: #666;
  }
}
#gdpr.container {
  position: relative;
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 109px 0px 100px 0px;
}
#gdpr.container .gdpr {
  width: 1170px;
}
#gdpr.container .gdpr__title {
  width: 100%;
  font-size: 55px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: -1.27px;
  color: #2f2f2f;
}
#gdpr.container .gdpr__sub-title {
  width: 100%;
  margin-top: 13px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #666;
}
#gdpr.container .gdpr__image {
  width: 715px;
  height: 194px;
  margin-top: 38px;
  margin-left: 228px;
}
#gdpr.container .gdpr__articles {
  display: flex;
  flex-direction: column;
  row-gap: 100px;
  margin-top: 60px;
}
#gdpr.container .gdpr__articles .article {
  display: grid;
  grid-template-columns: 300px 770px;
}
#gdpr.container .gdpr__articles .article__title {
  font-size: 26px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.19;
  letter-spacing: normal;
  color: #2f2f2f;
}
#gdpr.container .gdpr__articles .article__description {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: normal;
  color: #444;
}
#gdpr.container .gdpr__info {
  display: flex;
  flex-direction: column;
  row-gap: 51px;
  margin-top: 130px;
}
#gdpr.container .gdpr__info__title {
  font-size: 26px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.19;
  letter-spacing: normal;
  text-align: start;
  color: #2f2f2f;
}
#gdpr.container .gdpr__info__contents {
  display: grid;
  grid-template-columns: 270px 870px;
  column-gap: 30px;
}
#gdpr.container .gdpr__info__contents .contents__left {
  font-size: 15px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.53;
  letter-spacing: normal;
  color: #ff4766;
}
#gdpr.container .gdpr__info__contents .contents__right {
  display: flex;
  flex-direction: column;
  row-gap: 58px;
}
#gdpr.container .gdpr__info__contents .contents__right ul {
  display: flex;
  flex-direction: column;
  row-gap: 18px;
  padding-left: 14px;
}
#gdpr.container .gdpr__info__contents .contents__right ul li {
  display: flex;
  column-gap: 10px;
  align-items: center;
  position: relative;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  color: #2f2f2f;
}
#gdpr.container .gdpr__info__contents .contents__right ul li .tag {
  padding: 3px 14px;
  border-radius: 10px;
  border: solid 1px #8f8f8f;
  font-size: 11px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #8f8f8f;
}
#gdpr.container .gdpr__info__contents .contents__right ul li::before {
  content: "";
  position: absolute;
  top: 6px;
  left: -12px;
  width: 6px;
  height: 6px;
  background-color: #ff4766;
  border-radius: 3px;
}
#gdpr.container .gdpr__info__contents .contents__right .accordion {
  padding: 18px 25px;
  border-radius: 14px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
}
#gdpr.container .gdpr__info__contents .contents__right .accordion__item {
  padding: 16px 10px;
}
#gdpr.container .gdpr__info__contents .contents__right .accordion__item__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
#gdpr.container .gdpr__info__contents .contents__right .accordion__item__title span {
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #2f2f2f;
}
#gdpr.container .gdpr__info__contents .contents__right .accordion__item__title img {
  width: 20px;
  height: 20px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#gdpr.container .gdpr__info__contents .contents__right .accordion__item__title.on img {
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#gdpr.container .gdpr__info__contents .contents__right .accordion__item__description {
  height: 0px;
  padding: 0px 20px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: normal;
  color: #666;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#gdpr.container .gdpr__info__contents .contents__right .accordion__item__description.on {
  height: auto;
  padding: 36px 20px 25px 20px;
}
#gdpr.container .gdpr__info__contents .contents__right .accordion__division {
  width: 100%;
  height: 1px;
  background-color: #d7d7d7;
}

@media all and (max-width: 768px) {
  #gdpr.container {
    position: relative;
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 17px 0px 100px 0px;
  }
  #gdpr.container .gdpr {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  #gdpr.container .gdpr__title {
    width: calc(100% - 40px);
    font-size: 30px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #gdpr.container .gdpr__sub-title {
    width: calc(100% - 40px);
    margin-top: 13px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #333;
  }
  #gdpr.container .gdpr__image {
    width: calc(100% - 40px);
    height: auto;
    margin-top: 30px;
    margin-left: 0;
  }
  #gdpr.container .gdpr__articles {
    display: flex;
    flex-direction: column;
    row-gap: 60px;
    width: calc(100% - 40px);
    margin-top: 40px;
  }
  #gdpr.container .gdpr__articles .article {
    display: flex;
    flex-direction: column;
    row-gap: 15px;
  }
  #gdpr.container .gdpr__articles .article__title {
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #gdpr.container .gdpr__articles .article__description {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #444;
  }
  #gdpr.container .gdpr__info {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 15px;
    width: 100%;
    margin-top: 60px;
  }
  #gdpr.container .gdpr__info__title {
    width: calc(100% - 40px);
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #gdpr.container .gdpr__info__contents {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 45px;
  }
  #gdpr.container .gdpr__info__contents .contents__left {
    width: calc(100% - 40px);
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #ff4766;
  }
  #gdpr.container .gdpr__info__contents .contents__right {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 58px;
  }
  #gdpr.container .gdpr__info__contents .contents__right ul {
    display: flex;
    flex-direction: column;
    row-gap: 18px;
    width: calc(100% - 60px);
    padding-left: 14px;
  }
  #gdpr.container .gdpr__info__contents .contents__right ul li {
    display: flex;
    flex-direction: column;
    row-gap: 8px;
    align-items: flex-start;
    position: relative;
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #gdpr.container .gdpr__info__contents .contents__right ul li .tag {
    padding: 3px 14px;
    border-radius: 10px;
    border: solid 1px #8f8f8f;
    font-size: 11px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #8f8f8f;
  }
  #gdpr.container .gdpr__info__contents .contents__right ul li::before {
    content: "";
    position: absolute;
    top: 6px;
    left: -12px;
    width: 6px;
    height: 6px;
    background-color: #ff4766;
    border-radius: 3px;
  }
  #gdpr.container .gdpr__info__contents .contents__right .accordion {
    padding: 0px;
    border-radius: 0;
    box-shadow: none;
    background-color: #fff;
    border: 1px solid #b1b1b1;
  }
  #gdpr.container .gdpr__info__contents .contents__right .accordion__item {
    padding: 27px 20px;
  }
  #gdpr.container .gdpr__info__contents .contents__right .accordion__item__title {
    display: flex;
    column-gap: 16px;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
  }
  #gdpr.container .gdpr__info__contents .contents__right .accordion__item__title span {
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #gdpr.container .gdpr__info__contents .contents__right .accordion__item__title img {
    width: 20px;
    height: 20px;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #gdpr.container .gdpr__info__contents .contents__right .accordion__item__title.on img {
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #gdpr.container .gdpr__info__contents .contents__right .accordion__item__description {
    height: 0px;
    padding: 0px;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #666;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #gdpr.container .gdpr__info__contents .contents__right .accordion__item__description.on {
    height: auto;
    padding: 36px 0px 25px 0px;
  }
  #gdpr.container .gdpr__info__contents .contents__right .accordion__division {
    width: 100%;
    height: 1px;
    background-color: #d7d7d7;
  }
}
#my.container {
  width: 100%;
  min-width: 1280px;
  background-color: #f4f4f1;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
#my.container .inner {
  align-self: center;
  display: grid;
  place-content: center;
  gap: 20px;
  margin: 0 auto;
  max-width: 1180px;
  width: 100%;
  position: relative;
  padding: 60px 0;
  min-height: calc(100vh - 170px);
}
#my.container .division {
  width: 100%;
  height: 1px;
  background-color: #CCC;
}
#my.container .my {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 20px;
  width: 100%;
}
#my.container .my__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 50px;
}
#my.container .my__top > div {
  display: flex;
  align-items: center;
}
#my.container .my__top .logo-wrap {
  height: 45px;
}
#my.container .my__top__logo {
  height: 22px;
  padding: 15px 15px 8px 15px;
  border-right: 1px solid #c1c1c1;
}
#my.container .my__top__logo img {
  display: block;
}
#my.container .my__top__home {
  transform: translateY(2px);
  padding: 15px 15px 8px 15px;
  font-size: 22px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
}
#my.container .my__top__user {
  padding: 16px 20px;
  position: relative;
}
#my.container .my__top__user .user__image {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
}
#my.container .my__top__user .user__image:hover {
  background-color: rgba(0, 0, 0, 0.06);
}
#my.container .my__top__user .user--hide {
  display: none;
  flex-direction: column;
  row-gap: 16px;
  position: absolute;
  right: 10px;
  top: 50px;
  box-sizing: border-box;
  width: 220px;
  padding: 16px;
  border-radius: 10px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  text-align: start;
  color: #767676;
  z-index: 10;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#my.container .my__top__user .user--hide .name {
  padding: 0px 10px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #3096a7;
}
#my.container .my__top__user .user--hide .division {
  height: 1px;
  background-color: #d7d7d7;
}
#my.container .my__top__user .user--hide .buttons {
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}
#my.container .my__top__user .user--hide .button {
  display: flex;
  align-items: center;
  margin: 0px 10px;
  padding: 6px 0 6px 10px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
}
#my.container .my__top__user .user--hide .button:hover {
  background-color: rgba(0, 0, 0, 0.06);
}
#my.container .my__top__user .user--hide .button.sub {
  font-size: 13px;
}
#my.container .my__top__user .user--hide .button.sub::before {
  content: "•";
  padding: 0 6px 0 4px;
  color: #999999;
}
#my.container .my__top__user .user--hide .options {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}
#my.container .my__top__user .user--hide .button--border {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 0px;
  border: solid 1px #bbb;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 13px;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}
#my.container .my__top__user .user--hide .button--border:hover {
  background-color: rgba(0, 0, 0, 0.06);
}
#my.container .my__top__user .user--hide .lang {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 10px;
}
#my.container .my__top__user .user--hide .lang .select {
  position: relative;
  display: flex;
  column-gap: 5px;
  align-items: center;
  padding: 6px 12px 6px 6px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  cursor: pointer;
}
#my.container .my__top__user .user--hide .lang .select__name {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
}
#my.container .my__top__user .user--hide .lang .select--show {
  display: flex;
  column-gap: 5px;
  align-items: center;
}
#my.container .my__top__user .user--hide .lang .select--hide {
  display: none;
  position: absolute;
  top: -1px;
  left: -1px;
  width: 90px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  overflow: hidden;
}
#my.container .my__top__user .user--hide .lang .select--hide li {
  display: flex;
  column-gap: 10px;
  align-items: center;
  padding: 6px;
  cursor: pointer;
}
#my.container .my__top__user .user--hide .lang .select--hide li:hover {
  background-color: #ebebeb;
}
#my.container .my__top__user .user--hide .lang .select--hide li img {
  border-radius: 50%;
  background-color: #fff;
}
#my.container .my__top__user .user--hide .lang .select--hide li span {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
}
#my.container .my__top__user .user--hide.open {
  display: flex;
}
#my.container .my .box {
  display: grid;
  flex: 1;
  grid-template-rows: 356px 4px 130px;
  height: 490px;
  border-radius: 14px;
  box-shadow: 0 15px 15px -10px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#my.container .my .box:hover {
  border: solid 3px #ec0047;
  margin: -3px;
  box-shadow: 0 35px 35px -16px rgba(0, 0, 0, 0.25);
}
#my.container .my .box__top {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 30px;
  align-items: center;
  cursor: pointer;
}
#my.container .my .box__top__title {
  margin-top: 60px;
  font-family: NewRubrik;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: -1px;
  text-align: center;
  color: #ec0047;
  font-size: 28px;
  line-height: 42px;
}
#my.container .my .box__top__title.col {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 38px;
}
#my.container .my .box__top__title .peek-logo {
  background: url("https://dream-cdn.beusable.net/home/images/my/peek-logo.svg") no-repeat center/contain;
  width: 93px;
  height: 20px;
  display: block;
  margin-block: 11px 10px;
}
#my.container .my .box__top__label {
  font-size: 20px;
  line-height: 100%;
  letter-spacing: -1px;
}
#my.container .my .box__top__image {
  width: 240px;
}
#my.container .my .box__top__button {
  position: absolute;
  left: 50%;
  bottom: 25px;
  transform: translateX(-50%);
  padding: 12px 15px 12px 36px;
  border: solid 1px #ec0047;
  border-radius: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-right-red.svg") no-repeat 10% center;
  background-size: 16px;
  background-color: #fff;
  font-size: 14px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #ec0047;
}
#my.container .my .box__top:hover .box__top__button {
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-right-white.svg") no-repeat 10% center;
  background-color: #ec0047;
  color: #fff;
}
#my.container .my .box__division {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
}
#my.container .my .box__bottom {
  display: flex;
  flex-direction: column;
  row-gap: 5px;
  align-items: center;
  justify-content: center;
  background-color: #f8f8f8;
  border-radius: 0px 0px 14px 14px;
}
#my.container .my .box__bottom__title {
  display: flex;
  column-gap: 5px;
  align-items: center;
  cursor: pointer;
}
#my.container .my .box__bottom__title h4 {
  color: #444;
  text-align: center;
  font-size: 15px;
  font-weight: 700;
  line-height: 150%;
}
#my.container .my .box__bottom__title .info {
  position: relative;
}
#my.container .my .box__bottom__title .info--hide {
  display: none;
  position: absolute;
  right: -93px;
  bottom: 28px;
  box-sizing: border-box;
  min-width: 220px;
  padding: 16px;
  border-radius: 10px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  text-align: start;
  color: #767676;
  z-index: 10;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#my.container .my .box__bottom__title .info--hide .title {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #ec0047;
}
#my.container .my .box__bottom__title .info--hide .description {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #444;
}
#my.container .my .box__bottom__title .info--hide::after {
  content: "";
  position: absolute;
  bottom: -1px;
  right: 93px;
  background-color: #fff;
  z-index: 2;
  transform: rotate(-45deg) translateX(-50%);
  width: 10px;
  height: 10px;
  -webkit-box-shadow: -1px 1px 0 0 rgba(0, 0, 0, 0.16);
  box-shadow: -1px 1px 0 0 rgba(0, 0, 0, 0.16);
}
#my.container .my .box__bottom__title:hover .info--hide {
  display: block;
}
#my.container .my .box__bottom__battery {
  position: relative;
  display: flex;
  column-gap: 5px;
  align-items: center;
  padding: 0px 5px;
  border-radius: 5px;
  cursor: pointer;
}
#my.container .my .box__bottom__battery .icon {
  position: relative;
  width: 30px;
  height: 30px;
  background: url("https://dream-cdn.beusable.net/home/images/my/battery.svg") no-repeat 0% center;
}
#my.container .my .box__bottom__battery .icon__fill {
  position: absolute;
  top: 11px;
  left: 5px;
  height: 8px;
  padding-left: 3px;
}
#my.container .my .box__bottom__battery .percentage {
  font-size: 15px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #666;
}
#my.container .my .box__bottom__battery .battery--hide {
  display: none;
  position: absolute;
  right: -72px;
  bottom: 40px;
  box-sizing: border-box;
  width: 208px;
  padding: 16px;
  border-radius: 10px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  text-align: start;
  color: #767676;
  z-index: 10;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#my.container .my .box__bottom__battery .battery--hide .title {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #ec0047;
}
#my.container .my .box__bottom__battery .battery--hide .description {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #444;
}
#my.container .my .box__bottom__battery .battery--hide::after {
  content: "";
  position: absolute;
  bottom: -1px;
  right: 93px;
  background-color: #fff;
  z-index: 2;
  transform: rotate(-45deg) translateX(-50%);
  width: 10px;
  height: 10px;
  -webkit-box-shadow: -1px 1px 0 0 rgba(0, 0, 0, 0.16);
  box-shadow: -1px 1px 0 0 rgba(0, 0, 0, 0.16);
}
#my.container .my .box__bottom__battery:hover {
  background-color: rgba(0, 0, 0, 0.06);
}
#my.container .my .box__bottom__battery:hover .battery--hide {
  display: block;
}
#my.container .my .box__bottom__setting {
  cursor: pointer;
}
#my.container .my .box__bottom__setting > a {
  display: flex;
  align-items: center;
}
#my.container .my .box__bottom__setting img {
  border-radius: 50%;
  padding: 5px;
}
#my.container .my .box__bottom__setting:hover .setting {
  background-color: rgba(0, 0, 0, 0.06);
}
#my.container .my .box__bottom__setting span {
  color: #444;
  font-size: 13px;
  font-weight: 500;
  line-height: 100%;
  margin-top: 2px;
}
#my.container .my .box__bottom__setting span.red {
  color: #ec0047;
}
#my.container .my .box__bottom__setting span.blue {
  color: #0275FF;
}
#my.container .ads {
  display: flex;
  align-items: stretch;
  gap: 20px;
  cursor: pointer;
}
#my.container .ads__item {
  min-height: 102px;
  position: relative;
}
#my.container .ads__item:before {
  z-index: 1;
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(255, 255, 255, 0.12);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
#my.container .ads__item:hover:before {
  opacity: 1;
  visibility: visible;
}
#my.container .ads__item img {
  display: block;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
#my.container .ads__item .title-wrap {
  position: relative;
  z-index: 1;
}
#my.container .ads__item .desc {
  position: relative;
  z-index: 1;
}
#my.container .ads .left-box {
  display: flex;
  flex-direction: column;
  gap: 20px;
  flex: 1;
}
#my.container .ads .left-box .ads__item {
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  height: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: center;
  padding: 0 22px;
}
#my.container .ads .left-box .ads__item-1 {
  background-image: url(https://dream-cdn.beusable.net/home/images/my/small-ads-1.png);
}
#my.container .ads .left-box .ads__item-2 {
  background-image: url(https://dream-cdn.beusable.net/home/images/my/small-ads-2.png);
}
#my.container .ads .left-box .ads__item .title-wrap {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}
#my.container .ads .left-box .ads__item .title-wrap .title {
  color: #FFF;
  font-size: 15px;
  font-weight: 700;
  line-height: 100%;
}
#my.container .ads .left-box .ads__item .title-wrap .label {
  padding-bottom: 1px;
  color: #FFF;
  font-size: 12px;
  font-weight: 600;
  line-height: 100%;
}
#my.container .ads .left-box .ads__item .desc {
  padding-left: 2px;
  color: #FFF;
  font-size: 26px;
  font-weight: 700;
  line-height: 120%;
  letter-spacing: -0.26px;
}
#my.container .ads .left-box .ads__item .desc .accent {
  color: #FFD900;
}
#my.container .ads .left-box .ads-img {
  z-index: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#my.container .ads .right-box {
  width: 490px;
  max-width: 490px;
  border-radius: 8px;
  overflow: hidden;
}
#my.container .ads .right-box .ads__item {
  box-sizing: border-box;
  padding: 26px 24px 36px;
  display: flex;
  flex-direction: column;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  height: 100%;
}
#my.container .ads .right-box .ads__item-1 {
  background-image: url(https://dream-cdn.beusable.net/home/images/my/lg-ads-1.png);
}
#my.container .ads .right-box .ads__item-2 {
  background-image: url(https://dream-cdn.beusable.net/home/images/my/lg-ads-2.png);
}
#my.container .ads .right-box .ads__item-3 {
  background-image: url(https://dream-cdn.beusable.net/home/images/my/lg-ads-3.png);
}
#my.container .ads .right-box .ads__item:after {
  content: "";
  width: 100%;
  height: 100%;
  opacity: 0.7;
  background: #31241E;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#my.container .ads .right-box .ads__item .title-wrap {
  display: flex;
  align-items: center;
  gap: 2px;
}
#my.container .ads .right-box .ads__item .title-wrap .title {
  color: #FFF;
  font-size: 16px;
  font-weight: 700;
  line-height: 100%;
}
#my.container .ads .right-box .ads__item .desc {
  color: #FFF;
  font-size: 18px;
  font-weight: 600;
  line-height: 150%;
  letter-spacing: -0.18px;
  margin-top: auto;
}
#my.container .ads .right-box .swiper-pagination {
  bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
#my.container .ads .right-box .swiper-pagination .swiper-pagination-bullet {
  margin: 0;
  width: 8px;
  height: 8px;
  background: rgba(255, 255, 255, 0.32);
  opacity: 1;
  display: block;
  flex-shrink: 0;
}
#my.container .ads .right-box .swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
}

#signin.container {
  width: 100%;
  height: 100vh;
  min-height: 736px;
  box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #e3e6c7;
}
#signin.container .signin {
  display: grid;
  align-items: center;
  grid-template-columns: 348px auto;
  width: 100%;
  height: 100%;
}
#signin.container .signin .form {
  position: relative;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  width: 340px;
  height: calc(100% - 16px);
  min-height: 720px;
  margin-left: 8px;
  padding: 0px 40px;
  border-radius: 14px;
  box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
}
#signin.container .signin .form__contents {
  display: flex;
  flex-direction: column;
  width: 100%;
}
#signin.container .signin .form__contents__logo {
  display: inline;
  margin-left: 5px;
  width: 115px;
}
#signin.container .signin .form__contents__title {
  margin-top: 20px;
  font-size: 40px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #555;
}
#signin.container .signin .form__contents__sub-title {
  margin-left: 5px;
  margin-top: 20px;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #666;
}
#signin.container .signin .form__contents__input {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 5px;
  margin-top: 25px;
}
#signin.container .signin .form__contents__input label {
  margin-left: 5px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #767676;
}
#signin.container .signin .form__contents__input input {
  height: 38px;
  padding: 10px 12px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 14px;
  letter-spacing: normal;
  color: #000;
  font-family: system-ui;
}
#signin.container .signin .form__contents__input input::placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 14px;
  letter-spacing: normal;
  color: #bbb;
  font-family: system-ui;
}
#signin.container .signin .form__contents__input input:focus {
  border: solid 1px #289eef;
  outline: 0px;
}
#signin.container .signin .form__contents__input input[disabled] {
  background-color: #d7d7d7;
  opacity: 0.3;
}
#signin.container .signin .form__contents__input input.error-line {
  border: solid 1px #ec0047;
}
#signin.container .signin .form__contents__input input::-ms-reveal, #signin.container .signin .form__contents__input input::-ms-clear {
  display: none !important;
  visibility: hidden;
  opacity: 0;
}
#signin.container .signin .form__contents__input input:focus::-webkit-textfield-decoration-container {
  visibility: hidden;
}
#signin.container .signin .form__contents__input .eye {
  position: absolute;
  top: 48%;
  right: 10px;
  width: 20px;
  height: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-eye-off.svg") no-repeat center center;
}
#signin.container .signin .form__contents__input .eye.on {
  background: url("https://dream-cdn.beusable.net/home/images/icon-eye-on.svg") no-repeat center center;
}
#signin.container .signin .form__contents__input .close {
  display: none;
  position: absolute;
  top: 52%;
  right: 12px;
  width: 14px;
  height: 14px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-input-close.svg") no-repeat center center;
}
#signin.container .signin .form__contents__input .close.on {
  display: block;
}
#signin.container .signin .form__contents__input .error {
  display: none;
  position: absolute;
  left: 4px;
  bottom: -15px;
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #e60724;
}
#signin.container .signin .form__contents__button {
  width: 100%;
  margin-top: 30px;
  padding: 12px 0px;
  border-radius: 20px;
  background-color: #ec0047;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#signin.container .signin .form__contents__option {
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 10px;
  margin-top: 20px;
}
#signin.container .signin .form__contents__option .division {
  width: 1px;
  height: 12px;
  background-color: #d7d7d7;
}
#signin.container .signin .form__contents__option a {
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #666;
}
#signin.container .signin .form__footer {
  position: absolute;
  bottom: 30px;
  display: flex;
  flex-direction: column;
  row-gap: 15px;
  align-items: center;
  box-sizing: border-box;
  width: calc(100% - 80px);
}
#signin.container .signin .form__footer span,
#signin.container .signin .form__footer a {
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #666;
  text-align: center;
}
#signin.container .signin .form__footer__lang {
  display: flex;
  column-gap: 10px;
  align-items: center;
}
#signin.container .signin .form__footer__lang .select {
  position: relative;
  display: flex;
  column-gap: 6px;
  align-items: center;
  padding: 5px 12px 5px 6px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  cursor: pointer;
}
#signin.container .signin .form__footer__lang .select__name {
  margin-right: 5px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
}
#signin.container .signin .form__footer__lang .select--hide {
  display: none;
  position: absolute;
  top: -1px;
  left: -1px;
  overflow: hidden;
  width: 99px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
}
#signin.container .signin .form__footer__lang .select--hide li {
  display: flex;
  column-gap: 10px;
  align-items: center;
  padding: 5px;
  cursor: pointer;
}
#signin.container .signin .form__footer__lang .select--hide li:hover {
  background-color: #ebebeb;
}
#signin.container .signin .form__footer__lang .select--hide li img {
  border-radius: 50%;
  background-color: #fff;
}
#signin.container .signin .form__footer__lang .select--hide li span {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
}
#signin.container .signin__bg {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
}
#signin.container .signin__bg h2 {
  font-family: NewRubrik;
  font-size: 30px;
  color: #ec0047;
  text-align: center;
}
@-webkit-keyframes slide-in-fwd-center {
  0% {
    -webkit-transform: translateZ(-1400px);
    transform: translateZ(-1400px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1;
  }
}
@keyframes slide-in-fwd-center {
  0% {
    -webkit-transform: translateZ(-1400px);
    transform: translateZ(-1400px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    opacity: 1;
  }
}
#signin.container .popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  perspective: 500px;
}
#signin.container .popup .signup {
  display: grid;
  grid-template-columns: 240px 340px;
  column-gap: 40px;
  position: relative;
  box-sizing: border-box;
  width: 720px;
  height: 480px;
  border-radius: 14px;
  padding-left: 40px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
}
#signin.container .popup .signup .logo {
  position: absolute;
  left: 40px;
  top: 40px;
  width: 112px;
}
#signin.container .popup .signup--left {
  display: flex;
  flex-direction: column;
  row-gap: 18px;
  margin-top: 123px;
}
#signin.container .popup .signup--right {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 30px;
  margin-top: 80px;
}
#signin.container .popup .signup--right.step-2 {
  margin-top: 145px;
}
#signin.container .popup .signup__title {
  font-size: 40px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #555;
}
#signin.container .popup .signup__title.step-2 {
  font-size: 30px;
  font-weight: 500;
}
#signin.container .popup .signup__sub-title {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: normal;
  color: #666;
}
#signin.container .popup .signup__rocket {
  width: 70px;
  height: 70px;
}
#signin.container .popup .signup__input {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 5px;
}
#signin.container .popup .signup__input label {
  margin-left: 5px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #767676;
}
#signin.container .popup .signup__input input {
  height: 38px;
  padding: 10px 12px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 14px;
  letter-spacing: normal;
  color: #000;
  font-family: system-ui;
}
#signin.container .popup .signup__input input::placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 14px;
  letter-spacing: normal;
  color: #bbb;
  font-family: system-ui;
}
#signin.container .popup .signup__input input:focus {
  border: solid 1px #289eef;
  outline: 0px;
}
#signin.container .popup .signup__input input[disabled] {
  background-color: #d7d7d7;
  opacity: 0.3;
}
#signin.container .popup .signup__input input.error-line {
  border: solid 1px #ec0047;
}
#signin.container .popup .signup__input input::-ms-reveal, #signin.container .popup .signup__input input::-ms-clear {
  display: none !important;
  visibility: hidden;
  opacity: 0;
}
#signin.container .popup .signup__input input:focus::-webkit-textfield-decoration-container {
  visibility: hidden;
}
#signin.container .popup .signup__input .eye {
  position: absolute;
  top: 48%;
  right: 10px;
  width: 20px;
  height: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-eye-off.svg") no-repeat center center;
  cursor: pointer;
}
#signin.container .popup .signup__input .eye.on {
  background: url("https://dream-cdn.beusable.net/home/images/icon-eye-on.svg") no-repeat center center;
}
#signin.container .popup .signup__input .error {
  display: none;
  position: absolute;
  left: 4px;
  bottom: -20px;
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #e60724;
}
#signin.container .popup .signup__input .close {
  display: none;
  position: absolute;
  top: 52%;
  right: 12px;
  width: 14px;
  height: 14px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-input-close.svg") no-repeat center center;
  cursor: pointer;
}
#signin.container .popup .signup__input .close.on {
  display: block;
}
#signin.container .popup .signup__select {
  display: flex;
  flex-direction: column;
  row-gap: 5px;
}
#signin.container .popup .signup__select label {
  margin-left: 5px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #767676;
}
#signin.container .popup .signup__select .select {
  position: relative;
  box-sizing: border-box;
  height: 38px;
  padding: 12px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 97% center;
}
#signin.container .popup .signup__select .select--show {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
  cursor: pointer;
}
#signin.container .popup .signup__select .select--hide {
  position: absolute;
  top: -1px;
  left: -1px;
  display: none;
  width: 100%;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  z-index: 1;
  overflow: hidden;
}
#signin.container .popup .signup__select .select--hide .item {
  padding: 12px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
  cursor: pointer;
}
#signin.container .popup .signup__select .select--hide .item:hover {
  background-color: #ebebeb;
}
#signin.container .popup .signup__select .description {
  position: relative;
  left: 4px;
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #767676;
}
#signin.container .popup .signup__term .ui-checkbox .error {
  display: none;
  position: absolute;
  left: 26px;
  bottom: -32px;
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.3;
  letter-spacing: normal;
  color: #e60724;
}
#signin.container .popup .signup__buttons {
  position: absolute;
  bottom: 25px;
  display: flex;
  justify-content: center;
  column-gap: 5px;
  width: 100%;
  height: 38px;
}
#signin.container .popup .signup__buttons .cancel {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  padding: 12px 0;
  border-radius: 20px;
  border: solid 1px #bbb;
  background-color: #fff;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}
#signin.container .popup .signup__buttons .continue {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  padding: 12px 0;
  border-radius: 20px;
  background-color: #ec0047;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#signin.container .popup .reset-pw {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  width: 430px;
  height: 327px;
  border-radius: 14px;
  padding: 25px 30px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
}
#signin.container .popup .reset-pw__image {
  width: 50px;
  height: 50px;
  margin-top: 25px;
}
#signin.container .popup .reset-pw__title {
  margin-top: 15px;
  font-size: 20px;
  line-height: 23px;
  color: #444;
  text-align: center;
}
#signin.container .popup .reset-pw__input {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 5px;
  width: 100%;
  margin-top: 25px;
}
#signin.container .popup .reset-pw__input label {
  margin-left: 5px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #767676;
}
#signin.container .popup .reset-pw__input input {
  height: 38px;
  padding: 10px 12px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 14px;
  letter-spacing: normal;
  color: #000;
  font-family: system-ui;
}
#signin.container .popup .reset-pw__input input::placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 14px;
  letter-spacing: normal;
  color: #bbb;
  font-family: system-ui;
}
#signin.container .popup .reset-pw__input input:focus {
  border: solid 1px #289eef;
  outline: 0px;
}
#signin.container .popup .reset-pw__input input[disabled] {
  background-color: #d7d7d7;
  opacity: 0.3;
}
#signin.container .popup .reset-pw__input input.error-line {
  border: solid 1px #ec0047;
}
#signin.container .popup .reset-pw__input .error {
  display: none;
  position: absolute;
  left: 4px;
  bottom: -20px;
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #e60724;
}
#signin.container .popup .reset-pw__buttons {
  position: absolute;
  bottom: 25px;
  display: flex;
  justify-content: center;
  column-gap: 5px;
  width: 100%;
  height: 38px;
}
#signin.container .popup .reset-pw__buttons .cancel {
  width: 100px;
  padding: 12px 0;
  border-radius: 20px;
  border: solid 1px #bbb;
  background-color: #fff;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}
#signin.container .popup .reset-pw__buttons .continue {
  width: 100px;
  padding: 12px 0;
  border-radius: 20px;
  background-color: #ec0047;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#signin.container .popup .email-send {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  width: 430px;
  border-radius: 14px;
  padding: 25px 30px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
}
#signin.container .popup .email-send__image {
  width: 50px;
  height: 50px;
  margin-top: 25px;
}
#signin.container .popup .email-send__title {
  margin-top: 15px;
  font-size: 20px;
  line-height: 23px;
  color: #444;
  text-align: center;
}
#signin.container .popup .email-send__sub-title {
  flex-grow: 1;
  margin-top: 22px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: normal;
  text-align: center;
  color: #2f2f2f;
}
#signin.container .popup .email-send__buttons {
  margin-top: 25px;
  display: flex;
  justify-content: center;
  column-gap: 5px;
  width: 100%;
  height: 38px;
}
#signin.container .popup .email-send__buttons .cancel {
  width: 100px;
  padding: 12px 0;
  border-radius: 20px;
  border: solid 1px #bbb;
  background-color: #fff;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}
#signin.container .popup .email-send__buttons .continue {
  width: 70px;
  padding: 12px 0;
  border-radius: 20px;
  border: solid 1px #bbb;
  background-color: #fff;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}
#signin.container .popup .referral-modal {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  width: 430px;
  border-radius: 14px;
  padding: 25px 30px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
}
#signin.container .popup .referral-modal__image {
  width: 50px;
  height: 50px;
  margin-top: 25px;
}
#signin.container .popup .referral-modal__title {
  margin-top: 15px;
  font-size: 20px;
  line-height: 23px;
  color: #444;
  text-align: center;
}
#signin.container .popup .referral-modal__sub-title {
  flex-grow: 1;
  margin-top: 22px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: normal;
  text-align: center;
  color: #2f2f2f;
}
#signin.container .popup .referral-modal__link {
  display: inline-flex;
  margin-top: 12px;
  color: #0074FF;
  font-size: 13px;
  line-height: 150%;
}
#signin.container .popup .referral-modal__link:before {
  content: url(../../images/icon-link-blue.svg);
  margin-right: 4px;
}
#signin.container .popup .referral-modal__contact {
  margin-top: 12px;
  color: #0074FF;
  font-size: 12px;
  line-height: 150%;
}
#signin.container .popup .referral-modal__contact a, #signin.container .popup .referral-modal__contact a:-webkit-any-link {
  color: #0074FF;
  text-decoration: underline;
}
#signin.container .popup .referral-modal .applied-service {
  width: 100%;
  padding: 20px 0;
  margin-top: 28px;
  border-top: 1px dashed #d7d7d7;
  border-bottom: 1px dashed #d7d7d7;
  text-align: center;
}
#signin.container .popup .referral-modal .applied-service-label {
  padding: 4px 0 20px;
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 500;
}
#signin.container .popup .referral-modal .applied-service-list {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 28px;
}
#signin.container .popup .referral-modal .applied-service-list .ba-logo {
  display: none;
  width: 101px;
  height: 16px;
  background-image: url("../../images/logo-journeymap-red.svg");
}
#signin.container .popup .referral-modal .applied-service-list .beus-logo {
  display: none;
  width: 97px;
  height: 16px;
  background-image: url("../../images/logo-heatmap-red.svg");
}
#signin.container .popup .referral-modal__buttons {
  margin-top: 42px;
  display: flex;
  justify-content: center;
  column-gap: 5px;
  width: 100%;
  height: 38px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
}
#signin.container .popup .referral-modal__buttons .cancel {
  padding: 12px 18px;
  border-radius: 20px;
  border: solid 1px #bbb;
  background-color: #fff;
  color: #444;
}
#signin.container .popup .referral-modal__buttons .continue {
  padding: 12px 18px;
  border-radius: 20px;
  border: solid 1px #EC0047;
  background-color: #fff;
  color: #EC0047;
}
#signin.container .popup .set-referral {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  width: 428px;
  border-radius: 14px;
  padding: 24px 28px;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
}
#signin.container .popup .set-referral .icon-star-badge {
  width: 52px;
  height: 52px;
  background-image: url("../../images/icon-star-badge.svg");
}
#signin.container .popup .set-referral__title {
  margin-top: 12px;
  font-size: 20px;
  line-height: 1.2;
  color: #444;
}
#signin.container .popup .set-referral__sub-title {
  margin: 36px 0 24px 0;
  color: #2F2F2F;
  font-size: 14px;
  line-height: 150%;
}
#signin.container .popup .set-referral input.error-line {
  border: solid 1px #ec0047;
}
#signin.container .popup .set-referral input .error {
  display: none;
  position: absolute;
  left: 4px;
  bottom: -20px;
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #e60724;
}
#signin.container .popup .set-referral__service {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  padding: 20px 0 0;
  margin-top: 28px;
  border-top: 1px solid #D7D7D7;
}
#signin.container .popup .set-referral__service-title {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
}
#signin.container .popup .set-referral__service-list {
  display: flex;
  align-items: center;
  gap: 32px;
  margin: 0 20px;
}
#signin.container .popup .set-referral__service-list .system-font {
  color: #2F2F2F;
}
#signin.container .popup .set-referral__service-terms {
  width: 100%;
  padding: 20px;
  border-radius: 6px;
  border: 1px solid #d7d7d7;
  background-color: #f4f4f4;
  box-sizing: border-box;
  text-align: left;
}
#signin.container .popup .set-referral__service-terms .terms-title {
  margin-bottom: 12px;
  font-size: 13px;
  line-height: 1.2;
}
#signin.container .popup .set-referral__service-terms .terms-title .link {
  color: #2F2F2F;
  text-decoration: underline;
  word-break: break-all;
}
#signin.container .popup .set-referral__service-terms .terms-title .necessary {
  color: #E60724;
  margin-left: 4px;
}
#signin.container .popup .set-referral__service-terms .terms-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
  color: #666;
  font-size: 13px;
  line-height: 1.46;
  list-style-type: disc;
  padding-left: 20px;
}
#signin.container .popup .set-referral__service-confirm {
  justify-content: center;
}
#signin.container .popup .set-referral__service-confirm .system-font {
  color: #2F2F2F;
}
#signin.container .popup .set-referral__buttons {
  margin-top: 36px;
  display: flex;
  justify-content: center;
  column-gap: 4px;
  width: 100%;
  height: 38px;
  font-size: 14px;
  line-height: 1;
}
#signin.container .popup .set-referral__buttons .cancel {
  height: 38px;
  padding: 0 18px;
  border-radius: 20px;
  border: solid 1px #bbb;
  background-color: #fff;
  color: #444;
  font-weight: 600;
}
#signin.container .popup .set-referral__buttons .continue {
  height: 38px;
  padding: 0 18px;
  border-radius: 20px;
  border: solid 1px #EC0047;
  background-color: #fff;
  color: #EC0047;
  font-weight: 600;
}
#signin.container .popup .set-referral__buttons .continue[disabled] {
  opacity: 0.3;
}

.signin-mobile {
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 40px;
  width: 100%;
  height: 100vh;
  background-color: #fff;
}
.signin-mobile p {
  width: 210px;
  text-align: center;
  font-size: 16px;
  line-height: 1.5;
  color: #444;
}
.signin-mobile a {
  display: flex;
  column-gap: 12px;
  padding: 12px 15px;
  border: 1px solid #bbb;
  border-radius: 20px;
  font-size: 14px;
  color: #444;
}
.signin-mobile a img {
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

@media all and (max-width: 768px) {
  #signin.container {
    width: 100%;
    height: 100vh;
    box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.08);
    background-color: #e3e6c7;
  }
  #signin.container .signin {
    display: grid;
    align-items: center;
    grid-template-columns: 100%;
    width: 100%;
    height: 100%;
  }
  #signin.container .signin .form {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    row-gap: 18px;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    margin-left: 0;
    padding: 0px 40px;
    border-radius: 14px;
    box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.08);
    background-color: #fff;
  }
  #signin.container .signin .form__contents {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  #signin.container .signin .form__contents__logo {
    display: inline;
    margin-left: 5px;
    width: 115px;
  }
  #signin.container .signin .form__contents__title {
    margin-top: 20px;
    font-size: 40px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #555;
  }
  #signin.container .signin .form__contents__sub-title {
    margin-left: 5px;
    margin-top: 20px;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: normal;
    color: #666;
  }
  #signin.container .signin .form__contents__input {
    display: flex;
    flex-direction: column;
    row-gap: 5px;
    margin-top: 25px;
  }
  #signin.container .signin .form__contents__input label {
    margin-left: 5px;
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #767676;
  }
  #signin.container .signin .form__contents__input input {
    padding: 12px;
    border-radius: 6px;
    border: solid 1px #bbb;
    background-color: #fff;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #bbb;
  }
  #signin.container .signin .form__contents__button {
    width: 100%;
    margin-top: 30px;
    padding: 12px 0px;
    border-radius: 20px;
    background-color: #ec0047;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
  }
  #signin.container .signin .form__contents__option {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 10px;
    margin-top: 20px;
  }
  #signin.container .signin .form__contents__option .division {
    width: 1px;
    height: 12px;
    background-color: #d7d7d7;
  }
  #signin.container .signin .form__contents__option a {
    font-size: 13px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: normal;
    color: #666;
  }
  #signin.container .signin .form__footer {
    position: initial;
    bottom: 30px;
    display: flex;
    flex-direction: column;
    row-gap: 15px;
    align-items: center;
    box-sizing: border-box;
    width: calc(100% - 80px);
  }
  #signin.container .signin .form__footer span,
  #signin.container .signin .form__footer a {
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #666;
    text-align: center;
  }
  #signin.container .signin .form__footer__lang {
    display: flex;
    column-gap: 10px;
    align-items: center;
  }
  #signin.container .signin .form__footer__lang .select {
    position: relative;
    display: flex;
    column-gap: 5px;
    align-items: center;
    padding: 6px 12px 6px 6px;
    border-radius: 6px;
    border: solid 1px #bbb;
    background-color: #fff;
    cursor: pointer;
  }
  #signin.container .signin .form__footer__lang .select__name {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #signin.container .signin .form__footer__lang .select--hide {
    display: none;
    position: absolute;
    top: -1px;
    left: -1px;
    width: 90px;
    border-radius: 6px;
    border: solid 1px #bbb;
    background-color: #fff;
  }
  #signin.container .signin .form__footer__lang .select--hide li {
    display: flex;
    column-gap: 10px;
    align-items: center;
    padding: 6px;
    cursor: pointer;
  }
  #signin.container .signin .form__footer__lang .select--hide li:hover {
    background-color: #ebebeb;
  }
  #signin.container .signin .form__footer__lang .select--hide li span {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #signin.container .signin__bg {
    display: none;
    flex-direction: column;
    row-gap: 32px;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100vh;
  }
  #signin.container .signin__bg h2 {
    font-family: NewRubrik;
    font-size: 30px;
    color: #ec0047;
    text-align: center;
  }
  #signin.container .popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
  }
  #signin.container .popup .signup {
    display: flex;
    flex-direction: column;
    column-gap: 40px;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 14px;
    padding: 0px 35px;
    box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
    background-color: #fff;
  }
  #signin.container .popup .signup--left {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 18px;
    margin-top: 0;
  }
  #signin.container .popup .signup--right {
    position: relative;
    display: flex;
    flex-direction: column;
    row-gap: 30px;
    margin-top: 80px;
  }
  #signin.container .popup .signup--right .step-2 {
    margin-top: 145px;
  }
  #signin.container .popup .signup__title {
    font-size: 40px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #555;
  }
  #signin.container .popup .signup__sub-title {
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: normal;
    text-align: center;
    color: #666;
  }
  #signin.container .popup .signup__rocket {
    display: none;
    width: 70px;
    height: 70px;
  }
  #signin.container .popup .signup__input {
    display: flex;
    flex-direction: column;
    row-gap: 5px;
  }
  #signin.container .popup .signup__input label {
    margin-left: 5px;
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #767676;
  }
  #signin.container .popup .signup__input input {
    padding: 12px;
    border-radius: 6px;
    border: solid 1px #bbb;
    background-color: #fff;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #bbb;
  }
  #signin.container .popup .signup__term .ui-checkbox {
    position: relative;
    display: flex;
    align-items: center;
    column-gap: 6px;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: normal;
    color: #666;
  }
  #signin.container .popup .signup__term .ui-checkbox .box {
    width: 18px;
    height: 18px;
    position: relative;
  }
  #signin.container .popup .signup__term .ui-checkbox .box::before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    height: 20px;
    width: 20px;
    background: url("https://dream-cdn.beusable.net/home/images/icon-checkbox-red.svg") transparent no-repeat center center;
    background-size: 20px 20px;
    opacity: 0;
  }
  #signin.container .popup .signup__term .ui-checkbox .box:checked::before {
    opacity: 1;
  }
  #signin.container .popup .signup__term .ui-checkbox a {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: normal;
    color: #666;
    text-decoration: underline;
  }
  #signin.container .popup .signup__term .ui-checkbox .error {
    display: none;
    position: absolute;
    left: 24px;
    bottom: -20px;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #e60724;
  }
  #signin.container .popup .signup__buttons {
    position: initial;
    display: flex;
    flex-direction: column;
    justify-content: center;
    column-gap: 5px;
    row-gap: 5px;
    width: 100%;
    height: auto;
    margin-top: 20px;
  }
  #signin.container .popup .signup__buttons .cancel {
    width: 100%;
    padding: 12px 0;
    border-radius: 20px;
    border: solid 1px #bbb;
    background-color: #fff;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #444;
  }
  #signin.container .popup .signup__buttons .continue {
    order: -1;
    width: 100%;
    padding: 12px 0;
    border-radius: 20px;
    background-color: #ec0047;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
  }
  #signin.container .popup .reset-pw {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 14px;
    padding: 25px 30px;
    box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
    background-color: #fff;
  }
  #signin.container .popup .reset-pw__image {
    width: 50px;
    height: 50px;
    margin-top: 25px;
  }
  #signin.container .popup .reset-pw__title {
    margin-top: 15px;
    font-size: 20px;
    line-height: 23px;
    color: #444;
    text-align: center;
  }
  #signin.container .popup .reset-pw__input {
    display: flex;
    flex-direction: column;
    row-gap: 5px;
    width: 100%;
    margin-top: 25px;
  }
  #signin.container .popup .reset-pw__input label {
    margin-left: 5px;
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #767676;
  }
  #signin.container .popup .reset-pw__input input {
    padding: 12px;
    border-radius: 6px;
    border: solid 1px #bbb;
    background-color: #fff;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #bbb;
  }
  #signin.container .popup .reset-pw__buttons {
    position: initial;
    bottom: 25px;
    display: flex;
    justify-content: center;
    column-gap: 5px;
    margin-top: 40px;
    width: 100%;
    height: 38px;
  }
  #signin.container .popup .reset-pw__buttons .cancel {
    width: 100px;
    padding: 12px 0;
    border-radius: 20px;
    border: solid 1px #bbb;
    background-color: #fff;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #444;
  }
  #signin.container .popup .reset-pw__buttons .continue {
    width: 100px;
    padding: 12px 0;
    border-radius: 20px;
    background-color: #ec0047;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
  }
  #signin.container .popup .email-send {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-radius: 14px;
    padding: 25px 30px;
    box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
    background-color: #fff;
  }
  #signin.container .popup .email-send__image {
    width: 50px;
    height: 50px;
    margin-top: 25px;
  }
  #signin.container .popup .email-send__title {
    margin-top: 15px;
    font-size: 20px;
    line-height: 23px;
    color: #444;
    text-align: center;
  }
  #signin.container .popup .email-send__sub-title {
    margin-top: 22px;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.43;
    letter-spacing: normal;
    text-align: center;
    color: #2f2f2f;
  }
  #signin.container .popup .email-send__buttons {
    position: initial;
    bottom: 25px;
    display: flex;
    justify-content: center;
    column-gap: 5px;
    margin-top: 40px;
    width: 100%;
    height: 38px;
  }
  #signin.container .popup .email-send__buttons .cancel {
    width: 100px;
    padding: 12px 0;
    border-radius: 20px;
    border: solid 1px #bbb;
    background-color: #fff;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #444;
  }
  #signin.container .popup .email-send__buttons .continue {
    width: 100px;
    padding: 12px 0;
    border-radius: 20px;
    background-color: #ec0047;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
  }
}
#footer.container {
  margin-top: 0;
}

#reference.container .reference {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
#reference.container .reference__top {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 35px;
  width: 100%;
  padding: 100px 0px;
}
#reference.container .reference__top .title {
  max-width: 1030px;
  font-size: 55px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: normal;
  text-align: center;
  color: #2f2f2f;
}
#reference.container .reference__top .title.en {
  letter-spacing: -0.8px;
}
#reference.container .reference__top .title #number-animate {
  display: inline-block;
  min-width: 145px;
}
#reference.container .reference__top .sub-title {
  font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.62;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
#reference.container .reference__company {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 20px;
  width: 1152px;
  padding-top: 88px;
  padding-bottom: 70px;
}
#reference.container .reference__company .item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 30px;
}
#reference.container .reference__company .item__company .items {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 18px;
  row-gap: 20px;
}
#reference.container .reference__company .item__company img {
  width: 128px;
}
#reference.container .reference__company .item__company .last-line {
  margin-top: 20px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
}
#reference.container .reference__company .dot-container {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}
#reference.container .reference__company .dot-container .grey-dot {
  width: 6px;
  height: 6px;
  border-radius: 25px;
  background-color: #707070;
}
#reference.container .reference__pdf {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  text-align: center;
}
#reference.container .reference__pdf .title {
  color: #222;
  text-align: center;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px; /* 142.308% */
  letter-spacing: -0.5px;
}
#reference.container .reference__pdf .download {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #444;
  font-size: 14px;
  font-weight: 600;
  border-radius: 50px;
  border: 1px solid #BBB;
  background-color: #FFF;
  padding: 12px;
}
#reference.container .reference__pdf .download .icon-download {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("../../images/icon-download.svg");
  background-repeat: no-repeat;
}
#reference.container .reference__example {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 200px;
  width: 100%;
}
#reference.container .reference__example > section {
  width: 100%;
  box-sizing: border-box;
}
#reference.container .reference__example .title {
  font-size: 55px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: normal;
  text-align: center;
  color: #2f2f2f;
}
#reference.container .reference__example .title.en {
  letter-spacing: -0.8px;
}
#reference.container .reference__example .sub-title {
  margin-top: 25px;
  font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.62;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
#reference.container .reference__example .btn-wrapper {
  width: 100%;
  margin: 40px auto 20px;
  display: flex;
  justify-content: center;
}
#reference.container .reference__example .example-support-btn {
  display: inline;
  box-sizing: border-box;
  padding: 16px 30px;
  border: solid 2px #ec0047;
  border-radius: 40px;
  background-color: #fff;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16);
  font-size: 22px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  text-align: center;
  color: #ec0047;
  cursor: pointer;
}
#reference.container .reference__example .example-support-btn:hover {
  filter: brightness(0.94);
}
#reference.container .reference__example .select {
  width: 100%;
  justify-content: center;
  display: inline-flex;
  margin-top: 80px;
  margin-bottom: 100px;
  box-sizing: border-box;
  height: 48px;
}
#reference.container .reference__example .select .item {
  flex-shrink: 0;
  text-align: center;
  padding: 18px 10px;
  min-width: 162px;
  box-sizing: border-box;
  height: 100%;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  color: #444;
  transition: all 0.5s ease;
  cursor: pointer;
  border: 1px solid #d7d7d7;
  margin-left: -1px;
}
#reference.container .reference__example .select .item.selected {
  transform: scaleX(1.01);
  box-shadow: none;
}
#reference.container .reference__example .select .item:hover {
  filter: opacity(75%);
}
#reference.container .reference__example .contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 150px;
  margin-bottom: 262px;
}
#reference.container .reference__example .contents .post {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 30px;
}
#reference.container .reference__example .contents .post__title {
  font-size: 26px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.42;
  letter-spacing: -0.5px;
  text-align: center;
  color: #222;
}
#reference.container .reference__example .contents .post__image {
  height: 400px;
}
#reference.container .reference__example .contents .post__description {
  max-width: 680px;
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  text-align: center;
  color: #444;
}
#reference.container .reference__example .support-beusable-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
  text-align: center;
  color: #2F2F2F;
}
#reference.container .reference__example .support-beusable-info .title {
  font-size: 55px;
  font-weight: 700;
  line-height: 72px; /* 130.909% */
}
#reference.container .reference__example .support-beusable-info .desc {
  font-size: 26px;
  font-weight: 500;
  line-height: 42px; /* 161.538% */
}
#reference.container .reference__example .support-beusable-info .download {
  margin-top: 15px;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #444;
  font-size: 14px;
  font-weight: 600;
  border-radius: 50px;
  border: 1px solid #BBB;
  background-color: #FFF;
  padding: 12px;
}
#reference.container .reference__example .support-beusable-info .download .icon-download {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("../../images/icon-download.svg");
  background-repeat: no-repeat;
}
#reference.container .reference__example .support-beusable-info .icon-beusable-info {
  margin-top: 56px;
  display: inline-block;
  width: 220px;
  height: 174px;
  background-image: url("../../images/icon-beusable-info.svg");
  background-repeat: no-repeat;
}
#reference.container .reference__example .support-analysis-case {
  background-color: #EEEDEC;
  text-align: center;
  width: 100%;
  padding: 60px 20px;
  box-sizing: border-box;
}
#reference.container .reference__example .support-analysis-case .main-title {
  font-size: 35px;
  margin: 20px 0 40px;
}
#reference.container .reference__example .support-analysis-case ul.case-list li.case {
  text-align: center;
  margin-bottom: 25px;
}
#reference.container .reference__example .support-analysis-case ul.case-list li.case:last-child {
  margin: 0;
}
#reference.container .reference__example .support-analysis-case ul.case-list li.case a {
  color: #0074FF;
  font-size: 16px;
  font-weight: 400;
  line-height: 23px;
}
#reference.container .reference__example .support-analysis-case ul.case-list li.case a:after {
  content: url(../../images/icon-link-blue.svg);
  vertical-align: sub;
  margin-left: 5px;
}
#reference.container .reference__example .support-analysis-case ul.case-list li.case a:hover {
  text-decoration: underline;
}

@media all and (max-width: 768px) {
  #reference.container .reference {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #reference.container .reference__top {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 15px;
    box-sizing: border-box;
    width: 100%;
    padding: 37px 20px;
  }
  #reference.container .reference__top .title {
    font-size: 30px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    text-align: center;
    color: #222;
  }
  #reference.container .reference__top .title #number-animate {
    display: inline-block;
    min-width: 80px;
  }
  #reference.container .reference__top .sub-title {
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: #222;
  }
  #reference.container .reference__top .category {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 5px;
    width: 100%;
    margin-top: 25px;
  }
  #reference.container .reference__top .category .item {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 0px;
    border-radius: 5px;
    border: solid 1px #d4d4d4;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.54;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #reference.container .reference__top .shorcut {
    display: flex;
    column-gap: 5px;
    align-items: center;
    margin-top: 15px;
  }
  #reference.container .reference__top .shorcut span {
    font-size: 15px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    color: #333;
  }
  #reference.container .reference__company {
    display: flex;
    flex-direction: column;
    row-gap: 40px;
    box-sizing: border-box;
    width: 100%;
    padding: 3px 20px 40px 20px;
  }
  #reference.container .reference__company .item {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 30px;
  }
  #reference.container .reference__company .item__category {
    position: relative;
    width: 100%;
    height: 70px;
    border-radius: 5px;
  }
  #reference.container .reference__company .item__category h3 {
    position: absolute;
    top: 36px;
    left: 20px;
    transform: translateY(-50%);
    padding-right: 55px;
    max-width: 100%;
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.19;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #reference.container .reference__company .item__category .character {
    position: absolute;
    bottom: 8px;
    right: 9px;
    height: 53px;
  }
  #reference.container .reference__company .item__category span {
    display: none;
    align-items: center;
    column-gap: 5px;
    position: absolute;
    bottom: 16px;
    right: 20px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    color: #3d3d3d;
  }
  #reference.container .reference__company .item__company .items {
    column-gap: 10px;
    row-gap: 30px;
    box-sizing: border-box;
    overflow: hidden;
  }
  #reference.container .reference__company .item__company img {
    width: calc(33.3333333333% - 10px);
  }
  #reference.container .reference__company .item__company .last-line {
    margin-top: 30px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
  }
  #reference.container .reference__company .item__company .last-line img {
    width: 110px;
  }
  #reference.container .reference__company .item__company .dot-container {
    margin-top: 0;
  }
  #reference.container .reference__company .item__shorcut {
    display: flex;
    column-gap: 5px;
    align-items: center;
    margin-top: 20px;
  }
  #reference.container .reference__company .item__shorcut span {
    font-size: 15px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    color: #333;
  }
  #reference.container .reference__company .division {
    display: none;
    width: 100%;
    height: 1px;
    background-color: #e2e2e2;
  }
  #reference.container .reference__pdf {
    margin-top: 30px;
    gap: 30px;
  }
  #reference.container .reference__pdf .title {
    font-size: 14px;
    line-height: 22px;
  }
  #reference.container .reference__example {
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    padding-top: 140px;
  }
  #reference.container .reference__example > section {
    text-align: center;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  #reference.container .reference__example > section:last-child {
    padding: 0;
  }
  #reference.container .reference__example .title {
    padding: 0 22px;
    font-size: 30px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    text-align: center;
    color: #222;
  }
  #reference.container .reference__example .sub-title {
    margin-top: 15px;
    width: 100%;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: #222;
  }
  #reference.container .reference__example .example-support-btn {
    font-size: 20px;
  }
  #reference.container .reference__example .select {
    display: none;
    grid-template-columns: repeat(6, 162px);
    margin-top: 80px;
    margin-bottom: 100px;
    border-radius: 5px;
    border: solid 1px #d7d7d7;
    height: 48px;
  }
  #reference.container .reference__example .select .item {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    height: 100%;
    border-right: solid 1px #d7d7d7;
    border-collapse: collapse;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #444;
    transition: all 0.5s ease;
    cursor: pointer;
  }
  #reference.container .reference__example .select-mobile {
    margin: 50px 0px;
    box-sizing: border-box;
    width: 100%;
    padding: 11px;
    border-radius: 6px;
    border: solid 1px #bbb;
    background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 98% center;
    background-color: #fff;
    appearance: none;
  }
  #reference.container .reference__example .contents {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 80px;
    margin-bottom: 140px;
    width: 100%;
  }
  #reference.container .reference__example .contents .post {
    display: flex;
    flex-direction: column;
    row-gap: 30px;
    width: 100%;
  }
  #reference.container .reference__example .contents .post__title {
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #reference.container .reference__example .contents .post__image {
    width: 100%;
    height: auto;
  }
  #reference.container .reference__example .contents .post__description {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    text-align: center;
    color: rgba(51, 51, 51, 0.8);
  }
  #reference.container .reference__example .support-analysis-case .main-title {
    font-size: 18px;
  }
  #reference.container .reference .support-beusable-info {
    gap: 15px;
  }
  #reference.container .reference .support-beusable-info .title {
    font-size: 30px;
    font-weight: 600;
    line-height: 39px; /* 130% */
  }
  #reference.container .reference .support-beusable-info .desc {
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
  }
  #reference.container .reference .support-beusable-info .download {
    margin-top: 15px;
  }
  #reference.container .reference .support-beusable-info .icon-beusable-info {
    margin-top: 25px;
    width: 160px;
    height: 127px;
    background-size: 160px;
  }
}
#lecture.container {
  padding-top: 110px;
  padding-bottom: 150px;
}
#lecture.container .lecture {
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}
#lecture.container .lecture__layout-top {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 150px;
  margin-top: 75px;
}
#lecture.container .lecture__layout-middle {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 150px;
  margin: 150px 0px;
}
#lecture.container .lecture__layout-bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 150px;
  margin-top: 150px;
}
#lecture.container .lecture__contents-template {
  display: grid;
  grid-template-columns: 270px 670px;
  column-gap: 30px;
}
#lecture.container .lecture__contents-template > .title {
  font-size: 34px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.18;
  letter-spacing: normal;
  color: #2f2f2f;
}
#lecture.container .lecture__title {
  font-family: NewRubrik;
  font-size: 65px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -1.5px;
  text-align: center;
  color: #2f2f2f;
}
#lecture.container .lecture__description {
  margin-top: 35px;
  font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.62;
  letter-spacing: normal;
  text-align: center;
  color: #222;
}
#lecture.container .lecture__panel {
  position: relative;
  margin-top: 60px;
  width: 100%;
  min-width: 1280px;
}
#lecture.container .lecture__panel__bg {
  width: 100%;
  min-height: 340px;
}
#lecture.container .lecture__panel__data-driven {
  position: absolute;
  top: 33%;
  left: 33%;
  width: 34%;
}
#lecture.container .lecture__panel__desc {
  position: absolute;
  top: 60%;
  left: 33%;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  color: #fff;
}
#lecture.container .lecture__panel-2 {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  column-gap: 154px;
  width: 100%;
  min-width: 1920px;
  padding: 56px 0px;
  background-image: url("https://dream-cdn.beusable.net/home/images/support/lecture-bg-2.jpg");
  background-size: cover;
}
#lecture.container .lecture__panel-2 p {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #fff;
}
#lecture.container .lecture__accordian {
  display: flex;
  flex-direction: column;
  border-bottom: 2px solid #b1b1b1;
}
#lecture.container .lecture__accordian .item {
  box-sizing: border-box;
  width: 670px;
  padding: 23px 15px;
  border-top: 2px solid #b1b1b1;
}
#lecture.container .lecture__accordian .item .main-item {
  display: flex;
  justify-content: space-between;
  width: 100%;
  cursor: pointer;
}
#lecture.container .lecture__accordian .item .main-item span {
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #2f2f2f;
}
#lecture.container .lecture__accordian .item .main-item img {
  width: 20px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#lecture.container .lecture__accordian .item.on .main-item img {
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#lecture.container .lecture__accordian .item .sub-item {
  max-height: 0px;
  padding-top: 0px;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#lecture.container .lecture__accordian .item .sub-item h6 {
  color: #2f2f2f;
  font-size: 16px;
  margin: 15px 0;
  line-height: 1.88;
  font-weight: 500;
}
#lecture.container .lecture__accordian .item .sub-item p {
  font-size: 14px;
  color: #767676;
  margin: 15px 0 20px 0;
}
#lecture.container .lecture__accordian .item .sub-item span.text-red {
  color: #ec0047;
}
#lecture.container .lecture__accordian .item .sub-item ul {
  margin-left: 2ch;
  list-style: none;
}
#lecture.container .lecture__accordian .item .sub-item ul.ul {
  margin: 0 0 30px 10px;
  color: #444;
  font-size: 15px;
}
#lecture.container .lecture__accordian .item .sub-item li {
  position: relative;
  line-height: 1.48;
  margin: 10px 0;
  color: #444;
  font-size: 15px;
  font-weight: 300;
}
#lecture.container .lecture__accordian .item .sub-item li:before {
  content: "";
  position: absolute;
  top: 9px;
  left: -7px;
  width: 3px;
  height: 3px;
  background: #444;
}
#lecture.container .lecture__accordian .item .sub-item .answer {
  padding: 25px 15px 30px 15px;
  color: #666;
  font-size: 15px;
  line-height: 1.6;
}
#lecture.container .lecture__accordian .item.on .sub-item {
  max-height: 1500px;
  padding-top: 42px;
}
#lecture.container .lecture__accordian__description {
  max-width: none;
  font-size: 15px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.57;
  letter-spacing: normal;
  color: #666;
}
#lecture.container .lecture__accordian__description .title {
  margin-bottom: 30px;
  font-size: 16px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  color: #2f2f2f;
}
#lecture.container .lecture__accordian__description .title .sub {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  letter-spacing: normal;
  color: #2f2f2f;
}
#lecture.container .lecture__accordian__description .red {
  font-weight: 500;
  color: #ec0047;
}
#lecture.container .lecture__data-driven {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 45px;
}
#lecture.container .lecture__data-driven ul {
  border-bottom: 2px solid #d7d7d7;
}
#lecture.container .lecture__data-driven ul li {
  display: grid;
  grid-template-columns: 155px 350px;
  column-gap: 130px;
  align-items: center;
  padding: 22px 15px;
  border-top: 2px solid #d7d7d7;
}
#lecture.container .lecture__data-driven ul li .title {
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #ec0047;
}
#lecture.container .lecture__data-driven ul li .desc {
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #444;
}
#lecture.container .lecture__data-driven__label {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2px 100px;
  border-radius: 6px;
  background-color: #1199af;
}
#lecture.container .lecture__data-driven__label span {
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#lecture.container .lecture__data-driven__btn {
  position: relative;
  padding: 15px 102px;
  border-radius: 24px;
  background-color: #c1c1c1;
}
#lecture.container .lecture__data-driven__btn span {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#lecture.container .lecture__data-driven__btn img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#lecture.container .lecture__preview {
  display: grid;
  grid-template-columns: 370px 270px;
  column-gap: 30px;
}
#lecture.container .lecture__preview ul {
  display: flex;
  flex-direction: column;
  row-gap: 60px;
}
#lecture.container .lecture__preview ul li {
  display: flex;
  flex-direction: column;
  row-gap: 22px;
}
#lecture.container .lecture__preview ul li .title {
  font-size: 24px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.42;
  letter-spacing: normal;
  color: #2f2f2f;
}
#lecture.container .lecture__preview ul li .desc {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #444;
}
#lecture.container .lecture__preview img {
  width: 100%;
}
#lecture.container .lecture__compare {
  display: flex;
  flex-direction: column;
  row-gap: 60px;
  margin-top: -150px;
  padding: 35px 0px;
}
#lecture.container .lecture__compare .item {
  display: flex;
  column-gap: 50px;
  align-items: center;
}
#lecture.container .lecture__compare .item .node {
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: 25px;
  box-sizing: border-box;
  width: 400px;
  height: 370px;
  border-radius: 60px;
  padding: 33px;
}
#lecture.container .lecture__compare .item .node.before {
  box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08);
  background-color: #444;
  color: #fff;
}
#lecture.container .lecture__compare .item .node.after {
  box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  color: #2f2f2f;
}
#lecture.container .lecture__compare .item .node h4 {
  font-size: 20px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  text-align: center;
}
#lecture.container .lecture__compare .item .node.after h4 {
  color: #ec0047;
}
#lecture.container .lecture__compare .item .node p {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  text-align: center;
}
#lecture.container .lecture__apply {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 17px;
  width: 1170px;
  height: 409px;
  background-image: url("https://dream-cdn.beusable.net/home/images/support/lecture-apply.jpg");
  background-size: cover;
}
#lecture.container .lecture__apply h2 {
  font-size: 44px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.91;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#lecture.container .lecture__apply p {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#lecture.container .lecture__apply__btn {
  position: relative;
  padding: 15px 102px;
  border-radius: 24px;
  background-color: #c1c1c1;
}
#lecture.container .lecture__apply__btn span {
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#lecture.container .lecture__apply__btn img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#lecture.container .lecture__notice {
  display: flex;
  flex-direction: column;
  row-gap: 30px;
}
#lecture.container .lecture__notice__title {
  font-size: 15px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: normal;
  color: #ec0047;
}
#lecture.container .lecture__notice ul {
  margin-left: 5px;
}
#lecture.container .lecture__notice ul li {
  display: flex;
  column-gap: 5px;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #444;
}
#lecture.container .lecture__notice ul li::before {
  content: "";
  width: 3px;
  height: 3px;
  margin-top: 11px;
  background: #444;
}

@media all and (max-width: 768px) {
  #lecture.container {
    padding-top: 40px;
    padding-bottom: 150px;
  }
  #lecture.container .lecture {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
  }
  #lecture.container .lecture__layout-top {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 80px;
    width: 100%;
    margin-top: 42px;
  }
  #lecture.container .lecture__layout-middle {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 150px;
    width: 100%;
    margin: 150px 0px;
  }
  #lecture.container .lecture__layout-bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 150px;
    margin-top: 150px;
  }
  #lecture.container .lecture__contents-template {
    display: grid;
    grid-template-columns: 100%;
    row-gap: 30px;
    width: 100%;
  }
  #lecture.container .lecture__contents-template > .title {
    padding-left: 16px;
    font-size: 20px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #lecture.container .lecture__title {
    font-family: NewRubrik;
    font-size: 32px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #2f2f2f;
  }
  #lecture.container .lecture__description {
    margin-top: 15px;
    padding: 0px 10px;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: center;
    color: #333;
  }
  #lecture.container .lecture__panel {
    position: relative;
    box-sizing: border-box;
    margin-top: 40px;
    width: 100%;
    min-width: auto;
    height: 222px;
  }
  #lecture.container .lecture__panel__bg {
    width: auto;
    height: 100%;
    min-height: auto;
  }
  #lecture.container .lecture__panel__data-driven {
    position: absolute;
    top: 30%;
    left: 10%;
    width: 300px;
  }
  #lecture.container .lecture__panel__desc {
    position: absolute;
    top: 60%;
    left: 10%;
    font-size: 7.2px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #fff;
  }
  #lecture.container .lecture__panel-2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    row-gap: 28px;
    box-sizing: border-box;
    min-width: auto;
    width: 100%;
    height: 620px;
    padding: 56px 18px;
    background-image: url("https://dream-cdn.beusable.net/home/images/support/lecture-bg-2.jpg");
    background-size: cover;
  }
  #lecture.container .lecture__panel-2 p {
    font-size: 14px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.93;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
  }
  #lecture.container .lecture__accordian {
    display: flex;
    flex-direction: column;
    border-bottom: 2px solid #b1b1b1;
  }
  #lecture.container .lecture__accordian .item {
    box-sizing: border-box;
    width: 100%;
    padding: 23px 15px;
    border-top: 2px solid #b1b1b1;
  }
  #lecture.container .lecture__accordian .item .main-item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    cursor: pointer;
  }
  #lecture.container .lecture__accordian .item .main-item span {
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.61;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #lecture.container .lecture__accordian .item .main-item img {
    width: 20px;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #lecture.container .lecture__accordian .item.on .main-item img {
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  #lecture.container .lecture__accordian .item .sub-item {
    max-height: 0px;
    padding-top: 0px;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #lecture.container .lecture__accordian .item.on .sub-item {
    max-height: 1500px;
    padding-top: 42px;
  }
  #lecture.container .lecture__accordian__description {
    max-width: none;
    font-size: 15px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: normal;
    color: #666;
  }
  #lecture.container .lecture__accordian__description .title {
    margin-bottom: 30px;
    font-size: 16px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #lecture.container .lecture__accordian__description .title .sub {
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.54;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #lecture.container .lecture__accordian__description .red {
    font-weight: 500;
    color: #ec0047;
  }
  #lecture.container .lecture__data-driven {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 45px;
  }
  #lecture.container .lecture__data-driven ul {
    border-bottom: 1px solid #d7d7d7;
    width: 100%;
  }
  #lecture.container .lecture__data-driven ul li {
    display: flex;
    justify-content: space-between;
    column-gap: 10px;
    padding: 22px 15px;
    border-top: 1px solid #d7d7d7;
  }
  #lecture.container .lecture__data-driven ul li .title {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ec0047;
  }
  #lecture.container .lecture__data-driven ul li .desc {
    text-align: end;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #444;
  }
  #lecture.container .lecture__data-driven__label {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 10px;
    box-sizing: border-box;
    width: calc(100% - 32px);
    margin: 0px 16px;
    padding: 11px 70px 11px 11px;
    border-radius: 6px;
    background-color: #1199af;
  }
  #lecture.container .lecture__data-driven__label span {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: start;
    color: #fff;
  }
  #lecture.container .lecture__data-driven__btn {
    display: flex;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    width: calc(100% - 32px);
    margin: 0px 16px;
    padding: 15px 102px;
    border-radius: 24px;
    background-color: #c1c1c1;
  }
  #lecture.container .lecture__data-driven__btn span {
    font-size: 17px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
  }
  #lecture.container .lecture__data-driven__btn img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  #lecture.container .lecture__preview {
    display: grid;
    grid-template-columns: 100%;
    row-gap: 30px;
    padding: 0px 16px;
  }
  #lecture.container .lecture__preview ul {
    display: flex;
    flex-direction: column;
    row-gap: 60px;
  }
  #lecture.container .lecture__preview ul li {
    display: flex;
    flex-direction: column;
    row-gap: 22px;
  }
  #lecture.container .lecture__preview ul li .title {
    font-size: 16px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #2f2f2f;
  }
  #lecture.container .lecture__preview ul li .desc {
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.8;
    letter-spacing: normal;
    color: #444;
  }
  #lecture.container .lecture__preview img {
    width: 100%;
  }
  #lecture.container .lecture__compare {
    display: flex;
    flex-direction: column;
    row-gap: 80px;
    width: 100%;
    margin-top: -80px;
    padding: 35px 0px;
  }
  #lecture.container .lecture__compare .item {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
    align-items: center;
  }
  #lecture.container .lecture__compare .item img {
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
  }
  #lecture.container .lecture__compare .item .node {
    display: flex;
    flex-direction: column;
    justify-content: center;
    row-gap: 25px;
    box-sizing: border-box;
    width: calc(100% - 32px);
    min-height: 370px;
    height: auto;
    border-radius: 60px;
    padding: 60px 20px;
  }
  #lecture.container .lecture__compare .item .node.before {
    box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08);
    background-color: #444;
    color: #fff;
  }
  #lecture.container .lecture__compare .item .node.after {
    box-shadow: 0 23px 15px -12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.08);
    background-color: #fff;
    color: #2f2f2f;
  }
  #lecture.container .lecture__compare .item .node h4 {
    font-size: 20px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: center;
  }
  #lecture.container .lecture__compare .item .node.after h4 {
    color: #ec0047;
  }
  #lecture.container .lecture__compare .item .node p {
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.8;
    letter-spacing: normal;
    text-align: center;
  }
  #lecture.container .lecture__apply {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    row-gap: 21px;
    width: 100%;
    height: 320px;
    background-image: url("https://dream-cdn.beusable.net/home/images/support/lecture-apply.jpg");
    background-size: cover;
  }
  #lecture.container .lecture__apply h2 {
    font-size: 21px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
  }
  #lecture.container .lecture__apply p {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.93;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
  }
  #lecture.container .lecture__apply__btn {
    display: flex;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    width: calc(100% - 32px);
    padding: 15px 102px;
    border-radius: 24px;
    background-color: #c1c1c1;
  }
  #lecture.container .lecture__apply__btn span {
    font-size: 17px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
  }
  #lecture.container .lecture__apply__btn img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  #lecture.container .lecture__notice {
    display: flex;
    flex-direction: column;
    row-gap: 30px;
    padding: 0px 16px;
  }
  #lecture.container .lecture__notice__title {
    font-size: 15px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 2;
    letter-spacing: normal;
    color: #ec0047;
  }
  #lecture.container .lecture__notice ul {
    margin-left: 5px;
  }
  #lecture.container .lecture__notice ul li {
    display: flex;
    column-gap: 5px;
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.8;
    letter-spacing: normal;
    color: #444;
  }
  #lecture.container .lecture__notice ul li::before {
    content: "";
    width: 3px;
    height: 3px;
    margin-top: 11px;
    background: #444;
  }
}
#main.container {
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  min-width: 1280px;
  background-color: #000;
  overflow-x: hidden;
  /* ===== 공통 ===== */
}
#main.container * {
  box-sizing: border-box;
  letter-spacing: 0;
}
#main.container:lang(ja) {
  font-family: "Pretendard JP Variable", "Pretendard JP", "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@supports (word-break: auto-phrase) {
  #main.container:lang(ja) {
    word-break: auto-phrase;
  }
}
#main.container button {
  background-color: transparent;
  padding: 0;
  border: none;
  cursor: pointer;
}
#main.container .inner {
  max-width: 1244px;
  padding: 0 20px;
  width: 100%;
  margin: 0 auto;
  height: 100%;
  position: relative;
}
#main.container .inner__sm {
  padding-block: 128px 260px;
}
#main.container .inner__md {
  padding-block: 200px 260px;
}
#main.container .inner__lg {
  padding-block: 228px 280px;
}
#main.container .section.deep-bg {
  --section-title-color: #FFF;
  --section-accent-color: #EC0047;
  --section-subTit-color: #EBEBEB;
  --section-label-pink-color: #EC0047;
  --section-label-white-color: #FFF;
  --section-border-color: #444;
  background-color: #000;
}
#main.container .section.light-bg {
  --section-title-color: #2F2F2F;
  --section-accent-color: #EC0047;
  --section-subTit-color: #2F2F2F;
  --section-label-pink-color: #EC0047;
  --section-label-white-color: #2F2F2F;
  --section-border-color: #ccc;
  background-color: #EBEBEB;
}
#main.container .section__title.min-height {
  min-height: 180px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 24px;
  border-bottom: 2px solid var(--section-border-color);
}
#main.container .section__title.min-height .title-wrap .title {
  display: flex;
  align-items: flex-end;
  gap: 24px;
}
#main.container .section__title.min-height .title-wrap .label {
  padding-bottom: 12px;
  font-size: 24px;
}
#main.container .section__title .title-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-bottom: 24px;
}
#main.container .section__title .title-wrap .title {
  color: var(--section-title-color);
  font-size: 60px;
  font-weight: 700;
  line-height: 120%;
  letter-spacing: -1.236px;
}
#main.container .section__title .title-wrap .title .accent {
  color: var(--section-accent-color);
}
#main.container .section__title .title-wrap .label {
  color: var(--section-label-pink-color);
  font-size: 26px;
  font-weight: 600;
  line-height: 100%;
}
#main.container .section__title .title-wrap .label.white {
  color: var(--section-label-white-color);
}
#main.container .section__title .title-wrap .sub-title {
  color: var(--section-subTit-color);
  font-size: 18px;
  font-weight: 500;
  line-height: 150%;
}
#main.container .section__title .title-wrap .sub-title strong {
  font-size: 22px;
  font-weight: 700;
}
#main.container .section__content {
  padding-top: 48px;
}
#main.container {
  /* ===== 컨텐츠 - 익숙한 고민들 ===== */
}
#main.container .worry__section .section__content .worry-list .worry-item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 640px;
  border-radius: 16px;
  overflow: hidden;
}
#main.container .worry__section .section__content .worry-list .worry-item:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 0;
}
#main.container .worry__section .section__content .worry-list .worry-item__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(100%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
#main.container .worry__section .section__content .worry-list .worry-item__title {
  position: relative;
  z-index: 1;
  padding: 48px 40px;
  color: #CCC;
  font-size: 44px;
  font-weight: 700;
  line-height: 90%;
  letter-spacing: -0.44px;
}
#main.container .worry__section .section__content .worry-list .worry-item__content {
  position: relative;
  z-index: 1;
  padding: 32px 40px 24px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  min-height: 208px;
}
#main.container .worry__section .section__content .worry-list .worry-item__quote {
  color: #FFF;
  font-size: 20px;
  font-weight: 600;
  line-height: 150%;
}
#main.container .worry__section .section__content .worry-list .worry-item__desc {
  color: #CCC;
  font-size: 15px;
  font-weight: 500;
  line-height: 150%;
}
#main.container {
  /* ===== 컨텐츠 - 거대한 변화 ===== */
}
#main.container .question__section .section__content .grid-card__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  color: #fff;
  gap: 20px;
}
#main.container .question__section .section__content .grid-card__list .grid-item__full {
  grid-column: 1/-1;
}
#main.container .question__section .section__content .grid-card__list .grid-item .card-title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 4px;
}
#main.container .question__section .section__content .grid-card__list .grid-item .card-title .label {
  padding-bottom: 4px;
  font-size: 22px;
  font-weight: 700;
  line-height: 28px;
  letter-spacing: -0.449px;
}
#main.container .question__section .section__content .grid-card__list .grid-item.seo .card-title .label {
  color: #666;
}
#main.container .default-btn {
  border-radius: 50em;
  padding: 0 12px 0 14px;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 38px;
  background: #EC0047;
  color: #FFF;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%;
}
#main.container .main-frame {
  position: relative;
}
#main.container .color-bg {
  position: absolute;
  width: 576px;
  height: 576px;
  border-radius: 50em;
  background: rgba(236, 0, 0, 0.12);
  filter: blur(100px);
  left: -96px;
  top: -254px;
  z-index: -1;
}
#main.container .hero {
  position: absolute;
  right: -258px;
  bottom: -48px;
}
#main.container .particle-sphere {
  width: 639px;
  height: 645px;
  overflow: hidden;
  position: absolute;
  right: -149px;
  top: 115px;
  z-index: 1;
}
#main.container .canvas {
  display: block;
  cursor: move;
  touch-action: none;
}
#main.container .hero-section {
  overflow: hidden;
}
#main.container .hero-section .inner {
  display: flex;
  flex-direction: column;
  gap: 70px;
  align-items: flex-start;
  justify-content: flex-start;
  padding-block: 202px 287px;
}
#main.container .hero-text-section {
  padding: 78px 0px 0px 32px;
  display: flex;
  flex-direction: column;
  gap: 21px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}
#main.container .hero-subtitle-container {
  position: relative;
}
#main.container .hero-description-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  padding-left: 130px;
}
#main.container .hero-description {
  color: #ffffff;
  text-align: left;
  font-size: 40px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .top-para {
  color: #999999;
  text-align: left;
  font-size: 20px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .hero-subtitle {
  text-align: left;
  font-size: 90px;
  line-height: 100%;
  letter-spacing: -0.65px;
  font-weight: 800;
  text-transform: uppercase;
  position: absolute;
  color: transparent;
}
#main.container .bt-en {
  cursor: pointer;
  padding: 0px 28px 0px 28px;
  display: flex;
  gap: 8px;
  align-items: center;
  align-self: center;
  height: 60px;
  min-width: 100px;
  position: relative;
  z-index: 1;
  border-radius: 50em;
  border: 1px solid rgba(255, 255, 255, 0.24);
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(8px);
}
#main.container .bt-en:hover {
  border-radius: 1098.9px;
  background: rgba(255, 255, 255, 0.12);
}
#main.container .discovery-text-container {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
#main.container .discovery-text-container .icon--white-arrow {
  width: 18px;
  height: 18px;
}
#main.container .discovery-text {
  color: #ffffff;
  text-align: center;
  font-size: 18px;
  line-height: 100%;
  font-weight: 600;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
#main.container .stats-container {
  align-self: center;
  background: rgba(255, 255, 255, 0.04);
  border-radius: 16px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.12);
  border-width: 1px;
  padding: 32px;
  display: flex;
  flex-direction: row;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  backdrop-filter: blur(8px);
}
#main.container .stats-container .stats-box {
  display: flex;
  gap: 32px;
}
#main.container .data-points-container {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 154px;
  position: relative;
}
#main.container .data-points-value {
  background: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to left, #ffffff, #ffffff);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: center;
  font-size: 22px;
  line-height: 100%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .data-points-label {
  background: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to left, #999999, #999999);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: center;
  font-size: 12px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .data-points-divider {
  background: rgba(255, 255, 255, 0.12);
  flex-shrink: 0;
  width: 1px;
  height: 52px;
  position: relative;
}
#main.container .contents-01 {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-01 .contents-01-2 {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-02 {
  padding: 0 12px 0 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
}
#main.container .container10 {
  background: linear-gradient(to left, rgba(0, 0, 0, 0.44), rgba(0, 0, 0, 0.44));
  border-radius: 20px;
  position: relative;
  width: 100%;
}
#main.container .contents-02-2 {
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  align-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .content-frame {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
}
#main.container .content-container {
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: stretch;
  width: 100%;
  position: relative;
}
#main.container .container11 {
  background: rgba(0, 0, 0, 0.6);
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  flex: 0 1 490px;
  height: 450px;
  position: relative;
  backdrop-filter: blur(28px);
}
#main.container .container11.left {
  overflow: hidden;
}
#main.container .container11.right {
  flex: auto;
  max-width: 694px;
  width: 100%;
}
#main.container .title-and-year {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .title3 {
  color: #666666;
  text-align: left;
  font-size: 22px;
  line-height: 28px;
  letter-spacing: -0.45px;
  font-weight: 700;
  position: relative;
}
#main.container .title3.white {
  color: #ffffff;
}
#main.container ._2025 {
  color: #ffffff;
  text-align: left;
  font-size: 68px;
  line-height: 100%;
  font-weight: 700;
  position: relative;
}
#main.container ._2025._20252 {
  color: #ff1553;
}
#main.container .features-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .feature-item {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .feature-icon {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  margin: 8px 0;
  flex-shrink: 0;
  position: relative;
}
#main.container .icon {
  background: #d9d9d9;
  flex-shrink: 0;
  width: 3px;
  height: 3px;
  position: relative;
}
#main.container .question__section {
  overflow: hidden;
}
#main.container .question__section .question__img {
  position: absolute;
  bottom: 0;
  z-index: -1;
}
#main.container .question__section .question__img.seo {
  left: 22px;
}
#main.container .question__section .question__img.geo {
  left: 173px;
}
#main.container .question__section .question__img.quote {
  right: -165px;
  bottom: -218px;
}
#main.container .feature-text {
  color: #999999;
  text-align: left;
  font-size: 16px;
  line-height: 120%;
  font-weight: 500;
  position: relative;
}
#main.container .feature-icon2 {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  height: 19px;
  position: relative;
}
#main.container .cta-container {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .cta-item {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .cta-icon {
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .cta-text {
  color: #cccccc;
  text-align: left;
  font-size: 20px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .year-container {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .features-list2 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 631px;
  position: relative;
}
#main.container .icon2 {
  background: #777777;
  flex-shrink: 0;
  width: 3px;
  height: 3px;
  position: relative;
}
#main.container .feature-text2 {
  color: #ffffff;
  text-align: left;
  font-size: 16px;
  line-height: 120%;
  font-weight: 500;
  position: relative;
}
#main.container .cta-text2 {
  color: #16b5d2;
  text-align: left;
  font-size: 22px;
  line-height: 100%;
  font-weight: 600;
  position: relative;
}
#main.container .container13 {
  background: rgba(19, 165, 191, 0.85);
  border-radius: 24px;
  padding: 48px 454px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  height: 328px;
  position: relative;
  backdrop-filter: blur(14px);
}
#main.container .main-container {
  flex-shrink: 0;
  width: 631px;
  height: 399px;
  position: absolute;
  right: 0px;
  top: 0px;
}
#main.container .geo-container {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 243.78px;
  top: calc(50% - 140.5px);
}
#main.container .geo-subtitle {
  color: #ffffff;
  text-align: center;
  font-size: 36px;
  line-height: 100%;
  font-weight: 600;
  position: relative;
}
#main.container .geo-title {
  color: #ffffff;
  text-align: center;
  font-size: 116px;
  line-height: 100%;
  letter-spacing: -3px;
  font-weight: 700;
  position: relative;
}
#main.container .bt-en2 {
  cursor: pointer;
  background: rgba(0, 0, 0, 0.16);
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(8px);
  padding: 0px 28px 0px 28px;
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  height: 60px;
  min-width: 100px;
  position: absolute;
  left: 253.78px;
  top: 215px;
  backdrop-filter: blur(8px);
}
#main.container .bt-en2:hover {
  border-radius: 1098.9px;
  background: rgba(255, 255, 255, 0.12);
}
#main.container .info-container {
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .info-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .info-text {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container ._20253 {
  color: #ffffff;
  text-align: left;
  font-size: 30px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
}
#main.container .description-text {
  color: #e0f6fa;
  text-align: left;
  font-size: 16px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
}
#main.container .features-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px 68px;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .feature-row {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .feature-text3 {
  color: #ffffff;
  text-align: left;
  font-size: 16px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
}
#main.container .solution__section .content-solution__item {
  cursor: pointer;
  transition: background 0.3s ease-in-out;
}
#main.container .solution__section .content-solution__item .card-link {
  visibility: hidden;
  opacity: 0;
  margin-top: auto;
  border-radius: 50em;
  padding: 0 12px 0 14px;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 38px;
  background: #EC0047;
  color: #FFF;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%;
}
#main.container .solution__section .content-solution__item .card2 {
  flex: 1;
}
#main.container .solution__section .content-solution__item .card2 .card-content {
  flex: 1;
}
#main.container .content-solution__item {
  background: #181818;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
}
#main.container .card2 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-title {
  color: #ffffff;
  text-align: left;
  font-size: 16px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .card-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container ._2026 {
  color: #fff;
  text-align: left;
  font-size: 36px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container ._2026 ._2026-span3 {
  color: #ff1553;
}
#main.container ._2026-span {
  color: #ff1553;
}
#main.container ._2026-span2 {
  color: #ffffff;
}
#main.container .card-description {
  color: #bbbbbb;
  text-align: left;
  font-size: 12px;
  line-height: 150%;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  transition: color 0.3s ease-in-out;
}
#main.container .card-footer {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-footer2 {
  border-radius: 999px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.12);
  font-weight: 500;
  border-width: 1px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
  transition: border-color 0.3s ease-in-out;
}
#main.container .card-footer-text {
  transition: color 0.3s ease-in-out;
  color: #bbbbbb;
  text-align: left;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .card-image {
  border-radius: 6px;
  opacity: 0.9;
  flex-shrink: 0;
  width: 362px;
  height: auto;
  position: absolute;
  left: calc(50% - 153px);
  bottom: -80px;
  transition: transform 0.3s ease-in-out;
}
#main.container .container16 {
  background: #000000;
  border-radius: 24px;
  border-style: solid;
  border-color: transparent;
  border-width: 1px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 30px;
  align-items: flex-start;
  justify-content: flex-start;
  height: 420px;
  position: relative;
  overflow: hidden;
  grid-column: 3/span 1;
  grid-row: 1/span 1;
}
#main.container .container16 .solution--arrow-top {
  position: absolute;
  top: 68px;
  right: 90px;
}
#main.container .container16 .solution--arrow-bottom {
  position: absolute;
  left: 56px;
  bottom: 121px;
}
#main.container .card-title3 {
  color: #16b5d2;
  text-align: center;
  font-size: 58px;
  line-height: 90%;
  letter-spacing: -0.5px;
  font-weight: 700;
  position: absolute;
  left: 50%;
  translate: -50%;
  top: calc(50% - 61px);
}
#main.container .container17 {
  background: transparent;
  border-radius: 24px;
  border-style: solid;
  border-color: transparent;
  border-width: 1px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 30px;
  align-items: flex-start;
  justify-content: flex-start;
  height: 420px;
  position: relative;
  overflow: hidden;
  grid-column: 1/span 1;
  grid-row: 2/span 1;
}
#main.container .card-title4 {
  color: #16b5d2;
  text-align: center;
  font-size: 58px;
  line-height: 90%;
  letter-spacing: -0.5px;
  font-weight: 700;
  position: absolute;
  left: calc(50% - 123px);
  top: calc(50% - 83px);
}
#main.container .underline-04 {
  flex-shrink: 0;
  width: 256px;
  height: 48px;
  position: absolute;
  left: 67px;
  top: 237px;
}
#main.container .group {
  width: 99.41%;
  height: 63.11%;
  position: absolute;
  right: 0.59%;
  left: 0%;
  bottom: -0.27%;
  top: 37.16%;
  transform: translate(0px, -17.89px);
  overflow: visible;
}
#main.container .container18 {
  background: #181818;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 1;
  grid-row: 2/span 1;
}
#main.container ._2026-span2 {
  color: #ffffff;
}
#main.container ._2026-span3 {
  color: #ff1553;
}
#main.container .card-image3 {
  border-radius: 6px;
  opacity: 0.9;
  flex-shrink: 0;
  width: 361.85px;
  height: 239px;
  position: absolute;
  left: calc(50% - 154px);
  top: 257px;
  object-fit: cover;
  aspect-ratio: 361.85/239;
}
#main.container .container19 {
  background: #181818;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 2/span 1;
}
#main.container ._2026-span2 {
  color: #ffffff;
}
#main.container ._2026-span3 {
  color: #ff1553;
}
#main.container .card-footer4 {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .card-footer5 {
  border-radius: 999px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.12);
  border-width: 1px;
  padding: 0 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-image4 {
  border-radius: 6px;
  opacity: 0.9;
  flex-shrink: 0;
  width: 357px;
  height: 254px;
  position: absolute;
  left: calc(50% - 154px);
  top: 257px;
  object-fit: cover;
  aspect-ratio: 357/254;
}
#main.container .contents-04 {
  padding: 0px 12px 0px 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-04-1 {
  background: linear-gradient(to left, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.08));
  border-radius: 20px;
  padding-bottom: 80px;
  height: 626px;
  position: relative;
  width: 100%;
}
#main.container .contents-04-1 .inner {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
}
#main.container .frame-9568 {
  padding: 10px 10px 32px 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .description {
  color: #ec0047;
  text-align: left;
  font-size: 28px;
  line-height: 120%;
  font-weight: 700;
  position: relative;
}
#main.container .description2 {
  color: #ffffff;
  text-align: left;
  font-size: 76px;
  line-height: 100%;
  letter-spacing: -1.5px;
  font-weight: 700;
  position: relative;
}
#main.container .frame-9563 {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .menu-item {
  display: flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.44);
  background: rgba(255, 255, 255, 0.27);
  backdrop-filter: blur(8px);
  color: #FFF;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 100%;
  height: 56px;
  padding: 0 32px;
  transition: background 0.3s ease-in-out;
}
#main.container .menu-item:hover {
  background: rgba(255, 255, 255, 0.48);
}
#main.container .contents-uxheatmap {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-uxheatmap-2 {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card4 {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 80px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .card3 {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#main.container .card5 {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .card6 {
  align-self: stretch;
  flex-shrink: 0;
  display: grid;
  gap: 20px;
  position: relative;
  grid-template-columns: repeat(3, fit-content(100%));
  grid-template-rows: repeat(4, fit-content(100%));
}
#main.container .container20 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 4/span 1;
}
#main.container .card-content2 {
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex: 1;
  position: relative;
}
#main.container .icon-group {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
}
#main.container .group2 {
  width: 87.44%;
  height: 76.64%;
  position: absolute;
  right: 5.94%;
  left: 6.62%;
  bottom: 11.59%;
  top: 11.76%;
  overflow: visible;
}
#main.container .card-text {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container ._20254 {
  color: #FFF;
  text-align: center;
  font-size: 26px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
}
#main.container .card-description-smart-break {
  color: #999;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 150%;
  position: relative;
  align-self: stretch;
}
#main.container .container21 {
  background: #000000;
  border-radius: 16px;
  padding: 0px 4px 0px 4px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: center;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 3/span 1;
}
#main.container .title5 {
  background: linear-gradient(106.4deg, rgb(215, 215, 215) 0%, rgb(113, 113, 113) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 64px;
  line-height: 98%;
  letter-spacing: -1px;
  font-weight: 700;
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
}
#main.container .container22 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 1;
  grid-row: 3/span 1;
}
#main.container .group3 {
  width: 69.37%;
  height: 81.17%;
  position: absolute;
  right: 15.44%;
  left: 15.19%;
  bottom: 10.01%;
  top: 8.82%;
  overflow: visible;
}
#main.container .content-uxheatmap__item {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
}
#main.container .content-journeymap__item {
  background: #FFF;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
}
#main.container .icon-group2 {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
  overflow: visible;
}
#main.container .container24 {
  background: #000000;
  border-radius: 16px;
  padding: 0px 40px 0px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 1/span 1;
}
#main.container .card-content3 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .heatmaps-bi-seo-ai-are-you-lost-among-fragme4 {
  color: #ffffff;
  text-align: center;
  font-size: 14px;
  line-height: 100%;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
#main.container .card-text2 {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container25 {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: flex-end;
  justify-content: flex-start;
  color: #fff;
  font-size: 68px;
  font-weight: 700;
  line-height: 100%;
}
#main.container .container25 .unit {
  padding: 12px 0px 12px 0px;
  display: block;
  color: #ffffff;
  text-align: center;
  font-size: 18px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
}
#main.container .title6 {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  color: #ffffff;
  text-align: center;
  font-size: 95px;
  line-height: 100%;
  letter-spacing: -3px;
  font-weight: 700;
  position: relative;
}
#main.container .heatmaps-bi-seo-ai-are-you-lost-among-fragme6 {
  color: #ffffff;
  text-align: center;
  font-size: 18px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .arrow-11 {
  flex-shrink: 0;
  width: 133px;
  height: 101px;
  position: absolute;
  left: 209px;
  top: 252px;
  overflow: visible;
}
#main.container .container27 {
  background: #181818;
  border-radius: 16px;
  padding: 48px 52px 60px 52px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 2;
  grid-row: 1/span 2;
}
#main.container .image-container {
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .image-container img {
  width: 100%;
  height: auto;
}
#main.container .image {
  border-radius: 11.31px;
  opacity: 0.8;
  width: 531.71px;
  height: 394.52px;
  position: absolute;
  left: calc(50% - 330.23px);
  top: calc(50% - 226.64px);
  object-fit: cover;
  aspect-ratio: 531.71/394.52;
}
#main.container .image2 {
  border-radius: 11.31px;
  width: 531.71px;
  height: 394.52px;
  position: absolute;
  left: calc(50% - 202.93px);
  top: calc(50% - 163.1px);
  box-shadow: 0px 4.52px 22.62px 0px rgba(0, 0, 0, 0.24);
  object-fit: cover;
  aspect-ratio: 531.71/394.52;
}
#main.container .image-caption {
  padding: 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .grid-img-caption {
  color: #bbbbbb;
  text-align: center;
  font-size: 30px;
  line-height: 150%;
  font-weight: 600;
  position: relative;
  flex: 1;
}
#main.container .grid-img-caption.light {
  padding: 0;
  color: #222222;
}
#main.container .container28 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 3/span 1;
}
#main.container .group4 {
  width: 66.85%;
  height: 69.68%;
  position: absolute;
  right: 16.92%;
  left: 16.23%;
  bottom: 15.61%;
  top: 14.71%;
  overflow: visible;
}
#main.container .container29 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 4/span 1;
}
#main.container .group5 {
  height: auto;
  position: absolute;
  left: 8.5px;
  top: 8px;
  overflow: visible;
}
#main.container .container30 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 1;
  grid-row: 4/span 1;
}
#main.container .group6 {
  height: auto;
  position: absolute;
  left: 6.5px;
  top: 4px;
  overflow: visible;
}
#main.container .card7 {
  display: flex;
  flex-direction: row;
  gap: 20px;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container31 {
  background: #13a5bf;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  flex: 1;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
}
#main.container .card-content4 {
  flex-shrink: 0;
  width: 514px;
  height: 97px;
  position: absolute;
  left: 50%;
  translate: -50%;
  top: 257px;
}
#main.container .card-content4:lang(en), #main.container .card-content4:lang(ja) {
  top: 287px;
}
#main.container ._20262 {
  color: #004585;
  text-align: center;
  font-size: 81px;
  font-weight: 600;
  line-height: 120%;
  letter-spacing: -0.81px;
  position: absolute;
  left: calc(50% - 226px);
  top: 0px;
  width: 377px;
}
#main.container ._20262 .icon--heatmap-billion {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -85px;
}
#main.container .container32 {
  width: 94.25px;
  height: 56px;
  position: absolute;
  left: 398.99px;
  top: 20px;
}
#main.container .group7 {
  height: auto;
  position: absolute;
  left: 37.59px;
  top: 0px;
  overflow: visible;
}
#main.container .vector {
  width: 45.3%;
  height: 21.49%;
  position: absolute;
  right: 54.42%;
  left: 0.27%;
  bottom: 23.22%;
  top: 55.29%;
  overflow: visible;
}
#main.container .vector2 {
  width: 45.75%;
  height: 32.22%;
  position: absolute;
  right: 54.25%;
  left: 0%;
  bottom: 5.14%;
  top: 62.64%;
  overflow: visible;
}
#main.container .card-title5 {
  color: #004585;
  text-align: center;
  font-size: 13px;
  font-weight: 500;
  line-height: 120%;
  position: relative;
  align-self: stretch;
}
#main.container .card-body2 {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
#main.container ._20263 {
  color: #ffffff;
  text-align: center;
  font-size: 30px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .card-description2 {
  color: #ffffff;
  text-align: center;
  font-size: 15px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .card-footer6 {
  background: #e0f6fa;
  border-radius: 999px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .card-footer-text2 {
  color: #065b62;
  text-align: center;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .container33 {
  background: #d7d7d7;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  flex: 1;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
}
#main.container .card-title6 {
  color: #ec0047;
  text-align: center;
  font-size: 13px;
  line-height: 120%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container ._20264 {
  color: #111111;
  text-align: center;
  font-size: 30px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .card-description3 {
  color: #111111;
  text-align: center;
  font-size: 15px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .card-footer7 {
  background: #ffffff;
  border-radius: 999px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .ellipse-18 {
  background: #ec0047;
  border-radius: 50%;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  position: relative;
}
#main.container .card-footer-text3 {
  text-align: center;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .card-footer-text-3-span {
  color: #ec0047;
}
#main.container .card-footer-text-3-span2 {
  color: #00305c;
}
#main.container .card-footer-text-3-span3 {
  color: #444444;
}
#main.container ._20265 {
  color: #ec0047;
  text-align: center;
  font-size: 81px;
  font-weight: 600;
  line-height: 120%; /* 97.2px */
  letter-spacing: -0.81px;
  position: absolute;
  left: calc(50% - 200px);
  top: 0px;
}
#main.container ._20265 .icon--heatmap-real {
  position: absolute;
  top: -16px;
  right: -108px;
}
#main.container .icon-group3 {
  width: 116px;
  height: 116px;
  position: absolute;
  left: 369px;
  top: -16px;
}
#main.container .group8 {
  width: 85.38%;
  height: 62.98%;
  position: absolute;
  right: 7.32%;
  left: 7.3%;
  bottom: 19.12%;
  top: 17.9%;
  overflow: visible;
}
#main.container .bt-en4 {
  background: #ec0047;
  border-radius: 999px;
  padding: 0px 28px 0px 28px;
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  height: 60px;
  min-width: 100px;
  position: relative;
  transform: translateZ(0) scale(1);
  will-change: transform;
  backface-visibility: hidden;
  transition: transform 0.3s ease-in-out;
}
#main.container .bt-en4:hover {
  transform: scale(1.1);
  background: #C6003B;
}
#main.container .contents-cxjourneymap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  position: relative;
}
#main.container .contents-cxjourneymap .grid-item-4 {
  grid-column: 2/span 1;
  grid-row: 5/span 1;
}
#main.container .contents-cxjourneymap .grid-item-5 {
  grid-column: 3/span 1;
  grid-row: 5/span 1;
}
#main.container .contents-cxjourneymap-2 {
  align-self: stretch;
  flex-shrink: 0;
  display: grid;
  gap: 20px;
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(5, fit-content(100%));
}
#main.container .container36 {
  background: #ebebeb;
  border-radius: 16px;
  padding: 0px 40px 0px 40px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 1/span 1;
}
#main.container .heatmaps-bi-seo-ai-are-you-lost-among-fragme9 {
  color: #2f2f2f;
  text-align: center;
  font-size: 14px;
  line-height: 100%;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
#main.container .card-content5 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .title7 {
  color: #2f2f2f;
  text-align: center;
  font-size: 64px;
  line-height: 90%;
  letter-spacing: -1px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container .heatmaps-bi-seo-ai-are-you-lost-among-fragme10 {
  color: #2f2f2f;
  text-align: center;
  font-size: 18px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .icon5 {
  flex-shrink: 0;
  width: 243px;
  height: 91px;
  position: relative;
  overflow: visible;
}
#main.container .container37 {
  background: #ffffff;
  border-radius: 16px;
  padding: 48px 52px 60px 52px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 2;
  grid-row: 1/span 2;
}
#main.container .image-container2 {
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .image-container2 img {
  width: 100%;
  height: auto;
}
#main.container .image3 {
  border-radius: 8.2px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.24);
  border-width: 0.82px;
  width: 529px;
  height: 314px;
  position: absolute;
  left: 117px;
  top: 21px;
  box-shadow: 0px 16.4px 13.12px -9.84px rgba(0, 0, 0, 0.12);
  object-fit: cover;
  aspect-ratio: 529/314;
}
#main.container .image4 {
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.24);
  border-width: 1px;
  width: 524px;
  height: 338.02px;
  position: absolute;
  left: 40px;
  top: 166px;
  box-shadow: var(--drop-shadow-pannel-dshadowpanell-box-shadow, 0px 18px 16px -12px rgba(0, 0, 0, 0.24));
  object-fit: cover;
  aspect-ratio: 524/338.02;
}
#main.container .image-description {
  padding: 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container38 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 2/span 1;
}
#main.container .card8 {
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .icon6 {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
  overflow: visible;
}
#main.container .card-content6 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container ._20255 {
  color: #222222;
  text-align: center;
  font-size: 26px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .card-description-smart-break2 {
  color: #777777;
  text-align: center;
  font-size: 16px;
  line-height: 150%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .container39 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 3/span 1;
}
#main.container .icon7 {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
}
#main.container .group9 {
  width: 69.37%;
  height: 81.17%;
  position: absolute;
  right: 15.44%;
  left: 15.19%;
  bottom: 10.01%;
  top: 8.82%;
  overflow: visible;
}
#main.container .container40 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 1;
  grid-row: 3/span 1;
}
#main.container .group10 {
  width: 66.85%;
  height: 69.68%;
  position: absolute;
  right: 16.92%;
  left: 16.23%;
  bottom: 15.61%;
  top: 14.71%;
  overflow: visible;
}
#main.container .main-title {
  padding: 10px 4px 10px 4px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  width: 388px;
  height: 388px;
  position: relative;
  grid-column: 3/span 1;
  grid-row: 3/span 1;
}
#main.container .title8 {
  color: #0e90a5;
  text-align: right;
  font-size: 64px;
  line-height: 98%;
  letter-spacing: -1px;
  font-weight: 700;
  position: relative;
  width: 364px;
}
#main.container .container41 {
  background: #000000;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 2;
  grid-row: 4/span 1;
}
#main.container .card-title7 {
  color: #16b5d2;
  text-align: left;
  font-size: 13px;
  line-height: 120%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container ._20266 {
  color: #ffffff;
  text-align: left;
  font-size: 30px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .card-description4 {
  color: #cccccc;
  text-align: left;
  font-size: 15px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
}
#main.container .card-footer8 {
  background: #ebebeb;
  border-radius: 999px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .card-footer-text4 {
  color: #0b7d8d;
  text-align: center;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .highlight {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-end;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container ._20267 {
  color: #16b5d2;
  text-align: right;
  font-size: 106px;
  line-height: 90%;
  letter-spacing: -0.03em;
  font-weight: 700;
  position: relative;
}
#main.container .group-20797 {
  flex-shrink: 0;
  width: 18.44%;
  height: 57.99%;
  position: absolute;
  right: 0%;
  left: 81.56%;
  bottom: 100.96%;
  top: -58.95%;
  overflow: visible;
}
#main.container .container42 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 4/span 1;
}
#main.container .group11 {
  height: auto;
  position: absolute;
  left: 8.5px;
  top: 8px;
  overflow: visible;
}
#main.container .container43 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 5/span 1;
}
#main.container .group12 {
  width: 87.44%;
  height: 76.64%;
  position: absolute;
  right: 5.94%;
  left: 6.62%;
  bottom: 11.59%;
  top: 11.76%;
  overflow: visible;
}
#main.container .container44 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 1;
  grid-row: 5/span 1;
}
#main.container .group13 {
  height: auto;
  position: absolute;
  left: 6.5px;
  top: 4px;
  overflow: visible;
}
#main.container .card-description5 {
  color: #777777;
  text-align: center;
  font-size: 16px;
  line-height: 150%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
  word-break: auto-phrase;
}
#main.container .contents-conversationalbi {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-conversationalbi-2 {
  align-self: stretch;
  flex-shrink: 0;
  display: grid;
  gap: 20px;
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(5, fit-content(100%));
}
#main.container .container45 {
  background: #181818;
  border-radius: 16px;
  padding: 48px 52px 60px 52px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 2;
  grid-row: 1/span 2;
}
#main.container .image5 {
  background: #747474;
  border-radius: 10px;
  width: 555px;
  height: 364px;
  position: absolute;
  left: 28px;
  top: 30px;
}
#main.container .image6 {
  background: #d9d9d9;
  border-radius: 10px;
  width: 555px;
  height: 364px;
  position: absolute;
  left: 108px;
  top: 96px;
}
#main.container .image-description-container {
  padding: 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-body-container {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .title9 {
  text-align: center;
  font-size: 72px;
  line-height: 100%;
  letter-spacing: -3px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container .title-9-span {
  color: #ffffff;
}
#main.container .title-9-span2 {
  color: #ffffff;
}
#main.container .card-header3 {
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex: 1;
  position: relative;
}
#main.container .card-icon-container {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
  overflow: visible;
}
#main.container .card-body-container2 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container46 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 3/span 1;
}
#main.container .card-icon-container2 {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
}
#main.container .group14 {
  width: 69.37%;
  height: 81.17%;
  position: absolute;
  right: 15.44%;
  left: 15.19%;
  bottom: 10.01%;
  top: 8.82%;
  overflow: visible;
}
#main.container .group15 {
  width: 66.85%;
  height: 69.68%;
  position: absolute;
  right: 16.92%;
  left: 16.23%;
  bottom: 15.61%;
  top: 14.71%;
  overflow: visible;
}
#main.container .group16 {
  height: auto;
  position: absolute;
  left: 8.5px;
  top: 8px;
  overflow: visible;
}
#main.container ._20256 {
  color: #ffffff;
  text-align: center;
  font-size: 26px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
}
#main.container .main-title2 {
  padding: 10px 4px 10px 4px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  grid-column: 1/span 1;
  grid-row: 4/span 1;
}
#main.container .title10 {
  background: linear-gradient(106.4deg, rgb(215, 215, 215) 0%, rgb(113, 113, 113) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 52px;
  line-height: 98%;
  letter-spacing: -1px;
  font-weight: 700;
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}
#main.container .group17 {
  height: auto;
  position: absolute;
  left: 6.5px;
  top: 4px;
  overflow: visible;
}
#main.container .group18 {
  width: 87.44%;
  height: 76.64%;
  position: absolute;
  right: 5.94%;
  left: 6.62%;
  bottom: 11.59%;
  top: 11.76%;
  overflow: visible;
}
#main.container .container47 {
  background: #13a5bf;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 2;
  grid-row: 5/span 1;
}
#main.container .card-header4 {
  margin-top: auto;
}
#main.container ._20268 {
  color: #004585;
  text-align: center;
  font-size: 81px;
  line-height: 120%;
  letter-spacing: -0.81px;
  font-weight: 600;
}
#main.container ._20269 {
  color: #ffffff;
  text-align: center;
  font-size: 30px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
}
#main.container .contents-generativegeo {
  background: #ebebeb;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-generativegeo-2 {
  background: #ebebeb;
  align-self: stretch;
  flex-shrink: 0;
  display: grid;
  gap: 20px;
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(5, fit-content(100%));
}
#main.container .container52 {
  background: #ffffff;
  border-radius: 16px;
  padding: 48px 52px 60px 52px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 2;
  grid-row: 1/span 2;
}
#main.container .container53 {
  align-self: stretch;
  flex-shrink: 0;
  height: 540px;
  position: relative;
}
#main.container .image7 {
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.24);
  border-width: 1px;
  width: 559px;
  height: 361px;
  position: absolute;
  left: 114px;
  top: 68px;
  box-shadow: var(--drop-shadow-pannel-dshadowpanelm-box-shadow, 0px 20px 16px -12px rgba(0, 0, 0, 0.12));
  object-fit: cover;
  aspect-ratio: 559/361;
}
#main.container .image8 {
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.24);
  border-width: 1px;
  width: 559px;
  height: 361px;
  position: absolute;
  left: 24px;
  top: 148px;
  box-shadow: var(--drop-shadow-pannel-dshadowpanell-box-shadow, 0px 18px 16px -12px rgba(0, 0, 0, 0.24));
  object-fit: cover;
  aspect-ratio: 559/361;
}
#main.container .container54 {
  padding: 10px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .heatmaps-bi-seo-ai-are-you-lost-among-fragme12 {
  color: #222222;
  text-align: center;
  font-size: 30px;
  line-height: 150%;
  font-weight: 600;
  position: relative;
}
#main.container .container55 {
  background: #ebebeb;
  border-radius: 16px;
  padding: 0px 40px 0px 40px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 1/span 1;
}
#main.container .container56 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container57 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container58 {
  flex-shrink: 0;
  width: 243px;
  height: 91px;
  position: relative;
  overflow: visible;
}
#main.container .container59 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 2/span 1;
}
#main.container .container60 {
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container61 {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
  overflow: visible;
}
#main.container .container62 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container63 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 4/span 1;
}
#main.container .container64 {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
}
#main.container .group27 {
  height: auto;
  position: absolute;
  left: 6.5px;
  top: 4px;
  overflow: visible;
}
#main.container .container65 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 1;
  grid-row: 4/span 1;
}
#main.container .group28 {
  width: 87.44%;
  height: 76.64%;
  position: absolute;
  right: 5.94%;
  left: 6.62%;
  bottom: 11.59%;
  top: 11.76%;
  overflow: visible;
}
#main.container .container66 {
  background: #000000;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 4/span 2;
}
#main.container .card-title8 {
  color: #ff1553;
  text-align: left;
  font-size: 13px;
  line-height: 120%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .card-body3 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-description6 {
  color: #cccccc;
  text-align: left;
  font-size: 15px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .card-footer9 {
  background: #222222;
  border-radius: 999px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .card-footer-text5 {
  color: #ffffff;
  text-align: center;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .card-footer10 {
  padding: 40px 0px 0px 0px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-footer-text6 {
  padding: 17px 0px 0px 0px;
}
#main.container ._202610 {
  color: #ec0047;
  font-size: 75px;
  line-height: 90%;
  letter-spacing: -2.25px;
  font-weight: 700;
  text-align: right;
  display: flex;
  flex-direction: row;
}
#main.container ._202610 ._2027 {
  margin-right: -22px;
  padding-top: 17px;
  color: #EC0047;
  font-size: 24px;
  font-weight: 600;
  line-height: 90%;
  letter-spacing: -0.24px;
}
#main.container .container67 {
  padding: 10px 4px 10px 4px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  height: 153px;
  position: relative;
  grid-column: 1/span 2;
  grid-row: 5/span 1;
}
#main.container .title11 {
  background: linear-gradient(-75.38deg, rgb(56, 56, 56) 0%, rgb(74, 74, 74) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 52px;
  line-height: 98%;
  letter-spacing: -1px;
  font-weight: 700;
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
}
#main.container .group29 {
  width: 69.37%;
  height: 81.17%;
  position: absolute;
  right: 15.44%;
  left: 15.19%;
  bottom: 10.01%;
  top: 8.82%;
  overflow: visible;
}
#main.container .group30 {
  width: 66.85%;
  height: 69.68%;
  position: absolute;
  right: 16.92%;
  left: 16.23%;
  bottom: 15.61%;
  top: 14.71%;
  overflow: visible;
}
#main.container .container68 {
  background: #ffffff;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 3/span 1;
}
#main.container .group31 {
  height: auto;
  position: absolute;
  left: 8.5px;
  top: 8px;
  overflow: visible;
}
#main.container .contents-actionable {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-actionable-2 {
  align-self: stretch;
  flex-shrink: 0;
  display: grid;
  gap: 20px;
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(5, fit-content(100%));
}
#main.container .image9 {
  border-radius: 11.31px;
  opacity: 0.8;
  width: 534px;
  height: 394px;
  position: absolute;
  left: calc(50% - 329.67px);
  top: calc(50% - 226.5px);
  object-fit: cover;
  aspect-ratio: 534/394;
}
#main.container .image10 {
  border-radius: 11.31px;
  width: 579px;
  height: 395px;
  position: absolute;
  left: calc(50% - 247.67px);
  top: calc(50% - 175.5px);
  box-shadow: 0px 4.52px 22.62px 0px rgba(0, 0, 0, 0.24);
  object-fit: cover;
  aspect-ratio: 579/395;
}
#main.container .card9 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .group32 {
  flex-shrink: 0;
  width: 30.66%;
  height: 52.11%;
  position: absolute;
  right: 14.32%;
  left: 55.02%;
  bottom: -61.27%;
  top: 109.15%;
  overflow: visible;
}
#main.container .card-content7 {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .title12 {
  color: #ffffff;
  text-align: center;
  font-size: 95px;
  line-height: 100%;
  letter-spacing: -3px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container .container69 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 2/span 1;
}
#main.container .card-icon {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
  overflow: visible;
}
#main.container .card-description7 {
  color: #999999;
  text-align: center;
  font-size: 16px;
  line-height: 150%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .container70 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 3/span 1;
}
#main.container .card-icon2 {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
}
#main.container .group33 {
  width: 69.37%;
  height: 81.17%;
  position: absolute;
  right: 15.44%;
  left: 15.19%;
  bottom: 10.01%;
  top: 8.82%;
  overflow: visible;
}
#main.container .container71 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 1;
  grid-row: 3/span 1;
}
#main.container .group34 {
  width: 66.85%;
  height: 69.68%;
  position: absolute;
  right: 16.92%;
  left: 16.23%;
  bottom: 15.61%;
  top: 14.71%;
  overflow: visible;
}
#main.container .main-title3 {
  padding: 10px 4px 10px 4px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  height: 388px;
  position: relative;
  grid-column: 3/span 1;
  grid-row: 3/span 1;
}
#main.container .title13 {
  background: linear-gradient(106.4deg, rgb(215, 215, 215) 0%, rgb(113, 113, 113) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: right;
  font-size: 64px;
  line-height: 98%;
  letter-spacing: -1px;
  font-weight: 700;
  position: relative;
  width: 370px;
}
#main.container .container72 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 4/span 1;
}
#main.container .group35 {
  height: auto;
  position: absolute;
  left: 8.5px;
  top: 8px;
  overflow: visible;
}
#main.container .container73 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 1;
  grid-row: 4/span 1;
}
#main.container .group36 {
  height: auto;
  position: absolute;
  left: 6.5px;
  top: 4px;
  overflow: visible;
}
#main.container .container74 {
  background: #181818;
  border-radius: 16px;
  padding: 60px 40px 60px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  width: 388px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 1;
  grid-row: 4/span 1;
}
#main.container .group37 {
  width: 87.44%;
  height: 76.64%;
  position: absolute;
  right: 5.94%;
  left: 6.62%;
  bottom: 11.59%;
  top: 11.76%;
  overflow: visible;
}
#main.container .container75 {
  background: #13a5bf;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  width: 796px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 1;
  grid-row: 5/span 1;
}
#main.container .card10 {
  position: relative;
  margin-top: auto;
}
#main.container .icon--ai-tech {
  position: absolute;
  right: 9px;
  top: -42px;
}
#main.container .contents-cxbigdata {
  background: #ebebeb;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  position: relative;
}
#main.container .contents-cxbigdata .grid-item-4 {
  grid-column: 2/span 1;
  grid-row: 5/span 1;
}
#main.container .contents-cxbigdata .grid-item-5 {
  grid-column: 3/span 1;
  grid-row: 5/span 1;
}
#main.container .contents-cxbigdata-2 {
  background: #ebebeb;
  align-self: stretch;
  flex-shrink: 0;
  display: grid;
  gap: 20px;
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(5, fit-content(100%));
}
#main.container .card-body4 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-body5 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .group38 {
  flex-shrink: 0;
  width: 38.19%;
  height: 68.81%;
  position: absolute;
  right: -2.91%;
  left: 64.72%;
  bottom: -90.15%;
  top: 121.33%;
  overflow: visible;
}
#main.container .image11 {
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.24);
  border-width: 1px;
  width: 555px;
  height: 364px;
  position: absolute;
  left: 116px;
  top: 30px;
  box-shadow: var(--drop-shadow-pannel-dshadowpanelm-box-shadow, 0px 20px 16px -12px rgba(0, 0, 0, 0.12));
  object-fit: cover;
}
#main.container .image12 {
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.24);
  border-width: 1px;
  width: 555px;
  height: 364px;
  position: absolute;
  left: 28px;
  top: 126px;
  box-shadow: var(--drop-shadow-pannel-dshadowpanell-box-shadow, 0px 18px 16px -12px rgba(0, 0, 0, 0.24));
  object-fit: cover;
}
#main.container .icon8 {
  flex-shrink: 0;
  width: 68px;
  height: 68px;
  position: relative;
  overflow: visible;
}
#main.container .card-body6 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .group39 {
  width: 69.37%;
  height: 81.17%;
  position: absolute;
  right: 15.44%;
  left: 15.19%;
  bottom: 10.01%;
  top: 8.82%;
  overflow: visible;
}
#main.container .group40 {
  width: 66.85%;
  height: 69.68%;
  position: absolute;
  right: 16.92%;
  left: 16.23%;
  bottom: 15.61%;
  top: 14.71%;
  overflow: visible;
}
#main.container .title14 {
  color: #0e90a5;
  text-align: right;
  font-size: 64px;
  line-height: 98%;
  letter-spacing: -1px;
  font-weight: 700;
  position: relative;
}
#main.container .group41 {
  height: auto;
  position: absolute;
  left: 8.5px;
  top: 8px;
  overflow: visible;
}
#main.container .container76 {
  background: #000000;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 796px;
  height: 388px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 2;
  grid-row: 4/span 1;
}
#main.container .card11 {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
#main.container ._202611 {
  color: #16b5d2;
  text-align: left;
  font-size: 81px;
  line-height: 90%;
  letter-spacing: -0.03em;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container .group42 {
  width: 87.44%;
  height: 76.64%;
  position: absolute;
  right: 5.94%;
  left: 6.62%;
  bottom: 11.59%;
  top: 11.76%;
  overflow: visible;
}
#main.container .group43 {
  height: auto;
  position: absolute;
  left: 6.5px;
  top: 4px;
  overflow: visible;
}
#main.container .contents-05 {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-05 .inner {
  padding-block: 200px;
}
#main.container .contents-05 .red-text {
  color: #FF1553;
}
#main.container .contents-05-2 {
  display: flex;
  flex-direction: column;
  gap: 80px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .column {
  background: #1a1a1a;
  border-radius: 16px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 1204px;
  position: relative;
  box-shadow: 0px 41px 36px -14px rgba(0, 0, 0, 0.25), 0px 0px 0px 1px rgba(0, 0, 0, 0.06);
  overflow: hidden;
}
#main.container .column2 {
  background: #1a1a1a;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 181px;
  position: relative;
}
#main.container .column2 .row {
  border-bottom: 1px solid #2f2f2f;
}
#main.container .column2 .row2 {
  border-bottom: 1px solid #2f2f2f;
}
#main.container .row {
  padding: 0px 16px 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  height: 68px;
  position: relative;
}
#main.container .row2 {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  height: 108px;
  position: relative;
}
#main.container .row2:last-of-type {
  border: none !important;
}
#main.container .text2 {
  color: #ffffff;
  text-align: left;
  font-size: 14px;
  line-height: 120%;
  font-weight: 500;
  position: relative;
}
#main.container .column3 {
  background: #222222;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  width: 296px;
  position: relative;
}
#main.container .column3 .row {
  border-bottom: 1px solid #666;
}
#main.container .column3 .row2 {
  border-bottom: 1px solid #666;
}
#main.container .text3 {
  color: #cccccc;
  text-align: left;
  font-size: 16px;
  line-height: 100%;
  font-weight: 600;
  position: relative;
}
#main.container .text4 {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .text5 {
  color: #bbbbbb;
  text-align: left;
  font-size: 15px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .column4 {
  background: #363636;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 282px;
  position: relative;
}
#main.container .column4 .row {
  border-bottom: 1px solid #888;
}
#main.container .column4 .row2 {
  border-bottom: 1px solid #888;
}
#main.container .divider3 {
  background: #888888;
  align-self: stretch;
  flex-shrink: 0;
  height: 1px;
  position: relative;
}
#main.container .container77 {
  background: #d7d7d7;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 447px;
  position: relative;
}
#main.container .container77 > div {
  border-bottom: 1px solid #AAA;
}
#main.container .container77 > div:last-of-type {
  border: none;
}
#main.container .container78 {
  padding: 0px 16px 12px 16px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  height: 68px;
  position: relative;
}
#main.container .container79 {
  display: flex;
  flex-direction: row;
  gap: 2px;
  justify-content: flex-start;
  flex-shrink: 0;
  height: 36px;
  position: relative;
}
#main.container .title15 {
  color: #ec0047;
  text-align: left;
  font-size: 30px;
  line-height: 100%;
  font-weight: 700;
  position: relative;
}
#main.container .title15 .icon--diff-highlight1 {
  position: absolute;
  top: -6px;
  right: -18px;
}
#main.container .icon-container9 {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  height: auto;
  position: relative;
  overflow: visible;
}
#main.container .divider4 {
  background: #aaaaaa;
  align-self: stretch;
  flex-shrink: 0;
  height: 1px;
  position: relative;
}
#main.container .container80 {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  height: 108px;
  position: relative;
}
#main.container .container81 {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .subtitle {
  color: #222222;
  text-align: left;
  font-size: 20px;
  line-height: 150%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .heading-text6 {
  text-align: center;
  font-size: 48px;
  line-height: 120%;
  letter-spacing: -1.24px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container .heading-text6 .heading-text-6-span {
  color: #16b5d2;
  position: relative;
}
#main.container .heading-text6 .heading-text-6-span2 {
  color: #ffffff;
}
#main.container .heading-text6 .highlight-07 {
  flex-shrink: 0;
  width: 293px;
  height: 150px;
  position: absolute;
  top: -51px;
  left: -16px;
}
#main.container .contents-06 {
  background: #000000;
  padding: 0px 12px 0px 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .background-image {
  background: linear-gradient(to left, rgba(0, 0, 0, 0.24), rgba(0, 0, 0, 0.24));
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container82 {
  padding: 0px 0px 32px 0px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .heading-text7 {
  color: #ff1553;
  text-align: center;
  font-size: 32px;
  line-height: 120%;
  letter-spacing: -1.24px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container .heading-text8 {
  color: #ffffff;
  text-align: center;
  font-size: 60px;
  line-height: 120%;
  letter-spacing: -1.24px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container .main-container3 {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .container83 {
  background: rgba(0, 0, 0, 0.6);
  border-radius: 16px;
  padding: 48px 40px 32px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  flex-shrink: 0;
  width: 388px;
  min-height: 500px;
  height: auto;
  align-self: stretch;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(28px);
}
#main.container .card12 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-content8 {
  display: flex;
  flex-direction: column;
  gap: 11px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-footer11 {
  background: #ffffff;
  border-radius: 999px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 26px;
  position: relative;
}
#main.container .card-footer-text7 {
  color: #ec0047;
  text-align: center;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .card-header5 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container ._20257 {
  color: #ffffff;
  text-align: left;
  font-size: 36px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .card-footer12 {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-description8 {
  color: #cccccc;
  text-align: left;
  font-size: 22px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
}
#main.container .card-description9 {
  color: #cccccc;
  text-align: left;
  font-size: 16px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .card-icon3 {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  position: relative;
}
#main.container ._12 {
  width: 40px;
  height: 28.27px;
  position: absolute;
  left: 1.96px;
  top: 7.9px;
  overflow: visible;
}
#main.container .divider5 {
  padding: 8px 0px 8px 0px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .divider-line {
  background: #444444;
  align-self: stretch;
  flex-shrink: 0;
  height: 1px;
  position: relative;
}
#main.container .card-footer-container {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-description10 {
  color: #2bc0d9;
  text-align: left;
  font-size: 20px;
  line-height: 150%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .card-description11 {
  color: #ffffff;
  text-align: left;
  font-size: 26px;
  line-height: 150%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container ._13 {
  width: 41.5px;
  height: 37.74px;
  position: absolute;
  left: 1.4px;
  top: 2px;
  overflow: visible;
}
#main.container .card-description12 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container ._14 {
  width: 42.34px;
  height: 29.46px;
  position: absolute;
  left: 0.7px;
  top: 7px;
  overflow: visible;
}
#main.container ._15 {
  width: 38.67px;
  height: 32.83px;
  position: absolute;
  left: 50%;
  translate: -50% -50%;
  top: 50%;
  overflow: visible;
}
#main.container ._16 {
  width: 28.77px;
  height: 38.4px;
  position: absolute;
  left: 50%;
  translate: -50% -50%;
  top: 50%;
  overflow: visible;
}
#main.container .card-details {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-07-1 {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  height: 1280px;
  position: relative;
}
#main.container .ai-section {
  padding-block: 412px 360px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
#main.container .heading-text9 {
  text-align: center;
  font-size: 52px;
  line-height: 120%;
  letter-spacing: -1.24px;
  font-weight: 700;
  position: relative;
  flex: 1;
  color: #ffffff;
}
#main.container .heading-text9 .accent {
  color: #FF1553;
}
#main.container .heading-text-9-span {
  color: #ffffff;
}
#main.container .heading-text-9-span2 {
  color: #ff1553;
}
#main.container .container84 {
  flex-shrink: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
#main.container .container84 .text-box {
  display: flex;
  flex-direction: column;
}
#main.container .container84 .text-box.left {
  padding-bottom: 10px;
  gap: 1px;
}
#main.container .card-description13 {
  color: #bbbbbb;
  text-align: center;
  font-size: 18px;
  line-height: 150%;
  font-weight: 600;
}
#main.container .heading-text10 {
  color: #bbbbbb;
  text-align: center;
  font-size: 88px;
  line-height: 120%;
  letter-spacing: -3px;
  font-weight: 700;
}
#main.container .card-description14 {
  color: #cccccc;
  text-align: center;
  font-size: 18px;
  line-height: 150%;
  font-weight: 600;
}
#main.container .heading-text11 {
  color: #ffffff;
  text-align: center;
  font-size: 120px;
  line-height: 120%;
  letter-spacing: -3px;
  font-weight: 700;
}
#main.container .arrow-container {
  width: 216.26px;
  height: 89.82px;
  position: absolute;
  left: 202px;
  top: 44.3px;
}
#main.container .arrow-05 {
  width: 105.43%;
  height: 192.6%;
  position: absolute;
  right: -1.9%;
  left: -3.53%;
  bottom: -96.04%;
  top: 3.43%;
  transform: translate(0px, -55.56px);
  overflow: visible;
}
#main.container .contents-08 {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .contents-08-1 {
  padding: 0px 12px 0px 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
}
#main.container .contents-08-1-wrap {
  border-radius: 20px;
  height: 560px;
  width: 100%;
}
#main.container .contents-08-1-wrap .inner {
  display: flex;
  align-items: center;
  padding-block: 200px 24px;
}
#main.container .sub-copy2 {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  height: 26px;
  position: relative;
}
#main.container .heatmaps-bi-seo-ai-are-you-lost-among-fragme14 {
  color: #ff1553;
  text-align: left;
  font-size: 26px;
  line-height: 100%;
  font-weight: 600;
  position: relative;
}
#main.container .contents-08-2 {
  padding-block: 120px 200px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  justify-content: flex-start;
  position: relative;
}
#main.container .container85 {
  min-height: 400px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex: 1 1 338px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
}
#main.container .deto-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 20px;
}
#main.container .card14 {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-footer13 {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-footer14 {
  border-radius: 999px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.24);
  border-width: 1px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .card-footer-text8 {
  color: #ffffff;
  text-align: left;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container ._202612 {
  color: #FFF;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 120%;
}
#main.container ._202612 .accent {
  color: #FF1553;
}
#main.container ._202612-span {
  color: #ffffff;
}
#main.container ._202612-span2 {
  color: #ff1553;
}
#main.container .card-description15 {
  color: #bbbbbb;
  text-align: left;
  font-size: 14px;
  line-height: 150%;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
#main.container .card-description16 {
  color: #ffffff;
  text-align: left;
  font-size: 14px;
  line-height: 150%;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
#main.container .heading-text12 {
  text-align: left;
  font-size: 52px;
  line-height: 120%;
  letter-spacing: -1.24px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container .heading-text12 .accent {
  color: #16B5D2;
  position: relative;
}
#main.container .heading-text12 .accent .solution--underline {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background-size: 100% 100%;
  bottom: -45px;
}
#main.container .heading-text-12-span {
  color: #ffffff;
}
#main.container .heading-text-12-span .accent {
  color: #16b5d2;
}
#main.container .heading-text-12-span2 {
  color: #16b5d2;
  position: relative;
}
#main.container .heatmaps-bi-seo-ai-are-you-lost-among-fragme15 {
  color: #ebebeb;
  text-align: left;
  font-size: 18px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .underline-042 {
  width: 100%;
  height: 40px;
  position: absolute;
  left: 0;
  bottom: -37px;
}
#main.container .contents-09 {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .tech__section {
  overflow: hidden;
}
#main.container .tech__section .trend-card-img {
  position: absolute;
  bottom: 0;
  right: 0;
}
#main.container .contents-09-2 {
  align-self: stretch;
  flex-shrink: 0;
  display: grid;
  gap: 20px;
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, fit-content(100%));
}
#main.container .img-tree {
  height: 420px;
  grid-column: 3/span 1;
  grid-row: 1/span 1;
  position: relative;
}
#main.container .img-tree .trend-card-img {
  right: unset;
  left: 0;
  bottom: -20px;
}
#main.container .image13 {
  width: 510px;
  height: 384px;
  position: absolute;
  left: 0px;
  top: 56px;
  object-fit: cover;
  aspect-ratio: 510/384;
}
#main.container .container86 {
  background: #181818;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 2;
  grid-row: 3/span 2;
}
#main.container .card-header6 {
  color: #2bc0d9;
  text-align: left;
  font-size: 12px;
  line-height: 150%;
  font-weight: 400;
  position: relative;
}
#main.container ._202613 {
  color: #ffffff;
  text-align: left;
  font-size: 68px;
  line-height: 100%;
  font-weight: 700;
  position: relative;
}
#main.container .container87 {
  padding: 0px 0px 12px 0px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-title9 {
  color: #ffffff;
  text-align: left;
  font-size: 24px;
  line-height: 100%;
  font-weight: 600;
  position: relative;
}
#main.container .card-title10 {
  color: #ffffff;
  text-align: left;
  font-size: 20px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
}
#main.container .card-description17 {
  color: #bbbbbb;
  text-align: left;
  font-size: 14px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .container88 {
  flex-shrink: 0;
  width: 284px;
  height: 253px;
  position: absolute;
  left: 147px;
  top: 218px;
}
#main.container .image14 {
  width: 284px;
  height: 253px;
  position: absolute;
  left: 0px;
  top: 0px;
  object-fit: cover;
  aspect-ratio: 284/253;
}
#main.container .container89 {
  background: #13a5bf;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 2/span 2;
  grid-row: 2/span 1;
}
#main.container ._202614 {
  color: #ffffff;
  text-align: right;
  font-size: 44px;
  line-height: 120%;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container .card-description18 {
  color: #ffffff;
  text-align: right;
  font-size: 18px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
#main.container .card-title11 {
  color: #004585;
  text-align: right;
  font-size: 26px;
  line-height: 120%;
  font-weight: 700;
  position: relative;
  align-self: stretch;
}
#main.container ._202615 {
  color: #80daeb;
  text-align: right;
  font-size: 71px;
  font-weight: 600;
  line-height: 120%; /* 85.2px */
  letter-spacing: -0.71px;
  position: absolute;
  left: calc(50% - 300px);
  top: 306px;
}
#main.container .container90 {
  background: #181818;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 1/span 2;
  grid-row: 1/span 2;
}
#main.container .container91 {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: flex-end;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-title12 {
  color: #ffffff;
  text-align: left;
  font-size: 20px;
  line-height: 120%;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .container92 {
  flex-shrink: 0;
  width: 260.02px;
  height: 173px;
  position: absolute;
  left: 129px;
  top: 247px;
  overflow: hidden;
}
#main.container .radial-timeline-multi-scale-2 {
  width: 309px;
  height: 284px;
  position: absolute;
  left: 0px;
  top: 0px;
  object-fit: cover;
  aspect-ratio: 309/284;
}
#main.container .canvas-1 {
  width: 301px;
  height: 182px;
  position: absolute;
  left: -19px;
  top: 80px;
  object-fit: cover;
  aspect-ratio: 301/182;
}
#main.container .container93 {
  background: #181818;
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(8px);
  grid-column: 3/span 2;
  grid-row: 1/span 2;
}
#main.container .image15 {
  width: 282px;
  height: 274px;
  position: absolute;
  left: 36px;
  top: 4px;
  object-fit: cover;
  aspect-ratio: 282/274;
}
#main.container .contents-10 {
  padding: 0 12px;
}
#main.container .contents-10 .card2 {
  align-items: flex-start;
}
#main.container .contents-10 .container-10-1 {
  border-radius: 20px;
}
#main.container .frame2 {
  background: #000000;
  opacity: 0.52;
  flex-shrink: 0;
  width: 1824px;
  height: 1516px;
  position: absolute;
  left: 0px;
  top: 0px;
  overflow: hidden;
}
#main.container .ai-section2 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1824px;
  position: relative;
}
#main.container .heading-text14 {
  text-align: center;
  font-size: 80px;
  line-height: 100%;
  font-weight: 700;
  position: relative;
  flex: 1;
}
#main.container .heading-text-14-span {
  color: #ffffff;
}
#main.container .heading-text-14-span2 {
  color: #ff1553;
}
#main.container .container94 {
  background: rgba(0, 0, 0, 0.6);
  border-radius: 16px;
  padding: 48px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(28px);
}
#main.container .container94.card-1 {
  grid-column: 1/span 2;
  grid-row: 1/span 2;
}
#main.container .container94.card-2 {
  grid-column: 3/span 4;
  grid-row: 1/span 2;
}
#main.container .container94.card-3 {
  grid-column: 1/span 4;
  grid-row: 3/span 2;
}
#main.container .container94 .divider {
  height: 1px;
  width: 100%;
  background-color: #2F2F2F;
}
#main.container .title16 {
  color: #ff1553;
  text-align: left;
  font-size: 12px;
  line-height: 150%;
  font-weight: 400;
  position: relative;
}
#main.container .subtitle2 {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: flex-end;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container ._202616 {
  color: #ffffff;
  text-align: left;
  font-size: 42px;
  line-height: 100%;
  font-weight: 700;
  position: relative;
}
#main.container .feature-text4 {
  color: #cccccc;
  text-align: left;
  font-size: 16px;
  line-height: 120%;
  font-weight: 500;
  position: relative;
}
#main.container .image16 {
  flex-shrink: 0;
  width: 260.02px;
  height: 173px;
  position: absolute;
  left: 129px;
  top: 247px;
  overflow: hidden;
}
#main.container .description3 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .frame3 {
  position: absolute;
  top: 61px;
  right: 85px;
}
#main.container .image17 {
  width: 100%;
  height: 284.86px;
  position: absolute;
  right: 0%;
  left: 0%;
  top: 0px;
  object-fit: cover;
  aspect-ratio: 277/284.86;
}
#main.container .card-title13 {
  color: #ff1553;
  text-align: left;
  font-size: 12px;
  line-height: 150%;
  font-weight: 400;
  position: relative;
}
#main.container .card-subtitle {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: flex-end;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-description19 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .img-3-d {
  position: absolute;
  left: 385px;
  bottom: -99px;
}
#main.container .main-content {
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: center;
  width: 600px;
  height: 600px;
  position: absolute;
  left: -130px;
  top: -21.33px;
}
#main.container .multi-layer-helix {
  flex-shrink: 0;
  width: 600px;
  height: 600px;
  position: relative;
  box-shadow: 0px 0px 26.67px 0px rgba(255, 255, 255, 0.1);
  transform-origin: 0 0;
  transform: rotate(0deg) scale(1, 1);
}
#main.container .group45 {
  width: 14%;
  height: 18.64%;
  position: absolute;
  right: 43.05%;
  left: 42.95%;
  bottom: 40.4%;
  top: 40.95%;
  overflow: visible;
}
#main.container .group46 {
  width: 52.87%;
  height: 58.31%;
  position: absolute;
  right: 21.89%;
  left: 25.24%;
  bottom: 21.76%;
  top: 19.93%;
  overflow: visible;
}
#main.container .group47 {
  width: 27.39%;
  height: 27.89%;
  position: absolute;
  right: 36.54%;
  left: 36.07%;
  bottom: 35.86%;
  top: 36.25%;
  overflow: visible;
}
#main.container .group48 {
  width: 50.99%;
  height: 69.49%;
  position: absolute;
  right: 23.6%;
  left: 25.41%;
  bottom: 24.14%;
  top: 6.37%;
  overflow: visible;
}
#main.container .industry__section {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
}
#main.container .industry__section .inner {
  padding-block: 200px 160px;
}
#main.container .heading-text15 {
  color: #ffffff;
  text-align: center;
  font-size: 80px;
  line-height: 100%;
  font-weight: 700;
  position: relative;
  flex: 1;
}
#main.container .contents-11-2 {
  align-self: stretch;
  flex-shrink: 0;
  display: grid;
  gap: 20px;
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, fit-content(100%));
}
#main.container ._202617 {
  color: #13a5bf;
  text-align: left;
  font-size: 143px;
  line-height: 100%;
  font-weight: 700;
  position: relative;
  grid-column: 3/span 1;
  grid-row: 1/span 1;
}
#main.container ._202617 .deco-text {
  position: absolute;
  bottom: 28px;
  left: -235px;
  overflow-wrap: initial;
}
#main.container .container97 {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 60px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(12px);
  z-index: 1;
}
#main.container .card-statistic {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: flex-end;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container ._202618 {
  color: #ffffff;
  text-align: left;
  font-size: 60px;
  line-height: 100%;
  font-weight: 700;
  position: relative;
}
#main.container .card-statistic-symbol {
  padding: 0px 0px 8px 0px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
#main.container .card-title14 {
  color: #ffffff;
  text-align: left;
  font-size: 36px;
  line-height: 100%;
  font-weight: 700;
  position: relative;
}
#main.container .group49 {
  width: 78.83%;
  height: 66.48%;
  position: absolute;
  right: 10.71%;
  left: 10.46%;
  bottom: 17.35%;
  top: 16.18%;
  overflow: visible;
}
#main.container .container98 {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 60px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 388px;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(12px);
  grid-column: 2/span 1;
  grid-row: 1/span 1;
}
#main.container .card-statistic2 {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: flex-end;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .group50 {
  width: 66.85%;
  height: 69.68%;
  position: absolute;
  right: 16.92%;
  left: 16.23%;
  bottom: 15.61%;
  top: 14.71%;
  overflow: visible;
}
#main.container .container99 {
  border-radius: 16px;
  padding: 0px 4px 0px 4px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 388px;
  height: 420px;
  position: relative;
  overflow: hidden;
  grid-column: 1/span 1;
  grid-row: 2/span 1;
}
#main.container .title17 {
  background: linear-gradient(106.4deg, rgb(215, 215, 215) 0%, rgb(113, 113, 113) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: left;
  font-size: 48px;
  line-height: 98%;
  letter-spacing: -1px;
  font-weight: 700;
  position: relative;
  width: 370px;
}
#main.container .container100 {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 60px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 388px;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(12px);
  grid-column: 2/span 1;
  grid-row: 2/span 1;
}
#main.container .group51 {
  height: auto;
  position: absolute;
  left: 8.5px;
  top: 8px;
  overflow: visible;
}
#main.container .container101 {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 60px 40px 48px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 388px;
  height: 420px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(12px);
  grid-column: 3/span 1;
  grid-row: 2/span 1;
}
#main.container .group52 {
  width: 69.37%;
  height: 81.17%;
  position: absolute;
  right: 15.44%;
  left: 15.19%;
  bottom: 10%;
  top: 8.82%;
  overflow: visible;
}
#main.container .marquee__section {
  overflow: hidden;
  width: 100%;
}
#main.container .marquee__section .marquee {
  width: 100%;
  padding: 10px;
  background: rgba(255, 255, 255, 0.08);
}
#main.container .marquee__section .marquee__list {
  gap: 10px;
  display: flex;
  animation: scroll 20s linear infinite;
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0);
  width: max-content;
}
#main.container .marquee__section .marquee .item {
  min-height: 37px;
  display: flex;
  flex: 1 0 180px;
  height: 38px;
  align-items: center;
  justify-content: center;
}
#main.container .marquee__section .marquee .item img {
  object-fit: contain;
  object-position: center;
  width: 100%;
  height: 100%;
  display: block;
}
@keyframes scroll {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}
#main.container .beusable__section .inner {
  padding-block: 162px 0px;
}
#main.container .beusable__section .section__title .title-wrap {
  padding: 10px 0 32px;
}
#main.container .beusable__section .section__title .title-wrap .title {
  font-size: 44px;
  line-height: 100%;
}
#main.container .beusable__section .section__content {
  padding-bottom: 24px;
}
#main.container .beusable__section .section__content .review-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 24px;
  padding-right: 16px;
}
#main.container .beusable__section .section__content .review-item__title {
  padding-bottom: 4px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
}
#main.container .beusable__section .section__content .review-item__title .info-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0px;
  color: #FFF;
  font-size: 13px;
  font-weight: 500;
  line-height: 150%;
}
#main.container .beusable__section .section__content .review-item__title .category {
  font-weight: 400;
}
#main.container .beusable__section .section__content .review-item__desc {
  color: #CCC;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%;
}
#main.container .beusable__section .section__content .review-item__desc:lang(ja) {
  word-break: break-all;
  line-break: strict;
}
#main.container .contents-08-22 {
  background: #000000;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .card15 {
  display: flex;
  flex-direction: row;
  gap: 44px;
  row-gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
  flex-shrink: 0;
  width: 2600px;
  position: relative;
}
#main.container .card-body7 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 306px;
  height: 238px;
  position: relative;
}
#main.container .card-footer15 {
  border-radius: 999px;
  border-style: solid;
  border-color: #004585;
  border-width: 1px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .card-footer-text9 {
  color: #2e9bff;
  text-align: left;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .card-content9 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  align-self: stretch;
  flex: 1;
  position: relative;
}
#main.container .card-description20 {
  color: #ffffff;
  text-align: left;
  font-size: 16px;
  line-height: 150%;
  font-weight: 400;
  position: relative;
  width: 288px;
}
#main.container .card-info {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .ellipse-19 {
  background: linear-gradient(to left, #d9d9d9, #d9d9d9);
  border-radius: 50%;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  position: relative;
  object-fit: cover;
}
#main.container .card-description21 {
  color: #cccccc;
  text-align: left;
  font-size: 13px;
  line-height: 150%;
  font-weight: 400;
  position: relative;
  flex: 1;
}
#main.container .card-footer16 {
  border-radius: 999px;
  border-style: solid;
  border-color: #065b62;
  border-width: 1px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .card-footer-text10 {
  color: #2bc0d9;
  text-align: left;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .card-footer17 {
  border-radius: 999px;
  border-style: solid;
  border-color: #444444;
  border-width: 1px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .card-footer-text11 {
  color: #cccccc;
  text-align: left;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .card-footer18 {
  border-radius: 999px;
  border-style: solid;
  border-color: #504407;
  border-width: 1px;
  padding: 10px 12px 10px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 32px;
  position: relative;
}
#main.container .card-footer-text12 {
  color: #faed4c;
  text-align: left;
  font-size: 13px;
  line-height: 100%;
  font-weight: 500;
  position: relative;
}
#main.container .frame-2147236947 {
  padding: 0px 310px 0px 310px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-end;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .frame-2147236938 {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container .bt-en6 {
  background: #333333;
  border-radius: 999px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  position: relative;
}
#main.container .bt-en7 {
  background: #555555;
  border-radius: 999px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  position: relative;
}
#main.container .container102 {
  padding: 80px 310px 80px 310px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .content-container3 {
  display: flex;
  flex-direction: column;
  gap: 36px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .rectangle {
  background: #2f2f2f;
  align-self: stretch;
  flex-shrink: 0;
  height: 1px;
  position: relative;
}
#main.container .top-section {
  display: flex;
  flex-direction: row;
  row-gap: 44px;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  align-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .logo-and-tagline {
  display: flex;
  flex-direction: column;
  gap: 17px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 380px;
  position: relative;
}
#main.container .logo-container {
  flex-shrink: 0;
  width: 104px;
  height: 18px;
  position: static;
}
#main.container .group58 {
  width: 104px;
  height: 18px;
  position: absolute;
  left: 0px;
  top: 0px;
  overflow: visible;
}
#main.container .beusable-logo {
  width: 104px;
  height: 18px;
  position: absolute;
  left: 0px;
  top: 0px;
}
#main.container .we-give-you-tangible {
  color: #999999;
  text-align: left;
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
#main.container .links-section {
  display: flex;
  flex-direction: row;
  gap: 81px;
  align-items: flex-start;
  justify-content: flex-end;
  flex-shrink: 0;
  width: 531px;
  position: relative;
}
#main.container .platform-links {
  display: flex;
  flex-direction: column;
  gap: 22px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 123px;
  position: relative;
}
#main.container .journey-map {
  color: #ec0047;
  text-align: left;
  font-size: 15px;
  line-height: 23px;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .features-pricing {
  color: #b1b1b1;
  text-align: left;
  font-size: 13px;
  line-height: 34px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
#main.container .support-links {
  display: flex;
  flex-direction: column;
  gap: 22px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 123px;
  position: relative;
}
#main.container .ux-heatmap {
  color: #ec0047;
  text-align: left;
  font-size: 15px;
  line-height: 23px;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .features-pricing-copy {
  color: #b1b1b1;
  text-align: left;
  font-size: 13px;
  line-height: 34px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
#main.container .company-links {
  display: flex;
  flex-direction: column;
  gap: 22px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 123px;
  position: relative;
}
#main.container .support {
  color: #ec0047;
  text-align: left;
  font-size: 15px;
  line-height: 23px;
  font-weight: 600;
  position: relative;
  align-self: stretch;
}
#main.container .documenation-faq-con {
  color: #b1b1b1;
  text-align: left;
  font-size: 13px;
  line-height: 34px;
  font-weight: 400;
  position: relative;
  width: 90px;
}
#main.container .rectangle-copy {
  background: #2f2f2f;
  align-self: stretch;
  flex-shrink: 0;
  height: 1px;
  position: relative;
}
#main.container .footer {
  display: flex;
  flex-direction: column;
  gap: 30px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .footer-info {
  display: flex;
  flex-direction: row;
  gap: 228px;
  row-gap: 287px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
#main.container .div {
  color: #999999;
  text-align: left;
  font-size: 13px;
  line-height: 23px;
  font-weight: 400;
  position: relative;
  flex: 1;
}
#main.container .link-group {
  display: flex;
  flex-direction: row;
  gap: 63px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
#main.container ._17 {
  color: #999999;
  text-align: left;
  font-size: 13px;
  line-height: 23px;
  font-weight: 400;
  position: relative;
}
#main.container .copyright-2022-4-gr {
  color: #999999;
  text-align: left;
  font-size: 13px;
  line-height: 21px;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}

@media all and (min-width: 769px) {
  #main.container .swiper {
    overflow: initial;
  }
  #main.container .worry__section .section__content .worry-list-slider {
    margin: 0;
    width: 100%;
  }
  #main.container .worry__section .section__content .worry-list {
    display: flex;
    gap: 20px;
  }
  #main.container .worry__section .section__content .worry-list .worry-item {
    flex: 1 1 33.333%;
    transition: flex 0.3s ease-in-out;
    will-change: flex;
  }
  #main.container .worry__section .section__content .worry-list .worry-item__title, #main.container .worry__section .section__content .worry-list .worry-item__content {
    transition: line-height 0.3s ease-in-out, color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    will-change: color, background-color, line-height;
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover {
    flex-basis: 41%;
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover:before {
    background: none;
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover .worry-item__img {
    filter: grayscale(0%);
    transform: scale(1.1);
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover .worry-item__title {
    color: #FF1553;
    font-size: 72px;
    letter-spacing: -0.72px;
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover .worry-item__content {
    border-radius: 16px;
    background: rgba(255, 21, 83, 0.85);
    backdrop-filter: blur(14px);
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover .worry-item__content .worry-item__quote {
    font-size: 22px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: -0.449px;
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover .worry-item__content .worry-item__desc {
    color: #fff;
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover-last {
    flex-basis: 24%;
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover-last .last-none {
    display: none;
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover-last .worry-item__title {
    font-size: 36px;
    letter-spacing: -0.36px;
  }
  #main.container .worry__section .section__content .worry-list .worry-item.is-hover-last .worry-item__quote {
    font-size: 18px;
  }
  #main.container .solution__section .content-solution__item:hover {
    background: #13A5BF;
  }
  #main.container .solution__section .content-solution__item:hover .card-link {
    visibility: visible;
    opacity: 1;
  }
  #main.container .solution__section .content-solution__item:hover .card-description {
    color: #222;
  }
  #main.container .solution__section .content-solution__item:hover .card-footer2 {
    border: 1px solid rgba(0, 0, 0, 0.12);
  }
  #main.container .solution__section .content-solution__item:hover .card-footer2 .card-footer-text {
    color: #2F2F2F;
  }
  #main.container .solution__section .content-solution__item:hover .card-image {
    transform: translateX(170px);
  }
  #main.container .contents-03-2 {
    flex-shrink: 0;
    display: grid;
    gap: 20px;
    position: relative;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, fit-content(100%));
  }
  #main.container .cards-container {
    padding-top: 8px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, 1fr);
    gap: 20px;
  }
  #main.container .card13 {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
  }
  #main.container .trusted-by {
    flex-shrink: 0;
    display: grid;
    gap: 20px;
    position: relative;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    grid-template-rows: repeat(4, fit-content(100%));
  }
}
@media all and (max-width: 768px) {
  #main.container {
    width: 100%;
    min-width: auto;
  }
  #main.container .value-text__lg {
    font-size: 72px;
  }
  #main.container .value-text__black {
    font-size: 64px;
    font-weight: 700;
    letter-spacing: -1px;
  }
  #main.container .section__content.grid-content {
    padding: 0;
  }
  #main.container .section__title.min-height {
    flex-direction: column;
    padding: 0;
    border: none;
  }
  #main.container .section__title.min-height img {
    display: none;
  }
  #main.container .section__title.min-height .title-wrap {
    gap: 20px;
  }
  #main.container .section__title.min-height .title-wrap .title {
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
    font-size: 40px;
  }
  #main.container .section__title.min-height .title-wrap .label {
    font-size: 24px;
    font-weight: 600;
  }
  #main.container .section__title .title-wrap .title {
    font-size: 36px;
    letter-spacing: 0;
  }
  #main.container .section__title .title-wrap .label {
    font-size: 20px;
    font-weight: 700;
    line-height: 120%;
  }
  #main.container .text-center {
    text-align: center;
  }
  #main.container .text-center .title-wrap {
    align-items: center;
    text-align: center;
  }
  #main.container .text-center .sub-title,
  #main.container .text-center .label,
  #main.container .text-center .title {
    text-align: center;
  }
  #main.container .inner__swiper {
    padding: 0;
    max-width: 1204px;
  }
  #main.container .inner__swiper .section__title {
    padding-inline: 20px;
  }
  #main.container .inner__swiper .swiper {
    padding-inline: 20px;
  }
  #main.container .inner__sm {
    padding-block: 80px 134px;
  }
  #main.container .inner__md {
    padding-block: 135px 134px;
  }
  #main.container .inner__lg {
    padding-block: 135px 134px;
  }
  #main.container .worry__section .section__title {
    padding: 0 20px;
  }
  #main.container .worry__section .section__content .worry-list-slider {
    padding: 0 20px;
    width: 100%;
  }
  #main.container .worry__section .section__content .worry-list .worry-item {
    min-height: 420px;
    height: auto;
    align-self: stretch;
  }
  #main.container .card4 {
    gap: 40px;
  }
  #main.container .container24 {
    aspect-ratio: initial;
    padding: 64px 40px;
    width: 100%;
  }
  #main.container .container36 {
    padding: 64px 40px;
    aspect-ratio: initial;
  }
  #main.container .card-group-box {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
  }
  #main.container .card-group-box .swiper {
    width: 100%;
  }
  #main.container .bt-en {
    border: none;
    background: #EC0047;
  }
  #main.container .bt-en:hover {
    background: #EC0047;
  }
  #main.container .content-solution__item {
    padding: 36px 32px;
    border: 1px solid #444;
    height: 380px;
  }
  #main.container .content-uxheatmap__item {
    padding: 56px 32px 36px 32px;
    min-height: 380px;
    height: auto;
    border-radius: 16px;
    border: 1px solid #444;
    box-shadow: 0 20px 16px -12px rgba(0, 0, 0, 0.12);
  }
  #main.container .content-uxheatmap__item .card-content2 {
    flex-direction: column-reverse;
    justify-content: flex-end;
  }
  #main.container .content-uxheatmap__item .card-content2 ._20254 {
    font-size: 22px;
  }
  #main.container .content-uxheatmap__item .card-content2 i {
    margin-top: auto;
    width: 56px;
    height: 56px;
  }
  #main.container .content-journeymap__item {
    border-radius: 16px;
    border: 1px solid #BBB;
    height: 380px;
    padding: 56px 32px 36px 32px;
    box-shadow: 0 20px 16px -12px rgba(0, 0, 0, 0.12);
  }
  #main.container .content-journeymap__item .card8 {
    flex-direction: column-reverse;
    justify-content: flex-end;
    flex: 1;
  }
  #main.container .content-journeymap__item .card8 ._20255 {
    font-size: 22px;
  }
  #main.container .content-journeymap__item .card8 i {
    margin-top: auto;
    width: 56px;
    height: 56px;
  }
  #main.container .grid-img-caption {
    font-size: 16px;
  }
  #main.container .card-footer {
    align-self: center;
    display: block;
  }
  #main.container .hero-section .inner {
    padding-block: 90px 46px;
    gap: 24px;
  }
  #main.container .hero-section .hero {
    width: 100%;
    top: 10px;
    right: 0;
    bottom: unset;
  }
  #main.container .hero-section .hero img {
    object-fit: contain;
    width: 100%;
  }
  #main.container .hero-section .hero-text-section {
    padding: 0;
    gap: 15px;
  }
  #main.container .hero-section .hero-description-container {
    padding: 0;
    gap: 10px;
    padding-bottom: 62px;
  }
  #main.container .hero-section .hero-description {
    color: #FFF;
    font-size: 20px;
    font-weight: 600;
    line-height: 150%;
  }
  #main.container .hero-section .top-para {
    color: #999;
    font-size: 12px;
    font-weight: 600;
    line-height: 150%;
  }
  #main.container .hero-section .hero-subtitle {
    font-size: 30px;
    font-weight: 800;
    line-height: 100%;
    letter-spacing: -0.185px;
  }
  #main.container .hero-section .stats-container {
    flex-direction: column;
    width: calc(100% - 76px);
    min-width: 260px;
  }
  #main.container .hero-section .stats-container .stats-box {
    width: 100%;
    flex-direction: column;
    align-items: center;
  }
  #main.container .hero-section .stats-container .data-points-divider {
    width: 100%;
    height: 1px;
  }
  #main.container .worry__section .section__title {
    text-align: center;
  }
  #main.container .worry__section .section__content .worry-item:before {
    display: none;
  }
  #main.container .worry__section .section__content .worry-item:last-of-type .worry-item__title {
    font-size: 36px;
    letter-spacing: -0.36px;
  }
  #main.container .worry__section .section__content .worry-item .worry-item__img {
    filter: grayscale(0%);
  }
  #main.container .worry__section .section__content .worry-item .worry-item__title {
    padding: 28px 20px;
    color: #FF1553;
    font-size: 44px;
    letter-spacing: -0.44px;
  }
  #main.container .worry__section .section__content .worry-item .worry-item__content {
    border-radius: 16px;
    background: rgba(255, 21, 83, 0.85);
    backdrop-filter: blur(14px);
    padding: 28px 20px;
    gap: 12px;
    min-height: 214px;
  }
  #main.container .worry__section .section__content .worry-item .worry-item__content .worry-item__quote {
    font-size: 18px;
    font-weight: 700;
  }
  #main.container .worry__section .section__content .worry-item .worry-item__content .worry-item__desc {
    color: #fff;
  }
  #main.container .question__section {
    padding: 0;
  }
  #main.container .question__section .inner {
    padding-bottom: 260px;
  }
  #main.container .question__section .container10 {
    border-radius: 0;
  }
  #main.container .question__section .content-container {
    flex-direction: column;
  }
  #main.container .question__section .content-container .container11 {
    flex: unset;
    height: 420px;
    padding: 36px 32px;
    overflow: hidden;
  }
  #main.container .question__section .content-container ._2025 {
    font-size: 48px;
    line-height: 120%;
  }
  #main.container .question__section .container13 {
    padding: 36px 32px;
    min-height: 420px;
    height: auto;
  }
  #main.container .question__section .container13 .main-container {
    width: 124px;
    height: 79px;
    bottom: -94px;
    right: 61px;
    top: unset;
  }
  #main.container .question__section .container13 .main-container .geo-container {
    position: unset;
    flex-direction: column-reverse;
  }
  #main.container .question__section .container13 .main-container .geo-container .geo-title {
    font-size: 61px;
    letter-spacing: -1.594px;
  }
  #main.container .question__section .container13 .main-container .geo-container .geo-subtitle {
    color: #FFF;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -0.239px;
  }
  #main.container .question__section .container13 .info-container {
    width: 100%;
  }
  #main.container .question__section .container13 .info-container .features-container {
    grid-template-columns: repeat(1, 1fr);
  }
  #main.container .question__section .question__img.seo {
    left: unset;
    right: 0;
  }
  #main.container .question__section .question__img.geo {
    left: unset;
    right: 0;
  }
  #main.container .question__section .question__img.quote {
    right: -20px;
    bottom: -180px;
  }
  #main.container .solution__section .card-title {
    font-size: 14px;
  }
  #main.container .solution__section ._2026 {
    font-size: 26px;
  }
  #main.container .solution__section .card-image {
    width: 100%;
    left: 0;
    bottom: unset;
    top: 255px;
  }
  #main.container .solution__section .card-footer {
    align-self: flex-start;
    display: flex;
    flex-wrap: wrap;
  }
  #main.container .solution__section .content-solution__item {
    min-height: 420px;
    height: auto;
  }
  #main.container .solution__section .content-solution__item .card-link {
    margin-top: auto;
    margin-bottom: -8px;
    opacity: 1;
    visibility: visible;
    z-index: 1;
  }
  #main.container .fit__section .inner {
    padding-top: 60px;
  }
  #main.container .fit__section .contents-04-1 {
    height: auto;
  }
  #main.container .fit__section .frame-9568 {
    text-align: center;
    align-items: center;
  }
  #main.container .fit__section .description {
    text-align: center;
    font-size: 20px;
    font-weight: 600;
  }
  #main.container .fit__section .description2 {
    font-size: 36px;
  }
  #main.container .fit__section .frame-9563 {
    justify-content: center;
  }
  #main.container .fit__section .frame-9563 .menu-item {
    justify-content: center;
    flex: 0 0 148px;
  }
  #main.container .fit__section .frame-9563 .menu-item:lang(en) {
    padding: 0 6px;
  }
  #main.container .heatmap__section .card5 {
    width: 100%;
    gap: 12px;
  }
  #main.container .heatmap__section .card7 {
    flex-direction: column;
    margin-top: 48px;
  }
  #main.container .heatmap__section .container31, #main.container .heatmap__section .container33 {
    padding: 36px 32px;
    height: 310px;
  }
  #main.container .heatmap__section ._20263, #main.container .heatmap__section ._20264 {
    font-size: 26px;
  }
  #main.container .heatmap__section .container27 {
    width: 100%;
    padding: 36px 32px;
  }
  #main.container .journeymap__section .container37, #main.container .journeymap__section .container41 {
    width: calc(100% - 40px);
    margin: 0 auto;
  }
  #main.container .journeymap__section .container41 {
    margin-top: 40px;
    align-items: center;
    padding: 48px 40px 48px 40px;
    height: initial;
  }
  #main.container .journeymap__section .card-title7 {
    text-align: center;
  }
  #main.container .journeymap__section ._20266 {
    text-align: center;
    font-size: 26px;
  }
  #main.container .bi__section .container45 {
    padding: 36px 32px;
  }
  #main.container .bi__section .card4 {
    gap: 12px;
  }
  #main.container .bi__section .container47 {
    margin: 40px 0 28px;
    align-items: center;
    padding: 48px 40px 48px 40px;
    height: initial;
    width: 100%;
  }
  #main.container .geo__section .container52 {
    padding: 36px 32px;
  }
  #main.container .geo__section .card4 {
    gap: 12px;
  }
  #main.container .geo__section .container55 {
    padding: 64px 0;
    aspect-ratio: initial;
  }
  #main.container .geo__section .container66 {
    margin: 40px 0 28px;
    padding: 48px 40px 48px 40px;
    height: initial;
    width: 100%;
  }
  #main.container .geo__section .container66 .card-title8, #main.container .geo__section .container66 ._20266, #main.container .geo__section .container66 .card-description6 {
    text-align: center;
  }
  #main.container .geo__section .container66 .card-body2 {
    width: 100%;
  }
  #main.container .actionable__section .card4 {
    gap: 12px;
  }
  #main.container .actionable__section .container75 {
    margin: 40px 0 28px;
    align-items: center;
    padding: 48px 40px 48px 40px;
    height: initial;
    width: 100%;
  }
  #main.container .cxdata__section .card4 {
    gap: 12px;
  }
  #main.container .cxdata__section .container76 {
    margin: 40px 0 28px;
    align-items: center;
    padding: 48px 40px 48px 40px;
    height: initial;
    width: 100%;
  }
  #main.container .difference__section .inner {
    padding-block: 135px 134px;
  }
  #main.container .difference__section .section__title .title-wrap .sub-title strong {
    font-size: 18px;
    font-weight: 500;
  }
  #main.container .difference__section .contents-05-2 {
    padding-top: 12px;
    gap: 40px;
  }
  #main.container .difference__section .heading-text6 {
    font-size: 30px;
    letter-spacing: 0;
  }
  #main.container .difference__section .list-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  #main.container .difference__section .list-content .list-item {
    border-radius: 16px;
    padding: 0 16px;
  }
  #main.container .difference__section .list-content .list-item.a-analytics {
    background: #222;
  }
  #main.container .difference__section .list-content .list-item.b-analytics {
    background: #363636;
  }
  #main.container .difference__section .list-content .list-item.beusable {
    background: #D7D7D7;
  }
  #main.container .difference__section .list-content .list-item.beusable .title {
    color: #EC0047;
    font-size: 24px;
    font-weight: 700;
  }
  #main.container .difference__section .list-content .list-item.beusable .desc {
    color: #222;
    font-weight: 600;
  }
  #main.container .difference__section .list-content .list-item .title {
    padding: 40px 0 12px;
    color: #CCC;
    font-size: 16px;
    font-weight: 600;
    line-height: 100%;
    border-bottom: 1px solid #666;
  }
  #main.container .difference__section .list-content .list-item .desc {
    display: flex;
    flex-direction: column;
    color: #BBB;
    font-size: 15px;
    font-weight: 500;
    line-height: 150%;
    padding: 16px 0;
    border-bottom: 1px solid #444;
  }
  #main.container .difference__section .list-content .list-item .desc:last-child {
    border-bottom: none;
  }
  #main.container .signal__section {
    padding: 0;
  }
  #main.container .signal__section .background-image {
    border-radius: 0;
  }
  #main.container .signal__section .inner {
    padding-bottom: 20px;
  }
  #main.container .signal__section .container83 {
    padding: 32px;
    min-height: 380px;
    height: auto;
  }
  #main.container .signal__section ._20257 {
    font-size: 26px;
  }
  #main.container .signal__section .card-description8 {
    font-size: 18px;
  }
  #main.container .signal__section .card-description9 {
    font-size: 14px;
  }
  #main.container .signal__section .card-description10, #main.container .signal__section .card-description11 {
    font-size: 16px;
  }
  #main.container .data__section {
    height: auto;
  }
  #main.container .data__section .ai-section {
    padding-block: 135px 134px;
  }
  #main.container .data__section .heading-text9 {
    font-size: 26px;
    letter-spacing: 0;
  }
  #main.container .data__section .container84 {
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }
  #main.container .data__section .container84 .text-box {
    padding: 10px;
    gap: 10px;
  }
  #main.container .data__section .container84 .heading-text10 {
    letter-spacing: 0;
    font-size: 36px;
    line-height: 100%;
  }
  #main.container .data__section .container84 .heading-text11 {
    font-size: 68px;
    letter-spacing: 0;
    line-height: 100%;
  }
  #main.container .synergy__section .contents-08-1-wrap {
    height: auto;
  }
  #main.container .synergy__section .contents-08-1-wrap .inner {
    padding-block: 120px 0;
  }
  #main.container .synergy__section .contents-08-2 {
    gap: 80px;
    padding-block: 80px 134px;
  }
  #main.container .synergy__section .section__title .title-wrap .label {
    font-size: 26px;
  }
  #main.container .synergy__section .container85 {
    flex: none;
    min-height: 251px;
  }
  #main.container .synergy__section ._202612 {
    font-size: 26px;
  }
  #main.container .synergy__section .deto-text {
    gap: 24px;
  }
  #main.container .synergy__section .deto-text .heatmaps-bi-seo-ai-are-you-lost-among-fragme15 {
    text-align: center;
  }
  #main.container .synergy__section .deto-text .heading-text12 {
    text-align: center;
    letter-spacing: 0;
    font-size: 30px;
  }
  #main.container .tech__section .inner {
    padding-block: 120px 134px;
  }
  #main.container .tech__section .section__title .title-wrap {
    text-align: center;
  }
  #main.container .tech__section .section__content {
    display: flex;
    flex-direction: column;
    gap: 60px;
  }
  #main.container .tech__section .container25 {
    font-size: 44px;
    line-height: 120%;
  }
  #main.container .tech__section .container25 .unit {
    font-size: 24px;
    font-weight: 600;
    line-height: 100%;
  }
  #main.container .tech__section .card-title10 {
    font-size: 20px;
  }
  #main.container .tech__section .container89 {
    padding: 36px 32px 48px 32px;
  }
  #main.container .tech__section .container89 ._202614 {
    text-align: center;
    font-size: 26px;
  }
  #main.container .tech__section .container89 .card-description18 {
    text-align: center;
  }
  #main.container .tech__section .container89 .card-title11 {
    text-align: center;
  }
  #main.container .why__section {
    padding: 0;
  }
  #main.container .why__section .container-10-1 {
    border-radius: 0;
  }
  #main.container .why__section .inner {
    padding-block: 120px;
  }
  #main.container .why__section .section__content {
    padding-top: 24px;
  }
  #main.container .why__section .swiper-slide {
    padding: 36px 32px 48px 32px;
    min-height: 380px;
  }
  #main.container .why__section .swiper-slide ._202616 {
    font-size: 26px;
    line-height: 120%;
  }
  #main.container .why__section .swiper-slide .feature-text4 {
    font-size: 13px;
    font-weight: 600;
  }
  #main.container .industry__section .inner {
    padding-block: 135px 134px;
  }
  #main.container .industry__section .section__content {
    grid-template-columns: repeat(2, 1fr);
  }
  #main.container .industry__section .container97 {
    padding: 32px 20px 24px 20px;
    height: 260px;
    align-items: center;
  }
  #main.container .industry__section .container97 i {
    width: 48px;
    height: 48px;
  }
  #main.container .industry__section .container97 .card-statistic {
    justify-content: center;
  }
  #main.container .industry__section .container97 ._202618 {
    text-align: center;
    font-size: 20px;
    line-height: 120%;
  }
  #main.container .industry__section .container97 .card-title12 {
    font-size: 16px;
    text-align: center;
  }
  #main.container .industry__section .container97 .card-description17 {
    text-align: center;
  }
  #main.container .marquee__section .marquee {
    background: transparent;
  }
  #main.container .marquee__section .marquee__list {
    animation: initial;
    flex-wrap: wrap;
    gap: 14px;
    width: initial;
  }
  #main.container .marquee__section .marquee__list .item {
    flex: 1 1 180px;
  }
  #main.container .beusable__section .inner {
    padding-block: 100px 28px;
  }
  #main.container .beusable__section .section__content {
    padding-block: 24px;
  }
  #main.container .beusable__section .section__content .review-list {
    gap: 0;
  }
  #main.container .beusable__section .section__title .title-wrap {
    padding-block: 0 24px;
  }
  #main.container .beusable__section .section__title .title-wrap .title {
    font-size: 36px;
    line-height: 120%;
  }
}
@media all and (max-width: 394px) {
  #main.container .marquee__section .marquee__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}
#why.container {
  width: 100%;
  min-width: 1280px;
}
#why.container .why__top {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding-top: 81px;
  padding-bottom: 480px;
  background-color: #eff2d6;
}
#why.container .why__top__title {
  width: 668px;
  min-height: 91px;
}
#why.container .why__top__sub {
  margin-top: 60px;
  font-size: 67px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.15;
  letter-spacing: -1.86px;
  text-align: center;
  color: #2f2f2f;
}
#why.container .why__top__desc {
  margin-top: 23px;
  font-size: 26px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.54;
  text-align: center;
  color: #222;
}
#why.container .why__top__frame {
  margin-top: 28px;
  width: 1093px;
  position: relative;
}
#why.container .why__top__img {
  position: absolute;
  width: 1093px;
}
#why.container .why__pros {
  display: grid;
  grid-template-columns: 460px 700px;
  justify-content: center;
  column-gap: 10px;
  width: 100%;
  padding-top: 380px;
  padding-bottom: 275px;
}
#why.container .why__pros__image {
  width: 100%;
}
#why.container .why__pros__list {
  display: flex;
  flex-direction: column;
  row-gap: 68px;
}
#why.container .why__pros__list .item {
  display: grid;
  grid-template-columns: 41px auto;
  column-gap: 47px;
}
#why.container .why__pros__list .item__number {
  font-family: NewRubrik;
  font-size: 70px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -2.03px;
  text-align: center;
  color: #222;
}
#why.container .why__pros__list .item__contents {
  font-size: 24px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.46;
  letter-spacing: -0.67px;
  color: #222;
}
#why.container .why__data {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 170px;
}
#why.container .why__data__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 20px;
}
#why.container .why__data__title__top {
  font-size: 55px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  text-align: center;
  color: #2f2f2f;
}
#why.container .why__data__title__top.en {
  letter-spacing: -1px;
}
#why.container .why__data__title__mid {
  font-family: NewRubrik;
  font-size: 100px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -2.9px;
  text-align: center;
  color: #ec0047;
}
#why.container .why__data__title__mid.ja {
  font-family: initial;
}
#why.container .why__data__title__bot {
  font-size: 55px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  text-align: center;
  color: #2f2f2f;
}
#why.container .why__data__title__bot.en {
  letter-spacing: -1px;
}
#why.container .why__rsn {
  width: 100%;
  overflow: hidden;
}
#why.container .why__rsn__panel {
  min-width: 1920px;
  width: 100%;
}
#why.container .why__rsn__edu {
  position: relative;
  display: grid;
  grid-template-columns: 157px 600px;
  align-items: center;
  justify-content: center;
  column-gap: 40px;
  margin-top: 90px;
}
#why.container .why__rsn__edu__frame {
  position: relative;
}
#why.container .why__rsn__edu__book {
  position: absolute;
  width: 295px;
  top: -271px;
  left: -371px;
}
#why.container .why__rsn__edu__image {
  width: 100%;
}
#why.container .why__rsn__edu__title {
  position: relative;
  font-size: 67px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.18;
  color: #2f2f2f;
}
#why.container .why__rsn__edu__title.en {
  letter-spacing: -1.86px;
}
#why.container .why__rsn__edu__box-1 {
  display: flex;
  flex-direction: column;
  row-gap: 15px;
  margin-top: 104px;
}
#why.container .why__rsn__edu__box-1 h3 {
  font-size: 52px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.25;
  color: #2f2f2f;
}
#why.container .why__rsn__edu__box-1 h3.en {
  letter-spacing: -1.5px;
}
#why.container .why__rsn__edu__box-1 h3.ja {
  letter-spacing: -0.5px;
}
#why.container .why__rsn__edu__box-1 p {
  font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.62;
  color: #2f2f2f;
}
#why.container .why__rsn__edu__box-2 {
  display: flex;
  column-gap: 30px;
  margin-top: 75px;
}
#why.container .why__rsn__edu__box-2 .item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 20px;
  width: 270px;
}
#why.container .why__rsn__edu__box-2 .item__title {
  font-size: 30px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.17;
  letter-spacing: -0.83px;
  color: #ec0047;
}
#why.container .why__rsn__edu__box-2 .item__desc {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  color: #444;
}
#why.container .why__rsn__edu__box-2 .item__btn {
  padding: 10px 20px;
  border-radius: 20px;
  border: solid 1px #ec0047;
  background-color: #fff;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  text-align: center;
  color: #ec0047;
}
#why.container .why__rsn__edu__box-2 .item__btn:hover {
  filter: brightness(0.94);
}
#why.container .why__forum {
  position: relative;
  bottom: -15px;
  display: grid;
  justify-content: center;
  grid-template-columns: 675px 438px;
  column-gap: 57px;
  margin-top: 120px;
}
#why.container .why__forum__image {
  width: 100%;
  min-height: 525px;
}
#why.container .why__forum__frame {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  align-items: flex-start;
}
#why.container .why__forum__title {
  font-size: 52px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.25;
  color: #2f2f2f;
}
#why.container .why__forum__title.en {
  letter-spacing: -1.5px;
}
#why.container .why__forum__desc {
  font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.62;
  color: #222;
}
#why.container .why__forum__btn {
  padding: 10px 20px;
  border-radius: 20px;
  border: solid 1px #ec0047;
  background-color: #fff;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  text-align: center;
  color: #ec0047;
}
#why.container .why__forum__btn:hover {
  filter: brightness(0.94);
}
#why.container .why__global {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 87px;
  width: 100%;
  padding-top: 140px;
  padding-bottom: 110px;
  background-color: #16243d;
}
#why.container .why__global__title {
  width: 1170px;
  font-size: 52px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.25;
  letter-spacing: -1.51px;
  color: #fff;
}
#why.container .why__global__box {
  display: grid;
  grid-template-columns: 330px 840px;
  justify-content: center;
}
#why.container .why__global__box__image {
  width: 100%;
}
#why.container .why__global__box__list {
  display: flex;
  flex-direction: column;
  row-gap: 67px;
}
#why.container .why__global__box__list .item {
  display: flex;
  flex-direction: column;
  row-gap: 17px;
}
#why.container .why__global__box__list .item__title {
  font-size: 30px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.27;
  letter-spacing: -0.83px;
  color: #ec0047;
}
#why.container .why__global__box__list .item__desc {
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.8;
  color: #f0f0f0;
}
#why.container .why__global__ref {
  padding: 21px 31px;
  border-radius: 32px;
  background-color: #fff;
}
#why.container .why__global__ref:hover {
  filter: brightness(0.84);
}
#why.container .why__global__ref span {
  font-size: 22px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  color: #ec0047;
}
#why.container .why__plan {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 50px;
  box-sizing: border-box;
  width: 100%;
  padding-top: 195px;
}
#why.container .why__plan__title {
  font-size: 52px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.25;
  text-align: center;
  color: #2f2f2f;
}
#why.container .why__plan__title .highlight {
  position: relative;
}
#why.container .why__plan__title .highlight .underline {
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 100%;
}
#why.container .why__plan__title.en {
  letter-spacing: -1.5px;
}
#why.container .why__plan__nav {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 30px;
  width: 1170px;
}
#why.container .why__plan__nav .tab {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
  padding: 25px;
  border: solid 3px #fff;
  margin: -3px;
  border-radius: 7px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.14), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  cursor: pointer;
  transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#why.container .why__plan__nav .tab:hover {
  box-shadow: 0 22px 33px -7px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.1);
}
#why.container .why__plan__nav .tab.on {
  border: solid 3px #ec0047;
  box-shadow: 0 22px 33px -7px rgba(0, 0, 0, 0.15);
  margin: -3px;
}
#why.container .why__plan__nav .tab.on::after {
  content: "";
  position: absolute;
  bottom: -34px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/why/tab-select.svg") no-repeat center center;
}
#why.container .why__plan__nav .tab__title {
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  color: #2f2f2f;
  margin-bottom: 40px;
}
#why.container .why__plan__nav .tab__desc {
  font-size: 14px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.64;
  color: #444;
}
#why.container .why__plan__nav .tab__image {
  position: absolute;
  width: 60px;
  height: 60px;
  right: 10px;
  bottom: 28px;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
#why.container .why__plan__contents {
  display: flex;
  flex-direction: column;
  row-gap: 50px;
  box-sizing: border-box;
  padding: 35px;
  padding-bottom: 60px;
  width: 1170px;
  border-radius: 7px;
  box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.1), 0 0 1px 0 rgba(0, 0, 0, 0.35);
  background-color: #fff;
}
#why.container .why__plan__contents.fadein {
  animation: fadeIn 0.5s cubic-bezier(0, 0, 0.2, 1);
  animation-fill-mode: forwards;
}
#why.container .why__plan__contents__title {
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.59;
  letter-spacing: -0.61px;
  color: #222;
}
#why.container .why__plan__contents .division {
  margin: 0px 35px;
  height: 1px;
  background-color: rgba(0, 0, 0, 0.1);
}
#why.container .why__plan__contents .item {
  display: flex;
  flex-direction: column;
  row-gap: 34px;
  position: relative;
  padding-left: 35px;
  box-sizing: border-box;
  width: 100%;
}
#why.container .why__plan__contents .item__title {
  display: flex;
  align-items: center;
  column-gap: 15px;
}
#why.container .why__plan__contents .item__title h3 {
  font-size: 35px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.97px;
  color: #222;
}
#why.container .why__plan__contents .item__title h3.en {
  letter-spacing: -0.8px;
}
#why.container .why__plan__contents .item__title .label {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #fff;
  background-color: #7e36e0;
}
#why.container .why__plan__contents .item__title .label.everyone {
  background-color: #1199ae;
}
#why.container .why__plan__contents .item__title .label.pro {
  background-color: #7e36e0;
}
#why.container .why__plan__contents .item__title .label.starter {
  background-color: #8aa0ba;
}
#why.container .why__plan__contents .item__title .label.agency {
  background-color: #eaab40;
}
#why.container .why__plan__contents .item__title .label.enterprise {
  background-color: #294379;
}
#why.container .why__plan__contents .item ul {
  display: flex;
  flex-direction: column;
  row-gap: 15px;
}
#why.container .why__plan__contents .item ul li {
  display: flex;
  align-items: flex-start;
  column-gap: 10px;
  padding-right: 250px;
}
#why.container .why__plan__contents .item ul li span {
  font-size: 20px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.4;
  color: #444;
}
#why.container .why__plan__contents .item__btn {
  position: absolute;
  right: 35px;
  top: 50%;
  transform: translateY(-50%);
  padding: 16px 40px;
  border-radius: 25px;
  background-color: #ec0047;
  font-size: 18px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  color: #fff;
}
#why.container .why__plan__contents .item__btn:hover {
  filter: brightness(0.84);
}

@media all and (max-width: 768px) {
  #why.container {
    width: 100%;
    min-width: auto;
  }
  #why.container .why__top {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-top: 15px;
    padding-bottom: 200px;
    background-color: #eff2d6;
  }
  #why.container .why__top__title {
    min-height: 41px;
    width: 300px;
  }
  #why.container .why__top__sub {
    margin-top: 20px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: -0.54px;
    text-align: center;
    color: #333;
  }
  #why.container .why__top__desc {
    margin-top: 40px;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    text-align: center;
    color: #333;
  }
  #why.container .why__top__frame {
    margin-top: 28px;
    width: 100%;
    position: relative;
  }
  #why.container .why__top__img {
    position: absolute;
    width: 100%;
  }
  #why.container .why__pros {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 40px;
    grid-template-columns: 460px 700px;
    justify-content: center;
    column-gap: 10px;
    width: 100%;
    padding-top: 110px;
    padding-bottom: 90px;
  }
  #why.container .why__pros__image {
    width: calc(100% - 34px);
  }
  #why.container .why__pros__list {
    display: flex;
    flex-direction: column;
    row-gap: 30px;
  }
  #why.container .why__pros__list .item {
    display: grid;
    grid-template-columns: 30px 270px;
    justify-content: center;
    column-gap: 25px;
  }
  #why.container .why__pros__list .item__number {
    font-family: NewRubrik;
    font-size: 45px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: -1.3px;
    text-align: center;
    color: #222;
  }
  #why.container .why__pros__list .item__contents {
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    color: #333;
  }
  #why.container .why__data {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 90px;
  }
  #why.container .why__data__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 12px;
  }
  #why.container .why__data__title__top {
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: -0.54px;
    text-align: center;
    color: #333;
  }
  #why.container .why__data__title__mid {
    font-family: NewRubrik;
    font-size: 40px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: -1.16px;
    text-align: center;
    color: #ec0047;
  }
  #why.container .why__data__title__bot {
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: -0.54px;
    text-align: center;
    color: #333;
  }
  #why.container .why__rsn {
    width: 100%;
    overflow: hidden;
  }
  #why.container .why__rsn__panel {
    min-width: auto;
    width: 100%;
  }
  #why.container .why__rsn__edu {
    position: relative;
    display: grid;
    grid-template-columns: 0px 100%;
    align-items: center;
    justify-content: center;
    column-gap: 0px;
    margin-top: 25px;
  }
  #why.container .why__rsn__edu__frame {
    position: relative;
  }
  #why.container .why__rsn__edu__book {
    position: absolute;
    width: 121px;
    top: -62px;
    left: -143px;
  }
  #why.container .why__rsn__edu__image {
    width: 100%;
  }
  #why.container .why__rsn__edu__title {
    margin-left: 50%;
    margin-right: 30px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: -0.54px;
    color: #333;
  }
  #why.container .why__rsn__edu__box-1 {
    display: flex;
    flex-direction: column;
    row-gap: 15px;
    margin-top: 70px;
  }
  #why.container .why__rsn__edu__box-1 h3 {
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    text-align: center;
    color: #2f2f2f;
  }
  #why.container .why__rsn__edu__box-1 p {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    text-align: center;
    color: #444;
  }
  #why.container .why__rsn__edu__box-2 {
    display: flex;
    flex-direction: column;
    row-gap: 70px;
    align-items: center;
    margin-top: 75px;
  }
  #why.container .why__rsn__edu__box-2 .item {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 20px;
    width: 270px;
  }
  #why.container .why__rsn__edu__box-2 .item__title {
    font-size: 30px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.17;
    letter-spacing: -0.83px;
    color: #ec0047;
    text-align: center;
  }
  #why.container .why__rsn__edu__box-2 .item__desc {
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.8;
    color: #444;
    text-align: center;
  }
  #why.container .why__rsn__edu__box-2 .item__btn {
    padding: 10px 20px;
    border-radius: 20px;
    border: solid 1px #ec0047;
    background-color: #fff;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    text-align: center;
    color: #ec0047;
  }
  #why.container .why__forum {
    width: 100%;
    position: relative;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    row-gap: 26px;
    box-sizing: border-box;
    margin-top: 80px;
    padding: 0px 26px 60px;
  }
  #why.container .why__forum__image {
    width: 100%;
    min-height: 200px;
  }
  #why.container .why__forum__frame {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    align-items: center;
  }
  #why.container .why__forum__title {
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: -0.54px;
    text-align: center;
    color: #333;
  }
  #why.container .why__forum__desc {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    text-align: center;
    color: #444;
  }
  #why.container .why__forum__btn {
    padding: 10px 20px;
    border-radius: 20px;
    border: solid 1px #ec0047;
    background-color: #fff;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    text-align: center;
    color: #ec0047;
  }
  #why.container .why__global {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 60px;
    width: 100%;
    padding-top: 60px;
    padding-bottom: 60px;
    background-color: #16243d;
  }
  #why.container .why__global__title {
    box-sizing: border-box;
    width: 100%;
    padding: 0px 20px;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    text-align: center;
    color: #fff;
  }
  #why.container .why__global__box {
    display: grid;
    grid-template-columns: 100%;
    column-gap: 40px;
    justify-content: center;
    align-items: center;
    row-gap: 40px;
  }
  #why.container .why__global__box__image {
    order: -1;
    width: 100%;
  }
  #why.container .why__global__box__list {
    display: flex;
    flex-direction: column;
    row-gap: 67px;
  }
  #why.container .why__global__box__list .item {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
    padding: 0px 20px;
  }
  #why.container .why__global__box__list .item__title {
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    text-align: center;
    color: #ec0047;
  }
  #why.container .why__global__box__list .item__desc {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    text-align: center;
    color: #e9e9e9;
  }
  #why.container .why__global__ref {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    max-height: 43px;
    padding: 12px 24px;
    border-radius: 22px;
    background-color: #fff;
  }
  #why.container .why__global__ref span {
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 14px;
    vertical-align: middle;
    color: #dc0142;
  }
  #why.container .why__plan {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 50px;
    box-sizing: border-box;
    width: 100%;
    padding-top: 195px;
  }
  #why.container .why__plan__title {
    font-size: 52px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    text-align: center;
    color: #2f2f2f;
  }
  #why.container .why__plan__nav {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 30px;
    width: 1170px;
  }
  #why.container .why__plan__nav .tab {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    height: 190px;
    padding: 25px;
    border: solid 3px #fff;
    margin: -3px;
    border-radius: 7px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.14), 0 0 0 1px rgba(0, 0, 0, 0.08);
    background-color: #fff;
    cursor: pointer;
  }
  #why.container .why__plan__nav .tab.on {
    border: solid 3px #ec0047;
    margin: -3px;
  }
  #why.container .why__plan__nav .tab.on::after {
    content: "";
    position: absolute;
    bottom: -34px;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 20px;
    background: url("https://dream-cdn.beusable.net/home/images/why/tab-select.svg") no-repeat center center;
  }
  #why.container .why__plan__nav .tab__title {
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    color: #2f2f2f;
  }
  #why.container .why__plan__nav .tab__desc {
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.64;
    color: #444;
  }
  #why.container .why__plan__nav .tab__image {
    position: absolute;
    width: 60px;
    height: 60px;
    right: 20px;
    bottom: 28px;
  }
  #why.container .why__plan__contents {
    display: flex;
    flex-direction: column;
    row-gap: 50px;
    box-sizing: border-box;
    padding: 35px;
    padding-bottom: 60px;
    width: 1170px;
    border-radius: 7px;
    box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.1), 0 0 1px 0 rgba(0, 0, 0, 0.35);
    background-color: #fff;
  }
  #why.container .why__plan__contents__title {
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.59;
    letter-spacing: -0.61px;
    color: #222;
  }
  #why.container .why__plan__contents .division {
    margin: 0px 35px;
    height: 1px;
    background-color: rgba(0, 0, 0, 0.1);
  }
  #why.container .why__plan__contents .item {
    display: flex;
    flex-direction: column;
    row-gap: 34px;
    position: relative;
    padding-left: 35px;
    box-sizing: border-box;
    width: 100%;
  }
  #why.container .why__plan__contents .item__title {
    display: flex;
    align-items: center;
    column-gap: 15px;
  }
  #why.container .why__plan__contents .item__title h3 {
    font-size: 35px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: -0.97px;
    color: #222;
  }
  #why.container .why__plan__contents .item__title .label {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 15px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #fff;
    background-color: #7e36e0;
  }
  #why.container .why__plan__contents .item__title .label.everyone {
    background-color: #1199ae;
  }
  #why.container .why__plan__contents .item__title .label.pro {
    background-color: #7e36e0;
  }
  #why.container .why__plan__contents .item__title .label.starter {
    background-color: #8aa0ba;
  }
  #why.container .why__plan__contents .item__title .label.agency {
    background-color: #eaab40;
  }
  #why.container .why__plan__contents .item__title .label.enterprise {
    background-color: #294379;
  }
  #why.container .why__plan__contents .item ul {
    display: flex;
    flex-direction: column;
    row-gap: 15px;
  }
  #why.container .why__plan__contents .item ul li {
    display: flex;
    align-items: flex-start;
    column-gap: 10px;
  }
  #why.container .why__plan__contents .item ul li span {
    font-size: 20px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    color: #444;
  }
  #why.container .why__plan__contents .item__btn {
    position: absolute;
    right: 35px;
    top: 50%;
    transform: translateY(-50%);
    padding: 14px 40px;
    border-radius: 25px;
    background-color: #ec0047;
    font-size: 18px;
    font-weight: 800;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    color: #fff;
  }
  #why.container .why__plan--mobile .why__plan__title {
    width: 100%;
    padding: 45px 0px;
    background-color: #eee;
    font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: -0.54px;
    text-align: center;
    color: #333;
  }
  #why.container .why__plan--mobile .why__plan__list .item {
    position: relative;
    border-top: 1px solid #64708f;
    padding: 25px 16px;
  }
  #why.container .why__plan--mobile .why__plan__list .item__title {
    font-size: 19px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 26px;
    color: #333;
    padding-right: 20px;
    cursor: pointer;
  }
  #why.container .why__plan--mobile .why__plan__list .item__desc {
    margin-top: 12px;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.83;
    color: #4d4d4d;
  }
  #why.container .why__plan--mobile .why__plan__list .item__arrow {
    position: absolute;
    right: 16px;
    top: 25px;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    cursor: pointer;
  }
  #why.container .why__plan--mobile .why__plan__list .item__arrow.show {
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide {
    max-height: 0px;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide.show {
    max-height: 1000px;
    padding-bottom: 10px;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box {
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    width: calc(100% - 4px);
    padding: 20px;
    margin-top: 20px;
    margin-left: 2px;
    margin-bottom: 20px;
    border-radius: 14px;
    box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
    background-color: #fff;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__title {
    display: flex;
    column-gap: 11px;
    align-items: center;
    width: 100%;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__title img {
    width: 49px;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__title span {
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 0.85;
    color: #333;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__title .label {
    display: flex;
    align-items: center;
    padding: 3px 6px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 12px;
    letter-spacing: normal;
    color: #fff;
    background-color: #7e36e0;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__title .label.everyone {
    background-color: #1199ae;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__title .label.pro {
    background-color: #7e36e0;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__title .label.starter {
    background-color: #8aa0ba;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__title .label.agency {
    background-color: #eaab40;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__title .label.enterprise {
    background-color: #294379;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__division {
    width: 100%;
    height: 1px;
    margin: 21px 0px 25px;
    background-color: #e1e1e1;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__list {
    width: 100%;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__list li {
    width: 100%;
    display: flex;
    align-items: flex-start;
    column-gap: 6px;
    margin-bottom: 20px;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__list li img {
    width: 15px;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__list li span {
    font-size: 12px;
    line-height: 19px;
    color: #444;
  }
  #why.container .why__plan--mobile .why__plan__list .item__hide .box__btn {
    padding: 13px 34px;
    border-radius: 22px;
    background-color: #ec0047;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    color: #fff;
  }
}
.ui-input {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 5px;
  width: 100%;
}
.ui-input label {
  margin-left: 5px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #767676;
}
.ui-input input {
  height: 38px;
  padding: 10px 35px 10px 12px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 14px;
  letter-spacing: normal;
  color: #000;
  font-family: system-ui;
}
.ui-input input::placeholder {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 14px;
  letter-spacing: normal;
  color: #bbb;
  font-family: system-ui;
}
.ui-input input:focus {
  border: solid 1px #289eef;
  outline: 0px;
}
.ui-input input[disabled] {
  background-color: #d7d7d7;
  opacity: 0.3;
}
.ui-input input.error-line {
  border: solid 1px #ec0047;
}
.ui-input input::-ms-reveal, .ui-input input::-ms-clear {
  display: none !important;
  visibility: hidden;
  opacity: 0;
}
.ui-input input:focus::-webkit-textfield-decoration-container {
  visibility: hidden;
}
.ui-input .eye {
  position: absolute;
  top: 48%;
  right: 10px;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background: url("https://dream-cdn.beusable.net/home/images/icon-eye-off.svg") no-repeat center center;
}
.ui-input .eye.on {
  background: url("https://dream-cdn.beusable.net/home/images/icon-eye-on.svg") no-repeat center center;
}
.ui-input .error {
  display: none;
  position: absolute;
  left: 4px;
  bottom: -20px;
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #e60724;
}
.ui-input .close {
  display: none;
  position: absolute;
  bottom: 12px;
  right: 12px;
  width: 14px;
  height: 14px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-input-close.svg") no-repeat center center;
  cursor: pointer;
}
.ui-input .close.on {
  display: block;
}

.ui-select {
  display: flex;
  flex-direction: column;
  row-gap: 5px;
}
.ui-select label {
  margin-left: 5px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #767676;
}
.ui-select .select {
  position: relative;
  box-sizing: border-box;
  height: 38px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 97% center;
  cursor: pointer;
}
.ui-select .select--show {
  padding: 12px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
}
.ui-select .select--hide {
  position: absolute;
  top: -1px;
  left: -1px;
  display: none;
  width: 100%;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  z-index: 1;
  overflow: hidden;
}
.ui-select .select--hide .item {
  padding: 12px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
  cursor: pointer;
}
.ui-select .select--hide .item:hover {
  background-color: #ebebeb;
}
.ui-select .description {
  position: relative;
  left: 4px;
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #767676;
}

.ui-checkbox {
  position: relative;
  display: flex;
  align-items: center;
  column-gap: 8px;
  transform: translateY(0.5px);
  font-size: 13px;
  letter-spacing: -0.5px;
  color: #666;
}
.ui-checkbox .box {
  position: relative;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  min-width: 18px;
  min-height: 18px;
}
.ui-checkbox .box::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 18px;
  height: 18px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-input-box.svg") transparent no-repeat center center;
  background-size: 18px 18px;
}
.ui-checkbox .box:checked::before {
  background: url("https://dream-cdn.beusable.net/home/images/icon-checkbox-red.svg") transparent no-repeat center center;
}
.ui-checkbox a {
  color: #666;
  text-decoration: underline;
}

html.no-scroll {
  overflow: hidden !important;
  touch-action: none;
}
html.no-scroll body {
  overflow: hidden !important;
  touch-action: none;
}
html.no-scroll body > * {
  overflow: hidden !important;
  touch-action: none;
}

.template-pricing-get_suggest + #footer {
  margin-top: 0;
}
.template-pricing-get_suggest {
  background-color: #eeedec;
  text-align: center;
  padding: 150px 0 128px;
  margin-top: 135px;
  min-width: 1280px;
  box-sizing: border-box;
}
.template-pricing-get_suggest .get_suggest-tit {
  font-size: 40px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.3;
  letter-spacing: -1.25px;
  text-align: center;
  color: #222;
  margin-bottom: 20px;
}
.template-pricing-get_suggest .get_suggest-desc {
  font-size: 24px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.67;
  letter-spacing: -0.63px;
  text-align: center;
  color: #222;
  margin-bottom: 50px;
}
.template-pricing-get_suggest .get_suggest-btn {
  margin-top: 55px;
}
.template-pricing-get_suggest .get_suggest-btn a {
  display: inline-block;
  padding: 19px 28px;
  border-radius: 34px;
  box-shadow: 0 20px 18px -16px rgba(0, 0, 0, 0.25);
  border: solid 3px #ec0047;
  background-color: #fff;
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.5px;
  color: #ec0047;
}
.template-pricing-get_suggest .get_suggest-btn a:hover {
  filter: brightness(0.94);
}

#template-pricing-suggest + #footer {
  margin-top: 0;
}
#template-pricing-suggest {
  min-width: 1280px;
}
#template-pricing-suggest button {
  background: inherit;
  border: none;
  box-shadow: none;
  border-radius: 0;
  padding: 0;
  overflow: visible;
  cursor: pointer;
}
#template-pricing-suggest .contents {
  position: relative;
}
#template-pricing-suggest .contents .contents_btn {
  position: relative;
  width: 1280px;
  margin: 0 auto;
  height: 100px;
}
#template-pricing-suggest .back-button {
  display: flex;
  align-items: center;
  column-gap: 10px;
  position: absolute;
  top: 30px;
  left: 55px;
  padding: 9px 15px 9px 9px;
  border-radius: 20px;
  box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  text-decoration: none;
  transition: all 0.1s ease-in-out;
}
#template-pricing-suggest .back-button:hover {
  filter: brightness(0.94);
}
#template-pricing-suggest .back-button img {
  height: 16px;
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#template-pricing-suggest .back-button span {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: right;
  color: #444;
}
#template-pricing-suggest input[type=text] {
  display: block;
  padding: 13px 72px 13px 12px;
  height: 40px;
  border-radius: 6px;
  border: solid 1px #bbb;
  background-color: #fff;
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 10px;
  outline: none;
}
#template-pricing-suggest input[type=text]:focus {
  border-color: #289eef;
}
#template-pricing-suggest input[type=text]:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px white inset;
  box-shadow: 0 0 0 1000px white inset;
}
#template-pricing-suggest input[type=radio] {
  -webkit-appearance: none;
  appearance: none;
  position: absolute;
  top: 1px;
  left: 0;
  width: 18px;
  height: 18px;
  border-radius: 100%;
  vertical-align: middle;
  background: #f8f8f8 url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-radio-off.svg") no-repeat center/contain;
}
#template-pricing-suggest input[type=radio]:checked {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-radio-on.svg");
}
#template-pricing-suggest input[type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  position: absolute;
  top: 1px;
  left: 0;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-off.svg") no-repeat center/contain;
}
#template-pricing-suggest input[type=checkbox]:checked {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-on.svg");
}
#template-pricing-suggest label {
  line-height: 1.5;
  vertical-align: middle;
  font-size: 16px;
  position: relative;
  display: block;
  padding-left: 26px;
}
#template-pricing-suggest .font_en {
  font-family: Helvetica Neue, Helvetica, Arial, Verdana, sans-serif, "SF Pro KR", "SF Pro Text";
}
#template-pricing-suggest #suggestionStep {
  display: block;
  width: 100%;
}
#template-pricing-suggest #suggestionStep .step-top-area {
  padding: 0 43px 0 70px;
  display: flex;
  flex-wrap: wrap;
}
#template-pricing-suggest #suggestionStep .step-top-area img {
  width: 376px;
}
#template-pricing-suggest #suggestionStep .suggestion-step {
  display: none;
  width: 970px;
  left: 50%;
  transform: translateX(-50%);
  padding-bottom: 243px;
  position: relative;
}
#template-pricing-suggest #suggestionStep.step1 .step-1 {
  display: block;
}
#template-pricing-suggest #suggestionStep.step2 .step-2 {
  display: block;
}
#template-pricing-suggest #suggestionStep.step3 .step-3 {
  display: block;
}
#template-pricing-suggest #suggestionStep.step4 .step-4 {
  display: block;
}
#template-pricing-suggest #suggestionStep.step5 .step-5 {
  display: block;
}
#template-pricing-suggest #suggestionStep .step-top-result {
  display: none;
  margin-top: 19px;
}
#template-pricing-suggest #suggestionStep .step-top {
  display: flex;
  justify-content: center;
  width: 1280px;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
#template-pricing-suggest #suggestionStep .step-top-copy {
  width: 470px;
  margin-right: 11px;
}
#template-pricing-suggest #suggestionStep .step-top-copy span {
  padding-top: 5px;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: -0.38px;
  color: #7b7b7b;
  display: block;
  margin-top: 7px;
}
#template-pricing-suggest #suggestionStep .step-desc {
  margin-top: 10px;
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #444;
}
#template-pricing-suggest #suggestionStep .step-tit {
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  color: #222;
  display: block;
  margin-top: 10px;
  font-size: 34px;
  line-height: 1.29;
  letter-spacing: -1.06px;
}
#template-pricing-suggest #suggestionStep .step-inner {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  min-height: 405px;
  margin-top: 42px;
  padding: 80px 100px 35px;
  border-radius: 14px;
  box-shadow: 0 15px 15px -5px rgba(0, 0, 0, 0.12);
  border: solid 5px #b7ba98;
  background-color: #f8f8f8;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  opacity: 0;
  transform: translateY(50px);
  transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
}
#template-pricing-suggest #suggestionStep .step-inner.active {
  opacity: 1;
  transform: translateY(0px);
}
#template-pricing-suggest #suggestionStep .step-inner > * {
  min-width: 400px;
}
#template-pricing-suggest #suggestionStep .step-inner-tit {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
  margin-bottom: 6px;
}
#template-pricing-suggest #suggestionStep .step-inner-cnt ul > li {
  vertical-align: middle;
  font-size: 0;
  color: #2f2f2f;
  position: relative;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
}
#template-pricing-suggest #suggestionStep .step-inner-cnt ul > li:first-child {
  margin-top: 0 !important;
}
#template-pricing-suggest #suggestionStep .step-inner-cnt ul > li input {
  margin-bottom: 0;
}
#template-pricing-suggest #suggestionStep .step-inner-cnt ul > li .input-error {
  display: block;
  visibility: hidden;
  font-size: 12px;
  font-weight: 500;
  color: #ec0047;
  padding: 6px;
}
#template-pricing-suggest #suggestionStep .step-inner-cnt ul > li .input-del {
  display: none;
  width: 14px;
  height: 14px;
  position: absolute;
  right: 12px;
  top: 12px;
  cursor: pointer;
}
#template-pricing-suggest #suggestionStep .step-inner-cnt ul > li .input-del img {
  width: 100%;
}
#template-pricing-suggest #suggestionStep .step-inner-cnt ul > li.error input {
  border-color: #ec0047;
}
#template-pricing-suggest #suggestionStep .step-inner-cnt ul > li.error .input-error {
  visibility: visible;
}
#template-pricing-suggest #suggestionStep .step-inner-cnt ul > li.error .input-del {
  display: block;
}
#template-pricing-suggest #suggestionStep .step-inner-btn {
  position: relative;
  bottom: 0;
  margin-top: 50px;
  text-align: center;
  font-size: 0;
  display: flex;
  column-gap: 5px;
  justify-content: center;
}
#template-pricing-suggest #suggestionStep .step-inner-btn button {
  line-height: 1;
  padding: 0 22px;
  height: 42px;
  border-radius: 21px;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  color: #fff;
  transition: all 0.1s ease-in-out;
  display: inline-block;
  min-width: 100px;
  box-sizing: border-box;
  cursor: default;
  pointer-events: none;
}
#template-pricing-suggest #suggestionStep .step-inner-btn button.btn-before {
  color: #444;
  border: solid 1px #bbb;
  background-color: #fff;
  cursor: pointer;
  pointer-events: all;
}
#template-pricing-suggest #suggestionStep .step-inner-btn button.btn-before:hover {
  filter: brightness(0.94);
}
#template-pricing-suggest #suggestionStep .step-inner-btn button.btn-next {
  background-color: rgba(0, 0, 0, 0.25);
}
#template-pricing-suggest #suggestionStep .step-inner-btn button.btn-next:hover {
  filter: brightness(0.94);
}
#template-pricing-suggest #suggestionStep .step-inner-btn button.btn-contactus {
  border: solid 1px #ec0047;
  background-color: #fff;
  pointer-events: all;
  cursor: pointer;
  color: #ec0047;
}
#template-pricing-suggest #suggestionStep .step-inner-btn button.btn-contactus:hover {
  filter: brightness(0.94);
}
#template-pricing-suggest #suggestionStep .step-inner-btn button.active {
  background-color: #ec0047;
  pointer-events: all;
  cursor: pointer;
}
#template-pricing-suggest #suggestionStep .step-inner-btn button.active:hover {
  filter: brightness(0.84);
}
#template-pricing-suggest #suggestionStep .step-1 .step-inner > * {
  min-width: 100%;
}
#template-pricing-suggest #suggestionStep .step-1 .cnt-input {
  max-height: 240px;
  overflow-y: auto;
}
#template-pricing-suggest #suggestionStep .step-1 .cnt-input li {
  color: #444;
}
#template-pricing-suggest #suggestionStep .step-1 ::-webkit-input-placeholder {
  color: #bbb;
}
#template-pricing-suggest #suggestionStep .step-1 :-ms-input-placeholder {
  color: #bbb;
}
#template-pricing-suggest #suggestionStep .step-1 ::-webkit-input-placeholder {
  color: #bbb;
}
#template-pricing-suggest #suggestionStep .step-1 :-ms-input-placeholder {
  color: #bbb;
}
#template-pricing-suggest #suggestionStep .step-1 .btn_add_input {
  margin-top: 18px;
  position: relative;
  padding-left: 30px;
  font-size: 12px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.17;
  letter-spacing: normal;
  color: #444;
  left: 50%;
  transform: translateX(-50%);
}
#template-pricing-suggest #suggestionStep .step-1 .btn_add_input span {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 25px;
  height: 25px;
  padding: 2.5px;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
  border-radius: 100%;
  box-sizing: border-box;
  text-align: center;
}
#template-pricing-suggest #suggestionStep .step-1 .btn_add_input span img {
  position: relative;
  left: 50%;
  top: 50%;
  transform: rotate(0) translate(-50%, -50%);
  transition: rotate 0.5s ease;
}
#template-pricing-suggest #suggestionStep .step-2 .step-inner-tit, #template-pricing-suggest #suggestionStep .step-3 .step-inner-tit, #template-pricing-suggest #suggestionStep .step-4 .step-inner-tit {
  font-weight: 600;
  margin-bottom: 35px;
}
#template-pricing-suggest #suggestionStep .step-2 .step-inner-cnt ul > li, #template-pricing-suggest #suggestionStep .step-3 .step-inner-cnt ul > li, #template-pricing-suggest #suggestionStep .step-4 .step-inner-cnt ul > li {
  margin-top: 17px;
}
#template-pricing-suggest #suggestionStep .step-other_type1 .step-inner > * {
  min-width: 100%;
}
#template-pricing-suggest #suggestionStep .step-other_type1 ul {
  display: flex;
  flex-wrap: wrap;
}
#template-pricing-suggest #suggestionStep .step-other_type1 ul li {
  width: 50%;
  margin-top: 0 !important;
  margin-bottom: 17px !important;
}
#template-pricing-suggest #suggestionStep .step-5 .step-inner > * {
  min-width: 100%;
}
#template-pricing-suggest #suggestionStep .step-5 .other-list {
  position: relative;
  margin-top: 27px;
  display: inline-block;
  left: 50%;
  transform: translateX(-50%);
}
#template-pricing-suggest #suggestionStep .step-5 .other-list input[type=radio] {
  -webkit-appearance: none;
  appearance: none;
  position: absolute;
  top: 1px;
  left: 0;
  width: 18px;
  height: 18px;
  border-radius: 0;
  vertical-align: middle;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-off.svg") no-repeat center/contain;
}
#template-pricing-suggest #suggestionStep .step-5 .other-list input[type=radio]:checked {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-on.svg");
}
#template-pricing-suggest #suggestionStep .step-5 ul {
  display: flex;
  position: relative;
}
#template-pricing-suggest #suggestionStep .step-5 ul::before {
  content: "";
  position: absolute;
  width: calc(100% - 100px);
  height: 2px;
  background-color: #aaa;
  top: 8px;
  left: 50px;
}
#template-pricing-suggest #suggestionStep .step-5 ul li {
  width: 100%;
  margin-top: 0 !important;
}
#template-pricing-suggest #suggestionStep .step-5 ul li input[type=radio] {
  display: block;
  position: relative;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}
#template-pricing-suggest #suggestionStep .step-5 ul li label {
  display: block;
  padding-left: 0;
  text-align: center;
  margin-top: 10px;
}
#template-pricing-suggest #suggestionStep .step-top-result strong {
  font-size: 40px;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.3;
  letter-spacing: -1.25px;
  color: #222;
}
#template-pricing-suggest #suggestionStep .step-top-result p {
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.61;
  letter-spacing: normal;
  color: #444;
  margin-top: 19px;
}
#template-pricing-suggest #suggestionStep.step1 .step-tit {
  font-size: 40px;
  line-height: 1;
  letter-spacing: -1.25px;
  margin-top: 22px;
}
#template-pricing-suggest #suggestionStep.result {
  align-items: normal;
  margin-top: 30px;
}
#template-pricing-suggest #suggestionStep.result .step-result {
  display: block;
  width: 100%;
  left: 0;
  transform: none;
  padding: 95px 0 185px;
  background-color: #f8f8f8;
  margin-top: 60px;
}
#template-pricing-suggest #suggestionStep.result .step-top-area {
  display: none;
}
#template-pricing-suggest #suggestionStep.result .step-top-result {
  display: block;
  margin-top: 0;
}
#template-pricing-suggest #suggestionStep.result .step-top {
  width: 1029px;
  justify-content: flex-start;
  padding-left: 29px;
  box-sizing: border-box;
}
#template-pricing-suggest #suggestionStep.result .step-inner {
  margin-top: 0;
  width: 1029px;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  background-color: transparent;
  border: none;
  justify-content: unset;
  flex-direction: column;
  align-items: unset;
  display: block;
  position: relative;
  left: 50%;
  opacity: 0;
  transform: translate(-50%, 50px);
  transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
}
#template-pricing-suggest #suggestionStep.result .step-inner.active {
  opacity: 1;
  transform: translate(-50%, 0px);
}
#template-pricing-suggest #suggestionStep.result .result-insight-twice {
  margin-top: 80px;
}
#template-pricing-suggest #suggestionStep.result .result-tit {
  font-size: 18px;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
  margin-bottom: 10px;
  display: block;
  padding-left: 15px;
}
#template-pricing-suggest #suggestionStep.result .result-box {
  width: 1029px;
  min-height: 245px;
  padding: 27px 30px 30px 35px;
  border-radius: 14px;
  box-shadow: 0 15px 15px -5px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
  margin-top: 40px;
  box-sizing: border-box;
  transition: all 0.5s ease;
}
#template-pricing-suggest #suggestionStep.result .result-box:first-child {
  margin-top: 0;
}
#template-pricing-suggest #suggestionStep.result .result-box:hover {
  transform: scale(1.02);
}
#template-pricing-suggest #suggestionStep.result .result-box-tit {
  width: 620px;
  font-size: 0;
  vertical-align: middle;
  display: flex;
  column-gap: 12px;
  align-items: center;
}
#template-pricing-suggest #suggestionStep.result .result-box-tit strong {
  display: inline-block;
  font-size: 35px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.97px;
  color: #222;
}
#template-pricing-suggest #suggestionStep.result .result-box-icon {
  display: inline-flex;
  align-items: center;
  vertical-align: sub;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #fff;
}
#template-pricing-suggest #suggestionStep.result .result-box-icon.journey_pro {
  background-color: #FF2D92;
}
#template-pricing-suggest #suggestionStep.result .result-box-icon.everyone {
  background-color: #6F6F6F;
}
#template-pricing-suggest #suggestionStep.result .result-box-icon.saas {
  background-color: #8aa0ba;
}
#template-pricing-suggest #suggestionStep.result .result-box-icon.trial {
  padding: 0;
}
#template-pricing-suggest #suggestionStep.result .result-box-icon.trial .only-mobile {
  background-color: #8aa0ba;
}
#template-pricing-suggest #suggestionStep.result .result-box-icon.enterprise {
  background-color: #294379;
}
#template-pricing-suggest #suggestionStep.result .result-box-icon small {
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
}
#template-pricing-suggest #suggestionStep.result .result-box-icon img {
  height: 100%;
}
#template-pricing-suggest #suggestionStep.result .result-box-charge {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(calc(-50% - 27px));
  display: flex;
  flex-direction: column;
  width: 300px;
  flex-wrap: wrap;
  align-items: center;
  padding-right: 75px;
  box-sizing: border-box;
  min-width: 340px;
  max-width: 340px;
}
#template-pricing-suggest #suggestionStep.result .result-box-charge .mo {
  width: 100% !important;
  min-width: 100%;
}
#template-pricing-suggest #suggestionStep.result .result-box-charge .charge-cost {
  margin-bottom: 4px;
  padding-left: 57px;
}
#template-pricing-suggest #suggestionStep.result .result-box-charge .charge-cost span {
  font-size: 20px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.7;
  letter-spacing: normal;
  text-align: center;
  color: #444;
  position: relative;
  padding: 0 5.5px;
}
#template-pricing-suggest #suggestionStep.result .result-box-charge .charge-cost span::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: rgba(68, 68, 68, 0.7);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#template-pricing-suggest #suggestionStep.result .result-box-charge .charge-sale {
  font-size: 32px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.81;
  letter-spacing: normal;
  text-align: center;
  color: #ec0047;
}
#template-pricing-suggest #suggestionStep.result .result-box-charge .charge-sale.limited span {
  position: relative;
  display: inline-block;
}
#template-pricing-suggest #suggestionStep.result .result-box-charge .charge-vat {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #444;
  margin-top: 14px;
}
#template-pricing-suggest #suggestionStep.result .result-box-charge .charge-vat.limited {
  margin-top: 10px;
}
#template-pricing-suggest #suggestionStep.result .result-box-info {
  margin-top: 37px;
  width: 560px;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li {
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  color: #444;
  margin-top: 13px;
  position: relative;
  padding-left: 25px;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li::before {
  content: "";
  width: 17px;
  height: 17px;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/icon-suggest-result-check.svg") no-repeat center/contain;
  position: absolute;
  left: 0;
  top: -3px;
  display: block;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .li_inner {
  display: inline-block;
  position: relative;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note {
  vertical-align: sub;
  margin-left: 2px;
  position: absolute;
  bottom: 1px;
  left: 100%;
  pointer-events: none;
  display: inline-flex;
  flex-wrap: wrap-reverse;
  row-gap: 14px;
  margin-left: -46px;
  cursor: help;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_pointer {
  pointer-events: all;
  position: relative;
  left: 48px;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_pointer:hover + .note_box {
  visibility: visible;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box {
  z-index: 2;
  visibility: hidden;
  cursor: default;
  position: relative;
  left: 0;
  bottom: 0;
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  background-color: #fff;
  font-size: 13px;
  padding: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.31;
  letter-spacing: normal;
  text-align: center;
  color: #767676;
  box-sizing: border-box;
  min-width: 133px;
  border-radius: 10px;
  z-index: 1;
  pointer-events: all;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box::after {
  content: "";
  position: absolute;
  bottom: -6.3px;
  left: 50px;
  width: 10px;
  height: 10px;
  background-color: #fff;
  transform: rotate(45deg);
  border-right: 1px solid #b9b9b9;
  border-bottom: 1px solid #b9b9b9;
  box-shadow: 4px 3px 4px rgba(0, 0, 0, 0.05);
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.copy_only {
  width: 133px;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.copy_only_large {
  width: 248px;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.type-dl-img {
  width: 390px;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.type-dl-img dl {
  display: flex;
  column-gap: 15px;
  align-items: center;
  margin-top: 35px;
  text-align: left;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.type-dl-img dl:first-child {
  margin-top: 0;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.type-dl-img dl dd .pro-only {
  width: max-content;
  display: block;
  margin-bottom: 6px;
  padding: 4px 5px;
  border-radius: 4px;
  background-color: #FF2D92;
  font-family: "NewRubrik", sans-serif;
  font-size: 9px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #fff;
  text-align: center;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.type-dl-text {
  width: 230px;
  text-align: left;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.type-dl-text dl {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  margin-top: 10px;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.type-dl-text dl:first-child {
  margin-top: 0;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.type-dl-text dl dt {
  font-weight: bold;
  color: #2f2f2f;
}
#template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.type-dl-text dl dt small {
  font-size: 10px;
  font-weight: bold;
  color: #ec0047;
}
#template-pricing-suggest #suggestionStep.result .result-box-btns {
  position: absolute;
  bottom: 30px;
  right: 30px;
  font-size: 0;
  display: flex;
  column-gap: 8px;
  align-items: flex-end;
}
#template-pricing-suggest #suggestionStep.result .result-box-btns a {
  transition: all 0.1s ease-in-out;
  min-width: 161px;
  height: 50px;
  font-size: 18px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 50px;
  letter-spacing: normal;
  padding: 0 20px;
  text-align: center;
  border-radius: 50px;
  vertical-align: middle;
  box-sizing: border-box;
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
#template-pricing-suggest #suggestionStep.result .result-box-btns a.btn_box_more {
  border: solid 1.5px #ec0047;
  background-color: #fff;
  color: #ec0047;
}
#template-pricing-suggest #suggestionStep.result .result-box-btns a.btn_box_more:hover {
  filter: brightness(0.94);
}
#template-pricing-suggest #suggestionStep.result .result-box-btns a.btn_box_apply {
  border: solid 2px #fc014e;
  background-color: #ec0047;
  color: #fff;
  column-gap: 8px;
  margin-top: -2px;
}
#template-pricing-suggest #suggestionStep.result .result-box-btns a.btn_box_apply::after {
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/icon-arrow-white.svg") no-repeat center/contain;
}
#template-pricing-suggest #suggestionStep.result .result-box-btns a.btn_box_apply:hover {
  filter: brightness(0.84);
}
#template-pricing-suggest #suggestionStep.result .result-box.journeymap .result-box-tit strong::before {
  content: "";
  width: 93px;
  height: 54px;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/suggest-result-heatmap.svg") no-repeat center/contain;
  position: relative;
  display: inline-block;
  margin-right: 15px;
  vertical-align: text-top;
}
#template-pricing-suggest #suggestionStep.result .result-box.heatmap .result-box-tit strong::before {
  content: "";
  width: 98px;
  height: 47px;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/suggest-result-journeymap.svg") no-repeat center/contain;
  position: relative;
  display: inline-block;
  margin-right: 15px;
  vertical-align: middle;
}
#template-pricing-suggest #popup {
  z-index: 111;
}
#template-pricing-suggest #popup input[type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-off.svg") no-repeat center/contain;
}
#template-pricing-suggest #popup input[type=checkbox]:checked {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-on.svg");
}
#template-pricing-suggest #popup.container .popup {
  display: none;
  overflow: hidden;
}
#template-pricing-suggest #popup.container .popup-suggest-contactus {
  width: 630px;
  height: 694px;
  left: calc(50% - 315px);
  top: calc(50% - 347px);
  justify-content: flex-start;
}
#template-pricing-suggest #popup.container .popup-suggest-contactus.pc {
  height: 694px !important;
}
#template-pricing-suggest #popup.container .popup-complete-inner {
  display: flex;
  width: 430px;
  height: 290px;
  flex-direction: column;
  align-items: center;
  padding-top: 50px;
  box-sizing: border-box;
}
#template-pricing-suggest #popup.container .popup-complete .popup-image {
  margin-bottom: 16px;
}
#template-pricing-suggest #popup.container .popup-complete .popup-title {
  margin-bottom: 13px;
  font-weight: bold;
  line-height: 1;
}
#template-pricing-suggest #popup.container .popup-complete .popup-description {
  font-size: 14px;
  line-height: 1.43;
}
#template-pricing-suggest #popup.container .popup-complete .popup-button {
  margin-top: 38px;
}
#template-pricing-suggest #popup.container .popup-complete .popup-button:hover {
  filter: brightness(0.94);
}
#template-pricing-suggest #popup.container .popup-head {
  height: 125px;
  position: relative;
  text-align: center;
}
#template-pricing-suggest #popup.container .popup-head::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  z-index: 1;
  left: 0;
  bottom: -1px;
  background-color: #fff;
  box-shadow: 0 0 15px 12px #fff;
}
#template-pricing-suggest #popup.container .popup-head-title {
  font-size: 40px;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: -0.98px;
  color: #333;
  padding-top: 60px;
  z-index: 2;
  position: relative;
  background-color: #fff;
  border-radius: 14px;
}
#template-pricing-suggest #popup.container .popup-head .btn-close {
  position: absolute;
  top: 11px;
  right: 9.4px;
  width: 24px;
  height: 24px;
  z-index: 2;
  transition: all 0.2s ease-in-out;
}
#template-pricing-suggest #popup.container .popup-head .btn-close:hover {
  transform: rotate(90deg);
}
#template-pricing-suggest #popup.container .popup-inner {
  display: flex;
  padding: 25.5px 17px 0;
  overflow-y: auto;
  height: 482px;
  justify-content: center;
  box-sizing: border-box;
}
#template-pricing-suggest #popup.container .popup-inner form {
  display: flex;
  flex-direction: column;
  row-gap: 35px;
  width: 490px;
}
#template-pricing-suggest #popup.container .popup-inner .item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#template-pricing-suggest #popup.container .popup-inner .item.flexstart {
  align-items: flex-start;
}
#template-pricing-suggest #popup.container .popup-inner .item-category {
  font-size: 15px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.07;
  letter-spacing: normal;
  color: #555;
  width: 80px;
}
#template-pricing-suggest #popup.container .popup-inner .item-category .optional {
  margin-left: 2px;
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.23;
  letter-spacing: normal;
  color: #767676;
}
#template-pricing-suggest #popup.container .popup-inner .item-error {
  position: absolute;
  top: 44px;
  left: 80px;
  color: #e60724;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.08;
  opacity: 0;
  transition: opacity 0.2s ease;
}
#template-pricing-suggest #popup.container .popup-inner .item-input {
  position: relative;
  box-sizing: border-box;
  width: 410px;
  padding: 10px 12px;
  border: 1px solid #b1b1b1;
  border-radius: 6px;
  outline: none;
  background-color: #fff;
  font-size: 14px;
  line-height: 1;
  color: #2f2f2f;
  transition: border-color 0.3s ease;
  margin-bottom: 0;
}
#template-pricing-suggest #popup.container .popup-inner .item-input:focus {
  border-color: #289eef;
}
#template-pricing-suggest #popup.container .popup-inner .item-select {
  width: 410px;
  padding: 10px 12px;
  border-radius: 6px;
  border: solid 1px #b1b1b1;
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat 97% 50%;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  box-sizing: border-box;
  line-height: 1;
  letter-spacing: normal;
  color: #2f2f2f;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
}
#template-pricing-suggest #popup.container .popup-inner .item-select:focus {
  border-color: #289eef;
}
#template-pricing-suggest #popup.container .popup-inner .item-textarea {
  box-sizing: border-box;
  width: 410px;
  min-height: 224px;
  padding: 12px;
  border-radius: 3px;
  border: solid 1px #b1b1b1;
  resize: none;
  font-family: inherit;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #2f2f2f;
  outline: none;
}
#template-pricing-suggest #popup.container .popup-inner .item-textarea:focus {
  border-color: #289eef;
}
#template-pricing-suggest #popup.container .popup-inner .item-agreement {
  display: flex;
  position: relative;
  align-items: center;
  column-gap: 6px;
  width: 410px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.14;
  letter-spacing: normal;
  color: #767676;
  padding-bottom: 47px;
}
#template-pricing-suggest #popup.container .popup-inner .item-agreement input {
  top: -1px;
  position: relative;
}
#template-pricing-suggest #popup.container .popup-inner .item-agreement a {
  color: #0599e4;
}
#template-pricing-suggest #popup.container .popup-inner .item-agreement .item-error {
  top: 23px;
  left: 24px;
  line-height: 1;
  letter-spacing: normal;
  color: #ec0047;
}
#template-pricing-suggest #popup.container .popup-inner .item.error .item-input, #template-pricing-suggest #popup.container .popup-inner .item.error .item-select, #template-pricing-suggest #popup.container .popup-inner .item.error .item-textarea {
  border-color: #e60724;
}
#template-pricing-suggest #popup.container .popup-inner .item.error .item-input:focus, #template-pricing-suggest #popup.container .popup-inner .item.error .item-select:focus, #template-pricing-suggest #popup.container .popup-inner .item.error .item-textarea:focus {
  border-color: #e60724;
}
#template-pricing-suggest #popup.container .popup-inner .item.error .item-error {
  opacity: 1;
}
#template-pricing-suggest #popup.container .popup-inner .item.error .item-error2 {
  opacity: 0;
}
#template-pricing-suggest #popup.container .popup-inner .item.error.error2 .item-error {
  opacity: 0;
}
#template-pricing-suggest #popup.container .popup-inner .item.error.error2 .item-error2 {
  opacity: 1;
}
#template-pricing-suggest #popup.container .popup-inner .item.agreement_box {
  justify-content: flex-end;
}
#template-pricing-suggest #popup.container .popup-bottom {
  position: relative;
  text-align: center;
}
#template-pricing-suggest #popup.container .popup-bottom::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  z-index: 1;
  left: 0;
  top: -1px;
  background-color: #fff;
  box-shadow: 0 0 15px 12px #fff;
}
#template-pricing-suggest #popup.container .popup-bottom-submit {
  margin-top: 22.5px;
  padding: 13px 20px 11px 21px;
  border-radius: 20px;
  background-color: #ec0047;
  box-sizing: border-box;
  font-size: 14px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
#template-pricing-suggest #popup.container .popup-bottom-submit:hover {
  filter: brightness(0.84);
}

html[lang=en] #template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note {
  bottom: 0;
}
html[lang=en] #template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note .note_box.copy_only {
  width: 182px;
}
html[lang=en] #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-sale.limited span::before {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-suggest-limited-en.svg");
}

html[lang=ja] #template-pricing-suggest {
  word-break: break-all;
}
html[lang=ja] #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-sale.limited span::before {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-suggest-limited-jp.svg");
}

html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner form {
  width: 480px;
  row-gap: 30px;
}
html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner .item {
  flex-direction: column;
  align-items: flex-start;
  row-gap: 6px;
}
html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner .item.agreement_box {
  margin-top: -16px;
}
html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner .item-category {
  padding-left: 6px;
  width: 100%;
  box-sizing: border-box;
}
html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner .item-input {
  width: 100%;
}
html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner .item-error {
  top: 65px;
  left: 6px;
}
html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner .item-select {
  width: 100%;
}
html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner .item-textarea {
  width: 100%;
}
html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner .item-agreement .item-error {
  top: 24px;
  left: 25px;
}

@media all and (max-width: 768px) {
  .template-pricing-get_suggest {
    padding: 69px 20px 60px;
    margin-top: 0;
    min-width: 100%;
  }
  .template-pricing-get_suggest .get_suggest-tit {
    font-size: 20px;
    letter-spacing: normal;
    color: #2f2f2f;
    margin-bottom: 10px;
  }
  .template-pricing-get_suggest .get_suggest-desc {
    font-size: 14px;
    line-height: 1.57;
    letter-spacing: normal;
    color: #767676;
    margin-bottom: 30px;
  }
  .template-pricing-get_suggest .get_suggest-img {
    width: 268px;
  }
  .template-pricing-get_suggest .get_suggest-btn {
    margin-top: 44px;
  }
  .template-pricing-get_suggest .get_suggest-btn a {
    display: inline-block;
    padding: 15px 18px;
    font-size: 15px;
    line-height: 0.93;
    letter-spacing: -0.34px;
  }
  #template-pricing-suggest {
    min-width: auto;
  }
  #template-pricing-suggest input[type=text] {
    padding: 12px;
    height: 38px;
  }
  #template-pricing-suggest input[type=radio] {
    top: 0;
  }
  #template-pricing-suggest input[type=checkbox] {
    top: -1px;
  }
  #template-pricing-suggest label {
    line-height: 1.36;
    font-size: 14px;
  }
  #template-pricing-suggest .contents .contents_btn {
    width: auto;
    height: 70px;
  }
  #template-pricing-suggest .contents .contents_btn a.back-button {
    column-gap: 5px;
    top: 20px;
    left: 20px;
    padding: 0;
    border: 0;
    box-shadow: none;
    background-color: transparent;
  }
  #template-pricing-suggest .contents .contents_btn a.back-button img {
    width: 20px;
    height: 20px;
  }
  #template-pricing-suggest .contents .contents_btn a.back-button span {
    color: #767676;
  }
  #template-pricing-suggest #suggestionStep .suggestion-step {
    width: 100%;
    left: 0;
    transform: none;
    padding-bottom: 0;
  }
  #template-pricing-suggest #suggestionStep .step-top {
    display: block;
    width: 100%;
    left: 0;
    transform: none;
  }
  #template-pricing-suggest #suggestionStep .step-top-area {
    padding: 0 25px;
    display: block;
  }
  #template-pricing-suggest #suggestionStep .step-top-area img {
    width: 215px;
    display: block;
    position: relative;
    left: calc(100% - 215px);
    margin-top: 18px;
  }
  #template-pricing-suggest #suggestionStep .step-top-copy {
    width: 100%;
    margin-right: 0;
    min-height: 112px;
  }
  #template-pricing-suggest #suggestionStep .step-top-copy span {
    padding-top: 0;
    display: block;
    margin-top: 0;
  }
  #template-pricing-suggest #suggestionStep .step-desc {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.57;
    color: #767676;
  }
  #template-pricing-suggest #suggestionStep .step-tit {
    color: #333;
    margin-top: 10px;
    font-size: 22px;
    line-height: 1.36;
    letter-spacing: -0.54px;
  }
  #template-pricing-suggest #suggestionStep .step-inner {
    min-height: 428px;
    margin-top: 30px;
    padding: 30px 16px 25px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    border-top: 1px solid #e1e1e1;
    background-color: #f7f7f7;
    justify-content: flex-start;
    flex-direction: column;
    align-items: unset;
  }
  #template-pricing-suggest #suggestionStep .step-inner > * {
    min-width: auto;
  }
  #template-pricing-suggest #suggestionStep .step-inner-tit {
    font-size: 13px;
    color: #767676;
    margin-bottom: 5px;
  }
  #template-pricing-suggest #suggestionStep .step-inner-btn {
    margin-top: 35px;
  }
  #template-pricing-suggest #suggestionStep .step-inner-btn button {
    padding: 0 10px;
    height: 44px;
    border-radius: 44px;
    font-size: 15px;
    font-weight: 800;
    min-width: auto;
    box-sizing: border-box;
    margin: 0;
    width: 50%;
  }
  #template-pricing-suggest #suggestionStep .step-1 .cnt-input {
    max-height: 230px;
  }
  #template-pricing-suggest #suggestionStep .step-1 .cnt-input li {
    color: #2f2f2f;
  }
  #template-pricing-suggest #suggestionStep .step-1 .btn_add_input {
    margin-top: 16px;
  }
  #template-pricing-suggest #suggestionStep .step-2 .step-inner-tit, #template-pricing-suggest #suggestionStep .step-3 .step-inner-tit, #template-pricing-suggest #suggestionStep .step-4 .step-inner-tit, #template-pricing-suggest #suggestionStep .step-5 .step-inner-tit {
    margin: 0 4px 26px;
  }
  #template-pricing-suggest #suggestionStep .step-5 ul {
    display: block;
  }
  #template-pricing-suggest #suggestionStep .step-5 ul::before {
    display: none;
  }
  #template-pricing-suggest #suggestionStep .step-5 ul li:first-child label {
    margin-top: 0;
  }
  #template-pricing-suggest #suggestionStep .step-5 ul li input[type=radio] {
    position: absolute;
    left: 0;
    transform: none;
  }
  #template-pricing-suggest #suggestionStep .step-5 ul li label {
    padding-left: 26px;
    text-align: left;
    margin-top: 15px;
  }
  #template-pricing-suggest #suggestionStep .step-5 ul li label br {
    display: none;
  }
  #template-pricing-suggest #suggestionStep .step-5 .other-list {
    display: block;
    left: 0;
    transform: none;
    margin-top: 15px;
  }
  #template-pricing-suggest #suggestionStep .step-5 .other-list input[type=radio] {
    top: 0;
    border-radius: 100%;
    background: #f8f8f8 url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-radio-off.svg") no-repeat center/contain;
  }
  #template-pricing-suggest #suggestionStep .step-5 .other-list input[type=radio]:checked {
    background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-radio-on.svg");
  }
  #template-pricing-suggest #suggestionStep .step-other_type1 ul {
    display: block;
  }
  #template-pricing-suggest #suggestionStep .step-other_type1 ul li {
    width: 100%;
  }
  #template-pricing-suggest #suggestionStep.step1 .step-tit {
    font-size: 22px;
    line-height: 1.36;
    letter-spacing: -0.54px;
    margin-top: 10px;
  }
  #template-pricing-suggest #suggestionStep.result {
    margin-top: 0;
  }
  #template-pricing-suggest #suggestionStep.result .step-top {
    width: 100%;
    padding: 0 25px;
  }
  #template-pricing-suggest #suggestionStep.result .step-top-result strong {
    font-size: 22px;
    line-height: 1.36;
    letter-spacing: 0.54px;
    color: #333;
  }
  #template-pricing-suggest #suggestionStep.result .step-top-result p {
    font-size: 14px;
    line-height: 1.57;
    color: #767676;
    margin-top: 10px;
  }
  #template-pricing-suggest #suggestionStep.result .step-result {
    padding: 26px 20px 25px;
    margin-top: 35px;
    border-top: 1px solid #e1e1e1;
    box-sizing: border-box;
  }
  #template-pricing-suggest #suggestionStep.result .step-result .step-inner-btn {
    margin-top: 40px;
  }
  #template-pricing-suggest #suggestionStep.result .step-result .step-inner-btn button.btn-contactus {
    color: #fff;
    background-color: #ec0047;
  }
  #template-pricing-suggest #suggestionStep.result .step-inner {
    width: 100%;
    min-height: 428px;
    padding: 0;
  }
  #template-pricing-suggest #suggestionStep.result .result-tit {
    font-size: 14px;
    padding-left: 5px;
    margin-bottom: 14px;
  }
  #template-pricing-suggest #suggestionStep.result .result-box {
    width: 100%;
    padding: 20px 0 0;
    min-height: auto;
    margin-top: 25px;
    overflow: hidden;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-tit {
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
    column-gap: 5px;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-tit strong {
    font-size: 20px;
    letter-spacing: normal;
    color: #333;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-icon {
    padding: 3px 6px;
    font-size: 12px;
    line-height: 12px;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-icon.trial {
    padding: 3px 6px;
    background-color: #8aa0ba;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-icon.trial small {
    background-color: transparent;
    font-size: 12px;
    font-weight: bold;
    line-height: 12px;
    color: #fff;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-charge {
    position: relative;
    top: 0;
    left: 0;
    transform: none;
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: left;
    margin-top: 19px;
    padding: 0 20px;
    box-sizing: border-box;
    min-width: 100%;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-cost {
    margin-bottom: 0;
    margin-left: 0;
    padding-left: 0;
    padding-bottom: 5px;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-cost span {
    font-size: 12px;
    line-height: 1;
    padding: 0 1px;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-sale {
    font-size: 0;
    font-weight: 600;
    line-height: 1;
    margin-right: 9px;
    padding-bottom: 5px;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-sale span {
    font-size: 17px;
    vertical-align: middle;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-sale.limited span {
    font-size: 17px;
    vertical-align: middle;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-sale.limited span::before {
    display: none;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-sale.limited small.suggest_limited {
    font-family: NotoSansKRBold, sans-serif;
    font-size: 10px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #fff;
    padding: 4px;
    border-radius: 3px;
    background-color: #ec0047;
    margin-left: 5px;
    vertical-align: middle;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-charge .charge-vat {
    display: none;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-info {
    width: 100%;
    padding-top: 30px;
    margin: 11px auto 0;
    box-sizing: border-box;
    border-top: 1px solid #e1e1e1;
    max-width: calc(100% - 40px);
  }
  #template-pricing-suggest #suggestionStep.result .result-box-info ul li {
    font-size: 12px;
    line-height: 1.58;
    padding-left: 21px;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-info ul li .info_note {
    display: none;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-info ul li::before {
    width: 15px;
    height: 15px;
    top: 0;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-btns {
    position: relative;
    bottom: 0;
    right: 0;
    left: 0;
    border-top: 1px solid #e1e1e1;
    margin-top: 25px;
    column-gap: 0;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-btns a {
    width: 50%;
    margin: 0;
    height: 45px;
    line-height: 1;
    font-size: 15px;
    padding: 0;
    min-width: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 0;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-btns a.btn_box_apply {
    border: 0;
    background-color: transparent;
    color: #ec0047;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-btns a.btn_box_apply::after {
    background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-arrow-red.svg");
  }
  #template-pricing-suggest #suggestionStep.result .result-box-btns a.btn_box_more {
    border: 0;
    color: #444;
    position: relative;
  }
  #template-pricing-suggest #suggestionStep.result .result-box-btns a.btn_box_more::after {
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    background-color: #e1e1e1;
  }
  #template-pricing-suggest #suggestionStep.result .result-box.journeymap .result-box-tit strong::before {
    width: 49px;
    height: 24px;
    margin-right: 10px;
  }
  #template-pricing-suggest #suggestionStep.result .result-box.heatmap .result-box-tit strong::before {
    width: 48px;
    height: 29px;
    margin-right: 11px;
  }
  #template-pricing-suggest #suggestionStep.result .result-insight-twice {
    padding-top: 25px;
    margin-top: 35px;
    border-top: 1px solid #e1e1e1;
  }
  #template-pricing-suggest #popup.container .popup-suggest-contactus {
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    border-radius: 0;
    box-shadow: none;
  }
  #template-pricing-suggest #popup.container .popup-complete {
    width: calc(100% - 56px);
    max-width: 319px;
    height: 263px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  #template-pricing-suggest #popup.container .popup-complete-inner {
    width: 100%;
    height: 100%;
    padding-top: 30px;
  }
  #template-pricing-suggest #popup.container .popup-complete .popup-button {
    margin-top: 30px;
  }
  #template-pricing-suggest #popup.container .popup-head {
    height: 150px;
  }
  #template-pricing-suggest #popup.container .popup-head-title {
    font-size: 22px;
    line-height: 1.36;
    letter-spacing: -0.54px;
    padding-top: 96px;
  }
  #template-pricing-suggest #popup.container .popup-head .btn-close {
    top: 16px;
    right: 16px;
  }
  #template-pricing-suggest #popup.container .popup-head .home {
    height: 16px;
    position: absolute;
    top: 20px;
    left: 16px;
    z-index: 2;
  }
  #template-pricing-suggest #popup.container .popup-head .home img {
    height: 100%;
  }
  #template-pricing-suggest #popup.container .popup-inner {
    padding: 25px 16px 0;
    height: calc(100vh - 264px);
  }
  #template-pricing-suggest #popup.container .popup-inner form {
    row-gap: 30px;
    width: 100%;
  }
  #template-pricing-suggest #popup.container .popup-inner .item {
    display: block;
  }
  #template-pricing-suggest #popup.container .popup-inner .item.flexstart {
    align-items: flex-start;
  }
  #template-pricing-suggest #popup.container .popup-inner .item-category {
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 4px;
    line-height: 1;
    color: #767676;
    width: auto;
    padding-left: 6px;
    display: block;
  }
  #template-pricing-suggest #popup.container .popup-inner .item-error {
    top: 59px;
    left: 6px;
    font-size: 11px;
  }
  #template-pricing-suggest #popup.container .popup-inner .item-input {
    width: 100%;
    padding: 12px;
    font-size: 12px;
    line-height: 1.17;
    margin-bottom: 0;
  }
  #template-pricing-suggest #popup.container .popup-inner .item-select {
    width: 100%;
    padding: 12px;
    font-size: 12px;
  }
  #template-pricing-suggest #popup.container .popup-inner .item-textarea {
    width: 100%;
    font-size: 12px;
  }
  #template-pricing-suggest #popup.container .popup-inner .item-agreement {
    width: 100%;
    font-size: 13px;
    line-height: 1.46;
    color: #666666;
    padding-bottom: 42px;
  }
  #template-pricing-suggest #popup.container .popup-inner .item-agreement input {
    margin-top: 0;
  }
  #template-pricing-suggest #popup.container .popup-inner .item-agreement .item-error {
    top: 23px;
    left: 24px;
  }
  #template-pricing-suggest #popup.container .popup-bottom {
    height: 114px;
    padding: 0 16px;
  }
  #template-pricing-suggest #popup.container .popup-bottom-submit {
    margin-top: 30px;
    font-size: 15px;
    width: 100%;
  }
  html:not(html[lang=ko]) #template-pricing-suggest #popup.container .popup-inner form {
    width: 100%;
  }
}
#bridge.container {
  width: 100%;
  min-width: 1280px;
  background-color: #EFF2D6;
  letter-spacing: initial;
}
#bridge.container .bridge {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 20px;
  width: 100%;
  height: 100vh;
  background: no-repeat center/80% url("https://dream-cdn.beusable.net/home/images/bridge/bridge-background.svg");
}
#bridge.container .bridge .box {
  position: relative;
  display: inline-block;
  width: 770px;
  border-radius: 14px;
  box-shadow: 0 15px 15px -10px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  padding: 30px;
}
#bridge.container .bridge .box .icon-close {
  display: inline;
  width: 11px;
  height: 11px;
  background: no-repeat center/80% url("https://dream-cdn.beusable.net/home/images/bridge/icon-close.svg");
  position: absolute;
  top: 15px;
  right: 15px;
  cursor: pointer;
  padding: 5px;
}
#bridge.container .bridge .box .icon-bridge-logo {
  display: inline-block;
  width: 50px;
  height: 50px;
  background-image: url("https://dream-cdn.beusable.net/home/images/bridge/bridge-logo.svg");
  margin-top: 20px;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
}
#bridge.container .bridge .box .info {
  position: relative;
  margin-top: 15px;
  text-align: center;
}
#bridge.container .bridge .box .info .userInfo {
  font-size: 20px;
  font-weight: 500;
  color: #444444;
}
#bridge.container .bridge .box .info .desc {
  font-size: 14px;
  color: #2F2F2F;
  margin-top: 10px;
}
#bridge.container .bridge .box .list {
  position: relative;
  text-align: center;
}
#bridge.container .bridge .box .list.thead {
  margin-top: 25px;
}
#bridge.container .bridge .box .list.tbody {
  max-height: 300px;
  overflow-y: scroll;
  overflow-x: hidden;
  min-height: 78px;
}
#bridge.container .bridge .box .list.tbody table:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(100% - 20px);
  height: 17px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(hsla(0, 0%, 100%, 0)), to(#fff));
  background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0), #fff);
}
#bridge.container .bridge .box .list table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
}
#bridge.container .bridge .box .list table thead {
  font-size: 13px;
  line-height: 16px;
}
#bridge.container .bridge .box .list table thead tr th {
  color: #fff;
  position: relative;
  height: 50px;
  background-color: #555;
  font-weight: 500;
}
#bridge.container .bridge .box .list table thead tr th:first-of-type:before, #bridge.container .bridge .box .list table thead tr th:last-of-type:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 50px;
  position: absolute;
  top: 0;
  left: -5px;
  background-color: #555;
  border-radius: 5px;
}
#bridge.container .bridge .box .list table thead tr th:last-of-type:before {
  left: auto;
  right: -5px;
}
#bridge.container .bridge .box .list table thead tr th.left {
  text-align: left;
}
#bridge.container .bridge .box .list table tbody {
  font-size: 14px;
  max-height: 342px;
}
#bridge.container .bridge .box .list table tbody tr {
  border-bottom: 1px solid #ebebeb;
  height: 59px;
}
#bridge.container .bridge .box .list table tbody tr td {
  text-align: center;
}
#bridge.container .bridge .box .list table tbody tr td span {
  display: inline-block;
  position: relative;
  word-break: break-word;
  color: #666666;
}
#bridge.container .bridge .box .list table tbody tr td:nth-child(1) span {
  font-weight: 500;
}
#bridge.container .bridge .box .list table tbody tr td:nth-child(1) span, #bridge.container .bridge .box .list table tbody tr td:nth-child(2) span {
  color: #2f2f2f;
}
#bridge.container .bridge .box .list table tbody tr td.left {
  text-align: left;
}
#bridge.container .bridge .box .list table th, #bridge.container .bridge .box .list table td {
  width: 16.6%;
}
#bridge.container .bridge .box .list table th:nth-child(1), #bridge.container .bridge .box .list table td:nth-child(1) {
  width: 165px;
}
#bridge.container .bridge .box .list table th:nth-child(1) span, #bridge.container .bridge .box .list table td:nth-child(1) span {
  padding: 12px 25px 12px 10px;
}
#bridge.container .bridge .box .list table th:nth-child(2), #bridge.container .bridge .box .list table td:nth-child(2) {
  width: 130px;
}
#bridge.container .bridge .box .list table th:nth-child(2) span, #bridge.container .bridge .box .list table td:nth-child(2) span {
  padding: 12px 25px 12px 0;
}
#bridge.container .bridge .box .list table th:nth-child(3), #bridge.container .bridge .box .list table td:nth-child(3) {
  width: 110px;
}
#bridge.container .bridge .box .list table th:nth-child(3) span, #bridge.container .bridge .box .list table td:nth-child(3) span {
  padding: 12px 25px 12px 0;
}
#bridge.container .bridge .box .list table th:nth-child(4), #bridge.container .bridge .box .list table td:nth-child(4) {
  width: 115px;
}
#bridge.container .bridge .box .list table th:nth-child(4) span, #bridge.container .bridge .box .list table td:nth-child(4) span {
  padding: 12px 25px 12px 0;
}
#bridge.container .bridge .box .list table th:nth-child(5), #bridge.container .bridge .box .list table td:nth-child(5) {
  width: 125px;
}
#bridge.container .bridge .box .list table th:nth-child(5) span, #bridge.container .bridge .box .list table td:nth-child(5) span {
  padding: 12px 25px 12px 0;
}
#bridge.container .bridge .box button.ui-btn {
  position: relative;
  display: inline-block;
  background-color: #fff;
  border: 1px solid #bbb;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  white-space: nowrap;
  text-align: center;
  overflow: hidden;
  color: #444;
  height: 38px;
  border-radius: 20px;
  padding: 0 18px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
#bridge.container .bridge .box button.ui-btn.primary {
  border: 0;
  background-color: #ec0047;
}
#bridge.container .bridge .box button.ui-btn.primary span {
  color: #fff;
  font-weight: 600;
}

body.dimmed {
  overflow: hidden;
}

.modal-dimmed {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.6);
  transition: all 250ms ease;
  opacity: 0;
}
.modal-dimmed.on {
  display: inline-block;
  opacity: 1;
}
.modal-dimmed.on .modal-container {
  opacity: 1;
  transform: translate(-50%, -50%);
}

.modal-container {
  position: absolute;
  top: 50%;
  left: 50%;
  opacity: 0.3;
  transform: translate(-50%, -80%);
  min-width: 200px;
  min-height: 200px;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.16), 0px 0px 0px 1px rgba(0, 0, 0, 0.16);
  transition: all 500ms ease;
}
.modal-container .modal {
  position: relative;
  background-color: #fff;
  width: 970px;
  height: 660px;
  z-index: 0;
}
.modal-container .modal .modal-close {
  cursor: pointer;
  position: absolute;
  top: 12px;
  right: 12px;
  width: 16px;
  height: 16px;
  background: no-repeat center url("https://dream-cdn.beusable.net/home/images/bridge/icon-close.svg");
  z-index: 100;
  transition: transform 250ms ease;
}
.modal-container .modal .modal-close:hover {
  transform: scale(1.5);
}
.modal-container .modal .modal-header {
  position: absolute;
  width: 100%;
  padding: 30px;
  box-sizing: border-box;
  font-size: 15px;
  font-weight: 500;
  color: #2F2F2F;
  background: linear-gradient(180deg, #FFF 69.77%, rgba(255, 255, 255, 0) 100%);
  z-index: 10;
}
.modal-container .modal .modal-body {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.modal-container .modal .modal-body .total-price-area {
  box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.16), 0px 0px 0px 1px rgba(0, 0, 0, 0.16);
  flex-shrink: 0;
  display: flex;
  padding: 25px 30px;
  min-height: 170px;
  box-sizing: border-box;
}
.modal-container .modal .modal-body .total-price-area .plan-name-wrap .plan-name {
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 10px;
}
.modal-container .modal .modal-body .total-price-area .plan-name-wrap .plan-name:lang(ja) {
  font-family: Osaka, Meiryo, MS PGothic, MS UI Gothic, sans-serif;
}
.modal-container .modal .modal-body .total-price-area .plan-name-wrap .plan-name::first-letter {
  text-transform: uppercase;
}
.modal-container .modal .modal-body .total-price-area .plan-name-wrap .plan-detail {
  color: #444;
  font-size: 13px;
  font-weight: 600;
}
.modal-container .modal .modal-body .total-price-area .plan-info-wrap {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.modal-container .modal .modal-body .total-price-area .plan-info-wrap .item {
  display: none;
  position: relative;
  align-items: center;
  justify-content: space-between;
  width: 369px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.15;
  color: #444;
  z-index: 1;
}
.modal-container .modal .modal-body .total-price-area .plan-info-wrap .item:before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  z-index: -1;
  width: 99%;
  height: 1px;
  background-image: linear-gradient(to right, transparent 50%, #979796 50%);
  background-size: 5px 1px;
}
.modal-container .modal .modal-body .total-price-area .plan-info-wrap .item span {
  background-color: #fff;
}
.modal-container .modal .modal-body .total-price-area .plan-info-wrap .item .frame {
  background-color: #fff;
}
.modal-container .modal .modal-body .total-price-area .plan-info-wrap .item.on {
  display: flex;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
  text-align: right;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap .total-price {
  font-size: 26px;
  font-weight: 600;
  margin-bottom: 10px;
  line-height: 1;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap .price-per-month {
  color: #444;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap .plan-apply-btn {
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  min-width: 124px;
  border-radius: 20px;
  background-color: #ec0047;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  color: #fff;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap .plan-apply-btn > a {
  width: 100%;
  text-align: center;
  padding: 12px 14px;
  color: #ffffff !important;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap .plan-apply-btn.disabled {
  pointer-events: none;
  filter: grayscale(1);
  opacity: 0.3;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap .plan-apply-btn .apply-btn {
  display: none;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap .plan-apply-btn .a.contact-us-bt {
  display: inline-block;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap .plan-apply-btn.apply .apply-btn {
  display: inline-block;
}
.modal-container .modal .modal-body .total-price-area .plan-total-wrap .plan-apply-btn.apply a.contact-us-btn {
  display: none;
}
.modal-container .modal .modal-body .step-by-price-area {
  flex-grow: 1;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 30px;
  margin-top: 45px;
}
.modal-container .modal .modal-body .step-by-price-area .step-wrap {
  padding: 20px 0;
  border-top: 1px dashed #D7D7D7;
}
.modal-container .modal .modal-body .step-by-price-area .step-wrap .step-title {
  position: relative;
  color: #2F2F2F;
  font-size: 15px;
  padding: 7px 0 8px;
}
.modal-container .modal .modal-body .step-by-price-area .step-wrap .step-title:lang(ko):before {
  font-family: Roboto;
  padding: 8px;
}
.modal-container .modal .modal-body .step-by-price-area .step-wrap .step-contents {
  display: flex;
  justify-content: center;
  gap: 20px;
  padding: 20px 0;
}
.modal-container .modal .modal-body .step-by-price-area .step-wrap:first-child {
  border: 0;
  padding-top: 0;
}
.modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  row-gap: 9px;
  column-gap: 80px;
  height: 60px;
  padding: 18px 0;
  font-size: 13px;
  max-width: 680px;
}
.modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item {
  position: relative;
  width: 300px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item:before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  z-index: -1;
  width: 99%;
  height: 1px;
  background-image: linear-gradient(to right, transparent 50%, #979796 50%);
  background-size: 5px 1px;
}
.modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item .label, .modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item .frame {
  background-color: #fff;
}
.modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item .label {
  padding-right: 5px;
}
.modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item .label i.icon {
  vertical-align: top;
  margin-left: 4px;
}
.modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item .frame {
  padding-left: 5px;
}
.modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item:lang(ja):nth-child(3), .modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item:lang(ja):nth-child(4), .modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item:lang(en):nth-child(3), .modal-container .modal .modal-body .step-by-price-area .selected-plan-info .plan-info-detail .item:lang(en):nth-child(4) {
  width: 400px;
}
.modal-container .modal .modal-body .referral {
  padding: 30px 0 6px;
  border-top: 1px dashed #D7D7D7;
  text-align: left;
}
.modal-container .modal .modal-body .referral button {
  border: 0;
  background-color: transparent;
}
.modal-container .modal .modal-body .referral .referral-title {
  display: flex;
  align-items: center;
  margin-bottom: 18px;
  gap: 6px;
  color: #2F2F2F;
  font-size: 15px;
  font-weight: 700;
}
.modal-container .modal .modal-body .referral .referral-title .icon-star-badge-folded {
  width: 30px;
  height: 30px;
  background-image: url("../../images/icon-star-badge-folded.svg");
}
.modal-container .modal .modal-body .referral .referral-title .referral-benefit {
  position: relative;
  margin-left: 23px;
  color: #777;
  font-size: 12px;
  font-weight: 400;
}
.modal-container .modal .modal-body .referral .referral-title .referral-benefit:before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -12px;
  width: 1px;
  height: 12px;
  background-color: #D7D7D7;
}
.modal-container .modal .modal-body .referral .referral-current {
  display: none;
  align-items: center;
  height: 28px;
  padding: 0px 8px 0px 10px;
  gap: 4px;
  color: #0E90A5;
  font-size: 12px;
  font-weight: 600;
  border-radius: 4px;
  border: 1px solid #BBB;
}
.modal-container .modal .modal-body .referral .referral-current-close {
  cursor: pointer;
  width: 14px;
  height: 14px;
  background-image: url("https://dream-cdn.beusable.net/home/images/icon-input-close.svg");
}
.modal-container .modal .modal-body .referral .referral-new .referral-code {
  display: flex;
  align-items: center;
  gap: 20px;
}
.modal-container .modal .modal-body .referral .referral-new .referral-code .ui-input {
  width: 287px;
}
.modal-container .modal .modal-body .referral .referral-new .referral-code .ui-input input {
  height: 44px;
  box-sizing: border-box;
}
.modal-container .modal .modal-body .referral .referral-new .referral-code .ui-input .close {
  top: 50%;
  transform: translateY(-50%);
}
.modal-container .modal .modal-body .referral .referral-new .referral-code .get-code-button {
  display: none;
  align-items: center;
  gap: 4px;
  color: #0E90A5;
  font-size: 13px;
  cursor: pointer;
}
.modal-container .modal .modal-body .referral .referral-new .referral-code .get-code-button:disabled {
  pointer-events: none;
  opacity: 0.2;
}
.modal-container .modal .modal-body .referral .referral-new .referral-code .get-code-button .icon--arrow-left-blue {
  width: 16px;
  height: 16px;
  background-image: url("../../images/icon--arrow-left-blue.svg");
}
.modal-container .modal .modal-body .referral .referral-new .referral-term {
  display: none;
  position: relative;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-checkbox {
  display: flex;
  align-items: center;
  margin-top: 32px;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-checkbox .ui_checkbox {
  margin: 0;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-checkbox .term-title {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 400;
  margin-left: 5px;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-checkbox .term-title .link {
  text-decoration: underline;
  color: #2F2F2F;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-checkbox .term-title .necessary {
  margin-left: 3px;
  color: #EC0047;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-checkbox .term-toggle {
  display: flex;
  margin-left: 8px;
  padding: 0;
  cursor: pointer;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-checkbox .term-toggle .icon--arrow-dropdown {
  width: 16px;
  height: 16px;
  background-image: url("../../images/icon--arrow-dropdown.svg");
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-checkbox .term-toggle.opened .icon--arrow-dropdown {
  transform: rotate(180deg);
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-checkbox .term-error {
  display: none;
  margin-left: 24px;
  color: #E60724;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term-list {
  display: none;
  flex-direction: column;
  gap: 4px;
  padding: 20px 20px 20px 30px;
  margin-top: 12px;
  border-radius: 5px;
  border: 1px solid #d7d7d7;
  background-color: #f4f4f4;
  box-sizing: border-box;
  color: #444;
  font-size: 12px;
  line-height: 1.5;
  list-style-type: disc;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term.opened .referral-term-checkbox .term-toggle {
  transform: rotate(180deg);
}
.modal-container .modal .modal-body .referral .referral-new .referral-term.opened .referral-term-list {
  display: flex;
}
.modal-container .modal .modal-body .referral .referral-new .referral-term.error .referral-term-checkbox .term-error {
  display: block;
}
.modal-container .modal.heatmap .step_3:not(.ko) .left {
  pointer-events: none;
  opacity: 0.3;
}
.modal-container .modal.journeymap .step_2:not(.ko) .left {
  pointer-events: none;
  opacity: 0.3;
}
.modal-container .modal .content-card {
  position: relative;
  width: 50%;
  flex-grow: 1;
  padding: 24px;
  border: 1px solid #AFAFAF;
  border-radius: 8px;
  color: #2F2F2F;
  min-height: 130px;
  box-sizing: border-box;
}
.modal-container .modal .content-card .content-card-title {
  display: inline-block;
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
  width: 90%;
  word-wrap: break-word;
  position: relative;
}
.modal-container .modal .content-card .content-card-detail {
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 18px;
}
.modal-container .modal .content-card .content-card-detail .item {
  display: flex;
  align-items: center;
  gap: 5px;
}
.modal-container .modal .content-card .content-card-detail .item span {
  line-height: 1;
}
.modal-container .modal .content-card .content-card-detail .item.coming-soon {
  color: #BBBBBB;
}
.modal-container .modal .content-card .content-card-detail .item span.sub-info {
  color: #767676;
}
.modal-container .modal .content-card .content-card-detail .item .label-btn {
  color: #BBB;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: sans-serif;
  font-size: 7px;
  line-height: 7px;
  border: 1px solid #BBBBBB;
  border-radius: 4px;
  padding: 3px 5px 2px;
  letter-spacing: 0.1px;
}
.modal-container .modal .content-card .content-card-detail .item .link-icon {
  cursor: pointer;
  position: relative;
  display: inline-block;
  width: 15px;
  height: 15px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-info.svg") no-repeat center center;
  background-size: cover;
}
.modal-container .modal .content-card .content-card-detail .item .link-icon .link_tooltip {
  display: none;
  position: absolute;
  width: 295px;
  padding: 16px 20px;
  margin-top: 8px;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 8px;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  line-height: 1.5;
  word-wrap: break-word;
  box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.16);
  z-index: 9999;
}
.modal-container .modal .content-card .content-card-detail .item .link-icon .link_tooltip a {
  position: relative;
  display: block;
  margin-top: 10px;
  color: #0074FF;
}
.modal-container .modal .content-card .content-card-detail .item .link-icon .link_tooltip a:after {
  content: url(../../images/icon-link-blue.svg);
  vertical-align: sub;
}
.modal-container .modal .content-card .content-card-detail .item .link-icon .link_tooltip:after {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  background-color: #fff;
  transform: translate(-50%, -50%) rotate(45deg);
  top: -1px;
  left: 50%;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-right: 0;
  border-bottom: 0;
  box-sizing: border-box;
}
.modal-container .modal .content-card .content-card-detail .item .link-icon .link_tooltip:lang(en) {
  transform: translateX(-70%);
}
.modal-container .modal .content-card .content-card-detail .item .link-icon .link_tooltip:lang(en):after {
  left: 70%;
}
.modal-container .modal .content-card.selected {
  border-color: #4497F7;
  box-shadow: 0px 0px 0px 1px #4497F7 inset, 0px 11px 17px -3px rgba(0, 0, 0, 0.16);
}
.modal-container .modal .content-card.selected .content-card-check {
  position: absolute;
  top: 24px;
  right: 24px;
  width: 20px;
  height: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-check-green.svg") no-repeat center center;
  background-size: cover;
}
.modal-container .modal .content-card.disabled {
  pointer-events: none;
  opacity: 0.3;
}
.modal-container .modal .selected-plan-title {
  font-size: 15px;
  color: #2f2f2f;
  font-weight: 500;
  margin-bottom: 30px;
}
.modal-container .modal .selected-plan-info {
  width: 100%;
  margin-bottom: 40px;
  border-color: #4497F7;
  box-shadow: 0px 0px 0px 1px #4497F7 inset, 0px 11px 17px -3px rgba(0, 0, 0, 0.16);
}
.modal-container .modal .selected-plan-info .content-card-check {
  position: absolute;
  top: 24px;
  right: 24px;
  width: 20px;
  height: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-check-green.svg") no-repeat center center;
  background-size: cover;
}
.modal-container .modal .custom-plan-insert-wrapper {
  display: none;
  color: #2f2f2f;
  margin-bottom: 27px;
}
.modal-container .modal .custom-plan-insert-wrapper .guideText {
  font-size: 15px;
  font-weight: 500;
  margin-bottom: 30px;
}
.modal-container .modal .custom-plan-insert-wrapper .insert-wrapper {
  display: flex;
  gap: 24px;
}
.modal-container .modal .custom-plan-insert-wrapper .insert-wrapper .insert-item {
  flex-grow: 1;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal-container .modal .custom-plan-insert-wrapper .insert-wrapper .insert-item .label {
  width: 153px;
  flex-shrink: 0;
  font-size: 24px;
  font-weight: 700;
}
.modal-container .modal .custom-plan-insert-wrapper .insert-wrapper .insert-item .input-wrap {
  flex-grow: 1;
  position: relative;
  max-width: 290px;
  border-radius: 8px;
  border: 1px solid #AFAFAF;
  background-color: #FFF;
  padding: 14px;
  color: #666 !important;
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
  display: flex;
  align-items: center;
  gap: 5px;
}
.modal-container .modal .custom-plan-insert-wrapper .insert-wrapper .insert-item .input-wrap input {
  width: 100%;
  border: 0;
  outline: 0;
  padding: 0;
  text-align: right;
  font: inherit;
  color: #666;
  flex-grow: 1;
}
.modal-container .modal .custom-plan-insert-wrapper .insert-wrapper .insert-item .input-wrap:after {
  content: attr(unit);
  flex-shrink: 0;
  font: inherit;
  line-height: 1.2;
}
.modal-container .modal .custom-plan-insert-wrapper .insert-wrapper .insert-item .input-wrap.selected input, .modal-container .modal .custom-plan-insert-wrapper .insert-wrapper .insert-item .input-wrap.selected:after {
  color: #016CEE;
}
.modal-container .modal .custom-plan-insert-wrapper .insert-wrapper .insert-item .input-wrap.error {
  position: relative;
}
.modal-container .modal .custom-plan-insert-wrapper .insert-wrapper .insert-item .input-wrap.error .errorMsg {
  position: absolute;
  top: 100%;
  left: 0;
  padding: 5px;
  color: red;
  font-size: 13px;
}
.modal-container .modal .cx-report-select-wrapper {
  display: none;
  padding: 20px 0;
  border-top: 1px dashed #D7D7D7;
}
.modal-container .modal .cx-report-select-wrapper .cx-report-select-title {
  color: #2F2F2F;
  font-size: 15px;
  padding: 7px 0 8px;
}
.modal-container .modal .cx-report-select-wrapper .cx-report-select-title:lang(ko):before {
  font-family: Roboto;
  padding: 8px;
}
.modal-container .modal .cx-report-select-wrapper .cx-report-select {
  display: flex;
  justify-content: center;
  gap: 20px;
  padding: 20px 0;
}
.modal-container .modal.custom .custom-plan-insert-wrapper {
  display: block;
}
.modal-container .modal.agency150 .cx-report-select-wrapper {
  display: block;
}
.modal-container .modal.agency150 .price-per-month > span {
  display: none;
}

.icon-ai {
  display: inline-block;
  width: 25px;
  height: 15px;
  background: url("../../images/icon-ai.svg") no-repeat center center;
}

#aiday.container {
  position: relative;
  padding: 134px 30px 350px 30px;
  background: black;
  background-image: url(https://dream-cdn.beusable.net/home/thday/aiday_bg.jpg);
  background-repeat: no-repeat;
  background-size: contain;
  font-family: "Pretendard Variable", Pretendard;
  box-sizing: border-box;
}
#aiday.container.review-page {
  padding-bottom: 144px;
}
#aiday.container .aiday {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: white;
}
#aiday.container .aiday__navigation.mobile {
  display: none;
}
#aiday.container .aiday__navigation.pc .navigation-button {
  position: fixed;
  top: 50%;
  opacity: 0.62;
}
#aiday.container .aiday__navigation.pc .navigation-button img {
  width: 60px;
  height: 60px;
}
#aiday.container .aiday__navigation.pc .navigation-button.left {
  left: 0;
  transform: translateY(-50%);
}
#aiday.container .aiday__navigation.pc .navigation-button.right {
  right: 0;
  rotate: 180deg;
  transform: translateY(50%);
}
#aiday.container .aiday__navigation.pc .navigation-button:hover {
  opacity: 1;
}
#aiday.container .aiday__navigation.pc .navigation-button.disable {
  opacity: 0.25;
  cursor: default;
}
#aiday.container .aiday__image {
  max-width: 1164px;
  width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
}
#aiday.container .aiday__image img {
  width: 100%;
}
#aiday.container .aiday__title {
  padding-bottom: 83px;
  font-weight: 700;
  font-size: clamp(60px, 16vw, 216px);
  line-height: 0.85;
}
#aiday.container .aiday__intro {
  padding-bottom: 50px;
  font-size: 80px;
  font-weight: 700;
  line-height: 1.2;
  color: #ffd600;
}
#aiday.container .aiday__description {
  padding-bottom: 50px;
  font-size: 28px;
  font-weight: 600;
  line-height: 1.5;
}
#aiday.container .aiday__date {
  font-size: 38px;
  font-weight: 600;
  line-height: 1.5;
}
#aiday.container .aiday__guide {
  padding-bottom: 48px;
  font-size: 28px;
  font-weight: 600;
  line-height: 1;
}
#aiday.container .aiday .main-wrapper {
  width: 1000px;
}
#aiday.container .aiday__image2 {
  max-width: 956px;
  width: 100%;
  padding: 0 20px;
  box-sizing: border-box;
}
#aiday.container .aiday__image2 img {
  width: 100%;
}
#aiday.container .aiday__title2 {
  padding-bottom: 95px;
  font-weight: 700;
  font-size: 178px;
  line-height: 0.85;
}
#aiday.container .aiday__intro2 {
  padding-bottom: 70px;
  font-size: 62px;
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
}
#aiday.container .aiday__descriptions {
  display: flex;
  flex-direction: column;
  gap: 50px;
  padding-bottom: 120px;
}
#aiday.container .aiday__descriptions-item {
  display: flex;
  flex-direction: column;
  text-align: start;
  gap: 16px;
}
#aiday.container .aiday__descriptions-item-title {
  color: #ffd600;
  font-size: 36px;
  font-weight: 500;
  line-height: 120%;
}
#aiday.container .aiday__descriptions-item-content {
  color: #fff;
  font-size: 22px;
  line-height: 150%;
}
#aiday.container .aiday__schedule {
  display: flex;
  gap: 100px;
  margin-bottom: 120px;
}
#aiday.container .aiday__schedule-section {
  display: flex;
  flex-direction: column;
  gap: 22px;
  text-align: start;
}
#aiday.container .aiday__schedule-section-title {
  display: flex;
  align-items: center;
  font-size: 42px;
  font-weight: 700;
  color: #c9c195;
  line-height: 1.5;
}
#aiday.container .aiday__schedule-section-title .small-text {
  padding-left: 10px;
  font-size: 36px;
}
#aiday.container .aiday__schedule-section-list {
  max-width: 580px;
}
#aiday.container .aiday__schedule-section-list li {
  display: flex;
  gap: 30px;
  color: #ffd600;
  font-size: 32px;
  font-weight: 700;
  align-items: center;
}
#aiday.container .aiday__schedule-section-list li:not(:last-child) {
  margin-bottom: 22px;
}
#aiday.container .aiday__schedule-section-list li span {
  color: #c9c195;
  font-size: 28px;
  font-weight: 500;
}
#aiday.container .aiday__closing {
  padding-bottom: 40px;
  font-size: 26px;
  font-weight: 500;
  line-height: 150%;
}
#aiday.container .aiday__locationBtn {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 15px 16px 15px 30px;
  margin-bottom: 40px;
  background: #803bff;
  border-radius: 40px;
}
#aiday.container .aiday__locationBtn-text {
  font-size: 19px;
  font-weight: 700;
  color: white;
  vertical-align: middle;
}
#aiday.container .aiday__review {
  max-width: 1140px;
}
#aiday.container .aiday__review-description {
  max-width: 1000px;
  font-size: 36px;
  font-weight: 500;
  line-height: 150%;
  margin: 0 auto 88px auto;
}
#aiday.container .aiday__review-content {
  display: flex;
  flex-direction: column;
  gap: 100px;
  padding-bottom: 100px;
  border-bottom: 3px solid #3B3B3B;
}
#aiday.container .aiday__review-content .content-item {
  display: flex;
  align-items: center;
  gap: 120px;
}
#aiday.container .aiday__review-content .content-item-img {
  flex: none;
  width: 372px;
  height: 372px;
  border-radius: 20px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/aiday_pic1.jpg");
  background-size: cover;
}
#aiday.container .aiday__review-content .content-item-img.pic1 {
  background-image: url("https://dream-cdn.beusable.net/home/thday/aiday_pic1.jpg");
}
#aiday.container .aiday__review-content .content-item-img.pic2 {
  background-image: url("https://dream-cdn.beusable.net/home/thday/aiday_pic2.jpg");
}
#aiday.container .aiday__review-content .content-item-img.pic3 {
  background-image: url("https://dream-cdn.beusable.net/home/thday/aiday_pic3.jpg");
}
#aiday.container .aiday__review-content .content-item-img.pic4 {
  background-image: url("https://dream-cdn.beusable.net/home/thday/aiday_pic4.jpg");
}
#aiday.container .aiday__review-content .content-item-text {
  font-size: 32px;
  font-weight: 500;
  line-height: 150%;
  text-align: start;
}
#aiday.container .aiday__review-content .content-item-text .highlight {
  color: #FFD600;
}
#aiday.container .aiday__review-closing {
  max-width: 1050px;
  padding: 80px 0 44px 0;
  font-size: 32px;
  font-weight: 500;
  line-height: 150%;
}
#aiday.container .aiday__review-banner {
  display: flex;
  justify-content: space-between;
  align-items: end;
  position: relative;
  width: 100%;
  padding: 26px 50px 25px 30px;
  border-radius: 10px;
  background-color: #E2BD00;
  background-image: url("https://dream-cdn.beusable.net/home/thday/banner_bg.png");
  background-repeat: no-repeat;
  background-position-x: right;
  background-position-y: bottom;
  box-sizing: border-box;
}
#aiday.container .aiday__review-banner .beusable-logo {
  position: absolute;
  width: 140px;
  top: 28px;
  left: 30px;
}
#aiday.container .aiday__review-banner-text {
  max-width: 790px;
  padding-bottom: 11px;
  font-size: 32px;
  font-weight: 600;
  line-height: 120%;
  text-align: start;
  color: #0D1E48;
}
#aiday.container .aiday__review-banner-text .highlight {
  color: #EC0047;
}
#aiday.container .aiday__review-banner-icon {
  width: 119px;
}
#aiday.container .aiday__logo {
  width: 180px;
}

@media (max-width: 1620px) {
  #aiday.container {
    padding-bottom: 233px;
  }
  #aiday.container .aiday__image {
    padding: 0 20px;
  }
  #aiday.container .aiday__title {
    padding-bottom: 66px;
  }
  #aiday.container .aiday .main-wrapper {
    width: 928px;
  }
  #aiday.container .aiday__title2 {
    font-size: 165px;
  }
  #aiday.container .aiday__intro2 {
    font-size: 57px;
  }
  #aiday.container .aiday__schedule {
    flex-direction: column;
  }
  #aiday.container .aiday__review-content .content-item-img {
    border-radius: 16px;
  }
}
@media (max-width: 1023px) {
  #aiday.container {
    padding: 50px 30px 195px 30px;
  }
  #aiday.container .aiday__buttons {
    top: 10px;
  }
  #aiday.container .aiday__title {
    padding-bottom: 50px;
  }
  #aiday.container .aiday__intro {
    padding-bottom: 40px;
    font-size: 50px;
  }
  #aiday.container .aiday__description {
    max-width: 440px;
    padding-bottom: 40px;
    font-size: 22px;
  }
  #aiday.container .aiday__date {
    font-size: 30px;
  }
  #aiday.container .aiday__guide {
    padding-bottom: 40px;
    font-size: 22px;
  }
  #aiday.container .aiday .main-wrapper {
    width: 662px;
  }
  #aiday.container .aiday__title2 {
    font-size: 118px;
    padding-bottom: 63px;
  }
  #aiday.container .aiday__intro2 {
    font-size: 41px;
    padding-bottom: 50px;
  }
  #aiday.container .aiday__descriptions {
    gap: 40px;
    padding-bottom: 100px;
  }
  #aiday.container .aiday__schedule {
    gap: 70px;
    margin-bottom: 100px;
  }
  #aiday.container .aiday__schedule-section {
    gap: 20px;
  }
  #aiday.container .aiday__schedule-section-title {
    font-size: 38px;
  }
  #aiday.container .aiday__schedule-section-title .small-text {
    padding-left: 7px;
    font-size: 34px;
  }
  #aiday.container .aiday__schedule-section-list {
    max-width: 500px;
  }
  #aiday.container .aiday__schedule-section-list li {
    gap: 20px;
    font-size: 28px;
  }
  #aiday.container .aiday__schedule-section-list li:not(:last-child) {
    margin-bottom: 25px;
  }
  #aiday.container .aiday__schedule-section-list li span {
    font-size: 26px;
  }
  #aiday.container .aiday__closing {
    font-size: 24px;
  }
  #aiday.container .aiday__logo {
    width: 150px;
  }
  #aiday.container .aiday__review {
    max-width: 662px;
  }
  #aiday.container .aiday__review-description {
    max-width: 100%;
    font-size: 34px;
    margin-bottom: 96px;
  }
  #aiday.container .aiday__review-content {
    gap: 88px;
    padding-bottom: 88px;
  }
  #aiday.container .aiday__review-content .content-item {
    gap: 44px;
  }
  #aiday.container .aiday__review-content .content-item-img {
    width: 200px;
    height: 200px;
    border-radius: 12px;
  }
  #aiday.container .aiday__review-content .content-item-text {
    font-size: 28px;
  }
  #aiday.container .aiday__review-closing {
    max-width: 620px;
    padding: 68px 0 40px 0;
    font-size: 28px;
  }
  #aiday.container .aiday__review-banner {
    padding: 73px 50px 36px 30px;
    border-radius: 10px;
  }
  #aiday.container .aiday__review-banner-text {
    max-width: 380px;
    padding-bottom: 2px;
    font-size: 28px;
  }
  #aiday.container .aiday__review-banner-icon {
    width: 119px;
  }
}
@media (max-width: 743px) {
  #aiday.container {
    min-height: calc(100dvh - 58px);
    padding: 50px 40px 100px 40px;
  }
  #aiday.container.review-page {
    padding-bottom: 36px;
  }
  #aiday.container .aiday__navigation.pc {
    display: none;
  }
  #aiday.container .aiday__navigation.mobile {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 5px;
  }
  #aiday.container .aiday__navigation.mobile .navigation-button {
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 100%;
    background: white;
    cursor: pointer;
  }
  #aiday.container .aiday__navigation.mobile .navigation-button.right {
    rotate: 180deg;
  }
  #aiday.container .aiday__navigation.mobile .navigation-button.disable {
    opacity: 0.3;
    cursor: default;
  }
  #aiday.container .aiday__image {
    padding: 0 15px;
  }
  #aiday.container .aiday__title {
    font-size: clamp(55px, 14vw, 216px);
  }
  #aiday.container .aiday__intro {
    padding-bottom: 30px;
    font-size: 30px;
  }
  #aiday.container .aiday__description {
    max-width: 300px;
    padding-bottom: 30px;
    font-size: 16px;
  }
  #aiday.container .aiday__date {
    font-size: 22px;
  }
  #aiday.container .aiday__guide {
    padding-bottom: 15px;
    font-size: 16px;
  }
  #aiday.container .aiday .main-wrapper {
    width: 100%;
  }
  #aiday.container .aiday__title2 {
    font-size: clamp(58px, 14vw, 118px);
  }
  #aiday.container .aiday__intro2 {
    font-size: clamp(21px, 5.6vw, 41px);
  }
  #aiday.container .aiday__descriptions {
    gap: 30px;
    padding-bottom: 70px;
  }
  #aiday.container .aiday__descriptions-item-title {
    font-size: 32px;
  }
  #aiday.container .aiday__descriptions-item-content {
    font-size: 20px;
  }
  #aiday.container .aiday__schedule {
    gap: 50px;
    margin-bottom: 70px;
  }
  #aiday.container .aiday__schedule-section {
    gap: 16px;
  }
  #aiday.container .aiday__schedule-section-title {
    font-size: 24px;
  }
  #aiday.container .aiday__schedule-section-title .small-text {
    padding-left: 5px;
    font-size: 24px;
  }
  #aiday.container .aiday__schedule-section-list {
    max-width: 500px;
  }
  #aiday.container .aiday__schedule-section-list li {
    font-size: 22px;
  }
  #aiday.container .aiday__schedule-section-list li:not(:last-child) {
    margin-bottom: 16px;
  }
  #aiday.container .aiday__schedule-section-list li span {
    font-size: 22px;
  }
  #aiday.container .aiday__closing {
    font-size: 20px;
  }
  #aiday.container .aiday__logo {
    width: 132px;
  }
  #aiday.container .aiday__review {
    width: 100%;
  }
  #aiday.container .aiday__review-description {
    font-size: 24px;
    margin: 0 auto 60px auto;
  }
  #aiday.container .aiday__review-content {
    gap: 60px;
    padding-bottom: 60px;
  }
  #aiday.container .aiday__review-content .content-item {
    flex-direction: column;
    justify-content: center;
    gap: 28px;
  }
  #aiday.container .aiday__review-content .content-item.reverse {
    flex-direction: column-reverse;
  }
  #aiday.container .aiday__review-content .content-item-img {
    width: 100%;
    height: 335px;
    border-radius: 20px;
    background-position-y: 65%;
  }
  #aiday.container .aiday__review-content .content-item-text {
    font-size: 22px;
    text-align: center;
  }
  #aiday.container .aiday__review-closing {
    max-width: 625px;
    padding: 52px 0 36px 0;
    font-size: 22px;
  }
  #aiday.container .aiday__review-banner {
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: center;
    padding: 63px 30px 23px 30px;
    gap: 32px;
  }
  #aiday.container .aiday__review-banner .beusable-logo {
    width: 120px;
    top: 26px;
    left: 50%;
    transform: translateX(-50%);
  }
  #aiday.container .aiday__review-banner-text {
    max-width: 100%;
    padding: 0;
    font-size: 22px;
    text-align: center;
  }
  #aiday.container .aiday__review-banner-icon {
    width: 140px;
  }
}
@media (max-width: 430px) {
  #aiday.container {
    padding: 50px 20px 100px 20px;
  }
  #aiday.container .aiday__title2 {
    padding-bottom: 37px;
  }
  #aiday.container .aiday__intro2 {
    padding-bottom: 40px;
  }
  #aiday.container .aiday__schedule {
    margin-top: 35px;
    margin-bottom: 70px;
  }
  #aiday.container .aiday__review-banner {
    gap: 27px;
  }
  #aiday.container .aiday__review-banner-text {
    max-width: 310px;
  }
  #aiday.container .aiday__review-banner-icon {
    width: 104px;
  }
}
:lang(ja) {
  font-family: "Pretendard JP Variable", "Pretendard JP", "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
}

#cxdata-index.container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  width: 100%;
  min-width: 1280px;
  background-color: #fff;
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  color: #2f2f2f;
}
#cxdata-index.container .section-body-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  background-color: #fff;
  border-radius: 8px;
  padding: 12px;
}
#cxdata-index.container .section-body-loading .icon--loading-animated {
  display: inline-block;
  width: 50px;
  height: 50px;
  background-image: url("../../images/icon-loading-animated.svg");
}
#cxdata-index.container .icon-red-arrow-down {
  display: inline-block;
  width: 13px;
  height: 13px;
  background-image: url("../../images/icon-red-arrow-down.svg");
}
#cxdata-index.container .cxdata-info-wrapper {
  color: #2f2f2f;
  width: 1600px;
  position: relative;
  display: flex;
  align-items: center;
  gap: 97px;
  min-height: 943px;
  padding: 118px 0;
  box-sizing: border-box;
  margin-bottom: 142px;
  background-image: url("../../images/cxdata-bg.png");
  background-repeat: no-repeat;
  background-size: 856px 687px;
  background-position: 0 25%;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-info {
  position: absolute;
  top: 118px;
  right: 180px;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-title {
  margin-bottom: 97px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 16px;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-title .cxdata-title--desc {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  font-weight: 700;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-title .cxdata-title--desc .date {
  color: #EC0047;
  text-align: right;
  font-size: 28px;
  font-weight: 700;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-title .cxdata-title--desc .sub-title {
  color: #EC0047;
  text-align: right;
  font-size: 16px;
  font-weight: 500;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-title .title {
  max-width: 502px;
  color: #EC0047;
  text-align: right;
  font-size: 104px;
  font-weight: 700;
  line-height: 94%; /* 97.76px */
  letter-spacing: 2.08px;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-data {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-data .data {
  display: flex;
  align-items: center;
  gap: 23px;
  text-align: right;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-data .data .data-title {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 16px;
  font-weight: 600;
  color: #ec0047;
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-data .data .data-title .annotation {
  color: #666;
  font-size: 12px;
  font-weight: 500;
  line-height: 150%; /* 19.5px */
}
#cxdata-index.container .cxdata-info-wrapper .cxdata-data .data h3 {
  color: #2f2f2f;
  font-size: 72px;
  font-weight: 700;
}
#cxdata-index.container .dropdown-container {
  display: flex;
  align-items: center;
  gap: 8px;
  z-index: 10;
}
#cxdata-index.container .dropdown-container.visitPage, #cxdata-index.container .dropdown-container.sequence, #cxdata-index.container .dropdown-container.rollback-refresh, #cxdata-index.container .dropdown-container.new-return {
  width: 100%;
}
#cxdata-index.container .dropdown-container.new-return {
  margin-top: -24px;
}
#cxdata-index.container .dropdown-container.heatmap {
  margin-left: 2px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown-label {
  color: #777;
  font-size: 13px;
  font-weight: 600;
  line-height: 120%; /* 15.6px */
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown {
  position: relative;
  display: inline-block;
  min-width: 108px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown.category1, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown.category2 {
  min-width: 179px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown.category1.en, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown.category2.en {
  min-width: 190px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropbtn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  border-radius: 5px;
  border: none;
  background: #FFF;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
  font-weight: 400;
  padding: 9px 9px 9px 12px;
  text-align: left;
  color: #2f2f2f;
  font-size: 14px;
  cursor: pointer;
  position: relative;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content {
  display: none;
  width: 100%;
  font-weight: 400;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 0;
  z-index: 2;
  text-align: left;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content div {
  color: #2F2F2F;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.3s;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content div.period.all.active {
  color: #888;
  font-weight: 600;
  cursor: initial;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content div.period.all:hover:not(.active) {
  background-color: #EBEBEB;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content div:hover:not(.mpti):not(.pvTime):not(.devicePv):not(.month-list):not(.visitPage):not(.averageStay):not(.rollbackRefresh):not(.newReturn):not(.sequence) {
  background-color: #EBEBEB;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content div.dropdown-item {
  overflow-wrap: break-word;
  word-wrap: break-word;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content div.dropdown-item:first-child {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content div.dropdown-item:last-child {
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content div.dropdown-item.active {
  color: #888;
  font-weight: 600;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content div.dropdown-item.active:hover {
  background-color: transparent;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.mpti .dropdown-item {
  padding: 12px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.mpti .dropdown-item:hover {
  background-color: #ebebeb;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item.category1, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item.category2, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item.category1, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item.category2, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item.category1, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item.category2, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item.category1, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item.category2, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item.category1, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item.category2, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item.category1, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item.category2, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item.category1, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item.category2 {
  padding: 12px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item.category1:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item.category2:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item.category1:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item.category2:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item.category1:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item.category2:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item.category1:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item.category2:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item.category1:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item.category2:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item.category1:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item.category2:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item.category1:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item.category2:hover:not(.active) {
  background-color: #ebebeb;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item.all, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item.all, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item.all, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item.all, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item.all, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item.all, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item.all {
  padding: 12px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item .year, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item .year, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item .year, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item .year, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item .year, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item .year, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item .year {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item .year .icon-right-arrow, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item .year .icon-right-arrow, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item .year .icon-right-arrow, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item .year .icon-right-arrow, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item .year .icon-right-arrow, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item .year .icon-right-arrow, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item .year .icon-right-arrow {
  display: inline-block;
  width: 12px;
  height: 12px;
  background-image: url("../../images/icon-right-arrow-fill.svg");
  background-repeat: no-repeat;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item .year.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item .year.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item .year.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item .year.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item .year.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item .year.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item .year.lastIndex {
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item .month-list, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item .month-list, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item .month-list, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item .month-list, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item .month-list, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item .month-list, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item .month-list {
  display: flex;
  padding: 0;
  flex-direction: column;
  color: #2F2F2F;
  width: 100%;
  font-weight: 400;
  background-color: #fcfcfc;
  border-radius: 5px;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 100%;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item .month-list .month-label, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item .month-list .month-label, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item .month-list .month-label, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item .month-list .month-label, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item .month-list .month-label, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item .month-list .month-label, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item .month-list .month-label {
  color: #2F2F2F;
  font-size: 14px;
  padding: 12px;
  cursor: pointer;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item .month-list .month-label.active, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item .month-list .month-label.active, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item .month-list .month-label.active, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item .month-list .month-label.active, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item .month-list .month-label.active, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item .month-list .month-label.active, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item .month-list .month-label.active {
  color: #888;
  font-weight: 600;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item .month-list .month-label:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item .month-list .month-label:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item .month-list .month-label:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item .month-list .month-label:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item .month-list .month-label:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item .month-list .month-label:hover:not(.active), #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item .month-list .month-label:hover:not(.active) {
  background-color: #EBEBEB;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item .month-list .month-label.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item .month-list .month-label.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item .month-list .month-label.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item .month-list .month-label.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item .month-list .month-label.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item .month-list .month-label.lastIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item .month-list .month-label.lastIndex {
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.pvTime .dropdown-item .month-list .month-label.firstIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.devicePv .dropdown-item .month-list .month-label.firstIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.visitPage .dropdown-item .month-list .month-label.firstIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.averageStay .dropdown-item .month-list .month-label.firstIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.rollbackRefresh .dropdown-item .month-list .month-label.firstIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.newReturn .dropdown-item .month-list .month-label.firstIndex, #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.sequence .dropdown-item .month-list .month-label.firstIndex {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
#cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content.show {
  display: block;
}
#cxdata-index.container .cxdata-pv-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  box-sizing: border-box;
  margin-bottom: 360px;
  max-width: 1180px;
  position: relative;
}
#cxdata-index.container .cxdata-pv-wrapper .icon-wrap {
  position: absolute;
  display: inline-block;
  width: 80px;
  height: 80px;
  cursor: pointer;
}
#cxdata-index.container .cxdata-pv-wrapper .icon-wrap.right {
  top: 62%;
  right: -5%;
  transform: translateY(-50%);
  transition: all 0.3s;
}
#cxdata-index.container .cxdata-pv-wrapper .icon-wrap.right:hover .icon.icon-right-arrow:not(.dimmed) {
  background-image: url("../../images/icon-right-arrow-hover.svg");
}
#cxdata-index.container .cxdata-pv-wrapper .icon-wrap.left {
  top: 62%;
  left: -5%;
  transform: translateY(-50%);
  transition: all 0.3s;
}
#cxdata-index.container .cxdata-pv-wrapper .icon-wrap.left:hover .icon.icon-left-arrow:not(.dimmed) {
  background-image: url("../../images/icon-right-arrow-hover.svg");
}
#cxdata-index.container .cxdata-pv-wrapper .icon-wrap .icon.icon-right-arrow {
  display: inline-block;
  width: 80px;
  height: 80px;
  background-image: url("../../images/icon-right-arrow.svg");
}
#cxdata-index.container .cxdata-pv-wrapper .icon-wrap .icon.icon-right-arrow.dimmed {
  background-image: url("../../images/icon-right-arrow-disabled.svg");
}
#cxdata-index.container .cxdata-pv-wrapper .icon-wrap .icon.icon-left-arrow {
  display: inline-block;
  width: 80px;
  height: 80px;
  background-image: url("../../images/icon-right-arrow.svg");
  transform: scale(-1);
}
#cxdata-index.container .cxdata-pv-wrapper .icon-wrap .icon.icon-left-arrow.dimmed {
  background-image: url("../../images/icon-right-arrow-disabled.svg");
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-pv-text-wrapper {
  max-width: 1180px;
  width: 100%;
  text-align: left;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-pv-text-wrapper .cxdata-pv-title-wrapper .cxdata-pv-title {
  color: #ec0047;
  font-size: 36px;
  font-weight: 600;
  line-height: 120%; /* 45.6px */
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 36px;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap {
  width: 1180px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-desc {
  font-size: 20px;
  font-weight: 600;
  line-height: 150%; /* 33px */
  color: #444;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date {
  display: flex;
  flex-direction: column;
  color: #2f2f2f;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date .cxdata-label {
  margin-left: 4px;
  font-size: 14px;
  font-weight: 600;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date .date-wrap {
  display: flex;
  align-items: center;
  gap: 4px;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date .date-wrap .date {
  font-size: 68px;
  font-weight: 700;
  display: flex;
  align-items: flex-end;
  gap: 5px;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date .date-wrap .date .daytime {
  font-size: 30px;
  margin-bottom: 10px;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date .date-wrap .wave {
  font-size: 68px;
  font-weight: 700;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .dropdown-container {
  width: 1180px;
  justify-content: flex-start;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .dropdown-container .dropdown.category1, #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .dropdown-container .dropdown.category2 {
  min-width: 179px;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .dropdown-container .dropdown.category1.en, #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .dropdown-container .dropdown.category2.en {
  min-width: 190px;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] {
  display: flex;
  align-items: center;
  width: 1500px;
  flex-shrink: 0;
  flex-direction: column;
  position: relative;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .graph-loading {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.5);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .chart-title-wrap {
  width: 1180px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 28px;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .chart-title-wrap .chart-title {
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .chart-title-wrap .chart-rate-desc {
  position: absolute;
  right: 0px;
  color: #999;
  text-align: right;
  font-size: 13px;
  font-weight: 400;
  line-height: 150%; /* 19.5px */
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .no-data-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1240px;
  height: calc(100% - 76px);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .no-data-wrap .none-data {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 16px;
  border-radius: 8px;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.16);
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.16);
  color: #E60724;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .no-data-wrap .none-data .icon-warning {
  display: inline-block;
  width: 13px;
  height: 13px;
  background-image: url("../../images/icon-warning.svg");
  background-repeat: no-repeat;
}
#cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .graph {
  width: 1500px;
  height: 570px;
  letter-spacing: initial;
}
#cxdata-index.container .cxdata-pie-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  margin-bottom: 360px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 56px;
  max-width: 1180px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-title-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 16px;
  text-align: right;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-title-wrapper .cxdata-pie-title {
  color: #ec0047;
  font-size: 36px;
  font-weight: 600;
  text-align: right;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-title-wrapper .cxdata-pie-desc {
  display: inline-block;
  font-size: 20px;
  font-weight: 600;
  line-height: 150%; /* 33px */
  width: 680px;
  color: #444;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 62px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .cxdata-pie-percent-wrapper {
  display: flex;
  align-items: flex-end;
  gap: 40px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .first {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  font-size: 68px;
  font-weight: 700;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .first .cxdata-label {
  font-size: 14px;
  letter-spacing: initial;
  font-weight: 600;
  margin-left: 4px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .second {
  color: #999;
  font-size: 66px;
  font-weight: 700;
  margin-bottom: 8px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .second .cxdata-label {
  font-size: 14px;
  letter-spacing: initial;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap {
  position: relative;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap.pie .graph-loading {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.5);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap.pie span {
  position: absolute;
  color: #444;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap.pie .cxdata-pie-graph-title {
  top: 55px;
  left: 415px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap.pie .cxdata-pie-graph-title.en {
  left: 390px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap.pie .cxdata-pie-graph-title.ja {
  left: 420px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap.pie .cxdata-pie-device-title {
  top: 180px;
  right: 310px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap.pie .cxdata-pie-device-title.en {
  right: 250px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap.pie .cxdata-pie-device-title.ja {
  right: 300px;
}
#cxdata-index.container .cxdata-pie-wrapper .cxdata-graph-wrap.pie .tips {
  position: absolute;
  bottom: 50px;
  right: 160px;
  color: #444;
  text-align: right;
  font-size: 13px;
  font-weight: 400;
  line-height: 150%;
}
#cxdata-index.container .cxdata-pie-wrapper .pie-graph {
  margin-top: 100px;
  width: 1500px;
  height: 650px;
  letter-spacing: initial;
}
#cxdata-index.container .cxdata-chart-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  min-width: 1180px;
  max-width: 1180px;
  box-sizing: border-box;
  margin-bottom: 360px;
}
#cxdata-index.container .cxdata-chart-wrapper.average-stay {
  gap: 0;
}
#cxdata-index.container .cxdata-chart-wrapper.average-stay .chart-title-wrap {
  margin-top: 70px;
}
#cxdata-index.container .cxdata-chart-wrapper.average-stay .chart-title-wrap .chart-title {
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
}
#cxdata-index.container .cxdata-chart-wrapper .chart-title-wrap .chart-title {
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
}
#cxdata-index.container .cxdata-chart-wrapper.new-return {
  gap: 0;
}
#cxdata-index.container .cxdata-chart-wrapper.conversion {
  gap: 16px;
  align-items: flex-start;
}
#cxdata-index.container .cxdata-chart-wrapper.conversion .tips {
  margin-top: 16px;
  width: 100%;
  color: #444;
  font-size: 13px;
  font-weight: 400;
  line-height: 150%;
}
#cxdata-index.container .cxdata-chart-wrapper.sequence .chart-header-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
#cxdata-index.container .cxdata-chart-wrapper.sequence .chart-header-wrapper .chart-title-wrap {
  text-align: center;
}
#cxdata-index.container .cxdata-chart-wrapper.sequence .toggle-container {
  position: absolute;
  right: 0;
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  box-sizing: border-box;
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container .circle {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 32px;
  background-color: #9665E3;
  border-radius: 22px;
  transition: all 0.3s;
  cursor: pointer;
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container .circle.is-refresh {
  background-color: #0074FF;
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container .circle .toggle-switch {
  position: absolute;
  left: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  background-color: #fff;
  border-radius: 50%;
  transition: all 0.3s;
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container .circle .toggle-switch .icon-toggle-arrow {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("../../images/icon-toggle.svg");
  background-repeat: no-repeat;
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container .circle .toggle-switch.is-refresh {
  left: initial;
  transform: translateX(12px);
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container .circle .toggle-switch.is-refresh .icon-toggle-arrow {
  transform: rotate(180deg);
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container .text {
  color: #444;
  font-size: 16px;
  font-weight: 600;
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container.sequence .circle {
  background-color: #9FCE12;
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container.sequence .circle.is-return {
  background-color: #0E90A5;
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container.sequence .circle .toggle-switch.is-return {
  left: initial;
  transform: translateX(12px);
}
#cxdata-index.container .cxdata-chart-wrapper .toggle-container.sequence .circle .toggle-switch.is-return .icon-toggle-arrow {
  transform: rotate(180deg);
}
#cxdata-index.container .cxdata-chart-wrapper.center-aligned {
  gap: 34px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return .cxdata-chart-percent-wrapper {
  margin-top: -50px;
  display: flex;
  align-items: center;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return .cxdata-chart-percent-wrapper .cxdata-chart-percent {
  position: initial;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  color: #2F2F2F;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return .cxdata-chart-percent-wrapper .cxdata-chart-percent.return {
  margin-left: 49px;
  color: #777;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return .cxdata-chart-percent-wrapper .cxdata-chart-percent .average {
  font-size: 14px;
  font-weight: 600;
  margin-left: 4px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return .cxdata-chart-percent-wrapper .cxdata-chart-percent .number {
  font-size: 68px;
  font-weight: 700;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return .cxdata-chart-title-wrapper {
  margin-left: -49px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.center-aligned {
  flex-direction: column;
  align-items: center;
  gap: 34px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.center-aligned .cxdata-chart-title-wrapper {
  align-items: center;
  text-align: center;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.center-aligned .cxdata-chart-title-wrapper .cxdata-chart-title {
  max-width: initial;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.conversion {
  max-width: 1180px;
  position: relative;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.conversion .cxdata-chart-percent .first {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.conversion .cxdata-chart-percent .first .cxdata-label {
  color: #2F2F2F;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%; /* 14px */
  margin-left: 4px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 24px;
  text-align: right;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper.text-left {
  align-items: flex-start;
  text-align: left;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-title {
  color: #ec0047;
  font-size: 36px;
  font-weight: 600;
  line-height: 120%; /* 45.6px */
  max-width: 591px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-title.sequence-phone {
  max-width: 666px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-title.sequence-desktop {
  max-width: 667px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-desc {
  display: inline-block;
  font-size: 20px;
  font-weight: 600;
  line-height: 150%; /* 33px */
  width: 680px;
  color: #444;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-desc.mpti {
  width: 780px;
  font-size: 20px;
  font-weight: 600;
  line-height: 150%; /* 30px */
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-desc.average-visit.ja {
  width: 100%;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent {
  position: relative;
  top: 78px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.average-stay {
  top: 50px;
  display: flex;
  flex-direction: column;
  gap: 62px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .cxdata-chart-percent-wrapper {
  display: flex;
  align-items: flex-end;
  gap: 40px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.visit-page {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.visit-page .average {
  color: #2F2F2F;
  font-size: 14px;
  font-weight: 600;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.visit-page .number {
  color: #2F2F2F;
  font-size: 68px;
  font-weight: 700;
  display: flex;
  align-items: flex-end;
  gap: 5px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.visit-page .number .number-unit {
  font-size: 30px;
  margin-bottom: 10px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.sequence {
  top: 130px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .pages {
  font-size: 16px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .first {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  font-size: 68px;
  font-weight: 700;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .first .cxdata-label {
  margin-left: 4px;
  font-size: 14px;
  letter-spacing: initial;
  font-weight: 600;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .second {
  position: relative;
  color: #999;
  font-size: 66px;
  font-weight: 700;
  margin-bottom: 8px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .second.return {
  margin-bottom: 0;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .second .cxdata-label {
  position: absolute;
  left: 4px;
  top: -14px;
  font-size: 14px;
  letter-spacing: initial;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.conversion {
  top: 78px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.conversion.ko {
  top: 36px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.conversion.ja {
  top: 0;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.refresh {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 62px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.refresh .second {
  position: absolute;
  right: 0;
  top: 105%;
  width: fit-content;
  text-align: right;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.refresh .second .cxdata-label {
  left: 0;
  top: -14px;
  font-size: 14px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.sequence-phone.refresh .first {
  font-size: 100px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.sequence-phone .first {
  font-size: 140px;
  margin-top: 100px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.device-return .first {
  font-size: 140px;
  margin-top: 80px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.sequence-desktop .first {
  font-size: 140px;
  margin-top: 90px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned {
  display: flex;
  align-items: flex-end;
  gap: 18px;
  font-weight: 700;
  font-size: 24px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned.flex-align-center {
  align-items: center;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned .first {
  margin-right: 22px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned .number {
  font-size: 140px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned .second {
  margin-bottom: 8px;
}
#cxdata-index.container .cxdata-chart-wrapper .mpti-info {
  margin-top: -6px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 16px;
  text-align: left;
  position: relative;
}
#cxdata-index.container .cxdata-chart-wrapper .mpti-info .title {
  color: #7C40DD;
  font-size: 20px;
  font-weight: 700;
}
#cxdata-index.container .cxdata-chart-wrapper .mpti-info .desc {
  color: #9665E3;
  font-size: 16px;
  font-weight: 600;
  line-height: 150%; /* 24px */
}
#cxdata-index.container .cxdata-chart-wrapper .mpti-info .dropdown-container.half-pie {
  position: absolute;
  right: 0;
  bottom: -42px;
}
#cxdata-index.container .cxdata-chart-wrapper .mpti-rank {
  margin-top: 16px;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 98px;
  row-gap: 64px;
}
#cxdata-index.container .cxdata-chart-wrapper .mpti-rank .rank {
  max-width: 536px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
#cxdata-index.container .cxdata-chart-wrapper .mpti-rank .rank .title {
  display: flex;
  justify-content: space-between;
  color: #444;
  font-size: 20px;
  font-weight: 700;
}
#cxdata-index.container .cxdata-chart-wrapper .mpti-rank .rank .title .rank-title {
  display: flex;
  align-items: center;
  gap: 8px;
}
#cxdata-index.container .cxdata-chart-wrapper .mpti-rank .rank .desc {
  color: #777;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%; /* 24px */
  word-wrap: break-word;
  overflow-wrap: break-word;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container {
  width: 1180px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 24px;
  padding-top: 20px;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container.en {
  width: calc(100% - 350px);
  margin: 0 auto;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #444;
  font-size: 16px;
  font-weight: 500;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-0 {
  background-color: #2E9BFF;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-1 {
  background-color: #49538A;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-2 {
  background-color: #FADF4F;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-3 {
  background-color: #B5CC58;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-4 {
  background-color: #9769B2;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-5 {
  background-color: #588F8F;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-6 {
  background-color: #95DCDC;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-7 {
  background-color: #D2BEF2;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-8 {
  background-color: #A79577;
}
#cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color.industry-9 {
  background-color: #D7D7D7;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox .checkbox_wrap {
  display: flex;
  align-items: center;
  gap: 20px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox .checkbox_wrap .checkbox {
  display: flex;
  align-items: center;
  gap: 5px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox .checkbox_wrap .checkbox .text {
  font-size: 14px;
  font-weight: 400;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox .checkbox_wrap .checkbox .icon-chkbox {
  cursor: pointer;
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: url(../../images/icon-chkbox-off.svg);
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox .checkbox_wrap .checkbox .icon-chkbox.on {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: url(../../images/icon-chkbox-on.svg);
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox .new-chart-desktop,
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox .return-chart-desktop,
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox .new-chart-phone,
#cxdata-index.container .cxdata-chart-wrapper .cxdata-new-return-checkbox .return-chart-phone {
  width: 100%;
  height: 504px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.conversion {
  position: relative;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.conversion .white-bg {
  position: absolute;
  top: 0;
  width: 140px;
  height: 100%;
  background-color: #fff;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.conversion .white-bg.left {
  left: 0;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.conversion .white-bg.right {
  right: 0;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.conversion .cxdata-graph-all {
  position: absolute;
  top: 8px;
  right: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-radius: 5px;
  background: #FFF;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
  padding: 12px 14px 12px 12px;
  color: #444;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  z-index: 10;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.conversion .cxdata-graph-all .icon-all {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url(../../images/icon-all.svg);
  background-repeat: no-repeat;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.mpti {
  margin-top: 86px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.mpti .graph-title {
  position: absolute;
  top: -55px;
  color: #444;
  font-size: 18px;
  font-weight: 600;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.average-stay {
  position: relative;
  margin-top: 100px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.average-stay.isChartTitle {
  margin-top: 30px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.average-stay .average-stay-chart-legend {
  position: absolute;
  top: 0px;
  right: 50px;
  display: flex;
  flex-direction: column;
  text-align: right;
  color: #8a8a8a;
  font-size: 13px;
  font-weight: 600;
  line-height: 150%;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.average-stay .average-stay-chart-legend.notPrev6Month {
  top: 20px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh {
  position: relative;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .chart-header-wrapper .chart-title-wrap {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .chart-header-wrapper .chart-title-wrap .chart-title {
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .chart-header-wrapper .toggle-container {
  position: absolute;
  right: 0;
  z-index: 2;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .refresh-graph {
  margin-top: 10px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return {
  position: relative;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return .chart-title-wrap {
  margin-top: 24px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return .newReturn-legend-container {
  position: absolute;
  bottom: 30px;
  left: 52%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 24px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return .newReturn-legend-container .legend-industry {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #444;
  font-size: 16px;
  font-weight: 500;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return .newReturn-legend-container .legend-industry i {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return .newReturn-legend-container .legend-industry i.new-icon {
  background-color: #9FCE12;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return .newReturn-legend-container .legend-industry i.return-icon {
  background-color: #0E90A5;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.sequence {
  margin-top: -30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.sequence .no-data-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1240px;
  height: calc(100% - 76px);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.sequence .no-data-wrap .none-data {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 16px;
  border-radius: 8px;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.16);
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.16);
  color: #E60724;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.sequence .no-data-wrap .none-data .icon-warning {
  display: inline-block;
  width: 13px;
  height: 13px;
  background-image: url("../../images/icon-warning.svg");
  background-repeat: no-repeat;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.sequence .sequence-grid {
  margin-top: 20px;
  width: 95%;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  place-items: center;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.sequence .sequence-grid span {
  color: #777;
  font-size: 13px;
  font-weight: 600;
  line-height: 120%; /* 15.6px */
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph {
  margin: 0 auto;
  width: 1180px;
  height: 580px;
  letter-spacing: initial;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.sequence-graph {
  height: 500px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.device-return-graph {
  margin-top: 30px;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.conversion-graph {
  letter-spacing: initial;
  margin: 0 auto;
  box-sizing: border-box;
  width: 1180px;
  height: 571px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.mpti-graph {
  height: 434px;
}

@media all and (max-width: 768px) {
  #cxdata-index.container {
    width: 100%;
    min-width: 335px;
    margin-top: -1px;
    position: relative;
    overflow: initial;
  }
  #cxdata-index.container .cxdata-optimized {
    position: absolute;
    top: -50px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    box-sizing: border-box;
  }
  #cxdata-index.container .cxdata-optimized .cxdata-optimized-text {
    width: 100%;
    text-align: center;
    border-radius: 4px;
    background: #222;
    padding: 8px 10px;
    color: #999;
    font-size: 12px;
    font-weight: 400;
  }
  #cxdata-index.container .cxdata-info-wrapper {
    width: 100%;
    margin-top: 80px;
    background-image: none;
    box-sizing: border-box;
    margin-bottom: 0;
    padding: 0 20px;
    min-height: 780px;
    align-items: flex-start;
    justify-content: center;
    gap: 51px;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-info {
    width: 100%;
    position: initial;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-title {
    width: 100%;
    min-width: initial;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 51px;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-title .cxdata-title--desc {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    font-weight: 700;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-title .cxdata-title--desc .date {
    font-size: 24px;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-title .cxdata-title--desc .sub-title {
    text-align: left;
    font-weight: 400;
    line-height: 120%;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-title .cxdata-title--desc .sub-title.ja {
    font-size: 15px;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-title .title {
    max-width: 243px;
    font-size: 60px;
    text-align: left;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-data {
    min-width: initial;
    width: 100%;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-data .data {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-data .data span {
    font-size: 12px;
  }
  #cxdata-index.container .cxdata-info-wrapper .cxdata-data .data h3 {
    font-size: 38px;
  }
  #cxdata-index.container .dropdown-container .dropdown-wrapper {
    width: 100%;
  }
  #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown .dropdown-content {
    max-height: 290px;
    overflow-y: auto;
  }
  #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown-period-wrapper {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown-period-wrapper .dropdown {
    width: 100%;
  }
  #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown-period-wrapper .dropdown .dropbtn.disabled {
    font-size: 14px;
    font-weight: 400;
    color: #aaa;
    background-color: #e6e6e6;
    pointer-events: none;
  }
  #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown-period-wrapper .dropdown .dropbtn.disabled .icon-arrow-down-disabled {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url("../../images/icon-arrow-down-disabled.svg");
    background-repeat: no-repeat;
  }
  #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown-period-wrapper .dropdown .dropdown-content .dropdown-item {
    padding: 12px;
  }
  #cxdata-index.container .dropdown-container .dropdown-wrapper .dropdown-period-wrapper .dropdown .dropdown-content .dropdown-item.active {
    color: #888;
    font-weight: 600;
    cursor: initial;
  }
  #cxdata-index.container .cxdata-pv-wrapper {
    gap: 24px;
    width: 100%;
    margin: 0 auto 140px;
    padding: 0 20px;
  }
  #cxdata-index.container .cxdata-pv-wrapper.heatmap {
    margin-bottom: 0;
  }
  #cxdata-index.container .cxdata-pv-wrapper.heatmap .dropdown-container {
    margin-top: 20px;
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
  }
  #cxdata-index.container .cxdata-pv-wrapper.heatmap .dropdown-container.heatmap {
    flex-direction: column;
    right: initial;
    top: 530px;
    gap: 16px;
  }
  #cxdata-index.container .cxdata-pv-wrapper.heatmap .dropdown-container .dropdown-wrapper {
    width: 100%;
  }
  #cxdata-index.container .cxdata-pv-wrapper .icon-wrap {
    display: none;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-pv-text-wrapper {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 24px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-pv-text-wrapper .cxdata-pv-title-wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-pv-text-wrapper .cxdata-pv-title-wrapper .cxdata-pv-title {
    font-size: 22px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap {
    box-sizing: border-box;
    min-width: 335px;
    width: 100%;
    gap: 24px;
    padding: 0;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] {
    flex-direction: column-reverse;
    justify-content: flex-end;
    gap: 24px;
    width: 335px;
    height: initial;
    margin-bottom: 140px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .graph {
    width: 100%;
    height: 300px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .chart-title-wrap {
    width: 100%;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .graph-container[data-industry=ecommerce] .chart-title-wrap .chart-rate-desc {
    right: initial;
    text-align: center;
    font-size: 12px;
    font-weight: 400;
    line-height: 150%;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap {
    flex-direction: column;
    text-align: center;
    gap: 24px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-desc {
    font-size: 14px;
    font-weight: 400;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date {
    display: flex;
    align-items: center;
    gap: 0;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date .cxdata-label {
    font-size: 12px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date .date-wrap .date {
    font-size: 62px;
    display: flex;
    align-items: flex-end;
    gap: 5px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date .date-wrap .date .daytime {
    font-size: 14px;
    margin-bottom: 15px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .cxdata-graph-text-wrap .cxdata-pv-date .date-wrap .wave {
    font-size: 60px;
    font-weight: 700;
  }
  #cxdata-index.container .cxdata-pie-wrapper {
    gap: 0px;
    min-width: 335px;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 140px;
    padding: 0 20px;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper {
    flex-direction: column-reverse;
    align-items: center;
    justify-content: center;
    gap: 24px;
    box-sizing: border-box;
    max-width: 335px;
    text-align: center;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-title-wrapper {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-title-wrapper .cxdata-pie-title {
    font-size: 22px;
    max-width: 100%;
    text-align: center;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-title-wrapper .cxdata-pie-desc {
    font-size: 13px;
    font-weight: 400;
    width: 100%;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    margin-top: 8px;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .dropdown-container {
    width: 100%;
    flex-direction: column;
    gap: 16px;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .dropdown-container .dropdown-wrapper {
    width: 100%;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .dropdown-container .dropdown-wrapper .dropdown-label {
    text-align: left;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .first {
    font-size: 62px;
    align-items: center;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .first .cxdata-label {
    width: 100%;
    font-size: 12px;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .second {
    font-size: 40px;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .cxdata-pie-percent .second .cxdata-label {
    font-size: 12px;
  }
  #cxdata-index.container .cxdata-pie-wrapper .cxdata-pie-text-wrapper .tips {
    color: #444;
    font-size: 13px;
    font-weight: 400;
    line-height: 150%; /* 19.5px */
  }
  #cxdata-index.container .cxdata-pie-wrapper .pie-graph {
    width: 375px;
    margin: 0 auto;
    height: 300px;
  }
  #cxdata-index.container .cxdata-chart-wrapper {
    gap: 24px;
    min-width: 335px;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 140px;
    padding: 0 20px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .dropdown-container {
    width: 100%;
    flex-direction: column;
    gap: 16px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .dropdown-container.rollback-refresh, #cxdata-index.container .cxdata-chart-wrapper .dropdown-container.sequence {
    margin-top: 24px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .dropdown-container .dropdown-wrapper {
    width: 100%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .dropdown-container .dropdown-wrapper .dropdown .dropdown-content {
    max-height: 290px;
    overflow-y: auto;
  }
  #cxdata-index.container .cxdata-chart-wrapper.conversion {
    gap: 24px;
  }
  #cxdata-index.container .cxdata-chart-wrapper.conversion .tips {
    margin-top: 0;
    text-align: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper.average-stay {
    margin-bottom: 200px;
  }
  #cxdata-index.container .cxdata-chart-wrapper.new-return {
    gap: 24px;
  }
  #cxdata-index.container .cxdata-chart-wrapper.mpti .dropdown-container {
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
  }
  #cxdata-index.container .cxdata-chart-wrapper.mpti .dropdown-container.half-pie {
    text-align: left;
    flex-direction: column;
    right: initial;
    top: 270px;
    gap: 16px;
  }
  #cxdata-index.container .cxdata-chart-wrapper.mpti .dropdown-container .dropdown-wrapper {
    width: 100%;
  }
  #cxdata-index.container .cxdata-chart-wrapper.mpti .mpti-rank {
    margin-top: -20px;
    grid-template-columns: repeat(1, 1fr);
    place-items: center;
    gap: 40px;
  }
  #cxdata-index.container .cxdata-chart-wrapper.mpti .mpti-rank .rank {
    text-align: center;
    gap: 12px;
  }
  #cxdata-index.container .cxdata-chart-wrapper.mpti .mpti-rank .rank .title {
    flex-direction: column;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    line-height: 120%;
  }
  #cxdata-index.container .cxdata-chart-wrapper.mpti .mpti-rank .rank .desc {
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
  }
  #cxdata-index.container .cxdata-chart-wrapper.sequence .toggle-container {
    position: initial;
  }
  #cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container {
    padding: 0;
    margin: -44px auto 0;
    justify-content: center;
    gap: 12px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container.ko {
    width: calc(100% - 100px);
  }
  #cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container.en, #cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container.ja {
    margin: -44px auto 0;
    width: 100%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry-wrapper {
    display: flex;
    gap: 16px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry {
    display: flex;
    gap: 2.5px;
    font-size: 10px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .treemap-legend-container .legend-industry .industry-color {
    width: 10px;
    height: 10px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .mpti-info {
    margin-top: -130px;
    text-align: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .mpti-info .title {
    font-size: 16px;
    line-height: 120%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .mpti-info .desc {
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper {
    flex-direction: column-reverse;
    align-items: center;
    justify-content: center;
    gap: 24px;
    box-sizing: border-box;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.mpti, #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.visit-page, #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.rollback-refresh, #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.sequence {
    flex-direction: column;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.mobile-reverse {
    flex-direction: column-reverse;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.center-aligned {
    flex-direction: column;
    align-items: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.center-aligned .cxdata-chart-title-wrapper {
    align-items: center;
    text-align: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.center-aligned .cxdata-chart-title-wrapper .cxdata-chart-title {
    max-width: initial;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return {
    margin-bottom: 24px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return .cxdata-chart-title-wrapper {
    margin-left: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return .cxdata-chart-percent-wrapper {
    margin-top: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper.new-return .cxdata-chart-percent-wrapper .cxdata-chart-percent.return {
    margin-left: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper.text-left {
    align-items: center;
    text-align: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-title {
    font-size: 22px;
    max-width: 100%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-title.sequence-phone {
    max-width: 100%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-title.sequence-desktop {
    max-width: 100%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-desc {
    font-size: 13px;
    font-weight: 400;
    width: 100%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-desc.average-visit {
    width: 335px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-title-wrapper .cxdata-chart-desc.mpti {
    font-size: 13px;
    font-weight: 400;
    line-height: 150%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent-wrapper.new-return {
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent-wrapper.new-return .cxdata-chart-percent {
    align-items: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent-wrapper.new-return .cxdata-chart-percent.return .average {
    color: #777;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent-wrapper.new-return .cxdata-chart-percent.return .number {
    font-size: 40px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent-wrapper.new-return .cxdata-chart-percent .average {
    color: #2F2F2F;
    font-size: 12px;
    font-weight: 700;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent-wrapper.new-return .cxdata-chart-percent .number {
    font-size: 62px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 24px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.conversion {
    top: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.conversion.ko {
    top: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.mobile-gap {
    margin-top: 24px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.mpti {
    top: 150px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.visit-page {
    top: initial;
    align-items: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.visit-page .number {
    font-size: 62px;
    flex-direction: column;
    align-items: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.visit-page .number .number-unit {
    font-size: 16px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.sequence {
    top: 24px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .first {
    font-size: 62px;
    margin-bottom: 0;
    align-items: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .first .cxdata-label {
    width: 100%;
    display: flex;
    justify-content: center;
    font-size: 12px;
    left: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .second {
    font-size: 40px;
    margin-bottom: 6px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent .second .cxdata-label {
    font-size: 12px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.average-stay {
    width: 100%;
    top: 24px;
    gap: 24px;
    align-items: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.refresh {
    top: 24px;
    gap: 24px;
    align-items: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.refresh .second {
    top: 115%;
    right: 50%;
    transform: translateX(50%);
    width: max-content;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.refresh .second .cxdata-label {
    left: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.refresh .second .cxdata-label.highest {
    left: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.refresh .second .cxdata-label.return {
    left: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.refresh .second .cxdata-label.phone {
    left: 0;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 190px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned .first {
    margin-right: initial;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned .number {
    font-size: 62px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned .pages {
    font-size: 16px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned .return.second {
    right: 50%;
    transform: translateX(50%);
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-chart-text-wrapper .cxdata-chart-percent.center-aligned .return.second .cxdata-label {
    width: 190px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .toggle-container.sequence .circle {
    width: 42px;
    height: 24px;
    border-radius: 16.5px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .toggle-container.sequence .circle .toggle-switch {
    width: 19.5px;
    height: 19.5px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .toggle-container.sequence .circle .toggle-switch.is-return {
    transform: translateX(9px);
  }
  #cxdata-index.container .cxdata-chart-wrapper .toggle-container.sequence .circle .toggle-switch .icon-toggle-arrow {
    width: 12px;
    height: 12px;
    background-size: 12px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .toggle-container.sequence .text {
    font-size: 12px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap {
    width: 100%;
    display: flex;
    align-items: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.conversion .cxdata-graph-all {
    top: 6px;
    right: 6px;
    gap: 4px;
    padding: 6px 8px 6px 6px;
    font-size: 12px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.conversion .cxdata-graph-all .icon-all {
    width: 12px;
    height: 12px;
    background-size: 12px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.mpti {
    margin-top: 230px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh {
    flex-direction: column;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .chart-header-wrapper .toggle-container {
    position: initial;
    transform: translateX(0%);
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .chart-header-wrapper .toggle-container .circle {
    width: 42px;
    height: 24px;
    border-radius: 16.5px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .chart-header-wrapper .toggle-container .circle .toggle-switch {
    width: 19.5px;
    height: 19.5px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .chart-header-wrapper .toggle-container .circle .toggle-switch.is-refresh {
    transform: translateX(9px);
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .chart-header-wrapper .toggle-container .circle .toggle-switch .icon-toggle-arrow {
    width: 12px;
    height: 12px;
    background-size: 12px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .chart-header-wrapper .toggle-container .text {
    font-size: 12px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.rollback-refresh .refresh-graph {
    margin-top: -30px;
    height: 400px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.average-stay {
    height: 304px;
    margin-top: 20px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.average-stay.isChartTitle {
    margin-top: 20px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.average-stay .average-stay-chart-legend {
    width: 100%;
    top: initial;
    bottom: -65px;
    right: 50%;
    transform: translateX(50%);
    text-align: center;
    color: #444;
    font-size: 12px;
    font-weight: 400;
    line-height: 150%;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return .newReturn-legend-container {
    bottom: 15px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return .newReturn-legend-container .legend-industry {
    gap: 2.5px;
    font-size: 10px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.new-return .newReturn-legend-container .legend-industry i {
    width: 10px;
    height: 10px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.sequence {
    flex-direction: column;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap.sequence .sequence-grid span {
    font-size: 10px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph {
    width: 100%;
    margin: 0 auto;
    height: 304px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.mpti-graph {
    margin-top: 24px;
    height: 250px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.pie-graph {
    width: 100%;
    margin: 0 auto;
    height: 300px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.conversion-graph {
    margin: 0 auto;
    box-sizing: border-box;
    width: 335px;
    height: 297px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.conversion-graph > div > canvas {
    height: 250px !important;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.average-stay-graph {
    margin-top: 20px;
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.sequence-graph {
    height: 350px;
  }
}
@media all and (max-width: 375px) {
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .slide-wrapper {
    height: 200px;
  }
  #cxdata-index.container .cxdata-pv-wrapper .cxdata-graph-wrap .slide-wrapper .graph-slider {
    width: 100%;
    transform: scale(0.4);
  }
  #cxdata-index.container .cxdata-chart-wrapper .cxdata-graph-wrap .cxdata-graph.conversion-graph {
    width: 335px;
  }
}
#report.container {
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  overflow: hidden;
  min-width: 1280px;
}
#report.container * {
  letter-spacing: 0;
  box-sizing: border-box;
}
#report.container button {
  background-color: #fff;
  padding: 0;
  border: none;
  cursor: pointer;
}
#report.container .inner {
  max-width: 1210px;
  padding: 0 20px;
  width: 100%;
  margin: 0 auto;
  height: 100%;
  position: relative;
}
#report.container .section__title {
  display: flex;
  align-items: center;
}
#report.container .section__title .title {
  color: #2F2F2F;
  font-size: 26px;
  font-weight: 600;
  line-height: 100%;
  margin-right: 12px;
}
#report.container .section__title .sub-title {
  color: #666;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%;
  padding-left: 10px;
  border-left: 1px solid #BBB;
}
#report.container .icon-calendar {
  display: block;
  flex-shrink: 0;
  width: 16px;
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon-calendar.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 16px;
}
#report.container .icon-calendar--gray {
  display: block;
  flex-shrink: 0;
  width: 14px;
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon-calendar--gray.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 14px;
}
#report.container .icon-views {
  display: block;
  flex-shrink: 0;
  width: 16px;
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon-views.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 16px;
}
#report.container .icon-views--gray {
  display: block;
  flex-shrink: 0;
  width: 14px;
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon-views--gray.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 14px;
}
#report.container .pc {
  display: block;
}
#report.container .pc-flex {
  display: flex;
}
#report.container .mo {
  display: none;
}
#report.container .report-top__wrap {
  background-color: #070019;
  height: 867px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
#report.container .report-top__wrap .hero-background {
  position: absolute;
  min-width: 1980px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #000;
  pointer-events: none;
}
#report.container .report-top__wrap .visualization-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
}
#report.container .report-top__wrap .visualization-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#report.container .report-top__wrap .hero-svg {
  width: 100%;
  height: 100%;
}
#report.container .report-top__wrap .hero-vignette {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background: radial-gradient(circle at center, transparent 0%, rgba(0, 0, 0, 0.6) 100%);
}
#report.container .report-top__wrap .hero-line {
  fill: none;
}
#report.container .report-top__wrap .central-glow {
  opacity: 0;
}
#report.container .report-top__wrap .report-top {
  padding-top: 128px;
  margin: auto;
  color: #fff;
}
#report.container .report-top__wrap .report-top:lang(ja), #report.container .report-top__wrap .report-top:lang(en) {
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}
#report.container .report-top__wrap .report-top__notice {
  display: flex;
  justify-content: flex-start;
}
#report.container .report-top__wrap .report-top__notice .notice-inner {
  width: auto;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(0, 0, 0, 0.24);
  display: flex;
  align-items: stretch;
  gap: 16px;
  padding: 16px;
}
#report.container .report-top__wrap .report-top__notice .division {
  width: 1px;
  background: #444;
}
#report.container .report-top__wrap .report-top__notice .notice-list {
  flex: auto;
  display: flex;
  flex-direction: column;
  align-self: center;
  gap: 12px;
}
#report.container .report-top__wrap .report-top__notice .notice-list__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-width: 286px;
}
#report.container .report-top__wrap .report-top__notice .notice-list__item .item-desc {
  color: rgba(255, 255, 255, 0.7);
  font-size: 12px;
  font-weight: 500;
  line-height: 120%;
}
#report.container .report-top__wrap .report-top__notice .notice-list__item .item-value {
  color: #EBEBEB;
  font-size: 13px;
  font-weight: 600;
  line-height: 100%;
}
#report.container .report-top__wrap .report-top__notice .notice-wrap {
  padding: 4.5px 0;
  display: flex;
  flex-direction: column;
  align-self: center;
  gap: 8px;
}
#report.container .report-top__wrap .report-top__notice .notice-wrap__title {
  color: #D7D7D7;
  font-size: 14px;
  font-weight: 600;
  line-height: 120%;
}
#report.container .report-top__wrap .report-top__notice .notice-wrap__desc {
  color: #B1B1B1;
  font-size: 12px;
  font-weight: 500;
  line-height: 150%;
}
#report.container .report-top__wrap .report-top__title {
  margin: 43px 0 60px;
  padding-left: 4px;
  font-size: 72px;
  font-weight: 600;
  line-height: 110%;
  letter-spacing: -1.5px;
}
#report.container .report-top__wrap .report-top__title .accent {
  color: #FFD900;
}
#report.container .report-top__wrap .report-top__latest {
  width: calc(100% - 40px);
  max-width: 1210px;
  padding: 44px 40px 40px 44px;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: linear-gradient(99deg, rgba(55, 98, 243, 0.48) 0%, rgba(34, 75, 218, 0.48) 14.42%, rgba(13, 49, 164, 0.48) 42.31%, rgba(4, 41, 147, 0.48) 76.44%);
  backdrop-filter: blur(14px);
  position: absolute;
  top: auto;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 37px;
}
#report.container .report-top__wrap .report-top__latest .latest-header {
  display: flex;
  align-items: center;
  gap: 16px;
}
#report.container .report-top__wrap .report-top__latest .latest-header__title {
  color: #FFF;
  font-size: 30px;
  font-weight: 600;
  line-height: 100%;
}
#report.container .report-top__wrap .report-top__latest .latest-header__desc {
  color: #99A1AF;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: -0.15px;
}
#report.container .report-top__wrap .report-top__latest .latest-header .badge {
  color: rgba(0, 0, 0, 0.8);
  font-size: 12px;
  font-weight: 600;
  line-height: 100%;
  border-radius: 50em;
  padding: 7px 12px;
  background: #FFD900;
}
#report.container .report-top__wrap .report-top__latest .latest-content {
  display: flex;
  align-items: stretch;
  gap: 46px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__img {
  position: relative;
  border-radius: 12px;
  background-color: #fff;
  width: 260px;
  height: 365px;
  flex-shrink: 0;
  align-self: flex-end;
}
#report.container .report-top__wrap .report-top__latest .latest-content__img:after {
  content: "";
  position: absolute;
  bottom: -40px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  flex-shrink: 0;
  width: 260px;
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/report-shadow.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 40px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__img .icon--clip {
  position: absolute;
  top: -9px;
  z-index: 10;
  right: 27px;
  display: block;
  flex-shrink: 0;
  width: 17px;
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon--clip.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 32px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__img #pdf-canvas {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  object-position: center;
  object-fit: contain;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary {
  display: flex;
  flex-direction: column;
  padding-top: 12px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__title {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__title .sub-title {
  color: #4FB7FF;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0.2px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__title .title {
  color: #FFF;
  font-size: 48px;
  font-weight: 600;
  line-height: 110%;
  letter-spacing: -0.48px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  margin: 32px 0 27px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__list li {
  width: calc(50% - 10px);
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__list li span {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  color: #FFF;
  font-size: 15px;
  font-weight: 500;
  line-height: 130%;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__list li:before {
  content: "";
  flex-shrink: 0;
  background: url(https://dream-cdn.beusable.net/home/images/cx_trend/icon-report.svg) no-repeat center/contain;
  width: 16px;
  height: 16px;
  display: block;
  margin: 2px 0;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__info {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 24px;
  margin-top: auto;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__info .info {
  color: #FFF;
  font-size: 14px;
  font-weight: 500;
  line-height: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .report-view-btn {
  border-radius: 50em;
  background: #FFF;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08), 0 20px 16px -12px rgba(0, 0, 0, 0.12);
  height: 53px;
  padding-inline: 17px 22px;
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 252px;
  width: 100%;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .report-view-btn .btn-text {
  flex: auto;
  color: #EC0047;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  line-height: 100%;
}
#report.container .report-top__wrap .report-top__latest .latest-content__summary .report-view-btn .icon--arrow-red {
  width: 24px;
  height: 24px;
  display: block;
  flex-shrink: 0;
  width: 24px;
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon-arrow-red.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 24px;
}
#report.container .last-report__section .inner {
  padding-top: 233px;
  padding-bottom: 130px;
  border-bottom: 1px solid #BBB;
}
#report.container .last-report__section .section__content {
  margin-top: 40px;
}
#report.container .last-report__section .last-report__card {
  display: flex;
  align-items: center;
  gap: 30px;
  width: 100%;
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
}
#report.container .last-report__section .last-report__card.is-single .slick-track {
  margin-right: auto;
  margin-left: 0;
}
#report.container .last-report__section .last-report__card.is-dragging .slick-arrow:after {
  opacity: 1;
}
#report.container .last-report__section .last-report__card.is-ready {
  opacity: 1;
}
#report.container .last-report__section .last-report__card .slick-slide > div, #report.container .last-report__section .last-report__card .slick-slide .slide-card__wrap, #report.container .last-report__section .last-report__card .slick-slide .card-item {
  height: 100%;
}
#report.container .last-report__section .last-report__card .slick-dots {
  text-indent: -9999px;
  position: absolute;
  display: flex;
  align-items: center;
  gap: 6px;
  left: 50%;
  transform: translateX(-50%);
  bottom: -60px;
}
#report.container .last-report__section .last-report__card .slick-dots li {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50em;
  background-color: #D7D7D7;
  transition: all 0.3s ease-in-out;
}
#report.container .last-report__section .last-report__card .slick-dots li.slick-active {
  background-color: #2F2F2F;
}
#report.container .last-report__section .last-report__card .slick-arrow {
  z-index: 1;
  text-indent: -9999px;
  font-size: 0;
  line-height: 0;
}
#report.container .last-report__section .last-report__card .slick-arrow:before {
  content: "";
  position: relative;
  z-index: 1;
  transition: background 0.2s ease-in-out;
  display: block;
  flex-shrink: 0;
  width: 56px;
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon-navi--active.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 80px;
}
#report.container .last-report__section .last-report__card .slick-arrow:after {
  opacity: 0;
  z-index: 0;
  content: "";
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 85px;
  height: 402px;
  background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, #fff 20.19%, #fff 100%);
  transition: opacity 0.3s ease-in-out;
}
#report.container .last-report__section .last-report__card .slick-arrow:hover:before {
  display: block;
  flex-shrink: 0;
  width: 56px;
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon-navi--hover.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 80px;
}
#report.container .last-report__section .last-report__card .slick-arrow.slick-disabled:before {
  background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon-navi--disabled.svg");
}
#report.container .last-report__section .last-report__card .slick-arrow.slick-next {
  transform: rotate(180deg);
}
#report.container .last-report__section .last-report__card .slick-list {
  margin-right: -20px;
  flex: auto;
}
#report.container .last-report__section .last-report__card .slide-card__wrap {
  cursor: pointer;
  width: 25%;
}
#report.container .last-report__section .last-report__card .card-item {
  margin-right: 20px;
  min-height: 312px;
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.32);
  background: #FFF;
  box-shadow: 0 8px 12px -6px rgba(0, 0, 0, 0.12);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
#report.container .last-report__section .last-report__card .card-item .badge {
  align-self: flex-start;
  border-radius: 4px;
  background: #EC0047;
  padding: 2px 6px;
  color: #FFF;
  font-size: 12px;
  font-weight: 700;
  line-height: 16px;
}
#report.container .last-report__section .last-report__card .card-item .title {
  color: #2F2F2F;
  font-size: 18px;
  font-weight: 600;
  line-height: 120%;
}
#report.container .last-report__section .last-report__card .card-item .summary {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
#report.container .last-report__section .last-report__card .card-item .summary__list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#report.container .last-report__section .last-report__card .card-item .summary__list li {
  color: #444;
  font-size: 12px;
  font-weight: 400;
  line-height: 120%;
  display: flex;
  gap: 4px;
}
#report.container .last-report__section .last-report__card .card-item .summary__list li:before {
  content: "";
  display: block;
  width: 2px;
  height: 2px;
  background-color: #666;
  margin: 5.5px 2px 0;
}
#report.container .last-report__section .last-report__card .card-item .summary .label {
  color: #2F2F2F;
  font-size: 12px;
  font-weight: 500;
  line-height: 100%;
}
#report.container .last-report__section .last-report__card .card-item .info {
  border-top: 1px solid #E1E1E1;
  padding-top: 16px;
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#report.container .last-report__section .last-report__card .card-item .info span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #6A7282;
  font-size: 11px;
  font-weight: 400;
  line-height: 100%;
}
#report.container .benchmarks__section {
  min-height: 502px;
}
#report.container .benchmarks__section .inner {
  padding-top: 80px;
  padding-bottom: 220px;
}
#report.container .benchmarks__section .section__content {
  padding-top: 28px;
  position: relative;
  left: 0;
  transform: translate(0, 0);
}
#report.container .benchmarks__section .section__content.is-fixed {
  position: fixed;
  width: 100%;
  min-width: 1280px;
  background: #000;
  top: 0;
  left: 0;
  transform: translate(0, -28px);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease;
  z-index: 100;
  box-shadow: 0 20px 38px -10px rgba(0, 0, 0, 0.32);
  padding: 40px 20px 12px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 63px;
}
#report.container .benchmarks__section .section__content.is-fixed .label {
  padding: 14px 0;
  display: block;
  color: #777;
  font-size: 24px;
  font-weight: 600;
  line-height: 100%;
}
#report.container .benchmarks__section .section__content.is-fixed .benchmarks__list {
  max-width: 1024px;
  width: 100%;
}
#report.container .benchmarks__section .section__content.is-fixed .benchmarks__list .list-wrap {
  gap: 6px;
}
#report.container .benchmarks__section .section__content.is-fixed .benchmarks__list button {
  height: 52px;
  color: #fff;
  background-color: transparent;
}
#report.container .benchmarks__section .section__content.is-fixed .benchmarks__list button:hover {
  color: #999;
}
#report.container .benchmarks__section .section__content.is-default .benchmarks__list button {
  color: #EC0047;
  height: 66px;
  padding: 10px;
  border-radius: 12px;
  border: 1px solid rgba(0, 0, 0, 0.16);
  background: #FFF;
  box-shadow: 0 8px 12px -6px rgba(0, 0, 0, 0.12);
}
#report.container .benchmarks__section .section__content.is-default .benchmarks__list button:hover {
  border-radius: 12px;
  border: 1px solid rgba(0, 0, 0, 0.16);
  background: #F4F4F4;
  box-shadow: 0 8px 12px -6px rgba(0, 0, 0, 0.12);
}
#report.container .benchmarks__section .section__content .label {
  display: none;
}
#report.container .benchmarks__section .benchmarks__list .selected {
  display: none;
}
#report.container .benchmarks__section .benchmarks__list .list-wrap {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}
#report.container .benchmarks__section .benchmarks__list button {
  font-size: 16px;
  font-weight: 600;
  line-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
#report.container .diagnosis-modal-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: none;
}
#report.container .diagnosis-modal-wrapper .contents {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 57px 0 24px 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  border-radius: 14px;
  max-width: 428px;
  max-height: 675px;
  color: #2F2F2F;
  text-align: center;
  overflow: hidden;
}
#report.container .diagnosis-modal-wrapper .contents .scroll-content {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 0 28px;
  box-sizing: border-box;
}
#report.container .diagnosis-modal-wrapper .contents .modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
#report.container .diagnosis-modal-wrapper .contents .title {
  font-size: 20px;
  font-weight: 600;
  line-height: 100%; /* 20px */
}
#report.container .diagnosis-modal-wrapper .contents .desc {
  font-size: 12px;
  font-weight: 500;
  line-height: 150%; /* 18px */
  margin-bottom: -6px;
}
#report.container .diagnosis-modal-wrapper .contents .form-container {
  padding: 24px 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: 100%;
}
#report.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
#report.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper.email {
  position: relative;
}
#report.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper label {
  color: #777;
  font-size: 13px;
  font-weight: 600;
  line-height: 100%; /* 13px */
  margin-left: 4px;
}
#report.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper input {
  box-sizing: border-box;
  width: 100%;
  padding: 9px 9px 9px 12px;
  border-radius: 5px;
  border: 1px solid #BBB;
}
#report.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper input:focus {
  border: 1px solid #2E9BFF;
  outline: none;
}
#report.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper input::placeholder {
  color: #BBB;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%; /* 14px */
}
#report.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper input.error-line {
  border-color: #ec0047;
}
#report.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper .error {
  display: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #e60724;
  position: absolute;
  top: 110%;
  left: 4px;
}
#report.container .diagnosis-modal-wrapper .contents .privacy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper {
  width: 100%;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 5px;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper:first-child {
  margin-bottom: 0;
  padding-bottom: 12px;
  border-bottom: 1px solid #E0E0E0;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper:nth-child(2) {
  padding-top: 12px;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper input[type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-off.svg") no-repeat center/contain;
  cursor: pointer;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper input[type=checkbox]:checked {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-on.svg");
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 400;
  line-height: 120%; /* 15.6px */
  cursor: pointer;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label.all {
  font-weight: 600;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label > .helper-text {
  color: #666;
  font-weight: 400;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label > img {
  cursor: pointer;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion {
  flex-direction: column;
  align-items: flex-start;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header {
  display: flex;
  align-items: center;
  gap: 5px;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header label {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 400;
  line-height: 120%;
  cursor: pointer;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header label > .required {
  color: #ec0047;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header .accordion-toggle {
  cursor: pointer;
  transition: transform 0.2s ease;
  width: 18px;
  height: 18px;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header .accordion-toggle.rotate {
  transform: rotate(180deg);
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-content {
  background: #F4F4F4;
  border-radius: 5px;
  color: #2F2F2F;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%;
  width: 100%;
  box-sizing: border-box;
  text-align: left;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(20px);
  transition: max-height 0.3s ease, opacity 0.3s ease, transform 0.3s ease, padding 0.3s ease, margin 0.3s ease, border 0.3s ease;
  padding: 0 20px;
  margin-top: 0;
  border: 0 solid #D7D7D7;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion.open .accordion-content {
  max-height: 200px;
  overflow-y: auto;
  opacity: 1;
  transform: translateY(0);
  padding: 20px;
  margin-top: 10px;
  border: 1px solid #D7D7D7;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion.open .accordion-content .accordion-close {
  display: block;
  margin: 16px auto 0;
  padding: 8px 24px;
  border: 1px solid #EC0047;
  border-radius: 999px;
  background: transparent;
  color: #EC0047;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion.open .accordion-content .accordion-close:hover {
  background: #EC0047;
  color: #fff;
}
#report.container .diagnosis-modal-wrapper .contents .privacy .error {
  display: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #e60724;
}
#report.container .diagnosis-modal-wrapper .contents .modal-footer {
  width: calc(100% + 56px);
  margin-left: -28px;
  margin-right: -28px;
  padding: 12px 28px 0;
  position: relative;
  display: flex;
  justify-content: center;
}
#report.container .diagnosis-modal-wrapper .contents .modal-footer::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 12px;
  left: 0;
  bottom: 123%;
  z-index: 100;
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.06)));
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.06));
  opacity: 0;
  transition: opacity 0.3s ease;
}
#report.container .diagnosis-modal-wrapper .contents .modal-footer.has-scroll::before {
  opacity: 1;
}
#report.container .diagnosis-modal-wrapper .contents .diagnosis-btn {
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 38px;
  min-width: 90px;
  width: max-content;
  padding: 12px 18px;
  border-radius: 999px;
  border: 1px solid #EC0047;
  background: #EC0047;
  color: #fff;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%; /* 14px */
  cursor: pointer;
  transition: all 0.3s ease;
}
#report.container .diagnosis-modal-wrapper .contents .diagnosis-btn:hover {
  filter: brightness(0.84);
}
#report.container .diagnosis-modal-wrapper .contents .diagnosis-btn:disabled {
  background-color: #D7D7D7;
  color: #fff;
  border: none;
  filter: none;
  cursor: initial;
}

@media (max-width: 768px) {
  #report.container {
    min-width: 100%;
  }
  #report.container .pc {
    display: none;
  }
  #report.container .pc-flex {
    display: none;
  }
  #report.container .mo {
    display: block;
  }
  #report.container .mo-flex {
    display: flex;
  }
  #report.container .section__title {
    flex-direction: column;
    gap: 16px;
  }
  #report.container .section__title .title {
    color: #2F2F2F;
    font-size: 22px;
    font-weight: 700;
    line-height: 120%;
    margin-right: 0;
  }
  #report.container .section__title .sub-title {
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
    padding-left: 0;
    border-left: none;
  }
  #report.container .report-top__wrap {
    max-height: initial;
    height: auto;
    background: #2B396F;
  }
  #report.container .report-top__wrap .report-top {
    display: flex;
    flex-direction: column-reverse;
    padding: 96px 0 24px;
    gap: 46px;
    z-index: 1;
    position: relative;
  }
  #report.container .report-top__wrap .report-top:lang(en), #report.container .report-top__wrap .report-top:lang(ja) {
    padding: 96px 0 24px;
    flex-direction: column-reverse;
  }
  #report.container .report-top__wrap .report-top:before {
    z-index: -1;
    content: "";
    position: absolute;
    top: 0;
    left: -20px;
    width: calc(100% + 40px);
    height: 100%;
    background: #000 url(https://dream-cdn.beusable.net/home/images/cx_trend/cxdata-main-bg.png) no-repeat top -79px left -151px;
  }
  #report.container .report-top__wrap .report-top__latest {
    position: unset;
    transform: initial;
    padding: 28px 0;
    border-radius: 0;
    border: none;
    background: initial;
    backdrop-filter: initial;
    width: 100%;
  }
  #report.container .report-top__wrap .report-top__latest .latest-header {
    flex-direction: column;
    text-align: center;
    gap: 16px;
  }
  #report.container .report-top__wrap .report-top__latest .latest-header__title {
    font-size: 22px;
    font-weight: 700;
    line-height: 120%;
  }
  #report.container .report-top__wrap .report-top__latest .latest-header__desc {
    color: #fff;
    letter-spacing: 0;
    line-height: 150%;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content {
    flex-direction: column;
    align-items: center;
    gap: 27px;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__img {
    align-self: center;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__img:after {
    display: none;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary {
    width: 100%;
    align-items: center;
    gap: 24px;
    padding: 0;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .report-view-btn {
    order: 0;
    max-width: 335px;
    width: 100%;
    height: 48px;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .report-view-btn .btn-text {
    font-size: 18px;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .report-view-btn .icon--arrow-red {
    width: 20px;
    height: 20px;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__title {
    display: none;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__list {
    margin: 0;
    order: 1;
    gap: 9px;
    flex-direction: column;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__list li {
    width: auto;
    color: rgba(55, 98, 243, 0.4);
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__list li:before {
    width: 12px;
    height: 12px;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__list li span {
    font-size: 12px;
    line-height: 120%;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__info {
    margin-top: 0;
    order: 2;
    flex-direction: column;
    gap: 11px;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__info .info {
    color: #99A1AF;
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__info .icon-calendar {
    background-image: url(https://dream-cdn.beusable.net/home/images/cx_trend/icon-calendar--light.svg);
  }
  #report.container .report-top__wrap .report-top__latest .latest-content__summary .content--summary__info .icon-views {
    background-image: url(https://dream-cdn.beusable.net/home/images/cx_trend/icon-views--light.svg);
  }
  #report.container .report-top__wrap .report-top__notice {
    justify-content: center;
  }
  #report.container .report-top__wrap .report-top__notice .notice-inner {
    flex-direction: column-reverse;
    text-align: center;
    padding: 24px;
    gap: 20px;
    border-radius: 20px;
  }
  #report.container .report-top__wrap .report-top__notice .division {
    width: 100%;
    height: 1px;
  }
  #report.container .report-top__wrap .report-top__notice .notice-list {
    gap: 20px;
    width: 100%;
  }
  #report.container .report-top__wrap .report-top__notice .notice-list__item {
    min-width: 100%;
    align-items: flex-start;
  }
  #report.container .report-top__wrap .report-top__notice .notice-list__item .item-desc {
    line-height: 1;
    text-align: left;
  }
  #report.container .report-top__wrap .report-top__notice .notice-list__item .item-value {
    font-size: 16px;
    text-align: right;
    white-space: nowrap;
  }
  #report.container .report-top__wrap .report-top__notice .notice-wrap {
    padding: 0;
    width: 100%;
  }
  #report.container .report-top__wrap .report-top__notice .notice-wrap__title {
    color: #fff;
    font-size: 13px;
  }
  #report.container .report-top__wrap .report-top__notice .notice-wrap__desc {
    color: #fff;
    font-weight: 400;
    line-height: 100%;
  }
  #report.container .report-top__wrap .report-top__title {
    font-size: 30px;
    font-weight: 600;
    line-height: 120%;
    letter-spacing: 0;
    padding: 0;
    margin: 0;
    text-align: center;
  }
  #report.container .last-report__section .inner {
    padding-top: 63px;
    padding-bottom: 108px;
  }
  #report.container .last-report__section .last-report__card .slick-dots {
    bottom: -28px;
  }
  #report.container .benchmarks__section {
    min-height: 797px;
  }
  #report.container .benchmarks__section .inner {
    padding-top: 70px;
    padding-bottom: 140px;
  }
  #report.container .benchmarks__section .benchmarks__list .list-wrap {
    grid-template-columns: repeat(1, 1fr);
    gap: 8px;
  }
  #report.container .benchmarks__section .benchmarks__list .benchmarks__item:after {
    content: "";
    display: block;
    flex-shrink: 0;
    width: 16px;
    background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon-arrow-red.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 16px;
    rotate: 90deg;
  }
  #report.container .benchmarks__section .section__content.is-default .benchmarks__list button {
    border-radius: 8px;
    height: 48px;
    padding: 0 16px;
    justify-content: space-between;
  }
  #report.container .benchmarks__section .section__content.is-fixed {
    top: 0;
    gap: 4px;
    transform: translate(0, 57px);
    min-width: initial;
    flex-direction: column;
    padding: 7px 20px 16px;
  }
  #report.container .benchmarks__section .section__content.is-fixed .label {
    padding: 0 4px;
    color: #BBB;
    font-size: 13px;
  }
  #report.container .benchmarks__section .section__content.is-fixed .benchmarks__list {
    max-width: initial;
    width: 100%;
    border-radius: 5px;
    background: #555;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
    padding: 9px 9px 9px 12px;
  }
  #report.container .benchmarks__section .section__content.is-fixed .benchmarks__list.is-open .list-wrap {
    gap: 0;
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
  }
  #report.container .benchmarks__section .section__content.is-fixed .benchmarks__list .benchmarks__item {
    color: #FFF;
    padding: 11px 10px;
    height: 36px;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
  }
  #report.container .benchmarks__section .section__content.is-fixed .benchmarks__list .benchmarks__item:hover {
    color: #fff;
    background-color: #333;
  }
  #report.container .benchmarks__section .section__content.is-fixed .benchmarks__list .benchmarks__item.is-selected {
    font-weight: 600;
    background-color: #444;
  }
  #report.container .benchmarks__section .section__content.is-fixed .benchmarks__list .benchmarks__item:after {
    display: none;
  }
  #report.container .benchmarks__section .section__content.is-fixed .benchmarks__list .selected {
    color: #FFF;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  #report.container .benchmarks__section .section__content.is-fixed .benchmarks__list .selected:after {
    content: "";
    display: block;
    flex-shrink: 0;
    width: 20px;
    background-image: url("https://dream-cdn.beusable.net/home/images/cx_trend/icon--arrow-down.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 20px;
  }
  #report.container .benchmarks__section .section__content.is-fixed .benchmarks__list .list-wrap {
    transition: opacity 0.3s ease-in-out;
    border-radius: 5px;
    border: 1px solid #B1B1B1;
    background: #555;
    box-shadow: 0 20px 16px -12px rgba(0, 0, 0, 0.12);
    position: absolute;
    top: 23px;
    left: 50%;
    width: calc(100% - 40px);
    transform: translateX(-50%);
    grid-template-columns: repeat(1, 1fr);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
  #report.container .diagnosis-modal-wrapper .contents {
    max-height: 100%;
    height: 100%;
    border-radius: 0;
    width: 100%;
    max-width: 100%;
  }
  #report.container .diagnosis-modal-wrapper .contents .scroll-content {
    padding-right: 28px;
  }
}
body:has(#report) #header-mobile.cx-header {
  background-color: transparent;
  position: fixed;
  transition: all 0.3s ease-in-out;
  z-index: 101;
}
body:has(#report) #header-mobile.cx-header.is-scroll {
  background-color: #000;
}
body:has(#report) #header.cx-header.container {
  position: absolute;
  background-color: transparent;
}
body:has(#report) #header.cx-header.container .navigation > div > a {
  color: #fff;
}
body:has(#report) #header.cx-header.container .navigation > div > a.selected {
  color: #ec0047;
}
body:has(#report) #header.cx-header.container .navigation > div:hover > a {
  color: rgba(255, 255, 255, 0.75);
}
body:has(#report) #header.cx-header.container .navigation > div:hover > a.selected {
  color: #ec0047;
}
body:has(#report) #header.cx-header.container .buttons .button.start {
  background-color: #fff;
  color: #222;
}
body:has(#report) #header.cx-header.container .buttons .button.start:hover {
  background-color: rgba(255, 255, 255, 0.84);
}
body:has(#report) #header.cx-header.container .buttons .button.signin {
  border-color: #fff;
  color: #fff;
}
body:has(#report) #header.cx-header.container .buttons .button.signin:hover {
  background-color: #fff;
  color: #222;
}

.cx-insight-container {
  min-width: 1170px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 260px;
  font-family: "Pretendard Variable";
  box-sizing: border-box;
  margin: 0 auto;
  position: relative;
}
.cx-insight-container .aiday__navigation.mobile {
  display: none;
}
.cx-insight-container .aiday__navigation.pc {
  position: fixed;
}
.cx-insight-container .aiday__navigation.pc .navigation-button {
  position: fixed;
  top: 46%;
  opacity: 0.62;
  cursor: pointer;
}
.cx-insight-container .aiday__navigation.pc .navigation-button i {
  display: inline-block;
  width: 60px;
  height: 60px;
  background-repeat: no-repeat;
  background-size: 60px;
}
.cx-insight-container .aiday__navigation.pc .navigation-button.left {
  left: 0;
  rotate: -180deg;
}
.cx-insight-container .aiday__navigation.pc .navigation-button.left .icon-right-arrow {
  background-image: url("../../images/icon-right-arrow-black.svg");
}
.cx-insight-container .aiday__navigation.pc .navigation-button.right {
  right: 0;
}
.cx-insight-container .aiday__navigation.pc .navigation-button.right .icon-right-arrow {
  background-image: url("../../images/icon-right-arrow-black.svg");
}
.cx-insight-container .aiday__navigation.pc .navigation-button:hover {
  opacity: 1;
}
.cx-insight-container .aiday__navigation.pc .navigation-button.disable {
  opacity: 0.25;
  cursor: default;
}
.cx-insight-container .container {
  min-width: 1170px;
  display: flex;
  flex-direction: column;
  gap: 68px;
}
.cx-insight-container .container .title-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cx-insight-container .container .title-wrapper .title {
  color: #EC0047;
  font-size: 48px;
  font-weight: 700;
  line-height: 150%; /* 72px */
  letter-spacing: -0.96px;
}
.cx-insight-container .container .title-wrapper .desc {
  color: #444;
  font-size: 28px;
  font-weight: 700;
  line-height: 150%; /* 42px */
  letter-spacing: -0.56px;
}
.cx-insight-container .cx-insight-main-container {
  display: flex;
  flex-direction: column;
  gap: 36px;
  position: relative;
}
.cx-insight-container .cx-insight-main-container .main-bg {
  position: absolute;
  top: 50px;
  left: 600px;
  width: 1135px;
  height: 1063px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/cx-insight-bg-1.png");
  background-repeat: no-repeat;
  background-size: 1135px 1063px;
  z-index: -1;
}
.cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper {
  min-width: 1170px;
  margin-top: 148px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper {
  display: flex;
  flex-direction: column;
  gap: 12px;
  color: #222;
}
.cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .mobile-presentation, .cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .mobile-title-wrapper {
  display: none;
}
.cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .title {
  font-size: 114px;
  font-weight: 800;
  line-height: 85%;
  display: flex;
  align-items: center;
  gap: 50px;
}
.cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .title .ai {
  font-weight: 700;
}
.cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .title .presentation {
  color: #EC0047;
  font-size: 26px;
  font-weight: 700;
  line-height: 85%; /* 22.1px */
  letter-spacing: -0.52px;
}
.cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .main-title {
  font-size: 125px;
  line-height: 85%;
  font-weight: 700;
}
.cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .sub-title {
  color: #13A5BF;
  font-size: 48px;
  font-weight: 700;
  line-height: 130%; /* 62.4px */
  letter-spacing: -1.44px;
}
.cx-insight-container .cx-insight-main-container .cx-insight-link-wrapper {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 22px;
}
.cx-insight-container .cx-insight-main-container .cx-insight-link-wrapper .link {
  width: 148px;
  height: 148px;
  border-radius: 50%;
  color: #FFF;
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%; /* 28.8px */
  letter-spacing: -0.48px;
  background-color: #ec0047;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.cx-insight-container .cx-insight-main-container .cx-insight-link-wrapper .link a {
  color: #fff;
}
.cx-insight-container .cx-insight-main-container .cx-insight-link-wrapper .link.link2 {
  background-color: #13A5BF;
}
.cx-insight-container .cx-insight-main-container .cx-insight-link-wrapper .link.disabled {
  pointer-events: none;
  background-color: rgba(0, 0, 0, 0.16);
}
.cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper .info {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #222;
  font-family: "Pretendard Variable";
  font-weight: 700;
}
.cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper .info .label {
  width: 68px;
  font-size: 22px;
  letter-spacing: -0.44px;
}
.cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper .info .content {
  font-size: 32px;
  letter-spacing: -0.96px;
}
.cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper .info .content .content-small {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.66px;
}
.cx-insight-container .ai-feature.container {
  margin-top: -40px;
  position: relative;
}
.cx-insight-container .ai-feature.container .feature-bg {
  width: 1135px;
  height: 1063px;
  position: absolute;
  top: -55%;
  left: -97%;
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/cx-insight-bg-2.png");
  background-repeat: no-repeat;
  background-size: 1135px 1063px;
  z-index: -1;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box {
  max-width: 575px;
  display: flex;
  flex-direction: column;
  gap: 34px;
  padding: 52px 40px;
  border-radius: 24px;
  color: #fff;
  box-sizing: border-box;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .ai-feature-title-wrapper {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .ai-feature-title-wrapper .title {
  font-size: 67px;
  font-weight: 800;
  line-height: 100%; /* 67px */
  letter-spacing: -1.34px;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .ai-feature-title-wrapper .sub {
  text-align: right;
  font-size: 22px;
  font-weight: 700;
  line-height: 150%; /* 33px */
  letter-spacing: -0.44px;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .line {
  width: 52px;
  height: 4px;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 50px;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .desc {
  color: rgba(255, 255, 255, 0.7);
  font-size: 18px;
  font-weight: 500;
  line-height: 150%; /* 27px */
  letter-spacing: -0.36px;
  margin-bottom: 4px;
  word-break: keep-all;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .desc.semi-strong {
  color: rgba(255, 255, 255, 0.9);
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #FFF;
  font-size: 22px;
  font-weight: 600;
  line-height: 170%; /* 37.4px */
  letter-spacing: -0.44px;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li .icon-wrap {
  display: flex;
  align-items: center;
  width: 26px;
  height: 26px;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li .icon-wrap i {
  display: inline-block;
  width: 26px;
  height: 20px;
  background-repeat: no-repeat;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li .icon-wrap i.icon-red-check {
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-red-check.svg");
  background-size: 26px;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li .icon-wrap i.icon-black-check {
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-black-check.svg");
  background-size: 26px;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box.cx-wrapper {
  background-color: #222;
}
.cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box.login-wrapper {
  background-color: #13A5BF;
}
.cx-insight-container .schedule.container .schedule-content-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.cx-insight-container .schedule.container .schedule-content-wrapper .schedule {
  display: flex;
  align-items: center;
  gap: 30px;
  padding: 28px 0;
  border-bottom: 2px solid #d7d7d7;
}
.cx-insight-container .schedule.container .schedule-content-wrapper .schedule:last-child {
  border-bottom: none;
}
.cx-insight-container .schedule.container .schedule-content-wrapper .schedule .left {
  display: flex;
  align-items: center;
  gap: 32px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.44px;
}
.cx-insight-container .schedule.container .schedule-content-wrapper .schedule .left .time {
  color: #222;
}
.cx-insight-container .schedule.container .schedule-content-wrapper .schedule .left .session {
  color: #ec0047;
  min-width: 240px;
}
.cx-insight-container .schedule.container .schedule-content-wrapper .schedule .right .session-title {
  color: #222;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.64px;
}
.cx-insight-container .benefit.container {
  position: relative;
}
.cx-insight-container .benefit.container .benefit-bg {
  width: 1135px;
  height: 1063px;
  position: absolute;
  top: -9%;
  left: -64%;
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/cx-insight-bg-1.png");
  background-repeat: no-repeat;
  background-size: 1135px 1063px;
  z-index: -1;
}
.cx-insight-container .benefit.container .benefit-content-container {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.cx-insight-container .benefit.container .benefit-content-container .content-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 440px;
  padding: 32px;
  box-sizing: border-box;
  gap: 48px;
  border-radius: 20px;
  background: #13A5BF;
}
.cx-insight-container .benefit.container .benefit-content-container .content-wrapper .icon-wrap {
  display: inline-block;
  width: 76px;
  height: 76px;
}
.cx-insight-container .benefit.container .benefit-content-container .content-wrapper .icon-wrap i {
  display: inline-block;
  width: 76px;
  height: 76px;
}
.cx-insight-container .benefit.container .benefit-content-container .content-wrapper .icon-wrap i.icon-benefit-1 {
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-benefit_1.svg");
}
.cx-insight-container .benefit.container .benefit-content-container .content-wrapper .icon-wrap i.icon-benefit-2 {
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-benefit_2.svg");
}
.cx-insight-container .benefit.container .benefit-content-container .content-wrapper .icon-wrap i.icon-benefit-3 {
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-benefit_3.svg");
}
.cx-insight-container .benefit.container .benefit-content-container .content-wrapper .content {
  display: flex;
  flex-direction: column;
  gap: 21px;
  color: #FFF;
  font-size: 28px;
  font-weight: 600;
  line-height: 120%; /* 33.6px */
  letter-spacing: -0.56px;
}
.cx-insight-container .benefit.container .benefit-content-container .content-wrapper .content .line {
  width: 22px;
  height: 4px;
  border-radius: 50px;
  background-color: #fff;
}
.cx-insight-container .benefit.container .benefit-content-container .content-wrapper .content .desc {
  font-size: 22px;
  line-height: 130%; /* 28.6px */
  letter-spacing: -0.44px;
}
.cx-insight-container .propose.container .propose-content-container {
  width: 100%;
  display: flex;
  padding: 80px 60px 84px 60px;
  gap: 40px;
  border-radius: 20px;
  background-color: #222;
  box-sizing: border-box;
}
.cx-insight-container .propose.container .propose-content-container .icon-dashed {
  display: inline-block;
  width: 3px;
  height: 295px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-dashed.svg");
}
.cx-insight-container .propose.container .propose-content-container .content-wrapper {
  flex: 1;
  width: 100%;
  display: flex;
}
.cx-insight-container .propose.container .propose-content-container .content-wrapper .content {
  display: flex;
  flex-direction: column;
  gap: 48px;
  color: #FFF;
}
.cx-insight-container .propose.container .propose-content-container .content-wrapper .content .title {
  font-size: 32px;
  font-weight: 700;
  line-height: 120%; /* 38.4px */
  letter-spacing: -0.64px;
}
.cx-insight-container .propose.container .propose-content-container .content-wrapper .content ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.cx-insight-container .propose.container .propose-content-container .content-wrapper .content ul .text {
  font-size: 18px;
  font-weight: 600;
  line-height: 130%; /* 23.4px */
  letter-spacing: -0.36px;
  display: flex;
  align-items: flex-start;
  gap: 4px;
}
.cx-insight-container .propose.container .propose-content-container .content-wrapper .content ul .text .icon-wrap {
  display: inline-block;
  width: 14px;
  height: 14px;
}
.cx-insight-container .propose.container .propose-content-container .content-wrapper .content ul .text .icon-wrap .icon-right-arrow {
  display: inline-block;
  width: 14px;
  height: 14px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-cx-insight-arrow.svg");
  background-size: 14px;
  background-repeat: no-repeat;
}
.cx-insight-container .question.container {
  max-width: 1170px;
}
.cx-insight-container .question.container .question-content-container {
  display: flex;
  flex-direction: column;
}
.cx-insight-container .question.container .question-content-container .content {
  display: flex;
  flex-direction: column;
  gap: 32px;
  border-bottom: 1px solid #d7d7d7;
  padding: 60px 0;
}
.cx-insight-container .question.container .question-content-container .content:first-child {
  padding-top: 0;
}
.cx-insight-container .question.container .question-content-container .content:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.cx-insight-container .question.container .question-content-container .content .title {
  color: #13A5BF;
  font-size: 48px;
  font-weight: 700;
  line-height: 130%; /* 62.4px */
  letter-spacing: -0.96px;
}
.cx-insight-container .question.container .question-content-container .content .desc {
  color: #222;
  font-size: 32px;
  font-weight: 500;
  line-height: 130%; /* 41.6px */
  letter-spacing: -0.64px;
}
.cx-insight-container .footer-container {
  width: 100%;
  height: 826px;
  background-color: #1f1f1f;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 56px;
  margin-top: 16px;
  overflow: hidden;
  position: relative;
}
.cx-insight-container .footer-container .footer-title-wrapper {
  margin-top: 141px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  position: relative;
  z-index: 2;
}
.cx-insight-container .footer-container .footer-title-wrapper .title {
  color: #FFF;
  text-align: center;
  font-size: 67px;
  font-weight: 600;
  letter-spacing: -1.34px;
}
.cx-insight-container .footer-container .footer-title-wrapper .desc {
  color: #EC0047;
  text-align: center;
  font-size: 28px;
  font-weight: 700;
  line-height: 150%; /* 42px */
  letter-spacing: -0.56px;
}
.cx-insight-container .footer-container .link-container {
  display: flex;
  flex-direction: column;
  gap: 37px;
  position: relative;
  z-index: 2;
}
.cx-insight-container .footer-container .link-container .link-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
}
.cx-insight-container .footer-container .link-container .link-wrapper .link {
  width: 253px;
  height: 85px;
  background-color: #ec0047;
  border-radius: 100px;
  padding: 28px 40px;
  box-sizing: border-box;
  color: #FFF;
  text-align: center;
  font-size: 24px;
  font-weight: 800;
  line-height: 120%; /* 28.8px */
  letter-spacing: -0.48px;
}
.cx-insight-container .footer-container .link-container .link-wrapper .link.disabled {
  pointer-events: none;
  background-color: #D7D7D7;
}
.cx-insight-container .footer-container .link-container .link-wrapper .conditions {
  color: #FFF;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  line-height: 130%; /* 28.6px */
  letter-spacing: -0.44px;
}
.cx-insight-container .footer-container .link-container .contactus-wrapper {
  width: 431px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.cx-insight-container .footer-container .link-container .contactus-wrapper .contact {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: #FFF;
  font-size: 18px;
  font-weight: 500;
  line-height: 130%; /* 23.4px */
}
.cx-insight-container .footer-container .link-container .contactus-wrapper .icon-wrap {
  display: inline-block;
  width: 24px;
  height: 24px;
}
.cx-insight-container .footer-container .link-container .contactus-wrapper .icon-wrap i {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
}
.cx-insight-container .footer-container .link-container .contactus-wrapper .email {
  text-decoration-line: underline;
}
.cx-insight-container .footer-container .link-container .contactus-wrapper .email .icon-email {
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-email.svg");
}
.cx-insight-container .footer-container .link-container .contactus-wrapper .contactus {
  text-align: left;
  margin-left: -20px;
}
.cx-insight-container .footer-container .link-container .contactus-wrapper .contactus .icon-call {
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-call.svg");
}
.cx-insight-container .footer-container .logo-wrapper {
  margin-top: 74px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 23px;
  position: relative;
  z-index: 2;
}
.cx-insight-container .footer-container .logo-wrapper .logo {
  width: 260px;
  height: 45px;
}
.cx-insight-container .footer-container .logo-wrapper .copyright {
  color: #FFF;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  line-height: 130%; /* 20.8px */
}
.cx-insight-container .footer-container .footer-bg-1 {
  width: 1194px;
  height: 826px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/cx-insight-bg-black.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  left: 56%;
  opacity: 0.2;
  z-index: 1;
}
.cx-insight-container .footer-container .footer-bg-2 {
  width: 1194px;
  height: 1055px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/202504/cx-insight-bg-black-2.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0%;
  left: 2%;
  opacity: 0.2;
  z-index: 1;
}

@media all and (max-width: 768px) {
  .cx-insight-container {
    min-width: 335px;
    gap: 100px;
  }
  .cx-insight-container .aiday__navigation.pc {
    display: none;
  }
  .cx-insight-container .aiday__navigation.mobile {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 5px;
  }
  .cx-insight-container .aiday__navigation.mobile .navigation-button {
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 100%;
    background-color: #FFF;
    filter: drop-shadow(0px 9px 9.5px rgba(0, 0, 0, 0.2)) drop-shadow(0px 0px 0px rgba(0, 0, 0, 0.16));
    box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
    cursor: pointer;
  }
  .cx-insight-container .aiday__navigation.mobile .navigation-button.right {
    rotate: 180deg;
    filter: drop-shadow(0px -9px 9.5px rgba(0, 0, 0, 0.2)) drop-shadow(0px 0px 0px rgba(0, 0, 0, 0.16));
  }
  .cx-insight-container .aiday__navigation.mobile .navigation-button.disable {
    opacity: 0.3;
    cursor: default;
  }
  .cx-insight-container .container {
    width: 100%;
    box-sizing: border-box;
    padding: 0 20px;
    min-width: 335px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }
  .cx-insight-container .container .title-wrapper {
    align-items: center;
  }
  .cx-insight-container .container .title-wrapper .title {
    font-size: 20px;
    letter-spacing: -0.4px;
  }
  .cx-insight-container .container .title-wrapper .desc {
    text-align: center;
    font-size: 14px;
    letter-spacing: -0.28px;
  }
  .cx-insight-container .cx-insight-main-container {
    align-items: center;
    gap: 24px;
    margin-top: 60px;
  }
  .cx-insight-container .cx-insight-main-container .main-bg {
    display: none;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper {
    min-width: 335px;
    margin-top: 32px;
    gap: 16px;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper {
    align-items: center;
    gap: 12px;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .title, .cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .main-title {
    display: none;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .mobile-presentation {
    display: block;
    color: #EC0047;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    line-height: 85%; /* 13.6px */
    letter-spacing: -0.32px;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .mobile-title-wrapper {
    display: block;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .cx-insight-title-wrapper .mobile-title-wrapper .mobile-title {
    color: #222;
    text-align: center;
    font-size: 44px;
    font-weight: 700;
    line-height: 100%; /* 43.826px */
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-main-wrapper .sub-title {
    text-align: center;
    color: #13A5BF;
    font-size: 20px;
    font-weight: 700;
    line-height: 130%; /* 26px */
    letter-spacing: -0.6px;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-link-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-link-wrapper .link {
    width: 100px;
    height: 100px;
    font-size: 16px;
    font-weight: 600;
    line-height: 120%; /* 28.8px */
    letter-spacing: -0.32px;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-link-wrapper .link.disabled {
    pointer-events: none;
    background-color: rgba(0, 0, 0, 0.16);
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper {
    gap: 12px;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper .info {
    color: #222;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper .info .label {
    width: 44px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.24px;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper .info .content {
    font-size: 14px;
    letter-spacing: -0.42px;
  }
  .cx-insight-container .cx-insight-main-container .cx-insight-info-wrapper .info .content .content-small {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.42px;
  }
  .cx-insight-container .ai-feature.container {
    margin-top: 0px;
  }
  .cx-insight-container .ai-feature.container .feature-bg {
    display: none;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper {
    gap: 16px;
    justify-content: center;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box {
    max-width: 575px;
    gap: 8px;
    padding: 20px;
    border-radius: 16px;
    align-items: center;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .ai-feature-title-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    justify-content: initial;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .ai-feature-title-wrapper .title {
    font-size: 28px;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: -0.56px;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .ai-feature-title-wrapper .sub {
    text-align: center;
    font-size: 14px;
    letter-spacing: -0.28px;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .line {
    margin: 16px 0;
    width: 27px;
    height: 2px;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .desc {
    font-size: 14px;
    font-weight: 700;
    line-height: 150%; /* 27px */
    letter-spacing: -0.28px;
    margin-bottom: 0px;
    text-align: center;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 20px 16px 20px 0px;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li {
    font-size: 16px;
    letter-spacing: -0.32px;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li .icon-wrap {
    width: 16px;
    height: 16px;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li .icon-wrap i {
    width: 16px;
    height: 10px;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li .icon-wrap i.icon-red-check {
    background-size: 16px;
  }
  .cx-insight-container .ai-feature.container .ai-feature-content-wrapper .box .content ul li .icon-wrap i.icon-black-check {
    background-size: 16px;
  }
  .cx-insight-container .schedule.container .schedule-content-wrapper {
    display: flex;
    flex-direction: column;
  }
  .cx-insight-container .schedule.container .schedule-content-wrapper .schedule {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 0;
    border-bottom: 1px solid #d7d7d7;
  }
  .cx-insight-container .schedule.container .schedule-content-wrapper .schedule .left {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.24px;
  }
  .cx-insight-container .schedule.container .schedule-content-wrapper .schedule .left .time {
    color: #222;
  }
  .cx-insight-container .schedule.container .schedule-content-wrapper .schedule .left .session {
    color: #ec0047;
    min-width: 240px;
  }
  .cx-insight-container .schedule.container .schedule-content-wrapper .schedule .right .session-title {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.32px;
  }
  .cx-insight-container .benefit.container .benefit-bg {
    display: none;
  }
  .cx-insight-container .benefit.container .benefit-content-container {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    align-items: center;
    gap: 8px;
  }
  .cx-insight-container .benefit.container .benefit-content-container .content-wrapper {
    width: 100%;
    height: 145px;
    flex-direction: row;
    padding: 16px;
    gap: 16px;
    border-radius: 12px;
  }
  .cx-insight-container .benefit.container .benefit-content-container .content-wrapper .icon-wrap {
    display: inline-block;
    width: 56px;
    height: 56px;
  }
  .cx-insight-container .benefit.container .benefit-content-container .content-wrapper .icon-wrap i {
    display: inline-block;
    width: 56px;
    height: 56px;
    background-size: 56px;
  }
  .cx-insight-container .benefit.container .benefit-content-container .content-wrapper .content {
    margin-top: 8px;
    gap: 12px;
    font-size: 16px;
    letter-spacing: -0.32px;
  }
  .cx-insight-container .benefit.container .benefit-content-container .content-wrapper .content .line {
    width: 20px;
    height: 2px;
    margin-left: 6px;
  }
  .cx-insight-container .benefit.container .benefit-content-container .content-wrapper .content .desc {
    font-size: 14px;
    letter-spacing: -0.28px;
  }
  .cx-insight-container .propose.container .propose-content-container {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px 20px;
    gap: 28px;
    border-radius: 12px;
  }
  .cx-insight-container .propose.container .propose-content-container .icon-dashed {
    width: 100%;
    height: 2px;
    background-image: url("https://dream-cdn.beusable.net/home/thday/202504/icon-dashed-mobile.svg");
    background-repeat: repeat;
    background-position: center;
  }
  .cx-insight-container .propose.container .propose-content-container .content-wrapper {
    width: 100%;
  }
  .cx-insight-container .propose.container .propose-content-container .content-wrapper .content {
    gap: 24px;
  }
  .cx-insight-container .propose.container .propose-content-container .content-wrapper .content .title {
    font-size: 18px;
    letter-spacing: -0.36px;
  }
  .cx-insight-container .propose.container .propose-content-container .content-wrapper .content ul {
    gap: 12px;
  }
  .cx-insight-container .propose.container .propose-content-container .content-wrapper .content ul .text {
    font-size: 14px;
    letter-spacing: -0.28px;
  }
  .cx-insight-container .propose.container .propose-content-container .content-wrapper .content ul .text .icon-wrap {
    margin-top: 2px;
    transform: rotate(0);
    width: 14px;
    height: 14px;
  }
  .cx-insight-container .propose.container .propose-content-container .content-wrapper .content ul .text .icon-wrap .icon-right-arrow {
    width: 14px;
    height: 14px;
    background-size: 14px;
  }
  .cx-insight-container .question.container .question-content-container {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
  }
  .cx-insight-container .question.container .question-content-container .content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px 0;
  }
  .cx-insight-container .question.container .question-content-container .content .title {
    font-size: 18px;
    letter-spacing: -0.36px;
  }
  .cx-insight-container .question.container .question-content-container .content .desc {
    color: #222;
    font-size: 14px;
    letter-spacing: -0.28px;
    word-break: break-all;
  }
  .cx-insight-container .footer-container {
    align-items: center;
    height: 426px;
    gap: 28px;
    margin-top: 0;
  }
  .cx-insight-container .footer-container .footer-title-wrapper {
    margin-top: 32px;
    gap: 12px;
  }
  .cx-insight-container .footer-container .footer-title-wrapper .title {
    font-size: 20px;
    letter-spacing: -0.4px;
  }
  .cx-insight-container .footer-container .footer-title-wrapper .desc {
    font-size: 14px;
    letter-spacing: -0.28px;
  }
  .cx-insight-container .footer-container .link-container {
    gap: 16px;
  }
  .cx-insight-container .footer-container .link-container .link-wrapper {
    gap: 16px;
  }
  .cx-insight-container .footer-container .link-container .link-wrapper .link {
    width: 224px;
    height: 48px;
    padding: 12px 40px;
    font-size: 20px;
    letter-spacing: -0.4px;
  }
  .cx-insight-container .footer-container .link-container .link-wrapper .link.disabled {
    pointer-events: none;
    background-color: #D7D7D7;
  }
  .cx-insight-container .footer-container .link-container .link-wrapper .conditions {
    font-size: 14px;
    letter-spacing: -0.28px;
  }
  .cx-insight-container .footer-container .link-container .contactus-wrapper {
    width: 216px;
    align-items: flex-start;
    gap: 8px;
    margin-left: 12px;
  }
  .cx-insight-container .footer-container .link-container .contactus-wrapper .contact {
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    line-height: 130%; /* 23.4px */
  }
  .cx-insight-container .footer-container .link-container .contactus-wrapper .icon-wrap {
    display: inline-block;
    width: 16px;
    height: 16px;
  }
  .cx-insight-container .footer-container .link-container .contactus-wrapper .icon-wrap i {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-size: 16px;
  }
  .cx-insight-container .footer-container .link-container .contactus-wrapper .contactus {
    text-align: left;
    margin-left: 0px;
  }
  .cx-insight-container .footer-container .logo-wrapper {
    margin-top: 28px;
    gap: 16px;
  }
  .cx-insight-container .footer-container .logo-wrapper .logo {
    width: 186px;
    height: 35px;
  }
  .cx-insight-container .footer-container .logo-wrapper .copyright {
    font-size: 14px;
    letter-spacing: 0;
  }
  .cx-insight-container .footer-container .footer-bg-1, .cx-insight-container .footer-container .footer-bg-2 {
    display: none;
  }
}
.docent.container .docent.contents {
  margin-bottom: 200px !important;
}
.docent.container .docent.contents .title-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
  width: 970px;
  margin-top: 110px;
}
.docent.container .docent.contents .title-wrapper .title {
  color: #EC0047;
  text-align: center;
  font-size: 67px;
  font-weight: 700;
  line-height: 77px; /* 114.925% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .title-wrapper .sub-title {
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .title-wrapper .desc {
  color: #222;
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: 42px; /* 161.538% */
}
.docent.container .docent.contents .title-wrapper .img-wrap {
  margin-top: 20px;
}
.docent.container .docent.contents .title-wrapper .img-wrap .icon-docent {
  width: 770px;
  height: 410px;
}
.docent.container .docent.contents .features-wrapper {
  width: 1170px;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 196px;
}
.docent.container .docent.contents .features-wrapper .feature {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  text-align: center;
}
.docent.container .docent.contents .features-wrapper .feature:not(:first-child) {
  margin-top: 220px;
}
.docent.container .docent.contents .features-wrapper .feature .writing {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
}
.docent.container .docent.contents .features-wrapper .feature .writing .title {
  color: #222;
  font-size: 55px;
  font-weight: 700;
  line-height: 72px; /* 130.909% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .features-wrapper .feature .writing .caption {
  color: #444;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
.docent.container .docent.contents .features-wrapper .feature .writing .desc {
  color: #222;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px; /* 142.308% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .features-wrapper .feature .questions {
  margin-top: 132px;
  width: 800px;
  height: 390px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 29px;
  border-radius: 24px;
  border: 8px solid #0C1528;
  background: #FFF;
  box-shadow: 0px 20px 38px -10px rgba(0, 0, 0, 0.32);
  position: relative;
}
.docent.container .docent.contents .features-wrapper .feature .questions .icon-docent-question {
  width: 398px;
  height: 173px;
  position: absolute;
  top: -58%;
  transform: translateY(50%);
}
.docent.container .docent.contents .features-wrapper .feature .questions .title {
  color: #444;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
.docent.container .docent.contents .features-wrapper .feature .questions .desc {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.docent.container .docent.contents .features-wrapper .feature .questions .desc .text {
  color: #222;
  font-size: 20px;
  font-weight: 700;
  line-height: 32px; /* 160% */
  letter-spacing: -0.5px;
}
.docent.container .docent.contents .features-wrapper .feature .questions .desc .icon-line {
  display: inline-block;
  width: 620px;
  height: 2px;
  background-image: url("../../images/icon-line.svg");
}
.docent.container .docent.contents .features-wrapper .feature .versus {
  margin-top: 16px;
  width: 100%;
  height: 898px;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2), 0px 8px 15px 0px rgba(0, 0, 0, 0.16);
  padding: 48px 71px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 44px;
}
.docent.container .docent.contents .features-wrapper .feature .versus .versus-title-wrapper {
  text-align: center;
  color: #2F2F2F;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
}
.docent.container .docent.contents .features-wrapper .feature .versus .versus-title-wrapper .caption {
  color: #444;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc {
  display: flex;
  align-items: center;
  justify-content: center;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 442px;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .title {
  color: #222;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px; /* 142.308% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 19px;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .list .ai-desc {
  display: flex;
  width: 442px;
  height: 92px;
  padding: 16px 24px;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  background: #EBEBEB;
  box-sizing: border-box;
  color: #333;
  font-size: 18px;
  font-weight: 700;
  line-height: 23px; /* 127.778% */
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .list ul li {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 37px;
  text-align: left;
  color: #222;
  font-size: 20px;
  font-weight: 400;
  line-height: 37px; /* 185% */
  letter-spacing: -0.5px;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .list ul li .square {
  width: 4px;
  height: 4px;
  background-color: #222;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.ai-wrapper {
  border-right: 1px solid #bbb;
  padding-right: 72px;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.ai-wrapper .image-wrap {
  width: 442px;
  height: 239px;
  padding: 58px 101px 32px 101px;
  box-sizing: border-box;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.ai-wrapper .image-wrap .icon-ai-chatbot {
  width: 241px;
  height: 149px;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper {
  padding-left: 72px;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .title {
  color: #ec0047;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .image-wrap {
  width: 442px;
  height: 239px;
  padding: 31px 95px 31px 41px;
  box-sizing: border-box;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .image-wrap .icon-aireport {
  width: 306px;
  height: 178px;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .list .ai-desc {
  flex-direction: column;
  align-items: initial;
  gap: 14px;
  background: #222;
  color: #fff;
  text-align: left;
}
.docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .list ul li {
  font-weight: 700;
}
.docent.container .docent.contents .features-wrapper .feature .versus .footer-caption {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 37px;
  color: #222;
  font-size: 20px;
  font-weight: 500;
  line-height: 37px; /* 185% */
  letter-spacing: -0.5px;
}
.docent.container .docent.contents .features-wrapper .feature .article {
  margin-top: 52px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 36px;
  text-align: left;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .numbering-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .numbering-wrapper .number {
  width: 68px;
  height: 68px;
  border-radius: 100px;
  background: #EC0047;
  color: #FFF;
  text-align: center;
  font-family: NewRubrik;
  font-size: 44px;
  font-weight: 700;
  line-height: 70px; /* 159.091% */
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .numbering-wrapper .dot-container {
  position: absolute;
  top: 100%;
  margin: 9px 0;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .numbering-wrapper .dot-container .dot {
  width: 7px;
  height: 7px;
  background-color: #c7c7c7;
  border-radius: 100px;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .numbering-wrapper .dot-container .dot:not(:last-child) {
  margin-bottom: 8px;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content {
  width: 782px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  box-sizing: border-box;
  margin: 8px 0;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content:first-child {
  margin-top: 9px;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content .content {
  margin-left: 24px;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content .content .title {
  color: #444;
  font-size: 24px;
  font-weight: 700;
  line-height: 35px; /* 145.833% */
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content .content .desc {
  max-width: 757px;
  word-break: break-all;
  margin-top: 16px;
  color: #222;
  font-size: 20px;
  font-weight: 500;
  line-height: 37px; /* 185% */
  letter-spacing: -0.5px;
}
.docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content .icon-line {
  display: inline-block;
  width: 782px;
  height: 2px;
  background-image: url("../../images/icon-line.svg");
}
.docent.container .docent.contents .features-wrapper .feature .examples {
  width: 100%;
  margin-top: 16px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper .item {
  width: 100%;
  height: 232px;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2), 0px 8px 15px 0px rgba(0, 0, 0, 0.16);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 44px;
  padding: 44px;
  box-sizing: border-box;
  position: relative;
}
.docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper .item i {
  width: 144px;
  height: 144px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper .item .text {
  text-align: left;
  color: #444;
  font-size: 24px;
  font-weight: 700;
  line-height: 35px; /* 145.833% */
}
.docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper .item .user {
  position: absolute;
  right: 44px;
  bottom: 20px;
  color: #444;
  font-size: 20px;
  font-weight: 400;
  line-height: 37px; /* 185% */
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper {
  margin-top: 124px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 32px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper .icon-green-right-arrow {
  width: 60px;
  height: 60px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square) {
  width: 480px;
  height: 480px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 26px;
  border-radius: 100%;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).before {
  background: #EBEBEB;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).before .title {
  color: #222;
  text-align: center;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px; /* 142.308% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).before ul li {
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  color: #555;
  font-size: 20px;
  font-weight: 700;
  line-height: 26px; /* 130% */
  letter-spacing: -0.5px;
  padding-left: 10px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).before ul li:not(:last-child) {
  margin-bottom: 12px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).before ul li .square {
  width: 4px;
  height: 4px;
  background-color: #222;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after {
  background: #68A800;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after .title {
  color: #fff;
  text-align: center;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px; /* 142.308% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after ul li {
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  line-height: 26px; /* 130% */
  letter-spacing: -0.5px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after ul li:not(:last-child) {
  margin-bottom: 12px;
}
.docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after ul li .square {
  width: 4px;
  height: 4px;
  background-color: #fff;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-item-wrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 30px;
  margin-top: 32px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-item-wrap .tab {
  width: 370px;
  height: 190px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
  padding: 28px 25px;
  border: solid 3px #fff;
  text-align: left;
  border-radius: 7px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.14), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  cursor: pointer;
  transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.docent.container .docent.contents .features-wrapper .feature .purpose-item-wrap .tab:hover {
  box-shadow: 0 22px 33px -7px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.1);
}
.docent.container .docent.contents .features-wrapper .feature .purpose-item-wrap .tab.on {
  border: solid 3px #ec0047;
  box-shadow: 0 22px 33px -7px rgba(0, 0, 0, 0.15);
}
.docent.container .docent.contents .features-wrapper .feature .purpose-item-wrap .tab.on::after {
  content: "";
  position: absolute;
  bottom: -34px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 20px;
  background: url("https://dream-cdn.beusable.net/home/images/why/tab-select.svg") no-repeat center center;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-item-wrap .tab__title {
  color: #2F2F2F;
  font-size: 20px;
  font-weight: 700;
  line-height: 30px; /* 150% */
  margin-bottom: 4px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-item-wrap .tab__desc {
  color: #2F2F2F;
  font-size: 16px;
  font-weight: 700;
  line-height: 30px; /* 187.5% */
}
.docent.container .docent.contents .features-wrapper .feature .purpose-item-wrap .tab__author {
  color: #444;
  font-size: 14px;
  font-weight: 600;
  line-height: 23px; /* 164.286% */
}
.docent.container .docent.contents .features-wrapper .feature .purpose-item-wrap .tab__image {
  position: absolute;
  width: 60px;
  height: 60px;
  right: 10px;
  bottom: 18px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents {
  margin-top: 105px;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents:not(.marketing) {
  display: none;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents.fadein {
  animation: fadeIn 0.5s cubic-bezier(0, 0, 0.2, 1);
  animation-fill-mode: forwards;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 28px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li:not(:last-child) {
  margin-bottom: 36px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li .icon-line {
  display: inline-block;
  width: 1050px;
  height: 2px;
  background-image: url("../../images/icon-line.svg");
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li .number {
  width: 44px;
  height: 44px;
  color: #EC0047;
  font-size: 44px;
  font-weight: 700;
  line-height: 44px; /* 100% */
  font-family: NewRubrik;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li .content {
  text-align: left;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li .content .title {
  color: #222;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px; /* 142.308% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li .content .desc {
  margin-top: 12px;
  color: #222;
  font-size: 20px;
  font-weight: 500;
  line-height: 37px; /* 185% */
  letter-spacing: -0.5px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li .content-wrapper {
  display: flex;
  justify-content: center;
  gap: 16px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.result-wrapper {
  gap: 52px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.result-wrapper .result {
  display: flex;
  align-items: center;
  gap: 16px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.result-wrapper .result .text-wrapper {
  width: 674px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.result-wrapper .result .text-wrapper h2 {
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.result-wrapper .result .text-wrapper .count-wrapper {
  color: #EC0047;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.result-wrapper .result .text-wrapper .count-wrapper .caption {
  font-size: 16px;
  font-weight: 700;
  line-height: 16px; /* 100% */
  letter-spacing: -1px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.result-wrapper .result .text-wrapper .count-wrapper .count {
  margin-top: 12px;
  font-family: NewRubrik;
  font-size: 80px;
  font-weight: 700;
  line-height: 68px; /* 85% */
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.docent-example-wrapper {
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.docent-example-wrapper .content {
  max-width: 1050px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.docent.container .docent.contents .features-wrapper .feature .purpose-contents .item ul li.docent-example-wrapper .docent-example {
  width: 1168px;
  object-fit: cover;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper {
  margin-top: 69px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .img-develop {
  width: 1170px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents {
  margin-top: 60px;
  margin-bottom: 200px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-desc .title {
  color: #444;
  font-size: 24px;
  font-weight: 700;
  line-height: 35px; /* 145.833% */
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-desc .desc {
  margin-top: 16px;
  color: #222;
  font-size: 20px;
  font-weight: 500;
  line-height: 37px; /* 185% */
  letter-spacing: -0.5px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper {
  margin-top: 115px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .title {
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  margin-bottom: 125px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 30px;
  row-gap: 60px;
  max-width: 810px; /* 370px * 2 + 30px (gap) */
  margin: 0 auto;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item {
  flex: 0 0 370px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  width: 370px;
  height: 307px;
  transition: all 0.3s;
  box-sizing: border-box;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-benchmark {
  width: 370px;
  height: 180px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-aireport {
  width: 168px;
  height: 172px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-target {
  width: 370px;
  height: 180px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-core {
  width: 370px;
  height: 180px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-survey {
  width: 163px;
  height: 142px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-mpti {
  width: 198px;
  height: 137px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .item-title {
  margin-top: 10px;
  color: #2F2F2F;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
.docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .item-desc {
  text-align: center;
  color: #666;
  font-size: 15px;
  font-weight: 400;
  line-height: 23px; /* 153.333% */
}
.docent.container .docent.contents .features-wrapper .docent-footer {
  text-align: center;
}
.docent.container .docent.contents .features-wrapper .docent-footer .title {
  color: #222;
  font-size: 55px;
  font-weight: 700;
  line-height: 72px; /* 130.909% */
  letter-spacing: -1px;
  margin-bottom: 50px;
}
.docent.container .docent.contents .features-wrapper .docent-footer .desc {
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}

@media all and (max-width: 768px) {
  .docent.container {
    margin: 0 auto;
  }
  .docent.container .docent.contents {
    margin-bottom: 80px !important;
  }
  .docent.container .docent.contents .title-wrapper {
    text-align: center;
    width: 100%;
    gap: 15px;
    margin-top: 45px;
    border-bottom: 1px solid #c1c1c1;
    padding-bottom: 37px;
  }
  .docent.container .docent.contents .title-wrapper .title {
    font-size: 30px;
    line-height: 39px; /* 130% */
  }
  .docent.container .docent.contents .title-wrapper .sub-title {
    max-width: 335px;
    color: #333;
    font-size: 22px;
    font-weight: 700;
    line-height: 30px; /* 136.364% */
  }
  .docent.container .docent.contents .title-wrapper .desc {
    max-width: 335px;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
  }
  .docent.container .docent.contents .title-wrapper .img-wrap {
    margin-top: 18px;
  }
  .docent.container .docent.contents .title-wrapper .img-wrap .icon-docent {
    display: inline-block;
    width: 278px;
    height: 149px;
  }
  .docent.container .docent.contents .features-wrapper {
    max-width: 335px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 50px;
  }
  .docent.container .docent.contents .features-wrapper .feature {
    width: 100%;
    gap: 12px;
  }
  .docent.container .docent.contents .features-wrapper .feature:not(:first-child) {
    margin-top: 80px;
  }
  .docent.container .docent.contents .features-wrapper .feature .writing {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }
  .docent.container .docent.contents .features-wrapper .feature .writing .title {
    color: #333;
    font-size: 22px;
    font-weight: 700;
    line-height: 30px; /* 136.364% */
  }
  .docent.container .docent.contents .features-wrapper .feature .writing .caption {
    color: #767676;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
  }
  .docent.container .docent.contents .features-wrapper .feature .writing .desc {
    color: #2F2F2F;
    font-size: 20px;
    font-weight: 700;
    line-height: 26px; /* 130% */
  }
  .docent.container .docent.contents .features-wrapper .feature .questions {
    margin-top: 110px;
    width: 100%;
    height: 315px;
    gap: 41px;
    border-radius: 12px;
    border: 4px solid #0C1528;
    box-shadow: 0 20px 16px -12px rgba(0, 0, 0, 0.12);
    position: relative;
  }
  .docent.container .docent.contents .features-wrapper .feature .questions .icon-docent-question {
    width: 278px;
    height: 121px;
    top: -50%;
  }
  .docent.container .docent.contents .features-wrapper .feature .questions .title {
    width: 295px;
    color: #767676;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
  }
  .docent.container .docent.contents .features-wrapper .feature .questions .desc {
    max-width: 295px;
    gap: 12px;
  }
  .docent.container .docent.contents .features-wrapper .feature .questions .desc .text {
    color: #222;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px; /* 128.571% */
    letter-spacing: -0.5px;
  }
  .docent.container .docent.contents .features-wrapper .feature .questions .desc .icon-line {
    width: 100%;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus {
    justify-content: space-between;
    margin-top: 24px;
    width: 100%;
    height: 1125px;
    border-radius: 12px;
    padding: 24px 20px;
    gap: 32px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .versus-title-wrapper {
    color: #333;
    font-size: 22px;
    font-weight: 700;
    line-height: 30px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .versus-title-wrapper .caption {
    color: #767676;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc {
    display: flex;
    flex-wrap: wrap;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content {
    width: 295px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .title {
    color: #222;
    font-size: 20px;
    line-height: 26px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .list {
    width: 100%;
    gap: 19px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .list .ai-desc {
    display: flex;
    width: 100%;
    height: 60px;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px; /* 127.778% */
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .list ul li {
    height: 22px;
    margin-left: 2px;
    font-size: 14px;
    line-height: 22px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content .list ul li .square {
    width: 2px;
    height: 2px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.ai-wrapper {
    border-right: none;
    border-bottom: 1px solid #bbb;
    padding-right: 0;
    padding-bottom: 32px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.ai-wrapper .image-wrap {
    width: 295px;
    height: 145px;
    padding: 25px 69px 21px 66px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.ai-wrapper .image-wrap .icon-ai-chatbot {
    width: 161px;
    height: 99px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper {
    padding-top: 32px;
    padding-left: 0;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .title {
    color: #ec0047;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .image-wrap {
    width: 295px;
    height: 145px;
    padding: 13px 65px 14px 27px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .image-wrap .icon-aireport {
    width: 204px;
    height: 119px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .list .ai-desc {
    height: 94px;
    font-size: 14px;
    line-height: 18px; /* 128.571% */
    gap: 8px;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .desc .desc-content.docent-wrapper .list ul li {
    font-weight: 700;
  }
  .docent.container .docent.contents .features-wrapper .feature .versus .footer-caption {
    height: initial;
    color: #767676;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
    margin-bottom: 8px;
  }
  .docent.container .docent.contents .features-wrapper .feature .article {
    margin-top: 62px;
    width: 100%;
    gap: 12px;
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper {
    width: 100%;
    gap: 16px;
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .numbering-wrapper .number {
    width: 32px;
    height: 32px;
    font-size: 20px;
    line-height: 33px;
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .numbering-wrapper .dot-container {
    margin: 8px 0;
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .numbering-wrapper .dot-container .dot {
    width: 4px;
    height: 4px;
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content {
    width: 287px;
    gap: 12px;
    margin: 0;
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content:first-child {
    margin-top: 2px;
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content .content {
    margin-left: 0px;
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content .content .title {
    font-size: 20px;
    line-height: 26px; /* 130% */
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content .content .desc {
    max-width: 757px;
    margin-top: 16px;
    color: #222;
    font-size: 14px;
    line-height: 22px; /* 185% */
  }
  .docent.container .docent.contents .features-wrapper .feature .article .article-wrapper .article-content .icon-line {
    display: inline-block;
    width: 100%;
    height: 2px;
    background-image: url("../../images/icon-line.svg");
  }
  .docent.container .docent.contents .features-wrapper .feature .examples {
    width: 100%;
    margin-top: 16px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper {
    gap: 12px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper .item {
    height: initial;
    border-radius: 12px;
    gap: 16px;
    justify-content: center;
    padding: 20px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper .item img {
    width: 80px;
    height: 80px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper .item .text {
    text-align: center;
    color: #444;
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 32px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .example-wrapper .item .user {
    position: absolute;
    right: 50%;
    transform: translateX(50%);
    color: #444;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper {
    margin-top: 61px;
    flex-direction: column;
    gap: 8px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper .icon-green-right-arrow {
    width: 32px;
    height: 32px;
    rotate: 90deg;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square) {
    width: 335px;
    height: 335px;
    gap: 16px;
    border-radius: 100%;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).before .title {
    font-size: 20px;
    line-height: 26px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).before ul li {
    font-size: 14px;
    line-height: 22px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).before ul li:not(:last-child) {
    margin-bottom: 2px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).before ul li .square {
    width: 2px;
    height: 2px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after {
    background: #68A800;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after .title {
    font-size: 20px;
    line-height: 26px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after ul li {
    font-size: 14px;
    line-height: 22px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after ul li:not(:last-child) {
    margin-bottom: 2px;
  }
  .docent.container .docent.contents .features-wrapper .feature .examples .before-after-wrapper div:not(.square).after ul li .square {
    width: 2px;
    height: 2px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap {
    grid-template-columns: repeat(1, 1fr);
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab {
    display: flex;
    flex-direction: column;
    gap: 0px;
    height: initial;
    border: none;
    border-radius: 0;
    position: relative;
    border-top: 1px solid #64708f;
    padding: 25px 16px;
    box-shadow: none;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab:last-child {
    border-bottom: 1px solid #64708f;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__title {
    color: #444;
    font-size: 20px;
    font-weight: 600;
    line-height: 20px; /* 100% */
    padding-right: 20px;
    cursor: pointer;
    margin-bottom: 0;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__title.ko {
    width: 290px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__desc {
    margin-top: 8px;
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 700;
    line-height: 22px; /* 157.143% */
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__author {
    margin-top: 8px;
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__arrow {
    position: absolute;
    right: 16px;
    top: 25px;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    cursor: pointer;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__arrow.show {
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide {
    max-height: 0px;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide.show {
    max-height: 1045px;
    padding-bottom: 20px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents {
    margin-top: 40px;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    row-gap: 27px;
    background-color: #fff;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 28px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li:not(:last-child) {
    margin-bottom: 40px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li .icon-line {
    display: inline-block;
    width: 1050px;
    height: 2px;
    background-image: url("../../images/icon-line.svg");
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li .number {
    width: 24px;
    height: 24px;
    font-size: 24px;
    font-weight: 700;
    line-height: 24px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li .content {
    text-align: left;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li .content .title {
    font-size: 20px;
    line-height: 26px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li .content .desc {
    font-size: 14px;
    line-height: 22px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li .content-wrapper {
    display: flex;
    justify-content: center;
    gap: 16px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li.result-wrapper {
    gap: 40px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li.result-wrapper .result .text-wrapper {
    width: 100%;
    align-items: center;
    gap: 12px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li.result-wrapper .result .text-wrapper h2 {
    font-size: 20px;
    line-height: 26px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li.result-wrapper .result .text-wrapper .count-wrapper {
    color: #EC0047;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li.result-wrapper .result .text-wrapper .count-wrapper .caption {
    font-size: 14px;
    line-height: 22px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li.result-wrapper .result .text-wrapper .count-wrapper .count {
    margin-top: 8px;
    font-size: 56px;
    line-height: 44px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li.docent-example-wrapper {
    gap: 12px;
  }
  .docent.container .docent.contents .features-wrapper .feature.purpose-wrap--mobile .purpose-item-wrap .tab__hide .purpose-contents .item ul li.docent-example-wrapper .docent-example {
    width: 335px;
    margin-bottom: 0px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper {
    width: 335px;
    margin-top: 24px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .img-develop {
    width: 335px;
    height: 165px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents {
    margin-top: 24px;
    margin-bottom: 100px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-desc .title {
    color: #333;
    font-size: 14px;
    font-weight: 700;
    line-height: 22px; /* 157.143% */
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-desc .desc {
    margin-top: 10px;
    color: #767676;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper {
    margin-top: 80px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .title {
    color: #2f2f2f;
    font-size: 20px;
    line-height: 26px;
    margin-bottom: 72px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap {
    max-width: initial;
    row-gap: 52px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item {
    flex: 1;
    gap: 20px;
    width: 100%;
    height: initial;
    box-sizing: border-box;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-benchmark {
    width: 215px;
    height: 118px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-aireport {
    width: 116px;
    height: 118px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-target {
    width: 295px;
    height: 136px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .icon-core {
    width: 295px;
    height: 136px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .item-title {
    margin-top: 3px;
    color: #2F2F2F;
    font-size: 20px;
    font-weight: 600;
    line-height: 26px; /* 130% */
    letter-spacing: -0.424px;
  }
  .docent.container .docent.contents .features-wrapper .feature .contents-wrapper .contents .develop-features-wrapper .items-wrap .item .item-desc {
    margin-top: -4px;
    line-height: 22px;
  }
  .docent.container .docent.contents .features-wrapper .docent-footer {
    text-align: center;
  }
  .docent.container .docent.contents .features-wrapper .docent-footer .title {
    color: #333;
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 10px;
  }
  .docent.container .docent.contents .features-wrapper .docent-footer .desc {
    font-size: 14px;
    line-height: 22px;
  }
}
.login-bridge.container .login-bridge.contents {
  margin-bottom: 100px !important;
}
.login-bridge.container .login-bridge.contents .title-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
  width: 970px;
  margin-top: 110px;
}
.login-bridge.container .login-bridge.contents .title-wrapper .title {
  color: #EC0047;
  text-align: center;
  font-size: 67px;
  font-weight: 700;
  line-height: 77px; /* 114.925% */
  letter-spacing: -1px;
}
.login-bridge.container .login-bridge.contents .title-wrapper .sub-title {
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
.login-bridge.container .login-bridge.contents .title-wrapper .desc {
  color: #222;
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: 42px; /* 161.538% */
}
.login-bridge.container .login-bridge.contents .title-wrapper .img-wrap {
  margin-top: 45px;
  width: 770px;
  height: 410px;
}
.login-bridge.container .login-bridge.contents .title-wrapper .img-wrap .icon-docent {
  width: 770px;
  height: 410px;
}
.login-bridge.container .login-bridge.contents .features-wrapper {
  margin-top: 196px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature.conjugation {
  margin-top: 200px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .writing .title {
  color: #222;
  font-size: 55px;
  font-weight: 700;
  line-height: 72px; /* 130.909% */
  letter-spacing: -1px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .icon-principle {
  margin-top: 58px;
  width: 973px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .steps {
  margin-top: 80px;
  display: flex;
  flex-wrap: wrap;
  gap: 53px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step {
  display: flex;
  gap: 36px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step .number {
  color: #EC0047;
  font-family: NewRubrik;
  font-size: 70px;
  font-weight: 700;
  line-height: 70px; /* 100% */
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step .text-wrapper {
  margin-top: 23px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step .text-wrapper .title {
  color: #222;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px; /* 142.308% */
  letter-spacing: -1px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step .text-wrapper .desc {
  max-width: 270px;
  margin-top: 25px;
  color: #444;
  font-size: 20px;
  font-weight: 500;
  line-height: 32px; /* 160% */
  word-break: break-all;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories {
  margin-top: 206px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  column-gap: 55px;
  row-gap: 127px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category {
  min-width: 545px;
  display: flex;
  gap: 43px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper {
  width: 175px;
  height: 175px;
  padding: 61px 62px 62px 61px;
  box-sizing: border-box;
  border-radius: 20px;
  border: 4px solid #EBEBEB;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-1 {
  position: absolute;
  left: 50%;
  bottom: -17px;
  transform: translateX(-50%);
  background-color: #04A6FF;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 26px; /* 162.5% */
  letter-spacing: -0.5px;
  padding: 4px 10px;
  box-sizing: border-box;
  border-radius: 4px;
  max-width: 106px;
  width: max-content;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-2 {
  position: absolute;
  left: 50%;
  bottom: -17px;
  transform: translateX(-50%);
  background-color: #FCE515;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 26px; /* 162.5% */
  letter-spacing: -0.5px;
  padding: 4px 10px;
  box-sizing: border-box;
  border-radius: 4px;
  max-width: 106px;
  width: max-content;
  color: #222;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-3 {
  position: absolute;
  left: 50%;
  bottom: -17px;
  transform: translateX(-50%);
  background-color: #16B5D2;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 26px; /* 162.5% */
  letter-spacing: -0.5px;
  padding: 4px 10px;
  box-sizing: border-box;
  border-radius: 4px;
  max-width: 106px;
  width: max-content;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-4 {
  position: absolute;
  left: 50%;
  bottom: -17px;
  transform: translateX(-50%);
  background-color: #9665E3;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 26px; /* 162.5% */
  letter-spacing: -0.5px;
  padding: 4px 10px;
  box-sizing: border-box;
  border-radius: 4px;
  max-width: 106px;
  width: max-content;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-5 {
  position: absolute;
  left: 50%;
  bottom: -17px;
  transform: translateX(-50%);
  background-color: #E074E2;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 26px; /* 162.5% */
  letter-spacing: -0.5px;
  padding: 4px 10px;
  box-sizing: border-box;
  border-radius: 4px;
  max-width: 106px;
  width: max-content;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-6 {
  position: absolute;
  left: 50%;
  bottom: -17px;
  transform: translateX(-50%);
  background-color: #68BB0C;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 26px; /* 162.5% */
  letter-spacing: -0.5px;
  padding: 4px 10px;
  box-sizing: border-box;
  border-radius: 4px;
  max-width: 106px;
  width: max-content;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .text-wrapper .title {
  margin-bottom: 25px;
  color: #222;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px; /* 142.308% */
  letter-spacing: -1px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .text-wrapper .desc {
  word-break: break-all;
  max-width: 327px;
  color: #222;
  font-size: 18px;
  font-weight: 400;
  line-height: 23px; /* 127.778% */
  letter-spacing: -0.5px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences {
  width: 1170px;
  height: 686px;
  margin-top: 196px;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2), 0px 8px 15px 0px rgba(0, 0, 0, 0.16);
  padding: 44px;
  box-sizing: border-box;
  text-align: left;
  position: relative;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .icon-difference {
  position: absolute;
  right: 44.5px;
  top: -50px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .writing {
  padding-top: 20px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .writing .title {
  color: #222;
  font-size: 55px;
  font-weight: 700;
  line-height: 72px; /* 130.909% */
  letter-spacing: -1px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper {
  margin-top: 60px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content-titles {
  display: flex;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid #ebebeb;
  padding-bottom: 14px;
  padding-left: 12px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content-titles .title {
  color: #444;
  font-size: 18px;
  font-weight: 700;
  line-height: 120%; /* 21.6px */
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content-titles .title:first-child {
  flex: 0 0 400px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content-titles .title:nth-child(2) {
  flex: 0 0 296px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content-titles .title:last-child {
  font-size: 22px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content {
  display: flex;
  flex-direction: column;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content .line {
  display: flex;
  gap: 24px;
  color: #444;
  font-size: 16px;
  font-weight: 400;
  line-height: 120%; /* 19.2px */
  border-bottom: 1px solid #ebebeb;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content .line .text {
  height: 68px;
  padding: 24.5px 12px;
  box-sizing: border-box;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content .line .text:first-child {
  flex: 0 0 400px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content .line .text:nth-child(2) {
  flex: 0 0 296px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content .line .text:last-child {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  color: #222;
  font-weight: 700;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .differences .content-wrapper .content .line .text:last-child img {
  width: 20px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper {
  width: 1170px;
  margin-top: 44px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box {
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2), 0px 8px 15px 0px rgba(0, 0, 0, 0.16);
  padding: 44px;
  box-sizing: border-box;
  display: flex;
  align-items: flex-start;
  gap: 44px;
  margin-bottom: 20px;
  position: relative;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper .title {
  color: #222;
  font-size: 24px;
  font-weight: 700;
  line-height: 35px; /* 145.833% */
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper .desc {
  max-width: 684px;
  margin-bottom: 8px;
  color: #444;
  font-size: 20px;
  font-weight: 500;
  line-height: 37px; /* 185% */
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper .lists {
  display: flex;
  flex-direction: column;
  gap: 12px;
  color: #555;
  font-size: 20px;
  font-weight: 400;
  line-height: 26px; /* 130% */
  letter-spacing: -0.5px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper .lists span {
  display: flex;
  align-items: center;
  gap: 10px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .author {
  position: absolute;
  bottom: 44px;
  right: 44px;
  color: #444;
  font-size: 20px;
  font-weight: 400;
  line-height: 20px; /* 100% */
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper {
  width: 1170px;
  margin-top: 81px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list {
  display: flex;
  flex-direction: column;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item {
  width: 100%;
  border-bottom: 1px solid #C3C3C3;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item:first-child .main-item {
  padding-top: 0;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item:last-child {
  border-bottom: none;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .main-item {
  display: flex;
  justify-content: space-between;
  width: 100%;
  cursor: pointer;
  padding-top: 40px;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .main-item span {
  color: #444;
  font-size: 24px;
  font-weight: 700;
  line-height: 35px; /* 145.833% */
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .main-item img {
  width: 32px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .sub-item {
  max-height: 0px;
  padding-top: 40px;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .sub-item .writing-description ul {
  margin-bottom: 0;
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .sub-item .writing-description ul li {
  max-width: 1016px;
  word-break: break-all;
  color: #444;
  font-size: 20px;
  font-weight: 500;
  line-height: 37px; /* 185% */
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item.on .main-item img {
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  content: url("https://dream-cdn.beusable.net/home/images/features/loginBridge/icon-minus.svg");
}
.login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item.on .sub-item {
  max-height: 500px;
}

@media all and (max-width: 768px) {
  .login-bridge.container .login-bridge.contents {
    margin-bottom: 80px !important;
  }
  .login-bridge.container .login-bridge.contents .title-wrapper {
    gap: 15px;
    width: 100%;
    margin-top: 45px;
    border-bottom: 1px solid #c1c1c1;
  }
  .login-bridge.container .login-bridge.contents .title-wrapper .title {
    color: #EC0047;
    font-size: 30px;
    line-height: 39px;
  }
  .login-bridge.container .login-bridge.contents .title-wrapper .sub-title {
    font-size: 22px;
    line-height: 30px;
  }
  .login-bridge.container .login-bridge.contents .title-wrapper .desc {
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
  }
  .login-bridge.container .login-bridge.contents .title-wrapper .img-wrap {
    height: 160px;
    width: 301px;
    margin-top: 18px;
    margin-bottom: 37px;
  }
  .login-bridge.container .login-bridge.contents .title-wrapper .img-wrap .icon-docent {
    width: 301px;
    height: 160px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper {
    margin-top: 50px;
    max-width: 335px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature.conjugation {
    margin-top: 80px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .writing .title {
    font-size: 22px;
    line-height: 30px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .icon-principle {
    margin-top: 24px;
    width: 335px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .steps {
    margin-top: 64px;
    gap: 12px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step {
    gap: 16px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step .number {
    font-size: 20px;
    line-height: 20px;
    margin-top: 3px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step .text-wrapper {
    margin-top: 0px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step .text-wrapper .title {
    color: #444;
    font-size: 20px;
    font-weight: 700;
    line-height: 26px; /* 130% */
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step .text-wrapper .desc {
    max-width: 306px;
    margin-top: 16px;
    color: #222;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
    letter-spacing: -0.5px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step .text-wrapper .icon-line {
    display: inline-block;
    width: 100%;
    height: 2px;
    background-image: url("../../images/icon-line.svg");
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .steps .step:last-child .icon-line {
    display: none;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories {
    margin-top: 80px;
    column-gap: 55px;
    row-gap: 40px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category {
    min-width: 335px;
    flex: 1 1 calc(50% - 55px);
    display: flex;
    gap: 16px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper {
    width: 92px;
    height: 92px;
    padding: 28px;
    border-radius: 12px;
    border: 3.874px solid #EBEBEB;
    position: relative;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper img {
    width: 36px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-1 {
    font-size: 12px;
    line-height: 12px;
    padding: 6px 8px;
    max-width: 80px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-2 {
    font-size: 12px;
    line-height: 12px;
    padding: 6px 8px;
    max-width: 80px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-3 {
    font-size: 12px;
    line-height: 12px;
    padding: 6px 8px;
    max-width: 80px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-4 {
    font-size: 12px;
    line-height: 12px;
    padding: 6px 8px;
    max-width: 80px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-5 {
    font-size: 12px;
    line-height: 12px;
    padding: 6px 8px;
    max-width: 80px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .category .category-icon-wrapper .category-type-6 {
    font-size: 12px;
    line-height: 12px;
    padding: 6px 8px;
    max-width: 80px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .text-wrapper .title {
    margin-bottom: 16px;
    color: #444;
    font-size: 18px;
    font-weight: 700;
    line-height: 23px; /* 127.778% */
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .categories .text-wrapper .desc {
    max-width: 227px;
    font-size: 12px;
    font-weight: 500;
    line-height: 19px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile {
    width: 335px;
    margin-top: 80px;
    border-radius: 12px;
    box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2), 0px 8px 14px -4px rgba(0, 0, 0, 0.16);
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .title-wrapper-mobile {
    height: 70px;
    box-sizing: border-box;
    padding: 12px 34px 9px 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 82px;
    text-align: center;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .title-wrapper-mobile .title {
    color: #444;
    font-size: 16px;
    font-weight: 700;
    line-height: 120%; /* 19.2px */
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .title-wrapper-mobile .title:last-child {
    font-size: 18px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .content-wrapper-mobile .content-title {
    height: 32px;
    text-align: center;
    padding: 8px 0;
    background: #F4F4F4;
    color: #888;
    font-size: 14px;
    font-weight: 700;
    line-height: 120%; /* 16.8px */
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
    box-sizing: border-box;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .content-wrapper-mobile .content {
    display: flex;
    align-items: center;
    height: 77px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .content-wrapper-mobile .content span {
    height: 100%;
    flex: 1;
    box-sizing: border-box;
    padding: 20px 24px 24px 23px;
    color: #444;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 120%; /* 16.8px */
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .content-wrapper-mobile .content span:first-child {
    border-right: 1px solid #ebebeb;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .content-wrapper-mobile .content span:last-child {
    font-size: 16px;
    font-weight: 700;
    line-height: 120%; /* 19.2px */
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .content-wrapper-mobile .content:last-child {
    height: 93px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .differences--mobile .content-wrapper-mobile .content:last-child span {
    height: 100%;
    box-sizing: border-box;
    padding-bottom: 36px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper {
    width: 100%;
    margin-top: 20px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box {
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
    margin-bottom: 12px;
    position: initial;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box img {
    width: 80px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper {
    align-items: center;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper .title {
    font-size: 18px;
    line-height: 23px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper .desc {
    margin-bottom: 0;
    font-size: 14px;
    line-height: 22px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper .lists {
    gap: 4px;
    color: #444;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper .lists span {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .text-wrapper .lists span img {
    width: 14px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .conjugation-wrapper .box .author {
    margin-top: 4px;
    position: initial;
    color: #767676;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper {
    max-width: 335px;
    margin-top: 28px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list {
    display: flex;
    flex-direction: column;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item {
    width: 100%;
    border-bottom: 1px solid #C3C3C3;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item:last-child {
    border-bottom: none;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item:nth-child(2) .main-item {
    padding-top: 8px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item:nth-child(2) .sub-item {
    padding-top: 8px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item:nth-child(2).on .sub-item {
    padding-top: 20px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .main-item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    cursor: pointer;
    padding-top: 21px;
    box-sizing: border-box;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .main-item span {
    display: flex;
    align-items: center;
    max-width: 280px;
    word-break: break-all;
    color: #444;
    font-size: 16px;
    line-height: 26px; /* 162.5% */
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .main-item img {
    width: 24px;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .sub-item {
    max-height: 0px;
    padding-top: 20px;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .sub-item .writing-description ul {
    margin-bottom: 0;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item .sub-item .writing-description ul li {
    max-width: 280px;
    font-size: 14px;
    line-height: 22px;
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item.on .main-item img {
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    content: url("https://dream-cdn.beusable.net/home/images/features/loginBridge/icon-minus.svg");
  }
  .login-bridge.container .login-bridge.contents .features-wrapper .feature .questions-wrapper .writing-list .item.on .sub-item {
    max-height: 500px;
  }
}
.new-day-container {
  position: relative;
}
.new-day-container .pc {
  display: block;
}
.new-day-container .pc-initial {
  display: initial;
}
.new-day-container .mo {
  display: none;
}
.new-day-container * {
  letter-spacing: initial;
  box-sizing: border-box;
  font-family: "Pretendard Variable";
}
.new-day-container .aiday__navigation.mobile {
  display: none;
  z-index: 2;
}
.new-day-container .aiday__navigation.pc {
  z-index: 2;
  position: fixed;
}
.new-day-container .aiday__navigation.pc .navigation-button {
  position: fixed;
  top: 46%;
  cursor: pointer;
}
.new-day-container .aiday__navigation.pc .navigation-button i {
  display: inline-block;
  width: 60px;
  height: 60px;
  background-repeat: no-repeat;
  background-size: 60px;
}
.new-day-container .aiday__navigation.pc .navigation-button.left {
  left: 0;
}
.new-day-container .aiday__navigation.pc .navigation-button.left .icon-right-arrow {
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-left-transparent.svg");
}
.new-day-container .aiday__navigation.pc .navigation-button.left:hover:not(.disable) .icon-right-arrow {
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-left-hover.svg");
}
.new-day-container .aiday__navigation.pc .navigation-button.right {
  right: 0;
  rotate: -180deg;
}
.new-day-container .aiday__navigation.pc .navigation-button.right .icon-right-arrow {
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-left-transparent.svg");
}
.new-day-container .aiday__navigation.pc .navigation-button.right:hover:not(.disable) .icon-right-arrow {
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-left-hover.svg");
}
.new-day-container .aiday__navigation.pc .navigation-button.disable {
  cursor: default;
}
.new-day-container .aiday__navigation.pc .navigation-button.disable .icon-right-arrow {
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-left-disabled.svg");
}
.new-day-container .dday-btn {
  cursor: default;
  padding: 21px 24px 24px;
  border-radius: 50em;
  opacity: 0.2;
  background: #FE0;
  box-shadow: 0 26px 24px 0 rgba(0, 0, 0, 0.25);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
}
.new-day-container .dday-btn .text-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.new-day-container .dday-btn .icon--write {
  width: 44px;
  height: 44px;
  background: #fff url(https://dream-cdn.beusable.net/home/thday/20250911/icon-btn-write.svg) no-repeat center/24px 24px;
  border-radius: 50em;
}
.new-day-container .dday-btn .days {
  color: #EC0047;
  font-size: 26px;
  font-weight: 700;
  line-height: 100%;
}
.new-day-container .dday-btn .sub-text {
  color: #222;
  font-size: 16px;
  font-weight: 700;
  line-height: 100%;
}
.new-day-container div[class*=-section] {
  position: relative;
  overflow: hidden;
}
.new-day-container .inner {
  padding-inline: 20px;
  max-width: 1210px;
  margin: 0 auto;
  position: relative;
}
.new-day-container .unit {
  font-size: 49px;
  font-weight: 800;
  line-height: 84%;
  display: block;
  font-style: normal;
}
.new-day-container .unit-text {
  display: flex;
  align-items: flex-end;
  gap: 1.5px;
}
.new-day-container .section-title {
  font-size: 58px;
  font-weight: 700;
  line-height: 120%;
  margin-bottom: 124px;
  margin-left: 95px;
}
.new-day-container .title-box {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-align: center;
}
.new-day-container .title-box .section-title {
  margin: 0;
}
.new-day-container .title-box .section-sub-title {
  color: #ccc;
  font-size: 22px;
  font-weight: 500;
  line-height: 130%;
}
.new-day-container .content-label {
  color: #FE0;
  font-size: 103px;
  font-weight: 700;
  line-height: 100%;
  position: relative;
}
.new-day-container .content-desc {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.new-day-container .content-desc .title {
  color: #fff;
  font-size: 26px;
  font-weight: 700;
  line-height: 130%;
}
.new-day-container .content-desc .desc {
  color: #ADBCFF;
  font-size: 18px;
  font-weight: 400;
  line-height: 160%;
}
.new-day-container .iframe-box {
  position: relative;
  width: 100%;
  height: 100%;
}
.new-day-container .iframe-box.live {
  aspect-ratio: 16/9px;
}
.new-day-container .iframe-box.chat-bot {
  height: 100vh;
}
.new-day-container .iframe-box iframe {
  border: none;
  position: absolute;
  width: 100%;
  height: 100%;
}
.new-day-container .top-visual-section {
  background-color: #002594;
}
.new-day-container .top-visual-section .bg-img {
  width: 1140px;
  height: 898px;
  position: absolute;
  top: 0;
  background: url(https://dream-cdn.beusable.net/home/thday/20250911/20250911-bg.jpg) no-repeat center right/cover;
}
.new-day-container .top-visual-section .bg-text {
  white-space: nowrap;
  color: rgba(0, 37, 148, 0.7);
  font-size: 186px;
  font-weight: 600;
  mix-blend-mode: color-dodge;
  position: absolute;
  top: 331px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
}
.new-day-container .top-visual-section .inner {
  min-height: 898px;
  padding-block: 0;
}
.new-day-container .top-visual-section .content .text-box {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding-top: 193px;
  z-index: 1;
}
.new-day-container .top-visual-section .content .visual-text {
  position: relative;
}
.new-day-container .top-visual-section .content .visual-title {
  color: #FFF;
  font-size: 92px;
  font-weight: 700;
  line-height: 110%;
}
.new-day-container .top-visual-section .content .visual-title span {
  color: #FE0;
  font-weight: 300;
}
.new-day-container .top-visual-section .content .visual-para {
  width: 100%;
  position: absolute;
  bottom: 6px;
  left: 194px;
  color: #FFF;
  font-size: 26px;
  font-weight: 500;
  line-height: 130%;
}
.new-day-container .top-visual-section .content .label {
  border-radius: 50em;
  padding: 6px 16px;
  font-size: 18px;
  font-weight: 700;
  line-height: 130%;
  display: block;
  cursor: pointer;
}
.new-day-container .top-visual-section .content .label-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}
.new-day-container .top-visual-section .content .label-box .keywords {
  display: flex;
  align-items: center;
  gap: 8px;
}
.new-day-container .top-visual-section .content .label-date {
  align-self: flex-start;
  background-color: #FFF;
  color: #002594;
  display: flex;
  align-items: center;
  gap: 10px;
}
.new-day-container .top-visual-section .content .label-keyword {
  background-color: #0029DF;
  color: #A1C9FF;
}
.new-day-container .top-visual-section .icon {
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
}
.new-day-container .top-visual-section .icon--main-date {
  background-image: url(https://dream-cdn.beusable.net/home/thday/20250911/icon-main-date.svg);
}
.new-day-container .top-visual-section .icon--main-link {
  background-image: url(https://dream-cdn.beusable.net/home/thday/20250911/icon--main-link.svg);
}
.new-day-container .innovation-section {
  background: #000 url(https://dream-cdn.beusable.net/home/thday/20250911/20250911-innovation-full-bg.jpg) no-repeat center center/cover;
}
.new-day-container .innovation-section .inner {
  padding-block: 181px 210px;
}
.new-day-container .innovation-section .bg-top-img {
  width: 100%;
  height: 304px;
  aspect-ratio: 120/19;
  position: absolute;
  top: 145px;
  background: url(https://dream-cdn.beusable.net/home/thday/20250911/20250911-innovation-bg.png) no-repeat center/100% 100%;
}
.new-day-container .innovation-section .bg-text {
  color: rgba(241, 192, 12, 0.16);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  top: 170px;
  font-size: 135px;
  font-weight: 600;
  line-height: 80%;
  mix-blend-mode: exclusion;
}
.new-day-container .innovation-section .title-box {
  position: relative;
  margin-bottom: 57px;
}
.new-day-container .innovation-section .title-box .section-title {
  color: #FE0;
}
.new-day-container .innovation-section .content-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
}
.new-day-container .innovation-section .content-list li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  flex: 0 1 430px;
}
.new-day-container .innovation-section .content-list li .logo {
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.new-day-container .innovation-section .content-list li.beusable .logo {
  background-image: url(https://dream-cdn.beusable.net/home/images/logo-main.svg);
  width: 247px;
  height: 86px;
}
.new-day-container .innovation-section .content-list li.knitlog {
  position: relative;
  padding-top: 110px;
}
.new-day-container .innovation-section .content-list li.knitlog .logo {
  background-image: url(https://dream-cdn.beusable.net/home/thday/20250911/knitlog-logo.svg);
  width: 217px;
  height: 104px;
  position: absolute;
  top: 0;
}
.new-day-container .innovation-section .content-list .icon--plus {
  width: 90px;
  height: 90px;
  flex: 0 0 90px;
  background: url(https://dream-cdn.beusable.net/home/thday/20250911/icon-yellow-plus.svg) no-repeat center/contain;
}
.new-day-container .innovation-section .content-desc {
  gap: 24px;
  text-align: center;
  align-items: center;
}
.new-day-container .innovation-section .content-desc .check-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.new-day-container .innovation-section .content-desc .check-list .desc {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #FFF;
  font-size: 22px;
  font-weight: 400;
  line-height: 160%;
}
.new-day-container .innovation-section .content-desc .check-list .desc:before {
  content: "";
  background: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-main-arrow.svg") no-repeat center/contain;
  display: block;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin-top: 7.5px;
}
.new-day-container .secret-section {
  background-color: #00103F;
  z-index: 1;
}
.new-day-container .secret-section .bg-img {
  position: absolute;
}
.new-day-container .secret-section .bg-img.pc {
  z-index: -1;
  width: 942.923px;
  height: 454px;
  left: -156px;
  transform: scaleY(-1);
  bottom: 0;
  background: url(https://dream-cdn.beusable.net/home/thday/20250911/20250911-secret-bg.png) no-repeat bottom right 55px/contain;
}
.new-day-container .secret-section .inner {
  padding-block: 132px 0;
}
.new-day-container .secret-section .title-box {
  margin-bottom: 80px;
}
.new-day-container .secret-section .title-box .section-title {
  color: #fff;
}
.new-day-container .secret-section .icon {
  position: absolute;
}
.new-day-container .secret-section .icon--secret-ai {
  display: block;
  width: 53px;
  height: 63px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-secret-ai.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  left: 98px;
  bottom: 13px;
}
.new-day-container .secret-section .icon--secret-min {
  display: block;
  width: 42px;
  height: 42px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-secret-min.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  left: 146px;
  bottom: 44px;
}
.new-day-container .secret-section .icon--secret-next {
  display: block;
  width: 36px;
  height: 36px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-secret-next.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  left: 106px;
  top: 17px;
}
.new-day-container .secret-section .unit {
  margin-bottom: 14px;
}
.new-day-container .secret-section .content-desc .title {
  text-align: center;
}
.new-day-container .secret-section .content-desc .desc {
  text-align: center;
  padding-bottom: 154px;
}
.new-day-container .secret-section .content-label {
  min-height: 103px;
  display: flex;
  align-items: center;
}
.new-day-container .secret-section .content-list {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 64px;
}
.new-day-container .secret-section .content-list li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  flex-basis: 336px;
}
.new-day-container .secret-section .content-list .next-analytics .unit {
  font-size: 46px;
  margin-bottom: 0;
}
.new-day-container .agenda-section .inner {
  padding-block: 150px 129px;
}
.new-day-container .agenda-section .section-title {
  color: #002594;
  text-align: center;
}
.new-day-container .agenda-section .content-desc {
  text-align: center;
}
.new-day-container .agenda-section .content-desc .title {
  color: #002594;
}
.new-day-container .agenda-section .content-desc .desc {
  color: #373737;
}
.new-day-container .agenda-section .content-list {
  counter-reset: list-number;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 138px 64px;
}
.new-day-container .agenda-section .content-list li {
  flex: 0 1 336px;
  counter-increment: list-number;
  position: relative;
  padding-bottom: 10px;
}
.new-day-container .agenda-section .content-list li.accent-item .title {
  color: #EC0047;
}
.new-day-container .agenda-section .content-list li.accent-item .icon--badge-ai {
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-block;
  width: 42px;
  height: 20px;
  background: url(https://dream-cdn.beusable.net/home/thday/20250911/icon-new-badge.svg) no-repeat center/contain;
}
.new-day-container .agenda-section .content-list li:before {
  content: counter(list-number);
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
  color: #FE0;
  font-size: 204px;
  font-weight: 700;
  line-height: 100%;
}
.new-day-container .amount-section {
  background: url(https://dream-cdn.beusable.net/home/thday/20250911/20250911-number-bg.png) no-repeat center/cover;
}
.new-day-container .amount-section .inner {
  padding-block: 154px 174px;
}
.new-day-container .amount-section .group-line {
  display: block;
  width: 1px;
  height: 132px;
  background-color: #FE0;
}
.new-day-container .amount-section .number {
  color: #FE0;
  font-size: 80px;
  display: flex;
  align-items: flex-end;
  gap: 4px;
  font-weight: 700;
  line-height: 100%;
}
.new-day-container .amount-section .number .unit {
  font-size: 30px;
  font-weight: 700;
  line-height: 100%;
  margin-bottom: 12px;
}
.new-day-container .amount-section .number-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 120px;
}
.new-day-container .amount-section .number-item {
  min-width: 200px;
  display: flex;
  align-items: flex-end;
  gap: 16px;
  flex: 1;
}
.new-day-container .amount-section .number-item:first-child {
  justify-content: flex-end;
}
.new-day-container .amount-section .number-desc {
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  line-height: 100%;
  margin-bottom: 16px;
}
.new-day-container .schedule-section {
  background-color: #F4F4F4;
}
.new-day-container .schedule-section .inner {
  padding-block: 150px 100px;
}
.new-day-container .schedule-section .title-box .section-title {
  color: #5371F2;
}
.new-day-container .schedule-section .title-box .section-sub-title {
  color: #5371F2;
  padding-bottom: 68px;
}
.new-day-container .schedule-section .content-list {
  max-width: 970px;
  width: 100%;
  display: flex;
  flex-direction: column;
  margin: 0 auto;
}
.new-day-container .schedule-section .content-item {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #BBB;
  height: 134px;
}
.new-day-container .schedule-section .content-item:last-child {
  border-bottom: none;
}
.new-day-container .schedule-section .time {
  text-align: left;
  color: #5371F2;
  font-size: 26px;
  font-weight: 700;
  line-height: 100%;
  flex: 0 0 165px;
}
.new-day-container .schedule-section .time-subject {
  flex: 0 1 185px;
  color: #002594;
  font-size: 26px;
  font-weight: 700;
  line-height: 100%;
  margin-left: auto;
  margin-right: 135px;
}
.new-day-container .schedule-section .time-subject.deco {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.new-day-container .schedule-section .time-subject.deco .icon--deco {
  display: block;
  width: 185px;
  height: 21px;
  background: url(https://dream-cdn.beusable.net/home/thday/20250911/icon-with.svg) no-repeat center/contain;
}
.new-day-container .schedule-section .time-object {
  flex: 0 1 371px;
  color: #002594;
  font-size: 22px;
  font-weight: 600;
  line-height: 160%;
}
.new-day-container .newday-footer {
  background-color: #000;
}
.new-day-container .newday-footer .inner {
  padding-block: 80px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 54px;
}
.new-day-container .newday-footer .section-title {
  color: #2B52FF;
  margin: 0;
}
.new-day-container .newday-footer .right-content {
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 32px;
  flex-basis: 770px;
}
.new-day-container .newday-footer .right-content .reservation-box {
  margin-top: 7px;
  margin-bottom: 10px;
  font-size: 26px;
  font-weight: 500;
  line-height: 130%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}
.new-day-container .newday-footer .right-content .addr-box {
  display: flex;
  flex-direction: column;
  gap: 9px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  font-style: normal;
}
.new-day-container .newday-footer .right-content .addr-box strong {
  font-size: 20px;
  font-weight: 600;
}
.new-day-container .newday-footer .right-content .bottom {
  border-top: 1px solid #444;
  padding-top: 32px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap-reverse;
  gap: 32px;
}
.new-day-container .newday-footer .right-content .bottom .logo-box {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.new-day-container .newday-footer .right-content .bottom .logo-box .logo {
  margin-left: 2px;
  display: block;
  width: 150px;
  height: 26px;
  background-image: url("https://dream-cdn.beusable.net/home/images/logo-main.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.new-day-container .newday-footer .right-content .bottom .logo-box .copyright {
  color: #999;
  font-size: 13px;
  line-height: 1;
}
.new-day-container .newday-footer .right-content .bottom .sns-list {
  display: flex;
  gap: 16px;
}
.new-day-container .newday-footer .right-content .bottom .sns-list .icon--footer-forum {
  display: block;
  width: 62.5px;
  height: 24px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-footer-forum.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.new-day-container .newday-footer .right-content .bottom .sns-list .icon--footer-facebook {
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-footer-facebook.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.new-day-container .newday-footer .right-content .bottom .sns-list .icon--footer-instar {
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-footer-instar.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.new-day-container .newday-footer .right-content .bottom .sns-list .icon--footer-twitter {
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-footer-twitter.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.new-day-container .newday-footer .right-content .bottom .sns-list .icon--footer-link {
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("https://dream-cdn.beusable.net/home/thday/20250911/icon-footer-link.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.new-day-container .chatbot-section {
  background-color: #f4f4f4;
  padding-block: 0;
}

@media all and (max-width: 768px) {
  .new-day-container {
    min-width: 320px;
  }
  .new-day-container .unit {
    font-size: 32px;
    margin-bottom: 5px;
  }
  .new-day-container .pc {
    display: none;
  }
  .new-day-container .pc-initial {
    display: none;
  }
  .new-day-container .mo {
    display: block;
  }
  .new-day-container .section-title {
    margin: 0;
    font-size: 30px;
    text-align: center;
  }
  .new-day-container .content-desc {
    gap: 8px;
  }
  .new-day-container .content-desc .title {
    font-size: 18px;
  }
  .new-day-container .content-desc .desc {
    font-size: 12px;
  }
  .new-day-container .aiday__navigation.pc {
    display: none;
  }
  .new-day-container .aiday__navigation.mobile {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 5px;
  }
  .new-day-container .aiday__navigation.mobile .navigation-button {
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 100%;
    background-color: #FFF;
    filter: drop-shadow(0px 9px 9.5px rgba(0, 0, 0, 0.2)) drop-shadow(0px 0px 0px rgba(0, 0, 0, 0.16));
    box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
    cursor: pointer;
  }
  .new-day-container .aiday__navigation.mobile .navigation-button.right {
    rotate: 180deg;
    filter: drop-shadow(0px -9px 9.5px rgba(0, 0, 0, 0.2)) drop-shadow(0px 0px 0px rgba(0, 0, 0, 0.16));
  }
  .new-day-container .aiday__navigation.mobile .navigation-button.disable {
    opacity: 0.3;
    cursor: default;
  }
  .new-day-container .title-box {
    margin: 0;
  }
  .new-day-container .title-box .section-title {
    font-size: 30px;
  }
  .new-day-container .title-box .section-sub-title {
    text-align: center;
    font-size: 16px;
  }
  .new-day-container .top-visual-section .bg-img {
    background-image: url(https://dream-cdn.beusable.net/home/thday/20250911/20250911-bg-mo.png);
    background-position: bottom right;
    right: 0;
    left: auto;
    bottom: 0;
    top: unset;
    width: 423px;
    height: 612px;
    mix-blend-mode: difference;
  }
  .new-day-container .top-visual-section .inner {
    min-height: initial;
    padding-block: 126px 162px;
    padding-inline: 20px;
  }
  .new-day-container .top-visual-section .content .label-box .keywords {
    flex-wrap: wrap;
    gap: 4px;
  }
  .new-day-container .top-visual-section .content .label-box .link-keyword {
    gap: 12px;
  }
  .new-day-container .top-visual-section .content .text-box {
    padding: 0;
    gap: 24px;
  }
  .new-day-container .top-visual-section .content .bg-text {
    position: unset;
    font-size: 48px;
    margin-top: 8px;
  }
  .new-day-container .top-visual-section .content .visual-text {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .new-day-container .top-visual-section .content .visual-title {
    font-size: 44px;
  }
  .new-day-container .top-visual-section .content .visual-para {
    position: unset;
    font-size: 16px;
  }
  .new-day-container .innovation-section {
    background-position: center left 30%;
  }
  .new-day-container .innovation-section .inner {
    padding-block: 78px;
  }
  .new-day-container .innovation-section .content-list {
    flex-direction: column;
    text-align: center;
    gap: 32px;
  }
  .new-day-container .innovation-section .content-list li {
    align-items: center;
    flex: 1;
    width: 100%;
  }
  .new-day-container .innovation-section .content-list li.beusable .logo {
    height: 34px;
    background-size: 169px 30px;
  }
  .new-day-container .innovation-section .content-list li.knitlog {
    padding-top: 77px;
  }
  .new-day-container .innovation-section .content-list li.knitlog .logo {
    width: 144px;
    height: 69px;
  }
  .new-day-container .innovation-section .content-list .icon--plus {
    width: 45px;
    height: 45px;
    flex: 0 0 45px;
  }
  .new-day-container .innovation-section .content-desc {
    gap: 12px;
  }
  .new-day-container .innovation-section .content-desc .title {
    font-size: 18px;
  }
  .new-day-container .innovation-section .content-desc .check-list .desc {
    justify-content: center;
    color: #CCC;
    font-size: 16px;
    gap: 4px;
  }
  .new-day-container .innovation-section .content-desc .check-list .desc:before {
    margin-top: 5px;
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
  }
  .new-day-container .innovation-section .title-box {
    margin-bottom: 52px;
  }
  .new-day-container .innovation-section .title-box .section-sub-title {
    position: unset;
  }
  .new-day-container .secret-section .bg-img {
    background: url(https://dream-cdn.beusable.net/home/thday/20250911/20250911-secret-bg-mo.png) no-repeat center/contain;
    width: 477px;
    height: 252px;
    right: 144px;
    left: unset;
    bottom: unset;
  }
  .new-day-container .secret-section .inner {
    padding-block: 40px 60px;
  }
  .new-day-container .secret-section .title-box {
    margin-bottom: 52px;
    gap: 12px;
  }
  .new-day-container .secret-section .icon--secret-ai {
    position: unset;
    width: 30px;
    height: 36px;
    margin-bottom: 4px;
  }
  .new-day-container .secret-section .icon--secret-min {
    position: unset;
    width: 24px;
    height: 24px;
    margin-bottom: 5px;
  }
  .new-day-container .secret-section .icon--secret-next {
    width: 24px;
    height: 24px;
    left: 65px;
    top: 0;
  }
  .new-day-container .secret-section .unit {
    margin-bottom: 5px;
  }
  .new-day-container .secret-section .content-list {
    flex-direction: column;
    align-items: center;
    gap: 32px;
  }
  .new-day-container .secret-section .content-list li {
    flex: 1;
    text-align: center;
    gap: 12px;
  }
  .new-day-container .secret-section .content-list .next-analytics .content-label {
    text-align: initial;
    display: flex;
    justify-content: center;
  }
  .new-day-container .secret-section .content-list .next-analytics .unit {
    font-size: 28px;
    margin-bottom: 2px;
  }
  .new-day-container .secret-section .content-label {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    font-size: 50px;
    min-height: initial;
    gap: 2px;
  }
  .new-day-container .secret-section .content-desc .desc {
    padding-bottom: 0;
  }
  .new-day-container .secret-section .unit-text {
    gap: 0;
    justify-content: center;
  }
  .new-day-container .agenda-section .inner {
    padding-block: 40px 60px;
    padding-right: 17px;
  }
  .new-day-container .agenda-section .content-list {
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 18px;
  }
  .new-day-container .agenda-section .content-list li {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 0;
  }
  .new-day-container .agenda-section .content-list li:before {
    position: unset;
    font-size: 50px;
    transform: initial;
  }
  .new-day-container .agenda-section .content-list li.accent-item .icon--badge-ai {
    width: 32px;
    height: 15px;
    margin-left: 2px;
    position: unset;
    transform: unset;
    vertical-align: 0;
  }
  .new-day-container .agenda-section .content-desc {
    text-align: left;
  }
  .new-day-container .schedule-section .inner {
    padding-block: 40px 60px;
  }
  .new-day-container .schedule-section .title-box .section-sub-title {
    padding-bottom: 60px;
  }
  .new-day-container .schedule-section .content-list {
    gap: 30px;
  }
  .new-day-container .schedule-section .content-item {
    flex-direction: column;
    height: auto;
    padding-bottom: 30px;
  }
  .new-day-container .schedule-section .content-item:last-child {
    padding-bottom: 0;
  }
  .new-day-container .schedule-section .time {
    flex: auto;
    order: 1;
    font-size: 16px;
  }
  .new-day-container .schedule-section .time-subject {
    flex: auto;
    order: 0;
    font-size: 22px;
  }
  .new-day-container .schedule-section .time-subject.deco {
    align-items: center;
    gap: 2px;
  }
  .new-day-container .schedule-section .time-subject.deco .icon--deco {
    width: 155px;
    height: 18px;
  }
  .new-day-container .schedule-section .time-object {
    flex: auto;
    order: 2;
    font-size: 18px;
    text-align: center;
  }
  .new-day-container .amount-section .inner {
    padding-block: 60px;
  }
  .new-day-container .amount-section .number {
    font-size: 42px;
  }
  .new-day-container .amount-section .number .unit {
    font-size: 20px;
    margin-bottom: 6px;
  }
  .new-day-container .amount-section .number-list {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 32px;
  }
  .new-day-container .amount-section .number-list .group-line {
    width: 32px;
    height: 1px;
  }
  .new-day-container .amount-section .number-item {
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
  .new-day-container .amount-section .number-desc {
    font-size: 18px;
    order: 1;
    margin-bottom: 0;
  }
  .new-day-container .newday-footer .inner {
    padding-block: 40px;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
  }
  .new-day-container .newday-footer .right-content {
    gap: 24px;
    flex-basis: auto;
    width: 100%;
  }
  .new-day-container .newday-footer .right-content .reservation-box {
    margin-top: 0;
    margin-bottom: 20px;
    align-items: center;
    font-size: 18px;
    font-weight: 700;
  }
  .new-day-container .newday-footer .right-content .bottom {
    padding-top: 24px;
    justify-content: center;
    align-items: center;
  }
  .new-day-container .newday-footer .right-content .bottom .logo-box {
    align-items: center;
  }
}
@media all and (max-width: 400px) {
  .new-day-container .top-visual-section .bg-img {
    background-position: bottom right -52px;
  }
  .new-day-container .innovation-section {
    background-position: center left 40%;
  }
  .new-day-container .secret-section .bg-img {
    right: 92px;
  }
}
@media (min-width: 1980px) {
  .new-day-container .innovation-section .bg-top-img {
    top: 111px;
  }
}
/* 1920px 이상일 때 */
@media (min-width: 1920px) {
  .new-day-container .top-visual-section .bg-img {
    right: 0;
  }
}
/* 1920px 미만일 때 */
@media (max-width: 1919px) {
  .top-visual-section .bg-img {
    right: auto;
    left: 741px;
  }
  .secret-section .bg-img {
    right: auto;
    left: 274px;
  }
}
@media (max-width: 1024px) {
  .new-day-container .schedule-section .content-item {
    gap: 16px;
    justify-content: space-between;
  }
  .new-day-container .schedule-section .time-subject {
    margin-left: 0;
    margin-right: 0;
  }
}
.dashboard.container {
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  flex-direction: column;
  align-items: center;
  letter-spacing: normal;
}
.dashboard.container .dashboard.contents {
  margin-bottom: 200px !important;
}
.dashboard.container .dashboard.contents .title-wrapper {
  margin-top: 75px;
  text-align: center;
}
.dashboard.container .dashboard.contents .title-wrapper .title {
  color: #222;
  text-align: center;
  font-size: 55px;
  font-weight: 700;
  line-height: 72px; /* 130.909% */
  letter-spacing: -1px;
  margin-bottom: 25px;
  margin-top: 6px;
}
.dashboard.container .dashboard.contents .title-wrapper .sub-title {
  color: #222;
  text-align: center;
  font-size: 24px;
  font-weight: 600;
  line-height: 120%; /* 28.8px */
  margin-bottom: -19px;
}
.dashboard.container .dashboard.contents .title-wrapper .desc {
  color: #222;
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: 42px; /* 161.538% */
}
.dashboard.container .dashboard.contents .title-wrapper .img-wrap {
  display: inline-block;
  margin-top: 36px;
  width: 646px;
  height: 413px;
}
.dashboard.container .dashboard.contents .title-wrapper .img-wrap .icon-dashboard {
  width: 646px;
  height: 413px;
}
.dashboard.container .dashboard.contents .features-wrapper {
  max-width: 1170px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 50px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  text-align: center;
  border-bottom: 2px solid #bbb;
  padding-bottom: 160px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature:not(:first-child) {
  margin-top: 162px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature.en, .dashboard.container .dashboard.contents .features-wrapper .feature.ja {
  display: none;
}
.dashboard.container .dashboard.contents .features-wrapper .feature.trap-wrapper .title-wrapper {
  width: fit-content;
  display: flex;
  flex-direction: column;
  align-self: baseline;
  margin-left: 50px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature.trap-wrapper .title-wrapper.ja {
  margin-left: 0;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .title-wrapper .title {
  color: #222;
  text-align: center;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  margin-bottom: 24px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .title-wrapper .caption {
  color: #444;
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
.dashboard.container .dashboard.contents .features-wrapper .feature .title-wrapper .desc {
  color: #222;
  font-size: 26px;
  font-weight: 700;
  line-height: 37px; /* 142.308% */
  letter-spacing: -1px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 33px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality {
  display: flex;
  align-items: center;
  gap: 33px;
  margin-top: -300px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content {
  width: 397px;
  height: 516px;
  border-radius: 20px;
  border: 6px solid #6D727B;
  background: #F6F6F6;
  padding: 18px;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .header span {
  background: #D7D7D7;
  border-radius: 6px;
  padding: 10px 12px;
  color: #2F2F2F;
  font-size: 18px;
  font-weight: 700;
  line-height: 29px; /* 161.111% */
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .header .icon-question-mark {
  width: 34px;
  height: 34px;
  margin-right: 6px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples {
  margin-top: 12px;
  padding: 0 8px;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples h3 {
  color: #444;
  font-size: 24px;
  font-weight: 600;
  line-height: 47px; /* 195.833% */
  letter-spacing: -1px;
  border-bottom: 2px solid #D9D9D9;
  padding-bottom: 12px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .example {
  box-sizing: border-box;
  margin-top: 43px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-left: 57px;
  padding-right: 20px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .example.en, .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .example.ja {
  padding-left: 31px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .example div {
  text-align: left;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #222;
  font-size: 18px;
  font-weight: 500;
  line-height: 100%; /* 18px */
  letter-spacing: -1px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .example div img {
  width: 22px;
  height: 22px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .result {
  margin-top: 64px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #444;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  line-height: 150%; /* 27px */
  padding-left: 20px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality .versus {
  color: #444;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  line-height: 100%; /* 22px */
  display: flex;
  width: 68px;
  height: 68px;
  padding: 10px;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background: #EBEBEB;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation {
  width: 572px;
  height: 900px;
  border-radius: 20px;
  border: 6px solid #EC0047;
  background: linear-gradient(0deg, #FFF 0%, #FFF 100%), rgba(0, 0, 0, 0);
  box-shadow: 0 26px 30px -11px rgba(0, 0, 0, 0.3);
  padding: 18px;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .header span {
  background: #EC0047;
  border-radius: 6px;
  color: #FFF;
  font-size: 20px;
  font-weight: 600;
  line-height: 100%; /* 20px */
  padding: 10px 14px;
  display: flex;
  align-items: flex-end;
  gap: 6px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .header .icon-sketch-mark {
  width: 74px;
  height: 40px;
  margin-right: 5px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples {
  margin-top: 30px;
  padding: 0 13px;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples h3 {
  color: #222;
  text-align: center;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  border-bottom: 2px solid #D9D9D9;
  padding-bottom: 20px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example {
  box-sizing: border-box;
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-left: 108px;
  padding-right: 30px;
  height: 248px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example.ja {
  padding-left: 72px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example div {
  text-align: left;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #222;
  font-size: 20px;
  font-weight: 600;
  line-height: 100%; /* 20px */
  letter-spacing: -1px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example div img {
  width: 28px;
  height: 28px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .result {
  margin-top: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #429700;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  line-height: 150%; /* 30px */
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide {
  margin-top: 24px;
  background-color: #111;
  padding: 28px 16px;
  box-sizing: border-box;
  border-radius: 8px;
  width: 524px;
  height: 304px;
  text-align: left;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide .title {
  color: #FFD900;
  font-size: 20px;
  font-weight: 600;
  line-height: 150%; /* 30px */
  padding-left: 16px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide ul {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  color: #FFF;
  font-size: 15px;
  font-weight: 400;
  line-height: 150%; /* 22.5px */
  padding-left: 32px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide ul li {
  position: relative;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide ul li::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
  background: #888;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 60px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps:not(:first-child) {
  margin-top: 475px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .top {
  display: flex;
  align-items: flex-start;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .top .step {
  padding: 12px 16px;
  border-radius: 8px;
  background: #EC0047;
  color: #fff;
  font-size: 26px;
  font-weight: 600;
  line-height: 100%; /* 26px */
  margin-right: 32px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .top .text {
  border-left: 2px solid #d9d9d9;
  padding-left: 24px;
  text-align: left;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .top .text h3 {
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  padding-bottom: 24px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .top .text span {
  color: #444;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom {
  width: 1170px;
  position: relative;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom img {
  width: 1170px;
  height: auto;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .character {
  position: absolute;
  width: 270px;
  height: 185px;
  right: 96px;
  bottom: 57px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon {
  position: absolute;
  right: 68px;
  top: 383px;
  width: 676px;
  background-color: #111;
  border-radius: 12px;
  box-sizing: border-box;
  padding: 16px;
  box-shadow: 0 20px 38px -10px rgba(0, 0, 0, 0.32);
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon::before {
  content: "";
  position: absolute;
  width: 48px;
  height: 37px;
  background-image: url(https://dream-cdn.beusable.net/home/images/dashboard/icon-balloon-arrow.svg);
  background-repeat: no-repeat;
  top: -27px;
  left: 304px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result {
  padding: 24px;
  box-sizing: border-box;
  border-radius: 6px;
  border: 1px solid #444;
  background-color: #333;
  color: #fff;
  text-align: left;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result h3 {
  margin-bottom: 16px;
  font-size: 20px;
  font-weight: 600;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result ul {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-left: 14px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result ul .item {
  position: relative;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result ul .item::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
  background: #888;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result ul .item span {
  font-size: 15px;
  font-weight: 400;
  line-height: 150%; /* 22.5px */
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .differences {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  margin-top: 8px;
  padding: 16px;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .differences .title {
  color: #FFF;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%; /* 14px */
  padding: 6px 8px;
  border-radius: 4px;
  border: 1px solid #16B5D2;
  background: #0E90A5;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .differences .desc {
  width: 100%;
  display: flex;
  justify-content: space-between;
  text-align: left;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .differences .desc span {
  color: #CCC;
  font-size: 15px;
  font-weight: 500;
  line-height: 150%; /* 22.5px */
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .differences .desc img {
  width: 48px;
  height: 48px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom img {
  height: 541px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .character {
  width: 168px;
  height: 129px;
  top: 586px;
  right: 132px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon {
  width: 676px;
  height: 238px;
  top: 481px;
  left: 149px;
  right: initial;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon::before {
  left: 319px;
  transform: scale(-1, 1);
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .result {
  background-color: transparent;
  border: none;
  padding: 16px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .result span {
  font-size: 14px;
  font-weight: 600;
  line-height: 100%; /* 14px */
  padding: 6px 8px;
  border-radius: 4px;
  border: 1px solid #16B5D2;
  background-color: #0E90A5;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences {
  display: flex;
  flex-direction: row;
  gap: 17px;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin-top: 15px;
  height: 120px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .ga4.ko {
  margin-right: 26px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .ga4 .title {
  color: #F4F4F4;
  font-size: 16px;
  font-weight: 600;
  line-height: 150%; /* 24px */
  background-color: transparent;
  border: none;
  padding: 0;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .ga4 .text {
  margin-top: 12px;
  display: inline-block;
  color: #CCC;
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  line-height: 150%; /* 22.5px */
  word-break: break-word;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .ga4 .text.en {
  width: 293px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .versus {
  position: relative;
  z-index: 1;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .versus::before {
  content: "";
  width: 1px;
  height: 119px;
  background-color: #666;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .versus span {
  color: #FFF;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  line-height: 100%; /* 12px */
  width: 36px;
  height: 36px;
  padding: 5.3px;
  box-sizing: border-box;
  border-radius: 53px;
  background: #444;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .beusable {
  margin-top: -40px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .beusable img {
  width: 71px;
  height: 13px;
  margin-bottom: 12px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .beusable .title {
  color: #FAED4C;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  line-height: 100%; /* 18px */
  background-color: transparent;
  border: none;
  margin-bottom: 17px;
  padding: 0;
  min-width: 240px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .beusable .title.en {
  width: 287px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .beusable .text {
  color: #FFF;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 150%; /* 24px */
  margin-bottom: 16px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.third {
  margin-bottom: 77px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom img {
  width: 1170px;
  height: auto;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon {
  width: 480px;
  height: 225px;
  top: 585px;
  left: 60px;
  padding: 32px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon::before {
  left: 221px;
  transform: scale(-1, 1);
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon .result {
  background-color: transparent;
  border: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0;
  gap: 20px;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon .result .title {
  font-size: 14px;
  font-weight: 600;
  line-height: 100%; /* 14px */
  padding: 6px 8px;
  border-radius: 4px;
  border: 1px solid #16B5D2;
  background-color: #0E90A5;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon .result .text {
  width: 100%;
  color: #F4F4F4;
  font-size: 15px;
  font-weight: 600;
  line-height: 150%; /* 22.5px */
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon .result .text img {
  width: 48px;
  height: 48px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage {
  margin-top: 200px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  margin-bottom: 280px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left {
  width: 360px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left .label {
  color: #EC0047;
  font-size: 18px;
  font-weight: 600;
  line-height: 100%; /* 18px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left h3 {
  margin-bottom: 8px;
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left .text {
  color: #444;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left .text.ja {
  word-break: break-all;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left img {
  margin-top: 8px;
  width: 218px;
  height: 253px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 {
  width: 370px;
  height: 513px;
  border-radius: 20px;
  background: #EBEBEB;
  padding: 28px;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 h3 {
  color: #2F2F2F;
  font-size: 30px;
  font-weight: 600;
  line-height: 100%; /* 30px */
  margin-top: 8px;
  margin-bottom: 52px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 .list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-left: 4px;
  padding-bottom: 34px;
  border-bottom: 1px solid #ccc;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 .list .item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 .list .item .number {
  display: flex;
  width: 20px;
  height: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 91px;
  border: 1px solid #AAA;
  background: #FFF;
  color: #2F2F2F;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 100%; /* 10.909px */
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 .list .item .text {
  color: #2F2F2F;
  font-size: 15px;
  font-weight: 400;
  line-height: 100%; /* 15px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 .time {
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #2F2F2F;
  font-size: 16px;
  font-weight: 600;
  line-height: 100%; /* 16px */
  padding-left: 4px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable {
  width: 370px;
  height: 513px;
  border-radius: 20px;
  background: #111;
  padding: 28px;
  box-sizing: border-box;
  color: #FFF;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 52px;
  margin-top: 8px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .title h3 {
  color: #FFF;
  font-size: 30px;
  font-weight: 600;
  line-height: 100%; /* 30px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .title img {
  width: 89px;
  height: 17px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-left: 4px;
  padding-bottom: 34px;
  border-bottom: 1px solid #444;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list.ja {
  padding-bottom: 43px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-1 {
  align-items: flex-start;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-1 .text {
  margin-top: 2.5px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-1 .text > span {
  margin-top: 2px;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 {
  align-items: flex-start;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 .text {
  margin-top: 2.5px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 .text .ai-item {
  height: 20px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 .text .ai-item:first-child {
  margin-top: 2px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 .text .ai-item:not(:last-child) {
  margin-bottom: -4px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item .number {
  display: flex;
  width: 20px;
  height: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 91px;
  background: #EC0047;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 100%; /* 10.909px */
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item .text {
  font-size: 15px;
  font-weight: 400;
  line-height: 100%; /* 15px */
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .time {
  padding-left: 4px;
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  line-height: 100%; /* 16px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse {
  flex-direction: row-reverse;
  flex-wrap: wrap;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .left {
  text-align: right;
  align-items: flex-end;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .left .robot {
  width: 173px;
  height: 153px;
  margin-top: 19px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 h3 {
  margin-bottom: 32px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .balloon {
  margin-left: 17px;
  border-radius: 16px;
  padding: 12px 18px;
  background-color: #fff;
  box-sizing: border-box;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16);
  margin-bottom: 26px;
  width: fit-content;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .balloon span {
  color: #262626;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .balloon svg {
  position: absolute;
  top: 0;
  left: -17px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .balloon.second {
  margin-top: 24px;
  margin-bottom: 76px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .list {
  padding-bottom: 0;
  border: none;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .time {
  padding-top: 24px;
  border-top: 1px solid #ccc;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .title {
  margin-bottom: 32px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .balloon {
  width: fit-content;
  margin-left: 17px;
  border-radius: 16px;
  padding: 12px 18px;
  background-color: #52503E;
  box-sizing: border-box;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16);
  margin-bottom: 26px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .balloon span {
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .balloon svg {
  position: absolute;
  top: 0;
  left: -17px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .balloon.second {
  margin-top: 27px;
  margin-bottom: 86px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .balloon.second.en, .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .balloon.second.ja {
  margin-bottom: 66px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .list {
  padding-bottom: 0;
  border: none;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .list .item.item-0 {
  align-items: flex-start;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .list .item.item-0 .text {
  margin-top: 2.5px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .list .item.item-0 .text > span {
  margin-top: 2px;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .time {
  padding-top: 24px;
  border-top: 1px solid #444;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .left img {
  width: 178px;
  height: 213px;
  margin-top: 35px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .ga4 .list {
  padding-bottom: 194px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .title {
  margin-bottom: 32px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat {
  display: flex;
  flex-direction: column;
  gap: 29px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat .balloon {
  margin-left: 17px;
  width: 213px;
  border-radius: 16px;
  padding: 12px 18px;
  box-sizing: border-box;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16);
  background-color: #52503E;
  align-self: flex-start;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat .balloon span {
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat .balloon svg {
  position: absolute;
  top: 0;
  left: -17px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat .balloon.second {
  width: 229px;
  background-color: #404870;
  align-self: flex-end;
  margin-left: 0;
  margin-right: 17px;
  margin-bottom: 126.5px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat .balloon.second.ja {
  margin-bottom: 105.5px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat .balloon.second svg {
  left: auto;
  right: -17px;
  transform: scaleX(-1);
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .time {
  border-top: 1px solid #444;
  padding-top: 24px;
  margin-top: 0px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature {
  margin-top: 0;
  border: none;
  padding-bottom: 0;
  gap: 18px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature:not(:last-child):not(:nth-last-child(2)) {
  margin-bottom: 280px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature h3 {
  color: #222;
  text-align: center;
  font-size: 55px;
  font-weight: 600;
  line-height: 72px; /* 130.909% */
  letter-spacing: -1px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .desc {
  color: #444;
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
  margin-bottom: 18px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content {
  max-width: 1170px;
  display: flex;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 8px 15px 0 rgba(0, 0, 0, 0.16);
  padding: 40px 32px;
  box-sizing: border-box;
  min-height: 488px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div:not(:first-child) {
  padding-left: 32px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div:not(:last-child) {
  border-right: 1px solid #e0e0e0;
  padding-right: 32px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div.intermediate .example > span {
  background-color: #13A5BF;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div.superior .example > span {
  background-color: #6218CF;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div h4 {
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
  margin-bottom: 4px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div > span {
  color: #444;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div .example {
  width: 100%;
  padding: 8px;
  box-sizing: border-box;
  border-radius: 8px;
  background: #ECECEC;
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 326px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div .example > span {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%; /* 14px */
  display: inline-flex;
  padding: 6px 8px;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  background: #68BB0C;
  box-sizing: border-box;
  margin-bottom: 28px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div .example .list {
  padding-left: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 24px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div .example .list .item {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 23px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div .example .list .item .number {
  display: flex;
  width: 20px;
  height: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 91px;
  border: 1px solid #AAA;
  background: #FFF;
  color: #2F2F2F;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 100%; /* 10.909px */
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div .example .list .item .text {
  color: #2F2F2F;
  font-size: 15px;
  font-weight: 400;
  line-height: 150%; /* 22.5px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div > p {
  width: 100%;
  color: #444;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 150%; /* 24px */
  margin-top: 32px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern {
  width: 100%;
  border-radius: 20px;
  background: #EBEBEB;
  padding: 36px;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern:not(:last-child) {
  margin-bottom: 14px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header .number {
  display: flex;
  width: 40px;
  height: 40px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 182px;
  background: #EC0047;
  color: #fff;
  box-sizing: border-box;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  line-height: 100%; /* 21.818px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header .text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header .text span:first-child {
  color: #222;
  font-size: 26px;
  font-weight: 600;
  line-height: 150%; /* 39px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header .text span:last-child {
  color: #444;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%; /* 27px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat {
  display: flex;
  flex-direction: column;
  gap: 25px;
  padding: 0 44px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .user {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 28.5px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .user span {
  border-radius: 100px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #FFD900;
  display: inline-flex;
  padding: 6px 10px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  box-sizing: border-box;
  color: #222;
  font-size: 16px;
  font-weight: 600;
  line-height: 100%; /* 16px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .user .message {
  margin-top: 13px;
  background-color: #fff;
  color: #222;
  font-size: 14px;
  font-weight: 500;
  line-height: 150%; /* 21px */
  padding: 18px 24px;
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  position: relative;
  text-align: left;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .user .message svg {
  position: absolute;
  top: 0;
  right: -17px;
  transform: scaleX(-1);
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .ai {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 28.5px;
  margin-bottom: 16px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .ai span {
  border-radius: 100px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #0086FF;
  display: inline-flex;
  height: 30px;
  padding: 6px 10px;
  justify-content: center;
  align-items: center;
  color: #FFF;
  font-size: 16px;
  font-weight: 600;
  line-height: 100%; /* 16px */
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .ai .message {
  margin-top: 13px;
  background-color: #354180;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 150%; /* 21px */
  padding: 18px 24px;
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  position: relative;
  text-align: left;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .ai .message svg {
  position: absolute;
  top: 0;
  left: -17px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern.last {
  background-color: #111;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern.last .header .text span {
  color: #fff;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern.last .header .text span:last-child {
  color: #CCC;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern.last .chat .user .message {
  background-color: #444;
  color: #fff;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 38px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated.consultant {
  grid-template-columns: repeat(2, 1fr);
  margin-top: 20px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated .item {
  width: 370px;
  height: 386px;
  border-radius: 10px;
  background: #FFF;
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.27), 0 3px 9px 0 rgba(0, 0, 0, 0.14);
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated .item img {
  width: 82px;
  height: 82px;
  margin-top: 80px;
  margin-bottom: 52px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated .item h4 {
  color: #2F2F2F;
  text-align: center;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.5px;
  margin-bottom: 24px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated .item span {
  color: #666;
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  line-height: 23px; /* 153.333% */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 52px;
  margin-top: 20px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 {
  border-radius: 20px;
  background: #EBEBEB;
  padding: 28px;
  box-sizing: border-box;
  min-width: 448px;
  max-height: 448px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .title {
  text-align: left;
  color: #2F2F2F;
  font-size: 26px;
  font-weight: 600;
  line-height: 100%; /* 26px */
  margin-top: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #CCC;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .content {
  margin-top: 50px;
  background-color: transparent;
  box-shadow: none;
  border: none;
  display: flex;
  flex-direction: column;
  gap: 41px;
  padding: 0;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .content .payment {
  color: #7C40DD;
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  line-height: 100%; /* 30px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .content .list {
  background-color: #fff;
  padding: 28px 62px 32px 35px;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .content .list .item span {
  text-align: left;
  color: #2F2F2F;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%; /* 27px */
  position: relative;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .content .list .item span:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -10px;
  transform: translateY(-50%);
  width: 3px;
  height: 3px;
  background-color: #555;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable {
  border-radius: 20px;
  background: #111;
  padding: 28px;
  box-sizing: border-box;
  min-width: 448px;
  max-height: 448px;
  position: relative;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .title {
  text-align: left;
  color: #fff;
  font-size: 26px;
  font-weight: 600;
  line-height: 100%; /* 26px */
  margin-top: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #444;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .title img {
  width: 89px;
  height: 17px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .content {
  margin-top: 50px;
  background-color: transparent;
  box-shadow: none;
  border: none;
  display: flex;
  flex-direction: column;
  gap: 41px;
  padding: 0;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .content .payment {
  color: #FCE515;
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  line-height: 100%; /* 30px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .content .list {
  background-color: #2F2F2F;
  padding: 28px 62px 32px 35px;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .content .list .item span {
  text-align: left;
  color: #fff;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%; /* 27px */
  position: relative;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .content .list .item span:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -10px;
  transform: translateY(-50%);
  width: 3px;
  height: 3px;
  background-color: #888;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .hide-robot {
  position: absolute;
  width: 82px;
  height: 158px;
  right: -82px;
  bottom: 71px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow {
  margin-top: 102px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow h3 {
  font-size: 36px;
  line-height: 47px; /* 130.556% */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap {
  box-shadow: none;
  margin-top: 110px;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 {
  border-radius: 20px;
  display: flex;
  align-items: flex-start;
  gap: 19px;
  padding: 52px 52px 52px 40px;
  background-color: #EBEBEB;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .title {
  min-width: 208px;
  text-align: left;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .title span {
  color: #888;
  font-size: 18px;
  font-weight: 600;
  line-height: 120%; /* 21.6px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .title p {
  margin-top: 8px;
  color: #222;
  font-size: 26px;
  font-weight: 600;
  line-height: 150%; /* 39px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .list {
  min-width: 251px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .list .item {
  text-align: right;
  display: flex;
  gap: 24px;
  align-items: center;
  justify-content: flex-end;
  border-bottom: 1px solid #CCC;
  padding-bottom: 16px;
  color: #444;
  font-size: 22px;
  font-weight: 500;
  line-height: 100%; /* 22px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .list .item:not(:first-child) {
  padding-top: 16px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .list .item:last-child {
  padding-bottom: 0;
  border-bottom: none;
  color: #2F2F2F;
  font-size: 26px;
  font-weight: 600;
  line-height: 100%; /* 26px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable {
  border-radius: 20px;
  display: flex;
  align-items: flex-start;
  flex-direction: row-reverse;
  gap: 19px;
  padding: 52px 40px 52px 52px;
  background-color: #111;
  box-sizing: border-box;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .title {
  min-width: 208px;
  text-align: right;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .title span {
  color: #ec0047;
  font-size: 18px;
  font-weight: 600;
  line-height: 120%; /* 21.6px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .title p {
  margin-top: 8px;
  color: #fff;
  font-size: 26px;
  font-weight: 600;
  line-height: 150%; /* 39px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list {
  min-width: 251px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list .item {
  text-align: right;
  display: flex;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  border-bottom: 1px solid #444;
  padding-bottom: 16px;
  color: #fff;
  font-size: 22px;
  font-weight: 500;
  line-height: 100%; /* 22px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list .item:not(:last-child) .label {
  text-decoration-line: line-through;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list .item:not(:first-child) {
  padding-top: 16px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list .item:last-child {
  padding-bottom: 0;
  border-bottom: none;
  color: #FCE515;
  font-size: 26px;
  font-weight: 600;
  line-height: 100%; /* 26px */
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .result {
  width: 100%;
  position: relative;
  margin-top: 102px;
  color: #222;
  text-align: center;
  font-size: 36px;
  font-weight: 600;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
.dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .result img {
  width: 174px;
  height: 194px;
  position: absolute;
  top: 50%;
  right: 44px;
  transform: translateY(-50%);
}
.dashboard.container .dashboard-footer {
  width: 100%;
  background-color: #EBEBEB;
  padding: 120px 0;
  margin-top: 114px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 52px;
}
.dashboard.container .dashboard-footer h3 {
  color: #222;
  font-size: 55px;
  font-weight: 600;
  line-height: 72px; /* 130.909% */
  letter-spacing: -1px;
}
.dashboard.container .dashboard-footer .desc {
  color: #444;
  font-size: 30px;
  font-weight: 500;
  line-height: 150%; /* 45px */
}
.dashboard.container .dashboard-footer .list {
  margin-top: 38px;
}
.dashboard.container .dashboard-footer .list .item {
  display: flex;
  width: 1157px;
  padding: 28px 10px;
  justify-content: center;
  align-items: center;
  gap: 16px;
  color: #444;
  font-size: 30px;
  font-weight: 500;
  line-height: 150%; /* 45px */
  border-radius: 16px;
  background: #FFF;
  margin-top: 12px;
}
.dashboard.container .dashboard-footer .list .item img {
  width: 36px;
  height: 36px;
}
.dashboard.container .dashboard-footer .closing {
  padding-top: 18px;
  padding-bottom: 10px;
  color: #2F2F2F;
  font-size: 36px;
  font-weight: 600;
  line-height: 150%; /* 54px */
}

@media all and (max-width: 768px) {
  .dashboard.container {
    flex-direction: column;
    align-items: center;
    word-break: break-all;
  }
  .dashboard.container.en {
    word-break: normal;
  }
  .dashboard.container .dashboard.contents {
    margin-bottom: 80px !important;
  }
  .dashboard.container .dashboard.contents .title-wrapper {
    width: 100%;
    margin-top: 45px;
    border-bottom: 1px solid #c1c1c1;
    padding-bottom: 41px;
  }
  .dashboard.container .dashboard.contents .title-wrapper .title {
    font-size: 30px;
    line-height: 39px; /* 130% */
    margin-bottom: 15px;
    margin-top: 8px;
  }
  .dashboard.container .dashboard.contents .title-wrapper .sub-title {
    font-size: 14px;
    line-height: 22px; /* 157.143% */
    margin-bottom: -19px;
  }
  .dashboard.container .dashboard.contents .title-wrapper .desc {
    font-size: 14px;
    font-weight: 600;
    line-height: 22px; /* 157.143% */
  }
  .dashboard.container .dashboard.contents .title-wrapper .img-wrap {
    margin-top: 20px;
    width: 250px;
    height: 161px;
  }
  .dashboard.container .dashboard.contents .title-wrapper .img-wrap .icon-dashboard {
    width: 250px;
    height: 161px;
  }
  .dashboard.container .dashboard.contents .features-wrapper {
    max-width: 375px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 50px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature {
    width: 100%;
    gap: 12px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 50px;
    box-sizing: border-box;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature:not(:first-child) {
    margin-top: 50px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature.en, .dashboard.container .dashboard.contents .features-wrapper .feature.ja {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature.trap-wrapper {
    padding-left: 20px;
    padding-right: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature.trap-wrapper .title-wrapper {
    align-items: flex-start;
    margin-left: 0px;
    border: none;
    padding-bottom: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .title-wrapper {
    margin: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .title-wrapper .title {
    color: #333;
    font-size: 22px;
    line-height: 30px; /* 136.364% */
    margin-bottom: 15px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .title-wrapper .caption {
    color: rgba(51, 51, 51, 0.8);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
    text-align: left;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap {
    display: flex;
    gap: 12px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality {
    flex-direction: column;
    gap: 12px;
    margin-top: 0px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content {
    width: 335px;
    height: 463px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .header span {
    background: #D7D7D7;
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 16px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .header .icon-question-mark {
    width: 34px;
    height: 34px;
    margin-right: 6px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples {
    margin-top: 16px;
    padding: 0 8px;
    box-sizing: border-box;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples h3 {
    font-size: 24px;
    letter-spacing: -1px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .example {
    margin-top: 28px;
    padding-left: 26px;
    padding-right: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .example.en {
    padding-left: 4px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .example.ja {
    padding-left: 0;
    padding-right: 12px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .example div {
    gap: 12px;
    font-size: 16px;
    letter-spacing: -1px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .reality-content .examples .result {
    margin-top: 36px;
    gap: 8px;
    font-size: 16px;
    padding-left: 2px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation {
    width: 100%;
    height: initial;
    border-radius: 20px;
    border: 6px solid #EC0047;
    background: #F6F6F6;
    box-shadow: none;
    padding: 12px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .header {
    height: auto;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .header span {
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    line-height: 29px;
    padding: 4px 8px;
    align-items: center;
    gap: 4px;
    margin-top: 2px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .header span img {
    width: 77px;
    height: 14px;
    margin-top: -2px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .header .icon-sketch-mark {
    width: 63px;
    height: 34px;
    flex-shrink: 0;
    margin-right: 4px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples {
    margin-top: 16px;
    padding: 0 14px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples h3 {
    color: #444;
    font-size: 24px;
    padding-bottom: 12px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example {
    margin-top: 28px;
    gap: 12px;
    padding-left: 26px;
    padding-right: 20px;
    height: initial;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example.ja {
    padding-left: 0;
    padding-right: 0px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example.ja div {
    font-size: 15px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example.en {
    padding-left: 8px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example div {
    text-align: left;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    font-weight: 500;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .example div img {
    width: 22px;
    height: 22px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .examples .result {
    margin-top: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide {
    margin-top: 20px;
    padding: 16px;
    width: initial;
    height: initial;
    box-sizing: border-box;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide .title {
    color: #FFD900;
    font-size: 20px;
    font-weight: 600;
    line-height: 150%; /* 30px */
    padding-left: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide ul {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-left: 9px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide ul li {
    position: relative;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .trap .innovation .provide ul li::before {
    content: "";
    position: absolute;
    width: 3px;
    height: 3px;
    left: -10px;
    top: 50%;
    transform: translateY(-50%);
    background: #888;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps {
    gap: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps:not(:first-child) {
    margin-top: 475px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .top {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .top .step {
    padding: 10px 12px;
    font-size: 20px;
    margin-right: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .top .text {
    border-left: none;
    padding-left: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .top .text h3 {
    color: #222;
    font-size: 22px;
    line-height: 30px;
    padding-bottom: 15px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .top .text span {
    color: rgba(51, 51, 51, 0.8);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom {
    width: 100%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom img {
    width: 100%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .character {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon {
    margin-top: 21px;
    position: initial;
    width: 100%;
    box-shadow: 0 20px 38px -10px rgba(0, 0, 0, 0.32);
    border-radius: 12px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon::before {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result ul {
    padding-left: 14px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result ul.ja {
    padding-left: 5px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result ul .item {
    position: relative;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .result ul .item::before {
    left: -8px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .differences {
    margin-top: 16px;
    padding: 4px;
    margin-bottom: 4px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .differences .desc {
    text-align: left;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps .bottom .text-balloon .differences .desc img {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second {
    margin-top: 80px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom img {
    height: auto;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon {
    width: 100%;
    height: initial;
    padding: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .result {
    padding: 6px 8px;
    border-radius: 4px;
    border: 1px solid #16B5D2;
    background-color: #0E90A5;
    width: fit-content;
    box-sizing: border-box;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .result span {
    padding: 0;
    border: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 16px;
    height: initial;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .ga4.ko {
    margin-right: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .ga4 .text {
    margin-top: 8px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .versus {
    position: relative;
    z-index: 1;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .versus::before {
    content: "";
    height: 1px;
    width: 295px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .beusable {
    margin-top: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .beusable img {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .beusable .title {
    margin-bottom: 8px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.second .bottom .text-balloon .differences .beusable .text {
    display: inline-block;
    font-size: 15px;
    font-weight: 500;
    line-height: 150%;
    margin-bottom: 24px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.third {
    margin-top: 80px;
    margin-bottom: 0px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom img {
    width: 100%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon {
    width: 100%;
    height: initial;
    padding: 20px;
    box-sizing: border-box;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon .result {
    gap: 16px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon .result .text {
    font-weight: 500;
  }
  .dashboard.container .dashboard.contents .features-wrapper .feature .steps.third .bottom .text-balloon .result .text img {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage {
    margin-top: 50px;
    max-width: 375px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper {
    padding: 0 20px;
    box-sizing: border-box;
    align-items: center;
    gap: 20px;
    margin-bottom: 80px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left {
    width: 100%;
    gap: 5px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left .label {
    font-size: 14px;
    line-height: 22px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left h3 {
    margin-bottom: 10px;
    color: #333;
    font-size: 22px;
    line-height: 38px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left .text {
    color: rgba(51, 51, 51, 0.8);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .left img {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right {
    width: 100%;
    gap: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 {
    width: 100%;
    height: initial;
    border-radius: 20px;
    padding: 24px;
    box-sizing: border-box;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 h3 {
    font-size: 26px;
    margin-top: 12px;
    margin-left: 4px;
    margin-bottom: 28px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 .list {
    margin-left: 8px;
    padding-bottom: 28px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .ga4 .time {
    margin-top: 20px;
    padding-left: 8px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable {
    width: 100%;
    height: initial;
    border-radius: 20px;
    padding: 24px;
    box-sizing: border-box;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .title {
    margin-bottom: 28px;
    margin-top: 12px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .title h3 {
    font-size: 26px;
    font-weight: 500;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list {
    margin-left: 8px;
    padding-bottom: 28px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-1 {
    align-items: flex-start;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-1 .text {
    margin-top: 2.5px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-1 .text > span {
    margin-top: 2px;
    font-size: 14px;
    font-weight: 400;
    line-height: 150%; /* 21px */
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 {
    align-items: flex-start;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 .text {
    margin-top: 2.5px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 .text .ai-item {
    height: 20px;
    display: flex;
    align-items: center;
    gap: 4px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 .text .ai-item:first-child {
    margin-top: 2px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .list .item.item-2 .text .ai-item:not(:last-child) {
    margin-bottom: -4px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper .right .beusable .time {
    padding-left: 8px;
    margin-top: 20px;
    font-size: 18px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse {
    flex-direction: column;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .left {
    text-align: left;
    align-items: flex-start;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 h3 {
    margin-bottom: 28px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .balloon {
    padding: 12px 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .balloon.second {
    margin-bottom: 50px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .list {
    padding-bottom: 0;
    border: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .ga4 .time {
    padding-top: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .title {
    margin-bottom: 28px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .balloon {
    padding: 12px 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .balloon.second {
    margin-top: 26px;
    margin-bottom: 40px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.reverse .right .beusable .time {
    padding-top: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .ga4 .list {
    padding-bottom: 188px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .title {
    margin-bottom: 28px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat .balloon {
    width: fit-content;
    padding: 12px 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat .balloon span {
    font-weight: 500;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .chat .balloon.second {
    width: fit-content;
    margin-right: 17px;
    margin-bottom: 100.5px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .if-wrapper.mean .right .beusable .time {
    padding-top: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature {
    margin-top: 0;
    border: none;
    padding-bottom: 0;
    gap: 15px;
    align-items: flex-start;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature:not(:last-child):not(:nth-last-child(2)) {
    margin-bottom: 80px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature h3 {
    color: #333;
    font-size: 22px;
    font-weight: 700;
    line-height: 30px; /* 136.364% */
    text-align: left;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .desc {
    color: rgba(51, 51, 51, 0.8);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
    text-align: left;
    margin-bottom: 5px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
    min-height: initial;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 20px;
    padding: 32px 16px;
    background: #FFF;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 8px 15px 0 rgba(0, 0, 0, 0.16);
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div:not(:first-child) {
    padding-left: 16px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div:not(:last-child) {
    border-right: none;
    padding-right: 13px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div.intermediate .example > span {
    background-color: #13A5BF;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div.superior .example > span {
    background-color: #6218CF;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div h4 {
    padding-left: 12px;
    font-size: 26px;
    font-weight: 600;
    line-height: 100%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div > span {
    padding-left: 12px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div .example {
    width: 100%;
    margin-top: 14px;
    min-width: initial;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div .example > span {
    margin-bottom: 16px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div .example .list {
    gap: 4px;
    padding-bottom: 19px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .content > div > p {
    margin-top: 24px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern {
    width: 100%;
    padding: 20px 20px 73px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern:not(:last-child) {
    margin-bottom: 5px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 57px;
    position: relative;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header .number {
    width: 32px;
    height: 32px;
    font-size: 18px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header .text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 9px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header .text span:first-child {
    font-size: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .header .text span:last-child {
    position: absolute;
    left: 0;
    top: 39px;
    font-size: 16px;
    text-align: left;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .user {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 8px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .user .message {
    margin-top: 0;
    padding: 16px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .user .message svg {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .ai {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 8px;
    margin-bottom: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .ai span {
    height: initial;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .ai .message {
    margin-top: 0;
    padding: 16px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern .chat .ai .message svg {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern:nth-last-child(2) {
    padding-bottom: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern:nth-last-child(4) {
    padding-bottom: 31px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .pattern.last {
    background-color: #111;
    padding-bottom: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated.consultant {
    grid-template-columns: repeat(2, 1fr);
    margin-top: 33px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated .item {
    width: 100%;
    height: initial;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    align-items: flex-start;
    gap: 24px;
    text-align: left;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated .item:not(:last-child) {
    padding-bottom: 20px;
    border-bottom: 1px solid #E0E0E0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated .item img {
    width: 56px;
    height: 56px;
    margin-top: 0;
    margin-bottom: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated .item h4 {
    text-align: left;
    font-size: 18px;
    margin-bottom: 8px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .differentiated .item span {
    text-align: left;
    line-height: 150%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting {
    width: 100%;
    display: flex;
    gap: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 {
    padding: 20px;
    min-width: initial;
    max-height: initial;
    width: 100%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .title {
    text-align: center;
    font-size: 20px;
    margin-top: 0;
    padding-bottom: 16px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .content {
    margin-top: 24px;
    border: none;
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .content .payment {
    font-size: 26px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .ga4 .content .list {
    padding: 24px 24px 24px 35px;
    gap: 4px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable {
    padding: 20px;
    min-width: initial;
    max-height: initial;
    width: 100%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .title {
    text-align: center;
    font-size: 20px;
    margin-top: 0;
    padding-bottom: 16px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .title img {
    width: 89px;
    height: 17px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .content {
    margin-top: 24px;
    border: none;
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding: 0;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .content .payment {
    font-size: 26px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .content .list {
    padding: 24px 24px 24px 35px;
    gap: 4px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature .consulting .beusable .hide-robot {
    display: none;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow {
    width: 100%;
    margin-top: 80px;
    align-items: center;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow h3 {
    text-align: center;
    font-size: 18px;
    line-height: 150%; /* 27px */
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap {
    width: 100%;
    box-shadow: none;
    margin-top: 9px;
    gap: 30px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    padding: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .title {
    margin-top: 4px;
    min-width: initial;
    text-align: center;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .title span {
    font-size: 14px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .title p {
    margin-top: 2px;
    font-size: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .list {
    min-width: initial;
    width: 100%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .list .item {
    text-align: center;
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 8px;
    font-size: 15px;
    font-weight: 600;
    line-height: 150%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .list .item:not(:first-child) {
    padding-top: 8px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .ga4 .list .item:last-child {
    font-size: 18px;
    line-height: 150%;
    padding-bottom: 12px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    padding: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .title {
    margin-top: 4px;
    min-width: initial;
    text-align: center;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .title span {
    font-size: 14px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .title p {
    margin-top: 2px;
    font-size: 20px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list {
    min-width: initial;
    width: 100%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list .item {
    text-align: center;
    display: flex;
    gap: 24px;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 8px;
    font-size: 15px;
    font-weight: 600;
    line-height: 150%;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list .item:not(:last-child) .label {
    text-decoration-line: line-through;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list .item:not(:first-child) {
    padding-top: 8px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .wrap .beusable .list .item:last-child {
    font-size: 18px;
    line-height: 150%;
    padding-bottom: 12px;
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .result {
    width: 100%;
    margin-top: 9px;
    color: #333;
    font-size: 18px;
    font-weight: 600;
    line-height: 150%; /* 27px */
  }
  .dashboard.container .dashboard.contents .features-wrapper .advantage .feature.work-flow .result img {
    display: none;
  }
  .dashboard.container .dashboard-footer {
    padding: 36px 20px;
    margin-top: 0;
    gap: 20px;
    box-sizing: border-box;
    margin-bottom: 20px;
  }
  .dashboard.container .dashboard-footer h3 {
    color: #333;
    font-size: 22px;
    font-weight: 700;
    line-height: 30px; /* 136.364% */
  }
  .dashboard.container .dashboard-footer .desc {
    color: rgba(51, 51, 51, 0.8);
    font-size: 14px;
    line-height: 22px; /* 157.143% */
  }
  .dashboard.container .dashboard-footer .list {
    width: 100%;
    margin-top: 0;
  }
  .dashboard.container .dashboard-footer .list .item {
    display: flex;
    width: 100%;
    padding: 16px;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    color: #444;
    font-size: 15px;
    font-weight: 600;
    margin-top: 8px;
    box-sizing: border-box;
    text-align: right;
  }
  .dashboard.container .dashboard-footer .list .item img {
    width: 24px;
    height: 24px;
  }
  .dashboard.container .dashboard-footer .closing {
    padding: 16px 0;
    color: #333;
    font-size: 18px;
  }
}
#uxheatmap-features-detail.container {
  flex-direction: column;
  align-items: center;
}
#uxheatmap-features-detail.container .contents {
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  margin-bottom: 0;
}
#uxheatmap-features-detail.container .contents div {
  box-sizing: border-box;
}
#uxheatmap-features-detail.container .contents .summary {
  color: #222;
  position: relative;
}
#uxheatmap-features-detail.container .contents .summary h2 {
  text-align: center;
  font-size: 55px;
  font-weight: 700;
  line-height: 72px; /* 130.909% */
  letter-spacing: -1px;
  margin-top: 32px;
}
#uxheatmap-features-detail.container .contents .summary .desc {
  margin-top: 24px;
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: 42px; /* 161.538% */
}
#uxheatmap-features-detail.container .contents .summary img {
  width: 565px;
  height: 316px;
}
#uxheatmap-features-detail.container .contents .summary video {
  position: absolute;
  top: 565px;
  width: 1024px;
  height: 576px;
  aspect-ratio: 16/9;
  border-radius: 24px;
  box-shadow: 0 52px 44px -24px rgba(0, 0, 0, 0.44);
}
#uxheatmap-features-detail.container .contents .summary video.en {
  top: 607px;
}
#uxheatmap-features-detail.container .contents .summary .effect {
  display: flex;
  align-items: center;
  gap: 30px;
  margin-top: 605px;
}
#uxheatmap-features-detail.container .contents .summary .effect .info {
  width: 370px;
  height: 370px;
  padding: 40px 24px 0 24px;
  border-radius: 10px;
  background: #FFF;
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.27), 0 3px 9px 0 rgba(0, 0, 0, 0.14);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
#uxheatmap-features-detail.container .contents .summary .effect .info img {
  width: 82px;
  height: 82px;
  margin-top: 0;
}
#uxheatmap-features-detail.container .contents .summary .effect .info .text {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
}
#uxheatmap-features-detail.container .contents .summary .effect .info .text .time {
  text-align: center;
  font-size: 44px;
  font-weight: 700;
  letter-spacing: -0.5px;
}
#uxheatmap-features-detail.container .contents .summary .effect .info .text .time-1 {
  color: #FFBF00;
}
#uxheatmap-features-detail.container .contents .summary .effect .info .text .time-2 {
  color: #FF8400;
}
#uxheatmap-features-detail.container .contents .summary .effect .info .text .time-3 {
  color: #ec0047;
}
#uxheatmap-features-detail.container .contents .summary .effect .info .text .title {
  color: #2F2F2F;
  text-align: center;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
#uxheatmap-features-detail.container .contents .summary .effect .info .text .desc {
  margin-top: 0;
  color: #666;
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  line-height: 23px; /* 153.333% */
}
#uxheatmap-features-detail.container .contents .features {
  row-gap: 280px;
  margin-top: 280px;
}
#uxheatmap-features-detail.container .contents .features .feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 78px;
}
#uxheatmap-features-detail.container .contents .features .feature .writing {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
#uxheatmap-features-detail.container .contents .features .feature .writing .title {
  color: #222;
  text-align: center;
  font-size: 55px;
  font-weight: 600;
  line-height: 72px; /* 130.909% */
}
#uxheatmap-features-detail.container .contents .features .feature .writing .description {
  margin-top: 10px;
  color: #444;
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px; /* 161.111% */
}
#uxheatmap-features-detail.container .contents .features .feature .writing .caption {
  color: #444;
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%; /* 27px */
}
#uxheatmap-features-detail.container .contents .features .feature .items {
  display: flex;
  align-items: center;
  gap: 54px;
  position: relative;
}
#uxheatmap-features-detail.container .contents .features .feature .items .info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
  min-width: 300px;
}
#uxheatmap-features-detail.container .contents .features .feature .items .info .wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
}
#uxheatmap-features-detail.container .contents .features .feature .items .info .wrap img {
  width: 58px;
  height: 58px;
}
#uxheatmap-features-detail.container .contents .features .feature .items .info .wrap .title {
  color: #444;
  text-align: center;
  font-size: 22px;
  font-weight: 500;
  line-height: 150%; /* 33px */
}
#uxheatmap-features-detail.container .contents .features .feature .items .info .time {
  color: #2F2F2F;
  font-size: 60px;
  font-weight: 700;
  line-height: 100%; /* 60px */
}
#uxheatmap-features-detail.container .contents .features .feature .items .line {
  width: 1px;
  height: 215px;
  background-color: #CCC;
}
#uxheatmap-features-detail.container .contents .features .feature .items .character {
  position: absolute;
  top: 161px;
  left: 169px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus {
  gap: 30px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable {
  display: flex;
  padding: 40px 32px 56px 32px;
  flex-direction: column;
  align-items: flex-start;
  gap: 33px;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 8px 15px 0 rgba(0, 0, 0, 0.12);
  box-sizing: border-box;
  width: 390px;
  height: 444px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .caption, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .caption {
  padding: 6px 8px;
  color: #FFF;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%; /* 14px */
  border-radius: 4px;
  box-sizing: border-box;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .title, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .title {
  color: #222;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px; /* 130.556% */
  letter-spacing: -1px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .list, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .list {
  width: 326px;
  height: 152px;
  display: flex;
  padding: 18px;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  border-radius: 8px;
  box-sizing: border-box;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .list .info, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .list .info {
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 8px;
  font-size: 15px;
  font-weight: 400;
  line-height: 150%; /* 22.5px */
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .list .info img, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .list .info img {
  width: 20px;
  height: 20px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .description, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .description {
  color: #444;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 150%; /* 24px */
  margin: 0 auto;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .caption {
  background-color: #AAA;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .list {
  background-color: #ECECEC;
  color: #2F2F2F;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable {
  border: 3px solid #EC0047;
  position: relative;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .caption {
  background-color: #EC0047;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .list {
  background-color: #222;
  color: #fff;
}
#uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .character {
  position: absolute;
  width: 161px;
  height: 237px;
  top: 233px;
  left: 320px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story {
  justify-content: center;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list {
  width: 1142px;
  position: relative;
  display: flex;
  gap: 56px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .image-wrap {
  display: flex;
  flex-direction: column;
  gap: 62px;
  padding-left: 357px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .image-wrap img {
  height: 157px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .image-wrap img:first-child {
  width: 199px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .image-wrap img:nth-child(2) {
  width: 226px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .image-wrap img:last-child {
  width: 214px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap {
  display: flex;
  gap: 22px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .line {
  width: 1px;
  height: 593px;
  background-color: #000;
  position: relative;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .line .circle {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 29px;
  height: 29px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .line .circle div {
  width: 13px;
  height: 13px;
  background-color: #000;
  border-radius: 50%;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .line .circle:first-child {
  top: -16px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .line .circle:nth-child(2) {
  top: 206px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .line .circle:last-child {
  top: 425px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text {
  display: flex;
  flex-direction: column;
  gap: 68px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: flex-start;
  justify-content: flex-start;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info:first-child {
  margin-top: -16px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info:last-child {
  margin-top: 6px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info .time {
  color: #EC0047;
  font-size: 20px;
  font-weight: 600;
  line-height: 120%; /* 24px */
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info .title {
  color: #212121;
  font-size: 26px;
  font-weight: 600;
  line-height: 120%; /* 31.2px */
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info ul {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 6px;
  padding-left: 16px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info ul .item {
  list-style: disc;
  color: #212121;
  font-size: 18px;
  font-weight: 500;
  line-height: 120%; /* 21.6px */
}
#uxheatmap-features-detail.container .contents .features .feature .items.story .list .character {
  position: absolute;
  top: 368px;
  left: 46px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.differences {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: 30px;
  column-gap: 31px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.differences .info {
  gap: 24px;
  width: 370px;
  height: 370px;
  padding: 60px 24px 0 24px;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  border-radius: 10px;
  background: #F6F6F6;
}
#uxheatmap-features-detail.container .contents .features .feature .items.differences .info img {
  width: 82px;
  height: 82px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.differences .info .title {
  margin-top: 12px;
  color: #EC0047;
  text-align: center;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.differences .info .dot-line {
  width: 100%;
  border: 1px dashed #aaa;
}
#uxheatmap-features-detail.container .contents .features .feature .items.differences .info .desc {
  color: #666;
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  line-height: 23px; /* 153.333% */
}
#uxheatmap-features-detail.container .contents .features .feature .items.case {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  row-gap: 30px;
  column-gap: 31px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.case .info {
  gap: 12px;
  display: flex;
  width: 370px;
  height: 370px;
  padding: 52px 24px 0 24px;
  flex-direction: column;
  align-items: center;
  border-radius: 10px;
  background: #FFF;
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.27), 0 3px 9px 0 rgba(0, 0, 0, 0.14);
}
#uxheatmap-features-detail.container .contents .features .feature .items.case .info img {
  width: 82px;
  height: 82px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.case .info .title {
  margin-top: 24px;
  color: #2F2F2F;
  text-align: center;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
#uxheatmap-features-detail.container .contents .features .feature .items.case .info .desc {
  margin-top: 12px;
  color: #666;
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  line-height: 23px; /* 153.333% */
}
#uxheatmap-features-detail.container .contents .features .feature .items.case .info .tip {
  color: #F46200;
  font-size: 15px;
  font-weight: 600;
  line-height: 150%; /* 22.5px */
}

@media all and (max-width: 768px) {
  #uxheatmap-features-detail.container .contents {
    margin-bottom: 20px;
  }
  #uxheatmap-features-detail.container .contents .summary {
    border-bottom: none;
    color: #333;
  }
  #uxheatmap-features-detail.container .contents .summary h2 {
    margin-top: 15px;
    font-size: 18px;
    font-weight: 600;
    line-height: 150%; /* 27px */
  }
  #uxheatmap-features-detail.container .contents .summary .desc {
    margin-top: 15px;
    font-size: 14px;
    line-height: 150%; /* 21px */
  }
  #uxheatmap-features-detail.container .contents .summary img {
    width: 257px;
    height: 144px;
    margin-top: 24px;
    margin-bottom: 218px;
  }
  #uxheatmap-features-detail.container .contents .summary video {
    width: 335px;
    height: 188px;
    aspect-ratio: 335/188;
    top: 267px;
    border-radius: 20px;
    box-shadow: 0 28px 32px -24px rgba(0, 0, 0, 0.44);
  }
  #uxheatmap-features-detail.container .contents .summary video.en, #uxheatmap-features-detail.container .contents .summary video.ja {
    top: 288px;
  }
  #uxheatmap-features-detail.container .contents .summary .effect {
    margin-top: 0;
    gap: 20px;
    flex-direction: column;
    border-top: 1px solid #C1C1C1;
    width: 100%;
    padding-top: 48px;
  }
  #uxheatmap-features-detail.container .contents .summary .effect .info {
    width: 100%;
    height: 171px;
    padding: 24px 24px 28px 24px;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    max-width: 335px;
  }
  #uxheatmap-features-detail.container .contents .summary .effect .info img {
    width: 64px;
    height: 64px;
  }
  #uxheatmap-features-detail.container .contents .summary .effect .info .text {
    gap: 12px;
    align-items: flex-start;
  }
  #uxheatmap-features-detail.container .contents .summary .effect .info .text .time {
    font-size: 24px;
  }
  #uxheatmap-features-detail.container .contents .summary .effect .info .text .title {
    text-align: left;
    font-size: 20px;
  }
  #uxheatmap-features-detail.container .contents .summary .effect .info .text .desc {
    margin-top: -4px;
    text-align: left;
  }
  #uxheatmap-features-detail.container .contents .features {
    margin-top: 128px;
    row-gap: 128px;
  }
  #uxheatmap-features-detail.container .contents .features .feature {
    gap: 48px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .writing {
    gap: 12px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .writing .title {
    color: #333;
    font-size: 26px;
    font-weight: 700;
    line-height: 30px; /* 115.385% */
  }
  #uxheatmap-features-detail.container .contents .features .feature .writing .description {
    margin-top: 0;
    color: rgba(51, 51, 51, 0.8);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
  }
  #uxheatmap-features-detail.container .contents .features .feature .writing .caption {
    color: rgba(51, 51, 51, 0.8);
    font-size: 12px;
    font-weight: 500;
    line-height: 22px; /* 183.333% */
  }
  #uxheatmap-features-detail.container .contents .features .feature .items {
    flex-direction: column;
    gap: 32px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items .info {
    width: 100%;
    flex-direction: row;
    gap: 26px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items .info .wrap {
    gap: 8px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items .info .wrap .title {
    font-size: 18px;
    font-weight: 600;
    line-height: 150%; /* 27px */
    min-width: 144px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items .info .time {
    text-align: center;
    min-width: 112px;
    font-size: 48px;
    line-height: 100%; /* 48px */
  }
  #uxheatmap-features-detail.container .contents .features .feature .items .info .line {
    height: 112px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.versus {
    padding: 0 20px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable {
    padding: 36px 32px 48px 32px;
    gap: 16px;
    width: 335px;
    height: 381px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .title, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .title {
    font-size: 24px;
    line-height: 47px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.versus .nrt .list, #uxheatmap-features-detail.container .contents .features .feature .items.versus .beusable .list {
    width: 271px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.story .list {
    width: 100%;
    gap: 0;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap {
    padding-left: 20px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .line {
    height: 471px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .line .circle:nth-child(2) {
    top: 162px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .line .circle:last-child {
    top: 337px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text {
    gap: 41px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info .time {
    min-width: initial;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info .title {
    font-size: 20px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.story .list .text-wrap .text .info ul .item {
    font-size: 14px;
    font-weight: 400;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.differences {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.differences .info {
    width: 335px;
    height: 300px;
    padding: 32px 24px 0 24px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.differences .info .title {
    margin-top: 0;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.case {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.case .info {
    width: 335px;
    height: 279px;
    padding: 32px 24px 48px 24px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.case .info .title {
    margin-top: 4px;
  }
  #uxheatmap-features-detail.container .contents .features .feature .items.case .info .desc {
    margin-top: 0;
  }
}
:lang(ja) {
  font-family: "Pretendard JP Variable", "Pretendard JP", "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
}

body:has(#geo.container) {
  position: relative;
}

#geo.container {
  min-width: 1170px;
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  overflow: hidden;
  margin-top: -1px;
}
#geo.container div {
  box-sizing: border-box;
  letter-spacing: 0;
}
#geo.container #canvas {
  position: absolute;
  top: -50px;
  left: calc(50% - 700px);
  z-index: 99;
}
#geo.container #canvas.scroll {
  z-index: 9;
}
#geo.container .geo-top {
  padding-top: 122px;
  margin: auto;
  max-width: 1170px;
}
#geo.container .geo-top__wrap {
  background-color: #000;
  height: 988px;
  min-height: 980px;
  overflow: hidden;
}
#geo.container .geo-top__wrap .geo-top {
  position: relative;
  z-index: 99;
  left: 0;
  width: 100%;
}
#geo.container .geo-top__wrap .geo-top.scroll {
  z-index: 9;
}
#geo.container .geo-top__header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 14px;
}
#geo.container .geo-top__header .header-caption {
  margin-left: 7px;
  color: #CCC;
  font-size: 16px;
  font-weight: 700;
  line-height: 100%; /* 16px */
}
#geo.container .geo-top__header .header-title {
  color: #FFF;
  font-size: 80px;
  font-weight: 600;
  line-height: 114%; /* 91.2px */
  margin-top: 13px;
}
#geo.container .geo-top__header .header-desc {
  color: #CCC;
  font-size: 26px;
  font-weight: 500;
  line-height: 150%; /* 39px */
}
#geo.container .geo-top__content {
  margin-top: 51px;
}
#geo.container .geo-top__content .contents {
  display: flex;
  align-items: center;
  gap: 50px;
}
#geo.container .geo-top__content .contents .item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  text-align: center;
}
#geo.container .geo-top__content .contents .item .title {
  margin-top: 6px;
  color: #ccc;
  font-size: 16px;
  font-weight: 700;
  line-height: 100%; /* 16px */
}
#geo.container .geo-top__content .contents .item .desc {
  color: #888;
  font-size: 12px;
  font-weight: 400;
  line-height: 100%; /* 12px */
}
#geo.container .geo-top__content .btn-wrap {
  margin-top: 40px;
}
#geo.container .geo-top__content .btn-wrap button {
  display: flex;
  height: 60px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 50px;
  background: #EC0047;
  color: #fff;
  font-size: 19px;
  font-weight: 700;
  line-height: 126.3%; /* 23.997px */
  box-sizing: border-box;
  margin-bottom: 16px;
  transition: all 0.3s ease;
  border: none;
  cursor: pointer;
  padding: 18px 20px;
}
#geo.container .geo-top__content .btn-wrap button:hover {
  filter: brightness(0.84);
}
#geo.container .geo-top__content .btn-wrap .caption {
  margin-left: 26px;
  color: #ccc;
  font-size: 12px;
  font-weight: 400;
  line-height: 100%; /* 12px */
}
#geo.container .geo-top__content .btn-wrap .caption.en {
  margin-left: 20px;
}
#geo.container .diagnosis-modal-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: none;
}
#geo.container .diagnosis-modal-wrapper .contents {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 57px 0 24px 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  border-radius: 14px;
  max-width: 428px;
  max-height: 675px;
  color: #2F2F2F;
  text-align: center;
  overflow: hidden;
}
#geo.container .diagnosis-modal-wrapper .contents .scroll-content {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 0 28px;
  box-sizing: border-box;
}
#geo.container .diagnosis-modal-wrapper .contents .modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
#geo.container .diagnosis-modal-wrapper .contents .title {
  font-size: 20px;
  font-weight: 600;
  line-height: 100%; /* 20px */
}
#geo.container .diagnosis-modal-wrapper .contents .desc {
  font-size: 12px;
  font-weight: 500;
  line-height: 150%; /* 18px */
  margin-bottom: -6px;
}
#geo.container .diagnosis-modal-wrapper .contents .form-container {
  padding: 24px 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: 100%;
}
#geo.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
#geo.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper.email {
  position: relative;
}
#geo.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper label {
  color: #777;
  font-size: 13px;
  font-weight: 600;
  line-height: 100%; /* 13px */
  margin-left: 4px;
}
#geo.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper input {
  box-sizing: border-box;
  width: 100%;
  padding: 9px 9px 9px 12px;
  border-radius: 5px;
  border: 1px solid #BBB;
}
#geo.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper input:focus {
  border: 1px solid #2E9BFF;
  outline: none;
}
#geo.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper input::placeholder {
  color: #BBB;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%; /* 14px */
}
#geo.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper input.error-line {
  border-color: #ec0047;
}
#geo.container .diagnosis-modal-wrapper .contents .form-container .input-wrapper .error {
  display: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #e60724;
  position: absolute;
  top: 110%;
  left: 4px;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper {
  width: 100%;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 5px;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper:first-child {
  margin-bottom: 0;
  padding-bottom: 12px;
  border-bottom: 1px solid #E0E0E0;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper:nth-child(2) {
  padding-top: 12px;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper input[type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-off.svg") no-repeat center/contain;
  cursor: pointer;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper input[type=checkbox]:checked {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-on.svg");
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 400;
  line-height: 120%; /* 15.6px */
  cursor: pointer;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label.all {
  font-weight: 600;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label > .helper-text {
  color: #666;
  font-weight: 400;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label > img {
  cursor: pointer;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion {
  flex-direction: column;
  align-items: flex-start;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header {
  display: flex;
  align-items: center;
  gap: 5px;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header label {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 400;
  line-height: 120%;
  cursor: pointer;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header label > .required {
  color: #ec0047;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header .accordion-toggle {
  cursor: pointer;
  transition: transform 0.2s ease;
  width: 18px;
  height: 18px;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header .accordion-toggle.rotate {
  transform: rotate(180deg);
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-content {
  background: #F4F4F4;
  border-radius: 5px;
  color: #2F2F2F;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%;
  width: 100%;
  box-sizing: border-box;
  text-align: left;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(20px);
  transition: max-height 0.3s ease, opacity 0.3s ease, transform 0.3s ease, padding 0.3s ease, margin 0.3s ease, border 0.3s ease;
  padding: 0 20px;
  margin-top: 0;
  border: 0 solid #D7D7D7;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion.open .accordion-content {
  max-height: 200px;
  overflow-y: auto;
  opacity: 1;
  transform: translateY(0);
  padding: 20px;
  margin-top: 10px;
  border: 1px solid #D7D7D7;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion.open .accordion-content .accordion-close {
  display: block;
  margin: 16px auto 0;
  padding: 8px 24px;
  border: 1px solid #EC0047;
  border-radius: 999px;
  background: transparent;
  color: #EC0047;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion.open .accordion-content .accordion-close:hover {
  background: #EC0047;
  color: #fff;
}
#geo.container .diagnosis-modal-wrapper .contents .privacy .error {
  display: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #e60724;
}
#geo.container .diagnosis-modal-wrapper .contents .modal-footer {
  width: calc(100% + 56px);
  margin-left: -28px;
  margin-right: -28px;
  padding: 12px 28px 0;
  position: relative;
  display: flex;
  justify-content: center;
}
#geo.container .diagnosis-modal-wrapper .contents .modal-footer::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 12px;
  left: 0;
  bottom: 123%;
  z-index: 100;
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.06)));
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.06));
  opacity: 0;
  transition: opacity 0.3s ease;
}
#geo.container .diagnosis-modal-wrapper .contents .modal-footer.has-scroll::before {
  opacity: 1;
}
#geo.container .diagnosis-modal-wrapper .contents .diagnosis-btn {
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 38px;
  min-width: 90px;
  width: max-content;
  padding: 12px 18px;
  border-radius: 999px;
  border: 1px solid #EC0047;
  background: #EC0047;
  color: #fff;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%; /* 14px */
  cursor: pointer;
  transition: all 0.3s ease;
}
#geo.container .diagnosis-modal-wrapper .contents .diagnosis-btn:hover {
  filter: brightness(0.84);
}
#geo.container .diagnosis-modal-wrapper .contents .diagnosis-btn:disabled {
  background-color: #D7D7D7;
  color: #fff;
  border: none;
  filter: none;
  cursor: initial;
}
#geo.container .diagnosis-iframe-wrapper {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 9999;
}
#geo.container .diagnosis-iframe-wrapper .diagnosis-iframe {
  height: 100%;
  width: 100%;
  border: none;
}
#geo.container .geo-contents {
  min-width: 1170px;
  padding-top: 150px;
  margin: 0 auto;
  position: absolute;
  top: 1070px;
  z-index: 99;
  background-color: #fff;
  width: 100%;
}
#geo.container .geo-contents .feature {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 68px;
  margin-bottom: 276px;
}
#geo.container .geo-contents .feature .title-wrapper {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
#geo.container .geo-contents .feature.left {
  text-align: left;
  gap: 24px;
}
#geo.container .geo-contents .feature.shift {
  max-width: 1170px;
  margin: auto auto 276px;
}
#geo.container .geo-contents .feature .caption {
  color: #535E61;
  font-size: 16px;
  font-weight: 700;
  line-height: 160%; /* 25.6px */
}
#geo.container .geo-contents .feature .title {
  color: #212121;
  font-size: 48px;
  font-weight: 600;
  line-height: 120%; /* 57.6px */
}
#geo.container .geo-contents .feature .desc {
  color: #212121;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%; /* 24px */
}
#geo.container .geo-contents .feature .desc .underline {
  position: relative;
}
#geo.container .geo-contents .feature .desc .underline::before {
  position: absolute;
  content: "";
  width: 98px;
  height: 5px;
  background-image: url("https://dream-cdn.beusable.net/home/images/geo/icon-blue-line-2.svg");
  background-repeat: no-repeat;
  bottom: -4px;
}
#geo.container .geo-contents .feature .desc.en .underline::before {
  background-size: 68px 5px;
}
#geo.container .geo-contents .feature .desc.ja .underline::before {
  width: 110px;
  background-size: cover;
}
#geo.container .geo-contents .feature .content {
  display: flex;
  gap: 40px;
}
#geo.container .geo-contents .feature .content .left {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
#geo.container .geo-contents .feature .content .left .desc {
  text-align: left;
  color: #212121;
  font-size: 20px;
  font-weight: 700;
  line-height: 100%; /* 20px */
}
#geo.container .geo-contents .feature .content .left .desc2 {
  color: #212121;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%; /* 24px */
  width: 580px;
}
#geo.container .geo-contents .feature .content .left .items {
  display: flex;
  gap: 20px;
  align-items: center;
}
#geo.container .geo-contents .feature .content .left .items div {
  width: 260px;
  height: 140px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 28px;
  flex-wrap: wrap;
  border-radius: 20px;
  border: 1px solid #212121;
}
#geo.container .geo-contents .feature .content .left .items div .title {
  color: #414A4C;
  font-size: 15px;
  font-weight: 700;
  line-height: 100%; /* 15px */
  margin-bottom: 7px;
}
#geo.container .geo-contents .feature .content .left .items div .sub-title {
  color: #212121;
  font-size: 20px;
  font-weight: 700;
  line-height: 100%; /* 20px */
}
#geo.container .geo-contents .feature .content .left .items div .desc {
  color: #212121;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%; /* 24px */
}
#geo.container .geo-contents .feature .content .left .items div .desc.ja {
  font-size: 14px;
}
#geo.container .geo-contents .feature .content .left .items div.seo {
  position: relative;
  border-color: rgba(33, 33, 33, 0.3);
}
#geo.container .geo-contents .feature .content .left .items div.seo .title {
  opacity: 0.3;
}
#geo.container .geo-contents .feature .content .left .items div.seo .sub-title {
  opacity: 0.3;
}
#geo.container .geo-contents .feature .content .left .items div.seo .desc {
  opacity: 0.3;
}
#geo.container .geo-contents .feature .content .left .items div.seo .blue-line {
  position: absolute;
  width: 138px;
  height: 5px;
  top: 67px;
  left: 21px;
  opacity: 1;
}
#geo.container .geo-contents .feature .content .left .items div.geo {
  border-color: #0074FF;
}
#geo.container .geo-contents .feature .content .left .items div.geo .title {
  color: #0074FF;
}
#geo.container .geo-contents .feature .content .right {
  position: relative;
}
#geo.container .geo-contents .feature .content .right .search-engine-body {
  margin-top: -5px;
  width: 550px;
  height: 376px;
  background-image: url("https://dream-cdn.beusable.net/home/images/geo/icon-search-engine.svg");
  background-repeat: no-repeat;
  margin-bottom: -1px;
  display: flex;
  flex-direction: column;
  gap: 23px;
  position: relative;
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents {
  position: absolute;
  top: 88px;
  left: 30px;
  display: flex;
  flex-direction: column;
  gap: 23px;
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div {
  display: flex;
  align-items: flex-start;
  gap: 25px;
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div .text {
  border-radius: 6px;
  border: 2px solid #1E1E1E;
  background: #F1F1F1;
  padding: 14px 60px 14px 21px;
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div .text > p {
  color: #212121;
  font-size: 15px;
  font-weight: 600;
  line-height: 140%; /* 21px */
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.question .text > p {
  width: 327px;
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.answer .text {
  border: none;
  background: initial;
  padding: 0;
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.citation {
  margin-top: -4px;
  margin-left: 65px;
  border-radius: 6px;
  border: 2px solid #1E1E1E;
  background: #F0E1FB;
  width: 408px;
  height: 70px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 16px;
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.citation > img {
  width: 38px;
  height: 38px;
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.citation .text {
  border: none;
  background: none;
  text-align: left;
  padding: 0;
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.citation .text .title {
  color: #B950CC;
  font-size: 11px;
  font-weight: 700;
  line-height: 100%; /* 11px */
}
#geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.citation .text .desc {
  color: #212121;
  font-size: 14px;
  font-weight: 600;
  line-height: 150%; /* 21px */
}
#geo.container .geo-contents .feature .content .right .search-engine-shadow {
  position: absolute;
  width: 391px;
  height: 20px;
  top: 401px;
  left: 76px;
}
#geo.container .geo-contents .feature .content .right .search-engine-beacle {
  position: absolute;
  width: 200px;
  height: 217px;
  top: 293px;
  right: -44px;
}
#geo.container .geo-contents .feature .core-contents {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 24px;
}
#geo.container .geo-contents .feature .core-contents > div {
  padding: 28px;
  border: 2px solid #212121;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  text-align: left;
  width: 500px;
  height: 392px;
  flex-wrap: wrap;
}
#geo.container .geo-contents .feature .core-contents > div > img {
  display: flex;
  width: 70px;
  height: 70px;
  justify-content: center;
  align-items: center;
}
#geo.container .geo-contents .feature .core-contents > div .text-wrapper {
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
#geo.container .geo-contents .feature .core-contents > div .text-wrapper .title {
  color: #212121;
  font-size: 20px;
  font-weight: 700;
  line-height: 100%; /* 20px */
}
#geo.container .geo-contents .feature .core-contents > div .text-wrapper .desc {
  color: #212121;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%; /* 24px */
  display: inline-block;
  height: 68px;
  text-align: left;
}
#geo.container .geo-contents .feature .core-contents > div .code {
  padding-left: 20px;
  width: 444px;
  height: 109px;
  background-image: url("https://dream-cdn.beusable.net/home/images/geo/icon-core-code-box.svg");
  background-color: #F1F1F1;
  background-repeat: no-repeat;
  white-space: pre-line;
  display: flex;
  align-items: center;
  background-size: cover;
  border-radius: 2px;
}
#geo.container .geo-contents .feature .core-contents > div .code p {
  color: #212121;
  font-size: 15px;
  font-weight: 600;
  line-height: 134%; /* 20.1px */
}
#geo.container .geo-contents .feature .core-contents > div .code p span {
  position: relative;
  top: -20px;
}
#geo.container .geo-contents .feature .core-contents > div.credentials-page {
  border-color: #0074ff;
  background-color: #E7F2FF;
}
#geo.container .geo-contents .feature .core-contents > div.credentials-page .code {
  padding-top: 14px;
  padding-bottom: 15px;
  display: block;
  background-color: #C5DAFF;
  white-space: initial;
  color: #212121;
  font-size: 15px;
  font-weight: 600;
  line-height: 134%; /* 20.1px */
}
#geo.container .geo-contents .feature .challenges-contents {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 30px;
}
#geo.container .geo-contents .feature .challenges-contents .item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 260px;
  height: 300px;
  padding: 41px 0;
}
#geo.container .geo-contents .feature .challenges-contents .item img {
  width: 80px;
  height: 80px;
}
#geo.container .geo-contents .feature .challenges-contents .item .title {
  color: #222;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%; /* 28.8px */
}
#geo.container .geo-contents .feature .challenges-contents .item .desc {
  color: #444;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%; /* 24px */
}
#geo.container .geo-contents .feature .mistakes-contents {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
}
#geo.container .geo-contents .feature .mistakes-contents .item {
  display: flex;
  width: 400px;
  height: 392px;
  padding: 28px;
  flex-wrap: wrap;
  gap: 10px;
  border-radius: 20px;
  border: 2px solid #212121;
  text-align: left;
}
#geo.container .geo-contents .feature .mistakes-contents .item.ja {
  height: 406px;
}
#geo.container .geo-contents .feature .mistakes-contents .item img {
  width: 70px;
  height: 70px;
}
#geo.container .geo-contents .feature .mistakes-contents .item .text-wrapper {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 10px;
}
#geo.container .geo-contents .feature .mistakes-contents .item .text-wrapper .title {
  color: #212121;
  font-size: 20px;
  font-weight: 700;
  line-height: 100%; /* 20px */
}
#geo.container .geo-contents .feature .mistakes-contents .item .text-wrapper .desc {
  color: #212121;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%; /* 24px */
  display: inline-block;
  height: 68px;
  text-align: left;
}
#geo.container .geo-contents .feature .mistakes-contents .item .text-wrapper .desc.ja {
  height: 93px;
}
#geo.container .geo-contents .feature .mistakes-contents .item .code {
  background-image: url("https://dream-cdn.beusable.net/home/images/geo/icon-mistakes-box.svg");
  background-color: #F1F1F1;
  background-repeat: no-repeat;
  padding-left: 24px;
  min-width: 344px;
  height: 109px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 12px;
  border-radius: 3px;
}
#geo.container .geo-contents .feature .mistakes-contents .item .code > span {
  font-size: 15px;
  font-weight: 600;
  line-height: 100%; /* 15px */
}
#geo.container .geo-contents .feature .mistakes-contents .item .code > div {
  color: #444;
  font-size: 14px;
  font-weight: 500;
  line-height: 150%; /* 21px */
}
#geo.container .geo-contents .feature .result-contents {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 24px;
}
#geo.container .geo-contents .feature .result-contents > div {
  padding: 28px;
  border: 2px solid #212121;
  border-radius: 20px;
  display: flex;
  width: 400px;
  height: 392px;
  gap: 20px;
  flex-wrap: wrap;
}
#geo.container .geo-contents .feature .result-contents > div .title-wrapper {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#geo.container .geo-contents .feature .result-contents > div .title-wrapper .image-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}
#geo.container .geo-contents .feature .result-contents > div .title-wrapper .image-wrap img {
  width: 44px;
  height: 44px;
}
#geo.container .geo-contents .feature .result-contents > div .title-wrapper .image-wrap .text {
  text-align: left;
}
#geo.container .geo-contents .feature .result-contents > div .title-wrapper .image-wrap .text .caption {
  color: #212121;
  font-size: 13px;
  font-weight: 600;
  line-height: 100%; /* 13px */
}
#geo.container .geo-contents .feature .result-contents > div .title-wrapper .image-wrap .text .title {
  margin-top: 7px;
  color: #FF4800;
  font-size: 16px;
  font-weight: 700;
  line-height: 100%; /* 16px */
}
#geo.container .geo-contents .feature .result-contents > div .title-wrapper .desc {
  color: #212121;
  font-size: 12px;
  font-weight: 400;
  line-height: 100%; /* 12px */
}
#geo.container .geo-contents .feature .result-contents > div .code {
  min-width: 344px;
  height: 206px;
  background-image: url("https://dream-cdn.beusable.net/home/images/geo/icon-result-code-box.svg");
  background-repeat: no-repeat;
  background-color: #F1F1F1;
  text-align: left;
  padding-left: 20px;
  padding-top: 22px;
  border-radius: 3px;
}
#geo.container .geo-contents .feature .result-contents > div .code > p {
  width: 301px;
  height: 147px;
  color: #444;
  font-size: 14px;
  font-weight: 500;
  line-height: 160%; /* 22.4px */
}
#geo.container .geo-contents .feature .result-contents > div .result {
  margin-left: 10px;
  margin-top: 2px;
  color: #FF4800;
  font-size: 14px;
  font-weight: 700;
  line-height: 100%; /* 14px */
}
#geo.container .geo-contents .feature .result-contents > div.mpti {
  border-color: #0074FF;
  background-color: #E7F2FF;
  position: relative;
}
#geo.container .geo-contents .feature .result-contents > div.mpti .title-wrapper .text .title, #geo.container .geo-contents .feature .result-contents > div.mpti .title-wrapper .text .caption {
  color: #0074FF;
}
#geo.container .geo-contents .feature .result-contents > div.mpti .code {
  background-color: #253149;
  padding-top: 9px;
}
#geo.container .geo-contents .feature .result-contents > div.mpti .code > p {
  color: #00D01F;
  font-size: 13px;
  font-weight: 500;
  line-height: 150%; /* 19.5px */
}
#geo.container .geo-contents .feature .result-contents > div.mpti .result {
  color: #0074ff;
  text-align: left;
}
#geo.container .geo-contents .feature .result-contents > div.mpti .result-beacle {
  position: absolute;
  top: 280px;
  right: -76px;
}
#geo.container .geo-contents .feature .result-contents .versus {
  color: #1E1E1E;
  font-size: 24px;
  font-weight: 700;
  line-height: 100%; /* 24px */
}
#geo.container .geo-contents .feature .benchmark-contents {
  width: 1170px;
  height: 1075px;
  padding: 0 44px;
  border-radius: 20px;
  border: 2px solid #000;
  margin: 0 auto;
  position: relative;
}
#geo.container .geo-contents .feature .benchmark-contents .blue-bg {
  position: absolute;
  left: 244px;
  width: 218px;
  height: 1071px;
  background: rgba(145, 196, 255, 0.3);
}
#geo.container .geo-contents .feature .benchmark-contents .thead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid #000;
  margin-top: 36px;
  padding-bottom: 24px;
}
#geo.container .geo-contents .feature .benchmark-contents .thead .th {
  text-align: left;
  width: 200px;
  color: #212121;
  font-size: 15px;
  font-weight: 500;
  line-height: 150%; /* 22.5px */
}
#geo.container .geo-contents .feature .benchmark-contents .thead .th:first-child {
  padding-left: 10px;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 22px 0;
  border-bottom: 1px solid #CCC;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .th {
  text-align: left;
  padding-left: 10px;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .th p {
  display: flex;
  align-items: center;
  width: 200px;
  height: 74px;
  color: #212121;
  font-size: 15px;
  font-weight: 600;
  line-height: 150%; /* 22.5px */
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .td {
  text-align: left;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .td-1 {
  margin-left: -10px;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .td-4 {
  margin-left: 10px;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .td p {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  width: 200px;
  height: 74px;
  color: #212121;
  font-size: 14px;
  font-weight: 600;
  line-height: 150%; /* 21px */
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .td p .label {
  display: flex;
  padding: 3px 8px;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  background-color: #D4EABD;
  color: #298400;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 150%; /* 18px */
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .td p .label.error {
  background-color: #FFD4D4;
  color: #E60724;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .td p .label.info {
  color: #1760EC;
  background-color: #BADFFF;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items .td p .label.warning {
  color: #F46200;
  background-color: #FFE5CC;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items:first-child {
  padding: 24px 0;
}
#geo.container .geo-contents .feature .benchmark-contents .tbody .items:last-child {
  border-bottom: none;
}
#geo.container .geo-contents .feature .proposition-contents {
  display: flex;
  align-items: center;
  gap: 24px;
  margin: 0 auto;
  position: relative;
}
#geo.container .geo-contents .feature .proposition-contents > .item {
  display: flex;
  gap: 10px;
  width: 400px;
  height: 436px;
  padding: 28px 28px 36px;
  flex-wrap: wrap;
  border-radius: 20px;
  border: 2px solid #212121;
}
#geo.container .geo-contents .feature .proposition-contents > .item .title-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}
#geo.container .geo-contents .feature .proposition-contents > .item .title-wrapper img {
  width: 70px;
  height: 70px;
}
#geo.container .geo-contents .feature .proposition-contents > .item .title-wrapper .text {
  text-align: left;
}
#geo.container .geo-contents .feature .proposition-contents > .item .title-wrapper .text .caption {
  color: #212121;
  font-size: 13px;
  font-weight: 400;
  line-height: 100%; /* 13px */
}
#geo.container .geo-contents .feature .proposition-contents > .item .title-wrapper .text .title {
  margin-top: 8px;
  color: #212121;
  font-size: 20px;
  font-weight: 700;
  line-height: 100%; /* 20px */
}
#geo.container .geo-contents .feature .proposition-contents > .item .code {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .pain {
  background-image: url("https://dream-cdn.beusable.net/home/images/geo/icon-proposition-point-box.svg");
  background-repeat: no-repeat;
  padding: 24px 22px;
  width: 344px;
  height: 143px;
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .pain > p {
  margin-bottom: 16px;
  color: #444;
  font-size: 14px;
  font-weight: 700;
  line-height: 100%; /* 14px */
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .pain > span {
  color: #212121;
  font-size: 14px;
  font-weight: 500;
  line-height: 150%; /* 21px */
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .arrow {
  width: 16px;
  height: 16px;
  margin-top: 6px;
  margin-bottom: 20px;
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .change {
  border-radius: 6px;
  border: 2px solid #1E1E1E;
  background: #DFF1FF;
  padding: 21px 23px 25px 21px;
  width: 344px;
  height: 108px;
  text-align: left;
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .change .title {
  color: #0078DB;
  font-size: 14px;
  font-weight: 700;
  line-height: 100%; /* 14px */
  margin-bottom: 8px;
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .change .desc {
  color: #212121;
  font-size: 13px;
  font-weight: 400;
  line-height: 150%; /* 19.5px */
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .change-2 {
  background: #FFEED9;
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .change-2 .title {
  color: #D27800;
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .change-3 {
  background: #f1f1f1;
}
#geo.container .geo-contents .feature .proposition-contents > .item .code .change-3 .title {
  color: #212121;
}
#geo.container .geo-contents .feature .proposition-contents .proposition-beacle {
  position: absolute;
  top: 363px;
  left: 278px;
}
#geo.container .geo-contents .feature .pricing-contents {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin: 0 auto;
}
#geo.container .geo-contents .feature .pricing-contents > div {
  width: 400px;
  height: 578px;
  padding: 28px 28px 40px 28px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  border-radius: 20px;
  border: 2px solid #7F7F7F;
}
#geo.container .geo-contents .feature .pricing-contents > div img {
  width: 70px;
  height: 70px;
}
#geo.container .geo-contents .feature .pricing-contents > div .title-wrapper {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 10px;
}
#geo.container .geo-contents .feature .pricing-contents > div .title-wrapper .title {
  color: #212121;
  font-size: 20px;
  font-weight: 700;
  line-height: 100%; /* 20px */
  text-align: left;
}
#geo.container .geo-contents .feature .pricing-contents > div .title-wrapper .desc {
  color: #212121;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%; /* 24px */
  text-align: left;
}
#geo.container .geo-contents .feature .pricing-contents > div .price {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px;
  width: 344px;
  height: 78px;
}
#geo.container .geo-contents .feature .pricing-contents > div .price .num {
  color: #212121;
  font-size: 40px;
  font-weight: 700;
  line-height: 100%; /* 40px */
  display: inline-block;
  height: 40px;
}
#geo.container .geo-contents .feature .pricing-contents > div .price .month {
  color: #212121;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%; /* 24px */
  height: 40px;
  display: inline-flex;
  align-items: center;
}
#geo.container .geo-contents .feature .pricing-contents > div .advantage {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 344px;
  height: 164px;
}
#geo.container .geo-contents .feature .pricing-contents > div .advantage .item {
  text-align: left;
  color: #212121;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%; /* 24px */
  display: flex;
  align-items: center;
  gap: 6px;
}
#geo.container .geo-contents .feature .pricing-contents > div .advantage .item img {
  width: 14px;
  height: 14px;
}
#geo.container .geo-contents .feature .pricing-contents > div .btn-wrap {
  margin: 28px auto 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
#geo.container .geo-contents .feature .pricing-contents > div .btn-wrap .btn {
  width: 200px;
  height: 52px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 50px;
  background: #EC0047;
  color: #fff;
  font-size: 19px;
  font-weight: 700;
  line-height: 126.3%; /* 23.997px */
  cursor: pointer;
  transition: all 0.3s ease;
  border: none;
  outline: none;
}
#geo.container .geo-contents .feature .pricing-contents > div .btn-wrap .btn:hover {
  filter: brightness(0.84);
}
#geo.container .geo-contents .feature .pricing-contents > div.pro {
  border: 3px solid #EC0047;
  position: relative;
}
#geo.container .geo-contents .feature .pricing-contents > div.pro .recommended {
  position: absolute;
  top: 0;
  right: 0;
  width: 90px;
  height: 90px;
}
#geo.container .geo-contents .feature .pricing-contents > div.pro .price-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  min-height: 78px;
  margin-bottom: 30px;
  padding: 10px;
}
#geo.container .geo-contents .feature .pricing-contents > div.pro .price-wrap .price {
  padding: 0;
  height: 40px;
}
#geo.container .geo-contents .feature .pricing-contents > div.pro .price-wrap .tip {
  color: #000;
  font-size: 13px;
  font-weight: 400;
  line-height: 100%; /* 13px */
}
#geo.container .geo-contents .feature .pricing-contents > div.pro .advantage .item {
  font-weight: 600;
}
#geo.container .geo-contents .feature.price {
  margin-bottom: 296px;
}
#geo.container .geo-contents .feature.result {
  margin-bottom: 388px;
}
#geo.container .geo-contents .feature.solution {
  width: 100%;
  background-image: url("https://dream-cdn.beusable.net/home/images/geo/geo-background-2.png"), radial-gradient(57.84% 57.84% at 50.03% 42.16%, #212654 0%, #000 100%);
  background-repeat: no-repeat, no-repeat;
  background-size: 100% auto, 100% 100%;
  background-position: center, center;
  margin-bottom: 180px;
}
#geo.container .geo-contents .feature.solution .title-wrapper {
  margin-top: 120px;
}
#geo.container .geo-contents .feature.solution .title-wrapper .caption {
  color: #AAA;
}
#geo.container .geo-contents .feature.solution .title-wrapper .title {
  color: #FFF;
}
#geo.container .geo-contents .feature.solution .title-wrapper .desc {
  color: #E0E0E0;
}
#geo.container .geo-contents .feature.solution .solution-contents img {
  width: 1053px;
  margin: 0 auto;
}
#geo.container .geo-contents .feature.solution .technology .title-wrapper {
  margin-top: 132px;
}
#geo.container .geo-contents .feature.solution .technology .technology-contents {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-top: 79px;
}
#geo.container .geo-contents .feature.solution .technology .technology-contents .item {
  width: 400px;
  height: 392px;
  border-radius: 20px;
  border: 2px solid #333753;
  background: #1A1E37;
  padding: 28px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}
#geo.container .geo-contents .feature.solution .technology .technology-contents .item .caption {
  font-size: 13px;
  font-weight: 600;
  line-height: 100%; /* 13px */
}
#geo.container .geo-contents .feature.solution .technology .technology-contents .item .title {
  color: #FFF;
  font-size: 16px;
  font-weight: 700;
  line-height: 100%; /* 16px */
  margin-bottom: 5px;
}
#geo.container .geo-contents .feature.solution .technology .technology-contents .item .desc {
  color: #A0A0A0;
  font-size: 12px;
  font-weight: 400;
  line-height: 100%; /* 12px */
}
#geo.container .geo-contents .feature.solution .technology .technology-contents .item > img {
  margin: 11px auto 18px auto;
}
#geo.container .geo-contents .feature.solution .technology .technology-contents .item .text {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#geo.container .geo-contents .feature.solution .technology .technology-contents .item .text span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #D7D7D7;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%; /* 14px */
}
#geo.container .geo-contents .feature.solution .technology .technology-contents .item .text span img {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
#geo.container .geo-contents .feature.solution .technology .tip {
  margin-top: 80px;
  margin-bottom: 160px;
  color: #AAA;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%;
}
#geo.container .geo-contents .footer {
  width: 100%;
  height: 600px;
  background: #DCEFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 157px;
}
#geo.container .geo-contents .footer .text-wrapper {
  width: fit-content;
  margin-left: 55px;
}
#geo.container .geo-contents .footer .text-wrapper .caption {
  color: #212121;
  font-size: 30px;
  font-weight: 600;
  line-height: 100%; /* 30px */
}
#geo.container .geo-contents .footer .text-wrapper .title {
  margin-top: 16px;
  margin-bottom: 20px;
  color: #212121;
  font-size: 48px;
  font-weight: 600;
  line-height: 120%; /* 57.6px */
  width: fit-content;
}
#geo.container .geo-contents .footer .text-wrapper .desc {
  display: inline-block;
  width: 528px;
  color: #212121;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%; /* 24px */
}
#geo.container .geo-contents .footer .text-wrapper .label-wrap {
  margin-top: 28px;
  display: flex;
  align-items: center;
  gap: 8px;
}
#geo.container .geo-contents .footer .text-wrapper .label-wrap span {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 4px;
  background: #2E9BFF;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 150%; /* 18px */
}
#geo.container .geo-contents .footer .chart {
  width: 539px;
  height: 312px;
  margin-top: 40px;
}
#geo.container .inquire-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9999;
  display: none;
}
#geo.container .inquire-wrapper .inquire {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 40px 30px 24px 30px;
  background-color: #fff;
  width: 530px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  border-radius: 14px;
}
#geo.container .inquire-wrapper .inquire .title {
  margin-bottom: 12px;
  color: #2F2F2F;
  font-size: 20px;
  font-weight: 600;
  line-height: 100%; /* 20px */
}
#geo.container .inquire-wrapper .inquire .content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 319px;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div label {
  color: #777;
  font-size: 13px;
  font-weight: 600;
  line-height: 100%; /* 13px */
  padding-left: 4px;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div input, #geo.container .inquire-wrapper .inquire .content-wrapper > div textarea {
  border-radius: 5px;
  border: 1px solid #BBB;
  padding: 9px 9px 9px 12px;
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div input::placeholder, #geo.container .inquire-wrapper .inquire .content-wrapper > div textarea::placeholder {
  color: #BBB;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%; /* 14px */
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div input:focus, #geo.container .inquire-wrapper .inquire .content-wrapper > div textarea:focus {
  border: 1px solid #2E9BFF;
  outline: none;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div input.error-line {
  border-color: #ec0047;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div textarea {
  height: 147px;
  resize: none;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div .error {
  display: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #e60724;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div.email-wrapper {
  position: relative;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div.email-wrapper .error {
  position: absolute;
  top: 110%;
  left: 4px;
}
#geo.container .inquire-wrapper .inquire .content-wrapper > div.plan-wrapper > p {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 400;
  line-height: 120%; /* 15.6px */
  margin-top: 16px;
}
#geo.container .inquire-wrapper .inquire .privacy {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#geo.container .inquire-wrapper .inquire .privacy .checkbox-wrapper {
  display: flex;
  align-items: center;
  gap: 5px;
}
#geo.container .inquire-wrapper .inquire .privacy .checkbox-wrapper input[type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-off.svg") no-repeat center/contain;
  cursor: pointer;
}
#geo.container .inquire-wrapper .inquire .privacy .checkbox-wrapper input[type=checkbox]:checked {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-on.svg");
}
#geo.container .inquire-wrapper .inquire .privacy .checkbox-wrapper > label {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 400;
  line-height: 120%;
}
#geo.container .inquire-wrapper .inquire .privacy .error {
  display: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #e60724;
}
#geo.container .inquire-wrapper .inquire .btn-wrap {
  display: flex;
  align-items: center;
  gap: 5px;
}
#geo.container .inquire-wrapper .inquire .btn-wrap > button {
  display: flex;
  height: 38px;
  min-width: 90px;
  padding: 0 18px;
  justify-content: center;
  align-items: center;
  border-radius: 999px;
  border: 1px solid #BBB;
  color: #444;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%; /* 14px */
  cursor: pointer;
  transition: all 0.3s;
  background: #fff;
}
#geo.container .inquire-wrapper .inquire .btn-wrap > button:hover {
  background: #f0f0f0;
}
#geo.container .inquire-wrapper .inquire .btn-wrap > button.submit {
  color: #EC0047;
  border-color: #EC0047;
  transition: all 0.3s;
}
#geo.container .inquire-wrapper .inquire .btn-wrap > button.submit:hover {
  background: #EC0047;
  color: #fff;
}
#geo.container .inquire-wrapper .inquire .btn-wrap > button.submit:disabled {
  border: 1px solid #FFAEBD;
  color: #FFAEBD;
  background: rgba(255, 255, 255, 0.32);
  cursor: initial;
}
#geo.container .inquire-wrapper .inquire-success-wrapper {
  display: none;
}
#geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success {
  display: flex;
  width: 428px;
  height: 315px;
  padding: 48px 48px 25px 48px;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  border-radius: 14px;
  background: #FFF;
  /* Shadow/Shadow_popup_mdx2 */
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.16);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success .close-btn {
  position: absolute;
  top: 14px;
  right: 14px;
  cursor: pointer;
  width: 16px;
  height: 16px;
}
#geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success .title {
  color: #2F2F2F;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  line-height: 120%; /* 24px */
}
#geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success .desc {
  color: #2F2F2F;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
  text-align: center;
}
#geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success .btn {
  margin-top: 30px;
  height: 38px;
  min-width: 90px;
  padding: 0 18px;
  border-radius: 999px;
  border: 1px solid #BBB;
  background-color: #fff;
  cursor: pointer;
  transition: all 0.3s;
}
#geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success .btn:hover {
  filter: brightness(0.9);
}

@media all and (max-width: 768px) {
  #geo.container {
    min-width: 375px;
  }
  #geo.container #canvas {
    display: none;
    left: 0;
  }
  #geo.container .geo-top {
    padding: 32px 20px 0px 20px;
    margin-left: 0;
    height: 100%;
  }
  #geo.container .geo-top__wrap {
    min-height: 684px;
    max-height: 684px;
    height: 684px;
    background-image: url("https://dream-cdn.beusable.net/home/images/geo/geo-bg-mo.png");
    background-repeat: no-repeat;
    background-size: 1198px auto;
    background-position: 74% 16%;
  }
  #geo.container .geo-top__wrap .geo-top {
    z-index: 1;
  }
  #geo.container .geo-top__wrap .geo-top.scroll {
    z-index: 1;
  }
  #geo.container .geo-top__header {
    gap: 28px;
  }
  #geo.container .geo-top__header .header-caption {
    color: #BBB;
    font-size: 15px;
    font-weight: 600;
  }
  #geo.container .geo-top__header .header-title {
    margin-top: 0;
    font-size: 36px;
    line-height: 120%; /* 43.2px */
  }
  #geo.container .geo-top__header .header-desc {
    color: #BBB;
    font-size: 15px;
    font-weight: 600;
  }
  #geo.container .geo-top__content {
    margin-top: 26px;
  }
  #geo.container .geo-top__content .contents {
    gap: 16px;
  }
  #geo.container .geo-top__content .contents .item > img {
    width: 60px;
    height: 60px;
  }
  #geo.container .geo-top__content .contents .item .title {
    font-size: 14px;
    font-weight: 600;
  }
  #geo.container .geo-top__content .contents .item .desc {
    font-size: 12px;
    line-height: 120%; /* 14.4px */
  }
  #geo.container .geo-top__content .btn-wrap {
    margin-top: 22px;
  }
  #geo.container .geo-top__content .btn-wrap .go-geo {
    padding: 12px 12px 12px 16px;
    gap: 6px;
    width: 250px;
    height: 44px;
    font-size: 16px;
    font-weight: 600;
    line-height: 100%; /* 16px */
  }
  #geo.container .geo-top__content .btn-wrap .go-geo > img {
    width: 13px;
    height: 10px;
  }
  #geo.container .geo-top__content .btn-wrap .go-geo.en, #geo.container .geo-top__content .btn-wrap .go-geo.ja {
    width: 280px;
  }
  #geo.container .geo-top__content .btn-wrap .caption {
    margin-left: 2px;
  }
  #geo.container .geo-top__content .btn-wrap .caption.en {
    margin-left: 2px;
  }
  #geo.container .geo-top__content .btn-wrap .caption.ja {
    margin-left: 10px;
  }
  #geo.container .diagnosis-modal-wrapper .contents {
    max-height: 100%;
    height: 100%;
    border-radius: 0;
    width: 100%;
    max-width: 100%;
  }
  #geo.container .diagnosis-modal-wrapper .contents .scroll-content {
    padding-right: 28px;
  }
  #geo.container .geo-contents {
    min-width: 375px;
    position: initial;
    top: 698px;
    padding-top: 48px;
  }
  #geo.container .geo-contents .feature {
    gap: 32px;
    margin-bottom: 80px;
    padding: 0 20px;
  }
  #geo.container .geo-contents .feature.left {
    gap: 16px;
  }
  #geo.container .geo-contents .feature.shift {
    text-align: center;
    margin-bottom: 151px;
  }
  #geo.container .geo-contents .feature .title-wrapper {
    gap: 4px;
    word-break: break-all;
  }
  #geo.container .geo-contents .feature .title-wrapper .caption {
    color: #444;
    font-size: 12px;
    font-weight: 400;
    line-height: 150%; /* 18px */
  }
  #geo.container .geo-contents .feature .title-wrapper .title {
    color: #222;
    font-size: 30px;
  }
  #geo.container .geo-contents .feature .title-wrapper .desc {
    color: #444;
    text-align: center;
    font-size: 12px;
    margin-top: 8px;
  }
  #geo.container .geo-contents .feature .title-wrapper .desc .underline::before {
    width: 74px;
    height: 4px;
    background-size: cover;
  }
  #geo.container .geo-contents .feature .title-wrapper .desc.en .underline::before {
    width: 51px;
    background-size: 51px 4px;
  }
  #geo.container .geo-contents .feature .content {
    flex-direction: column;
    align-items: center;
  }
  #geo.container .geo-contents .feature .content .left {
    gap: 16px;
  }
  #geo.container .geo-contents .feature .content .left .desc {
    color: #444;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    line-height: 150%; /* 27px */
  }
  #geo.container .geo-contents .feature .content .left .desc2 {
    color: #444;
    font-size: 12px;
    width: 335px;
    margin-bottom: 16px;
  }
  #geo.container .geo-contents .feature .content .left .items {
    justify-content: center;
  }
  #geo.container .geo-contents .feature .content .left .items > div {
    width: 161px;
    height: 87px;
    padding: 17px;
    border-radius: 12px;
    align-items: flex-start;
    gap: 5px;
  }
  #geo.container .geo-contents .feature .content .left .items > div .title {
    font-size: 10px;
    margin-bottom: 0;
  }
  #geo.container .geo-contents .feature .content .left .items > div .sub-title {
    font-size: 13px;
  }
  #geo.container .geo-contents .feature .content .left .items > div .desc {
    font-size: 10px;
  }
  #geo.container .geo-contents .feature .content .left .items > div .desc.ja {
    font-size: 9px;
  }
  #geo.container .geo-contents .feature .content .left .items > div.seo .blue-line {
    width: 100px;
    height: 4px;
    top: 37px;
    left: 13px;
  }
  #geo.container .geo-contents .feature .content .right {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #geo.container .geo-contents .feature .content .right > img {
    width: 255px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body {
    width: 255px;
    height: 173px;
    background-size: cover;
    background-position: center;
    gap: 11px;
    padding: 11px 0 0 14px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents {
    top: 41px;
    left: 13px;
    gap: 11px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div {
    gap: 12px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div .text {
    width: fit-content;
    padding: 6.5px 27px 6px 10px;
    text-align: left;
    border-radius: 2.778px;
    border: 0.926px solid #1E1E1E;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div .text > p {
    font-size: 6.944px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.question > img {
    width: 19px;
    height: 19px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.question .text > p {
    width: 152px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.answer > img {
    width: 21px;
    height: 21px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.citation {
    width: 189px;
    height: 32.407px;
    border-radius: 2.778px;
    border: 0.926px solid #1E1E1E;
    padding: 7px;
    gap: 5px;
    margin-left: 30px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.citation > img {
    width: 18px;
    height: 18px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.citation .text .title {
    font-size: 5px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-body > .contents > div.citation .text .desc {
    font-size: 6.5px;
    font-weight: 600;
    line-height: 150%; /* 9.722px */
  }
  #geo.container .geo-contents .feature .content .right .search-engine-shadow {
    width: 181px;
    height: 9.3px;
    top: 185px;
  }
  #geo.container .geo-contents .feature .content .right .search-engine-beacle {
    width: 93px;
    height: 100.5px;
    top: 136px;
    right: -19px;
  }
  #geo.container .geo-contents .feature .core-contents > div {
    width: 320px;
    height: 250px;
    padding: 18px 16px;
    gap: 13px;
  }
  #geo.container .geo-contents .feature .core-contents > div > img {
    width: 44px;
    height: 44px;
  }
  #geo.container .geo-contents .feature .core-contents > div .text-wrapper {
    gap: 9px;
    padding: 6px;
  }
  #geo.container .geo-contents .feature .core-contents > div .text-wrapper .title {
    font-size: 12.8px;
  }
  #geo.container .geo-contents .feature .core-contents > div .text-wrapper .desc {
    font-size: 11px;
    height: 34px;
  }
  #geo.container .geo-contents .feature .core-contents > div .code {
    width: 284px;
    height: 69px;
    background-size: 284px 69px;
    padding-left: 14px;
  }
  #geo.container .geo-contents .feature .core-contents > div .code > p {
    font-size: 10px;
  }
  #geo.container .geo-contents .feature .core-contents > div .code > p > span {
    top: -12px;
  }
  #geo.container .geo-contents .feature .core-contents > div.credentials-page .code {
    padding: 8px 0 8px 12px;
    font-size: 10px;
  }
  #geo.container .geo-contents .feature .challenges-contents {
    gap: 25px;
  }
  #geo.container .geo-contents .feature .challenges-contents .item {
    padding: 20px 34px;
    gap: 16px;
    height: 260px;
  }
  #geo.container .geo-contents .feature .challenges-contents .item .title {
    width: 220px;
    font-size: 22px;
  }
  #geo.container .geo-contents .feature .challenges-contents .item .desc {
    width: 220px;
  }
  #geo.container .geo-contents .feature .mistakes-contents {
    gap: 20px;
    flex-direction: column;
  }
  #geo.container .geo-contents .feature .mistakes-contents .item {
    width: 320px;
    height: 313px;
    padding: 22px;
    gap: 8px;
  }
  #geo.container .geo-contents .feature .mistakes-contents .item.ja {
    height: 313px;
  }
  #geo.container .geo-contents .feature .mistakes-contents .item > img {
    width: 56px;
    height: 56px;
  }
  #geo.container .geo-contents .feature .mistakes-contents .item .text-wrapper {
    gap: 12px;
    padding: 8px;
    margin-bottom: 8px;
  }
  #geo.container .geo-contents .feature .mistakes-contents .item .text-wrapper .title {
    font-size: 16px;
  }
  #geo.container .geo-contents .feature .mistakes-contents .item .text-wrapper .desc {
    font-size: 12px;
    height: 54px;
  }
  #geo.container .geo-contents .feature .mistakes-contents .item .text-wrapper .desc.ja {
    height: 54px;
  }
  #geo.container .geo-contents .feature .mistakes-contents .item .code {
    min-width: 274px;
    height: 87px;
    background-size: cover;
    padding: 15px 0 16px 19px;
    gap: 10px;
  }
  #geo.container .geo-contents .feature .mistakes-contents .item .code > span {
    font-size: 12px;
    font-weight: 600;
    line-height: 100%; /* 12px */
  }
  #geo.container .geo-contents .feature .mistakes-contents .item .code > div {
    font-size: 11px;
  }
  #geo.container .geo-contents .feature .result-contents {
    gap: 19px;
    flex-direction: column;
  }
  #geo.container .geo-contents .feature .result-contents > div {
    width: 320px;
    height: 313px;
    padding: 22px;
    gap: 16px;
  }
  #geo.container .geo-contents .feature .result-contents > div .title-wrapper {
    gap: 8px;
  }
  #geo.container .geo-contents .feature .result-contents > div .title-wrapper .image-wrap {
    gap: 8px;
  }
  #geo.container .geo-contents .feature .result-contents > div .title-wrapper .image-wrap > img {
    width: 35px;
    height: 35px;
  }
  #geo.container .geo-contents .feature .result-contents > div .title-wrapper .image-wrap .text .caption {
    font-size: 10px;
  }
  #geo.container .geo-contents .feature .result-contents > div .title-wrapper .image-wrap .text .title {
    margin-top: 6px;
    font-size: 12px;
  }
  #geo.container .geo-contents .feature .result-contents > div .title-wrapper .desc {
    font-size: 10px;
    margin-top: 0;
  }
  #geo.container .geo-contents .feature .result-contents > div .code {
    min-width: 275px;
    height: 165px;
    padding-top: 20px;
    padding-left: 16px;
    background-size: cover;
  }
  #geo.container .geo-contents .feature .result-contents > div .code > p {
    font-size: 11px;
    width: 240px;
    height: 117px;
    overflow: hidden;
  }
  #geo.container .geo-contents .feature .result-contents > div .result {
    font-size: 11px;
    margin-left: 8.5px;
  }
  #geo.container .geo-contents .feature .result-contents > div.mpti.en {
    height: 325px;
  }
  #geo.container .geo-contents .feature .result-contents > div.mpti .code > p {
    width: 240px;
    height: 147px;
    font-size: 11px;
  }
  #geo.container .geo-contents .feature .result-contents > div.mpti.ja .result {
    font-size: 10px;
  }
  #geo.container .geo-contents .feature .result-contents > div.mpti .result-beacle {
    width: 130px;
    height: 127px;
    top: 296px;
    right: 5px;
  }
  #geo.container .geo-contents .feature .result-contents > div.mpti .result-beacle.en {
    top: 306px;
  }
  #geo.container .geo-contents .feature .result-contents .versus {
    font-size: 19.2px;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo {
    display: flex;
    flex-direction: column;
    gap: 32px;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div {
    border-radius: 12px;
    background: #FFF;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 8px 14px -4px rgba(0, 0, 0, 0.16);
    text-align: left;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .th {
    color: #212121;
    font-size: 18px;
    font-weight: 700;
    line-height: 150%; /* 27px */
    padding: 25px 0 22px 20px;
    border-bottom: 1px solid #aaa;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .th-1 {
    color: #0074ff;
    opacity: 0.7;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .td {
    padding: 20px;
    border-bottom: 1px dashed #aaa;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .td:last-child {
    border-bottom: none;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .td > p:first-child {
    color: #444;
    font-size: 14px;
    font-weight: 600;
    line-height: 120%; /* 16.8px */
    margin-bottom: 8px;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .td > p:last-child {
    display: flex;
    flex-direction: column-reverse;
    gap: 8px;
    color: #444;
    font-size: 14px;
    font-weight: 400;
    line-height: 120%; /* 16.8px */
    word-break: break-all;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .td > p:last-child .label {
    color: #298400;
    font-size: 12px;
    font-weight: 600;
    line-height: 150%; /* 18px */
    display: inline-flex;
    padding: 3px 8px;
    justify-content: center;
    align-items: center;
    background-color: #D4EABD;
    border-radius: 4px;
    width: fit-content;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .td > p:last-child .label.error {
    background-color: #FFD4D4;
    color: #E60724;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .td > p:last-child .label.info {
    color: #1760EC;
    background-color: #BADFFF;
  }
  #geo.container .geo-contents .feature .benchmark-contents-mo > div .td > p:last-child .label.warning {
    color: #F46200;
    background-color: #FFE5CC;
  }
  #geo.container .geo-contents .feature .proposition-contents {
    gap: 20px;
    justify-content: center;
    flex-direction: column;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item {
    width: 320px;
    height: 348px;
    padding: 20px;
    border-radius: 16px;
    border: 1.6px solid #212121;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .title-wrapper {
    gap: 8px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .title-wrapper img {
    width: 56px;
    height: 56px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .title-wrapper .text .caption {
    font-size: 10px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .title-wrapper .text .title {
    font-size: 16px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .code {
    width: 275px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .code .pain {
    width: 100%;
    height: 114px;
    background-size: 275px 114px;
    text-align: left;
    padding: 19px 16px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .code .pain > p {
    font-size: 12px;
    font-weight: 700;
    line-height: 100%; /* 12px */
    margin-bottom: 8px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .code .pain > span {
    font-size: 12px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .code .arrow {
    width: 14px;
    height: 14px;
    margin-top: 5px;
    margin-bottom: 16px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .code .change {
    width: 100%;
    height: 86px;
    padding: 16px 18px 21px 17px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .code .change .title {
    font-size: 12px;
    margin-bottom: 6px;
  }
  #geo.container .geo-contents .feature .proposition-contents > .item .code .change .desc {
    font-size: 11px;
  }
  #geo.container .geo-contents .feature .pricing-contents {
    gap: 28px;
    flex-direction: column;
  }
  #geo.container .geo-contents .feature .pricing-contents > div {
    width: 320px;
    height: 476px;
    padding: 22px 20px 30px 20px;
    gap: 8px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div img {
    width: 56px;
    height: 56px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .title-wrapper {
    gap: 12px;
    padding: 8px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .title-wrapper .title {
    font-size: 18px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .title-wrapper .desc {
    margin-top: 0;
    font-size: 14px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .price {
    gap: 6px;
    width: 100%;
    height: 63px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .price .num {
    font-size: 32px;
    height: 32px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .price .month {
    font-size: 13px;
    font-weight: 400;
    line-height: 150%; /* 19.5px */
    height: 32px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .advantage {
    width: 275px;
    height: 131px;
    padding: 8px;
    gap: 12px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .advantage .item {
    font-size: 13px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .advantage .item img {
    width: 12px;
    height: 12px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .btn-wrap {
    margin-top: 35px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div .btn-wrap .btn {
    width: 280px;
    height: 44px;
    padding: 13px 56px;
    font-size: 15px;
    font-weight: 800;
  }
  #geo.container .geo-contents .feature .pricing-contents > div.pro .price-wrap {
    gap: 12px;
    margin-bottom: 16px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div.pro .price-wrap .tip {
    font-size: 11px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div.pro .advantage {
    display: block;
    height: initial;
  }
  #geo.container .geo-contents .feature .pricing-contents > div.pro .advantage .item {
    margin-bottom: 12px;
  }
  #geo.container .geo-contents .feature .pricing-contents > div.pro .advantage .item:last-child {
    margin-bottom: 0;
  }
  #geo.container .geo-contents .feature.result {
    margin-bottom: 190px;
  }
  #geo.container .geo-contents .feature.price {
    margin-bottom: 80px;
  }
  #geo.container .geo-contents .feature.solution {
    background-image: url("https://dream-cdn.beusable.net/home/images/geo/geo-background-2-mo.png"), radial-gradient(74.92% 74.92% at 50% 25.08%, #212654 0%, #000 100%);
    background-repeat: no-repeat, no-repeat;
    background-size: 100% auto, 100% 100%;
    background-position: 50% 11%, center;
    margin-bottom: 80px;
  }
  #geo.container .geo-contents .feature.solution .title-wrapper {
    margin-top: 60px;
  }
  #geo.container .geo-contents .feature.solution .solution-contents > img {
    width: 335px;
  }
  #geo.container .geo-contents .feature.solution .technology .title-wrapper {
    margin-top: 48px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents {
    flex-direction: column;
    margin-top: 32px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item {
    width: 320px;
    height: 314px;
    padding: 22px;
    gap: 8px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item > video {
    width: 100%;
    margin: 16px auto 14px auto;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item .caption {
    font-size: 12px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item .title {
    font-size: 14px;
    margin-bottom: 2px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item .desc {
    font-size: 10px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item .text {
    gap: 8px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item .text > span {
    font-size: 11.2px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item .text > span > img {
    width: 12px;
    height: 12px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item:nth-child(2) > img {
    margin-bottom: 9px;
  }
  #geo.container .geo-contents .feature.solution .technology .technology-contents .item:last-child > img {
    width: 178px;
    height: 140px;
    margin-bottom: 11px;
  }
  #geo.container .geo-contents .feature.solution .technology .tip {
    font-size: 12px;
    margin-top: 32px;
    margin-bottom: 61px;
  }
  #geo.container .geo-contents .footer {
    height: 625px;
    padding: 60px 20px 33px 20px;
    gap: 32px;
    flex-direction: column;
  }
  #geo.container .geo-contents .footer .text-wrapper {
    width: 335px;
    text-align: center;
    margin-left: 0;
  }
  #geo.container .geo-contents .footer .text-wrapper .caption {
    color: #444;
    text-align: center;
    font-size: 18px;
    line-height: 150%; /* 27px */
  }
  #geo.container .geo-contents .footer .text-wrapper .title {
    width: 100%;
    color: #222;
    font-size: 30px;
    margin-bottom: 12px;
  }
  #geo.container .geo-contents .footer .text-wrapper .desc {
    width: 100%;
    color: #444;
    font-size: 12px;
  }
  #geo.container .geo-contents .footer .chart {
    margin-top: 0;
    width: 323px;
    height: 277px;
  }
  #geo.container .geo-contents .footer .label-wrap {
    justify-content: center;
    margin-top: 18px;
  }
  #geo.container .inquire-wrapper .inquire {
    box-sizing: border-box;
    min-width: 375px;
    width: 100%;
    height: 100%;
    padding: 87px 16px 40px 16px;
    gap: 10px;
    border-radius: 0;
    overflow-y: auto;
    position: relative;
    justify-content: initial;
  }
  #geo.container .inquire-wrapper .inquire .header .header-title {
    position: absolute;
    top: 19px;
    left: 16px;
    color: #EC0047;
    font-family: NewRubrik;
    font-size: 18px;
    font-weight: 700;
    line-height: 18px; /* 100% */
    letter-spacing: -0.3px;
  }
  #geo.container .inquire-wrapper .inquire .header .close-btn {
    position: absolute;
    top: 13px;
    right: 13px;
    width: 30px;
    height: 30px;
    cursor: pointer;
  }
  #geo.container .inquire-wrapper .inquire .content-wrapper {
    min-width: 343px;
  }
  #geo.container .inquire-wrapper .inquire .content-wrapper div {
    width: 100%;
  }
  #geo.container .inquire-wrapper .inquire .privacy {
    width: 100%;
    justify-content: flex-start;
    margin-bottom: 36px;
  }
  #geo.container .inquire-wrapper .inquire .btn-wrap {
    width: 100%;
  }
  #geo.container .inquire-wrapper .inquire .btn-wrap button.submit {
    width: 100%;
    background-color: #ec0047;
    color: #fff;
  }
  #geo.container .inquire-wrapper .inquire .btn-wrap button.submit:disabled {
    background-color: #D7D7D7;
    border: none;
    color: #fff;
  }
  #geo.container .inquire-wrapper .inquire-success-wrapper {
    display: none;
    background-color: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
  }
  #geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success {
    width: 319px;
    height: 283px;
    padding: 30px 15px 20px 15px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.16), 0 8px 15px 0 rgba(0, 0, 0, 0.16);
  }
  #geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success > img {
    width: 50px;
    height: 50px;
  }
  #geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success .title {
    color: #444;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    line-height: 20px; /* 100% */
  }
  #geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success .desc {
    color: #2F2F2F;
    font-size: 14px;
    line-height: 20px; /* 142.857% */
  }
  #geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success .btn {
    margin-top: 18px;
    height: 44px;
    min-width: 90px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid #BBB;
    background-color: #fff;
    cursor: pointer;
    transition: all 0.3s;
    color: #444;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    line-height: 14px; /* 100% */
  }
  #geo.container .inquire-wrapper .inquire-success-wrapper .inquire-success .btn:hover {
    filter: brightness(0.9);
  }
}
#scroll.container {
  display: flex;
  justify-content: center;
  min-width: 1280px;
  flex-direction: column;
}
#scroll.container .contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-bottom: 60px;
  color: #222;
  letter-spacing: normal;
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  word-break: break-word;
}
#scroll.container .contents div {
  box-sizing: border-box;
}
#scroll.container .contents .report-button {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  border-radius: 50px;
  background-color: #EC0047;
  border: none;
  cursor: pointer;
}
#scroll.container .contents .report-button span {
  color: #FFF;
  font-size: 18px;
  line-height: 1;
  font-weight: 600;
}
#scroll.container .contents .report-button img {
  width: 16px;
  height: 16px;
}
#scroll.container .contents .summary {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 1280px;
  text-align: center;
  padding-top: 110px;
  padding-bottom: 397px;
}
#scroll.container .contents .summary .back-button {
  display: flex;
  align-items: center;
  column-gap: 10px;
  position: absolute;
  top: 30px;
  left: 55px;
  padding: 9px 15px 9px 9px;
  border-radius: 20px;
  box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  text-decoration: none;
}
#scroll.container .contents .summary .back-button img {
  height: 16px;
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
#scroll.container .contents .summary .back-button span {
  font-size: 13px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-align: right;
  color: #444;
}
#scroll.container .contents .summary h1 {
  font-size: 65px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -1.5px;
  margin-bottom: 52px;
  color: #2f2f2f;
  font-family: NewRubrik;
}
#scroll.container .contents .summary h2 {
  font-size: 55px;
  font-weight: 600;
  line-height: 72px;
  letter-spacing: -1px;
  margin-bottom: 24px;
}
#scroll.container .contents .summary h2 .highlight {
  color: #EC0047;
}
#scroll.container .contents .summary .desc {
  font-size: 26px;
  font-weight: 500;
  line-height: 42px;
  max-width: 1100px;
  margin-bottom: 26px;
}
#scroll.container .contents .summary .desc-sub {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 39px;
}
#scroll.container .contents .summary .report-graphic {
  margin-top: 51px;
  margin-bottom: 138px;
}
#scroll.container .contents .summary .effect-title {
  font-size: 55px;
  font-weight: 600;
  line-height: 72px;
  margin-bottom: 78px;
}
#scroll.container .contents .summary .effect {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 108px;
}
#scroll.container .contents .summary .effect .info {
  position: relative;
  width: 300px;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 26px;
}
#scroll.container .contents .summary .effect .info .info-top {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
}
#scroll.container .contents .summary .effect .info .info-top .label {
  color: #444;
  font-size: 22px;
  font-weight: 500;
  line-height: 150%;
}
#scroll.container .contents .summary .effect .info:nth-child(1)::before, #scroll.container .contents .summary .effect .info:nth-child(2)::before {
  content: "";
  position: absolute;
  top: 0;
  right: -54px;
  width: 1px;
  height: 100%;
  background-color: #CCC;
}
#scroll.container .contents .summary .effect .info .value {
  color: #2F2F2F;
  font-size: 60px;
  font-weight: 700;
  line-height: 1;
}
#scroll.container .contents .summary .effect .bread-img {
  position: absolute;
  bottom: 52px;
  left: 185px;
  transform: translateY(100%);
}
#scroll.container .contents .section {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
#scroll.container .contents .section-title {
  font-size: 55px;
  font-weight: 600;
  line-height: 72px;
  margin-bottom: 18px;
}
#scroll.container .contents .section-description {
  color: #444;
  font-size: 18px;
  font-weight: 400;
  line-height: 29px;
}
#scroll.container .contents .section.section-1 {
  width: 100%;
  padding: 135px 0 118px;
  background-color: #0A0B18;
  color: #FFF;
}
#scroll.container .contents .section.section-1 .section-description {
  color: #E0E0E0;
}
#scroll.container .contents .section.section-1 .metrics-section {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin-top: 78px;
  margin-bottom: 29px;
}
#scroll.container .contents .section.section-1 .metrics-section .metric-card {
  width: 260px;
  height: 300px;
  padding: 40px 24px 0 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
#scroll.container .contents .section.section-1 .metrics-section .metric-card img {
  width: 82px;
  height: 82px;
}
#scroll.container .contents .section.section-1 .metrics-section .metric-card .title {
  color: #FFF;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
#scroll.container .contents .section.section-1 .metrics-section .metric-card .description {
  color: #CCC;
  font-size: 15px;
  line-height: 23px;
}
#scroll.container .contents .section.section-1 .metrics-section .arrow-right {
  width: 66px;
  height: 15px;
}
#scroll.container .contents .section.section-1 .metrics-section .arrow-bottom {
  display: none;
}
#scroll.container .contents .section.section-1 .comparison-cards {
  display: flex;
  gap: 30px;
  margin-bottom: 78px;
}
#scroll.container .contents .section.section-1 .comparison-cards .card {
  display: flex;
  flex-direction: column;
  gap: 33px;
  width: 480px;
  min-height: 400px;
  padding: 40px 32px;
  border-radius: 20px;
  text-align: left;
}
#scroll.container .contents .section.section-1 .comparison-cards .card .label {
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
}
#scroll.container .contents .section.section-1 .comparison-cards .card .title {
  font-size: 30px;
  font-weight: 700;
  line-height: 1.2;
  color: #EBEBEB;
}
#scroll.container .contents .section.section-1 .comparison-cards .card .list {
  padding: 18px 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#scroll.container .contents .section.section-1 .comparison-cards .card .list .info {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 15px;
  font-weight: 400;
  line-height: 150%;
}
#scroll.container .contents .section.section-1 .comparison-cards .card .list .info img {
  width: 20px;
  height: 20px;
  margin-top: 2px;
}
#scroll.container .contents .section.section-1 .comparison-cards .card.google {
  background: #1E1F25;
  border: 1px solid #7F7F7F;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 8px 15px 0 rgba(0, 0, 0, 0.12);
}
#scroll.container .contents .section.section-1 .comparison-cards .card.google .label {
  color: #CCCCCC;
}
#scroll.container .contents .section.section-1 .comparison-cards .card.google .list .info {
  color: #CCC;
}
#scroll.container .contents .section.section-1 .comparison-cards .card.beusable {
  background: #082B38;
  border: 3px solid #2D657A;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 8px 15px 0 rgba(0, 0, 0, 0.12);
}
#scroll.container .contents .section.section-1 .comparison-cards .card.beusable .label {
  color: #EC0047;
}
#scroll.container .contents .section.section-1 .comparison-cards .card.beusable .list .info {
  color: #fff;
  font-weight: 500;
}
#scroll.container .contents .section.section-1 .insight-text {
  color: #E0E0E0;
  font-size: 18px;
  line-height: 29px;
}
#scroll.container .contents .section.section-2 {
  margin-top: 180px;
  margin-bottom: 291px;
}
#scroll.container .contents .section.section-2 .before-after {
  display: flex;
  gap: 24px;
  margin-top: 78px;
  text-align: left;
}
#scroll.container .contents .section.section-2 .before-after .card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 33px;
  width: 420px;
  height: 376px;
  padding: 40px 32px;
  border-radius: 20px;
  box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(0, 0, 0, 0.2);
}
#scroll.container .contents .section.section-2 .before-after .card .label {
  display: inline-block;
  padding: 6px 8px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
}
#scroll.container .contents .section.section-2 .before-after .card .title {
  font-size: 30px;
  font-weight: 700;
  line-height: 1.2;
}
#scroll.container .contents .section.section-2 .before-after .card .list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  padding: 18px;
  border-radius: 8px;
}
#scroll.container .contents .section.section-2 .before-after .card .list .info {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  line-height: 150%;
}
#scroll.container .contents .section.section-2 .before-after .card .list .info img {
  width: 20px;
  height: 20px;
}
#scroll.container .contents .section.section-2 .before-after .card.before .label {
  background: #AAAAAA;
  color: #FFF;
}
#scroll.container .contents .section.section-2 .before-after .card.before .list {
  background: #ECECEC;
}
#scroll.container .contents .section.section-2 .before-after .card.before .list .info {
  color: #2F2F2F;
}
#scroll.container .contents .section.section-2 .before-after .card.after {
  border: 3px solid #EC0047;
}
#scroll.container .contents .section.section-2 .before-after .card.after .label {
  background: #EC0047;
  color: #FFF;
}
#scroll.container .contents .section.section-2 .before-after .card.after .list {
  background: #222;
}
#scroll.container .contents .section.section-2 .before-after .card.after .list .info {
  color: #fff;
  font-weight: 600;
}
#scroll.container .contents .section.section-2 .before-after .card .bread-img {
  position: absolute;
  bottom: -73px;
  left: 0;
  transform: translateX(-100%);
}
#scroll.container .contents .section.section-2 .before-after .arrow-bottom {
  display: none;
}
#scroll.container .contents .section.section-3 {
  margin-bottom: 236px;
}
#scroll.container .contents .section.section-3 .step-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 771px;
  height: 294px;
  padding: 60px 24px 0 24px;
  margin-top: 78px;
  margin-bottom: 66px;
  background: #F6F6F6;
  border-radius: 20px;
}
#scroll.container .contents .section.section-3 .step-card .title {
  font-size: 26px;
  font-weight: 600;
  color: #666;
  letter-spacing: -0.5px;
}
#scroll.container .contents .section.section-3 .step-card .progress-bar {
  width: 577px;
  height: 14px;
  background: #D9D9D9;
  border-radius: 7px;
}
#scroll.container .contents .section.section-3 .step-card .progress-bar .progress {
  height: 100%;
  background: linear-gradient(90deg, #EA6900 0%, #EC0047 58%);
  border-radius: 7px;
}
#scroll.container .contents .section.section-3 .step-card .items {
  display: flex;
  justify-content: space-between;
  width: 577px;
}
#scroll.container .contents .section.section-3 .step-card .items .item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
  line-height: 23px;
  color: #444;
}
#scroll.container .contents .section.section-3 .step-card .items .item img {
  width: 20px;
  height: 20px;
}
#scroll.container .contents .section.section-3 .step-card .items .item:last-child {
  color: #EC0047;
}
#scroll.container .contents .section.section-3 .step-card .description {
  font-size: 15px;
  line-height: 23px;
  color: #666;
}
#scroll.container .contents .section.section-3 .step-card .description .highlight {
  font-weight: 600;
  color: #EC0047;
}
#scroll.container .contents .section.section-3 .step-list {
  display: flex;
  gap: 65px;
}
#scroll.container .contents .section.section-3 .step-list .item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  min-width: 300px;
}
#scroll.container .contents .section.section-3 .step-list .item .index {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 68px;
  height: 68px;
  margin-bottom: 15px;
  border-radius: 50%;
  background-color: #EC0047;
  color: #FFF;
  font-family: NewRubrik;
  font-size: 30px;
  font-weight: 700;
}
#scroll.container .contents .section.section-3 .step-list .item .index:before {
  position: absolute;
  top: 50%;
  right: -10px;
  transform: translate(100%, -50%);
  content: "";
  width: 277px;
  height: 0px;
  border: none;
  border-top: 8px dotted #E0E0E0;
}
#scroll.container .contents .section.section-3 .step-list .item .title {
  font-size: 30px;
  font-weight: 600;
  line-height: 150%;
}
#scroll.container .contents .section.section-3 .step-list .item .description {
  color: #444;
  font-size: 18px;
  line-height: 150%;
}
#scroll.container .contents .section.section-3 .step-list .item .tag {
  display: inline;
  padding: 3px 8px;
  color: #2B2B2B;
  font-size: 12px;
  font-weight: 600;
  line-height: 150%;
  border-radius: 4px;
  background: #EBEBEB;
}
#scroll.container .contents .section.section-3 .step-list .item:last-child .index:before {
  display: none;
}
#scroll.container .contents .section.section-3 .step-list.en .item:first-child .index:before {
  width: 290px;
}
#scroll.container .contents .section.section-3 {
  margin-bottom: 280px;
}
#scroll.container .contents .section.section-4 {
  margin-bottom: 280px;
}
#scroll.container .contents .section.section-4 .tech-card {
  display: flex;
  gap: 28px;
  margin-top: 78px;
}
#scroll.container .contents .section.section-4 .tech-card-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 572px;
  height: 604px;
  padding: 40px 36px;
  border-radius: 20px;
  border: 3px solid transparent;
  box-shadow: 0 26px 30px -11px rgba(0, 0, 0, 0.3);
  text-align: left;
}
#scroll.container .contents .section.section-4 .tech-card-item .title {
  font-size: 36px;
  font-weight: 700;
  line-height: 47px;
  letter-spacing: -1px;
  margin-bottom: 10px;
}
#scroll.container .contents .section.section-4 .tech-card-item .title .highlight {
  color: #0E90A5;
}
#scroll.container .contents .section.section-4 .tech-card-item .subtitle {
  color: #AAA;
  font-size: 18px;
  font-weight: 600;
  line-height: 100%;
  margin-bottom: 29px;
}
#scroll.container .contents .section.section-4 .tech-card-item .description {
  color: #888;
  font-size: 20px;
  font-weight: 500;
  line-height: 150%;
  min-height: 90px;
  padding-bottom: 32px;
  border-bottom: 1px dashed #aaa;
  word-break: auto-phrase;
}
#scroll.container .contents .section.section-4 .tech-card-item .features-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 44px;
}
#scroll.container .contents .section.section-4 .tech-card-item .features-list .feature-item {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 20px;
  font-weight: 600;
  line-height: 100%;
}
#scroll.container .contents .section.section-4 .tech-card-item .varcode {
  display: flex;
  gap: 30px;
  width: 100%;
  padding: 20px 8px;
  margin-top: 32px;
  background-color: #ECECEC;
  border-radius: 8px;
}
#scroll.container .contents .section.section-4 .tech-card-item .varcode .varcode-graphic {
  margin: 0 21px;
  width: 30px;
  height: 136px;
  border-radius: 100px;
  background: linear-gradient(180deg, #FFF 0%, #E83822 20.31%, #F6DE00 38.85%, #3CE700 59.06%, #00A2E8 75.21%, #004ABA 87.5%, #0A0A10 100%);
}
#scroll.container .contents .section.section-4 .tech-card-item .varcode .varcode-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 0;
}
#scroll.container .contents .section.section-4 .tech-card-item .varcode .varcode-list .varcode-item {
  position: relative;
  color: #2F2F2F;
  font-size: 15px;
  line-height: 150%;
}
#scroll.container .contents .section.section-4 .tech-card-item .varcode .varcode-list .varcode-item:before {
  position: absolute;
  top: 50%;
  left: -8px;
  transform: translate(-100%, -50%);
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 3px;
  background-color: #E83B25;
}
#scroll.container .contents .section.section-4 .tech-card-item .varcode .varcode-list .varcode-item:nth-child(2):before {
  background-color: #ED6C17;
}
#scroll.container .contents .section.section-4 .tech-card-item .varcode .varcode-list .varcode-item:nth-child(3):before {
  background-color: #05A8D3;
}
#scroll.container .contents .section.section-4 .tech-card-item .varcode .varcode-list .varcode-item:nth-child(4):before {
  background-color: #033787;
}
#scroll.container .contents .section.section-4 .tech-card-item.on-screen-ai {
  border-color: #EC0047;
}
#scroll.container .contents .section.section-4 .tech-card-item.varcode {
  border-color: #0E90A5;
}
#scroll.container .contents .section.section-5 {
  margin-bottom: 280px;
}
#scroll.container .contents .section.section-5 .insights {
  display: flex;
  gap: 30px;
  margin-top: 76px;
  margin-bottom: 80px;
}
#scroll.container .contents .section.section-5 .insights .insight-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  width: 370px;
  min-height: 370px;
  padding: 60px 24px 0 24px;
  border-radius: 10px;
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.27), 0 3px 9px 0 rgba(0, 0, 0, 0.14);
}
#scroll.container .contents .section.section-5 .insights .insight-card .content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 300px;
}
#scroll.container .contents .section.section-5 .insights .insight-card .content .title {
  color: #2F2F2F;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
#scroll.container .contents .section.section-5 .insights .insight-card .content .description {
  color: #666;
  font-size: 15px;
  line-height: 23px;
}
#scroll.container .contents .section.section-5 .visitor-types-title {
  margin-bottom: 36px;
  font-size: 30px;
  font-weight: 600;
  line-height: 150%;
}
#scroll.container .contents .section.section-5 .visitor-types {
  display: flex;
  gap: 60px;
}
#scroll.container .contents .section.section-5 .visitor-types .visitor-type-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 240px;
  min-height: 200px;
  padding: 35px 0;
  box-sizing: border-box;
}
#scroll.container .contents .section.section-5 .visitor-types .visitor-type-card .name {
  font-size: 24px;
  font-weight: 600;
}
#scroll.container .contents .section.section-5 .visitor-types .visitor-type-card:not(:last-child)::before {
  content: "";
  position: absolute;
  top: 0;
  right: -30px;
  width: 1px;
  height: 100%;
  background-color: #CCC;
}
#scroll.container .contents .section.section-6 {
  margin-bottom: 280px;
}
#scroll.container .contents .section.section-6 .testimonials {
  display: flex;
  gap: 30px;
  margin-top: 78px;
  margin-bottom: 78px;
}
#scroll.container .contents .section.section-6 .testimonials .testimonial-card {
  width: 500px;
  min-height: 247px;
  padding: 40px 32px;
  border-radius: 20px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 8px 15px 0 rgba(0, 0, 0, 0.12);
  text-align: left;
}
#scroll.container .contents .section.section-6 .testimonials .testimonial-card .text {
  font-size: 18px;
  line-height: 1.5;
  color: #444;
  margin-bottom: 33px;
  min-height: 84px;
}
#scroll.container .contents .section.section-6 .testimonials .testimonial-card .author {
  display: flex;
  gap: 8px;
}
#scroll.container .contents .section.section-6 .testimonials .testimonial-card .author .info .name {
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  color: #212121;
  margin-bottom: 4px;
}
#scroll.container .contents .section.section-6 .testimonials .testimonial-card .author .info .company {
  font-size: 15px;
  line-height: 23px;
  color: #666;
}
#scroll.container .contents .section.section-6 .who-are-you .title {
  margin-top: 40px;
  margin-bottom: 24px;
  font-size: 36px;
  font-weight: 700;
  line-height: 47px;
  letter-spacing: -1px;
}
#scroll.container .contents .section.section-6 .who-are-you .description {
  color: #444;
  font-size: 18px;
  line-height: 29px;
}
#scroll.container .contents .section.section-7 {
  margin-bottom: 280px;
}
#scroll.container .contents .section.section-7 .use-cases {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  width: 100%;
  max-width: 1170px;
  margin-top: 78px;
}
#scroll.container .contents .section.section-7 .use-cases .use-case-card {
  display: flex;
  flex-direction: column;
  gap: 33px;
  padding: 40px 32px 56px 32px;
  background: #FFF;
  border-radius: 20px;
  box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(0, 0, 0, 0.2);
  text-align: left;
}
#scroll.container .contents .section.section-7 .use-cases .use-case-card .industry {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 33px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  color: #212121;
}
#scroll.container .contents .section.section-7 .use-cases .use-case-card .title {
  font-size: 30px;
  font-weight: 700;
  line-height: 1.2;
}
#scroll.container .contents .section.section-7 .use-cases .use-case-card .question {
  padding: 18px;
  background: #ECECEC;
  border-radius: 8px;
  font-size: 15px;
  line-height: 1.5;
  color: #2F2F2F;
  text-align: center;
}
#scroll.container .contents .section.section-7 .use-cases .use-case-card .answer {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 18px;
  line-height: 1.5;
  word-break: auto-phrase;
}
#scroll.container .contents .section.section-7 .use-cases .use-case-card .answer img {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
}
#scroll.container .contents .section.section-8 {
  margin-bottom: 280px;
}
#scroll.container .contents .section.section-8 .report-preview {
  margin-top: 78px;
  margin-bottom: 61px;
  width: 850px;
}
#scroll.container .contents .section.section-8 .new-tab-text {
  color: #666;
  font-size: 14px;
  line-height: 23px;
  margin-top: 14px;
}
#scroll.container .contents .section.section-9 {
  margin-bottom: 280px;
}
#scroll.container .contents .section.section-9 .roadmap-grid {
  display: flex;
  gap: 30px;
  margin-top: 78px;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card {
  width: 270px;
  min-height: 280px;
  padding: 26px 20px;
  border-radius: 10px;
  box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.14), 0px 0px 1px 0px rgba(0, 0, 0, 0.27);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card .status {
  min-width: 51px;
  min-height: 24px;
  padding: 3px 8px 3px 9px;
  border-radius: 32px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  color: #FFF;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card .status.live {
  background: #EC0047;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card .status.soon {
  background: #00A9EC;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card img {
  width: 82px;
  height: 82px;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card .content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card .content .title {
  color: #2F2F2F;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card .content .description {
  color: #666;
  font-size: 15px;
  line-height: 23px;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card:not(:last-child) {
  border: 2px solid #0096FF;
}
#scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card:first-child {
  border: 2px solid #EC0047;
}
#scroll.container .contents .section.section-10 {
  position: relative;
  margin-bottom: 280px;
}
#scroll.container .contents .section.section-10 .cost-comparison {
  display: flex;
  gap: 30px;
  margin-top: 80px;
  margin-bottom: 63px;
}
#scroll.container .contents .section.section-10 .cost-comparison .card {
  display: flex;
  flex-direction: column;
  width: 420px;
  padding: 40px 32px;
  gap: 33px;
  border-radius: 20px;
  box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(0, 0, 0, 0.2);
  text-align: left;
}
#scroll.container .contents .section.section-10 .cost-comparison .card .title {
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  color: #212121;
}
#scroll.container .contents .section.section-10 .cost-comparison .card .amount {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.2;
  color: #666;
  text-decoration: line-through;
}
#scroll.container .contents .section.section-10 .cost-comparison .card .period {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  color: #000;
}
#scroll.container .contents .section.section-10 .cost-comparison .ai {
  border: 3px solid #EC0047;
}
#scroll.container .contents .section.section-10 .cost-comparison .ai .amount {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #EC0047;
  font-size: 40px;
  text-decoration: none;
}
#scroll.container .contents .section.section-10 .cost-comparison .ai .amount img {
  width: 48px;
  height: 48px;
}
#scroll.container .contents .section.section-10 .sub1 {
  margin-bottom: 10px;
  color: #2F2F2F;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: -0.5px;
}
#scroll.container .contents .section.section-10 .sub1 .highlight {
  color: #EC0047;
}
#scroll.container .contents .section.section-10 .sub2 {
  color: #666;
  font-size: 14px;
  line-height: 23px;
}
#scroll.container .contents .section.section-10 .robot-img {
  position: absolute;
  bottom: 24px;
  right: -56px;
}
#scroll.container .contents .section.faq {
  width: 1170px;
}
#scroll.container .contents .section.faq .title {
  margin-bottom: 40px;
  font-size: 55px;
  font-weight: 700;
  line-height: 72px;
}
#scroll.container .contents .section.faq .faq-list {
  display: flex;
  flex-direction: column;
  width: 100%;
  text-align: left;
}
#scroll.container .contents .section.faq .faq-list .faq-item {
  width: 100%;
  border-bottom: 1px solid #C3C3C3;
}
#scroll.container .contents .section.faq .faq-list .faq-item:last-child {
  border-bottom: none;
}
#scroll.container .contents .section.faq .faq-list .faq-item .question {
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding-top: 40px;
  padding-right: 19px;
  cursor: pointer;
}
#scroll.container .contents .section.faq .faq-list .faq-item .question span {
  color: #444;
  font-size: 24px;
  font-weight: 700;
  line-height: 35px;
}
#scroll.container .contents .section.faq .faq-list .faq-item .question img {
  width: 32px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
#scroll.container .contents .section.faq .faq-list .faq-item .answer {
  max-height: 0px;
  padding-top: 40px;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  max-width: 1016px;
  word-break: auto-phrase;
  color: #444;
  font-size: 20px;
  font-weight: 500;
  line-height: 37px;
}
#scroll.container .contents .section.faq .faq-list .faq-item .answer-text {
  margin-bottom: 48px;
}
#scroll.container .contents .section.faq .faq-list .faq-item.on .question img {
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  content: url("https://dream-cdn.beusable.net/home/images/features/loginBridge/icon-minus.svg");
}
#scroll.container .contents .section.faq .faq-list .faq-item.on .answer {
  max-height: 500px;
}

@media all and (max-width: 768px) {
  #scroll.container {
    min-width: auto;
    width: 100%;
  }
  #scroll.container .contents {
    margin-bottom: 25px;
  }
  #scroll.container .contents .report-button {
    padding: 13px 20px;
  }
  #scroll.container .contents .report-button span {
    font-size: 15px;
    line-height: 18px;
  }
  #scroll.container .contents .summary {
    width: 100%;
    padding: 45px 20px 84px;
  }
  #scroll.container .contents .summary .back-button {
    display: none;
  }
  #scroll.container .contents .summary h1 {
    margin-bottom: 15px;
    font-size: 32px;
    letter-spacing: normal;
  }
  #scroll.container .contents .summary h2 {
    margin-bottom: 15px;
    font-size: 18px;
    line-height: 1.5;
    letter-spacing: normal;
  }
  #scroll.container .contents .summary .desc {
    margin-bottom: 15px;
    font-size: 14px;
    line-height: 1.5;
    color: #333;
  }
  #scroll.container .contents .summary .desc-sub {
    margin-bottom: 20px;
    font-size: 12px;
    line-height: 1.5;
    color: #666;
  }
  #scroll.container .contents .summary .report-graphic {
    width: 100%;
    margin-top: 28px;
    margin-bottom: 45px;
  }
  #scroll.container .contents .summary .effect-title {
    width: 100%;
    padding-top: 45px;
    margin-bottom: 48px;
    color: #333;
    font-size: 26px;
    line-height: 30px;
    border-top: 1px solid #C1C1C1;
  }
  #scroll.container .contents .summary .effect {
    flex-direction: column;
    gap: 32px;
  }
  #scroll.container .contents .summary .effect .info {
    flex-direction: row;
    gap: 52px;
  }
  #scroll.container .contents .summary .effect .info .info-top {
    position: relative;
    width: 144px;
    gap: 8px;
  }
  #scroll.container .contents .summary .effect .info .info-top .label {
    font-size: 18px;
  }
  #scroll.container .contents .summary .effect .info .info-top:before {
    content: "";
    position: absolute;
    top: 0;
    right: -26px;
    width: 1px;
    height: 100%;
    background-color: #D9D9D9;
  }
  #scroll.container .contents .summary .effect .info:not(:last-child)::before {
    display: none;
  }
  #scroll.container .contents .summary .effect .info .value {
    width: 102px;
    font-size: 40px;
    word-break: break-all;
  }
  #scroll.container .contents .summary .effect .info .value.en, #scroll.container .contents .summary .effect .info .value.ja {
    font-size: 24px;
  }
  #scroll.container .contents .summary .effect .bread-img {
    display: none;
  }
  #scroll.container .contents .section-title {
    margin-bottom: 12px;
    font-size: 26px;
    line-height: 30px;
    font-weight: 600;
    color: #333;
  }
  #scroll.container .contents .section-description {
    color: rgba(51, 51, 51, 0.8);
    font-size: 12px;
    line-height: 22px;
  }
  #scroll.container .contents .section.section-1 {
    padding: 76px 20px 68px;
  }
  #scroll.container .contents .section.section-1 .section-title {
    color: #fff;
  }
  #scroll.container .contents .section.section-1 .section-description {
    font-size: 14px;
  }
  #scroll.container .contents .section.section-1 .metrics-section {
    flex-direction: column;
    gap: 12px;
    margin-top: 48px;
    margin-bottom: 66px;
  }
  #scroll.container .contents .section.section-1 .metrics-section .metric-card {
    width: 212px;
    height: 246px;
    padding: 0;
  }
  #scroll.container .contents .section.section-1 .metrics-section .arrow-right {
    display: none;
  }
  #scroll.container .contents .section.section-1 .metrics-section .arrow-bottom {
    display: block;
    width: 15px;
    height: 38px;
  }
  #scroll.container .contents .section.section-1 .comparison-cards {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-bottom: 33px;
    width: 100%;
  }
  #scroll.container .contents .section.section-1 .comparison-cards .card {
    gap: 40px;
    width: 100%;
    height: auto;
    padding: 36px 32px 48px;
  }
  #scroll.container .contents .section.section-1 .comparison-cards .card .title {
    font-size: 24px;
    color: #fff;
  }
  #scroll.container .contents .section.section-1 .comparison-cards .card .list {
    padding: 0;
    gap: 16px;
  }
  #scroll.container .contents .section.section-1 .comparison-cards .card.beusable .list .info {
    font-weight: 400;
  }
  #scroll.container .contents .section.section-1 .insight-text {
    font-size: 14px;
    line-height: 23px;
  }
  #scroll.container .contents .section.section-2 {
    width: 100%;
    padding: 0 20px;
    margin-top: 72px;
    margin-bottom: 128px;
  }
  #scroll.container .contents .section.section-2 .section-description {
    font-size: 14px;
  }
  #scroll.container .contents .section.section-2 .before-after {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    width: 100%;
    margin-top: 48px;
  }
  #scroll.container .contents .section.section-2 .before-after .card {
    flex-direction: column;
    gap: 16px;
    width: 100%;
    height: auto;
    padding: 36px 32px 48px;
  }
  #scroll.container .contents .section.section-2 .before-after .card .title {
    font-weight: 700;
    font-size: 24px;
    line-height: 47px;
    letter-spacing: -1px;
  }
  #scroll.container .contents .section.section-2 .before-after .card .bread-img {
    display: none;
  }
  #scroll.container .contents .section.section-2 .before-after .arrow-right {
    display: none;
  }
  #scroll.container .contents .section.section-2 .before-after .arrow-bottom {
    display: block;
  }
  #scroll.container .contents .section.section-3 {
    margin-bottom: 220px;
    padding: 0 20px;
  }
  #scroll.container .contents .section.section-3 .step-card {
    width: 100%;
    height: auto;
    padding: 32px 24px 38px;
    margin-top: 48px;
    margin-bottom: 59px;
    border-radius: 10px;
  }
  #scroll.container .contents .section.section-3 .step-card .title {
    font-size: 20px;
    line-height: 1.5;
  }
  #scroll.container .contents .section.section-3 .step-card .progress-bar {
    width: 100%;
    height: 18px;
    border-radius: 35px;
  }
  #scroll.container .contents .section.section-3 .step-card .progress-bar .progress {
    height: 100%;
    background: linear-gradient(90deg, #EA6900 0%, #EC0047 58%);
    border-radius: 35px;
  }
  #scroll.container .contents .section.section-3 .step-card .items {
    width: 100%;
  }
  #scroll.container .contents .section.section-3 .step-card .items .item {
    gap: 2px;
    font-size: 12px;
  }
  #scroll.container .contents .section.section-3 .step-card .items .item img {
    width: 12px;
    height: 12px;
  }
  #scroll.container .contents .section.section-3 .step-list {
    flex-direction: column;
    align-items: center;
    gap: 60px;
  }
  #scroll.container .contents .section.section-3 .step-list .item {
    gap: 16px;
    width: 100%;
    min-width: auto;
  }
  #scroll.container .contents .section.section-3 .step-list .item .index {
    width: 40px;
    height: 40px;
    margin-bottom: 0;
    font-size: 18px;
  }
  #scroll.container .contents .section.section-3 .step-list .item .index:before {
    display: none;
  }
  #scroll.container .contents .section.section-3 .step-list .item .title {
    font-size: 24px;
  }
  #scroll.container .contents .section.section-3 .step-list .item .description {
    font-size: 15px;
  }
  #scroll.container .contents .section.section-3 .step-list .item:last-child .index:before {
    display: none;
  }
  #scroll.container .contents .section.section-4 {
    margin-bottom: 129px;
    padding: 0 20px;
  }
  #scroll.container .contents .section.section-4 .section-description {
    font-size: 14px;
  }
  #scroll.container .contents .section.section-4 .tech-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 25px;
    width: 100%;
    margin-top: 48px;
  }
  #scroll.container .contents .section.section-4 .tech-card-item {
    width: 100%;
    height: auto;
    padding: 36px 32px 40px;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .item-icon {
    width: 60px;
    height: 60px;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .title {
    font-size: 24px;
    line-height: 1.2;
    margin-bottom: 4px;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .subtitle {
    color: #666;
    font-size: 15px;
    font-weight: 400;
    line-height: 23px;
    margin-bottom: 16px;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .description {
    color: #666;
    font-size: 15px;
    font-weight: 400;
    line-height: 23px;
    min-height: auto;
    padding-bottom: 16px;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .features-list {
    gap: 8px;
    margin-top: 16px;
    padding: 10px 10px 10px 0;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .features-list .feature-item {
    gap: 8px;
    font-size: 14px;
    line-height: 1.5;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .features-list .feature-item img {
    width: 20px;
    height: 20px;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .varcode {
    padding: 30px 8px;
    margin-top: 16px;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .varcode .varcode-graphic {
    margin: 0 12px;
    width: 16px;
    height: 120px;
  }
  #scroll.container .contents .section.section-4 .tech-card-item .varcode .varcode-list .varcode-item {
    font-size: 12px;
  }
  #scroll.container .contents .section.section-5 {
    width: 100%;
    padding: 0 20px;
    margin-bottom: 158px;
  }
  #scroll.container .contents .section.section-5 .insights {
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-top: 48px;
    margin-bottom: 44px;
  }
  #scroll.container .contents .section.section-5 .insights .insight-card {
    gap: 16px;
    width: 100%;
    min-height: auto;
    padding: 32px 24px 48px;
  }
  #scroll.container .contents .section.section-5 .insights .insight-card .content {
    gap: 12px;
    width: 100%;
  }
  #scroll.container .contents .section.section-5 .visitor-types-title {
    margin-bottom: 40px;
    font-size: 20px;
    color: #333;
  }
  #scroll.container .contents .section.section-5 .visitor-types {
    flex-wrap: wrap;
    justify-content: center;
    width: 335px;
    row-gap: 12px;
    column-gap: 24px;
  }
  #scroll.container .contents .section.section-5 .visitor-types .visitor-type-card {
    width: 140px;
    height: 120px;
    min-height: auto;
    padding: 11px 0;
  }
  #scroll.container .contents .section.section-5 .visitor-types .visitor-type-card .visitor-icon {
    width: 60px;
    height: 60px;
  }
  #scroll.container .contents .section.section-5 .visitor-types .visitor-type-card .name {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
  }
  #scroll.container .contents .section.section-5 .visitor-types .visitor-type-card:not(:last-child)::before {
    right: -12px;
  }
  #scroll.container .contents .section.section-5 .visitor-types .visitor-type-card:nth-child(2)::before {
    display: none;
  }
  #scroll.container .contents .section.section-6 {
    padding: 0 20px;
    margin-bottom: 128px;
  }
  #scroll.container .contents .section.section-6 .testimonials {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-top: 48px;
    margin-bottom: 48px;
  }
  #scroll.container .contents .section.section-6 .testimonials .testimonial-card {
    width: 100%;
    min-height: auto;
    padding: 32px 24px 34px;
    border-radius: 10px;
  }
  #scroll.container .contents .section.section-6 .testimonials .testimonial-card .text {
    font-size: 15px;
    line-height: 23px;
    color: #666;
    margin-bottom: 30px;
    min-height: auto;
  }
  #scroll.container .contents .section.section-6 .testimonials .testimonial-card .author .info .name {
    font-size: 18px;
    margin-bottom: 5px;
  }
  #scroll.container .contents .section.section-6 .who-are-you .title {
    margin-top: 24px;
    margin-bottom: 12px;
    font-size: 20px;
    line-height: 1.5;
    color: #333;
    letter-spacing: normal;
  }
  #scroll.container .contents .section.section-6 .who-are-you .description {
    color: rgba(51, 51, 51, 0.8);
    font-size: 12px;
    line-height: 22px;
  }
  #scroll.container .contents .section.section-7 {
    padding: 0 20px;
    margin-bottom: 128px;
  }
  #scroll.container .contents .section.section-7 .use-cases {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-top: 48px;
  }
  #scroll.container .contents .section.section-7 .use-cases .use-case-card {
    gap: 16px;
    padding: 36px 32px 30px;
  }
  #scroll.container .contents .section.section-7 .use-cases .use-case-card .industry {
    margin-bottom: 4px;
  }
  #scroll.container .contents .section.section-7 .use-cases .use-case-card .industry .industry-icon {
    width: 40px;
    height: 40px;
  }
  #scroll.container .contents .section.section-7 .use-cases .use-case-card .title {
    font-size: 22px;
    line-height: 47px;
    letter-spacing: -1px;
  }
  #scroll.container .contents .section.section-7 .use-cases .use-case-card .answer {
    gap: 8px;
    font-size: 14px;
  }
  #scroll.container .contents .section.section-7 .use-cases .use-case-card .answer img {
    width: 20px;
    height: 20px;
  }
  #scroll.container .contents .section.section-8 {
    margin-bottom: 128px;
    padding: 0 20px;
  }
  #scroll.container .contents .section.section-8 .report-preview {
    margin-top: 48px;
    margin-bottom: 48px;
    width: 100%;
  }
  #scroll.container .contents .section.section-8 .new-tab-text {
    font-size: 12px;
    line-height: 1.5;
    margin-top: 16px;
  }
  #scroll.container .contents .section.section-9 {
    width: 100%;
    padding: 0 20px;
    margin-bottom: 128px;
  }
  #scroll.container .contents .section.section-9 .roadmap-grid {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    width: 100%;
    margin-top: 48px;
  }
  #scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card {
    width: 100%;
    min-height: auto;
    padding: 24px;
    gap: 16px;
  }
  #scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card img {
    width: 60px;
    height: 60px;
  }
  #scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card .content {
    gap: 8px;
  }
  #scroll.container .contents .section.section-9 .roadmap-grid .roadmap-card .content .title {
    font-size: 24px;
  }
  #scroll.container .contents .section.section-10 {
    width: 100%;
    padding: 0 20px;
    margin-bottom: 128px;
  }
  #scroll.container .contents .section.section-10 .cost-comparison {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    width: 100%;
    margin-top: 48px;
    margin-bottom: 45px;
  }
  #scroll.container .contents .section.section-10 .cost-comparison .card {
    width: 100%;
    padding: 32px 24px 48px;
    gap: 12px;
    border-radius: 10px;
    text-align: center;
  }
  #scroll.container .contents .section.section-10 .cost-comparison .card .title {
    font-size: 15px;
    line-height: 23px;
    color: #666;
  }
  #scroll.container .contents .section.section-10 .cost-comparison .card .amount {
    justify-content: center;
    font-size: 30px;
    font-weight: 600;
    line-height: normal;
    color: #2F2F2F;
  }
  #scroll.container .contents .section.section-10 .cost-comparison .card .period {
    font-size: 15px;
    font-weight: 600;
    line-height: 23px;
    color: #666;
  }
  #scroll.container .contents .section.section-10 .cost-comparison .ai .amount {
    gap: 6px;
    font-size: 34px;
    color: #EC0047;
  }
  #scroll.container .contents .section.section-10 .cost-comparison .ai .amount img {
    width: 46px;
    height: 46px;
  }
  #scroll.container .contents .section.section-10 .sub1 {
    margin-bottom: 12px;
    color: #666;
    font-size: 18px;
    letter-spacing: normal;
  }
  #scroll.container .contents .section.section-10 .sub2 {
    font-size: 12px;
    line-height: 1.5;
  }
  #scroll.container .contents .section.section-10 .robot-img {
    position: relative;
    bottom: auto;
    right: auto;
    width: 140px;
    margin-bottom: 45px;
  }
  #scroll.container .contents .section.faq {
    width: 100%;
    padding: 0 20px;
  }
  #scroll.container .contents .section.faq .title {
    margin-bottom: 28px;
    font-size: 22px;
    line-height: 30px;
  }
  #scroll.container .contents .section.faq .faq-list .faq-item .question {
    padding-top: 21px;
    padding-right: 8px;
  }
  #scroll.container .contents .section.faq .faq-list .faq-item .question span {
    font-size: 16px;
    line-height: 26px;
  }
  #scroll.container .contents .section.faq .faq-list .faq-item .question img {
    width: 24px;
  }
  #scroll.container .contents .section.faq .faq-list .faq-item .answer {
    padding-top: 20px;
    max-width: calc(100% - 55px);
    font-size: 14px;
    line-height: 22px;
  }
  #scroll.container .contents .section.faq .faq-list .faq-item .answer-text {
    margin-bottom: 10px;
  }
}
.video-content {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 200px;
}
.video-content * {
  box-sizing: border-box;
}
.video-content .video-frame {
  background: url(https://dream-cdn.beusable.net/home/images/guide_background.svg) no-repeat center/contain;
  width: 780px;
  height: 570px;
  position: relative;
}
.video-content .video-frame video {
  position: absolute;
  width: 720px;
  height: 405px;
  left: 50%;
  transform: translateX(-50%);
  top: 80px;
}
.video-content .video-frame .icon--scroll-bot {
  position: absolute;
  display: block;
  width: 168px;
  height: 261px;
  background: url(https://dream-cdn.beusable.net/home/images/guide_illust.svg) no-repeat center/contain;
  position: absolute;
  bottom: 0;
  right: -190px;
}

@media all and (max-width: 768px) {
  .video-content {
    margin: 20px 0 80px;
  }
  .video-content .video-frame {
    width: calc(100% - 40px);
    height: 100%;
    aspect-ratio: 126/71;
    border-radius: 10px;
    border: 4px solid #2F2F2F;
    box-shadow: 0 20px 16px -12px rgba(0, 0, 0, 0.12);
    overflow: hidden;
    background: none;
  }
  .video-content .video-frame video {
    width: 100%;
    height: 100%;
    position: unset;
    object-fit: cover;
    transform: initial;
  }
  .video-content .video-frame .icon--scroll-bot {
    display: none;
  }
}
.pricing-notice {
  min-width: 1280px;
  min-height: 100vh;
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
}
.pricing-notice:lang(ja) {
  font-family: "Pretendard JP Variable", "Pretendard JP", "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
}
.pricing-notice * {
  box-sizing: border-box;
}
.pricing-notice .inner {
  max-width: 1210px;
  padding: 0 20px;
  margin: 0 auto;
}
.pricing-notice-header {
  width: 100%;
  background-color: #fff;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  z-index: 10;
}
.pricing-notice-header .header-inner {
  width: 100%;
  max-width: 1202px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.pricing-notice-header .logo-wrap {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}
.pricing-notice-header .logo-wrap a {
  font: inherit;
  color: inherit;
  display: block;
  width: 100%;
  height: 100%;
}
.pricing-notice-header .logo-wrap .logo {
  width: 148px;
  height: 26px;
  background: url(https://dream-cdn.beusable.net/home/images/logo-main.svg) no-repeat center center;
  background-size: contain;
}
.pricing-notice-header .logo-wrap .title {
  color: #EC0047;
  font-family: "NewRubrik";
  font-size: 20px;
  font-weight: 700;
  line-height: 18px;
}
.pricing-notice-header .divider {
  width: 1px;
  height: 12px;
  border: none;
  background: #D9D9D9;
  align-self: flex-end;
  margin: 2px 0;
}
.pricing-notice-header .bread-crumb {
  color: #555;
  font-size: 16px;
  font-weight: 700;
  line-height: 100%;
  align-self: flex-end;
  margin-left: 4px;
}
.pricing-notice-section {
  min-height: 100vh;
  display: grid;
  place-content: center;
  padding-bottom: 60px;
}
.pricing-notice .options .option.enterprise .option-spec li {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pricing-notice .options .option.enterprise .option-spec li.flat .label {
  color: #3D95BB;
}
.pricing-notice .options .option.enterprise .option-spec li .label {
  color: #F46200;
  font-size: 11px;
  font-weight: 600;
  line-height: 100%;
}
.pricing-notice .options .option .option-info {
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
  text-align: center;
}
.pricing-notice .options .option .option-info .info {
  min-height: 106px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #005BAD;
  text-align: center;
  padding: 20px;
  border-radius: 12px;
  background: #F0F0F0;
  font-size: 18px;
  font-weight: 700;
  line-height: 120%;
}
.pricing-notice .options .option .option-info .info.purple {
  color: #3500B9;
}
.pricing-notice .options .option .option-info .guide-text {
  color: #444;
  font-size: 13px;
  font-weight: 400;
  line-height: 100%;
}
.pricing-notice .section__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
  padding-block: 146px 70px;
}
.pricing-notice .section__title .title {
  color: #222;
  font-size: 20px;
  font-weight: 700;
  line-height: 150%;
}
.pricing-notice .section__title .sub-title {
  color: #555;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%;
}
.pricing-notice .template-pricing {
  margin-bottom: 60px;
}
.pricing-notice .template-pricing .contents {
  padding: 0;
}
.pricing-notice .template-pricing .contents > .options {
  gap: 32px;
  align-items: stretch;
}
.pricing-notice .template-pricing .contents > .options .option {
  gap: 0;
  height: auto;
  min-height: 507px;
  width: 100%;
  border-radius: 14px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  background: #FFF;
  box-shadow: 0 8px 12px -6px rgba(0, 0, 0, 0.12);
  padding: 40px 22px 56px;
}
.pricing-notice .template-pricing .contents > .options .option.enterprise {
  padding-bottom: 41px;
}
.pricing-notice .template-pricing .contents > .options .option.saas {
  border: 4px solid #EC0047;
  margin: -4px;
}
.pricing-notice .template-pricing .contents > .options .option.saas .recommend-badge {
  content: "";
  position: absolute;
  top: -7px;
  left: -8px;
  width: 88px;
  height: 88px;
  background: url(https://dream-cdn.beusable.net/home/images/journey/pricing/icon--plan-flag.svg) no-repeat center/contain;
  z-index: -1;
}
.pricing-notice .template-pricing .contents > .options .option > i.icon {
  margin: 30px 0 0;
  width: 208px;
  height: 86px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.pricing-notice .template-pricing .contents > .options .option > i.icon-everyone {
  background-image: url("https://dream-cdn.beusable.net/home/images/journey/pricing/icon--new-everyone.svg");
}
.pricing-notice .template-pricing .contents > .options .option > i.icon-sass {
  background-image: url("https://dream-cdn.beusable.net/home/images/journey/pricing/icon--new-sass.svg");
}
.pricing-notice .template-pricing .contents > .options .option > i.icon-enterprise {
  background-image: url("https://dream-cdn.beusable.net/home/images/journey/pricing/icon--new-enterprise.svg");
}
.pricing-notice .template-pricing .contents > .options .option > i.icon-agency {
  background-image: url("https://dream-cdn.beusable.net/home/images/journey/pricing/icon--new-agency.svg");
}
.pricing-notice .template-pricing .contents > .options .option-title {
  letter-spacing: 0;
  line-height: 1;
}
.pricing-notice .template-pricing .contents > .options .option-pv {
  flex-direction: row;
  gap: 4px;
  align-items: flex-end;
  color: #EC0047;
  font-size: 20px;
  font-weight: 700;
  line-height: 20px;
  padding-block: 24px 26px;
}
.pricing-notice .template-pricing .contents > .options .option-pv .unit {
  line-height: 1;
  font-style: normal;
  font-size: 12px;
}
.pricing-notice .template-pricing .contents > .options .option-pv-select {
  font-family: inherit;
  cursor: pointer;
  margin-block: 14px 18px;
  min-width: 196px;
  height: 40px;
  padding: 0 36px 0 12px;
  border-radius: 6px;
  border: solid 1px #b1b1b1;
  background: url(https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg) no-repeat 92% 50%;
  appearance: none;
  color: #EC0047;
  font-size: 20px;
  font-weight: 700;
  line-height: 20px;
  outline: none;
}
.pricing-notice .template-pricing .contents > .options .option-pv-select option {
  font-weight: 400;
}
.pricing-notice .template-pricing .contents > .options .option-pv-select .unit {
  font-size: 1px;
}
.pricing-notice .template-pricing .contents > .options .option-price {
  color: #333;
  font-size: 36px;
  font-weight: 700;
  line-height: 100%;
  letter-spacing: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.pricing-notice .template-pricing .contents > .options .option-price .option-price-wrap {
  justify-content: center;
  align-items: flex-end;
}
.pricing-notice .template-pricing .contents > .options .option-price .option-price-unit {
  font-size: 24px;
  line-height: 1;
  margin-bottom: 2px;
}
.pricing-notice .template-pricing .contents > .options .option-price .option-price-month {
  font-size: 18px;
  line-height: 1;
  margin-bottom: 4px;
}
.pricing-notice .template-pricing .contents > .options .option-price .vat {
  font-size: 13px;
  font-weight: 400;
  line-height: 100%;
  margin-block: 7px 10px;
}
.pricing-notice .template-pricing .contents > .options .option-price .cost {
  color: #EC0047;
  font-size: 22px;
  line-height: 100%;
  position: relative;
}
.pricing-notice .template-pricing .contents > .options .option-price .cost:after {
  content: "";
  position: absolute;
  bottom: 8px;
  left: -20px;
  display: block;
  width: 108px;
  height: 26px;
  background: url(https://dream-cdn.beusable.net/home/images/journey/pricing/icon--line-through.svg) no-repeat center/contain;
}
.pricing-notice .template-pricing .contents > .options .option-price .discount-badge {
  position: absolute;
  bottom: -14px;
  right: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  background: url(https://dream-cdn.beusable.net/home/images/journey/pricing/icon--discount-badge.svg) no-repeat center/contain;
  color: #FFF;
  font-style: normal;
  text-shadow: 0 1px 1px #49A6B6;
  font-size: 10px;
  font-weight: 700;
  line-height: 108%;
  letter-spacing: -0.1px;
}
.pricing-notice .template-pricing .contents > .options .option-spec {
  margin-top: auto;
  width: 100%;
  gap: 14px;
}
.pricing-notice .template-pricing .contents > .options .option-spec.check li {
  align-items: flex-start;
  gap: 10px;
}
.pricing-notice .template-pricing .contents > .options .option-spec.check li:before {
  content: "";
  margin-block: 1px;
  display: block;
  width: 18px;
  height: 18px;
  background: url(https://dream-cdn.beusable.net/home/images/icon-check-green.svg) no-repeat center/contain;
}
.pricing-notice .template-pricing .contents > .options .option-spec.check li.accent {
  color: #EC0047;
}
.pricing-notice .template-pricing .contents > .options .option-spec li {
  color: #444;
  font-size: 14px;
  font-weight: 600;
  line-height: 150%;
  display: flex;
  border-bottom: 1px dashed #AAA;
  padding-bottom: 14px;
}
.pricing-notice .template-pricing .contents > .options .option-spec li:last-child {
  border: none;
  padding-bottom: 0;
}
.pricing-notice .template-pricing-mobile .options {
  margin-top: 0;
}
.pricing-notice .template-pricing-mobile .options .option {
  padding: 16px;
}
.pricing-notice .template-pricing-mobile .options .option.enterprise .option-spec {
  gap: 18px;
}
.pricing-notice .template-pricing-mobile .options .option.enterprise .option-spec li {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-weight: 600;
  line-height: 19px;
}
.pricing-notice .template-pricing-mobile .options .option.enterprise .option-spec li.flat {
  padding-top: 18px;
  border-top: 1px solid #ECECEC;
}
.pricing-notice .template-pricing-mobile .options .option.enterprise .option-spec li.flat .label {
  color: #3D95BB;
}
.pricing-notice .template-pricing-mobile .options .option.enterprise .option-spec li .label {
  color: #F46200;
  font-size: 13px;
  font-weight: 500;
  line-height: 19px;
}
.pricing-notice .template-pricing-mobile .options .option .option-info {
  margin: 8px 0 40px;
  gap: 16px;
  border-bottom: 0;
}
.pricing-notice .template-pricing-mobile .options .option .option-info .info {
  font-size: 15px;
  line-height: 150%;
}
.pricing-notice .template-pricing-mobile .options .option .option-info .guide-text {
  font-weight: 500;
  line-height: 19px;
}
.pricing-notice .template-pricing-mobile .options .option-main {
  padding: 0 4px;
}
.pricing-notice .template-pricing-mobile .options .option-main .discount-badge {
  background: #1199AF;
  border-radius: 3px;
  padding: 4px;
  color: #FFF;
  font-size: 10px;
  font-weight: 700;
  line-height: 10px;
}
.pricing-notice .template-pricing-mobile .options .option-spec {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.pricing-notice .template-pricing-mobile .options .option-spec.check li {
  align-items: flex-start;
  gap: 4px;
}
.pricing-notice .template-pricing-mobile .options .option-spec.check li:before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: url(https://dream-cdn.beusable.net/home/images/icon-check-green.svg) no-repeat center/contain;
}
.pricing-notice .template-pricing-mobile .options .option-spec.check li.accent {
  color: #EC0047;
}
.pricing-notice .template-pricing-mobile .options .option-spec li {
  color: #444;
  font-size: 13px;
  font-weight: 500;
  display: flex;
}
.pricing-notice .template-pricing-mobile .options .option-sub {
  margin-bottom: 20px;
}
.pricing-notice .template-pricing-mobile .options .option-sub:last-child {
  margin-bottom: 0;
}
.pricing-notice .template-pricing-mobile .options .option-sub-wrap {
  display: flex;
  flex-direction: column;
}
.pricing-notice .template-pricing-mobile .options .option-sub-benefit {
  padding: 0;
  gap: 4px;
}
.pricing-notice .template-pricing-mobile .options .option-sub-benefit .accent {
  color: #EC0047;
}
.pricing-notice .template-pricing-mobile .options .option-sub-check {
  width: 16px;
  height: 16px;
}
.pricing-notice .template-pricing-mobile .options .option-sub-pv {
  padding: 20px 0;
}
.pricing-notice .template-pricing-mobile .options .option-sub-pv span.right {
  font-weight: 600;
}
.pricing-notice .template-pricing-mobile .options .option-sub-pv select {
  font-family: inherit;
  outline: none;
}
.pricing-notice .template-pricing-mobile .options .option-sub-button {
  padding: 13px 12px;
  margin: 40px 0 14px;
}
.pricing-notice .template-pricing-mobile .options .option-content {
  padding-inline: 10px;
}
.pricing-notice .template-pricing-mobile .sub-title {
  font-size: 12px;
}
.pricing-notice .diagnosis-modal-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: none;
}
.pricing-notice .diagnosis-modal-wrapper .contents {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 40px 0 24px 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  border-radius: 14px;
  max-width: 530px;
  max-height: 863px;
  height: calc(100vh - 120px);
  color: #2F2F2F;
  text-align: center;
  overflow: hidden;
}
.pricing-notice .diagnosis-modal-wrapper .contents .scroll-content {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 0 16px;
  box-sizing: border-box;
}
.pricing-notice .diagnosis-modal-wrapper .contents .modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
.pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-modal-img {
  width: 80px;
  height: 80px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .title {
  font-size: 20px;
  font-weight: 600;
  line-height: 100%;
}
.pricing-notice .diagnosis-modal-wrapper .contents .desc {
  font-size: 12px;
  font-weight: 500;
  line-height: 150%;
  margin-bottom: -6px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container {
  padding: 24px 0 18px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  max-width: 340px;
  width: 100%;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper.content .input {
  resize: none;
  min-height: 147px;
  padding: 12px 28px 12px 18px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper.content .input.is-focus {
  border-color: #2E9BFF;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper.content .input.is-focus textarea {
  color: #2F2F2F;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper.content .input.is-value textarea {
  color: #2F2F2F;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper.content .input textarea {
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 120%;
  border: none;
  height: 100%;
  width: 100%;
  outline: none;
  resize: none;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper.content .input textarea::placeholder {
  color: #BFBFBF;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper.email {
  position: relative;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper label, .pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .label {
  color: #777;
  font-size: 13px;
  font-weight: 600;
  line-height: 100%;
  margin-left: 4px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper label > span, .pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .label > span {
  color: #E60724;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper input, .pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .input {
  height: 38px;
  width: 100%;
  padding: 9px 9px 9px 12px;
  border-radius: 5px;
  border: 1px solid #BBB;
  color: #2f2f2f;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%;
  transition: border 0.3s ease-in-out;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper input:focus, .pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .input:focus {
  border: 1px solid #2E9BFF;
  outline: none;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper input::placeholder, .pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .input::placeholder {
  color: #BBB;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper input.error-line, .pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .input.error-line {
  border-color: #ec0047;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .error {
  display: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #e60724;
  position: absolute;
  top: 110%;
  left: 4px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .dropdown {
  text-align: left;
  position: relative;
  width: 100%;
  padding: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .dropdown .selected {
  padding: 0 12px 0 11px;
  cursor: pointer;
  display: flex;
  height: 100%;
  justify-content: space-between;
  align-items: center;
  gap: 11px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .dropdown .selected .icon--down-arrow {
  display: block;
  width: 16px;
  height: 16px;
  background: url("https://dream-cdn.beusable.net/home/images/icon-arrow-down.svg") no-repeat center/contain;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .dropdown .drop-list {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease-in-out;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  max-height: 146px;
  width: calc(100% + 2px);
  overflow: auto;
  top: 41px;
  border-radius: 5px;
  border: 1px solid #BBB;
  background: #FFF;
  box-shadow: 0 20px 16px -12px rgba(0, 0, 0, 0.12);
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .dropdown .drop-list .drop-item {
  padding: 0 11px;
  display: flex;
  align-items: center;
  color: #2F2F2F;
  cursor: pointer;
  height: 36px;
  transition: background 0.3s ease-in-out, font-weight 0.3s ease-in-out;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .dropdown .drop-list .drop-item.selected {
  background: #F4F4F4;
  font-weight: 600;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .dropdown .drop-list .drop-item:hover {
  background: #EBEBEB;
}
.pricing-notice .diagnosis-modal-wrapper .contents .form-container .input-wrapper .guide-text {
  text-align: left;
  color: #0E90A5;
  font-size: 12px;
  font-weight: 400;
  line-height: 150%;
  padding: 0 4px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  max-width: 340px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper {
  width: 100%;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 5px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper:first-child {
  margin-bottom: 0;
  padding-bottom: 12px;
  border-bottom: 1px solid #E0E0E0;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper:nth-child(2) {
  padding-top: 12px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper input[type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  background: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-off.svg") no-repeat center/contain;
  cursor: pointer;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper input[type=checkbox]:checked {
  background-image: url("https://dream-cdn.beusable.net/home/images/suggest/icon-form-checkbox-on.svg");
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 400;
  line-height: 120%;
  cursor: pointer;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label.all {
  font-weight: 600;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper > label.all .helper-text {
  color: #666;
  font-size: 13px;
  font-weight: 400;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion {
  flex-direction: column;
  align-items: flex-start;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header {
  display: flex;
  align-items: center;
  gap: 5px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header label {
  color: #2F2F2F;
  font-size: 13px;
  font-weight: 500;
  line-height: 120%;
  cursor: pointer;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header label > .required {
  color: #ec0047;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header .accordion-toggle {
  cursor: pointer;
  transition: transform 0.2s ease;
  width: 18px;
  height: 18px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-header .accordion-toggle.rotate {
  transform: rotate(180deg);
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion .accordion-content {
  visibility: hidden;
  background: #F4F4F4;
  border-radius: 5px;
  color: #2F2F2F;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%;
  width: 100%;
  box-sizing: border-box;
  text-align: left;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(20px);
  transition: max-height 0.3s ease, opacity 0.3s ease, transform 0.3s ease, padding 0.3s ease, margin 0.3s ease, border 0.3s ease;
  padding: 0 20px;
  margin-top: 0;
  border: 0 solid #D7D7D7;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .checkbox-wrapper.accordion.open .accordion-content {
  max-height: 200px;
  visibility: visible;
  overflow-y: auto;
  opacity: 1;
  transform: translateY(0);
  padding: 20px;
  margin-top: 10px;
  border: 1px solid #D7D7D7;
}
.pricing-notice .diagnosis-modal-wrapper .contents .privacy .error {
  display: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: #e60724;
}
.pricing-notice .diagnosis-modal-wrapper .contents .modal-footer {
  width: 100%;
  padding: 12px 28px 0;
  position: relative;
  display: flex;
  justify-content: center;
  gap: 5px;
}
.pricing-notice .diagnosis-modal-wrapper .contents .modal-footer::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 12px;
  left: 0;
  bottom: 123%;
  z-index: 100;
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.06));
  opacity: 0;
  transition: opacity 0.3s ease;
}
.pricing-notice .diagnosis-modal-wrapper .contents .modal-footer.has-scroll::before {
  opacity: 1;
}
.pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn.cancel {
  --btn-text-color: #444;
  --btn-border-color:#BBB;
}
.pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn.cancel:hover {
  --btn-border-color:#BBB;
  --btn-bg-color:#F4F4F4;
}
.pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn.cancel:disabled {
  --btn-text-color: #C7C7C7;
  --btn-border-color:#EBEBEB;
  --btn-bg-color:#FFF;
}
.pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn.submit {
  --btn-text-color: #EC0047;
  --btn-border-color:#EC0047;
  --btn-bg-color:#fff;
}
.pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn.submit:hover {
  --btn-text-color: #fff;
  --btn-bg-color:#EC0047;
}
.pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn.submit:disabled {
  --btn-text-color: #FFAEBD;
  --btn-border-color:#FFAEBD;
  --btn-bg-color:rgba(255, 255, 255, 0.32);
}
.pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn {
  min-width: 90px;
  height: 38px;
  outline: none;
  cursor: pointer;
  padding: 0 18px;
  background: var(--btn-bg-color);
  border-radius: 50em;
  font-size: 14px;
  font-weight: 600;
  line-height: 100%;
  transition: all 0.3s ease-in-out;
  color: var(--btn-text-color);
  border: 1px solid var(--btn-border-color);
}
.pricing-notice {
  /* System Modal */
}
.pricing-notice .system-modal-wrapper {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 10000;
  align-items: center;
  justify-content: center;
}
.pricing-notice .system-modal-wrapper.open {
  display: flex;
}
.pricing-notice .system-modal-wrapper .system-modal-content {
  background: #fff;
  border-radius: 14px;
  padding: 48px 48px 25px;
  max-width: 430px;
  width: calc(100% - 56px);
  text-align: center;
  box-shadow: 0 8px 14px 0 rgba(0, 0, 0, 0.16);
  font-family: "Pretendard Variable", "Noto Sans KR", "Noto Sans JP", "Noto Sans TC", sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.pricing-notice .system-modal-wrapper .system-modal-icon {
  display: block;
  width: 52px;
  height: 52px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.pricing-notice .system-modal-wrapper .system-modal-icon.icon--dialog-check {
  background-image: url("https://dream-cdn.beusable.net/home/images/icon--dialog-check.svg");
}
.pricing-notice .system-modal-wrapper .system-modal-title {
  margin: 0;
  color: #2F2F2F;
  font-size: 20px;
  font-weight: 600;
  line-height: 120%;
}
.pricing-notice .system-modal-wrapper .system-modal-desc {
  margin: 0;
  color: #2F2F2F;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%;
  white-space: pre-line;
}
.pricing-notice .system-modal-wrapper .system-modal-actions {
  margin-top: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.pricing-notice .system-modal-wrapper .system-modal-actions .system-modal-btn {
  height: 38px;
  padding: 0 18px;
  border-radius: 999px;
  border: 1px solid #bbb;
  background: #fff;
  color: #2F2F2F;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  min-width: 90px;
  transition: all 0.2s ease;
}
.pricing-notice .system-modal-wrapper .system-modal-actions .system-modal-btn:hover {
  background: #f5f5f5;
}

@media all and (max-width: 768px) {
  .pricing-notice {
    min-width: 100%;
  }
  .pricing-notice-header {
    position: fixed;
    top: 0;
    justify-content: flex-start;
    height: 56px;
    z-index: 100;
  }
  .pricing-notice-header .header-inner {
    width: 100%;
  }
  .pricing-notice-header .logo-wrap .title {
    font-size: 18px;
    letter-spacing: -0.3px;
  }
  .pricing-notice-header .bread-crumb {
    font-size: 14px;
  }
  .pricing-notice-section {
    height: 100%;
    display: block;
    place-content: flex-start;
  }
  .pricing-notice .section__title {
    gap: 8px;
    padding-block: 70px 30px;
  }
  .pricing-notice .section__title .title {
    color: #555;
    font-size: 15px;
  }
  .pricing-notice .section__title .sub-title {
    font-size: 12px;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    border-radius: 0;
    padding-top: 87px;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents .logo {
    position: absolute;
    top: 19px;
    left: 16px;
    color: #EC0047;
    font-family: "NewRubrik";
    font-size: 18px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: -0.3px;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents .modal-close {
    width: 30px;
    height: 30px;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents .modal-close img {
    object-fit: contain;
    width: 100%;
    height: 100%;
    top: 13px;
    right: 13px;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents .title {
    color: #2F2F2F;
    font-size: 30px;
    line-height: 120%;
    margin-bottom: 4px;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents .form-container, .pricing-notice .diagnosis-modal-wrapper .contents .privacy {
    max-width: 100%;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn {
    color: #fff;
    min-width: 100%;
    height: 44px;
    font-size: 15px;
    font-weight: 800;
    border: none;
    background: #EC0047;
    transition: background-color 0.3s ease-in-out;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn:hover {
    background: #C6003B;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents .diagnosis-btn:disabled {
    background: #D7D7D7;
  }
  .pricing-notice .diagnosis-modal-wrapper .contents .modal-footer {
    padding-inline: 16px;
  }
  .pricing-notice .diagnosis-modal-wrapper .scroll-content {
    width: 100%;
  }
  .pricing-notice .system-modal-wrapper .system-modal-title {
    margin-top: 4px;
    line-height: 1;
  }
  .pricing-notice .system-modal-wrapper .system-modal-icon {
    width: 48px;
    height: 48px;
  }
  .pricing-notice .system-modal-wrapper .system-modal-content {
    padding: 30px 14px 20px;
  }
  .pricing-notice .system-modal-wrapper .system-modal-actions {
    margin-top: 18px;
  }
  .pricing-notice .system-modal-wrapper .system-modal-actions .system-modal-btn {
    height: 44px;
    min-width: 98px;
    font-weight: 500;
  }
}

/*# sourceMappingURL=common.css.map */