.contact_cot { background-color: #fff; width: 100% } 

.contact_cot .head { position: relative } 

.contact_cot .head>img { width: 100% } 

.contact_cot .head .logo { left: 60px; position: absolute; top: 40px } 

.contact_cot .head .logo img { width: 130px } 

@media screen and (max-width:1024px) { 
 .contact_cot .head .logo { left: 10px; top: 10px } 

 .contact_cot .head .logo img { width: 80px } 
 } 

.contact_cot .head .home { align-items: flex-end; display: flex; flex-direction: column; position: absolute; right: 60px; top: 40px } 

.contact_cot .head .home p { color: #000;font-weight:bold; font-size: 20px; margin-bottom: 10px } 

.contact_cot .head .home span { background-color: #fff; display: block; height: 2px; width: 30px } 

@media screen and (max-width:1024px) { 
 .contact_cot .head .home { right: 10px; top: 10px } 

 .contact_cot .head .home p { font-size: 14px; margin-bottom: 10px } 
 } 

.contact_cot .about { align-items: center; background-color: #fff; display: flex; flex-direction: column; padding: 138px 0 } 

@media screen and (max-width:1024px) { 
 .contact_cot .about { flex-direction: column; padding: 20px; width: calc(100% - 40px) !important; } 
 } 

.contact_cot .about h1 { color: #333; font-size: 38px; font-weight: 800; margin-bottom: 70px; text-align: center } 

@media screen and (max-width:1024px) { 
 .contact_cot .about h1 { font-size: 18px; margin-bottom: 20px } 
 } 

.contact_cot .about .about_cot { width: 100% } 
.contact_cot .about .about_cot b { font-size: 24px; } 

@media screen and (max-width:1024px) { 
 .contact_cot .about .about_cot { flex-direction: column; width: 100% } 
 } 

.contact_cot .about .about_cot p { color: #000; font-size: 16px; line-height: 26px; margin-right: 100px } 

@media screen and (max-width:1024px) { 
 .contact_cot .about .about_cot p { margin-right: 0 } 
 } 

.contact_cot .about .video { height: 336px; position: relative; width: 553px } 

.contact_cot .about .video img { border-radius: 4px; height: 336px; width: 553px } 

.contact_cot .about .video button { background-color: #00000080; border-radius: 4px; color: #fff; cursor: pointer; height: 48px; left: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%); transition: all .3s; width: 68px } 

.contact_cot .about .video button .iconfont { font-size: 22px } 

.contact_cot .about .video button:hover { background-color: red } 

.contact_cot .about .video iframe { border: none; border-radius: 4px; height: 336px; width: 553px } 

@media screen and (max-width:1024px) { 
 .contact_cot .about .video { margin-left: 0; margin-top: 20px } 

 .contact_cot .about .video,
 .contact_cot .about .video iframe,
 .contact_cot .about .video img { height: unset; width: 100% } 
 } 

.contact_cot .develop { align-items: center; background: url(../assets/develop.png) no-repeat; background-size: cover; display: flex; flex-direction: column; padding-top: 113px } 

@media screen and (max-width:1024px) { 
 .contact_cot .develop { background-size: 100% 100% } 
 } 

.contact_cot .develop .map { height: 739px; margin-bottom: 102px; margin-top: 118px } 

.contact_cot .develop .map img { width: 100% } 

@media screen and (max-width:1024px) { 
 .contact_cot .develop .map { height: unset; margin-bottom: 20px; margin-top: 20px; width: 100% } 

 .contact_cot .develop .map img { width: 100% } 
 } 

.contact_cot .develop .title { color: #fff; font-size: 38px; font-weight: 900 } 

@media screen and (max-width:1024px) { 
 .contact_cot .develop .title { font-size: 14px } 
 } 

.contact_cot .develop .info { color: #fff; font-size: 14px; line-height: 24px; margin-top: 50px; text-align: left; width: 1000px } 

@media screen and (max-width:1024px) { 
 .contact_cot .develop .info { font-size: 12px; margin-top: 0; width: 100% } 
 } 

.contact_cot .pillars { align-items: center; display: flex; flex-direction: column; padding-top: 136px; width: 100% } 

@media screen and (max-width:1024px) { 
 .contact_cot .pillars { overflow: hidden; padding-top: 40px } 
 } 

.contact_cot .pillars h1 { color: #333; font-size: 38px; font-weight: 900 } 

@media screen and (max-width:1024px) { 
 .contact_cot .pillars h1 { font-size: 16px; margin-bottom: 20px } 
 } 

.contact_cot .pillars .pillars-cot { display: flex; justify-content: space-between; padding: 76px 0; width: 1400px } 

.contact_cot .pillars .pillars-cot div { align-items: center; cursor: pointer; display: flex; flex-direction: column; justify-content: center; text-align: center } 

.contact_cot .pillars .pillars-cot div p { margin-top: 20px } 

.contact_cot .pillars .pillars-cot div .active { color: #3c9 } 

@media screen and (max-width:1024px) { 
 .contact_cot .pillars .pillars-cot { padding: 40px 0; width: 100% } 

 .contact_cot .pillars .pillars-cot div { width: 100% } 

 .contact_cot .pillars .pillars-cot div p { font-size: 12px; height: 60px; width: 60px } 

 .contact_cot .pillars .pillars-content img { width: 100% } 
 } 

.contact_cot .history,
.contact_cot .history img { width: 100% } 

@media screen and (max-width:1024px) { 
 .contact_cot .history { padding: 0 } 
 } 

.contact_cot .culture { align-items: center; background: url(../assets/bgc.png) no-repeat; background-size: cover; display: flex; flex-direction: column; height: 632px; margin-bottom: 150px; padding-top: 140px; width: 100% } 

.contact_cot .culture h3 { color: #fff; font-size: 38px; font-weight: 900; margin-bottom: 40px } 

.contact_cot .culture .pic { display: flex; justify-content: space-between } 

.contact_cot .culture .pic>div .mgl { margin-right: 21px } 

@media screen and (max-width:1024px) { 
 .contact_cot .culture { margin-bottom: 20px; padding-top: 20px; width: 100% } 

 .contact_cot .culture h3 { font-size: 16px; margin-bottom: 20px } 

 .contact_cot .culture .pic { flex-wrap: wrap; height: unset; width: calc(100vw - 20px) } 

 .contact_cot .culture .pic>div { height: unset; width: 100% } 

 .contact_cot .culture .pic>div .mgl { margin-bottom: 10px; margin-right: 0 } 

 .contact_cot .culture .pic>div img { height: unset; width: 100% } 
 } 

.contact_cot .brand { align-items: center; background-color: #fff; display: flex; flex-direction: column; padding-bottom: 123px; width: 100% } 

@media screen and (max-width:1024px) { 
 .contact_cot .brand { padding: 60px 0 } 
 } 

.contact_cot .brand h3 { color: #333; font-size: 38px; font-weight: 900; margin-bottom: 60px } 

@media screen and (max-width:1024px) { 
 .contact_cot .brand h3 { font-size: 16px; margin-bottom: 40px } 
 } 

.contact_cot .brand .icon { align-items: center; display: flex; margin-bottom: 30px } 

@media screen and (max-width:1024px) { 
 .contact_cot .brand .icon { justify-content: space-between; padding: 0 20px } 
 } 

.contact_cot .brand .icon img { margin: 0 325px } 

@media screen and (max-width:1024px) { 
 .contact_cot .brand .icon img { margin: 0; width: 100% } 
 } 

.contact_cot .brand .icon p { color: #333; font-size: 24px; font-weight: 700 } 

@media screen and (max-width:1024px) { 
 .contact_cot .brand .icon p { display: none } 
 } 

.contact_cot .brand .contact_cot,
.contact_cot .brand .contact_cot img { width: 100% } 

.contact_cot .advantage { align-items: center; background-color: #f6f6f6; display: flex; flex-direction: column; padding-top: 89px } 

@media screen and (max-width:1024px) { 
 .contact_cot .advantage { padding: 60px 0 } 
 } 

.contact_cot .advantage>h3 { color: #333; font-size: 38px; font-weight: 900; margin-bottom: 82px } 

@media screen and (max-width:1024px) { 
 .contact_cot .advantage>h3 { font-size: 16px; margin-bottom: 30px } 
 } 

.contact_cot .advantage .advantag-cot { align-items: center; display: flex; justify-content: space-between } 

.contact_cot .advantage .advantag-cot div { align-items: center; display: flex; flex-direction: column; margin-right: 82px } 

.contact_cot .advantage .advantag-cot div:last-child { margin-right: 0 } 

.contact_cot .advantage .advantag-cot div p { color: #666; font-size: 22px; font-weight: 700; margin-top: 38px } 

@media screen and (max-width:1024px) { 
 .contact_cot .advantage .advantag-cot div p { font-size: 14px } 

 .contact_cot .advantage .advantag-cot { flex-wrap: wrap } 

 .contact_cot .advantage .advantag-cot div { margin-bottom: 40px; margin-right: 0; width: 100% } 
 } 

.contact_cot .exhibition { align-items: center; background-color: #f6f6f6; display: flex; flex-direction: column; padding: 140px 0; width: 100% } 

@media screen and (max-width:1024px) { 
 .contact_cot .exhibition { padding: 0 } 
 } 

.contact_cot .exhibition>h3 { color: #333; font-size: 38px; font-weight: 900; margin-bottom: 82px } 

@media screen and (max-width:1024px) { 
 .contact_cot .exhibition>h3 { font-size: 16px; margin-bottom: 30px } 
 } 

.contact_cot .exhibition .pc { position: relative } 

.contact_cot .exhibition .pc img { height: unset } 

.contact_cot .exhibition .pc p { color: #fff; font-size: 16px; left: 100px; line-height: 26px; position: absolute; top: 85px; width: 330px; z-index: 10 } 

@media screen and (max-width:1024px) { 
 .contact_cot .exhibition .pc { display: none } 
 } 

.contact_cot .exhibition .h5 { display: none } 

@media screen and (max-width:1024px) { 
 .contact_cot .exhibition .h5 { display: block; position: relative } 

 .contact_cot .exhibition .h5 img { height: unset; width: 100% } 

 .contact_cot .exhibition .h5 p { color: #fff; font-size: 12px; left: 0; line-height: 20px; padding: 20px; position: absolute; top: 0 } 
 } 

.contact_cot .certif { align-items: center; background-color: #fff; display: flex; flex-direction: column; margin-bottom: 133px } 

.contact_cot .certif>h3 { color: #333; font-size: 38px; font-weight: 900; margin-bottom: 40px; margin-top: 135px } 

@media screen and (max-width:1024px) { 
 .contact_cot .certif>h3 { font-size: 16px; margin-top: 40px } 
 } 

.contact_cot .certif>p { color: #000; font-size: 16px; line-height: 24px; margin-bottom: 60px; text-align: center; width: 1000px } 

@media screen and (max-width:1024px) { 
 .contact_cot .certif>p { font-size: 12px; width: calc(100vw - 20px) } 
 } 

.contact_cot .certif>div { background: #fcfcfc; border: 1px solid #e6e6e6; display: flex; height: 402px; padding: 20px 0; width: 1400px } 

@media screen and (max-width:1024px) { 
 .contact_cot .certif>div { flex-wrap: wrap; height: 1600px; width: 100% } 
 } 

.contact_cot .certif>div .card { border-right: 1px solid #e6e6e6; flex: 1; overflow: hidden; position: relative } 

@media screen and (max-width:1024px) { 
 .contact_cot .certif>div .card { flex: unset; width: 100% } 
 } 

.contact_cot .certif>div .card:last-child { border: none } 

.contact_cot .certif>div .card .content,
.contact_cot .certif>div .card .title { align-items: center; backface-visibility: hidden; box-sizing: border-box; display: flex; flex-direction: column; height: 100%; left: 0; padding: 40px; position: absolute; top: 0; transition: transform 1s ease; width: 100% } 

.contact_cot .certif>div .card .title { transform: perspective(600px) rotateY(0) } 

.contact_cot .certif>div .card .title img { height: 100px } 

.contact_cot .certif>div .card .title b { color: #333; font-size: 24px; font-weight: 700; margin: 30px 0 } 

.contact_cot .certif>div .card .title p { color: #333; font-size: 14px; line-height: 18px; text-align: center } 

.contact_cot .certif>div .card .title .left { text-align: left } 

.contact_cot .certif>div .card .content { transform: perspective(600px) rotateY(-180deg) } 

.contact_cot .certif>div .card .content img { height: 100% } 

.contact_cot .certif>div .card:hover .title { transform: perspective(600px) rotateY(-180deg) } 

.contact_cot .certif>div .card:hover .content { transform: perspective(600px) rotateY(0) } 

.contact_cot .contact { align-items: center; background: url(../assets/content-bgc.png) no-repeat; background-size: cover; display: flex; flex-direction: column; padding: 120px 0 } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact { padding: 60px 0 } 
 } 

.contact_cot .contact>h3 { color: #fff; font-size: 38px; font-weight: 900; margin-bottom: 40px } 

.contact_cot .contact>p { color: #fff; font-size: 14px; margin-bottom: 60px } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>p { text-align: center } 
 } 

/* .contact_cot .contact>div>div { background: url(../assets/hongkong.png) no-repeat; background-size: cover; display: flex; height: 261px; justify-content: flex-end; margin-bottom: 20px; width: 1250px } */

@media screen and (max-width:1024px) { 
 /* .contact_cot .contact>div>div { background: #fff; width: 100% } */
 } 

/* .contact_cot .contact>div>div:nth-child(2) { background: url(../assets/canada.png) no-repeat } */

@media screen and (max-width:1024px) { 
 /* .contact_cot .contact>div>div:nth-child(2) { background: #fff; width: 100% } */
 } 

/* .contact_cot .contact>div>div:nth-child(3) { background: url(../assets/china.png) no-repeat } */

@media screen and (max-width:1024px) { 
 /* .contact_cot .contact>div>div:nth-child(3) { background: #fff; width: 100% } */
 } 

.contact_cot .contact>div>div>div { height: 100%; padding: 30px 40px; width: 560px } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>div>div>div { width: 100% } 
 } 

.contact_cot .contact>div>div>div .tit { align-items: flex-start; display: flex; justify-content: space-between; margin-bottom: 20px } 

.contact_cot .contact>div>div>div .tit .name { color: #333; display: flex; flex-direction: column; font-weight: 700 } 

.contact_cot .contact>div>div>div .tit .name b { font-size: 18px } 

.contact_cot .contact>div>div>div .tit .name p { font-size: 14px; margin-top: 12px } 

.contact_cot .contact>div>div>div .tit>div { display: flex } 

.contact_cot .contact>div>div>div .tit>div img { margin-left: 10px } 

.contact_cot .contact>div>div>div dl { display: flex; margin-bottom: 10px } 

.contact_cot .contact>div>div>div dl .iconfont { color: #666; font-size: 16px; margin-right: 10px } 

.contact_cot .contact>div>div>div dl span { color: #666; line-height: 24px } 

.contact_cot .contact { align-items: center; background: url(../assets/content-bgc.png) no-repeat; background-size: cover; display: flex; flex-direction: column; padding: 120px 0 } 

/* @media screen and (max-width:1024px) { 
 .contact_cot .contact { padding: 60px 0 } 
 } 

.contact_cot .contact>h3 { color: #fff; font-size: 38px; font-weight: 900; margin-bottom: 40px } 

.contact_cot .contact>p { color: #fff; font-size: 14px; margin-bottom: 60px } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>p { text-align: center } 
 } 

.contact_cot .contact>div>div { background: url(../assets/hongkong.png) no-repeat; background-size: cover; display: flex; height: 261px; justify-content: flex-end; margin-bottom: 20px; width: 1250px } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>div>div { background: #fff; width: 100% } 
 } 

.contact_cot .contact>div>div:nth-child(2) { background: url(../assets/canada.png) no-repeat } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>div>div:nth-child(2) { background: #fff; width: 100% } 
 } 

.contact_cot .contact>div>div:nth-child(3) { background: url(../assets/china.png) no-repeat } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>div>div:nth-child(3) { background: #fff; width: 100% } 
 } 

.contact_cot .contact>div>div>div { height: 100%; padding: 30px 40px; width: 560px } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>div>div>div { width: 100% } 
 } */

.contact_cot .contact>div>div>div .tit { align-items: flex-start; display: flex; justify-content: space-between; margin-bottom: 20px } 

.contact_cot .contact>div>div>div .tit .name { color: #333; display: flex; flex-direction: column; font-weight: 700 } 

.contact_cot .contact>div>div>div .tit .name b { font-size: 18px } 

.contact_cot .contact>div>div>div .tit .name p { font-size: 14px; margin-top: 12px } 

.contact_cot .contact>div>div>div .tit>div { display: flex } 

.contact_cot .contact>div>div>div .tit>div img { margin-left: 10px } 

.contact_cot .contact>div>div>div dl { display: flex; margin-bottom: 10px } 

.contact_cot .contact>div>div>div dl .iconfont { color: #666; font-size: 16px; margin-right: 10px } 

.contact_cot .contact>div>div>div dl span { color: #666; line-height: 24px } 

.contact_cot .contact { align-items: center; background: url(../assets/content-bgc.png) no-repeat; background-size: cover; display: flex; flex-direction: column; padding: 20px 0 } 

.contact_cot .contact>h3 { color: #fff; font-size: 20px; font-weight: 900; margin-bottom: 15px } 

.contact_cot .contact>p { color: #fff; font-size: 14px; line-height: 26px; margin-bottom: 20px; text-align: center } 

.contact_cot .contact>div { padding: 0 10px } 
/* 
.contact_cot .contact>div>div { background: #fff; border-radius: 16px; display: flex; height: 300px; justify-content: flex-end; margin-bottom: 20px; width: 100% } 

.contact_cot .contact>div>div>div { height: 100%; padding: 30px 40px; width: 100% } 

.contact_cot .contact>div>div>div .tit { align-items: flex-start; display: flex; justify-content: space-between; margin-bottom: 20px } 

.contact_cot .contact>div>div>div .tit .name { color: #333; display: flex; flex-direction: column; font-weight: 700 } 

.contact_cot .contact>div>div>div .tit .name b { font-size: 18px } 

.contact_cot .contact>div>div>div .tit .name p { font-size: 14px; margin-top: 12px } 

.contact_cot .contact>div>div>div .tit>div { display: flex } 

.contact_cot .contact>div>div>div .tit>div img { margin-left: 10px } 

.contact_cot .contact>div>div>div dl { display: flex; margin-bottom: 10px } 

.contact_cot .contact>div>div>div dl .iconfont { color: #666; font-size: 16px; margin-right: 10px } 

.contact_cot .contact>div>div>div dl span { color: #666; line-height: 24px } */

.contact_cot .contact { align-items: center; background: rgba(0,48,183,0.8) no-repeat; background-size: cover; display: flex; flex-direction: column; padding: 120px 0 } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact { padding: 60px 0 } 
 } 

.contact_cot .contact>h3 { color: #fff; font-size: 38px; font-weight: 900; margin-bottom: 40px } 

.contact_cot .contact>p { color: #fff; font-size: 14px; margin-bottom: 60px } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>p { text-align: center } 
 } 

/* .contact_cot .contact>div>div { background: url(../assets/hongkong.png) no-repeat; background-size: cover; display: flex; height: 261px; justify-content: flex-end; margin-bottom: 20px; width: 1250px } */

/* @media screen and (max-width:1024px) { 
 .contact_cot .contact>div>div { background: #fff; width: 100% } 
 } 

.contact_cot .contact>div>div:nth-child(2) { background: url(../assets/canada.png) no-repeat } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>div>div:nth-child(2) { background: #fff; width: 100% } 
 } 

.contact_cot .contact>div>div:nth-child(3) { background: url(../assets/china.png) no-repeat } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>div>div:nth-child(3) { background: #fff; width: 100% } 
 } 

.contact_cot .contact>div>div>div { height: 100%; padding: 30px 40px; width: 560px } 

@media screen and (max-width:1024px) { 
 .contact_cot .contact>div>div>div { width: 100% } 
 } */

.contact_cot .contact>div>div>div .tit { align-items: flex-start; display: flex; justify-content: space-between; margin-bottom: 20px } 

.contact_cot .contact>div>div>div .tit .name { color: #333; display: flex; flex-direction: column; font-weight: 700 } 

.contact_cot .contact>div>div>div .tit .name b { font-size: 18px } 

.contact_cot .contact>div>div>div .tit .name p { font-size: 14px; margin-top: 12px } 

.contact_cot .contact>div>div>div .tit>div { display: flex } 

.contact_cot .contact>div>div>div .tit>div img { margin-left: 10px } 

.contact_cot .contact>div>div>div dl { display: flex; margin-bottom: 10px } 

.contact_cot .contact>div>div>div dl .iconfont { color: #666; font-size: 16px; margin-right: 10px } 

.contact_cot .contact>div>div>div dl span { color: #666; line-height: 24px } 

.contact_cot { background-color:#fff; margin-bottom:30px } 

 .contact_cot .introduce { display:flex; } .contact_cot .introduce img { height:400px; margin-right:80px; width:432px } .contact_cot .introduce div { display:flex; flex-direction:column; justify-content:center; width:710px } .contact_cot .introduce div b { font-size:30px; font-weight:700; line-height:45px } .contact_cot .introduce div b span { color:#66b5fe } .contact_cot .introduce div p { color:#666; font-size:16px; line-height:22px; width:472px } .contact_cot .get_in_touch { margin-bottom:60px } .contact_cot .get_in_touch .title { align-items:center; display:flex; justify-content:center } .contact_cot .get_in_touch .title img { height:26px; width:54px } .contact_cot .get_in_touch .title span { color:#333; font-size:22px; font-weight:700; line-height:55px; margin-left:-20px } .contact_cot .get_in_touch .content { display:flex; flex-wrap:wrap; justify-content:center; position:relative } 
 .contact_cot .get_in_touch .content>div { height:275px; position:relative; width:537px } 
 .contact_cot .get_in_touch .content>div img { height:100%; width:100% } .contact_cot .get_in_touch .content>div .company_info { height:100%; left:40px; position:absolute; top:40px; width:100% } .contact_cot .get_in_touch .content>div .company_info b { display:block; font-size:18px; margin-bottom:15px } .contact_cot .get_in_touch .content>div .company_info p { display:flex; margin-bottom:15px; width:370px } .contact_cot .get_in_touch .content>div .company_info p img { height:18px; margin-right:6px; width:18px } .contact_cot .get_in_touch .content>div .company_info p a,.contact_cot .get_in_touch .content>div .company_info p span { color:#333; font-size:14px; line-height:24px; margin-top:-2px } .contact_cot .get_in_touch .content>div .company_info p a { color:#4066b8 } .contact_cot .get_in_touch .content>div .company_info p a:hover { text-decoration:underline } .contact_cot .get_in_touch .content>div.canada { margin-left:-50px } .contact_cot .get_in_touch .content>div.canada .company_info { left:100px } .contact_cot .get_in_touch .content>div.china { border-radius:4px; box-shadow:0 0 9px -4px #ccc; height:275px; margin-top:15px; padding:30px; width:997px } .contact_cot .get_in_touch .content>div.china .company_info { left:0; position:relative; top:0 } .contact_cot .get_in_touch .content>div.china .company_info>div { width:100% } .contact_cot .get_in_touch .content>div.china .company_info>div p { padding-right:20px; width:100% } .contact_cot .get_in_touch .content>div.china .company_info>div p.email { width:42% } .contact_cot .get_in_touch .content .RT { height:35px; position:absolute; right:100px; top:20px; width:65px; z-index:2 } .contact_cot .get_in_touch .content .LB { bottom:0px; height:35px; left:100px; position:absolute; width:65px } .contact_cot .site_map { padding:0 100px 100px; position:relative } .contact_cot .site_map .title { align-items:center; display:flex; margin-bottom:16px } .contact_cot .site_map .title img { height:26px; width:54px } .contact_cot .site_map .title span { color:#333; font-size:22px; font-weight:700; line-height:55px; margin-left:-15px } .contact_cot .site_map .follow { display:flex } .contact_cot .site_map .follow .btn { background-color:#fff; border-radius:15px; box-shadow:0 5px 15px -5px #0000001a; height:36px; line-height:36px; margin-right:16px; overflow:hidden; position:relative; text-align:center; width:36px } .contact_cot .site_map .follow .btn .iconfont { font-size:20px; transform:scale(.8); transition:all .4s cubic-bezier(.31,-.1,.43,1.59) } .contact_cot .site_map .follow .btn:before { content:""; height:120%; left:-110%; position:absolute; top:90%; transform:rotate(45deg); transition:all .4s cubic-bezier(.31,-.1,.43,1.59); width:120% } .contact_cot .site_map .follow .btn .icontwitte { color:#000; font-size:16px; font-weight:700 } .contact_cot .site_map .follow .btn.btn_tuite:before { background-color:#000 } .contact_cot .site_map .follow .btn .iconlinkedin { color:#0077b5 } .contact_cot .site_map .follow .btn.btn_linkedin:before { background-color:#0077b5 } .contact_cot .site_map .follow .btn .iconinstagram { color:#e45496 } .contact_cot .site_map .follow .btn.btn_instagram:before { background-color:#e45496 } .contact_cot .site_map .follow .btn .iconfacebook1 { color:#3c57a0; font-weight:700 } .contact_cot .site_map .follow .btn.btn_facebook:before { background-color:#3c57a0 } .contact_cot .site_map .follow .btn .iconYoutube-fill { color:red; font-size:26px; font-weight:700 } .contact_cot .site_map .follow .btn.btn_youtube:before { background-color:red } .contact_cot .site_map .follow .btn:hover:before { left:-10%; top:-10% } .contact_cot .site_map .follow .btn:hover { text-decoration:unset } .contact_cot .site_map .follow .btn:hover .iconfont { color:#fff; position:relative; transform:scale(1) } .contact_cot .site_map p { font-size:14px; font-size:#333; line-height:24px; margin-bottom:10px; width:478px } .contact_cot .site_map .map { height:260px; position:absolute; right:100px; top:0; width:595px } .mobile { display:none } @media screen and (max-width:800px) { 
 .mobile { background-color:#fff; display:block; margin-bottom:10px; padding:10px } .mobile .company_info,.mobile .introduce { margin-bottom:30px; width:100% } .mobile .company_info div { background:#fff; border-radius:6px; box-shadow:0 1px 9px #0000000f; margin-bottom:12px; padding:16px 12px; width:100% } .mobile .company_info div b { display:block; font-size:14px; margin-bottom:12px } .mobile .company_info div p { display:flex; margin-bottom:12px } .mobile .company_info div p img { height:20px; margin-right:10px; width:20px } .mobile .company_info div p a,.mobile .company_info div p span { color:#333; font-size:14px; line-height:20px } .mobile .after_sales,.mobile .ordering,.mobile .shipping { margin-bottom:30px } .mobile .after_sales .title,.mobile .ordering .title,.mobile .shipping .title { align-items:center; display:flex; justify-content:center; margin-bottom:20px } .mobile .after_sales .title img,.mobile .ordering .title img,.mobile .shipping .title img { height:24px; width:54px } .mobile .after_sales .title span,.mobile .ordering .title span,.mobile .shipping .title span { color:#333; font-size:18px; font-weight:700; line-height:20px; margin-left:-16px } .mobile .after_sales .content b,.mobile .ordering .content b,.mobile .shipping .content b { display:block; font-size:14px; margin-bottom:10px } .mobile .after_sales .content p,.mobile .ordering .content p,.mobile .shipping .content p { color:#333; font-size:14px; line-height:22px; margin-bottom:10px } .mobile .after_sales .content ul,.mobile .ordering .content ul,.mobile .shipping .content ul { list-style:unset; margin-bottom:10px; padding-left:18px } .mobile .after_sales .content ul li,.mobile .ordering .content ul li,.mobile .shipping .content ul li { color:#333; font-size:14px; font-weight:400; line-height:22px } 
 } 

 @media screen and (max-width:1024px) { 
 .contact_cot { } 
 .contact_cot img { max-width: 100% !important; width: 100% !important; } 
 .contact_cot .certif>div .card .title img { height: auto !important; } 
 .contact_cot .advantage .advantag-cot { display: flex; flex-wrap: wrap; } 
 .contact_cot .advantage .advantag-cot div { width: calc(100%/2); } 
 .contact_cl { width: 100% !important; display: flex; flex-direction: column; } 
 .contact_cot .introduce { display:flex; flex-direction: column; } 
 .contact_cot .introduce div { width: auto; } 
 .contact_cot .LB,.contact_cot .RT{display: none;}
 } 

.about.w { margin: 0 auto; width: 1300px; } 

.contact_cl { height: auto !important; padding-bottom: 80px; width: 1130px !important; display: flex; flex-direction: row; justify-content: space-between; } 
.contact_cl div { background-color: white; width: 50% !important; margin-top: 15px; font-size: 16px; line-height: 30px; } 
.contact_cl div b { color: #666; font-size: 20px; margin-bottom: 10px; } 

.pillars-content { width: 1400px !important; } 
.pillars-content img { width: 100% !important; } 
.contact_cl.on div { background-color: transparent; color: #fff; display: flex; flex-direction: column; padding: 20px; } 
.contact_cl.on div b { color: #fff; } 

@media(max-width:1024px) { 
 
 .contact_cl { width: 100% !important; flex-direction: column !important; padding: 0 !important; margin: 0 !important; } 
 .contact_cl div { flex-direction: column !important; width: calc(100% - 60px) !important; height: auto !important; padding: 0 30px; } 
 .pillars-content { width: 100% !important; } 
 }