@charset "utf-8";

/* C00301 나인문클리닉 */

/* ========================================================================================================================================= */
/* 키비주얼 */
.TopVisual{position:relative; display:block; height:450px; background-size:100% 450px; background-repeat:no-repeat; background-position:center;}
.TopVisual .TopTitle{position:relative; display:block; text-align:center; top:50%; transform:translate(0, -15%);}
.TopVisual .TopTitle .Title{line-height:1;}
.TopVisual .TopTitle .Title01{font-size:40px; font-weight:500; color:#1c1c1e; font-family:"Pretendard"; margin-bottom:20px;}
.TopVisual.aboutTopVisual .TopTitle .Title01{font-family:"Reddit Sans";}
.TopVisual .TopTitle .Title01 span{font-weight:700; margin-left:12px;}

/* ========================================================================================================================================= */
/*병원소개*/
.About_NetworkAea_Detail{background-color:#fff;}

/* ========================================================================================================================================= */
/*의료진소개*/
.NC00301 .About_DoctorArea *{}
.NC00301.aboutDoctorWrap #contents{background-color:#fff;}
.NC00301 .About_DoctorArea{}
.NC00301 .About_DoctorArea .Inner{width:1400px; min-width:1400px; margin:0 auto 0 auto; padding:130px 0; overflow:hidden;}

	/* ---------------------------------------------- */
	/* 리스트영역 */
	.NC00301 .About_DoctorArea .ContArea{position:relative; display:table; width:100%; text-align:left;}
	.NC00301 .About_DoctorArea .ContArea .Doctor *{cursor:pointer;}
	.NC00301 .About_DoctorArea .ContArea .Doctor{display:inline-table; vertical-align:middle; width:calc(100% / 4); }
	.NC00301 .About_DoctorArea .ContArea .Doctor:nth-child(3n+4){margin-left:0;}
	.NC00301 .About_DoctorArea .ContArea .Doctor{margin-top:60px;}
	.NC00301 .About_DoctorArea .ContArea .Doctor:nth-child(-n+4){margin-top:0;}
	.NC00301 .About_DoctorArea .ContArea label{position:relative; display:table; width:100%; text-align:left;}
	.NC00301 .About_DoctorArea .ContArea label .Thumb{position:relative; display:block; width:100%; overflow:hidden; background-color:#9ea7ba; z-index:2;}
	.NC00301 .About_DoctorArea .ContArea label .Thumb img{position:relative; display:block; width:100%; height:380px; object-fit:cover; -webkit-transition:transform .8s cubic-bezier(.05,.2,.1,1); transition:transform .8s cubic-bezier(.05,.2,.1,1);}
	.NC00301 .About_DoctorArea .ContArea .Doctor:hover .Thumb img{-webkit-transition:transform .8s cubic-bezier(.05,.2,.1,1); transition:transform .8s cubic-bezier(.05,.2,.1,1);
    -webkit-transform: scale(1.1); transform: scale(1.1);}
	.NC00301 .About_DoctorArea .ContArea label dl{position:relative; display:block; width:100%; text-align:center;}
	.NC00301 .About_DoctorArea .ContArea label dt{position:relative; display:block; width:100%; padding:20px;}
	.NC00301 .About_DoctorArea .ContArea label dd{position:relative; display:inline-block; width:90%; text-align:center;}
	.NC00301 .About_DoctorArea .ContArea label .Name{display:table; width:100%; text-align:center; margin-top:10px;}
	.NC00301 .About_DoctorArea .ContArea label .Name span{display:flex; justify-content:center; align-items:flex-end; vertical-align:middle; font-size:20pt; color:#1c1c1e; font-weight:600;}
	.NC00301 .About_DoctorArea .ContArea label .Name small{font-size:17pt; font-weight:400; margin-left:10px;}
	.NC00301 .About_DoctorArea .ContArea label .Name img{display:inline-table; vertical-align:middle;}
	.NC00301 .About_DoctorArea .ContArea .Arrow{width:32px; height:19px; margin-top:30px; position:relative; padding:0; background:none; transition-duration:300ms; overflow:hidden;}
	.NC00301 .About_DoctorArea .ContArea .Arrow:before{content:''; width:6px; height:6px; position:absolute; right:0; top:50%; border-left:1px solid #000; border-top:1px solid #000; transform:translate(-50%,-44%) rotate(135deg);}
	.NC00301 .About_DoctorArea .ContArea .Arrow:after{content:''; width:40px; height:1px; position:absolute; right:4px; top:50%; margin-top:-0.5px; background:#000;}
	.NC00301 .About_DoctorArea .ContArea .Doctor:hover .Arrow{width:38px;}
	.NC00301 .About_DoctorArea .SliderBtn{margin-left:-8px; padding-top:50px;}
	.NC00301 .About_DoctorArea .SliderBtn span.swiper-pagination-bullet{width:30px; height:30px; background:none; margin:0;}
	.NC00301 .About_DoctorArea .SliderBtn span.swiper-pagination-bullet:before{width:6px; height:6px; transition:all .25s ease; border-radius:50%; margin-left:11px; background-color:transparent; box-shadow:inset 0 0 0 5px #000; display:block; content:''; position:relative; background:#333; top:13px; left:0;}
	.NC00301 .About_DoctorArea .SliderBtn span.swiper-pagination-bullet-active:before{width: 6px; height: 6px; transition: all .25s ease; border-radius:50%; margin-left:11px; transform:scale(2);
    box-shadow: inset 0 0 0 1px #000; background-color:transparent;}
	
	
	.NC00301.aboutDoctorWrap .CareerArea.Open{cursor: url('/img/NC00301/Doctor_Cursor.png'), auto;}
	.NC00301.aboutDoctorWrap .CareerArea{position:fixed; width:100vw; height:100vh; z-index:99999999; display:block; width:100%; top:0; left:0; height:100%; width:100%; background-color:#fff; color:#555; position:fixed; top:0; left:0; bottom:0; right:0; z-index:1100; -webkit-transform:translateX(100%); transform:translateX(100%); -webkit-transition:-webkit-transform .8s cubic-bezier(.2,1,.2,1); transition:transform .8s cubic-bezier(.2,1,.2,1);}
	.NC00301.aboutDoctorWrap .CareerArea .Career{display:flex; width:100%; height:100%; position:relative;}
	.NC00301.aboutDoctorWrap .CareerArea .Career i{position:absolute; right:50px; top:50px; font-size:22pt; color:#3d3d3d; z-index:2; cursor:pointer;}
	.NC00301.aboutDoctorWrap .CareerArea .Career .Right{display:block; width:50%; position:relative;}
	.NC00301.aboutDoctorWrap .CareerArea .Career .Left{display:block; width:50%; position:relative;;}
	.NC00301.aboutDoctorWrap .CareerArea .Career .Left .ImgBox{position:relative; display:flex; z-index:2; height:100%;}
	.NC00301.aboutDoctorWrap .CareerArea .Career .Left .ImgBox img{position:relative; display:block; z-index:2; height:100%; bottom:0; left:0%;}
	.NC00301.aboutDoctorWrap .CareerArea.Open .Career .Left .ImgBox img{transform:scale(1);}
	.NC00301.aboutDoctorWrap .CareerArea.Open .Career .Left .Bg{opacity:1; visibility:visible; -webkit-transform:translateX(0); -ms-transform:translateX(0);  transform:translateX(0); -webkit-transition:all 0.8s ease-in-out; transition: all 0.8s ease-in-out;}
	.NC00301.aboutDoctorWrap .CareerArea .Name{position:relative; display:flex; align-items:center; height:100%; padding-left:10%; width:800px;}
	.NC00301.aboutDoctorWrap .CareerArea .Name span{display:block; padding:30px 0 0 0;}
	.NC00301.aboutDoctorWrap .CareerArea .Name img{margin-top:40px; display:block; -ms-transition:all 1.1s cubic-bezier(.2, 1, .2, 1) .7s; -webkit-transition:all 1.1s cubic-bezier(.2,1,.2,1) .7s; transition:all 1.1s cubic-bezier(.2,1,.2,1) .7s; -webkit-font-smoothing:antialiased; opacity:0; -ms-transform:translateY(40px); -webkit-transform:translateY(40px); transform:translateY(40px); width:100px;}
	.NC00301.aboutDoctorWrap .CareerArea .Name #NameText{font-family:'Pretendard'; font-size:30pt; font-weight:600; display:inline-block; letter-spacing:1px; color:#1c1c1e; -ms-transition:all 1.1s cubic-bezier(.2, 1, .2, 1) .3s; -webkit-transition:all 1.1s cubic-bezier(.2,1,.2,1) .3s; transition:all 1.1s cubic-bezier(.2,1,.2,1) .3s; -webkit-font-smoothing:antialiased; opacity:0; -ms-transform:translateY(40px); -webkit-transform:translateY(40px); transform:translateY(40px);}
	.NC00301.aboutDoctorWrap .CareerArea .Name #NameText small{font-family:'Pretendard'; font-size:24pt; font-weight:400; display:inline-block; color:#1c1c1e;}
	.NC00301.aboutDoctorWrap .CareerArea .Name #ClinicName{font-family:'Reddit Sans'; font-size:11pt; font-weight:500; letter-spacing:1px; color:#a0a0a0; -ms-transition:all 1.1s cubic-bezier(.2, 1, .2, 1) .3s; -webkit-transition:all 1.1s cubic-bezier(.2,1,.2,1) .3s; transition:all 1.1s cubic-bezier(.2,1,.2,1) .3s; -webkit-font-smoothing:antialiased; opacity:0; -ms-transform:translateY(40px); -webkit-transform:translateY(40px); transform:translateY(40px); margin-top:10px;}
	.NC00301.aboutDoctorWrap .CareerArea .Name #CareerText *{font-size:16pt !important; letter-spacing:0; line-height:1.8;}
	.NC00301.aboutDoctorWrap .CareerArea .Name #CareerText{font-weight:400; letter-spacing:-0.5px; color:#1c1c1e; -ms-transition:all 1.1s cubic-bezier(.2, 1, .2, 1) .5s;
    -webkit-transition:all 1.1s cubic-bezier(.2,1,.2,1) .5s; transition:all 1.1s cubic-bezier(.2,1,.2,1) .5s; -webkit-font-smoothing:antialiased; opacity:0; -ms-transform:translateY(40px); -webkit-transform:translateY(40px); transform:translateY(40px); white-space:normal; line-height:1.5; font-size:14.5pt !important; margin-top:40px;}

	.NC00301.aboutDoctorWrap .CareerArea .Right .ClinicLogo{position:fixed; right:0; bottom:0;}
	.NC00301.aboutDoctorWrap .CareerArea.Open{-webkit-transform:translateX(0); transform:translateX(0);}
	.NC00301.aboutDoctorWrap .CareerArea.Open .Name img,
	.NC00301.aboutDoctorWrap .CareerArea.Open .Name #NameText,
	.NC00301.aboutDoctorWrap .CareerArea.Open .Name #ClinicName,
	.NC00301.aboutDoctorWrap .CareerArea.Open .Name #CareerText{opacity:1; -ms-transform:translateY(0); -webkit-transform:translateY(0); transform:translateY(0);}

/* ========================================================================================================================================= */
/*시술안내*/
.NC00301 .ClinicSelect .Title span{font-weight:700; color:#1c1c1e;}

.NC00301.clinicSideListWrap .ColorTxt{color:#3f464f;}
.NC00301.clinicSideListWrap .ClinicAllArea .ClinicList ul li a{border-color:#1c1c1e;}
.NC00301.clinicSideListWrap .ClinicAllArea .ClinicList ul li a .Name p span{position:absolute; top:0; background-color:#1c1c1e;}
.NC00301.clinicSideListWrap .ClinicAllArea .ClinicList ul li .Info{-webkit-line-clamp:3;}
.NC00301.clinicSideListWrap .BtnArea button:nth-child(1){background-color:#3f464f; color:#fff;}

.NC00301 .ClinicSelect .SelectForm{position:relative;}
.NC00301 .ClinicSelect .SelectForm:after{content:''; z-index:2; position:absolute; width:100%; height:1.6em; background:linear-gradient(rgb(255 255 255 / 0%), rgb(0 0 0 / 11%)); bottom:0;}
.NC00301 .ClinicSelect .ClinicLabel ul.List{height:457px; overflow-y:scroll; gap:1em; align-items:stretch;}
.NC00301 .ClinicSelect .ClinicLabel ul li{width:calc((100% - 1em) / 2); background:#ddd; background-color:#fff; box-shadow: 0px 3px 7px 0 rgba(0, 0, 0, 0.08);}
.NC00301 .ClinicSelect .ClinicLabel ul li + li{margin:0;}
.NC00301 .ClinicSelect .ClinicLabel ul li > label{height:100%; padding:25px 0 25px 25px; width: 100%; background-color:transparent; box-shadow:none;}
.NC00301 .ClinicSelect .ClinicLabel ul li > label:hover{cursor:pointer;}
.NC00301 .ClinicSelect .ClinicLabel ul li dl{height:100%; min-height:100px;}
.NC00301 .ClinicSelect .ClinicLabel ul li dl dt{width:100%; height:100%; display:flex; flex-direction:column; min-height:100px;}
.NC00301 .ClinicSelect .ClinicLabel ul li .Name{color:#1c1c1e; font-size:14pt; font-weight:700; margin-bottom:15px; line-height:1.5; width:91%; word-break:keep-all;}
.NC00301 .ClinicSelect .ClinicLabel ul li .Info{color:#1c1c1e; line-height: 1.5; max-height:88px; overflow-y:auto; margin-bottom:15px; padding-right:15px; display:block;}
.NC00301 .ClinicSelect .ClinicLabel ul li .Info br{line-height:1.5;}
.NC00301 .ClinicSelect .ClinicLabel ul li .Price{position:relative; bottom:0; display:block; margin:auto 0 0 0;}
.NC00301 .ClinicSelect .ClinicLabel ul li .Price span b{font-size:16pt;}
.NC00301 .ClinicSelect .ClinicLabel ul li .Price small{color:#3f464f; border:1px solid #3f464f;}

.NC00301 .ClinicSelect .ClinicLabel ul li dl dd{position:absolute; top:0; right:12px;}
.NC00301.PriceSideWrap .ColorTxt{border-color:#1c1c1e;}

/* ========================================================================================================================================= */
/*로그인*/
.NC00301.memberWrap #contents{padding-top:100px;}
.NC00301.cartWrap #contents{padding:180px 0 150px;}

/* ========================================================================================================================================= */
/*시술후기*/
.NC00301.reviewWrap #contents{padding:100px 0;}

/*진료예약*/
.NC00301.reservationWrap header.Fixed{position:fixed;}
.NC00301.reservationWrap #contents{padding:80px 0 160px;}
.NC00301.reservationWrap .ColorBd{border-color:#3f464f; color:#3f464f;}
.NC00301.reservationWrap .ColorBg{background-color:#3f464f;}
.NC00301.reservationWrap .BtnArea a:last-child{display:none;}

/*온라인상담*/
.NC00301.onlineListWrap #contents{padding:100px 0;}

/*고객의소리*/
.NC00301.feedbackWrap #contents{padding:100px 0;}
.NC00301.feedbackWrap .BtnBox button{background-color:#3f464f; min-width:250px; padding:15px 40px;}

/*장바구니*/
.NC00301.cartWrap .ColorBg{background-color:#3f464f;}