.nnn-new-report-wrap-one { position: relative; z-index: 99; overflow: hidden; width: 170rem; height: 114.5rem; cursor: pointer; } .nnn-new-report-wrap-one--multi { height: auto; min-height: 216rem; padding: 8rem 0; border-radius: 6rem; background: linear-gradient(135deg, #3bafee, #197bff); box-shadow: 0rem 8rem 20rem rgba(0, 0, 0, 0.2), inset 1rem 1rem 8rem rgba(170, 198, 234, 0.8); } .nnn-new-report-wrap-one--multi .nnn-new-report-mini-item { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; width: 152rem; height: 50rem; margin: 0 auto; padding: 0 12rem; font-family: "Source Han Sans-Medium", "Source Han Sans"; font-weight: 500; font-size: 16rem; color: #ffffff; line-height: 23rem; border-bottom-width: 1rem; border-bottom-style: solid; border-image: linear-gradient(282deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0)) 1 1; } .nnn-new-report-wrap-one--multi .nnn-new-report-mini-item:hover { background: linear-gradient(to right, #4ccbfd, rgba(201, 221, 255, 0)); } .nnn-new-report-wrap-one--multi .nnn-new-report-mini-item:last-child { border-bottom: 0; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-img { width: 170rem; height: 114.5rem; position: absolute; top: 0; left: 0; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text { position: absolute; bottom: 54rem; left: 0; width: 161rem; height: 35rem; opacity: 0; z-index: 1; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text:hover { opacity: 1; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-1 { position: absolute; font-family: "Source Han Sans-Medium", "Source Han Sans"; font-weight: 500; font-size: 16rem; color: #ffffff; line-height: 23rem; bottom: 60rem; left: 21rem; z-index: 2; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-1:hover ~ .nnn-new-report-wrap-one-text { opacity: 1; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-2 { position: absolute; font-family: "Source Han Sans-Normal", "Source Han Sans"; font-weight: 350; font-size: 20rem; color: #ffffff; line-height: 29rem; text-align: right; font-style: normal; bottom: 57rem; left: 132rem; z-index: 2; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-2:hover ~ .nnn-new-report-wrap-one-text { opacity: 1; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-5 { position: absolute; bottom: 10rem; left: 0; width: 161rem; height: 35rem; opacity: 0; z-index: 1; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-5:hover { opacity: 1; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-3 { position: absolute; font-family: "Source Han Sans-Medium", "Source Han Sans"; font-weight: 500; font-size: 16rem; color: #ffffff; line-height: 23rem; bottom: 17rem; left: 21rem; z-index: 2; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-3:hover ~ .nnn-new-report-wrap-one-text-5 { opacity: 1; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-4 { position: absolute; font-family: "Source Han Sans-Normal", "Source Han Sans"; font-weight: 350; font-size: 20rem; color: #ffffff; line-height: 29rem; text-align: right; font-style: normal; bottom: 15rem; left: 132rem; z-index: 2; } .nnn-new-report-wrap-one .nnn-new-report-wrap-one-text-4:hover ~ .nnn-new-report-wrap-one-text-5 { opacity: 1; } .nnn-new-report-wrap { position: relative; z-index: 99; overflow: hidden; border-radius: 6rem; } .nnn-new-report-wrap .nnn-new-report-bg { position: absolute; left: 0; top: 19rem; bottom: 0; right: 0; background: linear-gradient(135deg, #3bafee, #197bff); width: 100%; height: 100%; box-shadow: inset 1rem 1rem 8rem rgba(170, 198, 234, 0.8); } .nnn-new-report-wrap .nnn-new-report-top { width: 170rem; height: 60.23rem; position: relative; z-index: 100; } .nnn-new-report-wrap .nnn-new-report-top .nnn-new-report-top-img { position: absolute; width: 170rem; height: 60.23rem; top: 0; left: 0; } .nnn-new-report-wrap .nnn-new-report-top .nnn-new-report-top-text { position: absolute; top: 23rem; left: 21rem; height: 30rem; font-family: "Source Han Sans-Bold", "Source Han Sans"; font-weight: 700; font-size: 20rem; color: #ffffff; line-height: 30rem; text-align: left; z-index: 100; } .nnn-new-report-wrap .nnn-new-report-list { position: relative; z-index: 100; } .nnn-new-report-wrap .nnn-new-report-list .nnn-new-report-item { display: flex; flex-direction: row; padding: 18rem 20rem 11rem 21rem; justify-content: space-between; cursor: pointer; position: relative; } .nnn-new-report-wrap .nnn-new-report-list .nnn-new-report-item:hover::before { position: absolute; content: ""; top: 0; right: 0; left: 0; z-index: 1; width: 100%; height: 100%; background: linear-gradient(to right, #4ccbfd, rgba(201, 221, 255, 0)); } .nnn-new-report-wrap .nnn-new-report-list .nnn-new-report-item.line { border-bottom-width: 1rem; border-bottom-style: solid; border-image: linear-gradient(282deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0)) 1 1; } .nnn-new-report-wrap .nnn-new-report-list .nnn-new-report-item .nnn-new-report-item-left { flex: 1; z-index: 2; } .nnn-new-report-wrap .nnn-new-report-list .nnn-new-report-item .nnn-new-report-item-left .nnn-new-report-item-left-text { font-family: "Source Han Sans-Medium", "Source Han Sans"; font-weight: 500; font-size: 16rem; color: #ffffff; line-height: 23rem; } .nnn-new-report-wrap .nnn-new-report-list .nnn-new-report-item .nnn-new-report-item-left .nnn-new-report-item-left-tag { width: 52rem; height: 21rem; margin-top: 4rem; background: #f6662d; border-radius: 2rem 2rem 2rem 2rem; font-family: "Source Han Sans-Medium", "Source Han Sans"; font-weight: 500; font-size: 12rem; color: #ffffff; line-height: 11rem; display: flex; justify-content: center; align-items: center; } .nnn-new-report-wrap .nnn-new-report-list .nnn-new-report-item .nnn-new-report-item-right { z-index: 2; font-family: "Source Han Sans-Regular", "Source Han Sans"; font-weight: 350; font-size: 20rem; color: #ffffff; line-height: 29rem; text-align: right; font-style: normal; text-transform: none; display: flex; justify-content: center; align-items: center; } .nnn-new-report-wrap .nnn-new-report-bottom { position: relative; width: 170rem; min-height: 264rem; padding: 8rem 0; display: flex; justify-content: center; align-items: center; cursor: pointer; flex-direction: column; } .nnn-new-report-wrap .nnn-new-report-bottom .nnn-new-report-bottom-bg { width: 170rem; height: 100%; position: absolute; } .nnn-new-report-wrap .nnn-new-report-bottom .nnn-new-report-bottom-content { position: relative; width: 152rem; height: 66rem; display: flex; flex-direction: row; align-items: center; justify-content: space-between; } .nnn-new-report-wrap .nnn-new-report-bottom .nnn-new-report-bottom-content-line { position: absolute; left: 0; top: 80rem; width: 100%; border-bottom-width: 1rem; border-bottom-style: solid; border-image: linear-gradient(282deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0)) 1 1; } .nnn-new-report-wrap .nnn-new-report-bottom .nnn-new-report-bottom-content.line { padding-bottom: 1rem; border-bottom-width: 1rem; border-bottom-style: solid; border-image: linear-gradient(282deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0)) 1 1; } .nnn-new-report-wrap .nnn-new-report-bottom .nnn-new-report-bottom-content:hover .nnn-new-report-bottom-content-img { width: 152rem; height: 66rem; } .nnn-new-report-wrap .nnn-new-report-bottom .nnn-new-report-bottom-content .nnn-new-report-bottom-content-img { position: absolute; width: 0rem; height: 0rem; } .nnn-new-report-wrap .nnn-new-report-bottom .nnn-new-report-bottom-content .nnn-new-report-bottom-bg-left { position: relative; font-family: "Source Han Sans-Medium", "Source Han Sans"; font-weight: bold; font-size: 16rem; color: #ffffff; line-height: 23rem; padding-left: 12rem; } .nnn-new-report-wrap .nnn-new-report-bottom .nnn-new-report-bottom-content .nnn-new-report-bottom-bg-right { position: relative; font-family: "Source Han Sans-Regular", "Source Han Sans"; font-weight: 350; font-size: 20rem; color: #ffffff; line-height: 29rem; padding-right: 12rem; } .nnn-new-report-wrap .customer-service-dialog { background: transparent !important; -webkit-box-shadow: none; width: fit-content; margin: auto !important; }