@charset "utf-8";.service{position:relative;width:100%;margin:auto;box-sizing:border-box;max-width:1200px;padding:50px 50px;height:auto;overflow:hidden;}
.zsql h1{text-align:center;font-weight:normal;font-size:28px;color:#0C7C98;}
.servi{overflow:hidden;}
.servi ul {width:1680px;position:relative;left:-280px;overflow:hidden;}
.servi ul li{width:280px;box-sizing:border-box;padding:10px;height:auto;float:left;}
.servi ul li a h2{ color:#595959;position:relative;text-align:left;height:45px;line-height:45px;border-bottom:1px solid #e1e1e1;}
.servi ul li a h2:before{content:'';transition:0.5s;position:absolute;left:0;top:100%;width:20px;height:1px;background:#1A171B;}
.servi ul li a:hover h2{color:#1A171B;}
.servi ul li a:hover h2:before{width:100%;transition:0.5s;}
.servi ul li a span{width:100%;margin-top:10px;font-size:12px;color:#848484;display:inline-block;text-align:left;height:30px;line-height:15px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
.jt {display:inline-block;width:auto;height:auto;color:#848484;font-size:50px;font-family:"宋体";text-align:center;line-height:20px;background:#FFFFFF;position:absolute;top:50%;z-index:1;}
.left{left:1%;cursor:pointer;}
.right{right:1%;cursor:pointer;}
.demo{padding:35px 0px;overflow:hidden;}
.demo-list{width:100%;margin:20px 0px;overflow:hidden;}
.demo-list ul{position:relative;height:auto;overflow:hidden;}
.demo-list ul li{width:240px;height:auto;overflow:hidden;box-sizing:border-box;padding:10px;float:left;}
.demo-list a{display:inline-block;width:100%;overflow:hidden;box-sizing:border-box;border:1px solid #eeeeee;}
.demo-list a P{padding:10px 5px 10px 5px;text-align:center;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.demo-tp{width:100%;position:relative;box-sizing:border-box;text-align:center;overflow:hidden;border-bottom:1px solid #eeeeee;}
.demo-tp:before{position:absolute;top:0;opacity:0;left:50%;transform:translate(-50%,-50%);transition:all .6s cubic-bezier(.17, .84, .44, 1) 0s;content:'+';width:50px;height:50px;color:#ffffff;font-size:40px;z-index:1;text-align:center;line-height:40px;border-radius:50%;border:1px solid #ffffff;}
.demo-tp:hover:before{top:50%;opacity:1;transition:all .6s cubic-bezier(.17, .84, .44, 1) 0s;}
.demo-tp img{transition:0.5s;}
.demo-tp:hover img{transform:scale3d(1.2,1.2,1);-webkit-filter:brightness(0.5);transition:0.5s;}

.demo-xz{width:100%;height:auto;padding:10px 0px;text-align:center;}
.demo-gd{display:inline-block;width:60px;border:1px solid #4fb1c9;height:40px;line-height:40px;overflow:hidden;transition:0.5s;background:url(../img/icon_more.png) repeat 0 -9px;}
.demo-gd:hover{background-position:0 -53px;border-color:#1A171B;}
.demo-jtleft{display:inline-block;margin:10px 0px;cursor:pointer;overflow:hidden;transition:0.5s;width:40px;height:20px;background:url(../img/jiantou.png) repeat 0 -49px;}
.demo-jtleft:hover{background-position:0 -70px;transition:0.5s;}
.demo-jtright{display:inline-block;margin:10px 0px 10px 5px;cursor:pointer;transition:0.5s;overflow:hidden;width:40px;height:20px;background:url(../img/jiantou.png) repeat -40px -49px;}
.demo-jtright:hover{background-position:-40px -70px;transition:0.5s;}
/*about*/
.about{width:100%;height:auto;overflow:hidden;background:url(../img/mod-bg.png) repeat-x;background-size:cover;background-attachment:fixed;background-position:0 0%;padding:35px 0px 35px 0px;}
.about-left{width:40%;transition:0.5s;text-align:center;box-sizing:border-box;padding:0px 8px;float:left;}
.about-left img{max-width:100%;height:auto;}
.about-right{width:60%;transition:0.5s;box-sizing:border-box;padding:0px 8px 0px 30px;float:left;}
.about-right h1{color:#0c7c98;font-size:20px;position:relative;padding-bottom:15px;}
.about-right h1:before {content:'';position:absolute;top:33px;left:0;width:70px;height:2px;background-color:#0c7c98;}
.about-content{text-indent:20px;color:#333;width:100%;line-height:25px;display:-webkit-box;margin-bottom:10px;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;font-size:13px;}
.about a{display:inline-block;transition:0.5s;overflow:hidden;width:110px;height:30px;background:url(../img/jiantou.png) no-repeat 5px -97px;border:1px solid #4fb1c9;}
.about a:hover{background-position:5px -127px;transition:0.5s;}

/*视频*/
.video{padding:20px 0px;overflow:hidden;background:url(../img/mod-bg.png) repeat-x;background-size:cover;background-attachment:fixed;background-position:0 0%;}
.video1 h2{text-align:center;font-weight:normal;font-size:28px;padding:10px 0px;color:#0C7C98;}
.video1-left{width:40.8%;float:left;box-sizing:border-box;padding:10px;}
.video1-left a{display:inline-block;width:100%;height:auto;overflow:hidden;position:relative;}
.video1-left1{width:100%;box-sizing:border-box;padding:0px 10px;height:35px;line-height:35px;color:#ffffff;position:absolute;left:0px;bottom:0px;background:rgba(12,124,152,.9);}
.video1-left1 span{float:right;font-family:'宋体';}
.details{width:100%;height:auto;text-align:center;color:#ffffff;background:rgba(12,124,152,.9);position:absolute;bottom:-30px;left:0px;transition:0.5s;}
.video1-left a img{transition:0.5s;}
.video1-left a:hover img{-webkit-filter:brightness(.7);transition:0.5s;}
.video1-right li a:hover .details{bottom:0px;transition:0.5s;}
.details p{width:98%;padding:0px 1%;height:35px;font-size:16px;text-align:center;line-height:35px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.details span{display:inline-block;width:98%;padding:0px 1%;height:25px;font-size:13px;color:#E0E0E0;text-align:center;line-height:25px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.video1-right{width:59.2%;float:left;}
.video1-right li{width:50%;float:left;box-sizing:border-box;padding:10px;}
.video1-right li a{display:inline-block;width:100%;height:auto;overflow:hidden;position:relative;}
.video1-left a i{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;text-align:center;line-height:60px;background:rgba(0,0,0,0.5);border-radius:50%;color:#FFFFFF;font-size:30px;}
.video1-right a i{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;text-align:center;line-height:50px;background:rgba(0,0,0,0.5);border-radius:50%;color:#FFFFFF;font-size:22px;}
.video1-right a img{transition:0.5s;}
.video1-right a:hover img{transform:scale(1.1);transition:0.5s;}
.video1-right a i:hover,.video1-left a i:hover{background:rgba(0,0,0,0.7);}

/*留言板*/
.guestbook{width:100%;overflow:hidden;padding:40px 0px;background:url(../img/bgbj.jpg) repeat-x;background-size:cover;background-attachment:fixed;background-position:0% 0%;}
.guestbook h2{color:#FFFFFF;text-align:center;font-size:25px;font-weight:200;margin-bottom:30px;}
.guestbook-left{width:20%;float:left;color:#ffffff;padding-right:9%;padding-left:1%;}
.guestbook-left h3{font-weight:200;font-size:20px;margin-bottom:10px;}
.guestbook-left p{margin-bottom:10px;line-height:22px;font-size:13px;}
.guestbook-left a{display:inline-block;color:#FFFFFF;padding-right:10px;font-size:22px;}
.guestbook-right{width:70%;float:left;}
.guestbook-right input{width:46%;margin:0px 2% 20px 2%;background:none;border:none;border-bottom:1px solid #ffffff;outline:none;float:left;box-sizing:border-box;padding:5px;font-size:14px;color:#FFFFFF;}
.guestbook-right input::-webkit-input-placeholder{color:#ffffff;}
.guestbook-right textarea{width:96%;height:30px;margin:5px 2% 20px 2%;background:none;border:none;border-bottom:1px solid #ffffff;outline:none;float:left;box-sizing:border-box;padding:5px;font-size:14px;color:#FFFFFF;}
.guestbook-right textarea::-webkit-input-placeholder{color:#ffffff;}
.guestbook-right input.yzm{width:20%;}
/*按钮特效*/
.btn {display:inline-block;margin-bottom:0;font-weight:900;text-align:center;vertical-align:middle;touch-action:manipulation;cursor:pointer;background-image:none;border:1px solid transparent;white-space:nowrap;padding:6px 40px;font-size:16px;line-height:1.5;border-radius:4px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.btn-round.btn-default {color:#0c7c98;background-color:#fff;}
.btn-round.btn-default:before,
.btn-round.btn-default:after {background:#0c7c98;}
.btn-round.btn-default:hover {color:#fff;border-color:#0c7c98;background:#0c7c98;}
.btn-round {position:relative;z-index:1;overflow:hidden;background-color:transparent;transition:.2s;transition-delay:.1s;}
.btn-round:hover {transition-delay:.45s;}
.btn-round:before,
.btn-round:after {position:absolute;top:50%;content:'';width:20px;height:20px;background:#434345;border-radius:50%;transition:0.5s;z-index:-1;}
.btn-round:before {left:-20px;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);}
.btn-round:after {right:-20px;-webkit-transform:translate(50%, -50%);transform:translate(50%, -50%);}
.btn-round:hover:before {-webkit-animation:criss-cross-left 0.8s;animation:criss-cross-left 0.8s;}
.btn-round:hover:after {-webkit-animation:criss-cross-right 0.8s;animation:criss-cross-right 0.8s;}
/** 2.19 Animations Addons */
@-webkit-keyframes criss-cross-left {0% {left:-20px;}
    50% {left:50%;width:20px;height:20px;}
    100% {left:50%;width:375px;height:375px;}
}
@keyframes criss-cross-left {0% {left:-20px;}
    50% {left:50%;width:20px;height:20px;}
    100% {left:50%;width:375px;height:375px;}
}
@-webkit-keyframes criss-cross-right {0% {right:-20px;}
    50% {right:50%;width:20px;height:20px;}
    100% {right:50%;width:375px;height:375px;}
}
@keyframes criss-cross-right {0% {right:-20px;}
    50% {right:50%;width:20px;height:20px;}
    100% {right:50%;width:375px;height:375px;}
}

.card{transition:1s;-webkit-transition:1s;-moz-transition:1s;-o-transition:1s;opacity:0;transform:translate(0px, 20px);-webkit-transform:translate(0px, 20px);-moz-transform:translate(0px, 20px);border:none;background:none;}

@media(max-width:1200px){
.demo-jtleft,.demo-jtright{display:none;}
.demo-list ul li{width:25%;}
}

@media(max-width:1000px){
.guestbook-left{width:30%;float:left;box-sizing:border-box;padding:0px 20px 0px 8px;}		
}

@media(max-width:850px) {
.about-left{width:100%;padding:10px 8px;}
.about-right{width:100%;padding:10px 8px;}
.about-right {text-align:center;}
.about-right span{text-align:left;}
.about-right h1:before{left:50%;transform:translateX(-50%);}
}
@media(max-width:650px){
.guestbook-left{width:100%;box-sizing:border-box;padding:10px;}
.guestbook-right{width:100%;padding-top:20px;}
.demo-list ul li{width:50%;}
}
@media(max-width:600px) {
.video1-left{width:100%;}
.video1-right{width:100%;}
}
@media(max-width:550px){
.video1-left{width:100%;}
.video1-right{width:100%;}
}
@media(max-width:400px){
.video1-right li{width:100%;}
}