body{ background:url(gk.jpg) center 60px no-repeat}
.mb30{ margin-bottom:40px}
.g-box-1{height:750px}
.g-box-2{width:1000px; margin:0 auto 80px auto}
.g-box-3{width:1000px; margin:0 auto}
.m-lst-1{overflow:hidden}
.m-lst-1 li{display:block; float:left; width:320px; position:relative; margin-right:20px;}
.m-lst-1 img{display:block; width:320px; height:400px}
.m-lst-1 span{ position:absolute; top:350px; left:0; width:100%; height:50px; background:url(arrow1.png) center top no-repeat;z-index:2}
.m-lst-1 span.top{ position:absolute; top:180px; left:0; width:100%; height:50px; background:url(arrowt.png) center top no-repeat;z-index:2}
.m-tt-1{ padding:20px; height:140px; border:1px solid #e3e3e3; border-top: none; background:#f3f3f3}
.m-tt-1 strong a{ display:block; margin-bottom:10px;font-weight:normal; font-size:20px; color:#222}
.m-tt-1 strong a:hover{ text-decoration:underline; color:#222}
.m-tt-1 p{ height:70px; line-height:24px; overflow:hidden}


.wrapper{ overflow:hidden; padding-top:40px}
.wrapper li{position:relative; float:left;width:180px;height:180px;list-style:none;margin:10px;display:block;perspective:300px}
.picBox{position:absolute;top:0;right:0;bottom:0;left:0;transform-style:preserve-3d;transform-origin:50% 50% -90px;animation:200ms ease-out 0ms 1 normal forwards}
.show,.hide{position:absolute;top:0;right:0;bottom:0;left:0}
.hide{color:#fff;background-color:#000;text-align:center;line-height:180px;transform:translate3d(0,0,-1px)}
.in-top .hide,.out-top .hide{transform-origin:0% 100%;transform:translate3d(0,-100%,0) rotate3d(1,0,0,90deg)}
.in-top .picBox{animation-name:in-top;animation-play-state:running}
.out-top .picBox{animation-name:out-top;animation-play-state:running}
@keyframes in-top{from{transform:rotate3d(0,0,0,0deg)}
to{transform:rotate3d(-1,0,0,90deg)}
}@keyframes out-top{from{transform:rotate3d(-1,0,0,90deg)}
to{transform:rotate3d(0,0,0,0deg)}
}.in-right .hide,.out-right .hide{transform-origin:0% 0%;transform:translate3d(100%,0,0) rotate3d(0,1,0,90deg)}
.in-right .picBox{animation-name:in-right;animation-play-state:running}
.out-right .picBox{animation-name:out-right;animation-play-state:running}
@keyframes in-right{from{transform:rotate3d(0,0,0,0deg)}
to{transform:rotate3d(0,-1,0,90deg)}
}@keyframes out-right{from{transform:rotate3d(0,-1,0,90deg)}
to{transform:rotate3d(0,0,0,0deg)}
}.in-bottom .hide,.out-bottom .hide{transform-origin:0% 0%;transform:translate3d(0,100%,0) rotate3d(-1,0,0,90deg)}
.in-bottom .picBox{animation-name:in-bottom;animation-play-state:running}
.out-bottom .picBox{animation-name:out-bottom;animation-play-state:running}
@keyframes in-bottom{from{transform:rotate3d(0,0,0,0deg)}
to{transform:rotate3d(1,0,0,90deg)}
}@keyframes out-bottom{from{transform:rotate3d(1,0,0,90deg)}
to{transform:rotate3d(0,0,0,0deg)}
}.in-left .hide,.out-left .hide{transform-origin:100% 0;transform:translate3d(-100%,0,0) rotate3d(0,-1,0,90deg)}
@keyframes in-left{from{transform:rotate3d(0,0,0,0deg)}
to{transform:rotate3d(0,1,0,90deg)}
}@keyframes out-left{from{transform:rotate3d(0,1,0,90deg)}
to{transform:rotate3d(0,0,0,0deg)}
}.in-left .picBox{animation-name:in-left;animation-play-state:running}
.out-left .picBox{animation-name:out-left;animation-play-state:running}


.superiority{ width:100%; height:700px; float:left; margin-top:0px;  background-size:cover;}
.super_text{ width:1100px; height:700px; background:url(superiority.png) center -60px no-repeat ; background-size:cover;}
.super_content{ width:1100px; height:700px; float:left;margin-top: 60px;}
.superli{width:1100px; height:270px; float:left; margin-top:65px;}
.superli ul{ width:1100px; height:270px;}
.superli ul li{ width:100px; height:100px; float:left; color:#2d5bc4; text-align:center; font-size:18px;cursor:pointer;border-radius: 100px;background:url(qipao.png) no-repeat center; background-size:cover;display: block; line-height:50px}
.superli ul li:nth-child(2){animation:myfirst linear infinite 2s;}
@keyframes myfirst {0% {margin-top:120px;} 50% {margin-top:128px;} 100% {margin-top:120px;}}
.superli ul li:nth-child(3){animation:myfirsta linear infinite 2s;}
@keyframes myfirsta {0% {margin-top:252px;} 70% {margin-top:260px;} 100% {margin-top:252px;}}
.superli ul li:nth-child(4){animation:myfirstb linear infinite 2s;}
@keyframes myfirstb {0% {margin-top:0px;} 60% {margin-top:8px;} 100% {margin-top:0px;}}
.superli ul li:nth-child(5){animation:myfirstc linear infinite 2s;}
@keyframes myfirstc {0% {margin-top:152px;} 40% {margin-top:160px;} 100% {margin-top:152px;}}
.superli ul li:nth-child(1){animation:myfirstd linear infinite 2s;}
@keyframes myfirstd {0% {margin-top:0px;} 40% {margin-top:8px;} 100% {margin-top:0px;}}
.superli ul li a{ color:#2d5bc4}
.superli ul li a:hover{ color:#da3a3a}
.superli ul li:hover{transform: scale(1.3);transition: all 0.3s;color:#da3a3a}
.superli ul li a{display: block;margin-top: 26px;}
.superli ul li:nth-child(2)>a{display:block;}
.superli ul li:nth-child(2){ margin-left:60px;margin-top:120px;}
.superli ul li:nth-child(3){ margin-left:-212px; margin-top:252px;}
.superli ul li:nth-child(4){ margin-left:635px; margin-top:0px;}
.superli ul li:nth-child(5){margin-left:570px; margin-top:2px;}
.supertext{ width:1000px; height:65px; float:left; margin-top:165px;}
.supert{ width:1000px; height:65px; padding-left:50px; text-align:center; font-size:20px; color:#333; display:none;}
.supert:first-Child{ display:block;}
.superbut{ width:50%; float:left; height:74px;margin-left: 25%;}
.superbtn{ width:80%; height:72px; border:1px solid #000000; line-height:72px; text-align:center; font-size:30px; color:#00000; margin-left: 10%; margin-top:90px;border-radius: 40px;cursor:pointer;}
.superbtn:hover{ background: #ffc670; color:#00000;transform: scale(1.05);transition: all 0.5s;}
.imgWrap_k{float:left;width: 100%;position: relative;margin-top: -920px;z-index: -111;height: 900px;}
.imgWrap {width: 700px;height: 700px;margin: 0 auto;margin-top: 120px;}

.outer, .inner, .small {
	position: relative;
    width: 700px;
    height: 700px;
    border-radius: 50%;
    background-color: rgba(253,232,222,0.7);
    opacity: 0;
    -webkit-animation: ballScale 4s 0s linear infinite;
    -moz-animation: ballScale 4s 0s linear infinite;
    -ms-animation: ballScale 4s 0s linear infinite;
    animation: ballScale 4s 0s linear infinite;
}

.inner{
	position: relative;
	margin-top: -700px;
  -webkit-animation-delay: 1s;
  -moz-animation-delay: 1s;
  -ms-animation-delay: 1s;
      animation-delay: 1s;
}
.small{
		position: relative;
	margin-top: -700px;
  -webkit-animation-delay: 2s;
  -moz-animation-delay: 2s;
  -ms-animation-delay: 2s;
      animation-delay: 2s;
}
@-webkit-keyframes ballScale {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1; }

  100% {
    -webkit-transform: scale(1);
            transform: scale(1);

    opacity: 0; } }
@-moz-keyframes ballScale {
  0% {
    -moz-transform: scale(0);
            transform: scale(0);
    opacity: 1; }

  100% {
    -moz-transform: scale(1);
            transform: scale(1);

    opacity: 0; } }
@-ms-keyframes ballScale {
  0% {
    -ms-transform: scale(0);
            transform: scale(0);
    opacity: 1; }

  100% {
    -ms-transform: scale(1);
            transform: scale(1);

    opacity: 0; } }
@keyframes ballScale {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
    }

  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0; }
}
.hide h3 a{ color:#fff}