@charset"utf-8"; /* 公共样式 */ body{ overflow-x: hidden; } html{ font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } *{ margin:0; padding:0; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary{ display: block; } body, button, input, select, textarea { font-family: 'Arial','微软雅黑'; font-size: 14px; } h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dd, form, label, input, textarea{ margin: 0; } h1, h2, h3, h4, h5, h6{ font-weight: unset; } ul, ol{ list-style: none outside none; } img{ border: none; } .imgDiv img{ width: 100%; display: block; } a{ text-decoration: none; cursor: pointer; } a:hover, a:focus, a:active{ outline: none; text-decoration: none; } :focus{ outline: none !important; } input, select, textarea{ appearance: none; -webkit-appearance: none; -moz-appearance: none; border: 0; outline: none; line-height: normal; border-radius: 0; } input:-moz-placeholder, textarea:-moz-placeholder{ color: #ccc; } input::-moz-placeholder, textarea::-moz-placeholder{ color: #ccc; } input:-ms-input-placeholder, textarea:-ms-input-placeholder{ color: #ccc; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{ color: #ccc; } input[type="button"], input[type="submit"]{ cursor: pointer; } video{ width: 100%; } @font-face { font-family: 'iconfont'; src: url('../fonts/iconfont.eot'); src: url('../fonts/iconfont.eot') format('embedded-opentype'), url('../fonts/iconfont.woff2') format('woff2'), url('../fonts/iconfont.woff') format('woff'), url('../fonts/iconfont.ttf') format('truetype'), url('../fonts/iconfont.svg#iconfont') format('svg'); } .iconfont{ font-family: 'iconfont'; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; display: inline-block; vertical-align: middle; position: relative; } /* 汉堡导航 */ .navToggle{ width: 30px; height: 30px; display: inline-block; font-size: 0; cursor: pointer; display: none; } .navToggle:before{ content: ""; display: inline-block; vertical-align: middle; height: 100%; width: 0; } .navToggle .icon, .navToggle .icon:after, .navToggle .icon:before{ -webkit-transition: all .3s linear 0s; -moz-transition: all .3s linear 0s; transition: all .3s linear 0s; } .navToggle .icon{ width: 100%; height: 2px; display: inline-block; vertical-align: middle; background-color: #000000; } .navToggle .icon:after, .navToggle .icon:before{ content: ""; width: 30px; height: 2px; display: inline-block; background-color: #000000; position: relative; } .navToggle .icon:before{ top: -10px; } .navToggle .icon:after{ bottom: -8px; } .navToggle.active .icon{ width: 0; } .navToggle.active .icon:before{ top: -5px; -webkit-transform: translateY(4px) rotate(45deg); transform: translateY(4px) rotate(45deg); -ms-transform: translateY(4px) rotate(45deg); } .navToggle.active .icon:after{ top: -7px; -webkit-transform: translateY(4px) rotate(-45deg); transform: translateY(4px) rotate(-45deg); -ms-transform: translateY(4px) rotate(-45deg); } /* input */ .inp{ position: relative; } .inp input{ width: 100%; height: 100%; } .inp input[disabled="disabled"]{ background-color: #f7f7f7; } .inp label{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: text; } /* float */ .ovh{ overflow: hidden; } .cl:after{ content: ""; clear: both; display: block; } .fl{ float: left; } .fr{ float: right; } .clear{ clear: both; } /* position */ .rel{ position: relative; } .abs{ position: absolute; } /* text-align*/ .tc{ text-align: center; } .tl{ text-align: left; } .tr{ text-align: right; } .ab { display: flex; display: -webkit-flex; display: -ms-flex; }