@charset "utf-8";
body { padding: 50px; box-sizing: border-box;}

.popup { display: none; position: fixed; left: 50%; top: 50%; z-index: 100; padding:52px 60px 60px; width: 450px; height: 350px; transform: translate(-50%, -50%); box-sizing: border-box; background: #fff;}
.popup h2 { padding: 0px 0px 10px; border-bottom: 3px solid #444; font-weight: normal; font-size:30px; color:#222; text-align: center; line-height: 100%;}
.popup .close { position: absolute; right:20px; top: 20px; width: 41px; height: 41px; background: url(btn-close.png) no-repeat; color:transparent;}

.popupL { display: none; position: fixed; left: 50%; top: 50%; z-index: 100; padding:52px 60px 60px; width: 450px; height: 350px; transform: translate(-50%, -50%); box-sizing: border-box; background: #fff;}
.popupL h2 { padding: 0px 0px 10px; border-bottom: 3px solid #444; font-weight: normal; font-size:30px; color:#222; text-align: center; line-height: 100%;}
.popupL .close { position: absolute; right:20px; top: 20px; width: 41px; height: 41px; background: url(btn-close.png) no-repeat; color:transparent;}

.popupS { display: none; position: fixed; left: 50%; top: 50%; z-index: 100; padding:52px 60px 60px; width: 470px; height: 350px; transform: translate(-50%, -50%); box-sizing: border-box; background: #fff;}
.popupS h2 { padding: 0 0 10px; border-bottom: 3px solid #444; font-weight: normal; font-size:30px; color:#222; text-align: center; line-height: 100%;}
.popupS .close { position: absolute; right:20px; top: 20px; width: 41px; height: 41px; background: url(btn-close.png) no-repeat; color:transparent;}

.popupC { display: none; position: fixed; left: 50%; top: 50%; z-index: 100; padding:52px 60px 60px; width: 450px; height: 350px; transform: translate(-50%, -50%); box-sizing: border-box; background: #fff;}
.popupC h2 { padding: 0px 0px 10px; border-bottom: 3px solid #444; font-weight: normal; font-size:30px; color:#222; text-align: center; line-height: 100%;}
.popupC .close { position: absolute; right:20px; top: 20px; width: 41px; height: 41px; background: url(btn-close.png) no-repeat; color:transparent;}

.popupConfirm { display: none; position: fixed; left: 50%; top: 50%; z-index: 100; padding:52px 60px 60px; width: 450px; height: 350px; transform: translate(-50%, -50%); box-sizing: border-box; background: #fff;}
.popupConfirm h2 { padding: 0 0 25px; border-bottom: 3px solid #444; font-weight: normal; font-size:30px; color:#222; text-align: center; line-height: 100%;}
.popupConfirm .close { position: absolute; right:20px; top: 20px; width: 41px; height: 41px; background: url(btn-close.png) no-repeat; color:transparent;}

.popupX { display: none; position: fixed; left: 50%; top: 50%; z-index: 100; padding:12px 60px 60px; width: 450px; height: 350px; transform: translate(-50%, -50%); box-sizing: border-box; background: #fff;}

.agree { position: relative; margin: 28px 0 0; padding: 0 30px; height: 60px; border:1px solid #e8e8e8; line-height: 60px;}
.agree label span { color:#de4f41;}
.agree a.view { position: absolute; right:30px; top:15px; width: 93px; height: 30px; border:1px solid #ddd; text-align: center; line-height: 30px; border-radius: 3px;}

.dim { display: none;position: fixed; left: 0; top: 0; z-index: 99; width: 100%; height: 100%; background: rgba(0,0,0,0.5);}

.part1 { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
.txt_center { text-align: center; padding: 5px 0 0; }
.btn_type1 { display: inline-block;width: 225px; height: 100px; background: #8541de; line-height: 100px; color:#fff; text-align: center; border-radius: 3px; font-size:23px; }
.btn_type2 { display: inline-block;width: 150px; height: 100px; background: red; line-height: 100px; color:#fff; text-align: center; border-radius: 3px; font-size:23px;}
.confirm_btn { display: inline-block;width: 150px; height: 100px; background: red; line-height: 100px; color:#fff; text-align: center; border-radius: 3px; font-size:23px;}

.user { text-align: right; font-size: 15px;}
.left { text-align: right; font-size: 20px;}
.ps { text-align: right; font-size: 20px;}
.parent1 { display: flex; margin: 10px auto; }
.printerPic { margin: 0px 30px; }
.laserPic { margin: 0px 20px; }
.carpentryPic { margin: 0px 30px; }
.parent11 { display: flex; margin: 10px auto; }
.parent2 { display: flex; margin: 10px auto; }
.parent22 { display: flex; margin: 10px auto; }
.click { display: inline-block; width: 150px; height: 40px; background: dodgerblue; line-height: 40px; color:#fff; text-align: center; border-radius: 3px; font-size:15px; flex: 1; margin: 0px 10px; }
.userPurpose { text-align: center; width: 300px; border: 2px solid #aaa; border-radius: 4px; margin: 8px 0; outline: none; padding: 8px; box-sizing: border-box; transition: .3s; }
.userid { width: 300px; border: 2px solid #aaa; border-radius: 4px; margin: 8px 0; outline: none; padding: 8px; box-sizing: border-box; transition: .3s; }
.userid:focus { border-color:dodgerblue; box-shadow: 0 0 7px 0 dodgerblue; }