.ham_bg {position: fixed !important;}

#process {overflow-x: hidden;}
#process.sub .sub_rt {overflow-x: visible;}
/* #process .txt_ani_wrap {overflow-y: visible;} */

#process .float_lt {position: fixed; top: 50%; transform: translateY(-50%);}
#process .float_lt a {display: block;}
#process .float_lt a {font-size: 18px; cursor: pointer;}
#process .float_lt a:not(:last-child) {margin-bottom: 35px;}
#process .float_lt a.active {transform: translateX(7px); font-weight: bold;}
#process .big_title {position: relative; font-size: 60px; height: 60px; line-height: 60px;}
#process .process .big_title::before {display: block; font-size: 40px; position: absolute; top: -10px; left: -70px; font-style: italic;}
#process .process1 .big_title::before {content: "01";}
#process .process2 .big_title::before {content: "02";}
#process .process3 .big_title::before {content: "03";}
#process .process4 .big_title::before {content: "04";}
#process .process .cont {padding: 65px 0 200px 0;}
#process .process .step_wrap {display: flex; margin-bottom: 40px; justify-content: space-between;}
#process .process .step {flex: 25% 0 0;}
#process .process .top_p {margin-bottom: 130px; font-size: 17px;}
#process .process .bt_p {margin-top: 130px; font-size: 17px;}
#process .process .step {position: relative;}
#process .process .step .step_top {position: absolute; top: -30px; left: 0; z-index: 1;}
#process .process .step .step_top .step_num {font-size: 18px; color: #818181;}
#process .process .step .step_top .step_title {font-size: 30px; color: #111; font-weight: 900;}
#process .process .step .step_md {position: relative; width: 215px; height: 215px; border-radius: 50%; background: #dedede; margin-bottom: 30px;}
#process .process .step .step_md img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#process .process .step .step_md img.hover_icon {opacity: 0; transition: all 0.2s;}
#process .process .step .step_bt {font-size: 18px; color: #111; font-weight: bold; letter-spacing: -1px;}
#process .process .step:hover .step_md {background: linear-gradient(135deg, #4f11b3, #34006e);}
#process .process .step:hover .step_md img.hover_icon {opacity: 1;}
#process .process .step:hover .step_bt {color: #5012b3;}
#process .process2 {position: relative;}
#process .process2 .port_btn {position: absolute; top: 0; right: 0; width: 180px; height: 180px; border-radius: 50%; border: 1px solid #111; cursor: pointer; transition: all 0.2s;}
#process .process2 .port_btn .port_txt {font-size: 18px; font-style: italic; position: absolute; top: 20%;
 left: 50%; transform: translateX(-50%);}
#process .process2 .port_btn i {font-size: 30px;font-weight: bold; position: absolute; left: 25%; bottom: 32px; transform: translateX(-50%); transition: all 0.2s;}
#process .process2 .port_btn:hover {background: #111; color: #fff;}
#process .process2 .port_btn:hover i {left: 75%;}
#process .process2 .cont {border-top: 0;}
#process .process2 .type {display: flex; width: 100%;}
#process .process2 .type .type_txt.padding_lt {padding-left: 90px;}
#process .process2 .type .type_txt.padding_rt {padding-right: 60px;}
#process .process2 .type .type_txt .type_title {font-size: 30px; margin-bottom: 45px;}
#process .process2 .type .type_txt .type_desc {font-size: 17px;}
#process .process2 .work_mo {display: none;}
#process .process2 .type1 .type_txt {padding-top: 50px;}
#process .process2 .type2 {justify-content: flex-end;}
#process .process2 .type3 {justify-content: center;}
#process .process2 .type4 {margin-top: 100px;}
#process .process2 .type4 > div {flex: 50% 0 0; display: flex; align-items: center;}
#process .process2 .type4 > div .type_txt.padding_lt {padding-left: 30px;}
#process .process2 .type4 > div:nth-child(1) .type_txt.padding_lt {padding-right: 15px;}
#process .process2 .type2 .type_img {transform: translateY(-55px); flex: 50% 0 0;}
#process .process2 .type2 .type_img img {height: 100%;}
#process .process2 .type2 .type_txt {transform: translateY(85px);}
#process .process2 .type3 .type_txt {display: flex; flex-direction: column; justify-content: center;}
#process .process3 .cont {border-top: 0; margin-top: 0;}
#process .process3 .service_row {display: flex; justify-content: space-between;}
#process .process3 .service_row .service_box {flex: 45% 0 0;}
#process .process3 .service_row .service_box .service_img {margin-bottom: 30px;}
#process .process3 .service_row .service_box .service_img img {width: 100%;}
#process .process3 .service_row .service_box .service_txt {margin-bottom: 100px;}
#process .process3 .service_row .service_box .service_txt .service_title {font-size: 24px; margin-bottom: 40px;}
#process .process3 .service_row .service_box .service_txt .service_desc {font-size: 17px;}

#process .process4 .etc_row {display: flex; justify-content: space-between;}
#process .process4 .etc_row .etc_box {flex: 45% 0 0;}
#process .process4 .etc_row .etc_box .etc_img {margin-bottom: 30px;}
#process .process4 .etc_row .etc_box .etc_img img {width: 100%;}
#process .process4 .etc_row .etc_box .etc_txt {margin-bottom: 100px;}
#process .process4 .etc_row .etc_box .etc_txt .etc_title {font-size: 24px;}
#process .process4 .etc_row .etc_box .etc_txt .etc_desc {font-size: 17px;}

#process1, #process2, #process3, #process4 {height: 70px;}

@media screen and (max-width: 1420px) {
  #process .float_lt {left: 30px;}
  #process .float_lt a {font-size: 16px;}
  #process .float_lt a:not(:last-child) {margin-bottom: 25px;}
  #process .big_title {font-size: 50px;}
  #process .process .cont {padding: 40px 0 120px 0; margin-top: 50px;}
  #process .process .top_p {margin-bottom: 110px;}
  #process .process .step .step_top .step_num {font-size: 15px; line-height: 1.75rem;}
  #process .process .step .step_top .step_title {font-size: 24px;}
  #process .process .step .step_md {width: 180px; height: 180px; margin-bottom: 25px;}
  #process .process .step .step_md img {max-width: 65px;}
  #process .process .step .step_bt {font-size: 17px;}
  #process .process .bt_p {margin-top: 100px;}
  #process .process2 .type .type_txt .type_title {font-size: 24px; margin-bottom: 25px;}
  #process .process2 .type .type_txt .type_desc {font-size: 16px;}
  #process .process2 .type .type_txt .type_desc br {display: none;}
  #process .process3 .service_row .service_box .service_txt .service_desc br {display: none;}
  #process .process3 .service_row .service_box .service_txt .service_title {font-size: 22px; margin-bottom: 20px;}
  #process .process3 .service_row .service_box .service_txt .service_desc {font-size: 16px;}
  #process .process3 .cont {padding: 40px 0 50px 0 !important;}
  #process .process .top_p {margin-bottom: 90px;}
  #process .process4 .etc_row .etc_box .etc_txt .etc_title {font-size: 22px;}
  #process .process4 .etc_row .etc_box .etc_txt {margin-bottom: 80px;}
  #process .process4 .etc_row .etc_box .etc_img {margin-bottom: 25px;}
  #process .ani4 {margin-bottom: 50px;}
}

@media screen and (max-width: 1024px) {
  #process .big_title {font-size: 40px;}
  #process .process .big_title::before {font-size: 26px; top: 5px; left: -50px;}
  #process .process .cont {margin-top: 30px; padding: 30px 0 80px 0;}
  #process .process .top_p {margin-bottom: 80px;}
  #process .process .step .step_top .step_num {font-size: 13px; line-height: 1.5rem;}
  #process .process .step .step_top .step_title {font-size: 20px;}
  #process .process .step .step_top {top: -25px;}
  #process .process .step .step_md {width: 150px; height: 150px; margin-bottom: 15px;}
  #process .process .step .step_md img {max-width: 55px;}
  #process .process .step .step_bt {font-size: 12px; line-height: 1.75rem;}
  #process .process .bt_p {font-size: 15px; margin-top: 60px;}
  #process .process2 .port_btn {width: 130px; height: 130px; top: -15px;}
  #process .process2 .port_btn .port_txt {font-size: 16px; line-height: 1.5rem;}
  #process .process2 .port_btn i {left: 27%; bottom: 20px;}
  #process .process2 .type .type_txt.padding_lt {padding-left: 30px; padding-top: 0;}
  #process .process2 .type .type_txt.padding_rt {padding-right: 30px;}
  #process .process2 .type {align-items: center;}
  #process .process2 .type .type_txt .type_title {font-size: 22px; margin-bottom: 15px;}
  #process .process2 .type .type_txt .type_desc {font-size: 14px;}
  #process .process2 .type2 {margin: 60px 0;}
  #process .process2 .type2 .type_img {transform: translate(0);}
  #process .process2 .type2 .type_txt {transform: translate(0);}
  #process .process2 .type4 {margin-top: 60px;}
  #process .process2 .type4 img {max-width: 150px;}
  #process .process3 .service_row .service_box .service_txt {margin-bottom: 60px;}
  #process .process3 .service_row .service_box .service_txt .service_title {font-size: 20px; margin-bottom: 10px;}
  #process .process3 .service_row .service_box .service_txt .service_desc {font-size: 14px; line-height: 1.75rem;}
  #process .process3 .service_row .service_box .service_img {margin-bottom: 20px;}
  #process .process3 .cont {padding: 30px 0 0 0 !important;}
  #process .process4 .etc_row .etc_box .etc_txt .etc_title {font-size: 20px;}
  #process .process4 .etc_row .etc_box .etc_img {margin-bottom: 15px;}
  #process .process4 .etc_row .etc_box .etc_txt {margin-bottom: 60px;}
  #process .process2 .type1 img {max-width: 300px;}
  #process .process2 .type2 img {max-width: 280px;}
  #process .process2 .type3 img {max-width: 280px;}
  #process .process2 .type4 {display: block;}
  #process .process2 .type4 > div {margin-bottom: 10px;}
  #process .ani4 {margin-bottom: 0;}
}

@media screen and (max-width: 768px) {
  #process .big_title {font-size: 32px;}
  #process .process .big_title::before {font-size: 16px; top: 0; left: -28px;}
  #process .process .cont {margin-top: 0; padding: 20px 0 40px 0;}
  #process .process .top_p {font-size: 15px; margin-bottom: 60px;}
  #process .process .step .step_top .step_num {font-size: 12px; line-height: 1rem;}
  #process .process .step .step_top .step_title {font-size: 18px;}
  #process .process .step .step_md {width: 120px; height: 120px; }
  #process .process .step .step_md img {max-width: 50px;}
  #process .process .step .step_top {top: -20px;}
  #process .process .step .step_bt {font-size: 10px; line-height: 1.5rem;}
  #process .process .bt_p {font-size: 14px; margin-top: 40px;}
  #process .process2 .port_btn {width: 100px; height: 100px; top: -40px;}
  #process .process2 .port_btn .port_txt {font-size: 14px; line-height: 1.25rem;}
  #process .process2 .port_btn i {bottom: 10px; font-size: 24px;}
  #process .process2 .type .type_txt .type_title {font-size: 20px; margin-bottom: 10px;}
  #process .process2 .type .type_txt .type_desc {font-size: 13px;}
  #process .process2 .type2 {margin: 40px 0;}
  #process .process2 .type4 {margin-top: 40px;}
  #process .process3 .service_row .service_box .service_txt .service_title {font-size: 18px; margin-bottom: 7px;}
  #process .process3 .service_row .service_box .service_txt .service_desc {font-size: 13px; line-height: 1.625rem;}
  #process1, #process2, #process3, #process4 {height: 40px;}
  #process .process4 .etc_row .etc_box .etc_txt .etc_title {font-size: 18px;}
  #process .process4 .etc_row .etc_box .etc_img {margin-bottom: 12px;}
  #process .process4 .etc_row .etc_box .etc_txt {margin-bottom: 40px;}


}

@media screen and (max-width: 560px) {
  #process .big_title {font-size: 26px;}
  #process .process .big_title::before {font-size: 12px; top: -22px; left: 0;}
  #process .process .cont {padding: 20px 0 30px 0;}
  .animate_line {margin-top: 0;}
  #process .process .step_wrap {flex-wrap: wrap;}
  #process .process .step {flex: 46% 0 0; margin-bottom: 40px;/* margin: 0 2% 40px 2%; */}
  #process .process .step:nth-child(2n) {margin-left: 4%;}
  #process .process .step3, #process .process .step4 {margin-bottom: 0;}
  #process .process .top_p {font-size: 12px; margin-bottom: 70px; line-height: 1.5rem;}
  #process .process .step .step_bt {font-size: 11px; line-height: 1.25rem;}
  #process .process .step .step_top .step_num {font-size: 10px; line-height: 0.75rem;}
  #process .process .step .step_top .step_title {font-size: 15px;}
  #process .process .step .step_top {top: -15px;}
  #process .process .step .step_md {width: 145px; height: 145px;}
  #process .process2 .type .type_txt .type_title {font-size: 18px; margin-bottom: 6px; margin-top: 17px;}
  #process .process2 .type .type_txt .type_desc {font-size: 12px;}
  #process .process .bt_p br {display: none;}
  #process .process .bt_p {margin-top: 70px; font-size: 12px;}
  #process .process2 .type {display: block;}
  #process .process2 .type .type_txt.padding_lt {padding-left: 0; margin-top: 17px;}
  #process .process2 .type img {max-width: none; width: 100%;}
  #process .process2 .type2 {margin: 30px 0;}
  #process .process2 .type .type_txt.padding_rt {padding-right: 0; margin-bottom: 17px;}
  #process .process2 .type4 img {max-width: 110px !important; width: auto !important;}
  #process .process2 .type5 img {max-width: 110px !important; width: auto !important;}
  #process .process2 .type4 > div .type_txt.padding_lt {padding-left: 20px;}
  #process .process2 .type4 > div .type_txt.padding_lt {padding-right: 0; margin-top: 0;}
  #process .process2 .type4 > div .type_txt.padding_lt .type_title {margin-top: 0;}
  #process .process2 .type4 > div .type_txt.padding_lt .type_desc {line-height: 1.25rem;}
  #process .process2 .port_btn {width: 145px; height: 145px; top: -70px; right: -55px; z-index: 1;}
  #process .process2 .port_btn .port_txt {font-size: 16px; line-height: 1.5rem;}
  #process .process2 .port_btn i {bottom: 20px;}
  #process .process3 .cont {padding: 20px 0 0 0 !important;}
  #process .process3 .service_row .service_box {flex: 47% 0 0;}
  #process .process3 .service_row .service_box .service_img {margin-bottom: 12px;}
  #process .process3 .service_row .service_box .service_txt .service_title {font-size: 15px; margin-bottom: 5px;}
  #process .process3 .service_row .service_box .service_txt .service_desc {font-size: 12px; line-height: 1.5rem;}
  #process .process3 .service_row .service_box .service_txt {margin-bottom: 40px;}
  #process .process3 .service_row .service_box:nth-child(7) .service_txt {margin-bottom: 0;}
  #process .process3 .service_row .service_box:nth-child(8) .service_txt {margin-bottom: 0;}
  #process .process4 .etc_row .etc_box {flex: 47% 0 0;}
  #process .process4 .etc_row .etc_box .etc_txt {margin-bottom: 20px;}
  #process .process4 .etc_row .etc_box .etc_txt .etc_title {font-size: 14px; line-height: 1.325rem;}
  #process .process4 .cont {padding: 20px 0 100px 0;}
  #process .process2 .work_pc {display: none;}
  #process .process2 .work_mo {display: block;}
  #process .process4 .top_p {margin-bottom: 20px;}
}

@media screen and (max-width: 414px) {
  #process .process .step .step_md {width: 130px; height: 130px; flex: 40% 0 0; margin: 0 5%;}
}

@media screen and (max-width: 414px) {
  #process .process .step .step_md {width: 110px; height: 110px; flex: 40% 0 0; margin: 0 5%;}
}