@charset "utf-8";

/* layout reset */
body.main .container-in {
  width: 100%;
  min-width: 1200px;
}
body.main .container,
body.main .container-wrapper {
  padding: 0 !important;
  margin: 0 !important;
}
body.main .footer-wrap {
  margin: 0;
}
/* //layout reset */

/* main-top-banner */
.main-top-banner {
  display: none;
  align-items: center;
  justify-content: center;
  background-color: var(--color-white);
  height: 56px;
  position: relative;
  overflow: hidden;
}
.main-top-banner.active {
  display: flex;
}
.top-banner-contents {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  height: 100%;
}
.top-banner-contents .top-banner-item {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-banner-contents .top-banner-item a {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-banner-contents .top-banner-item a img {
  height: 100%;
  width: auto;
  object-fit: cover;
}
.main-top-banner .top-banner-close {
  position: absolute;
  top: 50%;
  /* right: 30px; */
  right: calc((100% - 1200px) / 2 - 40px);
  width: 30px;
  height: 30px;
  -webkit-mask-image: url('../images/2025/icon/icon_close_30.svg');
  mask-image: url('../images/2025/icon/icon_close_30.svg');
  mask-size: 30px;
  background-color: var(--color-font-01);
  transform: translateY(-50%);
}

/* 메인 공통 */
.main [class*='main-'] .section-title {
  font-size: 56px;
  color: var(--color-font-01);
  font-weight: var(--font-weight-extra-bold);
  line-height: 80px;
  text-align: left;
  padding: 0;
  margin: 0;
}
.main [class*='main-'] .section-title.not-dot::after {
  display: none;
}
.main [class*='main-'] .section-title::after {
  display: inline-block;
  content: '';
  width: 12px;
  height: 12px;
  border-radius: 12px;
  background-color: var(--color-primary);
  margin-bottom: -2px;
  margin-left: -8px;
}
.main .more-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 52px;
  border: 1px solid var(--color-font-01);
  font-size: 0;
  color: transparent;
  position: absolute;
  top: 28px;
  right: 0;
}
.main .more-btn::before {
  content: '';
  width: 18px;
  height: 18px;
  -webkit-mask-image: url('../images/2025/mobile/icon/icon_mo_plus.svg');
  mask-image: url('../images/2025/mobile/icon/icon_mo_plus.svg');
  mask-size: 18px;
  background-color: var(--color-font-01);
}
.main .more-btn:hover {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.main .more-btn:hover::before {
  background-color: var(--color-white);
}
/* mainBanner */
.mainBanner {
  min-width: 1200px;
  margin: 0 auto;
  height: 1028px;
  overflow: hidden;
  background-color: var(--color-font-01);
}
.main-top-m .slick-dotted.slick-slider {
  height: 100%;
}
.mainBanner .imgwraper {
  opacity: 1;
  height: 1028px;
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: 50%;
  cursor: pointer;
}
.mainBanner .mainBanner-info-box {
  margin: 170px auto 0;
  width: 1200px;
}
.mainBanner .mainBanner-info-box * {
  color: var(--color-white);
}
.mainBanner .mainBanner-info-box .spot-text {
  font-size: 58px;
  font-weight: var(--font-weight-extra-bold);
  line-height: 90px;
}
.mainBanner .mainBanner-info-box .spot-text::after {
  display: inline-block;
  content: '';
  width: 12px;
  height: 12px;
  border-radius: 12px;
  background-color: var(--color-secondary-pink);
}
.mainBanner .mainBanner-info-box .sub-text {
  margin-top: 12px;
  font-size: 24px;
  line-height: 40px;
  font-weight: var(--font-weight-medium);
}
.mainBanner .mainBanner-info-box .mainBanner-btn {
  margin-top: 20px;
  font-size: 24px;
  font-weight: var(--font-weight-extra-bold);
  background-color: var(--color-secondary-pink);
  display: flex;
  align-items: center;
  height: 54px;
  padding: 0 40px;
  border-radius: 54px;
}
.mainBanner .slider {
  display: inline-block;
  width: 100%;
}
.mainBanner .slider .slick-dotted.slick-slider {
  margin: 0;
}
.mainBanner .slider .slick-slide img {
  height: 100%;
}
.carousel-dots-root {
  position: absolute;
  top: 454px;
  left: 0;
  width: 100%;
}
.mainBanner .slider .carousel-dots-wrapper {
  position: unset;
  width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
}
.mainBanner .main-top-m .play {
  background: none;
}
.mainBanner .main-top-m .play1 {
  order: 1;
  display: flex;
  position: unset;
  width: 34px;
  height: 34px;
  margin: 0;
  background-color: var(--color-font-03);
  border-radius: 34px;
  margin-right: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mainBanner .main-top-m .play1::before {
  content: '';
  width: 20px;
  height: 20px;
  background: url(../images/2025/icon/icon_slide_stop.svg) no-repeat;
}
.mainBanner .main-top-m .play1.on {
  background-image: none;
}
.mainBanner .main-top-m .play1.on::before {
  background: url(../images/2025/icon/icon_slide_play.svg) no-repeat;
}
.mainBanner .main-top-m .slick-dots {
  order: 2;
  position: unset;
  display: flex;
  align-items: center;
  gap: 10px;
}
.mainBanner .main-top-m .slick-dots li {
  width: 12px;
  height: 12px;
  margin: 0;
  display: flex;
  align-items: center;
  transition: var(--transition-basic);
}
.mainBanner .main-top-m .slick-dots li button {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  background: var(--color-line-ccc);
}
.mainBanner .main-top-m .slick-dots li.slick-active {
  width: 36px;
}
.mainBanner .main-top-m .slick-dots li.slick-active button {
  background: var(--color-line-ccc);
}
.mainBanner .main-top-m .carousel-arrow-wrapper {
  display: none;
}

/* main-feature */
.main-feature-wrap {
  margin-top: -442px;
  margin-bottom: 100px;
  position: relative;
  z-index: 1;
}
.main-feature {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  gap: 24px;
}
.main-feature .feature-box {
  position: relative;
  background: var(--color-white);
  border-radius: 20px;
  padding: 38px 44px;
  width: 384px;
  height: 342px;
  box-sizing: border-box;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
}
.main-feature .feature-box a {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.main-feature .feature-box .title {
  font-size: 36px;
  font-weight: var(--font-weight-extra-bold);
  line-height: 46px;
  padding: 0;
  margin: 0;
  color: var(--color-font-01);
}
.main-feature .feature-box .title em {
  color: var(--color-primary);
}
.main-feature .feature-list {
  flex: 1;
  display: flex;
  flex-direction: column;
  margin-top: 16px;
  gap: 6px;
}
.main-feature .feature-list li {
  display: flex;
  align-items: center;
  font-weight: var(--font-weight-medium);
  font-size: 16px;
  color: var(--color-font-01);
  line-height: 20px;
}
.main-feature .feature-btn {
  width: 46px;
  height: 46px;
  border-radius: 46px;
  background-color: var(--color-font-01);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: flex-end;
  transition: var(--transition-basic);
}
.main-feature .feature-btn::before {
  content: '';
  width: 21px;
  height: 16px;
  -webkit-mask-image: url('../images/2025/icon/icon_arrow_tail.svg');
  mask-image: url('../images/2025/icon/icon_arrow_tail.svg');
  mask-size: 21px 16px;
  background-color: var(--color-white);
  transition: var(--transition-basic);
}
/* .main-feature .feature-btn:hover {
  background-color: var(--color-white);
}
.main-feature .feature-btn:hover::before {
  background-color: var(--color-font-01);
} */
.main-feature .feature-box:hover {
  outline: 2px solid var(--color-font-01);
}

/* main-case */
.main-case-wrap {
  padding: 140px 0;
  background-color: var(--color-white);
}
.main-case {
  width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.main-case .case-study {
  display: flex;
  margin-top: 40px;
}
.main-case .case-study-panel {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: 20px;
  width: 186px;
  height: 600px;
  padding: 50px 40px;
  overflow: hidden;
  box-sizing: border-box;
  background-color: var(--color-black);
  box-shadow:
    4px 0 4px 0 rgba(0, 0, 0, 0.1),
    -4px 0 4px 0 rgba(0, 0, 0, 0.1);
  margin-left: -30px;
  z-index: 0;
  transition:
    width 0.6s,
    margin 0.6s;
}
.main-case .case-manufacturing::before {
  background: url(../images/2025/main/main_case_manufacturing.png) 50% no-repeat;
}
.main-case .case-printing::before {
  background: url(../images/2025/main/main_case_printing.png) 50% no-repeat;
}
.main-case .case-construction::before {
  background: url(../images/2025/main/main_case_construction.png) 50% no-repeat;
}
.main-case .case-broadcasting::before {
  background: url(../images/2025/main/main_case_broadcasting.png) 50% no-repeat;
}
.main-case .case-study-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0;
  z-index: -1;
  transition: opacity 0.6s;
  background-size: cover;
}
.main-case .case-study-panel:nth-child(1) {
  margin-left: 0;
}
.main-case .case-study .case-study-title {
  font-size: 44px;
  font-weight: var(--font-weight-extra-bold);
  color: var(--color-white);
  line-height: 58px;
  white-space: nowrap;
}
.main-case .case-study .case-study-content {
  display: flex;
  flex-direction: column;
  gap: 48px;
  margin-top: 24px;
  opacity: 0;
  transition: opacity 0.6s;
}
.main-case .case-study .case-study-content * {
  color: var(--color-white);
  white-space: nowrap;
}
.main-case .case-study .case-study-content hr.divider {
  width: 100%;
  height: 1px;
  outline: none;
  border: none;
  background-color: rgba(255, 255, 255, 0.4);
}
.main-case .case-study .case-study-desc {
  font-size: 27px;
  font-weight: var(--font-weight-extra-bold);
  line-height: 42px;
}
.main-case .case-study .case-study-benefits {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.main-case .case-study .case-study-benefits dt {
  font-size: 24px;
  font-weight: var(--font-weight-extra-bold);
  line-height: 31px;
  margin-bottom: 10px;
}
.main-case .case-study .case-study-benefits dd {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
  font-weight: var(--font-weight-medium);
  line-height: 26px;
}
.main-case .case-study .case-study-benefits dd::before {
  content: '';
  width: 24px;
  height: 24px;
  background: url(../images/2025/main/check_circle_fill.svg) no-repeat;
  flex-shrink: 0;
}
.main-case [class*='case-btn-'] {
  position: absolute;
  left: 40px;
  bottom: 50px;
  width: 40px;
  height: 40px;
  border-radius: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0;
  color: transparent;
  background-color: var(--color-white);
}
.main-case .case-btn-link {
  display: none;
}
.main-case .case-btn-link::before {
  content: '';
  width: 21px;
  height: 16px;
  -webkit-mask-image: url('../images/2025/icon/icon_arrow_tail.svg');
  mask-image: url('../images/2025/icon/icon_arrow_tail.svg');
  mask-size: 21px 16px;
  background-color: var(--color-font-01);
}
.main-case .case-btn-open::before {
  content: '';
  width: 11px;
  height: 19px;
  -webkit-mask-image: url('../images/2025/icon/icon_arrow_left.svg');
  mask-image: url('../images/2025/icon/icon_arrow_left.svg');
  mask-size: 11px 19px;
  background-color: var(--color-font-01);
  margin-left: -1px;
}
.main-case .case-study .case-type-01 {
  background-color: var(--color-black);
}
.main-case .case-study .case-type-02 {
  background-color: #949499;
}
.main-case .case-study .case-type-03 {
  background-color: #f2f2f2;
}
.main-case .case-type-03 [class*='case-btn-'] {
  background-color: var(--color-font-01);
}
.main-case .case-type-03 .case-btn-open::before {
  background-color: var(--color-white);
}
.main-case .case-type-03 .case-study-title {
  color: var(--color-font-01);
}
/* active */
.main-case .case-study-panel.active {
  /* width: 632px; */
  width: 662px;
  margin: 0 20px;
}
.main-case .case-study-panel.active::before {
  opacity: 1;
}
.main-case .case-study.active-01 .active {
  margin-right: 40px;
  margin-left: 0;
}
.main-case .case-study.active-01 .case-type-01 {
  margin-left: 0;
}
.main-case .case-study.active-02 .case-type-02 {
  margin-left: 0;
}
.main-case .case-study.active-02 .case-type-03 {
  margin-left: -30px;
}
.main-case .case-study.active-03 .case-type-02 {
  margin-left: -30px;
}
.main-case .case-study.active-03 .case-type-03 {
  margin-left: 0;
}
.main-case .case-study.active-04 .active {
  margin-right: 0;
  margin-left: 40px;
}
.main-case .case-study-panel:nth-child(1) .case-btn-open::before,
.main-case .case-study.active-03 .case-type-02 .case-btn-open::before,
.main-case .case-study.active-04 .case-type-02 .case-btn-open::before,
.main-case .case-study.active-04 .case-type-03 .case-btn-open::before {
  margin-left: 3px;
  transform: rotate(180deg);
}
.main-case .case-study-panel.active .case-study-title {
  color: var(--color-white);
}
.main-case .case-study-panel.active .case-study-content {
  opacity: 1;
}
.main-case .case-study-panel.active .case-btn-link {
  display: flex;
  background-color: var(--color-white);
}
.main-case .case-study-panel.active .case-btn-open {
  display: none;
}
.main-case .case-customer {
  position: relative;
  background-color: var(--color-white);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 0;
  margin-top: 40px;
  height: 60px;
  overflow: hidden;
}
.main-case .case-customer .case-customer-inner {
  overflow: hidden;
  white-space: nowrap;
}
.main-case .case-customer ul {
  display: inline-flex;
  flex: 1;
  align-items: center;
  /* animation: scroll-logos 40s linear infinite; */
  animation: scroll-logos 60s linear infinite;
}
.main-case .case-customer ul li {
  display: flex;
  width: 240px;
  height: 60px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
@keyframes scroll-logos {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-100% - 12px));
  }
}

/* main-bbs */
.main-bbs-wrap {
  padding-bottom: 140px;
  background-color: var(--color-white);
}
.main-bbs {
  width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.main-bbs .bbs-list {
  display: flex;
  flex-direction: column;
  margin-top: 37px;
  gap: 17px;
}
.main-bbs .bbs-list li {
  display: flex;
  align-items: center;
  background-color: var(--color-white);
  padding: 16px 0 32px;
  border-bottom: 1px solid var(--color-line-ddd);
}
.main-bbs .bbs-list [class*='tag-'] {
  min-width: 96px;
  height: 40px;
  border-radius: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background-color: var(--color-gray-03);
  font-size: 16px;
  font-weight: var(--font-weight-extra-bold);
  color: var(--color-white);
}
.main-bbs .bbs-list .tag-primary {
  background-color: var(--color-font-01);
}
.main-bbs .bbs-list .tag-secondary {
  background-color: var(--color-primary);
}
.main-bbs .bbs-list .bbs-link {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
}
.main-bbs .bbs-list .bbs-link em {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 22px;
  color: var(--color-font-01);
  font-weight: var(--font-weight-medium);
}
.main-bbs .bbs-list .bbs-link .date {
  margin-left: auto;
  font-size: 16px;
  color: var(--color-font-02);
  font-weight: var(--font-weight-medium);
  flex-shrink: 0;
}
.main-bbs .bbs-list li:hover .bbs-link em {
  font-weight: var(--font-weight-extra-bold);
}

/* main-help */
.main-help-wrap {
  padding-bottom: 140px;
  background-color: var(--color-white);
}
.main-help {
  width: 1200px;
  margin: 0 auto;
}
.main-help .help-list {
  margin-top: 40px;
  display: flex;
  align-items: center;
  gap: 24px;
}
.main-help .help-list .help-item {
  display: flex;
  flex-direction: column;
  flex: 1;
  height: 228px;
  flex-shrink: 0;
  border-radius: 20px;
  background-color: var(--color-white);
  outline: 1px solid var(--color-line-ddd);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}
.main-help .help-list .help-item:hover {
  outline: 2px solid var(--color-font-01);
}
.main-help .help-list .help-item a {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 40px 30px;
}
.main-help .help-list .help-guide .icon-deco {
  background: url(../images/2025/icon/icon_main_help_guide.svg) no-repeat;
}
.main-help .help-list .help-faq .icon-deco {
  background: url(../images/2025/icon/icon_main_help_faq.svg) no-repeat;
}
.main-help .help-list .help-inquiry .icon-deco {
  background: url(../images/2025/icon/icon_main_help_inquiry.svg) no-repeat;
}
.main-help .help-list .help-partner .icon-deco {
  background: url(../images/2025/icon/icon_main_help_partner.png) no-repeat;
}
.main-help .help-list .help-item .icon-deco {
  width: 60px;
  height: 58px;
  background-size: contain;
  order: 1;
}
.main-help .help-list .help-item .deco-box {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: auto;
}
.main-help .help-list .help-item .deco-box em {
  font-size: 32px;
  line-height: 130%;
  font-weight: var(--font-weight-extra-bold);
  color: var(--color-font-01);
  order: 2;
}
.main-help .help-list .help-item .text-box {
  display: flex;
  align-items: center;
}
.main-help .help-list .help-item .text-box span {
  font-size: 21px;
  color: var(--color-font-01);
  font-weight: var(--font-weight-medium);
  line-height: 27px;
}
.main-help .help-list .help-item .text-box .icon-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 46px;
  background-color: var(--color-font-01);
  flex-shrink: 0;
  margin-left: auto;
}
.main-help .help-list .help-item .text-box .icon-arrow::before {
  content: '';
  width: 21px;
  height: 16px;
  -webkit-mask-image: url('../images/2025/icon/icon_arrow_tail.svg');
  mask-image: url('../images/2025/icon/icon_arrow_tail.svg');
  mask-size: 21px 16px;
  background-color: var(--color-white);
}

/* main-event */
.main .main-event-wrap {
  padding-bottom: 140px;
  background-color: var(--color-white);
}
.main .main-event {
  width: 1200px;
  margin: 0 auto;
  position: relative;
}
.main .main-event .event-list {
  margin-top: 40px;
  display: flex;
  gap: 25px;
}
.main .main-event .event-item {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  width: 384px;
}
.main .main-event .event-item a {
  display: flex;
  flex-direction: column;
}
.main .main-event .event-item .event-thumb {
  border-radius: 20px 20px 0 0;
  overflow: hidden;
}
.main .main-event .event-item .event-info {
  display: flex;
  flex-direction: column;
  padding: 26px 38px;
  /* height: 164px; */
  height: 124px;
  border: 1px solid var(--color-gray-01);
  border-top: none;
  border-radius: 0 0 20px 20px;
  box-sizing: border-box;
}
.main .main-event .event-item .event-info em {
  font-size: 26px;
  line-height: 33px;
  color: var(--color-font-01);
  font-weight: var(--font-weight-extra-bold);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: keep-all;
}
.main .main-event .event-item .event-info .period {
  margin-top: auto;
  color: var(--color-font-02);
  font-size: 16px;
  line-height: 30px;
}

/* main-service */
.main .main-service-wrap {
  padding: 100px 0;
  background: url(../images/2025/main/main_service_bg.png) 50% no-repeat;
  background-color: var(--color-primary);
}
.main .main-service {
  width: 1200px;
  margin: 0 auto;
  position: relative;
  display: flex;
  align-items: center;
}
.main .main-service-title {
  padding: 0;
  margin: 0;
  color: var(--color-white);
  font-size: 48px;
  font-style: normal;
  font-weight: var(--font-weight-extra-bold);
  line-height: 67px;
}
.main .main-service .btn-subscribe {
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  margin-left: auto;
  width: 234px;
  height: 60px;
  padding: 14px 40px;
  border-radius: 8px;
  background-color: var(--color-primary);
  border: 1px solid var(--color-white);
  color: var(--color-white);
  font-size: 24px;
  font-weight: var(--font-weight-extra-bold);
  transition: all 0.5s;
}
.main .main-service .btn-subscribe:hover {
  background-color: var(--color-white);
  color: var(--color-primary);
}

/* mainQuick */
.mainQuick {
  position: fixed;
  /*right: calc((100% - 1200px) / 2 - 130px); 260210 삭제*/
  top: 20%;
  width: 60px;
  /* height: 520px; */
  text-align: center;
  overflow: hidden;
  z-index: 2;
}
.mainQuick .link {
  width: 100%;
  box-sizing: border-box;
}
.mainQuick a {
  display: block;
  padding: 47px 0 19px;
  color: var(--color-white);
  font-size: 13px;
  line-height: 16px;
  text-align: center;
}
.mainQuick a.down {
  margin-bottom: 0;
  padding-bottom: 10px;
  border-bottom: 0;
}
.mainQuick button {
  width: 60px;
  height: 60px;
  border-radius: 50px;
  background: #bababa url(http://images.webhard.co.kr/images3.0/btn_q_new_top.png) no-repeat 49% 15px;
  padding-top: 33px;
  font-size: 14px;
  color: var(--color-white);
}
.mainQuick li {
  width: 60px;
  height: 60px;
  border-radius: 50px;
  margin: 0 auto 6px;
  letter-spacing: -1.5px;
}
.mainQuick .Quick_apply {
  background: url(http://images.webhard.co.kr/images3.0/btn_q_new_apply.png) no-repeat 50% 15px #4692ff;
}
.mainQuick .Quick_apply a {
  padding: 45px 0 19px;
}
.mainQuick .Quick_coupon {
  background: url(http://images.webhard.co.kr/images3.0/btn_q_new_coupon.png) no-repeat 50% 20px #7c54ff;
}
.mainQuick .Quick_down {
  background: url(http://images.webhard.co.kr/images3.0/btn_q_new_down.png) no-repeat 50% 14px #bb51ff;
}
.mainQuick .Quick_ask {
  background: url(http://images.webhard.co.kr/images3.0/btn_q_new_ask.png) no-repeat 50% 15px #e062e5;
}
.mainQuick .Quick_ask a {
  padding: 45px 0 19px;
}
.mainQuick .Quick_event {
  background: url(http://images.webhard.co.kr/images3.0/btn_q_new_event.png) no-repeat 50% 19px #e562a0;
}
.mainQuick .quick-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  overflow: hidden;
  margin: 0;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  transition: var(--transition-basic);
}
.mainQuick .quick-item + .quick-item {
  margin-top: 8px;
}
.mainQuick .quick-item a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0;
  width: 100%;
  height: 100%;
  font-size: 13px;
  font-weight: var(--font-weight-medium);
  transition: var(--transition-basic);
}
.mainQuick .quick-item a::before {
  content: '';
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: contain;
}
.mainQuick .Quick_consult a::before {
  background-image: url(../images/2025/icon/icon_quick_consult.svg);
}
.mainQuick .Quick_customer a::before {
  background-image: url(../images/2025/icon/icon_quick_download.svg);
}
.mainQuick .Quick_consult a {
  background-color: var(--color-primary);
}
.mainQuick .Quick_consult a:hover {
  background-color: var(--color-primary-hover);
}
.mainQuick .Quick_customer a {
  background-color: #3951b8;
}
.mainQuick .Quick_customer a:hover {
  background-color: #1c349c;
}
.mainQuick .Quick_chatbot {
  background: linear-gradient(150.76deg, #e6007e -17.89%, #33058d 87.19%);
}
.mainQuick .Quick_chatbot a {
  background: url(../images/2025/main/chatbot_icon.gif) no-repeat;
  background-size: cover;
}
.mainQuick .quick-top {
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0;
  color: transparent;
  background: none;
  margin-top: 8px;
  border: 1px solid var(--color-line-ddd);
  position: relative;
  background-color: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(5px);
  transition: var(--transition-basic);
  box-shadow: none !important;
}
.mainQuick .quick-top::before {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 21px;
  height: 11px;
  -webkit-mask-image: url('../images/2025/icon/icon_arrow_quick.svg');
  mask-image: url('../images/2025/icon/icon_arrow_quick.svg');
  mask-size: 21px 11px;
  background-color: var(--color-font-01);
}
.mainQuick .quick-top:hover {
  border: 1px solid var(--color-font-01);
}