﻿﻿/* ============================================================
   样式重置
   ============================================================ */
* { box-sizing: border-box; cursor: pointer; -webkit-tap-highlight-color: transparent; -moz-tap-highlight-color: transparent; outline: none; }
body, p, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, select, textarea, button, th, td { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: 400; }
ul, dl, ol { list-style: none; }
img, fieldset, input[type="submit"] { border: 0 none; }
img { display: inline-block; overflow: hidden; vertical-align: top; width: 100%; }
em { font-style: normal; }
strong { font-weight: bolder; }
table { border-collapse: collapse; border-spacing: 0; }
button, input { cursor: pointer; border: 0 none; -webkit-appearance: none; appearance: none; border-radius: 0; }
textarea { word-wrap: break-word; resize: none; }  /* word-wrap for opera, resize for webkit */
menu { margin: 0; padding: 0; }
body { margin: 0 auto; -webkit-user-select: none; -webkit-text-size-adjust: none!important; font-family: "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", "Arial", sans-serif, Droidsansfallback; font-size: 0.26rem; font-weight: 400; background: #fff; color: #333; overflow-x: hidden; -webkit-overflow-scrolling: touch; }
input, textarea { font-family: "Helvetica Neue", "Helvetica", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", "Arial", sans-serif, Droidsansfallback; font-weight: 400; }
input[type="number"] { -webkit-user-select: text; }
a, button, input { -webkit-touch-callout: none; }/* 1.ios 长按时不触发系统的菜单 2.禁止长按时下载图片 */
input, select, textarea { outline: none; background: none; font-weight: 400; }
/* input { -webkit-appearance: none; } */
/* 去除android4.0以下 a/button/input标签被点击时产生的边框 因为边框引起了不少bug */
a, button, input, select, li { -webkit-tap-highlight-color: rgba(0,0,0,0); }
/* Android4.0下不识别选择器-webkit-transform-3d 使用它可做Android4.0下版本兼容 */
@media all and (-webkit-transform-3d) {
 /* android4.0+ ios4+ 恢复按钮被点击时产生的效果 */
 /*a,button,input{-webkit-tap-highlight-color:rgba(130,130,130,.52);}*/
 a, button, input, select { -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; -moz-tap-highlight-color: transparent; outline: none; }
}
a { text-decoration: none; }
.fl { float: left; }
.fr { float: right; }
/*弹性盒子*/
.flex { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
.flex-v { -webkit-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; }
.flex-1 { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; }
.flex-align-top { -webkit-box-align: flex-start; -webkit-align-items: flex-start; -ms-flex-align: center; align-items: flex-start; }
.flex-align-center { -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
.flex-pack-center { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }
.flex-pack-justify { -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }
.flex-space-around { -webkit-justify-content: space-around; justify-content: space-around; }
.flex-space-between { -webkit-justify-content: space-between; justify-content: space-between; }
.hor-view { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; flex-direction: row }
.ver-view { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column }
.hor-gap { width: 1px; height: 100%; line-height: 0 }
.ver-gap { height: 1px; width: 100%; line-height: 0 }
/*弹性盒子*/
.between { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between }
.center { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center }
.start { display: flex; display: -webkit-flex; justify-content: flex-start; -webkit-justify-content: flex-start }
.end { display: flex; display: -webkit-flex; justify-content: flex-end; -webkit-justify-content: flex-end }
.middle { display: flex; display: -webkit-flex; -webkit-align-items: center; align-items: center; }
.v-bottom { display: flex; display: -webkit-flex; -webkit-align-items: flex-end; align-items: flex-end; }
.v-baseline { display: flex; display: -webkit-flex; -webkit-align-items: baseline; align-items: baseline; }
.col { display: flex; display: -webkit-flex; -webkit-flex-direction: column; flex-direction: column; }
.row { display: flex; display: -webkit-flex; -webkit-flex-direction: row; flex-direction: row; }
.nowrap { -webkit-flex-wrap: nowrap; -webkit-box-lines: single; -moz-flex-wrap: nowrap; flex-wrap: nowrap; }
.wrap { -webkit-flex-wrap: wrap; -webkit-box-lines: single; -moz-flex-wrap: wrap; flex-wrap: wrap; }
　 .fn-hide { display: none }
.clearfix:after, .clearfix:before { content: "."; display: block; height: 0; visibility: hidden; clear: both; }
.clearfix { *zoom: 1;
}
::-moz-placeholder {
 color: #777;
 font-size:0.3rem;
}
::-webkit-input-placeholder {
 color: #777;
 font-size: 0.3rem;
}
:-ms-input-placeholder {
 color: #777;
 font-size: 0.3rem;
}
.text-overflow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hide-text-2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.midcenter { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
html { overflow-y: auto; overflow-x: hidden; height: 100%; max-width: 750px; margin: 0 auto; }
body { max-width: 750px; min-height: 100%; box-sizing: border-box; margin: 0 auto; overflow: hidden; -webkit-overflow-scrolling: touch; position: relative;}
.page1{ background: #224E8B;}
.topbg { position: absolute; z-index: 1; top: 0; left: 0; right: 0; background:url(https://image.360eol.com/2025/csu2025/images/topbg.png) top no-repeat; background-size:100% auto}
.bg1 { position: absolute; z-index: 2; top: 21.88rem; left: 0; width: 3.08rem;}
.bg2 { position: absolute; z-index: 2; top: 29.66rem; right: 0; width: 2.31rem;}
.footbg{position: absolute;z-index: 2; bottom:0;left:0;right:0;}


@font-face {font-family: 'ali';src: url(Alibaba-PuHuiTi-Regular.ttf);}
.main { position: relative; z-index: 3; padding: 8.23rem 0.23rem 2.35rem; }
.viewbg { position: relative; z-index: 2; }
.viewbg .swiper-container { padding-bottom: 0.4rem; }
.viewbg .swiper-slide { height: 3.6rem; position: relative; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.viewbg .videobox { margin: 0 auto; height: 3.6rem; position: relative; width: 100%; }
.viewbg .swiper-slide.swiper-slide-active .videobox { height: 100%; }
.viewbg .on-box { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 0.125rem; background: #000; overflow: hidden; height: 100%; z-index: 10; }
.viewbg .on-box .play { position: absolute; transform: translate(-50%, -50%); top: 50%; left: 50%; background: url(https://image.360eol.com/2025/csu2025/images/play.png) no-repeat; width: 0.8rem; height: 0.8rem; background-size: cover; }
.viewbg .cover-img { height: 100%; }
.viewbg .video-play { width: 100%; height: 100%; display: block; overflow: hidden; background: #000; border-radius: 0.125rem; }
.viewbg .swiper-pagination { height: 0.06rem; font-size: 0; vertical-align: top; bottom: 0.2rem; }
.viewbg .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 0.05rem; width: 0.24rem; height: 0.06rem; border-radius: 0; background:#9cd7e9; border-radius: 2px; opacity: 0.47; }
.viewbg .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active { opacity: 1; }

.ztwz{ margin:0 auto; width:5.78rem; margin-bottom:0.53rem;}
.maincon{ position:relative;}
.tip{ position:absolute; z-index:2;left:50%; transform:translateX(-50%); width:5.66rem;top:-0.18rem;}
.card { position: relative; z-index:1; margin-bottom: 0.08rem; }
.card1 .con1{ height:1.54rem; background:url(https://image.360eol.com/2025/csu2025/images/con1.png) no-repeat; background-size:cover; position:relative}
.card2 .con1,.card3 .con1{height:1.31rem; background:url(https://image.360eol.com/2025/csu2025/images/conc.png) no-repeat; background-size:cover; position:relative}
.card .con2{background: linear-gradient( 180deg, #FDFEFF 0%, #E8F1FF 100%); padding:0.25rem 0.34rem 0;}
.card .con3{ height:0.69rem; background:url(https://image.360eol.com/2025/csu2025/images/con2.png) no-repeat; background-size:cover}
.card .titlebt{ height:0.62rem;font-family: 'ali';font-weight: 600;font-size: 0.32rem;color: #2064AB;line-height: 0.44rem; padding-top:0.08rem}
.card1 .titlebt { position: absolute; top: 0.64rem; left: 0.44rem; padding-left:0.95rem; background: url(https://image.360eol.com/2025/csu2025/images/n1.png) left no-repeat; background-size:0.83rem 0.62rem;}
.card2 .titlebt { position: absolute; top: 0.40rem; left: 0.41rem; padding-left:0.95rem; background: url(https://image.360eol.com/2025/csu2025/images/n2.png) left no-repeat; background-size:0.8rem 0.62rem; }
.card3 .titlebt { position: absolute; top: 0.38rem; left: 0.34rem; padding-left:0.95rem; background: url(https://image.360eol.com/2025/csu2025/images/n3.png) left no-repeat; background-size:0.83rem 0.62rem;}
.maincon i{ position:absolute; z-index:2;top:-0.3rem; width:0.14rem; height:0.51rem;  background: url(https://image.360eol.com/2025/csu2025/images/arr.png) left no-repeat; background-size:cover;}
.maincon i.arr1{left:0.37rem; }
.maincon i.arr2{left:0.92rem; }
.maincon i.arr3{right:0.37rem; }
.maincon i.arr4{right:0.92rem; }
.time_place{font-family: 'ali';font-weight: 600; padding-left:0.07rem;font-weight: 500;font-size: 0.3rem;color: #1865B2;line-height: 0.42rem;}
.process{ padding-right:0.09rem; position:relative; z-index:1; margin-top:0.23rem;}
.process img{ width:2.2rem;}
.bkwz{ position:relative; z-index:2; margin-top:-0.13rem;}
.bkwz li{ position:relative; margin-bottom:0.2rem;background: linear-gradient( 90deg, #D9ECFF 0%, #EDF4FF 100%);border-radius: 0.27rem;height: 0.54rem;font-size: 0.26rem;color: #1C3F8B;line-height: 0.54rem; padding:0.12rem 0.24rem;}
.bkwz li:last-child{margin-bottom:0}
.bkwz li:after{ position:absolute; content:'';left:50%; transform:translateY(-50%); width:0.15rem; height:0.1rem; background: url(https://image.360eol.com/2025/csu2025/images/arrow.png) no-repeat; background-size:cover; bottom:-0.2rem;}
.bkwz li:last-child:after{ display:none}


.f_bottom {padding:0.38rem 0.6rem 0.38rem 0.6rem;}
.f_bottom .tu {width: 1.6rem;height: 1.60rem;background: #FFFFFF;border-radius:0.1rem; padding: 0.1rem; }
.f_bottom .tu img{width: 1.4rem;height: 1.40rem;}
.f_bottom .wz { width:calc(100% - 1.94rem);font-weight: 600;font-size: 0.28rem;color: #FFFFFF;line-height: 0.42rem;}

.foot_btn a{height: 1.04rem; margin-bottom:0.2rem;font-family: 'ali';border-radius: 0.55rem;color: #003771; font-size:0.38rem; font-weight:600;}
.foot_btn a:last-child{ margin-bottom:0;}
.foot_btn a.btn1{background: linear-gradient(90deg, #6DCFFF 0%, #BCEDFF 100%);box-shadow: 0px 10px 9px -1px #014792;}
.foot_btn a.btn2{background: linear-gradient(90deg, #FFDB79 0%, #FFF3AB 100%);box-shadow: 0px 10px 9px -1px #014792;}


.page2{background: #20518C;}
.nymain{ position: relative; z-index: 3; padding: 2.5rem 0.23rem 0.55rem;}
.nymain .con{ background:#fff;border-radius: 0.2rem; padding:0.27rem;}
.nymain .wz1{font-size:0.26rem;color: #1C3F8B;line-height: 0.36rem; padding-top:0.29rem}
.nymain .title{font-family: 'ali';font-weight:600;font-size: 0.34rem;color: #063567;line-height: 0.47rem; text-align:center; margin-top:0.24rem; margin-bottom:0.18rem;}
.info{font-size: 0.3rem;color: #1C3F8B;line-height:0.54rem; padding-bottom:0.2rem;border-bottom: 1px solid #AEB0B3;}
.nymain .wz2{ padding-top:0.07rem;font-size: 0.3rem;color: #1C3F8B;line-height:0.46rem;}
.nymain .wz3{font-size: 0.28rem;color: #7285AC;line-height: 0.5rem; padding:0.1rem 0;}

.nybtn{ margin-top:0.5rem;}
.nybtn a{ width:calc(50% - 0.13rem); height:0.88rem;border-radius: 0.2rem;font-family: 'ali';font-weight:600;font-size: 0.34rem;color: #FFFFFF;}
.nybtn a.btn1{background: #67A1E7;box-shadow: 0px 10px 9px -1px #014792;}
.nybtn a.btn2{background: #FF8841;box-shadow: 0px 10px 9px -1px #014792;}

/**适配**/
@media screen and (min-width:320px) {
 html { font-size: 42.66px }
}
@media screen and (min-width:360px) {
 html { font-size: 48px }
}
@media screen and (min-width:375px) {
 html { font-size: 50px }
}
@media screen and (min-width:384px) {
 html { font-size: 51.2px }
}
@media screen and (min-width:400px) {
 html { font-size: 54px }
}
@media screen and (min-width:414px) {
 html { font-size: 54px }
}
@media screen and (min-width:424px) {
 html { font-size: 56.54px }
}
@media screen and (min-width:480px) {
 html { font-size: 64px }
}
@media screen and (min-width:540px) {
 html { font-size: 72px }
}
@media screen and (min-width:640px) {
 html { font-size: 85.32px }
}
@media screen and (min-width:720px) {
 html { font-size: 96px }
}
@media screen and (min-width:750px) {
 html { font-size: 100px }
}
@media only screen and (device-width: 375px) and (device-height: 667px) {
}

/* x/xs */
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
 .f_bottom { padding-bottom: 0.42rem; }
}

/* xs max/xr/11 */
@media only screen and (device-width: 414px) and (device-height: 896px) {
 .f_bottom { padding-bottom: 0.42rem; }
}
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
 .f_bottom { padding-bottom: 0.42rem; }
}
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {
 .f_bottom { padding-bottom: 0.42rem; }
}
