@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'CompanyFont';
    src: url('../font/UVNThoiNayNang_R.TTF');
    font-weight: normal;
    font-style: normal;
	font-display: swap; /* 优化字体加载时的显示行为 */
}
@font-face {
    font-family: 'SloganFont';
    src: url('../font/MTD AlFresco.otf');
    font-weight: normal;
    font-style: normal;
	font-display: swap; /* 优化字体加载时的显示行为 */
}
@font-face {
    font-family: 'TextFont';
    src: url('../font/Encode SeEx.ttf');
    font-weight: normal;
    font-style: normal;
	font-display: swap; /* 优化字体加载时的显示行为 */
}
@font-face {
    font-family: 'TextBoldFont';
    src: url('../font/Encode SeEx Bold.ttf');
    font-weight: normal;
    font-style: normal;
	font-display: swap; /* 优化字体加载时的显示行为 */
}

*{ margin:0; padding:0; list-style:none; outline:0; border:0; overflow-wrap: break-word; word-wrap: break-word; }
body{ font-size:14px; font-family:sans-serif; color:#000; background:#ECF5FF;}
a{ text-decoration:none; cursor:pointer; color:#000;}
i{ font-style:normal;}


/* ==========  global  ==========  */
.header{ background:#fff; position:fixed; bottom:0; width:100%; z-index:99;}
.header .logo{ display:none;}
.notice{ background:#DFECFD; display:flex; justify-content:space-between; align-items:center; padding:10px 20px;}
.notice .info{ line-height:24px;}
.notice .button{ text-align:right;}
.notice .button img{ width:10px; height:auto; margin-bottom:5px; margin-right:5px;}
.notice .button a{ display:block; background:linear-gradient(to bottom, #38f, #67B5FF); padding:5px 15px; color:#fff; font-size:16px; white-space:nowrap; border-radius:20px;}
.nav ul{ display:flex; justify-content:space-around; }
.nav ul li{ width:25%;}
.nav ul li a{ display:block; padding:10px 0; text-align:center; }
.nav ul li a img{ width:auto; height:24px;}
.nav ul li a span{ display:block;}
.nav ul li.on a span{ color:#38f; font-weight:bold;}

.wrapper{ position:relative; overflow:hidden; }
.wrapper .bannerMobile img{ width:100%; height:auto;}
.wrapper .inner{ background:#ECF5FF; padding:40px 20px 0; border-radius:30px 30px 0 0; margin-top:-40px; position:relative;}
.wrapper .banner{ display:none;}

.footer .inner{ padding:0 20px 160px;}


.block{ margin-bottom:30px; overflow:hidden; }
.TITLE{ font-weight:bold; font-size:20px; margin-bottom:10px;}
.topic{ display:none;}
.bigTitle{ background:#38f; padding:20px 20px 60px; display:flex; align-items:center;  text-align:center; font-size:20px; font-weight:bold;}
.bigTitle .back img{ width:10px; height:20px;}
.bigTitle .title{ flex:1; text-align:center; color:#fff; margin-right:10px;}




.ascendancy .content{ display:flex; flex-wrap:wrap; justify-content:space-between;}
.ascendancy .content .item{ background:#fff; padding:10px 0; width:48%; border-radius:20px; margin-bottom:20px;}
.ascendancy .content .item .image{ display:none;}
.ascendancy .content .item .icon{ padding:0 10px; height:70px;}
.ascendancy .content .item .icon img{ height:100%; width:auto;}
.ascendancy .content .item .info{ padding:10px; color:#999;}
.ascendancy .content .item .info .title{ font-size:18px; font-weight:bold; color:#000;}



.case .content{ overflow-x:scroll;}
.case .content .scroll{ display:flex;}
.case .content .item{ background:#fff; width:200px; margin-right:20px; border-radius:10px; overflow:hidden; flex-shrink:0;  }
.case .content .item .image{ height:150px; overflow:hidden; background-size:cover; background-position:center top;}
.case .content .item .info{ padding:10px;}
.case .content .item .info .title{ font-size:16px; font-weight:bold; margin-bottom:10px;}
.case .content .item .info .raise{ color:#999; font-size:12px; margin-bottom:5px; }
.case .content .item .info .progess{ background:#eee; border-radius:2px;}
.case .content .item .info .progess span{ display:block; background:#38f; height:5px; border-radius:2px; width:50%; }
.case .content .item .info .count{ display:flex; justify-content:space-between; align-items:center; font-size:12px;}
.case .content .item .info .count span{ color:#999;}
.case .content .item .info .count a{ display:block; background:#38f; padding:0 10px; height:30px; line-height:30px; color:#fff; border-radius:15px;}


.overview{ background:none; box-shadow:none;  }
.overview .content .item{ display:flex; justify-content:space-between; border-radius:20px; overflow:hidden;}
.overview .content .item .image{ order:2; width:40%; background-color:#aaa; background-position:center center; background-size:cover;}
.overview .content .item .info{ order:1; flex:1; padding:20px 80px 20px 20px; color:#fff; margin-right:-80px; position:relative; line-height:30px;}
.overview .content .item:nth-child(1) .image{ background-image:url(../image/view1.png);}
.overview .content .item:nth-child(2) .image{ background-image:url(../image/view2.png);}
.overview .content .item:nth-child(3) .image{ background-image:url(../image/view3.png);}
.overview .content .item:nth-child(1) .info{  background:linear-gradient(to right, rgba(8,91,255,1) 70%, rgba(8,91,255,0)) 0%;}
.overview .content .item:nth-child(2) .info{  background:linear-gradient(to right, rgba(85,78,255,1) 70%, rgba(85,78,255,0)) 0%;}
.overview .content .item:nth-child(3) .info{  background:linear-gradient(to right, rgba(53,108,234,1) 70%, rgba(53,108,234,0)) 0%;}
.overview .hd{ display:flex; justify-content:center; margin-top:10px;}
.overview .hd .item{ background:#38f; width:40px; height:6px; margin:0 10px; border-radius:3px;}
.overview .hd .item.on{ background:#f00; }




.serve .content .item{ background:#fff; display:flex; justify-content:space-between;  border-radius:20px; margin-bottom:10px;}
.serve .content .item .image{ width:30%; border:5px solid #fff;  border-radius:20px; background-position:center center; background-size:cover;}
.serve .content .item .info{ flex:1; padding:10px;}
.serve .content .item .info .title{ font-size:18px; font-weight:bold; color:#000; margin-bottom:10px;}
.serve .content .item .info .text{ color:#666;}
.serve .content .item:nth-child(1) .image{ background-image:url(../image/serve1.png);}
.serve .content .item:nth-child(2) .image{ background-image:url(../image/serve2.png);}
.serve .content .item:nth-child(3) .image{ background-image:url(../image/serve3.png);}
.serve .content .item:nth-child(4) .image{ background-image:url(../image/serve4.png);}




.respone .content .item{ border-radius:20px; overflow:hidden; margin-bottom:10px;  }
.respone .content .item .image img{ width:100%; height:auto;}
.respone .content .item .info{ padding:60px 20px 20px; color:#fff; margin-top:-100px; position:relative;  }
.respone .content .item:nth-child(1) .info{ background:linear-gradient(to top, rgba(48,54,209,1) 60%, rgba(48,54,209,0)) 0%;}
.respone .content .item:nth-child(2) .info{ background:linear-gradient(to top, rgba(51,136,255,1) 60%, rgba(51,136,255,0)) 0%;}


.contact{ background:none; box-shadow:none;}
.contact .content{ display:flex; justify-content:space-between; flex-wrap:wrap;}
.contact .content .item{ width:48%; padding:5px 0; border:1px solid #38f; border-radius:10px; margin-bottom:10px;}
.contact .content .item .title{ padding:0 10px; display:flex; align-items:center; font-weight:bold; font-size:14px; }
.contact .content .item .title img{ width:20px; height:20px; margin-right:10px;}
.contact .content .item .text{ padding:0 10px; color:#666;}



/* about */
.core .content .item{ background:#fff; padding:20px; display:flex; border-radius:20px; margin-bottom:10px; }
.core .content .item .image{ width:20%;  margin-right:10px;}
.core .content .item .image img{ width:100%; height:auto;}
.core .content .item .info{ flex:1;}
.core .content .item .info .title{ display:block; font-weight:bold; font-size:18px;}
.core .content .item .info .text{ color:#666; }


.advantage .content .item{ padding:20px; display:flex; align-items:center;  border-radius:20px; margin-top:10px;}
.advantage .content .item .image{ width:30%; margin-left:10px;}
.advantage .content .item .image img{ width:100%; height:auto;}
.advantage .content .item .info{ flex:1; color:#fff;}
.advantage .content .item .info .title{ display:block;  font-weight:bold; font-size:18px;}
.advantage .content .item .info .text{ color:rgba(255,255,255,0.7);}
.advantage .content .item:nth-child(1){ background:linear-gradient(to bottom right, rgba(40,135,255,1) 30%, rgba(40,135,255,0));}
.advantage .content .item:nth-child(2){ background:linear-gradient(to bottom right, rgba(98,105,255,1) 30%, rgba(98,105,255,0));}
.advantage .content .item:nth-child(3){ background:linear-gradient(to bottom right, rgba(40,95,253,1) 30%, rgba(40,95,253,0));}



.vision{ box-shadow:none; padding:0;}
.vision .content{ background:url(../image/vision.png) center center no-repeat; background-size:cover; border-radius:10px; overflow:hidden;text-align:center; font-size:18px; font-weight:bold; color:#38f; padding:20px; height:200px; 
  text-shadow:
    -1px -1px 0 #fff,  
     1px -1px 0 #fff,
    -1px  1px 0 #fff,
     1px  1px 0 #fff;
}




.future .content{ border-radius:20px; overflow:hidden;  }
.future .content .image img{ width:100%; height:auto;}
.future .content .info{ background:linear-gradient(to top, rgba(51,136,255,1) 60%, rgba(51,136,255,0)) 0%; padding:60px 20px 20px; color:#fff; margin-top:-100px; position:relative;  }




/* register */
.register{ background:url(../image/bg.png); background-size:cover; min-height:100vh;}
.register .wrapper .inner{ background:none;}
.register .form{ padding:40px 0 100px;}
.register .form .title{ padding-left:20px; font-weight:bold; font-size:24px; margin-bottom:20px; }
.register .form .item{ background:rgba(255,255,255,0.9); height:60px; border-radius:10px; padding-left:20px; margin-bottom:10px;}
.register .form .item input{ background:none; line-height:60px; font-size:18px;}
.register .form .term{ display:flex; margin:0 10px 30px;}
.register .form .term strong{ white-space:nowrap;}
.register .form .term input{ margin:0 5px;}
.register .form .term input[type="checkbox"] { width: 30px; height: 30px;  accent-color: #A58340; /* 设置选中时的颜色 */}
.register .form .term span{ color:#38f;}
.register .form .button{}
.register .form .button button{ display:block; background:#38f; width:100%; height:60px; border-radius:10px;  font-size:18px; color:#fff; margin-bottom:10px;}
.register .form .button button:nth-child(2){ background:rgba(0,0,0,0.5);}
.register .contact .TITLE{ display:none;}

.register .form .data{ padding:20px; }
.register .form .data span{ font-weight:bold; color:#38f;}
.register .form .data p{ color:#999; margin-top:10px; }
.register .form .data p img{ margin-right:5px;}


.window{ position:fixed; left:0; top:0; right:0; bottom:0; width:100%; height:100%; background:rgba(0,0,0,0.5); display:none; z-index:999;}
.windowBox{ position:relative; background:#fff; width:80%; height:70%; margin:15% auto; overflow:hidden; padding-bottom:100px;}
.windowContent{ position:relative; height:100%; line-height:18px; overflow-x:hidden; overflow-y:auto;}
.windowContent h1{ font-size:16px; line-height:24px; text-align:center; margin-bottom:40px;}
.windowContent h2{ font-size:14px; margin-top:40px;}
.windowContent h3{ font-size:14px; margin-top:10px;}
.windowContent p{ margin-bottom:10px; }
.windowContent .one{ padding:20px; margin-bottom:80px;}
.windowContent .one ul{ margin-bottom:10px; padding-left:10px;}
.windowContent .one ul li{ list-style:decimal;}
.windowContent .one ul li strong{ font-weight:normal;}
.windowContent .two{ padding:20px;}
.windowContent .two .section-title {  font-weight: bold;  margin-top:40px; }
.windowContent .two ul{ margin-bottom:10px; padding-left:20px;}
.windowContent .two ul li{ list-style:disc;}
.windowContent .two ol{ list-style:decimal; padding-left:20px;}
.windowClose{ background:#fff; position:absolute; bottom:0; width:100%; z-index:2;}
.windowClose button{ display:block; width:90%; background:#38f; height:40px; border-radius:30px;  font-size:18px; color:#fff; margin:20px auto;}




.list{ margin-bottom:40px; }
.list .content .item{  background:#fff; display:flex;  border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.1); overflow:hidden;  margin-bottom:20px; }
.list .content .item .image{ width:35%; height:140px; background-position:center center; background-size:cover; }
.list .content .item .info{ flex:1; padding:10px;}
.list .content .item .info .title{ font-weight:bold; margin-bottom:10px;}
.list .content .item .info .raise{ color:#999; font-size:12px; margin-bottom:5px; }
.list .content .item .info .progess{ background:#eee; border-radius:2px;}
.list .content .item .info .progess span{ display:block; background:#38f; height:5px; border-radius:2px; width:50%; }
.list .content .item .info .money{ display:flex; justify-content:space-between; align-items:center;}
.list .content .item .info .money span{ color:#999; font-size:12px; }
.list .content .item .info .money span:last-child{ text-align:right;}
.list .content .item .info .money span strong{ display:block; color:#38f;}
.list .content .item .info .count{ display:flex; justify-content:space-between; align-items:center; font-size:12px;}
.list .content .item .info .count span{ color:#999;}
.list .content .item .info .count a{ display:block; background:#38f; padding:5px 20px; color:#fff; border-radius:20px;}



.page{ display:flex; justify-content:center; margin-top:40px;}
.page span{ border:1px solid #38f; padding:0 5px; margin:0 5px; color:#38f; border-radius:5px; cursor:pointer; }
.page span.on{ background:#38f; color:#fff; }



.detail{ background:#fff;}
.detail .wrapper .inner{ background:#fff; padding:0; margin:0;}


.detail .back{ position:absolute; left:20px; top:20px; z-index:99;}
.detail .back img{ width:10px; height:20px;}


.detail .slider .bd ul li{ background-position:center center; background-size:cover; height:300px;}
.detail .slider .hd{ background:#fff; border-radius:30px 30px 0 0; margin-top:-30px; padding:20px;}
.detail .slider .hd ul{ display:flex; justify-content:space-between;}
.detail .slider .hd ul li{ background-position:center center; background-size:cover; width:20%; height:50px;  border:3px solid #fff; border-radius:10px; overflow:hidden;}
.detail .slider .hd ul li.on{ border:3px solid #38f;}

.detail .intro{ padding:0 20px 20px;}
.detail .intro .title{ font-weight:bold; font-size:24px; margin-bottom:10px;}
.detail .intro .keyword{ display:flex; flex-wrap:wrap; margin-bottom:20px;}
.detail .intro .keyword span{ display:block; background:#ECF5FF; border:1px solid #38f; padding:0 10px; line-height:30px; color:#38f; font-size:14px; margin:0 2px; border-radius:20px; margin-bottom:5px;}
.detail .intro .progess{ background:#eee; border-radius:2px;}
.detail .intro .progess span{ display:block; background:#38f; height:5px; border-radius:2px; width:50%; }
.detail .intro .money{ display:flex; justify-content:space-between; color:#999; margin-bottom:20px; }
.detail .intro .money span:last-child{ text-align:right;}
.detail .intro .money span strong{ display:block; color:#38f; }
.detail .intro .count{ display:flex; justify-content:space-between; align-items:center; }
.detail .intro .count span{ color:#999;}
.detail .intro .count span strong{ font-weight:normal;}
.detail .intro .count a{ display:block; background:#38f; padding:0 20px; line-height:40px; color:#fff; border-radius:20px; white-space:nowrap;}


.detail .situation{ border-top:20px solid #ECF5FF; padding:20px; }
.detail .situation .subtitle{ font-size:18px; font-weight:bold; margin-bottom:10px;}
.detail .situation .content{ margin-bottom:40px;}
.detail .situation .content .item{ display:flex; justify-content:space-between; align-items:center; padding:10px 0; border-bottom:1px solid #ccc; margin-bottom:10px;}
.detail .situation .content .item div{ display:flex; align-items:center; }
.detail .situation .content .item img{ width:20px; height:20px; margin-right:10px;}
.detail .situation .content .item span{ color:#38f; }
.detail .situation .content .item strong{ text-align:right; }


.detail .tab{ border-top:20px solid #ECF5FF; border-bottom:20px solid #ECF5FF; padding:20px; margin-bottom:40px;}
.detail .tab .hd{ border-bottom:1px solid #eee; margin-bottom:20px;}
.detail .tab .hd ul{ display:flex; justify-content:space-between;}
.detail .tab .hd ul li{  border-bottom:0; padding:15px 0; font-size:18px; color:#999; margin-right:10px; cursor:pointer;}
.detail .tab .hd ul li.on{ border-bottom:5px solid #38f; font-weight:bold; color:#000;}
.detail .tab .bd .subtitle{ color:#38f; margin-bottom:10px; font-size:18px;}

.detail .story .content{ line-height:36px;}

.detail .prove .content .item{ display:flex; align-items:center; padding:10px 0; border-bottom:1px solid #eee;}
.detail .prove .content .item .image{ margin-right:20px;}
.detail .prove .content .item .image img{ width:60px; height:60px; border-radius:50%;}
.detail .prove .content .item .info{ flex:1;}
.detail .prove .content .item .title{ display:flex; margin-bottom:10px; }
.detail .prove .content .item .title span{ color:#38f; margin-right:10px;}
.detail .prove .content .item .title i{ display:block; background:#ECF5FF; padding:5px; color:#38f; font-size:12px; border-radius:5px; }
.detail .prove .content .item .text{ display:flex; font-size:14px; }
.detail .prove .content .item .text span{ color:#999; margin-right:10px; white-space:nowrap;}
.detail .prove .content .item .text p{}

.detail .donate .content .item{ display:flex; align-items:center; padding:10px 0; border-bottom:1px solid #eee;}
.detail .donate .content .item .image{ margin-right:10px;}
.detail .donate .content .item .image img{ width:60px; height:60px; border-radius:50%;}
.detail .donate .content .item .info{ flex:1;}
.detail .donate .content .item .title{ display:flex; margin-bottom:10px; }
.detail .donate .content .item .title span{ color:#4183c4;}
.detail .donate .content .item .title i{ margin:0 10px;}
.detail .donate .content .item .title strong{ color:#c00;  }
.detail .donate .content .item .text{ display:flex; font-size:14px; }
.detail .donate .content .item .text span{ color:#999; margin-right:10px; white-space:nowrap;}
.detail .donate .content .item .text p{ color:green;}





.news{ margin-bottom:60px;}
.news .item{ background:#fff; border-radius:10px; display:flex; justify-content:space-between; align-items:center; padding:20px; border-radius:10px; margin-bottom:10px;  }
.news .item .info{ flex:1; padding:0 20px;}
.news .item .info .title{  margin-bottom:10px;}
.news .item .info .date{ color:#999;}
.news .item .image img{ width:auto; height:20px;}


.article{ background:#fff; padding:20px; border-radius:10px;  margin-bottom:40px;}
.article .title{ text-align:center; font-size:16px; font-weight:bold;}
.article .content{ padding:20px 0;}