.Location { background-color: #fff; height: 100%; .searchBox { display: flex; height: 90px; } .searchInput { box-sizing: border-box; flex: 1; padding-left: 20px; height: 80px; line-height: 80px; border: 2px solid #f0f0f0; border-radius: 8px; word-break: break-all; margin-top: 16px; margin-left: 40px; width: 550px; height: 56px; } .searchBtn { height: 90px; line-height: 90px; margin-left: 24px; margin-right: 40px; font-size: 30px; color: #456beb; } .searchIcon { width: 30px; height: 30px; margin-right: 10px; vertical-align: middle; } .infoBar { position: fixed; z-index: 2; top: 262px; right: 30px; width: 40px; text-align: center; font-size: 26px; color: #666; } .infoItem { height: 50px; line-height: 50px; } .infoToast { position: fixed; z-index: 2; width: 180px; height: 180px; line-height: 180px; background-color: #a2b5f5; border-radius: 8px; left: 9999px; top: 480px; margin-left: -90px; text-align: center; font-size: 116px; color: #fff; opacity: 0; transition: opacity 500ms; } .show { opacity: 1; left: 50%; } .locationList { height: calc(100vh - 90rpx); } .locationTitle { padding: 0 40px; height: 70px; line-height: 70px; background-color: #ebebeb; font-size: 26px; color: #999; } .locationItem { width: 530px; line-height: 80px; margin: 0 auto; font-size: 30px; color: #444; border-bottom: 2px solid #ebebeb; word-break: break-all; } .locationItem:last-child { border-bottom: none; } }