﻿.contact{background-color: #f6f6f6;padding: 0;}
.contact-info{padding:30px 30px;align-items: center;background-color: #fff;margin-bottom:3%;}
.contact-info .contact-text{width: 50%;}
.contact-info .contact-text h4{font-size: 30px;font-weight: 600;margin:0 0 10px 0;color: #d71718;}
.contact-info .contact-text span{font-size: 22px;color: #666;display: block;font-family: "DINPro-Regular";margin-bottom:30px;border-bottom: 1px solid #eee;padding-bottom:30px;}
.contact-info .contact-text p{font-size: 18px;color: #666;line-height: 22px;margin-bottom: 20px;font-family: "DINPro-Regular";}
.contact-info .contact-text p i{font-size: 2rem;margin-right: 10px;}
.contact-info .contact-img{width: 50%;}
.contact-img img{width: 100%;max-width: 600px;}
.contact-ul{flex-wrap: wrap;}
.contact-ul li{width:48.5%;margin-right: 3%;margin-bottom: 3%;background-color: #fff;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    align-items: center;
    height: 170px;
}
.contact-ul li:nth-child(2n){margin-right: 0;}
.contact-ul li .info{border-left: 8px solid #d71718;padding: 20px;width: 70%;height: 100%;}
.contact-ul li .info b{font-size: 23px;color: #222;display: block;padding-bottom:15px;}
.contact-ul li .info p{font-weight: 400;font-size: 18px;font-family: "DINPro-Regular";color: #666;line-height: 36px;}
.contact-ul li .ico{text-align: center;width: 30%;height: 100%;padding: 30px 0;}
.contact-ul li .ico img{width:90%;}
.contact-ul li:hover{box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.05);-webkit-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.05);}
.contact-ul li .ico img:hover{
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
}
.mapBox {height: 450px;position: relative;margin: 50px 0;}
.mapBox #allmap {height: 100%;}

@media (max-width: 1200px) {
    .contact-info{padding:50px 0;}
    .contact-info .contact-text h4{font-size: 25px;}
    .contact-info .contact-text span{font-size: 18px;}
    .contact-info .contact-text p{font-size: 14px;}
    .contact-ul li{height: 130px;}
    .contact-ul li .ico{padding: 30px 0;}
    .contact-ul li .ico img{width: 40%}
    .contact-ul li .info{border-left: 6px solid #d71718;}
    .contact-ul li .info b{font-size: 18px;}
    .contact-ul li .info p{font-size: 14px;line-height: 25px;}
}
@media (max-width: 992px) {
    .contact{background-color: #efefef;}
    .contact .container{padding: 0;}
    .contact-info{padding:30px 20px 20px 20px;flex-wrap: wrap;}
    .contact-info .contact-text{width:100%;margin-bottom: 20px;}
    .contact-info .contact-text h4{font-size: 2.2rem;}
    .contact-info .contact-text span{font-size:1.5rem;margin-bottom:10px;padding-bottom: 10px;}
    .contact-info .contact-text p{font-size: 1.4rem;line-height:2.2rem;margin-bottom:10px;}
    .contact-info .contact-text p i{font-size: 1.6rem;}
    .contact-info .contact-img{width: 100%;}
    .contact-ul{padding: 20px 20px;background-color:#fafafa;margin-bottom: 10px;}
    .contact-ul li{width:100%;margin-right:0;margin-bottom: 4%;height: 100px;}
    .contact-ul li:last-child{margin-bottom: 0;}
    .contact-ul li .info{border-left: 6px solid #d71718;padding:10px;width:60%;}
    .contact-ul li .info b{font-size:1.8rem;padding-bottom:10px;}
    .contact-ul li .info p{font-size:1.4rem;line-height:2.2rem;}
    .contact-ul li .ico{width:40%;padding:10px 0;}
    .contact-ul li .ico img{width: 80%;}
    .contact-ul li:hover{box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.05);-webkit-box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.05);}
    .mapBox{height: 300px;margin:0}
}