/*=============================================================================================
    Company    : PT Web Architect Technology - webarq.com
    Document   : Stylesheet
    Author     : Your Name
==============================================================================================*/
/* helper
----------------------------------------------------------------------------------------------*/
/*!
 * Milligram-scss v1.3.0
 * https://milligram.github.io
 *
 * Copyright (c) 2017 CJ Patoilo
 * Licensed under the MIT license
 */
/* general
----------------------------------------------------------------------------------------------*/
/* header
----------------------------------------------------------------------------------------------*/
.offcanvas-overlay{
  display: none;
}
.popup {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.7);
  overflow-y: auto;
}

.popup>.overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.popup .popup-content {
  position: relative;
  max-width: 630px;
  height: auto;
  margin: auto;
  background-color: #fff;
  border-radius: 24px;
  z-index: 2;
}

.popup .popup-content .popup-header .popup-close {
  cursor: pointer;
  position: absolute;
  top: 24px;
  right: 24px;
  line-height: 0;
}

.popup .popup-content .popup-body {
  width: 100%;
  height: 100%;
  padding: 64px 36px 64px 56px;
  overflow: hidden;
}

.navbar {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: space-between;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 80px;
  max-height: 80px;
  background: #fff;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease-out;
  z-index: 99;
}

.navbar>.wrapper {
  display: flex;
  flex-wrap: inherit;
  align-items: stretch;
  justify-content: space-between;
}

.navbar-logo {
  padding: 0;
  margin: 0;
  text-decoration: none;
  white-space: nowrap;
}

.navbar-logo a {
  display: flex;
  align-items: center;
  height: 100%;
}

.navbar-collapse {
  position: relative;
}

.navbar-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  font-family: "Heebo";
  margin: 0;
}

.navbar-nav .nav-item {
  margin: 0;
}

.navbar-nav .nav-item:hover .nav-link,
.navbar-nav .nav-item:hover .nav-search,
.navbar-nav .nav-item:hover .nav-lang,
.navbar-nav .nav-item.active .nav-link,
.navbar-nav .nav-item.active .nav-search,
.navbar-nav .nav-item.active .nav-lang {
  color: #CC141A;
}

.navbar-nav .nav-item:hover .nav-link::after,
.navbar-nav .nav-item.active .nav-link::after {
  width: 50%;
}

.navbar-nav .nav-link,
.navbar-nav .nav-search,
.navbar-nav .nav-lang {
  position: relative;
  display: flex;
  align-items: center;
  font-weight: 500;
  line-height: 24px;
  padding: 28px 15px;
  transition: all 0.15s ease-in-out;
}

.navbar-nav .nav-link {
  position: relative;
  font-size: 14px;
  text-transform: uppercase;
  color: #212121;
}

.navbar-nav .nav-link::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 4px;
  background: #E11C22;
  transform: translateX(-50%);
  transition: all 0.25s ease-out;
}

.navbar-nav .nav-arrow {
  display: none;
}

.navbar-nav .nav-search {
  padding: 0 15px;
  font-size: 24px;
  line-height: 0;
  color: #212121;
  height: auto;
  margin: 0;
  background-color: transparent;
  border: none;
}

.navbar-nav .nav-lang {
  font-size: 11px;
  color: #999999;
  padding-left: 0;
  padding-right: 0;
  cursor: pointer;
}

.navbar-nav .nav-lang i {
  font-size: 24px;
  margin-right: 2px;
}

@media (hover: hover) {

  .navbar-nav .nav-item.dropdown:hover .dropdown-menu,
  .navbar-nav .nav-item.dropdown:hover .dropdown-menu-lg {
    visibility: visible;
    opacity: 1;
  }
}

.dropdown .dropdown-menu {
  position: absolute;
  top: 60px;
  right: 0;
  width: auto;
  padding: 8px 0px;
  background-color: #fff;
  box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  z-index: -1;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease-out;
}

.dropdown .dropdown-menu ul,
.dropdown .dropdown-menu li {
  margin: 0;
}

.dropdown .dropdown-menu-lg {
  font-family: "Outfit";
  position: fixed;
  top: 0;
  left: 50%;
  width: 100vw;
  padding: 112px 0px 64px;
  transform: translateX(-50%);
  background-color: #fff;
  box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.1);
  z-index: -1;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease-out;
}

.dropdown .dropdown-menu-lg .bg-line {
  position: absolute;
  top: 112px;
  bottom: 0;
  right: 0;
  width: 96px;
}

.dropdown .dropdown-menu-lg .bg-line .line-solid {
  position: absolute;
  top: 0;
  right: 0;
  width: 96px;
  height: 71px;
  border-top: 2px solid #d5d5d5;
  border-left: 2px solid #d5d5d5;
  border-top-left-radius: 40px;
}

.dropdown .dropdown-menu-lg .bg-line .line-dashed {
  position: absolute;
  top: 71px;
  bottom: 0;
  right: 0;
  width: 96px;
  border-left: 2px dashed #d5d5d5;
}

.dropdown .dropdown-menu-lg .bg-line .line-point {
  top: 71px;
  left: -7px;
  margin: 0;
}

.dropdown .dropdown-menu-lg .row {
  margin-left: -50px;
}

.dropdown .dropdown-menu-lg .row .column {
  padding: 0 50px;
}

.dropdown .dropdown-menu-lg .row .column *:last-child {
  margin-bottom: 0;
}

.dropdown .dropdown-menu-lg .nav-link-title {
  font-weight: 700;
  font-size: 24px;
  line-height: 36px;
  color: #203475;
  margin-bottom: 16px;
}

.dropdown .dropdown-menu-lg p {
  font-weight: 300;
  font-size: 16px;
  line-height: 26px;
  margin-bottom: 24px;
}

.dropdown .dropdown-item {
  display: block;
}

.dropdown .dropdown-item .dropdown-link {
  font-size: 14px;
  color: #212121;
  padding: 8px 24px;
  transition: all 0.15s ease-in-out;
}

.dropdown .dropdown-item:hover .dropdown-link {
  color: #CC141A;
}

.dropdown .dropdown-item.active .dropdown-link {
  color: #CC141A;
}

.navbar-search {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  background: #fff;
  z-index: 100;
}

.navbar-search .input-group {
  font-family: "Outfit";
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  height: 100%;
}

.navbar-search .input-group i {
  font-size: 24px;
}

.navbar-search .input-group .ic-search {
  color: #E11C22;
}

.navbar-search .input-group input {
  font-weight: 400;
  font-size: 20px;
  line-height: 24px;
  margin: 0;
  padding: 18px;
  border: none;
}

.navbar-search .input-group input::-moz-placeholder {
  color: #D4D4D4;
}

.navbar-search .input-group input:-ms-input-placeholder {
  color: #D4D4D4;
}

.navbar-search .input-group input::placeholder {
  color: #D4D4D4;
}

.navbar-search .input-group button {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-weight: 500;
  font-size: 14px;
  line-height: 24px;
  color: #999999;
  margin: 0;
  background: transparent;
  border: none;
  padding: 0;
  margin-left: 28px;
}

.navbar-search .input-group button i {
  margin-left: 8px;
}

.navbar-other .nav-search {
  display: none;
}

.navbar-lang {
  display: none;
}

.navbar-toggle {
  display: none;
}

.floating-chat {
  position: fixed;
  width: 109px;
  height: 129px;
  right: 24px;
  bottom: 60px;
  z-index: 89;
  transition: all 0.2s ease-out;
  display: none;
}

.cookies-box {
  position: fixed;
  width: 100%;
  bottom: 0;
  left: 0;
  background: rgba(20, 36, 94, 0.9);
  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.08);
  padding: 16px 0;
  z-index: 999;
}

.cookies-box .wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.cookies-box .wrapper p {
  color: #fff;
  margin-bottom: 0;
}

.cookies-box .wrapper p a {
  color: #fff;
  font-weight: 700;
  text-decoration: underline;
}

.cookies-box .wrapper button {
  margin-bottom: 0;
  height: 40px;
  line-height: 38px;
}

.cookies-box .wrapper button:hover {
  background: #fff;
  border-color: #fff;
  color: #14245E;
}

/* footer
----------------------------------------------------------------------------------------------*/
footer {
  box-shadow: inset 0px 1px 0px #EEEEEE;
}

footer h5 {
  font-weight: 700;
  font-size: 1rem;
  line-height: 22px;
  margin-bottom: 16px;
  letter-spacing: -0.01em;
  color: #4D4D4D;
}

footer .footer-top {
  padding: 97px 0 62px;
}

footer .footer-top .wrap-footer-top {
  display: flex;
  flex-wrap: wrap;
}

footer .footer-top .wrap-footer-top__left {
  width: 235px;
}

footer .footer-top .wrap-footer-top__left h5 {
  margin-bottom: 24px;
}

footer .footer-top .wrap-footer-top__left .box-cs {
  margin-bottom: 24px;
}

footer .footer-top .wrap-footer-top__left .box-cs p {
  margin-bottom: 8px;
  line-height: normal;
  line-height: 0.6;
}

footer .footer-top .wrap-footer-top__left .box-cs p a {
  display: inline-flex;
  align-items: center;
  color: #4D4D4D;
  font-weight: 500;
}

footer .footer-top .wrap-footer-top__left .box-cs p a:hover {
  color: #CC141A;
}

footer .footer-top .wrap-footer-top__left .box-cs p a i {
  width: 32px;
  height: 32px;
  margin-right: 12px;
}

footer .footer-top .wrap-footer-top__left .box-cs p a i img {
  width: 100%;
}

footer .footer-top .wrap-footer-top__left .box-socmed {
  display: flex;
  align-items: center;
}

footer .footer-top .wrap-footer-top__left .box-socmed a {
  width: 44px;
  height: 44px;
  margin-right: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

footer .footer-top .wrap-footer-top__left .box-socmed a:last-child {
  margin-right: 0;
}

footer .footer-top .wrap-footer-top__left .box-socmed a img {
  transition: all 0.2s ease-out;
}

footer .footer-top .wrap-footer-top__left .box-socmed a:hover img {
  transform: scale(1.1);
}

footer .footer-top .wrap-footer-top__right {
  width: calc(100% - 235px);
  padding-left: 202px;
}

footer .footer-top .wrap-footer-top__right .box-nav {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -40px 53px;
}

footer .footer-top .wrap-footer-top__right .box-nav__column {
  width: calc(33.3333333333% - 80px);
  margin: 0 40px;
  align-self: self-start;
  margin-bottom: 28px;
}

footer .footer-top .wrap-footer-top__right .box-nav__column .nav-foot {
  margin-bottom: 40px;
}

footer .footer-top .wrap-footer-top__right .box-nav__column .nav-foot ul {
  margin: 0;
}

footer .footer-top .wrap-footer-top__right .box-nav__column .nav-foot ul li {
  line-height: normal;
  margin: 0;
}

footer .footer-top .wrap-footer-top__right .box-nav__column .nav-foot ul li a {
  display: inline-block;
  padding: 6px 0;
  color: #4D4D4D;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 15px;
  transition: all 0.2s ease-out;
}

footer .footer-top .wrap-footer-top__right .box-nav__column .nav-foot ul li a:hover {
  color: #E11C22;
}

footer .footer-top .wrap-footer-top__right .box-nav__column .nav-foot ul li:first-child a {
  padding-top: 0;
}

footer .footer-top .wrap-footer-top__right .box-nav__column .nav-foot ul li:last-child a {
  padding-bottom: 0;
}

footer .footer-top .wrap-footer-top__right .box-nav__column .nav-foot:last-child {
  margin-bottom: 0;
}

footer .footer-top .wrap-footer-top__right .box-app h6 {
  margin-bottom: 17px;
}

footer .footer-top .wrap-footer-top__right .box-app__list {
  display: flex;
}

footer .footer-top .wrap-footer-top__right .box-app__list a {
  margin-right: 12px;
  display: inline-flex;
}

footer .footer-top .wrap-footer-top__right .box-app__list a:last-child {
  margin-right: 0;
}

footer .footer-top .wrap-footer-top__bottom {
  padding-left: 437px;
}

footer .footer-bottom {
  padding: 16px 0 13px;
  background: #f8f8f8;
}

footer .footer-bottom .wrap-footer-bottom {
  display: flex;
  justify-content: space-between;
}

footer .footer-bottom .wrap-footer-bottom__left .copyright {
  margin: 0;
  line-height: normal;
  font-size: 0.75rem;
  font-weight: 400;
  color: #4D4D4D;
}

footer .footer-bottom .wrap-footer-bottom__left .copyright a {
  color: #4D4D4D;
  transition: all 0.2s ease-out;
}

footer .footer-bottom .wrap-footer-bottom__left .copyright a:hover {
  color: #E11C22;
}

footer .footer-bottom .wrap-footer-bottom__right .nav-static {
  display: flex;
  margin-bottom: 4px;
}

footer .footer-bottom .wrap-footer-bottom__right .nav-static a {
  font-size: 0.75rem;
  margin-right: 24px;
  color: #4D4D4D;
  font-weight: 600;
  transition: all 0.2s ease-out;
  white-space: nowrap;
}

footer .footer-bottom .wrap-footer-bottom__right .nav-static a:last-child {
  margin-right: 0;
}

footer .footer-bottom .wrap-footer-bottom__right .nav-static a:hover {
  color: #E11C22;
}

/* responsive tablet landscape
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1200px) {
  .navbar::after {
    content: "";
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 15px;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.05);
  }

  .navbar-nav .nav-link::after {
    display: none;
  }

  .offcanvas .offcanvas-overlay {
    display: none;
    position: fixed;
    top: 79px;
    left: 50%;
    width: 100vw;
    height: 100vh;
    background: #fff;
    transform: translateX(-50%);
  }

  .offcanvas .offcanvas-body {
    display: none;
    position: fixed;
    top: 79px;
    right: 0;
    width: 560px;
    height: calc(100vh - 79px);
    background: #fff;
    padding: 54px 48px 54px 54px;
    transform: translateX(100%);
    transition: transform 0.5s ease;
    overflow-y: auto;
  }

  .offcanvas .offcanvas-body .navbar-nav {
    flex-direction: column;
    align-items: flex-start;
  }

  .offcanvas .offcanvas-body .navbar-nav .nav-item {
    position: relative;
    width: 100%;
  }

  .offcanvas .offcanvas-body .navbar-nav .nav-item:hover .nav-link::after {
    width: 0px !important;
  }

  .offcanvas .offcanvas-body .navbar-nav .nav-item.show .nav-link,
  .offcanvas .offcanvas-body .navbar-nav .nav-item.show .nav-arrow {
    color: #E11C22;
  }

  .offcanvas .offcanvas-body .navbar-nav .nav-item.show .nav-arrow {
    transform: rotate(-180deg);
  }

  .offcanvas .offcanvas-body .navbar-nav .nav-link {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    font-size: 16px;
    color: #212121;
    padding: 16px 0px;
  }

  .offcanvas .offcanvas-body .navbar-nav .nav-arrow {
    position: absolute;
    display: flex;
    align-items: center;
    top: 16px;
    right: 0;
    font-size: 24px;
    cursor: pointer;
    transition: all 0.15s ease-out;
  }

  .offcanvas .offcanvas-body .navbar-nav .nav-search {
    display: none;
  }

  .offcanvas .offcanvas-body .dropdown .dropdown-menu-lg {
    display: none;
    position: relative;
    width: 100%;
    padding: 0;
    margin-bottom: 10px;
    box-shadow: none;
    z-index: 99;
    visibility: visible;
    opacity: 1;
    transition: unset;
  }

  .offcanvas .offcanvas-body .dropdown .dropdown-menu-lg .wrapper {
    max-width: 100%;
    margin: 0;
  }

  .offcanvas .offcanvas-body .dropdown .dropdown-menu-lg .wrapper .row {
    flex-direction: column;
    width: 100%;
    margin: 0;
  }

  .offcanvas .offcanvas-body .dropdown .dropdown-menu-lg .wrapper .row .column {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
  }

  .offcanvas .offcanvas-body .dropdown .dropdown-menu-lg .bg-line,
  .offcanvas .offcanvas-body .dropdown .dropdown-menu-lg p,
  .offcanvas .offcanvas-body .dropdown .dropdown-menu-lg .button {
    display: none;
  }

  .offcanvas .offcanvas-body .dropdown .dropdown-menu-lg .nav-link-title {
    display: block;
    font-weight: 500;
    font-size: 16px;
    line-height: 30px;
    padding: 6px 12px;
    margin-bottom: 0;
  }

  .offcanvas.show .offcanvas-body {
    transform: translateX(0);
  }

  .navbar-search {
    display: block;
    position: relative;
    left: 0;
    right: 0;
  }

  .navbar-search .input-group {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }

  .navbar-search .input-group .ic-search {
    color: #212121;
    order: 2;
  }

  .navbar-search .input-group input {
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    height: 52px;
    padding: 13px;
    padding-left: 0;
    border-radius: 0;
    order: 1;
  }

  .navbar-search .input-group .nav-close-search {
    display: none;
  }

  .navbar-other {
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .navbar-other .nav-search {
    display: block;
  }

  .navbar-other .navbar-nav {
    display: none;
  }

  .navbar-lang {
    display: flex;
    margin-top: 16px;
  }

  .navbar-lang .nav-item {
    padding: 16px 0px;
  }

  .navbar-lang .nav-item>a {
    font-weight: 600;
    font-size: 16px;
    color: #212121;
    text-transform: uppercase;
  }

  .navbar-lang .nav-item>a.active {
    color: #E11C22;
  }

  .navbar-lang .nav-item::after {
    content: " / ";
    white-space: pre;
  }

  .navbar-lang .nav-item:last-child::after {
    display: none;
  }

  .navbar-toggle {
    display: flex;
    align-items: center;
    margin-left: 24px;
  }

  .navbar-toggle .nav-toggler {
    margin: 0;
    background: none;
    border: none;
    padding: 0;
  }

  .navbar-toggle .nav-toggler span {
    display: block;
    width: 20px;
    height: 3px;
    margin-bottom: 4px;
    background-color: #203475;
    z-index: 9999;
  }

  .navbar-toggle .nav-toggler span:last-child {
    margin-bottom: 0;
  }

  footer .footer-top .wrap-footer-top__right {
    padding-left: 150px;
  }

  footer .footer-top .wrap-footer-top__bottom {
    padding-left: 385px;
  }

  footer .footer-bottom .wrap-footer-bottom {
    display: flex;
  }

  footer .footer-bottom .wrap-footer-bottom__left {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }

  footer .footer-bottom .wrap-footer-bottom__left .copyright {
    margin: 0;
    line-height: normal;
    font-size: 0.75rem;
    color: #4D4D4D;
  }

  footer .footer-bottom .wrap-footer-bottom__left .copyright a {
    color: #4D4D4D;
    transition: all 0.2s ease-out;
  }

  footer .footer-bottom .wrap-footer-bottom__left .copyright a:hover {
    color: #E11C22;
  }

  footer .footer-bottom .wrap-footer-bottom__right .nav-static {
    margin-bottom: 0;
  }

  .floating-chat {
    position: fixed;
    width: 90px;
    height: 93px;
    right: 30px;
    bottom: 143px;
    z-index: 89;
    transition: all 0.2s ease-out;
  }
}

/* responsive tablet potrait
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1023px) {
  .navbar-logo img {
    width: auto;
    height: 40px;
  }

  .offcanvas .offcanvas-body {
    width: 423px;
  }

  .navbar-search .input-group span {
    display: none;
  }

  .cookies-box {
    padding: 24px 0;
  }

  .cookies-box .wrapper {
    max-width: calc(100% - 74px);
    flex-direction: column;
  }

  .cookies-box .wrapper p {
    margin-bottom: 24px;
    text-align: center;
  }

  footer .footer-top .wrap-footer-top__right {
    padding-left: 70px;
  }

  footer .footer-top .wrap-footer-top__right .box-nav__column {
    width: calc(50% - 40px);
    margin: 0 20px 32px;
  }

  footer .footer-top .wrap-footer-top__right .box-nav__column.others {
    order: 10;
  }

  footer .footer-top .wrap-footer-top__bottom {
    padding-left: 0;
  }
}

/* responsive mobile
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 766px) {
  .navbar {
    height: 72px;
    max-height: 72px;
  }

  .navbar-logo img {
    width: auto;
    height: 32px;
  }

  .offcanvas .offcanvas-body {
    width: 100%;
    top: 71px;
    height: calc(100vh - 71px);
    padding: 16px 24px;
  }

  .navbar-toggle {
    margin-left: 0;
  }

  footer .footer-top {
    padding: 50px 0 62px;
  }

  footer .footer-top .wrap-footer-top {
    flex-direction: column;
    gap: 40px 0px;
  }

  footer .footer-top .wrap-footer-top__right {
    width: 100%;
    padding-left: 0;
  }

  footer .footer-top .wrap-footer-top__right .box-nav {
    flex-direction: row;
    margin: 0;
  }

  footer .footer-top .wrap-footer-top__right .box-nav__column {
    flex: 0 0 50%;
    width: 50%;
    margin: 0 0 28px;
  }

  footer .footer-top .wrap-footer-top__bottom .box-app h6 {
    font-weight: 400;
    font-size: 1rem;
  }

  footer .footer-top .wrap-footer-top__bottom .box-app h6 b {
    display: block;
  }

  footer .footer-top .wrap-footer-top__bottom .box-app__list {
    display: flex;
    flex-direction: column;
  }

  footer .footer-top .wrap-footer-top__bottom .box-app__list img {
    width: 194px;
  }

  footer .footer-bottom {
    padding: 26px 0;
  }

  footer .footer-bottom .wrap-footer-bottom {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
  }

  footer .footer-bottom .wrap-footer-bottom__left {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
  }

  footer .footer-bottom .wrap-footer-bottom__left .copyright {
    flex: 0 0 100%;
    order: 1;
    margin-bottom: 16px;
  }

  .floating-chat {
    right: 14px;
    bottom: 180px;
  }

  .cookies-box .wrapper {
    max-width: calc(100% - 48px);
  }

  .cookies-box .wrapper p {
    font-size: 0.875rem;
    line-height: 1.6;
  }
}

.banner-pages {
  height: 500px;
  margin-top: 80px;
  position: relative;
}

.banner-pages__wrapper {
  justify-content: space-between;
  align-items: center;
  display: flex;
  height: 100%;
  z-index: 2;
}

.banner-pages__wrapper.banner-motorcycle {
  justify-content: flex-start;
}

.banner-pages__wrapper.banner-motorcycle>figure {
  margin-left: 100px;
  align-self: center;
}

.banner-pages__wrapper.banner-motorcycle>figure>img.bg-home {
  transform-origin: 0 15px;
}

.banner-pages__wrapper-text {
  flex: 0 0 50%;
  max-width: 50%;
}

.banner-pages__wrapper-text.indent-left {
  margin-bottom: 45px;
}

.banner-pages__wrapper-text.indent-left h2 {
  color: #203475;
  font-family: "Outfit";
  font-weight: 600;
  font-size: 64px;
  line-height: 1.12;
  margin-bottom: 24px;
}

.banner-pages__wrapper-text.indent-left h5 {
  color: #4D4D4D;
  font-weight: 300;
  font-size: 24px;
  line-height: 1.5;
  margin-bottom: 0;
}

.banner-pages__wrapper-text.indent-left *:last-child {
  margin-bottom: 0;
}

.banner-pages__wrapper>figure {
  align-self: flex-end;
  position: relative;
  z-index: -1;
}

.banner-pages__wrapper>figure>img {
  display: block;
  height: auto;
  margin: auto;
  width: auto;
}

.banner-pages__wrapper>figure>img.bg-home {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -2;
  -o-object-fit: cover;
  object-fit: cover;
  transform: scale(2.5);
  transform-origin: top center;
}

/* responsive tablet landscape
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1200px) {
  .banner-pages {
    height: 421px;
  }

  .banner-pages__wrapper.banner-motorcycle {
    justify-content: flex-start;
  }

  .banner-pages__wrapper.banner-motorcycle>figure>img.bg-home {
    transform-origin: 15px 15px;
  }

  .banner-pages__wrapper-text {
    max-width: 444px;
  }

  .banner-pages__wrapper-text.indent-left h2 {
    font-size: 48px;
    line-height: 60px;
  }

  .banner-pages__wrapper-text.indent-left h5 {
    font-weight: 300;
    font-size: 21px;
    line-height: 36px;
  }

  .banner-pages__wrapper>figure>img {
    height: 340px;
  }

  .banner-pages__wrapper>figure>img.bg-home {
    height: auto;
  }
}

/* responsive tablet potrait
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1023px) {
  .banner-pages {
    height: 329px;
  }

  .banner-pages__wrapper.banner-motorcycle {
    justify-content: flex-start;
  }

  .banner-pages__wrapper.banner-motorcycle>figure {
    margin-top: -20px;
    margin-left: 0;
    align-self: flex-end;
  }

  .banner-pages__wrapper.banner-motorcycle>figure>img.bg-home {
    transform-origin: 15px center;
  }

  .banner-pages__wrapper.banner-motorcycle>figure .motorcycle {
    transform: scale(0.7);
  }

  .banner-pages__wrapper-text {
    max-width: 344px;
  }

  .banner-pages__wrapper-text.indent-left h2 {
    font-size: 40px;
    line-height: 48px;
  }

  .banner-pages__wrapper-text.indent-left h5 {
    font-size: 19px;
    line-height: 30px;
  }

  .banner-pages__wrapper-text.indent-left:last-child {
    margin-bottom: 0;
  }

  .banner-pages__wrapper>figure>img {
    height: 253px;
  }

  .banner-pages__wrapper>figure>img.bg-home {
    bottom: 0;
    height: auto;
    transform-origin: center;
  }
}

/* responsive mobile
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 766px) {
  .banner-pages {
    height: auto;
    padding-top: 70px;
  }

  .banner-pages__wrapper {
    flex-direction: column;
    flex-wrap: wrap;
  }

  .banner-pages__wrapper-text {
    max-width: 344px;
    order: 2;
  }

  .banner-pages__wrapper-text.indent-left h2 {
    font-size: 28px;
    line-height: 36px;
  }

  .banner-pages__wrapper-text.indent-left h5 {
    font-size: 17px;
    line-height: 30px;
  }

  .banner-pages__wrapper-text.indent-left:last-child {
    margin-bottom: 0;
  }

  .banner-pages__wrapper>figure {
    width: 100%;
    order: 1;
  }

  .banner-pages__wrapper>figure>img {
    height: 174px;
  }

  .banner-pages__wrapper>figure>img.bg-home {
    bottom: 0;
    height: auto;
    transform: scale(1.22);
    transform-origin: center left;
  }
}

.faq-accordion {
  margin-bottom: 100px;
}

.faq-accordion .accordion {
  margin-bottom: 16px;
}

.faq-accordion .accordion .head {
  padding: 0 0 24px;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  position: relative;
  font-weight: 700;
  color: #212121;
  font-size: 1.5rem;
}

.faq-accordion .accordion .head .ico {
  position: relative;
  padding-left: 38px;
}

.faq-accordion .accordion .head .ico:before,
.faq-accordion .accordion .head .ico:after {
  position: absolute;
  width: 19px;
  height: 3px;
  top: 50%;
  bottom: 50%;
  right: 0;
  content: "";
  background-color: #212121;
  transition: all 0.2s ease-out;
}

.faq-accordion .accordion .head .ico:after {
  transform: rotate(90deg);
}

.faq-accordion .accordion .content {
  display: none;
  padding: 0 70px 24px 0;
}

.faq-accordion .accordion .content p {
  font-size: 1rem;
}

.faq-accordion .accordion .content ul li {
  padding-left: 25px;
  position: relative;
  margin-bottom: 0;
}

.faq-accordion .accordion .content ul li:before {
  content: "";
  position: absolute;
  left: 12px;
  top: 12px;
  width: 3px;
  height: 3px;
  border-radius: 5px;
  background-color: #4D4D4D;
}

.faq-accordion .accordion:last-child {
  margin-bottom: 0;
}

.faq-accordion .accordion.active {
  background: #fff;
  border-radius: 12px;
}

.faq-accordion .accordion.active .head {
  color: #E11C22;
}

.faq-accordion .accordion.active .head .ico:before {
  background-color: #E11C22;
}

.faq-accordion .accordion.active .head .ico:after {
  background-color: #E11C22;
  transform: rotate(180deg);
}

/* responsive tablet landscape
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1200px) {
  .faq-accordion {
    margin-bottom: 100px;
  }

  .faq-accordion .accordion {
    margin-bottom: 16px;
  }

  .faq-accordion .accordion .head {
    font-size: 21px;
    line-height: 36px;
    padding-bottom: 16px;
  }

  .faq-accordion .accordion .head .ico {
    position: relative;
    padding-left: 38px;
  }

  .faq-accordion .accordion .head .ico:before,
  .faq-accordion .accordion .head .ico:after {
    position: absolute;
    width: 19px;
    height: 3px;
    top: 50%;
    bottom: 50%;
    right: 0;
    content: "";
    background-color: #212121;
    transition: all 0.2s ease-out;
  }

  .faq-accordion .accordion .head .ico:after {
    transform: rotate(90deg);
  }

  .faq-accordion .accordion .content {
    display: none;
    padding: 0 70px 16px 0;
  }
}

/* responsive tablet potrait
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1023px) {
  .faq-accordion {
    margin-bottom: 100px;
  }

  .faq-accordion .accordion {
    margin-bottom: 12px;
  }

  .faq-accordion .accordion .head {
    font-size: 19px;
    line-height: 30px;
  }

  .faq-accordion .accordion .content {
    display: none;
    padding: 0 0 12px 0;
  }
}

/* responsive mobile
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 766px) {
  .faq-accordion {
    margin-bottom: 100px;
  }

  .faq-accordion .accordion {
    margin-bottom: 12px;
  }

  .faq-accordion .accordion .head {
    font-size: 17px;
    line-height: 30px;
  }

  .faq-accordion .accordion .content p {
    font-size: 14px;
    line-height: 22px;
    display: none;
    padding: 0 38px 12px 0;
  }
}

:root {
  --tagify-dd-color-primary: rgb(53,
      149,
      246);
  --tagify-dd-bg-color: white;
  --tagify-dd-item-pad: 0.3em 0.5em;
}

.tagify {
  --tags-disabled-bg: #f1f1f1;
  --tags-border-color: #ddd;
  --tags-hover-border-color: #ccc;
  --tags-focus-border-color: #3595f6;
  --tag-border-radius: 3px;
  --tag-bg: #e5e5e5;
  --tag-hover: #d3e2e2;
  --tag-text-color: black;
  --tag-text-color--edit: black;
  --tag-pad: 0.3em 0.5em;
  --tag-inset-shadow-size: 1.1em;
  --tag-invalid-color: #d39494;
  --tag-invalid-bg: rgba(211, 148, 148, 0.5);
  --tag-remove-bg: rgba(211, 148, 148, 0.3);
  --tag-remove-btn-color: black;
  --tag-remove-btn-bg: none;
  --tag-remove-btn-bg--hover: #c77777;
  --input-color: inherit;
  --tag--min-width: 1ch;
  --tag--max-width: auto;
  --tag-hide-transition: 0.3s;
  --placeholder-color: rgba(0, 0, 0, 0.4);
  --placeholder-color-focus: rgba(0, 0, 0, 0.25);
  --loader-size: 0.8em;
  --readonly-striped: 1;
  display: inline-flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
  border: 1px solid var(--tags-border-color);
  padding: 14px 32px;
  line-height: 0;
  cursor: text;
  outline: none;
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-height: 124px;
  border-radius: 32px;
  transition: 0.1s;
}

@-webkit-keyframes tags--bump {
  30% {
    transform: scale(1.2);
  }
}

@keyframes tags--bump {
  30% {
    transform: scale(1.2);
  }
}

@-webkit-keyframes rotateLoader {
  to {
    transform: rotate(1turn);
  }
}

@keyframes rotateLoader {
  to {
    transform: rotate(1turn);
  }
}

.tagify:hover:not(.tagify--focus):not(.tagify--invalid) {
  --tags-border-color: var(--tags-hover-border-color);
}

.tagify[disabled] {
  background: var(--tags-disabled-bg);
  filter: saturate(0);
  opacity: 0.5;
  pointer-events: none;
}

.tagify[readonly].tagify--select,
.tagify[disabled].tagify--select {
  pointer-events: none;
}

.tagify[readonly]:not(.tagify--mix):not(.tagify--select),
.tagify[disabled]:not(.tagify--mix):not(.tagify--select) {
  cursor: default;
}

.tagify[readonly]:not(.tagify--mix):not(.tagify--select)>.tagify__input,
.tagify[disabled]:not(.tagify--mix):not(.tagify--select)>.tagify__input {
  visibility: hidden;
  width: 0;
  margin: 5px 0;
}

.tagify[readonly]:not(.tagify--mix):not(.tagify--select) .tagify__tag>div,
.tagify[disabled]:not(.tagify--mix):not(.tagify--select) .tagify__tag>div {
  padding: var(--tag-pad);
}

.tagify[readonly]:not(.tagify--mix):not(.tagify--select) .tagify__tag>div::before,
.tagify[disabled]:not(.tagify--mix):not(.tagify--select) .tagify__tag>div::before {
  -webkit-animation: readonlyStyles 1s calc(-1s * (var(--readonly-striped) - 1)) paused;
  animation: readonlyStyles 1s calc(-1s * (var(--readonly-striped) - 1)) paused;
}

@-webkit-keyframes readonlyStyles {
  0% {
    background: linear-gradient(45deg, var(--tag-bg) 25%, transparent 25%, transparent 50%, var(--tag-bg) 50%, var(--tag-bg) 75%, transparent 75%, transparent) 0/5px 5px;
    box-shadow: none;
    filter: brightness(0.95);
  }
}

@keyframes readonlyStyles {
  0% {
    background: linear-gradient(45deg, var(--tag-bg) 25%, transparent 25%, transparent 50%, var(--tag-bg) 50%, var(--tag-bg) 75%, transparent 75%, transparent) 0/5px 5px;
    box-shadow: none;
    filter: brightness(0.95);
  }
}

.tagify[readonly] .tagify__tag__removeBtn,
.tagify[disabled] .tagify__tag__removeBtn {
  display: none;
}

.tagify--loading .tagify__input>br:last-child {
  display: none;
}

.tagify--loading .tagify__input::before {
  content: none;
}

.tagify--loading .tagify__input::after {
  content: "";
  vertical-align: middle;
  opacity: 1;
  width: 0.7em;
  height: 0.7em;
  width: var(--loader-size);
  height: var(--loader-size);
  min-width: 0;
  border: 3px solid;
  border-color: #eee #bbb #888 transparent;
  border-radius: 50%;
  -webkit-animation: rotateLoader 0.4s infinite linear;
  animation: rotateLoader 0.4s infinite linear;
  content: "" !important;
  margin: -2px 0 -2px 0.5em;
}

.tagify--loading .tagify__input:empty::after {
  margin-left: 0;
}

.tagify+input,
.tagify+textarea {
  position: absolute !important;
  left: -9999em !important;
  transform: scale(0) !important;
}

.tagify__tag {
  display: inline-flex;
  align-items: center;
  margin: 0;
  position: relative;
  z-index: 1;
  outline: none;
  line-height: normal;
  cursor: default;
  background: #e6e9f2;
  border-radius: 100px;
  transition: 0.13s ease-out;
}

.tagify__tag>div {
  vertical-align: top;
  box-sizing: border-box;
  max-width: 100%;
  padding: 8px 10px 8px 16px;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: #14245e;
  line-height: inherit;
  border-radius: var(--tag-border-radius);
  white-space: nowrap;
  transition: 0.13s ease-out;
}

.tagify__tag>div>* {
  white-space: pre-wrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  vertical-align: top;
  min-width: var(--tag--min-width);
  max-width: var(--tag--max-width);
  transition: 0.8s ease, 0.1s color;
}

.tagify__tag>div>*[contenteditable] {
  outline: none;
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
  cursor: text;
  margin: -2px;
  padding: 2px;
  max-width: 350px;
}

.tagify__tag>div::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  transition: 120ms ease;
  -webkit-animation: tags--bump 0.3s ease-out 1;
  animation: tags--bump 0.3s ease-out 1;
  box-shadow: 0 0 0 var(--tag-inset-shadow-size) var(--tag-bg) inset;
}

.tagify__tag:hover:not([readonly]) div::before,
.tagify__tag:focus div::before {
  --tag-bg-inset: -2.5px;
  --tag-bg: var(--tag-hover);
}

.tagify__tag--loading {
  pointer-events: none;
}

.tagify__tag--loading .tagify__tag__removeBtn {
  display: none;
}

.tagify__tag--loading::after {
  --loader-size: 0.4em;
  content: "";
  vertical-align: middle;
  opacity: 1;
  width: 0.7em;
  height: 0.7em;
  width: var(--loader-size);
  height: var(--loader-size);
  min-width: 0;
  border: 3px solid;
  border-color: #eee #bbb #888 transparent;
  border-radius: 50%;
  -webkit-animation: rotateLoader 0.4s infinite linear;
  animation: rotateLoader 0.4s infinite linear;
  margin: 0 0.5em 0 -0.1em;
}

.tagify__tag--flash div::before {
  -webkit-animation: none;
  animation: none;
}

.tagify__tag--hide {
  width: 0 !important;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
  opacity: 0;
  transform: scale(0);
  transition: var(--tag-hide-transition);
  pointer-events: none;
}

.tagify__tag--hide>div>* {
  white-space: nowrap;
}

.tagify__tag.tagify--noAnim>div::before {
  -webkit-animation: none;
  animation: none;
}

.tagify__tag.tagify--notAllowed:not(.tagify__tag--editable) div>span {
  opacity: 0.5;
}

.tagify__tag.tagify--notAllowed:not(.tagify__tag--editable) div::before {
  --tag-bg: var(--tag-invalid-bg);
  transition: 0.2s;
}

.tagify__tag[readonly] .tagify__tag__removeBtn {
  display: none;
}

.tagify__tag[readonly]>div::before {
  -webkit-animation: readonlyStyles 1s calc(-1s * (var(--readonly-striped) - 1)) paused;
  animation: readonlyStyles 1s calc(-1s * (var(--readonly-striped) - 1)) paused;
}

@keyframes readonlyStyles {
  0% {
    background: linear-gradient(45deg, var(--tag-bg) 25%, transparent 25%, transparent 50%, var(--tag-bg) 50%, var(--tag-bg) 75%, transparent 75%, transparent) 0/5px 5px;
    box-shadow: none;
    filter: brightness(0.95);
  }
}

.tagify__tag--editable>div {
  color: var(--tag-text-color--edit);
}

.tagify__tag--editable>div::before {
  box-shadow: 0 0 0 2px var(--tag-hover) inset !important;
}

.tagify__tag--editable>.tagify__tag__removeBtn {
  pointer-events: none;
}

.tagify__tag--editable>.tagify__tag__removeBtn::after {
  opacity: 0;
  transform: translateX(100%) translateX(5px);
}

.tagify__tag--editable.tagify--invalid>div::before {
  box-shadow: 0 0 0 2px var(--tag-invalid-color) inset !important;
}

.tagify__tag__removeBtn {
  order: 5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  cursor: pointer;
  font: 14px/1 Arial;
  background: var(--tag-remove-btn-bg);
  color: var(--tag-remove-btn-color);
  width: 14px;
  height: 14px;
  margin-right: 16px;
  margin-left: auto;
  overflow: hidden;
  transition: 0.2s ease-out;
}

.tagify__tag__removeBtn::after {
  content: "";
  background: url("/images/material/ico-close-small.svg") no-repeat center;
  width: 12px;
  height: 12px;
  transition: 0.3s, color 0s;
}

.tagify__tag__removeBtn:hover {
  color: white;
}

.tagify__tag__removeBtn:hover+div>span {
  opacity: 0.5;
}

.tagify__tag__removeBtn:hover+div::before {
  box-shadow: 0 0 0 var(--tag-inset-shadow-size) var(--tag-remove-bg, rgba(211, 148, 148, 0.3)) inset !important;
  transition: box-shadow 0.2s;
}

.tagify:not(.tagify--mix) .tagify__input br {
  display: none;
}

.tagify:not(.tagify--mix) .tagify__input * {
  display: inline;
  white-space: nowrap;
}

.tagify__input {
  flex-grow: 1;
  display: inline-block;
  min-width: 80px;
  margin: 0;
  padding: 8px 0;
  font-size: 16px;
  line-height: normal;
  position: relative;
  white-space: pre-wrap;
  color: var(--input-color);
  box-sizing: inherit;
  /* Seems firefox newer versions don't need this any more
      @supports ( -moz-appearance:none ){
          &::before{
              line-height: inherit;
              position:relative;
          }
      }
      */
}

@-moz-document url-prefix() {}

.tagify__input:empty::before {
  position: static;
}

.tagify__input:focus {
  outline: none;
}

.tagify__input:focus::before {
  transition: 0.2s ease-out;
  opacity: 0;
  transform: translatex(6px);
  /* ALL MS BROWSERS: hide placeholder (on focus) otherwise the caret is placed after it, which is weird */
  /* IE Edge 12+ CSS styles go here */
}

@supports (-ms-ime-align: auto) {
  .tagify__input:focus::before {
    display: none;
  }
}

.tagify__input:focus:empty::before {
  transition: 0.2s ease-out;
  opacity: 1;
  transform: none;
  color: rgba(0, 0, 0, 0.25);
  color: var(--placeholder-color-focus);
}

@-moz-document url-prefix() {
  .tagify__input:focus:empty::after {
    display: none;
  }
}

.tagify__input::before {
  content: attr(data-placeholder);
  height: 1em;
  line-height: 1em;
  margin: auto 0;
  z-index: 1;
  color: #999999;
  white-space: nowrap;
  pointer-events: none;
  opacity: 1;
  position: absolute;
}

.tagify__input::after {
  content: attr(data-suggest);
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  min-width: calc(100% - 1.5em);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: pre;
  /* allows spaces at the beginning */
  color: var(--tag-text-color);
  opacity: 0.3;
  pointer-events: none;
  max-width: 100px;
}

.tagify__input .tagify__tag {
  margin: 0 1px;
}

.tagify--mix {
  display: block;
}

.tagify--mix .tagify__input {
  padding: 5px;
  margin: 0;
  width: 100%;
  height: 100%;
  line-height: 1.5;
  display: block;
}

.tagify--mix .tagify__input::before {
  height: auto;
  display: none;
  line-height: inherit;
}

.tagify--mix .tagify__input::after {
  content: none;
}

.tagify--select::after {
  content: ">";
  opacity: 0.5;
  position: absolute;
  top: 50%;
  right: 0;
  bottom: 0;
  font: 16px monospace;
  line-height: 8px;
  height: 8px;
  pointer-events: none;
  transform: translate(-150%, -50%) scaleX(1.2) rotate(90deg);
  transition: 0.2s ease-in-out;
}

.tagify--select[aria-expanded=true]::after {
  transform: translate(-150%, -50%) rotate(270deg) scaleY(1.2);
}

.tagify--select .tagify__tag {
  position: absolute;
  top: 0;
  right: 1.8em;
  bottom: 0;
}

.tagify--select .tagify__tag div {
  display: none;
}

.tagify--select .tagify__input {
  width: 100%;
}

.tagify--empty .tagify__input::before {
  transition: 0.2s ease-out;
  opacity: 1;
  transform: none;
  display: inline-block;
  width: auto;
}

.tagify--mix .tagify--empty .tagify__input::before {
  display: inline-block;
}

.tagify--focus {
  --tags-border-color: var(--tags-focus-border-color);
  transition: 0s;
}

.tagify--invalid {
  --tags-border-color: #d39494;
}

.tagify__dropdown {
  position: absolute;
  z-index: 9999;
  transform: translateY(1px);
  overflow: hidden;
}

.tagify__dropdown[placement=top] {
  margin-top: 0;
  transform: translateY(-100%);
}

.tagify__dropdown[placement=top] .tagify__dropdown__wrapper {
  border-top-width: 1.1px;
  border-bottom-width: 0;
}

.tagify__dropdown[position=text] {
  box-shadow: 0 0 0 3px rgba(var(--tagify-dd-color-primary), 0.1);
  font-size: 0.9em;
}

.tagify__dropdown[position=text] .tagify__dropdown__wrapper {
  border-width: 1px;
}

.tagify__dropdown__wrapper {
  max-height: 300px;
  overflow: auto;
  overflow-x: hidden;
  background: var(--tagify-dd-bg-color);
  border: 1px solid;
  border-color: var(--tagify-dd-color-primary);
  border-bottom-width: 1.5px;
  border-top-width: 0;
  box-shadow: 0 2px 4px -2px rgba(0, 0, 0, 0.2);
  transition: 0.25s cubic-bezier(0, 1, 0.5, 1);
}

.tagify__dropdown__header:empty {
  display: none;
}

.tagify__dropdown__footer {
  display: inline-block;
  margin-top: 0.5em;
  padding: var(--tagify-dd-item-pad);
  font-size: 0.7em;
  font-style: italic;
  opacity: 0.5;
}

.tagify__dropdown__footer:empty {
  display: none;
}

.tagify__dropdown--initial .tagify__dropdown__wrapper {
  max-height: 20px;
  transform: translateY(-1em);
}

.tagify__dropdown--initial[placement=top] .tagify__dropdown__wrapper {
  transform: translateY(2em);
}

.tagify__dropdown__item {
  box-sizing: border-box;
  padding: var(--tagify-dd-item-pad);
  margin: 1px;
  cursor: pointer;
  border-radius: 2px;
  position: relative;
  outline: none;
  max-height: 60px;
  max-width: 100%;
  /* custom hidden transition effect is needed for horizontal-layout suggestions */
}

.tagify__dropdown__item--active {
  background: var(--tagify-dd-color-primary);
  color: white;
}

.tagify__dropdown__item:active {
  filter: brightness(105%);
}

.tagify__dropdown__item--hidden {
  padding-top: 0;
  padding-bottom: 0;
  margin: 0 1px;
  pointer-events: none;
  overflow: hidden;
  max-height: 0;
  transition: var(--tagify-dd-item--hidden-duration, 0.3s) !important;
}

.tagify__dropdown__item--hidden>* {
  transform: translateY(-100%);
  opacity: 0;
  transition: inherit;
}

/* helper
----------------------------------------------------------------------------------------------*/
/*!
 * Milligram-scss v1.3.0
 * https://milligram.github.io
 *
 * Copyright (c) 2017 CJ Patoilo
 * Licensed under the MIT license
 */
/* general styling
----------------------------------------------------------------------------------------------*/
html {
  overflow-x: hidden;
}

.space-top {
  padding-top: 100px;
}

.middle {
  margin-top: 80px;
  position: relative;
  overflow: hidden;
}

.middle .bg-top,
.middle .bg-mid,
.middle .bg-bottom {
  position: absolute;
  z-index: -1;
}

.middle .bg-top {
  right: 0;
  top: 48px;
}

.middle .bg-mid {
  width: auto;
  height: 100%;
  left: calc((100% - 970px) / 2);
  margin-left: -235px;
  top: 287px;
}

.middle .bg-mid>img {
  display: block;
  width: 100%;
}

.middle .bg-mid::before {
  position: absolute;
  width: 100%;
  height: 1px;
  border-bottom: 2px solid #D4D4D4;
  content: "";
  top: 0;
  left: -100%;
}

.middle .bg-mid::after {
  position: absolute;
  width: 100%;
  height: 1px;
  border-bottom: 2px solid #D4D4D4;
  content: "";
  top: 1043px;
  right: -100%;
}

.middle .bg-bottom {
  left: 0;
  top: 1089px;
}

.content-pages>img {
  border-radius: 24px;
  height: auto;
  margin: 0 0 48px;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  width: 100%;
}

.content-pages ul,
.content-pages ol,
.content-pages p {
  color: #212121;
}

.content-pages p>img {
  width: auto;
  border-radius: 0;
}

.content-pages figure.image {
  display: flex;
  justify-content: center;
}

.content-pages figure.image.image-style-side {
  justify-content: flex-end;
}

.content-pages figure.image>img {
  width: auto;
  border-radius: 0;
}

.top-title h2 {
  color: #203475;
}

.top-title h4 {
  color: #212121;
}

.top-title .link-arrow,
.top-title h2,
.top-title h4 {
  margin-bottom: 32px;
}

.box-button {
  display: flex;
}

.box-share {
  display: flex;
  align-items: center;
  margin-top: 22px;
}

.box-share span {
  margin-right: 15px;
  font-weight: 700;
  color: #212121;
}

.box-share div {
  display: flex;
}

.box-share div a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
}

.load-more {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 64px;
}

.load-more .button,
.load-more .button-outline {
  margin-bottom: 0;
}

.lang-header>select {
  background: none;
}

.line-point {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 16px;
  height: 16px;
  margin: auto;
  background: #fff;
  border: 2px solid #d5d5d5;
  border-radius: 16px;
}

.line-point .circle-point {
  display: block;
  position: relative;
  width: 8px;
  height: 8px;
  background-color: #c4c4c4;
  border-radius: 8px;
}

.motorcycle {
  position: relative;
}

.motorcycle .motorcycle-wheel-front {
  position: absolute;
  bottom: -12px;
  left: 5px;
}

.motorcycle .motorcycle-wheel-back {
  position: absolute;
  bottom: -12px;
  right: 0px;
}

.car {
  position: relative;
}

.car .car-wheel-front {
  position: absolute;
  bottom: -42px;
  right: 30px;
}

.car .car-wheel-back {
  position: absolute;
  bottom: -42px;
  left: 42px;
}

.truck {
  position: relative;
}

.truck .truck-wheel-front {
  position: absolute;
  bottom: -20px;
  right: 80px;
}

.truck .truck-wheel-middle {
  position: absolute;
  bottom: -20px;
  left: 240px;
}

.truck .truck-wheel-back {
  position: absolute;
  bottom: -20px;
  left: 105px;
}

.bg-line-detail {
  position: absolute;
  top: 375px;
  bottom: 160px;
  width: 100%;
}

.bg-line-detail .line-solid-1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 63px;
  height: 72px;
  border-top: 2px solid #d5d5d5;
  border-right: 2px solid #d5d5d5;
  border-top-right-radius: 40px;
}

.bg-line-detail .line-solid-1 .line-point {
  bottom: 0;
  right: -9px;
}

.bg-line-detail .line-dashed-1 {
  position: absolute;
  top: 71px;
  left: 61px;
  width: calc(50% - 63px);
  height: 100px;
  border-bottom: 2px dashed #d5d5d5;
  border-left: 2px dashed #d5d5d5;
  border-bottom-left-radius: 40px;
}

.bg-line-detail .line-dashed-2 {
  position: absolute;
  top: 171px;
  bottom: 163px;
  right: 61px;
  width: calc(50% - 63px);
  border-top: 2px dashed #d5d5d5;
  border-right: 2px dashed #d5d5d5;
  border-top-right-radius: 40px;
}

.bg-line-detail .line-solid-2 {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 63px;
  height: 163px;
  border-bottom: 2px solid #d5d5d5;
  border-left: 2px solid #d5d5d5;
  border-bottom-left-radius: 40px;
}

.bg-line-detail .line-solid-2 .line-point {
  top: 0;
  left: -9px;
}

.bg-line-related {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: -1;
}

.bg-line-related .line-solid-1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 63px;
  height: 71px;
  border-top: 2px solid #d5d5d5;
  border-right: 2px solid #d5d5d5;
  border-top-right-radius: 40px;
}

.bg-line-related .line-dashed-1 {
  position: absolute;
  top: 71px;
  left: 61px;
  width: calc(50% - 63px);
  height: 101px;
  border-bottom: 2px dashed #d5d5d5;
  border-left: 2px dashed #d5d5d5;
  border-bottom-left-radius: 40px;
}

.bg-line-related .line-dashed-1 .line-point {
  top: 0;
  left: -9px;
}

.bg-line-related .line-solid-2 {
  position: absolute;
  top: 170px;
  right: 61px;
  height: 71px;
  width: calc(50% - 63px);
  border-top: 2px solid #d5d5d5;
  border-right: 2px solid #d5d5d5;
  border-top-right-radius: 40px;
}

.bg-line-related .line-dashed-2 {
  position: absolute;
  top: 242px;
  right: 0;
  width: 63px;
  height: 119px;
  border-bottom: 2px dashed #d5d5d5;
  border-left: 2px dashed #d5d5d5;
  border-bottom-left-radius: 40px;
}

.bg-line-related .line-dashed-2 .line-point {
  top: 0;
  left: -9px;
}

.bg-line-related .line-dashed-3 {
  position: absolute;
  top: 170px;
  right: 0;
  width: 50%;
  border-top: 2px dashed #d5d5d5;
}

.field .autocomplete-box {
  position: absolute;
  left: 48px;
  right: 0;
  padding: 0;
  opacity: 0;
  max-height: 280px;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);
  pointer-events: none;
  overflow-y: auto;
  z-index: 100;
}

.field .autocomplete-box li {
  text-align: left;
  list-style: none;
  padding: 8px 12px;
  display: none;
  width: 100%;
  cursor: default;
  border-radius: 3px;
}

.field .autocomplete-box li:hover {
  background: #efefef;
}

.field.active .autocomplete-box {
  padding: 10px 8px;
  opacity: 1;
  pointer-events: auto;
}

.field.active .autocomplete-box li {
  display: block;
}

.sidebarHeader {
  position: unset !important;
}

.sidebarHeader h2 {
  color: #FFF !important;
}

.minimizeButton {
  padding: 0 !important;
}

.closeButton {
  padding: 4px 0 0 0 !important;
}

.grid-container {
  width: 100% !important;
}

.embeddedServiceSidebarForm.buttonWrapper {
  padding: 30px 14px 24px !important;
}

.embeddedServiceSidebarButton .label,
.embeddedServiceSidebarButton:disabled .label {
  line-height: 1 !important;
}

.FirstName input,
.LastName input,
.Email input,
.Phone input {
  height: 37px !important;
  padding: 6px 10px !important;
}

@media all and (max-width: 1300px) {
  .bg-line-detail {
    top: 320px;
    bottom: 160px;
  }

  .bg-line-detail .line-solid-1 {
    left: -43px;
  }

  .bg-line-detail .line-dashed-1 {
    position: absolute;
    top: 71px;
    left: 18px;
    width: calc(50% - 19px);
    height: 100px;
    border-bottom: 2px dashed #d5d5d5;
    border-left: 2px dashed #d5d5d5;
    border-bottom-left-radius: 40px;
  }

  .bg-line-detail .line-dashed-2 {
    right: 0;
    width: 50%;
    border-top: 2px dashed #d5d5d5;
    border-right: none;
    border-top-right-radius: 0;
  }

  .bg-line-detail .line-solid-2 {
    display: none;
  }

  .bg-line-related .line-solid-1 {
    left: -43px;
  }

  .bg-line-related .line-dashed-1 {
    position: absolute;
    top: 71px;
    left: 18px;
    width: calc(50% - 19px);
    height: 100px;
    border-bottom: 2px dashed #d5d5d5;
    border-left: 2px dashed #d5d5d5;
    border-bottom-left-radius: 40px;
  }

  .bg-line-related .line-dashed-2,
  .bg-line-related .line-dashed-3 {
    top: 169px;
    right: 0;
    width: 50%;
    height: 0;
    border-top: 2px dashed #d5d5d5;
    border-bottom: none;
    border-right: none;
    border-left: none;
    border-radius: 0;
  }

  .bg-line-related .line-dashed-2 .line-point,
  .bg-line-related .line-dashed-3 .line-point {
    display: none;
  }

  .bg-line-related .line-solid-2 {
    display: none;
  }
}

/* responsive tablet landscape
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1200px) {
  .bg-line-detail {
    top: 320px;
    bottom: 160px;
  }

  .bg-line-detail .line-solid-1 {
    left: -43px;
  }

  .bg-line-detail .line-dashed-1 {
    position: absolute;
    top: 71px;
    left: 18px;
    width: calc(50% - 19px);
    height: 100px;
    border-bottom: 2px dashed #d5d5d5;
    border-left: 2px dashed #d5d5d5;
    border-bottom-left-radius: 40px;
  }

  .bg-line-detail .line-dashed-2 {
    right: 0;
    width: 50%;
    border-top: 2px dashed #d5d5d5;
    border-right: none;
    border-top-right-radius: 0;
  }

  .bg-line-detail .line-solid-2 {
    display: none;
  }

  .bg-line-related .line-solid-1 {
    left: -43px;
  }

  .bg-line-related .line-dashed-1 {
    position: absolute;
    top: 71px;
    left: 18px;
    width: calc(50% - 19px);
    height: 100px;
    border-bottom: 2px dashed #d5d5d5;
    border-left: 2px dashed #d5d5d5;
    border-bottom-left-radius: 40px;
  }

  .bg-line-related .line-dashed-2,
  .bg-line-related .line-dashed-3 {
    top: 169px;
    right: 0;
    width: 50%;
    height: 0;
    border-top: 2px dashed #d5d5d5;
    border-bottom: none;
    border-right: none;
    border-left: none;
    border-radius: 0;
  }

  .bg-line-related .line-dashed-2 .line-point,
  .bg-line-related .line-dashed-3 .line-point {
    display: none;
  }

  .bg-line-related .line-solid-2 {
    display: none;
  }

  .load-more {
    margin-top: 32px;
  }

  .car {
    transform: scale(0.8);
    transform-origin: 0 0;
  }

  .truck {
    transform: scale(0.8);
    transform-origin: 0 0;
  }
}

/* responsive tablet potrait
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1023px) {

  .bg-line-detail,
  .bg-line-related {
    display: none;
  }

  .load-more {
    margin-top: 20px;
  }
}

/* responsive mobile
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 766px) {
  .load-more {
    margin-top: 40px;
  }
}

/* component
----------------------------------------------------------------------------------------------*/
button {
  font-family: "Outfit";
}

.button,
.button-outline {
  margin: 0;
  border-radius: 30px !important;
}

.load-more {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 64px;
}

.back-link {
  font-weight: 500;
  font-size: 14px;
  line-height: 24px;
  padding-left: 28px;
  margin-bottom: 32px;
}

.back-link::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 24px;
  height: 24px;
  background-image: url("/images/material/ico-back-link.svg");
  background-repeat: no-repeat;
  background-size: cover;
}

/* lainnya styling
----------------------------------------------------------------------------------------------*/
.lainnya .bg-line-detail {
  top: 230px;
}

.lainnya .bg-line-detail.bg-line-ongkir {
  top: 240px;
}

.lainnya.hero {
  padding-top: 182px;
  text-align: center;
  position: relative;
}
.hero-pages{
  padding: 50px;
}
.lainnya.hero .bg {
  left: 0;
  position: absolute;
  right: 0;
  top: 196px;
}

.lainnya.hero .bg>img {
  display: block;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  width: 100%;
}

.lainnya.hero .wrapper {
  display: flex;
  flex-direction: column;
}

.lainnya.hero h2 {
  font-weight: 600;
  font-size: 48px;
  line-height: 56px;
  color: #203475;
  margin-bottom: 16px;
}

.lainnya.hero p {
  font-weight: 300;
  font-size: 24px;
  line-height: 36px;
  color: #4d4d4d;
  margin-bottom: 48px;
}

.lainnya.hero figure {
  display: flex;
  justify-content: center;
}

.lainnya .wrap-middle {
  max-width: 770px;
  margin: 0 auto;
}

.lainnya .search-resi {
  text-align: left;
  padding: 0 70px;
}

.lainnya .search-resi__box {
  width: 630px;
  min-height: 124px;
  background-color: #fff;
  margin-bottom: 16px;
  border: 1px solid gainsboro;
  padding: 10px;
  border-radius: 10px;
}

.lainnya .search-resi__box .chip {
  flex: 0 0 auto;
}

.lainnya .search-resi__box input[type=text] {
  flex: 0 0 130px;
  font-size: 0.875rem;
  color: #999999;
  height: 56px;
  line-height: 56px;
  border: 0;
  border-radius: 0;
  margin-bottom: 0;
  padding: 0;
}

.lainnya .search-resi small {
  font-size: 0.688rem;
  color: #4D4D4D;
}

.lainnya .wrap-button {
  padding: 35px 0;
  text-align: center;
}

.lainnya .box-ongkir {
  width: 770px;
  background: #fff;
  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.08);
  border-radius: 32px;
  border: 1px solid #8F9ECC;
  padding: 28px 32px;
  margin-bottom: 30px;
}

.lainnya .field {
  position: relative;
  padding-left: 48px;
}

.lainnya .field ::-moz-placeholder {
  color: #999999;
}

.lainnya .field :-ms-input-placeholder {
  color: #999999;
}

.lainnya .field ::placeholder {
  color: #999999;
}

.lainnya .field .ico {
  position: absolute;
  width: 32px;
  height: 32px;
  top: 16px;
  left: 0;
}

.lainnya .field .ico img {
  height: 32px;
}

.lainnya .field .weight {
  position: absolute;
  width: 56px;
  height: 62px;
  line-height: 56px;
  top: 0px;
  right: 0;
  border-radius: 0px 32px 32px 0;
  background: #EEEEEE;
  font-size: 1.25rem;
  text-align: center;
  font-weight: 400;
}

.lainnya .field input {
  margin: 0;
  padding: 18px 0;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 0;
  color: #212121;
  height: auto;
  line-height: normal;
}

.lainnya .field input:focus {
  color: #212121;
}

.lainnya .field:first-child::after {
  position: absolute;
  width: 4px;
  height: 20px;
  content: "";
  bottom: -11px;
  left: 13px;
  background: url("/images/material/ico-cek-dot.png") no-repeat 0 0;
}

.lainnya .field:first-child .ico {
  top: 0;
}

.lainnya .field:first-child input {
  padding-top: 0;
}

.lainnya .field:last-child input {
  border-bottom: 0;
  padding-bottom: 0;
}

.lainnya .field.field-weight {
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 32px;
  padding-left: 78px;
}

.lainnya .field.field-weight .ico {
  top: 15px;
  left: 32px;
}

.lainnya .field.field-weight input {
  padding-right: 66px;
  border: 0;
}

.lainnya .box-tujuan {
  background: #f8f8f8;
  border-radius: 16px;
  padding: 24px 32px;
  text-align: left;
  margin-bottom: 30px;
}

.lainnya .box-tujuan__list {
  display: flex;
  align-items: center;
}

.lainnya .box-tujuan__list h6 {
  flex: 0 0 95px;
  max-width: 95px;
  font-size: 1rem;
  font-weight: 700;
  color: #4D4D4D;
  margin: 0;
}

.lainnya .box-tujuan__list p {
  flex: 0 0 calc(100% - 95px);
  max-width: calc(100% - 95px);
  font-size: 1rem;
  padding-left: 8px;
  margin-bottom: 0;
}

.promo {
  padding-bottom: 100px;
  position: relative;
}

.promo .bg {
  left: 0;
  position: absolute;
  right: 0;
  top: -40px;
}

.promo .bg>img {
  display: block;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  width: 100%;
}

.promo h2 {
  font-weight: 600;
  font-size: 48px;
  line-height: 56px;
  color: #203475;
  margin-bottom: 32px;
  text-align: center;
}

.promo p {
  font-weight: 300;
  font-size: 24px;
  line-height: 36px;
  color: #4d4d4d;
  margin-bottom: 64px;
  text-align: center;
}

.promo .row {
  margin-left: -15px;
  margin-right: -15px;
  width: calc(100% + 30px);
  margin-bottom: -30px;
}

.promo .row .column {
  padding: 0 15px;
  margin-bottom: 30px;
}

.promo a {
  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.08);
  border-radius: 16px;
  overflow: hidden;
  transition: all 0.3s ease-out;
}

.promo a figure {
  position: relative;
  margin-bottom: 16px;
  overflow: hidden;
}

.promo a figure img {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transition: all 0.3s ease-out;
}

.promo a h6 {
  font-weight: 600;
  font-size: 20px;
  line-height: 26px;
  letter-spacing: -0.01em;
  color: #212121;
  padding: 0 24px;
  margin: 0;
}

.promo a span {
  font-weight: 300;
  font-size: 11px;
  line-height: 16px;
  letter-spacing: 0.1em;
  color: #4d4d4d;
  display: block;
  line-height: 26px;
  margin: 8px 24px 24px;
  padding-left: 26px;
  position: relative;
}

.promo a span::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 18px;
  height: 18px;
  margin: auto 0;
  background-image: url("/images/material/ico-clock.svg");
  background-size: cover;
  background-repeat: no-repeat;
}

.promo a:hover figure img {
  transform: scale(1.1);
}

.promo.related {
  position: relative;
  padding: 50px 0 100px;
}

.promo.related::before {
  content: "";
  position: absolute;
  top: 50px;
  left: 0;
  right: 0;
  width: 100%;
  height: 451px;
  background-image: url("/images/content/csr-detail-bg-related.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
}

.promo.related h4 {
  font-weight: 500;
  font-size: 32px;
  line-height: 40px;
  color: #212121;
  margin-bottom: 32px;
}

.promo-detail {
  position: relative;
  padding-top: 120px;
  padding-bottom: 50px;
  overflow: hidden;
}

.promo-detail::before {
  content: url("/images/content/bg-gedung.png");
  left: 0;
  position: absolute;
  top: 1177px;
}

.promo-detail::after {
  content: url("/images/content/bg-pesawat.png");
  position: absolute;
  right: 0;
  top: 136px;
}

.promo-detail .bg-line {
  position: absolute;
  top: 375px;
  left: 0;
  right: 0;
}

.promo-detail .bg-line img {
  display: block;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  width: 100%;
}

.promo-detail h2 {
  font-weight: 600;
  font-size: 48px;
  line-height: 56px;
  color: #203475;
  margin-bottom: 32px;
}

.promo-detail .date {
  font-weight: 300;
  font-size: 14px;
  line-height: 21px;
  color: #4d4d4d;
  display: block;
  position: relative;
  line-height: 26px;
  padding-left: 26px;
  margin-bottom: 32px;
}

.promo-detail .date::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 18px;
  height: 18px;
  margin: auto 0;
  background-image: url("/images/material/ico-calendar.svg");
  background-size: cover;
  background-repeat: no-repeat;
}

.promo-detail figure {
  overflow: hidden;
  margin-bottom: 32px;
}

.promo-detail p {
  line-height: 26px;
}

.promo-detail .share {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0 15px;
}

.promo-detail .share span {
  font-weight: 700;
  font-size: 16px;
  line-height: 26px;
  color: #212121;
}

.promo-detail .share ul {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0 15px;
  margin-bottom: 0;
}

.promo-detail .share ul li {
  margin-bottom: 0;
}

.promo-detail .share ul li a {
  display: flex;
  align-items: center;
}

.faq {
  padding-top: 64px;
}

.faq .faq-accordion h3 {
  text-align: center;
  font-weight: 600;
  color: #212121;
  margin-bottom: 48px;
}

.faq.detail {
  padding-top: 120px;
  margin-bottom: 100px;
}

.faq.detail .faq-accordion {
  margin-bottom: 64px;
}

.faq.detail .faq-accordion h3 {
  color: #203475;
}

.topic {
  margin-bottom: 100px;
}

.topic h4 {
  text-align: center;
  color: #212121;
  font-weight: 500;
  margin-bottom: 40px;
}

.topic a {
  width: 100%;
}

.topic__list {
  display: flex;
  align-items: center;
  background: #fff;
  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.08);
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 30px;
  transition: all 0.2s ease-out;
}

.topic__list figure {
  flex: 0 0 32px;
  max-width: 32px;
}

.topic__list span {
  display: block;
  flex: 0 0 calc(100% - 35px);
  max-width: calc(100% - 35px);
  color: #212121;
  font-weight: 700;
  padding-left: 16px;
}

.topic__list:hover {
  background: #f3f3f3;
}

.chip {
  margin: 8px 0;
  padding: 8px 38px 8px 16px;
  background-color: #E9ECF5;
  border-radius: 100px;
  position: relative;
}

.chip span {
  font-weight: 600;
  color: #14245E;
}

.chip i {
  position: absolute;
  right: 14px;
  top: 8px;
  cursor: pointer;
}

.wrap-table {
  width: max-content;
  margin: auto;
  margin-bottom: 100px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 16px;
  overflow: auto;
  padding-bottom: 20px;
  scrollbar-width: thin;
  scrollbar-color: #D4D4D4 #203475;
}

.wrap-table::-webkit-scrollbar {
  height: 6px;
}

.wrap-table::-webkit-scrollbar-track {
  background: #D4D4D4;
  border-radius: 6px;
}

.wrap-table::-webkit-scrollbar-thumb {
  background: #203475;
  border-radius: 8px;
}

.wrap-table::-webkit-scrollbar-thumb:hover {
  background: #203475;
}

.wrap-table table {
  margin-bottom: 0;
}

.wrap-table table td {
  line-height: normal;
}

.wrap-table table td,
.wrap-table table th {
  word-wrap: break-word;
  border-bottom: 0;
}

.wrap-table table td:first-child,
.wrap-table table th:first-child {
  border-top-left-radius: 16px;
  padding-left: 13px;
}

.wrap-table table td:last-child,
.wrap-table table th:last-child {
  border-top-right-radius: 16px;
}

.wrap-table table thead tr {
  background: rgba(0, 0, 0, 0.1);
}

.wrap-table table thead tr th {
  font-weight: 700;
  color: #4D4D4D;
  min-width: 157px;
}

.wrap-table table thead tr th:first-child,
.wrap-table table thead tr th:nth-child(3),
.wrap-table table thead tr th:nth-last-child(1),
.wrap-table table thead tr th:nth-last-child(2) {
  min-width: unset;
}

.wrap-table a.see-more {
  position: relative;
  padding-right: 28px;
  white-space: nowrap;
  font-weight: 500;
  text-decoration: underline;
  margin-right: 20px;
  min-width: 114px;
  display: inline-flex;
}

.wrap-table a.see-more::after {
  position: absolute;
  width: 24px;
  height: 24px;
  content: "";
  top: 0;
  right: 0;
  background: url("/images/material/ico-external-link.svg") no-repeat 0 0;
}

.wrap-table a.see-more:hover {
  text-decoration: none;
}

/* responsive tablet landscape
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1200px) {
  .lainnya .bg-line-detail {
    top: 200px;
  }

  .lainnya .bg-line-detail.bg-line-ongkir {
    top: 210px;
  }

  .lainnya.hero {
    padding-top: 160px;
  }

  .lainnya.hero .bg {
    top: 240px;
    transform: scale(0.7);
    transform-origin: 100%;
  }

  .lainnya.hero h2 {
    font-size: 40px;
    line-height: 56px;
  }

  .lainnya.hero p {
    font-size: 21px;
    line-height: 36px;
    margin-bottom: 40px;
  }

  .lainnya.hero figure {
    display: flex;
    justify-content: center;
  }

  .lainnya .box-ongkir {
    width: 630px;
  }

  .lainnya .box-tujuan__list {
    margin-bottom: 19px;
  }

  .lainnya .box-tujuan__list h6 {
    font-size: 16px;
    line-height: 26px;
  }

  .lainnya .box-tujuan__list span {
    padding-right: 8px;
  }

  .lainnya .box-tujuan__list p {
    max-width: 100%;
    font-size: 16px;
    line-height: 26px;
    padding: 0;
    margin-bottom: 0;
  }

  .wrap-table table th:first-child,
  .wrap-table table td:first-child {
    padding-left: 15px;
  }

  .wrap-table table th:last-child,
  .wrap-table table td:last-child {
    padding-right: 15px;
  }

  .wrap-table a.see-more {
    max-width: 115px;
    white-space: normal;
  }

  .wrap-table a.see-more::after {
    top: unset;
    bottom: 0;
  }

  .promo a figure {
    position: relative;
    margin-bottom: 16px;
    overflow: hidden;
  }

  .promo a figure img {
    transition: all 0.3s ease-out;
  }

  .promo a h6 {
    font-size: 18px;
    line-height: 23px;
    letter-spacing: -0.01em;
    padding: 0 20px;
  }

  .promo a span {
    margin: 8px 20px 16px 20px;
  }

  .promo-detail h2 {
    font-size: 40px;
    line-height: 1.2;
  }

  .faq {
    padding-top: 60px;
  }

  .faq .faq-accordion h3 {
    font-size: 40px;
    line-height: 56px;
    margin-bottom: 32px;
  }

  .faq.detail {
    padding-top: 120px;
    margin-bottom: 30px;
  }

  .faq.detail .faq-accordion {
    margin-bottom: 64px;
  }

  .faq.detail .faq-accordion h3 {
    color: #203475;
  }
}

/* responsive tablet potrait
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 1023px) {
  .lainnya .bg-line-detail {
    display: block;
  }

  .lainnya.hero .bg {
    display: none;
  }

  .lainnya .wrap-middle {
    max-width: 630px;
    margin: 0 auto;
  }

  .lainnya .wrap-middle .search-resi {
    padding: 0;
  }

  .promo .row {
    margin-left: -15px;
    margin-right: -15px;
    width: calc(100% + 30px);
    margin-bottom: -30px;
  }

  .promo .row .column {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .promo-detail h2 {
    font-size: 32px;
    line-height: 40px;
  }

  .faq {
    padding-top: 60px;
  }

  .faq.detail {
    padding-top: 120px;
    margin-bottom: 30px;
  }

  .faq.detail .faq-accordion h3 {
    font-size: 28px;
    line-height: 40px;
  }
}

/* responsive mobile
----------------------------------------------------------------------------------------------*/
@media all and (max-width: 766px) {
  .lainnya .bg-line-detail {
    display: none;
  }

  .lainnya.hero {
    padding-top: 126px;
  }

  .lainnya.hero h2 {
    font-size: 28px;
    line-height: 36px;
  }

  .lainnya.hero p {
    font-size: 19px;
    line-height: 30px;
    margin-bottom: 36px;
  }

  .lainnya.hero figure {
    display: flex;
    justify-content: center;
  }

  .lainnya .wrap-middle {
    max-width: auto;
    margin: 0 18px;
  }

  .lainnya .wrap-middle .search-resi {
    padding: 0;
  }

  .lainnya .wrap-middle .search-resi__box {
    width: 100%;
  }

  .lainnya .box-ongkir {
    width: 100%;
    padding: 24px;
  }

  .lainnya .box-tujuan__list {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }

  .lainnya .box-tujuan__list h6 {
    font-size: 16px;
    line-height: 26px;
    flex: 0;
    height: auto;
  }

  .lainnya .box-tujuan__list span {
    display: none;
  }

  .lainnya .box-tujuan__list p {
    max-width: 100%;
    font-size: 16px;
    line-height: 26px;
    padding: 0;
    margin-bottom: 20px;
  }

  .lainnya .wrap-table {
    border: none;
    margin-bottom: 30px;
  }

  .lainnya .wrap-table table {
    border: 0;
  }

  .lainnya .wrap-table table caption {
    font-size: 1.3em;
  }

  .lainnya .wrap-table table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }

  .lainnya .wrap-table table tr {
    border: 1px solid rgba(0, 0, 0, 0.1);
    display: block;
    margin-bottom: 24px;
    border-radius: 16px;
    padding: 16px 0;
  }

  .lainnya .wrap-table table td {
    display: block;
    padding: 6px 14px 6px 135px;
    font-weight: 300;
    font-size: 14px;
    position: relative;
  }

  .lainnya .wrap-table table td::before {
    content: attr(data-label);
    display: block;
    font-weight: 700;
    font-size: 13px;
    position: absolute;
    top: 5px;
    left: 0;
    width: 122px;
    padding-left: 14px;
  }

  .lainnya .wrap-table table td:last-child {
    border-bottom: 0;
  }

  .lainnya .wrap-table a.see-more {
    min-width: 90px;
    max-width: unset;
    margin-right: 0;
  }

  .lainnya .wrap-table a.see-more::after {
    top: -2px;
  }

  .lainnya .field {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }

  .lainnya .field .ico {
    top: 14px;
  }

  .lainnya .field input {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    border: none;
  }

  .lainnya .field::after {
    display: none;
  }

  .lainnya .field:first-child .ico {
    top: -4px;
  }

  .lainnya .field:last-child {
    border-bottom: none;
  }

  .promo-detail h2 {
    font-size: 28px;
    line-height: 36px;
  }

  .faq {
    padding-top: 45px;
  }

  .faq.detail {
    padding-top: 110px;
    margin-bottom: 30px;
  }

  .faq.detail .faq-accordion h3 {
    font-size: 28px;
    line-height: 40px;
  }
}

/* milligram
----------------------------------------------------------------------------------------------*/
/*!
 * Milligram-scss v1.3.0
 * https://milligram.github.io
 *
 * Copyright (c) 2017 CJ Patoilo
 * Licensed under the MIT license
 */
/*!
 * Milligram-scss v1.3.0
 * https://milligram.github.io
 *
 * Copyright (c) 2017 CJ Patoilo
 * Licensed under the MIT license
 */
/*!
 * Milligram-scss v1.3.0
 * https://milligram.github.io
 *
 * Copyright (c) 2017 CJ Patoilo
 * Licensed under the MIT license
 */
 *,
 *:after,
 *:before {
   box-sizing: inherit;
 }
 
 html {
   box-sizing: border-box;
   font-size: 16px;
   text-size-adjust: 100%;
   -moz-text-size-adjust: 100%;
   -webkit-text-size-adjust: 100%;
 }
 
 body {
   color: #4D4D4D;
   font-family: "Outfit", "Roboto", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
   font-size: 1rem;
   font-weight: 300;
 }
 
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 blockquote {
   border-left: 3px solid #d1d1d1;
   margin-left: 0;
   margin-right: 0;
   padding: 0.625rem 0.9375rem;
 }
 blockquote *:last-child {
   margin-bottom: 0;
 }
 
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 .button,
 button,
 input[type=button],
 input[type=reset],
 input[type=submit] {
   background-color: #E11C22;
   border: 2px solid #E11C22;
   border-radius: 30px;
   color: #fff;
   cursor: pointer;
   display: inline-block;
   font-size: 1rem;
   font-weight: 700;
   height: 56px;
   letter-spacing: normal;
   line-height: 54px;
   padding: 0 32px;
   text-align: center;
   text-decoration: none;
   text-transform: none;
   white-space: nowrap;
   transition: all 0.2s ease-out;
 }
 .button:focus, .button:hover,
 button:focus,
 button:hover,
 input[type=button]:focus,
 input[type=button]:hover,
 input[type=reset]:focus,
 input[type=reset]:hover,
 input[type=submit]:focus,
 input[type=submit]:hover {
   background-color: #203475;
   border-color: #203475;
   color: #fff;
   outline: 0;
 }
 .button[disabled],
 button[disabled],
 input[type=button][disabled],
 input[type=reset][disabled],
 input[type=submit][disabled] {
   cursor: default;
   opacity: 0.5;
 }
 .button[disabled]:focus, .button[disabled]:hover,
 button[disabled]:focus,
 button[disabled]:hover,
 input[type=button][disabled]:focus,
 input[type=button][disabled]:hover,
 input[type=reset][disabled]:focus,
 input[type=reset][disabled]:hover,
 input[type=submit][disabled]:focus,
 input[type=submit][disabled]:hover {
   background-color: #E11C22;
   border-color: #E11C22;
 }
 .button.button-outline,
 button.button-outline,
 input[type=button].button-outline,
 input[type=reset].button-outline,
 input[type=submit].button-outline {
   background-color: transparent;
   color: #E11C22;
 }
 .button.button-outline:focus, .button.button-outline:hover,
 button.button-outline:focus,
 button.button-outline:hover,
 input[type=button].button-outline:focus,
 input[type=button].button-outline:hover,
 input[type=reset].button-outline:focus,
 input[type=reset].button-outline:hover,
 input[type=submit].button-outline:focus,
 input[type=submit].button-outline:hover {
   color: #203475;
 }
 .button.button-outline[disabled]:focus, .button.button-outline[disabled]:hover,
 button.button-outline[disabled]:focus,
 button.button-outline[disabled]:hover,
 input[type=button].button-outline[disabled]:focus,
 input[type=button].button-outline[disabled]:hover,
 input[type=reset].button-outline[disabled]:focus,
 input[type=reset].button-outline[disabled]:hover,
 input[type=submit].button-outline[disabled]:focus,
 input[type=submit].button-outline[disabled]:hover {
   border-color: inherit;
   color: #E11C22;
 }
 .button.button-clear,
 button.button-clear,
 input[type=button].button-clear,
 input[type=reset].button-clear,
 input[type=submit].button-clear {
   background-color: transparent;
   border-color: transparent;
   color: #E11C22;
   font-weight: 500;
 }
 .button.button-clear:focus, .button.button-clear:hover,
 button.button-clear:focus,
 button.button-clear:hover,
 input[type=button].button-clear:focus,
 input[type=button].button-clear:hover,
 input[type=reset].button-clear:focus,
 input[type=reset].button-clear:hover,
 input[type=submit].button-clear:focus,
 input[type=submit].button-clear:hover {
   background-color: transparent;
   border-color: transparent;
 }
 .button.button-clear[disabled]:focus, .button.button-clear[disabled]:hover,
 button.button-clear[disabled]:focus,
 button.button-clear[disabled]:hover,
 input[type=button].button-clear[disabled]:focus,
 input[type=button].button-clear[disabled]:hover,
 input[type=reset].button-clear[disabled]:focus,
 input[type=reset].button-clear[disabled]:hover,
 input[type=submit].button-clear[disabled]:focus,
 input[type=submit].button-clear[disabled]:hover {
   color: #E11C22;
 }
 .button.button-grey,
 button.button-grey,
 input[type=button].button-grey,
 input[type=reset].button-grey,
 input[type=submit].button-grey {
   background-color: #999999;
   border-color: #999999;
 }
 .button.button-outline-grey,
 button.button-outline-grey,
 input[type=button].button-outline-grey,
 input[type=reset].button-outline-grey,
 input[type=submit].button-outline-grey {
   background-color: transparent;
   border-color: #999999;
   color: #999999;
 }
 .button.button-arrow,
 button.button-arrow,
 input[type=button].button-arrow,
 input[type=reset].button-arrow,
 input[type=submit].button-arrow {
   padding: 0 26px 0 0;
   height: 22px;
   line-height: 18px;
   font-size: 0.875rem;
   position: relative;
 }
 .button.button-arrow::after,
 button.button-arrow::after,
 input[type=button].button-arrow::after,
 input[type=reset].button-arrow::after,
 input[type=submit].button-arrow::after {
   position: absolute;
   width: 18px;
   height: 18px;
   content: "";
   background: url("/images/material/icon-arrow.svg") no-repeat 0 0;
   top: 0;
   right: 0;
   transition: all 0.2s ease-out;
 }
 .button.button-arrow:hover::after,
 button.button-arrow:hover::after,
 input[type=button].button-arrow:hover::after,
 input[type=reset].button-arrow:hover::after,
 input[type=submit].button-arrow:hover::after {
   right: -3px;
 }
 .button.button-arrow:hover[disabled]::after,
 button.button-arrow:hover[disabled]::after,
 input[type=button].button-arrow:hover[disabled]::after,
 input[type=reset].button-arrow:hover[disabled]::after,
 input[type=submit].button-arrow:hover[disabled]::after {
   right: 0;
 }
 .button.button-arrow.button-arrow-grey,
 button.button-arrow.button-arrow-grey,
 input[type=button].button-arrow.button-arrow-grey,
 input[type=reset].button-arrow.button-arrow-grey,
 input[type=submit].button-arrow.button-arrow-grey {
   color: #999999;
 }
 .button.button-arrow.button-arrow-grey::after,
 button.button-arrow.button-arrow-grey::after,
 input[type=button].button-arrow.button-arrow-grey::after,
 input[type=reset].button-arrow.button-arrow-grey::after,
 input[type=submit].button-arrow.button-arrow-grey::after {
   background: url("/images/material/icon-arrow-grey.svg") no-repeat 0 0;
 }
 
 .button-nav-slider {
   position: absolute;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 56px;
   height: 56px;
   padding: 0;
   background: #fff;
   border-color: #fff;
   box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.08);
   color: #E11C22;
   z-index: 90;
 }
 .button-nav-slider i {
   font-size: 1.5rem;
 }
 .button-nav-slider:hover, .button-nav-slider:focus {
   background: #fff;
   border-color: #fff;
   color: #E11C22;
 }
 
 /* responsive tablet landscape
 ----------------------------------------------------------------------------------------------*/
 @media all and (max-width: 1200px) {
   .button,
 button,
 input[type=button],
 input[type=reset],
 input[type=submit] {
     height: 48px;
     line-height: 48px;
   }
 }
 /* responsive tablet potrait
 ----------------------------------------------------------------------------------------------*/
 /* responsive mobile
 ----------------------------------------------------------------------------------------------*/
 @media all and (max-width: 766px) {
   .button,
 button,
 input[type=button],
 input[type=reset],
 input[type=submit] {
     height: 40px;
     line-height: 40px;
   }
 
   .button-nav-slider {
     width: 48px;
     height: 48px;
   }
   .button-nav-slider i {
     font-size: 1.35rem;
   }
 }
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 code {
   background: #f4f5f6;
   border-radius: 4px;
   font-size: 86%;
   margin: 0 2px;
   padding: 2px 5px;
   white-space: nowrap;
 }
 
 pre {
   background: #f4f5f6;
   border-left: 3px solid #E11C22;
   overflow-y: hidden;
 }
 pre > code {
   border-radius: 0;
   display: block;
   padding: 10px 15px;
   white-space: pre;
 }
 
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 hr {
   border: 0;
   border-top: 1px solid #f4f5f6;
   margin: 30px 0;
 }
 
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 input[type=email],
 input[type=number],
 input[type=password],
 input[type=search],
 input[type=tel],
 input[type=text],
 input[type=url],
 textarea, input,
 select {
   appearance: none;
   background-color: transparent;
   border: 1px solid #d1d1d1;
   border-radius: 32px;
   box-shadow: none;
   box-sizing: inherit;
   height: 64px;
   padding: 6px 32px;
   width: 100%;
   color: #999999;
   font-size: 1.25rem;
   color: #999999;
   appearance: none;
   -moz-appearance: none;
   -webkit-appearance: none;
 }
 input[type=email]:focus,
 input[type=number]:focus,
 input[type=password]:focus,
 input[type=search]:focus,
 input[type=tel]:focus,
 input[type=text]:focus,
 input[type=url]:focus,
 textarea:focus, input:focus,
 select:focus {
   border-color: #E11C22;
   color: #212121;
   outline: 0;
 }
 
 input,
 textarea,
 select {
   font-family: "Outfit";
   font-weight: 400;
 }
 
 select {
   background: url("/images/material/ico-arrow-bottom.svg") center right 24px no-repeat;
   padding-right: 30px;
 }
 
 textarea {
   min-height: 65px;
   resize: none;
 }
 
 label,
 legend {
   display: block;
   font-size: 1rem;
   font-weight: 700;
   margin-bottom: 5px;
 }
 
 fieldset {
   border-width: 0;
   padding: 0;
 }
 
 input[type=checkbox],
 input[type=radio] {
   display: inline;
 }
 
 .label-inline {
   display: inline-block;
   font-weight: normal;
   margin-left: 5px;
 }
 
 .form input,
 .form select,
 .form textarea {
   margin-bottom: 0;
 }
 .form .form-group {
   position: relative;
   line-height: 0;
   margin-bottom: 24px;
 }
 .form .form-group label:first-child {
   color: #999999;
   font-weight: 400;
   font-size: 20px;
   left: 32px;
   line-height: 24px;
   margin-bottom: 0;
   position: absolute;
   top: 16px;
   z-index: -1;
   transition: 0.3s all ease;
 }
 .form .form-group label:first-child.active, .form .form-group label:first-child.label-select {
   color: #203475;
   font-weight: 500;
   font-size: 11px;
   line-height: 16px;
   top: 1px;
   transition: 0.3s all ease;
   background-color: white;
   width: calc(100% - 64px);
   padding-top: 3px;
   display: flex;
   z-index: 1;
 }
 .form .form-group .error {
   margin-top: 10px;
   font-size: 0.8rem;
   color: red;
 }
 .form .form-group input[type=email],
 .form .form-group input[type=number],
 .form .form-group input[type=password],
 .form .form-group input[type=search],
 .form .form-group input[type=tel],
 .form .form-group input[type=text],
 .form .form-group input[type=url],
 .form .form-group select {
   color: #212121;
   font-weight: 400;
   font-size: 20px;
   height: 56px;
   line-height: 2;
   padding-top: 14px;
   padding-bottom: 8px;
 }
 .form .form-group textarea {
   color: #212121;
   font-weight: 400;
   font-size: 20px;
   height: 120px;
   line-height: 24px !important;
   padding-top: 24px;
   padding-bottom: 8px;
   scrollbar-width: none;
 }
 .form .form-group textarea::-webkit-scrollbar {
   display: none;
 }
 .form .form-group .input-file {
   background-color: transparent;
   border: 1px solid #d1d1d1;
   border-radius: 32px;
   box-shadow: none;
   cursor: pointer;
   height: 56px !important;
   line-height: 1;
   padding: 0 32px;
   position: relative;
   display: block;
   overflow: hidden;
 }
 .form .form-group .input-file input {
   z-index: 9;
   height: 100%;
   width: 100%;
   cursor: pointer;
 }
 .form .form-group .input-file .info-text {
   display: flex;
   align-items: center;
   position: absolute;
   top: 16px;
   font-weight: 400;
   font-size: 20px;
   line-height: 24px;
   color: #999999;
   padding-right: 60px;
   z-index: 1;
   overflow: hidden;
   white-space: nowrap;
   cursor: pointer;
   max-width: 80%;
 }
 .form .form-group .input-file .btn {
   background: url(/images/material/icon-upload.svg) no-repeat center;
   position: absolute;
   right: 24px;
   top: 0;
   bottom: 0;
   width: 24px;
   height: 24px;
   margin: auto 0;
   z-index: 1;
   cursor: pointer;
 }
 .form .form-group .input-info {
   display: block;
   font-weight: 400;
   font-size: 14px;
   line-height: 24px;
   color: #999999;
   margin-top: 10px;
 }
 .form .form-group .input-error {
   font-size: 12px;
   font-style: italic;
   line-height: 20px;
   border-color: #E11C22;
   color: #212121;
   outline: 0;
 }
 .form .wrap-btn-form {
   display: flex !important;
   align-items: center;
 }
 .form .wrap-btn-form button {
   min-width: 200px;
 }
 .form .form-group-check {
   position: relative;
   line-height: 0;
   margin-bottom: 24px;
 }
 .form .form-group-check.inline-check {
   display: flex;
   flex-wrap: wrap;
   gap: 0 24px;
 }
 .form .form-group-check.inline-check label {
   flex: 0 0 100%;
   max-width: 100%;
 }
 .form .form-group-check.inline-check .radio-input {
   flex: 0 0 auto;
 }
 .form .form-group-check label {
   font-weight: 500;
   font-size: 0.875rem;
   line-height: 24px;
   margin-bottom: 16px;
 }
 .form .form-group-check .radio-input [type=radio]:checked,
 .form .form-group-check .radio-input [type=radio]:not(:checked) {
   position: absolute;
   left: -9999px;
 }
 .form .form-group-check .radio-input [type=radio]:checked + label,
 .form .form-group-check .radio-input [type=radio]:not(:checked) + label {
   position: relative;
   padding-left: 36px;
   cursor: pointer;
   font-size: 16px;
   line-height: 24px;
   display: inline-block;
   color: #58595b;
 }
 .form .form-group-check .radio-input [type=radio]:checked + label::before,
 .form .form-group-check .radio-input [type=radio]:not(:checked) + label::before {
   content: "";
   position: absolute;
   left: 0;
   top: 0;
   width: 24px;
   height: 24px;
   border: 2px solid #99a5c9;
   border-radius: 100%;
   background: #fff;
 }
 .form .form-group-check .radio-input [type=radio]:checked + label::after,
 .form .form-group-check .radio-input [type=radio]:not(:checked) + label::after {
   content: "";
   width: 14px;
   height: 14px;
   position: absolute;
   top: 5px;
   left: 5px;
   border-radius: 100%;
   transition: all 0.2s ease;
 }
 .form .form-group-check .radio-input [type=radio]:not(:checked) + label::after {
   background: transparent;
   transform: scale(1);
 }
 .form .form-group-check .radio-input [type=radio]:not(:checked) + label:hover::after {
   background: #999999;
 }
 .form .form-group-check .radio-input [type=radio]:checked + label::before {
   border: 2px solid #203475;
 }
 .form .form-group-check .radio-input [type=radio]:checked + label::after {
   background: #E11C22;
   transform: scale(1);
 }
 .form .form-group-check .checkbox-input [type=checkbox]:checked,
 .form .form-group-check .checkbox-input [type=checkbox]:not(:checked) {
   position: absolute;
   left: -9999px;
 }
 .form .form-group-check .checkbox-input [type=checkbox]:checked + label,
 .form .form-group-check .checkbox-input [type=checkbox]:not(:checked) + label {
   position: relative;
   padding-left: 36px;
   cursor: pointer;
   font-size: 16px;
   line-height: 24px;
   display: inline-block;
   color: #58595b;
 }
 .form .form-group-check .checkbox-input [type=checkbox]:checked + label::before,
 .form .form-group-check .checkbox-input [type=checkbox]:not(:checked) + label::before {
   content: "";
   position: absolute;
   left: 0;
   top: 0;
   width: 24px;
   height: 24px;
   border: 2px solid #99a5c9;
   border-radius: 4px;
   background: #fff;
 }
 .form .form-group-check .checkbox-input [type=checkbox]:checked + label::after,
 .form .form-group-check .checkbox-input [type=checkbox]:not(:checked) + label::after {
   content: "";
   width: 16px;
   height: 16px;
   position: absolute;
   top: 4px;
   left: 4px;
   border-radius: 4px;
   transition: all 0.2s ease;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
 }
 .form .form-group-check .checkbox-input [type=checkbox]:not(:checked) + label::after {
   transform: scale(1);
 }
 .form .form-group-check .checkbox-input [type=checkbox]:not(:checked) + label:hover::after {
   background-image: url(/images/material/ic-checkbox-hover.svg);
 }
 .form .form-group-check .checkbox-input [type=checkbox]:checked + label::before {
   background-color: #E11C22;
   border: 2px solid #203475;
 }
 .form .form-group-check .checkbox-input [type=checkbox]:checked + label::after {
   background-image: url(/images/material/ic-checkbox-active.svg);
   transform: scale(1);
 }
 
 /* responsive mobile
 ----------------------------------------------------------------------------------------------*/
 @media all and (max-width: 766px) {
   .form input,
 .form select,
 .form textarea {
     margin-bottom: 0;
   }
   .form .form-group {
     margin-bottom: 20px;
   }
   .form .form-group label:first-child {
     font-size: 15px;
     top: 12px;
   }
   .form .form-group input[type=email],
 .form .form-group input[type=number],
 .form .form-group input[type=password],
 .form .form-group input[type=search],
 .form .form-group input[type=tel],
 .form .form-group input[type=text],
 .form .form-group input[type=url],
 .form .form-group select {
     font-size: 15px;
     height: 48px;
     padding-top: 16px;
     padding-bottom: 4px;
   }
   .form .form-group textarea {
     font-size: 15px;
     padding-top: 20px;
     padding-bottom: 4px;
   }
   .form .form-group .input-file {
     height: 48px !important;
   }
   .form .form-group .input-file .info-text {
     top: 12px;
     font-size: 15px;
   }
   .form .form-group .g-recaptcha {
     transform: scale(0.9);
     position: relative;
     margin-left: -5%;
   }
   .form .wrap-btn-form .form-group {
     width: 100%;
   }
   .form .wrap-btn-form button {
     width: 100%;
   }
   .form .form-group-check.inline-check {
     flex-direction: column;
   }
   .form .form-group-check.inline-check .radio-input {
     flex: 0 0 100%;
     max-width: 100%;
   }
   .form .form-group-check .radio-input [type=radio]:checked,
 .form .form-group-check .radio-input [type=radio]:not(:checked) {
     position: absolute;
     left: -9999px;
   }
   .form .form-group-check .radio-input [type=radio]:checked + label,
 .form .form-group-check .radio-input [type=radio]:not(:checked) + label {
     font-size: 14px;
   }
   .form .wrap-btn-form {
     margin-top: 20px;
   }
 }
 .container {
   margin: 0 auto;
   max-width: 1120px;
   padding: 0 20px;
   position: relative;
   width: 100%;
 }
 .contents p{
  font-size: 20px;
  line-height: 30px;
 }
 .wrapper {
   margin: 0 auto;
   max-width: 1170px;
   padding: 0;
   position: relative;
   width: 100%;
 }
 
 .wrapper-small {
   margin: 0 auto;
   max-width: 970px;
   padding: 0;
   position: relative;
   width: 100%;
 }
 
 @media all and (max-width: 1200px) {
   .wrapper,
 .wrapper-small {
     max-width: calc(100% - 80px);
   }
 }
 @media all and (max-width: 766px) {
   .wrapper,
 .wrapper-small {
     max-width: calc(100% - 48px);
   }
 }
 .row {
   display: flex;
   flex-direction: column;
   padding: 0;
   width: 100%;
 }
 .row.row-no-padding {
   padding: 0;
 }
 .row.row-no-padding > .column {
   padding: 0;
 }
 .row.row-wrap {
   flex-wrap: wrap;
 }
 .row.row-grid {
   flex-wrap: wrap;
   gap: 30px 0;
   margin-left: -15px;
   width: calc(100% + 30px);
 }
 .row.row-grid .column {
   margin-bottom: inherit;
   padding: 0 15px;
 }
 .row.row-top {
   align-items: flex-start;
 }
 .row.row-bottom {
   align-items: flex-end;
 }
 .row.row-center {
   align-items: center;
 }
 .row.row-stretch {
   align-items: stretch;
 }
 .row.row-baseline {
   align-items: baseline;
 }
 .row .column {
   display: block;
   flex: 1 1 auto;
   margin-left: 0;
   max-width: 100%;
   width: 100%;
 }
 .row .column.column-offset-1 {
   margin-left: 1%;
 }
 .row .column.column-offset-2 {
   margin-left: 2%;
 }
 .row .column.column-offset-3 {
   margin-left: 3%;
 }
 .row .column.column-offset-4 {
   margin-left: 4%;
 }
 .row .column.column-offset-5 {
   margin-left: 5%;
 }
 .row .column.column-offset-6 {
   margin-left: 6%;
 }
 .row .column.column-offset-7 {
   margin-left: 7%;
 }
 .row .column.column-offset-8 {
   margin-left: 8%;
 }
 .row .column.column-offset-9 {
   margin-left: 9%;
 }
 .row .column.column-offset-10 {
   margin-left: 10%;
 }
 .row .column.column-offset-11 {
   margin-left: 11%;
 }
 .row .column.column-offset-12 {
   margin-left: 12%;
 }
 .row .column.column-offset-13 {
   margin-left: 13%;
 }
 .row .column.column-offset-14 {
   margin-left: 14%;
 }
 .row .column.column-offset-15 {
   margin-left: 15%;
 }
 .row .column.column-offset-16 {
   margin-left: 16%;
 }
 .row .column.column-offset-17 {
   margin-left: 17%;
 }
 .row .column.column-offset-18 {
   margin-left: 18%;
 }
 .row .column.column-offset-19 {
   margin-left: 19%;
 }
 .row .column.column-offset-20 {
   margin-left: 20%;
 }
 .row .column.column-offset-21 {
   margin-left: 21%;
 }
 .row .column.column-offset-22 {
   margin-left: 22%;
 }
 .row .column.column-offset-23 {
   margin-left: 23%;
 }
 .row .column.column-offset-24 {
   margin-left: 24%;
 }
 .row .column.column-offset-25 {
   margin-left: 25%;
 }
 .row .column.column-offset-26 {
   margin-left: 26%;
 }
 .row .column.column-offset-27 {
   margin-left: 27%;
 }
 .row .column.column-offset-28 {
   margin-left: 28%;
 }
 .row .column.column-offset-29 {
   margin-left: 29%;
 }
 .row .column.column-offset-30 {
   margin-left: 30%;
 }
 .row .column.column-offset-31 {
   margin-left: 31%;
 }
 .row .column.column-offset-32 {
   margin-left: 32%;
 }
 .row .column.column-offset-33 {
   margin-left: 33%;
 }
 .row .column.column-offset-34 {
   margin-left: 34%;
 }
 .row .column.column-offset-35 {
   margin-left: 35%;
 }
 .row .column.column-offset-36 {
   margin-left: 36%;
 }
 .row .column.column-offset-37 {
   margin-left: 37%;
 }
 .row .column.column-offset-38 {
   margin-left: 38%;
 }
 .row .column.column-offset-39 {
   margin-left: 39%;
 }
 .row .column.column-offset-40 {
   margin-left: 40%;
 }
 .row .column.column-offset-41 {
   margin-left: 41%;
 }
 .row .column.column-offset-42 {
   margin-left: 42%;
 }
 .row .column.column-offset-43 {
   margin-left: 43%;
 }
 .row .column.column-offset-44 {
   margin-left: 44%;
 }
 .row .column.column-offset-45 {
   margin-left: 45%;
 }
 .row .column.column-offset-46 {
   margin-left: 46%;
 }
 .row .column.column-offset-47 {
   margin-left: 47%;
 }
 .row .column.column-offset-48 {
   margin-left: 48%;
 }
 .row .column.column-offset-49 {
   margin-left: 49%;
 }
 .row .column.column-offset-50 {
   margin-left: 50%;
 }
 .row .column.column-offset-51 {
   margin-left: 51%;
 }
 .row .column.column-offset-52 {
   margin-left: 52%;
 }
 .row .column.column-offset-53 {
   margin-left: 53%;
 }
 .row .column.column-offset-54 {
   margin-left: 54%;
 }
 .row .column.column-offset-55 {
   margin-left: 55%;
 }
 .row .column.column-offset-56 {
   margin-left: 56%;
 }
 .row .column.column-offset-57 {
   margin-left: 57%;
 }
 .row .column.column-offset-58 {
   margin-left: 58%;
 }
 .row .column.column-offset-59 {
   margin-left: 59%;
 }
 .row .column.column-offset-60 {
   margin-left: 60%;
 }
 .row .column.column-offset-61 {
   margin-left: 61%;
 }
 .row .column.column-offset-62 {
   margin-left: 62%;
 }
 .row .column.column-offset-63 {
   margin-left: 63%;
 }
 .row .column.column-offset-64 {
   margin-left: 64%;
 }
 .row .column.column-offset-65 {
   margin-left: 65%;
 }
 .row .column.column-offset-66 {
   margin-left: 66%;
 }
 .row .column.column-offset-67 {
   margin-left: 67%;
 }
 .row .column.column-offset-68 {
   margin-left: 68%;
 }
 .row .column.column-offset-69 {
   margin-left: 69%;
 }
 .row .column.column-offset-70 {
   margin-left: 70%;
 }
 .row .column.column-offset-71 {
   margin-left: 71%;
 }
 .row .column.column-offset-72 {
   margin-left: 72%;
 }
 .row .column.column-offset-73 {
   margin-left: 73%;
 }
 .row .column.column-offset-74 {
   margin-left: 74%;
 }
 .row .column.column-offset-75 {
   margin-left: 75%;
 }
 .row .column.column-offset-76 {
   margin-left: 76%;
 }
 .row .column.column-offset-77 {
   margin-left: 77%;
 }
 .row .column.column-offset-78 {
   margin-left: 78%;
 }
 .row .column.column-offset-79 {
   margin-left: 79%;
 }
 .row .column.column-offset-80 {
   margin-left: 80%;
 }
 .row .column.column-offset-81 {
   margin-left: 81%;
 }
 .row .column.column-offset-82 {
   margin-left: 82%;
 }
 .row .column.column-offset-83 {
   margin-left: 83%;
 }
 .row .column.column-offset-84 {
   margin-left: 84%;
 }
 .row .column.column-offset-85 {
   margin-left: 85%;
 }
 .row .column.column-offset-86 {
   margin-left: 86%;
 }
 .row .column.column-offset-87 {
   margin-left: 87%;
 }
 .row .column.column-offset-88 {
   margin-left: 88%;
 }
 .row .column.column-offset-89 {
   margin-left: 89%;
 }
 .row .column.column-offset-90 {
   margin-left: 90%;
 }
 .row .column.column-offset-91 {
   margin-left: 91%;
 }
 .row .column.column-offset-92 {
   margin-left: 92%;
 }
 .row .column.column-offset-93 {
   margin-left: 93%;
 }
 .row .column.column-offset-94 {
   margin-left: 94%;
 }
 .row .column.column-offset-95 {
   margin-left: 95%;
 }
 .row .column.column-offset-96 {
   margin-left: 96%;
 }
 .row .column.column-offset-97 {
   margin-left: 97%;
 }
 .row .column.column-offset-98 {
   margin-left: 98%;
 }
 .row .column.column-offset-99 {
   margin-left: 99%;
 }
 .row .column.column-offset-100 {
   margin-left: 100%;
 }
 .row .column.column-offset-33, .row .column.column-offset-34 {
   margin-left: 33.3333%;
 }
 .row .column.column-offset-66, .row .column.column-offset-67 {
   margin-left: 66.6666%;
 }
 .row .column.column-1 {
   flex: 0 0 1%;
   max-width: 1%;
 }
 .row .column.column-2 {
   flex: 0 0 2%;
   max-width: 2%;
 }
 .row .column.column-3 {
   flex: 0 0 3%;
   max-width: 3%;
 }
 .row .column.column-4 {
   flex: 0 0 4%;
   max-width: 4%;
 }
 .row .column.column-5 {
   flex: 0 0 5%;
   max-width: 5%;
 }
 .row .column.column-6 {
   flex: 0 0 6%;
   max-width: 6%;
 }
 .row .column.column-7 {
   flex: 0 0 7%;
   max-width: 7%;
 }
 .row .column.column-8 {
   flex: 0 0 8%;
   max-width: 8%;
 }
 .row .column.column-9 {
   flex: 0 0 9%;
   max-width: 9%;
 }
 .row .column.column-10 {
   flex: 0 0 10%;
   max-width: 10%;
 }
 .row .column.column-11 {
   flex: 0 0 11%;
   max-width: 11%;
 }
 .row .column.column-12 {
   flex: 0 0 12%;
   max-width: 12%;
 }
 .row .column.column-13 {
   flex: 0 0 13%;
   max-width: 13%;
 }
 .row .column.column-14 {
   flex: 0 0 14%;
   max-width: 14%;
 }
 .row .column.column-15 {
   flex: 0 0 15%;
   max-width: 15%;
 }
 .row .column.column-16 {
   flex: 0 0 16%;
   max-width: 16%;
 }
 .row .column.column-17 {
   flex: 0 0 17%;
   max-width: 17%;
 }
 .row .column.column-18 {
   flex: 0 0 18%;
   max-width: 18%;
 }
 .row .column.column-19 {
   flex: 0 0 19%;
   max-width: 19%;
 }
 .row .column.column-20 {
   flex: 0 0 20%;
   max-width: 20%;
 }
 .row .column.column-21 {
   flex: 0 0 21%;
   max-width: 21%;
 }
 .row .column.column-22 {
   flex: 0 0 22%;
   max-width: 22%;
 }
 .row .column.column-23 {
   flex: 0 0 23%;
   max-width: 23%;
 }
 .row .column.column-24 {
   flex: 0 0 24%;
   max-width: 24%;
 }
 .row .column.column-25 {
   flex: 0 0 25%;
   max-width: 25%;
 }
 .row .column.column-26 {
   flex: 0 0 26%;
   max-width: 26%;
 }
 .row .column.column-27 {
   flex: 0 0 27%;
   max-width: 27%;
 }
 .row .column.column-28 {
   flex: 0 0 28%;
   max-width: 28%;
 }
 .row .column.column-29 {
   flex: 0 0 29%;
   max-width: 29%;
 }
 .row .column.column-30 {
   flex: 0 0 30%;
   max-width: 30%;
 }
 .row .column.column-31 {
   flex: 0 0 31%;
   max-width: 31%;
 }
 .row .column.column-32 {
   flex: 0 0 32%;
   max-width: 32%;
 }
 .row .column.column-35 {
   flex: 0 0 35%;
   max-width: 35%;
 }
 .row .column.column-36 {
   flex: 0 0 36%;
   max-width: 36%;
 }
 .row .column.column-37 {
   flex: 0 0 37%;
   max-width: 37%;
 }
 .row .column.column-38 {
   flex: 0 0 38%;
   max-width: 38%;
 }
 .row .column.column-39 {
   flex: 0 0 39%;
   max-width: 39%;
 }
 .row .column.column-40 {
   flex: 0 0 40%;
   max-width: 40%;
 }
 .row .column.column-41 {
   flex: 0 0 41%;
   max-width: 41%;
 }
 .row .column.column-42 {
   flex: 0 0 42%;
   max-width: 42%;
 }
 .row .column.column-43 {
   flex: 0 0 43%;
   max-width: 43%;
 }
 .row .column.column-44 {
   flex: 0 0 44%;
   max-width: 44%;
 }
 .row .column.column-45 {
   flex: 0 0 45%;
   max-width: 45%;
 }
 .row .column.column-46 {
   flex: 0 0 46%;
   max-width: 46%;
 }
 .row .column.column-47 {
   flex: 0 0 47%;
   max-width: 47%;
 }
 .row .column.column-48 {
   flex: 0 0 48%;
   max-width: 48%;
 }
 .row .column.column-49 {
   flex: 0 0 49%;
   max-width: 49%;
 }
 .row .column.column-50 {
   flex: 0 0 50%;
   max-width: 50%;
 }
 .row .column.column-51 {
   flex: 0 0 51%;
   max-width: 51%;
 }
 .row .column.column-52 {
   flex: 0 0 52%;
   max-width: 52%;
 }
 .row .column.column-53 {
   flex: 0 0 53%;
   max-width: 53%;
 }
 .row .column.column-54 {
   flex: 0 0 54%;
   max-width: 54%;
 }
 .row .column.column-55 {
   flex: 0 0 55%;
   max-width: 55%;
 }
 .row .column.column-56 {
   flex: 0 0 56%;
   max-width: 56%;
 }
 .row .column.column-57 {
   flex: 0 0 57%;
   max-width: 57%;
 }
 .row .column.column-58 {
   flex: 0 0 58%;
   max-width: 58%;
 }
 .row .column.column-59 {
   flex: 0 0 59%;
   max-width: 59%;
 }
 .row .column.column-60 {
   flex: 0 0 60%;
   max-width: 60%;
 }
 .row .column.column-61 {
   flex: 0 0 61%;
   max-width: 61%;
 }
 .row .column.column-62 {
   flex: 0 0 62%;
   max-width: 62%;
 }
 .row .column.column-63 {
   flex: 0 0 63%;
   max-width: 63%;
 }
 .row .column.column-64 {
   flex: 0 0 64%;
   max-width: 64%;
 }
 .row .column.column-65 {
   flex: 0 0 65%;
   max-width: 65%;
 }
 .row .column.column-68 {
   flex: 0 0 68%;
   max-width: 68%;
 }
 .row .column.column-69 {
   flex: 0 0 69%;
   max-width: 69%;
 }
 .row .column.column-70 {
   flex: 0 0 70%;
   max-width: 70%;
 }
 .row .column.column-71 {
   flex: 0 0 71%;
   max-width: 71%;
 }
 .row .column.column-72 {
   flex: 0 0 72%;
   max-width: 72%;
 }
 .row .column.column-73 {
   flex: 0 0 73%;
   max-width: 73%;
 }
 .row .column.column-74 {
   flex: 0 0 74%;
   max-width: 74%;
 }
 .row .column.column-75 {
   flex: 0 0 75%;
   max-width: 75%;
 }
 .row .column.column-76 {
   flex: 0 0 76%;
   max-width: 76%;
 }
 .row .column.column-77 {
   flex: 0 0 77%;
   max-width: 77%;
 }
 .row .column.column-78 {
   flex: 0 0 78%;
   max-width: 78%;
 }
 .row .column.column-79 {
   flex: 0 0 79%;
   max-width: 79%;
 }
 .row .column.column-80 {
   flex: 0 0 80%;
   max-width: 80%;
 }
 .row .column.column-81 {
   flex: 0 0 81%;
   max-width: 81%;
 }
 .row .column.column-82 {
   flex: 0 0 82%;
   max-width: 82%;
 }
 .row .column.column-83 {
   flex: 0 0 83%;
   max-width: 83%;
 }
 .row .column.column-84 {
   flex: 0 0 84%;
   max-width: 84%;
 }
 .row .column.column-85 {
   flex: 0 0 85%;
   max-width: 85%;
 }
 .row .column.column-86 {
   flex: 0 0 86%;
   max-width: 86%;
 }
 .row .column.column-87 {
   flex: 0 0 87%;
   max-width: 87%;
 }
 .row .column.column-88 {
   flex: 0 0 88%;
   max-width: 88%;
 }
 .row .column.column-89 {
   flex: 0 0 89%;
   max-width: 89%;
 }
 .row .column.column-90 {
   flex: 0 0 90%;
   max-width: 90%;
 }
 .row .column.column-91 {
   flex: 0 0 91%;
   max-width: 91%;
 }
 .row .column.column-92 {
   flex: 0 0 92%;
   max-width: 92%;
 }
 .row .column.column-93 {
   flex: 0 0 93%;
   max-width: 93%;
 }
 .row .column.column-94 {
   flex: 0 0 94%;
   max-width: 94%;
 }
 .row .column.column-95 {
   flex: 0 0 95%;
   max-width: 95%;
 }
 .row .column.column-96 {
   flex: 0 0 96%;
   max-width: 96%;
 }
 .row .column.column-97 {
   flex: 0 0 97%;
   max-width: 97%;
 }
 .row .column.column-98 {
   flex: 0 0 98%;
   max-width: 98%;
 }
 .row .column.column-99 {
   flex: 0 0 99%;
   max-width: 99%;
 }
 .row .column.column-100 {
   flex: 0 0 100%;
   max-width: 100%;
 }
 .row .column.column-33, .row .column.column-34 {
   flex: 0 0 33.3333%;
   max-width: 33.3333%;
 }
 .row .column.column-66, .row .column.column-67 {
   flex: 0 0 66.6666%;
   max-width: 66.6666%;
 }
 .row .column .column-top {
   align-self: flex-start;
 }
 .row .column .column-bottom {
   align-self: flex-end;
 }
 .row .column .column-center {
   align-self: center;
 }
 
 @media all and (max-width: 1200px) {
   .row.row-grid {
     flex-wrap: wrap;
     gap: 20px 0;
     margin-left: -10px;
     width: calc(100% + 20px);
   }
   .row.row-grid .column {
     margin-bottom: inherit;
     padding: 0 10px;
   }
 }
 @media all and (max-width: 766px) {
   .row .column {
     flex: 0 0 100% !important;
     max-width: 100% !important;
   }
 }
 @media (min-width: 400px) {
   .row {
     flex-direction: row;
     margin-left: -10px;
     width: calc(100% + 20px);
   }
   .row .column {
     margin-bottom: inherit;
     padding: 0 10px;
   }
 }
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 a {
   display: inline-block;
   color: #E11C22;
   text-decoration: none;
 }
 a:focus, a:hover {
   color: #E11C22;
 }
 a.link-arrow {
   padding: 0 26px 0 0;
   height: 22px;
   line-height: 18px;
   font-size: 0.875rem;
   position: relative;
   font-weight: 500;
 }
 a.link-arrow.arrow-left {
   padding: 0 0 0 26px;
 }
 a.link-arrow.arrow-left::after {
   left: 0;
   right: unset;
   transform: scaleX(-1);
 }
 a.link-arrow.arrow-left:hover::after {
   left: -3px;
 }
 a.link-arrow::after {
   position: absolute;
   width: 18px;
   height: 18px;
   content: "";
   background: url("/images/material/icon-arrow.svg") no-repeat 0 0;
   top: 0;
   right: 0;
   transition: all 0.2s ease-out;
 }
 a.link-arrow:hover::after {
   right: -3px;
 }
 
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 dl,
 ol,
 ul {
   list-style: none;
   margin-top: 0;
   padding-left: 0;
 }
 dl dl,
 dl ol,
 dl ul,
 ol dl,
 ol ol,
 ol ul,
 ul dl,
 ul ol,
 ul ul {
   margin: 7px 0 15px 0px;
 }
 
 .content-pages li {
   line-height: 1.5;
   margin-bottom: 4px;
 }
 .content-pages ol {
   counter-reset: count1;
 }
 .content-pages ol li {
   position: relative;
   padding-left: 25px;
   counter-increment: count1;
 }
 .content-pages ol li::before {
   content: counter(count1) ". ";
   position: absolute;
   top: 0;
   left: 0;
 }
 .content-pages ul li {
   position: relative;
   padding-left: 25px;
   counter-reset: count1;
 }
 .content-pages ul li::before {
   content: "";
   display: block;
   position: absolute;
   top: 9px;
   left: 2px;
   width: 6px;
   height: 6px;
   border-radius: 50%;
   background: #4D4D4D;
 }
 .content-pages ul li ul li::before {
   background: transparent;
   border: 1.5px solid #4D4D4D;
   box-sizing: border-box;
 }
 .content-pages ul li ol {
   counter-reset: count2;
 }
 .content-pages ul li ol li {
   position: relative;
   padding-left: 25px;
   counter-increment: count2;
 }
 .content-pages ul li ol li::before {
   background: none;
   content: counter(count2) ". ";
   position: absolute;
   top: 0;
   left: 0;
 }
 .content-pages ul.alphabet {
   counter-reset: list;
 }
 .content-pages ul.alphabet li {
   counter-increment: list;
   position: relative;
   padding-left: 25px;
 }
 .content-pages ul.alphabet li::before {
   background: transparent;
   counter-increment: list;
   content: counter(list, lower-alpha) ". ";
   height: unset;
   top: 0;
   width: unset;
 }
 
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 .button,
 button,
 dd,
 dt,
 li {
   margin-bottom: 10px;
 }
 
 fieldset,
 input,
 select,
 textarea {
   margin-bottom: 15px;
 }
 
 blockquote,
 dl,
 ol,
 p,
 pre,
 table,
 ul {
   margin-bottom: 25px;
 }
 
 form {
   margin: 0;
 }
 
 p {
   line-height: 1.5;
 }
 
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 table {
   border-spacing: 0;
   width: 100%;
 }
 
 td,
 th {
   border-bottom: 1px solid #e1e1e1;
   padding: 12px 13px;
   text-align: left;
 }
 td:first-child,
 th:first-child {
   padding-left: 0;
 }
 td:last-child,
 th:last-child {
   padding-right: 0;
 }
 
 /* responsive tablet landscape
 ----------------------------------------------------------------------------------------------*/
 @media all and (max-width: 1200px) {
   td,
 th {
     padding: 10px;
   }
 }
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 b,
 strong {
   font-weight: bold;
 }
 
 p {
   margin-top: 0;
 }
 p.lead {
   font-size: 1.5rem;
   line-height: 1.5;
 }
 
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
   font-weight: 600;
   margin-bottom: 20px;
   margin-top: 0;
 }
 
 h1 {
   font-size: 4rem;
   line-height: 1.12;
   color: #203475;
 }
 
 h2 {
   font-size: 3rem;
   line-height: 1.17;
   color: #203475;
 }
 
 h3 {
  font-size: 32px;
  line-height: 1.4;
   color: #212121;
 }
 
 h4 {
   font-weight: 700;
   font-size: 2rem;
   line-height: 1.35;
   color: #212121;
 }
 
 h5 {
   font-size: 1.5rem;
   line-height: 1.292;
   color: #212121;
 }
 
 h6 {
   font-weight: 600;
   font-size: 1.25rem;
   line-height: 1.4;
   color: #212121;
 }
 
 /* responsive tablet landscape
 ----------------------------------------------------------------------------------------------*/
 @media all and (max-width: 1200px) {
   p.lead {
     font-size: 21px;
     line-height: 32px;
   }
 
   h1 {
     font-size: 3rem;
     line-height: 1.17;
   }
 
   h2 {
     font-size: 2.5rem;
     line-height: 1.2;
   }
 
   h5 {
     font-size: 21px;
     line-height: 36px;
   }
 }
 /* responsive tablet potrait
 ----------------------------------------------------------------------------------------------*/
 @media all and (max-width: 1023px) {
   p {
     line-height: 26px;
   }
   p.lead {
     font-size: 19px;
     line-height: 36px;
   }
 
   h1 {
     font-size: 2.5rem;
     line-height: 1.2;
   }
 
   h2 {
     font-size: 32px;
     line-height: 40px;
   }
 }
 /* responsive mobile
 ----------------------------------------------------------------------------------------------*/
 @media all and (max-width: 766px) {
   p.lead {
     font-size: 17px;
     line-height: 30px;
   }
 
   h1 {
     font-size: 2rem;
     line-height: 1.25;
   }
 
   h2 {
     font-size: 28px;
     line-height: 36px;
   }
 
   h3 {
     font-size: 1.75rem;
     line-height: 1.2;
   }
 }
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 img {
   max-width: 100%;
 }
 
 figure {
   margin: 0;
 }
 figure img {
   vertical-align: top;
 }
 
 /*!
  * Milligram-scss v1.3.0
  * https://milligram.github.io
  *
  * Copyright (c) 2017 CJ Patoilo
  * Licensed under the MIT license
  */
 .clearfix:after {
   clear: both;
   content: " ";
   display: table;
 }
 
 .float-left {
   float: left;
 }
 
 .float-right {
   float: right;
 }
 
/* @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,700,800); */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@100;200;300;400;500;600;700;800;900&display=swap');

/*
    Taken From : http://serenedestiny.com/blog/web-development/lets-create-the-perfect-css-reset; 
    Reset all your HTML Element to condition zero.
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong,tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}
body {
    line-height: 1;
}

textarea { overflow: auto; margin: 0;}
input { border: 0px solid white; margin: 0; padding: 0; }

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: "";
    content: none;
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}





/* global
----------------------------------------------------------------------------------------------*/
a { color:#29308e; text-decoration: none; outline: none }
a:hover {cursor: pointer; color:#333333; }

p {
    margin:1px 0 15px; 
    line-height:20px;
}
input, textarea, select {
    font-size:12px; 
    font-family:arial,tahoma, times new roman; 
    border:none; 
    border:1px solid #D8D8D8; 
    padding:4px; 
    margin:0;
    color:#666;
}

strong { font-weight: bold; }
em { font-style: italic; }
del { text-decoration: line-through; }
th { font-weight: normal; }

.left { float: left; display: inline; }
.right { float: right; display: inline;} 
.italic {font-style:italic;}
.bold {font-weight:bold;}
.clear { 
    clear:both; 
    padding:0; 
    margin:0; 
}
.before_clear:before,
.after_clear:after{
    content: '';
    display: block;
    clear: both;
}
h1, h2, h3, h4, h5, h6 {font-weight:normal;} 
h1 {font-size:40px;}
h2 {font-size:35px; margin-bottom: 15px; margin-top: 15px;}
h3 {font-size:28px; margin-bottom: 10px; margin-top: 10px;}
h4 {font-size:18px;}
h5 {font-size:16px;}
h6 {font-size:14px;}
.contents ul{
  font-size: 20px !important;
  line-height: 30px;
  list-style: disc;
  margin-left: 35px;
}
/* MOBILE STYLES */
/* MOBILE STYLES */
@media (max-width: 991px) {

  /* Show hamburger on mobile */
  .navbar-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
  }

  /* Hide normal navbar items */
  .navbar-collapse.offcanvas {
    position: fixed;
    top: 0;
    height: 100%;
    background: #fff;
    box-shadow: -2px 0 6px rgba(0,0,0,0.15);
    transition: right 0.3s ease;
    z-index: 1000;
    display: flex;
    flex-direction: column;
  }

  /* Slide in when open */
  .navbar-collapse.offcanvas.open {
    right: 0;
  }

  /* Offcanvas overlay */
  .offcanvas-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 999;
  }

  .offcanvas-overlay.show {
    display: block;
  }

  /* Mobile nav list layout */
  .navbar-nav {
    flex-direction: column;
    align-items: flex-start;
  }

  .navbar-nav .nav-item {
    width: 100%;
  }

  .navbar-nav .nav-link {
    width: 100%;
    padding: 15px;
    border-bottom: 1px solid #eee;
  }

  /* Show language switcher in mobile menu */
  .navbar-lang {
    display: flex;
    flex-direction: column;
    margin-top: auto;
  }

  /* Dropdown menu for language */
  .dropdown-menu {
    display: none;
    position: static;
    box-shadow: none;
    visibility: visible;
    opacity: 1;
    background: transparent;
  }

  .dropdown-menu.open {
    display: block;
  }
}