@keyframes cityDotAni{from{text-shadow: none}to{text-shadow: 0 0 4px #FFF,0 0 6px #FFF}}
@-webkit-keyframes cityDotAni{from{text-shadow: none}to{text-shadow: 0 0 4px #FFF,0 0 6px #FFF}}
@font-face{font-family:'mapicon';src:url('/plugin/map/other/iconFont_5b0a5675.eot');src:url('/plugin/map/other/iconFont_5b0a5675.eot?#iefix') format('embedded-opentype'),url('/plugin/map/other/iconFont_3c110ab4.woff') format('woff'),url('/plugin/map/other/iconFont_267b7f8e.ttf') format('truetype');font-weight:normal;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

.inlineBl{display: -moz-inline-box;-moz-box-orient: vertical;display: inline-block;vertical-align: middle;*vertical-align: auto;*zoom: 1;*display: inline}
.map::before{content:""; position:absolute; left:0; top:0; width:100%; height:100%; background: url(https://su.maigoo.com/plugin/mod/img/1020/maigoosy.png) repeat; opacity: 0.2; background-size:12.5% auto;}
.style1 .map::before{ background-image: url(https://su.maigoo.com/plugin/mod/img/1020/maigoosy_white.png); opacity:0.3}


.mapshengming{position:absolute; z-index:1; bottom:10px; left:20px; width:330px; word-break:break-all; text-align:justify; line-height:1.6em; color:rgba(51,51,51,0.7);font-size:12px; animation:delayshow 1s linear 0s 1 forwards;}
.mapshengming>a.color1{margin-right:3px; }
.mapshengming>a.color1 span,
.mapshengming>a.color1 .iconfont{display:inline-block; vertical-align:middle;}
.mapshengming>a.color1 .iconfont{font-size:12px; margin-left:1px;}
.mapshengming>img {display: inline-block;vertical-align: middle;height: 2em;}




@keyframes delayshow {0%{opacity:0;}90%{opacity:0;}100%{opacity:1;}}
.map .mapBox{position: absolute;width: 100%; height: 100%;left: 0;top: 0;overflow: hidden;}
.map .mapBox .loadingFailTip{position: relative;top: 50%;margin-top: -10px;color: #999;text-align: center}
.map .mapBox .loadingFailTip em{font-family: iconFont;margin-right: 5px;font-size: 16px;line-height: 20px}
.map .mapBox .loadingFailTip a:link,.map .mapBox .loadingFailTip a:hover{color: #629cdf}
.map .mapBox .extLayer{position: absolute;z-index: 2}
.map .mapBox .wholeMapBtn{display: none;filter: alpha(opacity= 0);-khtml-opacity: 0;-moz-opacity: 0;opacity: 0;display: block;width: 66px;height: 66px;top: -60px;background: url(https://su.maigoo.com/plugin/map/other/wholeMapBtn_7e9ba833.png?m=z)}
.map .mapBox .wholeMapBtn:hover{background: url(https://su.maigoo.com/plugin/map/other/wholeMapBtn_hover_56e1a369.png?m=z)}
.map .mapBox .infoLayer .cityDot{text-decoration:none;font-family: iconFont;position: absolute;display: block;width: 12px;height: 12px;color: #5995d3;margin-top: -6px;margin-left: -6px;-webkit-transition: 1s;-moz-transition: 1s;-o-transition: 1s;transition: 1s;-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);-ms-transform: scale(0);transform: scale(0)}
.map .mapBox .infoLayer .cityDot.breath{-webkit-animation: cityDotAni 1.5s 10 alternate;animation: cityDotAni 1.5s 10 alternate}
.map .mapBox .mapCanvas{position: absolute; left:0; top:0;z-index: 0}
.map .mapBox .mapCanvas .noInteraction{pointer-events: none}
.map .mapBox .mapCanvas .layer{fill: #FFF;stroke: #ccc;stroke-linejoin: round;stroke-linecap: round}

.map .mapBox .mapCanvas .layer a{outline: 0}
.map .mapBox .mapCanvas .layer .boundary{display: none}
.map .mapBox .mapCanvas .layer .shadow{fill:#ccc;stroke: none}

.map .mapBox .mapCanvas .layer .area{-webkit-transition: fill .2s,stroke .2s;-moz-transition: fill .2s,stroke .2s;-o-transition: fill .2s,stroke .2s;transition: fill .2s,stroke .2s;cursor: pointer}
.map .mapBox .mapCanvas .layer .area:hover, .map .mapBox .mapCanvas .layer .area.show {fill: #a5ccf8;stroke: #8ebbee;}
.map .mapBox .mapCanvas .layer .area.nourl{fill: #ccc;stroke: #aaa}
.map .mapBox .mapCanvas .layer .nameRect{position: absolute;display: block; z-index:4;}
.map .mapBox .mapCanvas .layer .nameRect .nameBg{fill: none;stroke: none}
.map .mapBox .mapCanvas .layer .nameRect .name{-webkit-transition: fill .2s;-moz-transition: fill .2s;-o-transition: fill .2s;transition: fill .2s;fill: #666;stroke: none;text-anchor: middle;alignment-baseline: middle;white-space: nowrap;font-size: 12px; cursor:pointer;}
.map .mapBox .mapCanvas .layer .nameRect:hover .name{fill: #f90}

.map .mapBox .mapCanvas .masked{fill:rgba(255,255,255,0.1);stroke: rgba(0,0,0,0.1)}

.map .mapBox .mapCanvas .masked .boundary,.map .mapBox .mapCanvas .masked .shadow{display: none}
.map .mapBox .mapCanvas .masked .area:hover{fill: #a5ccf8;stroke: #cbcac8}
.map .mapBox .mapCanvas .masked .nameRect .nameBg{fill: #ebebeb}

.map .mapBox .mapCanvas .masked .nameRect .name{fill: #888}
.map .mapBox .mapCanvas .masked .nameRect.cur .nameBg{fill: #a5ccf8;stroke: #608ec6}
.map .mapBox .mapCanvas .masked .nameRect.cur .name{fill: #FFF}
.map .mapBox .mapCanvas .sublayer .area,.map .mapBox .mapCanvas .sublayer .area:hover{cursor: default;fill: #fafafa;stroke: #ccc}

.map .mapBox .mapCanvas .sublayer .boundary{display: block;stroke: #b5b5b5}

.map .mapBox .mapCanvas .sublayer .shadow{fill: #bbb}
.map .mapBox .mapCanvas .sublayer .nameRect .name{fill: #aaa}
.map .mapBox .mapCanvas .sublayer .online{fill: #FFF;cursor: pointer!important}
.map .mapBox .mapCanvas .sublayer .online:hover,.map .mapBox .mapCanvas .sublayer .online.cur{fill: #a5ccf8;stroke: #8ebbee}
.map .mapBox .mapCanvas .sublayer .online .name{fill: #666}
.map .mapBox .southChinaSea{filter: alpha(opacity= 0);-khtml-opacity: 0;-moz-opacity: 0;opacity: 0;display: none;width: 96px;height: 112px;background: url('/plugin/map/other/southChinaSea_01b9ed44.png?202207') no-repeat;border: solid 1px #b5b5b5;}
.mapNav{display:none;}

.cityOfflineTip{pointer-events: none;background: #FFF;color: red;padding: 1px 9px;box-shadow: none;line-height: 16px;border: solid 1px #BBB;border-radius: 2px}

/*文字颜色定义*/
.md_rongyu a.item.color100000,.md_rongyu a.item.color100001{ color:#9900FF;}

.map a.item{color:#0b59a7;}
.map a.item.color0{ color:#333;}
.map a.item.color6{ color:#0271b7;}
.map a.item.color27{ color:#27afba;}
.map a.item.color26{ color:#02ae00;}
.map a.item.color6966{ color:#1d948d;}
.map a.item.color7588{ color:#f16404;}
.map a.item.color6014{ color:#3769b1;}
.map a.item.color5933{ color:#CC5600;}
.map a.item.color5923{ color:#7f2011;}
.map a.item.color6514{ color:#11119d;}
.map a.item.color7365{ color:#546131;}
.map a.item.color4{ color:#8d3200;}
.map a.item.color5975{ color:#9c0193;}
.map a.item.color6007{ color:#c10051;}
.map a.item.color4534{ color:#fb1a27;}
.map a.item.color7199{ color:#C306BA;}
.map a.item.color7584{ color:#C33406;}
.map a.item.color10{ color:#A9402E;}
.map a.item.color6573{ color:#8D5320;}
.map a.item.color13767{ color:#FF0000;}
.map a.item.color258{ color:#DA3300;}
.map a.item.color259{ color:#FF7E00;}
.map a.item.color134{ color:#560000;}
.map a.item.color100001{ color:#9900FF;}

.map.brand a.item{ color:#d20f1b;}
.map.brand a.item.color2730{ color:#0081FF;}
.map.brand a.item.color4635{ color:#998100;}
.map.brand a.item.color4636{ color:#FF8156;}
.map.brand a.item.color2729{ color:#b77b57;}
.map.brand a.item.color2731{ color:#FFAC00;}
.map.brand a.item.color4630{ color:#FF0081;}
.map.brand a.item.color2732{ color:#41ac00;}
.map.brand a.item.color4813{ color:#FF0000;}
.map.brand a.item.color100000{ color:#9900FF;}
/*文字颜色定义end*/

.map{ width:90%; height:100%;position: relative;}
.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;}

.map .area .box{ width:100px; height:100px;}
.map .area .line{ position:absolute; right:100%; bottom:100%; margin:0 8px -10px 0; border-left:1px dashed #aaa; border-bottom:1px dashed #aaa; border-radius:10px;}
.map .area .line .box2{ min-width:10px; min-height:10px; width: 100px;height: 10px;}
.map .area .line .point1{ position:absolute; left:-8px; top:-8px; width:16px; height:16px; background:url(https://su.maigoo.com/plugin/mod/img/1021/point1.png?2022) center center; background-size:16px auto;}
.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;}
.map .area .line.leftdown{ bottom:auto; top:0; margin:10px 8px 0 0; border:0; border-top:1px dashed #aaa; border-left:1px dashed #aaa;}
.map .area .line.leftdown .point1{ top:auto; bottom:-8px;}
.map .area .line.leftdown .point2{ top:-5px; bottom:auto;}
.map .area .line.top{ bottom:100%; right:100%; margin:0 -10px 8px 0; border:0; border-top:1px dashed #aaa; border-right:1px dashed #aaa;}
.map .area .line.right{ left:100%; right:auto; bottom:100%; margin:0 0 -10px 8px; border:0; border-bottom:1px dashed #aaa; border-right:1px dashed #aaa;}
.map .area .line.right .point1,.map .area .line.topright .point1{ left:auto; right:-8px;}
.map .area .line.right .point2,.map .area .line.topright .point2{ left:-5px;}
.map .area .line.bottom{ top:100%; bottom:auto; right:100%; margin:8px -10px 0 0; border:0; border-bottom:1px dashed #aaa; border-right:1px dashed #aaa;}
.map .area .line.bottom .point1,.map .area .line.leftbottom .point1{ left:-8px; top:auto; bottom:-8px;}
.map .area .line.bottom .point2,.map .area .line.leftbottom .point2{ left:auto; right:-5px; top:-5px;}
.map .area .line.leftbottom{ top:100%; margin-top:-10px; bottom:auto; border:0; border-top:1px dashed #aaa; border-left:1px dashed #aaa;}
.map .area .line.topright{ bottom:100%; right:auto; left:100%; margin:0 0 8px -10px; border:0; border-bottom:1px dashed #aaa; border-right:1px dashed #aaa;}
.map .area .line.rightbottom{ left:100%; right:auto; bottom:auto; top:100%; margin:-10px 0 0 8px; border:0; border-top:1px dashed #aaa; border-right:1px dashed #aaa;}
.map .area .line.rightbottom .point1,.map .area .line.bottomright .point1{ left:auto; right:-8px; top:auto; bottom:-8px;}
.map .area .line.rightbottom .point2,.map .area .line.bottomright .point2{ left:-5px; top:-5px;}
.map .area .line.bottomright{ top:100%; bottom:auto; right:auto; left:100%; margin:8px 0 0 -10px; border:0; border-top:1px dashed #aaa; border-right:1px dashed #aaa;}

.map .md_cont{ opacity:0; transition:all ease-in-out 200ms; position:absolute; left:0; top:0; width:100%; height:100%;}
.map .md_cont.complete{ opacity:1;}
.map .md_cont .md_citiao{ position:absolute; left:50%; }

.map .md_cont .md_citiao a.item{ position:absolute;transition:all ease-in-out 100ms;font-weight:bold;}
.map .md_cont .md_citiao a.item.hide{ display:none;}
.map .md_cont .md_citiao a.item:hover .md_name{ z-index:2; color:#f60; }
.map .md_cont .md_citiao 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;}
.map .md_cont .md_citiao a.item .md_name{ position:absolute; top:50%; line-height:16px; height:16px; white-space:nowrap; margin:-8px 18px 0 18px; padding-right:20px;}
.map .md_cont .md_citiao a.item.left .md_name{ right:0; padding:0 0 0 20px;}
.map .md_cont .md_citiao a.item.left .md_name img{ left:-4px; }
.map .md_cont .md_citiao a.item.right .md_name{ right:auto; padding:0 20px 0 0;}
.map .md_cont .md_citiao a.item.right .md_name img{ right:-4px; }
.map .md_cont .md_citiao a.item .blogo{ position:absolute; z-index:100; right:50%; bottom:99%; margin-right:-100px; line-height:20px; text-align:left; border:1px solid #ddd; padding:5px 10px; background:#fff; font-size:14px; width:200px; color:#333; font-weight:normal; white-space:normal;}
.map .md_cont .md_citiao a.item:hover .dn.blogo{ display:block;}
.map .md_cont .md_citiao a.item.brand .blogo{ text-align:center;}
.map .md_cont .md_citiao 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;}
.map .md_cont .md_citiao a.item .blogo .name{ font-size:16px; font-weight:bold; line-height:2em;}
.map .md_cont .md_citiao a.item .blogo img.ry{ width:36px; height:36px; display:inline-block; vertical-align:middle; margin:0 -6px;}
.map .md_cont .md_citiao a.item .md_name img.main{ height:28px; width:28px; position:absolute; right:-4px; top:-7px;}

.mapbg{ position: relative;}

/*固定尺寸的地图*/
.fixsize1 .map{width: 100%;height:624px;margin: 0 auto;}
.fixsize1 .map .md_cont .md_citiao{width: 736px;height:624px;margin-left: -368px;}

.fixsize2 .map{width: 100%;height:780px;margin: 0 auto;}
.fixsize2 .map .md_cont .md_citiao{width: 920px;height:780px;margin-left: -460px;}

.fixsize3 .map{width:940px; height:900px;}
.fixsize3 .map .md_cont .md_citiao{ width:100%; height:100%;left: 0;margin: 0;}

.haswiper .map .area .line .box2{width:1.42rem; height:0.14rem;}
.haswiper .map .area .line{margin: 0 8px -0.14rem 0;}
.haswiper .map .area .line.top{margin:0 -0.14rem 8px 0;}
.haswiper .map .area .line.right{margin:0 0 -0.14rem 8px;}
.haswiper .map .area .line.bottom{margin:8px -0.14rem 0 0;}
.haswiper .map .area .line.leftbottom{margin-top:-0.14rem;}
.haswiper .map .area .line.topright{margin:0 0 8px -0.14rem;}
.haswiper .map .area .line.rightbottom{ margin:-0.14rem 0 0 8px;}
.haswiper .map .area .line.bottomright{margin:8px 0 0 -0.14rem;}
.haswiper .map .md_cont .md_citiao{margin-left:-6.1rem; width:12.2rem; height:10rem;}
.haswiper .map .md_cont .md_citiao a.item{ font-size:12px; }
.haswiper .map .md_cont .md_citiao a.item .blogo{ font-size:12px;}
.haswiper .map .md_cont .md_citiao a.item .blogo .name{ font-size:14px;}

.slide .map[fixsize="3"]{position: absolute;left: 50%;top: 50%;margin:-450px 0 0 -470px;}
/*皮肤颜色定义*/
/*style1*/
.style1 .mapshengming{color:rgba(255,255,255,0.7);}
.style1 .mapshengming>a.color1{color:#ffff00;}
.style1 .mapshengming>a.color1:hover{ color:#f60;}

.style1 .map .mapBox .mapCanvas .layer{fill:rgba(0, 0, 0, 0.2); stroke:rgba(255, 255, 255, 0.1)}
.style1 .map .mapBox .mapCanvas .layer .nameRect .name{fill:rgba(255, 255, 255, 0.3)}
.style1 .map .mapBox .mapCanvas .layer .area:hover,.style1 .map .mapBox .mapCanvas .layer .area.show{fill:rgba(255, 255, 255, 0.3); stroke:rgba(255, 255, 255, 0.1);}
.style1 .map .mapBox .southChinaSea{background: url('/public/img/map/bluemap.png') no-repeat;border: solid 1px rgba(0, 0, 0, 0.2);}
.style1 .map .md_cont .md_citiao a.item{ color:#fff;}
/*style2*/
.style2 .map .mapBox .mapCanvas .layer{fill:rgba(220, 173, 154, 0.3); stroke:rgba(250, 247, 231, 0.3);}
.style2 .map .mapBox .mapCanvas .layer .shadow{fill:rgba(220,173,154,0.3);}
.style2 .map .mapBox .mapCanvas .layer .area:hover,
.style2 .map .mapBox .mapCanvas .layer .area.show{fill:rgba(190, 15, 27, 0.3); stroke:rgba(250, 247, 231, 0.3);}
.style2 .map .mapBox .mapCanvas .layer .nameRect .name{fill:rgba(0, 0, 0, 0.4);}
.style2 .map .mapBox .mapCanvas .layer .nameRect:hover .name{fill:#be0f1b;}
.style2 .map .mapBox .mapCanvas .masked{fill:rgba(255,255,255,0.2);stroke: rgba(220,173,154,0.2)}
.style2 .map .mapBox .mapCanvas .masked .nameRect .nameBg{fill:rgba(220,173,154,0.4)}
.style2 .map .mapBox .mapCanvas .sublayer .area,.style2 .map .mapBox .mapCanvas .sublayer .area:hover{stroke:rgba(220,173,154,0.4);}
.style2 .map .mapBox .mapCanvas .sublayer .boundary{stroke:rgba(220,173,154,0.3);}
.style2 .map .mapBox .southChinaSea{background: url('/public/img/map/redmap.png') no-repeat; border:solid 1px rgba(220, 173, 154, 0.3);}

.style2 .map .md_cont .md_citiao a.item .point{ background:#666; box-shadow:0 0 0 1px #666;}

.style2 .map .area{background:rgba(255,255,255,.2);}
/*style3*/
.style3 .map .mapBox .mapCanvas .layer{ fill:rgba(255,255,255,0.8);stroke: rgba(100, 100, 100, 0.3);}
.style3 .map .mapBox .mapCanvas .layer .nameRect .name{ fill:rgba(100,100,100,0.4);}
.style3 .map .mapBox .southChinaSea{ background:url('/public/img/map/defaultmap.png') no-repeat;}
.style3 .map .mapBox .mapCanvas .layer .area:hover,.style3 .map .mapBox .mapCanvas .layer .area.show{fill: #a5ccf8;stroke: #8ebbee}

/*style4*/
.style4 .map .mapBox .mapCanvas .layer{ fill:rgba(0,0,0,0); stroke:#b1b1b1}


