.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; 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; } .eco { width: 100%; overflow: hidden; padding: 5rem 0 8rem; } .eco .w1020 { max-width: 1020px; margin: 0 auto; } .eco .title { width: 100%; text-align: center; font-weight: bold; color: #333; } .eco .search { margin-top: 1.5rem; width: 100%; background-color: #f3f3f5; height: 60px; display: flex; justify-content: space-between; align-items: center; overflow: hidden; position: relative; } .eco .search .iconfont { display: block; font-size: 18px; color: #999; position: absolute; left: 18px; top: 50%; transform: translateY(-50%); } .eco .search input { -webkit-tap-highlight-color: transparent; -webkit-appearance: none; box-sizing: border-box; width: 85%; height: 100%; font-size: 14px; border: none; background-color: transparent; padding-left: 50px; outline: none; } .eco .search input::-webkit-input-placeholder { color: #666; font-size: 14px; } .eco .search input:-moz-placeholder { color: #666; font-size: 14px; } .eco .search input::-moz-placeholder { color: #666; font-size: 14px; } .eco .search input:-ms-input-placeholder { color: #666; font-size: 14px; } .eco .search a { display: inline-block; width: 15%; font-size: 16px; text-align: center; height: 100%; line-height: 60px; color: #fff; background-color: #9e223f; } .eco .result { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 2rem; } .eco .result .information { width: 52%; } .eco .result .information li { display: flex; justify-content: flex-start; height: 55px; margin-bottom: 6px; } .eco .result .information li label { font-size: 16px; color: #666; display: block; width: 100px; line-height: 55px; } .eco .result .information li label i { color: #ff0000; } .eco .result .information li span { font-size: 16px; color: #666; background-color: #f3f3f5; display: block; width: calc(100% - 100px); padding: 0 15px; line-height: 55px; } .eco .result .certificate { width: 42%; } .eco .result .certificate img { width: 100%; } @media screen and (max-width: 1024px) { .banner { margin-top: 5.5rem; } .banner .text { top: 38%; } } @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: 33.33%; } .sub-nav .content .right > ul li a { font-size: 12px; } .sub-nav .content .right > ul li:not(:last-child) { margin-right: 0; } .eco .search input { width: 75%; } .eco .search a { width: 25%; } .eco .result .information { width: 100%; margin-bottom: 20px; } .eco .result .information li label { font-size: 14px; width: 80px; } .eco .result .information li span { font-size: 14px; width: calc(100% - 80px); } .eco .result .certificate { width: 100%; } } /*# sourceMappingURL=./eco_result.css.map */