@charset "utf-8";


/*ÄÁÅ×ÀÌ³Ê*/
.cnt_box {
    width: 1010px;
    margin: 0 auto;
    display: block;
    position: relative;
    margin-left: 25px;
/**/

}

/* Å¸ÀÌÆ² ÄÁÅ×ÀÌ³Ê */
.title-wrapper {
    display: flex;
    align-items: center; /* ¼öÁ÷ Áß¾Ó Á¤·Ä */
    margin-bottom: 10px; /* ÇÊ¿ä¿¡ µû¶ó °£°Ý Á¶Á¤ */
}

/* Å¸ÀÌÆ² ¶óÀÎ (ÀÌ¹ÌÁö) */

.title_prefix {
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  left: -10px; /* ¼¼·Î¼±°ú ÅØ½ºÆ® °£ÀÇ °£°Ý Á¶Àý */
  margin-top: -10.5px;
  width: 6px;
  height: 21px;
  background: #000;
}

/* Å¸ÀÌÆ² ÅØ½ºÆ® */
.guide_title {
    font-size: 20px;
    font-weight: bold;
    margin: 0 0 0 10.5px;
    padding-left: 5.5px;

  position: relative;
  display: inline-block;
}

/* º¼µå ÅØ½ºÆ® */
.bold {
    font-weight: bold;
    font-size: 15px;

}

/* º¼µå ·¹µå ÅØ½ºÆ® */
.bold_red {
    font-weight: bold;
    color: red;

}

/*¼­ºêÅ¸ÀÌÆ²*/
.guide_subtitle {
    font-size: 16px;
    margin-bottom: 10px;

}
/*ÁÖ¼®*/
.guide_mini {
    font-size: 14px;
    margin-bottom: 20px;
    margin-top: 5px;
    color: #555;

}

/* ¹öÆ° ÄÁÅ×ÀÌ³Ê */
.button-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
 flex-direction: column;

}

/* ¹öÆ° ±×·ì */
.button-group {
    display: flex;
    gap: 10px;
    max-width: 960px;
}

/* ¹öÆ° ½ºÅ¸ÀÏ */
.d_btn {
    padding: 10px 25px;
    border: 1px solid #a2a2a2;
    background-color: white;
    color: #a2a2a2;
    cursor: pointer;
    text-align: center;
    width: 190px;
    font-size: 20px;
    transition: background-color 0.3s, color 0.3s, box-shadow 0.3s;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); /* ¿¬ÇÑ ±×¸²ÀÚ Ãß°¡ */

}

/* ¹öÆ° È£¹ö »óÅÂ */
.d_btn:hover {
    background-color: #00C6AC;
    border: 1px solid #00C6AC;
    color: white;

    font-weight: bold;
}

.d_btn.active {
    background-color: #00C6AC !important;
    color: white !important;
        font-weight: bold;
}

/* ¸Ê Å¸ÀÌÆ² */
.del_title {
    display: flex;
    align-items: center; /* ÀÌ¹ÌÁö¿Í ÅØ½ºÆ®¸¦ ¼öÁ÷ Áß¾Ó Á¤·Ä */
    font-size: 25px;
    font-weight: bold;
    color: #00C6AC;
    border-bottom: 2px solid #00C6AC;
    padding: 40px 0 15px 0; 
    justify-content: space-between;
    max-width: 980px;
}


.del_sel{
    margin-top: 15px;
    color: #969696;
    font-weight: bold;
    font-size: 12px;

}

/* del_sub¸¦ ¿À¸¥ÂÊ ³¡À¸·Î ¹èÄ¡ */
.del_sub {
    display: flex;
    align-items: center; /* ³»ºÎ ¾ÆÀÌÅÛÀ» ¼öÁ÷ Áß¾Ó Á¤·Ä */

}

/* dot ¾ÆÀÌÄÜ */
.dot {
    width: 10px;
    margin-right: 5px; /* ÅØ½ºÆ®¿ÍÀÇ °£°Ý Á¶Àý */
    margin-top: 15px;
}

/* del_p ½ºÅ¸ÀÏ */
.del_p {
    font-size: 14px;
    color: #00C6AC;
    margin-right: 15px; /* °¢ ¼³¸í °£ÀÇ °£°Ý Á¶Àý */
    margin-top: 17px;
    
}
.del_px {
    font-size: 14px;
    color: #9E9E9F;
    margin-right: 15px; /* °¢ ¼³¸í °£ÀÇ °£°Ý Á¶Àý */
    margin-top: 17px;
    
}


/* Áöµµ ¹× Áö¿ª ¸®½ºÆ® */
.map_container{
    display: flex;
    justify-content: center;
/*    height: 400px;*/
}

/*¸Ê È°¼ºÈ­*/

.guide_map_img {
    margin-top: -20px;
  align-items: center;
}

.image-mapper-shape {
  fill: rgba(0, 0, 0, 0);
  display: none;
}

.image-mapper-shape image{
    width: 5px;
}
g:hover .image-mapper-shape {
  stroke: white;
  stroke-width: 2px;
  opacity: 0%;
}

/* ±âº» Æú¸®°ï ½ºÅ¸ÀÏ: Åõ¸íÇÑ »óÅÂ */
.image-mapper-shape {
  fill: rgba(0, 0, 0, 0);
  transition: fill 0.3s ease, opacity 0.3s ease;
}

/* hover È¤Àº Æ÷Ä¿½º ½Ã */
.map-area:hover .image-mapper-shape,
.map-area:focus .image-mapper-shape,
.map-area.active .image-mapper-shape {
  fill: rgba(246, 67, 40, 0.67); /* */
  stroke: white;
  stroke-width: 1px;
}

.guide_map_info{
    margin-top: 40px;
}

.map-area.active {
  stroke: #FFD700; /* Å¬¸¯µÈ ¿µ¿ª Å×µÎ¸® »ö»ó (±Ý»ö) */
  stroke-width: 2;
}

.guide_map_info li {
  display: none; /* ±âº»ÀûÀ¸·Î ¼û±è */
  opacity: 0; /* Åõ¸íµµ 0 */
  transition: opacity 0.3s ease, transform 0.3s ease; /* ºÎµå·¯¿î º¯È­ È¿°ú */
}

.guide_map_info li.active {
  display: block; /* È°¼ºÈ­ ½Ã Ç¥½Ã */
  opacity: 1; /* ºÒÅõ¸í */
  transform: translateX(0); /* ÁÂÇ¥ ÃÊ±âÈ­ */
}

.interactive-map {
  transform: scale(1); /* ÃÊ±â Å©±â */
  transform-origin: center center; /* È®´ë ±âÁØÁ¡ */
}

.map-area {
  transform: scale(1.0); /* ÃÊ±â Å©±â */
  transform-origin: center center; /* È®´ë ±âÁØÁ¡ */
}


.guide_map_box {
    display: flex;
    margin-top: 20px;
    flex-wrap: wrap;
    justify-content: space-around;

}

.guide_map_img{
    width: 450px;
    vertical-align: middle;
}

/* ¼û±è Ã³¸®µÈ ¿ä¼Ò */
.hidden {
  display: none;
}

/*¹öÆ° ÄÁÅ×ÀÌ³Ê*/
.region-buttons-container{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap:5px;

    margin-top: 25px;
    width: 140px;
    
}
/* Åä±Û ¹öÆ° ½ºÅ¸ÀÏ */
.toggle-btn {
    padding: 10px 25px;
    border: 1px solid #00C6AC;
    background-color: white;
    color: #00A0B0;
    cursor: pointer;
    text-align: center;
    width: 190px;
    transition: background-color 0.3s, color 0.3s, box-shadow 0.3s;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); /* ¿¬ÇÑ ±×¸²ÀÚ Ãß°¡ */
    font-size: 25px;
    
}

.toggle-btn:hover {
    background-color: #00A0B0;
    color: white;
}


/*¹èÂ÷Ç¥*/

/* th ³»ºÎ ÄÁÅÙÃ÷ Áß¾Ó Á¤·Ä */
.th-content {
    display: flex;
    align-items: center; /* ¼öÁ÷ Áß¾Ó Á¤·Ä */
    justify-content: center; /* ¼öÆò Áß¾Ó Á¤·Ä */
    
}

/* Æ®·° ¾ÆÀÌÄÜ ½ºÅ¸ÀÏ */
.truck {
    width: 55px;
}

/* th ½ºÅ¸ÀÏ */
.tth {
    border-left: none;
    border-top: none;
    table-layout: fixed;
    width: 15%;
    
}
.ttt{
    border-right: none;
    border-top: none;
    color: #00C6AC;
    
}

.table-container {
    width: 100%;
    
}

.schedule-table {
    width: 100%;
    max-width: 980px;
    border-collapse: collapse; /* º¸´õ Áßº¹ ¹®Á¦ ÇØ°á */
    border-spacing: 0; /* ¼¿ °£°ÝÀ» Á¦°Å */
    font-size: 14px;
    text-align: left;
    border-collapse: separate;  /* ¼¿ °£ °æ°è¸¦ ºÐ¸® */
    border-spacing: 0; /* ¼¿ °£°ÝÀ» 0À¸·Î ¼³Á¤ */
    
}

.schedule-table th, .schedule-table td {
    padding: 10px;
    border: 1px solid #c3c3c3; /* º¸´õ¸¦ ±ÕÀÏÇÏ°Ô */
    box-sizing: border-box; /* º¸´õ¿Í ³»¿ë Å©±â °è»ê Æ÷ÇÔ */
    letter-spacing: 1px;
    
}

.schedule-table th {
    font-weight: bold;
    text-align: center;
    box-sizing: border-box;  /* º¸´õ¿Í ÆÐµùÀ» Æ÷ÇÔÇÑ Å©±â °è»ê */
    font-size: 18px;
    letter-spacing: 2px;
    
    
}

#bus-schedule-title {
    font-size: 24px;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
    
}

#bus-schedule-content {
    font-size: 16px;
    line-height: 1.5;
    color: #666;
    
}

.schedule-table td {
    box-sizing: border-box;  /* º¸´õ¿Í ÆÐµùÀ» Æ÷ÇÔÇÑ Å©±â °è»ê */
    line-height: 1.7;
    word-spacing: 0.05em;
    letter-spacing: 0.02em;
    padding-left: 20px;
    
        font-size: 15px;

    
}

.schedule-table th[colspan], .schedule-table td[colspan] {
    border-left: none;
    border-right: none;
}

.dth {
    width: 15%; 
    text-align: center;
    background-color: #00C6AC;
    color: #fff;
    color: white;
    font-weight: bold;
}

.dth2{
    width: 15%;
    color: #119CAE;
    font-weight: bold;
}

 .dth2 .dht th {
  font-size: 2px; !importent;
}

.dth3{
    font-size: 12px;
    color: #119CAE;
    font-weight: bold;
}

.schedule-info {
  font-size: 15px;
/*  font-weight: bold;*/
  color: #393939;
  align-items: center;
}

.schedule-note {
  margin-top: 20px;
  font-size: 14px;
  color: #888;
  text-align: center;
}

.driver-col {
    width: 20%;
/*    font-weight: bold;*/
    font-size: 15px;
    word-spacing: 0.05em; 
/*    background-color: #119cae;*/
/*    color: white;*/
    text-align: center;
}
.d_name{
    background-color: #d6d6d6;
    width: 100%;
    color: black;
    padding: 5px 0 5px 0;
    
}

.d_num{
    width: 100%;
/*    background-color: #fbf7f7;*/
    font-weight: bold;
    padding: 5px 0 5px 0;
}

.schedule-detail {
    color: #242424
    font-size: 15px;
    font-weight: 700;
    margin-left: 30px;
    
}

/*¾È³»¹®±¸*/
.delivery-notice{
 width: 100%;
 font-size: 15px;
 font-weight: bold;
 color: black;
text-align: center;
/* background-color: aqua;*/
 margin: 10px 0;
 color: red;
}
.hidden-nt{
 display: none;
}

/*±¸ ¼±ÅÃ ¹öÆ°*/

.guide_map_info {
  display: flex;
  flex-direction: column;
  align-items: center;
    padding: 5px;

    transform: scale(1.1);
}

.btn_title{
    width: 200px;
    position: absolute;
    top: -30px;
    left: 105px;
}
.info_txt {
    font-size: 14px;
    font-weight: bold;
    margin-top: 60px;
    margin-bottom: 10px;
    text-align: right;
    padding-right: 200px;
    

}

/* G ¹öÆ° ±âº» ½ºÅ¸ÀÏ */
.g_btn {
  padding: 10px 25px;
  background-color: #fff;
  color: #a2a2a2;
  cursor: pointer;
  text-align: center;
  width: 110px;
  height: 48px;
  border-radius: 40px;
  margin: 5px 0; /* ¹öÆ° °£ °£°Ý */
  font-size: 13px;
  border: none;
  transition: background-color 0.2s, box-shadow 0.2s, transform 0.2s ease; /* transform¿¡ ´ëÇÑ transition Ãß°¡ */
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
  border: 1px solid #ededed;
  font-weight: bold;
}

/* G ¹öÆ° È£¹ö È¿°ú */
.g_btn:hover {
  background-color: #00C6AC;
  color: white;
  font-weight: bold;
/*  transform: scale(1.2);*/
border: none;
    
}

/* G ¹öÆ° Å¬¸¯ ÈÄ È°¼ºÈ­ »óÅÂ À¯Áö */
.g_btn.active {
  background-color: #00C6AC; /* Å¬¸¯ ½Ã È£¹ö¿Í µ¿ÀÏÇÑ ¹è°æ */
  color: white; /* ÅØ½ºÆ® »ö»ó */
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
  font-weight: bold;
  border: none;
}


/
/* Å¬¸¯ À¯µµ ¸Þ½ÃÁö ½ºÅ¸ÀÏ */
.click-hint {
  position: absolute;
  top: 70%;
  left: 72%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  padding: 30px 50px;
  border-radius: 8px;
  font-size: 18px;
  z-index: 10;
  animation: fadeInOut 1.5s infinite;
}

/* Ãß°¡µÈ ¾Ö´Ï¸ÞÀÌ¼Ç (±ôºýÀÓ) */
@keyframes fadeInOut {
  0%, 100% {
    opacity: 0.2;
  }
  50% {
    opacity: 1;
  }
}



