[class*=form-group-] {
  display: flex;
  flex-wrap: wrap; }

.btn-01 {
  width: 100%;
  height: 56px;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #7A3986;
  font-weight: 500;
  font-size: 15px;
  line-height: 18px;
  text-align: center;
  color: #FFFFFF; }
  .btn-01:hover {
    cursor: pointer;
    background: #6B337D; }

.btn-02 {
  width: 100%;
  height: 56px;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #425993;
  font-weight: 500;
  font-size: 15px;
  line-height: 18px;
  text-align: center;
  color: #FFFFFF; }
  .btn-02:hover {
    cursor: pointer;
    background: #3B518B; }

.filter-ui-04 .filter-btn-A {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  background-color: #E6E6E7;
  border-radius: 4px;
  transition: opacity 0.2s; }
  .filter-ui-04 .filter-btn-A:disabled {
    opacity: 0.3; }

[class*=chk-] > label {
  cursor: pointer;
  display: flex; }
  [class*=chk-] > label::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    background-color: #fff; }
[class*=chk-] [type=checkbox]:checked ~ label::before {
  background-position: center center;
  background-repeat: no-repeat; }

.chk-A > :nth-child(2) {
  padding: 0 0 0 32px; }
  .chk-A > :nth-child(2)::before {
    width: 24px;
    height: 24px;
    border: 1px solid #D5D5D6;
    border-radius: 6px;
    transition: background-color 0.2s, border 0.2s; }
.chk-A [type=checkbox]:checked ~ label::before {
  border: 1px solid #D5D5D6;
  background-size: 9px 7px;
  background-image: url(/Content/Images/Icons/icon-check.svg); }
.chk-A [type=checkbox]:focus ~ label::before {
  border: 1px solid #D5D5D6; }
.chk-A [type=checkbox]:disabled ~ label::before {
  border: 1px solid #D5D5D6; }
.chk-A [type=checkbox].error ~ label.error::before {
  border: 1px solid #D5D5D6; }
.chk-A:hover > label::before {
  background-color: #E7E7E7; }

.chk-B > span {
  display: flex;
  align-items: center;
  font-size: 14px; }
  .chk-B > span::before {
    content: '';
    display: block;
    width: 60px;
    height: 32px;
    border-radius: 30px;
    background-color: #E6E6E7;
    transition: background-color 0.2s, border 0.2s; }
  .chk-B > span::after {
    content: '';
    position: absolute;
    top: calc(50% - 12px);
    left: 4px;
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #909091;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -moz-transition: transform 0.3s;
    -o-transition: transform 0.3s;
    -webkit-transition: transform 0.3s;
    transition: transform 0.3s; }
  .chk-B > span > span {
    width: calc(100% - 50px); }
.chk-B [type=checkbox]:checked ~ span::before {
  background-color: #C5E2A7; }
.chk-B [type=checkbox]:checked ~ span::after {
  -webkit-transform: translateX(28px);
  -moz-transform: translateX(28px);
  -ms-transform: translateX(28px);
  -o-transform: translateX(28px);
  transform: translateX(28px);
  background-color: #548C33; }

.chk-C > :nth-child(2) {
  padding: 0 0 0 0; }
  .chk-C > :nth-child(2)::before {
    width: 24px;
    height: 24px;
    border: 1px solid #D5D5D6;
    border-radius: 6px;
    transition: background-color 0.2s, border 0.2s; }
.chk-C [type=checkbox]:checked ~ label::before {
  border: 1px solid #D5D5D6;
  background-size: 9px 7px;
  background-image: url(/Content/Images/Icons/icon-check.svg); }
.chk-C [type=checkbox]:focus ~ label::before {
  border: 1px solid #D5D5D6; }
.chk-C [type=checkbox]:disabled ~ label::before {
  border: 1px solid #D5D5D6; }
.chk-C [type=checkbox].error ~ label.error::before {
  border: 1px solid #D5D5D6; }

.filter-typ-01 .filter-chk-01 {
  display: flex;
  align-items: center;
  font-weight: normal;
  font-size: 13px;
  line-height: 16px;
  color: #171718;
  margin-bottom: 8px; }
  .filter-typ-01 .filter-chk-01 > span {
    display: flex;
    white-space: pre-wrap; }
  .filter-typ-01 .filter-chk-01 .star-container {
    margin: 0 8px 0 0;
    white-space: nowrap; }
    .filter-typ-01 .filter-chk-01 .star-container svg:not(:last-child) {
      margin: 0 4px 0 0; }
  .filter-typ-01 .filter-chk-01 .countno {
    font-size: 11px;
    color: #909091; }
  .filter-typ-01 .filter-chk-01 > span:nth-child(2):before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    margin: 0 8px 0 0;
    background-position: center center;
    background-repeat: no-repeat;
    border: 1px solid #D5D5D6;
    border-radius: 4px;
    flex-shrink: 0; }
  .filter-typ-01 .filter-chk-01 input:checked ~ span:before {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210%22%20height%3D%228%22%20viewBox%3D%220%200%2010%208%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M9.02289%200.0922C8.90079%20-0.0307333%208.70201%20-0.0307333%208.58075%200.0922L3.92136%204.72991C3.79926%204.85368%203.60007%204.85368%203.4788%204.72991L1.43728%202.65088C1.37685%202.5892%201.29768%202.55878%201.21808%202.55837C1.13765%202.55795%201.05598%202.58837%200.994718%202.65088L0.0925125%203.46182C0.0325044%203.5235%200%203.60059%200%203.68102C0%203.76186%200.0325044%203.84646%200.0929293%203.90772L2.15154%206.06801C2.27322%206.19136%202.47283%206.39139%202.5941%206.5139L3.47922%207.40611C3.6009%207.52821%203.79968%207.52821%203.92178%207.40611L9.90843%201.4303C10.0305%201.30778%2010.0305%201.1065%209.90843%200.983987L9.02289%200.0922Z%22%20fill%3D%22%23171718%22%2F%3E%20%3C%2Fsvg%3E"); }

[class*=rdb-] > label {
  cursor: pointer;
  display: flex; }
  [class*=rdb-] > label::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    background-color: #fff; }
[class*=rdb-] [type=radio]:checked ~ label::before {
  background-position: center center;
  background-repeat: no-repeat; }

.select-ui-01 {
  width: 100%;
  height: 48px;
  padding: 0px 16px;
  border: 2px solid #D5D5D6;
  box-sizing: border-box;
  border-radius: 4px;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  color: rgba(0, 0, 0, 0.54); }
  .select-ui-01:valid {
    color: #000; }
  .select-ui-01 option {
    color: #000; }
  .select-ui-01 option[value=""] {
    color: rgba(0, 0, 0, 0.54); }

.payment-form-group-03 .payment-select-01 {
  width: calc(50% - 5px);
  height: 48px;
  padding: 15px;
  margin-top: 8px;
  border: 2px solid #D5D5D6;
  box-sizing: border-box;
  border-radius: 4px;
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #171718;
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%225%22%20viewBox%3D%220%200%208%205%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M8%200L4%205L0%200H8Z%22%20fill%3D%22black%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: calc(100% - 10px) 50%; }

@media all and (max-width: 414px) {
  .comp-ui-17 .note-select-01 {
    width: 100%;
    height: 48px;
    margin-top: 8px;
    padding: 15px;
    border: 1px solid #D5D5D6;
    box-sizing: border-box;
    border-radius: 4px;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #171718;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%225%22%20viewBox%3D%220%200%208%205%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M8%200L4%205L0%200H8Z%22%20fill%3D%22black%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%; }

  .comp-ui-21 .note-confirm-select-01 {
    padding: 19px 20px;
    margin-bottom: 40px;
    background: #FFFFFF;
    border: 2px solid #D5D5D6;
    width: 100%;
    height: 48px;
    border-radius: 6px;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    color: #171718; } }
@media all and (min-width: 415px) and (max-width: 767px) {
  .comp-ui-17 .note-select-01 {
    width: 100%;
    height: 48px;
    margin-top: 8px;
    padding: 15px;
    border: 1px solid #D5D5D6;
    box-sizing: border-box;
    border-radius: 4px;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #171718;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%225%22%20viewBox%3D%220%200%208%205%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M8%200L4%205L0%200H8Z%22%20fill%3D%22black%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%; }

  .comp-ui-21 .note-confirm-select-01 {
    padding: 19px 20px;
    margin-bottom: 40px;
    background: #FFFFFF;
    border: 2px solid #D5D5D6;
    width: 100%;
    height: 48px;
    border-radius: 6px;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    color: #171718; } }
@media all and (min-width: 768px) and (max-width: 1023px) {
  .comp-ui-17 .note-select-01 {
    width: 100%;
    height: 48px;
    margin-top: 12px;
    padding: 15px;
    border: 1px solid #D5D5D6;
    box-sizing: border-box;
    border-radius: 4px;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #171718;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%225%22%20viewBox%3D%220%200%208%205%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M8%200L4%205L0%200H8Z%22%20fill%3D%22black%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%; }

  .comp-ui-21 .note-confirm-select-01 {
    padding: 19px 20px;
    margin-bottom: 40px;
    background: #FFFFFF;
    border: 2px solid #D5D5D6;
    width: 100%;
    height: 56px;
    border-radius: 6px;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    color: #171718; } }
@media all and (min-width: 1024px) and (max-width: 1279px) {
  .comp-ui-17 .note-select-01 {
    width: 100%;
    height: 48px;
    margin-top: 12px;
    padding: 15px;
    border: 1px solid #D5D5D6;
    box-sizing: border-box;
    border-radius: 4px;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #171718;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%225%22%20viewBox%3D%220%200%208%205%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M8%200L4%205L0%200H8Z%22%20fill%3D%22black%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%; }

  .comp-ui-21 .note-confirm-select-01 {
    padding: 19px 20px;
    margin-bottom: 40px;
    background: #FFFFFF;
    border: 2px solid #D5D5D6;
    width: 100%;
    height: 56px;
    border-radius: 6px;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    color: #171718; } }
@media all and (min-width: 1280px) and (max-width: 1679px) {
  .comp-ui-17 .note-select-01, .comp-ui-56 .note-select-01 {
    width: 100%;
    height: 48px;
    margin-top: 12px;
    padding: 13px;
    border: 2px solid #D5D5D6;
    box-sizing: border-box;
    border-radius: 4px;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #171718;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%225%22%20viewBox%3D%220%200%208%205%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M8%200L4%205L0%200H8Z%22%20fill%3D%22black%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%; }

  .micro-ui-61 .micro-61-select-01 {
    width: 100%;
    height: 60px;
    margin-top: 20px;
    padding: 20px;
    border: 2px solid #D5D5D6;
    box-sizing: border-box;
    border-radius: 6px;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #171718;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%225%22%20viewBox%3D%220%200%208%205%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M8%200L4%205L0%200H8Z%22%20fill%3D%22black%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%; }

  .comp-ui-21 .note-confirm-select-01 {
    padding: 0 20px;
    margin-bottom: 40px;
    background: #FFFFFF;
    border: 2px solid #D5D5D6;
    width: 100%;
    height: 56px;
    border-radius: 6px;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    color: #171718; } }
@media all and (min-width: 1680px) {
  .comp-ui-17 .note-select-01, .comp-ui-56 .note-select-01 {
    width: 100%;
    height: 48px;
    margin-top: 12px;
    padding: 13px;
    border: 2px solid #D5D5D6;
    box-sizing: border-box;
    border-radius: 4px;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #171718;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%225%22%20viewBox%3D%220%200%208%205%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M8%200L4%205L0%200H8Z%22%20fill%3D%22black%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%; }

  .micro-ui-61 .micro-61-select-01 {
    width: 100%;
    height: 60px;
    margin-top: 20px;
    padding: 20px;
    border: 2px solid #D5D5D6;
    box-sizing: border-box;
    border-radius: 6px;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #171718;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%225%22%20viewBox%3D%220%200%208%205%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M8%200L4%205L0%200H8Z%22%20fill%3D%22black%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) 50%; }

  .comp-ui-21 .note-confirm-select-01 {
    padding: 0 20px;
    margin-bottom: 40px;
    background: #FFFFFF;
    border: 2px solid #D5D5D6;
    width: 100%;
    height: 56px;
    border-radius: 6px;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    color: #171718; } }
.tb-01 {
  width: 100%;
  height: 56px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 16px;
  border: 1px solid #D5D5D6;
  border-radius: 6px;
  background: transparent;
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #171718;
  transition: all 0.1s; }
  .tb-01.readonly {
    border-radius: 4px;
    background: #F8F8F9; }
  .tb-01 ~ .tb-placeholder-01 {
    position: absolute;
    top: 18px;
    left: 16px;
    transition: all 0.2s;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #171718; }
  .tb-01 ~ .tb-togglePassword-01 {
    height: 15px;
    position: absolute;
    right: 16px;
    top: calc(50% - 8.5px);
    font-size: 14px;
    line-height: 17px;
    z-index: 2;
    font-weight: normal;
    font-size: 12px;
    line-height: 15px;
    text-align: right;
    color: #171718; }
  .tb-01:not([value=""]):not(:focus) ~ .tb-placeholder-01, .tb-01:not([value=""]):not(:focus):-webkit-autofill + label, .tb-01:not([value=""]):not(:focus):not(:placeholder-shown) + label, .tb-01:not([value=""]):not(:focus).filled + label {
    top: -7.5px;
    left: 11px;
    padding: 0 5px;
    background-color: white;
    font-weight: normal;
    font-size: 12px;
    line-height: 15px;
    color: #68686A; }
  .tb-01:focus {
    border: 2px solid #3B518B; }
    .tb-01:focus ~ .tb-placeholder-01, .tb-01:focus:-webkit-autofill + label, .tb-01:focus:not(:placeholder-shown) + label, .tb-01:focus.filled + label {
      top: -7.5px;
      left: 11px;
      padding: 0 5px;
      background-color: white;
      font-weight: normal;
      font-size: 12px;
      line-height: 15px;
      color: #68686A; }

.tb-01:not([value=""]):not(:focus) ~ .tb-placeholder-01, .tb-01:-webkit-autofill ~ .tb-placeholder-01, .tb-01:not(:placeholder-shown) ~ .tb-placeholder-01, .tb-01.filled ~ .tb-placeholder-01 {
  top: -7.5px;
  left: 11px;
  padding: 0 5px;
  background-color: white;
  font-weight: normal;
  font-size: 12px;
  line-height: 15px;
  color: #68686A; }
.tb-01:focus {
  border: 2px solid #3B518B; }
  .tb-01:focus ~ .tb-placeholder-01 {
    top: -7.5px;
    left: 11px;
    padding: 0 5px;
    background-color: white;
    font-weight: normal;
    font-size: 12px;
    line-height: 15px;
    color: #68686A; }

.tb-02 {
  width: 100%;
  height: 48px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 16px;
  border: 2px solid #D5D5D6;
  border-radius: 4px;
  background: transparent;
  font-family: "Inter";
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #000000;
  transition: all 0.1s; }
  .tb-02.pl-40 {
    padding-left: 40px !important; }
  .tb-02.readonly {
    border-radius: 4px;
    background: #F8F8F9; }
  .tb-02 ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .tb-02 ::-moz-placeholder {
    /* Firefox 19+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .tb-02 :-ms-input-placeholder {
    /* IE 10+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .tb-02 :-moz-placeholder {
    /* Firefox 18- */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }

.tb-02:read-only {
  background: #F8F8F9; }

.tb-03 {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 16px;
  border-radius: 4px;
  background: #FFFFFF;
  font-family: "Inter";
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #000000;
  transition: all 0.1s; }
  .tb-03 ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .tb-03 ::-moz-placeholder {
    /* Firefox 19+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .tb-03 :-ms-input-placeholder {
    /* IE 10+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .tb-03 :-moz-placeholder {
    /* Firefox 18- */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }

.address-form-ui .address-tb-01 {
  width: 100%;
  height: 48px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 8px;
  padding-left: 16px;
  border: 1px solid #D5D5D6;
  border-radius: 4px;
  background: transparent;
  font-family: "Inter";
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #000000;
  transition: all 0.1s; }
  .address-form-ui .address-tb-01 ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .address-form-ui .address-tb-01 ::-moz-placeholder {
    /* Firefox 19+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .address-form-ui .address-tb-01 :-ms-input-placeholder {
    /* IE 10+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .address-form-ui .address-tb-01 :-moz-placeholder {
    /* Firefox 18- */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }

.payment-type-ui-01 .payment-tb-01 {
  width: 100%;
  height: 48px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 8px;
  padding-left: 16px;
  padding-right: 61px;
  border: 1px solid #D5D5D6;
  border-radius: 4px;
  background: transparent;
  font-family: "Inter";
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #000000;
  transition: all 0.1s; }
  .payment-type-ui-01 .payment-tb-01 ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .payment-type-ui-01 .payment-tb-01 ::-moz-placeholder {
    /* Firefox 19+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .payment-type-ui-01 .payment-tb-01 :-ms-input-placeholder {
    /* IE 10+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .payment-type-ui-01 .payment-tb-01 :-moz-placeholder {
    /* Firefox 18- */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
.payment-type-ui-01 .payment-tb-02 {
  width: 60px;
  height: 48px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 8px;
  margin-right: 5px;
  padding-left: 8px;
  padding-right: 8px;
  text-align: center;
  border: 1px solid #D5D5D6;
  border-radius: 4px;
  background: transparent;
  font-family: "Inter";
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #000000;
  transition: all 0.1s; }
  .payment-type-ui-01 .payment-tb-02 ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .payment-type-ui-01 .payment-tb-02 ::-moz-placeholder {
    /* Firefox 19+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .payment-type-ui-01 .payment-tb-02 :-ms-input-placeholder {
    /* IE 10+ */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }
  .payment-type-ui-01 .payment-tb-02 :-moz-placeholder {
    /* Firefox 18- */
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000; }

.filter-typ-01 .filter-tb-01 {
  font-weight: normal;
  font-size: 13px;
  line-height: 16px;
  color: #171718; }
  .filter-typ-01 .filter-tb-01 ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    color: #171718; }
  .filter-typ-01 .filter-tb-01 ::-moz-placeholder {
    /* Firefox 19+ */
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    color: #171718; }
  .filter-typ-01 .filter-tb-01 :-ms-input-placeholder {
    /* IE 10+ */
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    color: #171718; }
  .filter-typ-01 .filter-tb-01 :-moz-placeholder {
    /* Firefox 18- */
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    color: #171718; }

.comp-ui-17 .note-tb-01:disabled, .comp-ui-17 .note-tb-01:read-only, .comp-ui-17 .note-tb-02:disabled, .comp-ui-17 .note-tb-02:read-only, .comp-ui-17 .note-tb-03:disabled, .comp-ui-17 .note-tb-03:read-only, .comp-ui-56 .note-tb-01:disabled, .comp-ui-56 .note-tb-01:read-only, .comp-ui-56 .note-tb-02:disabled, .comp-ui-56 .note-tb-02:read-only, .comp-ui-56 .note-tb-03:disabled, .comp-ui-56 .note-tb-03:read-only {
  background-color: #F8F8F9;
  color: #373738;
  border: none; }

@media all and (max-width: 414px) {
  .comp-ui-17 .note-tb-01 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 8px;
    padding-left: 16px;
    border: 1px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-01 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
  .comp-ui-17 .note-tb-02 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 8px;
    padding-left: 48px;
    border: 1px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-02 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; } }
@media all and (min-width: 415px) and (max-width: 767px) {
  .comp-ui-17 .note-tb-01 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 8px;
    padding-left: 16px;
    border: 1px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-01 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
  .comp-ui-17 .note-tb-02 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 8px;
    padding-left: 48px;
    border: 1px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-02 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; } }
@media all and (min-width: 768px) and (max-width: 1023px) {
  .comp-ui-17 .note-tb-01 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 16px;
    border: 1px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-01 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
  .comp-ui-17 .note-tb-02 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 48px;
    border: 1px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-02 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; } }
@media all and (min-width: 1024px) and (max-width: 1279px) {
  .comp-ui-17 .note-tb-01 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 16px;
    border: 1px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-01 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
  .comp-ui-17 .note-tb-02 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 48px;
    border: 1px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-02 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; } }
@media all and (min-width: 1280px) and (max-width: 1679px) {
  .comp-ui-17 .note-tb-01, .comp-ui-56 .note-tb-01 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 16px;
    border: 2px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-01 ::-webkit-input-placeholder, .comp-ui-56 .note-tb-01 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 ::-moz-placeholder, .comp-ui-56 .note-tb-01 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-ms-input-placeholder, .comp-ui-56 .note-tb-01 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-moz-placeholder, .comp-ui-56 .note-tb-01 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
  .comp-ui-17 .note-tb-02, .comp-ui-56 .note-tb-02 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 48px;
    border: 2px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-02 ::-webkit-input-placeholder, .comp-ui-56 .note-tb-02 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 ::-moz-placeholder, .comp-ui-56 .note-tb-02 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-ms-input-placeholder, .comp-ui-56 .note-tb-02 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-moz-placeholder, .comp-ui-56 .note-tb-02 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
  .comp-ui-17 .note-tb-03, .comp-ui-56 .note-tb-03 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 57px;
    border: 2px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-03 ::-webkit-input-placeholder, .comp-ui-56 .note-tb-03 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-03 ::-moz-placeholder, .comp-ui-56 .note-tb-03 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-03 :-ms-input-placeholder, .comp-ui-56 .note-tb-03 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-03 :-moz-placeholder, .comp-ui-56 .note-tb-03 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-03 ~ .note-tb-symbol, .comp-ui-56 .note-tb-03 ~ .note-tb-symbol {
      display: flex;
      align-items: center;
      justify-content: center;
      background: #F0F0F2;
      position: absolute;
      left: 2px;
      top: 30px;
      width: 41px;
      height: 44px;
      border-right: 2px solid #D5D5D6;
      box-sizing: border-box;
      border-radius: 4px 0px 0px 4px;
      font-weight: normal;
      font-size: 17px;
      line-height: 21px;
      color: #171718; }
      .comp-ui-17 .note-tb-03 ~ .note-tb-symbol.readonly, .comp-ui-56 .note-tb-03 ~ .note-tb-symbol.readonly {
        border: none; }

  .comp-ui-62 .discount-coupon-tb-01 {
    width: 100%;
    height: 56px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 16px;
    border: 2px solid #3B518B;
    border-radius: 8px;
    background: #fff;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-62 .discount-coupon-tb-01 ~ .tb-placeholder-01 {
      position: absolute;
      top: calc(50% - 16.5px);
      left: 16px;
      transition: all 0.2s;
      font-weight: normal;
      font-size: 14px;
      line-height: 17px;
      color: #171718; }
    .comp-ui-62 .discount-coupon-tb-01:not([value=""]):not(:focus) ~ .tb-placeholder-01 {
      top: 4.5px;
      left: 11px;
      padding: 0 5px;
      background-color: white;
      font-weight: 500;
      font-size: 12px;
      line-height: 15px;
      color: #324780; }
    .comp-ui-62 .discount-coupon-tb-01:focus {
      border: 2px solid #3B518B; }
      .comp-ui-62 .discount-coupon-tb-01:focus ~ .tb-placeholder-01 {
        top: 4.5px;
        left: 11px;
        padding: 0 5px;
        background-color: white;
        font-weight: 500;
        font-size: 12px;
        line-height: 15px;
        color: #324780; } }
@media all and (min-width: 1680px) {
  .comp-ui-17 .note-tb-01, .comp-ui-56 .note-tb-01 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 16px;
    border: 2px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-01 ::-webkit-input-placeholder, .comp-ui-56 .note-tb-01 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 ::-moz-placeholder, .comp-ui-56 .note-tb-01 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-ms-input-placeholder, .comp-ui-56 .note-tb-01 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-01 :-moz-placeholder, .comp-ui-56 .note-tb-01 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
  .comp-ui-17 .note-tb-02, .comp-ui-56 .note-tb-02 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 48px;
    border: 2px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-02 ::-webkit-input-placeholder, .comp-ui-56 .note-tb-02 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 ::-moz-placeholder, .comp-ui-56 .note-tb-02 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-ms-input-placeholder, .comp-ui-56 .note-tb-02 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-02 :-moz-placeholder, .comp-ui-56 .note-tb-02 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
  .comp-ui-17 .note-tb-03, .comp-ui-56 .note-tb-03 {
    width: 100%;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 57px;
    border: 2px solid #D5D5D6;
    border-radius: 4px;
    background: #fff;
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-17 .note-tb-03 ::-webkit-input-placeholder, .comp-ui-56 .note-tb-03 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-03 ::-moz-placeholder, .comp-ui-56 .note-tb-03 ::-moz-placeholder {
      /* Firefox 19+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-03 :-ms-input-placeholder, .comp-ui-56 .note-tb-03 :-ms-input-placeholder {
      /* IE 10+ */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-03 :-moz-placeholder, .comp-ui-56 .note-tb-03 :-moz-placeholder {
      /* Firefox 18- */
      font-weight: 500;
      font-size: 14px;
      line-height: 17px;
      color: #000000; }
    .comp-ui-17 .note-tb-03 ~ .note-tb-symbol, .comp-ui-56 .note-tb-03 ~ .note-tb-symbol {
      display: flex;
      align-items: center;
      justify-content: center;
      background: #F0F0F2;
      position: absolute;
      left: 2px;
      top: 30px;
      width: 41px;
      height: 44px;
      border-right: 2px solid #D5D5D6;
      box-sizing: border-box;
      border-radius: 4px 0px 0px 4px;
      font-weight: normal;
      font-size: 17px;
      line-height: 21px;
      color: #171718; }
      .comp-ui-17 .note-tb-03 ~ .note-tb-symbol.readonly, .comp-ui-56 .note-tb-03 ~ .note-tb-symbol.readonly {
        border: none; }

  .comp-ui-62 .discount-coupon-tb-01 {
    width: 100%;
    height: 56px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 12px;
    padding-left: 16px;
    border: 2px solid #3B518B;
    border-radius: 8px;
    background: #fff;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    transition: all 0.1s; }
    .comp-ui-62 .discount-coupon-tb-01 ~ .tb-placeholder-01 {
      position: absolute;
      top: calc(50% - 16.5px);
      left: 16px;
      transition: all 0.2s;
      font-weight: normal;
      font-size: 14px;
      line-height: 17px;
      color: #171718; }
    .comp-ui-62 .discount-coupon-tb-01:not([value=""]):not(:focus) ~ .tb-placeholder-01 {
      top: 4.5px;
      left: 11px;
      padding: 0 5px;
      background-color: white;
      font-weight: 500;
      font-size: 12px;
      line-height: 15px;
      color: #324780; }
    .comp-ui-62 .discount-coupon-tb-01:focus {
      border: 2px solid #3B518B; }
      .comp-ui-62 .discount-coupon-tb-01:focus ~ .tb-placeholder-01 {
        top: 4.5px;
        left: 11px;
        padding: 0 5px;
        background-color: white;
        font-weight: 500;
        font-size: 12px;
        line-height: 15px;
        color: #324780; } }
.val-A input[type=text].error, .val-A input[type=password].error, .val-A select.error {
  border: 2px solid #A32F2A !important; }
  .val-A input[type=text].error option:first-child, .val-A input[type=password].error option:first-child, .val-A select.error option:first-child {
    color: #A32F2A; }
.val-A .parenterror .select2-selection {
  border: 2px solid #A32F2A !important; }
  .val-A .parenterror .select2-selection .select2-selection__placeholder {
    color: #A32F2A !important; }
.val-A .parenterror ~ label {
  font-size: 40px; }
.val-A .parenterror label {
  font-weight: 500 !important;
  color: #A32F2A !important; }
  .val-A .parenterror label.error {
    display: flex !important;
    order: 1;
    margin-top: 8px;
    line-height: 15px !important;
    font-size: 12px !important; }

.val-B label.error {
  display: none !important; }

.val-C input[type=text].error,
.val-C select.error {
  color: #A32F2A !important;
  border: 2px solid #A32F2A !important; }
.val-C input[type=radio].error ~ label:before,
.val-C input[type=checkbox].error ~ label:before {
  border: 1px solid #A32F2A !important; }
.val-C input[type=radio].error ~ label span,
.val-C input[type=checkbox].error ~ label span {
  color: #A32F2A !important;
  font-weight: 500; }
.val-C .parenterror .select2-selection {
  border: 2px solid #A32F2A !important; }
  .val-C .parenterror .select2-selection .select2-selection__placeholder {
    color: #A32F2A !important; }
.val-C .parenterror label {
  font-weight: 500 !important;
  font-size: 12px !important;
  color: #A32F2A !important; }

.list-validation .list-validation-text {
  display: none; }
.list-validation.listerror label.error {
  display: none !important; }
.list-validation.listerror .list-validation-header {
  font-weight: 500 !important;
  font-size: 12px !important;
  color: #A32F2A !important; }
.list-validation.listerror .list-validation-text {
  display: block;
  font-weight: 500 !important;
  font-size: 12px !important;
  color: #A32F2A !important; }

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