body{background-color:#dcd888;margin:0px;padding:0px;} .bottom-details{padding: 2px 12px;background-color: #fff;border-radius: 12px;line-height: 22px;font-size: 18px;width:80%;margin:0 auto}.advblock-head{height:5px;overflow:hidden}.advblock-head:before{display:inline}.close2{display:none}#loading-img{display:none !important;width:100%;max-height:350px}.box-outer{padding: 2px 0px; max-width: 440px; margin: 0 auto;} .box-outer .grid-container{display: inline-grid;grid-template-columns: auto auto auto;}.box1,.box2{display: grid;grid-template-columns:repeat(2, 184px); grid-gap: 16px; justify-content: space-between}.box1 img,.box2 img{border-radius: 12px; width: 94px} .box1 .game-name,.box2 .game-name{grid-row-start: 1; grid-row-end: 2; grid-column-start: 2; grid-column-end: 4; background-color: white;border-radius: 16px;padding: 18px 16px;box-sizing: border-box;display: flex;justify-content: center;flex-direction: column;align-items: center;font-size: 14px;width: 100%} .box1 .game-big,.box2 .game-big{grid-row-start: 2; grid-row-end: 4; grid-column-start: 2; grid-column-end: 4;} .box2{margin: 0px auto;width:95%}

header{z-index: 11;top: 0;left: auto;width: 100%;max-width:440px;background: #c4bb18;height:60px;}header .box{display: flex;justify-content: space-between;position: relative;top:-10px}header .box .left{width: 108px;height: 78px;color: #eff0f7;font-size: 36px;display: flex;align-items: center;flex: 1;margin-left: 4px;font-size:20px}header .box .middle{flex:1;display: flex;align-items: center;justify-content: center;}header .box .middle img{height: 38px;}header .box .right{flex:1;display: flex;align-items: center;justify-content: space-between;color: #fff}header .box .right img{width: 25px;height: 25px;margin-right: 15px;}

.box2 .game_item{height:220px;position:relative;display:flex;background:white;border-radius:14px;position:relative;justify-content:center}
.box2 .game_item>a{width: 90%; height: 184px;border-radius: 10px;display: block;border-width: 2px;border-style: solid;border-color: transparent}
.box2 .game_item .start{position:absolute;height:35px;width:134px;bottom:4px;}
.box2 .game_item .name{position:absolute;bottom:-16px;width:134px;text-align:center;text-overflow:ellipsis;overflow:hidden}
.box2 .game_item img{border-radius: 8px;width: 100%;height: 100%;}

.box3{padding-left: 0; margin: 8px 10px; width: 90%;display:flex;flex-wrap:wrap;justify-content:start;}
.box3 li{padding: 5px 0; width: 42%;color:#625e5e;background-color:rgba(255,255,255,0.9);height:38px;margin-top:3px;margin-bottom:3px;border-radius:8px;display:flex;align-items:center;padding-left:20px;margin-left:8px}
.box3 li a{font-size:20px;text-decoration:none;color:#625e5e;}
@media screen and (min-width: 1000px){.box3{width: 95%}}

@media screen and (min-width: 400px){
    .box2{grid-template-columns:repeat(2, 184px);}
    .box2 .game_item .start{width:114px}
}
@media screen and (min-width: 1000px){
     .box-outer{max-width: 800px;}header{max-width: 800px;}#install-dialog{width:40%}
     .box1, .box2{grid-template-columns:repeat(2, 344px);width:100%}
     .bottom-details{width:100%}
    .box2 .game_item{height:324px;}
    .box2 .game_item>a{height:284px;width:284px;}
    .box2 .game_item .start{width:244px;text-align:center}
    .box2 .game_item .start img{width:70%;}
    .box2 .game_item .name{width:244px;font-weight:600;}
}

.box-adv{text-align:center}
.box-adv:first-child{background-color: transparent;border-bottom: 2px solid rgb(255, 246, 246)}
.box-adv .advblock-tail{position:relative;bottom: -10px;padding-bottom: 0px;width: 100%;text-align: center;font-size: 9px;color: gray;margin-bottom: 0px;margin-top: 2px;}
.s2 .advblock-tail{display:block}
.close1{background-color: #fff6f6;padding: 5px 15px;font-size: 18px;left:18px; width: 25px; height: 14px;position: absolute;bottom: -24px}
.close1{border-radius: 0 0 4px 4px;text-align: center}
.close1::before,.close1::after{
  position: absolute;
  top: 0;
  content: '';
  width: 20px;
  height: 20px;
  border-radius: 100%;
  box-shadow: 0 0 0 40px #fff6f6;/*使用box-shadow不影响尺寸*/
  transition: .2s;
}
.close1::before{
  left: -20px;
  clip-path: inset(0 -10px 50% 50%);
}
.close1::after{
  right: -20px;
  clip-path: inset(0 50% 50% -10px);
}

@media screen and (orientation:portrait){
	.box-adv{position:relative;width:100%;margin-bottom: 8px;}.s2{margin-top:8px;width:100%;}
}

@media screen and (min-width: 1000px){
    .box-adv{position:relative;width:100%;margin-bottom: 24px;}.s2{margin-top:8px}.box-outer{max-width: 800px}.box1 img, .box2 img{width: 244px}
}