html, body { font-size: 18px; overflow-x: clip; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; margin: 0; padding: 0; } a { color: #2d2e2f; outline: none; text-decoration: none; } a:link { text-decoration: none; } a:visited { text-decoration: none; } a:hover { text-decoration: none; } a:active { text-decoration: none; } a:focus { text-decoration: none; } .nav_item .nav_con { top: 70px !important; } /* =================================================== */ .wrapper { background: url(../img/company-history-bg.png) no-repeat; background-color: #edf3ff; background-size: contain; background-position: bottom; } .company { position: relative; width: 80%; max-width: 1150px; overflow: hidden; padding: 80px 30px; } .company-bg { width: 100%; height: 2480px; } .right { position: relative; left: 45px; font-size: 18px; } .right::before { content: ''; position: absolute; width: 2px; height: 100%; background-color: #1b4698; opacity: 0.5; left: -45px; } .right h2 { font-size: 28px; color: #376aca; line-height: 2; } .right-con { position: relative; margin-bottom: 30px; } .right-con ul li { max-width: 992px; /*list-style: disc;*/ font-size: 16px; line-height: 2; } .right-h { margin-top: 50px; padding-bottom: 12px; font-size: 28px; width: 115px !important; border-bottom: 3px solid #376aca; width: 0; } .right-con h2::before { content: ''; position: absolute; left: -53px; top: 20px; width: 18px; height: 18px; transform: rotate(45deg); background: #1b4698; } .history-header { width: 1150px; padding-left: 10px; margin: 0 auto; } .history-main { max-width: 1150px; margin: 0 auto; margin-top: 60px; } .c-logo { width: 360px; } .c-logo img { width: 100%; } .right-con video, .right-con img { width: 660px; height: 370px; margin-top: 50px; margin-left: 20px; } .right-con b { color: #376aca; } .right-con p { display: list-item; width: 98%; line-height: 2; text-align: justify; list-style: disc; } .honor-group { display: flex; margin-top: 50px; } .honor { padding: 0 30px; margin-right: 17px; line-height: 52px; text-align: center; background-color: #fff; } .this-honor { color: #fff; background-color: #0449a6; } .swiper-honor-padding { padding: 0 0 35vh 0; } .honor-wapper .swiper-slide { width: 300px !important; height: 225px; background: rgb(255 255 255 / 50%); border-radius: 6px; overflow: hidden; } .honor-wapper .swiper-slide img { object-fit: contain; } @media screen and (max-width: 900px) { .company { width: 84%; font-size: 16px; padding: 40px 0; } .swiper-screen p { font-size: 0.6rem; } .right-h { margin-top: 25px; padding-bottom: 10px; font-size: 22px; font-weight: 600; width: 96px !important; border-bottom: 3px solid #376aca; } .history-header { padding-left: 0; } .history-main { margin-top: 10px; } .right-con h2::before { left: -34px !important; width: 14px; height: 14px; top: 17px; } .swiper h1 { font-size: 1.9rem; } .c-logo { width: 70%; } .c-logo img { width: auto; height: 30px; margin: 5px 0 15px 0; } .left::before { left: -3px; } .left::after { left: -3px; } .right { width: 98%; left: 17px; padding: 20px; } .right::before { left: -8.5px; } .right h2 { font-size: 26px; font-weight: 600; } .right-con p { width: 100%; font-size: 16px; } .right-con video, .right-con img { width: 100%; max-width: 350px; height: 197px; margin-top: 10px; margin-left: 0; } .honor-group { margin-top: 40px; flex-direction: row; align-content: space-between; flex-wrap: wrap; } .honor-group a { line-height: 44px; font-size: 16px; } .swiper-honor-padding { padding: 0 0 80px 0; } .honor-wapper .swiper-slide { width: 184px !important; height: 138px; } .enterprise { width: 30%; background-color: #83b8ff66; } .chairman { width: 50%; } }