/* Exact desktop geometry from Figma frame 37:6705. */
@media (min-width: 1101px) {
  .clinic-intro-page .ci-hero {
    height: 784px;
    margin-top: 0;
  }

  .clinic-intro-page .ci-director { height: 899px; }
  .clinic-intro-page .ci-diagnosis {
    height: 1197px;
    padding-top: 165px;
    padding-bottom: 165px;
  }
  .clinic-intro-page .ci-treatment {
    height: 1231px;
    padding-top: 135px;
    padding-bottom: 135px;
  }
  .clinic-intro-page .ci-media {
    height: 862px;
    padding-top: 140px;
    padding-bottom: 120px;
  }
  .clinic-intro-page .ci-ba {
    height: 957px;
    padding-top: 120px;
    padding-bottom: 130px;
  }
  .clinic-intro-page .ci-contact {
    height: 739px;
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .clinic-intro-page footer { height: 394px; }

  .clinic-intro-page .ci-specialty{overflow:hidden}
  .clinic-intro-page .ci-specialty>div{display:flex;justify-content:center}
  .clinic-intro-page .ci-specialty a{flex:0 0 350px;width:350px;height:350px;margin-left:-83px;border-radius:50%}
  .clinic-intro-page .ci-specialty a:first-child{margin-left:0}
}

/* Figma 61:550 — 병원 소개의 마지막 오시는 길 */
.clinic-intro-page .ci-directions{box-sizing:border-box;padding:115px 40px 125px;background:#efefef;color:#292524}
.clinic-intro-page .ci-directions-head{text-align:center}
.clinic-intro-page .ci-directions-head p{margin:0;color:#e58f96;font-size:28px;font-weight:500;letter-spacing:.02em}
.clinic-intro-page .ci-directions-head h2{margin:12px 0 0;font-size:55px;font-weight:700;line-height:1.2;letter-spacing:-.05em}
.clinic-intro-page .ci-directions-body{display:grid;grid-template-columns:minmax(0,618px) minmax(0,724px);gap:63px;align-items:start;width:min(1376px,100%);margin:115px auto 0}
.clinic-intro-page .ci-directions-label{margin:0 0 26px;color:#e58f96;font-size:18px;font-weight:600}
.clinic-intro-page .ci-directions-copy h3{margin:0;font-size:55px;font-weight:700;line-height:1.27;letter-spacing:-.055em}
.clinic-intro-page .ci-directions-copy h3 em{color:#e58f96;font-style:normal}
.clinic-intro-page .ci-directions-intro{margin:34px 0 47px;color:#67615e;font-size:18px;line-height:1.8}
.clinic-intro-page .ci-directions-copy dl{display:grid;grid-template-columns:117px 1fr;gap:24px 15px;margin:0;padding-top:36px;border-top:1px solid #ccc5c1}
.clinic-intro-page .ci-directions-copy dt{font-size:16px;font-weight:700;line-height:1.7}
.clinic-intro-page .ci-directions-copy dd{margin:0;color:#5f5955;font-size:16px;line-height:1.7}
.clinic-intro-page .ci-directions-map{position:relative;height:677px;margin:0;overflow:hidden;border-radius:22px;background:#ddd}
.clinic-intro-page .ci-directions-map>img:first-child{width:100%;height:100%;object-fit:cover}
.clinic-intro-page .ci-directions-marker{position:absolute;top:45%;left:53%;width:143px;height:143px;transform:translate(-50%,-50%);object-fit:contain}

@media(max-width:900px){
  .clinic-intro-page .ci-directions{padding:80px 24px}
  .clinic-intro-page .ci-directions-head p{font-size:18px}
  .clinic-intro-page .ci-directions-head h2{font-size:42px}
  .clinic-intro-page .ci-directions-body{grid-template-columns:1fr;gap:50px;margin-top:64px}
  .clinic-intro-page .ci-directions-copy h3{font-size:42px}
  .clinic-intro-page .ci-directions-map{height:min(70vw,560px)}
}
@media(max-width:560px){
  .clinic-intro-page .ci-directions{padding:62px 20px 72px}
  .clinic-intro-page .ci-directions-head h2,.clinic-intro-page .ci-directions-copy h3{font-size:34px}
  .clinic-intro-page .ci-directions-body{margin-top:45px}
  .clinic-intro-page .ci-directions-copy dl{grid-template-columns:82px 1fr;gap:19px 10px}
  .clinic-intro-page .ci-directions-copy dt,.clinic-intro-page .ci-directions-copy dd{font-size:14px}
  .clinic-intro-page .ci-directions-map{height:88vw;border-radius:14px}
  .clinic-intro-page .ci-directions-marker{width:92px;height:92px}
}

/* Figma 37:6705 — specialty icons, media and contact */
.clinic-intro-page .ci-treatment{position:relative;background-color:#fdedee;background-image:url('assets/clinic-intro/treatment-background.svg');background-repeat:no-repeat;background-position:center;background-size:100% 100%}
.clinic-intro-page .ci-treatment>.ci-heading,.clinic-intro-page .ci-treatment>.ci-service-list{position:relative;z-index:1}
.clinic-intro-page .ci-specialty a{position:relative;gap:26px}
.clinic-intro-page .ci-specialty a img{width:96px;height:96px;object-fit:contain;filter:brightness(0) invert(1)}
.clinic-intro-page .ci-specialty a.active{border-color:#f08d92}
.clinic-intro-page .ci-specialty a.active img{filter:none}
.clinic-intro-page .ci-specialty a.active b{color:#f08d92}

.clinic-intro-page .ci-media .ci-en{font-size:20px;font-weight:600;line-height:1.4}
.clinic-intro-page .ci-media h2{margin:10px 0 0;font-size:18px;font-weight:500}
.clinic-intro-page .ci-media>div{gap:14px;margin-top:48px}
.clinic-intro-page .ci-media article{min-width:0}
.clinic-intro-page .ci-media img{border-radius:15px}
.clinic-intro-page .ci-media h3{margin:18px 0 7px;font-size:16px;line-height:1.45}
.clinic-intro-page .ci-media article p{margin:0;color:#777;font-size:13px;line-height:1.6}

.clinic-intro-page .ci-contact{align-items:start;grid-template-columns:1.08fr 1fr 1fr;gap:48px}
.clinic-intro-page .ci-contact .ci-en{font-size:44px;font-weight:500;line-height:1.2}
.clinic-intro-page .ci-contact dl{margin-top:42px;grid-template-columns:92px 1fr;gap:22px 18px;font-size:13px}
.clinic-intro-page .ci-contact dt{font-size:13px}
.clinic-intro-page .ci-contact dd{color:#555;line-height:1.75}
.clinic-intro-page .ci-contact .ci-phone{color:#2a2a2a;font-size:20px;font-weight:600}
.clinic-intro-page .ci-contact form{display:grid;grid-template-columns:1fr 1fr;gap:18px 14px;padding-top:4px}
.clinic-intro-page .ci-contact form label{display:flex;flex-direction:column;gap:9px;color:#333;font-size:12px;font-weight:700}
.clinic-intro-page .ci-contact form label em{color:#ff6f61;font-style:normal}
.clinic-intro-page .ci-contact input:not([type=checkbox]),.clinic-intro-page .ci-contact textarea{width:100%;margin:0;padding:16px 20px;border:1px solid #dbdbdb;border-radius:20px;background:#fff;font:500 13px Pretendard,sans-serif;outline:none}
.clinic-intro-page .ci-contact textarea{height:111px;border-radius:14px;resize:none}
.clinic-intro-page .ci-contact .ci-message,.clinic-intro-page .ci-contact .ci-agree{grid-column:1/-1}
.clinic-intro-page .ci-contact .ci-agree{display:flex;flex-direction:row;align-items:center;gap:8px;font-weight:500}
.clinic-intro-page .ci-contact .ci-agree input{width:20px;height:20px;margin:0;accent-color:#dd8f93}
.clinic-intro-page .ci-contact .ci-agree a{margin-left:auto;font-size:11px;font-weight:500}
.clinic-intro-page .ci-contact button{justify-self:end;min-width:168px;height:48px;padding:0 28px;border-radius:999px;font-size:14px}
.clinic-intro-page .ci-contact>img{height:330px;border-radius:18px}

@media(max-width:760px){
  .clinic-intro-page .ci-treatment{background-position:center bottom;background-size:auto 72%}
  .clinic-intro-page .ci-specialty a{gap:12px}
  .clinic-intro-page .ci-specialty a img{width:58px;height:58px}
  .clinic-intro-page .ci-media>div{gap:34px}
  .clinic-intro-page .ci-contact form{grid-template-columns:1fr}
  .clinic-intro-page .ci-contact form label,.clinic-intro-page .ci-contact .ci-message,.clinic-intro-page .ci-contact .ci-agree{grid-column:1}
}
