@charset "utf-8";
/* 产品页「获取报价」弹窗 —— 两栏布局（左品牌 / 右表单）
   配色：本功能用 logo 的品牌蓝，不用站点默认的 #0073c3（那支偏青、发闷）。
   logo 蓝取自 web_logo_1 原图 900x170 里所有蓝色像素的均值：
   rgb(17,105,253) = #1169fd（实测 13,193 个蓝像素，众数 #126afe 与均值基本一致）。 */
:root{--quote-blue:#1169fd;}

#c-demand-pop.c-quote-pop form{width:1040px;max-width:94%;padding:0;overflow:hidden;}

/* 首屏「获取报价」按钮：字号跟随站点 rem 基准放大（html{font-size:calc(100vw/19.2)}）。
   原样式只给按钮定尺寸、字号是继承来的 14px，大屏上按钮 220x60 而字仍是 14px 显得很小。
   这里用 clamp 保证：小屏不小于 14px（维持原样），大屏按 0.22rem 放大。 */
#c-quote-btn.c-btn{font-size:clamp(14px,0.22rem,26px);}
/* 站点全局 #c-product-info1 .c-left .c-btn{background:#0073c3}，这里只覆盖带 id 的本按钮 */
#c-quote-btn.c-btn{background:var(--quote-blue);}
/* 站点那条是 (1id,2class,0)，比上面的 (1,1,0) 高，必须再提一级特异性才盖得住 */
#c-product-info1 .c-left #c-quote-btn.c-btn{background:var(--quote-blue);}

/* 两栏 */
#c-demand-pop.c-quote-pop .c-quote-grid{display:flex;align-items:stretch;}
#c-demand-pop.c-quote-pop .c-quote-right{flex:1;min-width:0;}

/* 左：品牌栏 */
#c-demand-pop.c-quote-pop .c-quote-left{width:340px;flex-shrink:0;padding:44px 34px;background:#f5f8fb;display:flex;flex-direction:column;}
/* logo 等比放大并左对齐「专注于…」的左边
   —— web_logo_1 原图 900x170，四周有透明留白（实测：logo 实心部分 x 202..697，
   左右各 202px 透明，占图宽 202/900 = 22.444%）。所以 width:100% 会把可见部分
   右推 61px。用负外边距把透明留白拉到面板内容区外面（form 有 overflow:hidden，
   透明部分被裁掉，不影响观感），可见 logo 的左边就正好落在内容区左边缘上。 */
#c-demand-pop.c-quote-pop .c-quote-logo{display:block;width:100%;max-width:100%;height:auto;margin-left:-22.444%;}
#c-demand-pop.c-quote-pop .c-quote-slogan{margin-top:22px;font-size:21px;line-height:1.5;color:#1b2b45;font-weight:700;}
#c-demand-pop.c-quote-pop .c-quote-points{margin-top:24px;}
#c-demand-pop.c-quote-pop .c-quote-points li{position:relative;padding-left:26px;margin-bottom:14px;font-size:15px;color:#3c4a60;line-height:1.5;}
#c-demand-pop.c-quote-pop .c-quote-points li:before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;border-radius:50%;background:var(--quote-blue);}
#c-demand-pop.c-quote-pop .c-quote-points li:after{content:"";position:absolute;left:5px;top:7px;width:5px;height:3px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);-webkit-transform:rotate(-45deg);}

/* 左栏：如何购买 / 售后支持 */
#c-demand-pop.c-quote-pop .c-quote-guide{margin-top:24px;padding-bottom:20px;border-bottom:1px solid #e3e9f0;}
#c-demand-pop.c-quote-pop .c-quote-h{font-size:17px;line-height:1.25;color:#1b2b45;font-weight:700;margin-bottom:14px;}
#c-demand-pop.c-quote-pop .c-quote-steps li{display:flex;align-items:flex-start;margin-bottom:11px;font-size:14px;line-height:1.45;color:#3c4a60;}
#c-demand-pop.c-quote-pop .c-quote-steps li:last-child{margin-bottom:0;}
#c-demand-pop.c-quote-pop .c-quote-ico{flex:0 0 22px;width:22px;height:22px;margin-right:10px;color:#8a97a8;}
#c-demand-pop.c-quote-pop .c-quote-ico svg{display:block;width:22px;height:22px;}
#c-demand-pop.c-quote-pop .c-quote-steps a{color:inherit;text-decoration:none;}
/* 转分机的角标：跟在号码后面，用品牌蓝描边小胶囊，一眼能看出该按哪个键 */
#c-demand-pop.c-quote-pop .c-quote-ext{display:inline-block;margin-left:6px;padding:0 5px;border:1px solid rgba(17,105,253,.38);border-radius:3px;font-size:12px;line-height:16px;font-style:normal;color:var(--quote-blue);vertical-align:1px;}
#c-demand-pop.c-quote-pop .c-quote-steps a:hover{color:var(--quote-blue);}

#c-demand-pop.c-quote-pop .c-quote-contact{margin-top:auto;padding-top:24px;font-size:14px;color:#5a6a80;line-height:2;}
#c-demand-pop.c-quote-pop .c-quote-contact strong{color:var(--quote-blue);font-weight:700;}

/* 右：标题区 */
#c-demand-pop.c-quote-pop .c-top{padding:26px 40px;text-align:left;background:var(--quote-blue);background-image:none;}
#c-demand-pop.c-quote-pop .c-top .c-title{font-size:24px;line-height:1.3;}
#c-demand-pop.c-quote-pop .c-top .c-text{margin-top:8px;font-size:13px;line-height:1.7;opacity:.92;}
#c-demand-pop.c-quote-pop .c-top .c-text a{color:#fff;text-decoration:underline;}

/* 右：表单 */
#c-demand-pop.c-quote-pop .c-bottom{padding:26px 40px 34px;}
#c-demand-pop.c-quote-pop .c-bottom .c-list{margin:0 -7px -12px;}
#c-demand-pop.c-quote-pop .c-bottom .c-list>li{width:100% !important;padding:0 7px;margin-bottom:12px;}
#c-demand-pop.c-quote-pop .c-bottom .c-list>li.c-quote-half{width:50% !important;}
#c-demand-pop.c-quote-pop .c-bottom .c-list li input,
#c-demand-pop.c-quote-pop .c-bottom .c-list li textarea{border:1px solid #eceff3;}
#c-demand-pop.c-quote-pop .c-bottom .c-list li input:focus,
#c-demand-pop.c-quote-pop .c-bottom .c-list li textarea:focus{border-color:var(--quote-blue);background-color:#fff;}
#c-demand-pop.c-quote-pop .c-bottom .c-list li input[readonly]{color:var(--quote-blue);background-color:#eef5ff;cursor:default;}
#c-demand-pop.c-quote-pop .c-bottom .c-list li.c-quote-submit .c-btn2{width:100%;cursor:pointer;background:var(--quote-blue);}

/* 验证码 */
#c-demand-pop.c-quote-pop .c-bottom .c-list li .c-code{width:140px;}
#c-demand-pop.c-quote-pop .c-bottom .c-list li .c-code .c-img{width:110px;}
#c-demand-pop.c-quote-pop .c-bottom .c-list li .c-code .c-img img{width:100%;height:38px;display:block;cursor:pointer;}
#c-demand-pop.c-quote-pop #quote-captcha{padding-right:150px;}

/* 移动端：单栏，隐藏品牌栏 */
@media (max-width:860px){
  #c-demand-pop.c-quote-pop form{width:94%;max-height:90%;overflow-y:auto;}
  #c-demand-pop.c-quote-pop .c-quote-left{display:none;}
  #c-demand-pop.c-quote-pop .c-top,
  #c-demand-pop.c-quote-pop .c-bottom{padding:18px;}
  #c-demand-pop.c-quote-pop .c-bottom .c-list>li.c-quote-half{width:100% !important;}
}
