.bg-blue{
    background-color: blue;
    color: white;
    font-weight: bold;
    padding: 10px 15px ;
    border-radius: 15px;
    border: 1px solid white;
}
.bg-yellow{
    background-color: rgb(180, 180, 47);
    color: white;
    font-weight: bold;
    padding: 10px 15px ;
    border-radius: 15px;
    border: 1px solid white;
}
.bg-green{
    background-color: green;
    color: white;
    font-weight: bold;
    padding: 10px 15px ;
    border-radius: 15px;
    border: 1px solid white;
}
.bg-gray{
    background-color: gray;
    color: white;
    font-weight: bold;
    padding: 10px 15px ;
    border-radius: 15px;
}

.detail_margin{
    margin-top: 100px;
      
}

.font_white{
    color: white;
}
.empty_box{
    height: 100px;
    
}
.m_left{
    margin-left: 100px;
    margin-right: -100px;
}
.m_right{
   
   margin-top: -150px;
   margin-left: 50px;
}
.m_mouse{
    transform: translate(-200px,100px);
}
.love_move{
    transform: translate(200px,-100px);
}

.img_hand{
padding-bottom: 80px;
}

.grady_color{
    color: #FFFFFF;
    background-color: transparent;
    background-image: linear-gradient(90deg, var(--lqd-color-secondary) 0%, var(--lqd-color-tertiary) 100%);
}
.moth_hv{
    transition: all 300ms;
}
.moth_hv:hover{
    transform: scale(1.4);
}

.border_black{
    border: 2px solid black;
}
iframe { 
    max-width: 100%;
    max-height : 100%;
    height: calc(80vw*4/9.31);
}
h-70p{
    
    height: 800px;
}

/*맵 CSS*/
.map_wrap, .map_wrap * {margin:0; padding:0;font-family:'Malgun Gothic',dotum,'돋움',sans-serif;font-size:12px;}
.map_wrap {position:relative;width:100%;height:350px;}
#category {position:absolute;top:10px;left:10px;border-radius: 5px; border:1px solid #909090;box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);background: #fff;overflow: hidden;z-index: 2;}
#category li {float:left;list-style: none;width:100px;border-right:1px solid #acacac;padding:6px 0;text-align: center; cursor: pointer;}
#category li.on {background: #eee;}
#category li:hover {background: #ffe6e6;border-left:1px solid #acacac;margin-left: -1px;}
#category li:last-child{margin-right:0;border-right:0;}
#category li span {display: block;margin:0 auto 3px;width:27px;height: 28px;}
#category li .category_bg {background:url(https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/places_category.png) no-repeat;}
#category li .bank {background-position: -10px 0;}
#category li .mart {background-position: -10px -36px;}
#category li .pharmacy {background-position: -10px -72px;}
#category li .oil {background-position: -10px -108px;}
#category li .cafe {background-position: -10px -144px;}
#category li .store {background-position: -10px -180px;}
#category li.on .category_bg {background-position-x:-46px;}
.placeinfo_wrap {position:absolute;bottom:28px;left:-150px;width:300px;}
.placeinfo {position:relative;width:100%;border-radius:6px;border: 1px solid #ccc;border-bottom:2px solid #ddd;padding-bottom: 10px;background: #fff;}
.placeinfo:nth-of-type(n) {border:0; box-shadow:0px 1px 2px #888;}
.placeinfo_wrap .after {content:'';position:relative;margin-left:-12px;left:50%;width:22px;height:12px;background:url('https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/vertex_white.png')}
.placeinfo a, .placeinfo a:hover, .placeinfo a:active{color:#fff;text-decoration: none;}
.placeinfo a, .placeinfo span {display: block;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
.placeinfo span {margin:5px 5px 0 5px;cursor: default;font-size:13px;}
.placeinfo .title {font-weight: bold; font-size:14px;border-radius: 6px 6px 0 0;margin: -1px -1px 0 -1px;padding:10px; color: #fff;background: #d95050;background: #d95050 url(https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/arrow_white.png) no-repeat right 14px center;}
.placeinfo .tel {color:#0f7833;}
.placeinfo .jibun {color:#999;font-size:11px;margin-top:0;}


.player{
    padding-top: 56.15%;
    position: relative;
    
}
.player iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/* 지도 높이 */
.hw{
    height: 40vw;
    margin: 50px auto;
    

}
#map {
    margin: 0 auto;
    border: 1px solid gray;
}
.edunet{
    margin-left: 200px;
}
/* Lity 모달의 수직 중앙 정렬 방식을 덮어쓰고 아래로 이동 */
/* Lity 모달 랩퍼의 위치를 강제로 조정합니다. */
/* 2. Lity 모달 전체 Z-Index 확보 */
.lity {
    z-index: 999999 !important; 
}

/* 3. 모달 랩퍼의 위치를 강제로 조정 (전체 화면이 아닌 경우) */
.lity-wrap {
    /* Lity의 기본 중앙 정렬 CSS를 무시하고 덮어씁니다. */
    top: auto !important;
    transform: none !important; 
    
    /* 상단에서 10% 위치에 배치 (원하는 만큼 조정) */
    top: 10% !important; 
    
    /* 수평 중앙 정렬 유지 */
    left: 50% !important;
    transform: translateX(-50%) !important;
    
    /* Z-index는 여전히 높게 유지 */
    z-index: 1000000 !important;
}

/* 닫기 버튼 z-index 재확보 (클릭 이벤트 및 충돌 방지) */
.lity .lity-close {
    /* 기존 30px에서 아래로 내립니다. (예: 50px) */
    top: 50px !important; 
    /* 오른쪽에서 30px 대신 20px로 조금 안쪽으로 당깁니다. */
    right: 20px !important; 
    
    /* 다른 스타일에 의해 가려지거나 클릭을 방해받지 않도록 z-index를 최고로 높입니다. */
    z-index: 1000001 !important; 
    
    /* 색상이 배경과 겹칠 경우를 대비해 검은색으로 강제 적용 */
    color: #000 !important; 
    
    /* 버튼 크기를 강제 확보 */
    font-size: 35px !important; 
}
.closebtn{
	 top: 500px !important; 
}
/* 모달 컨테이너 자체의 z-index도 높게 유지 */
#daumRoughmapContainer1708407614555 {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    box-sizing: border-box;
  }