.pagebox { background: url(../images/indexbg.png) no-repeat center 2.44rem; background-size: cover; padding-top: .4rem; }

.pagebox:after { position: absolute; left: 0px; top: 0px; z-index: 1; width: 100%; height: 100%; display: block; content: ''; background: url(../images/indextopbg.png) no-repeat center top; background-size: 100% auto; }

.pagebox .container { width: 100%; height: calc(100vh - 3.3rem); position: absolute; left: 0px; top: 3.3rem; z-index: 2; }

.pagebox .container .indexList { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }

.pagebox .container .indexList ul { width: 6rem; display: flex; flex-wrap: wrap; justify-content: space-between; }

.pagebox .container .indexList ul li { width: 2.8rem; margin-bottom: .5rem; }

.pagebox .container .indexList ul li a { display: block; width: 100%; height: 100%; }

.pagebox .container .indexList ul li .img { width: 100%; height: 3.22rem; box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.3); position: relative; }

.pagebox .container .indexList ul li .img img { width: 100%; height: 100%; }

.pagebox .container .indexList ul li .img .info { height: .9rem; width: 100%; position: absolute; left: 0px; bottom: 0px; z-index: 1; color: #fff; text-align: center; box-sizing: border-box; padding-top: .1rem; }

.pagebox .container .indexList ul li .img .info i { position: absolute; left: 0px; top: 0px; display: block; height: 100%; width: 100%; opacity: .7; z-index: -1; }

.pagebox .container .indexList ul li .img .info .h5 { font-size: .26rem; font-weight: bold; line-height: .34rem; }

.pagebox .container .indexList ul li .img .info .h6 { font-size: .24rem; line-height: .34rem; }

.pagebox .container .indexList ul li .pagebutton { margin-top: .2rem; }