main { display:flex; justify-content:center; padding:100px 0; }
main > .container { width:100%; max-width:1280px; }

main > .container > h1 { margin-top:60px; display:flex; justify-content:center; align-items:center; }
main > .container > h1 span { position:relative; font-size:40px; font-weight:500; }
main > .container > h1 span::after { content:""; position:absolute; right:10px; top:0; transform:translateX(100%) rotate( 20deg ); width:25px; height:25px; border:2px solid #FE8130; border-radius:5px; z-index:-1; }



#sub0308 { height:100%; display:flex; justify-content:center; align-items:center; flex-direction:column; gap:20px; }


#sub0308 .score { text-align: center; font-size: 36px; }
#sub0308 .playground > ul { width:250px; border: 1px solid #333; margin: 0 auto; }
#sub0308 .playground > ul > li { width: 100%; height:25px; }

#sub0308 .playground > ul > li > ul { display: flex; }
#sub0308 .playground > ul > li > ul > li { width: 25px; height: 25px; }
#sub0308 .playground > ul > li > ul > li:not(:last-child) { border-right: 1px solid #ccc; }
#sub0308 .playground > ul > li:not(:last-child) > ul > li { border-bottom: 1px solid #ccc; }

#sub0308 .tree { background:#67c23a; }
#sub0308 .square { background:#e6a23c; }
#sub0308 .bar { background:#409eff; }
#sub0308 .zee { background:#f56c6c; }
#sub0308 .elleft { background:#fff000; }
#sub0308 .elRight { background:#ff0000; }

#sub0308 .gameover-text { position:absolute; width:100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); background:rgba(0, 0, 0, 0.5); color: #fff; display:flex; align-items: center; justify-content: center; flex-direction:column; font-size: 36px; }
#sub0308 .gameover-text > button { margin-top:10px; padding:5px 10px; background:#ff0000; color:#fff; border-radius:5px; font-size:16px; display:flex; justify-content:center; align-items:center; }