@media (max-width: 768px) {
  html, body, #app {
    min-width: 0 !important;
    width: 100% !important;
    overflow-x: hidden !important;
  }

  .main {
    min-width: 0 !important;
  }

  #app {
    overflow-x: hidden !important;
  }

  .left-menu-wrapper,
  .child-menu-wrapper {
    position: static !important;
    width: 100% !important;
    left: 0 !important;
    top: auto !important;
    bottom: auto !important;
    height: auto !important;
  }

  .menu-wrapper {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
  }

  .menu-wrapper .nav-wrapper .nav-ul {
    display: flex !important;
    flex-wrap: wrap;
  }

  .menu-wrapper .nav-wrapper .nav-ul li {
    width: 50% !important;
    padding-left: 12px !important;
  }

  .right-content,
  .right-big .right-content {
    width: 100% !important;
    margin: 0 !important;
    height: auto !important;
  }

  .right-content-box,
  .subject-wrap {
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    height: auto !important;
  }

  .common-header {
    height: auto !important;
    line-height: 1.4 !important;
    padding: 12px 12px 10px !important;
  }

  .common-header .breadcrumb {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .common-header .header-navbar {
    position: static !important;
    width: 100% !important;
    justify-content: flex-start !important;
    flex-wrap: wrap;
    gap: 8px;
  }

  .common-header .el-tabs-container {
    margin-left: 0 !important;
    padding-left: 0 !important;
    border-left: 0 !important;
    width: 100% !important;
    overflow-x: auto;
  }

  .subject-wrap > div,
  .home-container,
  .first,
  .product-box,
  .address-contnet,
  .confirm-box,
  .confirm-product,
  .set-content,
  .transfer-contnet,
  .upgrade-box,
  .income-contnet,
  .query-contnet,
  .password-contnet,
  .member-contnet,
  .home-top,
  .home-bottom,
  .home-right,
  .home-left {
    margin: 0 !important;
    padding: 12px !important;
    height: auto !important;
  }

  .el-table {
    width: 100% !important;
  }

  .el-table__body-wrapper,
  .el-table__header-wrapper {
    overflow-x: auto;
  }

  .pagination,
  .pagination .el-pagination {
    float: none !important;
    text-align: left !important;
  }

  .bottom-cart {
    position: sticky !important;
    bottom: 0 !important;
    height: auto !important;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 12px !important;
  }

  .bottom-cart .submit-btn {
    width: 100% !important;
  }

  .subject-wrap,
  .subject-wrap .home-container,
  .subject-wrap .confirm-box,
  .subject-wrap .product-box {
    height: auto !important;
    min-height: calc(100vh - 100px) !important;
  }

  .confirm-title {
    height: auto !important;
    line-height: 1.4 !important;
    padding: 10px 12px !important;
    flex-wrap: wrap;
    gap: 6px;
  }

  .confirm-product .product-box-title,
  .set-content .section-title,
  .home-bottom .home-b-title,
  .home-right .label-title {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    margin-bottom: 12px !important;
  }

  .address-info {
    width: 100% !important;
    margin-right: 0 !important;
    height: auto !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .home-right,
  .home-top,
  .home-bottom {
    width: 100% !important;
  }

  .transfer-contnet .info-block,
  .home-bottom .form-table .form-table-item,
  .confirm-product .address-info,
  .set-content .label-box,
  .set-content .max-w460,
  .set-content .max-w260 {
    width: 100% !important;
  }

  .info-block {
    margin-right: 0 !important;
    margin-bottom: 12px !important;
    height: auto !important;
  }

  .label-box.d-s-c {
    flex-wrap: wrap !important;
    height: auto !important;
  }

  .top-group {
    padding: 8px !important;
  }

  .top-group .group-item {
    min-width: 88px !important;
    padding: 0 12px !important;
  }

  .el-dialog {
    width: calc(100vw - 24px) !important;
    max-width: 100% !important;
    margin: 12px auto !important;
  }

  .el-dialog__body {
    padding: 12px !important;
  }

  .el-form-item__content .max-w260,
  .el-form-item__content .max-w460,
  .el-form-item__content .ww100 {
    width: 100% !important;
  }

  .el-radio-group {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px;
  }

  .home-container {
    flex-direction: column !important;
  }

  .home-left {
    margin-right: 0 !important;
    gap: 12px;
  }

  .home-bottom .form-table .form-table-item {
    padding: 0 12px !important;
  }

  .pic[data-v-225b8e1a],
  .pic .pic-img[data-v-225b8e1a] {
    width: 100% !important;
    height: auto !important;
  }

  .upload-wrap-inline .fileContainer,
  .fileContainer {
    padding-left: 0 !important;
  }

  .fileContainer .file-type {
    position: static !important;
    width: 100% !important;
    height: auto !important;
  }

  .fileContainer .file-content {
    height: auto !important;
  }
}


html.device-mobile,
html.device-mobile body,
html.device-mobile #app {
  width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
}

html.device-mobile .main,
html.device-mobile .right-content,
html.device-mobile .right-content-box,
html.device-mobile .subject-wrap {
  min-width: 0 !important;
  width: 100% !important;
}

html.device-mobile .left-menu-wrapper,
html.device-mobile .child-menu-wrapper,
html.device-mobile .menu-wrapper {
  position: static !important;
  width: 100% !important;
  height: auto !important;
}

html.device-mobile .right-content {
  margin: 0 !important;
}

html.device-mobile .common-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  padding: 10px 12px !important;
}

html.device-mobile .common-header .breadcrumb,
html.device-mobile .common-header .header-navbar {
  position: static !important;
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

html.device-mobile .common-header .header-navbar {
  justify-content: flex-start !important;
}

html.device-mobile .subject-wrap > div,
html.device-mobile .home-container,
html.device-mobile .first,
html.device-mobile .product-box,
html.device-mobile .address-contnet,
html.device-mobile .confirm-box,
html.device-mobile .confirm-product,
html.device-mobile .set-content,
html.device-mobile .transfer-contnet,
html.device-mobile .upgrade-box,
html.device-mobile .income-contnet,
html.device-mobile .query-contnet,
html.device-mobile .password-contnet,
html.device-mobile .member-contnet,
html.device-mobile .home-top,
html.device-mobile .home-bottom,
html.device-mobile .home-right,
html.device-mobile .home-left {
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 12px !important;
}

html.device-mobile .el-form,
html.device-mobile .el-form-item,
html.device-mobile .el-form-item__content,
html.device-mobile .el-input,
html.device-mobile .el-select,
html.device-mobile .el-date-editor,
html.device-mobile .ww100,
html.device-mobile .max-w260,
html.device-mobile .max-w460 {
  width: 100% !important;
  max-width: 100% !important;
}

html.device-mobile .el-form-item__label {
  width: 100% !important;
  text-align: left !important;
  padding-right: 0 !important;
  margin-bottom: 6px !important;
}

html.device-mobile .el-form-item__content {
  margin-left: 0 !important;
}

html.device-mobile .el-table,
html.device-mobile .el-table__header-wrapper,
html.device-mobile .el-table__body-wrapper {
  width: 100% !important;
  overflow-x: auto !important;
}

html.device-mobile .el-dialog {
  width: calc(100vw - 24px) !important;
  max-width: calc(100vw - 24px) !important;
  margin: 12px auto !important;
}

html.device-mobile .bottom-cart {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 30 !important;
  height: auto !important;
  padding: 10px 12px !important;
  flex-wrap: wrap !important;
}

html.device-mobile .bottom-cart .submit-btn {
  width: 100% !important;
}

html.device-mobile .login-container-box {
  width: calc(100vw - 24px) !important;
  max-width: 420px !important;
  padding: 18px 16px !important;
  box-sizing: border-box !important;
}

html.device-mobile .login-bg {
  min-height: 100vh !important;
  background-size: cover !important;
  background-position: center center !important;
}

html.device-mobile .login-container-box .title {
  font-size: 22px !important;
  margin-bottom: 16px !important;
}

html.device-mobile .login-container-box .left-img-input,
html.device-mobile .login-container-box .el-input,
html.device-mobile .login-container-box .l-input,
html.device-mobile .login-container-box .logins {
  width: 100% !important;
}

html.device-mobile .login-container-box .d-b-c {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 10px !important;
}