﻿/* 

	七丽WebApp手机移动端公用叠层样式表;
	http://i.7y7.com;

*/
/* font */
@font-face {font-family:'ico';src:url('/Public/Home/qilimobile/fonts/ico20170327.ttf') format('truetype');font-weight:normal;font-style:normal}
[class^="ico-"]:before,[class*="ico-"]:before {font-family:'ico';speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;vertical-align:baseline}
.ico-search:before {content:"\E601"} /* 搜索 */
.ico-toright:before {content:"\E603"} /* 向右 */
.ico-love:before {content:"\E606"} /* 喜欢 */
.ico-browse:before {content:"\E607"} /* 浏览 */
.ico-backup:before {content:"\E60B"} /* 返回顶部 */
.ico-back:before {content:"\E60D"} /* 返回 */
.ico-classify:before {content:"\E60E"} /* 分类 */
.ico-label:before {content:"\E60F"} /* 标签 */
.ico-user:before {content:"\E625"} /* 用户 */
.ico-menu:before {content:"\E626"} /* 菜单 */
.ico-heart:before {content:"\E627"} /* 喜欢 */
.ico-collect:before {content:"\E628"} /* 收藏 */
.ico-share:before {content:"\E629"} /* 分享 */
.ico-packup:before {content:"\E623"} /* 向下 */
.ico-upward:before {content:"\E624"} /* 向上 */
.ico-login-qq:before {content:"\E630"} /* QQ */
.ico-login-wechat:before {content:"\E631"} /* 微信 */
.ico-login-sina:before {content:"\E632"} /* 新浪 */
.ico-thumb-up-on{background-image:url('../images/ico-thumb-up-on.png')}
.ico-thumb-up-half{background-image:url('../images/ico-thumb-up-half.png')}
.ico-thumb-up-default{background-image:url('../images/ico-thumb-up.png')}
.ico-quintessence{background-image:url('../images/icon_quintessence.png')}
.ico-shoppers{background-image:url('../images/icon_shoppers.png')}
.ico-my_cosmetic_bag{background-image:url('../images/my_cosmetic_bag.png')}
.ico-my_7_by{background-image:url('../images/my_7_by.png')}
.ico-my_message{background-image:url('../images/my_message.png')}
.ico-my_trial{background-image:url('../images/my_trial.png')}
.ico-my_address{background-image:url('../images/my_address.png')}
.ico-my_infor{background-image:url('../images/my_infor.png')}
.ico-camera:before {content:"\E633"} /* 相机 */
.ico-asking:before {content:"\E634"} /* 疑问 */
.ico-append:before {content:"\E635"} /* 新添 */
.ico-edit:before {content:"\E636"} /* 编辑 */
.ico-focus:before {content:"\E637"} /* 关注 */

/* reset */
*{margin:0;padding:0;outline:none;background:transparent;border:0 none}
html {-webkit-text-size-adjust:100%;-ms-text-size-adjust:none;font-size:62.5%}
body {color:#333;background:#f2f2f2}
iframe {width:100%;margin:0;padding:0;border:0 none}
body, button, input, select, textarea {margin:0;padding:0;font:1.6rem/1.6 'PingFang SC','Microsoft YaHei',Helvetica,Arial,sans-serif}
article,aside,details,figcaption,figure,footer,header,hgroup,datalist,nav,section,summary,address,mark,ruby {display:block}
ul,ol,li,dl,dt,dd {list-style:none}
h1, h2, h3, h4, h5, h6, strong, em, b {font-weight:700;font-style:normal;font-size:100%}
select,textarea,input,img {resize:none;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none 0}
del {text-decoration:line-through}
.under {text-decoration:underline}
i,samp,dfn,mark,cite,kbd {font-weight:normal;font-style:normal}
blockquote,p,pre,td {word-wrap:break-word;word-break:break-all}
table,tr,th,td {border-spacing:0;border-collapse:collapse;text-indent:0}
img,video,audio {vertical-align:middle;width:100%;background:transparent}
hr {width:100%;height:1px;font:0/0 arial;overflow:hidden;background:#e2e2e2;clear:both}
a,img {-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}
a,a:hover,a:visited,a:active {color:#666;text-decoration:none}
.j_link,.j_link:hover,.j_link:active,.j_link:visited {position:absolute;left:0;top:0;z-index:2;width:100%;height:100%;display:block;float:left;color:transparent}
.j_link_label,.j_link_label:hover,.j_link_label:active,.j_link_label:visited {position:absolute;top:6.5rem;z-index:3;width:auto;height:1.5rem;display:block;float:left;color:transparent}
/* special */
.all {word-wrap:break-word;word-break:break-all;text-justify:auto;text-align:justify}
.ep {width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.model {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.gpu {-webkit-backface-visibility:hidden;-webkit-transform:translateZ(0);-webkit-perspective:1000;-moz-backface-visibility:hidden;-moz-transform:translateZ(0);-moz-perspective:1000;-ms-backface-visibility:hidden;-ms-transform:translateZ(0);-ms-perspective:1000;backface-visibility:hidden;transform:translateZ(0);perspective:1000}
/* float */
.fl {float:left}
.fr {float:right}
.tl {text-align:left}
.tc {text-align:center}
.tr {text-align:right}
.md {vertical-align:middle}
.box {zoom:1;overflow:hidden}
.clear{zoom:1}
.clear:after{content:"";display:block;height:0;font-size:0;clear:both}
.full {width:100%}
.half {width:50%}
.third {width:33.3333%}
.quarter {width:25%}
.auto {float:left;width:100%}
.blank10{content:"";display:block;height:1rem;font-size:0;clear:both}
.wrap {width:100%;max-width:640px;height:0;position:relative;margin:0 auto;overflow:hidden;zoom:1}
/* color */
.black,.black:hover,.black:visited,.black:active {color:#000}
.gray3,.gray3:hover,.gray3:visited,.gray3:active {color:#333}
.gray6,.gray6:hover,.gray6:visited,.gray6:active {color:#666}
.gray9,.gray9:hover,.gray9:visited,.gray9:active {color:#999}
.grayc,.grayc:hover,.grayc:visited,.grayc:active {color:#ccc}
.grayd,.grayd:hover,.grayd:visited,.grayd:active {color:#d2d2d2}
.white,.white:hover,.white:visited,.white:active {color:#fff}
.red,.red:hover,.red:visited,.red:active {color:#ff2b58}
.isred,.isred:hover,.isred:visited,.isred:active {color:#ff6699}
.bright_red,.bright_red:hover,.bright_red:visited,.bright_red:active {color:#f00}
.blue,.blue:hover,.blue:visited,.blue:active {color:#52b6e8}
.brown,.brown:hover,.brown:visited,.brown:active {color:#b98742}
.green,.green:hover,.green:visited,.green:active {color:#34c159}
.pink,.pink:hover,.pink:visited,.pink:active {color:#ff8587}
.orange,.orange:hover,.orange:visited,.orange:active {color:#fca533}
.greenblue,.greenblue:hover,.greenblue:visited,.greenblue:active {color:#1dbd9c}
.bg_white {background:#fff}
.bgray {background:#f2f2f2}
.bg_green {background:#34c159}
.bg_orange {background:#fca533}
.bg_red {background:#f69}
.bg_blue {background:#52b6e8}
/* font */
.f10 {font-size:1rem}
.f11 {font-size:1.1rem}
.f12 {font-size:1.2rem}
.f13 {font-size:1.3rem}
.f14 {font-size:1.4rem}
.f15 {font-size:1.5rem}
.f16 {font-size:1.6rem}
.f30 {font-size:3rem}
/* spacing */
.mgt3 {margin-top:.3rem}
.mgt4 {margin-top:.4rem}
.mgt5 {margin-top:.5rem}
.mgt10 {margin-top:1rem}
.pdb10 {padding-bottom:1rem}
.pdt10 {padding-top:1rem}
.mgt_10 {margin-top:-1rem}
.mgt20 {margin-top:2rem}
.mgt30 {margin-top:3rem}
.mgl5 {margin-left:.5rem} 
.mgl10 {margin-left:1rem}
.mgl15 {margin-left:1.5rem}
.mgl20 {margin-left:2rem} 
.mgr5 {margin-right:.5rem} 
.mgr10 {margin-right:1rem} 
/* btn */
.btn {display:inline-block;height:2.2rem;line-height:2.2rem;font-size:1.4rem;letter-spacing:.1rem;padding:.2rem 1.2rem;white-space:nowrap;overflow:hidden;text-align:center;border:.1rem solid #666;border-radius:.4rem;vertical-align:middle}
.btn.radius {border-radius:100rem}
.btn.btnfull {width:100%;height:3rem;line-height:3rem;-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}
.btn_invalid,.btn_invalid:hover,.btn_invalid:visited,.btn_invalid:active {color:#999;border-color:#ddd;background:#ddd}
.btn_sole,.btn_sole:hover,.btn_sole:visited {color:#f4a100;border-color:#ccc}
.btn_sole:active {color:#e49600;border-color:#bbb}
.btn_linegray,.btn_linegray:hover,.btn_linegray:visited {color:#999;border-color:currentColor}
.btn_linegray:active {color:#666;border-color:currentColor}
.btn_linered,.btn_linered:hover,.btn_linered:visited {color:#ff6699;border-color:currentColor}
.btn_linered:active {color:#ff6699;border-color:currentColor}
.btn_gray,.btn_gray:hover,.btn_gray:visited {background:#a0a0a0;border-color:#a0a0a0;color:white}
.btn_gray:active {color:white;background:#929292}
.btn_red,.btn_red:hover,.btn_red:visited {background:#f69;border-color:#f69;color:white}
.btn_red:active {color:white;background:#fe4583}
/* nothing */
._no_data {padding:4rem 0;text-align:center;font-size:1.5rem;overflow:hidden;zoom:1;width:100%;color:#999}
._no_data i {font-size:6rem}
._no_data img {width:6rem}
._no_data p {margin:0 auto;width:60%}
/* slide */
._slide {overflow:hidden;zoom:1;width:100%;height:0;position:relative;background:#f5f5f5;z-index:0}
._slide .slider {width:100%;height:0;overflow:hidden;margin:0 auto;position:relative;-webkit-transform:translateZ(0);transform:translateZ(0)}
._slide .slider ul {float:left;width:100%;background:#f5f5f5;display:-webkit-box;position:absolute;text-align:center;-webkit-backface-visibility:hidden;-webkit-perspective:1000;backface-visibility:hidden;perspective:1000}
._slide .slider li {width:100%;height:0;display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;overflow:hidden;position:relative}
._slide .slider .btnleft,._slide .slider .btnright {position:absolute;top:50%;margin-top:-20px;display:inline-block;width:40px;height:40px;line-height:40px;text-align:center;color:#fff;border-radius:3px;cursor:pointer;background:rgba(0,0,0,.5) no-repeat}
._slide .slider .btnleft {left:5px}
._slide .slider .btnright {right:5px;background-position:0 -40px}
._slide .slider_status {position:absolute;bottom:5px;width:100%;height:25px;text-align:center;line-height:25px}
._slide .slider_status i {display:inline-block;vertical-align:middle;width:8px;height:8px;border-radius:100px;background:#fff;border:1px rgba(0,0,0,.2) solid;margin:0 5px;font-style:normal}
._slide .slider_status i.sel {border-radius:100px;border:0;background:#f69}
@media all and (orientation:landscape){._slide{background:black}}
/* loading */
.loading {overflow:hidden;height:20px;padding:1rem;text-align:center;line-height:20px;font-size:1.2rem;display:none!important}
.loading.up {position:absolute;top:50%;left:0;margin-top:-10px}
.loading i{display:inline-block;height:20px;padding-left:20px;border-radius:10px;overflow:hidden;vertical-align:top}
.loading i.j-loadmore{background:url(/Public/Home/qilimobile/img/loading.gif) no-repeat 0 50%}
/* popup */
._popup .free {margin:20px 0;width:84%;padding:3%;text-align:center;background:#f00;color:#fff;border-radius:10px;font-size:1.4rem;position:fixed;top:0;left:5%;overflow:hidden}
._popup {overflow:hidden;zoom:1;width:100%;height:100%;position:absolute;left:0;top:0;z-index:9000;background:rgba(0,0,0,.6);color:#000;font-size:15px}
._popup .toload,._popup .layer {overflow:hidden;width:80%;background:white;border-radius:.3rem;position:fixed;_position:absolute;left:10%;top:50%;opacity:0}
._popup .toload {opacity:1;text-align:center;color:black;padding:5% 0;margin-top:-10%}
._popup #_iframe {width:100%}
._popup .full {width:100%}
._popup .half {width:50%}
._popup img {width:100%;display:block}
._popup input[type="text"],._popup textarea {width:100%;border:.1rem solid #ccc;padding:2%;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;font-size:1.4rem;line-height:1.4}
._popup textarea {height:3rem}
._popup .image{position:fixed;bottom:10%;left:10%;width:80%}
._popup .doc {float:left;width:90%;padding:5%;overflow:hidden;text-align:center}
._popup .doc h2 {display:block;width:100%;height:50px;margin-top:-6%;font-size:1.4rem;line-height:50px;font-weight:normal}
._popup .doc simu-h2{height:1.3rem;overflow:hidden;zoom:1;font:0/0 Arial;margin-top:-6%}
._popup .doc .cont {overflow:hidden;zoom:1;position:relative;text-align:left;font-size:1.4rem}
._popup .btnbox {float:left;width:100%;height:48px;border-top:.1rem solid #f5f5f5;overflow:hidden;font-size:16px;border-radius:.3rem}
._popup .btnbox a {float:left;height:48px;background:#fff;line-height:48px;overflow:hidden;text-align:center;color:#999}
._popup .btnbox a+a{margin-left:-.1rem;border-left:.1rem solid #f5f5f5;color:#009bfe}
._popup .btnbox a.full{color:#009bfe}
._popup .btnbox a.full+a.full {border-top:1px solid #f5f5f5;color:#999}
@media screen and (orientation: landscape) {._popup .free{width:50%;left:25%}._popup .layer {width:50%;left:25%}._popup img {width:50%;margin:0 auto}._popup .image{width:30%;left:35%}}
/* cue */
._cue {position:fixed;top:0;left:0;z-index:9001;width:100%;height:100%;text-align:center}
._cue span {display:inline-block;max-width:80%;font-size:1.4rem;padding:.5rem 1rem;background:rgba(0,0,0,.8);border-radius:1rem;color:white;margin-top:35rem;opacity:0}
/* 下拉菜单 */
._popup .floatbar{height:100%;float:right}
._popup .floatbar>.inner{background:#fff;height:100%;position:relative;overflow:auto}
._popup .floatbar ul{margin:0 2rem 0 2.4rem;height:100%;background:#fff;width:100%;border-left:2px solid #d2d2d2}
._popup .floatbar li{height:4.2rem;padding-left:1.7rem;line-height:4.2rem;position:relative}
._popup .floatbar h2{display:block;height:4.2rem;width:100%;background:#fff;border-bottom:1px solid #d2d2d2;text-indent:2.4rem;color:#999;font-weight:normal;line-height:4.2rem}
._popup .floatbar li i{display:block;position:absolute;top:50%;left:-.8rem;-webkit-transform:translateY(-50%);width:1.4rem;height:1.4rem;border:1px solid #d7d7d7;background:#fff;border-radius:100px}
._popup .floatbar li a.greenblue i{border-width:2px;border-color:#1bbc9b;left:-.9rem;text-align:center;line-height:1.4rem}
._popup .floatbar li a.greenblue i b{display:inline-block;margin-top:-.2rem;width:.7rem;height:.7rem;background:#1bbc9b;font:0/0 arial;border-radius:100px;vertical-align:middle}

/* 顶部 */
header {position:relative;width:100%;height:4.4rem;background:#fff;border-bottom:1px solid #e2e2e2;color:#666;font-size:1.4rem;line-height:4.4rem;text-align:center}
header:after {content:"";display:block;height:0;font-size:0;clear:both}
header span {position:absolute;top:0;left:0;height:4.4rem;font-size:1.5rem}
header span.rti {left:auto;right:0;border:none 0}
header p{float:left;padding-left:13rem;color:#666}
header a,header dfn,header cite {display:inline-block;height:4.4rem;padding:0 1.5rem}
header p a{padding:0 .2rem}
header span b{display:block;float:right;margin:1rem 0 0 0;overflow:hidden;height:2.6rem;width:1px;background:#ccc;font:0/0 arial}
header img{width:9rem;background:transparent}
/* 公用搜索 */
.searchBar{display:none;height:4.4rem;padding:0 1rem;background:#fff;overflow:hidden;width:100%;float:left;-webkit-box-sizing:border-box;border-bottom:1px solid #e2e2e2;position:absolute;top:4.5rem;left:0;}
.searchBar cite {display:inline-block;height:4.2rem;padding:0 1rem;line-height:4.4rem}
.search_input_box {float:left;width:100%;height:2.9rem;margin:.5rem 0 0;border:1px solid #e2e2e2;border-radius:.4rem;overflow:hidden}
.search_input_box cite {height:2.9rem;line-height:3rem;padding:0 .5rem}
.search_input_box input {float:left;width:90%;height:2.9rem;font-size:1.4rem;text-indent:1rem;background:transparent}
.search_input_box input::-webkit-input-placeholder{color:#ccc}
.search_input_box .ico-search {float:left}
/* 返回顶部 */
.wrap .magnet {position:fixed;bottom:1.5rem;right:-5rem;width:4rem;z-index:10}
.wrap .magnet a {display:inline-block;width:4rem;height:4rem;border-radius:100px;line-height:4rem;text-align:center;background:rgba(0,0,0,.3);color:white;margin-top:.5rem}
.wrap .magnet.bigsteps{width:auto;}
.wrap .magnet.bigsteps a{float:left;background:#595959;margin-left:.5rem}
/* 仿ios联动选项 */
.select-dialog.olay{position:absolute;z-index:500;top:0;left:0;width:100%;height:100%;opacity:1;background:rgba(0, 0, 0, 0.75)}
.select-dialog.olay .select-box{position:fixed;bottom:0;left:0;width:100%;height:100%;background-color:#f2f2f2;/*-webkit-transform: translateY(500px);*/-webkit-transition: transform .3s ease-in}
.select-dialog.olay .select-box.sel{-webkit-transform:translateY(0px)}
.select-dialog .btnbox {overflow:hidden;height:44px;padding:0 10px;-webkit-box-sizing:border-box;line-height:44px;background-color:#fff;text-align:center}
.select-dialog .btnbox a {display:block;margin-top:7px;width:76px;height:44px;font-size:12px;text-decoration:none;height:30px;line-height:30px}
.select-dialog .btnbox a.sure{float:right;background-color:#ff6699;color:#fff}
.select-dialog .btnbox a.close{float:left;background-color:#d2d2d2;color:#333}
.select-dialog {padding-top:44px}
.select-dialog .one-level-contain,.select-dialog .two-level-contain,.select-dialog .three-level-contain{height:100%;overflow:hidden;-webkit-mask-box-image:-webkit-linear-gradient(bottom,transparent,transparent 30%,#fff 40%,#fff 60%,transparent 70%,transparent);-webkit-mask-box-image:linear-gradient(top,transparent,transparent 30%,#fff 40%,#fff 60%,transparent 70%,transparent)}
.select-dialog section {overflow:hidden}
.select-dialog section > div {display:block;float:left;margin-top:-70px}
.select-dialog ul {background-color:#fff}
.select-dialog ul li {font-size:13px;height:35px;line-height:35px;background-color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;color:#111;opacity:.3}
.select-dialog ul li.now {font-size:16px;opacity:1}
.select-dialog ul li.side1 {font-size:14px;opacity:.7}
.select-dialog ul li.side2 {font-size:12px;opacity:.5}
.select-dialog.one-level-box .one-level-contain {width:100%}
.select-dialog.two-level-box .one-level-contain,.select-dialog.two-level-box .two-level-contain {width:50%}
.select-dialog.two-level-box .three-level-contain{width:0}
.select-dialog.three-level-box .one-level-contain,.select-dialog.three-level-box .two-level-contain {width:30%}
.select-dialog.three-level-box .three-level-contain{width:40%}
.select-dialog .mark-line1 {width:100%;border:none;border-top:1px solid #d9d9d9;position:absolute;top:79px;margin:0;height:0}
.select-dialog .mark-line2 {width:100%;border:none;border-top:1px solid #d9d9d9;position: absolute;top:114px;margin:0;height:0}
.select-dialog #iosSelectTitle {margin:0;padding:0;display:inline-block;font-size:16px;font-weight:normal;color:#333}
/* 上传input美化 */
.btn_addPic{display:block;position:absolute;top:0;left:0;z-index:3;width:100%;height:6rem;overflow:hidden;background:transparent;color:#7f7f7f;cursor:pointer;text-align:center;line-height:6rem} 
.btn_addPic span{display:block;width:100%;height:100%;background:transparent;color:transparent;font:0/0 arial}
.filePrew{display:block;position:absolute;top:0;left:0;width:100%;height:100%;font-size:100rem;opacity:0;filter:alpha(opacity=0)} 
.upImage p{float:left;width:100%;height:6rem;background:#fff;overflow:hidden;margin:0 1.3% .5rem 0;-webkit-box-sizing:border-box;box-sizing:border-box}
.upImage p:nth-child(4n){margin-right:0}
/* 表单提示美化 */
.fill_i_infor.other li .y_txt::-webkit-input-placeholder,
.fill_i_infor.feedback .y_atxt::-webkit-input-placeholder,
.xinde_i_form .y_atxt::-webkit-input-placeholder{color:#ccc}

/* iPhone < 5 */
@media screen and (min-device-aspect-ratio:2/3){.re_slider{height:16rem}}
/* iPhone 5 */
@media screen and (device-aspect-ratio: 40/71){.re_slider{height:16rem}}