#sec1 {position: relative; overflow: hidden;}
#sec1 video {min-width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

#sec1 {height: 100vh; width: 100%; /* background: url(/img/main_bg.png) no-repeat center center; background-size: cover; */}
#sec1 .wrapper {position: relative; height: 100%; color: #fff;}
#sec1 .main_title {position: absolute; left: 0; bottom: 15%; letter-spacing: 0;}
#sec1 .main_title .thin {font-size: 1.4375em; margin-bottom: 30px;}
#sec1 .main_title .bold {font-size: 2.125em;}
#sec1 .main_title .bold h1 {line-height: 100%;}
#sec1 .main_title .bold h1:first-child {margin-bottom: 40px;}
#sec1 .scroll_btn {position: absolute; left: 50%; transform: translateX(-50%); bottom: 20px; font-size: 11px;
  animation-duration: 1s;
  animation-name: scroll;
  animation-iteration-count: infinite;
  animation-direction: initial;
  animation-timing-function: linear;
  text-align: center;
}
@keyframes scroll {
  0% {transform: translateY(-30px); opacity: 1;}
  50% {transform: translateY(-15px); opacity: 0.5;}
  100% {transform: translateY(0); opacity: 0.1;}
}

#sec2 {padding-top: 65px;}
#sec2 .marq {width: 100%;  overflow: hidden; position: relative;}
#sec2 .marq .bold {letter-spacing: 1px; color: #eee; font-weight: 900;}
#sec2 .marq1 .bold {font-size: 14.875em; height: 170px; line-height: 170px;}
#sec2 .marq2 .bold {font-size: 8.9375em; height: 110px; line-height: 110px;}
#sec2 .marq2 {text-align: right;}

/* #sec2 .marquee1 {height: 170px; line-height: 170px;}
#sec2 .marquee1 > div {height: 170px;}
#sec2 .marquee2 {height: 110px; line-height: 110px;}
#sec2 .marquee2 > div {height: 110px;}
#sec2 .marquee > div { display: block; width: 400%; height: 170px; position: absolute; overflow: hidden;;}
#sec2 .marquee1 > div {animation: marquee1 6s linear infinite;}
#sec2 .marquee2 > div {animation: marquee2 6s linear infinite;}
#sec2 .marquee > div > span {
  float: left; width: 25%;
  display: inline;
  text-align: center;
  height: 100%;
  letter-spacing: 1px;
  color: #eee;
}
#sec2 .marquee > div > span > span {text-align: center; font-weight: 900;}
#sec2 .marquee1 {font-size: 14.875em;}
#sec2 .marquee2 {font-size: 8.9375em;} */

#sec2 .flex {position: relative; margin-top: -50px; margin-bottom: 70px; padding-bottom: 3.5%;}
#sec2 .flex .lt {width: 35%; position: relative; border-radius: 70px; overflow: hidden; height: 0; padding-bottom: 29.5%;}
#sec2 .flex .lt > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.3s; width: 100%; height: 100%;}
#sec2 .flex .rt {position: absolute; right: 0; bottom: 0; background: #fff; border-radius: 70px; padding: 5% 5% 3.5% 5%; width: 70%; transform: rotate(-0.03deg); display: flex; flex-direction: column; align-items: flex-start; justify-content: center;}
#sec2 .flex .rt .bold {font-size: 2.1875em;}
#sec2 .flex .rt .grey {margin: 30px 0 60px 0; font-size: 1.125em;}
#sec2 .flex .rt {transition: all 0.3s;}

#sec3 {padding: 50px 0 120px 0;}

#sec4 .top {text-align: center; margin-bottom: 90px;}
#sec4 .top .green {font-size: 1.0625em; letter-spacing: 3px; margin-bottom: 12px;}
#sec4 .top .title {font-size: 2.1875em; line-height: 150%;}
#sec4 .bt {position: relative;}
#sec4 .bt::before {content: ""; width: 100%; height: 70%; display: block; background: #223a1b; position: absolute; left: 0; bottom: 0;}
#sec4 .bt::after {content: ""; width: 100%; height: 70%; display: block; background: url(/img/sec5_bg.png) no-repeat 3% bottom; position: absolute; left: 0; bottom: 0;}

#sec4 .bt .business_slie .swiper-wrapper {z-index: 10;}
#sec4 .bt .business_slide .swiper-slide {
  width: 100%;
  max-width: 875px;
  border-radius: 50px 50px 0 50px;
  overflow: hidden;
  box-shadow: 0 30px 15px 0px rgb(18 18 17 / 20%);
  background: #fff;
}
#sec4 .bt .business_slide .swiper-slide-active{transform: scale(1); transform: translateY(-40px) !important;}
#sec4 .bt .box .img_wrap {width: 100%; height: 0; padding-bottom: 40%; position: relative; overflow: hidden;}
#sec4 .bt .box .img_wrap img {width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#sec4 .bt .box .txt_wrap {padding: 30px 0 20px 0; text-align: center;}
#sec4 .bt .box .txt_wrap .title {display: flex; align-items: center; justify-content: center;}
#sec4 .bt .box .txt_wrap .title .green {font-size: 1em; font-weight: 900; margin-right: 10px;}
#sec4 .bt .box .txt_wrap .title .bold {font-size: 1.875em; letter-spacing: 0;}
#sec4 .bt .box .txt_wrap .desc {font-size: 1.0625em; margin: 5px auto 15px auto;}
#sec4 .bt .box .txt_wrap .badge_wrap {display: flex; justify-content: center;}
#sec4 .bt .box .txt_wrap .badge_wrap li {font-size: 0.8125em; padding: 3px 15px; background: #eff5ed; color: rgba(34, 58, 27, 0.75); text-align: center; margin: 0 3px; border-radius: 20px; letter-spacing: 0;}
#sec4 .bt_green {padding: 35px 0 70px 0; width: 100%; max-width: 875px; margin: 0 auto; color: #fff; position: relative;}
#sec4 .bt_green li {display: none;}
#sec4 .bt_green li.active {display: block;}
#sec4 .bt_green .flex {width: 100%; display: flex; justify-content: center; text-align: center;}
#sec4 .bt_green .flex > div {width: 40%; box-sizing: border-box;}
#sec4 .bt_green .flex > div:first-child {border-right: 1px solid rgba(255,255,255,0.15);}
#sec4 .bt_green .flex > div .md {font-size: 1.625em; margin-bottom: 20px;}
#sec4 .bt_green .flex > div .light {font-size: 1.125em; opacity: 0.5; line-height: 180%;}

#sec4 .slide_arrow {position: absolute; bottom: 40px; left: 50%; margin-left: 307px; background: #ffa930; z-index: 5;}
#sec4 .slide_arrow::before {content: ""; display: block; height: 25px; width: 1px; background: rgba(255,255,255,0.35); top: 50%; left: 50%; transform: translate(-50%,-50%); position: absolute;}
#sec4 .slide_arrow .business_prev {
  float: left;
  position: static;
  margin: 0;
  display: block;
  width: 65px;
  height: 55px;
  background-image: url(/img/slide_prev.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: auto;
}
#sec4 .slide_arrow .business_next {
  float: left;
  position: relative;
  top: auto;
  right: auto;
  margin: 0;
  display: block;
  width: 65px;
  height: 55px;
  background-image: url(/img/slide_next.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: auto;
}

#sec5 {background: url(/img/sec6_bg.png) no-repeat center center; background-size: cover; padding: 130px 0 100px 0;}
#sec5 .title {font-size: 2.1875em; text-align: center; color: #fff;}
#sec5 .logo_wrap {margin: 80px 0; width: 102%; margin-left: -1%;}
#sec5 .logo_wrap li {width: 18%; margin: 0 1% 2% 1%; height: 100px; position: relative; overflow: hidden;}
#sec5 .logo_wrap li a {width: 100%;}
#sec5 .logo_wrap li a img {width: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#sec5 .logo_wrap li:nth-child(2) a img {width: 80%;}
#sec5 .logo_wrap li:nth-child(6) a img {width: 80%;}
#sec5 .logo_wrap li:nth-child(8) a img {width: 70%;}
#sec5 .logo_wrap li:nth-child(9) a img {width: 70%;}
#sec5 .logo_wrap li:nth-child(10) a img {width: 70%;}
#sec5 .logo_wrap li:nth-child(2) a img,
#sec5 .logo_wrap li:nth-child(3) a img,
#sec5 .logo_wrap li:nth-child(6) a img,
#sec5 .logo_wrap li:nth-child(8) a img {top: 54%;}
#sec5 .logo_wrap li:nth-child(9) a img {top: 46%;}
#sec5 .more_btn {background: transparent; border: 1px solid #fff; margin: 0 auto; color: #fff; display: block; width: fit-content; padding: 15px 45px;}
#sec5 .more_btn::before {background: #fff;}
#sec5 .more_btn:hover {color: #111;}

#sec6 {padding: 70px 0 80px 0; background: #fff;}
#sec6 .flex {align-items: flex-start;}
#sec6 .flex .green {font-size: 1.625em; width: 25%;}
#sec6 .flex .news_wrap {width: 75%;}
#sec6 .flex .news_wrap ul {display: flex; flex-wrap: wrap; width: 101%; margin-left: -0.5%;}
#sec6 .flex .news_wrap ul li {width: 32.3333%; margin: 0 0.5% 50px 0.5%;}
#sec6 .flex .news_wrap ul li:hover .img_wrap img {transform: translate(-50%, -50%) scale(1.05);}
#sec6 .flex .news_wrap ul li:hover .txt .title {text-decoration: underline;}
#sec6 .flex .news_wrap ul li a .img_wrap {position: relative; overflow: hidden; height: 0; padding-bottom: 76.25%;}
#sec6 .flex .news_wrap ul li a .img_wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; transition: all 0.3s;}
#sec6 .flex .news_wrap ul li a .txt .title {font-size: 1.125em; margin: 20px 0 35px 0; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
#sec6 .flex .news_wrap ul li a .txt .date {font-size: 0.9375em; font-weight: 500; color: #888;}
#sec6 .more_btn {background: #fff; color: #223a1b; padding: 15px 45px;}
#sec6 .more_btn:hover {color: #fff;}


@media screen and (max-width: 2320px) {
  #sec1 video {width: auto; min-width: auto; /* height: 100%; */}
}

@media screen and (max-width: 1540px) {
  #sec1 .main_title {left: 50px;}
}

@media screen and (max-width: 1240px) {
  #sec2 .flex {padding-bottom: 7.5%; margin-bottom: 3%;}
  #sec2 .flex .lt {width: 40%; padding-bottom: 34%;}
  #sec2 .flex .rt {width: 65%;}
}

@media screen and (max-width: 1024px) {
  #sec2 .flex {padding-bottom: 12.5%;}
  #sec2 .flex .rt .bold {font-size: 1.875em;}
  #sec2 .flex .rt .grey {font-size: 1.111em; margin: 5% 0 10% 0;}
  #sec2 .marq1 .bold {font-size: 12em;}
  #sec2 .marq2 .bold {font-size: 8em;}

  #sec6 {padding: 5% 0 7% 0;}
  #sec6 .flex {display: block;}
  #sec6 .flex .green {margin-bottom: 3%; width: 100%;}
  #sec6 .flex .news_wrap {width: 100%;}
  #sec6 .flex .news_wrap ul {width: 102%; margin-left: -1%;}
  #sec6 .flex .news_wrap ul li {width: 31.3333%; margin: 0 1% 7% 1%;}
  
}

@media screen and (max-width: 900px) {
  #sec4 .bt .business_slide .swiper-slide {max-width: 730px;}
  #sec4 .slide_arrow {margin-left: 235px;}
}

@media screen and (max-width: 768px) {
  /* #sec1 {height: 70vh;} */
  #sec1 .main_title {left: 20px;}
  #sec1 .main_title .thin {margin-bottom: 4%; font-size: 1.325em; letter-spacing: 1px;}
  #sec1 .main_title .bold h1 {line-height: 110%;}
  #sec1 .main_title .bold h1:first-child {margin-bottom: 6%;}

  #sec2 {padding-top: 5%;}
  #sec2 .marq1 .bold {height: 120px; line-height: 120px; font-size: 9em;}
  #sec2 .marq2 .bold {height: 70px; line-height: 70px; font-size: 5em;}
  #sec2 .flex {margin-bottom: 2%; padding-bottom: 15%; padding-right: 0;}
  #sec2 .flex .lt {border-radius: 30px;}
  #sec2 .flex .rt {border-radius: 30px; width: 70%; padding-right: 0;}
  
  #sec3 {padding: 5% 0 10% 0;}

  #sec4 .top {margin-bottom: 10%;}
  #sec4 .top .green {font-size: 1em; margin-bottom: 1.5%;}
  #sec4 .top .title {font-size: 1.875em; line-height: 135%;}
  #sec4 .bt_green {padding: 2% 0 7% 0;}
  #sec4 .bt .business_slide .swiper-slide {max-width: 670px;}
  #sec4 .slide_arrow {margin-left: 205px;}

  #sec5 {padding: 10% 0 12% 0;}
  #sec5 .logo_wrap {margin: 8% 0;}
  #sec5 .logo_wrap li {width: 31.3333%;}
  #sec5 .more_btn {padding: 3.25% 10%;}

  #sec6 .more_btn {padding: 3.25% 10%;}
  #sec6 .flex .news_wrap ul li a .txt .title {font-size: 1.111em; margin: 5% 0 12% 0;}
}

@media screen and (max-width: 700px) {
  #sec4 .bt .business_slide .swiper-slide {max-width: 500px;}
  #sec4 .slide_arrow {margin-left: 150px;}
  #sec4 .slide_arrow .business_prev {width: 50px; height: 40px; background-size: 20px;}
  #sec4 .slide_arrow .business_next {width: 50px; height: 40px; background-size: 20px;}
}

@media screen and (max-width: 540px) {
  #sec1 .main_title .bold {font-size: 1.875em;}
  #sec1 .main_title {bottom: auto; top: 65%; transform: translateY(-50%);}

  #sec2 .flex {display: block; padding-bottom: 0; margin-top: -7%; padding-left: 0;}
  #sec2 .flex .lt {width: 80%; padding-bottom: 50%; border-radius: 0 30px 30px 0;}
  #sec2 .flex .lt > img {height: auto;}
  #sec2 .flex .rt {width: 90%; position: relative; margin-left: auto; margin-top: -15%;}
  #sec2 .marq1 .bold {font-size: 17vw; height: auto; line-height: inherit;}
  #sec2 .marq2 .bold {font-size: 11vw; height: auto; line-height: inherit;}
  /* #sec2 .marquee1 > div > span {width: 35%;}
  #sec2 .marquee2 > div > span {width: 30%;} */

  #sec3 {padding: 10% 0 15% 0;}
  
  #sec4 .top {margin-bottom: 12%;}
  #sec4 .top .title {font-size: 1.75em;}
  #sec4 .bt .box .txt_wrap {padding: 3.5% 0 10% 0;}
  #sec4 .bt_green {padding: 0 0 7% 0;}
  #sec4 .bt_green .flex > div .md {font-size: 1.0625em; margin-bottom: 7%;}
  #sec4 .bt_green .flex > div .light {font-size: 0.8125em;}
  #sec4 .bt .business_slide .swiper-slide {border-radius: 30px 30px 0 30px;max-width: 400px;}
  #sec4 .slide_arrow {margin-left: 120px;}
  #sec4 .slide_arrow .business_prev {width: 40px; height: 35px; background-size: 15px;}
  #sec4 .slide_arrow .business_next {width: 40px; height: 35px; background-size: 15px;}
  #sec4 .bt .box .txt_wrap .badge_wrap li {padding: 3px 10px;}
  #sec4 .bt .box .txt_wrap .desc br.br_mo {display: block;}
  #sec4 .bt .business_slide {margin-bottom: -3%;}
  
  #sec5 {padding: 15% 0;}
  #sec5 .title {font-size: 1.75em;}
  #sec5 .logo_wrap {margin: 8% 0 5% 0;}
  #sec5 .logo_wrap li {width: 46%; margin: 0 2% 4% 2%; height: 65px;}
  #sec5 .logo_wrap li a {max-height: 95%;}
  #sec5 .logo_wrap li a img {width: 60%;}
  #sec5 .logo_wrap li:nth-child(2) a img {width: 100%;}
  #sec5 .logo_wrap li:nth-child(6) a img {width: 100%;}
  #sec5 .logo_wrap li:nth-child(8) a img {width: 80%;}
  #sec5 .logo_wrap li:nth-child(9) a img {width: 80%;}
  #sec5 .logo_wrap li:nth-child(10) a img {width: 80%; top: 55%;}
  #sec5 .logo_wrap li:nth-child(2) a img,
  #sec5 .logo_wrap li:nth-child(3) a img,
  #sec5 .logo_wrap li:nth-child(6) a img,
  #sec5 .logo_wrap li:nth-child(8) a img {top: 54%;}
  #sec5 .logo_wrap li:nth-child(9) a img {top: 46%;}

  #sec6 {padding: 10% 0 12% 0;}
  #sec6 .flex .news_wrap ul li {width: 48%;}
  #sec6 .flex .news_wrap ul li:nth-child(5),
  #sec6 .flex .news_wrap ul li:nth-child(6) {display: none;}
  #sec6 .flex .news_wrap ul li a .txt .title {margin: 4% 0 10% 0;}
}

@media screen and (max-width: 414px) {
  #sec1 .main_title .bold {font-size: 1.5em;}
  #sec2 .flex .rt {width: 95%;}
  #sec2 .flex .rt .bold {font-size: 1.75em;}
  #sec2 .flex .rt .grey {margin: 4% 0 8% 0;}

  #sec4 .top {margin-bottom: 15%;}
  #sec4 .top .green {margin-bottom: 2%;}
  #sec4 .top .title {font-size: 1.5em;}
  #sec4 .bt_green {margin-top: -2%; padding: 0 0 9% 0;}
  #sec4 .bt .business_slide .swiper-slide {max-width: 370px;}
  #sec4 .slide_arrow {margin-left: 115px;}
  #sec4 .slide_arrow .business_prev {width: 35px; height: 30px; background-size: 13px;}
  #sec4 .slide_arrow .business_next {width: 35px; height: 30px; background-size: 13px;}
  /* #sec4 .bt_green .flex > div .light {font-size: 1em;} */

  #sec5 .title {font-size: 1.625em;}
}

@media screen and (max-width: 375px) {
  #sec4 .bt .business_slide .swiper-slide {max-width: 340px;}
  #sec4 .slide_arrow {margin-left: 100px;}

  #sec5 .title {font-size: 1.4em;}
}

@media screen and (max-width: 370px) {
  /* #sec2 .marquee1 > div > span {width: 40%;}
  #sec2 .marquee2 > div > span {width: 35%;} */
  #sec2 .flex .rt .bold {font-size: 1.625em;}
  

}