.header-area{-webkit-box-shadow:0 2px 7px 0 rgba(63,62,62,.2);box-shadow:0 2px 7px 0 rgba(63,62,62,.2);width:100%;height:20vh}.header-area,.header-area .title{display:-webkit-box;display:-ms-flexbox;display:flex}.header-area .title{height:100%;width:35px;padding-right:15px;margin-left:15px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.header-area #pie-three{height:20vh;width:26.5vw}.header-area #pie-one{height:20vh;width:25vw}.header-area #pie-two{width:30vw;height:20vh}.pie-box{height:20vh;width:26.5vw;border-left:1px solid #efefef;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.body-area,.pie-box{display:-webkit-box;display:-ms-flexbox;display:flex}.body-area{margin:20px 0 0 0;width:100%}.body-area .year-month-tittle{width:100%;height:56px;border-bottom:1px solid #e8e8e8;color:rgba(0,0,0,.85);font-weight:500;font-size:16px;padding-left:12px}.body-area .month,.body-area .year-month-tittle{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.body-area .month{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:34vw;height:54vh;-webkit-box-shadow:0 2px 7px 0 rgba(63,62,62,.2);box-shadow:0 2px 7px 0 rgba(63,62,62,.2)}.body-area .month #month-bar{height:46vh;width:30vw}.body-area .year{width:52.8vw;margin-left:1vw;-webkit-box-shadow:0 2px 7px 0 rgba(63,62,62,.2);box-shadow:0 2px 7px 0 rgba(63,62,62,.2)}.body-area .year .year-head{display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:10px;height:18.5vh;width:52.8vw;color:#101010}.body-area .year .year-head .event{height:18.5vh;width:17.6vw;border-right:1px solid #efefef}.body-area .year .year-head .event .event-title{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-weight:400;font-size:16px;color:#101010}.body-area .year .year-head .event .event-title div:first-of-type{width:5px;height:15px;background:#4880ec;border-radius:4px}.body-area .year .year-head .event .event-title span{margin-left:5px}.body-area .year .year-head .event #pie-five,.body-area .year .year-head .event #pie-four,.body-area .year .year-head .event #pie-six{height:17vh;width:17vw}.body-area .year #event-status{margin-top:20px;height:26vh;width:52.5vw}