.color-title{padding:10px 0 30px 0}.color-list{width:100%;margin-bottom:80px}.color-list .color-item{margin-right:30px}.color-list .color-item:last-child{margin:0}.color-list .color-item .color-box{display:inline-block;width:120px;height:120px}.color-list .color-item .color-box .box-info{height:100%;padding:10px;display:flex;flex-direction:column;justify-content:space-between}.color-list .color-item .color-box .box-info.Attention,.color-list .color-item .color-box .box-info.Error,.color-list .color-item .color-box .box-info.Primary{color:#fff}.color-list .color-item .color-box .box-info.Background1{border:1px solid #dcdcdc}.color-list.typo .type-preview{color:#fff}.color-list.typo .box-info.On.Primary{color:#333;border:1px solid #dcdcdc}.palette-wrap{display:flex;flex-wrap:wrap}.palette-wrap .color-palette{text-align:center;padding:.8em 1.2em;min-width:110px;margin:10px;color:#fff;font-weight:600}.palette-wrap .color-palette.light{color:#909090}.type-preview-contents{width:100%;display:flex;flex-wrap:wrap}.type-preview-contents .type-icon-wrap{display:flex;flex-direction:column;border:1px solid #d6d6d6;margin:5px;border-radius:5px}.type-preview-contents .type-icon-wrap .icon{text-align:center;padding:10px}.type-preview-contents .type-icon-wrap .name{text-align:center;width:100px;padding:5px}.type-icon{border:1px solid #ebebeb;border-radius:2px}.btn-group{margin-bottom:10px}div[class*=-type]{margin-bottom:15px}div[class*=-type] .t-title{font-weight:600;font-size:1.2em;margin-bottom:3px}.insert-value{padding:10px;border:1px solid #d6d6d6;margin-bottom:10px}