/*标准字体大小（rem参照对象）设置为14像素*/
html {
  font-size: 14px;
}
/**
* 当`body`宽度大于`html`宽度时，某些浏览器会出现内部滚动条，所以给`html、body`设置宽度100%。
* 取消部分浏览器点击有阴影。
* 优化移动端滚动事件。
*/
html,
body {
  width: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}
/*移除浏览器默认的`margin、padding`*/
p,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
th,
td,
div,
pre,
body,
code,
form,
input,
legend,
button,
figure,
fieldset,
textarea,
blockquote {
  margin: 0;
  padding: 0;
}
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
/**
* `table`相邻单元格的边框间的距离设置为0。
* 设置`table`的边框为合并模式。
*/
table {
  border-spacing: 0;
  border-collapse: collapse;
}
/*移除浏览器部分元素的默认边框*/
img,
abbr,
input,
button,
acronym,
fieldset,
textarea {
  border: none;
}
/*因为`input`默认不继承父元素的居中样式，所以让`input`元素继承父元素的文本居中方式*/
input {
  text-align: inherit;
}
/*让`textarea`默认不可以放缩*/
textarea {
  resize: none;
}
/*因为部分浏览器默认的`q`标签的前后伪元素有多余样式，所以置空`q`标签前后伪元素*/
q::before,
q::after {
  content: '';
}
/**
* 由于以下元素的部分属性没有继承父节点样式，所以声明这些元素的这些属性为父元素的属性。
* 取消这些元素的`outline`样式。
*/
a,
h1,
h2,
h3,
h4,
h5,
h6,
input,
select,
button,
option,
textarea,
optgroup {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  font-style: inherit;
  line-height: inherit;
  color: inherit;
  outline: none;
}
/**
* 如果绝对定位元素，找不到被设置过定位信息的上级元素，那么这个元素就基于根节点定位，所以给`body`设置相对定位，让这些元素基于`body`定位。
* 设置网页基本字体颜色为`#666`(深灰色)。
* 设置网页背景颜色颜色为`#fff`（纯白色）。
* 使字体渲染更顺滑。
*/
body {
  font: 14px 'Helvetica Neue', Arial, 'Hiragino Sans GB', STHeiti, 'STHeiti Light [STXihei]', 'Microsoft Yahei', sans-serif;
  position: relative;
  color: #151515;
  background: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  line-height: 1em;
}
/*取消下面元素的默认文字装饰（下划线、中划线）*/
a,
del,
ins {
  text-decoration: none;
}
/*取消ol，ul默认列表样式*/
ol,
ul {
  list-style: none;
}
img {
  vertical-align: middle;
}
::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #888888;
}
:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #888888;
}
::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #888888;
}
:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #888888;
}
.font-0 {
  font-size: 0;
}
.clear::after {
  content: '';
  display: block;
  clear: both;
}
.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.flex-1 {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
/* basic style */
.close-ico {
  /* still bad on picking color */
  color: #a9a9a9;
  /* make a round button */
  border-radius: 12px;
  /* center text */
  line-height: 58px;
  text-align: center;
  height: 60px;
  width: 60px;
  font-size: 18px;
  padding: 1px;
  cursor: pointer;
}
/* use cross as close button */
.close-ico::before {
  content: "\2716";
}
/* place the button on top-right */
.close-ico {
  top: 0;
  right: 0;
  position: absolute;
}