/*ZIP ==================== 2016 / 8 / 16 ==================== */ @charset "utf-8"; body,html{background-image:none;} #mmBody{padding:0;overflow:hidden;} #mmMain{width:100%!important;} #titleBox{max-width:970px; padding-top:43px;margin:0 auto; position:relative;z-index:1; } .btnFB{background-image:url(../img/fbShare.png); background-size:37px 37px; display:block;width: 37px;height: 37px; position:absolute;right: 10px;top: 53px;z-index:10; } .lightColorFull,#menuBox a b{background-image: url(../img/event/anniv/2016/main_menu.png); background-size:64px 10px; display:block;width: 64px;height: 10px; margin-top:-10px; } .boxShadow,#menuBox a,.annivBox{box-shadow:0 2px 2px rgba(0,0,0,.5);} #myBonus{border-radius:6px; background-color:#9b1056; padding-bottom:5px; position:absolute;right: 10px; } #myBonus .lightColorFull{float:right;} #myBonus h5{font-size:14px;color:#fff;text-align:right;font-weight:normal; line-height:1; padding:5px 8px 1px; } #myBonus a{border-radius:5px; background-color:#ff9000; font-size:14px;color:#fff;text-align:center; display:inline-block;line-height:18px;width:calc( 100% - 16px ); margin-left:8px; } #myBonus a:hover{text-decoration:none;background-color:#ff4e00;} #myBonus div{font-size:0;text-align:right; padding:0 8px; } #myBonus span,#myBonus p{display:inline;} #myBonus span{font-size:19px;color:#fff000;font-weight:bold;} #myBonus p{font-size:14px;color:#fff;} #menuBox{font-size:0;text-align:center; min-width:320px;margin-bottom:5px; } #menuBox a{border-radius:6px; background-color: #423b37; display:inline-block; position:relative; } #menuBox a:hover{text-decoration: none;background-color: #000;} #menuBox i{background:url(../img/event/anniv/2016/cake_s.png) 0 0 no-repeat; position:absolute; } #menuBox span{color:#fff;font-weight:bold;display:block;} #mmBody .wrapper{padding:0 3%;max-width:980px;margin:0 auto;} #FBshare{font-size:14px;color:#3264cc;margin-bottom:10px;} .annivBox{background-color:#f3e5d7; padding:10px 12px 12px;margin-bottom:15px; position:relative; } .annivBox:before{content:""; background-image:url(../img/event/anniv/2016/sprite.png); background-size:315px 111px; display:block;width: 40px;height: 40px; position:absolute;z-index:1;top: -4px;left: -6px; } .annivBox > h4,.annivBox > h5{border-bottom:solid 1px #ccbfb7;color:#423b37;} .annivBox > h4{font-size:23px;text-indent:22px; line-height:1; padding-bottom:3px; } .annivBox > h5{font-size:17px;margin-top:8px;} .annivBox > h5 img{width: 14px;margin-right:4px;} #mmShop > h3{font-size:14px;color:#423b37;margin:5px 0;} #mmShop .shopAbove span.typeB{background-color: #ecdbcb;color:#000;} #mmShop p{text-align:left;} #mmShop p i{font-size:27px;font-style:normal;} #mmShop a.special{position:relative;} #mmShop a.special:after,#mmShop a.special:before{display:block; position:absolute; } #mmShop a.special:after{content:"威秀電影票周周換"; background-color:#ff4e00;box-sizing:border-box; font-size:14px;color:#fff; line-height:25px;width: 124px; padding:0 5px; left:-5px;top:8px; } #mmShop a.special:before{content:""; border-style:solid; border-width:25px 5px 0 0; border-color:#ff4e00 transparent transparent transparent; top: 8px;left:119px; } #mmShop a.un.special:after,#mmShop a.un.special:before{opacity:0.5;} #newxview{overflow:hidden;} #newxview li{color:#000;font-size:14px; line-height:17px; padding:7px 0 5px; float:left; } #newxview li:nth-child(odd){text-align:center;width: 15px;} #newxview li:nth-child(even){border-bottom:dotted 1px #ccbfb7;} #newxview > a{border-radius:6px; background-color:#ff4e00; text-align:center;font-size:16px;color:#fff; display:block;line-height:30px; padding:0 10px; clear:both; } #bau{font-size:14px;color:#000; min-height:90px;line-height:1.8; margin-top:8px; position:relative; } #bau:after{content:"我叫爆爆~"; font-size:12px;color:#000; display:block; position: absolute;top:-15px;right: 2px; } #bau img{width: 78px;margin:-28px -10px 0 0;float:right;} #bau span{color:#ff4e00;} .annivHow{border-bottom:solid 1px #423b37; min-height:122px; margin-top:17px;padding-bottom:15px; clear:both; } .annivHow.two{border:none;} .annivHow b,.annivHow i{background-image:url(../img/event/anniv/2016/sprite.png); background-size:315px 111px; } .annivHow b{background-position:-45px 0; width: 70px;height: 111px; margin-right:8px;margin-bottom:10px; float:left; } .annivHow.two b{background-position:-115px 0;} .annivHow i{background-position:-185px 0; width: 65px;height: 65px; float:right; } .annivHow.two i{background-position: -250px 0;} .annivHow h4,.annivHow h5,.annivHow span{color:#423b37;} .annivHow h4{font-size:32px;margin-bottom:3px;line-height:1;} .annivHow h5{font-size:18px;line-height:1.2;} .annivHow span{font-size:14px;line-height:23px;} .annivHow img{width: 34px;vertical-align:-7px;} #bonusRule{border-radius:8px; background-color: #fff; padding:8px 15px; clear:both;overflow:hidden; } #bonusRule li{border-bottom:dotted 1px #ccbfb7; color:#423b37;font-size:14px; } #bonusRule li:last-child{border:none;} #bonusRule span{font-weight:bold;} #bonusRule li:nth-child(1) span{color:#ff277b;} #bonusRule li:nth-child(2) span{color:#007f29;} #bonusRule li:nth-child(3) span{color:#0007d9;} #bonusRule a{border-radius: 6px; background-color: #ff4e00; font-size:16px;color:#fff;text-align:center; display:inline-block;line-height: 30px; } #newxview > a:hover, #bonusRule a:hover{text-decoration: none;background-color: #ff1800;} #bonusCheck{border-radius:8px; border:solid 5px #fff; margin-bottom:5px; clear:both;overflow:hidden; } #bonusCheck h6{background-color: #86807d; font-size:18px;color:#fff; padding:5px 12px; } #bonusCheck span{font-weight:normal;font-size:14px;} #bonusCheck ul{background-color:#f0e8e0;} #bonusCheck li{font-size:14px;color:#423b37; display:table;min-height:50px;width: 100%; } #bonusCheck li:nth-child(-n+3){border-bottom:solid 1px #fff;} #bonusCheck li:nth-child(1), #bonusCheck div:nth-child(1){background-color: #e0d4d2;} #bonusCheck div{vertical-align: middle; display:table-cell;line-height:1.2; padding:6px; } #bonusCheck div:nth-child(-n+2){border-right:solid 1px #fff;} #bonusCheck div:nth-child(1), #bonusCheck div:nth-child(3){text-align:center;width:45px;} #bonusCheck div:nth-child(2){width:calc( 100% - 90px );} #bonusCheck b{background:url(../img/event/anniv/2016/sprite.png) -185px -65px no-repeat; background-size:315px 111px; display:inline-block;width: 30px;height: 30px; } #bonusCheck + p{font-size:14px;color:#423b37;margin-bottom:15px;} #searchTeach > div{padding:12px 0 15px;} #searchTeach h4{font-size:21px;color:#423b37;line-height:1;} #searchTeach span{font-size:34px;} #searchTeach b{background:url(../img/event/anniv/2016/sprite.png) -14px 0 no-repeat; background-size:105px 37px; vertical-align:-8px; display:inline-block;width: 23px;height: 37px; margin-right:5px; } #searchTeach > div:last-child b{background-position:-37px 0;} #searchTeach p{font-size:14px;color:#423b37; line-height:1.8; margin-bottom:13px; } #searchTeach img{width: 265px;} #caution{overflow:hidden;margin-top:5px;} #caution li{font-size:14px;color:#000; line-height:17px; padding:7px 0 5px; float:left; } #caution li:nth-child(odd){width:15px;} #caution li:nth-child(even){width:calc( 100% - 15px );} #sponsor{background:url(../img/event/anniv/2016/footer.png) 0 0 repeat-x; background-size:320px 200px; text-align:center;font-size:0; min-width:320px; padding-top:76px;margin-top:20px; overflow:hidden; } #sponsor > div{display:inline-block;height:45px;} #sponsor span{background-color:#cea487; font-size:12px;color:#fff; width: 57px; padding:2px 3px;margin-right:8px; } #sponsor > div:first-child{margin-right:10px;} #sponsor > div > div{background:url(../img/sponsor.png) 0 0 no-repeat; background-size: 400px 400px; text-align:left; display:block; margin-right:8px; float:left; } #sponsor .mm{width: 100px;height: 25px;} #sponsor .delt{background-position:0 -25px; width: 90px;height: 20px; margin-top:5px; } #sponsor .cp{background-position:0 -45px; width: 85px;height: 30px; margin-top:-2px;margin-right:0; } @media screen and ( max-width:479px ){.annivHow.two .pc{display:none;} } @media screen and ( min-width:480px ){.annivHow.two .mobi{display:none;} .annivHow.two .pc{display:inline-block;} } @media screen and ( max-width:480px ){#pcBg{display:none;} #titleBox .mobi{width: 100%;} #titleBox .pc{display:none;} #myBonus{bottom:20px;} #menuBox a:first-child,#menuBox a:nth-child(2){margin-right:8px;} #menuBox b{margin-left:25px;} #menuBox i{background-size:22px 33px; width: 22px;height: 33px; left:6px;top:-8px; } #menuBox span{font-size:14px;padding:5px 6px 5px 30px;} #bonusRule{margin-top:5px;} #bonusRule li{padding:5px 0 2px;} #bonusRule div{margin-top:10px;float:right;} #bonusRule a{width:119px;} #bonusRule a:first-child{margin-right:8px;} #sponsor{padding-bottom:15px;} #sponsor span{display:block;margin-bottom:5px;} #sponsor > div:first-child{width:100px;} #sponsor > div:nth-child(2){width:;} } @media screen and ( min-width:481px ){#pcBg,#pcBg img{position:absolute;} #pcBg{background:url(../img/event/anniv/2016/bg_pc_cake.png) 0 0 repeat-x; background-size:480px 550px; display:block;height: 550px; top: 43px;left: 0;right: 0; overflow:hidden; } #pcBg img{width:1150px;height: 470px; margin-left:-575px; top: 0;left:50%; } #titleBox .mobi{display:none;} #titleBox .pc{display:block;width: 480px; margin:0 auto; } #myBonus{bottom:-15px;} #menuBox{margin-top:45px;} #menuBox a:first-child,#menuBox a:nth-child(2){margin-right:12px;} #menuBox b{margin-left:32px;} #menuBox i{background-size:30px 45px; width: 30px;height: 45px; left:8px;top:-11px; } #menuBox span{font-size: 19px;padding:6px 9px 6px 41px;} #newxview > a{float:right;} #bonusRule{margin-top:18px;} #bonusRule ul{width:calc( 100% - 110px - 15px );float:left;} #bonusRule div{width:110px;margin-left:15px;float:right;} #bonusRule a{width: 100%;} #bonusRule a:first-child{margin-bottom:10px;} #sponsor span{margin-top:2px;float:left;} } @media screen and (max-width:767px){#FBchare .pc{display:none;} .annivBox #mmShop a{width:calc( 50% - 3px );} .annivBox #mmShop a:nth-child(odd){margin-right:0;} .annivBox #mmShop a:nth-child(even){margin-right:6px;} #newxview li:nth-child(even){width:calc( 100% - 15px );} #newxview li:nth-last-child(2){border:none} #searchTeach > div:last-child{border-top:dotted 1px #423b37;} } @media screen and (min-width:768px){#FBshare{margin-top:12px;} #FBchare .mobi{display:none;} .annivBox #mmShop a{width:calc( 25% - 6px );} .annivBox #mmShop a:nth-child(-n+4){margin-right:8px;} .annivBox #mmShop a:nth-child(5){margin-right:0;} #newxview li:nth-child(even){width:calc( ( 100% - 30px ) / 2 );} #newxview li:nth-child(6),#newxview li:nth-child(8){border:none;} .annivHow h4,.annivHow h5{display:inline-block;} #bonusCheck li:nth-last-child(-n+3) div:nth-child(2){font-size:18px;} #searchTeach{overflow:hidden;} #searchTeach div{float:left;width:calc( 50% - 15px );} #searchTeach > div:last-child{margin-left:30px;} }