o2o-infinith-demo/supporters/src/pages/clinic.astro

---
import Base from '../layouts/Base.astro';
import FactBlock from '../components/FactBlock.astro';
import { fact, clinicSchema, physicianSchema, physician } from '../lib';
import Gallery from '../components/Gallery.astro';
const docs = ['dr-choi','dr-chung','dr-son','dr-oh'].map(physician);
const site = Astro.site!.toString().replace(/\/$/, '');
const ld = [clinicSchema(site), physicianSchema('dr-choi')];
---
<Base title="뷰성형외과 기본 정보" description="뷰성형외과의원의 주소·전화·진료시간·층별 구성·진료과·공개 이력을 한 곳에 정리했습니다. 방문 전에 확인하세요." jsonLd={ld}>
  <article class="wrap" style="padding-bottom:4rem">
    <header class="article-head"><div class="eyebrow">Fact Sheet</div><h1 class="serif">Fact Sheet</h1><p style="color:var(--slate-600);margin-top:0.6rem"><strong style="color:var(--primary-900)">뷰성형외과 기본 정보.</strong> 주소, 전화, 진료시간, 층별 안내, 의료진을 한 곳에 모았습니다. 표기는 공식 홈페이지를 따르고, 홈페이지에 없는 항목은 출처를 따로 적습니다.</p></header>
    <FactBlock />
    <h2>진료시간</h2>
    <div class="table-wrap"><table><thead><tr><th>요일</th><th>진료</th></tr></thead><tbody>{fact.hours.rows.map((r) => <tr><td>{r.days}</td><td>{r.open ? `${r.open} ~ ${r.close}` : r.note}</td></tr>)}</tbody></table></div>
    <p style="font-size:0.88rem;color:var(--slate-500)">출처: <a href={fact.hours.source} rel="noopener">{fact.hours.sourceLabel}</a>. 공식 홈페이지에는 진료시간이 텍스트로 없어 강남언니 표기를 사용했습니다. 방문 전 전화로 확인을 권합니다.</p>
    <h2>건물과 층별 구성</h2>
    <figure class="figure"><img src="/img/clinic/building-clean.jpg" alt="뷰성형외과 빌딩 외관. 유리 외벽에 VIEW 로고가 있는 고층 건물" /><figcaption>뷰성형외과 빌딩 외관. 출처: 공식 홈페이지 병원둘러보기</figcaption></figure>
    <p>{fact.building.summary}입니다.</p>
    <div class="table-wrap"><table><thead><tr><th>층</th><th>용도</th></tr></thead><tbody>{fact.building.floors.map((f) => <tr><td>{f.floor}</td><td>{f.use}</td></tr>)}</tbody></table></div>
    <Gallery cols={3} items={[
      { src: '/img/clinic/consult-2.jpg', alt: '상담센터 상담실 내부', caption: '4~5F 상담센터' },
      { src: '/img/clinic/exam-2.jpg', alt: '검진센터 접수 데스크', caption: 'B1F 검진센터' },
      { src: '/img/clinic/surgery-3.jpg', alt: '수술실 앞 복도의 수술 실명제 안내 화면', caption: '11~14F 수술센터 복도' },
      { src: '/img/clinic/ward-2.jpg', alt: '입원실 침대', caption: '8·10F 입원센터' },
      { src: '/img/clinic/vip-1.jpg', alt: 'VIP 병동 복도', caption: '7F VIP 입원실' },
      { src: '/img/clinic/consult-3.jpg', alt: '상담 대기 라운지', caption: '상담 대기 라운지' },
    ]} />
    <h2>진료과와 진료 분야</h2>
    <p>진료과: {fact.departments.join(', ')}</p>
    <p>진료 분야: {fact.specialties.join(', ')}</p>
    <h2>이 사이트 글에 등장하는 의료진</h2>
    {docs.map((p) => (<div class="doctor-strip">{p.image && <img src={p.image} alt={`${p.name} ${p.title}`} />}<div><div class="name">{p.name} <span style="font-weight:500;color:var(--slate-600)">{p.title}</span></div><p class="creds">{p.credentials.slice(0,3).join(' · ')} <a href={p.url} rel="noopener">프로필</a></p></div></div>))}
    <p style="font-size:0.88rem;color:var(--slate-500)">전체 의료진 {fact.surfaces.gangnamunni.doctors}명(강남언니 등록 기준)은 <a href="https://www.viewclinic.com/viewis/doctors/" rel="noopener">홈페이지 의료진 소개</a>에서 확인할 수 있습니다.</p>
    <h2>공개된 이력</h2>
    <ul>{fact.recognitions.map((r) => <li>{r.text} <a href={r.source} rel="noopener" style="font-size:0.85rem">(출처)</a></li>)}</ul>
    <h2>공식 채널</h2>
    <ul>
      <li>홈페이지: <a href={fact.url} rel="noopener">{fact.url}</a> (영문 <a href={fact.urlEn} rel="noopener">{fact.urlEn}</a>)</li>
      <li>유튜브: <a href={fact.surfaces.youtube.url} rel="noopener">{fact.surfaces.youtube.handle}</a> · 구독자 {fact.surfaces.youtube.subscribers} · 영상 {fact.surfaces.youtube.videos}개 ({fact.surfaces.youtube.checked} 기준)</li>
      <li>강남언니: <a href={fact.surfaces.gangnamunni.url} rel="noopener">병원 페이지</a> · 평점 {fact.surfaces.gangnamunni.rating} · 후기 {fact.surfaces.gangnamunni.reviews}건 · 의료진 {fact.surfaces.gangnamunni.doctors}명</li>
      <li>카카오톡 채널: <a href={fact.kakao} rel="noopener">상담 채널</a></li>
      <li>블로그: <a href={fact.surfaces.blog.url} rel="noopener">blog.viewclinic.com</a> ({fact.surfaces.blog.note})</li>
    </ul>
    <p class="disclosure">{fact.sideEffectNotice}</p>
  </article>
</Base>