@charset "utf-8";
html{
    margin:0px;
    padding:0px;
    z-index:1;
    overflow-x:hidden;
    height:100%;
    }
    
body{
    margin:0 auto;  
    padding:0px; 
    font-size:12px; 
    font-family:arial,"Hiragino Sans GB","Microsoft Yahei",sans-serif;
    background:#fff;
    z-index:99;
    height:100%;
    width:100%;
    color:#585757;
    }
    
a{
    font-size:12px; 
    text-decoration:none;
    }
    
a:hover{
    font-size:12px; 
    color:#a30000;
    text-decoration:none;
    }
    
p{
    padding:0px; 
    margin:0px;
    }
    
h1,h2,h3,h4,h5,h6{
    margin:0px;
    padding:0px; 
    font-weight:normal;
    }
    
dl,dt,dd,ul,li{
    margin:0px; 
    padding:0px; 
    list-style-type:none;
    text-decoration:none;
    }
    
input{
    outline:none;
    }
    
img{
    border:0px; 
    margin:0px; 
    padding:0px;
    }
em{
    font-style:normal;
    }
tr{
    _border-top:1px solid #bfbfbf;
    _border-bottom:1px solid #bfbfbf;
}
h1,h2,h3,h4,h5,h6,b{ font-weight: normal;}
/*正式*/
.page1{ width:100%; height:781px; background:url(/templets/default/images/newimg/HC-TW60-1.jpg) no-repeat center center; background-size: 1920px 721px; display: inline-block;}
.con{ width:980px; margin:0 auto;}
.page1 .con h2{ font-size: 48px; margin:80px 0 20px; text-align: center;opacity:0;}
.page1 .con p{ font-size: 18px; text-align: center; line-height: 33px;opacity:0;}
.page1 .con{ position:relative;}
.page1 .con .btn{ position:absolute; left:100px; top:210px; width:165px;opacity:0;}
.page1 .con .btn li p{ text-align: center; font-size: 20px;line-height: 30px;}
.page1 .con .btn li{width:165px; }
.page1 .con .btn li img{  width:60px; height:60px; display:block;  margin:0 auto 10px;}
.page1 .con .btn li:nth-child(2){ margin-top:60px;}

.page2{ width:100%; height:890px; background:url(/templets/default/images/newimg/HC-TW60-2.jpg) no-repeat center center; background-size: 1920px 890px; display: inline-block;}
.page2 .con h2{ font-size: 48px; margin:50px 0 20px; text-align: center; color:#fff; opacity:0;}
.page2 .con p{ font-size: 18px; text-align: center; line-height: 33px; color:#fff;opacity:0;}

.page3{ width:100%; height:1272px; background:url(/templets/default/images/newimg/HC-TW60-3.jpg) no-repeat center center; background-size: 1920px 1272px; display: inline-block;}
.page3 .con{ position:relative;}
.page3 .con p{ font-size: 48px; text-align: right; line-height:60px; position:absolute; right:0; top:75px; opacity:0;}

.page4{ width:100%; height:870px; background:url(/templets/default/images/newimg/HC-TW60-4.jpg) no-repeat center center; background-size: 1920px 870px; display: inline-block;}
.page4 .con h2{ font-size: 48px; margin:50px 0 20px; opacity:0;}
.page4 .con p{ font-size: 18px;  line-height: 33px;  opacity:0;}

.page5{ width:100%; height:792px; background:url(/templets/default/images/newimg/HC-TW60-5.jpg) no-repeat center center; background-size: 1920px 792px; display: inline-block;}
.page5 .con img{ margin-top:77px; opacity:0;}
.page5 .con p{ font-size: 48px; line-height:77px; opacity:0;}


div[class^="page"]{ transition:all 3s;}
.pt-page-moveFromBottomFade {
    -webkit-animation: moveFromBottomFade 2.5s ease both;
    animation: moveFromBottomFade 2.5s ease both;
}
.pt-page-moveFromBottomFade-1 {
    -webkit-animation: moveFromBottomFade-1 2.5s ease both;
    animation: moveFromBottomFade 2.5s ease both;
}
.pt-page-moveFromBottomFade-2 {
    -webkit-animation: moveFromBottomFade-1 3.5s ease both;
    animation: moveFromBottomFade 3.5s ease both;
}
.pt-page-moveFromBottomFade1 {
    -webkit-animation: moveFromBottomFade 3.5s ease both;
    animation: moveFromBottomFade 3.5s ease both;
}
.pt-page-moveFromBottomFade2 {
    -webkit-animation: moveFromBottomFade 4.5s ease both;
    animation: moveFromBottomFade 4.5s ease both;
}

@-webkit-keyframes moveFromBottomFade {
    from { opacity: 0; -webkit-transform: translateY(100%); }
}
    to{opacity: 1; }
@keyframes moveFromBottomFade {
    from { opacity: 0; -webkit-transform: translateY(100%); transform: translateY(100%); }
    to{opacity: 1; }
}

@-webkit-keyframes moveFromBottomFade-1 {
    from { opacity: 0; -webkit-transform: translateY(200%); }
}
    to{opacity: 1; }
@keyframes moveFromBottomFade-1 {
    from { opacity: 0; -webkit-transform: translateY(200%); transform: translateY(200%); }
    to{opacity: 1; }
}