.sub_banner {width:100%; background: url(/img/intro_neat_title.jpg) no-repeat center / cover; text-align: center;}
.sub_banner h3 {padding:280px 0px; font-size:62px; font-weight:var(--weight_bold); color:#fff;}
.nav_line {padding:20px 0px; border-bottom:1px solid #ddd;}
.nav_line .container {display: flex; align-items: center; justify-content: space-between;}
.nav_line .sub_nav ul {display: flex; align-items: center;}
.nav_line .sub_nav ul li {margin-right:60px; position: relative;}
.nav_line .sub_nav ul li:last-child {margin-right:0;}
.nav_line .sub_nav ul li a {font-size:20px;}
.nav_line .sub_nav ul .active a {font-weight:var(--weight_bold); color: var(--main-color);}
.nav_line .sub_nav ul .active::after {display: block; content: ''; position: absolute; width:100%; background: var(--main-color); height: 1px; top:40px;}

.sc_1 {padding:150px 0px;}
.sc_1 .text_box {display: flex; align-items: center; justify-content: space-between;}
.sc_1 .text_box .circle_title {font-size:50px; font-weight:var(--weight_bold); line-height: 1.3;}
.sc_1 .text_box .circle_title::before {top: -8px;}
.sc_1 .text_box article {font-size:20px; line-height: 1.5; width: 740px;}

.sc_2 {width:100%; padding:200px 0px; position: relative; background: #F9F9F9;}
.sc_2 .item {display: flex; align-items: center; margin-bottom:250px;}
.sc_2 .item:last-child {margin-bottom: 0;}
.sc_2 .item .text_box {width:624px;}
.sc_2 .item .text_box img {margin-bottom:20px;}
.sc_2 .item .text_box p {font-size:43px; font-weight:var(--weight_bold); line-height: 1.5; margin-bottom:30px;}
.sc_2 .item .text_box span {font-size:20px; line-height: 1.5;}
.sc_2 .item .img_box {position: absolute; right:0; width: 790px;}
.sc_2 .item .img_box img {width:100%;}
.sc_2 .item.left {justify-content: flex-end;}
.sc_2 .item.left .img_box {left:0;}

.sc_3 {width: 100%; padding:150px 0px;}
.sc_3 .table_wrap {margin-bottom:150px;}
.sc_3 .sc_3_content {text-align: center;}
.sc_3 .sc_3_content h4 {font-size:30px; font-weight: var(--weight_bold); margin-bottom:30px;}
.sc_3 .sc_3_content ul {display: flex; justify-content: space-between; padding:25px; border: 1px dashed var(--indigo_light); border-radius: 500px; position: relative; z-index: 1;}
.sc_3 .sc_3_content ul li {width:297px; height:297px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 100%; overflow: hidden;}
.sc_3 .sc_3_content ul li p {font-size:30px; font-weight: var(--weight_bold); margin-bottom:15px;}
.sc_3 .sc_3_content ul li span {font-size:20px; line-height: 1.5;}
.sc_3 .sc_3_content ul .border {z-index: -1; display: block; width: 90%; height: 2px; background: var(--indigo_light); position: absolute; left: 50%;  top: 50%; transform: translate(-50%, -50%);}

.sc_4 {padding:180px 0px; background: url(/img/neat_sc_4_bg.jpg) no-repeat center / cover;}
.sc_4 h4 {font-size:50px; font-weight:var(--weight_bold); color:#fff; text-align: center; margin-bottom:80px; line-height: 1.5;}
.sc_4 ul {display:flex; justify-content: space-between;}
.sc_4 ul li {padding:100px 50px; box-sizing: border-box; border-radius: 30px; width:25%; margin-right:70px; background: #fff; text-align: center; position: relative;}
.sc_4 ul li:after {content: ''; display: block; position:absolute; top:50%; transform: translateY(-50%); right:-30px; width: 0;height:0;border-style:solid;border-width:40px 0 40px 30px;border-color:transparent transparent transparent var(--light_blue);}
.sc_4 ul li:nth-child(2n)::after {border-color:transparent transparent transparent var(--mint);}
.sc_4 ul li:nth-child(3n)::after {border-color:transparent transparent transparent var(--red_orange);}
.sc_4 ul li:last-child {margin-right:0;}
.sc_4 ul li:last-child::after {display: none;}
.sc_4 ul li img {margin-bottom:10px;}
.sc_4 ul li p {font-size:24px; font-weight:var(--weight_bold); margin-bottom:20px;}
.sc_4 ul li span {font-size:18px; line-height: 1.5;}

@media (max-width: 1580px){
    .sc_2 .item .img_box {width: auto;}
    .sc_2 .item .img_box img {width: 45vw;}
}

@media (max-width: 1280px){
    .nav_line {position: relative;}
    .nav_line .page_location {position: absolute; left:50%; transform:translateX(-50%); top:-40px;}
    .nav_line .page_location a {color:#fff;}
    .nav_line .page_location p {color:#fff;}
    .nav_line .page_location span {color:#fff;}
    .nav_line .page_location span img {content:url('/src/img/location_arrow_w.png');}
    
    .nav_line .sub_nav {width: 100%;}
    .nav_line .sub_nav ul {justify-content: center;}
    .nav_line .sub_nav ul li a {font-size:16px;}
    .nav_line .sub_nav ul .active::after {top: 36px;}

    .sc_1 .text_box {flex-direction: column; align-items: flex-start;}
    .sc_1 .text_box article {width: 100%;}
    .sc_1 .text_box .circle_title {font-size:40px;}

    .sc_2 {padding:80px 0px;}
    .sc_2 .container {width: 100%; overflow: hidden;}
    .sc_2 .item {flex-direction: column-reverse; margin-bottom:80px;}
    .sc_2 .item.left {flex-direction: column;}
    .sc_2 .item .img_box {width: auto; position: relative; margin-bottom:30px; left: 20px;}
    .sc_2 .item.left .img_box {left: -20px;}
    .sc_2 .item .img_box img {width: 100%;}
    .sc_2 .item .text_box {margin-left:20px;}

    .sc_3 {padding:80px 0px;}
    .sc_3 .table_wrap {margin-bottom:100px;}
    .sc_3 .sc_3_content ul {padding:15px;}
    .sc_3 .sc_3_content ul li {width: 160px; height: 160px;}
    .sc_3 .sc_3_content ul li p {font-size:18px;}
    .sc_3 .sc_3_content ul li span {font-size:14px;}

    .sc_4 ul {flex-direction: column;}
    .sc_4 ul li {width: 80%; margin :0 auto 100px;}
    .sc_4 ul li:after {left: 50%; top: auto; transform: translate(-50%,-50%); bottom: -60px; border-width: 40px 80px 0px 80px; border-color: var(--light_blue) transparent transparent transparent;}
    .sc_4 ul li:nth-child(2n)::after {border-color: var(--mint) transparent transparent transparent;}
    .sc_4 ul li:nth-child(3n)::after {border-color: var(--red_orange) transparent transparent transparent;}
    .sc_4 ul li:last-child {margin: 0 auto;}
}

@media (max-width: 768px){
    .sub_banner h3 {font-size:40px; padding:80px 0px 110px;}
    .nav_line .sub_nav {width: 100%;}
    .nav_line .sub_nav ul li {margin-right:15px;}
    .nav_line .sub_nav ul li a {font-size:14px;}
    .nav_line .sub_nav ul .active::after {top: 34px;}
    .nav_line .page_location p {width: 91px;}

    .sc_1 {padding:90px 0px 60px;}
    .sc_1 .text_box .circle_title {font-size:30px;}
    .sc_1 .text_box .circle_title::before {bottom:0px;}
    .sc_1 .text_box article {font-size:16px; word-break: break-all;}

    .sc_2 .item .text_box {width: auto; padding-right: 10px;}
    .sc_2 .item .text_box p {font-size:27px; margin-bottom:25px;}
    .sc_2 .item .text_box p br {display: none;}
    .sc_2 .item .text_box span {font-size:16px;}

    .sc_3 .sc_3_content h4 {font-size:24px;}
    .sc_3 .sc_3_content ul {flex-direction: column; width: fit-content; margin: 0 auto;}
    .sc_3 .sc_3_content ul li {width: 280px; height:280px; margin-bottom:10px;}
    .sc_3 .sc_3_content ul li p {font-size:24px;}
    .sc_3 .sc_3_content ul li span {font-size:16px;}
    .sc_3 .sc_3_content ul .border {width: 2px; height: 90%; top:20px; transform: translate(-50%, 0px);}

    .sc_4 {padding: 80px 0px; background: url(/img/sc_3_bg.jpg) no-repeat left -630px center / cover;}
    .sc_4 h4 {font-size: 30px; line-height: 1.5; margin-bottom: 30px;}
    .sc_4 h4 br {display: block;}
    .sc_4 ul li {max-width: 260px; padding:60px 0px; margin-bottom:50px;}
    .sc_4 ul li:after {border-width: 30px 40px 0px 40px; bottom: -45px;}

}   