.video-animation-box {
  position: relative;
}
.animation-pic {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
:root {
  
  --okd-icon-size-base: 18px;
  --okd-icon-size-xs: 14px;
  --okd-color-gray-050: #f9f9f9;
  --okd-color-gray-100: #ebebeb;
  --okd-color-gray-200: #dbdbdb;
  --okd-color-gray-300: #bdbdbd;
  --okd-color-gray-400: #929292;
  --okd-color-gray-500: #6e6e6e;
  --okd-color-gray-600: #545454;
  --okd-color-gray-700: #3d3d3d;
  --okd-color-gray-800: #1a1a1a;
  --okd-color-gray-900: #000;
  --okd-color-blue-050: #f5f9ff;
  --okd-color-blue-100: #d1e3ff;
  --okd-color-blue-200: #afcfff;
  --okd-color-blue-300: #8dbbff;
  --okd-color-blue-400: #6ba6ff;
  --okd-color-blue-500: #4992ff;
  --okd-color-blue-600: #277dff;
  --okd-color-blue-700: #0569ff;
  --okd-color-blue-800: #005eea;
  --okd-color-blue-900: #0051ca;
  --okd-color-green-050: #f2fff7;
  --okd-color-green-100: #d2f4de;
  --okd-color-green-200: #a5e9be;
  --okd-color-green-300: #78de9d;
  --okd-color-green-400: #4bd37d;
  --okd-color-green-500: #31bd65;
  --okd-color-green-600: #18a04a;
  --okd-color-green-700: #127837;
  --okd-color-green-800: #0c5025;
  --okd-color-green-900: #0c5025;
  --okd-color-red-050: #fff8f9;
  --okd-color-red-100: #fcdce5;
  --okd-color-red-200: #f9b9ca;
  --okd-color-red-300: #f796b0;
  --okd-color-red-400: #f07596;
  --okd-color-red-500: #f1507b;
  --okd-color-red-600: #c14062;
  --okd-color-red-700: #91304a;
  --okd-color-red-800: #602031;
  --okd-color-red-900: #301019;
  --okd-color-orange-050: #fef9f6;
  --okd-color-orange-100: #fce3d4;
  --okd-color-orange-200: #fbceb4;
  --okd-color-orange-300: #f9b994;
  --okd-color-orange-400: #f7a474;
  --okd-color-orange-500: #f58f54;
  --okd-color-orange-600: #f6813d;
  --okd-color-orange-700: #f16514;
  --okd-color-orange-800: #e96010;
  --okd-color-orange-900: #bf4803;
  --okd-color-yellow-050: #fffcf5;
  --okd-color-yellow-100: #fff2d1;
  --okd-color-yellow-200: #ffe9af;
  --okd-color-yellow-300: #ffdf8d;
  --okd-color-yellow-400: #ffd66b;
  --okd-color-yellow-500: #ffcc49;
  --okd-color-yellow-600: #ffc327;
  --okd-color-yellow-700: #ffb905;
  --okd-color-yellow-800: #eaa900;
  --okd-color-yellow-900: #d29801;
  --okd-color-text-white: #fff;
  --okd-color-text-black: #1f2933;
  --okd-color-background-1: #fff;
  --okd-color-background-2: #f7f7f7;
  --okd-color-transparent: transparent;
  --okd-color-white: #fff;
  --okd-color-black: #000;
  --okd-color-line-muted: #ebebeb;
  --okd-color-line-secondary: #dbdbdb;
  --okd-color-line-amplifed: #bdbdbd;
  --okd-color-text-lighter: #bdbdbd;
  --okd-color-text-light: #929292;
  --okd-color-text-secondary: #3d3d3d;
  --okd-color-text-amplifed: #000;
  --okd-color-background-3: #f2f2f2;
  --okd-color-fq-blue-lv1: #0569ff;
  --okd-color-fq-green-lv1: #19cc5b;
  --okd-color-fq-red-lv1: #f1507b;
  --okd-color-fq-orange-lv1: #f16514;
  --okd-color-fq-blue-lv2: #0569ff;
  --okd-color-background-hover: #ebebeb;
  --okd-color-prefer-red-chart: #f1507b;
  --okd-color-prefer-red-bg: #eb4b6d;
  --okd-color-prefer-green-chart: #19cc5b;
  --okd-color-prefer-green-bg: #31bd65;
  --okd-color-prefer-red-text: #eb4b6d;
  --okd-color-prefer-green-text: #31bd65;
  --okd-color-branded-primary: #bcff2f;
  --okd-color-fq-critical: #eb4b6d;
  --okd-color-fq-warning: #f16514;
  --okd-color-fq-positive: #31bd65;
  --okd-color-fq-neutral: #000;
  --okd-color-fq-accent: #0569ff;
  --okd-color-prefer-neutral-text: #929292;
  --okd-color-prefer-neutral-bg: #929292;
  --okd-font-size-base: 16px;
  --okd-font-size-md: 14px;
  --okd-font-size-xs: 12px;
  --okd-line-height-base: 20px;
  --okd-line-height-md: 20px;
  --okd-line-height-xs: 16px;
  --okd-shadow-none: 0 0 0 0 transparent;
  --okd-shadow-xs: 0 0 0 1px #0000000d;
  --okd-shadow-sm: 0 1px 2px 0 #0000000d;
  --okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
  --okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
  --okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
  --okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
  --okd-shadow-2xl: 0 25px 50px -12px #00000040;
  --okd-border-radius-none: 0;
  --okd-border-radius-sm: 2px;
  --okd-border-radius-md: 4px;
  --okd-border-radius-lg: 6px;
  --okd-border-radius-xl: 8px;
  --okd-border-radius-xxl: 10px;
  --okd-border-radius-xxxl: 12px;
  --okd-font-family: HarmonyOS Sans, SF Pro Text, SF Pro Icons, Arial,
    Helvetica Neue, Helvetica, sans-serif;
  --okd-text-display-lg-font-size: 56px;
  --okd-text-display-lg-font-weight: 500;
  --okd-text-display-lg-line-height: 1.32;
  --okd-text-display-md-font-size: 40px;
  --okd-text-display-md-font-weight: 500;
  --okd-text-display-md-line-height: 52px;
  --okd-text-display-sm-font-size: 40px;
  --okd-text-display-sm-font-weight: 500;
  --okd-text-display-sm-line-height: 52px;
  --okd-text-heading-lg-font-size: 30px;
  --okd-text-heading-lg-font-weight: 500;
  --okd-text-heading-lg-line-height: 40px;
  --okd-text-heading-md-font-size: 24px;
  --okd-text-heading-md-font-weight: 500;
  --okd-text-heading-md-line-height: 30px;
  --okd-text-heading-sm-font-size: 18px;
  --okd-text-heading-sm-font-weight: 500;
  --okd-text-heading-sm-line-height: 24px;
  --okd-text-heading-xl-font-size: 36px;
  --okd-text-heading-xl-line-height: 1.32;
  --okd-text-heading-xl-font-weight: 600;
  --okd-text-heading-xxl-font-size: 40px;
  --okd-text-heading-xxl-line-height: 1.32;
  --okd-text-heading-xxl-font-weight: 600;
  --okd-text-heading-overline-font-size: 12px;
  --okd-text-heading-overline-line-height: 15px;
  --okd-text-heading-overline-font-weight: 500;
  --okd-text-body-sm-regular-font-size: 14px;
  --okd-text-body-sm-regular-font-weight: 400;
  --okd-text-body-sm-regular-line-height: 21px;
  --okd-text-body-sm-bold-font-size: 14px;
  --okd-text-body-sm-bold-font-weight: 500;
  --okd-text-body-sm-bold-line-height: 21px;
  --okd-text-body-md-regular-font-size: 16px;
  --okd-text-body-md-regular-font-weight: 400;
  --okd-text-body-md-regular-line-height: 24px;
  --okd-text-body-md-bold-font-size: 16px;
  --okd-text-body-md-bold-font-weight: 500;
  --okd-text-body-md-bold-line-height: 24px;
  --okd-text-body-xs-regular-font-size: 12px;
  --okd-text-body-xs-regular-font-weight: 400;
  --okd-text-body-xs-regular-line-height: 18px;
  --okd-text-body-xs-bold-font-size: 12px;
  --okd-text-body-xs-bold-font-weight: 500;
  --okd-text-body-xs-bold-line-height: 18px;
  --okd-font-weight-400: 400;
  --okd-font-weight-500: 500;
  --okd-font-weight-600: 600;
  --okd-font-weight-700: 700;
  --okd-font-weight-800: 800;
  --okd-font-weight-900: 900;
  --okd-font-weight-regular: 400;
  --okd-font-weight-medium: 500;
  --okd-font-weight-bold: 700;
}
.okui-picture {
  display: inline-block;
  margin: 0px !important;
}
.okui-picture-font {
  font-size: 0;
  line-height: 1;
}
.okui-picture-cover {
  -o-object-fit: cover;
  object-fit: cover;
}
.okui-picture-contain {
  -o-object-fit: contain;
  object-fit: contain;
}
.register-section .home-register-phone {
  border: 1.5px solid #fff;
  border-radius: 5px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  height: 100%;
  line-height: 16px;
  padding: 14px 20px;
  width: 100%;
}
.keep-ltr {
  direction: ltr;
}
.keep-rtl {
  direction: rtl;
}
:root {
  --init-left: 375px;
}
html[dir="rtl"] :root {
  --init-left: -375px;
}
.ticker-container {
  --okx-scrollBar-width: 0px;
  -ms-flex-align: center;
  align-items: center;
  /* background: linear-gradient(100.72deg, #ff8a00, #d449f7); */
  background: linear-gradient(100.72deg, #8cfffb, #99f028);
  bottom: 0;
  display: -ms-flexbox;
  display: flex;
  height: 50px;
  white-space: nowrap;
  width: calc(100vw - var(--okx-scrollBar-width));
}
.ticker-container.hide-ticker {
  visibility: hidden;
}
@media (max-width: 767px) {
  .ticker-container {
    margin-left: -16px;
    position: absolute;
  }
}
@media (min-width: 768px) {
  .ticker-container {
    margin-left: -24px;
    position: sticky;
  }
}
@media (min-width: 1024px) {
  .ticker-container {
    margin-left: calc(468px - 50vw + var(--okx-scrollBar-width) / 2);
    position: sticky;
  }
}
@media (min-width: 1270px) {
  .ticker-container {
    margin-left: calc(612px - 50vw + var(--okx-scrollBar-width) / 2);
    position: sticky;
  }
}
@media (min-width: 1860px) {
  .ticker-container {
    margin-left: calc(852px - 50vw + var(--okx-scrollBar-width) / 2);
    position: sticky;
  }
}
.ticker-container .ticker-viewer {
  -ms-flex-align: center;
  align-items: center;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.ticker-container .ticker-viewer .animation-paused,
.ticker-container .ticker-viewer.ticker-not-view .ticker-scroll,
.ticker-container .ticker-viewer:hover .ticker-scroll {
  -webkit-animation-play-state: paused !important;
  animation-play-state: paused !important;
}
.ticker-container .ticker-viewer .ticker-scroll {
  -webkit-transition: all linear;
  transition: all linear;
  will-change: transform, opacity;
}
.ticker-container .ticker-viewer .ticker-scroll.first-animation {
  -webkit-animation: positionScrollFirst 8s linear forwards;
  animation: positionScrollFirst 8s linear forwards;
  opacity: 0;
  position: absolute;
}
.ticker-container .ticker-viewer .ticker-scroll.infinite-animation {
  -webkit-animation: tickerScroll 40s linear infinite normal;
  animation: tickerScroll 40s linear infinite normal;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
.ticker-container .ticker-viewer .ticker-scroll.delay-animation {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  opacity: 0;
}
.ticker-container .ticker-viewer .ticker-scroll.first-animation-overflow {
  -webkit-animation: positionScrollFirst 8s linear forwards;
  animation: positionScrollFirst 8s linear forwards;
  opacity: 0;
  position: absolute;
}
.ticker-container .ticker-viewer .ticker-scroll.infinite-animation-overflow {
  -webkit-animation: tickerScroll 80s linear infinite normal;
  animation: tickerScroll 80s linear infinite normal;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
.ticker-container .ticker-viewer .ticker-scroll.delay-animation-overflow {
  -webkit-animation-delay: 8s;
  animation-delay: 8s;
  opacity: 0;
}
.ticker-container .ticker-viewer .ticker-item {
  /* Change ticker color */
  -ms-flex-align: center;
  align-items: center;
  text-align: center !important;
  color: #000;
 height: 50px !important;
  cursor: pointer;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font-size: 20px;
  font-weight: 700;
  margin-left: 57px;
  -webkit-transition: all;
  transition: all;
}
.ticker-container .ticker-viewer .ticker-item span {
  margin-left: 10px;
}
.ticker-container .ticker-viewer .ticker-item span:first-child {
  margin-left: 0;
}
@-webkit-keyframes tickerScroll {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}
@keyframes tickerScroll {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}
@-webkit-keyframes positionScroll {
  0% {
    -webkit-transform: translateX(375px);
    transform: translateX(375px);
    -webkit-transform: translateX(var(--init-left));
    transform: translateX(var(--init-left));
  }
  to {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes positionScroll {
  0% {
    -webkit-transform: translateX(375px);
    transform: translateX(375px);
    -webkit-transform: translateX(var(--init-left));
    transform: translateX(var(--init-left));
  }
  to {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@-webkit-keyframes positionScrollFirst {
  0% {
    opacity: 1;
    -webkit-transform: translateX(375px);
    transform: translateX(375px);
    -webkit-transform: translateX(var(--init-left));
    transform: translateX(var(--init-left));
  }
  99.9999% {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes positionScrollFirst {
  0% {
    opacity: 1;
    -webkit-transform: translateX(375px);
    transform: translateX(375px);
    -webkit-transform: translateX(var(--init-left));
    transform: translateX(var(--init-left));
  }
  99.9999% {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.first-section {
  position: relative;
}
@media (max-width: 767px) {
  .first-section .first-content {
    padding-bottom: 105px;
  }
}
@media (min-width: 768px) {
  .first-section .first-content {
    padding-bottom: 72px;
  }
}
@media (min-width: 1024px) {
  .first-section .first-content {
    padding-bottom: 120px;
  }
}
.first-section .partner-bar {
  -ms-flex-pack: justify;
  -ms-flex-align: center;
  align-items: center;
  color: #fff;
  display: none;
  justify-content: space-between;
}
.first-section .partner-bar .partner-item img {
  width: 100%;
  
}
.first-section .guide-banner .common-title {
  text-align: left;
}
.first-section .guide-banner .title-desc {
  color: #6e6e6e;
  font-size: 24px;
  font-weight: 400;
  line-height: 24px;
  margin-top: 20px;
  text-align: left;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .first-section .guide-banner .title-desc {
    font-size: 18px;
  }
}
@media (max-width: 767px) {
  .first-section .guide-banner .title-desc {
    font-size: 18px;
  }
}
.first-section .guide-banner .deposit-guide .deposit-guide-button,
.first-section .guide-banner .kyc-guide .common-button,
.first-section .guide-banner .trade-guide .common-button {
  margin-top: 40px;
}
.first-section
  .guide-banner
  .deposit-guide
  .deposit-guide-button
  .common-button {
  margin-bottom: 20px;
}
.first-section
  .guide-banner
  .deposit-guide
  .deposit-guide-button
  .common-button:first-child {
  margin-right: 30px;
}
.first-section .first-container {
  position: relative;
}
.first-section .ticker-price-tip {
  color: #909090;
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
}
@media (max-width: 767px) {
  .first-section .ticker-price-tip {
    margin: 8px 29px 0;
  }
}
@media (min-width: 768px) {
  .first-section .ticker-price-tip {
    margin: 8px 21px 0;
  }
}
@media (min-width: 1024px) {
  .first-section .ticker-price-tip {
    margin: 8px calc(513px - 50vw) 0;
  }
}
@media (min-width: 1270px) {
  .first-section .ticker-price-tip {
    margin: 8px calc(657px - 50vw) 0;
  }
}
@media (min-width: 1860px) {
  .first-section .ticker-price-tip {
    margin: 8px calc(897px - 50vw) 0;
  }
  .first-section .banner-container {
    margin-left: 25%;
    width: 83.33333333%;
  }
  .first-section .banner-container .left-banner {
    width: 60%;
  }
  .first-section .banner-container .left-banner .common-title {
    font-size: 72px;
    font-weight: 700;
    line-height: 112%;
  }
  .first-section .banner-container .left-banner .register-box {
    margin-top: 60px;
  }
  .first-section .banner-container .left-banner .partner-bar {
    width: 85%;
  }
  .first-section
    .banner-container
    .left-banner
    .partner-bar
    .partner-item:first-child {
    width: 136px;
  }
  .first-section
    .banner-container
    .left-banner
    .partner-bar
    .partner-item:nth-child(2) {
    width: 200px;
  }
  .first-section
    .banner-container
    .left-banner
    .partner-bar
    .partner-item:nth-child(3) {
    width: 88px;
  }
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-left: 16%;
    padding-left: 8px;
    padding-right: 8px;
    width: 75%;
  }
}
@media (min-width: 1860px) and (min-width: 768px) {
  .first-section .banner-container {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1860px) and (min-width: 1024px) {
  .first-section .banner-container {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1860px) and (min-width: 1270px) {
  .first-section .banner-container {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1860px) and (min-width: 1860px) {
  .first-section .banner-container {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1860px) and (min-width: 2037px) {
  .first-section .banner-container {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1860px) and (min-width: 768px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1860px) and (min-width: 1024px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1860px) and (min-width: 1270px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1860px) and (min-width: 1860px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1860px) and (min-width: 2037px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
  .first-section .banner-container {
    display: -ms-flexbox;
    display: flex;
  }
  .first-section .banner-content {
    min-height: 300px;
  }
  .first-section .left-banner .common-title {
    font-weight: 700;
    line-height: 132%;
  }
  .first-section .left-banner .register-box {
    display: -ms-flexbox;
    display: flex;
    margin-top: 40px;
  }
  .first-section .left-banner .partner-bar {
    display: -ms-flexbox;
    display: flex;
    margin-top: 50px;
  }
  .first-section {
    margin-bottom: 120px;
    padding-top: 120px;
  }
  .first-section .banner-container {
    -ms-flex-align: center;
    align-items: center;
  }
  .first-section .left-banner .register-box {
    width: 100%;
  }
  .first-section .left-banner .register-box .register-section {
    width: 58%;
  }
  .first-section
    .left-banner
    .register-box
    .register-section
    .home-register-phone {
    width: 100%;
  }
  .first-section .left-banner .register-box .link-to-register {
    margin-left: 24px;
    max-width: 37%;
  }
  .first-section .left-banner .partner-bar {
    margin-top: 100px;
  }
  .first-section .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-left: 50%;
    padding-left: 8px;
    padding-right: 0;
    width: 75%;
  }
  .first-section .right-banner .image-bar {
    min-height: 585px;
  }
  .first-section .right-banner .image-bar .first-img {
    width: 100%;
  }
  .first-section .partner-bar {
    min-height: 68px;
    width: 100%;
  }
  .first-section .partner-bar .partner-item:first-child {
    width: 120px;
  }
  .first-section .partner-bar .partner-item:nth-child(2) {
    width: 164px;
  }
  .first-section .partner-bar .partner-item:nth-child(3) {
    width: 66px;
  }
}
@media (min-width: 1270px) and (min-width: 768px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (min-width: 1024px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (min-width: 1270px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (min-width: 1860px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (min-width: 2037px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) {
  .first-section .left-banner {
    margin-left: 25%;
    width: 40.66666667%;
  }
  .first-section .left-banner.guide-banner {
    width: 53.333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 768px) {
  .first-section .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1024px) {
  .first-section .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1270px) {
  .first-section .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1860px) {
  .first-section .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 2037px) {
  .first-section .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) {
  .first-section .left-banner .common-title {
    font-size: 55px;
    line-height: 64px;
  }
  .first-section .left-banner .register-box {
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}
@media (min-width: 1270px) and (min-width: 768px) {
  .first-section .right-banner {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 1024px) {
  .first-section .right-banner {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 1270px) {
  .first-section .right-banner {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 1860px) {
  .first-section .right-banner {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 2037px) {
  .first-section .right-banner {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 768px) {
  .first-section .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) and (min-width: 1024px) {
  .first-section .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) and (min-width: 1270px) {
  .first-section .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) and (min-width: 1860px) {
  .first-section .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) and (min-width: 2037px) {
  .first-section .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
  .first-section .banner-container {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
  }
  .first-section .banner-content {
    min-height: 300px;
  }
  .first-section .left-banner .common-title {
    font-weight: 700;
    line-height: 132%;
  }
  .first-section .left-banner .register-box {
    display: -ms-flexbox;
    display: flex;
    margin-top: 40px;
  }
  .first-section .left-banner .partner-bar {
    display: -ms-flexbox;
    display: flex;
    margin-top: 50px;
  }
  .first-section .right-banner .image-bar .first-img {
    width: 100%;
  }
  .first-section {
    padding-top: 120px;
  }
  .first-section .banner-container .left-banner {
    margin-left: 25%;
    width: 52.5%;
  }
  .first-section .banner-container .left-banner .common-title {
    font-size: 46px;
    line-height: 64px;
  }
  .first-section .banner-container .left-banner .register-box {
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .first-section
    .banner-container
    .left-banner
    .register-box
    .link-to-register {
    margin-top: 40px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
  .first-section .banner-container .left-banner .partner-bar {
    margin-top: 80px;
  }
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-left: 25%;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
  .first-section .banner-container .right-banner .image-bar {
    min-height: 580px;
  }
  .first-section .banner-container .partner-bar {
    min-height: 77px;
    width: 90%;
  }
  .first-section .banner-container .partner-bar .partner-item:first-child,
  .first-section .banner-container .partner-bar .partner-item:nth-child(2) {
    width: 30%;
  }
  .first-section .banner-container .partner-bar .partner-item:nth-child(3) {
    width: 15%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .first-section
    .banner-container
    .left-banner
    .register-box
    .home-register-phone {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .first-section
    .banner-container
    .left-banner
    .register-box
    .home-register-phone {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .first-section
    .banner-container
    .left-banner
    .register-box
    .home-register-phone {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .first-section
    .banner-container
    .left-banner
    .register-box
    .home-register-phone {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .first-section
    .banner-container
    .left-banner
    .register-box
    .home-register-phone {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .first-section .banner-container .right-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
  .first-section .banner-container {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
  }
  .first-section .banner-content {
    min-height: 300px;
  }
  .first-section .left-banner .common-title {
    font-weight: 700;
    line-height: 132%;
  }
  .first-section .left-banner .register-box {
    display: -ms-flexbox;
    display: flex;
    margin-top: 40px;
  }
  .first-section .left-banner .partner-bar {
    display: -ms-flexbox;
    display: flex;
    margin-top: 50px;
  }
  .first-section .right-banner .image-bar .first-img {
    width: 100%;
  }
  .first-section {
    padding-top: 80px;
  }
  .first-section .banner-container .left-banner {
    margin-left: 25%;
    margin-top: 30px;
  }
  .first-section
    .banner-container
    .left-banner.guide-banner
    .deposit-guide
    .deposit-guide-button
    .common-button {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    padding: 12px 16px;
  }
  .first-section
    .banner-container
    .left-banner.guide-banner
    .deposit-guide
    .deposit-guide-button
    .common-button:first-child {
    margin-right: 20px;
  }
  .first-section .banner-container .left-banner .common-title {
    font-size: 40px;
  }
  .first-section
    .banner-container
    .left-banner
    .register-box
    .register-section
    .home-register-phone {
    font-size: 14px;
    font-weight: 500;
    padding: 14px 20px;
  }
  .first-section .banner-container .left-banner .common-button {
    font-size: 16px;
    font-weight: 500;
    min-width: 150px;
    padding: 18px 16px;
  }
  .first-section .banner-container .left-banner .register-box {
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .first-section
    .banner-container
    .left-banner
    .register-box
    .register-section {
    width: 75%;
  }
  .first-section
    .banner-container
    .left-banner
    .register-box
    .link-to-register {
    margin-top: 40px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
  .first-section .banner-container .left-banner .partner-bar {
    display: none;
  }
  .first-section .banner-container .right-banner {
    margin-left: 25%;
  }
  .first-section .banner-container .right-banner .image-bar {
    min-height: 415px;
  }
  .first-section .banner-container .right-banner .image-bar .first-img {
    width: 200px;
  }

  .first-section .partner-bar {
    display: -ms-flexbox;
    display: flex;
    margin-top: 70px;
    min-height: 86px;
   
  }
  .first-section .partner-bar .partner-item:first-child {
    width: 140px;
  }
  .first-section .partner-bar .partner-item:nth-child(2) {
    width: 170px;
  }
  .first-section .partner-bar .partner-item:nth-child(3) {
    width: 84px;
  }
  .first-section .mobile-footer-bar {
    margin: auto;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .first-section .banner-container .left-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .first-section .banner-container .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 50%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .first-section .banner-container .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 50%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .first-section .banner-container .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 50%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .first-section .banner-container .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 50%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .first-section .banner-container .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 50%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .first-section .banner-container .right-banner {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .first-section .mobile-footer-bar {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .first-section .mobile-footer-bar {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .first-section .mobile-footer-bar {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .first-section .mobile-footer-bar {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .first-section .mobile-footer-bar {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (max-width: 767px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
  .first-section .banner-container {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
  }
  .first-section .banner-content {
    min-height: 300px;
  }
  .first-section .left-banner .common-title {
    font-weight: 700;
    line-height: 132%;
  }
  .first-section .left-banner .register-box {
    display: -ms-flexbox;
    display: flex;
    margin-top: 40px;
  }
  .first-section .left-banner .partner-bar {
    display: -ms-flexbox;
    display: flex;
    margin-top: 50px;
  }
  .first-section .right-banner .image-bar .first-img {
    width: 100%;
  }
  .first-section {
    padding-top: 80px;
  }
  .first-section .banner-container {
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .first-section .banner-content {
    min-height: 217px;
  }
  .first-section .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
  .first-section .left-banner.guide-banner .title-desc {
    margin-top: 16px;
    text-align: center;
  }
  .first-section .left-banner.guide-banner .kyc-guide .common-button,
  .first-section .left-banner.guide-banner .trade-guide .common-button {
    display: block;
    margin: 32px auto 0;
  }
  .first-section
    .left-banner.guide-banner
    .deposit-guide
    .deposit-guide-button {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 40px auto 0;
    max-width: 360px;
    text-align: center;
  }
  .first-section
    .left-banner.guide-banner
    .deposit-guide
    .deposit-guide-button
    .common-button {
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    padding: 12px 18px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
  .first-section
    .left-banner.guide-banner
    .deposit-guide
    .deposit-guide-button
    .common-button:first-child {
    margin-right: 0;
  }
  .first-section
    .left-banner.guide-banner
    .deposit-guide
    .deposit-guide-button
    .common-button:last-child {
    margin-bottom: 0;
  }
  .first-section .left-banner .common-title {
    font-size: 32px;
    margin: auto;
    max-width: 500px;
    text-align: center;
  }
  .first-section .left-banner .register-box {
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .first-section .left-banner .register-box .register-section {
    margin: 0 auto;
    max-width: 360px;
    width: 100%;
  }
  .first-section .left-banner .register-box .link-to-register {
    display: block;
    margin: 40px auto 0;
  }
  .first-section
    .left-banner
    .register-box
    .register-section
    .home-register-phone {
    font-size: 14px;
    font-weight: 500;
    padding: 14px 20px;
  }
  .first-section .left-banner .common-button {
    font-size: 16px;
    font-weight: 500;
    min-width: 150px;
    padding: 18px 16px;
  }
  .first-section .left-banner .partner-bar {
    display: none;
  }
  .first-section .right-banner {
    margin-top: 40px;
  }
  .first-section .right-banner.deposit-banner {
    margin-top: 20px;
  }
  .first-section .right-banner .image-bar {
    min-height: 511px;
    text-align: center;
  }
  .first-section .right-banner .image-bar .first-img {
    width: 246px;
  }
  .first-section .partner-bar {
    -ms-flex-align: center;
    -ms-flex-pack: distribute;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-around;
    margin-top: 40px;
    min-height: 98px;
  }
  .first-section .partner-bar .partner-item:first-child {
    width: 25%;
  }
  .first-section .partner-bar .partner-item:nth-child(2) {
    width: 30%;
  }
  .first-section .partner-bar .partner-item:nth-child(3) {
    width: 15%;
  }
}
@media (max-width: 767px) and (min-width: 768px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 1024px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 1270px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 1860px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 2037px) {
  .first-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 768px) {
  .first-section .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 1024px) {
  .first-section .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 1270px) {
  .first-section .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 1860px) {
  .first-section .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 2037px) {
  .first-section .left-banner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
.pannel-section {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 8px;
  padding-right: 8px;
  width: 100%;
}
@media (min-width: 768px) {
  .pannel-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) {
  .pannel-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) {
  .pannel-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1860px) {
  .pannel-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 2037px) {
  .pannel-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
.pannel-section .pannel-text {
  text-align: center;
}
.pannel-section .pannel-text .common-desc {
  margin-top: 20px;
}
.pannel-section .pannel-body {
  margin-top: 80px;
}
.pannel-section .pannel-body .pannel-img {
  width: 100%;
}
@media (min-width: 1860px) {
  .pannel-section .pannel-body {
    margin-left: 6%;
    width: 88%;
  }
}
@media (min-width: 1270px) {
  .pannel-section .pannel-body {
    margin: 80px auto 0;
    min-height: 574px;
    width: 83.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) {
  .pannel-section {
    padding-bottom: 190px;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) {
  .pannel-section {
    padding-bottom: 120px;
    padding-top: 120px;
  }
  .pannel-section .pannel-body {
    margin: 80px auto 0;
    min-height: 440px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .pannel-section {
    padding-bottom: 80px;
    padding-top: 80px;
  }
  .pannel-section .common-desc {
    font-size: 18px;
  }
  .pannel-section .pannel-body {
    margin: 40px auto 0;
    min-height: 42vw;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .pannel-section .pannel-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .pannel-section .pannel-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .pannel-section .pannel-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .pannel-section .pannel-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .pannel-section .pannel-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (max-width: 767px) {
  .pannel-section {
    padding-bottom: 80px;
    padding-top: 60px;
  }
  .pannel-section .pannel-body {
    margin-top: 40px;
    min-height: 53vw;
  }
  .pannel-section .common-desc {
    font-size: 16px;
    line-height: 158%;
  }
}
@media (min-width: 1860px) {
  .home-page-container .pannel-section {
    padding-bottom: 120px;
  }
  .home-page-container .pannel-section .common-desc {
    font-size: 24px;
  }
}
@media (max-width: 767px) {
  .home-page-container .second-section {
    contain-intrinsic-size: auto 471px;
  }
}
@media (min-width: 768px) {
  .home-page-container .second-section {
    contain-intrinsic-size: auto 619px;
  }
}
@media (min-width: 1024px) {
  .home-page-container .second-section {
    contain-intrinsic-size: auto 952px;
  }
}
@media (min-width: 1270px) {
  .home-page-container .second-section {
    contain-intrinsic-size: auto 1067px;
  }
}
@media (min-width: 1860px) {
  .home-page-container .second-section {
    contain-intrinsic-size: auto 1134px;
  }
}
.home-page-container .second-section .second-img {
  width: 100%;
}
.home-page-container .third-section {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 8px;
  padding-right: 8px;
  width: 100%;
}
@media (min-width: 768px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1860px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 2037px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) {
  .home-page-container .third-section {
    contain-intrinsic-size: auto 620px;
  }
}
@media (min-width: 768px) {
  .home-page-container .third-section {
    contain-intrinsic-size: auto 852px;
  }
}
@media (min-width: 1024px) {
  .home-page-container .third-section {
    contain-intrinsic-size: auto 737px;
  }
}
@media (min-width: 1270px) {
  .home-page-container .third-section {
    contain-intrinsic-size: auto 817px;
  }
}
@media (min-width: 1860px) {
  .home-page-container .third-section {
    contain-intrinsic-size: auto 893px;
  }
}
.home-page-container .third-section .third-title {
  text-align: center;
}
.home-page-container .third-section .third-title .common-desc {
  margin-top: 20px;
}
.home-page-container .third-section .third-animation,
.home-page-container .third-section .third-animation .third-pc-animation {
  width: 100%;
}
.home-page-container .third-section .third-animation .third-mobile-animation {
  
  margin: auto;
}
@media (min-width: 768px) {
  .home-page-container .third-section .third-animation .third-mobile-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 1024px) {
  .home-page-container .third-section .third-animation .third-mobile-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 1270px) {
  .home-page-container .third-section .third-animation .third-mobile-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 1860px) {
  .home-page-container .third-section .third-animation .third-mobile-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 2037px) {
  .home-page-container .third-section .third-animation .third-mobile-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 1860px) {
  .home-page-container .third-section {
    margin: auto;
    width: 83.33333%;
  }
  .home-page-container .third-section .common-desc {
    font-size: 24px;
  }
}
@media (min-width: 1270px) {
  .home-page-container .third-section {
    padding-bottom: 120px;
    padding-top: 120px;
  }
  .home-page-container .third-section .third-animation {
    margin-top: 100px;
    min-height: 328px;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) {
  .home-page-container .third-section {
    padding-bottom: 120px;
    padding-top: 120px;
  }
  .home-page-container .third-section .third-title .common-desc {
    line-height: 32px;
  }
  .home-page-container .third-section .third-animation {
    margin-top: 100px;
    min-height: 252px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .home-page-container .third-section {
    margin: 0 auto;
    padding-bottom: 80px;
    padding-top: 80px;
  }
  .home-page-container .third-section .common-desc {
    font-size: 18px;
  }
  .home-page-container .third-section .third-animation {
    margin-top: 80px;
    min-height: 60vw;
  }
  .home-page-container .third-section .third-animation .third-pc-animation {
    display: block;
    /* changed from none */
  }
  .home-page-container .third-section .third-animation .third-mobile-animation {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .home-page-container .third-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (max-width: 767px) {
  .home-page-container .third-section {
    padding-bottom: 80px;
    padding-top: 80px;
  }
  .home-page-container .third-section .common-desc {
    font-size: 16px;
    line-height: 158%;
  }
  .home-page-container .third-section .third-animation {
    margin: 72px auto 0;
    min-height: 75vw;
    width: 80%;
  }
  .home-page-container .third-section .third-animation .third-pc-animation {
    display: block;
    /* changed from none */
  }
  .home-page-container .third-section .third-animation .third-mobile-animation {
    display: block;
  }
}
.home-page-container .fourth-section {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 8px;
  padding-right: 8px;
  width: 100%;
}
@media (min-width: 768px) {
  .home-page-container .fourth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) {
  .home-page-container .fourth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) {
  .home-page-container .fourth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1860px) {
  .home-page-container .fourth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 2037px) {
  .home-page-container .fourth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) {
  .home-page-container .fourth-section {
    contain-intrinsic-size: auto 989px;
  }
}
@media (min-width: 768px) {
  .home-page-container .fourth-section {
    contain-intrinsic-size: auto 1005px;
  }
}
@media (min-width: 1024px) {
  .home-page-container .fourth-section {
    contain-intrinsic-size: auto 776px;
  }
}
@media (min-width: 1270px) {
  .home-page-container .fourth-section {
    contain-intrinsic-size: auto 843px;
  }
}
@media (min-width: 1860px) {
  .home-page-container .fourth-section {
    contain-intrinsic-size: auto 932px;
  }
}
.home-page-container .fourth-section .fourth-container,
.home-page-container .fourth-section .fourth-container .fourth-animation {
  -ms-flex-align: center;
  align-items: center;
  display: -ms-flexbox;
  display: flex;
}
.home-page-container
  .fourth-section
  .fourth-container
  .fourth-animation
  .fourth-animation-img {
  width: 100%;
}
.home-page-container .fourth-section .fourth-container .fourth-body {
  padding-right: 0;
}
.home-page-container
  .fourth-section
  .fourth-container
  .fourth-body
  .tab-container {
  border: 1px solid #fff;
  border-radius: 100px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -ms-flexbox;
  display: flex;
  margin: 28px 0 32px;
  min-width: 79%;
  padding: 4px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.home-page-container
  .fourth-section
  .fourth-container
  .fourth-body
  .tab-container
  .tab-item {
  -ms-flex-align: center;
  -ms-flex-pack: center;
  align-items: center;
  border-radius: 100px;
  color: #fff;
  cursor: pointer;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 1;
  flex: 1 1;
  font-size: 20px;
  font-weight: 500;
  justify-content: center;
  line-height: 16px;
  padding: 20px 12px;
  text-align: center;
  white-space: nowrap;
}
.home-page-container
  .fourth-section
  .fourth-container
  .fourth-body
  .tab-container
  .tab-item.active {
  background: #fff;
  color: #000;
}
@media (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 50%;
    padding-left: 2%;
    width: 19%;
  }
  .home-page-container .fourth-section .common-desc {
    font-size: 24px;
  }
}
@media (min-width: 1860px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1860px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1860px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1860px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1860px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) {
  .home-page-container .fourth-section {
    padding-bottom: 120px;
    padding-top: 120px;
  }
  .home-page-container .fourth-section .fourth-animation {
    min-height: 484px;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-left: 50%;
    padding-left: 8px;
    padding-right: 8px;
    width: 75%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 25%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 16.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 12%;
  }
}
@media (min-width: 1270px) and (min-width: 1860px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 1860px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 1860px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 1860px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (min-width: 1860px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 25%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) {
  .home-page-container .fourth-section {
    padding-bottom: 120px;
    padding-top: 80px;
  }
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-left: 25%;
    min-height: 34vw;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
  .home-page-container .fourth-section .fourth-body {
    margin-left: 25%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-animation {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-animation {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-body {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .home-page-container .fourth-section {
    padding-bottom: 80px;
    padding-top: 60px;
  }
  .home-page-container .fourth-section .fourth-container {
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
  }
  .home-page-container .fourth-section .fourth-container .fourth-body {
    margin: 0 auto;
  }
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .common-title {
    margin: 0 auto;
    text-align: center;
  }
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .common-desc {
    font-size: 18px;
    line-height: 168%;
    min-height: 98px;
    text-align: center;
  }
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .tab-container {
    margin: 28px auto 32px;
    min-width: 400px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
  .home-page-container .fourth-section .fourth-container .fourth-animation {
    margin: 20px auto 0;
    min-height: 346px;
    width: 246px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .home-page-container .fourth-section .fourth-container .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .home-page-container .fourth-section .fourth-container .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .home-page-container .fourth-section .fourth-container .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .home-page-container .fourth-section .fourth-container .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .home-page-container .fourth-section .fourth-container .fourth-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .common-title {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .common-title {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .common-title {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .common-title {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .common-title {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}
@media (max-width: 767px) {
  .home-page-container .fourth-section {
    padding-bottom: 86px;
    padding-top: 20px;
  }
  .home-page-container .fourth-section .fourth-container {
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
  }
  .home-page-container .fourth-section .fourth-container .fourth-body {
    margin-top: 0;
    width: 100%;
  }
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .common-title {
    text-align: center;
  }
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .common-desc {
    font-size: 16px;
    line-height: 158%;
    text-align: center;
  }
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .tab-container {
    margin: 28px auto 32px;
    max-width: 343px;
    width: 100%;
  }
  .home-page-container
    .fourth-section
    .fourth-container
    .fourth-body
    .tab-container
    .tab-item {
    line-height: 20px;
    padding: 12px;
  }
  .home-page-container .fourth-section .fourth-container .fourth-animation {
    margin: 60px auto 0;
    min-height: 346px;
    text-align: center;
    width: 246px;
  }
}
.video-section {
  -ms-flex-align: center;
  -ms-flex-pack: justify;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
  padding-left: 8px;
  padding-right: 8px;
  width: 100%;
}
@media (min-width: 768px) {
  .video-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) {
  .video-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) {
  .video-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1860px) {
  .video-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 2037px) {
  .video-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
.video-section .video-item {
  position: relative;
  width: 32%;
}
.video-section .video-item .video-content {
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%;
}
.video-section .video-item .video-text {
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(transparent),
    color-stop(114.09%, #000),
    color-stop(114.09%, rgba(0, 0, 0, 0.8))
  );
  background: linear-gradient(
    0deg,
    transparent,
    #000 114.09%,
    rgba(0, 0, 0, 0.8) 0
  );
  left: 0;
  padding: 28px;
  position: absolute;
  right: 0;
  text-align: right;
  top: 0;
}
.video-section .video-item .video-text .video-title {
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  line-height: 32px;
}
.video-section .video-item .video-text .video-desc {
  color: hsla(0, 0%, 100%, 0.8);
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  margin-top: 8px;
}
@media (min-width: 1860px) {
  .video-section {
    margin-top: 120px;
  }
}
@media (min-width: 1270px) {
  .video-section .video-item {
    min-height: 390px;
  }
  .video-section .video-item:last-child {
    margin-right: 0;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) {
  .video-section .text-banner {
    max-width: 50%;
  }
  .video-section .video-item {
    min-height: 300px;
  }
  .video-section .video-item:last-child {
    margin-right: 0;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .video-section {
    text-align: center;
  }
  .video-section .video-item {
    min-height: 26vw;
    padding: 16px;
  }
  .video-section .video-item .video-text .video-title {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
  }
  .video-section .video-item .video-text .video-desc {
    color: hsla(0, 0%, 100%, 0.8);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    margin-top: 6px;
  }
  .video-section .video-item:last-child {
    margin-right: 0;
  }
}
@media (max-width: 767px) {
  .video-section {
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .video-section .video-item {
    margin-top: 20px;
    min-height: 80vw;
    padding: 0;
    width: 100%;
  }
  .video-section .video-item:last-child {
    margin-right: 0;
  }
}
.home-page-container .fifth-section {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 8px;
  padding-right: 8px;
  width: 100%;
}
@media (min-width: 768px) {
  .home-page-container .fifth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) {
  .home-page-container .fifth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) {
  .home-page-container .fifth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1860px) {
  .home-page-container .fifth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 2037px) {
  .home-page-container .fifth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) {
  .home-page-container .fifth-section {
    contain-intrinsic-size: auto 1704px;
  }
}
@media (min-width: 768px) {
  .home-page-container .fifth-section {
    contain-intrinsic-size: auto 991px;
  }
}
@media (min-width: 1024px) {
  .home-page-container .fifth-section {
    contain-intrinsic-size: auto 941px;
  }
}
@media (min-width: 1270px) {
  .home-page-container .fifth-section {
    contain-intrinsic-size: auto 1039px;
  }
}
@media (min-width: 1860px) {
  .home-page-container .fifth-section {
    contain-intrinsic-size: auto 1331px;
  }
}
.home-page-container .fifth-section .fifth-banner {
  -ms-flex-pack: justify;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
}
.home-page-container .fifth-section .fifth-banner .text-banner .common-desc {
  margin-top: 20px;
}
.home-page-container .fifth-section .fifth-banner .text-banner .common-button {
  cursor: pointer;
  display: inline-block;
  margin-top: 48px;
}
.home-page-container .fifth-section .fifth-banner .logo-banner .logo-img {
  height: auto;
  width: 100%;
}
.home-page-container .fifth-section .video-banner {
  -ms-flex-align: center;
  -ms-flex-pack: justify;
  align-items: center;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  margin-top: 80px;
}
.home-page-container .fifth-section .video-banner .video-item {
  position: relative;
  width: 32%;
}
.home-page-container .fifth-section .video-banner .video-item .video-content {
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%;
}
.home-page-container .fifth-section .video-banner .video-item .video-text {
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(transparent),
    color-stop(114.09%, #000),
    color-stop(114.09%, rgba(0, 0, 0, 0.8))
  );
  background: linear-gradient(
    0deg,
    transparent,
    #000 114.09%,
    rgba(0, 0, 0, 0.8) 0
  );
  left: 0;
  padding: 28px;
  position: absolute;
  right: 0;
  text-align: right;
  top: 0;
}
.home-page-container
  .fifth-section
  .video-banner
  .video-item
  .video-text
  .video-title {
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  line-height: 32px;
}
.home-page-container
  .fifth-section
  .video-banner
  .video-item
  .video-text
  .video-desc {
  color: hsla(0, 0%, 100%, 0.8);
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  margin-top: 8px;
}
@media (min-width: 1860px) {
  .home-page-container .fifth-section {
    margin-left: 25%;
    padding-bottom: 220px;
    padding-top: 120px;
    width: 83.333333%;
  }
  .home-page-container .fifth-section .fifth-banner .common-desc {
    font-size: 24px;
  }
  .home-page-container .fifth-section .fifth-banner .logo-banner {
    width: 35%;
  }
  .home-page-container .fifth-section .video-banner {
    margin-top: 120px;
  }
}
@media (min-width: 1860px) and (min-width: 768px) {
  .home-page-container .fifth-section {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1860px) and (min-width: 1024px) {
  .home-page-container .fifth-section {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1860px) and (min-width: 1270px) {
  .home-page-container .fifth-section {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1860px) and (min-width: 1860px) {
  .home-page-container .fifth-section {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1860px) and (min-width: 2037px) {
  .home-page-container .fifth-section {
    margin-left: 8.33333333%;
  }
}
@media (min-width: 1270px) {
  .home-page-container .fifth-section .fifth-banner {
    -ms-flex-align: end;
    align-items: end;
    margin-top: 98px;
  }
  .home-page-container .fifth-section .fifth-banner .text-banner {
    max-width: 50%;
    padding-bottom: 50px;
  }
  .home-page-container .fifth-section .fifth-banner .logo-banner {
    min-height: 145px;
  }
  .home-page-container .fifth-section .video-banner .video-item {
    min-height: 390px;
  }
  .home-page-container .fifth-section .video-banner .video-item:last-child {
    margin-right: 0;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) {
  .home-page-container .fifth-section {
    padding-bottom: 120px;
    padding-top: 80px;
  }
  .home-page-container .fifth-section .fifth-banner .logo-banner {
    width: 40%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) {
  .home-page-container .fifth-section {
    padding-bottom: 120px;
    padding-top: 80px;
  }
  .home-page-container .fifth-section .text-banner {
    max-width: 50%;
  }
  .home-page-container .fifth-section .fifth-banner {
    -ms-flex-align: end;
    align-items: end;
    margin-top: 98px;
  }
  .home-page-container .fifth-section .fifth-banner .text-banner {
    padding-bottom: 50px;
  }
  .home-page-container .fifth-section .fifth-banner .logo-banner {
    min-height: 112px;
    width: 40%;
  }
  .home-page-container .fifth-section .video-banner .video-item {
    min-height: 300px;
  }
  .home-page-container .fifth-section .video-banner .video-item:last-child {
    margin-right: 0;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .home-page-container .fifth-section {
    padding-bottom: 120px;
    padding-top: 80px;
  }
  .home-page-container .fifth-section .fifth-banner {
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .home-page-container .fifth-section .fifth-banner .text-banner {
    text-align: center;
  }
  .home-page-container .fifth-section .fifth-banner .text-banner .common-desc {
    font-size: 18px;
    margin: 12px auto 0;
  }
  .home-page-container
    .fifth-section
    .fifth-banner
    .text-banner
    .common-button {
    margin-top: 60px;
  }
  .home-page-container .fifth-section .fifth-banner .logo-banner {
    margin: 120px auto 0;
    width: 471px;
  }
  .home-page-container .fifth-section .fifth-banner .logo-banner .logo-img {
    min-height: 140px;
  }
  .home-page-container .fifth-section .video-banner {
    text-align: center;
  }
  .home-page-container .fifth-section .video-banner .video-item {
    min-height: 26vw;
    padding: 16px;
  }
  .home-page-container
    .fifth-section
    .video-banner
    .video-item
    .video-text
    .video-title {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
  }
  .home-page-container
    .fifth-section
    .video-banner
    .video-item
    .video-text
    .video-desc {
    color: hsla(0, 0%, 100%, 0.8);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    margin-top: 6px;
  }
  .home-page-container .fifth-section .video-banner .video-item:last-child {
    margin-right: 0;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .home-page-container .fifth-section .fifth-banner .text-banner .common-desc {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .home-page-container .fifth-section .fifth-banner .text-banner .common-desc {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .home-page-container .fifth-section .fifth-banner .text-banner .common-desc {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .home-page-container .fifth-section .fifth-banner .text-banner .common-desc {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .home-page-container .fifth-section .fifth-banner .text-banner .common-desc {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (max-width: 767px) {
  .home-page-container .fifth-section {
    padding-bottom: 80px;
    padding-top: 80px;
  }
  .home-page-container .fifth-section .fifth-banner {
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .home-page-container .fifth-section .fifth-banner .text-banner {
    text-align: center;
  }
  .home-page-container .fifth-section .fifth-banner .logo-banner {
    margin: 100px auto 0;
    min-height: 100px;
    width: 343px;
  }
  .home-page-container .fifth-section .fifth-banner .common-desc {
    font-size: 16px;
    line-height: 158%;
  }
  .home-page-container .fifth-section .video-banner {
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 40px;
  }
  .home-page-container .fifth-section .video-banner .video-item {
    margin-top: 20px;
    min-height: 80vw;
    padding: 0;
    width: 100%;
  }
  .home-page-container .fifth-section .video-banner .video-item:last-child {
    margin-right: 0;
  }
}
.okx-homepages-play:before {
  content: "\e000";
  font-family: fa-e41a06a168;
}
.okx-homepages-expand:before {
  content: "\e001";
  font-family: fa-e41a06a168;
}
.okx-homepages-put-away:before {
  content: "\e002";
  font-family: fa-e41a06a168;
}
.okx-homepages-pause:before {
  content: "\e003";
  font-family: fa-e41a06a168;
}
.okx-homepages-arrow-pointer:before {
  content: "\e004";
  font-family: fa-e41a06a168;
}
.okx-homepages-buy-crypto:before {
  content: "\e005";
  font-family: fa-e41a06a168;
}
.okx-homepages-camera-flip:before {
  content: "\e006";
  font-family: fa-e41a06a168;
}
.okx-homepages-chevrons-right:before {
  content: "\e007";
  font-family: fa-e41a06a168;
}
.okx-homepages-chevrons:before {
  content: "\e008";
  font-family: fa-e41a06a168;
}
.okx-homepages-close:before {
  content: "\e009";
  font-family: fa-e41a06a168;
}
.okx-homepages-complete:before {
  content: "\e00a";
  font-family: fa-e41a06a168;
}
.okx-homepages-copy:before {
  content: "\e00b";
  font-family: fa-e41a06a168;
}
.okx-homepages-deposit:before {
  content: "\e00c";
  font-family: fa-e41a06a168;
}
.okx-homepages-arrow-chevrons-top:before {
  content: "\e00d";
  font-family: fa-e41a06a168;
}
.okx-homepages-edit:before {
  content: "\e00e";
  font-family: fa-e41a06a168;
}
.okx-homepages-eye-hide-filled:before {
  content: "\e00f";
  font-family: fa-e41a06a168;
}
.okx-homepages-eye-show-filled:before {
  content: "\e010";
  font-family: fa-e41a06a168;
}
.okx-homepages-faceid:before {
  content: "\e011";
  font-family: fa-e41a06a168;
}
.okx-homepages-history:before {
  content: "\e012";
  font-family: fa-e41a06a168;
}
.okx-homepages-insurance-fund:before {
  content: "\e013";
  font-family: fa-e41a06a168;
}
.okx-homepages-lv1:before {
  content: "\e014";
  font-family: fa-e41a06a168;
}
.okx-homepages-lv2:before {
  content: "\e015";
  font-family: fa-e41a06a168;
}
.okx-homepages-mail:before {
  content: "\e016";
  font-family: fa-e41a06a168;
}
.okx-homepages-mobile:before {
  content: "\e017";
  font-family: fa-e41a06a168;
}
.okx-homepages-more:before {
  content: "\e018";
  font-family: fa-e41a06a168;
}
.okx-homepages-drawer:before {
  content: "\e019";
  font-family: fa-e41a06a168;
}
.okx-homepages-google:before {
  content: "\e01a";
  font-family: fa-e41a06a168;
}
.okx-homepages-rule:before {
  content: "\e01b";
  font-family: fa-e41a06a168;
}
.okx-homepages-tr-download-android:before {
  content: "\e01f";
  font-family: fa-e41a06a168;
}
.okx-homepages-tr-download-ios:before {
  content: "\e020";
  font-family: fa-e41a06a168;
}
.okx-homepages-tr-download-qrcode:before {
  content: "\e021";
  font-family: fa-e41a06a168;
}
.iconfont {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-style: normal;
}
.iconfont:before {
  display: inline-block;
}
@font-face {
  font-display: block;
  font-family: fa-e41a06a168;
  font-style: normal;
  src: url(../assets/fonts/5874ea862f143a115ba1.woff2) format("woff2");
}
[dir="rtl"] .okx-homepages-arrow-pointer:before,
[dir="rtl"] .okx-homepages-chevrons-right:before,
[dir="rtl"] .okx-homepages-chevrons:before {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
}
.faq-section .common-title.faq-title {
  text-align: center;
}
.faq-section .question-list .question-item {
  border-bottom: 1px solid #fff;
  color: #fff;
}
.faq-section .question-list .question-item .question-title {
  -ms-flex-pack: justify;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
}
.faq-section .question-list .question-item .question-title .title-item {
  max-width: 80%;
}
.faq-section .question-list .question-item .answer-title {
  font-weight: 700;
  margin-bottom: -20px;
  margin-top: 36px;
}
.faq-section .question-list .question-item .answer-title:first-child {
  margin-top: 0;
}
.faq-section .question-list .question-item .answer-content {
  margin-top: 20px;
}
.faq-section .question-list .question-item .answer-content:first-child {
  margin-top: 0;
}
.faq-section .question-list .question-item .answer-text {
  color: #bdbdbd;
  margin-top: 20px;
}
.faq-section .question-list .question-item .answer-text .faq-link {
  color: #fff;
  cursor: pointer;
  text-decoration: underline;
}
.faq-section .question-list .question-item .answer-text .list-symbol {
  background-color: #bdbdbd;
  border-radius: 50%;
  display: inline-block;
  height: 5px;
  margin-right: 13px;
  width: 5px;
}
.faq-section .question-list .question-item .answer-text .list-content {
  display: inline-block;
  max-width: calc(100% - 18px);
  vertical-align: top;
}
@media (min-width: 1270px) {
  .faq-section .question-list {
    margin-top: 90px;
  }
  .faq-section .question-list .question-item {
    margin-top: 40px;
    padding-bottom: 40px;
  }
  .faq-section .question-list .question-item .title-item {
    font-size: 28px;
    font-weight: 500;
    line-height: normal;
  }
  .faq-section .question-list .question-item .answer-text {
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.1px;
    line-height: 40px;
  }
  .faq-section .question-list .question-item .question-icon {
    font-size: 56px;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) {
  .faq-section {
    margin: 0 auto;
  }
  .faq-section .question-list {
    margin-top: 87px;
  }
  .faq-section .question-list .question-item {
    margin-top: 40px;
    padding-bottom: 40px;
  }
  .faq-section .question-list .question-item .title-item {
    font-size: 28px;
    font-weight: 500;
    line-height: normal;
  }
  .faq-section .question-list .question-item .answer-text {
    font-size: 18px;
    font-weight: 400;
    line-height: 168%;
  }
  .faq-section .question-list .question-item .question-icon {
    font-size: 48px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .faq-section {
    margin: 0 auto;
  }
  .faq-section .question-list {
    margin-top: 64px;
  }
  .faq-section .question-list .question-item {
    margin-top: 32px;
    padding-bottom: 32px;
  }
  .faq-section .question-list .question-item .title-item {
    font-size: 22px;
    font-weight: 500;
    line-height: 132%;
  }
  .faq-section .question-list .question-item .answer-text {
    font-size: 18px;
    font-weight: 400;
    line-height: 168%;
  }
  .faq-section .question-list .question-item .question-icon {
    font-size: 40px;
  }
}
@media (max-width: 767px) {
  .faq-section .question-list {
    margin-top: 60px;
  }
  .faq-section .question-list .question-item {
    margin-top: 32px;
    padding-bottom: 32px;
  }
  .faq-section .question-list .question-item .title-item {
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
  }
  .faq-section .question-list .question-item .answer-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 168%;
  }
  .faq-section .question-list .question-item .question-icon {
    font-size: 28px;
  }
  .faq-section .question-list .question-item .question-title {
    font-size: 16px;
  }
  .home-page-container .sixth-section {
    contain-intrinsic-size: auto 837px;
  }
}
@media (min-width: 768px) {
  .home-page-container .sixth-section {
    contain-intrinsic-size: auto 934px;
  }
}
@media (min-width: 1024px) {
  .home-page-container .sixth-section {
    contain-intrinsic-size: auto 1133px;
  }
}
@media (min-width: 1270px) {
  .home-page-container .sixth-section {
    contain-intrinsic-size: auto 1171px;
  }
}
@media (min-width: 1860px) {
  .home-page-container .sixth-section {
    contain-intrinsic-size: auto 1131px;
    margin: auto;
    padding-bottom: 200px;
    width: 82%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 120px 8px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 768px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1024px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1270px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 1860px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1270px) and (max-width: 1859px) and (min-width: 2037px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) {
  .home-page-container .sixth-section {
    margin: 0 auto;
    padding-bottom: 120px;
    padding-top: 120px;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 768px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1024px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1270px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 1860px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) and (min-width: 2037px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .home-page-container .sixth-section {
    margin: 0 auto;
    padding-bottom: 120px;
    padding-top: 80px;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1024px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1270px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 1860px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (min-width: 768px) and (max-width: 1023px) and (min-width: 2037px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}
@media (max-width: 767px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 80px 8px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 768px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 1024px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 1270px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 1860px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
@media (max-width: 767px) and (min-width: 2037px) {
  .home-page-container .sixth-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}
.title-desc {
  color: #6e6e6e;
  font-size: 18px;
  font-weight: 400;
  line-height: 136%;
  margin-top: 24px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .title-desc {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .title-desc {
    font-size: 16px;
    margin-top: 12px;
    text-align: center;
  }
}
body {
  background-color: #000;
}
#okx-home-container {
  min-height: 100vh;
}
.home-page-container {
  background-color: #000;
  padding-left: 8px;
  padding-right: 8px;
}
@media (min-width: 768px) {
  .home-page-container {
    padding-left: 12px;
    padding-right: 12px;
  }
}
@media (min-width: 1024px) {
  .home-page-container {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px);
  }
}
@media (min-width: 1270px) {
  .home-page-container {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px);
  }
}
@media (min-width: 1860px) {
  .home-page-container {
    padding-left: calc(50% - 864px);
    padding-right: calc(50% - 864px);
  }
}
@media (min-width: 2037px) {
  .home-page-container {
    padding-left: calc(50% - 864px);
    padding-right: calc(50% - 864px);
  }
}
.home-page-container .fifth-section,
.home-page-container .fourth-section,
.home-page-container .second-section,
.home-page-container .sixth-section,
.home-page-container .third-section {
  content-visibility: auto;
}
.home-page-container .common-title {
  color: #fff;
  font-size: 3.01vw;
  font-weight: 700;
  line-height: 132%;
}
@media (min-width: 1860px) {
  .home-page-container .common-title {
    font-size: 60px;
  }
}
@media (max-width: 767px) {
  .home-page-container .common-title {
    font-size: 28px;
  }
}
.home-page-container .common-desc {
  color: #fff;
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
}
.home-page-container .common-button {
  background: #fff;
  border: 1.5px solid #fff;
  border-radius: 100px;
  color: #000;
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  font-weight: 500;
  min-width: -webkit-fit-content;
  min-width: -moz-fit-content;
  min-width: fit-content;
  padding: 23px 44px;
  text-align: center;
}
@media (min-width: 1860px) {
  .home-page-container .common-button {
    padding: 18px 55px;
  }
}
@media (min-width: 1270px) {
  .home-page-container .response-text.pc-text {
    display: block;
  }
  .home-page-container .response-text.mobile-text {
    display: none;
  }
}
@media (min-width: 1024px) and (max-width: 1269px) {
  .home-page-container .response-text.pc-text {
    display: block;
  }
  .home-page-container .response-text.mobile-text {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .home-page-container .response-text.pc-text {
    display: none;
  }
  .home-page-container .response-text.mobile-text {
    display: block;
  }
}
@media (max-width: 767px) {
  .home-page-container .response-text.pc-text {
    display: none;
  }
  .home-page-container .response-text.mobile-text {
    display: block;
  }
}
#ok-cs-button {
    display: flex;
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 10000;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    opacity: 1;
    transition: all .3s;
    
    background-repeat: no-repeat;
    background-size: 106%;
    background-position: center;
    background-color: rgb(7,66,243);
    cursor: pointer;
    justify-content: center;
    align-items: center;}