#mask {
    background:rgba(0,0,0,0.3);
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:100000;
    display:none;
}

#ContentWrap {
    width:1470px;
    color: black;
    font-size:12px;
    background-color: rgb(219, 221, 224);
    margin-left: 240px;
    margin-top: 60px;
    padding: 15px 20px;
    min-height:calc(100vh - 90px);
}

.mr {
    margin-right:10px;
}

.mb {
    margin-bottom:10px;
}

#warpWrap, #knitWrap {
    height:400px;
}

#knitWrap .knitGrid {
    width:480px;
    float:left;
}

.knitGrid {
    margin-right:15px;
}

.knitGrid:last-child {
    margin-right:0;
}

.knitGrid > div {
    float:left;
}

.halfBox {
    width:235px;
    height:195px;
    background:#fff;
    border:1px solid #d1d1d1;
    box-sizing: border-box;
}

.halfBoxCol2 {
    width:235px;
    height:400px;
    background:#fff;
    border:1px solid #d1d1d1;
    box-sizing: border-box;
}

.knitTitle {
    width:227px;
    padding:6px 0 0 6px;
    font-size:14px;
    height:30px;
    /* font-weight: bold; */
}

.knitContent {
    width:100%;
    padding-top:45px;
    text-align:center;
    font-size:21px;
    font-weight: bold;
}


/* chart */
#circle1, #circle2 {
    position:relative;
}

.e_text {
    position:absolute;
    top:95px;
    left:90px;
    font-size:12px;
    color:#aaa;

}

.e_botText {
    color:#aaa;
}

.e_botText > p {
    text-align: center;
    margin-top:20px;
    font-size:14px;
}



.e_botText > p > span {
    color:rgb(59,84,166);
    font-weight: bold;
    font-size:18px;
}


#knitMask {
    background:rgba(0,0,0,0.7);
    z-index:9999;
}