*{ margin: 0;  padding: 0;list-style: none; border: none; vertical-align: baseline;-webkit-tap-highlight-color:transparent; -webkit-appearance: none; outline:none;border-radius: 0; }
:focus { outline: none; }
a {line-height:1;margin:0; outline:none;outline-offset:0;box-shadow:none;text-decoration: none!important;display: inline-block; -webkit-touch-callout: none;-webkit-user-select: none;font-weight: normal;}
img{width:100%;height: auto;display: inline-block; -webkit-user-drag: auto; }
 .container { 
    margin-top: ;
}
@media only screen and (max-width: 768px){
.wrap .container {
    
}
}
@media only screen and (max-width: 428px){
.wrap .container {
    
}
}
@media only screen and (max-width: 390px){
.wrap .container {
    margin-top: ;
}
}

.joinapp{position: relative;}
.joinapp .banner{position: relative; width: 100%;height: 14vw;background: url(/franchise/form/_common/img/banner.jpg) no-repeat left top / cover;display: flex;align-items: center;justify-content: center;}
.joinapp .banner .backpage{display: none; position: absolute;left: 5%;top: 50%; width: 25px;height: 25px; border-right: 2px solid #0a9c4b; border-bottom: 2px solid #0a9c4b;transform:translateY(-50%) rotate(135deg);cursor: pointer;}
.joinapp .banner .title{font-size: 48px;font-family: "";color: #333;line-height: 1.2;}

.joinapp .stage{width: 100%;max-width:calc(920px + 20vw);padding: 0 10vw; margin: 50px auto 100px;box-sizing: border-box;}
.joinapp .stage .field{display: flex;align-items: flex-start;justify-content: space-between;margin-bottom: 45px;}
.joinapp .stage .field > .tit{font-size: 24px;line-height: 1.2; font-family:"";width: 35%;}
.joinapp .stage .field > .items{font-size: 24px;line-height: 1.2; color: #999; font-family:"";width: 65%;display: grid;grid-template-columns: 1fr 1fr 1fr;}
.joinapp .stage .field > .items .item{margin-right: 20px;margin-bottom: 40px;box-sizing: border-box;display: grid;align-items: flex-start;grid-template-columns: 0 26px auto;}
.joinapp .stage .field > .items .item input{width: 1px;height: 0px; }
.joinapp .stage .field > .items .item .radioIcon{width: 24px;height: 24px;border: 1px solid #78b82a;border-radius: 5px; position: relative;}
.joinapp .stage .field > .items .item .radioIcon:after{opacity: 0; content: "";position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);width: 65%;height: 65%;border-radius: 3px; background: #009844;}
.joinapp .stage .field > .items .item input[type=radio]:checked + label.radioIcon:after { opacity: 1;}
.joinapp .stage .field > .items .item .radioText{padding-left:10px;line-height: 1;}

.joinapp .stage .field.pcafield > .items{ grid-template-columns:20% 80%;}
.joinapp .stage .field.pcafield > .items .toSelect{background-color: #ededed;padding:20px 30px;border-radius: 5px;color: #ccc;display: grid;grid-template-columns: calc(100% - 30px) 22px;align-items: center;justify-content: space-between; cursor: pointer;}
.joinapp .stage .field.pcafield > .items .toSelect .icon{width: 15px;height: 15px; border-right: 2px solid #0a9c4b; border-bottom: 2px solid #0a9c4b;transform: rotate(45deg);margin-top: -5px;}
.joinapp .stage .field.pcafield > .items .toSelect.hasResult{color: #999;}
.joinapp .stage .field.userfield > .items{ grid-template-columns: 1fr 1fr;}
.joinapp .stage .field.userfield > .items > div{margin-right:15px;margin-bottom:20px;box-sizing: border-box;border-bottom: 1px solid #666;}
.joinapp .stage .field.userfield > .items > div input{width: 100%; font-size: 24px;line-height: 1.2;padding:0 15px 20px;box-sizing: border-box;}
.joinapp .stage .field.userfield > .items .umsgcode{margin-bottom: 0;padding-top: 10px;} 
.joinapp .stage .field.userfield > .items .btnSendcode{background: #ebebeb;/*color: #999;*/display: flex;justify-content: center;align-items: center;margin-right: 15px; }
.joinapp .stage .field.userfield > .items .btnSendcode.sending{ }
.joinapp .stage .field.userfield > .items .btnSendcode.sendEnd{ }
.joinapp .stage .field.agreefield{margin-bottom: 0;}
.joinapp .stage .field.agreefield > .items {grid-template-columns:100%;font-size: 18px;}
.joinapp .stage .field.agreefield > .items .item .radioIcon{border-radius: 50%;border-width: 4px;box-sizing: border-box;}
.joinapp .stage .field.agreefield > .items .item .radioIcon:after{border-radius: 50%;}
.joinapp .stage .field.agreefield > .items .item input[type=checkbox]:checked + label.radioIcon:after { opacity: 1;}
.joinapp .stage .field.submitfield{margin-bottom: 20px;}
.joinapp .stage .field.submitfield > .items{ grid-template-columns: 55%;}
.joinapp .stage .field.submitfield > .items .btnSubmit{ background: #009844;color: #ffe800;display: flex;align-items: center;justify-content: center;border-radius: 5px; padding:25px;box-shadow: 10px 10px 20px rgba(0,0,0,0.25);}
.joinapp .stage .tip{font-size: 14px;color: #c7c7c7;text-align: center;}

.joinapp .popfilter{display: none; position: absolute;width: 100%;height: 100%;left: 0;top: 0;}
.joinapp .popfilter .popmask{position: absolute;width: 100%;height: 100%;left: 0;top: 0;background: rgba(0,0,0,0.3);}
.joinapp .popfilter .popinner{position: absolute;width: 100%;max-width:520px;height: auto;padding:20px 30px 0;box-sizing: border-box; right:calc((100% - 920px) / 2);top: calc(14vw + 50px);background: #f4f4f4;border-radius: 6px;box-shadow: 0 0 40px rgba(0,0,0,0.4);}
.joinapp .popfilter .popinner .field{padding-bottom: 30px; font-size: 16px;line-height: 1.2;}
.joinapp .popfilter .popinner .field .select{ border-radius: 6px; background: #fff;color: #3a3a3a;padding:18px;background:#fff url(img/popicon1.png) no-repeat calc(100% - 18px) center;background-size: ;cursor: pointer;}
.joinapp .popfilter .popinner .field .list{display: none!important; margin-top:30px; display: grid;grid-template-columns: 1fr 1fr 1fr 1fr;gap: 5px;}
.joinapp .popfilter .popinner .field .list .li{color: #6a6a6a; box-sizing: border-box; padding:10px 6px;text-wrap: balance;display: flex;align-items: center;justify-content: center; text-align: center;cursor: pointer;}
.joinapp .popfilter .popinner .field .list .li.curr,
.joinapp .popfilter .popinner .field .list .li:hover{background: #059c4d;color: #fff;}
.joinapp .popfilter .popinner .field .btnSure{display: flex;justify-content: center;align-items: center;font-size: 24px;color: #666;background-color: #ededed;padding:25px;border-radius: 5px;letter-spacing: 10px;font-family: "";}
.joinapp .popfilter .popinner .field .btnSure.active{color: #fff;background-color: #059c4d;}
.joinapp .popfilter .popinner .field.open .select{background-image: url(/franchise/form/_common/img/popicon2.png);}
.joinapp .popfilter .popinner .field.open .list{display: grid!important;}

.joinapp .popSuccess{display:none;position: fixed;width: 100%;height: 100%;left: 0;top: 0;z-index: 991;}
.joinapp .popSuccess .popmask{position: absolute;width: 100%;height: 100%;left: 0;top: 0;background: rgba(0,0,0,0.3);}
.joinapp .popSuccess .popreuslt{position: fixed;width: 90%;height: auto;max-width: 860px;left: 50%;top:50%;transform: translate(-50%,-50%); box-shadow: 0 0 40px rgba(0,0,0,0.4);display: flex;}
.joinapp .popSuccess .popreuslt p{position: absolute; left: 50%;top:50%;transform: translate(-50%,-50%);font-size: 48px;color: #fff;font-family:'';}
.joinapp .popSuccess .popreuslt .time{position: absolute; right: 2%;top:2%; font-size: 14px;color: #fff;font-family:'';letter-spacing: 1px;}

@media (max-width:1440px){
    
}
@media (max-width:1280px){
    .joinapp .banner .title{font-size: 40px;}
    .joinapp .popSuccess .popreuslt p{font-size: 40px;}
    .joinapp .stage .field{margin-bottom: 30px;}
    .joinapp .stage .field > .tit{font-size: 20px; }
    .joinapp .stage .field > .items{font-size: 20px;}
    .joinapp .stage .field > .items .item{margin-bottom: 30px;grid-template-columns: 0 22px auto; }
    .joinapp .stage .field > .items .item .radioIcon{width: 20px;height: 20px; }
	.joinapp .stage .field > .items .item .radioText{padding-left:8px;}
    .joinapp .stage .field.userfield > .items > div input{font-size: 20px;padding: 0 10px 8px;}
    .joinapp .stage .field.submitfield > .items .btnSubmit{padding: 20px;}
    .joinapp .popfilter .popinner{right: 10%;}
    .joinapp .popfilter .popinner .field .btnSure{padding: 20px;font-size: 20px;}
}
@media (max-width:1024px){

}
@media (max-width:768px){
    .joinapp .banner{ height: 20vw;} 
    .joinapp .banner .backpage{display: block; width: 20px;height: 20px;}
    .joinapp .banner .title{font-size: 26px;} 
    .joinapp .stage{margin:8vw auto 24vw;}
    .joinapp .stage .field{flex-direction: column;margin-bottom: 5vw;}
    .joinapp .stage .field > .tit{font-size: 16px;margin-bottom: 4vw;width: 100%; }
    .joinapp .stage .field > .items{font-size:16px;grid-template-columns: 50% 50%;width: 100%;}
    .joinapp .stage .field > .items .item{margin-bottom: 4vw;grid-template-columns: 0 calc(4.6vw + 2px) auto;line-height: 1;} 
    .joinapp .stage .field > .items .item .radioIcon{width: 4.6vw;height: 4.6vw;}
	.joinapp .stage .field > .items .item .radioText{padding-left:2vw;line-height:1.4;}
    .joinapp .stage .field.pcafield{flex-direction: row;justify-content: flex-start; align-items: center;}
    .joinapp .stage .field.pcafield > .tit{width: auto;margin: 0; }
    .joinapp .stage .field.pcafield > .items{grid-template-columns: 10px calc(100% - 10px);width: 65%;}
    .joinapp .stage .field.pcafield > .items .toSelect{padding:10px;display: flex;}
    .joinapp .stage .field.pcafield > .items .toSelect .icon{width: 8px;height: 8px;}
    .joinapp .stage .field.userfield > .items{display: flex;flex-wrap: wrap;justify-content: space-between;} 
    .joinapp .stage .field.userfield > .items .uname{width: 100%;} 
    .joinapp .stage .field.userfield > .items .uphone{width: 100%;} 
    .joinapp .stage .field.userfield > .items .umsgcode{width: calc(50% - 15px);box-sizing: border-box;} 
    .joinapp .stage .field.userfield > .items .btnSendcode{width: calc(50% - 15px);box-sizing: border-box;} 
    .joinapp .stage .field.userfield > .items > div input{font-size: 16px;padding: 0 10px 8px;}
    .joinapp .stage .field.agreefield > .tit{margin: 0;}
    .joinapp .stage .field.agreefield > .items{font-size: 14px;}
    .joinapp .stage .field.agreefield > .items .item{grid-template-columns: 0 calc(4vw + 2px) auto;margin-left: auto;margin-right: auto;}
    .joinapp .stage .field.agreefield > .items .item .radioIcon{width: 4vw; height: 4vw; border-width: 2px;}
	.joinapp .stage .field.agreefield > .items .item .radioText{padding-left:1.5vw;}
    .joinapp .stage .field.submitfield > .items{grid-template-columns: 100%;}
    .joinapp .popfilter{position: fixed;width: 100vw;height: 100%;overflow: auto;}
    .joinapp .popfilter .popmask{background: #f4f4f4;}
    .joinapp .popfilter .popinner{max-width: none;left: 0;top: 20vw;box-shadow: none;padding: 8vw 4vw;}
    .joinapp .popfilter .popinner .field{font-size: 14px;}
    .joinapp .popfilter .popinner .field .select{background-size: 25px;}
    .joinapp .popfilter .popinner .field .btnSure{font-size: 16px;padding: 15px;}
    .joinapp .popSuccess .popreuslt p{font-size:26px;}
    .joinapp .stage .tip{font-size: 12px;}
}
@media (max-width:414px){ 
    .joinapp .banner .title{font-size: 22px;} 
    .joinapp .stage .field > .tit{font-size: 14px; }
    .joinapp .stage .field > .items{font-size:14px;}
    .joinapp .stage .field.userfield > .items > div input{font-size: 14px;}
    .joinapp .popfilter .popinner .field{font-size: 12px;}
    .joinapp .popfilter .popinner .field .btnSure{font-size: 14px;}
    .joinapp .stage .field.agreefield > .items{font-size: 12px;}
    .joinapp .popSuccess .popreuslt p{font-size:22px;}
}



#sendcode.green_btn01:link,#sendcode.green_btn01:visited {
	height:14px;
	line-height: 14px;
	width: 54%;
}

@media only screen and (max-width: 768px) {
	.joinapp .stage .field.userfield > .items > div {
  		margin-right: 0;
  	}
	#sendcode.green_btn01:link,#sendcode.green_btn01:visited {
		height:35px;
		line-height: 35px;
		width: 40%;
		color: #009a44;
		border: 2px solid #009a44;
		margin-left: 1%;
	}

}

#submitForm.green_btn02:link,#sendcode.green_btn02:visited {
	height: 35px;
	line-height: 35px;
	text-align: center;
}
}