.contact-map {
overflow: hidden;
padding: 20px 60px;
}
.contact-map .map-left {
opacity: 1;
transform: translateX(0%);
}
.contact-map .map-right {
opacity: 1;
transform: translateX(0%);
}
.contact-map .wrap {
width: 1260px;
height: 100%;
margin: 0 auto;
position: relative;
box-sizing: border-box;
}
.map-left {
float: left;
width: 50%;
position: relative;
opacity: 0;
transition: all 1.5s;
transform: translateX(-100%);
}
.page.swiper-slide-active .map-left {
opacity: 1;
transform: translateX(0%);
}
.map-left .imgbg {
width: 100%;
display: block;
}
.map-right {
width: 45%;
float: right;
height: 554px;
padding-bottom: 36px;
position: relative;
opacity: 0;
transition: all 1.5s;
transform: translateX(100%);
}
.page.swiper-slide-active .map-right {
opacity: 1;
transform: translateX(0%);
}
.map-right-main .content {
height: 400px;
overflow-y: auto;
padding-right: 14px;
}
.map-right-main {
/* height: 100%; */
overflow: hidden;
padding-top: 20%;
}
.map-right-main .content::-webkit-scrollbar {
width: 6px;
height: 6px;
background-color: transparent;
}
.map-right-main .content::-webkit-scrollbar-thumb {
border-radius: 10px;
background-color: transparent;
}
.map-right .title {
font-size: 30px;
color: #333;
margin-bottom: 24px;
}
.map-nav {
overflow: hidden;
margin-bottom: 30px;
}
.map-nav span {
float: left;
font-size: 22px;
color: #7e7e7e;
border-bottom: 1px solid transparent;
margin-right: 45px;
padding-bottom: 8px;
cursor: pointer;
}
.map-nav span.act {
color: #005bac;
border-bottom: 2px solid #005bac;
}
.map-block-img {
height: 230px;
background: no-repeat center center;
background-size: cover;
margin-bottom: 30px;
}
.map-block-text,
.map-block-text ul {
overflow: hidden;
}
.map-block-text ul {
list-style: none;
margin: 0;
padding: 0;
}
.map-block-text li {
width: 50%;
float: left;
margin-bottom: 12px;
/*padding-left: 22px;*/
box-sizing: border-box;
position: relative;
line-height: 1.5;
}
.map-block-text li span,
.map-block-text li a {
font-size: 14px;
color: #333;
vertical-align: middle;
margin-left: 10px;
}
.map-block-text li img {
/*position: absolute;
left: 0;
top: 0;*/
width: 70%;
}
.map-block-text li .qrtitle {
line-height: 0.5;
text-align: center;
font-size: 12px;
}
.info-href {
position: absolute;
right: 0;
bottom: 0;
}
.info-href a {
color: #999;
font-size: 14px;
}
.info-href a img {
margin-right: 10px;
}
.map-right-block {
display: none;
height: 100%;
}
.map-right-block:nth-child(1) {
display: block;
}
.pointer {
position: absolute;
font-size: 14px;
color: #005bac;
background: #fff;
padding: 3px 10px;
border-radius: 5px;
cursor: pointer;
box-shadow: 0 0 5px #bbb;
}
.pointer1 {
right: 12%;
top: 39%;
}
.pointer2 {
right: 29%;
top: 39%;
}
.pointer3 {
right: 15%;
top: 17%;
}
.pointer4 {
right: 11%;
top: 44%;
}
.pointer5 {
right: 4%;
top: 64%;
}
.pointer6 {
right: 32.5%;
top: 59.5%;
}
.pointer7 {
right: 15%;
top: 34%;
}
.pointer8 {
right: 37.5%;
top: 33%;
}
.map-right-block .content p {
font-size: 16px;
color: #666;
line-height: 2;
margin-bottom: 20px;
}
.pointer:hover {
background: #9ece82;
color: #fff;
}
.mb-partner-main {
display: none;
}
@media only screen and (min-width: 701px) and (max-width: 1300px) {
.contact-map .wrap {
width: 90%;
padding: 0 1%;
}
.map-right-main {
padding-top: 10%;
}
.map-block-text li .qrtitle {
padding-left: 20%;
}
}
/*手机*/
@media only screen and (min-width: 0px) and (max-width: 700px) {
.contact-map {
padding: 10px 0;
}
.contact-map .wrap {
width: 100%;
padding: 0 1%;
}
.map-left {
width: 72%;
margin: 0 auto;
float: none;
}
.map-right {
width: 100%;
height: 24rem;
padding-bottom: 25px;
float: none;
}
.map-right-main {
padding-top: 5%;
}
.map-nav {
margin-bottom: 10px;
}
.map-nav span {
font-size: 14px;
padding-bottom: 4px;
}
.map-block-img {
height: 110px;
margin-bottom: 6px;
}
.map-block-text li {
margin-bottom: 0px;
padding-left: 0;
line-height: 1.3;
}
.info-href a img {
width: 18px;
}
.info-href a {
font-size: 12px;
}
.map-block-text li span {
font-size: 12px;
color: #333;
margin-left: 0;
}
.map-block-text li .qrtitle {
line-height: 1;
}
.pointer {
font-size: 12px;
padding: 2px 4px;
border-radius: 3px;
}
}精品人妻一区二区三区四区在线