.color-top{width:100%; height:calc(80px * var(--device)); overflow:hidden; position:relative; border-radius:10px 10px 0 0;}
.color-top-main{position:absolute; bottom:0;  z-index:1;
background:#d3b46f;
width:calc(3150px * var(--device)); height:calc(3150px * var(--device));
 left:calc(50% - 1575px * var(--device)); border-radius:50%;}

.color-top-word{position:relative; z-index:2;}

.xfq-title{position:relative;}
.xfq-title:before{content:""; display:inline-block; position:absolute; left:0; top:calc(50% - 15px * var(--device)); width:calc(4px * var(--device)); height:calc(30px * var(--device)); background-color:#333}
.xfq-content{position:relative; height:calc(180px * var(--device)); background: linear-gradient(to right, #72e0bd, #499cbd);}
.xfq-btn{ background: linear-gradient(to right, #7be5bb, #51a2fb);}
.xfq-top,
.xfq-bottom{text-transform:uppercase; color:#fff; position:absolute; z-index:0; opacity:0.15;white-space:nowrap;}
.xfq-top{left:0; right:0 ;text-align:center; top:calc(-14px * var(--device));}
.xfq-bottom{left:0; right:0 ;text-align:center; bottom:calc(-14px * var(--device));}

.dhq-title{position:relative;}
.dhq-title:before{content:""; display:inline-block; position:absolute; left:0; top:calc(50% - 15px * var(--device)); width:calc(4px * var(--device)); height:calc(30px * var(--device)); background-color:#333}
.dhq-content{position:relative; height:calc(180px * var(--device));background: linear-gradient(45deg, #f2711c, #e03997); }
.dhq-btn{ background: linear-gradient(25deg, var(--yellow-light), #ff6a00);}
.dhq-top,
.dhq-bottom{text-transform:uppercase; color:#fff; position:absolute; z-index:0; opacity:0.15;white-space:nowrap;}
.dhq-top{left:0; right:0 ;text-align:center; top:calc(-14px * var(--device));}
.dhq-bottom{left:0; right:0 ;text-align:center; bottom:calc(-14px * var(--device));}