@subject-maxwidth:1460px; @subject-minwidth:1220px; @font-face { font-family: 'iconfont'; src: url('../../iconfont/iconfont.eot'); src: url('../../iconfont/iconfont.eot?#iefix') format('embedded-opentype'), url('../../iconfont/iconfont.woff') format('woff'), url('../../iconfont/iconfont.ttf') format('truetype'), url('../../iconfont/iconfont.svg#iconfont') format('svg'); } *{ margin:0; padding:0; list-style: none; border:none; font-style: normal; } html{ width:100%; min-width: @subject-minwidth; font-family:"Source Han Sans SC","HanHei SC","PingFang SC","Helvetica Neue",Helvetica,"Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif; } img{ display:block; } a{ text-decoration: none; color: #333; } .iconfont{ font-family:"iconfont" !important; font-size:14px;font-style:normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; } .banner-box{ img{ width: 100%; } } .cooperative-box{ background: #f5f5f5; padding: 90px 0 100px; .cooperative-title-box{ width: @subject-minwidth; margin: 0 auto; h1{ font-weight: 400; text-align: center; font-size: 34px; span{ display: inline-block; position: relative; top: -12px; width: 57px; height: 1px; margin: 0 20px; background: #d8d8d8; } } .introduce-text{ display: block; text-align: center; font-size: 14px; padding:6px 0; color: #999; } } .cooperative-text-box{ max-width: 1220px; margin: 30px auto; p{ font-size: 16px; line-height: 40px; text-align: center; } } .cooperative-content-box{ width: @subject-minwidth; margin: 0 auto; div{ margin-top: 37px; ul:after{ content:""; display: block; clear: both; } ul{ li{ float: left; width: 277px; height: 189px; margin-right: 37px; background: bisque; position: relative; overflow: hidden; span{ position: absolute; display: block; width: 100%; height: 35px; background: rgba(0,0,0,0.3); bottom: -35px; text-align: center; color: #fff; line-height: 40px; font-size: 18px; font-weight: 600; letter-spacing: 5px; } img{ width: 100%; } } } } } } @media screen and (min-width: 1460px){ .cooperative-box{ .cooperative-title-box{ width:@subject-maxwidth; h1{ font-size: 42px; span{ margin: 0 26px; } } .introduce-text{ font-size: 18px; } } .cooperative-content-box{ width:@subject-maxwidth; div{ ul{ li{ width: 337px; height: 230px; span{ height: 40px; bottom: -40px; line-height: 30px; font-size: ; } } } } } } }