/*section1*/ @media screen and (min-width: 1200px) { .section1 { position: relative; height: 700px; } .section1 .banner { overflow: hidden; width: 100%; height: 650px; position: absolute; left: 0; top: 80px } /*background:url(../images/banner.jpg) no-repeat center;*/ .section1 .btn { overflow: hidden; width: 256px; position: absolute; left: 50%; bottom: 80px; margin-left: -128px; z-index: 5 } .section1 .btn span { display: block; float: left; margin: 0 2px; width: 58px; height: 1px; border: 1px solid #fff; opacity: 0.6; } .section1 .btn span.cur { border: 1px solid #ff0d00; opacity: 1; background-color: #ff0d00; } /*section2*/ .section2 { background-color: #e9eff8; padding: 90px 0 } .section2 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; } .section2 h3 a { color: #333; } .section2 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section2 i { display: block; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; margin-bottom: 40px; } .section2 .probox { overflow: hidden; width: 1200px; margin: 0 auto; height: 480px; position: relative; margin-bottom: 25px; } .section2 .probox ul { padding: 10px; overflow: hidden; width: 1230px; } .section2 .probox li { overflow: hidden; float: left; position: relative; width: 386px; height: 460px; margin-right: 16px; background-color: #fff; } .section2 .probox li img { display: block; position: absolute; left: 0; top: 0 } .section2 .probox li .wen { overflow: hidden; padding: 0 20px; width: 346px; height: 93px; border-top: 1px solid #ccc; position: absolute; left: 0; bottom: 0; z-index: 2; background: url(../images/p02_jiantou.png) no-repeat -40px center; } .section2 .probox li h4 { font-size: 16px; font-weight: normal; margin-top: 20px; margin-bottom: 5px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .section2 .probox li h4 a { color: #333; } .section2 .probox li p { font-size: 12px; color: #999; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 280px; } .section2 .btn { overflow: hidden; width: 128px; margin: 0 auto; margin-bottom: 25px; } .section2 .btn span { display: block; float: left; margin: 0 2px; width: 58px; height: 1px; border: 1px solid #999; opacity: 0.6; } .section2 .btn span.cur { border: 1px solid #ff0d00; opacity: 1; background-color: #ff0d00; } .section2 .more { display: block; width: 248px; height: 38px; border: 1px solid #999; margin: 0 auto; text-align: center; line-height: 38px; font-size: 12px; color: #888; font-family: Arial; } .section2 .more img { display: none; position: relative; top: 1px; } .section2 .probox li:hover { box-shadow: 0 0 10px #ccc; } .section2 .probox li:hover a { color: #fff; } .section2 .probox li:hover p { color: #a3beef; } /*section3*/ .section3 { overflow: hidden; z-index: 2; } .section3 .video { overflow: hidden; width: 50%; height: 100%; background-color: #000; float: left } .section3 .video img { display: block; width: 100%; } .section3 .wen { overflow: hidden; width: 100%; /* float: left; */ height: 100%; } .section3 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; margin:20px 0px } .section3 h3 a { color: #333; } .section3 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section3 i { display: block; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; margin-bottom: 40px; } .section3 p { font-size: 14px; color: #777; line-height: 26px; width: 72%; height: 130px; overflow: hidden; margin: 0 auto; margin-bottom: 30px; } .section3 .more { display: block; width: 148px; height: 38px; border: 1px solid #999; margin: 0px auto; margin-bottom: 20px; text-align: center; line-height: 38px; font-size: 12px; color: #888; font-family: Arial } .section3 .more img { display: none; position: relative; top: 1px; } /*section4*/ .section4 { /* background-color: #e9eff8; */ padding: 90px 0; background-image: url(../images/product_back.jpg); } .section4 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; } .section4 h3 a { color: #fff; } .section4 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section4 i { display: block; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; margin-bottom: 40px; } .section4 .jsBox { color: #fff; overflow: hidden; width: 1200px; margin: 0 auto; height: 330px; position: relative } .section4 .jslist { overflow: hidden; width: 366px; height: 330px; position: absolute; top: 0 } .section4 .js01 h4 { color: #fff; } .section4 .js02 h4 { color: #fff; } .section4 .js03 h4 { color: #fff; } .section4 .js04 h4 { color: #fff; } .section4 .js01 { left: 0 } .section4 .js02 { left: 50%; margin-left: -183px; } .section4 .js03 { right: 0 } .section4 em { display: block; position: absolute; left: 0; top: 0; font-size: 26px; color: #dadada; font-family: Arial; padding-top: 7px; border-top: 1px solid #f1f1f1; } .section4 h4 { font-weight: normal; text-align: center; font-size: 18px; color: #333; margin-bottom: 10px; } .section4 p { font-size: 14px; color: #efefef; line-height: 22px; text-align: center; } .section4 b { display: block; width: 150px; height: 150px; overflow: hidden; margin: 0 auto; margin-top: 40px; margin-bottom: 25px; } /*section5*/ .section5 { overflow: hidden; padding: 60px 0; } .section5 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; color: #333; } .section5 h3 a { color: #333; } .section5 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section5 h6 { display: block; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; margin-bottom: 40px; } .section5 .pzbox { overflow: hidden; width: 100%; } .section5 dl { overflow: hidden; width: 50%; *width: 49.9%; float: left; background-color: #f1f1f1; position: relative } .section5 dt { overflow: hidden; width: 50%; float: left; position: relative } .section5 dt img { display: block; width: 100%; } .section5 dt img.imgp { position: absolute; left: 0; top: 0 } .section5 dd { float: left; width: 40%; *width: 39%; height: 100%; padding: 0 5%; position: relative } .section5 h5 { font-weight: normal; font-size: 18px; color: #333; margin-top: 20%; margin-bottom: 5px; } .section5 em { display: block; font-size: 14px; color: #555; margin-bottom: 13px; font-family: Arial; } .section5 p { font-size: 14px; color: #777; line-height: 24px; height: 72px; } .section5 i { display: block; width: 40px; height: 1px; background-color: #999; position: absolute; left: 10%; top: 105%; } .section5 .fr { float: right } .section5 .fl { float: left } /*section6*/ .section6 { overflow: hidden; padding: 20px 0 100px 0; } .section6 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; } .section6 h3 a { color: #333; } .section6 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section6 i { display: block; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; margin-bottom: 40px; } .section6 .newsbox { width: 1200px; margin: 0 auto; margin-bottom: 50px; height: 380px; position: relative } .section6 .newslist { overflow: hidden; width: 360px; height: 400px; border-top: 1px solid #cecece; position: absolute; top: 200px; } .section6 .news01 { left: 0 } .section6 .news02 { left: 50%; margin-left: -180px; } .section6 .news03 { right: 0; } .section6 .news04{ float: left; } .section6 .news05{ float: left; left: 420px; } .section6 .news06{ float: left; left: 845px; } .section6 .newslist img { display: block; width: 360px; height: 234px; } .section6 .newslist h4 { font-family: Arial; font-weight: normal; font-size: 36px; color: #333; position: absolute; left: 0; top: 30px; width: 100%; background: url(../images/p06_more.png) no-repeat -100px center; } .section6 .newslist h4 em { font-family: Arial; font-size: 14px; color: #888; margin-left: 10px; } .section6 .newslist h5 { font-size: 16px; margin-bottom: 10px; font-weight: normal; padding-top: 85px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .section6 .newslist h5 a { color: #333; } .section6 .newslist p { font-size: 12px; color: #777; line-height: 22px; height: 44px; overflow: hidden } .section6 .newslist>a { display: block; width: 360px; height: 234px; overflow: hidden; position: absolute; left: 0; bottom: 0; } .section6 .more { display: block; width: 248px; height: 38px; border: 1px solid #999; margin: 0 auto; text-align: center; line-height: 38px; font-size: 12px; color: #888; font-family: Arial } .section6 .more img { display: none; position: relative; top: 1px; } /*section7*/ .section7 { background-color: #00295f; overflow: hidden; padding: 50px 0; } .section7 .footer { overflow: hidden; width: 1200px; margin: 0 auto; } .section7 .footer .t_top { overflow: hidden; height: 160px; padding-bottom: 45px; border-bottom: 1px solid #12386a; } .section7 .footer dl { overflow: hidden; padding: 0 35px; border-right: 1px solid #12386a; float: left; height: 160px; } .section7 .footer dt { overflow: hidden; font-size: 14px; padding-bottom: 15px; background: url(../images/p07_x.png) no-repeat left bottom; margin-bottom: 10px; } .section7 .footer dt a { color: #fff; } .section7 .footer dd { overflow: hidden } .section7 .footer dd a { display: block; font-size: 12px; color: #fff; opacity: 0.5; line-height: 30px; } .section7 .footer .dl01 { padding-left: 0; } .section7 .footer .dl05 { padding-right: 95px; } .section7 .footer .wen { overflow: hidden; width: 175px; float: left; margin-left: 95px; } .section7 .footer .wen p { font-size: 12px; color: #fff; } .section7 .footer .wen h4 { font-weight: normal; font-size: 22px; color: #fff; font-family: Arial; margin-bottom: 10px; } .section7 .footer .wen .qq { display: block; padding: 0 10px; width: 155px; text-align: right; height: 34px; line-height: 34px; background: url(../images/p07_qq.png) no-repeat 15px center; background-color: #0f64d7; font-size: 12px; color: #fff; margin-bottom: 15px; } .section7 .footer .wen i { display: block; width: 30px; height: 2px; background-color: #ff0d00; margin-bottom: 15px; } .section7 .footer .wen .share { overflow: hidden; width: 100%; height: 24px; line-height: 24px; } .section7 .footer .wen .share span { display: block; float: left; font-size: 12px; color: #fff; } .section7 .footer .wen .share a { display: block; width: 25px; height: 24px; float: left; margin: 0 5px; } .section7 .footer .wen .a01 { background: url(../images/p07_wx.png) no-repeat center top; } .section7 .footer .wen .a02 { background: url(../images/p07_sina.png) no-repeat center top; } .section7 .footer .wen .a03 { background: url(../images/p07_tx.png) no-repeat center top; } .section7 .footer .wen .share a:hover { background-position: bottom; } .section7 .footer .ewm { overflow: hidden; float: right; width: 121px; height: 121px; } .section7 .footer .link { overflow: hidden; float: left; margin-top: 65px; width: 550px; } .section7 .footer .link h3 { font-size: 12px; font-weight: normal; float: left } .section7 .footer .link a { color: #fff; } .section7 .footer .link ul { overflow: hidden; float: left; width: 470px; } .section7 .footer .link li { float: left; padding: 0 10px; border-right: 1px solid #4d6a8f; font-size: 12px; } .section7 .footer .info { overflow: hidden; float: right; text-align: right; margin-top: 40px; } .section7 .footer .info p { font-size: 12px; color: #fff; line-height: 24px; opacity: 0.5; } .section7 .footer .info a { color: #fff; margin-left: 20px; } /*首页广告*/ /*#flashs{ position:relative; height:650px; overflow:hidden;} #flashs .bgitem{ z-index:1;position:absolute; top:0; } #flashs .btn{ position:absolute; z-index:7; bottom:75px; left:50%; margin-left:-95px; padding:0px 6px;} #flashs .btn span{ color:#fff; background:#333; cursor: pointer;display: inline-block;margin:0 2px;width:25px;height:25px;font-size:14px;line-height:25px;text-align:center;} #flashs .btn span.cur{ background:#c3161c;}*/ #flashs { position: relative; height: 650px; overflow: hidden; } #flashs .bgitem { z-index: 1; position: absolute; top: 0; } #flashs .btn { overflow: hidden; width: 256px; position: absolute; left: 50%; bottom: 80px; margin-left: -128px; z-index: 5 } #flashs .btn span { display: block; float: left; margin: 0 2px; width: 58px; height: 1px; border: 1px solid #fff; opacity: 0.6; } #flashs .btn span.cur { border: 1px solid #ff0d00; opacity: 1; background-color: #ff0d00; } .section1 .banner { overflow: hidden; width: 100%; height: 620px; position: absolute; left: 0; top: 80px } /*background:url(../images/banner.jpg) no-repeat center;*/ .section1 .btn { overflow: hidden; width: 256px; position: absolute; left: 50%; bottom: 80px; margin-left: -128px; z-index: 5 } .section1 .btn span { display: block; float: left; margin: 0 2px; width: 58px; height: 1px; border: 1px solid #fff; opacity: 0.6; } .section1 .btn span.cur { border: 1px solid #ff0d00; opacity: 1; background-color: #ff0d00; } #CuPlayer_jwplayer_display_image { width: 100% !important; height: auto !important; } } /* ipad等手机样式 */ @media (max-width: 768px) { .section1 { position: relative; height: 700px; } .section1 .banner { overflow: hidden; width: 100%; height: 650px; position: absolute; left: 0; top: 80px } /*background:url(../images/banner.jpg) no-repeat center;*/ .section1 .btn { overflow: hidden; width: 256px; position: absolute; left: 50%; bottom: 80px; margin-left: -128px; z-index: 5 } .section1 .btn span { display: block; float: left; margin: 0 2px; width: 58px; height: 1px; border: 1px solid #fff; opacity: 0.6; } .section1 .btn span.cur { border: 1px solid #ff0d00; opacity: 1; background-color: #ff0d00; } /*section2*/ .section2 { background-color: #e9eff8; padding: 20px 0 } .section2 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; } .section2 h3 a { color: #333; } .section2 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section2 i { display: none; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; margin-bottom: 40px; } .section2 .probox { overflow: hidden; width: 100%; margin: 0 auto; height: auto; position: relative; margin-bottom: 25px; } .section2 .probox ul { padding: 1%; overflow: hidden; width: 98%; } .section2 .probox li { overflow: hidden; float: left; position: relative; width: 100%; height: 460px; margin-right: 16px; background-color: #fff; } .section2 .probox li a{ color: #fff; } .section2 .probox li img { display: block; position: absolute; left: 0; top: 0 } .section2 .probox li .wen { overflow: hidden; padding: 0 20px; width: 100%; height: 93px; border-top: 1px solid #ccc; position: absolute; left: 0; bottom: 0; z-index: 2; background: url(../images/p02_jiantou.png) no-repeat -40px center; } .section2 .probox li h4 { font-size: 16px; font-weight: normal; margin-top: 20px; margin-bottom: 5px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .section2 .probox li h4 a { color: #333; } .section2 .probox li p { font-size: 12px; color: #999; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 280px; } .section2 .btn { overflow: hidden; width: 128px; margin: 0 auto; margin-bottom: 25px; } .section2 .btn span { display: block; float: left; margin: 0 2px; width: 58px; height: 1px; border: 1px solid #999; opacity: 0.6; } .section2 .btn span.cur { border: 1px solid #ff0d00; opacity: 1; background-color: #ff0d00; } .section2 .more { display: block; width: 248px; height: 38px; border: 1px solid #999; margin: 0 auto; text-align: center; line-height: 38px; font-size: 12px; color: #888; font-family: Arial; } .section2 .more img { display: none; position: relative; top: 1px; } .section2 .probox li:hover { box-shadow: 0 0 10px #ccc; } .section2 .probox li:hover a { color: #fff; } .section2 .probox li:hover p { color: #a3beef; } /*section3*/ .section3 { overflow: hidden; z-index: 2; } .section3 .video { overflow: hidden; width: 50%; height: 100%; background-color: #000; float: left } .section3 .video img { display: block; width: 100%; } .section3 .wen { overflow: hidden; width: 100%; /* float: left; */ height: 100%; } .section3 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; margin:20px 0px } .section3 h3 a { color: #333; } .section3 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section3 i { display: block; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; } .section3 p { font-size: 14px; color: #777; line-height: 26px; width: 98%; height: 130px; overflow: hidden; margin: 0 auto; margin-bottom: 30px; } .section3 .more { display: block; width: 148px; height: 38px; border: 1px solid #999; margin: 0px auto; margin-bottom: 20px; text-align: center; line-height: 38px; font-size: 12px; color: #888; font-family: Arial } .section3 .more img { display: none; position: relative; top: 1px; } /*section4*/ .section4 { display: none; /* background-color: #e9eff8; */ padding: 90px 0; background-image: url(../images/product_back.jpg); } .section4 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; } .section4 h3 a { color: #fff; } .section4 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section4 i { display: block; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; margin-bottom: 40px; } .section4 .jsBox { overflow: hidden; width: 1200px; margin: 0 auto; height: 330px; position: relative } .section4 .jslist { overflow: hidden; width: 366px; height: 330px; position: absolute; top: 0 } .section4 .js01 h4 { color: #fff; } .section4 .js02 h4 { color: #fff; } .section4 .js03 h4 { color: #fff; } .section4 .js04 h4 { color: #fff; } .section4 .js01 { left: 0 } .section4 .js02 { left: 50%; margin-left: -183px; } .section4 .js03 { right: 0 } .section4 em { display: block; position: absolute; left: 0; top: 0; font-size: 26px; color: #dadada; font-family: Arial; padding-top: 7px; border-top: 1px solid #f1f1f1; } .section4 h4 { font-weight: normal; text-align: center; font-size: 18px; color: #333; margin-bottom: 10px; } .section4 p { font-size: 14px; color: #efefef; line-height: 22px; text-align: center; } .section4 b { display: block; width: 150px; height: 150px; overflow: hidden; margin: 0 auto; margin-top: 40px; margin-bottom: 25px; } /*section5*/ .section5 { overflow: hidden; padding: 10px 0; } .section5 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; color: #333; } .section5 h3 a { color: #333; } .section5 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section5 h6 { display: block; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; margin-bottom: 40px; } .section5 .pzbox { overflow: hidden; width: 100%; } .section5 dl { overflow: hidden; width: 100%; *width: 49.9%; float: left; background-color: #f1f1f1; position: relative; margin-bottom: 2%; } .section5 dt { overflow: hidden; width: 50%; float: left; position: relative } .section5 dt img { display: block; width: 100%; } .section5 dt img.imgp { position: absolute; left: 0; top: 0 } .section5 dd { float: left; width: 40%; *width: 39%; height: 100%; padding: 0 5%; position: relative } .section5 h5 { font-weight: normal; font-size:1rem; color: #333; margin-top: 1%; margin-bottom: 1px; } .section5 em { /* display: block; */ font-size: 14px; color: #555; margin-bottom: 13px; font-family: Arial; } .section5 p { font-size: 14px; color: #777; line-height: 24px; height: 72px; } .section5 i { display: block; width: 40px; height: 1px; background-color: #999; position: absolute; left: 10%; top: 105%; } .section5 .fr { float: right } .section5 .fl { float: left } /*section6*/ .section6 { overflow: hidden; padding: 1%; } .section6 h3 { text-align: center; margin-bottom: 5px; font-weight: normal; font-size: 26px; } .section6 h3 a { color: #333; } .section6 span { display: block; text-align: center; font-size: 12px; color: #999; font-family: Arial; margin-bottom: 10px; } .section6 i { display: none; width: 30px; height: 1px; background-color: #1652ba; margin: 0 auto; margin-bottom: 40px; } .section6 .newsbox { width: 100%; margin: 0 auto; margin-bottom: 2rem; height: auto; overflow: hidden; } .section6 .newslist { overflow: hidden; width: 100%; height: auto; border-top: 1px solid #cecece; } .section6 .news01 { left: 0 } .section6 .news02 { } .section6 .news03 { right: 0; } .section6 .newslist img { display: block; width: 100%; height: auto; } .section6 .newslist h4 { display: none; font-family: Arial; font-weight: normal; font-size: 36px; color: #333; position: absolute; left: 0; top: 30px; width: 100%; background: url(../images/p06_more.png) no-repeat -100px center; } .section6 .newslist h4 em { font-family: Arial; font-size: 14px; color: #888; margin-left: 10px; } .section6 .newslist h5 { font-size: 1rem; margin-bottom: 10px; font-weight: normal; padding-top:1.2rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .section6 .newslist h5 a { color: #333; } .section6 .newslist p { font-size: 12px; color: #777; line-height: 22px; height: 44px; overflow: hidden; } .section6 .newslist>a { display: block; width: 100%; height: auto; overflow: hidden; } .section6 .more { display: block; width: 248px; height: 38px; border: 1px solid #999; margin: 0 auto; text-align: center; line-height: 38px; font-size: 12px; color: #888; font-family: Arial } .section6 .more img { display: none; position: relative; top: 1px; } /*首页广告*/ /*#flashs{ position:relative; height:650px; overflow:hidden;} #flashs .bgitem{ z-index:1;position:absolute; top:0; } #flashs .btn{ position:absolute; z-index:7; bottom:75px; left:50%; margin-left:-95px; padding:0px 6px;} #flashs .btn span{ color:#fff; background:#333; cursor: pointer;display: inline-block;margin:0 2px;width:25px;height:25px;font-size:14px;line-height:25px;text-align:center;} #flashs .btn span.cur{ background:#c3161c;}*/ #flashs { position: relative; height: 650px; overflow: hidden; } #flashs .bgitem { z-index: 1; position: absolute; top: 0; } #flashs .btn { overflow: hidden; width: 256px; position: absolute; left: 50%; bottom: 80px; margin-left: -128px; z-index: 5 } #flashs .btn span { display: block; float: left; margin: 0 2px; width: 58px; height: 1px; border: 1px solid #fff; opacity: 0.6; } #flashs .btn span.cur { border: 1px solid #ff0d00; opacity: 1; background-color: #ff0d00; } .section1 .banner { overflow: hidden; width: 100%; height: 620px; position: absolute; left: 0; top: 80px } /*background:url(../images/banner.jpg) no-repeat center;*/ .section1 .btn { overflow: hidden; width: 256px; position: absolute; left: 50%; bottom: 80px; margin-left: -128px; z-index: 5 } .section1 .btn span { display: block; float: left; margin: 0 2px; width: 58px; height: 1px; border: 1px solid #fff; opacity: 0.6; } .section1 .btn span.cur { border: 1px solid #ff0d00; opacity: 1; background-color: #ff0d00; } #CuPlayer_jwplayer_display_image { width: 100% !important; height: auto !important; } }