@import "init.css";


.container {
   width: 90%;
   margin: 0 auto;
}

.insidebanner {
   width: 90% !important;
   margin: 50px auto 0;
}

section {
   margin-top: 125px;
}

/*大标题*/
.big-title {
   width: 90%;
   display: flex;
   align-items: flex-end;
}

.big-title.top {
   margin: 100px auto 0;
   justify-content: center;
}

.big-title .enbannertext {
   font-size: clamp(5rem, 3.3113rem + 3.518vw, 7.5rem);
   color: transparent;
   -webkit-text-stroke: 0.8px var(--text-yellow);
   text-stroke: 0.8px var(--text-yellow);
   text-align: left;
   transition:
      color 0.8s ease-out,
      -webkit-text-stroke 0.5s ease;
   padding: 0;
   margin: 0;
   line-height: 0.85;
   text-transform: uppercase;
}

.big-title .cnbannertext {
   font-size: clamp(1rem, 0.6623rem + 0.7036vw, 1.5rem);
   color: var(--text-yellow);
   display: flex;
   position: relative;
   line-height: 1.2;

}

.big-title .divider {
   width: 1px;
   background-color: var(--text-yellow);
   opacity: 1;
   align-self: stretch;
   margin: 0 26px;
}

/*关于我们*/
.intro {
   width: 100%;
   padding: 0 5%;
   display: flex;
   justify-content: space-between;
}

.intro .left {
   width: 45%;
   margin-bottom: 1.5rem;
}

.intro .right {
   width: 50%;
}

.intro-title {
   color: var(--text-green);
   font-size: clamp(16px, 1vw, 18px);
}

.intro-title p:first-child {
   font-size: clamp(36px, 2.5vw, 40px);
   margin-bottom: 10px;
}

.intro .text {
   font-size: clamp(14px, 1vw, 16px);
   line-height: 1.5;
   margin-top: 90px;
   text-align: justify;
}


/*荣誉*/
.honor {
   width: 100%;
   padding: 0 5%;
   position: relative;
}

.honor::after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 30%;
   background-color: var(--vigreen);
   z-index: -1;
}

.honor .box {
   padding: 125px 0 100px;
   display: flex;
   justify-content: space-between;
}

.honor .box .text {
   font-size: clamp(14px, 1.2vw, 16px);
   line-height: 1.5;
   width: 30%;
}

.honor .right {
   width: 65%;
}

.swiper1 .swiper-slide {
   margin-top: 10px;
}

/*荣誉奖牌列表*/
.list-item {
   position: relative;
   display: block;
}

.honor .list-item img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: all 0.6s;
   -webkit-box-reflect: below 0px linear-gradient(transparent 89%, rgba(255, 255, 255, 0.5));
}

.honor .list-item:hover img {
   transform: translateY(-10px);
}

.honor .cover {
   width: 100%;
   position: relative;
}

.honor .list-title {
   font-size: clamp(12px, 1vw, 14px);
   line-height: 1.5;
   margin: 30px 0;
   color: var(--text-lightyellow);
   text-align: center;
}

/*招商加盟*/
.join {
   width: 100%;
   position: relative;
}

.join .big-title {
   width: 90%;
   margin: 0 auto;
}

.jointext {
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   width: 90%;
   margin: 120px auto 90px;
}

.jointext .ltext {
   text-align: left;

}

.jointext .ltext .t1 {
   font-size: clamp(18px, 1.5vw, 22px);
   color: var(--text-yellow);
   letter-spacing: 2px;
}

.jointext .ltext .t2 {
   font-size: clamp(14px, 1.2vw, 16px);
   margin-top: 40px;
   line-height: 1.75;
}

.jointext .rtext {
   text-align: right;
}

.jointext .rtext .t3 {
   font-size: clamp(14px, 1.2vw, 16px);
   line-height: 1.75;
}

.jointext .rtext .t4,
.jointext .rtext .t4 a {
   color: var(--text-yellow);
   font-size: clamp(46px, 1.5vw, 50px);
   margin-top: 20px;
   line-height: 1;
}

.jointext .rtext .t5 {
   color: var(--text-yellow);
   font-size: clamp(26px, 1.5vw, 30px);
   line-height: 1.5;
}

.jointext .rtext .t6 {
	display: flex;
    gap: 12px;
    margin-top: 5px;
	justify-content: flex-end;
}

.joinicon {
    position: relative;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--text-yellow);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.joinicon .iconfont {
    font-size: 16px;
    color: var(--text-yellow);
    z-index: 3;
    transition: all 0.3s ease;
}

.joiniconhover {
    position: absolute;
    width: 0;
    height: 0;
    background-color: var(--text-yellow);
    border-radius: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.3s ease;
    z-index: 2;
}

.joinicon:hover .joiniconhover {
    width: 31px;
    height: 31px;
}

.joinicon:hover .iconfont {
    color: var(--bg-color) !important;
}

.join .box {
   width: 100%;
   padding-left: 5%;
}

.join .box::after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 50%;
   background-color: var(--vigreen);
   z-index: -1;
}


.joinlist .cover {
   aspect-ratio: 870 / 580;
   overflow: hidden;
}

.joinlist .textbox {
   color: var(--viyellow);
   padding: 30px 0 110px;
}

.joinlist .textbox .number {
   font-size: clamp(36px, 1.5vw, 40px);
}

.joinlist .desc {
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   margin-top: 10px;
}

.joinlist .desc .t6 {
   font-size: clamp(18px, 1.2vw, 22px);
   margin-bottom: 0.6rem;
}

.joinlist .desc .t7 {
   width: 38%;
   display: block;
   font-size: clamp(12px, 1vw, 14px);
   text-align: right;
   line-height: 1.7;
}

/*联系我们*/
.contact {
   width: 100%;
   padding: 0 5%;
   position: relative;
}

.contact .box {
   padding: 0 0 200px 0;
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
}

.contact .left {
   width: 28%;
   overflow-x: hidden;
}

.contact .right {
   width: 60%;
   max-width: 980px;
}

.contact .company-name {
   padding: 120px 0 0;
   font-size: clamp(18px, 1.5vw, 22px);
   font-family: "alidaB";
   margin-bottom: clamp(1.875rem, 1.4583rem + 0.8681vw, 2.5rem);
}

.contact .left .info-grid {
   display: grid;
   grid-template-columns: repeat(1, 1fr);
   gap: 45px
}

.contact .left .info-item {
   display: flex;
   flex-direction: column;
   opacity: 0;
   transform: translateX(80px);
   animation: fadeUpIn 0.8s forwards;
   animation-play-state: paused;
}

.contact .left.aos-animate .info-item {
   animation-play-state: running;
}

@keyframes fadeUpIn {
   to {
      opacity: 1;
      transform: translateX(0);
   }
}

.contact .left .info-label {
   position: relative;
   min-width: 60px;
   white-space: nowrap;
   font-size: clamp(14px, 1vw, 16px);
   margin-bottom: 18px;
   font-family: "enMedium";
}

.contact .left .info-label:after {
   content: "";
   position: absolute;
   right: 0;
   top: 50%;
   width: calc(100% - 60px);
   height: 1px;
   background-color: #7a9c83;
}

.contact .left .info-value {
   font-size: clamp(14px, 1vw, 15px);
   flex-grow: 1;
   line-height: 1.3;
}

.contact .left .info-value a {
   color: var(--text-green);
}


.contact .right .cover {
   width: 100%;
}






/* 响应式布局 */
@media (max-width: 1280px) {

   .list-container {
      grid-template-columns: repeat(2, 1fr);
      margin-top: 70px;
      grid-row-gap: 80px;
   }
}

@media (max-width: 767px) {

   .insidebanner {
      width: 100% !important;
      margin-top: 0.8rem;
   }

   section {
      margin-top: 1.8rem;
   }

   .big-title {
      justify-content: center;
      margin: 0 auto;
   }

   .big-title .enbannertext {
      font-size: 1.3rem;
   }

   .big-title .cnbannertext {
      font-size: 0.28rem;
   }

   .big-title .divider {
      margin: 0 13px;
   }

   .intro {
      flex-direction: column;
      margin-top: 1.3rem;
   }

   .intro .left,
   .intro .right {
      width: 100%;
   }

   .intro .text {
      margin-top: 1rem;
   }

   .honor .box {
      flex-direction: column;
      padding: 1.5rem 0 0.5rem;
   }

   .honor .right {
      width: 100%;
      margin-top: 1rem;
   }

   .honor .box .text {
      text-align: center;
	  width: 100%;
   }

   .jointext {
      flex-direction: column;
      width: 90%;
      margin: 1.5rem auto 1.5rem;
   }

   .jointext .ltext,
   .jointext .rtext {
      width: 100%;
   }

   .jointext .rtext {
      margin-top: 1rem;
   }

   .jointext .ltext .t1 {
      letter-spacing: 0px;
   }

   .jointext p {
      text-align: center;
   }
   
    .jointext .rtext .t6 {
	justify-content: center;
	}

   .jointext .rtext .t4,
   .jointext .rtext .t4 a {
      font-size: 0.7rem;
   }

   .join .box {
      padding: 0 5%;
   }

   .honor .list-item:hover img {
      transform: translateY(0px);
   }

   .joinlist .desc {
      flex-direction: column;
      align-items: flex-start;
   }

   .joinlist .desc .t7 {
      width: 95%;
      display: block;
      font-size: 0.26rem;
      text-align: left;
      line-height: 1.7;
   }

   .joinlist .textbox {
      padding: 0.6rem 0 1.2rem;
   }

   .join .box::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 70%;
      background-color: var(--vigreen);
      z-index: -1;
   }

   .big-title .enbannertext {
      font-size: 1rem;
   }

   .contact .box {
      flex-direction: column;
      padding-bottom: 3rem;
   }

   .contact .left,
   .contact .right {
      width: 100%;
   }

   .contact .right {
      margin-top: 1rem;
   }

   .contact .company-name {
      padding: 1.5rem 0 0;
      font-size: clamp(18px, 1.5vw, 22px);
      font-family: "alidaB";
      margin-bottom: 1rem;
   }

   .contact .left .info-grid {
      gap: 0.5rem;
   }



}