body {background-color: #eeedf2;}
.page-wrapper {width: 1200px;margin: auto;}
.page-wrapper .attention {background-color: #0182bb;}
.page-wrapper .page-content-wrapper {display: flex;justify-content: space-between;width: 100%;margin-top: 10px;}
.page-wrapper .page-content-wrapper > .left-wrapper {width: 220px;border: 1px solid #D8D7DC;background: #fff;margin-bottom: auto;border-radius: 4px;}
.page-wrapper .page-content-wrapper > .left-wrapper > .att-title {margin: 15px 15px 0;font-weight: bold;line-height: 24px;}
.page-wrapper .page-content-wrapper > .left-wrapper > .att-list {margin: 8px 15px;min-height: 160px;}
.page-wrapper .page-content-wrapper > .left-wrapper > .att-list > .att-item {display: flex;align-items: center;justify-content: space-between;line-height: 24px;cursor: pointer;padding: 0 6px;border-radius: 3px;}
.page-wrapper .page-content-wrapper > .left-wrapper > .att-list > .att-item.actived {background: #eee;}
.page-wrapper .page-content-wrapper > .left-wrapper > .att-list > .att-item > span {width: calc(100% - 16px);}
.page-wrapper .page-content-wrapper > .right-wrapper {width: 960px;border: 1px solid #D8D7DC;background: #fff;border-radius: 4px;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-info-wrapper {margin: 1px;padding: 8px 15px;color: grey;background: #eee;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper {margin: 15px;min-height: 380px;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper.error-wrapper {display: flex;align-items: center;justify-content: center;color: #c8c8c8;font-size: 16px}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list {}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-header {display: flex;justify-content: space-between;line-height: 24px;border-bottom: 1px solid #eee;padding-bottom: 6px;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-header > .header-title {font-weight: bold;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-header > .header-search {display: flex;align-items: center;background-color: #F2F5F7;border-radius: 12px;font-size: 14px;line-height: 24px;padding: 2px 10px;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-header > .header-search > input {width: 100px;margin-right: 6px;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-header > .header-search > i.icon-search {cursor: pointer;width: 17px;height: 17px;background: url("../../assets/icon_common_sousuo.png") no-repeat center;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-items {display: flex;justify-content: space-between;margin-top: 10px;flex-wrap: wrap;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-items > .att-list-item {display: flex; width: calc(50% - 8px); align-items: center; justify-content: space-between;border: 1px solid #eee;border-radius: 4px;padding: 4px;margin: 10px 0;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-items > .att-list-item > .avatar {width: 50px;height: 50px;border-radius: 4px;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-items > .att-list-item > .nickname {width: calc(100% - 100px);}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-items > .att-list-item > .action-button {border-radius: 4px;background: #eee;padding: 2px 8px;color: #5092FF;cursor: pointer;}
.page-wrapper .page-content-wrapper > .right-wrapper > .att-content-wrapper > .att-content-list > .att-list-items > .att-list-item > .action-button.disabled {color: grey;cursor: no-drop;}

/* 图标 */
.icon {display: inline-block;width: 12px;height: 12px;line-height: 12px;cursor: pointer;background-repeat: no-repeat;background-position: center;}
.icon.icon-check {background-image: url('../../assets/icon_login_choose_d.png');}
.icon.icon-check.checked {background-image: url('../../assets/icon_login_choose_s.png');}
