* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  --hx-red: #B21E28;
}

ul,
ol,
li {
  padding-left: 0;
  list-style-type: none;
}

a {
  text-decoration: none;
  color: inherit;
}

table {
  border-collapse: collapse;
}

em {
  font-style: normal;
}

html {
  /* font-size: 13.3333px; */
  width: 100%;
  height: 100%;
  color: #333333;
}

body {
  font-family: "微软雅黑", "sans-serif", "Arial";
  height: 100%;
}

.font12 {
  font-size: 12px;
}

.font14 {
  font-size: 14px;
}

.font16 {
  font-size: 16px;
}

.font18 {
  font-size: 18px;
}

.font20 {
  font-size: 20px;
}

.font24 {
  font-size: 24px;
}

.font28 {
  font-size: 28px;
}

.font32 {
  font-size: 32px;
}

.font36 {
  font-size: 36px;
}

.font40 {
  font-size: 40px;
}

.font48 {
  font-size: 48px;
}

.font56 {
  font-size: 56px;
}

.font64 {
  font-size: 64px;
}

.lh16 {
  line-height: 16px;
}

.lh20 {
  line-height: 20px;
}

.lh24 {
  line-height: 24px;
}

.lh28 {
  line-height: 28px;
}

.lh32 {
  line-height: 32px;
}

.lh36 {
  line-height: 36px;
}

.lh40 {
  line-height: 40px;
}

.lh48 {
  line-height: 48px;
}

.lh56 {
  line-height: 56px;
}

.lh64 {
  line-height: 64px;
}

.mt4 {
  margin-top: 4px;
}

.mt8 {
  margin-top: 8px;
}

.mt12 {
  margin-top: 12px;
}

.mt16 {
  margin-top: 16px;
}

.mt20 {
  margin-top: 20px;
}

.mt24 {
  margin-top: 24px;
}

.mt28 {
  margin-top: 28px;
}

.mt32 {
  margin-top: 32px;
}

.mt36 {
  margin-top: 36px;
}

.mt40 {
  margin-top: 40px;
}

.mt48 {
  margin-top: 48px;
}

.mt56 {
  margin-top: 56px;
}

.mt64 {
  margin-top: 64px;
}

.mr4 {
  margin-right: 4px;
}

.mr8 {
  margin-right: 8px;
}

.mr12 {
  margin-right: 12px;
}

.mr16 {
  margin-right: 16px;
}

.mr20 {
  margin-right: 20px;
}

.mr24 {
  margin-right: 24px;
}

.mr28 {
  margin-right: 28px;
}

.mr32 {
  margin-right: 32px;
}

.mr36 {
  margin-right: 36px;
}

.mr40 {
  margin-right: 40px;
}

.mr48 {
  margin-right: 48px;
}

.mr56 {
  margin-right: 56px;
}

.mr64 {
  margin-right: 64px;
}

.mb4 {
  margin-bottom: 4px;
}

.mb8 {
  margin-bottom: 8px;
}

.mb12 {
  margin-bottom: 12px;
}

.mb16 {
  margin-bottom: 16px;
}

.mb20 {
  margin-bottom: 20px;
}

.mb24 {
  margin-bottom: 24px;
}

.mb28 {
  margin-bottom: 28px;
}

.mb32 {
  margin-bottom: 32px;
}

.mb36 {
  margin-bottom: 36px;
}

.mb40 {
  margin-bottom: 40px;
}

.mb48 {
  margin-bottom: 48px;
}

.mb56 {
  margin-bottom: 56px;
}

.mb64 {
  margin-bottom: 64px;
}

.ml4 {
  margin-left: 4px;
}

.ml8 {
  margin-left: 8px;
}

.ml12 {
  margin-left: 12px;
}

.ml16 {
  margin-left: 16px;
}

.ml20 {
  margin-left: 20px;
}

.ml24 {
  margin-left: 24px;
}

.ml28 {
  margin-left: 28px;
}

.ml32 {
  margin-left: 32px;
}

.ml36 {
  margin-left: 36px;
}

.ml40 {
  margin-left: 40px;
}

.ml48 {
  margin-left: 48px;
}

.ml56 {
  margin-left: 56px;
}

.ml64 {
  margin-left: 64px;
}

.pt4 {
  padding-top: 4px;
}

.pt8 {
  padding-top: 8px;
}

.pt12 {
  padding-top: 12px;
}

.pt16 {
  padding-top: 16px;
}

.pt20 {
  padding-top: 20px;
}

.pt24 {
  padding-top: 24px;
}

.pt28 {
  padding-top: 28px;
}

.pt32 {
  padding-top: 32px;
}

.pt36 {
  padding-top: 36px;
}

.pt40 {
  padding-top: 40px;
}

.pt48 {
  padding-top: 48px;
}

.pt56 {
  padding-top: 56px;
}

.pt64 {
  padding-top: 64px;
}

.pr4 {
  padding-right: 4px;
}

.pr8 {
  padding-right: 8px;
}

.pr12 {
  padding-right: 12px;
}

.pr16 {
  padding-right: 16px;
}

.pr20 {
  padding-right: 20px;
}

.pr24 {
  padding-right: 24px;
}

.pr28 {
  padding-right: 28px;
}

.pr32 {
  padding-right: 32px;
}

.pr36 {
  padding-right: 36px;
}

.pr40 {
  padding-right: 40px;
}

.pr48 {
  padding-right: 48px;
}

.pr56 {
  padding-right: 56px;
}

.pr64 {
  padding-right: 64px;
}

.pb4 {
  padding-bottom: 4px;
}

.pb8 {
  padding-bottom: 8px;
}

.pb12 {
  padding-bottom: 12px;
}

.pb16 {
  padding-bottom: 16px;
}

.pb20 {
  padding-bottom: 20px;
}

.pb24 {
  padding-bottom: 24px;
}

.pb28 {
  padding-bottom: 28px;
}

.pb32 {
  padding-bottom: 32px;
}

.pb36 {
  padding-bottom: 36px;
}

.tac {
  text-align: center;
}

.tal {
  text-align: left;
}

.tar {
  text-align: right;
}

.fadeLeft {
  opacity: 0;
  transform: translateX(-5rem);
}

.fadeRight {
  opacity: 0;
  transform: translateX(5rem);
}

.fadeUp {
  opacity: 0;
  transform: translateY(-5rem);
}

.fadeDown {
  opacity: 0;
  transform: translateY(5rem);
}

.fadeLeft.animate {
  opacity: 1;
  transform: translateX(0);
  transition: all 0.5s;
}

.fadeRight.animate {
  opacity: 1;
  transform: translateX(0);
  transition: all 0.5s;
}

.fadeDown.animate {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.5s;
}

.fadeUp.animate {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.5s;
}

/* 媒体查询 - 屏幕宽度 <= 1300px 时调整根字体大小 */
@media (max-width: 768px) {
  body {
    min-width: 100%;
  }

  /* Font Sizes */
  .font12 {
    font-size: 0.75rem;
    /* 12px */
  }

  .font14 {
    font-size: 0.875rem;
    /* 14px */
  }

  .font16 {
    font-size: 1rem;
    /* 16px */
  }

  .font18 {
    font-size: 1.125rem;
    /* 18px */
  }

  .font20 {
    font-size: 1.25rem;
    /* 20px */
  }

  .font24 {
    font-size: 1.5rem;
    /* 24px */
  }

  .font28 {
    font-size: 1.75rem;
    /* 28px */
  }

  .font32 {
    font-size: 2rem;
    /* 32px */
  }

  .font36 {
    font-size: 2.25rem;
    /* 36px */
  }

  .font40 {
    font-size: 2.5rem;
    /* 40px */
  }

  .font48 {
    font-size: 3rem;
    /* 48px */
  }

  .font56 {
    font-size: 3.5rem;
    /* 56px */
  }

  .font64 {
    font-size: 4rem;
    /* 64px */
  }

  /* Line Heights */
  .lh16 {
    line-height: 1rem;
    /* 16px */
  }

  .lh20 {
    line-height: 1.25rem;
    /* 20px */
  }

  .lh24 {
    line-height: 1.5rem;
    /* 24px */
  }

  .lh28 {
    line-height: 1.75rem;
    /* 28px */
  }

  .lh32 {
    line-height: 2rem;
    /* 32px */
  }

  .lh36 {
    line-height: 2.25rem;
    /* 36px */
  }

  .lh40 {
    line-height: 2.5rem;
    /* 40px */
  }

  .lh48 {
    line-height: 3rem;
    /* 48px */
  }

  .lh56 {
    line-height: 3.5rem;
    /* 56px */
  }

  .lh64 {
    line-height: 4rem;
    /* 64px */
  }

  /* Margins */
  .mt4 {
    margin-top: 0.25rem;
    /* 4px */
  }

  .mt8 {
    margin-top: 0.5rem;
    /* 8px */
  }

  .mt12 {
    margin-top: 0.75rem;
    /* 12px */
  }

  .mt16 {
    margin-top: 1rem;
    /* 16px */
  }

  .mt20 {
    margin-top: 1.25rem;
    /* 20px */
  }

  .mt24 {
    margin-top: 1.5rem;
    /* 24px */
  }

  .mt28 {
    margin-top: 1.75rem;
    /* 28px */
  }

  .mt32 {
    margin-top: 2rem;
    /* 32px */
  }

  .mt36 {
    margin-top: 2.25rem;
    /* 36px */
  }

  .mt40 {
    margin-top: 2.5rem;
    /* 40px */
  }

  .mt48 {
    margin-top: 3rem;
    /* 48px */
  }

  .mt56 {
    margin-top: 3.5rem;
    /* 56px */
  }

  .mt64 {
    margin-top: 4rem;
    /* 64px */
  }

  .mr4 {
    margin-right: 0.25rem;
    /* 4px */
  }

  .mr8 {
    margin-right: 0.5rem;
    /* 8px */
  }

  .mr12 {
    margin-right: 0.75rem;
    /* 12px */
  }

  .mr16 {
    margin-right: 1rem;
    /* 16px */
  }

  .mr20 {
    margin-right: 1.25rem;
    /* 20px */
  }

  .mr24 {
    margin-right: 1.5rem;
    /* 24px */
  }

  .mr28 {
    margin-right: 1.75rem;
    /* 28px */
  }

  .mr32 {
    margin-right: 2rem;
    /* 32px */
  }

  .mr36 {
    margin-right: 2.25rem;
    /* 36px */
  }

  .mr40 {
    margin-right: 2.5rem;
    /* 40px */
  }

  .mr48 {
    margin-right: 3rem;
    /* 48px */
  }

  .mr56 {
    margin-right: 3.5rem;
    /* 56px */
  }

  .mr64 {
    margin-right: 4rem;
    /* 64px */
  }

  .mb4 {
    margin-bottom: 0.25rem;
    /* 4px */
  }

  .mb8 {
    margin-bottom: 0.5rem;
    /* 8px */
  }

  .mb12 {
    margin-bottom: 0.75rem;
    /* 12px */
  }

  .mb16 {
    margin-bottom: 1rem;
    /* 16px */
  }

  .mb20 {
    margin-bottom: 1.25rem;
    /* 20px */
  }

  .mb24 {
    margin-bottom: 1.5rem;
    /* 24px */
  }

  .mb28 {
    margin-bottom: 1.75rem;
    /* 28px */
  }

  .mb32 {
    margin-bottom: 2rem;
    /* 32px */
  }

  .mb36 {
    margin-bottom: 2.25rem;
    /* 36px */
  }

  .mb40 {
    margin-bottom: 2.5rem;
    /* 40px */
  }

  .mb48 {
    margin-bottom: 3rem;
    /* 48px */
  }

  .mb56 {
    margin-bottom: 3.5rem;
    /* 56px */
  }

  .mb64 {
    margin-bottom: 4rem;
    /* 64px */
  }

  .ml4 {
    margin-left: 0.25rem;
    /* 4px */
  }

  .ml8 {
    margin-left: 0.5rem;
    /* 8px */
  }

  .ml12 {
    margin-left: 0.75rem;
    /* 12px */
  }

  .ml16 {
    margin-left: 1rem;
    /* 16px */
  }

  .ml20 {
    margin-left: 1.25rem;
    /* 20px */
  }

  .ml24 {
    margin-left: 1.5rem;
    /* 24px */
  }

  .ml28 {
    margin-left: 1.75rem;
    /* 28px */
  }

  .ml32 {
    margin-left: 2rem;
    /* 32px */
  }

  .ml36 {
    margin-left: 2.25rem;
    /* 36px */
  }

  .ml40 {
    margin-left: 2.5rem;
    /* 40px */
  }

  .ml48 {
    margin-left: 3rem;
    /* 48px */
  }

  .ml56 {
    margin-left: 3.5rem;
    /* 56px */
  }

  .ml64 {
    margin-left: 4rem;
    /* 64px */
  }

  /* Padding */
  .pt4 {
    padding-top: 0.25rem;
    /* 4px */
  }

  .pt8 {
    padding-top: 0.5rem;
    /* 8px */
  }

  .pt12 {
    padding-top: 0.75rem;
    /* 12px */
  }

  .pt16 {
    padding-top: 1rem;
    /* 16px */
  }

  .pt20 {
    padding-top: 1.25rem;
    /* 20px */
  }

  .pt24 {
    padding-top: 1.5rem;
    /* 24px */
  }

  .pt28 {
    padding-top: 1.75rem;
    /* 28px */
  }

  .pt32 {
    padding-top: 2rem;
    /* 32px */
  }

  .pt36 {
    padding-top: 2.25rem;
    /* 36px */
  }

  .pt40 {
    padding-top: 2.5rem;
    /* 40px */
  }

  .pt48 {
    padding-top: 3rem;
    /* 48px */
  }

  .pt56 {
    padding-top: 3.5rem;
    /* 56px */
  }

  .pt64 {
    padding-top: 4rem;
    /* 64px */
  }

  .pr4 {
    padding-right: 0.25rem;
    /* 4px */
  }

  .pr8 {
    padding-right: 0.5rem;
    /* 8px */
  }

  .pr12 {
    padding-right: 0.75rem;
    /* 12px */
  }

  .pr16 {
    padding-right: 1rem;
    /* 16px */
  }

  .pr20 {
    padding-right: 1.25rem;
    /* 20px */
  }

  .pr24 {
    padding-right: 1.5rem;
    /* 24px */
  }

  .pr28 {
    padding-right: 1.75rem;
    /* 28px */
  }

  .pr32 {
    padding-right: 2rem;
    /* 32px */
  }

  .pr36 {
    padding-right: 2.25rem;
    /* 36px */
  }

  .pr40 {
    padding-right: 2.5rem;
    /* 40px */
  }

  .pr48 {
    padding-right: 3rem;
    /* 48px */
  }

  .pr56 {
    padding-right: 3.5rem;
    /* 56px */
  }

  .pr64 {
    padding-right: 4rem;
    /* 64px */
  }

  .pb4 {
    padding-bottom: 0.25rem;
    /* 4px */
  }

  .pb8 {
    padding-bottom: 0.5rem;
    /* 8px */
  }

  .pb12 {
    padding-bottom: 0.75rem;
    /* 12px */
  }

  .pb16 {
    padding-bottom: 1rem;
    /* 16px */
  }

  .pb20 {
    padding-bottom: 1.25rem;
    /* 20px */
  }

  .pb24 {
    padding-bottom: 1.5rem;
    /* 24px */
  }

  .pb28 {
    padding-bottom: 1.75rem;
    /* 28px */
  }

  .pb32 {
    padding-bottom: 2rem;
    /* 32px */
  }

  .pb36 {
    padding-bottom: 2.25rem;
    /* 36px */
  }
}