.sto-footer { display: none; } .page-developer .st-mainbody .doc-body .container .dev-item { align-items: stretch; } .page-developer .st-mainbody .doc-body .container .dev-item .item-cont { height: auto; align-self: stretch; } .chunk-contact { background-image: url(../img/home/free_experience_bg.png); background-size: cover; background-position: center; background-color: #eef5fc; min-height: auto; } .chunk-contact .container { min-height: auto; padding: calc(48 / var(--width) * 100vw) 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .chunk-contact .contact-form-wrap { width: 100%; max-width: calc(1200 / var(--width) * 100vw); padding: calc(40 / var(--width) * 100vw) calc(96 / var(--width) * 100vw); background: #fff; border-radius: calc(4 / var(--width) * 100vw); box-shadow: 0 calc(12 / var(--width) * 100vw) calc(40 / var(--width) * 100vw) rgba(0, 0, 0, 0.08); display: grid; } .chunk-contact .contact-form-panel, .chunk-contact .contact-success-panel { grid-area: 1 / 1; } .chunk-contact .contact-success-panel { display: none; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-sizing: border-box; } .chunk-contact .contact-success-panel .success-icon { width: calc(160 / var(--width) * 100vw); height: calc(160 / var(--width) * 100vw); object-fit: contain; } .chunk-contact .contact-success-panel .success-text { margin: calc(32 / var(--width) * 100vw) 0 0; font-size: calc(32 / var(--width) * 100vw); font-weight: 500; color: #000; line-height: 1.5; } .chunk-contact .contact-form-wrap .form-submit { display: block; width: calc(404 / var(--width) * 100vw); max-width: 100%; height: calc(68 / var(--width) * 100vw); margin: calc(28 / var(--width) * 100vw) auto 0; border: none; border-radius: calc(4 / var(--width) * 100vw); font-size: calc(28 / var(--width) * 100vw); font-weight: 500; color: #fff; background: linear-gradient(90deg, #0092F9 0%, #00BAFC 100%); cursor: pointer; } .chunk-contact .contact-form-wrap .form-submit:disabled, .chunk-contact .contact-form-wrap .form-submit.is-loading { opacity: 0.72; cursor: not-allowed; } .chunk-contact .contact-form-wrap.is-success .contact-form-panel { visibility: hidden; pointer-events: none; } .chunk-contact .contact-form-wrap.is-success .contact-success-panel { display: flex; } .chunk-contact .form-title { margin: 0 0 calc(32 / var(--width) * 100vw); font-size: calc(56 / var(--width) * 100vw); font-weight: bold; color: #000; line-height: 1.2; text-align: center; } .chunk-contact .free-experience-form { max-width: calc(980 / var(--width) * 100vw); margin: 0 auto; } .chunk-contact .free-experience-form .form-row { display: flex; flex-wrap: wrap; gap: 0 calc(64 / var(--width) * 100vw); margin-bottom: calc(32 / var(--width) * 100vw); } .chunk-contact .free-experience-form .form-field { flex: 1; min-width: calc(50% - 50 / var(--width) * 100vw); position: relative; } .chunk-contact .free-experience-form .form-field.form-field-full { min-width: 100%; margin-bottom: calc(32 / var(--width) * 100vw); } .chunk-contact .free-experience-form .form-error { display: none; position: absolute; right: 0; top: calc(100% + 8 / var(--width) * 100vw); font-size: calc(20 / var(--width) * 100vw); color: #FE3300; line-height: 1.2; white-space: nowrap; } .chunk-contact .free-experience-form .form-field.has-error .form-error { display: block; } .chunk-contact .free-experience-form .form-group { width: 100%; min-width: 0; display: flex; align-items: center; height: calc(60 / var(--width) * 100vw); background-color: #FAFAFF; padding: 0 calc(28 / var(--width) * 100vw); } .chunk-contact .free-experience-form .form-group label { flex-shrink: 0; white-space: nowrap; font-size: calc(24 / var(--width) * 100vw); font-weight: 500; color: #000; opacity: 0.9; margin-right: calc(20 / var(--width) * 100vw); } .chunk-contact .free-experience-form .form-control { flex: 1; width: 100%; min-width: 0; border: none; background: transparent; font-size: calc(24 / var(--width) * 100vw); font-weight: 500; color: #000; opacity: 0.9; outline: none; text-align: left; } .chunk-contact .free-experience-form .form-group-select { position: relative; } .chunk-contact .free-experience-form .form-group-select select.form-control { appearance: none; cursor: pointer; padding-right: calc(100 / var(--width) * 100vw); text-align: right; text-align-last: right; } .chunk-contact .free-experience-form .form-group-select select.form-control option { text-align: left; direction: ltr; } .chunk-contact .free-experience-form .form-group-select::after { content: ""; position: absolute; right: calc(28 / var(--width) * 100vw); top: 50%; transform: translateY(-50%); width: 0; height: 0; border-top: calc(10 / var(--width) * 100vw) solid #717181; border-left: calc(8 / var(--width) * 100vw) solid transparent; border-right: calc(8 / var(--width) * 100vw) solid transparent; pointer-events: none; } @media (max-width: 768px) { .chunk-contact { min-height: auto; } .chunk-contact .container { min-height: auto; padding: calc(48 / var(--width) * 100vw) calc(32 / var(--width) * 100vw); } .chunk-contact .contact-form-wrap { padding: calc(32 / var(--width) * 100vw) calc(24 / var(--width) * 100vw); } .chunk-contact .contact-success-panel .success-text { margin-top: calc(24 / var(--width) * 100vw); font-size: calc(28 / var(--width) * 100vw); } .chunk-contact .contact-success-panel .success-icon { width: calc(120 / var(--width) * 100vw); height: calc(120 / var(--width) * 100vw); } .chunk-contact .form-title { font-size: calc(40 / var(--width) * 100vw); margin-bottom: calc(24 / var(--width) * 100vw); } .chunk-contact .free-experience-form .form-row { flex-direction: column; gap: calc(24 / var(--width) * 100vw); margin-bottom: calc(24 / var(--width) * 100vw); } .chunk-contact .free-experience-form .form-field { min-width: 100%; } .chunk-contact .contact-form-wrap .form-submit { width: 100%; margin-top: calc(32 / var(--width) * 100vw); } } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl { gap: calc(32 / var(--width) * 100vw); } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .apply-btn { width: calc(216 / var(--width) * 100vw); background: #0088F7; border: none; filter: none; } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .try-demo-wrap { position: relative; } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .try-demo-btn { width: calc(216 / var(--width) * 100vw); height: calc(64 / var(--width) * 100vw); display: flex; align-items: center; justify-content: center; border: 1px solid #FFFFFF; border-radius: calc(4 / var(--width) * 100vw); background: transparent; color: #FFFFFF; font-size: calc(24 / var(--width) * 100vw); line-height: 1; cursor: pointer; padding: 0 calc(24 / var(--width) * 100vw); white-space: nowrap; } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .try-demo-panel { display: none; position: absolute; top: calc(100% + 20 / var(--width) * 100vw); left: 50%; transform: translateX(-50%); width: calc(260 / var(--width) * 100vw); padding: calc(28 / var(--width) * 100vw) calc(18 / var(--width) * 100vw) calc(22 / var(--width) * 100vw); background: rgba(236, 239, 244, 0.98); border-radius: calc(6 / var(--width) * 100vw); box-shadow: 0 calc(4 / var(--width) * 100vw) calc(20 / var(--width) * 100vw) rgba(0, 0, 0, 0.1); text-align: center; z-index: 20; pointer-events: none; overflow: visible; } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .try-demo-panel::before { content: ""; position: absolute; top: 0; left: 50%; transform: translate(-50%, calc(-100% + 1px)); border-left: calc(8 / var(--width) * 100vw) solid transparent; border-right: calc(8 / var(--width) * 100vw) solid transparent; border-bottom: calc(8 / var(--width) * 100vw) solid rgba(236, 239, 244, 0.98); } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .try-demo-panel img { width: calc(132 / var(--width) * 100vw); height: calc(132 / var(--width) * 100vw); object-fit: contain; background: #FFFFFF; padding: calc(6 / var(--width) * 100vw); border-radius: calc(4 / var(--width) * 100vw); } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .try-demo-panel p { margin: calc(14 / var(--width) * 100vw) 0 0; font-size: calc(14 / var(--width) * 100vw); line-height: 1.35; color: #333333; } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .try-demo-wrap:hover .try-demo-panel { display: block; } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .consult-link { display: inline-flex; align-items: center; gap: calc(12 / var(--width) * 100vw); width: auto; height: auto; padding: 0; border: none; background: transparent; filter: none; color: #FFFFFF; font-size: calc(24 / var(--width) * 100vw); line-height: 1; white-space: nowrap; } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .consult-link img { width: calc(24 / var(--width) * 100vw); height: calc(16 / var(--width) * 100vw); object-fit: contain; transition: 0.2s; } .page-ar-shipintexiao-detail .st-mainbody .doc-header .head-btns--intl .consult-link:hover img { transform: translateX(30%); } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap { background: #FFFFFF; } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .solution-adv-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(27 / var(--width) * 100vw); margin-top: calc(60 / var(--width) * 100vw); } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-card { background: #FFFFFF; border: 1px solid #EEF1F6; border-radius: calc(8 / var(--width) * 100vw); box-shadow: 0 calc(8 / var(--width) * 100vw) calc(24 / var(--width) * 100vw) rgba(37, 64, 118, 0.06); padding: calc(40 / var(--width) * 100vw) calc(32 / var(--width) * 100vw) calc(36 / var(--width) * 100vw); text-align: left; } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-icon-wrap { width: calc(81 / var(--width) * 100vw); height: calc(81 / var(--width) * 100vw); border-radius: calc(16 / var(--width) * 100vw); background: linear-gradient(135deg, #00BCFC 0%, #0087F7 100%); display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-icon { width: calc(47 / var(--width) * 100vw); height: calc(47 / var(--width) * 100vw); object-fit: contain; display: block; } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-title { margin-top: calc(20 / var(--width) * 100vw); font-size: calc(24 / var(--width) * 100vw); font-weight: 600; line-height: calc(32 / var(--width) * 100vw); color: #0088F7; } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-desc { margin-top: calc(16 / var(--width) * 100vw); font-size: calc(16 / var(--width) * 100vw); font-weight: 400; line-height: calc(26 / var(--width) * 100vw); color: #666666; } [lang=zh-CN] .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-title { font-size: calc(25 / var(--width) * 100vw); line-height: calc(32 / var(--width) * 100vw); } [lang=zh-CN] .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-desc { font-size: calc(17 / var(--width) * 100vw); line-height: calc(26 / var(--width) * 100vw); } @media (max-width: 768px) { .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .solution-adv-grid { grid-template-columns: 1fr; gap: calc(24 / var(--width) * 100vw); margin-top: calc(42 / var(--width) * 100vw); } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-card { padding: calc(32 / var(--width) * 100vw) calc(24 / var(--width) * 100vw); } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-title { font-size: calc(28 / var(--width) * 100vw); line-height: 1.35; } .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-desc { font-size: calc(24 / var(--width) * 100vw); line-height: 1.5; } [lang=zh-CN] .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-title { font-size: calc(29 / var(--width) * 100vw); } [lang=zh-CN] .page-ar-shipintexiao-detail .st-mainbody .doc-body .youshi-wrap .adv-desc { font-size: calc(17 / var(--width) * 100vw); } }