/*  column nav */
.column-title{
    text-align: center;
    margin: 40px 0 20px;
}
.column-title strong{
    font-size: 28px;
    padding:0 40px 10px 40px;
    border-bottom: 1px solid #ccc;
    position: relative;
}
.column-title strong::after{
    content: "";
    border-radius: 105px;
    border: 2px solid #ccc;
    width: 1rem;
    height: 1rem;
    position: absolute;
    bottom: -0.5rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    background: #fff;
}
.column-title span{
    display: block;
    font-size: 16px;
    margin-top: 20px;
    color: #ccc;
    margin-top: 15px;
}
/*  column nav  end*/

/*    infoSpace   */
.infoSpace{
    min-width: 1440px;
    position: relative;
}
.infoSpace a{
    position: absolute;
    z-index: 20;
}
.infoSpace a>div{
    background: rgba(0, 0, 0, 0.66);
    position: absolute;
    text-align: center;
    color: white;
    height: 80px;
    width: 280px;
    left: 100%;
    bottom: 0;
    margin-left: -30px;
/*    border-radius: 10px;*/
    padding: 5px 5px;
    display: none;
}
.infoSpace a>div span{
    text-shadow: 0 0 10px #00aeff,
        0 0 10px #00aeff,
        0 0 10px #00aeff; 
    font-size: 20px;
    font-weight: bold;
    display: block;
    margin: 2px 0 4px;
}
.infoSpace a>div img{
    float: left;
    width: 100px;
    height: 100%;
}
.infoSpace .pro-Kyess{
    width: 9.5%;
    height: 28%;
    left: 24.5%;
    top: 59.5%;  
}
.infoSpace .pro-Rungame{
    width: 7.5%;
    height: 20.2%;
    left: 34%;
    top: 61%;   
}
.infoSpace .pro-Malu-tale{
    width: 11.5%;
    height: 21.2%;
    left: 39.5%;
    top: 55%;
}
.infoSpace .pro-jixianlvxing{
    width: 6%;
    height: 21%;
    left: 54.8%;
    top: 45%;
}
.infoSpace .pro-ziyoujizhan{
    width: 6.5%;
    height: 18%;
    left: 62.2%;
    top: 43%;
}
.infoSpace .pro-ydsk-min{
    width: 8%;
    height: 23%;
    left: 68%;
    top: 35%;
}
.infoSpace .pro-9DVR-2{
    width: 10%;
    height: 22%;
    left: 17.8%;
    top: 50%;
}
.infoSpace .pro-9DVR-1{
    width: 5.5%;
    height: 19%;
    left: 29%;
    top: 46%;
}
.infoSpace .pro-jxlx-one{
    width: 6%;
    height: 22%;
    left: 36.3%;
    top: 38.5%;
}
.infoSpace .pro-Snow-hero{
    width: 10%;
    height: 25%;
    left: 45.5%;
    top: 30%;
}
.infoSpace .pro-Magic-Bike{
    width: 8%;
    height: 16.8%;
    left: 52.4%;
    top: 35%;
}
.infoSpace .pro-run-machine{
    width: 8%;
    height: 22%;
    left: 57.8%;
    top: 25%;
}
.infoSpace .pro-hysk{
    width: 13.5%;
    height: 29%;
    left: 13.8%;
    top: 33%;
}
.infoSpace .pro-jzqs{
    width: 8%;
    height: 23%;
    left: 27%;
    top: 29%;
}
.infoSpace .pro-9DVR-3{
    width: 9%;
    height: 20%;
    left: 34%;
    top: 28%;
}
.infoSpace .pro-Family{
    width: 13.5%;
    height: 24%;
    left: 43%;
    top: 20%;
}
.infoSpace .pro-7D-movie{
    width: 21.5%;
    height: 34%;
    left: 52%;
    top: 4%;
}
.infoSpace .pro-Kyess:hover{
    background: url(../images/pro-kyess.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-Rungame:hover{
    background: url(../images/pro-rungame.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-Malu-tale:hover{
    background: url(../images/pro-malu-tale.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-jixianlvxing:hover{
    background: url(../images/pro-jixianlvxing.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-ziyoujizhan:hover{
    background: url(../images/pro-ziyoujizhan.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-ydsk-min:hover{
    background: url(../images/pro-ydsk-min.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-9DVR-2:hover{
    background: url(../images/pro-9dvr-2.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-9DVR-1:hover{
    background: url(../images/pro-9dvr-1.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-jxlx-one:hover{
    background: url(../images/pro-jxlx-one.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-Snow-hero:hover{
    background: url(../images/pro-snow-hero.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-Magic-Bike:hover{
    background: url(../images/pro-magic-bike.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-run-machine:hover{
    background: url(../images/pro-run-machine.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-hysk:hover{
    background: url(../images/pro-hysk.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-jzqs:hover{
    background: url(../images/pro-jzqs.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-9DVR-3:hover{
    background: url(../images/pro-9dvr-3.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-Family:hover{
    background: url(../images/pro-family.png) no-repeat center;
    background-size: contain;
}
.infoSpace .pro-7D-movie:hover{
    background: url(../images/pro-7d-movie.png) no-repeat center;
    background-size: contain;
}
/*    infoSpace end  */

/*    clinent case */
.mKeBanner,.mKeBanner div{text-align:center;}
.imageflow img{ -webkit-box-shadow: 2px 2px 2px 2px hsla(0,0%,0%,0.1); box-shadow: 2px 2px 2px 2px hsla(0,0%,0%,0.1); }
.imageflow{overflow:hidden; position:relative; text-align:left; visibility:hidden; width:1200px; margin:0 auto;margin-bottom: 5px;}
.imageflow img{border:none; position:absolute; top:0px; visibility:hidden; -ms-interpolation-mode:bicubic;display: inline-block}
.imageflow p{margin:0 auto; text-align:center}
.imageflow .loading{border:1px solid #ccc; height:15px; left:50%; margin-left:-106px; padding:5px; position:relative; visibility:visible; width:200px}
.imageflow .loading_bar{background:#ccc; height:15px; visibility:visible; width:1%}
.imageflow .caption{font-weight:bold; position:relative; text-align:center; z-index:10000}
.imageflow .scrollbar{border-bottom:1px solid #b3b3b3; position:relative; visibility:hidden; z-index:10001; height:1px}
.imageflow .slider{background-image:url(../images/slider.png); background-repeat:no-repeat; height:14px; margin:-6px 0 0 -7px; position:absolute; width:14px; z-index:10002}
.imageflow .images{overflow:hidden; white-space:nowrap}
.imageflow .button{cursor:pointer; height:17px; position:relative; width:17px}
.imageflow .previous{background:url(../images/button_left.png) top left no-repeat; float:left; margin:-7px 0 0 -30px}
.imageflow .next{background:url(../images/button_right.png) top left no-repeat; float:right; margin:-7px -30px 0 30px}

.address {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 10;
    background: rgba(0, 0, 0, 0.59);
    color: white;
    width: 700px;
    margin: 0 auto;
    padding: 10px 0;
    font-size: 1.6rem;
}
#carousel {
        width:1200px;
        height:400px;
        position:relative;
        clear:both;
        overflow:hidden;
        background:#FFF;
          margin: 0 auto;
      }
#carousel img {
        visibility:hidden; /* hide images until carousel can handle them */
        cursor:pointer; /* otherwise it's not as obvious items can be clicked */
        height: 100%;
	width: 700px;
      }
/*    clinent case end */


/*    hot-product 3~  */
.hot-product {
    overflow: hidden;
    margin: 20px 0;
}
.hot-product li{
    float: left;
    width: 32%;
    margin-top: 1%;
    margin-bottom: 1%;
        overflow: hidden
}
.hot-product li:nth-last-of-type(3n+1){
    float: right;
}
.hot-product li:nth-last-of-type(3n-1){
    margin-left:  2%;
    margin-right: 2%;
}
.hot-product li img{
    width: 100%;
}
.hot-product li a{
    display: block;
    position: relative;
    overflow: hidden;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
.hot-product li a:hover h3{
    color: #eb6100;
    text-decoration: underline;
}
.hot-product li a h3{
    position: absolute;
    bottom: 5px;
    color: #fff;
    width: 100%;
    text-align: center;
}
.hot-product li a h3 span{
    font-weight: normal;
}
    
}
/*    hot-product end 3~ */

/*    partner  */

/*   our-partner icon  */
.our-partner{
    margin: 0 auto;
    background: #333;
}
.our-partner li{
    width: 14.2%;
/*    background: #ddd;*/
    float: left;
    margin-right: 0.1%;
    text-align: center;
    margin-bottom: 30px;
}
.our-partner li:last-child , .our-partner .last-li{
    margin-right: 0;
}
.our-partner li a{
    display: block;
    position: relative;
}
.our-partner li img{
    max-width: 120px;
}
.our-partner li img.pic1{
    -webkit-transform: rotateX(0deg) rotateY(0deg);
    -webkit-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    -moz-transform: rotateX(0deg) rotateY(0deg);
    -moz-transform-style: preserve-3d;
    -moz-backface-visibility: hidden;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    transform: rotateX(0deg) rotateY(0deg);
    transform-style: preserve-3d;
    backface-visibility: hidden;
    transition: all .5s ease-in-out;
}

.our-partner li img.pic2{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    -webkit-transform: rotateY(-180deg);
    -webkit-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    -moz-transform: rotateY(-180deg);
    -moz-transform-style: preserve-3d;
    -moz-backface-visibility: hidden;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    transform: rotateY(180deg);
    transform-style: preserve-3d;
    backface-visibility: hidden;
    transition: all .5s ease-in-out;
}
.our-partner li a:hover img.pic1{
    -webkit-transform:rotateY(180deg);
    -moz-transform:rotateY(180deg);
    transform:rotateY(180deg);
}
.our-partner li a:hover img.pic2{
    -webkit-transform:rotateX(0deg) rotateY(0deg);
    -moz-transform:rotateX(0deg) rotate(0deg);
    transform:rotateX(0deg) rotate(0deg);
    z-index: 10;
}

/*   our-partner icon  end */
/*    partner end */

/*   news-online   */
.news-online li{
    width: 23%;
    height: 400px;
    float: left;
    margin-right: 2.66%;
}
.news-online li:last-child{
    margin-right: 0;
    margin-bottom: 40px;
}
.news-online li>a{
    display: block;
    color: #666;
    height: 100%;
    position: relative;
    text-decoration: none;
}

.news-online li>a:hover{
    background: #f1f1f1;
}
.news-online li>a:hover div{
    text-decoration: underline;
}
.news-online li span{
    color: #9e9e9e;
    display: block;
    padding-top: 20px;
}
.news-online li h3{
    margin: 8px 0 20px;
    
}
.news-online li p{
    line-height: 26px;
    height: 73px;
    word-break:break-all;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
/*
.news-online li p::after{
    content:"...";
    font-weight:bold;
    position:absolute;
    bottom:0;
    right:0;
}
*/
.news-online li img{
    width: 100%;
height:170px;
}
.news-online li div{
    color: #ed6e03;
    position: absolute;
    bottom: 10px;
}

/*   news-online end  */