
/* BASIC 基础样式 */
body {font-size:15px; font-family:"微软雅黑"; margin:0; padding:0; background-color:#FFF; position:relative;}
ul,li,h1,h2,h3,h4,h5,h6,h7{ padding:0; margin:0;}
h1,h2,h3,h4,h5,h6,h7{ font-weight:normal;}
em,i{ font-style:normal;}
ul,li{ list-style:none;}
a:link {TEXT-DECORATION: none;}
a:visited {TEXT-DECORATION: none;}
a:hover {TEXT-DECORATION:none;}
a:active {TEXT-DECORATION: none;}
img{border:none;}
.clear{ clear:both;}
.clearfix:after {
	clear: both;
}

.clearfix:after,
.clearfix:before {
	content: "";
	display: table;
}
.none{ display:none;}
.png_bg{background-image:url(http://rcy.cg.km.gov.cn/public/static/index/images/png_bg.png); background-repeat:no-repeat;}
.inner{ width:1000px; clear:both; margin:auto; position:relative;}
.mg_t_20{ margin-top:20px;}
.blank_100{ clear:both; height:100px; width:100%;}
.corner{ border-radius:10px;}
.bg_a88{background:rgba(255,255,255,0.88) none repeat scroll 0 0 !important;filter:Alpha(opacity=88); background:#FFF;}
.bg_a70{background:rgba(255,255,255,0.70) none repeat scroll 0 0 !important;filter:Alpha(opacity=70); background:#FFF;}
.bg_b50{background:rgba(0,0,0,0.5) none repeat scroll 0 0 !important;filter:Alpha(opacity=5); background:#000;}
.bg_g50{background:rgba(7,187,90,0.5) none repeat scroll 0 0 !important;filter:Alpha(opacity=5); background:#07BB5A;}
.section{background-position:center; background-size:cover;}
.trans{transition:all 0.3s ease-out;-webkit-transition:all 0.3s  cubic-bezier(0.19, 1, 0.22, 1);-moz-transition:all 0.3s ease-out;-khtml-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;}
.trans06{transition:all 0.6s ease-out;-webkit-transition:all 0.6s  cubic-bezier(0.19, 1, 0.22, 1);-moz-transition:all 0.6s ease-out;-khtml-transition:all 0.6s ease-out;-o-transition:all 0.6s ease-out;}
.trans10{transition:all 1.0s ease-out;-webkit-transition:all 1.0s  cubic-bezier(0.3, 1, 0.22, 1);-moz-transition:all 1.0s ease-out;-khtml-transition:all 1.0s ease-out;-o-transition:all 1.0s ease-out;}
.greenBorder{ border:#18CDAC solid 1px;}
/* COLOR */
.white{ color:#fff;}
.white a:link{ color:#fff;}
.white a:visited{ color:#fff;}
.white a:hover{ color:#FF9900;}
.white a:active{ color:#FF9900;}

#main{ width:100%; min-height:400px; background-color:#5BCFF4;}
#main .top{width:100%; clear:both; margin:auto; background-image:url(../image/bg1.png); background-position:bottom center; background-size:cover; position:relative; overflow: hidden;}
#main .top .cloud{width:3600px;  background-image:url(../image/cloud.png); background-position:bottom center; background-repeat:repeat-x; height:130px; position:absolute; bottom:0; left:0;animation:moveX 12s linear infinite;-webkit-animation:moveX 12s linear infinite;-moz-animation:moveX 12s linear infinite;-ms-animation:moveX 12s linear infinite;}
#main .top .news{width:1200px;height: 30px;line-height: 30px; position:absolute; bottom:0;left: 50%;margin-left: -600px;overflow: hidden;}
#main .top .cloud_left{position:absolute; width: 90px; top:8%;left: 18%;animation:moveCloudLeft 10s linear infinite;-webkit-animation:moveCloudLeft 10s linear infinite;-moz-animation:moveCloudLeft 10s linear infinite;-ms-animation:moveCloudLeft 10s linear infinite;}
#main .top .cloud_report{/*width: 301px;height: 128px;*/ width: 18%; position:absolute; top:55%;left: 32%; animation:moveCloudReport 10s linear infinite;-webkit-animation:moveCloudReport 10s linear infinite;-moz-animation:moveCloudReport 10s linear infinite;-ms-animation:moveCloudReport 10s linear infinite;}
#main .top .right_report{/*width: 301px;height: 128px;*/ width: 18%; position:absolute; top:53%;left: 52%; animation:moveRightReport 10s linear infinite;-webkit-animation:moveRightReport 10s linear infinite;-moz-animation:moveRightReport 10s linear infinite;-ms-animation:moveRightReport 10s linear infinite;}
#main .top .cloud_right{position:absolute; bottom:38%;right: 14%;width: 130px;animation:moveCloudRight 8s linear infinite;-webkit-animation:moveCloudRight 8s linear infinite;-moz-animation:moveCloudRight 8s linear infinite;-ms-animation:moveCloudRight 8s linear infinite;}
#gundongAreaMain1 {
	float: left;
	width: 800%;
}
#gundongAreaMain2,
#gundongAreaMain3,
#gundongAreaMain2 li,
#gundongAreaMain3 li {
	float: left;
}
#gundongAreaMain2 li,
#gundongAreaMain3 li {
	margin-right: 50px;
}
#main .top .tysn{width:366px;height:366px; background-image:url(../image/tysn.png); position:absolute; top:-120px; right:-50px;animation:rotate 6s linear infinite;-webkit-animation:rotate 6s linear infinite;-moz-animation:rotate 6s linear infinite;-ms-animation:rotate 6s linear infinite;}
#main .top .login{width:143px;height:61px; background-image:url(../image/login_bj.png); position:absolute; top:24px; right:61px;}
#main .top .login a{display:inline-block;line-height:40px;font-size: 16px;color: #0083ad;text-align: center;margin: 16px 0 0 32px;}
#main .top .con{width:682px; margin:auto; position:relative;}
#main .top .logo{ width:682px; height:206px;background-image:url(../image/logo.png); margin:auto; position:absolute;    background-size: 100%;background-repeat: no-repeat;}
#main .top .cyds{width:660px; height:88px; margin:auto; position:absolute;}
#main .nav{width:100%; clear:both; margin:auto; background-color:#0077E8;}
#main .nav ul{ width:100%; clear:both; margin:auto; }
#main .nav ul li{ width:20%; float:left; position:relative;cursor:pointer;}
#main .nav ul li .icon{ width:195px; height:105px; background-repeat:no-repeat; background-position:center top; margin:auto; margin-top:20%;}
#main .nav ul li .icon_con{ width:250px; height:142px;margin:auto; margin-top:25%; overflow:hidden; position:relative;}
#main .nav ul li .icon_con .icon_peizhi{ width:214px; height:240px;background-image:url(../image/icon1.png); background-repeat: no-repeat; background-position:0 0; position:absolute; left:0; top:0;animation:transIcon2 8s infinite;-webkit-animation:transIcon2 8s infinite;-moz-animation:transIcon2 8s infinite;-ms-animation:transIcon2 8s infinite;}
#main .nav ul li .icon_con .icon_xuexi{ width:214px; height:240px;background-image:url(../image/icon2.png); background-repeat: no-repeat; background-position:0 0; position:absolute; left:0; top:0;animation:transIcon2 9s infinite;-webkit-animation:transIcon2 9s infinite;-moz-animation:transIcon2 9s infinite;-ms-animation:transIcon2 9s infinite;}
#main .nav ul li .icon_con .icon_xinxi{ width:214px; height:240px;background-image:url(../image/icon3.png); background-repeat: no-repeat; background-position:0 0; position:absolute; left:0; top:0;animation:transIcon2 10s infinite;-webkit-animation:transIcon2 10s infinite;-moz-animation:transIcon2 10s infinite;-ms-animation:transIcon2 10s infinite;}
#main .nav ul li .icon_con .icon_juece{ width:214px; height:240px;background-image:url(../image/icon4.png); background-repeat: no-repeat; background-position:0 0; position:absolute; left:0; top:0;animation:transIcon2 11s infinite;-webkit-animation:transIcon2 11s infinite;-moz-animation:transIcon2 11s infinite;-ms-animation:transIcon2 11s infinite;}
#main .nav ul li .icon_con .icon_gonggong{ width:214px; height:240px;background-image:url(../image/icon5.png); background-repeat: no-repeat; background-position:0 0; position:absolute; left:0; top:0;animation:transIcon2 12s infinite;-webkit-animation:transIcon2 12s infinite;-moz-animation:transIcon2 12s infinite;-ms-animation:transIcon2 12s infinite;}

/*#main .nav ul .peizhi{ background-color:#51B8FF;}
#main .nav ul .peizhi .icon{background-image:url(../image/icon1.png);}*/
#main .nav ul .peizhi{ background-color:#4B9BE0;}
#main .nav ul .peizhi .icon{background-image:url(../image/icon1.png);}
#main .nav ul .xuexi{ background-color:#4A8CC3;}
#main .nav ul .xuexi .icon{background-image:url(../image/icon2.png);}
#main .nav ul .xinxi{ background-color:#2F6BBC;}
#main .nav ul .xinxi .icon{background-image:url(../image/icon3.png);}
#main .nav ul .juece{ background-color:#4A8CC3;}
#main .nav ul .juece .icon{background-image:url(../image/icon4.png);}
#main .nav ul .gonggong{ background-color:#4B9BE0;}
#main .nav ul .gonggong .icon{background-image:url(../image/icon5.png);}

@keyframes moveX {
    0% {
        opacity: 1;
        transform: translateX(0)
    }
    100% {
        opacity: 1;
        transform: translateX(-1200px)
    }
}
@-webkit-keyframes moveX {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(-1200px)
    }
}
@-moz-keyframes moveX {
    0% {
        opacity: 1;
        transform: translateX(0)
    }
    100% {
        opacity: 1;
        transform: translateX(-1200px)
    }
}
@-ms-keyframes moveX {
    0% {
        opacity: 1;
        -ms-transform: translateX(0)
    }
    100% {
        opacity: 1;
        -ms-transform: translateX(-1200px)
    }
}

@keyframes moveCloudLeft {
    0% {
        opacity: 0.9;
        transform: translateX(0)
    }
    25% {
        opacity: 0.75;
        transform: translateX(-40px)
    }
    75% {
        opacity: 0.6;
        transform: translateX(40px)
    }
    100% {
        opacity: 0.9;
        transform: translateX(0)
    }
}
@-webkit-keyframes moveCloudLeft {
    0% {
        opacity: 0.9;
        transform: translateX(0)
    }
    25% {
        opacity: 0.75;
        transform: translateX(-40px)
    }
    75% {
        opacity: 0.6;
        transform: translateX(40px)
    }
    100% {
        opacity: 0.9;
        transform: translateX(0)
    }
}
@-moz-keyframes moveCloudLeft {
    0% {
        opacity: 0.9;
        transform: translateX(0)
    }
    25% {
        opacity: 0.75;
        transform: translateX(-40px)
    }
    75% {
        opacity: 0.6;
        transform: translateX(40px)
    }
    100% {
        opacity: 0.9;
        transform: translateX(0)
    }
}
@-ms-keyframes moveCloudLeft {
    0% {
        opacity: 0.9;
        transform: translateX(0)
    }
    25% {
        opacity: 0.75;
        transform: translateX(-40px)
    }
    75% {
        opacity: 0.6;
        transform: translateX(40px)
    }
    100% {
        opacity: 0.9;
        transform: translateX(0)
    }
}

@keyframes moveCloudReport {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(-40px)
    }
    75% {
        transform: translateX(40px)
    }
    100% {
        transform: translateX(0)
    }
}
@-webkit-keyframes moveCloudReport {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(-40px)
    }
    75% {
        transform: translateX(40px)
    }
    100% {
        transform: translateX(0)
    }
}
@-moz-keyframes moveCloudReport {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(-40px)
    }
    75% {
        transform: translateX(40px)
    }
    100% {
        transform: translateX(0)
    }
}
@-ms-keyframes moveCloudReport {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(-40px)
    }
    75% {
        transform: translateX(40px)
    }
    100% {
        transform: translateX(0)
    }
}
/**/
@keyframes moveRightReport {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(40px)
    }
    75% {
        transform: translateX(-40px)
    }
    100% {
        transform: translateX(0)
    }
}
@-webkit-keyframes moveRightReport {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(40px)
    }
    75% {
        transform: translateX(-40px)
    }
    100% {
        transform: translateX(0)
    }
}
@-moz-keyframes moveRightReport {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(40px)
    }
    75% {
        transform: translateX(-40px)
    }
    100% {
        transform: translateX(0)
    }
}
@-ms-keyframes moveRightReport {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(40px)
    }
    75% {
        transform: translateX(-40px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes moveCloudRight {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(-35px)
    }
    75% {
        transform: translateX(35px)
    }
    100% {
        transform: translateX(0)
    }
}
@-webkit-keyframes moveCloudRight {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(-35px)
    }
    75% {
        transform: translateX(35px)
    }
    100% {
        transform: translateX(0)
    }
}
@-moz-keyframes moveCloudRight {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(-35px)
    }
    75% {
        transform: translateX(35px)
    }
    100% {
        transform: translateX(0)
    }
}
@-ms-keyframes moveCloudRight {
    0% {
        transform: translateX(0)
    }
    25% {
        transform: translateX(-35px)
    }
    75% {
        transform: translateX(35px)
    }
    100% {
        transform: translateX(0)
    }
}
@keyframes moveX2 {
    0% {
        opacity: 1;
        transform: translateX(0)
    }
    100% {
        opacity: 1;
        transform: translateX(-600px)
    }
}
@-webkit-keyframes moveX2 {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(-600px)
    }
}
@-moz-keyframes moveX2 {
    0% {
        opacity: 1;
        transform: translateX(0)
    }
    100% {
        opacity: 1;
        transform: translateX(-600px)
    }
}
@-ms-keyframes moveX2 {
    0% {
        opacity: 1;
        -ms-transform: translateX(0)
    }
    100% {
        opacity: 1;
        -ms-transform: translateX(-600px)
    }
}

@keyframes transIcon {
    0% {
        transform: translate(0,0)
    }
  	35% {transform:  translate(-332px,-105px)}
	55% { transform:  translate(-332px,-105px)}
    100% {
        transform: translate(-664px,-210px)
    }
}
@-webkit-keyframes transIcon {
    0% {
        -webkit-transform: translate(0,0)
    }
   35% {
         -webkit-transform: translate(-332px,-105px)
    }
	55% {
         -webkit-transform: translate(-332px,-105px)
    }
    100% {
        -webkit-transform: translate(-664px,-210px)
    }
}
@-moz-keyframes transIcon {
    0% {
    transform: translate(0,0)
    }
	35% {transform:  translate(-332px,-105px)}
	55% { transform:  translate(-332px,-105px)}
    100% {
        transform: translate(-664px,-210px)
    }
}
@-ms-keyframes transIcon {
    0% {-ms-transform: translate(0,0)}
	35% {-ms-transform:  translate(-332px,-105px)}
	55% {-ms-transform:  translate(-332px,-105px)}
    100% { opacity: 1; -ms-transform: translate(-664px,-210px)}
}

@keyframes transIcon2 {
   
    30% {
        opacity:1;
        transform: translate(0,0);    
    }
  	35% {
            opacity: 0;transform: translate(0,0);}
        36% {
            opacity: 0;transform: translate(0,-128px);}
        39% {
            opacity: 1;transform: translate(0,-122px);}
	80% {
            opacity: 1;transform: translate(0,-122px);}
        81% {
            opacity: 0;transform: translate(0,-128px);}
        82% {
            opacity: 0;transform: translate(0,0);}
        85% {
            opacity: 1;transform: translate(0,0);}
   
}
@-webkit-keyframes transIcon2{
    30% {
        opacity:1;
        -webkit-transform: translate(0,0);    
    }
  	35% {
            opacity: 0;-webkit-transform: translate(0,0);}
        36% {
            opacity: 0;-webkit-transform: translate(0,-122px);}
        39% {
            opacity: 1;-webkit-transform: translate(0,-122px);}
	80% {
            opacity: 1;-webkit-transform: translate(0,-122px);}
        81% {
            opacity: 0;-webkit-transform: translate(0,-122px);}
        82% {
            opacity: 0;-webkit-transform: translate(0,0);}
        85% {
            opacity: 1;-webkit-transform: translate(0,0);}
}
@-moz-keyframes transIcon2 {

    30% {
        opacity:1;
        transform: translate(0,0);    
    }
  	35% {
            opacity: 0;transform: translate(0,0);}
        36% {
            opacity: 0;transform: translate(0,-122px);}
        39% {
            opacity: 1;transform: translate(0,-122px);}
	80% {
            opacity: 1;transform: translate(0,-122px);}
        81% {
            opacity: 0;transform: translate(0,-122px);}
        82% {
            opacity: 0;transform: translate(0,0);}
        85% {
            opacity: 1;transform: translate(0,0);}
}
@-ms-keyframes transIcon2{
     30% {
        opacity:1;
        -ms-transform: translate(0,0);    
    }
  	35% {
            opacity: 0;-ms-transform: translate(0,0);}
        36% {
            opacity: 0;-ms-transform: translate(0,-122px);}
        39% {
            opacity: 1;-ms-transform: translate(0,-122px);}
	80% {
            opacity: 1;-ms-transform: translate(0,-122px);}
        81% {
            opacity: 0;-ms-transform: translate(0,-122px);}
        82% {
            opacity: 0;-ms-transform: translate(0,0);}
        85% {
            opacity: 1;-ms-transform: translate(0,0);}
}

@keyframes rotate {
    0% {
        opacity: 1;
        transform: rotate(0deg);
    }
    100% {
        opacity: 1;
        transform: rotate(360deg);
    }
}
@-webkit-keyframes rotate {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
    }
    100% {
        opacity: 1;
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes rotate {
    0% {
        opacity: 1;
        transform: rotate(0deg);
    }
    100% {
        opacity: 1;
        transform: rotate(360deg);
    }
}
@-ms-keyframes rotate {
    0% {
        opacity: 1;
        -ms-transform: rotate(0deg);
    }
    100% {
        opacity: 1;
        -ms-transform: rotate(360deg);
    }
}

@keyframes rotateZ {
    0% {
        opacity: 1;
        transform: rotateZ(0deg);
    }
    100% {
        opacity: 1;
        transform: rotateZ(360deg);
    }
}
@-webkit-keyframes rotateZ {
    0% {
        opacity: 1;
        -webkit-transform: rotateZ(0deg);
    }
    100% {
        opacity: 1;
        -webkit-transform: rotateZ(360deg);
    }
}
@-moz-keyframes rotateZ {
    0% {
        opacity: 1;
        transform: rotateZ(0deg);
    }
    100% {
        opacity: 1;
        transform: rotateZ(360deg);
    }
}
@-ms-keyframes rotateZ {
    0% {
        opacity: 1;
        -ms-transform: rotateZ(0deg);
    }
    100% {
        opacity: 1;
        -ms-transform: rotateZ(360deg);
    }
}

@keyframes beat {
    0% {
        opacity:0.9;
        transform:scale(1)
    }
    60% {
        opacity:1;
        transform:scale(1.2)
    }
    90% {
        transform:scale(0.89)
    }
    97% {
        transform:scale(0.92)
    }
    100% {
        transform:scale(1)
    }
}
@-webkit-keyframes beat {
    0% {
        opacity:0.9;
        -webkit-transform:scale(1)
    }
    60% {
        opacity:1;
        -webkit-transform:scale(1.2)
    }
    90% {
        -webkit-transform:scale(0.89)
    }
    97% {
        -webkit-transform:scale(0.92)
    }
    100% {
        -webkit-transform:scale(1)
    }
}
@-moz-keyframes beat {
    0% {
        opacity:0.9;
        -moz-transform:scale(1)
    }
    60% {
        opacity:1;
        -moz-transform:scale(1.2)
    }
    90% {
        -moz-transform:scale(0.89)
    }
    97% {
        -moz-transform:scale(0.92)
    }
    100% {
        -moz-transform:scale(1)
    }
}
@-ms-keyframes beat {
    0% {
        opacity:0.9;
        -ms-transform:scale(1)
    }
    60% {
        opacity:1;
        -ms-transform:scale(1.2)
    }
    90% {
        -ms-transform:scale(0.89)
    }
    97% {
        -ms-transform:scale(0.92)
    }
    100% {
        -ms-transform:scale(1)
    }
}


@keyframes beat2 {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
    }
}
@-webkit-keyframes beat2 {
    0% {
        
        -webkit-transform: scale(1);
    }
    50% {
        
        -webkit-transform: scale(1.2);
    }
    100% {
        -webkit-transform: scale(1);
    }
}
@-moz-keyframes beat2 {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
    }
}
@-ms-keyframes beat2 {
    0% {
        -ms-transform: scale(1);
    }
    50% {
        -ms-transform: scale(1.2);
    }
    100% {
        -ms-transform: scale(1);
    }
}
