@charset "utf-8";
/* CSS Document */
.banner{width:100%;background:url(/images/banner.webp) no-repeat top center;height:650px;}
.banner-txt{background-color:rgba(33,38,150, 0.7);color:#FFF; height:100%;display:flex;align-items:center;justify-content:center;}
.banner-title{font-size:48px;font-weight:bolder;}
.banner-title p{font-size:24px;padding-top:30px;font-weight:500;}
.banner-btn{margin-top:30px;margin-left:auto;margin-right:auto;width:200px;height:36px;border-radius:18px;overflow:hidden;background-color:#3087d9;color:#FFF;font-size:16px; line-height:36px;}

.index-pros{padding-bottom:70px;}
.index-pros li{width:calc(23% - 2px);float:left;margin-left:2.666666%;box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); padding:20px;border:1px solid #F9F9F9; border-radius:10px;transition: box-shadow 0.3s ease; }
.index-pros li:first-child{margin-left:0;}
.index-pros li:hover{box-shadow: 0 4px 8px rgba(0,0,0,0.2);}
.index-pros li:hover .index-pros-icon{background-color:#fee9e9;}
.index-pros li h3{font-size:18px;}
.index-pros li p{color:#777;}
.index-pros-tit{font-weight:bolder;line-height:30px; padding-top:30px;padding-bottom:10px;}
.index-pros-icon{background-color:#f7f6ff;width:60px;height:60px;border-radius:18px;overflow:hidden; display:flex;justify-content: center; /* 水平居中 */align-items: center; transition: box-shadow 0.7s ease; }
.index-pros-icon img{height:36px;width:36px;}
.index-question{background-color:#f7f6ff;padding:10px 0 50px 0;}
.index-question li{float:left;width:48.5%;margin-top:30px;border-radius:10px;overflow:hidden;height:300px;margin-left:3%;position:relative;text-align:left;transition:filter 2s ease;}
.index-question li:nth-child(2n+1){margin-left:0;}
.index-question-txt{z-index:999; position:absolute;width:85%;height:80%;top:45%;left:5%;transition: filter 2s ease;}
.index-question-txt h3{color:#FFF; font-weight:bolder;padding-bottom:10px;}
.index-question-txt p{color:#FFF;font-size:14px; line-height:24px;display:none;}
.index-question li:hover img{filter: blur(5px); }
.index-qeustion li:hover .index-question-txt{top:40%;}
.index-question li:hover .index-question-txt p{display:block; opacity:0.9;}

@media(max-width:640px){
	.banner{height:240px;}
	.banner-title{font-size:30px;}
	.banner-title p{font-size:18px;padding-top:20px;}
    .index-pros ul{display:flex; flex-wrap:wrap;}
	.index-pros li{width:calc(48% - 2px);float:left;margin-left:4%;margin-bottom:15px;}
	.index-pros li:nth-child(2n+1){margin-left:0;}
	.index-question-txt{top:15%;}
	.index-question-txt p{font-size:12px;line-height:20px;}

}