@charset "utf-8";
/* CSS Document */
/*首页内容部分调整<=992 平板*/

@media (max-width: 1720px) {
  body,
  html {
    font-size: 58.5%;
  }
  .area0 .contain .imgs,
  .area3_0 .contain .imgs,
  .joba_0 .contain .imgs  {
  bottom: -13rem;
}
.w100p12 {
    padding-left: 10%;
    padding-right: 10%;
  }
  .i_part2 .data {
    margin-top: 10%;
  }

  .banner .swiper .swiper-slide img {
    object-position: 95%;
    height: 50%;
    margin-top: 8%;
  }
  header .nav ul,
  header .rr {
    gap: 0 64px;
  }
}

@media (max-width: 1520px) {
    body,
  html {
    font-size: 55.5%;
  }
  .area0 .contain .imgs,
  .area3_0 .contain .imgs,
  .culture .contain .imgs,
  .joba_0 .contain .imgs {
    bottom: -12rem;
  }
  .area2_0 .contain .imgs {
    bottom: -12.1rem;
    right: -3rem;
  }
  .team .contain .ll .tt1 {
    padding-bottom: 0;
  }
  .w100p12 {
    padding-left: 5%;
    padding-right: 5%;
  }
  .w100p10 {
    padding-left: 5%;
    padding-right: 5%;
  }
  .wall {
    width: 75%;
  }
  .wall2 {
    width: 71%;
  }
  header .navBox {
    padding: 0 5%;
  }
  .banner .swiper .txtBox {
    left: 6%;
  }
  .banner .search {
    left: 5%;
  }
  .banner .other {
    padding-right: 5%;
  }
  .banner .swiper .txtBox h2 {
    font-size: 4.2rem;
  }
  .banner .swiper .txtBox h3 {
    font-size: 1.6rem;
  }
  .banner .swiper .swiper-slide img {
    height: 60%;
  }
  .footer {
    margin-top: 0;
  }
  .i_part4 .aa .table {
    margin-top: 64px;
  }
}
@media (max-width: 1457px) {
  /* .banner .swiper .swiper-slide img {
    object-position: 55%;
  } */
  
  header .ll .logo img {
    height: 28px;
  }
}
/* 底部栏 End*/
@media (max-width: 1420px) {
  .banner .swiper .swiper-slide .imgBox {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .banner .swiper .swiper-slide img {
    height: auto;
    margin: 0;
  }
  .about2 .tt1 h6 {
    font-size: 8rem;
  }
  .about2 .tt1 h5 {
    font-size: 12rem;
  }
  .area0 .contain .imgs,
  .area3_0 .contain .imgs,
  .culture .contain .imgs,
  .joba_0 .contain .imgs {
    bottom: -12.5rem;
  }
  .pro .contain .ll .bg img {
    max-width: 84%;
  }
  .more2 img {
    width: 15rem;
  }
  .pro .contain .ll .tt {
    padding-left: 5rem;
  }
  .pro .contain .more2 {
    left: 5rem;
  }
  .team .contain .ll .tt2 p::before {
    width: 10px;
    height: 10px;
  }
  .jobb_1 .search input {
    line-height: 46px;
  }
}
@media (max-width: 1367px) {
  body,
  html {
    font-size: 50.5%;
  }
}
@media (max-width: 1280px) {
  header .nav ul,
  header .rr {
    gap: 0 48px;
  }
  header .ll .logo img {
    height: 24px;
  }
}
@media (max-width: 1200px) {
  body,
  html {
    font-size: 46.5%;
  }
  .wall {
    width: 90%;
  }
  .wall2 {
    width: 80%;
  }
  header .ll {
    gap: 0 50px;
  }
  .banner .swiper .swiper-slide .imgBox {
    height: 85%;
  }
  .o_ban .txt p {
    margin-left: -1.5rem;
  }
  .o_ban2 .rr h6 {
    margin: 0;
  }
  .jobb_1 .contain2 ul li {
    padding: 1rem 2rem;
  }
  .about1 .contain .tt {
    margin: 8rem 0 -13rem;
  }
  .about1s .contain .tt{
   margin: 8rem 0 -4rem;
}
.about1s2 .contain .tt{
   margin: 8rem 0 -19rem;
}
.about1s3 .contain .tt{
   margin: 8rem 0 -16rem;
}
.about1s4 .contain .tt{
   margin: 8rem 0 -18rem;
}
  .sustainably0 .contain .imgs {
    bottom: -6rem;
  }
  .banner .swiper .txtBox h2 {
    font-size: 3.6rem;
  }
  .banner .other .social .icon img {
    width: 22px;
    height: 22px;
  }
  .more i {
    width: 20px;
    height: 20px;
    margin-right: 0.5rem;
  }
  .more span {
    padding: 0 1rem;
  }
  .i_part4 .bb .txt .tt {
    max-width: 70%;
  }
  .i_part4 .aa .table .item .counter {
    font-size: 2rem;
  }
  .about3 .contain .imgs {
    bottom: -8rem;
  }
  .about3 .contain3 dl dd .limg {
    margin-right: 2rem;
  }
  .factory2 .contain ul li {
    height: 11rem;
  }
  .pro .contain .ll .bg img {
    max-width: 76%;
  }
  .pro .contain .ll .tt {
    padding-left: 3rem;
  }
  .pro .contain .more2 {
    left: 3rem;
  }
  .team .contain .ll .tt2 p::before {
    width: 8px;
    height: 8px;
  }
  .honor .box .ll {
    margin: 0 0 5rem;
  }
  .honor .contain .img {
    margin-top: -8rem;
  }
  .area3 .contain2 .rr .txt b {
    max-width: 20%;
  }
  .sustainably .contain2 ul li img {
    max-width: 40%;
  }
  .sustainably .contain .rr p {
    font-size: 3rem;
  }
}
@media (max-width: 840px) {
  body,
  html {
    font-size: 42.5%;
  }
  .wall {
    width: 90%;
  }
  .wall2 {
    width: 90%;
  }
  header .navBox,
  header.scroll .navBox {
    height: 60px;
  }
  header .nav {
    display: none;
  }
  .navBtn:first-of-type {
    display: none;
  }
  .navBtn2 {
    display: block;
    transform: scale(0.8);
  }
  header .rr i {
    width: 2.8rem;
    margin-top: -0.5rem;
  }
  header .rr {
    gap: 0 25px;
  }
  .nav_btn_active2 {
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    margin-top: 0.5rem;
  }

  .nav_btn_active2 span:nth-of-type(1) {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  .nav_btn_active2 span:nth-of-type(3) {
    opacity: 0;
  }

  .nav_btn_active2 span:nth-of-type(2) {
    margin-top: -32%;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  .p_menu {
    position: fixed;
    left: 0;
    top: 60px;
    width: 100%;
    height: calc(100vh - 60px);
    background: #fff;
  }
  .p_menu ul {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
  .p_menu ul li {
    text-align: center;
    font-size: 2rem;
    margin: 3.5vh 0;
  }
  .p_menu ul li a {
    color: #303030;
  }
  .banner {
    height: auto;
  }
  .banner .swiper .txtBox {
    top: 25%;
  }
  .swiper-backface-hidden .swiper-slide {
    overflow: hidden;
  }
  .banner .swiper .swiper-slide .imgBox {
    height: 75%;
    align-items: flex-end;
    padding: 15vh 0;
  }
  .banner .swiper .swiper-slide .imgBox img {
    width: 250%;
    margin-right: 0%;
  }
  .banner .search {
    width: 90%;
    bottom: 100px;
  }
  .banner .other {
    height: 50px;
  }
  .banner .other h3 {
    display: none;
  }
  .banner .other .swiper-button {
    border: none;
  }
  .banner .scroll {
    bottom: 50px;
  }
  .i_part1 .box {
    display: block;
  }
  .i_part1 .item {
    margin: 3% 0;
    padding: 5% 0;
    display: block;
  }
  .i_part1 .item a {
    display: block;
  }
  .i_part1 .item .imgBox {
    width: 100% !important;
    padding: 10% 10% 0 !important;
    box-sizing: border-box;
  }
  .i_part1 .item .txtBox {
    width: 100% !important;
  }
  .i_part1 .item .imgBox img {
    width: 100% !important;
  }
  .i_part2 .itro .img {
    height: 50%;
    top: inherit;
    bottom: 0;
  }
  .i_part2 .itro .text {
    margin: 1rem 0 5rem;
  }
  .i_part2 .itro h2 {
    font-size: 2.2rem;
  }
  .i_part2 .itro .text p {
    font-size: 1.8rem;
  }
  .i_part2 .itro a {
    padding: 4rem;
  }
  .i_part3 .box .bb .txt p {
    text-align: center;
    font-size: 2rem;
  }
  .title h2 strong,
  .title h2 {
    font-size: 2.8rem;
  }
  .i_part3 .box .bb .tit h2 {
    font-size: 2.8rem;
  }
  .i_part3 .box .bb .tit {
    padding-bottom: 2rem;
    margin-bottom: 22px;
  }
  .i_part4 .box {
    display: block;
  }
  .i_part4 .aa {
    width: 100%;
  }
  .i_part4 .bb {
    width: 100%;
    margin: -10% 0 10% 0%;
  }
  .i_part4 .bb a {
    width: 85%;
    padding-top: 30%;
  }
  .i_part4 .bb .txt {
    display: block;
  }
  .i_part4 .bb .txt .tt {
    max-width: 100%;
    margin-top: 1rem;
  }
  .footer .copyRight {
    display: block;
    text-align: center;
  }
  .footer .copyRight a span {
    display: block;
    margin: 1rem 0 0;
  }
  .o_ban h3 {
    font-size: 3rem;
  }
  .o_ban {
    margin-top: 60px;
    overflow: hidden;
  }
  .o_ban .txt img {
    width: 1.8rem;
    margin: 0 1rem;
  }
  .o_ban .bg img {
    width: 150%;
  }
  .o_ban .search {
    transform: scale(0.9);
  }
  .o_ban .search input {
    width: 8rem;
    line-height: 1.8;
    padding: 0.5rem 0 0;
  }
  .o_ban .search i {
    margin-top: 1.2rem;
    width: 32px;
    height: 32px;
  }
  .search form {
    padding: 0 1rem;
    margin-left: 1rem;
  }
  .o_ban .txt p {
    font-size: 1.8rem;
  }
  .allbars {
    padding: 3rem 0;
  }
  .about1 .contain .tt {
    max-width: 60%;
  }
  .about1 .contain .tt p {
    font-size: 2rem;
    margin: 1rem 0;
  }
  .about1 .contain .imgs {
    max-width: 35%;
    bottom: -4rem;
  }
  .about1 .tt2 {
    font-size: 2rem;
  }
  .about1 .contain .tt {
    margin: 5rem 0 -10rem;
  }
  .about1s .contain .tt{
   margin: 5rem 0 -2rem;
}
.about1s2 .contain .tt{
   margin: 5rem 0 -12rem;
}
.about1s3 .contain .tt{
   margin: 5rem 0 -10rem;
}
.about1s4 .contain .tt{
   margin: 5rem 0 -11rem;
}
  .about2 .tt1 h6 {
    font-size: 3rem;
  }
  .about2 .tt1 h5 {
    font-size: 5rem;
  }
  .about2 .contain {
    display: block;
  }
  .about2 .contain .rr {
    display: none;
  }
  .about2 .contain2 .ll {
    padding: 0;
    width: 100%;
  }
  .about2 .contain2 .tt p {
    padding: 0;
  }
  .about2 .contain3 {
    display: block;
    margin: 0 auto 10%;
  }
  .about2 .ll {
    width: 100%;
    margin: 10% 0;
  }
  .about2 .contain3 .rr {
    width: 100%;
  }
  .about3 .contain2 {
    flex-direction: column-reverse;
  }
  .about3 .contain2 .ll {
    width: 100%;
    margin-top: 5%;
  }
  .about3 .contain2 .rr {
    width: 100%;
  }
  .about3 .contain3 dl {
    display: block;
  }
  .about3 .contain3 dl dd {
    width: 100%;
    margin: 3% 0;
    padding: 4rem;
    justify-content: space-between;
    align-items: center;
  }
  .about3 .contain3 dl .tts {
    width: 50%;
    text-align: center;
  }
  .area0 .contain .imgs,
  .area3_0 .contain .imgs,
  .culture .contain .imgs,
  .joba_0 .contain .imgs {
    bottom: -5.2rem;
  }
  .title2 h2 {
    font-size: 3rem;
  }
  .title2 img {
    width: 10rem;
    margin-right: 2rem;
  }
  .history2 .bars2 ul li {
    margin: 0 !important;
    width: 55%;
  }
  .history2 .bg img {
    width: 80%;
    margin-left: 20%;
  }
  .history2 .bars2 ul li h6 {
    font-size: 2.8rem;
  }
  .history2 .bars2 ul li p {
    font-size: 1.8rem;
  }
  .history2 .bars2 ul .li2 {
    width: 30%;
    right: 0;
    top: 16%;
  }
  .history2 .bars2 ul .li4 {
    right: inherit;
    left: 0;
    text-align: right;
    width: 30%;
    top: 30%;
  }
  .history2 .bars2 ul .li5 {
    right: inherit;
    left: 0;
    text-align: right;
    width: 40%;
    top: 40%;
  }
  .history2 .bars2 ul .li6 {
    right: inherit;
    left: 0;
    text-align: right;
    width: 54%;
    top: 48%;
  }
  .history2 .bars2 ul .li7 {
    top: 56%;
    width: 66%;
  }
  .history2 .bars2 ul .li8 {
    top: 66%;
    width: 64%;
  }
  .history2 .bars2 ul .li9 {
    right: inherit;
    left: 0;
    text-align: right;
    width: 50%;
    top: 76%;
  }
  .history2 .bars2 ul .li10 {
    right: inherit;
    left: 0;
    text-align: right;
    width: 30%;
    top: 88%;
  }
  .history3 .barss2 dl p {
    padding: 0 !important;
    width: 40%;
  }
  .history3 .barss2 dl dd::before {
    transform: translateX(-50%) scale(0.6);
  }
  .history3 .barss2 dl dd::after,
  .history3 .barss2 dl::after {
    transform: translateX(-50%) scale(0.6);
  }
  .history3 .barss2 dl::after {
    transform: translateX(-50%) scale(0.6) translateY(1.5rem);
  }
  .factory0 .contain .imgs {
    max-width: 65%;
  }
  .factory .contain .t1 {
    width: 100%;
    padding-top: 12%;
  }
  .factory .contain .t1 h3 {
    font-size: 2.6rem;
    padding-bottom: 2rem;
  }
  .factory .contain .t2 {
    top: 3rem;
  }
  .factory .contain .t1 p {
    font-size: 1.8rem;
    margin: 2rem 0 0;
  }
  .factory2 .contain ul {
    padding: 2rem 0;
  }
  .factory2 .contain ul li {
    display: block;
    text-align: center;
    font-size: 1.6rem;
    height: auto;
  }
  .factory2 .contain ul li img {
    margin: 0 auto 1rem;
  }
  .factory2 .contain dl {
    margin: 5rem auto;
    display: block;
  }
  .factory2 .contain dl dd {
    width: 100%;
    margin: 3% 0;
  }
  .factory2 .contain2 .swiper-slide {
    flex-direction: column-reverse;
    flex-wrap: wrap;
  }
  .factory2 .contain2 .swiper-slide .ll {
    width: 100%;
  }
  .factory2 .contain2 .swiper-slide .rr {
    width: 100%;
    margin-bottom: 4rem;
  }
  .factory2 .contain2 .swiper-slide h3 {
    font-size: 2.6rem;
    padding-bottom: 1rem;
  }
  .factory2 .btn {
    position: static;
    justify-content: center;
    margin-bottom: 3rem;
  }
  .factory2 .contain4 .tops h6 {
    font-size: 1.8rem;
  }
  .factory2 .btn1 {
    margin: 0;
  }
  .mql1 {
    padding-top: 0;
  }
  .pross .contain {
    display: block;
  }
  .pross .contain .ll {
    padding-bottom: 0.1%;
    width: 100%;
  }
  .pross .contain .rr {
    width: 100%;
    margin-top: 5%;
  }
  .mql1 .contain .rr .top {
    padding: 2.5rem;
    justify-content: center;
    font-size: 2.8rem;
  }
  .pross .contain dl dd {
    width: 100%;
    margin-right: 0;
  }
  .mql2 .contain {
    display: block;
  }
  .mql2 .contain::before {
    display: none;
  }
  .mql2 .contain .rr {
    width: 100%;
    background: #004da0;
    padding: 8%;
  }
  .mql2 .contain .ll {
    width: 100%;
    height: 20rem;
  }
  .mql2 .contain .rr h6,
  .mql2 .contain2 .bl h6 {
    font-size: 2.4rem;
  }
  .mql2 .contain .rr .tt p {
    width: 100%;
  }
  .mql2 .contain2 {
    flex-wrap: wrap;
  }
  .mql2 .contain2 .bb {
    width: 100%;
    min-height: 30rem;
    margin-bottom: 3%;
    align-items: center;
  }
  .more2b img {
    max-width: 100%;
    margin-bottom: 3rem;
  }
  .mql3 h3 {
    font-size: 2.2rem;
    margin-bottom: 2rem;
  }
  .mql3 {
    margin-bottom: 5rem;
  }
  .o_bans1 {
    padding-top: 0;
  }
  .o_bans1 .contain2 {
    height: 18rem;
  }
  .o_bans1 .tt h6 {
    font-size: 2rem;
  }
  .o_bans1 .tt h5 {
    font-size: 1.6rem;
  }
  .o_bans1 .tt {
    padding: 2rem;
  }
  .mqlList.pross .contain .ll {
    width: 100%;
  }
  .mqlList.pross .contain .rr {
    width: 100%;
    padding: 0;
    margin-top: 10%;
  }
  .mqlList.pross .contain dl dd {
    width: 48%;
    margin-right: 3%;
  }
  .mqlList.pross .contain dl dd:nth-of-type(3n){
      margin-right:3%;
  }
  .mqlList.pross .contain dl dd:nth-of-type(2n){
      margin-right:0;
  }
  .mqld .bar1 h1 {
    font-size: 3rem;
  }
  .mqld .bar1 p {
    font-size: 2.2rem;
  }
  .mqld .bar1 p img {
    font-size: 2.8rem;
  }
  .mqld .bar2 {
    padding: 0;
  }
  .mqld .bar3 h6 {
    padding: 2rem 0;
    font-size: 2rem;
  }
  .mqld .bar3 h6 img {
    width: 3.2rem;
    margin: -0.6rem 2rem 0 0;
  }
  .mqld .bar3 .tt {
    padding: 2rem 5rem;
  }
  .mqld .bar3 p {
    font-size: 1.8rem;
  }
  .allNav ul li {
    margin: 1rem 2rem 0 0;
  }
  .pro .contain {
    display: block;
  }
  .pro .contain .rr {
    width: 100%;
    margin-top: 5%;
  }
  .pro .contain .ll {
    width: 100%;
  }
  .pro .contain .ll img {
    width: 15rem;
  }
  .pro .contain .rr .swiper-pagination {
    justify-content: center;
    transform: scale(0.8);
  }
  .pro .contain2 dl {
    flex-wrap: wrap;
  }
  .pro .contain2 dl dd {
    width: 48%;
    margin-bottom: 5%;
  }
  .pro .contain2 dl dd .txt {
    padding: 4rem;
  }
  .proList {
    padding-top: 0;
    margin-top: -3rem;
  }
  .proList .contain dl dd {
    padding-left: 0;
  }
  .solution dl {
    display: block;
  }
  .solution dl dd {
    margin-bottom: 5%;
  }
  .solutiond .bar3 .tt {
    display: block;
  }
  .solutiond .bar3 .tt .ll {
    width: 100%;
  }
  .solutiond .bar3 .tt .rr {
    width: 100%;
  }
  .relation .title2 h2 span {
    font-size: 2rem;
  }
  .relation .search {
    padding: 0;
    width: 100%;
  }
  .relation .search .bbs {
    width: 86%;
    font-size: 1.8rem;
  }
  .relation .box .ll h6 {
    font-size: 3rem;
  }
  .relation .box .rr {
    width: 70%;
  }
  .team0 .contain .imgs {
    bottom: -2.6rem;
  }
  .team .contain {
    flex-wrap: wrap;
    flex-direction: row-reverse;
    padding-top: 0;
  }
  .team .contain .ll {
    width: 100%;
  }
  .team .contain .rr {
    width: 100%;
  }
  .team .contain .ll p {
    font-size: 1.6rem;
    margin: 2rem 0;
  }
  .team .contain .ll .tt2 {
    margin: 5% auto;
  }
  .team .contain .ll .more2 {
    margin: 0;
  }
  .team .contain .ll .tt1 {
    padding: 0;
  }
  .team .contain2 .swiper-slide h5 {
    font-size: 1.8rem;
  }
  .team .contain3 {
    display: block;
  }
  .team .contain3 .ll {
    width: 100%;
    position: static;
    transform: none;
  }
  .team .contain3 .ll .img {
    margin: 5% 0;
  }
  .team .contain3 .rr {
    width: 100%;
    display: none;
  }
  .team .contain3 .ll h3 {
    font-size: 2.6rem;
  }
  .team .contain3 .ll .img h6 strong {
    font-size: 5rem;
  }
  .team6 .contain {
    display: block;
  }
  .team6 .contain .ll {
    width: 100%;
  }
  .team6 .contain .rr {
    width: 100%;
    margin-top: 5%;
  }
  .team6 .contain2 ul {
    display: block;
  }
  .team6 .contain2 ul li {
    max-width: 100%;
    width: 100%;
    margin: 0 0 10% 0;
    text-align: center;
  }
  .team6 .contain2 ul li h3 {
    margin: 2rem 0;
  }
  .team6 .contain2 ul li p {
    text-align: center;
  }
  .team6 .contain2 ul li img {
    height: 5rem;
  }
  .honor .contain p {
    font-size: 2rem;
    margin: 3rem 0;
  }
  .honor .box {
    display: block;
  }
  .honor .box .ll {
    width: 100%;
  }
  .honor .box .rr {
    width: 100%;
  }
  .honor .contain .img {
    margin-top: -4rem;
  }
  .honor .contain2 .top img {
    width: 70%;
  }
  .honor .contain2 .top p {
    width: 70%;
    top: 8%;
    font-size: 2rem;
  }
  .honor .contain2 .top::after {
    width: 30%;
  }
  .honor .contain2 .table .item .counter,
  .honor .contain2 ul li {
    font-size: 2rem;
  }
  .honor .contain2 .table {
    padding-left: 6rem;
  }
  .honor .contain2 dl dd img {
    width: 6rem;
    margin-bottom: 3rem;
  }
  .honor .box .rr {
    padding: 0 6%;
  }
  .allNav {
    padding-bottom: 0;
  }
  .area .contain .t1 h3 {
    font-size: 3rem;
  }
  .area .contain .t1 {
    display: block;
    width: 100%;
  }
  .area .contain .t1 p {
    font-size: 1.8rem;
    width: 100%;
    margin: 2rem 0 0;
  }
  .area .contain .search i {
    margin-top: 3rem;
  }
  .area .contain .tt p {
    font-size: 2rem;
  }
  .area .contain3 .txt h3 strong {
    font-size: 3rem;
  }
  .area .contain3 .txt h3 {
    font-size: 2rem;
    margin-bottom: 1rem;
  }
  .area .contain3 .txt {
    width: 50%;
    left: 5%;
    transform: translate(0, -50%);
  }
  .area .contain3 .tt {
    text-align: left;
  }
  .area .contain3 .tt p {
    font-size: 1.6rem;
    margin: 2px 0;
  }
  .area .contain4 {
    flex-wrap: wrap;
    flex-direction: column-reverse;
  }
  .area .contain4 .ll {
    width: 100%;
  }
  .area .contain4 .rr {
    width: 100%;
    margin-bottom: 5%;
  }
  .area .contain4 h3 {
    font-size: 3rem;
    padding-bottom: 1.5rem;
    margin-bottom: 2rem;
  }
  .area .contain4 p {
    font-size: 1.6rem;
  }
  .area .contain5 {
    display: block;
  }
  .area .contain5 .rr {
    width: 100%;
  }
  .area .contain5 .ll {
    width: 100%;
    padding: 10% 5%;
  }
  .area .contain5 h3 {
    font-size: 3rem;
    padding-bottom: 2rem;
    margin-bottom: 3rem;
  }
  .area2_0 .contain .imgs {
    bottom: -5.3rem;
    right: -0rem;
  }
  .area2 .contain {
    margin-bottom: 10%;
  }
  .area2 .contain ul {
    gap: 0;
    grid-template-columns: repeat(3, 1fr);
  }
  .area2 .contain ul li {
    padding: 15% 20%;
    box-sizing: border-box;
  }
  .area2 .contain h3 {
    font-size: 3rem;
    padding: 2rem 0;
    margin-bottom: 5rem;
  }
  .area2_bar4 .contain p img {
    margin: 10% 0;
  }
  .area3 .contain .ll {
    position: static;
    width: 100%;
    overflow: hidden;
  }
  .area3 .contain .ll img {
    width: 130%;
  }
  .area3 .contain .box {
    flex-wrap: wrap;
  }
  .area3 .contain .rr {
    width: 100%;
    overflow: hidden;
    margin-top: -30%;
    z-index: 6;
  }
  .area3 .contain .rr img {
    width: 130%;
    margin-left: -30%;
  }
  .area3 .contain .rr h3 {
    font-size: 3rem;
  }
  .area3 .contain .rr .txt {
    width: 80%;
    left: 10%;
  }
  .area3 .contain2 .rr {
    width: 100%;
    position: relative;
    top: inherit;
  }
  .area3 .contain2 .rr .bg img {
    height: 20rem;
    margin-top: -5rem;
  }
  .area3 .contain2 .ll {
    width: 100%;
  }
  .area3 .contain2 .rr .txt p {
    font-size: 1.8rem;
  }
  .area3 .contain2 .rr .txt b {
    max-width: 25%;
  }
  .area3 .contain2 .rr .txt .tt {
    width: 72%;
  }
  .area3 .contain2 .ll p {
    font-size: 2rem;
    width: 100%;
    top: 30%;
  }
  .area3 .contain2 .box {
    margin: 5rem 0;
  }
  .area3 .contain3 {
    display: block;
  }
  .area3 .contain3 .ll {
    width: 100%;
    overflow: hidden;
    max-height: 30vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .area3 .contain3 .rr {
    width: 100%;
    margin: 0 auto 5%;
  }
  .area3 .contain3 p {
    margin: 3rem 0;
  }
  .area3 .contain3 .rr .swiper {
    width: 100%;
  }
  .news .contain ul li {
    width: 100%;
  }
  .sustainably .contain .box,
  .sustainably .contain .ll ul {
    flex-wrap: wrap;
    justify-content: center;
    padding: 4%;
    overflow: hidden;
  }
  .sustainably .contain .bg img {
    right: inherit;
  }
  .sustainably .contain .ll {
    width: 100%;
    margin: auto;
  }
  .sustainably .contain .rr {
    width: 90%;
    margin: 10% auto;
  }
  .sustainably .contain .ll ul li {
    width: 100%;
    margin: 0 !important;
  }
  .sustainably .contain .ll dl {
    width: 100%;
    gap: 0;
    justify-content: space-between;
  }
  .sustainably .contain .ll dl dd {
    width: 20%;
  }
  .sustainably .contain .ll h6 img {
    max-width: 15%;
  }
  .sustainably .contain .ll p {
    margin: 5rem 0;
  }
  .sustainably .contain .ll::after {
    width: 90%;
    left: 5%;
    height: 5px;
  }
  .sustainably .contain2 ul {
    flex-wrap: wrap;
    padding: 0;
  }
  .sustainably .contain2 ul li {
    width: 50%;
    max-width: 50%;
    margin: 10% 0 5%;
  }
  .sustainably .contain2 ul li img {
    max-width: 26%;
  }
  .job .contain .box {
    flex-wrap: wrap;
    flex-direction: column-reverse;
  }
  .job .contain .ll {
    width: 100%;
  }
  .job .contain .rr {
    width: 100%;
    margin-bottom: 10%;
  }
  .job .contain .ll h3 {
    font-size: 3rem;
    margin-bottom: 2rem;
  }
  .job .contain .search {
    margin-top: 5rem;
  }
  .job .contain2 ul li {
    display: block;
    margin: 3rem 0;
  }
  .job .contain2 ul li .ll {
    width: 100%;
  }
  .job .contain2 ul li .rr {
    width: 100%;
    margin-bottom: 10%;
    padding: 8%;
  }
  .job .contain2 h4 {
    font-size: 3rem;
  }
  .job3 .contain ul {
    grid-template-columns: repeat(1, 1fr);
  }
  .job3 .contain h4 {
    font-size: 3rem;
    margin: 2rem 0;
  }
  .joba_1 {
    margin-bottom: 5rem;
  }
  .joba_1 .contain ul {
    grid-template-columns: repeat(1, 1fr);
  }
  .joba_1 .contain .bb1 h3 {
    font-size: 3rem;
    margin-bottom: 4rem;
  }
  .jobb_1 .search .bbs {
    width: 86%;
  }
  .jobb_1 .search input {
    line-height: 36px;
    padding: 0.5rem 0.5rem 0rem;
    letter-spacing: 0;
    font-size: 12px;
  }
  .jobb_1 .search form {
    width: 75%;
  }
  .jobb_1 .search .bbs span {
    width: 20%;

    text-align: left;
  }
  .jobb_1 .search form img {
    width: 3rem;
    height: 3rem;
    margin-right: 1rem;
  }
  .jobb_1 .contain2 {
    flex-wrap: wrap;
    flex-direction: column-reverse;
  }
  .jobb_1 .contain2 .ll {
    width: 100%;
  }
  .jobb_1 .contain2 .rr {
    width: 100%;
    margin-bottom: 5%;
  }
  .jobb_1 .contain2 h4 {
    padding-bottom: 2rem;
    font-size: 3rem;
  }
  .jobb_1 .contain2 .tt {
    margin: 3rem 0;
  }
  .jobb_1 .contain2 ul {
    justify-content: flex-start;
  }
  .jobb_1 .contain2 ul li {
    margin-right: 3rem;
  }
  .footer .top .aa .logo{
      width: 13rem;
  }
}