/* --------- 基本設定（モバイルファースト） --------- */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif;line-height:1.6;color:#222;background:#fff}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.container{width:clamp(320px, 92vw, 1080px);margin:0 auto;padding:12px}

/* ヘッダー */
.site-header{position:sticky;top:0;z-index:50;background:#ffffffcc;backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid #eee}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{font-weight:700}
.cta-tel{padding:8px 12px;border:1px solid #ddd;border-radius:8px}

/* ヒーロー */
.hero{position:relative;display:grid;gap:0}
.hero img{width:100%;aspect-ratio: 2 / 1;object-fit:cover}
.hero-copy{position:absolute;inset:auto 12px 12px 12px;background:#00000080;color:#fff;padding:12px;border-radius:12px}
.hero-copy h1{margin:0 0 6px;font-size:clamp(18px, 5vw, 28px)}

.btn{display:inline-block;padding:10px 14px;border-radius:10px;border:1px solid #ddd;background:#fff}
.btn.primary{background:#0EB354 ;color:#fff;border-color:#0EB354}
.btn.primary1{background:#090550;color:#fff;border-color:#090550}
.btn-row {
display: flex;
gap: 8px;
margin-top: 8px;
justify-content: center; /* 中央寄せ */
}

.notice-box {
background-color:  #bf8016; /* 背景色（画像の赤茶系に近づける） */
color: #fff; /* 文字色は白 */
padding: 16px; /* 内側余白 */
border-radius: 6px; /* 角を少し丸く */
font-size: 14px;
line-height: 1.6;
margin-top: 12px;
}

/* セクション */
.section{padding:20px 0}
.section.alt{background:#fafafa}
.section.highlight{background:#f0f9ff;border-block:1px solid #e6f2fb}
h2{font-size:clamp(18px,5vw,22px);margin:0 0 10px}
.hours .row{display:flex;justify-content:space-between;padding:10px;border-bottom:1px dashed #eee}
.note{font-size:13px;color:#666;margin-top:8px}

.list{padding-left:18px}
.list li{margin-bottom:6px}

/* カード（診療内容） */
.cards{display:grid;grid-template-columns:1fr;gap:10px}
.card{padding:14px;border:1px solid #eee;border-radius:12px;background:#fff}
.card h3{margin:0 0 6px;font-size:16px}

.map-wrap{margin-top:10px}
.map-placeholder{height:220px;border:2px dashed #ccc;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#777;font-size:14px}

/* フッター */
.site-footer{padding:20px 0;border-top:1px solid #eee;background:#fff;margin-top:20px}
.site-footer .container{display:flex;justify-content:space-between;align-items:center}
.to-top{padding:6px 10px;border:1px solid #ddd;border-radius:8px}

/* ちょい広端末での強化 */
@media (min-width: 600px){
  .hero-copy{inset:auto auto 24px 24px;max-width:70%}
  .cards{grid-template-columns:repeat(3, 1fr)}
}