#topBannerWrap {
    position: relative;
    width: 100%;
}
#topBanner {
    width: 100%;
    display: block;
}

#bannerClose {
    position: absolute;
    right: 12px;
    bottom: 12px;
    width: 28px;
    height: 28px;
    background: rgba(0,0,0,0.45);
    color: #fff;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    cursor: pointer;
    font-size:18px;
}
#bannerClose:hover{
    background: rgba(0,0,0,0.7);
}
.banner-fade-out{
    animation: fadeOut 0.4s forwards;
}
@keyframes fadeOut {
    from {opacity:1;}
    to {opacity:0;}
}

.header_left {
    float: left;
}
.mid {
    width: 1200px;
    margin: 0 auto 0;
    height: 88px;
}
.header {
    width: 1200px;
    margin: 0 auto 0;
    height: 88px;
}
.header_wrap {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    width: 500px;
    float: left;
    height: 88px;
}
.header_left img {
    width: 65px;
    height: auto;
    margin-right: 20px;
    vertical-align: middle;
}
.header_text {
    display: inline-block;
    vertical-align: middle;
}
.header_text h2 {
    font-size: 28px;
    font-weight: 900;
    color: #1a1a1a;
    display: inline-block;
    line-height: 1;
    font-family: "Microsoft YaHei", "黑体", sans-serif;
}
.year_tag {
    /* display: inline-block; */
    background-color: #409eff;
    color: #ffffff;
    font-size: 10px;
    font-weight: 500;
    padding: 0px 10px;
    border-radius: 18px 18px 18px 0;
    margin-left: 5px;
    vertical-align: middle;
    margin-bottom: 4px;
}
.header_text h3 {
    font-size: 12px;
    color: #606770;
    font-weight: normal;
    margin-top: 5px;
    letter-spacing: 4px;
    font-family: "Microsoft YaHei", sans-serif;
}
.header_right {
    float: right;
}
.header_right ul li {
    float: left;
    margin-top: 30px;
    margin-left: 20px;
    position: relative;
}
.header_right ul li:After {
    position: absolute;
    content: '';
    right: -11px;
    width: 1px;
    height: 16px;
    top: 5px;
    background: rgba(153, 153, 153, 1);
}
.header_right ul li:nth-child(2)::after {
    display: none;
}
.header_right ul li a {
    color: rgba(96, 101, 110, 1);
    font-size: 14px;
    line-height: 26px;
}
.header_right ul li a:hover {
    color: #409eff;
}
.top_nav {
    background: rgba(22, 127, 240, 1);
    height: 40px;
}
.top_nav_cont {
    width: 1200px;
    margin: 0 auto 0;
}
.top_nav_cont ul li {
    float: left;
    margin-right: 40px;
    line-height: 40px;
    color: #fff;
}
.top_nav_cont ul li:last-child {
    position: relative;
}
.top_nav_cont ul li:last-child:after {
    position: absolute;
    content: '';
    right: -18px;
    width: 1px;
    height: 16px;
    top: 12px;
    background: rgba(255, 255, 255, 0.2);
}
.top_nav_cont ul li a {
    font-size: 14px;
    line-height: 40px;
    color: #fff;
    opacity: 0.9;
}
.top_nav_cont ul li p {
    font-size: 14px;
    line-height: 40px;
    color: #fff;
    font-weight: bold;
}
.top_nav_cont ul li a:hover {
    border-bottom: 1px solid #fff;
    opacity: 1;
}
.top_nav_cont ul:last-child li:last-child:after {
    display: none;
}
.hidden {
    display: none
}
.dlx {
    width: 100%;
    z-index: 1000;
    height: 100vh;
    background: rgba(0,0,0,.7);
    position: fixed;
    left: 0;
    top: 0
}

.dlx .tt {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%)
}

.dlx .tt .CloseModal {
    z-index: 10000;
    position: absolute;
    left: 10px;
    top: 10px;
    background-image: url(../image/x.png);
    width: 30px;
    height: 30px;
    background-size: 100% 100%;
    cursor: pointer;
    border: 1px solid #ccc;
    border-radius: 15px;
    font-size: 14px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}


.page01 {
background: radial-gradient(circle at 72% 8%, rgba(87, 150, 255, .11), transparent 31%), linear-gradient(180deg, #ffffff 0%, #f6faff 55%, #ffffff 100%);
padding-top: 1px;
}
.page01 .page01_cont{
	width: 1200px;
	margin: 50px auto 0;
}
.page01_cont_top_left{
	float: left;
	width: 820px;
}
.page01_cont_top_left1{
	    flex: 1 1 auto;
	    border-radius: 22px;
	    padding: 32px 46px 32px;
	    background: linear-gradient(110deg, rgba(255, 255, 255, .95) 0%, rgba(243, 248, 255, .96) 52%, rgba(232, 242, 255, .9) 100%);
	    border: 1px solid rgba(218, 229, 244, .8);
	    box-shadow:0 12px 36px rgba(34, 88, 160, .09);
	    overflow: hidden;
	    position: relative;
		z-index: 1;
		
}
.page01_cont_top_left1:after{
position: absolute;
    background: url(../images/page01_2b.png) no-repeat center;
    background-size: 100%;
    width: 500px;
    right: -19px;
    top: 137px;
    content: '';
    height: 248px;
	    z-index: -1;
}
.page01_cont_top_left1 h1{
	    margin: 0;
	    line-height: 1.18;
	    letter-spacing: .5px;
	    font-size: 38px;
		font-weight: bold;
	    color: #111827;
}
.page01_cont_top_left1 h1 span{
    display: block;
    color: #1769f6;
    margin-top: 8px;
	font-size: 38px;
	font-weight: bold;
	
}
.page01_cont_1 {
	margin: 20px 0;
}
.page01_cont_1 li{
	float: left;
	margin-left: 20px;
}
.page01_cont_1 li p{
	padding-left: 15px;
	font-size: 16px;
	color: #1e2a3a;
	position: relative;
}
.page01_cont_1 li p:after{
    position: absolute;
    background: url(../images/page01_1b.png) no-repeat center;
    background-size: 100%;
    width: 18px;
    height: 18px;
    content: '';
    top: 2px;
    left: -9px;
	
}
.page01_cont_desc{
	    margin-top: 21px;
	    font-size: 16px;
	    line-height: 1.7;
		color: #46556d;
}
.byh-search-box {
    margin-top: 21px;
    width: 69%;
    min-width: 660px;
    height: 64px;
    border-radius: 16px;
    display: grid;
    grid-template-columns: 115px 1fr 126px;
    align-items: center;
    background: #fff;
    border: 1px solid #e5ebf5;
    box-shadow: 0 12px 28px rgba(32, 80, 139, .11);
    position: relative;
    z-index: 4;
    overflow: hidden;
}
  .byh-search-box {
      width: 72%;
      min-width: 0;
      max-width: 590px;
      height: 60px;
      margin-top: 20px;
      grid-template-columns: 100px minmax(0, 1fr) 112px;
      border-radius: 14px;
    }
    .byh-category-select {    height: 34px;
    padding-left: 22px;
    border: 0;
	font-size: 13px;
    border-right: 1px solid #e8edf4;
    background: transparent;
    color: #20293a;
    font-weight: 650;
    outline: none;
    cursor: pointer; }
    .byh-search-input { padding: 0 15px; font-size: 13px;    border: 0;
    outline: none;
    padding: 0 20px;
    color: #27364d;
    min-width: 0; }
    .byh-search-submit { height: 46px; font-size: 14px;
	     margin-right: 7px;
	     height: 50px;
	     border: 0;
	     border-radius: 13px;
	     color: #fff;
	     background: linear-gradient(135deg, #1769f6, #0c5de8);
	     font-weight: 750;
	     cursor: pointer;
	     display: flex;
	     align-items: center;
	     justify-content: center;
	     gap: 8px;
	     box-shadow: 0 9px 20px rgba(23, 105, 246, .23);
	 }
    .byh-search-submit img{
		width: 20px;
		margin-right: 8px;
	}
    .byh-hot-searches { gap: 7px; margin-top: 20px; }
    .byh-hot-label { font-size: 13px; }
    .byh-pill { padding: 6px 10px; font-size: 12px; }

    .byh-hero-quick-links {
      width: 72%;
      min-width: 0;
      max-width: 590px;
      margin-top: 25px;
      gap: 7px;
    }
    .byh-hero-quick-link { height: 54px; padding: 0 10px; gap: 8px; border-radius: 11px; }
    .byh-quick-icon { width: 32px; height: 32px; flex-basis: 32px; border-radius: 9px; }
    .byh-quick-icon svg { width: 17px; height: 17px; }
    .byh-quick-text strong { font-size: 12.5px; }
    .byh-quick-text small { margin-top: 2px; font-size: 9.5px; }

    .byh-hero-art {
      right: -18px;
      top: 25px;
      width: 52%;
      height: 395px;
    }

    .byh-planner-card { padding: 19px 20px 15px; }
    .byh-panel-title { font-size: 20px; }
    .byh-panel-desc { font-size: 12px; margin: 6px 0 12px; }
    .byh-field-row {
      height: 43px;
      margin-top: 8px;
      grid-template-columns: 31px 100px minmax(0,1fr);
      padding: 0 10px;
    }
    .byh-field-label { font-size: 12.5px; }
    .byh-field-row select { font-size: 12px; }
    .byh-cta { height: 45px; margin-top: 10px; font-size: 15px; }
    .byh-helper { font-size: 11px; }
    .byh-trust-row { gap: 8px; font-size: 12px; }
    .byh-avatar { width: 25px; height: 25px; font-size: 10px; }

    .byh-notice-card { padding: 14px 16px 12px; }
    .byh-notice-head h3 { font-size: 17px; }
    .byh-notice-item {
      grid-template-columns: 58px minmax(0,1fr) 38px;
      gap: 7px;
      padding: 6px 0;
      font-size: 12.5px;
    }
.page01_cont_1 li:nth-child(1){
	margin-left: 10px;
}
.page01_cont_2{
	margin-top: 20px;
	z-index: 4;
}
.page01_cont_2 h3{
	float: left;
	margin-top: 13px;
	padding-left: 20px;
	position: relative;
}
.page01_cont_2 h3:after{
	position: absolute;
	left: 0;
	top: 0;
	content: '🔥';
	font-size: 13px;
}
.page01_cont_2 li{
	float: left;
	z-index: 4;
	    flex: 0 0 auto;
	    white-space: nowrap;
	    border: 1px solid #edf1f7;
	    background: rgba(255, 255, 255, 1);
	    color: #37445a;
	    border-radius: 999px;
	    padding: 7px 13px;
	    font-size: 13px;
	    cursor: pointer;
	    transition: .18s ease;
		margin-left: 10px;
}
.page01_cont_2 li:hover{
		background: #2971eb;
}
.page01_cont_2 li:hover a{
	color: #fff;	
}
.page01_cont_3 {
	    display: grid;
	    grid-template-columns: repeat(4, minmax(0, 1fr));
	    gap: 9px;
	    position: relative;
	    z-index: 4;
		width: 98%;
		margin-top: 25px;
		gap: 7px;
}
.page01_cont_3 ol{
	float: left;
	    width: 35px;
	    height: 35px;
	    flex-basis: 32px;
	    border-radius: 18px;
	    display: grid;
	    place-items: center;
	    background: #eaf3ff;
		margin-top: 4px;
		margin-right: 12px;
}
.page01_cont_3 ol img{
	width: 19px;
}
.page01_cont_3 li:nth-child(2) ol{
	    background: #e9fbf3;
}
.page01_cont_3 li:nth-child(3) ol{
	    background: #f0edff;
}
.page01_cont_3 li:nth-child(4) ol{
	    background:#edf7ff;
}
.page01_cont_3 li:nth-child(4) ol img{
	width: 14px;
}
.page01_cont_3 li{
	    border: 1px solid rgba(210, 225, 246, .92);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
    box-shadow: 0 5px 14px rgba(38, 84, 145, .045);
    padding: 8px 10px;
	border-radius: 8px;
	background: #fff;
	    cursor: pointer;
				-webkit-transition: all .4s;
				-moz-transition: all .4s;
				cursor: pointer;
}
.page01_cont_3 li:hover{
	      transform: translate(0, -10px);
	  -webkit-transform: translate(0, -10px);
	  -ms-transform: translate(0, -10px);
	  -moz-transform: translate(0, -10px);
}
.page01_cont_3 li p{
   font-size: 14px;	
}
.page01_cont_3 li span{
    color: #8492a8;
	    font-size: 11px;
}
.page01_cont_top_left2{
	    margin-top: 30px;
	    min-height: 112px;
	    border-radius:18px;
	    background: #fff;
	    border: 1px solid #e4ebf5;
	    box-shadow: 0 12px 36px rgba(34, 88, 160, .09);;
	    grid-template-columns: repeat(5, 1fr);
	    align-items: center;
	    padding: 13px 8px;
}

.page01_cont_top_left2 ul li{
float: left;	
width: 20%;
padding-left: 5px;
}
.page01_cont_top_left2 ul li h2{
	font-size: 18px;
	font-weight: bold;
	margin-top: 9px;
}
.page01_cont_top_left2 ul li h3{
	font-size: 14px;
	color:#1e2a3a;
	margin: 9px 0 7px;
}
.page01_cont_top_left2 ul li p{
	    color: #8b97aa;
		font-size: 11px;
}
.page01_cont_top_left2 ul li ol{
	float: left;
	    width: 40px;
	    height: 40px;
		margin-right: 10px;
	background: #eaf3ff;
	    border-radius: 50%;
	    display: grid;
	    place-items: center;
		margin-top: 22px;
}
.page01_cont_top_left2 ul li:nth-child(2) ol{
	background: #fff1e2;
}
.page01_cont_top_left2 ul li:nth-child(3) ol{
	background: #e9fbf3;
}
.page01_cont_top_left2 ul li:nth-child(4) ol{
	background:#f0edff;
}
.page01_cont_top_left2 ul li:nth-child(5) ol{
	background:#edf7ff;
}
.page01_cont_top_left2 ul li ol img{
	width: 20px;
}
.page01_cont_top_right{
	float: right;
	width: 360px;
	padding: 19px 20px 15px;
	background: #fff;
	border-radius: 8px;
	    border: 1px solid #e6edf6;
	    box-shadow:0 12px 36px rgba(34, 88, 160, .09);
}
.page01_cont_top_right h2{
	    margin: 0;
	    font-size: 22px;
	    line-height: 1.35;
	    color: #151b28;
}
.page01_cont_top_right h3{
	    font-size: 12px;
	    margin: 6px 0 12px;
		    color: #708097;
		    
		    line-height: 1.65;
}
.byh-field-row {
    border: 1px solid #dfe7f2;
    border-radius: 10px;
    display: grid;
    align-items: center;
    background: #fff;
	    height: 43px;
	    margin-top: 8px;
	    grid-template-columns: 31px 100px minmax(0, 1fr);
	    padding: 0 10px;
}
.byh-field-icon{
	margin-top: 8px;
}
.byh-field-row select {
    width: 100%;
    border: 0;
    outline: 0;
    color: #96a2b4;
    background: transparent;
    cursor: pointer;
}
.cta {
    width: 100%;
    height: 45px;
    margin-top: 10px;
    border: 0;
    border-radius: 10px;
    background: linear-gradient(135deg, #ff8708, #ff6a00);
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(255, 122, 0, .22);
}

 .helper {
     text-align: center;
     color: #7b879b;
     font-size: 11px;
     margin: 7px 0 11px;
 }   

   .trust-row {
       border-top: 1px solid #edf1f6;
       padding-top: 11px;
       display: flex;
       align-items: center;
       gap: 8px;
       font-size: 12px;
       color: #59667b;
       
   }
.avatars {
    display: flex;
}
.avatar {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    border: 2px solid #fff;
    margin-left: -7px;
    display: grid;
    place-items: center;
    font-size: 10px;
    color: white;
    font-weight: 700;
}
.a1 {
    background: linear-gradient(135deg, #6d5dfc, #8c7bff);
}
.a2 {
    background: linear-gradient(135deg, #2b8af7, #63b1ff);
}
.a3 {
    background: linear-gradient(135deg, #19b876, #56d69e);
}
.a4 {
    background: linear-gradient(135deg, #f79009, #ffb34e);
}
.trust-row b {
    color:#ff7a00;
    font-size: 15px;
	font-weight: bold;
}
.page01_cont_bottom_right{
	float: right;
	width: 360px;
	    padding: 12px 20px 11px;
	background: #fff;
	border-radius: 8px;
	margin-top:15px;
	    border: 1px solid #e6edf6;
	    box-shadow:0 12px 36px rgba(34, 88, 160, .09);
}
.bottom_righttop{

	    display: flex;
	    justify-content: space-between;
	    align-items: center;
	    margin-bottom: 7px;
}
.bottom_righttop h3 {
    font-size: 17px;
}
.bottom_righttop a{
    color: #7989a2;
    font-size: 12px;
}
.page01_cont_bottom_right ul {
    list-style: none;
    padding: 0;
    margin: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.page01_cont_bottom_right ul li{
	    display: grid;
	    align-items: center;
		grid-template-columns: 67px minmax(0, 1fr) 59px;
		    gap: 7px;
		    padding: 6px 0;
		    font-size: 12.5px;
}
.page01_cont_bottom_right ul li span{
	    padding: 3px 6px;
	    font-size: 10.5px;
		line-height: 13px;
		height: 12px;
		font-weight: 650;
		border: 1px solid;
		justify-self: start;
		border-radius: 5px;
}
.page01_cont_bottom_right ul li a {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #334058;
}
.page01_cont_bottom_right ul li b{
    font-size: 11px;
	color: #7e8ba0;
	text-align: right;
	font-size: 12.5px;
}
.page01_cont_bottom_right ul li:nth-child(1) span,.page01_cont_bottom_right ul li:nth-child(5) span  {
    color: #f37021;
    background: #fff6ec;
    border-color: #ffd2ad;
}
.page01_cont_bottom_right ul li:nth-child(2) span,.page01_cont_bottom_right ul li:nth-child(4) span {
 color: #337af0;
 background: #eef5ff;
 border-color: #bad4ff;
}
.page01_cont_bottom_right ul li:nth-child(3) span{
    color: #12a264;
    background: #ebfbf4;
    border-color: #ace7ce;
}
.page_cont_min{
	width: 1200px;
	margin: 40px auto 0;
	border: 1px solid #e4ebf5;
	border-radius: 18px;
	background: rgba(255, 255, 255, .94);
	box-shadow:0 12px 36px rgba(34, 88, 160, .09);
	padding: 14px 22px 18px;
	height: 220px;
}
.page_cont_min ul{
        display: grid;
	    grid-template-columns: repeat(4, minmax(0, 1fr)) .9fr;
	    gap: 12px;

}
.page_cont_min ul li{
	    min-height: 130px;
	    padding: 12px;
	    grid-template-columns: 54px minmax(0, 1fr);
	    gap: 9px;
		border: 1px solid #cfe0ff;
	    border-radius: 14px;
			    cursor: pointer;
				-webkit-transition: all .4s;
				-moz-transition: all .4s;
				cursor: pointer;
		background: radial-gradient(circle at 72% 8%, rgba(87, 150, 255, .11), transparent 31%), linear-gradient(180deg, #ffffff 0%, #f6faff 55%, #ffffff 100%);
}
.page_cont_min ul li:hover{
	      transform: translate(0, -10px);
	  -webkit-transform: translate(0, -10px);
	  -ms-transform: translate(0, -10px);
	  -moz-transform: translate(0, -10px);
}
.page_cont_min ul li img{
	width: 58px;
	height: 58px;
	float: left;
}
.page_cont_min ul li a{
	    display: inline-flex;
	    align-items: center;
	    justify-content: center;
	    margin-top: 11px;
	    height: 29px;
	    min-width: 106px;
	    padding: 0 16px;
	    border: 1px solid #6fa4ff;
	    color: #2971eb;
	    background: #fff;
	    border-radius: 999px;
	    cursor: pointer;
	    font-size: 14px;
	    font-weight: 700;
	    margin-left: 30px;
}
.page_cont_min ul li a:hover{
	color: #fff;
	background: #2971eb;
}
.page_cont_min ul li h3{
	    color: #172033;
	    font-size: 16px;
	    line-height: 26px;
	    font-weight: bold;
	    overflow: hidden;
		margin-left: 16px;
		float: left;
}
.page_cont_min ul li p{
	    color: #7b89a0;
	    font-size: 12px;
	    line-height: 26px;
	    overflow: hidden;
		margin-left: 16px;
		float: left;
}
.page_cont_min ul li ol{
	float: left;
}
.page_cont_min ul li ol span{
	    flex: 0 0 auto;
	    padding: 4px 9px;
	    border-radius: 999px;
	    background: #eef5ff;
	    color: #4e77bd;
	    font-size: 11px;
	    white-space: nowrap;
		margin-left: 10px;
}
.page_cont_min ul li:nth-child(5) h3{
margin-top: 30px;
}
.page_cont_min ul li:nth-child(5) {
	position: relative;
}
.page_cont_min ul li:nth-child(5):after{
    position: absolute;
    right: 22px;
    top: 20px;
    background: url(../images/moreschool.png) no-repeat center;
    width: 33px;
    content: '';
    height: 83px;
    background-size: 100%;
    opacity: 0.6;
}
.page_min_head{
	    display: flex;
	    align-items: baseline;
	    justify-content: space-between;
	    margin-bottom: 12px;
}
.page_min_head_left {
	    display: flex;
	    align-items: baseline;
	    gap: 16px;
}
.page_min_head a {
    color: #6e7d93;
    font-weight: 400;
}
.page_min_head_left h2{ 
	    margin: 0;
	    font-size: 22px;
	    color: #152034;
}
.page_min_head_left span {
    color: #8b98ab;
    font-size: 12px;
}
.page_cont_min1{
	width: 1200px;
	margin: 40px auto 0;
	border: 1px solid #e4ebf5;
	border-radius: 18px;
	background: rgba(255, 255, 255, .94);
	box-shadow:0 12px 36px rgba(34, 88, 160, .09);
    padding: 14px 22px 18px;
}
.byh-material-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}
 .byh-material-main {
    height: 112px;
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 0px;
    padding: 12px 8px 8px;
    align-items: center;
    }
    .byh-material-cover {
      position: relative;
      width: 70px;
      height: 92px;
      border-radius: 3px 7px 7px 3px;
      overflow: visible;
      color: #143d79;
      padding: 10px 8px;
      box-shadow: 2px 1px 7px rgba(30, 69, 126, .18);
      transform: perspective(220px) rotateY(-6deg);
      isolation: isolate;
    }
   
	.byh-material-card{
	    min-width: 0;
	    height: 146px;
	    overflow: hidden;
	    border: 1px solid #d8e4f6;
	    border-radius: 15px;
	    background: linear-gradient(155deg, #ffffff 0%, #f8fbff 100%);
	    box-shadow: 0 7px 18px rgba(38, 84, 145, .06);
	    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
	    cursor: pointer;
	}
    .byh-material-cover::after {
      content: "";
      position: absolute;
      left: 7px;
      right: 6px;
      bottom: 8px;
      height: 2px;
      border-radius: 3px;
      background: currentColor;
      opacity: .18;
      box-shadow: 0 -7px 0 currentColor, 0 -14px 0 currentColor;
    }
    .byh-cover-kicker { display: block; font-size: 7px; font-weight: 800; letter-spacing: .5px; opacity: .72; }
    .byh-cover-title { display: block; margin-top: 7px; font-size: 10px; line-height: 1.35; font-weight: 900; }
    .byh-cover-year { position: absolute; left: 8px; bottom: 8px; font-size: 7px; font-weight: 700; opacity: .72; }
    .byh-cover-blue { background: linear-gradient(145deg,#f5f8ff 0%,#dce9ff 65%,#c4d8fb 100%); color: #255d9c; }
    .byh-cover-purple { background: linear-gradient(145deg,#f7f5ff 0%,#dfd8ff 65%,#c6b9fa 100%); color: #5a47a0; }
    .byh-cover-mint { background: linear-gradient(145deg,#f2fffc 0%,#ccefe8 65%,#a8ded4 100%); color: #20796e; }
    .byh-cover-navy { background: linear-gradient(145deg,#244f9b 0%,#0f2d6d 65%,#061b46 100%); color: #ffffff; }
    .byh-cover-gray { background: linear-gradient(145deg,#ffffff 0%,#e8edf4 62%,#d4dbe5 100%); color: #445267; }

    .byh-material-info { min-width: 0; align-self: stretch; padding-top: 4px; }
    .byh-material-info h3 {
      margin: 0;
      color: #172033;
      font-size: 16px;
      line-height: 1.38;
      font-weight: 760;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      overflow: hidden;
    }
    .byh-material-tags {
      margin-top: 10px;
      display: flex;
      flex-wrap: nowrap;
      gap: 6px;
      overflow: hidden;
    }
    .byh-material-tags span {
      flex: 0 0 auto;
      padding: 4px 4px;
      border-radius: 999px;
      background: #edf4ff;
      color: #4c76bd;
      font-size: 11px;
      line-height: 1;
      white-space: nowrap;
    }
    .byh-material-meta {
      height: 34px;
      border-top: 1px solid #e8edf5;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 0 13px;
      color: #708098;
      font-size: 11px;
      background: rgba(250,252,255,.82);
    }
    .byh-material-meta span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
    .byh-pdf-icon {
      width: 14px;
      height: 14px;
      border-radius: 3px;
      display: inline-grid;
      place-items: center;
      background: #f04438;
      color: #fff;
      font-size: 8px;
      font-weight: 800;
      line-height: 1;
    }
    .byh-download-icon { width: 13px; height: 13px; flex: none; }
  .byh-material-card:hover {
      transform: translateY(-3px);
      border-color: #a9c8fb;
      box-shadow: 0 14px 28px rgba(31,92,171,.12);
    }
.page02 {
    width: 1200px;
    margin: 40px auto 0;
}
.page02 h2 {
    font-size: 26px;
    font-weight: bold;
    color: rgba(19, 22, 27, 1);
}
.page02 .page02_cont {
    float: left;
    width: 366px;
    height: 271px;
    margin-right: 40px;
    margin-top: 30px;
}
.page02 .page02_cont .page02_cont_tit {
    border-bottom: 1px solid rgba(229, 229, 229, 1);
    height: 30px;
    margin-bottom: 10px;
}
.page02 .page02_cont .page02_cont_tit h3 {
    color: rgba(64, 158, 255, 1);
    font-size: 18px;
    font-weight: bold;
    float: left;
    line-height: 22px;
    position: relative;
}
.page02 .page02_cont .page02_cont_tit h3::after {
    background: rgba(64, 158, 255, 1);
    width: 74px;
    content: '';
    bottom: -9px;
    left: 0;
    height: 2px;
    position: absolute;
}
.page02 .page02_cont .page02_cont_tit h4 {
    float: right;
}
.page02 .page02_cont .page02_cont_tit h4 a {
    color: rgba(151, 151, 151, 1);
    font-size: 14px;
    line-height: 22px;
    padding-right: 8px;
    cursor: pointer;
    position: relative;
}
.page02 .page02_cont .page02_cont_tit h4 a:after {
    position: absolute;
    right: -2px;
    top: 4px;
    content: '';
    width: 6px;
    height: 12px;
    background: url(../images/page01_2.png) no-repeat center;
    background-size: 100%;
}
.page02 .page02_cont:nth-child(4), .page02_cont:nth-child(7) {
    margin-right: 0;
}
.page02_cont:nth-child(7) .page02_cont_tit h3::after {
    width: 96px;
}
.page02_cont ul li {
    position: relative;
    margin-top: 3px;
}
.page02_cont ul li a {
    color: rgba(19, 22, 27, 1);
    font-size: 16px;
    line-height: 30px;
    margin-left: 14px;
    max-width: 350px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}
.page02_cont ul li a:hover {
    color: #409eff;
}
.page02_cont ul li:after {
    position: absolute;
    left: 0px;
    top: 12px;
    content: '';
    background: url(../images/page02_1.png) no-repeat center;
    background-size: 100%;
    width: 7px;
    height: 9px;
}
.page03 {
    width: 1200px;
    margin: 40px auto 0;
}
.page03 ul li {
    float: left;
    width: 226px;
    height: 80px;
    margin-right: 14px;
    cursor: pointer;
    transition: all .4s;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.page03 ul li img {
    width: 226px;
    height: 80px;
}
.page03 ul li:hover {
    transform: scale(1.1);
}
.page03 ul li:nth-child(5) {
    margin-right: 0;
}
.page04 .box3 {
    margin: 40px auto 0;
    width: 1200px;
}
.page04 h2 {
    color: rgba(19, 22, 27, 1);
    font-size: 26px;
    font-weight: bold;
    line-height: 26px;
    margin-bottom: 20px;
}
.page04 .box3 .top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.page04 .box3 .top .t_l {
    display: flex;
    align-items: center;
}
.page04 .box3 .top .t_l img {
    width: 42px;
    height: 42px;
}
.page04 .box3 .top .t_l p {
    margin-left: 12px;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 700;
    font-size: 24px;
    color: #333333;
}
.page04 .box3 .top .t_r {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 16px;
    color: #999999;
}
.page04 .box3 .bold {
    margin-top: 28px;
    width: 100%;
    height: 2px;
    background-color: #aca8ff;
}
.page04 .box3 .list_box {
    margin-top: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.page04 .box3 .list_box .list .tit {
    text-align: center;
    line-height: 48px;
}
.page04 .box3 .list_box .list ul {
    padding: 8px 16px 0;
}
.page04 .box3 .list_box .list ul li {
    margin-top: 12px;
}
.page04 .box3 .list_box .list ul li a {
    display: flex;
    align-items: center;
    height: 32px;
}
.page04 .box3 .list_box .list ul li a .icon {
    width: 20px;
    height: 20px;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 700;
    font-size: 14px;
    color: #999999;
    text-align: center;
    line-height: 20px;
}
.page04 .box3 .list_box .list ul li a .icon img {
    width: 20px;
    height: 20px;
}
.page04 .box3 .list_box .list ul li a .zi {
    margin-left: 8px;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    width: 322px;
    overflow: hidden;
    /* 隐藏溢出的内容 */
    white-space: nowrap;
    text-overflow: ellipsis;
    /* 显示省略号 */
}
.page04 .box3 .list_box .list ul li:hover a .zi {
    color: #409eff;
}
.page04 .box3 .list_box .list:nth-child(1) .tit {
    background-image: url(../images/page04_1.png);
    width: 386px;
    height: 48px;
    background-size: 100% 100%;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 700;
    font-size: 18px;
    color: #002e93;
}
.page04 .box3 .list_box .list:nth-child(1) ul {
    width: 386px;
    height: 380px;
    background: #ffffff;
    border: 1px solid #f0f0f0;
    border-radius: 0 0 10px 10px;
}
.page04 .box3 .list_box .list:nth-child(2) .tit {
    background-image: url(../images/page04_2.png);
    width: 386px;
    height: 48px;
    background-size: 100% 100%;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 700;
    font-size: 18px;
    color: #014c32;
}
.page04 .box3 .list_box .list:nth-child(2) ul {
    width: 386px;
    height: 380px;
    background: #ffffff;
    border: 1px solid #f0f0f0;
    border-radius: 0 0 10px 10px;
}
.page04 .box3 .list_box .list:nth-child(3) .tit {
    background-image: url(../images/page04_3.png);
    width: 386px;
    height: 48px;
    background-size: 100% 100%;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 700;
    font-size: 18px;
    color: #725000;
}
.page04 .box3 .list_box .list:nth-child(3) ul {
    width: 386px;
    height: 380px;
    background: #ffffff;
    border: 1px solid #f0f0f0;
    border-radius: 0 0 10px 10px;
}
.page05 {
    background: rgba(246, 248, 254, 1);
    height: 760px;
    margin-top: 40px;
    padding-top: 1px;
}
.page05 .page05_cont {
    width: 1200px;
    margin: 40px auto 0;
}
.page05 h2 {
    color: rgba(19, 22, 27, 1);
    font-size: 26px;
    line-height: 26px;
    font-weight: bold;
    border-radius: 4px;
}
.page05_cont_left {
    float: left;
}
.page05_cont_left_cont {
    background: rgba(255, 255, 255, 1);
    width: 790px;
    height: 614px;
    float: left;
    margin-top: 30px;
    border-radius: 4px;
}
.page05_cont_left_cont ul li {
    width: 748px;
    height: 106px;
    margin: 15px auto 0;
    border-bottom: 1px solid rgba(240, 240, 240, 1);
    cursor: pointer;
    overflow: hidden;
}
.page05_cont_left_cont ul li ol {
    border-radius: 4px;
}
.page05_cont_left_cont ul li ol img {
    cursor: pointer;
    transition: all 0.4s;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    cursor: pointer;
    position: relative;
}
.page05_cont_left_cont ul li img:hover {
    transform: scale(1.1);
}
.page05_cont_left_cont ul li:hover h3 {
    color: #409eff;
}
.page05_cont_left_cont ul li:hover h3 strong{
    color: #409eff;
}
.page05_cont_left_cont ul li:last-child {
    border: none;
}
.page05_cont_left_cont ul li ol {
    float: left;
}
.page05_cont_left_cont ul li h3 {
    float: left;
    margin-left: 15px;
    color: rgba(19, 22, 27, 1);
    line-height: 26px;
    font-size: 18px;
    font-weight: bold;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 430px;
}
.page05_cont_left_cont ul li strong {
    float: left;
    margin-left: 15px;
    color: rgba(19, 22, 27, 1);
    line-height: 26px;
    font-size: 18px;
    font-weight: bold;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 430px;
}
.page05_cont_left_cont ul li .time {
    float: right;
    font-size: 16px;
    color: #69798C;
    line-height: 29px;
}
.page05_cont_left_cont ul li p {
    float: left;
    margin-left: 15px;
    width: 560px;
    font-size: 14px;
    color: rgba(96, 101, 110, 1);
    line-height: 26px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    word-break: break-all;
}
.page05_cont_right {
    float: right;
}
.page05_cont_right_cont {
    margin-top: 30px;
    background-color: rgba(255, 255, 255, 1);
    width: 380px;
    height: 614px;
    padding-top: 1px;
    border-radius: 4px;
}
.page05_cont_right_cont ul li {
    width: 348px;
    margin: 10px auto 0px;
    height: 90px;
    position: relative;
}
.page05_cont_right_cont ul li:after {
    width: 348px;
    content: '';
    height: 1px;
    background: rgba(240, 240, 240, 1);
    position: absolute;
    bottom: 4px;
    left: 0;
}
.page05_cont_right_cont ul li:hover h3 {
    color: #409eff;
}
.page05_cont_right_cont ul li:hover strong {
    color: #409eff;
}
.page05_cont_right_cont ul li:last-child:after {
    display: none;
}
.page05_cont_right_cont ul li h3 {
    color: rgba(19, 22, 27, 1);
    font-size: 16px;
    line-height: 22px;
    font-weight: 500;
    width: 348px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}
.page05_cont_right_cont ul li strong{
	color: rgba(19, 22, 27, 1);
	font-size: 16px;
	line-height: 22px;
	font-weight: 500;
	width: 348px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: inline-block;
}
.page05_cont_right_cont ul li p {
    color: rgba(96, 101, 110, 1);
    font-size: 14px;
    line-height: 23px;
    font-weight: 400;
    width: 348px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    word-break: break-all;
}
.footer {
    background: url(../images/footers.png) no-repeat center;
    height: 160px;
    padding-top: 1px;
}
.footer_wrap {
    display: flex;
    align-items: center;
    width: 500px;
    float: left;
    height: 88px;
}
.footer_left img {
    width: 65px;
    height: auto;
    margin-right: 20px;
    vertical-align: middle;
    position: relative;
    top: -19px;
}
.footer_text {
    display: inline-block;
    vertical-align: middle;
}
.footer_text h2 {
    font-size: 28px;
    font-weight: 900;
    color: #fff;
    display: inline-block;
    line-height: 1;
    font-family: "Microsoft YaHei", "黑体", sans-serif;
}
.year_tag {
    display: inline-block;
    background-color: #409eff;
    color: #ffffff;
    font-size: 10px;
    font-weight: 500;
    padding: 0px 10px;
    border-radius: 18px 18px 18px 0;
    margin-left: 5px;
    vertical-align: middle;
    margin-bottom: 4px;
}
.footer_text h3 {
    font-size: 12px;
    color: #fff;
    font-weight: normal;
    margin-top: 5px;
    letter-spacing: 4px;
    font-family: "Microsoft YaHei", sans-serif;
}
.footer_cont {
    width: 1200px;
    margin: 10px auto 0;
}
.footer_wrap p {
    font-size: 12px;
    font-weight: 400;
    line-height: 24px;
    color: #fff;
    margin-top: 20px;
    float: left;
}
.footer_right {
    float: right;
}
.footer_right img {
    margin-bottom: 10px;
}
.footer_right p {
    font-size: 12px;
    line-height: 24px;
    color: #fff;
}


.friend-links {
    width: 1200px;
    margin: 26px auto 14px;
    background: #fff;
    border-radius: 4px;
    padding: 14px 22px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    box-shadow: 0 4px 18px rgba(31, 76, 130, 0.06);
}

.friend-links-title {
    font-size: 15px;
    font-weight: 700;
    color: #222;
    padding-right: 24px;
    margin-right: 24px;
    border-right: 1px solid #edf0f5;
    white-space: nowrap;
}

.friend-links-list {
    display: flex;
    align-items: center;
    flex: 1;
    overflow: hidden;
}

.friend-links-list a {
    position: relative;
    padding: 0 22px;
    font-size: 14px;
    color: #5b6472;
    text-decoration: none;
    transition: all .2s ease;
    white-space: nowrap;
}

.friend-links-list a::after {
    content: "";
    position: absolute;
    right: 0;
    top: 4px;
    width: 1px;
    height: 14px;
    background: #edf0f5;
}

.friend-links-list a:last-child::after {
    display: none;
}

.friend-links-list a:hover {
    color: #1677ff;
}

.friend-links-more {
    margin-left: 18px;
    font-size: 14px;
    color: #1677ff;
    text-decoration: none;
    white-space: nowrap;
}

.friend-links-more i {
    font-style: normal;
    margin-left: 4px;
    font-size: 12px;
}

.hook-exit {
    margin-top: 30px;
    font-family: 'Microsoft YaHei', Arial, Helvetica, sans-serif;
    font-size: 14px;
}

 body.modal-open { overflow: hidden; }

    .mini-modal-overlay {
      position: fixed;
      inset: 0;
      z-index: 200;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background: rgba(17, 30, 49, .68);
      backdrop-filter: blur(4px);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity .22s ease, visibility .22s ease;
    }

    .mini-modal-overlay.show {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }

    .mini-modal {
      position: relative;
      width: 730px;
      max-width: calc(100vw - 36px);
      max-height: calc(100vh - 34px);
      overflow: auto;
      border: 1px solid rgba(218, 227, 240, .98);
      border-radius: 22px;
      background:
        radial-gradient(circle at 12% 12%, rgba(233,244,255,.65), transparent 25%),
        #fff;
      box-shadow: 0 34px 100px rgba(4, 19, 43, .38);
      transform: translateY(18px) scale(.97);
      transition: transform .24s ease;
      outline: none;
    }

    .mini-modal-overlay.show .mini-modal {
      transform: translateY(0) scale(1);
    }

    .mini-modal-close {
      position: absolute;
      right: 18px;
      top: 16px;
      z-index: 5;
      width: 38px;
      height: 38px;
      border: 0;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: #8290a4;
      background: transparent;
      cursor: pointer;
      transition: .18s ease;
    }

    .mini-modal-close:hover {
      color: #1b67ef;
      background: #edf5ff;
      transform: rotate(7deg);
    }

    .mini-modal-content {
      padding: 38px 36px 30px;
      text-align: center;
    }

    .mini-modal-title {
      margin: 0;
      color: #101828;
      font-size: 27px;
      line-height: 1.35;
      font-weight: 850;
      letter-spacing: .2px;
    }

    .mini-modal-desc {
      margin: 8px 0 18px;
      color: #8a98ab;
      font-size: 15px;
      line-height: 1.65;
    }

    .mini-modal-main {
      display: grid;
      grid-template-columns: 250px minmax(0, 1fr);
      align-items: center;
      justify-content: center;
      gap: 54px;
      min-height: 416px;
      margin: 0 auto;
    }

    /* 手机预览 */
    .phone-preview {
     
      position: relative;
    }

 

    .phone-screen {
      width: 100%;
      height: 100%;
      border-radius: 32px;
      overflow: hidden;
      background: linear-gradient(180deg, #f7fbff, #eef5ff 63%, #fff);
      position: relative;
      text-align: left;
    }

    .phone-status {
      height: 33px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 13px;
      color: #111827;
      font-size: 9px;
      font-weight: 750;
    }

    .phone-status-icons { letter-spacing: 1px; }

    .phone-nav {
      height: 32px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 12px;
      color: #111827;
      background: rgba(255,255,255,.82);
      border-bottom: 1px solid #edf1f6;
      font-size: 10px;
      font-weight: 750;
    }

    .phone-nav-title { margin-left: 18px; }
    .phone-nav-actions { letter-spacing: 4px; font-weight: 900; }

    .phone-body { padding: 13px 13px 12px; }
    .phone-kicker { color: #162033; font-size: 17px; line-height: 1.1; font-weight: 850; }
    .phone-question { color: #1769f6; font-size: 18px; line-height: 1.25; font-weight: 900; }

    .phone-badges {
      display: flex;
      gap: 7px;
      margin-top: 10px;
      color: #5c6b80;
      font-size: 7px;
      font-weight: 650;
    }

    .phone-badges span { display: inline-flex; align-items: center; gap: 3px; }
    .phone-badges i {
      width: 10px; height: 10px; border: 2px solid #2c7cf4; border-radius: 50%;
      display: inline-grid; place-items: center; color: #2c7cf4; font-size: 6px; font-style: normal;
    }

    .phone-feature-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 8px;
      margin-top: 13px;
    }

    .phone-feature {
      min-height: 61px;
      padding: 9px 8px;
      border-radius: 9px;
      background: #fff;
      box-shadow: 0 6px 14px rgba(39, 89, 153, .07);
      display: grid;
      grid-template-columns: 25px 1fr;
      gap: 7px;
      align-items: center;
    }

    .phone-feature-icon {
      width: 25px;
      height: 25px;
      border-radius: 7px;
      display: grid;
      place-items: center;
      color: #1769f6;
      background: #edf5ff;
    }

    .phone-feature strong { display: block; color: #172033; font-size: 8px; }
    .phone-feature small { display: block; margin-top: 3px; color: #8793a5; font-size: 6.5px; line-height: 1.35; }

    .phone-flow {
      margin-top: 12px;
      padding: 11px 10px 9px;
      border-radius: 11px;
      background: #fff;
      box-shadow: 0 7px 18px rgba(39, 89, 153, .06);
    }

    .phone-flow-title { color: #172033; font-size: 9px; font-weight: 800; }
    .phone-flow-list {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 7px;
      margin-top: 11px;
      text-align: center;
    }

    .phone-flow-step { position: relative; color: #69778d; font-size: 6.5px; }
    .phone-flow-step:not(:last-child)::after {
      content: "›";
      position: absolute;
      right: -7px;
      top: 8px;
      color: #9db6db;
      font-size: 14px;
    }

    .phone-flow-step i {
      width: 31px;
      height: 31px;
      margin: 0 auto 5px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: #397df0;
      background: #edf5ff;
      font-style: normal;
      font-size: 14px;
    }

    .phone-flow-step strong { display: block; color: #25334a; font-size: 7px; }
    .phone-preview img{
	width: 193px;
	    margin-left: 72px;
	}
    /* 二维码区域 */
    .qr-panel {
      min-width: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      position: relative;
    }

    .qr-rings {
      position: absolute;
      width: 310px;
      height: 310px;
      left: 50%;
      top: 60%;
      transform: translate(-50%, -50%);
      border-radius: 50%;
      background:
        radial-gradient(circle, transparent 0 37%, rgba(44,124,244,.10) 37.5% 38%, transparent 38.5% 47%, rgba(44,124,244,.09) 47.5% 48%, transparent 48.5% 57%, rgba(44,124,244,.08) 57.5% 58%, transparent 58.5% 67%, rgba(44,124,244,.07) 67.5% 68%, transparent 68.5%);
      pointer-events: none;
    }

    .scan-recommend {
      position: relative;
      z-index: 2;
      margin-bottom: 18px;
      padding: 10px 22px;
      border-radius: 6px;
      color: #fff;
      background: linear-gradient(135deg, #3184ff, #1769f6);
      box-shadow: 0 10px 24px rgba(23, 105, 246, .22);
      font-size: 14px;
      font-weight: 750;
    }

    .mini-code-wrap {
      position: relative;
      z-index: 2;
      width: 242px;
      padding: 10px;
      border: 4px solid #52a7ff;
      border-radius: 24px;
      background: #fff;
      box-shadow: 0 18px 38px rgba(24, 105, 224, .18);
    }

    .mini-code {
      position: relative;
      width: 214px;
      height: 214px;
      display: grid;
      place-items: center;
      overflow: hidden;
      border-radius: 12px;
      background: #fff;
    }

    .mini-code img{
		width: 160px;
	}
    .mini-modal-benefits {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 38px;
      margin-top: 12px;
    }

    .mini-benefit {
      min-height: 72px;
      padding: 13px 15px;
      border-radius: 9px;
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr);
      gap: 10px;
      align-items: center;
      text-align: left;
      background: linear-gradient(135deg, #f5f9ff, #eef5ff);
      border: 1px solid #edf2fa;
    }

    .mini-benefit-icon {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: #1769f6;
      background: #eaf3ff;
    }

    .mini-benefit strong { display: block; color: #172033; font-size: 14px; }
    .mini-benefit small { display: block; margin-top: 4px; color: #7b899e; font-size: 11px; line-height: 1.35; }

    .mini-modal-confirm {
      width: 510px;
      max-width: 100%;
      height: 58px;
      margin: 28px auto 0;
      border: 0;
      border-radius: 12px;
      color: #fff;
      background: linear-gradient(135deg, #ff8a00, #ff6d00);
      box-shadow: 0 13px 30px rgba(255, 122, 0, .24);
      font-size: 21px;
      font-weight: 850;
      cursor: pointer;
      transition: .18s ease;
    }

    .mini-modal-confirm:hover {
      transform: translateY(-1px);
      box-shadow: 0 16px 34px rgba(255, 122, 0, .3);
    }

    @media (max-width: 760px) {
      .mini-modal { width: 520px; }
      .mini-modal-content { padding: 34px 22px 25px; }
      .mini-modal-title { padding: 0 28px; font-size: 22px; }
      .mini-modal-main { grid-template-columns: 1fr; gap: 20px; min-height: auto; }
      .phone-preview { display: none; }
      .qr-panel { min-height: 330px; }
      .mini-modal-benefits { gap: 8px; }
      .mini-benefit { grid-template-columns: 1fr; text-align: center; padding: 11px 8px; }
      .mini-benefit-icon { margin: 0 auto; }
      .mini-benefit strong { font-size: 13px; }
      .mini-benefit small { font-size: 10px; }
    }

    @media (max-width: 520px) {
      .mini-modal-overlay { padding: 12px; }
      .mini-modal-content { padding: 30px 14px 20px; }
      .mini-modal-desc { font-size: 13px; }
      .mini-code-wrap { width: 224px; }
      .mini-code { width: 196px; height: 196px; }
      .mini-code > svg { width: 182px; height: 182px; }
      .mini-modal-benefits { grid-template-columns: 1fr; }
      .mini-benefit { grid-template-columns: 40px 1fr; text-align: left; }
      .mini-benefit-icon { margin: 0; width: 40px; height: 40px; }
      .mini-modal-confirm { height: 52px; margin-top: 18px; font-size: 18px; }
    }


    /* 小程序弹窗紧凑版：按常规桌面产品弹窗尺寸优化 */
    @media (min-width: 761px) {
      .mini-modal {
        width: 640px;
        max-height: calc(100vh - 48px);
        border-radius: 18px;
      }

      .mini-modal-close {
        right: 14px;
        top: 12px;
        width: 34px;
        height: 34px;
      }

      .mini-modal-content {
        padding: 28px 30px 24px;
      }

      .mini-modal-title {
        font-size: 23px;
        line-height: 1.3;
      }

      .mini-modal-desc {
        margin: 6px 0 12px;
        font-size: 13px;
      }

      .mini-modal-main {
        grid-template-columns: 190px minmax(0, 1fr);
        gap: 34px;
        min-height: 334px;
      }


    /* 小程序弹窗更小版：进一步压缩桌面弹窗尺寸 */
    @media (min-width: 761px) {
      .mini-modal {
        width: 560px;
        max-height: calc(100vh - 72px);
        border-radius: 16px;
      }

      .mini-modal-close {
        right: 10px;
        top: 9px;
        width: 32px;
        height: 32px;
      }

      .mini-modal-close svg {
        width: 20px;
        height: 20px;
      }

      .mini-modal-content {
        padding: 22px 24px 20px;
      }

      .mini-modal-title {
        padding: 0 26px;
        font-size: 20px;
        line-height: 1.3;
      }

      .mini-modal-desc {
        margin: 4px 0 8px;
        font-size: 12px;
        line-height: 1.5;
      }

      .mini-modal-main {
        grid-template-columns: 160px minmax(0, 1fr);
        gap: 24px;
        min-height: 278px;
      }

      .phone-preview {
        transform: scale(.65);
        transform-origin: center;
        margin: -73px -42px;
      }

      .qr-rings {
        width: 205px;
        height: 205px;
        top: 59%;
      }

      .scan-recommend {
        margin-bottom: 9px;
        padding: 7px 14px;
        border-radius: 5px;
        font-size: 11px;
      }

      .mini-code-wrap {
        width: 166px;
        padding: 7px;
        border-width: 3px;
        border-radius: 16px;
      }

      .mini-code {
        width: 146px;
        height: 146px;
        border-radius: 8px;
      }

      .mini-code > svg {
        width: 136px;
        height: 136px;
      }

      .mini-code-mark {
        width: 40px;
        height: 40px;
        border-width: 5px;
      }

      .mini-code-mark svg {
        width: 31px;
        height: 31px;
      }

      .mini-modal-benefits {
        gap: 10px;
        margin-top: 6px;
      }

      .mini-benefit {
        min-height: 52px;
        padding: 8px 9px;
        grid-template-columns: 30px minmax(0, 1fr);
        gap: 7px;
        border-radius: 7px;
      }

      .mini-benefit-icon {
        width: 30px;
        height: 30px;
      }

      .mini-benefit-icon svg {
        width: 17px;
        height: 17px;
      }

      .mini-benefit strong {
        font-size: 11px;
      }

      .mini-benefit small {
        margin-top: 1px;
        font-size: 8px;
        line-height: 1.25;
      }

      .mini-modal-confirm {
        width: 380px;
        height: 44px;
        margin-top: 15px;
        border-radius: 9px;
        font-size: 15px;
      }
    }