/************************************************************************
*************************************************************************
*************************************************************************
=========================================================================
* @ description: zcity 鍩庡競鑱斿姩缁勪欢
* @ author: kennen
* @ update: kennen(2017.11.01)
=========================================================================
*************************************************************************
*************************************************************************
*************************************************************************/
/***************************************
* name: reset
* tips: 娴忚鍣ㄩ噸缃
****************************************/

/*scrollbar 璋锋瓕娴忚鍣ㄦ粴鍔ㄦ潯鏍峰紡璁剧疆*/  
::-webkit-scrollbar{width:16px;height:16px;}  
::-webkit-scrollbar-track,  
::-webkit-scrollbar-thumb{border-radius:999px;border:4px solid transparent;}  
::-webkit-scrollbar-track{box-shadow:1px 1px 5px rgba(185,165,150,.2) inset;}  
::-webkit-scrollbar-thumb{min-height:20px;background-clip:content-box;box-shadow: 0 0 0 5px rgba(185,165,150,1) inset;}  
::-webkit-scrollbar-corner{/*background:transparent;*/}
/****************************************
* name:zcity
* tips:鍩庡競閫夋嫨
****************************************/
.zcityGroup{display: flex;justify-content: space-between;}
.zcityGroup .zcityItem{position:relative;z-index:0;width: 48%;}
.zcityGroup .zcityItem .zcityItem-head{border:1px solid #eee;border-radius:3px;position:relative;z-index:0;padding:0 15px 0 0px;background:#fff;}
.zcityGroup .zcityItem .zcityItem-head:before{content:'';display:block;width:6px;height:6px;top:50%;margin-top:-3px;position:absolute;z-index:0;right:5px;transition:all 0.3s;-moz-transition:all 0.3s;-webkit-transition:all 0.3s;-o-transition:all 0.3s;}
.zcityGroup .zcityItem .zcityItem-head .currentValue{width:100%;display:block;height:30px;line-height:30px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;border:none;background:#fff;padding:0;}
.zcityGroup .zcityItem .zcityItem-main{position:absolute;z-index:0;left:0;top:32px;width:100%;visibility:hidden;opacity:0;background:#fff;}
.zcityGroup .zcityItem .zcityItem-main .cityContainer{height:120px;overflow-x:hidden;overflow-y:auto;border:1px solid #eee;}
.zcityGroup .zcityItem .zcityItem-main .citylist{}
.zcityGroup .zcityItem .zcityItem-main .cityTips,
.zcityGroup .zcityItem .zcityItem-main .citylist .cityitem{padding:0 10px;display:block;height:23px;line-height:23px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;text-align:left;}
.zcityGroup .zcityItem .zcityItem-main .cityTips:hover,
.zcityGroup .zcityItem .zcityItem-main .citylist .cityitem:hover{background:#f5f5f5;}
.zcityGroup .zcityItem.on .zcityItem-main{visibility:visible;opacity:1;}

/****************************************
* name:demoTable
* tips:妗堜緥
****************************************/
.demoTable{width:auto;}
.demoTable th{padding:10px;text-align:left;}
.demoTable td{padding:10px;}
.demoTable .td-01{width:100px;}
.demoTable .td-01 .zcityItem{width:100%;margin-left:0;}
.demoTable .td-02{width:100px;}
.demoTable .td-02 .zcityItem{width:100%;margin-left:0;}
.demoTable .td-03{width:100px;}
.demoTable .td-03 .zcityItem{width:100%;margin-left:0;}
.demoTable .td-04{width:300px;}
.demoTable .td-05{width:200px;}
.demoTable .td-05 .zcityItem{width:49%;margin-left:0;}
.demoTable .td-06{width:300px;}