@charset "utf-8";
/*
* title:博爱曙光植发科香港竞价PC頭頂種植專題
* Author:luochou
* Date:2024.4.17
*/
.new-header,.container{width:100%;margin:0 auto;}
.bgColor{background-color: #f1fcff;}
.container{background-color:#fff;}
.container img{max-width:100%;display:block;}
.bannerWAP{display:none;}
.banner{width:100%;height:600px;background:url(/style/images/zt/tdzz/banner.jpg) no-repeat center top;overflow:hidden;}
.banner a{height:600px;display:block;}
.item{width:1200px;margin:0 auto;}
.container .tit{position: relative; height: 72px;}
.container .tit .txt{position: absolute; left: 0; top:0;width: 100%;line-height: 42px;text-align: center;font-size: 42px;color: #e4f4f9;text-transform: uppercase;font-family: Arial;}
.container .tit h2{position: relative;color: #22b1a9; font-size: 32px; text-align: center; line-height:72px;}
.container .tit h2 b{color: #ff7600; font-weight: bold;}
/*f1Box*/
.f1Box{padding-top:110px;}
.f1Box ul{padding:10px 0; overflow: hidden;}
.f1Box li{float: left; width: 352px; margin:30px 24px; border-radius: 6px; overflow: hidden;}
.f1Box li .imgBox{height: 280px; overflow: hidden;}
.f1Box li .imgBox img{width: 352px; height: 280px; display: block;transition: all .3s;}
.f1Box li .imgBox:hover img{transform: scale(1.08);-webkit-transform: scale(1.08); cursor: pointer;}
.f1Box li h3{height: 60px; color: #fff; font-size: 28px; line-height: 60px; text-align: center; background-image: -webkit-linear-gradient(to bottom, #22a8a9,#22bca9);background-image: linear-gradient(to bottom, #22a8a9,#22bca9);}
.f1Box .btn{width:292px;height:48px;margin:0 auto;display:block;background-color:#ff8a00;border-radius:10px;color:#fff;font-size:30px; font-weight: bold; line-height:48px;text-align:center;background-image: -webkit-linear-gradient(to bottom, #ff8a00,#ff5400);background-image: linear-gradient(to bottom, #ff8a00,#ff5400);transition: all .3s;}
.f1Box .btn:hover{transform: scale(1.08);-webkit-transform: scale(1.08); cursor: pointer;}
/*f2Box*/
.f2Box{padding:110px 0;}
.f2Con{padding: 100px 0 40px; overflow: hidden;}
.f2Con dl{float: left; position: relative; width: 352px; height: 448px; margin: 0 24px;transition: all .3s;}
.f2Con dl:hover{transform: translateY(-20px);-webkit-transform: translateY(-20px); cursor: pointer;}
.f2Con dt{position: absolute; top: -52px; left: 50%; margin-left: -125px; z-index: 2; width: 245px; height: 245px; border: 2px solid #159496; border-radius:18px; overflow:hidden;}
.f2Con dt img{width: 245px; height: 245px; display: block;}
.f2Con dd{position: relative; height: 448px; padding-top: 234px; border-radius: 16px; background:#159496 url(/style/images/zt/tdzz/f2Con_dl_bg.png) no-repeat;box-sizing: border-box;}
.f2Con dd h3{position: absolute; top:173px; left: 50%; margin-left: -65px; z-index: 3; width: 130px; height: 42px; background-color: #ff8a00; border-radius: 21px; color: #fff; font-size: 28px; line-height: 40px; text-align: center;}
.f2Con dd p{padding: 0 24px; color: #fff; font-size: 26px; line-height: 38px; text-align: justify;}
.f2Box .btn{width:292px;height:48px;margin:0 auto;display:block;background-color:#ff8a00;border-radius:10px;color:#fff;font-size:30px; font-weight: bold; line-height:48px;text-align:center;background-image: -webkit-linear-gradient(to bottom, #ff8a00,#ff5400);background-image: linear-gradient(to bottom, #ff8a00,#ff5400);transition: all .3s;}
.f2Box .btn:hover{transform: scale(1.08);-webkit-transform: scale(1.08); cursor: pointer;}
/*f3Box*/
.f3Box{padding:95px 40px 38px;}
.f3Box dl{position: relative; height: 168px; margin-bottom: 50px; background-color: #fff; border:1px solid #159496; border-radius:85px; box-shadow: 0 3px 7px rgba(0,0,0,.06);}
.f3Box dt{position: absolute; top:50%; margin-top: -75px; width: 144px; height: 144px; background-color: #159496; border:3px solid #c6eaec; border-radius: 50%; overflow: hidden;}
.f3Box .d1 dt,.f3Box .d3 dt{left:11px;}
.f3Box .d2 dt{right:11px;}
.f3Box dt img{width: 144px; height: 144px; display: block;}
.f3Box dd{padding: 18px 64px 0 194px;}
.f3Box .d2 dd{padding: 39px 194px 0 66px;}
.f3Box dd h3{color: #159496; font-size: 31px; line-height: 48px;}
.f3Box dd p{color: #777; font-size: 28px; line-height: 42px;}
/*f4Box*/
.f4Box{padding:100px 0 95px;}
.f4Box ul{overflow: hidden; padding-top: 40px;}
.f4Box li{float:left;width:385px;height:231px;margin-bottom:25px; margin-right: 22px;}
.f4Box li.mr0{margin-right: 0}
.f4Box li img{width:385px;height:231px; display: block;}
/*f5Box*/
.f5Box{padding:100px 0 120px;}
.f5Tab{width: 952px; margin:34px auto 0; overflow:hidden;}
.f5Tab span{float:left;width:50%;height:41px;text-align:center;line-height:41px;font-size:20px;color:#fff;background-color:#ff8e3a;display:block;}
.f5Tab span.active{background-color:#22a8a9;}
.f5Box .imgBox{width: 952px; margin: 0 auto; box-shadow:rgba(0,0,0,.2) 0 0 10px;}
.f5Box .imgBox img{width:952px;height:295px;}

@keyframes pulse{
	0%{transform:scale(0.9)}
	50%{transform:scale(1)}
	100%{transform:scale(0.9)}
}
@-webkit-keyframes pulse{
	0%{-webkit-transform:scale(0.9)}
	50%{-webkit-transform:scale(1)}
	100%{-webkit-transform:scale(0.9)}
}
@media only screen and (max-width:750px){
	.new-header,.container{min-width:320px;width:100%;max-width:750px;margin:0 auto;}
	.container{background-color:#fff;padding-bottom:0;}
	.container img{max-width:100%;display:block;}
	.item{width:auto;}	
	.banner{display:none;}
	.bannerWAP{display:block;}
	.container .tit{height: .72rem;}
	.container .tit .txt{line-height: .42rem;font-size: .42rem;}
	.container .tit h2{font-size: .46rem;line-height:.72rem;}
	/*f1Box*/
	.f1Box{padding-top:1.1rem;}
	.f1Box ul{padding:.4rem .2rem .2rem;display:flex;display:-webkit-flex;justify-content:space-between;flex-wrap:wrap;}
	.f1Box li{float: none; width: 30%; margin:0 0 .2rem; border-radius:.06rem;}
	.f1Box li .imgBox{height: auto;}
	.f1Box li .imgBox img{width: 100%; height: auto;}
	.f1Box li h3{height: .6rem; font-size: .28rem; line-height: .6rem;}
	.f1Box .btn{width: 4rem; height: .68rem;border-radius:.1rem; font-size:.36rem; line-height: .4rem; display: flex;display: -webkit-flex;align-items: center;justify-content: center;}
	/*f2Box*/
	.f2Box{padding:1.1rem 0;}
	.f2Con{padding:1rem .2rem .4rem;display:flex;display:-webkit-flex;justify-content:space-between;}
	.f2Con dl{float: none; position: relative; width: 30%; height:100%; margin:0;}
	.f2Con dt{top: -.52rem;margin-left: -40%;width: 80%; height: auto; border: 2px solid #159496; border-radius:.18rem;}
	.f2Con dt img{width: 100%; height: auto;}
	.f2Con dd{position: relative; width: 100%; height: 4.2rem; padding-top: 1.6rem; border-radius: .16rem; background:#159496 url(/style/images/zt/tdzz/f2Con_dl_bg.png) no-repeat; background-size: 100% 1.1rem;}
	.f2Con dd h3{top:.96rem;margin-left: -.65rem;width: 1.3rem; height: .48rem; border-radius: .21rem;font-size: .3rem; line-height: .48rem; display: flex;display: -webkit-flex;align-items: center;justify-content: center;}
	.f2Con dd p{padding: 0 .1rem;font-size: .24rem; line-height: 1.4;}
	.f2Box .btn{width: 4rem; height: .68rem;border-radius:.1rem; font-size:.36rem; line-height: .4rem; display: flex;display: -webkit-flex;align-items: center;justify-content: center;}
	/*f3Box*/
	.f3Box{padding:.95rem .2rem .38rem;}
	.f3Box dl{height: 1.68rem; margin-bottom: .5rem;border-radius:.85rem;}
	.f3Box dt{margin-top: -.75rem; width: 1.44rem; height: 1.44rem;border:3px solid #c6eaec;}
	.f3Box .d1 dt,.f3Box .d3 dt{left:.11rem;}
	.f3Box .d2 dt{right:.11rem;}
	.f3Box dt img{width: 100%; height: 100%;}
	.f3Box dd{height: 100%; padding:0 .2rem 0 1.8rem;display: flex;display: -webkit-flex;justify-content: center;flex-direction: column;}
	.f3Box .d2 dd{padding:0 1.94rem 0 .4rem;}
	.f3Box dd h3{font-size: .3rem; line-height: 1.4;}
	.f3Box dd p{font-size: .26rem; line-height: 1.2;}
	/*f4Box*/
	.f4Box{padding:1rem .2rem .95rem;}
	.f4Box ul{padding-top: .4rem;display:flex;display:-webkit-flex;justify-content:space-between;flex-wrap:wrap;}
	.f4Box li{float:none;width:31%;height:auto;margin-bottom:.25rem; margin-right: 0;}
	.f4Box li img{width:100%;height:auto;}
	/*f5Box*/
	.f5Box{padding:1rem .2rem 1.2rem;}
	.f5Box .tit h2{font-size: .36rem;}
	.f5Tab{width: 100%; margin:.34rem auto 0;}
	.f5Tab span{float:left;width:50%;height:.6rem;line-height:.6rem;font-size:.28rem;}
	.f5Box .imgBox{width: 100%;}
	.f5Box .imgBox img{width:100%;height:auto; display: block;}
}