[v-cloak] { display: none; } .privacy-content{ position: fixed; height: 100vh; width: 100vw; top:0; left: 0; background: rgba(0, 0, 0, .8); display: flex; justify-content: center; align-items: center; z-index: 999; } .privacy-content .box{ padding: 20px; border-radius: 10px; height: 80vh; width: 40vw; background-color: #fff; } .text-center{ text-align: center; } .padding-top{ padding-top: 20px; } .main-title-content { width: 100%; height: 100%; background: rgba(0, 0, 0, .4); color: #fff; box-sizing: border-box; padding: 9rem 23rem; } h1 { font-size: 4.38rem; font-weight: 600; } h3 { font-size: 1.63rem; letter-spacing: 0.2rem; font-weight: 400; margin-top: 2.5rem; } .contactUs { width: 100%; background: #fff; padding: 7rem 23rem; box-sizing: border-box; max-width: 1920px; margin: 0 auto; } .contactoption { display: flex; justify-content: space-between; } .triangle{ border-bottom: 15px solid #FAFAFA; border-left: 15px solid transparent; border-right: 15px solid transparent; position: absolute; left: 20px; top: -15px; } .contactitem { /* margin: 0 2rem; */ cursor: pointer; position: relative; } @keyframes searchLights { 0% { left: -3.125rem; top: 1rem; } 100% { left: 3.125rem; top: 4.125rem; } } .contactitem > img { display: block; width: 6.25rem; height: 6.25rem; margin: 0 auto 1rem; } .contact-title { font-size: 1rem; color: rgba(102, 102, 102, 1); text-align: center; } .contactitem-active{ color: rgba(51, 51, 51, 1); } .contact-content { width: 100%; padding: 3rem 5rem; box-sizing: border-box; background: #FAFAFA; margin-top: 2rem; position: relative; } .customer-contact { display: flex; } .customer-contact-item { width: 50%; } .customer-contact-item-title { font-size: 1.25rem; font-weight: 600; color: rgba(7, 163, 89, 1); margin-bottom: 0.75rem; } .customer-contact-item-text { font-size: 1rem; line-height: 2; color: rgba(102, 102, 102, 1); text-align: justify; margin-bottom: 0.75rem; } .customer-contact-item-tel-first { background: #07A359; color: #fff; box-sizing: border-box; padding: 1rem 1rem 1rem 3.5rem; display: inline-block; /* background: url(); */ box-shadow: 0px 0px 6.5px rgba(7, 163, 89, 0.1), 0px 0px 8.1px rgba(7, 163, 89, 0.1), 0px 0px 14px rgba(7, 163, 89, 0.1); } .customer-contact-item-tel { background: #07A359; color: #fff; box-sizing: border-box; padding: 0.5rem 2.5rem 0.5rem 1rem; display: inline-block; /* background: url(); */ box-shadow: 0px 0px 6.5px rgba(7, 163, 89, 0.1), 0px 0px 8.1px rgba(7, 163, 89, 0.1), 0px 0px 14px rgba(7, 163, 89, 0.1); } .customer-contact-right { padding-left: 2rem; box-sizing: border-box; } .customer-contact-item-text > span { opacity: 0; } .customer-contact-item-title > span { opacity: 0; } .formbox { margin-top: 3rem; width: 100%; } .input-box { display: flex; flex-wrap: wrap; justify-content: space-between; } .input-item { display: flex; align-items: center; margin-top: 1rem; } .input-title { width: 40%; color: rgba(51, 51, 51, 1); padding-left: 1rem; position: relative; } .input-item { width: 30%; } .input-item > input { width: 70%; /* height: 2.5rem; padding: 0.6rem; box-sizing: border-box; background: rgba(250, 250, 250, 1); font-size: 1rem; border: 0.06rem solid rgba(209, 209, 209, 1); } .input-item>input::-webkit-input-placeholder { /* WebKit browsers,webkit内核浏览器 */ color: #A6A7A9; font-size: 1rem; } .input-item > input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #A6A7A9; font-size: 1rem; } .input-item > input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #A6A7A9; font-size: 1rem; } .input-item > input:-ms-input-placeholder { /* Internet Explorer 10+ */ color: #A6A7A9; font-size: 1rem; } .requiredicon { color: #DF7167; position: absolute; top: 0; left: 0; } .question-title { margin-top: 2.5rem; position: relative; } .required-title { padding-left: 1rem; } .checkbox-box { display: flex; margin-top: 1.25rem; align-items: center; } .checkbox-item { margin-right: 3.75rem; } .textarea-box { margin-top: 1.25rem; width: 100%; } textarea { resize: none; width: 100%; height: 7.5rem; background: #FAFAFA; border: 1px solid #D1D1D1; box-sizing: border-box; padding: 0.75rem; } .green-font { color: #07A359; cursor: pointer; } .submit { width: 180px; height: 40px; border-radius: 100px; background: #07A359; color: #fff; text-align: center; line-height: 40px; margin: 0 auto; } .btn-box { width: 100%; margin-top: 3rem; } .btn { width: 11.25rem; height: 2.5rem; opacity: 1; border-radius: 1.25rem; background: rgba(7, 163, 89, 1); display: flex; justify-content: center; } .flex-center { display: flex; justify-content: center; align-items: center; text-decoration: none; } .text-center { text-align: center; } .cell-100 { width: 100%; } .haiwai { background: url('../../images/about/haiwai.png') no-repeat center center; background-size: 100% 100%; padding: 3rem 5rem; margin-top: 2rem; } .first { border-radius: 1.75rem; position: absolute; left: 1rem; top: 0.25rem; } .call-icon { display: flex; position: relative; } .call-icon .call-icon-left { height: 4rem; z-index: 9; } input[type=radio] { width: 16px; height: 16px; margin-top: 2px; position: relative; } input[type=radio]::after { position: absolute; top: 0; color: #000; width: 16px; height: 16px; display: inline-block; visibility: visible; padding-left: 0px; text-align: center; content: ' '; border-radius: 25px; } input[type=radio]:checked::after { content: "✓"; color: #fff; font-size: 10px; line-height: 15px; background-color: rgb(7, 163, 89); } input[type=checkbox] { width: 16px; height: 16px; margin-top: 2px; position: relative; } input[type=checkbox]::after { position: absolute; top: 0; color: #000; width: 16px; height: 16px; display: inline-block; visibility: visible; padding-left: 0px; text-align: center; content: ' '; border-radius: 2px; } input[type=checkbox]:checked::after { content: "✓"; color: #fff; font-size: 10px; line-height: 15px; background-color: rgb(7, 163, 89); } .flex-center { display: flex; justify-content: center; align-items: center; } @media screen and (max-width: 1023px) { .contactUs { padding: 8rem 10rem; } } @media screen and (max-width: 750px) { .haiwai{ padding: 10px 16px } .first { left: 11px; top: 2px; padding-left:18px; padding-right: 10px; } .call-icon .call-icon-left { height: 28px; z-index: 9; } .main-title { width: 100%; height: 37.19rem; } .contactitem > img { display: block; width: 11.25rem; height: 11.25rem; } .contact-content { margin-top: 15px; padding: 10px 16px; } .customer-contact-item { width: 100%; } .customer-contact { display: block; } .customer-contact-right { padding: 0; margin-top: 15px; } .input-box { display: block; } .input-item { width: 100%; margin: 6px 0; } .input-item > input { height: 26px; } .input-title { padding-left: 12px; } .checkbox-box { flex-wrap: wrap; } .checkbox-item { width: 25%; margin-bottom: 10px; } textarea { height: 23rem; } .customer-contact-item-title { margin-bottom: 8px; } .customer-contact-item-tel { padding: 5px 12px; } .contact-title, .customer-contact-item-text, .customer-contact-item-tel, .customer-contact-item-tel-first, .formbox, .submit { font-size: 12px; } .customer-contact-item-title { font-size: 16px; } .input-item > input::-webkit-input-placeholder { /* WebKit browsers,webkit内核浏览器 */ color: #A6A7A9; font-size: 12px; } .input-item > input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #A6A7A9; font-size: 12px; } .input-item > input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #A6A7A9; font-size: 12px; } .input-item > input:-ms-input-placeholder { /* Internet Explorer 10+ */ color: #A6A7A9; font-size: 12px; } .customer-contact-item-title > span { display: none; } .btn { /* width: 11.25rem; */ /* height: 2.5rem; */ /* opacity: 1; */ border-radius: 1.25rem; background: rgba(7, 163, 89, 1); /* display: flex; */ /* justify-content: center; */ box-sizing: border-box; width: auto; height: auto; margin-top: 10px; } .flex-center > img { width: 12px !important; height: 12px !important; } }