.wrap{max-width:1700px;width: 95%; margin:0 auto;} .wrap1200{max-width:1200px;width: 95%; margin:0 auto;} .max-wrap{max-width: 1700px; margin: 0 auto;} .fl{float: left;} .fr{float: right;} .text-left{text-align: left;} .text-right{text-align: right;} .text-center{text-align: center;} .text-over{text-overflow: ellipsis; overflow: hidden; white-space: nowrap;} .over{overflow: hidden;} .nowrap{white-space: nowrap;} .nowrap *{white-space: normal;} .fz0{font-size: 0px;} .relative{position: relative;z-index: 1;} .absolute{position: absolute;z-index: 1;} .fixed{position: fixed;z-index: 1;} .inline{display: inline;} .block{display: block;} .inline-block{display: inline-block;} .table{width: 100%;height: 100%;display: table;} .table-cell{display: table-cell;} .hide{display: none;} .max-w100{max-width: 100%;} .max-h100{max-height: 100%;} .middle{vertical-align: middle;} .middle-span{height: 100%;vertical-align: middle;display: inline-block;} .border-box{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing: border-box;} .content-box{-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing: content-box;} .trans{-webkit-transition:all 300ms ease 0s; -moz-transition:all 300ms ease 0s; -ms-transition:all 300ms ease 0s; -o-transition:all 300ms ease 0s; transition:all 300ms ease 0s;} .trans-1s{-webkit-transition:all 1s ease 0s; -moz-transition:all 1s ease 0s; -ms-transition:all 1s ease 0s; -o-transition:all 1s ease 0s; transition:all 1s ease 0s;} .scale:hover .scale-img{-ms-transform:scale(1.1, 1.1);-moz-transform:scale(1.1, 1.1);-webkit-transform:scale(1.1, 1.1);-o-transform:scale(1.1, 1.1);transform:scale(1.1, 1.1);} .grayscale .grayscale-img{-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%); -o-filter: grayscale(100%);filter: grayscale(100%);filter: gray;} .grayscale:hover .grayscale-img{-webkit-filter: grayscale(0%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);filter: none;} .fz0.nowrap{letter-spacing: -5px;} .fz0.nowrap *{letter-spacing: normal;} .red{color: #f50;} .bgf3{background-color: #f3f3f3;} .show1300{display: none;} .show992{display: none;} .show768{display: none;} .show480{display: none;} .show320{display: none;} .ddlogoshow{display: block;} .ddlogonone{display: none;} #price br{display:none;} #dd-header-blank{height:60px; display:none;} .wow{visibility: hidden;} @font-face{font-family: 'PingFang'; src: url(../font/PingFangLight.ttf);} @font-face{font-family: 'AvantGarde'; src: url(http://www.vishining.com/fonts/AvantGardeBook.otf);} @font-face{font-family: 'Din'; src: url(http://www.vishining.com/fonts/DINCOND-MEDIUM.OTF);} #global_qq_service{ width:90px; padding:10px; position:fixed; right:35px; top:190px; z-index:999; background:#fff; border:1px solid #ff1903; -moz-border-radius:6px; -ms-border-radius:6px; -o-border-radius:6px; -webkit-border-radius:6px; border-radius:6px;} #global_qq_service .service_title{ font-size:16px; font-weight:bold; color:#ff1903; text-align:center;} #global_qq_service .qq_item .qq_img{ width:60px; height:60px; margin:0 auto; cursor:pointer;} #global_qq_service .qq_item .qq_img img{ border-radius:50%;} #global_qq_service .qq_item .qq_name{ font-size:14px; color:#888787; height:25px; line-height:25px; overflow:hidden; text-align:center; cursor:pointer;} #global_qq_service a{ text-decoration:none; margin-top:10px; display:block;} html,body{overflow-x: hidden;} #body{position: relative;left: 0;top: 0;bottom: 0;right: 0;/*display: none;*/} /*#body.on{z-index: 10;}*/ header{width: 100%;height: 100px;padding-top: 25px;padding-bottom: 25px;position: fixed;z-index: 999 !important;left: 0;top: 0;} header #logo{/*height: 68px;*/max-width: 100%;top: -15px;} header #nice{margin-left:10px; border-left:#CCC 1px solid; padding-left:10px; width:95px; margin-top:5px;} header #nice .f{font-size:14px; line-height:20px;} /*header #logo > a{z-index: 2;}*/ header #logo .logo-on{left: 0;top: 0;} header nav{line-height: 50px;left: 50%;top: 0;margin-left: -350px;} header nav .bd{max-height: 100%;} header nav .nav-item{/*width: 100px;*/ margin:0px 23px;} header nav .nav-item > a{font-size: 16px;color: #fff;} header nav .ddC{width:100px; height:30px; background:#ff1903; line-height:30px; border-radius:3px; margin-left:50px; margin-top:10px;} header nav .ddC a{font-size:14px; color:#FFFFFF; display:block;} header .header-user{margin-top: 3px;} header .header-user .login{width: 86px;height: 44px;line-height: 44px;font-size: 16px;color: #333;border: 1px solid #e3e3e3;border-radius: 5px;} header .header-user .login i{width: 18px;height: 18px;background: url(../image/ico-user-0.png) no-repeat;margin-right: 10px;top: -2px;position: relative;z-index: 1;display: inline-block;vertical-align: middle;} header .header-user .login i::after{width: 100%;height: 100%;background: url(../image/ico-user-1.png) no-repeat;position: absolute;z-index: 1;left: 0;top: 0;opacity: 0;content: '';-webkit-transition:all 300ms ease 0s; -moz-transition:all 300ms ease 0s; -ms-transition:all 300ms ease 0s; -o-transition:all 300ms ease 0s; transition:all 300ms ease 0s;} header .header-user .login:hover{color: #fff;background-color: #ff1903;border-color: #ff1903;} header .header-user .login:hover i::after{opacity: 1;} header .header-user .try{width: 130px;height: 44px;line-height: 44px;font-size: 16px;border: 1px solid #e3e3e3;border-radius: 5px;margin-left: 5px;} header .header-user .try:hover{color: #fff;background-color: #ff1903;border-color: #ff1903;} header .header-user .member{width: 140px;height: 44px;line-height: 44px;font-size: 16px;color: #333;border: 1px solid #e3e3e3;border-radius: 5px;} header .header-user .member i{width: 18px;height: 18px;background: url(../image/ico-user-0.png) no-repeat;margin-right: 10px;top: -2px;position: relative;z-index: 1;display: inline-block;vertical-align: middle;} header .header-user .member i::after{width: 100%;height: 100%;background: url(../image/ico-user-1.png) no-repeat;position: absolute;z-index: 1;left: 0;top: 0;opacity: 0;content: '';-webkit-transition:all 300ms ease 0s; -moz-transition:all 300ms ease 0s; -ms-transition:all 300ms ease 0s; -o-transition:all 300ms ease 0s; transition:all 300ms ease 0s;} header .header-user .member:hover{color: #fff;background-color: #ff1903;border-color: #ff1903;} header .header-user .member:hover i::after{opacity: 1;} header .preview-button{width: 320px;line-height: 50px;left: 50%;top: 0;margin-left: -160px;} header .preview-button > a{margin: 0 12px;} header .preview-button .fa{font-size: 32px;color: #fff;} header .preview-button .on{-ms-transform:scale(1.2, 1.2);-moz-transform:scale(1.2, 1.2);-webkit-transform:scale(1.2, 1.2);-o-transform:scale(1.2, 1.2);transform:scale(1.2, 1.2);} header .menu-button{line-height: 50px;font-size: 32px;/*color: #fff;*/} header .menu-button a{color: inherit;} header .menu-button a:hover{color: #ff1903;} header.opaque{background-color: #fff;box-shadow: 0 1px 5px rgba(0,0,0,.3);} header.black{height: 85px;background-color: #222;padding-top: 17px;} /*header.black #logo > a{opacity: 0;}*/ header.black .header-user .login{color: #fff;border-color: #fff;} header.black .header-user .login i::after{opacity: 1;} header.black .header-user .login:hover{border-color: #ff1903;} header.black .header-user .try{color: #fff;border-color: #fff;} header.black .header-user .try:hover{border-color: #ff1903;} header.black + #header-blank{height: 85px;} header.black .menu-button{color: #333;} header.on{height: 60px;padding-top: 15px;padding-bottom: 15px;background-color: #fff;box-shadow: 0 1px 5px rgba(0,0,0,.3);} header.on #logo{height: 50px; top:-10px;} header.on nav{line-height: 30px;} header.on .menu-button{line-height: 30px;color: #333;} header.on .header-user{margin-top: 0;} header.on .header-user .login , header.on .header-user .try{height: 32px;line-height: 32px;} header.on .header-user .member{height: 32px;line-height: 32px;} header.on #nice h1{line-height:14px;} header.on nav .ddC{margin-top:0px;} header.on #nice{margin-top:0px;} header.black h1{color:#FFFFFF;} header.black .ddlogoshow{display:none !important;} header.black .ddlogonone{display:block !important;} #header-blank{height: 100px;} header.on nav .nav-item a , .d555{color:#555 !important;} header nav .nav-item a.on{color: #ff1903 !important;} header nav .nav-item > a:hover{color: #ff1903 !important;} #banner{z-index: 2;} #banner .bd{width: 100%;} #banner .bar{left: 0;} #banner .item{width: 100%;} #banner .item > a{width: 100%;height: 100%;left: 0;top: 0;} #banner .item-0 .font{width: 100%;left: 0;top: 5%;opacity: .4;} #banner .item-0 .font span{font-family: 'PingFang';font-size: 60px;color: #ff1903;background-image: -webkit-gradient(linear, 0 0, right 0, from(#ff1903), to(#19fff7));-webkit-background-clip: text;-webkit-text-fill-color: transparent;padding-left: 15px;letter-spacing: 15px;} #banner .item-0 .img{box-shadow: 40px 40px 30px rgba(0,0,0,.2);} #banner .item-0 .img-0{width: 42.135416666%;left: 28.9583333%;bottom: 10%;opacity: .4;} #banner .item-0 .img-1{width: 16.40625%;left: 10%;bottom: 0;opacity: .4;} #banner .item-0 .img-2{width: 16.40625%;right: 10%;bottom: 0;opacity: .4;} #banner .item-0.on .font{top: 11.25%;opacity: 1;} #banner .item-0.on .img-0{bottom: 0;opacity: 1;} #banner .item-0.on .img-1{left: 0;opacity: 1;} #banner .item-0.on .img-2{right: 0;opacity: 1;} #banner .item .banner-button{width: 178px;height: 47px;background: url(http://www.vishining.com/images/images/banner-btn.png) no-repeat;} #banner .item:nth-child(1) .banner-button{left: 50%;top: 26.5%;margin-left: -89px;margin-top: -5%;} #banner .item:nth-child(2) .banner-button{left: 10.9375%;top: 71.25%;} #banner .item:nth-child(3) .banner-button{left: 50%;top: 61.875%;margin-left: -89px;} #banner .item:nth-child(1).on .banner-button{margin-top: 0;} #banner.slide .bar{-webkit-transition: all 1s ease 0s;-moz-transition: all 1s ease 0s;-o-transition: all 1s ease 0s;transition: all 1s ease 0s;} #banner.fold .item{zoom: 1;opacity: 0;} #banner.fold .item.on{opacity: 1;} #small-banner{z-index: 2;} #small-banner .bd{width: 100%;} #small-banner .bar{left: 0;} #small-banner .item{width: 100%;} #small-banner .item > a{width: 100%;height: 100%;left: 0;top: 0;} #small-banner.slide .bar{-webkit-transition: all 300ms ease 0s;-moz-transition: all 300ms ease 0s;-o-transition: all 300ms ease 0s;transition: all 300ms ease 0s;} #small-banner.fold .item{zoom: 1;opacity: 0;} #small-banner.fold .item.on{opacity: 1;} .index-title{font-size: 28px;color: #222;} .index-title h2{font-size: 28px;color: #222;} .index-brief{font-size: 14px;color: #aaa;margin-top: 10px;} .index-brief font{color:#000000;} #products > .category-list{margin: 30px auto 36px;} #products > .category-list .item{width: 144px;height: 47px;line-height: 47px;font-size: 14px;color: #555;background-color: #f1f1f1;border-radius: 2px;margin: 3px 0.5%;} #products > .category-list .item:hover , #products > .category-list .item.on{color: #fff;background-color: #ff1903;} #products > .category-list .item i{font-size: 20px;margin-right: 20%;vertical-align: middle;} #products .products-bg{background-color: #f8f8f8;background-image: url(../image/shadow.png);background-repeat: repeat-x;background-position: left top;padding: 70px 0 55px;} #products.index .products-bg{padding: 0 0 55px;} #products.index #products-box{padding-top: 70px;left: 0;} #products-box .products-list .item{width: 30.588%;margin-right: 3.823529%;margin-bottom: 60px;vertical-align: top;} #products-box .products-list .item.last{margin-right: 0;} #products-box .products-list .item[status='on']{z-index: 2;} #products-box .products-list .item[status='on'] .main{-webkit-animation-name:zoomIn;animation-name:zoomIn} #products-box .products-list .item[status='off']{opacity: 0;} #products-box .products-list .item[status='off'] .main{-webkit-animation-name:zoomOut;animation-name:zoomOut} #products-box .products-list .item .main{max-width: 520px;margin: 0 auto;} #products-box .products-list .item .cover{z-index: 2;} #products-box .products-list .item .cover .img{width: 100%;left: 0;top: 4%;} #products-box .products-list .item .cover .img .img-wrap{width:100%; height:236px;} #products-box .products-list .item .cover .img img{width: 76.923%;} #products-box .products-list .item .cover .opt{width: 100%;/*max-height: 0;*/left: 0;/*bottom: -moz-calc(20% + 100px);bottom: -webkit-calc(20% + 100px);bottom: calc(20% + 100px);*/bottom: 20%;opacity: 0;} #products-box .products-list .item .cover .opt .button-bg{width: 76.923%;background-color: #fff;padding: 10px 40px 10px 25px;margin: 0 auto;/*box-shadow: 0 20px 40px rgba(0,0,0,.4)*/} #products-box .products-list .item .cover .opt .button{width: 78px;height: 78px;line-height: 76px;font-size: 16px;color: #ff1903;border: 1px solid #ff1903;border-radius: 100%;margin-right: 6%;} #products-box .products-list .item .cover .opt .button:hover{color: #fff;background-color: #ff1903;} #products-box .products-list .item .cover .opt .links{font-size: 14px;color: #333;margin-top: 12px;} #products-box .products-list .item .cover .opt .links i{width: 31px;height: 31px;background: url(http://www.vishining.com/images/images/ico-link-0.png) no-repeat center center;margin-bottom: 8px;position: relative;z-index: 1;display: block;} #products-box .products-list .item .cover .opt .links i::after{width: 100%;height: 100%;background: url(/images/images/ico-link-1.png) no-repeat center center;position: absolute;z-index: 1;left: 0;top: 0;opacity: 0;-webkit-transition:all 300ms ease 0s; -moz-transition:all 300ms ease 0s; -ms-transition:all 300ms ease 0s; -o-transition:all 300ms ease 0s; transition:all 300ms ease 0s;content: '';} #products-box .products-list .item .cover .opt .links:hover{color: #ff1903;} #products-box .products-list .item .cover .opt .links:hover i::after{opacity: 1;} #products-box .products-list .item .cover .url{width: 100%;height: 100%;left: 0;top: 0;z-index: 3;} #products-box .products-list .item .cover:hover .opt{/*max-height: 100px;bottom: 20%;*/opacity: 1;} #products-box .products-list .item .info{width: 76.923%;margin: 0 auto;} #products-box .products-list .item .info .left{width: 50%;line-height: 24px;} #products-box .products-list .item .info .name{font-size: 16px;color: #222;} #products-box .products-list .item .info .category{font-size: 14px;color: #aaa;} #products-box .products-list .item .info .price{width: 50%;line-height: 48px;font-weight: bold;font-size: 18px;color: #222;} #products-box .products-list .item .info .price font{font-size: inherit;} #products-box .products-list .item .mask{opacity: 0;z-index: 2;position: absolute;} #products-box .products-list .item .opt-msg{width: 80%;max-height: 0;background-color: #fff;margin-top: -90px;position: absolute;left: 10%;top: 50%;} #products-box .products-list .item .opt-msg a{height: 60px;line-height: 60px;font-size: 20px;color: #333;border-bottom: 1px solid #ddd;display: none;} #products-box .products-list .item .opt-msg a:hover{color: #ff1903;} #products-box .products-list .item-ext{width:50%; max-width:516px; margin:0 25px 60px;} #products-box .products-list .item-ext[status=on] .main{-webkit-animation-name:fadeIn;animation-name:fadeIn} #products-box .products-list .item-ext[status=off] .main{-webkit-animation-name:fadeOut;animation-name:fadeOut} #products-box .products-list .item-ext .preview{width:calc(100% - 124px); width:-webkit-calc(100% - 124px); width:-moz-calc(100% - 124px); padding-top:23px; background:url(../image/template_browser.jpg) no-repeat center top;} #products-box .products-list .item-ext .preview .screen{width:100%; height:243px; border:1px solid #e5e5e5; background:#fff;} #products-box .products-list .item-ext .preview .screen a{width:100%;} #products-box .products-list .item-ext .control{width:124px; margin-top:4px;} #products-box .products-list .item-ext .control .icon-btn{width:100%; height:262px; padding-top:15px; background:#fff;} #products-box .products-list .item-ext .control .icon-btn .price{margin:0 auto 25px; color:#ff1903; font-size:22px;} #products-box .products-list .item-ext .control .icon-btn .price i{color:#666; font-size:12px; font-style:normal;} #products-box .products-list .item-ext .control .icon-btn a{width:90px; height:32px; margin-bottom:25px; line-height:32px; color:#666; border:1px solid #ddd; border-radius:16px;} #products-box .products-list .item-ext .control .icon-btn a:hover{color:#fff; background:#ff1903; border-color:#ff1903;} #products-box .box-button .button{width: 50px;height: 50px;line-height: 50px;background-color: #fff;border-radius: 3px;margin: 0 5px;} #products-box .box-button .button i{font-size: 16px;color: #ff1903;} #products-box .box-button .button:hover{background-color: #ff1903;} #products-box .box-button .button:hover i{color: #fff;} #products-box .box-button .more-list{width: 92px;height: 50px;line-height: 50px;background-color: #ff1903;/*background-color: #fff;*/border-radius: 3px;margin: 0 5px;} #products-box .box-button .more-list i{width: 10px;height: 10px;background: url(/images/images/list-more-0.png) no-repeat center center;display: inline-block;} #products-box .box-button .more-list i::after{width: 100%;height: 100%;background: url(../image/list-more-1.png) no-repeat center center;position: absolute;z-index: 1;left: 0;top: 0;opacity: 1;-webkit-transition: all 300ms ease 0s;-moz-transition: all 300ms ease 0s;-o-transition: all 300ms ease 0s;transition: all 300ms ease 0s;content: '';} /*#products-box .box-button .more-list:hover{background-color: #ff1903;}*/ /*#products-box .box-button .more-list:hover i::after{opacity: 1;}*/ .index-cooperation .cooperation-box{margin-bottom: 50px;} .index-cooperation .cooperation-box .bd{padding: 10px 0;} /*.index-cooperation .cooperation-box .item{width: 1700px;}*/ .index-cooperation .cooperation-box .item .boxbox{width: 20%;height: 180px;/*border-width: 1px 1px 1px 0;*/ border:1px; border-style: solid;border-color: #ededed;} .index-cooperation .cooperation-box .item:first-child{border-left-width: 1px;} .index-cooperation .cooperation-box .item a{width: 100%;height: 100%;background-color: #fff;padding: 20px;} .index-cooperation .cooperation-box .item .boxbox:hover{box-shadow: 0 0 12px rgba(0,0,0,.1);border: 1px solid #ededed;-ms-transform:scale(1.05, 1.05);-moz-transform:scale(1.05, 1.05);-webkit-transform:scale(1.05, 1.05);-o-transform:scale(1.05, 1.05);transform:scale(1.05, 1.05);} .index-cooperation .cooperation-box .hd{margin-top: 35px;} .index-cooperation .cooperation-box .hd a{width: 12px;height: 12px;border: 1px solid #b7c5ce;border-radius: 100%;margin: 0 5px;display: inline-block;cursor: pointer;-webkit-transition: all 300ms ease 0s;-moz-transition: all 300ms ease 0s;-o-transition: all 300ms ease 0s;transition: all 300ms ease 0s;} .index-cooperation .cooperation-box .hd .on{background-color: #ff1903;border-color: #ff1903;} .index-cooperation .evaluation-list .bar{left: 0;} .index-cooperation .evaluation-list .hd{margin-top: 35px;} .index-cooperation .evaluation-list .hd a{width: 12px;height: 12px;border: 1px solid #b7c5ce;border-radius: 100%;margin: 0 5px;display: inline-block;cursor: pointer;-webkit-transition: all 300ms ease 0s;-moz-transition: all 300ms ease 0s;-o-transition: all 300ms ease 0s;transition: all 300ms ease 0s;} .index-cooperation .evaluation-list .hd .on{background-color: #ff1903;border-color: #ff1903;} .index-cooperation .evaluation-list .item{width: 30%;margin-left: 5%;} .index-cooperation .evaluation-list .item:first-child{margin-left: 0;} .index-cooperation .evaluation-list .item .img{width: 88px;height: 88px;padding: 5px;border: 1px solid #b9c7cf;border-radius: 100%;} .index-cooperation .evaluation-list .item .info{padding-left: 5%;} .index-cooperation .evaluation-list .item .info .name{font-size: 24px;color: #222;} .index-cooperation .evaluation-list .item .info .date{color: #888;} .index-cooperation .evaluation-list .item .arrow{width: 88px;margin-top: 10px;} .index-cooperation .evaluation-list .item .arrow::after{width: 0;height: 0;border-bottom: 15px solid #ff1903;border-left: 12px solid transparent;border-right: 12px solid transparent;margin: 0 auto;display: block;content: '';} .index-cooperation .evaluation-list .item .brief{width: 100%;line-height: 32px;font-size: 14px;color: #fff;background-color: #ff1903;padding: 25px 45px 25px 40px;} .index-tutorial .tutorial-support{width: 50%;height: 100%;background-color: #323436;right: 0;top: 0;} .index-tutorial .tutorial-support .support-search{margin-left: 5%;} .index-tutorial .tutorial-support .support-search .text{width: 350px;height: 60px;line-height: 60px;font-size: 14px;background: #fff url(../image/ico-search.png) no-repeat 15px center;padding: 0 10px 0 55px;border: 0;border-radius: 5px;} .index-tutorial .tutorial-support .ico{font-size: 16px;color: #fff;} .index-tutorial .tutorial-support .button{width: 35%;} .index-tutorial .tutorial-support .play{line-height: 34px;background: url(../image/ico-file.png) no-repeat left center;padding-left: 40px; cursor:pointer;} .index-tutorial .tutorial-support .file{line-height: 30px;background: url(../image/ico-file.png) no-repeat left center;padding-left: 40px; cursor:pointer;} .index-tutorial .tutorial-support .line{width: 1px;height: 60px;background-color: #383939;margin: 0 7%;} .index-tutorial .tutorial-list .item{width: 44.70588%;padding: 45px 0;border-top: 1px solid #e5e5e5;} .index-tutorial .tutorial-list .item:nth-child(1) , .index-tutorial .tutorial-list .item:nth-child(2){border-top: 0;} .index-tutorial .tutorial-list .item .date{width: 20%;max-width: 120px;} .index-tutorial .tutorial-list .item .date .year{font-size: 16px;color: #666;margin: 6px 0 15px;} .index-tutorial .tutorial-list .item .date .day{font-size: 34px;color: #222;} .index-tutorial .tutorial-list .item .info{width: 80%;} .index-tutorial .tutorial-list .item .info .name{font-size: 20px;color: #222;} .index-tutorial .tutorial-list .item .info .name a{font-size: inherit;color: inherit;} .index-tutorial .tutorial-list .item .info .name a:hover{color: #ff1903;} .index-tutorial .tutorial-list .item .info .brief{height: 72px;line-height: 24px;font-size: 14px;color: #888;margin-top: 20px;} .try-button-box .button{width: 22%;min-width: 155px;height: 66px;line-height: 66px;font-size: 22px;color: #97abb8;background-color: #fff;border: 1px solid #b6c4cd;border-radius: 5px;box-shadow: 0 0 12px rgba(182,196,205,.4);margin: 0 1.5%;} .try-button-box .button:hover{color: #fff;background-color: #ff1903;border-color: #ff1903;box-shadow: 0 0 6px #ff1903;} .about-title{margin-bottom: 40px;} .about-title .title-0{font-family: Arial;font-size: 10px;color: #333;padding-left: 3px;letter-spacing: 3px;} .about-title .title-1 span{font-size: 40px;color: #333333;position: relative;z-index: 1;} .about-title .title-1 span::before , .about-title .title-1 span::after{width: 100px;height: 1px;background-color: #e1e1e1;top: 15px;position: absolute;z-index: 1;content: '';} .about-title .title-1 span::before{right: -moz-calc(100% + 30px);right: -webkit-calc(100% + 30px);left: 110%;} .about-title .title-1 span::after{left: -moz-calc(100% + 30px);left: -webkit-calc(100% + 30px);right: 110%;} #about{margin-top:50px;margin-bottom: 100px;} #about .title-0{padding-left: 10px;letter-spacing: 10px;} #about .item{width: 100%;} #about .about-brief{padding: 0 4.117647%; margin-bottom:5%;} #about .about-brief .brief{line-height: 34px;font-size: 14px;color: #666;} #about .number{height: 80%;right: 0;top: 0; padding:5% 10%; background:url(../image/ddabout.jpg) center top;} #about .number .i{width: 25%;height: 100%;font-size: 20px;color: #333333;} /*#about .number .i:nth-child(1) , #about .number .i:nth-child(3){background-color: #f5f5f5;}*/ #about .number .i .n{font-family: 'Din';font-size: 60px;color: #333333;/*margin: 60% 0 56%;letter-spacing: -3px;*/} #about .number .i .n span{font-size:16px; font-weight:bold; color:#333333;} #about .number .i .n font{font-size:45px; font-weight:bold; color:#333333;} /*#team .team-list{margin-top: 90px;margin-bottom: 60px;} #team .team-list .item{width: 15.470588%;margin-left: 5.35294%;margin-bottom: 20px;} #team .team-list .item.i0{margin-left: 0;} #team .team-list .item .title{font-size: 20px;color: #000;margin-top: 25px;margin-bottom: 5px;} #team .team-list .item .name{font-size: 18px;color: #000;}*/ /*#products-detail .images{width: 100%;margin-bottom: 65px;} #products-detail .images .main{width: 100%;height: 100%;left: 0;top: 0;} #products-detail .images .wrap{height: 100%;} #products-detail .images .computer{width: 52.88235294117647%;left: 19.1176470588235%;top: 5.448154657293497363796133567663%;z-index: 2;} #products-detail .images .computer .img{padding: 0 11.3459399% 0;left: 0;top: 4.5738045738%;} #products-detail .images .phone{width: 14.647058823529%;left: 64.7058823529%;top: 26.36203866432337%;z-index: 3;} #products-detail .images .phone .img{padding: 0 33.3333333% 0 4.016064257%;left: 0;top: 15.284974093264248704663212435233%;} #products-detail .detail{width: 67.94117647%;} #products-detail .products-side{width: 29.4117647%;background-color: #fff;box-shadow: 0 0 8px rgba(0,0,0,.2);} #products-detail .products-side .rows{padding-left: 8%;padding-right: 8%;} #products-detail .products-side .product{padding-top: 25px;padding-bottom: 25px;} #products-detail .products-side .product .left{line-height: 35px;margin-top: 8px;} #products-detail .products-side .product .name{font-size: 20px;color: #000;} #products-detail .products-side .product .category{font-size: 16px;color: #888;} #products-detail .products-side .product .other-button{width: 55%;} #products-detail .products-side .product .button{width: 86px;height: 86px;line-height: 86px;font-size: 16px;color: #ff1903;border: 1px solid #ff1903;border-radius: 100%;text-align: center;margin-left: 5%;} #products-detail .products-side .product .button:first-child{margin-left: 0;} #products-detail .products-side .product .button:hover{color: #fff;background-color: #ff1903;border-color: #ff1903;} #products-detail .products-side .price-row{line-height: 34px;font-size: 16px;color: #fff;background-color: #ff1903;padding-top: 30px;padding-bottom: 30px;} #products-detail .products-side .price-row::after{width: 0;height: 0;border-top: 15px solid #fff;border-left: 10px solid transparent;border-right: 10px solid transparent;position: absolute;z-index: 1;right: 8%;top: 45%;content: '';} #products-detail .products-side .price-row .price{font-family: Arial;font-size: 34px;} #products-detail .products-side .brief-row{line-height: 30px;font-size: 16px;color: #666;padding-top: 25px;padding-bottom: 25px;} #products-detail .products-side .brief-row .line{height: 0;margin: 20px -10%;border-top: 1px solid #f2f2f2;} #products-detail .products-side .brief-row .line + br{display: none;} #products-detail .products-side .brief-row .tips{line-height: 26px;font-size: 14px;color: #ccc;margin-top: 20px;} #products-detail .products-side .like-row .title{font-size: 18px;color: #333;} #products-detail .products-side .like-row .title::after{width: 100%;height: 3px;background: url(/images/images/side-border.jpg) repeat-x left center;left: 0;top: 50%;position: absolute;z-index: 1;content: '';} #products-detail .products-side .like-row .title span{font-size: inherit;color: inherit;background-color: #fff;padding: 0 20px;z-index: 2;} #products-detail .products-side .like-row .like-box{min-height: 100px;} #products-detail .products-side .like-row .like-box .button{font-size: 24px;color: #ff1903;top: 35%;} #products-detail .products-side .like-row .like-box .button.stop{color: #dbdbdb;} #products-detail .products-side .like-row .like-box .prev{left: 2%;} #products-detail .products-side .like-row .like-box .next{right: 2%;} #products-detail .products-side .like-row .like-box .bd{width: 85%;margin: 0 auto;} #products-detail .products-side .like-row .like-box .item{width: 50%;} #products-detail .products-side .like-row .like-box .item .cover{z-index: 2;} #products-detail .products-side .like-row .like-box .item .cover .img{width: 100%;left: 0;top: 4%;} #products-detail .products-side .like-row .like-box .item .cover .img img{width: 76.923%;} #products-detail .products-side .like-row .like-box .item .name{color: #222;} #products-detail .products-side .like-row .like-box .item .category{color: #aaa;} #products-detail .products-side .like-row .like-box .item .price{color: #222;margin-top: 8px;}*/ #products-detail .detail-title{font-family: 'PingFang';font-size: 50px;} #products-detail .detail-bg{background-image: url(/images/images/detail-bg.jpg);background-repeat: repeat-y;background-position: center top;background-size: 100% auto;} #products-detail .detail-bg .title-0{font-family: 'PingFang';font-size: 54px;color: #ff1903;margin-top: 60px;} #products-detail .detail-bg .title-1{font-size: 14px;color: #888;} #products-detail .detail-bg .price-list{margin: 35px 0;} #products-detail .detail-bg .price-list .price-item .name{font-size: 14px;color: #fff;padding: 4px 7px;border-radius: 2px;} #products-detail .detail-bg .price-list .price-item .price{font-family: 'AvantGarde';font-size: 46px;margin-top: 10px;} #products-detail .detail-bg .price-list .price-item.i1 .name{background-color: #ffc804;} #products-detail .detail-bg .price-list .price-item.i1 .price{color: #ffc804;} #products-detail .detail-bg .price-list .price-item.i2 .name{background-color: #ff4300;} #products-detail .detail-bg .price-list .price-item.i2 .price{color: #ff4300;} #products-detail .detail-bg .price-list .price-item.i3 .name{background-color: #00b3ff;} #products-detail .detail-bg .price-list .price-item.i3 .price{color: #00b3ff;} #products-detail .detail-bg .price-list .price-line{width: 1px;height: 100px;background-image: url(../image/price-line.png);margin: 0 5.3125%;} #products-detail .detail-bg .price-btn{margin-bottom: 30px;} #products-detail .detail-bg .price-btn .botton{width: 10%;height: 48px;line-height: 48px;font-size: 18px;color: #fff;border-radius: 2px;margin:0 26px;} #products-detail .detail-bg .price-btn .btn-0{background-color: #323436;} #products-detail .detail-bg .price-btn .btn-1{background-color: #ff1903;} #products-detail .detail-bg .product-images{width: 95%;max-width: 1054px;margin: 0 auto;} #products-detail .detail-bg .image-pc{width: 91.08159392789%;} #products-detail .detail-bg .image-pc .img{top: 9.0556274256%;right: 3.8541666666666666%;bottom: 30.789133247%;left: 3.8541666666666666%;} #products-detail .detail-bg .image-tablet{width: 31.3092979127%;left: 0;bottom: -1.0349288486%;z-index: 2;} #products-detail .detail-bg .image-tablet .img{top: 10.212765957%;right: 6.060606060606%;bottom: 10.212765957%;left: 6.060606060606%;} #products-detail .detail-bg .image-phone{width: 14.7058823529%;left: 23.8140417457%;bottom: -1.42302716688%;z-index: 3;} #products-detail .detail-bg .image-phone .img{top: 14.457831325%;right: 6.4516129%;bottom: 14.457831325%;left: 6.4516129%;} #products-detail .detail-bg .img img{top: 0;} #products-detail .products-process{background-color: #ff1903;padding: 115px 0 140px;} #products-detail .products-process .detail-title{color: #fff;} #products-detail .products-process .process-list{margin-top: 100px;} #products-detail .products-process .process-list .process-item{width: 12%;margin: 0 5.294117647%;} #products-detail .products-process .process-list .process-item .bg{z-index: 2;} #products-detail .products-process .process-list .process-item .shadow{width: 100%;height: 100%;background-image: url(http://www.vishining.com/images/images/hexagon-shadow);background-repeat: no-repeat;background-size: 100% auto;left: 0;top: 0;} #products-detail .products-process .process-list .process-item .main{width: 100%;height: 100%;left: 0;top: 0;z-index: 3;} #products-detail .products-process .process-list .process-item .main .ico{height: 50%;background-repeat: no-repeat;background-position: center center;margin-top: 13.10043668%;} #products-detail .products-process .process-list .process-item .main .ico.i1{background-image: url(http://www.vishining.com/images/images/process-1.png);background-size: 43.1372549% auto;} #products-detail .products-process .process-list .process-item .main .ico.i2{background-image: url(../image/process-2.png);background-size: 37.745098% auto;} #products-detail .products-process .process-list .process-item .main .ico.i3{background-image: url(/images/images/process-3.png);background-size: 37.25490196% auto;} #products-detail .products-process .process-list .process-item .main .ico.i4{background-image: url(../image/process-4.png);background-size: 40.19607843137% auto;} #products-detail .products-process .process-list .process-item .main .name{font-size: 26px;color: #ff1903;margin-top: 8.73362445%;} #products-detail .products-service{padding-top: 80px;} #products-detail .products-service .detail-title{color: #333;} #products-detail .products-service .service-list{margin-top: 100px;margin-bottom: 30px;} #products-detail .products-service .service-list .service-item{width: 20%;} #products-detail .products-service .service-list .service-item .ico{width: 0;height: 0;background-color: #eee;background-repeat: no-repeat;background-position: center center;padding: 20.588235294117647058823529411765%;border-radius: 100%;margin: 0 auto;} #products-detail .products-service .service-list .service-item .ico.i1{background-image: url(../image/service-1.png);background-size: 70% auto;} #products-detail .products-service .service-list .service-item .ico.i2{background-image: url(/images/images/service-2.png);background-size: 53.57142857% auto;} #products-detail .products-service .service-list .service-item .ico.i3{background-image: url(../image/service-3.png);background-size: 50.7142857% auto;} #products-detail .products-service .service-list .service-item .ico.i4{background-image: url(../image/service-4.png);background-size: 53.57142857% auto;} #products-detail .products-service .service-list .service-item .ico.i5{background-image: url(../image/service-5.png);background-size: 56.42857142857% auto;} #products-detail .products-service .service-list .service-item .name{font-family: 'PingFang';font-size: 34px;color: #333;margin-top: 55px;} .editor *{max-width: 100%;line-height: inherit;font-family: inherit;font-size: inherit;color: inherit;} #viewPage{left: 0;right: 0;top: 85px;bottom: 0;background: #1d1d1d;} #viewPage .iframePage{height: 100%;background-color: #fff;margin: 0 auto;} #viewPage .iframePage iframe{width: 100%;height: 100%;} #instance .instance-list{margin-top: 70px;} #instance .instance-list .item{width: 48.5294117647%;background-color: #fff;padding: 55px 0 40px;margin-bottom: 70px;} #instance .instance-list .item.fl{clear: both;} #instance .instance-list .item .cover{width: 64%;} #instance .instance-list .item .cover .img{width: 100%;left: 0;top: 4%;} #instance .instance-list .item .cover .img img{width: 76.923%;} #instance .instance-list .item .info{width: 33%;} #instance .instance-list .item .info .logo{width: 84px;height: 84px;border: 1px solid #b6c4cd;border-radius: 100%;} #instance .instance-list .item .info .logo img{max-width: 90%;max-height: 90%;} #instance .instance-list .item .info .title{width: 57%;margin: 15px 0 0 4%;} #instance .instance-list .item .info .name{font-size: 22px;color: #333;} #instance .instance-list .item .info .date{color: #888;margin-top: 8px;} #instance .instance-list .item .info .brief{height: 130px;line-height: 26px;font-size: 14px;color: #888;margin-top: 25px;} #instance .instance-list .item .info .view{width: 130px;height: 44px;line-height: 44px;font-size: 16px;color: #fff;background-color: #ff1903;border-radius: 3px;margin: 10px auto 0;} #price-table{border-collapse: collapse;margin-top: 100px;} #price-table .price-row .pack-title{width: 25%;line-height: 60px;} #price-table .price-row .pack-title{background-color: #fafafa;border-left: 1px solid #e1e1e1;border-top: 1px solid #e1e1e1;} #price-table .price-row .pack-title .title-0{font-size: 36px;color: #000;} #price-table .price-row .pack-title .title-1{font-size: 30px;color: #bbb;} #price-table .price-row .pack-col{width: 25%;} #price-table .price-row.r0 .pack-col{padding: 50px 0;} #price-table .price-row.r0 .pack-col.i0{background-color: #ffc804;border-top: 1px solid #ffc804;} #price-table .price-row.r0 .pack-col.i1{background-color: #ff4300;border-top: 1px solid #ff4300;} #price-table .price-row.r0 .pack-col.i2{background-color: #00b3ff;border-top: 1px solid #00b3ff;} #price-table .price-row.r0 .pack-col .price-title{font-family:Arial, 'PingFang';font-size: 48px;color: #fff;} /*#price-table .price-row.r0 .pack-col .price-title::before , #price-table .price-row.r0 .pack-col .price-title::after{width: 40px;height: 1px;background-color: #fff;position: absolute;z-index: 1;top: 50%;content: '';}*/ #price-table .price-row.r0 .pack-col .price-title::before{right: 120%;} #price-table .price-row.r0 .pack-col .price-title::after{left: 120%;} #price-table .price-row.r0 .pack-col .pack-price{font-family:Arial, 'PingFang';font-size: 86px;color: #fff;} #price-table .price-row.r0 .dd-pack-col .pack-price{font-size: 66px;} #price-table .price-row.r0 .pack-col .pack-price::before{font-size: 30px;position: absolute;z-index: 1;top: 18px;right: 100%;content: '¥';} #price-table .price-row.r0 .dd-pack-col .pack-price::before{content: '';} #price-table .price-row.r0 .pack-col .o-price{font-size: 18px;color: #fff;opacity: .5;} #price-table .price-row.r0 .pack-col .o-price::before{width: 120%;height: 1px;background-color: #fff;left: -10%;top: 50%;position: absolute;z-index: 1;content: '';} #price-table .price-row.r1 .pack-col{padding: 30px 0 50px;} #price-table .price-row.r1 .pack-col.i0{background-color: #ffd306;} #price-table .price-row.r1 .pack-col.i1{background-color: #ff5400;} #price-table .price-row.r1 .pack-col.i2{background-color: #00c1ff;} #price-table .price-row.r1 .pack-col .renewals{font-size: 26px;color: #fff;} #price-table .price-row.r1 .pack-col .renewals span{font-size: 36px;} #price-table .price-row.r1 .pack-col .renewals font{font-size:18px; font-weight:bold;} #price-table .price-row.r1 .pack-col .renewals span::before{font-size: 26px;position: relative;z-index: 1;top: -8px;margin: 0 4px 0 8px;content: '¥';} #price-table .price-row.r1 .pack-col .o-price{font-size: 18px;color: #fff;opacity: .5;} #price-table .price-row.r1 .pack-col .o-price::before{width: 120%;height: 1px;background-color: #fff;left: -10%;top: 50%;position: absolute;z-index: 1;content: '';} #price-table .price-row.r1 .pack-col .tips{font-size: 22px;color: #fff;margin-top: 30px;} #price-table .price-row.r1 .pack-col .tips a{color: #fff; font-size:36px;} #price-table .fun-title td{line-height: 60px;font-size: 18px;color: #000;background-color: #e1e1e1;} #price-table .fun-row .fun-type{font-weight: bold;font-size: 16px;color: #333;border: 1px solid #e5e5e5;} #price-table .fun-row .fun-title{height: 60px;line-height: 24px;font-size: 16px;color: #333;border: 1px solid #e5e5e5;} #price-table .fun-row .fun-cell{font-size: 16px;color: #666;} #price-table .fun-row.i0 .fun-cell.i0{background-color: #f8f5e7;} #price-table .fun-row.i0 .fun-cell.i1{background-color: #f8ece7;} #price-table .fun-row.i0 .fun-cell.i2{background-color: #ebf5f9;} #price-table .fun-row.i1 .fun-cell.i0{background-color: #eeecdf;} #price-table .fun-row.i1 .fun-cell.i1{background-color: #eee3df;} #price-table .fun-row.i1 .fun-cell.i2{background-color: #e1ecf1;} #tutorial .tutorial-support{width: 100%;background-color: #323436;padding: 24px 0;} #tutorial .tutorial-support .left{width: 70%;} #tutorial .tutorial-support .support-search .text{width: 350px;height: 60px;line-height: 60px;font-size: 14px;background: #fff url(../image/ico-search.png) no-repeat 15px center;padding: 0 10px 0 55px;border: 0;border-radius: 5px;} #tutorial .tutorial-support .ico{font-size: 16px;color: #fff;} #tutorial .tutorial-support .play{line-height: 60px;background: url(../image/ico-play.png) no-repeat left center;padding-left: 40px;margin-left: 4%;} #tutorial .tutorial-support .file{line-height: 60px;background: url(../image/ico-file.png) no-repeat left center;padding-left: 35px;} #tutorial .tutorial-support .question{line-height: 60px;background: url(../image/ico-question.png) no-repeat left center;padding-left: 45px;} #tutorial .tutorial-support .line{width: 1px;height: 60px;background-color: #383939;margin: 0 3%;} #tutorial .tutorial-list{min-height: 300px;} #tutorial .tutorial-list .item{width: 44.70588%;padding: 45px 0;border-top: 1px solid #e5e5e5;} #tutorial .tutorial-list .item:nth-child(1) , #tutorial .tutorial-list .item:nth-child(2){border-top: 0;} #tutorial .tutorial-list .item .date{width: 20%;} #tutorial .tutorial-list .item .date .year{font-size: 16px;color: #666;margin: 6px 0 15px;} #tutorial .tutorial-list .item .date .day{font-size: 34px;color: #222;} #tutorial .tutorial-list .item .info{width: 80%;} #tutorial .tutorial-list .item .info .name{font-size: 20px;color: #222;} #tutorial .tutorial-list .item .info .name a{font-size: inherit;color: inherit;} #tutorial .tutorial-list .item .info .name a:hover{color: #ff1903;} #tutorial .tutorial-list .item .info .brief{height: 72px;line-height: 24px;font-size: 14px;color: #888;margin-top: 20px;} #info-detail{min-height: 300px;} #info-detail .top .info-title{font-size: 26px;} #info-detail .top span{font-size: 14px;color: #666;margin: 0 1%;} #info-detail .page{margin-top:20px;} #info-detail .page div{margin-top:10px;} #info-detail .page div , #info-detail .page div a{font-size:14px;} #info-detail .page div a:hover{color:#ff1903;} #contact .contact-info{border-bottom: 1px solid #e5e5e5;margin-bottom: 60px;} #contact .contact-info .item{width: 25%;padding: 60px 0 20px;} #contact .contact-info .item .ico{height: 70px;} #contact .contact-info .item .title{font-size: 14px;color: #888;margin-bottom: 15px;} #contact .contact-info .item .info{height: 96px;line-height: 32px;font-family: Arial;font-size: 20px;color: #333;} #contact .contact-info .item .info a{font-size: inherit;color: inherit;} #contact .contact-info .item .button{width: 30.588235%;height: 38px;line-height: 38px;font-size: 14px;color: #fff;background-color: #ff1903;border-radius: 3px;margin: 0 auto;} #contact .map{width: 50%;} #contact .map .img-0{opacity: 0;} #contact .map .img-1{right: 0;top: 0;} #contact .contact-area{width: 49.117647%;} #contact .contact-area .contact-info2{background-color: #f7f7f7;padding: 25px 55px 30px;} #contact .contact-area .contact-info2 .title{line-height: 46px;font-size: 26px;color: #222;} #contact .contact-area .contact-info2 .address{line-height: 36px;font-size: 16px;color: #333;margin-bottom: 25px;} #contact .contact-area .contact-info2 .line{width: 1px;height: 85%;background-color: #ececec;left: 50%;top: 6.8376%;} #contact .contact-area .contact-info2 .qrcode{width: 41%;} #contact .contact-area .contact-info2 .qrcode .img{width: 40%;max-width: 117px; margin-right:10px;} #contact .contact-area .contact-info2 .qrcode .name{width: 57.241379%;height: 100%;line-height: 34px;font-size: 16px;color: #888;margin-top: 5%;} #contact .contact-area .contact-info2 .qrcode .name *{font-size: inherit;color: inherit;} #contact .contact-area .contact-form{width: 93.41317%;margin-top: 20px;} #contact .contact-area .contact-form .text{width: 26.923%;height: 30px;line-height: 30px;font-size: 16px;color: #333;background-color: #fff;padding: 10px 0;border-width: 0 0 1px 0;border-style: solid;border-color: #999;margin-left: 9.6153846%;box-sizing: content-box;} #contact .contact-area .contact-form .text:first-child{margin-left: 0;} #contact .contact-area .contact-form .area{width: 100%;height: 100px;line-height: 30px;font-family: inherit;font-size: 16px;color: #333;background-color: #fff;padding: 10px 0;border-width: 0 0 1px 0;border-style: solid;border-color: #999;margin: 15px 0;resize: none;box-sizing: content-box;} #contact .contact-area .contact-form .button{width: 26.923%;/*width: 150px;*/height: 50px;font-size: 14px;color: #fff;background-color: #6d6d6d;border: 0;border-radius: 3px;cursor: pointer;} #contact .contact-area .contact-form .code-img{width: 26.923%;height: 50px;margin-left: 9.6153846%;} #contact .contact-area .contact-form .code-img img{width: 100%;height: 100%;} #inquire{margin-top: 100px;} #inquire .product-cover{width: 30.294117647%;margin-right: 2.647%;vertical-align: top;} #inquire .product-cover .img{width: 100%;left: 0;top: 4%;} #inquire .product-cover .img img{width: 76.923%;} #inquire .phone-form{width: 300px;vertical-align: top;} #inquire .phone-form .name{font-size: 16px;color: #555;} #inquire .phone-form .code-text{padding-right: 125px;} #inquire .phone-form .code-btn{width: 108px;height: 48px;line-height: 48px;font-size: 14px;color: #000;background-color: #ddd;border: 0;right: 2px;top: 2px;cursor: pointer;} #inquire .try-form{width: 100%;max-width: 420px;margin: 0 auto;} #login{margin-top: 75px;} #login .login-form{width: 100%;max-width: 480px;padding: 70px 3% 40px;margin: 0 auto;border: 1px solid #eeeff2;box-shadow: 0 0 3px rgba(0,0,0,.1);} #login .login-form .code-text{width: 61%;} .website-form-top .website-form-title{font-size: 44px;color: #333;} .website-form-top .website-form-title::before , .website-form-top .website-form-title::after{width: 115px;height: 1px;background-color: #e1e1e1;position: absolute;z-index: 1;top: 50%;content: '';} .website-form-top .website-form-title::before{right: 120%;} .website-form-top .website-form-title::after{left: 120%;} .website-form-top .website-form-brief{line-height: 24px;font-size: 14px;color: #666;margin-top: 10px;} .website-form a{color: #ff1903;font-size: inherit;} .website-form a:hover{text-decoration: underline;} .website-form label{font-weight: normal;font-size: 14px;color: #aaa;} .website-form .text{height: 52px;line-height: 52px;font-size: 14px;color: #333;background-color: #fff;padding: 0 15px;border: 1px solid #dfdfdf;} .website-form .text.block{width: 100%;} .website-form .text.half_block{width:60%;} .website-form .get-btn{display:inline-block; width:39%; height:52px; line-height:52px; text-align:center; color:#fff; border:none; background:#ff1903; cursor:pointer;} .website-form .area{width: 100%;line-height: 20px;font-size: 14px;color: #333;background-color: #fff;padding: 15px;border: 1px solid #dfdfdf;resize: none;} .website-form .big-avater{width: 200px;height: 200px;border: 5px solid #ddd;border-radius: 100%;margin: 0 auto;} .website-form .big-avater input[type='file']{width: 100%;height: 100%;left: 0;top: 0;opacity: 0;cursor: pointer;} .website-form .submit{width: 100%;height: 52px;line-height: 52px;font-size: 16px;color: #fff;background-color: #ff1903;border: 0;} /*.btn-group .btn{font-size: 16px;} .dropdown-menu > li > a{font-size: 14px;}*/ footer{background-color: #323436;} footer .left .title{font-size: 18px;color: #888;} footer .left .hotline{font-family: Arial;font-weight: bold;font-size: 42px;color: #fff;margin: 35px 0 10px;} footer .left .address{line-height: 24px;font-size: 14px;color: #666;background: url(../image/ico-position.png) no-repeat left center;padding-left: 25px;} footer .left .address a{color:#fff;} footer .left .sitemap{margin-top:10px; line-height: 24px;font-size: 14px;} footer .left .sitemap a{color:#fff;} footer .follow .title{margin-bottom: 30px;} footer .follow .title::after{width: 100%;height: 1px;background-color: #404244;left: 0;top: 50%;position: absolute;z-index: 1;content: '';} footer .follow .title span{font-size: 14px;color: #aaa;background-color: #323436;padding: 0 10px;z-index: 2;} footer .follow .item{color: #8c8c8c;} footer .follow .item:nth-child(2){margin: 0 30px;} footer .follow .item .ico{width: 54px;height: 54px;line-height: 54px;border-radius: 100%;margin-bottom: 10px;} footer .follow .item .ico.qq{background-color: #12b7f5;} footer .follow .item .ico.qq:hover{color: #12b7f5;background-color: #fff;} footer .follow .item .ico.wechat{background-color: #24b727;} footer .follow .item .ico.wechat:hover{color: #24b727;background-color: #fff;} footer .follow .item .ico.sina{background-color: #ea493c;} footer .follow .item .ico.sina:hover{color: #ea493c;background-color: #fff;} footer .follow .item .ico i{font-size: 24px;color: #fff;} footer .follow .item .ico:hover i{color: inherit;} footer .follow .item .qrcode{width: 250px;height: 250px;background-color: #fff;padding: 25px;border-radius: 10px;box-shadow: 0 4px 6px #323436;margin-left: -125px;bottom: 180%;left: 50%;display: none;} footer .follow .item .qrcode::after{width: 0;height: 0;border-top: 8px solid #fff;border-left: 8px solid transparent;border-right: 8px solid transparent;margin-left: -4px;position: absolute;z-index: 1;left: 50%;top: 100%;content: '';} footer .follow .item:hover .qrcode{bottom: 140%;display: block;} footer .bottom{line-height: 28px;background-color: #222; padding:10px 0px;} footer .bottom .links{color: #555;} footer .bottom .links a{color: inherit;margin: 0 8px;} footer .bottom .links a:hover{color: #fff;} footer .bottom .copyright{color: #555;} footer .bottom .copyright a{color: inherit;} footer .bottom .copyright a:hover{color: #fff;} #follow{/*left: 0;*/bottom: 40%;position: fixed;z-index: 10; right:0;} #follow .item{width: 40px;height: 40px;} #follow .item .ico{width: 40px;height: 40px;line-height: 40px;color: #fff;background-color: rgba(30,30,30,.6);background-repeat: no-repeat;background-position: center center;background-size: 50% auto;text-align: center;left: 0;top: 0;} #follow .item .red{background-color: #ea493c;} #follow .item .blue{background-color: #3da8e5;} #follow .item .green{background-color: #24b727;} #follow .item .orange{background-color: #ffbe33;} #follow .totop{opacity: 0;} #follow .totop.show{opacity: 1;} #follow .item.open[row='1']{height: 90px;} #follow .item.open[row='2']{height: 90px;} #follow .item.open[row='3']{height: 162px;} #follow .item.open[row='4']{height: 198px;} #follow .item.open[row='5']{height: 234px;} #follow .top{line-height: 24px;font-size: 14px;color: #fff;padding: 15px;} #follow .top a{line-height: inherit;font-size: 16px;color: inherit;} #follow .item [id]{width: 140px;background-color: #fff;left: -140px;position: relative;z-index: 1;-webkit-transition:all 300ms ease 0s; -moz-transition:all 300ms ease 0s; -ms-transition:all 300ms ease 0s; -o-transition:all 300ms ease 300ms; transition:all 300ms ease 0s;} #follow .qq-list .list{line-height: 20px;padding: 8px 25px;} #follow .qq-list .list span{margin-right: 10px;} #follow .qq-list .list:hover{color: #fff;background-color: #3da8e5;} #openHotline .ico{background: url(../image/p-phone.png) no-repeat center center;} #hotline .top{background-color: #ffbe33;} #online .top{background-color: #3da8e5;} #follow .item[id^='open'] .ico{left: 0;-webkit-transition:all 300ms ease 600ms; -moz-transition:all 300ms ease 600ms; -ms-transition:all 300ms ease 600ms; -o-transition:all 300ms ease 600ms; transition:all 300ms ease 600ms;} #follow .item[id^='open']{-webkit-transition:all 300ms ease 300ms; -moz-transition:all 300ms ease 300ms; -ms-transition:all 300ms ease 300ms; -o-transition:all 300ms ease 300ms; transition:all 300ms ease 300ms;} #follow .item.open{-webkit-transition:all 300ms ease 300ms; -moz-transition:all 300ms ease 300ms; -ms-transition:all 300ms ease 300ms; -o-transition:all 300ms ease 300ms; transition:all 300ms ease 300ms;} #follow .item.open .ico{left: 140px;-webkit-transition:all 300ms ease 0s; -moz-transition:all 300ms ease 0s; -ms-transition:all 300ms ease 0s; -o-transition:all 300ms ease 0s; transition:all 300ms ease 0s;} #follow .item.open [id]{left:0;box-shadow: 0 5px 10px rgba(4, 0, 0, 0.2); -webkit-transition:all 300ms ease 600ms; -moz-transition:all 300ms ease 600ms; -ms-transition:all 300ms ease 600ms; -o-transition:all 300ms ease 600ms; transition:all 300ms ease 600ms;} #follow #wechat-qrcode{width: auto;max-width: 200px;left: auto;right: 100%;bottom: 0;position: absolute;display: none;-webkit-transition:all 0s ease 0s; -moz-transition:all 0s ease 0s; -ms-transition:all 0s ease 0s; -o-transition:all 0s ease 0s; transition:all 0s ease 0s;} #footer_alert_blank{width:100%; height:50px;} #footer_alert{position:fixed; left:0; bottom:0px; /*bottom:-100px;*/ width:100%; /*height:58px; background:#e9e9e9; background:rgba(233,233,233,0.9); z-index:999;*/} #footer_alert .wrap{ position:relative; height:100%;} #footer_alert .img{ width:96px; height:66px; position:absolute; left:240px; bottom:7px;} #footer_alert .txt{ font-size:24px; color:#535353; line-height:58px; margin-left:380px; float:left;} #footer_alert .txt span{ font-family:"Arial"; font-size:32px; color:#3eb3a0; margin:0 10px; vertical-align:bottom;} #footer_alert .btn{ width:166px; height:38px; /*line-height:38px;*/ font-size:16px; color:#fff; float:right; margin-right:200px; margin-top:11px; background:#ff1903; display:inline-block; text-decoration:none; text-align:center; -moz-border-radius:19px; -ms-border-radius:19px; -o-border-radius:19px; -webkit-border-radius:19px; border-radius:19px;} #footer_alert .topic{line-height:38px;} #footer_alert .btn i{ width:27px; height:22px; left:15px; top:7px; background:url(http://www.vishining.com/images/icons.png) no-repeat; background-position:-37px -3px;} #footer_alert .close{ width:25px; height:25px; float:right; cursor:pointer; margin-right:10px; margin-top:17px;} #footer_alert .close i{ width:25px; height:25px; left:0; top:0; background:url(http://www.vishining.com/images/icons.png) no-repeat; background-position:-456px -398px;} .team-list .item{width: 11.11111111%;background-repeat: no-repeat;background-position: center center;background-size: 100% 100%;} .team-list .item.item0{background-image: url(../image/team-bg-0.jpg);} .team-list .item.item1{background-image: url(../image/team-bg-1.jpg);} .team-list .item:hover{z-index: 2;} #ddfollow{position:fixed; left:0px; bottom:45%; z-index:10;} #ddfollow .item{width: 45px;height: 45px; line-height:45px;} #ddfollow .item .ico{width: 45px;height: 45px;color: #fff;background-color: rgba(30,30,30,.6);background-repeat: no-repeat;background-position: center center;background-size: 50% auto;text-align: center;left: 0;top: 0;} #ddfollow .item .blue{background-color: #3da8e5;} #ddfollow .item .orange{background-color: #ffbe33;} #ddfollow .phone{background: url(../image/p-phone.png) no-repeat center center;} #ddfollow .dditem .tel{width:0; transition:width .7s; -webkit-transition:width .7s;left: 100%;top: 0;overflow: hidden; font-size:14px; color:#FFFFFF;} #ddfollow .dditem:hover .tel{width:130px; text-align:center;} .dd-links{position:relative; display:block; width:133px; height:33px; font-size:14px; line-height:33px; text-align:center; color:#999; border:1px solid #999; text-transform:uppercase; margin:6px auto 0;} .dd-links::after{content:''; position:absolute; top:50%; right:-41px; z-index:3; width:80px; height:1px; background-color:#999;} .dd-links::before{content:''; position:absolute; top:50%; left:-41px; z-index:3; width:80px; height:1px; background-color:#999;} .dd-links:hover{border:1px solid #ff1903; color:#ff1903;} .dd-links:hover::after , .dd-links:hover::before{background-color:#ff1903;} @media only screen and (max-width: 1440px){ header nav{margin-left: -220px;} /*header nav .nav-item{width: 70px;}*/ header .header-user .try{width: 100px;} #banner .item-0 .font span{font-size: 42px;} #about .about-brief .brief{line-height: 26px;} #about .number .i .n{font-size: 50px;} /*#products-detail .products-side .rows{padding-left: 4%;padding-right: 4%;} #products-detail .products-side .product .button{width: 75px;height: 75px;line-height: 75px;}*/ #products-detail .products-process .process-list .process-item{width: 14%;margin: 0 4.29412%;} #instance .instance-list .item .cover{width: 57%;} #instance .instance-list .item .info{width: 42%;} #instance .instance-list .item .info .logo{width: 70px;height: 70px;} #instance .instance-list .item .info .title{margin-top: 6px;} #instance .instance-list .item .info .name{font-size: 20px;} } @media only screen and (max-width: 1300px){ .show1300{display: block;} .hide1300{display: none;} #products-box .products-list .item .cover .opt .button-bg{padding: 10px 15px;} #products-box .products-list .item .cover .opt .button{width: 60px;height: 60px;line-height: 60px;font-size: 14px;} #products-box .products-list .item .cover .opt .links{margin-top: auto;} #products-box .products-list .item-ext{width:46%; margin:0 12px 60px;} .index-tutorial .tutorial-support{width: 100%;height: 150px;position: relative;} .index-tutorial .tutorial-support .support-search{margin-left: 2%;float: left;} .index-tutorial .tutorial-list .item .date .day{font-size: 28px;} /*#about .item{width: 100%;max-width: 850px;margin: 0 auto;float: none;}*/ #about .about-brief{margin-top: 20px;margin-bottom: 20px;} /*#about .number{height: 260px;position: relative;} #about .number .i .n{margin: 55px 0 50px;}*/ #about .number{padding:5% 0%;} #products-detail .detail{width: 100%;float: none;clear: both;} #products-detail .products-side{width: 100%;max-width: 450px;margin-bottom: 20px;} #price-table .price-row .pack-title .title-0{font-size: 22px;} #price-table .price-row .pack-title .title-1{font-size: 16px;} #price-table .price-row.r0 .pack-col .price-title{font-size: 34px;} #price-table .price-row.r0 .pack-col .pack-price{font-size: 54px;} #price-table .price-row.r1 .pack-col .renewals{font-size: 18px;} #price-table .price-row.r1 .pack-col .renewals span{font-size: 28px;} #price-table .price-row.r1 .pack-col .renewals span::before{font-size: 20px;} #price-table .price-row.r0 .pack-col .o-price{font-size: 16px;} #price-table .price-row.r1 .pack-col .o-price{font-size: 16px;} #price-table .price-row.r2 .pack-col .o-price{font-size: 16px;} #price-table .price-row.r1 .pack-col .tips{font-size: 14px;} #tutorial .tutorial-list .item{width: 48%;} #tutorial .tutorial-list .item .date .day{font-size: 28px;} #contact .contact-area .contact-info2 .qrcode{width: 100%;float: none;} #instance .instance-list .item .cover{width: 100%;} #instance .instance-list .item .info{width: 96%; margin:0px 2%;} } @media only screen and (max-width: 992px){ .show992{display: block;} .hide992{display: none !important;} #global_qq_service{display:none;} #body.left{-ms-transform:translateX(-60%);-moz-transform:translateX(-60%);-webkit-transform:translateX(-60%);-o-transform:translateX(-60%);transform:translateX(-60%);} header{height: 60px;background-color: #fff;padding-top: 15px;padding-bottom: 15px;box-shadow: 0 1px 5px rgba(0,0,0,.3); position:relative; z-index:1;} header.left{left: -60%;} header #logo{height: 50px; top:-10px;} header #nice{margin-top:0px;} header #nice h1{line-height:14px;} header nav{width: 60%;height: 100%;line-height: 60px !important;background-color: #fff;border-left: 1px solid #555;margin: 0;top: 0;right: -60%;left: auto;position: fixed !important;overflow: auto;} /*header nav.open{right: 0;}*/ header nav .title{width: 100%;height: 60px;background-color: #555;} header nav .title .btn-close{width: 32px;height: 100%;line-height: inherit;background-image: url(../image/ico-close.png);background-repeat: no-repeat;background-position: center center;margin-right: 8%;} /*header nav .title .btn-close:hover{-ms-transform: rotate(180deg);-moz-transform: rotate(180deg);-webkit-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);}*/ header nav .nav-item{width: 100%;border-bottom: 1px solid #eee;position: relative;z-index: 1;text-align:left;float: none;} header nav .nav-item a{padding: 0 8%;display: block; color:#555 !important;} header nav .nav-item a::after{line-height: inherit;position: absolute;top: 0;right: 8%;z-index: 1;content: "\f054";display: inline-block; font-family: FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;-webkit-transition:all 300ms ease 0s; -moz-transition:all 300ms ease 0s; -ms-transition:all 300ms ease 0s; -o-transition:all 300ms ease 0s; transition:all 300ms ease 0s;} header nav .nav-item:hover a{ color:#ff1903 !important} header nav .member{padding: 0 8%;margin-top: 10px;} header nav .member .member-btn{height: 30px;line-height: 30px;font-size: 16px;color: #555;padding: 5px 10px;border: 1px solid #ddd;border-radius: 5px;margin-right: 3%;margin-bottom: 10px;} header nav .member .member-btn:hover{color: #fff;background-color: #ff1903;border-color: #ff1903;} header nav .member .member-btn a{font-size: inherit;color: inherit;} header nav .member .login i{width: 18px;height: 18px;background: url(../image/ico-user-0.png) no-repeat;margin-right: 10px;top: -2px;position: relative;z-index: 1;display: inline-block;vertical-align: middle;} header nav .member .login i::after{width: 100%;height: 100%;background: url(../image/ico-user-1.png) no-repeat;position: absolute;z-index: 1;left: 0;top: 0;opacity: 0;content: '';-webkit-transition:all 300ms ease 0s; -moz-transition:all 300ms ease 0s; -ms-transition:all 300ms ease 0s; -o-transition:all 300ms ease 0s; transition:all 300ms ease 0s;} header nav .member .login:hover i::after{opacity: 1;} header .menu-button{line-height: 30px;color: #333;} header .preview-button{width: auto;margin: 0;left: auto;right: 8%;} #header-blank{height: 60px;} .index-title , .index-title h2{font-size: 22px;} #about{margin-top:50px; margin-bottom:50px;} #about .number{padding:0%;} #about .number .i{width:50%; margin:5% 0% 5% 0%;} #products .products-bg{padding:50px 0 55px;} #products-box .products-list.on{z-index: 10;} #products-box .products-list .item{width: 50%;margin-right: 0;} #products-box .products-list .item.on{z-index: 3;} #products-box .products-list .item.on .mask{width: 100%;height: 100%;background-color: #000;position: fixed;left: 0;top: 0;opacity: .8;} #products-box .products-list .item.on .opt-msg{max-height: 180px;position: fixed;z-index: 3;} #products-box .products-list .item.on .opt-msg a{display: block;} #products-box .products-list .item-ext{width:98%; margin:0 auto 20px;} #products-box .box-button .button{width: 30px;height: 30px;line-height: 30px;} #products-box .box-button .button i{font-size: 14px;} #products-box .box-button .more-list{width: 45px;height: 30px;line-height: 30px;} .index-cooperation .cooperation-box .item{height: 140px;} .index-cooperation .evaluation-list .item .brief{padding: 10px;} .index-tutorial .tutorial-list .item{width: 100%;} .index-tutorial .tutorial-list .item:nth-child(1) , .index-tutorial .tutorial-list .item:nth-child(2){border-top: 1px solid #e5e5e5;} .index-tutorial .tutorial-list .item .info .brief{height: auto;} .about-title .title-1 span{font-size: 28px;} #team .team-list{font-size: 0px;text-align: center;} #team .team-list .item{width: 30%;margin: 0 1.5% 20px !important;float: none;display: inline-block;} #team .team-list .hd a{width: 12px;height: 12px;border: 1px solid #b7c5ce;border-radius: 100%;margin: 0 5px;display: inline-block;cursor: pointer;-webkit-transition: all 300ms ease 0s;-moz-transition: all 300ms ease 0s;-o-transition: all 300ms ease 0s;transition: all 300ms ease 0s;} #team .team-list .hd .on{background-color: #ff1903;border-color: #ff1903;} /*#products-detail .images > img{max-width: 150%;position: relative;z-index: 1;left: -25%;} #products-detail .images .computer{width: 74.882%;left: 7.118%;} #products-detail .images .phone{width: 23.647%;left: 70.706%;top: 14.362%;}*/ #products-detail .detail-bg .title-0{margin-top: 30px;} #products-detail .detail-bg .price-btn .botton{width: 20%;} #products-detail .detail-title{font-size: 36px;} #products-detail .products-process{padding: 40px 0 75px;} #products-detail .products-process .process-list{margin-top: 60px;} #products-detail .products-process .process-list .process-item{width: 18%;margin: 0 2.29412%;} #products-detail .products-process .process-list .process-item .main .name{font-size: 18px;} #products-detail .products-service{padding-top: 40px;} #products-detail .products-service .service-list{margin-top: 60px;} #products-detail .products-service .service-list .service-item .ico{padding: 30%;} #products-detail .products-service .service-list .service-item .name{font-size: 26px;margin-top: 30px;} #instance .instance-list .item .cover{width: 100%;float: none;} #instance .instance-list .item .info{width: 80%;margin: 10px auto 0;float: none;} #instance .instance-list .item .info .view{height: 30px;line-height: 30px;} #tutorial .tutorial-list .item{width: 100%;} #tutorial .tutorial-list .item:nth-child(1), #tutorial .tutorial-list .item:nth-child(2){border-top: 1px solid #e5e5e5;} #tutorial .tutorial-list .item .date{max-width: 120px;} #tutorial .tutorial-list .item .info .brief{height: auto;} #contact .contact-info .item{width: 50%;padding: 10px 0;} #contact .contact-area{width: 100%;float: none;margin-bottom: 10px;} #contact .contact-area .contact-form{width: 100%;} #contact .map{width: 100%;max-width: 850px;margin: 0 auto;float: none;} #contact .map .img-0{max-width: 180%;} #contact .map .img-1{max-width: 230%;} .try-button-box .button{height: 44px;line-height: 44px;font-size: 18px;margin: 10px 1.5%;} .website-form-top .website-form-title{font-size: 34px;} footer .left{margin-bottom: 30px;float: none;} footer .left .hotline{font-size: 24px;margin-top: 10px;} footer .follow{float: none;} footer .bottom{padding: 10px 0;} footer .bottom .links{width: 100%;line-height: 30px;float: none;} footer .bottom .copyright{width: 100%;line-height: 30px;float: none;} #footer_alert{background:rgba(255,25,3,0.7);} #footer_alert .ddol{} #footer_alert .ddol div{/*width:33.3%;*/ width:50%; text-align:center; float:left; line-height:50px;} #footer_alert .ddol div a{font-size:20px; color:#FFF;} #footer_alert .ddol div img{margin-right:5px;} #follow .item{margin-bottom: 1px;} #follow .item .ico.phone{border-top-left-radius: 10px;} #follow .item:last-child .ico{border-bottom-left-radius: 10px;} #follow .item .ico{width: 100%;height: 100%;background-repeat: no-repeat;background-position: center center;background-size: 50% auto;} #follow .item .ico .fa{display: none;} #follow .item .ico.phone{background-image: url(../image/m-phone.png);} #follow .item .ico.sina{background-image: url(../image/m-sina.png);} #follow .item .ico.wechat{background-image: url(../image/m-wechat.png);} #follow .item .totop .fa{font-size: 25px;display: inline-block;} } @media only screen and (max-width: 860px){ #products.index #products-box{padding-top:35px;} #price-table{margin-top:35px;} #price-table .price-row.r0 .pack-col .price-title{font-size:24px;} #price-table .price-row.r0 .pack-col .pack-price{font-size:36px;} #price-table .price-row.r0 .pack-col .pack-price::before{top:5px;} #price-table .price-row.r1 .pack-col .renewals span::before{top:-8px;} #info-detail img{width:100% !important; height:auto !important;} #footer_alert .img{left:160px;} #footer_alert .txt{margin-left:300px;} #price-table .price-row.r1 .pack-col .tips a{font-size:22px;} } @media only screen and (max-width: 768px){ .show768{display: block;} .hide768{display: none;} #dd-header-blank{display:none;} /*header nav{width: auto;min-width: 20%;height: auto !important;line-height: 34px;padding: 20px;right: -200px;} header nav.on{right: 0;} header nav .nav-item{width: 100%;text-align: right;float: none;} header nav .nav-item > a{display: block;} header nav .nav-item > a:hover{color: #ff1903;} header nav .nav-item{width: 33.33%;} header nav.on{height: 176px;}*/ #instance .instance-list{margin-top:35px;} #instance .instance-list .item{margin-bottom:35px;} #products-box .products-list .item .info .left{width: 100%;float: none;} #products-box .products-list .item .info .price{width: 100%;line-height: 24px;float: none;} .index-cooperation .cooperation-box .item{width: 33.33%} .index-cooperation .evaluation-list .item[class]{width: 100%;margin: 0 10px 0 0;} #tutorial .tutorial-support .support-search{width: 100%;margin-bottom: 10px;float: none;} #tutorial .tutorial-support .support-search .text{width: 100%;} #tutorial .tutorial-support .play{margin-left: 0;} #contact .contact-area .contact-info2{padding: 10px;} #contact .contact-area .contact-info2 .address{line-height: 30px;} #footer_alert .img{left:140px;} #footer_alert .txt{margin-left:250px;} } @media only screen and (max-width: 640px){ .show640{display: block;} .hide640{display: none;} .index-cooperation .evaluation-list .item .info .name{font-size: 20px;} .index-tutorial .tutorial-support .support-search{width: 96%;float: none;} .index-tutorial .tutorial-support .support-search .text{width: 100%;} .index-tutorial .tutorial-support .button{width: 96%;margin-left: 2%;float: none; margin-top:5%;} .try-button-box .button{width: 100%;margin: 10px 0;} #price-table .price-row .pack-title .title-0 , #price-table .price-row.r0 .pack-col .price-title{font-size:20px;} #price-table .price-row .pack-title .title-1{font-size:14px;} #price-table .fun-title td , #price-table .fun-row .fun-type , #price-table .fun-row .fun-title{font-size:14px;} #products-detail .detail-bg .price-list .price-item .price{font-size:32px;} #instance .instance-list .item{margin-bottom: 15px;} #instance .instance-list .item .info .logo{width: 60px;height: 60px;margin: 0 auto;float: none;} #instance .instance-list .item .info .title{width: 100%;margin: 10px 0 0;text-align:center;float: none;} #footer_alert .img{left:75px;} #footer_alert .txt{margin-left:185px;} } @media only screen and (max-width: 480px){ .show480{display: block;} .hide480{display: none;} /*#products-box .products-list .item{width: 100%;}*/ header nav .nav-item a::after{right:12%;} #about{margin-top:25px; margin-bottom:25px;} #about .number .i{font-size:16px;} /*#about .number .i .n{font-size: 30px;}*/ .index-tutorial .tutorial-list .item .date .day{font-size: 18px;} .index-tutorial .tutorial-list .item .info .name{font-size: 16px;white-space: normal;} #tutorial .tutorial-list .item .date .day{font-size: 18px;} #products-detail .detail-bg .price-list{margin:15px 0px;} #products-detail .detail-bg .price-list .price-item .price{font-size:24px;} #products-detail .products-process .process-list .process-item .main .name{margin-top:0;} #team .team-list .item{width: 90%;margin: 0 5% !important;} #contact .contact-info .item .ico{display: none;} #contact .contact-info .item .info{font-size: 16px;} #contact .contact-info .item .button{width: 80%;} #contact .contact-area .contact-form .text{width: 100%;margin: 0 0 10px;} #contact .contact-area .contact-form .button{width: 100%;} #contact .contact-area .contact-form .text[name='VCode']{width: 50%} #contact .contact-area .contact-form .code-img{width: 50%;margin: 0;text-align: right;} #contact .contact-area .contact-form .code-img img{width: auto;max-width: 100%;} #price-table .price-row.r0 .pack-col .o-price::before{background:none;} #price-table .price-row .pack-title .title-0{font-size:14px;} #price-table .price-row.r0 .pack-col .price-title{font-size:16px;} #price-table .price-row.r0 .pack-col .pack-price{font-size:28px;} #price-table .price-row.r0 .pack-col .pack-price::before{font-size:20px;} #price-table .price-row.r1 .pack-col .renewals span{font-size:22px;} #price-table .price-row.r1 .pack-col .renewals span::before{top:0px;} #price-table .fun-title td{line-height:30px;} #contact .map .img-1{right: -10%;} #footer_alert .img{left:10px;} #footer_alert .txt{margin-left:160px; font-size:16px;} #footer_alert .ddol div{/*width:33.3%;*/ width:50%; text-align:center; float:left; line-height:50px;} #footer_alert .ddol div a{font-size:16px;} #footer_alert .ddol div img{width:25px;} } @media only screen and (max-width: 375px){ #products .products-bg{padding:35px 0 20px;} #products-detail .products-process{padding:40px 0px 40px;} #products-detail .detail-bg .price-btn .botton{width:26%;} #products-detail .detail-title{font-size:24px;} #products-detail .products-process .process-list{margin-top:30px;} #products-detail .products-process .process-list .process-item .main .ico{margin-top:5%;} #products-detail .products-service .service-list{margin-top:30px;} #price-table .price-row.r0 .pack-col .price-title::before, #price-table .price-row.r0 .pack-col .price-title::after , #price-table .price-row.r0 .pack-col .o-price::before , #price-table .price-row.r1 .pack-col .o-price::before{display:none;} #price-table .price-row.r0 .pack-col .pack-price{font-size:24px;} #footer_alert{height:50px;} #footer_alert .img{left:0px;} #footer_alert .txt{margin-left:110px;} #price-table .price-row.r1 .pack-col .tips a{font-size:18px;} .d-375-hidn{display:none;} } @media only screen and (max-width: 360px){ #price br{display:block;} #price-table .price-row.r1 .pack-col .renewals{font-size:14px;} #footer_alert .txt{margin-left:115px; font-size:14px;} } @media only screen and (max-width: 320px){ .show320{display: block;} .hide320{display: none;} } .products-list-wrap{width:1600px; margin:0px auto;} .idx-tabs a{position: relative; display: inline-block; padding: 0 .75rem; font-size: .22rem; line-height: .34rem; color: #4d4d4d;} .idx-tabs a::before, .idx-tabs a::after{position: absolute; display: block; content: ""; left: 0; top: 50%; height: 6px; width: 1px; background: #696969;} .idx-tabs a::before{margin-top: -6px;} .idx-tabs a::after{margin-top: 3px;} .idx-tabs a:first-child::before, .idx-tabs a:first-child::after{display: none;} .idx-work{padding: .9rem 0; overflow:hidden;} .idx-work .bigtitle{margin-bottom: .5rem;} .idx-work .bigtitle h3{margin-bottom: .5rem;} .idx-work-item .col-xs-12{margin-top: .5rem;} .idx-work-item .imgbox{overflow:hidden; height:320px; position:relative;} .idx-work-item .imgbox a::after{position: absolute; display: block; content: ""; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.5); opacity: 0; -webkit-transition: all 0.3s; transition: all 0.3s;} .idx-work-item .imgbox img{-webkit-transition: transform 0.3s ease 0s; transition: transform 0.3s ease 0s; -webkit-transform: translateZ(0px); transform: translateZ(0px);} .idx-work-item h4{font-size: 20px; line-height: 32px; color: #303030;font-weight:bold} .idx-work-item p{font-size: 14px; line-height: 26px; color: #939393;white-space: nowrap} .idx-work-item p.line2{margin-bottom: 0; height: 52px;} .idx-work-item .weui-cell__ft{padding-left: 10px; height: 52px;} .idx-work-item .ff-lum{font-size: 12px; color: #303030;} .idx-work-item .more{position: relative; top: -3px; display: inline-block;} .idx-work-item .more::before{display: block; content: ""; margin-right: 1px; margin-left: 10px; width: 18px; height: 2px; background: #6d6d6d; -webkit-transition: all .3s; transition: all .3s;} .idx-work-item .more::after{position: absolute; display: block; content: ""; right: 0; top: 0; margin-top: -3px; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 4px solid #6d6d6d; -webkit-transition: all .3s; transition: all .3s;} .weui-cell{padding: 10px 30px; position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center;} .weui-cell_primary{min-width: 1px; -webkit-box-align: start; -webkit-align-items: flex-start; align-items: flex-start;} .weui-cell__bd{-webkit-box-flex: 1; -webkit-flex: 1; flex: 1; text-align:left;} .weui-cell__ft{text-align: right; color: #999999;} .weui-flex{display: -webkit-box; display: -webkit-flex; display: flex;} .weui-flex__item{-webkit-box-flex: 1; -webkit-flex: 1; flex: 1;} .weui-grids{position: relative; overflow: hidden;} .weui-grid{position: relative; float: left; padding: 20px 10px; box-sizing: border-box;} .line1{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;} .line2{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;} .line3{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;} .start{-webkit-box-align: start; -webkit-align-items: flex-start; align-items: flex-start;} .middle{-webkit-box-align: center; -webkit-align-items: center; align-items: center;} .nobefore::before, .noafter::after{display: none !important;} .noscroll{height: 100vh; overflow: hidden;} @media (max-width: 1680px){ .products-list-wrap{width:100%;} } @media (max-width: 1440px){ .idx-work-item .imgbox{height:270px;} } @media (max-width: 1366px){ .idx-work-item .imgbox{height:250px;} } @media (max-width: 1280px){ .idx-work-item .imgbox{height:230px;} } @media (max-width: 1024px){ .idx-work-item .imgbox{height:190px;} .weui-cell{padding: 10px 20px;} } @media (max-width: 860px){ .idx-work-item .imgbox{height:230px;} } @media (max-width: 760px){ .idx-work-item .imgbox{height:300px;} } @media (max-width: 375px){ .idx-work-item .imgbox{height:215px;} } @media (min-width: 1200px){ .idx-tabs a:hover{color: #224795;} .idx-work-item .imgbox a:hover::after{opacity: 1;} .idx-work-item .imgbox a:hover img{-webkit-transform: scale(1.05,1.05); transform: scale(1.05,1.05); -webkit-transition: transform 0.6s ease 0s} .idx-work-item .weui-cell:hover h4, .idx-work-item .weui-cell:hover .ff-lum{color: #ff1903;} .idx-work-item .weui-cell:hover .more::before{width: 8px; background: #ff1903;} .idx-work-item .weui-cell:hover .more::after{border-left-color: #ff1903;} } @media (max-width: 991px){ .idx-work-item h4{font-size: 20px;} } @media (max-width: 639px){ .idx-work{padding: .6rem 0;} .idx-work-item .col-xs-12{margin-top: .1rem;} .idx-work-item h4{font-size: 18px;} .idx-work-item p{font-size: 14px;} .idx-tabs a{padding: 0 .3rem; font-size: 15px;} .idx-tabs a::before, .idx-tabs a::after{height: 4px;} .idx-tabs a::before{margin-top: -4px} .idx-tabs a::after{margin-top: 2px} } .case_bg{background: #eaeaea; overflow: hidden;} .case_enter{width:1600px; margin:0px auto;} .n_case_list{ min-height:500px;margin-top:40px; margin-bottom:76px;} .n_case_list ul li{width:32%; overflow:hidden; vertical-align:top; display:inline-block; margin-right:1.7%; background:#fff; position:relative;transition:all 0.5s; margin-bottom:2%;} .n_case_list ul li:nth-child(3n+0){ margin-right:0;} .n_case_list ul li:before{content: "";display: block;position: absolute;left: 0%;right: 0%;bottom: 0px;height:2px;opacity: 1;background-color: #dcdcdc;-webkit-transition: all .5s;-o-transition: all .5s;-ms-transition: all .5s;transition: all .5s;} .n_case_list ul li:after{content: "";display: block;position: absolute;left: 0%;right: 100%; bottom: 0px;height:2px;opacity: 0;background-color: #ff1903;-webkit-transition: all .5s;-o-transition: all .5s;-ms-transition: all .5s;transition: all .5s;} .n_case_list ul li:hover:after{left:0%;right: 0%;opacity: 1;} .n_case_list ul li:hover{-webkit-box-shadow: 0 5px 25px rgba(0,0,0,0.1); box-shadow: 0 5px 25px rgba(0,0,0,0.1);-webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } .n_case_list ul li img{height: 100%;width: 100%;-webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1);-webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; transition:all 0.3s ease-out 0s;} .n_case_list ul li .imgs{ overflow:hidden; position:relative;} .n_case_list ul li:hover .imgs img{-webkit-transform:scale(1.02, 1.02); -moz-transform:scale(1.02, 1.02); -o-transform:scale(1.02, 1.02); -ms-transform:scale(1.02, 1.02); transform:scale(1.02, 1.02);} .n_case_list ul li .allist-cnt{ width:96%; margin:0 auto; text-align:center; line-height:32px; padding-top:20px; padding-bottom:20px; height:110px; overflow:hidden;} .n_case_list ul li .allist-cnt h5{ font-weight:normal; font-size:20px; color:#000; line-height:36px; height:36px; overflow:hidden;} .n_case_list ul li .allist-cnt p{line-height:32px; height:32px; overflow:hidden; font-size:16px; color:#666666;} .n_case_list ul li .txts{font-weight: normal; color: #fff; font-size: 16px; line-height: 36px; height: 100%;overflow: hidden; transition: all 0.4s; position: absolute; bottom: -100%;left: 0; width: 100%; background: rgba(0, 0, 0, 0.75); text-align: center;} .n_case_list ul li .txts h2{ color:#fff; font-weight:normal; font-size:24px; height:76px; line-height:76px; overflow:hidden; margin-top:22%;} .n_case_list ul li .txts a{ color:#fff; display:inline-block; width:62px; margin-left:12px; margin-right:12px; font-size:16px;} .n_case_list ul li .txts a i{ width:48px; height:48px; display:block; margin:0 auto;transition:all 0.4s;} .n_case_list ul li .txts a:hover i{ margin-top:-6%; margin-bottom:6%;transform:rotate(360deg);} .n_case_list ul li .txts a i.bgs1{ background:url(/images/i_pic1.png) center top no-repeat;} .n_case_list ul li .txts a i.bgs2{ background:url(/images/i_pic2.png) center top no-repeat;} .n_case_list ul li .txts a i.bgs3{ background:url(/images/i_pic3.png) center top no-repeat;} .n_case_list ul li:hover .txts{ bottom:0;} .case_show_one{ background:#f5f5f5; background-size:50% 100%; overflow:hidden; margin-top:20px; margin-bottom:20px;} .case_show_one .case_show_one_l{ background:#fff; width:50%; float:left; overflow:hidden; min-height:464px;} .case_show_one .case_show_one_l .case_txt{ width:86%; margin:0 auto; overflow:hidden;} .case_show_one .case_show_one_l .case_txt .h2{ margin-top:50px; height:90px; line-height:90px; background:url(../image/case_bg2.jpg) left bottom no-repeat; color:#010000; font-size:30px; font-weight:normal; margin-bottom:33px;} .case_show_one .case_show_one_l .case_txt .divs{ line-height:30px; color:#666666; font-size:16px;} .case_show_one .case_show_one_r .case_txt .ccc{font-size:18px; color:#666666; line-height:48px;} .case_show_one .case_show_one_r{ width:50%; float:right; overflow:hidden;} .case_show_one .case_show_one_r .case_txt{ width:70%; margin:0 auto; overflow:hidden; color:#fff;} .case_show_one .case_show_one_r .h2{ margin-top:50px; height:90px; line-height:90px; background:url(../image/case_bg2.jpg) left bottom no-repeat; color:#010000; font-size:30px; font-weight:normal; margin-bottom:33px;} .case_show_one .case_show_one_r ul li{ font-size:18px; display:block; height:48px;line-height:48px; color:#666666;} .case_show_one .foot_button2{ margin-top:30px;} .case_show_one .foot_button2 li{ width:58px; height:58px;text-align:center; float:left; margin:0 12px;position: relative;} .case_show_one .foot_button2 li img{ width:58px; height:58px;filter:alpha(opacity=70);opacity:0.7;} .case_show_one .foot_button2 li:hover img{filter:alpha(opacity=100);opacity:1.0;} .case_show_one .foot_button2 li .wem3{width: 203px;display: none; color: #363636;text-align: center;padding-top: 215px; position: absolute;left: -70px;top: -200px;background-image: url('http://www.vishining.com/images/2015/ewm.png');background-repeat: no-repeat;} .case_show_one .case_show_one_l .case_txt .fenxiang{ overflow:hidden; text-align:center;margin-top:30px;} .case_show_one .case_show_one_l .case_txt .fenxiang .span{line-height:34px; color:#333333; display:block; font-size:18px;} .case_show_one .case_show_one_l .case_txt .fenxiang .news_fx{ text-align:left; margin-top:3%; margin-bottom:4%;} .case_show_one .case_show_one_l .case_txt .fenxiang .news_fx ul li{ display:inline-block; width:58px; height:58px; overflow:hidden; margin-left:3%; margin-right:3%; background-repeat:no-repeat; background-size:100% 100%; cursor:pointer;} .case_show_one .case_show_one_l .case_txt .fenxiang .news_fx ul li.bgs1{ background-image:url(../image/ico1.png);} .case_show_one .case_show_one_l .case_txt .fenxiang .news_fx ul li.bgs2{ background-image:url(/images/ico2.png);} .case_show_one .case_show_one_l .case_txt .fenxiang .news_fx ul li.bgs3{ background-image:url(../image/ico3.png);} .case_show_one .case_show_one_l .case_txt .fenxiang .news_fx ul li:hover{transition:all 0.3s;opacity:0.9;filter:Alpha(opacity=90);} .case_show_one .case_show_one_l .case_txt .fenxiang .news_fx ul li a{ display:block; width:100%; height:100%;} .case_con{ padding-top:110px;line-height:26px; padding-left:3%; padding-right:3%; font-size:14px; padding-bottom:100px; overflow:hidden; background:#fff;} .case_con img{ /*max-width:1200px;*/ width:100% !important; display:block; margin:0 auto;} .case_t{ height:76px; line-height:76px; margin-top:78px; text-align:center; font-weight:normal; color:#000; font-size:36px;} .ck{width:120px; height:36px; line-height:32px; text-align:center; font-size:16px; display:block; border:#666666 1px solid; color:#666; margin-top:32px;} .ck:hover{color:#ff1903; border:#ff1903 1px solid;} @media (max-width: 1600px){ .case_enter{width:96%;} } @media (max-width: 1024px){ .n_case_list{min-height:inherit; margin-bottom:36px;} .n_case_list ul li{margin-right:1.5%;} .case_con{padding-top:3%; padding-bottom:3%;} .case_t{margin-top:36px;} } @media (max-width: 860px){ .n_case_list ul li{width:100%; margin-right:0%;} } @media (max-width: 720px){ .case_show_one{background:none;} .case_show_one .case_show_one_l , .case_show_one .case_show_one_r{width:100%;} .case_show_one .case_show_one_r{background:#f5f5f5; min-height:464px;} } @media (max-width: 375px){ .case_show_one .case_show_one_l{min-height:inherit; padding-bottom:20px;} .case_show_one .case_show_one_l .case_txt .h2{margin-top:0px; margin-bottom:20px; font-size:20px; height:70px; line-height:70px;} .case_show_one .case_show_one_r .case_txt{width:86%;} .case_show_one .case_show_one_l .case_txt .fenxiang{margin-top:0px;} .case_show_one .case_show_one_r{min-height:inherit; padding-bottom:20px;} .case_show_one .case_show_one_r .h2{margin-top:0px; margin-bottom:10px; font-size:20px; height:70px; line-height:70px;} .case_show_one .case_show_one_r ul li{font-size:16px; height:36px; line-height:36px;} .case_t{margin-top:0px; font-size:20px;} .n_case_list{margin-top:0px; margin-bottom:0px;} .n_case_list ul li{margin-bottom:5%;} .products-boxddd{padding-top:0px !important;} footer .follow .item:nth-child(2){margin: 0 0px; margin-left:30px;} }