@charset "UTF-8";
.scm-contents {
  /* Button - btn type array */
}
.scm-contents [class*=-btn] {
  font-weight: 400;
  box-sizing: border-box;
  border: none;
  border-radius: 8px;
  transition: 0.2s;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  /* Btn size */
}
.scm-contents [class*=-btn]:disabled {
  background-color: #F2F2F2;
  border-color: #C8C8C8;
  color: #C8C8C8;
  cursor: initial;
  pointer-events: none;
}
.scm-contents [class*=-btn][class*=_xs] {
  font-size: 12px;
  height: 20px;
  font-weight: 400;
  padding: 0 8px;
  gap: 2px;
}
.scm-contents [class*=-btn][class*=_xs]:focus:not(:disabled), .scm-contents [class*=-btn][class*=_xs].on:not(:disabled) {
  font-weight: 500;
}
.scm-contents [class*=-btn][class*=_sm] {
  font-size: 12px;
  height: 32px;
  font-weight: 400;
  padding: 0 12px;
  gap: 2px;
}
.scm-contents [class*=-btn][class*=_sm]:focus:not(:disabled), .scm-contents [class*=-btn][class*=_sm].on:not(:disabled) {
  font-weight: 500;
}
.scm-contents [class*=-btn][class*=_md] {
  font-size: 14px;
  height: 40px;
  font-weight: 400;
  padding: 0 12px;
  gap: 4px;
}
.scm-contents [class*=-btn][class*=_md]:focus:not(:disabled), .scm-contents [class*=-btn][class*=_md].on:not(:disabled) {
  font-weight: 400;
}
.scm-contents [class*=-btn][class*=_lg] {
  font-size: 14px;
  height: 48px;
  font-weight: 400;
  padding: 0 20px;
  gap: 0;
}
.scm-contents [class*=-btn][class*=_lg]:focus:not(:disabled), .scm-contents [class*=-btn][class*=_lg].on:not(:disabled) {
  font-weight: 500;
}
.scm-contents [class*=-btn][class*=_xl] {
  font-size: 14px;
  height: 56px;
  font-weight: 700;
  padding: 0 20px;
  gap: 0;
}
.scm-contents [class*=-btn][class*=_xl]:focus:not(:disabled), .scm-contents [class*=-btn][class*=_xl].on:not(:disabled) {
  font-weight: 700;
}
.scm-contents [class*=df-btn] {
  color: #666;
  background: #fff;
  border: 1px solid #D9D9D9;
}
.scm-contents [class*=df-btn]:hover:not(:disabled), .scm-contents [class*=df-btn]:focus:not(:disabled), .scm-contents [class*=df-btn].on:not(:disabled) {
  border-color: #202020;
  color: #202020;
}
.scm-contents [class*=black-btn] {
  color: #fff;
  background: #333;
  border: 1px solid #333;
}
.scm-contents [class*=black-btn]:hover:not(:disabled), .scm-contents [class*=black-btn]:focus:not(:disabled), .scm-contents [class*=black-btn].on:not(:disabled) {
  border-color: #101010;
  background: #101010;
}
.scm-contents [class*=blue-btn] {
  color: #fff;
  background: #0E89E8;
  border: 1px solid #0E89E8;
}
.scm-contents [class*=blue-btn]:hover:not(:disabled), .scm-contents [class*=blue-btn]:focus:not(:disabled), .scm-contents [class*=blue-btn].on:not(:disabled) {
  border-color: #007AFF;
  background: #007AFF;
}
.scm-contents [class*=blue-outln-btn] {
  color: #0E89E8;
  background: #fff;
  border: 1px solid #0E89E8;
}
.scm-contents [class*=blue-outln-btn]:hover:not(:disabled), .scm-contents [class*=blue-outln-btn]:focus:not(:disabled), .scm-contents [class*=blue-outln-btn].on:not(:disabled) {
  border-color: #007AFF;
  background: #fff;
  color: #007AFF;
}
.scm-contents .w-full {
  width: 100%;
}
.scm-contents .h-full {
  height: 100%;
}
.scm-contents .vh-full {
  height: 100vh;
}
.scm-contents input[type=text][class*=df-],
.scm-contents input[type=password][class*=df-],
.scm-contents input[type=text][class*=data-],
.scm-contents select[class*=df-] {
  min-width: 80px;
  overflow: hidden;
  color: #C8C8C8;
  border: 1px solid #C8C8C8;
  box-sizing: border-box;
  transition: 0.2s;
  caret-color: #0E89E8;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  border-radius: 4px;
}
.scm-contents input[type=text][class*=df-]::placeholder,
.scm-contents input[type=password][class*=df-]::placeholder,
.scm-contents input[type=text][class*=data-]::placeholder,
.scm-contents select[class*=df-]::placeholder {
  color: #C8C8C8;
}
.scm-contents input[type=text][class*=df-][class*=select],
.scm-contents input[type=password][class*=df-][class*=select],
.scm-contents input[type=text][class*=data-][class*=select],
.scm-contents select[class*=df-][class*=select] {
  background: #fff url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/Hproject/iconGuide/icon_chevron-down600.svg) center right 8px no-repeat;
  padding: 0 8px 0 12px;
}
.scm-contents input[type=text][class*=df-][class*=select][class*=_sm],
.scm-contents input[type=password][class*=df-][class*=select][class*=_sm],
.scm-contents input[type=text][class*=data-][class*=select][class*=_sm],
.scm-contents select[class*=df-][class*=select][class*=_sm] {
  padding: 0 36px 0 8px;
}
.scm-contents input[type=text][class*=df-][class*=select][class*=_lg],
.scm-contents input[type=password][class*=df-][class*=select][class*=_lg],
.scm-contents input[type=text][class*=data-][class*=select][class*=_lg],
.scm-contents select[class*=df-][class*=select][class*=_lg] {
  padding: 0 44px 0 8px;
}
.scm-contents input[type=text][class*=df-][class*=select]:disabled,
.scm-contents input[type=password][class*=df-][class*=select]:disabled,
.scm-contents input[type=text][class*=data-][class*=select]:disabled,
.scm-contents select[class*=df-][class*=select]:disabled {
  background-image: url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/Hproject/iconGuide/icon_chevron-down300.svg);
}
.scm-contents input[type=text][class*=df-][class*=select].active,
.scm-contents input[type=password][class*=df-][class*=select].active,
.scm-contents input[type=text][class*=data-][class*=select].active,
.scm-contents select[class*=df-][class*=select].active {
  color: #202020;
  border-color: #202020;
  background-image: url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/Hproject/iconGuide/icon_chevron-down800.svg);
}
.scm-contents input[type=text][class*=df-][class*=select]:read-only,
.scm-contents input[type=password][class*=df-][class*=select]:read-only,
.scm-contents input[type=text][class*=data-][class*=select]:read-only,
.scm-contents select[class*=df-][class*=select]:read-only {
  border-color: #C8C8C8;
}
.scm-contents input[type=text][class*=df-][class*=select]:disabled,
.scm-contents input[type=password][class*=df-][class*=select]:disabled,
.scm-contents input[type=text][class*=data-][class*=select]:disabled,
.scm-contents select[class*=df-][class*=select]:disabled {
  background-color: #F2F2F2;
}
.scm-contents input[type=text][class*=df-][class*=input]:read-only,
.scm-contents input[type=password][class*=df-][class*=input]:read-only,
.scm-contents input[type=text][class*=data-][class*=input]:read-only,
.scm-contents select[class*=df-][class*=input]:read-only {
  background-color: #F2F2F2;
}
.scm-contents input[type=text][class*=df-][class*=_sm],
.scm-contents input[type=password][class*=df-][class*=_sm],
.scm-contents input[type=text][class*=data-][class*=_sm],
.scm-contents select[class*=df-][class*=_sm] {
  height: 32px;
  line-height: 32px;
  padding: 0 12px;
  border-radius: 4px;
}
.scm-contents input[type=text][class*=df-][class*=_lg],
.scm-contents input[type=password][class*=df-][class*=_lg],
.scm-contents input[type=text][class*=data-][class*=_lg],
.scm-contents select[class*=df-][class*=_lg] {
  height: 40px;
  line-height: 40px;
  padding: 0 16px;
  border-radius: 4px;
}
.scm-contents input[type=text][class*=df-]:read-only, .scm-contents input[type=text][class*=df-] :disabled,
.scm-contents input[type=password][class*=df-]:read-only,
.scm-contents input[type=password][class*=df-] :disabled,
.scm-contents input[type=text][class*=data-]:read-only,
.scm-contents input[type=text][class*=data-] :disabled,
.scm-contents select[class*=df-]:read-only,
.scm-contents select[class*=df-] :disabled {
  border-color: #E8E8E8;
}
.scm-contents input[type=text][class*=df-]:hover:not(:disabled), .scm-contents input[type=text][class*=df-]:focus:not(:disabled),
.scm-contents input[type=password][class*=df-]:hover:not(:disabled),
.scm-contents input[type=password][class*=df-]:focus:not(:disabled),
.scm-contents input[type=text][class*=data-]:hover:not(:disabled),
.scm-contents input[type=text][class*=data-]:focus:not(:disabled),
.scm-contents select[class*=df-]:hover:not(:disabled),
.scm-contents select[class*=df-]:focus:not(:disabled) {
  color: #666;
  border-color: #666;
}
.scm-contents input[type=text][class*=df-]:not(:disabled, :read-only):not(:placeholder-shown),
.scm-contents input[type=password][class*=df-]:not(:disabled, :read-only):not(:placeholder-shown),
.scm-contents input[type=text][class*=data-]:not(:disabled, :read-only):not(:placeholder-shown),
.scm-contents select[class*=df-]:not(:disabled, :read-only):not(:placeholder-shown) {
  color: #202020;
  border-color: #202020;
}
.scm-contents input[type=text][class*=data-input] + button {
  position: absolute;
  right: 8px;
  top: 0;
  bottom: 0;
  margin: auto;
  padding: 0;
  background: none;
}
.scm-contents input[type=text][class*=data-input][class*=_sm] + button {
  width: 20px;
  height: 20px;
}
.scm-contents input[type=text][class*=data-input][class*=_lg] + button {
  width: 24px;
  height: 24px;
}
.scm-contents input[type=text][class*=data-input]:disabled + button, .scm-contents input[type=text][class*=data-input]:read-only + button {
  pointer-events: none;
}
.scm-contents input[type=text][class*=data-input]:hover:not(:disabled) + button svg > path, .scm-contents input[type=text][class*=data-input]:focus:not(:disabled) + button svg > path {
  fill: #666;
  pointer-events: none;
}
.scm-contents input[type=text][class*=data-input]:not(:disabled, :read-only):not(:placeholder-shown) + button svg > path {
  fill: #202020;
}
.scm-contents input[type=text][class*=data-input].datepicker {
  padding: 0 32px 0 16px;
  background: none;
  background-size: inherit;
}
.scm-contents input[type=checkbox][class*=df-] {
  position: relative;
  display: none;
}
.scm-contents input[type=checkbox][class*=df-] + label {
  display: flex;
  align-items: center;
  gap: 4px;
  position: relative;
  cursor: pointer;
}
.scm-contents input[type=checkbox][class*=df-] + label:before {
  content: "";
  display: inline-block;
  transition: 0.2s;
  box-shadow: none;
  outline: none;
  border: 1px solid #C8C8C8;
  box-sizing: border-box;
  border-radius: 4px;
  background: #fff;
  position: relative;
  top: 1px;
}
.scm-contents input[type=checkbox][class*=df-] + label svg {
  display: none;
  position: absolute;
  top: 1.5px;
}
.scm-contents input[type=checkbox][class*=df-][class*=_sm] + label:before, .scm-contents input[type=checkbox][class*=df-][class*=_sm] + label svg {
  width: 18px;
  height: 18px;
}
.scm-contents input[type=checkbox][class*=df-][class*=_lg] + label:before, .scm-contents input[type=checkbox][class*=df-][class*=_lg] + label svg {
  width: 24px;
  height: 24px;
}
.scm-contents input[type=checkbox][class*=df-]:disabled + label:before {
  background-color: #F2F2F2;
}
.scm-contents input[type=checkbox][class*=df-]:disabled + label svg {
  display: block;
}
.scm-contents input[type=checkbox][class*=df-]:disabled + label svg path {
  fill: #C8C8C8;
}
.scm-contents input[type=checkbox][class*=df-]:hover:not(:disabled, :checked) + label:before, .scm-contents input[type=checkbox][class*=df-]:focus:not(:disabled, :checked) + label:before {
  border-color: #0E89E8;
  cursor: pointer;
}
.scm-contents input[type=checkbox][class*=df-]:hover:not(:disabled, :checked) + label:before svg, .scm-contents input[type=checkbox][class*=df-]:focus:not(:disabled, :checked) + label:before svg {
  display: block;
}
.scm-contents input[type=checkbox][class*=df-]:hover:not(:disabled, :checked) + label:before svg path, .scm-contents input[type=checkbox][class*=df-]:focus:not(:disabled, :checked) + label:before svg path {
  fill: #202020;
}
.scm-contents input[type=checkbox][class*=df-]:checked + label:before {
  background-color: #0E89E8;
  border-color: #0E89E8;
}
.scm-contents input[type=checkbox][class*=df-]:checked + label svg {
  display: block;
}
.scm-contents input[type=checkbox][class*=df-]:checked + label svg path {
  fill: #fff;
}
.scm-contents label[class*=df-input-cs] {
  overflow: hidden;
  border: 1px solid #C8C8C8;
  box-sizing: border-box;
  transition: 0.2s;
  border-radius: 4px;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  color: #202020;
  font-weight: 400;
  height: 40px;
  padding: 0 12px;
}
.scm-contents label[class*=df-input-cs]:hover:not(:disabled), .scm-contents label[class*=df-input-cs]:focus:not(:disabled) {
  color: #666;
  border-color: #666;
}
.scm-contents label[class*=df-input-cs] input {
  transition: 0.2s;
  caret-color: #0E89E8;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
}
.scm-contents label[class*=df-input-cs] input::placeholder {
  color: #C8C8C8;
}
.scm-contents label[class*=df-input-cs] input:read-only {
  background-color: #F2F2F2;
}
.scm-contents label[class*=df-input-cs][class*=_sm] {
  height: 32px;
  line-height: 32px;
  padding: 0 12px;
  border-radius: 8px;
}
.scm-contents label[class*=df-input-cs][class*=_lg] {
  height: 40px;
  line-height: 40px;
  padding: 0 16px;
  border-radius: 4px;
}
.scm-contents label[class*=df-input-cs][class*=_xl] {
  height: 48px;
  line-height: 48px;
  padding: 0 16px;
  border-radius: 4px;
}
.scm-contents .pager {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
  gap: 20px;
}
.scm-contents .pager .arr-cs {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
}
.scm-contents .pager ul {
  display: flex;
  gap: 8px;
  justify-content: center;
  align-items: center;
}
.scm-contents .pager button {
  box-sizing: border-box;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  border: 1px solid #C8C8C8;
  border-radius: 4px;
  width: 24px;
  height: 24px;
  color: #666;
  font-weight: 400;
  transition: 0.2s;
}
.scm-contents .pager button svg path {
  transition: 0.2s;
}
.scm-contents .pager button:disabled {
  border-color: #E8E8E8 !important;
  background-color: #f8f8f8 !important;
  cursor: initial;
}
.scm-contents .pager button:disabled svg path {
  fill: #C8C8C8;
}
.scm-contents .pager button.active:not(:disabled), .scm-contents .pager button:hover:not(:disabled), .scm-contents .pager button:focus:not(:disabled) {
  border-color: #0E89E8;
  background-color: #0E89E8;
  color: #fff;
}
.scm-contents .pager button.active:not(:disabled) svg path, .scm-contents .pager button:hover:not(:disabled) svg path, .scm-contents .pager button:focus:not(:disabled) svg path {
  fill: #fff;
}

[class*=grid] {
  display: grid;
}
[class*=grid][class*="_1/2"] {
  grid-template-columns: 1fr 1fr;
}
[class*=grid][class*="_1/3"] {
  grid-template-columns: 1fr 1fr 1fr;
}
[class*=grid][class*="_2/3"] {
  grid-template-columns: 2fr 1fr;
}
[class*=grid][class*="_3/2"] {
  grid-template-columns: 1fr 2fr;
}
[class*=grid][class*="_1/4"] {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
[class*=grid][class*="_1/5"] {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
[class*=grid][class*="_1/6"] {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
[class*=grid][class*="_1/7"] {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
[class*=grid][class*="_1/8"] {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
[class*=grid][class*=_vct] {
  align-items: center;
}

[class*=_g4] {
  gap: 4px;
}

[class*=_g12] {
  gap: 12px;
}

[class*=_g16] {
  gap: 16px;
}

[class*=_g20] {
  gap: 20px;
}

[class*=_g24] {
  gap: 24px;
}

[class*=_g48] {
  gap: 48px;
}

[class*=_gx20] {
  column-gap: 20px;
}

[class*=_gx40] {
  column-gap: 40px;
}

[class*=_gy20] {
  row-gap: 20px;
}

[class*=_gy40] {
  row-gap: 40px;
}

/* padding margin */
.pd0 {
  padding: 0;
}

.pl0 {
  padding-left: 0;
}

.pr0 {
  padding-right: 0;
}

.pt0 {
  padding-top: 0;
}

.pb0 {
  padding-bottom: 0;
}

.px0 {
  padding-left: 0;
  padding-right: 0;
}

.py0 {
  padding-top: 0;
  padding-bottom: 0;
}

.mg0 {
  margin: 0;
}

.ml0 {
  margin-left: 0;
}

.mr0 {
  margin-right: 0;
}

.mt0 {
  margin-top: 0;
}

.mb0 {
  margin-bottom: 0;
}

.mx0 {
  margin-left: 0;
  margin-right: 0;
}

.my0 {
  margin-top: 0;
  margin-bottom: 0;
}

.pd0_ipt {
  padding: 0 !important;
}

.pl0_ipt {
  padding-left: 0 !important;
}

.pr0_ipt {
  padding-right: 0 !important;
}

.pt0_ipt {
  padding-top: 0 !important;
}

.pb0_ipt {
  padding-bottom: 0 !important;
}

.px0_ipt {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.py0_ipt {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.mg0_ipt {
  margin: 0 !important;
}

.ml0_ipt {
  margin-left: 0 !important;
}

.mr0_ipt {
  margin-right: 0 !important;
}

.mt0_ipt {
  margin-top: 0 !important;
}

.mb0_ipt {
  margin-bottom: 0 !important;
}

.mx0_ipt {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.my0_ipt {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.pd2 {
  padding: 2px;
}

.pl2 {
  padding-left: 2px;
}

.pr2 {
  padding-right: 2px;
}

.pt2 {
  padding-top: 2px;
}

.pb2 {
  padding-bottom: 2px;
}

.px2 {
  padding-left: 2px;
  padding-right: 2px;
}

.py2 {
  padding-top: 2px;
  padding-bottom: 2px;
}

.mg2 {
  margin: 2px;
}

.ml2 {
  margin-left: 2px;
}

.mr2 {
  margin-right: 2px;
}

.mt2 {
  margin-top: 2px;
}

.mb2 {
  margin-bottom: 2px;
}

.mx2 {
  margin-left: 2px;
  margin-right: 2px;
}

.my2 {
  margin-top: 2px;
  margin-bottom: 2px;
}

.pd2_ipt {
  padding: 2px !important;
}

.pl2_ipt {
  padding-left: 2px !important;
}

.pr2_ipt {
  padding-right: 2px !important;
}

.pt2_ipt {
  padding-top: 2px !important;
}

.pb2_ipt {
  padding-bottom: 2px !important;
}

.px2_ipt {
  padding-left: 2px !important;
  padding-right: 2px !important;
}

.py2_ipt {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}

.mg2_ipt {
  margin: 2px !important;
}

.ml2_ipt {
  margin-left: 2px !important;
}

.mr2_ipt {
  margin-right: 2px !important;
}

.mt2_ipt {
  margin-top: 2px !important;
}

.mb2_ipt {
  margin-bottom: 2px !important;
}

.mx2_ipt {
  margin-left: 2px !important;
  margin-right: 2px !important;
}

.my2_ipt {
  margin-top: 2px !important;
  margin-bottom: 2px !important;
}

.pd4 {
  padding: 4px;
}

.pl4 {
  padding-left: 4px;
}

.pr4 {
  padding-right: 4px;
}

.pt4 {
  padding-top: 4px;
}

.pb4 {
  padding-bottom: 4px;
}

.px4 {
  padding-left: 4px;
  padding-right: 4px;
}

.py4 {
  padding-top: 4px;
  padding-bottom: 4px;
}

.mg4 {
  margin: 4px;
}

.ml4 {
  margin-left: 4px;
}

.mr4 {
  margin-right: 4px;
}

.mt4 {
  margin-top: 4px;
}

.mb4 {
  margin-bottom: 4px;
}

.mx4 {
  margin-left: 4px;
  margin-right: 4px;
}

.my4 {
  margin-top: 4px;
  margin-bottom: 4px;
}

.pd4_ipt {
  padding: 4px !important;
}

.pl4_ipt {
  padding-left: 4px !important;
}

.pr4_ipt {
  padding-right: 4px !important;
}

.pt4_ipt {
  padding-top: 4px !important;
}

.pb4_ipt {
  padding-bottom: 4px !important;
}

.px4_ipt {
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.py4_ipt {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.mg4_ipt {
  margin: 4px !important;
}

.ml4_ipt {
  margin-left: 4px !important;
}

.mr4_ipt {
  margin-right: 4px !important;
}

.mt4_ipt {
  margin-top: 4px !important;
}

.mb4_ipt {
  margin-bottom: 4px !important;
}

.mx4_ipt {
  margin-left: 4px !important;
  margin-right: 4px !important;
}

.my4_ipt {
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

.pd8 {
  padding: 8px;
}

.pl8 {
  padding-left: 8px;
}

.pr8 {
  padding-right: 8px;
}

.pt8 {
  padding-top: 8px;
}

.pb8 {
  padding-bottom: 8px;
}

.px8 {
  padding-left: 8px;
  padding-right: 8px;
}

.py8 {
  padding-top: 8px;
  padding-bottom: 8px;
}

.mg8 {
  margin: 8px;
}

.ml8 {
  margin-left: 8px;
}

.mr8 {
  margin-right: 8px;
}

.mt8 {
  margin-top: 8px;
}

.mb8 {
  margin-bottom: 8px;
}

.mx8 {
  margin-left: 8px;
  margin-right: 8px;
}

.my8 {
  margin-top: 8px;
  margin-bottom: 8px;
}

.pd8_ipt {
  padding: 8px !important;
}

.pl8_ipt {
  padding-left: 8px !important;
}

.pr8_ipt {
  padding-right: 8px !important;
}

.pt8_ipt {
  padding-top: 8px !important;
}

.pb8_ipt {
  padding-bottom: 8px !important;
}

.px8_ipt {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.py8_ipt {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.mg8_ipt {
  margin: 8px !important;
}

.ml8_ipt {
  margin-left: 8px !important;
}

.mr8_ipt {
  margin-right: 8px !important;
}

.mt8_ipt {
  margin-top: 8px !important;
}

.mb8_ipt {
  margin-bottom: 8px !important;
}

.mx8_ipt {
  margin-left: 8px !important;
  margin-right: 8px !important;
}

.my8_ipt {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

.pd12 {
  padding: 12px;
}

.pl12 {
  padding-left: 12px;
}

.pr12 {
  padding-right: 12px;
}

.pt12 {
  padding-top: 12px;
}

.pb12 {
  padding-bottom: 12px;
}

.px12 {
  padding-left: 12px;
  padding-right: 12px;
}

.py12 {
  padding-top: 12px;
  padding-bottom: 12px;
}

.mg12 {
  margin: 12px;
}

.ml12 {
  margin-left: 12px;
}

.mr12 {
  margin-right: 12px;
}

.mt12 {
  margin-top: 12px;
}

.mb12 {
  margin-bottom: 12px;
}

.mx12 {
  margin-left: 12px;
  margin-right: 12px;
}

.my12 {
  margin-top: 12px;
  margin-bottom: 12px;
}

.pd12_ipt {
  padding: 12px !important;
}

.pl12_ipt {
  padding-left: 12px !important;
}

.pr12_ipt {
  padding-right: 12px !important;
}

.pt12_ipt {
  padding-top: 12px !important;
}

.pb12_ipt {
  padding-bottom: 12px !important;
}

.px12_ipt {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

.py12_ipt {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

.mg12_ipt {
  margin: 12px !important;
}

.ml12_ipt {
  margin-left: 12px !important;
}

.mr12_ipt {
  margin-right: 12px !important;
}

.mt12_ipt {
  margin-top: 12px !important;
}

.mb12_ipt {
  margin-bottom: 12px !important;
}

.mx12_ipt {
  margin-left: 12px !important;
  margin-right: 12px !important;
}

.my12_ipt {
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}

.pd14 {
  padding: 14px;
}

.pl14 {
  padding-left: 14px;
}

.pr14 {
  padding-right: 14px;
}

.pt14 {
  padding-top: 14px;
}

.pb14 {
  padding-bottom: 14px;
}

.px14 {
  padding-left: 14px;
  padding-right: 14px;
}

.py14 {
  padding-top: 14px;
  padding-bottom: 14px;
}

.mg14 {
  margin: 14px;
}

.ml14 {
  margin-left: 14px;
}

.mr14 {
  margin-right: 14px;
}

.mt14 {
  margin-top: 14px;
}

.mb14 {
  margin-bottom: 14px;
}

.mx14 {
  margin-left: 14px;
  margin-right: 14px;
}

.my14 {
  margin-top: 14px;
  margin-bottom: 14px;
}

.pd14_ipt {
  padding: 14px !important;
}

.pl14_ipt {
  padding-left: 14px !important;
}

.pr14_ipt {
  padding-right: 14px !important;
}

.pt14_ipt {
  padding-top: 14px !important;
}

.pb14_ipt {
  padding-bottom: 14px !important;
}

.px14_ipt {
  padding-left: 14px !important;
  padding-right: 14px !important;
}

.py14_ipt {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

.mg14_ipt {
  margin: 14px !important;
}

.ml14_ipt {
  margin-left: 14px !important;
}

.mr14_ipt {
  margin-right: 14px !important;
}

.mt14_ipt {
  margin-top: 14px !important;
}

.mb14_ipt {
  margin-bottom: 14px !important;
}

.mx14_ipt {
  margin-left: 14px !important;
  margin-right: 14px !important;
}

.my14_ipt {
  margin-top: 14px !important;
  margin-bottom: 14px !important;
}

.pd16 {
  padding: 16px;
}

.pl16 {
  padding-left: 16px;
}

.pr16 {
  padding-right: 16px;
}

.pt16 {
  padding-top: 16px;
}

.pb16 {
  padding-bottom: 16px;
}

.px16 {
  padding-left: 16px;
  padding-right: 16px;
}

.py16 {
  padding-top: 16px;
  padding-bottom: 16px;
}

.mg16 {
  margin: 16px;
}

.ml16 {
  margin-left: 16px;
}

.mr16 {
  margin-right: 16px;
}

.mt16 {
  margin-top: 16px;
}

.mb16 {
  margin-bottom: 16px;
}

.mx16 {
  margin-left: 16px;
  margin-right: 16px;
}

.my16 {
  margin-top: 16px;
  margin-bottom: 16px;
}

.pd16_ipt {
  padding: 16px !important;
}

.pl16_ipt {
  padding-left: 16px !important;
}

.pr16_ipt {
  padding-right: 16px !important;
}

.pt16_ipt {
  padding-top: 16px !important;
}

.pb16_ipt {
  padding-bottom: 16px !important;
}

.px16_ipt {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.py16_ipt {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

.mg16_ipt {
  margin: 16px !important;
}

.ml16_ipt {
  margin-left: 16px !important;
}

.mr16_ipt {
  margin-right: 16px !important;
}

.mt16_ipt {
  margin-top: 16px !important;
}

.mb16_ipt {
  margin-bottom: 16px !important;
}

.mx16_ipt {
  margin-left: 16px !important;
  margin-right: 16px !important;
}

.my16_ipt {
  margin-top: 16px !important;
  margin-bottom: 16px !important;
}

.pd18 {
  padding: 18px;
}

.pl18 {
  padding-left: 18px;
}

.pr18 {
  padding-right: 18px;
}

.pt18 {
  padding-top: 18px;
}

.pb18 {
  padding-bottom: 18px;
}

.px18 {
  padding-left: 18px;
  padding-right: 18px;
}

.py18 {
  padding-top: 18px;
  padding-bottom: 18px;
}

.mg18 {
  margin: 18px;
}

.ml18 {
  margin-left: 18px;
}

.mr18 {
  margin-right: 18px;
}

.mt18 {
  margin-top: 18px;
}

.mb18 {
  margin-bottom: 18px;
}

.mx18 {
  margin-left: 18px;
  margin-right: 18px;
}

.my18 {
  margin-top: 18px;
  margin-bottom: 18px;
}

.pd18_ipt {
  padding: 18px !important;
}

.pl18_ipt {
  padding-left: 18px !important;
}

.pr18_ipt {
  padding-right: 18px !important;
}

.pt18_ipt {
  padding-top: 18px !important;
}

.pb18_ipt {
  padding-bottom: 18px !important;
}

.px18_ipt {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

.py18_ipt {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

.mg18_ipt {
  margin: 18px !important;
}

.ml18_ipt {
  margin-left: 18px !important;
}

.mr18_ipt {
  margin-right: 18px !important;
}

.mt18_ipt {
  margin-top: 18px !important;
}

.mb18_ipt {
  margin-bottom: 18px !important;
}

.mx18_ipt {
  margin-left: 18px !important;
  margin-right: 18px !important;
}

.my18_ipt {
  margin-top: 18px !important;
  margin-bottom: 18px !important;
}

.pd20 {
  padding: 20px;
}

.pl20 {
  padding-left: 20px;
}

.pr20 {
  padding-right: 20px;
}

.pt20 {
  padding-top: 20px;
}

.pb20 {
  padding-bottom: 20px;
}

.px20 {
  padding-left: 20px;
  padding-right: 20px;
}

.py20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.mg20 {
  margin: 20px;
}

.ml20 {
  margin-left: 20px;
}

.mr20 {
  margin-right: 20px;
}

.mt20 {
  margin-top: 20px;
}

.mb20 {
  margin-bottom: 20px;
}

.mx20 {
  margin-left: 20px;
  margin-right: 20px;
}

.my20 {
  margin-top: 20px;
  margin-bottom: 20px;
}

.pd20_ipt {
  padding: 20px !important;
}

.pl20_ipt {
  padding-left: 20px !important;
}

.pr20_ipt {
  padding-right: 20px !important;
}

.pt20_ipt {
  padding-top: 20px !important;
}

.pb20_ipt {
  padding-bottom: 20px !important;
}

.px20_ipt {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.py20_ipt {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.mg20_ipt {
  margin: 20px !important;
}

.ml20_ipt {
  margin-left: 20px !important;
}

.mr20_ipt {
  margin-right: 20px !important;
}

.mt20_ipt {
  margin-top: 20px !important;
}

.mb20_ipt {
  margin-bottom: 20px !important;
}

.mx20_ipt {
  margin-left: 20px !important;
  margin-right: 20px !important;
}

.my20_ipt {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.pd24 {
  padding: 24px;
}

.pl24 {
  padding-left: 24px;
}

.pr24 {
  padding-right: 24px;
}

.pt24 {
  padding-top: 24px;
}

.pb24 {
  padding-bottom: 24px;
}

.px24 {
  padding-left: 24px;
  padding-right: 24px;
}

.py24 {
  padding-top: 24px;
  padding-bottom: 24px;
}

.mg24 {
  margin: 24px;
}

.ml24 {
  margin-left: 24px;
}

.mr24 {
  margin-right: 24px;
}

.mt24 {
  margin-top: 24px;
}

.mb24 {
  margin-bottom: 24px;
}

.mx24 {
  margin-left: 24px;
  margin-right: 24px;
}

.my24 {
  margin-top: 24px;
  margin-bottom: 24px;
}

.pd24_ipt {
  padding: 24px !important;
}

.pl24_ipt {
  padding-left: 24px !important;
}

.pr24_ipt {
  padding-right: 24px !important;
}

.pt24_ipt {
  padding-top: 24px !important;
}

.pb24_ipt {
  padding-bottom: 24px !important;
}

.px24_ipt {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

.py24_ipt {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

.mg24_ipt {
  margin: 24px !important;
}

.ml24_ipt {
  margin-left: 24px !important;
}

.mr24_ipt {
  margin-right: 24px !important;
}

.mt24_ipt {
  margin-top: 24px !important;
}

.mb24_ipt {
  margin-bottom: 24px !important;
}

.mx24_ipt {
  margin-left: 24px !important;
  margin-right: 24px !important;
}

.my24_ipt {
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

.pd32 {
  padding: 32px;
}

.pl32 {
  padding-left: 32px;
}

.pr32 {
  padding-right: 32px;
}

.pt32 {
  padding-top: 32px;
}

.pb32 {
  padding-bottom: 32px;
}

.px32 {
  padding-left: 32px;
  padding-right: 32px;
}

.py32 {
  padding-top: 32px;
  padding-bottom: 32px;
}

.mg32 {
  margin: 32px;
}

.ml32 {
  margin-left: 32px;
}

.mr32 {
  margin-right: 32px;
}

.mt32 {
  margin-top: 32px;
}

.mb32 {
  margin-bottom: 32px;
}

.mx32 {
  margin-left: 32px;
  margin-right: 32px;
}

.my32 {
  margin-top: 32px;
  margin-bottom: 32px;
}

.pd32_ipt {
  padding: 32px !important;
}

.pl32_ipt {
  padding-left: 32px !important;
}

.pr32_ipt {
  padding-right: 32px !important;
}

.pt32_ipt {
  padding-top: 32px !important;
}

.pb32_ipt {
  padding-bottom: 32px !important;
}

.px32_ipt {
  padding-left: 32px !important;
  padding-right: 32px !important;
}

.py32_ipt {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

.mg32_ipt {
  margin: 32px !important;
}

.ml32_ipt {
  margin-left: 32px !important;
}

.mr32_ipt {
  margin-right: 32px !important;
}

.mt32_ipt {
  margin-top: 32px !important;
}

.mb32_ipt {
  margin-bottom: 32px !important;
}

.mx32_ipt {
  margin-left: 32px !important;
  margin-right: 32px !important;
}

.my32_ipt {
  margin-top: 32px !important;
  margin-bottom: 32px !important;
}

.pd40 {
  padding: 40px;
}

.pl40 {
  padding-left: 40px;
}

.pr40 {
  padding-right: 40px;
}

.pt40 {
  padding-top: 40px;
}

.pb40 {
  padding-bottom: 40px;
}

.px40 {
  padding-left: 40px;
  padding-right: 40px;
}

.py40 {
  padding-top: 40px;
  padding-bottom: 40px;
}

.mg40 {
  margin: 40px;
}

.ml40 {
  margin-left: 40px;
}

.mr40 {
  margin-right: 40px;
}

.mt40 {
  margin-top: 40px;
}

.mb40 {
  margin-bottom: 40px;
}

.mx40 {
  margin-left: 40px;
  margin-right: 40px;
}

.my40 {
  margin-top: 40px;
  margin-bottom: 40px;
}

.pd40_ipt {
  padding: 40px !important;
}

.pl40_ipt {
  padding-left: 40px !important;
}

.pr40_ipt {
  padding-right: 40px !important;
}

.pt40_ipt {
  padding-top: 40px !important;
}

.pb40_ipt {
  padding-bottom: 40px !important;
}

.px40_ipt {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

.py40_ipt {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.mg40_ipt {
  margin: 40px !important;
}

.ml40_ipt {
  margin-left: 40px !important;
}

.mr40_ipt {
  margin-right: 40px !important;
}

.mt40_ipt {
  margin-top: 40px !important;
}

.mb40_ipt {
  margin-bottom: 40px !important;
}

.mx40_ipt {
  margin-left: 40px !important;
  margin-right: 40px !important;
}

.my40_ipt {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}

.pd48 {
  padding: 48px;
}

.pl48 {
  padding-left: 48px;
}

.pr48 {
  padding-right: 48px;
}

.pt48 {
  padding-top: 48px;
}

.pb48 {
  padding-bottom: 48px;
}

.px48 {
  padding-left: 48px;
  padding-right: 48px;
}

.py48 {
  padding-top: 48px;
  padding-bottom: 48px;
}

.mg48 {
  margin: 48px;
}

.ml48 {
  margin-left: 48px;
}

.mr48 {
  margin-right: 48px;
}

.mt48 {
  margin-top: 48px;
}

.mb48 {
  margin-bottom: 48px;
}

.mx48 {
  margin-left: 48px;
  margin-right: 48px;
}

.my48 {
  margin-top: 48px;
  margin-bottom: 48px;
}

.pd48_ipt {
  padding: 48px !important;
}

.pl48_ipt {
  padding-left: 48px !important;
}

.pr48_ipt {
  padding-right: 48px !important;
}

.pt48_ipt {
  padding-top: 48px !important;
}

.pb48_ipt {
  padding-bottom: 48px !important;
}

.px48_ipt {
  padding-left: 48px !important;
  padding-right: 48px !important;
}

.py48_ipt {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

.mg48_ipt {
  margin: 48px !important;
}

.ml48_ipt {
  margin-left: 48px !important;
}

.mr48_ipt {
  margin-right: 48px !important;
}

.mt48_ipt {
  margin-top: 48px !important;
}

.mb48_ipt {
  margin-bottom: 48px !important;
}

.mx48_ipt {
  margin-left: 48px !important;
  margin-right: 48px !important;
}

.my48_ipt {
  margin-top: 48px !important;
  margin-bottom: 48px !important;
}

.pd56 {
  padding: 56px;
}

.pl56 {
  padding-left: 56px;
}

.pr56 {
  padding-right: 56px;
}

.pt56 {
  padding-top: 56px;
}

.pb56 {
  padding-bottom: 56px;
}

.px56 {
  padding-left: 56px;
  padding-right: 56px;
}

.py56 {
  padding-top: 56px;
  padding-bottom: 56px;
}

.mg56 {
  margin: 56px;
}

.ml56 {
  margin-left: 56px;
}

.mr56 {
  margin-right: 56px;
}

.mt56 {
  margin-top: 56px;
}

.mb56 {
  margin-bottom: 56px;
}

.mx56 {
  margin-left: 56px;
  margin-right: 56px;
}

.my56 {
  margin-top: 56px;
  margin-bottom: 56px;
}

.pd56_ipt {
  padding: 56px !important;
}

.pl56_ipt {
  padding-left: 56px !important;
}

.pr56_ipt {
  padding-right: 56px !important;
}

.pt56_ipt {
  padding-top: 56px !important;
}

.pb56_ipt {
  padding-bottom: 56px !important;
}

.px56_ipt {
  padding-left: 56px !important;
  padding-right: 56px !important;
}

.py56_ipt {
  padding-top: 56px !important;
  padding-bottom: 56px !important;
}

.mg56_ipt {
  margin: 56px !important;
}

.ml56_ipt {
  margin-left: 56px !important;
}

.mr56_ipt {
  margin-right: 56px !important;
}

.mt56_ipt {
  margin-top: 56px !important;
}

.mb56_ipt {
  margin-bottom: 56px !important;
}

.mx56_ipt {
  margin-left: 56px !important;
  margin-right: 56px !important;
}

.my56_ipt {
  margin-top: 56px !important;
  margin-bottom: 56px !important;
}

.mg-auto {
  margin: auto;
}

/* colorList */
.blue50 {
  color: #F7F8FC;
}

.bg-blue50 {
  background-color: #F7F8FC;
}

.blue300 {
  color: #D9DFEB;
}

.bg-blue300 {
  background-color: #D9DFEB;
}

.blue500 {
  color: #0E89E8;
}

.bg-blue500 {
  background-color: #0E89E8;
}

.blue600 {
  color: #007AFF;
}

.bg-blue600 {
  background-color: #007AFF;
}

.gray50 {
  color: #f8f8f8;
}

.bg-gray50 {
  background-color: #f8f8f8;
}

.gray100 {
  color: #E8E8E8;
}

.bg-gray100 {
  background-color: #E8E8E8;
}

.gray200 {
  color: #E8E8E8;
}

.bg-gray200 {
  background-color: #E8E8E8;
}

.gray300 {
  color: #C8C8C8;
}

.bg-gray300 {
  background-color: #C8C8C8;
}

.gray400 {
  color: #C8C8C8;
}

.bg-gray400 {
  background-color: #C8C8C8;
}

.gray500 {
  color: #999;
}

.bg-gray500 {
  background-color: #999;
}

.gray600 {
  color: #666;
}

.bg-gray600 {
  background-color: #666;
}

.gray700 {
  color: #333;
}

.bg-gray700 {
  background-color: #333;
}

.gray800 {
  color: #202020;
}

.bg-gray800 {
  background-color: #202020;
}

.gray900 {
  color: #101010;
}

.bg-gray900 {
  background-color: #101010;
}

.bg-white {
  background: #fff;
}

[class*=hv-] {
  transition: color 0.2s;
}
[class*=hv-][class*=hv-blue50]:hover {
  color: #F7F8FC;
}
[class*=hv-][class*=hv-blue300]:hover {
  color: #D9DFEB;
}
[class*=hv-][class*=hv-blue500]:hover {
  color: #0E89E8;
}
[class*=hv-][class*=hv-blue600]:hover {
  color: #007AFF;
}
[class*=hv-][class*=hv-gray50]:hover {
  color: #f8f8f8;
}
[class*=hv-][class*=hv-gray100]:hover {
  color: #E8E8E8;
}
[class*=hv-][class*=hv-gray200]:hover {
  color: #E8E8E8;
}
[class*=hv-][class*=hv-gray300]:hover {
  color: #C8C8C8;
}
[class*=hv-][class*=hv-gray400]:hover {
  color: #C8C8C8;
}
[class*=hv-][class*=hv-gray500]:hover {
  color: #999;
}
[class*=hv-][class*=hv-gray600]:hover {
  color: #666;
}
[class*=hv-][class*=hv-gray700]:hover {
  color: #333;
}
[class*=hv-][class*=hv-gray800]:hover {
  color: #202020;
}
[class*=hv-][class*=hv-gray900]:hover {
  color: #101010;
}

[class*=t12] {
  font-size: 12px;
}
[class*=t12][class*=-line] {
  line-height: 18px;
  height: 18px;
}

[class*=t14] {
  font-size: 14px;
}
[class*=t14][class*=-line] {
  line-height: 20px;
  height: 20px;
}

[class*=t16] {
  font-size: 16px;
}
[class*=t16][class*=-line] {
  line-height: 24px;
  height: 24px;
}

[class*=t18] {
  font-size: 18px;
}
[class*=t18][class*=-line] {
  line-height: 24px;
  height: 24px;
}

[class*=t20] {
  font-size: 20px;
}
[class*=t20][class*=-line] {
  line-height: 32px;
  height: 32px;
}

[class*=t24] {
  font-size: 24px;
}
[class*=t24][class*=-line] {
  line-height: 40px;
  height: 40px;
}

[class*=elps] {
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
[class*=elps][class*="2"] {
  -webkit-line-clamp: 2;
}
[class*=elps][class*="3"] {
  -webkit-line-clamp: 3;
}

.fx1 {
  flex: 1;
}

.left {
  text-align: left;
}

.bd_card {
  border-radius: 8px;
  border: 1px solid #C8C8C8;
  box-sizing: border-box;
}

.round-table-cs {
  border-radius: 4px;
  border: 1px solid #E8E8E8;
  overflow: hidden;
}
.round-table-cs th, .round-table-cs td {
  padding: 0 12px;
  font-size: 14px;
  color: #202020;
  height: 64px;
  border: 1px solid #E8E8E8;
}
.round-table-cs th:first-child, .round-table-cs td:first-child {
  border-left: none;
}
.round-table-cs th:last-child, .round-table-cs td:last-child {
  border-right: none;
}
.round-table-cs th {
  background: #F7F8FC;
}
.round-table-cs thead tr th {
  border-bottom: 1px solid #E8E8E8;
}
.round-table-cs thead tr:first-child th {
  border-top: none;
}
.round-table-cs tbody tr:first-child th, .round-table-cs tbody tr:first-child td {
  border-top: none;
}
.round-table-cs tbody tr:last-child th, .round-table-cs tbody tr:last-child td {
  border-bottom: none;
}

.scm-side .logo-cs .logo {
  vertical-align: middle;
}
.scm-side nav.scm-menu > ul > li > a {
  position: relative;
  height: 60px;
  width: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #333;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  transition: 0.2s;
}
.scm-side nav.scm-menu > ul > li > a:before {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  margin: auto;
  background: #000;
  width: 0;
  height: 2px;
  transition: 0.2s;
}
.scm-side nav.scm-menu > ul > li > a.active, .scm-side nav.scm-menu > ul > li > a:hover {
  color: #0E89E8;
  font-weight: 700;
}
.scm-side nav.scm-menu > ul > li > a.active:before, .scm-side nav.scm-menu > ul > li > a:hover:before {
  width: 100%;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav {
  display: none;
  position: absolute;
  top: 60px;
  width: auto;
  background: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
  /*left:256px;*/
  border-top: 1px solid #E8E8E8;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area {
  text-align: left;
  /*margin:12px 0 12px 256px;*/
  margin: 12px 0;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs {
  display: flex;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs > li {
  border-left: 1px solid #E8E8E8;
  padding: 0 4px;
  display: none;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs > li.on {
  display: block;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs > li:first-child {
  border-left: none;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs > li ul > li {
  margin: 0 12px 0 20px;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs > li ul > li > a {
  width: calc(100% - 36px);
  padding-right: 36px;
  height: 40px;
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
  color: #333;
  position: relative;
  transition: 0.2s;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs > li ul > li > a.de-active {
  color: #C8C8C8;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs > li ul > li > a:after {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs > li ul > li > a:not(.de-active):hover {
  font-weight: 700;
  color: #0E89E8;
}
.scm-side nav.scm-menu > ul > li > a + .full-nav .in_nav-area .depth-cs > li ul > li > a:not(.de-active):hover:after {
  background: url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/Hproject/icon/icon_chevron-right-blue.svg) center no-repeat;
}
.scm-side .user-nav {
  display: flex;
  align-items: center;
}
.scm-side .user-nav li {
  padding: 0 12px;
}
.scm-side .user-nav li .search-cs {
  border: 1px solid #666;
  border-radius: 8px;
  height: 40px;
  padding: 0 12px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.scm-side .user-nav li .search-cs input::placeholder {
  color: #C8C8C8;
}
.scm-side .user-nav li .search-cs button svg {
  vertical-align: text-bottom;
}
.scm-side .user-nav li .search-cs button svg path {
  transition: 0.2s;
}
.scm-side .user-nav li .search-cs button:hover svg path {
  fill: #666;
}
.scm-side .user-nav > li a.icon-btn {
  position: relative;
}
.scm-side .user-nav > li a.icon-btn svg path {
  transition: 0.2s;
}
.scm-side .user-nav > li a.icon-btn .cart-count {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  overflow: hidden;
  border-radius: 50%;
  background: #F00505;
  font-size: 12px;
  color: #fff;
  position: absolute;
  left: 0px;
  bottom: 0px;
}
.scm-side .user-nav > li a.icon-btn:hover svg path {
  fill: #666;
}

/* renewal 240813 */
.bg-gray {
  background: #F2F2F2;
}

.card-hd {
  padding: 40px 24px;
}
.card-hd .hd_head {
  border-bottom: 2px solid #333;
  padding: 0 0 12px 8px;
}
.card-hd .hd_head h6 {
  font-size: 18px;
  font-weight: 700;
}
.card-hd .hd_head h6 span.blue {
  color: #0E89E8;
}
.card-hd .hd_body {
  padding: 24px 0 0 0;
}

.page_title_cs {
  /*border-bottom: 1px solid $blue300;*/
  box-sizing: border-box;
}
.page_title_cs .page_title {
  padding-top: 30px;
  display: grid;
}
.page_title_cs .page_title .bread-crumds {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.page_title_cs .page_title .bread-crumds li {
  position: relative;
  color: #999;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  height: 18px;
}
.page_title_cs .page_title .bread-crumds li:after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  vertical-align: middle;
  background: url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/Hproject/icon/icon_arrow-right.svg) center/cover no-repeat;
}
.page_title_cs .page_title .bread-crumds li.on {
  color: #202020;
}
.page_title_cs .page_title .bread-crumds li.on:after {
  display: none;
}
.page_title_cs .page_title h3 {
  color: #202020;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
  margin-bottom: 24px;
}
.page_title_cs .page_title .mro-menu {
  display: flex;
  align-items: center;
  gap: 24px;
}
.page_title_cs .page_title .mro-menu li a {
  position: relative;
  height: 48px;
  box-sizing: border-box;
  padding: 0 8px;
  display: inline-flex;
  align-items: center;
  color: #666;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  transition: 0.2s;
}
.page_title_cs .page_title .mro-menu li a:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 0%;
  height: 3px;
  background: #101010;
  transition: 0.2s;
}
.page_title_cs .page_title .mro-menu li a:hover, .page_title_cs .page_title .mro-menu li a.on {
  color: #101010;
  font-weight: 700;
}
.page_title_cs .page_title .mro-menu li a:hover:after, .page_title_cs .page_title .mro-menu li a.on:after {
  width: 100%;
}

.product-home {
  padding: 32px 0 80px;
  display: grid;
  gap: 24px;
}
.product-home aside {
  border-radius: 8px;
  border: 1px solid #C8C8C8;
  background: #fff;
  width: 178px;
  box-sizing: border-box;
  padding: 16px 0 0;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  position: relative;
  z-index: 2;
}
.product-home aside > ul {
  padding: 2px 0;
  min-height: 364px;
}
.product-home aside > ul li {
  height: 40px;
  display: flex;
  align-items: center;
}
.product-home aside > ul li a {
  display: flex;
  align-items: center;
  color: #666;
  font-size: 16px;
  font-weight: 400;
  width: 100%;
  position: relative;
  height: 100%;
  padding: 0 20px;
  transition: 0.2s;
}
.product-home aside > ul li a:after {
  content: "";
  position: absolute;
  right: 8px;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  display: none;
}
.product-home aside > ul li:hover > a {
  color: #202020;
  font-weight: 500;
}
.product-home aside > ul li:hover > a:after {
  display: inline-block;
  background: url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/Hproject/icon/icon_chevron-right-gray800.svg) center no-repeat;
}
.product-home aside > ul li .src {
  display: none;
  width: 178px;
  position: absolute;
  left: 176px;
  top: -1px;
  padding: 16px 0;
  background: #fff;
  box-sizing: border-box;
  height: calc(100% + 2px);
  border: 1px solid #C8C8C8;
  border-radius: 8px;
}
.product-home aside > ul li .src > ul {
  width: calc(100% + 2px);
  height: 100%;
  overflow-y: auto;
  overscroll-behavior: none;
}
.product-home aside > ul li .src > ul::-webkit-scrollbar {
  width: 3px;
}
.product-home aside > ul li .src > ul::-webkit-scrollbar-track {
  background-color: transparent;
  padding-right: 8px;
}
.product-home aside > ul li .src > ul::-webkit-scrollbar-thumb {
  background: #333;
  border-radius: 6px;
}
.product-home aside > ul li .src > ul::-webkit-scrollbar-thumb:hover {
  pointer-events: none;
}
.product-home aside > ul li .src > ul::-webkit-scrollbar-button {
  display: none;
}
.product-home aside > ul li.depth1:hover > .src, .product-home aside > ul li.depth2:hover > .src {
  display: block;
}
.product-home aside > ul > li > a.on {
  color: #0E89E8;
  font-weight: 700;
  background: #F7F8FC;
}
.product-home aside > ul > li > a.on:after {
  display: inline-block;
  background: url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/Hproject/icon/icon_chevron-right-blue.svg) center no-repeat;
}
.product-home aside .bot .meneal-down-btn {
  display: flex;
  width: calc(100% - 24px);
  height: 32px;
  justify-content: center;
  align-items: center;
  color: #666;
  text-align: center;
  font-size: 12px;
  font-weight: 400;
  border-radius: 6px;
  border: 1px solid #C8C8C8;
  background: #fff;
  gap: 2px;
  margin: 0 12px;
}
.product-home aside .bot .main-page-cs {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 12px;
  border-top: 1px solid #E8E8E8;
  padding: 15px 20px;
}
.product-home aside .bot .main-page-cs > li .pager-num {
  color: #202020;
  font-size: 12px;
  font-weight: 700;
}
.product-home aside .bot .main-page-cs > li .pager-num span {
  color: #0E89E8;
}
.product-home aside .bot .main-page-cs > li button {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #D9D9D9;
  vertical-align: middle;
  transition: 0.2s;
}
.product-home aside .bot .main-page-cs > li button svg path {
  transition: 0.2s;
}
.product-home aside .bot .main-page-cs > li button.unactive {
  border-color: #fff;
}
.product-home aside .bot .main-page-cs > li button.unactive svg path {
  fill: #fff;
}
.product-home aside .bot .main-page-cs > li button:hover {
  border-color: #333;
}
.product-home aside .bot .main-page-cs > li button:hover svg path {
  fill: #333;
}

.budget-cs li .bd_card {
  padding: 20px 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 80px;
}
.budget-cs li .bd_card .name {
  color: #101010;
  font-size: 16px;
  font-weight: 400;
}
.budget-cs li .bd_card .price {
  display: flex;
  align-items: center;
  gap: 2px;
}
.budget-cs li .bd_card .price span {
  color: #999;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}
.budget-cs li .bd_card .price span.red {
  color: #F00505;
}
.budget-cs li .bd_card .price span.blue {
  color: #0E89E8;
}

.mro-sub-container {
  padding: 32px 0 80px;
}

.scm-search-area {
  background: url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/Hproject/banners/search-ct-bg.jpg) center/cover no-repeat;
  height: 340px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.scm-search-area h2 {
  color: #fff;
  text-shadow: 0 1px 4px rgba(0, 37, 72, 0.58);
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -1.28px;
  margin-bottom: 20px;
  line-height: 32px;
}
.scm-search-area .search-box {
  border-radius: 16px;
  border: 2px solid #101010;
  background: #fff;
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  height: 64px;
  padding: 0 24px;
}
.scm-search-area .search-box input {
  color: #333;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}
.scm-search-area .search-box input::placeholder {
  color: #C8C8C8;
}
.scm-search-area .search-box button svg {
  vertical-align: middle;
}
.scm-search-area .search-box button svg path {
  transition: 0.2s;
}
.scm-search-area .search-box button:hover svg path {
  fill: #333;
}

.my-workflow .hd_cmt {
  color: #999;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.circle-chart-cs .tit {
  margin: 24px 0 16px;
  color: #101010;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.circle-chart-cs li.ac-scc {
  border: 1px solid #32AB8C;
  border-radius: 16px;
  background: rgba(235, 245, 245, 0.6);
  margin-left: 16px;
}
.circle-chart-cs li.ac-scc .circle-chart {
  padding: 0 16px;
}
.circle-chart-cs li.ac-scc .circle-chart:hover .data-txt div span b:hover {
  color: #32AB8C;
}
.circle-chart-cs .circle-chart {
  /*padding-left:16px;
  padding-right:16px;*/
  position: relative;
}
.circle-chart-cs .circle-chart canvas {
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 50%;
}
.circle-chart-cs .circle-chart .data-txt {
  position: absolute;
  top: 49%;
  left: 50%;
  color: #666;
  font-size: 14px;
  transform: translate(-50%, -50%);
  height: 146px;
  width: 146px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  border-radius: 50%;
  background: #f8f8f8;
}
.circle-chart-cs .circle-chart .data-txt > h6 {
  color: #666;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 8px;
  transition: 0.2s;
}
.circle-chart-cs .circle-chart .data-txt > div {
  min-width: 65px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: 0.2s;
}
.circle-chart-cs .circle-chart .data-txt > div > span {
  display: flex;
  gap: 1px;
  align-items: center;
  transition: 0.2s;
}
.circle-chart-cs .circle-chart .data-txt > div > span b {
  transition: 0.2s;
}
.circle-chart-cs .circle-chart:hover .data-txt h6 {
  color: #000;
  font-size: 36px;
}
.circle-chart-cs .circle-chart:hover .data-txt div span b {
  color: #000;
}
.circle-chart-cs .circle-chart:hover .data-txt div span b:hover {
  color: #0E89E8;
  text-decoration: underline;
}
.circle-chart-cs.six li .circle-chart {
  width: 160px;
  margin-bottom: 24px;
}
.circle-chart-cs.six li .circle-chart .data-txt {
  width: 125px;
  height: 125px;
}

.my-service-cs li {
  margin: 24px 20px 0;
  padding-bottom: 64px;
  position: relative;
  transition: 0.5s;
  filter: grayscale(1);
}
.my-service-cs li .icon-box {
  background: #F4FAFF;
  border-radius: 50%;
  width: 104px;
  height: 104px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.my-service-cs li a {
  cursor: pointer;
  pointer-events: none;
}
.my-service-cs li.ld-ui {
  filter: grayscale(0);
}
.my-service-cs li.ld-ui a {
  cursor: pointer;
}
.my-service-cs li.adm-ui {
  filter: grayscale(0);
}
.my-service-cs li.adm-ui:hover {
  margin: 0 20px;
}
.my-service-cs li.ld-ui a, .my-service-cs li.adm-ui a {
  pointer-events: initial;
}
.my-service-cs li p {
  color: #666;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  transition: 0.5s;
}
.my-service-cs li .btn-cs {
  position: absolute;
  bottom: 30px;
  width: 100%;
  opacity: 0;
  transition: 0.5s;
}
.my-service-cs li.adm-ui:hover .btn-cs {
  bottom: 5px;
  opacity: 1;
}
.my-service-cs li:hover p {
  color: #101010;
}

.more_link {
  color: #999;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  display: inline-flex;
  align-items: center;
  transition: 0.2s;
}
.more_link svg {
  vertical-align: middle;
}
.more_link svg path {
  transition: 0.2s;
  fill: #999;
}
.more_link:hover {
  color: #101010;
  text-decoration: underline;
}
.more_link:hover svg path {
  fill: #101010;
}

.pcs-rqst-cs li {
  border-radius: 12px;
  border: 1px solid #E8E8E8;
  background: #fff;
  text-align: left;
  transition: 0.2s;
}
.pcs-rqst-cs li:hover {
  border-color: #202020;
}
.pcs-rqst-cs li:hover a p {
  font-weight: 500;
}
.pcs-rqst-cs li a {
  padding: 24px;
  display: grid;
  gap: 8px;
}
.pcs-rqst-cs li a .tag {
  color: #666;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}
.pcs-rqst-cs li a .tag.red {
  color: #F00505;
}
.pcs-rqst-cs li a .tag.blue {
  color: #0E89E8;
}
.pcs-rqst-cs li a p {
  color: #333;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  height: 40px;
  transition: 0.2s;
}
.pcs-rqst-cs li a span {
  color: #999;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.board-list-cs li {
  border-bottom: 1px solid #E8E8E8;
  padding: 8px 2px 12px 4px;
}
.board-list-cs li:first-child {
  padding-top: 0;
}
.board-list-cs li:last-child {
  border-bottom: 0;
}
.board-list-cs li a {
  height: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.board-list-cs li a span.day {
  flex-shrink: 0;
}

.board-notice li a p {
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  color: #666;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  transition: 0.2s;
}
.board-notice li a span {
  color: #999;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}
.board-notice li a:hover p {
  color: #000;
  text-decoration: underline;
}

.board-inquiry li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.board-inquiry li a .name {
  display: flex;
  align-items: center;
  gap: 8px;
}
.board-inquiry li a .name span.tag {
  border-radius: 4px;
  background: #999;
  color: #fff;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}
.board-inquiry li a .name span.tag.blue {
  background: #0E89E8;
}
.board-inquiry li a .name p {
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  color: #666;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}
.board-inquiry li a:hover .name p {
  text-decoration: underline;
  color: #000;
}
.board-inquiry li a .day {
  color: #999;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.product-list-cs li {
  transition: 0.2s;
  box-sizing: border-box;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid transparent;
  position: relative;
}
.product-list-cs li.out:before, .product-list-cs li.stop:before {
  content: "";
  position: absolute;
  background: rgba(255, 255, 255, 0.8) url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/static/images/mro/sub/soldOutImg.png) center/75% no-repeat;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.product-list-cs li:not(.out):hover, .product-list-cs li:not(.stop):hover {
  border-color: #E8E8E8;
}
.product-list-cs li .thm {
  height: 173px;
  background: #E8E8E8 url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/static/images/mro/sub/noImg.jpg) center/100% no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  overflow: hidden;
}
.product-list-cs li .thm img {
  max-width: 100%;
  height: auto;
}
.product-list-cs li .info {
  padding: 16px;
}
.product-list-cs li .info .code {
  color: #999;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
  margin-bottom: 4px;
}
.product-list-cs li .info p {
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  margin-bottom: 12px;
  height: 40px;
}
.product-list-cs li .info .price-cs .sale {
  color: #000;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin-bottom: 4px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.product-list-cs li .info .pct {
  color: #F00505;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.product-list-cs li .info .cc {
  color: #C8C8C8;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: line-through;
}

.cstm-service-cs {
  padding: 0 20px;
}
.cstm-service-cs li {
  display: flex;
  align-items: center;
  gap: 16px;
}
.cstm-service-cs li img {
  width: 64px;
}
.cstm-service-cs li .txt-cs .name {
  margin-bottom: 7px;
  color: #16181B;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}
.cstm-service-cs li .txt-cs p {
  color: #999;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.notice-view-cs {
  background: #fff;
  padding: 40px;
  border-radius: 8px;
}
.notice-view-cs .notice_hd {
  padding: 16px 24px;
  display: grid;
  gap: 4px;
  border-bottom: 2px solid #101010;
}
.notice-view-cs .notice_hd h6 {
  color: #101010;
  font-size: 20px;
  font-weight: 700;
  line-height: 32px;
}
.notice-view-cs .notice_hd p {
  color: #666;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}
.notice-view-cs .notice_bd {
  padding: 40px 24px;
}
.notice-view-cs .notice_bd .board-txt {
  background: #f8f8f8;
  padding: 18px;
  min-height: 150px;
}
.notice-view-cs .notice_ft th {
  padding: 24px 22px;
  color: #202020;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  width: 144px;
  vertical-align: top;
  text-align: left;
}
.notice-view-cs .notice_ft td .files {
  padding: 18px 24px;
  display: grid;
  gap: 12px;
}
.notice-view-cs .notice_ft td .files li {
  line-height: 20px;
}
.notice-view-cs .notice_ft td .files li button {
  color: #0E89E8;
  font-size: 14px;
  font-weight: 400;
  text-decoration-line: underline;
}

.pcs-noti-cs {
  padding: 20px 40px;
  background: #fff;
  border-radius: 8px;
  display: grid;
  gap: 32px;
  border: 1px solid #E8E8E8;
  margin: 32px 0 0;
}
.pcs-noti-cs h6 {
  color: #101010;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  padding: 12px 0;
}
.pcs-noti-cs p {
  color: #666;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.35;
}

.category-prdt-list li {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
}

.category-prdt-list li .btn-cs {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(33, 33, 33, 0.8);
  align-items: flex-end;
  opacity: 0;
  transition: 0.2s;
}

.category-prdt-list li:hover .btn-cs {
  display: flex;
  opacity: 1;
}

.scm-contents .ai-search-cs {
  margin-top: 32px;
}
.scm-contents .ai-search-cs .head-searc-option {
  border-bottom: 1px solid #333;
  margin-bottom: 32px;
}
.scm-contents .ai-search-cs .head-tit {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 12px;
}
.scm-contents .ai-search-cs .head-tit img {
  width: 100px;
}
.scm-contents .ai-search-cs .head-tit h4 {
  color: #202020;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}
.scm-contents .ai-search-cs .head-tit h4 span.blue {
  color: #0E89E8;
}
.scm-contents .ai-search-cs .ai-list-cs {
  padding: 40px 24px;
  border: 1px solid #D4DBE8;
  box-sizing: border-box;
  background: #fff;
  border-radius: 16px;
  margin-bottom: 32px;
}
.scm-contents .ai-search-cs .ai-list-cs .list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  gap: 20px;
  margin-bottom: 40px;
}
.scm-contents .ai-search-cs .ai-list-cs .list li {
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid #fff;
  box-sizing: border-box;
  background: #fff;
  transition: 0.2s;
  position: relative;
}
.scm-contents .ai-search-cs .ai-list-cs .list li.out:before, .scm-contents .ai-search-cs .ai-list-cs .list li.stop:before {
  content: "";
  position: absolute;
  background: rgba(255, 255, 255, 0.8) url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/static/images/mro/sub/soldOutImg.png) center/75% no-repeat;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.scm-contents .ai-search-cs .ai-list-cs .list li:not(.out):hover, .scm-contents .ai-search-cs .ai-list-cs .list li:not(.stop):hover {
  border-color: #E8E8E8;
}
.scm-contents .ai-search-cs .ai-list-cs .list li .thm {
  height: 212px;
  background: #E8E8E8 url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/static/images/mro/sub/noImg.jpg) center/100% no-repeat;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
.scm-contents .ai-search-cs .ai-list-cs .list li .thm img {
  transform: scale(1.01);
}
.scm-contents .ai-search-cs .ai-list-cs .list li .info {
  padding: 16px;
  display: grid;
  gap: 12px;
}
.scm-contents .ai-search-cs .ai-list-cs .list li .info .code {
  color: #999;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
}
.scm-contents .ai-search-cs .ai-list-cs .list li .info .name {
  color: #333;
  text-overflow: ellipsis;
  font-size: 14px;
  height: 40px;
  font-weight: 400;
  line-height: 20px;
  display: box;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.scm-contents .ai-search-cs .ai-list-cs .list li .info .price {
  color: #000;
  font-size: 18px;
  font-weight: 500;
}
.scm-contents .ai-search-cs .ai-list-cs .list li .info .price-info {
  display: flex;
  align-items: center;
  gap: 4px;
}
.scm-contents .ai-search-cs .ai-list-cs .list li .info .price-info .pct {
  color: #F00505;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.scm-contents .ai-search-cs .ai-list-cs .list li .info .price-info .f-price {
  color: #C8C8C8;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: line-through;
}
.scm-contents .bs-search-filter .bs-head {
  padding: 12px 0 8px 8px;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.scm-contents .bs-search-filter .bs-head:before {
  content: "";
  width: 100%;
  height: 4px;
  overflow: hidden;
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  border-radius: 1.5px;
  background-image: linear-gradient(283deg, #168fdd 69%, #32ab8c 25%);
}
.scm-contents .bs-search-filter .bs-head > div {
  width: 100%;
}
.scm-contents .bs-search-filter .bs-head > div .count-txt {
  color: #101010;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}
.scm-contents .bs-search-filter .bs-head > div .count-txt strong {
  color: #0E89E8;
}
.scm-contents .bs-search-filter .bs-head > div .cmt {
  color: #666;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.scm-contents .bs-search-filter .bs-body .list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  gap: 20px;
  margin-bottom: 48px;
}
.scm-contents .bs-search-filter .bs-body .list li {
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid #fff;
  box-sizing: border-box;
  background: #fff;
  transition: 0.2s;
  position: relative;
}
.scm-contents .bs-search-filter .bs-body .list li.out:before, .scm-contents .bs-search-filter .bs-body .list li.stop:before {
  content: "";
  position: absolute;
  background: rgba(255, 255, 255, 0.8) url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/static/images/mro/sub/soldOutImg.png) center/75% no-repeat;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.scm-contents .bs-search-filter .bs-body .list li:not(.out):hover, .scm-contents .bs-search-filter .bs-body .list li:not(.stop):hover {
  border-color: #E8E8E8;
}
.scm-contents .bs-search-filter .bs-body .list li .thm {
  height: 212px;
  background: #E8E8E8 url(https://castingn-mall.s3.ap-northeast-2.amazonaws.com/static/images/mro/sub/noImg.jpg) center/100% no-repeat;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
.scm-contents .bs-search-filter .bs-body .list li .info {
  padding: 16px;
  display: grid;
  gap: 12px;
}
.scm-contents .bs-search-filter .bs-body .list li .info .code {
  color: #999;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
}
.scm-contents .bs-search-filter .bs-body .list li .info .name {
  color: #333;
  text-overflow: ellipsis;
  font-size: 14px;
  height: 40px;
  font-weight: 400;
  line-height: 20px;
  display: box;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.scm-contents .bs-search-filter .bs-body .list li .info .price {
  color: #000;
  font-size: 18px;
  font-weight: 500;
}
.scm-contents .bs-search-filter .bs-body .list li .info .price-info {
  display: flex;
  align-items: center;
  gap: 4px;
}
.scm-contents .bs-search-filter .bs-body .list li .info .price-info .pct {
  color: #F00505;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.scm-contents .bs-search-filter .bs-body .list li .info .price-info .f-price {
  color: #C8C8C8;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: line-through;
}
.scm-contents .spending-ct .tab-ct .tab {
  box-sizing: border-box;
  border-radius: 12px 12px 0 0;
  border: 1px solid #C8C8C8;
  border-bottom: 2px solid #101010;
  color: #666;
  font-size: 16px;
  font-weight: 500;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 64px;
  background-color: #F2F2F2;
  transition: 0.2s;
  cursor: pointer;
  position: relative;
}
.scm-contents .spending-ct .tab-ct .tab:not(.active):after {
  content: "";
  display: block;
  position: absolute;
  left: -1px;
  right: -1px;
  height: 2px;
  width: 100%;
  background-color: #101010;
  bottom: -2px;
}
.scm-contents .spending-ct .tab-ct .tab:not(.active):hover {
  color: #101010;
  font-weight: 700;
}
.scm-contents .spending-ct .tab-ct .tab.active {
  background-color: #fff;
  color: #101010;
  border: 2px solid #101010;
  border-bottom: 2px solid #fff;
  font-weight: 700;
}
.scm-contents .spending-ct .tab-box-list .tab-box {
  display: none;
}
.scm-contents .spending-ct .chart-graph-ct {
  overflow-y: auto;
  overflow-x: hidden;
}
.scm-contents .spending-ct .chart-graph-ct::-webkit-scrollbar {
  width: 8px;
}
.scm-contents .spending-ct .chart-graph-ct::-webkit-scrollbar-track {
  background: transparent;
}
.scm-contents .spending-ct .chart-graph-ct::-webkit-scrollbar-thumb {
  background: #f2f2f2;
  border-radius: 6px;
}
.scm-contents .spending-ct .chart-graph-ct::-webkit-scrollbar-thumb:active {
  background: transparent;
}
.scm-contents .spending-ct .chart-graph-ct::-webkit-scrollbar-thumb:hover {
  background: #ddd;
}
.scm-contents .spending-ct .chart-graph-ct::-webkit-scrollbar-button {
  display: none;
}
.scm-contents .spending-ct .chart-graph-cs {
  content: "";
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  min-height: 300px;
  width: 100%;
  background: #D9D9D9;
  z-index: 1;
  /*&:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 40px;
  }*/
}
.scm-contents .spending-ct .chart-graph-cs:after {
  content: "데이터가 없습니다.";
  display: block;
  font-size: 12px;
  position: absolute;
  z-index: -1;
}
.scm-contents .spending-ct .type-price {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  display: inline-flex;
  top: 20px;
  bottom: 0;
  text-align: center;
  width: 150px;
  height: 150px;
  z-index: 1;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  font-size: 16px;
  color: #666;
}
.scm-contents .spending-ct .type-price b {
  font-size: 24px;
  margin-top: -4px;
  margin-left: 4px;
  color: #101010;
}

.line-through {
  text-decoration: line-through;
}

.cst-table-list-scroll {
  border-radius: 4px;
  border: 1px solid #D9D9D9;
  overflow: hidden;
}
.cst-table-list-scroll .table-hd-cs {
  border-collapse: collapse;
}
.cst-table-list-scroll .table-hd-cs thead th {
  background-color: #F7F8FC;
  border: 1px solid #D9D9D9;
  border-top: none;
  height: 48px;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
}
.cst-table-list-scroll .table-hd-cs thead th:first-child {
  border-left: none;
}
.cst-table-list-scroll .table-hd-cs thead th:last-child {
  border-right: none;
}
.cst-table-list-scroll .table-bd-cs {
  max-height: 660px;
  width: 100%;
  margin: 0 auto;
  overflow: auto;
}
.cst-table-list-scroll .table-bd-cs .mCSB_container {
  margin-right: 0;
}
.cst-table-list-scroll .table-bd-cs .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background: #999;
  width: 8px;
  margin-right: 8px;
}
.cst-table-list-scroll .table-bd-cs .mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
  background: none !important;
}
.cst-table-list-scroll .table-bd-cs tbody td {
  text-align: center;
  border-right: 1px solid #D9D9D9;
  padding: 12px 8px;
}
.cst-table-list-scroll .table-bd-cs tbody td:last-child {
  border-right: none;
}

.line-through {
  text-decoration: line-through;
}

/*# sourceMappingURL=scmStyle.css.map */