html,
body {
    width: 100%;
    margin: 0;
    padding: 0;
    left: 0;
    top: 0;
    font-size: 100%; }

* {
    font-family: "microsoft yahei", Helvetica, sans-serif;
    color: #333447;
    line-height: 1.5; }

h1 {
    font-size: 2.5em; }

h2 {
    font-size: 2em; }

h3 {
    font-size: 1.375em; }

h4 {
    font-size: 1.125em; }

h5 {
    font-size: 1em; }

h6 {
    font-size: 0.875em; }

p {
    font-size: 1.125em;
    font-weight: 200;
    line-height: 1.8; }

.font-light {
    font-weight: 300; }

.font-regular {
    font-weight: 400; }

.font-heavy {
    font-weight: 700; }

.left {
    text-align: left; }

.right {
    text-align: right; }

.center {
    text-align: center;
    margin-left: auto;
    margin-right: auto; }

.justify {
    text-align: justify; }

.hidden-sm {
    display: none; }

.container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    clear: both;
}
@media only screen and (min-width: 20em) {
    .container {
        width: 100%; } }
@media only screen and (min-width: 33.75em) {
    .container {
        width: 80%; } }
@media only screen and (min-width: 60em) {
    .container {
        max-width: 85em;
        } }

.row {
    width: 100%;
    clear: both;
}

.row [class^="col"] {
    float: left;
    margin: 0.5em 2%;
    min-height: 0.125em;
    }

@media only screen and (min-width: 20em) {
    .row [class^="col"] {
        margin: 0.5em 1%;
        } }
.row::after {
    content: "";
    display: table;
    clear: both; }

.col-12 {
    width: 98%; }

.col-1-sm {
    width: 6.33333%; }

.col-2-sm {
    width: 14.66667%; }

.col-3-sm {
    width: 23%; }

.col-4-sm {
    width: 31.33333%; }

.col-5-sm {
    width: 39.66667%; }

.col-6-sm {
    width: 48%; }

.col-7-sm {
    width: 56.33333%; }

.col-8-sm {
    width: 64.66667%; }

.col-9-sm {
    width: 73%; }

.col-10-sm {
    width: 81.33333%; }

.col-11-sm {
    width: 89.66667%; }

.col-12-sm {
    width: 98%; }

@media only screen and (min-width: 45em) {
    .col-1 {
        width: 6.33333%; }

    .col-2 {
        width: 14.66667%; }

    .col-3 {
        width: 23%; }

    .col-4 {
        width: 31.33333%; }

    .col-5 {
        width: 40.66667%;
        }

    .col-6 {
        width: 48%; }

    .col-7 {
        width: 56.33333%; }

    .col-8 {
        width: 64.66667%; }

    .col-9 {
        width: 73%; }

    .col-10 {
        width: 81.33333%; }

    .col-11 {
        width: 89.66667%; }

    .col-12 {
        width: 98%; }

    .hidden-sm {
        display: block; } }



.col-7-ie{*width:54.33%}

