@charset "utf-8";
.fix{clear:both;height: 1px;font-size: 0px;}
html{overflow-x:hidden;}
/*背景特效*/
@-webkit-keyframes orbloop {
  from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}
}
@keyframes orbloop {
  from {transform: rotate(0deg);}
  to {transform: rotate(360deg);}
}
@-webkit-keyframes orbmove {
  from {-webkit-transform: translateX(-1000px);}
  to {-webkit-transform: translateX(2000px);}
}
@keyframes orbmove {
  from {transform: translateX(-1000px);}
  to {transform: translateX(2000px);}
}
#bg {
  position: fixed;
  width: 1000px;
  height: 1000px;
  top: 50%;
  left: 50%;
  margin-left: -500px;
  margin-top: -500px;
}
#bg div div {
  position: absolute;
}
#bg {
  opacity: 0;
}
#bg .row1 div {
  -webkit-animation: orbmove 48s linear infinite;
  animation: orbmove 96s linear infinite;
}
#bg .row1 .orb1 {
  position: absolute;
  width: 60px;
  height: 60px;
  top: 50%;
  left: 50%;
  margin-left: -30px;
  margin-top: -380px;
}
#bg .row1 .orb1 div {
  width: 100%;
  height: 100%;
  border-radius: 60px;
  background: -webkit-linear-gradient(top, #ffffff, #dedede);
  background: linear-gradient(to bottom, #ffffff, #dedede);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row1 .orb2 {
  position: absolute;
  width: 100px;
  height: 100px;
  top: 50%;
  left: 50%;
  margin-left: 450px;
  margin-top: 50px;
}
#bg .row1 .orb2 div {
  width: 100%;
  height: 100%;
  border-radius: 100px;
  background: -webkit-linear-gradient(top, #ffffff, #dedede);
  background: linear-gradient(to bottom, #ffffff, #dedede);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row1 .orb1c {
  position: absolute;
  width: 60px;
  height: 60px;
  top: 50%;
  left: 50%;
  margin-left: 1970px;
  margin-top: -380px;
}
#bg .row1 .orb1c div {
  width: 100%;
  height: 100%;
  border-radius: 60px;
  background: -webkit-linear-gradient(top, #ffffff, #dedede);
  background: linear-gradient(to bottom, #ffffff, #dedede);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row1 .orb2c {
  position: absolute;
  width: 100px;
  height: 100px;
  top: 50%;
  left: 50%;
  margin-left: 2450px;
  margin-top: 50px;
}
#bg .row1 .orb2c div {
  width: 100%;
  height: 100%;
  border-radius: 100px;
  background: -webkit-linear-gradient(top, #ffffff, #dedede);
  background: linear-gradient(to bottom, #ffffff, #dedede);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row2 div {
  -webkit-animation: orbmove 24s linear infinite;
  animation: orbmove 48s linear infinite;
}
#bg .row2 .orb1 {
  position: absolute;
  width: 200px;
  height: 200px;
  top: 50%;
  left: 50%;
  margin-left: -500px;
  margin-top: -300px;
}
#bg .row2 .orb1 div {
  width: 100%;
  height: 100%;
  border-radius: 200px;
  background: -webkit-linear-gradient(top, #ffffff, #dedede);
  background: linear-gradient(to bottom, #ffffff, #dedede);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row2 .orb2 {
  position: absolute;
  width: 250px;
  height: 250px;
  top: 50%;
  left: 50%;
  margin-left: 175px;
  margin-top: -125px;
}
#bg .row2 .orb2 div {
  width: 100%;
  height: 100%;
  border-radius: 250px;
  background: -webkit-linear-gradient(top, #ffffff, #dedede);
  background: linear-gradient(to bottom, #ffffff, #dedede);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row2 .orb1c {
  position: absolute;
  width: 200px;
  height: 200px;
  top: 50%;
  left: 50%;
  margin-left: 1500px;
  margin-top: -300px;
}
#bg .row2 .orb1c div {
  width: 100%;
  height: 100%;
  border-radius: 200px;
  background: -webkit-linear-gradient(top, #ffffff, #dedede);
  background: linear-gradient(to bottom, #ffffff, #dedede);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row2 .orb2c {
  position: absolute;
  width: 400px;
  height: 400px;
  top: 50%;
  left: 50%;
  margin-left: 2100px;
  margin-top: -200px;
}
#bg .row2 .orb2c div {
  width: 100%;
  height: 100%;
  border-radius: 400px;
  background: -webkit-linear-gradient(top, #ffffff, #dedede);
  background: linear-gradient(to bottom, #ffffff, #dedede);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row3 div {
  -webkit-animation: orbmove 12s linear infinite;
  animation: orbmove 24s linear infinite;
}
#bg .row3 .orb1 {
  position: absolute;
  width: 300px;
  height: 300px;
  top: 50%;
  left: 50%;
  margin-left: 850px;
  margin-top: -300px;
}
#bg .row3 .orb1 div {
  width: 100%;
  height: 100%;
  border-radius: 300px;
  background: -webkit-linear-gradient(top, #dedede, #ffffff);
  background: linear-gradient(to bottom, #dedede, #ffffff);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row3 .orb2 {
  position: absolute;
  width: 600px;
  height: 600px;
  top: 50%;
  left: 50%;
  margin-left: 0px;
  margin-top: 0px;
}
#bg .row3 .orb2 div {
  width: 100%;
  height: 100%;
  border-radius: 600px;
  background: -webkit-linear-gradient(top, #dedede, #ffffff);
  background: linear-gradient(to bottom, #dedede, #ffffff);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row3 .orb1c {
  position: absolute;
  width: 300px;
  height: 300px;
  top: 50%;
  left: 50%;
  margin-left: 2850px;
  margin-top: -300px;
}
#bg .row3 .orb1c div {
  width: 100%;
  height: 100%;
  border-radius: 300px;
  background: -webkit-linear-gradient(top, #dedede, #ffffff);
  background: linear-gradient(to bottom, #dedede, #ffffff);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}
#bg .row3 .orb2c {
  position: absolute;
  width: 600px;
  height: 600px;
  top: 50%;
  left: 50%;
  margin-left: 2000px;
  margin-top: 0px;
}
#bg .row3 .orb2c div {
  width: 100%;
  height: 100%;
  border-radius: 600px;
  background: -webkit-linear-gradient(top, #dedede, #ffffff);
  background: linear-gradient(to bottom, #dedede, #ffffff);
  -webkit-animation: orbloop 6s linear infinite;
  animation: orbloop 6s linear infinite;
}


@font-face{font-family: 造字工房典黑（非商用）超粗体;
src: url('https://images.qijishow.com/造字工房典黑粗体.otf')}
@font-face{font-family: 造字工房典黑（非商用）超细体;
src: url('https://images.qijishow.com/造字工房典黑超细体.otf')}
@font-face{font-family: BrandonText-Black;
src: url('../font/BrandonText-Black.otf')}
@-webkit-keyframes title{0%{opacity: 0;-webkit-transform: translateX(60px);}100%{opacity: 1;-webkit-transform: translateX(0);}}
@keyframes title{0%{opacity: 0;transform: translateX(60px);}100%{opacity: 1;transform: translateX(0);}}
.scroll-down{display: block;z-index: 100;width: 20px;left: 4px;height: 47px;background-image: url(../images/page2.gif);    margin: auto;background-size: 19px 39px;background-repeat: no-repeat;}
.hidden{text-indent: -9999px; visibility: hidden; display: none;}
#ban{background-color: #ff2424; color: #ffffff; border-radius: 22px; text-align: center; width: 100px; font-size: 12px; font-weight: 400; margin-bottom: 10px; padding: 7px; margin-top: 19px; float: left;}
.slogan_k{margin-right: auto;margin-left: auto;height: 100%;width: 100%;z-index: 1200;/* top: 120px; */padding-top: 120px;padding-bottom: 120px;}
.slogan_k dl{margin: auto;}
.slogan_k dd.wz1{color: #ffc500; -webkit-animation: 'title' 2s 1; height: 100px;

font-family:"造字工房典黑（非商用）超粗体";
letter-spacing: 11px;
    padding-bottom: 35px;
    font-size: 95px;
    color: #333;
    text-align: center;

 /*background-image: url(../images/zs_logo.svg); */background-size: 315px 95px; background-repeat: no-repeat;}
.slogan_k dd.wz2{-webkit-animation: 'title' 3s 1; height: 100px; 
    font-family: "造字工房典黑（非商用）超细体";
    font-size: 76px;
    color: #333;
    text-align: center;
    -webkit-animation: 'title' 3s 1;
    margin-bottom: 20px;
 background-size: 475px 95px; background-repeat: no-repeat;margin: auto;}
.slogan_k dd.wz3{height: 38px;padding-top: 150px;}
.slogan_k dd.wz4{-webkit-animation: 'title' 4.2s 1; width: 480px; height: 100px;
    font-family: "造字工房典黑（非商用）超细体";
    font-size: 80px;
    color: #333;
    text-align: center;
    -webkit-animation: 'title' 3s 1;
 background-size: 475px 95px; background-repeat: no-repeat;}

.service_2{width: 100%;padding-bottom: 60px;}
.service_k{
    width: 90%;
    margin: auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    }
.service_mf{
    width: 48.7%;
    padding: 7px;
    grid-gap: inherit;
    }
.service_mf a{    padding-bottom: 20px;text-decoration: none;display: block;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);transform: rotate(0deg);font-size: 30px;color: #111;padding-top: 30px;padding-left: 35px;padding-right: 35px;background-color: #ffffffe6;height: 200px;border-radius: 10px;}

.service_mf a:hover { text-decoration: none; background-color: #FFCE00; font-size: 40px; color: #000; }

#background2:hover { text-decoration: none; background-color:#3ee28e; font-size: 40px; color: #000; }

#background3:hover { text-decoration: none; background-color:#e6ebf2; font-size: 40px; color: #000; }

#background4:hover { text-decoration: none; background-color:#5cb8ff; font-size: 40px; color: #000; }

.service_mf a.cart:hover #ban{background-color: #000000 !important;color: #ffffff !important;}

.service_mf a.cart:hover .pic{opacity: 1; -webkit-transform: translateY(-10px);}
.service_mf .cart .pic{opacity: 0;position: absolute;right: 65px;top: 56px;width: 120px;height: 0px;background: url(../images/zl_weixin.png);background-size: 120px 140px;border-radius: 10px;padding-top: 140px; text-align: center;font-size: 12px; transition: all .7s ease;}

.service_mf .cart .pic2{opacity: 0;position: absolute;right: 65px;top: 56px;width: 120px;height: 0px;background: url(../images/cq_weixin.png);background-size: 120px 140px;border-radius: 10px;padding-top: 140px; text-align: center;font-size: 12px; transition: all .7s ease;}
.service_mf a.cart:hover .pic2{opacity: 1; -webkit-transform: translateY(-10px);}

.service_mf .cart .pic3{opacity: 0;position: absolute;right: 65px;top: 56px;width: 120px;height: 0px;background: url(../images/xinxi_weixin.png);background-size: 120px 140px;border-radius: 10px;padding-top: 140px; text-align: center;font-size: 12px; transition: all .7s ease;}
.service_mf a.cart:hover .pic3{opacity: 1; -webkit-transform: translateY(-10px);}

.service_mf .cart .pic4{opacity: 0;position: absolute;right: 65px;top: 56px;width: 120px;height: 0px;background: url(../images/youh_weixin.png);background-size: 120px 140px;border-radius: 10px;padding-top: 140px; text-align: center;font-size: 12px; transition: all .7s ease;}
.service_mf a.cart:hover .pic4{opacity: 1; -webkit-transform: translateY(-10px);}

.contact_w{width: 90%; margin: auto;}
.contact_2{width: 100%;}
.contact_k{height: 50px;}
.contact_k dd.wz1{font-family: "造字工房典黑（非商用）超细体";font-size: 36px;color: #000000;text-align: center;}
.contact_k dd.email{font-family: "微软雅黑";font-size: 16px;color: #333;line-height: 38px;float: left;margin-right: 30px;border-radius: 20px;}
.contact_k dd.email a{color: #000000;text-indent: 50px;font-weight:bold;text-decoration: none;padding-right: 30px;border-radius: 20px;height: 38px;display: block;background-color: #ffffff;background-image: url(../images/contact_email.svg);background-repeat: no-repeat;background-position: 18px center;background-size: 15px 12px;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);transform:rotate(0deg);}
.contact_k dd.email a:hover{background-color: rgba(255,255,255,0.7);text-decoration: none;box-shadow: 0 4px 20px rgba(3,3,3,.1);transform:translateY(-5px);}
.contact_k dd.phone{font-family: "微软雅黑";font-size: 16px;color: #333;line-height: 38px;float: left;margin-right: 30px;border-radius: 20px;}
.contact_k dd.phone a{color: #333;text-indent: 50px;font-weight:bold;text-decoration: none;padding-right: 30px;border-radius: 20px;height: 38px;display: block;background-color: rgba(0,0,0,0.04);background-image: url(../images/contact_phone.svg);background-repeat: no-repeat;background-position: 18px center;background-size: 14px 15px;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);transform:rotate(0deg);}
.contact_k dd.phone a:hover{background-color: rgba(255,255,255,0.7);text-decoration: none;box-shadow: 0 4px 20px rgba(3,3,3,.1);transform:translateY(-5px);}
.contact_k dd.qq{font-family: "微软雅黑";font-size: 16px;color: #333;line-height: 38px;float: left;margin-right: 30px;border-radius: 20px;}
.contact_k dd.qq a{color: #000000;text-indent: 50px;font-weight:bold;text-decoration: none;padding-right: 30px;border-radius: 20px;height: 38px;display: block;background-color:#ffffff;background-image: url(../images/index_qq.svg);background-repeat: no-repeat;background-position: 18px center;background-size: 18px;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);transform:rotate(0deg);}
.contact_k dd.qq a:hover{background-color: rgba(255,255,255,0.7);text-decoration: none;box-shadow: 0 4px 20px rgba(3,3,3,.1);transform:translateY(-5px);}
.contact_k dd.weixin{font-family: "微软雅黑";font-size: 16px;color: #333;line-height: 38px;float: left;margin-right: 30px;border-radius: 20px;}
.contact_k dd.weixin a:hover{background-color: rgba(255,255,255,0.7);text-decoration: none;box-shadow: 0 4px 20px rgba(3,3,3,.1);transform:translateY(-5px);}
.contact_k dd.weixin .cart{color: #000000;text-indent: 50px;font-weight:bold;text-decoration: none;padding-right: 30px;border-radius: 20px;height: 38px;display: block;background-color:#ffffff;background-image: url(../images/index_weixin.svg);background-repeat: no-repeat;background-position: 18px center;background-size: 18px;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);transform:rotate(0deg);}
.contact_k dd.weixin a.cart:hover .pic{display:block;}
.contact_k dd.weixin .cart .pic{display: none;position: absolute;left: 158px; top: -73px;width: 160px;height: 160px;background: url(../images/index_weixin2.png);background-size: 160px 160px;border-radius: 10px;box-shadow: 0 4px 20px rgba(3,3,3,.2);opacity: 0.80;}
.explanation{font-size: 12px;color: #999;font-family: "微软雅黑";line-height: 24px;}


#txt{
	color: #00000047;
    font-size: 12px;
}

@media screen and (min-width:2100px) {
.two_topk{
width: 70%;
    margin: auto;
}
.slogan_k{
  width: 70%;
    margin: auto;
}
.service_2{
    width: 70%;
    margin: auto;
}
.contact_2 {
      width: 70%;
    margin: auto;
}
}


@media screen and (max-width:1400px) {
.service_mf {
    width: 48.5%;
    padding: 7px;
    grid-gap: inherit;
}
}
@media screen and (max-width:1050px) {
.service_mf {
    width: 48.2%;
    padding: 7px;
    grid-gap: inherit;
}
.service_mf .cart .pic4{
      right: 35px;
}
.service_mf .cart .pic3{
      right: 35px;
}
.service_mf .cart .pic2{
      right: 35px;
}
.service_mf .cart .pic{
      right: 35px;
}
.service_mf a:hover {
    text-decoration: none;
    background-color: #FFCE00;
    font-size: 33px;
    color: #000;
}
}
@media screen and (max-width:885px) {
.service_mf {
    width: 47%;
    padding: 7px;
    grid-gap: inherit;
}
.service_mf a:hover {
    text-decoration: none;
    background-color: #FFCE00;
    font-size: 33px;
    color: #000;
}
.service_mf .cart .pic4{
      right: 15px;
}
.service_mf .cart .pic3{
      right: 15px;
}
.service_mf .cart .pic2{
      right: 15px;
}
.service_mf .cart .pic{
      right: 15px;
}
#background2:hover { 
  font-size: 33px; 
}
#background3:hover { 
  font-size: 33px; 
}
#background4:hover { 
  font-size: 33px; 
}
.contact_k dd.email {
    margin-right: 10px;
}
.contact_k dd.qq {
    margin-right: 10px;
}
.contact_k dd.weixin {
    margin-right: 10px;
}
}
@media screen and (max-width:820px) {
.service_mf {
    width: 47%;
    padding: 7px;
    grid-gap: inherit;
}
.service_mf a:hover {
    text-decoration: none;
    background-color: #FFCE00;
    font-size: 30px;
    color: #000;
}
.slogan_k dd.wz1 {
font-size: 61px;
        padding-bottom: 0px;
        height: 87px;
                letter-spacing: 8px;
}
.slogan_k dd.wz2 {
font-size: 45px;

}
#background2:hover { 
  font-size: 30px; 
}
#background3:hover { 
  font-size: 30px; 
}
#background4:hover { 
  font-size: 30px; 
}
.contact_k dd.email {
    margin-right: 5px;
}
.contact_k dd.qq {
    margin-right: 5px;
}
.contact_k dd.weixin {
    margin-right: 5px;
}
}
@media screen and (max-width:800px) {
.service_mf {
    width: 100%;
    padding: 7px;
    grid-gap: inherit;
}
#background2:hover { 
  font-size: 40px; 
}
#background3:hover { 
  font-size: 40px; 
}
#background4:hover { 
  font-size: 40px; 
}
.service_mf a:hover {
    text-decoration: none;
    background-color: #FFCE00;
    font-size: 40px;
    color: #000;
}
.service_mf .cart .pic {
    opacity: 1;
    top: 42px;
    right: 60px;
}
.service_mf .cart .pic2 {
    opacity: 1;
    top: 42px;
    right: 60px;
}
.service_mf .cart .pic3 {
    opacity: 1;
    top: 42px;
    right: 60px;
}
.service_mf .cart .pic4 {
    opacity: 1;
    top: 42px;
    right: 60px;
}
.service_mf a {

    padding-left: 20px;
}
/*.service_mf a {
    background-color: #ececec;
}*/
}
@media screen and (max-width:550px) {
.service_mf {
    width: 100%;
    padding: 7px;
    grid-gap: inherit;
}
#background2:hover { 
  font-size: 30px; 
}
#background3:hover { 
  font-size: 30px; 
}
#background4:hover { 
  font-size: 30px; 
}
.service_mf a:hover {
    text-decoration: none;
    background-color: #FFCE00;
    font-size: 30px;
    color: #000;
}
.slogan_k dd.wz1 {
font-size: 43px;
        padding-bottom: 0px;
        height: 65px;
                letter-spacing: 6px;
}
.slogan_k dd.wz2 {
        font-size: 30px;
        margin-bottom: 0px;
        width: 100%;
        height: 50px;
 }
 .slogan_k dl {
    width: 100%;
    margin: auto;
}
.slogan_k {
    padding-top: 120px;
    padding-bottom: 50px;

}
}
@media screen and (max-width:470px) {

.service_mf .cart .pic {
    opacity: 1;
    top: 42px;
    right: 20px;
}
.service_mf .cart .pic2 {
    opacity: 1;
    top: 42px;
    right: 20px;
}
.service_mf .cart .pic3 {
    opacity: 1;
    top: 42px;
    right: 20px;
}
.service_mf .cart .pic4 {
    opacity: 1;
    top: 42px;
    right: 20px;
}
}

@media screen and (max-width:400px) {
.service_mf {
    width: 100%;
    padding: 7px;
    grid-gap: inherit;
}
#background2:hover { 
  font-size: 30px; 
}
#background3:hover { 
  font-size: 30px; 
}
#background4:hover { 
  font-size: 30px; 
}
.service_mf a:hover {
    text-decoration: none;
    background-color: #FFCE00;
    font-size: 30px;
    color: #000;
}
.slogan_k dd.wz1 {
font-size: 50px;
        padding-bottom: 0px;
        height: 75px;
}
.slogan_k dd.wz2 {
    font-size: 50px;
    margin-bottom: 0px;
    width: 100%;
 }
 .slogan_k dl {
    width: 100%;
    margin: auto;
}
.slogan_k {
    padding-top: 120px;
    padding-bottom: 50px;

}
}