@charset "utf-8";
/* CSS Document */
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td { margin: 0; padding: 0; border: 0;}
html { color: #000; }
html,body {width:100%;min-width:320px;}
body,button,input,select,textarea { margin:0; padding:0;  font-family: "微软雅黑","Microsoft Yahei", "Arial", "Verdana", "sans-serif";  font-size:12px; background:#fff}
ul,ol,li,dl,dd,dt{list-style: none;}
em { font-style: normal; }
a { text-decoration: none;outline:none; }
a:hover { text-decoration: underline; color:#e85300;}
legend { color: #000; }
fieldset,img { border: 0; }
label,button { cursor: pointer; }
/*解决IE图片缩放失真*/
img { -ms-interpolation-mode: bicubic; }
/*清除浮动*/
.clearfix:after { content: ''; display: block; height: 0; clear: both; }
.clearfix { zoom: 1; }
.clear { clear: both; }
/*连续英文、数字换行*/
.wordwrap { word-break: break-all; word-wrap: break-word; }
/*单行文字超出显示省略号*/
.omg{overflow: hidden; text-overflow: ellipsis; white-space:nowrap;}
img { border: 0; vertical-align: middle;  }
a{ color:#3a3a3a; text-decoration:none;}
a:hover{ color:#ea5504; text-decoration:none}
a:active{color:#ea5504;}

.fl{float:left;}
.fr{float:right;}

/* 设置滚动条的样式 */
::-webkit-scrollbar { width:4px;}/* 滚动槽 */
::-webkit-scrollbar-track { background-color:#f0f0f0; border-radius:0px;}/* 滚动条滑块 */
::-webkit-scrollbar-thumb { background-color:#6d6e70;}
::-webkit-scrollbar-thumb:window-inactive { background-color:#3c3c3c;}

header{width:100%;height:70px;background:#fff;position:fixed;top:0;left:0;z-index:9999;box-shadow: 0 3px 4px rgba(0,0,0,0.1);}
.top_in{width:1200px;margin:0 auto;}
.top_in h1{float:left;}
.top_in nav{float:right;}
.top_in nav li{float:left;margin-left:30px;}
.top_in nav li a{display:block;font-size:14px;color:#555;line-height:70px;}
.top_in nav li a:hover{color:#ea5504;}
.top_in nav li.on a{color:#ea5504;}

.sp_banner{width:100%;height:480px;background:url(../images/bd_bg1.jpg) center center no-repeat;margin-top: 70px;position: relative;z-index:-1;}

.list_nav_wrap{width: 100%;background:#f5f5f5;}
.list_nav{position: relative; z-index: 999;top:-50px;}
.list_nav_in{display: block;width: 1200px;overflow: hidden;margin: 0 auto;padding: 0 0 10px;background-color: #fff;border-radius: 4px;-moz-box-shadow:5px 0px 38px rgba(0,0,0,.2); -webkit-box-shadow:5px 0px 38px rgba(0,0,0,.2); box-shadow:5px 0px 38px rgba(0,0,0,.2);}
.list_nav .list_nav_hd{border-bottom:1px solid #dedede;text-align:left;height:50px;line-height:50px;color:#555;font-size:16px;position:relative;margin:0 20px;font-weight:bold;}

.list_nav .list_nav_hd:before{content:"";display:block;width:120px;height:2px;background:#1e1e1e;position:absolute;bottom:0;left:0;}
.list_nav .list_nav_bd_top{width:1200px;border-radius:2px 2px 0 0;padding-top:10px;background:#fff;}
.list_nav .list_nav_bd ul.tab li{width: 120px;height: 30px;overflow: hidden;margin: 0;padding:20px 0 15px;background: url(../images/nav_line1.jpg) center right no-repeat;float: left;}
.list_nav .list_nav_bd ul.tab li a{display: block;width: 70%;margin:0 auto;height: 30px;line-height: 30px;color: #333;font-size: 14px;text-align: center;transition: all .5s ease 0s;}
.list_nav .list_nav_bd ul.tab li a:hover{background:#1e1e1e;border-radius:2px;color:#ffffff;}
.list_nav .list_nav_bd ul.tab li.on a{background:#1e1e1e;border-radius:2px;color:#ffffff;}

.list_nav .list_nav_bd ul.conlist{padding:30px 20px 0;}
.list_nav .list_nav_bd ul.conlist li{float:left;width:260px;margin-right:40px;margin-bottom:34px;background:#ffffff;border-radius:4px;transition: all .5s ease 0s;}
.list_nav .list_nav_bd ul.conlist li:nth-child(4n){margin-right:0;}
.list_nav .list_nav_bd ul.conlist li .pic{display:block;width:260px;height:416px;border:1px solid #f1f1f1;overflow:hidden;position:relative;transition: inherit;}
.list_nav .list_nav_bd ul.conlist li .pic:hover{transition: inherit;}
.list_nav .list_nav_bd ul.conlist li .pic img{width:100%;}
.list_nav .list_nav_bd ul.conlist li .pic>div.bg{width:100%;height:416px;position:absolute;top:0;left:0;background:rgba(0,0,0,.6);display:none;transition: all .5s ease 0s;}
.list_nav .list_nav_bd ul.conlist li .over{width:100%;height:416px;position:absolute;top:0;left:0;display:none;transition: all .5s ease 0s;}
.list_nav .list_nav_bd ul.conlist li.cur div.bg{display:block;}
.list_nav .list_nav_bd ul.conlist li.cur .over{display:block;}
.list_nav .list_nav_bd ul.conlist li .tlt{width:100%;text-align:center;font-size:14px;color:#fff;overflow: hidden; text-overflow: ellipsis; white-space:nowrap;margin-top:80px;}
.list_nav .list_nav_bd ul.conlist li .tlt i{color:#fa8f00;font-style:normal;}

.list_nav .list_nav_bd ul.conlist li .code{display:block;background:#fff;border-radius:2px;padding:5px;width:150px;height:150px;margin:15px auto 0;}
.list_nav .list_nav_bd ul.conlist li .code canvas,.list_nav .list_nav_bd ul.conlist li .code img{width:100%;height:100%;}
.list_nav .list_nav_bd ul.conlist li span.more{display:block;width:130px;height:40px;line-height:40px;color:#ffffff;font-size:14px;text-align:center;background-color: #f60;background-image: linear-gradient(90deg,#ff9f00,#f60);box-shadow: 0 2px 8px 0 rgba(255,102,0,.6);margin:0 auto;transition: all .1s ease 0s;margin:40px auto 0;border-radius:2px;}
.list_nav .list_nav_bd ul.conlist li span.more:hover{background:#ff9e25;}


.al_foot { width:100%; height:40px; overflow:hidden; margin:0 auto; padding:0; background-color:#000;}
.al_foot .ft_ct { width:1200px; height:40px; overflow:hidden; line-height:40px; margin:0 auto; padding:0; color:#666; font-family:"微软雅黑"; font-size:12px;}

.ly_top { width:40px; height:40px; overflow:hidden; margin:0; padding:0; position:fixed; right:20px; bottom:60px;z-index:99999;}
.ly_top a { display:block; width:38px; height:38px; overflow:hidden; margin:0; padding:0; border:1px solid #ccc; border-radius:3px; background:#fff url(../images/tp_tb1.png) center center no-repeat;}
.ly_top a:hover { border:1px solid #212121; background:#212121 url(../images/tp_tb2.png) center center no-repeat;}

.pagelist{text-align:center;width:100%;padding:10px 0 40px;}
.pagelist a{display:inline-block;margin:0 2px;border-radius:2px;background:#d5d5d5;color:#555;text-align:center;height:36px;line-height:36px;min-width:36px;}
.pagelist a.pre{width:42px;}
.pagelist a:hover{background:#373737;color:#fff;}
.pagelist a.on{background:#373737;color:#fff;}

.show_model_bg{display:none;position: fixed;top: 0;bottom: 0;left: 0;right: 0;background-color: #000;opacity: .6;z-index: 9999;}

.show_model{display:none;width: 1030px;margin: auto;position: fixed;top: 8%;left: 0;right: 0;z-index: 99999;border-radius:2px;overflow:hidden;}
.show_model_l{float:left;width: 50%;height: 100%;display: inline-block;vertical-align: top;box-shadow: -2px 0 3px rgba(0,0,0,0.04);background:#f4f4f4;height: 630px;}
.show_model_l .p-frame {width: 375px;height: 550px;margin: 35px auto;position: relative;display: block;box-shadow: 0 1px 2px rgba(150,150,150,0.3);}
.show_model_r{float:right;width: 50%;height: 100%;display: inline-block;vertical-align: top;box-shadow: -2px 0 3px rgba(0,0,0,0.04);background:#ffffff;height: 630px;}
.show_model_r .code{width:240px;border:1px solid #dedede;padding:10px;margin:100px auto 30px;text-align:center;}
.show_model_r .code p{width:240px;height:240px;display:block;margin:0 auto;}
.show_model_r .code span{display:block;color:#555;font-size:12px;height:34px;line-height:34px;}
.show_model_r .code p img{max-width:100%;}
.show_model_r .cz{width:100%;text-align:center;}
.show_model_r .cz a.zz{display:inline-block;width:118px;height:40px;line-height:40px;text-align:center;border-radius:2px;background-color: #f60;background-image: linear-gradient(90deg,#ff9f00,#f60);box-shadow: 0 2px 8px 0 rgba(255,102,0,.6);color:#ffffff;}
.show_model_r .cz a.gb{display:inline-block;width:100px;height:40px;line-height:40px;text-align:center;border-radius:2px;border:1px solid #dedede;color:#555;margin-left:15px;}
.close_btn{width: 15px;height: 15px;position: absolute;top: 20px;right: 20px;background: url(../images/close.png) no-repeat;cursor: pointer;-webkit-transition: transform .15s;-o-transition: transform .15s;transition: transform .15s;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);}
.close_btn:hover{-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);}