body, html { padding: 0; border: none; margin: 0; } body { height: 100vh; overflow-y: auto; overflow-x: hidden; font-size: 0.2rem; color: #3E3A39; } body.disabled-scroll { overflow-y: hidden; } .iconfont { font-weight: normal !important; } * { box-sizing: border-box; } img { object-fit: cover; } a { text-decoration: none; cursor: pointer; } .jumbotron { width: 100%; height: 3.23rem; overflow: hidden; } .jumbotron img { width: 100%; height: 100%; } .container { width: 15rem; margin: 0 auto; height: fit-content; position: relative; } .container .sub-menu { display: flex; align-items: center; justify-content: center; position: absolute; left: 50%; top: 0; transform: translateX(-50%) translateY(-50%); z-index: 10; background-color: #FFF; box-shadow: 0 0 0.2rem 0 rgba(0, 0, 0, 0.1); border-radius: 0.02rem; max-width: 15rem; overflow-y: hidden; overflow-x: auto; } .container .sub-menu > .division { height: 0.25rem; width: 1px; background-color: #F0F0F0; border: none; } .container .sub-menu > .division:first-child { display: none; } .container .sub-menu > a { height: 0.96rem; width: 3rem; flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; text-align-last: center; text-align-all: center; font-size: 0.18rem; line-height: 0.22rem; padding: 0 0.32rem; color: #3E3A39; } .container .sub-menu > a.active, .container .sub-menu > a:hover { color: #FFF; background-image: url("../img/column-nav-bg.png"); background-repeat: no-repeat; background-position: center center; background-size: 0.56rem; background-color: var(--themeColor); } .container .nav-position { display: flex; align-items: center; justify-content: flex-start; padding: 0.08rem; margin-top: 0.2rem; } .container .nav-position > a, .container .nav-position > span{ font-size: 0.18rem; color: #656565; padding: 0 0.04rem; } .container .nav-position > a:last-child { color: #333333; } @media screen and (min-width: 961px) { .container .nav-position { display: none; } } @media screen and (max-width:960px) { .container .nav-position > a, .container .nav-position > span{ font-size: 0.24rem; } .jumbotron { height: 2.3rem; } .container { width: calc(100% - 0.32rem * 2); } .container .sub-menu { display: none; } }