html, body, #app { width: 100%; height: 100%; margin: 0; font-family: "微软雅黑","Helvetica Neue", Helvetica, Arial, sans-serif; } * { font-family: "微软雅黑","Helvetica Neue",Helvetica,Arial,sans-serif; user-select: none; font-size: 0.83vw; } html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin: 0; padding: 0; } fieldset, img, input, button, textarea { border: none; padding: 0; margin: 0; outline-style: none; } ul, ol { list-style: none; } input { padding-top: 0; padding-bottom: 0; //font-family: "SimSun", "宋体"; } select, input { vertical-align: middle; } select, input, textarea { font-size: 12px; margin: 0; } textarea { resize: none; } /*防止拖动*/ img { border: 0; vertical-align: middle; max-width: 100% } /* 去掉图片低测默认的3像素空白缝隙*/ table { border-collapse: collapse; } body { font: 12px/150% Arial, Verdana, "\5b8b\4f53"; } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; /*IE/7/6*/ } a { color: #666; text-decoration: none; } /* a:hover { color: #f2ad00; } */ h1, h2, h3, h4, h5, h6 { text-decoration: none; font-weight: normal; font-size: 100%; } s, i, em { font-style: normal; text-decoration: none; } /* IE 浏览器 */ .scrollbar-body-y { /*三角箭头的颜色*/ scrollbar-arrow-color: #0581ab; /*滚动条滑块按钮的颜色*/ scrollbar-face-color: #0581ab; /*滚动条整体颜色*/ scrollbar-highlight-color: #0a393f; /*滚动条阴影*/ scrollbar-shadow-color: #0099dd; /*滚动条轨道颜色*/ scrollbar-track-color: #0a393f; /*滚动条3d亮色阴影边框的外观颜色——左边和上边的阴影色*/ scrollbar-3dlight-color:#0099dd; /*滚动条3d暗色阴影边框的外观颜色——右边和下边的阴影色*/ scrollbar-darkshadow-color: #0099dd; /*滚动条基准颜色*/ scrollbar-base-color: #0581ab; } .scrollbar-body-y { overflow: hidden; overflow-y: auto; } .scrollbar-body-y::-webkit-scrollbar { width: 0.36vw; background-color: rgba(0,204,255,0.3); } .scrollbar-body-y::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0, 204, 255, 0.6); background-color: rgba(0, 204, 255, 0.6); border-radius: 0.18vw; } .scrollbar-body-x { overflow: hidden; overflow-x: auto; } .scrollbar-body-x::-webkit-scrollbar { height: 0.36vw; background-color: rgba(0,204,255,0.3); } .scrollbar-body-x::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0, 204, 255, 0.6); background-color: rgba(0, 204, 255, 0.6); border-radius: 0.18vw; } .swiper-container .swiper-pagination { bottom: 0px !important; } .swiper-container .swiper-pagination .swiper-pagination-bullet { transition: opacity 0.3s; width: 1.04vw; height: 0.21vw; background-color: #1f80da; border-radius: 0.1vw; } .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { opacity: 1; } .is_hover { cursor: pointer; transition: opacity 0.3s; } .is_hover:hover { opacity: 0.8; } .horse_run { background-image: linear-gradient(90deg, rgba(0,204,255,0) 0%, #00ccff 100%), linear-gradient(0deg, #00ccff 0%, rgba(0,204,255,0) 100%), linear-gradient(-90deg, rgba(0,204,255,0) 0%, #00ccff 100%), linear-gradient(0deg, rgba(0,204,255,0) 0%, #00ccff 100%); background-repeat: no-repeat, no-repeat, no-repeat, no-repeat; background-size: 100px 4px, 4px 100px, 100px 4px, 4px 100px; background-position: -100px 1px, calc(100% - 1px) -100px, calc(100% + 100px) calc(100% - 1px), 1px 0px; animation: moveLine 8s infinite linear; height: calc(100% - 2px); padding: 1px; background-clip: content-box; } @keyframes moveLine { 0% { background-position: -100px 1px, calc(100% - 1px) -100px, calc(100% + 100px) calc(100% - 1px), 1px 0px; } 5% { background-position: 0px 1px, calc(100% - 1px) -100px, calc(100% + 100px) calc(100% - 1px), 1px -100px; } 30% { background-position: 100% 1px, calc(100% - 1px) -100px, calc(100% + 100px) calc(100% - 1px), 1px -100px; } 35% { background-position: calc(100% + 100px) 1px, calc(100% - 1px) 0px, calc(100% + 100px) calc(100% - 1px), 1px -100px; } 50% { background-position: calc(100% + 100px) 1px, calc(100% - 1px) 100%, calc(100% + 100px) calc(100% - 1px), -100px -100px; } 55% { background-position: calc(100% + 100px) 1px, calc(100% - 1px) calc(100% + 100px), 100% calc(100% - 1px), -100px calc(100% + 100px); } 80% { background-position: calc(100% + 100px) 1px, calc(100% - 1px) calc(100% + 100px), 0px calc(100% - 1px), 1px calc(100% + 100px); } 85% { background-position: calc(100% + 100px) 1px, calc(100% - 1px) calc(100% + 100px), -100px calc(100% - 1px), 1px 100%; } 100% { background-position: calc(100% + 100px) 1px, calc(100% - 1px) calc(100% + 100px), -100px calc(100% - 1px), 1px 0px; } } @keyframes fadenum{ 0%{transform:rotate(0deg);} 100%{transform:rotate(360deg);} } @keyframes scale{ 0%{transform:scale(1);opacity: 1;} 50%{transform:scale(0.9); opacity: 0.8;} 100%{transform:scale(1);} }