html, body,* {
    /*font-family: "PingFang SC", "Microsoft YaHei", "Calibri", "opensans", "GothicArial", "San Francisco", 'Hiragino Sans GB', "Helvetica Neue", Helvetica, sans-serif;*/
    font-family: "Microsoft YaHei";
    margin: 0;
    padding: 0;
}
li {
    list-style: none;
}
a {
    color: black;
    text-decoration: none;
}
.BoxSizing {
    -moz-box-sizing: border-box; /*Firefox3.5+*/
    -webkit-box-sizing: border-box; /*Safari3.2+*/
    -o-box-sizing: border-box; /*Opera9.6*/
    -ms-box-sizing: border-box; /*IE8*/
    box-sizing: border-box; /*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
}
/* 定义 */
.flexbox{
    display: -webkit-box; /* 老版本语法: Safari, iOS, Android browser, older WebKit browsers. */
    display: -moz-box; /* 老版本语法: Firefox (buggy) */
    display: -ms-flexbox; /* 混合版本语法: IE 10 */
    display: -webkit-flex; /* 新版本语法: Chrome 21+ */
    display: flex; /* 新版本语法: Opera 12.1, Firefox 22+ */
}

/* 主轴居中 */
.justify-content-c {
    -webkit-box-pack: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    justify-content: center;
}

/* 主轴两端对齐 */
.justify-content-b {
    -webkit-box-pack: justify;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

/* 主轴两端留空对齐 */
.justify-content-a {
    -webkit-box-pack: justify;
    -moz-justify-content: space-around;
    -webkit-justify-content: space-around;
    justify-content: space-around;
}

/* 主轴end对齐 */
.flex-zEnd {
    -webkit-box-pack: end;
    -moz-justify-content: flex-end;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
}

/* 主轴start对齐 */
.flex-zStart {
    -webkit-box-pack: start;
    -moz-justify-content: start;
    -webkit-justify-content: start;
    justify-content: start;
}

/* 侧轴居中 */
.align-items-c {
    -webkit-box-align: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    align-items: center;
}

/* 侧轴start对齐 */
.flex-cStart {
    -webkit-box-align: start;
    -moz-align-items: start;
    -webkit-align-items: start;
    align-items: start;
}

/* 侧轴底部对齐 */
.flex-cEnd {
    -webkit-box-align: end;
    -moz-align-items: flex-end;
    -webkit-align-items: flex-end;
    align-items: flex-end;
}

/* 侧轴文本基线对齐 */
.flex-cBaseline {
    -webkit-box-align: baseline;
    -moz-align-items: baseline;
    -webkit-align-items: baseline;
    align-items: baseline;
}

/* 侧轴上下对齐并铺满 */
.flex-cStretch {
    -webkit-box-align: stretch;
    -moz-align-items: stretch;
    -webkit-align-items: stretch;
    align-items: stretch;
}

/* 主轴从上到下 */
.flex-zTopBottom {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

/* 主轴从下到上 */
.flex-zBottomTop {
    -webkit-box-pack: end;
    -webkit-box-direction: reverse;
    -webkit-box-orient: vertical;
    -moz-flex-direction: column-reverse;
    -webkit-flex-direction: column-reverse;
    flex-direction: column-reverse;
}

/* 主轴从左到右 */
.flex-zLeftRight {
    -webkit-box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
}

/* 主轴从右到左 */
.flex-zRightLeft {
    -webkit-box-pack: end;
    -webkit-box-direction: reverse;
    -webkit-box-orient: horizontal;
    -moz-flex-direction: row-reverse;
    -webkit-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

/* 是否允许子元素伸缩 */
.flex-grow {
    -webkit-box-flex: 1.0;
    -moz-flex-grow: 1;
    -webkit-flex-grow: 1;
    flex-grow: 1;
}
/* 子元素的显示次序 */
.flex-order{
    -webkit-box-ordinal-group: 1;
    -moz-order: 1;
    -webkit-order: 1;
    order: 1;
}
.flex-wrap {
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

.MaxWidth {
    max-width: 2100px;
    margin: 0px auto;
}
.MenuItem {
    color: #777777;
    font: 17px "Microsoft YaHei UI";
    text-align: center;
    cursor: pointer;
}
.MenuItem>li {
}
.MenuItem>li img {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.MenuItem>li .ChildMenu {
    height: 0;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
.MenuItem>li .UnderLine {
    width: 0;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    left: 50%;
    position: absolute;
}

.MenuItem>li span {
    color: white;
    font: 16px "Microsoft YaHei";
    /*text-shadow: 1px 1px 1px white;*/
}
.MenuItem>li:hover img {
    transform: rotate(90deg);
}
.MenuItem li:hover .ChildMenu1{
    height: 120px;
}
.MenuItem li:hover .ChildMenu3{
    height: 80px;
}
.MenuItem li:hover .UnderLine{
    width: 100%;
}
.ChildMenu li:hover {
    color: #864036 !important;
}