body,p,div{ margin: 0; font-size: 14px; font-family: MicrosoftYaHeiUI; } @media screen and (min-width:1200px) and (max-width:1440px){ .right_back{ /* right: calc((100% - 1680px) / 2); */ } } .point{ cursor: pointer; } .flex{ display: flex; } .ft12{ font-size: 12px; } .ft14{ font-size: 14px; } .ft16{ font-size: 16px; } .ft18{ font-size: 18px; } .center{ display: flex; justify-content: center; align-items: center; text-align: center; } .disNone,.hide{ display: none !important; opacity: 0; transition: all .3s ease; } .disBlock{ opacity: 1; transition: all .3s ease; display: block !important; } .kefu{ position: fixed; z-index: 88; right: 2px; bottom: 165px; width: 32px; padding: 8px 4px 13px; /* height: 116px; */ border-radius: 20px; opacity: 1; background: #FFFFFF; color: #3D3D3D; font-family: MicrosoftYaHeiUI; } .kefuCom{ position: relative; flex-direction: column; justify-self: center; align-items: center; } .kefuCom:hover .kefuQrcode{ opacity: 1; transition: all .5s ease; } .kefuCom .linkIcon{ width: 28px; height: 28px; margin-bottom: 5px; } .kefuCom .linkkf{ font-family: MicrosoftYaHeiUI; color: #3D3D3D; line-height: 16px; writing-mode: vertical-rl; } .kefuCom .kefuQrcode{ position: absolute; left: -161px; top: 0px; /* width: 150px; */ /* height: 194px; */ /* 自动布局 */ display: flex; flex-direction: column; align-items: center; padding: 8px; gap: 6px; border-radius: 6px; opacity: 0; background: #FFFFFF; box-shadow: 0px 4px 11px 0px rgba(56, 112, 243, 0.1); } .kefuQrcode img{ width: 134px; height: 134px; } .look_PPT_modal{ position: fixed; top: 0; left: 0; width: 100%; min-width: 1200px; height: 100%; z-index: 100; /* position: relative; */ } .lookPPT{ width: 100%; height: 100%; position: relative; } .lookPPT .look_backImg,.lookPPT .look_content{ width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; } .exitLook{ position: absolute; top: 0; left: 0; width: 80px; height: 80px; z-index: 125; } .lookPPT{ /* z-index: 110; */ } .look_content{ z-index: 110; background: rgba(0, 0, 0, 0.33); display: flex; } .look_left{ flex: 1; height: 100%; min-width: 837px; } .topimg{ width: 740px; height: 428px; border: 3.12px solid #FFFFFF; border-radius: 20.78px; } #gallery-container { overflow-x: auto; /* 允许横向滚动 */ width: calc(174*4px + 16*3px); overflow: hidden; position: relative; margin: 12px 11px 0; } .gallery{ display: flex; flex-wrap: nowrap; /* float: left; white-space: nowrap; */ } #gallery-container button{ } .gallery .gallery_img { width: 170px; height: 100px; margin-right: 16px; border: 2px solid #FFFFFF; border-radius: 6.14px; } .gallery .ppt_child_active { border: 2px solid #697CF7; } #prev, #next{ } /* #prev{ position: absolute; left: 0; top: 50%; transform: translateY(-50%); } #next{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); } */ .look_left .look_left_bot{ width: 100%; height: 84px; align-items: center; justify-content: center; background: #FFFFFF; /* 阴影/常规阴影 */ box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.16); } .ppt_cancel ,.ppt_submit{ display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 12.47px 24.94px; color: #2841EB; font-family: Microsoft YaHei UI; font-size: 15.58px; background: #EAEFFF; } .ppt_submit{ margin-left: 46px; color: #FFFFFF; background: linear-gradient(270deg, #6C69F5 0%, #3467E5 100%); } .look_left { display: flex; flex-direction: column; align-items: center; justify-content: center; } .look_left .look_left_top{ flex: 1; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; } .look_right{ width: 364px; min-width: 364px; max-width: 364px; max-height: 100%; padding: 32px 40px; overflow-y: auto; background: rgba(255, 255, 255, 0.9); } .look_right h4{ font-family: Microsoft YaHei UI; font-size: 16.62px; font-weight: bold; line-height: normal; letter-spacing: 0px; font-variation-settings: "opsz" auto; color: #3D3D3D; padding: 0; margin: 0; margin-bottom: 20px; } .look_right .ppt_temList{ gap:20px 18px; } .look_right .ppt_temList .ppt_tem_item{ width: 173px; } .look_right .ppt_tem_item .pptImg{ width: 169px; height: 97px; border-radius: 8.31px; } .look_right .ppt_tem_item:hover .pptImg{ border-radius: 8.31px; } .look_right .ppt_tem_item:hover .firstlook{ display: none; } .pageMask{ width: 100%; height: 100%; background: rgba(0,0,0,0.33); position: fixed; z-index: 100; left: 0; top: 0; } .lookModal{ /* width: 100%; height: 100%; background: url(../img/ppt_2.svg) center center no-repeat; background-size: 100% 100%; */ } .payModal{ position: fixed; width: 740px; background-color: #fff; left: 50%; top: 20%; z-index: 999; transform: translateX(-50%); border-radius: 16px; padding: 28px 36px 36px; /* display: flex; */ } .pay_header{ text-align: left; position: relative; font-size: 16px; font-weight: bold; } .pay_header .close_modal{ position: absolute; right: 0px; height: 20px; top: 0; } .payModal .pay_message{ display: flex; align-items: center; margin-top: 22px; color: #3D3D3D; } .payModal .pay_message span{ font-size: 16px; display: inline-block; margin-right: 10px; } .payModal .pay_message p{ margin-right: 39px; max-width: 170px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .payModal .pay_content{ display: flex; } .pay_content{ padding: 36px 0; border-top: 1px solid #CBD3DE; margin-top: 36px; } .pay_type{ display: flex; flex: 1; align-items: center; padding: 15px 0 20px 0; } .pay_left{ margin: 0 20px; } .pay_every{ width: 132px; height: 34px; /* 自动布局 */ display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 7px 10px; border-radius: 5px; opacity: 1; font-size: 12px; background: rgba(255, 255, 255, 0.5); box-sizing: border-box; border: 1px solid #CBD3DE; margin-bottom: 15px; cursor: pointer; } .pay_every.pay_active{ border: 1px solid #67C23A; } .pay_right{ padding-bottom: 24px; font-family: Microsoft YaHei UI; font-size: 14px; font-weight: normal; line-height: 18px; letter-spacing: 0px; font-variation-settings: "opsz" auto; color: #8C919D; } .pay_detail{ display: flex; align-items: center; flex-direction: column; padding-top: 36px; border-top: 1px solid #CBD3DE; margin-top: 36px; } .pay_succ_header{ font-family: Microsoft YaHei UI; font-size: 16px; font-weight: bold; line-height: 18px; letter-spacing: 0px; font-variation-settings: "opsz" auto; color: #3D3D3D; display: flex; align-items: center; width: 296px; justify-content: space-between; } .pay_succ_content { display: flex; width: 394px; height: 100px; padding: 19px 0; } .pay_succ_content #qrcode1{ width: 100px; height: 100px; margin-right: 36px; } .pay_succ_right{ display: flex; flex-direction: column; align-items: center; padding: 21px 0; } .pay_succ_right p{ font-family: Microsoft YaHei UI; font-size: 14px; font-weight: normal; line-height: 32px; letter-spacing: 0px; font-variation-settings: "opsz" auto; color: #3D3D3D; display: flex; align-items: center; } #pay_succ_tid{ color: #EE7000; margin-right: 13px; } #qrcode{ width: 140px; height: 140px; } .pay_opera_btn{ display: flex; align-items: center; width: 464px; justify-content: space-between; } .payresultBtn1,.payresultBtn2{ cursor: pointer; width: 200px; height: 50px; /* 自动布局 */ display: flex; font-size: 15px; color: #2841EB; flex-direction: column; justify-content: center; align-items: center; border-radius: 8px; opacity: 1; background: #EAEFFF; /* padding: 12px 24px; */ } .payresultBtn2{ background: linear-gradient(270deg, #6C69F5 0%, #3467E5 100%); color: #FFFFFF; } .pay_right p{ font-size: 12px; } .pay_right .pay_moneyNum{ color: #3D3D3D; font-size: 16px; margin-bottom: 15px; } .pay_moneyNum #totalMoney{ font-family: Microsoft YaHei UI; font-size: 30px; font-weight: bold; line-height: normal; letter-spacing: 0px; display: inline-block; margin-left: 0px; font-variation-settings: "opsz" auto; } .modal_mes{ display: flex; align-items: center; justify-content: center; padding: 8px 16px; border-radius: 6px; background: rgba(236, 133, 51, 0.12); } .big_container{ /* width: 100%; height: 100vh; */ min-width: 1200px; } header{ position: fixed; left: 0px; top: 0px; width: calc(100% - 56px); z-index: 99; min-width: 1144px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 14px 28px; opacity: 1; background-color: #ffffffb3; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); /* box-shadow: none; */ transition: background-color .3s ease; /* background: linear-gradient(90deg, rgba(243, 246, 254, 0) 0%, #F3F6FE 100%); */ background: rgba(255, 255, 255, 0.78); box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.04); } header .left{ display: flex; align-items: center; font-family: Alimama ShuHeiTi; font-size: 22px; font-weight: bold; line-height: normal; letter-spacing: 0px; font-variation-settings: "opsz" auto; background: linear-gradient(0deg, #000000, #000000), linear-gradient(90deg, #93B6F9 13%, #5D8CF0 75%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; } header .right{ display: flex; justify-content: flex-end; } header .right div{ width: 88px; height: 36px; text-align: center; line-height: 36px; margin-left: 24px; border-radius: 4px; font-family: Microsoft YaHei UI; color: #3D3D3D; font-size: 14px; } header .right div a{ text-decoration: none; color: #3D3D3D; } header .right .activebtn{ font-weight: bold; font-variation-settings: "opsz" auto; color: #5B6FF6; text-align: center; line-height: 36px; background: #F4F5FA; } .page{ width: 100%; padding-top: 64px; position: relative; /* display: flex; flex-direction: column; justify-content: center; */ /* height: 2000px; */ /* margin: 0 auto; */ } .left_back{ width: 300px; height: 454px; background: linear-gradient(90deg, rgb(250, 250, 250) 0%, rgba(250, 250, 250, 0) 100%); /* background: linear-gradient(90deg, #FAFAFA 0%, rgba(243, 246, 254, 0) 100%); */ position: absolute; top: 0; z-index: 24; left: calc((100% - 1920px) / 2); } .right_back{ width: 300px; height: 454px; position: absolute; top: 0; z-index: 24; right: calc((100% - 1920px) / 2); background: linear-gradient(-90deg, rgb(250, 250, 250) 0%, rgba(250, 250, 250, 0) 100%); /* background: linear-gradient(90deg, rgba(243, 246, 254, 0) 0%, #F3F6FE 100%); */ } .bottom_back{ width: 1276px; height: 58px; background: linear-gradient(0deg, #F3F6FE 0%, rgba(243, 246, 254, 0) 100%); } .topViedo{ position: relative; width: 1920px; left: 50%; top: 0; transform: translate(-50%); /* width: 100%; position: absolute; height: 454px; left: 0; top: 0; */ } .main_page_top{ position: relative; height: 454px; } .aa{ position: absolute !important; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden; background-color: rgb(250, 250, 250); /* background: var(--pc-background); background-color: var(--background-color); */ background-size: 1920px auto; background-position: center top; background-repeat: no-repeat; } .top_viedo{ position: absolute; left: 0; top: 0; width: 100%; /* height: 454px; */ /* background-color: rgb(250, 250, 250); */ } .top_viedo,.bottom_viedo{ /* width: 100%; */ } .bottom_viedo{ /* height: 100%; object-fit: cover; */ position: fixed; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; } .bottomViedo{ width: 100%; position: absolute; left: 0; top: 0px; height: 1380px; min-height: 800px; z-index: -1; overflow: hidden; } .main_page{ position: absolute; margin: 0 auto; width: 100%; min-width: 1200px; z-index: 66; top: 64px; } .main_content{ /* padding: 42px 129px; border-radius: 10px; background: rgba(255, 255, 255, 0.9); */ margin: 0 auto; margin-top: 82px; display: flex; flex-direction: column; align-items: center; /* min-width: 1004px; max-width: 1378px; */ /* background: url(); */ } .main_title_back{ background-color: transparent !important; /* padding: 0 !important; */ height: 168px; position: relative; } .main_content .step_back{ margin-bottom: 12px ; /* padding: 10px 0; */ width: 100%; background: rgba(255, 255, 255, 0.5); backdrop-filter: blur(10px); display: flex; justify-content: center; transition:all .7s; } .main_content .stickyStep{ position: sticky; top: 64px; opacity: 1; padding: 0; z-index: 9; background: rgba(255, 255, 255, 0.8); box-sizing: border-box; /* border-width: 0px 0px 1px 0px; border-style: solid; border-image: linear-gradient(270deg, rgba(114, 119, 244, 0) 8%, #7177F4 47%, rgba(117, 119, 245, 0) 89%) 0 0 1 0; backdrop-filter: blur(20px); */ transition:all .5s ease; } .stickyStep .step_main{ padding: 0 164px; transition: all .5s ease; } .stickyStep.step_back{ padding: 0 0; transition: all .5s ease; } .stickyStep .step_main dd{ font-size: 12px; transition: all .5s ease; line-height: 25px; } .stickyStep .step_main .active_step_title{ font-size: 14px; transition: all .5s ease; } .stickyStep .step_main .nor_step_title{ font-size: 14px; transition: all .5s ease; margin-bottom: 0; } .main_content .step_back .step_line{ min-width: 50px; max-width: 258px; margin: 0 44px; height: 0; margin-top: 27px; border: 0.5px solid #D8D8D8; } .main_title{ display: flex; flex-direction: column; text-align: left; min-width: 744px; max-width: 1118px; position: absolute; left: 0; top: 0; /* justify-content: center; */ /* align-items: center; */ } .main_title .title1 img{ /* display: flex; */ width: 325px; height: 61px; /* justify-content: space-between; align-items: center; font-family: Alimama ShuHeiTi; font-size: 50px; font-weight: bold; line-height: normal; letter-spacing: 0px; font-variation-settings: "opsz" auto; background: linear-gradient(90deg, #4689FA 8%, #606CF4 75%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; */ } .main_title .title2{ font-size: 46px !important; font-weight: bold; margin: 12px 0 16px 0; } .main_title .title2 span:nth-child(1){ color: #121519; font-size: 42px; } .main_title .title2 .shortSpan{ font-family: Alimama ShuHeiTi; font-weight: bold; font-variation-settings: "opsz" auto; background: linear-gradient(263deg, #756DF7 9%, #4B8BFB 35%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; } .main_title .title3{ font-size: 18px; font-weight: bold; color: #73787E; } .step_main{ width: 60%; display: flex; /* background: rgba(255, 255, 255, 0.5); backdrop-filter: blur(10px); */ justify-content: center; padding: 12px 164px; } .step_main dt>img{ width: 28px; height: 28px; } .step_line{ flex: 1; } .step_main .nor_step_title{ font-size: 16px; font-weight: normal; color: #626573; height: 20px; margin-bottom: 14px; } .step_main .nor_step_title +span{ } .step_main .active_step_title{ font-size: 16px; font-weight: bold; color: #3D3D3D; letter-spacing: 0.01em; } .step_main dl{ display: flex; } .step_main dd{ display: flex; flex-direction: column; line-height: 27px; margin: 0 0 0 12px; font-size: 14px; font-weight: 400; letter-spacing: 0.06em; color: #626573; } .main_select{ /* width: 750px; */ padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-start; margin: 0 auto; margin-bottom: 48px; font-family: MicrosoftYaHeiUI; } .main_select li{ margin-right: 15px; display: flex; /* padding-left: 12px; */ padding: 7px 10px; border: 1px solid #C4CCFF; align-items: center; position: relative; margin-top: 15px; border-radius: 8px; background: rgba(255, 255, 255, 0.5); cursor: pointer; line-height: 30px; box-sizing: border-box; font-size: 16px; } .main_select .active_select{ border: 1px solid #5B6FF6; } li .li_icon{ width: 30px; height: 30px; } li span{ margin-left: 10px; /* height: 20px; */ display: inline-block; } li .select_icon, .pay_every .pay_icon{ width: 14px; height: 14px; margin-left: 10px; opacity: 0; /* display: none; */ /* position: absolute; right: 0; top: 0; */ } .active_select .select_icon,.pay_active .pay_icon{ opacity: 1; /* display: block; */ } .backColor2{ display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 42px 130px; width: 60%; min-width: 744px; max-width: 1118px; margin: 0 130px; border-radius: 8px; opacity: 0.9; background: rgba(255, 255, 255, 0.9); } .my_form{ /* margin: 0 auto; */ width: 100%; } .my_form .formOne{ display: flex; /* width: 750px; */ justify-content: space-between; margin-bottom: 48px; } /* .custom-select { position: relative; } */ .placeBox{ position: absolute; right: 24px; top: 2px; /* width: 162px; */ display: flex; font-size: 14px; line-height: 18px; justify-content: space-between; padding: 12px 12px; background-color: #fff; color: #A5ABAF; /* border: 1px solid #E8E8E8; */ border-radius: 6px; } .placeBox img{ width: 18px; height: 18px; } /* 这里可以添加更多样式来美化自定义下拉菜单 */ /* #project_select{ border-radius: 6px; background: #FFFFFF; border: 1px solid #E8E8E8; padding: 14px 12px; height: 46px; width: 186px; margin-right: 22px; } */ .key_words{ line-height: 45px !important; margin-top: -40px; } .key_words input{ display: flex; flex: 1; flex-direction: row; align-items: center; background-color: #fff; border: 1px solid #E8E8E8; padding: 14px 8px 14px 12px; border-radius: 6px; } .oneRight{ flex: 1; display: flex; flex-direction: row; align-items: center; background-color: #fff; border: 1px solid #E8E8E8; padding: 4px 4px 4px 12px; border-radius: 6px; position: relative; } .oneRight img{ width: 18px; height: 18px; } .oneRight input{ flex: 1; border: none; padding-left: 12px; color: #1F2225; height: 32px; font-family: MicrosoftYaHeiUI; } .oneRight input::placeholder, .key_words input::placeholder{ color:#8C919D; font-family: MicrosoftYaHeiUI; } .oneRight input:focus-visible ,.key_words input:focus-visible{ outline: none; } .loadingPos,.aititlePos{ /* display: none; */ position: absolute; left: 0px; top: 48px; width: calc(100% - 28px); z-index: 2; /* 自动布局 */ display: flex; flex-direction: column; align-items: flex-end; padding: 16px 14px; gap: 12px; border-radius: 8px; background: #FFFFFF; border: 1px solid #E8E8E8; box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.08); } .opt-block .title-change{ display: flex; width: 360px; height: 30px; background: rgba(0,0,0,0.75); border-radius: 6px; line-height: 20px; padding: 5px 9px; position: absolute; top:10px; left: 50%; margin-left: -180px; opacity: 0; /* 初始状态为完全透明 */ transition: opacity 1s ease; /* 设置透明度过渡 */ } .opt-block .title-change.fade{ opacity: 1; } #advise-area{ width: calc(100% - 28px); } .opt-area{ display: none; position: absolute; top: 50px; left: 0; z-index: 10; /* width: 100%; */ background: #FFFFFF; box-shadow: 0px 2px 14px 0px rgba(0,0,0,0.08); border-radius: 8px; border: 1px solid #EAEAEA; padding: 16px 14px; cursor: pointer; user-select: none; } .opt-block .loading-area{ display: flex; align-items: center; justify-content: center; width: 100%; height: 84px; background: linear-gradient( 180deg, #F1FBFF 0%, #ECF3FF 100%); border-radius: 8px; font-weight: 400; font-size: 12px; color: #8B919A; text-align: center; } .opt-block .step-icon{ width:18px; height: 18px; margin-right: 4px; background: url(../img/loading_step_gray.png); background-size: cover; background-position: center center; background-repeat: no-repeat; } .opt-block .step-text{ font-size: 12px; color: #8B919A; line-height: 84px; } .opt-block .step-icon-done{ background: url(../img/loading_step_light1.png); } .opt-block .step-icon-done+.step-text{ color: #282828; } .opt-block .step-icon-active{ background: none; /* margin-top: -22px; */ } .opt-block .step-icon-active+.step-text{ color: #1675FF; } .loading-area img{ margin: 0 8px; width: auto; height: 1px; min-width: 18px; max-width: 70px; flex: 1; } .opt-block .advise-header{ font-weight: 500; font-size: 12px; color: #8B919A; line-height: 20px; margin-bottom: 8px; } .opt-block .advise-header img{ display: inline-block; vertical-align: middle; margin-right: 4px; width: 17px; height: 19px; } .opt-block .advise-li{ font-weight: 400; font-size: 14px; line-height: 20px; padding: 8px 17px; color: #3D3D3D; transition: all .3s ease; } .opt-block .advise-li:hover{ background: #F1F4FF; border-radius: 6px; transition: all .3s ease; } .opt-block .title-change{ display: flex; /* width: 374px; */ height: 31px; background: rgba(0, 0, 0, 0.7531); border-radius: 6px; line-height: 20px; padding: 5px 7px; position: absolute; top:10px; left: 50%; margin-left: -180px; opacity: 0; /* 初始状态为完全透明 */ transition: opacity 1s ease; /* 设置透明度过渡 */ font-family: Microsoft YaHei UI; align-items: center; justify-content: center; } .opt-block .title-change.fade{ opacity: 1; } .opt-block .change-text{ font-weight: 400; font-size: 13px; color: #FFFFFF; margin-right: 7px; font-family: Microsoft YaHei UI; } .opt-block .change-yes, .change-no{ font-weight: 400; font-size: 13px; color: #FFCE5C; margin: 0 7px; font-family: Microsoft YaHei UI; } .opt-block .advise-refresh{ font-weight: 400; font-size: 14px; color: #5B6FF6; line-height: 20px; padding-top: 8px; text-align: right; } .opt-block .advise-refresh img{ display: inline-block; vertical-align: middle; margin-right: 4px; width: 16px; height: 16px; } .posBack{ /* 自动布局子元素 */ /* position: static; left: 14px; top: 16px; */ /* width: 882px; */ /* height: 106px; */ /* 自动布局 */ display: flex; flex-direction: column; align-items: center; padding: 28px 18px; gap: 14px; align-self: stretch; z-index: 0; border-radius: 8px; opacity: 1; margin-bottom: 12px; background: linear-gradient(180deg, #EDF1FE 0%, #FCFDFF 119%); } .posHead{ font-family: MicrosoftYaHeiUI; font-size: 16px; font-weight: normal; line-height: normal; letter-spacing: 0px; font-variation-settings: "opsz" auto; color: #282828; line-height: 20px; /* margin-bottom: 14px; */ } .posHead img{ width: 18px; height: 18px; margin-right: 6px; } .posStep{ width: 100%; align-items: center; font-size: 12px; max-width: 710px; color: #8B919A; justify-content: center; } .posStep img{ width: 6px; height: 6px; margin-right: 6px; } .posStep .posLine{ flex: 1; margin: 0 8px; min-width: 16px; max-width: 100px; } .posFooter{ display: flex; justify-content: flex-end; color: #8C919D; font-size: 14px; line-height: 16px; } .posFooter div{ background: transparent; border: none; color: #8C919D; cursor: pointer; } .posFooter .startBtn{ color: #5B6FF6; margin-left: 20px; } .normal_recommend_title,.recommend_title{ width: 82px; margin-left: 12px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; border-radius: 6px; background: #F9FAFA; padding: 8px 12px; cursor: pointer; transition: all .5s ease; color: #8C919D; } .normal_recommend_title >span::before{ content: ''; width: 20px; height: 20px; display: inline-block; box-sizing: border-box; vertical-align: middle; margin-right: 6px; background: url(../img/title_icon_normal.svg) no-repeat !important; background-size: 20px; } .recommend_title >span::before{ content: ''; width: 20px; height: 20px; display: inline-block; box-sizing: border-box; vertical-align: middle; margin-right: 6px; background: url(../img/title_icon.svg) no-repeat !important; background-size: 20px; } .recommend_title{ background: #FFF5ED; color: #FF7800; transition: all .5s ease; } .inputText{ color: #525252; } .warnInputText{ color: #FF4D4F; } .formItem{ display: flex; justify-content: space-between; margin-bottom: 24px; color: #1F2225; line-height: 34px; font-family: MicrosoftYaHeiUI; } .formItem .formLeft{ width: 70px; text-align: left; display: flex; } .formItem .requiredIcon{ width: 8px; height: 8px; margin-top: 13px; margin-left: 4px; } .formItem .formRight{ flex: 1; margin-left: 12px; flex-wrap: wrap; } .form_pptItem{ font-family: Microsoft YaHei UI; } .form_pptItem .requiredIcon{ width: 8px; height: 8px; margin-left: 4px; margin-top: 5px; } .ppt_label{ font-size: 14px; line-height: 18px; color: #1F2225; padding: 8px 0; margin-bottom: 12px; } .ppt_upload{ flex-direction: row; justify-content: center; align-items: center; /* padding: 20px 70px; */ /* padding: 18px 12px 14px; */ border-radius: 6px; box-sizing: border-box; border: 1px dashed #BFBFBF; margin-bottom: 24px; } .uploadShow{ flex-direction: column; position: relative; width: 100%; height: 100%; padding: 18px 12px 14px; } .uploadShow p{ margin-top: 17px; color: #66696B; line-height: 18px; } .uploadShow input{ opacity: 0; position: absolute; width: 100%; height: 100%; left: 0; top: 0; } .uploadMesShow{ width: 100%; height: 100%; justify-content: center; padding: 25px 0; } .btn{ color: #5B6FF6; margin-top: 6px; } .fileInfobox{ margin-left: 28px; } .fileInfo .fileName{ color: #969BA7; margin-right: 10px; } .ppt_labelTwo{ font-size: 14px; line-height: 18px; color: #1F2225; padding: 12px 0; justify-content: space-between; margin-bottom: 12px; } .ppt_temList{ width: 100%; /* flex-wrap: wrap; justify-content: space-between; gap: 24px; */ display: grid; grid-template-columns: repeat(auto-fill,minmax(166px,1fr)); gap: 12px; } .ppt_temList .ppt_tem_item{ width: 166px; position: relative; /* margin-top: 12px; */ } .ppt_tem_item .pptImg{ width: 162px; height: 93px; border-radius: 8px; border: 2px solid #E8E9EA; transition: all .5s ease; } .ppt_tem_item .ppt_select{ position: absolute; right: 0px; top: 0; display: none; width: 25px; height: 45px; } .ppt_item_active .pptImg{ border-radius: 8px; opacity: 1; /* box-sizing: border-box; */ border: 2px solid #697CF7; } .ppt_item_active .ppt_select{ display: block; } .ppt_tem_item .firstlook{ width: 166px; /* width: 100%; */ height: 0px; /* line-height: 24px; */ opacity: 0; text-align: center; color: #FFFFFF; position: absolute; bottom: 19px; border-radius: 0 0 8px 8px; background: rgba(0, 0, 0, 0.7); } .ppt_tem_item:hover .pptImg{ border-radius: 8px; opacity: 1; /* width: 166px; */ /* box-sizing: border-box; */ border: 2px solid #697CF7; transition: all .5s ease; } .ppt_tem_item:hover .firstlook{ height: 24px; line-height: 24px; transition: all .5s ease; opacity: 1; } .ppt_tem_item p{ color: #3D4B54; text-align: center; } .uploadfile-error { color: #FF1414; } /* ppt end */ .educationRight{ display: flex; align-items: center; } .educationRight img{ width: 18px; height: 18px; margin-right: 3px; } .educationRight+p{ font-size: 12px; line-height: 18px; color: #9E9E9E; } .education,.essayWords,.tableChart{ display: flex; align-items: center; margin-right: 24px; position: relative; cursor: pointer; } .education input,.essayWords input{ opacity: 0; position: absolute; left: 0; width: 100%; cursor: pointer; } .tableChart input{ opacity: 0; position: absolute; left: 0; width: 100%; height: 100%; } .education div, .essayWords div, .tableChart div{ width: 18px; height: 18px; margin-right: 8px; cursor: pointer; } .education div,.essayWords div{ background: url(../img/education_no_select.svg); } .edu_active_select div, .essayWords_active div{ background: url(../img/education_select.svg); } .tableChart div{ background: url(../img/no_checked_icon.svg); } .tableChart_active div{ background: url(../img/checked_icon.svg); } .btn_result,.btn_result_now,.downLoad{ width: 200px; height: 50px; font-size: 15px; border: none; color: #FFFFFF; line-height: 50px; text-align: center; border-radius: 8px; margin-top: 30px; transition: all .3s ease; background: linear-gradient(270deg, #6C69F5 0%, #3467E5 100%); } .btn_result:hover, .btn_result_now:hover,.downLoad:hover{ transition: all .3s ease; opacity: 0.8; background: linear-gradient(270deg, #6C69F5 0%, #3467E5 100%); } .btn_result:active,.btn_result_now:active,.downLoad:active{ transition: all .3s ease; opacity: 1; background: linear-gradient(270deg, #6C69F5 0%, #3467E5 100%); border: 7px solid #DDE1FC; } .checkbox_wrap , .checkbox_wrap p{ margin-top: 12px; font-size: 12px; line-height: 18px; display: flex; align-items: center; color: #8C919D; } .checkbox_wrap p::before{ content: ''; width: 15px; height: 15px; display: inline-block; background: url(../img/no_checked_icon.svg) center center no-repeat; vertical-align: middle; margin-right: 4px; position: relative; top: -1px; } .checkbox_wrap p.active::before{ content: ''; width: 15px; height: 15px; display: inline-block; background: url(../img/checked_icon.svg) center center no-repeat !important; vertical-align: middle; margin-right: 4px; position: relative; top: -1px; } .no-click { pointer-events: none; /* 其他样式,比如透明度调整等 */ opacity: 0.5; } .upgrade-modal{ display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.22); z-index: 999999999; } .upgrade-content{ width: 445px; height: 162px; background: #FFFFFF; border-radius: 8px; position: absolute; top:50%; left: 50%; margin-top: -81px; margin-left: -220px; text-align: center; } .upgrade-info,.upgrade-info span{ font-size: 16px; color: #000000; line-height: 20px; margin-top: 28px; } .upgrade-info img{ width: 38px; height: 38px; margin-right: 9px; display: inline-block; vertical-align: middle; } .upgrade-button{ width: 132px; height: 40px; background: linear-gradient( 139deg, #76EAE7 0%, #43CBC7 100%); border-radius: 6px; font-weight: bold; font-size: 14px; color: #FFFFFF; line-height: 40px; text-align: center; margin: 28px auto; } .upgrade-button2{ width: 132px; height: 40px; background: linear-gradient( 270deg, #005FFF 0%, #00DBFF 100%); border-radius: 6px; font-weight: bold; font-size: 14px; color: #FFFFFF; line-height: 40px; text-align: center; margin: 28px auto; } .textAreaRight{ display: flex; position: relative; } .char-count { position: absolute; bottom: 5px; /* 根据需要调整距离底部的位置 */ right: 10px; /* 根据需要调整距离右侧的位置 */ font-size: 12px; /* 根据需要调整字体大小 */ } .custom-select { position: relative; display: inline-block; margin-right: 22px; } #project_select { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; background-color: #fff; border: 1px solid #aaa; padding: 5px; font-size: 14px; height: 46px; font-family: Microsoft YaHei UI; width: 186px; border-radius: 6px; color: #8C919D; cursor: pointer; outline: none; background: #FFFFFF; border: 1px solid #E8E8E8; } /* 自定义图标 */ .custom-icon { position: absolute; top: 50%; right: 10px; transform: translateY(-50%); background-image: url('../img/selectIcon.svg'); /* 图标路径 */ background-size: contain; width: 20px; /* 图标宽度 */ height: 20px; /* 图标高度 */ pointer-events: none; /* 让图标不受鼠标事件影响 */ } /* 伪元素覆盖原生箭头 */ select::-ms-expand { display: none; /* 移除IE的下拉箭头 */ } select:focus { border-color: #4A90E2; /* 聚焦时边框颜色 */ } #side_textarea, #coreTextarea{ flex: 1; /* width: 100%; */ padding: 14px 12px; /* width: 664px; */ height: 65px; border-radius: 6px; background: #FFFFFF; border: 1px solid #E8E8E8; font-family: MicrosoftYaHeiUI; } #side_textarea::placeholder{ color: #8C919D; } .footer{ background: #FAFAFC; margin-top: 50px; transition: all .5s ease; } .footer2{ margin-top: 100px; transition: all .5s ease; } .footer .footerbox{ display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 24px 200px; background: transparent; margin: 0 auto; } .footerbox .left_top{ display: flex; justify-content: flex-start; width: 100%; align-items: center; font-family: Alimama ShuHeiTi; font-size: 22px; font-weight: bold; line-height: normal; letter-spacing: 0px; font-variation-settings: "opsz" auto; background: linear-gradient(0deg, #000000, #000000), linear-gradient(90deg, #93B6F9 13%, #5D8CF0 75%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; position: absolute; top: 0; left: 0; } .footerbox .main_footer{ color: #9E9E9E; font-size: 12px; display: flex; justify-content: space-between; height: 53px; position: relative; padding-top: 50px; width: 100%; min-width: 880px; } .main_footer .right{ width: 262px; margin-left: 145px; height: 53px; display: flex; align-items: center; justify-content: flex-start; flex-direction: column; line-height: 26px; } .main_footer .left{ flex: 1; /* min-width: 473px; */ } .noempty{ flex: 1; min-width: 145px; } .main_footer .left p:nth-child(1){ margin-bottom: 8px; } .main_footer p{ font-size: 12px; margin: 0; text-align: left; width: 100%; } footer{ /* position: absolute; left: 0px; top: 938px; */ width: calc(100%); /* 自动布局 */ display: flex; font-size: 12px; flex-direction: row; justify-content: center; align-items: center; height: 55px; /* padding: 50px 70px; */ background: #FAFAFC; line-height: 32px; box-sizing: border-box; border-width: 1px 0px 0px 0px; border-style: solid; border-color: #D8D8D8; } footer span{ display: inline-block; margin-left: 12px; } footer a{ display: inline-block; margin-right: 3px; color: black; text-decoration: none; } /* 报告下载start */ #report_page{ width: 100%; height: calc(100% - 64px); position: absolute; margin: 0 auto; width: 100%; min-width: 1200px; z-index: 66; top: 64px; display: flex; flex-direction: column; font-family: Microsoft YaHei UI; } .report_box{ width: 100%; flex-direction: column; } .report_content{ width: 600px; text-align: center; /* display: flex; flex-direction: column; justify-content: center; */ } .report_content h3{ margin: 36px 0 30px; font-size: 22px; font-weight: bold; line-height: normal; letter-spacing: 1.04px; font-variation-settings: "opsz" auto; color: #3D3D3D; } .report_content .search_report{ font-size: 14px; color: #3D3D3D; border-radius: 6px; background: #FFFFFF; border: 1px solid #E8E8E8; padding: 16px 20px; display: flex; line-height: 20px; } .report_content .search_report .report_input{ color: #3D3D3D; margin-right: 10px; flex: 1; border: none; } .report_content .search_report .report_input::placeholder{ color: #8C919D; } .report_content .search_report .report_input:focus-visible{ outline: none; } .report_content #searchReport{ color: #5B6FF6; margin-left: 16px; } .report_content .report_ques{ color: #5B6FF6; margin: 16px 0 30px; } .findtid-wrap ul{ /* width: 100%; */ display: block; height: auto; overflow: hidden; display: flex; margin: 0; } .findtid-wrap ul > li{ height: 36px; line-height: 36px; justify-content: flex-start; margin-right: 39px; cursor: pointer; position: relative; list-style-type: none; } .findtid-wrap ul > li p{ display: inline-block; vertical-align: middle; font-size: 12px; font-weight: 400; color: #C0C4C7; } .findtid-wrap ul > li:first-child::before{ content: ''; width: 16px; height: 16px; display: inline-block; box-sizing: border-box; vertical-align: middle; background: url(../img/wx_img_normal.svg) no-repeat; } .findtid-wrap ul > li:nth-child(2)::before{ content: ''; width: 16px; height: 16px; display: inline-block; box-sizing: border-box; vertical-align: middle; background: url(../img/zfb_img_normal.svg) no-repeat; background-size: 16px; } .findtid-wrap ul > li:last-child::before{ content: ''; width: 16px; height: 16px; display: inline-block; box-sizing: border-box; vertical-align: middle; background: url(../img/taobao_img_normal.svg) no-repeat; background-size: 16px; } .findtid-wrap ul > li:first-child.select p{ color: #29C445 !important; font-weight: bold; transition: all .3s; } .findtid-wrap ul > li:nth-child(2).select p{ color: #1675FF !important; font-weight: bold; transition: all .3s; } .findtid-wrap ul > li:last-child.select p{ color: #FF7800 !important; font-weight: bold; transition: all .3s; } .findtid-wrap ul > li:first-child.select::before{ content: ''; width: 16px; height: 16px; display: inline-block; box-sizing: border-box; vertical-align: middle; background: url(../img/wx_img_light.svg) no-repeat !important; } .findtid-wrap ul > li:first-child.select::after{ content: ''; width: 100%; height: 2px; background: #29C445; display: inline-block; box-sizing: border-box; position: absolute; left: 0; bottom: 3px; } .findtid-wrap ul > li:nth-child(2).select::before{ content: ''; width: 16px; height: 16px; display: inline-block; box-sizing: border-box; vertical-align: middle; background: url(../img/zfb_img_light.svg) no-repeat !important; background-size: 16px; } .findtid-wrap ul > li:nth-child(2).select::after{ content: ''; width: 80px; height: 2px; background: #03B4FD; display: inline-block; box-sizing: border-box; position: absolute; left: 0px; bottom: 3px; } .findtid-wrap ul > li:last-child.select::before{ content: ''; width: 16px; height: 16px; display: inline-block; box-sizing: border-box; vertical-align: middle; background: url(../img/taobao_img_light.svg) no-repeat !important; background-size: 16px; } .findtid-wrap ul > li:last-child.select::after{ content: ''; width: 68px; height: 2px; background: #FF6413; display: inline-block; box-sizing: border-box; position: absolute; left: 0px; bottom: 3px; } .findtid-wrap > img { margin-top: 6px; } .findtid-wrap-tip{ width: 100%; height: 10px; /* background: #F9F9FB; */ opacity: 0; position: relative; top: -10px; } .report_content .report_list{ position: relative; } .report_content .findtid-wrap{ width: 567px; height: 231px; background: url(../img/report_pay_back.png); background-size: 567px 231px; position: absolute; top: 22px; left: calc(50% - 70px); } .report_content .report_detail{ width: 600px; height: 360px; border-radius: 6px; opacity: 1; background: rgba(255, 255, 255, 0.8); margin-bottom: 19px; } .empty img{ width: 60px; height: 60px; margin-bottom: 16px; } .report_content .report_detail .empty{ flex-direction: column; color: #1D2837; height: 100%; } .report_box .report_mes{ color: #EE7000; border-radius: 6px; background: rgba(236, 133, 51, 0.12); padding: 8px 16px; } .report_main{ width: calc(100% - 52px); height: calc(100% - 52px); padding: 26px; display: flex; flex-direction: column; align-items: center; } .report_main .main_item{ display: flex; text-align: left; font-size: 14px; font-weight: normal; line-height: 20px; letter-spacing: 0px; color: #2C394B; margin-bottom: 20px; } .main_item label{ width: 70px; margin-right: 20px; color: #5C6E86; } .main_item p{ flex: 1; line-height: 20px; display: flex; align-items: center; } .main_item p.report_finish{ color: #3BB551; } .report_main .main_top{ flex: 1; width: 100%; } .report_main .waiting{ color:#EE7000; } .report_main .downLoad{ width: 130px; padding: 11px 0; border-radius: 8px; line-height: 18px; color: #FFFFFF; margin: 0; height: auto; background: linear-gradient(270deg, #6C69F5 0%, #3467E5 100%); } /* 报告下载end */ /* 五彩斑斓支付框 start*/ .pay_complete_modal{ position: fixed; width: 1058px; height: 640px; left: 50%; top: 20%; z-index: 999; transform: translateX(-50%); border-radius: 16px; font-family: Microsoft YaHei UI; display: flex; /* padding: 28px 36px 36px; */ } .pay_complete_modal .pay_com_left{ width: 268px; height: 640px; background: rgba(255, 255, 255, 0.7); border-radius: 16px 0 0 16px; display: flex; flex-direction: column; align-items: center; } .pay_com_right{ flex: 1; display: flex; flex-direction: column; } .pay_com_left .left_logo{ font-size: 22px; font-weight: bold; margin-top: 30px; margin-bottom: 20px; width: 210px; } .pay_com_left .left_logo::before{ content: ''; width:32px; height:32px; display: inline-block; box-sizing: border-box; vertical-align: middle; background-size:32px; } .pay_com_left .left_ai{ background: url(../img/colorAll-ai.svg) no-repeat; background-size: 210px 82px; height: 82px; color: #3D3D3D; width: 190px; line-height: 22px; padding: 14px 0px 0px 20px; position: relative; } .left_ai .left_ai_img{ width: 68px; height: 86px; position: absolute; right: 0; top: 26px; } .left_line{ width: 204px; height: 1px; margin:40px 0; /* margin-top: auto; */ } .left_ai_listMes{ } .left_ai_listMes .listMes_item{ margin-bottom: 32px; } .listMes_item b{ display: block; font-size: 15px; color: #323232; } .listMes_item p{ font-size: 12px; color: #323232; width: 203px; line-height: 17px; margin-top: 9px; } .listMes_item b::before{ content: ''; width:18px; height:18px; display: inline-block; box-sizing: border-box; vertical-align: middle; background-size:18px; margin-right: 12px; } .pay_com_right .right_title{ display: flex; align-items: center; padding: 26px 36px; justify-content: flex-end; font-size: 15px; font-weight: bold; color: #131A6A; } .pay_com_right .right_title img{ margin-left: 10px; } .pay_com_right .right_main{ flex: 1; padding: 36px 36px 0; background-color: #fff; border-radius: 0 0 16px 0; } /* purple start */ .purpleColor{ background: url(../img/purple_back.png) no-repeat; background-size: 100% 100%; } .purpleColor .left_logo{ background: linear-gradient(90deg, #AD65F5 13%, #5159F9 74%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; font-family: Alimama ShuHeiTi; } /* colorAll-ai.svg */ .purpleColor .left_logo::before{ background: url(../img/purple_logo.svg) no-repeat !important; } .purpleColor .left_ai_img{ background: url(../img/purple_ai.svg) no-repeat !important; } .purpleColor .left_line{ background: url(../img/purple_line.svg) no-repeat !important; } .purpleColor .listMes_item b::before{ background: url(../img/purple_left.svg) no-repeat !important; } .purpleColor .right_title{ color: #131A6A; } /* purple end */ /* blue start */ .blueColor{ background: url(../img/blue_back.png); } .blueColor .right_title{ color: #0A2D4D; } .blueColor .left_logo{ background: linear-gradient(90deg, #4689FA 8%, #606CF4 75%); } /* blue end */ /* orange start */ .orangeColor{ background: url(../img/blue_back.png); } .orangeColor .right_title{ color: #7E5335; } /* orange end */ /* 五彩斑斓支付框 end*/