body{margin:0; color:#333;font-family:"微软雅黑";}
input, textarea, select{margin:0;padding:0;font-size:14px;outline:none;resize:none;}
html:root body, html:root input, html:root button, html:root textarea, html:root select{font-family:Tahoma, Geneva, '\5fae\8f6f\96c5\9ed1', '\5B8B\4F53';}
form, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, p{margin: 0;padding: 0;list-style: none; font-weight:normal;}
a{text-decoration: none;color: #2b2b2b;outline: none;}
a:hover{text-decoration:none;}
a img{border: none;}
i, em{font-style: normal;}
body{ background:#efefef;/* url(../images/bj.jpg) repeat; background-attachment: fixed;*/width: 100%; background-size: cover; height: 100%;}
/*ALL*/
.showwrap{ width: 100%; overflow: hidden; position: absolute; z-index: 1;}
/*左侧导航*/
.left-nav{ width:12.5%; background: /*#091720*/#1C2135; height: 100%; float: left; display: block; overflow: hidden; margin-bottom: -10000px; padding-bottom: -10000px; position: fixed;}
.left-nav-top{ width:80%; line-height: 79px; height: 79px;color: #fff;  padding-top: 50px; text-align: right;border-bottom: #E66224 solid 1px; }
.left-nav-top img{ width: 180px; height: auto;}
.left-nav ul{ width:100%; text-align: right; padding-top: 24px; overflow: hidden; font-size: 14px; font-family: "宋体"}
.left-nav ul li{ float: left; padding:15px 0; width: 80%;}
.left-nav ul li a{ color: #fff; padding-left: 15px;}
.left-nav ul li a:hover,.left-nav ul li a.active{font-size: 26px;-webkit-transition: 0.5s;-o-transition: 0.5s;transition: 0.5s;}
.left-nav ul li a .f44336{border-left: #f44336 solid 4px;height: 8px;display: inline-block;padding-right: 10px;}
.left-nav ul li a .ffc107{border-left: #ffc107 solid 4px;height: 8px;display: inline-block;padding-right: 10px;}
/*右侧内容展示*/
.right-bj{ width: 87.5%; background-size: cover; overflow: hidden;vertical-align: top; margin-left: 240px;}
.right-bj-top{ height: 50px; line-height: 50px; /*padding-top: 50px;background: #f44336;*/ color: #fff; width: 100%; padding-top: 30px;}
.right-bj-top h1{ padding-left: 30px; font-size: 28px;}
/**/
.right-container{ display: block; overflow: hidden;padding: 45px 30px 0 0; background: #efefef;}
.right-one{}
.right-one ul{ float: left; width: 90%;}
.right-one ul li{ width: 43%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 38px 30px; height:360px; margin-left:30px; overflow: hidden;}
.right-one ul li h3{ color: #333; font-size: 24px;padding-bottom: 15px;}
.right-one ul li p{ font-size: 12px; color: #999; font-family: "宋体"; padding-bottom:20px; line-height: 18px;}
.right-one ul li .web{ /*background: #000; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; overflow: hidden;*/}
.right-one ul li .web img{ width:485px;height: auto; margin-right: 20px;}
.right-two{}
.right-two ul{ float: left; width: 90%;}
.right-two ul li{ width: 92%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 30px; height:550px; margin-left:30px;}
.right-two ul li h3{ color: #333; font-size: 24px;padding-bottom: 15px;}
.right-two ul li p{ font-size: 12px; color: #999; font-family: "宋体"; padding-bottom:20px; line-height: 18px;}
/**/
.right-two ul li .app img{ width:225px;height: auto; margin-right: 30px;}
.right-two ul li .fish img{ width:500px;height: auto; margin-right: 30px; margin-top: 20px;}
/*分页符*/
.pagination-2{height:85px; text-align:center; float: right; width: 10%; position: fixed; right:0;}
.pagination-2 button{width:45px; height:43px; display:inline-block; margin:0 5px; border:none; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
.pagination-2 .works-prev{background:#e66224 url(../images/works_arr.png) no-repeat 0 -3px; cursor: pointer;}
.pagination-2 .works-prev:hover{background:#1c2135 url(../images/works_arr.png) no-repeat -56px -3px;}
.pagination-2 .works-next{background:#e66224 url(../images/works_arr.png) no-repeat -54px -53px; cursor: pointer;}
.pagination-2 .works-next:hover{background:#1c2135 url(../images/works_arr.png) no-repeat 0 -53px;}
.works-prev, .works-next, .works-more{border-radius:2px; vertical-align:middle;}
/*媒体查询*/
@media (min-width: 1441px) and (max-width: 1600px){
  .right-one ul li{ width: 41%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 38px 30px; height:280px; margin-left:30px; overflow: hidden;}
  .right-one ul li .web img{ width:400px;height: auto; margin-right: 20px;}
}
@media (min-width: 1367px) and (max-width: 1440px){
  .right-one ul li{ width: 39%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 38px 30px; height:300px; margin-left:30px; overflow: hidden;}
  .right-one ul li .web img{ width:420px;height: auto; margin-right: 20px;}
  .right-two ul li .fish img{ width:400px;height: auto; margin-right: 30px; margin-top: 20px;}
}
@media (min-width: 1281px) and (max-width: 1366px){
  .right-one ul li{ width: 38%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 38px 30px; height:300px; margin-left:30px; overflow: hidden;}
  .right-one ul li .web img{ width:380px;height: auto; margin-right: 20px;}
  .right-two ul li .fish img{ width:390px;height: auto; margin-right: 30px; margin-top: 20px;}
}
@media (max-width: 1280px){
  .right-two ul li .app img{ width:200px;height: auto; margin-right: 30px;}
  .right-two ul li{ width: 82%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 30px; height:auto; margin-left:30px;}
  .left-nav{ width:18.5%; background: /*#091720*/#1C2135; height: 100%; float: left; display: block; overflow: hidden; margin-bottom: -10000px; padding-bottom: -10000px; position: fixed;}
  .right-one ul li{ width: 37%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 38px 30px; height:300px; margin-left:30px; overflow: hidden;}
  .right-one ul li .web img{ width:357px;height: auto; margin-right: 20px;}
  .right-two ul li .fish img{ width:340px;height: auto; margin-right: 30px; margin-top: 20px;}
}
@media (min-width: 1281px) and (max-width: 1600px){
  .right-two ul li{ width: 90%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 30px; height:auto; margin-left:30px;}
  .right-two ul li .app img{ width:200px;height: auto; margin-right: 50px;}
  .left-nav-top img{ width: 130px; height: auto;}
  .left-nav{ width:15%; background: /*#091720*/#1C2135; height: 100%; float: left; display: block; overflow: hidden; margin-bottom: -10000px; padding-bottom: -10000px; position: fixed;}
}
@media (min-width: 1367px) and (max-width: 1440px){
  .right-two ul li{ width: 86%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 30px; height:auto; margin-left:30px;}
  .right-two ul li .app img{ width:200px;height: auto; margin-right: 50px;}
  .left-nav-top img{ width: 130px; height: auto;}
  .left-nav{ width:16.5%; background: /*#091720*/#1C2135; height: 100%; float: left; display: block; overflow: hidden; margin-bottom: -10000px; padding-bottom: -10000px; position: fixed;}

}
@media (min-width: 1281px) and (max-width: 1366px){
  .right-two ul li{ width: 84%; float: left; overflow:hideen; margin-bottom: 30px; background: #fff; padding: 30px; height:500px; margin-left:30px;}
  .right-two ul li .app img{ width:200px;height: auto; margin-right: 50px;}
  .left-nav-top img{ width: 130px; height: auto;}
  .left-nav{ width:16.5%; background: /*#091720*/#1C2135; height: 100%; float: left; display: block; overflow: hidden; margin-bottom: -10000px; padding-bottom: -10000px; position: fixed;}

}
@media (max-width:481px){
  .left-nav ul li a:hover, .left-nav ul li a.active {
    font-size: 14px;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    font-weight: bold;
    color: #e66224;
}
  .right-two ul li .fish img{ width:94%;height: auto; margin-right:0; margin-top:0;}
  .right-two ul li h3{ color: #333; font-size: 18px;padding-bottom: 0; padding-right: 60px;}
  .left-nav{ width:100%; background: /*#091720*/#1C2135; height: 100%; float: left; display: block; overflow: hidden;  position: fixed; margin:0; padding:0; height: 80px;}
  .left-nav-top img{ width: 100px; height: auto; margin-top:25px; float: left; padding-left: 10px;}
  .left-nav-top{ width:110px; color: #fff;  padding-top: 0px; text-align: right;border-bottom:none; float: left;}
  .left-nav ul{  text-align: right; padding-top:0; overflow: hidden; font-size: 14px; font-family: "微软雅黑"; float: right; width: 216px;}
  .left-nav ul li{ float: left; padding:10px 0; width: auto;}
  .left-nav ul li a{ color: #fff; padding-left: 10px; line-height: 60px;}
  .right-two ul li{ width:100% !important; float: left; overflow:hideen; margin-bottom: 10px; background: #fff; padding:20px 15px 20px 11px; height:auto; margin-left:0;}
  .right-bj{ width: 100%; background-size: cover; overflow: hidden;vertical-align: top; margin-left:0;}
  .right-two ul li .app img{ width:120px;height: auto; margin-right: 10px; margin-bottom: 5px;}
  .right-two ul{ float: left; width: 100%; margin-top: 37px;}
  .right-container{ display: block; overflow: hidden;padding: 45px 0 0 0; background: #efefef;}
  .pagination-2{text-align:center; float: right; width: 10%; position: fixed; right:20px; margin-top: 45px;}
  .pagination-2 .works-prev{background:#e66224 url(../images/works_arr.png) no-repeat 0 -3px; cursor: pointer; margin-bottom: 15px;}
  .pagination-2 .works-prev:hover{background:#1c2135 url(../images/works_arr.png) no-repeat -56px -3px;}
  .pagination-2 .works-next{background:#e66224 url(../images/works_arr.png) no-repeat -54px -53px; cursor: pointer;}
  .pagination-2 .works-next:hover{background:#1c2135 url(../images/works_arr.png) no-repeat 0 -53px;}
  .left-nav ul li a .f44336{border-left:none;height: auto;display: inline-block;padding-right: 10px;}
  .left-nav ul li a .ffc107{border-left: none;height: auto;display: inline-block;padding-right: 10px;}
  .right-one{ margin-top: 36px;}
  .right-one ul li{ width: 100%; float: left; overflow:hideen; margin-bottom: 10px; background: #fff; padding: 20px 15px 20px 11px; height:auto; margin-left:0; overflow: hidden;}
  .right-one ul li h3{ color: #333; font-size: 18px;padding-bottom: 5px; padding-right: 20px;}
  .right-one ul li .web img{ width:92%;height: auto; margin-right: 20px;}
  .right-two ul li p{ font-size: 12px; color: #999; font-family: "宋体"; padding-bottom:20px; line-height: 18px; padding-right: 20px;}
  .right-one ul{ float: left; width: 100%;}
  .right-one ul li p{ font-size: 12px; color: #999; font-family: "宋体"; padding-bottom:20px; line-height: 18px; padding-right: 20px;}
  .hidden-xs{ display: none;}
}

@media (max-width:320px){
  .left-nav ul li a {
    color: #fff;
    padding-left: 10px;
    line-height: 60px;
    font-size: 12px;
  }
  .left-nav ul {
    text-align: right;
    padding-top: 0;
    overflow: hidden;
    font-size: 14px;
    font-family: "微软雅黑";
    float: right;
    width: 198px;
  }
  .left-nav ul li a:hover, .left-nav ul li a.active {
    font-size: 12px;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    font-weight: bold;
    color: #e66224;
  }

}

@media (min-width: 769px) and (max-width: 1025px){
  .left-nav {
    width: 23.5%;
    background: /*#091720*/#1C2135;
    height: 100%;
    float: left;
    display: block;
    overflow: hidden;
    margin-bottom: -10000px;
    padding-bottom: -10000px;
    position: fixed;
  }
  .pagination-2 {
    height: 85px;
    text-align: center;
    float: right;
    width: 8%;
    position: fixed;
    right: 0;
 }
 .right-two ul li {
    width: 78%;
    float: left;
    overflow: hideen;
    margin-bottom: 30px;
    background: #fff;
    padding: 30px;
    height: auto;
    margin-left: 30px;
 }
 .right-two ul li .app img {
    width: 146px;
    height: auto;
    margin-right: 30px;
 }
 .pagination-2 .works-next {
    background: #e66224 url(../images/works_arr.png) no-repeat -54px -53px;
    cursor: pointer;
    margin-top: 10px;
 }
 .right-one ul li {
    width: 78.5%;
    float: left;
    overflow: hideen;
    margin-bottom: 30px;
    background: #fff;
    padding: 38px 30px;
    height: 300px;
    margin-left: 30px;
    overflow: hidden;
 }
 .right-one ul li .web img {
    width: 450px;
    height: auto;
    margin-right:0;
 }
 .right-two ul li .fish img {
    width: 271px;
    height: auto;
    margin-right: 30px;
    margin-top: 20px;
 }

}

@media (min-width: 500px) and (max-width: 768px){
  .left-nav {
    width: 26.5%;
    background: /*#091720*/#1C2135;
    height: 100%;
    float: left;
    display: block;
    overflow: hidden;
    margin-bottom: -10000px;
    padding-bottom: -10000px;
    position: fixed;
  }
  .pagination-2 {
    height: 85px;
    text-align: center;
    float: right;
    width: 8.5%;
    position: fixed;
    right: 0;
 }
 .right-two ul li {
    width: 69%;
    float: left;
    overflow: hideen;
    margin-bottom: 30px;
    background: #fff;
    padding: 30px;
    height: auto;
    margin-left: 0;
 }
 .right-two ul li .app img {
    width: 99px;
    height: auto;
    margin-right: 30px;
 }
 .pagination-2 .works-next {
    background: #e66224 url(../images/works_arr.png) no-repeat -54px -53px;
    cursor: pointer;
    margin-top: 10px;
 }
 .right-one ul li {
    width: 69%;
    float: left;
    overflow: hideen;
    margin-bottom: 30px;
    background: #fff;
    padding: 38px 30px;
    height: 300px;
    margin-left: 0;
    overflow: hidden;
 }
 .right-one ul li .web img {
    width: 370px;
    height: auto;
    margin-right:0;
 }
 .right-two ul li .fish img {
    width: 390px;
    height: auto;
    margin-right: 30px;
    margin-top: 10px;
 }

}




@media (min-width: 2500px){
  .left-nav{ width:9%; background: /*#091720*/#1C2135; height: 100%; float: left; display: block; overflow: hidden; margin-bottom: -10000px; padding-bottom: -10000px; position: fixed;}
  .right-bj{ width: 65.5%; background-size: cover; overflow: hidden;vertical-align: top; margin-left: 240px;}
  .pagination-2{height:85px; text-align:center; float: right; width: 10%; position: fixed; right:24%;}
}