@charset "utf-8";



.section{position:relative; }

/* 메인비주얼 */
#mVisual {width:100%;height:960px; background-repeat:no-repeat; background-position:center top; background-size:cover; overflow:hidden; background-color:#fff; }
#mVisual .mVisualIn { position:absolute; left:0; top:40%; width:100%; }
#mVisual .mVisualIn dl {text-align:center;  color:#fff; }
#mVisual .mVisualIn dl dt { font-size: 3.688em; font-weight:600; line-height: 1.2em;  letter-spacing:-0.07em; margin:1% 0 3%; }
#mVisual .mVisualIn dl dd.t1 {font-size: 0.9em; line-height: 1.2em; letter-spacing:0.5em; text-transform:uppercase;}
#mVisual .mVisualIn dl dd.t2 { font-size: 1.525em; line-height: 1.2em;  }

@media all and (max-width:1024px) {
	#mVisual{height:70vw;}
}
@media all and (max-width:767px) {	
	#mVisual .mVisualIn { top: 25%; }
}
@media all and (max-width:670px) {
	#mVisual{height:90vw;}
	.br {display:block;}
}
@media all and (max-width:480px) {
	#mVisual .mVisualIn { top: 40%; }
	#mVisual .mVisualIn dl dt { font-size: 2.2em;} 
	#mVisual .mVisualIn dl dd.t1 { font-size: 0.8em; line-height: 1.2em; }
	#mVisual .mVisualIn dl dd.t2 {  font-size: 0.9em; line-height: 1.2em;  }
}


/*slider*/

.slider { float: left; }

.slider .jquery-reslider .slider-block {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 97;
  background-position: 50% 50%;
  background-size: cover;
  opacity: 0;
}

.slider .jquery-reslider .slider-dots {
  position: absolute;
  width: 100%;
  text-align: center;
  top: 80%;
}

.slider .jquery-reslider .slider-dots li {
  width: 30px;
  height: 3px;
  display: inline-block;
  *zoom:1; *display:block;
  margin: 0 5px;
  cursor: pointer;
  background-color:#fff;   
  opacity: 0.3;
}

.slider .jquery-reslider .slider-dots li.active { opacity: 1; }

@media screen and (max-width: 767px) {
	.slider .jquery-reslider .slider-dots li { width: 8px;  height: 8px; margin: 3px; }
}







.mTit h2 {font-size:2.2em; color:#212121; font-weight:300;}
.mTit h2 span {font-weight:600;}
.mTit p {font-size:0.95em; color:#999; margin-top:5px;}

#mClinic {margin:0 auto; padding:7% 0; position:relative;}
#mClinic ul {width:100%; overflow:hidden; margin-top:50px;}
#mClinic ul li {float:left; width:25%; height:370px; position:relative; overflow:hidden; text-align:center;}
#mClinic ul li:before {content:''; display:block; position:absolute; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; transition:transform 0.7s}
#mClinic ul li a {display:block; width:100%; height:100%; color:#fff; box-sizing:border-box; padding-top:90px; position:relative; z-index:10;}
#mClinic ul li h2 {font-size:2.313em; font-weight:700; line-height:1.2em; padding:7% 0 5%;}
#mClinic ul li .t1 {font-size:1.0em;  font-weight:500; line-height:1.3em;}

#mClinic ul li:nth-child(1):before {background-image:url(/images/main/clinic_bg1.png)}
#mClinic ul li:nth-child(2):before {background-image:url(/images/main/clinic_bg2.png)}
#mClinic ul li:nth-child(3):before {background-image:url(/images/main/clinic_bg3.png)}
#mClinic ul li:nth-child(4):before {background-image:url(/images/main/clinic_bg4.png)}

#mClinic ul li:hover:before {transform:scale(1.05, 1.05)}

@media screen and (max-width:1399px){
	#mClinic ul li a { padding-top:70px;}
	#mClinic ul li h2 {font-size:2.0em;}
}

@media screen and (max-width:976px){
	#mClinic {margin-top:10%; margin-bottom:10%}
	#mClinic ul {margin-top:6%}
	#mClinic ul li {width:50%; height:400px;}
}

@media screen and (max-width:550px){
	#mClinic ul li {float:none; width:100%; height:auto;}
	#mClinic ul li a {padding:12% 6% 16%}
	#mClinic ul li img {width:30%;}
	#mClinic ul li h2 {font-size:2.313em; }
	#mClinic ul li .t1 {font-size:1.2em; } 
}





#mTypo {width:100%; height:440px; background:url(/images/main/typo_box_bg.png) no-repeat center center; background-size:cover; display:table;}
#mTypo > div {display:table-cell; text-align:center; vertical-align:middle; box-sizing:border-box; padding:0 2%;}
#mTypo .en {font-size:0.9em; font-family:'Roboto'; color:rgba(255,255,255,0.3); letter-spacing:0.8em;  text-transform:uppercase;}
#mTypo h2 {font-size:1.813em; font-family: 'Nanum Myeongjo', serif; font-weight:400; color:#fff; margin:40px 0 60px;}
#mTypo h2 .line { position: relative; }
#mTypo h2 .line:before { position: absolute; content:''; width: 100%; height: 1px; background:rgba(255,255,255,0.1); bottom:0.1em; }

.br_976 {display:none;}
@media screen and (max-width:1399px){
	#mTypo {height:400px;}
}
@media screen and (max-width:976px){
	#mTypo {height:auto; padding:7% 0}
	#mTypo .en {font-size:0.7em; }
	#mTypo h2 {font-size:1.5em; margin:3% 0 4%}
	#mTypo img {width:23%;}
	.br_976 {display:block;}
}
@media screen and (max-width:550px){
	#mTypo {padding:10% 0}
}






#mComm {overflow:hidden;}
#mComm > div {float:left; width:33.3333%; height:350px; padding:43px 53px;}
#mComm > div:last-child { padding:0;}

.mDoctor {text-align:right; background:url(/images/main/doctor_bg.png) no-repeat center center; background-size:cover; position: relative;}
.mDoctor a {display:block; width:100%; height:100%;} 
.mDoctor dt {font-size:2.813em;  line-height:1.2em; color:#252525; font-weight:200; letter-spacing:-0.08em;  padding:30px 0 23px;}
.mDoctor .t1 {color:rgba(0,0,0,0.5);  line-height:1.2em;}
.mDoctor .t2 {font-size:1.15em; color:#252525; font-weight:500; line-height:1.2em; padding-bottom:5%;}
.mDoctor .doctor_btn { font-size:0.875em; color:#252525;  letter-spacing:0.03em; text-align:left; border:1px solid rgba(0,0,0,0.8); display: inline-block;  width: 180px;  padding: 2%; box-sizing: border-box; background: url("/images/main/arrow_detail.png") no-repeat 80% 48%; }
.mDoctor a:hover .doctor_btn { background-color:#f18800; border-color:#f18800; }

.mCscenter {background:#f18800 url(/images/main/cscenter_bg.png) no-repeat right bottom; padding:40px 40px 0; color:#fff}
.mCscenter dt {font-size:1.438em; line-height:1.2em; padding-bottom:10px;}
.mCscenter h2 {font-size:3.2em; font-weight:600; line-height:1.0em; padding-bottom:36px;}
.mCscenter dd {font-size:1.073em; line-height:1.4em;}
.mCscenter dd span {width:20%; display:inline-block;}
.mCscenter p {font-size:0.93em; color:rgba(255,255,255,0.3); line-height:1.2em; padding-top:10px;}

.mMap {}
#daumRoughmapContainer1595567832045 {width:100%; height:100%; padding:0; border:0;}
.root_daum_roughmap .wrap_map {height:100% !important}
.root_daum_roughmap .wrap_controllers {display:none;}

@media screen and (max-width:1408px){
	#mComm > div {padding:3%;}
	.mCscenter dd {font-size:1.0em; }
	.mCscenter dd span {width:25%; }
}
@media screen and (max-width:1280px){
	.mCscenter h2 {font-size:2.9em; font-weight:600; line-height:1.0em; padding-bottom:36px;}
}
@media screen and (max-width:1200px){
	#mComm > div {width:50%; height:30vw; padding:43px 53px; min-height: 350px;}
	#mComm > div:last-child {width:100%}
}
@media screen and (max-width:990px){
	#mComm > div {height:35vw; }
}
@media screen and (max-width:820px){
	#mComm > div { padding:4%; height:38vw; min-height: 290px; }
	.mCscenter h2 {padding-bottom:23px;}
}
@media screen and (max-width:660px){
	#mComm > div {width:100%;  height:49vw;  padding:5%; min-height: 100px;}
}
@media screen and (max-width:568px){
	.mDoctor dt {padding:20px 0 13px;}
}
@media screen and (max-width:480px){
	#mComm > div {height:55vw;}
}
@media screen and (max-width:450px){
	#mComm > div {height:55vw;}
}