/*

函信网络 设计编写 原创设计 请勿仿制

公司网址:www.hanett.com

HMM编写

*/





@font-face {

  font-family: 'icomoon';

  src:  url('../fonts/icomoon.eot?2l80l');

  src:  url('../fonts/icomoon.eot?2l80l#iefix') format('embedded-opentype'),

    url('../fonts/icomoon.ttf?2l80l') format('truetype'),

    url('../fonts/icomoon.woff?2l80l') format('woff'),

    url('../fonts/icomoon.svg?2l80l#icomoon') format('svg');

  font-weight: normal;

  font-style: normal;

}





[class^="icon-"], [class*=" icon-"] {

  /* use !important to prevent issues with browser extensions that change fonts */

  font-family: 'icomoon' !important;

  speak: none;

  font-style: normal;

  font-weight: normal;

  font-variant: normal;

  text-transform: none;

  line-height: 1;



  /* Better Font Rendering =========== */

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

}



.icon-earth:before {

  content: "\e900";

}

.icon-right:before {

  content: "\e901";

}



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



.head{ height: 80px; position: fixed; background: #fff; width: 100%; left: 0; top: 0; z-index: 2;}

.head .logo{ margin-top: 20px; height: 40px;}

.head .logo img{ height: 40px;}

.head .nav{ width: 707px; margin-top: 15px;}

.head .nav li{ float: left; font-size: 16px; margin-right: 27px; line-height: 62px;  height: 62px; width: 80px; text-align: center; position: relative;}

.head .nav li a{ color:#3b2c04}

.head .nav li:last-child{  margin-right:0px; }

.head .nav li:last-child a{ color: #666;}

.head .nav li:last-child span{vertical-align: -3px; width: 34px; height: 34px; background: #999999; border-radius: 50%; color: #fff; display: inline-block; text-align: center; line-height: 34px; font-size: 20px;}

.head .nav li:hover{ border-bottom: 3px solid #ffba00;}

.head .nav li:hover a{ color: #333;}

.head .nav li.on{ border-bottom: 3px solid #ffba00;}

.head .nav li.on a{ color: #333;}



.head .nav li:last-child:hover{ border-bottom:none;}

.head .nav li:last-child:hover a{ color: #333;}

.head .nav li:last-child.on{ border-bottom:none;}

.head .nav li:last-child.on a{ color: #333;}



.head .nav li ul{position:absolute; width:100px;left:-10px;background: #f4f4f4; top: 65px; display: none;margin-top: -3px; }

.head .nav li ul li{ height: 36px; width:100px;line-height: 36px; font-size: 14px; text-align: center;}

.head .nav li ul li:last-child{width:100px;}

.head .nav li ul li:hover{ border: none;}

.head .nav li ul li:hover a{ color: #ffba00;}

.banner{ position: relative; z-index: 1;}

.banner img{ display: block;}

#owl-demo{position:relative;width:100%;margin:0 auto;}

#owl-demo .itme img{ width: 100%; }

/* 缩略图 */

.owl-controls{position:absolute;left:0;bottom:30px;width:96%;height:10px;text-align:center;}

.owl-dot{position:relative;display:inline-block;width:10px;height:10px;margin:0 5px;*display:inline;*zoom:1;vertical-align:middle;overflow:hidden; float: right; border-radius: 50%;}

.owl-dot img{width:100%;height:100%;}

.owl-controls .active{    background: #ffba00; }

.owl-controls span{position:absolute;left:0;top:0;width:10px;height:10px;background:rgba(0,0,0,.5);}

.owl-controls .active span{width:10px;height:10px;background:rgba(0,0,0,0);}

.gray{ background: #f5f5f5;}

.wrapper{ padding: 20px 0 0 0;}

.wrapper1{ padding: 80px 0;}

.main-title{ text-align: center;}

.main-title h6{ font-size: 14px; font-weight: 500;color: #666; }

.main-title h4{ font-size: 30px; font-weight: 500;color: #333; margin-top: 20px; }

.main-title h4::after{ content: ""; display: block; width: 50px; height: 2px; background: #ffba00; margin: 20px auto}

.product{ position: relative;}

.product .swiper-container{ margin-top: 30px;}

.product .title{ width: 390px; background: #fff; text-align: center; height: 100px;font-size: 16px; color: #404040; position: relative;}

.product .title p{ width: 90%; left:5%; position: absolute; top: 50%; transform: translateY(-50%); line-height: 22px;}

.product .list{ width: 80px; height: 45px; line-height: 45px; border: 1px solid #ddd; margin: 0 auto; display: inline-block;}
.product .list img{ margin-top: 15px;}
.product .tab{ display: table;text-align: center; margin: 0 auto; margin-top: 30px;}

.pro{ width: 100%;}

.pro .pro-fl{ width: 50%; position: relative;}

.pro .pro-fl img.bg{ width: 100%;}

.pro .pro-fl .text{ width: 340px; height: 100px; line-height: 100px; border: 2px solid rgba(255,255,255,.6); border-radius: 5px; text-align: center; position: absolute; top: 50%; transform: translateY(-50%); right: 15%;}

.pro .pro-fl .text a{ display: block; color: #fff; font-size: 26px; transition: all .5s}

.pro .pro-fl .text a:hover{ color: #ffba00}

.pro .pro-fl .text span{ font-size: 20px; margin-left: 10px;}

.pro .pro-fl .text img{ vertical-align: -17px;}

.pro .pro-fr{ width: 50%;position: relative;}

.pro .pro-fr img.bg{ width: 100%;}

.pro .pro-fr .text{ width: 340px; height: 100px; line-height: 100px; border: 2px solid rgba(255,255,255,.6); border-radius: 5px; text-align: center; position: absolute; top: 50%; transform: translateY(-50%); left: 15%;}

.pro .pro-fr .text a{ display: block; color: #fff; font-size: 26px;transition: all .5s}

.pro .pro-fr .text span{ font-size: 20px; margin-left: 10px;}

.pro .pro-fr .text img{ vertical-align: -17px;}

.pro .pro-fr .text a:hover{ color: #ffba00}

.product .swiper-slide{ float: left;}







.about{ position: relative; overflow: hidden;}

.about .btn{ position: absolute; right:0; bottom: 0;}

.about .about-box{ position: relative; height: 426px;}

.about .about-list{position: absolute;left:-100%;}

.about .about-list .pic{width: 690px; position: relative;}

.about .about-list .pic img.img{ width: 100%;}

.about .about-list .pic h5{ position: absolute; right: 60px; bottom: 20px;color: #fff;font-size: 16px;/*font-weight: bold;*/}

.about .about-list .pic h5:after{ content: ""; width: 30px; height: 3px; background: #ffba00; display: block; margin-top:10px;}

.about .about-list .text{ width: 500px; height: 426px; position: relative;} 

.about .about-list .text p{ width:480x; margin-left: 20px; line-height: 22px; margin-top: 30px; font-size: 14px; color: #333; text-align: justify; font-weight: 300;}

.about .about-list .text .more{margin-left: 20px; margin-top: 20px; font-size: 16px;}

.about .about-list .text .more a{ color: #333}

.about .about-list .text .more span{ vertical-align: -1px;}

.about .about-list .text .next{ position: absolute; bottom: 0; left:10px;}

.about .about-list .text .next .title{ position: absolute; top: 50%;  font-size:20px;transform: translateY(-50%); width: 100%; text-align: center; color:#f5f5f5;/*font-weight: bold;*/}

.about .about-list .text .next .title::after{ width: 150px; height: 1px; background: #8c8c8c; content: ""; display: block; margin: 0 auto; margin-top: 15px;}

.about .about-list .text .next a{ display: block;}





.news .tab{ display: table; margin: 0 auto; overflow: hidden;}

.news .tab a{ width: 110px; height: 35px; border:1px solid #e2e2e2; display: block; float: left; margin: 0 20px; line-height: 35px; text-align: center; font-size: 16px; position: relative;}

.news .tab a.on:before{ content: ""; position: absolute; width: 4px; height: 4px; background: #ffba00;top: 16px;left: 14px;}

.news .tab a.on{ border: 1px solid #4c4c4c;}

.news .tab a:hover:before{ content: ""; position: absolute; width: 4px; height: 4px; background: #ffba00;top: 16px;left: 14px;}

.news .tab a:hover{ border: 1px solid #4c4c4c;}

.news .newsbox{ margin-top: 50px;}

.news .newsbox .newslist .pic{ width: 580px;}

.news .newsbox .newslist .pic div{ display:none;}
.news .newsbox .newslist .pic div:nth-child(1){display:block;}

.news .newsbox .newslist .pic img{ width: 100%;}

.news .newsbox .newslist .text{ width: 610px; height: 368px; overflow: auto; }

.news .newsbox .newslist .text .list{ background: #fff; width: 540px; height: 90px;border: 1px solid #fff; border-bottom: 1px solid #f5f5f5; ;margin-left:55px; transition: all .5s;}

.news .newsbox .newslist .text .list .time{ width: 80px; float: left; text-align: center; border-right: 1px solid #ddd; margin-top: 13px;}

.news .newsbox .newslist .text .list .time h5{ font-size: 48px; font-weight: 500;}

.news .newsbox .newslist .text .list .time p{ color:#cccccc; margin-top: 5px;}

.news .newsbox .newslist .text .list .data{ width: 430px; float: left; margin-left: 15px; margin-top: 13px; height: 65px;}

.news .newsbox .newslist .text .list .data .tit{ font-size: 15px; color: #333;}

.news .newsbox .newslist .text .list .data .zhaiyao{ margin-top: 10px; color: #999; line-height: 22px;font-size: 12px;}



.news .newsbox .newslist .text::-webkit-scrollbar {/*滚动条整体样式*/

  width: 4px;     /*高宽分别对应横竖滚动条的尺寸*/

  height: 4px;

}

.news .newsbox .newslist .text::-webkit-scrollbar-thumb {/*滚动条里面小方块*/

  background: #333;

  width: 5px; height: 4px;

}

.news .newsbox .newslist .text::-webkit-scrollbar-track {/*滚动条里面轨道*/

  border-radius: 0;

  background:#cccccc;

   width: 1px;

}



.news .newsbox .newslist .text .list.on{ border: 1px solid #ffba00; margin-left:30px; position: relative; }

.news .newsbox .newslist .text .list.on .data{background:#fff url(../images/orgright.png) no-repeat right bottom ;}

.news .newsbox .newslist .text .list.on .data .tit a{ color: #ffba00;}

.news .newsbox .newslist .text .list.on .data .zhaiyao{ color: #333;}

.news .newsbox .newslist .text .list.on:before{ position: absolute; content: ""; height: 0px;width: 0px;border-top: 8px solid transparent;border-right: 10px solid #ffba00;border-bottom: 8px solid transparent; left: -15px; top: 37px;}



.news .newsbox .newslist .text .list:hover{ border: 1px solid #ffba00; margin-left:30px; position: relative;}

.news .newsbox .newslist .text .list:hover .data .tit a{ color: #ffba00;}

.news .newsbox .newslist .text .list:hover .data .zhaiyao{ color: #333;}

.news .newsbox .newslist .text .list:hover:before{ position: absolute; content: ""; height: 0px;width: 0px;border-top: 8px solid transparent;border-right: 10px solid #ffba00;border-bottom: 8px solid transparent; left: -15px; top: 37px;}

.newsbox .more{ width: 165px; height: 45px;line-height: 45px; border: 1px solid #000; font-size: 16px; text-align: center; margin: 0 auto; margin-top: 40px; transition: all .5s;}

.newsbox .more span{ font-size: 14px;vertical-align: -1px;}

.newsbox .more:hover{ background: #ffba00; border: 1px solid #ffba00; text-indent: 10px}

.newsbox .more:hover a{ color: #fff;}

.foot{ background: url(../images/foot.jpg) no-repeat; padding: 40px 0; 

  border-top: 4px solid #ffba00; color: #fff; background-size:cover;margin-top: 60px;}

.foot .text{ float: left; width: 270px;}

.foot .text h5{  color: #fff; font-size: 16px;  margin-bottom: 15px;}

.foot .text h5:after{ content: ""; width: 30px; height: 3px; background: #ffba00; display: block; margin-top:10px;}

.foot .text p{ font-size: 12px; color: #eaeaea; padding: 10px 0;}

.foot .text p b{ font-size: 14px;}

.foot .text p img{ width: 81px;}

.foot .text span{ color: #999; display: block;}

.foot .nav{ float: left;}



.foot .nav{ float: left; width: 320px; margin-left: 100px;}

.foot .nav h5{  color: #fff; font-size: 16px;  margin-bottom: 15px;}

.foot .nav h5:after{ content: ""; width: 30px; height: 3px; background: #ffba00; display: block; margin-top:10px;}

.foot .nav li{ width: 80px; float: left; padding: 10px 0;}

.foot .nav li a{ color: #fff;}

.foot .nav li a:hover{ color:#ccc;}

.foot .form{ width:400px; float:right;}

.foot .form input[type="text"]{ height:40px; width:100%; border-bottom:1px solid #535353;}

.foot .form textarea{ height:60px; width:100%; background:none; border:none;border-bottom:1px solid #535353; resize:none; line-height:30px;}

.foot .form input[type="button"]{height:40px; width:100%; background:#ffba00; color:#fff;margin-top:20px; font-size:16px; transition:all .5s;}

.foot .form input[type="button"]:hover{background:#ddb602; }



.copyright{ height: 45px; background: #0b0c0c; line-height: 45px;}

.copyright .fl{ color: #666; font-size: 12px;}

.copyright .fl a{ color: #666}

.copyright .fl span{ color: #ccc;}

.copyright .fl span a{ color: #ccc}

.copyright .fr{ color: #fff; font-size:12px; position: relative;}

.copyright .fr span{ transform: rotate(90deg); display: inline-block; vertical-align: -2px; margin-left: 5px;}

.copyright .fr .list{ width: 100px; position: absolute; right: -15px; bottom: 45px; background: #fff;  border-radius: 4px; display: none;}

.copyright .fr .list a{ display: block; width: 90px; margin: 0 auto; text-align: center;}

.copyright .fr .list a:hover{ color:#ffba00;}







.sk-wave {

  margin: 40px auto;

  width: 50px;

  height: 40px;

  text-align: center;

  font-size: 10px; 

  position: absolute;

  top: 50%;

  margin-top: -20px; left: 50%; margin-left: -25px;

}

  .sk-wave .sk-rect {

    background-color: #ffba00;

    height: 100%;

    width: 5px;

    display: inline-block;

    -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;

            animation: sk-waveStretchDelay 1.2s infinite ease-in-out; margin: 0 2px;}

  .sk-wave .sk-rect1 {

    -webkit-animation-delay: -1.2s;

            animation-delay: -1.2s; }

  .sk-wave .sk-rect2 {

    -webkit-animation-delay: -1.1s;

            animation-delay: -1.1s; }

  .sk-wave .sk-rect3 {

    -webkit-animation-delay: -1s;

            animation-delay: -1s; }

  .sk-wave .sk-rect4 {

    -webkit-animation-delay: -0.9s;

            animation-delay: -0.9s; }

  .sk-wave .sk-rect5 {

    -webkit-animation-delay: -0.8s;

            animation-delay: -0.8s; }



@-webkit-keyframes sk-waveStretchDelay {

  0%, 40%, 100% {

    -webkit-transform: scaleY(0.4);

            transform: scaleY(0.4); }

  20% {

    -webkit-transform: scaleY(1);

            transform: scaleY(1); } }



@keyframes sk-waveStretchDelay {

  0%, 40%, 100% {

    -webkit-transform: scaleY(0.4);

            transform: scaleY(0.4); }

  20% {

    -webkit-transform: scaleY(1);

            transform: scaleY(1); } }







#topcontrol{background:#4c4c4c; height:30px; width:30px; border-radius:4px;}







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

.hx-fr {float: right; }

.left-nav-show{ width: 220px;/*box-shadow: 0 0 10px 2px #cae7f7;*/ background: #fff; float: left;}

.left-nav-show .nav-title{ background: #333333; padding: 20px 30px;}

.left-nav-show .nav-title h5{ font-size:20px; color: #FFBA00; font-weight: 500;}

.left-nav-show .nav-title p{ font-size:14px; color: #FFBA00; margin-top: 10px;}

.left-nav-show li{ padding: 20px 30px; font-size: 16px;  border-bottom: 1px solid #ddd; background: #F2F2F2;}

.left-nav-show li a{ color: #999; display: block;}

.left-nav-show li:last-child{border: none;}

.left-nav-show li  span{ float: right; color: #bdbdbd; margin-top: -15px;}

.left-nav-show li a:hover{ color: #D6BA0E}

.left-nav-show li:hover span{ color: #D6BA0E;}

.left-nav-show li.on a{ color: #D6BA0E}

.left-nav-show li.on span{ color: #D6BA0E;}

.article{ width: 960px; margin: 0 auto; box-sizing: border-box; padding: 20px 30px;box-shadow: 0 0 0px 2px #fff;background: #fff;}

.article h4{ font-weight: 500; font-size:18px; border-bottom: 1px solid #ddd; padding-bottom: 20px;}

.article h4 span{ font-size:13px; color: #999; text-transform: uppercase; margin-top: 10px;}

.article li{ padding: 20px 0; border-bottom:1px dashed #ddd; overflow: hidden;}

.article li .article-tit{ font-size:16px;}

.article li .imgtp{ padding-right: 20px; float: left; overflow: hidden;text-overflow:ellipsis;white-space: nowrap}

.article li .article-tit span{ width: 700px;height:22px; float: left; overflow: hidden;text-overflow:ellipsis;white-space: nowrap}

.article li .article-tit span a{ color: #333;}

.article li .article-tit span a:hover{ color: #1a6fa5;}

.article li .article-tit em{ float: right; color: #ccc; width:180px; text-align: right;}

.article li .zhaiyao{ color: #999; line-height: 24px;  font-size: 14px;}

.article li .more{ width: 100px; height: 30px; line-height: 30px; text-align: center; border:1px solid #e8e8e8;

 font-size: 12px; margin-top:10px;transition: all .5s; float: right;}

.article li .more a{ display: block; color: #0e0e0e;}

.article li .more:hover{ background: #ccc;border:1px solid #ccc;}

.article li .more:hover a{ color: #fff;}

.article .page{ display: table; margin: 30px auto}

.article .page span{ color: #999; padding:10px 10px; }

.article .page a{ color: #999; padding:10px 10px; }

.article .page a.act{ color: #333;}

.bar{ border-bottom: 1px solid #ddd; font-size: 15px; line-height: 40px;}

.bar a{ color: #333; }

.bar a:hover{ color: #1a6fa5; }

.bar span{ padding:0 10px;}

.sb-show { margin-top: 30px;}

.sb-show .tit{ font-size:24px; text-align: center; width: 80%; margin: 0 auto; color: #333;} 

.sb-show .time{ font-size: 14px; text-align: center; width: 80%; margin: 0 auto; color: #999; margin-top: 15px;}

.sb-show .text{ margin-top:40px; font-size: 14px; color: #333; line-height: 24px;}

.sb-show .text p{

  /* text-indent: 30px; */

}

.page{

  text-align: center;

  max-width: 1200px;

  margin: auto;}

.page .pages{

  float: right;

  margin-top: 20px;

}

.page .pagex{

  float: left;

  margin-top: 20px;

}

.ab-ban{
  margin-top: 80px;
}