/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/common/toast/toast.vue?vue&type=style&index=0&id=768448f3&lang=less ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.common-toast-wrap {
  position: fixed;
  z-index: 9999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 80%;
  height: auto;
  box-sizing: border-box;
  padding: 0.2rem;
  background: rgba(0, 0, 0, 0.8);
  color: #ffffff;
  text-align: center;
  border-radius: 8px;
  font-size: 0.2rem;
}
@media screen and (min-width: 1000px) {
.common-toast-wrap {
    padding: 15px;
    font-size: 20px;
}
}

/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/common/dialog/index.vue?vue&type=style&index=0&id=5cbd6f72&lang=less&scoped=true ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.mx-common-dialog[data-v-5cbd6f72] {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 8887;
  background: rgba(0, 0, 0, 0);
}
.mx-common-dialog.fade[data-v-5cbd6f72] {
  transition: all 0.4s;
  background: rgba(0, 0, 0, 0.5);
}
.mx-common-dialog .mx-common-dialog_wrapper[data-v-5cbd6f72] {
  width: 5.12rem;
  background: #ffffff;
  border-radius: 0.27rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -60%);
  opacity: 0;
  padding: 0.51rem 0.41rem;
  box-sizing: border-box;
}
.mx-common-dialog .mx-common-dialog_wrapper .mx-common-dialog_close[data-v-5cbd6f72] {
  position: absolute;
  top: 0.17rem;
  right: 0.17rem;
  width: 0.27rem;
  height: 0.27rem;
  padding: 0.1rem;
}
.mx-common-dialog .mx-common-dialog_wrapper .mx-common-dialog_close img[data-v-5cbd6f72] {
  width: 100%;
}
.mx-common-dialog .mx-common-dialog_wrapper .mx-common-dialog_title[data-v-5cbd6f72] {
  font-size: 0.27rem;
  text-align: left;
  margin-bottom: 0.2rem;
  font-weight: 500;
  color: #212a38;
  line-height: 0.37rem;
}
.mx-common-dialog .mx-common-dialog_wrapper.fade[data-v-5cbd6f72] {
  transition: all 0.4s;
  transform: translate(-50%, -50%);
  opacity: 1;
}
.mx-common-dialog .mx-common-dialog_wrapper .mx-common-dialog_footer[data-v-5cbd6f72] {
  text-align: center;
}
.mx-common-dialog .mx-common-dialog_wrapper-pc[data-v-5cbd6f72] {
  width: 2.65rem;
  background: #ffffff;
  border-radius: 0.12rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -60%);
  opacity: 0;
  padding: 0.24rem;
  box-sizing: border-box;
}
.mx-common-dialog .mx-common-dialog_wrapper-pc .mx-common-dialog_close-pc[data-v-5cbd6f72] {
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  width: 0.14rem;
  height: 0.14rem;
  padding: 0.1rem;
}
.mx-common-dialog .mx-common-dialog_wrapper-pc .mx-common-dialog_close-pc img[data-v-5cbd6f72] {
  width: 100%;
}
.mx-common-dialog .mx-common-dialog_wrapper-pc .mx-common-dialog_title-pc[data-v-5cbd6f72] {
  font-size: 0.12rem;
  text-align: left;
  margin-bottom: 0.09rem;
  font-weight: 500;
  color: #212a38;
  line-height: 0.13rem;
}
.mx-common-dialog .mx-common-dialog_wrapper-pc.fade[data-v-5cbd6f72] {
  transition: all 0.4s;
  transform: translate(-50%, -50%);
  opacity: 1;
}
.mx-common-dialog .mx-common-dialog_wrapper-pc .mx-common-dialog_footer[data-v-5cbd6f72] {
  text-align: center;
}

/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/common/loading/loading.vue?vue&type=style&index=0&id=6561011d&lang=less ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.common-loading {
  position: relative;
  margin: 0 auto;
}
.common-loading .surfinc {
  transform: translate(-25%, -50%);
  width: 1.2rem;
  height: 1.2rem;
}
.common-loading .surfinc img {
  width: 100%;
  height: 100%;
}
.common-loading .outer {
  animation: 1s loadingrotate linear infinite;
  -webkit-animation: 1s loadingrotate linear infinite;
}
.common-loading .inner {
  position: absolute;
  top: 0;
  left: 0;
}
.common-loading #svg-font {
  font-size: 26px;
  fill: #fff;
  text-anchor: middle;
}
@keyframes loadingrotate {
0% {
    transform: rotateZ(0deg);
}
100% {
    transform: rotateZ(360deg);
}
}

/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/common/radio/index.vue?vue&type=style&index=0&id=81fa5a1c&lang=less&scoped=true ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.common-radio_wrap[data-v-81fa5a1c] {
  display: flex;
}
.flex-column[data-v-81fa5a1c] {
  flex-direction: column;
}
.flex-row[data-v-81fa5a1c] {
  flex-direction: row;
}
.common-radio-item[data-v-81fa5a1c] {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 0.33rem;
}
.common-radio-item-pc[data-v-81fa5a1c] {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 0.12rem;
}
.common-radio_icon[data-v-81fa5a1c] {
  width: 0.27rem;
  margin-right: 0.14rem;
}
.common-radio_icon img[data-v-81fa5a1c] {
  display: inline-block;
  width: 100%;
}
.common-radio_icon-pc[data-v-81fa5a1c] {
  width: 0.12rem;
  margin-right: 0.07rem;
  cursor: pointer;
}
.common-radio_icon-pc img[data-v-81fa5a1c] {
  display: inline-block;
  width: 100%;
}
.common-radio_label[data-v-81fa5a1c] {
  text-align: left;
  font-size: 0.24rem;
  color: #323232;
  line-height: 0.31rem;
}
.common-radio_label-pc[data-v-81fa5a1c] {
  text-align: left;
  font-size: 0.11rem;
  color: #323232;
  line-height: 0.13rem;
}
.flex1[data-v-81fa5a1c] {
  flex: 1;
}
.ommon-radio_item[data-v-81fa5a1c] {
  display: flex;
}

/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/common/textarea/index.vue?vue&type=style&index=0&id=e08e5a8e&lang=less&scoped=true ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.mx-common-textarea[data-v-e08e5a8e] {
  width: 100%;
  height: 2.52rem;
  display: flex;
  flex-direction: column;
}
.mx-common-textarea .mx-common-textarea_content[data-v-e08e5a8e] {
  width: 100%;
  height: 100%;
  padding: 0.2rem 0.27rem;
  background: #fafafa;
  border-radius: 0.07rem;
  border: 0.01rem solid #edeef5;
  resize: none;
  outline: none;
}
.mx-common-textarea .active[data-v-e08e5a8e] {
  border-color: #ff564e;
}
.mx-common-textarea .error-tips[data-v-e08e5a8e] {
  color: #ff564e;
  font-size: 0.2rem;
  margin-top: 0.1rem;
}
.mx-common-textarea-pc[data-v-e08e5a8e] {
  width: 100%;
  height: 0.88rem;
  display: flex;
  flex-direction: column;
}
.mx-common-textarea-pc .mx-common-textarea_content-pc[data-v-e08e5a8e] {
  width: 100%;
  height: 100%;
  padding: 0.1rem;
  background: #fafafa;
  border-radius: 0.07rem;
  border: 0.01rem solid #edeef5;
  resize: none;
  outline: none;
}

/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/index.vue?vue&type=style&index=0&id=54abe67a&lang=less ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.mod {
  text-align: left;
  width: 100%;
  min-width: 1280px;
  overflow-x: auto;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.footer {
  width: 100%;
  min-width: 1200px;
  min-height: 500px;
  background: #22252e;
  box-sizing: border-box;
  padding: 60px 0 36px 0;
  margin-top: auto;
  flex: 0 0 auto;
}
.footer .row-line {
  width: 1200px;
  height: 1px;
  background: #33363f;
  margin: 40px auto;
}
.footer .footer-first {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.footer .footer-first .footer-logo {
  width: 92px;
  height: 24px;
  margin-bottom: 24px;
  filter: brightness(150%);
  cursor: pointer;
}
.footer .footer-first .footer-first__text {
  display: flex;
  align-items: center;
}
.footer .footer-first .footer-first__text .details-title {
  color: #808691;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
}
.footer .footer-first .footer-first__text .details-title:hover {
  filter: brightness(150%);
}
.footer .footer-first .footer-first__text .footer-icon {
  cursor: pointer;
  width: 28px;
  height: 28px;
  margin-left: 24px;
}
.footer .footer-first .footer-first__text .footer-icon:hover {
  filter: brightness(150%);
}
.footer .footer-first .footer-first__text .line {
  width: 2px;
  height: 24px;
  background: #50555c;
  margin: 0 24px;
}
.footer .footer-first .footer-first__text .btn {
  cursor: pointer;
  padding: 12px 16px;
  border-radius: 27px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #b4b9c3;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
}
.footer .footer-first .footer-first__text .btn:hover {
  filter: brightness(150%);
  border: 1px solid #fff;
}
.footer .footer-out {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.footer .footer-out .footer-detail {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.footer .footer-out .footer-detail .details-title {
  font-size: 16px;
  font-weight: 500;
  color: #ffffff;
  line-height: 24px;
  margin-bottom: 24px;
}
.footer .footer-out .footer-detail .footer-logo {
  width: 92px;
  height: 24px;
  margin-bottom: 24px;
  filter: brightness(150%);
  cursor: pointer;
}
.footer .footer-out .footer-detail .footer-icon {
  cursor: pointer;
  float: left;
  margin-right: 20px;
  width: 28px;
  height: 28px;
}
.footer .footer-out .footer-detail .details {
  font-size: 14px;
  font-weight: 400;
  color: #808691;
  line-height: 21px;
  text-align: left;
  margin-bottom: 8px;
  cursor: pointer;
  outline: none;
}
.footer .footer-out .footer-detail .details:hover {
  color: #ffffff;
}
.footer .footer-out .footer-detail .no-cursor {
  cursor: auto;
}
.footer .footer-out .footer-detail .foot-imgs {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.footer .footer-out .footer-detail .foot-imgs img {
  margin-right: 16px;
  border-radius: 8px;
  width: auto;
  cursor: pointer;
}
.footer .footer-out .fot {
  margin-left: 80px;
}
.footer .footer-out .fot-first {
  margin-left: 105px;
}
.footer .foot-content {
  width: 1200px;
  margin: 24px auto 8px;
}
.footer .foot-content p {
  margin-bottom: 24px;
  font-size: 10px;
  font-weight: 400;
  color: #6b6f75;
  line-height: 18px;
}
.footer .line {
  width: 1200px;
  height: 1px;
  background: #ffffff;
  opacity: 0.1;
  margin: 40px auto 0 auto;
}
.footer .footer-copyright {
  width: 1200px;
  font-size: 14px;
  font-weight: 400;
  color: #50555c;
  line-height: 21px;
  margin: 24px auto 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.footer .footer-copyright .left-text {
  text-align: left;
}
.footer .footer-copyright .imgs {
  display: flex;
  flex-direction: row;
}
.footer .footer-copyright .imgs img {
  width: 28px;
  height: 28px;
  margin-left: 24px;
  cursor: pointer;
}
.footer .footer-copyright .imgs img:hover {
  filter: brightness(150%);
}
.banner {
  width: 100%;
  height: 80px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
}
.banner .banner-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
}
.banner__container {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.banner__container__head {
  width: 100%;
  min-width: 1200px;
  box-sizing: border-box;
  position: absolute;
  top: 19px;
  left: 0;
  z-index: 99;
}
.banner__container__head__in {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 72px;
  margin: 0 auto;
}
.banner__container__head .head__titleout {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 38px;
}
.banner__container__head .head__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
}
.banner__container__head .head__title__text {
  height: 24px;
  font-size: 16px;
  font-weight: 400;
  color: #202630;
  line-height: 24px;
}
.banner__container__head .head__title__text:hover {
  color: #ffba00;
}
.banner__container__head .head__title__textb {
  height: 24px;
  font-size: 16px;
  font-weight: 400;
  color: #ffba00;
  line-height: 24px;
}
.banner__container__head .head__title__line {
  width: 12px;
  height: 2px;
  background: #ffba00;
}
.banner__container__head .head__logo {
  width: 119px;
  height: 30px;
  cursor: pointer;
}
.banner__container__head .head__btn {
  box-sizing: border-box;
  padding: 14px 24px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: #fed440;
  border-radius: 24px;
  color: #282004;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
  cursor: pointer;
}
.banner__container__head .head__btn__icon {
  margin-right: 8px;
  width: 16px;
  height: 16px;
}
.global-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 999;
  display: flex;
  justify-content: center;
  align-items: center;
}
.global-modal .modal-content {
  position: relative;
  width: 550px;
  height: 470px;
  background: #fff;
  border-radius: 24px;
  padding: 0 20px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.global-modal .modal-content .modal-close {
  position: absolute;
  top: -70px;
  right: -32px;
  width: 32px;
  height: 32px;
  cursor: pointer;
}
.global-modal .modal-content .modal-bg {
  width: 355px;
  height: 316px;
  position: relative;
  margin-top: -120px;
}
.global-modal .modal-content .modal-title {
  width: 100%;
  margin: 20px 0 16px 0;
  color: #1d1d1b;
  font-size: 32px;
  font-weight: 700;
  line-height: 40px;
}
.global-modal .modal-content .modal-text {
  width: 100%;
  color: #282004;
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
}
.global-modal .modal-content .modal-text span {
  font-weight: 700;
}
.global-modal .modal-content .modal-tip1 {
  width: 100%;
  margin: 16px 0;
  color: #f4a526;
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
}
.global-modal .modal-content .modal-tip2 {
  width: 100%;
  color: #808691;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/comps/home.vue?vue&type=style&index=0&id=6dd20052&lang=less&scoped=true ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.container[data-v-6dd20052] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  background: #fff;
}
.container .top-banner[data-v-6dd20052] {
  width: 100%;
  padding: 78px 0 72px;
  box-sizing: border-box;
  height: -moz-fit-content;
  height: fit-content;
  background-color: #fffcf2;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 60px;
}
.container .top-banner[data-v-6dd20052]::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/495457ef9e9f671b1b9974cb4f365b6b.png) no-repeat center / cover;
  z-index: 0;
  will-change: transform;
}
.container .top-banner .banner__desc[data-v-6dd20052] {
  width: 400px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  position: relative;
}
.container .top-banner .banner__desc__title1[data-v-6dd20052] {
  display: inline-block;
  width: 556px;
  font-size: 60px;
  font-weight: bold;
  line-height: 72px;
  color: #282004;
}
.container .top-banner .banner__desc__title2[data-v-6dd20052] {
  display: inline-block;
  width: 556px;
  font-size: 60px;
  font-weight: bold;
  line-height: 72px;
  color: #ffba00;
}
.container .top-banner .banner__desc__text[data-v-6dd20052] {
  width: 556px;
  height: -moz-fit-content;
  height: fit-content;
  margin: 32px 0 24px 0;
  font-size: 24px;
  font-weight: 400;
  color: #3f3e3e;
  line-height: 32px;
}
.container .top-banner .banner__desc .home-btn[data-v-6dd20052] {
  padding: 16px 24px;
  box-sizing: border-box;
  margin-top: 24px;
  margin-bottom: 40px;
  background: #fed440;
  border-radius: 27px;
  font-size: 14px;
  font-weight: 600;
  color: #282004;
  text-align: center;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.container .top-banner .banner__desc .home-btn img[data-v-6dd20052] {
  width: 24px;
  height: 16px;
}
.container .top-banner .banner__desc__check[data-v-6dd20052] {
  display: flex;
  flex-direction: column;
}
.container .top-banner .banner__desc__check__flex[data-v-6dd20052] {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 14px;
}
.container .top-banner .banner__desc__check__flex img[data-v-6dd20052] {
  width: 24px;
  height: 24px;
}
.container .top-banner .banner__desc__check__flex p[data-v-6dd20052] {
  margin-left: 12px;
  height: 24px;
  font-size: 16px;
  font-weight: 400;
  color: #808691;
  line-height: 24px;
}
.container .top-banner .banner__desc__title3[data-v-6dd20052] {
  display: inline-block;
  width: 556px;
  height: 22px;
  margin: 60px 0 12px 0;
  font-size: 14px;
  font-weight: 400;
  color: #737373;
  line-height: 22px;
}
.container .top-banner .banner__desc__store[data-v-6dd20052] {
  display: flex;
  align-items: center;
  width: 650px;
}
.container .top-banner .banner__desc__store img[data-v-6dd20052]:not(:last-child) {
  cursor: pointer;
}
.container .top-banner .banner__desc__store img[data-v-6dd20052] {
  width: 110px;
  margin-right: 8px;
  cursor: pointer;
}
.container .top-banner .banner__img[data-v-6dd20052] {
  width: 651px;
  height: 561px;
  -o-object-fit: contain;
     object-fit: contain;
  contain: layout size;
  z-index: 1;
}
.container .main-content[data-v-6dd20052] {
  width: 100%;
  margin-top: 120px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.container .main-content .slider-box[data-v-6dd20052] {
  width: 985px;
  flex-shrink: 0;
  height: -moz-fit-content;
  height: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.container .main-content .slider-box .title[data-v-6dd20052] {
  color: #3d3d3d;
  text-align: center;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  /* 120% */
}
.container .main-content .slider-box .title span[data-v-6dd20052] {
  color: #ffba00;
}
.container .main-content .slider-box .sub-title[data-v-6dd20052] {
  color: #808691;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
  padding: 24px 0 70px;
}
.container .main-content .slider-box .slider-wrap[data-v-6dd20052] {
  width: 100%;
  flex-shrink: 0;
  overflow: hidden;
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
  gap: 80px;
}
.container .main-content .slider-box .slider-wrap .item-wrap[data-v-6dd20052] {
  width: 180px;
  flex-shrink: 0;
  min-height: 182px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}
.container .main-content .slider-box .slider-wrap .item-wrap img[data-v-6dd20052] {
  max-height: 62px;
  -o-object-fit: contain;
     object-fit: contain;
  flex-shrink: 0;
}
.container .main-content .slider-box .slider-wrap .item-wrap .item-title[data-v-6dd20052] {
  color: #282004;
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 30px;
  /* 150% */
  padding: 30px 0 12px;
}
.container .main-content .slider-box .slider-wrap .item-wrap .item-content[data-v-6dd20052] {
  color: #50555c;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  /* 150% */
  word-wrap: break-word;
}
.container .main-content .slider-box .btn-wrap[data-v-6dd20052] {
  display: flex;
  justify-content: center;
  margin-top: 48px;
  gap: 32px;
}
.container .main-content .slider-box .btn-wrap img[data-v-6dd20052] {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  cursor: pointer;
}
.container .main-content .slider-item[data-v-6dd20052] {
  width: 985px;
  margin-top: 120px;
  transform: translateZ(0);
  backface-visibility: hidden;
}
.container .main-content .slider-item .costco-row[data-v-6dd20052] {
  width: 985px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
}
.container .main-content .slider-item .costco-row .row-left[data-v-6dd20052] {
  display: flex;
  flex-direction: column;
}
.container .main-content .slider-item .costco-row .row-left .top-img[data-v-6dd20052] {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  gap: 16px;
}
.container .main-content .slider-item .costco-row .row-left .top-img img[data-v-6dd20052] {
  height: 24px;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .slider-item .costco-row .row-left .top-img i[data-v-6dd20052] {
  width: 0.5px;
  height: 20px;
  opacity: 0.4;
  background: #282004;
}
.container .main-content .slider-item .costco-row .row-left .title[data-v-6dd20052] {
  color: #ffba00;
  text-align: left;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  /* 120% */
}
.container .main-content .slider-item .costco-row .row-left .sub-title[data-v-6dd20052] {
  color: #3d3d3d;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  text-align: left;
  padding: 0;
}
.container .main-content .slider-item .costco-row .row-left .content[data-v-6dd20052] {
  color: #808691;
  text-align: left;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
  margin-top: 24px;
}
.container .main-content .slider-item .costco-row .movie-right[data-v-6dd20052] {
  width: 314.653px;
  height: 253.6px;
  flex-shrink: 0;
}
.container .main-content .slider-item .costco-row .row-right[data-v-6dd20052] {
  width: 260px;
  height: 240px;
  flex-shrink: 0;
  margin-right: 88px;
}
.container .main-content .slider-item .costco-row .row_2_card[data-v-6dd20052] {
  width: 484px;
  height: 177px;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  padding: 24px;
  gap: 18px;
  background: #fffbed;
  box-sizing: border-box;
  border: 1px solid #ffeba8;
}
.container .main-content .slider-item .costco-row .row_2_card .title1[data-v-6dd20052] {
  width: -moz-fit-content;
  width: fit-content;
  height: 20px;
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #fed440;
  box-sizing: border-box;
  color: #282004;
  font-size: 10px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0px;
}
.container .main-content .slider-item .costco-row .row_2_card .row_2_bottom[data-v-6dd20052] {
  display: flex;
  flex-direction: row;
}
.container .main-content .slider-item .costco-row .row_2_card .row_2_bottom .title2[data-v-6dd20052] {
  margin-left: 16px;
  width: 272px;
  font-size: 16px;
  font-weight: normal;
  line-height: 24px;
  letter-spacing: 0px;
  color: #50555c;
}
.container .main-content .slider-item .movie-row[data-v-6dd20052] {
  margin: 16px 0 24px;
  border-radius: 16px;
  border: 1px solid #ffeba8;
  background: #fffbed;
  padding: 32px 26px;
}
.container .main-content .slider-item .movie-row .tips[data-v-6dd20052] {
  color: #808691;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
  text-align: left;
}
.container .main-content .slider-item .movie-row .movie-item[data-v-6dd20052] {
  display: flex;
  align-items: center;
  gap: 18px;
}
.container .main-content .slider-item .movie-row .movie-item img[data-v-6dd20052] {
  -o-object-fit: contain;
     object-fit: contain;
  max-width: 45px;
}
.container .main-content .slider-item .bottom-tips[data-v-6dd20052] {
  color: #50555c;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  /* 150% */
  text-align: left;
}
.container .main-content .slider-item .bottom-link[data-v-6dd20052] {
  color: #3798ff;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  /* 150% */
  text-decoration-line: underline;
  padding-top: 16px;
  text-align: left;
  cursor: pointer;
}
.container .main-content .slider-item .kfc-wrap[data-v-6dd20052] {
  width: 985px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.container .main-content .slider-item .kfc-wrap .kfc-img[data-v-6dd20052] {
  width: 319px;
  height: 329px;
  flex-shrink: 0;
}
.container .main-content .slider-item .kfc-wrap .kfc-right[data-v-6dd20052] {
  display: flex;
  flex-direction: column;
  max-width: 514px;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .top-img[data-v-6dd20052] {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  gap: 16px;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .top-img img[data-v-6dd20052] {
  height: 24px;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .top-img i[data-v-6dd20052] {
  width: 0.5px;
  height: 20px;
  opacity: 0.4;
  background: #282004;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .title[data-v-6dd20052] {
  color: #ffba00;
  text-align: left;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 120% */
}
.container .main-content .slider-item .kfc-wrap .kfc-right .sub-title[data-v-6dd20052] {
  color: #3d3d3d;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  text-align: left;
  padding: 0;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .bottom-link[data-v-6dd20052] {
  padding-top: 24px;
  color: #3798ff;
  text-align: left;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  /* 150% */
  text-decoration-line: underline;
  cursor: pointer;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .bottom-url[data-v-6dd20052] {
  padding-top: 24px;
  color: #2b2b2b;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  cursor: pointer;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .bottom-url span[data-v-6dd20052] {
  margin-left: 7px;
  color: #3798ff;
  text-decoration-line: underline;
}
.container .main-content .about-box[data-v-6dd20052] {
  width: 100%;
  margin-top: 120px;
  height: 356px;
  background: #fed440;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 48px;
}
.container .main-content .about-box .title[data-v-6dd20052] {
  color: #000;
  font-size: 40px;
  font-style: normal;
  font-weight: 600;
  line-height: 48px;
  /* 120% */
}
.container .main-content .about-box .img-wrap[data-v-6dd20052] {
  display: flex;
  align-items: center;
  gap: 12px;
}
.container .main-content .about-box .img-wrap img[data-v-6dd20052] {
  -o-object-fit: contain;
     object-fit: contain;
  width: 198px;
  height: 83.89px;
}
.container .main-content .card-box[data-v-6dd20052] {
  width: 985px;
  margin-top: 120px;
  display: flex;
  justify-content: center;
  gap: 129px;
}
.container .main-content .card-box .left-card[data-v-6dd20052] {
  -o-object-fit: contain;
     object-fit: contain;
  width: 385px;
  height: 365px;
}
.container .main-content .card-box .right-wrap[data-v-6dd20052] {
  width: 415px;
  display: flex;
  flex-direction: column;
  text-align: left;
}
.container .main-content .card-box .right-wrap .top-img[data-v-6dd20052] {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  gap: 16px;
}
.container .main-content .card-box .right-wrap .top-img img[data-v-6dd20052] {
  max-height: 27px;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .card-box .right-wrap .top-img i[data-v-6dd20052] {
  width: 0.5px;
  height: 34px;
  stroke-width: 1px;
  background: #000;
}
.container .main-content .card-box .right-wrap .title[data-v-6dd20052] {
  color: #000;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 150% */
}
.container .main-content .card-box .right-wrap .sub-title[data-v-6dd20052] {
  color: #ffba00;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
}
.container .main-content .card-box .right-wrap .content[data-v-6dd20052] {
  padding-top: 24px;
  color: #50555c;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  /* 200% */
}

/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/comps/permit.vue?vue&type=style&index=0&id=2bfbe6ce&lang=less&scoped=true ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.container[data-v-2bfbe6ce] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  background: #fff;
}
.container .top-banner[data-v-2bfbe6ce] {
  width: 100%;
  padding: 120px 0 209px;
  box-sizing: border-box;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/495457ef9e9f671b1b9974cb4f365b6b.png) no-repeat center / cover #fffcf2;
  position: relative;
}
.container .top-banner .banner__container[data-v-2bfbe6ce] {
  width: 1152px;
  padding-left: 34px;
  margin: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.container .top-banner .banner__desc[data-v-2bfbe6ce] {
  width: -moz-fit-content;
  width: fit-content;
  font-size: 48px;
  font-weight: bold;
  color: #ffba00;
  line-height: 60px;
}
.container .top-banner .banner__desc .about-title1[data-v-2bfbe6ce] {
  width: -moz-fit-content;
  width: fit-content;
  color: #282004;
}
.container .top-banner .banner__desc .about-title2[data-v-2bfbe6ce] {
  width: -moz-fit-content;
  width: fit-content;
}
.container .top-banner .banner__desc .about-title3[data-v-2bfbe6ce] {
  width: -moz-fit-content;
  width: fit-content;
  margin-top: 24px;
  color: #808691;
  font-size: 16px;
  font-weight: normal;
  line-height: 24px;
}
.container .top-banner .banner__img[data-v-2bfbe6ce] {
  position: absolute;
  bottom: 0;
  right: 0;
  height: 618px;
}
.container .main-content[data-v-2bfbe6ce] {
  width: 100%;
  background: #fff;
}
.container .main-content .main-container[data-v-2bfbe6ce] {
  width: 997px;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 120px 0;
  box-sizing: border-box;
  gap: 120px;
}
.container .main-content .main-container .box[data-v-2bfbe6ce] {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 104px;
  align-items: center;
}
.container .main-content .main-container .box .left-img[data-v-2bfbe6ce] {
  width: 480px;
  height: 386px;
  flex-shrink: 0;
}
.container .main-content .main-container .box .right-wrap[data-v-2bfbe6ce] {
  display: flex;
  flex-direction: column;
  max-width: 402px;
  gap: 24px;
}
.container .main-content .main-container .box .right-wrap .title[data-v-2bfbe6ce] {
  color: #282004;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 150% */
}
.container .main-content .main-container .box .right-wrap .step-wrap[data-v-2bfbe6ce] {
  display: flex;
  flex-direction: column;
  gap: 22px;
  position: relative;
}
.container .main-content .main-container .box .right-wrap .step-wrap .line[data-v-2bfbe6ce] {
  position: absolute;
  background: #ffeba8;
  width: 1px;
  height: 80%;
  flex-shrink: 0;
  top: 10;
  left: 9.5px;
}
.container .main-content .main-container .box .right-wrap .step-wrap .item-wrap[data-v-2bfbe6ce] {
  display: flex;
  align-items: center;
  gap: 11px;
}
.container .main-content .main-container .box .right-wrap .step-wrap .item-wrap .left-no[data-v-2bfbe6ce] {
  width: 20px;
  height: 20px;
  border-radius: 20px;
  background: #fed440;
  color: #282004;
  text-align: center;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  /* 133.333% */
  z-index: 2;
}
.container .main-content .main-container .box .right-wrap .step-wrap .item-wrap .right-content[data-v-2bfbe6ce] {
  color: #50555c;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
}
.container .main-content .main-container .video-wrap[data-v-2bfbe6ce] {
  width: 100%;
  height: 325px;
  display: flex;
  border-radius: 20px;
  position: relative;
}
.container .main-content .main-container .video-wrap .video-tag[data-v-2bfbe6ce] {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  background: #000;
}
.container .main-content .main-container .video-wrap .left-wrap[data-v-2bfbe6ce] {
  width: 643px;
  flex-shrink: 0;
  height: 100%;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/39f6f5e7dab5088022638f8dffaaa413.png) no-repeat;
  background-size: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 2;
}
.container .main-content .main-container .video-wrap .left-wrap p[data-v-2bfbe6ce] {
  padding-left: 59px;
  color: #000;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 42px;
  /* 131.25% */
}
.container .main-content .main-container .video-wrap .left-wrap p span[data-v-2bfbe6ce] {
  font-weight: 400;
}
.container .main-content .main-container .video-wrap .right-wrap[data-v-2bfbe6ce] {
  width: 582px;
  height: 100%;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/0228c603dfb21c460c1c40dc9e3e6efc.png) no-repeat;
  background-size: 100%;
  flex-shrink: 0;
  display: flex;
  position: relative;
  left: -230px;
}
.container .main-content .main-container .video-wrap .right-wrap img[data-v-2bfbe6ce] {
  margin: auto;
  width: 104px;
  height: 104px;
  flex-shrink: 0;
  cursor: pointer;
}
.container .main-content .main-container .person-wrap[data-v-2bfbe6ce] {
  width: 986px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.container .main-content .main-container .person-wrap .title[data-v-2bfbe6ce] {
  color: #282004;
  text-align: center;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  /* 120% */
  margin-bottom: 60px;
}
.container .main-content .main-container .person-wrap .slider-wrap[data-v-2bfbe6ce] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  padding: 20px 0;
  border-radius: 10px;
  box-sizing: border-box;
  overflow-x: hidden;
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
  gap: 22px;
}
.container .main-content .main-container .person-wrap .slider-wrap .slider-item[data-v-2bfbe6ce] {
  width: 306px;
  min-height: 288px;
  flex-shrink: 0;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.container .main-content .main-container .person-wrap .slider-wrap .slider-item .top-wrap[data-v-2bfbe6ce] {
  width: 100%;
  padding: 48px 40px;
  padding-bottom: 0;
  box-sizing: border-box;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  gap: 30px;
}
.container .main-content .main-container .person-wrap .slider-wrap .slider-item .top-wrap .avatar[data-v-2bfbe6ce] {
  width: 74px;
  height: 74px;
  flex-shrink: 0;
  background: #fff3c9;
  border-radius: 50%;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .main-container .person-wrap .slider-wrap .slider-item .top-wrap .stars[data-v-2bfbe6ce] {
  display: flex;
  flex-direction: column;
  gap: 14px;
  color: #000;
  text-align: left;
  font-size: 17.28px;
  font-style: normal;
  font-weight: 600;
  line-height: 22px;
  /* 127.315% */
}
.container .main-content .main-container .person-wrap .slider-wrap .slider-item .top-wrap .stars img[data-v-2bfbe6ce] {
  width: 99.57px;
  height: 11.998px;
  flex-shrink: 0;
}
.container .main-content .main-container .person-wrap .slider-wrap .slider-item .content[data-v-2bfbe6ce] {
  flex: 1;
  width: 100%;
  padding: 0 40px;
  padding-top: 28px;
  box-sizing: border-box;
  color: #777;
  text-align: left;
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
  line-height: 17px;
  /* 154.545% */
}
.container .main-content .main-container .person-wrap .slider-wrap .active-item[data-v-2bfbe6ce] {
  width: 330px;
  min-height: 316px;
}
.container .main-content .main-container .person-wrap .slider-wrap .active-item .top-wrap[data-v-2bfbe6ce] {
  padding: 56px 40px 0 40px;
  box-sizing: border-box;
  min-height: 138px;
  align-items: baseline;
}
.container .main-content .main-container .person-wrap .slider-wrap .active-item .content[data-v-2bfbe6ce] {
  padding: 33px 40px 0 40px;
  box-sizing: border-box;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/24df9e2431793a0561d6bdb68cb87dc9.png) no-repeat;
  background-size: 100%;
}
.container .main-content .main-container .person-wrap .slider-wrap .active-item .active-avatar[data-v-2bfbe6ce] {
  width: 160px;
  height: 155px;
  flex-shrink: 0;
  position: absolute;
  right: 5px;
  top: -15px;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .main-container .person-wrap .btn-wrap[data-v-2bfbe6ce] {
  display: flex;
  justify-content: center;
  margin-top: 48px;
  gap: 32px;
}
.container .main-content .main-container .person-wrap .btn-wrap img[data-v-2bfbe6ce] {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  cursor: pointer;
}

/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/comps/benefit.vue?vue&type=style&index=0&id=1db47d18&lang=less&scoped=true ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.container[data-v-1db47d18] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  background: #fff;
}
.container .top-banner[data-v-1db47d18] {
  width: 100%;
  padding: 120px 0 209px;
  box-sizing: border-box;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/495457ef9e9f671b1b9974cb4f365b6b.png) no-repeat center / cover #fffcf2;
  position: relative;
}
.container .top-banner .banner__container[data-v-1db47d18] {
  width: 1152px;
  padding-left: 128px;
  margin: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.container .top-banner .banner__desc[data-v-1db47d18] {
  font-size: 48px;
  font-weight: bold;
  color: #ffba00;
  line-height: 60px;
}
.container .top-banner .banner__desc .about-title1[data-v-1db47d18] {
  width: -moz-fit-content;
  width: fit-content;
  color: #282004;
}
.container .top-banner .banner__desc .about-title2[data-v-1db47d18] {
  width: -moz-fit-content;
  width: fit-content;
}
.container .top-banner .banner__desc .about-title3[data-v-1db47d18] {
  width: -moz-fit-content;
  width: fit-content;
  margin-top: 24px;
  color: #808691;
  font-size: 16px;
  font-weight: normal;
  line-height: 24px;
}
.container .top-banner .banner__img[data-v-1db47d18] {
  position: absolute;
  bottom: 0;
  right: 0;
  height: 461px;
}
.container .main-content[data-v-1db47d18] {
  width: 100%;
}
.container .main-content .benefit-wrap[data-v-1db47d18] {
  width: 100%;
  background: #fff;
  min-width: 1200px;
  padding: 120px 0;
}
.container .main-content .benefit-wrap .title-wrap[data-v-1db47d18] {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #3d3d3d;
  text-align: center;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 150% */
  padding-bottom: 72px;
}
.container .main-content .benefit-wrap .title-wrap .sub-title[data-v-1db47d18] {
  color: #ffba00;
}
.container .main-content .benefit-wrap .card_content[data-v-1db47d18] {
  width: 1184px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
  row-gap: 36px;
}
.container .main-content .benefit-wrap .card_content .card[data-v-1db47d18] {
  width: 575px;
  height: 299px;
  border-radius: 24px;
  background: #f7f8fb;
  padding: 40px;
  box-sizing: border-box;
}
.container .main-content .benefit-wrap .card_content .card img[data-v-1db47d18] {
  width: 32px;
  height: 32px;
}
.container .main-content .benefit-wrap .card_content .card .title_1[data-v-1db47d18] {
  margin: 24px 0 12px 0;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: 0px;
  color: #282004;
}
.container .main-content .benefit-wrap .card_content .card .title_2[data-v-1db47d18] {
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0px;
  color: #808691;
}
.container .main-content .benefit-wrap .card_content .card .title_3[data-v-1db47d18] {
  font-size: 14px;
  font-weight: normal;
  line-height: 24px;
  letter-spacing: 0px;
  color: #808691;
}
.container .main-content .benefit-wrap .card_content .card .title_4[data-v-1db47d18] {
  margin-top: 12px;
  font-size: 12px;
  font-weight: normal;
  line-height: 15px;
  letter-spacing: 0px;
  text-decoration: underline;
  color: #3798ff;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  text-align: left;
}
.container .main-content .benefit-wrap .card_content[data-v-1db47d18]:not(:last-child) {
  margin-bottom: 36px;
}
.container .main-content .benefit-wrap .sufinc_pic[data-v-1db47d18] {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 98px;
  margin-top: 120px;
}
.container .main-content .benefit-wrap .sufinc_pic img[data-v-1db47d18] {
  width: 480px;
  height: 480px;
}
.container .main-content .benefit-wrap .sufinc_pic p[data-v-1db47d18] {
  width: 442px;
  color: #282004;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 150% */
  text-align: left;
}

/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/comps/promociones.vue?vue&type=style&index=0&id=66060242&lang=less&scoped=true ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.container[data-v-66060242] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  background: #fff;
}
.container .top-banner[data-v-66060242] {
  width: 100%;
  box-sizing: border-box;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/495457ef9e9f671b1b9974cb4f365b6b.png) no-repeat center / cover #fffcf2;
  position: relative;
}
.container .top-banner .banner__container[data-v-66060242] {
  width: 1152px;
  padding: 40px 80px 60px 34px;
  box-sizing: border-box;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 60px;
}
.container .top-banner .banner__desc[data-v-66060242] {
  color: #282004;
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 125% */
}
.container .top-banner .banner__desc .about-title2[data-v-66060242] {
  margin-top: 24px;
  color: #808691;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
}
.container .top-banner .banner__img[data-v-66060242] {
  width: 480px;
  height: 480px;
}
.container .main-content[data-v-66060242] {
  width: 100%;
  margin-top: 120px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.container .main-content .slider-wrap[data-v-66060242] {
  width: 985px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 120px;
}
.container .main-content .slider-wrap .item-wrap[data-v-66060242] {
  min-width: 180px;
  min-height: 158px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}
.container .main-content .slider-wrap .item-wrap img[data-v-66060242] {
  max-height: 62px;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .slider-wrap .item-wrap .item-title[data-v-66060242] {
  color: #282004;
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 30px;
  /* 150% */
  padding: 30px 0 12px;
}
.container .main-content .slider-wrap .item-wrap .item-content[data-v-66060242] {
  color: #50555c;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  /* 150% */
}
.container .main-content .slider-item[data-v-66060242] {
  width: 985px;
}
.container .main-content .slider-item .costco-row[data-v-66060242] {
  width: 985px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
}
.container .main-content .slider-item .costco-row .row-left[data-v-66060242] {
  display: flex;
  flex-direction: column;
}
.container .main-content .slider-item .costco-row .row-left .top-img[data-v-66060242] {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  gap: 16px;
}
.container .main-content .slider-item .costco-row .row-left .top-img img[data-v-66060242] {
  height: 24px;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .slider-item .costco-row .row-left .top-img i[data-v-66060242] {
  width: 0.5px;
  height: 20px;
  opacity: 0.4;
  background: #282004;
}
.container .main-content .slider-item .costco-row .row-left .title[data-v-66060242] {
  color: #ffba00;
  text-align: left;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  /* 120% */
}
.container .main-content .slider-item .costco-row .row-left .sub-title[data-v-66060242] {
  color: #3d3d3d;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  text-align: left;
  padding: 0;
}
.container .main-content .slider-item .costco-row .row-left .content[data-v-66060242] {
  color: #808691;
  text-align: left;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
  margin-top: 24px;
}
.container .main-content .slider-item .costco-row .movie-right[data-v-66060242] {
  width: 314.653px;
  height: 253.6px;
  flex-shrink: 0;
}
.container .main-content .slider-item .costco-row .row-right[data-v-66060242] {
  width: 260px;
  height: 240px;
  flex-shrink: 0;
  margin-right: 88px;
}
.container .main-content .slider-item .costco-row .row_2_card[data-v-66060242] {
  width: 484px;
  height: 177px;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  padding: 24px;
  gap: 18px;
  background: #fffbed;
  box-sizing: border-box;
  border: 1px solid #ffeba8;
}
.container .main-content .slider-item .costco-row .row_2_card .title1[data-v-66060242] {
  width: -moz-fit-content;
  width: fit-content;
  height: 20px;
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  background: #fed440;
  box-sizing: border-box;
  color: #282004;
  font-size: 10px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0px;
}
.container .main-content .slider-item .costco-row .row_2_card .row_2_bottom[data-v-66060242] {
  display: flex;
  flex-direction: row;
}
.container .main-content .slider-item .costco-row .row_2_card .row_2_bottom .title2[data-v-66060242] {
  margin-left: 16px;
  width: 272px;
  font-size: 16px;
  font-weight: normal;
  line-height: 24px;
  letter-spacing: 0px;
  color: #50555c;
}
.container .main-content .slider-item .movie-row[data-v-66060242] {
  margin: 16px 0 24px;
  border-radius: 16px;
  border: 1px solid #ffeba8;
  background: #fffbed;
  padding: 32px 26px;
}
.container .main-content .slider-item .movie-row .tips[data-v-66060242] {
  color: #808691;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
  text-align: left;
}
.container .main-content .slider-item .movie-row .movie-item[data-v-66060242] {
  display: flex;
  align-items: center;
  gap: 18px;
}
.container .main-content .slider-item .movie-row .movie-item img[data-v-66060242] {
  -o-object-fit: contain;
     object-fit: contain;
  max-width: 45px;
}
.container .main-content .slider-item .bottom-tips[data-v-66060242] {
  color: #50555c;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  /* 150% */
  text-align: left;
}
.container .main-content .slider-item .bottom-link[data-v-66060242] {
  color: #3798ff;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  /* 150% */
  text-decoration-line: underline;
  padding-top: 16px;
  text-align: left;
  cursor: pointer;
  background: none;
  border: none;
}
.container .main-content .slider-item .kfc-wrap[data-v-66060242] {
  width: 985px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.container .main-content .slider-item .kfc-wrap .kfc-img[data-v-66060242] {
  width: 319px;
  height: 329px;
  flex-shrink: 0;
}
.container .main-content .slider-item .kfc-wrap .kfc-right[data-v-66060242] {
  display: flex;
  flex-direction: column;
  max-width: 514px;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .top-img[data-v-66060242] {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  gap: 16px;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .top-img img[data-v-66060242] {
  height: 24px;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .top-img i[data-v-66060242] {
  width: 0.5px;
  height: 20px;
  opacity: 0.4;
  background: #282004;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .title[data-v-66060242] {
  color: #ffba00;
  text-align: left;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 120% */
}
.container .main-content .slider-item .kfc-wrap .kfc-right .sub-title[data-v-66060242] {
  color: #3d3d3d;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  text-align: left;
  padding: 0;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .bottom-link[data-v-66060242] {
  padding-top: 24px;
  color: #3798ff;
  text-align: left;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  /* 150% */
  text-decoration-line: underline;
  cursor: pointer;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .bottom-url[data-v-66060242] {
  padding-top: 24px;
  color: #2b2b2b;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  cursor: pointer;
}
.container .main-content .slider-item .kfc-wrap .kfc-right .bottom-url span[data-v-66060242] {
  margin-left: 7px;
  color: #3798ff;
  text-decoration-line: underline;
}
.container .main-content .gift-wrap[data-v-66060242] {
  width: -moz-fit-content;
  width: fit-content;
  margin: 120px auto;
  display: flex;
  justify-content: space-between;
  gap: 60px;
}
.container .main-content .gift-wrap .img1[data-v-66060242] {
  width: 198px;
  height: -moz-fit-content;
  height: fit-content;
  flex-shrink: 0;
}
.container .main-content .gift-wrap .img2[data-v-66060242] {
  width: 194px;
  height: -moz-fit-content;
  height: fit-content;
  flex-shrink: 0;
}
.container .main-content .gift-wrap .middle-wrap[data-v-66060242] {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 24px;
}
.container .main-content .gift-wrap .middle-wrap .title[data-v-66060242] {
  color: #282004;
  text-align: center;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 150% */
}
.container .main-content .gift-wrap .middle-wrap .content[data-v-66060242] {
  color: #3f3e3e;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  /* 200% */
}
.container .main-content .gift-wrap .middle-wrap .btn[data-v-66060242] {
  padding: 16px 24px;
  box-sizing: border-box;
  margin: 8px 0;
  background: #fed440;
  border-radius: 27px;
  font-size: 14px;
  font-weight: 500;
  color: #282004;
  text-align: center;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.container .main-content .gift-wrap .middle-wrap .btn img[data-v-66060242] {
  width: 24px;
  height: 16px;
}
.container .main-content .gift-wrap .middle-wrap .store[data-v-66060242] {
  display: flex;
  gap: 8px;
}
.container .main-content .gift-wrap .middle-wrap .store img[data-v-66060242]:not(:last-child) {
  cursor: pointer;
}
.container .main-content .gift-wrap .middle-wrap .store img[data-v-66060242] {
  width: 110px;
  margin-right: 8px;
  cursor: pointer;
}

/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/comps/payments.vue?vue&type=style&index=0&id=114b9e20&lang=less&scoped=true ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.container[data-v-114b9e20] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  background: #fff;
}
.container .top-banner[data-v-114b9e20] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 577px;
  box-sizing: border-box;
  position: relative;
  top: -80px;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/6447dd9914054b62bee1f0ff2fdc8443.png) no-repeat;
  background-size: 100%;
}
.container .top-banner .banner__container[data-v-114b9e20] {
  position: absolute;
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  padding: 207px 0 0 0;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: inherit;
}
.container .top-banner .banner__desc[data-v-114b9e20] {
  width: 1152px;
  padding-left: 34px;
  box-sizing: border-box;
  margin: auto;
  color: #282004;
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 125% */
  z-index: 2;
}
.container .top-banner .banner__desc .about-title2[data-v-114b9e20] {
  color: #ffba00;
}
.container .top-banner .banner__desc .about-title3[data-v-114b9e20] {
  margin-top: 24px;
  color: #808691;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
}
.container .top-banner .banner__img[data-v-114b9e20] {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content[data-v-114b9e20] {
  width: 100%;
  padding: 40px 0 60px;
  box-sizing: border-box;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 120px;
}
.container .main-content .step-wrap[data-v-114b9e20] {
  width: 920px;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 100px;
}
.container .main-content .step-wrap .title[data-v-114b9e20] {
  color: #282004;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  padding-bottom: 24px;
}
.container .main-content .step-wrap .sub-title[data-v-114b9e20] {
  color: #808691;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
}
.container .main-content .step-wrap .step-box[data-v-114b9e20] {
  width: 100%;
  margin-top: 40px;
  position: relative;
}
.container .main-content .step-wrap .step-box .step-img[data-v-114b9e20] {
  width: 824.793px;
  height: 1750.5px;
  -o-object-fit: contain;
     object-fit: contain;
  flex-shrink: 0;
  position: absolute;
  left: 0;
  top: 0;
}
.container .main-content .step-wrap .item-wrap[data-v-114b9e20] {
  width: 100%;
  padding-top: 260px;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 284px;
  align-items: flex-end;
}
.container .main-content .step-wrap .item-wrap .item[data-v-114b9e20] {
  width: 370px;
  display: flex;
  align-items: flex-end;
  gap: 14px;
}
.container .main-content .step-wrap .item-wrap .item img[data-v-114b9e20] {
  height: 51px;
  -o-object-fit: contain;
     object-fit: contain;
  flex-shrink: 0;
}
.container .main-content .step-wrap .item-wrap .item .name[data-v-114b9e20] {
  color: #3f3e3e;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 32px;
  /* 133.333% */
}
.container .main-content .app-wrap[data-v-114b9e20] {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  gap: 58px;
  align-items: center;
}
.container .main-content .app-wrap .word-wrap[data-v-114b9e20] {
  max-width: 442px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.container .main-content .app-wrap .word-wrap .title[data-v-114b9e20] {
  color: #282004;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 52px;
  /* 130% */
}
.container .main-content .app-wrap .word-wrap .content[data-v-114b9e20] {
  color: #3f3e3e;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  /* 200% */
}
.container .main-content .app-wrap .word-wrap .home-btn[data-v-114b9e20] {
  width: -moz-fit-content;
  width: fit-content;
  padding: 16px 24px;
  box-sizing: border-box;
  margin-top: 24px;
  margin-bottom: 32px;
  background: #fed440;
  border-radius: 27px;
  font-size: 14px;
  font-weight: 600;
  color: #282004;
  text-align: center;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.container .main-content .app-wrap .word-wrap .home-btn img[data-v-114b9e20] {
  width: 24px;
  height: 16px;
}
.container .main-content .app-wrap .word-wrap .store[data-v-114b9e20] {
  display: flex;
  width: 650px;
}
.container .main-content .app-wrap .word-wrap .store button[data-v-114b9e20] {
  background: none;
  border: none;
}
.container .main-content .app-wrap .word-wrap .store img[data-v-114b9e20]:not(:last-child) {
  cursor: pointer;
}
.container .main-content .app-wrap .word-wrap .store img[data-v-114b9e20] {
  width: 110px;
  margin-right: 8px;
  cursor: pointer;
}
.container .main-content .app-wrap .app-img[data-v-114b9e20] {
  height: 430px;
  -o-object-fit: contain;
     object-fit: contain;
  flex-shrink: 0;
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/comps/help.vue?vue&type=style&index=0&id=5bb9d9b4&lang=less&scoped=true ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.container[data-v-5bb9d9b4] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  background: #fff;
}
.container .top-banner[data-v-5bb9d9b4] {
  width: 100%;
  box-sizing: border-box;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/495457ef9e9f671b1b9974cb4f365b6b.png) no-repeat center / cover #fffcf2;
  position: relative;
}
.container .top-banner .banner__container[data-v-5bb9d9b4] {
  width: 1152px;
  padding: 40px 80px 60px 34px;
  box-sizing: border-box;
  margin: auto;
  display: flex;
  justify-content: center;
  gap: 225px;
  align-items: center;
}
.container .top-banner .banner__desc[data-v-5bb9d9b4] {
  color: #282004;
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 125% */
}
.container .top-banner .banner__desc .help-title2[data-v-5bb9d9b4] {
  color: #ffba00;
}
.container .top-banner .banner__desc .help-title3[data-v-5bb9d9b4] {
  margin-top: 24px;
  color: #808691;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
}
.container .top-banner .banner__img[data-v-5bb9d9b4] {
  width: 480px;
  height: 480px;
}
.container .main-content[data-v-5bb9d9b4] {
  width: 100%;
  padding: 60px 0 80px;
  display: flex;
  flex-direction: column;
  background: #fff;
  align-items: center;
}
.container .main-content .main-container[data-v-5bb9d9b4] {
  width: 985px;
  margin: auto;
  display: flex;
  flex-direction: column;
}
.container .main-content .main-container .menu-wrap[data-v-5bb9d9b4] {
  width: 100%;
  height: 72px;
  padding: 8px;
  box-sizing: border-box;
  border-radius: 44px;
  border: 1px solid #ececec;
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.container .main-content .main-container .menu-wrap .menu-item[data-v-5bb9d9b4] {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  padding: 16px 20px;
  box-sizing: border-box;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  background: none;
  border: none;
  outline: none;
  margin: 0;
}
.container .main-content .main-container .menu-wrap .menu-item img[data-v-5bb9d9b4] {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}
.container .main-content .main-container .menu-wrap .menu-item span[data-v-5bb9d9b4] {
  color: #282004;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-align: left;
  white-space: nowrap;
}
.container .main-content .main-container .menu-wrap .active-menu[data-v-5bb9d9b4] {
  border-radius: 32px;
  background: #fed440;
}
.container .main-content .main-container .menu-wrap .active-menu span[data-v-5bb9d9b4] {
  text-shadow: 0 0 1px black;
}
.container .main-content .main-container .content-wrap[data-v-5bb9d9b4] {
  width: 100%;
  margin-top: 65px;
  display: flex;
  flex-direction: column;
  gap: 80px;
}
.container .main-content .main-container .content-wrap .content-block[data-v-5bb9d9b4] {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.container .main-content .main-container .content-wrap .content-block .title[data-v-5bb9d9b4] {
  color: #282004;
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  padding-bottom: 48px;
}
.container .main-content .main-container .content-wrap .content-block .content-item[data-v-5bb9d9b4] {
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 1px solid #dde1e9;
}
.container .main-content .main-container .content-wrap .content-block .content-item[data-v-5bb9d9b4]:last-child {
  border-bottom: none;
  margin-bottom: 0;
}
.container .main-content .main-container .content-wrap .content-block .content-item .item-title[data-v-5bb9d9b4] {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-content: center;
  cursor: pointer;
  background: none;
  border: none;
}
.container .main-content .main-container .content-wrap .content-block .content-item .item-title span[data-v-5bb9d9b4] {
  color: #282004;
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  /* 133.333% */
  text-align: left;
}
.container .main-content .main-container .content-wrap .content-block .content-item .item-title img[data-v-5bb9d9b4] {
  -o-object-fit: contain;
     object-fit: contain;
  height: 16px;
  flex-shrink: 0;
}
.container .main-content .main-container .content-wrap .content-block .content-item .item-detail[data-v-5bb9d9b4] {
  width: 80%;
  color: #50555c;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  /* 157.143% */
  padding-top: 16px;
  text-align: left;
}

/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/comps/us.vue?vue&type=style&index=0&id=4fdb055e&lang=less&scoped=true ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.form-item-select[data-v-4fdb055e]:hover {
  background-color: #f7f8fb;
}
.container[data-v-4fdb055e] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  background: #fff;
}
.container .top-banner[data-v-4fdb055e] {
  width: 100%;
  box-sizing: border-box;
  background: url(https://cdn-c1.sufinc.mx/static/mx_sufinc_h5_pdl/image/495457ef9e9f671b1b9974cb4f365b6b.png) no-repeat center / cover #fffcf2;
  position: relative;
}
.container .top-banner .banner__container[data-v-4fdb055e] {
  width: 1152px;
  padding: 50px 0 40px 34px;
  box-sizing: border-box;
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.container .top-banner .banner__desc[data-v-4fdb055e] {
  color: #282004;
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 125% */
}
.container .top-banner .banner__desc .about-title2[data-v-4fdb055e] {
  color: #ffba00;
}
.container .top-banner .banner__desc .about-title3[data-v-4fdb055e] {
  margin-top: 24px;
  color: #808691;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
}
.container .top-banner .banner__desc .home-btn[data-v-4fdb055e] {
  width: -moz-fit-content;
  width: fit-content;
  padding: 16px 24px;
  box-sizing: border-box;
  margin-top: 24px;
  margin-bottom: 40px;
  background: #fed440;
  border-radius: 27px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 600;
  color: #282004;
  text-align: center;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.container .top-banner .banner__desc .home-btn img[data-v-4fdb055e] {
  width: 24px;
  height: 16px;
}
.container .top-banner .banner__img[data-v-4fdb055e] {
  width: 477px;
  height: 467px;
}
.container .main-content[data-v-4fdb055e] {
  width: 100%;
  background: #fff;
  padding-bottom: 120px;
  box-sizing: border-box;
}
.container .main-content .menu-list[data-v-4fdb055e] {
  max-width: 1188px;
  margin: 0 auto 120px auto;
  width: 100%;
  height: 70px;
  display: flex;
  align-items: center;
}
.container .main-content .menu-list .menu-item[data-v-4fdb055e] {
  position: relative;
  margin-right: 40px;
  color: #3f3e3e;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  cursor: pointer;
  background: none;
  border: none;
}
.container .main-content .menu-list .line[data-v-4fdb055e] {
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 100%;
  height: 3px;
  background: #fed440;
}
.container .main-content .active-1[data-v-4fdb055e] {
  max-width: 1188px;
  margin: auto;
}
.container .main-content .active-1 img[data-v-4fdb055e] {
  width: 100%;
}
.container .main-content .active-2[data-v-4fdb055e] {
  max-width: 1188px;
  margin: auto;
}
.container .main-content .active-2 .active-2-div-1[data-v-4fdb055e] {
  padding: 24px 0 80px 0;
  border-top: 1px solid #dde1e9;
}
.container .main-content .active-2 .active-2-div-1 .p-1[data-v-4fdb055e] {
  color: #ffba00;
  font-size: 40px;
  font-weight: 700;
  line-height: 48px;
}
.container .main-content .active-2 .active-2-div-1 .p-2[data-v-4fdb055e] {
  margin-top: 24px;
  color: #808691;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
}
.container .main-content .active-2 .active-2-div-2[data-v-4fdb055e] {
  width: 100%;
  padding: 24px 0 0 0;
  border-top: 1px solid #dde1e9;
}
.container .main-content .active-2 .active-2-div-2 .p-1[data-v-4fdb055e] {
  color: #ffba00;
  font-size: 40px;
  font-weight: 700;
  line-height: 48px;
  margin-bottom: 24px;
}
.container .main-content .active-2 .active-2-div-2 .text-1[data-v-4fdb055e] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.container .main-content .active-2 .active-2-div-2 .text-1 .flex-col[data-v-4fdb055e] {
  width: 28%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.container .main-content .active-2 .active-2-div-2 .text-1 .flex-col .text-1-1[data-v-4fdb055e] {
  color: #282004;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
}
.container .main-content .active-2 .active-2-div-2 .text-1 .flex-col .text-1-2[data-v-4fdb055e] {
  margin-top: 12px;
  color: #808691;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
}
.container .main-content .main-container[data-v-4fdb055e] {
  max-width: 1188px;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 120px;
}
.container .main-content .main-container .item-wrap[data-v-4fdb055e] {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 34px;
}
.container .main-content .main-container .item-wrap .item[data-v-4fdb055e] {
  padding: 40px;
  box-sizing: border-box;
  width: 577px;
  height: 306px;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  align-items: inherit;
  background: #f7f8fb;
}
.container .main-content .main-container .item-wrap .item img[data-v-4fdb055e] {
  height: 90px;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .main-container .item-wrap .item .title[data-v-4fdb055e] {
  color: #282004;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  /* 140% */
  padding: 24px 0 12px;
}
.container .main-content .main-container .item-wrap .item .content[data-v-4fdb055e] {
  color: #808691;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 171.429% */
}
.container .main-content .main-container .box-wrap[data-v-4fdb055e] {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 72px;
  margin: auto;
}
.container .main-content .main-container .box-wrap .title[data-v-4fdb055e] {
  color: #282004;
  text-align: center;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
  /* 150% */
}
.container .main-content .main-container .box-wrap .box[data-v-4fdb055e] {
  display: flex;
  justify-content: center;
  gap: 53px;
}
.container .main-content .main-container .box-wrap .box .item[data-v-4fdb055e] {
  width: 466px;
  height: 387px;
  padding: 40px;
  border-radius: 24px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-shrink: 0;
  gap: 18px;
}
.container .main-content .main-container .box-wrap .box .item img[data-v-4fdb055e] {
  max-height: 58px;
  -o-object-fit: contain;
     object-fit: contain;
}
.container .main-content .main-container .box-wrap .box .item .content1[data-v-4fdb055e] {
  color: #282004;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 32px;
  /* 200% */
}
.container .main-content .main-container .box-wrap .box .item .content2[data-v-4fdb055e] {
  color: #282004;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 32px;
  /* 200% */
}
.container .main-content .main-container .box-wrap .box .bg1[data-v-4fdb055e] {
  background: #f7f8fb;
}
.container .main-content .main-container .box-wrap .box .bg1 img[data-v-4fdb055e] {
  height: 31px;
}
.container .main-content .main-container .box-wrap .box .bg2[data-v-4fdb055e] {
  background: #f7f8fb;
}
.container .main-content .main-container .join-us[data-v-4fdb055e] {
  width: 985px;
  display: flex;
  flex-direction: column;
}
.container .main-content .main-container .flex-box[data-v-4fdb055e] {
  width: 985px;
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.container .main-content .main-container .flex-box .left-img[data-v-4fdb055e] {
  width: 382px;
  height: 424px;
  flex-shrink: 0;
}
.container .main-content .main-container .flex-box .right-img[data-v-4fdb055e] {
  width: 452px;
  height: 411px;
  flex-shrink: 0;
}
.container .main-content .main-container .flex-box .word-wrap[data-v-4fdb055e] {
  display: flex;
  flex-direction: column;
}
.container .main-content .main-container .flex-box .word-wrap .btn[data-v-4fdb055e] {
  box-sizing: border-box;
  border-radius: 32px;
  width: 400px;
  padding: 16px 24px;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  cursor: pointer;
}
.container .main-content .main-container .flex-box .word-wrap .form-item[data-v-4fdb055e] {
  margin-bottom: 24px;
}
.container .main-content .main-container .flex-box .word-wrap .form-item .form-item-title[data-v-4fdb055e] {
  color: #282004;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  margin-bottom: 6px;
}
.container .main-content .main-container .flex-box .word-wrap .form-item .form-item-file[data-v-4fdb055e] {
  box-sizing: border-box;
  width: 400px;
  height: 88px;
  padding: 16px 20px;
  border-radius: 8px;
  border: 1px dashed #dde1e9;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.container .main-content .main-container .flex-box .word-wrap .form-item .form-item-file .custom-upload[data-v-4fdb055e] {
  cursor: pointer;
  padding: 8px 12px;
  border-radius: 8px;
  background: #ececec;
  color: #50555c;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin: auto;
  display: flex;
  align-items: center;
}
.container .main-content .main-container .flex-box .word-wrap .form-item .form-item-file .custom-upload img[data-v-4fdb055e] {
  width: 20px;
  height: 20px;
  margin-right: 8px;
}
.container .main-content .main-container .flex-box .word-wrap .form-item .form-item-input[data-v-4fdb055e] {
  width: 400px;
  padding: 16px 20px;
  border-radius: 8px;
  border: 1px solid #dde1e9;
  color: #282004;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  box-sizing: border-box;
}
.container .main-content .main-container .flex-box .word-wrap .form-item .form-item-input[data-v-4fdb055e]:focus {
  outline: none;
  border-color: #fed440;
}
.container .main-content .main-container .flex-box .word-wrap .form-item .form-item-input[data-v-4fdb055e]::-moz-placeholder {
  color: #b4b9c3;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.container .main-content .main-container .flex-box .word-wrap .form-item .form-item-input[data-v-4fdb055e]::placeholder {
  color: #b4b9c3;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.container .main-content .main-container .flex-box .word-wrap .title[data-v-4fdb055e] {
  color: #282004;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  /* 120% */
}
.container .main-content .main-container .flex-box .word-wrap .sub-title[data-v-4fdb055e] {
  color: #ffba00;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
}
.container .main-content .main-container .flex-box .word-wrap .content[data-v-4fdb055e] {
  margin-top: 24px;
  color: #3f3e3e;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  /* 200% */
}
.container .main-content .main-container .flex-box .word-wrap .home-btn[data-v-4fdb055e] {
  width: -moz-fit-content;
  width: fit-content;
  padding: 16px 24px;
  box-sizing: border-box;
  margin-top: 40px;
  margin-bottom: 40px;
  background: #fed440;
  border-radius: 27px;
  font-size: 14px;
  font-weight: 600;
  color: #282004;
  text-align: center;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.container .main-content .main-container .flex-box .word-wrap .home-btn img[data-v-4fdb055e] {
  width: 24px;
  height: 16px;
}
.container .main-content .main-container .center-flex[data-v-4fdb055e] {
  justify-content: center;
  gap: 160px;
}
.container .main-content .main-container .center-flex .word-wrap[data-v-4fdb055e] {
  width: 442px;
}

/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/comps/agreement.vue?vue&type=style&index=0&id=11eb1027&lang=less&scoped=true ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.container[data-v-11eb1027] {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  background: #fff;
  display: flex;
  flex-direction: column;
}
.container .main-content[data-v-11eb1027] {
  width: 985px;
  margin: auto;
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 80px 0;
  box-sizing: border-box;
}
.container .main-content .title[data-v-11eb1027] {
  color: #ffba00;
  font-family: Archivo;
  font-size: 64px;
  font-style: normal;
  font-weight: 700;
  line-height: 72px;
  /* 112.5% */
}
.container .main-content .sub-title[data-v-11eb1027] {
  color: #000;
  font-family: Archivo;
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 40px;
  /* 125% */
  margin-top: 24px;
}
.container .main-content .content[data-v-11eb1027] {
  margin-top: 80px;
  color: #000;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  /* 200% */
}
.container .main-content .home-btn[data-v-11eb1027] {
  width: -moz-fit-content;
  width: fit-content;
  padding: 16px 24px;
  box-sizing: border-box;
  margin: 80px auto 0;
  background: #fed440;
  border-radius: 27px;
  font-size: 14px;
  font-weight: 600;
  color: #282004;
  text-align: center;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.container .main-content .home-btn img[data-v-11eb1027] {
  width: 24px;
  height: 16px;
}

/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./node_modules/vue-loader/lib/index.js??vue-loader-options!./src/vue/view/sufinc-index/comps/contact.vue?vue&type=style&index=0&id=145e447d&lang=less&scoped=true ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.container[data-v-145e447d] {
  width: 100%;
  padding: 120px 0;
  height: -moz-fit-content;
  height: fit-content;
  background: #fff;
}
.container .main-content[data-v-145e447d] {
  width: 1200px;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 150px;
}
.container .main-content .cpeople[data-v-145e447d] {
  width: 480px;
  height: 480px;
}
.container .main-content .contact-right[data-v-145e447d] {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin-left: 150px;
}
.container .main-content .contact-right .contact-title[data-v-145e447d] {
  width: 256px;
  height: 68px;
  font-size: 40px;
  font-weight: bold;
  color: #202630;
  line-height: 68px;
  text-align: left;
}
.container .main-content .contact-right .contact-text[data-v-145e447d] {
  width: 430px;
  font-size: 20px;
  font-weight: 400;
  color: #808691;
  line-height: 28px;
  text-align: left;
  margin-bottom: 24px;
}
.container .main-content .contact-right .contact-mes[data-v-145e447d] {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
.container .main-content .contact-right .contact-mes .cphone[data-v-145e447d] {
  width: 20px;
  height: 20px;
}
.container .main-content .contact-right .contact-mes .cphone-text[data-v-145e447d] {
  width: 200px;
  height: 28px;
  font-size: 20px;
  font-weight: 400;
  color: #50555c;
  line-height: 28px;
  text-align: left;
  margin-left: 9px;
}