﻿* {-webkit-padding-start: 0px}
body { font-family:'TM Sans',Arial, sans-serif; font-size:0.750em; color:#333;  margin: 0; padding: 0; height:250px!important }
body *, html *, *       {box-sizing: border-box !important; }
a {color:#333; text-decoration:none!important}
.chart {display: table;table-layout: fixed; width: 100%!important; max-width: 700px; height: 200px; margin: 0 auto; bottom:0!important; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.1) 2%, rgba(0, 0, 0, 0) 2%); background-size: 100% 50px; background-position: left top;padding:0 5px;}
.chart li { position: relative; display: table-cell; vertical-align: bottom; height: 200px;}
.chart span { margin: 0 0.2em; display: block; animation: draw 1s ease-in-out; min-height:30px; max-height:200px!important; }
.chart span:after { position: absolute; color:#000000; font-weight:bold; left: 0; right: 0; padding: 5px 2px 0 2px; display: block; text-align: center; content: attr(data-percent);word-wrap: break-word;}
@keyframes draw { 0% { height: 0; } }


.titles {display: table;table-layout: fixed; width: 100%; margin: 0 auto; padding:0 5px; margin-top:5px;}
.titles li { position: relative; display: table-cell; text-align: center; }
.titles li .mv{ display:block; margin:5px 4px; padding:2px; text-align:center; background-color:black; color:white;}
@media only screen and (max-width: 480px) {
ul {margin:0; padding:0}
ul li {margin:0; padding:0}
ul li:nth-child(n+5) {display:none!important}
}