/*
rem 自适应布局
1rem = 4vw
viewport >= 750px 时，1rem = 750px / 100 * 4 = 30px（因为我们限制了 #app 的 max-width 为 750px）
25rem = #app 的 100% 宽

px 转 rem：
假设设计稿宽度为 375px，则设计稿标注的 1px 转换成 rem 为：
1 / 375 * 100 / 4 = 1 / 15 ~= 0.0666rem（保留小数后 4 位）

viewport = 375px 时，1rem = 15px
*/
html {
  box-sizing: border-box;
  font-size: 4vw;
}
@media (min-width: 750px) {
html {
    font-size: 30px;
}
}
*, *:before, *:after {
  box-sizing: inherit;
}
body {
  font-family: "Helvetica Neue", "Helvetica", "PingFang SC", "Hiragino Sans GB", "Noto Sans CJK SC", "Noto Sans CJK", "Source Han Sans", "WenQuanYi Micro Hei", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: #f2f2f2;
  margin: 0;
  font-size: 16px;
}
.mobile-wrapper {
  max-width: 750px;
  min-height: 100vh;
  margin: 0 auto;
  background: #fff;

  /* 建立 BFC，防止第一个子元素的 margin-top collapsing */
  overflow: hidden;

  /* 使 absolute 子元素基于此容器定位 */
  position: relative;
}
a {
  color: inherit;
  text-decoration: none;
}