a{color:#333333;} .title{ width: 100%; height: 40px; margin-top:50px; margin-bottom: 30px; float: left; } .title img{ float: left; margin-right: 20px; } .tt{ font-family:PingFangSC-Semibold; font-size:27px; color:#333333; font-weight: bold; line-height: 33px; float: left } .title span{ font-size:18px; color:#333333; font-weight:normal; float:left; display:block; margin-top:5px; margin-left: 10px; } .web_main{ width: 100%; margin-top: 35px; } .web{ width: 27%; float: left; margin-right: 6%; height: 240px; background:#ffffff; box-shadow:0 2px 4px 0 rgba(205,205,205,0.50); border-radius:2px; display: flex; } .web_left{ width: 20%; height: 240px; font-size: 14px; line-height: 24px; border-right: 1px solid #ececec; float: left; display: flex; } .web_left span{ display: block; width: 10px; margin: 0px auto; align-self:center; } .web_right{ width: 79%; float: left; align-self:center; } .line{ display: block; float: left; width: 8px; height: 2px; background: #999999; margin-top: 11px; margin-right: 8%; } .web_right li{ margin-left: 12%; font-family:PingFangSC-Regular; font-size:16px; color:#333333; margin-bottom: 20px; } .middle{ width: 100%; height: auto; } .middle_text{ width: 50%; float: left; padding-bottom: 2%; margin-top: 60px; } .middle_text .p1{ font-family:PingFangSC-Regular; font-size:18px; color:#333333; } .middle_text .p2{ font-family:PingFangSC-Regular; font-size:18px; color:#999999; } .middle_img{ width: 46%; padding-bottom: 27%; float: left; position: relative; } .middle_img img{ width: 100%; height: 100%; position: absolute; top:30px; } .contentbox{ width: 90%; margin-left: 10%; } /*鍏紬鍙?/ .gzh{ width: 100%; height: 420px; } .gzh_main{ width: 90%; margin-left: 10%; height: 420px; } .gzh_info{ width: 100%; float: left; height: 52px; margin-bottom: 28px; } .gzh_info li{ display: block; float: left; border:1px solid #e1e1e1; width: 16%; padding-bottom: 1.1%; padding-top: 1.1%; text-align: center; font-family:PingFangSC-Regular; font-size:18px; color:#333333; margin-right: 4%; } /*灏忕▼搴?/ .xcx{ width: 88%; margin-left: 10%; } .xcx_main{ width: 100%; float: left; margin-top: 50px; } .xcx_info{ width:67px; border-radius:100%; margin-right: 8%; margin-bottom: 20px; float: left } .xcx_info img{ width:67px; height: 67px; } .xcx_title{ width: 72px; height: 40px; text-align: center; line-height: 40px; font-family:PingFangSC-Regular; font-size:18px; color:#333333; } /*APP*/ .app{ margin-top: 50px; padding-bottom:50px; } .app_info{ float: left; width: 100%; margin-top: 20px; } .app_info li { float: left; background:#ffffff; box-shadow:0 2px 4px 0 rgba(0,0,0,0.16); border-radius:2px; width: 15%; text-align: center; padding-bottom: 2.5%; padding-top: 2.5%; font-family:PingFangSC-Regular; font-size:18px; color:#333333; margin-bottom:20px; } .app_info img{width:80px;height:80px;margin-bottom:10px;} /*H5*/ .h5{ width: 88%; margin-left: 10%; margin-top: 50px; } .h5_main{ width: 100%; margin-top: 35px; } .h5_info{ width: 25%; float: left; margin-right: 6%; height: 240px; background:#ffffff; box-shadow:0 2px 4px 0 rgba(205,205,205,0.50); border-radius:2px; display: flex; } .h5_left{ width: 20%; height: 240px; font-size: 14px; line-height: 24px; border-right: 1px solid #ececec; float: left; display: flex; } .h5_left span{ display: block; width: 10px; margin: 0px auto; align-self:center; } .h5_middle{ width: 33%; float: left; align-self:center; } .line{ display: block; float: left; width: 8px; height: 2px; background: #999999; margin-top: 11px; margin-right: 8%; } .h5_middle li{ margin-left: 12%; font-family:PingFangSC-Regular; font-size:16px; color:#333333; margin-bottom: 20px; } .h5_info1{ width: 36%; float: left; margin-right: 6%; height: 240px; background:#ffffff; box-shadow:0 2px 4px 0 rgba(205,205,205,0.50); border-radius:2px; display: flex; position: relative; } .h5_right{ width: 40%; float: left; margin-top: 39px; } .h5_right li{ margin-left: 12%; font-family:PingFangSC-Regular; font-size:16px; color:#333333; margin-bottom: 20px; } .h5_right .img{ width: 25%; position: absolute; bottom: 8%; right: 8%; } @media (max-width:1000px) { .middle_img{ margin-top: 60px; } .h5_info1{ width: 45% } .h5_info{ width: 30% } .web{ width: 30%; margin-right: 2%; } }