@charset "utf-8";

.gray-bg {background-color:#f8f8f8;}

.sub-tab {margin-bottom:var(--space-95);}
.sub-tab ul {display:flex; gap:var(--space-10);}
.sub-tab ul li a {padding:0 12px; font-size:var(--font-size-20); font-weight:600; letter-spacing:-.02em; border-radius:8px; min-width:240px; display:flex; align-items:center; justify-content:center; text-align:center; border:1px solid #252525; height:clamp(40px, calc(64 / var(--inner) * 100vw), 64px);}
.sub-tab ul li.active a {background:var(--color-primary); color:#fff; border-color:var(--color-primary);}

.doc-cnt {background-size:cover; background-repeat:no-repeat; background-position:50% 50%; padding:var(--space-120) 0;}

.s-head {margin-bottom:var(--space-40); font-size:var(--font-size-32); font-weight:800; letter-spacing:-.02em; line-height:1.4em;}

.dot-title h2 {padding:var(--space-30) 0 0 var(--space-30); position:relative; display:inline-block; font-size:var(--font-size-32); font-weight:800; letter-spacing:-.02em; line-height:1.19em;}
.dot-title h2 span {z-index:2; position:relative;}
.dot-title h2:after {z-index:1; position:absolute; left:0; top:.1em; content:''; width:clamp(30px, calc(64 / var(--inner) * 100vw), 64px); height:clamp(30px, calc(64 / var(--inner) * 100vw), 64px); background:#e6f0f8; border-radius:100%;}

.clinic-intro {margin-bottom:var(--space-120); display:flex; gap:var(--space-120); align-items:center;}
.clinic-intro .image {width:43%; max-width:600px;}
.clinic-intro .content {flex:1;}
.clinic-intro .content .title h2 {padding:var(--space-15) 0 var(--space-30); font-size:var(--font-size-32); font-weight:800; letter-spacing:-.02em; line-height:1.31em; position:relative; display:inline-block;} 
.clinic-intro .content .title h2 strong {color:var(--color-primary); font-weight:800;}
.clinic-intro .content .title h2 span {font-size:var(--font-size-48); font-weight:700; position:absolute; font-family:var(--font-gmarket);}
.clinic-intro .content .title h2 span.quote-1 {left:calc(var(--space-35) * -1); top:0;}
.clinic-intro .content .title h2 span.quote-2 {right:calc(var(--space-35) * -1); bottom:calc(var(--space-15) * -1);}
.clinic-intro .content .title:after {margin:var(--space-20) 0 var(--space-35); content:''; display:block; width:1px; height:clamp(25px, calc(74 / var(--inner) * 100vw), 74px); background:#242424;}
.clinic-intro .content .lg-text {margin-bottom:var(--space-25); font-size:var(--font-size-22); font-weight:700; letter-spacing:-.02em; line-height:1.55em;}
.clinic-intro .content .lg-text strong {color:var(--color-primary);}
.clinic-intro .content .text {font-size:var(--font-size-20); letter-spacing:-.03em; line-height:1.56em; color:#4c4c4c;}

.staff .item {margin-bottom:var(--space-120); display:flex; align-items:stretch;}
.staff .item:last-child {margin-bottom:0;}
.staff .item .content {display:flex; align-items:center; flex:1; position:relative; z-index:1;}
.staff .item .content:before {content:''; position:absolute; right:0; top:0; left:-999em; bottom:0; background:#f8f8f8; z-index:-1;}
.staff .item .content .inner {flex:1;}
.staff .item .content .name {padding-bottom:var(--space-30); border-bottom:1px solid #252525;}
.staff .item .content .name .en {margin-bottom:var(--space-15); font-size:var(--font-size-18); font-weight:400; letter-spacing:-.03em; line-height:1.4em; color:#ababab;}
.staff .item .content .name h2 {font-size:var(--font-size-40); font-weight:800; letter-spacing:.1em; line-height:1.33em;}
.staff .item .content .name h2 small {font-size:var(--font-size-22); font-weight:400; letter-spacing:-.03em; line-height:1.4em; margin-left:var(--space-20);}
.staff .item .content .tit {margin:var(--space-55) 0 var(--space-20); font-size:var(--font-size-22); font-weight:700; letter-spacing:-.03em; line-height:1.4em;}
.staff .item .content .list ul li {padding-left:.6em; text-indent:-.6em; margin-bottom:var(--space-12); font-size:var(--font-size-18); letter-spacing:-.03em; line-height:1.56em;}
.staff .item .content .list ul li:last-child {margin-bottom:0;}
.staff .item .image {width:50%;}
.staff .item:nth-child(even) {flex-direction:row-reverse;}
.staff .item:nth-child(odd) .content {padding-right:var(--space-50);}
.staff .item:nth-child(even) .content {padding-left:var(--space-50);}
.staff .item:nth-child(even) .content:before {left:0; right:-999em;}

.facility .slider-for {padding:0 50px var(--space-40); margin-bottom:var(--space-40); border-bottom:1px solid #ddd;}
.facility .slider-for img {margin:0 auto;}
.facility .slider-for .slick-arrow {z-index:5; position:absolute; top:50%; margin-top:-20px;  background-color:transparent; font-size:0; line-height:0; border:0; width:41px; height:41px; background-size:contain; background-repeat:no-repeat; background-position:50% 50%;}
.facility .slider-for .slick-prev {left:0; background-image:url('/images/main/slider-prev.png');}
.facility .slider-for .slick-next {right:0;  background-image:url('/images/main/slider-next.png');}

.facility .slider-nav {margin:calc(var(--space-15) * -1);}
.facility .slider-nav .item {padding:0 var(--space-15);}

.facility .slick-dots {margin-top:var(--space-45); line-height:0; display:flex; flex-wrap:wrap; justify-content:center; gap:var(--space-10) var(--space-20);}
.facility .slick-dots li button {transition:.2s; font-size:0; background:transparent; border:0; width:11px; height:11px; border-radius:100%; background:#c2c2c2;}
.facility .slick-dots li.slick-active button {background:var(--color-primary);}

.location-map {border-radius:var(--radius-12); overflow:hidden; margin-bottom:var(--space-120);}
.location-map .root_daum_roughmap .wrap_map {height:clamp(250px, calc(400 / var(--inner) * 100vw), 400px) !important;}

.location-sec:not(:last-child) {margin-bottom:var(--space-120);}
.location-sec {display:flex;}
.location-sec .dot-title {width:28.5%;}
.location-sec .content {padding:var(--space-50); flex:1; border-radius:var(--radius-12); background:#fff; box-shadow:0 20px 40px rgba(0,0,0,0.13);}

.location-sec .cnt-1 {position:relative;}
.location-sec .cnt-1 .time p {margin-bottom:var(--space-15); font-size:var(--font-size-18); font-weight:400; letter-spacing:-.02em; line-height:1.4em; color:#4c4c4c;}
.location-sec .cnt-1 .time p:last-child {margin-bottom:0;}
.location-sec .cnt-1 .time p strong {color:#252525; display:inline-block; min-width:140px;}
.location-sec .cnt-1 .time p span {margin-left:var(--space-20); border-radius:var(--radius-12); background:var(--color-primary); color:#fff; display:inline-block; line-height:24px; font-size:var(--font-size-16); padding:0 var(--space-10);}
.location-sec .cnt-1 .caution {margin:var(--space-40) 0; font-size:var(--font-size-20); font-weight:400; letter-spacing:-.02em; line-height:1.4em; color:#4c4c4c;}
.location-sec .cnt-1 .tel p {display:flex; align-items:center; gap:0 var(--space-20); font-size:var(--font-size-20); font-weight:400; letter-spacing:-.02em; line-height:1.4em; color:#4c4c4c;}
.location-sec .cnt-1 .tel p:not(:last-child) {margin-bottom:var(--space-20);}
.location-sec .cnt-1 .tel span {border-radius:var(--radius-20); font-size:var(--font-size-20); background:var(--color-primary); color:#fff; display:inline-block; line-height:clamp(30px, calc(40 / var(--inner) * 100vw), 40px); padding:0 var(--space-15); font-weight:700;}
.location-sec .cnt-1 .tel strong {font-size:var(--font-size-40); font-weight:800; color:var(--color-primary); letter-spacing:-.03em;}
.location-sec .cnt-1 .kakako {display:inline-block; border-radius:var(--radius-30); background:#ffd71d; position:absolute; right:0; bottom:0; font-size:var(--font-size-18); font-weight:400; letter-spacing:-.03em; line-height:clamp(40px, calc(60 / var(--inner) * 100vw), 60px); padding:0 var(--space-30);}
.location-sec .cnt-1 .kakako img {vertical-align:middle; margin-left:10px;}

.location-sec .cnt-2 h3 {font-size:var(--font-size-32); font-weight:800; letter-spacing:-.02em; line-height:1.4em; color:var(--color-primary);}
.location-sec .cnt-2 .txt {margin:var(--space-30) 0 var(--space-40); font-size:var(--font-size-22); font-weight:700; letter-spacing:-.02em; line-height:1.45em;}
.location-sec .cnt-2 .addr {margin-bottom:var(--space-15); font-size:var(--font-size-20); font-weight:700; letter-spacing:-.03em; line-height:1.4em; color:var(--color-primary);}
.location-sec .cnt-2 .way {font-size:var(--font-size-20); font-weight:400; letter-spacing:-.02em; line-height:1.4em; color:#4c4c4c;}
.location-sec .cnt-2 .way:not(:last-child) {margin-bottom:var(--space-20);}
.location-sec .cnt-2 .way span {margin-right:var(--space-20); border-radius:var(--radius-20); font-size:var(--font-size-20); background:var(--color-primary); color:#fff; display:inline-block; line-height:clamp(30px, calc(40 / var(--inner) * 100vw), 40px); padding:0 var(--space-15); font-weight:700;}

.spine-clinic {padding:var(--space-150) 0; background:url('/images/sub/bg-spine-clinic.jpg') no-repeat center center / cover;}
.spine-clinic .clinic-intro {margin-bottom:0; color:#fff;}
.spine-clinic .clinic-intro .content .title:after {background:#fff;}
.spine-clinic .clinic-intro .content .text {color:#fff;}

.spine-as .item {padding:var(--space-50); display:flex; margin-bottom:var(--space-30); background:#fff; border-radius:var(--radius-12); overflow:hidden; box-shadow:0 20px 40px rgba(0,0,0,0.13);}
.spine-as .item:last-child {margin-bottom:0;}
.spine-as .item .dot-title {width:25%;}
.spine-as .item .dot-title h2 {padding-top: 0;}
.spine-as .item .dot-title h2:after {top:-.6em;}
.spine-as .item .text {flex:1; font-size:var(--font-size-20); line-height: 1.5em;}

.horizontal-sec:not(:last-child) {margin-bottom:var(--space-120);}
.horizontal-sec {display:flex;}
.horizontal-sec .title {width:18.5%;}
.horizontal-sec .content {flex:1;}

.spine-therapy {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-30);}
.spine-therapy .item {text-align:center;}
.spine-therapy .item .img {border-radius:var(--radius-12); overflow:hidden; box-shadow:0 20px 40px rgba(0,0,0,0.13);}
.spine-therapy .item .check {margin:var(--space-30) 0 var(--space-15); line-height:0;}
.spine-therapy .item .txt {font-size:var(--font-size-22); font-weight:600; letter-spacing:-.02em; line-height:1.4em;}

.spine-point {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-25);}
.spine-point .item {box-shadow:0 20px 40px rgba(0,0,0,0.13); padding:var(--space-30); min-height:300px; background:#fff; border-radius:var(--radius-12);}
.spine-point .item .num {color:#fff; font-size:var(--font-size-20); font-weight:700; display:flex; align-items:center; justify-content:center; width:clamp(32px, calc(48 / var(--inner) * 100vw), 48px); height:clamp(32px, calc(48 / var(--inner) * 100vw), 48px); border-radius:100%; background:#2ba2ff;}
.spine-point .item .tit {margin:var(--space-25) 0 var(--space-20); font-size:var(--font-size-22); font-weight:700; letter-spacing:-.02em; line-height:1.4em;}
.spine-point .item .txt {font-size:var(--font-size-20); font-weight:500; letter-spacing:-.02em; line-height:1.5em; color:#4c4c4c;}

.special-equipment .wrap {background:#f8f8f8; border-radius:var(--radius-12); padding:var(--space-50);}
.special-equipment .wrap + .wrap {margin-top:var(--space-40);}
.special-equipment .wrap h3 {margin-bottom:var(--space-40); position:relative; font-size:var(--font-size-26); font-weight:800; letter-spacing:-.02em; line-height:1.4em;}
.special-equipment .wrap h3 span {margin-right:var(--space-20); color:#fff; border-radius:100%; display:inline-block; background:#2ba2ff; line-height:clamp(34px, calc(48 / var(--inner) * 100vw), 48px); width:clamp(34px, calc(48 / var(--inner) * 100vw), 48px); text-align:center;}
.special-equipment .content {padding-left:var(--space-70);}
.special-equipment .content .group {display:flex; background:#fff; border-radius:var(--radius-12); padding:var(--space-40) var(--space-25);}
.special-equipment .content .group + .group {margin-top:var(--space-30);}

.special-equipment .content h4 {width:37%; position:relative; padding-left:var(--space-40); font-size:var(--font-size-22); font-weight:700; letter-spacing:-.02em; line-height:1.4em;}
.special-equipment .content h4:before {content:''; display:inline-block; position:absolute; left:0; top:.2em; width:clamp(16px, calc(24 / var(--inner) * 100vw), 24px); height:clamp(14px, calc(22 / var(--inner) * 100vw), 22px); background:url('/images/sub/check.png') no-repeat center center / contain;}
.special-equipment .content .txt {flex:1; font-size:var(--font-size-20); font-weight:400; letter-spacing:-.02em; line-height:1.5em;}

.clinic-info {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-30);}
.clinic-info .item {box-shadow:0 20px 40px rgba(0,0,0,0.13); background:#fff; border-radius:var(--radius-12); padding:var(--space-50) var(--space-50) var(--space-70); min-height:280px; height:100%;}
.clinic-info .item .dot-title {margin-bottom:var(--space-30);}
.clinic-info .item p {font-size:var(--font-size-20); font-weight:500; letter-spacing:-.02em; line-height:1.5em; color:#4c4c4c;}
.clinic-info .item .list ul li {padding-left:.6em; text-indent:-.6em; font-size:var(--font-size-20); font-weight:500; letter-spacing:-.02em; line-height:1.9em; color:#4c4c4c;}
.clinic-info .item .num-list ul li {margin-bottom:var(--space-20); font-size:var(--font-size-20); font-weight:500; letter-spacing:-.02em; line-height:1.5em; color:#4c4c4c;}
.clinic-info .item .num-list ul li:last-child {margin-bottom:0;}
.clinic-info .item .num-list ul li span {margin-right:var(--space-15); display:inline-block; line-height:clamp(24px, calc(40 / var(--inner) * 100vw), 40px); width:clamp(24px, calc(40 / var(--inner) * 100vw), 40px); text-align:center; font-weight:700; color:#fff; background:var(--color-primary); border-radius:100%;}
.clinic-info .item.type2 .dot-title h2 {color:var(--color-primary);}
.clinic-info .item.type2 p {color:var(--color-primary); font-weight:700;}
.clinic-info.col-2 {grid-template-columns:repeat(2, 1fr);}

.skin-intro {position:relative; text-align:center; margin-bottom:var(--space-120); padding-bottom:var(--space-95);}
.skin-intro .title {margin-bottom:var(--space-15);}
.skin-intro .title h2 {font-size:var(--font-size-32); font-weight:800; letter-spacing:-.02em; line-height:1.31em; position:relative; display:inline-block;} 
.skin-intro .title h2 strong {color:var(--color-primary); font-weight:800;}
.skin-intro .title h2 span {line-height:0; display:block; font-size:var(--font-size-48); font-weight:700; font-family:var(--font-gmarket);}
.skin-intro .title h2 span.quote-1 {margin-bottom:var(--space-10);}
.skin-intro .title h2 span.quote-2 {margin-top:var(--space-50);}
.skin-intro .lg-text {margin-bottom:var(--space-25); font-size:var(--font-size-22); font-weight:700; letter-spacing:-.02em; line-height:1.55em;}
.skin-intro .text {font-size:var(--font-size-18); letter-spacing:-.03em; line-height:1.56em; color:#4c4c4c;}
.skin-intro .text strong {color:var(--color-primary);}
.skin-intro .bg-text {z-index:-1; white-space:nowrap; position:absolute; font-size:var(--font-size-160); left:50%; transform:translateX(-50%); bottom:0; font-weight:800; color:#f5f5f5; letter-spacing:-.02em; line-height:.8em;}


