#login { background: url('/images/bg-login.jpg') center center #F9F9F9 no-repeat; background-size: cover; } #login .main { width: 26.0416vw; margin: 0 auto; padding: 6.6666vw 0; } #login .main h3 { font-size: 1.625vw; padding: 0 0 1.5vw 0; text-align: center; } #login .main ul { list-style: none; } #login .main ul li { display: flex; margin-bottom: 1.04166vw; align-items: center; justify-content: space-between; } #login .main ul li.password { position: relative; } #login .main ul li input { padding: 0.729166vw; font-size: 0.83333vw; width: 100%; } #login .main ul li input[name=verification] { width: 72%; } #login .main ul li .showPassword { cursor: pointer; width: 1.25vw; height: 1.25vw; background-size: cover; position: absolute; right: 0.625vw; bottom: calc(50% - 0.625vw); } #login .main ul li .showNewPassword { cursor: pointer; width: 1.25vw; height: 1.25vw; background-size: cover; position: absolute; right: 0.625vw; bottom: calc(50% - 0.625vw); } #login .main ul li .showConfirmNewPassword { cursor: pointer; width: 1.25vw; height: 1.25vw; background-size: cover; position: absolute; right: 0.625vw; bottom: calc(50% - 0.625vw); } #login .main ul li .getCode { min-width: 24%; width: 24%; margin-left: 4%; text-align: center; background: #007D40; padding: 0.729166vw 0; font-size: 0.83333vw; color: #fff; cursor: pointer; } #login .main ul li p { font-size: 0.83333vw; color: #3D3D3D; } #login .main ul li p a { color: #007D40; } #login .main p.note { display: block; margin: 1.325vw 0; color: #ed7d31; font-size: 0.8333vw; text-align: left; } #login .main .btnLogin { color: #fff; background: #007D40; font-size: 0.83333vw; padding: 0.6510416vw 0; text-align: center; margin-top: 1.25vw; margin-bottom: 9.11465vw; cursor: pointer; } #login .main .btnresetpassword { color: #fff; background: #007D40; font-size: 0.83333vw; padding: 0.6510416vw 0; text-align: center; margin-top: 1.25vw; margin-bottom: 9.11465vw; cursor: pointer; } #registr { background: url('/images/bg-login.jpg') center center #F9F9F9 no-repeat; background-size: cover; } #registr .main { display: flex; } #registr .main .imgregistr { width: 50%; position: relative; } #registr .main .imgregistr img { width: 100%; } #registr .main .imgregistr h4 { position: absolute; top: 3.64583vw; left: 50%; transform: translateX(-50%); color: #fff; font-size: 2.5vw; font-weight: normal; } #registr .main .registrDiv { margin: 1.975vw auto; } #registr .main .registrDiv p { font-size: 0.83333vw; color: #3D3D3D; margin-bottom: 0.83333vw; } #registr .main .registrDiv p a { color: #007D40; } #registr .main .registrDiv ul li { display: flex; margin-bottom: 0.83333vw; } #registr .main .registrDiv ul li input { padding: 0.729166vw; font-size: 0.83333vw; width: 24.783328vw; } #registr .main .registrDiv ul li.two { align-items: center; } #registr .main .registrDiv ul li.two input { width: 11.041668vw; margin-right: 1.04166vw; } #registr .main .registrDiv ul li.two select { padding: 0.729166vw 0 0.729166vw 0.729166vw; font-size: 0.83333vw; width: 12.7vw; margin-right: 1.04166vw; background: url('/images/downarrow.png') 10.677083vw center no-repeat #fff; background-size: 1.25vw 1.25vw; border-radius: 0.2vw; } #registr .main .registrDiv ul li.password { position: relative; width: 26.44166vw; } #registr .main .registrDiv ul li .showPassword { cursor: pointer; width: 1.25vw; height: 1.25vw; background-size: cover; position: absolute; right: 0.625vw; bottom: calc(50% - 0.625vw); } #registr .main .registrDiv ul li .showSurePassword { cursor: pointer; width: 1.25vw; height: 1.25vw; background-size: cover; position: absolute; right: 0.625vw; bottom: calc(50% - 0.625vw); } #registr .main .registrDiv .note { display: block; margin: 1.325vw 0; color: #ed7d31; font-size: 0.8333vw; text-align: left; } #registr .main .registrDiv .privacy { position: relative; padding-left: 1.822916vw; } #registr .main .registrDiv .privacy span { border: 1px solid #000; display: block; width: 1.25vw; height: 1.25vw; position: absolute; left: 0; top: calc(50% - 0.625vw); } #registr .main .registrDiv .privacy span.checked::after { display: block; content: ""; text-align: center; width: 0.4vw; height: 0.8vw; border-color: #000; border-style: solid; border-width: 0 0.15vw 0.15vw 0; transform: translateX(-50%) rotate(45deg); position: absolute; left: 50%; top: 0; } #registr .main .registrDiv .getCode { min-width: 4.16666vw; font-size: 0.83333vw; padding: 0.625vw 1.04166vw; color: #fff; background: #007D40; text-align: center; cursor: pointer; } #registr .main .registrDiv .btnRegistr { color: #fff; background: #007D40; font-size: 0.83333vw; padding: 0.6510416vw 0; text-align: center; margin-top: 1.25vw; width: 26.04166vw; cursor: pointer; } .privacyText { position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 999; background: rgba(0, 0, 0, 0.5); display: none; align-items: center; } .privacyText .privacyInfoDiv { width: 800px; margin: 0 auto; background: #fff; border-radius: 5px; padding: 40px 30px; } .privacyText .privacyInfoDiv .privacyInfoTitle { text-align: right; } .privacyText .privacyInfoDiv .privacyInfoTitle h3 { font-size: 24px; text-align: center; font-weight: bold; color: black; margin: 0 0 20px; } .privacyText .privacyInfoDiv .privacyInfoTitle .time { font-size: 14px; text-align: right; color: black; margin: 0 0 20px; display: inline-block; } .privacyText .privacyInfoDiv .privacyInfoText { height: 350px; overflow-y: auto; border: 1px solid #bdbdbd; } .privacyText .privacyInfoDiv .privacyInfoText .privacy-content { padding: 15px; } .privacyText .privacyInfoDiv .privacyInfoText p { font-size: 14px; color: black; line-height: 1.4; margin: 0; padding: 10px; text-align: left; } .privacyText .privacyInfoDiv .privacyInfoText table { border-collapse: collapse; margin: 20px 0; } .privacyText .privacyInfoDiv .privacyInfoText table tr td { font-size: 12px; border: 1px solid black; padding: 5px; word-break: break-word; } .privacyText .scroll-tips { font-size: 14px; text-align: center; padding-top: 20px; } .privacyText .privacy-btn { padding-top: 20px; display: flex; justify-content: center; } .privacyText .privacy-btn button { outline: none; border: 1px solid #bdbdbd; height: 37px; background: #fff; padding: 0 20px; margin: 0 20px; font-size: 14px; color: black; transition: all 0.2s; } .privacyText .privacy-btn .refuse { cursor: pointer; } .privacyText .privacy-btn .agree { color: #fff; background: #007D40; opacity: 0.5; cursor: not-allowed; } .privacyText .privacy-btn .agree.no-disabled { cursor: pointer; opacity: 1; } @media (max-width: 767px) { #registr .main { flex-wrap: wrap; } #registr .main .imgregistr { width: 100%; } #registr .main .imgregistr h4 { position: static; font-size: 7.314814vw; color: #000; left: 0; transform: none; padding: 4.629vw 5.55555vw; } #registr .main .registrDiv { width: 100%; margin: 4.629vw 5.55555vw; } #registr .main .registrDiv p { font-size: 3.8888vw; margin-bottom: 4.629vw; } #registr .main .registrDiv ul li { flex-wrap: wrap; margin-bottom: 4.259259vw; } #registr .main .registrDiv ul li input { outline: 0px; -webkit-appearance: none; font-size: 3.88888vw; border: 1px solid #000; width: 100%; padding: 2.407407vw 3.518518vw; } #registr .main .registrDiv ul li select { outline: 0px; -webkit-appearance: none; border: 1px solid #000; } #registr .main .registrDiv ul li select option { font-size: 3.88888vw; } #registr .main .registrDiv ul li.two input { flex: 1; width: 50%; margin-right: 3.6vw; } #registr .main .registrDiv ul li.two input:last-child { margin: 0; } #registr .main .registrDiv ul li.two input[name=telMobile] { width: 100%; flex: auto; margin-right: 0; margin-bottom: 4.259259vw; } #registr .main .registrDiv ul li.two select { flex: 1; width: 50%; margin-right: 3.6vw; font-size: 3.88888vw; padding: 2.407407vw 3.518518vw; color: #666666; background: url(/images/downarrow.png) 34.7222vw center no-repeat #fff; background-size: 5.1851vw 5.1851vw; border-radius: 1vw; } #registr .main .registrDiv ul li.two select:last-child { margin: 0; } #registr .main .registrDiv ul li .showPassword { width: 5.18518vw; height: 5.18518vw; bottom: calc(50% - 2.59259vw); right: 2.592592vw; } #registr .main .registrDiv ul li .showSurePassword { width: 5.18518vw; height: 5.18518vw; bottom: calc(50% - 2.59259vw); right: 2.592592vw; } #registr .main .registrDiv ul li.password { width: 100%; } #registr .main .registrDiv .getCode { padding: 2.1777vw 4.9537vw; font-size: 3.88888vw; } #registr .main .registrDiv .note { font-size: 3.8888vw; } #registr .main .registrDiv .privacy { padding: 0 0 0 10.33333vw; } #registr .main .registrDiv .privacy span { width: 5.37037vw; height: 5.37037vw; top: calc(50% - 2.685185vw); left: 0; } #registr .main .registrDiv .privacy span.checked::after { font-family: arial; display: block; content: ""; width: 2vw; height: 4vw; border-color: #000; border-style: solid; border-width: 0 0.55vw 0.55vw 0; transform: translateX(-50%) rotate(45deg); position: absolute; left: 50%; top: 0; } #registr .main .registrDiv .btnRegistr { width: 100%; padding: 2.7777vw 0; font-size: 3.88888vw; margin-top: 4.629vw; } #login .main { width: auto; padding: 4.629vw 5.55555vw; } #login .main h3 { font-size: 7.3148vw; text-align: left; margin-bottom: 5.5vw; } #login .main ul li { margin-bottom: 4.259259vw; } #login .main ul li input { outline: 0px; -webkit-appearance: none; font-size: 3.88888vw; border: 1px solid #000; width: 100%; padding: 2.407407vw 3.518518vw; } #login .main ul li .getCode { padding: 2.1777vw 4.9537vw; font-size: 3.88888vw; } #login .main ul li.password .showPassword { width: 5.18518vw; height: 5.18518vw; bottom: calc(50% - 2.59259vw); right: 2.592592vw; } #login .main ul li.password .showNewPassword { width: 5.18518vw; height: 5.18518vw; bottom: calc(50% - 2.59259vw); right: 2.592592vw; } #login .main ul li.password .showConfirmNewPassword { width: 5.18518vw; height: 5.18518vw; bottom: calc(50% - 2.59259vw); right: 2.592592vw; } #login .main ul li p { font-size: 3.8888vw; } #login .main p.note { display: block; color: #ed7d31; font-size: 3.88888vw; text-align: left; } #login .main .btnLogin { width: 100%; padding: 2.7777vw 0; font-size: 3.88888vw; margin-top: 12.037037vw; } #login .main .btnresetpassword { width: 100%; padding: 2.7777vw 0; font-size: 3.88888vw; margin-top: 12.037037vw; } .privacyText .privacyInfoDiv { width: 90%; border-radius: 6px; padding: 20px 15px; } .privacyText .privacyInfoDiv .privacyInfoTitle h3 { font-size: 14px; margin: 0 0 10px; padding: 10px 0; } .privacyText .privacyInfoDiv .privacyInfoTitle .time { font-size: 12px; padding: 5px; } .privacyText .privacyInfoDiv .privacyInfoText { height: 200px; overflow-y: auto; border: 1px solid #bdbdbd; } .privacyText .privacyInfoDiv .privacyInfoText .privacy-content { padding: 10px; } .privacyText .privacyInfoDiv .privacyInfoText p { font-size: 12px; padding: 5px; } .privacyText .privacyInfoDiv .privacyInfoText table { margin: 10px 0; } .privacyText .privacyInfoDiv .privacyInfoText table tr td { font-size: 12px; padding: 5px; word-break: keep-all; } .privacyText .scroll-tips { font-size: 12px; padding-top: 10px; } .privacyText .privacy-btn { padding-top: 10px; } .privacyText .privacy-btn button { height: 30px; padding: 0 20px; margin: 0 10px; font-size: 12px; } }