.hbanner {
  position: relative;
  overflow: hidden;
  background: linear-gradient(115deg, #FFFBEB 0.53%, #FFEAEB 111.44%); }
  .hbanner.is-inview .hbanner-des,
  .hbanner.is-inview .hbanner-block,
  .hbanner.is-inview .hbanner-filter,
  .hbanner.is-inview .hbanner-btn {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  .hbanner.is-inview .hbanner-des {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s; }
  .hbanner.is-inview .hbanner-filter {
    -webkit-transition-delay: 0.3s;
    transition-delay: 0.3s; }
  .hbanner.is-inview .hbanner-block {
    -webkit-transition-delay: 0.45s;
    transition-delay: 0.45s; }
  .hbanner.is-inview .hbanner-btn {
    -webkit-transition-delay: 0.6s;
    transition-delay: 0.6s; }
  @media screen and (max-width: 800px) {
    .hbanner-col {
      width: 100%; } }
  .hbanner-bdy {
    min-height: calc(850 / 1728 * 100vw);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    @media screen and (min-width: 1201px) {
      .hbanner-bdy {
        padding-top: var(--size-hd); } }
    .hbanner-bdy .title .txt {
      font-family: var(--font-sec);
      --f-sz: clamp(1.6rem, calc(1.2rem + 0.5vw), 1.8rem);
      font-size: var(--f-sz);
      font-weight: 500;
      color: #475569; }
  .hbanner-des {
    -webkit-transition: all 0.8s ease;
    transition: all 0.8s ease;
    -webkit-transform: translateY(3rem);
    transform: translateY(3rem);
    opacity: 0; }
    .hbanner-des .title-pri {
      width: 100%; }
      @media screen and (max-width: 1400px) {
        .hbanner-des .title-pri {
          --f-sz: clamp(2.8rem, calc(0.4rem + 3vw), 4rem);
          font-size: var(--f-sz); } }
  @media screen and (max-width: 600px) {
    .hbanner-item {
      width: 50%; } }
  .hbanner-item .inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1.2rem; }
    @media screen and (max-width: 800px) {
      .hbanner-item .inner {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        text-align: center;
        gap: 0.8rem; } }
    .hbanner-item .inner .icon {
      --wicon: 5.6rem;
      width: var(--wicon);
      height: var(--wicon);
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center; }
      @media screen and (max-width: 600px) {
        .hbanner-item .inner .icon {
          --wicon: 4rem; } }
      .hbanner-item .inner .icon img {
        width: 100%;
        height: 100%;
        -o-object-fit: contain;
        object-fit: contain;
        display: block; }
    .hbanner-item .inner .txt {
      --f-sz: 1.4rem;
      font-size: var(--f-sz);
      color: #1E1E1E;
      font-weight: 500;
      font-family: var(--font-sec); }
      @media screen and (max-width: 800px) {
        .hbanner-item .inner .txt {
          --f-sz: 1.2rem; } }
  .hbanner-frm {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
    padding: 4rem 0; }
    @media screen and (max-width: 1200px) {
      .hbanner-frm {
        width: 60rem;
        max-width: 100%;
        padding: 2rem 0;
        margin: 0 auto;
        text-align: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; } }
    .hbanner-frm-inner {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: var(--dist40); }
      .hbanner-frm-inner .btn-main {
        padding: 1rem 2rem;
        gap: 0.8rem; }
        .hbanner-frm-inner .btn-main .icon {
          width: 2rem;
          height: 2rem; }
          @media screen and (max-width: 1200px) {
            .hbanner-frm-inner .btn-main .icon {
              width: 1.6rem;
              height: 1.6rem; } }
        @media screen and (max-width: 1200px) {
          .hbanner-frm-inner .btn-main {
            font-size: 1.4rem; } }
  .hbanner-filter {
    padding: 0.4rem;
    border-radius: 4rem;
    background-color: #ffffff;
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: var(--dist20);
    -webkit-transition: all 0.8s ease;
    transition: all 0.8s ease;
    -webkit-transform: translateY(3rem);
    transform: translateY(3rem);
    opacity: 0; }
  .hbanner-block {
    -webkit-transition: all 0.8s ease;
    transition: all 0.8s ease;
    -webkit-transform: translateY(3rem);
    transform: translateY(3rem);
    opacity: 0; }
  @media screen and (max-width: 800px) {
    .hbanner-search .btn {
      padding: unset;
      width: 3.6rem;
      height: 3.6rem; }
      .hbanner-search .btn .inner {
        display: none; } }
  .hbanner-btn {
    -webkit-transition: all 0.8s ease;
    transition: all 0.8s ease;
    -webkit-transform: translateY(3rem);
    transform: translateY(3rem);
    opacity: 0; }
    @media screen and (max-width: 800px) {
      .hbanner-btn .btn {
        margin: 0 auto; } }
  .hbanner-input {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 1rem;
    padding-right: var(--dist20);
    border-right: 0.1rem solid #D9D9D9; }
    .hbanner-input input {
      border: none;
      outline: none;
      font-size: 1.4rem;
      font-family: var(--font-sec);
      font-weight: 400;
      color: #1E1E1E;
      width: 100%; }
      .hbanner-input input::-webkit-input-placeholder {
        color: #757575;
        font-size: 1.4rem;
        font-family: var(--font-sec);
        font-weight: 400; }
      .hbanner-input input::-moz-placeholder {
        color: #757575;
        font-size: 1.4rem;
        font-family: var(--font-sec);
        font-weight: 400; }
      .hbanner-input input::-ms-input-placeholder {
        color: #757575;
        font-size: 1.4rem;
        font-family: var(--font-sec);
        font-weight: 400; }
      .hbanner-input input::placeholder {
        color: #757575;
        font-size: 1.4rem;
        font-family: var(--font-sec);
        font-weight: 400; }
  .hbanner-select {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 9rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
    .hbanner-select .select2-container .select2-selection--single {
      border: none !important;
      background: transparent !important;
      height: 100% !important; }
    .hbanner-select .select2-container .select2-selection--single .select2-selection__rendered {
      padding: 0 !important;
      line-height: normal !important;
      font-size: 1.4rem !important;
      font-family: var(--font-sec) !important;
      font-weight: 400 !important;
      color: #1E1E1E !important;
      padding-right: 1.2rem !important; }
    .hbanner-select .select2-selection--single .select2-selection__placeholder {
      color: #757575 !important;
      font-size: 1.4rem !important;
      font-family: var(--font-sec) !important;
      font-weight: 500 !important; }
    .hbanner-select .select2-container--default
.select2-selection--single
.select2-selection__arrow {
      right: 0 !important;
      width: 1.6rem !important; }
  .hbanner-slider {
    height: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative; }
    .hbanner-slider .swiper {
      height: 100%;
      overflow: visible; }
      .hbanner-slider .swiper-pagination {
        bottom: 5% !important;
        position: absolute !important;
        z-index: 1; }
        @media screen and (max-width: 1200px) {
          .hbanner-slider .swiper-pagination {
            bottom: 1rem !important; } }
        @media screen and (max-width: 1200px) {
          .hbanner-slider .swiper-pagination-bullet {
            width: 2rem !important; } }
      .hbanner-slider .swiper-slide {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        overflow: visible; }
        .hbanner-slider .swiper-slide-active .hbanner-img-inner {
          -webkit-animation: bounceInRight 1s forwards;
          animation: bounceInRight 1s forwards;
          opacity: 1; }
  .hbanner-box {
    position: absolute;
    z-index: 2;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    --delay: 0.1s; }
    @media screen and (max-width: 600px) {
      .hbanner-box {
        max-width: 14rem; } }
    .hbanner-box .inner {
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: 0.8rem;
      border-radius: var(--dist16);
      -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
      box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
      overflow: hidden;
      background-color: #ffffff;
      padding: var(--dist16) var(--dist20);
      border: 0.1rem solid #ffffff;
      -webkit-animation: shakeY 10s infinite;
      animation: shakeY 10s infinite;
      -webkit-animation-delay: var(--delay);
      animation-delay: var(--delay); }
      @media screen and (max-width: 600px) {
        .hbanner-box .inner {
          padding: 0.8rem;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
          -ms-flex-direction: column;
          flex-direction: column;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          text-align: center; } }
    .hbanner-box .icon {
      --wicon: 3.2rem;
      width: var(--wicon);
      height: var(--wicon);
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -ms-flex-negative: 0;
      flex-shrink: 0;
      -webkit-transform: translateY(0.4rem);
      transform: translateY(0.4rem); }
      @media screen and (max-width: 600px) {
        .hbanner-box .icon {
          --wicon: 2.4rem; } }
      @media screen and (max-width: 500px) {
        .hbanner-box .icon {
          --wicon: 2rem; } }
      .hbanner-box .icon img {
        width: 100%;
        height: 100%;
        -o-object-fit: contain;
        object-fit: contain;
        display: block; }
    .hbanner-box .des {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; }
    .hbanner-box .tt {
      --f-sz: clamp(2.2rem, calc(0.2rem + 2.5vw), 3.2rem);
      font-size: var(--f-sz);
      font-weight: 700;
      font-family: var(--font-pri);
      line-height: 130%; }
      @media screen and (max-width: 1400px) {
        .hbanner-box .tt {
          --f-sz: clamp(2rem, calc(1rem + 1.25vw), 2.5rem);
          font-size: var(--f-sz); } }
      @media screen and (max-width: 600px) {
        .hbanner-box .tt {
          font-size: 1.6rem; } }
      @media screen and (max-width: 500px) {
        .hbanner-box .tt {
          font-size: 1.4rem; } }
    .hbanner-box .txt {
      color: #475569;
      --f-sz: 1.2rem;
      font-size: var(--f-sz);
      font-weight: 400;
      font-family: var(--font-sec); }
      @media screen and (max-width: 500px) {
        .hbanner-box .txt {
          font-size: 1rem; } }
    .hbanner-box:nth-child(1) {
      left: 10%;
      top: -3%; }
      @media screen and (max-width: 600px) {
        .hbanner-box:nth-child(1) {
          top: -5%;
          left: 5%; } }
    .hbanner-box:nth-child(2) {
      top: 5%;
      right: -8%;
      --delay: 0.1s; }
      @media screen and (max-width: 1600px) {
        .hbanner-box:nth-child(2) {
          right: 0; } }
      @media screen and (max-width: 600px) {
        .hbanner-box:nth-child(2) {
          top: 20%; } }
    .hbanner-box:nth-child(3) {
      top: 65%;
      left: 7%;
      --delay: 0.2s; }
      @media screen and (max-width: 600px) {
        .hbanner-box:nth-child(3) {
          left: 0;
          top: 40%; } }
    .hbanner-box:nth-child(4) {
      top: 75%;
      right: 2%;
      --delay: 0.3s; }
      @media screen and (max-width: 600px) {
        .hbanner-box:nth-child(4) {
          bottom: 6%;
          top: auto; } }
  @media screen and (max-width: 600px) {
    .hbanner-search .btn-main {
      width: 3.6rem;
      height: 3.6rem;
      padding: 0; }
      .hbanner-search .btn-main .txt {
        display: none; } }
  .hbanner-row {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; }
  .hbanner-inner {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: calc(100% + var(--halfremainder) / 2);
    margin-top: auto; }
    @media screen and (max-width: 1400px) {
      .hbanner-inner {
        width: 100%; } }
  .hbanner-img {
    position: relative;
    z-index: 1; }
    .hbanner-img-inner {
      width: 100%;
      -webkit-transition: all 0.5s ease;
      transition: all 0.5s ease; }
      .hbanner-img-inner img {
        height: 100%;
        width: 100%;
        -o-object-fit: contain;
        object-fit: contain;
        display: block; }
  .hbanner-swiper {
    height: 100%;
    position: relative;
    z-index: 1; }
    .hbanner-swiper .gldecor.hat {
      top: 0;
      right: -10%;
      left: auto;
      width: 15vw;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg); }
      @media screen and (max-width: 1200px) {
        .hbanner-swiper .gldecor.hat {
          right: 0; } }
      @media screen and (max-width: 800px) {
        .hbanner-swiper .gldecor.hat {
          top: auto;
          bottom: 100%; } }
  .hbanner-decor .cir {
    width: 100%;
    position: absolute;
    padding-top: calc(180 / 180 * 100%);
    z-index: -1;
    border-radius: 100%; }
    .hbanner-decor .cir::before {
      position: absolute;
      content: "";
      border-radius: 100%;
      inset: 0;
      background-color: #96171A;
      -webkit-animation: jelly 2s infinite;
      animation: jelly 2s infinite; }
    .hbanner-decor .cir:nth-child(1) {
      top: 60%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%) scale(0.7);
      transform: translate(-50%, -50%) scale(0.7); }
    .hbanner-decor .cir:nth-child(2) {
      -webkit-transform: translate(-25%, 0) scale(0.4);
      transform: translate(-25%, 0) scale(0.4);
      top: 0%;
      left: 0%; }
      .hbanner-decor .cir:nth-child(2)::before {
        -webkit-animation-delay: 0.4s;
        animation-delay: 0.4s;
        background-color: #F3C0D7; }

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