/* ****************** HTML 편집기  ****************** */

.html_471591_ {overflow:hidden;}
.html_471591_:after {content:''; display:block; clear:both;}

    :root {
      --primary: #006837;
      --card-bg: #fff;
      --hover-bg: #004c2e;
      --text: #333;
      --white: #fff;
      --radius: 8px;
      --gap: 16px;
      --section-bg: #f2f4f7;
      --page-bg: #f5f5f5;
      --info-blue: #009dd5; /* 진료안내 파란색상 */
    }
    * { margin:0; padding:0; box-sizing:border-box; }
    body {
      font-family: 'Noto Sans KR', sans-serif;
      background-color: var(--page-bg);
      color: var(--text);
      line-height: 1.5;
    }

    /* 상단 X패턴 */
    .header-x {
      position: relative;
      height: 200px;
      background: var(--primary);
      background-image:
        linear-gradient(135deg, rgba(255,255,255,0.15) 25%, transparent 25%),
        linear-gradient(225deg, rgba(255,255,255,0.15) 25%, transparent 25%),
        linear-gradient(315deg, rgba(0,0,0,0.1)   25%, transparent 25%),
        linear-gradient(45deg,  rgba(0,0,0,0.1)   25%, transparent 25%);
      background-size: 50% 50%;
      background-position: top left, top right, bottom left, bottom right;
    }
    .header-x .title-wrap {
      position: absolute;
      top:50%; left:50%;
      transform: translate(-50%, -50%);
      text-align: center;
      color: var(--white);
    }
    .header-x h1 {
      font-size: 2.5rem;
      margin-bottom: 8px;
    }
    .header-x p {
      font-size: 1rem;
    }

    /* 섹션 배경 */
    .section-bg {
      background-color: var(--section-bg);
      padding: 40px 0;
    }
    /* 섹션 제목 */
    h2.section-title {
      font-size: 1.25rem;
      color: var(--primary);
      border-bottom: 2px solid var(--primary);
      padding-bottom: 4px;
      margin: 0 auto 24px;
      max-width: 800px;
      text-align: center;
    }
    /* 그리드 */
    .grid {
      display: grid;
      gap: var(--gap);
      margin: 0 auto;
      padding: 0 var(--gap);
    }
    .grid--2col { /* 2열 그리드 */
      grid-template-columns: repeat(2, 1fr);
      max-width: 900px;
    }
    .grid--3col {
      grid-template-columns: repeat(3, 1fr);
      max-width: 900px;
    }

    /* --- 진료안내 카드 --- */
    .info-card {
      background-color: var(--card-bg);
      border-radius: var(--radius);
      padding: 24px;
      display: flex;
      flex-direction: column;
    }
    .info-card .info-header {
      text-align: center;
      margin-bottom: 16px;
    }
    .info-card .info-header img {
      height: 48px;
      margin-bottom: 8px;
    }
    .info-card .info-header h3 {
      font-size: 1.1rem;
      font-weight: 600;
      color: var(--info-blue);
    }
    
    /* 진료시간 테이블 스타일 (수정된 부분) */
    .info-table {
      /* width: 100%; 삭제 */
      margin: 0 auto; /* 추가: 테이블을 가운데 정렬 */
      border-collapse: collapse;
      font-size: 1rem;
    }
    .info-table td {
      padding: 8px 4px;
      border-bottom: 1px solid #f0f0f0;
    }
    .info-table tr:last-child td {
      border-bottom: none;
    }
    .info-table td:first-child {
      font-weight: 600;
      color: var(--text);
      white-space: nowrap;
      padding-right: 24px; /* 좌우 간격을 조금 더 줌 */
    }
    .info-table td:last-child {
      color: #555;
    }

    .info-card .notice {
      color: #d9534f;
      font-weight: 500;
      text-align: center;
      margin-top: auto; 
      padding-top: 16px;
      border-top: 1px solid #eee;
      line-height: 1.6;
    }
    /* 연락처 카드 */
    .info-card.contact {
      background-color: var(--info-blue);
      color: var(--white);
      text-align: center;
      justify-content: center;
    }
    .info-card.contact .info-header h3 {
      color: var(--white);
    }
    .info-card.contact .phone-numbers {
      margin: 16px 0;
    }
    .info-card.contact .phone-numbers p {
      font-size: 1.8rem;
      font-weight: 700;
      line-height: 1.2;
    }
    .info-card.contact .note {
      font-size: 0.95rem;
      line-height: 1.6;
    }
    /* --- --- */

    /* 진료과 카드 */
    .card {
      position: relative;
      background: var(--card-bg);
      border-radius: var(--radius);
      text-align: center;
      padding: 32px 16px 16px;
      overflow: hidden;
    }
    .card img {
      width: 56px; height: 56px;
      margin-bottom: 12px;
    }
    .card .label {
      font-size: 1rem;
      font-weight: 600;
      margin-bottom: 4px;
    }
    .card .label small {
      display: block;
      font-size: .85rem;
      color: #666;
    }
    .card .overlay {
      position: absolute; inset: 0;
      background: var(--hover-bg);
      color: var(--white);
      opacity: 0;
      transition: opacity .2s;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 16px;
    }
    .card:hover .overlay {
      opacity: 1;
    }
    .overlay h3 {
      font-size: 1.25rem;
      margin-bottom: 8px;
    }
    .overlay .underline {
      width: 40px;
      border-top: 2px solid var(--white);
      margin-bottom: 16px;
    }
    .overlay .btn {
      display: inline-flex;
      align-items: center;
      color: var(--white);
      text-decoration: none;
      font-size: .9rem;
      background: rgba(255,255,255,0.2);
      padding: 8px 16px;
      border-radius: 4px;
      margin: 0;
    }
    .overlay .btn img {
      width: 20px; height: 20px;
      margin-right: 6px;
      filter: brightness(0) invert(1);
    }
    .overlay .btn-group {
      display: flex;
      justify-content: center;
      gap: 8px;
    }

    /* 반응형 스타일 */
    @media (max-width: 768px) {
      .grid--2col,
      .grid--3col {
        grid-template-columns: 1fr;
      }
    }