/* ==========================
   全局颜色
========================== */

.custom-support-wrapper{

  --brand:#256643;
  --brand-deep:#1b4c32;
  --bg-main:#FAF8F5;
  --text-muted:#627265;

}



/* ==========================
   PC整体布局
========================== */

.brand-support-section{

  background:var(--bg-main);

  width:100%;
  height:600px;

  position:relative;

  overflow:hidden;

  display:flex;

  align-items:center;

}



/* ==========================
   右侧图片区域
========================== */


.support-image-box{


  position:absolute;

  top:0;

  right:0;


  width:60%;

  height:100%;


  background-image:url('//ueeshop.ly200-cdn.com/u_file/UPBI/UPBI066/2607/15/photo/e0071e91-9689-4c81-8d4b-6de540bc4d24.png');


  background-size:cover;


  background-position:center;


  background-repeat:no-repeat;


  z-index:1;


}




/* ==========================
   左侧纯背景
========================== */


.brand-support-section::before{


  content:"";

  position:absolute;


  left:0;

  top:0;


  width:45%;


  height:100%;


  background:#FAF8F5;


  z-index:2;


}




/* ==========================
   文字区域
========================== */


.support-content-container{


  position:relative;


  z-index:4;


  width:55%;


  margin-left:15%;


}




/* 标题 */


.support-title{


  font-family:'Fraunces',Georgia,serif;


  color:#256643;


  font-size:42px;


  font-weight:450;


  line-height:1.25;


  margin:0 0 22px;


  letter-spacing:-0.02em;


}



/* 描述 */


.support-desc{


  color:var(--text-muted);


  font-size:16px;


  line-height:1.7;


  max-width:430px;


  margin:0 0 35px;


}




/* 按钮 */


.support-btn{


  display:inline-block;


  background:#256643;


  color:#fff!important;


  text-decoration:none!important;


  padding:15px 45px;


  font-size:13px;


  font-weight:600;


  letter-spacing:.1em;


  text-transform:uppercase;


  border-radius:4px;


  transition:.3s;


}



.support-btn:hover{


  background:#1b4c32;


  transform:translateY(-2px);


}



/* ==========================
   平板
========================== */


@media(max-width:1023px){


.support-content-container{

  margin-left:5%;

  width:45%;

}


.support-title{

 font-size:34px;

}


}



/* ==========================
   手机端
========================== */


@media(max-width:768px){


.brand-support-section{


 height:auto;

 display:flex;

 flex-direction:column;

 background:#FAF8F5;


}



/* 删除左侧遮罩 */

.brand-support-section::before{

 display:none;

}




.support-image-box{


 position:relative;


 width:100%;


 height:260px;


 order:1;


 background-position:center;


}




.support-content-container{


 order:2;


 width:100%;


 margin:0;


 padding:40px 24px 60px;


 text-align:center;


}



.support-title{


 font-size:28px;


}



.support-desc{


 font-size:14px;


 margin-left:auto;

 margin-right:auto;


}



.support-btn{


 width:75%;


 max-width:280px;


 padding:13px 0;


}



}