.continueHighBanner img{ width: 100%; } .marketTitle{ clear: both; margin-top: 100px; margin-bottom: 15px; } .marketTitle h3{ font-weight: 700; font-size: 28px; color: #333333; margin-bottom: 10px; } .marketTitle p{ width: 1000px; font-size: 16px; } .marketInternational,.marketGovernment,.marketJun{ width: 100%; display: flex; display: -webkit-flex; justify-content: space-between; } .marketInternational a,.marketGovernment a,.marketJun a { display: inline-block; width: 100%; height: 100%; } .marketInternational >div{ width: 280px; height: 210px; padding-right: 30px; text-align: right; transition: all .2s ease-in-out } .marketInternational>div:nth-child(1){ background: url(../../../../img/load/marketOpen_2.jpg) no-repeat; background-size:100% 100%; } .marketInternational>div:nth-child(2){ background: url(../../../../img/load/marketOpen_3.jpg) no-repeat; background-size:100% 100%; } .marketInternational>div:nth-child(3){ background: url(../../../../img/load/marketOpen_4.jpg) no-repeat; background-size:100% 100%; } .marketInternational>div:nth-child(4){ background: url(../../../../img/load/marketOpen_5.jpg) no-repeat; background-size:100% 100%; } .marketInternational>div div,.marketGovernment>div div{ float: right; width: 160px; margin-top: 56px; font-size: 18px; color: #fff; } .marketInternational div span,.marketGovernment div span{ width: 44px; height: 4px; display: inline-block; background: #fff; margin-top: 5px; } .marketGovernment>div div{ margin-top: 110px; } .marketGovernment>div{ width: 573px; height: 210px; text-align: right; padding-right:30px; transition: all .2s ease-in-out } .marketGovernment>div:nth-child(1){ background: url(../../../../img/load/marketOpen_6.jpg) no-repeat; background-size:100% 100%; } .marketGovernment>div:nth-child(2){ background: url(../../../../img/load/marketOpen_7.jpg) no-repeat; background-size:100% 100%; } .marketJun{ margin-bottom: 150px; } .marketJun>div { width: 358px; height: 320px; padding-right:40px; text-align: right; transition: all .2s ease-in-out } .marketJun>div p{ width: 140px; font-size: 18px; color: #fff; margin-top: 237px; float: right } .marketJun>div:nth-child(1){ background: url(../../../../img/load/marketOpen_8.jpg) no-repeat; background-size:100% 100%; } .marketJun>div:nth-child(2){ background: url(../../../../img/load/marketOpen_9.jpg) no-repeat; background-size:100% 100%; } .marketJun>div:nth-child(3){ background: url(../../../../img/load/marketOpen_10.jpg) no-repeat; background-size:100% 100%; } .marketInternational>div:hover,.marketJun >div:hover,.marketGovernment>div:hover{ box-shadow: 0 0 20px #ccc; transition: all .2s ease-in; cursor: pointer; } @media screen and (max-width:1200px){ .advantage,.continueHighBanner{ width: 1200px; } }