.web_menu{

	display: flex;

	display: -webkit-flex;

	position: absolute;

	top: 65%;

	left: 50%;

	transform: translate(-50%,-50%);

}

.web_menu>div{

	display: flex;

	display: -webkit-flex;

	align-items: center;

	width: 200px;

}

.web_menu h2{

	font-size: 18px;

	font-weight: bold;

	color: #153d90;

	text-transform: uppercase;

}

.web_menu_i{

	width: 22px;

    height: 18px;

	position: relative;

	cursor: pointer;

	margin-left: 20px;

}

.web_menu_right .web_menu_i{

    margin-left: 0;

    margin-right: 20px;

}

.web_menu_i::before {

    content: "";

    width: 100%;

    height: 3px;

    background: #d20001;

    position: absolute;

    top: 0;

    left: 0;

    border-radius: 10px;

    transition: 0.5s;

}

.web_menu_i::after {

    content: "";

    width: 100%;

    height: 3px;

    background: #d20001;

    position: absolute;

    bottom: 0;

    left: 0;

    border-radius: 10px;

    transition: 0.5s;

}

.web_menu_i i {

    display: block;

    width: 100%;

    height: 3px;

    position: absolute;

    top: 50%;

    margin-top: -2px;

    background: #d20001;

    border-radius: 10px;

    transition: 0.5s;

}

.web_menu_i.on::before {

    transform: rotate(45deg);

    top: 50%;

    margin-top: -2px;

}

.web_menu_i.on::after {

    transform: rotate(-45deg);

    top: 50%;

    margin-top: -2px;

}

.web_menu_i.on i {

    opacity: 0;

}

.web_menu_left{

	padding-right: 44px;

	position: relative;

	justify-content: flex-end;

	cursor: pointer;

}

.web_menu_left::after{

	content: '';

	width: 2px;

	height: 40px;

	background-color: #d20001;

	position: absolute;

	top: 50%;

	right: 0;

	transform: translate(0,-50%);

}

.web_menu_right{

	padding-left: 55px;

	cursor: pointer;

}



/* 导航下拉 */

@media only screen and (min-width:960px) {

	.xiala{

		display: none;

		position: fixed;

		z-index: 199999;

		top: var(--header_height);

		left: 0;

		background-color: rgba(255, 255, 255, 0.94);

		box-sizing: border-box;

		padding: 60px 10%;

		width: 100%;

		transition: top 0.3s ease;

	}

    .xiala_ul{

        display: flex;

		display: -webkit-flex;

	}

	.xiala_ul>li{

        width: 20%;

		box-sizing: border-box;

		padding: 0 15px 40px 15px;

		border-left: 1px solid #bdbebd;

	}

	.xiala_ul>li>a{

        font-size: 20px;

		color: var(--i_color);

		font-weight: bold;

		text-transform: uppercase;

		transition: all 0.3s ease;

	}

    .xiala_ul>li:first-child{

		border: 0;

	}

	.xiala_ul>li>a:hover{

		color: var(--i_color2);

	}







    .xiala_dl{

		display: flex;

		display: -webkit-flex;

	}

	.xiala_dl>dt{

        width: 20%;

		box-sizing: border-box;



		display: flex;

		display: -webkit-flex;

		flex-direction: column;

		border-left: 1px solid #bdbebd;

	}

	.xiala_dl>dt:first-child{

		border: 0;

	}

	.xiala_dl>dt>a{

		font-size: 18px;

		color: #222222;

		box-sizing: border-box;

		padding: 0 15px;

		margin-bottom: 10px;

		display: block;

		position: relative;

		transition: all 0.3s ease;

		overflow: hidden;

	}

	.xiala_dl>dt>a::after{

        content: '>';

		position: absolute;

		top: 50%;

		left: -20px;

		transform: translate(0,-50%);

		font-size: 16px;

		color: var(--i_color2);

		transition: all 0.3s ease;

	}

	.xiala_dl>dt>a:hover{

		color: var(--i_color2);

		margin-left: 20px;

	}

	.xiala_products .xiala_dl>dt>a:hover{

		margin-left: 0 !important;

		padding-left: 20px !important;

	}

	.xiala_dl>dt>a:hover::after{

		left: 0;

	}

	.xiala_dl>dt>a:last-child{

		margin-bottom: 20px;

	}



    .xiala_products .xiala_ul>li{

		width: 25%;

		padding: 0 3% 40px 3%;

	}
	.xiala_products .xiala_ul>li:nth-child(2){
		width: 50%;
		display: flex;
		display: -webkit-flex;
		justify-content: center;
	}
	.xiala_products .xiala_dl>dt{

		width: 25%;

		padding: 0 3%;

	}
	.xiala_products .xiala_dl>dt:nth-child(2){
		width: 50%;
	}
	.xiala_products .xiala_dl>dt a{

		padding: 0 0%;

	}
    .xiala_dl_dt2{
		display: flex;
		display: -webkit-flex;
		flex-wrap: wrap;
		flex-direction: row !important;
		align-items: flex-start;
		max-height: 212px;
		overflow: auto;
	}
	.xiala_dl_dt2::-webkit-scrollbar{width:2px; height:8px}

    .xiala_dl_dt2::-webkit-scrollbar-thumb{-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2); background:#333}

    .xiala_dl_dt2::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2); border-radius:0; background:#F1F1F1}
    .xiala_dl_dt2>a{
		width: 50%;
		line-height: 20px;
	}



	@media screen and (max-width:1880px){



	}

	@media screen and (max-width:1600px){



	}

	@media screen and (max-width:1440px){

		.xiala_products .xiala_ul>li {
			padding: 0 1.5% 40px 1.5%;
		}
		.xiala_products .xiala_dl>dt {
			padding: 0 1.5%;
		}

	}

	@media screen and (max-width:1366px){



	}

	@media screen and (max-width:1200px){



	}







}





@media screen and (max-width:959px){

	.xiala{display: none;}

}

#wowslider-container1 .banner-text-btn {
    display: flex;
}
#wowslider-container1 .ws_images ul a {
    height: auto;
    width: auto;
    max-height: unset;
    color: black;
    font-size: 18px;
    background: #fff;
    margin: 20px;
    padding: 20px 26px;
}
#wowslider-container1 .slide-banner-txt {
    position: absolute; 
    top: 0; /* 距离顶部20px */
    right: 0; /* 距离左侧20px */
    width:100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: end;
    _opacity: 0;
    _transition: all 0.8s ease-in-out;
    _transform: translate(-50%, -50%);
}

/* 动画触发类 */
#wowslider-container1 .slide-active .slide-banner-txt { 
  opacity: 1; 
  transform: translate(-50%, -30%); /* 上移10% */
}

#wowslider-container1 .slide-banner-txt .slide-banner-txt-inner {
    display: inline-block;
    background: rgba(20, 61, 143, 0.6); /* 半透明背景 */ 
    border:6px solid #153D90;
    color: white;
    padding: 10px 20px;
    max-width: 40%;
    margin-right: 15%;
}

#wowslider-container1 .ws_images ul a.banner_btn2 {
    background:#153D90;
    color: #fff;
}

/* 文字样式 */
#wowslider-container1 .slide-text {
    
    
    font-weight: bold;
    padding: 10px 20px;
    font-size: 24px;
    display: block;
    line-height: 2;
    /* 可选：响应式调整 */
    @media (max-width: 768px) { 
        font-size: 20px; 
        top: 10%; 
        right: 10%;
    }
}




.home_banner_bac{

	background: url('../images/home_bac.webp') center no-repeat;

	background-size: cover;

	width: 100%;

	box-sizing: border-box;

	padding: 200px 0 150px 0;

	position: relative;

	z-index: 2;

	margin-top: -120px;


}

.home_bannerBac_area{
	display: flex;
	display: -webkit-flex;
	align-items: flex-start;
}
.wrap_55{
	width: 55%;
	margin:  0 auto;
}
.home_bannerBac_img{
    width: 220px;
}
.home_bannerBac_img img{
    width: 100%;
}

.home_banner_text{

    display: flex;

	display: -webkit-flex;

	flex-direction: column;

    width: calc(100% - 220px);
	box-sizing: border-box;
	padding-left: 5%;
	align-items: flex-start;
}

.home_banner_text h2{

    font-size: 30px;

	font-weight: bold;

	color: white;



}

.home_banner_text h3{

	font-size: 20px;

	font-weight: bold;

	font-style: italic;

	color: #D2AAB1;

	display: inline-block;

	border-bottom: 1px solid #D2AAB1;

	margin: 54px 0 25px 0;



}

.home_banner_text h4{

	font-size: 20px;

	color: white;


	box-sizing: border-box;


	line-height: 24px;

}





@media screen and (max-width:1880px){
	.wrap_55{width: 60%}


}

@media screen and (max-width:1600px){

	.wrap_55{width: 65%}

}

@media screen and (max-width:1440px){
	.wrap_55{width: 70%}


}

@media screen and (max-width:1366px){



}

@media screen and (max-width:1200px){

	.wrap_55{width: 80%}

}

@media screen and (max-width:1080px){



}

@media screen and (max-width:959px){
	.wrap_55{width: 90%}
	.home_banner_text {padding-left: 3%;}

}

@media screen and (max-width:767px){

	.home_banner_bac {margin-top: -120px;}
	.wrap_55{width: 94%}
	.home_banner_text {padding-left: 0%;}
}

@media screen and (max-width:560px){

	.home_banner_bac {

		margin-top: -120px;

	}
	.home_bannerBac_img{display: none;}
	.home_banner_text {
		width: 100%;
		align-items: center;
	}
	.home_banner_text h4,.home_banner_text h3,.home_banner_text h2{
		text-align: center;
	}
}

@media screen and (max-width:425px){



}


.wrap_74 {
    width: 74%;
    margin: 0 auto;
}


/* banner_four */

.banner_four{

	background-color: white;

	box-sizing: border-box;

	box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);

	padding: 55px 0;

	display: flex;

	display: -webkit-flex;

	flex-wrap: wrap;

	border-radius: 10px;

	margin-top: -105px;

	position: relative;

	z-index: 3;

}

.banner_four li{

	width: 25%;

	display: flex;

	display: -webkit-flex;

	flex-direction: column;

	align-items: center;



}

.banner_four_img{

	height: 48px;

}

.banner_four_h2{

	display: flex;

	display: -webkit-flex;

	align-items: center;

	margin: 50px 0 20px 0;

}

.banner_four_h2 h2{

	font-size: 50px;

	color: var(--i_color);

	font-family: bebas;

	transition: all 0.3s ease;

}

.banner_four_h2 h3{

	font-size: 40px;

	line-height: 40px;

	font-weight: bold;

	color: var(--i_color);

	font-family: bebas;

	transition: all 0.3s ease;

}

.show{

	display: block;

}

.hide{

	display: none;

}



.banner_four h4{

	font-size: 20px;

	color: #2c2c2c;

	box-sizing: border-box;

	padding: 0 5%;

	text-align: center;

}

.banner_four li:hover .show{

    display: none;

}

.banner_four li:hover .hide{

    display: block;

}

.banner_four li:hover h2,.banner_four li:hover h3{

    color: var(--i_color2);

}

@media screen and (max-width:1880px){



}

@media screen and (max-width:1600px){



}

@media screen and (max-width:1440px){



}

@media screen and (max-width:1366px){



}

@media screen and (max-width:1200px){

	.banner_four_h2 h2 {font-size: 40px;}

	.banner_four_h2 h3 {font-size: 30px;line-height: 30px;}

}

@media screen and (max-width:1080px){



}

@media screen and (max-width:959px){



}

@media screen and (max-width:767px){
    .m-hdlogo {display:none}
    .web_menu {display: none;}

	.banner_four li {width: 50%;margin-bottom: 40px;}

	.banner_four {padding: 50px 0 30px 0;}

	.banner_four_h2 {margin: 30px 0 20px 0;}

	.banner_four li:nth-child(3) .banner_four_h2 {margin: 26px 0 20px 0 !important;}
	.home_banner_text h2 {
	    font-size: 20px;
	}
	.home_banner_text h3 {
	    font-size:16px;
	    margin-top:30px;
	}
	.home_banner_text h4 {
	    font-size: 13px;
	}
	.banner_four_h2 {
	    margin: 20px 0 10px;
	}
	.banner_four_h2 .roll_num {
	    font-size: 20px;
	}
	.banner_four_h2 h3 {
	    font-size: 12px;
	}
	.banner_four h4 {
	    font-size: 13px;
	}
    .slide-banner-txt-inner {
        font-size: 13px;
        display: none !important;
    }
    .home_banner_bac {
        margin-top: -100px;
    }
}

@media screen and (max-width:560px){



}

@media screen and (max-width:425px){



}



@media screen and (max-width:1620px){

	.wrap{width:86%}

	.wrap_79{width:89%;}

	.wrap_74{width:84%;}

}

@media screen and (max-width:1440px){

	.wrap{width:90%}

	.wrap_79{width:90%;}

	.wrap_74{width:88%;}

}

@media screen and (max-width:1366px){

	.wrap{width:92%}

	.wrap_79{width:92%;}

	.wrap_74{width:94%;}

}

@media screen and (max-width:1200px){

	.wrap{width:94%}

	.wrap_79{width:94%;}

	.wrap_74{width:94%;}

	.wrap_top{width:94%;}

}


.m-prol .item-text {
    background: #153d90;
    position: relative;
}
.m-prol .list-item:nth-child(3n-2) .item-text::after {
    content: '';
    background-image: url(https://www.tfcomposite.com/wp-content/themes/tianfu/static/imgs/pr1.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 101% 100%;
        position: absolute;
    left: 0;
    top: -20px;
    width: 100%;
    height: 20px;
}
.m-prol .list-item:nth-child(3n-1) .item-text::after {
    content: '';
    background-image: url(https://www.tfcomposite.com/wp-content/themes/tianfu/static/imgs/pr2.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 101% 100%;
        position: absolute;
    left: 0;
    top: -20px;
    width: 100%;
    height: 30px;
}
.m-prol .list-item:nth-child(3n) .item-text::after {
    content: '';
    background-image: url(https://www.tfcomposite.com/wp-content/themes/tianfu/static/imgs/pr3.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 101% 100%;
        position: absolute;
    left: 0;
    top: -20px;
    width: 100%;
    height: 30px;
}
.m-prol .item-title a {
    color: #fff;
    padding: 0 10px;
}

.m-prol .item-link {
    color:#fff;
    padding: 0 10px;
}
.m-prol .item-link a {
    color: #fff;
    font-size: 14px;
}
.m-prol .item-link a:hover {
    color: #fff;
}

.m-prol .btn {
    background: #d7000f;
    font-size: 14px;
}

#wowslider-container2 { 
  max-width: 100%; 
  height: auto;
}
#wowslider-container2 .ws_prev, #wowslider-container2 .ws_next {
  background-color: #333;
  color: white;
  border-radius: 5px;
} 

.m-prob1 .pic-big {
    overflow: hidden;
}
