You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1179 lines
22 KiB
CSS
1179 lines
22 KiB
CSS
5 years ago
|
|
||
|
/** * 基本样式 * @author 鹿文学*/
|
||
|
/* common*/
|
||
|
html {
|
||
|
margin:0;
|
||
|
padding:0;
|
||
|
font-family:'Microsoft YaHei','微软雅黑',Tahoma,Verdana,Arial,'宋体',sans-serif;
|
||
|
font-size:62.5%;
|
||
|
color:#333;
|
||
|
overflow-x:hidden;
|
||
|
margin: 0 auto;
|
||
|
max-width: 640px;
|
||
|
}
|
||
|
img {
|
||
|
/*height: 100%;*/
|
||
|
width: 100%;
|
||
|
border: none;
|
||
|
vertical-align: middle;
|
||
|
position: relative;
|
||
|
z-index: 2;
|
||
|
}
|
||
|
ol,ul {
|
||
|
list-style:none;
|
||
|
padding:0;
|
||
|
margin:0;
|
||
|
}
|
||
|
a {
|
||
|
text-decoration:none;
|
||
|
color:inherit;
|
||
|
}
|
||
|
body {
|
||
|
background:#EDEDED;
|
||
|
margin:0;
|
||
|
font-size:1.4rem;
|
||
|
overflow-x:hidden;
|
||
|
/*-webkit-touch-callout: none;*/
|
||
|
-webkit-text-size-adjust: none;
|
||
|
/*-webkit-user-select: none;*/
|
||
|
-webkit-highlight: none;
|
||
|
overflow:auto;
|
||
|
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||
|
max-width:640px;
|
||
|
margin:0 auto;
|
||
|
}
|
||
|
.clearfix {
|
||
|
zoom:1
|
||
|
}
|
||
|
.clearfix:after {
|
||
|
content:"";
|
||
|
display:block;
|
||
|
height:0;
|
||
|
font-size:0;
|
||
|
clear:both;
|
||
|
overflow:hidden
|
||
|
}
|
||
|
.inner {
|
||
|
width:640px;
|
||
|
margin:0 auto;
|
||
|
position:relative;
|
||
|
}
|
||
|
.hidden {
|
||
|
display:none!important;
|
||
|
}
|
||
|
input,select,button,textarea {
|
||
|
outline: none;
|
||
|
font-size: 1.4rem;
|
||
|
font-family: inherit;
|
||
|
-webkit-appearance: none;
|
||
|
border: none;
|
||
|
color: #18b1ea;
|
||
|
width:50%;
|
||
|
box-sizing:border-box;
|
||
|
padding: 0.6rem;
|
||
|
border-radius: 20px;
|
||
|
}
|
||
|
input:-webkit-autofill,textarea:-webkit-autofill,select:-webkit-autofill {
|
||
|
background-color:#FFF;
|
||
|
background-image:none;
|
||
|
-webkit-box-shadow:0 0 0px 10000px white inset;
|
||
|
box-shadow:0 0 0px 10000px white inset;
|
||
|
margin:0;
|
||
|
}
|
||
|
/* head*/
|
||
|
.header {
|
||
|
width:100%;
|
||
|
z-index:99;
|
||
|
position:fixed;
|
||
|
top:0;
|
||
|
background:#18B1EA;
|
||
|
color:#FFF;
|
||
|
max-width:640px;
|
||
|
margin:0 auto;
|
||
|
}
|
||
|
.header>div {
|
||
|
position:relative;
|
||
|
}
|
||
|
.header .caption {
|
||
|
margin:0 6rem;
|
||
|
display:block;
|
||
|
position:relative;
|
||
|
text-align:center;
|
||
|
font-weight:normal;
|
||
|
height:3rem;
|
||
|
font-size:2.5rem;
|
||
|
padding:1rem 1rem;
|
||
|
text-overflow:ellipsis;
|
||
|
overflow:hidden;
|
||
|
white-space:nowrap;
|
||
|
}
|
||
|
.header .hbtn {
|
||
|
width:6rem;
|
||
|
height:5rem;
|
||
|
position:absolute;
|
||
|
top:0;
|
||
|
display:block;
|
||
|
text-align:center;
|
||
|
}
|
||
|
.header .hbtn .iconfont {
|
||
|
font-size:3.6rem;
|
||
|
color:#FFF;
|
||
|
margin:.8rem 0;
|
||
|
display:block;
|
||
|
}
|
||
|
.header .back,.header .person,.header .sign {
|
||
|
left:0;
|
||
|
}
|
||
|
.header .share,.header .download,.header .searchbtn,.header .addbtn,.header .set {
|
||
|
right:0;
|
||
|
}
|
||
|
.header .download .number {
|
||
|
background:red;
|
||
|
border-radius:100%;
|
||
|
width:2rem;
|
||
|
height:2rem;
|
||
|
line-height:2rem;
|
||
|
display:block;
|
||
|
font-style:normal;
|
||
|
color:#FFF;
|
||
|
position:absolute;
|
||
|
top:.6rem;
|
||
|
right:1rem;
|
||
|
text-overflow:ellipsis;
|
||
|
overflow:hidden;
|
||
|
white-space:nowrap;
|
||
|
}
|
||
|
.header .searchbtn {
|
||
|
color:#FFF;
|
||
|
font-size:2rem;
|
||
|
padding:1.2rem 0;
|
||
|
}
|
||
|
.header .searchwrap .search {
|
||
|
margin:0 6rem;
|
||
|
display:block;
|
||
|
position:relative;
|
||
|
text-align:center;
|
||
|
}
|
||
|
.header .searchwrap .search .text {
|
||
|
box-sizing:border-box;
|
||
|
-webkit-sizing:border-box;
|
||
|
width:100%;
|
||
|
border:none;
|
||
|
background:rgba(255,255,255,.4);
|
||
|
border-radius:4rem;
|
||
|
padding:.5rem 1.5rem .5rem 4rem;
|
||
|
margin:.7rem 0;
|
||
|
height:3.2rem;
|
||
|
}
|
||
|
.header .searchwrap .search .btn {
|
||
|
position:absolute;
|
||
|
top:0.9rem;
|
||
|
left:.9rem;
|
||
|
}
|
||
|
.header .searchwrap .search .btn .iconfont {
|
||
|
font-size:3rem;
|
||
|
color:#FFF;
|
||
|
}
|
||
|
.searchpage .header .searchwrap .search .text {
|
||
|
margin:.7rem 0 1.15rem;
|
||
|
}
|
||
|
.header .addbtn {
|
||
|
color:#FFF;
|
||
|
font-size:1.8rem;
|
||
|
padding:1.3rem 0;
|
||
|
width:10rem;
|
||
|
}
|
||
|
.occupy {
|
||
|
height:5rem;
|
||
|
}
|
||
|
/**/
|
||
|
.emptybg {
|
||
|
background:#FFF;
|
||
|
height:100vh;
|
||
|
}
|
||
|
.empty {
|
||
|
padding-top:25vh;
|
||
|
text-align:center;
|
||
|
}
|
||
|
.empty img {
|
||
|
width:20vw;
|
||
|
}
|
||
|
.empty p {
|
||
|
color:#999;
|
||
|
font-size:1.6rem;
|
||
|
}
|
||
|
.loading {
|
||
|
text-align:center;
|
||
|
/*background:#E7E7E7;*/
|
||
|
background:#fff; /*加载更多变成白色背景*/
|
||
|
padding:1rem 0;
|
||
|
}
|
||
|
.table {
|
||
|
display:table;
|
||
|
width:100%;
|
||
|
height:100%;
|
||
|
}
|
||
|
.table-row {
|
||
|
display:table-row;
|
||
|
}
|
||
|
.table-cell,.tcell {
|
||
|
display:table-cell;
|
||
|
position:relative;
|
||
|
text-align:center;
|
||
|
vertical-align: middle;
|
||
|
}
|
||
|
|
||
|
/*分享按钮 begin*/
|
||
|
.share_icon{
|
||
|
display: inline-block;
|
||
|
height: 2rem;
|
||
|
width: 2rem;
|
||
|
background: url(../images/icon_normal_zhuanfa@3x.png) no-repeat center center;
|
||
|
background-size: 100% 100%;
|
||
|
}
|
||
|
|
||
|
/*end 分享按钮*/
|
||
|
share_icon
|
||
|
/* foot*/
|
||
|
.space {
|
||
|
height:6rem;
|
||
|
width:100%;
|
||
|
}
|
||
|
.footer {
|
||
|
position:fixed;
|
||
|
bottom:0;
|
||
|
background:#F6F6F6;
|
||
|
width:100%;
|
||
|
z-index:10000;
|
||
|
max-height:13.5vw;
|
||
|
border-top:1px solid #E7E7E7;
|
||
|
max-width:640px;
|
||
|
margin:0 auto;
|
||
|
}
|
||
|
.footer .nav {
|
||
|
position:relative;
|
||
|
}
|
||
|
.footer .nav li {
|
||
|
float:left;
|
||
|
width:20%;
|
||
|
text-align:center;
|
||
|
color:#777;
|
||
|
}
|
||
|
.footer .nav .item {
|
||
|
display:block;
|
||
|
}
|
||
|
.footer .nav .item .iconfont {
|
||
|
font-size:2.6rem;
|
||
|
padding:.4rem 0 0;
|
||
|
display:block;
|
||
|
}
|
||
|
.footer .nav .item span {
|
||
|
display:block;
|
||
|
padding-bottom:.2rem;
|
||
|
}
|
||
|
.footer .nav .item:hover,.footer .nav .item.active {
|
||
|
color:#18B1EA;
|
||
|
}
|
||
|
.pop-window {
|
||
|
display:none;
|
||
|
-webkit-overflow-scrolling: touch;
|
||
|
overflow:hidden;
|
||
|
position:fixed;
|
||
|
top:0;
|
||
|
left:0;
|
||
|
bottom:0;
|
||
|
right:0;
|
||
|
width:100vw;
|
||
|
height:100vh;
|
||
|
z-index:999;
|
||
|
background:rgba(0,0,0,.2);
|
||
|
}
|
||
|
|
||
|
.pop-window .pop-box,.pop-hint-gift .pop-box {
|
||
|
position:relative;
|
||
|
top:26%;
|
||
|
margin:0 auto 0;
|
||
|
width:80vw;
|
||
|
background:#FFF;
|
||
|
border-radius:10px;
|
||
|
max-width:293px;
|
||
|
}
|
||
|
.pop-window .pop-page {position:relative;margin:0 auto;width:100%;height:100%;background:#FFF;top:-11vw;}
|
||
|
.pop-window .pop-box .pop-wrap {
|
||
|
padding:5vw 7vw;
|
||
|
padding: 1rem 2rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-title {
|
||
|
position:relative;
|
||
|
margin:0;
|
||
|
color:#707070;
|
||
|
font-size:2.7rem;
|
||
|
font-weight:normal;
|
||
|
text-align:center;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap.gift .pop-table{
|
||
|
table-layout: fixed;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap.gift .code-txt {
|
||
|
color:#18b1ea;
|
||
|
display: block;width:100%;
|
||
|
white-space: nowrap;
|
||
|
overflow: hidden;
|
||
|
text-overflow: ellipsis;
|
||
|
}
|
||
|
/* .pop-window .pop-box .pop-wrap .pop-title span {
|
||
|
color:#18B1EA;
|
||
|
}*/
|
||
|
.pop-window .pop-box .pop-wrap .pop-close {
|
||
|
position:absolute;
|
||
|
right:-1rem;
|
||
|
top:-1rem;
|
||
|
font-size:2.2rem;
|
||
|
color:#999;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-content {
|
||
|
color:#999;
|
||
|
font-size:1.8rem;
|
||
|
position:relative;
|
||
|
margin-top:.2rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-content .des {
|
||
|
color:#666;
|
||
|
display:block;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox {
|
||
|
overflow:hidden;
|
||
|
clear:both;
|
||
|
position:relative;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-btn {
|
||
|
width:45%;
|
||
|
text-align:center;
|
||
|
padding:.4rem 0;
|
||
|
font-size:2.6rem;
|
||
|
border-radius:4rem;
|
||
|
display:block;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-cancel {
|
||
|
color:#707070;
|
||
|
border:1px solid #F1F1F1;
|
||
|
float:left;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-confirm {
|
||
|
color:#FFF;
|
||
|
background:#18B1EA;
|
||
|
border:1px solid #18B1EA;
|
||
|
float:right;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-confirm.disabled {
|
||
|
background:#CCC;
|
||
|
border-color:#CCC;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-input {
|
||
|
padding:.8rem 0rem .8rem 8rem;
|
||
|
width:100%;
|
||
|
box-sizing:border-box;
|
||
|
-webkit-box-sizing:border-box;
|
||
|
color:#18B1EA;
|
||
|
border:none;
|
||
|
border-radius:2rem;
|
||
|
font-size:3rem;
|
||
|
line-height:1;
|
||
|
vertical-align: middle;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-span {
|
||
|
width: 205px;
|
||
|
box-sizing: border-box;
|
||
|
-webkit-box-sizing: border-box;
|
||
|
color: #18B1EA;
|
||
|
font-size: 2rem;
|
||
|
line-height: 3rem;
|
||
|
vertical-align: middle;
|
||
|
overflow-x: scroll;
|
||
|
display: inline-block;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .prefix {
|
||
|
position:absolute;
|
||
|
left:.5rem;
|
||
|
top:0rem;
|
||
|
font-size:1.6rem;
|
||
|
display:block;
|
||
|
text-align: left;
|
||
|
vertical-align:middle;
|
||
|
line-height: 3rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-copy {
|
||
|
background:#18B1EA;
|
||
|
color:#FFF;
|
||
|
box-sizing:border-box;
|
||
|
-webkit-box-sizing:border-box;
|
||
|
position:absolute;
|
||
|
top:0;
|
||
|
right:0;
|
||
|
height:100%;
|
||
|
width:7rem;
|
||
|
font-size:2rem;
|
||
|
text-align:center;
|
||
|
padding-top:.8rem;
|
||
|
border-top-right-radius:2rem;
|
||
|
border-bottom-right-radius:2rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-textarea {
|
||
|
width:100%;
|
||
|
height:26vh;
|
||
|
padding:.4rem;
|
||
|
font-size:1.5rem;
|
||
|
border:1px solid #DCDCDC;
|
||
|
box-sizing:border-box;
|
||
|
-webkit-box-sizing:border-box;
|
||
|
}
|
||
|
.totalnum {
|
||
|
position:absolute;
|
||
|
bottom:-1.2rem;
|
||
|
right:.3rem;
|
||
|
font-size:1.2rem;
|
||
|
}
|
||
|
.pop-dialog {
|
||
|
display:none;
|
||
|
position:fixed;
|
||
|
z-index:1999;
|
||
|
top:0;
|
||
|
left:0;
|
||
|
right:0;
|
||
|
text-align:center;
|
||
|
width:100vw;
|
||
|
height:100vh;
|
||
|
}
|
||
|
.pop-dialog span {
|
||
|
background:rgba(0,0,0,.6);
|
||
|
top:50%;
|
||
|
color:#FFF;
|
||
|
display:inline-block;
|
||
|
line-height:2;
|
||
|
position:relative;
|
||
|
padding:.5rem 2rem;
|
||
|
word-break:break-all;
|
||
|
max-width:60vw;border-radius: 5px;
|
||
|
}
|
||
|
.pop-table {
|
||
|
display:table;
|
||
|
width:100%;
|
||
|
position:relative;
|
||
|
}
|
||
|
.pop-row {
|
||
|
display:table-row;
|
||
|
position:relative;
|
||
|
}
|
||
|
.pop-cell {
|
||
|
display:table-cell;
|
||
|
position:relative;
|
||
|
vertical-align:middle;
|
||
|
}
|
||
|
.pop-cell.pop-mark{
|
||
|
width:24%;text-align:right;
|
||
|
}.pop-cell.pop-input { text-align:left;}
|
||
|
.pop-form {
|
||
|
display:none;
|
||
|
-webkit-overflow-scrolling: touch;
|
||
|
overflow:hidden;
|
||
|
position:fixed;
|
||
|
top:0;
|
||
|
left:0;
|
||
|
bottom:0;
|
||
|
right:0;
|
||
|
width:100vw;
|
||
|
height:100vh;
|
||
|
z-index:999;
|
||
|
background:rgba(0,0,0,.5);
|
||
|
}
|
||
|
.pop-form .pop-box {
|
||
|
position:relative;
|
||
|
top:28%;
|
||
|
margin:0 auto 0;
|
||
|
width:90vw;
|
||
|
background:#FFF;
|
||
|
border-radius:3vw;
|
||
|
}
|
||
|
.pop-form .pop-box .pop-wrap {
|
||
|
padding:4vw 6vw 6vw;
|
||
|
}
|
||
|
.pop-form .pop-box .pop-wrap form {
|
||
|
padding:1px;
|
||
|
}
|
||
|
.pop-form .pop-box .pop-wrap .pop-content {
|
||
|
position:relative;
|
||
|
width:100%;
|
||
|
}
|
||
|
.pop-form .pop-title {
|
||
|
position:relative;
|
||
|
margin:0;
|
||
|
color:#707070;
|
||
|
font-size:3.4rem;
|
||
|
font-weight:100;
|
||
|
text-align:center;
|
||
|
}
|
||
|
.pop-form .pop-box .pop-wrap .pop-close {
|
||
|
position:absolute;
|
||
|
right:0rem;
|
||
|
top:0rem;
|
||
|
font-size:2.2rem;
|
||
|
color:#999;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap {
|
||
|
padding-top:1.7rem;
|
||
|
width:100%;
|
||
|
position:relative;
|
||
|
overflow:hidden;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table {
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell {
|
||
|
height:6rem;
|
||
|
font-size:2.2rem;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell:first-child {
|
||
|
width:3.5rem;
|
||
|
white-space: nowrap;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell:last-child {
|
||
|
text-align:right;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell .pgood {
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell p {
|
||
|
margin:0;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-row~.pop-row {
|
||
|
border-top:1px solid rgba(231,231,231,.5);
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .paddress {
|
||
|
font-size:0.48rem;
|
||
|
width:88%;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .paddress {
|
||
|
text-align: left;
|
||
|
float: right;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .paddress span {
|
||
|
display:block;
|
||
|
text-overflow:ellipsis;
|
||
|
overflow:hidden;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell .icon-right {
|
||
|
position:absolute;
|
||
|
top:34.3%;
|
||
|
right:0.2rem;
|
||
|
width:0.3rem;
|
||
|
height:0.54rem;
|
||
|
display:block;
|
||
|
}
|
||
|
.pop-form .pop-butn-box {
|
||
|
padding-top:0.58rem;
|
||
|
}
|
||
|
.pop-form .pop-butn-box .butn {
|
||
|
width:100%;
|
||
|
-webkit-appearance:none;
|
||
|
font-size:3rem;
|
||
|
color:#FFF;
|
||
|
display:inline-block;
|
||
|
padding:0.6rem 0;
|
||
|
background:#18B1EA;
|
||
|
border-radius:3rem;
|
||
|
border:none;
|
||
|
margin:0;
|
||
|
}
|
||
|
.pop-message,.pop-message-gift,.pop-cue,.pop-notice,.pop-hint,.pop-share,.pop-prompt,.pop-prompt2,.pop-form,.pop-bind,.pop-login,.pop-pay,.pop-pay-temp,.pop-partir,.pop-bookmark,.pop-load,.pop-hint-gift {display:none;position:fixed;z-index:1999;top:0;left:0;right:0;text-align:center;width:100vw;height:100vh;}
|
||
|
.pop-message .pop-box {background:rgba(0,0,0,.84);position:relative;color:#FFF;display:inline-block;position:relative;word-break:break-all;border-radius:0.2rem;width:4.64rem;height:4.64rem;}
|
||
|
.pop-message .pop-box .pop-image {width:1.94rem;height:1.4rem;margin-top:1.12rem;}
|
||
|
.pop-message .pop-box .pop-text {margin:0.76rem 0 0;font-size:0.52rem;color:#FFF;}
|
||
|
.pop-message>span{display: table;width: 100%;
|
||
|
height: 100%;}
|
||
|
.pop-message .pop-box2 {
|
||
|
width: 10rem;
|
||
|
margin: 0 auto;
|
||
|
background: #000;
|
||
|
color: #fff;
|
||
|
height: 4rem;
|
||
|
border-radius: .6rem;
|
||
|
font-size: 1.8rem;
|
||
|
line-height: 4rem;
|
||
|
}
|
||
|
.pop-message .pop-box2.pop-picture {
|
||
|
height: 10rem;
|
||
|
line-height: 1.4;
|
||
|
}
|
||
|
.pop-message .pop-box2.pop-picture .pop-image {
|
||
|
width: 7rem;
|
||
|
height: 7rem;margin: 0 auto;
|
||
|
}
|
||
|
.pop-hint-gift .pop-box .pop-wrap {
|
||
|
padding-left: 3vw;
|
||
|
padding-right: 3vw;
|
||
|
}
|
||
|
.pop-hint-gift .pop-box .pop-wrap .pop-close {
|
||
|
width: 1.5rem;
|
||
|
height: 1.5rem;right:0;
|
||
|
}
|
||
|
.pop-hint-gift .pop-text {
|
||
|
line-height: 1.8;
|
||
|
}
|
||
|
.pop-hint-gift .pop-text-first {
|
||
|
padding-top: .5rem;
|
||
|
font-size: 1.15em;color:#333;
|
||
|
}
|
||
|
.pop-hint-gift .pop-code {
|
||
|
border:1px solid #eee;
|
||
|
border-radius: 4rem;
|
||
|
margin-top: 1rem;
|
||
|
overflow: hidden;
|
||
|
}
|
||
|
.pop-hint-gift .pop-butn {
|
||
|
width: 20%;
|
||
|
background: #18B1EA;
|
||
|
color: #FFF;
|
||
|
}
|
||
|
.pop-hint-gift .pop-mark {
|
||
|
width: 26%;
|
||
|
}
|
||
|
.pop-hint-gift .pop-input .pop-txt {
|
||
|
width:98%;
|
||
|
}
|
||
|
.pop-message-gift>span {
|
||
|
display: table;
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
text-align: center;
|
||
|
}
|
||
|
.pop-message-gift .pop-box2 {
|
||
|
width: 7rem;
|
||
|
height: 7rem;
|
||
|
margin: 0 auto;
|
||
|
background: #333;
|
||
|
border-radius: 1rem;
|
||
|
}
|
||
|
.pop-message-gift .pop-image {
|
||
|
width: 4rem;
|
||
|
height: 4rem;
|
||
|
padding-top: .5rem;
|
||
|
}
|
||
|
.pop-message-gift .pop-text {
|
||
|
color: #FFF;
|
||
|
}
|
||
|
|
||
|
|
||
|
@media screen and (max-width:550px) {
|
||
|
.pop-window .pop-box .pop-wrap .pop-title,.pop-form .pop-title {
|
||
|
font-size:2.5rem;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell {
|
||
|
font-size:2rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-btn,.pop-form .pop-butn-box .butn {
|
||
|
font-size:2.5rem;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell {
|
||
|
height:5rem;
|
||
|
}
|
||
|
}
|
||
|
@media screen and (max-width:450px) {
|
||
|
.header .caption {
|
||
|
font-size:2.2rem;
|
||
|
height:2.8rem;
|
||
|
margin:0 4rem;
|
||
|
}
|
||
|
.header .hbtn .iconfont {
|
||
|
font-size:3.2rem;
|
||
|
margin:1rem 0;
|
||
|
}
|
||
|
.header .person .iconfont {
|
||
|
font-size:3.2rem;
|
||
|
margin:.7rem 0;
|
||
|
}
|
||
|
.occupy {
|
||
|
height:4.8rem;
|
||
|
}
|
||
|
.header .searchwrap .search .text {
|
||
|
height:2.8rem;
|
||
|
}
|
||
|
.header .searchwrap .search .btn .iconfont {
|
||
|
font-size:2.5rem;
|
||
|
}
|
||
|
.header .searchbtn {
|
||
|
font-size:1.8rem;
|
||
|
padding:1rem 0;
|
||
|
}
|
||
|
.header .addbtn {
|
||
|
font-size:1.6rem;
|
||
|
width:8rem;
|
||
|
}
|
||
|
.searchpage .header .searchwrap .search .text {
|
||
|
height:3rem;
|
||
|
margin:.8rem 0 1.05rem;
|
||
|
}
|
||
|
.searchpage .header .searchwrap .search .btn {
|
||
|
top:1.25rem;
|
||
|
}
|
||
|
.empty p {
|
||
|
font-size:1.4rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-title,.pop-form .pop-title {
|
||
|
font-size:2.3rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-content {
|
||
|
font-size:1.6rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-btn,.pop-form .pop-butn-box .butn {
|
||
|
font-size:2rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-input, .pop-window .pop-box .pop-wrap .pop-btnbox .pop-copy {
|
||
|
font-size:2.4rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .prefix {
|
||
|
font-size:1.5rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-input {
|
||
|
padding: .6rem 0.8rem .6rem 5.8rem;
|
||
|
width: 100%;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .prefix {
|
||
|
left:0rem;
|
||
|
padding-top:1rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .prefixa {
|
||
|
font-size:1.5rem;
|
||
|
left:0rem;
|
||
|
padding-top:0.8rem;
|
||
|
vertical-align: middle;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-copy {
|
||
|
width:6rem;
|
||
|
padding-top:.6rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-textarea {
|
||
|
font-size:1.4rem;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell {
|
||
|
font-size:1.8rem;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell {
|
||
|
height:4rem;
|
||
|
}
|
||
|
}
|
||
|
@media screen and (max-width:400px) {
|
||
|
.pop-window .pop-box .pop-wrap .pop-content {
|
||
|
font-size:1.4rem;
|
||
|
}
|
||
|
.footer .nav .item .iconfont {
|
||
|
font-size:2.4rem;
|
||
|
padding:.3rem 0 0;
|
||
|
}
|
||
|
.footer .nav .item span {
|
||
|
font-size:1.3rem;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell {
|
||
|
font-size:1.6rem;
|
||
|
}
|
||
|
}
|
||
|
@media screen and (max-width:350px) {
|
||
|
.header .hbtn {
|
||
|
width:4rem;
|
||
|
}
|
||
|
.header .caption {
|
||
|
font-size:2rem;
|
||
|
height:2.2rem;
|
||
|
margin:0 4rem;
|
||
|
}
|
||
|
.header .hbtn .iconfont {
|
||
|
font-size:3rem;
|
||
|
margin:.7rem 0;
|
||
|
}
|
||
|
.header .person .iconfont {
|
||
|
margin:.6rem 0;
|
||
|
}
|
||
|
.occupy {
|
||
|
height:4.2rem;
|
||
|
}
|
||
|
.header .download .number {
|
||
|
right:.2rem;
|
||
|
width:1.6rem;
|
||
|
height:1.6rem;
|
||
|
line-height:1.6rem;
|
||
|
font-size:1.2rem;
|
||
|
}
|
||
|
.header .searchwrap .search .text {
|
||
|
height:2.6rem;
|
||
|
}
|
||
|
.header .searchwrap .search .btn .iconfont {
|
||
|
font-size:2.4rem;
|
||
|
}
|
||
|
.header .addbtn {
|
||
|
font-size:1.4rem;
|
||
|
width:6rem;
|
||
|
}
|
||
|
.searchpage .header .searchwrap .search .text {
|
||
|
margin:.8rem 0;
|
||
|
}
|
||
|
.searchpage .header .searchwrap .search .btn {
|
||
|
top:1.1rem;
|
||
|
}
|
||
|
.space {
|
||
|
height:4.7rem;
|
||
|
}
|
||
|
.footer .nav .item .iconfont {
|
||
|
font-size:2.2rem;
|
||
|
padding:.2rem 0 0;
|
||
|
}
|
||
|
.footer .nav .item span {
|
||
|
font-size:1.2rem;
|
||
|
}
|
||
|
.empty p {
|
||
|
font-size:1.2rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-title,.pop-form .pop-title {
|
||
|
font-size:2rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-content {
|
||
|
font-size:1.2rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-btn,.pop-form .pop-butn-box .butn {
|
||
|
font-size:1.6rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-input, .pop-window .pop-box .pop-wrap .pop-btnbox .prefix, .pop-window .pop-box .pop-wrap .pop-btnbox .pop-copy {
|
||
|
font-size:1.4rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-input {
|
||
|
width:100%;
|
||
|
padding:.6rem 0.8rem .6rem 5.8rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .prefix {
|
||
|
left:0rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-btnbox .pop-copy {
|
||
|
width:5rem;
|
||
|
padding-top:.6rem;
|
||
|
}
|
||
|
.pop-window .pop-box .pop-wrap .pop-textarea {
|
||
|
font-size:1.2rem;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell {
|
||
|
font-size:1.4rem;
|
||
|
}
|
||
|
.pop-form .pop-table-wrap .pop-table .pop-cell {
|
||
|
height:3rem;
|
||
|
}
|
||
|
}
|
||
|
/*浮动层*/
|
||
|
.float_contact {
|
||
|
position: fixed;
|
||
|
bottom: -60px;
|
||
|
z-index: 999;
|
||
|
left: 10px;
|
||
|
display:none;
|
||
|
}
|
||
|
|
||
|
.float_contact .float-bg {
|
||
|
width: 50px;
|
||
|
height:50px;
|
||
|
background: url(../images/btn_normal_kefu@2x.png) no-repeat center center;
|
||
|
background-size: 100% 100%;
|
||
|
position: absolute;
|
||
|
top: 0;
|
||
|
left: 0;
|
||
|
z-index: 3;
|
||
|
}
|
||
|
.float_contact ul {
|
||
|
width: 52px;
|
||
|
height: 171px;
|
||
|
padding-top: 14px;
|
||
|
}
|
||
|
.float_contact ul li {
|
||
|
float: left;
|
||
|
width: 100%;
|
||
|
margin-bottom: 11px;
|
||
|
position: relative;
|
||
|
}
|
||
|
.float_contact ul li a {
|
||
|
width: 100%;
|
||
|
height: 39px;
|
||
|
display: inline-block;
|
||
|
float: left;
|
||
|
position: relative;
|
||
|
z-index: 9;
|
||
|
}
|
||
|
.float_contact .kf_pic {
|
||
|
visibility: hidden;
|
||
|
opacity: 0;
|
||
|
transition: 0.3s;
|
||
|
width: 120px;
|
||
|
height: 30px;
|
||
|
padding: 10px 20px;
|
||
|
background-color: #fff;
|
||
|
border-radius: 6px;
|
||
|
position: absolute;
|
||
|
left: -180px;
|
||
|
top: 0px;
|
||
|
box-shadow: 0 0 7px rgba(0, 0, 0, 0.2);
|
||
|
z-index: 4;
|
||
|
}
|
||
|
.float_contact .kf_pic:after {
|
||
|
width: 0;
|
||
|
height:0;
|
||
|
}
|
||
|
.float_contact .kf_pic a {
|
||
|
width: 100%;
|
||
|
}
|
||
|
.float_contact .kf_pic img {
|
||
|
vertical-align: middle;
|
||
|
}
|
||
|
.float_contact .kf_pic span {
|
||
|
width: 30px;
|
||
|
height: 30px;
|
||
|
display: inline-block;
|
||
|
float: left;
|
||
|
margin-right: 5px;
|
||
|
margin: 5px 5px 0 10px;
|
||
|
}
|
||
|
.float_contact .kf_pic b {
|
||
|
padding-top: 25px;
|
||
|
line-height: 31px;
|
||
|
font-size: 16px;
|
||
|
color: #3c3c3c;
|
||
|
}
|
||
|
.float_contact .kf_pic .arrow {
|
||
|
display: inline-block;
|
||
|
border-width: 20px;
|
||
|
border-top:10px solid transparent;
|
||
|
border-bottom: 10px solid transparent;
|
||
|
border-left: 10px solid #ffffff;
|
||
|
position: absolute;
|
||
|
right: -10px;
|
||
|
top: 12px;
|
||
|
|
||
|
}
|
||
|
.float_contact .kf_pic .arrow {
|
||
|
border-top:10px solid transparent;
|
||
|
border-bottom: 10px solid transparent;
|
||
|
border-left: 10px solid #ffffff;
|
||
|
position: absolute;
|
||
|
right: -10px;
|
||
|
top: 12px;
|
||
|
margin-left: -10px;
|
||
|
}
|
||
|
|
||
|
.float_contact .wx_pic,.float_contact .down_pic,.float_contact .pop_pic {
|
||
|
visibility: hidden;
|
||
|
opacity: 0;
|
||
|
transition: 0.3s;
|
||
|
width: 200px;
|
||
|
height: 195px;
|
||
|
background-color: #fff;
|
||
|
border-radius: 6px;
|
||
|
position: absolute;
|
||
|
left: -200px;
|
||
|
top: -20px;
|
||
|
box-shadow: 0 0 7px rgba(0, 0, 0, 0.2);
|
||
|
z-index: 4;
|
||
|
}
|
||
|
|
||
|
.wx_pic_text{
|
||
|
display: block;
|
||
|
text-align:center;
|
||
|
color:#999999;
|
||
|
}
|
||
|
.down_pic_text{
|
||
|
text-align:center;
|
||
|
color:#999999;
|
||
|
}
|
||
|
.wx_pic_text font{
|
||
|
color:#4badff;
|
||
|
}
|
||
|
.float_contact .down_pic{
|
||
|
|
||
|
text-align:center;
|
||
|
}
|
||
|
.float_contact .pop_pic{
|
||
|
height: 87px;
|
||
|
text-align:center;
|
||
|
padding:20px 0;
|
||
|
line-height:20px;
|
||
|
}
|
||
|
.float_contact .pop_pic_btn{
|
||
|
display:block;
|
||
|
height:35px;
|
||
|
width:80px;
|
||
|
background:#4badff;
|
||
|
line-height:35px;
|
||
|
|
||
|
margin:15px 0 0 65px;
|
||
|
color:#ffffff;
|
||
|
border-radius:5px;
|
||
|
}
|
||
|
.float_contact .wx_pic img, .float_contact .down_pic img {
|
||
|
width: 170px;
|
||
|
border-radius: 6px;
|
||
|
margin-left:15px;
|
||
|
}
|
||
|
.float_contact .down_pic img{
|
||
|
margin-left:0px;
|
||
|
}
|
||
|
.float_contact .wx_pic .arrow, .float_contact .down_pic .arrow,.float_contact .pop_pic .arrow {
|
||
|
display: inline-block;
|
||
|
border-top:10px solid transparent;
|
||
|
border-bottom: 10px solid transparent;
|
||
|
border-left: 10px solid #ffffff;
|
||
|
position: absolute;
|
||
|
right: -10px;
|
||
|
top: 12px;
|
||
|
}
|
||
|
.float_contact .rz_pic {
|
||
|
visibility: hidden;
|
||
|
opacity: 0;
|
||
|
transition: 0.3s;
|
||
|
position: absolute;
|
||
|
width: 142px;
|
||
|
height: 210px;
|
||
|
left: -85px;
|
||
|
bottom: -42px;
|
||
|
}
|
||
|
.float_contact .rz_pic .close {
|
||
|
width: 18px;
|
||
|
height: 18px;
|
||
|
display: inline-block;
|
||
|
cursor: pointer;
|
||
|
position: absolute;
|
||
|
bottom: 70px;
|
||
|
right: 47px;
|
||
|
z-index: 10;
|
||
|
}
|
||
|
.float_contact .rz_pic .rz-bg1 {
|
||
|
position: absolute;
|
||
|
top: 0;
|
||
|
left: 0;
|
||
|
z-index: 2;
|
||
|
cursor: pointer;
|
||
|
}
|
||
|
.float_contact .rz_pic .rz-bg2 {
|
||
|
position: absolute;
|
||
|
top: 0;
|
||
|
left: 0;
|
||
|
z-index: 8;
|
||
|
cursor: pointer;
|
||
|
}
|
||
|
|
||
|
.float_contact ul .active {
|
||
|
opacity: 1;
|
||
|
visibility: visible;
|
||
|
left: -211px;
|
||
|
}
|
||
|
.float_contact .kf .active {
|
||
|
opacity: 1;
|
||
|
visibility: visible;
|
||
|
left: -171px;
|
||
|
}
|
||
|
.float_contact .rz .active {
|
||
|
opacity: 1;
|
||
|
visibility: visible;
|
||
|
left: -96px;
|
||
|
}
|
||
|
|
||
|
@media (min-width: 300px) {
|
||
|
body {
|
||
|
width: 100%;
|
||
|
height:auto;
|
||
|
background: url(../images/bg.jpg) no-repeat ;
|
||
|
background-size: 100%;
|
||
|
background-attachment:fixed;
|
||
|
}
|
||
|
.float_contact {
|
||
|
display:block;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
@media screen and (min-width: 769px) {
|
||
|
.float_contact {
|
||
|
display:none;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
/*@author zwm*/
|
||
|
.zclearfix:after{
|
||
|
content:"";
|
||
|
height:0;
|
||
|
line-height:0;
|
||
|
display:block;
|
||
|
visibility:hidden;
|
||
|
clear:both;
|
||
|
}
|
||
|
.zclearfix{
|
||
|
zoom:1;
|
||
|
}
|
||
|
.zdiv_copy{
|
||
|
width: 100%;
|
||
|
margin-top: 0.5rem;
|
||
|
}
|
||
|
.zdiv_copy .copy.pop-btn{
|
||
|
font-size: 1.5rem;
|
||
|
color: #fff;
|
||
|
background-color: #18b1ea;
|
||
|
padding: 0.3rem 1rem;
|
||
|
border-radius: 0.3rem;
|
||
|
display: block;
|
||
|
width: 8rem;
|
||
|
margin: 0 auto;
|
||
|
text-align: center;
|
||
|
}
|
||
|
.code.pop-txt{
|
||
|
width:90%;
|
||
|
}
|
||
|
|
||
|
.za_icon1{
|
||
|
float: left;
|
||
|
position:relative;
|
||
|
display:inline-block;
|
||
|
height:4.4rem;
|
||
|
width:4.4rem;
|
||
|
border-radius: 12px;
|
||
|
background-color: #e2e2e2;
|
||
|
overflow: hidden;
|
||
|
}
|
||
|
.dis_tab1{
|
||
|
position: absolute;
|
||
|
z-index: 0;
|
||
|
top: 1.5rem;
|
||
|
left: 0;
|
||
|
display: table;
|
||
|
width: 4.4rem;
|
||
|
height: 4.4rem;
|
||
|
text-align: center;
|
||
|
vertical-align: middle;
|
||
|
font-size: 16px;
|
||
|
color: #bababa;
|
||
|
table-layout: fixed;
|
||
|
background-color: #e2e2e2;
|
||
|
}
|
||
|
.dis_tabcell1{
|
||
|
display: table-cell;
|
||
|
vertical-align: middle;
|
||
|
}
|
||
|
.dis_tabcell1 div{
|
||
|
overflow:hidden;
|
||
|
text-overflow:ellipsis;
|
||
|
white-space:nowrap;
|
||
|
font-size:12px;
|
||
|
}
|
||
|
.trunker{
|
||
|
margin-bottom:59px;
|
||
|
background-color:#fff;
|
||
|
min-height:80vh;
|
||
|
}
|
||
|
@media screen and (min-width: 769px) {
|
||
|
.pop-window{
|
||
|
max-width:640px;
|
||
|
margin: 0 auto;
|
||
|
}
|
||
|
.pop-box.comment{
|
||
|
max-width:600px;
|
||
|
}
|
||
|
.pop-window .pop-box{max-width:530px;} /*.pop-window .pop-box .pop-wrap { padding:12% 8%; }*/
|
||
|
}
|