.banner { position: relative; } .banner img { width: 100%; } .banner .text { position: absolute; width: 100%; top: 46%; color: #fff; } .banner .text h2 { text-align: center; font-size: 2.3rem; font-weight: bold; letter-spacing: 1px; } .banner .text p { text-align: center; font-size: 1.2rem; letter-spacing: 1px; margin-top: 0.6rem; } .sub-nav { height: 4rem; border-bottom: 1px solid #ddd; overflow: hidden; position: relative; top: 0; background: #fff; width: 100%; border-top: 1px solid #ddd; z-index: 100; } .sub-nav .content .left { float: left; } .sub-nav .content .left h6 { line-height: 4rem; font-size: 1.3rem; font-weight: bold; } .sub-nav .content .left h6 span { font-size: 1rem; color: #9f223d; margin-left: 1rem; position: relative; top: -0.1rem; } .sub-nav .content .right { float: right; } .sub-nav .content .right > ul li { float: left; width: 4.6rem; height: 4rem; text-align: center; position: relative; } .sub-nav .content .right > ul li a { line-height: 4rem; font-size: 0.8rem; display: block; } .sub-nav .content .right > ul li:not(:last-child) { margin-right: 2rem; } .sub-nav .content .right > ul li:before { content: ''; width: 0; height: 3px; background: #9f223d; position: absolute; bottom: 0; left: 0; } .sub-nav .content .right > ul li.active:before { width: 100%; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .sub-nav .content .right > ul li.active a { color: #9f223d; } .sub-nav .content .right > ul li:hover:before { width: 100%; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .sub-nav .content .right > ul li:hover a { color: #9f223d; } .report-con .con .text .title { text-align: center; } .report-con .con .text .title h2 { font-size: 1.6rem; font-weight: bold; margin: 3.5rem 0 2rem; } .report-con .con .text .title > ul { display: inline-block; } .report-con .con .text .title > ul li { float: left; margin-right: 3.5rem; font-size: 0.8rem; color: #999; } .report-con .con .text .title > ul li span { font-size: 0.8rem; color: #999; margin-right: 0.4rem; } .report-con .con .text .title > ul li span:nth-child(2) { color: #dcdcdc; } .report-con .con .text .title > ul li .bdsharebuttonbox { position: relative; top: -0.5rem; left: 0.5rem; } .report-con .con .text .title > ul li .bdsharebuttonbox a { position: relative; width: 1.4rem; height: 1.4rem; border-radius: 50%; background: #92cf46; margin-right: 0.5rem; } .report-con .con .text .title > ul li .bdsharebuttonbox a:before { content: '\e617'; font-family: 'iconfont'; color: #fff; font-size: 0.8rem; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .report-con .con .text .title > ul li .bdsharebuttonbox .bds_tsina { background: #de5c47; } .report-con .con .text .title > ul li .bdsharebuttonbox .bds_tsina:before { content: '\e699'; } .report-con .con .text .title > ul li .bdsharebuttonbox .bds_copy { background: #5f5d5d; } .report-con .con .text .title > ul li .bdsharebuttonbox .bds_copy:before { content: '\e60c'; } .report-con .con .text .title > ul li .bdsharebuttonbox .bds_sqq { background: #65b3f4; } .report-con .con .text .title > ul li .bdsharebuttonbox .bds_sqq:before { content: '\e612'; } .report-con .con .text .main p { /* text-align: justify; */ /* font-size: 0.8rem; */ line-height: 1.8; } .report-con .con .text .main img { max-width: 100%!important; } .report-con .con .case { margin-top: 2.5rem; } .report-con .con .case > h2 { font-size: 1.6rem; font-weight: bold; padding-left: 1rem; position: relative; margin-bottom: 1.5rem; } .report-con .con .case > h2:before { content: ''; width: 3px; height: 1.5rem; background: #9f223d; position: absolute; left: 0; top: 0.6rem; } .report-con .con .case > ul li { float: left; width: 23.4%; margin-top: 1.5rem; } .report-con .con .case > ul li:not(:nth-child(4n)) { margin-right: 2.1333%; } .report-con .con .case > ul li .top { height: 0; padding-bottom: 53%; overflow: hidden; } .report-con .con .case > ul li .top img { width: 100%; } .report-con .con .case > ul li .bottom { background: #eceef0; padding: 1.5rem 1.5rem; } .report-con .con .case > ul li .bottom h2 { font-size: 1.2rem; font-weight: bold; letter-spacing: 1px; margin-bottom: 1.2rem; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 1.5em; } .report-con .con .case > ul li .bottom p { font-size: 0.7rem; -webkit-line-clamp: 4; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 6em; text-align: justify; margin-bottom: 1.5rem; } .report-con .con .case > ul li .bottom h3 { font-size: 0.8rem; color: #a83953; } .report-con .con .case > ul li .bottom h3 span { margin-right: 0.4rem; font-size: 1rem; position: relative; top: 0.1rem; } .report-con .con .case > ul li:hover .top img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .report-con .con .product { margin-top: 4rem; } .report-con .con .product > h2 { font-size: 1.6rem; font-weight: bold; padding-left: 1rem; position: relative; margin-bottom: 2.5rem; } .report-con .con .product > h2:before { content: ''; width: 3px; height: 1.5rem; background: #9f223d; position: absolute; left: 0; top: 0.6rem; } .report-con .con .product > ul li { float: left; width: 23.3%; } .report-con .con .product > ul li:not(:last-child) { margin-right: 2.2666%; } .report-con .con .product > ul li a { display: block; } .report-con .con .product > ul li .top { height: 0; padding-bottom: 65%; overflow: hidden; } .report-con .con .product > ul li .top img { width: 100%; } .report-con .con .product > ul li .bottom { text-align: center; background: #eceef0; height: 0; padding: 2rem 2rem 60%; } .report-con .con .product > ul li .bottom h2 { font-size: 1.3rem; } .report-con .con .product > ul li .bottom .line { width: 0.8rem; height: 1px; background: #9f223d; margin: 1rem auto; } .report-con .con .product > ul li .bottom p { font-size: 0.7rem; color: #666; } .report-con .con .product > ul li:hover .top img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .con-show .show { margin-top: 4rem; } .con-show .show > h2 { font-size: 1.6rem; font-weight: bold; padding-left: 1rem; position: relative; margin-bottom: 2.5rem; } .con-show .show > h2:before { content: ''; width: 3px; height: 1.5rem; background: #9f223d; position: absolute; left: 0; top: 0.6rem; } .con-show .show .show-con { box-shadow: 0px 10px 90px 0px rgba(0, 0, 0, 0.2); padding: 4rem; background: url(../img/news/active/show_bg.jpg) no-repeat; background-size: cover; } .con-show .show .show-con .main { width: 56%; } .con-show .show .show-con .main > span { font-size: 1.2rem; color: #999; } .con-show .show .show-con .main > h3 { font-size: 1.6rem; font-weight: bold; color: #9f223d; } .con-show .show .show-con .main form { margin-top: 1rem; } .con-show .show .show-con .main form .list > div { float: left; width: 100%; margin-top: 1.2rem; } .con-show .show .show-con .main form .list > div > div > div input { width: 100%; height: 2.4rem; background: #f3f3f5; border: none; padding-left: 1rem; font-size: 0.8rem; color: #999; } .con-show .show .show-con .main form .list > div > div > div select { width: 100%; height: 2.4rem; background: #f3f3f5; border: none; padding-left: 1rem; font-size: 0.8rem; color: #999; } .con-show .show .show-con .main form .list > div:nth-child(1) { width: 62%; } .con-show .show .show-con .main form .list > div:nth-child(2) { width: 34%; margin-left: 4%; } .con-show .show .show-con .main form .list > div:nth-child(3) { width: 62%; } .con-show .show .show-con .main form .list > div:nth-child(4) { width: 34%; margin-left: 4%; } .con-show .show .show-con .main form .list > div:nth-child(5) { width: 48%; } .con-show .show .show-con .main form .list > div:nth-child(6) { width: 48%; margin-left: 4%; } .con-show .show .show-con .main form.yanzhengma { margin-top: 1.2rem; } .con-show .show .show-con .main form.yanzhengma > div { position: relative; width: 62%; } .con-show .show .show-con .main form.yanzhengma > div .verify-code { position: absolute; right: 0; background: none !important; } .con-show .show .show-con .main form.yanzhengma > div .verify-change-code { display: none; } .con-show .show .show-con .main form.yanzhengma > div > div input { width: 100%; height: 2.4rem; background: #f3f3f5; border: none; padding-left: 1rem; font-size: 0.8rem; color: #999; } .con-show .show .show-con .main .btn { margin: 2.5rem 0 0; } .con-show .show .show-con .main .btn input { width: 7.9rem; height: 2.5rem; background: #95a2a9; border-radius: 26px; color: #fff; border: none; font-size: 0.8rem; } .con-show .show .show-con .main .btn input:hover { background: #9f223d; } .con-show .show .show-con .main .btn input:first-child { margin-right: 1rem; } .con-bottom .article { margin: 4rem 0 5rem; } .con-bottom .article a { display: block; font-size: 0.8rem; } .con-bottom .article a:hover { color: #9f223d; } .con-bottom .recommend { margin-top: 4rem; margin-bottom: 4rem; } .con-bottom .recommend > h2 { font-size: 1.6rem; font-weight: bold; padding-left: 1rem; position: relative; margin-bottom: 2.5rem; } .con-bottom .recommend > h2:before { content: ''; width: 3px; height: 1.5rem; background: #9f223d; position: absolute; left: 0; top: 0.6rem; } .con-bottom .recommend > ul li { width: 31.6%; float: left; margin-top: 1rem; } .con-bottom .recommend > ul li .top { height: 0; padding-bottom: 56%; overflow: hidden; } .con-bottom .recommend > ul li .top img { width: 100%; } .con-bottom .recommend > ul li .bottom { padding-bottom: 2.5rem; } .con-bottom .recommend > ul li .bottom h3 { font-size: 1rem; font-style: italic; margin-top: 1rem; } .con-bottom .recommend > ul li .bottom h2 { font-size: 1.3rem; font-weight: bold; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 1.5em; margin: 0.5rem 0 1rem; } .con-bottom .recommend > ul li .bottom .more { font-size: 0.8rem; color: #9f223d; line-height: 1rem; margin-bottom: 1rem; } .con-bottom .recommend > ul li .bottom .more .btn { width: 1rem; height: 1rem; border-radius: 50%; background: #9f223d; text-align: center; display: inline-block; margin-right: 0.4rem; } .con-bottom .recommend > ul li .bottom .more .btn span { color: #fff; font-size: 0.6rem; position: relative; top: -2px; left: 1px; } .con-bottom .recommend > ul li .bottom span { font-size: 0.8rem; color: #999; } .con-bottom .recommend > ul li:not(:nth-child(3n)) { margin-right: 2.6%; } .con-bottom .recommend > ul li:hover .top img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .con-bottom .recommend > ul li:hover .bottom .more { color: #7a1d2f; } .con-bottom .recommend > ul li:hover .bottom .more .btn { background: #7a1d2f; } @media screen and (max-width: 1366px) { .report-con .con .product > ul li .bottom { padding: 1.5rem 1.5rem 68%; } .con-bottom .recommend > ul li .bottom .more .btn span { top: 0; } } @media screen and (max-width: 1024px) { .banner { margin-top: 5.5rem; } .banner .text { top: 38%; } .report-con .con .case > ul li .bottom h2 { font-size: 1.1rem; } .report-con .con .product > ul li .bottom { padding: 1.5rem 1.5rem 82%; } .con-bottom .recommend > ul li .bottom h2 { font-size: 1.1rem; } .con-bottom .recommend > ul li .bottom h3 { font-size: 0.9rem; } } @media screen and (max-width: 768px) { .banner .text { top: 30%; } .banner .text h2 { font-size: 18px; } .banner .text p { font-size: 13px; margin-top: 0.2rem; } .sub-nav .content .left { display: none; } .sub-nav .content .right { width: 100%; } .sub-nav .content .right > ul li { width: 20%; } .sub-nav .content .right > ul li a { font-size: 12px; } .sub-nav .content .right > ul li:not(:last-child) { margin-right: 0; } .report-con .con .text .title h2 { font-size: 16px; margin: 1.5rem 0 0; text-align: center; } .report-con .con .text .title > ul { width: 100%; display: inline; } .report-con .con .text .title > ul li { margin-top: 1rem; margin-right: 0; width: 50%; font-size: 12px; } .report-con .con .text .title > ul li span { font-size: 12px; } .report-con .con .text .title > ul li .bdsharebuttonbox a { width: 24px; height: 24px; } .report-con .con .text .title > ul li .bdsharebuttonbox a:before { font-size: 14px; } .report-con .con .text .title > ul li:nth-child(2) .bdsharebuttonbox { position: relative; left: 0; top: -0.7rem; } .report-con .con .text .main p { /* font-size: 13px; */ } .report-con .con .article { margin: 2rem 0; } .report-con .con .article a { font-size: 13px; } .report-con .con .article a span:first-child { width: 16%; float: left; } .report-con .con .article a span:last-child { width: 84%; float: left; } .report-con .con .case { margin-top: 2rem; } .report-con .con .case > h2 { font-size: 16px; margin-bottom: 0; } .report-con .con .case > h2:before { top: 2px; } .report-con .con .case > ul li { width: 48.5%; } .report-con .con .case > ul li:not(:nth-child(4n)) { margin-right: 0; } .report-con .con .case > ul li:nth-child(odd) { margin-right: 3%; } .report-con .con .case > ul li a .bottom h2 { font-size: 14px; margin-bottom: 1rem; } .report-con .con .case > ul li a .bottom p { font-size: 13px; } .report-con .con .case > ul li a .bottom h3 { font-size: 14px; } .report-con .con .case > ul li a .bottom h3 span { font-size: 16px; top: 1px; } .report-con .con .product { margin-top: 2rem; } .report-con .con .product > h2 { font-size: 16px; margin-bottom: 0; } .report-con .con .product > h2:before { top: 2px; } .report-con .con .product > ul li { width: 48.5%; margin-top: 1rem; } .report-con .con .product > ul li:not(:last-child) { margin-right: 0; } .report-con .con .product > ul li:nth-child(odd) { margin-right: 3%; } .report-con .con .product > ul li .bottom { padding: 1.5rem 1.5rem 100%; } .report-con .con .product > ul li .bottom h2 { font-size: 16px; } .report-con .con .product > ul li .bottom p { font-size: 13px; } .con-show .show { margin-top: 2rem; } .con-show .show > h2 { font-size: 16px; margin-bottom: 1.5rem; } .con-show .show > h2:before { top: 2px; } .con-show .show .show-con { padding: 1rem; background: none; } .con-show .show .show-con .main { width: 100%; } .con-show .show .show-con .main > span { font-size: 12px; } .con-show .show .show-con .main h3 { font-size: 16px; } .con-show .show .show-con .main form { margin-top: 0; } .con-show .show .show-con .main form .list > div { width: 100% !important; margin-left: 0 !important; } .con-show .show .show-con .main .btn input { width: 8rem; height: 3rem; font-size: 14px; } .con-bottom .article { margin: 3rem 0; } .con-bottom .article a { font-size: 13px; } .con-bottom .article a span:first-child { width: 16%; float: left; } .con-bottom .article a span:last-child { width: 84%; float: left; } .con-bottom .recommend { margin-top: 2rem; margin-bottom: 0; } .con-bottom .recommend > h2 { font-size: 16px; margin-bottom: 0; } .con-bottom .recommend > h2:before { top: 2px; } .con-bottom .recommend > ul { padding-bottom: 2rem; } .con-bottom .recommend > ul li { width: 48.5%; } .con-bottom .recommend > ul li:not(:nth-child(3n)) { margin-right: 0; } .con-bottom .recommend > ul li:nth-child(odd) { margin-right: 3%; } .con-bottom .recommend > ul li .bottom h3 { font-size: 12px; } .con-bottom .recommend > ul li .bottom h2 { font-size: 14px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; height: 3em; } .con-bottom .recommend > ul li .bottom .more { font-size: 14px; } .con-bottom .recommend > ul li .bottom .more .btn { width: 14px; height: 14px; } .con-bottom .recommend > ul li .bottom .more .btn span { left: 0; line-height: 14px; } .con-bottom .recommend > ul li .bottom span { font-size: 12px; } } /*# sourceMappingURL=info_active_detail.css.map */