/*!****************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[3]!./app/(kta)/[locale]/globals.css ***!
  \****************************************************************************************************************************************************************************************************************************************************************************/
/* @tailwind base;
@tailwind components;
@tailwind utilities; */

/* :root {
  --foreground-rgb: 0, 0, 0;
  --background-start-rgb: 214, 219, 220;
  --background-end-rgb: 255, 255, 255;
} */


@font-face {
  font-family: okbank_light;
  src: url(/_next/static/media/Pretendard-Light.4c4010ae.otf)
    format('truetype');
}
@font-face {
  font-family: okbank;
  src: url(/_next/static/media/Pretendard-Regular.6f4ca084.otf)
    format('truetype');
}
@font-face {
  font-family: okbank_bold;
  src: url(/_next/static/media/Pretendard-Bold.63f44d36.otf) format('truetype');
}

@font-face {
  font-family: okbank_med;
  src: url(/_next/static/media/Pretendard-Medium.95684b27.otf)
    format('truetype');
}
/* html {
	font-family: okbank;
} */
.bg1 {
  background-image: url(/_next/static/media/bg1.4212282c.png);
  background-position: bottom;
  background-repeat: no-repeat;
  display: block;
  background-size: contain;
  margin-bottom: -150px;
  margin-top: -50px;
}

.form-control:focus {
  border-color: transparent !important;
  box-shadow: 0 0 0 0.2rem rgba(248, 107, 47, 0.25) !important;
}
.bgbg {
  background-image: url(/_next/static/media/bgkta2.d6d4f694.webp);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.bgbgm {
  background-image: url(/_next/static/media/bgkta2mobile.6392e130.webp);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.cardred {
  background: rgb(233, 125, 101);
  background: linear-gradient(
    180deg,
    rgba(233, 125, 101, 1) 0%,
    rgba(255, 107, 44, 1) 100%
  );
}

/* Customize the next button icon */
.swiper-button-prev::after {
  color: black;
}
.swiper-button-next::after {
  color: black;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Works for Firefox */
input[type='number'] {
  -moz-appearance: textfield;
}
.cc-judul {
  font-size: 14px;
  color: #909090;
}

.cc-isi {
  font-size: 24px;
  font-weight: bold;
}
.step2-judul {
  font-size: 48px;
}
.sb-judul {
  font-size: 48px;
}
.sb-sub {
  font-size: 48px;
}
/* .card-body:focus {
  border: none !portant;
} */

input[type='text']:disabled {
  background-color: rgba(242, 242, 242, 255);
}
input[type='number']:disabled {
  background-color: rgba(242, 242, 242, 255);
}
input[type='email']:disabled {
  background-color: rgba(242, 242, 242, 255);
}

.flr {
  position: relative;
}
.noglow:focus {
  border: none !important;
  box-shadow: none !important;
}
.noglow:active {
  border: none !important;
  box-shadow: none !important;
}

.floating-label {
  position: absolute;
  pointer-events: none;
  transition: 0.2s ease all;
  top: 50%;
  transform: translateY(-50%);
  font-size: 16px;
  color: #888;
  margin-left: 10px;
}

.floating-label.active {
  transform: translateY(-120%);
  font-size: 12px;
  color: #333;
}
.w-adj {
  width: 62vw;
}
.customs-phone {
  height: auto;
  position: absolute;
  margin-top: -25%;
  right: 0;
}

.active {
  background-color: #e5e7eb;
  border: 1px solid black;
}
.active:hover {
  background-color: #f55000;
  border: 1px solid #f55000;
  color: white;
}
.active:focus {
  background-color: #f55000;
  border: 1px solid #f55000;
  color: white;
}

.tombol-lp {
  background-color: #e5e7eb;
  border: 1px solid black;
}
.tombol-lp:hover {
  background-color: #f55000;
  border: 1px solid #f55000;
  color: white;
}
.tombol-lp:focus {
  background-color: #f55000;
  border: 1px solid #f55000;
  color: white;
}

@media only screen and (max-width: 1200px) {
  .image-off {
    /* margin-right: -3rem; */
    /* z-index: 1; */
    height: 100%;
  }
  .cc-judul {
    font-size: 14px;
  }
  /* .carding {
    z-index: ;
  } */
  .cc-isi {
    font-size: 24px;
    font-weight: bold;
  }
  .step2-judul {
    font-size: 48px;
  }
  .w-adj {
    width: 80vw;
  }
}

@media only screen and (max-width: 992px) {
  .bg1 {
    margin-bottom: 0px;
    background-image: none;
    display: none;
  }
  .cc-judul {
    font-size: 12px;
  }
  .cc-isi {
    font-size: 16px;
    font-weight: bold;
  }
  .w-adj {
    width: 80vw;
  }
}

@media only screen and (max-width: 768px) {
  .image-off {
    /* margin-right: 0; */
    /* z-index: 0; */
    height: 100%;
  }
  .bg1 {
    margin-bottom: 0px;
    background-image: none;
    display: none;
  }
  .cc-judul {
    font-size: 12px;
  }
  .cc-isi {
    font-size: 16px;
    font-weight: bold;
  }
  .step2-judul {
    font-size: 32px;
  }
  /* .hk-halo{
    font-size: 40px;
  }
  .hk-status{
    font-size: 20px;
  } */
  .w-adj {
    width: 80vw;
  }
}
@media only screen and (max-width: 576px) {
  .cc-judul {
    font-size: 12px;
  }
  .cc-isi {
    font-size: 16px;
    font-weight: bold;
  }
  .bg1 {
    margin-bottom: 0px;
    background-image: none;
    display: none;
  }
  .step2-judul {
    font-size: 32px;
  }
  /* .hk-halo{
    font-size: 40px;
  }
  .hk-status{
    font-size: 20px;
  } */
  .w-adj {
    width: 90vw;
  }
}

::-moz-placeholder {
  color: #e9e9e9;
  opacity: 1; /* Firefox */
}

::placeholder {
  color: #e9e9e9;
  opacity: 1; /* Firefox */
}

::-moz-placeholder {
  color: red;
  opacity: 1; /* Firefox */
}

::placeholder {
  color: red;
  opacity: 1; /* Firefox */
}
::-ms-input-placeholder {
  /* Edge 12 -18 */
  color: red;
}