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-bg.jpg) no-repeat; background-size: cover; background-position: center; } .company { position: relative; max-width: 1150px; width: 80%; padding: 80px 30px; font-size: 17px; } .company-bg { width: 100%; } .company-log { position: relative; max-width: 360px; margin: 0 0 40px 0; } .company p { line-height: 2rem; width: 896px; margin-top: 15px; } .company-p1 { position: relative; color: #0048A2; text-indent: 2rem; text-align: justify; top: 11%; padding-left: 10px; } .company-p1>div { display: flex; flex-direction: column; align-items: flex-start; } .company-center { position: absolute; top: 50%; left: 20%; width: 62.5%; height: 13%; } .company_num { position: relative; top: 17%; left: 0; width: 100%; height: 150px; margin: 50px 0 35px 0; display: flex; background: url(../img/company-center.png) no-repeat; } .data_num { flex: 1; width: 338px; height: 100%; color: #fff; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: auto 0; transition: all .3s; } .company_num>div:hover { color: #fff; transform: translateY(-15px); } .data_num .num_more { font-size: 45px; font-weight: 600; } .company-p2 { display: block; position: relative; width: 100%; color: #0048A2; text-indent: 2rem; text-align: justify; } .company-p2>div { display: flex; flex-direction: column; align-items: flex-end; padding-right: 10px; } @media screen and (min-width: 900px) and (max-width:1150px) { .company p { width: 100%; } .company-p1>div, .company-p2>div { align-items: center; } } @media screen and (max-width: 900px) { .wrapper { background: url(../img/company-history-bg.png) no-repeat; background-color: #edf3ff; background-size: contain; background-position: bottom; } .company { font-size: 16px; height: auto; min-height: unset; overflow: hidden; padding: 40px 0 70px 0;; width: 84%; } .company p { position: relative; margin: 10px auto; line-height: 2; width: 100%; left: 0; right: 0; } .company-log { height: 30px; margin: 5px 0 15px 0; position: relative; } .company-p1 { position: relative; width: 100%; left: 0; top: 14%; padding: 0; } .company-p2 { position: relative; width: 100%; left: 0; top: 23%; } .company-p2 div { position: relative; padding: 0; } .data_num { margin: auto 5px; justify-content: flex-start; padding: 25px 0; } .data_num span { font-size: 12px; font-weight: 600; } .company_num { position: relative; width: 100%; height: 120px; background: url(../img/company-center.png) no-repeat; background-position-x: -80px; border-radius: 16px; } .data_num .num_more { font-size: 20px; } }