#detail{padding:20px 0 80px}
#detail .w1500{overflow: hidden;}
#detail .title span{font-size: 16px;line-height: 35px;padding: 0;border-radius: 15px;display: block;margin-bottom: 25px;color: #fa4616;background-color: rgba(250, 70, 22,0.2);margin:0 auto;width: 300px;text-align: center;}

#detail .title h1{width: calc(100% - 595px);margin:20px 0 45px;margin-left: auto;}

#detail .detail-box{position: relative;}
#detail .con{padding:45px 50px;padding-right: 15px;background-color: #fff;position: absolute;bottom:0;right:0;width: calc(100% - 595px);}
#detail .con a{position: absolute;bottom: 25px;left: -90px;transition: transform 0.6s ease;}
#detail .con a:hover{transform: scale(1.1);}
#detail .con a img{width: auto;}
#detail .des{font-size: 16px;line-height: 22px;color: #666;}
#detail .num-box{display: flex;margin-top: 40px;}
#detail .num-box li{flex: 1;position: relative;padding-left: 60px;background-repeat: no-repeat;background-position: left top;background-size: ;padding-right: 15px;}
#detail .num-box li:nth-child(1){background-image: url(../images/dicon1.png);padding-left: 50px;}
#detail .num-box li:nth-child(2){background-image: url(../images/dicon2.png);flex:1.2}
#detail .num-box li:nth-child(3){background-image: url(../images/dicon3.png);flex: 1.8;}
#detail .num-box li b{font-size: 40px;font-weight: bold;color: #0c4098;}
#detail .num-box li div>sup{position: absolute;top: -10px;color: #0c4098;font-size: 25px;}
#detail .num-box li div span{font-size: 16px;line-height: 22px;color: #666;}
#detail .num-box li p{font-size: 16px;line-height: 22px;color: #666;margin-top: 4px;}

@media(max-width:1540px){
    #detail .des{font-size: 15px;line-height: 20px;}
    #detail .num-box li b{font-size: 36px;}
}

@media(max-width:1440px){
    #detail .num-box li b{font-size: 32px;}

    #detail .con{padding: 35px;width: calc(100% - 490px);}
}

@media(max-width:1100px){
    #detail .title h1{width: 100%;margin-bottom: 20px;}
    #detail{padding-bottom: 30px;}
    #detail .con{width: 100%;position: relative;padding:20px 0;}
    #detail .des{font-size: 14px;line-height: 18px;}
    #detail .num-box li b{font-size: 26px;}

    #detail .num-box li p,#detail .num-box li span{font-size: 14px;}
    #detail .con a{position: absolute;top: -70px;left: 20px;transition: transform 0.6s ease;}

    
}

@media(max-width:768px){
    #detail .des{font-size: 13px;line-height: 17px;}
    #detail .num-box li b{font-size: 22px;}

    #detail .num-box{flex-wrap: wrap;}
    #detail .num-box li{flex:unset !important;width: 49%;margin-bottom: 15px;}
    #detail .num-box li:nth-child(3){width: 100%;}
}






#history{padding:110px 0 100px;background-image: url(../images/his-back.webp);background-repeat: no-repeat;background-position: center;}
#history .title span{font-size: 16px;line-height: 35px;padding: 0 30px;border-radius: 15px;display: inline-block;margin-bottom: 25px;color: #fa4616;
background-color: rgba(250, 70, 22,0.2);}
#history .title h1{margin:20px 0 45px;color: #fff;}

#history .his-swi{position: relative;}
#history .his-swi hr{position: absolute;top:240px;width: 100%;height: 1px;background-color: #fff;}
#history .swiper-slide .slide-box{position: relative;}
#history .swiper-slide .slide-box::before{content:"";display: block;width: 10px;height: 10px;border-radius: 50%;position: absolute;top:235px;left:0;background-color: #fff;}
#history .swiper-slide .slide-box .img{margin-bottom: 60px;}
#history .swiper-slide .slide-box b{font-size: 45px;color: #fff;margin-bottom: 20px;display: block;}
#history .swiper-slide .slide-box .des p{font-size: 16px;line-height: 22px;padding-left: 10px;position: relative;color: #fff;}
#history .swiper-slide .slide-box .des p::before{content:"";display: block;position: absolute;top:7px;left:0;width: 3px;height: 3px;border-radius: 50%;background-color: #fff;}

@media(max-width:1540px){
    #history .swiper-slide .slide-box b{font-size: 36px;}
}

@media(max-width:1440px){
    
}

@media(max-width:1100px){
    #history{padding:30px 0;}
    #history .swiper-slide .slide-box b{font-size: 30px;}
    
}

@media(max-width:768px){
    #history .swiper-slide .slide-box b{font-size: 24px;}
    #history .swiper-slide .slide-box .des p{font-size: 14px;line-height: 19px;}
    #history .swiper-slide .slide-box .img{margin-bottom: 25px;}
}






#distribution{padding:80px 0;}
#distribution .title span{font-size: 16px;line-height: 35px;padding: 0 30px;border-radius: 15px;display: block;margin-bottom: 25px;color: #fa4616;
background-color: rgba(250, 70, 22,0.2);margin:0 auto;width: 200px;text-align: center;}
#distribution .title h1{margin:20px 0 45px;text-align: center;}
#distribution .title .des{width: 80%;margin:0 auto;margin-bottom: 50px;text-align: center;font-size: 16px;line-height: 22px;color: #666;}

#distribution .dis_img>img{width: calc(100% - 390px);float: left;}
#distribution .dis_img .imgs{width: 220px;float: right;}
#distribution .dis_img .imgs .list{margin-bottom: 25px;position: relative;}
#distribution .dis_img .imgs p{position: absolute;top:0;left:0;padding: 20px;color: #fff;font-size: 20px;font-weight: normal;width: 100%;}

@media(max-width:1540px){
    
}

@media(max-width:1440px){
    #distribution .dis_img>img{width: calc(100% - 300px);float: left;}
    #distribution .dis_img .imgs p{font-size: 18px;}
}

@media(max-width:1100px){
    #distribution{padding:30px 0;}
    #distribution .title h1{margin-bottom: 20px;}
    
}

@media(max-width:768px){
    
    #distribution .dis_img>img{width: 100%;}
    #distribution .dis_img .imgs{width: 100%;display: flex;gap:2%;flex-wrap: wrap;}
    #distribution .dis_img .imgs .list{width: 49%;margin-bottom: 2%;}
    #distribution .dis_img .imgs p{font-size: 14px;}
}








#plan{padding:80px 0 100px;background-image: url(../images/devel-back.webp);background-position: center;background-repeat: no-repeat;background-size: cover;}
#plan .title{width: 610px;}
#plan .title span{font-size: 16px;line-height: 35px;padding: 0 30px;border-radius: 15px;display: inline-block;color: #fa4616;
background-color: rgba(250, 70, 22,0.2);}
#plan .title h1{margin:20px 0 20px;color: #fff;}
#plan .title .des{font-size:16px;line-height: 22px;color: #fff;}

#plan ul{padding:30px 0;background-color: #d0d0d1;float: right;width: 410px;margin-top: -50px;border-radius: 20px;}
#plan ul li{padding-left: 75px;padding-right: 40px;background-repeat: no-repeat;background-position: 20px top;margin-top: 45px;}
#plan ul li:nth-child(1){background-image: url(../images/plani1.png);margin-top: 0;}
#plan ul li:nth-child(2){background-image: url(../images/plani2.png);}
#plan ul li:nth-child(3){background-image: url(../images/plani3.png);}

#plan ul li b{font-size: 45px;color: #0c4098;font-weight: bold;}
#plan ul li span{font-size: 16px;color: #666;display: inline-block;margin-left: 10px;transform: translateY(-5px);}
#plan ul li p{font-size: 16px;line-height: 22px;color: #666;margin-top: 5px;}

@media(max-width:1540px){
    
#plan ul li b{font-size: 40px;}
#plan ul li span{font-size: 16px;margin-left: 10px;}
#plan ul li p{font-size: 14px;line-height: 21px;margin-top: 5px;}
}

@media(max-width:1440px){
    
}

@media(max-width:1100px){
    #plan{padding:30px 0;}
    #plan .title{width: 100%;}
    #plan ul{width: 100%;margin-top: 25px;}
    #plan ul li b{font-size: 34px;}
    #plan ul li span{font-size: 15px;margin-left: 10px;}
    #plan ul li p{font-size: 13px;line-height: 18px;margin-top: 3px;}
}

@media(max-width:768px){
    #plan ul li b{font-size: 24px;}
    
}







#social{padding:80px 0 100px;}
#social .title span{font-size: 16px;line-height: 35px;border-radius: 15px;display: block;color: #fa4616;
background-color: rgba(250, 70, 22,0.2);margin:0 auto;width: 200px;text-align: center;}
#social .title h1{margin:20px 0 45px;text-align: center;}

#social .social-box{position: relative;display: flex;justify-content: center;align-items: center;height: 516px;overflow: hidden; background-image: url(../images/social-back.webp);background-size: cover;background-position: center;background-repeat: no-repeat;}
#social .social-box>img{height: 100%;width: auto;}
#social .social-box ul{width: 100%;height: 100%;display: flex;top: 0;left: 0;}
#social .social-box ul li{width: 25%;flex-wrap: wrap;gap:20px;flex-flow: column;position: relative;}
#social .social-box ul li img{height: 45px;width: auto;margin:0 auto}
#social .social-box ul li b{font-size: 26px;font-weight: normal;text-align: center;color: #fff;display: block;margin:30px auto 20px}
#social .social-box ul li .des{font-size: 16px;line-height: 22px;text-align: center;color: #fff;}
#social .social-box ul li div.box{display: flex;width:100%;height: 100%;justify-content: center;align-items: center;padding:0 30px}
#social .social-box ul li .show{opacity: 1;transition: all 0.6s ease;-webkit-transition: all 0.6s ease;}
#social .social-box ul li .hide{opacity: 0;position: absolute;top:0;left:0;background-color: rgba(0,0,0,0.5);transition: all 0.6s ease;-webkit-transition: all 0.6s ease;z-index: 1;}
#social .social-box ul li:hover .show{opacity: 0;}
#social .social-box ul li:hover .hide{opacity: 1;}


@media(max-width:1540px){
    #social .social-box ul li b{font-size: 22px;margin:30px auto 20px}
    #social .social-box ul li .des{font-size: 15px;line-height: 21px;}
}
    
@media(max-width:1440px){
        
}
    
@media(max-width:1100px){
    #social{padding:30px 0;}
    
    #social .social-box ul li b{font-size: 20px;margin:15px auto 15px}
    #social .social-box ul li .des{font-size: 14px;line-height: 20px;}
    #social .social-box ul li{width: 50%;}
}
    
@media(max-width:768px){
    #social .social-box{height: auto;display: block;}
    #social .social-box ul{flex-wrap: wrap;}
    #social .social-box ul li b{font-size: 17px;margin:15px auto 15px}
    #social .social-box ul li .des{font-size: 13px;line-height: 18px;}
    
    #social .social-box ul li .hide{opacity: 1;background-color: rgba(0,0,0,0.3);z-index: 1;position: relative;}
    #social .social-box ul li div.box{padding:20px 10px}
    #social .social-box ul li div.box.show{display: none;}
}


#outvideo {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
	display: none;
	z-index: 9999;
}

#outvideo .posbox {
	position: relative;
	z-index: 89;
	background: #000;
	max-width: 65%;
	width: 100%;
	height: 65%;
	justify-content: center;
	align-items: center;
	display: flex;
}

#outvideo .posbox video {
	width: 100%;
	height: 100%;
}

#outvideo .posbox a {
	content: "";
	position: absolute;
	right: -20px;
	top: -20px;
	background-color: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: block;
}

#outvideo .posbox a::after {
	content: "X";
	width: 100%;
	height: 100%;
	line-height: 40px;
	border-radius: 50%;
	display: block;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	transform: scale(1, 0.76);
}

@media screen and (max-width: 768px) {
	#outvideo .posbox {
		max-width: 65%;
		height: 45%;
	}
}