/*******************

Labels

*******************/

.label {

    padding: 3px 10px;

    color: #ffffff;

    border-radius: 3px;

    font-size: 14px;

}



.label-rounded {

    border-radius: 60px;

}



.label-custom {

    background-color: #00897b;

}



.label-success {

    background-color: #26c6da;

}



.label-info {

    background-color: #F3DACB;

}



.label-warning {

    background-color: #EBAC87;

}



.label-danger {

    background-color: #DF6217;

}



.label-megna {

    background-color: #00897b;

}



.label-primary {

    background-color: #DF6217;

}



.label-purple {

    background-color: #7460ee;

}



.label-red {

    background-color: #fb3a3a;

}



.label-inverse {

    background-color: #2f3d4a;

}



.label-default {

    background-color: #f2f4f8;

}



.label-white {

    background-color: #ffffff;

}



.label-light-success {

    background-color: #e8fdeb;

    color: #26c6da;

}



.label-light-info {

    background-color: #cfecfe;

    color: #1e88e5;

}



.label-light-warning {

    background-color: #fff8ec;

    color: #ffb22b;

}



.label-light-danger {

    background-color: #f9e7eb;

    color: #fc4b6c;

}



.label-light-megna {

    background-color: #e0f2f4;

    color: #00897b;

}



.label-light-primary {

    background-color: #f1effd;

    color: #7460ee;

}



.label-light-inverse {

    background-color: #f6f6f6;

    color: #2f3d4a;

}



.label {

    display: inline-block;

}



.label .iconfont {

    font-size: 14px;

}



.small,

small {

    font-size: 80%;

    font-weight: 400;

}



#croppic img {

    max-width: none;

}



body {

    background-color: #FCFCFA;

}



.header_box {

    background: #fff;

    padding-bottom: 30px;

}



.user_box {

    width: 100%;

    overflow: hidden;

    padding: 200px 0 100px;

    position: relative;

    background: #FFF6F0;

}



.login_main {

    position: relative;

}



.login_slide_box {

    width: 820px;

    height: 715.42px;

    border-radius: 20px 0px 0px 20px;

    overflow: hidden;

    position: absolute;

    left: 0;

    top: 0;

    z-index: 1;

}



.login_slide .swiper-slide {

    position: relative;

}



.login_slide .swiper-slide .slide-text {

    position: absolute;

    left: 50px;

    top: 50px;

    z-index: 2;

    font-size: 60px;

    font-family: Rubik;

    font-weight: bold;

    color: #FFFFFF;

}



.login_slide .swiper-slide img {

    height: 715.42px;

}



.login_form {

    width: 593.54px;

    height: 715.42px;

    border-radius: 15.45px;

    opacity: 1;

    background: #FFFFFF;

    box-shadow: 0px 3.09px 38.61px 0px rgba(0, 0, 0, 0.05);

    box-sizing: border-box;

    padding: 60px 45px;

    position: relative;

    z-index: 2;

    float: right;

    text-transform: capitalize;

}



.login_hd {

    border-bottom: 1px solid #D8D8D8;

    height: 55px;

}



.login_hd li {

    display: inline-block;

    position: relative;

    font-size: 27px;

    height: 56px;

    cursor: pointer;

}



.login_hd li span {

    font-size: 18px;

}



.login_hd li.on {

    color: #DF6217;

}



.login_hd li.on::after {

    content: '';

    width: 50%;

    height: 1px;

    position: absolute;

    left: 0;

    bottom: 0;

    background: #DF6217;

}



.login_hd li.on a {

    color: #DF6217;

}



.login_bd .box {

    display: none;

}



.login_bd .layui-input {

    height: 65px;

    line-height: 65px;

    border-radius: 10px;

    background: #F7F7F7;

    border: none;

    padding: 0 25px;

}



.login_bd .layui-input::placeholder {

    color: #9E9E9E;

    font-size: 14px;

    text-transform: capitalize;

}



.login_bd .layui-btn {

    height: 65px;

    line-height: 65px;

    background: #DF6217;

    border-radius: 10px;

}



.login_bd .getcode-btn {

    position: absolute;

    right: 10px;

    top: 10px;

    border: 1px solid #ccc;

    padding: 10px 15px;

    display: inline-block;

    border-radius: 5px;

    cursor: pointer;

    font-size: 12px;

    text-transform: capitalize;

}



.login_footer a {

    display: inline-block;

    border-bottom: 1px solid #3B3B3B;

    font-size: 16px;

    padding-bottom: 10px;

}



.login_bd .layui-select2 {

    width: 100%;

    height: 65px;

    line-height: 65px;

    border-radius: 10px;

    background: #F7F7F7;

    border: none;

    padding: 0 25px;

    box-sizing: border-box;

    color: #9E9E9E;

    text-transform: capitalize;

}



.user_left_menu {

    float: left;

    background: #fff;

    width: 210px;

    border-radius: 10px;

    box-sizing: border-box;

    padding: 30px;

}



.user_left_menu li {

    padding-bottom: 20px;

    margin-bottom: 20px;

    border-bottom: 1px solid #EBEBEB;

}



.user_left_menu li .icon img {

    width: 20px;

    height: 20px;

    margin-right: 5px;

}



.user_left_menu li a {

    position: relative;

}



.user_left_menu li a.active {

    color: #DF6217;

}



.user_left_menu li a:hover::before,.user_left_menu li a.active::before {

    content: '';

    width: 2px;

    height: 36px;

    opacity: 1;

    background: #DF6217;

    position: absolute;

    left: -30px;

    top: 50%;

    margin-top: -18px;

}





.user-right {

    width: 1160px;

    border-radius: 10px;

    box-sizing: border-box;

    padding: 30px;

    float: right;

    background: #fff;

}



.column_user {

    overflow: hidden;

}



.column_user .name {

    font-size: 24px;

    font-weight: bold;

    float: left;

}



.column_user .right {

    float: right;

    font-size: 14px;

    color: rgba(0, 0, 0, 0.5);

}



.column_user .left {

    font-size: 14px;

    color: rgba(0, 0, 0, 0.5);

    margin-left: 10px;

}



.column_user .on {

    color: #DF6217;

}



.user_hdlist .bg-secondary {

    border-radius: 1rem !important;

    background-color: #f7f7fc !important;

    padding: 1.5rem !important;

}



.user_hdlist h3 {

    font-size: 20px;

    font-weight: bold;

}



.user_hdlist .num {

    font-size: 30px;

    font-weight: bold;

}



.user_hdcount span {

    margin-left: 5px;

}



.user_hdcount .item {

    margin: 0 15px;

}



.layer-body {

    padding: 20px;

}



.layer-footer {

    text-align: right;

}



.layer-footer .layui-btn {

    display: inline-block;

    width: auto;

}



.avatar_box {

    height: 378px;

    border-radius: 10px;

    background: #F7F7F7;

    text-align: center;

}



.avatar_box .pic img {

    height: 125px;

    height: 125px;

    border-radius: 100%;

}



.avatar_box .layui-btn {

    width: auto;

    height: 50px;

    line-height: 50px;

    padding: 0 35px;

}



.avatar_box .desc {

    font-size: 14px;

    color: #9E9E9E;

    opacity: .5;

}



.input_box .name {

    font-size: 14px;

    color: #262626;

    margin-bottom: 15px;

}



.input_box .layui-btn {

    height: 50px;

    line-height: 50px;

    padding: 0 35px;

}



.input_box input {

    height: 50px;

    line-height: 50px;

    background: #F7F7F7;

}



.safe_level {

    border-radius: 10px;

    background: #F7F7F7;

    padding: 20px;

}



.safe_level .desc {

    font-size: 14px;

    color: #9E9E9E;

}



.setting_list li {

    background: #F7F7F7;

    padding: 25px;

    border-radius: 10px;

}



.setting_list li .desc {

    font-size: 14px;

    opacity: 0.5;

    margin-top: 5px;

}



.setting_list li .layui-btn {

    width: auto;

    border: 1px solid #DF6217;

    background: none;

    color: #DF6217;

}



.setting_list li .layui-btn:hover {

    background: #DF6217;

    color: #fff;

}



.layer-body .input_box {

    position: relative;

}



.layer-body label.error {

    position: absolute;

    right: 0;

    top: 0;

    z-index: 2;

}



.layer-body .getcode-btn {

    position: absolute;

    right: 10px;

    bottom: 10px;

    border: 1px solid #ccc;

    padding: 5px 10px;

    display: inline-block;

    border-radius: 5px;

    cursor: pointer;

}



.trash_box {

    border-radius: 10px;

    background: #F7F7F7;

    font-size: 14px;

    color: #DF6217;

    line-height: 25px;

    padding: 30px;

}



.trash_box .layui-btn {

    width: auto;

}



.controller_box {

    border-radius: 10px;

    background: #F7F7F7;

    padding: 15px;

    font-size: 17px;

    color: #9E9E9E;

}



.controller_box label {

    cursor: pointer;

}



.controller_box button {

    border: none;

    cursor: pointer;

    background: none;

    color: #9E9E9E;

}



.controller_box button .layui-icon {

    font-size: 20px;

    margin-right: 5px;

}



.controller_box input[type="checkbox"] {

    display: none;

}



.controller_box input[type="checkbox"]+label {

    position: relative;

    padding-left: 20px;

}



.controller_box input[type="checkbox"]+label::after {

    content: '';

    position: absolute;

    left: 0;

    top: 2px;

    display: block;

    width: 14px;

    height: 14px;

    line-height: 14px;

    border-radius: 2px;

    background: #D8D8D8;

    cursor: pointer;

}



.controller_box input[type="checkbox"]:checked+label::after {

    content: '鉁';

    background-color: #F76201;

    font-size: 12px;

    color: #fff;

    text-align: center;

}



.message_list .item {

    border-radius: 10px;

    background: #F7F7F7;

}



.message_list .item.item_success {

    background: #F3FFF9;

}





.message_list .item .detail_box {

    padding: 25px;

}



.message_list .item .reply {

    padding: 0 25px 25px;

}



.message_list .item.item_success .reply {

    background: #F7F7F7;

    padding: 25px;

}



.message_list .item .date_box .date {

    margin-left: 5px;

    font-size: 14px;

    color: #9E9E9E;

}



.message_list .item .date_box .date .layui-icon {

    font-size: 14px;

}



.message_list .item .date_box .status {

    height: 20px;

    background: #F76201;

    box-shadow: 0px 4px 10px 4px rgba(247, 98, 1, 0.2);

    font-size: 14px;

    color: #fff;

    padding: 0 8px;

    border-radius: 10px;

    line-height: 20px;

}



.message_list .item.item_success .date_box .status {

    background: #00C774;

    box-shadow: 0px 4px 10px 4px rgba(1, 247, 128, 0.2);

}



.message_list .item .detail {

    font-size: 17px;

    line-height: 2em;

    color: #232323;

}



.message_list .item .title {

    font-weight: bold;

    font-size: 14px;

}



.message_list .item .date_box2 .name {

    height: 24px;

    border-radius: 12px;

    background: #DEDEDE;

    line-height: 24px;

    font-size: 14px;

    color: #5E5E5E;

    padding: 0 8px;

}



.message_list .item .date_box2 .date2 {

    margin-left: 10px;

    font-size: 14px;

    color: #9E9E9E;

}



.message_list .item .date_box2 .date2 .layui-icon {

    font-size: 14px;

}



.message_list .item .date_box2>.layui-icon {

    cursor: pointer;

}



.message_list .item .detail2 {

    font-size: 16px;

    line-height: 2em;

    color: #232323;

    display: none;

}



.message_list input[type="checkbox"] {

    display: none;

}



.message_list input[type="checkbox"]+label {

    position: relative;

    padding-left: 20px;

}



.message_list input[type="checkbox"]+label::after {

    content: '';

    position: absolute;

    left: 0;

    top: 2px;

    display: block;

    width: 14px;

    height: 14px;

    line-height: 14px;

    border-radius: 2px;

    background: #D8D8D8;

    cursor: pointer;

}



.message_list input[type="checkbox"]:checked+label::after {

    content: '鉁';

    background-color: #F76201;

    font-size: 12px;

    color: #fff;

    text-align: center;

}



.reply-detail {

    padding: 25px;

    position: relative;

}



.reply-detail input {

    width: 100%;

    height: 42px;

    border-radius: 10px;

    box-sizing: border-box;

    border: 1px solid #F76201;

    line-height: 42px;

    padding: 0 20px;

}



.reply-detail button {

    width: 112px;

    height: 42px;

    border-radius: 10px;

    background: #F76201;

    line-height: 42px;

    text-align: center;

    position: absolute;

    right: 25px;

    top: 25px;

    border: none;

    color: #fff;

    z-index: 2;

    cursor: pointer;

}