@charset "UTF-8"; /* * QWSS * author:Jacob * date:2016-09-01 */ /* * @Author: wenyu * @Date: 2016-12-19 11:21:40 * @Email: wangwenyu@qwang.com.cn * @Last Modified by: Marte * @Last Modified time: 2017-06-29 19:55:17 */ /* * @Author: wenyu * @Date: 2016-12-19 16:42:18 * @Email: wangwenyu@qwang.com.cn * @Last Modified by: wenyu * @Last Modified time: 2017-01-05 17:17:01 */ /* 两列定宽布局 */ /* 两列右侧自适应布局 */ /* 两列左侧自适应布局 */ /* 三列右侧自适应布局 */ /* 三列左侧自适应布局 */ /* 三列中间自适应布局 */ /* 等分布局 */ /* Here is the foundation layout,we use the 'g-' named after. * just like g-hd ==> head g-bd ==> body g-ft ==> footer */ /* clearfix */ .g-row:before, .g-row:after, .g-container:before, .g-container:after, .g-box:before, .g-box:after, .m-topbar:before, .m-topbar:after, .m-head:before, .m-head:after, .clearfix:before, .clearfix:after, .m-components:before, .m-components:after { display: table; content: " "; } .g-row:after, .g-container:after, .g-box:after, .m-topbar:after, .m-head:after, .clearfix:after { clear: both; } /* The container layout * This is a page's outer package container,We use the 1200px width to set the pagewidth */ /* 全屏布局 */ .g-container { width: 100%; } /* 全屏中间定宽布局 */ .g-box { width: 1200px; margin: 0 auto; } .col-row-4 .g-box { width: auto; } /* 两列定宽布局 */ .g-bd { width: 1200px; margin: 0 auto; } .g-bd .g-sd { float: right; width: 300px; } .g-bd .g-mn { float: left; width: 100px; } .g-bd:before, .g-bd:after { display: table; content: " "; } .g-bd:after { clear: both; } /* 两列右侧自适应布局 */ .g-sd1 { position: relative; float: left; width: 200px; margin-right: -200px; } .g-mn1 { float: right; width: 100%; } .g-mn1c { margin-left: 200px; } .g-bd1:before, .g-bd1:after { display: table; content: " "; } .g-bd1:after { clear: both; } /*新增布局*/ .g-xsd2 { position: relative; float: left; width: 285px; margin-right: -285px; } .g-xmn2 { float: right; width: 100%; } .g-xmn2c { margin-left: 285px; } .g-xbd2:before, .g-xbd2:after { display: table; content: " "; } .g-xbd2:after { clear: both; } /* 两列左侧自适应布局 */ .g-sd2 { position: relative; float: right; width: 265px; margin-left: -265px; } .g-mn2 { float: left; } .g-mn2c { margin-right: 265px; } .g-bd2:before, .g-bd2:after { display: table; content: " "; } .g-bd2:after { clear: both; } /* 三列右侧自适应布局 */ .g-sd31, .g-sd32 { position: relative; float: left; width: 190px; } .g-sd31 { width: 190px; margin-right: 0px; } .g-mn3 { float: right; width: 100%; margin-left: -380px; } .g-mn3c { margin-left: 380px; } .g-bd3:before, .g-bd3:after { display: table; content: " "; } .g-bd3:after { clear: both; } /* 三列左侧自适应布局 */ .g-sd41, .g-sd42 { position: relative; float: right; width: 190px; } .g-sd41 { width: 190px; margin-left: 0px; } .g-mn4 { float: left; width: 100%; margin-right: -380px; } .g-mn4c { margin-right: 380px; } .g-bd4:before, .g-bd4:after { display: table; content: " "; } .g-bd4:after { clear: both; } /* 三列中间自适应布局 */ .g-sd51, .g-sd52 { position: relative; float: left; width: 190px; margin: 0 -190px 0 0; } .g-sd52 { float: right; width: 190px; margin: 0 0 0 -190px; } .g-mn5 { float: left; width: 100%; } .g-mn5c { margin: 0 190px 0 190px; } .g-bd5:before, .g-bd5:after { display: table; content: " "; } .g-bd5:after { clear: both; } /* 简易栅格布局 */ .g-row { zoom: 1; margin-left: -5px; margin-right: -5px; *margin-left: 0; *margin-right: 0; } .col-row-1 { width: 8.33333%; float: left; min-height: 1px; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; position: relative; box-sizing: border-box; } .col-row-1:before, .col-row-1:after { display: table; content: " "; } .col-row-1:after { clear: both; } .col-row-2 { width: 16.66667%; float: left; min-height: 1px; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; position: relative; box-sizing: border-box; } .col-row-2:before, .col-row-2:after { display: table; content: " "; } .col-row-2:after { clear: both; } .col-row-3 { width: 25%; float: left; min-height: 1px; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; position: relative; box-sizing: border-box; } .col-row-3:before, .col-row-3:after { display: table; content: " "; } .col-row-3:after { clear: both; } .col-row-4 { width: 33.33333%; float: left; min-height: 1px; position: relative; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; box-sizing: border-box; } .col-row-4:before, .col-row-4:after { display: table; content: " "; } .col-row-4:after { clear: both; } .col-row-5 { width: 41.66667%; float: left; min-height: 1px; position: relative; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; box-sizing: border-box; } .col-row-5:before, .col-row-5:after { display: table; content: " "; } .col-row-5:after { clear: both; } .col-row-6 { width: 50%; float: left; min-height: 1px; /*position: relative;*/ padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; box-sizing: border-box; } .col-row-6:before, .col-row-6:after { display: table; content: " "; } .col-row-6:after { clear: both; } .col-row-7 { width: 58.33333%; float: left; min-height: 1px; position: relative; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; box-sizing: border-box; } .col-row-7:before, .col-row-7:after { display: table; content: " "; } .col-row-7:after { clear: both; } .col-row-8 { width: 66.66667%; float: left; min-height: 1px; position: relative; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; box-sizing: border-box; } .col-row-8:before, .col-row-8:after { display: table; content: " "; } .col-row-8:after { clear: both; } .col-row-9 { width: 75%; float: left; min-height: 1px; position: relative; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; box-sizing: border-box; } .col-row-9:before, .col-row-9:after { display: table; content: " "; } .col-row-9:after { clear: both; } .col-row-10 { width: 83.33333%; float: left; min-height: 1px; position: relative; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; box-sizing: border-box; } .col-row-10:before, .col-row-10:after { display: table; content: " "; } .col-row-10:after { clear: both; } .col-row-11 { width: 91.66667%; float: left; min-height: 1px; position: relative; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; box-sizing: border-box; } .col-row-11:before, .col-row-11:after { display: table; content: " "; } .col-row-11:after { clear: both; } .col-row-12 { width: 100%; float: left; min-height: 1px; position: relative; /* padding-left: 5px; padding-right: 5px; box-sizing: border-box; */;} .col-row-12:before, .col-row-12:after { display: table; content: " "; } .col-row-12:after { clear: both; } .col-row-f-5 { width: 20%; float: left; min-height: 1px; position: relative; padding-left: 5px; padding-right: 5px; *padding-left: 0; *padding-right: 0; box-sizing: border-box; } .col-row-f-5:before, .col-row-f-5:after { display: table; content: " "; } .col-row-f-5:after { clear: both; } /* function */ .f-cb:after, .f-cbli li:after { display: block; clear: both; visibility: hidden; height: 0; overflow: hidden; content: "."; } .f-cb, .f-cbli li { zoom: 1; } .f-ib { display: inline-block; *display: inline; *zoom: 1; } .f-dn { display: none; } .f-db { display: block !important; } .f-fl { float: left; } .f-fr { float: right; } .f-pr { position: relative; } .f-prz { position: relative; zoom: 1; } .f-oh { overflow: hidden; } .f-fs1 { font-size: 12px; } .f-fs2 { font-size: 14px; } .f-fs3 { font-size: 16px; } .f-fs4 { font-size: 18px; } .f-fwn { font-weight: normal; } .f-fwb { font-weight: bold; } .f-tal { text-align: left; } .f-tac { text-align: center; } .f-tar { text-align: right; } .f-taj { text-align: justify; text-justify: inter-ideograph; } .f-vam, .f-vama * { vertical-align: middle; } .f-wsn { word-wrap: normal; white-space: nowrap; } .f-pre { overflow: hidden; text-align: left; white-space: pre-wrap; word-wrap: break-word; word-break: break-all; } .f-wwb { white-space: normal; word-wrap: break-word; word-break: break-word; } .f-ti { overflow: hidden; text-indent: -30000px; } .f-ti2 { text-indent: 2em; } .f-lhn { line-height: normal; } .f-lh18 { line-height: 18px; } .f-lh20 { line-height: 20px; } .f-lh22 { line-height: 22px; } .f-lh24 { line-height: 24px; } .f-tdu, .f-tdu:hover { text-decoration: underline; } .f-tdn, .f-tdn:hover, .f-tdn:visited, .f-tdn:focus { text-decoration: none; } .f-toe { overflow: hidden; word-wrap: normal; white-space: nowrap; text-overflow: ellipsis; } .f-csp { cursor: pointer; } .f-csd { cursor: default; } .f-csh { cursor: help; } .f-csm { cursor: move; } .f-cna { cursor: not-allowed; } .f-usn { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } .f-bd-no { border: none !important; } .f-clr-gre { color: #07ad03; } .f-clr-red { color: #c52620; } .f-clr-blue { color: #0a5eea; } .f-clr-yel { color: #f90; } .f-clr-ora { color: #d50; } .f-clr-light { color: #999; } .f-clr-normal { color: #666; } .f-clr-dark { color: #333; } .f-rm-mar { margin: 0 !important; } .f-rm-mar-t { margin-top: 0 !important; } .f-rm-mar-r { margin-right: 0 !important; } .f-rm-mar-b { margin-bottom: 0 !important; } .f-rm-mar-l { margin-left: 0 !important; } .f-rm-pdg { padding: 0 !important; } .f-rm-pdg-t { padding-top: 0 !important; } .f-rm-pdg-r { padding-right: 0 !important; } .f-rm-pdg-b { padding-bottom: 0 !important; } .f-rm-pdg-l { padding-left: 0 !important; } .f-push-5 { margin-bottom: 5px !important; } .f-push-5-t { margin-top: 5px !important; } .f-push-5-r { margin-right: 5px !important; } .f-push-5-l { margin-left: 5px !important; } .f-push-10 { margin-bottom: 10px !important; } .f-push-10-t { margin-top: 10px !important; } .f-push-10-r { margin-right: 10px !important; } .f-push-10-l { margin-left: 10px !important; } .f-push-15 { margin-bottom: 15px !important; } .f-push-15-t { margin-top: 15px !important; } .f-push-15-r { margin-right: 15px !important; } .f-push-15-l { margin-left: 15px !important; } .f-push-20 { margin-bottom: 20px !important; } .f-push-20-t { margin-top: 20px !important; } .f-push-20-r { margin-right: 20px !important; } .f-push-20-l { margin-left: 20px !important; } .f-push-30 { margin-bottom: 30px !important; } .f-push-30-t { margin-top: 30px !important; } .f-push-30-r { margin-right: 30px !important; } .f-push-30-l { margin-left: 30px !important; } .f-push-40 { margin-bottom: 40px !important; } .f-push-40-t { margin-top: 40px !important; } .f-push-40-r { margin-right: 40px !important; } .f-push-40-l { margin-left: 40px !important; } .f-push-50 { margin-bottom: 50px !important; } .f-push-50-t { margin-top: 50px !important; } .f-push-50-r { margin-right: 50px !important; } .f-push-50-l { margin-left: 50px !important; } .f-pdg-5 { padding-bottom: 5px !important; } .f-pdg-5-t { padding-top: 5px !important; } .f-pdg-5-r { padding-right: 5px !important; } .f-pdg-5-l { padding-left: 5px !important; } .f-pdg-10 { padding-bottom: 10px !important; } .f-pdg-10-t { padding-top: 10px !important; } .f-pdg-10-r { padding-right: 10px !important; } .f-pdg-10-l { padding-left: 10px !important; } .f-pdg-15 { padding-bottom: 15px !important; } .f-pdg-15-t { padding-top: 15px !important; } .f-pdg-15-r { padding-right: 15px !important; } .f-pdg-15-l { padding-left: 15px !important; } .f-pdg-20 { padding-bottom: 20px !important; } .f-pdg-20-t { padding-top: 20px !important; } .f-pdg-20-r { padding-right: 20px !important; } .f-pdg-20-l { padding-left: 20px !important; } .f-pdg-30 { padding-bottom: 30px !important; } .f-pdg-30-t { padding-top: 30px !important; } .f-pdg-30-r { padding-right: 30px !important; } .f-pdg-30-l { padding-left: 30px !important; } .f-pdg-40 { padding-bottom: 40px !important; } .f-pdg-40-t { padding-top: 40px !important; } .f-pdg-40-r { padding-right: 40px !important; } .f-pdg-40-l { padding-left: 40px !important; } .f-pdg-50 { padding-bottom: 50px !important; } .f-pdg-50-t { padding-top: 50px !important; } .f-pdg-50-r { padding-right: 50px !important; } .f-pdg-50-l { padding-left: 50px !important; }