﻿.map {
    position: relative;
    user-select: none;
}

.map .map_zone {
    position: absolute;
    user-select: none;
    top: 0px;
    left: 0px;
}

.slogan {
    z-index: 10;
}

.title_main {
    z-index: 10;
}

#id_map {
    width: 2160px;
    height: 2650px;
    position: relative;
}

#id_map_main {
    width: 2470px;
    height: 2650px;
    transform-origin: 0px 0px;
    transform: scale(1) translate(0px, 0px);
    /*    transition: transform 0.1s, left 0.1s, top 0.1s;*/
    position: absolute;
/*    transform: translateZ(0);*/
    /* GPU 가속을 위한 레이어 생성 */
}

.main_info {
    position: absolute;
    bottom: 105px;
    left: 50%;
    transform: translateX(-50%);
    padding-left: 74px;
    font-size: 40px;
    z-index: 10;
    text-align: center;
    width: 2160px;
    /* 텍스트의 너비만큼만 설정 */
    display: flex;
    justify-content: center;
    align-items: center;
}

.main_info .img_zone {
    margin-right: 20px;
}

.main_info b {
    font-weight: bold;
}

.map_icon {
    position: absolute;
    z-index: 30;
}

.map_icon .icon {
    position: absolute;
    left: 0;
    top: 0;
    transform: translate(-50%, -100%);
}

.map_icon .icon img {
    position: absolute;
    transform: translate(-50%, -100%);
}

.map_icon .icon .icon_circle {
    position: absolute;
    width: 34px;
    height: 34px;
    background: #FFFFFF;
    border-radius: 34px;
    transform: translate(-50%, -173%);
}

.map_icon .icon .icon_circle .circle_txt{
    position: absolute;
    font-size: 22px;
    color: #008B25;
    font-weight: 800;
    letter-spacing: -2px;
    margin-left: 3px;
    margin-top: -1px;    
}


.map_icon .txt_zone {
    position: absolute;
    left: 0;
    top: 0;
    white-space: nowrap;
    transform: translate(-50%, 0);
    font-size: 30px;
    font-weight: 600;
}

.map_icon .box {
    transform: translate(-50%, 10%);
    width: 311px;
    background: transparent linear-gradient(180deg, #252D69 0%, #070E45 100%) 0% 0% no-repeat padding-box;
    box-shadow: 3px 3px 10px #0000004D;
    border-radius: 27px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.map_icon .box .box_info {
    position: relative;
    width: 250px;
    height: 100px;
    border-bottom: 4px solid #454C75;
}

.map_icon .box .box_info:last-child {
    border-bottom: none;
}


.map_icon .box .box_info .box_txt {
    position: absolute;
    white-space: nowrap;
    color: #FFFFFF;
    font-size: 45px;
    width: auto;
    height: 100px;
    min-width: 250px;
    line-height: 100px;

}
