.game5Index { width: 100%; height: 100%; } .game5Index p.bgm img{ width: 100%; height: 100%; } .game5Index .imgList li{ width: 1.21rem; height: 1.2rem; background: url(../img/game1/kuang.png) no-repeat; background-size: 100% 100%; position: absolute; right: 0; top: 0; } .game5Index .imgList li img{ position: absolute; z-index: 9999; top: 50%; left: 50%; transform: translate(-50%,-50%); } .game5Index .imgList li:nth-child(1){ right: 21%; } .game5Index .imgList li:nth-child(2){ right: 11%; } .game5Index .imgList li:nth-child(3){ right: 1%; } .game5Index .clickIcon li{ width: 1rem; height: 1rem; position: absolute; } .game5Index .clickIcon li.click1{ bottom: 5%; right: 31%; width: 1.5rem; height: 1rem; } .game5Index .clickIcon li.click2{ top: 23%; right: 70%; width: 1rem; height: 1rem; } .game5Index .clickIcon li.click3{ top: 57%; right: 84%; width: 1rem; height: 1rem; } .game5Index .clickIcon img{ width: .94rem; display: none; } /*书*/ .game5Index .maskBgm{ display: none; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(../img/game5/successBgm.png) no-repeat; background-size: 100% 100%; z-index: 99; } .game5Index .maskBgm:after { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: inherit; filter: blur(10px); z-index: 2; } .game5Index .book_box{ display: none; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 999; } .game5Index div.line{ position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: rgba(61, 117, 122,.5); width: 100%; height: 1.66rem; z-index:-1 ; display: flex; justify-content: space-between; align-items: center; } .game5Index div.line p{ box-sizing: border-box; padding: 0 1.15rem; font-size: .44rem; font-weight: 400; color: #C9C6BA; opacity: 0.41; } .game5Index div.closeIcon{ display: flex; justify-content: flex-end; margin-right: 1.2rem; margin-top: .55rem; } .game5Index div.closeIcon img{ width: .546rem; height: .546rem; } .game5Index .bookCont{ width: 9.93rem; height: 5.89rem; background: url(../img/bookBgm.png) no-repeat; background-size: 100% 100%; margin: 0 auto; z-index: 999; display: flex; } .game5Index .leftImg { width: 3.58rem; margin-left: .9rem; } .game5Index .leftImg .titleTip{ display: flex; justify-content: space-between; align-items: center; margin-top: .42rem; } .game5Index .leftImg .titleTip p{ color: #1F444B; font-size: .22rem; } .game5Index .leftImg .img{ width: 1.18rem; height: .91rem; } .game5Index .leftImg .imgList{ width: 3.58rem; height: 4.14rem; margin-top: .1rem; } .game5Index .leftImg img{ width: 100%; height: 100%; } .game5Index .rightCont{ width: 3.8rem; margin-left: 1.05rem; position: relative; } .game5Index .rightCont .titleTip{ display: flex; margin-top: .7rem; justify-content: space-between; } .game5Index .rightCont .titleTip h2, .game5Index .rightCont .titleTip h5{ color: #1F444B; font-size: .3rem; } .game5Index .rightCont .titleTip h5{ font-weight: normal; font-size: .22rem; } .game5Index .rightCont ul{ margin-top: 0.22rem; margin-left: -.32rem; } .game5Index .rightCont li{ font-size:.2rem ; color: #1F444B; line-height: .36rem; } .game5Index .rightCont .pageNum{ position: absolute; bottom:5%; left: 40%; transform: translateX(-50%); text-align: center; font-size: .2rem; color: #1F444B; } .game5Index .successBox { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 9.53rem; height: 5.83rem; background: url(../img/game5/allWin.png) no-repeat; background-size: 100% 100%; /*display: flex;*/ justify-content: center; align-items: flex-end; display: none; z-index: 99; } /*历时时间*/ .game5Index .timeNum{ font-size: .72rem; font-weight: bold; font-stretch: normal; /* letter-spacing: 5px; */ color: #ffffff; -webkit-text-stroke: 2px #306169; position: absolute; left: 61.5%; top: 56%; transform: translate(-50%, -50%); }