@charset "utf-8";

/*기본 폰트사이즈와 패딩 마진 변수 선언*/

:root{
    /* ===== FONT SIZE ===== */
    --fs-2xs: clamp(10px, 0.52vw, 12px);
    --fs-xs:  clamp(12px, 0.63vw, 14px);
    --fs-sm:  clamp(14px, 0.73vw, 16px);
    --fs-base:clamp(16px, 0.83vw, 18px);
    --fs-md:  clamp(18px, 0.94vw, 20px);
    --fs-lg:  clamp(20px, 1.04vw, 24px);
    --fs-xl:  clamp(24px, 1.25vw, 28px);
    --fs-xl2: clamp(28px, 1.46vw, 32px);
    --fs-2xl: clamp(30px, 1.67vw, 36px);
    --fs-3xl: clamp(34px, 1.88vw, 42px);
    --fs-4xl: clamp(42px, 2.50vw, 56px);

  
    --lh-tight: 1.2; --lh-normal: 1.45; --lh-loose: 1.7;
    --ls-tight: -0.015em; --ls-normal: 0em; --ls-wide: 0.02em;
  
    /* ===== SPACING / PADDING / MARGIN ===== */
    --sp-2xs: clamp(4px, 0.4vw, 8px);
    --sp-xs:  clamp(8px, 0.6vw, 12px);
    --sp-sm:  clamp(12px, 0.9vw, 16px);
    --sp-md:  clamp(16px, 1.3vw, 24px);
    --sp-lg:  clamp(24px, 2vw, 40px);
    --sp-lg_xl:  clamp(40px, 3vw, 56px);
    --sp-xl:  clamp(40px, 3vw, 64px);
    --sp-2xl: clamp(64px, 5vw, 100px);
    --sp-3xl: clamp(80px, 6vw, 120px);
    --sp-4xl: clamp(100px, 7.5vw, 144px); /* 🔹 최대 144px */
  }


/* 배너 기본 ====================================================================*/
.main-banner {
    width: 100%;
    position: relative;
    overflow: hidden;
    aspect-ratio: 1920/980;
  }
  
  .main-banner .swiper-slide {
    position: relative;
    aspect-ratio: 1920/980;
  }
  
  .main-banner .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  /* 가운데 글씨 */
  .banner-content {
    position: absolute;
    top: 50%;
    left: 30%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    z-index: 10;
  }
  
  .banner-content h2 {
    color: #FFF;
    font-family: Pretendard;
    font-size: min(2.5vw, 48px);
    font-weight: 500;
    line-height: 130%;
    letter-spacing: 0.96px;
    text-align: left;
    margin-bottom: min(2vw, 40px);
  }
  
  .banner-content p {
    color: #FFF;
    font-family: Pretendard;
    font-size: min(1.04vw, 20px);
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.1px;
    text-align: left;
  }
  
  /* 페이지네이션 */
  #banner-pagination {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: min(2vw, 30px);
    text-align: center;
    width: 100%;
    z-index: 10;
    top: 95%;
  }
  
  /* 비활성 점 */
  #banner-pagination .swiper-pagination-bullet {
    width: min(0.52vw, 10px);
    height: min(0.52vw, 10px);
    background: rgb(122, 122, 122);
    border-radius: 50%;
    transition: all 0.3s ease;
    margin: 0 min(0.4vw, 8px) !important;
  }
  
  /* 활성 점 */
  #banner-pagination .swiper-pagination-bullet-active {
    width: min(1.82vw, 36px);
    height: min(0.52vw, 10px);
    background: #fff;
    border-radius: 999px;
    transition: all 0.3s ease;
  }
  
  
  /*인트로====================================================================*/
.intro-section {width:100%; padding:min(7.8vw,150px) 0;}

.intro-section .inner {
  max-width:1400px; margin:0 auto; display:flex; align-items:center; justify-content:space-between;
  gap:clamp(20px,3.1vw,80px); box-sizing:border-box;
}

/* left */
.intro-left {flex:1 1 50%;}
.intro-left img {width:100%; height:auto; border-radius:2.1vw; object-fit:cover;}

/* right */
.intro-right {flex:1 1 50%; display:flex; flex-direction:column; justify-content:center; gap:2.1vw;}
.intro-right .label {color:var(--Blue-blue-600,#A7C2E8); text-align:right; font-family:Pretendard; font-size:var(--fs-md); font-weight:500; line-height:130%; letter-spacing:0.2px;}
.intro-right h2 {color:var(--GREY-900,#171717); text-align:right; font-family:Pretendard; font-size:var(--fs-2xl); font-weight:500; line-height:130%; letter-spacing:-0.36px;}
.intro-right p {
  color: var(--GREY-500, #727272);
  text-align: right;
  font-family: Pretendard;
  font-size: var(--fs-base);
  font-style: normal;
  font-weight: 400;
  line-height: 150%; /* 27px */
  letter-spacing: 0.09px;
}
.intro-right .long-img {display:flex; justify-content:flex-end; padding:0.4vw 0;}
.intro-right .long-img img {display:block; width:auto; height:4.2vw; max-height:80px; background:#eee;}

/* 반응형 */
@media (max-width:1024px) {
  .intro-section .inner {flex-direction:column; height:auto; gap:5vw; text-align:center;}
  .intro-left, .intro-right {flex:1 1 100%;}
  .intro-right {align-items:center; text-align:center; gap:3vw;}
  .intro-right .label, .intro-right h2, .intro-right p {text-align:center;}
  .intro-right p {font-size:clamp(14px,2.4vw,16px);}
  .intro-right .long-img {justify-content:center;}
}

@media (max-width:600px) {
  .intro-section {padding:clamp(60px,10vw,100px) 0;}
  .intro-section .inner {gap:7vw;}
  .intro-left img {border-radius:4vw;}
  .intro-right {gap:4vw;}
  .intro-right .label {font-size:clamp(14px,2.5vw,16px);}
  .intro-right h2 {font-size:clamp(22px,5vw,28px);}
  .intro-right p {font-size:clamp(13px,2.8vw,15px);}
  .intro-right .long-img img {height:clamp(36px,8vw,60px);}
}

  /*치료법 소개====================================================================*/
.treatment-section {position:relative; background:#F3F6FA; overflow:hidden;}

.treatment-section .inner {max-width:1400px; margin:0 auto; padding:clamp(80px,8vw,150px) 0; position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:clamp(24px,4vw,60px);}

/* left */
.treatment-left {flex:1 1 50%; display:flex; flex-direction:column; justify-content:center; gap:2.1vw; height:100%;}
.treatment-left .label {
  color: var(--Blue-blue-600, #A7C2E8);

  /* Headline 1/Medium - 20 */
  font-family: Pretendard;
  font-size: var(--fs-md);
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 26px */
  letter-spacing: 0.2px;
}
.treatment-left h2 {
  color: var(--GREY-900, #171717);
  font-family: Pretendard;
  font-size: var(--fs-2xl);
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 46.8px */
  letter-spacing: -0.36px;
}
.treatment-left p {
  color: var(--GREY-500, #727272);
  font-family: Pretendard;
  font-size: var(--fs-base);
  font-style: normal;
  font-weight: 400;
  line-height: 150%; /* 27px */
  letter-spacing: 0.09px;
}
.treatment-left .long-img {display:flex; justify-content:flex-start; padding:0.4vw 0;}
.treatment-left .long-img img {display:block; width:auto; height:clamp(40px,4.2vw,80px); background:#eee; border-radius:0.4vw; max-height: 80px;}

/* right */
.treatment-right {position:absolute; top:0; right:0; bottom:0; width:50%; overflow:hidden;}
.treatment-right img {width:100%; height:100%; object-fit:cover;}

/* 반응형 */
@media (max-width:1024px) {
  .treatment-section .inner {flex-direction:column-reverse; gap:5vw;}
  .treatment-left {flex:1 1 100%; align-items:center; text-align:center; gap:3vw;}
  .treatment-left .label, .treatment-left h2, .treatment-left p {text-align:center;}
  .treatment-left p {font-size:clamp(14px,2.4vw,16px);}
  .treatment-left .long-img {justify-content:center;}
  .treatment-right {position:relative; width:100%; height:clamp(240px,45vw,400px);}
}

@media (max-width:600px) {
  .treatment-section .inner {padding:clamp(60px,10vw,100px) 0; gap:7vw;}
  .treatment-left {gap:4vw;}
  .treatment-left .label {font-size:clamp(14px,2.5vw,16px);}
  .treatment-left h2 {font-size:clamp(22px,5vw,28px);}
  .treatment-left p {font-size:clamp(13px,2.8vw,15px);}
  .treatment-left .long-img img {height:clamp(36px,8vw,60px);}
}

  
  /*분야 소개====================================================================*/
  .field-section {width:100%; padding-top:var(--fs-4xl); padding-bottom: var(--sp-3xl);}
  .field-section .inner {max-width:1440px; margin:0 auto; display:flex; flex-wrap:wrap; gap:clamp(8px,1vw,24px); justify-content:center;}
  
  /* 카드 */
  .field-card {
    width:calc(25% - 18px); aspect-ratio:342/457; display:flex; flex-direction:column; justify-content:flex-end;
    background:linear-gradient(180deg,#93b3e0,#c2d4f0); border-radius:clamp(8px,0.8vw,16px); box-sizing:border-box; position:relative;
    transition:transform 0.3s ease; gap:10.6%; overflow:hidden; cursor: pointer;
  }


  
  /* 이미지 */
  .field-card .card-image {width:100%; flex:1 1 auto; display:flex; align-items:flex-end; justify-content:flex-end;}
  .field-card .card-image img {width:auto; height:100%; object-fit:cover; transform:scale(0.9); transition:transform 0.3s ease;}

  /* 본문 */
  .field-card .card-body {flex:0 0 30.68%; display:flex; flex-direction:column; padding:0 clamp(12px,1.5vw,20px);}
  .field-card .title-line {display:flex; justify-content:space-between; align-items:center; margin-bottom:clamp(8px,1vw,16px);}
  .field-card .title-line .title {
    color:#FFF; font-family:Pretendard;
    font-size:clamp(14px,1.5vw,24px); /* 커질 때 확대됨 */
    font-weight:500; line-height:130%; letter-spacing:0.18px;
    width:74.17218543046358%; white-space:nowrap;
  }
  .field-card .title-line .arrow {width:clamp(20px,2vw,32px); height:clamp(20px,2vw,32px); flex-shrink:0; aspect-ratio:1/1; display:flex; align-items:center;}
  
  /* 태그 */
  .field-card .card-tags {display:flex; flex-wrap:wrap; gap:clamp(4px,0.6vw,8px);}
  .field-card .card-tags span {
    display:flex; padding:clamp(3px,0.5vw,6px) clamp(5px,0.8vw,8px); justify-content:center; align-items:center; gap:clamp(4px,0.6vw,8px);
    border-radius:999px; background:rgba(255,255,255,0.20);
    color:var(--Foundation-Yellow-Light,#FBFAF6); font-family:Pretendard;
    font-size:clamp(12px,1vw,16px); /* 카드가 커질수록 커짐 */
    font-weight:400; line-height:100%; letter-spacing:0.203px;
  }
  
  /* 배경 패턴 */
  .field-card:nth-child(2),
  .field-card:nth-child(4),
  .field-card:nth-child(5),
  .field-card:nth-child(7) {border-radius:clamp(8px,0.8vw,16px); background:linear-gradient(180deg,rgba(209,222,241,0.8) 0%,#9CAFCC 100%),#FDFDFD;}
  .field-card:nth-child(1),
  .field-card:nth-child(3),
  .field-card:nth-child(6),
  .field-card:nth-child(8) {border-radius:clamp(8px,0.8vw,16px); background:linear-gradient(180deg,rgba(184,213,255,0.8) 0%,#6E84A4 100%),#FDFDFD;}
  
  /* 텍스트 박스 */
  .text_box_center {width:100%; padding-top:clamp(60px,8vw,150px);}
  .text_box_center h2 {
    color: var(--GREY-900, #171717);
    text-align: center;
    font-family: Pretendard;
    font-size: var(--fs-xl2);
    font-style: normal;
    font-weight: 500;
    line-height: 100%; /* 36px */
    letter-spacing: -0.36px;
  }
  .text_box_center p {
    color: var(--Blue-blue-600, #A7C2E8);
    text-align: center;

    /* Headline 1/Medium - 20 */
    font-family: Pretendard;
    font-size: var(--fs-md);
    font-style: normal;
    font-weight: 500;
    line-height: 130%; /* 26px */
    letter-spacing: 0.2px;
    margin-bottom: 12px;
  }
  
  /* 반응형 - 1000px 이하에서 1줄에 2개 */
  @media (max-width:1200px) {
    .field-section .inner {gap:clamp(10px,2vw,20px);}
    .field-card {
      width:calc(50% - clamp(10px,2vw,20px));
      aspect-ratio:342/457;
    }

    .field-card .title-line .title {font-size: 24px;}
    .field-card .card-tags span{font-size: 16px;}
  }

  @media (max-width:768px) {
    .field-card .title-line .title {font-size: 20px;}
    .field-card .card-tags span{font-size: 14px;}
  }

  @media (max-width:600px) {
    .field-card .title-line .title {font-size: 16px;}
    .field-card .card-tags span{font-size: 12px;}
  }

  @media (max-width:500px) {
    .field-card .title-line .title {font-size: 14px;}
    .field-card .card-tags span{font-size: 10px;}
  }
  
  /*클리닉 소개====================================================================*/
/* clinic section */
.clinic-section {width:100%; padding:clamp(60px,6vw,120px) 0; background:url(/img/clinic_section_bg.png) no-repeat center bottom; background-size:cover; position:relative; overflow:hidden;}

/* 그라데이션 오버레이 (위로 갈수록 옅어짐) */
.clinic-section::before {content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(255,255,255,0.6) 0%,rgba(255,255,255,0) 60%); pointer-events:none; z-index:1;}

.clinic-section .inner {max-width:1400px; margin:0 auto; display:flex; align-items:flex-start; justify-content:space-between; gap:clamp(20px,4vw,60px); position:relative; z-index:2;}

/* left */
.clinic-left {flex:1 1 50%; display:flex; flex-direction:column; justify-content:center;}
.clinic-left .label {color:var(--Blue-blue-600,#A7C2E8); font-family:Pretendard; font-size:var(--fs-md); font-weight:500; line-height:130%; letter-spacing:0.2px; margin-bottom:clamp(8px,1vw,16px);}
.clinic-left h2 {color:var(--GREY-900,#171717); font-family:Pretendard; font-size:var(--fs-2xl); font-weight:500; line-height:120%; letter-spacing:-0.36px;}

/* right */
.clinic-right {flex:1 1 50%; display:flex; flex-direction:column; justify-content:center;}
.clinic-list {display:flex; flex-direction:column; gap:clamp(10px,1.2vw,20px); width: 560px; align-self: flex-end;}
.clinic-list li {display:flex; align-items:flex-start; gap:clamp(12px,1.5vw,24px); padding:clamp(14px,1.8vw,20px) clamp(20px,3vw,40px); border-radius:clamp(6px,0.6vw,10px); background:linear-gradient(180deg,rgba(102,102,102,0.02) 0%,rgba(0,0,0,0.05) 100%);}
.clinic-list li .num {color:var(--Blue-blue-500,#B8D5FF); font-family:Pretendard; font-size:var(--fs-lg); font-weight:500; line-height:130%; letter-spacing:0.24px; white-space:nowrap;}
.clinic-list li .text {color:var(--GREY-700,#444); font-family:Pretendard; font-size:var(--fs-lg); font-weight:500; line-height:130%; letter-spacing:0.24px;}

/* 반응형 */
@media (max-width:1024px) {
  .clinic-section .inner {flex-direction:column; align-items:center; text-align:center; gap:clamp(24px,5vw,60px);}
  .clinic-left, .clinic-right {flex:1 1 100%; max-width:100%; width: 100%;}
  .clinic-left h2 {font-size:clamp(24px,4.8vw,32px);}
  .clinic-list li {padding:clamp(12px,3vw,20px) clamp(16px,5vw,28px);}
  .clinic-list{width: 100%;}
}

@media (max-width:600px) {
  .clinic-section {padding:clamp(50px,10vw,80px) 0;}
  .clinic-left .label {font-size:clamp(14px,3vw,16px);}
  .clinic-left h2 {font-size:clamp(22px,5vw,28px);}
  .clinic-list li { align-items:center; text-align:center; gap:clamp(8px,2vw,14px);}
  .clinic-list li .num, .clinic-list li .text {font-size:clamp(14px,3.2vw,18px);}
}

  
  /*클리닉 소개 슬라이더====================================================================*/
  /* facility section */
.facility-section {width:100%; padding:clamp(60px,8vw,120px) 0; background:#fff;}
.facility-section .inner {max-width:1440px; margin:0 auto; text-align:center;}
.facility-section .label {color:var(--Blue-blue-600,#A7C2E8); font-family:Pretendard; font-size:var(--fs-md); font-weight:500; line-height:130%; letter-spacing:0.2px; margin-bottom:clamp(8px,1vw,16px);}
.facility-section h2 {color:var(--GREY-900,#171717); font-family:Pretendard; font-size:var(--fs-2xl); font-weight:500; line-height:120%; letter-spacing:-0.36px;}

/* swiper */
.facilitySwiper {overflow:hidden; padding-top:var(--sp-lg_xl); padding-bottom: var(--sp-3xl);  position:relative;}
.facilitySwiper .swiper-slide {width:clamp(280px,48vw,690px); aspect-ratio:695/348; border-radius:clamp(8px,1vw,12px); overflow:hidden; box-shadow:0 4px 20px rgba(0,0,0,0.1); transition:transform 0.3s, opacity 0.3s; position:relative;}
.facilitySwiper .swiper-slide img {width:100%; height:100%; object-fit:cover; display:block;}
.facilitySwiper .slide-caption {position:absolute; bottom:clamp(12px,2vw,20px); left:0; right:0; text-align:center; color:#fff; width:100%; z-index:5;}
.facilitySwiper .slide-caption span {font-size:clamp(12px,1.5vw,14px); opacity:0.9; display:block;}
.facilitySwiper .slide-caption strong {font-size:clamp(16px,2vw,18px); font-weight:600;}
.facilitySwiper .swiper-slide-active {transform:scale(1.05); z-index:3; box-shadow:0 8px 24px rgba(0,0,0,0.25);}
.facilitySwiper .swiper-slide-prev,
.facilitySwiper .swiper-slide-next {transform:scale(0.9); opacity:0.7; z-index:2;}

/* buttons */
.facility-prev, .facility-next, #facility-prev, #facility-next {
  all:unset; width:clamp(36px,4vw,48px); height:clamp(36px,4vw,48px); border-radius:50%; background:rgba(0,0,0,0.15);
  display:flex; align-items:center; justify-content:center; position:absolute; top:50%; transform:translateY(-50%);
  cursor:pointer; z-index:10; transition:background 0.3s ease;
}
.facility-prev::after, .facility-next::after, #facility-prev::after, #facility-next::after {font-size:clamp(16px,2vw,20px); color:#fff;}
.facility-prev:hover, .facility-next:hover, #facility-prev:hover, #facility-next:hover {background:rgba(0,0,0,0.25);}

/* 버튼 위치 (슬라이드 바깥쪽) */
.facility-prev, #facility-prev {left:calc(50% - clamp(200px,30vw,430px));}
.facility-next, #facility-next {right:calc(50% - clamp(200px,30vw,430px));}

/* 반응형 */
@media (max-width:1024px) {
  .facilitySwiper .swiper-slide {width:70%; aspect-ratio:695/348;}
  .facility-prev, .facility-next, #facility-prev, #facility-next {background:rgba(0,0,0,0.2);}
}

@media (max-width:600px) {
  .facility-section {padding:clamp(40px,10vw,80px) 0;}
  .facilitySwiper {padding:clamp(20px,6vw,40px) 0;}
  .facilitySwiper .swiper-slide {width:85%; aspect-ratio:695/400;}
  .facility-prev, .facility-next, #facility-prev, #facility-next {width:36px; height:36px; background:rgba(0,0,0,0.25);}
  .facility-prev, #facility-prev {left:8px;}
  .facility-next, #facility-next {right:8px;}
}


  /*오시는길======================================================================*/
  /* 위·아래 유동 패딩 + 기본 레이아웃 유지 */
  .map-section {
    width: 100%;
    padding: clamp(50px, 8vw, 120px) 0;
    background: url("/img/map_bg.png") no-repeat center center;
    background-size: cover;
  }
  
  .map-section .inner {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    gap: clamp(24px, 5vw, 80px);
    align-items: center;
  }
  
  /* 좌우 비율 그대로 */
  .map-left {
    flex: 1 1 60%;
    border-radius: 10px;
    overflow: hidden;
  }
  
  .map-placeholder img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  }
  
  .map-right {
    flex: 1 1 40%;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  
  
  /* ---- 기존 텍스트 스타일은 그대로 사용 (변경 없음) ---- */
  .map-right h2 {
    color: var(--GREY-900, #171717);
    font-family: Pretendard;
    font-size: var(--fs-2xl);
    font-style: normal;
    font-weight: 500;
    line-height: 100%; /* 36px */
    letter-spacing: -0.36px;
  }
  
  .map-right .phone {
    display: inline-block;
    background: #6E84A4;
    color: var(--GREY-00, #FFF);
    padding: 0 16px;
    border-radius: 8px;
    font-family: Pretendard;
    font-size: 24px;
    font-weight: 400;
    line-height: 150%; /* 36px */
    letter-spacing: 0.12px;
    font-style: normal;
    width: 187px;
    height: 36px;
  }
  
  .map-right .time-info {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  
  .map-right .time-info li {
    color: #0C0C0C;
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.1px;
    display: flex;
    gap: 24px;
  }
  
  .map-right .time-info strong {
    color: #0C0C0C;
    font-family: Pretendard;
    font-size: var(--fs-md);
    font-style: normal;
    font-weight: 500;
    line-height: 130%;
    letter-spacing: 0.2px;
    width: 87px;
    align-self: center;
  }
  
  .map-right .time-info p {
    color: #0C0C0C;
    font-family: Pretendard;
    font-size: var(--fs-md);
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.1px;
  }
  
  .map-right .note {
    color: #999;
    font-family: Pretendard;
    font-size: var(--fs-md);
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.09px;
    margin-top: 12px;
  }
  
  .map-right .address {
    color: #0C0C0C;
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.1px;
    display: flex;
    align-items: start;
    gap: 24px;
  }
  
  .map-right .address strong {
    color: #0C0C0C;
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 130%;
    letter-spacing: 0.2px;
    width: 87px;
  }
  
  .map-right .address h6 {
    color: #0C0C0C;
    font-family: Pretendard;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.1px;
  }
  
  .map-right .separator {
    border-bottom: 1px solid #b8d5ff;
    width: 100%;
    margin: 24px 0;
  }
  
  .map-right .time-info li+li {
    margin-top: 8px;
  }
  
  /* ---------- 반응형: 레이아웃만 전환(텍스트 스타일 변경 없음) ---------- */
  
  /* 1024px 이하: 간격만 살짝 축소 */
  /* @media (max-width:1024px) {
    .map-section .inner {
      gap: 40px;
    }
  } */
  
  /* 768px 이하: 세로 스택 전환 + 좌우 요소 풀폭 */
  @media (max-width:1024px) {
    .map-section .inner {
      flex-direction: column;
      align-items: flex-start;
      gap: 30px;
    }
  
    .map-left,
    .map-right {
      flex: 1 1 100%;
      width: 100%;
    }
  
    .map-right .address {
      flex-wrap: wrap;
      gap: 16px;
    }
  
    .map-right .time-info li {
      align-items: flex-start;
      gap: 16px;
    }
  }
  
  /* 375px 이하: 아주 작은 화면에서 행간/간격 보정 */
  @media (max-width:375px) {
    .map-section {
      padding: clamp(40px, 10vw, 60px) 0;
    }
  
    .map-right .separator {
      margin: 16px 0;
    }
  
    .map-right .address {
      gap: 12px;
    }
  
    .map-right .time-info li {
      gap: 12px;
    }
  }
  
  .facilitySwiper .swiper-slide-prev, .facilitySwiper .swiper-slide-next{opacity: 1;}
  .wrap_controllers{display: none;}



