@import "../../style/CommonStyle.module.less";
@import "../../style/utils.module.less";

.eventLayout {
  display: flex;
  height: 100%;
  width: 100%;
  flex-direction: column;
  align-items: center;
  padding-top: 80px;
  text-align: center;

  .textLayer {
    line-height: normal;
  }
  .title {
    color: #2e2e2e;
    .font (@arialFontBold, 64px);
  }
  .date {
    .font (@arialFontBold, 38px);
    color: @COLOR_GRAY06;
    padding: 10px 0 30px 0;
  }
  .description {
    .font (@arialFontBold, 30px);
    color: @COLOR_GRAY06;
    white-space: pre-line;

    .pointColor {
      color: #c91d53;
    }
  }

  .BtnLayer {
    .flex();
    margin: 25px 0 0px;
    padding-top: 30px;

    .agreeBtn {
      min-width: 340px;
      height: 80px;
    }
  }

  .bottomBtnLayer {
    position: fixed;
    top: 788px;
    .termsBtn {
      width: 440px;
      height: 80px;
      &:hover,
      &:active,
      &:focus-within,
      &:focus {
        color: @PRIMARY_COLOR_RED;
      }
      .font (@arialFont, 34px);
      color: @COLOR_GRAY06;
      letter-spacing: -1px;
    }
  }
}
/* terms */
.termsPopup {
  .introTermsConts {
    background-color: @COLOR_WHITE;
    font-size: 30px;
    border: 1px solid @COLOR_GRAY02;
    color: @COLOR_BLACK;
    border-radius: 4px;
    white-space: pre-wrap;

    .termsTitle {
      font-family: @baseFontBold;
      border-bottom: 1px solid @COLOR_GRAY02;
      padding: 20px 30px;
    }

    .termsDesc {
      padding: 30px;
      line-height: 50px;
    }
  }
}
