/*Icon-Font*/
@font-face {font-family: "iconfont";
    src: url('../fonts/iconfont.eot?t=1459219165'); /* IE9*/
    src: url('../fonts/iconfont.eot?t=1459219165#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/iconfont.woff?t=1459219165') format('woff'), /* chrome, firefox */
    url('../fonts/iconfont.ttf?t=1459219165') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
    url('../fonts/iconfont.svg?t=1459219165#iconfont') format('svg'); /* iOS 4.1- */
}

/*==S Font */
@font-face {
    font-family: 'sofia-bold';
    src: url('../fonts/Sofia-Bold.otf');
}
@font-face {
    font-family: 'sofia-light';
    src: url('../fonts/Sofia-Light.otf');
}
@font-face {
    font-family: 'sofia-medium';
    src: url('../fonts/Sofia-Medium.otf');
}
@font-face {
    font-family: 'sofia-regular';
    src: url('../fonts/Sofia-Regular.otf');
}

*:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
* {
    margin: 0;
    padding:0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
ul,ol {
    list-style: none;
}
a {
    text-decoration: none;
    transition: .5s;
    -webkit-transition: .5s;
}
img {
    border:none;
}
*:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.clearfix:after {
    clear: both;
}
.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}
.row {
    margin-left: -10px;
    margin-right: -10px;
}
.margin10 {
    margin:0 10px;
}
.padding55 {
    padding: 40px 55px;
}
.body {
    overflow: hidden;
}
body {
    color: #333;
    font-family: sofia-regular,Arial;
}
.container {
    padding-left: 50px;
    padding-right: 50px;
    margin: 0 auto;
}
.container2 {
    max-width: 1420px;
    padding-left: 10px;
    padding-right: 10px;
    margin: 0 auto;
}
.content {
    padding-top:85px;
    padding-bottom:105px;
}
.main {
    position: relative;
    top: 0;
    left: 0;
}
.main-bg {
    background: #424242;
    transition: .8s;
    -webkit-transition: .8s;
}
@media (max-width: 1680px) {
    .container2 {
        max-width: 1200px;
        padding-left: 10px;
        padding-right: 10px;
    }
    .content {
        padding-top:65px;
        padding-bottom: 80px;
    }
    .padding55 {
        padding: 40px 50px;
    }
}
@media (max-width: 1024px) {
    .content {
        padding-top:45px;
        padding-bottom: 60px;
    }
}
@media (max-width: 480px) {
    .content {
        padding-top:35px;
        padding-bottom: 40px;
    }
}

.block img {
    display: block;
    width: 100%;  
}
.block1 {
    width: 100%;
    background:red url(../images/img1.jpg?data=0725) no-repeat center center;
}
.block2 {
    width: 100%;
    background:yellow url(../images/img2.jpg) no-repeat center center;
}
.block3 {
    width: 100%;
    background:blue url(../images/img3.jpg) no-repeat center center;
}
.block4 {
    width: 100%;
    background:black url(../images/img4.jpg) no-repeat center center;
}
.block5 {
    width: 100%;
    background:yellow url(../images/img6.jpg) no-repeat center center;
}
.block6 {
    width: 100%;
    background:blue url(../images/img7.jpg) no-repeat center center;
}
.block7 {
    width: 100%;
    background:blue url(../images/img8.jpg) no-repeat center center;
}
.block7 {
    width: 100%;
    background:blue url(../images/img8.jpg) no-repeat center center;
}
.block8 {
    width: 100%;
    background:blue url(../images/img9.jpg) no-repeat center center;
}

.block {
    height: 100%;
    position: relative;
    transition: transform .3s;
    -webkit-transition: transform .3s;
    overflow: hidden;
    background-size: cover;
    -ms-behavior: url(backgroundsize.min.htc);
    behavior: url(backgroundsize.min.htc);
/*    transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    -webkit-transform: scale(1.05);*/
}
.overflowhideen {
    overflow: hidden;
}
.block.active {
/*    transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    -webkit-transform: scale(1);*/
}
@media (max-width: 480px) {
    .block1 {
        width: 100%;
        background:red url(../images/wap-img1.jpg?data=0725) no-repeat center center;
    }
    .block2 {
        width: 100%;
        background:yellow url(../images/wap-img2.jpg) no-repeat center center;
    }
    .block3 {
        width: 100%;
        background:blue url(../images/wap-img3.jpg) no-repeat center center;
    }
    .block4 {
        width: 100%;
        background:black url(../images/wap-img4.jpg) no-repeat center center;
    }
    .block5 {
        width: 100%;
        background:yellow url(../images/wap-img6.jpg) no-repeat center center;
    }
    .block6 {
        width: 100%;
        background:blue url(../images/wap-img7.jpg) no-repeat center center;
    }
    .block7 {
        width: 100%;
        background:blue url(../images/wap-img8.jpg) no-repeat center center;
    } 
}




/*banner*/
.banner1-text {
    width: 90%;
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 70px;
}
.verticalmiddle {
    width: -1px;
    height: 100%;
    display: inline-block;
    vertical-align: middle;
}
.index-vedio {
    width: 256px;
    height: 80px;
    background: #cc3947 url(../images/inside-triangle1.png) no-repeat 40px center;
    border-radius: 80px;
    display: inline-block;
    margin-top: 70px;
}
.index-vedio span {
    line-height: 80px;
    color: #fff;
    text-align: center;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: bold;
    padding-left: 35px;
    letter-spacing: 3px;
}
.banner {
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
/*.block .logo {
    height: 37px;
    padding-top: 35px;
    position: relative;
    z-index: 9999;
}
.block .logo img {
    width: 157px;
    height: 37px;
    float: left;
}*/
.block .logo a.erterpristhome {
    display: inline-block;
    float: right;
    text-align: center;
    width: 100px;
    height: 35px;
    font-size: 12px;
    line-height: 35px;
    color: #fff;
    border:1px solid #fff;
    border-radius: 50px;
}
.banner-text1 {
    font-size: 24px;
    line-height: 40px;
    border-bottom: 2px solid #fff;
    color: #fff;
    display: inline-block;
    margin:15% auto 0;
}
.banner-text2 {
    font-size: 20px;
    line-height: 40px;
    color: #fff;
    display: inline-block;
    position: absolute;
    left: 50%;
    bottom: 130px;
    width: 300px;
    text-align: center;
    margin-left: -150px;
    text-transform: uppercase;
    letter-spacing: 15px;
}
.banner-text3 {
    display: inline-block;
}
.banner-text3 img {
    display: inline-block;
}
.banner-line {
    font-size: 0;
    line-height: 0;
    position: absolute;
    left: 50%;
    bottom: 118px;
    width: 38px;
    height: 64px;
    text-align: center;
    margin-left: -16px;
    overflow: hidden;
}
.video-btn i {
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 128px;
    color: #fff;
    margin-top: -64px;
    margin-left: -64px;
}
/*.banner-line img {
    animation:mymove 2s infinite;
    -webkit-animation:mymove 2s infinite; 
}
@keyframes mymove {
    from {transform:translateY(-66px)}
    to {transform:translateY(66px)}
}*/

@media (max-width: 1680px) {
    .banner-text3 {
        max-width: 1000px;
    }
}
@media (max-width: 1024px) {
    /*.block .logo img {
        width: 112px;
        height: 26px;
    }
    .block .logo {
        height: 30px;
        padding-top: 20px;
    }   
    .block .logo a.erterpristhome {
        height: 30px;
        line-height: 30px;
    }*/
    .block img {
        width: 90%;
    }
}



/*---nav---*/
nav {
    position: fixed;
    top: 50%;
    left: 70px;
    width: 300px;
    height: 320px;
    margin: -160px 0 0 0;
    z-index: 3;
    display: none;
}
nav ul{
    padding: 0;
    margin: 0;
    list-style: none;
}
nav ul li{
    position: relative;
    float: left;
    width: 100%;
    height: 40px;
    background: url(../images/line-ing1.png) no-repeat left top;
}
nav ul li .pictos{
    position: absolute;
    top: 14px;
    left: -3px;
    width: 7px;
    height: 7px;
    width: 10px\9;
    height: 10px\9;
    border-radius: 50%;
    background: rgba(256,256,256,0);
    border: 1px solid rgba(256,256,256,1);
    background: url(../images/nav-point1.png) no-repeat center center;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
nav ul li .picto-home, nav ul li .picto-aquarium, nav ul li .picto-services, nav ul li .picto-vision, nav ul li .picto-portfolio, nav ul li .picto-contact, nav ul li .picto-track, nav ul li .picto-media,nav ul li .picto-paper{
    opacity: 0;
    height: 32px;
    visibility: hidden;
}
nav ul li.selected .picto-home, nav ul li.selected .picto-aquarium, nav ul li.selected .picto-services, nav ul li.selected .picto-vision, nav ul li.selected .picto-portfolio, nav ul li.selected .picto-contact, nav ul li.selected .picto-track, nav ul li.selected .picto-media,nav ul li.selected .picto-paper{
    opacity: 1;
    visibility: visible;
    transition: all 0.2s 0.3s ease-in-out;
    -webkit-transition: all 0.2s 0.3s ease-in-out;
    -moz-transition: all 0.2s 0.3s ease-in-out;
    -o-transition: all 0.2s 0.3s ease-in-out;
}
nav ul li .picto-home{
    background-size: 29px;
}
nav ul li .picto-aquarium{
    background: url(../images/nav-icon-img2.png?data=0726) no-repeat 0 0;
    background-size: 29px;
}
nav ul li .picto-services{
    background: url(../images/nav-icon-img3.png?data=0726) no-repeat 0 0;
    background-size: 29px;
}
nav ul li .picto-vision{
    background: url(../images/nav-icon-img4.png?data=0726) no-repeat 0 0;
    background-size: 29px;
}
nav ul li .picto-portfolio{
    background: url(../images/nav-icon-img5.png?data=0726) no-repeat 0 0;
    background-size: 29px;
}
nav ul li .picto-contact{
    background: url(../images/nav-icon-img6.png?data=0726) no-repeat 0 0;
    background-size: 29px;
}
nav ul li .picto-track{
    background: url(../images/nav-icon-img7.png?data=0726) no-repeat 0 0;
    background-size: 29px;
}
nav ul li .picto-media{
    background: url(../images/nav-icon-img8.png?data=0726) no-repeat 0 0;
    background-size: 29px;
}
nav ul li .picto-paper{
    background: url(../images/nav-icon-img9.png) no-repeat 0 0;
    background-size: 29px;
}
nav ul li:hover .pictos{
    top: 13px;
    left: -6px;
    width: 11px;
    height: 11px;
    cursor: pointer;
    background: rgba(256,256,256,1);
    border: 1px solid rgba(256,256,256,1);
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
nav ul li.selected .pictos, nav ul li.selected:hover .pictos{
    top: 2px;
    left: -17px;
    width: 31px;
    height: 31px;
    cursor: pointer;
    background: rgba(256,256,256,1);
    border: 1px solid rgba(256,256,256,1);
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
nav ul li button{
    position: absolute;
    top: 12px;
    left: 35px;
    padding: 0 5px;
    background: none;
    border: none;
    outline: none;
    color: rgba(255,255,255,1);
    color: #fff\9;
    font: normal 200 14px/28px;
    cursor: pointer;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    letter-spacing: 1px;
}
nav ul li.selected button, nav ul li.selected:hover button{
    color: rgba(255,255,255,1);
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav ul li:hover button{
    color: rgba(255,255,255,0.8);
    color: #fff\9;
    filter:alpha(opacity = 80);
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav .line{
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 16px;
    background: rgba(256,256,256,1);
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav.aquarium .line{
    height: 56px;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav.aquarium ul li .one{
    background: rgba(256,256,256,1);
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav.services .line{
    height: 96px;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav.services ul li .one, nav.services ul li .two{
    background: rgba(256,256,256,1);
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav.vision .line{
    height: 136px;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
/*nav.vision ul li .one, nav.vision ul li .two, nav.vision ul li .three{
    background: rgba(256,256,256,1);
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}*/
nav.portfolio .line{
    height: 176px;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav.portfolio ul li .one, nav.portfolio ul li .two, nav.portfolio ul li .three, nav.portfolio ul li .four{
    background: rgba(256,256,256,1);
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav.contact .line{
    height: 216px;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav.contact ul li .one, nav.contact ul li .two, nav.contact ul li .three, nav.contact ul li .four, nav.contact ul li .five{
    background: rgba(256,256,256,1);
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
nav .temoin{
    background-size: 6px;
    width: 6px;
    position: absolute;
    top: 14px;
    left: -60px;
}

@media (max-width: 1024px) {
    .vision {
        display: none !important;
    }
    .row {
        margin-left: 0;
        margin-right: 0;
    }
}














.info {
    position: absolute;
    top: 40%;
    display: inline-block;
    text-align: center;
    width: 400px;
    height: 500px;
    margin-top: -130px;
}
.info2,.info3,.info5,.info7 {
    right: 20%;
}
.info1,.info4,.info6,.info8 {
    left: 20%;
}
.text {
    margin-top: 100px;
}
.info .text-box2,.info .text-box1,.info .text-box3,.info .text-box5,.info .text-box7 {
    transform: translateX(3000px);
    -webkit-ransform: translateX(3000px);
    transition: all .4s cubic-bezier(0.42,0,0.58,1) .4s;
    -webkit-transition: all .4s cubic-bezier(0.42,0,0.58,1) .4s;
}
.info .text-box4,.info .text-box6,.info .text-box8 {
    transform: translateX(-1000px);
    -webkit-ransform: translateX(-1000px);
    transition: all .4s cubic-bezier(0.42,0,0.58,1) .4s;
    -webkit-transition: all .4s cubic-bezier(0.42,0,0.58,1) .4s;
}
.info .text1 {
    font-size: 52px;
    line-height: 54px;
    color: #fff;
    margin-bottom: 30px;
    font-family: 'sofia-medium';
}
.info .text2 {
    font-size: 18px;
    line-height: 24px;
    color: #fff;
    max-width: 250px;
    margin: 0 auto;
    padding-bottom: 29px;
    letter-spacing: 1px;
}
.info em {
    display: block;
    height: 60px;
    width: 1px;
    background: #fff;
    margin: 0 auto;
    margin-bottom: 20px;
}
.info .btn-icon4 {
    display: inline-block;
    font-size: 14px;
    line-height: 26px;
    color: #fff;
    text-transform: uppercase;
    font-style: italic;
    padding:0 3px;
    letter-spacing: 1px;
}
/*btn-icon4*/
.btn-icon4 {position: relative;z-index: 3;overflow: hidden;cursor: pointer;display: inline-block;}
.btn-icon4::before {width: 0;height: 100%;position: absolute;top: 0;left: 50%;z-index: 1;content: '';transition:0.1s;-webkit-transition:0.1s;}
.btn-icon4::before {border-bottom: 1px solid #fff;background: transparent;transform:translate(0,-1px);-webkit-transform:translate(0,-1px);}
.info:hover .btn-icon4::before{width: 100%;left: 0;}

.border-line {
    background: rgba(256,256,256,.8);
    background: #fff\9;
    filter:alpha(opacity=80);
    position: absolute;
}
.border-line1 {
    width: 0%;
    height: 6px;
    left: 0;
    top: 0;
    transition: all .3s cubic-bezier(0.55, 0.055, 0.675, 0.19) .6s;
    -webkit-transition: all .3s 300ms cubic-bezier(0.55, 0.055, 0.675, 0.19) .6s;
}
.border-line2 {
    height: 0%;
    width: 6px;
    right: 0;
    top:0;
    transition: all .15s linear .9s;
    -webkit-transition: all .15s linear .9s;
}
.border-line3 {
    width: 0%;
    height: 6px;
    right: 0;
    bottom: 0;
    transition: all .15s linear 1.05s;
    -webkit-transition: all .15s linear 1.05s;

}
.border-line4 {
    height: 0%;
    width: 6px;
    bottom: 0;
    left: 0;
    transition: all .15s cubic-bezier(0.215, 0.61, 0.355, 1) 1.2s;
    -webkit-transition: all .15s cubic-bezier(0.215, 0.61, 0.355, 1) 1.2s;
}


.block1.selected .border-line1,.block3.selected .border-line1,.block5.selected .border-line1,.block7.selected .border-line1 {
    width: 100%;
}
.block1.selected .border-line2,.block3.selected .border-line2,.block5.selected .border-line2,.block7.selected .border-line2 {
    height: 100%;
}
.block1.selected .border-line3,.block3.selected .border-line3,.block5.selected .border-line3,.block7.selected .border-line3 {
    width: 100%;
}
.block1.selected .border-line4,.block3.selected .border-line4,.block5.selected .border-line4,.block7.selected .border-line4 {
    height: 100%;
}
.block1.selected .text,.block3.selected .text,.block5.selected .text,.block7.selected .text {
    transform: translateX(0px);
    -webkit-ransform: translateX(0px);
}


.block2.selected .border-line1,.block4.selected .border-line1,.block6.selected .border-line1,.block8.selected .border-line1 {
    width: 100%;
}
.block2.selected .border-line2,.block4.selected .border-line2,.block6.selected .border-line2,.block8.selected .border-line2 {
    height: 100%;
}
.block2.selected .border-line3,.block4.selected .border-line3,.block6.selected .border-line3,.block8.selected .border-line3 {
    width: 100%;
}
.block2.selected .border-line4,.block4.selected .border-line4,.block6.selected .border-line4,.block8.selected .border-line4 {
    height: 100%;
}
.block2.selected .text,.block4.selected .text,.block6.selected .text,.block8.selected .text {
    transform: translateX(0px);
    -webkit-ransform: translateX(0px);
}



.bask {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.6);
    background: #000\9;
    filter:alpha(opacity=60);
}
.bask1 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.7);
}
.bask2 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #000 url(../images/filter.png) no-repeat center center;
    opacity: 0.5;
    filter:alpha(opacity=30);
    transition: .4s;
    -webkit-transition: .4s;
}
.inside-success .inside-success-li:hover .bask2 {
    opacity: 0.7;
    filter:alpha(opacity=70);
}
.bask3 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-left: 10px solid #fff;
    border-right: 10px solid #fff;
    background: #000 url(../images/filter.png) no-repeat center center;
    opacity: 0.3;
    filter:alpha(opacity=30);
    transition: .4s;
    -webkit-transition: .4s;
}
.inside-success .inside-success-li:hover .bask3 {
    opacity: 0.7;
    filter:alpha(opacity=70);
}

@media (max-width: 1680px) {
    .info .text1 {
        font-size: 44px;
        line-height: 46px;
        margin-bottom: 25px;
    }
    .info .text2 {
        font-size: 16px;
        line-height: 22px;
    }
    .info {
        width: 335px;
        height: 414px;
    }
    .info1, .info4, .info6, .info8 {
        left: 23%;
    }
    .info2, .info3, .info5, .info7 {
        right: 23%;
    }
    .text {
        margin-top: 65px;
    }
}
@media (max-width: 480px) {
    /*.container {
        max-width: 1420px;
    }

    .banner-text2 {
        font-size: 18px;
        bottom: 60px;
    }
    .banner-line img {
        width: 10px;
        padding-left: 4px;
    }
    .banner-line {
        bottom: 70px;
    }
    .block .logo {
        padding: 20px 10px;
    }
    .info {
        position: absolute;
        top: 50%;
        display: inline-block;
        text-align: center;
        width: 262px;
        height: 350px;
        margin-top: -130px;
    }
    .info .text1 {
        padding-bottom: 10px;
        font-size: 34px;
        line-height: 34px;
        color: #fff;
        padding-bottom: 10px;
    }
    .text {
        margin-top: 55px;
    }
    .info em {
        display: block;
        height: 50px;
        width: 1px;
        background: #fff;
        margin: 0 auto;
        margin-bottom: 15px;
    }
    .info .text2 {
        font-size: 16px;
        line-height: 26px;
        color: #fff;
        max-width: 196px;
        margin: 0 auto;
        padding-bottom: 15px;
    }
    .banner-text3 img {
        width: 70%;
    }
    .banner-text1 {
        font-size: 20px;
        border-bottom: 2px solid #fff;
        color: #fff;
        display: inline-block;
        margin:14% auto 0;
    }*/
}


.animate_blcok {
    position: relative;
}


















@media (max-width: 480px) {
    .info .text2 {
        max-width: 220px;
    }
    .info {
        position: absolute;
        top: 50%;
        display: inline-block;
        text-align: center;
        width: 270px;
        height: 330px;
        margin-top: -165px;
    }
    .info2,.info3,.info5,.info7 {
        right: 50%;
        margin-right: -135px;
    }
    .info1,.info4,.info6,.info8 {
        left: 50%;
        margin-left: -135px;
    }
    .info .text-box2,.info .text-box1,.info .text-box3,.info .text-box5,.info .text-box7 {
        transform: translateX(500px);
        -webkit-ransform: translateX(500px);
        transition: all .4s cubic-bezier(0.42,0,0.58,1) .1s;
        -webkit-transition: all .4s cubic-bezier(0.42,0,0.58,1) .1s;
    }
    .info .text-box4,.info .text-box6,.info .text-box8 {
        transform: translateX(-500px);
        -webkit-ransform: translateX(-500px);
        transition: all .4s cubic-bezier(0.42,0,0.58,1) .1s;
        -webkit-transition: all .4s cubic-bezier(0.42,0,0.58,1) .1s;
    }


    .border-line1 {
        width: 0%;
        height: 6px;
        left: 0;
        top: 0;
        transition: all .2s cubic-bezier(0.55, 0.055, 0.675, 0.19) .4s;
        -webkit-transition: all .2s 300ms cubic-bezier(0.55, 0.055, 0.675, 0.19) .4s;
    }
    .border-line2 {
        height: 0%;
        width: 6px;
        right: 0;
        top:0;
        transition: all .15s linear .6s;
        -webkit-transition: all .15s linear .6s;
    }
    .border-line3 {
        width: 0%;
        height: 6px;
        right: 0;
        bottom: 0;
        transition: all .15s linear 0.7s;
        -webkit-transition: all .15s linear 0.7s;

    }
    .border-line4 {
        height: 0%;
        width: 6px;
        bottom: 0;
        left: 0;
        transition: all .15s cubic-bezier(0.215, 0.61, 0.355, 1) .8s;
        -webkit-transition: all .15s cubic-bezier(0.215, 0.61, 0.355, 1) .8s;
    }
    .info .text1 {
        font-size: 30px;
        line-height: 32px;
        margin-bottom: 25px;
    }
    .info em {
        margin-bottom: 15px;
    }
    .info .text2 {
        padding-bottom: 15px;
    }
    .text {
        margin-top: 50px;
    }
    .info.info8 {
        height: 360px;
    }
    .info.info2 {
        margin-top: -191px;
    }
    .border-line {
        background: rgba(256,256,256,.5);
        filter:alpha(opacity=50);
    }
}




























































.public-safety {
    background: url(../images/internal-img6.jpg) no-repeat center center;
}
.education {
    background: url(../images/internal-img2.jpg) no-repeat center center;
}
.finance {
    background: url(../images/internal-img3.jpg) no-repeat center center;
}
.media-and-entertainment {
    background: url(../images/internal-img8.jpg) no-repeat center center;
}
.rail-way {
    background: url(../images/internal-img7.jpg) no-repeat center center;
}
.smart-grid {
    background: url(../images/internal-img4.jpg) no-repeat center center;
}
.inside-banner {
    position: relative;
    background-size: cover;
    -ms-behavior: url(backgroundsize.min.htc);
    behavior: url(backgroundsize.min.htc);
}
/*.inside-header {
    position: absolute;
    width: 94%;
    left: 3%;
    top: 0;
    padding-top: 40px;
    overflow: hidden;
}*/
.inside-header {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    padding-top: 35px;
    overflow: hidden;
    z-index: 9999;
    padding-left: 50px;
    padding-right: 50px;
}
.inside-logo {
    width: 157px;
    display: inline-block;
    height: 37px;
    vertical-align: middle;
}
.inside-logo img {
    display: block;
    width: 100%;
}
.inside-nav {
    display: inline-block;
    vertical-align: middle;
    float: right;
    margin-top: 4px;
    padding-right: 30px;
}
.inside-nav li {
    display: inline-block;
    font-size: 0;
}
.inside-nav li a.active::before{
    width: 100%;
    left: 0;
}
.inside-nav li a {
    font-size: 14px;
    line-height: 26px;
    color: #fff;
    display: inline-block;
    margin: 0 18px;
    transition: 0s;
    -webkit-transition: 0s;
}
/*.inside-nav li a:hover {
    border-bottom: 2px solid #fff;
}*/
.backhome {
    float: right;
    color: #fff;
}
.inside-back {
    width: 100px;
    height: 36px;
    line-height: 36px;
    border: 1px solid #fff;
    border-radius: 36px;
    font-size: 12px;
    text-align: center;
    display: inline-block;
    color: #fff;
    vertical-align: middle;
}
.inside-cn {    
    width: 30px;
    height: 36px;
    line-height: 36px;
    border-radius: 36px;
    font-size: 12px;
    text-align: center;
    display: inline-block;
    color: #fff;
    vertical-align: middle;
}
.inside-text-middle {
    position: relative;
    display: inline-block;
    width: 99%;
    text-align: center;
    vertical-align: middle;
    margin-bottom: 70px;
}
.verticalmiddle {
    display: inline-block;
    vertical-align: middle;
    height: 100%;
    width: -1px;
}
.inside-banner-title {
    text-align: center;
    max-width: 1185px;
    margin: 0 auto;
}
.inside-banner-title img {
    display: inline-block;
    width: 100%;

}
.inside-banner-title p {
    font-size: 30px;
    line-height: 30px;
    color: #fff;
    padding: 20px 0 0 0;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: 'sofia-medium';
    letter-spacing: 2px;
}
.inside-vedio {
    width: 256px;
    height: 80px;
    background: #cc3947 url(../images/inside-triangle1.png) no-repeat 40px center;
    border-radius: 80px;
    display: inline-block;
    margin-top: 70px;
    transition: .5s;
    -webkit-transition: .5s;
}
.inside-vedio span {
    line-height: 80px;
    color: #fff;
    text-align: center;
    font-size: 18px;
    text-transform: uppercase;
    padding-left: 35px;
    letter-spacing: 3px;
    transition: .5s;
    -webkit-transition: .5s;
    font-family: 'sofia-bold';
    letter-spacing: 1px;
    position: relative;
}
.vedioparam{
    position: absolute;
    top: 58%;
    left: 50%;
}
.inside-vedio:hover {
    background: #ac212e url(../images/inside-triangle1.png) no-repeat 40px center;
}
.register {
    font-size: 14px;
    line-height: 22px;
    font-family: Arial;
}
.register-banner .inside-nav li a{
    color: #333;
}
.register-banner .inside-back {
    color: #333;
    border: 1px solid #999;
}
.register-banner .inside-text-middle {
    margin-bottom: 0;
}
.register-banner .inside-header {
    padding-top: 20px;
}
@media (max-width: 1680px) {
    .inside-banner-title p {
        font-size: 22px;
    }
    .inside-banner-title{
        max-width: 1000px;
    }
    .inside-banner-title img {
        width: 75%;

    }

    .inside-vedio {
        width: 250px;
        height: 60px;
    }
    .inside-vedio span {
        line-height: 60px;
    }
    .inside-banner-title p {
        font-size: 24px;
        line-height: 25px;
    }
    .inside-vedio {
        width: 220px;
        height: 66px;
        background: #cc3947 url(../images/inside-triangle1.png) no-repeat 34px center;
    }
    .inside-vedio span {
        line-height: 66px;
        font-size: 16px;
    }
    .inside-logo {
        width: 130px;
    }
    .inside-text-middle {
        margin-bottom: 0;
    }
}
@media (max-width: 1024px) {
    .container {
        padding-left: 10px;
        padding-right: 10px;
    }
    .inside-header {
        padding-top: 20px;
    }
    .inside-logo img {
        display: block;
        width: 100%;
    }
    .inside-logo {
        width: 112px;
    }
    .inside-nav {
        float: none;
        padding-right: 0;
        background: rgba(256,256,256,1);
        height: 100%;
        position: fixed;
        left: 0;
        top: -100%;
        z-index: 99;
        margin-top: 0;
    }
    .inside-nav li {
        width: 100%;
        text-align: center;
        font-size: 16px;
        padding: 5px;
    }
    .inside-nav li a {
        color: #666;
        border-bottom: 2px solid #fff;
    }
    .backhome {
        float: right;
        color: #fff;
        position: fixed;
        z-index: 100;
        color: #666;
        width: 100%;
        bottom: -100%;
        border-top: 1px solid #999;
        left: 0;
    }
    .inside-cn {
        color: #666;
        width: 50%;
        border-radius: 0;
        display: block;
        width: 50%;
        float: left;
        border:none;
    }
    .inside-back {
        color: #666;
        width: 100%;
        border-radius: 0;
        border:none;
        float: left;
    }
    .backhome span {
        display: none;
    }
    .inside-nav li.top {
        margin-top: 100px;
    }
}

@media (max-width: 480px) {
    .inside-banner-title p {
        font-size: 12px;
        line-height: 18px;
    }
    .inside-vedio {
        width: 166px;
        height: 50px;
        background: #cc3947 url(../images/inside-triangle1.png) no-repeat 16px center;
        background-size: 8px;
    }
    .inside-vedio span {
        line-height: 50px;
        color: #fff;
        text-align: center;
        font-size: 14px;
        text-transform: uppercase;
        font-weight: normal;
        padding-left: 12px;
        letter-spacing: 2px;
        font-family: 'sofia-regular';
    }
    .inside-text-middle {
        margin-top: 58%;
    }
    .public-safety {
        background: url(../images/wap-img6.jpg) no-repeat center center;
    }
    .education {
        background: url(../images/wap-img2.jpg) no-repeat center center;
    }
    .finance {
        background: url(../images/wap-img3.jpg) no-repeat center center;
    }
    .media-and-entertainment {
        background: url(../images/wap-img8.jpg) no-repeat center center;
    }
    .rail-way {
        background: url(../images/wap-img7.jpg) no-repeat center center;
    }
    .smart-grid {
        background: url(../images/wap-img4.jpg) no-repeat center center;
    }
    .register-banner .inside-text-middle {
        margin-top: 40px;
    }
    .register-banner .wap_navbtn span {
        background: #666;
    }
    .register-banner .wap_navbtn span:before, .register-banner .wap_navbtn span:after {
        background: #666;
    }

}



s




.inside-solutions {
    font-size: 0;
}
.h2-tilte {
    text-align: center;
    padding-bottom: 45px;
}
.h2-tilte span {
    font-size: 42px;
    line-height: 42px;
    display: inline-block;
    padding-left: 50px;
    text-transform: uppercase;
    font-weight: normal;
    letter-spacing: 3px;
    font-family: 'sofia-light';
}
.solutions-icon {
    background: url(../images/solution-title-icon.png) no-repeat left center;
}
.inside-solutions .row {
    display: table;
}
.inside-solutions-l,.inside-solutions-r {
    width: 50%;
    display: inline-block;
    margin-bottom: 30px;
    display: table-cell;
    background: #f8f8f8;
    border-left: 10px solid #fff;
    border-right: 10px solid #fff;
}
.line3 .inside-solutions-l,.line3 .inside-solutions-r {
    width: 33.33333%;
}
/*.inside-solutions .padding55 {
    background: #f8f8f8;
}*/
.inside-solutions-l img ,.inside-solutions-r img {
    display: block;
    width: 100%;
}
.inside-solutions-l h3, .inside-solutions-r h3 {
    font-size: 30px;
    line-height: 30px;
    margin-bottom: 16px;
    letter-spacing: 2px;
    font-family: 'sofia-medium';
    font-weight: normal;
    letter-spacing: 1px;
}
.inside-solutions-l span ,.inside-solutions-r span {
   display: block;
   margin-bottom: 5px;
}
.inside-solutions-l a ,.inside-solutions-r a {
   background: url(../images/solutions-point3.png) no-repeat left 7px;
   padding-left: 20px;
   font-size: 16px;
   line-height: 20px;
   color: #666;
   display: inline-block;
    letter-spacing: 1px;
}
.inside-solutions-l a:hover ,.inside-solutions-r a:hover {
   color: #cc3947;
}
@media (max-width: 1680px) {
    .h2-tilte span {
        font-size: 30px;
        padding-left: 40px;
    }
    .solutions-icon {
        background-size: 24px;
    }
    .inside-solutions-l h3, .inside-solutions-r h3 {
        font-size: 24px;
        line-height: 26px;
    }
    .inside-solutions-l a, .inside-solutions-r a {
        font-size: 14px;
    }
}
@media (max-width: 1024px) {
    .inside-solutions-l h3, .inside-solutions-r h3 {
        font-size: 24px;
        line-height: 24px;
    }
    .padding55 {
        padding: 30px 35px;
    }
}

@media (max-width: 768px) {
    .inside-solutions-l,.inside-solutions-r {
        width: 100%;
        display:block;
    }
    .line3 .inside-solutions-l,.line3 .inside-solutions-r {
        width: 50%;
    }
}
@media (max-width: 480px) {
    .padding55 {
        padding: 20px;
    }
    .inside-solutions-l h3, .inside-solutions-r h3 {
        font-family: 'sofia-light';
        font-size: 18px;
        line-height: 18px;
        letter-spacing: 1px;
        margin-bottom: 15px;
    }
    .inside-solutions-l,.inside-solutions-r {
        border-left: 0 solid #fff;
        border-right: 0 solid #fff;
    }
    .line3 .inside-solutions-l,.line3 .inside-solutions-r {
        width: 100%;
    }
}











.rotator2 {
    font-size: 0;
    background: #ececec;
}
.inside-videos-icon {
    background: url(../images/inside-videos-icon.png) no-repeat left center;
}
.rotator2-con {
    display: inline-block;
    width: 70%;
    overflow: hidden;
    vertical-align: middle;
    position: relative;
}
.rotator2-con .max-arrow {
    position: absolute;
    top: 50%;
    margin-top: -16px;
    cursor: pointer;
    display: none;
}
.rotator2-con .left-arrow {
    left: 10px;
}
.rotator2-con .right-arrow {
    right: 10px;
}
.rotator2-con ul li {
    position: relative;
    display: inline-block;
    vertical-align:top;
}
.rotator2-con ul li div {
    position: relative;
}
.rotator2-con ul li img.rotator2-maxpic {
    display: block;
    width: 100%;
}
.rotator2-con ul li p {
    background: #34363b;
    background: rgba(0,0,0,.55);
    filter:alpha(opacity=55);
    font-size: 24px;
    color: #fff;
    line-height: 30px;
    padding: 35px 0;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    text-align: center;
    font-family: 'sofia-medium';
    letter-spacing: 1px;
}
.rotator2-con ul li .rotator2-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -48px;
    margin-top: -48px;
    width: 96px;
    height: 96px;
    display: block;
    background: url(../images/video-icon2.png) no-repeat center center;
    transition: .5s;
    -webkit-transition: .5s;
}
.rotator2-con ul li .rotator2-icon:hover {
    background: url(../images/video-icon2-hover.png) no-repeat center center;
}
.rotator2-minpic-block {
    display: inline-block;
    width: 30%;
    vertical-align: middle;
}
.rotator2-minpic-block .rotator2-minpic-block-con {
    padding:0 0 0 30px;
    overflow: hidden;
}
.rotator2-minpic-block ul li {
    margin-bottom: 19px;
}
.rotator2-min {
    width: 46%;
    position: relative;
    float: left;
    border:4px solid #ececec;
    transition: .5s;
    -webkit-transition: .5s;
}
.rotator2-minpic-block ul li:hover .rotator2-min {
    border:4px solid #cc3947;
}
.rotator2-minpic-block ul li.active .rotator2-min {
    border:4px solid #cc3947;
}
.rotator2-min img.rotator2-minpic {
    width: 100%;
    display: block;

}
.rotator2-min img.rotator2-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -16px;
    margin-left: -16px;
}
.rotator-mintext {
    width: 54%;
    float: left;
}
.rotator-mintext p {
    font-size: 16px;
    line-height: 18px;
    color: #666666;
    padding: 10px 15px;
    letter-spacing: 1px;
    transition: .5s;
    -webkit-transition: .5s;
}
.rotator2-minpic-block ul li:hover .rotator-mintext p {
    color: #cc3947;
}
.rotator2-minpic-block ul li.active .rotator-mintext p {
    color: #cc3947;
}
.rotator2-minpic-block .arrow {
    display: block;
    padding-left: 56%;
    margin-left: 3px;
    cursor: pointer;
    width: 32px;
    height: 19px;
}
.rotator2-minpic-block .arrow-prev {
    margin-bottom: 15px;
    background: url(../images/prev-arrow.png) no-repeat center center;
    opacity: 0;
}
.rotator2-minpic-block .arrow-next {
    margin-top: 15px;
    background: url(../images/next-arrow.png) no-repeat center center;
}
.rotator2-minpic-block .arrow-prev:hover {
    margin-bottom: 15px;
    background: url(../images/prev-arrow-hover.png) no-repeat center center;
}
.rotator2-minpic-block .arrow-next:hover {
    margin-top: 15px;
    background: url(../images/next-arrow-hover.png) no-repeat center center;
}



@media (max-width: 1680px) {
    .rotator2-con ul li img.rotator2-icon {
        margin-left: -30px;
        margin-top: -60px;
        width: 60px;
    }
    .rotator2-con ul li p {
        line-height: 30px;
        padding: 25px 0;
        font-size: 20px;
    }
    .rotator-mintext p {
        font-size: 14px;
        line-height: 18px;
        padding: 10px;
    }
    .rotator2-con ul li .rotator2-icon {
        margin-left: -40px;
        margin-top: -40px;
        width: 80px;
        height: 80px;
        background-size: 80px;
    }
    .rotator2-con ul li .rotator2-icon:hover {
        background-size: 80px;
    }

}
@media (max-width: 1024px) {
    .rotator2-con .max-arrow {
        display: block;
    }
    .rotator2-minpic-block {
        display: none;
    }
    .rotator2-con {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .inside-videos-icon {
        background-size: 20px;
    }
    .rotator2-con ul li img.rotator2-icon {
        margin-left: -17px;
        margin-top: -34px;
        width: 34px;
    }
    .rotator2-con ul {
        width: 100% !important;
    }
    .rotator2-con ul li {
        width: 50% !important;
        border-left: 5px solid #fff;
        border-right: 5px solid #fff;
    }
    .rotator2-con ul li p {
        padding: 10px 0 30px;
        font-size: 14px;
        line-height: 16px;
        font-weight: normal;
        position: static;
        background: #fff;
        color: #333;
        text-align: left;
        font-family: 'sofia-regular';
    }
    .rotator2-con ul li .rotator2-icon {
        margin-left: -20px;
        margin-top: -20px;
        width: 40px;
        height: 40px;
        background-size: 40px;
    }
    .rotator2 .content {
        padding-bottom: 0;
        margin-left: -5px;
        margin-right: -5px;
    }
 /*   .inside-success {
        margin-left: -5px;
        margin-right: -5px;
    }*/
}









.inside-success {
    font-size: 0;
}
.success-icon {
    background: url(../images/success-title-icon.png) no-repeat left center;
}
.inside-success-li {
    width: 25%;
    position: relative;
    display: inline-block;
    overflow: hidden;
}
.inside-success-li img {
    display: block;
    width: 100%;
    transition: .5s;
    -webkit-transition: .5s;
}
.inside-success-position {
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    width: 100%;
}
.inside-success-absolute {
    padding: 0 40px;
    position: absolute;
    left: 0;
    bottom: 0%;
    transition: .5s;
    -webkit-transition: .5s;
}
.inside-success-absolute h3 {
    font-size: 26px;
    line-height: 32px;
    color: #fff;
    margin-bottom: 20px;
    letter-spacing: 2px;
}
.inside-success-absolute span {
    font-size: 16px;
    line-height: 18px;
    color: #fff;
    opacity: 0;
    filter:alpha(opacity=0);
    margin-top: 37px;
    display: inline-block;
    transition: .5s;
    -webkit-transition: .5s;
    letter-spacing: 1px;
}
.inside-success-position a {
    margin: 0 40px;
    font-size: 14px;
    line-height: 46px;
    text-align: center;
    width: 164px;
    height: 46px;
    background: #cc3947;
    border-radius: 46px;
    color: #fff;
    position: absolute;
    bottom: -10%;
    left: 0;
    text-transform: uppercase;
    opacity: 0;
    transition: all .3s ease-in-out .1s;
    -webkit-transition: all .3s ease-in-out .1s;
    letter-spacing: 2px;
}
.inside-success-position a:hover {
    background: #ac212e;
}
.inside-success-li:hover .inside-success-absolute {
    bottom: 39%;
}
.inside-success-li:hover span {
    opacity: 1;
    filter:alpha(opacity=100);
    margin-top: 0;
}
.inside-success-li:hover a {
    opacity: 1;
    bottom: 19%;
}
.inside-success-li:hover img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
}
.inside-success.content {
    padding-bottom: 40px;
}
.inside-success.container2 .inside-success-li{
    width: 50%;
}
.inside-success.container2 .inside-success-li h3 {
    font-size: 24px;
}
.inside-success.container2 .inside-success-li span {
    font-size: 14px;
}
.inside-success-li-con {
    border-left:10px solid #fff;
    border-right:10px solid #fff;
}
.inside-success.container2 .inside-success-absolute h3 {
    font-size: 26px;
}
.inside-success.container2 .inside-success-absolute span {
    font-size: 16px;
}
@media (max-width: 1680px) {
    .inside-success-absolute h3 {
        font-size: 20px;
        line-height: 28px;
    }
    .inside-success-position a {
        font-size: 12px;
        line-height: 38px;
        width: 136px;
        height: 38px;
    }
    .inside-success.container2 .inside-success-absolute span {
        font-size: 13px;
        margin-top: 25px;
    }
    .inside-success-absolute span {
        margin-top: 0px;
    }
    .inside-success.container2 .inside-success-li:hover .inside-success-absolute {
        bottom: 30%;
    }
    .inside-success-li:hover .inside-success-absolute {
        bottom: 27%;
    }
    .inside-success-li:hover a {
        bottom: 10%;
    }

}
@media (max-width: 1024px) {
    .inside-success-absolute h3 {
        font-size: 18px;
        line-height: 22px;
    }
    .inside-success-absolute {
        padding: 0 20px;
    }
    .inside-success-position a {
        margin: 0 20px;
    }
    .inside-success-absolute h3 {
        margin-bottom: 10px;
    }
}


@media (max-width: 768px) {
    .inside-success-li {
        width: 50%;
    }
}

@media (max-width: 480px) {
    .success-icon {
        background-size: 20px;
    }
    .inside-success-li span {
        display: none;
    }
    .inside-success-li a {
        opacity: 1;
        bottom: 19%;
    }
    .inside-success-li:hover img {
        filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -ms-filter: grayscale(0);
        -o-filter: grayscale(0);
    }
    .inside-success-absolute h3 {
        font-size: 16px;
        line-height: 18px;
    }
    .inside-success-position a {
        font-size: 12px;
        line-height: 38px;
        width: 128px;
        height: 36px;
    }
    .inside-success-li .inside-success-absolute {
        top: 50%;
    }
    .inside-success-li-con {
        border-left: none;
        border-right: none;
    }
    .inside-success.container2 .inside-success-li {
        width: 100%;
        margin-bottom: 10px;
    }
    .bask3 {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        border: none;
        border-left: none;
        border-right: none;
        background: #000 url(../images/filter.png) no-repeat center center;
        opacity: 0.6;
        filter: alpha(opacity=30);
        transition: .4s;
        -webkit-transition: .4s;
        /* margin-left: 1px; */
    }
    .inside-success.container2 .inside-success-li h3 {
        line-height: 28px;
    }
    .inside-success.container2 .inside-success-absolute h3 {
        font-size: 18px;
    }
    .inside-success.container2 .inside-success-li .inside-success-absolute {
        top: 40%;
    }
    .inside-success.container2 .inside-success-absolute {
        top: 25%;
    }
    .max-arrow.right-arrow {
        display: none;
    }
    .inside-success-li {
        width: 100%;
    }
    .inside-success-li-block {
        margin: 0 10px 10px;
        position: relative;
    }
    .inside-success.content {
        padding-bottom: 10px;
    }
}





/*.footer {*/
    /*display: block;*/
    /*text-align: center;*/
    /*background: #4d4d4d;*/
    /*!* border-bottom: 5px solid #fff; *!*/
    /*margin-bottom: 40px;*/
/*}*/

/*.footer span {*/
    /*background: url(../images/download-icon.png) no-repeat left center;*/
    /*font-size: 30px;*/
    /*line-height: 34px;*/
    /*display: inline-block;*/
    /*color: #fff;*/
    /*padding: 43px 0;*/
    /*padding-left: 45px;*/
    /*transition: .5s;*/
    /*-webkit-transition: .5s;*/
/*}*/
/*.footer:hover {*/
    /*background: #cc3947;*/
/*}*/


.copyright {
    color: #fff;
    background: #161616;
    font-size: 12px;
    line-height: 16px;
    font-family: Arial;
    line-height: 79px;
    letter-spacing: 2px;
}
.index-copyright {
    color: #fff;
    background: #161616;
    font-size: 12px;
    line-height: 79px;
    letter-spacing: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}
.copyright_p {
    float: left;
}
.share {
    float: right;
}
.share span {
    display: inline-block;
    float: left;
    margin-right: 36px;
}
.share ul {
    display: inline-block;
    float: left;
}
.share li {
    float: left;
    padding: 0 10px;
    position: relative;
}
.share li.enterprise-app-icon:hover .enterprise-app-pic {
    display: block;
}
.share li.weixin-icon:hover .weixin-pic {
    display: block;
}
.share img {
    display: block;
    width: 100%;
}
.share a {
    display: inline-block;
    font-size: 0;
    line-height: 0;
    width: 30px;
}
.share i {
    font-size: 34px;
    color: #909090;
    position: absolute;
    left: -12px;
    top: 40px;
}
.app-code {
    position: absolute;
    background: #fff;
    padding: 2px;
    left: 50%;
    bottom: 86%;
    display: none;
    margin-left: -68px;
}
.app-code b {
    display: block;
    width: 0;
    height: 0;
    line-height: 0;
    overflow: hidden;
    border: 8px transparent solid;
    border-top: 8px #fff solid;
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -8px;
}

@media (max-width: 1680px) {

    .footer span {
        font-size: 24px;
        padding: 30px 0;
        padding-left: 40px;
    }
}
@media (max-width: 480px) {
    .h2-tilte {
        padding-bottom: 20px;
    }
    .h2-tilte span {
        font-size: 24px;
        line-height: 24px;
        padding-left: 30px;
    }
    .solutions-icon {
        background-size: 20px;
    }
    .rotator2 {
        background: #fff;
    }
    .inside-solutions .content {
        padding-bottom: 0px;
    }
    .copyright {
        color: #fff;
        background: #161616;
        text-align: center;
        font-size: 12px;
        line-height: 18px;
        letter-spacing: 2px;
        padding: 20px 20px;
    }
    .index-copyright {
        padding:10px 0;
        line-height: 16px;
    }
    .footer { 
        margin-bottom: 20px;
    }
    .footer span {
        background: url(../images/download-icon.png) no-repeat left center;
        line-height: 34px;
        display: inline-block;
        color: #fff;
        transition: .5s;
        -webkit-transition: .5s;
        background-size: 16px;
        font-size: 14px;
        padding: 20px 0;
        font-family: 'sofia-medium';
        letter-spacing: 1px;
        padding-left: 26px;
    }
    .share span {
        display: none;
    }
    .share,.copyright_p,.share ul {
        float: none;
        text-align: center;
    }
    .copyright_p {
        text-align: center;
    }
    .share li {
        padding: 15px 10px;
    }
    .share i {
        left: 0;
        top: 20px;
    }
    .app-code {
        bottom: 115%;
        margin-left: -44px;
    }
/*    .inside-header {
        position: fixed;
        width: 100%;
        left: 0%;
        top: 0;
        padding-top: 40px;
        overflow: visible;
        background: #cc3947;
        padding: 0 25px;
        z-index: 9999;
    }*/
    .inside-header {
        padding-top: 19px;
        padding-left: 20px;
        padding-right: 20px;
    }
    .inside-nav li a {
        font-size: 20px;
        line-height: 28px;
        display: inline-block;
        margin: 10px 18px;
        transition: 0s;
        -webkit-transition: 0s;
    }
}





@media (max-width:1024px) {

    .wap_navbtn {display: none;float: right;width: 25px;height:29px;position: relative;cursor:pointer;position:relative;z-index: 1000;margin-left: 20px;}
    .wap_navbtn span {display: inline-block;width: 25px;height: 2px;top: 14px;right: auto;background:#fff;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;position:absolute;transition:background 0.3s;}
    .wap_navbtn span:before,.wap_navbtn span:after {content: '';display:block;background:#fff;height: 100%;width: 100%;position: absolute;right: 0;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    .wap_navbtn span:before {top: -8px;}
    .wap_navbtn span:after {bottom: -8px;}
    .wap_navbtn {display:block;}
    .wap_navbtn.close span {background: rgba(256,256,256,0);}
    .wap_navbtn.close span:after {-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-webkit-transform: rotate(-45deg);transform: rotate(-45deg);bottom: 0;background:#fff;}
    .wap_navbtn.close span:before {-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg);top: 0;background:#fff;}
}











/*btn-icon4*/
.btn-icon5::before {width: 0;height: 100%;position: absolute;top: 0;left: 50%;z-index: 1;content: '';transition:0.3s;-webkit-transition:0.3s;}
.btn-icon5::before {border-bottom: 1px solid #fff;background: transparent;transform:translate(0,-1px);-webkit-transform:translate(0,-1px);}
.btn-icon5:hover::before{width: 100%;left: 0;}
.btn-icon5 {color: #fff;position: relative;z-index: 3;overflow: hidden;cursor: pointer;margin-top: 60px;display: inline-block;}










.mobile-nav {
    display: none;
}

@media (max-width:1024px) {
    .mobile-nav {
        position: fixed;
        left: 0;
        top: 1000px;
        width: 100%;
        height: 100%;
        background: #ca3a47 url(../images/point4.png) repeat-y 50px 0;
        z-index: 8888;
        height: 0;
        display: block;
    }
    .mobile-nav .icon-close {
        position: absolute;
        right: 10px;
        top: 10px;
        font-size: 40px;
        color: #fff;
    }
    .mobile-nav ul {
        margin-top: 30%;
    }
    .mobile-nav ul li {
        position: relative;
    }
    .mobile-nav ul li a {
        display: block;
        color: #fff;
        padding: 20px 0 20px 80px;
        font-size: 18px;
    }
    .mobile-nav ul li::before {
        content: '';
        position: absolute;
        left: 43px;
        top: 22px;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        border: 1px solid #fff;
        background: #ca3a47;
    }
    .mobile-nav ul li.active::before {
        background: #fff;
    }
    .mobile-nav ul li:hover::before {
        background: #fff;
    }
    .return-btn {
        position: absolute;
        left: 0;
        bottom: 0;
        border-top:1px solid #fff;
        width: 100%;
        background: #ca3a47;
    }
    .return-btn a {
        width: 100%;
        float: left;
        font-size: 16px;
        text-align: center;
        height: 50px;
        line-height: 50px;
        color: #fff;
    }
    .switch {
        border-right:1px solid #fff;
    }
    .website {
    }
}









.side-navigation {
    position: fixed;
    right: 0;
    top: 50%;
}
.side-navigation a {
    display: block;
    width: 300px;
    height: 60px;
    line-height: 56px;
    background: #cc3a47;
    color: #fff;
    border-top-left-radius: 60px;
    border-bottom-left-radius: 60px;
    text-align: center;
    cursor: pointer;
    margin-right: -250px;
    transition: .5s;
    -webkit-transition: .5s;
}
.side-navigation a:hover {
    margin-right: 0;
}
.side-navigation a:hover i {
    margin-left: 0;
}
.side-navigation a i {
    font-size: 24px;
    margin-right: 10px;
    display: inline-block;
    vertical-align: middle;
    margin-left: -40px;
}
.side-navigation a span {
    display: inline-block;
    vertical-align: middle;
}


/**white paper**/
.down-white-paper{ background: url(../images/download-book-bg.jpg) no-repeat center top;padding-left:20px;padding-right: 20px;}
.down-white-paper.page{padding: 127px 20px;}
.down-white-paper.index-page{ background: none;padding-left: 15%; display: inline-block;
    vertical-align: middle;width: 97%}
.down-white-paper figure{float:left;width:40%; text-align: center;max-width: 499px;}
.down-white-paper figure img{width: 100%;}
.down-white-paper article{float:left;width:60%; padding-left: 7%;}
.down-white-paper h4{font-size:42px; font-weight: normal;font-family: 'sofia-light';}
.down-white-paper.index-page h4{color:#fff;}
.down-white-paper.index-page .section-part{color:#fff;}
.section-part{ margin: 20px 0 55px;font-size:18px;color:#666;line-height: 30px;font-family: 'sofia-regular';}
.down-white-paper article a{position: relative;display:inline-block;padding: 20px 30px; background: #cc3947;color:#fff; border-radius: 30px; text-align: center}
.down-white-paper article a:hover{ background: #c51627}
.down-white-paper article a span{ position: relative;padding-left: 36px;display: inline-block;text-transform:uppercase;font-size:18px; letter-spacing: 2px;}
.down-white-paper article p em{display:block; position: absolute;color:#fff;font-size:26px; font-weight: normal;left:0;top:-7px;}
.down-white-paper.index-page a{background: none;border:3px #fff solid;border-radius: 50px;}
.down-white-paper.index-page a:hover{border-color:#c51627}
@media (max-width:1600px) {
    .down-white-paper figure{max-width: 410px;}

    .down-white-paper h4{font-size:36px;}
    .section-part{font-size:14px;line-height:1.5; letter-spacing: 1px;}
    .down-white-paper article a{padding: 12px 30px;}
    .down-white-paper article a span{font-size:12px;}
    .down-white-paper article a em{font-size:21px;top:-6px;}
}
@media (max-width:1400px) {
   .down-white-paper.page{padding:100px 20px}
    .down-white-paper.index-page{padding-left: 20%;}
    .down-white-paper figure{max-width: 340px;}
    .down-white-paper.index-page article{padding-right: 7%;}
}
@media (max-width:1024px) {
    .down-white-paper.page{padding:60px 20px}
    .section-part{ margin: 20px 0 40px}
    .down-white-paper article{padding-left:5%}
    .down-white-paper.index-page{padding-left:5%;}
    .down-white-paper.index-page article a{padding-left:15px;padding-right: 15px;border-width: 1px;}
}
@media (max-width:768px) {
    .down-white-paper.page{padding:30px 20px}

    .down-white-paper article a span{font-size:14px;}
}
@media (max-width:640px) {
    .down-white-paper figure{display:none;}
    .down-white-paper article{width: 100%;padding: 0;}
    .section-part{ margin:10px 0 20px}
    .down-white-paper h4{font-size:24px;}
    .down-white-paper.index-page article{padding-right: 0;}
    .fp-tableCell > div { height: 100%;}

}




/*导航 s*/

header{ width: 100%; position: fixed; top: 0; left: 0; overflow: hidden; padding:14px 84px 24px 95px; z-index: 1; transition:all ease .5s;}
header.min{ padding:5px 84px 5px 95px;}
.logo{ float: left; max-width: 152px;}
.logo img{ display: block; width: 100%; margin-top: 6px;}
.back-home{ float:right; padding-top: 9px;}
.back-home a{ display: block; font-size: 12px; color: #ffffff; border:1px solid #c8c8c8; border-radius: 50px; padding:9px 14px; text-transform: uppercase;}
header.min .back-home a{ padding:5px 14px;}
.back-home a:hover{ background-color:#e50000; color: #fff; transition:all ease .5s; border:1px solid #e50000;}
.nav{ float: right; padding-top: 11px; padding-right: 40px; transition:all ease .5s;}
.nav li{ font-size: 14px; line-height: 30px; color: #333; padding:0 25px; float: left; display: inline-block; cursor: pointer;}
.nav li a{ font-size: 14px;color: #ffffff;}
.nav li:after{ content: ""; display: block;background-color: #c8c8c8; width: 0; height: 2px; margin:0 auto; transition:all ease .5s;}
.nav li:hover:after{ width: 100%;}
.nav li.current:after{ width: 100%; }
header.min .nav{ padding-top: 5px;} 

.wap_navbtn {display: none;float: right;width: 25px;height:29px;position: relative;cursor:pointer;position:relative;z-index: 10;margin-left: 20px; margin-top: 5px;}
.wap_navbtn span {display: inline-block;width: 25px;height: 2px;top: 14px;right: 0;background:#ffffff;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;position:absolute;transition:background 0.3s;}
.wap_navbtn span:before,.wap_navbtn span:after {content: '';display:block;background:#ffffff;height: 100%;width: 100%;position: absolute;right: 0;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);-webkit-transform: rotate(0deg);transform: rotate(0deg);}
.wap_navbtn span:before {top: -8px;}
.wap_navbtn span:after {bottom: -8px;}
.case-big-box{ position: relative;}
.case-big-box.on:after{ position:absolute;top: 0; left: 0; width: 100%; height: 100%; content: ""; background-color: rgba(1,1,1,0.1); }
.case-menu{ position: fixed; top: 0; left: 100%; width: 60%; height: 100%; background-color: #fff; z-index: 10; padding:40px 20px 0 20px;box-shadow: 0px -8px 20px #f3f4f7; transition:all ease .5s; opacity: 0;}
.case-menu.on{ left: 40%; z-index: 100; opacity: 1;}
.case-menu li{ width: 100%; font-size: 14px; padding:12px 0; text-align: left;}
.case-menu li a{ color: #333;}

.case-menu div{ position: absolute; bottom: 0; left: 0; width: 100%; text-align: center; font-size: 14px; color: #333; border-top: 1px solid #ececec;}
.case-menu div a{ float: left; padding:10px 0; color: #333;}
.case-menu div a.cn{ border-right: 1px solid #ececec; width: 20%}
.case-menu div a.case-menu-back{ width: 80%;}
.case-menu-close{ position: absolute; top: 10px; right: 10px; color: #333;}
.case-menu-close i{ font-size: 30px; line-height: 1;} 
.blur {
    -webkit-filter: blur(2px); /* Chrome, Opera */
    -moz-filter: blur(2px);
    -ms-filter: blur(2px);
    filter: blur(2px);
    filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=2, MakeShadow=false); /* IE6~IE9 */
}

@media(max-width: 1240px){
    header{ padding:6px 20px 14px 20px;}
    .nav li{ padding:0 15px;}
}
@media(max-width: 768px){
    .logo img{ width: 76%;}
    .wap_navbtn{ margin-top: 0;}
    .back-home,.nav{ display: none;}
    .wap_navbtn{ display: block;}
    header{ padding:10px 20px;}
    .logo img{ margin-top: 0;}
}


.head_link{ float: right; color: #fff; font-size: 14px; line-height: 30px; padding-top: 10px; transition: .5s;  -webkit-transition: .5s; margin-right: 20px;}
.min .head_link{ padding-top: 5px;}
.head_link a{ font-size: 14px; color: #fff; position: relative; padding-left: 20px;}
.head_link a.hui{ color: #333;}
.head_link a:hover{ color: #cc3947;}
.head_link a:before{ content: ""; height: 10px; width: 1px; background-color: #fff; display: block; position: absolute; top: 3px; left: 0;}
.head_link a.hui:before{ background-color: #333;}
@media(max-width: 768px){
    .head_link{ display: none;}
}
/*导航 E*/