@charset "utf-8";

body .clinic {position:relative;}

/* 프로그램 셋팅 */
.clinic .pain-con-inner table {border-collapse: collapse !important;}
.clinic .pain-con-inner ul {margin:0 !important;}


.clinic .clinic-pain { position:relative;}
.clinic .clinic-pain::before,
.clinic .clinic-pain::after {width:14px; height:calc(100% - 48px); border-radius:100px; background:#B5B5B5; position:absolute; top:50%; transform:translateY(-50%); display:block; content:''; z-index:-1;}
.clinic .clinic-pain::before {left:0;}
.clinic .clinic-pain::after {right:0;}
.clinic .clinic-pain-wrap {gap:70px; align-items: center; padding:35px 140px; width:calc(100% - 14px); margin:0 auto; display:flex; border-radius: 20px; background: rgba(255, 255, 255, 0.59); backdrop-filter: blur(15px); border:1px solid #f1f1f1; flex-direction: row-reverse;}
.clinic .clinic-pain-img {width:150px; aspect-ratio:1/1; border-radius:20px; background:#f9f9f9; /*border:1px solid var(--base2);*/}
.clinic .clinic-pain-img img {width:100%; height:100%; /*object-fit:scale-down;*/ padding:30px;}
.clinic .clinic-pain-txt {width:calc(100% - 230px);color:#000; }
.clinic .clinic-pain-txt .tit {font-size:var(--fs25); font-weight:700; line-height:1.35; padding-bottom:10px;}
.clinic .clinic-pain-txt .txt {font-size:var(--fs20); line-height:1.45;}

.clinic .pain-list {}
.clinic .pain-item {display:flex; gap:70px;}

.clinic .pain-tab {position:sticky; top:80px; width:280px; align-self:start;}
.clinic .pain-tab .tabBtn {}
.clinic .pain-tab .tabBtn.on {}

.clinic .pain-con {width:calc(100% - 350px);}
.clinic .pain-con-item {padding:50px; border-radius: 20px;border: 2px solid #F1F1F1;background: #FFF;}
.clinic .pain-con-tit {gap:40px; display:flex; align-items:flex-start;}
.clinic .pain-con-tit .img {width:250px; height:190px; border-radius:20px; overflow:hidden; max-width:100%; border:1px solid #ddd;}
.clinic .pain-con-tit .img img {}
.clinic .pain-con-tit .con {width:calc(100% - 290px);}
.clinic .pain-con-tit .con .tit {color:var(--base1); font-size:var(--fs20); font-weight:600; margin:0;}
.clinic .pain-con-tit .con .txt {padding:3px 0 25px;color:#000; font-size:var(--fs18); margin:0;}
.clinic .pain-con-tit .con .desc {padding:10px 0 0; position:relative; color:#777; margin:0;}
.clinic .pain-con-tit .con .desc:before {width:30px; height:1px; background:#777; left:0; top:0; position:absolute; display:block; content:'';}

.clinic .pain-con-inner {margin:20px 0 0; border-radius:20px; border: 1px solid #dddd; min-height:400px; padding:50px;}

body .clinic .subTit {font-size:var(--fs32); text-align:center; font-weight:700; color:#000; line-height:1.3; margin:0;}

body .clinic .boxType1 {background:var(--base1);}
body .clinic .boxType1 .box-tit {width:100%; margin-bottom:35px; padding:0px; text-align:center; font-size:var(--fs30); line-height:1.3; color:var(--base1); letter-spacing:-1px;}
body .clinic .boxType1 .box-tit span {color:#000; font-weight:400;}

body .clinic .boxType1 .box-inner {width:100%; padding:70px;}
body .clinic .boxType1 .peopleList {display:grid; gap:20px; grid-template-columns: repeat(2, 1fr);}
body .clinic .boxType1 .peopleItem {width:100%;}

.clinic .peopleList.type1 .peopleItem .top {gap:20px;}
.clinic .peopleList.type1 .peopleItem .top .people {}
.clinic .peopleList.type1 .peopleItem .top .con {width:calc(100% - 220px);}
.clinic .peopleList.type1 .peopleItem .top .people .txt {height:75px;}
.clinic .peopleList.type1 .peopleItem .top .people .txt .work {font-size:var(--fs12);}
.clinic .peopleList.type1 .peopleItem .top .people .txt .field {font-size:var(--fs12);}
.clinic .peopleList.type1 .peopleItem .top .people .txt .name {font-size:var(--fs18);}
.clinic .peopleList.type1 .peopleItem .top .people .txt .position {font-size:var(--fs14); padding:0 0 0 8px; margin:0 0 0 7px;}

.clinic .swiper {position:relative; overflow:hidden;}
.clinic .swiper-wrapper {}
.clinic .swiper-button-wrap {position:absolute; right:0; top:0;}
.clinic .swiper-button-lock {}
.clinic .swiper-button-prev,.clinic .swiper-button-next {
	width:60px; height:60px; line-height:58px; border:1px solid #000; border-radius:50%; 
	font-size:var(--fs18); text-align:center;
	display:block; background:#fff; background-image:none;
}
.clinic .swiper-button-prev {right:70px; left:auto;}
.clinic .swiper-button-next {right:0; left:auto;}
.clinic .swiper-scrollbar {}

.clinic .swiper-slide {}

.clinic .swiper-scrollbar {height:2px; width:calc(100% - 200px); left:50%; bottom:0; position:absolute; transform:translateX(-50%);}




/* ************************ 태블릿 이하(~1199) ************************ */
@media (max-width: 1199px) {
	
	body .clinic .boxType1 .box-tit {width: 100%; text-align: center;}
	body .clinic .boxType1 .box-tit br.pc {display:block !important;}
		
	.clinic .clinic-pain-wrap {gap:30px; padding:40px;}
	.clinic .clinic-pain-wrap {}
	.clinic .clinic-pain-img {align-self: start;}
	.clinic .clinic-pain-txt .tit {line-height:1.3;}

	.clinic .pain-item {gap:20px; flex-direction:column;}
	.clinic .pain-tab {width:100%; flex-direction:row; flex-wrap:wrap; position:static;}
	.clinic .pain-tab .tabBtn {padding:0 20px 0 40px; background:#fff;}
	
	.clinic .pain-con {width:100%;}
	.clinic .pain-con-item {padding:40px;}
	
	.clinic .swiper {padding:0 0 60px}
	.clinic .swiper-scrollbar {width:calc(100% - 100px);}
	
	.clinic .clinic-pain-img img {padding:0;}
	
	body .clinic .boxType1 .peopleList {grid-template-columns: repeat(1, 1fr);}
	
	.clinic .pain-con-inner img {width:100% !important; height:100% !important;}
	.clinic .pain-con-inner iframe {width:100% !important; aspect-ratio: 16 / 9 !important; height: auto !important; display: block !important; border: 0 !important;}
	
}

/* ************************ 모바일 ************************ */
@media (max-width: 767px) {
	
	
	
	.clinic .clinic-pain-wrap {gap:10px; padding:30px; flex-direction:column;}
	.clinic .clinic-pain-wrap {}
	.clinic .clinic-pain-img {padding:20px; width:120px; height:120px; max-width:100%;}
	.clinic .clinic-pain-txt {width:100%;}
	.clinic .clinic-pain-txt .tit {line-height:1.3;}
	
	.clinic .pain-item {}
	
	
	.clinic .peopleList.type1 .peopleItem {border:1px solid #ddd; padding:20px;}
	.clinic .peopleList.type1 .peopleItem:hover {border:0; padding:0;}
	.clinic .peopleList.type1 .peopleItem .top .con {width:100%;}
	
	.clinic .pain-con {}
	.clinic .pain-con-item {}
	.clinic .pain-con-tit {gap:20px; flex-direction:column; align-items: start;}
	.clinic .pain-con-tit .img {}
	.clinic .pain-con-tit .con {width:100%;}
	.clinic .pain-con-item {padding:0; border:0;}
	.clinic .pain-con-inner table {width:100% !important;}
	
	
	.clinic .swiper {padding:0 0 30px}
	.clinic .swiper-scrollbar {width:100%;}
	
	/* 관절센터 */
	.clinic .center2 .bannerType1 .con img {height:150px; left:auto;}
	
	.clinic .joint {}
	.clinic .joint-list {flex-direction:column; gap:10px;}
	.clinic .joint-item {padding:40px 0;}
	.clinic .joint-item:first-child {padding:40px 0;}
	.clinic .joint-item>div {gap:20px}
	
	.clinic .joint-tit {}
	
	.clinic .joint-con {}
	.clinic .joint-con.part {}
	
	.clinic .joint-part-list {flex-wrap:wrap; padding:0;}
	.clinic .joint-part-item {width:calc((100% - 20px)/2);}
	.clinic .joint-part-item:nth-child(even) {transform:none;}
	
	.clinic .joint-strong-list {}
	.clinic .joint-strong-list:before {display:none;}
	.clinic .joint-strong-item {padding:20px;}
	.clinic .joint-strong-item h5 {}
	.clinic .joint-strong-item p {padding:5px 0 0;}
	
	.clinic .joint-recommend-list {}
	.clinic .joint-recommend-item {padding:10px 20px;}
	.clinic .joint-recommend-item p {}
	
	body .clinic .boxType1 .box-inner {padding:0px;}
	body .clinic .boxType1, body .boxType1 .box-inner {border-radius:0; box-shadow:none;}
	
	.clinic .pain-con-inner {padding:0; border:0;}

	
	body .clinic .pain-tab.tabWrap.type4::-webkit-scrollbar{display: none;}
	body .clinic .pain-tab.tabWrap.type4 .tabBtn{flex: 0 0 auto;white-space: nowrap;}
	body .clinic .pain-tab.tabWrap.type4{display:flex; overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch; flex-wrap: nowrap;}
	body .clinic .pain-tab.tabWrap.type4 .tabBtn{flex:0 0 auto; display:inline-flex; white-space:nowrap;}
	body .clinic .pain-tab.tabWrap.type4::after{content:""; flex:0 0 var(--tail, 0px);}
	
	
	
	
	
}