@charset "utf-8";
/* CSS Document */

*{outline: none;}
body,dl,dd,ul,ol,td,th,h1,h2,h3,h4,h5,h6,p,form{margin:0;padding:0;}
li{list-style-type:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight: normal;}
em,b,strong,i{font-style:normal;font-weight: normal;}
a,a:hover{text-decoration:none;}
img{border:none;vertical-align: top;}
button,input,select,textarea{font-size:100%;outline:none;}
table{border-collapse:collapse;border-spacing:0;}
body{ font:12px/1.5 '\5b8b\4f53',tahoma,sans-serif;}
.fl{float: left;}
.fr{float: right;}
.clearfix:after{content:"."; height:0; display:block; clear:both;}
.hidden{display:block;width:0;height:0;overflow:hidden;}

.wrap{position: relative; }
.wrap-inner{ width:1000px; height:718px; margin:0 auto;}  
.bg_box{width:100%;min-width:1000px; position:absolute; left:0; top:0px; z-index:-1;}
.bg_box_in{width:100%; min-width:1000px; height: 100%;  position: relative; margin:0 auto;}
 
.bg1{width: 100%; height:271px;background:url(../images/bg_01.jpg) no-repeat center top; }
.bg2{ height:221px;background:url(../images/bg_02.jpg) no-repeat center top;margin-top:-1px;}
.bg3{ height:228px;background:url(../images/bg_03.jpg) no-repeat center top;margin-top:-1px;}


.head{width:1000px; height:670px;position: relative;}

.rj_logo{position:absolute;top:0px;left:0px}
.j_lo{ width:190px; height:100px; float:left; display:block;}
.rj_nav{ width:330px;position: absolute;top:10px;left:350px;}

/*页面导航*/
.tongyong_nav{ height:85px;width:100%;z-index:99;background:url(../images/bgs.jpg) 0 0 repeat-x;}
.ty_con{ width:1000px;height:85px;margin:0 auto;position:relative}

.ty_btn1{width:90px; height:85px;padding:10px 9px 0 13px;position: absolute;right: -120px;top: 0;}
.ty_btn1 a{margin-bottom:7px;position: relative;display: block;width: 90px;height: 26px;line-height: 25px;text-align: center;background: #e4c8a5;border-radius: 2px;color:#000;font-family:微软雅黑;}

.ty_list{ height:85px;}
.ty_list  a{position:relative;float:left;width:165px;height:85px;background: url(../images/t.png) no-repeat;text-align:center;font-family:微软雅黑;}
.ty_list  a:hover{ width:165px; height:85px;background: #171B24 url(../images/h.gif) no-repeat; display:block;}
.ty_list  strong{color:#ffffff;font-weight:bold;font-size:18px;padding-top:10px;display:block;line-height:35px;}
.ty_list  span{font-size:13px;color:#ffffff;line-height:20px;display:block;}

.ty_list  a:hover strong{color:#fef9c3;background:url(../images/line2.png) no-repeat 50% bottom;text-shadow:#df3c00 0 1px 1px;-webkit-animation:fadeInDown .6s ease both;-moz-animation:fadeInDown .6s ease both;-ms-animation:fadeInDown .6s ease both;-o-animation:fadeInDown .6s ease both;}
.ty_list a:hover span{color:#fef9c3;text-shadow:#df3c00 0 1px 1px;-webkit-animation:fadeInDown .6s .2s ease both;-moz-animation:fadeInDown .6s .2s ease both;-ms-animation:fadeInDown .6s .2s ease both;-o-animation:fadeInDown .6s .2s ease both;}

.nav_icon{width:18px;height:20px;position:absolute;left:73px;top:64px;background:url(../images/jt.png) no-repeat;display:none;-webkit-animation:fadeInDown .6s .3s ease both;-moz-animation:fadeInDown .6s .3s ease both;-ms-animation:fadeInDown .6s .3s ease both;-o-animation:fadeInDown .6s .3s ease both;}

.ty_list a:hover .nav_icon{ display:block;}


/*动画*/
.anim{width:100%;height:100vh;position:fixed;top:0;left:0;z-index:5;pointer-events:none;}
.anim > div{position:absolute;animation-iteration-count:infinite;animation-direction:normal;animation-timing-function:linear;opacity:0;}
.anim > div:nth-child(2n+1){width:72px;height:72px;}
.anim > div:nth-child(2n+2){width:100px;height:101px;}
.anim > div > img{position:absolute;width:100%;height:100%;animation-iteration-count:infinite;animation-direction:alternate;animation-timing-function:ease-in-out;transform-origin:50% -100%;}
@keyframes fade{
    0%{opacity:0;}
    50%{opacity:1;}
    100%{opacity:0;}
}
@keyframes drop{
    0%{transform:translate(0px,0);}
    100%{transform:translate(0px,-700px);}
}
@keyframes clockwiseSpin{
    0%{transform:rotate(-50deg);}
    100%{transform:rotate(50deg);}
}
@keyframes counterclockwiseSpinAndFlip{
    0%{transform:scale(1) rotate(50deg);}
    100%{transform:scale(0.5) rotate(-50deg);}
}





