.secbar_pro { text-align: center; } .probar { width: 100%; height: 100px; overflow: hidden; background: rgba(0, 0, 0, 0.3); text-align: center; font-size: 0; } .probar a { display: inline-block; width: 12.5%; text-align: center; line-height: 100px; color: #fff; font-size: 1rem; cursor: pointer; } .probar a img { display: inline-block; height: 60px; margin-right: 10px; vertical-align: middle; } .probar a.on, .probar a:hover { background: rgba(0, 0, 0, .4); } .probox { margin: 80px 0; height: auto; overflow: hidden; } .probox a { display: block; float: left; width: calc(25% - 21px); height: 480px; margin-left: 28px; margin-bottom: 30px; background: #fff; } .probox a:nth-child(4n+1) { margin-left: 0; } .probox a p { display: block; width: 100%; height: 400px; overflow: hidden; } .prot { height: 80px; overflow: hidden; border: 1px solid #fff; background: url(/static/images/more.gif) calc(100% - 20px) 20px no-repeat; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .prot span { display: block; width: calc(100% - 90px); float: left; padding-left: 30px; line-height: 160%; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; } .prot span:nth-child(1) { font-size: 1.2rem; margin-top: 10px; color: #002856; font-weight: bold; } .prot span:nth-child(2) { font-size: 0.75rem; color: #999; } .probox a:hover .prot { border: 1px solid #002856; } /* 浜у搧璇︽儏 */ .proview { width: 100%; height: auto; margin: 100px 0; overflow: hidden; background: #fff; } .dalislide.prop { width: 45%; height: 600px; margin: 80px 0 0 80px; padding-bottom: 80px; float: left; } .dalislide.prop .slidep.cover li img { object-fit: contain; } .dalislide.prop .slideb { text-align: center; padding-right: 0; } .slideleft,.slideright { width: 50px; height: 50px; margin-top: -25px; opacity: 1; } .slideleft { background: url(/static/images/cpleft.png) center no-repeat; background-size: 100%; } .slideright { background: url(/static/images/cpright.png) center no-repeat; background-size: 100%; } .dalislide:hover .slideleft { left: 0; } .dalislide:hover .slideright { right: 0; } .prodes { width: 45%; height: auto; overflow: hidden; float: right; } .proviewt1 { font-size: 1.5rem; line-height: 180%; margin-top: 100px; color: #666; } .proviewt2 { font-size: 2rem; font-weight: bold; line-height: 180%; padding-bottom: 15px; border-bottom: 1px solid #666; } .proviewt3 { height: auto; overflow: hidden; margin-top: 20px; } .proviewt3 span { display: block; min-width: 48%; margin-right: 2%; max-width: 98%; height: auto; overflow: hidden; float: left; font-size: 1.1rem; line-height: 180%; margin-top: 15px; color: #666; } .proma { margin-top: 80px; } .proma img { display: block; width: 120px; } .proma span { line-height: 40px; color: #666; width: 120px; text-align: center; display: block; } .proban { width: 100%; height: auto; overflow: hidden; margin-bottom: 100px; } .proban img { display: block; width: 100%; margin: 0; } .bkbox.proviewbox { background: #fff; } .readleft { width: calc(30% - 30px); padding-left: 10px; height: auto; overflow: hidden; float: left; background: #fff; padding-bottom: 60px; } .readleft.fixed { position: fixed; z-index: 0; bottom: 0; } .readright { width: calc(70% - 20px); height: auto; overflow: hidden; float: right; background: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .readbkt { display: inline-block; line-height: 36px; border-radius: 3px; background: #002354; color: #fff; padding: 0 25px; margin: 30px 0 0 30px; font-size: 1rem; font-weight: bold; } .readbku, .proico, .readpro { padding: 10px 30px 0 30px; height: auto; overflow: hidden; } .readpro { margin-top: 20px; } .readpro a { display: block; height: auto; overflow: hidden; padding-bottom: 20px; border-bottom: 1px dashed #ccc; margin-bottom: 20px; } .readpro a img { width: calc(40% - 30px); height: 150px; display: block; object-fit: contain; float: left; } .readpro a span { display: block; width: 60%; height: auto; float: right; overflow: hidden; line-height: 150%; font-size: 0.875rem; } .readpro a span.t1 { font-size: 1.1rem; font-weight: bold; } .readpro a span.t2 { font-weight: bold; font-size: 1rem; } .readpro a span.t3 { color: #999; margin-top: 5px; } .readbku li { height: auto; overflow: hidden; padding: 10px 0; font-size: 1rem; line-height: 160%; border-bottom: 1px dotted #ccc; } .readbku li.lip { position: relative; border-bottom: 0; padding: 0; margin: 5px 0; } .readbku li.lip img { display: block; width: 100%; height: auto; } .readbku li.lip a { display: block; width: 100%; height: 100%; position: absolute; font-weight: bold; left: 0; top: 0; z-index: 10; background-image: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,0)); color: #fff; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .proico a { display: block; width: 30%; height: auto; float: left; margin: 10px 0; margin-left: 4%; line-height: 30px; font-size: 0.875rem; text-align: center; } .proico a:nth-child(3n+1) { margin-left: 0; } .proico p { display: block; width: 60px; height: 60px; background: #ccc; border-radius: 50%; margin: 10px auto; overflow: hidden; } .proico p img { display: block; width: 80%; height: 80%; margin: 10%; } .proico a:hover { font-weight: bold; } .proico a:hover p { background: #032759; } .readv { width: 100%; height: 500px; overflow: hidden; background: #000; margin-bottom: 40px; } .readcont { width: 100%; height: auto; overflow: hidden; font-size: 1rem; line-height: 180%; background: #fff; } .readcont img { display: block; width: 700px; margin: 0 auto; } @media screen and (max-width: 1680px) { .probar { height: 90px; } .probar a { line-height: 90px; font-size: 0.875rem; } .probar a img { height: 50px; } .probox { margin: 70px 0; } .probox a { height: 400px; } .probox a p { height: 330px; } .prot { height: 70px; } .prot span { width: calc(100% - 80px); padding-left: 20px; } .prot span:nth-child(1) { font-size: 1.1rem; } .proview { margin: 80px 0; } .dalislide.prop { height: 500px; margin: 60px 0 0 60px; padding-bottom: 60px; } .slideleft,.slideright { width: 40px; height: 40px; margin-top: -20px; } .proviewt1 { font-size: 1.3rem; margin-top: 70px; } .proviewt2 { font-size: 1.8rem; padding-bottom: 10px; } .proviewt3 span { font-size: 1rem; line-height: 180%; margin-top: 10px; } .proma { margin-top: 60px; } .proma img,.proma span { width: 100px; } .readpro a span { font-size: 0.75rem; } } @media screen and (max-width: 1440px) { .probar { height: 80px; } .probar a { line-height: 80px; font-size: 0.75rem; } .probar a img { height: 40px; } .probox { margin: 60px 0; } .probox a { height: 360px; } .probox a p { height: 290px; } .prot span:nth-child(1) { font-size: 1rem; } .proview { margin: 70px 0; } .dalislide.prop { height: 450px; } .proviewt1 { font-size: 1.1rem; margin-top: 70px; } .proviewt2 { font-size: 1.7rem; } .readbkt { line-height: 32px; margin: 30px 0 0 20px; font-size: 0.875rem; } .readbku, .proico, .readpro { padding: 10px 20px 0 20px; } .readbku li { font-size: 0.875rem; } .proico p { width: 50px; height: 50px; } } @media screen and (max-width: 1280px) { .probar { height: 70px; } .probar a { line-height: 70px; font-size: 0.75rem; } .probar a img { height: 30px; } .probox { margin: 50px 0; } .probox a { height: 330px; } .probox a p { height: 270px; } .prot { height: 60px; } .prot span:nth-child(1) { font-size: 1rem; } .proview { margin: 60px 0; } .dalislide.prop { height: 410px; } .proviewt1 { font-size: 1.1rem; margin-top: 60px; } .proviewt2 { font-size: 1.7rem; } .readbkt { line-height: 28px; margin: 20px 0 0 20px; font-size: 0.75rem; } .proico p { width: 40px; height: 40px; } } @media screen and (max-width: 1024px) { .probar { height: 60px; } .probar a { line-height: 60px; } .probar a img { height: 25px; } .probox { margin: 40px 0; } .probox a { height: 300px; } .probox a p { height: 240px; } .proview { margin: 50px 0; } .dalislide.prop { height: 350px; } .proview { margin: 60px 0; } .dalislide.prop { height: 400px; } .proviewt1 { font-size: 1rem; margin-top: 60px; } .proviewt2 { font-size: 1.5rem; } .proviewt3 span { font-size: 0.875rem; line-height: 180%; } .proma { margin-top: 50px; } .proma img,.proma span { width: 100px; } }