@import "./font.css";
@import "./base.css";

/* ========================================= color =========================================*/

:root {
  --cf: #fff;
  --c7: #777;
  --title: #222;
  --BNK-logo: #d7000f;
  --BNK-Main: #d7000f;
  --BNK-Sub: #6f634f;
  --BNK-Point1: #ffe8dc;
  --BNK-Point2: #f8f9fc;
  --BNK-Point3: #f3f4f8;
  --BNK-BG: #fff8f5;
  --Text-Main: #222;
  --Text-Sub1: #777;
  --Text-Sub2: #aaa;
}

.container {
  background: #f9f9f9;
  min-width: 1280px;
}

.container .container-inner {
  width: 1280px;
  margin: 0 auto;
  padding-top: 150px;
  background: #f9f9f9;
}

/* header */
.container .container-inner .header {
  width: 100%;
  border-bottom: 1px solid #ededed;
  display: flex;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  background: #f9f9f9;
  box-sizing: border-box;
  z-index: 2;
  min-width: 1280px;
}

.container .container-inner .header:hover {
  padding-bottom: 130px;
}

.container .container-inner .header .header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 150px;
  width: 100%;
  max-width: 1280px;
  transition: 0.3s;
}

.container .container-inner .header .header-inner.on {
  height: 60px;
}

.container .container-inner .header:hover .header-inner.on {
  padding-top: 15px;
}

.container .container-inner .header a.logo {
  width: 212px;
  height: 30px;
  background-image: url(../img/bnk_rchada_logo.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.container .container-inner .header .header-right {
  display: flex;
  align-items: center;
  gap: 30px;
}

.container .container-inner .header .header-right .menu-list {
  display: flex;
}

.container .container-inner .header .header-right .menu-list .menu-item {
  position: relative;
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item
  a.menu-link {
  width: 150px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item
  a.menu-link
  p {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.02em;
  text-align: center;
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item:hover
  a.menu-link
  p {
  color: #d7000f;
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item
  a.menu-link
  p
  span {
  color: var(--BNK-Main, #d7000f);
  font-size: 14px;
  line-height: 1;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item
  a.menu-link
  p
  span.dot {
  width: 9px;
  height: 9px;
  background: var(--BNK-Main, #d7000f);
  border-radius: 100%;
  top: 6px;
  animation: bounceBall 2s ease infinite;
  padding: 0;
}

.container
  .container-inner
  .header
  .header-inner.on
  .header-right
  .menu-list
  .menu-item
  a.menu-link
  p
  span {
  display: none;
}

.container
  .container-inner
  .header:hover
  .header-inner.on
  .header-right
  .menu-list
  .menu-item
  a.menu-link
  p
  span {
  display: block;
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item:hover
  a.menu-link
  p
  span {
  color: #d7000f;
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item
  .submenu-list {
  display: none;
  position: absolute;
  top: 100%;
  background: #f9f9f9;
}

.container
  .container-inner
  .header:hover
  .header-right
  .menu-list
  .menu-item
  .submenu-list {
  display: block;
}

.container
  .container-inner
  .header:hover
  .header-right
  .menu-list
  .menu-item:hover
  .submenu-list {
  display: block;
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item
  .submenu-list
  a.submenu-item {
  width: 150px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item
  .submenu-list
  a.submenu-item
  p {
  color: var(--Text-Sub1, #777);
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
  /* 187.5% */
  letter-spacing: -0.32px;
}

.container
  .container-inner
  .header
  .header-right
  .menu-list
  .menu-item
  .submenu-list
  a.submenu-item:hover
  p {
  color: #d7000f;
}

.container .container-inner .header .header-right .search-btn {
  width: 30px;
  height: 30px;
  background-image: url(../img/search-btn.svg);
  background-repeat: no-repeat;
  background-size: contain;
  cursor: pointer;
  display: none;
}

.container .container-inner .header .header-right .menu-btn {
  width: 30px;
  height: 20px;
  background-image: url(../img/menu-btn.svg);
  background-repeat: no-repeat;
  background-size: contain;
  cursor: pointer;
  display: none;
}

.container .container-inner .header.on .header-right .menu-btn {
  background-image: url(../img/menu-btn-on.svg);
}

/* footer */

.container .footer {
  width: 100%;
  border-top: 1px solid #e4e2df;
  padding-top: 30px;
}

.container .footer .footer-inner {
}

.container .footer .footer-top {
  width: 1280px;
  margin: 0 auto;
}

.container .footer .footer-top .link-list {
  display: flex;
  align-items: center;
}

.container .footer .footer-top .link-list .link-item {
  padding: 0 10px;
  cursor: pointer;
}

.container .footer .footer-top .link-list .link-item:first-child {
  padding-left: 0;
}

.container .footer .footer-top .link-list .link-item p {
  color: var(--Text-Sub2, #aaa);
  text-align: center;
  font-family: Pretendard;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.28px;
}

.container .footer .footer-top .link-list .link-item p:hover {
  text-decoration: underline;
}

.container .footer .footer-top .link-list .link-border {
  width: 1px;
  height: 15px;
  border-right: 1px solid var(--Text-Sub2, #aaa);
}

.container .footer .footer-bottom {
  padding: 50px 0 60px;
  display: flex;
  justify-content: space-between;
  width: 1280px;
  margin: 0 auto;
}

.container .footer .footer-bottom .footer-bottom-left {
}

.container .footer .footer-bottom .footer-bottom-left a.logo {
  width: 212px;
  height: 30px;
  background-image: url(../img/bnk_rchada_logo.png);
  background-position: center;
  background-size: contain;
  display: block;
  background-repeat: no-repeat;
}

.container .footer .footer-bottom .footer-bottom-left .info-box {
  padding: 10px 0;
}

.container .footer .footer-bottom .footer-bottom-left .info-box.kb-info-box {
  border-bottom: 1px dotted #dedede;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-left
  .info-box.kb-info-box
  p.txt1 {
  /* 169.231% */
  color: var(--Text-Main, #222);
  font-family: Pretendard;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  text-transform: capitalize;
}

.container .footer .footer-bottom .footer-bottom-left .info-box .info-row {
  display: flex;
  align-items: center;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-left
  .info-box
  .info-row
  p.info-title {
  width: 114px;
  color: var(--Text-Sub2, #aaa);
  font-family: Pretendard;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  /* 169.231% */
  letter-spacing: -0.52px;
  text-transform: capitalize;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-left
  .info-box
  .info-row
  p.info-cont {
  color: var(--Text-Main, #222);
  font-family: Pretendard;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  /* 169.231% */
  letter-spacing: -0.52px;
  text-transform: capitalize;
}

.container .footer .footer-bottom .footer-bottom-right .counsel-list {
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item {
  width: 240px;
  height: 56px;
  border-radius: 28px;
  display: flex;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
  cursor: pointer;
  transition: 0.3s;
  justify-content: center;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item:hover {
  opacity: 0.8;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item.phone-counsel-item {
  background: var(--BNK-Sub, #6f634f);
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item.kakao-counsel-item {
  background: #f4de27;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item.estimate-counsel-item {
  background: #222;
  margin-bottom: 0;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item
  .counsel-item-inner {
  display: flex;
  gap: 10px;
  align-items: center;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item
  .counsel-item-inner
  img {
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item.phone-counsel-item
  .counsel-item-inner
  img {
  width: 18px;
  height: 22px;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item.kakao-counsel-item
  .counsel-item-inner
  img {
  width: 28.19px;
  height: 26px;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item.estimate-counsel-item
  .counsel-item-inner
  img {
  width: 18px;
  height: 18px;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item
  .counsel-item-inner
  p {
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item.phone-counsel-item
  .counsel-item-inner
  p {
  color: var(--cf, #fff);
  text-align: center;
  font-family: Pretendard;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: capitalize;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item.kakao-counsel-item
  .counsel-item-inner
  p {
  color: var(--Text-Main, #222);
  text-align: center;
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.32px;
  text-transform: capitalize;
}

.container
  .footer
  .footer-bottom
  .footer-bottom-right
  .counsel-list
  .counsel-item.estimate-counsel-item
  .counsel-item-inner
  p {
  color: var(--cf, #fff);
  text-align: center;
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.32px;
  text-transform: capitalize;
}

/*  */
.container .footer .footer-underground {
  background: #222222;
  padding: 20px 0 60px;
}

.container .footer .footer-underground h3,
ul,
h4 {
  width: 1280px;
  margin: 10px auto;
}

.container .footer .footer-underground h3 {
  color: #ededed;
}

.container .footer .footer-underground h4 {
  color: #ededed;
}

.container .footer .footer-underground ul li {
  font-size: 13px;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: -0.04em;
  color: #ededed;
}

.container .footer .footer-underground ul li::before {
  content: "• ";
}

.container .footer .footer-underground ul li b {
  text-decoration: underline;
}

/* fixed-consult */
.container .container-inner .fixed-consult {
}

.container .container-inner .fixed-consult .consult-btn {
  width: 120px;
  height: 120px;
  background: #776c61;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  right: 20px;
  bottom: 20px;
  cursor: pointer;
  z-index: 1;
  /* animation: gradient 7s ease infinite;
  background: linear-gradient(
    -90deg,
    #ff9c1f,
    #e6a21c,
    #e6cb1c,
    #fff81f,
    #e6cb1c,
    #e6a21c,
    #ff9c1f
  );
  background-size: 400% 400%; */
  background: var(--BNK-Sub, #6f634f);
}

.container .container-inner .fixed-consult .consult-btn .consult-btn-inner {
  text-align: center;
}

.container .container-inner .fixed-consult .consult-btn .consult-btn-inner img {
  width: 30px;
  display: none;
}

.container .container-inner .fixed-consult .consult-btn .consult-btn-inner p {
  font-size: 16px;
  font-weight: 700;
  line-height: 19.5px;
  letter-spacing: -0.02em;
  color: white;
}

.container .container-inner .fixed-consult .consult-bar {
  position: fixed;
  bottom: 0;
  width: 100%;
  left: 0;
  box-shadow: -5px -10px 30px 0px #00000033;
  border-radius: 20px 20px 0 0;
  display: none;
  background: white;
  z-index: 1;
  min-width: 1280px;
}

.container .container-inner .fixed-consult .consult-bar .consult-close {
  width: 20px;
  height: 20px;
  background-image: url(../img/close-btn.svg);
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
}

.container .container-inner .fixed-consult .consult-bar .consult-top {
  width: 1280px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  padding: 50px 0 25px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-title {
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-title
  p {
  font-size: 22px;
  font-weight: 700;
  line-height: 31.86px;
  letter-spacing: -0.02em;
  text-align: left;
  color: #222222;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-box {
  display: flex;
  gap: 50px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .chk-box {
  display: flex;
  gap: 10px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list {
  display: flex;
  gap: 20px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item {
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  p.title {
  font-size: 14px;
  font-weight: 700;
  line-height: 20.27px;
  letter-spacing: -0.02em;
  color: #222222;
  margin-bottom: 15px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  p.title
  span {
  color: #d7000f;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  input {
  border: none;
  outline: none;
  border-bottom: 1px solid #dedede;
  height: 38px;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.02em;
  color: #aaaaaa;
  margin-bottom: 12px;
  box-sizing: border-box;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  input.empty {
  border-color: #d7000f;
  border-width: 2px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item:nth-child(1)
  input {
  width: 280px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item:nth-child(2)
  input {
  width: 250px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .check-box {
  /* display: flex;
  gap: 5px;
  align-items: center;
  cursor: pointer; */
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .check-box
  .check-area {
  width: 14px;
  height: 14px;
  border-radius: 100%;
  background-image: url(../img/check_off.svg);
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .check-box.on
  .check-area {
  background-image: url(../img/check_on.svg);
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .check-box
  .text-area {
  display: flex;
  align-items: center;
  gap: 5px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .check-box
  .text-area
  p {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.02em;
  color: #222222;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .check-box
  .text-area
  p
  span {
  color: #d7000f;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .check-box
  .text-area
  img {
  width: 16px;
  height: 16px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .agree-box {
  display: flex;
  gap: 5px;
  align-items: center;
  cursor: pointer;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .agree-box
  .agree-box-inner {
  display: flex;
  gap: 5px;
  align-items: center;
  cursor: pointer;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .agree-box {
  display: flex;
  gap: 5px;
  align-items: center;
  cursor: pointer;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .agree-box
  .agree-box-inner {
  display: flex;
  gap: 5px;
  align-items: center;
  cursor: pointer;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .agree-box
  .agree-box-inner
  .check_area {
  width: 14px;
  height: 14px;
  border-radius: 100%;
  background-image: url(../img/check_off.svg);
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .agree-box
  .agree-box-inner.on
  .check_area {
  background-image: url(../img/check_on.svg);
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .agree-box
  .agree-box-inner-all {
  display: flex;
  gap: 5px;
  align-items: center;
  cursor: pointer;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .agree-box
  .agree-box-inner-all
  .check_area {
  width: 14px;
  height: 14px;
  border-radius: 100%;
  background-image: url(../img/check_off.svg);
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .agree-box
  .agree-box-inner-all.on
  .check_area {
  background-image: url(../img/check_on.svg);
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .agree-box
  .agree-box-inner
  p {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.02em;
  color: #222222;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .agree-box
  .agree-box-inner
  p
  span {
  color: #fcaf18;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .agree-box
  .agree-box-inner
  .check_area {
  width: 14px;
  height: 14px;
  border-radius: 100%;
  background-image: url(../img/check_off.svg);
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .agree-box
  .agree-box-inner.on
  .check_area {
  background-image: url(../img/check_on.svg);
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .agree-box
  .agree-box-inner
  p {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.02em;
  color: #222222;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .agree-box
  .agree-box-inner
  p
  span {
  color: #d7000f;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .agree-box
  img#privacy-more {
  width: 16px;
  height: 16px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row {
  display: flex;
  gap: 5px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row
  .select-box {
  position: relative;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row
  .select-box
  .checked-option {
  height: 42px;
  border: 1px solid #dedede;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url(../img/down_arrow_lightgrey.svg);
  background-repeat: no-repeat;
  background-position: right 10px center;
  cursor: pointer;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row
  .select-box.brand-box
  .checked-option {
  width: 100px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row
  .select-box.model-box
  .checked-option {
  width: 145px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row
  .select-box
  .checked-option
  p {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.02em;
  color: #aaaaaa;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row
  .select-box
  .checked-option
  img {
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row
  .select-box
  .option-list {
  display: none;
  position: absolute;
  top: calc(100% - 1px);
  width: 100%;
  background: white;
  border: 1px solid #dedede;
  border-top: none;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row
  .select-box
  .option-list
  .option-item {
  cursor: pointer;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .consult-list
  .consult-item
  .select-row
  .select-box
  .option-list
  .option-item
  p {
  font-size: 12px;
  font-weight: 400;
  line-height: 40px;
  letter-spacing: -0.02em;
  color: #aaaaaa;
  text-align: center;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .submit-btn {
  width: 200px;
  height: 86px;
  background: #222222;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  cursor: pointer;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-top
  .consult-cont
  .submit-btn
  p {
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
  letter-spacing: -0.02em;
  color: white;
}

.container .container-inner .fixed-consult .consult-bar .consult-bottom {
  width: 100%;
  display: flex;
  height: 50px;
  min-width: 1280px;
}

.container .container-inner .fixed-consult .consult-bar .consult-bottom a {
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  border-radius: 10px 10px 0 0;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a
  .consult-inner {
  display: flex;
  gap: 10px;
  align-items: center;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a
  .consult-inner
  p {
  font-size: 14px;
  font-weight: 700;
  line-height: 20.27px;
  letter-spacing: -0.02em;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a.kakao-consult {
  background: #f4e81b;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a.kakao-consult
  .consult-inner {
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a.kakao-consult
  .consult-inner
  img {
  width: 23.85px;
  height: 22px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a.kakao-consult
  .consult-inner
  p {
  color: black;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a.phone-consult {
  background: #d7000f;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a.phone-consult
  .consult-inner {
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a.phone-consult
  .consult-inner
  img {
  width: 19.97px;
  height: 20px;
}

.container
  .container-inner
  .fixed-consult
  .consult-bar
  .consult-bottom
  a.phone-consult
  .consult-inner
  p {
  color: white;
}

/*  */
.container .container-inner .gnb_list {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 30px;
}

.container .container-inner .gnb_list a {
}

.container .container-inner .gnb_list a img {
  width: 20px;
}

.container .container-inner .gnb_list a p {
  font-size: 14px;
  font-weight: 400;
  line-height: 22.4px;
  letter-spacing: -0.02em;
  color: #777777;
  text-align: center;
}

.container .container-inner .gnb_list img.arrow {
  height: 20px;
}

/* popup */
.container .container-inner .popup_bg {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  background: #00000080;
  z-index: 2;
  display: none;
}

.container .container-inner .popup_bg .popup {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  box-sizing: border-box;
  background: white;
}

.container .container-inner .popup_bg .popup .popup_close {
  background-image: url(../img/close_btn_black.svg);
  background-repeat: no-repeat;
  background-size: cover;
  cursor: pointer;
}

.container .container-inner .term_popup_bg {
}

.container .container-inner .term_popup_bg .term_popup {
  padding: 50px;
  width: 600px;
}

.container .container-inner .term_popup_bg .term_popup .popup_close {
  width: 30px;
  height: 30px;
  position: absolute;
  right: 50px;
  top: 50px;
}

.container .container-inner .term_popup_bg .term_popup .popup_inner {
}

.container
  .container-inner
  .term_popup_bg
  .term_popup
  .popup_inner
  .popup_title {
  padding-bottom: 20px;
  border-bottom: 3px solid #222222;
}

.container
  .container-inner
  .term_popup_bg
  .term_popup
  .popup_inner
  .popup_title
  p {
  font-size: 22px;
  font-weight: 700;
  line-height: 31.86px;
  letter-spacing: -0.02em;
  color: #222222;
}

.container
  .container-inner
  .term_popup_bg
  .term_popup
  .popup_inner
  .popup_cont {
  margin-top: 20px;
  background: #f5f5f3;
  box-sizing: border-box;
}

.container
  .container-inner
  .term_popup_bg
  .term_popup.privacy_term_popup
  .popup_inner
  .popup_cont {
  padding: 20px;
  max-height: 480px;
  overflow-y: scroll;
}

.container
  .container-inner
  .term_popup_bg
  .term_popup.privacy_term_popup
  .popup_inner
  .popup_cont
  p {
  font-size: 16px;
  font-weight: 400;
  line-height: 23.17px;
  letter-spacing: -0.02em;
}

.container
  .container-inner
  .term_popup_bg
  .term_popup.email_term_popup
  .popup_inner
  .popup_cont {
  padding: 100px 15px;
}

.container
  .container-inner
  .term_popup_bg
  .term_popup.email_term_popup
  .popup_inner
  .popup_cont
  img {
  width: 70px;
  margin: 0 auto;
  display: block;
}

.container
  .container-inner
  .term_popup_bg
  .term_popup.email_term_popup
  .popup_inner
  .popup_cont
  p {
  font-size: 14px;
  font-weight: 400;
  line-height: 22.4px;
  letter-spacing: -0.02em;
  text-align: center;
  color: #222222;
  margin-top: 30px;
}

/*  */
.container .container-inner .submit_popup_bg .submit_popup {
  height: fit-content;
  box-shadow: 3.78px 3.78px 7.56px 0px #00000026;
  /* width: 340px; */
  width: 360px;
  border-radius: 10px;
}

.container .container-inner .submit_popup_bg .submit_popup .popup_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 20px;
  border-bottom: 1px solid #dedede;
  box-sizing: border-box;
}

.container .container-inner .submit_popup_bg .submit_popup .popup_top img {
  height: 30px;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_top
  .popup_close {
  width: 15px;
  height: 15px;
}

.container .container-inner .submit_popup_bg .submit_popup .popup_cont {
  padding: 15px 30px 30px;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  .cont_top {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  .cont_top
  img {
  height: 76px;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  .cont_top
  p {
  font-size: 18px;
  line-height: 21.05px;
  letter-spacing: -0.02em;
  text-align: center;
  font-weight: 400;
  width: fit-content;
  box-sizing: border-box;
  padding: 10px 0;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  .cont_top
  p
  span {
}

.container .container-inner .submit_popup_bg .submit_popup .popup_cont form {
  margin-top: 20px;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .input_box {
  margin-bottom: 11px;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .input_box
  p {
  font-size: 12px;
  font-weight: 700;
  line-height: 17.38px;
  letter-spacing: -0.05em;
  color: #222222;
  margin-bottom: 4px;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .input_box
  p
  span.yellow {
  color: #d7000f;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .input_box
  p
  span.grey {
  color: #777777;
  font-weight: 400;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .input_box
  input {
  border: 1px solid #dedede;
  padding: 12px 15px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 400;
  line-height: 14.63px;
  letter-spacing: -0.02em;
  color: #777777;
  outline: none;
  width: 100%;
  box-sizing: border-box;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .input_box
  input.empty {
  border-color: #d7000f;
  border-width: 2px;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .input_box
  textarea {
  width: 100%;
  box-sizing: border-box;
  border: 0.76px solid #dedede;
  border-radius: 3.82px;
  padding: 8px 15px;
  height: 75px;
  resize: none;
  outline: none;

  font-size: 12px;
  font-weight: 400;
  line-height: 17.38px;
  letter-spacing: -0.02em;
  color: #aaaaaa;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .input_box
  .agree-box {
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box {
  display: flex;
  gap: 3px;
  cursor: pointer;
  align-items: center;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box
  .agree-box-inner {
  display: flex;
  gap: 3px;
  align-items: center;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box
  .agree-box-inner
  .check_area {
  background-image: url(../img/agree_off.svg);
  width: 13.76px;
  height: 13.76px;
  background-repeat: no-repeat;
  background-size: cover;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box
  .agree-box-inner.on
  .check_area {
  background-image: url(../img/agree_on.svg);
  height: 15px;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box
  .agree-box-inner-all {
  display: flex;
  gap: 3px;
  align-items: center;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box
  .agree-box-inner-all
  .check_area {
  background-image: url(../img/agree_off.svg);
  width: 13.76px;
  height: 13.76px;
  background-repeat: no-repeat;
  background-size: cover;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box
  .agree-box-inner-all.on
  .check_area {
  background-image: url(../img/agree_on.svg);
  height: 15px;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box
  .agree-box-inner-all
  p {
  font-size: 12px;
  font-weight: 400;
  line-height: 16.34px;
  letter-spacing: -0.05em;
  color: #222222;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box
  .agree-box-inner
  p {
  font-size: 12px;
  font-weight: 400;
  line-height: 16.34px;
  letter-spacing: -0.05em;
  color: #222222;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .agree-box
  a {
  font-size: 12px;
  font-weight: 400;
  line-height: 16.34px;
  letter-spacing: -0.05em;
  color: #d7000f;
  text-decoration: underline;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .submit_btn {
  height: 60px;
  background: #d7000f;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 180px;
  margin: 20px auto 0;
  box-sizing: border-box;
}

.container
  .container-inner
  .submit_popup_bg
  .submit_popup
  .popup_cont
  form
  .submit_btn
  p {
  color: var(--BNK-Point3, #f3f4f8);
  text-align: right;
  font-family: Pretendard;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.7px;
}

/* 240925 */
.alert-bg {
  width: 100%;
  height: 100%;
  background: rgb(0, 0, 0, 0.6);
  position: fixed;
  z-index: 4;
  left: 0;
  top: 0;
  display: none;
}

.alert-bg .alert-box {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  padding: 70px 25px 35px;
  box-shadow: 5.89156px 5.89156px 11.7831px rgb(0 0 0 / 30%);
  max-width: 360px;
  min-height: 200px;
  border-radius: 12px;
  box-sizing: border-box;
  position: relative;
}

.alert-bg .alert-box .alert-inner {
  width: 310px;
}

.alert-bg .alert-box .alert-inner .alert-close {
  background-image: url(../img/btn_popup_close.png);
  background-repeat: no-repeat;
  background-size: 24px;
  background-position: center;
  width: 50px;
  height: 50px;
  position: absolute;
  right: 10px;
  top: 12px;
  cursor: pointer;
}

.alert-bg .alert-box .alert-inner img {
  width: 60px;
  height: 60px;
  display: block;
  margin: 0 auto 26px;
}

.alert-bg .alert-box .alert-inner p.alert-title {
  word-break: keep-all;
  font-style: normal;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
  letter-spacing: -0.02em;
  color: #222222;
}

.alert-bg .alert-box .alert-inner a.alert-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  min-width: 110px;
  min-height: 56px;
  padding: 13px 20px;
  border-radius: 8px;
  background-color: #d7000f;
  box-sizing: border-box;
  width: fit-content;
  height: fit-content;
  margin: 30px auto 0;
}

.alert-bg .alert-box .alert-inner a.alert-btn p {
  font-style: normal;
  font-size: 18px;
  letter-spacing: -0.02em;
  color: black;
}

.alert-bg .alert-box .alert-inner a.alert-btn:hover {
  background-color: #ffdb57;
}

.alert-bg .alert-box .alert-inner a.alert-btn:hover p {
}

/* 241022 */

.modal-bg {
  width: 100%;
  height: 100%;
  background: rgb(0, 0, 0, 0.6);
  position: fixed;
  z-index: 4;
  left: 0;
  top: 0;
  display: none;
}

.modal-bg .modal-box {
  box-shadow: 5px 10px 30px 0px #00000033;
  background: white;
  width: 450px;
  height: fit-content;
  padding: 39px 25px 20px;
  border-radius: 5px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  box-sizing: border-box;
}

.modal-bg .modal-box .modal-close {
  width: 14px;
  height: 14px;
  position: absolute;
  right: 20px;
  top: 20px;
  cursor: pointer;
}

.modal-bg .modal-box .modal-close img {
  width: 100%;
}

.modal-bg .modal-box .modal-inner {
  display: none;
}

.modal-bg .modal-box .modal-inner p span {
  color: #d7000f;
}

.modal-bg .modal-box .modal-inner p span.grey {
  color: #777777;
  font-weight: 400;
  line-height: 22px;
}

.modal-bg .modal-box .modal-inner .modal-title {
}

.modal-bg .modal-box .modal-inner .modal-title p.txt1 {
  font-size: 22px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: -0.02em;
  width: fit-content;
  background: linear-gradient(white 65%, #f5f5f3 35%);
}

.modal-bg .modal-box .modal-inner .modal-title p.txt2 {
  font-size: 14px;
  font-weight: 400;
  line-height: 20.72px;
  letter-spacing: -0.02em;
  color: #222222;
  margin-top: 5px;
}

.modal-bg .modal-box .modal-inner .modal-cont {
  border: 1px solid #dedede;
  padding: 20px 25px;
  margin-top: 10px;
}

.modal-bg .modal-box .modal-inner .modal-cont p.txt1 {
  font-size: 14px;
  font-weight: 700;
  line-height: 20.72px;
  letter-spacing: -0.02em;
  color: #222222;
  margin-top: 16px;
  text-indent: -15px;
}

.modal-bg .modal-box .modal-inner .modal-cont p.txt1::before {
  content: "•";
  margin-right: 8px;
  color: black;
  font-size: 1.2em;
}

.modal-bg .modal-box .modal-inner .modal-cont p.txt2 {
  margin-top: 5px;
  font-size: 12px;
  font-weight: 400;
  line-height: 17.76px;
  letter-spacing: -0.02em;
}

.modal-bg .modal-box .modal-inner .modal-cont p.txt1:first-child {
  margin-top: 0;
}

/* animation */
@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

@keyframes bounceBall {
  0% {
    transform: translate(-50%, -15px);
  }

  10% {
    transform: translate(-50%, 0);
  }

  20% {
    transform: translate(-50%, -10px);
  }

  30% {
    transform: translate(-50%, 0);
  }

  40% {
    transform: translate(-50%, -5px);
  }

  50% {
    transform: translate(-50%, 0);
  }

  100% {
    transform: translate(-50%, 0);
  }
}

@keyframes bounceBox1 {
  0% {
    bottom: calc(100% + 11px);
  }

  10% {
    bottom: calc(100% - 4px);
  }

  20% {
    bottom: calc(100% + 6px);
  }

  30% {
    bottom: calc(100% - 4px);
  }

  40% {
    bottom: calc(100% + 1px);
  }

  50% {
    bottom: calc(100% - 4px);
  }

  100% {
    bottom: calc(100% - 4px);
  }
}

@keyframes bounceBox2 {
  0% {
    right: calc(100% + 10px);
  }

  10% {
    right: calc(100% - 5px);
  }

  20% {
    right: calc(100% + 5px);
  }

  30% {
    right: calc(100% - 5px);
  }

  40% {
    right: calc(100%);
  }

  50% {
    right: calc(100% - 5px);
  }

  100% {
    right: calc(100% - 5px);
  }
}

@keyframes bounceBox3 {
  0% {
    right: 25px;
  }

  10% {
    right: 10px;
  }

  20% {
    right: 20px;
  }

  30% {
    right: 10px;
  }

  40% {
    right: 15px;
  }

  50% {
    right: 10px;
  }

  100% {
    right: 10px;
  }
}

@keyframes disappear {
  0% {
    display: 1;
  }

  50% {
    opacity: 1;
  }

  51% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes shine {
  0% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 0%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 0%
    );
  }

  0.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 3.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 10%
    );
  }

  1% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 7%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 20%
    );
  }

  1.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 10.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 30%
    );
  }

  2% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 14%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 40%
    );
  }

  2.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 17.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 50%
    );
  }

  3% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 21%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 60%
    );
  }

  3.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 24.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 70%
    );
  }

  4% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 28%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 80%
    );
  }

  4.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 31.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 90%
    );
  }

  5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 35%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 100%
    );
  }

  5.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 38.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 110%
    );
  }

  6% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 42%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 120%
    );
  }

  6.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 45.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 130%
    );
  }

  7% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 49%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 140%
    );
  }

  7.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 52.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 150%
    );
  }

  8% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 56%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 160%
    );
  }

  8.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 59.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 170%
    );
  }

  9% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 63%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 180%
    );
  }

  9.5% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 66.5%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 190%
    );
  }

  10% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 70%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 200%
    );
  }

  100% {
    mask: linear-gradient(
      to right top,
      rgb(0, 0, 0) 70%,
      rgba(255, 255, 255, 0.33),
      rgb(0, 0, 0) 200%
    );
  }
}