html,
body,
div,
span,
iframe,
map,
font,
img,
a img,
samp,
strong,
hr,
h1,
h2,
h3,
h4,
h5,
h6,
b,
p,
blockquote,
a,
address,
code,
dl,
dt,
dd,
ol,
ul,
li,
form,
label,
table,
tr,
td,
th {
    padding: 0;
    margin: 0;
    border: 0;
    font-weight: normal;
    font-family: 'Microsoft YaHei', Arial, Helvetica, sans-serif;
    list-style: none;
}

html,
body {
    position: relative;
    height: 100%;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    background: #fafafc;
}

img {
    border: 0;
}

a {
    text-decoration: none;
    color: #000;
}

a:hover {
    color: red;
}

.clear {
    clear: both;
}

.clearfix {
    zoom: 1;
}

.clearfix:after {
    content: '\20';
    display: block;
    height: 0;
    clear: both;
}

div {
    box-sizing: border-box;
}

/* 动画效果 */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(0.533rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideIn {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(0);
    }
}

@keyframes float {
    0% {
        transform: translateY(0rem);
    }
    50% {
        transform: translateY(-0.267rem);
    }
    100% {
        transform: translateY(0rem);
    }
}

/* 通用动画类 */
.animate-fade-in {
    animation: fadeIn 1s ease-out;
}

.animate-slide-in {
    animation: slideIn 0.8s ease-out;
}

.animate-float {
    animation: float 3s ease-in-out infinite;
}