@charset "utf-8";

/* CSS Document */
/*
*********************************
武汉中网维优网络科技有限公司
http://www.wymonitor.com
联系电话：027-87862018
客服QQ：15035405
*********************************
*/
/*----------------------------通用---------------------------------------*/











body { font-size: 14px; font-family: "微软雅黑"; background: #fff; }

* { padding: 0; margin: 0; }

a { text-decoration: none; }

ul, li { list-style: none; }

img { border: 0; }

input { font-family: "微软雅黑"; outline: none; }

.cl { clear: both; height: 0px; }

.fl { float: left; }

.fr { float: right; }

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

.all1 { width: 1200px; margin: 0 auto; overflow: hidden; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; }

.topbar { height: 123px; overflow: hidden; position: relative; }

.logo a { background: url(img/logo.png) no-repeat; width: 292px; height: 92px; position: absolute; top: 15px; left: 0px; }

.phone { background: url(img/phone.png) no-repeat; width: 190px; height: 47px; position: absolute; top: 20px; right: 0px; }

.ggw { background: url(img/bg.png) no-repeat 0 0/240px 30px; width: 240px; height: 30px; position: absolute; top: 29px; right: 192px; }

.menu { position: absolute; top: 80px; right: 15px; }

.menu li { height: 43px; line-height: 18px; font-size: 16px; width: 68px; float: left; }

.menu li a { color: #666; width: 68px; height: 33px; text-align: center; display: block; background: url(img/mbg.gif) no-repeat 0 -43px; transition: all 0.5s; }

.menu li a.on { color: #c60000; background: url(img/mbg.gif) no-repeat center bottom; }

.menu li a.on1 { color: #c60000; background: url(img/mbg.gif) no-repeat center bottom; }

.menu li.line { margin: 0 12px; background: url(img/line.gif) no-repeat; width: 1px; height: 18px; overflow: hidden; }

.fdm { height: 650px; width: 100%; margin: 0 auto; overflow: hidden; position: relative; }

.fdm .bd li { float: left; height: 650px; width: 100%; background-position: center center; }

.fdm .bd li img { width: 100%; height: 100%; }

.fdm .hd { position: absolute; bottom: 20px; width: 100%; text-align: center; }

.fdm ul { margin: 489px auto 0 auto; }

.fdm .hd ul { margin: 0; display: inline-block; }

.fdm ul li { background: url(img/bdd.png) no-repeat left top; width: 60px; height: 12px; cursor: pointer; margin: 0 3px; float: left; }

.fdm ul li.on { background-position: -60px 0; }

.fdm2 { margin-top: 61px; height: 450px; overflow: hidden; }

.case .title { height: 61px; overflow: hidden; background: url(img/btdd.gif) no-repeat 174px 51px; }

.xjtit { background: url(img/btdd1.gif) no-repeat 174px 51px !important; }

.case .title h3 { background: url(img/w5.png) no-repeat left top/300px 55px; height: 61px; }

.case .title span { width: 95px; height: 17px; display: block; background: #fff; padding: 37px 30px 0 0px; font-size: 18px; }

.case .title a { height: 20px; display: block; color: #444; }

.case .title a span { font-size: 16px; }

.case .title a:hover { color: #c60000; }

ul.calist { margin-top: 35px; height: 340px; width: 100%; display: flex; }

ul.calist li { width: 133px; flex: 1; font-size: 125%; }

ul.calist li a { height: 340px; display: block; }

ul.calist li .tb { width: 133px; height: 154px; overflow: hidden; background: url(img/qbg.gif) no-repeat -133px 0; background-position: -133px 0px; transition: all 0.5s; margin: 0 auto; }

ul.calist li .tb i { width: 133px; height: 154px; display: block; background: url(img/xcbg.png) no-repeat 0 0; background-position: 0px 0px; transition: all 0.5s; }

ul.calist li i.tb1 { background: url(img/xcbg1.png) no-repeat 0 0; }

ul.calist li i.tb2 { background: url(img/xcbg2.png) no-repeat 0 0; }

ul.calist li i.tb3 { background: url(img/xcbg3.png) no-repeat 0 0; }

ul.calist li i.tb4 { background: url(img/xcbg4.png) no-repeat 0 0; }

ul.calist li:hover .tb { background-position: 0 0; }

ul.calist li:hover .tb i { background-position: 0 -154px; }

ul.calist li .name { margin-top: 17px; height: 45px; text-align: center; font-size: 20px; line-height: 16px; color: #c60000; }

ul.calist li .name i { display: block; color: #c60000; font-size: 14px; line-height: 20px; font-family: "Courier New", Courier, monospace; }

ul.calist li .nr { height: 114px; line-height: 25px; color: #444; text-align: center; font-size: 16px; }

.fdm1 { background: #252525; overflow: hidden; padding-top: 32px; margin-top: 15px; }

.product .title { height: 61px; overflow: hidden; background: url(img/btdd.gif) no-repeat 200px 51px; }

.product .title h3 { background: url(img/w2.png) no-repeat left top/300px 55px; height: 61px; }

.product .title span { height: 22px; display: block; padding: 38px 30px 0 8px; font-size: 18px; }

.product .title a { height: 20px; display: block; color: #444; }

.product .title a strong { font-size: 16px; }

.product .title a:hover { color: #c60000; }

.product .topbg { height: 110px; text-align: center; line-height: 24px; color: #a7a7a7; font-size: 16px; }

.product .topbg i { font-size: 23px; line-height: 18px; color: #FF0202; display: block; margin-bottom: 15px; font-weight: bold; font-style: normal; }

.product .prlist { overflow: hidden; margin-top: 35px; margin-bottom: 35px; }

.product .prlist li { width: 400px; height: 225px; float: left; position: relative; margin: 0px; cursor: pointer; }

.product .prlist li .tu { font-size: 0; position: relative; }

.product .prlist li .tu span { color: #fff; display: block; font-size: 14px; position: absolute; bottom: 0; text-align: center; line-height: 30px; width: 100%; background: rgba(0,0,0,.3); }

.product .prlist li:hover .tu span { opacity: 0; }

.product .prlist li img { width: 100%; height: 225px; }

.product .prlist li a { display: block; position: relative; overflow: hidden; }

.product .prlist li .pbg { background: url(img/pbg.png) repeat rgba(255, 0, 0, 0.22); width: 100%; height: 225px; position: absolute; top: 230px; left: 0px; transition: all 0.5s; }

.product .prlist li .bt { height: 35px; line-height: 26px; color: #fff; text-align: center; overflow: hidden; margin-top: 65px; font-size: 18px; }

.product .prlist li .more { background: url(img/more1.png) no-repeat center top; width: 100%; height: 65px; overflow: hidden; margin-top: 5px; }

.product .prlist li:hover .pbg { top: 0; }

.fdm3 { padding: 36px 0 25px 0; background: #393c41; }

.hcxw { width: 550px; }

.hcxw .title { height: 48px; overflow: hidden; background: url(img/bg1.gif) no-repeat 140px 39px; }

.hcxw .title h3 { background: url(img/w4.png) no-repeat left top; height: 48px; }

.hcxw .title .w1 { background: url(img/w6.png) no-repeat left top; height: 48px; }

.hcxw .title a { width: 82px; height: 20px; display: block; margin-top: 30px; color: #DBDBEA; }

.hcxw .title a span { font-size: 16px; }

.hcxw .title a:hover { color: #c60000; }

.hcxw ul { height: 230px; overflow: hidden; margin-top: 25px; font-size: 14px; }

.hcxw li { width: 550px; line-height: 34px; border-bottom: 1px dashed #d8dbdf; }

.hcxw li span { width: 120px; display: block; color: #aab2ba; }

.hcxw li a { color: #fff; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.hcxw li a:hover { color: #c60000; }

.fdm4 { overflow: hidden; margin-top: 54px; }

.partner .title { height: 61px; overflow: hidden; background: url(img/btdd.gif) no-repeat 222px 51px; }

.partner .title h3 { background: url(img/w3.png) no-repeat left top/300px 55px; height: 61px; }

.partner .title span { height: 20px; display: block; padding: 40px 30px 0 10px; font-size: 16px; }

.partner .title a { height: 12px; display: block; color: #5d6d7d }

.partner .title a strong { font-size: 16px; }

.partner .title a:hover { color: #c60000; }

.partlist { width: 100%; margin: 50px auto; }

.partlist li { width: 169px; box-sizing: border-box; height: 110px; float: left; }

.partlist li img { box-sizing: border-box; width: 90%; border: 1px solid #eaeaea; }

.footer { background-color: #393c41; width: 100%; min-width: 1200px; padding-bottom: 5px; padding-top: 30px; overflow: hidden; }

.footer .footer_logo { float: left; }

.footer .flink { height: 50px; margin-bottom: 10px; margin-left: 470px; }

.footer .flink li { float: left; }

.footer .flink li a { display: block; font-size: 16px; color: #a7a7a7; margin: 0px 8px; padding: 0px 5px; line-height: 50px; }

.footer .line { border-top: 1px solid #545454; width: 100%; }

.footer .footernav dl { margin-top: 30px; margin-right: 55px; }

.footer .footernav a { font-size: 14px; color: #a7a7a7; line-height: 2em; display: block; width: 100%; float: left; }

.footer .footerinfo { font-size: 14px; color: #a7a7a7; line-height: 2em; width: 360px; margin-top: 15px; }

.footer .footerewm { width: 330px; margin-top: 8px; font-size: 14px; color: #a7a7a7; line-height: 2em; }

.footer .footerewminfo { width: 170px; margin-top: 45px; text-align: right; }

.footer .footerewmimg { width: 140px; }

.footer .footerewmimg img { width: 100%; }

.footer_banquan { background: #292a2e; padding: 15px 0; line-height: 20px; color: #7e7e7e; font-size: 14px; text-align: center; }

/*关于我们*/








.inner_banner { width: 100%; height: 260px; background: url(img/20161216094045236.jpg) center/cover; position: relative; overflow: hidden; }

.inner_banner:after { content: ''; width: 100%; height: 0px; position: absolute; top: 0px; display: block; box-shadow: 0px 0px 8px 3px #FFF; }

.about_us { width: 100%; background: url(img/nbg.gif) repeat-y center top; padding-bottom: 30px; }

.left_side { width: 260px; float: left; position: relative; }

.left_side .tit { height: 70px; font-size: 24px; line-height: 24px; color: #c60000; font-weight: bold; margin-top: 34px; }

.left_side .tit:after { content: ''; width: 250px; height: 1px; background: #ccc; display: block; margin-top: 10px; }

.left_side .tit i { display: block; font-family: Arial, Helvetica, sans-serif; color: #5a6a79; font-size: 18px; line-height: 22px; margin-top: 10px; font-weight: normal; font-style: normal; }

.left_side .side_nav { padding-top: 30px; width: 260px; }

.left_side .side_nav li { height: 40px; margin-top: 1px; }

.left_side .side_nav li a { height: 40px; display: block; color: #5d6d7d; font-size: 18px; line-height: 40px; padding-left: 18px; }

.left_side .side_nav li a.on { background: #c60000; color: #fff; }

.left_side .side_nav li:hover a { background: #c60000; color: #fff; }

.fwxm { margin-top: 45px; width: 209px; }

.fwxm .tit1 { height: 79px; background: url(img/w7.png) no-repeat left top; border-bottom: 1px solid #eeeff1; }

.fwxm li { width: 209px; height: 62px; }

.fwxm li a { width: 209px; height: 62px; background: url(img/fwbg.gif) no-repeat; display: block; }

.fwxm li.f2 a { background: url(img/fwbg1.gif) no-repeat; }

.fwxm li.f3 a { background: url(img/fwbg2.gif) no-repeat; }

.fwxm li.f4 a { background: url(img/fwbg3.gif) no-repeat; }

.fwxm li.f5 a { background: url(img/fwbg4.gif) no-repeat; }

.fwxm li a:hover { background-position: 0 -62px; }

.ny_news { height: auto!important; height: 450px; min-height: 450px; }

/*rightside*/






.right_side { width: 900px; float: right; }

.position { background: url(img/nbg3.gif) no-repeat 0px 3px; text-indent: 20px; margin-top: 30px; font-size: 16px; }

.position a { color: inherit; }

.content { margin-top: 30px; line-height: 2; }

.content img { max-width: 100%; height: auto!important; }

.content .layer_zz { max-width: 900px; height: 540px; }

.cont_list li { float: left; width: 150px; height: 130px; margin-bottom: 10px; box-sizing: border-box; text-align: center; color: #666; }

.cont_list li img { width: 100%; height: 115px; border: 1px solid #ccc; }

.lmmc { font-size: 22px; color: #c8cdd2; font-family: Arial, Helvetica, sans-serif; line-height: 22px; margin-top: 20px; }

.lmmc i { font-size: 24px; color: #6a7682; line-height: 24px; display: block; font-style: normal; }

/*作品内页*/






.zuopin_list { width: 100%; }

.zuopin_list li { width: 280px; margin: 10px; float: left; text-align: center; }

.zuopin_list li a { color: #666; }

.zuopin_list li:hover a { color: #c60000; }

.zuopin_list li img { width: 280px; height: 157px!important; }

.tidbit_list li img { height: 210px!important; }

.top_news { width: 100%; margin-bottom: 20px; height: 200px; }

.top_news img { width: 300px; height: 200px!important; float: left; }

.top_news .top_new_r { float: right; width: 580px; }

.top_news .top_new_r .tit { font-size: 16px; color: #333; }

.top_news .top_new_r .time { color: #cfd3d6; font-size: 14px; }

.top_news .top_new_r .desc { font-size: 14px; color: #666; }

.top_news:hover .top_new_r .tit { color: #c60000; }

.top_news:hover .top_new_r .time { color: #c60000; }

.top_news:hover .top_new_r .desc { color: #c60000; }

.new_list { border-top: 1px dashed #ccc; line-height: 40px; margin-bottom: 30px; }

.new_list li { font-size: 16px; border-bottom: 1px dashed #ccc; }

.new_list li p { color: #333; }

.new_list li p span { display: inline-block; width: 110px; color: #999; }

.new_list li:hover p { color: #c60000; }

.right_side h2.title { font-size: 20px; text-align: center; line-height: 50px; }

.pages UL { float: right; }

.pages UL LI { width: auto; float: LEFT; border: 1px solid #ccc; margin-bottom: 30px; color: #888; display: block; padding: 6px 10px; text-align: center; margin-right: 6px; }

.pages UL LI span { line-height: 35px; margin: 0 10px; }

.pages UL LI a { display: block; color: #888; }

.thisclass { display: block; }

.pages UL LI select { border: 0; background: none; color: #888; }

.pages UL LI:hover { border: 1px solid #c60000; color: #c60000; }

.pages UL LI:hover a { color: #c60000; }

.thisclass { background: #c60000 !important; border: 1px solid #c60000 !important; color: #fff !important; }

.thisclass a { color: #fff !important; }

ul.hide { display: none!important; }

.tidbit { background: #fff; }

.tidbit .product .prlist li { width: 300px; height: 225px; }

.tidbit .product .prlist li img { height: 225px; }

.tidbit .product .prlist li .pbg { height: 225px; }

/*新加上一页下一页样式*/


.sxp { margin-top: 30px; border-top: 1px dashed #888; padding-top: 15px; }

.sxp p { line-height: 35px; color: #555; }

.sxp p a { color: #555; }

.sxp p a:hover { color: #c60000; }

/*新加查看更多样式*/


.ff { margin: 0 !important; font-size: 16px; }

/*----弹出播放器----*/


.layer { top: 0; left: 0; width: 100%; height: 100%; padding-top: 6%; z-index: 99999; position: fixed; background-color: rgba(0,0,0,0.3); display: none; }

.bh { width: 16px; height: 16px; float: right; cursor: pointer; }

.layer_zl { width: 920px; height: 506px; position: absolute; left: 50%; margin-left: -460px; }

.layer_zz { width: 1000px; height: 600px; }

.layui-layer-title { padding: 0 20px 0 20px; height: 42px; line-height: 42px; border-bottom: 1px solid #eee; font-size: 14px; color: #333; text-align: left; background-color: #F8F8F8; border-radius: 2px 2px 0 0; }

.xx_tit { height: 35px; color: #333333; font-size: 18px; font-weight: 700; text-align: left; padding-top: 10px; padding-left: 20px; float: left; }

.list_content { padding: 0 20px; }

.list_content ul { width: 1100px; }

.list_content ul li { width: 300px; float: left; margin: 25px 15px 0 0; background: #f3f3f3; padding: 17px 16px; }

.layer_zz span { float: right; cursor: pointer; }

/*移动端头部*/


.topbar_tel { display: none; }

.dingbu { opacity: 0; max-width: 640px; width: 100%; overflow: hidden; }

.topnav { position: fixed; top: 0; max-width: 640px; width: 100%; z-index: 999; left: 50%; transform: translateX(-50%); }

.topnav .hide { visibility: hidden; height: 0; }

.topnav .show { visibility: visible; transition: visbility 0.5s 0.5s; height: auto; }

.topnav ul { width: 90%; padding: 0 5%; height: 0; overflow: hidden; transition: height 0.5s 0.8s; background: rgba(255,255,255,.8); position: absolute; z-index: 999; }

.topnav ul.on { height: 2000px; transition: height 0s; }

.topnav ul li { border-bottom: 1px solid #ccc; line-height: 3rem; transition: all 0.5s; transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1); transform: translateX(-0.5rem) translateY(-1rem) scale(1.1); opacity: 0; font-size: 1rem; }

.topnav ul li:nth-of-type(1) { transition-delay: 0ms; }

.topnav ul li:nth-of-type(2) { transition-delay: 50ms; }

.topnav ul li:nth-of-type(3) { transition-delay: 100ms; }

.topnav ul li:nth-of-type(4) { transition-delay: 150ms; }

.topnav ul li:nth-of-type(5) { transition-delay: 200ms; }

.topnav ul li:nth-of-type(6) { transition-delay: 250ms; }

.topnav ul li:nth-of-type(7) { transition-delay: 300ms; }

.topnav ul li:nth-of-type(8) { transition-delay: 350ms; }

.topnav ul li:nth-of-type(9) { transition-delay: 400ms; }

.topnav ul li:nth-of-type(10) { transition-delay: 450ms; }

.topnav ul li:nth-of-type(11) { transition-delay: 500ms; }

.topnav ul.on li { transform: translate(0); opacity: 1; }

.topnav ul li a { color: #000; display: block; width: 100%; height: 100%; }

.topnav .btn_change { position: absolute; width: 4rem; height: 4rem; /* background: red; */ right: 0; top: 0; }

.topnav .btn_change i { position: absolute; width: 2rem; height: 2px; transition: all ease 0.5s; background: #000; }

.topnav .btn_change .line1 { /* background: green; */ left: 1rem; top: 1.4rem; }

.topnav .btn_change .line2 { /* background: yellow; */ left: 1rem; top: 2.2rem; }

.topnav .btn_change.on .line1 { transform: translateY(0.4rem) rotateZ(225deg); }

.topnav .btn_change.on .line2 { transform: translateY(-0.4rem) rotateZ(-225deg); }

.title_tel { display: none; text-align: center; color: #333; }

.title_tel h3 { color: #c60000; }

ul.calist li .tb_tel { display: none; }

#video_box { width: 900px; height: 506px; }
.tel_left_nav{display:none;}
.left_side .down{display:none;}
.db_tel { display: none; }
 @media (max-width: 450px) {

html { font-size: 75%; }
}
@media (max-width: 360px) {

html { font-size: 60%; }
}
 @media (max-width: 640px) {

html, body { font-size: 20px; }

.all { width: 100%; max-width: 640px; margin: 0 auto; }

.topbar { display: none; }

.topbar_tel { display: block; }

/*导航*/


.fdm { height: 10rem; }

.fdm .bd li { background-size: cover; height: 10rem; }

/*服务项目*/


.case .title { display: none; }

.title_tel { display: block; }

.fdm2 { height: auto; }

ul.calist { display: block; height: auto; }

ul.calist li { width: 45%; display:inline-block; text-align: center; margin-left: 2.5%; background: #f7f7f7; border-radius: 10px; margin-top: 20px; padding-bottom: 20px; }

ul.calist li .tb { display: none; }

ul.calist li a { height: auto; }

ul.calist li .tb_tel { display: inline; width: 40%; }

/*作品*/

.product .title { display: none; }

.product .title_tel { color: #a7a7a7; }

.product .prlist li { width: 90%; margin-left: 5%; }

.product .prlist .db { display: none; }

.product .prlist .db_tel { display: block; }

/*花絮*/

.tidbit .product .prlist li { width: 80%; margin-left: 10%; }

/*新闻*/

.hcxw { width: 100%; }

.hcxw li { width: 96%; margin-left: 2%; }

.hcxw li span { width: 25%; }

.hcxw .title { display: none; }

.hcxw .title_tel { color: #a7a7a7; }

/*合作伙伴*/

.partner .title { display: none; }

.partlist li { width: 25%; text-align: center; height: auto; }

/*.footer*/

.footer { width: 100%; max-width: 640px; min-width: 360px; }

.footer .footer_logo { width: 100%; text-align: center; }

.footer .flink { margin: 0; }

.footer .flink li { width: 25%; margin: 0 auto; }

.footer .footerinfo, .footer .footerewm { display: none; }

/*弹窗视频*/

#video_box { width: 100%; height: 100%; }

/*内页*/

.inner_banner { display: none; }

.left_side { width: 100%; text-align: center; }

.left_side .down { position: absolute; top: 0; right: 0; transition: all 1s;display:block; }

.left_side .up { transform: rotateX(-180deg); }

.left_side .tit { display: none; }

.left_side .side_nav { width: 100%; padding: 0; height: 40px; overflow: hidden; }

.left_side .side_nav li { width: 33.33%; float: left; }

.left_side .side_nav li a { padding: 0; }

.right_side { width: 96%; margin-left: 2%; margin-right: 2%; }

.tel_left_nav {  position: absolute; background: #fff; top: 0; left: 0; width: 100%; text-align: left;display:none; }
.tel_left_nav.on{display:block;}
.tel_left_nav p { line-height: 40px; text-indent: 2%; }

.tel_left_nav .side_nav { text-align: center;overflow:inherit; }


.cont_list li{    width: 50%;
    height: auto;}
.zuopin_list li{width:100%;margin:0;}
.zuopin_list li img{width:100%;height:auto!important;}


.top_news{height:auto;}
.top_news img{display:none;}
.top_news .top_new_r{width:100%;}


.ny_video iframe{width:100%;height:12rem;}
}