.detail-body { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 1500; background-color: #F5F6FA; } .detail-body .detail-box { padding-top: 30px; box-sizing: border-box; width: 100%; height: 100%; position: fixed; left: 0; top: 0; background: rgba(242, 242, 242, .95); z-index: 1500; overflow: auto; } .game-detail-inner { width: 1024px; margin: auto; } .game-detail-inner .detail-list { padding: 20px; margin-bottom: 20px; } .game-detail-inner .detail-list dl { margin-top: 0; margin-bottom: 1rem; position: relative; padding-left: 175px; min-height: 144px; } .game-detail-inner .detail-list dl dt { left: 0; top: 0; position: absolute; } .game-detail-inner .detail-list dl dt img { width: 144px; height: 144px; border-radius: 10px; } .game-detail-inner .detail-list dl dd { margin-bottom: 0.5rem; } .game-detail-inner .detail-list dl .game-title { font-size: 24px; font-weight: bold; padding-top: 10px; text-align: left; } .game-detail-inner .detail-list dl .game-word { padding-top: 10px; width: 100%; text-align: left; } .game-detail-inner .detail-list dl .game-word span { display: inline-block; margin-right: 30px; font-size: 14px; color: #76838f; font-weight: 300; } .game-detail-inner .detail-list dl .game-word span b { color: #76838f; font-weight: 300; } .game-detail-inner .detail-list dl .game-tab { text-align: left; padding-top: 20px; margin-left: 10px; } .game-detail-inner .detail-list dl .game-tab i { display: inline-block; margin-right: 10px; padding: 0 15px; height: 21px; line-height: 21px; color: #fff; font-style: normal; text-align: center; background: #ffb230; border-radius: 11px; } .game-detail-inner .game-detail-outer .game-detail-left { width: 645px; } .game-detail-inner .detail-con { background: #fff; margin-bottom: 20px; } .game-detail-inner .game-detail-left .game-synopsis p { padding: 20px; line-height: 1.8; font-size: 14px; } .game-detail-inner .game-detail-left .pic-box { overflow: hidden; padding: 50px 0; position: relative; } .game-detail-inner .game-detail-left .pic-box .game-slides { width: 550px; height: 405px; margin: auto; } .game-slides { position: relative; } .game-slides, .slides-item { overflow: hidden; } .game-detail-inner .game-detail-left .pic-box ul { overflow: hidden; position: absolute; left: 0; top: 0; transition: 0.3s; } .game-detail-inner .game-detail-left .pic-box li { float: left; padding-right: 10px; } .game-detail-inner .game-detail-left .pic-box li img { width: 270px; height: 405px; } .game-detail-inner .game-detail-left .pic-box .pic-prev { left: 10px; } .game-detail-inner .game-detail-left .pic-box .pic-prev, .game-detail-inner .game-detail-left .pic-box .pic-next { position: absolute; top: 50%; margin-top: -55px; height: 110px; line-height: 110px; width: 26px; background-color: #ebebeb; } .game-detail-inner .game-detail-left .pic-box .pic-prev:hover, .game-detail-inner .game-detail-left .pic-box .pic-next:hover { background-color: #4ac5c3; } .game-detail-inner .game-detail-right { width: 360px; } .game-detail-inner .detail-con { background: #fff; margin-bottom: 20px; } .game-detail-inner .game-detail-right .game-date .date-box { padding: 20px; } .game-detail-inner .game-detail-right .game-date ul { overflow: hidden; } .game-detail-inner .game-detail-right .date-tit { height: 30px; line-height: 30px; background: #eee; font-size: 14px; } .game-detail-inner .game-detail-right .date-tit li:nth-child(1) { text-align: center; } .game-detail-inner .game-detail-right .game-date li:nth-child(1) { width: 130px; } .game-detail-inner .game-detail-right .game-date li { float: left; } .game-detail-inner .game-detail-right .list-outer { position: relative; height: 240px; margin-top: 11px; } .game-detail-inner .game-detail-right .date-list { position: relative; } .game-detail-inner .game-detail-right .date-list li { margin: 10px 0; } .game-detail-inner .game-detail-right .date-list li:nth-child(1) .ios, .game-detail-inner .game-detail-right .date-list li:nth-child(1) .android { margin: 0 0 0 17px; padding-left: 0; text-indent: -9999px; width: 99px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGMAAAAaCAYAAACjFuKcAAAAAXNSR…8ShP6vOgu4W3/VEbLLoxfCpb7hDuZRZT7+JyzS6WC6eugBaeWYY1+f+HoAAAAASUVORK5CYII=) no-repeat left center; } .game-detail-inner .game-detail-right .date-list li:nth-child(1) span { display: block; margin: 0 0 0 18px; padding: 0 0 0 25px; width: 111px; height: 30px; color: #ed6a3c; font-size: 14px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAG8AAAAeCAYAAAAiu0AEAAAAAXNSR…BDUfI43Mw6BLgB8jwG8jwG8jwG8jwG8jwG8jymcHmgRGL6Bkqqr1kgPSA1AAAAAElFTkSuQmCC) no-repeat; } .game-detail-inner .game-detail-right .pack-box { padding: 10px 0 30px; } .game-detail-inner .game-detail-right .pack-box li { padding: 0 20px; } .game-detail-inner .game-detail-right .pack-box li .pack-inner { padding: 8px 0 12px; border-bottom: #f5f5f5 1px solid; font-size: 14px; } .game-detail-close { position: absolute; right: 20px; top: 20px; color: #76838f; } .detail-box ul, .detail-box p { list-style: none; padding: 0; margin: 0; color: #76838f; font-weight: 300; } .game-detail-inner .game-detail-right .pack-box li .pack-word { display: none; font-size: 12px; } .detail-box ul, .detail-box p { list-style: none; padding: 0; margin: 0; } .game-detail-inner .game-detail-right .pack-box li .pack-num b { color: #ed6a3c; font-weight: normal; } .panel { position: relative; margin-bottom: 2.143rem; background-color: #fff; border: 0 solid transparent; border-radius: .286rem; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05); box-shadow: 0 1px 1px rgba(0, 0, 0, .05); } .panel-heading { position: relative; padding: 0; border-bottom: 1px solid transparent; border-top-left-radius: .214rem; border-top-right-radius: .214rem; } .panel-bordered > .panel-heading > .panel-title { padding-bottom: 20px; } .panel-title { display: block; margin-top: 0; margin-bottom: 0; padding: 20px 30px; font-size: 18px; color: #37474f; font-weight: 400; } .fl { float: left; } .fr { float: right; } .game-ul { width: 100%; } .game-ul .game-li { padding-left: 0; padding-right: 0; padding-top: 10px; padding-bottom: 10px; } .game-ul .game-li .media { width: 100%; display: flex; } .game-ul .game-li .media .img-box { padding-right: 20px; } .game-ul .game-li .media .img-box img { width: 70px; height: 70px; display: block; border-radius: 8px; } .game-ul .game-li .media .game-msg .game-title { margin-bottom: 5px; font-size: 1.1rem; } .game-ul .game-li .media .game-msg p { padding: 2px 0; font-size: 0.9rem; } .game-ul .game-li .media .game-operating { text-align: right; font-size: 1.1rem; color: #3A97FF; } .btn { border: 1px solid #3A97FF; width: 88px; line-height: 34px; text-align: center; color: #3A97FF; cursor: pointer; } .btn p { width: 100%; } .highlight { color: #fff; background-color: #3A97FF; } .game-window-box { position: fixed; top: 100px; left: 600px; width: 539px; height: 703px; background-color: #fff; z-index: 2; display: none;; } .game-window-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #0a0a0a; opacity: 0.5; z-index: 1; display: none;; } .game-window-title { width: 100%; padding: 15px 20px; display: flex; margin-bottom: 20px; } .game-window-title p { } .game-window-content { width: 100%; padding: 15px 20px; } .game-window-content .game-window-content-eveyone { width: 100%; display: flex; } .game-window-content .game-window-content-eveyone label { width: 90px; text-align: right; margin-right: 40px; } .game-window-content .game-window-content-eveyone select { width: 200px; border: 0px; } .game-window-content .game-window-content-eveyone span.font-add { font-size: 1.2rem; font-weight: 500; } .game-window-btns { margin-top: 60px; padding: 15px 20px; text-align: center; } .game-window-btns .game-window-btn { width: 129px; height: 40px; border: 0; } .game-window-btns .game-window-btn .game-window-btn-box { } .game-window-btns .game-window-btn-box .game-window-btn.btn-blue { background-color: #3A97FF; color: #fff; } .game-window-btns .game-window-btn-box .game-window-btn.btn-gray { background-color: rgba(204, 204, 204, 1); color: #333333; } .game-window-content .game-window-content-eveyone .game-window-ul-box { width: 300px; height: 300px; border: 1px solid #999; padding: 5px 8px; overflow:scroll; } .game-window-content .game-window-content-eveyone .game-window-ul-box .game-window-ul { } .game-window-content .game-window-content-eveyone .game-window-ul-box .game-window-ul .game-window-li { display: -webkit-box; line-height: 1rem; white-space: nowrap; margin-bottom: 2px; } .game-window-content .game-window-content-eveyone .game-window-ul-box .game-window-ul .game-window-li input[type=checkbox] { width: 15px; height: 15px; }