main p {
  margin-bottom: 0;
}
main #banner {
  height: 260px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
main #banner .container {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
main #banner .container p {
  font-size: 38px;
  font-style: normal;
  font-family: "Semi";
  line-height: normal;
  text-transform: uppercase;
}
main #breadcrumb .container {
  border-bottom: 1px solid var(--white-3, #ecf2f7);
}
main #breadcrumb .container .breadcrumb {
  border-bottom: 0;
  margin-bottom: 0;
}
main #breadcrumb .container .breadcrumb .item-breadcrumb-home a {
  font-size: 0.875rem;
}
main #breadcrumb .container .breadcrumb .item-breadcrumb-home span {
  font-size: 0.875rem;
}
main #form {
  margin-top: 40px;
}
main #form .container {
  border-radius: 12px;
  overflow: hidden;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
main #form .container .formWrapper {
  padding: 40px 40px 0 40px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
main #form .container .formWrapper .left {
  display: flex;
  flex-direction: column;
}
main #form .container .formWrapper .left .title {
  color: var(--main-1);
  font-size: 38px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  text-transform: uppercase;
}
main #form .container .formWrapper .left .subTitle {
  margin-top: 8px;
  color: var(--black-1);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #form .container .formWrapper .left .contactWrapper {
  margin-top: 20px;
  margin-bottom: 12px;
  display: flex;
  align-items: start;
  gap: 32px;
}
main #form .container .formWrapper .left .contactWrapper .item {
  display: flex;
  align-items: start;
  gap: 8px;
}
main #form .container .formWrapper .left .contactWrapper .item .right .title {
  color: var(--black-1);
  font-family: "Regular";
  font-size: 16px;
  font-style: normal;
  line-height: normal;
}
main #form .container .formWrapper .left .contactWrapper .item .right .subTitle {
  color: var(--main-1);
  font-family: "Semi";
  font-size: 18px;
  font-style: normal;
  line-height: normal;
}
main #form .container .formWrapper .left .imageWrapper {
  margin-top: auto;
}
main #form .container .formWrapper .left .imageWrapper img {
  width: auto;
  aspect-ratio: contain;
}
main #form .container .formWrapper .right {
  padding-bottom: 58px;
}
main #form .container .formWrapper .right .inputContainer {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
main #form .container .formWrapper .right .inputContainer .inputWrapper p {
  color: var(--black-1);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #form .container .formWrapper .right .inputContainer .inputWrapper input {
  margin-top: 8px;
  padding: 12px;
  border: none;
  border-radius: 8px;
  background-color: #fff;
  color: var(--black-3, #6d727c);
  font-size: 18px;
  width: 100%;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #form .container .formWrapper .right .inputContainer .selectWrapper p {
  color: var(--black-1);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #form .container .formWrapper .right .inputContainer .selectWrapper select {
  margin-top: 8px;
  padding: 12px;
  border: none;
  border-right: 10px solid #fff;
  border-radius: 8px;
  background-color: #fff;
  color: var(--black-3, #6d727c);
  font-size: 18px;
  width: 100%;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #form .container .formWrapper .right .inputContainer .textAreaWrapper {
  grid-column: span 2;
}
main #form .container .formWrapper .right .inputContainer .textAreaWrapper p {
  color: var(--black-1);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #form .container .formWrapper .right .inputContainer .textAreaWrapper textarea {
  margin-top: 8px;
  padding: 12px;
  border: none;
  border-radius: 8px;
  background-color: #fff;
  color: var(--black-3, #6d727c);
  font-size: 18px;
  width: 100%;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #form .container .formWrapper .right .policy {
  margin-top: 8px;
  color: var(--black-1);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #form .container .formWrapper .right .policy a {
  text-decoration: underline;
}
main #form .container .formWrapper .right .submit {
  color: var(--white-1);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  text-transform: uppercase;
  padding: 14px 24px;
  background-color: var(--main-1);
  border: none;
  border-radius: 12px;
  width: 100%;
  margin-top: 12px;
  transition: background-color 0.5s ease-in-out;
}
main #form .container .formWrapper .right .submit:hover {
  background-color: #000d4c;
}
main #map {
  margin-top: 40px;
  margin-bottom: 72px;
}
main #map .container .mapDivide {
  display: flex;
  gap: 16px;
}
main #map .container .mapDivide .left {
  width: 40%;
}
main #map .container .mapDivide .left .title {
  color: var(--black-1, #061020);
  font-family: "Semi";
  font-size: 24px;
  font-style: normal;
  line-height: normal;
  text-transform: uppercase;
}
main #map .container .mapDivide .left .addressWrapper {
  margin-top: 16px;
  overflow: hidden;
  border: 2px solid #051568;
  border-radius: 12px;
}
main #map .container .mapDivide .left .addressWrapper .item {
  cursor: pointer;
  display: flex;
  gap: 8px;
  align-items: start;
  padding: 6px;
  background-color: #fff;
}
main #map .container .mapDivide .left .addressWrapper .item .right .name {
  color: var(--main-1);
  font-family: "Regular";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #map .container .mapDivide .left .addressWrapper .item .right .address {
  margin-top: 4px;
  color: var(--main-1);
  font-size: 16px;
  font-style: normal;
  font-family: "Semi";
  line-height: normal;
}
main #map .container .mapDivide .left .addressWrapper .item-active {
  display: flex;
  gap: 8px;
  align-items: start;
  padding: 12px;
  background-color: var(--main-1);
}
main #map .container .mapDivide .left .addressWrapper .item-active svg path {
  fill: #fff;
}
main #map .container .mapDivide .left .addressWrapper .item-active .right .name {
  color: #fff;
  font-family: "Regular";
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
main #map .container .mapDivide .left .addressWrapper .item-active .right .address {
  margin-top: 4px;
  color: #fff;
  font-size: 1.125rem;
  font-style: normal;
  font-family: "Semi";
  line-height: normal;
}
main #map .container .mapDivide .content_mapContainer {
  flex: 1;
  position: relative;
}
main #map .container .mapDivide .content_mapContainer .mapContainer {
  position: sticky;
  left: 0px;
  top: 90.19px;
  width: 100%;
  border-radius: 12px;
  overflow: hidden;
}
main #map .container .mapDivide .content_mapContainer .mapContainer iframe {
  width: 100%;
  height: 464px;
}
main #map .container .contact {
  margin-top: 40px;
  text-align: center;
}
main #map .container .contact a {
  padding: 16px 128px 14px;
  background-color: var(--main-1);
  border: none;
  border-radius: 12px;
  margin-top: 12px;
  transition: background-color 0.5s ease-in-out;
}
main #map .container .contact a span {
  position: relative;
  padding-left: 40px;
  color: var(--white-1);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  text-transform: uppercase;
  margin-left: 8px;
}
main #map .container .contact a span svg {
  position: absolute;
  top: -3px;
  left: 0px;
}
main #map .container .contact a:hover {
  background-color: #000d4c;
}
main .connect {
  margin: 2.5rem 0;
}
main .contentPage .container {
  padding: 0px;
}

@media only screen and (max-width: 1024px) {
  main #breadcrumb {
    display: none;
  }
  main #form {
    padding: 0 16px;
  }
  main #form .container .formWrapper .left .imageWrapper {
    display: none;
  }
  main #form .container .formWrapper {
    grid-template-columns: repeat(1, 1fr);
    padding: 20px 0;
  }
  main #form .container .formWrapper .right {
    margin-top: 12px;
    padding-bottom: 0;
  }
  main #form .container .formWrapper .left .contactWrapper .item {
    align-items: start;
  }
  main #form .container .formWrapper .left .contactWrapper {
    gap: 20px;
  }
  main #form .container .formWrapper .left .contactWrapper .item .right .subTitle {
    font-size: 16px;
    margin-top: 0px;
  }
  main #form .container .formWrapper .left .contactWrapper .item .right .title {
    font-size: 12px;
  }
  main #form .container .formWrapper .left .title {
    font-size: 24px;
    font-family: "Semi";
  }
  main #form .container .formWrapper .right .inputContainer {
    grid-template-columns: repeat(1, 1fr);
  }
  main #form .container .formWrapper .right .inputContainer .textAreaWrapper {
    grid-column: span 1;
  }
  main #map .container .contact {
    display: none;
  }
  main #map .container .mapDivide {
    flex-direction: column;
  }
  main #map .container .mapDivide .left {
    width: 100%;
  }
  main #map .container .mapDivide .mapContainer {
    flex: auto;
    height: auto;
    aspect-ratio: 4/2;
  }
  main .contentPage .container {
    padding: 0 1rem;
  }
  main #map .container .mapDivide .left .title {
    font-size: 1.5rem;
  }
  main .connect {
    margin: 2rem 0;
  }
}
@media only screen and (max-width: 550px) {
  main {
    margin-bottom: 2rem;
  }
  main #banner {
    background-image: none !important;
    height: auto;
  }
  main #banner .container {
    display: block;
    height: auto;
  }
  main #banner .container p {
    padding: 1.25rem 0;
    color: var(--black-1, #061020);
    font-family: "Semi";
    font-size: 1.5rem;
    font-style: normal;
    line-height: normal;
    text-transform: uppercase;
    border-bottom: 1px solid var(--white-3, #ECF2F7);
  }
}

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