@charset "UTF-8";
:root {
  --primary:                    #178282;
  --head-xm-select-border:      #134448;
}

.login-forms .mixform-wrap, .order-info-table .table-row .cell:last-child, .apply-load-group .btn, .valid-popup .pwd-with-inst {
  display: flex;
  display: -moz-flex;
  display: -ms-flexbox;
}

.login-forms .mixform-wrap, .order-info-table .table-row .cell:last-child, .apply-load-group .btn, .valid-popup .pwd-with-inst {
  align-items: center;
}

.apply-load-group .btn, .valid-popup .pwd-with-inst {
  justify-content: center;
}

.login-forms .mixform-wrap, .order-info-table .table-row .cell:last-child {
  justify-content: flex-start;
}

.login-body:after, .login-body .login-tip:after, .login-forms .input-icon:after, .login-scan-mode:after, .class-swiper-card .card-wrap:after, .project-detail-wrap .signup-group:after, .project-brief .row:after, .teacher-list .teacher-wrap:after, .order-form-title .append:after, .order-price-group:after {
  content: '';
  display: inline-block;
  height: 100%;
}

/**
 * Login
 * ----------------------------------------------------------------------------
 */
.login-bg {
  height: 100%;
  background-image: url("../images/themeGreen/login/login-bg.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.login-body {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 0;
}

.login-body:after {
  vertical-align: middle;
}

.login-body > * {
  display: inline-block;
  vertical-align: middle;
}

.login-body > *:first-child {
  margin-left: 0;
}

.login-body > *:last-child {
  margin-right: 0;
}

.login-body .login-wrap {
  width: 900px;
  height: 560px;
}

.login-body .left,
.login-body .right {
  display: inline-block;
  height: inherit;
  vertical-align: middle;
}

.login-body .left {
  position: relative;
  width: 360px;
  height: 560px;
  background: url("../images/themeGreen/login/login-left-bg.jpg") no-repeat center center/cover;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.login-body .left .txt {
  position: relative;
  z-index: 2;
  padding: 72px 48px;
}

.login-body .left .txt h3, .login-body .left .txt span {
  display: block;
  font-size: 30px;
  color: #fff;
  line-height: 1.4;
  text-align: left;
}

.login-body .left .txt h3 {
  padding-bottom: 16px;
}

.login-body .left .txt span {
  font-weight: bold;
}

.login-body .left .pic {
  position: absolute;
  bottom: 0;
  left: -26px;
  width: 348px;
  height: 184px;
  background: url("../images/themeGreen/login/login-left-pic.png") no-repeat center center/cover;
}

.login-body .right {
  position: relative;
  width: 540px;
  height: inherit;
  padding: 52px 80px 24px;
  text-align: left;
  background: #fff url("../images/themeGreen/login/login-right-bg.png") no-repeat right bottom/contain;
  vertical-align: middle;
  box-sizing: border-box;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  box-sizing: border-box;
}

.login-body .right .wrap {
  position: relative;
  width: 100%;
  height: calc(100% - 32px * 2) !important;
  box-sizing: border-box;
}

.login-body .right .wrap.active {
  display: inline-block;
}

.login-body .login-title {
  font-size: 18px;
  line-height: 56px;
}

.login-body .login-btn {
  width: 100%;
  height: 48px;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  line-height: 48px;
  letter-spacing: 4px;
  background: linear-gradient(97deg, #7ECE9F 0%, #178282 62%, #1E6B70 100%);
  border-radius: 8px;
  border: 0 !important;
  box-shadow: 0px 4px 8px rgba(23, 130, 130, 0.4);
}

.login-body .login-switch {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 1;
  font-size: 64px;
  color: #178282;
  overflow: hidden;
  cursor: pointer;
  opacity: 0.8;
  filter: alpha(opacity=80);
  transition: 0.3s;
}

.login-body .login-switch:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}

.login-body .login-switch:after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  display: inline-block;
  width: 0;
  height: 0;
  display: inline-block;
  overflow: hidden;
  border-width: 64px;
  border-color: transparent;
  border-style: dashed;
  border-bottom-color: white;
  border-bottom-style: solid;
}

.login-body .login-tip {
  position: absolute;
  top: 10px;
  right: 82px;
  display: inline-block;
  padding: 0 12px;
  background-color: white;
  border: 1px solid #e6e6e6;
  border-radius: 4px;
  font-size: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  transition: 0.3s;
}

.login-body .login-tip:after {
  vertical-align: middle;
}

.login-body .login-tip > * {
  display: inline-block;
  vertical-align: middle;
}

.login-body .login-tip > *:first-child {
  margin-left: 0;
}

.login-body .login-tip > *:last-child {
  margin-right: 0;
}

.login-body .login-tip span {
  display: inline-block;
  vertical-align: middle;
}

.login-body .login-tip .icon {
  margin-right: 4px;
  font-size: 18px;
  color: #1aad19;
}

.login-body .login-tip .text {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 14px;
  color: #595959;
  line-height: 22px;
}

.login-body .login-tip:after {
  content: '';
  position: absolute;
  top: 50%;
  right: -12px;
  margin-top: -6px;
  display: inline-block;
  width: 0;
  height: 0;
  display: inline-block;
  overflow: hidden;
  border-width: 6px;
  border-color: transparent;
  border-style: dashed;
  border-left-color: #e6e6e6;
  border-left-style: solid;
}

.login-body .login-tip.active {
  right: 90px;
  opacity: 1;
  filter: alpha(opacity=100);
}

.login-tabs .tabs-link {
  font-size: 18px;
  line-height: 56px;
}

.login-tabs .tabs-link.active:after {
  bottom: 0;
  width: 32px;
  left: 50%;
  height: 3px;
  margin-left: -16px;
}

.login-forms .form-control {
  height: 44px;
  padding-right: 16px;
  padding-left: 16px;
  font-size: 16px;
  border-width: 1px;
  border-radius: 8px;
}

.login-forms .input-icon {
  font-size: 0;
  font-size: 0;
  line-height: 0;
}

.login-forms .input-icon:after {
  vertical-align: middle;
}

.login-forms .input-icon > * {
  display: inline-block;
  vertical-align: middle;
}

.login-forms .input-icon > *:first-child {
  margin-left: 0;
}

.login-forms .input-icon > *:last-child {
  margin-right: 0;
}

.login-forms .input-icon i {
  line-height: 1 !important;
  font-size: 18px !important;
}

.login-forms .mixform-wrap input[type="submit"] {
  height: 44px;
}

.login-forms .mixform-wrap .code-wrap {
  width: 120px;
  height: 44px;
}

.login-forms .mixform-wrap .code-wrap img {
  display: block;
  width: 100%;
  height: auto;
}

.login-scan-mode {
  text-align: center;
  font-size: 0;
}

.login-scan-mode:after {
  vertical-align: middle;
}

.login-scan-mode > * {
  display: inline-block;
  vertical-align: middle;
}

.login-scan-mode > *:first-child {
  margin-left: 0;
}

.login-scan-mode > *:last-child {
  margin-right: 0;
}

.login-scan-mode .login-qr-wrap {
  width: 240px;
  margin-right: auto;
  margin-left: auto;
  padding: 16px;
  border: 1px solid #e6e6e6;
}

/**
 * 睿训非学历独有样式
 * 包括对组件的复写、布局，以及新元素、新模块的样式
 * ----------------------------------------------------------------------------
 */
.class-swiper-card {
  margin-top: 12px;
  margin-bottom: 12px;
  cursor: pointer;
  transition: 0.3s;
}

.class-swiper-card:after, .class-swiper-card:before {
  display: none;
}

.class-swiper-card .card {
  background-image: url("../images/themeGreen/ruixun/class-card-dec.svg");
  border-color: #e2eaea;
  background-position: right bottom;
  background-repeat: no-repeat;
  background-size: auto 56px;
}

.class-swiper-card .card-wrap {
  padding: 12px;
  font-size: 0;
}

.class-swiper-card .card-wrap:after {
  vertical-align: middle;
}

.class-swiper-card .card-wrap > * {
  display: inline-block;
  vertical-align: middle;
}

.class-swiper-card .card-wrap > *:first-child {
  margin-left: 0;
}

.class-swiper-card .card-wrap > *:last-child {
  margin-right: 0;
}

.class-swiper-card .thumb {
  display: none;
}

.class-swiper-card .con {
  width: 100%;
  height: 56px;
}

.class-swiper-card .title {
  margin-top: 16px;
  margin-bottom: 0;
  font-size: 16px;
  line-height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.class-swiper-card .title::before {
  content: '';
  display: block;
}

.class-swiper-card .title i {
  font-size: 14px;
  color: #d0dcdc;
}

.class-swiper-card .info-group {
  display: none;
}

.class-swiper-card .lab .dot {
  margin-right: 6px;
  background-color: #d9d9d9;
}

.class-swiper-card .lab .lab-text {
  color: #8c8c8c;
}

.class-swiper .swiper-slide {
  display: inline-block;
  width: 234px;
  height: 116px;
}

.class-swiper .swiper-slide.active {
  width: 350px;
}

.class-swiper .swiper-slide.active .class-swiper-card {
  margin-top: 0;
  margin-bottom: 0;
}

.class-swiper .swiper-slide.active .class-swiper-card:after, .class-swiper .swiper-slide.active .class-swiper-card:before {
  display: inline-block;
}

.class-swiper .swiper-slide.active .class-swiper-card .card {
  background-image: none;
}

.class-swiper .swiper-slide.active .class-swiper-card .thumb {
  display: inline-block;
  width: 114px;
  margin-right: 12px;
}

.class-swiper .swiper-slide.active .class-swiper-card .con {
  width: calc((100% - 126px));
  height: auto;
}

.class-swiper .swiper-slide.active .class-swiper-card .title {
  margin-top: 0;
}

.class-swiper .swiper-slide.active .class-swiper-card .title i {
  display: none;
}

.class-swiper .swiper-slide.active .class-swiper-card .info-group {
  display: block;
}

.class-container .swiper-button-prev,
.class-container .swiper-button-next {
  width: 24px;
  height: 24px;
  margin-top: -12px;
  font-size: 22px;
  color: #178282;
  background-image: none;
  border-radius: 6px;
}

.class-container .swiper-button-prev:hover,
.class-container .swiper-button-next:hover {
  background-color: #cdf4e4;
}

.class-container .swiper-button-prev {
  left: 4px;
}

.class-container .swiper-button-next {
  right: 4px;
}

.timetable {
  margin-top: -12px;
}

.timetable .timetable-row {
  position: relative;
  padding-left: 132px;
}

.timetable .timetable-row:hover .timelab {
  color: white;
  background-color: #178282;
}

.timetable .timetable-row:hover .timelab .arrow {
  border-left-color: #178282;
}

.timetable .timetable-row:hover .dot {
  background-color: #178282 !important;
}

.timetable .timetable-row:first-child .course-gallery:after {
  top: 26px;
}

.timetable .timetable-row .timelab {
  position: absolute;
  top: 12px;
  left: 0;
  width: 116px;
  font-size: 12px;
  color: #178282;
  line-height: 28px;
  text-align: center;
  background-color: #cdf4e4;
  border-radius: 6px;
}

.timetable .timetable-row .timelab .arrow {
  position: absolute;
  top: 50%;
  right: -8px;
  margin-top: -4px;
  width: 0;
  height: 0;
  display: inline-block;
  overflow: hidden;
  border-width: 4px;
  border-color: transparent;
  border-style: dashed;
  border-left-color: #cdf4e4;
  border-left-style: solid;
}

.timetable .timetable-row .course-gallery {
  position: relative;
  padding-left: 16px;
}

.timetable .timetable-row .course-gallery:after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: inline-block;
  width: 1px;
  background-color: #e6e6e6;
}

.timetable .timetable-row .course-gallery ul {
  margin: 0 -12px;
  font-size: 0;
}

.timetable .timetable-row .course-gallery .cell {
  display: inline-block;
  width: 50%;
  vertical-align: middle;
}

.timetable .timetable-row .course-gallery .dot {
  position: absolute;
  top: 22.5px;
  left: -3px;
  z-index: 2;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: #d9d9d9;
}

.timetable .timetable-row .course-gallery .course-card {
  position: relative;
  margin: 12px;
  padding: 16px;
  background-color: white;
  border: 1px solid #e6e6e6;
  border-radius: 8px;
  cursor: pointer;
  transition: 0.3s;
}

.timetable .timetable-row .course-gallery .course-card .pos {
  position: absolute;
  z-index: 1;
}

.timetable .timetable-row .course-gallery .course-card .pos.pos-tr {
  top: 0;
  right: 0;
}

.timetable .timetable-row .course-gallery .course-card .book-lab {
  margin-top: 16px;
  margin-right: -4px;
}

.timetable .timetable-row .course-gallery .course-card .time {
  font-size: 14px;
  color: #a6a6a6;
  line-height: 22px;
}

.timetable .timetable-row .course-gallery .course-card .time i {
  margin-right: 4px;
  line-height: 1;
}

.timetable .timetable-row .course-gallery .course-card .title {
  margin-bottom: 8px;
  font-size: 16px;
  color: black;
  line-height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.timetable .timetable-row .course-gallery .course-card .title::before {
  content: '';
  display: block;
}

.timetable .timetable-row .course-gallery .course-card .info-group {
  position: relative;
}

.timetable .timetable-row .course-gallery .course-card .info-group .info {
  margin-right: 12px;
  margin-left: 12px;
  color: #737373;
  line-height: 32px;
}

.timetable .timetable-row .course-gallery .course-card .info-group .info i {
  margin-right: 4px;
  line-height: 1;
}

.timetable .timetable-row .course-gallery .course-card .info-group .info:first-child {
  margin-left: 0;
}

.timetable .timetable-row .course-gallery .course-card .info-group .info:last-child {
  margin-right: 0;
}

.timetable .timetable-row .course-gallery .course-card:hover {
  border-color: #178282;
  box-shadow: 0 9px 28px 0 rgba(0, 0, 0, 0.05);
}

.notice-row {
  padding: 8px 16px;
  height: 158px;
  overflow: hidden;
}

.notice-cell {
  position: relative;
  margin-bottom: 12px;
  padding-left: 16px;
  padding-right: 100px;
  font-size: 14px;
  line-height: 22px;
}

.notice-cell .dot {
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -4px;
}

.notice-cell .text {
  display: block;
  color: #141414;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notice-cell .text::before {
  content: '';
  display: block;
}

.notice-cell .time {
  position: absolute;
  right: 0;
  top: 0;
  width: 100px;
  text-align: right;
  color: #8c8c8c;
}

.notice-cell:hover .text {
  color: #178282;
}

.notice-cell.has-read {
  opacity: 0.7;
  filter: alpha(opacity=70);
}

.notice-cell.has-read .dot {
  display: none;
}

.notice-cell.has-read:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}

.notice-cell:last-child {
  margin-bottom: 0;
}

.notice-cell.has-op {
  margin-top: 8px;
  margin-bottom: 0;
  padding-bottom: 8px;
  padding-right: 200px;
  line-height: 40px;
  border-bottom: 1px dashed #e2eaea;
}

.notice-cell.has-op .arrow {
  position: absolute;
  top: 0;
  left: 0;
  color: #d0dcdc;
}

.notice-cell.has-op .append .time {
  position: relative;
  margin-right: 24px;
}

.notice-cell.has-op .append .btn:hover {
  color: #178282;
  background-color: rgba(23, 130, 130, 0.1);
}

.notice-cell.readed .text {
  color: #8c8c8c;
}

.notice-cell.readed .time {
  color: #bfbfbf;
}

.notice-cell.unread .arrow {
  color: #e54d4d !important;
}

.project-detail-wrap .card {
  margin: 0;
  background-color: transparent;
  border-color: transparent;
  overflow: visible !important;
}

.project-detail-wrap .card .card-wrap {
  padding: 0;
}

.project-detail-wrap .card .title {
  font-size: 20px;
}

.project-detail-wrap .card .card-wrap,
.project-detail-wrap .card .con {
  position: static;
}

.project-detail-wrap .card .foot {
  text-align: left;
}

.project-detail-wrap .signup-group {
  font-size: 0;
}

.project-detail-wrap .signup-group:after {
  vertical-align: middle;
}

.project-detail-wrap .signup-group > * {
  display: inline-block;
  vertical-align: middle;
}

.project-detail-wrap .signup-group > *:first-child {
  margin-left: 0;
}

.project-detail-wrap .signup-group > *:last-child {
  margin-right: 0;
}

.project-detail-wrap .signup-group > * {
  margin-right: 8px;
}

.project-detail-wrap .signup-group > *:last-child {
  margin-right: 0;
}

.project-detail-wrap .signup-group .form-select {
  width: 200px;
}

.detail-tabs {
  padding: 4px;
  background-color: #f3f6f6;
  border-radius: 8px;
}

.detail-tabs .tabs-item {
  margin: 0;
  padding-right: 16px;
  padding-left: 16px;
}

.detail-tabs .tabs-item:first-child {
  padding-left: 0;
}

.detail-tabs .tabs-item:last-child {
  padding-right: 0;
}

.detail-tabs .tabs-item:last-child .tabs-link:after {
  display: none;
}

.detail-tabs .tabs-link {
  background-color: transparent;
  border-color: transparent;
}

.detail-tabs .tabs-link:after {
  content: '';
  position: absolute;
  top: 6px;
  right: -16px;
  bottom: 6px;
  display: inline-block;
  width: 1px;
  background-color: #e6e6e6;
}

.detail-tabs .tabs-link:hover {
  background-color: #eaefef !important;
  border-color: transparent !important;
}

.detail-tabs .tabs-link.active, .detail-tabs .tabs-link.active:hover {
  color: black !important;
  background-color: white !important;
  border-color: white !important;
  box-shadow: 0 9px 28px 0 rgba(0, 0, 0, 0.05);
}

.project-brief {
  padding: 16px 0;
}

.project-brief .row {
  margin-top: 12px;
  margin-bottom: 12px;
  font-size: 0;
}

.project-brief .row:after {
  vertical-align: middle;
}

.project-brief .row > * {
  display: inline-block;
  vertical-align: middle;
}

.project-brief .row > *:first-child {
  margin-left: 0;
}

.project-brief .row > *:last-child {
  margin-right: 0;
}

.project-brief .row > span {
  font-size: 14px;
  line-height: 22px;
}

.project-brief .row .title {
  width: 102px;
  margin-right: 8px;
  text-align: right;
  color: #8c8c8c;
}

.teacher-list .row {
  margin-top: 16px;
  margin-bottom: 16px;
}

.teacher-list .row:first-child {
  margin-top: 0;
}

.teacher-list .row:last-child {
  margin-bottom: 0;
}

.teacher-list .teacher-wrap {
  position: relative;
  padding: 28px 32px;
  border: 1px solid #e2eaea;
  border-radius: 8px;
  font-size: 0;
}

.teacher-list .teacher-wrap:after {
  vertical-align: top;
}

.teacher-list .teacher-wrap > * {
  display: inline-block;
  vertical-align: top;
}

.teacher-list .teacher-wrap > *:first-child {
  margin-left: 0;
}

.teacher-list .teacher-wrap > *:last-child {
  margin-right: 0;
}

.teacher-list .teacher-wrap .portrait {
  margin-right: 16px;
}

.teacher-list .teacher-wrap .con {
  width: calc(100% - 88px);
}

.teacher-list .teacher-wrap .con .name-group {
  margin-bottom: 6px;
}

.teacher-list .teacher-wrap .con .name-group > * {
  display: inline-block;
  vertical-align: middle;
}

.teacher-list .teacher-wrap .con .name-group .name {
  font-size: 18px;
  color: #141414;
  line-height: 28px;
}

.teacher-list .teacher-wrap .con .article {
  max-height: 44px;
  font-size: 14px;
  color: #595959;
  line-height: 22px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  word-break: break-all;
}

.teacher-list .teacher-wrap .con .article.showall {
  max-height: none !important;
  overflow: visible;
  -webkit-line-clamp: inherit;
}

.teacher-list .teacher-wrap .more-btn {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 4px 8px;
  font-size: 12px;
  color: #8c8c8c;
  background-color: #ebf0f0;
  border-top-left-radius: 8px;
}

.teacher-list .teacher-wrap .more-btn:hover {
  color: #178282;
  background-color: #cdf4e4;
}

.order-form-title .append {
  padding-right: inherit;
  font-size: 0;
}

.order-form-title .append:after {
  vertical-align: middle;
}

.order-form-title .append > * {
  display: inline-block;
  vertical-align: middle;
}

.order-form-title .append > *:first-child {
  margin-left: 0;
}

.order-form-title .append > *:last-child {
  margin-right: 0;
}

.order-form-title .append .text {
  color: #f0f0f0;
}

.order-form-title .append .switch {
  background-color: #dce5e5;
}

.order-form-title .append .switch.active {
  background-color: #178282;
}

.order-info-table .table-row .cell:first-child {
  color: #8c8c8c;
}

.order-sub-container {
  margin-top: -4px;
  padding-top: 16px;
  padding-right: 56px;
  padding-bottom: 16px;
  padding-left: 56px;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  box-shadow: 0 9px 28px 0 rgba(0, 0, 0, 0.05);
}

.order-price-group {
  text-align: right;
  font-size: 0;
}

.order-price-group:after {
  vertical-align: middle;
}

.order-price-group > * {
  display: inline-block;
  vertical-align: middle;
}

.order-price-group > *:first-child {
  margin-left: 0;
}

.order-price-group > *:last-child {
  margin-right: 0;
}

.order-price-group .title {
  font-size: 14px;
  color: #141414;
  line-height: 22px;
}

.order-price-group .price {
  font-size: 24px;
}

.apply-load-group .cell {
  display: inline-block;
  margin-right: 16px;
  vertical-align: middle;
}

.apply-load-group .attachment-group {
  font-size: 14px;
}

.apply-load-group .attachment-group > * {
  margin-right: 4px;
  margin-left: 4px;
}

.apply-load-group .attachment-group .name {
  color: #8c8c8c;
}

.apply-load-group .attachment-group .name .icon {
  display: inline-block;
  margin-right: 4px;
  line-height: 1;
  vertical-align: middle;
}

.apply-load-group .btn .icon {
  margin-right: 4px;
  font-size: 16px !important;
}

.valid-popup .inst-group {
  margin-left: 32px;
}

.valid-popup .inst-group .inst-group-row {
  margin-top: 12px;
  margin-bottom: 12px;
}

.valid-popup .inst-group .inst-group-row:first-child {
  margin-top: 0;
}

.valid-popup .inst-group .inst-group-row:last-child {
  margin-bottom: 0;
}

.valid-popup .inst-group .title {
  margin-bottom: 8px;
  color: #8c8c8c;
  line-height: 22px;
}

.valid-popup .inst-group .info i {
  margin-right: 8px;
  font-size: 16px;
  color: #22c3ae;
}

.valid-popup .inst-group .info span {
  color: #595959;
}

.valid-popup .pwd-with-inst .form-group {
  width: 320px;
  margin-right: 0;
  margin-left: 0;
}

.valid-popup .pwd-with-inst .form-group .form-row {
  margin-top: 16px;
  margin-bottom: 16px;
}

.valid-popup .pwd-with-inst .form-group .form-row:first-child {
  margin-top: 0;
}

.valid-popup .pwd-with-inst .form-group .form-row:last-child {
  margin-bottom: 0;
}

.index-top {
  margin: 0 -12px;
}

.index-top .dvs-2 {
  padding: 0 12px;
  box-sizing: border-box;
}

.index-top .contents-body {
  margin-top: -16px;
}

.login-record {
  padding: 12px;
  margin-bottom: 16px;
  border: 1px solid #ebf0f0;
  border-radius: 8px;
}

.login-record-cell {
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 22px;
}

.login-record-cell:last-child {
  margin-bottom: 0;
}

.login-record-cell.dvs-2 {
  padding: 0;
}

.login-record-cell .arrow {
  display: inline-block;
  margin-top: -8px;
  color: #d0dcdc;
}

.login-record-cell .title {
  color: #141414;
  font-weight: bold;
}

.login-record-cell .info {
  color: #595959;
}

.data-single-line .name,
.data-single-line .score {
  display: inline-block;
  vertical-align: middle;
}

.data-single-line .score > span {
  vertical-align: middle;
}

.data-single-line.data-item.data-item-1 {
  background: linear-gradient(90deg, rgba(126, 218, 135, 0.15), rgba(126, 218, 135, 0));
}

.notice-row {
  padding: 8px 16px;
  height: 158px;
  overflow: hidden;
}

.notice-cell {
  position: relative;
  padding-left: 16px;
  padding-right: 100px;
  margin-bottom: 12px;
  font-size: 14px;
  line-height: 22px;
}

.notice-cell .dot {
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -4px;
}

.notice-cell .text {
  display: block;
  color: #141414;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notice-cell .text::before {
  content: '';
  display: block;
}

.notice-cell .time {
  position: absolute;
  right: 0;
  top: 0;
  width: 100px;
  text-align: right;
  color: #8c8c8c;
}

.notice-cell .arrow {
  position: absolute;
  top: 0;
  left: 0;
  color: #e54d4d;
}

.notice-cell:hover .text {
  color: #178282;
}

.notice-cell.has-read {
  opacity: 0.7;
  filter: alpha(opacity=70);
}

.notice-cell.has-read .dot {
  display: none;
}

.notice-cell.has-read:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}

.notice-cell.has-read .arrow {
  color: #d0dcdc;
}

.notice-cell:last-child {
  margin-bottom: 0;
}

.notice-cell.has-op {
  margin-top: 8px;
  margin-bottom: 0;
  padding-bottom: 8px;
  padding-right: 200px;
  line-height: 40px;
  border-bottom: 1px dashed #e2eaea;
}

.notice-cell.has-op .append .time {
  position: relative;
  margin-right: 24px;
}

.notice-cell.has-op .append .btn:hover {
  color: #178282;
  background-color: rgba(23, 130, 130, 0.1);
}