@font-face {
    font-family: 'SiYuanSongTi';
    src:url('../fonts/siyuansongti-regular.woff2');
    font-weight: normal;
    font-style: normal;
  }

  html { font-size: 100%; 
    -webkit-text-size-adjust: 100%; 
    -ms-text-size-adjust: 100%; 
    text-rendering: optimizelegibility; 
  }


body img {
    max-width: 100%;
}

a:hover {
    text-decoration: none;
}

  body::before{
    display: block;
    content:'';
    height: 4rem;
  }

  section{
    overflow: hidden;
  }

  body {
     font-family: 'SiYuanSongTi', Arial, sans-serif; /* 'CustomFont'是你的自定义字体，后面跟上备选字体 */
   }


 /* 添加自定义样式 */

 .bsb-tpl-logo{
    width: 10rem;
    
 }

 /* 添加过渡效果 */
.collapse {
  transition: height 0.3s ease; /* 控制收缩展开的速度，这里设置为0.3秒，你可以根据需要调整 */
  overflow: hidden; /* 防止内容溢出 */
}

 .nav-item:hover {
    background-color: rgb(8, 8, 8, 0.8); /* 鼠标悬浮时的背景色，可以根据需要调整 */
    border-radius: 0.5rem; 
    
}
.nav-item a:hover {
    text-decoration: none; /* 移除链接在鼠标悬浮时的下划线 */
    color: aliceblue;
}


 /* 确保链接在同一行显示，可以自定义间距 CN/EN */
 .inline-links a {
    display: inline-block; /* 或使用 'inline'，取决于具体需求 */
    margin-right: 0.3rem; /* 可选，用于添加链接间的间隔 */
    text-decoration: none;
    font-size: 0.8rem;
    color: #333; /* 移除颜色 */
}

.inline-links a:hover {
    text-decoration: none;
    background-color: transparent; /* 透明背景，移除悬停时的背景色 */
}


.navbar-toggler-icon  {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='black' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.navbar-toggler {
    border: none !important; /* 移除边框 */
    color: transparent; /* 移除颜色 */
  }

  .navbar-toggler:focus {
    outline: none; /* 移除聚焦时的边框 */
  }

  .collapsed {
    border: none !important; /* 移除边框 */
  }

  .navbar-toggler-icon {
    transition: transform 1.2s ease; /* 添加过渡效果 */
  }
  
  .navbar-toggler-icon:active {
    transform: rotate(360deg); /* 点击时旋转360度 */
  }

  /* 汉堡菜单图标样式 */
.custom-toggler-icon::before {
  content: '\2630'; /* Unicode字符，代表三条横线的图标 */
  display: inline-block;
  transition: transform 0.3s; /* 平滑过渡 */
}

/* X图标样式 */
.custom-toggler-icon.x::before {
  content: '\00d7'; /* Unicode字符，代表叉号 */
  display: inline-block;
  transform: rotate(45deg); /* 旋转45度以形成X形状 */
}

  .showtext{
    top:25%;
  }

  .one_h3{
    line-height: 3rem;
    font-size: 2rem;    
  }

  .one_h1{
    margin-top: 6rem;
    line-height: 7rem;
    font-size: 5rem;
  }

  .one_p{
    margin-top: 2rem;
    line-height: 2rem;
    font-size: 1.2rem;

  }


  .workdiv{
    margin-top: 5%;
  }

  .workdiv_p{   
    width: 85%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    
  }

  .workdiv_h4{
    margin-top: 1.8rem;
  }

  .workdiv_img{
    width: 3rem;
    height: 3rem;
  }

  .work_bg:hover{
    background-color: rgba(194, 191, 191, 0.8); /* 鼠标悬浮时的背景色，可以根据需要调整 */
    border-radius: 0.5rem; 
  }



  .parallax-container {
    margin-top: 3%;
    background-image: url('../img/parallax.jpg');
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
  }
  
  .parallax-content {
    /* 为了确保内容在背景之上清晰可见，可以添加一些样式，比如颜色和阴影 */
    color: #fff;
    padding: 0.5rem;
    text-shadow: 0 0 10px rgba(0,0,0,0.5);
    z-index: 1;
  }

  .caselist{
    margin-top: 5%;
  }
  .casehead{
   
  }

  .nav-link{
    color: #000;
      
  }
  .nav-pills {
    --bs-nav-pills-border-radius: var(--bs-border-radius);
    --bs-nav-pills-link-active-color: #fff;
    --bs-nav-pills-link-active-bg: #000;
    
    
  }

  .nav-pills .nav-link:hover {
    color: #fff; /* 或设置为你想要的颜色，如：#333 为深灰色 */
    text-decoration: none; /* 移除可能的下划线 */
    background-color:transparent;
  }

  .work-item {
    position: relative; /* 使遮罩层相对于这个容器定位 */
    overflow: hidden; /* 防止遮罩层超出图片范围 */
  }
  .overlay {
    position: absolute; /* 绝对定位 */
    top: 0; /* 顶部对齐 */
    left: 0; /* 左侧对齐 */
    right: 0; /* 右侧对齐，确保遮罩层覆盖整个图片 */
    bottom: 0; /* 底部对齐 */
    background-color: rgba(0, 0, 0, 0.5); /* 半透明黑色背景，可根据需要调整颜色和透明度 */
    display: flex; /* 使内部元素可以使用弹性布局 */
    flex-direction: column; /* 垂直排列文本 */
    justify-content: center; /* 垂直居中 */
    align-items: center; /* 水平居中 */
    opacity: 0; /* 默认隐藏遮罩层 */
    transition: opacity 0.3s ease; /* 添加过渡效果 */
    color: white; /* 文字颜色 */
    text-align: center; /* 文字居中 */
  }
  
  .work-item:hover .overlay {
    opacity: 1; /* 鼠标悬停时显示遮罩层 */
  }

  .case_desc{
    font-size: 0.8rem;
    width: 95%;
  }

  /*----------------------------------------------------
	5. Skill & Expert Style
------------------------------------------------------*/
.skillset {
	background:#f8f8f8;
	display:table;
	width:100%;
  margin-top: 5%;
}
.skillset .container{
	padding-top:2rem;
	padding-bottom:1rem ;
}
.skillbar {
	position:relative;
	display:block;
	margin-bottom:53px;
	width:100%;
	background:#e2e1e2;
	height:7px;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	-webkit-transition:0.4s linear;
	-moz-transition:0.4s linear;
	-ms-transition:0.4s linear;
	-o-transition:0.4s linear;
	transition:0.4s linear;
	-webkit-transition-property:width, background-color;
	-moz-transition-property:width, background-color;
	-ms-transition-property:width, background-color;
	-o-transition-property:width, background-color;
	transition-property:width, background-color;
}

.skillbar-title {
	position:absolute;
	top:-27px;
	left:0;
	font-weight:bold;
	font-size:13px;
	line-height:27px;
	text-transform:uppercase;
	letter-spacing:2px;
	color:#5b4c5c;
}

.skillbar-title span {
	display:block;
}

.skillbar-bar {
	height:7px;
	width:0px;
	background:#e88988;
}

.skill-bar-percent {
	position:absolute;
	top:-24px;
	font-size:14px;
	color:#796f7a;
	margin-left:-20px;
}

.skillset_p{
  font-size: small;
  line-height: 2.2rem;
}

.contact-bg{
  background-image: url('../img/contact-bg.jpg') !important;
  font-size: 1rem;
}

.contact-bg p{
  font-size: 1rem;
}

.contact-bg a {
  text-decoration: none !important;
  transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
  -ms-transition: 0.5s all;
  color: inherit !important;
  

}



/*-- footer --*/
footer {
  background: #191919;
}
.footer_left p,.footer_middle p {
  font-size: 16px;
  line-height: 28px;
  color: #666;
  letter-spacing: 1px;
  margin-top: 1.5em;
}
.footer_grids ul li a {
  font-size: 16px;
  line-height: 28px;
  color: #666;
  letter-spacing: 1px;
text-transform: capitalize;
  display: block;
  margin-bottom: .2em;
}
.footer_left ul li a span.fa {
  font-size: 14px;
}
.footer_grids h3 {
  font-size: 23px;
  color: #eee;
  letter-spacing: 2px;
text-transform: uppercase;
}

.footer_right p,.footer_right p a {
  font-size: 16px;
  line-height: 28px;
  margin-bottom: .5em;
  color: #666;
}
.footer_middle ul li {
  display: inline-block;
}
.footer_middle ul li a {
  font-size: 16px;
  line-height: 28px;
  letter-spacing: 1px;
  display: block;
  margin-bottom: .5em;
}
.copyright p {
  color: #666;
  letter-spacing: 1px;
  font-size: 16px;
}
.copyright p  a{
color: #888;

}

.copyright a {
  text-decoration: none !important;
  transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
  -ms-transition: 0.5s all;
  color: inherit !important;
  

}

/*-- //footer --*/


.icp_p{
  font-size: 0.8rem !important; 
}



/*---临时屏蔽项目案例选项卡---*/
#myTab{
  display: none;
}



/*---TOP按钮---*/
.custom-back-to-top {
    background-color:#3A4F66; /* 黑色背景 */
    color: #fff; /* 白色文字/图标颜色 */
    border: none; /* 移除边框 */
    border-radius: 8%; /* 圆形按钮 */    
    transition: all 0.3s ease; /* 平滑过渡效果 */
    margin-bottom: 1rem;
    display: flex; /* 启用Flexbox布局 */
    align-items: center; /* 垂直居中对齐内容 */
    justify-content: center; /* 水平居中对齐内容，如果需要的话 */
    
  }
.custom-back-to-top:hover {
    background-color: #333; /* 鼠标悬停时的深黑色背景 */
    color: #fff;
  }
.custom-back-to-top i {
    font-size: 16px; /* 图标大小 */
    font-style: normal;
  
  }
 

   /* 在小屏幕(sm)及以下尺寸时，减小Logo的宽度和高度 */
   @media (max-width: 575.98px) {
    .navbar-brand img {
      width: 5.5em; /* 根据需要设置宽度 */
      height: auto; /* 保持宽高比 */
    }

    .carousel-control-prev{
      display: none;
    }

    .carousel-control-next{
      display: none;
    }

    .carousel-indicators{
      display: none;
    }

    #scrollToTop{
      display: none !important;
    }
    
  }