.index-logo { display: inline-block; vertical-align: top; height: 60px; float:left; }
.index-logo img { height: 100%; }
.index-line { display: inline-block; vertical-align: top; width: 1px; height: 40px; background: #cccccc; margin: 14px 10px; float:left; }
.index-h3 { display: inline-block; vertical-align: top; font-size: 24px; line-height:68px; color: #ffffff; font-weight: normal; }
.index { width: 1180px; margin: 0px auto; }
.index-bg { position:relative; z-index:2; background:url(../../img/bg.jpg) center no-repeat #512adf; height: 600px; width: 100%; }
.index-head { padding: 10px 0px; }


.nav { float:right; font-size:16px }

	ul{
        list-style: none;
    }
    .nav>li{
        float: left;
    }
    
    .nav li  a{            
        display: block;
        text-decoration: none;
        width: 120px;            
        text-align: center;                        
        color: #fff;                 
        height: 50px;
        line-height: 50px;
    }           
    
   .nav ul a{
        display: block;
        text-decoration: none;
        width: 120px;            
        text-align: center;                        
        color: #fff;                 
        height: 50px;
        line-height: 50px;
    }
	
    .nav>li:first-child a{
        border-radius: 10px 0 0 10px;            
    }
    .nav>li:last-child a{
        border-radius: 0 10px 10px 0;            
    }
            
    .drop-down{            
        height: 50px;
        
    }        
    .drop-down-content{
		background-color: #542cdc;  
        padding: 0;
        opacity: 0.3;
        height: 0;
        overflow: hidden;
        transition: all 1s ease;            
    }
            
    .drop-down-content li:hover a{
        background-color:#6a4dcc;
    }
    .nav .drop-down:hover .drop-down-content{
        opacity: 1;
        height: 250px;
    }


/*index*/
.index-top { clear:both; }
.index-left { float:left; width: 560px; margin-right: 60px; margin-top: 60px; }
.index-right { float:left; width: 580px; margin-top: 20px; }
.index-right img { width: 100%; display: block; }
.index-left h3 { font-size:52px; font-weight: normal; color: #fff; }
.index-left h5 { font-size:30px; font-weight: normal; color: #fdd552; margin-top: 20px; }
.index-left p { font-size:20px; color: #fff; margin-top: 5px; }
.index-left a {  display: block; font-size:20px; width: 200px; height: 40px; line-height:40px;margin-top: 80px; color: #fff; text-align: center; background:#fe898c; border-radius: 15px;-webkit-animation: 1s ease; -moz-animation: 1s ease; -ms-animation: 1s ease; animation: 1s ease }
.index-left a:hover { background:#fb6d71;color:#fff; }
.floater { animation-name: floater; -webkit-animation-name: floater; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; visibility: visible !important; }
 @keyframes floater { 0% {transform: translateY(0%);} 50% {transform: translateY(10px);} 100% {transform: translateY(0%);}}
 @-webkit-keyframes floater { 0% {-webkit-transform: translateY(0%);}50% {-webkit-transform: translateY(10px);}100% {-webkit-transform: translateY(0%);}}
@-webkit-keyframes fadeInLeft { 0% {opacity: 0;-webkit-transform: translateX(-20px);transform: translateX(-20px)}100% {opacity: 1;-webkit-transform: translateX(0);transform: translateX(0)}}
 @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px)} 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0)}}
.fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft }
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both }
/*yewubox*/
.yw-box { margin-top:50px; }
.icons-box { width: 120px; height: 30px; background: #fff; margin: -15px auto 0; text-align: center; position: relative; z-index: 5; }
.tt-box h3 { text-align: center; }
.H3-fl { background: #999; margin-top: -3px; display: inline-block; width: 90px; height: 1px; vertical-align: middle; position: relative;animation: arrow-movement 3s 0s linear infinite; }
.H3-fl font { right: 0; width: 3px; height: 3px; background: #999; border-radius: 50%; position: absolute; top: -1px; }
.popular{ display: inline-block; font-size: 30px; line-height: 32px; font-weight: bold; color: #565656; }
.H3-fr { animation: arrow-movement2 3s 0s linear infinite; background: #999; margin-top: -3px; display: inline-block; width: 90px; height: 1px; vertical-align: middle; position: relative; }
.H3-fr font { left: 0; width: 3px; height: 3px; background: #999; border-radius: 50%; position: absolute; top: -1px; }
.tt-box P { text-align: center; }
.hot-list { width:100%; }
.hot-list li { width: 25%; margin: 10px 0; float: left; height: 156px; text-align: center; position: relative; -webkit-transition: all 0.6s ease-in; box-shadow: inset 0 0 0 0px transparent; transition: all 0.6s ease-in; z-index: 3; }
.icons-box { width: 120px; height: 30px; background: #fff; margin: -15px auto 0; text-align: center; position: relative; z-index: 5; }
.icons-box i { width: 35px; height: 30px; }
.icons { display: inline-block;background: url(../../img/icons.png) no-repeat; }
li a:hover .icons { background: url(../../img/icons.png) no-repeat 0px -30px; }
.dib { display: inline-block; }
.hot-list li span { display: block; font-size: 20px; color: #333; line-height: 22px; padding: 25px 0 17px; }
.hot-list li a:hover span { color: #6ccacb;  }
.hot-list li p { font-size: 14px; color: #666; line-height: 24px;padding:0px 20px; }
.icons-box .icon2 { background-position: -36px 0; }
.icons-box .icon3 { background-position: -72px 0; }
.icons-box .icon4 { background-position: -105px 0; }
.icons-box .icon5 { background-position: -140px 0; }
.icons-box .icon6 { background-position: -175px 0; }
.icons-box .icon7 { background-position: -212px 0; }
.icons-box .icon8 { background-position: -245px 0; }
li a:hover .icons-box .icon2 { background-position: -36px -30px; }
li a:hover .icons-box .icon3{ background-position: -72px -30px; }
li a:hover .icons-box .icon4{ background-position: -105px -30px; }
li a:hover .icons-box .icon5{ background-position: -140px -30px; }
li a:hover .icons-box .icon6 { background-position: -175px -30px; }
li a:hover .icons-box .icon7 { background-position: -212px -30px; }
li a:hover .icons-box .icon8 { background-position: -245px -30px; }
.yewubox { border: 1px solid #999; padding: 10px 0; margin:0px 10px; }
.yewubox:hover { border-color: #6ccacb; }
/**/
.all { width: 100%;  overflow: hidden; position: relative; margin-top:50px;margin-bottom:50px;}
.all .big-til { padding: 20px 0 40px; }
.all .big-til h3 { color: white; }
.all .big-til p { color: white; }
.all .w1180 { }
.all .left-img { float: left; width:25%; height: 427px; background: url("../../img/dianshang.jpg") no-repeat; text-align: center; }
.all .left-img .til { font-size: 24px; font-weight: bold; padding-top: 50px; }
.all .left-img .sub { color: #6bade5; font-size: 16px; font-weight: bold; text-transform: uppercase; }
.all .left-img a { position: relative; display: inline-block; *display: inline;background:#0be; *zoom: 1;width: 130px; height: 33px; border: 1px solid #0be; border-radius: 3px; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s;font-size: 16px; line-height: 33px; margin-top: 15px; }
.all .left-img span { position: relative; z-index: 1; color: white; }
.all .left-img i { position: absolute; width: 0; left: 50%; height: 33px; background-color: white; border-radius: 3px; top: 0; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s;}
.all .left-img:hover a { }
.all .left-img:hover span { color: #0be; }
.all .left-img:hover i { width: 100%; left: 0; }
.all ul { font-size: 0; }
.all ul li { display: inline-block; *display: inline; *zoom: 1;vertical-align: middle; position: relative; border-left: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb; -webkit-transition: all .5s linear; -moz-transition: all .5s linear; transition: all .5s linear;width: 24%; height: 212.5px; background-color: white; }
.all ul li div { padding: 20px; }
.all ul li .til { color: #424242; font-size: 18px; font-weight: bold; padding-bottom: 10px; }
.all ul li .til a,.all ul li .til a:visited{font-size: 18px;font-weight: bold;color: #222;}
.all ul li a { display: block; position: relative; color: #727272; font-size: 16px; margin-bottom: 3px; z-index: 3; }
.all ul li a font { visibility: hidden; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s;}
.all ul li a:hover { color: #1d7bd3; }
.all ul li a:hover font { visibility: visible; padding-left: 5px; }
.all ul li:before { content: ''; display: block; position: absolute; box-sizing: border-box; border: 1px solid transparent; width: 0; height: 0; z-index: 0; bottom: -1px; right: 1px; -webkit-transition: border-color 0s ease-in 0.4s, width 0.2s ease-in 0.2s, height 0.2s ease-in; transition: border-color 0s ease-in 0.4s, width 0.2s ease-in 0.2s, height 0.2s ease-in; }
.all ul li:after { content: ''; display: block; position: absolute; box-sizing: border-box; border: 1px solid transparent; width: 0; height: 0; z-index: 0; top: 0; left: 0; -webkit-transition: border-color 0s ease-in 0.8s, width 0.2s ease-in 0.6s, height 0.2s ease-in 0.4s; transition: border-color 0s ease-in 0.8s, width 0.2s ease-in 0.6s, height 0.2s ease-in 0.4s; }
.all ul li:hover:before { width: 100%; height: 100%; border-bottom-color: #1d7bd3; border-left-color: #1d7bd3; -webkit-transition: border-color 0s ease-out 0.4s, width 0.2s ease-out 0.4s, height 0.2s ease-out 0.6s; transition: border-color 0s ease-out 0.4s, width 0.2s ease-out 0.4s, height 0.2s ease-out 0.6s; }
.all ul li:hover:after { width: 100%; height: 100%; border-top-color: #1d7bd3; border-right-color: #1d7bd3; -webkit-transition: width 0.2s ease-out, height 0.2s ease-out 0.2s; transition: width 0.2s ease-out, height 0.2s ease-out 0.2s; }
.all ul li:hover { box-shadow: 0 0 14px 5px #c7c7c7; }
.all ul li i { position: absolute; right: 10px; bottom: 0; -webkit-transition: all .4s; -moz-transition: all .4s; transition: all .4s;}
.all ul li:hover i { right: 20px; bottom: 10px; }
/**/
.g-section-efficiency {	clear:both;height:450px;background-color:#4091ff;background-color: #4091ff \9;background-image: url(../../img/value-bg.png),linear-gradient(#3170ff,#4c8bff);background-size: contain;background-repeat: no-repeat;background-position: bottom;}
.m-section-efficiency {padding: 90px 0;}
.m-section-efficiency .m-section__head { text-align: center;}
.u-title.center {text-align: center;}
.u-title.white {color: #fff;}
.u-title.big {font-size: 34px;}
.u-title {font-size: 14px;line-height: 1.5;}
.m-section-efficiency .m-section__body {padding-top: 50px;width:980px;margin:0 auto;}
.m-section-efficiency .m-section__item { position: relative;float: left;width: 25%;text-align: center;}
.m-section-efficiency .m-section__item .img {height: 78px;text-align: center;}
.m-section-efficiency .m-section__item .img img {height: 100%;margin: 0 auto;}
.u-img.u-img--horizontal {display: block;max-width: 100%;height: auto;}
.m-section-efficiency .m-section__item .text {font-size: 20px;line-height: 1.5;color: #fff;letter-spacing: 1.2px;margin-top: 25px;text-align: center;}
 @media screen and (max-width:1180px) {.index{width:980px;}
}
/*@media screen and (max-width:770px) {.index{width:100%;}.hot-list li {width: 50%;margin:20px 0;}.hot-list li p {height:60px;overflow:hidden;font-size:12px;line-height:20px;padding:0 12px;}.index-bg{display:none;}.yewubox{margin:0 5px 0 0;}.hot-list li span {padding: 18px 0 15px; }.popular{font-size: 20px; }.dib{display:none;}.yw-box{margin-top:30px;}
}*/