@charset "utf-8";
/*初始化  reset*/
body,button,dd,dl,dt,form,h1,h2,h3,h4,h5,h6,hr,input,li,ol,p,td,textarea,th,ul{margin:0;padding:0}
body,button,input,select,textarea{font:14px/1.5 "微软雅黑",sans-serif; color:#333;}
h1,h2,h3,h4,h5,h6{font-size:100%}
em,i{font-style:normal}
ol,ul{list-style:none}
a{text-decoration:none;color:#333;}
img{border:0; display:block;}
textarea{resize:none;}
a,input,button,select,textarea{outline:none;}
a,button{cursor:pointer;}
/*清除浮动*/
.clearfix:before,.clearfix:after{display:table;content:"";}
.clearfix:after{clear:both;}
.clearfix{zoom:1;}
.clearfix:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-table; }
*html .clearfix { height: 1%; }
.clearfix { display: block; }
*+html .clearfix { min-height: 1%; }
/*-------------------------------banner----------------------------------------------------*/
.banner{ width:100%; }
.banner img{ width:100%;}
.one{ width:1200px; overflow:hidden; margin:auto; margin-top:25px;}
.one dl{ width:1200px; overflow:hidden;}
.one dl dt{ width:450px; float:left;}
.one dl img{ width:100%;}
.one dl dd{ width:730px; float:right;}
.bt{ text-align:center; margin:15px;font-size:24px; text-align:center; color:#e23e4e;}
.bt strong{ display:inline-block;background:url(../images/bt_03.png) no-repeat; width:260px; height:64px; text-align:center; line-height:64px;}
.one dl dd ul{ width:100%; overflow:hidden;}
.one dl dd ul li{ width:100%; margin:5px; padding:1%; /*box-shadow:0px 0px 10px #999;*/}
.neirong{ overflow:hidden;}
.neirong p{ height:150px;}
.neirong strong{ display:block; padding-bottom:10px; border-bottom:1px solid #CCC; color:#525659; height:45px;}
.neirong span{ display:inline-block; float:right; font-size:14px; margin-top:5px; color:#a1a1a1;}

.two{ width:100%; overflow:hidden; }
.two p{ background:url(../images/bt_06.gif) no-repeat; background-size:100% 100%; width:100%;}
.two span{ width:1200px; margin:auto; display:block; overflow:hidden;}
.two span img{ width:100%;}

.main { width: 1200px; margin: 0 auto; } 


.three{ width:100%;overflow:hidden;}
.three_con{ width:100%; background-size:100% 100%; margin:auto; overflow:hidden; padding-bottom:30px;}
.three_con dl{ overflow:hidden; width:1200px; margin:auto; margin-top:30px;}
.three_con dl dt{ width:900px; float:left; padding:20px;}
.wenzi{text-indent:2em; font-weight:normal;color:#666;}
.wenzi strong{ font-size:20px; color:#006eb9; }
.three_con dl dt ul{ width:100%; overflow:hidden; margin-top:20px;}
.three_con dl dt ul li{ width:23%; overflow:hidden; background-color:rgba(0,110,185, 1); background:#F2F2F2; padding:2%; margin:8px; float:left; height:260px; border-radius:5px; border-bottom:5px solid #006eb9;}
.three_con dl dt ul li:hover{background-color:rgba(0,110,185, 1); color:#FFF;border-bottom:5px solid #f3c51d;}
.three_con dl dt ul li strong{ font-size:24px;color:#FFF;color:#f3c51d;}
.three_con dl dt ul li p{ font-weight:normal; font-size:14px;}
.three_con dl dd{ width:300px; height:440px; float:right; padding:30px; background-color:rgba(255,255,255, 0.7);background-color:rgba(0,110,185, 1);}
.three_con dl dd strong{ font-size:20px; color:#006eb9; display:block; margin-bottom:10px;color:#fff;}
.three_con dl dd p{ color:#006eb9; line-height:26px;color:#fff;}















.foot{ width:100%; padding:10px 0; color:#FFF; text-align:center; background:#4A4A4A;}


.demo{
    
}
.box{
    position: relative;
    perspective: 1000px;
}
.box .box-img{
    transform: rotateY(0);
    transition: all 0.50s ease-in-out 0s;
}
.box:hover .box-img{
    transform: rotateY(-90deg);
}
.box .box-img img{
    width: 100%;
    height: auto;
}
.box .box-content{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    padding:20px;
    text-align: center;
    background: rgba(0,0,0,0.7); background:url(../images/bj.jpg) no-repeat; background-size:100% 100%;
    transform: rotateY(90deg);
    transition: all 0.50s ease-in-out 0s;
}
.box:hover .box-content{
    transform: rotateY(0);
}
.box .title{
    font-size: 20px;
    color: #fff;
    text-transform: uppercase;
}
.box .description{
    font-size: 14px;
    line-height: 24px;
    color: #fff;
}
.box .title:after,
.box .description:after{
    content: "";
    width: 80%;
    display: block;
    border-bottom: 1px solid #fff;
    margin: 15px auto;
}
.box .social-links{
    margin: 0;
    padding: 0;
    list-style: none;
}
.box .social-links li{
    display: inline-block;
    margin: 0 10px;
}
.box .social-links li a{
    font-size: 20px;
    color: #a6a6a6;
}
.box .social-links li a:hover{
    text-decoration: none;
    color: #fff;
}
@media only screen and (max-width: 990px) {
    .box{  margin-bottom:20px; }
}
@media only screen and (max-width: 479px) {
    .box .box-content{ padding: 20px; }
}