/*表单组件模块*/
.QHinput{padding:20px 0;position: relative;}
.QHinput .h3{font-size:18px;display: flex;align-items: center;margin-bottom:10px;color:#444;font-weight:700;}
.QHinput .h3 i{color: #F03232;display: block;margin-left:10px;}
.QHinput .input{border:1px solid #eee;width:100%;height:50px;padding:0 10px;box-sizing:border-box;font-size:18px;}

.QHinput .textarea{border:1px solid #eee;width:100%;height:80px;padding:0 10px;box-sizing:border-box;font-size:18px;line-height:1.8;font-family:微软雅黑;}

.QHinput .select{border:1px solid #eee;width:100%;height:50px;background:#fff;padding:0 10px;box-sizing:border-box;font-size:18px;cursor: pointer;position: relative;appearance: none;-webkit-appearance: none;-moz-appearance: none;background: url(../images/xl.png) no-repeat right center;background-size:25px auto;padding-right: 30px;}
.QHinput .selectBox3 .select{ width: 30%;}
.QHinput .select i{content:"";position:absolute;display: block;width:50px;height:50px;background: #000;right:0;top:0;}
.QHinput .select option{cursor: pointer;}
.QHinput .select::-ms-expand {display: none;}

.QHinput .radio .li{cursor: pointer;font-size:24px;margin-right:40px;}
.QHinput .radio .li .span1{display: block;width:20px;height:20px;border:2px solid #ccc;box-sizing:border-box;border-radius:100px;position:relative;}
.QHinput .radio .li .span1::after{content:"";width:12px;height:12px;display:block;background:#fff;border-radius:100px;left:50%;top:50%;position:absolute;transform: translate(-50%, -50%);}
.QHinput .radio .li .span2{margin-left:5px;font-size:18px;}
.QHinput .radio .li.on .span1{border-color:#F03232;}
.QHinput .radio .li.on .span1::after{background-color:#F03232;}

.QHinput .checkbox .li{cursor: pointer;font-size:24px;margin-right:40px;}
.QHinput .checkbox .li .span1{display: block;width:20px;height:20px;border:2px solid #ccc;box-sizing:border-box;position:relative;}
.QHinput .checkbox .li .span1::after{content:"";width:12px;height:12px;display:block;background:#fff;left:50%;top:50%;position:absolute;transform: translate(-50%, -50%);}
.QHinput .checkbox .li .span2{margin-left:5px;font-size:18px;}
.QHinput .checkbox .li.on .span1{border-color:#F03232;}
.QHinput .checkbox .li.on .span1::after{background-color:#F03232;}

.QHsubmit{height:45px;display: block;background:#2774D3;text-align:center;color:#fff;font-size:18px;line-height:50px;cursor: pointer;border-radius:5px;}
@media screen and (max-width: 750px) {
    .QHinput{padding:15px 0;position: relative;}
    .QHinput .input{font-size:16px;}
    .QHinput .textarea{font-size:16px;}
    .QHinput .select{font-size:16px;}
    .QHinput .radio .span2{font-size:16px !important;}
    .QHinput .checkbox .span2{font-size:16px !important;}
}

/*uploadImg*/
.uploadBox{width:150px;height:150px;border:1px solid #000;background:#F2F2F2;margin-bottom:15px;cursor: pointer;overflow: hidden;position: relative;box-sizing:border-box;}
.uploadBox .webuploader-element-invisible{opacity:0;}
.uploadBox .box1 span{display: block;text-align:center;}
.uploadBox .box1 span.span1{font-size:60px;line-height:1;}
.uploadBox .box1 span.span2{font-size:14px;color:#333333;position: relative;top:-5px;}
.PhotoBox{width:150px;height:150px;overflow: hidden;display: flex; align-items: center; justify-content: center;background: #333;position:relative;}
.PhotoBox .PhotoImg{width:100%;max-width:100%;}
.PhotoBox span{display:block;position:absolute;left:5px;bottom:5px;background:rgba(240, 50, 50, 0.8);color:#FFF;text-align:center;z-index:1;line-height:40px;width:100%;font-size:14px;}
.PhotoBox span{width:140px;border-radius:5px;cursor: pointer;}
.webuploader-pick {position: absolute; left: 0; top: 0; width: 150px; height: 150px; overflow: hidden; display: flex; align-items: center; justify-content: center;}

/*弹窗自适应组件*/
.layui-m-layer-QHlayerPop{overflow: hidden;border-radius:5px !important;width: 90%;max-width: 600px;}
.layui-m-layer-QHlayerPop .layui-m-layercont{max-height:80vh;overflow-y:auto;}
.QHpopHtml{width:100vw;height:100vh;position:fixed;left:0;top:0;background:rgba(0,0,0,0.6);z-index:100;}
.QHpopHtml .QHpop{padding:60px 0;position:absolute;background:#fff;left:50%;top:50%;transform: translate(-50%, -50%);width:95%;max-width:700px;box-sizing:border-box;max-height:95vh;}
.QHpopHtml .QHpop{overflow: hidden;position: relative;}
.QHpopHtml .QHpop .popTitle{font-size:20px;font-weight:700;text-align:center;position:absolute;background:#FFF;width:100%;left:0;top:0;z-index:1;padding:15px 10px;box-sizing:border-box;border-bottom:1px solid #f5f5f5;line-height:25px;}
.QHpopHtml .QHpop .popTitle span{position:absolute;right:0;top:0;width:50px;line-height:55px;text-align:center;font-size:30px;display: block;cursor: pointer;}
.QHpopHtml .popContent{max-height:calc(95vh - 155px);overflow-y:auto;padding:0 20px;}
.QHpopHtml .popBottom{height:65px;position:absolute;left:0;bottom:0;padding:10px;box-sizing:border-box;width:100%;border-top:1px solid #f5f5f5;background:#fff;}


/*登录表单模块*/
.formBox{box-shadow:0px 4px 10px 0px rgba(0,0,0,0.05);background:#fff;overflow: hidden;margin:-28px auto 0;}
.formBox .formHead {position:relative;overflow:hidden;overflow-x:scroll;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;}
.formTab {
    display: flex;
    border-radius: 8px;
    background-color: #f5f7fa;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    overflow: hidden;
    /*margin-bottom: 24px;*/
    max-width: 600px;
    margin: 0 auto;
}

.formTab .link {
    display: block;
    padding: 14px 0;
    text-align: center;
    font-size: 16px;
    color: #606266;
    background: transparent;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    font-weight: 500;
    border: 1px solid #eee;
}

.formTab .link:hover {
    color: #409eff;
    background-color: rgba(64,158,255,0.05);
}

.formTab .link.active {
    color: #409eff;
    background-color: #fff;
    box-shadow: 0 2px 12px rgba(64,158,255,0.1);
}

/* 激活状态指示器 */
.formTab .link.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 10%;
    width: 80%;
    height: 3px;
    background: #409eff;
    border-radius: 3px;
    animation: slideIn 0.3s ease;
}

@keyframes slideIn {
    from { transform: translateY(5px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

/* 响应式调整 */
@media (max-width: 768px) {
    .formTab .link {
        padding: 12px 0;
        font-size: 14px;
    }
}
.formBox .formHead .link{width:100%;font-size:24px;color:#666;text-align:center;flex-shrink:0;font-weight:700;padding:0.3rem 0}
.formBox .formHead .link:hover,.formHead .link.active{background:linear-gradient(180deg,#bfcbd8 0%,#FFFFFF 100%);color:#666;position:relative;}
.formBox .formHead .link:hover:after,.formHead .link.active:after{position:absolute;content:'';width:100%;height:3px;background:#666;top:0;left:0;}
.formBox .smallContent{max-width:600px;margin:0 auto;width:90%;}
.formBox .Submit{width:100% !important;}
.formBox .hint{color:#999;font-size:14px;padding:10px 0;}
.formBox .hint a{color:#008CD7;}
.formBox .hint a:hover{text-decoration:underline;}
.formBox .yzmBtn1{height:50px;position:absolute;right:0;bottom:20px;background:#2774D3;border-radius:0  5px 5px 0;padding:0 10px;cursor: pointer;color:rgba(255,255,255,0.8);}
.formBox .yzmBtn2{height:50px;position:absolute;right:0;bottom:20px;background:#999;border-radius:0  5px 5px 0;padding:0 10px;color:rgba(255,255,255,0.8);}
.formBox .checkbox{transform: scale(1.4);cursor: pointer;position: relative;top:2px;}

/*section*/
.section{margin-top:50px;}
.section h2{color: #F03232;font-size:30px;text-indent:20px;padding-bottom:25px;}
.section .content{background:#fff;padding:30px 10px 50px 10px;}
.section .QHinput{padding:20px 0;position: relative;}
.section .QHinput h3{font-size:18px;display: flex;align-items: center;margin-bottom:10px;color:#666;}
.other-input{margin-top:10px;}
.dietaryRestriction{margin-bottom:10px;}
.section .QHinput h3 i{color: #F03232;display: block;margin-left:10px;}
.section .QHinput .input{border:1px solid #eee;width:100%;height:50px;padding:0 10px;box-sizing:border-box;font-size:18px;}
.section .QHinput .select{border:1px solid #eee;width:100%;height:50px;background:#fff;padding:0 10px;box-sizing:border-box;font-size:18px;cursor: pointer;position: relative;appearance: none;-webkit-appearance: none;-moz-appearance: none;background: url(../images/xl.png) no-repeat right center;background-size:25px auto;padding-right: 30px;}
.select::-ms-expand {display: none;}
.section .QHinput .selectBox3 .select{ width: 30%;}
.section .QHinput .select i{content:"";position:absolute;display: block;width:50px;height:50px;background: #000;right:0;top:0;}
.section .QHinput .select option{cursor: pointer;}
.section .QHinput .radio{padding-top:10px;}
.section .QHinput .radio .li{cursor: pointer;font-size:24px;margin-right:40px;}
.section .QHinput .radio .li .span1{display: block;width:20px;height:20px;border:2px solid #ccc;box-sizing:border-box;border-radius:100px;position:relative;}
.section .QHinput .radio .li .span1::after{content:"";width:12px;height:12px;display:block;background:#fff;border-radius:100px;left:50%;top:50%;position:absolute;transform: translate(-50%, -50%);}
.section .QHinput .radio .li .span2{margin-left:5px;}
.section .QHinput .radio .li.on .span1{border-color:#F03232;}
.section .QHinput .radio .li.on .span1::after{background-color:#F03232;}
.section .tips{font-size:14px;color:#CBCBCB;line-height:1.8;}
.section .Submit{height:50px;display: block;background:#2774D3;display: block;text-align:center;color:#fff;font-size:18px;line-height:50px;cursor: pointer;margin-top:20px;border-radius:5px;}
.section.SubmitBox{padding-bottom:200px;}
.section .uploadBox{width:100px;height:100px;border:1px solid #C6C6C6;background:#F2F2F2;margin-bottom:15px;cursor: pointer;overflow: hidden;position: relative;}
.section .uploadBox .webuploader-element-invisible{opacity:0;}
.section .uploadBox .box1 span{display: block;text-align:center;}
.section .uploadBox .box1 span.span1{font-size:60px;line-height:1;}
.section .uploadBox .box1 span.span2{font-size:14px;color:#333333;position: relative;top:6px;}
.section .webuploader-pick {position: absolute; left: 0; top: 0; width: 100px; height: 100px; overflow: hidden; display: flex; align-items: center; justify-content: center;}
@media screen and (max-width: 500px) {
    .section .content{padding:18px 0;}
}


/*QHsonNavA*/
.QHsonNavA{overflow: hidden;margin-top:30px;}
.QHsonNavA a{display: block;height:48px;background:linear-gradient(180deg,#F9F9F9 0%,#FFFFFF 100%);cursor:pointer;font-size:16px;color:#111;box-sizing:border-box;position:relative;width:25%;float:left;line-height:48px;text-align:center;font-weight:700;}
.QHsonNavA a:after{position: absolute; content: ''; width: 100%; height: 1px; background: #eee; bottom: 0; left: 0; }
.QHsonNavA a.on{ background: linear-gradient(180deg, #DBF3FF 0%, #FFFFFF 100%); border-bottom: none;position: relative;}
.QHsonNavA a.on:after{position: absolute; content: ''; width: 100%; height: 2px; background: #008CD7; top: 0; left: 0;}
.QHsonNavA a:hover{ background: linear-gradient(180deg, #DBF3FF 0%, #FFFFFF 100%); border-bottom: none;position: relative;}
.QHsonNavA a:hover:after{position: absolute; content: ''; width: 100%; height: 2px; background: none; top: 0; left: 0;}
@media screen and (max-width: 500px) {
    .QHsonNavA a{font-size:14px;}
}

/*QHsonLiA*/
.QHsonLiA { overflow: hidden; }
.QHsonLiA .oneNew { height: 56px; line-height: 56px; width: 100%; border-bottom: 1px solid #EEEEEE; box-sizing: border-box; }
.QHsonLiA .oneNew .txt1 { color: #111;padding-left:10px;}
.QHsonLiA .oneNew .txt2 { color: #999; width: 100px; }
.QHsonLiA .oneNew:hover .txt1 { color: #008CD7; }


/*YQsuoying(索引页)*/
.YQsuoyingBox{padding:20px;}
.YQsuoying{background:rgba(0, 0, 0, 0.02);border-radius:5px;padding:15px;}
.YQsuoying p{font-size:16px;line-height:1.5;margin:0.10rem 0;}
.YQsuoying .YQbutton{width:auto;margin:0 0.2rem !important;margin-left:0 !important;padding:0 0.2rem;}
.YQsuoying a{margin-right:0.1rem;font-size:15px;color:#999;display: block;padding:0.1rem 0;font-weight:700;}
.YQsuoying a font{color:#999;font-weight:normal;}
.YQsuoying a:hover{text-decoration:underline;}
.YQsuoying a.on{color: #000;}
.YQsuoying strong{font-size:16px;font-weight:700;color: #333;display: block;margin-bottom:0.1rem;}

