body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color: #f5f5f5; } .container { max-width: 1200px; margin: 20px auto; padding: 20px; background: white; border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } .body-analysis { display: flex; align-items: flex-start; } .body-figure { display: flex; flex-direction: column; align-items: center; margin-right: 20px; } .figure { width: 50px; height: 200px; background: linear-gradient(to bottom, #87CEEB 37%, #A0D6B4 22%, #FFE4B5 17%, #FFB6C1 4%, #D3D3D3 18%); border-radius: 10px; position: relative; } .figure-percentage { display: flex; flex-direction: column; align-items: center; margin-bottom: 10px; } .figure-percentage p { margin: 0; } .analysis-table { width: 100%; border-collapse: collapse; } .analysis-table th, .analysis-table td { border: 1px solid #ddd; text-align: center; padding: 10px; } .analysis-table th { background-color: #4682B4; color: white; } .analysis-table tbody tr:nth-child(odd) { background-color: #f9f9f9; }