/* CSS Document */body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,a strong,td,img {margin:0px;padding:0px;font-family:"微软雅黑";}
.iconfont {font-family:"iconfont" !important;font-style:normal;-webkit-font-smoothing:antialiased;-webkit-text-stroke-width:0.2px;-moz-osx-font-smoothing:grayscale;}
@font-face {font-family:'iconfont';/* project id："177684" */  src:url('../t/font_dnoogy9k8qe0cnmi.eot');src:url('../t/font_dnoogy9k8qe0cnmi.eot') format('embedded-opentype'),url('../t/font_dnoogy9k8qe0cnmi.woff') format('woff'),url('../t/font_dnoogy9k8qe0cnmi.ttf') format('truetype'),url('../t/font_dnoogy9k8qe0cnmi.svg') format('svg');}
img {border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;font-size:0px;}
h1,h2,h3,h4,h5,p,ul,li,a img,span,a {overflow:hidden;}
body {background-color:#f2f2f2;}

/*出厂动画*/
.animation {visibility:hidden;opacity:0}
.fadel,.fader,.fadeup,.fadez {visibility:visible}
.fadeup {animation:slideInUp ease-out .6s forwards;-webkit-animation:slideInUp ease-out .6s forwards}
@keyframes slideInUp {from {transform:translate3d(0,50%,0)}
to {opacity:1;transform:none}
}
@-webkit-keyframes fadeInUp {from {-webkit-transform:translate3d(0,50%,0)}
to {opacity:1;-webkit-transform:none}
}
.fadel {animation:slideInLeft ease-out .6s forwards;-webkit-animation:slideInLeft ease-out .6s forwards}
@keyframes slideInLeft {from {transform:translate3d(-50%,0,0)}
to {opacity:1;transform:none}
}
@-webkit-keyframes slideInLeft {from {-webkit-transform:translate3d(-50%,0,0)}
to {opacity:1;-webkit-transform:none}
}
.fader {animation:slideInRight ease-out .6s forwards;-webkit-animation:slideInRight ease-out .6s forwards}
@keyframes slideInRight {from {transform:translate3d(50%,0,0)}
to {opacity:1;transform:none}
}
@-webkit-keyframes slideInRight {from {-webkit-transform:translate3d(50%,0,0)}
to {opacity:1;-webkit-transform:none}
}
.fadez {animation:zoomIn ease-out .6s forwards;-webkit-animation:zoomIn ease-out .6s forwards}
@keyframes zoomIn {from {transform:scale3d(.3,.3,.3)}
to {opacity:1;transform:none}
}
@-webkit-keyframes zoomIn {from {-webkit-transform:scale3d(.3,.3,.3)}
to {opacity:1;-webkit-transform:none}
}
.website_banner {/*width:100%;height:400px;position:relative;overflow:hidden;background-color:#014886;background:url(../images/banner.jpg) no-repeat center center;*//*background-image:-webkit-radial-gradient(ellipse farthest-corner at center top,#1b4fb4 0%,#1a5e8f 100%);background-image:radial-gradient(ellipse farthest-corner at center top,#1b4fb4 0%,#1a5e8f 100%);*/  /*cursor:move;*/}
@media screen and (max-width:768px) {
.website_banner{ height:250px;}
}
	
canvas {top:0px;left:0px;width:100%;height:100%;z-index:0;position:absolute;}
#C {}
.C_t {width:100%;overflow:hidden;text-align:center;padding-top:100px;}
.C_t h2 {font-size:38px;line-height:50px;color:#fff;width:100%;letter-spacing:5px;overflow:hidden;height:50px;text-align:center;margin:20px 0;}
.C_t p {font-size:16px;line-height:30px;color:#999;width:100%;text-indent:20;text-align:center;font-weight:normal;position:relative;z-index:2;}
.C_t p::after {content:" ";position:absolute;width:100%;left:0;bottom:14px;height:1px;background-color:#ccc;z-index:-2;}
.C_t p::before {content:" ";position:absolute;width:160px;left:50%;margin-left:-80px;bottom:0;height:20px;background-color:#f2f2f2;z-index:-1;}
.C_p {margin:0 auto;max-width:1440px;}
.C_p ul {text-align:left;font-size:0px;padding-bottom:2%;padding-top:0px;margin:0 -15px;}
.C_p ul li { margin:1%; font-size:14px;vertical-align:top;display:inline-block;width:31.3%;position:relative;text-align:center;-moz-box-shadow:0px 0px 6px #999; -webkit-box-shadow:0px 0px 6px #999; box-shadow:0px 0px 6px #999;}
.C_p ul li:hover {transform:translateY(0);box-shadow:0 0 0 transparent;transition:box-shadow .3s cubic-bezier(.215,.61,.355,1),transform .3s cubic-bezier(.215,.61,.355,1);box-shadow:0 8px 24px rgba(163,177,191,.35);}
.C_p ul li .C_pbox {/*margin:20px 20px 0 20px;*/height:350px;position:relative;background-color:#eee;padding:10px;overflow:hidden;/*border:10px solid #fff;*/transition:ease all 0.5s;-webkit-transition:ease all 0.5s;-moz-transition:ease all 0.5s;-o-transition:ease all 0.5s;}
.C_p ul li .C_pbox::after {transition:opacity .5s ease 0s,transform .5s ease 0s;content:'';border-left:10px solid #0068b7;border-right:10px solid #0068b7;transform:scale(1,0);-webkit-transform:scale(1,0);opacity:0;position:absolute;width:100%;height:100%;top:0;left:0;bottom:0;box-sizing:border-box;position:absolute;}
.C_p ul li .C_pbox::before {transition:opacity .5s ease 0s,transform .5s ease 0s;content:'';position:absolute;bottom:0;width:100%;height:100%;top:0;left:0;opacity:0;border-top:10px solid #0068b7;border-bottom:10px solid #0068b7;transform:scale(0,1);-webkit-transform:scale(0,1);box-sizing:border-box;z-index:2;}
.C_p ul li .C_pbox:hover::before,.C_p ul li .C_pbox:hover::after {opacity:1;transform:scale(1);-webkit-transform:scale(1);}
.C_p ul li .C_pbox img {max-width:100%;}
.C_p ul li a h3 {font-size:16px;line-height:40px;color:#333;text-decoration:none;font-weight:normal;text-align:center;transition:background 1s;background-color:#ddd;padding:5px;/*margin:0 20px;*/}
.C_p ul li a:hover h3 {color:#0068b7;}
.C_p ul li a {text-decoration:none;display:block;}
.select-style {padding:10px 20px;text-align:center;}
.select-style a {color:#fff;font-size:14px;background-color:#0aafcb;border:1px solid #0aafcb;display:inline-block;border-radius:2px;padding:10px 20px;line-height:20px;-moz-transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out;-ms-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.select-style a:hover {background-color:#666;border:1px solid #666;}
@media screen and (max-width:768px) {
.C_t { padding-top:50px;}
.C_p ul li {width:50%;}
}
/*行业分类*/
.category {padding-bottom:5px;text-align:center;margin-top:15px;}
.category em {font-size:20px;text-transform:uppercase;font-style:normal;font-weight:bold;color:#0068b7;}
.category.db {display:block;}
.category ul {padding-bottom:0;}
.category ul li {display:inline-block;margin:0 10px;margin-top:10px;float:left;width:8.6%;padding-bottom:0;box-shadow: 0px 0px 0px #333333;}
.category ul li a {display:block;height:30px;line-height:30px;padding:0 10px;font-size:13px;/*border-radius:5px;*/border:1px solid #eee;position:relative;color:#333; background:#eee;}
.category ul li:hover a {color:#fff;border-color:#0068b7;background:#0068b7;transition:all .3s;-webkit-transition:all .3s;}
.category ul li.cur a {color:#fff;border-color:#0068b7;background:#0068b7;}
.category ul li a i {z-index:1;position:relative;font-style:normal;}
.category ul li a::after {position:absolute;content:'';top:0;left:0;width:0;height:100%;background:#0068b7;transition:all .4s;-webkit-transition:all .4s;}
.category ul li a:hover::after {width:100%;border-color:#ea4234;}
.category ul li:hover {box-shadow:0 0 0 rgba(163,177,191,.35);}
@media screen and (max-width:768px) {
.category em{ display:none;}
.category ul li { display:none;}	
}
/*turn page*/
#page {text-align:center;line-height:35px;clear:both;padding-top:20px;padding-bottom:20px;}
#page span {display:inline-block;*display:inline;*zoom:1;font-size:14px;height:33px;line-height:33px;overflow:hidden;background:#fff;vertical-align:top;border-radius:4px;-ms-border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;margin:5px;color:#999;}
#page span em {width:7px;height:12px;display:inline-block;vertical-align:middle;margin-top:-2px;}
#page font,#page a {height:33px;display:block;text-align:center;text-decoration:none;padding-right:13px;padding-left:13px;transition:ease all 0.5s;-webkit-transition:ease all 0.5s;-moz-transition:ease all 0.5s;-o-transition:ease all 0.5s;}
#page font {background-color:#0068b7;color:#FFF;}
#page a {background-color:#ddd;color:#333;}
#page a:hover {background-color:#666;color:#FFF;}
/*模板详情*/
.title-net {position:absolute;left:4%;bottom:65px;color:#fff;}
.title-net .on1 {font-size:20px;margin-bottom:10px;}
.title-net .on1 a {color:#fff;text-decoration:none;}
.title-net .on1 a:hover {color:#ec4033;text-decoration:underline;}
.title-net .on2 {font-size:48px;font-weight:bold;}
@media screen and (max-width:768px) {
.title-net{ bottom:20px;}
.title-net .on1{font-size:16px; margin-bottom:0;}
.title-net .on2{ font-size:30px;}	
}
.ny-colt {padding:20px 4%;font-size:16px;text-align:center;}
.ny-colt .tils {color:#0068b7;line-height:2;display:inline-block;font-size:18px;font-weight:bold; margin-bottom:10px;}
.ny-colt .linkc {display:block;margin-top:40px;background:#0068b7;font-size:16px;width:150px;height:40px;line-height:40px;color:#fff;text-align:center;border-radius:10px;}
.ny-colt .linkc img {margin-left:12px;}
.ny-colt .linkc span {display:inline-block;position:relative;}
.ny-colt .linkc span i {position:absolute;left:0;bottom:0;width:0;height:1px;background:#333;transition:all 0.3s linear;}
.ny-colt .linkc:hover span i {width:100%;transition:all 0.3s linear;}
.ny-colt ul {display:inline-block;}
.ny-colt ul li {float:left;width:auto;padding:5px 20px;margin-right:10px; margin-bottom:10px; text-align:center;font-size:16px;color:#666;height:25px;line-height:25px;background:#eee;border-radius:5px;}
.net-show {padding:60px 4%;}
.mainst {border-bottom:1px solid #ddd;border-top:1px solid #ddd;padding:50px 0;}
.prev-next {padding-top:50px;}
.prev-next a {display:inline-block;line-height:25px;}
.prev-next a span {display:inline-block;position:relative;}
.prev-next a span i {position:absolute;width:0;bottom:0;background:#333;height:1px;transition:all 0.5s ease;}
.prev-next a span:hover i {width:100%;transition:all 0.5s ease;}
.prev-next a.fl img {margin-right:10px;}
.prev-next a.fr img {margin-left:10px;}
.prev-next a.fl span i {right:0;}
.prev-next a.fr span i {left:0;}
.close-nav {display:none;}
.Top-indx {position:relative;width:100%;}
.Top-indx .nav {position:absolute;left:0;top:20px;line-height:25px;padding:0 4%;width:100%;}
.Top-indx .nav li {float:left;margin-right:20px;}
.Top-indx .nav li a {display:inline-block;position:relative;color:#fff;}
.Top-indx .nav li a span {height:1px;background:#fff;width:0;left:50%;position:absolute;bottom:0;transition:all 0.3s ease;}
.Top-indx .nav li a:hover span {width:100%;left:0;transition:all 0.5s ease;}
.Top-indx .pic img{width: 100%; border-width: 0px;}
/*按钮*/
.rel {position:relative;}
.i-more {margin-top:20px;}
.i-more a {position:relative;padding:0 1rem;height:40px;line-height:40px;display:inline-block;background:#ec4033;color:#fff;text-decoration:none;}
.i-more a::after {position:absolute;content:'';top:0;left:0;width:0;height:100%;background:#ec4033;transition:all .4s;-webkit-transition:all .4s;}
.i-more a:hover {color:#fff;border:0;}
.i-more a:hover::after {width:100%;border-color:#0068b7;}
.i-more a i {z-index:1;font-style:normal;}
@media screen and (max-width:768px) {.i-more {text-align:center;}
.i-more a {position:relative;border:1px solid #ddd;padding:0 .3rem;height:40px;line-height:40px;color:#fff;}
}
.r {position:relative;top:16px;width:130px;height:45px;z-index:2;-webkit-animation:bounce .6s cubic-bezier(.68,.06,.68,.42) infinite alternate;animation:bounce .6s cubic-bezier(.68,.06,.68,.42) infinite alternate;margin:0 auto;}
@media screen and (max-width:768px) {
.r { padding-top:0; margin-bottom:30px;}	
}
@-webkit-keyframes bounce {0%,10% {top:16px;-webkit-transform:scaleX(1) scaleY(1.1);transform:scaleX(1) scaleY(1.1);}
100% {top:20px;-webkit-transform:scaleX(1.1) scaleY(1);transform:scaleX(1.1) scaleY(1);}
}
@keyframes bounce {0%,10% {top:16px;-webkit-transform:scaleX(1) scaleY(1.1);transform:scaleX(1) scaleY(1.1);}
100% {top:20px;-webkit-transform:scaleX(1.1) scaleY(1);transform:scaleX(1.1) scaleY(1);}
}
.shadow {position:relative;top:0px;margin:0 auto;border-radius:50%;width:50px;height:68px;background-color:#777;-webkit-animation:fade .6s cubic-bezier(.38,.06,.38,.42) infinite alternate;animation:fade .6s cubic-bezier(.38,.06,.38,.42) infinite alternate;}
@-webkit-keyframes fade {0%,40% {opacity:0;width:0px;height:0px;}
100% {opacity:0.4;width:50px;height:10px;-webkit-filter:blur(2px);filter:blur(2px);}
}
@keyframes fade {0%,40% {opacity:0;width:0px;height:0px;}
100% {opacity:0.4;width:50px;height:10px;-webkit-filter:blur(2px);filter:blur(2px);}
}
.preview_btn{ margin-top:10px;}
.view_btn {padding:0 1rem;height:40px;line-height:40px;display:inline-block;background:#0068b7;color:#fff;text-decoration:none;margin-left:10px;margin-right:10px;}
.view_btn:hover {background:#ec4033;}
.return_btn {padding:0 1rem;height:40px;line-height:40px;display:inline-block;background:#999;color:#fff;text-decoration:none;margin-left:40px;margin-right:10px;font-size:14px;font-style:italic;}
.return_btn:hover{background: #ec4033;}
/*案例介绍*/
.pr {position:relative;}
.hd-detail__ani >div.pr {margin:auto 0;width:100%;overflow:hidden;}
.hd-detail__ani >div.pr img {max-width:100%;display:block;}
.hd-detail__ani >div >div.pb {left:14.75%;top:9%;right:15.6%;height:77%;overflow:hidden;border-radius:.34rem .34rem 0 0;-webkit-border-radius:.36rem .36rem 0 0;}
.hd-detail__ani >div >div.pb img {width:100%;}
.pb {position:absolute;}
.iphone {position:relative;}
.hd-detail__ani >div.iphone {margin:auto 0;width:100%;overflow:hidden;}
.hd-detail__ani >div.iphone img {max-width:100%;display:block; margin:0 auto;}
.iphone >div >div.pb {left: 40.4%; top:6%; right: 15.6%; height: 90%; overflow: hidden; width: 397px; border-radius:40px;}
.iphone >div >div.pb img {width:100%;}
.iphone >div #contentFrame{ width: 411px; height: 100%;}
@media screen and (max-width:1800px){
.iphone >div >div.pb{ width:370px; background: #fff;}	
.iphone >div #contentFrame{ width:388px;}
}
@media screen and (max-width:1700px){
.iphone >div >div.pb{ width:333px; background: #fff;}	
.iphone >div #contentFrame{ width:350pxp;}
}
@media screen and (max-width:1600px){
.iphone >div >div.pb{ width:333px; background: #fff;}
.iphone >div #contentFrame{ width:351px;}	
}
@media screen and (max-width:1530px){
.iphone >div >div.pb{ width:313px;background: #fff;}
.iphone >div #contentFrame{ width:330px;}	
}
@media screen and (max-width:1400px){
.iphone >div >div.pb{ width:285px;background: #fff;}
.iphone >div #contentFrame{ width:305px;}	
}
@media screen and (max-width:1300px){
.iphone >div >div.pb{ width:265px;background: #fff;}
.iphone >div #contentFrame{ width:280px}	
}
@media screen and (max-width:1200px){
.iphone >div >div.pb{ width:245px;background: #fff;}
.iphone >div #contentFrame{ width:260px;}	
}
/*返回顶部*/
.scroll {width:50px;height:50px;color:#fff;text-align:center;position:fixed;right:30px;bottom:100px;cursor:pointer;font-size:30px;background-color:rgba(0,0,0,0.5);border-radius:5px;}
/*电脑端预览*/
.btn_pc_out{display:block;position:absolute;z-index:9;top:10%;left:0;width:100%;text-align:center;opacity:0;-moz-transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out;-ms-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.C_p ul li:hover .btn_pc_out{top:130px; opacity: 0.8;}
.i-pc-btn {display:inline-block!important;height:38px;line-height:38px;background-color:#0068b7;border:1px solid #0068b7;background-color:#0068b7\9;color:#fff;text-align:center;font-size:14px;margin-top:8px;margin-bottom:8px;padding:0 20px 0 20px;min-width:75px;-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;cursor:pointer;border-radius:2px;letter-spacing:2px;position:relative;}
.i-pc-btn::before {/*font-family:"iconfont" !important;content:" \e601";position:absolute;font-size:24px;top:-1px;left:20px;*/}
.i-pc-btn:hover {background-color:#333;border:1px solid #333;background-color:#333;}
/*手机端预览*/
.app-demo-body {display:none;}
.app-demo-body,.app-demo-mask {width:100%;position:absolute;left:0;top:0;bottom:0;z-index:100001;}
.app-demo-mask {background-color:#000;opacity:0.6;filter:alpha(opacity=60);}
.app-demo-wrap {width:340px;height:auto;padding:103px 27px 116px 33px;background:url(../images/iphone.png) 0 0 no-repeat;z-index:100002;position:absolute;left:50%;margin-left:-200px;top:50%;}
.app-demo-wrap iframe {/*background:#fff url(../images/loading.gif) center no-repeat;*/overflow-x:hidden;overflow-y:auto;height:540px;}
.C_p ul li:hover .btn_out {top:190px;opacity:0.8;}
.btn_out {display:block;position:absolute;z-index:9;top:10%;left:0;width:100%;text-align:center;opacity:0;-moz-transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out;-ms-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.i-btn {display:inline-block!important;height:38px;line-height:38px;background-color:#0068b7;border:1px solid #0068b7;background-color:#0068b7\9;color:#fff;text-align:center;font-size:14px;margin-top:8px;margin-bottom:8px;padding:0 20px 0 20px;min-width:75px;-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;cursor:pointer;border-radius:2px;letter-spacing:2px;position:relative;}
.i-btn::before {/*font-family:"iconfont" !important;content:" \e601";position:absolute;font-size:24px;top:-1px;left:20px;*/}
.i-btn:hover {background-color:#333;border:1px solid #333;background-color:#333;}
.ico-box {position:absolute;left:50%;width:30px;height:30px;border-radius:50%;overflow:hidden;margin-left:200px;text-align:center;line-height:30px;background-color:white;z-index:999999999;top:10%;cursor:pointer}
.ico-box i {width:100%;height:100%;display:block;}
/*平板端预览*/
.pad-demo-body {display:none;}
.pad-demo-body,.pad-demo-mask {width:100%;position:absolute;left:0;top:0;bottom:0;z-index:100001;}
.pad-demo-mask {background-color:#000;opacity:0.6;filter:alpha(opacity=60);}
.pad-demo-wrap {width:100%;height:auto;z-index:100002;position:absolute;left:0;top:0;text-align:center;}
.pad-demo-wrap iframe {margin-top:20px;width:90%;max-width:1024px;margin:auto;padding:77px 105px 77px 105px;background:url(../images/pad.png) 0 0 no-repeat;overflow-x:hidden;overflow-y:auto;height:768px;display:inline-block;background-size:100%;}
.i-btn.i-btn-pad {margin-left:13px;}
.pad-demo-body .ico-box {left:69%;}
@media screen and (max-width:1320px) {
.C_p ul li .C_pbox {margin:15px 15px 0 15px;}
.C_p ul li a h3 {margin:0 15px;}
}
@media screen and (max-width:900px) {
.C_p ul li {width:50%;}
.category ul li{ display:none;}
.category em{ display:none;}
}
@media screen and (max-width:520px) {
.C_p ul li {width:100%;}
}
/*页面底部波浪纹*/::selection {background-color:salmon;color:white;}
.parallax > use {animation:move-forever 12s linear infinite;}
.parallax > use:nth-child(1) {animation-delay:-2s;}
.parallax > use:nth-child(2) {animation-delay:-2s;animation-duration:5s;}
.parallax > use:nth-child(3) {animation-delay:-4s;animation-duration:3s;}
@keyframes move-forever {0% {transform:translate(-90px,0%);}
100% {transform:translate(85px,0%);}
}
.editorial {display:block;width:100%;height:10em;max-height:100vh;margin:0;}
.wave {margin:0;max-height:100px;overflow:hidden;padding:2em 0 0 0;}
@media (max-width:50em) {.content h1 {font-size:12vmax;}
.editorial {height:17vw;}
}
/*分页符2*/.paginator {text-align:center;overflow:hidden;}
.paginator span {font-size:12px;line-height:32px;background-image:url(/images/buttons.png);background-repeat:repeat-x;background-position:0px -228px;color:#fff;display:inline-block;margin-right:3px;padding-right:10px;padding-left:10px;border:1px solid #dc1516;border-radius:2px;margin-left:3px;}
.paginator a {font-size:12px;line-height:32px;background-image:url(/images/buttons.png);background-repeat:repeat-x;background-position:0px 0px;color:#666;display:inline-block;margin-right:3px;padding-right:10px;padding-left:10px;border:1px solid #cdcdcd;border-radius:2px;margin-left:3px;}
.paginator a:hover {background-position:0px -228px;color:#fff;border:1px solid #dc1516;}
.paginator.blue {margin-bottom:50px;}
.paginator.blue span {color:#fff;padding:0 15px;border-radius:4px;background:none;border:1px solid #2092ea;background-color:#2092ea;}
.paginator.blue a {color:#666;padding:0 15px;border-radius:4px;background:none;border:1px solid #ccc;background-color:#fff;text-decoration:none;}
.paginator.blue a:hover {color:#fff;border:1px solid #666;background-color:#666;}