/* 공공데이터 지도 삽입 20210715 */
#map-area-wrapper {position: relative;width: 100%;height: 0;padding-top:15.4%;padding-bottom: 56.26%;}
#map-area-wrapper .wrap {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.mobile-map{display:none !important}
.ovf-none{overflow:hidden;}
.pt20{padding-top:20px !important}
.pt30{padding-top:30px !important}
.pt40{padding-top:40px !important}
.pt50{padding-top:50px !important}
[class^=icon-]{display:inline-block;overflow:hidden;margin:0;padding:0;border:0;background-color:transparent;background-position:50% 50%;background-repeat:no-repeat;font-size:0;line-height:0;text-decoration:none;vertical-align:middle;text-indent:-1000em}
[class^=icon-flag]{width:20px;height:14px;background-image:url(/nfa/common/images/content/flag/01_01.png);background-size:auto 100%;background-position:50% 50%;background-repeat: no-repeat;}
.icon-flag-a02{background-image:url(/nfa/common/images/content/flag/01_02.png)}
.icon-flag-b01{background-image:url(/nfa/common/images/content/flag/02_01.png)}
.icon-flag-b02{background-image:url(/nfa/common/images/content/flag/02_02.png)}
.icon-flag-c01{background-image:url(/nfa/common/images/content/flag/03_01.png)}
.icon-flag-c02{background-image:url(/nfa/common/images/content/flag/03_02.png)}
.icon-flag-c03{background-image:url(/nfa/common/images/content/flag/03_03.png)}
.icon-flag-c04{background-image:url(/nfa/common/images/content/flag/03_04.png)}
.icon-flag-d01{background-image:url(/nfa/common/images/content/flag/04_01.png)}
.icon-flag-e01{background-image:url(/nfa/common/images/content/flag/05_01.png)}
.icon-flag-e02{background-image:url(/nfa/common/images/content/flag/05_02.png)}
.icon-flag-f01{background-image:url(/nfa/common/images/content/flag/06_01.png)}
.icon-flag-g01{background-image:url(/nfa/common/images/content/flag/07_01.png)}
.icon-flag-g02{background-image:url(/nfa/common/images/content/flag/07_02.png)}
.icon-flag-g03{background-image:url(/nfa/common/images/content/flag/07_03.png)}
.icon-flag-g04{background-image:url(/nfa/common/images/content/flag/07_04.png)}
.icon-flag-g05{background-image:url(/nfa/common/images/content/flag/07_05.png)}
.icon-flag-g06{background-image:url(/nfa/common/images/content/flag/07_06.png)}
.icon-flag-g07{background-image:url(/nfa/common/images/content/flag/07_07.png)}
.icon-flag-g08{background-image:url(/nfa/common/images/content/flag/07_08.png)}
.icon-flag-g09{background-image:url(/nfa/common/images/content/flag/07_09.png)}
.icon-flag-h01{background-image:url(/nfa/common/images/content/flag/08_01.png)}
.icon-flag-h02{background-image:url(/nfa/common/images/content/flag/08_02.png)}
.icon-flag-h03{background-image:url(/nfa/common/images/content/flag/08_03.png)}


.data-map-area{background:url(/nfa/common/images/content/map-data.jpg);background-size:100% auto;background-repeat: no-repeat;}
.data-map-area>div{position:absolute;width:150px;text-align: center;}
.data-map-area.bt-map03>div, .data-map-area.bt-map07>div{width:200px}
.data-map-area>div.v2{width:240px}
.data-map-area>div .info-box{position:absolute;width:100%; border-radius:10px;border:1px solid #fff;background:rgba(255,255,255, .7);box-shadow:0 0 10px 0 rgb(0 0 0 / 20%);text-align:center;}
.data-map-area>div .info-box:before{content:'';display:none;position:absolute;left:50%;top:-50px;width:2px;height:50px;background:#fff;}
.data-map-area>div .info-box h4{padding:10px 20px;border-bottom:1px solid #fff;font-weight:500;font-size:20px;color:#002C69}
.data-map-area>div .info-box h5{display:inline-block;font-weight:bold;color:#fff;padding:0 0 0 10px}
.data-map-area>div .info-box h5 small{font-size:.75em}
.data-map-area>div .info-box li{position:relative;padding:8px 10px;font-size:18px;text-align:center}
.data-map-area>div .info-box li>button{text-align: left;}
.data-map-area>div .info-box .nation-info{position:absolute;display:none;min-width:308px;padding:20px;border-radius:16px;background:rgbA(0,0,0, .8);text-align:left;color:#fff;;z-index:9999999}
.data-map-area>div .info-box .nation-info li{padding:4px 0 !important;text-align: left;padding:0;font-size:13px}
.data-map-area>div .info-box .nation-info li p{overflow:hidden;padding-top:10px}
.data-map-area>div .info-box .nation-info li span+span{position:absolute;padding-left:10px;line-height:1.3em}
.data-map-area>div .nation-info [class^=icon-flag]{width:70px;height:45px}
.data-map-area>div .nation-info .ntn-tit{display: flex;align-items:flex-end;-webkit-display: flex;-webkit-align-items:flex-end;justify-content:flex-start;-webkit-justify-content:flex-start}
.data-map-area>div .nation-info .ntn-tit+ul{padding-top:10px}
.data-map-area>div .nation-info li b{font-weight: bold;color:#f4c120}
.data-map-area>div .nation-info .bt-pdf-on{position:absolute;top:20px;right:20px;font-size:12px;text-decoration:none;background:#fff;color:#000;border-radius:4px;padding:3px 10px;font-weight: 500;}
.data-map-area>div .info-box .bt-cls{display: inline-block;margin:8px 0 8px;color:#6f80ba;border:2px solid #6f80ba;border-radius: 30px;padding:6px 20px;}
.data-map-area>div .info-box .bt-cls:hover{background:#6f80ba;color:#fff}
.data-map-area>div.line-bt .info-box{bottom:100%}
.data-map-area>div.line-bt .info-box:before{content: '';top:auto;bottom:-50px}

.ntn-area.v2>li{width:50%;float:left;text-align:left !important}
.ntn-area.v3>li{text-align:left !important}
.ntn-area.v4>li{padding:8px 30px !important}
.nation-info li p [class^=label-]{display: inline-block;color:#fff;font-weight:500;padding:3px 5px 5px;border-radius:4px;background-color:#3d84a7;white-space: nowrap;}
.nation-info li p .label-i2{background-color:#1dadd6}
.nation-info li p .label-i3{background-color:#cb5234}
.nation-info li p .label-i4{background-color:#0e969e}
.nation-info li p .label-i5{background-color:#e17068}
.nation-info li p .label-i6{background-color:#a06b24}
.nation-info li p .label-i7{background-color:#7473ac}
.arrow-left-top{top:0;left:80%;}
.arrow-left-bottom{top:auto;left:80%;bottom:-40%}
.arrow-left-top:before{content: '';display:inline-block; position:absolute;left:-40px;width: 0;
    height: 0;border-width: 0 20px 23px 20px;
    border-color: transparent rgba(0,0,0, .8) transparent transparent;
    border-style: solid;}
.arrow-left-bottom:before{content: '';display:inline-block; position:absolute;top:75%;left:-40px;width: 0;
    height: 0;border-width: 0 20px 23px 20px;
    border-color: transparent rgba(0,0,0, .8) transparent transparent;
    border-style: solid;}
.arrow-right-top{top:0;right:80%;}
.arrow-right-bottom{top:auto;right:80%;bottom:-40%}
.arrow-right-top:before{content: '';display:inline-block; position:absolute;right:-23px;width: 0;
    height: 0;border-width: 0 0 23px 23px;
    border-color: transparent  transparent transparent rgba(0,0,0, .8);
    border-style: solid;}
.arrow-right-bottom:before{content: '';display:inline-block; position:absolute;top:75%;right:-23px;width: 0;
    height: 0;border-width: 0 0 23px 23px;
    border-color: transparent  transparent transparent rgba(0,0,0, .8);
    border-style: solid;}
.data-map-area>div>button{display:none !important;position:absolute;top:-50px;left:50%;transform:translate(-50%, 0);-webkit-transform:translate(-50%, 0); display: inline-block;width:2em;height:2.7em;background:url(/nfa/common/images/content/icon-map-area.png);background-size:100% auto; background-repeat: no-repeat; border-radius: 50px;z-index: 9;}
.data-map-area>div>button span{font-size:0}
.data-map-area>div.line-bt button{top:auto;bottom:-50px}
.data-map-area>div button{font-size:15px}
.data-map-area>div button i{margin-right:3px}
.data-map-area .bt-map01{top: 28%;left: 3.5%;}
.data-map-area .bt-map02{top: 36.5%;left: 26.8%}
.data-map-area .bt-map03{top: 19%;left: 58.5%}
.data-map-area .bt-map04{top: 35%;right: 5%}
.data-map-area .bt-map05{top: 79.5%;left: 7%}
.data-map-area .bt-map06{top: 73%;left: 28%}
.data-map-area .bt-map07{top: 80%;right:32.9%}
.data-map-area .bt-map08{    top: 77.5%;right: 4%}

.z-first{z-index:9999 !important}
.n-scrl{overflow-y: hidden;}

@media screen and (max-width: 1280px) {
.data-map-area>div .info-box li{padding: 8px 10px;font-size: 16px;}
.data-map-area>div .info-box li a{text-decoration: underline;}
.data-map-area>div .info-box h4{font-size:16px}
.data-map-area>div .info-box h4 small{display: inline-block;padding-top:0}
.data-map-area>div .info-box:before{display: none;}
.data-map-area>div>button{top:auto !important;bottom:auto !important}
.data-map-area .bt-map01{top: 34%;left: 10.5%}
.data-map-area .bt-map02{top: 40%;left: 20.8%;}
.data-map-area .bt-map03{top: 38%;left: 29.5%;}
.data-map-area .bt-map04{top: 44%;left: 13.5%}
.data-map-area .bt-map05{top: 56%;left: 25%;}
.data-map-area .bt-map06{top: 60%;left: 6%}
.data-map-area .bt-map07{top: 40%;right: 16.5%;}
.data-map-area .bt-map08{top: 68%;right: 5%}
}
@media screen and (max-width: 1280px) {
    .data-map-area .bt-map01{top:28%;left:1.5%}
    .data-map-area .bt-map02{top:36%;left:24.8%}
    .data-map-area .bt-map03{top:16%;left:56%}
    .data-map-area .bt-map04{top: 29%;right: 5%;left: auto}
    .data-map-area .bt-map05{top: 79%;left: 4%;}
    .data-map-area .bt-map06{top:73%;left:23%}
    .data-map-area .bt-map07{top: 87%;left:50.5%;}
    .data-map-area .bt-map08{top:74%}
}
@media screen and (max-width: 768px) { 
    #map-area-wrapper{overflow:auto;height:auto;padding:0}
    #map-area-wrapper .wrap{position:relative}
    .mobile-map{display:inline-block  !important}
    .mobile-map img{width:100%}
    .m-w-auto{min-width:auto !important;margin-left:-6px}
    .data-map-area{background:none}
    .data-map-area>div{position:relative;width:100%;padding:15px 0;text-align: left;top:auto !important;right:auto !important;left:auto !important}
    .data-map-area>div .info-box, .data-map-area>div.line-bt .info-box{position:fixed;top:0;left:0;bottom:auto;width:100%;height:100%;padding-top:10%;overflow-y:scroll;background:none;z-index:9999 !important}
    .data-map-area>div .info-box>div{display:inline-block;width:93%;margin:0 auto;border-radius:20px;background:#fff}
    .data-map-area>div .info-box h4{padding:14px 0;border-bottom:1px solid #6f80ba;font-size:20px}
    .data-map-area>div .info-box ul{padding:0 0}
    .data-map-area>div .info-box:before{display:none}
    .data-map-area>div em.cover{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0 ,.5);z-index: 99;}
    .data-map-area>div>button{display:block !important;position:relative !important;width:100% !important;height:auto !important;top:auto !important;bottom:auto !important;left:auto !important; transform: none !important;-webkit-transform: none !important;text-align: left;background:url(/nfa/common/images/content/icon-more.png);background-size:11px auto;background-repeat: no-repeat;background-position:95% 50%;}
    .data-map-area>div>button span{position:relative;padding-left:15px;font-size:19px !important;font-weight: 500;}
    .data-map-area>div>button span:before{content: '';display:inline-block;position:absolute;top:13px;left:5px;width:5px;height:5px;border-radius:10px;background:#6f80ba;}
    .data-map-area>div>button span small{font-size:13px;color:#6f80ba}

    .data-map-area>div .info-box{display:none;border:0}
    .data-map-area>div .info-box li{padding:13px 0;}
    .data-map-area>div .info-box .nation-info li{font-size:15px}
    .data-map-area>div button{font-size:19px}
    .data-map-area>div button [class^=icon-flag]{width:35px;height:25px;margin:-3px 5px 0 0}
    .data-map-area>div .info-box .nation-info{display:none;margin:15px 0 0}
    .data-map-area>div .info-box .nation-info{position:relative;top:auto;right:auto;bottom:auto;left:auto;min-width:auto;width:100%;border-radius: 0;}
    .data-map-area>div .info-box .nation-info:before{display:none;}
    .data-map-area>div .nation-info .bt-pdf-on{top: 12px;right: 12px;font-size: 14px;padding: 6px 8px; cursor:hand}
    .data-map-area>div.v2{width:100%}
    .data-map-area>div button{font-size:18px;font-weight:500;}
    .data-map-area>div button [class^=icon-flag]{border:1px solid #ddd}
    .data-map-area>div .info-box li>button{min-width:130px;width:auto}
    .ntn-area li button{display:inline-block;width:100%}
    .ntn-area.v2>li{float:none;width:100%;text-align:center !important}
    .ntn-area.v3>li{text-align: center !important;}
    .ntn-area.v4>li{padding:13px 0 !important}
}