.banner_comparison_container {position: relative; width: 600px; height: 450px; margin: 0 auto; border-radius: var(--radius-15); overflow: hidden;box-shadow: 0 5px 10px var(--bgblack-1); cursor: ew-resize; user-select: none;}
.banner_image_container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; }
.banner_old_image, .banner_new_image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.banner_old_image { z-index: 1; }
.banner_new_image { z-index: 2; }
.banner_divider { position: absolute; top: 0; left: 0; width: 2px; height: 100%; background: var(--bgwhite-9); z-index: 3; pointer-events: none; }
.banner_handle {position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%); width: 50px; height: 50px;border-radius: 50%; cursor: grab; z-index: 4; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);background:url('../images/icon_drag_0.png') no-repeat center center; background-size:100% 100%;}

.ai_btn_main{background: var(--ecolor); color: var(--bgwhite-10); font-size: var(--f16); border-radius: var(--radius-10); padding: 15px 50px; border: none; margin:0 auto;}
.ai_btn_main:hover{background: var(--gcolor);}
a.ai_btn_main{color: var(--bgwhite-10);}
.ai_select_main{padding: 5px 10px; font-size: var(--f16); border-radius: var(--radius-5); border: 2px solid var(--bgblack-3);}
.ai_select_main:hover{border: 2px solid var(--ecolor);}
.pages_container{width: calc(100% - 300px); margin: 0 auto 0 300px; padding: 20px 50px; box-sizing: border-box}
.panel_box_main{width: 860px; margin:0 auto;}

.panel_box_hd{text-align: center; position: relative; padding: 25px 10px;}
.panel_box_hd > h3{font-size: var(--f32); font-family: fontBold; color: var(--acolor); padding: 5px 0;}
.panel_box_hd > p{margin:0 auto; line-height: 1.345; padding: 10px 0; color: var(--fcolor);}
.panel_box_bd1{background: var(--bgwhite-10); border-radius: var(--radius-10); box-sizing: border-box; padding: 25px; text-align: center;}
.panel_box_bd1 .intro_image{width: 70%; margin:0 auto;}
.panel_box_bd1 .intro_image img{display: block; width: 100%; height:auto; margin: 0 auto;}
.intro_btn_box{padding: 25px 0 20px 0;}
.intro_btn_box > h4{font-size: var(--f20); color: var(--ecolor); display: block; padding: 10px 0 20px 0;}
.intro_btn_box > label{width:100%; display: flex; align-items: center; flex-wrap: wrap; text-align: center; box-sizing: border-box;}
.label_dom_l{margin: 0;}
.label_dom_r{margin:0 0 0 auto;}

.panel_box_bd2{margin:0 auto; box-sizing: border-box; padding: 25px 10px;}
.panel_box_bd2 .bddl{text-align: left;}
.panel_box_bd2 .bddl dt{font-family: fontBold; padding: 5px 0;}
.panel_box_bd2 .bddl dd{font-size: var(--f14);}
.panel_box_bd2 .bddl dd .dditem{padding:5px 0; width: 100%; display:flex; align-items: center;}
.panel_box_bd2 .bddl dd .dditem i{border: 1px solid var(--ecolor); width:20px; height:20px; line-height: 20px; overflow: hidden; border-radius:100%; color: var(--ecolor); text-align: center; margin:0 5px 0 0;}

/* 上传功能区域核心样式 */
.uploaded_container {
text-align: center;
padding: 20px;
border: 2px dashed #ddd;
border-radius: var(--radius-10);
margin: 10px auto;
position: relative;
}
.uploaded_progress_container {
display: none;
position: absolute;
width: 100%;
height: 100%;
background: var(--bgblack-5);
left:0;
top:0;
border-radius: var(--radius-10);
}
.uploaded_progress_container .full_div{width: 100%; height: 100%; display: flex; align-items: center;}
.uploaded_progress_container .full_div > div{width:50%; margin:0 auto; color: var(--bgwhite-10);}
.uploaded_progress_container .full_div > div h4{padding: 10px 0; font-size: var(--f16); font-weight: normal;}
.uploaded_progress_container .full_div > div p{padding: 15px 0; font-size: var(--f14); font-family: fontLight;}
.uploaded_progress_container .full_div > div h6{padding: 10px 0;}
.uploaded_progress_bar {
width: 100%;
height: 12px;
background-color: var(--bgwhite-5);
border-radius: var(--radius-10);
overflow: hidden;
}
.uploaded_progress_fill {
height: 100%;
background-color: var(--bgwhite-10);
width: 0%;
transition: width 0.3s ease;
}
.uploaded_result_container {
display: none;
text-align: center;
}
.uploaded_image {
width:100%;
max-width: 700px;
max-height: 500px;
margin: 0 auto 20px auto;
border-radius: var(--radius-10);
object-fit: cover;
display: block;
}
.uploaded_grid {display: flex; justify-content: center; gap: 20px;}
.uploaded_box {text-align: center; }
.uploaded_box > h4{height:40px; overflow:hidden; line-height: 40px; color: var(--ecolor); font-family: fontDefault;}
.uploaded_placeholder {background: #F1ECFF; width: 280px; height: 280px; display: flex; align-items: center; justify-content: center; border-radius: var(--radius-10); cursor: pointer; position: relative; overflow: hidden; text-align: center;}
.uploaded_placeholder p{padding: 10px 0; font-family: fontLight;}
.uploaded_preview_image {width: 100%; height: 100%; object-fit: cover; }
.uploaded_textarea {
width:100%;
height:calc(100% - 40px);
padding: 10px;
border: 2px solid var(--bgblack-1);
border-radius: var(--radius-10);
resize: none;
box-sizing: border-box;
font-size: var(--f14);
}

.membership_body{background: #020316 url('../images/membership_body.jpg') no-repeat center 100px; background-size: 100% auto;}
.membership_main{padding: 50px 0 100px 0;}
.membership_main .mhd{text-align: center;}
.membership_main .mhd i{padding: 10px 0;}
.membership_main .mhd i img{display: block; width: 120px; height:auto; margin: 0 auto;}
.membership_main .mhd h3{font-size: var(--f30); text-transform: none; background: linear-gradient(90deg, #FFBE3F 0%, #FEFAF1 100%);background-clip: text;color: transparent; font-family: fontBold; padding: 25px 0 20px 0; font-style: italic;}
.membership_main .mhd p{color: var(--bgwhite-5);}
.membership_main .mbd{padding: 50px 0;}
.membership_main_ul{width: 100%; display: flex; flex-wrap: wrap;}
.membership_main_ul > li{width: 32%; margin:0 2% 0 0; box-sizing: border-box; padding: 15px; border-radius: var(--radius-15); background: var(--bgwhite-9); position: relative;}
.membership_main_ul > li:nth-child(3n){margin: 0 0 0 auto;}
.membership_main_ul > li:first-child{background: linear-gradient(90deg, #FFF5E6 0%, #FFD4A9 100%);}
.membership_main_ul > li > .lihd{width:100%; height: 140px; display: flex; align-items: center;}
.membership_main_ul > li > .lihd > div{width: 100%; text-align: center;}
.membership_main_ul > li > .lihd > div h4{font-size: var(--f16); line-height: 1.123; color: var(--acolor);}
.membership_main_ul > li > .lihd > div h3{color: var(--ecolor); font-size: var(--f30); padding: 10px 0; font-family: fontBold;}
.membership_main_ul > li > .libd{height: 180px;}
.membership_main_ul > li > .libd > ul{}
.membership_main_ul > li > .libd > ul li{width:100%; display:flex; align-items: center; flex-wrap: wrap; padding: 5px 0; text-align: left; color: var(--ecolor);}
.membership_main_ul > li > .libd > ul li i{width: 18px; height:18px; background: url('../images/membership_icon_arrow2.png') no-repeat center center; background-size: 100% auto; margin-right: 1px;}
.membership_main_ul > li > .lifd{text-align: left;}
.membership_main_ul > li > .lifd > div{width: 100%; display: flex; flex-wrap: wrap; align-items: center; color: #F73B96; font-size: var(--f14); padding: 5px 10px 10px 10px; line-height: 1.123; box-sizing: border-box;}
.membership_main_ul > li > .lifd > div i{width:20px; margin: 0; font-size: var(--f20);}
.membership_main_ul > li > .lifd > div span{width: calc(100% - 30px); margin: 0 0 0 auto; font-family: fontMedium;}
.membership_main_ul > li > .lifd > label{display: block; padding: 15px 0 5px 0;}
.membership_main_ul > li > .lifd > label a{display: block; text-align: center; background: var(--ecolor); color: var(--bgwhite-10); font-size: var(--f16); border-radius: var(--radius-10); padding: 15px 40px; border: none; font-family: fontMedium;}
.membership_main_ul > li > .lifd > label a:hover{background: var(--gcolor);}
.membership_main_ul > li:first-child > .lihd > div h3{color: var(--dcolor);}
.membership_main_ul > li:first-child > .libd > ul li{color: var(--dcolor);}
.membership_main_ul > li:first-child > .libd > ul li i{background: url('../images/membership_icon_arrow1.png') no-repeat center center; background-size: 100% auto;}
.membership_main_ul > li:first-child > .lifd > label a,.membership_main_ul > li:first-child > .lifd > label a:hover{background: var(--dcolor);}

.member_box_main{width: 90%; margin:0 auto;}

@media screen and (max-width: 1240px) {
	.pages_container{width: calc(100% - 280px); margin: 0 auto 0 280px; padding: 15px 40px; box-sizing: border-box}
	.panel_box_main{width: 96%; margin:0 auto;}
	
}
@media screen and (max-width: 1024px) {
	.pages_container{width: 100%; margin: 0 auto; padding: 5px; box-sizing: border-box}
	.banner_comparison_container {width: 100%; min-width:300px; max-width: 600px; height: 280px; border-radius: var(--radius-10);}
	.panel_box_hd{padding: 20px 5px 15px 5px;}
	.panel_box_hd > h3{font-size: var(--f24);}
	.panel_box_hd > p{font-size:var(--f14);margin:0 auto; padding: 5px 0;}
	.panel_box_bd1{padding: 15px;}
	.panel_box_bd1 .intro_image{width: 100%;}
	.intro_btn_box{padding: 15px 0 10px 0;}
	.intro_btn_box > h4{font-size: var(--f16); color: var(--ecolor); display: block; padding: 10px 0 15px 0;}
	.intro_btn_box > label{padding: 0 15px;}

	.panel_box_bd1{padding: 15px;}
	.panel_box_bd2{padding: 15px 10px;}
	.panel_box_bd2 .bddl dd{font-size: var(--f12); line-height: 1.123;}
	
	.ai_btn_main{font-size: var(--f14); padding: 12px 30px;}
	.ai_select_main{padding: 5px; font-size: var(--f14);}
	
	.uploaded_container {padding: 0 0 20px 0; margin: 10px auto;}
	.uploaded_progress_container .full_div > div{width:80%;}
	.uploaded_progress_container .full_div > div h4{padding: 5px 0; font-size: var(--f14);}
	.uploaded_progress_container .full_div > div p{padding: 10px 0; font-size: var(--f12);}
	.uploaded_progress_container .full_div > div h6{padding: 5px 0;}
	.uploaded_image {max-width: 600px;max-height: 300px;}
	.uploaded_grid {flex-wrap: wrap; gap: 10px;}
	.uploaded_box > h4{font-size: var(--f14);}
	.uploaded_placeholder {width: 240px; height: 180px;}
	.uploaded_placeholder p{padding: 10px 0; font-size: var(--f12);}
	.uploaded_textarea {width:240px;height:120px;padding: 10px;font-size: var(--f12);}
	
	.membership_body{background: #020316 url('../images/membership_body.jpg') no-repeat center 60px; background-size: 100% auto;}
	.membership_main{padding: 40px 0;}
	.membership_main .mhd i img{width: 100px;}
	.membership_main .mhd h3{font-size: var(--f20); }
	.membership_main .mhd p{font-size: var(--f14); padding: 0 10px;}
	.membership_main .mbd{padding: 30px 0 0 0;}
	.membership_main_ul{width: 100%; display: flex; flex-wrap: wrap;}
	.membership_main_ul > li{width: 100%; margin:10px auto; padding: 15px; border-radius: var(--radius-10);}
	.membership_main_ul > li:nth-child(3n){margin: 10px auto;}

}

.list_pagination {
width:100%;
display: flex;
justify-content: center;
align-items: center;
padding: 10px 0 5px 0;
}
.list_pagination a {
display: inline-block;
width:28px;
height: 28px;
text-align: center;
line-height: 28px;
margin: 0 5px;
font-size: var(--f14);
text-decoration: none;
color: var(--ccolor);
background-color: var(--bgblack-1);
border-radius: 100%;
}
.list_pagination a.active,.list_pagination a:hover {
background: var(--ecolor);
color: var(--dcolor);
}