html,body{margin:0; padding:0; background:#F0F0F0; color:#333;}
.container{padding: .2rem;}
.text-center{text-align: center;}
.ml-3{margin-left: .3rem;}
.btn{display: block; width: 100%; border: none; outline: none; border-radius: .06rem; font-size: .26rem; line-height: .7rem; text-align: center; color: #FFF; background: #007bff;}

hr{border: none; height: 1px; background: #DDD; overflow: hidden; margin: .2rem 0;}
h3{font-size: .28rem; font-weight: bold; line-height: .5rem; margin-bottom: .2rem;}
p{font-size: .24rem; line-height: .4rem; margin-bottom: .2rem;}
a{color: #007bff;}
ol{padding-left: .25rem; list-style: decimal;}

.list-normal{padding: .2rem 0;}
.list-normal li{padding: .1rem 0;}
.list-normal a{font-weight: bold;}

.list-type{font-size: .24rem; line-height: .36rem; margin:0 -.2rem .2rem -.2rem; background: #FFF;}
.list-type li{border-bottom: .01rem solid #DDD;}
.list-type li:last-child{border-bottom: none;}
.list-type li input{margin-right: .1rem; vertical-align: -2px;}
.list-type li label{display: block; padding: .2rem; color: #666;}

.form-box{margin-bottom: .4rem;}
.form-box p{color: #666;}
.form-title{font-size: .26rem; display: block; margin-bottom: .2rem;}
.form-title em{margin-left: .1rem; color: #F60; vertical-align: middle;}
.form-inner{margin-bottom: .2rem;}
.form-field{width: 100%; outline: none; border: 1px solid #DDD; background: #FFF; border-radius: .06rem; box-sizing: border-box; padding: .14rem;}


/* upload image list start */
.upload-img-list{display:grid; grid-template-columns:repeat(4, 1fr); gap:5px;}
.upload-img-list .item{position:relative; border-radius:5px; width:90px; height:90px; background: #FFF; overflow:hidden;}
.upload-img-list .item .img{display:flex; justify-content:center; align-items:center; width:90px; height:90px;}
.upload-img-list .item img{max-width:90px; max-height:90px;}
.upload-img-list .item .close{position:absolute; top:2px; right:2px; z-index:100; width:22px; height:22px; border: none; outline: none; font-size:22px; color:#fff; background:#333; border-radius:3px; display: flex; justify-content: center; align-items: center;}
.upload-img-list .item-upload{cursor:pointer;}
.upload-img-list .item-upload:before, .upload-img-list .item-upload:after{position:absolute; left:27px; top:40px; content:''; width:40px; border-top:2px solid #999; z-index:10;}
.upload-img-list .item-upload:after{transform:rotate(90deg);}

.upload-img-list .loading{position:absolute; left:0; top:0; z-index:12; display:flex; justify-content:center; align-items:center; width:90px; height:90px; background:#FFF;}
.upload-img-list .loading .fa{font-size:30px; color:#999; animation:spin 3s linear infinite;}
@keyframes spin{
    from{-webkit-transform:rotate(0deg);}
    to{-webkit-transform:rotate(360deg);}
}
/* upload image list end */