* {
    margin: 0;
    padding: 0;
    word-break: break-all;
    word-wrap: break-word;
    outline: none;
    resize: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html, body {
    color: #333;
    font-family: "microsoft yahei", "simsun", "arial", "helvetica", "sans-serif";
    text-align: left;
    width: 100%;
    height: 100%;
    overflow: hidden;
    /*background: #fff url(bg-logo.jpg) center center no-repeat;*/
    /*background-size: 60% auto;*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

img {
    border: 0;
    vertical-align: middle;
}

input, textarea {
    outline: none;
    resize: none;
}

a {
    text-decoration: none;
    outline: none;
    color: #333;
}

a:hover {
    color: #f84040;
}

a:focus, input:focus {
    outline: 0 none;
}

.ab {
    position: absolute;
    z-index: 10;
}

.re {
    position: relative;
    z-index: 1;
}

.fixed {
    position: fixed;
    z-index: 10;
}

.max {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.table {
    display: table;
    width: 100%;
    height: 100%;
}

.table-cell {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    height: 100%;
}

.vtop {
    vertical-align: top;
}

.vbottom {
    vertical-align: bottom;
}

.ov {
    overflow: hidden;
}

.none {
    display: none;
}

.sl {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.center {
    width: 96%;
    text-align: left;
    margin: 0 auto;
    height: auto;
}

.len100 {
    width: 100%;
    max-width: 100%;
}

.hei100 {
    height: 100%;
    max-height: 100%;
}

.max {
    height: 100%;
    width: 100%;
}

.l0 {
    left: 0;
}

.t0 {
    top: 0;
}

.left {
    float: left;
}

.right {
    float: right;
}

.clear {
    clear: both;
    height: 0;
    line-height: 0;
    padding: 0;
    margin: 0;
    zoom: 1;
}

.tr {
    text-align: right;
}

.tl {
    text-align: left;
}

.tc {
    text-align: center;
}

.tj {
    text-align: justify;
}

.b {
    border: 1px solid #ddd;
}

.red, .r {
    color: #f84040;
}

.blue {
    color: #0041d9;
}

.graybg {
    background-color: #eff2f4;
}

b.r {
    font-weight: normal;
}

.bold {
    font-weight: bold;
}

.pointer {
    cursor: pointer;
}

.not-allowed {
    cursor: not-allowed;
}

ul {
    list-style: none;
}

.nomargin {
    margin: 0;
}

.block {
    display: block;
}

.animate5, .animate {
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.padding0 {
    padding: 0;
}

.after:after {
    content: ' ';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.mtop10 {
    margin-top: 10px;
}

.mtop20 {
    margin-top: 20px;
}

.mtop30 {
    margin-top: 30px;
}

.mtop40 {
    margin-top: 40px;
}
.mtop50 {
    margin-top: 50px;
}

.mtop70 {
    margin-top: 70px;
}

.ptop70 {
    padding-top: 70px;
}

.ptop60 {
    padding-top: 60px;
}


/*全屏滑动插件*/

.swiper-container {
    width: 100%;
    height: 100%;
    text-align: center;
    color: #000;
}

.swiper-slide {
    overflow: hidden;
    width: 100%;
    height: 100%;
    font-size: .7rem;
    line-height: 1rem;
}

.swiper-slide .table-cell {
    background-color: #2A4771;
    /*background: url(bg-pub.jpg) 0 0 no-repeat;*/
    /*background-size: 100% 100%;*/
}

.pagination {
    position: absolute;
    z-index: 20;
    left: 18px;
    top: 50%;
    height: 100px;
    margin-top: -50px;
    z-index: 150;
}

.swiper-pagination-switch {
    display: block;
    margin: 0 0 6px;
    border: 1px solid #fff;
    cursor: pointer;
}

.pagination-hdp .swiper-pagination-switch {
    display: inline-block;
}

.swiper-active-switch {
    background-color: #fff;
}

.pagination-hdp {
    position: absolute;
    z-index: 30;
    left: 0;
    bottom: 40px;
    width: 100%;
    z-index: 150;
    height: 0;
    text-align: center;
    background: #f00;
}

.swiper-pagination-switch {
    width: 2px;
    height: 2px;
    position: relative;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: #fff;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    margin: 15px 0;
}

.pagination-hdp .swiper-pagination-switch {
    margin: 0 6px;
}

.swiper-active-switch {
    -webkit-transform: scale(2.5);
    -moz-transform: scale(2.5);
    -ms-transform: scale(2.5);
    -o-transform: scale(2.5);
    transform: scale(2.5);
    margin: 20px 0;
}

.pagination-hdp .swiper-active-switch {
    margin: 0 10px;
}


/*缩放动画*/

@-webkit-keyframes zoomIn2 {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(2, 2, 2);
        transform: scale3d(2, 2, 2)
    }
    100% {
        opacity: 1
    }
}

@keyframes zoomIn2 {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(2, 2, 2);
        -ms-transform: scale3d(2, 2, 2);
        transform: scale3d(2, 2, 2)
    }
    100% {
        opacity: 1
    }
}

.zoomIn2 {
    -webkit-animation-name: zoomIn2;
    animation-name: zoomIn2
}


/*音乐图标旋转动画*/

@keyframes xuanzhuan {
    from {}
    to {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes xuanzhuan {
    from {}
    to {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes xuanzhuan {
    from {}
    to {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes xuanzhuan {
    from {}
    to {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}


/*音乐*/

#music {
    width: 1.2rem;
    height: 1.2rem;
    background: url(music.png?5) center center no-repeat;
    background-size: 60% auto;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    right: 1rem;
    top: .6rem;
    z-index: 9999;
    border: 1px solid #1296db;
    -webkit-animation: xuanzhuan linear 1.5s infinite;
    -o-animation: xuanzhuan linear 1.5s infinite;
    animation: xuanzhuan linear 1.5s infinite;
}

#music.hover {
    -webkit-animation: none;
    -moz-animation: none;
    -o-animation: none;
    animation: none;
    -webkit-animation-name: none;
    -moz-animation-name: none;
    -o-animation-name: none;
    animation-name: none;
    -webkit-animation-iteration-count: 0;
    -moz-animation-iteration-count: 0;
    -o-animation-iteration-count: 0;
    animation-iteration-count: 0;
}


/*底部翻页箭头动画*/

@keyframes moveToBottom {
    from {
        transform: translateY(-100%);
        opacity: 0;
        filter: alpha(opacity=0);
    }
    to {
        opacity: 1;
        filter: alpha(opacity=100);
    }
}

@-moz-keyframes moveToBottom {
    from {
        -moz-transform: translateY(-100%);
        opacity: 0;
        filter: alpha(opacity=0);
    }
    to {
        opacity: 1;
        filter: alpha(opacity=100);
    }
}

@-webkit-keyframes moveToBottom {
    from {
        -webkit-transform: translateY(-100%);
        opacity: 0;
        filter: alpha(opacity=0);
    }
    to {
        opacity: 1;
        filter: alpha(opacity=100);
    }
}

@-o-keyframes moveToBottom {
    from {
        -o-transform: translateY(-100%);
        opacity: 0;
        filter: alpha(opacity=0);
    }
    to {
        opacity: 1;
        filter: alpha(opacity=100);
    }
}


/*向下箭头*/

#caret_bottom {
    position: absolute;
    width: 1.2rem;
    height: .8rem;
    background: url(caret-bottom-white.png) 0 0 no-repeat;
    background-size: 100% 100%;
    left: 50%;
    margin-left: -.6rem;
    bottom: 2rem;
    -webkit-animation: moveToBottom ease 1.5s both infinite;
    -o-animation: moveToBottom ease 1.5s both infinite;
    animation: moveToBottom ease 1.5s both infinite;
    z-index: 9999;
}


/*loadding*/

.spinner {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -1.5rem;
    margin-top: -6.5rem;
    width: 3rem;
    height: 3rem;
    text-align: center;
    font-size: .7rem;
}

.spinner>div {
    background-color: #da251e;
    height: 100%;
    width: .25rem;
    display: inline-block;
    -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
    animation: stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.spinner .rect3 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

.spinner .rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.spinner .rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.3)
    }
    20% {
        -webkit-transform: scaleY(1.0)
    }
}

@keyframes stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.3);
        -webkit-transform: scaleY(0.3);
    }
    20% {
        transform: scaleY(1.0);
        -webkit-transform: scaleY(1.0);
    }
}

.p1 {
    vertical-align: top;
    background: url(index-bg.png) no-repeat center top;
    background-size: cover;

}
.p1-logo {
    max-width: 85%;
    display: block;
    margin: 5vh auto 0;
}
.p1-word {
    max-width: 70%;
    margin:8vh auto 0;
    -moz-animation: huxi 1s linear infinite;
    -ms-animation: huxi 1s linear infinite;
    animation: huxi 1s linear infinite;
}
.p1-bottom-2 {
    width: 52%;
    bottom: 0;
    left: 24%;
    position: absolute;
    z-index: 0;
}
.p1-bottom-3 {
    width: 82%;
    bottom: 0;
    left: 9%;
    position: absolute;
    z-index: 0;
}
.p1-bottom-4 {
    width: 96%;
    bottom: 0;
    left: 2%;
    position: absolute;
    z-index: 0;
}
.p1-bottom-5 {
    width: 120%;
    bottom: 0;
    left: -10%;
    position: absolute;
    z-index: 0;
}

.p1-chuan{
    bottom:0;
    left:0;
    width:80px;
    -webkit-animation: cloud-MOVE 20s linear infinite;
    -moz-animation: cloud-MOVE 20s linear infinite;
    -ms-animation: cloud-MOVE 20s linear infinite;
    animation: cloud-MOVE 20s linear infinite;
}

.shui{
    bottom:-15px;
    left:-200px;
    width:200px;
    -webkit-animation: cloud-MOVE 50s linear infinite;
    -moz-animation: cloud-MOVE 50s linear infinite;
    -ms-animation: cloud-MOVE 50s linear infinite;
    animation: cloud-MOVE 50s linear infinite;
}
.shui2{
    bottom:-20px;
    left:-200px;
    width:200px;
    -webkit-animation: cloud-MOVE 30s linear infinite;
    -moz-animation: cloud-MOVE 30s linear infinite;
    -ms-animation: cloud-MOVE 30s linear infinite;
    animation: cloud-MOVE 30s linear infinite;
}
.shui1{
    bottom:0;
    right:-200px;
    width:200px;
    -webkit-animation: cloud-MOVE-re 50s linear infinite;
    -moz-animation: cloud-MOVE-re 50s linear infinite;
    -ms-animation: cloud-MOVE-re 50s linear infinite;
    animation: cloud-MOVE-re 50s linear infinite;
}


/*P2*/
.inpage {
    vertical-align: top;
    background: url(inpage-bg.png) center center no-repeat;
    background-size: 100% 100%;
}
.p2-detail {
    width: 82%;
    display: block;
    margin: 4% auto 0;
}
.p2-title {
    max-width: 55%;
    display: block;
    margin-top: 15%;
}
.p2-word {
    width: 82%;
    display: block;
    margin-top: 15%;
}

.p2-detail p {
    text-indent: 2em;
    font-size: 14px;
    line-height: 25px;
    color: #2A4771;
    font-weight: 500;
    display: block;
    /*margin-bottom:20px;*/
}
.p2-detail p.indent-0 {
    text-indent: 0;
    /*margin-bottom:20px;*/
}
.p2-detail-title {
    text-align: left;
    position: relative;
    margin-top: 10px;
    padding-left: 18px;
    font-size: 13px;
}
.p2-detail-title-first {
    margin-top: 10px;
}
.p2-detail-title span {
    display: inline-block;
    -webkit-transform: scale(.5);
    -moz-transform: scale(.5);
    -ms-transform: scale(.5);
    -o-transform: scale(.5);
    transform: scale(.5);
    padding: 0 2px;
}
.p2-detail-title:after {
    content: ' ';
    position: absolute;
    left: 0;
    top: 7px;
    width: 8px;
    height: 8px;
    background-color: #2A4771;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.p2-detail-desc {
    text-align: left;
    color: #2A4771;
}
.p2-detail-desc p {
    text-indent: 18px;
    color: #2A4771;
    font-size: 13px;
    margin: 2px auto;
}

/*P3*/
.p3-title {
    width: 55%;
    display: block;
    margin: 15% auto 0;
    font-family: 'Tahoma'
}
.p3-word{
    font-size:35px;
    display: block;
    margin-top: 15%;    
    color:#2A4771;
}
.p3-detail {
    width: 80%;
    display: block;
    margin: 8% auto 0;
    border-left: 2px solid #2A4771;
}
.p3-detail p {
    padding-left: 1em;
    margin: 13px auto;
    font-size: 15px;
    text-align: left;
    line-height: 22px;
    color: #2A4771;
    position: relative;
    font-weight: 550;
}
.p3-ren{
    right:9%;
    bottom:15%;
    width:100px;
    animation: music-move 30s 0s infinite alternate ease-in-out;
    -webkit-animation:music-move 30s 0s infinite alternate ease-in-out;
}
.p3-detail p:after {
    content: ' ';
    position: absolute;
    left: -1em;
    top: 50%;
    width: 8px;
    height: 8px;
    margin-top: -5px;
    margin-left: 7px;
    border-radius: 50%;
    background-color: #fff;
    border:2px solid #2A4771;
}


/*P4*/

.p4-word{
    display: block;
    margin-top: 15%;    
    color:#2A4771;
}
.p4-word dl{
    width:100%;
    background: #046995;
    color:#fff;
    font-size:15px;
    overflow: hidden;
    margin-bottom:10px;
    line-height: 25px;
}

.p4-word dl dt{
    padding:0 5px;
    float:left;
    background: #2A4771;
    position: relative;
}
.p4-word dl dt:after{
    position: absolute;
    background:url(title-white.png) no-repeat right center;
    content:' ';
    font-weight: 900;
    font-size:100px;
    right:-6px;
    width: 14px;
    height:25px;
}
.p4-word dl dd{
    font-size:12px;
    line-height: 25px;
    text-indent:10px;
}

.p4-map{
    max-width:100%;
}



.p5{
    vertical-align: top;
    background: url(index-bg.png) no-repeat center top;
    background-size: cover;
}
.p5 .p4-word{
    font-size: 35px;
}


.p4-bottom a {
    padding-top: 15px;    
}
.p4-bottom .item {
    width: 100%;
    margin-bottom: 3vh;
    color:#2A4771;
    float:left;
}
.p4-bottom .item span {
    float:left;    
    line-height: 30px;
    width:30%;
    background: #2A4771;
    color:#Fff;
    text-align: center;
    border-radius: 3px;
}
.p4-bottom .item input {
    border: 1px solid #2A4771;
    border-radius: 5px;
    height: 30px;
    color:#2A4771;
    line-height: 30px;
    text-indent: 10px;
    font-weight: bold;
    width:65%;
    background: rgba(233,233,233,0.3);
    float:right;
}
.p4-bottom button {
    background-color: #2A4771;
    border: none;
    color: #fff;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    margin-top: 10px;
    border-radius: 5px;
}
.p4-bottom button:active {
    background-color: #3F90BF;
}
.p4-bottom .blank {
    width: 100%;
    height: 30px;
    display: block;
}

/*横屏*/

@media all and (orientation: landscape) and (min-width: 480px) {
    .heng {
        display: block;
        width: 100%;
        height: 100%;
        background-color: #000;
        opacity: .9;
        filter: alpha(opacity=90);
        position: fixed;
        z-index: 99999;
        left: 0;
        top: 0;
        color: #fff;
        text-align: center;
        font-size: .7rem;
        letter-spacing: .2rem;
    }
}


/*竖屏*/

@media all and (orientation: portrait) {
    /*iphone6 plus*/
    @media screen and (max-height: 414px) {}
    /*iphone6*/
    @media screen and (max-height: 667px) {
        .p3-detail p {
            font-size: 15px;
            margin: 12px auto;
            line-height: 21px;
        }
    }
    /*iphone5*/
    @media screen and (max-height: 568px) {
        .p3-detail p {
            font-size: 15px;
            margin: 10px auto;
            line-height: 18px;
        }
    }
    /*iphone4 480*/
    @media screen and (max-height: 480px) {
        .p3-title {
            margin-top: 10%;
        }
        .p3-detail {
            margin-top: 5%;
        }
        .p3-detail p {
            font-size: 15px;
            margin: 6px auto;
            line-height: 18px;
        }
        .p1-logo, .p1-title-small {
            margin-top: 4%;
        }
        .p1-title-small {
            width: 60%;
        }
        .p1-title {
            width: 55%;
        }
        .p1-name {
            margin-top: 4%;
            font-size: 12px;
            line-height: 18px;
        }
        .p2-title {
            margin-top: 10%;
        }
        .p2-detail p {
            margin: 0 auto;
            line-height: 20px;
            font-size: 12px;
        }
        .p2-detail-title-first {
            margin-top: 10px;
            margin-bottom: -5px;
        }
    }
}


/*PC访问*/

.pc, .pc body {
    background: #6d120e url(about-bg.png) center center no-repeat;
    position: relative;
    background-size: auto 100%;
}

.pc .ewm {
    display: block;
    right: 2%;
    top: 50%;
    width: 200px;
    height: 230px;
    margin-top: -140px;
    background-color: #fff;
}

@media screen and (max-width: 850px) {
    .pc .ewm {
        display: none;
    }
}

.pc .ewm p {
    height: 30px;
    line-height: 20px;
    font-size: 16px;
    color: #333;
}

.pc .ewm img {
    display: block;
    margin: 5% auto 3%;
    width: 90%;
}

.pc .control {
    display: block;
    right: -20px;
    bottom: 20%;
    width: 20px;
}

.pc .control a {
    display: block;
    width: 20px;
    height: auto;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    left: 50%;
    background: #3C9FDA;
    cursor: pointer;
    top: 47px;
    font-size: 12px;
    padding: 20px 9px;
    border: 1px solid #3C9FDA;
    margin: 20px 0;
    font-size: 14px;
    color: #fff;
    text-align: center;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.pc .control a:hover {
    background: #ddd;
    border-color: #ddd;
    color: #555;
}

.pc #music, .pc #caret_bottom {
    position: absolute;
}

.pc #box {
    width: 320px;
    height: 568px;
    margin: 0 auto;
    /*background: #fff url(bg-logo.jpg) center center no-repeat;*/
    /*-webkit-background-size: 60% auto;*/
    /*background-size: 60% auto;*/
}

.pc .phone-top {
    display: block;
    background: url(phonetop.svg) 0 0 no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    top: -48px;
    width: 100%;
    height: 48px;
}

.pc .phone-bottom {
    text-align: center;
    font-size: 13px;
    line-height: 45px;
    display: block;
    background: url(phonefoot.svg) 0 0 no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    bottom: -45px;
    width: 100%;
    height: 45px;
}

.pc #Lmn {
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.pc .heng {
    display: none;
}

@-webkit-keyframes cloud-MOVE {
    0% { 
      left:10%;
    } 
    25% {  
      left:30%;
    }
    50% {  
      left:50%;
    }
    75% {  
      left:30%;
    }
    100% {  
      left:10%;
    }
}

@-webkit-keyframes cloud-MOVE-re {
    0% { 
      right:10%;
    } 
    25% {  
      right:30%;
      }
    50% {  
      right:50%;
    }
    75% {  
      right:30%;
    }
    100% {  
      right:10%;
    }
}



@keyframes music-move
{
0% { 
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
} 
33% {  
  -webkit-transform: rotate(-5deg);
  transform: rotate(-5deg);
}
66% {  
  -webkit-transform: rotate(5deg);
  transform: rotate(5deg);
}
100% {  
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
}

@-webkit-keyframes music-move /* Safari and Chrome */
{
0% { 
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
33% {  
  -webkit-transform: rotate(-5deg);
  transform: rotate(-5deg);
}
66% {  
  -webkit-transform: rotate(5deg);
  transform: rotate(5deg);
}
100% {  
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
}


@keyframes huxi
{
0% { 
  -webkit-transform: scale(1);
  transform: scale(1);
}
50% {  
  -webkit-transform: scale(1.11);
  transform: scale(1.11);
}
100% {  
  -webkit-transform: scale(1);
  transform: scale(1);
}
}

@-webkit-keyframes huxi /* Safari and Chrome */
{
0% { 
  -webkit-transform: scale(1);
  transform: scale(1);
}
50% {  
  -webkit-transform: scale(1.11);
  transform: scale(1.11);
}
100% {  
  -webkit-transform: scale(1);
  transform: scale(1);
}
}