.all-content { width: 100%; position: relative; z-index: 4; background-color: #fff; } .all-content .content-title { margin-left: 13.5%; padding-top: 0.81rem; margin-bottom: 0.5475rem; } .all-content .content-title .title { padding-left: 0.15rem; height: 0.3rem; border-left: 0.045rem solid #ea4027; font-size: 0.315rem; line-height: 0.315rem; font-weight: bold; color: #000000; } .all-content .culture-box { width: 10.5002rem; height: 3.6751rem; margin: 0 auto; position: relative; overflow: hidden; } .all-content .culture-box .img { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; transition: all 1s; } .all-content .culture-box:hover .img { transform: scale(1.05); } .all-content .culture-box .culture-text { padding-left: 0.6975rem; position: relative; } .all-content .culture-box .culture-text .top { margin-top: 0.81rem; font-size: 0.18rem; line-height: 0.18rem; font-weight: 400; color: #FFFFFF; } .all-content .culture-box .culture-text .mid { margin-top: 0.2775rem; font-size: 0.42rem; line-height: 0.42rem; font-weight: bold; color: #FFFFFF; } .all-content .culture-box .culture-text .white-line { margin-top: 1.035rem; width: 0.375rem; height: 2px; background-color: #FFFFFF; } .all-content .culture-box .culture-text .bot { margin-top: 0.185rem; font-size: 0.2175rem; line-height: 0.2175rem; font-family: DIN; font-weight: bold; color: #D0D1D1; opacity: 0.3; } .all-content .map-box { margin-top: 1.5rem; margin-bottom: 0.5475rem; } .all-content .map-box .title { margin-left: 13.5%; padding-left: 0.15rem; height: 0.3rem; border-left: 0.045rem solid #ea4027; font-size: 0.315rem; line-height: 0.315rem; font-weight: bold; color: #000000; } .all-content .map-box .map { width: 11.3853rem; margin: 0 auto; margin-top: 0.14rem; position: relative; } .all-content .map-box .map .img { width: 100%; } .all-content .map-box .map .img img { width: 100%; } .all-content .map-box .map .dot1 { position: absolute; top: 1.7rem; left: 1.4rem; } .all-content .map-box .map .dot1 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #e7b693); animation: r1 5s infinite; } .all-content .map-box .map .dot1 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #e7b693); animation: r1 5s infinite; animation-delay: 4s; } .all-content .map-box .map .dot1 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #e7b693; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot1 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot1 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot1 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot1 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot1 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot1 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot1 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot1 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot1 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot1 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .dot2 { position: absolute; top: 2.7rem; left: 1.8rem; } .all-content .map-box .map .dot2 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #bd7c59); animation: r1 5s infinite; animation-delay: 1s; } .all-content .map-box .map .dot2 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #bd7c59); animation: r1 5s infinite; animation-delay: 5s; } .all-content .map-box .map .dot2 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #bd7c59; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot2 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot2 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot2 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot2 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot2 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot2 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot2 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot2 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot2 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot2 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .dot3 { position: absolute; top: 1.5rem; left: 1.8rem; } .all-content .map-box .map .dot3 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #694c45); animation: r1 5s infinite; animation-delay: 3s; } .all-content .map-box .map .dot3 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #694c45); animation: r1 5s infinite; animation-delay: 7s; } .all-content .map-box .map .dot3 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #694c45; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot3 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot3 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot3 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot3 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot3 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot3 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot3 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot3 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot3 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot3 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .dot4 { position: absolute; top: 2rem; left: 2.5rem; } .all-content .map-box .map .dot4 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #bd7c59); animation: r1 5s infinite; animation-delay: 1.5s; } .all-content .map-box .map .dot4 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #bd7c59); animation: r1 5s infinite; animation-delay: 5.5s; } .all-content .map-box .map .dot4 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #bd7c59; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot4 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot4 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot4 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot4 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot4 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot4 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot4 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot4 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot4 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot4 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .dot5 { position: absolute; top: 2.95rem; left: 3.5rem; } .all-content .map-box .map .dot5 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #dec99a); animation: r1 5s infinite; animation-delay: 0s; } .all-content .map-box .map .dot5 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #dec99a); animation: r1 5s infinite; animation-delay: 4s; } .all-content .map-box .map .dot5 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #dec99a; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot5 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot5 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot5 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot5 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot5 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot5 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot5 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot5 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot5 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot5 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .dot6 { position: absolute; top: 2.4rem; left: 4.1rem; } .all-content .map-box .map .dot6 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #dec99a); animation: r2 5s infinite; animation-delay: 3.5s; } .all-content .map-box .map .dot6 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #dec99a); animation: r2 5s infinite; animation-delay: 7.5s; } .all-content .map-box .map .dot6 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #dec99a; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot6 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot6 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot6 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot6 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot6 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot6 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot6 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot6 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot6 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot6 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .dot7 { position: absolute; top: 3.4rem; left: 3.6rem; } .all-content .map-box .map .dot7 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #e7b693); animation: r1 5s infinite; animation-delay: 0.6s; } .all-content .map-box .map .dot7 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #e7b693); animation: r1 5s infinite; animation-delay: 4.6s; } .all-content .map-box .map .dot7 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #e7b693; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot7 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot7 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot7 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot7 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot7 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot7 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot7 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot7 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot7 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot7 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .dot8 { position: absolute; top: 2.6rem; left: 8.5rem; } .all-content .map-box .map .dot8 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #e7b693); animation: r1 5s infinite; animation-delay: 1.2s; } .all-content .map-box .map .dot8 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #e7b693); animation: r1 5s infinite; animation-delay: 5.2s; } .all-content .map-box .map .dot8 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #e7b693; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot8 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot8 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot8 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot8 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot8 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot8 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot8 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot8 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot8 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot8 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .dot9 { position: absolute; top: 2.43rem; left: 3.7rem; } .all-content .map-box .map .dot9 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #e7b693); animation: r1 5s infinite; animation-delay: 1.2s; } .all-content .map-box .map .dot9 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #e7b693); animation: r1 5s infinite; animation-delay: 5.2s; } .all-content .map-box .map .dot9 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #e7b693; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot9 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot9 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot9 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot9 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot9 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot9 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot9 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot9 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot9 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot9 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .dot10 { position: absolute; top: 3.2rem; left: 3.5rem; } .all-content .map-box .map .dot10 .round1 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #694c45); animation: r1 5s infinite; animation-delay: 1.2s; } .all-content .map-box .map .dot10 .round4 { position: absolute; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-image: radial-gradient(rgba(222, 201, 154, 0), #694c45); animation: r1 5s infinite; animation-delay: 5.2s; } .all-content .map-box .map .dot10 .round3 { position: absolute; z-index: 1; top: 0; left: 0; width: 0.15rem; height: 0.15rem; border-radius: 50%; background-color: #694c45; cursor: pointer; transition: 0.5s; } .all-content .map-box .map .dot10 .round3::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; transform: scale(0.2); transition: 0.5s; } .all-content .map-box .map .dot10 .round3:hover { transform: scale(1.3); } .all-content .map-box .map .dot10 .round3:hover::after { transform: scale(0.14); } .all-content .map-box .map .dot10 .name-father { width: 0; position: absolute; top: 0.1rem; left: 0.1rem; overflow: hidden; transition: 2s; transition-delay: 0.5s; } .all-content .map-box .map .dot10 .name-father.show { width: 2.9775rem; } .all-content .map-box .map .dot10 .name-box { width: 2.9775rem; height: 1.23578rem; } .all-content .map-box .map .dot10 .name-box .line { width: 100%; height: 1.23578rem; position: absolute; top: 0; left: 0; } .all-content .map-box .map .dot10 .name-box .line img { width: 2.9775rem; } .all-content .map-box .map .dot10 .name-box .name { float: right; position: relative; right: 0; bottom: 0rem; font-size: 0.24rem; font-weight: bold; line-height: 0.24rem; letter-spacing: -0.0075rem; color: #E84127; text-align: right; } .all-content .map-box .map .dot10 .name-box .name span { display: block; font-size: 0.15rem; font-family: DIN; font-weight: bold; color: #333; letter-spacing: -0.0075rem; margin-top: 0.08rem; } .all-content .map-box .map .henan { position: absolute; top: 2.05rem; left: 3.65rem; text-align: center; } .all-content .map-box .map .henan .icon { width: 0.3rem; margin: 0 auto; } .all-content .map-box .map .henan .icon img { margin: 0 auto; width: 100%; } .all-content .map-box .map .henan .text { margin-top: 0.05rem; text-align: center; font-size: 0.12rem; line-height: 0.12rem; font-weight: bold; color: #000000; } .all-content .map-box .alert { width: 5.0551rem; height: 2.22rem; background-color: #fff; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05); position: absolute; top: -0.4275rem; right: 0.5475rem; } .all-content .map-box .alert .top-img { width: 100%; height: 1.485rem; overflow: hidden; position: relative; } .all-content .map-box .alert .top-img img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .all-content .map-box .alert .text { padding: 0 0.24rem; box-sizing: border-box; width: 100%; height: 0.735rem; display: flex; justify-content: space-between; align-items: center; } .all-content .map-box .alert .text .left .icon, .all-content .map-box .alert .text .left .font { display: inline-block; vertical-align: middle; } .all-content .map-box .alert .text .left .icon { width: 0.135rem; height: 0.165rem; background-image: url(../images/core_service_icon_address_black.jpg.png); background-repeat: no-repeat; background-size: 100% 100%; } .all-content .map-box .alert .text .left .font { font-size: 0.135rem; line-height: 0.135rem; font-weight: bold; color: #333333; } .all-content .map-box .alert .text .right { font-size: 0.18rem; line-height: 0.18rem; font-weight: bold; color: #000; } .all-content .numbers { width: 100%; height: 2.25rem; position: relative; overflow: hidden; } .all-content .numbers .img { width: 100%; height: 100%; object-fit: cover; object-position: center center; position: absolute; top: 0; left: 0; transition: all 1s; } .all-content .numbers:hover .img { transform: scale(1.05); } .all-content .numbers .num { display: flex; justify-content: center; align-items: center; position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); } .all-content .numbers .num li { flex-shrink: 0; display: inline-block; vertical-align: middle; } .all-content .numbers .num li .figure, .all-content .numbers .num li .text { display: inline-block; vertical-align: baseline; } .all-content .numbers .num li .figure { font-size: 0.675rem; line-height: 0.675rem; font-family: DIN; font-weight: bold; color: #FFFFFF; } .all-content .numbers .num li .text { margin-left: 0.15rem; } .all-content .numbers .num li .text span { display: block; font-size: 0.135rem; line-height: 0.21rem; color: #FFFFFF; } .all-content .numbers .num li:last-child .figure { color: #E84127; } .all-content .numbers .num .line { margin: 0 0.7rem; width: 1px; height: 0.6rem; background: #FFFFFF; opacity: 0.5; } .all-content .apply { width: 100%; height: 7.0502rem; position: relative; overflow: hidden; } .all-content .apply .img { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; } .all-content .apply .title { margin-top: 0.9075rem; margin-left: 13.5%; padding-left: 0.15rem; height: 0.3rem; border-left: 0.045rem solid #ea4027; font-size: 0.315rem; line-height: 0.315rem; font-weight: bold; color: #000000; position: relative; } .all-content .apply .left { position: absolute; top: 1.935rem; left: 2.1rem; } .all-content .apply .left .intro-top p { font-size: 0.39rem; line-height: 0.39rem; font-weight: bold; color: #E84227; line-height: 0.525rem; } .all-content .apply .left .intro-bot p { font-size: 0.15rem; font-weight: 400; color: #000000; line-height: 0.27rem; } .all-content .apply .left .bot-img { margin-top: 0.5325rem; } .all-content .apply .left .bot-img div { display: inline-block; } .all-content .apply .left .bot-img div:nth-of-type(2) { margin-left: 0.9rem; } .all-content .apply .left .bot-img div img { width: 1.05rem; height: 1.05rem; background: #FFFFFF; box-shadow: 0px 5px 14px 0px rgba(0, 0, 0, 0.26); border-radius: 0.1125rem; } .all-content .apply .left .bot-img div .version { margin-top: 0.2775rem; font-size: 0.18rem; line-height: 0.18rem; font-weight: bold; color: #EA4027; } .all-content .apply .left .bot-img div .search { margin-top: 0.18rem; font-size: 0.135rem; font-weight: 400; color: #000000; line-height: 0.2325rem; } .all-content .apply .right { width: 2.445rem; position: absolute; top: 1.3125rem; right: 2.22rem; } .all-content .apply .right img { width: 2.445rem; } .all-content .life-box { width: 100%; height: 7.0502rem; position: relative; text-align: center; } .all-content .life-box .img { width: 100%; height: 100%; background-attachment: fixed; background-repeat: no-repeat; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; } .all-content .life-box .title { display: inline-block; padding-left: 0.15rem; height: 0.3rem; border-left: 0.045rem solid #ea4027; font-size: 0.315rem; line-height: 0.315rem; font-weight: bold; color: #fff; position: relative; top: 1.5rem; } .all-content .life-box .content { margin: 0 auto; width: 10.5002rem; position: relative; top: 3.9rem; display: flex; justify-content: space-between; } .all-content .life-box .content .text-box { color: #fff; text-align: left; } .all-content .life-box .content .text-box .box-top .left { font-size: 0.525rem; line-height: 0.525rem; font-family: DIN; font-weight: bold; color: #E84127; } .all-content .life-box .content .text-box .box-top .right { font-size: 0.27rem; line-height: 0.27rem; font-weight: bold; color: #FFFFFF; } .all-content .life-box .content .text-box .intro { margin-top: 0.21rem; } .all-content .life-box .content .text-box .intro p { text-align: justify; font-size: 0.12rem; font-weight: 400; color: #FFFFFF; line-height: 0.225rem; } .all-content .life-box .content .text-box:nth-of-type(1) { width: 2.94rem; } .all-content .life-box .content .text-box:nth-of-type(2) { width: 2.0325rem; } .all-content .life-box .content .text-box:nth-of-type(3) { width: 2.5575rem; } .all-content .accordion { width: 100%; height: 6.00002rem; overflow: hidden; } .all-content .accordion .box { width: 100%; height: 100%; position: relative; } .all-content .accordion .box .digitizing { width: 25.2%; float: left; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; } .all-content .accordion .box .digitizing a { width: 100%; height: 100%; display: block; } .all-content .accordion .box .digitizing a .img { width: 100%; height: 100%; display: block; position: relative; overflow: hidden; } .all-content .accordion .box .digitizing a .img img { position: absolute; height: 100%; top: 0; left: -200px; right: -200px; margin: auto; } .all-content .accordion .box .digitizing a .bg { width: 102%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 2; background-color: rgba(0, 0, 0, 0.7); transition: 0.5s; } .all-content .accordion .box .digitizing a .number { width: 100%; font-family: "DIN-Bold"; font-size: 0.42rem; line-height: 0.42rem; letter-spacing: -0.015rem; color: #f0f0f0; position: absolute; top: 1.5rem; left: 0; text-align: center; z-index: 2; opacity: 0; transition: 0.5s; } .all-content .accordion .box .digitizing a .line { width: 1px; height: 0; background-color: #f0f0f0; position: absolute; top: 2.3rem; left: 50%; z-index: 2; transition: 0.5s; } .all-content .accordion .box .digitizing a .title { width: 100%; font-size: 0.42rem; font-weight: bold; line-height: 0.42rem; letter-spacing: -0.015rem; color: #ffffff; position: absolute; top: 2.73751rem; left: 0; text-align: center; z-index: 2; } .all-content .accordion .box .digitizing a .en { width: 100%; font-family: "Arial"; font-size: 0.12rem; line-height: 0.12rem; letter-spacing: 0px; color: #ffffff; text-align: center; position: absolute; top: 3.33001rem; left: 0; z-index: 2; } .all-content .accordion .box .digitizing a .button { display: block; width: 0.3rem; height: 0.3rem; border-radius: 50%; position: absolute; top: 3.5rem; left: calc(50% - 0.15rem); z-index: 2; opacity: 0; background-color: rgba(255, 255, 255, 0.3); transition: 0.5s; } .all-content .accordion .box .digitizing a .button img { display: block; width: 0.0525rem; height: 0.105rem; margin: 0 auto; padding-top: 0.0975rem; } .all-content .accordion .box .digitizing a:hover .bg { background-color: rgba(232, 65, 39, 0.9); } .all-content .accordion .box .digitizing a:hover .number { opacity: 1; top: 1.125rem; } .all-content .accordion .box .digitizing a:hover .line { height: 0.405rem; top: 1.815rem; } .all-content .accordion .box .digitizing a:hover .button { top: 3.84001rem; opacity: 1; } .all-content .accordion .box .intelligent { width: 25.2%; float: left; height: 100%; position: absolute; top: 0; left: 25%; z-index: 2; } .all-content .accordion .box .intelligent a { width: 100%; height: 100%; display: block; } .all-content .accordion .box .intelligent a .img { width: 100%; height: 100%; display: block; position: relative; overflow: hidden; } .all-content .accordion .box .intelligent a .img img { position: absolute; height: 100%; top: 0; left: -200px; right: -200px; margin: auto; } .all-content .accordion .box .intelligent a .bg { width: 102%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 2; background-color: rgba(0, 0, 0, 0.7); transition: 0.5s; } .all-content .accordion .box .intelligent a .number { width: 100%; font-family: "DIN-Bold"; font-size: 0.42rem; line-height: 0.42rem; letter-spacing: -0.015rem; color: #f0f0f0; position: absolute; top: 1.5rem; left: 0; text-align: center; z-index: 2; opacity: 0; transition: 0.5s; } .all-content .accordion .box .intelligent a .line { width: 1px; height: 0; background-color: #f0f0f0; position: absolute; top: 2.3rem; left: 50%; z-index: 2; transition: 0.5s; } .all-content .accordion .box .intelligent a .title { width: 100%; font-size: 0.42rem; font-weight: bold; line-height: 0.42rem; letter-spacing: -0.015rem; color: #ffffff; position: absolute; top: 2.73751rem; left: 0; text-align: center; z-index: 2; } .all-content .accordion .box .intelligent a .en { width: 100%; font-family: "Arial"; font-size: 0.12rem; line-height: 0.12rem; letter-spacing: 0px; color: #ffffff; text-align: center; position: absolute; top: 3.33001rem; left: 0; z-index: 2; } .all-content .accordion .box .intelligent a .button { display: block; width: 0.3rem; height: 0.3rem; border-radius: 50%; position: absolute; top: 3.5rem; left: calc(50% - 0.15rem); z-index: 2; opacity: 0; background-color: rgba(255, 255, 255, 0.3); transition: 0.5s; } .all-content .accordion .box .intelligent a .button img { display: block; width: 0.0525rem; height: 0.105rem; margin: 0 auto; padding-top: 0.0975rem; } .all-content .accordion .box .intelligent a:hover .bg { background-color: rgba(232, 65, 39, 0.9); } .all-content .accordion .box .intelligent a:hover .number { opacity: 1; top: 1.125rem; } .all-content .accordion .box .intelligent a:hover .line { height: 0.405rem; top: 1.815rem; } .all-content .accordion .box .intelligent a:hover .button { top: 3.84001rem; opacity: 1; } .all-content .accordion .box .globalization { width: 25.2%; float: left; height: 100%; position: absolute; top: 0; left: 50%; z-index: 3; } .all-content .accordion .box .globalization a { width: 100%; height: 100%; display: block; } .all-content .accordion .box .globalization a .img { width: 100%; height: 100%; display: block; position: relative; overflow: hidden; } .all-content .accordion .box .globalization a .img img { position: absolute; height: 100%; top: 0; left: -200px; right: -200px; margin: auto; } .all-content .accordion .box .globalization a .bg { width: 102%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 2; background-color: rgba(0, 0, 0, 0.7); transition: 0.5s; } .all-content .accordion .box .globalization a .number { width: 100%; font-family: "DIN-Bold"; font-size: 0.42rem; line-height: 0.42rem; letter-spacing: -0.015rem; color: #f0f0f0; position: absolute; top: 1.5rem; left: 0; text-align: center; z-index: 2; opacity: 0; transition: 0.5s; } .all-content .accordion .box .globalization a .line { width: 1px; height: 0; background-color: #f0f0f0; position: absolute; top: 2.3rem; left: 50%; z-index: 2; transition: 0.5s; } .all-content .accordion .box .globalization a .title { width: 100%; font-size: 0.42rem; font-weight: bold; line-height: 0.42rem; letter-spacing: -0.015rem; color: #ffffff; position: absolute; top: 2.73751rem; left: 0; text-align: center; z-index: 2; } .all-content .accordion .box .globalization a .en { width: 100%; font-family: "Arial"; font-size: 0.12rem; line-height: 0.12rem; letter-spacing: 0px; color: #ffffff; text-align: center; position: absolute; top: 3.33001rem; left: 0; z-index: 2; } .all-content .accordion .box .globalization a .button { display: block; width: 0.3rem; height: 0.3rem; border-radius: 50%; position: absolute; top: 3.5rem; left: calc(50% - 0.15rem); z-index: 2; opacity: 0; background-color: rgba(255, 255, 255, 0.3); transition: 0.5s; } .all-content .accordion .box .globalization a .button img { display: block; width: 0.0525rem; height: 0.105rem; margin: 0 auto; padding-top: 0.0975rem; } .all-content .accordion .box .globalization a:hover .bg { background-color: rgba(232, 65, 39, 0.9); } .all-content .accordion .box .globalization a:hover .number { opacity: 1; top: 1.125rem; } .all-content .accordion .box .globalization a:hover .line { height: 0.405rem; top: 1.815rem; } .all-content .accordion .box .globalization a:hover .button { top: 3.84001rem; opacity: 1; } .all-content .accordion .box .green { width: 25.2%; float: left; height: 100%; position: absolute; top: 0; left: 75%; z-index: 4; } .all-content .accordion .box .green a { width: 100%; height: 100%; display: block; } .all-content .accordion .box .green a .img { width: 100%; height: 100%; display: block; position: relative; overflow: hidden; } .all-content .accordion .box .green a .img img { position: absolute; height: 100%; top: 0; left: -200px; right: -200px; margin: auto; } .all-content .accordion .box .green a .bg { width: 102%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 2; background-color: rgba(0, 0, 0, 0.7); transition: 0.5s; } .all-content .accordion .box .green a .number { width: 100%; font-family: "DIN-Bold"; font-size: 0.42rem; line-height: 0.42rem; letter-spacing: -0.015rem; color: #f0f0f0; position: absolute; top: 1.5rem; left: 0; text-align: center; z-index: 2; opacity: 0; transition: 0.5s; } .all-content .accordion .box .green a .line { width: 1px; height: 0; background-color: #f0f0f0; position: absolute; top: 2.3rem; left: 50%; z-index: 2; transition: 0.5s; } .all-content .accordion .box .green a .title { width: 100%; font-size: 0.42rem; font-weight: bold; line-height: 0.42rem; letter-spacing: -0.015rem; color: #ffffff; position: absolute; top: 2.73751rem; left: 0; text-align: center; z-index: 2; } .all-content .accordion .box .green a .en { width: 100%; font-family: "Arial"; font-size: 0.12rem; line-height: 0.12rem; letter-spacing: 0px; color: #ffffff; text-align: center; position: absolute; top: 3.33001rem; left: 0; z-index: 2; } .all-content .accordion .box .green a .button { display: block; width: 0.3rem; height: 0.3rem; border-radius: 50%; position: absolute; top: 3.5rem; left: calc(50% - 0.15rem); z-index: 2; opacity: 0; background-color: rgba(255, 255, 255, 0.3); transition: 0.5s; } .all-content .accordion .box .green a .button img { display: block; width: 0.0525rem; height: 0.105rem; margin: 0 auto; padding-top: 0.0975rem; } .all-content .accordion .box .green a:hover .bg { background-color: rgba(232, 65, 39, 0.9); } .all-content .accordion .box .green a:hover .number { opacity: 1; top: 1.125rem; } .all-content .accordion .box .green a:hover .line { height: 0.405rem; top: 1.815rem; } .all-content .accordion .box .green a:hover .button { top: 3.84001rem; opacity: 1; } .m-area { display: none; } @media screen and (max-width: 1020px) { .all-content .content-title { margin-left: 5%; padding-top: 0.66rem; margin-bottom: 0.4875rem; } .all-content .content-title .title { padding-left: 0.15rem; height: 0.4rem; border-left: 0.045rem solid #ea4027; font-size: 0.42rem; line-height: 0.42rem; font-weight: bold; color: #000000; } .all-content .culture-box { width: 100%; height: 3.6751rem; margin: 0 auto; position: relative; overflow: hidden; } .all-content .culture-box .culture-text .top { margin-top: 0.81rem; font-size: 0.28rem; line-height: 0.28rem; font-weight: 400; color: #FFFFFF; } .all-content .culture-box .culture-text .bot { margin-top: 0.185rem; font-size: 0.2175rem; line-height: 0.2175rem; font-family: DIN-BOLD; font-weight: bold; color: #D0D1D1; opacity: 0.3; } .all-content .map-box { margin-top: 0.9375rem; margin-bottom: 0.2rem; } .all-content .map-box .title { margin-left: 5%; margin-bottom: 4rem; padding-left: 0.15rem; height: 0.4rem; border-left: 0.045rem solid #ea4027; font-size: 0.42rem; line-height: 0.42rem; font-weight: bold; color: #000000; } .all-content .map-box .map { width: 100%; margin: 0 auto; margin-top: 0.14rem; position: relative; } .all-content .map-box .map .henan { position: absolute; top: 29%; left: 29%; text-align: center; } .all-content .map-box .map .dot1 { position: absolute; top: 32%; left: 12%; } .all-content .map-box .map .dot2 { position: absolute; top: 49%; left: 16%; } .all-content .map-box .map .dot3 { position: absolute; top: 29%; left: 16%; } .all-content .map-box .map .dot4 { position: absolute; top: 39%; left: 22%; } .all-content .map-box .map .dot5 { position: absolute; top: 55%; left: 31%; } .all-content .map-box .map .dot6 { position: absolute; top: 45%; left: 36%; } .all-content .map-box .map .dot7 { position: absolute; top: 64%; left: 32%; } .all-content .map-box .map .dot8 { position: absolute; top: 51%; left: 75%; } .all-content .map-box .map .dot9 { position: absolute; top: 45.5%; left: 33%; } .all-content .map-box .map .dot10 { position: absolute; top: 60%; left: 31%; } .all-content .map-box .alert { width: 90%; height: 3rem; background-color: #fff; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.2); position: absolute; top: -3.4275rem; right: 0.31rem; } .all-content .map-box .alert .top-img { width: 100%; height: 2rem; overflow: hidden; position: relative; } .all-content .map-box .alert .top-img .img-text { font-size: 0.22rem; line-height: 0.22rem; font-weight: bold; color: #FFFFFF; position: absolute; bottom: 0.18rem; right: 0.18rem; } .all-content .map-box .alert .text { padding: 0 0.24rem; box-sizing: border-box; width: 100%; height: 1rem; display: flex; justify-content: space-between; align-items: center; } .all-content .map-box .alert .text .left .icon { width: 0.2rem; height: 0.235rem; background-image: url(../images/core_service_icon_address_black.jpg.png); background-repeat: no-repeat; background-size: 100% 100%; } .all-content .map-box .alert .text .left .font { font-size: 0.28rem; line-height: 0.28rem; font-weight: normal; color: #333333; } .all-content .map-box .alert .text .right { font-size: 0.35rem; line-height: 0.35rem; font-weight: bold; color: #000; } .all-content .numbers .num { width: 100%; display: flex; justify-content: space-evenly; align-items: center; position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); } .all-content .numbers .num li .figure { font-size: 0.5rem; line-height: 0.5rem; font-family: DIN-BOLD; font-weight: bold; color: #FFFFFF; } .all-content .numbers .num li .figure, .all-content .numbers .num li .text { display: block; text-align: center; } .all-content .numbers .num li .text { margin-top: 0.2rem; margin-left: 0rem; } .all-content .numbers .num li .text span { display: block; font-size: 0.25rem; line-height: 0.3rem; color: #FFFFFF; } .all-content .numbers .num .line { margin: 0 0.2rem; width: 1px; height: 0.6rem; background: #FFFFFF; opacity: 0.5; display: none; } .all-content .apply { width: 100%; height: 14rem; position: relative; overflow: hidden; } .all-content .apply .title { margin-top: 0.9075rem; margin-left: 5%; padding-left: 0.15rem; height: 0.4rem; border-left: 0.045rem solid #ea4027; font-size: 0.42rem; line-height: 0.42rem; font-weight: bold; color: #000000; position: relative; } .all-content .apply .left { width: 90%; margin: 0 auto; text-align: center; position: relative; top: 0.5rem; left: 0rem; } .all-content .apply .left .intro-bot { margin-top: 0.1rem; } .all-content .apply .left .intro-bot p { font-size: 0.25rem; font-weight: 400; color: #000000; line-height: 0.4rem; } .all-content .apply .left .bot-img { width: 100%; margin-top: 5.8rem; } .all-content .apply .left .bot-img div:nth-of-type(2) { margin-left: 0rem; } .all-content .apply .left .bot-img div { display: inline-block; vertical-align: top; width: 48%; } .all-content .apply .left .bot-img div img { width: 1.5rem; height: 1.5rem; background: #FFFFFF; box-shadow: 0px 5px 14px 0px rgba(0, 0, 0, 0.26); border-radius: 0.1125rem; } .all-content .apply .left .bot-img div .version { margin-top: 0.2775rem; font-size: 0.35rem; line-height: 0.35rem; font-weight: bold; color: #EA4027; } .all-content .apply .left .bot-img div .search { width: 100%; margin-top: 0.18rem; font-size: 0.25rem; font-weight: 400; color: #000000; line-height: 0.4rem; } .all-content .apply .right { width: 100%; position: absolute; top: 4rem; left: 0; } .all-content .apply .right img { display: block; margin: 0 auto; } .all-content .life-box { width: 100%; height: 9rem; position: relative; text-align: center; } .all-content .life-box .title { margin-top: 0.84rem; margin-left: 5%; padding-left: 0.15rem; height: 0.4rem; border-left: 0.045rem solid #ea4027; font-size: 0.42rem; line-height: 0.42rem; font-weight: bold; color: #fff; position: relative; top: 0rem; } .all-content .life-box .img { width: 100%; height: 100%; background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; } .all-content .life-box .content { margin: 0 auto; margin-top: 0.5rem; width: 90%; position: relative; top: 0rem; display: flex; flex-direction: column; align-items: center; justify-content: space-between; align-content: flex-start; } .all-content .life-box .content .text-box:nth-of-type(1), .all-content .life-box .content .text-box:nth-of-type(2), .all-content .life-box .content .text-box:nth-of-type(3) { margin-bottom: 0.5rem; width: 5rem; } .all-content .life-box .content .text-box .box-top .left { font-size: 0.525rem; line-height: 0.525rem; font-family: DIN-bold; font-weight: bold; color: #E84127; } .all-content .life-box .content .text-box .box-top .right { font-size: 0.35rem; line-height: 0.35rem; font-weight: bold; color: #FFFFFF; } .all-content .life-box .content .text-box .intro p { text-align: justify; font-size: 0.22rem; font-weight: 400; color: #FFFFFF; line-height: 0.35rem; } .m-area { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; } .m-area li { flex-shrink: 0; width: 50%; height: 1rem; line-height: 1rem; text-align: center; font-size: 0.28rem; background-color: #f8f8f8; transition: all 0.5s; } .m-area .areaActive { background-color: #EA4027; color: #fff; } .all-content .accordion .box .digitizing { width: 25.2%; left: 0; } .all-content .accordion .box .digitizing a .bg { left: -0.5px; } .all-content .accordion .box .digitizing a .en { font-size: 0.16rem; line-height: 0.16rem; } .all-content .accordion .box .intelligent { width: 25.2%; left: 25%; } .all-content .accordion .box .intelligent a .bg { left: -0.5px; } .all-content .accordion .box .intelligent a .en { font-size: 0.16rem; line-height: 0.16rem; } .all-content .accordion .box .globalization { width: 25.2%; left: 50%; } .all-content .accordion .box .globalization a .bg { left: -0.5px; } .all-content .accordion .box .globalization a .en { font-size: 0.16rem; line-height: 0.16rem; } .all-content .accordion .box .green { width: 25.2%; left: 75%; } .all-content .accordion .box .green a .bg { left: -0.5px; } .all-content .accordion .box .green a .en { font-size: 0.16rem; line-height: 0.16rem; } } @keyframes r1 { 0% { opacity: 1; transform: scale(0); } 100% { opacity: 0; transform: scale(3); } } @-webkit-keyframes r1 { 0% { opacity: 1; transform: scale(0); } 100% { opacity: 0; transform: scale(3); } } @keyframes r2 { 0% { opacity: 1; transform: scale(0); } 100% { opacity: 0; transform: scale(3); } } @-webkit-keyframes r2 { 0% { opacity: 1; transform: scale(0); } 100% { opacity: 0; transform: scale(3); } }