/* 홈 개편 2026-10-27 (원장 승인, 브라운치과 벤치마크). 업체 main.css 는 건드리지 않고 이 파일만 덧붙인다.
   신설: intro-con(소개·요약), strength-con(강점 6블록·숫자 카운터), dept-con(진료과목 타일), links-con(진료 안내 전체 링크), FAQ 탭 "대전 치과 선택".
   토큰은 업체 것 그대로: 남색 #15264B, 본문 #666, rem=10px, 컨테이너 .area */

/* ---------- 메인 비주얼: 보이는 h1 (업체 h2 스타일 그대로 상속) ---------- */
#main .visual-con .txt-wrap h1.main-tit {font-size:7rem;font-weight:800;line-height:9rem;margin:0;}
#main .visual-con .visual1 .visual-video-bg,
#main .visual-con .visual1 .visual-video {object-fit:cover;}

/* ---------- 소개 ---------- */
#main .intro-con {padding:14rem 0 12rem;background:#fff;overflow:hidden;}
#main .intro-con .intro-grid {display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,0.95fr);gap:8rem;align-items:center;}
#main .intro-con .eyebrow {font-family:"Montserrat",sans-serif;font-size:1.4rem;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:#8a93a8;}
#main .intro-con .main-tit {margin-top:2rem;font-size:5.4rem;font-weight:800;line-height:7rem;color:#15264B;word-break:keep-all;}
#main .intro-con .lead {margin-top:3rem;font-size:1.9rem;line-height:3.3rem;color:#555;word-break:keep-all;}
#main .intro-con .lead + .lead {margin-top:1.6rem;}
#main .intro-con .intro-quote {position:relative;margin:4rem 0 0;padding:2.8rem 3.2rem 2.8rem 4.4rem;border-left:0.4rem solid #15264B;background:#f4f6fa;border-radius:0 1.6rem 1.6rem 0;font-size:1.9rem;line-height:3.2rem;color:#15264B;font-weight:600;word-break:keep-all;}
#main .intro-con .intro-quote::before {content:"\201C";position:absolute;left:1.4rem;top:1.2rem;font-family:Georgia,serif;font-size:4.4rem;line-height:1;color:#c7cedd;}
#main .intro-con .intro-quote cite {display:block;margin-top:1.2rem;font-style:normal;font-size:1.5rem;font-weight:500;color:#7a8396;}
#main .intro-con .intro-summary {margin:4rem 0 0;padding:0;list-style:none;border-top:0.1rem solid #e3e7ef;}
#main .intro-con .intro-summary li {display:grid;grid-template-columns:9rem 1fr;gap:1.6rem;padding:1.5rem 0;border-bottom:0.1rem solid #e3e7ef;font-size:1.6rem;line-height:2.6rem;color:#555;word-break:keep-all;}
#main .intro-con .intro-summary li span i {display:block;font-style:normal;white-space:nowrap;}
#main .intro-con .intro-summary li strong {font-size:1.5rem;font-weight:800;color:#15264B;letter-spacing:0.02em;}
#main .intro-con .intro-visual {position:relative;}
#main .intro-con .intro-photo {position:relative;overflow:hidden;border-radius:2.4rem;aspect-ratio:4/5;background:#e9edf3;}
#main .intro-con .intro-photo img {display:block;width:100%;height:100%;object-fit:cover;object-position:50% 20%;will-change:transform;}
#main .intro-con .intro-badge {position:absolute;left:-2.4rem;bottom:4rem;padding:2rem 2.6rem;border-radius:1.8rem;background:#15264B;color:#fff;box-shadow:0 1.6rem 4rem rgba(21,38,75,0.28);}
#main .intro-con .intro-badge strong {display:block;font-family:"Montserrat",sans-serif;font-size:3.6rem;font-weight:700;line-height:1;}
#main .intro-con .intro-badge span {display:block;margin-top:0.8rem;font-size:1.4rem;font-weight:500;opacity:0.85;}

/* ---------- 강점 6블록 ---------- */
#main .strength-con {padding:12rem 0;background:#f7f8fb;}
#main .strength-con .st-list {margin-top:7rem;}
#main .strength-con .st-item {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7rem;align-items:center;padding:6rem 0;border-top:0.1rem solid #e3e7ef;}
#main .strength-con .st-item:first-child {border-top:0;padding-top:0;}
#main .strength-con .st-item:nth-child(even) .st-media {order:2;}
#main .strength-con .st-media {position:relative;overflow:hidden;border-radius:2.4rem;aspect-ratio:5/4;background:#dfe4ec;}
#main .strength-con .st-item:first-child .st-media {aspect-ratio:16/10;}
#main .strength-con .st-media img,
#main .strength-con .st-media video {display:block;width:100%;height:100%;object-fit:cover;}
#main .strength-con .st-eng {font-family:"Montserrat",sans-serif;font-size:1.3rem;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:#8a93a8;}
#main .strength-con .st-body h4 {margin-top:1.6rem;font-size:3.4rem;font-weight:800;line-height:4.8rem;color:#15264B;word-break:keep-all;}
#main .strength-con .st-body > p {margin-top:2rem;font-size:1.7rem;line-height:3rem;color:#555;word-break:keep-all;}
#main .strength-con .st-num {display:flex;gap:4rem;margin:3rem 0 0;padding:0;list-style:none;}
#main .strength-con .st-num li strong {display:block;font-family:"Montserrat",sans-serif;font-size:4.2rem;font-weight:700;line-height:1;color:#15264B;}
#main .strength-con .st-num li strong small {font-size:2rem;font-weight:700;margin-left:0.2rem;}
#main .strength-con .st-num li span {display:block;margin-top:0.8rem;font-size:1.4rem;color:#7a8396;}
#main .strength-con .st-link {display:inline-flex;align-items:center;gap:0.8rem;margin-top:3rem;padding:1.2rem 2rem;border:0.1rem solid #15264B;border-radius:9999px;font-size:1.5rem;font-weight:700;color:#15264B;transition:background .2s,color .2s;}
#main .strength-con .st-link::after {content:"\2192";font-size:1.6rem;}
#main .strength-con .st-link:hover {background:#15264B;color:#fff;}

/* ---------- 진료과목 타일 (사진형) ---------- */
#main .dept-con {padding:12rem 0;background:#fff;}
#main .dept-con .dept-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2.4rem;margin-top:6rem;}
#main .dept-con .dept-grid a {display:block;position:relative;overflow:hidden;border-radius:2rem;background:#f4f6fa;box-shadow:0 0.2rem 0.8rem rgba(21,38,75,0.06);transition:transform .3s,box-shadow .3s;}
#main .dept-con .dept-grid a:hover {transform:translateY(-0.5rem);box-shadow:0 1.8rem 4rem rgba(21,38,75,0.16);}
#main .dept-con .dept-grid .dept-img {display:block;aspect-ratio:16/10;overflow:hidden;background:#dfe4ec;}
#main .dept-con .dept-grid .dept-img img {display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
#main .dept-con .dept-grid a:hover .dept-img img {transform:scale(1.06);}
#main .dept-con .dept-grid .dept-txt {display:block;padding:2.2rem 2.4rem 2.6rem;}
#main .dept-con .dept-grid em {display:block;font-family:"Montserrat",sans-serif;font-style:normal;font-size:1.2rem;font-weight:600;letter-spacing:0.12em;color:#8a93a8;}
#main .dept-con .dept-grid strong {display:block;margin-top:1rem;font-size:2.1rem;font-weight:800;line-height:3rem;color:#15264B;word-break:keep-all;}
#main .dept-con .dept-grid .dept-txt > span {display:block;margin-top:0.6rem;font-size:1.5rem;line-height:2.4rem;color:#7a8396;word-break:keep-all;}
#main .dept-con .dept-grid a::after {content:"\2192";position:absolute;right:2.2rem;bottom:2.4rem;font-size:1.8rem;color:#15264B;opacity:0;transition:opacity .25s;}
#main .dept-con .dept-grid a:hover::after {opacity:1;}

/* ---------- 진료 안내 전체 링크 ---------- */
#main .links-con {padding:10rem 0;background:#15264B;color:#fff;}
#main .links-con .tit-wrap.cmn .main-tit {color:#fff;}
#main .links-con .tit-wrap.cmn .desc {color:rgba(255,255,255,0.72);}
#main .links-con .links-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4rem;margin-top:6rem;}
#main .links-con .links-grid h4 {font-size:1.7rem;font-weight:800;color:#fff;padding-bottom:1.2rem;border-bottom:0.1rem solid rgba(255,255,255,0.25);}
#main .links-con .links-grid ul {margin:1.4rem 0 0;padding:0;list-style:none;}
#main .links-con .links-grid li {margin-top:0.8rem;}
#main .links-con .links-grid a {font-size:1.5rem;line-height:2.4rem;color:rgba(255,255,255,0.82);word-break:keep-all;}
#main .links-con .links-grid a:hover {color:#fff;text-decoration:underline;}
#main .links-con .links-kw {margin-top:5rem;padding-top:2.4rem;border-top:0.1rem solid rgba(255,255,255,0.25);font-size:1.4rem;line-height:2.4rem;color:rgba(255,255,255,0.72);word-break:keep-all;}
#main .links-con .links-kw a {color:#fff;font-weight:600;}

/* ---------- 모션 보조 ---------- */
@media (prefers-reduced-motion: reduce) {
  #main .intro-con .intro-photo img {transform:none !important;}
}

/* ---------- 반응형 ---------- */
@media all and (max-width:1280px) {
  #main .intro-con .main-tit {font-size:4.6rem;line-height:6rem;}
  #main .strength-con .st-body h4 {font-size:3rem;line-height:4.2rem;}
  #main .dept-con .dept-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
  #main .links-con .links-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media all and (max-width:960px) {
  #main .intro-con {padding:9rem 0 8rem;}
  #main .intro-con .intro-grid {grid-template-columns:1fr;gap:4rem;}
  #main .intro-con .intro-visual {order:-1;}
  #main .intro-con .intro-photo {aspect-ratio:4/3;}
  #main .intro-con .intro-badge {left:1.6rem;bottom:1.6rem;}
  #main .strength-con {padding:8rem 0;}
  #main .strength-con .st-item {grid-template-columns:1fr;gap:3rem;padding:4rem 0;}
  #main .strength-con .st-item:nth-child(even) .st-media {order:0;}
  #main .dept-con {padding:8rem 0;}
  #main .dept-con .dept-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem;}
  #main .links-con {padding:7rem 0;}
  #main .links-con .links-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem;}
}
@media all and (max-width:550px) {
  #main .visual-con .txt-wrap h1.main-tit {font-size:4.6rem;line-height:1.3;}
  #main .intro-con .main-tit {font-size:3.6rem;line-height:4.8rem;}
  #main .intro-con .lead {font-size:1.7rem;line-height:2.9rem;}
  #main .intro-con .intro-summary li {grid-template-columns:7rem 1fr;font-size:1.5rem;line-height:2.4rem;}
  #main .intro-con .intro-summary li span i {white-space:normal;}
  #main .strength-con .st-body h4 {font-size:2.6rem;line-height:3.7rem;}
  #main .strength-con .st-num {gap:2.4rem;}
  #main .strength-con .st-num li strong {font-size:3.4rem;}
  #main .dept-con .dept-grid {grid-template-columns:1fr;}
  #main .dept-con .dept-grid .dept-txt {padding:1.8rem 2rem 2.2rem;}
  #main .links-con .links-grid {grid-template-columns:1fr;}
}