﻿/* CSS Document */
.blockinfo.mapzhishi{ width:100%; height:100%; font-size:14px;}
.mapzhishi .mapbg{ width:100%; height:100%; margin:0 auto;}
.mapzhishi .map{ width:90%; height:100%;position: relative; float:left;}
.mapzhishi .title{ position:absolute; left:2%; top:12px; white-space:nowrap; font-size:32px; line-height:58px; font-weight:100; color:#fff; padding:0 16px 0 16px; z-index:1;}
.mapzhishi .title:hover{ color:#f90;}
.style2 .mapzhishi .title{ color:#666;}
.style2 .mapzhishi .title:hover{ color:#f60;}
.mapzhishi .title .model_data{ display:inline-block !important;}
.mapzhishi .title .l{ position:absolute; left:0; top:0; width:10px; height:10px; border-top:2px solid; border-left:2px solid;}
.mapzhishi .title .l:after{content:""; position:absolute; left:-2px; top:46px; width:10px; height:10px; border-bottom:2px solid; border-left:2px solid;}
.mapzhishi .title .r{ position:absolute; right:0; top:0; width:10px; height:10px; border-top:2px solid; border-right:2px solid;}
.mapzhishi .title .r:after{content:""; position:absolute; right:-2px; top:46px; width:10px; height:10px; border-bottom:2px solid; border-right:2px solid;}

.mapzhishi .map .shengming{ width:208px; left:auto; right:-5%; bottom:1.2rem;}
.mapzhishi .map .shengming a.fff{margin-right:3px; color:#ffff00;}
.style2 .mapzhishi .map .shengming a.fff{color:#be0f1b;}
.mapzhishi .map .shengming a.fff span,
.mapzhishi .map .shengming a.fff .iconfont{display:inline-block; vertical-align:middle;}
.mapzhishi .map .shengming a.fff .iconfont{font-size:12px; margin-left:1px;}

.mapzhishi .map .area{ position:absolute; left:0; top:0; border:1px dashed rgba(255,255,255,.4); background:rgba(255,255,255,.1); border-radius:10px;}
.style2 .mapzhishi .map .area{background:rgba(255,255,255,.2);}
.mapzhishi .map .area .box{ width:100px; height:100px;}
.mapzhishi .map .area .line{ position:absolute; right:100%; bottom:100%; margin:0 8px -0.1rem 0; border-left:1px dashed #aaa; border-bottom:1px dashed #aaa; border-radius:10px;}
.mapzhishi .map .area .line .box2{ min-width:10px; min-height:10px; width:1.05rem; height:0.1rem;}
.mapzhishi .map .area .line .point1{ position:absolute; left:-8px; top:-8px; width:16px; height:16px; background:url(../images/point1.png) center center;}
.mapzhishi .map .area .line .point2{ position:absolute; right:-5px; bottom:-5px; width:6px; height:6px; border-radius:50%; background:#aaa; border:2px solid #eee; box-shadow:0 0 0 1px #aaa; margin-left:3px;}
.mapzhishi .map .area .line.top{ bottom:100%; right:100%; margin:0 -0.1rem 8px 0; border:0; border-top:1px dashed #aaa; border-right:1px dashed #aaa;}
.mapzhishi .map .area .line.right{ left:100%; right:auto; bottom:100%; margin:0 0 -0.1rem 8px; border:0; border-bottom:1px dashed #aaa; border-right:1px dashed #aaa;}
.mapzhishi .map .area .line.right .point1,.mapzhishi .map .area .line.topright .point1{ left:auto; right:-8px;}
.mapzhishi .map .area .line.right .point2,.mapzhishi .map .area .line.topright .point2{ left:-5px;}
.mapzhishi .map .area .line.bottom{ top:100%; bottom:auto; right:100%; margin:8px -0.1rem 0 0; border:0; border-bottom:1px dashed #aaa; border-right:1px dashed #aaa;}
.mapzhishi .map .area .line.bottom .point1,.mapzhishi .map .area .line.leftbottom .point1{ left:-8px; top:auto; bottom:-8px;}
.mapzhishi .map .area .line.bottom .point2,.mapzhishi .map .area .line.leftbottom .point2{ left:auto; right:-5px; top:-5px;}
.mapzhishi .map .area .line.leftbottom{ top:100%; margin-top:-0.1rem; bottom:auto; border:0; border-top:1px dashed #aaa; border-left:1px dashed #aaa;}
.mapzhishi .map .area .line.topright{ bottom:100%; right:auto; left:100%; margin:0 0 8px -0.1rem; border:0; border-bottom:1px dashed #aaa; border-right:1px dashed #aaa;}
.mapzhishi .map .area .line.rightbottom{ left:100%; right:auto; bottom:auto; top:100%; margin:-0.1rem 0 0 8px; border:0; border-top:1px dashed #aaa; border-right:1px dashed #aaa;}
.mapzhishi .map .area .line.rightbottom .point1,.mapzhishi .map .area .line.bottomright .point1{ left:auto; right:-8px; top:auto; bottom:-8px;}
.mapzhishi .map .area .line.rightbottom .point2,.mapzhishi .map .area .line.bottomright .point2{ left:-5px; top:-5px;}
.mapzhishi .map .area .line.bottomright{ top:100%; bottom:auto; right:auto; left:100%; margin:8px 0 0 -0.1rem; border:0; border-top:1px dashed #aaa; border-right:1px dashed #aaa;}

.mapzhishi .md_group{ position:absolute; left:20px; bottom:0; width:320px; height:190px; background:#fff; transition:all ease-in-out 300ms; opacity:1;}
.mapzhishi .md_group.hide{ opacity:0;}
.mapzhishi .md_group .ttl{ padding:0 10px; font-size:16px; line-height:2.2em; color:#fff; background:#555ba6; text-align:center;}
.style2 .mapzhishi .md_group .ttl{ background:#be0f1b;}
.mapzhishi .md_group .catlist{ padding:10px; overflow:hidden; height:155px;}
.mapzhishi .md_group .catlist::-webkit-scrollbar { width:0; height:0;}
.mapzhishi .md_group .catlist li{ float:left; width:32.33%; margin:0 0.5%; line-height:28px; cursor:pointer; text-align:center;}
.mapzhishi .md_group .catlist li:hover,.mapzhishi .md_group .catlist li.active{ color:#fff; background:#f60; border-radius:4px;}
.mapzhishi .md_group .catlist li.btn{ background:none;}
.mapzhishi .md_group .catlist li.btn .btt{ padding:0 10px;}
.mapzhishi .md_group .catlist li.btn .btt{ background:#555ba6; color:#fff; outline:none; cursor:pointer;}
.mapzhishi .md_group .catlist li.btn:hover .btt{ background:#f60;}
.style2 .mapzhishi .md_group .catlist li.btn .btt{ background:#be0f1b;}
.style2 .mapzhishi .md_group .catlist li.btn:hover .btt{ background:#f60;}
.mapzhishi .md_group .btn{ width:97%; margin:0 auto; background:#eee; color:#555ba6; text-align:center; margin-top:4px; line-height:32px; display:block;}
.mapzhishi .md_group .btn:hover{ color:#f60;}
.mapzhishi .md_group li a{ position:absolute; bottom:0; left:100%; margin-left:10px; background:#f60; color:#fff; display:inline-block; line-height:2.2em; padding:0 10px; border-radius:2em;}
.mapzhishi .md_group li a:hover{ background:#f90;}
.mapzhishi .md_group li a.hide{ z-index:-1; opacity:0;}
.mapzhishi .md_group li.active a.hide{ z-index:1; opacity:1; transition:opacity ease-in-out 500ms;}
.style2 .mapzhishi .md_group .btn{ color:#be0f1b;}
.style2 .mapzhishi .md_group .btn:hover{ color:#f60;}

.mapzhishi .md_cont{ opacity:0; transition:all ease-in-out 200ms; position:absolute; left:0; top:0; width:100%; height:100%;}
.mapzhishi .md_cont.complete{ opacity:1;}
.mapzhishi .md_cont .md_citiao{ position:absolute; left:50%; margin-left:-4.6rem; width:9.2rem; height:7.8rem;}
.mapzhishi .md_cont a.item{ position:absolute; font-size:12px; transition:all ease-in-out 100ms;}
.style1 .mapzhishi .md_cont a.item{ color:#fff;}
.style2 .mapzhishi .md_cont a.item{ font-weight:bold; color:#d20f1b}
.style2 .mapzhishi .md_cont a.item .point{ background:#666; box-shadow:0 0 0 1px #666;}
.mapzhishi .md_cont a.item.hide{ display:none;}
.mapzhishi .md_cont a.item:hover{ z-index:2; color:#f60}
.mapzhishi .md_cont a.item .point{ width:10px; height:10px; background:#C30; border-radius:50%; border:2px solid #eee; box-shadow:0 0 0 1px #C30; margin:4px; display:block;}
.mapzhishi .md_cont a.item .md_name{ position:absolute; top:50%; line-height:16px; height:16px; white-space:nowrap; margin:-8px 18px 0 18px; padding-right:20px;}
.mapzhishi .md_cont a.item.left .md_name{ right:0; padding:0 0 0 20px;}
.mapzhishi .md_cont a.item.left .md_name img{ left:-4px; }
.mapzhishi .md_cont a.item.right .md_name{ right:auto; padding:0 20px 0 0;}
.mapzhishi .md_cont a.item.right .md_name img{ right:-4px; }
.mapzhishi .md_cont a.item .blogo{ position:absolute; z-index:100; right:50%; bottom:99%; margin-right:-90px; line-height:20px; text-align:left; border:1px solid #ddd; padding:5px 10px; background:#fff; font-size:12px; width:180px; color:#333; font-weight:normal; white-space:normal;}
.mapzhishi .md_cont a.item:hover .dn.blogo{ display:block;}
.mapzhishi .md_cont a.item .blogo.brand{ text-align:center;}
.mapzhishi .md_cont a.item .blogo:after{content:""; width:0; height:0; position:absolute; left:50%; top:100%; margin-left:-3px; border-width:6px; border-style:solid; border-color:#fff transparent transparent transparent;}
.mapzhishi .md_cont a.item .blogo .name{ font-size:14px; font-weight:bold; line-height:2em;}
.mapzhishi .md_cont a.item .blogo img.ry{ width:36px; height:36px; display:inline-block; vertical-align:middle; margin:0 -6px;}
.mapzhishi .md_cont a.item .md_name img.main{ height:28px; width:28px; position:absolute; right:-4px; top:-7px;}

.style1 .mapzhishi .map .mapBox .mapCanvas .layer{fill:rgba(0, 0, 0, 0.2); stroke:rgba(255, 255, 255, 0.1)}
.style1 .mapzhishi .map .mapBox .mapCanvas .layer .nameRect .name{fill:rgba(255, 255, 255, 0.3)}
.style2 .mapzhishi .map .mapBox .mapCanvas .layer{fill:rgba(220, 173, 154, 0.3); stroke:rgba(250, 247, 231, 0.3);}
.style2 .mapzhishi .map .mapBox .mapCanvas .layer .nameRect .name{fill:rgba(0, 0, 0, 0.4)}


.md_rongyu .color100000{ color:#9900FF;}