/* 遮罩层 
.area-larger-mask {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    font-size: 10px;
    background-color: rgba(0, 0, 0, 0.4);
    display: none;
    z-index: 9000;
}*/
#areaScrollMask .main{display: flex;align-items: center;justify-content: center;}

/* 弹窗 */
.area-larger-main {
    width: 6.9rem;
    padding-left: 1.33rem;
    position: relative;
/*    
    height: auto;
    background-color: #ffffff;
    position: absolute;
    top: 218px;
    left: 5%;*/
}

/* 弹窗头部 */
.area-control {}

.area-control > div {}

/* 取消 */
.cancel-area-control {
    width: 20%;
}

/* 确定 */
.confirm-area-control {
    position: absolute;
    bottom: 1.44rem;
    left: 50%; 
    transform: translateX(-50%);
    padding-bottom: 0.4rem;
    font-size: 0.28rem;
}
.confirm-area-control:after{
    position: absolute; 
    content: '';
    bottom:0;
    left: 50%; 
    background: url("../../images/close-up.svg") no-repeat center bottom;
    background-size:contain;
    width: 0.24rem;
    height: 0.14rem;
    margin-left: -0.12rem;
    animation: iconTop 1.5s linear infinite;
}

/* title */
.title-area-control {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    color: #999;
    font-size: 0.3rem;
    text-align: right;
    padding-right: 0.27rem;
    width: 1.33rem;
}

/* 弹窗主体 */
.area-main {
    position: relative;
}

/* 地区列表 */
.area-list-scroll {
    width: 100%;
    height: 6rem;
    overflow: hidden;
}

/*.area-list-scroll:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 40px;
    top: 80px;
    left: 0;
    border-top: #dcdcdc solid 1px;
    border-bottom: #dcdcdc solid 1px;
}*/

/* 三级列表 */
.area-item {
    z-index: 9010;
    width: 33.33333%;
    height: auto;
    float: left;
    margin-top: 2.4rem;
    transform: translate3d(0px, 0px, 0px);
    transition-duration: 200ms;
    position: relative;
}

.area-item > div {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.area-item > div > div {
    width: 100%;
    height: 1.2rem;
    justify-content: center;
    display: flex;
    align-items: center;
    font-size: 0.3rem;
}

/*渐变隐藏*/
.area-list-scroll:before {
    pointer-events: none;
    content: '';
    z-index: 9011;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background:linear-gradient(to bottom, rgb(221 235 244) 0%,rgb(227 236 240) 25%,rgba(232,238,239,0) 51%,rgb(237 238 235) 75%,rgb(242 238 231) 100%);
}