@import '~@ucap/lg-scss/mixins';

.logout-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f3f4f5;
  background-image: url(/assets/images/ico/img_logout.png);
  background-position: 50% bottom;
  background-repeat: no-repeat;
  background-size: 90% auto;
  @include screen(xs) {
    background-size: 100% auto;
  }

  .logout-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    max-width: 80%;
    transform: translateY(-70%);
    .logout-title {
      display: block;
      width: 250px;
      height: 62px;
      text-align: center;
      background: url(/assets/images/ico/img_logout_text.svg);
    }

    .guide-text {
      font-size: 1.6em;
      color: #666;
      font-weight: 600;
      text-align: center;
      @include screen(xs) {
        font-size: 1.4em;
      }

      span {
        display: inline-flex;
        font-size: 0.7em;
        color: #999;
        font-weight: normal;
        margin-top: 0.7em;
      }
    }

    .guide-move {
      display: inline-flex;
      padding: 0.8em 1.4em;
      border-radius: 100px;
      background-color: #fd578a;
      color: #ffffff;
    }
  }
}