.gift-article-wrap { width: 100%; height: 166px; background-color: #f9f9f9; padding-top: 27px; } .gift-article-box { width: 100%; height: 127px; } .gift-article-box .icon { width: 122px; height: 122px; float: left; } .gift-article-box .icon img { width: 100%; } .gift-article-box .msg { width:70%; float: right; } .gift-article-box .msg .m1 { border-bottom: 1px solid #e6e6e6; height: 35px; margin-bottom: 10px; } .gift-article-box .msg .m1 .gift-title { font-size: 22px; float: left; } .gift-article-box .msg .m2 .surplus-box { padding:0 20px; height: 50px; } .gift-article-box .msg .m2 .surplus-box .s1 { float: left; line-height: 30px; width: 100px; } .gift-article-box .msg .m2 .surplus-box .s2 { width: 300px; height: 10px; margin: 10px 10px 10px 0; overflow: hidden; position: relative; float: left; } .gift-article-box .msg .m2 .surplus-box .s2 .surplus-0 { width: 300px; max-width: 300px; height: 10px; border-radius: 10px; background-color: #d6d6d6; position: absolute; top: 0; left: 0; z-index: 1; } .gift-article-box .msg .m2 .surplus-box .s2 .surplus-1 { width: 300px; max-width: 300px; height: 10px; border-radius: 10px; background-color: #ff8400; position: absolute; top: 0; left: 0; z-index: 2; } .gift-article-box .msg .m2 .surplus-box .s3{ line-height:28px; } .gift-article-box .msg .m2 .getGift { padding: 5px 10px; border: 1px solid #e6e6e6; /* margin-top: 20px; */ border-radius: 4px; float:right;margin-right:20%; } .gift-article-box .msg .m2 .getGift:hover { background-color: #ff8400; border-radius: 4px; color: #fff; } m60 { margin-bottom: 60px; } .gift_title { height: 30px; line-height: 30px; } .gift_title h2 { line-height: 1; text-indent: 25px; color: #333; font-size: 24px; border-left: 4px solid #ff8400; } .gift-article-content { border: 1px solid #e6e6e6; padding: 20px; margin: 18px 0 0; min-height:200px; overflow: hidden; text-overflow: ellipsis; } .gift-article-content div{ line-height:42px;font-size:18px; } .gift-article-content div span{font-weight:bold;} .gift-article-bottom { margin-top: 10px; } .gift-recommend-box{ float: left; } .gift_title .more { float: right; margin-right: 19px; font-size: 12px; color: #939393; } .gift-recommend { border: 1px solid #e6e6e6; width: 470px; height: 260px; margin-top: 10px; padding-bottom: 10px; } .game-new-box { width: 470px; float: right; margin-left: 10px; } .game-new { width: 100%; height: 270px; border: 1px solid #e6e6e6; margin-top: 10px; } .gift-recommend ul li { width: 190px; height: 80px; float: left; margin: 10px 20px 0; padding-right: 5px; } .gift-recommend ul li .icon { width: 70px; height: 70px; float: left; } .gift-recommend ul li .icon img { width: 100%; } .gift-recommend ul li .gamemsg { float: left; width: 100px; margin-left: 10px; font-size: 12px; } .gift-recommend ul li .gamemsg #m2-2, .gift-recommend ul li:hover .gamemsg #m2-1 { display: none; } .gift-recommend ul li .gamemsg .m1 { height: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 20px; font-size: 13px; margin-top: 3px; } .gift-recommend ul li .gamemsg .m2 { font-size: 12px; } .gift-recommend ul li .gamemsg .m3 { position: relative; border: 1px solid #cecece; width: 85px; height: 23px; text-align: center; border-radius: 5px; color: #333; font-size: 12px; margin-right: 9px; line-height: 16px; line-height: 21px\9; margin-top: 3px; } .gift-recommend ul li .gamemsg #m2-2 span, .gift-recommend ul li:hover .gamemsg .m1 { color: #ff8400; } .gift-recommend ul li:hover .gamemsg #m2-2 { display: block; } /* .gift-recommend ul li .gamemsg .m3 .gift-icon { width: 13px; height: 15px; background: url(../images/icon.png) -47px 0 no-repeat; position: absolute; top: 3px; left: 14px; } */ .gift-recommend ul li .gamemsg .m3 em { position: absolute; left: 32px; top: 4px; } .gift-recommend ul li:hover .gamemsg .m3 { background-color: #ff8400; } .gift-recommend ul li:hover .gamemsg .m3 em { color: #fff; } .pop{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 1000;} .pop.active{display:block;} .pop .m-mask{ width: 100%; height: 100%; background: #000; opacity: .5;} .pop .m-box{ position: absolute; width: 480px; top: 25%; left: 0;right:0;border-radius:5px; background: #fff; margin:auto;} .pop .popclose{display: block; width: 40px; height: 40px; line-height:40px;font-size:24px;color:#999; position: absolute; top: 0; right: 0;} .pop .popclose:hover{ color:#333; } .pop .popnotice{ color:#676767; font-size:16px; } .pop .popnotice .title{line-height:40px;background:#eee;text-indent:10px;border-top-left-radius:5px;border-top-right-radius:5px;} .pop .popnotice .content{background-color: #fff; padding: 24px 14px 0; margin-right: 10px; margin-left: 10px; font-size: 14px;} .pop .popnotice .content .subcontent{text-align:center;min-height:100px;font-size:16px;} .pop .popnotice .popbot{margin: 0 10px 10px; background-color: #fff; padding-bottom: 15px; text-align: center;} .pop .popnotice .popbot a{ background: #ffab16; border-radius: 4px; color: #fff; display: inline-block; text-align: center; overflow: hidden; vertical-align: middle; width: 140px; height: 36px; line-height: 36px; font-size: 16px;}