@charset "utf-8";

#mVisual {position:relative; width:100%; height:860px; overflow:hidden; max-width:2000px;}
.mv_slider.slick-slide,
.mvWrap .slick-track,
.mvWrap .slick-list{ position:relative; height:100%; outline:none; }

#mVisual .mv_slider { background-repeat: no-repeat; background-size: cover;  }

.mv_slider.mv1 {background-image:url('/images/main/m_visual1.jpg'); background-position: center center;}
.mv_slider.mv2 {background-image:url('/images/main/m_visual2_new.jpg'); background-position: center center;}
.mv_slider.mv3 {background-image:url('/images/main/m_visual3_new.jpg'); background-position: center center;}


#mVisual .mv_slider .mv-txt {display:table; width:700px; height:100%; margin-right:10%; float:right}
#mVisual .mv_slider .mv-txt div { display:table-cell; vertical-align:middle; box-sizing:border-box; text-align:center; }
#mVisual .mv_slider .mv-txt div .eng { font-size:0.8125em; color:#b8b5a6; font-weight: 500; line-height: 1.2em; padding-bottom:1em; margin-bottom:2.5em; letter-spacing: 0.2em;  border-bottom:1px solid #e0dfd5; text-transform:uppercase; font-family: 'Poppins', sans-serif; }
#mVisual .mv_slider .mv-txt div .t1 { font-size: 3.75em; font-weight: 300; line-height: 1.2em; letter-spacing: -0.05em; color:#615a4c;  font-family: 'GmarketSans';}
#mVisual .mv_slider .mv-txt div .t2 { font-size: 4.375em; font-weight: 700; line-height: 1.2em; letter-spacing: -0.05em; color:#615a4c;  font-family: 'GmarketSans';}
#mVisual .mv_slider .mv-txt div .t3 { font-size: 1.12em; color:#807766; font-weight: 400; line-height: 1.8em; margin: 4% 0 7%;  }

.hexaList { overflow: hidden; margin: 2em auto 0;  }
.hexaList li { counter-increment: number; display: inline-block; vertical-align: middle; width: 145px; height: 167px; text-align:center;
                  background: url("/images/main/mv_hexa.png") no-repeat center; padding: 4.5% 0; box-sizing: border-box;
                  background-size: 100% auto; margin: 0 5px; }
.hexaList li::before { content: counter(number, decimal-leading-zero); border-bottom: 1px solid rgba(154,129,65,0.3);
                              font-size: 0.9375em; color: rgba(154,129,65,0.5); font-weight: 600;  font-family: 'Poppins', sans-serif;}
.hexaList li p { font-size: 1.25em; color:#82715a; font-weight: 400; margin-top: 1em; line-height: 1.2em; }


#mVisual .mv_slider .mv-txt2 {display:table; width:100%; height:100%; margin:0 0%; }
#mVisual .mv_slider .mv-txt2 div { display:table-cell; vertical-align:middle; box-sizing:border-box; color:#fff; text-align:center }
#mVisual .mv_slider .mv-txt2 div .t1 { font-size: 4.375em; font-weight: 700; line-height: 1.2em; letter-spacing: -0.05em; font-family: 'GmarketSans';}
#mVisual .mv_slider .mv-txt2 div .t2{font-size: 7.4em; color:rgba(169,168,158,0.3); line-height:1.2em;  font-family: 'Poppins', sans-serif; font-weight:900 }
#mVisual .mv_slider .mv-txt2 div .t3  { font-size: 1.125em; font-weight: 400; line-height: 1.8em; display:inline-block;}
#mVisual .mv_slider .mv-txt2 div .t3:before {content:''; width:100%; height:1px; background:rgba(255,255,255,0.2); position:absolute; left:0; bottom:0;}
#mVisual .mv_slider .mv-txt2 div .t3-box { margin-top:-3.5em; text-align:center; display:block;}

@media all and (max-width:1480px) {
  #mVisual { height: 48vw; font-size: 0.9em; }
}
@media all and (max-width:1399px) {
	#mVisual .mv_slider .mv-txt {width:570px;}
	.hexaList li {width: 130px; height: 150px; padding: 5.5% 0;}
}

@media all and (max-width:1280px) {
  #mVisual { height: 54vw;  }
}

@media all and (max-width:1130px) {
  #mVisual { font-size:0.8em; }
  	#mVisual .mv_slider .mv-txt {width:520px;}
  .hexaList li {width: 115px; height: 133px; padding: 5% 0;}
}

@media all and (max-width:976px) {
	#mVisual { height: 60vw; }
	 #mVisual .mv_slider .mv-txt { width:100%; height:100%; margin-right:0;  float:none}
	 #mVisual .mv_slider .mv-txt div {  text-align:left; padding-left:10%; }
	 #mVisual .mv_slider .mv-txt div .eng {display:inline-block;}
	 #mVisual .mv_slider .mv-txt div .t3 {margin: 2em 0 3em;  }
	 .mv_slider.mv1 {background-image:url('/images/main/m_visual1_mo.jpg'); }
    .hexaList li {width: 100px; height: 115px; padding: 3% 0;  background: url("/images/main/mv_hexa2.png") no-repeat center;  background-size: 100% auto; }

}
@media all and (max-width:850px) {
  #mVisual { height: 62vw; font-size: 0.7em;  }
}

@media all and (max-width:767px) {
	.hexaList li {width: 90px; height: 104px; padding: 3% 0;}
}
@media all and (max-width:640px) {
	.hexaList li {width: 80px; height: 92px; margin: 0 3px; }
}
@media all and (max-width:570px) {
	  #mVisual { height: 70vw}
	 #mVisual .mv_slider .mv-txt2 div .t2{font-size: 6.5em; }
}
@media all and (max-width:480px) {
  #mVisual { height: 70vw; font-size: 0.6em;  }  
   .mv_slider.mv1 {background-position:67% center;}
   	 #mVisual .mv_slider .mv-txt div { padding-left:5%; }
  .hexaList li {width: 65px; height: 75px; margin: 0 2px; padding: 4% 0; }

   #mVisual .mv_slider .mv-txt2 div .t2{font-size: 6em; }
}



.m-section {margin-top:5%}

.mTitle {text-align:center; padding-bottom:3.5em}
.mTitle h3 {font-size: 1.875em; font-weight:700; color:#222;line-height:1.3em; font-family: 'GmarketSans'; padding-bottom:0.3em;}
.mTitle p {font-size: 0.9375em; font-weight:400; opacity:.5; line-height:1.2em}
.mTitle p.eng {font-size:0.8125em; color:#b8b5a6; font-weight: 500; line-height: 1.2em; letter-spacing: 0.2em; text-transform:uppercase; font-family: 'Poppins', sans-serif; }
.mTitle .br480 {display:none }
@media all and (max-width:480px) {
	.mTitle .br480 {display:block }
}
@media all and (max-width:976px) {
	.mTitle.mc1 {display:none }
}


#mClinic {margin:0 auto; position:relative; padding-bottom:7%;}
#mClinic:before {content:''; width:100%; height:50%; background:#f7f6f3; position:absolute; left:0; bottom:0}
#mClinic ul {width:100%; overflow:hidden;  }
#mClinic ul li {float:left; width:calc(20% - 8px); margin-right:10px; height:390px; position:relative; overflow:hidden; text-align:center;}
#mClinic ul li:last-child {margin-right:0}
#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:10%; position:relative; z-index:10;}
#mClinic ul li h2 {font-size:2.25em; font-weight:700; line-height:1.2em; font-family: 'GmarketSans';}
#mClinic ul li .t1 {font-size:1.0em;  font-weight:400; line-height:1.3em;}

#mClinic ul li.mclinic-mo {display:none}
#mClinic ul li.mclinic-mo img {width:100%}
#mClinic ul li.mclinic-mo h2 {color:#222; padding-bottom:0.3em;}
#mClinic ul li.mclinic-mo .t1 {opacity:.5}

#mClinic ul li:nth-child(2):before {background-image:url(/images/main/mclinic-img1.jpg)}
#mClinic ul li:nth-child(3):before {background-image:url(/images/main/mclinic-img2.jpg)}
#mClinic ul li:nth-child(4):before {background-image:url(/images/main/mclinic-img3.jpg)}
#mClinic ul li:nth-child(5):before {background-image:url(/images/main/mclinic-img4.jpg)}
#mClinic ul li:nth-child(6):before {background-image:url(/images/main/mclinic-img5.jpg)}

#mClinic ul li:hover:before {transform:scale(1.05, 1.05)}

@media screen and (max-width:1399px){
	#mClinic ul li {height:23vw}
}
@media screen and (max-width:1180px){
	#mClinic ul li a {font-size:0.9em;}
}
@media screen and (max-width:976px){
	#mClinic ul li.mclinic-mo {display:block}
	#mClinic ul li {width:calc(33.3333% - 6.6666px); margin-bottom:10px; height:37vw}
	#mClinic ul li:nth-child(3n) {margin-right:0; }
	#mClinic ul li a {font-size:1.125em;}
}

@media screen and (max-width:580px){
	#mClinic ul li {width:calc(50% - 5px); height:58vw}
	#mClinic ul li:nth-child(3n) {margin-right:10px; }
	#mClinic ul li:nth-child(2n) {margin-right:0; }
}
@media screen and (max-width:480px){
	#mClinic ul li a {font-size:0.9em;}
}






#mDiff {padding-bottom:7%; background:#f7f6f3; overflow:hidden}
#mDiff .m-inner > div {background-repeat:no-repeat; float:left; }


#mdiff-1 {width:calc(45% - 20px);   margin-right:20px; background-image:url('/images/main/mdiff-1-bg.png'); background-size:cover; }
#mdiff-1 .m_g {overflow:hidden;height:420px;   position:relative}
#mdiff-1 .m_g a {}
#mdiff-1 .m_g a img {margin:0 auto}
#mdiff-1 .m_g dl {width:100%; color:#FFF; padding:1em 0 1em; padding-left:1.5em; z-index:2; margin-top:-40px; position:absolute; left:0; bottom:0;
							/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bb7d34+0,7db9e8+99&1+0,0+88 */
							background: -moz-linear-gradient(left,  rgba(239,125,0,1) 0%, rgba(132,178,212,0) 88%, rgba(125,185,232,0) 99%); /* FF3.6-15 */
							background: -webkit-linear-gradient(left,  rgba(239,125,0,1) 0%,rgba(132,178,212,0) 88%,rgba(125,185,232,0) 99%); /* Chrome10-25,Safari5.1-6 */
							background: linear-gradient(to right,  rgba(239,125,0,1) 0%,rgba(132,178,212,0) 88%,rgba(125,185,232,0) 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
							filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bb7d34', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */}
#mdiff-1 .m_g dl dt {font-size: 2.0em; padding-right:4%;  font-family: 'GmarketSans'; font-weight:700;display:inline-block;}
#mdiff-1 .m_g a:hover dl dt {color:#fbe598}
#mdiff-1 .m_g dl dt .st1 { font-size:0.55em; line-height:1.6em;font-family: 'S-CoreDream'; font-weight:400;}

@media all and (max-width:1550px) {
	#mdiff-1 .m_g dl dt .st1 {display:block;}
}
@media all and (max-width:1399px) {
	#mdiff-1 .m_g {height:370px; }
	#mdiff-1 .m_g a img {height:335px;}
}
@media all and (max-width:1050px) {
	#mdiff-1 {width:100%; margin-bottom:5%;   margin-right:0; }
	#mdiff-1 .m_g {height:42vw; }
	#mdiff-1 .m_g a img {height:100%;}
	#mdiff-1 .m_g dl dt .st1 {display:inline;}
}
@media all and (max-width:530px) {
	#mdiff-1 .m_g dl dt .st1 {display:block;}
}
@media all and (max-width:480px) {
	#mdiff-1 .m_g {height:60vw; }
}

#mdiff-2 {width:55%; height:420px;  background-image:url('/images/main/mdiff-2-bg.png'); background-size:cover;   position:relative}
#mdiff-2 .name {color:#FFF;padding-left:0; 
							/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#00abc5+0,7db9e8+100&1+0,0+80 */
							background: -moz-linear-gradient(left,  rgba(142,194,31,1) 0%, rgba(100,182,225,0) 60%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
							background: -webkit-linear-gradient(left,  rgba(142,194,31,1) 0%,rgba(100,182,225,0) 60%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
							background: linear-gradient(to right,  rgba(142,194,31,1) 0%,rgba(100,182,225,0) 60%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
							filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00abc5', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
							}
#mdiff-2 .name h3 {font-size: 2.375em; padding-left:50px; padding:0.35em 0.5em 0.4em 1.3em; background-size:auto 50%; font-family: 'GmarketSans'; font-weight:700;display:inline-block; display:inline-block; }
#mdiff-2 .name p {font-size:1.2em; line-height:1.6em;display:inline-block;  display:inline-block; }
#mdiff-2 dl {padding:5% 0 0 5.5%;}
#mdiff-2 dl dt {font-size: 1.375em; color:#026f80; font-weight:400; line-height:1.5em; }
#mdiff-2 dl dd {padding-top:2em; }
#mdiff-2 dl dd p {line-height:1.5em;}

#mdiff-2 .mdiff-img {position:absolute; right:0; bottom:0}

@media all and (max-width:1399px) {
	#mdiff-2 {height:370px; }
	#mdiff-2 .mdiff-img {width:305px;  right:-65px;}
}
@media all and (max-width:1050px) {
	#mdiff-2 {width:100%;}
	#mdiff-2 dl {padding:4% 0 0 5.5%;}
}
@media all and (max-width:978px) {
	#mdiff-2 {height:345px; }
	#mdiff-2 .mdiff-img {width:280px;  right:0;}
}
@media all and (max-width:767px) {
	#mdiff-2 {height:310px; }
	#mdiff-2 .mdiff-img {width:250px;  right:0;}
}
@media all and (max-width:640px) {
	#mdiff-2 {height:255px; }
	#mdiff-2 .mdiff-img {width:200px; }
	#mdiff-2 dl dd {padding-top:1.3em; }
}
@media all and (max-width:480px) {
	#mdiff-2 {height:240px; }
	#mdiff-2 .mdiff-img {width:180px;  right:-80px;}
}



#mIntro {padding-bottom:7%; color:#FFF; background:#f7f6f3 url('/images/main/mintro-bg_new.png')no-repeat right top; background-size:100% cover;}
#mIntro .typo { padding:7% 0; text-align:center;  }
#mIntro .typo .t1 {font-size: 1.875em; line-height:1.3em;  font-family: 'GmarketSans'; font-weight:300;}
#mIntro .typo .t2 {font-size:2.875em; line-height:1.3em;  font-family: 'GmarketSans'; font-weight:500; letter-spacing:-0.08em;}
#mIntro .typo .eng {font-size:0.8125em; padding:2% 0;  opacity:.12; font-weight: 600; line-height: 1.2em; letter-spacing: 1em; text-transform:uppercase; font-family: 'Poppins', sans-serif; }
#mIntro .typo .st1 {font-size:1.125em; line-height:1.2em; padding:0.5em 0;  font-weight:300}
#mIntro .typo .st1 .point {font-size:1.2em; font-weight:400; color:#00a1e9;  line-height:1.3em}
#mIntro .typo .br480 {display:none}
@media all and (max-width:1399px) {
	#mIntro {background-size:120% auto;}
}
@media all and (max-width:1070px) {
	#mIntro { background-size:140% auto;}
}
@media all and (max-width:767px) {
	#mIntro .typo {font-size:0.9em}
}
@media all and (max-width:580px) {
	#mIntro { background-size:180% auto;}
}
@media all and (max-width:480px) {
	#mIntro { background-size:210% auto;}
		#mIntro .typo {font-size:0.8em}
		#mIntro .typo .br480 {display:block}
}

#mIntro .mboxList {overflow:hidden; }
#mIntro .mboxList li {width:calc(33.3333% - 13.3333px);  height:320px;  margin-right:20px; float:left; background:#FFF}
#mIntro .mboxList li:last-child {margin-right:0}
#mIntro .mboxList li img {width:100%}


#mIntro .mboxList .time {padding:3.5% 4%;   background:#00a1e9 url('/images/main/mtime-icon.png')no-repeat; background-position:93% 85%  }
#mIntro .mboxList .time .t1 {font-size:1.15em; line-height:1.2em; padding:0.2em 0;} 
#mIntro .mboxList .time .t1 span {display:inline-block; width:90px;}
#mIntro .mboxList .time .st1 {padding-top:0.5em;}

@media all and (max-width:1699px) {
	#mIntro .mboxList li {height:18.7vw; }
}
@media all and (max-width:1399px) {
	#mIntro .mboxList .time {padding:3% 0 3% 4% }
}
@media all and (max-width:1280px) {
	#mIntro .mboxList li {height:20vw; }
}
@media all and (max-width:1160px) {
	#mIntro .mboxList .time {padding:2% 0 2% 3% }
}
@media all and (max-width:1024px) {
	#mIntro .mboxList li {width:calc(50% - 10px); margin-bottom:20px; height:28vw}
	#mIntro .mboxList .time {width:100%; height:auto}
}
@media all and (max-width:580px) {
	#mIntro .mboxList li {height:30vw; width:calc(50% - 5px); margin-bottom:10px; margin-right:10px; }
}
@media all and (max-width:480px) {
}

#mIntro .mboxList .in-tit {padding:3% 6%; background:url('/images/main/mintro-arrow.png') no-repeat 95% center}
#mIntro .mboxList .in-tit.no-arrow {padding:0;  background:none; }
#mIntro .mboxList .in-tit dt {font-size:1.375em; line-height:1.5em; color:#222; font-weight:500 }
#mIntro .mboxList .in-tit dd {font-size:0.875em; opacity:.5; line-height:1.5em; color:#222;  font-weight:400}
#mIntro .mboxList .in-tit a:hover dt {color:#009fe9}
#mIntro .mboxList .in-tit a:hover dd {opacity:.7;}

@media all and (max-width:580px) {
	 #mIntro .mboxList .in-tit {background-size:18% auto }
}
@media all and (max-width:480px) {
	#mIntro .mboxList .in-tit dt {padding-top:3%}
	#mIntro .mboxList .in-tit dd  {display:none;}
}




#mMap { position: relative;}
#mMap .Map_box {width:100%; height:100%}
#mMap .root_daum_roughmap .wrap_map  { height: 500px !important; }
.wrap_controllers  { display: none; }
.map_border {  display: none;}

#mMap .mmap-info { position: absolute; top:20%; right:8%; z-index:2;  padding:1.58em; background:#FFF; }
#mMap .mmap-info dl {padding-left:70px; margin-top:1.2em; margin-bottom:1.2em; letter-spacing:-0.03em;}
#mMap .mmap-info dl:first-child { margin-top:0; }
#mMap .mmap-info dl:last-child { margin-bottom:0; }
#mMap .mmap-info dl h3 {font-size: 2em;  color:#00abc5; line-height:1.3em;  font-family: 'GmarketSans'; font-weight:700; letter-spacing:-0.01em; }
#mMap .mmap-info dl dt {font-size:1.125em; color:#222; line-height:1.2em; font-family: 'GmarketSans'; font-weight:500;  }
#mMap .mmap-info dl dd {font-size: 0.875em; line-height:1.3em; padding-top:5px;}
#mMap .mmap-info .line { background:url('/images/main/line.png') repeat-x bottom; width:100%; height:1px;}
#mMap .mmap-info dl.icon1 {background:url('/images/main/mmap-icon1.png') no-repeat left center; }
#mMap .mmap-info dl.icon2 { background:url('/images/main/mmap-icon2.png') no-repeat left center; }
#mMap .mmap-info dl.icon3 {background:url('/images/main/mmap-icon3.png') no-repeat left center;  }



@media screen and (max-width:976px){
	#mMap {height:auto; overflow:hidden;}
	#mMap .Map_box {width:50%; height:100%; position:absolute; left:0; top:0;}
	#mMap .mmap-info {float:right; position:relative; right:0; top:0; width:42%; height:auto; padding:6% 3%; background:rgba(255,255,255,0.8); font-size:1.1em;}
	#mMap .mmap-info dl.icon1, 
	#mMap .mmap-info dl.icon2,
	#mMap .mmap-info dl.icon3 {background-size:13% auto}
	#mMap .mmap-info dl {padding-left:15%}
}
@media screen and (max-width:690px){
	#mMap .mmap-info { width:50%; }
}
@media screen and (max-width:580px){
	#mMap .Map_box {position:relative; width:100%; height:300px}
	#mMap .mmap-info {float:none; width:100%; padding:6% 4%}
	#mMap .mmap-info dl.icon1, 
	#mMap .mmap-info dl.icon2,
	#mMap .mmap-info dl.icon3 {background-size:8% auto}
	#mMap .mmap-info dl {padding-left:12%}
}
@media screen and (max-width:380px){
	#mMap .mmap-info dl.icon1, 
	#mMap .mmap-info dl.icon2,
	#mMap .mmap-info dl.icon3 {background-size:11% auto}
	#mMap .mmap-info dl {padding-left:15%}
}



