html, body {
        position: relative;
        height: 100%;
    }
    body {
        font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        color:#000;
        margin: 0;
        padding: 0;
    }
    .swiper-container {
        width: 100%;
        height: 500px;

    }
    .swiper-container .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #000;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

   
   .swiper-container .item_1 ,.item_2,.item_3,.item_4,.item_5{
       width: 100%;
        margin: 0 auto;
        height:500px;
   }

   .swiper-container .item_1 {   
        background-size: cover;
        background-position: center;
        background-image: url('../images/headerBg.jpg');
    
    }

   .swiper-container .item_1 .header_item1_01{
       position: absolute;
       top: 138px;
       left: 42%;
       opacity: 0;
       width: 16%;
       height: 28%;
       /* transform-style:preserve-3d;
       -moz-transform-style:preserve-3d;
       -webkit-transform-style:preserve-3d;
       -ms-transform-style:preserve-3d;
       -o-transform-style:preserve-3d;
       animation:run  ease-in-out 6s infinite;
       -moz-animation:run  ease-in-out 6s infinite;
       -webkit-animation:run  ease-in-out 6s infinite;
       -ms-animation:run  ease-in-out 6s infinite;
       -o-animation:run  ease-in-out 6s infinite; */
   }

   @keyframes run {
       40% {
            transform:rotateX(0) rotateY(0);
        }
        100% {
            transform:rotateX(0) rotateY(360deg);
        }
        }@-moz-keyframes run {
            0% {
            -moz-transform:rotateX(-5deg) rotateY(0);
        }
        50% {
            -moz-transform:rotateX(0) rotateY(180deg);
            text-shadow:1px  1px 1px #ccc,0 0 10px #fff,0 0 20px #fff,0 0 30px #fff,0 0 40px #3EFF3E,0 0 70px #3EFFff,0 0 80px #3EFFff,0 0 100px #3EFFee,0 0 150px #3EFFee;
        }
        100% {
            -moz-transform:rotateX(5deg) rotateY(360deg);
        }
        }@-webkit-keyframes run {
            0% {
            -webkit-transform:rotateX(-5deg) rotateY(0);
        }
        50% {
            -webkit-transform:rotateX(0) rotateY(180deg);
            text-shadow:1px  1px 1px #ccc,0 0 10px #fff,0 0 20px #fff,0 0 30px #fff,0 0 40px #3EFF3E,0 0 70px #3EFFff,0 0 80px #3EFFff,0 0 100px #3EFFee,0 0 150px #3EFFee;
        }
        100% {
            -webkit-transform:rotateX(5deg) rotateY(360deg);
        }
        }@-ms-keyframes run {
            0% {
            -ms-transform:rotateX(-5deg) rotateY(0);
        }
        50% {
            -ms-transform:rotateX(0) rotateY(180deg);
        }
        100% {
            -ms-transform:rotateX(5deg) rotateY(360deg);
        }
    }


   .swiper-container .item_1 .header_item1_02{
       position: absolute;
       top: 300px;
       left: 40%;
       width: 20%;
       height: 20%;
   }

   .swiper-container .item_2{
        background-color: #1b294f;
        background-size: cover;
   }
   .swiper-container .item_2 .header_item2_01{
       position: absolute;
       top: 200px;
       left: 15%;
   }
  .swiper-container .item_2 .header_item2_02{
       position: absolute;
       top: 95px;
       right: 15%;
   }

    .swiper-container .item_3 {   
        background-size: cover;
        background-position: center;
        background-image: url('../images/headerBg03.png');
    
    }
    .swiper-container .item_3 .header_item3_01{
       position: absolute;
       top: 200px;
       left: 15%;
   }
  .swiper-container .item_3 .header_item3_02{
       position: absolute;
       top: 120px;
       right: 260px;
   }
   .swiper-container .item_3 .header_item3_03{
       position: absolute;
       top: 226px;
       right: 368px;
   }

/********************************************************/

   .m-main .swiper-container3 {
        width: 100%;
        height: 100%;
        overflow: hidden;
        position: relative;
    }
    .m-main .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

     .m-main .swiper-wrapper{
         height: 450px;
    }
    .swiper-container3 .swiper-button-prev,.swiper-container3 .swiper-button-next{
        opacity: 0;
        z-index: 999999!important;
    }
    .swiper-container3:hover .swiper-button-next{
        opacity: 0.35;
    }
    .swiper-container3:hover .swiper-button-prev{
        opacity: 0.35;
    }

    
h5 {
    font-size: 24px;
    color: #fff
}

    .ss-first {
    width: 100%;
    position: absolute;
    left: 0;
    opacity: 1;
    filter: alpha(opacity=100);
    top: 0;
    z-index: 1;
    height: 100%;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;

}
 .ss-first img {
     margin: 0px auto;
    margin-top: 130px;
    font-size: 92px;
    display: block;

}
.ss-second {
    position: absolute;
    top: 150px;
    left: 0;
    width: 100%;
    height: 450px;
    border-top: 4px solid #448aff;
    z-index: 2;
    -webkit-transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    transition: all .2s ease-in;
    opacity: 0;
    filter: alpha(opacity=0);
}
 .ss-second .bg {
    width: 100%;
    height: 100%;
    background: #448aff;
    opacity: .6;
    filter: alpha(opacity=60)
}
.ss-second .ct {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2
}
 .ss-second .ct{
    margin: 45px 0 20px
}
 .ss-second .desc {
    color: #fff;
    padding: 0 30px;
    text-align: left;
    font-size: 14px;
    line-height: 30px;
    height: 270px;
    overflow: hidden;
}
.ss-second .ct a {
    color: #fff;
    display: inline-block;
    width: 100px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #666;
    background: rgba(0,0,0,.2);
    font-size: 14px
}

.swiper_item:hover .ss-second {
    top: 0;
    opacity: 1;
    filter: alpha(opacity=100)
}
.swiper_item:hover .ss-first {
    opacity: 0;
    filter: alpha(opacity=100)
}
.swiper_item .line{
    width: 100%;
    height: 2px;
    position: absolute;
    bottom: 0px;
    left: 0px;
}
.ss-item1 .line{
    background-color: #448aff;
   
}

.ss-item2 .line {
    background-color: #1ed5b7;  
}
.ss-item2 .ss-second {
     border-color: #1ed5b7; 
}
.ss-item2 .ss-second .bg {
     background: #1ed5b7; 
}


.ss-item3 .line{
    background-color: #fed387;
   
}
.ss-item3 .ss-second {
     border-color: #fed387; 
}
.ss-item3 .ss-second .bg {
     background: #fed387; 
}

.ss-item4 .line{
    background-color: #eb6451;
   
}
.ss-item4 .ss-second {
     border-color: #eb6451; 
}
.ss-item4 .ss-second .bg {
     background: #eb6451; 
}

.ss-item5 .line{
    background-color: #448aff;
   
}
.ss-item5 .ss-second {
     border-color: #448aff; 
}
.ss-item5 .ss-second .bg {
     background: #448aff; 
}

.ss-item6 .line{
    background-color: #1ed5b7;
   
}
.ss-item6 .ss-second {
     border-color: #1ed5b7; 
}
.ss-item6 .ss-second .bg {
     background: #1ed5b7; 
}

.ss-item7 .line{
    background-color: #fed387;
   
}
.ss-item7 .ss-second {
     border-color: #fed387; 
}
.ss-item7 .ss-second .bg {
     background: #fed387; 
}

.ss-item8 .line{
    background-color: #eb6451;
   
}
.ss-item8 .ss-second {
     border-color: #eb6451; 
}
.ss-item8 .ss-second .bg {
     background: #eb6451; 
}

.swiper_item:hover .line{
    opacity: 0;
    filter: alpha(opacity=0);
}

.swiper_item a:hover{
    text-decoration: none;
    background-color: rgba(0,0,0,.5);
}



.swiper-container6 {
        width: 100%;
        overflow: hidden;
        position: relative;
    }
  .swiper-container6  .swiper-slide {
        text-align: center;
        font-size: 18px;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }


.swiper-container6 .swiper-button-prev, .swiper-container6 .swiper-button-next {
    position: absolute;
    top: 3px;
    width: 30px;
    height: 195px;
    z-index: 10;
    cursor: pointer;
    -moz-background-size: 10px 44px;
    -webkit-background-size: 10px 44px;
    background-size: 10px 44px;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;

}

.swiper-container6 .swiper-button-prev,.swiper-container6 .swiper-button-next {
    background-color: #e4e5e8;
}


.swiper-container6:hover .swiper-button-prev{
    opacity: 1;
}
.swiper-container6:hover .swiper-button-next{
    opacity: 1;
}

.swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black{
    background-image: url('../images/right.png')!important;
    background-size: contain;
}

.swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black {
    background-image: url('../images/left.png')!important;
    background-size: contain;
}