/* ----------------------------------

Main CSS file for BinzhouW
(C) binzhouw Inc.
http://www.binzhouw.com
Created & Modified by HowieRen.

----------------------------------

结构目录：
    1. 重定义浏览器默认样式
    2. 全局常用 CSS 样式
    3. 表单及表单元素
    4. 页面布局以及通用的区块样式
    5. 列表样式
    6. 其他特定功能块
    7. 拖拽及页面 DIY

    *  其他页面专用样式参见 页面样式.css

----------------------------------

CSS 样式模块的格式示例：

    Name:           模块名称
    Level:          级别（Global, Channel, Function）
    Dependent:      依赖关系，该模块必须依赖于何种模块
    Sample:         用法示例，或指出改模块所作用的直接页面
    Explain:        附加说明
    Author:         创建者 日期(两位数年月日时)
    Last Modify:    最终修改者 日期(两位数年月日时)

----------------------------------

CSS 写作注意事项：
    1. 属性写在一行内，属性之间、属性名和值之间以及属性与“{}”之间须有空格，例如：.class { width: 400px; height: 300px; }
    2. 属性的书写顺序：
        2.1. 按照元素模型由外及内，由整体到细节书写，大致分为五组：
            位置：position,left,right,float
            盒模型属性：display,margin,padding,width,height
            边框与背景：border,background
            段落与文本：line-height,text-indent,font,color,text-decoration,...
            其他属性：overflow,cursor,visibility,...
        2.2. 针对特殊浏览器的属性，应写在标准属性之前，例如：-webkit-box-shadow:; -moz-box-shadow:; box-shaow:;
    3. 谨慎添加新的选择符规则，尤其不可滥用 id，尽可能继承和复用已有样式
    4. 选择符、属性、值均用小写（格式的颜色值除外），缩写的选择符名称须说明缩写前的全称，例如 .cl -> Clearfix
    5. 避免使用各种 CSS Hack，如需对 IE 进行特殊定义，请参阅下节“关于 CSS Hack 的说明”
    6. 勿使用冗余低效的 CSS 写法，例如：
        ul li a span { ... }
    7. 慎用 !important
    8. 建议使用在 class/id 名称中的词语
        6.1. 表示状态：a->active
        6.2. 表示结构：h->header,c->content,f->footer
        6.3. 表示区域：mn->main,sd->side,nv-navigation,mu->menu
        6.4. 表示样式：l-list,tab,p_pop
    9. 开发过程中的未定事项，须用 [!] 标出，以便于后续讨论整理

---------------------------------- */

/*
    Name:         mod_reset
    Level:          Global
    Explain:        重定义浏览器默认样式
    Last Modify:    HowieRen 2016-09-03 16:28:44;
*/
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0;min-width: 1200px;}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}[hidden],template{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
    * { word-wrap: break-word; }
    body,input,button,select,textarea {
        font: 12px/1.5 'Microsoft YaHei','微软雅黑',sans-serif,'Segoe UI Emoji','Segoe UI Symbol';
        color: #444;
    }
    textarea { resize: none; }
    body, ul, ol, li, dl, dd, p, h1, h2, h3, h4, h5, h6, form, fieldset, .pr, .pc { margin: 0; padding: 0; }
    table { empty-cells: show; border-collapse: collapse; }
        caption, th { text-align: left; font-weight: 400; }
    ul li, .xl li { list-style: none; }
    h1, h2, h3, h4, h5, h6 { font-size: 1em; }
    em, cite, i { font-style: normal; }
    a { color: #444; text-decoration: none; }
        a:hover { text-decoration:none; }
        a img { border: none; }
    label { cursor: pointer; }
/*
    Name:         mod_reset
    Level:          Global
    Explain:        重定义浏览器默认样式
    Last Modify:    by2 2016-10-22 16:13:02;
*/
input{
	outline:none;
}

.container{ width: 1200px; margin:0 auto;}
/*
    Name:           color
    Level:          Global
    Sample:         class="crw"
    Explain:        灰度等级样式库
    Last Modify:    HowieRen 2016-09-03 16:28:44;
*/
.crw{ color: white;}
.cr3{ color: #333;}
.cr6{ color: #666;}
.cr9{ color: #999;}
.hht a:hover{ color: #ef2d36;}
/*
    Name:           font-size
    Level:          Global
    Sample:         class="fs2"
    Explain:        字号等级样式
    Last Modify:    HowieRen 2016-09-03 16:28:44;
*/
.fs1{ font-size: 12px; }
.fs2{ font-size: 14px; }
.fs3{ font-size: 16px; }
.fs4{ font-size: 18px; }
/*
    Name:          text-align
    Level:          Global
    Sample:         class="tac"
    Explain:        对齐样式
    Last Modify:    HowieRen 2016-09-03 16:28:44;
*/
.tac{ text-align: center; } .tal{text-align: left;} .tar{ text-align: right; }
/*
    Name:           mod_float
    Level:          Global
    Sample:         class="z/y"
    Explain:        .z/.y 浮动 left/right
    Last Modify:    HowieRen 2016-09-03 16:28:44;
*/
    .z { float: left; } .y { float: right; }

/*
    Name:           mod_clearfix
    Level:          Global
    Sample:         class="cl"
    Explain:        Clearfix,避免因子元素浮动而导致的父元素高度缺失能问题
    Last Modify:    HowieRen 2016-09-03 16:28:44;
*/

/*
    Name:           mod_clearfix
    Level:          Global
    Last Modify:    Baiyun 2016-09-24 10:24;
*/

input:focus{ border:solid 1px #ef2d36;}

    .cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .cl { zoom: 1; }
    .dyb{ display: block; } .dyib{ display: inline-block;} .none{ display: none;}
/*
    Name:           margin
    Level:          Global
    Sample:         class="mtn"
    Explain:        边距公共样式
    Last Modify:    HowieRen 2016-09-03 16:28:44;
*/
.mtn{ margin-top: 5px; } .mtm{ margin-top: 10px; } .mtw{ margin-top: 20px;}
.mrn{ margin-right: 5px; } .mrm{ margin-right: 10px; } .mrw{ margin-right: 20px;}
.mbn{ margin-bottom: 5px; } .mbm{ margin-bottom: 10px; } .mbw{ margin-bottom: 20px;}
.mln{ margin-left: 5px; } .mlm{ margin-left: 10px; } .mlw{ margin-left: 20px;}
/*
    Name:           padding
    Level:          Global
    Sample:         class="ptn"
    Explain:        边距公共样式
    Last Modify:    HowieRen 2016-09-03 16:28:44;
*/
.ptn{ padding-top: 5px; } .ptm{ padding-top: 10px; } .ptw{ padding-top: 20px;}
.prn{ padding-right: 5px; } .prm{ padding-right: 10px; } .prw{ padding-right: 20px;}
.pbn{ padding-bottom: 5px; } .pbm{ padding-bottom: 10px; } .pbw{ padding-bottom: 20px;}
.pln{ padding-left: 5px; } .plm{ padding-left: 10px; } .plw{ padding-left: 20px;}
/*
    元素获取焦点时隐藏外边框
*/
    .hidefocus { outline: none; }
/*
    Name:         mod_container
    Level:          Global
    Explain:        全局页宽
    Last Modify:    HowieRen 2016-09-03 16:42:44;
*/
.container-fluid{ width: 90%; min-width: 1200px; margin:0 auto;}
/*
    Name:         mod_top
    Level:          Global
    Explain:        全局top条样式
    Last Modify:    HowieRen 2016-09-03 16:42:44;
*/
.top{ width: 100%; height: 30px; position: relative; background-color:#444; z-index: 4;}
    .topinner li>a{ color: white;  height: 30px; line-height: 30px;}
        .topinner>ul>li{ position: relative; float: left; margin:0 16px;}
        .topinner>ul>li>a{ display: block;}
        .topinner>ul>li>a:hover{ color: #ef2d36;}
        .topinner>.bar{ display: inline-block; }
        .topinner>.bar a{ margin:0 10px;}
        .topinner>.bar .avatar{ display: inline-block; height: 30px;}
            .topinner>.bar .avatar img.avatar-min{ width: 26px; height: 26px; border-radius: 18px; margin-top: 2px;}
        .P-colors>.P-color{ cursor: pointer;}
        .pop-menu{ position: absolute;    left: -50px; padding: 5px 0; margin-left: 50%;  border-radius: 2px; box-shadow: 0 2px 6px 0 rgba(0,0,0,.2); display: none;}
        .pop-menu .qr-txt{ height: 30px; line-height: 30px; background-color: #f2f2f2; }
            .pop-menu:before{ content: ''; position: absolute; top: -5px; left: 50%; margin-left: -5px; width: 10px; height: 10px; background-color: white;-moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); }
        .pop-menu>a{ display: block; height: 34px; line-height: 34px; border-bottom: 1px #f3f3f3 solid;}
         .pop-menu>a:hover{ background-color:#f2f2f2; font-size: 1.1em; }
        .topnav-more{ width: 100px; background-color: white;}
        .topinner>ul>li:hover>.pop-menu{ display: block;}
/*
    Name:         mod_top
    Level:          Global
    Explain:        全局top条样式
    Last Modify:    HowieRen 2016-09-19 19:32:31;
*/
  .mask{margin:0;padding:0;border:none;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:11;position:fixed;top:0;left:0;display:none}
  .css-sprite{background:url(../images/csssprites.png) no-repeat}
  .top-nav{width:100%;margin:0 auto;background:#444;position:relative;height:30px;z-index:2}
  .header{width:100%;background:#fff;padding:20px 0}
  .nav-wrap{width:1200px;position:relative;height:50px;padding:0 11px;box-sizing:border-box;margin:0 auto}
  .logo{float:left;width:350px;overflow:hidden}
  .bigw{-webkit-animation-name:bigw;animation-name:bigw;-webkit-animation-duration:2s;animation-duration:2s}
  .phone-code{display:none;position:absolute;top:29px;left:-1px;padding:15px;background:#fff;width:120px;height:120px;border: 1px solid #e4e1e1;border-top: none;}
  .phone-code .triangle{position:absolute;top:-10px;left:20px}
  .topbar{float:left}
  .topbar li{padding: 0 10px;float:left;font-size:12px;line-height:29px;position:relative;border: 1px solid #444;border-bottom: none;}
  .topbar li a{color:#fff;position:relative;display:block;}
  .topbar li.bar-hover{padding-right:20px;}
  .topbar li:hover a{color:#ef2d36}
  .topbar li.bar-hover:hover{background:#fff;border: 1px solid #e4e1e1;border-bottom: none;}
  .topbar li.bar-hover:hover .phone-code{display:block;}
  .icon-right{display: block;position: absolute;top: 12px;right: -16px;font-size: 24px;width: 14px;height: 6px;overflow: hidden;}
  .icon-right i{position: absolute;top:-15px;left:0;}
  .topbar li:hover .icon-right i{top:-9px;}
  .weather{float:left;cursor:pointer;margin-left:15px;position:relative;word-spacing:0;border:1px solid #444;border-bottom:none;padding:0 10px;font-size:12px;color:#555}
  .today{line-height:29px;color:#fff}
  .today img{margin:-2px 10px 0 0;width:16px;height:16px;vertical-align:middle;display: inline;}
  .today em{font-style:normal}
  .today .wtemp{position:relative;top:1px}
  .quality{background-color:#73d538}
  .quality{margin:0 0 0 10px;padding:0 2px;display:inline-block;border-radius:3px;line-height:16px;color:#fff;background-color:#73d538}
  .weatherbox{border:1px solid #e4e1e1;position:absolute;top:29px;z-index:1000;background:#fff;width:470px;line-height:20px;display:none;border-top:none;left:-1px}
  .weatherbox .air{color:#959595;padding:0 10px;line-height:30px}
  .weatherbox .air .airnum{font-size:16px;vertical-align:middle;font-style:normal;color:#ff552e}
  .weatherbox .wday{padding:10px 0;overflow:hidden;position:relative;left:-1px;zoom:1}
  .weatherbox .wday li{float:left;width:155px;height:156px;text-align:center;border-left:1px solid #e4e1e1}
  .weatherbox .wday img{display:block;width:60px;height:60px;margin:10px auto 5px}
  .weatherbox .prompt{background:#f8f8f8;clear:both;border-top:1px solid #e4e1e1;position:relative;padding:10px}
  .weather:hover{border-color:#eee;background:#fff}
  .weather:hover .today{color:#555}
  .weather:hover .weatherbox{display:block}
  .weatherbox .wsource {
    position: absolute;
    right: 10px;
    top: 0;
	}

.weatherbox .wsource a {
    color: #0ca2eb!important;
    background-position: 0 -554px;
    padding-left: 22px;
}
	.wsource a {
    background: url(../images/minico.png) no-repeat;
}
  .usrbar{float:right;position:relative}
  .usrbar ul{float:left;color:#333}
  .usrbar ul li{float:left;line-height:30px;text-align:center;position:relative;height:30px;margin:0 5px;padding:0 10px;}
  .usrbar ul li.more-wrap{padding:0 20px 0 10px;border:1px solid #444;border-bottom:none;line-height:29px;height:29px;}
  .usrbar ul li.more-wrap a{position:relative;}
  .usrbar ul li.more-wrap:hover .icon-right i{top:-9px;}
  .usrbar ul li.more-wrap:hover a{text-decoration:none;color:#ef2d36}
  .usrbar ul li.more-wrap:hover li a{color:#333;}
  .usrbar ul li.more-wrap:hover{background:#fff;border:1px solid #e4e1e1;border-bottom:none;}
  .usrbar ul li.more-wrap:hover .header-tools{display:block}
  .usrbar .usr-login:hover{background-color:#cd0c0c;background-image:-webkit-gradient(linear,left top,left bottom,from(#cd0c0c),to(#a20000));background-image:-webkit-linear-gradient(top,#cd0c0c,#a20000);background-image:-moz-linear-gradient(top,#cd0c0c,#a20000);background-image:-o-linear-gradient(top,#cd0c0c,#a20000);background-image:-ms-linear-gradient(top,#cd0c0c,#a20000);background-image:linear-gradient(top,#cd0c0c,#a20000)}
  .triangle{width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid #fff;display:block}
  .usrbar ul li a{display:block;color:#fff;font-size:12px;cursor:pointer;}
  .usrbar ul li .header-tools{box-sizing:border-box;border: 1px solid #e4e1e1;border-top: none;top:29px;right:-1px;display:none;position:absolute;z-index:3;}
  .usrbar ul li .header-tools li{width:136px;padding:0 7px;font-size:14px;height:41px;text-align:center;background:#fff;margin:0}
  .usrbar ul li .header-tools li:hover, .usrbar ul li .header-tools li:hover a{background:#e1ecf5}
  .usrbar ul li .header-tools li a{margin:0;color:#232323;display:block;width:100%;height:40px;line-height:40px;border-bottom:1px solid #e0e0e0;padding:0}
  .usrbar ul li .header-tools li:last-child a{border:none}
  .fixed-head{position:fixed;z-index:5;top:0}
  .usrbar .dropdown{float:right;width:24px;height:24px;cursor:pointer; padding:0;margin: 5px 15px 0 10px;overflow:hidden}
  .usrbar .dropdown i{width:24px;height:24px;display:block}
  .drop-icon{background-position:-44px -132px}
  .drop-icon:hover{background-position:-44px -163px}
  .up-icon{display:none;background-position:-80px -132px}
  .up-icon:hover{background-position:-80px -163px}
  .login-sign-box{position:fixed;top:70px;left:50%;margin-left:-205px;background:#fff;width:410px;border:1px solid #000;border-radius:6px;outline:0;-webkit-box-shadow:0 3px 9px rgba(0,0,0,.9);-moz-box-shadow:0 3px 9px rgba(0,0,0,.9);box-shadow:0 3px 9px rgba(0,0,0,.9);display:none}
  .loginbg,.signbg{width:100%;height:140px;overflow:hidden;margin-bottom:36px;background:url(../images/loginbg.png) no-repeat center 40px;background-size: 95px;}
  .close-btn{position:absolute;width:20px;height:20px;top:-8px;right:-8px;background-position:-441px -56px}
  .close-btn:hover{background-position: -441px -81px;}
  .input-box{width:356px;height:auto;overflow:hidden;margin:0 auto}
  .input-group{margin-bottom:15px;display:table-cell;position:relative;float:left;height:70px}
  .input-group span{line-height:30px;color:#ef2d36;display:none}
  .form-control{display:block;width:302px;height:34px;padding:7px 12px 7px 40px;font-size:16px;line-height:34px;color:#999;background-color:#fff;background-image:none;border:1px solid #ccc;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;-o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}
  .login-btn{float:left;width:355px;height:50px;background:#c7000a;display:block;margin:0 auto;border-radius:4px;font-size:20px;color:#fff;line-height:50px;text-align:center}
.login-btn:hover{background:#8f2f2f;color:#fff;border-bottom-left-radius:4px;border-bottom-right-radius:4px}

  .user-password,.user-phone{border-radius:4px}
  .get-code{position:absolute;top:5px;right:10px;width:110px;height:40px;background:#e11515;border:0 none;color:#fff;border-radius:4px;font-size:16px;cursor:pointer}
  .get-code:hover{background:#ef2d36;}
  .forget-password{float:right;color:#ccc;display:block;margin-bottom:15px}
  .forget-password:hover{color:#c7000a}
  .other-logins{width:100%;padding:0 28px;box-sizing:border-box;margin:15px 0}
  .login-title{width:100%;height:30px;background-position:0 -224px;text-align:center;line-height:30px;font-size:16px;color:#999;margin:20px 0}
  .login-style{height:auto;overflow:hidden}
  .login-style ul li{ display:inline-block; text-align:center;font-size:16px;margin:0px 12px;line-height:30px; margin-top:5px;}
  .login-style ul li:hover img{border-radius: 25px; }
  .login-style ul li img{width:35px;}
  .login-style ul li a{color:#999}
  .login-style ul li span{display:block}
  .login-style ul li:hover span{color:#ef2d36}
  .btn-submit{width:100%;border-bottom-left-radius:4px;border-bottom-right-radius:4px;background:#fff;padding:0 28px;box-sizing:border-box;margin-bottom:20px;height:auto;overflow:hidden}

  .sign-btn{width:100%;float:left;text-align:center;line-height:50px;color:#777;font-size:20px;background:#c7000a;color:#fff;border-radius:4px;margin-top:30px}
  .sign-btn:hover{background:#8f2f2f;color:#fff;border-bottom-left-radius:4px;border-bottom-right-radius:4px}
  .other-sign li{width:26.3%}
  .other-logins p a{color:#c7000a;}
  .other-logins p a:hover{color:#f00;}
  .input-group i{position:absolute;left:10px;display:block}
  .phone{width:18px;height:27px;background-position:-126px -132px;top:12px}
  .password{width:18px;height:23px;background-position:-126px -164px;top:12px}
  .code{width:18px;height:23px;background-position:-126px -200px;top:16px}
  .lg-active {
    background-color: #cd0c0c;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#cd0c0c), to(#a20000));
    background-image: -webkit-linear-gradient(top, #cd0c0c, #a20000);
    background-image: -moz-linear-gradient(top, #cd0c0c, #a20000);
    background-image: -o-linear-gradient(top, #cd0c0c, #a20000);
    background-image: -ms-linear-gradient(top, #cd0c0c, #a20000);
    background-image: linear-gradient(top, #cd0c0c, #a20000)
}

/*
    Name:         mod_header
    Level:          Global
    Explain:        全局头部模块
    Last Modify:    HowieRen  2016-09-03 19:07:11;
*/


    header>.container>.logo{margin-right:20px;overflow: hidden;}
    header>.container>.map{ line-height: 40px; color:#999;}
        header>.container>.map>a{ color: #666;}
        header>.container>.map>a:hover{ text-decoration: underline;}

/*
    Level:          Global
    Explain:        少一个“}”
    Last Modify:    by2  2016-10-22 16:11:11;
*/

@-webkit-keyframes bigw {
    0% { width: 150px; }
    100% { width: 300px;}
}
@keyframes bigw {
    0% { width: 150px; }
    100% { width: 300px; }
}

/*
    Level:          Global
    Explain:       返回顶部按钮样式
    Last Modify:    by2  2016-12-06 16:14:11;
*/
.goTop {display: none; position: fixed;width: 50px; height: 48px; background: #fff url(../images/gotop.png) no-repeat 16px 15px;border: solid 1px #f9f9f8; border-radius: 6px;box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); cursor: pointer;  right: 50px; bottom: 50px;}
.goTop:hover { height: 50px; background: #c61621 url(../images/gotop_act.png) no-repeat 16px 15px; background-position: 16px 16px; box-shadow: 0 1px 1px rgba(198, 22, 33, 0.3);  border: 1px solid #c61621; border-radius: 6px;}

/*附件字号*/
.attach-class span,.attach-class p,.attach-class a{font-size: 16px;}