@charset "UTF-8";
:root {
  --primary-color: rgba(13, 32, 20, 1);
  --green-color: rgba(75, 194, 170, 1);
}
@font-face {
      font-family:'bold';           /* 自定义名称 */
      src: url('/static/en/font/Poppins-Semibold.otf') format('otf');
             /* 可选，控制加载行为 
      font-weight: 700;     */  
}
@font-face {
      font-family:'regular';           /* 自定义名称 */
      src: url('/static/en/font/Poppins-Regular.otf') format('otf');
            /* 可选，控制加载行为 */
}
@font-face {
      font-family:'medium';           /* 自定义名称 */
      src: url('/static/en/font/Poppins-Medium.otf') format('otf');
             /* 可选，控制加载行为 */
}

body{
  font-family:'medium';
}
.bold{
    font-family:'bold', sans-serif;
    font-weight: 700;
}
.regular{
    font-family:'regular';
}
.medium{
    font-family:'medium';
}

.same_btn1 {
  width: 232px;
  height: 56px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: #0D2014;
  border-radius: 60px;
  color: #fff;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.same_btn1 > * {
  position: relative;
  z-index: 2;
}
.same_btn1 span {
  margin-right: 2px;
}
.same_btn1:hover {
  -webkit-transform: translateY(-5px);
      -ms-transform: translateY(-5px);
          transform: translateY(-5px);
          background: var(--green-color);
}

.same_btn2 {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: var(--primary-color);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  overflow: hidden;
}
.same_btn2 svg {
  will-change: transform;
  position: absolute; /* 两个箭头重叠在一起 */
  -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  width: 24px;
  height: 24px;
}
.same_btn2:hover {
          background: var(--green-color);
       
}
.same_btn2:hover .arrow-top {
  -webkit-transform: translate(10px, -10px);
      -ms-transform: translate(10px, -10px);
          transform: translate(10px, -10px); /* 向右上角移出 */
  opacity: 0; /* 消失 */
}
.same_btn2:hover .arrow-bottom {
  -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
          transform: translate(0, 0); /* 移动到中心 */
  opacity: 1; /* 出现 */
}
.same_btn2 .arrow-top {
  -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
          transform: translate(0, 0); /* 在中间 */
  opacity: 1;
}
.same_btn2 .arrow-bottom {
  -webkit-transform: translate(-10px, 10px);
      -ms-transform: translate(-10px, 10px);
          transform: translate(-10px, 10px); /* 放在左下角 (左负，下正) */
  opacity: 0; /* 隐藏 */
}

.green {
  color: var(--green-color);
}

.column .column_sub {
  line-height: 1.75;
  padding-left: 24px;
  position: relative;
  color: rgba(13, 32, 20, 0.50);
}
.column .column_sub::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green-color);
  left: 0;
  /* 计算：第一行文字的中心位置 */
  top: calc(0.875em - 4px); /* (字体大小 × 行高 ÷ 2) - (伪元素高度 ÷ 2) */
}
.column .column_tit {
  line-height: 1.34;
  margin-top: 16px;
  font-weight: bold;
}
.column .column_des{
  margin-top: 16px;
}
.column .green {
  font-family: 'bold';
}

.point {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.point span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  margin-right: 12px;
}
.point span:last-child {
  margin-right: 0;
}
@media screen and (max-width: 1700px){
    .same_btn1{
      width: 190px;
      height: 50px;
    }
}
@media screen and (max-width: 768px){
    .same_btn1{
      width: 170px;
      height: 40px;
    }
    .column .column_tit{
      font-size: 20px;
    }
    .column .column_sub{
      padding-left: 15px;
    }
}
