.form{
    width:100%;
    background:url("../image/form/bcg.jpg?nc=1236") no-repeat center;
    background-size:100% 100%;
    padding-top: calc(100vw * 85 / 2760);
    padding-bottom: calc(100vw * 322 / 2760);
}
.form-title,
.form-inp,
.form-eventline,
.form-remark{
    width: 100%;
}

.form-title img,
.form-inp img,
.form-eventline img,
.form-remark img{
    display:block;
    width:100%;
}
.form-submit img{
    display: block;
    width: calc(100vw * 769 / 2760);
    margin: 0 auto;
}

.form-title{
    margin-bottom: calc(100vw * 75 / 2760);
}
.form-inp,
.form-eventline{
    margin-bottom: calc(100vw * 24 / 2760);
}
.form-remark{
    margin-bottom: calc(100vw * 115 / 2760);
}
.form-inp{position: relative;}

.form-inp input{
    position: absolute;
    width: calc(100vw * 600 / 2760);
    height: calc(100vw * 77 / 2760);
    padding: 0 calc(100vw * 20 / 2760);
    font-size: calc(100vw * 28 / 2760);
    border: none;
    background-color: transparent;
    box-sizing: border-box;
    z-index: 1;
}
/* left - right */
.form-inp .inp1,.form-inp .inp2,.form-inp .inp3{
    left: calc(100vw * 260 / 2760);
}
.form-inp .inp4,.form-inp .inp5,.form-inp .inp6{
    left: calc(100vw * 1152 / 2760);
}
.form-inp .inp1,.form-inp .inp4{
    top: 0;
}
.form-inp .inp2,.form-inp .inp5{
    top: calc(100vw * 102 / 2760);
}
.form-inp .inp3,.form-inp .inp6{
    top: calc(100vw * 204 / 2760);
}
.form-remark{position: relative;}

.form-remark input{
    position: absolute;
    left: calc(100vw * 30 / 2760);
    right: calc(100vw * 30 / 2760);
    /* top: calc(100vw * 100 / 2760); */
    top: calc(100vw * 76/ 2760);
    height: calc(100vw * 77 / 2760);
    font-size: calc(100vw * 28 / 2760);
    border: none;
    background: transparent;
    box-sizing: border-box;
    z-index: 1;
    resize: none;
    line-height: 1.5;
}
.form-remark textarea{
    position: absolute;
    padding: 0 calc(100vw * 30 / 2760) calc(100vw * 20 / 2760);
    left: 0;
    right: 0;
    top: calc(100vw * 78 / 2760);
    min-height: calc(100vw * 40 / 2760);
    font-size: calc(100vw * 30 / 2760);
    line-height: 1.5;
    border: none;
    background: #fbfbfb;
    box-sizing: border-box;
    z-index: 1;
    resize: none;
    overflow-y: hidden;
    width: auto;
    opacity: 0;
    transition: opacity 0.2s ease;
}
.form-remark textarea:focus,
.form-remark textarea:not(:placeholder-shown){
    opacity: 1;
}
.form-submit{
    position: relative;
    margin-bottom: calc(100vw * 296 / 2760);
}
.submit_btn{
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: calc(-100vw * 769 / 2760 / 2);
    width: calc(100vw * 769 / 2760);
    height: calc(100vw * 125 / 2760);
}
.yinsi{
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: calc(-100vw * 610 / 2760 / 2);
    width: calc(100vw * 300 / 2760);
    height: calc(100vw * 40 / 2760);
    opacity: 0;
}
.yinsi input{
    width: calc(100vw * 46 / 2760);
    height: calc(100vw * 46 / 2760);
    display: block;
    pointer-events: none;
}
.go_yinsi{
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: calc(-100vw * 20 / 2760 / 2);
    width: calc(100vw * 150 / 2760);
    height: calc(100vw * 40 / 2760);
    display: block;
}
.form-eventline{
    position: relative;
}
.form-eventline .event-checks{
    position: absolute;
    
    display: flex;
    justify-content: flex-end;
    
    width: calc(100vw * 780 / 2760);
    height: calc(100vw * 35 / 2760);
    opacity: 0;
    transition: opacity 0.2s ease;
    cursor: pointer;
    z-index: 2;
}
.form-eventline .event-checks.active,.xieyi.active,.yinsi.active{
    opacity: 1;
}
.event-checks1,.event-checks2,.event-checks3,.event-checks4,.event-checks5{
    left: calc(100vw * 60 / 2760);
}
.event-checks1,.event-checks6{
    top: calc(100vw * 216 / 2760);
}

.event-checks2{
    top: calc(100vw * 558 / 2760);
}
.event-checks3,.event-checks10{
    top: calc(100vw * 647 / 2760);
}
.event-checks4,.event-checks11{
    top: calc(100vw * 727 / 2760);
}
.event-checks5,.event-checks12{
    top: calc(100vw * 800 / 2760);
}
.event-checks7{
    top: calc(100vw * 295 / 2760);
}
.event-checks8{
    top: calc(100vw * 380 / 2760);
}
.event-checks9{
    top: calc(100vw * 460 / 2760);
}
/* .event-checks10{
    top: calc(100vw * 560 / 2760);
} */

.event-checks6,.event-checks7,.event-checks8,.event-checks9,.event-checks10,.event-checks11,.event-checks12{
    left: calc(100vw * 937 / 2760);
    
}

.form-eventline .event-checks input{
    width: calc(100vw * 42 / 2760);
    height: calc(100vw * 42 / 2760);
    pointer-events: none;
}
.form-eventline .event-checks .chk-item{
    display: flex;
    align-items: center;
    font-size: calc(100vw * 28 / 2760);
    color: #333;
}
.form-eventline .event-checks .chk-item input{
    width: calc(100vw * 28 / 2760);
    height: calc(100vw * 28 / 2760);
    margin-right: calc(100vw * 12 / 2760);
}
.xieyi{
    position: absolute;
    bottom: calc(100vw * 131 / 2760);
    width: calc(100vw * 780 / 2760);
    height: calc(100vw * 35 / 2760);
    left: calc(100vw * 48 / 2760);
    opacity: 0;
}
.xieyi input{
    width: calc(100vw * 42 / 2760);
    height: calc(100vw * 42 / 2760);
    display: block;
    pointer-events: none;
}


.submit_layer{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255,255,255,0.6);
    z-index: 99999;
    display: none;
    justify-content: center;
    align-items: center;
}
.submit_layer.active{
    display: flex;
}
.submit_layer .submit_layer_content{
    position: absolute;
    width: calc(100vw * 1342 / 2760);
    top: 30%;
    left: 50%;
    margin-left: calc(-100vw * 1342 / 2760 / 2);
}
.submit_layer .submit_layer_content img{
    display: none;
    width: calc(100vw * 1342 / 2760);
}
.submit_layer .submit_layer_content .close{
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: calc(-100vw * 100 / 2760 / 2);
    width: calc(100vw * 100 / 2760);
    height: calc(100vw * 100 / 2760);
    cursor: pointer;
}











.form-eventline .online,
.form-eventline .offline{
    width: calc(100vw * 144 / 2760);
    height: calc(100vw * 35 / 2760);
    cursor: pointer;
    position: absolute;;
}
.form-eventline .online{
    background: url(../image/form/online.png?nc=1236) no-repeat;
    background-size: 100% 100%;
}
.form-eventline .offline{
     background: url(../image/form/offline.png?nc=1236) no-repeat;
     background-size: 100% 100%;
}
/* left - right */
.on1,.on2,.on3,.on4,.on5,.on6{
    left: calc(100vw * 539 / 2760);
}
.off1,.off2,.off3,.off4,.off5,.off6{
    left: calc(100vw * 695 / 2760);
}
.on7,.on8,.on9,.on10,.on11,.on12,.on13{
    left: calc(100vw * 1434 / 2760);
}
.off7,.off8,.off9,.off10,.off11,.off12,.off13{
    left: calc(100vw * 1590 / 2760);
}



.on1,.off1{  
    top: calc(100vw * 214 / 2760);
}
.on2,.off2{  
    top: calc(100vw * 456 / 2760);
}
.on3,.off3{  
    top: calc(100vw * 537 / 2760);
}
.on4,.off4{  
    top: calc(100vw * 622 / 2760);
}
.on5,.off5{  
    top: calc(100vw * 709 / 2760);
}
.on6,.off6{  
    top: calc(100vw * 797 / 2760);
}

.on7,.off7{
    top: calc(100vw * 214 / 2760);
}
.on8,.off8{
    top: calc(100vw * 295 / 2760);
}
.on9,.off9{
    top: calc(100vw * 380 / 2760);
}
.on10,.off10{
    top: calc(100vw * 467 / 2760);
}
.on11,.off11{
    top: calc(100vw * 634 / 2760);
}
.on12,.off12{
    top: calc(100vw * 715 / 2760);
}
.on13,.off13{
    top: calc(100vw * 800 / 2760);
}