﻿.common-main.contact-us{padding:0}
.contact-us .l-wrap{max-width:100%;padding:0}
.pagesbanner .pagesbanner-animate .p1{font-weight:600;font-size:30px;color:#fff;line-height:48px}
.pagesbanner-animate .txt{font-weight:400;font-size:20px;color:#fff;line-height:48px}
.l-wraps{max-width:1570px;margin:0 auto}
.contact-page1 .l-wraps{display:flex;justify-content:space-between}
.contact-page1{padding:95px 0}
.page-title h2,.page-title h3,.page-title h4,.page-title h5{font-weight:600;font-size:26px;color:#000003;line-height:1;margin:20px 0}
.page1-right{width:47.5%;background:#f6f6f6;border-radius:20px;padding:70px 55px 55px;box-sizing:border-box}
.page1-left{width:45%}
.page-dev{height:5px;background:var(--color);width:60px;position:relative}
.page-title p{max-width:1045px;margin:0 auto}
.page-dev::after{content:'';position:absolute;width:30px;height:5px;background:#000;left:0}
.page1-list{margin-top:30px;margin-bottom:50px}
.page1-item{display:flex;align-items:center;margin-bottom:22px}
.page1-boxs{width:60px;height:60px;background:rgba(82,192,51,.1);border-radius:5px;border:1px solid rgba(82,192,51,.31);display:flex;justify-content:center;align-items:center;margin-right:22px}
.page1-text{flex: 1;}
.page1-boxs em{font-size:26px;width:26px;line-height:1;color:var(--color)}
.page1-text p{font-weight:600;font-size:18px;color:#000003;line-height:26px}
.page1-text a{font-size:18px;color:#555;line-height:1;margin-top:10px;display:block}
.page1-all{display:flex;flex-wrap:wrap}
.page1-box{display:flex;width:48%;align-items:center}
.page1-box .icon{margin-right:20px;transition: all .3s ease-in-out;}
.page1-box .icon em{font-size:26px;width:26px;display:block;line-height:1;color:var(--color)}
.page1-box .text a{font-size:18px;color:#1f69e0;line-height:48px}
.page1-feed{margin-top:25px}
.page1-feed .wmkcfeedback .wmkcfb-fileupload,.page1-feed .wmkcfeedback input,.page1-feed .wmkcfeedback textarea{background:#fff}
.page1-feed .wmkcfeedback .send-btn{margin:unset}
.page1-t{color:#555;font-style:italic;margin-top:45px}
.contact-page2{padding:90px 0;background:#f6f6f6}
.contact-page2 .page-title{text-align:center}
.contact-page2 .page-dev{margin:0 auto}
.page2-list{display:flex;justify-content:space-between;margin-top:60px}
.page2-item{background:#fff;border-radius:20px;border:1px solid #e5e8e8;width:23.5%;padding:33px 35px;transition: all .3s ease-in-out;}
.page2-icon{width:70px;height:70px;background:var(--color);border-radius:50%;display:flex;justify-content:center;align-items:center;transition: all .3s ease-in-out;}
.page2-icon em{font-size:32px;width:32px;color:#fff;line-height:1;font-weight:500;transition: all .3s ease-in-out;}
.page2-text{margin-top:40px}
.page2-text .p1{font-weight:600;font-size:20px;color:#111}
.page2-text .p2{font-size:16px;color:#555;line-height:26px;margin-top:25px}
.contact-page3{padding:90px 0}
.contact-page3 .l-wraps{display:flex;justify-content:space-between;align-items:center}
.page3-left{width:50%}
.page3-right{width:45%;padding:70px 50px;background:#fff;box-shadow:3px 3px 21px 3px rgba(229,229,229,.76);border-radius:3px}
.contact-page3 .page-title{text-align:center}
.contact-page3 .page-dev{margin:0 auto}
.page3-text .p1{font-size:26px;color:var(--color);line-height:1.25;margin-bottom:20px;font-weight:700}
.page3-list{margin:40px 0 30px}
.page3-li{display:flex;align-items:baseline;margin-bottom:10px}
.page3-li p{flex: 1;}
.page3-dev{width:15px;height:15px;border:1px solid var(--color);border-radius:100%;margin-right:13px;transform:translateY(8px);position:relative}
.page3-dev::after{position:absolute;content:'';width:5px;height:5px;background:var(--color);top:50%;left:50%;overflow:hidden;border-radius:100%;transform:translate(-50%,-50%)}
.page2-item:hover{background: var(--color);}
.page2-item:hover .page2-icon{background: #fff;}
.page2-item:hover .page2-icon em{color: var(--color);}
.page2-item:hover .page2-text p{color: #fff;}
.page1-box:hover .icon em{transform: scale(1.02);}
@media (max-width:1620px) {
    .l-wraps{padding: 0 50px;}
}
@media (max-width:1366px) {
    .page1-left{width: 50%;}
    .contact-page1,.contact-page3,.contact-page2{padding: 50px 0;}
    .page2-list{margin-top: 30px;}
    .page2-item{width: 24%;padding: 25px 20px;}
    .page2-text{margin-top: 20px;}
    .page2-text .p2{margin-top: 15px;}
    .page1-right{padding: 50px 35px;}
}
@media (max-width:1024px) {
    .contact-page1, .contact-page3, .contact-page2 {padding: 35px 0;}
    .page-title h2, .page-title h3, .page-title h4, .page-title h5{font-size: 22px;}
    .l-wraps{padding: 0 30px;}
    .contact-page1 .l-wraps{flex-direction: column;}
    .page1-left{width: 100%;}
    .page1-right {padding: 40px 25px;width: 100%;margin-top: 25px;}
    .page2-list{flex-wrap: wrap;}
    .page2-item{width: 49%;margin-bottom: 2%;}
    .page2-icon{width: 60px;height: 60px;}
    .page2-icon em{font-size: 26px;width: 26px;}
    .contact-page3 .l-wraps{flex-direction: column;}
    .page3-left{width: 100%;}
    .page3-right {width: 100%;padding: 40px 35px;}
     .page1-t{margin-top: 30px;}
}
@media (max-width:768px) {
    .l-wraps {padding: 0 15px;}
    .page2-text .p1{font-size: 18px;}
    .page2-text .p2 {margin-top: 10px;}
    .page3-right{padding: 30px 25px;}
    .page3-text .p1{font-size: 20px;margin-bottom: 10px;}
    .page3-list {margin: 20px 0 15px;}
}
@media (max-width:550px) {
    .page1-text a{margin-top: 5px;font-size: 16px;}
    .page1-boxs{width: 50px;height: 50px;margin-right: 20px;}
    .page1-boxs em{font-size: 20px;width: 20px;}
    .page1-box{width: 100%;}
    .page1-right {padding: 20px 10px;margin-top: 10px;}
    .page1-t{margin-top: 15px;}
    .page2-item{width: 100%;}
    .page3-right {padding: 20px 15px;}
}