body {line-height:150%;}
#wrap{background-color: #fafafc;}
.banner .inner_wrap { max-width: 1440px; margin: 0 auto; padding: 4rem 2rem; height: 100%; } 
.contents .inner_wrap { max-width: 1280px; margin: 0 auto; } 
/* program psge */
/* banner */
.banner { width: 100%; height: calc(100vh - 8.9rem); background: url(../images/banner_background.png) no-repeat center / cover; position: relative; overflow: hidden;margin-top: 8.9rem; } 
.banner .container { width: 100%; height: 100%;align-items: center;} 
.banner .container .img { width: 103.4rem; height: 88.9rem; display: block; background: url(../images/banner_img.png) no-repeat center center / cover; position: absolute; top: -27px; right: 12.6rem; z-index: 0; } 
.banner .container .tit_area { display: flex; flex-direction: column; z-index: 1; } 
.banner .container .tit_area .year { margin-bottom: 4.165rem; } 
.banner .container .tit_area .tit { width: 35.659rem; margin-bottom: 6rem; } 
.banner .container .tit_area .info { font-family: 'SCoreDream'; color: #fff; font-size: 2rem; }
.banner .container .tit_area .info span { font-weight: 700; } 
.banner .container .tit_area .info .left { width: 72px; display: inline-block; } 
.banner .container .tit_area .info div:nth-child(2) { margin: 12px 0 24px 0; } 
.banner .container .btn_area { z-index: 1; } 
.banner .container .btn_area a { width: 32rem; height: 8.1rem; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 2.2rem; text-decoration: none; border-radius: 4px; } 
.banner .container .btn_area a.link_sale { background-color: #7D66FF; margin-bottom: 4rem; } 
.banner .container .btn_area a.link_zone { background-color: #4AB876; margin-bottom: 4rem; } 
.banner .container .btn_area a.link_gmtc { background-color: #FF47A9; } 
.banner .container .btn_area a.link_sale:hover { backdrop-filter: blur(10px); background-color: rgb(125 102 255 / 80%); }
.banner .container .btn_area a.link_zone:hover { backdrop-filter: blur(10px); background-color: rgb(74 184 118 / 80%); }
.banner .container .btn_area a.link_gmtc:hover { backdrop-filter: blur(10px); background-color: rgb(255 71 169 / 80%); } 


/* Wrapper */
.main-container {
  width: 100%;
  height: 100%;
  display: inline-flex;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  margin-top:12rem;
}

/* Tab section */
.tab-wrapper {
  width: 960px;
  padding: 8px;
  background: white;
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.08);
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  overflow: hidden;
  position: relative;
}
/* ✅ 하이라이트 배경 */
.tab-highlight {
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #006FFF;
  border-radius: 100px;
  transition: all 0.3s ease;
  z-index: 0; /* 뒤에 */
}

/* ✅ 탭들은 위에 */
.tab {
  position: relative;
  z-index: 1;
  cursor: pointer;
}
.tab {
  flex: 1 1 0;
  height: 60px;
  padding: 13px 16px;
  overflow: hidden;
  border-radius: 10px;
  background: transparent;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.tab--active {
  background: #006FFF;
  box-shadow: 4px 0px 8px rgba(0, 0, 0, 0.04);
  border-radius: 100px;
}

.tab__label {
  color: var(--mode-gray-700, #71727D);
  font-size: 18px;
  font-family: Pretendard, sans-serif;
  font-weight: 500;
  line-height: 25.2px;
  text-align: center;
  word-wrap: break-word;
}

.tab--active .tab__label {
  color: white;
  font-weight: 600;
}

/* YouTube section */
.youtube-link {
  height: 76px;
  padding: 8px 32px;
  background: white;
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.08);
  border-radius: 100px;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor:pointer;
}

.youtube-link__icon {
  width: 24px;
  height: 24px;
  position: relative;
  overflow: hidden;
}

.youtube-link__text-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
}

.youtube-link__label {
  font-size: 18px;
  font-family: Pretendard, sans-serif;
  font-weight: 500;
  color: var(--mode-gray-900, #1C1C1F);
  line-height: 25.2px;
  text-align: center;
}

.youtube-link__status-icon {
  width: 16px;
  height: 16px;
  position: relative;
  overflow: hidden;
}

.youtube-link__circle {
  position: absolute;
  outline: 1.5px var(--mode-gray-900, #1C1C1F) solid;
  outline-offset: -0.75px;
}

.youtube-link__circle--outer {
  width: 9.48px;
  height: 9.48px;
  top: 2.67px;
  left: 3.85px;
}

.youtube-link__circle--inner {
  width: 10.67px;
  height: 10.67px;
  top: 2.67px;
  left: 2.67px;
}


@media (max-width: 1370px){
    .banner .container .img { right: 0; } 
}
@media (max-width: 1280px){
    .banner { margin-top: 8.5rem; height: calc(100vh - 8.5rem); }
    .header_bg.festa {margin-top: 80px;}
}
@media (max-width: 1250px){
    .banner .container .img { right: 0; opacity: 0.3; } 
}
@media (max-width: 768px){
	.banner { margin-top: 7rem;}
    .banner .container { flex-direction: column; align-items: start; justify-content: center; padding-top: 5.5rem;display: flex;justify-content: space-between; } 
    .banner .container .img { right: -18rem; } 
    .banner .container .tit_area .year { margin-top:4.165rem; } 
    .banner .container .tit_area .tit { width: 27.659rem; } 
    .banner .container .tit_area .info { font-size: 1.8rem; } 
    .banner .container .btn_area { width: 100%; } 
    .banner .container .btn_area a { width: 100%; height: 6.1rem; font-size: 1.8rem; } 
    .banner .container .btn_area a.link_sale { margin-bottom: 2rem; margin-top: 6rem; } 
    .banner .container .btn_area a.link_zone { margin-bottom: 2rem; }
    .festa.header_bg {display:none;}
}


/* contents */
.wrap.program strong {
    color: #6a6fb1;
    font-weight: 600;
}
.program .contents .container { display: flex; justify-content: space-between; padding: 12rem 0 14rem 0; gap: 4.8rem; } 
.program .contents .left_area { max-width: 44rem; } 
.program .contents .left_area .tit { font-size: 3.2rem; font-weight: bold; line-height: 5.32rem; } 
.program .contents .left_area .desc { font-size: 1.8rem; font-weight: 400; color: #767676; line-height: 2.7rem; margin-top: 3.2rem; margin-bottom: 6rem; } 
.program .contents .left_area .green_box { background-color: #33ADFE; border-radius: 20px; color: #fff; font-size: 1.4rem; } 
.program .contents .left_area .green_box .green_box_inner { padding: 2rem; } 
.program .contents .left_area .green_box .tit_area { display: flex; align-items: center; justify-content: space-between; } 
.program .contents .left_area .green_box .tit { font-size: 2.2rem; font-weight: bold; } 
.program .contents .left_area .green_box img { width: 20px; height: 20px; } 
.program .contents .left_area .green_box ul { font-size: 1.4rem; line-height: 2.4rem; margin: 1.2rem 0 2rem 0; } 
.program .contents .right_area { display: flex; height: 850px; } 
.program .contents .right_area .right { align-content: end; margin-left: 4.8rem; } 
.program .contents .right_area .left .card:first-child,
.program .contents .right_area .right .card:first-child { margin-bottom: 4.8rem; } 

.program .contents .right_area .card { margin-bottom: 4.8rem; width: 84rem; border-radius: 20px; /* box-shadow: 0px 4px 18px 0px #0000000F; */ box-shadow: 0px 4px 10px 0px #00000029; display: block; } 
.program .contents .right_area .card .img { height: 22rem; overflow: hidden; } 
.program .contents .right_area .card .img img { width: 100%; height: 22rem; object-fit: cover; border-radius: 20px 20px 0 0; } 
.program .contents .right_area .card .info { padding: 3.2rem;display: flex;justify-content: center;flex-direction: column;} 
.program .contents .right_area .card .info .tit { font-size: 2.2rem; font-weight: 700; }
.program .contents .right_area .card .info ul { font-size: 1.8rem; font-weight: 400; color: #767676; margin: 1.2rem 0 1.6rem 0; line-height: 24px; }
.program .contents .right_area .card .info .date { font-size: 1.6rem; font-weight: 400; color: #767676; } 

.program .contents .right_area .card .info .reserveBtn {
    background-color: #FF47A9;
    width: 14rem;
    height: 5.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.6rem;
    text-decoration: none;
    border-radius: 4px;
}
.program .contents .right_area .card .info .reserveBtn:hover {
	backdrop-filter: blur(10px);
    background-color: rgb(255 71 169 / 80%);
}
#zone.program .contents .right_area {height: 800px;}
#zone.program .contents .right_area .card {display:flex;width: auto;margin-bottom: 4.8rem;}

@media (max-width: 1110px){
    .program .contents .container { display: block; } 
    .program .contents .left_area { max-width: 100%; position: relative; display: flex; justify-content: space-between; } 
    .program .contents .left_area .desc { margin-bottom: 0; } 
    .program .contents .left_area .green_box { width: calc(100% - 36rem); } 
    .program .contents .right_area { flex-direction: column; height: auto; } 
    .program .contents .right_area .left,
    .program .contents .right_area .right { display: flex; justify-content: space-evenly; margin-left: 0; margin-top: 3rem; gap: 1rem; } 
    .program .contents .right_area .left { margin-top: 5rem; } 
    .program .contents .right_area .left .card:first-child, .program .contents .right_area .right .card:first-child { /* margin-bottom: 0; */ } 
}
@media (max-width: 768px){
    .program .contents .container { padding: 6rem 0 7rem 0; } 
    .program .contents .left_area { flex-direction: column; } 
    .program .contents .left_area .desc { margin-top: 1rem; } 
    .program .contents .left_area .green_box { width: 100%; margin-top: 3rem; display: none; }
    .m_only{display:block!important;}
    .pc_only{display:none!important;}
    .program .contents .left_area.m_only .green_box { width: 100%; display: block !important; margin-top: 0rem !important;} 
}
.m_only{display:none;}
.program .contents .left_area.m_only .green_box { display: none; }
@media (max-width: 600px){
    .program .contents .right_area .left, .program .contents .right_area .right { flex-direction: column; } 
    .program .contents .right_area .card { width: 100%; } 
}


/* sale */
.sale .contents .container { padding: 12rem 0 14rem 0; } 
.sale .contents .category { margin-bottom: 11.6rem; } 
.sale .contents .category ul { display: flex; align-items: center; justify-content: space-around; }
.sale .contents .category ul li { transition: 0.2s linear; }
.sale .contents .category ul li:hover { position: sticky;margin-top: -20px;transition: 0.2s linear; }
.sale .contents .category ul li a { width: 17.6rem; display: flex; flex-direction: column; align-items: center; } 
.sale .contents .category ul li a div { width: 12rem; height: 12rem; border-radius: 50%; background-color: #F7F7F7; border: 1px solid #EDEDED; position: relative; margin-bottom: 1.2rem; } 
.sale .contents .category ul li a div img { width: 4.8rem; height: 4.8rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.sale .contents .category ul li a div img.dentist { width: 4.4rem; height: 4.4rem; } 
.sale .contents .category ul li a span { font-size: 1.8rem; font-weight: 700; color: #BBBBBB; text-align: center; height: 3.6rem; align-content: center; word-break: break-all; line-height: 1.4; } 
.sale .contents .category ul li.active a div { background-color: #F2F0FF; border: 1px solid rgba(105, 209, 174, 0.08); } 
.sale .contents .category ul li.active a div img { filter: invert(44%) sepia(52%) saturate(3000%) hue-rotate(226deg) brightness(96%) contrast(110%); } 
.sale .contents .category ul li.active a span { color: #7D66FF; }
.sale .contents .category ul li:hover a div { background-color: #F2F0FF; border: 1px solid rgba(105, 209, 174, 0.08);transition: 0.2s linear; } 
.sale .contents .category ul li:hover a div img { filter: invert(44%) sepia(52%) saturate(3000%) hue-rotate(226deg) brightness(96%) contrast(110%); transition: 0.2s linear; } 
.sale .contents .category ul li:hover a span { color: #7D66FF;transition: 0.2s linear; } 
.sale .contents .business_List .list_head { border-radius: 20px; box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12); cursor: pointer;}
.sale .contents .business_List .list_item { margin-bottom: 4rem; }
.sale .contents .business_List .list_item:nth-child(even) .list_head { background: #f7f7f7;}
.sale .contents .business_List .list_item:nth-child(even) .list_cont { background: #f7f7f7;}
.sale .contents .business_List .list_head:hover {transition: 0.2s linear;box-shadow: 0px 4px 18px 0px rgb(144 144 144 / 17%);} 
.sale .contents .business_List .list_head .list_head_inner { padding: 4rem; display: flex; /* align-items: center; */ justify-content: space-between; gap: 3rem; } 
.sale .contents .business_List .list_head .left { display: flex; align-items: center; } 
.sale .contents .business_List .list_head .left .logo { border: 1px solid #EDEDED; width: 14rem; height: 14rem; border-radius: 50%; margin-right: 4rem; background: #fff; } 
.sale .contents .business_List .list_head .left .logo img { width: 14rem; height: 14rem; object-fit: contain; border-radius: 50%; max-width: unset; } 
.sale .contents .business_List .list_head .left .name { font-size: 2rem; font-weight: 700; line-height: 1.4; } 
.sale .contents .business_List .list_head .left .path { font-size: 1.6rem; font-weight: 400; color: #767676; margin-top: 1.2rem; line-height: 1.4; } 
.sale .contents .business_List .list_head .left .path span { position: relative; display: inline-block; margin-right: 20px; } 
.sale .contents .business_List .list_head .left .path span::after { content: ''; width: 1.2rem; height: 1.2rem; background: url(../images/ico_arrow02.png) no-repeat center center / cover; position: absolute; top: 50%; right: -17px; transform: translate(0, -50%); } 
.sale .contents .business_List .list_head .left .path span:last-child::after { width: 0; height: 0; } 
.sale .contents .business_List .list_head .right { display: flex; align-items: center; justify-content: space-between;} 
.sale .contents .business_List .list_head .right .cupon_area { display: flex; align-items: center; margin-right: 8rem; }
.sale .contents .business_List .list_head .right .cupon_area .cupon { width: 100px; height: 100px; background: url(../images/img_star_red.png) no-repeat center center / cover; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; font-weight: 700; color: #fff; flex-direction: column; }
.sale .contents .business_List .list_head .right .cupon_area .cupon>.star_max { color: #FFF;text-align: center;font-size: 1.2rem;font-style: normal;font-weight: 700;line-height: 100%; }
.sale .contents .business_List .list_head .right .cupon_area .cupon>.star_dc { color: #FFF;text-align: center;font-size: 2rem;font-style: normal;font-weight: 700;line-height: 100%; }
.sale .contents .business_List .list_head .right .cupon_area .cupon.star_purple { background: url(../images/img_star_purple.png) no-repeat center center / cover; }
.sale .contents .business_List .list_head .right .cupon_area .cupon.star_yellow { background: url(../images/img_star_yellow.png) no-repeat center center / cover; }
.sale .contents .business_List .list_head .right .cupon_area .cupon.star_green { background: url(../images/img_star_green.png) no-repeat center center / cover; }

.sale .contents .business_List .list_head .right .cupon_area .cupon:hover { filter: drop-shadow(2px 0px 2px #f2f2f2); } 
.sale .contents .business_List .list_head .right .cupon_area .cupon:first-child { margin-left: 0; } 
.sale .contents .business_List .list_item .list_head .right img { transform: rotate(180deg); }
.sale .contents .business_List .list_item.active .list_head .right img { transform: rotate(0deg); -webkit-transition: 0.2s linear; -moz-transition: 0.2s linear; -ms-transition: 0.2s linear; -o-transition: 0.2s linear; transition: 0.2s linear; } 
.sale .contents .business_List .list_cont { border-radius: 20px; box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12); margin-top: 2rem; display: none; } 
.sale .contents .business_List .list_item .list_cont:nth-child(even) { background:  ue; } 
.sale .contents .business_List .list_item.active .list_cont { display: block; }
.sale .contents .business_List .list_cont .list_cont_inner { padding: 4.8rem 4rem; } 
.sale .contents .business_List .list_cont .list_cont_inner .mySwiper { overflow: hidden; } 
.sale .contents .business_List .list_cont .cupon_area { gap: 1rem; }
.sale .contents .business_List .list_cont .cupon_area li { width: 34rem; }
.sale .contents .business_List .list_cont .cupon_area li:hover { filter: drop-shadow(2px 0px 2px #ededed); } 
.sale .contents .business_List .list_cont .cupon_area::-webkit-scrollbar { display: none; } 
.coupon_modal .cupon {box-shadow: 0px 4px 18px 0px #0000000F;}
.coupon_modal .cupon,
.sale .contents .business_List .list_cont .cupon_area .cupon { width: 32rem; height: 16.8rem; background: url(../images/img_coupon_green.png) no-repeat center center / cover; text-align: left; padding-left: 36px; } 
.coupon_modal .cupon.sail_red,
.sale .contents .business_List .list_cont .cupon_area .cupon.sail_red { background: url(../images/img_coupon_red.png) no-repeat center center / cover; }
.coupon_modal .cupon.sail_yellow,
.sale .contents .business_List .list_cont .cupon_area .cupon.sail_yellow { background: url(../images/img_coupon_yellow.png) no-repeat center center / cover; }
.coupon_modal .cupon.sail_purple,
.sale .contents .business_List .list_cont .cupon_area .cupon.sail_purple { background: url(../images/img_coupon_purple.png) no-repeat center center / cover; }
.coupon_modal .cupon .percent,
.sale .contents .business_List .list_cont .cupon_area .cupon .percent { font-size: 1.6rem; font-weight: 700; color: #30C77B; }
.coupon_modal .cupon.sail_red .percent,
.sale .contents .business_List .list_cont .cupon_area .cupon.sail_red .percent{ color: #FF4D4D; }
.coupon_modal .cupon.sail_yellow .percent,
.sale .contents .business_List .list_cont .cupon_area .cupon.sail_yellow .percent{ color: #FFB038; }
.coupon_modal .cupon.sail_purple .percent,
.sale .contents .business_List .list_cont .cupon_area .cupon.sail_purple .percent{ color: #7D66FF; }

.coupon_modal .cupon .desc, 
.sale .contents .business_List .list_cont .cupon_area .cupon .desc { font-size: 1.6rem; font-weight: 400; width: 20.4rem; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-top: 1.2rem; } 
.coupon_modal .cupon .date, 
.sale .contents .business_List .list_cont .cupon_area .cupon .date { margin-top: 1.2rem; font-size: 1.4rem; font-weight: 400; color: #767676; } 
.sale .contents .business_List .list_cont .info_area { display: flex; align-items: center; gap: 4rem; margin-top: 4rem; } 
.sale .contents .business_List .list_cont .info_area img { width: 24rem; height: 24rem; border-radius: 20px; object-fit: cover;} 
.sale .contents .business_List .list_cont .info_area ul li { padding: 8px 0; display: flex; align-items: center; border-bottom: 1px solid #EDEDED; } 
.sale .contents .business_List .list_cont .info_area ul li:last-child { border-bottom: 0; } 
.sale .contents .business_List .list_cont .info_area ul li img { width: 2rem; height: 2rem; margin-right: 1.2rem; } 
.sale .contents .business_List .list_cont .info_area ul li span { font-size: 1.5rem; font-weight: 400; } 
.sale .contents .business_List .list_cont .about_area,
.sale .contents .business_List .list_cont .dept_area { margin-top: 4rem; } 
.sale .contents .business_List .list_cont .about_area .tit,
.sale .contents .business_List .list_cont .dept_area .tit { font-size: 1.8rem; font-weight: 700; margin-bottom: 1.2rem; } 
.sale .contents .business_List .list_cont .about_area p,
.sale .contents .business_List .list_cont .dept_area p { font-size: 1.5rem; font-weight: 400; color: #767676; } 
@media (max-width: 1024px){
	.category-list{display: grid!important;}
    .sale .contents .business_List .list_head .right .cupon_area { margin-right: 4rem; } 
}
@media (max-width: 940px){
    .sale .contents .category ul li a { width: 14.7rem; } 
    .sale .contents .category ul li a div { width: 10rem; height: 10rem; } 
    .sale .contents .category ul li a span { font-size: 1.5rem; } 
}
@media (max-width: 900px) {
    .sale .contents .business_List .list_head .left .logo { width: 10rem; height: 10rem; margin-right: 2rem; } 
    .sale .contents .business_List .list_head .left .logo img { width: 10rem; height: 10rem; } 
    .sale .contents .business_List .list_head .left .name { font-size: 1.8rem; } 
    .sale .contents .business_List .list_head .left .path { font-size: 1.4rem; } 
    .sale .contents .business_List .list_head .right .cupon_area { margin-right: 2rem; } 
}
@media (max-width: 800px){
    .sale .contents .category ul li a { width: 13.7rem; } 
    .sale .contents .category ul li a span { font-size: 1.4rem; } 
}
@media (max-width: 768px){
    .sale .contents .container { padding: 6rem 0 7rem 0; } 
    .sale .contents .category { margin-bottom: 5.3rem; } 
    .sale .contents .category ul li a { width: 11.7rem; } 
    .sale .contents .category ul li a div { width: 8rem; height: 8rem; } 
    .sale .contents .category ul li a div img { width: 3.8rem; height: 3.8rem; } 
    .sale .contents .category ul li a div img.dentist { width: 3.4rem; height: 3.4rem; } 
    .sale .contents .category ul li a span { font-size: 1.2rem; } 
    .sale .contents .business_List .list_head .list_head_inner { padding: 2rem; gap: 1rem; flex-direction: column; } 
    .sale .contents .business_List .list_head .left .logo { width: 8rem; height: 8rem; } 
    .sale .contents .business_List .list_head .left .logo img { width: 8rem; height: 8rem; } 
    .sale .contents .business_List .list_head .left .name { font-size: 1.6rem; } 
    .sale .contents .business_List .list_head .left .path { font-size: 1.2rem; } 
    .sale .contents .business_List .list_head .right .cupon_area .cupon { width: 60px; height: 60px; font-size: 1.2rem; } 
    .sale .contents .business_List .list_head .right img { width: 14px; height: 14px; } 
    .sale .contents .business_List .list_head .right .cupon_area { display: flex; /* flex-wrap: wrap; */ justify-content: center; gap: 0.5rem; margin-right: 1rem; width: 12rem; } 
    .sale .contents .business_List .list_head .right .cupon_area .cupon { margin-left: 0; } 
    .sale .contents .business_List .list_cont .cupon_area li { width: 24.5rem; } 
    .sale .contents .business_List .list_cont .cupon_area .cupon { width: 23rem; height: 11.858rem; padding-left: 22px; } 
    .sale .contents .business_List .list_cont .cupon_area .cupon .percent { font-size: 1.4rem; } 
    .sale .contents .business_List .list_cont .cupon_area .cupon .desc { width: 13rem; font-size: 1.3rem; /* margin: 1rem 0; */ } 
    .sale .contents .business_List .list_cont .cupon_area .cupon .date { font-size: 1.2rem; }
    .cupon_area > li { --border-width: 6px; border-radius: 15px; }
    .cupon .strong {font-size: 1.3rem;display:flex;}
    .cupon .strong svg {width: 9px;}
    .cupon .line-through {font-size: 1.2rem;display:flex;}
    .cupon .line-through svg {width: 8px;}
}
.cupon .won {display:flex;gap:3px;}
@media (max-width: 620px){
    .sale .contents .category { display: flex; justify-content: center; } 
    .sale .contents .category ul { flex-wrap: wrap; justify-content: center; row-gap: 3rem; width: 36rem; } 
    .sale .contents .business_List .list_cont .info_area { flex-direction: column; } 
}
@media (max-width: 460px){
    .sale .contents .business_List .list_head .right .cupon_area { width: auto; flex-wrap: nowrap;} 
    .sale .contents .business_List .list_head .left .path span { margin-right: 10px; } 
    .sale .contents .business_List .list_head .left .path span::after { width: 1rem; height: 1rem; right: -11px; } 
}


.filter-container {
  width: 100%;
  height: 100%;
  padding: 40px 80px;
  background: white;
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.08);
  border-radius: 32px;
  display: inline-flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 32px;
  margin-bottom:8rem;
}

.category-list {
  display: inline-flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 12px;
}

@media (max-width: 768px) {
  .filter-container {
    padding: 24px 20px;
    border-radius: 20px;
    gap: 24px;
    margin-bottom: 4rem;
  }
  
  .category-list {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
  }
  
  .category-item {
    padding: 4px 12px 4px 4px;
    gap: 6px;
  }
  
  .category-icon {
    padding: 6px;
  }
  
  .category-label {
    font-size: 14px;
    line-height: 19.6px;
  }
}

@media (max-width: 480px) {
  .filter-container {
    padding: 20px 16px;
    border-radius: 16px;
    gap: 20px;
  }
  
  .category-list {
    gap: 6px;
  }
  
  .category-item {
    padding: 3px 8px 3px 3px;
    gap: 4px;
  }
  
  .category-icon {
    padding: 4px;
  }
  
  .category-label {
    font-size: 12px;
    line-height: 16.8px;
  }
}

.category-item {
  padding: 6px 20px 6px 6px;
  background: white;
  border-radius: 100px;
  outline: 1px var(--mode-gray-200, #E6E6ED) solid;
  outline-offset: -1px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.category-item--active {
  background: #006FFF;
  outline: none;
}

.category-icon {
  padding: 8px;
  background: #EBF3FF;
  border-radius: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.icon-select-all {
  width: 28px;
  height: 28px;
  position: relative;
  overflow: hidden;
}
.icon-select-all .icon-square {
  width: 9px;
  height: 9px;
  position: absolute;
  background: #478BFF;
}
.icon-select-all .icon-square:nth-child(1) { left: 4px; top: 15px; }
.icon-select-all .icon-square:nth-child(2) { left: 4px; top: 4px; }
.icon-select-all .icon-square:nth-child(3) { left: 15px; top: 15px; }
.icon-select-all .icon-square:nth-child(4) { left: 15px; top: 4px; }

.category-label {
  color: var(--mode-gray-900, #1C1C1F);
  font-size: 18px;
  font-family: Pretendard;
  font-weight: 400;
  line-height: 25.2px;
  word-wrap: break-word;
}
.category-label--white {
  color: var(--mode-white, white);
}

.icon-frame {
  width: 28px;
  height: 28px;
  position: relative;
  overflow: hidden;
}
.icon-frame-bg {
  width: 28.01px;
  height: 17.5px;
  left: 0px;
  top: 5.25px;
  position: absolute;
}
.icon-frame-eye {
  width: 14.33px;
  height: 13.77px;
  left: 7.22px;
  top: 6.84px;
  position: absolute;
}
.icon-frame-eye2 {
  width: 12.83px;
  height: 12.68px;
  left: 7.59px;
  top: 7.66px;
  position: absolute;
}
.icon-frame-reflect {
  width: 6.18px;
  height: 5.95px;
  left: 11.29px;
  top: 11.23px;
  position: absolute;
  background: linear-gradient(0deg, #81A0DA 0%, #81A0DA 100%);
}
.icon-frame-reflect2 {
  width: 6.02px;
  height: 5.95px;
  left: 10.99px;
  top: 11.03px;
  position: absolute;
}
.icon-frame-dot {
  width: 1.47px;
  height: 0.99px;
  left: 11.91px;
  top: 11.43px;
  position: absolute;
}

.icon-tooth {
  width: 28px;
  height: 28px;
  position: relative;
}
.icon-tooth-img {
  width: 24px;
  height: 24px;
  left: 2px;
  top: 2px;
  position: absolute;
}

.icon-scalpel {
  width: 28px;
  height: 28px;
  position: relative;
  overflow: hidden;
}
.icon-scalpel-blade {
  width: 11.63px;
  height: 12.64px;
  left: 2px;
  top: 13.36px;
  position: absolute;
  background: #ADCAFF;
  box-shadow: 0px 1px 1px rgba(255, 255, 255, 0.40) inset;
}
.icon-scalpel-handle {
  width: 14.14px;
  height: 14.32px;
  left: 11.86px;
  top: 2px;
  position: absolute;
  background: #4D8BFF;
  box-shadow: 0px 1px 1px rgba(255, 255, 255, 0.40) inset;
}

.icon-derma {
  width: 28px;
  height: 28px;
  position: relative;
}
.icon-derma-img {
  width: 28px;
  height: 28px;
  left: 0px;
  top: 0px;
  position: absolute;
}

.icon-etc {
  width: 28px;
  height: 28px;
  position: relative;
  overflow: hidden;
}
.icon-etc-dot {
  width: 4.67px;
  height: 4.67px;
  position: absolute;
  background: #478BFF;
}
.icon-etc-dot:nth-child(1) { left: 3.5px; top: 11.67px; }
.icon-etc-dot:nth-child(2) { left: 19.83px; top: 11.67px; }
.icon-etc-dot:nth-child(3) { left: 11.67px; top: 11.67px; }

.info-section {
  align-self: stretch;
  display: inline-flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 120px;
}

.info-block {
  flex: 1 1 0;
  padding-bottom: 32px;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 32px;
}

.info-title {
  color: var(--mode-gray-900, #1C1C1F);
  font-size: 20px;
  font-family: Pretendard;
  font-weight: 600;
  line-height: 28px;
  word-wrap: break-word;
}

.info-bar {
  align-self: stretch;
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
}

.info-bar-item {
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.info-bar-item--wide {
  gap: 109px;
}
.info-bar-item--wider {
  gap: 104px;
}
.info-bar-item--column {
  flex-direction: column;
  gap: 8px;
  align-items: center;
}
.info-bar-item--narrow {
  gap: 10px;
}

.info-bar-dot {
  width: 6px;
  height: 6px;
  border-radius: 9999px;
}
.info-bar-dot--active {
  background: #006FFF;
}
.info-bar-dot--inactive {
  background: var(--mode-gray-400, #B9BAC6);
}

.info-bar-label {
  position: absolute;
  top: 16px;
  text-align: center;
  color: var(--mode-gray-900, #1C1C1F);
  font-size: 16px;
  font-family: Pretendard;
  font-weight: 400;
  line-height: 22.4px;
  word-wrap: break-word;
}
.coupon-container {
    width: 100%;
    height: 100%;
    padding: 40px;
    background: white;
    box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    border-radius: 32px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px;
}
.coupon-container:not(:first-child) {
  margin-top: 3.2rem;
}

@media (max-width: 768px) {
  .coupon-container {
    padding: 24px 20px;
    border-radius: 20px;
    gap: 24px;
  }
  
  .coupon-container:not(:first-child) {
    margin-top: 2rem;
  }
}

@media (max-width: 480px) {
  .coupon-container {
    padding: 20px 16px;
    border-radius: 16px;
    gap: 20px;
  }
  
  .coupon-container:not(:first-child) {
    margin-top: 1.6rem;
  }
}

.header {
    align-self: stretch;
    padding-bottom: 24px;
    border-bottom: 1px var(--mode-gray-200, #E6E6ED) solid;
    justify-content: space-between;
    align-items: center;
    display: inline-flex;
}

.header-left {
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
    display: flex;
}

.profile-img {
    width: 96px;
    height: 96px;
    border-radius: 9999px;
    border: 1px var(--mode-gray-200, #E6E6ED) solid;
}
.profile-img img{
	width: 93px;
    height: 93px;
    object-fit: contain;
    border-radius: 50%;
    max-width: unset;
}

@media (max-width: 768px) {
  .header {
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    padding-bottom: 20px;
  }
  
  .header-left {
    gap: 16px;
  }
  
  .profile-img {
    width: 72px;
    height: 72px;
  }
  
  .profile-img img {
    width: 69px;
    height: 69px;
  }
}

@media (max-width: 480px) {
  .header {
    gap: 12px;
    padding-bottom: 16px;
  }
  
  .header-left {
    gap: 12px;
  }
  
  .profile-img {
    width: 64px;
    height: 64px;
  }
  
  .profile-img img {
    width: 61px;
    height: 61px;
  }
}
.won .strong {
    font-weight: 700;
    font-size: 1.6rem;
    color: #fff;
}
.won .line-through {
    color: #FFFFFF66;
    font-size: 1.4rem;
    text-decoration: line-through 2px;
    text-decoration-line: line-through;
    margin-right: 5px;
    font-weight: 600;
}
.profile-info {
    display: inline-flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
}

.clinic-name {
    align-self: stretch;
    color: var(--mode-gray-900, #1C1C1F);
    font-size: 24px;
    font-family: Pretendard, sans-serif;
    font-weight: 700;
    line-height: 33.60px;
    word-wrap: break-word;
}

.clinic-tags {
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    display: inline-flex;
}

.tag {
    color: var(--mode-gray-700, #71727D);
    font-size: 18px;
    font-family: Pretendard, sans-serif;
    font-weight: 400;
    line-height: 25.20px;
    word-wrap: break-word;
}

.divider {
    width: 20px;
    height: 0px;
    transform: rotate(90deg);
    outline: 1px var(--mode-gray-400, #B9BAC6) solid;
    outline-offset: -0.50px;
}

.view-info-btn {
    height: 56px;
    padding: 16px 32px;
    background: var(--mode-white, white);
    overflow: hidden;
    border-radius: 12px;
    outline: 1px var(--mode-gray-400, #B9BAC6) solid;
    outline-offset: -1px;
    justify-content: center;
    align-items: center;
    display: flex;
}

.view-info-text {
    color: var(--mode-gray-700, #71727D);
    font-size: 16px;
    font-family: Pretendard, sans-serif;
    font-weight: 500;
    line-height: 22.40px;
    word-wrap: break-word;
}

@media (max-width: 768px) {
  .clinic-name {
    font-size: 20px;
    line-height: 28px;
  }
  
  .clinic-tags {
    flex-wrap: wrap;
    gap: 8px;
  }
  
  .tag {
    font-size: 14px;
    line-height: 19.6px;
  }
  
  .divider {
    width: 16px;
  }
  
  .view-info-btn {
    height: 48px;
    padding: 12px 24px;
    border-radius: 8px;
  }
  
  .view-info-text {
    font-size: 14px;
    line-height: 19.6px;
  }
}

@media (max-width: 480px) {
  .clinic-name {
    font-size: 18px;
    line-height: 25.2px;
  }
  
  .clinic-tags {
    gap: 6px;
  }
  
  .tag {
    font-size: 12px;
    line-height: 16.8px;
  }
  
  .divider {
    width: 12px;
  }
  
  .view-info-btn {
    height: 40px;
    padding: 8px 16px;
    border-radius: 6px;
  }
  
  .view-info-text {
    font-size: 12px;
    line-height: 16.8px;
  }
}

.card-row {
    justify-content: flex-start;
    align-items: flex-start;
    gap: 20px;
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    cursor: grab;
    scrollbar-width: none; /* Firefox */
    user-select: none; /* 텍스트 선택 방지 */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE */
    scroll-behavior: smooth; /* 부드러운 스크롤 */
    -webkit-overflow-scrolling: touch; /* iOS 부드러운 스크롤 */
    flex-wrap: nowrap; /* 줄바꿈 방지 */
    width: 100%; /* 전체 너비 사용 */
    max-width: none; /* 최대 너비 제한 없음 */
}
.card-row::-webkit-scrollbar {
    display: none; /* Chrome, Safari */
}
.card-group {
    justify-content: flex-start;
    align-items: center;
    display: flex;
    flex-shrink: 0; /* 축소 방지 */
    min-width: fit-content; /* 내용에 맞는 최소 너비 */
}

.card {
    width: 340px;
    height: 200px;
    padding: 32px;
    border-top-left-radius: 24px;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 24px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
    display: flex;
    flex-shrink: 0; /* 축소 방지 */
}

@media (max-width: 768px) {
  .card-row {
    gap: 16px;
  }

  .card-side{
    height: 160px!important;
  }
  
  .card {
    width: 280px;
    height: 160px;
    padding: 24px;
    border-top-left-radius: 20px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 20px;
    gap: 8px;
  }
}

@media (max-width: 480px) {
  .card-row {
    gap: 12px;
  }
  
  .card {
    width: 210px;
    height: 140px;
    padding: 20px;
    border-top-left-radius: 16px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 16px;
    gap: 6px;
  }
  .card-side{
    height: 140px!important;
  }
}

.card-purple {
    background: #7D66FF;
}

.card-blue {
    background: #33ADFE;
}

.card-green {
    background: #00CCCC;
}

.card-content {
    width: 267px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    display: flex;
}

.card-title {
    align-self: stretch;
    color: var(--mode-white, white);
    font-size: 18px;
    font-family: Pretendard, sans-serif;
    font-weight: 500;
    line-height: 25.20px;
    word-wrap: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
}
.modal .card-title {
	text-overflow: ellipsis!important;
  	overflow: hidden!important;
  	display: -webkit-box!important;
  	-webkit-box-orient: vertical!important;
  	-webkit-line-clamp: 2!important;
}

.card-percent {
    align-self: stretch;
}

.percent-num {
    color: var(--mode-white, white);
    font-size: 48px;
    font-family: Pretendard, sans-serif;
    font-weight: 700;
    line-height: 67.20px;
    word-wrap: break-word;
}

.percent-sign {
    color: var(--mode-white, white);
    font-size: 36px;
    font-family: Pretendard, sans-serif;
    font-weight: 700;
    line-height: 50.40px;
    word-wrap: break-word;
}

@media (max-width: 768px) {
  .card-content {
    width: 220px;
    gap: 10px;
  }
  
  .card-title {
    font-size: 16px;
    line-height: 22.4px;
  }
  
  .percent-num {
    font-size: 36px;
    line-height: 50.4px;
  }
  
  .percent-sign {
    font-size: 28px;
    line-height: 39.2px;
  }
}

@media (max-width: 480px) {
  .card-content {
    width: 180px;
    gap: 8px;
  }
  
  .card-title {
    font-size: 14px;
    line-height: 19.6px;
  }
  
  .percent-num {
    font-size: 28px;
    line-height: 39.2px;
  }
  
  .percent-sign {
    font-size: 22px;
    line-height: 30.8px;
  }
}

.card-icon {
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 4px;
    display: flex;
}

.card-side {
    height: 200px;
    padding: 20px;
    position: relative;
    border-top-left-radius: 12px;
    border-top-right-radius: 24px;
    border-bottom-right-radius: 24px;
    border-bottom-left-radius: 12px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
    display: inline-flex;
}

.side-divider {
    width: 160px;
    height: 0px;
    left: 0px;
    top: 20px;
    position: absolute;
    transform: rotate(90deg);
    transform-origin: top left;
    opacity: 0.40;
    outline: 1px white dashed;
    outline-offset: -0.50px;
}

.side-icon {
    padding: 12px;
    background: #111111;
    border-radius: 100px;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    display: inline-flex;
}

.icon-svg {
    width: 24px;
    height: 24px;
    position: relative;
    overflow: hidden;
}

