.u-grid-tool{padding:0px 0px 10px;}
.u-grid-tool dl{background:rgba(255,255,255,1);border-radius:var(--radius-m);padding:10px 15px;border:1px solid #f7f7f9;position:relative;overflow:hidden}
.u-grid-tool dl:hover{box-shadow:0 0px 15px rgba(219,229,248,0.8);border-color:rgba(219,229,248,1)}
.u-grid-tool dl.u-tool-post:hover{box-shadow:0 0px 15px rgba(235,219,248,0.8);border-color:rgba(235,219,248,1)}
.u-grid-tool dl.u-tool-cent:hover{box-shadow:0 0px 15px rgba(172,220,238,0.8);border-color:rgba(172,220,238,1)}
.u-grid-tool dl.u-tool-chat:hover{box-shadow:0 0px 15px rgba(195,227,208,0.8);border-color:rgba(195,227,208,1)}
.u-grid-tool dt{transition:all 400ms ease 0s;z-index:0;position:absolute;width:200px;height:200px;background:rgba(219,229,248,1);border-radius:100%;color:#B8CAED;bottom:-80px;right:-80px;text-align:left;line-height:150px;}
.u-grid-tool dd{z-index:1;position:relative}
.u-grid-tool dd:before{transition:all 400ms ease 0s;content:"";display:block;width:0px;height:0px;background:rgba(219,229,248,0.8);left:-15px;top:-15px;position:absolute}
.u-grid-tool dl:hover dd:before{width:60px;height:60px;left:-30px;top:-30px;transition:all 400ms ease 0s;;border-radius:30px}
.u-grid-tool dl:hover dt{ right:-60px;bottom:-60px}
.u-grid-tool dl.u-tool-post:hover dd:before{width:60px;height:60px;left:-30px;top:-30px;transition:all 400ms ease 0s;;border-radius:30px;background:rgba(235,219,248,0.8)}
.u-grid-tool dl.u-tool-cent:hover dd:before{width:60px;height:60px;left:-30px;top:-30px;transition:all 400ms ease 0s;;border-radius:30px;background:rgba(172,220,238,0.8)}
.u-grid-tool dl.u-tool-chat:hover dd:before{width:60px;height:60px;left:-30px;top:-30px;transition:all 400ms ease 0s;;border-radius:30px;background:rgba(0,114,32,0.23)}
.u-grid-tool dt i{font-size:110px;margin-left:40px;}
.u-grid-tool dl.u-tool-post dt{background:rgba(235,219,248,1);color:#D4B9EA;}
.u-grid-tool dl.u-tool-cent dt{background:rgba(240,251,255,1);color:rgba(172,220,238,1);}
.u-grid-tool dl.u-tool-chat dt{background:#D5EDE0;color:rgba(0,114,32,0.23);}
.u-grid-tool p{color:#999;margin:0px auto 10px;font-size:14px;position:relative;}
.u-grid-tool p.t{color:#2345B1;font-size:20px;font-weight:bold;}
.u-grid-tool dl.u-tool-post p.t{color:#611083}
.u-grid-tool dl.u-tool-cent p.t{color:rgba(46,148,185,1)}
.u-grid-tool dl.u-tool-chat p.t{color:#007220}

.u-grid-tool p span{display:block;width:100px;height:32px;line-height:32px;background:rgba(221,221,236,1);border-radius:var(--radius-m);text-align:center;font-size:14px;font-weight:400;cursor:pointer;position:relative;z-index:2;color:rgba(35,69,177,1);}
.u-grid-tool p span:hover{background:#2345B1;color:#fff}
.u-grid-tool p span a{ display:block; position:absolute; left:0; right:0; top:0; bottom:0; z-index:3}
.u-grid-tool dl.u-tool-post p span{background:#EBDBF8;color:#8114AF;}
.u-grid-tool dl.u-tool-post p span:hover{background:#611083;color:#fff}
.u-grid-tool dl.u-tool-cent p span{background:rgba(240,251,255,1);color:rgba(46,148,185,1);}
.u-grid-tool dl.u-tool-cent p span:hover{background:rgba(46,148,185,1);color:#fff}
.u-grid-tool dl.u-tool-chat p span{background:#C3E3D0;color:#007220;}
.u-grid-tool dl.u-tool-chat p span:hover{background:#007220;color:#fff}
@media (min-width:375px){.u-grid-tool{ padding:0px 0px 15px}}
@media (min-width:640px){.u-grid-tool{ padding:0px 0px 20px}}
@media (min-width:960px){.u-grid-tool{ padding:0px 0px 30px}}
@media (min-width:1200px){.u-grid-tool{ padding:0px 0px 40px}}