* ,body{ margin: 0; padding: 0; /* box-sizing: border-box; */ } .banner{ width: 100%; height: 100vh; /* background: linear-gradient(to bottom, #3A8DFF 0%, #AEE6FF 60%, #F1F1F1 100%), url(../imgs/support/bg.png); */ background: linear-gradient( to bottom, #3478FD 0%, #BED0F4 80%, #f1f1f1 100% ); /* background: url(../imgs/support/bg.png) no-repeat bottom; */ background-size: 100% 80%; background-repeat: no-repeat; background-size: cover; background-position: top, center; box-sizing: border-box; background-blend-mode: multiply; margin-top: 12vh; } .banner-content{ width: 100%; height: 100%; background-image: url(../imgs/about/bg.svg); background-size: 120vw auto; background-position: 60% -8vw; background-repeat: no-repeat; box-sizing: border-box; position: relative; } .banner-content-text{ width: 40%; height: 60%; position: absolute; top: 10vw; left: 30vw; } .banner-content-text p:nth-child(1){ font-size: 5vw; color: #fff; font-weight: 400; } .banner-content-text p:nth-child(2){ font-size: 5vw; color: #fff; font-weight: 400; } .banner-content-text p:nth-child(3){ font-size: 1.6vw; color: rgba(0, 0, 0, 0.6); font-weight: 400; letter-spacing: 0.1vw; margin-top: 2vh; } .banner-content-text a{ display: inline-block; width: 9vw; height: 2.3vw; background: #fff; border-radius: 1vw; background: #3478FD; text-decoration: none; display: flex; align-items: center; justify-content: center; margin-top: 3vh; margin-left: 13vw; transition: all 0.3s ease; } .banner-content-text a span{ font-size: 0.9vw; color: #fff; font-weight: 400; } .banner-content-text a img{ width: 1.2vw; height: 1.2vw; margin-left: 1vw; } .banner-content-text a:hover{ transform: scale(1.05); } /* ---------------------------- */ .aboutUs-content{ width: 100%; height: 50vh; background: linear-gradient( to bottom, #f1f1f1 0%, #f1f1f1 100% ); position: relative; } .aboutUs-content-text{ width: 80%; height: 100%; margin: 0 auto; background: url(../imgs/about/adout1.png) ,url(../imgs/about/adout2.png); background-size: 25vw auto,25vw auto; background-position: 0 0,100% 0; background-repeat: no-repeat; text-align: center; box-sizing: border-box; padding-top: 18vh; position: relative; top: -10vw; left: 2vw; } .aboutUs-content-text .text{ width: 42%; height: 80%; background:#fff; margin: 0 auto; box-sizing: border-box; box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.1); border-radius: 1.05vw; padding: 2.5vw; font-size: 1vw; text-align: left; color: rgba(0, 0, 0, 0.7); line-height: 4.2vh; display: flex; align-items: center; text-align: justify; } /* ----------------- */ .aboutUs-team{ width: 100%; height: 100vh; background: linear-gradient( to bottom, #f1f1f1 0%, #D8E8F4 100% ); } .banner-content-list { width: 100%; height: 100vh; /* background-color: #f1f1f1; */ position: relative; background-image: url(../imgs/about/bg2.svg); background-size: 99% 80%; background-position: 100% 18vw; background-repeat: no-repeat; } .banner-content-list h2{ font-size: 3vw; font-weight: 400; text-align: center; text-decoration: underline; color: rgba(0, 0, 0, 0.8); text-underline-offset: 0.8vw; text-decoration-thickness: 1px; } .content-listBOX{ width: 80%; height: 70%; /* background: palegoldenrod; */ margin-top: 4vh; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; } .content-listBOX-item{ width: 23vw; height: 73%; /* background: palegoldenrod; */ list-style: none; border-radius: 1vw; box-shadow: 8px 5px 10px 5px rgba(0,0,0,0.1); background: #fff; padding: 1vw; box-sizing: border-box; text-align: center; } .content-listBOX-item img{ width: 100%; height: auto; margin: 0 auto; } .content-listBOX-item h3{ font-size: 1vw; /* font-weight: 500; */ margin-top: 4vh; color: rgba(0, 0, 0, 0.6); font-weight: 400; }