/* overview.css
   Styles for the 'overview-table' + 'page_info' blocks
   Works with the exact HTML structure provided.
*/

/* base reset for this module */
.overview-table{ list-style:none; margin:0; padding:0; }

/* grid: 2 columns on desktop, 1 column on mobile */
.overview-table{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:64px;
  row-gap:18px;
}

/* each row: label | line | value */
.overview-table > li{
  display:flex;
  align-items:center;
  border-bottom:1px solid #e9ecef;
  padding:14px 0;
  min-height:56px;
}

/* label */
.overview-th{
  flex:0 0 auto;
  min-width:120px;              /* keep labels aligned */
  font-weight:700;
  font-size:18px;
  color:#333;
  letter-spacing:-0.3px;
}

/* the thin line between label and value */
.overview-line{
  flex:1 1 auto;
  height:1px;
  background:#e9ecef;
  margin:0 16px;
}

/* value */
.overview-td{
  flex:0 1 auto;
  color:#555;
  font-size:16px;
  line-height:1.7;
  word-break:keep-all;          /* keep Korean words tidy */
  overflow-wrap:anywhere;       /* allow wrapping for long numbers/units */
}

/* container spacing */
.sub-content-box{ margin-top:24px; }
.col-image.boxed-mo{ padding-bottom:0 !important; }

/* page_info notice box */
.page_info{
  margin-top:28px;
  padding:18px 18px 18px 80px;
  background:#f7f8fa;
  border:1px solid #e1e4e8;
  border-radius:6px;
  position:relative;
  list-style:none;
}
.page_info::before{
  content:"!";
  position:absolute;
  left:22px; top:50%;
  transform:translateY(-50%);
  width:44px; height:44px;
  border-radius:50%;
  background:#cfd4da;
  color:#fff;
  font-weight:700;
  font-size:22px;
  line-height:44px;
  text-align:center;
}
.page_info > li{
  color:#6b7280;
  font-size:14px;
  line-height:1.7;
}
.page_info > li + li{ margin-top:6px; }


/* ===== Responsive ===== */
@media (max-width: 1024px){
  .overview-table{ column-gap:40px; }
  .overview-th{ font-size:17px; min-width:110px; }
  .overview-td{ font-size:15px; }
}

@media (max-width: 768px){
  .overview-table{
    grid-template-columns:1fr;   /* stack to single column */
    row-gap:10px;
  }
  .overview-table > li{
    padding:12px 0;
    min-height:auto;
  }
  .overview-th{
    min-width:96px;
    font-size:16px;
  }
  .overview-td{
    font-size:15px;
    line-height:1.65;
  }
  .page_info{
    padding:16px 14px 16px 66px;
  }
  .page_info::before{
    left:16px; width:38px; height:38px; line-height:38px; font-size:20px;
  }
}