@charset "utf-8";
/* CSS Document */
/*清除内外边距*/
html,body,div,p,h1,h2,h3,h4,h5,h6,blockquote,ul,ol,li,table,th,td,span,img,dl,dd,dt,input,textarea,button{padding:0;margin:0;}
/*设置字体*/
body,textarea,button,input,select{font-family:"Microsoft Yahei"; font-size:12px; color:#333333;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
em{font-style:normal;}
/*设置列表*/
ul,ol{list-style:none;}
img{max-width: 100%;}
.container{width:1200px; margin: 0 auto; overflow: hidden;}
.top{background-color:rgba(2, 132, 199, 0.05); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-color: rgb(243 244 246 / 1); padding:12px 0; width:100%; position: fixed; z-index: 999; top: 0; left: 0;}
.top-box{display:flex; justify-content:space-between;}
.top-box .logo{width:40px;}
.top-box .xz{padding:10px 25px; border-radius: 20px; cursor: pointer; color: #FFF; font-size: 18px; background: rgb(2 132 199);}
.top-box .xz:hover{background: rgb(0 107 169);}
.ban{  background-image: radial-gradient(100% 50% at 50% 0%, #00a3ff38 0, #00a3ff00, #00a3ff00); padding: 100px 0 50px;}
.ban-box{display:flex; justify-content:space-between; flex-wrap: wrap;}
.ban-box .ban-l{width:50%; display: flex; align-items: center;}
.ban-box .ban-l .tit{font-size: 48px; color: rgb(59 130 246); font-weight: bold; margin-bottom: 20px;}
.ban-box .ban-l .ftit{font-size:24px; color:#333; margin-bottom: 30px;}
.ban-box .ban-l .txt{font-size:22px; color: #444; margin-bottom: 50px;}
.ban-box .ban-l .down{width:220px; text-align:center; font-size: 20px; cursor: pointer; padding:10px 0; border-radius: 30px; border: 1px solid #666;}
.ban-box .ban-l .down:hover{border:1px solid rgb(34 211 238);  color:#000;}
.ban-box .ban-r{width:48%; text-align: center;}
.ban-box .ban-r img{width:50%;}
.main-box{padding:50px 0;}
.main-box .tit{font-size: 32px; color: #000; font-weight: bold; text-align: center; margin-bottom: 20px;}
.main-box .ftit{font-size:22px; color:#666; text-align: center; margin-bottom: 30px;}
.main-box .main-list{padding:20px 0; display: flex; justify-content: space-between; flex-wrap: wrap;}
.main-box .main-list .list-item{border-radius: 20px; border: 1px solid #EEE; width:calc(33.3333% - 10px); margin-bottom: 15px; box-sizing: border-box; padding: 20px;}
.main-box .main-list .list-item:hover{ background: #F8F8F8;}
.main-box .main-list .list-item .t1{font-size:24px;color: #333; margin-bottom: 15px;}
.main-box .main-list .list-item .t2{font-size:16px; color: #666; line-height: 1.8;}
.user{padding:60px 0;}
.user .user-top{margin-bottom: 30px; text-align: center;}
.user .user-top .t1{font-size: 32px; color: #000; font-weight: bold; margin-bottom: 10px;}
.user .user-top .t2{font-size:22px; color:#666;}
.user .user-list {
    padding: 30px 0;
    display: flex;
    justify-content: flex-start;
    overflow: hidden;
    width: 200%;
    animation: scrollLeft 20s linear infinite;
}

.user .user-list:hover {
    animation-play-state: paused;
}

.user .user-list .list-item {
    width: 49%;
    margin-right: 1%;
    border: 1px solid #EEE;
    border-radius: 20px;
    padding: 20px;
    box-sizing: border-box;
}

@keyframes scrollLeft {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}
.user .user-list .list-item .list-box{font-size:16px; line-height: 1.8; color:#333; margin-bottom: 20px;}
.user .user-list .list-item .list-pf svg{width:30px; margin-right: 5px; margin-bottom: 20px;}
.user .user-list .list-item .list-time{color:#666; font-size: 14px;}
.text-blue-500 {
    --tw-text-opacity: 1;
    color: rgb(59 130 246 / var(--tw-text-opacity));
}
.fill-current {
    fill: currentColor;
}
.line{background:#222; padding: 50px 0; text-align: center;}
.line .tit{font-size:24px; color: #FFF; margin-bottom: 20px;}
.line .ftit{font-size: 20px; color: #FFF;}
.line .xz{width:200px; font-size: 20px; background-color:rgba(255, 255, 255, 0.85); padding:10px 0; border-radius: 20px; margin: 0 auto; margin-top: 30px; cursor: pointer;}
.line .xz:hover{background: #FFF;}
.problem {
    padding: 50px 0; 
}
.problem .pro-t1{text-align: center; font-size: 24px; color: #333; font-weight: bold; margin-bottom: 30px;}
.problem .pro-box{padding:10px 0; border-bottom: 1px solid #EEE; margin-bottom: 15px;}
.problem .pro-tit{font-size: 20px; color: #333; margin-bottom: 15px; cursor: pointer; position: relative; padding-right: 30px;}
.problem .pro-tit::after{content: ''; position: absolute; right: 10px; top: 50%; transform: translateY(-50%) rotate(45deg); width: 12px; height: 12px; border-right: 2px solid #333; border-bottom: 2px solid #333; transition: transform 0.3s;}
.problem .pro-tit.active::after{transform: translateY(-50%) rotate(225deg);}
.problem .pro-txt{font-size: 16px; color: #666; line-height: 1.8; margin-bottom: 20px; display: none; transition: all 0.3s;}
.problem .pro-txt.show{display: block;}

.copyright{padding:20px 0; text-align: center; border-top: 1px solid #EEE;}

@media screen and (max-width:1200px){
	.container{width:100%; padding:0 20px; box-sizing: border-box;}
    .ban-box .ban-l{width:100%; margin-bottom: 20px;}
    .ban-box .ban-r{width:100%;}
    .main-box .main-list .list-item{width:100%;}
    .user .user-list{width:300%;}
}