.wrap { overflow: hidden; }
.top-title { background: #ec523f; height: 80px; text-align: center; }
.top-title b { display: block; width: 0; height: 1px; background: #ffffff; position: relative; top: 39px; transition-duration: 3s; margin: 0 auto; }
.top-title i { display: block; width: 236px; height: 47px; border: 1px solid #ffffff; margin: 0 auto; position: relative; top: 13px; }
.top-title span { display: inline-block; padding: 0 8px; font-size: 22px; color: #ffffff; line-height: 22px; background: #ec523f; position: relative; top: -25px; text-transform: uppercase; }
.top-title em { display: inline-block; padding: 0 10px; font-size: 14px; color: #ffffff; line-height: 14px; background: #ec523f; position: relative; top: -20px; text-transform: uppercase; }

.pro-con { position: absolute; width: 100%; top: 50%; margin-top: -260px; }
.left-pro { float: left; width: 760px; position: relative; left: 0; }
.one h2 { font-size: 40px; font-family: Impact; line-height: 40px; text-transform: uppercase; color: #ec523f; }
.one span { font-size: 14px; }
.one p { font-size: 14px; text-align: justify; }
.one b { display: block; width: 29px; height: 1px; background: #ec523f; margin: 12px 0; }
.right-pro { float: right; position: relative; right: 0; }
.right-pro li { text-align: right; border-right: 1px solid transparent; font-size: 14px; margin: 10px 0; padding-right: 10px; line-height: 14px; transition-duration: .5s; }
.right-pro li:first-child { margin-top: 0; }
.right-pro li:hover ,.right-pro li.current { border-right: 1px solid #ed6700; }
.right-pro li:hover a,.right-pro li.current a { color: #ed6700; }
.pro-list { margin-top: 10px; }
.pro-list li { float: left; border: 1px solid #e4e4e4; margin-right: 10px; margin-top: 8px; width: 230px; overflow: hidden; height: 172px; }
.pro-list li:nth-child(5n) { margin-right: 0; }

.news-con { position: absolute; width: 100%; top: 50%;     margin-top: -258px; }
.top-part { position: relative; }
.left-news { position: relative; float: left; width: 314px; text-align: right; left: 0; }
.left-news b { display: block; width: 260px;      height: 192px; border: 8px solid #c7c7c7; position: absolute; z-index: -1; }
.left-news h2 {margin-top: 32px;  margin-left: 34px; }
.left-news img { width: 100%; }
.right-news { float: right;
    width: 881px;
    background: #00b89c;
    padding: 16px;
    position: absolute;
    right: 0;
    top: 42px; }
.right-news h2 a { font-weight: normal; font-size: 24px; color: #ffffff; }
.right-news h2 a em { font-size: 12px; padding-left: 15px; }
.right-news p { font-size: 14px; color: #ffffff; text-align: justify; line-height: 23px; padding: 13px 0; }
.right-news b { display: block; width: 100%; height: 1px; background: #ffffff; position: relative; top: 15px; z-index: 0; }
.detail { padding-left: 10px; text-align: center; line-height: 25px; color: #ffffff; font-size: 14px; background: #00b89c; position: relative; z-index: 9; float: right; }
.detail span { display: block; width: 80px; height: 25px; border: 1px solid #ffffff; }
.bottom-part { margin-top: 20px; }
.bottom-part h2 { background: url(honor.png) center no-repeat; height: 42px; text-align: center; }
.bottom-part h2 em { font-size: 22px; font-weight: normal; display: block; line-height: 22px; position: relative; top: -7px; }
.bottom-part h2 span { font-size: 12px; font-family: Arial;  position: relative; top: -3px; }
.bottom-part li { float: left; width: 279px; margin-right: 28px; }
.bottom-part li img { padding: 4px; border: 1px solid #e4e4e4; }
.bottom-part li span { display: block; font-size: 14px; text-align: center; }
.bottom-part li:last-child { margin-right: 0; }
.bottom-part ul { margin-top: 20px; }

.coo-con { position: absolute; width: 100%; top: 50%; margin-top: -207px; }
.left-coo { float: left; width: 406px; position: relative; left: 0; }
.left-coo a { display: block; width: 150px; height: 30px; line-height: 30px; border: 1px solid #5d5d5d; text-align: center; font-size: 14px; float: right; margin: 20px 0; }
.tel-phone { font-size: 43px; font-family: Impact; color: #e60000; line-height: 86px; }
.tel-phone img { vertical-align: middle; margin-right: 15px; }
.right-coo { float: right; width: 745px; margin-top: 25px; position: relative; right: 0; }
.right-coo li { position: relative; float: left; width: 239px; height: 180px; border: 1px solid #e4e4e4; text-align: center; margin-left: 10px; margin-bottom: 10px; overflow: hidden; }
.right-coo li .dark { position: absolute; top: 0; width: 100%; height: 179px; background: rgba(255, 3, 3, .6);
    -webkit-transform: translate(-239px, -179px) rotate(45deg);
    -moz-transform: translate(-239px, -179px) rotate(45deg);
    -ms-transform: translate(-239px, -179px) rotate(45deg);
    -o-transform: translate(-239px, -179px) rotate(45deg);
    transform: translate(-239px, -179px) rotate(45deg);
    transition-duration: .5s;
}
.right-coo li:hover .dark {
    -webkit-transform: translate(0, 0) rotate(45deg);
    -moz-transform: translate(0, 0) rotate(45deg);
    -ms-transform: translate(0, 0) rotate(45deg);
    -o-transform: translate(0, 0) rotate(45deg);
    transform: translate(0, 0) rotate(45deg);
}

.right-coo li:hover .dark img{
    -webkit-transform:translate(-7px,4px) rotate(-45deg);
    -moz-transform:translate(-7px,4px) rotate(-45deg);
    -ms-transform:translate(-7px,4px) rotate(-45deg);
    -o-transform:translate(-7px,4px) rotate(-45deg);
    transform:translate(-7px,4px) rotate(-45deg);
}

.right-coo li:hover .dark span {
    -webkit-transform:translate(25px,-7px) rotate(-45deg);
    -moz-transform:translate(25px,-7px) rotate(-45deg);
    -ms-transform:translate(25px,-7px) rotate(-45deg);
    -o-transform:translate(25px,-7px) rotate(-45deg);
    transform:translate(25px,-7px) rotate(-45deg);
}
.right-coo li .dark img { position: relative; top: -15px; }
.right-coo li span { display: block; line-height: normal; position: relative; top: -65px; color: #ffffff; font-size: 14px; }
.right-coo li a { display: block; line-height:180px; }
.right-coo li a img { vertical-align: middle; }
.right-coo li:nth-child(3n+1) { margin-left: 0; }

.news-con-s { position: absolute; width: 100%; top: 50%; margin-top: -260px; }
.wrap0 { width: 1050px; margin: 0 auto; overflow: hidden; }
.left-news-s { float: left; width: 500px; position: relative; left: 0; }
.left-news-s h2 { background: url(ti-s.png) left top no-repeat; padding-top: 60px; font-weight: normal; color: #ffffff; padding-bottom: 20px; padding-left: 87px; }
.left-news-s h2 span { font-size: 24px;  }
.left-news-s h2 em { font-size: 18px; text-transform: uppercase; }
.right-news-s { float: right; width: 500px; padding-top: 115px;  position: relative; right: 0; }

.news-title a { float: right; display: block; width: 82px; height: 30px; text-align: center; line-height: 30px; font-size: 14px; border: 1px solid #333333;  }
.news-title span { font-size: 24px; }
.left-news-s h1 { margin-top: 14px; }
.left-news-s li { font-size: 14px; padding: 8px 0; border-bottom: 1px dashed #59595b;  }
.left-news-s li:last-child { border-bottom: none; }
.left-news-s li span { float: right; }
.right-news-s h1 { margin-top: 14px; }
.right-news-s li { font-size: 14px; padding: 8px 0; border-bottom: 1px dashed #59595b;  }
.right-news-s li:last-child { border-bottom: none; }
.right-news-s li span { float: right; }

.con-con { position: absolute; width: 100%; top: 50%; margin-top: -250px; }
.co-title { text-align: center; }
.co-title h2 { font-size: 28px; color: #333; font-weight: normal; line-height: 28px; }
.co-title b { display: block; width: 65px; height: 1px; background: #ec523f; margin: 15px auto; }
.co-title p { font-size: 14px; }
.con-con ul { margin-top: 30px; padding-bottom: 30px; border-bottom: 2px solid #e1e1e1; }
.con-con li { float: left; width: 350px; text-align: center; font-size: 16px; color: #333333; }
.con-con li span { display: block; line-height: 70px; }
.con-con li span img {vertical-align: middle; }

.form h1 { font-size: 28px; font-weight: normal; text-align: center; padding: 20px 0; }
.form dt { float: left; width: 510px; border: 1px solid #a9a9a9; margin-right: 26px; margin-bottom: 20px; }
.form dt input { display: block; width: 505px; padding-left: 5px; line-height: 30px; font-size: 14px; }
.form dt:last-child { margin-right: 0; }
.form textarea { width: 1038px; border: 1px solid #a9a9a9; padding: 5px; height: 100px; }
.form .btn { display: block; width: 106px; line-height: 30px; font-size: 14px; color: #ffffff; background: #ec523f; margin: 10px auto 0; }


.active .top-title b { width: 100%; -webkit-animation:  title-effect-b .5s 2;
    -o-animation: title-effect-b .5s 2;
    animation: title-effect-b .5s 2; }
.active .top-title span { -webkit-animation:  title-effect-font .7s 1;
    -o-animation: title-effect-font .8s 1;
    animation: title-effect-font .8s 1; }

.active .left-news-s ,.active .left-coo, .active .left-news , .active .left-pro { -webkit-animation:  left-in 1.2s 1;
    -o-animation: left-in 1.2s 1;
    animation: left-in 1.2s 1; }
.left-news-s ,.left-coo, .left-news, .left-pro{ -webkit-animation:  left-out 1.2s 1;
    -o-animation: left-out 1.2s 1;
    animation: left-out 1.2s 1; }

.active .right-news-s ,.active .right-coo, .active .right-news, .active .right-pro{ -webkit-animation:  right-in 1.2s 1;
    -o-animation: right-in 1.2s 1;
    animation: right-in 1.2s 1; }
.right-news-s ,.right-coo, .right-news, .right-pro { -webkit-animation:  right-out 1.2s 1;
    -o-animation: right-out 1.2s 1;
    animation: right-out 1.2s 1; }

.active .pro-list {
    -webkit-animation:  opacity-in 1.2s 1;
    -o-animation: opacity-in 1.2s 1;
    animation: opacity-in 1.2s 1;
}

.pro-list {
    -webkit-animation:  opacity-out 1.2s 1;
    -o-animation: opacity-out 1.2s 1;
    animation: opacity-out 1.2s 1;
}

/*网页标题效果*/

@keyframes title-effect-b {

    0% {
        top: -50px;
    }
    50%{
        top: 13px;
    }
}
@-moz-keyframes title-effect-b {

    0% {
        top: -50px;
    }
    50%{
        top: 13px;
    }
}

@keyframes title-effect-font {

    0% {
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -ms-transform: scale(0);
        -o-transform: scale(0);
        transform: scale(0);
    }
    50%{
        -webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        -o-transform: scale(1.5);
        transform: scale(1.5);
    }
    100%{
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
    }
}
@-moz-keyframes title-effect-font {

    0% {
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -ms-transform: scale(0);
        -o-transform: scale(0);
        transform: scale(0);
    }
    50%{
        -webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        -o-transform: scale(1.5);
        transform: scale(1.5);
    }
    100%{
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
    }
}




/*资讯动态*/
@keyframes left-in {

    0% {
        left: -500px;
    }

    100% {
        left: 0;
    }

}

@-moz-keyframes left-in {
    0% {
        left: -500px;
    }

    100% {
        left: 0;
    }
}


@keyframes left-out {

    0% {
        left: 0;
    }

    100% {
        left: -500px;
    }

}

@-moz-keyframes left-out {
    0% {
        left: 0;
    }

    100% {
        left: -500px;
    }
}

@keyframes right-in {

    0% {
        right: -500px;
    }

    100% {
        right: 0;
    }

}

@-moz-keyframes right-in {
    0% {
        right: -500px;
    }

    100% {
        right: 0;
    }
}


@keyframes right-out {

    0% {
        right: 0;
    }

    100% {
        right: -500px;
    }

}

@-moz-keyframes right-out {
    0% {
        right: 0;
    }

    100% {
        right: -500px;
    }
}


/*渐隐渐现*/

@keyframes opacity-in {

    0% {
        opacity: 0;
        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    }

    100% {
        opacity: 1;
        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    }

}

@-moz-keyframes opacity-out {
    0% {
        opacity: 1;
        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    }

    100% {
        opacity: 0;
        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    }
}