@charset "utf-8";

.dotlist{}
.dotlist > li{position: relative; padding-left: 0.7em; margin-bottom: 0.2em;}
.dotlist > li:last-child{margin-bottom: 0;}
.dotlist > li::before{content: ''; position: absolute; left: 0; top:0.4em; width: 4px; height: 4px; background-color: #066074; border-radius: 50%;}

#intro1 .since{display: flex; justify-content: center; align-items: flex-start;}
#intro1 .since .num{position: relative; display: flex; align-items: flex-start; padding-right: 200px;}
#intro1 .since .num:before{content: ''; position: absolute; width: 130px; height: 1px; background-color: #a8a8a8; right: 0; top: 10px;}
#intro1 .since .num .t1{font-family: 'Montserrat'; font-weight: 800; color: #1f3044; font-size: 3.0rem;}
#intro1 .since .num .t2{font-family: 'Smooch'; font-size: 15rem; color: #124f99; line-height: 11rem;}
#intro1 .since .cont{padding-left: 40px; font-size: 3.6rem; color: #1f3044;}
#intro1 .since .cont .fw-EB{color: #124f99;}

#intro1 .top{margin-top: 70px; display: flex; height: 480px;}
#intro1 .top .cont{display: flex; justify-content: center; align-items: center; width: 700px; height: 100%;  background: url('/images/sub/intro1-img1.webp')no-repeat; background-size:cover; color: #fff; text-align: center;}
#intro1 .top .cont .t1{margin: 50px 0;; font-family: 'NanumMyeongjo'; font-size: 2.4rem; line-height: 1.5em;}
#intro1 .top .cont .t1 .br1{display: none;}
#intro1 .top .cont .t2{font-weight: 500; font-size: 2.0rem; }
#intro1 .top .cont .t2 span{font-weight: 800; font-size: 1.4em}
#intro1 .top .bg{width: calc(100% - 700px); height: 100%; background: url('/images/sub/intro1-img2.webp')no-repeat; background-size:cover;}
#intro1 .mid{padding: 100px 0 0;}
#intro1 .mid h4{text-align: center; font-size: 3.2rem; font-weight: 800; color: #1f3044;}
#intro1 .mid .t1{margin-top: 50px; line-height: 2.1; font-size: 1.8rem ;font-weight: 500; text-align: center;}
#intro1 .mid .br1{display: none;}
#intro1 .mid .list{margin-top: 100px; display: flex; flex-wrap: wrap; gap:20px;}
#intro1 .mid .list dl{display: flex; width: calc(50% - 10px);}
#intro1 .mid .list dl dt{flex:0 0 auto; display: flex; align-items: center; justify-content: center; width: 170px; font-size: 3.0rem; font-weight: 700; color:#fff; background-color: #066074; text-align: center;}
#intro1 .mid .list dl dd{min-height: 90px; padding:1em 1.5em; background-color: #f6f9fa; width: 100%; font-size: 2.0rem; color: #222222; font-weight: 500; display: flex; align-items: center;}

@media all and (max-width:1399px){
    #intro1 .top .cont .t1 .br1{display: block;}
    #intro1 .top .cont{width: 500px;}
    #intro1 .top .bg{width: calc(100% - 500px); background-position: 55% top;}

    #intro1 .mid .list dl dt{width: 130px;}
}
@media all and (max-width:1199px){
    #intro1 .top .cont{width: 400px;}
    #intro1 .top .bg{width: calc(100% - 400px);}
}
@media all and (max-width:976px){
    #intro1 .since{display: block; text-align: center;}
    #intro1 .since .num{justify-content: center; padding-right: 0; margin-bottom: 1em;}
    #intro1 .since .num:before{display: none;}
    #intro1 .since .cont{padding-left: 0;}

    #intro1 .top{flex-direction: column-reverse; height: auto;}
    #intro1 .top .bg{width: 100%; height: 400px;}
    #intro1 .top .cont{width: 100%;padding: 50px; height: auto;}
    #intro1 .top .cont .t1 .br1{display: none;}

    #intro1 .mid .list{flex-wrap: wrap;}
    #intro1 .mid .list dl{width: 100%;}
}
@media all and (max-width:480px){
    #intro1 .top{margin-top: 45px;}
    #intro1 .top .bg{height: 300px;}
    #intro1 .mid{padding: 45px 0 0;}
    #intro1 .mid .br1{display: block;}
    #intro1 .mid .t1{margin-top: 20px;}
    #intro1 .mid .list{margin-top: 45px;}
    #intro1 .mid .list dl dt{width: 100px;}
}









#cln-Wrap {position:relative}
#cln-Wrap:before {content:''; width:100%; height:40%; background:#f5f8fb; position: absolute; right:0; bottom:0}
.cln-top { overflow: hidden; padding-top: 80px; background-repeat: no-repeat; background-position: right top; background-size: 75% auto; }
.cln-top .cln-img img { width: 25%; float: left; }
.cln-top .cln-txt { position: absolute; bottom:0; right:0; width: 50%; float: left; box-sizing: border-box; padding-left: 3.5%; }
.cln-top .cln-txt:before {content:''; width:100%; height:80px; background:#FFF; position: absolute; right:0; bottom:0}
.cln-top .cln-txt .t1 { font-size:3.4rem; color:#1ebdff; font-weight:300; 
						line-height: 1.4em; letter-spacing: -0.03em; padding: 1.2em 0;  }
.cln-top .cln-txt .t2 { font-size:1.5rem; line-height: 80px; letter-spacing: 0.6em; font-family: 'Montserrat', sans-serif; position: relative; color:#1f3044}

#cataract1 { background-image: url("/images/sub/top-cataract1.png"); }
#cataract4 { background-image: url("/images/sub/top-cataract4.png"); }
#cataract5 { background-image: url("/images/sub/top-cataract5.png"); }

#lasik1 { background-image: url("/images/sub/top-lasik1.png"); }
#lasik2 { background-image: url("/images/sub/top-lasik2.png"); }

#near1 { background-image: url("/images/sub/top-near1.png"); }
#near2 { background-image: url("/images/sub/top-near2.png"); }

@media all and (max-width:1599px) {
  .cln-top .cln-txt .t2 { letter-spacing: 0.3em; }
}
@media all and (max-width:1499px) {
   .cln-top .cln-txt .t2 { font-size: 1.3rem; }
}
@media all and (max-width:1399px) {
   .cln-top .cln-txt .t1 { font-size: 3.2rem }
}
@media all and (max-width:1080px) {
   .cln-top { padding-top: 6vw; }
   .cln-top .cln-txt:before { height:5vw}
   .cln-top .cln-txt .t1 { font-size: 3.0rem; }
   .cln-top .cln-txt .t2 { font-size: 1.2rem;  line-height: 5vw;}
}
@media all and (max-width:1024px) {
   .cln-top { padding-top: 10vw; background-size: 95% auto; }
   .cln-top .cln-img img { width: 30%; }
   .cln-top .cln-img img:first-child { display: none;}
   .cln-top .cln-txt { width: 70%; }
}
@media all and (max-width:640px) {
	.cln-top {   background-size: 100% auto}
   .cln-top .cln-txt .t1 { font-size: 2.4rem; padding: 0.8em 0; }
   .cln-top .cln-txt .t2 {  letter-spacing: 0.2em;}
}
@media all and (max-width:480px) {
   .cln-top .cln-txt .t1 { font-size: 2.0rem; }
   .cln-top .cln-txt .t2 {font-size: 1.0rem; letter-spacing: 0.08em; }
}





.m-Part {margin:130px 0; }
.p-Part {padding:130px 0; }
.s-Part {margin-top:80px; }
@media all and (max-width:976px) {
	.m-Part {margin:10% 0; }
	.p-Part {padding:10% 0; }
	.s-Part {margin:50px 0; }
}
@media all and (max-width:640px) {
	.m-Part {margin:18% 0; }
	.p-Part {padding:18% 0; }
}


.dark-Bg {background:#303845}


#sTitle {margin-bottom:3em; text-align:center}
#sTitle h3 {font-size:5.0rem; color:#1f3044; font-family: 'ONE-Mobile-Title'; font-weight:normal }
#sTitle .t2 {font-size:2.4rem; font-weight:700; padding-top:2em; line-height:1.4em; }
#sTitle .t1 {padding-top:1em; line-height:1.4em; opacity:.7}
#sTitle .t3 {width:100%; max-width:1024px; margin:0 auto; padding-top:1em; font-size:1.8rem; padding-top:1em; line-height:1.6em; }
#sTitle .op3 {opacity:.3}

@media all and (max-width:480px) {
	#sTitle h3 {font-size:4.0rem;}
	#sTitle .t2 {font-size:2.1rem;} 
	#sTitle .t1 {font-size:1.5rem}
	#sTitle .t3 { font-size:1.7rem}
}






#clinicInfo { text-align:Center; background:#f5f8fb;}
#clinicInfo h3 {font-size:5.0rem; color:#1f3044; font-family: 'ONE-Mobile-Title'; font-weight:normal }
#clinicInfo .t2 {margin:2em 0 1em;  font-size:2.4rem; color:#12998d; font-weight:700}
#clinicInfo .t1 {width:100%; max-width:1024px; font-size:1.95rem;  line-height:1.6em; margin:0 auto}



#vsList {display:flex; justify-content:center; gap:20px}
#vsList li img {width:100%}
#vsList li p {width:100%; padding:0.7em 0; font-size:2.2rem; font-weight:700; color:#FFF; background:#124f99;  text-align:Center;  }
#vsList li p.vs2 {background:#333 }

#vsList.cataract1 {margin-top:5%}

@media all and (max-width:640px) {
	#vsList.cataract1 {flex-wrap:wrap; margin-top:10%; gap:10px}
	#vsList.cataract1 li { width:100%}
}






#imgContList {display:flex; justify-content:center;}
#imgContList.w50 li {width:500px }
#imgContList li {text-align:center;  margin:1%; background:#f2f7fb}
#imgContList.bgFFF li { background:#FFF}
#imgContList li img { width:100% }
#imgContList li dl dt { background:#124f99; color:#FFF; font-size:2.6rem; font-weight:700; padding:0.5em 0}
#imgContList li dl dt.bg2 {background:#303845}
#imgContList li dl dt.bg3 {background:#222}
#imgContList li dl dd { padding:1.5em; font-size:1.8rem; line-height:1.4em; }

#imgContList.lasik1 li img {width:70%; padding:2% 0 }

@media all and (max-width:767px) {
	#imgContList.w50 {flex-wrap:wrap}
	#imgContList.w50 li {width:100%; margin:1% 0}
}






#imgList {display:flex; flex-wrap:wrap; }
#imgList.w50 li {width:49%; margin:0.5%}
#imgList li {display:flex; background:#FFF; padding:20px; align-items: center; position:relative; counter-increment: number; }
#imgList li:before {content: counter(number, decimal-leading-zero); width:60px; line-height:60px; background:#1b78e9 ; color:#FFF;
							font-size:2.2rem; font-family:'Oswald'; font-weight:500; position:absolute; left:-5px; top:-5px; text-align:center}
#imgList li .img {width:200px; order:2 }
#imgList li .txt { width:calc(100% - 200px); padding-left:7%; order:1}
#imgList li .txt dt {font-size:2.6rem; font-weight:800; color:#124f99 }
#imgList li .txt dd {font-size:1.8rem; padding-top:0.7em; line-height:1.4em}

@media all and (max-width:1280px) {
	#imgList li:before { width:40px; line-height:40px; }
	#imgList li .img {width:150px; }
	#imgList li .txt { width:calc(100% - 150px); }
}
@media all and (max-width:976px) {
	#imgList.w50 li {width:100%; margin:0.5% 0;}
}
@media all and (max-width:767px) {
	#imgList li:before { width:40px; line-height:40px;  left:0; top:0; font-size:1.8rem;}
}

@media all and (max-width:480px) {
	#imgList li {padding:10px; }
	#imgList li .img {width:25vw; order:1 }
	#imgList li .txt { width:calc(100% - 25vw); order:2 }
	#imgList li .txt dt {font-size:2.2rem;  }
	#imgList li .txt dd {font-size:1.6rem;}
	#imgList li:before {display:none}
}


#imgList.cataract1 li {width:31%; margin:1%; padding:0; display:block; text-align:center}
#imgList.cataract1 li .img {width:70%}
#imgList.cataract1 li .txt {width:100%; margin-top:-10px; padding: 0 20px 30px; background:#f5f8fb}
#imgList.cataract1 li .txt  dt { margin-top:-30px; background:#124f99; color:#FFF; display:inline-block; padding:0.5em 1.5em; font-weight:600}
#imgList.cataract1 li .txt  dd {padding-top:1.5em}

#imgList.cataract1.bg li {background:#f5f8fb}
#imgList.cataract1.bg li .txt  { background:#303845;  color:#FFF} 
#imgList.cataract1.bg li .txt  dt { background:#124f99}

@media all and (max-width:1024px) {
	#imgList.cataract1 li .txt  dt {padding:0.5em 1.0em;}
}
@media all and (max-width:976px) {
	#imgList.cataract1 li {width:48%; margin:1%}
}
@media all and (max-width:640px) {
	#imgList.cataract1 li .img {width:60%}
	#imgList.cataract1 li {width:100%; margin:1% 0}
}




#cataract2 {background:url('/images/sub/cataract2-bg.png') no-repeat center bottom; background-size:cover}
#cataract2 .tit {text-align:Center; margin-bottom:3em; }
#cataract2 .tit p.eng {font-size:1.4rem; color:#FFF; text-transform:uppercase; opacity:.3; font-family:'Oswald'; font-weight:500;
								letter-spacing:0.5em; margin-top:1em; }
#cataract2 .tit h3 {font-size:3.2em; font-weight:300;  color:#FFF; }




#circleWrap {display:flex; flex-wrap:wrap; justify-content:center; }
#circleWrap li {width:340px; height:340px; margin:0 -15px; border-radius:100%; position:relative;
				display:flex; justify-content:center;align-items: center;  align-content: center;}
#circleWrap li:before {content:''; width:360px; height:360px; border-radius:100%; position:absolute; left:-10px; top:-10px;  }
#circleWrap li.bg1 {background-color:rgba(3,153,141,0.90);}
#circleWrap li.bg1:before {background:rgba(3,153,141,0.3);}
#circleWrap li.bg2 {background-color:rgba(13,88,158,0.90);}
#circleWrap li.bg2:before {background:rgba(13,88,158,0.3);}
#circleWrap li.bg3 {background-color:rgba(73,47,187,0.90);}
#circleWrap li.bg3:before {background:rgba(73,47,187,0.3);}
#circleWrap li dl {text-align:center; color:#FFF; position:relative}
#circleWrap li dl dt {font-size:3.2rem; font-weight:700}
#circleWrap li dl dd {margin-bottom:1em; font-size:2.4rem}

@media all and (max-width:1199px) {
	#circleWrap li {width:280px; height:280px; }
	#circleWrap li:before {width:300px; height:300px}
	#circleWrap li dl dd {margin-bottom:0.5em; }
}
@media all and (max-width:976px) {
	#circleWrap {width:90%; max-width:500px; margin:0 auto}
	#circleWrap li {width:280px; height:280px; }
	#circleWrap li:last-child {margin-top:-60px}
	#circleWrap li:before {width:300px; height:300px}
	#circleWrap li dl dd {margin-bottom:0.5em; }
}
@media all and (max-width:640px) {
	#circleWrap li {width:200px; height:200px; margin:0 -5px}
	#circleWrap li:last-child {margin-top:-35px}
	#circleWrap li:before {width:220px; height:220px}
}
@media all and (max-width:480px) {
	#circleWrap li {width:42vw; height:42vw;}
	#circleWrap li:before {width:44vw; height:44vw; left:-1vw; top:-1vw }
	#circleWrap li dl dt {font-size:2.8rem; }
	#circleWrap li dl dd {; font-size:2.2rem}
}


#cataract2-cont .cont {display:flex; flex-wrap:wrap; justify-content:center; color:#FFF; gap:10px }
#cataract2-cont .cont p.t1 { border:1px solid #1b78e9 ; border-radius:60px; padding:1em 1.5em; margin-bottom:5px;
							font-size:2.2rem;}
#cataract2-cont .cont p.t1 i {color:#1b78e9 ; padding-right:0.3em}

@media all and (max-width:976px) {
	#cataract2-cont .cont { gap:5px }
}






#imgStep {display:flex; flex-wrap:wrap; justify-content:center;}
#imgStep li {text-align:center; border:8px solid #f2f7fb; color:#FFF; font-size:1.8rem; font-weight:500}
#imgStep li img {width:100%}
#imgStep li .t1 {padding:1em 0.5em; background:#124f99 }
#imgStep.w5 li {width:19%; margin: 0.5%;  }

@media all and (max-width:1099px) {
	#imgStep.w5 li {width:32%;}
}
@media all and (max-width:640px) {
	#imgStep.w5 li {width:49%;}
}




#circleList {display:flex;justify-content:center;align-items: center; flex-wrap:wrap; gap:0 10px }
#circleList li {text-align:center; color:#FFF; border-radius:100%; background:rgba(13, 88, 158, 0.90); display:flex;justify-content:center;align-items: center}
#circleList li:nth-child(even) {background:rgba(3, 153, 141, 0.90);}
#circleList li p {font-size:2.4rem;}
#circleList li p .point {font-size:3.2rem; font-weight:700; color:#fff096}
#circleList.cataract4 li {width:230px; height:230px;}

@media all and (max-width:976px) {
	#circleList.cataract4 li {width:180px; height:180px;}
}
@media all and (max-width:640px) {
	#circleList.cataract4  { gap:0 5px}
	#circleList.cataract4 li {width:130px; height:130px; }
}
@media all and (max-width:480px) {
	#circleList.cataract4  { gap:0}
	#circleList.cataract4 li {width:30vw; height:30vw; margin:-11px -3px}
	#circleList li p {font-size:2.1rem;}
	#circleList li p .point {font-size:2.8rem;}
}



#checkList {display:flex; justify-content:center; flex-wrap:wrap}
#checkList li {border-radius:60px; background:#f5f8fb; padding:1.5em} 
#checkList.w50 li {width:49%; margin: 0.5%; }
#checkList li p {font-size:1.8rem; padding-left:40px; position:relative}
#checkList li p:before {content:''; width:23px; height:21px; background:url('/images/sub/check-icon.png')no-repeat left top; 
							position:absolute; left:0; top:0}
@media all and (max-width:1280px) {
	#checkList li p { padding-left:30px;}
}
@media all and (max-width:976px) {
	#checkList.w50 li {width:100%; margin: 0.5% 0; }
}
















#tb-style1{width: 100%;  font-size: 1.8rem; text-align: center;}
#tb-style1 thead tr th {padding: 1em; background-color: #124f99; border-right: 1px solid #eee; font-size: 1.9rem; 
						  font-weight: 500; border-bottom: 1px solid #eee; color: #FFF; }
#tb-style1 thead tr th:last-child{border-right: 0;}
#tb-style1 tbody tr th{background-color: #f9f9f9; padding: 1em 0.5em; color: #222; font-weight: 500;
						border-bottom: 1px solid #dedede; border-right: 1px solid #eee;  word-break: unset !important;}
#tb-style1 tbody tr td{padding: 1em 0.5em; border-bottom: 1px solid #dedede; border-right: 1px solid #dedede; background:#FFF}
#tb-style1 tbody tr td:last-child{border-right: 0;}

#tb-style1.cscenter2 thead tr th {width:60%;}
#tb-style1.cscenter2 thead tr th:last-child {width:40%; }

@media all and (max-width:1080px){
	#tb-style1.cscenter2 thead tr th {width:75%}
	#tb-style1.cscenter2 thead tr th:last-child {width:25%}
} 
@media all and (max-width:480px){
	#tb-style1 thead tr th {padding: 1em 0.5em;}
} 



#near2-1 {text-align:center;  }
#near2-1 img {width:100%; max-width:960px;  }
#near2-1 .contWrap { background:#303845; padding:2em}
#near2-1 .cont {display:flex;;justify-content:center;align-content: center; gap:20px; }
#near2-1 .cont li {width:500px;  border:8px solid #f5f8fb; background:#FFF}
#near2-1 .cont li dl dt {background:#124f99; color:#FFF; font-size:2.4rem; font-weight:600; padding:0.5em }
#near2-1 .cont li.bg2 {border-color:#f5fbf9}
#near2-1 .cont li.bg2 dl dt {background:#12998d }
#near2-1 .cont li dl dd {font-size:1.8rem; padding:2em; line-height:1.6em;}

@media all and (max-width:1280px){
	#near2-1 .cont li dl dd { padding:1em;line-height:1.4em;}
} 
@media all and (max-width:880px){
	#near2-1 .cont {flex-wrap:wrap;  gap:5px; }
	#near2-1 .cont li { border-width:3px}
} 

.l_img{margin-top: 100px;position: relative;}
.l_img::after{content: 'PERSONAL EYES'; position: absolute; top: 0; left: 0%; font-family: 'Montserrat'; font-weight: 800; font-size:8rem; color: #124f99;opacity: 0.3; line-height: 8rem;}
.l_img::before{content: '2DAY LASEK'; position: absolute; bottom: 0;right: 0%; font-family: 'Montserrat'; font-weight: 800; font-size:8rem; color: #124f99;opacity: 0.3; line-height: 8rem;}
.l_img img{max-width: 500px; width: 100%;}
.bgab{background: aliceblue !important;}

@media all and (max-width:1280px){
    .l_img{margin-top: 70px;}
    .l_img::after{line-height: 6rem; font-size: 6rem;}
    .l_img::before{line-height: 6rem; font-size: 6rem;}
}
@media all and (max-width:680px){
    .l_img{margin-top: 50px;}
    .l_img::after{line-height: 4rem; font-size: 4rem;}
    .l_img::before{line-height: 4rem; font-size: 4rem;}
}