@media screen and (min-width:751px){.pie-chart-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}}.box{display:-webkit-box;display:-ms-flexbox;display:flex;height:300px;min-width:200px;position:relative;width:33.3333333333%;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;background:#fff;-webkit-box-shadow:0 15px 30px rgba(0,0,0,.2);box-shadow:0 15px 30px rgba(0,0,0,.2);-ms-flex-direction:column;flex-direction:column}@media screen and (max-width:750px){.box{width:100%}}@media screen and (min-width:751px){.box+.box{margin-left:20px}}@media screen and (max-width:750px){.box+.box{margin-top:20px}}.box .percent,.box .percent svg{height:150px;position:relative;width:150px}.box .percent svg{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.box .percent svg circle{position:relative;fill:none;stroke-width:10;stroke:#f3f3f3;stroke-dasharray:440;stroke-dashoffset:0;stroke-linecap:round}.box .percent .number{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;left:0;position:absolute;top:15px;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;color:#111;justify-content:center}.box .percent .number,.box .percent .number .title{font-family:Meiryo UI,Hiragino Sans,Yu Gothic UI,MS PGothic,Hiragino Kaku Gothic ProN,sans-serif}.box .percent .number .title{font-size:50px}.box .percent .number .title span{font-size:22px}.box .percent .number .title span,.box .text{font-family:Meiryo UI,Hiragino Sans,Yu Gothic UI,MS PGothic,Hiragino Kaku Gothic ProN,sans-serif}.box .text{font-size:12px;font-weight:700;padding:10px 0 0;text-align:center}.box .percent .line{-webkit-animation:circleAnim 10s forwards;animation:circleAnim 10s forwards}.box.blue .percent .line{stroke-dashoffset:44;stroke:#e95383}.box.red .percent .line{stroke-dashoffset:44;stroke:#f39800}.box.green .percent .line{stroke-dashoffset:66;stroke:#c4d700}.box.yellow .percent .line{stroke-dashoffset:66;stroke:#00afcc}@-webkit-keyframes circleAnim{0%{stroke-dasharray:0 440}99.9%,to{stroke-dasharray:440 440}}@keyframes circleAnim{0%{stroke-dasharray:0 440}99.9%,to{stroke-dasharray:440 440}}