/* 棣栭〉鏍峰紡 */ .home .data-display-area { position: relative; } .home .data-display-area .bg-img { z-index: -1; } .home .data-display-area .bg-img.earth { background-size: 40%; background-position-y: 0.4rem; } .home .data-display-area .bg-img.aurora { /* background-size: 100%; */ background-position-x: 100%; } .home .data-display-area .data-list { width: 92%; max-width: 1440px; /* display: flex; justify-content: space-evenly; align-items: center; */ margin: 0 auto; padding: 0.6rem 0; } .home .data-display-area .data-item { text-align: center; /* width: 1000px; */ padding: 0.4rem 0.2rem; } .home .data-display-area .swiper-button-next, .home .data-display-area .swiper-button-prev { font-size: 20px; color: #da251d; visibility: hidden; display: flex; align-items: center; justify-content: center; } .home .data-display-area .swiper-button-disabled { opacity: 0; } .home .data-display-area .swiper-button-prev { left: 0; } .home .data-display-area .swiper-button-next { right: 0; } @media only screen and (max-width:1024px) { .home .data-display-area .swiper-button-next, .home .data-display-area .swiper-button-prev { visibility: visible; } } .home .data-display-area .data-item+.data-item { border-left: 1px solid #e2e7e4; } .home .data-display-area .data-item .data-area { color: #da251d; } .home .data-display-area .data-item .data { font-size: 0.54rem; font-weight: bold; } .home .data-display-area .data-item .text, .home .data-display-area .data-item .unit { font-size: 18px; text-align: center; } .home .data-display-area .data-item .unit { font-weight: bold; } .home .data-display-area .data-item .short-line { display: inline-block; width: 0.3rem; height: 1px; background: #adbab3; margin: 0.2rem; } .home .info-area { position: relative; } .home .info-area .bg-img { z-index: -1; } .home .info-area::after { width: 100%; height: 100%; position: absolute; z-index: 2; background: #000; opacity: 1; } .home .info-area .outer-container { width: 92%; max-width: 1760px; margin: 0 auto; color: #fff; padding: 2rem 0; display: flex; justify-content: flex-end; } .home .info-area .outer-container .title-area { width: 40%; text-align: left; } .home .info-area .outer-container .eng-title { font-size: 0.6rem; color: rgba(173, 186, 179, 0.35); font-weight: bold; line-height: 1.2; } .home .info-area .outer-container .chs-title { font-size: 0.3rem; margin-top: 0.2rem; } .home .info-area .outer-container .cut-line { margin: 0.2rem 0; } .home .info-area .outer-container .text { font-size: 18px; line-height: 2; } .home .products-info-area { position: relative; width: 100%; margin: 0 auto; } .home .products-info-area .area-title .bg-img { z-index: -1; } .home .products-info-area .area-title { position: relative; text-align: center; padding: 0.6rem 0 1.2rem 0; color: #fff; } .home .products-info-area .area-title .eng-title { font-size: 0.72rem; opacity: 0.15; font-weight: bold; width: 92%; max-width: 1000px; margin: 0 auto; } .home .products-info-area .area-title .chs-title { font-size: 0.3rem; width: 92%; max-width: 1000px; margin: 0 auto; margin-top: -0.6rem; } .home .products-info-area .area-title .cut-line { margin: 0.3rem 0 0.4rem 0; } .home .products-list-area { width: 92%; max-width: 1440px; margin: -1.2rem auto 0 auto; background: #fff; display: grid; grid-template-columns: calc(100% / 3) calc(100% / 3) calc(100% / 3); grid-template-rows: auto auto; grid-auto-flow: row dense; -ms-grid-template-columns: calc(100% / 3) calc(100% / 3) calc(100% / 3); -ms-grid-template-rows: auto auto; -ms-grid-auto-flow: row dense; } .home .products-list-area .product-item-container .bg-img-container { padding-top: 68.42%; } .home .products-list-area .product-item-container:nth-child(1) .bg-img-container { padding-top: 136.84%; } .home .products-list-area .product-item-container .bg-img-container { background-image: url(/phone/images/blurImg1.png); } .home .products-list-area .product-item-container:nth-child(1) { grid-column-start: 2; grid-column-end: 3; grid-row-start: 1; grid-row-end: 3; -ms-grid-column-start: 2; -ms-grid-column-end: 3; -ms-grid-row-start: 1; -ms-grid-row-end: 3; } .home .products-list-area .product-item { position: relative; } .home .products-list-area .product-item .link-container, .home .products-list-area .product-item .title-area { position: absolute; width: 100%; height: 100%; top: 0; left: 0; padding: 0.26rem 0.3rem; } .home .products-list-area .product-item .chs-title { font-size: 22px; line-height: 1.2; } .home .products-list-area .product-item .eng-title { font-size: 14px; opacity: 0.25; margin-top: 0.06rem; font-weight: bold; } .home .products-list-area .product-item .sub-title { margin-top: 0.2rem; font-size: 18px; } .home .products-list-area .product-item .link-container { height: auto; width: auto; top: auto; bottom: 0; } .home .products-list-area .product-item .sub-title, .home .products-list-area .product-item .link-container { opacity: 0; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .home .products-list-area .product-item:hover, .home .products-list-area .product-item:hover .sub-title, .home .products-list-area .product-item:hover .link-container { color: #fff; opacity: 1; } .home .products-info-area .show-all-button-container { text-align: center; margin: 0.5rem 0; } .home .products-info-area .show-all-button { display: inline-block; color: #da251d; font-size: 16px; padding: 10px; } .home .products-info-area .show-all-button .cut-line { margin: 0.1rem 0; } .home .about-industry-info-area { position: relative; padding: 1.2rem 0 0.6rem 0; } .home .about-industry-info-area .bg-img { z-index: -1; } .home .about-industry-info-area .about-us-container { width: 92%; max-width: 1440px; margin: 0 auto; display: flex; justify-content: space-between; position: relative; } .home .about-industry-info-area .left-area { width: 54.17%; } .home .about-industry-info-area .right-area { width: 38.89%; } .home .about-industry-info-area .about-us-container .bg-img-container { padding-top: 62.56%; } .home .about-industry-info-area .right-area .eng-title { font-size: 0.6rem; font-weight: 600; } .home .about-industry-info-area .right-area .chs-title { font-size: 0.3rem; } .home .about-industry-info-area .right-area .cut-line { margin: 0.2rem 0; } .home .about-industry-info-area .right-area .text { line-height: 2; } .home .about-industry-info-area .right-area .link-container { margin-top: 1rem; } .home .about-industry-info-area .swiper-pagination-bullet { opacity: 1; background: #fff; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .home .about-industry-info-area .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #da251d; } .home .about-industry-info-area .industry-container { width: 92%; max-width: 1440px; margin: 1rem auto 0 auto; } .area-title.normal { display: flex; justify-content: flex-start; align-items: center; } .area-title.normal .eng-title, .area-title.normal .chs-title { line-height: 1; display: inline-block; font-size: 0.3rem; } .area-title.normal .cut-line { margin: 14px 0 0; display: block; } .area-title.normal .eng-title { font-size: 0.6rem; margin-left: 0.2rem; /* opacity: 0.35; */ color: rgba(173, 186, 179, 0.35); font-weight: bold; } .home .about-industry-info-area .industry-container .industry-swiper { margin: 0.4rem -15px 0; } .home .about-industry-info-area .industry-container .swiper-slide { padding: 15px; } .home .about-industry-info-area .industry-container .swiper-slide>a { box-shadow: 0 0 15px 0 rgba(100, 100, 100, 0.3); } .home .about-industry-info-area .industry-container .bg-img-container { padding-top: 55.45%; } .home .about-industry-info-area .industry-container .title-area { background: #fff; display: flex; justify-content: space-between; align-items: center; padding: 0.2rem 0.24rem; } .home .about-industry-info-area .industry-container .title-area .chs-title { font-size: 24px; white-space: nowrap; } .home .about-industry-info-area .industry-container .title-area .eng-title { font-size: 14px; opacity: 0.25; font-weight: bold; text-align: right; height: calc(14px * 1.6 * 3); display: flex; align-items: center; } .home .about-industry-info-area .industry-swiper-controller { position: relative; height: 0.5rem; margin-top: 0.1rem; display: flex; align-items: center; } .home .about-industry-info-area .industry-swiper-controller .swiper-button-next, .home .about-industry-info-area .industry-swiper-controller .swiper-button-prev { font-size: 0.4rem !important; color: #da251d; transition: color 0.5s ease; -webkit-transition: color 0.5s ease; -moz-transition: color 0.5s ease; -ms-transition: color 0.5s ease; -o-transition: color 0.5s ease; transform: scaleY(0.8); -webkit-transform: scaleY(0.8); -moz-transform: scaleY(0.8); -ms-transform: scaleY(0.8); -o-transform: scaleY(0.8); } .home .about-industry-info-area .industry-swiper-controller .swiper-button-disabled { color: #adbab3; opacity: 1; } .home .about-industry-info-area .industry-swiper-controller .swiper-button-prev { left: 0; } .home .about-industry-info-area .industry-swiper-controller .swiper-button-next { right: 0; left: 0.76rem; } .swiper-scrollbar { left: 1.7rem; height: 2px; width: calc(100% - 1.7rem); } .swiper-scrollbar-drag { background: #da251d; width: calc(100% - 120px); } .home .topics-area { width: 92%; max-width: 1440px; margin: 0.6rem auto; } .home .topics-area .title-container { display: flex; justify-content: space-between; align-items: center; } .home .topics-area .topics-swiper { margin-top: 0.5rem; } .home .topics-area .swiper-slide>a { display: flex; justify-content: space-between; } .home .topics-area .swiper-slide .bg-img-container { width: 46.51%; min-width: 46.51%; padding-top: 27.91%; } .home .topics-area .swiper-slide .title-area { width: 46.51%; max-width: 46.51%; } .home .topics-area .swiper-slide .title-area .title { font-size: 0.2rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .home .topics-area .swiper-slide .title-area .date-container { display: flex; align-items: center; justify-content: space-between; margin-top: 0.25rem; font-size: 14px; color: #adbab3; } .home .topics-area .swiper-slide .title-area .date-container .show-more-button { display: flex; align-items: center; justify-content: space-between; color: #da251d; } .home .topics-area .swiper-slide .title-area .date-container .show-more-button .iconfont { font-size: 14px; margin-left: 5px; } @media only screen and (min-width:1921px) { .home .info-area .outer-container .eng-title { font-size: 0.45rem; } .home .topics-area .swiper-slide .title-area .title { font-size: 20px; } } @media only screen and (max-width:1900px) { .home .info-area .outer-container .title-area { width: 42%; } } @media only screen and (max-width:1600px) { .nav-menu .left-area .slogon { display: none; } .home .info-area .outer-container .title-area { width: 45%; } .area-title.normal .chs-title, .home .about-industry-info-area .right-area .chs-title, .home .products-info-area .area-title .chs-title, .home .info-area .outer-container .chs-title { font-size: 24px; white-space: normal; } .home .info-area .outer-container .text { line-height: unset; } .home .products-list-area .product-item .title-area { padding: 20px 26px; } .home .about-industry-info-area .industry-container .title-area { padding: 20px 24px; } .home .topics-area .swiper-slide .title-area .title { font-size: 16px; } .home .about-industry-info-area .industry-container .title-area .chs-title { font-size: 22px; } } @media only screen and (max-width:1400px) { .home .about-industry-info-area .industry-container .title-area .eng-title { display: none; } } @media only screen and (max-width:1200px) { .home .about-industry-info-area .industry-container .title-area .chs-title { font-size: 20px; } .home .info-area .outer-container .title-area { width: 50%; } .home .products-list-area .product-item .chs-title { font-size: 20px; } .home .about-industry-info-area .right-area { width: 42%; } .home .about-industry-info-area .industry-swiper-controller .swiper-button-next, .home .about-industry-info-area .industry-swiper-controller .swiper-button-prev { font-size: 28px !important; } } @media only screen and (max-width:1024px) { .home .info-area .outer-container .title-area { width: 80%; } .area-title.normal .eng-title, .home .about-industry-info-area .right-area .eng-title, .home .products-info-area .area-title .eng-title, .home .info-area .outer-container .eng-title { font-size: 34px; } .home .data-display-area .data-item .text, .home .data-display-area .data-item .unit { font-size: 16px; } .home .products-list-area { grid-template-columns: calc(100% / 2) calc(100% / 2); grid-template-rows: auto auto auto; grid-auto-flow: row dense; -ms-grid-template-columns: calc(100% / 2) calc(100% / 2); -ms-grid-template-rows: auto auto auto; -ms-grid-auto-flow: row dense; } } @media only screen and (max-width:768px) { .home .info-area .outer-container .text { font-size: 16px; } .home .info-area .outer-container .title-area { width: 100%; } .home .data-display-area .data-item .data { font-size: 24px; } .home .products-list-area { display: block; } .home .products-list-area .product-item-container { width: 100%; margin-bottom: 1px; } .home .products-list-area .product-item .title-area { padding: 14px 20px; } .home .about-industry-info-area .about-us-container { flex-direction: column; } .home .about-industry-info-area .about-us-container>div { width: 100%; } .home .about-industry-info-area .about-us-container>div+div { margin-top: 0.5rem; } .area-title.normal { display: flex; flex-direction: column-reverse; align-items: flex-start; } .area-title.normal .eng-title { margin-left: 0; } .area-title.normal .eng-title, .area-title.normal .chs-title { line-height: unset; } .home .topics-area .swiper-slide>a { flex-direction: column; } .home .topics-area .swiper-slide>a>div { width: 100% !important; min-width: 100% !important; max-width: 100% !important; } .home .topics-area .swiper-slide>a .title-area { margin-top: 0.5rem; } .home .topics-area .swiper-slide .bg-img-container { padding-top: 60%; } .home .data-display-area .data-item .text { font-size: 14px; } } @media only screen and (max-width:480px) { .home .info-area .outer-container .text { font-size: 14px; } .home .data-display-area .data-item .text { font-size: 12px; } } /* 浜у搧涓績鏍峰紡 */ .products-info-area { margin: 0 auto 1rem auto; width: 92%; } .products-info-area .breadcrumb { margin-bottom: 0; } .products-info-area .area-title { text-align: center; } .products-info-area .area-title .title { font-size: 0.3rem; line-height: 1.2; } .products-info-area .area-title .cut-line, .products-info-area .area-title .sub-title { font-size: 18px; margin-top: 0.2rem; } .products-info-area .area-title .cut-line { margin-top: 0.3rem; margin-bottom: 0.47rem; } .products-info-area .products-info-list { display: flex; justify-content: flex-start; flex-wrap: wrap; } .products-info-area .product-info-item { width: 100%; margin: 3px; } .products-info-area .product-info-item a { position: relative; } .products-info-area .product-info-item .bg-img-container { padding-top: 39.77%; } .products-info-area .product-info-item.sm { width: calc(100% / 2 - 6px); } .products-info-area .product-info-item.sm .bg-img-container { padding-top: 62.14%; } .products-info-area .product-info-item .bg-img-container .bg-img.blur { background-position: center right; background-image: url(/phone/images/blurImg1.png) !important; } .products-info-area .product-info-item .title-area { width: 50%; padding: 0.6rem 1.6rem; color: #fff; } .products-info-area .product-info-item .title-area .chs-title { font-size: 0.3rem; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .products-info-area .product-info-item .title-area .eng-title { color: rgba(255, 255, 255, 0.35); font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .products-info-area .product-info-item .title-area.font-bk .eng-title { color: rgba(0, 0, 0, 0.35); } .products-info-area .product-info-item:hover .title-area { color: #fff !important; } .products-info-area .product-info-item:hover .title-area .eng-title { color: rgba(255, 255, 255, 0.35) !important; } .products-info-area .product-info-item .title-area .text { margin-top: 0.24rem; font-size: 14px; line-height: 2; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; } .products-info-area .product-info-item.sm .title-area .text { -webkit-line-clamp: 2; visibility: hidden !important; } .products-info-area .product-info-item .link-container { margin-top: 0.5rem; transition-delay: 0.15s; visibility: hidden !important; } .products-info-area .product-info-item.sm .title-area { width: 100%; height: 100%; text-align: center; padding: 0.6rem; } .products-info-area .product-info-item.sm:hover .title-area .text, .products-info-area .product-info-item:hover .link-container { visibility: visible !important; } @media only screen and (max-width:1400px) { .products-info-area .product-info-item .title-area .chs-title { font-size: 22px; } } @media only screen and (max-width:1200px) { .products-info-area .area-title .title { font-size: 24px; } .products-info-area .product-info-item .title-area { padding: 0.4rem 1rem; } .products-info-area .product-info-item.sm .title-area { padding: 0.4rem; } } @media only screen and (max-width:1024px) { .products-info-area .area-title .title { font-size: 22px; } .products-info-area .product-info-item:not(.sm) .title-area .text { -webkit-line-clamp: 3; } } @media only screen and (max-width:768px) { .products-info-area .product-info-item { width: 100% !important; margin: 3px 0; } .products-info-area .product-info-item .bg-img-container { padding-top: 62.14% !important; } .products-info-area .product-info-item .title-area { width: 100%; height: 100%; text-align: center; padding: 0.6rem 0.4rem; } .products-info-area .product-info-item .title-area .text { visibility: hidden !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .products-info-area .product-info-item .link-container { visibility: hidden !important; } .products-info-area .product-info-item:hover .title-area .text, .products-info-area .product-info-item:hover .link-container { visibility: visible !important; } .products-info-area .area-title .sub-title { font-size: 16px; } .products-info-area .product-info-item .title-area .eng-title { font-size: 12px; } .products-info-area .product-info-item:hover .title-area { color: #fff !important; } .products-info-area .product-info-item:hover .title-area .eng-title { color: rgba(255, 255, 255, 0.35) } } @media only screen and (max-width:480px) { .products-info-area .area-title .title { font-size: 20px; } } /* 浜у搧涓績-浜у搧璇︽儏 */ .product-details { background: url() no-repeat bottom right; background-size: contain; } .product-details::after { content: ""; display: table; } .product-image-area { width: 92%; max-width: 1000px; margin: 0.2rem auto; } .product-image-area .lg-img-swiper { cursor: url(/phone/images/fangda.png), auto; } .product-image-area .lg-img-swiper .swiper-slide { display: flex; justify-content: center; align-items: center; width: 100%; height: 5.5rem; min-height: 300px; } .product-image-area .swiper-slide img { max-width: 100%; height: 100%; object-fit: contain; } .product-image-area .sm-img-swiper { margin-top: 0.3rem; } .product-image-area .sm-img-swiper .swiper-slide { width: 80px; border: 1px solid transparent; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .product-image-area .sm-img-swiper .swiper-slide.swiper-slide-active { border: 1px solid #da251d; } .product-image-area .sm-img-swiper .bg-img-container { padding-top: 100%; } .product-image-area .product-small-image-swiper .swiper-slide img { width: 0.8rem; height: 0.8rem; border: 1px solid transparent; } .product-overview { width: 92%; max-width: 1200px; display: flex; justify-content: space-between; align-items: center; margin: 0.6rem auto 1rem auto; } .product-overview>div { width: 43.33% } .product-overview .text-area .title { font-size: 0.36rem; padding-bottom: 0.2rem; } .product-overview .text-area div+div { border-top: 1px solid #e0e0e0; padding-top: 0.2rem; } .product-overview .text-area .text { font-size: 14px; line-height: 1.8; } .product-overview .links-area { display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0 -11px; } .product-overview .links-area>a { margin: 11px; width: calc(100% / 2 - 22px); border: 1px solid #e0e0e0; display: inline-flex; justify-content: center; align-items: center; height: 0.5rem; min-height: 46px; } .product-overview .links-area>a img { height: 20px; margin-right: 10px; } .product-overview .links-area>a.red { background: #da251d; color: #fff; } .product-overview .links-area>a.red>img { transform: scale(0.9); -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -ms-transform: scale(0.9); -o-transform: scale(0.9); } .product-info-banner { line-height: 0; } .honor-swiper-area { padding: 0.5rem 0; } .honor-swiper-area .outer-container { width: 92%; max-width: 1200px; margin: 0 auto; position: relative; } .honor-swiper-area .honor-swiper { margin-top: 0.3rem; } .honor-swiper-area .honor-swiper .swiper-slide { min-height: 100%; display: flex; justify-content: flex-end; flex-direction: column; align-items: center; } .honor-swiper-area .honor-swiper .swiper-slide img { max-width: 80% } .honor-swiper-area .honor-swiper .swiper-slide .tray { width: 80%; max-width: 80%; margin-top: -10px; position: relative; z-index: -1; } .honor-swiper-area .swiper-button-prev, .honor-swiper-area .swiper-button-next { color: #b4b4b4; font-size: 0.6rem; top: 55%; } .honor-swiper-area .swiper-button-prev { left: -1.2rem; } .honor-swiper-area .swiper-button-next { right: -1.2rem; } .product-features-area { padding: 0.7rem 0; color: #fff; background-size: cover !important; margin-top: 1px; } .product-features-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; } .product-features-area .features-list { display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0.2rem -0.8rem; } .product-features-area .feature-item { margin: 0 0.8rem; width: calc(100% / 2 - 1.6rem); padding: 0.35rem 0; border-bottom: 1px solid rgba(41, 64, 84, 0.85); } .product-features-area .feature-item .title { font-size: 18px; padding-left: 18px; position: relative; } .product-features-area .feature-item .title::before { content: ""; display: block; width: 10px; height: 10px; position: absolute; background: #da251d; left: 0; top: 50%; transform: translate3d(0, -50%, 0); -webkit-transform: translate3d(0, -50%, 0); -moz-transform: translate3d(0, -50%, 0); -ms-transform: translate3d(0, -50%, 0); -o-transform: translate3d(0, -50%, 0); } .product-features-area .feature-item .text { margin-top: 0.1rem; font-size: 14px; opacity: 0.8; } .product-highlights-area { width: 92%; max-width: 1440px; margin: 0.8rem auto; } .product-highlights-area .product-highlight-item { display: flex; justify-content: space-between; align-items: center; } .product-highlights-area .product-highlight-item>div { width: 50%; } .product-highlights-area .product-highlight-item .bg-img-container { padding-top: 34.72%; } .product-highlights-area .product-highlight-item .text-area { padding: 0.4rem 0.8rem; line-height: 1.8; } .product-highlights-area .product-highlight-item .text-area .title { font-size: 0.3rem; } .product-highlights-area .product-highlight-item .text-area .title b { font-weight: normal; color: #da251d; } .product-highlights-area .product-highlight-item .text-area .text { margin-top: 0.3rem; } .product-highlights-area .product-highlight-item:nth-child(2n) { flex-direction: row-reverse; } .product-details-swiper-area { background: #f5f5f5; padding: 0.7rem 0; } .product-details-swiper-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; overflow: hidden; } .product-details-swiper-area .product-details-swiper { margin-top: 0.3rem; } .product-details-swiper-area .product-details-swiper .bg-img-container { padding-top: 100%; /* cursor: url(/phone/images/fangda.png), auto; */ cursor: pointer; } .product-details-swiper-area .show-more-button-container { text-align: center; margin-top: 0.3rem; } .product-details-swiper-area .show-more-button-container>a { display: inline-block; color: #da251d; padding: 10px; } .product-details-swiper-area .show-more-button-container>a .cut-line { margin: 0.1rem 0; } .image-preview-full-screen { opacity: 0; position: fixed; z-index: 102; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0, 0, 0, 0.95) } .image-preview-full-screen .swiper-slide { display: flex; justify-content: center; align-items: center; } .image-preview-full-screen .swiper-slide img { max-width: 100%; max-height: 100%; } .image-preview-full-screen .close-button { position: absolute; z-index: 103; top: 0; right: 0; color: #fff; font-size: 30px; padding: 10px; cursor: pointer; } .image-preview-full-screen .swiper-button-prev, .image-preview-full-screen .swiper-button-next { color: #fff; font-size: 0.6rem; margin: 0 0.3rem; } .product-else-details-area { margin: 0.7rem 0; } .product-else-details-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; } .product-else-details-area .outer-container .text { margin-top: 0.3rem; } .product-specification-area { margin: 0.7rem 0 1rem 0; } .product-specification-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; } .product-specification-area .title-container { display: flex; justify-content: space-between; align-items: flex-end; } .product-specification-area .title-container .remind { color: #da251d; font-size: 14px; } .product-specification-area .text { overflow: auto; margin: 0.3rem -1px; padding: 1px; } @media only screen and (min-width:1921px) { .product-overview .text-area .title { font-size: 0.28rem; } .product-highlights-area .product-highlight-item .text-area .title { font-size: 0.22rem; } } @media only screen and (max-width:1600px) { .product-overview>div { width: 45%; } } @media only screen and (max-width:1400px) { .honor-swiper-area .swiper-button-prev { left: 0; transform: translate(-100%); -webkit-transform: translate(-100%); -moz-transform: translate(-100%); -ms-transform: translate(-100%); -o-transform: translate(-100%); } .honor-swiper-area .swiper-button-next { right: 0; transform: translate(100%); -webkit-transform: translate(100%); -moz-transform: translate(100%); -ms-transform: translate(100%); -o-transform: translate(100%); } } @media only screen and (max-width:1200px) { .product-overview>div { width: 48%; } .product-highlights-area .product-highlight-item .text-area .title, .area-title.with-icon .title-inner-container { font-size: 20px; } .area-title.with-icon .title-inner-container img { height: 20px; } } @media only screen and (max-width:1024px) { .honor-swiper-area .honor-swiper { margin-top: 35px; } .honor-swiper-area .honor-swiper .swiper-slide img { max-width: 70%; } .product-overview .text-area .title { font-size: 22px; } } @media only screen and (max-width:768px) { .product-overview { flex-direction: column; } .product-overview>div { width: 100%; } .product-overview .links-area { margin: 0.5rem -11px 0; width: calc(100% + 22px) } .honor-swiper-area .honor-swiper .swiper-slide img { max-width: 60%; } .product-features-area .feature-item { width: 100%; padding: 0.5rem 0; } .product-highlights-area .product-highlight-item { flex-direction: column !important; margin: 0.5rem 0; } .product-highlights-area .product-highlight-item>div { width: 100%; } .product-highlights-area .product-highlight-item .text-area { padding: 0.4rem 0; } .product-highlights-area .product-highlight-item .bg-img-container { padding-top: 69.44%; } .product-specification-area .title-container { flex-direction: column; align-items: start; } .product-specification-area .title-container .remind { margin-top: 10px; } .honor-swiper-area .swiper-button-prev { left: 0; transform: translate(50%); -webkit-transform: translate(50%); -moz-transform: translate(50%); -ms-transform: translate(50%); -o-transform: translate(50%); } .honor-swiper-area .swiper-button-next { right: 0; transform: translate(-50%); -webkit-transform: translate(-50%); -moz-transform: translate(-50%); -ms-transform: translate(-50%); -o-transform: translate(-50%); } } @media only screen and (max-width:480px) { .honor-swiper-area .honor-swiper .swiper-slide img { max-width: 50%; } } /* 璇︽儏椤 */ .details-page { margin: 0.5rem auto; } .details-page .breadcrumb .container { max-width: 1200px; } .details-page .details-page-area { width: 92%; max-width: 1200px; margin: 0 auto; } .details-page .details-page-area .title-area { border-top: 2px solid #da251d; border-bottom: 1px solid #333; background: #f5f5f5; font-size: 0.3rem; padding: 0.4rem 0.3rem; } .details-page .details-page-area .date-and-share-area { padding: 0.2rem 0.3rem; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #e0e0e0; } .details-page .details-page-area .date-and-share-area .date-area { display: flex; justify-content: space-between; align-items: center; font-size: 14px; } .details-page .details-page-area .date-and-share-area .date-area .unit { color: rgba(0, 0, 0, 0.6) } .details-page .details-page-area .date-and-share-area .date-area>div { margin-right: 10px; } .details-page .details-page-area .date-and-share-area .date-area .line, .details-page .details-page-area .date-and-share-area .date-area .text { color: #adbab3; } .details-page .details-page-area .date-and-share-area .share-area ul { display: flex; justify-content: space-between; align-items: center; } .details-page .details-page-area .video-area { padding: 0.46rem 0.3rem; margin: 0 auto; } .details-page .details-page-area .video-container { position: relative; } .details-page .details-page-area video { width: 100%; object-fit: cover; height: 60%; /* margin: 0.4rem auto; */ background: #000; } .details-page .details-page-area .video-container.pause::after { content: ""; display: block; width: 1.2rem; height: 1.2rem; background: url(/phone/images/videoPlayIocn.png) no-repeat center center; background-size: contain; position: absolute; left: 50%; top: 50%; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); } .details-page .details-page-area>.text-container { padding: 0.5rem 0.3rem; } .details-page .page-box { width: 92%; max-width: 1200px; margin: 0 auto; border-top: 2px solid #333; border-bottom: 2px solid #333; } .details-page .page-box>a { display: flex; justify-content: flex-start; align-items: center; padding: 0.2rem 0.3rem; font-size: 16px; background: #fcfcfc; color: #484848; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .details-page .page-box>a:hover { color: #da251d; } .details-page .page-box .title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .details-page .page-box>a .short-line { color: #c4c4c4; } .details-page .page-box>a+a { border-top: 1px solid #e0e0e0; } .details-page .page-box>a>div { margin-right: 0.25rem; } .details-page .back-button-container { margin: 0.5rem auto; text-align: center; } .details-page .back-button-container .back-button { display: inline-block; padding: 0.15rem 0.5rem; border: 1px solid #da251d; color: #da251d; } .details-page .back-button-container .back-button:hover { background: #da251d; color: #fff; } @media only screen and (min-width:1921px) { .details-page .details-page-area .title-area { font-size: 0.24rem; } } @media only screen and (max-width:1200px) { .details-page .details-page-area .title-area { font-size: 20px; } } @media only screen and (max-width:1024px) { .details-page .details-page-area .date-and-share-area { padding-top: 12px; padding-bottom: 12px; } .details-page .page-box>a { padding-top: 10px; padding-bottom: 10px; } } @media only screen and (max-width:480px) { .details-page .details-page-area .date-and-share-area { flex-direction: column; align-items: start; } .bdsharebuttonbox li:first-child a { margin-left: 0 !important; } .details-page-area .share-area { margin-top: 10px; } .details-page .page-box .title { font-size: 14px; margin-right: 0; } } /* 瑙嗛涓績 */ .videos-list-area { width: 92%; max-width: 1440px; margin: 0.7rem auto 1rem; } .videos-list-area .area-title { margin-top: 0.1rem; } .videos-list { margin: 0.4rem -0.3rem 0; display: flex; justify-content: flex-start; flex-wrap: wrap; } .video-item { margin: 0 0.3rem 1rem 0.3rem; width: calc(100% / 3 - 0.6rem); border-top: 1px solid #272727; } .video-item .sub-title { font-size: 14px; display: inline-block; background: #272727; padding: 8px 12px; color: #fff; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .video-item .title { margin-top: 0.3rem; font-size: 0.24rem; color: #272727; transition: all 0.5s ease; } .video-item .date { font-size: 14px; color: #adbab3; margin-top: 0.08rem; } .video-item .show-more-button { font-size: 14px; color: #da251d; display: flex; justify-content: flex-start; align-items: center; margin-top: 0.2rem; } .video-item .show-more-button .iconfont { font-size: 14px; margin-left: 5px; } .video-item .bg-img-container { margin-top: 0.2rem; padding-top: 60.23%; } .video-item .bg-img-container .blur { background: #da251d; font-size: 0.8rem; color: #fff; display: flex; justify-content: center; align-items: center; } .video-item .bg-img-container::after { content: ""; display: block; width: 0.6rem; height: 0.6rem; min-width: 46px; min-height: 46px; background: url(/phone/images/videoPlayIocn.png) no-repeat center center; background-size: contain; position: absolute; left: 50%; top: 50%; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); opacity: 1; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .video-item a:hover .bg-img-container::after { opacity: 0; } .video-item:hover { border-top-color: #da251d; } .video-item:hover .title { text-decoration: underline; } .video-item a:hover .sub-title { background: #da251d; } .video-item a:hover .title { color: #da251d; } @media only screen and (max-width:1600px) { .video-item .title { font-size: 18px; } } @media only screen and (max-width:1024px) { .video-item { width: calc(100% / 2 - 0.6rem) } } @media only screen and (max-width:768px) { .video-item { width: calc(100% / 1 - 0.6rem) } } /* 瑙嗛涓績鏍峰紡 */ .videos-center { margin-top: 0.5rem; background: url() no-repeat center center; background-size: cover; position: relative; overflow: hidden; } .videos-center .bg-title { line-height: 1; position: absolute; right: -1rem; bottom: -0.5rem; font-size: 3rem; font-weight: 600; color: rgba(2, 2, 2, 0.1); z-index: 1; } .videos-center .outer-container { position: relative; z-index: 2; margin: 0 auto; padding: 1rem 0; width: 92%; max-width: 1440px; display: flex; justify-content: space-between; align-items: flex-start; } .videos-center .lg-img-swiper { width: 75%; background: #fff; } .videos-center .lg-img-swiper .bg-img-container { padding-top: 58.89%; } .videos-center .lg-img-swiper .title-area { position: absolute; bottom: 1.66rem; left: 0; width: 100%; padding: 0 1rem 0 0.5rem; color: #fff; } .videos-center .lg-img-swiper .title-area .title { font-size: 0.36rem; } .videos-center .lg-img-swiper .title-area .sub-title { margin-top: 0.1rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; } .videos-center .lg-img-swiper .show-more-button { position: absolute; left: 0.5rem; bottom: 0.5rem; z-index: 2; display: flex; justify-content: space-between; align-items: center; color: #fff; padding: 0.18rem 0.22rem; border: 2px solid #fff; cursor: pointer; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .videos-center { position: relative; } .videos-center .lg-img-swiper .show-more-button .iconfont { font-size: 14px; margin-right: 8px; } .videos-center .lg-img-swiper .show-more-button:hover { background: #fff; color: #333 } .videos-center .right-area { width: 30%; margin-left: -5%; position: relative; } .videos-center .right-area::after { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #fff; } .videos-center .sm-title-swiper { height: 100%; width: 100%; } .videos-center .sm-title-swiper .swiper-slide { display: flex; justify-content: flex-end; align-items: flex-start; width: 100%; } .videos-center .sm-title-swiper .swiper-slide .iconfont { width: 16.66%; height: calc(100% - 1px); display: flex; justify-content: center; align-items: center; background: #da251d; font-size: 24px; color: #fff; font-weight: bold; border-right: 1px solid rgba(255, 255, 255, 0.2); display: none; } .videos-center .sm-title-swiper .swiper-slide.swiper-slide-active .iconfont { display: flex; } .videos-center .sm-title-swiper .swiper-slide .title { height: 100%; width: calc(83.34% - 1px); display: flex; justify-content: center; align-items: center; background: #fff; cursor: pointer; border-bottom: 1px solid #f2f2f2; } .videos-center .sm-title-swiper .swiper-slide.swiper-slide-active .title { background: #da251d; color: #fff; } .videos-center .sm-title-button-container { position: absolute; width: 83.34%; height: calc(100% / 8); right: 0; bottom: calc(-100% / 8); display: flex; justify-content: space-between; align-items: center; } .videos-center .sm-title-prev, .videos-center .sm-title-next { position: relative; width: 50%; margin: 0; height: 100%; background: #767676; color: #fff; top: 0; left: 0; bottom: 0; right: 0; transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); opacity: 1; font-size: 20px; } .videos-center .swiper-button-next.swiper-button-disabled, .videos-center .swiper-button-prev.swiper-button-disabled { opacity: 0.8; } .videos-center .sm-title-next { border-left: 1px solid rgba(255, 255, 255, 0.2); } @media only screen and (max-width:1024px) { .videos-center .lg-img-swiper .title-area { padding: 0 0.5rem; } .videos-center .lg-img-swiper .title-area .title { font-size: 22px; } .videos-center .outer-container { flex-direction: column; } .videos-center .sm-title-button-container, .videos-center .sm-title-swiper .swiper-slide .title, .videos-center .outer-container>div { width: 100%; } .videos-center .sm-title-swiper .swiper-slide, .videos-center .sm-title-button-container { height: 0.9rem !important; position: relative; } .videos-center .sm-title-swiper { z-index: -1; position: absolute; transform: translate(-1000%, 0); -webkit-transform: translate(-1000%, 0); -moz-transform: translate(-1000%, 0); -ms-transform: translate(-1000%, 0); -o-transform: translate(-1000%, 0); } .videos-center .lg-img-swiper .title-area { top: 0.5rem; } .videos-center .right-area::after { display: none; } .videos-center .right-area { margin: 0; height: auto !important; } .videos-center .sm-title-swiper .swiper-slide.swiper-slide-active .iconfont { display: none; } .videos-center .lg-img-swiper .title-area .sub-title { opacity: 0; } .videos-center .lg-img-swiper a:hover .title-area .sub-title { opacity: 1; } } @media only screen and (max-width:768px) { .videos-center .lg-img-swiper .title-area .title { font-size: 20px; } .videos-center .lg-img-swiper a:hover .title-area .sub-title { opacity: 0 !important; } } @media only screen and (max-width:480px) { .videos-center .lg-img-swiper .title-area .title { font-size: 18px; } } /* 瀹㈡湇鏈嶅姟锛 */ .server-list-area { position: relative; } .server-list-area>.bg-img { z-index: -1; top: 2.3rem; } .server-list-area .server-list-container { width: 92%; max-width: 1440px; margin: 0 auto; } .server-list-area .server-list { display: flex; justify-content: flex-start; flex-wrap: wrap; padding-top: 0.7rem; } .server-list-area .server-item { width: calc(100% / 2 - 1.34rem); margin: 0 0.67rem 1.36rem 0.67rem; } .server-list-area .server-item .bg-img-container { padding-top: 64.96%; } .server-list-area .server-item .bg-img-container .blur { background: #da251d; font-size: 0.8rem; display: flex; justify-content: center; align-items: center; color: #fff; } .server-list-area .server-item .chs-title { font-size: 0.36rem; margin-top: 0.3rem; line-height: 1.2; } .server-list-area .server-item .eng-title { font-size: 0.24rem; color: rgba(173, 186, 179, 0.35); font-weight: bold; margin-top: 5px; } .server-list-area .server-item .link-container { margin-top: 0.26rem; margin-bottom: 0; } @media only screen and (max-width:1400px) { .server-list-area .server-item .eng-title { font-size: 18px; } .server-list-area .server-item { width: calc(100% / 2 - 1rem); margin: 0 0.5rem 1.36rem 0.5rem; } } @media only screen and (max-width:1024px) { .server-list-area .server-item .chs-title { font-size: 22px; } .server-list-area .server-item { width: calc(100% / 2 - 0.8rem); margin: 0 0.4rem 1.36rem 0.4rem; } } @media only screen and (max-width:768px) { .server-list-area .server-item { width: 100%; margin: 0 0 1.36rem 0; } } /* 瀹㈡湇鏈嶅姟-鍞悗鏈嶅姟 */ .after-sale-area { position: relative; } .after-sale-details-area .outer-container { width: 92%; margin: 0.4rem auto 0; } .after-sale-details-area .outer-container>img { width: 100% } .after-sale-server-list { margin: 0.8rem auto 0; /* width: 92%; */ max-width: 1200px; display: flex; justify-content: space-between; position: relative; } .after-sale-server-item { margin: 0.13rem; width: 100%; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .after-sale-server-item .bg-img-container { padding-top: 100%; background: url() no-repeat center center; background-size: contain; transition: opacity 0.5s ease; -webkit-transition: opacity 0.5s ease; -moz-transition: opacity 0.5s ease; -ms-transition: opacity 0.5s ease; -o-transition: opacity 0.5s ease; overflow: visible; } .after-sale-server-item:hover .bg-img-container { opacity: 0.5; } .after-sale-server-item:hover .text-area::after { border-color: rgba(218, 37, 29, 0.5); } .after-sale-server-item .bg-img-container .inner-container { width: 80%; height: 80%; display: flex; justify-content: center; align-items: center; flex-direction: column; } .after-sale-server-item .bg-img-container .inner-container img { width: 0.76rem; height: 0.68rem; object-fit: contain; } .after-sale-server-item .bg-img-container .inner-container .title { font-size: 0.24rem; color: #fff; margin-top: 0.14rem; } .after-sale-server-item .bg-img-container::after { content: ""; display: block; width: 1px; height: 0.61rem; position: absolute; left: 50%; bottom: 0; transform: translate3d(-50%, 100%, 0); -webkit-transform: translate3d(-50%, 100%, 0); -moz-transform: translate3d(-50%, 100%, 0); -ms-transform: translate3d(-50%, 100%, 0); -o-transform: translate3d(-50%, 100%, 0); background: #da251d; } .after-sale-server-item .text-area { margin-top: 0.6rem; border: 2px solid #da251d; padding: 0.3rem 0.4rem; line-height: 2; background: #fff; border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -o-border-radius: 0.5rem; position: relative; transition: border 0.5s ease; -webkit-transition: border 0.5s ease; -moz-transition: border 0.5s ease; -ms-transition: border 0.5s ease; -o-transition: border 0.5s ease; } .after-sale-server-item .text-area::after { content: ""; display: block; width: 10px; height: 10px; border: 2px solid #da251d; background: #fff; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; position: absolute; top: -1px; left: 50%; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); transition: border 0.5s ease; -webkit-transition: border 0.5s ease; -moz-transition: border 0.5s ease; -ms-transition: border 0.5s ease; -o-transition: border 0.5s ease; } .server-hotline-container { text-align: center; } .server-hotline-container .server-hotline { font-size: 24px; color: #fff; margin-top: 0.8rem; padding: 0.3rem; background: #9caea4; display: inline-flex; justify-content: center; align-items: center; padding: 0 26px; min-height: 0.8rem; border-radius: 1rem; -webkit-border-radius: 1rem; -moz-border-radius: 1rem; -ms-border-radius: 1rem; -o-border-radius: 1rem; position: relative; margin-bottom: 1.2rem; } .after-sale-server-list::after { content: ""; display: block; position: absolute; width: calc((100% / 4 * 3)); height: calc(1.33rem + 1px); border: 1px solid #ccc; border-top: 0; left: 50%; bottom: calc(0.13rem + 20px); z-index: -1; transform: translate3d(-50%, 100%, 0); -webkit-transform: translate3d(-50%, 100%, 0); -moz-transform: translate3d(-50%, 100%, 0); -ms-transform: translate3d(-50%, 100%, 0); -o-transform: translate3d(-50%, 100%, 0); } .after-sale-server-item:hover .text-area { border-color: rgba(218, 37, 29, 0.5); } .after-sale-server-item:hover { margin-top: -10px; } @media only screen and (min-width:1920px) { .after-sale-server-item .bg-img-container .inner-container .title { font-size: 0.2rem; margin-top: 0.05rem; } .after-sale-server-item .text-area { padding: 0.2rem 0.3rem; border-radius: 0.3rem; -webkit-border-radius: 0.3rem; -moz-border-radius: 0.3rem; -ms-border-radius: 0.3rem; -o-border-radius: 0.3rem; } } @media only screen and (max-width:1600px) { .server-hotline-container .server-hotline, .after-sale-server-item .bg-img-container .inner-container .title { font-size: 22px; } } @media only screen and (max-width:1400px) { .server-hotline-container .server-hotline, .after-sale-server-item .bg-img-container .inner-container .title { font-size: 20px; } } @media only screen and (max-width:1024px) { .after-sale-server-list { flex-direction: column; width: 100%; } .after-sale-server-item { display: flex; align-items: center; justify-content: space-between; } .after-sale-server-item .bg-img-container { width: 30%; max-width: 30%; padding-top: 30%; } .after-sale-server-item .text-area { width: 65%; max-width: 65%; margin-top: 0; } .after-sale-server-item .text-area::after { left: 0; top: 50%; } .after-sale-server-item .bg-img-container::after { width: 80%; height: 1px; top: 50%; left: 100%; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); } .after-sale-server-item .bg-img-container .inner-container .title { font-size: 18px; } .after-sale-server-item { margin: 0.13rem 0; } .after-sale-server-list::after { display: none; } .server-hotline-container .server-hotline { font-size: 18px; padding: 0.4rem; min-height: 50px; border-radius: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; -o-border-radius: 25px; } .after-sale-server-item:hover { margin: 0.13rem 0; } } @media only screen and (max-width:480px) { .after-sale-server-item .bg-img-container .inner-container .title { display: none; } } /* 瀹㈡埛鏈嶅姟-璧勬枡涓嬭浇 */ .data-download-area { position: relative; } .data-download-details-area { width: 92%; margin: 0.4rem auto 0; padding-bottom: 0.8rem; } .data-download-details-area .outer-container>img { width: 100%; object-fit: cover; } .data-download-list-area { width: 100%; max-width: 1200px; margin: -0.5rem auto 0; position: relative; z-index: 2; } .data-download-list-area .filter-area-container { padding: 0.35rem; background: #fff; } .data-download-list-details-area .data-list { display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0 -0.33rem 0.4rem; } .data-download-list-details-area .data-item { margin: 0.33rem; width: calc(100% / 4 - 0.66rem); } .data-download-list-details-area .data-item a { transition: color 0s; -webkit-transition: color 0s; -moz-transition: color 0s; -ms-transition: color 0s; -o-transition: color 0s; } .data-download-list-details-area .data-item .bg-img-container { padding-top: 136%; border: 2px solid transparent; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; box-shadow: inset 0 0 1px rgba(100, 100, 100, 0.3); } .data-download-list-details-area .data-item .bg-img-container .bg-img { box-shadow: inset 0 0 1px 1px #ddd; } .data-download-list-details-area .data-item .title { text-align: center; font-size: 18px; font-weight: bold; margin-top: 0.14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .data-download-list-details-area .download-button-container { text-align: center; margin: 0.34rem auto 0; } .data-download-list-details-area .download-button-container .inner-container { display: inline-block; } .data-download-list-details-area .download-button { display: flex; justify-content: space-between; align-items: center; border: 1px solid #ddd; padding: 6px 30px; font-size: 14px; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; background: #fff; } .data-download-list-details-area .download-button .iconfont { font-size: 14px; margin-left: 5px; } .data-download-list-details-area .data-item a:hover .bg-img-container { border-color: #da251d; } .data-download-list-details-area .data-item a:hover .download-button { background: #da251d; color: #fff; } .data-download-list-details-area .data-item a:hover .bg-img-container .bg-img { box-shadow: inset 0 0 1px 1px transparent; } @media only screen and (max-width:1400px) { .data-download-list-area { margin-top: 0; } } @media only screen and (max-width:768px) { .data-download-list-details-area .data-item { width: calc(100% / 3 - 0.66rem) } .filter-area .selector-area { width: 45%; font-size: 14px; } .filter-area .search-area { width: 55%; } } @media only screen and (max-width:480px) { .data-download-list-details-area .data-item { width: calc(100% / 2 - 0.66rem) } .data-download-list-details-area .data-item .title { font-size: 16px; } .filter-area .selector-list-area { flex-direction: column; align-items: flex-start; } .data-download-list-area .filter-area-container { padding: 0.35rem 0; } .filter-area .selector-list-area>div { width: 100%; } .filter-area .selector-list-area>div+div { margin-top: -1px; } .filter-area .search-area { transform: translate(1px); -webkit-transform: translate(1px); -moz-transform: translate(1px); -ms-transform: translate(1px); -o-transform: translate(1px); } } /* 瀹㈡埛鏈嶅姟-鎷涘晢鍔犵洘 */ .investment-area { position: relative; } .investment-details-area .outer-container { width: 92%; margin: 0.4rem auto 0; } .investment-details-area .outer-container>img { width: 100%; object-fit: cover; } .investment-details-area .investment-form-area { width: 100%; max-width: 1200px; margin: -0.5rem auto 0; position: relative; z-index: 2; padding-bottom: 1rem; } .investment-details-area .investment-form-area .remind-area { background: #fff; padding: 0.25rem 0.35rem; color: #da251d; font-size: 14px; } .investment-details-area .investment-form-area .inner-container { padding: 0 0.35rem; } .investment-details-area .investment-form>div { display: flex; justify-content: flex-start; padding: 0.2rem 0.28rem; border-bottom: 1px solid #e0e0e0; align-items: center; } .investment-details-area .investment-form .title { min-width: 8em; width: 14%; text-align: left; padding: 0; } .investment-details-area .investment-form .title .point { color: #da251d; vertical-align: top; margin-left: 3px; } .investment-details-area .investment-form input, .investment-details-area .investment-form textarea { border: none; background: #f5f5f5; padding: 12px; } .investment-details-area .investment-form input { width: 30%; height: 45px; } .investment-details-area .investment-form .layui-input-block { width: 86%; margin-left: 0 !important; font-size: 14px !important; } .investment-details-area .investment-form .layui-input-block .layui-inline { width: calc((100% - 30px) / 3); display: inline-block !important; margin-bottom: 0 !important; } .investment-details-area .investment-form .layui-input-block .layui-inline:last-child { margin-right: 0; } .investment-details-area .investment-form .layui-select-title input { width: 100% !important; min-height: 45px; } .investment-details-area .investment-form .md { width: 40% } .investment-details-area .investment-form .lg { width: 86%; } .investment-details-area .investment-form .city-selector { position: relative; z-index: 2; } .investment-details-area .city-selector-area { width: 40%; display: flex; justify-content: center; align-items: center; position: relative; z-index: 2; } .investment-details-area .city-selector-area .selector-area { width: calc(100% - 0.6rem / 3); background: #f5f5f5; line-height: 39px; color: #7c7c7c; } .investment-details-area .city-selector-area .selector-area .selected-item, .investment-details-area .city-selector-area .selector-area li { padding: 0 12px; } .investment-details-area .city-selector-area .selector-area .iconfont { font-size: 12px; } .investment-details-area .city-selector-area .selector-area+.selector-area { margin-left: 0.3rem; } .investment-details-area .button-container { border-bottom: none !important; display: flex; justify-content: center !important; margin-top: 0.45rem; } .submit-button { cursor: pointer; border: 1px solid #da251d; background: #fff; color: #da251d; display: flex; justify-content: space-between; align-items: center; font-size: 18px; padding: 16px 20px; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .submit-button .iconfont { font-size: 18px; margin-left: 20px; } .submit-button:hover { background: #da251d; color: #fff; } @media only screen and (max-width:1024px) { .submit-button { padding: 10px 12px; font-size: 16px; } } @media only screen and (max-width:768px) { .investment-details-area .investment-form input { width: 86% !important; } .submit-button { margin: 0 auto; } } @media only screen and (max-width:480px) { .investment-details-area .investment-form>div { flex-direction: column; align-items: start; padding: 0.2rem 0; } .investment-details-area .investment-form .layui-input-block, .investment-details-area .investment-form textarea, .investment-details-area .investment-form input { width: 100% !important; } .investment-details-area .investment-form .title { margin-bottom: 10px; } } @media only screen and (max-width:450px) { .investment-details-area .investment-form .layui-input-block .layui-inline { width: calc((100% - 9px) / 3); } } /* 鏂伴椈涓績 */ .news-center-area { width: 92%; max-width: 1440px; margin: 0.7rem auto 0; padding-bottom: 0.8rem; } .news-center-swiper-area { margin: 0.4rem auto 0.8rem; position: relative; } .news-center-swiper-area .lg-img-swiper .bg-img-container { padding-top: 59.88%; } .news-center-swiper-area .lg-img-swiper::after, .news-center-swiper-area .lg-img-swiper::before { content: ""; display: block; width: 20.59%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; background-image: linear-gradient(to left, rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 1)); } .news-center-swiper-area .lg-img-swiper::before { left: auto; right: 0; background-image: linear-gradient(to right, rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 1)); } .news-center-swiper-area .sm-title-swiper { width: 35%; position: absolute; left: calc(21% + 0.4rem); bottom: -0.4rem; background: rgba(0, 0, 0, 0.8); padding: 0.3rem 0.36rem 0.8rem; color: #fff; } .news-center-swiper-area .sm-title-swiper .title { font-size: 24px; color: #fff; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .news-center-swiper-area .sm-title-swiper .sub-title { font-size: 14px; opacity: 0.6; color: #fff; margin-top: 0.2rem; line-height: 1.8; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; } .news-center-swiper-area .sm-title-swiper .date { font-size: 14px; color: #adbab3; margin-top: 0.2rem; } .news-center-swiper-area .sm-title-swiper .swiper-slide { opacity: 0 !important; transition: opacity 0.3s ease; -webkit-transition: opacity 0.3s ease; -moz-transition: opacity 0.3s ease; -ms-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; } .news-center-swiper-area .sm-title-swiper .swiper-slide.swiper-slide-active { opacity: 1 !important; } .news-center-swiper-area .sm-title-button-container { position: absolute; bottom: 0; right: 0; background: #da251d; width: 100px; height: 50px; display: flex; justify-content: space-between; align-items: center; } .news-center-swiper-area .sm-title-button-container::after { content: ""; display: block; position: absolute; left: 50%; top: 50%; background: rgba(255, 255, 255, 0.7); width: 1px; height: 20px; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); } .news-center-swiper-area .sm-title-button-container .iconfont { color: #fff; font-size: 20px; } .news-center-swiper-area .sm-title-button-container .swiper-button-prev, .news-center-swiper-area .sm-title-button-container .swiper-button-next { position: relative; margin: 0; left: 0; right: 0; top: 0; bottom: 0; width: 50%; height: 100%; } @media only screen and (max-width:1600px) { .news-center-swiper-area .sm-title-swiper .title { font-size: 22px; } } @media only screen and (max-width:1400px) { .news-center-swiper-area .sm-title-swiper .title { font-size: 20px; } } @media only screen and (max-width:1024px) { .news-center-swiper-area .sm-title-swiper { position: relative; left: 0; top: 0; width: 100%; margin-top: 5px; } } .news-list { margin: 0 -0.38rem 0.3rem; display: flex; justify-content: flex-start; flex-wrap: wrap; } .news-item { margin: 0.38rem; width: calc(100% / 3 - 0.76rem); transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; border: 1px solid #e0e0e0; } .news-item a { transition: none; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; } .news-item .bg-img-container { padding-top: 60.23%; } .bg-img-container>img.bg-img { position: absolute; left: 0; top: 0; } .bg-img-container>.bg-img>img { position: absolute; left: 0 !important; top: 0 !important; width: 100%; height: 100%; object-fit: cover; } .news-item .title-area { background: #fff; padding: 0.3rem 0.3rem 0.18rem; border-top: 1px solid #e0e0e0; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .news-item .title-area .title { font-size: 0.24rem; line-height: 1.2; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; height: calc(24px * 1.2 * 2); } .news-item .title-area .text { font-size: 14px; opacity: 0.7; margin-top: 0.2rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; line-height: 1.6; height: calc(14px * 3 * 1.6); } .news-item .title-area .date-links-area { display: flex; justify-content: space-between; align-items: center; margin-top: 0.2rem; } .news-item .title-area .date-links-area .date { font-size: 14px; font-weight: bold; color: rgba(173, 186, 179, 0.65); } .news-item .title-area .date-links-area .iconfont { position: relative; left: 0.14rem; padding: 10px 12px; background: #da251d; color: #fff; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .news-item:hover { box-shadow: 0 0 0.3rem 0 rgba(100, 100, 100, 0.4); } .news-item:hover .title-area { background: #da251d; color: #fff; border-color: #da251d; } .news-item:hover .title-area .iconfont { background: #fff; color: #da251d; } .news-item:hover .title-area .date-links-area .date { color: #fff; } @media only screen and (min-width:1921px) { .news-item .title-area { padding: 0.2rem 0.2rem 0.1rem } .news-item .title-area .title { font-size: 24px; } .news-item { margin: 0.2rem; width: calc(100% / 3 - 0.4rem); } } @media only screen and (max-width:1600px) { .news-item .title-area .title { font-size: 22px; } } @media only screen and (max-width:1400px) { .news-item .title-area .title { font-size: 20px; } } @media only screen and (max-width:1024px) { .news-item { width: calc(100% / 2 - 0.76rem) } } @media only screen and (max-width:768px) { .news-item { width: calc(100% - 0.76rem) } } /* 鏂伴椈-鎶€鏈垎浜 */ .technique-share-list { margin: 0 0 0.6rem; } .technique-share-item { padding: 0.64rem 0; border-bottom: 1px solid #e0e0e0; } .technique-share-item:first-child { padding-top: 0.4rem; } .technique-share-item a { display: flex; justify-content: space-between; } .technique-share-item a:hover { color: #da251d; } .technique-share-item .bg-img-container { width: 30%; padding-top: 18%; } .technique-share-item .right-area { width: 65.55%; display: flex; justify-content: space-between; flex-direction: column; } .technique-share-item .title { font-size: 0.24rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } .technique-share-item .date { font-size: 14px; margin-top: 0.1rem; color: #adbab3; } .technique-share-item .sub-title { font-size: 14px; opacity: 0.75; margin-top: 0.3rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; } .technique-share-item .iconfont { display: inline-block; padding: 10px 12px; background: #da251d; color: #fff; } @media only screen and (max-width:1600px) { .technique-share-item .title { font-size: 22px; } } @media only screen and (max-width:1400px) { .technique-share-item .title { font-size: 20px; } } @media only screen and (max-width:1200px) { .technique-share-item .sub-title { -webkit-line-clamp: 2; } .technique-share-item .iconfont, .technique-share-item .sub-title { margin-top: 0.2rem; } } @media only screen and (max-width:1024px) { .technique-share-item .title { -webkit-line-clamp: 2; } .technique-share-item a { flex-direction: column; } .technique-share-item .bg-img-container { width: 100%; padding-top: 60%; } .technique-share-item .right-area { width: 100%; margin-top: 0.3rem; } .technique-share-item .sub-title { -webkit-line-clamp: 3; } } /* 鍏充簬鐜悆 */ .about-brief-area { position: relative; } .about-brief-img-area { margin-top: 0.8rem; } .about-brief-img-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; padding-top: 0.1rem; position: relative; overflow: hidden; line-height: 0; } .about-brief-img-area .outer-container>img { width: 100%; } .about-brief-img-area .outer-container .video-container { cursor: pointer; position: absolute; z-index: 2; top: 0; left: 1.2rem; width: 45%; box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2); min-width: 400px; } .about-brief-img-area .outer-container .video-container video { width: 100%; object-fit: cover; } .about-brief-img-area .outer-container .video-container.pause::after { content: ""; display: block; width: 1.38rem; height: 1.38rem; background: url(/phone/images/playicon2.png) no-repeat center center; position: absolute; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); z-index: 2; background-size: contain; } .about-brief-text-area { position: relative; margin-top: 0.77rem; padding-bottom: 2.26rem; } .about-brief-text-area .bg-img.earth { height: 5.5rem; z-index: -1; bottom: 0; top: auto; } .about-brief-text-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; } .about-brief-text-area .area-title { text-align: center; } .about-brief-text-area .area-title .container { display: inline-block; padding: 0 1.8rem; border-left: 5px solid #da251d; border-right: 5px solid #da251d; } .about-brief-text-area .area-title .title { font-size: 0.36rem; } .about-brief-text-area .area-title .sub-title { font-size: 24px; color: rgba(173, 186, 179, 0.35); font-weight: bold; margin-top: 0.05rem; } .about-brief-text-area .text-container { line-height: 1.6; padding: 0.6rem 1.2rem; margin-top: 0.76rem; border-top: 1px solid rgba(235, 235, 235, 0.8); border-bottom: 1px solid rgba(235, 235, 235, 0.8); } .development-bref-area { background: url() repeat; padding: 1.1rem 0; } .development-bref-area .background-title { font-size: 3rem; font-weight: bold; line-height: 1; position: absolute; z-index: 1; color: rgba(2, 2, 2, 0.08); bottom: -0.5rem; right: -0.8rem; } .development-bref-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; position: relative; z-index: 2; } .development-bref-area .swiper-area { margin-top: 0.3rem; } .development-bref-area .development-tab-swiper { background: #fff; } .development-bref-area .development-tab-swiper .swiper-slide { width: auto; } .development-bref-area .development-tab-swiper .swiper-slide a { display: inline-block; padding: 0 0.5rem; } .development-bref-area .development-tab-swiper .swiper-slide a>div { font-size: 18px; color: #999; padding: 10px 0; border-bottom: 3px solid transparent; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .development-bref-area .development-tab-swiper .swiper-slide-active a>div { color: #da251d; border-color: #da251d; } .development-bref-area .details-swiper-area { display: flex; justify-content: space-between; margin-top: 0.74rem; } .development-bref-area .development-side-swiper { width: 35%; height: 35%; padding: 0 1rem 1rem 0; } .development-bref-area .development-side-swiper .development-side-button { position: absolute; right: -1px; bottom: 0; width: 120px; height: 60px; z-index: 2; display: flex; justify-content: space-between; align-items: center; } .development-bref-area .development-side-swiper .development-side-button>div { position: relative; top: 0; left: 0; right: 0; bottom: 0; transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); margin: 0; height: 100%; width: 50%; font-size: 20px; color: #3d3d3d; background: #fff; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .development-bref-area .development-side-swiper .development-side-button .swiper-button-disabled { color: #fff; background: rgba(0, 0, 0, 0.75) } .development-bref-area .development-side-swiper .swiper-wrapper:after { content: ""; display: block; width: 100%; height: 0; padding-top: 100%; position: absolute; top: 0.3rem; left: 0.3rem; background: rgba(100, 100, 100, 0.2); filter: blur(15px); -webkit-filter: blur(15px); z-index: -1; } .development-bref-area .development-side-swiper .bg-img-container { padding-top: 100%; /* background: #da251d; */ -webkit-clip-path: polygon(0 0, 85% 0, 100% 16%, 100% 100%, 0 100%); clip-path: polygon(0 0, 85% 0, 100% 16%, 100% 100%, 0 100%); } .development-bref-area .development-side-swiper .bg-img { /* mix-blend-mode: multiply; */ } .development-bref-area .development-side-swiper .area-title { position: absolute; left: 50%; top: 0; max-width: 90%; margin-top: 0.6rem; font-weight: bold; transform: translate3d(-50%, 0, 0); z-index: 2; color: #fff; -webkit-transform: translate3d(-50%, 0, 0); -moz-transform: translate3d(-50%, 0, 0); -ms-transform: translate3d(-50%, 0, 0); -o-transform: translate3d(-50%, 0, 0); } .development-bref-area .development-side-swiper .area-title .text { font-size: 0.48rem; margin-left: 0; display: none; } .development-bref-area .area-title .dotted-line { display: none; } .development-bref-area .area-title .dotted-line { width: 48px; margin-left: 0; } .development-bref-area .development-list-swiper { width: calc(65% - 1.7rem); margin: 0 1rem 0 0.7rem; } .development-bref-area .development-list-swiper .development-item { display: flex; justify-content: flex-start; margin-bottom: 0.5rem; } .development-bref-area .development-list-swiper .development-item .title { font-size: 0.32rem; color: #6f6f6f; width: 1rem; min-width: 75px; line-height: 0.4rem; } .development-bref-area .development-list-swiper .development-item .line { margin-top: calc(0.2rem + 1px); width: 0.9rem; min-width: 0.9rem; height: 1px; background: #d2d2d2; position: relative; } .development-bref-area .development-list-swiper .development-item .line::before, .development-bref-area .development-list-swiper .development-item .line::after { content: ""; display: block; position: absolute; z-index: 2; top: 50%; left: 0; width: 10px; height: 10px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; background: #6f6f6f; transform: translate3d(0, -50%, 0); -webkit-transform: translate3d(0, -50%, 0); -moz-transform: translate3d(0, -50%, 0); -ms-transform: translate3d(0, -50%, 0); -o-transform: translate3d(0, -50%, 0); } .development-bref-area .development-list-swiper .development-item .line::before { right: 0; left: auto; background: #fff; box-shadow: inset 0 0 0 2px #6f6f6f; } .development-bref-area .development-list-swiper .development-item .sub-title { padding-top: calc(0.2rem - 16px * 1.8 / 2 + 0.5px); line-height: 1.8; margin-left: 0.2rem; } .development-bref-area .development-item .title { position: relative; } .development-bref-area .development-item .title::after { content: ""; display: block; width: 1px; height: calc(100% + 0.5rem); position: absolute; background: #d2d2d2; top: calc(0.2rem + 1px); right: -5px; z-index: 1; } .development-bref-area .development-item:last-child .title::after { display: none; } .development-bref-area .development-list-swiper .development-item:first-child .title { color: #da251d } .development-bref-area .development-list-swiper .development-item:first-child .line::after { background: #da251d; } .development-bref-area .development-list-swiper .development-item:first-child .line::before { box-shadow: inset 0 0 0 2px #da251d; } @media only screen and (min-width:1921px) { .development-bref-area .development-side-swiper .area-title .text { font-size: 0.3rem; } .development-bref-area .development-list-swiper .development-item .title { min-width: 150px; } } @media only screen and (max-width:1200px) { .about-brief-text-area .area-title .sub-title { font-size: 20px; } .about-brief-text-area .area-title .title { font-size: 24px; } .about-brief-text-area .area-title .container { padding: 0 1rem; } .about-brief-text-area .text-container { padding: 0.6rem; } } @media only screen and (max-width:1024px) { .development-bref-area .development-list-swiper .development-item .title { font-size: 20px; } .about-brief-text-area .area-title .title { font-size: 22px; } .about-brief-text-area .area-title .container { padding: 0 0.6rem; } .about-brief-text-area .text-container { padding: 0.6rem 0; } .about-brief-img-area .outer-container .video-container { position: relative; left: 0; width: 100%; } .development-bref-area .development-list-swiper .development-item .sub-title { margin-top: -3px; } } @media only screen and (max-width:768px) { .about-brief-text-area .area-title .container { padding: 0 0.3rem; border: none; } .about-brief-text-area { padding-bottom: 1.6rem; } .development-bref-area .development-side-swiper { position: absolute; left: 200%; transform: translate(-200%); -webkit-transform: translate(-200%); -moz-transform: translate(-200%); -ms-transform: translate(-200%); -o-transform: translate(-200%); } .development-bref-area .development-list-swiper { width: 100% !important; margin: 0; } .about-brief-img-area .outer-container .video-container { min-width: 0; } .development-bref-area .development-list-swiper .development-item .sub-title { margin-top: -5px; } } @media only screen and (max-width:480px) { .development-bref-area .development-list-swiper .development-item .sub-title { margin-top: -3px; } } /* 鍏充簬鐜悆-浼佷笟鏂囧寲 */ .culture { position: relative; line-height: 0; } .culture>* { line-height: 1.6; } .culture>img { position: absolute; width: 100%; height: 100%; object-fit: cover; z-index: -1; } .culture .title-area { z-index: 2; color: #fff; width: 92%; margin: 0 auto; } .culture .title-area .title { display: inline-block; font-size: 0.36rem; position: relative; } .culture .title-area .text { margin-top: 0.3rem; font-size: 24px; line-height: 1.8; } .culture .title-area .text a { display: inline-block; } .culture .title-area .sub-title { display: block; font-size: 0.3rem; font-weight: bold; color: rgba(255, 255, 255, 0.35); } .culture .title-area.font-bk .sub-title { color: rgba(173, 186, 179, 0.35); } .culture .title-area .title::after { content: ""; display: block; width: 0.08rem; height: 0.08rem; position: absolute; bottom: 0.3em; right: -0.16rem; background: #da251d; } .culture.type1 { margin: 0.6rem auto; width: 92%; } .culture.type1 .title-area { padding: 2.3rem 1.6rem; } .culture.type2 { width: 100%; } .culture.type2 .title-area { width: 92%; padding: 1.3rem 0 6.4rem 0; text-align: center; } .culture.type3 { width: 100%; background: url(/phone/images/bgimg17.png) no-repeat center center; background-size: cover; } .culture.type3>img { position: absolute !important; width: 50%; height: 70%; object-fit: contain; left: 45%; top: 1.1rem; } .culture.type3 .title-area { width: 92%; padding: 1.1rem 0 4.2rem 2.8rem; } .culture.type4 .title-area { padding: 2.8rem 0; text-align: center; } .culture.type5 .title-area { text-align: center; padding: 1.1rem 0; } .culture .title-area img { max-width: 90%; } @media only screen and (max-width:1200px) { .culture .title-area .sub-title { font-size: 20px; } } @media only screen and (max-width:1024px) { .culture .title-area .title { font-size: 22px; } .culture .title-area .text { font-size: 18px; } .culture.type1 .title-area { padding: 2.3rem 1rem; } .culture.type3 .title-area { padding: 1.1rem 0 3.6rem 1.6rem } .culture.type3>img { width: 45%; } } @media only screen and (max-width:768px) { .culture .title-area .text { font-size: 16px; } .culture.type1 .title-area { padding: 2.3rem 0.5rem; } .culture.type3 { display: flex; align-items: center; flex-direction: column-reverse; } .culture.type3 .title-area { padding: 1.1rem 0 1.1rem 0.8rem; text-align: center; } .culture.type3>img { width: 100%; position: relative !important; left: 0; margin-bottom: 0.5rem; top: 0; } } @media only screen and (max-width:480px) { /* .culture.type3>img { width: 75%; left: 12.5% } */ } /* 鍏充簬-鍝佽川淇濊瘉 */ .inner-page-tab { width: 92%; max-width: 1440px; margin: 0.7rem auto 0; display: flex; justify-content: center; align-items: center; position: relative; z-index: 2; } .inner-page-tab>a { cursor: pointer; width: 1000px; text-align: center; padding: 0.2rem 0; font-size: 20px; background: #fff; border: 1px solid #e6e6e6; } .inner-page-tab>a+a { border-left: none; } .inner-page-tab>a:hover, .inner-page-tab>a.selected { background: #da251d; color: #fff; border-color: #da251d; } .inner-page-tab+div { margin-top: calc(-20px - 0.2rem); border-top: 1px solid #e0e0e0; } .quality-details-area { position: relative; padding-top: 0.5rem; border-top: none !important; } .quality-details-area::before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #f5f5f5; z-index: -2; } .quality-details-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; padding-bottom: 0.7rem; } .quality-details-area .outer-container::after { content: ""; display: table; } .quality-details-item { display: flex; justify-content: space-between; align-items: center; /* margin-bottom: 1.6rem; */ padding: 0.8rem 0; } .quality-details-item+.quality-details-item { border-top: 1px solid #dcdcdc } .quality-details-item .bg-img-container { width: 44.44%; padding-top: 31.11%; } .quality-details-item .bg-img-container::after { content: ""; display: block; width: 0.4rem; height: 0.4rem; background: #da251d; position: absolute; z-index: 2; bottom: 0; right: 0; border-left: 5px solid #fff; border-top: 5px solid #fff; } .quality-details-item:nth-child(2n) .bg-img-container::after { right: auto; left: 0; border-left: none; border-right: 5px solid #fff; } .quality-details-item .text-area { width: 50%; } .quality-details-item .text-area .text { margin-top: 0.2rem; line-height: 1.8; } .quality-details-item:nth-child(2n) { flex-direction: row-reverse; } @media only screen and (max-width:768px) { .quality-details-item { flex-direction: column !important; } .quality-details-item>div { width: 100% !important; } .quality-details-item .bg-img-container { padding-top: 70%; } .quality-details-item>div { margin-top: 0.2rem; } .quality-details-item:nth-child(2n) .bg-img-container::after { left: auto; right: 0; border-right: none; border-left: 5px solid #fff; } } /* 瀹㈡埛鏈嶅姟-瀹㈡埛妗堜緥 */ .cases-area { position: relative; } .case-item { padding: 0.9rem 0 1rem 0; background: url() no-repeat center center; background-size: cover; } /* .case-item:first-child { padding-top: calc(0.9rem + 20px + 0.2rem); } */ .case-item .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; } .case-item .title-area { display: flex; justify-content: space-between; align-items: center; } .case-item .title-area .eng-title { font-size: 0.3rem; font-weight: bold; color: rgba(173, 186, 179, 0.35); } .case-item .img-area { margin-top: 0.1rem; display: flex; justify-content: space-between; align-items: center; } .case-item .img-area .bg-img-container { width: calc((100% - 3px) / 4); padding-top: 17.99%; } .case-item .img-area .bg-img-container+.bg-img-container { margin-left: 1px; } .case-item .img-area .bg-img-container.show-all-button::after { content: ""; display: block; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: #da251d; opacity: 0.8; z-index: 1; } .case-item .img-area .bg-img-container.show-all-button .blur-title { position: absolute; color: #fff; z-index: 3; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); } .case-item .img-area .bg-img-container.show-all-button .blur-title .cut-line { margin: 0.1rem auto; } .case-item:nth-child(2n) { background: #f5f5f5; background-image: none !important; } /* 瀹㈡埛鏈嶅姟-搴旂敤妗堜緥 */ .applications-area { position: relative; } .application-item { padding: 1rem 0; background: url() no-repeat center center; background-size: cover; } .application-item .outer-container { margin: 0 auto; width: 92%; max-width: 1440px; display: flex; justify-content: space-between; } .application-item .left-area { width: 50%; } .application-item .left-area.bg-img-container { padding-top: 34.79%; } .application-item .right-area { width: 45.14%; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; } .application-item .right-area .title-area .eng-title { font-size: 0.3rem; font-weight: bold; color: rgba(173, 186, 179, 0.35); } .application-item .right-area .show-more-bottom { display: inline-block; color: #da251d; padding: 10px 10px 10px 0; } .application-item .right-area .show-more-bottom .cut-line { margin-top: 0.1rem; width: 6em; } .application-item .right-area .img-area { width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap; } .application-item .right-area .img-area .bg-img-container { width: calc(100% / 4 - 1px); padding-top: 17.44%; margin-bottom: 1px; margin-right: 1px; } .application-item .right-area .img-area .bg-img-container:nth-child(n+9) { display: none; } .application-item .right-area .img-area .bg-img-container::before { content: "\e626"; display: block; font-family: "iconfont"; font-size: 0.5rem; color: #fff; position: absolute; z-index: 2; left: 50%; top: 50%; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); opacity: 0; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .application-item .right-area .img-area .bg-img-container::after { content: ""; display: block; width: 100%; height: 100%; background: #da251d; opacity: 0; position: absolute; top: 0; left: 0; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .application-item .right-area .img-area .bg-img-container:hover::after { opacity: 0.8; } .application-item .right-area .img-area .bg-img-container:hover::before { opacity: 1; } .application-item:nth-child(2n) { background: #f5f5f5; background-image: none !important; } .application-item:nth-child(2n) .outer-container { flex-direction: row-reverse; text-align: right; } .application-item:nth-child(2n) .right-area { align-items: flex-end; } .application-item:nth-child(2n) .right-area .area-title .text { margin-right: 0.24rem; } @media only screen and (max-width:1200px) { .application-item .right-area .title-area .eng-title { font-size: 20px; } } @media only screen and (max-width:1024px) { .application-item .right-area .img-area .bg-img-container { width: calc(100% / 3 - 1px); } .application-item .right-area .img-area .bg-img-container:nth-child(n+7) { display: none; } } @media only screen and (max-width:768px) { .application-item .outer-container { flex-direction: column !important; } .application-item .outer-container .left-area { width: 100%; padding-top: 69.58%; } .application-item .outer-container .right-area { width: 100%; margin-top: 0.4rem; } .application-item .right-area .img-area { display: none; } .application-item .right-area .show-more-bottom { padding-bottom: 0; } .application-item .right-area .show-more-bottom .cut-line { margin-bottom: 0; } .application-item:nth-child(2n) .right-area { align-items: flex-start; } .application-item:first-child { padding-top: 1.3rem; } .application-item:nth-child(2n) .outer-container { text-align: left; } } /* 鍏充簬-鍚堜綔瀹㈡埛鍒楄〃 */ .customers-list-area { position: relative; border-top: none !important; padding: 0.5rem 0; } .customers-list-area::before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #f5f5f5; z-index: -2; } .customers-list-area::after { content: ""; display: table; } .customers-list-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; } .customer-item { margin: 0.2rem 0; } .customer-item .title-area { display: flex; justify-content: space-between; align-items: center; padding: 0.2rem 0; border-bottom: 1px solid #dcdcdc; } .customer-item .title-area .area-title { width: 75%; max-width: 75%; } .customer-item .title-area .pull-button { font-size: 14px; color: #727272; padding: 10px; } .customer-item .title-area .pull-button:hover { color: #da251d; } .customer-item .customer-logos-list { display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0 -0.15rem; padding: 0.15rem 0; } .customer-item .customer-logo-item { margin: 0.15rem; width: calc(100% / 5 - 0.3rem); background: #fff; padding: 0.24rem; transition: none; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; } .customer-item .customer-logo-item .bg-img-container { width: 100%; padding-top: 61.13%; } .customer-item .customer-logo-item .bg-img-container .bg-img { background-size: contain; } @media only screen and (max-width:1200px) { .customer-item .customer-logo-item { width: calc(100% / 4 - 0.3rem); } } @media only screen and (max-width:1024px) { .customer-item .title-area .text { font-size: 22px; } .inner-page-tab>a { font-size: 18px; } } @media only screen and (max-width:768px) { .customer-item .title-area .text { font-size: 20px; } .customer-item .customer-logo-item { width: calc(100% / 3 - 0.3rem); } } @media only screen and (max-width:480px) { .customer-item .customer-logo-item { width: calc(100% / 2 - 0.3rem); } .customer-item .title-area .text { font-size: 18px; } } /* 鍏充簬-鏍稿績绔炰簤鍔 */ .with-gridding-background { position: relative; overflow: hidden; } .with-gridding-background .bg-img.gridding { height: 3.4rem; z-index: -1; bottom: 0; top: auto; } .competitiveness-img-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; padding: 0.4rem 0; } /* 鍏充簬-鐜悆鎷涜仒 */ .recruit-area .bg-img.aurora { min-height: 3.5rem; height: 50vh; } .bg-img.aurora { min-height: 250px; } .recruit-title-area { margin-top: 0.1rem; padding-bottom: 0.8rem; } .recruit-title-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; display: flex; justify-content: space-between; } .recruit-title-area .area-title { width: 40%; } .recruit-title-area .outer-container .text-area { width: 60%; } .recruit-title-area .outer-container .text-area ol { list-style-type: decimal-leading-zero; color: #da251d; font-weight: bold; } .recruit-title-area .outer-container .text-area .text { color: #242424; font-weight: normal; line-height: 1.8; margin-left: 5px; } .with-point-earth-background { position: relative; /* overflow: hidden; */ z-index: 2; } .with-point-earth-background .bg-img.point { width: 50%; height: 6.5rem; bottom: auto; top: 0; } .with-point-earth-background .bg-img.earth { width: 28%; height: 5rem; top: auto; bottom: 0; right: 0; left: auto; } .recruit-list-area::before { content: ""; display: block; width: 100%; height: 100%; background: #f1f1f1; top: 0; left: 0; position: absolute; z-index: -1; } .recruit-list-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; padding: 0.6rem 0; } .recruit-list-area .outer-container .area-title { text-align: center; } .recruit-list { margin: 0.1rem -0.2rem 0.3rem; display: flex; justify-content: flex-start; flex-wrap: wrap; min-height: 60vh; align-items: flex-start; } .recruit-item { margin: 0.2rem; width: calc(100% / 2 - 0.4rem); background: #fff; position: relative; } .recruit-item.enlage { z-index: 3; } .recruit-item .brief-area { padding: 0.3rem 0.4rem; position: relative; z-index: 1; } .recruit-item .brief-area::after { content: ""; display: block; position: absolute; width: 10px; height: 10px; background: #da251d; bottom: 10px; right: 10px; } .recruit-item .job-details-area .title-area .title, .recruit-item .brief-area .title { font-size: 18px; font-weight: bold; } .recruit-item .brief-area .title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } .recruit-item .job-details-area .title-area .info, .recruit-item .brief-area .link-button, .recruit-item .brief-area .info { margin-top: 10px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } .recruit-item .brief-area .info { height: calc(1em * 1.6); } .recruit-item .brief-area .link-button { color: #da251d; } .recruit-item .job-details-area { position: absolute; z-index: 2; top: 0; left: 0; width: 100%; background: #fff; display: none; box-shadow: 0 0 10px 0 rgba(100, 100, 100, 0.3); } .recruit-item .job-details-area .close-button { position: absolute; padding: 10px; font-size: 20px; color: #c6c6c6; top: 0; right: 0; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .recruit-item .job-details-area .close-button:hover { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); } .recruit-item .job-details-area .title-area { padding: 0.3rem 0.4rem; } .recruit-item .job-details-area .text-area { padding: 0.1rem; } .recruit-item .job-details-area .text-container { padding: 0.2rem 0.3rem; } .recruit-item .job-details-area .title-area { border-bottom: 1px solid #ececec; } .recruit-item .job-details-area .text-container { height: 50vh; overflow: auto; } .recruit-item .job-details-area .text-container::-webkit-scrollbar { width: 8px; } .recruit-item .job-details-area .text-container:hover::-webkit-scrollbar-thumb { background: #da251d; } .recruit-item .job-details-area .text-container::-webkit-scrollbar-thumb { border-radius: 12px; border: 6px solid transparent; box-shadow: inset 8px 0 0 #a5adb7 } @media only screen and (max-width:1400px) { .recruit-title-area .area-title { width: 30%; } .recruit-title-area .outer-container .text-area { width: 70%; } } @media only screen and (max-width:768px) { .recruit-title-area .outer-container { flex-direction: column; } .recruit-title-area .outer-container>div { width: calc(100% - 0.4rem); } .recruit-title-area .outer-container .text-area { width: 100%; margin-left: 0; margin-top: 0.5rem; } .recruit-title-area .outer-container .text-area .text { margin-left: 0; } } /* 鑱旂郴鎴戜滑 */ .with-map-point-background { position: relative; overflow: hidden; } .with-map-point-background .bg-img.map { width: 60%; height: 5rem; left: 50%; transform: translate(-50%); -webkit-transform: translate(-50%); -moz-transform: translate(-50%); -ms-transform: translate(-50%); -o-transform: translate(-50%); z-index: -1; } .addr-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; } .addr-area .addr-list { display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0 -0.7rem; } .addr-area .addr-item { margin: 0.3rem 0.7rem 1rem; width: calc(100% / 2 - 1.4rem); } .addr-area .addr-item .title { font-size: 0.3rem; font-weight: bold; padding-bottom: 0.2rem; border-bottom: 1px solid #e6e6e6; } .addr-area .addr-item .text { margin: 0.2rem 0; line-height: 2; position: relative; } .addr-area .addr-item .text img { height: 1em; width: 1em; object-fit: contain; line-height: 2.; margin-right: 14px; } .addr-area .addr-item .text::after { content: ""; display: block; position: absolute; right: 0; bottom: 0.4em; width: 0.3rem; height: 0.3rem; background: #da251d; } .addr-area .addr-item .text::before { content: ""; display: block; position: absolute; right: 0.3rem; bottom: calc(0.4em + 0.3rem); width: 0.15rem; height: 0.15rem; background: #adbab3; } .hotline-area .outer-container { width: 92%; margin: 0 auto; } .hotline-area .outer-container>img { width: 100%; } .hotline-area .text-area { max-width: 1440px; margin: -0.8rem auto 0; position: relative; padding: 0.8rem 1.2rem 1.2rem; display: flex; justify-content: space-between; align-items: center; } .hotline-area .text-area::before { content: ""; display: block; width: 100%; height: 1rem; position: absolute; top: 0; left: 0; background: #fff; } .hotline-area .text-area>div { position: relative; z-index: 2; } .hotline-area .text-area .left-area { width: 30%; } .hotline-area .text-area .left-area .area-title { padding-bottom: 0.2rem; border-bottom: 1px solid #dbdbdb; font-size: 0.3rem; } .hotline-area .text-area .left-area .text { margin-top: 0.3rem; line-height: 2; } .hotline-area .text-area .left-area .text::after { transform: translate(0, -0.05rem); -webkit-transform: translate(0, -0.05rem); -moz-transform: translate(0, -0.05rem); -ms-transform: translate(0, -0.05rem); -o-transform: translate(0, -0.05rem); } .hotline-area .text-area .right-area { width: 50%; } .hotline-area .text-area .right-area .text { text-align: center; } .hotline-area .text-area .right-area .text>img { max-width: 100%; } .message-area { background: url() no-repeat center right; background-size: cover; padding: 0.8rem 0 1rem; } .message-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; display: flex; justify-content: space-between; } .message-area .outer-container .left-area { width: 50%; max-width: 50%; } .message-area .remind-title { color: #da251d; margin-top: 0.2rem; } .message-area form { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; margin: 0 -0.1rem; margin-top: 0.2rem; } .message-area form>div { width: 100%; margin: 0.1rem; } .message-area form .title { font-size: 14px } .message-area form .title span { margin-left: 5px; } .message-area form input, .message-area form textarea { margin-top: 0.1rem; width: 100%; line-height: 0.5rem; padding: 0 14px; border: 1px solid #e6e6e6; } .message-area form textarea { line-height: 1.4; padding: 0.1rem 14px; } .message-area form .half { width: calc(100% / 2 - 0.2rem); } @media only screen and (max-width:1600px) { .hotline-area .text-area { margin-top: 0; } .hotline-area .text-area .left-area { width: 35%; } .message-area .outer-container .left-area { width: 60%; max-width: 60%; } .message-area form input, .message-area form textarea { line-height: 40px; } } @media only screen and (max-width:1400px) { .hotline-area .text-area { padding: 0.8rem 1rem 1.2rem; } .message-area .outer-container .left-area { width: 70%; max-width: 70%; } } @media only screen and (max-width:1200px) { .addr-area .addr-item .title { font-size: 20px; } .hotline-area .outer-container { overflow-x: hidden; } .hotline-area .text-area .left-area { width: 40%; } .hotline-area .text-area { padding: 0.8rem 0 1.2rem; } .hotline-area .text-area .left-area .text::after { transform: translate(0, -0.1rem); -webkit-transform: translate(0, -0.1rem); -moz-transform: translate(0, -0.1rem); -ms-transform: translate(0, -0.1rem); -o-transform: translate(0, -0.1rem); } } @media only screen and (max-width:1024px) { .hotline-area .text-area .left-area { width: 45%; } } @media only screen and (max-width:768px) { .addr-area .addr-list { flex-direction: column; margin: 0 auto; } .addr-area .addr-list>div { width: 100% !important; margin: 0.3rem auto 0.5rem; } .hotline-area .text-area { flex-direction: column; } .hotline-area .text-area>div { width: 100% !important; text-align: center; } .hotline-area .text-area .left-area .area-title { border-bottom: none; } .hotline-area .text-area .left-area .text { text-align: center; } .hotline-area .text-area .right-area { margin-top: 0.5rem; } .hotline-area .text-area .right-area .text>img { max-width: 80%; } .message-area .outer-container .left-area { width: 100%; max-width: 100%; } .message-area { position: relative; } .message-area::after { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(255, 255, 255, 0.8); z-index: 1; } .message-area .outer-container { position: relative; z-index: 2; } } /* 鍏充簬-鍝佺墝鑽h獕 */ .honor-area { background-size: cover; position: relative; border-top: none !important; } .honor-area .outer-container { width: 92%; max-width: 1440px; margin: 0 auto; padding: 0.8rem 0; position: relative; } .honor-area::before { content: ""; display: block; width: 100%; height: 100%; left: 0; top: 0; background: #f5f5f5; position: absolute; z-index: -2; } .honor-area::after { content: ""; display: block; width: 100%; height: 3px; background: url(/phone/images/pointLineBgimg1.png) repeat; position: absolute; bottom: calc(0.8rem + 0.44rem + 13.5px); left: 0; } .honor-area .honor-swiper .swiper-slide { height: 100%; display: flex; justify-content: flex-end; flex-direction: column; } .honor-area .honor-swiper .year { font-size: 0.48rem; position: relative; top: 0; } .honor-area .honor-swiper .year .unit { font-size: 24px; margin-left: 5px; } .honor-area .honor-swiper .swiper-slide .inner-container { padding: 0.3rem 0.6rem 1rem; /* height: 100%; */ position: relative; } .honor-area .honor-swiper .honor-item .bg-img-container { padding-top: 65%; } .honor-area .honor-swiper .honor-list-container { max-height: 66.5vh; overflow: auto; } .honor-area .honor-swiper .honor-list-container::-webkit-scrollbar { display: none; } .honor-area .honor-swiper .honor-list-container::-webkit-scrollbar-thumb { border: none; } .honor-area .honor-swiper .honor-list-container .honor-area .honor-swiper .honor-list { padding-bottom: 0.7rem; display: flex; flex-direction: column; justify-content: flex-end; } .honor-area .honor-swiper .honor-list-container::-webkit-scrollbar { border: 6px solid transparent; } .honor-area .honor-swiper .honor-item { margin: 0.15rem 0; } .honor-area .honor-swiper .honor-item .title { margin-top: 0.1rem; font-size: 16px; line-height: 1.4; height: calc(16px * 1.4 * 2); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .honor-area .honor-swiper .under-line { background-size: contain; top: auto; left: 15px; bottom: 0.44rem; height: 30px; } .honor-area .honor-swiper .bottom-year { position: absolute; left: 0; bottom: 0; font-size: 26px; line-height: 36px; font-weight: bold; color: #da251d; } .honor-area .honor-swiper .swiper-slide .inner-container .year::after { content: ""; display: block; width: 20px; height: 20px; position: absolute; top: 50%; left: calc(-0.6rem + 18px + 2.8%); background: url(/phone/images/pointbgimg.png) no-repeat center center; background-size: contain; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); } .honor-area .honor-swiper .swiper-slide .inner-container::before { content: ""; display: block; width: 3px; height: calc(100% - 1.4rem); z-index: -1; background: #e78d89; position: absolute; left: calc(14px + 2.8%); top: calc(0.636rem + 10px); } .honor-area .swiper-button-prev, .honor-area .swiper-button-next { color: #da251d; font-size: 0.6rem; width: 0.6rem; height: 0.6rem; line-height: 1; transition: opacity 0.5s ease; -webkit-transition: opacity 0.5s ease; -moz-transition: opacity 0.5s ease; -ms-transition: opacity 0.5s ease; -o-transition: opacity 0.5s ease; } .honor-area .swiper-button-prev { left: 4%; } .honor-area .swiper-button-next { right: 4%; } @media only screen and (min-width:1921px) { .honor-area .honor-swiper .swiper-slide .inner-container .year::after { left: calc(-0.6rem + 20px + 2.8%); } .honor-area .honor-swiper .year { font-size: 0.36rem; } .honor-area .honor-swiper .swiper-slide .inner-container::before { height: calc(100% - 1.2rem); top: 0.636rem; } } @media only screen and (max-width:1700px) { .honor-area .swiper-button-prev { left: 1%; } .honor-area .swiper-button-next { right: 1%; } } @media only screen and (max-width:1024px) { .honor-area .honor-swiper .year { font-size: 26px; } .honor-area .honor-swiper .swiper-slide .inner-container { padding-left: 1rem; padding-bottom: 1.2rem; } .honor-area .honor-swiper .swiper-slide .inner-container .year::after { left: calc(-1rem + 18px + 2.8%) } .honor-area .honor-swiper .bottom-year { bottom: -8px; font-size: 22px; } .honor-area .honor-swiper .swiper-slide .inner-container::before { height: calc(100% - 1.7rem); } .honor-area .honor-swiper .honor-item { margin: 10px 0; } } @media only screen and (max-width:480px) { .honor-area .honor-swiper .honor-item .title { margin-top: 0.1rem; font-size: 14px; line-height: 1.4; height: calc(14px * 1.4 * 2); } } /* 鐧婚檰鎻愮ず */ .background-blur { display: none; position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 102; background: rgba(0, 0, 0, 0.75) } .login-area { display: none; position: fixed; left: 50%; top: 50%; z-index: 103; background: #fff; transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); padding: 0.34rem; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; } .login-area .title { font-size: 22px; } .login-area .sub-title { font-size: 14px; color: rgba(0, 0, 0, 0.5); margin-top: 0.1rem; } .login-area .input-area { margin-top: 0.34rem; width: 300px; background: lavender; position: relative; border: 1px solid #dcdcdc; } .login-area .input-area+.input-area { margin-top: -1px; } .login-area .input-area input { padding: 16px 20px; display: block; width: 100%; height: 100%; font-size: 14px; } .login-area .input-area.code-input input { padding-right: 120px; } .login-area .input-area .code-remind { padding-right: 16px !important; background: transparent; display: inline-block; position: absolute; top: 50%; right: 0; transform: translate3d(0, -50%, 0); -webkit-transform: translate3d(0, -50%, 0); -moz-transform: translate3d(0, -50%, 0); -ms-transform: translate3d(0, -50%, 0); -o-transform: translate3d(0, -50%, 0); color: #da251d; padding: 16px; font-size: 14px; width: 102px; text-align: center; } .login-area .input-area.bottom::after { content: ""; display: block; width: 1px; height: 16px; position: absolute; right: calc(120px - 12px); top: 50%; background: #dcdcdc; transform: translate3d(0, -50%, 0); -webkit-transform: translate3d(0, -50%, 0); -moz-transform: translate3d(0, -50%, 0); -ms-transform: translate3d(0, -50%, 0); -o-transform: translate3d(0, -50%, 0); } .login-area .input-area.top { border-top-right-radius: 3px; border-top-left-radius: 3px; } .login-area .input-area.bottom { border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } .login-area button { cursor: pointer; width: 100%; background: #da251d; padding: 16px 20px; color: #fff; font-size: 14px; border: none; margin-top: 0.7rem; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .login-area button:hover { background: rgba(218, 37, 29, 0.8) } .login-area .close-button { position: absolute; top: 0; right: 0; font-size: 20px; padding: 10px; } .login-area .close-button:hover { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); } .login-area .input-area .code-remind.timer { color: #9a9a9a } @media only screen and (max-width:1024px) { .login-area .title { font-size: 20px; } } @media only screen and (max-width:1600px) { .about-brief-img-area .outer-container, .investment-details-area .outer-container, .data-download-details-area .outer-container, .hotline-area .outer-container { overflow-x: hidden; } .product-info-banner img, .about-brief-img-area .outer-container>img, .investment-details-area .outer-container>img, .data-download-details-area .outer-container>img, .hotline-area .outer-container>img { min-width: 133.33%; overflow: hidden; transform: translate(-16.66%) !important; -webkit-transform: translate(-16.66%) !important; -moz-transform: translate(-16.66%) !important; -ms-transform: translate(-16.66%) !important; -o-transform: translate(-16.66%) !important; } } @keyframes bounceInDown1 { 0%, 100%, 60%, 75%, 90% { -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1); transition-timing-function: cubic-bezier(0.215, .61, .355, 1) } 0% { opacity: 0; -webkit-transform: translate3d(0, -100px, 0); transform: translate3d(0, -100px, 0); -moz-transform: translate3d(0, -100px, 0); -ms-transform: translate3d(0, -100px, 0); -o-transform: translate3d(0, -100px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 8px, 0); transform: translate3d(0, 8px, 0); -moz-transform: translate3d(0, 8px, 0); -ms-transform: translate3d(0, 8px, 0); -o-transform: translate3d(0, 8px, 0); } 75% { -webkit-transform: translate3d(0, -3px, 0); transform: translate3d(0, -3px, 0); -moz-transform: translate3d(0, -3px, 0); -ms-transform: translate3d(0, -3px, 0); -o-transform: translate3d(0, -3px, 0); } 90% { -webkit-transform: translate3d(0, 3px, 0); transform: translate3d(0, 3px, 0); -moz-transform: translate3d(0, 3px, 0); -ms-transform: translate3d(0, 3px, 0); -o-transform: translate3d(0, 3px, 0); } 100% { -webkit-transform: none; transform: none } } .bounceInDown1 { -webkit-animation-name: bounceInDown1; animation-name: bounceInDown1 } @keyframes fadeInUp1 { 0% { opacity: 0; -webkit-transform: translate3d(0, 20%, 0); transform: translate3d(0, 20%, 0); -moz-transform: translate3d(0, 20%, 0); -ms-transform: translate3d(0, 20%, 0); -o-transform: translate3d(0, 20%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; } } .fadeInUp1 { -webkit-animation-name: fadeInUp1; animation-name: fadeInUp1 } @keyframes fadeInRight1 { 0% { opacity: 0; -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); -moz-transform: translate3d(10%, 0, 0); -ms-transform: translate3d(10%, 0, 0); -o-transform: translate3d(10%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none } } .fadeInRight1 { -webkit-animation-name: fadeInRight1; animation-name: fadeInRight1 } @keyframes fadeIn1 { 0% { opacity: 0; -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%); clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%); filter: alpha(1, 0, 2, 0, 0, 0, 0); -webkit-filter: alpha(1, 0, 2, 0, 0, 0, 0); } 50% { /*opacity: 0.5; */ -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); filter: alpha(1, 0, 2, 0, 100%, 100%, 100%); -webkit-filter: alpha(1, 0, 2, 0, 100%, 100%, 100%); } 100% { opacity: 1 } } .fadeIn1 { -webkit-animation-name: fadeIn1; animation-name: fadeIn1 } @keyframes fadeIn2 { 0% { opacity: 0; -webkit-clip-path: polygon(32% 47%, 0 0, 0 100%, 0% 100%); clip-path: polygon(32% 47%, 32% 47%, 32% 47%, 32% 47%); } 100% { opacity: 1; -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } } .fadeIn2 { -webkit-animation-name: fadeIn2; animation-name: fadeIn2 } #gif .only-for-phone { display: none; } @media only screen and (max-width:1024px) { #gif .only-for-phone { display: block; } #gif .bg-img:not(.only-for-phone) { display: none; } } .text p a { display: inline-block; } .text-container p a { display: inline-block; }