@media screen and (min-width: 1024px) {
  .no-pc {
    display: none !important;
  }
}
@media screen and (max-width: 1024px) {
  .no-tablet {
    display: none !important;
  }
  .stretch-width {
    width: 100%;
  }
  .stretch-two-third {
    width: 75%;
  }
  .stretch-half {
    width: 50%;
  }
  .stretch-mini {
    width: 25%;
  }
}
@media screen and (max-width: 800px) {
  .login-app-name.left,
  .login-app-name.right {
    position: fixed;
    top: 50px;
  }
  .no-tablet {
    display: none !important;
  }
  .stretch-width {
    width: 100%;
  }
  .stretch-two-third {
    width: 100%;
  }
  .stretch-half {
    width: 50%;
  }
  .stretch-mini {
    width: 25%;
  }
}
@media screen and (max-width: 768px) {
  .login-app-name.left,
  .login-app-name.right {
    position: fixed;
    top: 50px;
  }
  .no-tablet {
    display: none !important;
  }
  .stretch-width {
    width: 100%;
  }
  .stretch-two-third {
    width: 100%;
  }
  .stretch-half {
    width: 100%;
  }
  .stretch-mini {
    width: 50%;
  }
}
@media screen and (max-width: 640px) {
  .login-app-name.left,
  .login-app-name.right {
    position: fixed;
    top: 50px;
  }
  .no-phone {
    display: none !important;
  }
  .stretch-width {
    width: 100%;
  }
  .stretch-two-third {
    width: 100%;
  }
  .stretch-half {
    width: 100%;
  }
  .stretch-mini {
    width: 50%;
  }
}
@media screen and (max-width: 480px) {
  .login-app-name.left,
  .login-app-name.right {
    display: none;
  }
  .no-phone {
    display: none !important;
  }
  .stretch-width {
    width: 100%;
  }
  .stretch-two-third {
    width: 100%;
  }
  .stretch-half {
    width: 100%;
  }
  .stretch-mini {
    width: 100%;
  }
}