html,
body {
  font-size           : 16px;
  font-family         : -apple-system, BlinkMacSystemFont, 'arial', 'Microsoft Yahei' !important;
  font-weight         : 500 !important;
  color               : var(--bs-primary) !important;
  width               : 100%;
  height              : 100%;
  /* background       : #f1f2f3 !important; */
  /* overflow         : hidden; */
  /* gap              : var(--gap); */
}

body::-webkit-scrollbar {
  display: none;
}

a {
  text-decoration: none !important;
}

/********** transition **********/

.tran_1 {
  transition: all 1s;
}

.tran_0_5 {
  transition: all .5s;
}

.translateXY-wrap:hover .translateXY,
.translateXY:hover {
  transform: translate(-25px, -25px);
}

.rotate {
  -webkit-animation: rotate-around 8s linear infinite;
  animation        : rotate-around 8s linear infinite;
}

@keyframes rotate-around {
  0% {
    -webkit-transform: rotate(0deg);
    transform        : rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(1turn);
    transform        : rotate(1turn);
  }
}

.tranlateY-100 {
  transform : translateY(-100%);
  transition: all .5s;
}

.circle-1_5r {
  height: 1.5rem;
  width : 1.5rem;
}

.circle-1r {
  height: 1rem;
  width : 1rem;
}



.text-truncate-6 {
  -webkit-line-clamp: 6;
  display           : -webkit-box;
  -webkit-box-orient: vertical;
  overflow          : hidden;
}

.text-truncate-8 {
  -webkit-line-clamp: 8;
  display           : -webkit-box;
  -webkit-box-orient: vertical;
  overflow          : hidden;
}

.rotate-reverse {
  -webkit-animation: rotate_reverse 25s linear infinite;
  animation        : rotate_reverse 25s linear infinite;
}

@keyframes rotate_reverse {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(-1turn);
  }
}


/* tab切换 */

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
  color           : var(--bs-nav-pills-link-active-color);
  background-color: var(--bs-warning) !important;
  border-color    : var(--bs-warning) !important;
}



/* ********** lenis网站柔和滚动 ********** */
html.lenis {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

/* ********** width ********** */

.w-90 {
  width: 90% !important;
}

.w-59 {
  width: 59%;
}

.h-30r {
  height: 30rem;
}

.h-15r {
  height: 15rem;
}

/* ********** hover ********** */

.hover-primary:hover,
.hover-primary-wrap:hover .hover-primary {
  color     : var(--bs-white) !important;
  border    : 1px solid transparent !important;
  background: var(--bs-primary) !important;
  transition: all .3s;
}

.hover-white:hover,
.hover-white-wrap:hover .hover-white {
  color     : var(--bs-primary) !important;
  border    : 1px solid var(--bs-primary) !important;
  background: var(--bs-white) !important;
  transition: all .3s;
}

.hover-bg-label:hover {
  background: var(--bs-danger) !important;
  color     : var(--bs-white) !important;
}

/* .hover-text-primary:hover,
.hover-text-primary-wrascalehoverp:hover .hover-text-primary {
  color     : var(--bs-primary) !important;
  transition: all .3s;
} */

.hover-border-primary:hover,
.hover-border-primary-wrap:hover .hover-border-primary {
  border    : 1px solid var(--bs-primary) !important;
  transition: all .3s;
}

.hover-bg-primary:hover,
.hover-bg-primary-wrap:hover .hover-bg-primary {
  background: var(--bs-primary) !important;
  transition: all .3s;
}

.hover-text-primary-wrap.active .hover-text-primary,
.hover-text-primary:hover,
.hover-text-primary-wrap:hover .hover-text-primary {
  color     : var(--bs-primary) !important;
  transition: all .3s;
}

.hover-text-white:hover,
.hover-text-white-wrap:hover .hover-text-white {
  color     : var(--bs-white) !important;
  transition: all .3s;
}

.hover-text-white50:hover,
.hover-text-white50-wrap:hover .hover-text-white50 {
  color     : rgba(255, 255, 255, 0.5) !important;
  transition: all .3s;
}

.hover-bg-linear-gradient_info:hover {
  background: linear-gradient(135deg, #0B56A7 0%, #0871E2 90%) !important;
  transition: all 10s;
}

.bg-linear-white {
  background: linear-gradient(to top, white 60%, transparent);
}

.bg-linear-white-banner {
  background: linear-gradient(to top, white 10%, transparent) !important;
}

.scalex {
  transform       : scaleX(0);
  transition      : transform .3s;
  transform-origin: left;
  height          : 2px;
}

.scalex-1 {
  transform       : scaleX(0);
  transition      : transform .3s;
  transform-origin: left;
  height          : 1px;
}

.scalex-wrap:hover .scalex,
.scalex:hover.scalex {
  transform       : scaleX(1) !important;
  transition      : transform .3s;
  transform-origin: left;
}

.scalex-wrap.active .scalex {
  transform       : scaleX(1) !important;
  transition      : transform .3s;
  transform-origin: left;
}


.circle-arrow-trans-wrap:hover .circle-arrow-trans,
.circle-arrow-trans:hover {
  background         : var(--bs-warning) url(//qn1.10soo.net/assets23/202312151357479.svg) no-repeat;
  background-position: center;
  transition         : all .3s;
  border             : 1px solid transparent !important;
}

.circle-arrow-trans {
  background         : url(//qn1.10soo.net/assets24/202401181359135.svg) no-repeat;
  background-position: center;
}

/********** 新闻列表页面底部线条hover效果 **********/
.h-1p {
  height: 1px;
}

.h-2p {
  height: 2px;
}

.hover-lineToRight::after,
.hover-lineToRight::before {
  height  : 100%;
  top     : 0;
  position: absolute;
  content : '';
  width   : 100%;
}

.hover-lineToRight::after {
  background-color: var(--bs-warning);
  left            : -100%;
}

.hover-lineToRight::before {
  background: var(--bs-gray-5);
  left      : 0;
}

.hover-lineToRight-wrap:hover .hover-lineToRight::before {
  left      : 100%;
  transition: left .3s;
}

.hover-lineToRight-wrap:hover .hover-lineToRight::after {
  left      : 0;
  transition: left .3s .3s;
}

/********** 新闻列表页面底部线条hover效果 **********/


/* ********** z-index ********** */

.z-2 {
  z-index: 2;
}

/* ********** 回到顶部 **********  */
.toTop {
  bottom : 10%;
  right  : 5%;
  z-index: 100;
}

/* ********** banner **********  */
.banner-bg {
  background-size      : cover !important;
  background-position  : center !important;
  background-attachment: fixed !important;
}

/* ********** 详情页图片样式 **********  */
.view img {
  width           : 100%;
  /* margin-bottom: 3rem; */
  height          : auto;
}

.product_view img {
  max-width       : 100%;
  /* margin-bottom: 3rem; */
  height          : auto;
}

/* ********** 导航 **********  */
.nav-icon-size {
  width : 20px;
  height: 20px;
}


.form-control:focus {
  border    : none !important;
  box-shadow: 0 0 0 !important;
}

.nav-item {
  border-bottom: 2px solid transparent;
}

.nav-item.active,
.nav-item:hover {
  border-bottom: 2px solid var(--bs-white);
  transition   : all .5s;
}

.nav-item .nav-wrap {
  transform-origin: top;
  transform       : scaleY(0);
  visibility      : hidden;
  opacity         : 0;
  transition      : 0.35s all cubic-bezier(0.65, 0.05, 0.36, 1);
}

.nav-item:hover .nav-wrap {
  /* transform: translateY(100%); */
  transform : scaleY(1);
  visibility: visible;
  opacity   : 1;
}

.navbar-scroll {
  height    : calc(100vh - 72px) !important;
  overflow-y: auto;
}

.navscrollbar {
  max-height: calc(100vh - 147px);
  overflow-y: auto;
}

/* ********** 交互 **********  */
.hover-scale-1_05-wrap:hover .hover-scale-1_05 {
  transform: scale(1.08, 1.06);
}

.hover-scale-1_05-wrap:hover .hover-scale-1_05-h {
  transform: scale(1.04, 1.06);
}

.hover-zoomin:hover {
  transform: scale(1.05) !important;
}

.target-3D-inner {
  transform: translateZ(32px)
}

.target-3D {
  transform-style: preserve-3d;
  transform      : perspective(1000px);
}


/* ********** 底部四个图标 **********  */
.bot_icon1 {
  background: url(//qn1.10soo.net/assets24/202402050919983.svg) no-repeat;
}

.bot_icon2 {
  background: url(//qn1.10soo.net/assets24/202402050927102.svg) no-repeat;
}

.bot_icon3 {
  background: url(//qn1.10soo.net/assets24/202402050928541.svg) no-repeat;
}

.bot_icon4 {
  background: url(//qn1.10soo.net/assets24/202402050928580.svg) no-repeat;
}

.bot_icon_wrap:hover .bot_icon1,
.bot_icon1:hover {
  background: url(//qn1.10soo.net/assets24/202402050930368.svg) no-repeat;
}

.bot_icon_wrap:hover .bot_icon2,
.bot_icon2:hover {
  background: url(//qn1.10soo.net/assets24/202402050930845.svg) no-repeat;
}

.bot_icon_wrap:hover .bot_icon3,
.bot_icon3:hover {
  background: url(//qn1.10soo.net/assets24/202402050930133.svg) no-repeat;
}

.bot_icon_wrap:hover .bot_icon4,
.bot_icon4:hover {
  background: url(//qn1.10soo.net/assets24/202402050930747.svg) no-repeat;
}

.fancybox__caption {
  font-size: 20px !important;
}