body, ol, ul, dl, li, dt, dd, h1, h2, h3, h4, h5, h6, p, th, td, dl, dd, form, fieldset, legend, input, textarea,select{
    margin: 0;
    padding: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}

html, body {
    height: 100%;
    font-family: "微软雅黑";
}

html {
    position: relative;
    margin: 0 auto;
}

body {
    position: relative;
    font-size: 14px;
    font-family: Helvetica, Tahoma, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
    background-color: #0e1f41;
    color: #282828;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

h1, h2, h3, h4, h5 {
    font-weight: normal;
    font-size: 14px;
}

a {
    color: #333;
    text-decoration: none;
    transition: color .2s ease-out;
}

a:hover {
    text-decoration: none;
}

em, i {
    font-style: normal;
}

ol, ul, dl, li, dt, dd {
    list-style: none
}

img {
    border: 0;
    vertical-align: middle
}
.box{
    /* border: 1px solid #215e75; */
    padding:0 14px;
}
.news{
    width: 39%;
    background: url(../img/news-bj.png) no-repeat center center;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
    box-sizing: border-box;
	transform: translate(-50%,0px) scale(0.9);
    position: absolute;
    left: 50%;
    top: -15px;
}
.news .news-top{
    width: 132px;
    margin: 0 auto;
    height: 224px;
    position: relative;
    padding-top: 30px;
}
.news .news-top ul li{
    height: 72px;
    color: #d4fdff;
    font-size: 12px;
    display: none;
    border: 1px solid #3d5f78;
    text-align: center;
    box-shadow: 0px 0px 6px #3d5f78;
    box-sizing: border-box;
    padding-top: 18px;
}
.news .news-top  .next {
    height: auto;
    overflow: hidden;
    position: absolute;
    left: -15px;
    width: 162px;
    background: url(../img/news-x.png) no-repeat center bottom;
}
.news .news-top  .next p{
    text-align: center; 
}
.news .news-top  .next p.p-text{color: #e0d189; font-size:18px; font-family: 'Regular'; padding-bottom: 10px;}
.news .news-top .set{
    border: 3px solid #dd6b66;
    padding-top: 0;;
    box-shadow: 0px 0px 4px #a16068;
    height: 72px;
    position: absolute;
    width: 132px;
    border-radius: 2px;
    bottom: 15px;
    left: -3px;
}
.news .news-top ul li.title div{
    height: 100%;
    box-shadow: 0px 0px 5px #4c738c;
    margin: 3px;
    box-sizing: border-box;
    padding: 10px 3px;
}
.news .news-top ul li:first-child,.news .news-top ul li span{
    display: block;
}
.display0{
    position: relative;
    animation:display0 2s;
    -moz-animation:display0 2s; /* Firefox */
    -webkit-animation:display0 2s; /* Safari and Chrome */
    -o-animation:display0 2s; /* Opera */
}
.display1{
    position: relative;
    animation:display1 2s;
    -moz-animation:display1 2s; /* Firefox */
    -webkit-animation:display1 2s; /* Safari and Chrome */
    -o-animation:display1 2s; /* Opera */
}
.display2{
    position: relative;
    animation:display2 2s;
    -moz-animation:display2 2s; /* Firefox */
    -webkit-animation:display2 2s; /* Safari and Chrome */
    -o-animation:display2 2s; /* Opera */
}
.display3{
    position: relative;
    animation:display3 2s;
    -moz-animation:display3 2s; /* Firefox */
    -webkit-animation:display3 2s; /* Safari and Chrome */
    -o-animation:display3 2s; /* Opera */
}
.display4{
    position: relative;
    animation:display4 2s;
    -moz-animation:display4 2s; /* Firefox */
    -webkit-animation:display4 2s; /* Safari and Chrome */
    -o-animation:display4 2s; /* Opera */
}
.display5{
    position: relative;
    animation:display5 2s;
    -moz-animation:display5 2s; /* Firefox */
    -webkit-animation:display5 2s; /* Safari and Chrome */
    -o-animation:display5 2s; /* Opera */
}
.display6{
    position: relative;
    animation:display6 2s;
    -moz-animation:display6 2s; /* Firefox */
    -webkit-animation:display6 2s; /* Safari and Chrome */
    -o-animation:display6 2s; /* Opera */
}
.display7{
    position: relative;
    animation:display7 2s;
    -moz-animation:display7 2s; /* Firefox */
    -webkit-animation:display7 2s; /* Safari and Chrome */
    -o-animation:display7 2s; /* Opera */
}
.display8{
    position: relative;
    animation:display8 2s;
    -moz-animation:display8 2s; /* Firefox */
    -webkit-animation:display8 2s; /* Safari and Chrome */
    -o-animation:display8 2s; /* Opera */
}
.display9{
    position: relative;
    animation:display9 2s;
    -moz-animation:display9 2s; /* Firefox */
    -webkit-animation:display9 2s; /* Safari and Chrome */
    -o-animation:display9 2s; /* Opera */
}
.display10{
    position: relative;
    animation:display10 2s;
    -moz-animation:display10 2s; /* Firefox */
    -webkit-animation:display10 2s; /* Safari and Chrome */
    -o-animation:display10 2s; /* Opera */
}
.news-top ul li span:nth-child(2){
    color: #3be7f2;
    font-weight: bold;
    margin-top: 3px;
}
.news .news-bottom{
    height: auto;
    overflow: hidden;
    padding-bottom: 26px;
}
.news .news-bottom ul {
    width: 95%;
    margin: 0 auto;
    height: auto;
    overflow: hidden;
}
.news .news-bottom ul li{
    float: left;
    width: 48px;
    height: 42px;
    background-color: #dd6b66;
    color: #fff;
    text-align: center;
    line-height: 42px;
    font-size: 14px;
    font-weight: bold;
    margin-right: 15px;
    word-wrap:break-word;
    border-radius: 3px;
}
.news .news-bottom ul li.keyword{
    width: 40px;
    padding: 6px 4px;
    height: 30px;
    line-height: 14px;
    word-wrap:break-word ;
}
.news .news-bottom ul li:last-child{
    margin-right: 0;
}
.news .news-bottom ul li:nth-child(2){
    background-color: #6e958d;
}
.news .news-bottom ul li:nth-child(3){
    background-color: #9c954e;
}
.news .news-bottom ul li:nth-child(4){
    background-color: #267ecc;
}
.news .news-bottom ul li:nth-child(5){
    background-color: #994440;
}
.news .news-bottom ul li:nth-child(6){
    background-color: #489263;
}
.news .news-bottom ul li:nth-child(7){
    background-color: #1290ad;
}
.news .news-bottom ul li:nth-child(8){
    background-color: #b36892;
}
.news .news-bottom ul li:nth-child(9){
    background-color: #50b4a4;
}
.news .news-bottom ul li:nth-child(10){
    background-color: #475ebd;
}
.news .news-bottom ul li:nth-child(11){
    background-color: #458058;
}
@media screen and (max-width: 1910px){
    .news{
        width: 708px;
    }
    .news .news-bottom ul {
        width: 100%;
    }
}
/* 动画 */
@keyframes display0
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(-315px) translateY(210px)   scale(.3) ;
        transform: translateX(-315px) translateY(210px)  scale(.3);
    }
}
@keyframes display1
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(-250px) translateY(210px)   scale(.3) ;
        transform: translateX(-250px) translateY(210px)  scale(.3);
    }
}
@keyframes display2
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(-190px) translateY(210px)   scale(.3) ;
        transform: translateX(-190px) translateY(210px)  scale(.3);
    }
}
@keyframes display3
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(-125px) translateY(210px)   scale(.3) ;
        transform: translateX(-125px) translateY(210px)  scale(.3);
    }
}
@keyframes display4
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(-62px) translateY(210px)   scale(.3) ;
        transform: translateX(-62px) translateY(210px)  scale(.3);
    }
}
@keyframes display5
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(0px) translateY(210px)   scale(.3) ;
        transform: translateX(0px) translateY(210px)  scale(.3);
    }
}
@keyframes display6
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(65px) translateY(210px)   scale(.3) ;
        transform: translateX(65px) translateY(210px)  scale(.3);
    }
}
@keyframes display7
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(125px) translateY(210px)   scale(.3) ;
        transform: translateX(125px) translateY(210px)  scale(.3);
    }
}
@keyframes display8
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(190px) translateY(210px)   scale(.3) ;
        transform: translateX(190px) translateY(210px)  scale(.3);
    }
}
@keyframes display9
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(252px) translateY(210px)   scale(.3) ;
        transform: translateX(252px) translateY(210px)  scale(.3);
    }
}
@keyframes display10
{
    0% {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
    65% {
        -webkit-transform: translateY(135px)  scale(1);
        transform: translateY(135px)  scale(1);
    }
    100%{
        -webkit-transform:translateX(315px) translateY(210px)   scale(.3) ;
        transform: translateX(315px) translateY(210px)  scale(.3);
    }
}
